/* Admin workspace — shared multi-hub design language. */
/* Shared foundation adapted from multi-hub. */

/* ═══════════════════════════════════════════════
   1. DESIGN TOKENS
═══════════════════════════════════════════════ */
:root {
    --font-sans: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --font-mono: 'JetBrains Mono', 'Fira Code', ui-monospace, monospace;

    /* Light palette */
    --clr-bg:           #f3f5fb;
    --clr-surface:      #ffffff;
    --clr-surface-2:    #f8fafd;
    --clr-border:       #e3e8f0;
    --clr-border-soft:  #edf0f7;
    --clr-text:         #0f172a;
    --clr-text-sub:     #475569;
    --clr-text-muted:   #94a3b8;
    --clr-accent:       #10b981;
    --clr-accent-dim:   rgba(16,185,129,.08);
    --clr-accent-hover: #059669;

    /* Shadows */
    --shadow-xs: 0 1px 2px rgba(15,23,42,.04);
    --shadow-sm: 0 1px 4px rgba(15,23,42,.06), 0 1px 2px rgba(15,23,42,.04);
    --shadow-md: 0 4px 12px rgba(15,23,42,.08), 0 2px 4px rgba(15,23,42,.04);
    --shadow-lg: 0 8px 24px rgba(15,23,42,.10), 0 4px 8px rgba(15,23,42,.06);

    /* Radii */
    --radius-sm:  0.375rem;
    --radius-md:  0.625rem;
    --radius-lg:  0.875rem;
    --radius-pill:9999px;

    --ease: cubic-bezier(.4,0,.2,1);
    --dur-fast: 120ms;
    --dur-base: 180ms;
    --dur-slow: 280ms;
}

.dark {
    --clr-bg:           #080d19;
    --clr-surface:      #0f1928;
    --clr-surface-2:    #0b1220;
    --clr-border:       #1e2d42;
    --clr-border-soft:  #172032;
    --clr-text:         #f1f5f9;
    --clr-text-sub:     #94a3b8;
    --clr-text-muted:   #64748b;
    --clr-accent-dim:   rgba(16,185,129,.12);
    --clr-accent-hover: #34d399;
    --shadow-xs: 0 1px 3px rgba(0,0,0,.25);
    --shadow-sm: 0 2px 6px rgba(0,0,0,.30);
    --shadow-md: 0 4px 14px rgba(0,0,0,.35);
    --shadow-lg: 0 8px 28px rgba(0,0,0,.40);
}

/* ═══════════════════════════════════════════════
   2. GLOBAL RESET & TYPOGRAPHY
═══════════════════════════════════════════════ */
html, body, .fi-body {
    font-family: var(--font-sans) !important;
    font-size:   14px !important;
    font-weight: 400 !important;
    line-height: 1.55 !important;
    letter-spacing: -0.008em !important;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
    background-color: var(--clr-bg) !important;
    color: var(--clr-text) !important;
}

.font-mono, code, kbd, pre {
    font-family: var(--font-mono) !important;
}

.fi-header-heading {
    font-family: var(--font-sans) !important;
    font-size: 1.175rem !important;
    font-weight: 700 !important;
    letter-spacing: -0.03em !important;
}
.fi-header-subheading {
    font-size: 0.775rem !important;
    color: var(--clr-text-sub) !important;
}

/* ═══════════════════════════════════════════════
   3. PAGE LAYOUT
═══════════════════════════════════════════════ */
.fi-main-ctn {
    max-width: 100% !important;
    min-width: 0;
    padding-left: 1rem !important;
    padding-right: 1rem !important;
}
@media (min-width: 768px) {
    .fi-main-ctn { padding-left: 1.5rem !important; padding-right: 1.5rem !important; }
}
.fi-page { gap: 0.625rem !important; }
.fi-header { padding-bottom: 0.25rem !important; margin-bottom: 0 !important; }

/* ═══════════════════════════════════════════════
   4. TOPBAR
═══════════════════════════════════════════════ */
.fi-topbar {
    backdrop-filter: blur(16px) saturate(180%) !important;
    -webkit-backdrop-filter: blur(16px) saturate(180%) !important;
    background: rgba(255,255,255,.88) !important;
    border-bottom: 1px solid var(--clr-border) !important;
}
.dark .fi-topbar {
    background: rgba(8,13,25,.9) !important;
    border-bottom-color: var(--clr-border) !important;
}

/* ═══════════════════════════════════════════════
   5. SIDEBAR
═══════════════════════════════════════════════ */
.fi-sidebar {
    background: var(--clr-surface) !important;
    border-right: 1px solid var(--clr-border) !important;
}
.fi-sidebar-group-label {
    font-size: 0.625rem !important;
    font-weight: 700 !important;
    letter-spacing: .085em !important;
    text-transform: uppercase !important;
    color: var(--clr-text-muted) !important;
}
.fi-sidebar-item-label {
    font-size: 0.8rem !important;
    font-weight: 500 !important;
    color: var(--clr-text-sub) !important;
    transition: color var(--dur-fast) var(--ease);
}
.fi-sidebar-item-button:hover .fi-sidebar-item-label { color: var(--clr-accent) !important; }
.fi-sidebar-item-button:hover { transform: translateX(2px); transition: transform var(--dur-fast) var(--ease); }
.fi-sidebar-item-active .fi-sidebar-item-label { color: var(--clr-accent) !important; font-weight: 600 !important; }

/* ═══════════════════════════════════════════════
   6. FILAMENT SECTIONS / PANELS
═══════════════════════════════════════════════ */
.fi-section, .fi-wi-stats-overview-stat {
    background: var(--clr-surface) !important;
    border: 1px solid var(--clr-border) !important;
    border-radius: var(--radius-lg) !important;
    box-shadow: var(--shadow-sm) !important;
}

/* ═══════════════════════════════════════════════
   7. FILAMENT TABLE
═══════════════════════════════════════════════ */
.fi-ta-table { border-radius: var(--radius-lg) !important; border: 1px solid var(--clr-border) !important; }
.fi-ta-header-cell {
    font-size: 0.65rem !important; font-weight: 700 !important;
    letter-spacing: .055em !important; text-transform: uppercase !important;
    padding-top: 0.6rem !important; padding-bottom: 0.6rem !important;
    color: var(--clr-text-muted) !important; background: var(--clr-surface-2) !important;
}
.fi-ta-cell { font-size: 0.8rem !important; padding-top: 0.45rem !important; padding-bottom: 0.45rem !important; }
.fi-ta-text-item-label { font-size: 0.8rem !important; }
.fi-ta-cell-description { font-size: 0.7rem !important; color: var(--clr-text-muted) !important; }
.fi-ta-row:hover td { background-color: var(--clr-accent-dim) !important; }

/* ═══════════════════════════════════════════════
   8. FILAMENT BUTTONS
═══════════════════════════════════════════════ */
.fi-btn {
    font-size: 0.775rem !important; font-weight: 600 !important;
    letter-spacing: -0.005em !important;
    padding-top: 0.375rem !important; padding-bottom: 0.375rem !important;
    border-radius: var(--radius-sm) !important;
}
.fi-btn-label { font-size: 0.775rem !important; }

/* ═══════════════════════════════════════════════
   9. FILAMENT FORM INPUTS
═══════════════════════════════════════════════ */
.fi-input, .fi-select-input, .fi-fo-field-wrp-label { font-size: 0.8rem !important; }
.fi-fo-field-wrp-label { font-size: 0.7rem !important; font-weight: 600 !important; }
.fi-input:focus, .fi-select-input:focus {
    border-color: var(--clr-accent) !important;
    box-shadow: 0 0 0 3px rgba(16,185,129,.18) !important;
    outline: none !important;
}
.fi-badge-label { font-size: 0.625rem !important; font-weight: 700 !important; }

/* ═══════════════════════════════════════════════
   10. STATS OVERVIEW
═══════════════════════════════════════════════ */
.fi-wi-stats-overview-stat-value { font-size: 1.3rem !important; font-weight: 800 !important; letter-spacing: -0.025em !important; }
.fi-wi-stats-overview-stat-label { font-size: 0.7rem !important; font-weight: 600 !important; text-transform: uppercase !important; letter-spacing: .04em !important; }
.fi-wi-stats-overview-stat-description { font-size: 0.65rem !important; }

/* Modals */
.fi-modal-heading { font-size: 1rem !important; font-weight: 700 !important; letter-spacing: -0.02em !important; }
.fi-modal-description { font-size: 0.8rem !important; }



.occupancy-workspace { --oc-ink: #1d2b32; --oc-line: #e4e9e6; --oc-gold: #b5905d; }
.occupancy-intro { display: flex; align-items: end; justify-content: space-between; gap: 1.5rem; padding: 1.5rem 1.75rem; border-radius: 1.15rem; background: radial-gradient(circle at 90% 20%, rgba(211, 180, 125, .18), transparent 35%), linear-gradient(120deg, #172830, #233842); color: #fff; box-shadow: 0 14px 30px rgba(24, 39, 46, .12); }
.occupancy-eyebrow { display: block; color: #d8bb8e; font-size: .65rem; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; margin-bottom: .35rem; }
.occupancy-intro h2 { font-family: var(--ga-serif); font-size: clamp(1.4rem, 2vw, 2rem); font-weight: 700; letter-spacing: -.025em; line-height: 1.2; }
.occupancy-intro p { color: #c6d2d3; font-size: .78rem; margin-top: .35rem; }
.occupancy-intro-date { flex: none; padding: .7rem .9rem; border: 1px solid rgba(255, 255, 255, .16); border-radius: .8rem; background: rgba(255, 255, 255, .07); }
.occupancy-intro-date span { display: block; color: #bbcbca; font-size: .62rem; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; }
.occupancy-intro-date strong { display: block; margin-top: .12rem; font-size: .85rem; color: #fff; white-space: nowrap; }
.occupancy-stats > div { min-width: 0; min-height: 7rem; border: 1px solid var(--oc-line) !important; border-radius: .9rem !important; box-shadow: 0 3px 14px rgba(25, 42, 45, .035) !important; background: #fff !important; padding: .9rem !important; }
.occupancy-stats > div:first-child { background: #21343b !important; border-color: #21343b !important; color: #fff; }
.occupancy-stats > div:first-child > div:first-child > span:first-child, .occupancy-stats > div:first-child > div:nth-child(2) > span:last-child { color: #b9ceca !important; }
.occupancy-stats > div:first-child > div:nth-child(2) > span:first-child { color: #fff !important; }
.occupancy-stats > div:first-child > div:last-child { background: rgba(255,255,255,.15) !important; }
.occupancy-stats > div .text-2xl { font-size: 1.55rem !important; letter-spacing: -.04em; }
.occupancy-toolbar { border-color: var(--oc-line) !important; border-radius: 1rem !important; box-shadow: 0 6px 24px rgba(25, 42, 45, .045) !important; }
.occupancy-view-switcher { max-width: 100%; overflow-x: auto; scrollbar-width: thin; gap: .15rem; flex-shrink: 0; }
.occupancy-view-switcher button { white-space: nowrap; border-radius: .55rem; }
.occupancy-period-nav { flex-wrap: wrap; }
.occupancy-toolbar input, .occupancy-toolbar select { min-height: 2.4rem; border-radius: .65rem !important; }
.occupancy-legend { border-radius: .8rem !important; padding: .65rem 1rem !important; }
.occupancy-month-shell, .occupancy-rack { border-color: var(--oc-line) !important; border-radius: 1rem !important; box-shadow: 0 6px 24px rgba(25, 42, 45, .045) !important; }
.occupancy-month-inner { min-width: 1040px; }
.occupancy-month-inner > div:first-child { background: #eef2ef !important; }
.occupancy-month-inner > div:first-child > div { border-color: #e1e7e3 !important; padding: .8rem .5rem; font-size: .68rem; text-transform: uppercase; letter-spacing: .09em; }
.occupancy-month-grid { border-color: #e6ebe8 !important; }
.occupancy-day { min-height: 9.25rem !important; padding: .6rem !important; border-color: #e6ebe8 !important; }
.occupancy-day:hover { background: #f7faf8 !important; }
.occupancy-day .occupancy-booking-chip { border-radius: .45rem; padding: .34rem .45rem; box-shadow: none !important; }
.occupancy-booking-chip:focus-visible, .occupancy-week-day button:focus-visible, .occupancy-rack button:focus-visible { outline: 2px solid var(--oc-gold); outline-offset: 2px; }
.occupancy-week-grid { grid-template-columns: repeat(1, minmax(0, 1fr)); gap: .9rem; }
.occupancy-week-day { min-width: 0; min-height: 15rem; padding: 1rem !important; border-color: var(--oc-line) !important; box-shadow: 0 4px 18px rgba(25, 42, 45, .04) !important; }
.occupancy-week-day:hover { box-shadow: 0 10px 24px rgba(25, 42, 45, .09) !important; }
.occupancy-week-day button { overflow: hidden; }
.occupancy-rack table { min-width: max-content; }
.occupancy-rack th { position: sticky; top: 0; z-index: 15; background: #eef2ef !important; }
.occupancy-rack th:first-child { z-index: 25; }
.occupancy-rack td { border-color: #e8edeb !important; }
.occupancy-rack tbody tr:nth-child(even) { background: #f9fbfa; }
.occupancy-rack tbody tr:hover { background: #f0f6f2 !important; }
.occupancy-rack tbody tr:nth-child(even) td:first-child { background: #f9fbfa !important; }
.occupancy-rack tbody tr:hover td:first-child { background: #f0f6f2 !important; }
.occupancy-rack td button { border-radius: .45rem; }
.occupancy-workspace [role="dialog"] > div:last-child > div { border-radius: 1rem !important; }
html.dark .occupancy-workspace { --oc-line: #2a3b44; }
html.dark .occupancy-stats > div { background: #192832 !important; }
html.dark .occupancy-stats > div:first-child { background: #304750 !important; border-color: #425a61 !important; }
html.dark .occupancy-month-inner > div:first-child, html.dark .occupancy-rack th { background: #233640 !important; }
html.dark .occupancy-month-grid, html.dark .occupancy-day, html.dark .occupancy-rack td { border-color: #2a3b44 !important; }
html.dark .occupancy-day:hover { background: #23343e !important; }
html.dark .occupancy-rack tbody tr:nth-child(even) { background: #1b2a34; }
html.dark .occupancy-rack tbody tr:hover { background: #263a44 !important; }
html.dark .occupancy-rack tbody tr:nth-child(even) td:first-child { background: #1b2a34 !important; }
html.dark .occupancy-rack tbody tr:hover td:first-child { background: #263a44 !important; }
@media (min-width: 640px) { .occupancy-week-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .occupancy-week-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1500px) { .occupancy-week-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 2000px) { .occupancy-week-grid { grid-template-columns: repeat(7, minmax(0, 1fr)); } }
@media (max-width: 760px) { .occupancy-intro { align-items: start; flex-direction: column; padding: 1.2rem; } .occupancy-period-nav > div { width: 100%; margin-left: 0 !important; } .occupancy-legend > div:last-child { display: none; } }


:root { --ga-gold: #059669; --ga-sans: var(--font-sans); --ga-serif: var(--font-sans); }
html, body, .fi-body { font-size: 14px !important; }
.fi-main { max-width: 100rem !important; width: 100%; min-width: 0; }
.fi-main-ctn { padding-inline: 1.5rem !important; }
.fi-page > section { gap: 1.5rem !important; padding-block: 1.5rem !important; }
.fi-topbar, .fi-sidebar-header { min-height: 4.5rem; border-bottom: 1px solid var(--clr-border); }
.fi-topbar { background: var(--clr-surface) !important; backdrop-filter: none !important; box-shadow: none; }
.fi-sidebar-header { padding-inline: 1.25rem; }
.fi-sidebar-nav { padding: 1.25rem .85rem; gap: 1.5rem; scrollbar-width: thin; }
.fi-sidebar-item-button { min-height: 2.75rem; border-radius: .5rem; transition: background .15s; }
.fi-sidebar-item-button:hover { transform: none; background: var(--clr-surface-2); }
.fi-sidebar-item-active .fi-sidebar-item-button { background: var(--clr-accent-dim); }
.fi-sidebar-item-active .fi-sidebar-item-icon { color: var(--clr-accent-hover); }
.fi-sidebar-group-label { color: var(--clr-text-sub) !important; font-size: .65rem !important; }
.fi-header-heading { font-size: 1.65rem !important; letter-spacing: -.04em !important; }
.fi-header-subheading { font-size: .85rem !important; }
.fi-section, .fi-ta-ctn, .fi-wi-stats-overview-stat, .fi-modal-window, .fi-simple-main { border: 1px solid var(--clr-border); border-radius: .875rem; background: var(--clr-surface); box-shadow: var(--shadow-xs) !important; }
.fi-section-header { border-bottom: 1px solid var(--clr-border-soft); padding: 1.1rem 1.25rem; }
.fi-section-header-heading { font-size: .9rem; }
.fi-ta-header { padding: 1.25rem; }
.fi-ta-table { border: 0 !important; }
.fi-ta-header-cell { padding-block: .85rem !important; color: var(--clr-text-sub) !important; }
.fi-ta-cell { padding-block: .85rem !important; }
.fi-ta-content { max-width: 100%; overflow-x: auto; }
.fi-wi-stats-overview-stat { padding: 1.25rem !important; }
.fi-wi-stats-overview-stat-value { font-size: 2rem !important; font-weight: 650 !important; line-height: 1.25; margin-block: .55rem; }
.fi-wi-stats-overview-stat-label { text-transform: none !important; letter-spacing: 0 !important; font-size: .82rem !important; }
.fi-wi-stats-overview-stat-description { font-size: .75rem !important; }
.fi-btn { min-height: 2.5rem; border-radius: .5rem !important; box-shadow: none !important; }
.fi-input-wrp { border-radius: .5rem; background: var(--clr-surface); box-shadow: 0 0 0 1px var(--clr-border); }
.fi-input, .fi-select-input { min-height: 2.5rem; }
.fi-modal-window { overflow: hidden; }
.fi-dropdown-panel { border: 1px solid var(--clr-border); background: var(--clr-surface); border-radius: .75rem; max-height: calc(100dvh - 6rem); overflow-y: auto; }
.fi-simple-layout { background: var(--clr-bg); }
.fi-simple-main { padding: 2.5rem !important; }
.fi-simple-header-heading { font-size: 1.5rem; letter-spacing: -.035em; }
.font-serif { font-family: var(--font-sans) !important; }
.hotel-brand { display: flex; align-items: center; gap: .75rem; }
.hotel-brand-mark { display: grid; place-items: center; width: 2.4rem; height: 2.4rem; border-radius: .65rem; background: #047857; color: #fff; font-size: .85rem; font-weight: 750; }
.hotel-brand-copy strong, .hotel-brand-copy small { display: block; }
.hotel-brand-copy strong { font-size: .92rem; color: var(--clr-text); letter-spacing: -.025em; }
.hotel-brand-copy small { margin-top: .15rem; font-size: .65rem; color: var(--clr-text-sub); }
.hotel-topbar-context { color: var(--clr-text-sub); font-size: .8rem; }
.hotel-topbar-context span { color: var(--clr-text); font-weight: 650; }
.hotel-actions { display: flex; align-items: center; gap: .5rem; }
.hotel-action { display: inline-flex; align-items: center; justify-content: center; gap: .4rem; min-height: 2.4rem; padding: .5rem .8rem; border: 1px solid var(--clr-border); border-radius: .5rem; color: var(--clr-text-sub); background: var(--clr-surface); font-size: .75rem; font-weight: 600; }
.hotel-action:hover { background: var(--clr-surface-2); }
.hotel-action-primary { background: #047857; color: white; border-color: #047857; }
.hotel-action-primary:hover { background: #065f46; }
.hotel-action:focus-visible { outline: 2px solid #10b981; outline-offset: 3px; }
.hotel-sidebar-footer { margin: .75rem; padding: 1rem .65rem; border-top: 1px solid var(--clr-border); font-size: .75rem; color: var(--clr-text-sub); }
.hotel-sidebar-footer strong, .hotel-sidebar-footer small { display: block; }
.hotel-sidebar-footer strong { color: var(--clr-text); }
.hotel-sidebar-footer small { margin-top: .25rem; }
.hotel-overview { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; padding: 1.5rem; background: var(--clr-surface); border: 1px solid var(--clr-border); border-radius: .875rem; }
.hotel-overview-eyebrow { color: var(--clr-accent-hover); font-size: .65rem; font-weight: 700; text-transform: uppercase; letter-spacing: .12em; }
.hotel-overview h2 { margin: .4rem 0; color: var(--clr-text); font-size: 1.65rem; font-weight: 650; letter-spacing: -.04em; }
.hotel-overview p { color: var(--clr-text-sub); font-size: .85rem; }
.hotel-overview-date { text-align: right; font-size: .8rem; color: var(--clr-text-sub); white-space: nowrap; }
.hotel-overview-date strong { display: block; color: var(--clr-text); margin-bottom: .35rem; }
.occupancy-intro { background: var(--clr-surface); color: var(--clr-text); border: 1px solid var(--clr-border); box-shadow: none; }
.occupancy-intro p, .occupancy-intro-date { color: var(--clr-text-sub); }
.occupancy-intro-date strong { color: var(--clr-text); }
@media (max-width: 900px) { .hotel-topbar-context { display: none; } }
@media (max-width: 640px) { .fi-main-ctn { padding-inline: .75rem !important; } .hotel-overview { align-items: start; flex-direction: column; padding: 1.1rem; } .hotel-overview-date { text-align: left; } .hotel-action-secondary { display: none; } .fi-simple-main { padding: 1.5rem !important; } }

/* Let every admin page use the available space, with a compact content gutter. */
.fi-main-ctn { min-width: 0; padding-inline: 0 !important; }
.fi-main { max-width: none !important; padding-inline: .75rem !important; }
.fi-page { gap: .75rem !important; min-width: 0; }
.fi-page > section { gap: .75rem !important; padding-block: .75rem !important; min-width: 0; }
.fi-page > section > div { min-width: 0; }
.fi-header { gap: .5rem; padding-block: .4rem !important; }
.fi-section-header, .fi-ta-header { padding: .75rem 1rem; }
.fi-wi-stats-overview-stat { padding: 1rem !important; }

/* The four view choices read as one control and stay usable at narrow widths. */
.occupancy-workspace { min-width: 0; }
.occupancy-intro { align-items: center; gap: .75rem; padding: .75rem 1rem; }
.occupancy-intro h2 { font-size: 1.1rem; }
.occupancy-intro p { margin-top: .15rem; }
.occupancy-intro-date { padding: .35rem .65rem; }
.occupancy-stats > div { min-height: 5.5rem; padding: .65rem .75rem !important; }
.occupancy-toolbar { padding: .75rem !important; }
.occupancy-view-switcher { width: max-content; max-width: 100%; overflow: visible; flex-shrink: 1; gap: .25rem; }
.occupancy-view-switcher button { justify-content: center; min-width: 0; min-height: 2.35rem; padding: .4rem .7rem; border-radius: .5rem; line-height: 1.15; }
.occupancy-view-switcher button[aria-pressed="true"] { background: var(--clr-surface) !important; color: var(--clr-accent-hover) !important; box-shadow: var(--shadow-xs); }
.occupancy-view-switcher button:focus-visible { outline: 2px solid var(--clr-accent); outline-offset: 2px; }
.occupancy-period-nav { min-width: 0; gap: .35rem; }
.occupancy-period-nav > div { min-width: 0; margin-left: .35rem; }
.occupancy-period-nav > div > span { overflow-wrap: anywhere; }
.occupancy-legend { padding: .45rem .75rem !important; }

/* The month uses the canvas; only narrow screens scroll the seven-day grid. */
.occupancy-month-shell, .occupancy-rack { max-width: 100%; border-radius: .65rem !important; box-shadow: var(--shadow-xs) !important; scrollbar-width: thin; }
.occupancy-month-inner { width: 100%; min-width: 770px; }
.occupancy-month-inner > div:first-child > div { padding: .5rem .3rem; }
.occupancy-day { min-width: 0; min-height: 7.25rem !important; padding: .4rem !important; }
.occupancy-day .occupancy-booking-chip { padding: .2rem .35rem; }

/* A seven-day week belongs on one desktop row. Cards can still grow vertically. */
.occupancy-week-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
.occupancy-week-day { min-width: 0; min-height: 12rem; padding: .65rem !important; box-shadow: var(--shadow-xs) !important; }
.occupancy-week-day button { min-width: 0; }
.occupancy-week-day button span { min-width: 0; overflow-wrap: anywhere; }

/* The 14-day rack fits common desktop widths; the 30-day rack scrolls deliberately. */
.occupancy-rack table { table-layout: fixed; width: 100%; min-width: 0; }
.occupancy-rack-14 table { min-width: 970px; }
.occupancy-rack-30 table { min-width: 1850px; }
.occupancy-rack th:first-child, .occupancy-rack td:first-child { width: 12rem; min-width: 12rem; }
.occupancy-rack th:not(:first-child), .occupancy-rack td:not(:first-child) { width: auto; min-width: 0; }
.occupancy-rack th { padding: .4rem .2rem; }
.occupancy-rack td { padding: .25rem; height: 2.8rem; }
.occupancy-rack td:first-child { padding: .45rem .6rem; }
.occupancy-rack td:first-child > div { min-width: 0; }
.occupancy-rack td:first-child span { overflow: hidden; text-overflow: ellipsis; }

@media (min-width: 900px) { .occupancy-week-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 1440px) { .occupancy-week-grid { grid-template-columns: repeat(7, minmax(0, 1fr)); } }
@media (max-width: 900px) { .occupancy-view-switcher { width: 100%; } }
@media (max-width: 640px) {
    .fi-main { padding-inline: .5rem !important; }
    .fi-page > section { padding-block: .5rem !important; }
    .occupancy-intro { align-items: flex-start; padding: .65rem .75rem; }
    .occupancy-view-switcher button { padding: .45rem .25rem; font-size: .7rem; }
    .occupancy-view-switcher button svg { display: none; }
    .occupancy-week-grid { grid-template-columns: 1fr; }
}

/* Occupancy workspace: the Filament panel does not load the public Tailwind bundle. */
.occupancy-page > section > .fi-header { display: none; }
.occupancy-page > section { padding-top: .5rem !important; }
.occupancy-workspace {
    --oc-surface: #fff;
    --oc-canvas: #f8fafc;
    --oc-border: #e2e8f0;
    --oc-text: #0f172a;
    --oc-muted: #64748b;
    --oc-accent: #047857;
    display: flex;
    flex-direction: column;
    gap: .65rem;
    color: var(--oc-text);
}
html.dark .occupancy-workspace {
    --oc-surface: #171d2b;
    --oc-canvas: #111827;
    --oc-border: #30394b;
    --oc-text: #e8edf5;
    --oc-muted: #a3adbd;
    --oc-accent: #34d399;
}
.occupancy-workspace > * { min-width: 0; }
.occupancy-intro {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .8rem 1rem;
    border: 1px solid var(--oc-border);
    border-radius: .75rem;
    background: var(--oc-surface);
    box-shadow: none;
    color: var(--oc-text);
}
.occupancy-eyebrow { color: var(--oc-accent); margin-bottom: .1rem; font-size: .66rem; letter-spacing: .1em; }
.occupancy-intro h2 { color: var(--oc-text); font-size: 1.35rem; line-height: 1.2; }
.occupancy-intro p { color: var(--oc-muted); font-size: .75rem; }
.occupancy-intro-date { padding: 0; border: 0; background: transparent; text-align: right; }
.occupancy-intro-date span { color: var(--oc-muted); }
.occupancy-intro-date strong { color: var(--oc-text); }
.occupancy-stats { display: grid !important; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: .5rem; }
.occupancy-stats > div,
html.dark .occupancy-stats > div,
.occupancy-stats > div:first-child,
html.dark .occupancy-stats > div:first-child {
    min-width: 0;
    min-height: 5rem;
    padding: .65rem .8rem !important;
    border: 1px solid var(--oc-border) !important;
    border-radius: .7rem !important;
    background: var(--oc-surface) !important;
    color: var(--oc-text) !important;
    box-shadow: none !important;
}
.occupancy-stats > div:first-child > div:first-child > span:first-child,
.occupancy-stats > div:first-child > div:nth-child(2) > span:last-child { color: var(--oc-muted) !important; }
.occupancy-stats > div:first-child > div:nth-child(2) > span:first-child { color: var(--oc-text) !important; }
.occupancy-stats > div .text-2xl { font-size: 1.4rem !important; }
.occupancy-toolbar {
    display: flex !important;
    flex-direction: column;
    gap: .75rem;
    padding: .75rem !important;
    border: 1px solid var(--oc-border) !important;
    border-radius: .75rem !important;
    background: var(--oc-surface) !important;
    box-shadow: none !important;
}
.occupancy-toolbar-top { display: flex !important; align-items: center; justify-content: space-between; gap: 1rem; min-width: 0; }
.occupancy-view-switcher {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    align-items: stretch;
    width: min(680px, 100%);
    flex: 0 1 680px;
    gap: .2rem;
    padding: .2rem !important;
    border: 1px solid var(--oc-border) !important;
    border-radius: .55rem !important;
    background: var(--oc-canvas) !important;
}
.occupancy-view-switcher button {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: .35rem;
    min-width: 0;
    min-height: 2.4rem;
    padding: .35rem .4rem;
    border-radius: .4rem;
    color: var(--oc-muted) !important;
    font-size: .75rem;
    font-weight: 650;
    white-space: nowrap;
}
.occupancy-view-switcher button svg { flex: none; width: .9rem; height: .9rem; color: currentColor !important; }
.occupancy-view-switcher button:hover { color: var(--oc-text) !important; }
.occupancy-view-switcher button[aria-pressed="true"] { color: var(--oc-accent) !important; background: var(--oc-surface) !important; box-shadow: 0 1px 4px rgba(15, 23, 42, .12); }
.occupancy-period-nav { display: flex !important; align-items: center; justify-content: flex-end; flex: 1 1 auto; flex-wrap: wrap; gap: .35rem; }
.occupancy-period-nav > button { display: grid; place-items: center; flex: none; min-width: 2.3rem; height: 2.3rem; padding: .4rem .6rem; border: 1px solid var(--oc-border); border-radius: .45rem; background: var(--oc-surface); color: var(--oc-text); }
.occupancy-period-nav > button:hover { border-color: var(--oc-accent); }
.occupancy-period-label { display: flex; align-items: center; gap: .5rem; min-width: 0; margin-left: .4rem; color: var(--oc-text); font-size: .85rem; white-space: nowrap; }
.occupancy-period-label input { width: 8.5rem; max-width: 100%; height: 2.3rem; padding: .3rem .5rem; border: 1px solid var(--oc-border); border-radius: .45rem; background: var(--oc-canvas); color: var(--oc-text); }
.occupancy-filter-row {
    display: grid !important;
    grid-template-columns: minmax(14rem, 2fr) minmax(10rem, 1fr) minmax(10rem, 1fr) auto;
    align-items: center;
    gap: .5rem;
    padding-top: .75rem;
    border-top: 1px solid var(--oc-border);
}
.occupancy-filter-row > div { position: relative; min-width: 0; }
.occupancy-filter-search > div { position: absolute; top: 0; bottom: 0; left: 0; display: flex; align-items: center; padding-left: .7rem; pointer-events: none; color: var(--oc-muted); }
.occupancy-filter-row input, .occupancy-filter-row select {
    display: block;
    width: 100%;
    height: 2.4rem;
    padding: .4rem .65rem;
    border: 1px solid var(--oc-border) !important;
    border-radius: .45rem !important;
    background: var(--oc-canvas) !important;
    color: var(--oc-text) !important;
    font-size: .75rem;
}
.occupancy-filter-search input { padding-left: 2.2rem; }
.occupancy-filter-row input::placeholder { color: var(--oc-muted); opacity: .85; }
.occupancy-filter-meta { display: flex; justify-content: flex-end; min-width: 9rem; color: var(--oc-muted); white-space: nowrap; }
.occupancy-filter-meta button { display: inline-flex; align-items: center; gap: .3rem; height: 2.4rem; padding: .4rem .7rem; border: 1px solid var(--oc-border); border-radius: .45rem; background: var(--oc-canvas); color: var(--oc-text); font-size: .75rem; }
.occupancy-legend {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    padding: .45rem .7rem !important;
    border: 1px solid var(--oc-border) !important;
    border-radius: .55rem !important;
    background: var(--oc-surface) !important;
    color: var(--oc-muted) !important;
}
.occupancy-legend > div { display: flex; align-items: center; flex-wrap: wrap; gap: .8rem; }
.occupancy-legend > div > div { display: flex; align-items: center; gap: .3rem; }
.occupancy-legend span, .occupancy-legend strong { color: var(--oc-muted) !important; }
.occupancy-legend > div:first-child > div:nth-child(1) > span:first-child { background: #10b981; }
.occupancy-legend > div:first-child > div:nth-child(2) > span:first-child { background: #3b82f6; }
.occupancy-legend > div:first-child > div:nth-child(3) > span:first-child { background: #a855f7; }
.occupancy-legend > div:first-child > div:nth-child(4) > span:first-child { background: #f59e0b; }
.occupancy-legend > div:first-child > div > span:first-child { display: inline-block; flex: none; width: .5rem; height: .5rem; border-radius: 50%; }
.occupancy-month-shell, .occupancy-rack { overflow-x: auto; border: 1px solid var(--oc-border) !important; background: var(--oc-surface) !important; }
.occupancy-month-inner { min-width: 770px; width: 100%; }
.occupancy-month-inner > div:first-child { display: grid !important; grid-template-columns: repeat(7, minmax(0, 1fr)); background: var(--oc-canvas) !important; border-bottom: 1px solid var(--oc-border); color: var(--oc-muted); }
.occupancy-month-inner > div:first-child > div { border-color: var(--oc-border) !important; padding: .6rem .35rem; font-size: .67rem; letter-spacing: .09em; }
.occupancy-month-grid { display: grid !important; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 1px; background: var(--oc-border); border: 0 !important; }
.occupancy-day, html.dark .occupancy-day { display: flex !important; flex-direction: column; justify-content: space-between; min-width: 0; min-height: 7.2rem !important; padding: .55rem !important; border: 0 !important; background: var(--oc-surface) !important; color: var(--oc-text); opacity: 1; }
.occupancy-day.is-outside, html.dark .occupancy-day.is-outside { background: var(--oc-canvas) !important; opacity: .45; }
.occupancy-day.is-today, html.dark .occupancy-day.is-today { box-shadow: inset 0 0 0 2px var(--oc-accent); }
.occupancy-day:hover, html.dark .occupancy-day:hover { background: var(--oc-canvas) !important; }
.occupancy-day > div:first-child > div:first-child { display: flex; align-items: center; justify-content: space-between; gap: .3rem; }
.occupancy-day > div:first-child > div:first-child > div:first-child { display: flex; align-items: center; gap: .35rem; }
.occupancy-day > div:first-child > div:first-child > div:last-child { font-size: .65rem; }
.occupancy-day-footer { display: flex; align-items: center; justify-content: space-between; gap: .3rem; margin-top: .45rem; padding-top: .35rem; border-top: 1px solid var(--oc-border) !important; color: var(--oc-muted) !important; font-size: .65rem; }
.occupancy-day-footer span:last-child { color: var(--oc-text) !important; }
.occupancy-week-grid { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
.occupancy-week-day, html.dark .occupancy-week-day { display: flex !important; flex-direction: column; justify-content: space-between; min-width: 0; min-height: 13rem; padding: .75rem !important; border: 1px solid var(--oc-border) !important; border-radius: .65rem; background: var(--oc-surface) !important; color: var(--oc-text); }
.occupancy-week-day > div:first-child > div:first-child { display: flex; justify-content: space-between; align-items: center; gap: .3rem; border-bottom-color: var(--oc-border); }
.occupancy-week-day > div:first-child > div:nth-child(2) { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .3rem; }
.occupancy-week-day button > div { display: flex; justify-content: space-between; gap: .3rem; }
.occupancy-rack table { border-collapse: separate; border-spacing: 0; }
.occupancy-rack th, html.dark .occupancy-rack th { border-color: var(--oc-border) !important; background: var(--oc-canvas) !important; color: var(--oc-muted); }
.occupancy-rack td { border-color: var(--oc-border) !important; }
.occupancy-rack td:first-child, html.dark .occupancy-rack td:first-child { background: var(--oc-surface) !important; }
.occupancy-rack tbody tr:hover td:first-child, html.dark .occupancy-rack tbody tr:hover td:first-child { background: var(--oc-canvas) !important; }
@media (min-width: 1000px) { .occupancy-week-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 1550px) { .occupancy-week-grid { grid-template-columns: repeat(7, minmax(0, 1fr)); } }
@media (max-width: 1280px) {
    .occupancy-toolbar-top { flex-direction: column; align-items: stretch; }
    .occupancy-view-switcher { flex-basis: auto; width: 100%; }
    .occupancy-period-nav { justify-content: flex-start; }
}
@media (max-width: 900px) {
    .occupancy-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .occupancy-filter-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .occupancy-filter-search { grid-column: 1 / -1; }
    .occupancy-filter-meta { justify-content: flex-start; }
}
@media (max-width: 640px) {
    .occupancy-intro { align-items: flex-start; flex-direction: column; }
    .occupancy-intro-date { text-align: left; }
    .occupancy-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .occupancy-view-switcher { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .occupancy-view-switcher button { white-space: normal; }
    .occupancy-view-switcher button svg { display: block; }
    .occupancy-filter-row { grid-template-columns: 1fr; }
    .occupancy-filter-search { grid-column: auto; }
    .occupancy-period-nav { justify-content: flex-start; }
    .occupancy-period-label { width: 100%; margin-left: 0; white-space: normal; }
    .occupancy-week-grid { grid-template-columns: 1fr; }
    .occupancy-legend > div:last-child { display: none; }
}
/* Walk-in booking workspace. These rules are loaded by Filament on every admin page. */
.walkin-page > section > .fi-header { display: none; }
.walkin-page > section { padding-top: .5rem !important; }
.walkin-workspace {
    --wi-surface: #fff;
    --wi-canvas: #f8fafc;
    --wi-border: #e2e8f0;
    --wi-text: #0f172a;
    --wi-muted: #64748b;
    --wi-accent: #047857;
    display: flex;
    flex-direction: column;
    gap: .75rem;
    color: var(--wi-text);
}
html.dark .walkin-workspace {
    --wi-surface: #171d2b;
    --wi-canvas: #111827;
    --wi-border: #30394b;
    --wi-text: #e8edf5;
    --wi-muted: #a3adbd;
    --wi-accent: #34d399;
}
.walkin-workspace > * { min-width: 0; }
.walkin-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.25rem;
    border: 1px solid var(--wi-border);
    border-radius: .75rem;
    background: var(--wi-surface);
}
.walkin-eyebrow { display: block; color: var(--wi-accent); font-size: .65rem; font-weight: 750; letter-spacing: .11em; text-transform: uppercase; }
.walkin-hero h1 { margin: .15rem 0; color: var(--wi-text); font-size: 1.45rem; font-weight: 700; letter-spacing: -.035em; line-height: 1.2; }
.walkin-hero p { color: var(--wi-muted); font-size: .78rem; }
.walkin-hero-badge { flex: none; padding: .45rem .7rem; border: 1px solid var(--wi-border); border-radius: 999px; background: var(--wi-canvas); color: var(--wi-muted); font-size: .68rem; font-weight: 650; }
.walkin-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(18rem, 22rem); align-items: start; gap: .75rem; min-width: 0; }
.walkin-main { display: flex; flex-direction: column; gap: .75rem; min-width: 0; }
.walkin-card, .walkin-summary-card { min-width: 0; border: 1px solid var(--wi-border); border-radius: .75rem; background: var(--wi-surface); box-shadow: 0 1px 2px rgba(15,23,42,.035); }
.walkin-card-header { display: flex; align-items: center; gap: .75rem; padding: .9rem 1rem; border-bottom: 1px solid var(--wi-border); }
.walkin-step { display: grid; place-items: center; flex: none; width: 2rem; height: 2rem; border-radius: .55rem; background: rgba(16,185,129,.1); color: var(--wi-accent); font-size: .72rem; font-weight: 800; }
.walkin-card-header h2, .walkin-summary-header h2 { color: var(--wi-text); font-size: .95rem; font-weight: 700; letter-spacing: -.02em; }
.walkin-card-header p, .walkin-summary-header p { margin-top: .12rem; color: var(--wi-muted); font-size: .72rem; }
.walkin-card-body { display: flex; flex-direction: column; gap: 1rem; padding: 1rem; }
.walkin-stay-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1.3fr)) repeat(3, minmax(5rem, .6fr)); gap: .75rem; }
.walkin-guest-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .85rem; }
.walkin-field { display: flex; flex-direction: column; gap: .35rem; min-width: 0; }
.walkin-field-wide { grid-column: 1 / -1; }
.walkin-field label { color: var(--wi-text); font-size: .72rem; font-weight: 650; }
.walkin-field label span { color: #e11d48; }
.walkin-field input, .walkin-field select, .walkin-field textarea {
    display: block;
    width: 100%;
    min-width: 0;
    min-height: 2.5rem;
    padding: .55rem .7rem;
    border: 1px solid var(--wi-border);
    border-radius: .5rem;
    background: var(--wi-canvas);
    color: var(--wi-text);
    font-size: .8rem;
    outline: none;
}
.walkin-field textarea { min-height: 4.3rem; resize: vertical; }
.walkin-field :is(input, select, textarea):focus { border-color: var(--wi-accent); box-shadow: 0 0 0 3px rgba(16,185,129,.12); }
.walkin-field input::placeholder { color: var(--wi-muted); }
.walkin-room-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; }
.walkin-room-option { display: flex; align-items: center; gap: .7rem; min-width: 0; min-height: 4rem; padding: .7rem .8rem; border: 1px solid var(--wi-border); border-radius: .55rem; background: var(--wi-canvas); cursor: pointer; transition: border-color .15s, background .15s; }
.walkin-room-option:hover { border-color: var(--wi-accent); }
.walkin-room-option.is-selected { border-color: var(--wi-accent); background: rgba(16,185,129,.07); box-shadow: inset 0 0 0 1px var(--wi-accent); }
.walkin-room-option input { flex: none; width: 1rem; height: 1rem; accent-color: #059669; }
.walkin-room-copy { display: block; flex: 1 1 auto; min-width: 0; }
.walkin-room-copy strong, .walkin-room-copy small, .walkin-room-price small { display: block; }
.walkin-room-copy strong { color: var(--wi-text); font-size: .8rem; font-weight: 700; line-height: 1.3; }
.walkin-room-copy small, .walkin-room-price small { margin-top: .12rem; color: var(--wi-muted); font-size: .69rem; font-weight: 500; }
.walkin-room-price { flex: none; color: var(--wi-text); font-size: .82rem; font-weight: 750; text-align: right; }
.walkin-rate-field { max-width: 30rem; }
.walkin-empty { padding: .8rem 1rem; border: 1px solid #fcd34d; border-radius: .55rem; background: #fffbeb; color: #92400e; font-size: .78rem; }
html.dark .walkin-empty { background: #342715; border-color: #785c27; color: #fcd34d; }
.walkin-error { color: #e11d48; font-size: .7rem; }
.walkin-payment-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: end; }
.walkin-paid-option { display: flex; align-items: center; gap: .7rem; min-height: 2.5rem; padding: .5rem .7rem; border: 1px solid var(--wi-border); border-radius: .5rem; background: var(--wi-canvas); cursor: pointer; }
.walkin-paid-option input { flex: none; width: 1rem; height: 1rem; accent-color: #059669; }
.walkin-paid-option strong, .walkin-paid-option small { display: block; }
.walkin-paid-option strong { color: var(--wi-text); font-size: .75rem; }
.walkin-paid-option small { margin-top: .1rem; color: var(--wi-muted); font-size: .68rem; }
.walkin-summary { min-width: 0; position: sticky; top: 5.2rem; }
.walkin-summary-card { overflow: hidden; }
.walkin-summary-header { padding: 1.1rem 1.1rem .9rem; border-bottom: 1px solid var(--wi-border); }
.walkin-summary-header h2 { margin-top: .3rem; font-size: 1.05rem; }
.walkin-summary-body { display: flex; flex-direction: column; gap: .85rem; padding: 1.1rem; }
.walkin-summary-row { display: flex; justify-content: space-between; align-items: baseline; gap: .5rem; font-size: .78rem; }
.walkin-summary-row span { color: var(--wi-muted); }
.walkin-summary-row strong { color: var(--wi-text); font-weight: 650; text-align: right; }
.walkin-total { display: flex; justify-content: space-between; align-items: baseline; gap: .5rem; margin-top: .2rem; padding-top: 1rem; border-top: 1px solid var(--wi-border); }
.walkin-total span { color: var(--wi-text); font-size: .82rem; font-weight: 700; }
.walkin-total strong { color: var(--wi-accent); font-size: 1.45rem; font-weight: 750; letter-spacing: -.035em; white-space: nowrap; }
.walkin-submit { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 2.8rem; padding: .65rem .85rem; border: 1px solid #047857; border-radius: .5rem; background: #047857; color: white; font-size: .82rem; font-weight: 750; cursor: pointer; }
.walkin-submit:hover { background: #065f46; }
.walkin-submit:disabled { opacity: .6; cursor: wait; }
.walkin-submit:focus-visible, .walkin-room-option:focus-within, .walkin-paid-option:focus-within { outline: 2px solid var(--wi-accent); outline-offset: 2px; }
.walkin-summary-note { color: var(--wi-muted); font-size: .7rem; text-align: center; }
.walkin-summary-empty { padding: 1.5rem 1.1rem; color: var(--wi-muted); font-size: .78rem; line-height: 1.5; }
@media (max-width: 1200px) { .walkin-layout { grid-template-columns: minmax(0, 1fr) minmax(16rem, 19rem); } .walkin-stay-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 950px) { .walkin-layout { grid-template-columns: 1fr; } .walkin-summary { position: static; } .walkin-summary-card { display: grid; grid-template-columns: minmax(12rem, .7fr) minmax(0, 1.3fr); } .walkin-summary-header { border-bottom: 0; border-right: 1px solid var(--wi-border); } }
@media (max-width: 640px) { .walkin-hero { align-items: flex-start; flex-direction: column; } .walkin-room-grid, .walkin-guest-grid, .walkin-payment-row { grid-template-columns: 1fr; } .walkin-stay-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .walkin-summary-card { display: block; } .walkin-summary-header { border-right: 0; border-bottom: 1px solid var(--wi-border); } }
/* Hotel settings, including gateway setup, in both panel themes. */
.hotel-settings-page > section > .fi-header { display: none; }
.hotel-settings-page > section { padding-top: .5rem !important; }
.hotel-settings-workspace {
    --hs-surface: #fff;
    --hs-canvas: #f8fafc;
    --hs-border: #e2e8f0;
    --hs-text: #0f172a;
    --hs-muted: #64748b;
    --hs-accent: #047857;
    display: flex;
    flex-direction: column;
    gap: .75rem;
    color: var(--hs-text);
    min-width: 0;
}
html.dark .hotel-settings-workspace {
    --hs-surface: #171d2b;
    --hs-canvas: #111827;
    --hs-border: #30394b;
    --hs-text: #e8edf5;
    --hs-muted: #a3adbd;
    --hs-accent: #34d399;
}
.hotel-settings-workspace > * { min-width: 0; }
.hotel-settings-hero {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.25rem;
    border: 1px solid var(--hs-border);
    border-radius: .75rem;
    background: var(--hs-surface);
}
.hotel-settings-eyebrow { display: block; margin-bottom: .15rem; color: var(--hs-accent); font-size: .65rem; font-weight: 750; letter-spacing: .1em; text-transform: uppercase; }
.hotel-settings-hero h1 { color: var(--hs-text); font-size: 1.45rem; font-weight: 700; letter-spacing: -.035em; line-height: 1.2; }
.hotel-settings-hero p { margin-top: .2rem; color: var(--hs-muted); font-size: .78rem; }
.hotel-settings-save {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: none;
    min-height: 2.45rem;
    padding: .55rem .9rem;
    border: 1px solid #047857;
    border-radius: .5rem;
    background: #047857;
    color: white;
    font-size: .78rem;
    font-weight: 750;
    cursor: pointer;
}
.hotel-settings-save:hover { background: #065f46; }
.hotel-settings-save:disabled { opacity: .6; cursor: wait; }
.hotel-settings-save:focus-visible, .hotel-settings-tab:focus-visible { outline: 2px solid var(--hs-accent); outline-offset: 3px; }
.hotel-settings-tabs {
    display: flex;
    align-items: center;
    gap: .2rem;
    min-height: 3.35rem;
    padding: .3rem;
    overflow-x: auto;
    scrollbar-width: thin;
    border: 1px solid var(--hs-border);
    border-radius: .7rem;
    background: var(--hs-surface);
}
.hotel-settings-tab {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 1 0 auto;
    min-height: 2.55rem;
    padding: .5rem .8rem;
    border-radius: .45rem;
    color: var(--hs-muted);
    font-size: .75rem;
    font-weight: 650;
    white-space: nowrap;
}
.hotel-settings-tab:hover { background: var(--hs-canvas); color: var(--hs-text); }
.hotel-settings-tab.is-active { background: rgba(16,185,129,.11); color: var(--hs-accent); }
.hotel-settings-form { display: flex; flex-direction: column; gap: .75rem; min-width: 0; }
.hotel-settings-panel { min-width: 0; }
.settings-panel { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; min-width: 0; }
.settings-panel[x-data], .settings-panel:has(> div:only-child) { grid-template-columns: minmax(0, 1fr); }
.settings-panel > div,
.settings-panel[x-data] [x-show],
.settings-panel[x-data] > div:first-child,
.settings-panel[x-data] > div:last-child > [x-show] {
    min-width: 0;
    padding: 1rem !important;
    border: 1px solid var(--hs-border) !important;
    border-radius: .7rem !important;
    background: var(--hs-surface) !important;
    box-shadow: none !important;
}
.settings-panel > div { display: flex; flex-direction: column; gap: .9rem; }
.settings-panel[x-data] > div:nth-child(2), .settings-panel[x-data] > div:nth-child(3) { padding: 0 !important; border: 0 !important; background: transparent !important; }
.settings-panel [class*="space-y-"] > * + * { margin-top: .7rem; }
.settings-panel .grid { display: grid !important; grid-template-columns: minmax(0, 1fr); gap: .75rem; }
.settings-panel h3, .settings-panel h4, .settings-panel h5 { color: var(--hs-text) !important; font-family: var(--font-sans) !important; letter-spacing: -.015em !important; text-transform: none !important; }
.settings-panel h3 { display: flex; align-items: center; gap: .5rem; font-size: .92rem !important; font-weight: 700; }
.settings-panel h4 { font-size: .82rem !important; }
.settings-panel h5 { font-size: .82rem !important; }
.settings-panel h3 svg, .settings-panel h4 svg { color: var(--hs-accent) !important; }
.settings-panel p { color: var(--hs-muted) !important; }
.settings-panel label { color: var(--hs-text) !important; font-size: .72rem !important; font-weight: 650 !important; letter-spacing: 0 !important; text-transform: none !important; }
.settings-panel label > span { color: var(--hs-text); }
.settings-panel :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea) {
    display: block;
    width: 100%;
    min-width: 0;
    min-height: 2.45rem;
    padding: .5rem .7rem;
    border: 1px solid var(--hs-border) !important;
    border-radius: .5rem !important;
    background: var(--hs-canvas) !important;
    color: var(--hs-text) !important;
    font-size: .8rem !important;
    outline: none;
    box-shadow: none !important;
}
.settings-panel textarea { min-height: 5.5rem; resize: vertical; }
.settings-panel :is(input, select, textarea, button):focus-visible { outline: 2px solid var(--hs-accent) !important; outline-offset: 2px; }
.settings-panel :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea):focus { border-color: var(--hs-accent) !important; box-shadow: 0 0 0 3px rgba(16,185,129,.12) !important; }
.settings-panel :is(input[type="checkbox"], input[type="radio"]) { accent-color: #059669; }
.settings-panel button { color: var(--hs-text); }
.settings-panel button:hover { color: var(--hs-accent); }
.settings-panel[x-data] > div:first-child { background: var(--hs-canvas) !important; }
.settings-panel[x-data] > div:first-child label { background: var(--hs-surface) !important; border-color: var(--hs-border) !important; }
.settings-panel[x-data] input.peer + div { position: relative; flex: none; width: 2.75rem; height: 1.5rem; border-radius: 999px; background: var(--hs-border) !important; }
.settings-panel[x-data] input.peer + div::after { position: absolute; top: .16rem; left: .16rem; width: 1.18rem; height: 1.18rem; border: 0; border-radius: 50%; background: white; box-shadow: 0 1px 3px rgba(15,23,42,.22); content: ''; transition: transform .18s; }
.settings-panel[x-data] input.peer:checked + div { background: #047857 !important; }
.settings-panel[x-data] input.peer:checked + div::after { transform: translateX(1.24rem); }
.settings-panel[x-data] input.peer:focus-visible + div { outline: 2px solid var(--hs-accent); outline-offset: 2px; }
.settings-panel[x-data] [wire\:click^="setPaymentGateway"] {
    min-height: 10rem;
    padding: 1rem !important;
    border: 1px solid var(--hs-border) !important;
    border-radius: .7rem !important;
    background: var(--hs-surface) !important;
    box-shadow: none !important;
}
.settings-panel[x-data] [wire\:click^="setPaymentGateway"]:hover { border-color: var(--hs-accent) !important; }
.settings-panel[x-data] [wire\:click^="setPaymentGateway"][class~="border-amber-500"] { border-color: var(--hs-accent) !important; background: rgba(16,185,129,.07) !important; }
.settings-panel[x-data] [wire\:click^="setPaymentGateway"] span[class*="bg-amber-500"] { background: #047857 !important; color: #fff !important; }
.settings-panel[x-data] > div:last-child > div:first-child { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.settings-panel[x-data] > div:last-child > div:first-child > div:last-child { display: flex; gap: .2rem; padding: .2rem; border: 1px solid var(--hs-border); border-radius: .5rem; background: var(--hs-canvas); }
.settings-panel[x-data] > div:last-child > div:first-child button { min-height: 2.2rem; padding: .4rem .65rem; border-radius: .4rem; color: var(--hs-text); font-size: .72rem; }
.settings-panel[x-data] > div:last-child > [x-show] { margin-top: .75rem; }
.settings-panel [class*="bg-gradient"] { background-image: none !important; }
.hotel-settings-actions {
    position: sticky;
    bottom: .5rem;
    z-index: 20;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .7rem .9rem;
    border: 1px solid var(--hs-border);
    border-radius: .65rem;
    background: var(--hs-surface);
    box-shadow: 0 6px 24px rgba(15,23,42,.08);
}
.hotel-settings-actions p { color: var(--hs-muted); font-size: .74rem; }
@media (min-width: 768px) { .settings-panel .grid[class*="md:grid-cols-2"], .settings-panel .grid[class*="grid-cols-2"] { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1280px) { .settings-panel .grid[class*="xl:grid-cols-4"] { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 900px) { .hotel-settings-tab { flex: 0 0 auto; } .settings-panel { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 640px) { .hotel-settings-hero { align-items: flex-start; flex-direction: column; } .hotel-settings-actions { align-items: stretch; flex-direction: column; } .hotel-settings-actions .hotel-settings-save { width: 100%; } .settings-panel .grid[class*="grid-cols-2"] { grid-template-columns: minmax(0, 1fr); } }
/* Notification channels and delivery tester. */
.notification-settings-page > section > .fi-header { display: none; }
.notification-settings-page > section { padding-top: .5rem !important; }
.notification-settings-workspace {
    --ns-surface: #fff;
    --ns-canvas: #f8fafc;
    --ns-border: #e2e8f0;
    --ns-text: #0f172a;
    --ns-muted: #64748b;
    --ns-accent: #047857;
    display: flex;
    flex-direction: column;
    gap: .75rem;
    min-width: 0;
    color: var(--ns-text);
}
html.dark .notification-settings-workspace {
    --ns-surface: #171d2b;
    --ns-canvas: #111827;
    --ns-border: #30394b;
    --ns-text: #e8edf5;
    --ns-muted: #a3adbd;
    --ns-accent: #34d399;
}
.notification-settings-workspace > * { min-width: 0; }
.notification-settings-hero { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 1.25rem; border: 1px solid var(--ns-border); border-radius: .75rem; background: var(--ns-surface); }
.notification-settings-eyebrow { display: block; margin-bottom: .15rem; color: var(--ns-accent); font-size: .65rem; font-weight: 750; letter-spacing: .1em; text-transform: uppercase; }
.notification-settings-hero h1 { color: var(--ns-text); font-size: 1.45rem; font-weight: 700; letter-spacing: -.035em; line-height: 1.2; }
.notification-settings-hero p { margin-top: .2rem; color: var(--ns-muted); font-size: .78rem; }
.notification-settings-save, .notification-tab-tester button[wire\:click="sendTestMessage"] { display: inline-flex; align-items: center; justify-content: center; flex: none; min-height: 2.45rem; padding: .55rem .9rem; border: 1px solid #047857; border-radius: .5rem; background: #047857 !important; background-image: none !important; color: #fff !important; font-size: .78rem; font-weight: 750; box-shadow: none !important; cursor: pointer; }
.notification-settings-save:hover, .notification-tab-tester button[wire\:click="sendTestMessage"]:hover { background: #065f46 !important; }
.notification-settings-save:disabled, .notification-tab-tester button[wire\:click="sendTestMessage"]:disabled { opacity: .6; cursor: wait; }
.notification-settings-save:focus-visible, .notification-settings-tab:focus-visible { outline: 2px solid var(--ns-accent); outline-offset: 3px; }
.notification-mode { display: flex; align-items: center; gap: .8rem; padding: .75rem 1rem; border: 1px solid var(--ns-border); border-radius: .7rem; background: var(--ns-surface); }
.notification-mode-icon { display: grid; place-items: center; flex: none; width: 2rem; height: 2rem; border-radius: .5rem; background: rgba(245,158,11,.12); color: #b45309; font-size: .7rem; font-weight: 800; }
.notification-mode.is-live .notification-mode-icon { background: rgba(16,185,129,.12); color: var(--ns-accent); }
.notification-mode-copy { flex: 1 1 auto; min-width: 0; }
.notification-mode-copy strong { color: var(--ns-text); font-size: .8rem; }
.notification-mode-copy p { margin-top: .12rem; color: var(--ns-muted); font-size: .72rem; }
.notification-mode-toggle { display: inline-flex; align-items: center; gap: .45rem; flex: none; padding: .4rem .6rem; border: 1px solid var(--ns-border); border-radius: .45rem; background: var(--ns-canvas); color: var(--ns-text); font-size: .73rem; font-weight: 650; cursor: pointer; }
.notification-mode-toggle input, .notification-tab input[type="checkbox"] { width: 1rem; height: 1rem; accent-color: #059669; }
.notification-settings-tabs { display: flex; align-items: center; gap: .2rem; min-height: 3.35rem; padding: .3rem; overflow-x: auto; scrollbar-width: thin; border: 1px solid var(--ns-border); border-radius: .7rem; background: var(--ns-surface); }
.notification-settings-tab { display: inline-flex; align-items: center; justify-content: center; flex: 1 0 auto; min-height: 2.55rem; padding: .5rem .8rem; border-radius: .45rem; color: var(--ns-muted); font-size: .75rem; font-weight: 650; white-space: nowrap; }
.notification-settings-tab:hover { background: var(--ns-canvas); color: var(--ns-text); }
.notification-settings-tab.is-active { background: rgba(16,185,129,.11); color: var(--ns-accent); }
.notification-settings-panel { min-width: 0; }
.notification-tab { min-width: 0; }
.notification-tab-channels, .notification-tab-whatsapp, .notification-tab-sms > .grid { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
.notification-tab-channels > div, .notification-tab-whatsapp > div, .notification-tab-sms > .grid > div, .notification-tab-tester { min-width: 0; padding: 1rem !important; border: 1px solid var(--ns-border) !important; border-radius: .7rem !important; background: var(--ns-surface) !important; box-shadow: none !important; }
.notification-tab-channels > div, .notification-tab-whatsapp > div, .notification-tab-sms > .grid > div { display: flex; flex-direction: column; gap: .9rem; }
.notification-tab :is(h3,h4) { color: var(--ns-text) !important; font-family: var(--font-sans) !important; letter-spacing: -.015em; }
.notification-tab h3 { font-size: .92rem !important; font-weight: 700; }
.notification-tab p { color: var(--ns-muted) !important; }
.notification-tab label { color: var(--ns-text) !important; font-size: .72rem !important; font-weight: 650 !important; letter-spacing: 0 !important; text-transform: none !important; }
.notification-tab label > span { color: var(--ns-text); }
.notification-tab :is(input:not([type="checkbox"]), select, textarea) { display: block; width: 100%; min-width: 0; min-height: 2.45rem; padding: .5rem .7rem; border: 1px solid var(--ns-border) !important; border-radius: .5rem !important; background: var(--ns-canvas) !important; color: var(--ns-text) !important; font-size: .8rem !important; outline: none; box-shadow: none !important; }
.notification-tab :is(input, select, textarea):focus { border-color: var(--ns-accent) !important; box-shadow: 0 0 0 3px rgba(16,185,129,.12) !important; }
.notification-tab :is(input, select, textarea, button):focus-visible { outline: 2px solid var(--ns-accent) !important; outline-offset: 2px; }
.notification-tab input::placeholder { color: var(--ns-muted); opacity: .75; }
.notification-tab code { display: block; overflow-wrap: anywhere; color: var(--ns-accent) !important; font-size: .75rem; }
.notification-tab [class*="bg-gray-50"], html.dark .notification-tab [class*="dark:bg-slate-950"] { background: var(--ns-canvas) !important; border-color: var(--ns-border) !important; }
.notification-tab-tester { display: grid !important; grid-template-columns: minmax(14rem, .75fr) minmax(0, 1.25fr); align-items: center; gap: 1.5rem; width: 100%; max-width: none !important; margin: 0 !important; }
.notification-tab-tester > div:first-child { text-align: left; }
.notification-tab-tester > div:first-child > div:first-child { margin: 0 0 .75rem; }
.notification-tab-tester > div:last-child { display: flex; flex-direction: column; gap: .75rem; min-width: 0; }
.notification-tab-tester > div:last-child > div { min-width: 0; }
.notification-tab-tester button[wire\:click="sendTestMessage"] { display: flex; width: 100%; gap: .45rem; }
.notification-settings-actions { position: sticky; bottom: .5rem; z-index: 20; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .7rem .9rem; border: 1px solid var(--ns-border); border-radius: .65rem; background: var(--ns-surface); box-shadow: 0 6px 24px rgba(15,23,42,.08); }
.notification-settings-actions p { color: var(--ns-muted); font-size: .74rem; }
@media (max-width: 900px) { .notification-settings-tab { flex: 0 0 auto; } .notification-tab-tester { grid-template-columns: 1fr; } }
@media (max-width: 700px) { .notification-settings-hero { align-items: flex-start; flex-direction: column; } .notification-mode { align-items: flex-start; flex-wrap: wrap; } .notification-mode-toggle { margin-left: 2.8rem; } .notification-tab-channels, .notification-tab-whatsapp, .notification-tab-sms > .grid { grid-template-columns: minmax(0, 1fr); } .notification-settings-actions { align-items: stretch; flex-direction: column; } .notification-settings-actions .notification-settings-save { width: 100%; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; } }
/* Reports workspace. */
.reports-page > section > .fi-header { display: none; }
.reports-page > section { padding-top: .5rem !important; }
.reports-workspace {
    --rp-surface: #fff;
    --rp-canvas: #f8fafc;
    --rp-border: #e2e8f0;
    --rp-text: #0f172a;
    --rp-muted: #64748b;
    --rp-accent: #047857;
    display: flex;
    flex-direction: column;
    gap: .75rem;
    min-width: 0;
    color: var(--rp-text);
}
html.dark .reports-workspace {
    --rp-surface: #171d2b;
    --rp-canvas: #111827;
    --rp-border: #30394b;
    --rp-text: #e8edf5;
    --rp-muted: #a3adbd;
    --rp-accent: #34d399;
}
.reports-workspace > * { min-width: 0; }
.reports-hero, .reports-period, .reports-metric, .reports-performance { border: 1px solid var(--rp-border); border-radius: .7rem; background: var(--rp-surface); }
.reports-hero { display: flex; align-items: center; justify-content: space-between; gap: 1.25rem; padding: 1rem 1.25rem; }
.reports-eyebrow { display: block; margin-bottom: .15rem; color: var(--rp-accent); font-size: .65rem; font-weight: 750; letter-spacing: .1em; text-transform: uppercase; }
.reports-hero h1 { color: var(--rp-text); font-size: 1.45rem; font-weight: 700; letter-spacing: -.035em; line-height: 1.2; }
.reports-hero p, .reports-section-intro p, .reports-performance-heading p { margin-top: .2rem; color: var(--rp-muted); font-size: .78rem; }
.reports-export { display: inline-flex; align-items: center; justify-content: center; gap: .45rem; flex: none; min-height: 2.45rem; padding: .55rem .9rem; border: 1px solid #047857; border-radius: .5rem; background: #047857; color: #fff; font-size: .78rem; font-weight: 750; cursor: pointer; }
.reports-export:hover { background: #065f46; }
.reports-export:disabled { opacity: .6; cursor: wait; }
.reports-export svg { width: 1rem; height: 1rem; }
.reports-export:focus-visible, .reports-field input:focus-visible { outline: 2px solid var(--rp-accent); outline-offset: 2px; }
.reports-period { display: flex; align-items: end; justify-content: space-between; gap: 1.25rem; padding: .9rem 1.25rem; }
.reports-section-intro h2, .reports-performance-heading h2 { color: var(--rp-text); font-size: .92rem; font-weight: 700; letter-spacing: -.015em; }
.reports-date-fields { display: flex; align-items: end; gap: .6rem; }
.reports-field { display: flex; flex-direction: column; gap: .35rem; min-width: 0; }
.reports-field label { color: var(--rp-muted); font-size: .68rem; font-weight: 700; }
.reports-field input { width: 10.5rem; max-width: 100%; min-height: 2.3rem; padding: .4rem .65rem; border: 1px solid var(--rp-border); border-radius: .45rem; background: var(--rp-canvas); color: var(--rp-text); font-size: .78rem; color-scheme: light; }
html.dark .reports-field input { color-scheme: dark; }
.reports-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; }
.reports-metric { display: flex; flex-direction: column; align-items: flex-start; gap: .65rem; min-width: 0; min-height: 8.5rem; padding: 1rem 1.15rem; }
.reports-metric-primary { border-color: color-mix(in srgb, var(--rp-accent) 35%, var(--rp-border)); }
.reports-metric-label { color: var(--rp-muted); font-size: .72rem; font-weight: 650; }
.reports-metric strong { max-width: 100%; overflow-wrap: anywhere; color: var(--rp-text); font-size: clamp(1.3rem, 2vw, 1.8rem); font-weight: 750; letter-spacing: -.04em; line-height: 1.1; }
.reports-metric-primary strong { color: var(--rp-accent); }
.reports-metric-detail { margin-top: auto; color: var(--rp-muted); font-size: .7rem; }
.reports-performance { overflow: hidden; }
.reports-performance-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .9rem 1.15rem; border-bottom: 1px solid var(--rp-border); }
.reports-performance-count { flex: none; padding: .3rem .55rem; border-radius: .35rem; background: var(--rp-canvas); color: var(--rp-muted); font-size: .68rem; font-weight: 700; }
.reports-table-scroll { width: 100%; overflow-x: auto; }
.reports-table { width: 100%; min-width: 660px; border-collapse: collapse; text-align: left; font-size: .78rem; }
.reports-table th, .reports-table td { padding: .8rem 1.15rem; border-bottom: 1px solid var(--rp-border); }
.reports-table thead { background: var(--rp-canvas); }
.reports-table thead th { color: var(--rp-muted); font-size: .65rem; font-weight: 750; letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; }
.reports-table tbody th { color: var(--rp-text); font-weight: 700; }
.reports-table tbody td { color: var(--rp-muted); font-variant-numeric: tabular-nums; }
.reports-table tbody tr:last-child th, .reports-table tbody tr:last-child td { border-bottom: 0; }
.reports-table tbody tr:hover { background: var(--rp-canvas); }
.reports-table th:last-child, .reports-table td:last-child { text-align: right; }
.reports-table .reports-revenue { color: var(--rp-text); font-weight: 700; }
.reports-table .reports-empty { padding: 2rem 1rem; color: var(--rp-muted); text-align: center; }
@media (max-width: 1100px) { .reports-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 700px) { .reports-hero, .reports-period { align-items: stretch; flex-direction: column; } .reports-export { width: 100%; } .reports-date-fields { width: 100%; } .reports-field { flex: 1 1 0; } .reports-field input { width: 100%; } }
@media (max-width: 520px) { .reports-metrics { grid-template-columns: minmax(0, 1fr); } .reports-metric { min-height: 7rem; } .reports-performance-heading { align-items: flex-start; flex-direction: column; } }
/* Hotel subscription overview */
.subscription-workspace{display:grid;gap:24px;max-width:1200px;margin:0 auto;color:#17352e}
.subscription-hero{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:42px 46px;border-radius:22px;background:linear-gradient(115deg,#123c32,#205c4e);color:#fff}
.subscription-eyebrow{font-size:10px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:#a88254}
.subscription-hero .subscription-eyebrow{color:#d2b98c}
.subscription-hero h1{margin:10px 0;font:600 clamp(26px,3vw,38px)/1.2 Georgia,serif}
.subscription-hero p{margin:0;color:#d5e6de;font-size:14px}
.subscription-status{padding:10px 16px;border-radius:100px;font-size:11px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;white-space:nowrap}
.subscription-status-active{background:#d5f4de;color:#126834}.subscription-status-inactive{background:#fff0d7;color:#8a5a19}
.subscription-summary{display:grid;grid-template-columns:1fr auto;gap:30px;align-items:center;padding:35px 40px;border:1px solid #e4ece7;border-radius:18px;background:#fff}
.subscription-plan-name h2{margin:12px 0 6px;font:600 34px/1.2 Georgia,serif}.subscription-plan-name p{margin:0;color:#6e8176;font-size:13px}
.subscription-plan-price{display:flex;flex-direction:column;align-items:flex-end;gap:5px}.subscription-plan-price strong{font:600 28px Georgia,serif}.subscription-plan-price>span:last-child{color:#6e8176;font-size:12px;text-transform:capitalize}
.subscription-validity{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.subscription-validity article{min-height:150px;padding:25px;border:1px solid #e4ece7;border-radius:16px;background:#fff}.subscription-validity strong{display:block;margin:13px 0 8px;font:600 22px Georgia,serif}.subscription-validity p{margin:0;color:#72857a;font-size:12px;line-height:1.6}
.subscription-features{padding:32px 38px;border:1px solid #e4ece7;border-radius:18px;background:#fff}.subscription-section-heading{display:flex;justify-content:space-between;align-items:end;gap:15px;margin-bottom:26px;padding-bottom:23px;border-bottom:1px solid #e4ece7}.subscription-section-heading h2{margin:8px 0 0;font:600 27px Georgia,serif}.subscription-section-heading>span{color:#72857a;font-size:12px}
.subscription-feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.subscription-feature{display:flex;align-items:center;gap:13px;min-height:68px;padding:15px;border-radius:12px;background:#f4f8f5}.subscription-feature span{display:grid;place-items:center;flex:none;width:28px;height:28px;border-radius:50%;background:#d9f0df;color:#176d3c;font-size:14px}.subscription-feature strong{font-size:13px;font-weight:700}
.subscription-empty{padding:50px;border:1px solid #e4ece7;border-radius:18px;background:#fff}.subscription-empty h2{margin:0 0 10px;font:600 29px Georgia,serif}.subscription-empty p{color:#72857a}
.subscription-help{padding:8px 4px}.subscription-help span{font-weight:700;font-size:13px}.subscription-help p{margin:5px 0;color:#72857a;font-size:12px}
.dark .subscription-workspace{color:#e8f1eb}.dark .subscription-summary,.dark .subscription-validity article,.dark .subscription-features,.dark .subscription-empty{border-color:#315247;background:#1d352e}.dark .subscription-feature{background:#29483a}.dark .subscription-feature strong{color:#e8f1eb}
@media(max-width:850px){.subscription-feature-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:650px){.subscription-hero{flex-direction:column;align-items:flex-start;padding:30px}.subscription-summary{grid-template-columns:1fr;padding:30px}.subscription-plan-price{align-items:flex-start}.subscription-validity{grid-template-columns:1fr}.subscription-features{padding:28px}.subscription-feature-grid{grid-template-columns:1fr}}
/* Hotel search and website insights */
.seo-workspace{display:grid;gap:22px;max-width:1280px;margin:auto;color:#17352e}
.seo-hero{display:flex;align-items:end;justify-content:space-between;gap:20px;padding:40px 44px;border-radius:20px;background:linear-gradient(120deg,#123c32,#276654);color:#fff}
.seo-hero .subscription-eyebrow{color:#d5b88b}.seo-hero h1{margin:10px 0;font:600 clamp(26px,3vw,38px)/1.15 Georgia,serif}.seo-hero p{margin:0;color:#d6e8df;font-size:14px}
.seo-live{display:flex;align-items:center;gap:9px;padding:10px 14px;border:1px solid #ffffff50;border-radius:50px;color:#e2f5e9;font-size:11px;white-space:nowrap}.seo-live i{width:7px;height:7px;border-radius:50%;background:#8fe7ad;box-shadow:0 0 0 4px #8fe7ad30}
.seo-live-section{display:grid;gap:18px}.seo-section-heading{display:flex;align-items:end;justify-content:space-between;gap:12px}.seo-section-heading h2{margin:6px 0 0;font:600 26px/1.2 Georgia,serif}.seo-section-heading small,.seo-note{color:#6e8176;font-size:12px;line-height:1.7}
.seo-stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.seo-stat-grid article,.seo-card{border:1px solid #e4ece7;border-radius:16px;background:#fff}.seo-stat-grid article{display:flex;flex-direction:column;gap:8px;min-height:140px;padding:23px}.seo-stat-grid article>span{color:#789085;font-size:10px;font-weight:800;letter-spacing:.12em}.seo-stat-grid article strong{font:600 32px Georgia,serif}.seo-stat-grid article small{margin-top:auto;color:#789085;font-size:11px}
.seo-split{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.seo-card{padding:28px}.seo-card h3{margin:0 0 18px;font:600 19px Georgia,serif}.seo-card>.seo-section-heading{margin-bottom:20px}.seo-list{display:grid;gap:0}.seo-list>div{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:11px 0;border-top:1px solid #ecf1ed;font-size:13px}.seo-list span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.seo-list strong,.seo-list small{flex:none;color:#37735b;font-size:12px}.seo-list p{color:#789085;font-size:13px}.seo-search-stats{margin:22px 0}.seo-note{margin:12px 0 0}
.seo-week{display:grid;gap:13px}.seo-week>div{display:grid;grid-template-columns:34px 1fr 26px;align-items:center;gap:12px;font-size:11px;color:#789085}.seo-week i{height:8px;overflow:hidden;border-radius:20px;background:#edf3ee}.seo-week b{display:block;height:100%;border-radius:20px;background:#2f8061}.seo-week strong{text-align:right;color:#315947}
.seo-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.seo-form label{display:flex;flex-direction:column;gap:7px;font-size:12px;font-weight:700}.seo-form input,.seo-form textarea{width:100%;padding:12px 14px;border:1px solid #d8e4dc;border-radius:9px;background:#fafcf9;color:#17352e;font:400 13px Inter,sans-serif;outline:none}.seo-form input:focus,.seo-form textarea:focus{border-color:#28745a;box-shadow:0 0 0 3px #28745a1f}.seo-form small{color:#819187;font-size:11px;font-weight:400}.seo-form em{color:#bd3b3b;font-size:11px;font-style:normal}.seo-form-action{grid-column:1/-1;display:flex;justify-content:flex-end}.seo-form button{padding:12px 19px;border:0;border-radius:9px;background:#176044;color:#fff;font-size:12px;font-weight:700;cursor:pointer}.seo-form button:disabled{opacity:.6}
.dark .seo-workspace{color:#e8f1eb}.dark .seo-stat-grid article,.dark .seo-card{border-color:#315247;background:#1d352e}.dark .seo-form input,.dark .seo-form textarea{border-color:#315247;background:#183128;color:#e8f1eb}.dark .seo-list>div{border-color:#315247}
@media(max-width:900px){.seo-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:650px){.seo-hero{align-items:flex-start;flex-direction:column;padding:28px}.seo-section-heading{align-items:flex-start;flex-direction:column}.seo-split,.seo-form{grid-template-columns:1fr}.seo-card{padding:22px}}@media(max-width:450px){.seo-stat-grid{grid-template-columns:1fr}}
/* Match subscription and SEO pages to the admin panel layout and theme. */
.subscription-workspace,.seo-workspace{
    --insight-surface:#fff;--insight-canvas:#f8fafc;--insight-border:#e2e8f0;
    --insight-text:#0f172a;--insight-muted:#64748b;--insight-accent:#047857;
    width:100%;max-width:none;margin:0;gap:1rem;color:var(--insight-text);
}
html.dark .subscription-workspace,html.dark .seo-workspace{
    --insight-surface:#171d2b;--insight-canvas:#111827;--insight-border:#30394b;
    --insight-text:#e8edf5;--insight-muted:#a3adbd;--insight-accent:#34d399;
    color:var(--insight-text);
}
html.dark .subscription-hero,html.dark .seo-hero,html.dark .subscription-summary,html.dark .subscription-validity article,html.dark .subscription-features,html.dark .subscription-empty,html.dark .seo-stat-grid article,html.dark .seo-card{
    border-color:var(--insight-border);background:var(--insight-surface);color:var(--insight-text);
}
html.dark .seo-list>div{border-color:var(--insight-border)}
.subscription-workspace>*,.seo-workspace>*,.seo-live-section>*,.seo-split>*,.seo-stat-grid>*{min-width:0}
.subscription-hero,.seo-hero,.subscription-summary,.subscription-validity article,.subscription-features,.subscription-empty,.seo-stat-grid article,.seo-card{
    border:1px solid var(--insight-border);border-radius:.7rem;background:var(--insight-surface);color:var(--insight-text);box-shadow:none;
}
.subscription-hero,.seo-hero{align-items:center;padding:1.25rem 1.5rem}
.subscription-hero .subscription-eyebrow,.seo-hero .subscription-eyebrow,.subscription-eyebrow{color:var(--insight-accent)}
.subscription-hero h1,.seo-hero h1{margin:.35rem 0;color:var(--insight-text);font:700 clamp(1.35rem,2vw,1.75rem)/1.2 Inter,sans-serif;letter-spacing:-.035em}
.subscription-hero p,.seo-hero p{color:var(--insight-muted);font-size:.8rem;line-height:1.55}
.subscription-status{border:1px solid var(--insight-border);padding:.55rem .8rem;font-size:.68rem}
.subscription-status-active{border-color:#34d39955;background:#ecfdf5;color:#047857}
.subscription-status-inactive{border-color:#f59e0b55;background:#fffbeb;color:#92400e}
html.dark .subscription-status-active{background:#064e3b;color:#a7f3d0}
html.dark .subscription-status-inactive{background:#78350f;color:#fef3c7}
.subscription-summary{grid-template-columns:minmax(0,1fr) auto;padding:1.35rem 1.5rem;gap:1.25rem}
.subscription-plan-name h2{margin:.45rem 0 .2rem;color:var(--insight-text);font:700 1.55rem/1.2 Inter,sans-serif;letter-spacing:-.03em}
.subscription-plan-name p,.subscription-plan-price>span:last-child{color:var(--insight-muted)}
.subscription-plan-price strong{color:var(--insight-text);font:700 1.5rem/1.2 Inter,sans-serif}
.subscription-validity{gap:.75rem}
.subscription-validity article{min-height:7.5rem;padding:1.1rem 1.25rem}
.subscription-validity strong{margin:.5rem 0 .25rem;color:var(--insight-text);font:700 1rem/1.3 Inter,sans-serif}
.subscription-validity p{color:var(--insight-muted);font-size:.73rem}
.subscription-features{padding:1.4rem 1.5rem}
.subscription-section-heading{align-items:center;margin-bottom:1rem;padding-bottom:1rem;border-color:var(--insight-border)}
.subscription-section-heading h2,.seo-section-heading h2{margin:.3rem 0 0;color:var(--insight-text);font:700 1rem/1.3 Inter,sans-serif;letter-spacing:-.015em}
.subscription-section-heading>span,.seo-section-heading small{color:var(--insight-muted)}
.subscription-feature-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:.7rem}
.subscription-feature{min-height:3.5rem;padding:.7rem .85rem;background:var(--insight-canvas)}
.subscription-feature span{width:1.5rem;height:1.5rem;background:#d1fae5;color:#047857}
.subscription-feature strong{color:var(--insight-text);font-size:.75rem}
html.dark .subscription-feature{background:var(--insight-canvas)}
html.dark .subscription-feature span{background:#064e3b;color:#a7f3d0}
.subscription-empty{padding:1.5rem}.subscription-empty h2{color:var(--insight-text);font:700 1.2rem Inter,sans-serif}.subscription-empty p,.subscription-help p{color:var(--insight-muted)}
.subscription-help{padding:.25rem .35rem;color:var(--insight-text)}
.seo-live-section{gap:.75rem}.seo-hero .seo-live{border-color:var(--insight-border);background:var(--insight-canvas);color:var(--insight-muted)}
.seo-hero .seo-live i{background:#10b981;box-shadow:0 0 0 4px #10b98120}
.seo-stat-grid{gap:.75rem}.seo-stat-grid article{min-height:7.5rem;padding:1rem 1.15rem}
.seo-stat-grid article>span{color:var(--insight-muted)}
.seo-stat-grid article strong{color:var(--insight-text);font:700 clamp(1.4rem,2vw,1.85rem)/1.2 Inter,sans-serif;letter-spacing:-.035em}
.seo-stat-grid article small,.seo-note{color:var(--insight-muted)}
.seo-split{gap:.75rem}.seo-card{padding:1.25rem 1.4rem}.seo-card h3{color:var(--insight-text);font:700 .9rem/1.3 Inter,sans-serif}
.seo-card>.seo-section-heading{padding-bottom:1rem;border-bottom:1px solid var(--insight-border)}
.seo-list>div{border-color:var(--insight-border)}.seo-list span{color:var(--insight-text)}
.seo-list strong,.seo-list small,.seo-week strong{color:var(--insight-accent)}
.seo-list p,.seo-week>div{color:var(--insight-muted)}
.seo-week i{background:var(--insight-canvas)}.seo-week b{background:var(--insight-accent)}
.seo-form{gap:1rem 1.25rem}.seo-form label{color:var(--insight-text)}
.seo-form input,.seo-form textarea{border-color:var(--insight-border);background:var(--insight-canvas);color:var(--insight-text);color-scheme:light}
html.dark .seo-form input,html.dark .seo-form textarea{border-color:var(--insight-border);background:var(--insight-canvas);color:var(--insight-text);color-scheme:dark}
.seo-form input::placeholder,.seo-form textarea::placeholder{color:var(--insight-muted);opacity:.8}
.seo-form small{color:var(--insight-muted)}.seo-form button{background:#047857}
.seo-form button:hover{background:#065f46}.seo-form button:focus-visible{outline:2px solid var(--insight-accent);outline-offset:2px}
html.dark .seo-form button{background:#059669;color:#fff}
@media(max-width:1100px){.subscription-feature-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:800px){.subscription-feature-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.subscription-validity{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){.subscription-hero,.seo-hero{align-items:flex-start;padding:1.15rem;gap:1rem}.subscription-summary{padding:1.15rem}.subscription-features,.seo-card{padding:1.15rem}.subscription-validity{grid-template-columns:1fr}.seo-form-action button{width:100%}}
@media(max-width:450px){.subscription-feature-grid{grid-template-columns:1fr}.subscription-status{white-space:normal}}