:root {
    --midnight: #0d2633;
    --navy: #123b4b;
    --surface: #1b4e60;
    --surface-2: #28677a;
    --line: rgba(195, 235, 241, .24);
    --muted: #b6d0d7;
    --text: #f4fbff;
    --cyan: #34d5f5;
    --cyan-strong: #00a9dc;
    --lime: #c7f36b;
    --shadow: 0 24px 70px rgba(0, 0, 0, .28);
}

html { scroll-behavior: smooth; }
body {
    background: radial-gradient(circle at 82% 12%, rgba(52, 213, 245, .12), transparent 30%), var(--midnight);
    color: var(--text);
    letter-spacing: .01em;
}

.site-nav {
    padding: 0 1.25rem;
    background: linear-gradient(180deg, rgba(4, 13, 22, .9), rgba(4, 13, 22, 0));
    transition: background .25s ease, box-shadow .25s ease, backdrop-filter .25s ease;
}
.site-nav.is-scrolled {
    background: rgba(7, 19, 31, .88);
    box-shadow: 0 12px 40px rgba(0, 0, 0, .18);
    backdrop-filter: blur(18px);
}
.site-nav .nav-inner { max-width: 1280px; margin: auto; min-height: 84px; }
.site-nav .brand-mark { width: 130px; filter: brightness(0) invert(1); }
.site-nav .nav_link {
    position: relative;
    display: inline-flex;
    align-items: center;
    min-height: 42px;
    color: rgba(244, 251, 255, .72);
    font-size: .92rem;
    font-weight: 600;
    transition: color .2s ease;
}
.site-nav .nav_link:hover, .site-nav .nav_link.active { color: #fff; }
.site-nav .nav_link::after {
    content: ""; position: absolute; left: 0; right: 100%; bottom: 2px; height: 2px;
    border-radius: 10px; background: var(--cyan); transition: right .2s ease;
}
.site-nav .nav_link:hover::after, .site-nav .nav_link.active::after { right: 0; }
.site-nav .nav-action {
    display: inline-flex; align-items: center; justify-content: center; gap: .45rem;
    min-height: 42px; padding: 0 1.1rem; border: 1px solid var(--line); border-radius: 999px;
    color: #fff; font-weight: 700; font-size: .88rem; transition: all .2s ease;
}
.site-nav .nav-action:hover { border-color: var(--cyan); background: rgba(52, 213, 245, .12); transform: translateY(-1px); }
.site-nav .nav-action.primary { color: var(--midnight); background: var(--lime); border-color: var(--lime); }
.site-nav .nav-action.primary:hover { background: #dbff8b; border-color: #dbff8b; }

.btn-general, .premium-button {
    display: inline-flex; align-items: center; justify-content: center; gap: .55rem;
    min-height: 48px; padding: .75rem 1.35rem; border-radius: 999px;
    border: 1px solid var(--cyan); background: var(--cyan); color: var(--midnight) !important;
    font-weight: 800; box-shadow: 0 10px 24px rgba(52, 213, 245, .16);
    transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.btn-general:hover, .premium-button:hover { transform: translateY(-2px); background: #8ceeff; box-shadow: 0 16px 34px rgba(52, 213, 245, .22); }
.btn-secondary { background: transparent; border: 1px solid var(--line); color: var(--text) !important; box-shadow: none; }
.btn-secondary:hover { background: rgba(255,255,255,.06); border-color: var(--cyan); }

section { position: relative; }
.section-kicker { color: var(--cyan); font-size: .78rem; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; }
.section-title { color: #fff; font-size: clamp(2rem, 4vw, 3.55rem); line-height: 1.02; font-weight: 800; letter-spacing: -.04em; }
.section-copy { color: var(--muted); line-height: 1.8; max-width: 660px; }

/* Home hero and shared content polish */
body > section:first-of-type { min-height: 760px; }
body > section:first-of-type::after {
    content: ""; position: absolute; inset: auto 0 0; height: 120px;
    background: linear-gradient(180deg, transparent, rgba(13,38,51,.68)); pointer-events: none;
}
.hero-panel { max-width: 780px; padding: 10rem 0 6rem; }
.hero-panel h1, .hero-panel h2 { letter-spacing: -.055em; }
.hero-panel .hero-eyebrow { display: inline-flex; align-items: center; gap: .6rem; color: var(--lime); font-size: .82rem; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; }
.hero-panel .hero-eyebrow::before { content: ""; width: 32px; height: 2px; background: var(--lime); }

.bg-section_grey { background: #103542 !important; }
.bg-card_grey, .bg-section_grey .bg-card_grey { background: linear-gradient(145deg, rgba(40, 103, 122, .92), rgba(24, 70, 86, .96)) !important; }
.bg-primary { background: var(--cyan-strong) !important; }
.text-light_grey { color: var(--muted) !important; }
.text-white { color: #fff !important; }
.border-bound_grey { border-color: var(--line) !important; }

.courts a, .vendor-card, .ground-card, .feature-card, .testimonial-card {
    border: 1px solid var(--line); border-radius: 22px; background: linear-gradient(145deg, rgba(20, 52, 69, .85), rgba(8, 24, 36, .95));
    box-shadow: 0 16px 34px rgba(0, 0, 0, .16); transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.courts a:hover, .vendor-card:hover, .ground-card:hover, .feature-card:hover, .testimonial-card:hover { transform: translateY(-5px); border-color: rgba(52, 213, 245, .55); box-shadow: var(--shadow); }
.courts img, .ground-card img { transition: transform .45s ease; }
.courts a:hover img, .ground-card:hover img { transform: scale(1.04); }

/* Forms, tables, checkout, dashboard */
input, select, textarea { color: #fff !important; background: rgba(255,255,255,.045) !important; border-color: var(--line) !important; border-radius: 14px !important; }
input::placeholder, textarea::placeholder { color: #78909d !important; }
input:focus, select:focus, textarea:focus { border-color: var(--cyan) !important; box-shadow: 0 0 0 4px rgba(52, 213, 245, .1) !important; }
table { border-collapse: separate !important; border-spacing: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 18px; }
thead th { background: rgba(52, 213, 245, .12) !important; color: #e9fbff !important; border-color: var(--line) !important; font-size: .78rem; letter-spacing: .08em; text-transform: uppercase; }
tbody td { color: #d9e8ef !important; border-color: var(--line) !important; background: rgba(255,255,255,.025); }
tbody tr:hover td { background: rgba(52, 213, 245, .055); }
.tab { border-bottom: 2px solid transparent; transition: all .2s ease; }
.tab.general-active, .tab:hover { color: var(--cyan) !important; border-color: var(--cyan); }
.dataTable, .checkout-table { background: rgba(11, 31, 47, .6); }
.empty-cart-panel { box-shadow: 0 22px 60px rgba(0, 0, 0, .16); }
.status-badge { display: inline-flex; align-items: center; padding: .35rem .65rem; border-radius: 999px; font-size: .75rem; font-weight: 800; }
.ground-booking-card { border: 1px solid var(--line); background: linear-gradient(145deg, rgba(43, 108, 126, .96), rgba(25, 72, 88, .98)); border-radius: 24px; box-shadow: var(--shadow); }
.ground-booking-card .text-dark_grey { color: #d9e8ef !important; }
.ground-booking-card .border-t-2 { border-color: var(--line) !important; }
.booking-card-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.booking-eyebrow { color: var(--cyan); font-size: .72rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.booking-step { display: inline-flex; align-items: center; padding: .45rem .7rem; border: 1px solid var(--line); border-radius: 999px; color: var(--muted); font-size: .72rem; font-weight: 800; letter-spacing: .08em; }
.court-picker-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: .65rem; }
.court-picker-option { min-height: 90px; padding: .8rem .9rem; border: 1px solid var(--line); border-radius: 16px; background: rgba(255,255,255,.035); color: var(--text); text-align: left; transition: border-color .2s ease, transform .2s ease, background .2s ease, box-shadow .2s ease; }
.court-picker-option:hover { border-color: rgba(52,213,245,.6); transform: translateY(-2px); }
.court-picker-option.is-selected { border-color: var(--cyan); background: linear-gradient(145deg, rgba(52,213,245,.2), rgba(52,213,245,.06)); box-shadow: 0 10px 24px rgba(52,213,245,.12); }
.court-picker-option span, .court-picker-option em { display: block; color: var(--muted); font-size: .72rem; font-style: normal; }
.court-picker-option strong { display: block; margin: .25rem 0; color: #fff; font-size: 1.08rem; line-height: 1.1; }
.court-picker-option em { color: var(--lime); font-size: .66rem; font-weight: 700; }
.booking-date-input { background: rgba(255,255,255,.055) !important; border-color: var(--line) !important; }

.auth-shell { min-height: 100vh; background: radial-gradient(circle at 15% 10%, rgba(52,213,245,.15), transparent 34%), var(--midnight); }
.auth-card { border: 1px solid var(--line); background: rgba(16, 44, 60, .72); backdrop-filter: blur(18px); border-radius: 28px; box-shadow: var(--shadow); }
.auth-aside { background: linear-gradient(160deg, rgba(4, 21, 32, .35), rgba(4, 21, 32, .92)), url('../images/aboutUsOne.jpg') center/cover; }
.auth-aside::after { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 70% 20%, rgba(52,213,245,.35), transparent 35%); }

footer { background: linear-gradient(180deg, #123b4b, #0a2632) !important; border-top: 1px solid var(--line); }
footer h3 { color: #fff !important; font-size: 1rem !important; letter-spacing: .08em; text-transform: uppercase; }
footer a:hover { color: var(--cyan) !important; }

@media (max-width: 1023px) {
    .site-nav { background: rgba(7, 19, 31, .93); }
    .site-nav #nav_menu { background: rgba(7, 19, 31, .98); border: 1px solid var(--line); border-radius: 18px; padding: .8rem; }
    .site-nav #nav_menu li { border-color: var(--line) !important; }
    body > section:first-of-type { min-height: 680px; }
}

@media (max-width: 640px) {
    .site-nav .nav-inner { min-height: 72px; }
    .site-nav .brand-mark { width: 108px; }
    .hero-panel { padding-top: 8rem; }
    table { min-width: 720px; }
}

/* Premium light/dark balance: deep hero moments, bright readable content. */
.site-body {
    --content-ink: #173746;
    --content-muted: #607984;
    --content-bg: #f3f8f9;
    --content-surface: #ffffff;
    --content-line: #d8e7eb;
    background: var(--content-bg) !important;
    color: var(--content-ink);
}
.site-body .bg-section_grey,
.site-body .bg-dark {
    background: var(--content-bg) !important;
}
.site-body .bg-card_grey,
.site-body .bg-section_grey .bg-card_grey {
    background: var(--content-surface) !important;
    border: 1px solid var(--content-line);
    box-shadow: 0 18px 44px rgba(23, 55, 70, .08);
}
.site-body .section-title,
.site-body .bg-section_grey h1,
.site-body .bg-section_grey h2,
.site-body .bg-section_grey h3,
.site-body .bg-section_grey h4,
.site-body .bg-section_grey h5,
.site-body .bg-section_grey h6,
.site-body .bg-dark h1,
.site-body .bg-dark h2,
.site-body .bg-dark h3,
.site-body .bg-dark h4,
.site-body .bg-dark h5,
.site-body .bg-dark h6 {
    color: var(--content-ink) !important;
}
.site-body .bg-section_grey .text-white,
.site-body .bg-dark .text-white,
.site-body .bg-section_grey .text-gray-800,
.site-body .bg-dark .text-gray-800 {
    color: var(--content-ink) !important;
}
.site-body .bg-section_grey .text-light_grey,
.site-body .bg-dark .text-light_grey,
.site-body .section-copy {
    color: var(--content-muted) !important;
}
.site-body .bg-primary,
.site-body thead th {
    color: #fff !important;
}
.site-body .bg-primary .text-white,
.site-body thead .text-white {
    color: #fff !important;
}
.site-body .courts a,
.site-body .vendor-card,
.site-body .ground-card,
.site-body .feature-card,
.site-body .testimonial-card {
    background: var(--content-surface) !important;
    border-color: var(--content-line);
    box-shadow: 0 18px 42px rgba(23, 55, 70, .09);
}
.site-body .courts a .text-white,
.site-body .vendor-card .text-white,
.site-body .ground-card .text-white,
.site-body .feature-card .text-white,
.site-body .testimonial-card .text-white {
    color: var(--content-ink) !important;
}
.site-body .courts a .bg-card_grey,
.site-body .vendor-card .bg-card_grey,
.site-body .ground-card .bg-card_grey {
    background: #eaf5f7 !important;
    border: 0;
    box-shadow: none;
}
.site-body input,
.site-body select,
.site-body textarea {
    color: var(--content-ink) !important;
    background: #fff !important;
    border-color: var(--content-line) !important;
}
.site-body input::placeholder,
.site-body textarea::placeholder {
    color: #8aa0a8 !important;
}
.site-body input:focus,
.site-body select:focus,
.site-body textarea:focus {
    border-color: var(--cyan-strong) !important;
    box-shadow: 0 0 0 4px rgba(0, 169, 220, .12) !important;
}
.site-body .checkout-table,
.site-body .dataTable {
    background: #fff !important;
    box-shadow: 0 18px 44px rgba(23, 55, 70, .08);
}
.site-body tbody td {
    color: var(--content-ink) !important;
    background: #fff !important;
    border-color: var(--content-line) !important;
}
.site-body tbody tr:hover td { background: #f2fafb !important; }
.site-body .bg-shortHeroSection {
    background-color: #123b4b;
    box-shadow: inset 0 -90px 110px rgba(9, 37, 49, .38);
}
.site-body .bg-shortHeroSection::before { background-color: rgba(7, 30, 41, .42) !important; }
.site-body .ground-booking-card {
    background: linear-gradient(145deg, #1f6173, #154657) !important;
    border-color: rgba(255,255,255,.23);
}
.site-body .ground-booking-card input,
.site-body .ground-booking-card select,
.site-body .ground-booking-card textarea {
    color: #f7fdff !important;
    background: rgba(255,255,255,.09) !important;
    border-color: rgba(210,241,245,.3) !important;
}
.site-body .ground-booking-card .text-white,
.site-body .ground-booking-card h1,
.site-body .ground-booking-card h2,
.site-body .ground-booking-card h3,
.site-body .ground-booking-card label {
    color: #f7fdff !important;
}
.site-body .ground-booking-card .text-light_grey,
.site-body .ground-booking-card .text-dark_grey { color: #c9e0e5 !important; }
.site-body .booking-date-input { background: rgba(255,255,255,.09) !important; }
.site-body .auth-shell {
    background: #edf5f6 !important;
}
.site-body .auth-card {
    background: #fff !important;
    border-color: var(--content-line);
    box-shadow: 0 24px 70px rgba(23, 55, 70, .12);
}
.site-body .auth-card h1,
.site-body .auth-card h2,
.site-body .auth-card h3 { color: var(--content-ink) !important; }
.site-body .auth-card .text-light_grey { color: var(--content-muted) !important; }
.site-body .auth-card label { color: var(--content-muted) !important; }
.site-body .auth-aside {
    background: linear-gradient(160deg, rgba(10,55,70,.2), rgba(7,35,47,.82)), url('../images/aboutUsOne.jpg') center/cover;
}
.site-body .empty-cart-panel { background: #fff !important; }
.site-body footer { background: linear-gradient(180deg, #123b4b, #0d2d3b) !important; }

@media (max-width: 1023px) {
    .site-nav { background: rgba(13, 48, 61, .96); }
    .site-nav #nav_menu { background: #123b4b; }
}

/* Auth pages use the same bright workspace with a dark editorial side panel. */
.auth-shell {
    --content-ink: #173746;
    --content-muted: #607984;
    background: #edf5f6 !important;
    color: var(--content-ink);
}
.auth-shell .auth-card {
    background: #fff !important;
    border-color: #d8e7eb;
    box-shadow: 0 24px 70px rgba(23,55,70,.12);
}
.auth-shell .auth-card h1,
.auth-shell .auth-card h2,
.auth-shell .auth-card h3 { color: var(--content-ink) !important; }
.auth-shell .auth-card .text-light_grey,
.auth-shell .auth-card label { color: var(--content-muted) !important; }
.auth-shell input,
.auth-shell select,
.auth-shell textarea {
    color: var(--content-ink) !important;
    background: #f8fbfc !important;
    border-color: #d8e7eb !important;
}
.auth-shell .auth-aside {
    background: linear-gradient(160deg, rgba(10,55,70,.2), rgba(7,35,47,.84)), url('../images/aboutUsOne.jpg') center/cover;
}

/* Final light-only system and responsive pass. */
:root {
    --midnight: #f6fbfc;
    --navy: #ffffff;
    --surface: #ffffff;
    --surface-2: #eef8fa;
    --line: #d7e7eb;
    --muted: #647d87;
    --text: #173746;
    --cyan: #08a9d2;
    --cyan-strong: #078daf;
    --lime: #c9ef72;
    --shadow: 0 22px 60px rgba(23, 55, 70, .11);
}
html, body { max-width: 100%; overflow-x: hidden; }
.site-body,
.auth-shell {
    background: #f6fbfc !important;
    color: #173746 !important;
}
.site-body .site-nav {
    background: rgba(255,255,255,.92) !important;
    border-bottom: 1px solid rgba(215,231,235,.9);
    box-shadow: 0 8px 28px rgba(23,55,70,.07);
    backdrop-filter: blur(18px);
}
.site-body .site-nav.is-scrolled { background: rgba(255,255,255,.98) !important; }
.site-body .site-nav .brand-mark { filter: none !important; }
.site-body .site-nav .nav_link { color: #47636d !important; }
.site-body .site-nav .nav_link:hover,
.site-body .site-nav .nav_link.active { color: #078daf !important; }
.site-body .site-nav .nav-action {
    color: #173746 !important;
    border-color: #cfe3e8;
    background: #fff;
}
.site-body .site-nav .nav-action:hover { background: #eefafd; border-color: #08a9d2; }
.site-body .site-nav .nav-action.primary { background: #c9ef72; border-color: #c9ef72; color: #173746 !important; }
.site-body .site-nav #hamburger { border-color: #08a9d2 !important; }
.site-body .site-nav #hamburger > div > div { background: #078daf !important; }
.site-body .site-nav #nav_menu { background: #fff !important; }
.site-body .site-nav #nav_menu li { border-color: #d7e7eb !important; }
.site-body > section:first-of-type,
.site-body > main > section:first-of-type { min-height: 680px; }
.site-body > section:first-of-type::after,
.site-body > main > section:first-of-type::after {
    height: 90px;
    background: linear-gradient(180deg, transparent, rgba(246,251,252,.9)) !important;
}
.site-body .hero-panel { padding-top: 10rem; padding-bottom: 5rem; }
.site-body .hero-panel h1,
.site-body .hero-panel h2,
.site-body .hero-panel .text-white { color: #173746 !important; text-shadow: none; }
.site-body .hero-panel .hero-eyebrow { color: #078daf !important; }
.site-body .hero-panel .hero-eyebrow::before { background: #08a9d2; }
.site-body .hero-panel .hero-eyebrow span { background: #08a9d2 !important; }
.site-body > section:first-of-type > .absolute.bg-gradient-to-tl {
    background: linear-gradient(120deg, rgba(255,255,255,.78), rgba(236,249,251,.58)) !important;
}
.site-body .bg-shortHeroSection {
    background-color: #eaf7f9 !important;
    box-shadow: none;
}
.site-body .bg-shortHeroSection::before { background-color: rgba(255,255,255,.78) !important; }
.site-body .bg-shortHeroSection h1,
.site-body .bg-shortHeroSection h2,
.site-body .bg-shortHeroSection .text-white { color: #173746 !important; text-shadow: none; }
.site-body .bg-courtBG::before { background: rgba(255,255,255,.78) !important; }
.site-body .bg-funCount { background-color: #eef8fa !important; background-blend-mode: screen; }
.site-body section.bg-dark video { opacity: .18; filter: brightness(1.2) saturate(.78); }
.site-body .bg-section_grey svg path[fill="white"],
.site-body .bg-dark svg path[fill="white"] { fill: #08a9d2 !important; }
.site-body .section-title,
.site-body .section-kicker { color: #078daf !important; }
.site-body .section-title { color: #173746 !important; }
.site-body .bg-section_grey,
.site-body .bg-dark { background: #f6fbfc !important; }
.site-body .bg-card_grey,
.site-body .bg-section_grey .bg-card_grey { background: #fff !important; border-color: #d7e7eb !important; }
.site-body .courts a,
.site-body .vendor-card,
.site-body .ground-card,
.site-body .feature-card,
.site-body .testimonial-card {
    color: #173746 !important;
    background: #fff !important;
    border-color: #d7e7eb !important;
    box-shadow: 0 18px 44px rgba(23,55,70,.09) !important;
}
.site-body .courts a:hover,
.site-body .vendor-card:hover,
.site-body .ground-card:hover,
.site-body .feature-card:hover,
.site-body .testimonial-card:hover { border-color: #72d7e8 !important; box-shadow: 0 24px 58px rgba(8,141,175,.14) !important; }
.site-body .courts a .text-white,
.site-body .vendor-card .text-white,
.site-body .ground-card .text-white,
.site-body .feature-card .text-white,
.site-body .testimonial-card .text-white { color: #173746 !important; }
.site-body .courts a svg { stroke: #078daf !important; }
.site-body .courts a .bg-card_grey { background: #eef8fa !important; }
.site-body .btn-general,
.site-body .premium-button { background: #08a9d2 !important; border-color: #08a9d2 !important; color: #fff !important; }
.site-body .btn-general:hover,
.site-body .premium-button:hover { background: #078daf !important; border-color: #078daf !important; }
.site-body .btn-secondary { background: #fff !important; border-color: #cfe3e8 !important; color: #173746 !important; }
.site-body .btn-secondary:hover { background: #eefafd !important; border-color: #08a9d2 !important; }
.site-body input,
.site-body select,
.site-body textarea,
.auth-shell input,
.auth-shell select,
.auth-shell textarea {
    min-height: 48px;
    color: #173746 !important;
    background: #fff !important;
    border-color: #d7e7eb !important;
}
.site-body .ground-booking-card {
    color: #173746 !important;
    background: #fff !important;
    border: 1px solid #d7e7eb !important;
    box-shadow: 0 22px 58px rgba(23,55,70,.12) !important;
}
.site-body .ground-booking-card .text-white,
.site-body .ground-booking-card h1,
.site-body .ground-booking-card h2,
.site-body .ground-booking-card h3,
.site-body .ground-booking-card label { color: #173746 !important; }
.site-body .ground-booking-card .text-light_grey,
.site-body .ground-booking-card .text-dark_grey { color: #647d87 !important; }
.site-body .ground-booking-card input,
.site-body .ground-booking-card select,
.site-body .ground-booking-card textarea,
.site-body .ground-booking-card .booking-date-input {
    color: #173746 !important;
    background: #f8fcfd !important;
    border-color: #cfe3e8 !important;
}
.site-body .court-picker-option {
    color: #173746 !important;
    background: #f8fcfd !important;
    border-color: #d7e7eb !important;
}
.site-body .court-picker-option strong { color: #173746 !important; }
.site-body .court-picker-option span,
.site-body .court-picker-option em { color: #647d87 !important; }
.site-body .court-picker-option em { color: #078daf !important; }
.site-body .court-picker-option:hover,
.site-body .court-picker-option.is-selected { background: #eaf9fb !important; border-color: #08a9d2 !important; }
.site-body table { background: #fff !important; border-color: #d7e7eb !important; }
.site-body thead th { background: #e9f8fa !important; color: #176176 !important; border-color: #d7e7eb !important; }
.site-body thead th.text-white { color: #176176 !important; }
.site-body tbody td { color: #173746 !important; background: #fff !important; border-color: #e5eff1 !important; }
.site-body tbody tr:hover td { background: #f2fafb !important; }
.site-body .tab { color: #647d87 !important; }
.site-body .tab.general-active,
.site-body .tab:hover { color: #078daf !important; border-color: #08a9d2 !important; }
.site-body footer { background: #eef8fa !important; border-top: 1px solid #d7e7eb; }
.site-body footer h3,
.site-body footer .text-white { color: #173746 !important; }
.site-body footer .text-light_grey { color: #647d87 !important; }
.site-body footer a { color: #647d87 !important; }
.site-body footer a:hover { color: #078daf !important; }
.site-body footer .bg-section_grey { background: #fff !important; }
.auth-shell .auth-card { background: #fff !important; border-color: #d7e7eb !important; }
.auth-shell .auth-aside {
    background: linear-gradient(160deg, rgba(255,255,255,.88), rgba(232,247,249,.8)), url('../images/aboutUsOne.jpg') center/cover !important;
}
.auth-shell .auth-aside h1,
.auth-shell .auth-aside h2,
.auth-shell .auth-aside .text-white { color: #173746 !important; }
.auth-shell .auth-aside .text-light_grey { color: #647d87 !important; }
.auth-shell .premium-button { color: #fff !important; }

/* Fluid spacing prevents the legacy fixed-width utility layout from overflowing. */
.site-body .container,
.auth-shell .container { width: 100%; max-width: 1280px; padding-left: clamp(1rem, 3vw, 2.5rem); padding-right: clamp(1rem, 3vw, 2.5rem); }
.site-body img { max-width: 100%; }
.site-body .grid,
.site-body .flex { min-width: 0; }
.site-body .overflow-x-auto { max-width: 100%; -webkit-overflow-scrolling: touch; }
.site-body .checkout-table { min-width: 720px; }
.site-body .hero-panel h2 { font-size: clamp(2rem, 5vw, 4.25rem) !important; line-height: 1.05; }
.site-body .bg-shortHeroSection h1 { font-size: clamp(2.25rem, 6vw, 4.5rem) !important; line-height: 1.05; }

@media (max-width: 1023px) {
    .site-body .site-nav { padding: 0 .75rem; }
    .site-body .site-nav .nav-inner { min-height: 72px; padding-top: .7rem; padding-bottom: .7rem; }
    .site-body .site-nav #nav_menu { margin-top: 4.5rem; padding: .75rem; border: 1px solid #d7e7eb; border-radius: 18px; box-shadow: 0 18px 36px rgba(23,55,70,.12); }
    .site-body .site-nav #nav_menu .nav_link { min-height: 44px; width: 100%; justify-content: center; }
    .site-body > section:first-of-type,
    .site-body > main > section:first-of-type { min-height: 590px; }
    .site-body .hero-panel { padding-top: 8.5rem; padding-bottom: 4rem; }
    .site-body .hero-panel h2 { max-width: 700px; }
}
@media (max-width: 640px) {
    .site-body .site-nav .brand-mark { width: 108px; }
    .site-body .hero-panel { padding-top: 8rem; padding-bottom: 3rem; }
    .site-body .hero-panel h2 { font-size: clamp(2rem, 10vw, 3rem) !important; }
    .site-body .btn-general,
    .site-body .premium-button { width: 100%; }
    .site-body .ground-booking-card { border-radius: 20px; }
    .site-body .booking-card-heading { flex-direction: column; }
    .site-body .court-picker-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .site-body .court-picker-option { min-height: 76px; padding: .7rem; }
    .site-body .checkout-table { min-width: 680px; }
    .auth-shell .auth-card { border-radius: 20px; padding: 1.25rem !important; }
}

/* Homepage hero: a clean editorial layout with no full-screen video overlay. */
.site-body .home-hero {
    position: relative;
    min-height: 720px;
    overflow: hidden;
    background: linear-gradient(135deg, #f8fcfd 0%, #edf8fa 58%, #e3f5f7 100%);
    padding: 9rem 0 5.5rem;
}
.site-body .home-hero::after { display: none !important; }
.site-body .home-hero-inner {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 1.02fr) minmax(0, .98fr);
    align-items: center;
    gap: clamp(2.5rem, 6vw, 6rem);
}
.site-body .home-hero-copy { max-width: 650px; }
.site-body .home-hero-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: .6rem;
    color: #078daf;
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .2em;
    text-transform: uppercase;
}
.site-body .home-hero-eyebrow::before {
    content: "";
    width: 34px;
    height: 2px;
    border-radius: 99px;
    background: #08a9d2;
}
.site-body .home-hero-copy h1 {
    margin-top: 1.25rem;
    max-width: 680px;
    color: #173746 !important;
    font-size: clamp(3rem, 6vw, 5.8rem);
    font-weight: 800;
    letter-spacing: -.065em;
    line-height: .98;
}
.site-body .home-hero-copy > p {
    max-width: 560px;
    margin-top: 1.65rem;
    color: #607984;
    font-size: clamp(1rem, 1.7vw, 1.22rem);
    line-height: 1.75;
}
.site-body .home-hero-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 1.25rem;
    margin-top: 2rem;
}
.site-body .home-hero-actions .premium-button { width: auto; min-width: 170px; }
.site-body .home-hero-text-link {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    color: #173746;
    font-weight: 800;
}
.site-body .home-hero-text-link:hover { color: #078daf; }
.site-body .home-hero-trust {
    display: flex;
    flex-wrap: wrap;
    gap: 1.8rem;
    margin-top: 3.25rem;
    padding-top: 1.4rem;
    border-top: 1px solid #cfe3e8;
}
.site-body .home-hero-trust div { display: flex; flex-direction: column; gap: .2rem; }
.site-body .home-hero-trust strong { color: #173746; font-size: 1.35rem; line-height: 1; }
.site-body .home-hero-trust span { color: #718992; font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }
.site-body .home-hero-visual { position: relative; min-height: 480px; }
.site-body .home-hero-image-card {
    position: absolute;
    inset: 0 2.5rem 2.5rem 0;
    overflow: hidden;
    border: 10px solid #fff;
    border-radius: 34px;
    background: #fff;
    box-shadow: 0 28px 70px rgba(23,55,70,.16);
    transform: rotate(2deg);
}
.site-body .home-hero-image-card img { width: 100%; height: 100%; object-fit: cover; }
.site-body .home-hero-image-caption {
    position: absolute;
    right: 1.25rem;
    bottom: 1.25rem;
    left: 1.25rem;
    display: flex;
    align-items: center;
    gap: .55rem;
    padding: .8rem 1rem;
    border: 1px solid rgba(255,255,255,.72);
    border-radius: 14px;
    background: rgba(255,255,255,.86);
    color: #173746;
    font-size: .8rem;
    font-weight: 800;
    backdrop-filter: blur(10px);
}
.site-body .home-hero-caption-dot { width: 9px; height: 9px; flex: none; border-radius: 50%; background: #8fcf35; }
.site-body .home-hero-floating-card {
    position: absolute;
    right: 0;
    bottom: 0;
    z-index: 2;
    display: flex;
    flex-direction: column;
    gap: .35rem;
    width: min(245px, 75%);
    padding: 1.15rem 1.25rem;
    border: 1px solid #d7e7eb;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 20px 48px rgba(23,55,70,.14);
}
.site-body .home-hero-floating-label { color: #078daf; font-size: .7rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.site-body .home-hero-floating-card strong { color: #173746; font-size: 1.12rem; }
.site-body .home-hero-floating-meta { color: #718992; font-size: .82rem; line-height: 1.45; }
.site-body .home-hero-orb { position: absolute; border-radius: 50%; pointer-events: none; }
.site-body .home-hero-orb-one { top: 8%; right: -90px; width: 300px; height: 300px; background: #d9f4f6; }
.site-body .home-hero-orb-two { bottom: -130px; left: 26%; width: 260px; height: 260px; background: #e4f6c8; }

@media (max-width: 900px) {
    .site-body .home-hero { min-height: auto; padding: 8rem 0 4.5rem; }
    .site-body .home-hero-inner { grid-template-columns: 1fr; gap: 3.5rem; }
    .site-body .home-hero-copy { max-width: 720px; }
    .site-body .home-hero-visual { min-height: 420px; max-width: 650px; width: 100%; margin: 0 auto; }
}
@media (max-width: 640px) {
    .site-body .home-hero { padding-top: 7.5rem; }
    .site-body .home-hero-copy h1 { font-size: clamp(2.75rem, 14vw, 4.2rem); }
    .site-body .home-hero-actions { align-items: stretch; flex-direction: column; gap: .8rem; }
    .site-body .home-hero-actions .premium-button { width: 100%; }
    .site-body .home-hero-text-link { justify-content: center; min-height: 44px; }
    .site-body .home-hero-trust { gap: 1rem; justify-content: space-between; margin-top: 2.3rem; }
    .site-body .home-hero-trust strong { font-size: 1.1rem; }
    .site-body .home-hero-trust span { font-size: .62rem; }
    .site-body .home-hero-visual { min-height: 330px; }
    .site-body .home-hero-image-card { inset: 0 1rem 2rem 0; border-width: 7px; border-radius: 24px; }
    .site-body .home-hero-image-caption { right: .7rem; bottom: .7rem; left: .7rem; padding: .65rem .75rem; font-size: .7rem; }
    .site-body .home-hero-floating-card { right: 0; width: 210px; padding: .85rem 1rem; border-radius: 16px; }
}

/* Homepage sections and footer: one polished, consistent system. */
.site-body .home-page { background: #f7fbfc; color: #173746; }
.site-body .home-trust-strip { background: #fff; border-top: 1px solid #dcebed; border-bottom: 1px solid #dcebed; }
.site-body .home-trust-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; padding-top: 1.35rem; padding-bottom: 1.35rem; }
.site-body .home-trust-item { display: flex; align-items: center; gap: .8rem; min-width: 0; padding: .35rem .8rem; }
.site-body .home-trust-icon { display: inline-flex; align-items: center; justify-content: center; width: 2.35rem; height: 2.35rem; flex: none; border-radius: 12px; background: #e9f8fa; color: #078daf; font-size: 1.1rem; font-weight: 800; }
.site-body .home-trust-item strong, .site-body .home-trust-item span { display: block; }
.site-body .home-trust-item strong { color: #173746; font-size: .9rem; }
.site-body .home-trust-item div span { margin-top: .2rem; color: #718992; font-size: .75rem; line-height: 1.35; }
.site-body .home-section { padding: clamp(4.5rem, 8vw, 7rem) 0; }
.site-body .home-courts-section { background: #f7fbfc; }
.site-body .home-vendors-section { background: #fff; border-top: 1px solid #e0eef0; border-bottom: 1px solid #e0eef0; }
.site-body .home-feature-section { background: #f7fbfc; }
.site-body .home-testimonials-section { background: #fff; }
.site-body .home-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 2rem; margin-bottom: 2.5rem; }
.site-body .home-section-heading-centered { justify-content: center; text-align: center; }
.site-body .home-section-heading h2 { max-width: 700px; margin-top: .6rem; color: #173746 !important; font-size: clamp(2rem, 4vw, 3.35rem); font-weight: 800; letter-spacing: -.045em; line-height: 1.04; }
.site-body .home-section-eyebrow { color: #078daf; font-size: .72rem; font-weight: 800; letter-spacing: .17em; text-transform: uppercase; }
.site-body .home-section-link { display: inline-flex; align-items: center; gap: .5rem; flex: none; color: #078daf; font-weight: 800; }
.site-body .home-section-link:hover { color: #173746; }
.site-body .home-courts-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.35rem; }
.site-body .home-court-card { display: flex; flex-direction: column; overflow: hidden; border: 1px solid #d8e8eb; border-radius: 22px; background: #fff; box-shadow: 0 14px 36px rgba(23,55,70,.07); transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.site-body .home-court-card:hover { transform: translateY(-6px); border-color: #7bd8e6; box-shadow: 0 24px 55px rgba(8,141,175,.13); }
.site-body .home-court-image-wrap { position: relative; height: 235px; overflow: hidden; background: #eaf7f9; }
.site-body .home-court-image-wrap img { width: 100%; height: 100%; object-fit: cover; transition: transform .45s ease; }
.site-body .home-court-card:hover .home-court-image-wrap img { transform: scale(1.05); }
.site-body .home-card-badge { position: absolute; top: 1rem; left: 1rem; padding: .42rem .7rem; border: 1px solid rgba(255,255,255,.72); border-radius: 999px; background: rgba(255,255,255,.9); color: #176176; font-size: .68rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.site-body .home-court-body { padding: 1.25rem 1.3rem 1.35rem; }
.site-body .home-card-title-row { display: flex; align-items: start; justify-content: space-between; gap: .8rem; }
.site-body .home-card-title-row h3, .site-body .home-vendor-card h3 { color: #173746 !important; font-size: 1.18rem; font-weight: 800; line-height: 1.2; }
.site-body .home-card-arrow { color: #078daf; font-size: 1.2rem; font-weight: 800; }
.site-body .home-card-location { min-height: 1.4rem; margin-top: .5rem; color: #718992; font-size: .85rem; }
.site-body .home-card-price-row { display: flex; align-items: center; justify-content: space-between; gap: .8rem; margin-top: 1rem; padding-top: .95rem; border-top: 1px solid #e2eef0; color: #718992; font-size: .78rem; }
.site-body .home-card-price-row strong { color: #173746; }
.site-body .home-card-rating { color: #078daf; font-weight: 800; }
.site-body .home-vendors-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.site-body .home-vendor-card { display: flex; align-items: center; gap: .9rem; min-width: 0; padding: 1.1rem; border: 1px solid #d8e8eb; border-radius: 18px; background: #f8fcfd; transition: transform .2s ease, border-color .2s ease, background .2s ease; }
.site-body .home-vendor-card:hover { transform: translateY(-3px); border-color: #7bd8e6; background: #fff; }
.site-body .home-vendor-mark { display: flex; align-items: center; justify-content: center; width: 3rem; height: 3rem; flex: none; border-radius: 15px; background: #dff5f7; color: #078daf; font-size: 1.15rem; font-weight: 800; }
.site-body .home-vendor-card p { margin-top: .25rem; color: #718992; font-size: .76rem; }
.site-body .home-vendor-card > .home-card-arrow { margin-left: auto; }
.site-body .home-feature-grid { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); align-items: center; gap: clamp(2.5rem, 7vw, 7rem); }
.site-body .home-feature-image { position: relative; min-height: 520px; overflow: hidden; border-radius: 28px; background: #eaf7f9; box-shadow: 0 22px 60px rgba(23,55,70,.12); }
.site-body .home-feature-image img { width: 100%; height: 100%; min-height: 520px; object-fit: cover; }
.site-body .home-feature-label { position: absolute; right: 1.2rem; bottom: 1.2rem; left: 1.2rem; padding: .85rem 1rem; border-radius: 14px; background: rgba(255,255,255,.9); color: #173746; font-size: .8rem; font-weight: 800; }
.site-body .home-feature-copy h2 { max-width: 620px; margin-top: .65rem; color: #173746; font-size: clamp(2rem, 4vw, 3.35rem); font-weight: 800; letter-spacing: -.045em; line-height: 1.04; }
.site-body .home-feature-copy > p { max-width: 590px; margin-top: 1.25rem; color: #647d87; font-size: 1.05rem; line-height: 1.75; }
.site-body .home-benefits-list { display: grid; gap: 1rem; margin-top: 2rem; }
.site-body .home-benefits-list > div { display: grid; grid-template-columns: 2.1rem 1fr; gap: .75rem; padding-bottom: 1rem; border-bottom: 1px solid #dcebed; }
.site-body .home-benefits-list > div > span { color: #08a9d2; font-size: .75rem; font-weight: 800; }
.site-body .home-benefits-list strong { color: #173746; font-size: .98rem; }
.site-body .home-benefits-list p { margin-top: .25rem; color: #718992; font-size: .86rem; line-height: 1.5; }
.site-body .home-feature-button { width: auto; margin-top: 1.8rem; }
.site-body .home-testimonials-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.site-body .home-testimonial { display: flex; flex-direction: column; min-height: 245px; padding: 1.6rem; border: 1px solid #d8e8eb; border-radius: 20px; background: #f8fcfd; }
.site-body .home-stars { color: #f0b83b; letter-spacing: .18em; font-size: .85rem; }
.site-body .home-testimonial blockquote { margin-top: 1.25rem; color: #365863; font-size: 1.02rem; line-height: 1.65; }
.site-body .home-testimonial-author { display: flex; align-items: center; gap: .65rem; margin-top: auto; padding-top: 1.25rem; }
.site-body .home-testimonial-author > span { display: inline-flex; align-items: center; justify-content: center; width: 2.35rem; height: 2.35rem; border-radius: 50%; background: #dff5f7; color: #078daf; font-size: .7rem; font-weight: 800; }
.site-body .home-testimonial-author strong, .site-body .home-testimonial-author small { display: block; }
.site-body .home-testimonial-author strong { color: #173746; font-size: .85rem; }
.site-body .home-testimonial-author small { margin-top: .12rem; color: #718992; font-size: .72rem; }
.site-body .home-cta-section { padding: 0 0 clamp(4.5rem, 8vw, 7rem); background: #fff; }
.site-body .home-cta-card { display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding: clamp(2rem, 5vw, 4rem); border-radius: 28px; background: linear-gradient(115deg, #e7f8fa, #f5fbe9); border: 1px solid #d4ebdd; }
.site-body .home-cta-card h2 { margin-top: .55rem; color: #173746; font-size: clamp(2rem, 4vw, 3.2rem); font-weight: 800; letter-spacing: -.045em; line-height: 1.04; }
.site-body .home-cta-card p { margin-top: .7rem; color: #647d87; }
.site-body .home-cta-card .premium-button { width: auto; flex: none; }
.site-body .home-empty-state { grid-column: 1 / -1; padding: 3rem; border: 1px dashed #b9d9df; border-radius: 18px; color: #718992; text-align: center; }

/* Footer redesign shared by every public screen. */
.site-body .site-footer { background: #fff !important; border-top: 1px solid #dcebed; }
.site-body .site-footer-main { display: grid; grid-template-columns: 1.35fr .7fr .7fr 1.35fr; gap: clamp(2rem, 5vw, 5rem); padding-top: 4.5rem; padding-bottom: 3.5rem; }
.site-body .site-footer-logo { width: 128px; height: auto; }
.site-body .site-footer-brand p { max-width: 320px; margin-top: 1.25rem; color: #718992; font-size: .88rem; line-height: 1.7; }
.site-body .site-footer-socials { display: flex; gap: .55rem; margin-top: 1.35rem; }
.site-body .site-footer-socials a { display: inline-flex; align-items: center; justify-content: center; width: 2.2rem; height: 2.2rem; border: 1px solid #d7e7eb; border-radius: 50%; background: #f6fbfc; color: #078daf !important; font-size: .78rem; font-weight: 800; }
.site-body .site-footer-socials a:hover { background: #e8f8fa; border-color: #7bd8e6; }
.site-body .site-footer-column, .site-body .site-footer-newsletter { display: flex; flex-direction: column; align-items: flex-start; }
.site-body .site-footer-column h3, .site-body .site-footer-newsletter h3 { color: #173746 !important; font-size: .9rem; font-weight: 800; }
.site-body .site-footer-column a { margin-top: .8rem; color: #718992 !important; font-size: .85rem; }
.site-body .site-footer-column a:hover { color: #078daf !important; }
.site-body .site-footer-newsletter > h3 { margin-top: .7rem; font-size: 1.25rem; line-height: 1.2; }
.site-body .site-footer-newsletter > p { margin-top: .55rem; color: #718992; font-size: .82rem; line-height: 1.55; }
.site-body .site-footer-subscribe { display: flex; width: 100%; max-width: 380px; margin-top: 1rem; overflow: hidden; border: 1px solid #d7e7eb; border-radius: 13px; background: #f8fcfd; }
.site-body .site-footer-subscribe input { min-width: 0; min-height: 46px; flex: 1; padding: .7rem .85rem; border: 0 !important; background: transparent !important; box-shadow: none !important; }
.site-body .site-footer-subscribe button { width: 48px; border: 0; background: #08a9d2; color: #fff; font-size: 1.2rem; font-weight: 800; }
.site-body .site-footer-bottom { display: flex; justify-content: space-between; gap: 1rem; padding-top: 1.15rem; padding-bottom: 1.15rem; border-top: 1px solid #dcebed; color: #8aa0a8; font-size: .73rem; }

@media (max-width: 960px) {
    .site-body .home-courts-grid, .site-body .home-vendors-grid, .site-body .home-testimonials-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .site-body .home-feature-grid { grid-template-columns: 1fr; }
    .site-body .home-feature-image { max-width: 680px; min-height: 390px; }
    .site-body .home-feature-image img { min-height: 390px; }
    .site-body .site-footer-main { grid-template-columns: 1.2fr 1fr 1fr; }
    .site-body .site-footer-newsletter { grid-column: 1 / -1; max-width: 560px; }
}
@media (max-width: 640px) {
    .site-body .home-trust-grid { grid-template-columns: 1fr; gap: .25rem; padding-top: 1rem; padding-bottom: 1rem; }
    .site-body .home-trust-item { padding: .45rem 0; }
    .site-body .home-section-heading { align-items: flex-start; flex-direction: column; gap: 1rem; }
    .site-body .home-section-heading h2 { font-size: 2.25rem; }
    .site-body .home-courts-grid, .site-body .home-vendors-grid, .site-body .home-testimonials-grid { grid-template-columns: 1fr; }
    .site-body .home-court-image-wrap { height: 210px; }
    .site-body .home-feature-image { min-height: 320px; }
    .site-body .home-feature-image img { min-height: 320px; }
    .site-body .home-cta-card { align-items: flex-start; flex-direction: column; }
    .site-body .home-cta-card .premium-button, .site-body .home-feature-button { width: 100%; }
    .site-body .site-footer-main { grid-template-columns: 1fr 1fr; gap: 2rem 1.5rem; padding-top: 3.5rem; }
    .site-body .site-footer-brand, .site-body .site-footer-newsletter { grid-column: 1 / -1; }
    .site-body .site-footer-bottom { align-items: flex-start; flex-direction: column; }
}

/* Vendor directory, offers and contact screens. */
.site-body .directory-page, .site-body .feature-page, .site-body .contact-page { background: #f7fbfc; color: #173746; }
.site-body .directory-hero, .site-body .feature-hero, .site-body .contact-hero { padding: 10rem 0 5.5rem; background: linear-gradient(135deg, #eef9fa, #f8fcfd); border-bottom: 1px solid #dcebed; }
.site-body .directory-hero-inner, .site-body .feature-hero-inner, .site-body .contact-hero-inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(230px, .46fr); align-items: end; gap: 3rem; }
.site-body .directory-eyebrow, .site-body .feature-eyebrow, .site-body .contact-eyebrow { color: #078daf; font-size: .72rem; font-weight: 800; letter-spacing: .17em; text-transform: uppercase; }
.site-body .directory-hero h1, .site-body .feature-hero h1, .site-body .contact-hero h1 { max-width: 760px; margin-top: .8rem; color: #173746; font-size: clamp(2.6rem, 6vw, 5rem); font-weight: 800; letter-spacing: -.06em; line-height: 1; }
.site-body .directory-hero p, .site-body .feature-hero p, .site-body .contact-hero p { max-width: 650px; margin-top: 1.2rem; color: #647d87; font-size: 1.08rem; line-height: 1.75; }
.site-body .directory-hero-actions, .site-body .feature-hero-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 1rem; margin-top: 1.8rem; }
.site-body .directory-hero-actions .premium-button, .site-body .feature-hero-actions .premium-button { width: auto; }
.site-body .directory-hero-note, .site-body .feature-text-link { color: #647d87; font-size: .84rem; font-weight: 700; }
.site-body .feature-text-link { display: inline-flex; align-items: center; gap: .45rem; color: #078daf; }
.site-body .directory-hero-card, .site-body .feature-hero-aside, .site-body .contact-hero-note { padding: 1.5rem; border: 1px solid #d2e8eb; border-radius: 22px; background: #fff; box-shadow: 0 18px 42px rgba(23,55,70,.08); }
.site-body .directory-hero-card { display: flex; flex-direction: column; gap: .6rem; }
.site-body .directory-hero-card-label, .site-body .feature-aside-number, .site-body .contact-hero-note span { color: #078daf; font-size: .7rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.site-body .directory-hero-card strong, .site-body .feature-hero-aside strong, .site-body .contact-hero-note strong { color: #173746; font-size: 1.2rem; line-height: 1.3; }
.site-body .directory-hero-card-line { display: flex; gap: .4rem; margin-top: 1.3rem; }
.site-body .directory-hero-card-line span { height: 6px; flex: 1; border-radius: 99px; background: #dff5f7; }
.site-body .directory-hero-card-line span:first-child { background: #08a9d2; }
.site-body .directory-section, .site-body .feature-section { padding: clamp(4.5rem, 8vw, 7rem) 0; }
.site-body .directory-heading { display: flex; align-items: end; justify-content: space-between; gap: 2rem; margin-bottom: 2.2rem; }
.site-body .directory-heading h2, .site-body .feature-section-heading h2, .site-body .contact-map-heading h2 { margin-top: .55rem; color: #173746; font-size: clamp(2rem, 4vw, 3.3rem); font-weight: 800; letter-spacing: -.045em; line-height: 1.05; }
.site-body .directory-heading p { margin-top: .5rem; color: #718992; }
.site-body .directory-count { padding: .5rem .8rem; border: 1px solid #cfe3e8; border-radius: 999px; color: #078daf; font-size: .75rem; font-weight: 800; white-space: nowrap; }
.site-body .vendor-directory-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.2rem; }
.site-body .vendor-directory-card { overflow: hidden; border: 1px solid #d8e8eb; border-radius: 22px; background: #fff; box-shadow: 0 14px 36px rgba(23,55,70,.07); transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease; }
.site-body .vendor-directory-card:hover { transform: translateY(-5px); border-color: #7bd8e6; box-shadow: 0 24px 55px rgba(8,141,175,.13); }
.site-body .vendor-directory-image { position: relative; height: 205px; overflow: hidden; background: #eaf7f9; }
.site-body .vendor-directory-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.site-body .vendor-directory-card:hover .vendor-directory-image img { transform: scale(1.04); }
.site-body .vendor-directory-badge { position: absolute; top: 1rem; left: 1rem; padding: .4rem .65rem; border: 1px solid rgba(255,255,255,.75); border-radius: 999px; background: rgba(255,255,255,.9); color: #176176; font-size: .67rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.site-body .vendor-directory-content { padding: 1.2rem; }
.site-body .vendor-directory-title { display: flex; align-items: center; gap: .7rem; }
.site-body .vendor-directory-mark { display: flex; align-items: center; justify-content: center; width: 2.7rem; height: 2.7rem; flex: none; border-radius: 13px; background: #e2f6f7; color: #078daf; font-weight: 800; }
.site-body .vendor-directory-title h3 { color: #173746; font-size: 1.05rem; font-weight: 800; }
.site-body .vendor-directory-title p { margin-top: .18rem; color: #718992; font-size: .73rem; }
.site-body .vendor-directory-arrow { margin-left: auto; color: #078daf; font-size: 1.25rem; font-weight: 800; }
.site-body .vendor-directory-footer { display: flex; justify-content: space-between; gap: .6rem; margin-top: 1.2rem; padding-top: .9rem; border-top: 1px solid #e2eef0; color: #718992; font-size: .76rem; }
.site-body .vendor-directory-rating { color: #078daf; font-weight: 800; }
.site-body .directory-cta, .site-body .feature-bottom-cta { padding: 0 0 clamp(4.5rem, 8vw, 7rem); }
.site-body .directory-cta-card, .site-body .feature-bottom-card { display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding: clamp(2rem, 5vw, 4rem); border: 1px solid #d4ebdd; border-radius: 26px; background: linear-gradient(115deg, #e7f8fa, #f5fbe9); }
.site-body .directory-cta-card h2, .site-body .feature-bottom-card h2 { margin-top: .55rem; color: #173746; font-size: clamp(2rem, 4vw, 3rem); font-weight: 800; letter-spacing: -.045em; line-height: 1.05; }
.site-body .directory-cta-card p { max-width: 580px; margin-top: .65rem; color: #647d87; }
.site-body .directory-cta-card .btn-general, .site-body .feature-bottom-card .btn-general { width: auto; flex: none; }
.site-body .feature-hero-aside { display: flex; flex-direction: column; gap: .7rem; }
.site-body .feature-aside-number { font-size: 2rem; letter-spacing: -.04em; }
.site-body .feature-hero-aside > span:last-child { color: #718992; font-size: .82rem; line-height: 1.5; }
.site-body .feature-section-heading { max-width: 720px; margin-bottom: 2.4rem; }
.site-body .feature-cards-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.site-body .feature-modern-card { display: flex; flex-direction: column; min-height: 280px; padding: 1.5rem; border: 1px solid #d8e8eb; border-radius: 20px; background: #fff; box-shadow: 0 14px 35px rgba(23,55,70,.06); }
.site-body .feature-modern-card:hover { border-color: #7bd8e6; }
.site-body .feature-card-top { display: flex; align-items: center; justify-content: space-between; }
.site-body .feature-card-index { color: #9bb1b8; font-size: .72rem; font-weight: 800; }
.site-body .feature-card-icon { display: inline-flex; align-items: center; justify-content: center; width: 2.8rem; height: 2.8rem; border-radius: 14px; background: #e9f8fa; color: #078daf; font-size: 1.2rem; }
.site-body .feature-modern-card h3 { margin-top: 2.2rem; color: #173746; font-size: 1.25rem; font-weight: 800; }
.site-body .feature-modern-card p { margin-top: .7rem; color: #718992; line-height: 1.65; }
.site-body .feature-card-link { display: inline-flex; align-items: center; gap: .45rem; margin-top: auto; padding-top: 1.25rem; color: #078daf; font-size: .82rem; font-weight: 800; }
.site-body .contact-hero-note { display: flex; flex-direction: column; gap: .6rem; }
.site-body .contact-hero-note small { color: #718992; font-size: .8rem; line-height: 1.45; }
.site-body .contact-map-section { padding: clamp(3.5rem, 7vw, 6rem) 0 0; background: #fff; }
.site-body .contact-map-heading { display: flex; align-items: end; justify-content: space-between; gap: 2rem; margin-bottom: 1.6rem; }
.site-body .contact-map-label { color: #078daf; font-size: .82rem; font-weight: 800; }
.site-body .contact-map { display: block; width: 100%; height: 360px; border: 0; border-radius: 22px; box-shadow: 0 18px 45px rgba(23,55,70,.1); }
.site-body .contact-section { padding: clamp(4.5rem, 8vw, 7rem) 0; background: #fff; }
.site-body .contact-grid { display: grid; grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr); gap: 1.2rem; align-items: stretch; }
.site-body .contact-info-card { padding: clamp(1.7rem, 4vw, 3rem); border-radius: 24px; background: linear-gradient(150deg, #e7f8fa, #f5fbe9); border: 1px solid #d4ebdd; }
.site-body .contact-info-card h2, .site-body .contact-form-heading h2 { margin-top: .6rem; color: #173746; font-size: clamp(2rem, 4vw, 3rem); font-weight: 800; letter-spacing: -.045em; line-height: 1.05; }
.site-body .contact-info-card > p, .site-body .contact-form-heading > p { margin-top: .8rem; color: #647d87; line-height: 1.7; }
.site-body .contact-detail-list { display: grid; gap: 1rem; margin-top: 2.2rem; }
.site-body .contact-detail-list > a, .site-body .contact-detail-list > div { display: flex; align-items: center; gap: .8rem; }
.site-body .contact-detail-list small, .site-body .contact-detail-list strong { display: block; }
.site-body .contact-detail-list small { color: #718992; font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }
.site-body .contact-detail-list strong { margin-top: .2rem; color: #173746; font-size: .9rem; line-height: 1.45; }
.site-body .contact-detail-icon { display: inline-flex; align-items: center; justify-content: center; width: 2.45rem; height: 2.45rem; flex: none; border-radius: 12px; background: rgba(255,255,255,.82); color: #078daf; font-weight: 800; }
.site-body .contact-social-row { display: flex; gap: .5rem; margin-top: 2rem; }
.site-body .contact-social-row a { display: inline-flex; align-items: center; justify-content: center; width: 2.25rem; height: 2.25rem; border: 1px solid #bfe0df; border-radius: 50%; color: #078daf; font-size: .76rem; font-weight: 800; }
.site-body .contact-form-card { padding: clamp(1.7rem, 4vw, 3rem); border: 1px solid #d8e8eb; border-radius: 24px; background: #fff; box-shadow: 0 18px 45px rgba(23,55,70,.08); }
.site-body .contact-form-card form { display: grid; gap: 1rem; margin-top: 1.8rem; }
.site-body .contact-form-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.site-body .contact-form-card label { display: grid; gap: .45rem; color: #47636d; font-size: .78rem; font-weight: 800; }
.site-body .contact-form-card input, .site-body .contact-form-card textarea { width: 100%; padding: .8rem .9rem; border: 1px solid #d7e7eb; border-radius: 12px !important; background: #f8fcfd !important; color: #173746 !important; }
.site-body .contact-form-card textarea { resize: vertical; }
.site-body .contact-submit-row { display: flex; align-items: center; gap: 1rem; padding-top: .35rem; }
.site-body .contact-submit-row .btn-general { width: auto; }
.site-body .contact-loader { width: 2rem; height: 2rem; border: 3px solid #b9dce3; border-top-color: #08a9d2; border-radius: 50%; animation: contact-spin .8s linear infinite; }
@keyframes contact-spin { to { transform: rotate(360deg); } }
.site-body .directory-empty { grid-column: 1 / -1; padding: 3rem; border: 1px dashed #b9d9df; border-radius: 18px; color: #718992; text-align: center; }
@media (max-width: 960px) {
    .site-body .directory-hero-inner, .site-body .feature-hero-inner, .site-body .contact-hero-inner { grid-template-columns: 1fr; align-items: start; }
    .site-body .directory-hero-card, .site-body .feature-hero-aside, .site-body .contact-hero-note { max-width: 430px; }
    .site-body .vendor-directory-grid, .site-body .feature-cards-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .site-body .contact-grid { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
    .site-body .directory-hero, .site-body .feature-hero, .site-body .contact-hero { padding: 8rem 0 4rem; }
    .site-body .directory-hero h1, .site-body .feature-hero h1, .site-body .contact-hero h1 { font-size: 2.7rem; }
    .site-body .directory-heading, .site-body .contact-map-heading { align-items: flex-start; flex-direction: column; gap: .8rem; }
    .site-body .vendor-directory-grid, .site-body .feature-cards-grid { grid-template-columns: 1fr; }
    .site-body .directory-cta-card, .site-body .feature-bottom-card { align-items: flex-start; flex-direction: column; }
    .site-body .directory-cta-card .btn-general, .site-body .feature-bottom-card .btn-general { width: 100%; }
    .site-body .contact-form-row { grid-template-columns: 1fr; }
    .site-body .contact-submit-row .btn-general { width: 100%; }
}

/* About and gallery editorial screens. */
.site-body .about-page, .site-body .gallery-page { background: #f7fbfc; color: #173746; }
.site-body .about-hero, .site-body .gallery-hero { padding: 10rem 0 5.5rem; background: linear-gradient(135deg, #eef9fa, #f8fcfd); border-bottom: 1px solid #dcebed; }
.site-body .about-hero-inner, .site-body .gallery-hero-inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, .7fr); align-items: center; gap: clamp(2rem, 6vw, 6rem); }
.site-body .about-eyebrow, .site-body .gallery-eyebrow { color: #078daf; font-size: .72rem; font-weight: 800; letter-spacing: .17em; text-transform: uppercase; }
.site-body .about-hero h1, .site-body .gallery-hero h1 { max-width: 720px; margin-top: .8rem; color: #173746; font-size: clamp(2.7rem, 6vw, 5rem); font-weight: 800; letter-spacing: -.06em; line-height: .99; }
.site-body .about-hero p, .site-body .gallery-hero p { max-width: 620px; margin-top: 1.2rem; color: #647d87; font-size: 1.08rem; line-height: 1.75; }
.site-body .about-hero .premium-button { width: auto; margin-top: 1.8rem; }
.site-body .about-hero-visual, .site-body .gallery-hero-collage { position: relative; min-height: 360px; overflow: hidden; border: 9px solid #fff; border-radius: 28px; background: #eaf7f9; box-shadow: 0 24px 60px rgba(23,55,70,.12); transform: rotate(1.5deg); }
.site-body .about-hero-visual img, .site-body .gallery-hero-collage img { width: 100%; height: 100%; min-height: 360px; object-fit: cover; }
.site-body .about-hero-visual span, .site-body .gallery-hero-collage span { position: absolute; right: 1rem; bottom: 1rem; left: 1rem; padding: .75rem 1rem; border: 1px solid rgba(255,255,255,.7); border-radius: 13px; background: rgba(255,255,255,.9); color: #173746; font-size: .8rem; font-weight: 800; }
.site-body .about-intro { padding: clamp(4.5rem, 8vw, 7rem) 0; background: #fff; }
.site-body .about-intro-grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); align-items: center; gap: clamp(2.5rem, 7vw, 7rem); }
.site-body .about-intro-image { overflow: hidden; border-radius: 26px; box-shadow: 0 20px 55px rgba(23,55,70,.1); }
.site-body .about-intro-image img { width: 100%; height: 520px; object-fit: cover; }
.site-body .about-intro-copy h2, .site-body .about-heading h2, .site-body .about-cta-card h2 { margin-top: .6rem; color: #173746; font-size: clamp(2rem, 4vw, 3.35rem); font-weight: 800; letter-spacing: -.045em; line-height: 1.05; }
.site-body .about-intro-copy > p { margin-top: 1.2rem; color: #647d87; line-height: 1.75; }
.site-body .about-values { display: grid; gap: 1rem; margin-top: 2rem; }
.site-body .about-values > div { display: grid; grid-template-columns: 2rem 1fr; gap: .7rem; padding-bottom: 1rem; border-bottom: 1px solid #dcebed; }
.site-body .about-values > div > span { color: #08a9d2; font-size: .75rem; font-weight: 800; }
.site-body .about-values > div > strong,
.site-body .about-values > div > p { grid-column: 2; }
.site-body .about-values strong { color: #173746; font-size: .98rem; }
.site-body .about-values p { margin-top: -.35rem; color: #718992; font-size: .85rem; line-height: 1.5; }
.site-body .about-principles { padding: clamp(4.5rem, 8vw, 7rem) 0; background: #f7fbfc; }
.site-body .about-heading { max-width: 650px; margin-bottom: 2.4rem; }
.site-body .about-principles-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.site-body .about-principles-grid article { min-height: 220px; padding: 1.5rem; border: 1px solid #d8e8eb; border-radius: 20px; background: #fff; }
.site-body .about-principles-grid article > span { display: inline-flex; align-items: center; justify-content: center; width: 2.7rem; height: 2.7rem; border-radius: 13px; background: #e9f8fa; color: #078daf; font-size: 1.2rem; }
.site-body .about-principles-grid h3 { margin-top: 1.6rem; color: #173746; font-size: 1.18rem; font-weight: 800; }
.site-body .about-principles-grid p { margin-top: .6rem; color: #718992; line-height: 1.6; }
.site-body .about-cta, .site-body .gallery-cta { padding: 0 0 clamp(4.5rem, 8vw, 7rem); background: #f7fbfc; }
.site-body .about-cta-card, .site-body .gallery-cta-card { display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding: clamp(2rem, 5vw, 4rem); border: 1px solid #d4ebdd; border-radius: 26px; background: linear-gradient(115deg, #e7f8fa, #f5fbe9); }
.site-body .about-cta-card .btn-general, .site-body .gallery-cta-card .premium-button { width: auto; flex: none; }
.site-body .gallery-section { padding: clamp(4.5rem, 8vw, 7rem) 0; background: #fff; }
.site-body .gallery-heading { display: flex; align-items: end; justify-content: space-between; gap: 2rem; margin-bottom: 2rem; }
.site-body .gallery-heading h2 { margin-top: .55rem; color: #173746; font-size: clamp(2rem, 4vw, 3.3rem); font-weight: 800; letter-spacing: -.045em; line-height: 1.05; }
.site-body .gallery-count { color: #078daf; font-size: .78rem; font-weight: 800; }
.site-body .gallery-filters { display: flex; flex-wrap: wrap; gap: .45rem; padding: .45rem; border: 1px solid #d7e7eb; border-radius: 14px; background: #f8fcfd; }
.site-body .gallery-filter { padding: .65rem .9rem; border-radius: 10px; color: #718992; cursor: pointer; font-size: .78rem; font-weight: 800; }
.site-body .gallery-filter:hover, .site-body .gallery-filter.general-active { background: #08a9d2; color: #fff !important; }
.site-body .gallery-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: 190px; gap: .9rem; margin-top: 1.4rem; }
.site-body .gallery-item { position: relative; overflow: hidden; min-height: 0; border-radius: 17px; background: #eaf7f9; }
.site-body .gallery-item-tall { grid-row: span 2; }
.site-body .gallery-item-wide { grid-column: span 2; }
.site-body .gallery-item img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.site-body .gallery-item:hover img { transform: scale(1.05); }
.site-body .gallery-item::after { content: ""; position: absolute; right: 0; bottom: 0; left: 0; height: 35%; background: linear-gradient(transparent, rgba(8,39,50,.6)); pointer-events: none; }
.site-body .gallery-item > span { position: absolute; z-index: 1; bottom: .8rem; left: .9rem; color: #fff; font-size: .75rem; font-weight: 800; }
.site-body .gallery-load-more { display: block; width: auto; margin: 1.6rem auto 0; }
.site-body .gallery-cta { background: #fff; }
@media (max-width: 960px) {
    .site-body .about-hero-inner, .site-body .gallery-hero-inner { grid-template-columns: 1fr; }
    .site-body .about-hero-visual, .site-body .gallery-hero-collage { max-width: 600px; width: 100%; }
    .site-body .about-intro-grid { grid-template-columns: 1fr; }
    .site-body .about-intro-image { max-width: 650px; }
    .site-body .about-principles-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .site-body .gallery-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
    .site-body .about-hero, .site-body .gallery-hero { padding: 8rem 0 4rem; }
    .site-body .about-hero h1, .site-body .gallery-hero h1 { font-size: 2.7rem; }
    .site-body .about-hero-visual, .site-body .gallery-hero-collage { min-height: 280px; }
    .site-body .about-hero-visual img, .site-body .gallery-hero-collage img { min-height: 280px; }
    .site-body .about-intro-image img { height: 340px; }
    .site-body .about-principles-grid { grid-template-columns: 1fr; }
    .site-body .about-cta-card, .site-body .gallery-cta-card { align-items: flex-start; flex-direction: column; }
    .site-body .about-cta-card .btn-general, .site-body .gallery-cta-card .premium-button { width: 100%; }
    .site-body .gallery-heading { align-items: flex-start; flex-direction: column; gap: .65rem; }
    .site-body .gallery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 150px; }
    .site-body .gallery-item-wide { grid-column: span 2; }
}

/* Auth redesign shared by login and signup. */
.auth-shell .auth-page { display: grid; grid-template-columns: minmax(320px, .86fr) minmax(0, 1.14fr); min-height: 100vh; background: #f6fbfc; }
.auth-shell .auth-side-panel { position: relative; display: flex; flex-direction: column; justify-content: space-between; min-height: 100vh; padding: clamp(2rem, 5vw, 5rem); overflow: hidden; background: linear-gradient(145deg, #e5f7f8, #f3fbe9); border-right: 1px solid #d7e7eb; }
.auth-shell .auth-side-panel::after { content: ""; position: absolute; right: -130px; bottom: -120px; width: 390px; height: 390px; border-radius: 50%; background: #d8f0d0; opacity: .65; }
.auth-shell .auth-side-brand, .auth-shell .auth-side-content { position: relative; z-index: 1; }
.auth-shell .auth-side-brand img { width: 136px; height: auto; }
.auth-shell .auth-side-content { max-width: 470px; padding-bottom: 4rem; }
.auth-shell .auth-eyebrow { color: #078daf; font-size: .72rem; font-weight: 800; letter-spacing: .17em; text-transform: uppercase; }
.auth-shell .auth-side-content h1 { margin-top: .75rem; color: #173746 !important; font-size: clamp(2.8rem, 5vw, 5rem); font-weight: 800; letter-spacing: -.06em; line-height: .98; }
.auth-shell .auth-side-content p { max-width: 410px; margin-top: 1.15rem; color: #647d87 !important; font-size: 1.02rem; line-height: 1.75; }
.auth-shell .auth-side-points { display: grid; gap: .65rem; margin-top: 2rem; }
.auth-shell .auth-side-points span { color: #47636d; font-size: .8rem; font-weight: 800; }
.auth-shell .auth-form-panel { display: flex; align-items: center; justify-content: center; padding: clamp(2rem, 5vw, 5rem); background: #f6fbfc; }
.auth-shell .auth-form-card { width: min(100%, 540px); padding: clamp(1.5rem, 4vw, 3rem) !important; border: 1px solid #d7e7eb !important; border-radius: 26px; background: #fff !important; box-shadow: 0 24px 70px rgba(23,55,70,.1); }
.auth-shell .auth-form-card-wide { width: min(100%, 700px); }
.auth-shell .auth-form-top { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.auth-shell .auth-form-step { color: #9bb1b8; font-size: .72rem; font-weight: 800; letter-spacing: .1em; }
.auth-shell .auth-form-card h2 { margin-top: .75rem; color: #173746 !important; font-size: clamp(2rem, 4vw, 3rem); font-weight: 800; letter-spacing: -.05em; line-height: 1.05; }
.auth-shell .auth-form-intro { margin-top: .55rem; color: #718992 !important; line-height: 1.6; }
.auth-shell .auth-form-fields { display: grid; gap: 1rem; margin-top: 1.8rem; }
.auth-shell .auth-form-fields > label, .auth-shell .auth-fields-two > label { display: grid; gap: .45rem; color: #47636d !important; font-size: .78rem; font-weight: 800; }
.auth-shell .auth-form-fields input { min-height: 49px; padding: .8rem .9rem; border: 1px solid #d7e7eb !important; border-radius: 12px !important; background: #f8fcfd !important; color: #173746 !important; }
.auth-shell .auth-form-fields input:focus { border-color: #08a9d2 !important; box-shadow: 0 0 0 4px rgba(8,169,210,.1) !important; }
.auth-shell .auth-fields-two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.auth-shell .auth-form-options { display: flex; align-items: center; justify-content: space-between; gap: 1rem; color: #718992; font-size: .78rem; }
.auth-shell .auth-form-options a { color: #078daf; font-weight: 800; }
.auth-shell .auth-check { display: inline-flex !important; grid-template-columns: none !important; align-items: center; gap: .5rem; color: #718992 !important; font-size: .78rem !important; font-weight: 600 !important; }
.auth-shell .auth-check input { width: 1rem; min-height: 1rem; accent-color: #08a9d2; }
.auth-shell .auth-terms { align-items: flex-start !important; margin-top: .15rem; }
.auth-shell .auth-form-fields .premium-button { width: 100%; }
.auth-shell .auth-form-footer { margin-top: 1.7rem; color: #718992; text-align: center; font-size: .82rem; }
.auth-shell .auth-form-footer a { color: #078daf; font-weight: 800; }
.auth-shell .auth-back-link { display: block; margin-top: 1.5rem; color: #9bb1b8; text-align: center; font-size: .78rem; font-weight: 700; }
.auth-shell .auth-back-link:hover { color: #078daf; }
.auth-shell .auth-error { margin-top: 1.4rem; padding: .8rem 1rem; border: 1px solid #f0c6c6; border-radius: 12px; background: #fff5f5; color: #b54d4d; font-size: .78rem; }
.auth-shell .auth-error ul { display: grid; gap: .25rem; }
@media (max-width: 900px) {
    .auth-shell .auth-page { grid-template-columns: 1fr; }
    .auth-shell .auth-side-panel { min-height: auto; padding: 2rem clamp(1.25rem, 5vw, 3rem) 2.3rem; }
    .auth-shell .auth-side-content { max-width: 680px; padding-top: 4rem; padding-bottom: 0; }
    .auth-shell .auth-side-content h1 { font-size: clamp(2.7rem, 9vw, 4rem); }
    .auth-shell .auth-side-points { display: flex; flex-wrap: wrap; gap: .8rem 1.4rem; }
    .auth-shell .auth-form-panel { padding: 2rem 1.25rem 3rem; }
}
@media (max-width: 560px) {
    .auth-shell .auth-fields-two { grid-template-columns: 1fr; }
    .auth-shell .auth-form-options { align-items: flex-start; flex-direction: column; gap: .65rem; }
    .auth-shell .auth-form-card { border-radius: 20px; }
}

/* Venue grounds and ground detail redesign. */
.site-body .vendor-grounds-page, .site-body .ground-detail-page { background: #f7fbfc; color: #173746; }
.site-body .vendor-grounds-hero, .site-body .ground-detail-hero { padding: 10rem 0 5rem; border-bottom: 1px solid #dcebed; background: linear-gradient(135deg, #eef9fa 0%, #f8fcfd 65%, #f5fbe9 100%); }
.site-body .vendor-grounds-hero-inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(230px, .36fr); align-items: end; gap: 3rem; }
.site-body .directory-breadcrumb, .site-body .ground-detail-breadcrumbs { color: #078daf; font-size: .78rem; font-weight: 800; }
.site-body .directory-breadcrumb { display: inline-flex; margin-bottom: 2rem; }
.site-body .vendor-grounds-hero h1, .site-body .ground-detail-hero h1 { max-width: 820px; margin-top: .7rem; color: #173746; font-size: clamp(2.7rem, 6vw, 5.3rem); font-weight: 800; letter-spacing: -.065em; line-height: .98; }
.site-body .vendor-grounds-hero p { max-width: 680px; margin-top: 1.15rem; color: #647d87; font-size: 1.08rem; line-height: 1.75; }
.site-body .vendor-grounds-summary { display: flex; flex-direction: column; gap: .4rem; padding: 1.5rem; border: 1px solid #d2e8eb; border-radius: 22px; background: rgba(255,255,255,.82); box-shadow: 0 18px 42px rgba(23,55,70,.07); }
.site-body .vendor-grounds-summary span, .site-body .vendor-grounds-summary small { color: #718992; font-size: .78rem; }
.site-body .vendor-grounds-summary strong { color: #078daf; font-size: 3.4rem; letter-spacing: -.07em; line-height: 1; }
.site-body .vendor-grounds-section { padding: clamp(4.5rem, 8vw, 7rem) 0; }
.site-body .vendor-grounds-heading { display: flex; align-items: end; justify-content: space-between; gap: 2rem; margin-bottom: 2rem; }
.site-body .vendor-grounds-heading h2 { margin-top: .55rem; color: #173746; font-size: clamp(2rem, 4vw, 3.2rem); font-weight: 800; letter-spacing: -.05em; line-height: 1.05; }
.site-body .vendor-grounds-heading p { margin-top: .5rem; color: #718992; }
.site-body .vendor-ground-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.2rem; }
.site-body .vendor-ground-card { overflow: hidden; border: 1px solid #d8e8eb; border-radius: 24px; background: #fff; box-shadow: 0 14px 36px rgba(23,55,70,.07); transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.site-body .vendor-ground-card:hover { transform: translateY(-6px); border-color: #88dae6; box-shadow: 0 24px 55px rgba(8,141,175,.14); }
.site-body .vendor-ground-image { position: relative; display: block; height: 230px; overflow: hidden; background: #e5f5f7; }
.site-body .vendor-ground-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .45s ease; }
.site-body .vendor-ground-card:hover .vendor-ground-image img { transform: scale(1.05); }
.site-body .vendor-ground-badge { position: absolute; top: 1rem; left: 1rem; padding: .45rem .7rem; border: 1px solid rgba(255,255,255,.75); border-radius: 999px; background: rgba(255,255,255,.9); color: #176176; font-size: .68rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.site-body .vendor-ground-content { padding: 1.3rem; }
.site-body .vendor-ground-title-row { display: flex; justify-content: space-between; gap: 1rem; }
.site-body .vendor-ground-title-row h3 { color: #173746; font-size: 1.18rem; font-weight: 800; }
.site-body .vendor-ground-title-row p { margin-top: .28rem; color: #718992; font-size: .78rem; }
.site-body .vendor-ground-arrow { color: #078daf; font-size: 1.45rem; font-weight: 800; }
.site-body .vendor-ground-prices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; margin-top: 1.3rem; padding: .85rem 0; border-top: 1px solid #e2eef0; border-bottom: 1px solid #e2eef0; }
.site-body .vendor-ground-prices span { display: grid; gap: .2rem; }
.site-body .vendor-ground-prices small { color: #9bb1b8; font-size: .68rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.site-body .vendor-ground-prices strong { color: #173746; font-size: .84rem; }
.site-body .vendor-ground-prices em { color: #718992; font-size: .68rem; font-style: normal; font-weight: 500; }
.site-body .vendor-ground-button { width: 100%; margin-top: 1.15rem; }
.site-body .vendor-grounds-cta { padding: 0 0 clamp(4.5rem, 8vw, 7rem); }
.site-body .vendor-grounds-cta-card { display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding: clamp(2rem, 5vw, 4rem); border: 1px solid #d4ebdd; border-radius: 26px; background: linear-gradient(115deg, #e7f8fa, #f5fbe9); }
.site-body .vendor-grounds-cta-card h2 { margin-top: .55rem; color: #173746; font-size: clamp(2rem, 4vw, 3.1rem); font-weight: 800; letter-spacing: -.05em; line-height: 1.05; }
.site-body .vendor-grounds-cta-card p { max-width: 560px; margin-top: .65rem; color: #647d87; }
.site-body .vendor-grounds-cta-card .btn-general { width: auto; flex: none; }

.site-body .ground-detail-hero { padding-bottom: 4rem; }
.site-body .ground-detail-breadcrumbs { display: flex; flex-wrap: wrap; align-items: center; gap: .55rem; color: #718992; }
.site-body .ground-detail-breadcrumbs a { color: #078daf; }
.site-body .ground-detail-breadcrumbs strong { color: #47636d; }
.site-body .ground-detail-hero-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(230px, .34fr); align-items: end; gap: 3rem; margin-top: 3.2rem; }
.site-body .ground-detail-hero h1 { max-width: 760px; }
.site-body .ground-detail-location { margin-top: 1rem; color: #078daf; font-size: .92rem; font-weight: 800; }
.site-body .ground-detail-lead { max-width: 650px; margin-top: .85rem; color: #647d87; font-size: 1.05rem; line-height: 1.75; }
.site-body .ground-detail-hero .premium-button { width: auto; margin-top: 1.6rem; }
.site-body .ground-detail-hero-stat { display: flex; flex-direction: column; gap: .55rem; padding: 1.6rem; border: 1px solid #d2e8eb; border-radius: 22px; background: rgba(255,255,255,.82); box-shadow: 0 18px 42px rgba(23,55,70,.07); }
.site-body .ground-detail-hero-stat span, .site-body .ground-detail-hero-stat em { color: #718992; font-size: .76rem; font-style: normal; }
.site-body .ground-detail-hero-stat strong { color: #078daf; font-size: 2.25rem; letter-spacing: -.06em; line-height: 1; }
.site-body .ground-detail-hero-stat strong small { color: #718992; font-size: .8rem; font-weight: 600; letter-spacing: 0; }
.site-body .ground-detail-main { padding: clamp(2.5rem, 5vw, 4.5rem) 0 clamp(4.5rem, 8vw, 7rem); }
.site-body .ground-detail-gallery { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(230px, .55fr); gap: 1rem; min-height: 430px; }
.site-body .ground-detail-gallery img { width: 100%; height: 100%; object-fit: cover; }
.site-body .ground-gallery-main, .site-body .ground-gallery-side > div { overflow: hidden; min-height: 200px; border-radius: 24px; background: #e5f5f7; box-shadow: 0 15px 38px rgba(23,55,70,.08); }
.site-body .ground-gallery-main img { min-height: 430px; }
.site-body .ground-gallery-side { display: grid; grid-template-rows: 1fr 1fr; gap: 1rem; }
.site-body .ground-gallery-side img { min-height: 205px; }
.site-body .ground-gallery-placeholder { display: flex; flex-direction: column; justify-content: end; gap: .45rem; padding: 1.3rem; background: linear-gradient(145deg, #dff5f7, #f5fbe9); }
.site-body .ground-gallery-placeholder span { color: #078daf; font-size: .7rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.site-body .ground-gallery-placeholder strong { color: #173746; font-size: 1.2rem; line-height: 1.1; }
.site-body .ground-detail-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, .42fr); gap: clamp(2rem, 5vw, 5rem); margin-top: clamp(3rem, 6vw, 5rem); align-items: start; }
.site-body .ground-detail-tabs { display: flex; flex-wrap: wrap; gap: .35rem; padding: .42rem; border: 1px solid #d7e7eb; border-radius: 14px; background: #fff; }
.site-body .ground-detail-tabs a { padding: .65rem .85rem; border-radius: 10px; color: #718992; font-size: .78rem; font-weight: 800; }
.site-body .ground-detail-tabs a:hover { background: #e7f8fa; color: #078daf; }
.site-body .ground-info-section { margin-top: 3.6rem; }
.site-body .ground-info-section h2 { margin-top: .55rem; color: #173746; font-size: clamp(2rem, 4vw, 3.2rem); font-weight: 800; letter-spacing: -.05em; line-height: 1.05; }
.site-body .ground-info-section > p { max-width: 720px; margin-top: 1rem; color: #647d87; line-height: 1.75; }
.site-body .ground-amenity-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .8rem; margin-top: 2rem; }
.site-body .ground-amenity-grid > div { display: grid; gap: .5rem; padding: 1rem; border: 1px solid #d8e8eb; border-radius: 16px; background: #fff; }
.site-body .ground-amenity-grid span { color: #08a9d2; font-size: .72rem; font-weight: 800; }
.site-body .ground-amenity-grid strong { color: #173746; font-size: .9rem; }
.site-body .ground-amenity-grid small { color: #718992; font-size: .76rem; line-height: 1.45; }
.site-body .section-heading-row { display: flex; align-items: end; justify-content: space-between; gap: 1rem; }
.site-body .availability-note, .site-body .review-score { color: #078daf; font-size: .76rem; font-weight: 800; }
.site-body .review-score small { color: #718992; font-weight: 600; }
.site-body .availability-table-wrap { margin-top: 1.5rem; overflow-x: auto; border: 1px solid #d8e8eb; border-radius: 18px; background: #fff; box-shadow: 0 12px 28px rgba(23,55,70,.05); }
.site-body .ground-availability-table { width: 100%; min-width: 520px; border-collapse: collapse; text-align: left; }
.site-body .ground-availability-table th { padding: 1rem; border-bottom: 1px solid #d8e8eb; background: #f2fafb; color: #47636d; font-size: .75rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.site-body .ground-availability-table td { padding: .9rem 1rem; border-bottom: 1px solid #edf3f4; color: #647d87; font-size: .82rem; font-weight: 700; }
.site-body .ground-availability-table tr:last-child td { border-bottom: 0; }
.site-body .ground-availability-table td:first-child { color: #173746; }
.site-body .ground-availability-table td.is-available { color: #078e70; }
.site-body .ground-availability-table td.is-booked { color: #b56a6a; }
.site-body .review-list { display: grid; gap: 1rem; margin-top: 1.5rem; }
.site-body .review-list article { display: flex; gap: .9rem; padding: 1.1rem; border: 1px solid #d8e8eb; border-radius: 17px; background: #fff; }
.site-body .review-avatar { display: inline-flex; align-items: center; justify-content: center; width: 2.5rem; height: 2.5rem; flex: none; border-radius: 50%; background: #e3f6f7; color: #078daf; font-size: .72rem; font-weight: 800; }
.site-body .review-list article strong { display: block; color: #173746; font-size: .88rem; }
.site-body .review-list article span { display: block; margin-top: .25rem; color: #f2ad4d; font-size: .78rem; letter-spacing: .1em; }
.site-body .review-list article p { margin-top: .55rem; color: #718992; font-size: .83rem; line-height: 1.55; }
.site-body .ground-detail-sidebar { position: sticky; top: 6.8rem; }
.site-body .ground-booking-card { padding: 1.4rem !important; border: 1px solid #d7e7eb !important; border-radius: 22px !important; background: #fff !important; box-shadow: 0 18px 45px rgba(23,55,70,.1) !important; }
.site-body .booking-card-heading { display: flex; align-items: start; justify-content: space-between; gap: 1rem; }
.site-body .booking-card-heading h2 { margin-top: .45rem; color: #173746 !important; font-size: 1.55rem; font-weight: 800; letter-spacing: -.04em; }
.site-body .booking-eyebrow { color: #078daf; font-size: .68rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.site-body .booking-step { color: #9bb1b8; font-size: .7rem; font-weight: 800; }
.site-body .booking-card-intro { margin-top: .7rem; color: #718992; font-size: .82rem; line-height: 1.55; }
.site-body .ground-booking-form { display: grid; gap: 1.1rem; margin-top: 1.3rem; }
.site-body .booking-field { display: grid; gap: .55rem; }
.site-body .booking-field > label { color: #47636d; font-size: .74rem; font-weight: 800; letter-spacing: .03em; }
.site-body .booking-date-input, .site-body .booking-time-row select { width: 100%; min-height: 47px; padding: .75rem .85rem; border: 1px solid #d7e7eb !important; border-radius: 12px !important; background: #f8fcfd !important; color: #173746 !important; }
.site-body .booking-date-input:focus, .site-body .booking-time-row select:focus { border-color: #08a9d2 !important; box-shadow: 0 0 0 4px rgba(8,169,210,.1) !important; outline: 0; }
.site-body .court-picker-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; }
.site-body .court-picker-option { display: grid; gap: .22rem; padding: .75rem; border: 1px solid #d7e7eb; border-radius: 13px; background: #f8fcfd; color: #173746; text-align: left; transition: .2s ease; }
.site-body .court-picker-option:hover, .site-body .court-picker-option.is-selected { border-color: #08a9d2; background: #e7f8fa; box-shadow: 0 0 0 3px rgba(8,169,210,.08); }
.site-body .court-picker-option span, .site-body .court-picker-option em { color: #718992; font-size: .65rem; font-style: normal; }
.site-body .court-picker-option strong { color: #173746; font-size: .88rem; }
.site-body .booking-time-row { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto; align-items: center; gap: .45rem; }
.site-body .booking-time-row > span { color: #9bb1b8; font-size: .75rem; font-weight: 800; }
.site-body .booking-time-actions { display: flex; gap: .35rem; }
.site-body .booking-time-actions button { display: inline-flex; align-items: center; justify-content: center; width: 1.9rem; height: 1.9rem; border: 1px solid #bfe0df; border-radius: 50%; background: #fff; color: #078daf; font-size: 1.1rem; line-height: 1; }
.site-body .booking-time-actions .deleteTiming { color: #b56a6a; border-color: #eacaca; }
.site-body #timingContainer { display: grid; gap: .5rem; }
.site-body .booking-submit { width: 100%; margin-top: .25rem; }
.site-body .booking-summary-card { margin-top: 1rem; }
.site-body .summary-line, .site-body .summary-total { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.site-body .summary-line span, .site-body .summary-total span { color: #718992; font-size: .78rem; font-weight: 700; }
.site-body .summary-line strong { color: #173746; font-size: .82rem; }
.site-body .summary-total { margin-top: .9rem; padding-top: .9rem; border-top: 1px solid #dcebed; }
.site-body .summary-total span { color: #173746; font-size: .95rem; font-weight: 800; }
.site-body .summary-total strong { color: #078daf; font-size: 1.05rem; }
@media (max-width: 960px) {
    .site-body .vendor-grounds-hero-inner, .site-body .ground-detail-hero-grid { grid-template-columns: 1fr; align-items: start; }
    .site-body .vendor-grounds-summary, .site-body .ground-detail-hero-stat { max-width: 360px; }
    .site-body .vendor-ground-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .site-body .ground-detail-layout { grid-template-columns: 1fr; }
    .site-body .ground-detail-sidebar { position: static; max-width: 620px; }
}
@media (max-width: 640px) {
    .site-body .vendor-grounds-hero, .site-body .ground-detail-hero { padding: 8rem 0 4rem; }
    .site-body .vendor-grounds-hero h1, .site-body .ground-detail-hero h1 { font-size: 2.7rem; }
    .site-body .vendor-grounds-heading { align-items: flex-start; flex-direction: column; gap: .8rem; }
    .site-body .vendor-ground-grid { grid-template-columns: 1fr; }
    .site-body .vendor-grounds-cta-card { align-items: flex-start; flex-direction: column; }
    .site-body .vendor-grounds-cta-card .btn-general { width: 100%; }
    .site-body .ground-detail-gallery { grid-template-columns: 1fr; min-height: 0; }
    .site-body .ground-gallery-main img { min-height: 280px; height: 280px; }
    .site-body .ground-gallery-side { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: 150px; }
    .site-body .ground-gallery-side > div { min-height: 150px; }
    .site-body .ground-gallery-side img { min-height: 150px; }
    .site-body .ground-amenity-grid { grid-template-columns: 1fr; }
    .site-body .section-heading-row { align-items: flex-start; flex-direction: column; }
    .site-body .booking-time-row { grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); }
    .site-body .booking-time-actions { grid-column: 1 / -1; justify-content: flex-end; }
}

/* Ground detail polish pass: clearer hierarchy, unique hero copy and compact venue facts. */
.site-body .ground-detail-hero-copy { max-width: 760px; }
.site-body .ground-detail-hero-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 1rem; margin-top: 1.6rem; }
.site-body .ground-detail-hero-actions .premium-button { margin-top: 0; }
.site-body .ground-detail-trust { color: #078daf; font-size: .78rem; font-weight: 800; }
.site-body .ground-detail-hero-panel { display: grid; gap: .8rem; padding: 1.5rem; border: 1px solid #cfe3e8; border-radius: 24px; background: rgba(255,255,255,.92); box-shadow: 0 22px 48px rgba(23,55,70,.1); }
.site-body .ground-hero-panel-top { display: flex; align-items: center; justify-content: space-between; gap: .8rem; }
.site-body .ground-hero-panel-top span { color: #718992; font-size: .75rem; }
.site-body .ground-hero-panel-top b { padding: .35rem .55rem; border-radius: 999px; background: #e7f8ee; color: #078e70; font-size: .62rem; letter-spacing: .05em; text-transform: uppercase; }
.site-body .ground-detail-hero-panel > strong { color: #078daf; font-size: 2.6rem; letter-spacing: -.07em; line-height: 1; }
.site-body .ground-detail-hero-panel > strong small { color: #718992; font-size: .8rem; font-weight: 600; letter-spacing: 0; }
.site-body .ground-hero-panel-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; padding-top: .85rem; border-top: 1px solid #e2eef0; }
.site-body .ground-hero-panel-stats span { display: grid; gap: .25rem; }
.site-body .ground-hero-panel-stats b { color: #173746; font-size: .88rem; }
.site-body .ground-hero-panel-stats small, .site-body .ground-detail-hero-panel > em { color: #718992; font-size: .72rem; font-style: normal; }
.site-body .ground-gallery-meta { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; margin-top: 1rem; border: 1px solid #d8e8eb; border-radius: 18px; background: #fff; box-shadow: 0 12px 28px rgba(23,55,70,.05); }
.site-body .ground-gallery-meta > div { display: grid; gap: .3rem; padding: 1rem 1.1rem; border-right: 1px solid #e2eef0; }
.site-body .ground-gallery-meta > div:last-child { border-right: 0; }
.site-body .ground-gallery-meta span { color: #9bb1b8; font-size: .65rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.site-body .ground-gallery-meta strong { overflow: hidden; color: #173746; font-size: .8rem; text-overflow: ellipsis; white-space: nowrap; }
.site-body .ground-info-section#description h2 { max-width: 620px; }
@media (max-width: 640px) {
    .site-body .ground-detail-hero-actions { align-items: flex-start; flex-direction: column; }
    .site-body .ground-detail-hero-actions .premium-button { width: 100%; }
    .site-body .ground-gallery-meta { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .site-body .ground-gallery-meta > div:nth-child(2) { border-right: 0; }
    .site-body .ground-gallery-meta > div:nth-child(-n+2) { border-bottom: 1px solid #e2eef0; }
}
/* Booking interaction polish. */
.site-body .booking-date-control { position: relative; }
.site-body .booking-date-control .booking-date-input { padding-right: 2.8rem; cursor: pointer; }
.site-body .booking-date-control > span { position: absolute; top: 50%; right: .9rem; transform: translateY(-50%); color: #078daf; font-size: 1rem; pointer-events: none; }
.site-body .flatpickr-calendar { border: 1px solid #d7e7eb; border-radius: 16px; box-shadow: 0 20px 50px rgba(23,55,70,.16); overflow: hidden; }
.site-body .flatpickr-months { padding: .4rem .35rem; background: #e7f8fa; }
.site-body .flatpickr-months .flatpickr-month, .site-body .flatpickr-current-month { color: #173746; }
.site-body .flatpickr-weekdays { background: #f8fcfd; }
.site-body span.flatpickr-weekday { color: #718992; font-size: .72rem; font-weight: 800; }
.site-body .flatpickr-day { color: #47636d; border-radius: 9px; }
.site-body .flatpickr-day:hover { background: #e7f8fa; border-color: #e7f8fa; }
.site-body .flatpickr-day.selected, .site-body .flatpickr-day.selected:hover { background: #08a9d2; border-color: #08a9d2; color: #fff; }
.site-body .flatpickr-day.today { border-color: #08a9d2; }
.site-body .flatpickr-day.disabled { color: #c2d0d4; }
.site-body .flatpickr-prev-month:hover svg, .site-body .flatpickr-next-month:hover svg { fill: #078daf; }
/* Flatpickr premium calendar reset: remove global form styles from its month controls. */
.site-body .booking-date-control > span { display: inline-flex; align-items: center; justify-content: center; width: 1.1rem; height: 1.1rem; }
.site-body .booking-date-control > span svg { width: 1rem; height: 1rem; stroke: #078daf; }
.site-body .flatpickr-calendar { width: 308px !important; max-width: calc(100vw - 2rem); padding: 0 !important; border: 1px solid #cfe3e8 !important; border-radius: 18px !important; background: #fff !important; box-shadow: 0 22px 55px rgba(23,55,70,.16) !important; }
.site-body .flatpickr-calendar.open { z-index: 100000 !important; }
.site-body .flatpickr-months { position: relative; display: flex; align-items: center; min-height: 54px; padding: .45rem 2.2rem !important; background: #e7f8fa !important; }
.site-body .flatpickr-months .flatpickr-month { display: flex; align-items: center; justify-content: center; width: 100%; height: 42px; overflow: visible; background: transparent !important; color: #173746 !important; }
.site-body .flatpickr-current-month { position: static !important; display: inline-flex !important; align-items: center; justify-content: center; gap: .25rem; width: auto !important; height: 34px !important; padding: 0 !important; color: #173746 !important; font-size: .95rem !important; font-weight: 800 !important; line-height: 1 !important; transform: none !important; }
.site-body .flatpickr-current-month .flatpickr-monthDropdown-months,
.site-body .flatpickr-current-month .flatpickr-monthDropdown-months:hover { width: auto !important; min-width: 0 !important; height: 30px !important; margin: 0 !important; padding: 0 .1rem !important; border: 0 !important; outline: 0 !important; box-shadow: none !important; background: transparent !important; color: #173746 !important; font-size: .95rem !important; font-weight: 800 !important; appearance: none !important; -webkit-appearance: none !important; }
.site-body .flatpickr-current-month input.cur-year,
.site-body .flatpickr-current-month input.cur-year:hover,
.site-body .flatpickr-current-month input.cur-year:focus { width: 4.2rem !important; height: 30px !important; margin: 0 !important; padding: 0 !important; border: 0 !important; outline: 0 !important; box-shadow: none !important; background: transparent !important; color: #173746 !important; font-size: .95rem !important; font-weight: 800 !important; line-height: 30px !important; }
.site-body .flatpickr-prev-month, .site-body .flatpickr-next-month { top: 50% !important; display: inline-flex !important; align-items: center; justify-content: center; width: 2rem; height: 2rem; padding: 0 !important; border-radius: 9px; transform: translateY(-50%); color: #078daf !important; fill: #078daf !important; }
.site-body .flatpickr-prev-month { left: .45rem !important; }
.site-body .flatpickr-next-month { right: .45rem !important; }
.site-body .flatpickr-prev-month:hover, .site-body .flatpickr-next-month:hover { background: rgba(8,169,210,.12); color: #078daf !important; }
.site-body .flatpickr-prev-month svg, .site-body .flatpickr-next-month svg { width: 14px !important; height: 14px !important; fill: currentColor !important; }
.site-body .flatpickr-weekdays { height: 34px !important; padding: 0 .35rem; background: #f8fcfd !important; }
.site-body .flatpickr-weekdaycontainer { width: 100%; }
.site-body span.flatpickr-weekday { color: #718992 !important; font-size: .68rem !important; font-weight: 800 !important; line-height: 34px !important; }
.site-body .flatpickr-days { width: 100% !important; }
.site-body .flatpickr-day { max-width: 36px !important; height: 36px !important; margin: 1px !important; color: #47636d !important; font-size: .78rem !important; line-height: 36px !important; }
.site-body .flatpickr-day.selected, .site-body .flatpickr-day.selected:hover { background: #08a9d2 !important; border-color: #08a9d2 !important; color: #fff !important; box-shadow: 0 5px 12px rgba(8,169,210,.22); }
.site-body .flatpickr-day.today:not(.selected) { border-color: #08a9d2 !important; color: #078daf !important; font-weight: 800; }
/* Availability table redesign: visible time rail and clear status chips. */
.site-body .availability-tools { display: flex; align-items: flex-end; flex-direction: column; gap: .65rem; }
.site-body .availability-legend { display: flex; flex-wrap: wrap; gap: .8rem; color: #718992; font-size: .7rem; font-weight: 700; }
.site-body .availability-legend > span { display: inline-flex; align-items: center; gap: .35rem; }
.site-body .availability-dot { display: inline-block; width: .45rem; height: .45rem; border-radius: 50%; }
.site-body .availability-dot.available { background: #16a276; }
.site-body .availability-dot.booked { background: #cc7777; }
.site-body .availability-table-wrap { overflow: auto; border: 1px solid #cfe3e8; border-radius: 20px; background: #fff; box-shadow: 0 16px 36px rgba(23,55,70,.07); }
.site-body .ground-availability-table { min-width: 560px; border-collapse: separate; border-spacing: 0; }
.site-body .ground-availability-table th { position: sticky; top: 0; z-index: 2; padding: .9rem 1rem; border-bottom: 1px solid #cfe3e8; background: #eaf9fb; color: #176176; font-size: .68rem; letter-spacing: .1em; }
.site-body .ground-availability-table th:first-child { left: 0; z-index: 3; min-width: 118px; }
.site-body .ground-availability-table td { height: 62px; padding: .65rem .85rem; border-right: 1px solid #e2eef0; border-bottom: 1px solid #e2eef0; background: #fff; text-align: center; vertical-align: middle; }
.site-body .ground-availability-table td:last-child, .site-body .ground-availability-table th:last-child { border-right: 0; }
.site-body .ground-availability-table tr:last-child td { border-bottom: 0; }
.site-body .ground-availability-table td.availability-time { position: sticky; left: 0; z-index: 1; min-width: 118px; background: #fbfeff; color: #173746 !important; font-size: .78rem; font-weight: 800; text-align: left; white-space: nowrap; }
.site-body .ground-availability-table td.availability-cell { background: #fff; }
.site-body .ground-availability-table td.availability-cell.is-available { background: #fbfffd; }
.site-body .ground-availability-table td.availability-cell.is-booked { background: #fffafa; }
.site-body .availability-status { display: inline-flex; align-items: center; justify-content: center; min-width: 78px; padding: .38rem .55rem; border-radius: 999px; font-size: .67rem; font-weight: 800; letter-spacing: .02em; }
.site-body .availability-cell.is-available .availability-status { background: #e4f7ef; color: #078e70; }
.site-body .availability-cell.is-booked .availability-status { background: #fdeaea; color: #b56a6a; }
.site-body .ground-availability-table tbody tr:hover td { background: #f5fbfc; }
.site-body .ground-availability-table tbody tr:hover td.availability-cell.is-available { background: #effbf5; }
.site-body .ground-availability-table tbody tr:hover td.availability-cell.is-booked { background: #fff4f4; }
@media (max-width: 640px) {
    .site-body .availability-tools { align-items: flex-start; }
    .site-body .availability-note { font-size: .72rem; }
    .site-body .availability-table-wrap { border-radius: 16px; }
    .site-body .ground-availability-table th:first-child, .site-body .ground-availability-table td.availability-time { min-width: 104px; }
    .site-body .availability-status { min-width: 70px; padding: .35rem .45rem; font-size: .62rem; }
}

/* Dashboard portal refresh */
.dashboard-page { background: #f4f8f8; color: #173746; }
.dashboard-hero { position: relative; overflow: hidden; padding: 10.5rem 0 6.5rem; background: linear-gradient(126deg, #0d3140 0%, #16576a 57%, #0d394a 100%); }
.dashboard-hero::before { content: ""; position: absolute; width: 42rem; height: 42rem; right: -13rem; top: -24rem; border-radius: 50%; background: rgba(53, 212, 239, .18); filter: blur(1px); }
.dashboard-hero::after { content: ""; position: absolute; inset: auto 0 0; height: 7rem; background: linear-gradient(180deg, transparent, rgba(13, 49, 64, .26)); pointer-events: none; }
.dashboard-hero-grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1fr) 24rem; gap: 4rem; align-items: end; }
.dashboard-breadcrumb { display: flex; align-items: center; gap: .55rem; color: #9ed8e0; font-size: .72rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.dashboard-breadcrumb > span:not(.dashboard-breadcrumb-dot) { opacity: .45; }
.dashboard-breadcrumb-dot { width: .4rem; height: .4rem; border-radius: 999px; background: #c9ef72; }
.dashboard-hero-copy h1 { max-width: 730px; margin: 1.35rem 0 1.2rem; color: #fff; font-size: clamp(2.65rem, 5vw, 5.25rem); font-weight: 800; line-height: .98; letter-spacing: -.065em; }
.dashboard-hero-copy p { max-width: 610px; color: #b8d5dc; font-size: 1.05rem; line-height: 1.75; }
.dashboard-hero-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 2rem; }
.dashboard-button { display: inline-flex; align-items: center; justify-content: center; gap: .65rem; min-height: 46px; padding: .72rem 1.15rem; border: 1px solid transparent; border-radius: 999px; font-size: .82rem; font-weight: 800; letter-spacing: .01em; transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease, background .2s ease; }
.dashboard-button:hover { transform: translateY(-2px); }
.dashboard-button-primary { color: #173746 !important; background: #c9ef72; box-shadow: 0 12px 24px rgba(15, 37, 49, .18); }
.dashboard-button-primary:hover { background: #ddff92; box-shadow: 0 16px 30px rgba(15, 37, 49, .25); }
.dashboard-button-quiet { border-color: rgba(211, 241, 244, .3); color: #e9fbff !important; background: rgba(255,255,255,.05); }
.dashboard-button-quiet:hover { border-color: #86e5ed; background: rgba(255,255,255,.1); }
.dashboard-hero-card { padding: 1.2rem 1.25rem 1.1rem; border: 1px solid rgba(200, 238, 242, .22); border-radius: 22px; color: #fff; background: rgba(7, 30, 42, .36); box-shadow: 0 22px 45px rgba(3, 19, 27, .18); backdrop-filter: blur(14px); }
.dashboard-hero-card-top, .dashboard-hero-card-foot { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.dashboard-hero-card-top { color: #92cbd3; font-size: .66rem; font-weight: 800; letter-spacing: .15em; }
.dashboard-status-dot { display: inline-flex; align-items: center; gap: .35rem; color: #cdf68c; letter-spacing: .03em; text-transform: none; }
.dashboard-status-dot::before { content: ""; width: .4rem; height: .4rem; border-radius: 999px; background: #c9ef72; box-shadow: 0 0 0 4px rgba(201, 239, 114, .13); }
.dashboard-avatar, .dashboard-profile-avatar { display: grid; place-items: center; width: 3.3rem; height: 3.3rem; margin: 2.2rem 0 .8rem; border-radius: 1.1rem; color: #173746; background: #c9ef72; font-size: 1.3rem; font-weight: 900; }
.dashboard-hero-card strong { display: block; font-size: 1.12rem; }
.dashboard-hero-card > span { display: block; margin-top: .25rem; color: #9fc4cc; font-size: .8rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dashboard-hero-card-foot { margin-top: 2.4rem; padding-top: .85rem; border-top: 1px solid rgba(200, 238, 242, .14); color: #8fb8c0; font-size: .72rem; }
.dashboard-hero-card-foot b { color: #fff; font-size: .76rem; }
.dashboard-content { padding: 2.1rem 0 7rem; }
.dashboard-stat-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin-top: -4.35rem; position: relative; z-index: 2; }
.dashboard-stat-card { position: relative; display: flex; align-items: flex-start; gap: .9rem; min-height: 138px; padding: 1.35rem 1.25rem; border: 1px solid #dbeaec; border-radius: 20px; background: #fff; box-shadow: 0 18px 45px rgba(16, 66, 81, .09); }
.dashboard-stat-card-accent { color: #fff; background: #127890; border-color: #127890; box-shadow: 0 18px 45px rgba(8, 90, 111, .2); }
.dashboard-stat-icon { display: grid; place-items: center; flex: 0 0 auto; width: 2.55rem; height: 2.55rem; border-radius: .9rem; color: #087c98; background: #e7f7f8; font-size: 1.05rem; font-weight: 900; }
.dashboard-stat-card-accent .dashboard-stat-icon { color: #117087; background: #c9ef72; }
.dashboard-stat-icon-lime { color: #7a881c; background: #edf7c8; }
.dashboard-stat-icon-soft { color: #087c98; background: #edf8fa; }
.dashboard-stat-card > div:nth-child(2) { min-width: 0; }
.dashboard-stat-card span { display: block; color: #8099a0; font-size: .65rem; font-weight: 900; letter-spacing: .14em; }
.dashboard-stat-card-accent span, .dashboard-stat-card-accent small { color: #b5e0e6; }
.dashboard-stat-card strong { display: block; margin-top: .4rem; color: #173746; font-size: 1.55rem; line-height: 1.08; letter-spacing: -.03em; }
.dashboard-stat-card-accent strong { color: #fff; }
.dashboard-stat-card small { display: block; margin-top: .45rem; color: #6f8790; font-size: .76rem; line-height: 1.35; }
.dashboard-stat-arrow, .dashboard-stat-link { margin-left: auto; color: #1596ad; font-size: 1rem; font-weight: 900; text-decoration: none; }
.dashboard-stat-card-accent .dashboard-stat-arrow { color: #c9ef72; }
.dashboard-workspace { display: grid; grid-template-columns: 14.75rem minmax(0, 1fr); gap: 1.25rem; margin-top: 1.4rem; }
.dashboard-sidebar { align-self: start; position: sticky; top: 6rem; padding: .95rem; border: 1px solid #dbeaec; border-radius: 20px; background: #fff; box-shadow: 0 14px 34px rgba(17, 64, 79, .06); }
.dashboard-sidebar-label { padding: .35rem .6rem .7rem; color: #89a1a7; font-size: .62rem; font-weight: 900; letter-spacing: .16em; }
.dashboard-tabs { display: grid; gap: .28rem; }
.dashboard-tab { position: relative; display: grid; grid-template-columns: 1.35rem minmax(0,1fr) auto; align-items: center; gap: .55rem; width: 100%; padding: .78rem .65rem; border: 0; border-radius: 12px; color: #668089; background: transparent; text-align: left; font-size: .79rem; font-weight: 800; cursor: pointer; transition: color .2s ease, background .2s ease, transform .2s ease; }
.dashboard-tab:hover { color: #117e97; background: #eef9fa; transform: translateX(2px); }
.dashboard-tab.general-active { color: #08788e !important; background: #e6f7f8; }
.dashboard-tab.general-active::before { content: ""; position: absolute; left: -.95rem; width: 3px; height: 1.55rem; border-radius: 0 5px 5px 0; background: #11a9bd; }
.dashboard-tab-icon { display: grid; place-items: center; color: currentColor; font-size: .95rem; }
.dashboard-tab-count { color: #89a0a6; font-size: .68rem; font-weight: 800; }
.dashboard-sidebar-tip { margin-top: 1.2rem; padding: 1rem .7rem .55rem; border-top: 1px solid #e8f0f1; }
.dashboard-sidebar-tip > span { color: #173746; font-size: .76rem; font-weight: 900; }
.dashboard-sidebar-tip p { margin: .35rem 0 .7rem; color: #80959b; font-size: .68rem; line-height: 1.45; }
.dashboard-sidebar-tip a { color: #087f97; font-size: .68rem; font-weight: 900; text-decoration: none; }
.dashboard-sidebar-tip a span { margin-left: .35rem; }
.dashboard-panel-area { min-width: 0; }
.dashboard-panel { padding: 1.55rem; border: 1px solid #dbeaec; border-radius: 20px; background: #fff; box-shadow: 0 14px 34px rgba(17, 64, 79, .06); }
.dashboard-panel-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: 1.35rem; }
.dashboard-panel-kicker { display: block; color: #0aa0b5; font-size: .64rem; font-weight: 900; letter-spacing: .16em; text-transform: uppercase; }
.dashboard-panel-heading h2 { margin: .32rem 0 .3rem; color: #173746 !important; font-size: clamp(1.7rem, 3vw, 2.45rem); font-weight: 900; line-height: 1; letter-spacing: -.045em; }
.dashboard-panel-heading p { margin: 0; color: #748b92; font-size: .8rem; line-height: 1.5; }
.dashboard-inline-link { display: inline-flex; align-items: center; gap: .45rem; color: #087f97; font-size: .75rem; font-weight: 900; text-decoration: none; white-space: nowrap; }
.dashboard-heading-note { color: #8aa0a6; font-size: .72rem; font-weight: 800; }
.dashboard-toolbar { display: grid; grid-template-columns: minmax(10rem, .75fr) minmax(12rem, 1fr) minmax(14rem, 1.3fr); gap: .65rem; margin-bottom: 1.05rem; padding: .8rem; border: 1px solid #e2edef; border-radius: 15px; background: #f8fbfb; }
.dashboard-toolbar-single { grid-template-columns: minmax(14rem, 1fr); justify-content: end; }
.dashboard-field { display: grid; gap: .38rem; min-width: 0; }
.dashboard-field > span { color: #7e969c; font-size: .62rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.dashboard-field input, .dashboard-field select { width: 100%; min-height: 44px; padding: .65rem .78rem; border: 1px solid #d7e7ea !important; border-radius: 10px !important; color: #173746 !important; background: #fff !important; font-size: .77rem; outline: none; }
.dashboard-field input::placeholder { color: #9fb1b5 !important; }
.dashboard-field input:focus, .dashboard-field select:focus { border-color: #12a7bb !important; box-shadow: 0 0 0 4px rgba(18, 167, 187, .1) !important; }
.dashboard-field-search { max-width: 18rem; margin-left: auto; }
.dashboard-table-wrap { overflow-x: auto; border: 1px solid #dcebed; border-radius: 15px; }
.dashboard-table { width: 100%; min-width: 640px; border: 0 !important; border-radius: 0 !important; border-collapse: collapse !important; background: #fff !important; }
.dashboard-table th { padding: .8rem .9rem; border-bottom: 1px solid #e2edef !important; color: #82999f !important; background: #f8fbfb !important; font-size: .61rem; font-weight: 900; letter-spacing: .11em; text-align: left; text-transform: uppercase; white-space: nowrap; }
.dashboard-table td { padding: .88rem .9rem; border-bottom: 1px solid #edf3f3 !important; color: #627b83 !important; background: #fff !important; font-size: .75rem; vertical-align: middle; white-space: nowrap; }
.dashboard-table tbody tr:last-child td { border-bottom: 0 !important; }
.dashboard-table tbody tr:hover td { background: #f8fcfc !important; }
.dashboard-table-primary { display: block; color: #173746; font-size: .79rem; }
.dashboard-table td small { display: block; margin-top: .22rem; color: #9aadb1; font-size: .66rem; }
.dashboard-slot-cell { display: grid; gap: .18rem; min-width: 9.5rem; }
.dashboard-slot-cell strong { color: #173746; font-size: .72rem; font-weight: 800; }
.dashboard-slot-cell small { margin-top: 0 !important; color: #087f97 !important; font-size: .68rem !important; font-weight: 800; letter-spacing: .01em; }
.dashboard-slot-cell > span { color: #9aadb1; font-size: .68rem; }
.dashboard-table-action { width: 4.5rem; text-align: center !important; }
.dashboard-icon-button { display: inline-grid; place-items: center; width: 2rem; height: 2rem; border: 1px solid #d8e9eb; border-radius: 9px; color: #0b899f; background: #f4fbfb; cursor: pointer; transition: all .2s ease; }
.dashboard-icon-button:hover { color: #173746; border-color: #9ad9df; background: #e9f9fa; transform: translateY(-1px); }
.dashboard-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 4.4rem; padding: .33rem .6rem; border-radius: 999px; font-size: .64rem; font-weight: 900; }
.dashboard-badge.is-success { color: #0c856a; background: #e4f7ef; }
.dashboard-badge.is-warning { color: #98721b; background: #fff4d6; }
.dashboard-badge.is-danger { color: #b55458; background: #fdeaea; }
.dashboard-badge.is-neutral { color: #5d7680; background: #edf3f4; }
.dashboard-empty-row td { padding: 0 !important; }
.dashboard-empty-state { display: grid; place-items: center; min-height: 280px; padding: 2rem; text-align: center; white-space: normal; }
.dashboard-empty-state-compact { min-height: 210px; }
.dashboard-empty-icon { display: grid; place-items: center; width: 3.25rem; height: 3.25rem; margin-bottom: .75rem; border-radius: 1.1rem; color: #0d8ca2; background: #e8f8f9; font-size: 1.3rem; font-weight: 900; }
.dashboard-empty-state strong { color: #173746; font-size: 1rem; }
.dashboard-empty-state p { max-width: 340px; margin: .4rem 0 1rem; color: #879ba0; font-size: .75rem; line-height: 1.55; }
.dashboard-table-empty { padding: 2rem; color: #91a4a8; text-align: center; white-space: normal; }
.dashboard-wallet-grid { display: grid; grid-template-columns: minmax(0, 1.5fr) repeat(2, minmax(0, .75fr)); gap: .8rem; margin-bottom: 2rem; }
.dashboard-wallet-card { min-height: 185px; padding: 1.25rem; border-radius: 18px; color: #fff; background: linear-gradient(135deg, #0e637b, #0a3f53); box-shadow: 0 16px 30px rgba(13, 84, 104, .17); }
.dashboard-wallet-top, .dashboard-wallet-bottom { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.dashboard-wallet-top { color: #9fd5dc; font-size: .62rem; font-weight: 900; letter-spacing: .14em; }
.dashboard-wallet-mark { display: grid; place-items: center; width: 2rem; height: 2rem; border-radius: .65rem; color: #173746; background: #c9ef72; font-size: 1rem; font-weight: 900; }
.dashboard-wallet-card > strong { display: block; margin: 1.2rem 0 .45rem; font-size: 2rem; letter-spacing: -.04em; }
.dashboard-wallet-card p { margin: 0; color: #b6dbe1; font-size: .73rem; }
.dashboard-wallet-bottom { margin-top: 1.65rem; padding-top: .75rem; border-top: 1px solid rgba(194, 235, 241, .18); color: #91c0c8; font-size: .68rem; }
.dashboard-wallet-bottom b { color: #fff; }
.dashboard-wallet-mini { display: flex; align-items: center; gap: .65rem; padding: 1rem; border: 1px solid #dcebed; border-radius: 16px; background: #f8fbfb; }
.dashboard-wallet-mini > div { min-width: 0; }
.dashboard-wallet-mini > div > span { display: block; color: #8aa0a6; font-size: .64rem; font-weight: 800; }
.dashboard-wallet-mini strong { display: block; margin-top: .35rem; color: #173746; font-size: 1.08rem; }
.dashboard-wallet-mini-icon { display: grid; place-items: center; flex: 0 0 auto; width: 2.35rem; height: 2.35rem; border-radius: .8rem; font-weight: 900; }
.dashboard-wallet-mini-icon.is-credit { color: #0c856a; background: #e4f7ef; }
.dashboard-wallet-mini-icon.is-debit { color: #b55458; background: #fdeaea; }
.dashboard-subheading { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin-bottom: .8rem; }
.dashboard-subheading h3 { margin: .28rem 0 0; color: #173746; font-size: 1.15rem; font-weight: 900; letter-spacing: -.02em; }
.dashboard-profile-layout { display: grid; grid-template-columns: 13rem minmax(0, 1fr); gap: 1rem; }
.dashboard-profile-card { display: flex; flex-direction: column; align-items: center; padding: 1.25rem; border: 1px solid #dcebed; border-radius: 17px; background: #f8fbfb; text-align: center; }
.dashboard-profile-card .dashboard-profile-avatar { margin: .2rem 0 .75rem; }
.dashboard-profile-card strong { color: #173746; font-size: .95rem; }
.dashboard-profile-card > span { max-width: 100%; margin-top: .25rem; overflow: hidden; color: #80969c; font-size: .68rem; text-overflow: ellipsis; white-space: nowrap; }
.dashboard-profile-line { width: 100%; height: 1px; margin: 1.3rem 0 .8rem; background: #deeaec; }
.dashboard-profile-card small { color: #8da2a7; font-size: .63rem; }
.dashboard-profile-card b { margin-top: .3rem; color: #0b876e; font-size: .7rem; }
.dashboard-form { padding: 1.2rem; border: 1px solid #dcebed; border-radius: 17px; }
.dashboard-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.dashboard-form-footer { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 1.2rem; padding-top: 1rem; border-top: 1px solid #e6eff0; }
.dashboard-form-footer p { max-width: 330px; margin: 0; color: #8a9da2; font-size: .68rem; line-height: 1.45; }
.dashboard-invoice-card { margin-top: 1rem; padding: 1.25rem; border: 1px solid #dcebed; border-radius: 17px; background: #f8fbfb; }
.dashboard-invoice-top { display: flex; justify-content: space-between; gap: 1rem; }
.dashboard-invoice-top h3 { margin: .35rem 0 0; color: #173746; font-size: 1.1rem; }
.dashboard-invoice-meta { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 1rem; margin: 1.25rem 0; }
.dashboard-invoice-meta > div { display: grid; gap: .25rem; }
.dashboard-invoice-meta span { color: #8da2a7; font-size: .62rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.dashboard-invoice-meta strong { color: #173746; font-size: .8rem; }
.dashboard-invoice-meta small { color: #80969c; font-size: .67rem; }
.dashboard-modal { background: rgba(9, 32, 43, .55); backdrop-filter: blur(6px); }
.dashboard-modal-card { position: relative; width: min(100%, 29rem); padding: 1.5rem; border: 1px solid #d9eaec; border-radius: 20px; background: #fff; box-shadow: 0 26px 70px rgba(12, 50, 65, .2); }
.dashboard-modal-card h3 { margin: .4rem 0 .35rem; color: #173746; font-size: 1.75rem; font-weight: 900; }
.dashboard-modal-card p { margin: 0 0 1.25rem; color: #7c9298; font-size: .78rem; line-height: 1.55; }
.dashboard-modal-card .dashboard-button { margin-top: 1.1rem; }
.dashboard-modal-close { position: absolute; top: .8rem; right: .9rem; width: 2rem; height: 2rem; border: 0; color: #759097; background: transparent; font-size: 1.6rem; cursor: pointer; }

@media (max-width: 900px) {
    .dashboard-hero-grid { grid-template-columns: minmax(0, 1fr) 20rem; gap: 2rem; }
    .dashboard-workspace { grid-template-columns: 1fr; }
    .dashboard-sidebar { position: static; display: flex; align-items: center; gap: 1rem; padding: .75rem; }
    .dashboard-sidebar-label, .dashboard-sidebar-tip { display: none; }
    .dashboard-tabs { display: flex; flex: 1; overflow-x: auto; }
    .dashboard-tab { min-width: 7.4rem; }
    .dashboard-tab.general-active::before { left: 0; right: 0; bottom: -.75rem; width: auto; height: 3px; }
}
@media (max-width: 720px) {
    .dashboard-hero { padding: 8.8rem 0 5.5rem; }
    .dashboard-hero-grid { grid-template-columns: 1fr; }
    .dashboard-hero-card { max-width: 27rem; }
    .dashboard-stat-grid { grid-template-columns: 1fr; margin-top: -3.1rem; }
    .dashboard-stat-card { min-height: 116px; }
    .dashboard-panel { padding: 1rem; }
    .dashboard-panel-heading { flex-direction: column; }
    .dashboard-toolbar, .dashboard-toolbar-single { grid-template-columns: 1fr; }
    .dashboard-field-search { max-width: none; margin-left: 0; }
    .dashboard-wallet-grid, .dashboard-profile-layout { grid-template-columns: 1fr; }
    .dashboard-form-grid { grid-template-columns: 1fr; }
    .dashboard-form-footer, .dashboard-subheading { align-items: flex-start; flex-direction: column; }
    .dashboard-invoice-meta { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
    .dashboard-hero-copy h1 { font-size: 2.55rem; }
    .dashboard-hero-copy p { font-size: .9rem; }
    .dashboard-hero-actions .dashboard-button { width: 100%; }
    .dashboard-stat-card strong { font-size: 1.25rem; }
    .dashboard-sidebar { margin-right: -.25rem; margin-left: -.25rem; }
    .dashboard-tab { min-width: 6.8rem; padding: .7rem .45rem; font-size: .7rem; }
}

.site-body > main > section.dashboard-hero { min-height: 0 !important; }

/* Navbar patch: keep the desktop navigation on the same surface as the header. */
@media (min-width: 1024px) {
    .site-body .site-nav #nav_menu { background: transparent !important; border: 0 !important; box-shadow: none !important; }
    .site-body .site-nav #nav_menu ul { background: transparent !important; }
}
@media (max-width: 1023px) {
    .site-body .site-nav #nav_menu { background: #fff !important; }
}

/* Cart and checkout refresh */
.checkout-page { background: #f3f8f9; color: #173746; }
.checkout-hero { position: relative; overflow: hidden; padding: 10.5rem 0 5.4rem; background: linear-gradient(125deg, #0d3140, #12657a 62%, #0f4558); }
.checkout-hero::after { content: ""; position: absolute; width: 34rem; height: 34rem; right: -12rem; top: -18rem; border-radius: 50%; background: rgba(53, 212, 239, .18); }
.checkout-hero-grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1fr) 15rem; align-items: end; gap: 3rem; }
.checkout-breadcrumb { display: flex; align-items: center; gap: .5rem; margin-bottom: 1.5rem; color: #a9dce2; font-size: .7rem; font-weight: 800; letter-spacing: .08em; }
.checkout-breadcrumb a { color: #d4f2f3; text-decoration: none; }
.checkout-breadcrumb span { opacity: .5; }
.checkout-hero h1 { margin: .55rem 0 1rem; color: #fff; font-size: clamp(2.7rem, 5vw, 4.8rem); font-weight: 900; line-height: .98; letter-spacing: -.065em; }
.checkout-hero h1 em { color: #c9ef72; font-style: normal; }
.checkout-hero p { max-width: 630px; color: #b8d9df; font-size: .98rem; line-height: 1.7; }
.checkout-hero-summary { display: grid; gap: .35rem; padding: 1.2rem; border: 1px solid rgba(207, 241, 242, .22); border-radius: 20px; background: rgba(5, 29, 40, .28); backdrop-filter: blur(12px); }
.checkout-hero-summary span { color: #a6d4da; font-size: .63rem; font-weight: 900; letter-spacing: .13em; }
.checkout-hero-summary strong { color: #fff; font-size: 3rem; line-height: 1; }
.checkout-hero-summary small { color: #acd4da; font-size: .72rem; }
.checkout-content { padding: 2.2rem 0 7rem; }
.checkout-process { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; align-items: center; gap: .75rem; margin-bottom: 1.5rem; padding: 1rem 1.15rem; border: 1px solid #dae9eb; border-radius: 18px; background: #fff; box-shadow: 0 14px 32px rgba(18, 61, 76, .06); }
.checkout-process-step { display: flex; align-items: center; gap: .7rem; min-width: 0; }
.checkout-process-step > span { display: grid; place-items: center; width: 2rem; height: 2rem; flex: 0 0 auto; border-radius: 50%; color: #789099; background: #edf4f5; font-size: .65rem; font-weight: 900; }
.checkout-process-step.is-active > span { color: #173746; background: #c9ef72; }
.checkout-process-step strong, .checkout-process-step small { display: block; }
.checkout-process-step strong { color: #173746; font-size: .78rem; }
.checkout-process-step small { margin-top: .18rem; color: #82979d; font-size: .66rem; line-height: 1.35; }
.checkout-process-line { width: 2.25rem; height: 1px; background: #dbe8ea; }
.checkout-layout { display: grid; grid-template-columns: minmax(0, 1fr) 20rem; gap: 1.15rem; align-items: start; }
.checkout-main-card, .checkout-total-card, .checkout-help-card, .checkout-empty { border: 1px solid #dbeaec; border-radius: 20px; background: #fff; box-shadow: 0 16px 38px rgba(17, 64, 79, .07); }
.checkout-main-card { padding: 1.4rem; }
.checkout-card-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.checkout-card-heading h2 { margin: .3rem 0 .3rem; color: #173746; font-size: 1.65rem; font-weight: 900; letter-spacing: -.045em; }
.checkout-card-heading p { margin: 0; color: #81959b; font-size: .76rem; }
.checkout-count { padding: .38rem .6rem; border-radius: 999px; color: #087f97; background: #e8f8f9; font-size: .65rem; font-weight: 900; white-space: nowrap; }
.checkout-session-list { display: grid; gap: .7rem; }
.checkout-session { display: grid; grid-template-columns: 2rem minmax(0, 1fr) auto; gap: .8rem; align-items: start; padding: .95rem; border: 1px solid #e3eef0; border-radius: 15px; background: #fbfdfd; }
.checkout-session-index { display: grid; place-items: center; width: 2rem; height: 2rem; border-radius: .7rem; color: #087e95; background: #e5f7f8; font-size: .64rem; font-weight: 900; }
.checkout-session-top { display: flex; justify-content: space-between; gap: 1rem; }
.checkout-session-type { color: #0a9fb3; font-size: .61rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.checkout-session-top h3 { margin: .22rem 0 0; color: #173746; font-size: .95rem; font-weight: 900; }
.checkout-session-top > strong { color: #087f97; font-size: .93rem; white-space: nowrap; }
.checkout-session-meta { display: flex; flex-wrap: wrap; gap: .4rem .8rem; margin-top: .65rem; color: #7a9198; font-size: .68rem; }
.checkout-remove { display: inline-grid; place-items: center; width: 1.8rem; height: 1.8rem; border: 1px solid #f0d8d8; border-radius: 50%; color: #b55f63; background: #fff; font-size: 1.15rem; cursor: pointer; transition: all .2s ease; }
.checkout-remove:hover { border-color: #d99b9f; color: #fff; background: #c9797d; }
.checkout-remove:disabled { opacity: .55; cursor: wait; }
.checkout-continue { display: inline-flex; align-items: center; gap: .4rem; margin-top: 1rem; color: #087f97; font-size: .75rem; font-weight: 900; text-decoration: none; }
.checkout-side { display: grid; gap: 1rem; }
.checkout-total-card { padding: 1.25rem; color: #fff; background: linear-gradient(145deg, #0f6078, #0b3f52); border-color: #0f6078; box-shadow: 0 18px 38px rgba(13, 84, 104, .18); }
.checkout-total-top { display: flex; align-items: center; justify-content: space-between; gap: .6rem; color: #a6d7de; font-size: .62rem; font-weight: 900; letter-spacing: .13em; }
.checkout-secure { color: #d4f98e; letter-spacing: 0; text-transform: none; }
.checkout-total-card > strong { display: block; margin: 1rem 0 .4rem; color: #fff; font-size: 2.45rem; line-height: 1; letter-spacing: -.06em; }
.checkout-total-card > p { color: #b6dce2; font-size: .72rem; line-height: 1.5; }
.checkout-total-row { display: flex; align-items: center; justify-content: space-between; gap: .5rem; margin-top: 1rem; padding-top: .8rem; border-top: 1px solid rgba(207, 241, 242, .18); color: #b6dce2; font-size: .7rem; }
.checkout-total-row b { color: #fff; }
.checkout-total-divider { height: .7rem; }
.checkout-button { display: inline-flex; align-items: center; justify-content: center; gap: .55rem; min-height: 46px; padding: .72rem 1rem; border: 1px solid transparent; border-radius: 999px; font-size: .78rem; font-weight: 900; cursor: pointer; text-decoration: none; transition: all .2s ease; }
.checkout-button:hover { transform: translateY(-2px); }
.checkout-button-primary { color: #173746 !important; background: #c9ef72; box-shadow: 0 10px 22px rgba(13, 39, 52, .16); }
.checkout-button-primary:hover { background: #ddff92; }
.checkout-total-card .checkout-button { width: 100%; }
.checkout-help-card { padding: 1.15rem; }
.checkout-help-card h3 { margin: .35rem 0 .4rem; color: #173746; font-size: 1rem; font-weight: 900; }
.checkout-help-card p { margin: 0; color: #80969c; font-size: .73rem; line-height: 1.55; }
.checkout-help-card a { display: inline-flex; gap: .35rem; margin-top: .85rem; color: #087f97; font-size: .7rem; font-weight: 900; text-decoration: none; }
.checkout-empty { display: grid; place-items: center; min-height: 360px; padding: 2rem; text-align: center; }
.checkout-empty-icon { display: grid; place-items: center; width: 3.4rem; height: 3.4rem; margin-bottom: .9rem; border-radius: 1.1rem; color: #087f97; background: #e8f8f9; font-size: 1.5rem; font-weight: 900; }
.checkout-empty h2 { margin: .35rem 0 .5rem; color: #173746; font-size: 1.7rem; font-weight: 900; letter-spacing: -.04em; }
.checkout-empty p { max-width: 430px; margin: 0 0 1.1rem; color: #80969c; font-size: .78rem; line-height: 1.55; }
.checkout-modal { position: fixed; inset: 0; z-index: 50; padding: 1rem; background: rgba(9, 33, 44, .57); backdrop-filter: blur(6px); }
.checkout-modal-card { position: relative; width: min(100%, 31rem); padding: 1.5rem; border: 1px solid #d9eaec; border-radius: 22px; background: #fff; box-shadow: 0 26px 70px rgba(12, 50, 65, .24); }
.checkout-modal-card h2 { margin: .4rem 0 .35rem; color: #173746; font-size: 1.8rem; font-weight: 900; letter-spacing: -.045em; }
.checkout-modal-card > p { margin: 0; color: #7d9298; font-size: .78rem; line-height: 1.55; }
.checkout-modal-close { position: absolute; top: .8rem; right: .9rem; width: 2rem; height: 2rem; border: 0; color: #789096; background: transparent; font-size: 1.5rem; cursor: pointer; }
.checkout-payment-options { display: grid; gap: .6rem; margin: 1.25rem 0; }
.checkout-payment-option { display: grid; grid-template-columns: 2.2rem minmax(0,1fr) auto; align-items: center; gap: .7rem; padding: .75rem; border: 1px solid #dbeaec; border-radius: 14px; cursor: pointer; transition: all .2s ease; }
.checkout-payment-option:has(input:checked) { border-color: #0da7b7; background: #effbfb; box-shadow: 0 0 0 3px rgba(13, 167, 183, .08); }
.checkout-payment-option input[type="radio"] { appearance: none; -webkit-appearance: none; display: block; width: 1.05rem !important; min-width: 1.05rem !important; height: 1.05rem !important; min-height: 1.05rem !important; margin: 0 !important; padding: 0 !important; border: 1.5px solid #7e9298 !important; border-radius: 50% !important; background: #fff !important; box-shadow: none !important; color: transparent !important; cursor: pointer; }
.checkout-payment-option input[type="radio"]:checked { border-color: #0da7b7 !important; background: #0da7b7 !important; box-shadow: inset 0 0 0 3px #fff !important; }
.checkout-payment-option input[type="radio"]:focus-visible { outline: 3px solid rgba(13, 167, 183, .22); outline-offset: 2px; }
.checkout-payment-option strong, .checkout-payment-option small { display: block; }
.checkout-payment-option strong { color: #173746; font-size: .8rem; }
.checkout-payment-option small { margin-top: .2rem; color: #81969c; font-size: .67rem; }
.checkout-payment-icon { display: grid; place-items: center; width: 2.2rem; height: 2.2rem; border-radius: .7rem; color: #087f97; background: #e7f8f9; font-size: .95rem; font-weight: 900; }
.checkout-modal-card > .checkout-button { width: 100%; }
.checkout-success-card { text-align: center; }
.checkout-success-icon { display: grid; place-items: center; width: 3.5rem; height: 3.5rem; margin: .2rem auto 1rem; border-radius: 1.15rem; color: #0b856a; background: #e4f7ef; font-size: 1.6rem; font-weight: 900; }
.checkout-success-card h2 { margin-top: .35rem; }
.checkout-success-card p { margin-bottom: .7rem; }
.checkout-booking-number { display: block; margin: .5rem 0 1.2rem; color: #087f97; font-size: 1.35rem; letter-spacing: .08em; }
.checkout-success-card .checkout-button { width: auto; min-width: 12rem; }
@media (max-width: 820px) {
    .checkout-hero-grid, .checkout-layout { grid-template-columns: 1fr; }
    .checkout-hero-summary { max-width: 15rem; }
}
@media (max-width: 640px) {
    .checkout-hero { padding: 8.8rem 0 4rem; }
    .checkout-hero h1 { font-size: 2.7rem; }
    .checkout-process { grid-template-columns: 1fr; gap: .65rem; }
    .checkout-process-line { width: 1px; height: 1rem; margin-left: 1rem; }
    .checkout-main-card { padding: 1rem; }
    .checkout-session { grid-template-columns: 1.8rem minmax(0, 1fr) auto; gap: .55rem; }
    .checkout-session-top { display: grid; gap: .4rem; }
    .checkout-session-top > strong { justify-self: start; }
}


.site-body .booking-time-row select:disabled { cursor: not-allowed; opacity: .58; }
.site-body #timingContainer { margin-top: .7rem; }
.site-body .booking-added-slot { display: flex; align-items: center; justify-content: space-between; gap: .8rem; padding: .7rem .75rem; border: 1px solid #d8e8eb; border-radius: 12px; background: #f5fbfb; }
.site-body .booking-added-slot span, .site-body .booking-added-slot strong { display: block; }
.site-body .booking-added-slot span { color: #879da3; font-size: .62rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.site-body .booking-added-slot strong { margin-top: .2rem; color: #173746; font-size: .78rem; }
.site-body .booking-added-slot button { display: grid; place-items: center; width: 1.8rem; height: 1.8rem; border: 1px solid #efd0d0; border-radius: 50%; color: #b55f63; background: #fff; font-size: 1.1rem; line-height: 1; cursor: pointer; }
.site-body .booking-added-slot button:hover { color: #fff; background: #c9797d; }

.dashboard-button-danger { border: 1px solid #efc9c9; color: #a74e55; background: #fff5f5; }
.dashboard-button-danger:hover { color: #fff; background: #bb6065; }
.booking-action-buttons .dashboard-button-quiet { border-color: #cfe3e8; color: #087f97 !important; background: #f4fbfc; }
.booking-action-buttons .dashboard-button-quiet:hover { border-color: #08a9d2; color: #075f73 !important; background: #e8f8fa; }
.swal2-container { z-index: 1400 !important; }
.booking-action-modal { position: fixed; inset: 0; z-index: 1200; display: grid; place-items: center; padding: 1rem; }
.booking-action-modal[hidden] { display: none; }
.booking-action-backdrop { position: absolute; inset: 0; background: rgba(11, 42, 52, .38); backdrop-filter: blur(5px); }
.booking-action-dialog { position: relative; width: min(100%, 35rem); padding: 2rem; border: 1px solid #d9e8ea; border-radius: 1.4rem; background: #fff; box-shadow: 0 2rem 5rem rgba(16, 54, 65, .22); }
.booking-action-close { position: absolute; top: .8rem; right: .9rem; width: 2rem; height: 2rem; border: 0; border-radius: 50%; color: #53717a; background: #eef6f6; font-size: 1.25rem; cursor: pointer; }
.booking-action-dialog h3 { margin: .35rem 0 .4rem; color: #173746; font-size: 1.55rem; }
.booking-action-summary { margin: 0 0 1.2rem; color: #6f878e; }
.booking-action-slot { padding: .9rem 1rem; border-radius: .8rem; background: #f3faf9; }
.booking-action-slot span, .booking-action-slot strong { display: block; }
.booking-action-slot span { color: #7a9299; font-size: .68rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.booking-action-slot strong { margin-top: .25rem; color: #087f97; }
.booking-action-form { display: grid; gap: .8rem; margin-top: 1rem; }
.booking-action-form[hidden], .booking-action-buttons[hidden] { display: none !important; }
.booking-reschedule-date-wrap { position: relative; }
.booking-reschedule-date-wrap input { padding-right: 2.7rem !important; cursor: pointer; }
.booking-reschedule-date-wrap > span { position: absolute; top: 50%; right: .85rem; color: #078daf; font-size: .9rem; pointer-events: none; transform: translateY(-50%); }
.booking-availability-note { display: block; color: #789198; font-size: .7rem; line-height: 1.4; }
.booking-action-form select:disabled { cursor: not-allowed; opacity: .6; }
.booking-action-time-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; }
.booking-action-buttons { display: flex; flex-wrap: wrap; gap: .7rem; margin-top: 1.15rem; }
.booking-action-buttons .dashboard-button { flex: 1 1 10rem; justify-content: center; }
.swal2-container.premium-swal-container { z-index: 1500 !important; padding: 1.25rem !important; background: rgba(15, 44, 55, .5) !important; backdrop-filter: blur(9px); }
.swal2-popup.premium-swal-popup { width: min(100%, 31rem) !important; padding: 2rem 2rem 1.55rem !important; border: 1px solid rgba(212, 232, 234, .95) !important; border-radius: 1.5rem !important; background: linear-gradient(145deg, #fff 0%, #f7fcfc 100%) !important; box-shadow: 0 2rem 5rem rgba(15, 54, 66, .24), 0 0 0 1px rgba(255, 255, 255, .6) inset !important; }
.premium-swal-popup .swal2-icon.swal2-warning { width: 4.25rem !important; height: 4.25rem !important; margin: .15rem auto 1rem !important; border: 0 !important; border-radius: 1.25rem !important; color: #b86b48 !important; background: #fff1e9 !important; box-shadow: 0 10px 25px rgba(184, 107, 72, .14) !important; }
.premium-swal-popup .swal2-icon.swal2-warning .swal2-icon-content { font-size: 2rem !important; font-weight: 800; }
.premium-swal-title { margin: 0 !important; color: #173746 !important; font-size: 1.55rem !important; font-weight: 900 !important; letter-spacing: -.035em; }
.premium-swal-text { max-width: 22rem; margin: .65rem auto 0 !important; color: #718991 !important; font-size: .82rem !important; line-height: 1.55 !important; }
.premium-swal-actions { display: flex !important; width: 100%; gap: .7rem !important; margin: 1.45rem 0 0 !important; }
.premium-swal-confirm, .premium-swal-cancel { flex: 1 1 0; min-height: 2.9rem; padding: .78rem 1rem !important; border-radius: 999px !important; font-family: inherit !important; font-size: .78rem !important; font-weight: 800 !important; cursor: pointer; transition: transform .18s ease, box-shadow .18s ease, background .18s ease; }
.premium-swal-confirm { border: 1px solid #b95e5d !important; color: #fff !important; background: linear-gradient(135deg, #c97870, #a95157) !important; box-shadow: 0 10px 20px rgba(169, 81, 87, .2) !important; }
.premium-swal-confirm:hover { transform: translateY(-1px); box-shadow: 0 14px 26px rgba(169, 81, 87, .27) !important; }
.premium-swal-cancel { border: 1px solid #cfe3e8 !important; color: #087f97 !important; background: #f5fbfc !important; }
.premium-swal-cancel:hover { transform: translateY(-1px); border-color: #9ecbd3 !important; background: #eaf7f8 !important; }
.premium-swal-confirm:focus-visible, .premium-swal-cancel:focus-visible { outline: 3px solid rgba(8, 169, 210, .2) !important; outline-offset: 2px; }
@media (max-width: 520px) { .booking-action-dialog { padding: 1.4rem; } .booking-action-time-grid { grid-template-columns: 1fr; } }