/* ============================================================
   TOPHAT VIP — Site Style Restore Patch
   Loads after custom.css + site-utilities.css
   Restores legacy utility layout patterns using static CSS.
   Scoped to public/marketing pages; member dashboard layout untouched.
   ============================================================ */

:root {
    --navy: #0A1628;
    --navy-light: #13203A;
    --gold: #C9A84C;
    --gold-dark: #8a6f2b;
    --cream: #f7f5f0;
    --champagne: #F7F0DA;
    --font-body: 'Inter', system-ui, sans-serif;
    --font-display: 'Playfair Display', Georgia, serif;
}

.font-body { font-family: var(--font-body); }
.font-display { font-family: var(--font-display); }

/* ── Member portal guard: do not alter dashboard sidebar layout ── */
/* custom.css owns .members-sidebar width (160px) and .sidebar-link styling */

/* ── Fix utility bundle page-section boxing (full-width sections) ── */
.page-section {
    width: 100%;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0;
}

/* ── Broken arbitrary-value selectors (line-split in site-utilities.css) ── */
.h-\[1px\] { height: 1px; }
.min-h-\[100vh\] { min-height: 100vh; }
/* Excludes .members-sidebar — custom.css owns sidebar width (160px) */
:not(.members-sidebar).min-w-\[260px\] { min-width: 260px; }
.max-w-\[1200px\] { max-width: 1200px; }
.z-\[1100\] { z-index: 1100; }

/* Core layout utilities — ensure centered page containers */
.max-w-7xl { max-width: 80rem; }
.max-w-6xl { max-width: 72rem; }
.max-w-5xl { max-width: 64rem; }
.max-w-4xl { max-width: 56rem; }
.max-w-3xl { max-width: 48rem; }
.max-w-2xl { max-width: 42rem; }
.max-w-xl { max-width: 36rem; }
.max-w-md { max-width: 28rem; }
.mx-auto { margin-left: auto; margin-right: auto; }
.text-center { text-align: center; }
.grid { display: grid; }
.w-full { width: 100%; }
.px-4 { padding-left: 1rem; padding-right: 1rem; }
.px-6 { padding-left: 1.5rem; padding-right: 1.5rem; }

@media (min-width: 768px) {
    .md\:px-6 { padding-left: 1.5rem; padding-right: 1.5rem; }
}

.tracking-\[0\.12em\] { letter-spacing: 0.12em; }
.tracking-\[0\.15em\] { letter-spacing: 0.15em; }
.tracking-\[0\.2em\] { letter-spacing: 0.2em; }
.tracking-\[0\.25em\] { letter-spacing: 0.25em; }
.tracking-\[0\.32em\] { letter-spacing: 0.32em; }

.text-\[10px\] { font-size: 10px; line-height: 1.2; }
.text-\[\#F7F0DA\] { color: #F7F0DA; }

.md\:pl-\[72px\] { padding-left: 72px; }

/* ── Missing spacing utilities ── */
.space-y-3 > * + * { margin-top: 0.75rem; }

.gap-10 { gap: 2.5rem; }
.gap-12 { gap: 3rem; }

@media (min-width: 768px) {
    .md\:gap-8 { gap: 2rem; }
    .md\:gap-10 { gap: 2.5rem; }
    .md\:gap-12 { gap: 3rem; }
    .md\:py-12 { padding-top: 3rem; padding-bottom: 3rem; }
    .md\:py-14 { padding-top: 3.5rem; padding-bottom: 3.5rem; }
    .md\:py-16 { padding-top: 4rem; padding-bottom: 4rem; }
    .md\:text-6xl { font-size: 3.75rem; line-height: 1; }
}

@media (min-width: 1024px) {
    .lg\:flex-row { flex-direction: row; }
    .lg\:text-7xl { font-size: 4.5rem; line-height: 1; }
}

/* ── Missing color / border utilities ── */
.text-white\/40 { color: rgba(255, 255, 255, 0.4); }
.text-white\/30 { color: rgba(255, 255, 255, 0.3); }
.text-white\/20 { color: rgba(255, 255, 255, 0.2); }
.text-green-400 { color: #4ade80; }

.border-gold { border-color: var(--gold); }
.border-y { border-top-width: 1px; border-bottom-width: 1px; border-style: solid; }

.bg-navyLight,
.hover\:bg-navyLight:hover { background-color: var(--navy-light); }

.from-gold { --gradient-from: var(--gold); --gradient-stops: var(--gradient-from), var(--gradient-to, rgba(201, 168, 76, 0)); }
.to-goldDark { --gradient-to: var(--gold-dark); }
.bg-gradient-to-br { background-image: linear-gradient(to bottom right, var(--gradient-stops)); }

.accent-gold { accent-color: var(--gold); }

/* ── Missing layout / effect utilities ── */
.overflow-y-auto { overflow-y: auto; }
.overflow-x-auto { overflow-x: auto; }
.object-cover { object-fit: cover; }

.w-3\.5 { width: 0.875rem; }
.h-3\.5 { height: 0.875rem; }

.leading-6 { line-height: 1.5rem; }

.underline { text-decoration: underline; }
.underline-offset-4 { text-underline-offset: 4px; }

.focus\:outline-none:focus { outline: none; }
.focus\:ring-2:focus { box-shadow: 0 0 0 2px var(--focus-ring-color, var(--gold)); }
.focus\:ring-gold:focus { --focus-ring-color: var(--gold); }

.justify-center { justify-content: center; }

/* ── Footer: restore muted link opacities (utility bundle forces all white) ── */
footer .text-white\/40 { color: rgba(255, 255, 255, 0.4) !important; }
footer .text-white\/30 { color: rgba(255, 255, 255, 0.3) !important; }
footer .text-white\/20 { color: rgba(255, 255, 255, 0.2) !important; }

/* ── Re-assert custom.css button styling (utility bundle pill override) ── */
.btn-gold {
    background: linear-gradient(135deg, #C9A84C, #a88a3a);
    color: #0A1628;
    font-weight: 600;
    padding: 14px 32px;
    border-radius: 8px;
    font-size: 0.875rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    border: none;
    cursor: pointer;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.btn-gold:hover {
    background: linear-gradient(135deg, #e0c96e, #C9A84C);
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(201, 168, 76, 0.3);
}

.btn-outline-gold {
    background: transparent;
    border: 2px solid #C9A84C;
    color: #C9A84C;
    font-weight: 600;
    padding: 12px 30px;
    border-radius: 8px;
    font-size: 0.875rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    cursor: pointer;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.btn-outline-gold:hover {
    background: #C9A84C;
    color: #0A1628;
    transform: translateY(-2px);
}

/* Nav / compact buttons keep tighter padding from markup utilities */
#main-nav .btn-gold,
#mobile-menu .btn-gold {
    padding: 0.5rem 1.25rem;
}

/* Member login gateway — keep pill shape (utility bundle intent) */
#page-members-login .btn-gold,
#page-members-register .btn-gold,
#page-members .btn-gold {
    border-radius: 9999px;
    background: #D4AF37;
    text-transform: none;
    letter-spacing: 0.02em;
    padding: 0.75rem 1.5rem;
}

#page-members-login .btn-gold:hover,
#page-members-register .btn-gold:hover,
#page-members .btn-gold:hover {
    background: #e6c45a;
    transform: none;
    box-shadow: none;
}

/* ── Public light-section form inputs (undo utility bundle dark glass globally) ── */
#page-home .form-input,
#page-services .form-input,
#page-casino .form-input,
#page-veterans .form-input,
#page-pricing .form-input,
#page-about .form-input,
#page-contact .form-input,
#page-booking-request-submitted .form-input {
    width: 100%;
    padding: 12px 16px;
    border-radius: 8px;
    border: 1px solid #d1d1d1;
    font-size: 0.9375rem;
    font-family: 'Inter', sans-serif;
    background: #fff;
    color: #0A1628;
    backdrop-filter: none;
}

#page-home .form-input:focus,
#page-services .form-input:focus,
#page-casino .form-input:focus,
#page-veterans .form-input:focus,
#page-pricing .form-input:focus,
#page-about .form-input:focus,
#page-contact .form-input:focus,
#page-booking-request-submitted .form-input:focus {
    outline: none;
    border-color: #C9A84C;
    box-shadow: 0 0 0 3px rgba(201, 168, 76, 0.15);
}

#page-home .form-label,
#page-services .form-label,
#page-casino .form-label,
#page-veterans .form-label,
#page-pricing .form-label,
#page-about .form-label,
#page-contact .form-label,
#page-booking-request-submitted .form-label {
    font-size: 0.8125rem;
    font-weight: 600;
    color: #0A1628;
    margin-bottom: 6px;
    display: block;
    letter-spacing: 0.02em;
}

/* ── Contact page: cream panel + contact info card ── */
#page-contact .max-w-6xl {
    background: var(--cream);
    border-radius: 12px;
    padding: 2rem;
}

@media (min-width: 768px) {
    #page-contact .max-w-6xl {
        padding: 2.5rem;
    }
}

#page-contact aside .bg-white {
    box-shadow: 0 4px 24px rgba(10, 22, 40, 0.06);
}

#page-contact aside a {
    transition: color 0.2s ease;
}

#page-contact aside a:hover {
    color: var(--gold);
}

/* Contact info sidebar — fixed 260px on desktop */
@media (min-width: 1024px) {
    #page-contact aside {
        width: 260px;
        max-width: 260px;
        flex-shrink: 0;
    }
}

/* ── Launch message window: utility classes inside modal ── */
.launch-window .text-\[10px\] {
    font-size: 10px;
    line-height: 1.2;
}

.launch-window .text-\[\#F7F0DA\] {
    color: var(--champagne);
}

.launch-window .h-\[1px\] {
    height: 1px;
}

.launch-window .bg-gold\/70 {
    background-color: rgba(201, 168, 76, 0.7);
}

.launch-window .tracking-\[0\.32em\] {
    letter-spacing: 0.32em;
}

.launch-window .hover\:bg-navyLight:hover {
    background-color: var(--navy-light);
}

/* ── Hero: full viewport height from markup intent ── */
.hero-diagonal.min-h-\[100vh\] {
    min-height: 100vh;
}

@media (min-width: 768px) {
    .hero-diagonal.md\:min-h-screen {
        min-height: 100vh;
    }
}

/* Home hero sizing controlled in site-brand-colors.css */
#page-home .hero-diagonal.min-h-\[100vh\],
#page-home .hero-diagonal.md\:min-h-screen {
    min-height: unset !important;
}

/* ── Accent cards: left gold border ── */
.border-l-4.border-gold {
    border-left-color: var(--gold);
}

/* External modal reopen badge: lower-left on mobile */
@media (max-width: 767px) {
    #launch-window-badge.launch-window-badge {
        left: 18px !important;
        right: auto !important;
        bottom: 18px !important;
    }
}