/*
 * HalaCham public booking experience — v0.36 visual refresh.
 * Scoped entirely under body.hc-public-booking-page so the partner
 * dashboard (which shares component class names in partner-app.css)
 * is never touched. This file is a skin layered on top of the existing
 * markup and data-hc-* behavior hooks; no JavaScript hook is renamed.
 */

body.hc-public-booking-page {
    --hc2-green-900: #0a2e24;
    --hc2-green-800: #0e4938;
    --hc2-green-700: #135c47;
    --hc2-green-600: #167a5c;
    --hc2-green-500: #1c9470;
    --hc2-green-100: #e3f5ec;
    --hc2-green-50: #f2faf6;
    --hc2-gold-700: #a9791f;
    --hc2-gold-600: #c99a3a;
    --hc2-gold-500: #e2b658;
    --hc2-gold-300: #f3d894;
    --hc2-ink: #12241d;
    --hc2-muted: #5f7469;
    --hc2-line: #e3ece6;
    --hc2-control-line: #c6d0cc;
    --hc2-surface: #ffffff;
    --hc2-bg: #f6f9f7;
    --hc2-danger: #a4372f;
    --hc2-danger-bg: #fdf1ef;
    --hc2-radius-sm: 12px;
    --hc2-radius-md: 18px;
    --hc2-radius-lg: 26px;
    --hc2-radius-pill: 999px;
    --hc2-shadow-sm: 0 6px 18px rgba(10, 46, 36, .06);
    --hc2-shadow-md: 0 16px 40px rgba(10, 46, 36, .10);
    --hc2-shadow-lg: 0 28px 70px rgba(10, 46, 36, .16);
    --hc2-gradient-hero: radial-gradient(120% 160% at 12% -20%, #1c9470 0%, #0e4938 46%, #0a2318 100%);
    --hc2-gradient-gold: linear-gradient(135deg, #f3d894 0%, #e2b658 45%, #c99a3a 100%);
    --hc2-font-ar: "Cairo", -apple-system, BlinkMacSystemFont, "Segoe UI", Tahoma, Arial, sans-serif;
    --hc2-font-latin: "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;

    background: var(--hc2-bg);
    color: var(--hc2-ink);
    font-family: var(--hc2-font-latin);
    -webkit-font-smoothing: antialiased;
}

body.hc-public-booking-page:lang(ar),
body.hc-public-booking-page [dir="rtl"] {
    font-family: var(--hc2-font-ar);
}

body.hc-public-booking-page * { box-sizing: border-box; }

/* ---------- Typography & base elements ---------- */

body.hc-public-booking-page h1,
body.hc-public-booking-page h2,
body.hc-public-booking-page h3 {
    color: var(--hc2-green-900);
    font-weight: 800;
    letter-spacing: -.01em;
}

body.hc-public-booking-page .hc-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 0 0 8px;
    color: var(--hc2-gold-700);
    font-size: 12.5px;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
}

body.hc-public-booking-page .hc-eyebrow::before {
    content: "";
    display: inline-block;
    width: 16px;
    height: 2px;
    border-radius: 2px;
    background: var(--hc2-gradient-gold);
}

body.hc-public-booking-page a { color: var(--hc2-green-700); }

/* ---------- Buttons ---------- */

body.hc-public-booking-page .hc-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 13px 22px;
    border: 1px solid var(--hc2-line);
    border-radius: var(--hc2-radius-pill);
    background: #fff;
    color: var(--hc2-green-800);
    font-weight: 800;
    font-size: 14.5px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease, color .18s ease;
}

body.hc-public-booking-page .hc-button:hover {
    transform: translateY(-1px);
    box-shadow: var(--hc2-shadow-sm);
    border-color: var(--hc2-green-500);
}

body.hc-public-booking-page .hc-button-primary {
    border: 0;
    background: var(--hc2-gradient-gold);
    color: #2c1e08;
    box-shadow: 0 12px 26px rgba(201, 154, 58, .35);
}

body.hc-public-booking-page .hc-button-primary:hover {
    background: var(--hc2-gradient-gold);
    color: #2c1e08;
    transform: translateY(-2px);
    box-shadow: 0 16px 34px rgba(201, 154, 58, .44);
}

body.hc-public-booking-page .hc-button.is-loading { opacity: .7; pointer-events: none; }

/* ---------- Shell & header tools ---------- */

body.hc-public-booking-page .hc-public-shell {
    width: min(1200px, calc(100% - 32px));
}

/* ---------- Topbar: steps + language/currency, one transparent row ---------- */

body.hc-public-booking-page .hc-public-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px 30px;
    flex-wrap: wrap;
    margin: 10px 0 30px;
    padding: 0;
    border: 0;
    background: transparent;
}

body.hc-public-booking-page .hc-public-tools,
body.hc-public-booking-page .hc-public-switchers {
    display: flex;
    align-items: center;
    gap: 20px;
    margin: 0;
    padding: 0;
    background: transparent;
    border: 0;
    box-shadow: none;
    backdrop-filter: none;
}

body.hc-public-booking-page .hc-currency-switcher,
body.hc-public-booking-page .hc-currency-badge {
    display: flex;
    align-items: center;
    gap: 5px;
    min-width: 0;
    height: auto;
    padding: 0;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

body.hc-public-booking-page .hc-currency-icon { display: inline-flex; width: 13px; height: 13px; color: var(--hc2-muted); }
body.hc-public-booking-page .hc-currency-icon-svg { width: 100%; height: 100%; display: block; }

body.hc-public-booking-page .hc-currency-switcher select {
    min-width: 0;
    height: auto;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    font-weight: 700;
    font-size: 12.5px;
    color: var(--hc2-muted);
    cursor: pointer;
}

body.hc-public-booking-page .hc-currency-badge {
    justify-content: flex-start;
    font-weight: 700;
    font-size: 12.5px;
    color: var(--hc2-muted);
}

body.hc-public-booking-page .hc-language-switcher { display: flex; align-items: center; gap: 12px; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
body.hc-public-booking-page .hc-language-switcher a { min-width: 0; text-align: start; padding: 0; border-radius: 0; font-size: 13px; font-weight: 700; color: var(--hc2-muted); text-decoration: none; }
body.hc-public-booking-page .hc-language-switcher a:hover { color: var(--hc2-green-800); }

/* One convention across the whole topbar: the active item is marked by a gold
   underline and nothing else. No pills, no dividers, no boxes. */
body.hc-public-booking-page .hc-language-switcher a.is-active,
body.hc-public-booking-page .hc-public-steps .is-current {
    background: transparent;
    color: var(--hc2-green-900);
    font-weight: 800;
    box-shadow: none;
    text-decoration: underline;
    text-underline-offset: 6px;
    text-decoration-color: var(--hc2-gold-500);
    text-decoration-thickness: 2px;
}

/* ---------- Step indicator: plain words, nothing else ----------
   Rebuilt from scratch: no dots, no connector lines, no numbers, no fills.
   Three words separated by a direction-aware chevron; the current one carries the
   same gold underline the active language uses, so the whole bar reads as one idea. */

body.hc-public-booking-page .hc-public-steps {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 0;
    max-width: none;
    margin: 0;
    padding: 0;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

body.hc-public-booking-page .hc-public-steps span {
    position: relative;
    display: inline-flex;
    align-items: baseline;
    justify-content: flex-start;
    gap: 0;
    min-height: 0;
    padding: 0;
    border: 0;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none;
    color: var(--hc2-muted);
    font-size: 13px;
    font-weight: 700;
}

/* The legacy separator is an absolutely positioned 10px hairline. Without resetting
   `position` the chevron is taken out of flow, contributes no width, and the three
   step labels run together with no gap — which is what the strip kept showing. */
body.hc-public-booking-page .hc-public-steps span:not(:last-child)::after {
    content: "\203A";
    position: static;
    inset: auto;
    width: auto;
    height: auto;
    margin-inline: 12px;
    background: none;
    color: var(--hc2-line);
    font-size: 15px;
    font-weight: 400;
    line-height: 1;
}

[dir="rtl"] body.hc-public-booking-page .hc-public-steps span:not(:last-child)::after,
body.hc-public-booking-page[dir="rtl"] .hc-public-steps span:not(:last-child)::after { content: "\2039"; }

body.hc-public-booking-page .hc-public-steps b { display: none; }

/* Full property ownership: the legacy .hc-public-steps .is-current rule fills the
   active step with a tinted rounded block. The gold-underline treatment this shares
   with the active language is defined with it, above. */
body.hc-public-booking-page .hc-public-steps .is-current {
    background: transparent !important;
    border: 0;
    border-radius: 0 !important;
    box-shadow: none;
}
body.hc-public-booking-page .hc-public-steps .is-complete {
    background: transparent !important;
    border: 0;
    border-radius: 0 !important;
    box-shadow: none;
    color: var(--hc2-green-700);
}

/* ---------- Hero search: no boxed backdrop, sits directly on the page ---------- */

body.hc-public-booking-page .hc-public-hero {
    position: relative;
    margin-bottom: 26px;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

body.hc-public-booking-page .hc-public-hero::before,
body.hc-public-booking-page .hc-public-hero::after { content: none !important; display: none !important; }

body.hc-public-booking-page #hc-public-search-form { scroll-margin-top: 24px; }
body.hc-public-booking-page .hc-public-hero .hc-eyebrow { color: var(--hc2-gold-700) !important; }
body.hc-public-booking-page .hc-public-hero .hc-eyebrow::before { background: var(--hc2-gradient-gold); }
body.hc-public-booking-page .hc-public-hero h1 { color: var(--hc2-green-900) !important; margin: 0 0 10px; font-size: clamp(26px, 4vw, 40px); }
body.hc-public-booking-page .hc-public-lead { max-width: 620px; margin: 0 0 22px; color: var(--hc2-muted) !important; font-size: 15px; }

body.hc-public-booking-page .hc-service-picker {
    display: inline-flex;
    gap: 22px;
    margin-bottom: 18px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    border-bottom: 1px solid var(--hc2-line);
}

body.hc-public-booking-page .hc-service-picker label {
    display: block;
    padding: 4px 0 12px;
    border: 0;
    border-radius: 0;
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
    background: transparent;
    box-shadow: none;
    color: var(--hc2-muted);
    font-weight: 800;
    font-size: 14px;
    cursor: pointer;
    transition: color .18s ease, border-color .18s ease;
}

body.hc-public-booking-page .hc-service-picker input { position: absolute; opacity: 0; width: 1px; height: 1px; }

/* Full property ownership: the legacy .hc-service-picker span rule (unscoped, v0.33)
   still renders a filled/bordered pill around this text — reset every property it sets. */
body.hc-public-booking-page .hc-service-picker span {
    display: inline;
    align-items: baseline;
    min-height: 0;
    padding: 0;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: inherit;
    font-size: inherit;
    font-weight: inherit;
    transition: none;
}

body.hc-public-booking-page .hc-service-picker label:has(input:checked) { background: transparent; color: var(--hc2-green-800); border-bottom-color: var(--hc2-gold-500); }
body.hc-public-booking-page .hc-service-picker input:checked + span { background: transparent !important; color: inherit !important; }

body.hc-public-booking-page .hc-search-primary {
    display: flex;
    flex-wrap: wrap;
    align-items: end;
    gap: 10px;
    padding: 18px;
    border-radius: var(--hc2-radius-md);
    background: #fff;
    border: 1px solid var(--hc2-line);
    box-shadow: var(--hc2-shadow-sm);
}

body.hc-public-booking-page .hc-search-primary .hc-field {
    flex: 1 1 160px;
    min-width: 140px;
}

body.hc-public-booking-page .hc-search-primary .hc-field-narrow {
    flex: 0 1 90px;
    min-width: 80px;
}

body.hc-public-booking-page .hc-search-primary .hc-field span {
    color: var(--hc2-muted);
    font-size: 11.5px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .03em;
}

body.hc-public-booking-page .hc-search-primary .hc-field input,
body.hc-public-booking-page .hc-search-primary .hc-field select { width: 100%; }

body.hc-public-booking-page .hc-search-primary .hc-button { flex: 0 0 auto; min-width: 130px; min-height: 46px; }
body.hc-public-booking-page .hc-search-filters { margin-top: 14px; color: var(--hc2-green-800); }
body.hc-public-booking-page .hc-search-filters summary { cursor: pointer; font-weight: 800; font-size: 13px; }
body.hc-public-booking-page .hc-search-filter-grid { margin-top: 12px; padding: 14px; border-radius: var(--hc2-radius-md); background: var(--hc2-bg); border: 1px solid var(--hc2-line); display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
body.hc-public-booking-page .hc-search-context { margin-top: 10px; color: var(--hc2-muted); font-size: 12.5px; }

body.hc-public-booking-page .hc-field input,
body.hc-public-booking-page .hc-field select,
body.hc-public-booking-page .hc-field textarea {
    padding: 11px 13px;
    border: 1px solid var(--hc2-control-line);
    border-radius: var(--hc2-radius-sm);
    background: #fff;
    color: var(--hc2-ink);
    font-size: 14px;
}

body.hc-public-booking-page .hc-field input:focus,
body.hc-public-booking-page .hc-field select:focus,
body.hc-public-booking-page .hc-field textarea:focus {
    outline: 0;
    border-color: var(--hc2-green-600);
    box-shadow: 0 0 0 4px var(--hc2-green-100);
}

/* ---------- Alerts ---------- */

body.hc-public-booking-page .hc-alert {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 14px 16px;
    border-radius: var(--hc2-radius-sm);
    font-weight: 700;
    font-size: 13.5px;
}

body.hc-public-booking-page .hc-alert-error { background: var(--hc2-danger-bg); color: var(--hc2-danger); border: 1px solid #f3d3ce; }
body.hc-public-booking-page .hc-alert-success { background: var(--hc2-green-100); color: var(--hc2-green-800); border: 1px solid #bfe6d4; }

/* ---------- Results ---------- */

/* `align-items: flex-end` bottom-aligns these in a row. A legacy media query flips
   the container to `column`, where flex-end becomes the INLINE end — pushing the
   whole Arabic heading to the left edge on phones. Direction owned here. */
body.hc-public-booking-page .hc-results-heading { display: flex; flex-direction: row; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
body.hc-public-booking-page .hc-results-heading h2 { margin: 0; font-size: 26px; }
body.hc-public-booking-page .hc-results-heading p:last-child { color: var(--hc2-muted); font-weight: 700; font-size: 13px; }

body.hc-public-booking-page .hc-search-results { gap: 22px; }

/* A search with no availability still shows the matching properties, marked as
   unavailable, so the guest can change dates instead of hitting a dead end. */
body.hc-public-booking-page .hc-results-fallback-note {
    grid-column: 1 / -1;
    margin: 0 0 4px;
    color: var(--hc2-muted);
    font-size: 13.5px;
    line-height: 1.7;
}
body.hc-public-booking-page .hc-result-card.is-unavailable { box-shadow: none; }
body.hc-public-booking-page .hc-result-card.is-unavailable:hover { transform: none; box-shadow: none; }
body.hc-public-booking-page .hc-result-card.is-unavailable .hc-result-media { filter: grayscale(.55); opacity: .82; }
body.hc-public-booking-page .hc-result-unavailable { color: var(--hc2-muted); font-size: 13px; font-weight: 800; }

body.hc-public-booking-page .hc-result-card,
body.hc-public-booking-page .hc-panel {
    border: 1px solid var(--hc2-line);
    border-radius: var(--hc2-radius-lg);
    background: var(--hc2-surface);
    box-shadow: var(--hc2-shadow-sm);
    transition: transform .2s ease, box-shadow .2s ease;
}

body.hc-public-booking-page .hc-result-card {
    overflow: hidden;
    padding: 0;
}

body.hc-public-booking-page .hc-result-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--hc2-shadow-md);
}

body.hc-public-booking-page .hc-result-media { position: relative; display: block; overflow: hidden; border-radius: 0; }
body.hc-public-booking-page .hc-result-image,
body.hc-public-booking-page .hc-result-image-placeholder {
    transition: transform .5s ease;
}
body.hc-public-booking-page .hc-result-card:hover .hc-result-image { transform: scale(1.06); }

body.hc-public-booking-page .hc-result-service-badge {
    position: absolute;
    inset-block-start: 14px;
    inset-inline-end: 14px;
    inset-inline-start: auto;
    inset-block-end: auto;
    display: inline-flex;
    width: auto;
    max-width: max-content;
    min-height: 0;
    margin: 0;
    padding: 6px 13px;
    border: 0;
    border-radius: var(--hc2-radius-pill);
    background: rgba(255, 255, 255, .92);
    color: var(--hc2-green-800);
    font-size: 11px;
    font-weight: 800;
    box-shadow: var(--hc2-shadow-sm);
    backdrop-filter: blur(6px);
}

body.hc-public-booking-page .hc-result-media .hc-pay-arrival-badge {
    position: absolute;
    inset-inline-start: 14px;
    inset-block-end: 14px;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 11px;
    border: 1px solid rgba(255, 255, 255, .76);
    border-radius: var(--hc2-radius-pill);
    background: #fff3d2;
    color: #784900;
    font-size: 12px;
    font-weight: 800;
    box-shadow: 0 8px 22px rgba(52, 34, 0, .16);
}

body.hc-public-booking-page .hc-result-media .hc-pay-arrival-badge > span,
.hc-embedded-results .hc-pay-arrival-badge > span {
    display: grid;
    place-items: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #ad7316;
    color: #fff;
    font-size: 11px;
}

.hc-embedded-results .hc-pay-arrival-badge.is-inline {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    width: max-content;
    margin: 3px 0 8px;
    padding: 7px 10px;
    border-radius: 999px;
    background: #fff3d2;
    color: #784900;
    font-size: 12px;
    font-weight: 800;
}

body.hc-public-booking-page .hc-pay-arrival-badge.is-inline,
body.hc-public-booking-page .hc-pay-arrival-badge.is-detail {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    width: max-content;
    padding: 8px 12px;
    border: 1px solid #efd28b;
    border-radius: 999px;
    background: #fff6db;
    color: #754800;
    font-size: 12px;
    font-weight: 800;
    box-shadow: 0 7px 18px rgba(92, 59, 5, .09);
}
body.hc-public-booking-page .hc-pay-arrival-badge.is-inline > span,
body.hc-public-booking-page .hc-pay-arrival-badge.is-detail > span {
    display: grid;
    width: 19px;
    height: 19px;
    place-items: center;
    border-radius: 50%;
    background: #a96f12;
    color: #fff;
    font-size: 11px;
}
body.hc-public-booking-page .hc-pay-arrival-badge.is-detail { margin-top: 10px; }
body.hc-public-booking-page .hc-car-total em { display:block; margin-top:5px; color:#8a5a08; font-size:12px; font-style:normal; font-weight:800; }
body.hc-public-booking-page .hc-long-stay-offers { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:15px; padding:12px 14px; border:1px solid #efd89e; border-radius:14px; background:#fff9e8; color:#704500; }
body.hc-public-booking-page .hc-long-stay-offers strong { margin-inline-end:4px; font-size:13px; }
body.hc-public-booking-page .hc-long-stay-offers span { padding:5px 9px; border-radius:999px; background:#fff; font-size:12px; font-weight:800; }

body.hc-public-booking-page .hc-result-card-body { padding: 18px 20px 20px; }
body.hc-public-booking-page .hc-result-rating span { color: var(--hc2-gold-600); letter-spacing: 1px; }

body.hc-public-booking-page .hc-result-location { display: flex; align-items: center; gap: 6px; color: var(--hc2-muted); font-size: 13px; font-weight: 700; }

body.hc-public-booking-page .hc-stock-note {
    display: flex;
    align-items: center;
    gap: 8px;
    max-width: max-content;
    margin: 8px 0 !important;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #a3660f;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.4;
}
body.hc-public-booking-page .hc-stock-note-icon {
    position: relative;
    display: inline-flex;
    flex: 0 0 auto;
    width: 7px;
    height: 7px;
    padding: 0;
    border-radius: 50%;
    background: #e08a1f;
    color: transparent;
    font-size: 0;
}
body.hc-public-booking-page .hc-stock-note-icon::after { content: ""; position: absolute; inset: -4px; border-radius: 50%; border: 2px solid #e08a1f; opacity: .5; animation: hc2-pulse 1.8s ease-out infinite; }
body.hc-public-booking-page .hc-stock-note > span { display: flex; align-items: baseline; gap: 5px; }
body.hc-public-booking-page .hc-stock-note strong { font-size: 12px; font-weight: 800; }
body.hc-public-booking-page .hc-stock-note small { display: inline; margin: 0; color: #b98a4a; font-weight: 600; font-size: 11px; }

@keyframes hc2-pulse { 0% { transform: scale(.6); opacity: .6; } 100% { transform: scale(1.6); opacity: 0; } }

body.hc-public-booking-page .hc-result-amenities {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 14px;
    margin: 12px 0 0 !important;
    padding: 0 !important;
    border-radius: 0;
    background: transparent !important;
    list-style: none;
}
body.hc-public-booking-page .hc-result-amenities li {
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--hc2-muted);
    font-size: 12px;
    font-weight: 600;
}
body.hc-public-booking-page .hc-result-amenities li span { display: inline-flex; width: auto; height: auto; border: 0; color: var(--hc2-green-600); font-size: 12px; }

body.hc-public-booking-page .hc-car-quick-specs {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 16px;
    margin: 10px 0 0;
    padding: 0;
    list-style: none;
}
body.hc-public-booking-page .hc-car-quick-specs li {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 0;
    border-radius: 0;
    background: transparent;
    color: var(--hc2-muted);
    font-size: 12px;
    font-weight: 600;
}
body.hc-public-booking-page .hc-car-quick-specs svg { width: 19px; height: 19px; stroke-width: 2; color: var(--hc2-green-700); flex: 0 0 auto; }

body.hc-public-booking-page .hc-result-assurance { display: flex; align-items: center; gap: 7px; margin: 12px 0 0; color: var(--hc2-green-700); font-size: 12px; font-weight: 700; }
body.hc-public-booking-page .hc-result-assurance span { display: inline-flex; width: 16px; height: 16px; border: 0; border-radius: 0; background: none; color: var(--hc2-green-600); }
body.hc-public-booking-page .hc-result-assurance svg { width: 16px; height: 16px; }

body.hc-public-booking-page .hc-result-card-footer { display: flex; align-items: center; justify-content: space-between; margin-top: 16px; padding-top: 14px; border-top: 1px dashed var(--hc2-line); }
body.hc-public-booking-page .hc-result-price-wrap span { display: block; color: var(--hc2-muted); font-size: 11px; font-weight: 700; }
body.hc-public-booking-page .hc-result-price { color: var(--hc2-green-800); font-size: 21px; font-weight: 900; }

/* Platform promotions and richer optional-service cards. */
body.hc-public-booking-page .hc-promo-badge{position:absolute;z-index:4;inset-block-start:14px;inset-inline-start:14px;display:inline-flex;align-items:center;min-height:34px;padding:7px 13px;border:1px solid rgba(255,255,255,.72);border-radius:999px;background:#d8623f;color:#fff;box-shadow:0 8px 22px rgba(83,31,17,.2);font-size:13px;font-weight:900;line-height:1;direction:ltr}
body.hc-public-booking-page .hc-car-page-photo,body.hc-public-booking-page .hc-hotel-gallery{position:relative}
body.hc-public-booking-page .hc-price-original,body.hc-public-booking-page .hc-car-total del{display:block;margin:2px 0;color:#87968d;font-size:13px;font-weight:700;text-decoration-thickness:1.5px}
body.hc-public-booking-page .hc-car-extra-list label{align-items:flex-start}
body.hc-public-booking-page .hc-addon-copy{display:grid;gap:4px;min-width:0}
body.hc-public-booking-page .hc-addon-copy>strong{display:flex;flex-wrap:wrap;align-items:center;gap:7px}
body.hc-public-booking-page .hc-addon-description{display:block;color:#6f8177;font-size:12px;line-height:1.55;font-weight:500}
body.hc-public-booking-page .hc-recommended-badge{display:inline-flex;padding:3px 7px;border-radius:999px;background:#fff2cf;color:#8d5a00;font-size:10px;font-style:normal;font-weight:900;white-space:nowrap}
body.hc-public-booking-page .hc-car-spec-grid>div>.hc-car-icon{display:block;align-self:center;justify-self:center;margin:0!important;transform:none!important}
body.hc-public-booking-page .hc-car-spec-year>.hc-car-icon{width:22px;height:22px}

body.hc-public-booking-page .hc-public-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    padding: 52px 24px;
    text-align: center;
    border-radius: var(--hc2-radius-lg);
    background: var(--hc2-green-50);
    border: 1px solid var(--hc2-line);
}
body.hc-public-booking-page .hc-public-empty-icon {
    display: inline-flex;
    padding: 16px;
    border-radius: 50%;
    background: #fff;
    color: var(--hc2-green-600);
    border: 1px solid var(--hc2-line);
}
body.hc-public-booking-page .hc-public-empty-icon svg { width: 28px; height: 28px; fill: none; stroke: currentColor; stroke-width: 1.8; }
body.hc-public-booking-page .hc-public-empty h3 { margin: 0 0 6px; font-size: 19px; }
body.hc-public-booking-page .hc-public-empty p { margin: 0 0 4px; max-width: 420px; color: var(--hc2-muted); }
body.hc-public-booking-page .hc-public-empty .hc-button { margin-top: 4px; }

body.hc-public-booking-page .hc-pagination { display: flex; align-items: center; justify-content: center; gap: 14px; margin-top: 28px; font-weight: 800; color: var(--hc2-muted); }

/* ---------- Hotel & car detail pages ---------- */

body.hc-public-booking-page .hc-hotel-back,
body.hc-public-booking-page .hc-car-page-top { margin-bottom: 16px; font-weight: 800; }
body.hc-public-booking-page .hc-hotel-back a,
body.hc-public-booking-page .hc-car-page-top a { color: var(--hc2-green-700); }

/* The hotel heading is a text block plus a link button — NOT the car heading's
   copy+photo grid. Sharing that grid stretched the button into a full-height block
   and left the title with no padding, so it was clipped against the card edge. */
body.hc-public-booking-page .hc-hotel-heading {
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 16px 28px;
    margin: 0 0 22px;
    padding: 0;
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
}

/* flex-basis on the main axis only. A legacy media query flips this container to
   `column`, where a 300px basis would become a 300px HEIGHT and open a large empty
   band above the button on phones — so the direction is owned here and overridden
   deliberately in the mobile block below. */
body.hc-public-booking-page .hc-hotel-heading > div { flex: 1 1 auto; min-width: 0; max-width: 100%; }
body.hc-public-booking-page .hc-hotel-heading > .hc-button { flex: 0 0 auto; align-self: flex-end; }

body.hc-public-booking-page .hc-car-page-heading {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(200px, .6fr);
    align-items: stretch;
    gap: 0;
    margin-bottom: 18px;
    padding: 0;
    overflow: hidden;
    border-radius: var(--hc2-radius-lg);
    background: linear-gradient(120deg, var(--hc2-green-50), #fff);
    border: 1px solid var(--hc2-line);
}

body.hc-public-booking-page .hc-car-page-heading-copy { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: clamp(22px, 3vw, 34px); }

/* Car category reads as the same gold eyebrow used on the hotel page, not a filled
   pill. Full property ownership over the legacy .hc-car-category rule. */
body.hc-public-booking-page .hc-car-category {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 0 0 8px;
    padding: 0 !important;
    border: 0;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none;
    color: var(--hc2-gold-700);
    font-size: 12.5px;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
}

body.hc-public-booking-page .hc-car-category::before {
    content: "";
    display: inline-block;
    width: 16px;
    height: 2px;
    border-radius: 2px;
    background: var(--hc2-gradient-gold);
}

/* Same treatment for the small feature chips under the spec grid. */
body.hc-public-booking-page .hc-car-feature-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 18px; margin-top: 14px; }
body.hc-public-booking-page .hc-car-feature-row span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 0 !important;
    border: 0;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none;
    color: var(--hc2-muted);
    font-size: 12.5px;
    font-weight: 700;
}
body.hc-public-booking-page .hc-car-feature-row span .hc-car-icon { width: 17px; height: 17px; color: var(--hc2-green-700); }
body.hc-public-booking-page .hc-car-page-photo,
body.hc-public-booking-page .hc-car-page-art { min-height: 200px; border-radius: 0; box-shadow: none; }
body.hc-public-booking-page .hc-car-page-photo img { height: 100%; max-height: none; }

body.hc-public-booking-page .hc-hotel-heading h1,
body.hc-public-booking-page .hc-car-page-heading h1 { margin: 4px 0; font-size: clamp(24px, 3.4vw, 34px); }
body.hc-public-booking-page .hc-hotel-place { display: flex; align-items: center; gap: 8px; color: var(--hc2-muted); font-weight: 700; }

/* Gallery items are <button> wrappers, so the old img:first-child span rule never
   matched and left an empty cell. The base layout now fills evenly for any photo
   count; the featured tall-first layout applies only when there are exactly five. */
body.hc-public-booking-page .hc-hotel-gallery {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    grid-auto-rows: 160px;
    gap: 10px;
    margin-bottom: 26px;
    border-radius: var(--hc2-radius-lg);
    overflow: hidden;
}
body.hc-public-booking-page .hc-hotel-gallery img { width: 100%; height: 100%; object-fit: cover; }

body.hc-public-booking-page .hc-hotel-gallery:has(> :first-child:nth-last-child(5)) {
    grid-template-columns: 1.6fr repeat(2, 1fr);
    grid-template-rows: repeat(2, 160px);
}
body.hc-public-booking-page .hc-hotel-gallery:has(> :first-child:nth-last-child(5)) > :first-child { grid-row: 1 / 3; }

body.hc-public-booking-page .hc-hotel-gallery.is-single { grid-template-columns: 1fr; grid-auto-rows: 340px; }

body.hc-public-booking-page .hc-hotel-overview { display: grid; grid-template-columns: 1.6fr 1fr; gap: 26px; margin-bottom: 30px; }
body.hc-public-booking-page .hc-hotel-facilities { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; padding: 0; list-style: none; }
body.hc-public-booking-page .hc-hotel-facilities li { padding: 8px 14px; border-radius: var(--hc2-radius-pill); background: var(--hc2-green-50); color: var(--hc2-green-800); font-size: 12.5px; font-weight: 700; }

body.hc-public-booking-page .hc-hotel-section-heading { display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 18px; }
body.hc-public-booking-page .hc-hotel-datebar {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: end;
    margin-bottom: 20px;
    padding: 14px;
    border-radius: var(--hc2-radius-md);
    background: var(--hc2-surface);
    border: 1px solid var(--hc2-line);
    box-shadow: var(--hc2-shadow-sm);
}

body.hc-public-booking-page .hc-hotel-room-list { display: grid; gap: 16px; }

body.hc-public-booking-page .hc-hotel-room {
    display: grid;
    grid-template-columns: 210px 1fr 200px;
    gap: 20px;
    padding: 16px;
    border: 1px solid var(--hc2-line);
    border-radius: var(--hc2-radius-lg);
    background: var(--hc2-surface);
    box-shadow: var(--hc2-shadow-sm);
    transition: box-shadow .2s ease, border-color .2s ease;
}
body.hc-public-booking-page .hc-hotel-room.is-available:hover { box-shadow: var(--hc2-shadow-md); border-color: var(--hc2-green-500); }
body.hc-public-booking-page .hc-hotel-room.is-unavailable { opacity: .72; }

body.hc-public-booking-page .hc-hotel-room-photo { position: relative; overflow: hidden; border-radius: var(--hc2-radius-md); }
body.hc-public-booking-page .hc-hotel-room-photo button { display: block; width: 100%; height: 100%; padding: 0; border: 0; background: none; cursor: pointer; }
body.hc-public-booking-page .hc-hotel-room-photo img { width: 100%; height: 160px; object-fit: cover; transition: transform .35s ease; }
body.hc-public-booking-page .hc-hotel-room-photo:hover img { transform: scale(1.05); }

body.hc-public-booking-page .hc-hotel-room-title { display: flex; align-items: center; justify-content: flex-start; flex-wrap: wrap; gap: 10px; }
body.hc-public-booking-page .hc-hotel-room-title h3 { margin: 0; font-size: 19px; }
body.hc-public-booking-page .hc-room-status { padding: 5px 12px; border-radius: var(--hc2-radius-pill); background: var(--hc2-green-100); color: var(--hc2-green-800); font-size: 11.5px; font-weight: 800; white-space: nowrap; }
body.hc-public-booking-page .hc-hotel-room.is-unavailable .hc-room-status { background: #f1e9e3; color: #8a6a4c; }

body.hc-public-booking-page .hc-hotel-room-specs { display: flex; flex-wrap: wrap; gap: 8px; margin: 10px 0 0; padding: 0; list-style: none; }
body.hc-public-booking-page .hc-hotel-room-specs li { padding: 5px 11px; border-radius: var(--hc2-radius-pill); background: var(--hc2-bg); color: var(--hc2-muted); font-size: 11.5px; font-weight: 700; }

body.hc-public-booking-page .hc-room-gallery-trigger { margin-top: 10px; padding: 0; border: 0; background: none; color: var(--hc2-green-700); font-weight: 800; font-size: 12.5px; cursor: pointer; }
body.hc-public-booking-page .hc-room-gallery > div { display: flex; gap: 6px; margin-top: 8px; overflow-x: auto; }
body.hc-public-booking-page .hc-room-gallery img { width: 54px; height: 54px; border-radius: 10px; object-fit: cover; }

body.hc-public-booking-page .hc-hotel-room-booking {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    gap: 4px;
    padding-inline-start: 20px;
    border-inline-start: 1px dashed var(--hc2-line);
    text-align: end;
}
body.hc-public-booking-page .hc-hotel-room-booking span { color: var(--hc2-muted); font-size: 11px; font-weight: 700; }
body.hc-public-booking-page .hc-hotel-room-booking strong { color: var(--hc2-green-800); font-size: 24px; font-weight: 900; }
body.hc-public-booking-page .hc-hotel-room-booking small { color: var(--hc2-muted); font-size: 10.5px; margin-bottom: 6px; }
body.hc-public-booking-page .hc-hotel-room-booking .hc-button { width: 100%; margin-top: 8px; }
body.hc-public-booking-page .hc-hotel-room-unavailable { color: #8a6a4c; font-size: 13px; }

body.hc-public-booking-page .hc-hotel-bottom { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; margin-top: 34px; }
body.hc-public-booking-page .hc-hotel-reviews,
body.hc-public-booking-page .hc-hotel-bottom section { padding: 22px; border-radius: var(--hc2-radius-lg); background: var(--hc2-surface); border: 1px solid var(--hc2-line); }
body.hc-public-booking-page .hc-hotel-reviews { margin-top: 26px; }
body.hc-public-booking-page .hc-hotel-review { padding: 14px 0; border-top: 1px solid var(--hc2-line); }
body.hc-public-booking-page .hc-hotel-review:first-of-type { border-top: 0; }

/* Gallery dialog — full ownership of every property the legacy stylesheet
   also targets, plus an explicit open/closed rule so a theme-level reset of
   the native <dialog> element can never keep it hidden after showModal(). */
body.hc-public-booking-page dialog.hc-gallery-dialog { display: none; }
body.hc-public-booking-page dialog.hc-gallery-dialog[open] { display: flex !important; flex-direction: column; }
body.hc-public-booking-page .hc-gallery-dialog {
    width: min(920px, 92vw);
    max-height: calc(100vh - 32px);
    margin: auto;
    border: 0;
    border-radius: var(--hc2-radius-lg);
    padding: 0;
    background: #0a1b15;
    color: #fff;
    box-shadow: var(--hc2-shadow-lg);
}
body.hc-public-booking-page .hc-gallery-dialog::backdrop { background: rgba(10, 20, 16, .78); backdrop-filter: blur(4px); }
body.hc-public-booking-page .hc-gallery-stage { position: relative; display: flex; align-items: center; justify-content: center; background: #0a1b15; min-height: 60vh; grid-template-columns: none; }

body.hc-public-booking-page .hc-hotel-gallery-photo { display: block; width: 100%; height: 100%; padding: 0; border: 0; background: none; cursor: zoom-in; }
body.hc-public-booking-page .hc-hotel-gallery-photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
body.hc-public-booking-page .hc-gallery-stage img { max-width: 100%; max-height: 72vh; object-fit: contain; }
body.hc-public-booking-page .hc-gallery-stage button { position: absolute; top: 50%; transform: translateY(-50%); width: 42px; height: 42px; border-radius: 50%; border: 0; background: rgba(255, 255, 255, .16); color: #fff; font-size: 22px; cursor: pointer; }
body.hc-public-booking-page .hc-gallery-stage button[data-hc-gallery-prev] { inset-inline-start: 14px; }
body.hc-public-booking-page .hc-gallery-stage button[data-hc-gallery-next] { inset-inline-end: 14px; }
body.hc-public-booking-page .hc-gallery-close { position: absolute; top: 14px; inset-inline-end: 14px; width: 36px; height: 36px; border-radius: 50%; border: 0; background: rgba(255, 255, 255, .16); color: #fff; font-size: 20px; cursor: pointer; z-index: 2; }
body.hc-public-booking-page .hc-gallery-dialog p { margin: 0; padding: 12px 18px; color: #fff; background: #0a1b15; font-size: 13px; }

/* Car detail */
body.hc-public-booking-page .hc-car-page-layout { display: grid; grid-template-columns: 1.6fr 1fr; gap: 26px; align-items: start; margin-top: 22px; }
body.hc-public-booking-page .hc-car-page-photo { border-radius: var(--hc2-radius-lg); overflow: hidden; box-shadow: var(--hc2-shadow-md); }
body.hc-public-booking-page .hc-car-page-photo img { width: 100%; max-height: 320px; object-fit: cover; }
body.hc-public-booking-page .hc-car-page-thumbs { display: flex; gap: 10px; margin: 12px 0 22px; overflow-x: auto; }
body.hc-public-booking-page .hc-car-page-thumbs img { width: 96px; height: 68px; border-radius: 12px; object-fit: cover; }

body.hc-public-booking-page .hc-car-page-section { margin-bottom: 20px; padding: 22px; border-radius: var(--hc2-radius-lg); background: var(--hc2-surface); border: 1px solid var(--hc2-line); }
body.hc-public-booking-page .hc-car-section-head { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; }
body.hc-public-booking-page .hc-car-section-head span { display: inline-flex; width: auto; height: auto; padding: 0; border-radius: 0; background: transparent; color: var(--hc2-green-700); }
body.hc-public-booking-page .hc-car-section-head span svg { width: 20px; height: 20px; }
body.hc-public-booking-page .hc-car-section-head h2 { margin: 0; font-size: 18px; }

/* Specifications read the way the major rental sites present them: one quiet line
   per fact — icon, value, label — with no card, border or fill around each one.
   The boxes were the complaint; they also forced a 74px minimum height per cell,
   which is where the empty space on phones came from. */
body.hc-public-booking-page .hc-car-spec-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 4px 8px;
}

/* Each fact is icon + value + label on one tight block. The icon column is fixed
   and the text column shrinks to its content (max-content), so the icon always sits
   directly beside its own text instead of being stranded across a wide 1fr cell —
   which is what made the row read as scattered, especially in Arabic. */
body.hc-public-booking-page .hc-car-spec-grid > div {
    display: grid;
    grid-template-columns: 26px minmax(0, max-content);
    grid-template-rows: auto auto;
    justify-content: start;
    column-gap: 10px;
    row-gap: 1px;
    align-items: center;
    min-height: 0;
    padding: 12px 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    text-align: start;
}

body.hc-public-booking-page .hc-car-spec-grid svg,
body.hc-public-booking-page .hc-car-spec-grid .hc-car-icon {
    grid-column: 1;
    grid-row: 1 / 3;
    width: 22px;
    height: 22px;
    flex: 0 0 auto;
    color: var(--hc2-green-600);
    stroke-width: 1.8;
}

body.hc-public-booking-page .hc-car-spec-grid strong {
    grid-column: 2;
    grid-row: 1;
    color: var(--hc2-green-900);
    font-size: 15px;
    font-weight: 800;
    line-height: 1.3;
}

body.hc-public-booking-page .hc-car-spec-grid span {
    grid-column: 2;
    grid-row: 2;
    color: var(--hc2-muted);
    font-size: 11.5px;
    font-weight: 700;
    line-height: 1.3;
}

body.hc-public-booking-page .hc-car-feature-row { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
body.hc-public-booking-page .hc-car-feature-row span { display: inline-flex; align-items: center; gap: 6px; padding: 6px 13px; border-radius: var(--hc2-radius-pill); background: var(--hc2-green-50); color: var(--hc2-green-800); font-size: 12px; font-weight: 700; }

body.hc-public-booking-page .hc-car-reservation {
    padding: 24px;
    border-radius: var(--hc2-radius-lg);
    background: var(--hc2-surface);
    border: 1px solid var(--hc2-line);
    box-shadow: var(--hc2-shadow-md);
    border-top: 4px solid transparent;
    border-image: var(--hc2-gradient-gold) 1;
}
/* Availability confirmation reads as a green line of text, not a tinted block. */
body.hc-public-booking-page .hc-car-availability {
    display: flex;
    align-items: center;
    gap: 7px;
    margin: 15px 0;
    padding: 0 !important;
    border: 0;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none;
    color: var(--hc2-green-700) !important;
    font-size: 12.5px;
    font-weight: 800;
}
body.hc-public-booking-page .hc-car-availability .hc-car-icon { width: 17px; height: 17px; color: var(--hc2-green-600); }
body.hc-public-booking-page .hc-car-availability.is-unavailable { background: transparent !important; color: #9c4d29 !important; }
body.hc-public-booking-page .hc-car-availability.is-unavailable .hc-car-icon { color: #9c4d29; }

body.hc-public-booking-page .hc-car-reservation-head span { color: var(--hc2-gold-700); font-size: 11px; font-weight: 800; text-transform: uppercase; }
body.hc-public-booking-page .hc-car-reservation-head h2 { margin: 4px 0 6px; font-size: 21px; }
body.hc-public-booking-page .hc-car-total strong { color: var(--hc2-green-800); font-size: 26px; }

/* ---------- Checkout ---------- */

body.hc-public-booking-page .hc-checkout-grid { max-width: 980px; margin: 10px auto 60px; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 22px; }

body.hc-public-booking-page .hc-checkout-summary {
    padding: 26px;
    border-radius: var(--hc2-radius-lg);
    background: linear-gradient(165deg, var(--hc2-green-900), var(--hc2-green-800));
    color: #fff;
    box-shadow: var(--hc2-shadow-lg);
    position: sticky;
    top: 20px;
}
body.hc-public-booking-page .hc-checkout-summary .hc-eyebrow,
body.hc-public-booking-page .hc-checkout-summary .hc-eyebrow::before { color: var(--hc2-gold-300); }
body.hc-public-booking-page .hc-checkout-summary h1 { color: #fff; font-size: 22px; margin: 0 0 16px; }

body.hc-public-booking-page .hc-checkout-product {
    display: grid;
    gap: 2px;
    padding: 14px 16px;
    margin-bottom: 16px;
    border-radius: var(--hc2-radius-md);
    background: rgba(255, 255, 255, .08);
}
body.hc-public-booking-page .hc-checkout-product.has-image {
    grid-template-columns: 56px 1fr;
    align-items: center;
    gap: 12px;
}
body.hc-public-booking-page .hc-checkout-product-image { width: 56px; height: 56px; border-radius: var(--hc2-radius-sm); object-fit: cover; }
body.hc-public-booking-page .hc-checkout-product-copy { display: grid; gap: 2px; min-width: 0; }
body.hc-public-booking-page .hc-checkout-product span { color: rgba(255, 255, 255, .65); font-size: 11px; font-weight: 700; text-transform: uppercase; text-decoration: none; border: 0; }
body.hc-public-booking-page .hc-checkout-product strong { display: block; color: #fff; font-size: 17px; font-weight: 800; text-decoration: none; border: 0; }
body.hc-public-booking-page .hc-checkout-product small { display: block; color: rgba(255, 255, 255, .7); text-decoration: none; border: 0; }

/* Simple date timeline: check-in ---- check-out */
body.hc-public-booking-page .hc-checkout-timeline {
    display: flex;
    align-items: center;
    margin: 4px 0 18px;
    padding: 0;
}
body.hc-public-booking-page .hc-checkout-timeline-point {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    color: rgba(255, 255, 255, .85);
    font-size: 11px;
    font-weight: 800;
}
body.hc-public-booking-page .hc-checkout-timeline-point b {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--hc2-gold-300);
}
body.hc-public-booking-page .hc-checkout-timeline-line {
    flex: 1;
    height: 1px;
    margin: 0 8px 18px;
    background: repeating-linear-gradient(90deg, rgba(255, 255, 255, .5) 0 6px, transparent 6px 11px);
}

body.hc-public-booking-page .hc-booking-summary { display: grid; gap: 10px; padding: 4px 0; }
body.hc-public-booking-page .hc-booking-summary p { display: flex; justify-content: space-between; gap: 12px; margin: 0; padding-bottom: 10px; border-bottom: 1px dashed rgba(255, 255, 255, .18); font-size: 13.5px; }
body.hc-public-booking-page .hc-checkout-summary .hc-booking-summary p { color: rgba(255, 255, 255, .85); }
body.hc-public-booking-page .hc-checkout-extras { display: flex; flex-wrap: wrap; gap: 6px; }
body.hc-public-booking-page .hc-checkout-extras span { padding: 3px 10px; border-radius: var(--hc2-radius-pill); background: rgba(255, 255, 255, .12); font-size: 11.5px; }
body.hc-public-booking-page .hc-checkout-total { border-bottom: 0 !important; padding-top: 6px; font-size: 17px !important; }
body.hc-public-booking-page .hc-checkout-total strong:last-child { color: var(--hc2-gold-300); font-size: 22px; }

body.hc-public-booking-page .hc-checkout-timer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 18px;
    padding: 12px 16px;
    border-radius: var(--hc2-radius-pill);
    background: rgba(255, 255, 255, .1);
    font-weight: 800;
}
body.hc-public-booking-page .hc-checkout-timer span { color: rgba(255, 255, 255, .75); font-size: 12px; }
body.hc-public-booking-page .hc-checkout-timer strong { color: var(--hc2-gold-300); font-size: 18px; letter-spacing: .04em; }
body.hc-public-booking-page .hc-checkout-expiry { margin: 8px 0 0; color: rgba(255, 255, 255, .6); font-size: 11.5px; }
body.hc-public-booking-page .hc-release-quote-form button { margin-top: 14px; padding: 0; border: 0; background: none; color: rgba(255, 255, 255, .7); font-size: 12px; text-decoration: underline; cursor: pointer; }

body.hc-public-booking-page .hc-editor.hc-public-checkout-form {
    padding: 26px;
    display: grid;
    gap: 16px;
}
body.hc-public-booking-page .hc-panel-heading h2 { margin: 4px 0 0; font-size: 20px; }
body.hc-public-booking-page .hc-checkbox { display: flex; align-items: flex-start; gap: 10px; }

/* Checkout: the guest-detail fields and the captcha. */
body.hc-public-booking-page .hc-public-checkout-form .hc-field { display: grid; gap: 6px; }
body.hc-public-booking-page .hc-public-checkout-form .hc-field > small { color: var(--hc2-muted); font-size: 11.5px; line-height: 1.5; }
body.hc-public-booking-page .hc-public-checkout-form textarea { min-height: 76px; resize: vertical; line-height: 1.6; }

body.hc-public-booking-page .hc-captcha-field .hc-captcha-row {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}
body.hc-public-booking-page .hc-captcha-field .hc-captcha-row b {
    padding: 10px 14px;
    border: 1px solid var(--hc2-control-line);
    border-radius: var(--hc2-radius-sm);
    background: var(--hc2-bg);
    color: var(--hc2-green-900);
    font-size: 14.5px;
    font-weight: 800;
    letter-spacing: .04em;
    white-space: nowrap;
}
body.hc-public-booking-page .hc-captcha-field .hc-captcha-row input { flex: 1 1 110px; min-width: 90px; }
body.hc-public-booking-page .hc-captcha-field .g-recaptcha,
body.hc-public-booking-page .hc-captcha-field .h-captcha { margin-top: 2px; }
body.hc-public-booking-page .hc-checkbox input { margin-top: 3px; }

body.hc-public-booking-page .hc-public-confirmation { max-width: 620px; margin: 60px auto; padding: 40px 32px; text-align: center; border-radius: var(--hc2-radius-lg); box-shadow: var(--hc2-shadow-md); }
body.hc-public-booking-page .hc-empty-icon { display: inline-flex; align-items: center; justify-content: center; width: 62px; height: 62px; margin-bottom: 16px; border-radius: 50%; background: var(--hc2-gradient-gold); color: #2c1e08; font-size: 28px; font-weight: 900; }

/* Manage / voucher style */
body.hc-public-booking-page .hc-public-page-manage .hc-public-confirmation {
    background: repeating-linear-gradient(#fff, #fff 100%);
    border: 1px dashed var(--hc2-line);
}
body.hc-public-booking-page .hc-public-page-manage .hc-public-confirmation h1 { letter-spacing: .06em; font-family: var(--hc2-font-latin); }
body.hc-public-booking-page .hc-cancellation-box { margin-top: 22px; padding: 18px; border-radius: var(--hc2-radius-md); background: var(--hc2-bg); text-align: start; }
body.hc-public-booking-page .hc-booking-success-card{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:22px;margin-top:24px;padding:24px;border:1px solid #d5e9df;border-radius:22px;background:linear-gradient(135deg,#f2fbf6,#fffaf0);text-align:start}
body.hc-public-booking-page .hc-booking-success-copy{display:flex;align-items:flex-start;gap:13px}.hc-booking-success-copy>span{display:grid;place-items:center;flex:0 0 38px;width:38px;height:38px;border-radius:50%;background:#0e795a;color:#fff;font-weight:900}.hc-booking-success-copy h2{margin:0 0 7px;font-size:22px;color:#073d30}.hc-booking-success-copy p{margin:0 0 8px;color:#58766c;line-height:1.8}.hc-booking-success-copy strong{color:#0e795a}
body.hc-public-booking-page .hc-booking-qr{grid-row:span 2;margin:0;padding:10px;border:1px solid #dce8e3;border-radius:16px;background:#fff;text-align:center}.hc-booking-qr img{display:block;width:132px;height:132px}.hc-booking-qr figcaption{margin-top:5px;color:#173f35;font:800 12px var(--hc2-font-latin)}
body.hc-public-booking-page .hc-booking-success-card>.hc-button{justify-self:start;grid-column:1}
@media(max-width:640px){body.hc-public-booking-page .hc-booking-success-card{grid-template-columns:1fr;padding:19px;text-align:center}.hc-booking-success-copy{flex-direction:column;align-items:center!important}.hc-booking-qr{grid-row:auto!important;justify-self:center}.hc-booking-success-card>.hc-button{grid-column:auto!important;justify-self:stretch!important;width:100%}}

/* ---------- Responsive ---------- */

@media (max-width: 960px) {
    body.hc-public-booking-page .hc-search-filter-grid { grid-template-columns: 1fr 1fr; }
    body.hc-public-booking-page .hc-hotel-overview,
    body.hc-public-booking-page .hc-hotel-bottom,
    body.hc-public-booking-page .hc-car-page-layout,
    body.hc-public-booking-page .hc-checkout-grid { grid-template-columns: 1fr; }
    body.hc-public-booking-page .hc-checkout-summary { position: static; }
    body.hc-public-booking-page .hc-hotel-room { grid-template-columns: 1fr; }
    body.hc-public-booking-page .hc-hotel-room-booking { align-items: stretch; text-align: center; padding-inline-start: 0; border-inline-start: 0; border-top: 1px dashed var(--hc2-line); padding-top: 14px; }
    body.hc-public-booking-page .hc-car-page-heading { grid-template-columns: 1fr; }
    body.hc-public-booking-page .hc-car-page-photo,
    body.hc-public-booking-page .hc-car-page-art { min-height: 220px; }
}

@media (max-width: 720px) {
    body.hc-public-booking-page .hc-public-shell { width: min(100%, calc(100% - 24px)); }
    body.hc-public-booking-page .hc-public-topbar { gap: 10px 18px; margin: 6px 0 20px; }
    body.hc-public-booking-page .hc-public-steps { order: 2; flex-basis: 100%; }
    body.hc-public-booking-page .hc-public-steps span { font-size: 12px; }
    body.hc-public-booking-page .hc-public-steps span:not(:last-child)::after { margin-inline: 7px; font-size: 13px; }
    body.hc-public-booking-page .hc-public-hero h1 { font-size: 24px; }
    body.hc-public-booking-page .hc-service-picker { display: flex; width: 100%; }
    body.hc-public-booking-page .hc-service-picker label { flex: 1 1 0; text-align: center; }
    body.hc-public-booking-page .hc-search-primary { padding: 14px; }
    body.hc-public-booking-page .hc-search-primary .hc-field { flex: 1 1 100%; }
    body.hc-public-booking-page .hc-search-primary .hc-field-narrow { flex: 1 1 calc(33.333% - 7px); }
    body.hc-public-booking-page .hc-search-primary .hc-button { flex: 1 1 100%; width: 100%; }
    body.hc-public-booking-page .hc-search-filter-grid { grid-template-columns: 1fr; }
    body.hc-public-booking-page .hc-hotel-gallery,
    body.hc-public-booking-page .hc-hotel-gallery:has(> :first-child:nth-last-child(5)) {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-rows: none;
        grid-auto-rows: 130px;
    }
    body.hc-public-booking-page .hc-hotel-gallery > :first-child,
    body.hc-public-booking-page .hc-hotel-gallery:has(> :first-child:nth-last-child(5)) > :first-child { grid-row: auto; grid-column: 1 / -1; }
    body.hc-public-booking-page .hc-hotel-gallery.is-single { grid-template-columns: 1fr; grid-auto-rows: 220px; }
    body.hc-public-booking-page .hc-car-spec-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2px 10px; }
    body.hc-public-booking-page .hc-car-spec-grid > div { padding: 10px 0; column-gap: 9px; }
    body.hc-public-booking-page .hc-car-spec-grid strong { font-size: 14px; }
    body.hc-public-booking-page .hc-car-feature-row { gap: 8px 14px; }
    body.hc-public-booking-page .hc-result-card-footer { flex-direction: column; align-items: stretch; gap: 10px; }

    /* Own the stacking rather than inheriting the legacy column flip, which put
       flex-end on the inline axis and pushed Arabic headings to the left edge. */
    body.hc-public-booking-page .hc-results-heading { flex-direction: column; align-items: flex-start; gap: 6px; }
    body.hc-public-booking-page .hc-hotel-heading { flex-direction: column; align-items: stretch; gap: 14px; }
    body.hc-public-booking-page .hc-hotel-heading > div { flex: 0 0 auto; }
    body.hc-public-booking-page .hc-hotel-heading > .hc-button { align-self: flex-start; }
    body.hc-public-booking-page .hc-car-page-section { padding: 18px; }
    body.hc-public-booking-page .hc-car-section-head { margin-bottom: 14px; }
    body.hc-public-booking-page .hc-checkout-product.has-image { grid-template-columns: 48px 1fr; }
    body.hc-public-booking-page .hc-checkout-product-image { width: 48px; height: 48px; }
}

@media print {
    @page { size: A4 portrait; margin: 12mm; }
    html,body,body.hc-public-booking-page{background:#fff!important;color:#123c32!important}
    body.hc-public-booking-page header,
    body.hc-public-booking-page footer,
    body.hc-public-booking-page .hc-public-topbar,
    body.hc-public-booking-page .hc-no-print,
    body.hc-public-booking-page .hc-public-tools,
    body.hc-public-booking-page .hc-public-steps { display: none !important; }
    body.hc-public-booking-page .hc-public-shell{width:100%!important;max-width:none!important;margin:0!important;padding:0!important}
    body.hc-public-booking-page .hc-public-page-manage .hc-public-confirmation{width:100%!important;max-width:none!important;margin:0!important;padding:18px!important;border:1px solid #d9e4df!important;box-shadow:none!important;break-inside:avoid}
    body.hc-public-booking-page .hc-booking-success-card{break-inside:avoid;box-shadow:none!important;background:#fff!important}
    body.hc-public-booking-page .hc-booking-qr img{print-color-adjust:exact;-webkit-print-color-adjust:exact}
}

/* ---------- HalaCham identity — open search, no boxed hero ---------- */

body.hc-public-booking-page {
    --hc2-olive-900: #343b2f;
    --hc2-olive-800: #485043;
    --hc2-olive-700: #626b5a;
    --hc2-sand: #f3eee3;
    --hc2-sand-deep: #e8dfcd;
    --hc2-coral: #d77756;
    background: #f7f6f1;
}

body.hc-public-booking-page .hc-public-shell {
    width: min(1180px, calc(100% - 40px));
    padding-top: 10px;
}

body.hc-public-booking-page .hc-public-brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--hc2-olive-900);
    text-decoration: none;
}

body.hc-public-booking-page .hc-public-brand img {
    width: 72px;
    height: 36px;
    object-fit: contain;
}

body.hc-public-booking-page .hc-public-brand span {
    display: grid;
    gap: 1px;
    padding-inline-start: 10px;
    border-inline-start: 1px solid var(--hc2-sand-deep);
}

body.hc-public-booking-page .hc-public-brand strong {
    color: var(--hc2-olive-900);
    font-size: 13px;
    line-height: 1.2;
}

body.hc-public-booking-page .hc-public-brand small {
    color: var(--hc2-muted);
    font-size: 10px;
    font-weight: 700;
}

body.hc-public-booking-page .hc-public-hero,
body.hc-public-booking-page .hc-public-hero .hc-search-form {
    overflow: visible;
    margin-bottom: 28px;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    backdrop-filter: none;
}

body.hc-public-booking-page .hc-public-hero h1 {
    max-width: 720px;
    margin: 0 0 10px;
    color: var(--hc2-green-900) !important;
    font-size: clamp(28px, 4vw, 44px);
    line-height: 1.2;
}

body.hc-public-booking-page .hc-public-hero .hc-eyebrow {
    color: var(--hc2-gold-700) !important;
}

body.hc-public-booking-page .hc-public-lead {
    max-width: 640px;
    color: var(--hc2-muted) !important;
}

body.hc-public-booking-page .hc-public-hero .hc-service-picker,
body.hc-public-booking-page form .hc-service-picker label span,
body.hc-public-booking-page form .hc-service-picker input:checked + span {
    min-height: 0;
    padding: 0;
    border: 0;
    background: transparent !important;
    color: inherit !important;
    box-shadow: none !important;
}

body.hc-public-booking-page .hc-search-primary {
    padding: 16px 18px;
    border: 1px solid rgba(98, 107, 90, .12);
    border-radius: 22px;
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 18px 46px rgba(52, 59, 47, .07);
}

body.hc-public-booking-page .hc-search-primary .hc-field > span {
    color: var(--hc2-olive-700);
    font-size: 10px;
}

/* This rule previously set border-color: transparent, which is what kept the
   fields inside the search bar looking edgeless however the base rule was
   changed. Each field keeps its own visible neutral edge. */
body.hc-public-booking-page .hc-search-primary :is(input, select) {
    border: 1px solid var(--hc2-control-line);
    background: #fff;
}
body.hc-public-booking-page .hc-search-primary :is(input, select):focus {
    border-color: var(--hc2-green-600);
}

body.hc-public-booking-page .hc-public-hero .hc-search-primary .hc-button {
    flex: 0 0 auto;
    align-self: end;
    width: auto;
    min-width: 132px;
    min-height: 46px;
    border-radius: 14px;
}

body.hc-public-booking-page .hc-button-primary {
    background: var(--hc2-coral);
    color: #fff;
    box-shadow: 0 10px 22px rgba(215, 119, 86, .22);
}

body.hc-public-booking-page .hc-button-primary:hover {
    background: #bf6246;
    color: #fff;
}

body.hc-public-booking-page .hc-result-card:hover {
    border-color: rgba(215, 119, 86, .3);
}

@media (max-width: 900px) {
    body.hc-public-booking-page .hc-public-brand span { display: none; }
    body.hc-public-booking-page .hc-public-steps { order: 3; flex-basis: 100%; }
}

@media (max-width: 720px) {
    body.hc-public-booking-page .hc-public-shell { width: min(100%, calc(100% - 20px)); }
    body.hc-public-booking-page .hc-public-hero,
    body.hc-public-booking-page .hc-public-hero .hc-search-form {
        padding: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
    }
    body.hc-public-booking-page .hc-search-primary {
        padding: 14px;
        border-radius: 18px;
    }
}

/* ---------- Compact booking header and liquid-glass service switch ---------- */

body.hc-public-booking-page .hc-public-topbar {
    flex-wrap: nowrap;
    margin: 8px 0 34px;
}

body.hc-public-booking-page .hc-public-steps {
    display: inline-flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 4px;
    padding: 5px;
    border: 1px solid #dedfd9;
    border-radius: 999px;
    background: rgba(255, 255, 255, .72);
    box-shadow: 0 7px 24px rgba(52, 59, 47, .045);
    backdrop-filter: blur(14px) saturate(130%);
    -webkit-backdrop-filter: blur(14px) saturate(130%);
}

body.hc-public-booking-page .hc-public-steps span {
    position: relative;
    display: inline-flex;
    min-height: 32px;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 6px 12px;
    border: 0;
    border-radius: 999px !important;
    background: transparent !important;
    box-shadow: none;
    color: #858980;
    font-size: 11px;
    font-weight: 750;
    white-space: nowrap;
}

body.hc-public-booking-page .hc-public-steps b {
    display: grid;
    width: 19px;
    height: 19px;
    place-items: center;
    border: 1px solid #cfd2cb;
    border-radius: 50%;
    color: #73786e;
    font-size: 9px;
    line-height: 1;
}

body.hc-public-booking-page .hc-public-steps span:not(:last-child)::after {
    content: "";
    position: static;
    width: 18px;
    height: 1px;
    margin-inline: 8px -2px;
    background: #d9dbd5;
}

body.hc-public-booking-page .hc-public-steps .is-current {
    border: 0;
    border-radius: 999px !important;
    background: #fff !important;
    color: var(--hc2-olive-900);
    box-shadow: 0 4px 14px rgba(52, 59, 47, .1);
    text-decoration: none;
}

body.hc-public-booking-page .hc-public-steps .is-current b {
    border-color: var(--hc2-coral);
    background: var(--hc2-coral);
    color: #fff;
}

body.hc-public-booking-page .hc-public-steps .is-complete {
    border: 0;
    border-radius: 999px !important;
    background: transparent !important;
    box-shadow: none;
    color: var(--hc2-olive-700);
}

body.hc-public-booking-page .hc-public-steps .is-complete b {
    border-color: #aab5a5;
    background: #eef2eb;
    color: var(--hc2-olive-700);
}

body.hc-public-booking-page .hc-public-hero h1 {
    margin: 0 0 20px;
    font-size: clamp(25px, 3vw, 34px);
    line-height: 1.25;
}

body.hc-public-booking-page .hc-public-hero .hc-service-picker {
    display: inline-flex;
    gap: 5px;
    margin: 0 0 14px;
    padding: 5px !important;
    border: 1px solid rgba(255, 255, 255, .75) !important;
    border-radius: 999px !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, .76), rgba(235, 239, 234, .5)) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .9),
        0 10px 28px rgba(52, 59, 47, .09);
    backdrop-filter: blur(18px) saturate(145%);
    -webkit-backdrop-filter: blur(18px) saturate(145%);
}

body.hc-public-booking-page .hc-service-picker label {
    display: block;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: transparent;
    box-shadow: none;
    color: #747a70;
}

body.hc-public-booking-page .hc-service-picker span,
body.hc-public-booking-page form .hc-service-picker label span,
body.hc-public-booking-page form .hc-service-picker input:checked + span {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 9px 17px;
    border: 1px solid transparent !important;
    border-radius: 999px !important;
    background: transparent !important;
    box-shadow: none !important;
    color: inherit !important;
    font-size: 13px;
    font-weight: 800;
    transition: background-color .18s ease, box-shadow .18s ease, color .18s ease;
}

body.hc-public-booking-page .hc-service-picker svg {
    width: 19px;
    height: 19px;
    flex: 0 0 19px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

body.hc-public-booking-page .hc-service-picker label:has(input:checked) {
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: var(--hc2-olive-900);
}

body.hc-public-booking-page .hc-service-picker input:checked + span,
body.hc-public-booking-page form .hc-service-picker input:checked + span {
    border-color: rgba(255, 255, 255, .9) !important;
    background: rgba(255, 255, 255, .94) !important;
    box-shadow:
        0 5px 16px rgba(52, 59, 47, .12),
        inset 0 1px 0 #fff !important;
    color: var(--hc2-olive-900) !important;
}

body.hc-public-booking-page .hc-service-picker input:focus-visible + span {
    outline: 3px solid rgba(215, 119, 86, .42);
    outline-offset: 2px;
}

body.hc-public-booking-page .hc-search-primary {
    border: 1px solid #cfd2cc;
    background: #fff;
    box-shadow: 0 12px 32px rgba(52, 59, 47, .065);
}

@media (max-width: 720px) {
    body.hc-public-booking-page .hc-public-topbar {
        align-items: flex-start;
        flex-wrap: wrap;
        gap: 14px;
    }

    body.hc-public-booking-page .hc-public-steps {
        order: 0;
        width: 100%;
        overflow-x: auto;
    }

    body.hc-public-booking-page .hc-public-steps span {
        flex: 1 0 auto;
        padding-inline: 9px;
    }

    body.hc-public-booking-page .hc-public-tools {
        order: 1;
    }

    body.hc-public-booking-page .hc-public-hero .hc-service-picker {
        width: 100%;
    }

    body.hc-public-booking-page .hc-service-picker label {
        flex: 1;
    }

    body.hc-public-booking-page .hc-service-picker span,
    body.hc-public-booking-page form .hc-service-picker label span {
        width: 100%;
    }
}

/* ===================================================================
   v0.47 — Provider identity (logo or automatic mark)
   =================================================================== */
body.hc-public-booking-page .hc-result-provider {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    margin: 0 0 8px;
}
body.hc-public-booking-page .hc-result-provider > span:not(.hc-brand-mark) {
    display: grid;
    gap: 1px;
    min-width: 0;
    line-height: 1.25;
}
body.hc-public-booking-page .hc-result-provider small {
    display: block;
    color: var(--hc2-muted);
    font-size: 11px;
    font-weight: 700;
}
body.hc-public-booking-page .hc-result-provider strong {
    display: block;
    overflow: hidden;
    color: var(--hc2-ink);
    font-size: 14px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}
body.hc-public-booking-page .hc-result-title-row {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}
body.hc-public-booking-page .hc-result-title-row h3 { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; }

body.hc-public-booking-page .hc-checkout-provider {
    display: flex;
    align-items: center;
    gap: 9px;
    margin: -6px 0 16px;
    padding: 0 4px;
    color: rgba(255, 255, 255, .72);
    font-size: 12.5px;
    line-height: 1.4;
}
body.hc-public-booking-page .hc-checkout-provider strong { color: #fff; font-weight: 800; }
body.hc-public-booking-page .hc-checkout-provider .hc-brand-mark { border-color: rgba(255, 255, 255, .2); }

body.hc-public-booking-page .hc-hotel-heading > .hc-hotel-identity {
    display: flex;
    align-items: center;
    gap: 16px;
    min-width: 0;
}
body.hc-public-booking-page .hc-hotel-identity > div { min-width: 0; }
body.hc-public-booking-page .hc-hotel-provider{display:flex;align-items:baseline;gap:5px;margin:5px 0 0;color:var(--hc2-muted);font-size:11px;line-height:1.35}
body.hc-public-booking-page .hc-hotel-provider small{font:inherit;font-weight:600}
body.hc-public-booking-page .hc-hotel-provider strong{overflow:hidden;max-width:min(300px,55vw);color:var(--hc2-ink);font-size:12px;font-weight:800;text-overflow:ellipsis;white-space:nowrap}

body.hc-public-booking-page .hc-provider-chip {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin-top: 13px;
    padding: 3px 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    max-width: 100%;
}
[dir="rtl"] body.hc-public-booking-page .hc-provider-chip,
body.hc-public-booking-page [dir="rtl"] .hc-provider-chip { padding: 3px 0; }
/* A rounded square, not a circle: a circle would clip the corners of wide wordmarks. */
body.hc-public-booking-page .hc-provider-chip .hc-brand-mark { --hc-mark-size: 34px; border-radius: 10px; box-shadow:none; }
body.hc-public-booking-page .hc-provider-chip > span:not(.hc-brand-mark) { display: grid; gap: 1px; min-width: 0; line-height: 1.25; }
body.hc-public-booking-page .hc-car-page-heading .hc-provider-chip small {
    display: block;
    color: var(--hc2-muted);
    font-size: 11px;
    font-weight: 700;
    line-height: 1.25;
}
body.hc-public-booking-page .hc-provider-chip strong {
    display: block;
    overflow: hidden;
    color: var(--hc2-ink);
    max-width:min(270px,55vw);
    font-size: 12.5px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* One shared structure for every car fact. Keeping the icon and the two text
   lines in the same flex row removes the model-year-only grid offset in RTL. */
body.hc-public-booking-page .hc-car-spec-grid>.hc-car-spec-item{display:flex;align-items:center;justify-content:flex-start;gap:10px;min-width:0;padding:12px 0;text-align:start}
body.hc-public-booking-page .hc-car-spec-grid>.hc-car-spec-item>.hc-car-icon{display:block;width:22px;height:22px;flex:0 0 22px;margin:0!important;transform:none!important}
body.hc-public-booking-page .hc-car-spec-grid>.hc-car-spec-item>.hc-car-spec-copy{display:grid;grid-template-columns:1fr;grid-template-rows:auto auto;gap:1px;min-width:0;line-height:1.3}
body.hc-public-booking-page .hc-car-spec-grid>.hc-car-spec-item>.hc-car-spec-copy>strong{grid-column:auto;grid-row:auto;color:var(--hc2-green-900);font-size:15px;font-weight:800;line-height:1.3}
body.hc-public-booking-page .hc-car-spec-grid>.hc-car-spec-item>.hc-car-spec-copy>small{grid-column:auto;grid-row:auto;color:var(--hc2-muted);font-size:11.5px;font-weight:700;line-height:1.3}
@media (max-width: 760px) {
    body.hc-public-booking-page .hc-hotel-identity .hc-brand-mark { --hc-mark-size: 44px; }
}

body.hc-public-booking-page .hc-room-quantity { display:grid;gap:6px;margin-top:12px;text-align:start;font-weight:800; }
body.hc-public-booking-page .hc-room-quantity select { min-width:112px;height:44px;border:1px solid var(--hc2-line);border-radius:12px;background:#fff;padding-inline:12px;font:inherit; }
body.hc-public-booking-page .hc-room-selection-bar { position:sticky;z-index:12;bottom:16px;display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:20px;margin:24px 0;padding:16px 18px;border:1px solid rgba(18,112,83,.18);border-radius:18px;background:rgba(255,255,255,.96);box-shadow:0 18px 48px rgba(7,54,42,.16);backdrop-filter:blur(14px); }
body.hc-public-booking-page .hc-room-selection-bar > div { display:grid;gap:3px; }
body.hc-public-booking-page .hc-room-selection-bar small { color:var(--hc2-muted); }
body.hc-public-booking-page .hc-room-selection-bar .is-complete strong { color:#0b7a58; }
body.hc-public-booking-page .hc-room-selection-bar > strong { font-size:20px;color:var(--hc2-ink); }
body.hc-public-booking-page .hc-room-selection-bar button:disabled { opacity:.45;cursor:not-allowed; }
body.hc-public-booking-page .hc-coupon-box { display:grid;gap:10px;margin-top:18px;padding:16px;border:1px dashed rgba(255,255,255,.35);border-radius:15px;background:rgba(255,255,255,.08); }
body.hc-public-booking-page .hc-coupon-row { display:flex;gap:8px; }
body.hc-public-booking-page .hc-coupon-row input { min-width:0;flex:1;height:44px;border:0;border-radius:11px;padding:0 12px;text-transform:uppercase; }
body.hc-public-booking-page .hc-discount-line { color:#bff3dc; }
body.hc-public-booking-page .hc-checkout-room-lines { display:grid;gap:7px;padding:11px 0;border-bottom:1px solid rgba(255,255,255,.14); }
body.hc-public-booking-page .hc-checkout-room-lines p { margin:0!important; }
@media(max-width:700px){body.hc-public-booking-page .hc-room-selection-bar{grid-template-columns:1fr auto;bottom:8px}.hc-room-selection-bar button{grid-column:1/-1;width:100%}}
.hc-result-amenities .hc-amenity-icon{width:17px;height:17px;flex:0 0 17px}
body.hc-public-booking-page .hc-hotel-amenities-panel{padding:18px!important;border-color:#dfe8e3!important;border-radius:18px!important;background:linear-gradient(180deg,#fff 0%,#fbfdfc 100%)!important;box-shadow:0 10px 28px rgba(7,54,42,.055)!important}
body.hc-public-booking-page .hc-hotel-amenities-panel h2{margin:0 0 14px!important;font-size:21px!important;line-height:1.3!important}
body.hc-public-booking-page .hc-hotel-amenity-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px!important;margin:0!important;padding:0!important;list-style:none!important}
body.hc-public-booking-page .hc-hotel-amenity-grid li{display:flex!important;align-items:center!important;gap:9px!important;min-width:0;min-height:48px;padding:9px 11px!important;border:1px solid #dfe8e3!important;border-radius:12px!important;background:#fff!important;box-shadow:0 2px 8px rgba(7,54,42,.035)!important;color:#153f34!important;font-size:13px!important;font-weight:750!important;line-height:1.3!important;text-align:start!important}
body.hc-public-booking-page .hc-hotel-amenity-grid .hc-amenity-icon{width:19px!important;height:19px!important;flex:0 0 19px!important;color:#16805f}
body.hc-public-booking-page .hc-hotel-amenity-grid li span{min-width:0;overflow-wrap:anywhere}
.hc-car-page-notes[open]{border-color:#e7c98a;background:#fffdf8}.hc-car-page-notes summary{cursor:pointer}.hc-driver-requirements{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:16px 0;padding:16px;border:1px solid #f0d391;border-radius:16px;background:#fff9e9}.hc-driver-requirements-title{grid-column:1/-1;display:flex;align-items:center;gap:9px;color:#8b5d00}.hc-driver-requirement{display:grid;grid-template-columns:auto 1fr;gap:2px 10px;align-items:center;padding:12px;background:#fff;border-radius:12px}.hc-driver-requirement .hc-car-icon{grid-row:1/3;color:#b87900}.hc-driver-requirement span{font-size:12px;color:#65766f}.hc-driver-requirement strong{font-size:16px}.hc-driver-requirements>small{grid-column:1/-1;color:#765d29}
@media(max-width:640px){
body.hc-public-booking-page .hc-hotel-overview{gap:12px!important;margin-bottom:20px!important}
body.hc-public-booking-page .hc-hotel-amenities-panel{padding:13px 11px!important;border-radius:15px!important;box-shadow:0 5px 16px rgba(7,54,42,.04)!important}
body.hc-public-booking-page .hc-hotel-amenities-panel h2{margin-bottom:9px!important;font-size:19px!important}
body.hc-public-booking-page .hc-hotel-amenity-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:6px!important}
body.hc-public-booking-page .hc-hotel-amenity-grid li{min-height:42px!important;height:auto!important;flex-direction:row!important;justify-content:flex-start!important;gap:7px!important;padding:7px 8px!important;border-radius:10px!important;box-shadow:none!important;font-size:11.5px!important;line-height:1.25!important;text-align:start!important}
body.hc-public-booking-page .hc-hotel-amenity-grid .hc-amenity-icon{width:17px!important;height:17px!important;flex:0 0 17px!important}
.hc-driver-requirements{grid-template-columns:1fr}
}

/* 0.62 — On phones, let customers read the car specifications and terms before
   asking them to choose dates. The desktop sidebar remains unchanged. */
@media(max-width:960px){
body.hc-public-booking-page .hc-car-page-main{order:1}
body.hc-public-booking-page .hc-car-reservation{position:static!important;top:auto!important;order:2}
}
@media(max-width:640px){
body.hc-public-booking-page .hc-car-page-layout{gap:12px!important;margin-top:14px!important}
body.hc-public-booking-page .hc-car-reservation{justify-self:center;width:calc(100% - 12px)!important;max-width:100%;margin:2px auto 0!important;padding:16px 14px!important;border:1px solid var(--hc2-line)!important;border-top:3px solid var(--hc2-gold-500)!important;border-image:none!important;border-radius:17px!important;box-shadow:0 8px 24px rgba(10,46,36,.07)!important;overflow:hidden}
body.hc-public-booking-page .hc-car-reservation-head h2{margin:3px 0 4px!important;font-size:19px!important;line-height:1.35!important}
body.hc-public-booking-page .hc-car-reservation-head p{margin:0 0 13px!important;font-size:11.5px!important;line-height:1.5!important}
body.hc-public-booking-page .hc-car-date-form{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;width:100%;min-width:0;padding:0 2px}
body.hc-public-booking-page .hc-car-date-form .hc-field{display:grid;width:100%;min-width:0!important;max-width:100%;gap:5px;overflow:hidden}
body.hc-public-booking-page .hc-car-date-form .hc-field span{font-size:11.5px!important}
body.hc-public-booking-page .hc-car-date-form input[type=date]{display:block;appearance:none!important;-webkit-appearance:none!important;width:100%!important;min-width:0!important;max-width:100%!important;height:46px!important;margin:0!important;padding:8px 7px!important;border-radius:10px!important;font-size:13px!important;line-height:1!important;text-align:center!important}
body.hc-public-booking-page .hc-car-date-form input[type=date]::-webkit-date-and-time-value{text-align:center!important}
body.hc-public-booking-page .hc-car-date-form .hc-button{grid-column:1/-1;width:100%;min-height:46px!important;margin-top:2px!important;border-radius:12px!important}
body.hc-public-booking-page .hc-car-availability{margin:12px 2px!important;white-space:normal!important;font-size:12px!important}
body.hc-public-booking-page .hc-car-quote-form{gap:11px!important;padding:0 2px}
body.hc-public-booking-page .hc-car-extra-list label{min-width:0;padding:9px!important;border-radius:10px!important}
body.hc-public-booking-page .hc-car-total{padding-top:11px!important}
body.hc-public-booking-page .hc-car-total strong{font-size:24px!important}
body.hc-public-booking-page .hc-car-quote-form>.hc-button{min-height:48px!important;border-radius:12px!important}
}