.rpt-rush-options {
	margin: 12px 0;
	/* form.cart is usually a wrapping flex row (qty + button); take a full
	 * row of our own so the options span the whole column. */
	flex: 0 0 100%;
	width: 100%;
}

/* Some builders cap the add-to-cart form's width (Breakdance: 360px via
 * --bde-woo-forms__wrappers-small). Lift that only on forms that carry
 * our options, so they use the full width of the product column. */
form.cart:has(.rpt-rush-options),
.breakdance-woocommerce div.product form.cart:has(.rpt-rush-options) {
	max-width: none;
}

.rpt-rush-title {
	margin: 0 0 8px;
}

/* Event date — sits above Production Leadtime as its own option. */
.rpt-event-date {
	margin: 0 0 20px;
}

.rpt-event-date-input {
	width: 100%;
	max-width: 240px;
	padding: 10px 12px;
	border: 1px solid #ccc;
	border-radius: 0;
	background: #fff;
	font: inherit;
	cursor: pointer;
}

.rpt-event-date-notice {
	margin: 8px 0 0;
	color: #c0392b;
	font-weight: 600;
	font-size: 0.9em;
}

/* jQuery UI datepicker — WordPress ships the script but no front-end
 * theme, so this is a small self-contained one. Scoped to .rpt-datepicker
 * (added on open) so other plugins' datepickers aren't affected. */
.rpt-datepicker.ui-datepicker {
	display: none;
	z-index: 9999 !important;
	width: 280px;
	padding: 10px;
	background: #fff;
	border: 1px solid #ddd;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
	font-size: 14px;
}

.rpt-datepicker .ui-datepicker-header {
	position: relative;
	padding: 4px 0 10px;
	text-align: center;
}

.rpt-datepicker .ui-datepicker-title {
	font-weight: 600;
	line-height: 28px;
}

.rpt-datepicker .ui-datepicker-prev,
.rpt-datepicker .ui-datepicker-next {
	position: absolute;
	top: 4px;
	width: 28px;
	height: 28px;
	cursor: pointer;
	text-decoration: none;
	color: inherit;
}

.rpt-datepicker .ui-datepicker-prev {
	left: 0;
}

.rpt-datepicker .ui-datepicker-next {
	right: 0;
}

.rpt-datepicker .ui-datepicker-prev span,
.rpt-datepicker .ui-datepicker-next span {
	display: none;
}

.rpt-datepicker .ui-datepicker-prev::before,
.rpt-datepicker .ui-datepicker-next::before {
	display: block;
	line-height: 28px;
	font-size: 18px;
}

.rpt-datepicker .ui-datepicker-prev::before {
	content: "\2039";
}

.rpt-datepicker .ui-datepicker-next::before {
	content: "\203A";
}

.rpt-datepicker .ui-state-disabled.ui-datepicker-prev,
.rpt-datepicker .ui-state-disabled.ui-datepicker-next {
	opacity: 0.3;
	cursor: default;
}

.rpt-datepicker table.ui-datepicker-calendar {
	width: 100%;
	margin: 0;
	border-collapse: collapse;
	border: 0;
}

.rpt-datepicker .ui-datepicker-calendar th,
.rpt-datepicker .ui-datepicker-calendar td {
	padding: 1px;
	border: 0;
	background: none;
	text-align: center;
}

.rpt-datepicker .ui-datepicker-calendar th {
	font-size: 12px;
	font-weight: 600;
	padding-bottom: 4px;
}

.rpt-datepicker .ui-datepicker-calendar td a,
.rpt-datepicker .ui-datepicker-calendar td span {
	display: block;
	padding: 6px 0;
	text-decoration: none;
	color: #191919;
}

.rpt-datepicker .ui-datepicker-calendar td a:hover {
	background: #f0f0f0;
}

.rpt-datepicker .ui-datepicker-calendar .ui-state-disabled span {
	color: #bbb;
}

.rpt-datepicker .ui-datepicker-calendar .ui-datepicker-today a {
	outline: 1px solid #191919;
	outline-offset: -1px;
}

.rpt-datepicker .ui-datepicker-calendar a.ui-state-active {
	background: #191919;
	color: #fff;
}

/* Production options: two columns (filled across, row by row) on desktop
 * and tablet, one column on phones. */
.rpt-rush-radio-list {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	column-gap: 16px;
	row-gap: 4px;
}

.rpt-rush-radio-row {
	margin: 0;
	padding: 2px 0;
}

@media (max-width: 767px) {
	.rpt-rush-radio-list {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* Option fee amount: same weight as the option name (themes often make
 * .woocommerce-Price-amount bold). */
.rpt-option-fee,
.rpt-option-fee .woocommerce-Price-amount,
.rpt-option-fee bdi {
	font-weight: inherit;
}

.rpt-ship-date-preview {
	margin-top: 10px;
	font-weight: 600;
	color: #2c6e2f;
}

/* Icon + text rows (ship-out, delivery). */
.rpt-preview-line {
	display: flex;
	align-items: flex-start;
	gap: 8px;
}

.rpt-preview-line svg {
	flex: 0 0 auto;
	margin-top: 0.15em;
}

.rpt-order-ship-date {
	margin: 10px 0;
	padding: 10px 12px;
	background: #f6f7f7;
	border-left: 4px solid #7f54b3;
}

.rpt-order-ship-date .rpt-pending {
	color: #a06400;
	font-weight: 600;
}

.rpt-order-ship-date .rpt-confirmed {
	color: #2c6e2f;
	font-weight: 600;
}

.rpt-order-ship-date .rpt-notice {
	display: block;
	margin-top: 6px;
	font-size: 0.9em;
	color: #c0392b;
	font-weight: 600;
}

/* Product page: conflicting lead times notice, under the options. */
.rpt-conflict-notice {
	margin: 8px 0 0;
	color: #c0392b;
	font-weight: 600;
	font-size: 0.9em;
}

.rpt-rush-select-notice {
	margin: 6px 0 0;
	color: #c0392b;
	font-weight: 600;
	font-size: 0.9em;
}

/* Cart line-item details: put our rows on their own lines (the block cart
 * otherwise runs them together with " / ") and make the late-delivery
 * notice red. Block cart classes are derived from the item-data key. */
.wc-block-components-product-details__production-leadtime,
.wc-block-components-product-details__event-date,
.wc-block-components-product-details__notice {
	display: block;
}

.wc-block-components-product-details__production-leadtime > span[aria-hidden="true"],
.wc-block-components-product-details__event-date > span[aria-hidden="true"] {
	display: none;
}

.wc-block-components-product-details__notice,
dl.variation dt.variation-Notice,
dl.variation dd.variation-Notice {
	color: #c0392b;
	font-weight: 600;
}

/* Block Checkout order summary: line up with the Subtotal/Total rows.
 * Mirrors WooCommerce's own checkout.css rule
 * (.wc-block-components-sidebar .wc-block-components-totals-item), scoped
 * to the Checkout block only — in the Cart block WooCommerce gives those
 * rows no side padding, so ours stays at 0 there too. */
.wp-block-woocommerce-checkout .wc-block-components-sidebar .rpt-block-order-summary {
	padding-left: 16px;
	padding-right: 16px;
}

.rpt-cart-summary {
	margin: 12px 0;
	padding: 10px 12px;
	background: #f6f7f7;
	border-left: 4px solid #7f54b3;
}

.rpt-cart-ship-line,
.rpt-cart-delivery-line {
	margin: 0 0 4px;
}

.rpt-cart-conflict-notice {
	margin: 6px 0 0;
	color: #c0392b;
	font-weight: 600;
	font-size: 0.9em;
}

table.rpt-email-rush-table {
	width: 100%;
	border-collapse: collapse;
	margin: 10px 0 20px;
}

table.rpt-email-rush-table th,
table.rpt-email-rush-table td {
	border: 1px solid #e5e5e5;
	padding: 6px 10px;
	text-align: left;
	font-size: 13px;
}

/*
 * Product edit screen — "Rush Options" tab.
 * Scoped under the panel's own ID so these rules win over WooCommerce's
 * generic .options_group .form-field label { float:left; width:150px }
 * convention, which is meant for short field captions and otherwise
 * badly wraps full sentences and disrupts the rest of the panel's layout.
 */
#rpt_rush_options_data {
	overflow: hidden; /* Contain any residual floats from WC's own markup. */
}

#rpt_rush_options_data .options_group {
	padding: 12px;
}

#rpt_rush_options_data label {
	float: none !important;
	width: auto !important;
	margin: 0 !important;
}

#rpt_rush_options_data .rpt-mode-heading {
	font-weight: 600;
	margin: 0 0 10px;
}

#rpt_rush_options_data .rpt-mode-row {
	margin: 6px 0;
}

#rpt_rush_options_data .rpt-mode-row label {
	display: block;
}

#rpt_rush_options_data .rpt-mode-section {
	margin: 10px 0 16px 24px;
	padding: 12px;
	background: #f6f7f7;
	border-left: 3px solid #ccc;
	max-width: 640px;
}

#rpt_rush_options_data .rpt-option-picker p {
	margin: 6px 0;
}

#rpt_rush_options_data select {
	max-width: 100%;
}

/* Pricing Groups admin page uses the same option-picker markup. */
.rpt-option-picker p {
	margin: 6px 0;
}

/* Action columns (Update/Delete/Edit buttons) across all admin tables —
 * centered both horizontally and vertically within their cell.
 * Element + class selector needed to out-specificity WooCommerce's own
 * .widefat td { vertical-align: top } rule. */
td.rpt-action-cell {
	text-align: center;
	vertical-align: middle;
}

/* Product page Ordered/Completed/Shipped/Delivered timeline:
 * four light grey boxes side by side, separated by a 4px gap (the same
 * spacing two 2px transparent borders would give, without an outer
 * inset); 2 x 2 on phones. */
.rpt-timeline {
	margin: 16px 0;
}

.rpt-timeline-text p {
	margin: 4px 0;
}

.rpt-timeline-visual .rpt-timeline-row {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 4px;
}

.rpt-timeline-visual .rpt-timeline-cell {
	min-width: 0;
	text-align: center;
	padding: 16px 6px;
	background: #f4f4f4;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
}

/* Date range stacked: date / dash / date. The dash takes no vertical space
 * (it sits between the two dates as a subtle separator), and the second
 * date is nudged up 2px to tighten the pair. */
.rpt-timeline-visual .rpt-timeline-date-range {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.rpt-timeline-visual .rpt-timeline-date-sep {
	display: block;
	line-height: 0;
	font-size: 12px;
	margin: 0;
}

.rpt-timeline-visual .rpt-timeline-date-range > span:last-child {
	margin-top: -2px;
}

@media (max-width: 479px) {
	.rpt-timeline-visual .rpt-timeline-row {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

.rpt-timeline-visual .rpt-timeline-icon {
	color: #222;
	line-height: 0;
}

.rpt-timeline-visual .rpt-timeline-label {
	font-weight: bold;
	font-size: 14px;
}

.rpt-timeline-visual .rpt-timeline-date {
	color: #000000;
	font-size: 14px;
}