/**
 * ut-availability — ONE shared front-end stylesheet for the whole plugin.
 *
 * Consolidated (v0.18.4) from: from-price-info.css, price-table.css,
 * side-cart.css, and the four inline <style> blocks the frontend form used to
 * print (people picker, breakdown, top-price + ranges, add-ons). One file =
 * one HTTP fetch, styles present for AJAX-inserted markup, and no more
 * per-surface drift. Admin-screen and email styles deliberately stay where
 * they are (emails REQUIRE inline for Emogrifier).
 */

.ut-booking-form .ut-from-price__info {display: none;}

/* ═══════════════ PEOPLE PICKER (person-type module) ═══════════════ */
/* ─── People picker ───────────────────────────────────────── */
.ut-booking-people { position: relative; margin: 16px 0; }
.ut-booking-people__label { display: block; font-weight: 600; margin-bottom: 8px; }

.ut-booking-people__trigger {
    box-sizing: border-box; min-height: 48px;
    display: flex; justify-content: space-between; align-items: center;
    width: 100%; padding: 12px 14px;
    background: #fff; border: 1px solid #e5e7eb; border-radius: 10px;
    font-size: 15px; line-height: 1.4; text-align: left; cursor: pointer;
    transition: border-color 0.12s, box-shadow 0.12s;
}
.ut-booking-people__trigger:hover { border-color: #dfe3e8; }
/* Đồng bộ style với Options (ut-ac-toggle): card rời, KHÔNG vỏ sò —
   panel có thể lật lên trên (portal flip) nên không được dán liền. */
.ut-booking-people__trigger[aria-expanded="true"] { border-color: #2271b1; box-shadow: 0 0 0 3px rgba(34,113,177,.12); }
.ut-booking-people__trigger-text { flex: 1; color: #6b7280; }
.ut-booking-people__trigger.has-selection .ut-booking-people__trigger-text {
    flex: 0 1 auto; align-self: center;
    background: #2271b1; color: #fff;
    padding: 4px 12px; border-radius: 999px;
    font-size: 13px; font-weight: 600; line-height: 1.4;
}
.ut-booking-people__trigger-caret { font-size: 12px; color: #666; margin-left: 8px; }

.ut-booking-people__panel {
    position: absolute; left: 0; right: 0; top: 100%; margin-top: 8px;
    background: #fff; border: 1px solid #e5e7eb;
    border-radius: 12px;
    box-shadow: 0 8px 20px rgba(0,0,0,0.08);
    padding: 6px 0; z-index: 100;
    display: none !important;
    background-image: linear-gradient(134deg, #f2f6fd, #f9fafa);
}
.ut-booking-people__panel.is-open {
    display: block !important;
}

/* ─── Stacking: an OPEN dropdown must overlay sibling fields AND any
       following booking form on the page (N-form). Panels carry a z-index,
       but their container needs one too, else the panel is trapped below
       later content. Lift the whole form + the open field when open. */
.ut-booking-form { position: relative; }
.ut-booking-form:has(.ut-booking-people__panel.is-open),
.ut-booking-form:has(.ut-ac-toggle[aria-expanded="true"]) { z-index: 500; }
.ut-booking-people:has(.ut-booking-people__panel.is-open) { z-index: 400; }
.ut-ac-fields:has(.ut-ac-toggle[aria-expanded="true"]) { z-index: 400; }
.ut-booking-people__title {
    padding: 14px 20px 4px;
    font-size: 18px; font-weight: 700; color: #1a1a1a;
}
.ut-pt-pick-row {
    display: flex; align-items: center; justify-content: space-between;
    gap: 16px;
    padding: 12px 20px;
}
.ut-pt-pick-info { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ut-pt-pick-info__head { display: flex; align-items: center; gap: 6px; }
.ut-pt-pick-label { font-weight: 600; font-size: 15px; color: #1a1a1a; }
.ut-pt-pick-desc { font-size: 13px; color: #8a8f98; line-height: 1.35; }
.ut-pt-pick-foc {
    font-size: 11px; font-weight: 600;
    padding: 2px 6px; border-radius: 3px;
    background: #e8f5e8; color: #2b6a2b;
}
.ut-pt-pick-qty { display: flex; align-items: center; gap: 4px; flex: 0 0 auto; }
.ut-pt-pick-btn {
    width: 42px; height: 42px;
    flex: 0 0 42px; min-width: 42px; /* flex items shrink below width otherwise */
    display: inline-flex; align-items: center; justify-content: center;
    background: #fff; border: 1px solid #ececec; border-radius: 50%;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .10);
    color: #3c4043; font-size: 20px; font-weight: 400; line-height: 1;
    cursor: pointer; padding: 0;
    transition: box-shadow .15s, border-color .15s, background .15s, color .15s;
}
.ut-pt-pick-btn:hover { border-color: #d8dadd; box-shadow: 0 3px 10px rgba(0, 0, 0, .14); background: #fff; color: #1a1a1a; }
.ut-pt-pick-btn:disabled {
    background: #f1f3f4; border-color: transparent; box-shadow: none;
    color: #b6babf; cursor: not-allowed;
}
/* High-specificity + !important: themes commonly style
   input[type="number"] (width:100%, border, padding) and would
   blow the qty box up to the full row width on narrow screens. */
.ut-booking-people__panel input.ut-pt-pick-input {
    width: 3ch !important;          /* fits the value, not the row */
    min-width: 34px !important;
    max-width: 64px !important;
    flex: 0 0 auto;
    field-sizing: content;          /* true content sizing where supported */
    padding: 4px 0 !important;
    height: auto !important;
    min-height: 0 !important;
    text-align: center; font-weight: 600; font-size: 16px; color: #1a1a1a;
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    -moz-appearance: textfield;
}
.ut-pt-pick-input::-webkit-outer-spin-button,
.ut-pt-pick-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

.ut-booking-people__footer { padding: 8px 16px 4px; text-align: right; }
.ut-booking-people__close-btn {
    background: none; border: none; color: #2271b1;
    cursor: pointer; font-size: 14px; font-weight: 500;
}
.ut-booking-people__close-btn:hover { text-decoration: underline; }


/* ═══════════════ PRICE BREAKDOWN (person-type module) ═══════════════ */
.ut-booking-breakdown {
    margin: 16px 0;
    display: none !important;
}
.ut-booking-breakdown.is-visible {
    display: block !important;
}
.ut-booking-breakdown__lines {
    padding: 12px 0;
    border-top: 1px solid #e5e7eb;
}
.ut-booking-breakdown__line {
    display: flex; justify-content: space-between;
    padding: 6px 0; font-size: 14px; color: #444;
}
.ut-booking-breakdown__line-foc { color: #2b6a2b; }
/* Add-on group: a header (label + total) with indented per-type sub-lines. */
.ut-booking-breakdown__addon-head { font-weight: 600; color: #1a1a1a; padding-top: 10px; }
.ut-booking-breakdown__subline { padding: 2px 0 2px 16px; font-size: 13px; color: #6b7280; }
.ut-booking-breakdown__total-row {
    display: flex; justify-content: space-between; align-items: baseline;
    padding: 12px 0 4px;
    border-top: 2px solid #eceef1;
    font-size: 18px; font-weight: 700;
    color: #1a1a1a;
}


/* ═══════════════ FORM TOP PRICE + PRICE RANGES (person-type module) ═══════════════ */
.ut-booking-form-top-price {
    font-size: 1.8em;
    font-weight: 700;
    margin: 0 0 16px;
    color: #1a1a1a;
}
/* "From" prefix + "/ person" suffix stay secondary to the amount,
   matching the catalogue treatment of the same markup. */
.ut-booking-form-top-price .ut-from-price__prefix,
.ut-booking-form-top-price .ut-from-price__suffix {
    font-size: 55%;
    font-weight: 500;
    color: #888;
}
/* The struck-through peak price must never compete with the real "from"
   amount: same demotion as prefix/suffix, so the LOWEST price is the only
   big number a guest reads (the listing-price rule). */
.ut-booking-form-top-price .ut-from-price__was {
    font-size: 55%;
    font-weight: 500;
}
/* Inline Price-Rule × Date-Rule ranges (same data as the (i) badge). */
.ut-booking-price-ranges {
    margin: -8px 0 16px;
    font-size: 13px;
    color: #667085;
        background: #f8f8f8;
    padding: 15px;
    border-radius: 10px;
}
.ut-booking-price-ranges__row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 14px;
    padding: 3px 0;
}
.ut-booking-price-ranges__row + .ut-booking-price-ranges__row {
    border-top: 1px dashed #f0f0f1;
}
.ut-booking-price-ranges__price .amount {
    font-weight: 600;
    color: #1d2327;
}
.ut-booking-price-ranges__row--base .ut-booking-price-ranges__price .amount {
    font-weight: 500;
    color: #667085;
}
.ut-booking-price-ranges__row--more {
    border-top: 1px dashed #f0f0f1;
}
.ut-from-price__more {
    padding: 0;
    border: none;
    background: none;
    box-shadow: none;
    color: #2271b1;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}
.ut-from-price__more:hover {
    background: none;
    color: #185a92;
    text-decoration: underline;
}


/* ═══════════════ ADD-ONS / ADDITIONAL COSTS (frontend) ═══════════════ */
.ut-ac-fields { --ut-ac-accent: #2271b1; position: relative; margin: 16px 0; }
.ut-ac-label { display: block; font-weight: 600; margin-bottom: 8px; }
.ut-ac-toggle { box-sizing: border-box; min-height: 48px; display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 12px 14px; font-size: 15px; line-height: 1.4; text-align: left; background: #fff; border: 1px solid #e5e7eb; border-radius: 10px; color: inherit; cursor: pointer; transition: border-color .12s, box-shadow .12s; }
.ut-ac-toggle:hover { border-color: #dfe3e8; }
.ut-ac-toggle[aria-expanded="true"] { border-color: var(--ut-ac-accent); box-shadow: 0 0 0 3px rgba(34,113,177,.12); }
.ut-ac-toggle-text { flex: 1 1 auto; font-weight: 600; color: #6b7280; }
.ut-ac-toggle.has-selection .ut-ac-toggle-text {
    flex: 0 1 auto; align-self: center;
    background: var(--ut-ac-accent); color: #fff;
    padding: 4px 12px; border-radius: 999px;
    font-size: 13px; font-weight: 600; line-height: 1.4;
}
.ut-ac-toggle-caret { font-size: 11px; color: #888; margin-left: 8px; transition: transform .15s; }
.ut-ac-toggle[aria-expanded="true"] .ut-ac-toggle-caret { transform: rotate(180deg); }
.ut-ac-panel { display: none; position: absolute; left: 0; right: 0; top: 100%; margin-top: 8px; z-index: 90; border: 1px solid #e5e7eb; border-radius: 12px; padding: 4px 16px 14px; background: #fff; box-shadow: 0 8px 20px rgba(0,0,0,0.08); background-image: linear-gradient(134deg, #f2f6fd, #f9fafa);}
.ut-ac-panel.is-open { display: block; }
.ut-ac-group { padding-top: 14px; margin-top: 14px; border-top: 1px solid #f0f1f3; }
.ut-ac-group:first-of-type { border-top: 0; margin-top: 0; padding-top: 0; }
.ut-ac-group-title { font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #9096a0; margin-bottom: 8px; }
.ut-ac-option { display: flex; align-items: center; gap: 12px; padding: 11px 13px; margin: 6px 0; border: 1px solid #eceef1; border-radius: 10px; cursor: pointer; transition: border-color .12s, background .12s; }
.ut-ac-option:hover { background: #f8fafc; border-color: #dfe3e8;}
.ut-ac-option input { accent-color: var(--ut-ac-accent); width: 18px; height: 18px; margin: 0; flex: 0 0 auto; }
.ut-ac-option-label { flex: 1 1 auto; font-weight: 600; }
.ut-ac-option-price { font-weight: 700; white-space: nowrap; }
.ut-ac-option-mode { font-size: 11px; color: #7c828c; background: #f1f3f5; padding: 3px 9px; border-radius: 999px; white-space: nowrap; }
.ut-ac-option:has(input:checked) { border-color: var(--ut-ac-accent); background: #f2f8fd; }
.ut-ac-option:has(input:checked) .ut-ac-option-price { color: var(--ut-ac-accent); }


/* ═══════════════ FROM PRICE (catalogue + info popover) — was from-price-info.css ═══════════════ */
/* (i) badge next to "From" prices + its price-ranges popover. */

/* Cột phải của khối giá: amount + suffix trên, nút (i) + label ở dòng cuối. */
.ut-from-price__body {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    vertical-align: middle;
}
.ut-from-price__info {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin: 2px 0 0;
    padding: 0;
    border: 0;
    background: none;
    color: #0b5b9b;
    font-size: 12px;
    font-weight: normal;
    line-height: 1.2;
    text-transform: none;
    letter-spacing: 0;
    white-space: nowrap;
    cursor: pointer;
    transition: all .12s;
    box-shadow: none;
}
.ut-from-price__info-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 14px;
    height: 14px;
    border: 1.5px solid #2271b1;
    border-radius: 50%;
    font: italic 700 11px/1 Georgia, "Times New Roman", serif;
    flex-shrink: 0;
}
.ut-from-price__info:hover,
.ut-from-price__info:focus {
    background: none;
    color: #2271b1;
    outline: none;
}
.ut-from-price__info-label {
    border-bottom: 1px dotted currentColor;
}

/* Popover (appended to <body>, positioned by JS). */
.ut-price-ranges-pop {
    position: absolute;
    z-index: 100001;
    min-width: 230px;
    max-width: 320px;
    max-height: 55vh;     /* long rule lists scroll inside the popover */
    overflow-y: auto;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .14);
    padding: 12px 14px;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.5;
    color: #1d2327;
    text-align: left;
}
.ut-price-ranges-pop__title {
    font-size: 13px;
    font-weight: 600;
    margin: 0 0 8px;
}
.ut-price-ranges-pop__row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 14px;
    padding: 3px 0;
}
.ut-price-ranges-pop__row + .ut-price-ranges-pop__row {
    border-top: 1px dashed #f0f0f1;
}
.ut-price-ranges-pop__row .amount {
    font-weight: 600;
}
.ut-price-ranges-pop__row--base {}
.ut-price-ranges-pop__loading {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 0;
}
.ut-price-ranges-pop__spinner {
    width: 18px;
    height: 18px;
    border: 2px solid #e5e7eb;
    border-top-color: #2271b1;
    border-radius: 50%;
    animation: ut-price-ranges-spin .7s linear infinite;
}
@keyframes ut-price-ranges-spin {
    to { transform: rotate(360deg); }
}
@media (prefers-reduced-motion: reduce) {
    .ut-price-ranges-pop__spinner {
        animation-duration: 1.6s;
    }
}

/* ── Khối "From" + giá cao nhất (kiểu sale price) ─────────────────────────
   Xếp dọc: chữ From trên, giá cao nhất dưới với gạch CHÉO đỏ xuyên qua
   (::after xoay -8deg — line-through thường chỉ gạch ngang). Cả hai #888;
   giá from giữ nguyên là giá chính bên cạnh. */
.ut-from-price__head {
	display: inline-flex;
	flex-direction: column;
	align-items: flex-start;
	vertical-align: middle;
	margin-right: 6px;
	line-height: 1.25;
	color: #888;
}
.ut-from-price__head .ut-from-price__prefix {color: #888;}
.ut-from-price__was {
	position: relative;
	display: inline-block;
	color: #555;
	line-height: 0;
}
.ut-from-price__was .woocommerce-Price-amount,
.ut-from-price__was .woocommerce-Price-amount * {color: #555; font-weight: normal; margin: 0; line-height: 1}
.ut-from-price__was::after {
	content: "";
	position: absolute;
	left: -3%;
	right: -3%;
	top: 50%;
	opacity: 0.5;
	height: 2px;
	margin-top: -1px;
	background: #d90000;
	transform: rotate(-8deg);
	pointer-events: none;
}

.ut-from-price__head .ut-from-price__prefix,
.price .ut-from-price__was .amount {font-size: 13px; color: #888 !important;}
.price .ut-from-price__was .amount {margin: 3px 1px; font-size: 14px !important}


/* ═══════════════ PRICE TABLE block — was price-table.css ═══════════════ */
/* Upgrade Price Table (TL6) — front end + editor. */

.ut-price-table {
	margin: 16px 0;
}

.ut-price-table__intro {
	margin: 0 0 10px;
}

.ut-price-table__table {
	border-collapse: collapse;
	width: auto;
	max-width: 100%;
}

.ut-price-table__cell {
	border: 1px solid #ddd;
	padding: 8px 12px;
	vertical-align: top;
	text-align: left;
}

.ut-price-table__label {
	display: block;
	font-weight: 600;
}

.ut-price-table__sub {
	display: block;
	font-size: 80%;
	font-weight: bold;
	color: #999;
}

.ut-price-table__price {
	font-weight: bold;
}

.ut-price-table__price .symbol {
	font-size: 85%;
}

/* Editor placeholder (Phase 3a). */
.ut-price-table-editor {
	border: 1px dashed #c3c4c7;
	border-radius: 6px;
	padding: 12px 14px;
	background: #f6f7f7;
}

.ut-price-table-editor__title {
	margin: 0;
	font-weight: 600;
}

.ut-price-table-editor__hint {
	margin: 8px 0 0;
	opacity: 0.7;
	font-size: 12px;
}

/* Editor header: title + template picker + save (Phase 4b). */
.ut-pte__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	flex-wrap: wrap;
	margin-bottom: 8px;
	padding-bottom: 8px;
	border-bottom: 1px solid #e0e0e0;
}

.ut-pte__header-title {
	font-weight: 600;
}

.ut-pte__header-tools {
	display: flex;
	align-items: flex-end;
	gap: 8px;
}

.ut-pte__header-tools .ut-pte__tpl {
	margin-bottom: 0;
	min-width: 160px;
}

/* Editor grid builder (Phase 3b). */
.ut-pte__toolbar {
	display: flex;
	gap: 8px;
	margin: 8px 0;
}

.ut-pte__grid {
	border-collapse: collapse;
	width: 100%;
}

.ut-pte__grid th,
.ut-pte__grid td {
	border: 1px solid #dcdcde;
	padding: 6px;
	vertical-align: top;
}

.ut-pte__colhead,
.ut-pte__rowctrl {
	text-align: center;
	background: #f0f0f1;
	white-space: nowrap;
}

.ut-pte__cell {
	min-width: 150px;
}

.ut-pte__cell .components-base-control {
	margin-bottom: 6px;
}


/* ═══════════════ SIDE CART — was side-cart.css ═══════════════ */
body.ut-sidecart-open {overflow: hidden;}

.ut-cart-trigger {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	color: inherit;
	line-height: 1;
}

.ut-cart-trigger__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.ut-cart-trigger__count {
	position: absolute;
	top: -7px;
	right: -9px;
	min-width: 18px;
	height: 18px;
	padding: 0 5px;
	border-radius: 999px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 11px;
	font-weight: 700;
	line-height: 1;
	background: #e53935;
	color: #fff;
	box-sizing: border-box;
}

.ut-sidecart-overlay {
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, 0.42);
	opacity: 0;
	visibility: hidden;
	transition: opacity .25s ease, visibility .25s ease;
	z-index: 99998;
}

.ut-sidecart {
	position: fixed;
	top: 0;
	right: 0;
	width: min(420px, 92vw);
	height: 100vh;
	background: #fff;
	box-shadow: -8px 0 30px rgba(0,0,0,.12);
	transform: translateX(100%);
	transition: transform .25s ease;
	z-index: 99999;
	display: flex;
	flex-direction: column;
	outline: none;
}

body.ut-sidecart-open .ut-sidecart {
	transform: translateX(0);
}

body.ut-sidecart-open .ut-sidecart-overlay {
	opacity: 1;
	visibility: visible;
}

.ut-sidecart__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 18px 18px 16px;
	border-bottom: 1px solid #eee;
}

.ut-sidecart__title-wrap {
	display: flex;
	align-items: center;
	gap: 10px;
}

.ut-sidecart__title {
	margin: 0;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.2;
}

.ut-sidecart__count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 24px;
	height: 24px;
	padding: 0 8px;
	border-radius: 999px;
	background: #f3f3f3;
	font-size: 12px;
	font-weight: 700;
}

.ut-sidecart__close {
	border: 0;
	background: #b33;
	font-size: 28px;
	line-height: 1;
	cursor: pointer;
	padding: 0;
	width: 32px;
	height: 32px;
	border-radius: 50px;
}

.ut-sidecart__body {
	flex: 1 1 auto;
	overflow: auto;
	padding: 0 16px 16px 16px;
}

.ut-sidecart__footer {
	border-top: 1px solid #eee;
	padding: 16px 18px 18px;
	background: #fff;
}

.ut-sidecart__subtotal-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 14px;
	font-size: 15px;
}

.ut-sidecart__subtotal-label {
	font-weight: 600;
}

.ut-sidecart__subtotal {
	font-weight: 700;
}

.ut-sidecart__actions {
	display: grid;
	grid-template-columns: 1fr;
	gap: 10px;
}

.ut-sidecart__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	text-decoration: none;
	border-radius: 8px;
	padding: 10px 16px;
	box-sizing: border-box;
}

.ut-sidecart-empty {
	padding: 24px 0;
}

.ut-sidecart-empty__text {
	margin: 0 0 14px;
}

.ut-sidecart-empty__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 42px;
	padding: 10px 16px;
	text-decoration: none;
}

/* Mini cart từ Woo */
.ut-sidecart .woocommerce-mini-cart {
	list-style: none;
	margin: 0;
	padding: 0;
}

.ut-sidecart .woocommerce-mini-cart-item {
	position: relative;
	display: flex;
	flex-direction: column;
	padding: 5px 0;
	border-bottom: 1px solid #ddd;
}

.ut-sidecart .woocommerce-mini-cart-item .product-sku {color: #777;}

.woocommerce-mini-cart-item__price {font-size: 18px;}

.woocommerce-mini-cart-item__name {display: flex; flex-direction: column; margin: 5px 0;}

.ut-sidecart .woocommerce-mini-cart-item a {
	text-decoration: none;
}

.woocommerce-mini-cart-item__thumbnail {margin: 0 0 5px 0;}

.ut-sidecart .woocommerce-mini-cart-item img {
	width: auto;
	height: 100px;
	display: block;
	border-radius: 5px;
}

.ut-sidecart .remove {
	position: absolute;
	top: 8px;
	right: 0;
	text-decoration: none;
	font-size: 18px;
	line-height: 1;
}

.ut-sidecart .quantity {
	display: block;
	margin-top: 6px;
	font-size: 13px;
	opacity: .85;
}

.ut-sidecart .woocommerce-mini-cart__total,
.ut-sidecart .woocommerce-mini-cart__buttons {
	margin-top: 14px;
}

.ut-sidecart .woocommerce-mini-cart__buttons .button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 42px;
	padding: 5px 14px;
	text-decoration: none;
	margin-right: 8px;
	margin-bottom: 8px;
	line-height: 2;
	border: 2px solid #000;
}

/* ═══════════════════════════════════════════════════════════════════════════
 * v0.18.9 — the last three inline blocks folded in (owner: one stylesheet for
 * the whole plugin). They used to ride wp_add_inline_style with a PHP-side
 * gate deciding WHERE they applied; in one shared file that gate is gone, so
 * each block below carries its own scope in the SELECTOR instead — which is
 * the stronger form anyway (survives page caching, one source of truth).
 * ═══════════════════════════════════════════════════════════════════════════ */

/* ── Booking form: datepicker, people, add-ons, breakdown (was
 *    Frontend_Form::get_inline_css) ───────────────────────────────────────── */
.ut-availability-datepicker-wrap {
    margin: 16px 0;
    position: relative;
    z-index: 10;
}
.ut-availability-label {
    display: block;
    font-weight: 600;
    margin-bottom: 6px;
}
.ut-availability-required {
    color: #d63638;
}
.ut-availability-datepicker-field {
    position: relative;
    width: 100%;
}
.ut-availability-datepicker {
    width: 100%;
    padding: 12px 36px 12px 14px !important;  /* extra right padding for caret */
    font-size: 15px;
    line-height: 1.4;
    border: 1px solid #e5e7eb !important;
    border-radius: 10px !important;
    cursor: pointer;
    background: #fff;
    pointer-events: auto !important;
    position: relative;
    z-index: 1;
    transition: border-color .12s, box-shadow .12s;
}
.ut-availability-datepicker:hover {
    border-color: #dfe3e8 !important;
}
.ut-availability-datepicker:focus {
    outline: none;
    border-color: #2271b1 !important;
    box-shadow: 0 0 0 3px rgba(34,113,177,.12) !important;
}
.ut-availability-datepicker-caret {
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 12px;
    color: #666;
    pointer-events: none;  /* clicks pass through to input */
    transition: transform 0.15s;
    z-index: 2;
}
.ut-availability-datepicker-field.is-open .ut-availability-datepicker-caret {
    transform: translateY(-50%) rotate(180deg);
}
.ut-availability-range-info {
    margin-top: 8px;
    padding: 8px 12px;
    background: #f0f6fc;
    border-left: 3px solid #2271b1;
    font-size: 14px;
    color: #1d2327;
}
.ut-availability-error {
    margin-top: 8px;
    padding: 6px 10px;
    background: #fcf0f1;
    border-left: 3px solid #d63638;
    color: #d63638;
    font-size: 14px;
}
/* Dropdown panel portaled to <body> (see assets/panel-portal.js): inline
   top/left/width are set by JS; kill the in-form left/right constraints. */
.ut-panel-portaled {
    position: absolute !important;
    right: auto !important;
    margin: 0 !important;
    z-index: 100000 !important;
}

/* Per-day price labels (airline style): day number on top, price under it. */
.flatpickr-calendar .flatpickr-day {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    height: 52px;
    line-height: 1.2;
}
.ut-day-price {
    font-size: 9.5px;
    font-weight: 600;
    color: #667085;
    pointer-events: none; /* clicks land on the day cell */
}
.ut-day-price.is-lowest {
    color: #008a20;
}
/* Departure-city custom dropdown (flight-component): the native select stays
   hidden as source of truth — native popups render detached inside the
   transformed modal / mobile emulation (same reason as the theme's .ut-sort). */
.ut-fc-gateway-field { position: relative; }
.ut-fc-gateway-field .ut-fc-native {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}
.ut-fc-dd { position: relative; }
.ut-fc-dd__toggle {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    background: #fff;
    border: 1px solid #aaa;
    border-radius: 6px;
    cursor: pointer;
    font: inherit;
    color: #222;
    text-align: left;
}
.ut-fc-dd__toggle[aria-expanded="true"] .ut-fc-dd__caret { transform: rotate(180deg); }
.ut-fc-dd__caret { transition: transform .2s; color: #667085; }
.ut-fc-dd__menu {
    position: absolute;
    top: 100%;
    margin: 4px 0 0;
    left: 0;
    right: 0;
    padding: 6px 0;
    list-style: none;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 6px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .14);
    z-index: 60;
    max-height: 260px;
    overflow: auto;
}
.ut-fc-dd__menu li { padding: 9px 14px; cursor: pointer; }
.ut-fc-dd__menu li:hover { background: #f2f6fa; }
.ut-fc-dd__menu li.is-active { background: #eef4fb; font-weight: 600; }

/* Locked date field (no departure city picked yet): keep the form's full
   shape — field visible but dimmed, clicks blocked, hover bubble explains.
   Message text comes from data-ut-locked-msg (set by the module JS, i18n). */
.ut-availability-datepicker-wrap.ut-fc-locked {
    position: relative;
    cursor: not-allowed;
}
.ut-fc-locked .ut-availability-datepicker-field,
.ut-fc-locked input {
    pointer-events: none;
}
.ut-fc-locked .ut-availability-datepicker-field {
    opacity: .55;
}
.ut-fc-locked:hover::after {
    content: attr(data-ut-locked-msg);
    position: absolute;
    bottom: calc(100% + 8px);
    left: 0;
    background: #1d2327;
    color: #fff;
    font-size: 12px;
    line-height: 1;
    padding: 8px 12px;
    border-radius: 6px;
    white-space: nowrap;
    z-index: 40;
    pointer-events: none;
    box-shadow: 0 4px 14px rgba(0, 0, 0, .18);
}
.ut-fc-locked:hover::before {
    content: "";
    position: absolute;
    bottom: calc(100% + 2px);
    left: 18px;
    border: 6px solid transparent;
    border-top-color: #1d2327;
    z-index: 40;
    pointer-events: none;
}

/* City-switch loading: dots per day + indeterminate sweep bar at the top
   edge of the calendar (flight-component sets cfg.dayLoading + appends
   .ut-cal-progress to the flatpickr container while the map is in flight). */
.ut-day-price.is-loading {
    color: #c3c4c7;
    letter-spacing: 2px;
    font-size: 8px;
}
.ut-cal-progress {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    overflow: hidden;
    border-radius: 5px 5px 0 0;
    pointer-events: none;
    background: rgba(34, 113, 177, .12);
}
.ut-cal-progress::before {
    content: "";
    position: absolute;
    top: 0;
    left: -40%;
    width: 40%;
    height: 100%;
    background: #2271b1;
    animation: utCalProgress 1.1s linear infinite;
}
@keyframes utCalProgress {
    to { left: 100%; }
}
/* Filler days of adjacent months: price dimmed in step with their day number. */
.flatpickr-day.prevMonthDay .ut-day-price,
.flatpickr-day.nextMonthDay .ut-day-price {
    opacity: .4;
}
.flatpickr-day.selected .ut-day-price,
.flatpickr-day.startRange .ut-day-price,
.flatpickr-day.endRange .ut-day-price {
    color: rgba(255, 255, 255, .85);
}
.flatpickr-day.selected .ut-day-price.is-lowest,
.flatpickr-day.startRange .ut-day-price.is-lowest,
.flatpickr-day.endRange .ut-day-price.is-lowest {
    color: #d1fadf;
}

/* Guard: ensure flatpickr calendar renders above theme content */
.flatpickr-calendar {
    z-index: 99999 !important;
}
/* v0.19.2 — the calendar hangs off <body> (see appendTo in the form script), so
 * it is never clipped by the modal's overflow box. What it still needs is a
 * ceiling: with a day price under every date it can outgrow a phone screen on
 * its own. The JS sets an exact max-height from the live viewport on open and
 * on scroll; these two lines make that height actually scrollable and stop the
 * month grid from being squashed while it does. */
.flatpickr-calendar.open {
    overflow-y: auto;
    overflow-x: hidden;             /* the day grid has a FIXED width — a horizontal
                                       axis only feeds the double-scrollbar deadlock:
                                       v-bar steals grid width → h-bar appears → h-bar
                                       steals height → v-bar always on (10px phantom) */
    width: auto;                    /* size to the grid; when the v-bar IS needed
                                       (short viewport) the box grows by the bar's
                                       width instead of squashing the day grid */
    min-width: 307.875px;           /* flatpickr's stock grid width */
    max-width: calc(100vw - 24px);
    overscroll-behavior: contain;   /* scrolling the calendar must not scroll the modal behind it */
}
.flatpickr-calendar.open .flatpickr-days {
    overflow: visible;
}
.flatpickr-calendar.open {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}
/* Close button injected into the calendar popup */
.ut-availability-fp-close-row {
    padding: 8px 16px 4px;
    text-align: right;
    border-top: 1px solid #f0f0f0;
}
.ut-availability-fp-close-btn {
    background: none;
    border: none;
    color: #2271b1;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    padding: 0;
}
.ut-availability-fp-close-btn:hover {
    text-decoration: underline;
}
@media (max-width: 768px) {
    .flatpickr-day {
        min-height: 52px; /* flex column layout (day number + price) */
    }
    .ut-availability-datepicker {
        font-size: 16px;
    }
}
/* Standalone add-to-cart (ut_booking_form() called directly, not inside WC's cart form). */
.ut-booking-form__cart {
    margin: 0;
}
.ut-booking-form__submit.single_add_to_cart_button {
    display: block;
    width: 100%;
    min-height: 48px;
    margin-top: 18px;
    padding: 0 18px;
    box-sizing: border-box;
    background: #2271b1;
    border: 1px solid #2271b1;
    border-radius: 10px;
    color: #fff;
    font-size: 16px;
    font-weight: 600;
    line-height: 46px;
    text-align: center;
    cursor: pointer;
    transition: background .12s, box-shadow .12s;
}
.ut-booking-form__submit.single_add_to_cart_button:hover {
    background: #185a92;
    border-color: #185a92;
}
.ut-booking-form__submit.single_add_to_cart_button:focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(34,113,177,.25);
}

/* ── Single product: hide the WooCommerce quantity box.
 *    Scoped to `body.ut-booking-product` (added by UT_Availability_Cart::
 *    body_class) — WITHOUT that class this rule would strip the quantity
 *    field from every ordinary product on the site, which is exactly what the
 *    old PHP gate was preventing. ─────────────────────────────────────────── */
/* UT Availability: hide quantity for booking products */
body.ut-booking-product.single-product form.cart .quantity {
    display: none !important;
}
/* Some themes wrap quantity + button in flex — keep button alignment */
body.ut-booking-product.single-product form.cart .quantity + .single_add_to_cart_button {
    margin-left: 0;
}

/* ── Cart / checkout: booking conflict states. Keyed to `.ut-cart-item--
 *    conflict-*`, classes only this plugin ever writes, so the rules are inert
 *    on any page that has no conflict to show. ───────────────────────────── */
/* Hard conflict (db/cart) — strong visual treatment */
.ut-cart-item--conflict-db,
.ut-cart-item--conflict-cart {
    opacity: 0.6;
    position: relative;
}
.ut-cart-item--conflict-db td.product-name a,
.ut-cart-item--conflict-cart td.product-name a {
    text-decoration: line-through;
    color: #888;
}
.ut-cart-item--conflict-db .ut-cart-item-data__row:last-child,
.ut-cart-item--conflict-cart .ut-cart-item-data__row:last-child {
    color: #c0392b;
    font-weight: 600;
    opacity: 1;
}

/* Soft warning (recent) — mild, informational */
.ut-cart-item--conflict-recent .ut-cart-item-data__row:last-child {
    color: #8a6d3b;
    font-weight: 500;
    background-color: #fcf8e3;
    padding: 4px 8px;
    border-left: 3px solid #f0ad4e;
}

/* Disabled checkout button */
.ut-checkout-disabled {
    pointer-events: none;
    opacity: 0.5;
    cursor: not-allowed;
}

/* ── Single product: hide the THEME's default add-to-cart button when the
 *    "Hide default add to cart" setting is on (body.ut-hide-default-cart,
 *    stamped by Frontend_Form::maybe_hide_default_add_to_cart).
 *    `:not(.ut-booking-form__cart)` keeps the submit button of a manually
 *    placed ut_booking_form() — only the theme's own one goes. ───────────── */
body.ut-hide-default-cart.single-product form.cart:not(.ut-booking-form__cart) .single_add_to_cart_button {
    display: none !important;
}
