/* ==========================================================================
   Hotelu — Premium Travel Palette
   ─────────────────────────────────────────────────────────────────────────
   Navy:    #1B2B5E  deep authority / trust
   Coral:   #E8472B  warm CTA / urgency / excitement
   Amber:   #F5A623  stars / deals / highlights
   Ivory:   #FDFCF8  warm page canvas
   White:   #FFFFFF  card surfaces
   Ink:     #1A1F36  body text
   Muted:   #6B7280  secondary text
   Line:    #E8EAF0  borders
   ========================================================================== */

:root {
    /* ── Core brand ────────────────────────────────────────────────────── */
    --hp-900: #0F1B3D;   /* darkest navy  – deep UI elements  */
    --hp-800: #1B2B5E;   /* primary navy  – sidebar, headings */
    --hp-700: #243580;   /* mid navy      – active states     */
    --hp-600: #2D3FA3;   /* bright navy   – links             */
    --hp-100: #E8ECFA;   /* navy tint     – soft badges       */
    --hp-50:  #F2F4FD;   /* near-white    – hover bg          */

    --hc-600: #C73A1E;   /* coral deep    – pressed CTA       */
    --hc-500: #E8472B;   /* coral primary – CTA buttons       */
    --hc-400: #EF6B52;   /* coral light   – hover             */
    --hc-100: #FDECEA;   /* coral tint    – soft bg           */
    --hc-50:  #FEF6F5;   /* coral whisper                     */

    --ha-500: #F5A623;   /* amber         – stars, deals      */
    --ha-100: #FEF3C7;   /* amber tint                        */

    --hw-ivory:  #FDFCF8;  /* page canvas                    */
    --hw-white:  #FFFFFF;
    --hw-ink:    #1A1F36;  /* body text                       */
    --hw-muted:  #6B7280;  /* secondary text                  */
    --hw-line:   #E8EAF0;  /* borders                         */
    --hw-amber:  #F5A623;  /* star color                      */

    /* ── Bootstrap overrides ──────────────────────────────────────────── */
    --bs-primary:           #E8472B;
    --bs-primary-rgb:       232, 71, 43;
    --bs-body-color:        #1A1F36;
    --bs-body-bg:           #FDFCF8;
    --bs-body-font-family:  "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;
    --bs-border-color:      #E8EAF0;
    --bs-link-color:        #1B2B5E;
    --bs-link-hover-color:  #E8472B;
    --bs-border-radius:     0.75rem;
    --bs-border-radius-lg:  1rem;
    --bs-border-radius-xl:  1.25rem;
    --bs-box-shadow-sm:     0 2px 12px rgba(27, 43, 94, .08);
}

/* ─────────────────────────────────────────────────────────────────────────
   Base
   ───────────────────────────────────────────────────────────────────────── */
body {
    background-color: var(--hw-ivory);
    color: var(--hw-ink);
    font-size: 0.95rem;
    -webkit-font-smoothing: antialiased;
}

h1,h2,h3,h4,h5,h6,.fw-black {
    color: var(--hp-800);
    font-weight: 700;
    letter-spacing: -.015em;
}

a { text-decoration: none; transition: color .15s; }

.section    { padding: 4rem 0; }
.section-sm { padding: 2.5rem 0; }

.bg-canvas      { background-color: var(--hw-ivory); }
.bg-navy        { background-color: var(--hp-800); }
.bg-navy-dark   { background-color: var(--hp-900); }
.bg-coral       { background-color: var(--hc-500); }
.bg-teal        { background-color: var(--hp-800); }   /* alias */
.bg-teal-dark   { background-color: var(--hp-900); }   /* alias */

.text-navy      { color: var(--hp-800) !important; }
.text-coral     { color: var(--hc-500) !important; }
.text-teal      { color: var(--hp-800) !important; }   /* alias */
.text-muted-2   { color: var(--hw-muted) !important; }

.section-title    { font-size: 1.6rem; margin-bottom: .25rem; }
.section-subtitle { color: var(--hw-muted); margin-bottom: 0; }

.divider-teal, .divider-navy {
    width: 48px; height: 4px; border-radius: 999px;
    background: linear-gradient(90deg, var(--hc-500), var(--ha-500));
}

/* ─────────────────────────────────────────────────────────────────────────
   Buttons
   ───────────────────────────────────────────────────────────────────────── */
.btn {
    --bs-btn-font-weight: 600;
    --bs-btn-padding-y:   .55rem;
    --bs-btn-padding-x:   1.15rem;
    border-radius: .6rem;
    transition: all .18s ease;
    letter-spacing: .01em;
}

/* PRIMARY — coral CTA */
.btn-primary {
    --bs-btn-bg:                  var(--hc-500);
    --bs-btn-border-color:        var(--hc-500);
    --bs-btn-color:               #fff;
    --bs-btn-hover-bg:            var(--hc-600);
    --bs-btn-hover-border-color:  var(--hc-600);
    --bs-btn-hover-color:         #fff;
    --bs-btn-active-bg:           var(--hc-600);
    --bs-btn-disabled-bg:         #f0a898;
    --bs-btn-disabled-border-color:#f0a898;
    box-shadow: 0 4px 16px rgba(232,71,43,.30);
}
.btn-primary:hover { transform: translateY(-1px); box-shadow: 0 6px 22px rgba(232,71,43,.40); }

/* NAVY — secondary solid */
.btn-navy, .btn-teal, .btn-violet {
    --bs-btn-color:               #fff;
    --bs-btn-bg:                  var(--hp-800);
    --bs-btn-border-color:        var(--hp-800);
    --bs-btn-hover-color:         #fff;
    --bs-btn-hover-bg:            var(--hp-900);
    --bs-btn-hover-border-color:  var(--hp-900);
    --bs-btn-active-color:        #fff;
    --bs-btn-active-bg:           var(--hp-900);
    box-shadow: 0 4px 14px rgba(27,43,94,.22);
}
.btn-navy:hover,.btn-teal:hover,.btn-violet:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(27,43,94,.30);
}

/* OUTLINE NAVY */
.btn-outline-navy, .btn-outline-teal, .btn-outline-violet {
    --bs-btn-color:               var(--hp-800);
    --bs-btn-border-color:        var(--hp-800);
    --bs-btn-hover-color:         #fff;
    --bs-btn-hover-bg:            var(--hp-800);
    --bs-btn-hover-border-color:  var(--hp-800);
}

/* CORAL alias */
.btn-coral { @extend .btn-primary; }

/* SOFT */
.btn-soft {
    background: var(--hp-50);
    color: var(--hp-800);
    border: 1px solid transparent;
}
.btn-soft:hover { background: var(--hp-800); color: #fff; }

.btn-lg { --bs-btn-padding-y:.8rem; --bs-btn-padding-x:1.6rem; --bs-btn-font-size:1rem; }
.btn-xs { --bs-btn-padding-y:.2rem; --bs-btn-padding-x:.5rem; --bs-btn-font-size:.78rem; line-height:1.4; }

/* ─────────────────────────────────────────────────────────────────────────
   Navbar / Header
   ───────────────────────────────────────────────────────────────────────── */
.site-header {
    z-index: 1030;
    background: #fff;
    border-bottom: 1px solid var(--hw-line);
}
.site-header.is-sticky {
    position: sticky; top: 0;
    box-shadow: 0 4px 20px rgba(27,43,94,.10);
}

/* Utility bar — deep navy strip */
.site-header .utility-bar {
    background: var(--hp-900);
    font-size: .82rem;
    color: rgba(255,255,255,.72);
}
.site-header .utility-bar a { color: rgba(255,255,255,.72); transition: color .15s; }
.site-header .utility-bar a:hover { color: var(--ha-500); }

.navbar-brand {
    display: flex; align-items: center; gap: .6rem;
    font-weight: 800; font-size: 1.3rem;
    color: var(--hp-800);
}

.brand-mark {
    width: 38px; height: 38px; border-radius: 11px;
    background: linear-gradient(135deg, var(--hp-800), var(--hc-500));
    color: #fff;
    display: grid; place-items: center;
    font-size: 1.15rem;
    box-shadow: 0 6px 16px rgba(27,43,94,.28);
    flex-shrink: 0;
}
.brand-mark-lg { width: 52px; height: 52px; border-radius: 15px; font-size: 1.5rem; }

.site-header .nav-link {
    color: var(--hp-800);
    font-weight: 600;
    padding: .5rem .85rem !important;
    border-radius: .5rem;
    transition: color .15s, background .15s;
}
.site-header .nav-link:hover,
.site-header .nav-link.active {
    color: var(--hc-500);
    background: var(--hc-50);
}

.avatar-circle {
    width: 36px; height: 36px; border-radius: 50%;
    background: linear-gradient(135deg, var(--hp-800), var(--hp-600));
    color: #fff;
    display: grid; place-items: center;
    font-size: .8rem; font-weight: 700; flex-shrink: 0;
}

@media (max-width: 991.98px) {
    .navbar-collapse {
        background: #fff;
        border-top: 1px solid var(--hw-line);
        border-radius: 0 0 1rem 1rem;
        padding: .75rem 1rem 1rem;
        margin-top: .25rem;
        box-shadow: 0 12px 30px rgba(27,43,94,.12);
    }
    .site-header .nav-link { padding: .6rem .75rem !important; }
    .navbar .d-flex { margin-top:.75rem; padding-top:.75rem; border-top:1px solid var(--hw-line); }
}

/* ─────────────────────────────────────────────────────────────────────────
   Hero
   ───────────────────────────────────────────────────────────────────────── */
.hero {
    position: relative;
    min-height: 560px;
    display: flex; align-items: center;
    color: #fff;
    background-color: var(--hp-900);
    background-position: center; background-size: cover;
}
.hero-lg { min-height: 640px; }

.hero::after {
    content: ""; position: absolute; inset: 0;
    background: linear-gradient(120deg,
        rgba(15,27,61,.90) 0%,
        rgba(27,43,94,.60) 55%,
        rgba(232,71,43,.18) 100%);
}
.hero > .container { position: relative; z-index: 2; }

.hero h1 { color:#fff; font-size:clamp(2rem,4.5vw,3.2rem); line-height:1.12; }
.hero p  { color:rgba(255,255,255,.88); font-size:1.06rem; }

.hero-badge {
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.28);
    border-radius: 999px;
    padding: .35rem .9rem;
    font-size: .8rem; font-weight: 600;
}

/* Search panel */
.search-panel {
    background: #fff;
    border-radius: var(--bs-border-radius-xl);
    box-shadow: 0 24px 64px rgba(15,27,61,.28);
    padding: 1.15rem;
}
.search-panel .form-label {
    font-size: .74rem; text-transform: uppercase;
    letter-spacing: .05em; font-weight: 700;
    color: var(--hw-muted); margin-bottom: .3rem;
}
.search-panel .form-control,
.search-panel .form-select {
    border: 1px solid var(--hw-line);
    background-color: var(--hp-50);
    font-weight: 500;
}
.search-panel .form-control:focus,
.search-panel .form-select:focus {
    border-color: var(--hc-500);
    box-shadow: 0 0 0 .2rem rgba(232,71,43,.15);
    background-color: #fff;
}
.search-panel-compact { padding: .75rem; }

@media (max-width:575.98px) {
    .search-panel { padding:.75rem; border-radius:var(--bs-border-radius-lg); }
}

/* ─────────────────────────────────────────────────────────────────────────
   Cards
   ───────────────────────────────────────────────────────────────────────── */
.card {
    border: 1px solid var(--hw-line);
    border-radius: var(--bs-border-radius-lg);
    box-shadow: var(--bs-box-shadow-sm);
    background: #fff;
}
.card-hover { transition: transform .2s ease, box-shadow .2s ease; }
.card-hover:hover {
    transform: translateY(-5px);
    box-shadow: 0 18px 44px rgba(27,43,94,.14);
}

/* Hotel card */
.hotel-card .hotel-card-media {
    position: relative; aspect-ratio: 4/3; overflow: hidden;
    border-radius: var(--bs-border-radius-lg) var(--bs-border-radius-lg) 0 0;
    background: var(--hp-50);
}
.hotel-card .hotel-card-media img { width:100%; height:100%; object-fit:cover; transition:transform .35s; }
.hotel-card:hover .hotel-card-media img { transform: scale(1.06); }

.hotel-card .hotel-card-title {
    font-size: 1.02rem; font-weight: 700;
    color: var(--hp-800); display: block; line-height: 1.3;
}
.hotel-card .hotel-card-title:hover { color: var(--hc-500); }
.hotel-card .hotel-location { font-size: .82rem; color: var(--hw-muted); }

/* Rating chip */
.rating-chip {
    background: var(--hp-800); color: #fff;
    border-radius: .5rem .5rem .5rem 0;
    padding: .28rem .5rem;
    font-weight: 700; font-size: .82rem; line-height: 1;
    display: inline-flex; align-items: center; gap: .3rem;
}
.rating-chip.is-teal,
.rating-chip.is-violet,
.rating-chip.is-coral  { background: var(--hc-500); }

/* Price */
.price-tag { font-size: 1.22rem; font-weight: 800; color: var(--hp-900); }
.price-tag small { font-size: .72rem; font-weight: 500; color: var(--hw-muted); }

/* Badges */
.badge-soft-teal,
.badge-soft-navy,
.badge-soft-violet {
    background: var(--hp-100);
    color: var(--hp-800);
    font-weight: 600;
}
.badge-soft-coral {
    background: var(--hc-100);
    color: var(--hc-600);
    font-weight: 600;
}
.badge-soft-gold {
    background: var(--ha-100);
    color: #92400e;
    font-weight: 600;
}
.badge-soft-green { background: #d1fae5; color: #065f46; font-weight: 600; }
.badge-soft-gray  { background: rgba(100,116,139,.12); color: #475569; font-weight: 600; }

/* Deal flag */
.deal-flag {
    position: absolute; top: .75rem; left: .75rem;
    background: var(--hc-500); color: #fff;
    font-weight: 700; font-size: .72rem;
    padding: .28rem .65rem; border-radius: 999px; z-index: 2;
    box-shadow: 0 3px 10px rgba(232,71,43,.35);
}

/* Wishlist */
.wishlist-btn {
    position: absolute; top: .65rem; right: .65rem;
    width: 36px; height: 36px; border-radius: 50%; border: none;
    background: rgba(255,255,255,.92); color: var(--hp-800);
    display: grid; place-items: center; z-index: 2;
    transition: all .15s;
}
.wishlist-btn:hover { background: #fff; transform: scale(1.1); }
.wishlist-btn.is-active { background: #fee2e2; color: #e5385b; }

/* Destination tiles */
.destination-tile {
    position: relative; display: block;
    border-radius: var(--bs-border-radius-lg);
    overflow: hidden; aspect-ratio: 4/3; color: #fff;
}
.destination-tile img { width:100%; height:100%; object-fit:cover; transition:transform .4s; }
.destination-tile::after {
    content:""; position:absolute; inset:0;
    background: linear-gradient(180deg,rgba(15,27,61,0) 35%,rgba(15,27,61,.88) 100%);
}
.destination-tile:hover img { transform: scale(1.08); }
.destination-tile .destination-info { position:absolute; left:0; right:0; bottom:0; z-index:2; padding:1rem; }
.destination-tile .destination-info h3 { color:#fff; font-size:1.05rem; margin-bottom:.1rem; }
.destination-tile .destination-info span { font-size:.8rem; color:rgba(255,255,255,.82); }

/* Category cards */
.category-card {
    display: block; text-align: center; padding: 1.25rem .75rem;
    border: 1px solid var(--hw-line);
    border-radius: var(--bs-border-radius-lg);
    background: #fff; transition: all .18s; color: var(--hp-800);
}
.category-card:hover {
    border-color: var(--hc-500); background: var(--hc-50);
    transform: translateY(-3px);
    box-shadow: 0 8px 24px rgba(232,71,43,.12);
    color: var(--hp-800);
}
.category-card i { font-size: 1.7rem; color: var(--hc-500); display:block; margin-bottom:.5rem; }
.category-card .category-name  { font-weight: 700; font-size: .9rem; }
.category-card .category-count { font-size: .75rem; color: var(--hw-muted); }

/* Coupon */
.coupon-card {
    border: 1.5px dashed var(--hc-500);
    background: linear-gradient(135deg, #fff, var(--hc-50));
    border-radius: var(--bs-border-radius-lg); padding: 1rem;
}
.coupon-code {
    font-family: ui-monospace,"SFMono-Regular",Menlo,monospace;
    font-weight: 700; letter-spacing: .08em;
    color: var(--hp-800); background: #fff;
    border: 1px dashed var(--hc-400);
    border-radius: .5rem; padding: .2rem .65rem; display: inline-block;
}

/* Testimonials */
.testimonial-card {
    background: #fff; border: 1px solid var(--hw-line);
    border-radius: var(--bs-border-radius-lg);
    padding: 1.25rem; height: 100%;
}
.testimonial-quote { font-size: .92rem; color: var(--hw-ink); line-height: 1.65; }

/* ─────────────────────────────────────────────────────────────────────────
   Forms & Auth
   ───────────────────────────────────────────────────────────────────────── */
.form-label { font-weight: 600; font-size: .86rem; color: var(--hp-800); }

.form-control, .form-select {
    border-radius: .6rem; border-color: var(--hw-line);
    padding: .62rem .88rem; background-color: #fff;
}
.form-control:focus, .form-select:focus {
    border-color: var(--hc-500);
    box-shadow: 0 0 0 .2rem rgba(232,71,43,.15);
    background-color: #fff;
}
.input-group-text {
    background: var(--hp-50); border-color: var(--hw-line); color: var(--hw-muted);
}

.auth-shell {
    min-height: 100vh; display: grid; place-items: center;
    padding: 2.5rem 1rem;
    background:
        radial-gradient(circle at 12% 20%, rgba(232,71,43,.10), transparent 45%),
        radial-gradient(circle at 88% 80%, rgba(27,43,94,.10), transparent 45%),
        var(--hw-ivory);
}
.auth-card {
    width: 100%; max-width: 460px; background: #fff;
    border-radius: var(--bs-border-radius-xl);
    box-shadow: 0 24px 64px rgba(27,43,94,.14);
    padding: 2rem;
}
.otp-input { letter-spacing:.55em; text-align:center; font-size:1.5rem; font-weight:700; }

/* ─────────────────────────────────────────────────────────────────────────
   Dashboard
   ───────────────────────────────────────────────────────────────────────── */
.dash-shell { display:flex; min-height:100vh; background:var(--hw-ivory); }

.dash-sidebar {
    width: 260px; flex: 0 0 260px;
    background: var(--hp-900);
    color: #fff; padding: 1.25rem 0;
    position: sticky; top:0; height:100vh;
    overflow-y:auto; overflow-x:hidden;
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,.15) transparent;
}
.dash-sidebar::-webkit-scrollbar { width:4px; }
.dash-sidebar::-webkit-scrollbar-thumb { background:rgba(255,255,255,.18); border-radius:4px; }

.dash-sidebar .sidebar-brand {
    padding:.5rem 1.25rem 1.25rem;
    display:flex; align-items:center; gap:.6rem;
    font-weight:800; color:#fff; font-size:1.15rem;
    border-bottom:1px solid rgba(255,255,255,.10);
    margin-bottom:.5rem;
}
.dash-sidebar .sidebar-heading {
    padding:.9rem 1.25rem .35rem;
    font-size:.68rem; text-transform:uppercase;
    letter-spacing:.09em; color:rgba(255,255,255,.40); font-weight:700;
}
.dash-sidebar .nav-link {
    color: rgba(255,255,255,.78);
    padding:.6rem 1.25rem; font-size:.89rem; font-weight:500;
    display:flex; align-items:center; gap:.65rem;
    border-left:3px solid transparent;
    transition:background .15s,color .15s;
}
.dash-sidebar .nav-link:hover { background:rgba(255,255,255,.07); color:#fff; }
.dash-sidebar .nav-link.active {
    background: rgba(232,71,43,.18);
    color:#fff; border-left-color:var(--hc-400); font-weight:600;
}
.dash-sidebar .nav-link i { font-size:1.05rem; width:1.25rem; text-align:center; flex-shrink:0; }

.dash-main { flex:1 1 auto; min-width:0; }

.dash-topbar {
    background:#fff; border-bottom:1px solid var(--hw-line);
    padding:.85rem 1.5rem;
    display:flex; align-items:center; gap:1rem;
    position:sticky; top:0; z-index:20;
    box-shadow:0 2px 8px rgba(27,43,94,.06);
}
.dash-content { padding:1.5rem; }

.stat-card {
    background:#fff; border:1px solid var(--hw-line);
    border-radius:var(--bs-border-radius-lg);
    padding:1.1rem 1.2rem; height:100%; transition:box-shadow .2s;
}
.stat-card:hover { box-shadow:0 8px 24px rgba(27,43,94,.10); }
.stat-card .stat-label { font-size:.74rem; text-transform:uppercase; letter-spacing:.05em; color:var(--hw-muted); font-weight:700; }
.stat-card .stat-value { font-size:1.5rem; font-weight:800; color:var(--hp-800); line-height:1.2; }

.stat-icon {
    width:42px; height:42px; border-radius:.75rem;
    display:grid; place-items:center;
    background:var(--hc-100); color:var(--hc-500);
    font-size:1.15rem; flex-shrink:0;
}

@media (max-width:991.98px) {
    .dash-shell { display:block; }
    .dash-sidebar {
        position:fixed; left:-280px; top:0;
        z-index:1045; transition:left .25s;
        box-shadow:0 0 40px rgba(15,27,61,.38); height:100%;
    }
    .dash-sidebar.is-open { left:0; }
    .dash-backdrop { position:fixed; inset:0; background:rgba(15,27,61,.55); z-index:1040; }
    .dash-content { padding:1rem; }
    .dash-topbar  { padding:.75rem 1rem; }
}

/* ─────────────────────────────────────────────────────────────────────────
   Tables
   ───────────────────────────────────────────────────────────────────────── */
.table > :not(caption) > * > * { padding:.8rem .9rem; }
.table thead th {
    font-size:.74rem; text-transform:uppercase; letter-spacing:.04em;
    color:var(--hw-muted); font-weight:700;
    border-bottom:1px solid var(--hw-line);
    background:var(--hw-ivory); white-space:nowrap;
}
.table-hover > tbody > tr:hover > * { background:rgba(232,71,43,.04); }

/* ─────────────────────────────────────────────────────────────────────────
   Booking / Checkout
   ───────────────────────────────────────────────────────────────────────── */
.booking-step {
    display:flex; align-items:center; gap:.5rem;
    font-size:.82rem; color:var(--hw-muted); font-weight:600;
}
.booking-step .step-index {
    width:26px; height:26px; border-radius:50%;
    background:var(--hw-line); color:var(--hw-muted);
    display:grid; place-items:center; font-size:.78rem; font-weight:700;
}
.booking-step.is-active { color:var(--hp-800); }
.booking-step.is-active .step-index { background:var(--hc-500); color:#fff; }
.booking-step.is-done   .step-index { background:#10b981; color:#fff; }

.summary-sticky { position:sticky; top:90px; }

.room-row {
    border:1px solid var(--hw-line);
    border-radius:var(--bs-border-radius-lg);
    padding:1rem; background:#fff;
}
.room-row + .room-row { margin-top:.85rem; }

/* Room list thumbnail + in-page photo gallery ---------------------------- */
.room-thumb {
    position:relative; display:block; width:100%;
    padding:0; border:1px solid var(--hw-line); border-radius:var(--bs-border-radius);
    overflow:hidden; background:var(--hp-50); cursor:pointer; line-height:0;
}
.room-thumb img {
    width:100%; height:100%; aspect-ratio:4/3; object-fit:cover;
    transition:transform .3s ease;
}
.room-thumb:hover img { transform:scale(1.05); }
.room-thumb:focus-visible { outline:2px solid var(--hc-500); outline-offset:2px; }
.room-thumb-count {
    position:absolute; right:.4rem; bottom:.4rem;
    background:rgba(15,27,61,.78); color:#fff;
    border-radius:999px; padding:.15rem .5rem;
    font-size:.72rem; line-height:1.2;
}
.room-thumb-link {
    display:block; width:100%; margin-top:.4rem; padding:0;
    background:none; border:0; color:var(--hp-600);
    font-size:.78rem; font-weight:600; text-decoration:underline;
}
.room-thumb-link:hover { color:var(--hc-500); }

.room-gallery-modal .modal-content { border:0; border-radius:var(--bs-border-radius-lg); }
.room-gallery-grid {
    display:grid; gap:.75rem;
    grid-template-columns:repeat(auto-fill, minmax(240px, 1fr));
}
.room-gallery-item { margin:0; }
.room-gallery-item img {
    width:100%; aspect-ratio:4/3; object-fit:cover;
    border-radius:var(--bs-border-radius); background:var(--hp-50);
}
.room-gallery-item figcaption {
    margin-top:.35rem; font-size:.78rem; color:var(--hw-muted);
}

/* Room gallery carousel (inside modal) */
.room-gallery-carousel {
    background:#111;
    border-radius:0;
    /* fixed height so the prev/next arrows have a real area to sit on */
    height:60vh;
    display:flex;
    flex-direction:column;
}
.room-gallery-carousel .carousel-inner {
    flex:1;
    overflow:hidden;
    display:flex;
    align-items:center;
}
.room-gallery-carousel .carousel-item {
    height:100%;
}
.room-gallery-carousel-img {
    width:100%;
    height:60vh;
    object-fit:contain;
    background:#111;
    display:block;
}
/* Make the prev/next arrows large, always visible, high contrast */
.room-gallery-carousel .carousel-control-prev,
.room-gallery-carousel .carousel-control-next {
    width:14%;
    opacity:1;
}
.room-gallery-carousel .carousel-control-prev-icon,
.room-gallery-carousel .carousel-control-next-icon {
    width:2.5rem;
    height:2.5rem;
    background-color:rgba(0,0,0,.65);
    border-radius:50%;
    background-size:55%;
    padding:.3rem;
}
.room-gallery-carousel .carousel-control-prev:hover .carousel-control-prev-icon,
.room-gallery-carousel .carousel-control-next:hover .carousel-control-next-icon {
    background-color:rgba(0,0,0,.9);
}
.room-gallery-carousel .carousel-caption {
    position:static;
    background:rgba(0,0,0,.7);
    padding:.4rem .75rem;
    color:#fff;
    font-size:.78rem;
    text-align:center;
}
.room-gallery-indicators {
    bottom:.5rem;
    margin-bottom:0;
}
.room-gallery-indicators [data-bs-slide-to] {
    width:8px; height:8px; border-radius:50%;
    background-color:rgba(255,255,255,.45); border:0;
    margin:0 3px;
    cursor:pointer;
}
.room-gallery-indicators .active {
    background-color:#fff;
}

.amenity-pill {
    display:inline-flex; align-items:center; gap:.4rem;
    background:var(--hp-50); border:1px solid var(--hw-line);
    border-radius:999px; padding:.35rem .8rem;
    font-size:.82rem; color:var(--hw-ink); margin:0 .35rem .5rem 0;
}

/* Gallery */
.gallery-grid {
    display:grid; grid-template-columns:2fr 1fr 1fr;
    grid-template-rows:repeat(2,1fr);
    gap:.5rem; border-radius:var(--bs-border-radius-lg);
    overflow:hidden; aspect-ratio:16/9;
}
.gallery-grid a { display:block; overflow:hidden; background:var(--hp-50); }
.gallery-grid img { width:100%; height:100%; object-fit:cover; transition:transform .35s; }
.gallery-grid a:hover img { transform:scale(1.05); }
.gallery-grid a:first-child { grid-row:span 2; }

@media (max-width:767.98px) {
    .gallery-grid { grid-template-columns:1fr 1fr; aspect-ratio:4/3; }
    .gallery-grid a:first-child { grid-column:span 2; grid-row:span 1; }
}

/* ─────────────────────────────────────────────────────────────────────────
   Alerts & Utilities
   ───────────────────────────────────────────────────────────────────────── */
.alert { border:none; border-radius:.75rem; border-left:4px solid transparent; }
.alert-success { background:#ecfdf5; border-left-color:#10b981; color:#065f46; }
.alert-danger  { background:#fef2f2; border-left-color:#ef4444; color:#991b1b; }
.alert-warning { background:#fffbeb; border-left-color:var(--ha-500); color:#92400e; }
.alert-info    { background:var(--hp-50); border-left-color:var(--hp-800); color:var(--hp-800); }

.object-fit-cover { object-fit:cover; }
.ratio-4x3        { aspect-ratio:4/3; }
.min-w-0          { min-width:0; }
.stretch-link::after { content:""; position:absolute; inset:0; z-index:1; }

.skeleton {
    background:linear-gradient(90deg,#f0eff8 25%,#e6e4f0 37%,#f0eff8 63%);
    background-size:400% 100%;
    animation:skeleton 1.4s ease infinite; border-radius:.5rem;
}
@keyframes skeleton { 0%{background-position:100% 50%} 100%{background-position:0 50%} }

.fade-up { animation:fadeUp .5s ease both; }
@keyframes fadeUp { from{opacity:0;transform:translateY(12px)} to{opacity:1;transform:translateY(0)} }

.star-row { color:var(--hw-amber); letter-spacing:.05em; font-size:.85rem; }

.mobile-book-bar {
    position:fixed; left:0; right:0; bottom:0;
    background:#fff; border-top:1px solid var(--hw-line);
    padding:.75rem 1rem; z-index:1035;
    box-shadow:0 -6px 20px rgba(27,43,94,.08);
}
@media (max-width:991.98px) { .has-mobile-bar { padding-bottom:84px; } }

/* ─────────────────────────────────────────────────────────────────────────
   Footer
   ───────────────────────────────────────────────────────────────────────── */
.site-footer {
    background: var(--hp-900);
    color: rgba(255,255,255,.76);
    padding: 3.5rem 0 1.5rem;
}
.site-footer h6 {
    color:#fff; font-size:.85rem;
    text-transform:uppercase; letter-spacing:.06em; margin-bottom:1rem;
}
.site-footer a { color:rgba(255,255,255,.70); font-size:.88rem; transition:color .15s; }
.site-footer a:hover { color:var(--ha-500); }
.site-footer .footer-bottom {
    border-top:1px solid rgba(255,255,255,.12);
    margin-top:2.5rem; padding-top:1.25rem; font-size:.82rem;
}

.social-circle {
    width:36px; height:36px; border-radius:50%;
    background:rgba(255,255,255,.10); color:#fff;
    display:grid; place-items:center;
    transition:background .15s,transform .15s;
}
.social-circle:hover { background:var(--hc-500); color:#fff; transform:translateY(-2px); }

/* Print */
@media print {
    .site-header,.site-footer,.no-print,.dash-sidebar,.dash-topbar { display:none !important; }
    .dash-content,body { padding:0 !important; background:#fff !important; }
}

/* ─────────────────────────────────────────────────────────────────────────
   CTA Section
   ───────────────────────────────────────────────────────────────────────── */
.cta-card {
    background: linear-gradient(130deg, var(--hp-900) 0%, var(--hp-800) 100%);
    border-radius: var(--bs-border-radius-xl);
    padding: 2.5rem 2rem; color: #fff; border: none;
}
.cta-card h2 { color:#fff; }
.cta-card p  { color:rgba(255,255,255,.80); }

/* Trust strip */
.trust-strip {
    background: linear-gradient(90deg, var(--hp-900), var(--hp-800));
    color: rgba(255,255,255,.90);
    padding: .75rem 0; font-size: .87rem;
}
.trust-strip i { color: var(--ha-500); }