@import url('https://fonts.googleapis.com/css2?family=Fascinate+Inline&display=swap');

.font-fascinate {
    font-family: 'Fascinate Inline', cursive, display, sans-serif;
}

/* ============================================================
   RapidRoomz — Centralized Design Token System
   ============================================================
   SINGLE SOURCE OF TRUTH for the entire RapidRoomz brand.
   Change colors HERE to update the entire application.
   ============================================================ */

:root {
    /* ── Primary Brand / Topbar ── */
    --rr-primary:        #167A70;  /* Premium Emerald — topbar, sidebar, price, links */
    --rr-primary-hover:  #126A62;  /* Topbar hover */
    --rr-primary-active: #0F625A;  /* Topbar active / pressed */
    --rr-primary-dark:   #0C5249;  /* Footer dark section */

    /* ── Hero ── */
    --rr-hero:           #0F7168;  /* Hero background — deeper than topbar */
    --rr-hero-end:       #24998D;  /* Hero gradient end */

    /* ── Secondary / Links ── */
    --rr-secondary:      #167A70;  /* Links, active nav — matches primary */
    --rr-secondary-hover:#0F625A;  /* Link hover */

    /* ── Accent / CTA ── */
    --rr-accent:         #F28C28;  /* Warm Orange — primary CTA: Search, Book, Reserve */
    --rr-accent-hover:   #D97706;  /* Darker Orange — CTA hover */
    --rr-accent-light:   #FFF5EB;  /* Soft Orange bg — badges, highlights */

    /* ── Status Colors ── */
    --rr-success:        #159957;  /* Green — benefits, confirmed */
    --rr-success-light:  #D5F5E3;  /* Green bg */
    --rr-warning:        #D99A00;  /* Amber — pending, urgency */
    --rr-warning-light:  #FDF4D6;  /* Amber bg */
    --rr-error:          #D64545;  /* Red — errors, cancellation */
    --rr-error-light:    #FCEAEA;  /* Red bg */

    /* ── Neutral Palette ── */
    --rr-background:     #F5FAF8;  /* Page background — soft mint tint */
    --rr-surface:        #FFFFFF;  /* Cards, modals, forms */
    --rr-surface-teal:   #EAF6F3;  /* Soft emerald surface — info boxes, dropdown hover */
    --rr-text:           #16332F;  /* Main body text — dark emerald */
    --rr-text-secondary: #607A75;  /* Secondary/muted text */
    --rr-text-muted:     #8AA19D;  /* Very muted text — labels, timestamps */
    --rr-text-nav:       #E4F4F1;  /* Secondary nav text on dark bg */
    --rr-border:         #D6E8E4;  /* Standard borders */
    --rr-border-subtle:  #E8F0ED;  /* Very subtle borders */

    /* ── Shadows ── */
    --rr-shadow-sm:      0 1px 3px rgba(22, 122, 112, 0.06);
    --rr-shadow-md:      0 4px 12px rgba(22, 122, 112, 0.08);
    --rr-shadow-lg:      0 8px 24px rgba(22, 122, 112, 0.10);
    --rr-shadow-xl:      0 12px 36px rgba(22, 122, 112, 0.14);
}

/* ── Base Overrides ── */
body {
    background-color: var(--rr-background);
    color: var(--rr-text);
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
}

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding-left: 1rem;
    padding-right: 1rem;
}

/* ── RapidRoomz Search Widget Border ── */
.rr-search-border {
    border: 3px solid var(--rr-accent);
    box-shadow: var(--rr-shadow-xl);
    border-radius: 0.75rem;
}

/* ── RapidRoomz Rating Badge ── */
.rr-score-badge {
    background: linear-gradient(135deg, var(--rr-hero) 0%, var(--rr-primary) 100%);
    color: #ffffff;
    font-weight: 700;
    border-radius: 8px 8px 8px 2px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* ── Benefit Tags ── */
.rr-tag-success {
    color: var(--rr-success);
    background-color: var(--rr-success-light);
    font-weight: 600;
}

/* ── Urgency Tags ── */
.rr-tag-error {
    color: var(--rr-error);
    font-weight: 700;
}

/* ── Premium Member Badge ── */
.rr-premium-badge {
    background: linear-gradient(135deg, var(--rr-accent) 0%, #F5A623 100%);
    color: #FFFFFF;
    font-weight: 800;
    letter-spacing: -0.02em;
}

/* ── Custom Scrollbar for horizontal lists ── */
.no-scrollbar::-webkit-scrollbar {
    display: none;
}
.no-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

[x-cloak] {
    display: none !important;
}

/* ── Focus States ── */
input:focus, select:focus, textarea:focus {
    outline: none;
    border-color: var(--rr-secondary) !important;
    box-shadow: 0 0 0 2px rgba(22, 122, 112, 0.15);
}

/* ── Link Hover ── */
a.rr-link {
    color: var(--rr-secondary);
    transition: color 0.15s ease;
}
a.rr-link:hover {
    color: var(--rr-primary-hover);
}

/* ============================================================
   RapidRoomz Standardized Responsive Image Placeholder Bounds
   ============================================================ */

/* Universal Image Fit & Center */
.rr-img-placeholder {
    width: 100%;
    object-fit: cover;
    object-position: center;
    background-color: #e2e8f0;
}

/* Property Grid & Search Result Cards (Fixed Max Desktop Bounds, Fluid Mobile/Tab) */
.rr-card-img {
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    object-position: center;
    max-height: 280px;
}

@media (min-width: 1024px) {
    .rr-card-img {
        max-height: 240px;
    }
}

/* Property Detail Gallery Hero Image */
.rr-gallery-main-img {
    width: 100%;
    height: 100%;
    max-height: 480px;
    object-fit: cover;
    object-position: center;
    aspect-ratio: 16 / 9;
}

/* Room Type Thumbnail Image (Desktop Fixed Bounds, Scales Fluidly on Mobile/Tablet) */
.rr-room-thumb-img {
    width: 100%;
    aspect-ratio: 4 / 3;
    max-height: 220px;
    object-fit: cover;
    object-position: center;
    border-radius: 0.75rem;
}

@media (min-width: 768px) {
    .rr-room-thumb-img {
        max-width: 260px;
        max-height: 180px;
    }
}