/* Ashrafpur Turf & Swimming Zone: crest navy, antique gold, cool neutral. */
:root {
    --field: #1a3044;
    --field-dark: #112232;
    --field-rgb: 26,48,68;
    --field-light: #edf1f4;
    --field-soft: #f1f4f5;
    --field-contrast: #ffffff;
    --accent: #c5a66a;
    --accent-rgb: 197,166,106;
    --accent-light: #f7f2e8;
    --accent-contrast: #1a3044;
    --soft: #f4f6f5;
    --soft-rgb: 244,246,245;
    --surface: #ffffff;
    --theme-border: #d4dcdf;
    --line: #d4dcdf;
    --ink: #202d36;
    --muted: #596770;
    --ashrafpur-gold-dark: #796032;
    --ashrafpur-available: #27633d;
}

.public-booking-body,
.public-booking-body .site-shell {
    background: var(--soft);
    color: var(--ink);
}

.public-booking-body .hero-title {
    color: var(--field);
    font-size: 2.125rem;
    line-height: 1.15;
    overflow-wrap: anywhere;
}

.public-booking-body .hero-address {
    color: #405761;
}

.public-booking-body .turf-hero-logo {
    background: #f0f0ee;
    border-radius: 8px;
    object-fit: contain;
    box-shadow: 0 0 0 1px rgba(var(--accent-rgb), .6);
}

.public-booking-body :is(.public-booking-guide-button, .public-hero-language-switcher a.active) {
    background: var(--field);
    border-color: var(--field);
    color: var(--field-contrast);
    box-shadow: none;
}

.public-booking-body .public-booking-guide-button:is(:hover, :focus-visible) {
    background: var(--field-dark);
    border-color: var(--accent);
    color: var(--field-contrast);
    box-shadow: none;
}

.public-booking-body .public-booking-guide-icon {
    background: var(--accent);
    color: var(--accent-contrast);
}

.public-booking-body :is(.public-hero-language-switcher, .hero-phone-link) {
    background: var(--surface);
    border-color: var(--line);
    box-shadow: none;
}

.public-booking-body :is(.public-hero-language-switcher a:not(.active), .hero-phone-link, .hero-phone-number) {
    color: var(--field);
}

.public-booking-body .hero-phone-icon {
    background: var(--accent-light);
    color: var(--ashrafpur-gold-dark);
}

.public-booking-body :is(.booking-panel, .public-booking-tabs-section) {
    background: var(--surface);
    border-color: var(--line);
    box-shadow: none;
}

.public-booking-body .public-booking-tabs-section {
    border-top: 3px solid var(--accent);
}

.public-booking-body :is(.public-booking-main-tab, .public-resource-tab) {
    background: var(--field-soft);
    border-color: var(--line);
    color: var(--field);
}

.public-booking-body :is(.public-booking-main-tab, .public-resource-tab):hover {
    background: var(--accent-light);
    border-color: var(--accent);
    color: var(--field-dark);
}

.public-booking-body .public-booking-main-tab.active {
    background: var(--field);
    border-color: var(--field);
    color: var(--field-contrast);
    box-shadow: none;
}

.public-booking-body :is(.public-booking-main-tab strong, .public-resource-tab.active) {
    background: var(--accent);
    border-color: var(--accent);
    color: var(--accent-contrast);
    box-shadow: none;
}

.public-booking-body .public-booking-main-tab.active::after,
.public-booking-body .public-booking-resource-row::before {
    background: var(--accent);
}

.public-booking-body :is(.public-booking-resource-row, .booking-date-area, .public-tournament-date-row):not(.needs-selection) {
    background: var(--field-soft);
    border-color: var(--line);
}

.public-booking-body :is(.date-picker-shell, .date-stepper .btn) {
    background: var(--surface);
    border-color: var(--line);
    color: var(--field);
}

.public-booking-body .date-display-text {
    color: var(--field);
}

.public-booking-body :is(.slot-card, .public-package-card, .public-program-card, .public-tournament-card) {
    --package-card-line: var(--line);
    --package-card-soft: var(--field-soft);
    --package-card-title: var(--field);
    background: var(--surface);
    border-color: var(--line);
    color: var(--ink);
    box-shadow: none;
}

.public-booking-body :is(.slot-card, .public-package-card, .public-program-card, .public-tournament-card):not(:disabled):is(:hover, .active) {
    background: #fcfbf7;
    border-color: var(--ashrafpur-gold-dark);
    box-shadow: inset 0 0 0 1px var(--accent);
}

.public-booking-body .slot-state-available {
    background: #edf5ef;
    border-color: #bdd4c3;
    color: var(--ashrafpur-available);
}

.public-booking-body .slot-card.slot-card-state-booked:disabled {
    background: #fff6f6;
    border-color: #b94040;
    box-shadow: none;
    opacity: 1;
}

.public-booking-body .slot-card:focus-visible,
.public-booking-body :is(.public-package-card, .public-program-card, .public-tournament-card):focus-visible {
    outline: 2px solid var(--field);
    outline-offset: 3px;
}

.public-booking-body :is(.booking-sidebar, .summary-box, .payment-instruction-box, .public-sidebar-payment-card, .package-payment-panel, .package-payment-summary) {
    background: var(--field-soft);
    border-color: var(--line);
    box-shadow: none;
}

.public-booking-body .booking-selection-summary:is(.has-date, .is-selected):not(.needs-selection) {
    background: #fcfbf7;
    border-color: var(--accent);
    box-shadow: inset 4px 0 0 var(--accent);
}

.public-booking-body :is(.booking-package-public, .public-program-summary, .capacity-stage, #packageCapacityStage, #trainingProgramStage):not(.needs-selection) {
    background: var(--field-soft);
    border-color: var(--line);
    color: var(--ink);
    box-shadow: none;
}

.public-booking-body :is(.form-stage, .booking-selected-row, .booking-selected-cost-row) {
    background: var(--surface);
    border-color: var(--line);
}

.public-booking-body .next-step-hint {
    background: var(--field-light);
    border-color: var(--line);
    color: var(--field);
}

.public-booking-body .customer-stage.is-ready {
    background: var(--surface);
    border-color: var(--line);
    box-shadow: inset 4px 0 0 var(--field);
}

.public-booking-body :is(.booking-selected-total, .booking-selected-minimum, .package-summary-chips span) {
    background: var(--accent-light);
    border-color: #d4c19b;
    color: var(--field);
}

.public-booking-body :is(.form-control, .form-select) {
    background-color: var(--surface);
    border-color: #a6b3bb;
    color: var(--ink);
}

.public-booking-body :is(.form-control, .form-select):focus,
.public-booking-body .date-picker-shell:focus-within {
    border-color: var(--field);
    box-shadow: 0 0 0 .2rem rgba(var(--field-rgb), .16);
}

.public-booking-body .form-check-input:checked {
    background-color: var(--field);
    border-color: var(--field);
}

.public-booking-body .btn-primary {
    --bs-btn-color: var(--field-contrast);
    --bs-btn-bg: var(--field);
    --bs-btn-border-color: var(--field);
    --bs-btn-hover-color: var(--field-contrast);
    --bs-btn-hover-bg: var(--field-dark);
    --bs-btn-hover-border-color: var(--field-dark);
    --bs-btn-active-color: var(--field-contrast);
    --bs-btn-active-bg: var(--field-dark);
    --bs-btn-active-border-color: var(--field-dark);
    --bs-btn-disabled-color: var(--field-contrast);
    --bs-btn-disabled-bg: var(--field);
    --bs-btn-disabled-border-color: var(--field);
    --bs-btn-focus-shadow-rgb: var(--field-rgb);
}

.public-booking-body .btn-warning {
    --bs-btn-color: var(--accent-contrast);
    --bs-btn-bg: var(--accent);
    --bs-btn-border-color: var(--accent);
    --bs-btn-hover-color: var(--accent-contrast);
    --bs-btn-hover-bg: #d5bc8d;
    --bs-btn-hover-border-color: #d5bc8d;
    --bs-btn-active-color: var(--accent-contrast);
    --bs-btn-active-bg: #d5bc8d;
    --bs-btn-active-border-color: #d5bc8d;
    --bs-btn-disabled-color: var(--accent-contrast);
    --bs-btn-disabled-bg: var(--accent);
    --bs-btn-disabled-border-color: var(--accent);
    --bs-btn-focus-shadow-rgb: var(--accent-rgb);
}

.public-booking-body .btn-outline-primary {
    --bs-btn-color: var(--field);
    --bs-btn-border-color: var(--field);
    --bs-btn-hover-color: var(--field-contrast);
    --bs-btn-hover-bg: var(--field);
    --bs-btn-hover-border-color: var(--field);
    --bs-btn-active-color: var(--field-contrast);
    --bs-btn-active-bg: var(--field);
    --bs-btn-active-border-color: var(--field);
    --bs-btn-focus-shadow-rgb: var(--field-rgb);
}

@media (max-width: 991.98px) {
    .public-booking-body .hero-identity-row {
        flex-direction: column;
        gap: 16px;
    }

    .public-booking-body .hero-identity-row .hero-identity {
        flex: 0 1 auto;
        width: 100%;
    }

    .public-booking-body .hero-actions,
    .public-booking-body .hero-phone-list {
        align-items: center;
        flex-direction: row;
        justify-content: flex-start;
        margin-left: 0;
        max-width: 100%;
    }

    .public-booking-body .hero-actions {
        gap: 8px;
        width: 100%;
    }

    .public-booking-body .hero-title {
        font-size: 1.5rem;
    }

    .public-booking-body .hero-address {
        font-size: .95rem;
    }
}

@media (max-width: 575.98px) {
    .public-booking-body .date-stepper {
        grid-template-columns: 42px minmax(0, 1fr) 42px;
    }

    .public-booking-body .date-picker-shell {
        min-width: 0;
    }

    .public-booking-body .date-display-text {
        font-size: .875rem;
        line-height: 1.25;
        text-align: center;
        white-space: normal;
    }
}
