/*!
 * Party Rental Core — the booking platform's cart and BookFlow, in the theme's style.
 *
 * Loaded on every page while the booking platform (InflatableOffice) runs: its
 * cart panel and buttons, and BookFlow's date window, form, date bar and
 * floating buttons, which any page can open (header cart, Book Now, Add to
 * Cart). The platform's own pages (category grids, item pages, quote form)
 * are styled by prt-io-pages.css, loaded only there (polish round 8).
 * Rules re-point their look at the active theme's tokens (--prt-*); nothing
 * here changes their behaviour.
 */

/* ---------- the platform's buttons ---------- */
.io_button, .item_add, .rentNameIO_button, a.io_button,
.simpleCart_checkout, .simpleCart_continue {
	background: var(--prt-cta-ground, var(--prt-cta)) !important;
	color: #fff !important;
	border: 0 !important;
	border-radius: var(--prt-radius-sm) !important;
	font-family: var(--prt-font-display) !important;
	font-weight: 700 !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
	box-shadow: none !important;
}
.io_button:hover, .item_add:hover { background-color: var(--prt-cta-hover, var(--prt-cta-ground, var(--prt-cta))) !important; }
.simpleCart_continue { background: transparent !important; color: var(--prt-ink) !important; border: 1.5px solid var(--prt-line) !important; }

/* ---------- the platform's hidden data fields must stay hidden ---------- */
.item_encoded, .item_href, .item_rentalid, .item_vendorid, .item_qtytype, .item_inputtype,
.item_qtyincrement, .item_giftcardvalue, .item_hasRequiredAcc, .item_quantity { display: none !important; }

/* The theme draws its own cart count; an old Elementor header's .ioCart::after
   bubble and the platform's sonar dot would sit on top of the next button. */
.prt [data-cart-count], .prt .ioCart[data-cart-open] { overflow: visible; }
.prt .ioCart[data-cart-open]::before, .prt .ioCart[data-cart-open]::after { content: none !important; display: none !important; }

/* ---------- the platform's quote form and its injected base styles ----------
   The quote form prints its own <style>body{font:14px Helvetica…}</style> in
   the middle of the page, which would restyle the theme's header and footer
   too. The theme's base type wins back, one step more specific. */
html body.prt {
	font-family: var(--prt-font-body);
	font-size: var(--prt-font-size);
	line-height: var(--prt-line-height);
	color: var(--prt-ink);
}
.prt .wdz-cat-h2 { color: var(--prt-ink) !important; font-family: var(--prt-font-display) !important; text-align: center; }
.prt .catDescriptionIO_small {
	display: -webkit-box !important; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; overflow: hidden !important;
	max-height: none !important; height: auto !important; color: var(--prt-muted) !important; font-size: .95rem !important; line-height: 1.55 !important;
}
.prt-dark .wdz-itemcal__card, .prt-dark .wdz-browse__card, .prt-dark .wdz-browse, .prt-dark .wdz-gate__dialog, .prt-dark .wdz-form { color: #1e1660; }
/* The shared heading colour above is for the platform's pages; BookFlow's
   white panels keep dark headings (its gradient headers keep their own). */
.prt-dark :is(.wdz-gate, .wdz-form, .wdz-itemcal, .wdz-browse, .wdz-cart) :is(h1, h2, h3, h4):not(.wdz-gate__header *) { color: #1e1660 !important; }

/* =====================================================================
   Audit rounds 1–3
   ===================================================================== */
/* BookFlow's style sheets paint every calendar cell, which hides the chosen
   day (white on white) and turns leading blanks into fake days. */
body.prt .wdz-cal__cell.is-selected { background: var(--wdz-cal-primary, var(--prt-primary)) !important; color: #fff !important; border-color: transparent !important; }
body.prt .wdz-cal__cell.is-empty { background: transparent !important; border-color: transparent !important; box-shadow: none !important; }
/* BookFlow buttons that sit on its brand colour (all of them in the playful style). The planner's
   confirm and the form's submit sit on the accent in the other styles, with dark text (round 8:
   white on Marquee's yellow was 1.6:1). */
body.prt :is(.wdz-form__btn--primary, .wdz-gate__btn--primary:not([data-wdz-gate-confirm])),
body.prt.wdz-style-playful :is(.wdz-form__btn--submit, [data-wdz-gate-confirm]) { color: #fff !important; }
body.prt:not(.wdz-style-playful) :is(.wdz-form__btn--submit, [data-wdz-gate-confirm], .wdz-form__upsell-add) { color: var(--prt-accent-ink) !important; }
/* On BookFlow's white panels; a dark theme's light brand text would vanish there (Glow 2.8:1). */
body.prt .wdz-form__link { color: var(--prt-bf-primary, var(--prt-primary-text)) !important; }
body.prt .wdz-form__close:focus-visible { outline-offset: -3px; }

/* BookFlow's item calendar never wider than its card. */
.prt .wdz-itemcal__calwrap, .prt .wdz-itemcal .wdz-cal { min-width: 0 !important; max-width: 100% !important; }
.prt .wdz-itemcal .wdz-cal__grid, .prt .wdz-itemcal [class*="__grid"] { grid-template-columns: repeat(7, minmax(0, 1fr)) !important; }

/* BookFlow's form: a field is not "wrong" before anyone has typed in it. */
body.prt .wdz-form input:invalid:not(:focus):placeholder-shown,
body.prt .wdz-form input[type="number"]:invalid:not(:focus) { border-color: var(--prt-line) !important; box-shadow: none !important; }
/* Fields on BookFlow's white form stay visible on a dark theme. */
body.prt-dark .wdz-form :is(input, select, textarea),
body.prt-dark .wdz-form input:invalid:not(:focus):placeholder-shown { border: 1px solid #d4d0ee !important; color: #1e1660 !important; background: #fff !important; }

/* ---------- round 28 (shared): booking journey ---------- */
/* The chosen date stays in view: BookFlow puts its date bar at the end of the
   page, so the bar is pinned to the bottom of the screen (above a theme's own
   phone call bar) and its in-flow box keeps the footer clear of it. */
body.prt .wdz-gate-sticky:not([hidden]) { position: static !important; height: 56px; background: none !important; }
body.prt .wdz-gate-sticky .wdz-gate-sticky__btn { position: fixed; left: 0; right: 0; bottom: var(--prt-mobile-bar, 0px); z-index: 60; margin: 0; border-radius: 0; min-height: 52px; padding-left: 20px; padding-right: 96px;
	background: var(--prt-bf-primary, var(--prt-primary)) !important; color: #fff !important; box-shadow: 0 -6px 20px rgba(0, 0, 0, .14); } /* round 8 (C#3): the readable brand colour, like the rest of BookFlow */
body.prt .wdz-gate-sticky .wdz-gate-sticky__btn * { color: inherit !important; }
body.prt:has(.wdz-gate-sticky:not([hidden])) .wdz-fd { bottom: calc(var(--prt-mobile-bar, 0px) + 66px + env(safe-area-inset-bottom)) !important; }
body.prt:has(.wdz-gate-sticky:not([hidden])) .wdz-browse-fab { bottom: calc(var(--prt-mobile-bar, 0px) + 70px + env(safe-area-inset-bottom)) !important; }
/* The platform's cart popover in the theme's colours, with usable fields. */
body.prt #cartPopover { background: var(--prt-surface) !important; color: var(--prt-ink) !important; border: 1px solid var(--prt-line) !important; border-radius: 14px !important; font-family: var(--prt-font-body) !important; box-shadow: 0 18px 50px rgba(0, 0, 0, .18) !important; }
body.prt #cartPopover :is(input, select) { padding: .45em .7em !important; min-height: 38px; border: 1px solid var(--prt-ui-mark, var(--prt-line)) !important; border-radius: 8px !important; background: #fff !important; color: #1f2937 !important; font: inherit !important; }
body.prt-dark #cartPopover { background: #fff !important; color: #1e1660 !important; }
/* BookFlow: the close button keeps clear of the progress bar; time fields in the theme's font. */
body.prt .wdz-form__progress { padding-right: 44px !important; }
body.prt .wdz-gate__field input[type="time"] { font-family: inherit !important; }
/* The category-jump button sits above the chat launcher instead of under it. */
@media (max-width: 768px) { body.prt .wdz-browse-fab { bottom: calc(var(--prt-mobile-bar, 0px) + 90px + env(safe-area-inset-bottom)) !important; } }
body.prt:has(.wdz-gate-sticky:not([hidden])) .wdz-browse-fab { bottom: calc(var(--prt-mobile-bar, 0px) + 142px + env(safe-area-inset-bottom)) !important; }

/* ---------- click-through QA ---------- */
/* Required fields on BookFlow's white form stay visible on a dark theme before they're filled. */
body.prt-dark .wdz-form :is(input, select, textarea):invalid:not(:focus) { border: 1px solid #d4d0ee !important; }
/* The chat's greeting bubble stays off booking pages, where it covered "Book this date" and the cart. */
body.prt.prt-io-page .wdz-fd__teaser { display: none !important; }
/* The platform's date picker inside the cart: dark day numbers on the white popover, compact month/year selects, fits a phone. */
body.prt #cartPopover .ui-datepicker { background: #fff !important; color: #1f2937 !important; }
body.prt #cartPopover .ui-datepicker :is(a.ui-state-default, span.ui-state-default, .ui-datepicker-title, th) { color: #1f2937 !important; }
body.prt #cartPopover .ui-datepicker a.ui-state-active, body.prt #cartPopover .ui-datepicker a.ui-state-highlight { background: var(--prt-primary) !important; color: var(--prt-primary-ink) !important; }
body.prt #cartPopover .ui-datepicker select { padding: 2px 4px !important; min-height: 0 !important; width: auto !important; font-size: 14px !important; }
body.prt #cartPopover { max-width: calc(100vw - 16px) !important; }
/* Dark themes: the number field on BookFlow's white form keeps a visible edge
   (the general invalid-field rule above used the theme's near-transparent line colour). */
body.prt-dark .wdz-form input[type="number"]:invalid:not(:focus) { border-color: #d4d0ee !important; }
/* BookFlow's planner "Step 1 of 4" label is #8b94a0 on its white panel (3.07:1): darken it. */
body.prt #wdz-gate-step-label, body.prt .wdz-gate__steplabel { color: #5d6672 !important; }

/* ---------- phones, polish round 2; touch tablets too since round 3 (2026-10-07) ---------- */
/* 44px tap targets on the item page buttons, the calendar's month arrows, the
   grid/list toggle and BookFlow's window close; the calendar's small print
   (weekday letters 9.6px, legend, subtitle) up to a readable size. */
@media (max-width: 760px), (pointer: coarse) {
	body.prt .wdz-gate__close { min-width: 44px !important; min-height: 44px !important; }
}

/* ---------- polish round 6: colour & states ---------- */
/* BookFlow draws its focus rings in the theme's accent (light yellows: 1.5:1 on white cards, R6 A#3);
   take the readable brand colour, as the item calendar already does. Fills keep the accent. Light
   themes only: on a dark theme that colour is made for dark grounds and BookFlow's panels are light. */
html body.prt:not(.prt-dark) :is(.wdz-gate, .wdz-gate-sticky, .wdz-browse, .wdz-browse-fab, .wdz-browse-coupons, .wdz-form) :focus-visible,
html body.prt:not(.prt-dark) :is(.wdz-browse-fab, .wdz-gate-sticky):focus-visible { outline-color: var(--prt-primary-text) !important; }

/* ---------- polish round 8: booking flow ---------- */
/* BookFlow's playful style fades its header band and buttons from the brand colour into a mix with
   the accent; with a yellow accent the white heading, close button and button labels ended on a
   muddy olive (2.4-2.6:1, Hopscotch). Both ends stay readable under white: the brand colour made
   readable (bridge.php) into its hover shade. */
html body.prt.wdz-style-playful .wdz-gate__header,
html body.prt.wdz-style-playful :is(.wdz-gate__btn--primary, .wdz-form__btn--primary, .wdz-form__btn--submit) {
	background: linear-gradient(135deg, var(--prt-bf-primary, var(--prt-primary-ground)), var(--prt-bf-primary-2, var(--prt-primary-hover))) !important;
}
/* BookFlow's small grey print on its white panels: weekday letters #9aa3b2 (2.5:1), the date hint,
   the planner summary's labels and the form's "Step 1 of 5" #8b94a0 (3.0-3.1:1), the close buttons
   #9aa3ad (2.0-2.6:1 for a 3:1 control), the form's amber hint #b07e00 (3.4:1). Same grey as the
   planner's step label (round 6). The playful planner's close sits on its band and stays white. */
html body.prt :is(.wdz-cal__wd, .wdz-gate__hint, .wdz-gate__summary dt, .wdz-form__steplabel, .wdz-form__close) { color: #5d6672 !important; }
html body.prt:not(.wdz-style-playful) .wdz-gate__close { color: #5d6672 !important; }
html body.prt .wdz-form__hint { color: #7a5600 !important; }
/* The platform's cart panel (round 8, A#4). Its header row (month, year, "Single Day") ran 12px past the
   panel's right edge on phones, under the close button: it wraps instead, clear of the button. */
body.prt #cartPopover .ui-datepicker-title { display: flex !important; flex-wrap: wrap; justify-content: center; align-items: center; gap: 4px 6px; margin: 0 4px !important; }
body.prt #cartPopover .ui-datepicker-title #div-overnight { position: static !important; margin: 0 !important; }
body.prt #cartPopover .ui-datepicker-header { padding-right: 34px !important; padding-left: 34px !important; }
/* A theme's sticky call/book bar on phones covered the panel's subtotal: the panel ends above it. */
@media (max-width: 760px) {
	body.prt #cartPopover { max-height: calc(100vh - 71px - var(--prt-mobile-bar, 0px)) !important; max-height: calc(100dvh - 71px - var(--prt-mobile-bar, 0px)) !important; }
}
/* The chat bubble and BookFlow's "+" button sat over the panel's prices and trash buttons while it was open. */
body.prt:has(#cartPopover.cartIn) :is(#wdz-frontdesk-root, .wdz-fd, .wdz-browse-fab) { visibility: hidden !important; }
/* BookFlow's form: the date pill is a light tint, where the brand colour and its 85%-faded "Change" link fell just
   short (4.2 / 3.5:1 in Glow and Confetti, C#3): one shade deeper, unfaded. The item calendar's "for that date"
   note #6b7280 was 4.46:1 on Confetti's card (light themes; Glow's dark card has its own). */
html body.prt .wdz-form .wdz-form__date, html body.prt .wdz-form .wdz-form__date .wdz-form__link { color: var(--prt-bf-primary-2, var(--prt-primary-text)) !important; opacity: 1 !important; }
/* BookFlow never sets a font on its buttons and fields, so they fell back to the browser's Arial beside the
   theme's type (B#2): they take the panel's font. */
body.prt :is(.wdz-gate, .wdz-gate-sticky, .wdz-form, .wdz-itemcal, .wdz-browse, .wdz-browse-fab, .wdz-browse-coupons) :is(button, input, select, textarea) { font-family: inherit; }
/* The cart panel's close "x" was IO's pale grey (about 2:1 for a 3:1 control); its "you may be interested in"
   strip showed an empty grey box with nothing to suggest (the platform returned no items). */
body.prt #cartPopover #cartCloseButton { color: #5d6672 !important; }
body.prt #cartPopover #cart-carousel-container:not(:has(img)) { display: none !important; }

/* Motion (polish round 11): the platform's and BookFlow's buttons ran Elementor's `transition: all`, so any size
   change on them would animate layout; they transition only colours, shadows and transform/opacity. */
html body.prt :is(.io_view_toggle_btn, #bookNowBtn, #checkDeliveryButton, #calcPriceOpenMap, .view-product-button, .io_item2_listcat,
	.cat_img, .wdz-browse__card, .wdz-browse__card-img, .wdz-browse__add, #ioCartTimeSelectContainer .elementor-button, .simpleCart_continue,
	.simpleCart_checkout, .simpleCart_add_acc_dialog, #address_entry_submit, .delivery_info_continue, #map_geocode_submit, #io_map_manual_input,
	#io_map_clear_btn, #io_map_new_line_btn, #cartPopover .elementor-button, .pageDateRangeWrapper .elementor-button) {
	transition-property: color, background-color, border-color, box-shadow, opacity, transform, translate, scale !important;
}
