/*
 * Green View Resort and Convention Centre Ltd.
 * Production Stylesheet (public/css/app.css)
 */

:root {
    --color-forest: #173C30;
    --color-forest-hover: #1f4f3f;
    --color-sage: #567B52;
    --color-gold: #D8C7A4;
    --color-ivory: #F4F0E6;
    --color-charcoal: #292B27;
}

/* Shared hospitality design system */
.site-container { width: min(100% - 64px, 1240px); margin-inline: auto; }
.public-site { background: #faf8f3; }
.public-site h1,.public-site h2,.public-site h3 { letter-spacing: -.025em; font-weight: 500; line-height: 1.12; }
.public-site p { line-height: 1.8; }
.public-site main > section:not(.resort-hero):first-child { padding-block: 64px; }
.utility-bar { background: var(--color-forest); color: #ede9dd; font-size: 11px; letter-spacing: .035em; }
.utility-bar .site-container { display: flex; justify-content: space-between; gap: 20px; padding-block: 11px; }
.utility-bar .site-container > div { display: flex; gap: 28px; }
.utility-bar a:hover { color: var(--color-gold); }
.site-header { position: sticky; top: 0; z-index: 40; background: #faf8f3f5; backdrop-filter: blur(18px); border-bottom: 1px solid #173c301c; }
.header-main { min-height: 96px; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.brand { display: inline-flex; gap: 14px; align-items: center; color: var(--color-forest); flex-shrink: 0; }
.brand-mark { width: 40px; height: 52px; }
.brand strong { display: block; font: 500 38px/1 'Cormorant Garamond',Georgia,serif; letter-spacing: .01em; }
.brand small { display: block; font-size: 8px; letter-spacing: .17em; margin-top: 9px; }
.header-invitation { text-align: center; color: var(--color-sage); }
.header-invitation span { display: block; font-size: 9px; letter-spacing: .2em; }
.header-invitation em { display: block; font: italic 20px Georgia,serif; margin-top: 8px; }
.button-primary,.button-light { display: inline-flex; justify-content: space-between; align-items: center; gap: 30px; padding: 16px 25px; font-size: 12px; font-weight: 600; border-radius: 3px; background: var(--color-forest); color: #fff; transition: background .2s; }
.button-primary:hover { background: #2e5744; }
.button-light { background: var(--color-gold); color: var(--color-forest); }
.button-light:hover { background: #eee3ce; }
.site-nav { border-top: 1px solid #173c3012; }
.site-nav .site-container { display: flex; justify-content: center; flex-wrap: wrap; column-gap: 34px; }
.site-nav a { position: relative; padding: 16px 0; color: #415248; font-size: 12px; font-weight: 500; white-space: nowrap; }
.site-nav a:hover,.site-nav a[aria-current] { color: var(--color-forest); }
.site-nav a[aria-current]::after { content:''; position:absolute; bottom:0; left:0; right:0; height:2px; background:var(--color-sage); }
.menu-toggle,.site-nav .mobile-book { display:none; }
.resort-hero { position: relative; overflow: hidden; }
.hero-layout { display: grid; grid-template-columns: 1.05fr 1fr; align-items: center; gap: 64px; padding-block: 64px 76px; }
.hero-copy { padding-block: 25px; }
.hero-copy > span { border: 0; border-radius: 0; padding: 0; color: var(--color-gold); font-size: 10px; letter-spacing: .2em; }
.hero-copy h1 { font-size: clamp(42px,4.8vw,70px); font-weight: 500; line-height: 1.04; margin-block: 23px; }
.hero-copy p { font-size: 15px; color: #e0e4d9; max-width: 490px; }
.hero-copy a { border-radius: 3px; font-size: 10px; letter-spacing: .08em; padding: 16px 20px; }
.hero-copy .bg-champagne { background: var(--color-gold); color: var(--color-forest); }
.resort-image { position:relative; aspect-ratio: 16/10; overflow:hidden; border-radius: 5px; background:#e7eade; margin:0; width:100%; }
.resort-image img { width:100%; height:100%; object-fit:cover; display:block; }
.image-placeholder { width:100%; height:100%; min-height:160px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:22px; color:#526953; background:radial-gradient(ellipse at 90% 10%,#d7ddc9 0,transparent 55%),linear-gradient(135deg,#e9ede1,#dce2d1); }
.image-placeholder::before { content:''; position:absolute; inset:15px; border:1px solid #52695325; pointer-events:none; }
.image-placeholder svg { width:78px; height:65px; margin-bottom:12px; opacity:.7; }
.image-placeholder span { font:500 25px/1.15 'Cormorant Garamond',Georgia,serif; }
.image-placeholder small { margin-top:10px; font-size:9px; text-transform:uppercase; letter-spacing:.14em; opacity:.8; }
.resort-image--hero { aspect-ratio: 4/4.25; border-radius: 120px 4px 4px 4px; border:1px solid #d8c7a445; }
.resort-image--hero .image-placeholder { background:radial-gradient(ellipse at 20% 0%,#6f826c 0,transparent 60%),linear-gradient(145deg,#435e49,#233e31); color:#ddd6b9; }
.resort-image--hero .image-placeholder::before { border-color:#d8c7a440; border-radius:108px 0 0 0; }
.resort-image--hero .image-placeholder svg { width:100px; height:100px; margin-bottom:22px; }
.availability-bar { margin-top:-24px; }
.availability-bar > div { border-radius:5px; box-shadow:0 12px 40px #173c3010; }
.public-site input,.public-site select,.public-site textarea { min-height:46px; border-color:#173c302b; border-radius:4px; background-color:white; color:#263c30; }
.public-site input[type=checkbox],.public-site input[type=radio] { min-height:auto; }
.public-site main .rounded-2xl { border-radius:8px; }
.public-site main .shadow-sm { box-shadow:0 4px 24px #173c3005; }
.public-site main .card-image { margin-bottom:24px; flex-shrink:0; }
.public-site main .card-image + .p-6 { padding-top:0; }
.public-site main .card-image:only-child { margin-bottom:0; }
.public-site main > section { scroll-margin-top:155px; }
.detail-image { padding-top:40px; }
.detail-image .resort-image { max-height:460px; aspect-ratio: 2.7; }
.public-site main a[class*="bg-"] { transition:background-color .2s,color .2s; }
.site-footer { background:#123629; color:#d9e0d5; margin-top:64px; }
.footer-invitation { padding-block:64px; display:flex; align-items:center; justify-content:space-between; gap:28px; border-bottom:1px solid #d8c7a42b; }
.eyebrow { font-size:10px; letter-spacing:.2em; color:var(--color-gold); }
.footer-invitation h2 { font-size:clamp(32px,4vw,50px); color:#f3f0e5; margin-top:15px; }
.footer-grid { display:grid; grid-template-columns:1.3fr .8fr .8fr 1.1fr; gap:48px; padding-block:56px; }
.footer-grid h3 { font-family:inherit; font-size:10px; text-transform:uppercase; letter-spacing:.16em; margin-bottom:24px; color:var(--color-gold); }
.footer-grid a:not(.footer-brand) { display:block; font-size:12px; margin-bottom:12px; line-height:1.6; }
.footer-grid a:hover,.footer-bottom a:hover { color:#fff; text-decoration:underline; text-underline-offset:4px; }
.footer-grid p { font-size:12px; color:#bfcdbf; margin-bottom:18px; }
.footer-grid .footer-brand { font:500 38px 'Cormorant Garamond',Georgia,serif; color:#f3f0e5; }
.footer-grid .footer-brand-sub { font-size:9px; text-transform:uppercase; letter-spacing:.13em; margin-top:2px; margin-bottom:24px; }
.footer-grid .footer-phone { font-size:20px!important; color:var(--color-gold); }
.footer-socials { display:flex; flex-wrap:wrap; gap:16px; }
.footer-bottom { border-top:1px solid #d8c7a42b; padding-block:24px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:16px; font-size:10px; color:#bfcdbf; }
.footer-bottom > div { display:flex; gap:20px; flex-wrap:wrap; }
.footer-bottom p { margin:0; }
.skip-link { position:fixed; top:8px; left:8px; transform:translateY(-150%); padding:12px; background:white; color:#173c30; z-index:100; }
.skip-link:focus { transform:none; }
/* Operations workspace: independent scrolling and readable controls */
.admin-site { background:#f3f5f2!important; height:100dvh; overflow:hidden; }
.admin-sidebar { width:264px; height:100dvh; box-shadow:none; }
.admin-sidebar nav { scrollbar-width:thin; scrollbar-color:#6d8577 transparent; }
.admin-sidebar nav a { min-height:42px; font-size:12px; margin-bottom:3px; }
.admin-sidebar nav a > span:first-child { font-size:0; width:16px; height:16px; display:inline-grid; place-items:center; opacity:.8; }
.admin-sidebar nav a > span:first-child::before { content:''; width:7px; height:7px; border:1px solid currentColor; border-radius:2px; }
.admin-sidebar nav a[class*="bg-[#567B52]"] > span:first-child::before { background:#d8c7a4; border-color:#d8c7a4; }
.admin-site > div.flex-1 { height:100dvh; overflow:auto; }
.admin-site header { min-height:88px; gap:20px; flex-wrap:wrap; flex-shrink:0; }
.admin-content h2,.admin-content h3,.admin-content h4 { font-family:'Plus Jakarta Sans',sans-serif; }
.admin-site header > div:first-child { flex-wrap:wrap; gap:8px; flex:1; min-width:0; }
.admin-site header h1 { font-family:'Plus Jakarta Sans',sans-serif; font-size:19px; letter-spacing:-.035em; line-height:1.35; }
.admin-subheading { flex-basis:100%; font-size:11px; color:#6b7a70; line-height:1.6; }
.admin-site header > div:last-child { gap:12px; font-size:11px; }
.admin-site header > div:last-child > div { max-width:210px; flex-wrap:wrap; }
.admin-content { width:100%; max-width:1680px; margin-inline:auto; overflow-x:clip; }
.admin-content .grid > * { min-width:0; }
.admin-content .grid > .bg-white { box-shadow:0 3px 12px #173c3004; }
.admin-content input:not([type=checkbox]):not([type=radio]),.admin-content select,.admin-content textarea { min-height:42px; max-width:100%; font-size:13px; border-radius:6px; }
.admin-content button,.admin-content a[class*="px-"] { min-height:38px; align-content:center; }
.admin-content input[type=checkbox] { width:16px; height:16px; accent-color:#173c30; }
.admin-content table { min-width:650px; font-size:12px; }
.admin-content th { font-size:10px; letter-spacing:.07em; font-weight:600; white-space:nowrap; }
.admin-content tbody tr:hover { background:#f7f9f5; }
.admin-content .text-\[10px\],.admin-content .text-\[11px\] { font-size:11px; }
.admin-content canvas { max-height:300px; }
.admin-content .text-2xl,.admin-content .text-xl { overflow-wrap:anywhere; font-variant-numeric:tabular-nums; }
.table-responsive:focus-visible { outline:2px solid #567b52; outline-offset:3px; }
[hidden] { display:none!important; }
@media(min-width:1024px){ .admin-sidebar { position:sticky; top:0; transform:none!important; } }
@media(max-width:1023px){
 .header-invitation { display:none; }
 .site-nav .site-container { column-gap:24px; }
 .hero-layout { gap:30px; }
 .hero-copy h1 { font-size:48px; }
 .footer-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .admin-sidebar { position:fixed; transform:translateX(-100%); width:min(85vw,280px); }
 .admin-sidebar.is-open { transform:translateX(0); }
 .admin-site header { position:sticky; top:0; }
}
@media(max-width:700px){
 .site-container { width:calc(100% - 40px); }
 .utility-bar .site-container { justify-content:center; padding-block:9px; font-size:10px; }
 .utility-bar .site-container > span,.utility-bar a:last-child { display:none; }
 .header-main { min-height:82px; gap:12px; }
 .brand-mark { width:30px; height:42px; }
 .brand { gap:10px; }
 .brand strong { font-size:31px; }
 .brand small { font-size:6.5px; letter-spacing:.12em; margin-top:7px; }
 .header-book { display:none; }
 .menu-toggle { display:flex; flex-direction:column; align-items:center; justify-content:center; padding:7px; gap:3px; color:var(--color-forest); font-size:9px; }
 .menu-toggle svg { width:24px; height:24px; }
 .site-nav { display:none; max-height:calc(100dvh - 110px); overflow:auto; }
 .site-nav.is-open { display:block; }
 .site-nav .site-container { flex-direction:column; padding-block:10px 24px; }
 .site-nav a { padding:13px 8px; font-size:14px; border-bottom:1px solid #173c3012; }
 .site-nav a[aria-current]::after { display:none; }
 .site-nav a[aria-current] { background:#e7ecdf; }
 .site-nav .mobile-book { display:block; background:var(--color-forest); color:#fff; padding:15px; margin-top:15px; text-align:center; }
 .hero-layout { grid-template-columns:1fr; padding-block:36px 56px; gap:28px; }
 .hero-copy { padding:0; }
 .hero-copy h1 { font-size:48px; max-width:500px; }
 .hero-copy p { font-size:14px; }
 .hero-copy > span { font-size:9px; }
 .resort-image--hero { aspect-ratio: 1.7; border-top-left-radius:75px; }
 .resort-image--hero .image-placeholder::before { border-top-left-radius:62px; }
 .resort-image--hero .image-placeholder svg { width:60px; height:60px; margin-bottom:7px; }
 .availability-bar { margin-top:-20px; }
 .public-site main > section:not(.resort-hero):first-child { padding-block:40px; }
 .public-site main h1:not(.hero-copy h1) { font-size:36px; }
 .public-site main .p-8,.public-site main .p-7 { padding:24px; }
 .public-site main .py-16 { padding-block:44px; }
 .public-site main .gap-12 { gap:32px; }
 .public-site main .sticky { position:static; }
 .public-site input,.public-site select,.public-site textarea,.admin-content input:not([type=checkbox]):not([type=radio]),.admin-content select,.admin-content textarea { font-size:16px; }
 .detail-image { padding-top:24px; }
 .detail-image .resort-image { aspect-ratio:1.5; }
 .site-footer { margin-top:40px; }
 .footer-invitation { align-items:flex-start; flex-direction:column; padding-block:40px; }
 .footer-grid { gap:30px 20px; padding-block:40px; }
 .footer-grid > div:first-child,.footer-grid > div:last-child { grid-column:1 / -1; }
 .footer-bottom { font-size:10px; gap:20px; }
 .footer-bottom > div { gap:16px; }
 .admin-site header { padding:14px 16px; }
 .admin-site header h1 { font-size:16px; }
 .admin-site header > div:last-child { width:100%; justify-content:space-between; }
 .admin-site header > div:last-child > div { max-width:75%; }
 .admin-site header a[target="_blank"] { display:none; }
 .admin-subheading { font-size:10px; }
 .admin-content .grid-cols-2 { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .admin-content .text-2xl { font-size:22px; }
 .admin-content .text-xl { font-size:18px; }
 .admin-content .p-6 { padding:18px; }
 .admin-content .col-span-4 { grid-column:1 / -1; }
}

*, *::before, *::after {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    -webkit-text-size-adjust: 100%;
}

body {
    margin: 0;
    font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    background-color: var(--color-ivory);
    color: var(--color-charcoal);
    line-height: 1.5;
    overflow-x: hidden;
}

h1, h2, h3, h4, .font-serif-display {
    font-family: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
}

/* Brand Utility Classes */
.bg-forest { background-color: var(--color-forest) !important; }
.bg-sage { background-color: var(--color-sage) !important; }
.bg-gold { background-color: var(--color-gold) !important; }
.bg-ivory { background-color: var(--color-ivory) !important; }
.bg-charcoal { background-color: var(--color-charcoal) !important; }

.text-forest { color: var(--color-forest) !important; }
.text-sage { color: var(--color-sage) !important; }
.text-gold { color: var(--color-gold) !important; }
.text-ivory { color: var(--color-ivory) !important; }
.text-charcoal { color: var(--color-charcoal) !important; }

.border-gold { border-color: var(--color-gold) !important; }
.border-forest { border-color: var(--color-forest) !important; }
.border-sage { border-color: var(--color-sage) !important; }

/* Keyboard Focus Accessibility */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: 2px solid var(--color-gold);
    outline-offset: 2px;
}

/* Responsive Table Wrapper */
.table-responsive {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

/* Alpine x-cloak support */
[x-cloak] {
    display: none !important;
}

/* Print Stylesheet for Reports, Vouchers & Invoices */
@media print {
    .admin-site,.admin-site > div.flex-1 { height:auto; overflow:visible; }
    aside, header, footer, nav, .no-print {
        display: none !important;
    }
    body {
        background: #ffffff !important;
        color: #000000 !important;
    }
}

/* Reduced Motion Accessibility */
@media (prefers-reduced-motion: reduce) {
    *, ::before, ::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

