/* ==========================================================================
   Lei's Resort — Official Brand Palette & Typography
   Pagadian's Hidden Garden Escape — "Stay Close. Escape Deeper."
   --------------------------------------------------------------------------
   Luxury resort palette:
     Charcoal Navy  #263248   Olive Sage   #7a8065   Bamboo Green #8b9360
     Stone Ivory    #f7f3eb   Muted Gold   #c89a5a
   Derived: moss #5c6042, bronze #b0843f, CTA amber #a87334, stone #a7a898
   Typography: Plus Jakarta Sans.
   ========================================================================== */

:root {
  /* Core palette */
  --brand-ivory: #f7f3eb;
  --brand-charcoal: #263248;
  --brand-olive: #7a8065;
  --brand-green: #8b9360;
  --brand-gold: #c89a5a;
  --brand-moss: #5c6042;
  --brand-stone: #a7a898;
  --brand-bronze: #b0843f;
  --brand-amber: #a87334;
  --brand-white: #ffffff;
  --brand-cream: #faf6ef;
  --brand-pearl: #f3eee4;

  /* RGB channels */
  --brand-charcoal-rgb: 38, 50, 72;
  --brand-gold-rgb: 200, 154, 90;
  --brand-green-rgb: 139, 147, 96;
  --brand-amber-rgb: 168, 115, 52;
  --brand-olive-rgb: 122, 128, 101;
  --brand-ivory-rgb: 247, 243, 235;
  --brand-moss-rgb: 92, 96, 66;
  --brand-bronze-rgb: 176, 132, 63;
  --brand-stone-rgb: 167, 168, 152;

  /* Semantic — luxury resort UI */
  --color-text: var(--brand-charcoal);
  --color-text-muted: var(--brand-olive);
  --color-text-soft: var(--brand-stone);
  --color-surface: var(--brand-ivory);
  --color-surface-elevated: var(--brand-white);
  --color-border: rgba(var(--brand-charcoal-rgb), 0.12);
  --color-shadow: rgba(var(--brand-charcoal-rgb), 0.1);

  /* Primary actions — champagne gold (hotel CTAs) */
  --color-accent: var(--brand-gold);
  --color-accent-hover: var(--brand-amber);
  --color-accent-soft: rgba(var(--brand-gold-rgb), 0.16);
  --color-accent-gradient: linear-gradient(
    135deg,
    var(--brand-gold) 0%,
    var(--brand-amber) 100%
  );

  /* Brand nature — logo green (secondary accent only) */
  --color-brand: var(--brand-green);
  --color-brand-soft: rgba(var(--brand-green-rgb), 0.12);
  --color-brand-muted: var(--brand-moss);

  /* Dark surfaces — charcoal navy */
  --color-dark: var(--brand-charcoal);
  --color-dark-soft: var(--brand-moss);
  --color-dark-gradient: linear-gradient(
    135deg,
    var(--brand-charcoal) 0%,
    #1e2838 55%,
    var(--brand-moss) 100%
  );

  /* Typography */
  --brand-font-sans:
    "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI",
    sans-serif;
  --brand-font-display: var(--brand-font-sans);

  /* Public pages (landing / reserve) */
  --lp-font: var(--brand-font-sans);
  --lp-dark: var(--brand-charcoal);
  --lp-dark-soft: var(--brand-moss);
  --lp-gold: var(--brand-gold);
  --lp-gold-hover: var(--brand-amber);
  --lp-gold-soft: rgba(var(--brand-gold-rgb), 0.18);
  --lp-text: var(--brand-charcoal);
  --lp-text-muted: var(--brand-olive);
  --lp-white: var(--brand-white);
  --lp-bg: var(--brand-ivory);
  --lp-bg-alt: var(--brand-cream);
  --lp-border: rgba(var(--brand-charcoal-rgb), 0.12);
  --lp-shadow-sm: 0 1px 3px rgba(var(--brand-charcoal-rgb), 0.08);
  --lp-shadow: 0 8px 24px rgba(var(--brand-charcoal-rgb), 0.1);
  --lp-shadow-lg: 0 18px 46px rgba(var(--brand-charcoal-rgb), 0.14);
  --lp-radius: 12px;
  --lp-radius-sm: 8px;
  --lp-transition: 0.2s ease;

  /* Admin shell (sidebar / header) — bamboo green dominant */
  --leis-accent: var(--brand-green);
  --leis-accent-dark: var(--brand-moss);
  --leis-text: var(--brand-charcoal);
  --leis-text-muted: var(--brand-olive);
  --leis-dark: var(--brand-charcoal);
  --leis-white: var(--brand-white);
  --leis-bg: var(--brand-ivory);
  --leis-accent-soft: rgba(var(--brand-green-rgb), 0.14);
  --leis-border: rgba(var(--brand-green-rgb), 0.16);
  --leis-brand: var(--brand-green);
  --leis-brand-soft: rgba(var(--brand-green-rgb), 0.12);

  /* Legacy aliases (sidebar/header still reference these) */
  --mnhs-red: var(--leis-accent);
  --mnhs-red-dark: var(--leis-accent-dark);
  --mnhs-gold: var(--brand-gold);
  --mnhs-text: var(--leis-text);
  --mnhs-text-muted: var(--leis-text-muted);
  --mnhs-dark: var(--leis-dark);
  --mnhs-white: var(--leis-white);
  --mnhs-bg: var(--leis-bg);
  --mnhs-red-light: var(--leis-accent-soft);
  --mnhs-border: var(--leis-border);

  /* Accommodation type pills */
  --type-room-bg: rgba(var(--brand-charcoal-rgb), 0.08);
  --type-room-text: var(--brand-charcoal);
  --type-room-border: rgba(var(--brand-charcoal-rgb), 0.16);
  --type-cottage-bg: rgba(var(--brand-green-rgb), 0.12);
  --type-cottage-text: var(--brand-moss);
  --type-cottage-border: rgba(var(--brand-green-rgb), 0.24);
  --type-hall-bg: rgba(var(--brand-gold-rgb), 0.14);
  --type-hall-text: var(--brand-amber);
  --type-hall-border: rgba(var(--brand-gold-rgb), 0.28);
  --type-couple-bg: rgba(var(--brand-olive-rgb), 0.12);
  --type-couple-text: var(--brand-olive);
  --type-couple-border: rgba(var(--brand-olive-rgb), 0.24);

  /* Site logo — transparent mark, context-aware treatment */
  --brand-logo-height: 46px;
  --brand-logo-height-sm: 40px;
  --brand-logo-height-xs: 34px;
  --brand-logo-max-width: 128px;
  --brand-logo-filter-on-dark: brightness(0) invert(1) sepia(0.14) saturate(0.4)
    hue-rotate(8deg) drop-shadow(0 2px 10px rgba(0, 0, 0, 0.35));
  --brand-logo-filter-footer: brightness(0) invert(1) sepia(0.12) saturate(0.35)
    hue-rotate(8deg) drop-shadow(0 1px 0 rgba(255, 255, 255, 0.1))
    drop-shadow(0 4px 16px rgba(0, 0, 0, 0.35));
  --brand-logo-filter-on-light: drop-shadow(
    0 1px 2px rgba(var(--brand-charcoal-rgb), 0.1)
  );
  --brand-logo-filter-on-ivory: drop-shadow(
    0 1px 3px rgba(var(--brand-charcoal-rgb), 0.12)
  );
}

/* Shared logo image — transparent PNG, no frame box */
.brand img,
.landing-logo-frame img,
.landing-footer-logo,
.landing-footer__logo,
.nav-sidebar-logo,
.reserve-header-logo,
.sidebar-brand-logo {
  display: block;
  width: auto;
  height: var(--brand-logo-height);
  max-width: var(--brand-logo-max-width);
  object-fit: contain;
  object-position: center;
  border: none;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  transition:
    filter 0.35s ease,
    transform 0.25s ease,
    opacity 0.25s ease;
}

/* Dark surfaces — ivory monochrome mark (luxury on hero) */
.header:not(.scrolled) .brand img,
.reserve-header-logo {
  filter: var(--brand-logo-filter-on-dark);
}

.landing-footer-logo,
.landing-footer__logo:not(.landing-footer__logo--horizontal) {
  filter: var(--brand-logo-filter-on-dark);
}

.landing-footer__logo--horizontal {
  width: 100%;
  height: auto;
  max-width: min(100%, 300px);
}

/* Light surfaces — full-color mark with soft depth */
.header.scrolled .brand img,
.nav-sidebar-logo,
.landing-logo-frame img,
.sidebar-brand-logo {
  filter: var(--brand-logo-filter-on-light);
}

.sidebar-brand-logo {
  height: 34px;
  max-width: 108px;
}

.brand:hover img,
.reserve-header-logo-link:hover .reserve-header-logo,
.landing-footer-brand:hover .landing-footer-logo,
.landing-footer__brand-link:hover .landing-footer__logo,
.sidebar-brand-link:hover .sidebar-brand-logo {
  opacity: 0.9;
  transform: scale(1.02);
}
