/* ============================================================
   BIHAR BHRAMAN — Auth Pages Stylesheet
   बिहार भ्रमण · Discover the Soul of Bihar
   ============================================================ */

:root{
  /* --- Brand palette --- */
  --saffron:        #E8650A;   /* Bodhi Saffron — primary */
  --saffron-dark:    #B8470A;  /* official button hover shade */
  --gold:            #C9960C;  /* Heritage Gold — accent */
  --green:           #2E7D32;  /* Nalanda Green */
  --stone:           #5D4037;  /* Stone Heritage */
  --forest:          #2E3A1E;  /* Deep Forest — panel bg */
  --forest-deep:      #232B16;

  --parchment:       #FFF8E1; /* page bg */
  --parchment-alt:   #FAF3DC; /* card bg */
  --cream-dark:      #F5EABC; /* highlight bg */
  --off-white:       #FAFAFA;
  --white:           #FFFFFF;

  /* --- Type-color-rule palette --- */
  --ink-dark:        #4A4A4A; /* body copy — never pure black */
  --stone-mid:       #757575; /* captions & metadata */
  --ganga-blue:      #1565C0; /* links & URL text */
  --error-red:       #C62828;
  --disabled-bg:     #EEEEEE;
  --input-border:    #BDBDBD;
  --input-placeholder:#9E9E9E;

  /* --- Type scale: font families by role --- */
  --font-display: 'Cinzel Decorative', serif;   /* Display / Hero */
  --font-h:       'Cinzel', serif;               /* H1 Page Title / H2 Section Title */
  --font-card-h:  'Playfair Display', serif;     /* H3 Card Heading / H4 Sub-heading */
  --font-body:    'Inter', 'Segoe UI', sans-serif; /* Body / UI labels / buttons */
  --font-hindi:   'Hind Siliguri', sans-serif;   /* Hindi body text */
  --font-quote:   'Lora', serif;                 /* Pull quotes */
  --font-mono:    'JetBrains Mono', monospace;   /* Code / data / figures */

  --radius-btn: 6px;   /* buttons & form fields per spec */
  --radius-s: 10px;
  --radius-m: 18px;
  --radius-l: 26px;
  --radius-xl: 32px;

  --shadow-s: 0 2px 10px -3px rgba(46,58,30,0.12);
  --shadow-m: 0 12px 28px -10px rgba(46,58,30,0.18);
  --shadow-l: 0 18px 40px -12px rgba(46,58,30,0.28);
  --shadow-xl: 0 28px 60px -16px rgba(46,58,30,0.32);
  --ease: cubic-bezier(.22,1,.36,1);
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; overflow-x:hidden; }
body{ overflow-x:hidden; }

::selection{ background:rgba(232,101,10,0.22); color:var(--stone); }

::-webkit-scrollbar{ width:10px; height:10px; }
::-webkit-scrollbar-track{ background:transparent; }
::-webkit-scrollbar-thumb{ background:rgba(93,64,55,0.25); border-radius:999px; border:2px solid var(--parchment); }
::-webkit-scrollbar-thumb:hover{ background:rgba(93,64,55,0.4); }

body{
  margin:0;
  font-family:var(--font-body);
  background:var(--parchment);
  color:var(--ink-dark);
  font-size:16px;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}

p{ max-width:680px; }

/* Type scale defaults — component-specific rules below refine these per role */
h1{ font-family:var(--font-h); font-weight:600; letter-spacing:1px; line-height:1.2; color:var(--forest); margin:0; }
h2{ font-family:var(--font-h); font-weight:500; letter-spacing:0; line-height:1.3; color:var(--stone); margin:0; }
h3{ font-family:var(--font-card-h); font-weight:700; line-height:1.4; color:var(--green); margin:0; }
h4{ font-family:var(--font-card-h); font-weight:400; line-height:1.5; color:var(--stone); margin:0; }

/* Links & URL text — Ganga Blue, always underlined on hover */
a{ color:var(--ganga-blue); text-decoration:none; }
a:hover{ text-decoration:underline; }

/* ============================================================
   PAGE SHELL — split screen
   ============================================================ */
.auth-shell{
  min-height:100vh;
  display:grid;
  grid-template-columns: 44% 56%;
}

@media (max-width: 880px){
  .auth-shell{ grid-template-columns: 1fr; }
}

/* ---------------- LEFT: heritage panel ---------------- */
.panel{
  position:relative;
  background:
    radial-gradient(ellipse 90% 60% at 50% 0%, rgba(232,101,10,0.18), transparent 60%),
    linear-gradient(180deg, var(--forest) 0%, var(--forest-deep) 100%);
  color:var(--parchment);
  padding: 3rem 3rem 0;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  min-height:100vh;
}

@media (max-width:880px){
  .panel{ min-height:auto; padding: 2rem 1.5rem 0; }
}

/* Madhubani-inspired repeating border strip along the panel's inner edge */
.panel::after{
  content:"";
  position:absolute;
  top:0; right:0; bottom:0;
  width:10px;
  background-image: repeating-linear-gradient(
    to bottom,
    var(--gold) 0 3px,
    transparent 3px 14px
  );
  opacity:.55;
}

.brandmark{
  display:flex;
  align-items:center;
  gap:.75rem;
  z-index:2;
}

.brandmark .seal{ width:46px; height:46px; flex-shrink:0; }

.brandmark .wordmark{
  font-family:var(--font-display);
  font-weight:700;
  font-size:1.3rem;
  letter-spacing:1px;
  color:var(--cream-dark);
  line-height:1.1;
}

.brandmark .wordmark small{
  display:block;
  font-family:var(--font-hindi);
  font-weight:400;
  font-size:.78rem;
  color:var(--gold);
  letter-spacing:.5px;
  margin-top:3px;
}

.panel-copy{
  z-index:2;
  margin-top: 2.75rem;
  max-width: 420px;
}

.panel-copy h1{
  font-family:var(--font-display);
  font-weight:700;
  letter-spacing:1px;
  font-size: clamp(1.9rem, 3vw, 2.6rem);
  line-height:1.15;
  color:var(--white);
  margin:0 0 .6rem;
}

.panel-copy h1 em{
  color:var(--saffron);
  font-style:normal;
}

.panel-copy .sub-tagline{
  font-family:var(--font-body);
  font-size:.8125rem;
  font-weight:600;
  letter-spacing:.5px;
  text-transform:uppercase;
  color:var(--gold);
  margin:0 0 1.6rem;
}

.fact-list{
  list-style:none;
  margin:0; padding:0;
  display:flex;
  flex-direction:column;
  gap:.9rem;
}

.fact-list li{
  display:flex;
  gap:.75rem;
  align-items:flex-start;
  font-family:var(--font-body);
  font-size:.875rem;
  line-height:1.5;
  color:rgba(255,248,225,0.85);
}

.fact-list .dot{
  width:8px; height:8px;
  border-radius:50%;
  background:var(--saffron);
  margin-top:.4rem;
  flex-shrink:0;
  box-shadow:0 0 0 3px rgba(232,101,10,0.18);
}

.fact-list strong{ color:var(--parchment); font-weight:600; }

/* Silhouette illustration anchored to panel bottom */
.skyline{
  margin-top:auto;
  width:100%;
  z-index:1;
  opacity:.95;
}

.panel-quote{
  z-index:2;
  font-family:var(--font-quote);
  font-style:italic;
  font-size:1rem;
  line-height:1.5;
  color:rgba(255,248,225,0.75);
  padding: .2rem 0 1.5rem 1rem;
  border-left: 2px solid var(--gold);
}

/* ---------------- RIGHT: form side ---------------- */
.form-side{
  display:flex;
  align-items:center;
  justify-content:center;
  padding: 3rem 2rem;
  background:var(--parchment);
}

.card-stack{
  position:relative;
  width:100%;
  max-width:440px;
}

/* Signature element: stacked palm-leaf / manuscript pages behind the card */
.card-stack::before,
.card-stack::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:var(--radius-m);
  background:var(--cream-dark);
  z-index:0;
}
.card-stack::before{
  transform: rotate(-2.3deg) translate(-6px, 5px);
  background:var(--parchment-alt);
  border:1px solid rgba(93,64,55,0.15);
}
.card-stack::after{
  transform: rotate(1.6deg) translate(7px, 3px);
  background:var(--cream-dark);
  border:1px solid rgba(201,150,12,0.25);
}

.card{
  position:relative;
  z-index:1;
  background:var(--off-white);
  border-radius:var(--radius-m);
  border:1px solid rgba(93,64,55,0.12);
  padding: 2.4rem 2.2rem 2.1rem;
  box-shadow: var(--shadow-l);
  animation: cardIn .55s var(--ease) both;
}

@keyframes cardIn{
  from{ opacity:0; transform: translateY(14px); }
  to{ opacity:1; transform: translateY(0); }
}

/* torn / deckled top edge, echoing a manuscript leaf */
.card-edge{
  position:absolute;
  top:-1px; left:0; right:0;
  height:9px;
  background: var(--off-white);
  clip-path: polygon(
    0% 100%, 2% 30%, 6% 90%, 10% 20%, 15% 80%, 20% 10%, 26% 75%,
    32% 15%, 38% 85%, 44% 25%, 50% 95%, 56% 20%, 62% 80%, 68% 10%,
    74% 70%, 80% 15%, 86% 90%, 92% 25%, 98% 80%, 100% 100%
  );
  border-radius: var(--radius-m) var(--radius-m) 0 0;
}

.eyebrow{
  display:block;
  font-family:var(--font-body);
  font-size:.75rem;
  font-weight:600;
  letter-spacing:1.5px;
  text-transform:uppercase;
  color:var(--gold);
  margin-bottom:.5rem;
}

.card h2{
  font-family:var(--font-h);
  font-weight:600;
  letter-spacing:.5px;
  line-height:1.2;
  font-size:clamp(1.6rem, 3.2vw, 2.1rem);
  color:var(--forest);
  margin:0 0 .35rem;
}

.card .lede{
  font-family:var(--font-body);
  font-size:.9375rem;
  line-height:1.6;
  color:var(--stone-mid);
  margin:0 0 1.6rem;
}

/* ---------------- Form elements ---------------- */
.field{
  margin-bottom:1.15rem;
}

.field label{
  display:block;
  font-family:var(--font-body);
  font-size:.875rem;
  font-weight:600;
  letter-spacing:.3px;
  color:var(--stone);
  margin-bottom:.4rem;
}

.field .input-wrap{
  position:relative;
}

.field input, .field select{
  width:100%;
  min-height:48px;
  font-family:var(--font-body);
  font-size:1rem;
  padding:.75rem 1rem;
  border-radius:var(--radius-btn);
  border:1.5px solid var(--input-border);
  background:var(--white);
  color:var(--ink-dark);
  transition: border-color .15s ease, box-shadow .15s ease;
}

.field select{
  appearance:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23E8650A' stroke-width='2.4'><polyline points='6 9 12 15 18 9'/></svg>");
  background-repeat:no-repeat;
  background-position:right 1rem center;
  background-size:16px;
  padding-right:2.6rem;
}

.field input::placeholder{ color:var(--input-placeholder); }

.field input:focus, .field select:focus{
  outline:none;
  border-color:var(--saffron);
  border-width:2px;
  box-shadow:0 0 0 3px rgba(232,101,10,0.15);
}

.field input:focus-visible, .field select:focus-visible{
  outline:2px solid var(--saffron-dark);
  outline-offset:1px;
}

.toggle-visibility{
  position:absolute;
  right:.6rem;
  top:50%;
  transform:translateY(-50%);
  background:none;
  border:none;
  cursor:pointer;
  color:var(--stone-mid);
  padding:.3rem;
  line-height:0;
}
.toggle-visibility:hover{ color:var(--saffron-dark); }
.toggle-visibility:focus-visible{ outline:2px solid var(--saffron); border-radius:4px; }

.hint{
  font-family:var(--font-body);
  font-size:.8125rem;
  line-height:1.5;
  color:var(--stone-mid);
  margin-top:.35rem;
}

.hint.error{ color:var(--error-red); }

/* checkbox row */
.check-row{
  display:flex;
  align-items:flex-start;
  gap:.55rem;
  font-size:.83rem;
  color:var(--stone);
  margin: .3rem 0 1.4rem;
}
.check-row input[type="checkbox"]{
  width:17px; height:17px;
  margin-top:1px;
  accent-color:var(--saffron);
  flex-shrink:0;
}

.row-between{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin: -.2rem 0 1.4rem;
  font-size:.83rem;
}

.row-between .check-row{ margin:0; }

.forgot-link{ font-size:.83rem; font-weight:600; }

/* ---------------- Buttons ---------------- */
.btn{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.5rem;
  font-family:var(--font-body);
  font-size:.9375rem;       /* 15px per spec */
  font-weight:600;          /* Inter SemiBold */
  letter-spacing:.3px;
  padding:.875rem 1.75rem;  /* 14px 28px per spec */
  border-radius:var(--radius-btn);
  border:none;
  cursor:pointer;
  transition: transform .12s ease, box-shadow .15s ease, background .15s ease, color .15s ease, border-color .15s ease;
}

.btn:disabled{
  background:var(--disabled-bg) !important;
  color:var(--stone-mid) !important;
  border-color:transparent !important;
  box-shadow:none !important;
  cursor:not-allowed;
  transform:none !important;
}

.btn-primary{
  background: var(--saffron);
  color:var(--white);
  box-shadow: 0 2px 8px rgba(232,101,10,0.3);
}
.btn-primary:hover{ background:var(--saffron-dark); transform: translateY(-1px); box-shadow:0 4px 14px rgba(184,71,10,0.4); }
.btn-primary:active{ transform: translateY(0); }
.btn-primary:focus-visible{ outline:2px solid var(--forest); outline-offset:2px; }

/* Secondary — outline saffron, per spec */
.btn-secondary{
  background:transparent;
  color:var(--saffron);
  border:2px solid var(--saffron);
}
.btn-secondary:hover{ background:rgba(232,101,10,0.1); }
.btn-secondary:focus-visible{ outline:2px solid var(--saffron-dark); outline-offset:2px; }

/* Ghost / text button — tertiary actions */
.btn-ghost{
  background:none;
  border:none;
  color:var(--stone);
  padding:.5rem .25rem;
  width:auto;
}
.btn-ghost:hover{ text-decoration:underline; }

/* Danger — solid, for true destructive actions only */
.btn-danger{
  background:var(--error-red);
  color:var(--white);
  width:auto;
}
.btn-danger:hover{ background:#a81f1f; }
.btn-danger:focus-visible{ outline:2px solid var(--error-red); outline-offset:2px; }

/* Google / third-party outline — kept neutral, not brand-saffron, per convention */
.btn-outline{
  background:var(--white);
  color:var(--stone);
  border:1.5px solid var(--input-border);
}
.btn-outline:hover{ border-color:var(--gold); background:var(--parchment-alt); }
.btn-outline:focus-visible{ outline:2px solid var(--saffron); outline-offset:2px; }

.divider{
  display:flex;
  align-items:center;
  gap:.8rem;
  margin:1.4rem 0;
  color:var(--input-placeholder);
  font-size:.78rem;
}
.divider::before, .divider::after{
  content:"";
  flex:1;
  height:1px;
  background:#E4D9BE;
}

.switch-line{
  text-align:center;
  font-size:.87rem;
  color:var(--stone);
  margin-top:1.5rem;
}
.switch-line a{ font-weight:700; }

/* ---------------- misc ---------------- */
.visually-hidden{
  position:absolute; width:1px; height:1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap;
}

@media (prefers-reduced-motion: reduce){
  *{ transition:none !important; animation:none !important; }
}

@media (max-width:480px){
  .card{ padding:1.9rem 1.4rem 1.8rem; }
  .form-side{ padding:2rem 1.1rem; }
}

/* ============================================================
   DASHBOARD
   ============================================================ */
.dash-shell{ display:flex; min-height:100vh; background:var(--parchment); }

/* ---------------- Sidebar ---------------- */
.sidebar{
  width:264px;
  flex-shrink:0;
  background: linear-gradient(180deg, var(--forest) 0%, var(--forest-deep) 100%);
  color:var(--parchment);
  display:flex;
  flex-direction:column;
  position:fixed;
  top:0; left:0; bottom:0;
  z-index:40;
  transition: transform .3s var(--ease);
}

.sidebar .brandmark{ padding: 1.7rem 1.5rem 1.3rem; }
.sidebar .brandmark .wordmark{ font-size:1.15rem; }

.sidebar-nav{ flex:1; overflow-y:auto; padding: .5rem 0; }
.sidebar-nav ul{ list-style:none; margin:0; padding:0; }
.sidebar-nav .nav-label{
  font-size:.68rem; letter-spacing:1.5px; text-transform:uppercase;
  color:var(--gold); opacity:.75; padding:1.1rem 1.5rem .4rem;
}

.nav-link{
  display:flex; align-items:center; gap:.75rem;
  padding:.7rem 1.5rem;
  font-family:var(--font-body);
  color:rgba(255,248,225,0.75);
  font-size:.875rem; font-weight:600; letter-spacing:.3px;
  border-left:3px solid transparent;
  cursor:pointer;
  transition: background .15s ease, color .15s ease;
}
.nav-link svg{ width:18px; height:18px; flex-shrink:0; opacity:.85; }
.nav-link:hover{ background:rgba(255,255,255,0.05); color:var(--parchment); text-decoration:none; }
.nav-link.active{
  background:rgba(232,101,10,0.14);
  border-left-color:var(--saffron);
  color:var(--saffron);
}
.nav-link.active svg{ opacity:1; color:var(--saffron); }

.sidebar-foot{
  padding:1.1rem 1.5rem 1.4rem;
  border-top:1px solid rgba(255,248,225,0.1);
  font-size:.78rem;
  color:rgba(255,248,225,0.5);
}

.sidebar-overlay{
  display:none;
  position:fixed; inset:0; background:rgba(35,43,22,0.55);
  z-index:35;
}

/* ---------------- Main area ---------------- */
.main-area{ flex:1; margin-left:264px; min-width:0; }

.topbar{
  position:sticky; top:0; z-index:20;
  display:flex; align-items:center; justify-content:space-between;
  gap:1rem;
  padding: 1rem 2rem;
  background:rgba(255,248,225,0.86);
  backdrop-filter:saturate(160%) blur(10px);
  border-bottom:1px solid rgba(93,64,55,0.1);
}

.topbar-left{ display:flex; align-items:center; gap:.9rem; }
.page-title{
  font-family:var(--font-h);
  font-weight:600;
  letter-spacing:.5px;
  font-size:1.35rem;
  color:var(--forest);
  margin:0;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.page-sub{ font-family:var(--font-body); font-size:.8125rem; line-height:1.5; color:var(--stone-mid); margin:2px 0 0; }

.hamburger{
  display:none;
  width:38px; height:38px;
  border-radius:var(--radius-s);
  border:1px solid rgba(93,64,55,0.15);
  background:var(--white);
  align-items:center; justify-content:center;
  cursor:pointer;
}
.hamburger svg{ width:18px; height:18px; color:var(--stone); }

.user-chip{
  position:relative;
  display:flex; align-items:center; gap:.6rem;
  padding:.4rem .7rem .4rem .4rem;
  border-radius:999px;
  background:var(--white);
  border:1px solid rgba(93,64,55,0.12);
  cursor:pointer;
  box-shadow:var(--shadow-s);
}
.avatar{
  width:34px; height:34px; border-radius:50%;
  background:linear-gradient(135deg, var(--saffron), var(--gold));
  color:var(--white); font-weight:800; font-size:.85rem;
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0;
}
.user-chip .u-name{ font-family:var(--font-body); font-size:.875rem; font-weight:600; color:var(--stone); }
.user-chip .caret{ width:14px; height:14px; color:var(--stone-mid); transition:transform .15s ease; }
.user-chip.open .caret{ transform:rotate(180deg); }

.user-menu{
  position:absolute; top:calc(100% + 10px); right:0;
  width:190px;
  background:var(--white);
  border-radius:var(--radius-s);
  border:1px solid rgba(93,64,55,0.12);
  box-shadow:var(--shadow-l);
  padding:.4rem;
  display:none;
  z-index:30;
}
.user-menu.open{ display:block; }
.user-menu a, .user-menu button{
  display:block; width:100%; text-align:left;
  padding:.55rem .7rem; border-radius:6px;
  font-size:.875rem; font-weight:600; letter-spacing:.3px; color:var(--stone);
  background:none; border:none; cursor:pointer; font-family:var(--font-body);
}
.user-menu a:hover, .user-menu button:hover{ background:var(--parchment-alt); text-decoration:none; }
.user-menu .danger{ color:var(--error-red); }

.content{ padding: 1.8rem 2rem 3rem; max-width:1180px; margin:0 auto; }
.dash-section{ display:none; }
.dash-section.active{ display:block; animation: fadeUp .4s var(--ease) both; }

@keyframes fadeUp{
  from{ opacity:0; transform:translateY(10px); }
  to{ opacity:1; transform:translateY(0); }
}

/* ---------------- Welcome + stats ---------------- */
.welcome-banner{
  background: linear-gradient(120deg, var(--forest) 0%, #3a4a26 100%);
  border-radius:var(--radius-l);
  padding: 1.9rem 2.1rem;
  color:var(--parchment);
  position:relative;
  overflow:hidden;
  margin-bottom:1.6rem;
  box-shadow:var(--shadow-m);
}
.welcome-banner::before{
  content:"";
  position:absolute; right:-40px; top:-60px;
  width:220px; height:220px; border-radius:50%;
  background:radial-gradient(circle, rgba(232,101,10,0.35), transparent 70%);
}
.welcome-banner h2{
  font-family:var(--font-display); font-weight:700; letter-spacing:.5px;
  margin:0 0 .3rem;
  font-size:1.5rem; color:var(--white); position:relative; z-index:1;
}
.welcome-banner p{ font-family:var(--font-body); margin:0; font-size:.9375rem; line-height:1.6; color:rgba(255,248,225,0.75); position:relative; z-index:1; max-width:520px; }

.stats-grid{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:1rem;
  margin-bottom:2rem;
}
.stat-card{
  background:var(--off-white);
  border:1px solid rgba(93,64,55,0.1);
  border-radius:var(--radius-m);
  padding:1.2rem 1.3rem;
  box-shadow:var(--shadow-s);
  transition: transform .18s var(--ease), box-shadow .18s var(--ease);
}
.stat-card:hover{ transform:translateY(-3px); box-shadow:var(--shadow-m); }
.stat-card .stat-icon{
  width:36px; height:36px; border-radius:10px;
  display:flex; align-items:center; justify-content:center;
  margin-bottom:.7rem;
}
.stat-card .stat-num{ font-family:var(--font-mono); font-weight:600; font-size:1.5rem; color:var(--stone); line-height:1; }
.stat-card .stat-label{ font-family:var(--font-body); font-size:.8125rem; color:var(--stone-mid); margin-top:.3rem; }

/* ---------------- Section header ---------------- */
.section-head{
  display:flex; align-items:center; justify-content:space-between;
  margin-bottom:1.1rem; gap:1rem; flex-wrap:wrap;
}
.section-head h3{ font-family:var(--font-h); font-weight:500; font-size:1.2rem; color:var(--stone); margin:0; }
.section-head p{ font-family:var(--font-body); font-size:.8125rem; color:var(--stone-mid); margin:.2rem 0 0; }
.btn-small{
  display:inline-flex; align-items:center; gap:.4rem;
  padding:.6rem 1.05rem; font-size:.85rem; width:auto;
}
.btn-small svg{ width:16px; height:16px; }

/* ---------------- Trip cards ---------------- */
.trip-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(280px, 1fr));
  gap:1.15rem;
  margin-bottom:2.2rem;
}
.trip-card{
  background:var(--off-white);
  border-radius:var(--radius-m);
  border:1px solid rgba(93,64,55,0.1);
  box-shadow:var(--shadow-s);
  overflow:hidden;
  position:relative;
  transition: transform .18s var(--ease), box-shadow .18s var(--ease);
}
.trip-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-m); }

.trip-cover{
  height:92px;
  position:relative;
  background: linear-gradient(120deg, var(--nalanda, var(--green)) 0%, var(--forest) 100%);
}
.trip-cover.theme-saffron{ background:linear-gradient(120deg, var(--saffron) 0%, var(--saffron-dark) 100%); }
.trip-cover.theme-gold{ background:linear-gradient(120deg, var(--gold) 0%, #a17a09 100%); }
.trip-cover.theme-green{ background:linear-gradient(120deg, var(--green) 0%, #1e5322 100%); }

.stamp{
  position:absolute; top:12px; right:14px;
  width:58px; height:58px; border-radius:50%;
  border:2px dashed rgba(255,255,255,0.85);
  display:flex; align-items:center; justify-content:center;
  transform:rotate(-10deg);
  font-size:.6rem; font-weight:800; letter-spacing:.5px; text-transform:uppercase;
  color:#fff; text-align:center; line-height:1.1;
  background:rgba(0,0,0,0.08);
}

.trip-body{ padding:1rem 1.1rem 1.1rem; }
.trip-body h4{ margin:0 0 .25rem; font-family:var(--font-card-h); font-weight:700; font-size:1.1rem; color:var(--green); }
.trip-district{ font-family:var(--font-body); font-size:.8125rem; color:var(--gold); font-weight:600; letter-spacing:.3px; margin-bottom:.5rem; }
.trip-meta{ display:flex; flex-wrap:wrap; gap:.4rem .8rem; font-family:var(--font-body); font-size:.8125rem; color:var(--stone-mid); margin-bottom:.6rem; }
.trip-meta span{ display:flex; align-items:center; gap:.3rem; }
.trip-meta svg{ width:13px; height:13px; }
.trip-notes{ font-family:var(--font-body); font-size:.85rem; color:var(--ink-dark); margin:0 0 .8rem; line-height:1.5; }

.trip-actions{ display:flex; gap:.5rem; }
.icon-btn{
  flex:1;
  display:flex; align-items:center; justify-content:center; gap:.35rem;
  padding:.5rem; font-size:.78rem; font-weight:700;
  border-radius:var(--radius-s); border:1px solid rgba(93,64,55,0.15);
  background:var(--white); color:var(--stone); cursor:pointer;
}
.icon-btn svg{ width:14px; height:14px; }
.icon-btn:hover{ border-color:var(--saffron); color:var(--saffron-dark); }
.icon-btn.danger:hover{ border-color:var(--error-red); color:var(--error-red); }

/* ---------------- Saved places ---------------- */
.saved-grid{
  display:grid; grid-template-columns:repeat(auto-fill, minmax(240px,1fr));
  gap:1rem; margin-bottom:2rem;
}
.saved-card{
  background:var(--off-white); border-radius:var(--radius-m);
  border:1px solid rgba(93,64,55,0.1); box-shadow:var(--shadow-s);
  padding:1rem 1.1rem; display:flex; align-items:flex-start; justify-content:space-between; gap:.6rem;
}
.saved-card h4{ margin:0 0 .2rem; font-family:var(--font-card-h); font-weight:400; font-size:1.05rem; color:var(--stone); }
.saved-card p{ margin:0; font-family:var(--font-body); font-size:.8125rem; color:var(--stone-mid); }
.saved-card button{
  background:none; border:none; color:var(--error-red); cursor:pointer; padding:.2rem;
}
.saved-card button svg{ width:17px; height:17px; }

/* ---------------- Empty state ---------------- */
.empty-state{
  text-align:center; padding:2.6rem 1.5rem;
  background:var(--parchment-alt); border:1px dashed rgba(201,150,12,0.4);
  border-radius:var(--radius-m); color:var(--stone-mid); margin-bottom:2rem;
}
.empty-state svg{ width:44px; height:44px; color:var(--gold); margin-bottom:.6rem; }
.empty-state p{ margin:0 0 .9rem; font-size:.88rem; }

/* ---------------- Profile form ---------------- */
.profile-card{
  background:var(--off-white); border-radius:var(--radius-m);
  border:1px solid rgba(93,64,55,0.1); box-shadow:var(--shadow-s);
  padding:1.8rem 1.9rem; max-width:640px;
}
.profile-avatar-row{ display:flex; align-items:center; gap:1.1rem; margin-bottom:1.6rem; }
.profile-avatar-row .avatar{ width:64px; height:64px; font-size:1.3rem; }
.profile-avatar-row .file-btn{
  font-size:.82rem; font-weight:700; color:var(--saffron-dark);
  border:1px solid rgba(232,101,10,0.35); background:var(--white);
  padding:.45rem .9rem; border-radius:var(--radius-s); cursor:pointer;
}
.form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:0 1rem; }
.form-grid .field.full{ grid-column:1/-1; }
.profile-card textarea{
  width:100%; font-family:var(--font-body); font-size:1rem; color:var(--ink-dark);
  padding:.75rem 1rem; border-radius:var(--radius-btn);
  border:1.5px solid var(--input-border); background:var(--white);
  resize:vertical; min-height:90px;
}
.profile-card textarea::placeholder{ color:var(--input-placeholder); }
.profile-card textarea:focus{ outline:none; border-color:var(--saffron); border-width:2px; box-shadow:0 0 0 3px rgba(232,101,10,0.15); }
.profile-card .btn-primary{ max-width:220px; }

/* ---------------- Settings ---------------- */
.settings-card{
  background:var(--off-white); border-radius:var(--radius-m);
  border:1px solid rgba(93,64,55,0.1); box-shadow:var(--shadow-s);
  padding:.4rem 1.6rem; max-width:640px; margin-bottom:1rem;
}
.settings-row{
  display:flex; align-items:center; justify-content:space-between;
  padding:1.05rem 0; border-bottom:1px solid rgba(93,64,55,0.08);
  gap:1rem;
}
.settings-row:last-child{ border-bottom:none; }
.settings-row h4{ margin:0 0 .2rem; font-family:var(--font-card-h); font-weight:400; font-size:1rem; color:var(--stone); }
.settings-row p{ margin:0; font-family:var(--font-body); font-size:.8125rem; color:var(--stone-mid); }

.switch{ position:relative; width:44px; height:25px; flex-shrink:0; }
.switch input{ opacity:0; width:0; height:0; }
.switch .track{
  position:absolute; inset:0; background:#E4D9BE; border-radius:999px; cursor:pointer; transition:background .2s ease;
}
.switch .track::before{
  content:""; position:absolute; width:19px; height:19px; left:3px; top:3px;
  background:var(--white); border-radius:50%; transition:transform .2s ease; box-shadow:var(--shadow-s);
}
.switch input:checked + .track{ background:var(--saffron); }
.switch input:checked + .track::before{ transform:translateX(19px); }
.switch input:focus-visible + .track{ outline:2px solid var(--forest); outline-offset:2px; }

/* ---------------- Modal ---------------- */
.modal-overlay{
  position:fixed; inset:0; background:rgba(35,43,22,0.55);
  backdrop-filter:blur(3px);
  display:none; align-items:center; justify-content:center;
  z-index:60; padding:1.2rem;
}
.modal-overlay.open{ display:flex; }
.modal{
  background:var(--off-white); border-radius:var(--radius-m);
  width:100%; max-width:480px; max-height:88vh; overflow-y:auto;
  padding:1.8rem 1.8rem 1.6rem;
  box-shadow:var(--shadow-xl);
  animation: cardIn .3s var(--ease) both;
}
.modal-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:1.1rem; }
.modal-head h3{ font-family:var(--font-h); font-weight:500; font-size:1.2rem; color:var(--stone); margin:0; }
.modal-close{ background:none; border:none; cursor:pointer; color:var(--stone-mid); padding:.3rem; }
.modal-close svg{ width:20px; height:20px; }
.modal-close:hover{ color:var(--saffron-dark); }
.modal select{
  width:100%;
  min-height:48px;
  font-family:var(--font-body); font-size:1rem; color:var(--ink-dark);
  padding:.75rem 1rem; border-radius:var(--radius-btn);
  border:1.5px solid var(--input-border); background:var(--white);
  appearance:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23E8650A' stroke-width='2.4'><polyline points='6 9 12 15 18 9'/></svg>");
  background-repeat:no-repeat;
  background-position:right 1rem center;
  background-size:16px;
  padding-right:2.6rem;
}
.modal select:focus{ outline:none; border-color:var(--saffron); border-width:2px; box-shadow:0 0 0 3px rgba(232,101,10,0.15); }
.two-col{ display:grid; grid-template-columns:1fr 1fr; gap:0 1rem; }

/* ---------------- Toast ---------------- */
.toast{
  position:fixed; bottom:1.4rem; right:1.4rem;
  background:var(--forest); color:var(--parchment);
  padding:.85rem 1.2rem; border-radius:var(--radius-s);
  box-shadow:var(--shadow-l); font-size:.86rem; font-weight:600;
  display:flex; align-items:center; gap:.6rem;
  transform:translateY(20px); opacity:0; pointer-events:none;
  transition:transform .25s var(--ease), opacity .25s var(--ease);
  z-index:80;
}
.toast.show{ transform:translateY(0); opacity:1; }
.toast svg{ width:16px; height:16px; color:var(--saffron); flex-shrink:0; }

@media (max-width:900px){
  .toast{ bottom: calc(5rem + env(safe-area-inset-bottom)); left:1rem; right:1rem; }
}

/* ---------------- Responsive: dashboard ---------------- */
@media (max-width:1080px){
  .stats-grid{ grid-template-columns:repeat(2,1fr); }
}

@media (max-width:900px){
  .sidebar{ transform:translateX(-100%); }
  .sidebar.open{ transform:translateX(0); box-shadow:var(--shadow-xl); }
  .sidebar-overlay.open{ display:block; }
  .main-area{ margin-left:0; }
  .hamburger{ display:flex; }
  .form-grid{ grid-template-columns:1fr; }
  .two-col{ grid-template-columns:1fr; }
}

@media (max-width:640px){
  .topbar{ padding:.9rem 1.1rem; }
  .content{ padding:1.3rem 1.1rem 3rem; }
  .stats-grid{ grid-template-columns:1fr 1fr; gap:.7rem; }
  .user-chip .u-name{ display:none; }
  .welcome-banner{ padding:1.4rem 1.3rem; }
  .profile-card, .settings-card{ padding:1.3rem 1.2rem; }
}

@media (max-width:420px){
  .stats-grid{ grid-template-columns:1fr; }
  .trip-grid, .saved-grid, .companion-grid{ grid-template-columns:1fr; }
}

/* ============================================================
   DASHBOARD — ADVANCED MODULES
   ============================================================ */

/* Notification bell in topbar */
.bell-btn{
  position:relative;
  width:38px; height:38px;
  border-radius:50%;
  border:1px solid rgba(93,64,55,0.12);
  background:var(--white);
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; flex-shrink:0;
}
.bell-btn svg{ width:18px; height:18px; color:var(--stone); }
.bell-btn .badge{
  position:absolute; top:-4px; right:-4px;
  min-width:16px; height:16px; padding:0 3px;
  background:var(--saffron); color:#fff;
  font-size:.62rem; font-weight:800;
  border-radius:999px; display:flex; align-items:center; justify-content:center;
  border:2px solid var(--parchment);
}
.topbar-actions{ display:flex; align-items:center; gap:.7rem; }

.nav-link{ position:relative; }
.nav-badge{
  margin-left:auto; background:var(--saffron); color:#fff;
  font-size:.68rem; font-weight:800; padding:.1rem .4rem;
  border-radius:999px; line-height:1.4;
}

/* ---------------- Overview layout ---------------- */
.overview-grid{ display:grid; grid-template-columns:2fr 1fr; gap:1.4rem; align-items:start; }

.side-card{
  background:var(--off-white); border-radius:var(--radius-m);
  border:1px solid rgba(93,64,55,0.1); box-shadow:var(--shadow-s);
  padding:1.3rem 1.3rem 1.5rem;
}
.side-card h3{ font-family:var(--font-h); font-weight:500; font-size:1.1rem; color:var(--stone); margin:0 0 .9rem; }

/* District progress */
.district-progress-bar{
  height:8px; border-radius:999px; background:#EFE3C4; overflow:hidden; margin-bottom:.9rem;
}
.district-progress-bar .fill{
  height:100%; border-radius:999px;
  background:linear-gradient(90deg, var(--saffron), var(--gold));
  transition: width .4s var(--ease);
}
.district-chip-row{ display:flex; flex-wrap:wrap; gap:.45rem; }
.district-chip{
  font-size:.74rem; font-weight:700; padding:.32rem .65rem;
  border-radius:999px; border:1px solid rgba(93,64,55,0.15);
  color:var(--stone-mid); background:var(--white);
}
.district-chip.visited{
  background:rgba(46,125,50,0.12); color:var(--green); border-color:rgba(46,125,50,0.3);
}

/* Activity timeline */
.timeline{ list-style:none; margin:0; padding:0; }
.timeline li{
  display:flex; gap:.7rem; padding-bottom:1rem; position:relative;
}
.timeline li:not(:last-child)::before{
  content:""; position:absolute; left:5px; top:16px; bottom:0;
  width:1px; background:rgba(93,64,55,0.15);
}
.timeline .t-dot{
  width:11px; height:11px; border-radius:50%; margin-top:3px; flex-shrink:0;
  background:var(--saffron); box-shadow:0 0 0 3px rgba(232,101,10,0.15);
}
.timeline .t-text{ font-size:.83rem; color:var(--stone); line-height:1.4; }
.timeline .t-time{ display:block; font-size:.72rem; color:var(--stone-mid); margin-top:.15rem; }

/* ---------------- Chips (interests) ---------------- */
.chip-group{ display:flex; flex-wrap:wrap; gap:.55rem; }
.chip-select{
  font-family:var(--font-body); font-size:.8125rem; font-weight:600; letter-spacing:.3px;
  padding:.5rem .95rem;
  border-radius:999px; border:1.5px solid var(--input-border); background:var(--white);
  color:var(--stone); cursor:pointer; transition:.15s ease;
}
.chip-select.selected{
  background:var(--saffron);
  color:#fff; border-color:transparent;
}

/* ---------------- Rewards ---------------- */
.tier-card{
  background:linear-gradient(120deg, var(--forest), #3a4a26);
  border-radius:var(--radius-l); padding:1.8rem 2rem; color:var(--parchment);
  box-shadow:var(--shadow-m); position:relative; overflow:hidden; margin-bottom:1.6rem;
}
.tier-card::before{
  content:""; position:absolute; right:-30px; bottom:-50px; width:200px; height:200px;
  border-radius:50%; background:radial-gradient(circle, rgba(201,150,12,0.35), transparent 70%);
}
.tier-card .tier-name{ font-family:var(--font-h); font-weight:600; letter-spacing:.5px; font-size:1.5rem; color:var(--white); margin:0 0 .2rem; position:relative; z-index:1; }
.tier-card .tier-points{ font-family:var(--font-mono); font-size:.9rem; color:var(--gold); margin:0 0 1rem; position:relative; z-index:1; }
.tier-card .district-progress-bar{ background:rgba(255,248,225,0.18); position:relative; z-index:1; }
.tier-card .tier-next{ font-family:var(--font-body); font-size:.8125rem; color:rgba(255,248,225,0.7); margin-top:.5rem; position:relative; z-index:1; }

.rewards-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; margin-bottom:1.6rem; }
.reward-item{
  background:var(--off-white); border:1px solid rgba(93,64,55,0.1); border-radius:var(--radius-m);
  padding:1.1rem; text-align:center; box-shadow:var(--shadow-s);
}
.reward-item .r-num{ font-family:var(--font-mono); font-weight:600; font-size:1.4rem; color:var(--saffron-dark); }
.reward-item .r-label{ font-family:var(--font-body); font-size:.8125rem; color:var(--stone-mid); margin-top:.2rem; }

/* ---------------- Bookings ---------------- */
.booking-row{
  display:flex; align-items:center; gap:1rem;
  background:var(--off-white); border:1px solid rgba(93,64,55,0.1); border-radius:var(--radius-m);
  padding:1rem 1.15rem; margin-bottom:.8rem; box-shadow:var(--shadow-s);
}
.booking-icon{
  width:42px; height:42px; border-radius:10px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  background:rgba(232,101,10,0.12); color:var(--saffron-dark);
}
.booking-icon svg{ width:20px; height:20px; }
.booking-info{ flex:1; min-width:0; }
.booking-info h4{ margin:0 0 .15rem; font-family:var(--font-card-h); font-weight:400; font-size:1.02rem; color:var(--stone); }
.booking-info p{ margin:0; font-family:var(--font-body); font-size:.8125rem; color:var(--stone-mid); }
.booking-amount{ font-family:var(--font-mono); font-weight:600; color:var(--stone); font-size:.95rem; white-space:nowrap; }
.badge-status{
  font-family:var(--font-body); font-size:.7rem; font-weight:700; letter-spacing:.4px; padding:.25rem .6rem; border-radius:999px; text-transform:uppercase;
  white-space:nowrap;
}
.badge-status.confirmed{ background:rgba(46,125,50,0.14); color:var(--green); }
.badge-status.pending{ background:rgba(201,150,12,0.16); color:var(--gold); }
.badge-status.cancelled{ background:rgba(179,38,30,0.12); color:var(--error-red); }
.booking-actions{ display:flex; gap:.4rem; flex-shrink:0; }
.booking-actions button{
  background:none; border:1px solid rgba(93,64,55,0.15); border-radius:8px;
  width:32px; height:32px; display:flex; align-items:center; justify-content:center; cursor:pointer; color:var(--stone-mid);
}
.booking-actions button:hover{ border-color:var(--saffron); color:var(--saffron-dark); }
.booking-actions svg{ width:15px; height:15px; }

@media (max-width:640px){
  .booking-row{ flex-wrap:wrap; gap:.6rem .8rem; }
  .booking-icon{ order:0; }
  .booking-info{ order:1; flex:1 1 100%; }
  .booking-amount{ order:2; }
  .badge-status{ order:3; }
  .booking-actions{ order:4; margin-left:auto; }
}

/* ---------------- Notifications ---------------- */
.notif-item{
  display:flex; gap:.85rem; align-items:flex-start;
  background:var(--off-white); border:1px solid rgba(93,64,55,0.1); border-radius:var(--radius-m);
  padding:1rem 1.1rem; margin-bottom:.7rem; cursor:pointer; box-shadow:var(--shadow-s);
  transition: background .15s ease;
}
.notif-item.unread{ background:linear-gradient(90deg, rgba(232,101,10,0.06), var(--off-white) 40%); border-left:3px solid var(--saffron); }
.notif-item .n-dot{ width:9px; height:9px; border-radius:50%; margin-top:6px; background:var(--saffron); flex-shrink:0; }
.notif-item.read .n-dot{ background:transparent; }
.notif-item h4{ margin:0 0 .2rem; font-family:var(--font-card-h); font-weight:400; font-size:.98rem; color:var(--stone); }
.notif-item p{ margin:0; font-family:var(--font-body); font-size:.85rem; color:var(--ink-dark); }
.notif-item .n-time{ font-family:var(--font-body); font-size:.75rem; color:var(--stone-mid); margin-top:.3rem; display:block; }
.notif-toolbar{ display:flex; gap:.6rem; margin-bottom:1rem; }

/* ---------------- Companions & documents ---------------- */
.companion-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:.9rem; margin-bottom:.5rem; }
.companion-card{
  background:var(--white); border:1px solid rgba(93,64,55,0.1); border-radius:var(--radius-s);
  padding:.9rem; display:flex; align-items:center; gap:.7rem;
}
.companion-card .avatar{ width:38px; height:38px; font-size:.8rem; }
.companion-card h5{ margin:0; font-family:var(--font-card-h); font-weight:400; font-size:.95rem; color:var(--stone); }
.companion-card p{ margin:0; font-family:var(--font-body); font-size:.78rem; color:var(--stone-mid); }
.companion-card .remove-companion{ margin-left:auto; background:none; border:none; color:var(--error-red); cursor:pointer; }
.companion-card .remove-companion svg{ width:15px; height:15px; }

.document-row{
  display:flex; align-items:center; gap:.8rem;
  padding:.85rem 0; border-bottom:1px solid rgba(93,64,55,0.08);
}
.document-row:last-child{ border-bottom:none; }
.doc-icon{ width:36px; height:36px; border-radius:8px; background:rgba(93,64,55,0.08); display:flex; align-items:center; justify-content:center; color:var(--stone); flex-shrink:0; }
.doc-icon svg{ width:17px; height:17px; }
.document-row .doc-name{ font-family:var(--font-body); font-size:.875rem; font-weight:600; color:var(--stone); }
.document-row .doc-type{ font-family:var(--font-body); font-size:.78rem; color:var(--stone-mid); }
.document-row .remove-doc{ margin-left:auto; background:none; border:none; color:var(--error-red); cursor:pointer; }

.verify-badge{
  display:inline-flex; align-items:center; gap:.3rem;
  font-size:.72rem; font-weight:800; padding:.25rem .6rem; border-radius:999px;
}
.verify-badge.verified{ background:rgba(46,125,50,0.14); color:var(--green); }
.verify-badge.pending{ background:rgba(201,150,12,0.16); color:var(--gold); }
.verify-badge svg{ width:12px; height:12px; }

/* ---------------- Drawer (trip detail) ---------------- */
.drawer-overlay{
  position:fixed; inset:0; background:rgba(35,43,22,0.5); backdrop-filter:blur(2px);
  display:none; z-index:70; justify-content:flex-end;
}
.drawer-overlay.open{ display:flex; }
.drawer{
  width:100%; max-width:520px; height:100%; background:var(--parchment);
  overflow-y:auto; box-shadow:var(--shadow-xl);
  animation: drawerIn .3s var(--ease) both;
  padding: 1.6rem 1.7rem 3rem;
}
@keyframes drawerIn{ from{ transform:translateX(30px); opacity:0;} to{ transform:translateX(0); opacity:1; } }

.drawer-head{ display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:1rem; }
.drawer-head h3{ font-family:var(--font-h); font-weight:500; font-size:1.25rem; color:var(--stone); margin:0 0 .2rem; }
.drawer-head p{ margin:0; font-family:var(--font-body); font-size:.8125rem; color:var(--stone-mid); }

.drawer-tabs{ display:flex; gap:.4rem; margin-bottom:1.2rem; border-bottom:1px solid rgba(93,64,55,0.12); }
.drawer-tab{
  background:none; border:none; padding:.6rem .9rem; font-size:.85rem; font-weight:700;
  color:var(--stone-mid); cursor:pointer; border-bottom:2px solid transparent; margin-bottom:-1px;
}
.drawer-tab.active{ color:var(--saffron-dark); border-bottom-color:var(--saffron); }
.drawer-pane{ display:none; }
.drawer-pane.active{ display:block; }

.day-item{
  background:var(--white); border:1px solid rgba(93,64,55,0.1); border-radius:var(--radius-s);
  padding:.8rem .9rem; margin-bottom:.6rem; display:flex; justify-content:space-between; gap:.6rem; align-items:flex-start;
}
.day-item .d-label{ font-family:var(--font-body); font-size:.72rem; font-weight:700; color:var(--gold); text-transform:uppercase; letter-spacing:.4px; }
.day-item h5{ margin:.2rem 0 .15rem; font-family:var(--font-card-h); font-weight:400; font-size:.98rem; color:var(--stone); }
.day-item p{ margin:0; font-family:var(--font-body); font-size:.82rem; color:var(--stone-mid); }
.day-item button{ background:none; border:none; color:var(--error-red); cursor:pointer; flex-shrink:0; }

.expense-row{ display:flex; justify-content:space-between; align-items:center; padding:.6rem 0; border-bottom:1px solid rgba(93,64,55,0.08); font-family:var(--font-body); font-size:.875rem; color:var(--ink-dark); }
.expense-row:last-child{ border-bottom:none; }
.expense-total{ display:flex; justify-content:space-between; font-family:var(--font-mono); font-weight:600; color:var(--stone); padding-top:.8rem; font-size:1rem; }

.inline-form{ display:flex; gap:.5rem; margin-top:.8rem; flex-wrap:wrap; }
.inline-form input, .inline-form select{
  font-family:var(--font-body); font-size:.875rem; color:var(--ink-dark); padding:.6rem .8rem;
  border-radius:var(--radius-btn); border:1.5px solid var(--input-border); background:var(--white);
}
.inline-form input::placeholder{ color:var(--input-placeholder); }
.inline-form input:focus, .inline-form select:focus{ outline:none; border-color:var(--saffron); border-width:2px; }
.inline-form .grow{ flex:1; min-width:120px; }
.inline-form button{ flex-shrink:0; }

.companion-pick{ display:flex; align-items:center; gap:.6rem; padding:.55rem 0; }
.companion-pick input{ width:16px; height:16px; accent-color:var(--saffron); }

@media (max-width:1080px){ .overview-grid{ grid-template-columns:1fr; } }
@media (max-width:640px){ .rewards-grid{ grid-template-columns:1fr; } .drawer{ max-width:100%; padding:1.3rem 1.1rem 2.5rem; } }

/* ============================================================
   MODERN REFRESH — mobile bottom nav, glass surfaces, fluid type
   ============================================================ */

/* Mobile bottom tab bar (dashboard) — hidden on desktop */
.bottom-nav{
  display:none;
  position:fixed; left:0; right:0; bottom:0; z-index:30;
  background:rgba(255,248,225,0.92);
  backdrop-filter:saturate(180%) blur(14px);
  border-top:1px solid rgba(93,64,55,0.1);
  padding: .5rem .5rem calc(.5rem + env(safe-area-inset-bottom));
  box-shadow: 0 -8px 24px -12px rgba(46,58,30,0.18);
}
.bottom-nav-inner{ display:flex; justify-content:space-around; align-items:center; }
.bottom-nav-item{
  display:flex; flex-direction:column; align-items:center; gap:.2rem;
  background:none; border:none; color:var(--stone-mid); font-family:var(--font-body);
  font-size:.66rem; font-weight:700; padding:.3rem .5rem; cursor:pointer;
  min-width:52px;
}
.bottom-nav-item svg{ width:21px; height:21px; }
.bottom-nav-item.active{ color:var(--saffron-dark); }
.bottom-nav-item .bn-dot{
  position:relative;
}
.bottom-nav-item .bn-dot::after{
  content:""; position:absolute; top:-2px; right:-4px; width:7px; height:7px;
  border-radius:50%; background:var(--saffron); display:none;
}
.bottom-nav-item .bn-dot.has-badge::after{ display:block; }

@media (max-width:900px){
  .bottom-nav{ display:block; }
  .content{ padding-bottom: 5.5rem; }
}

/* Fluid type scale so headings never feel cramped on small phones */
.page-title{ font-size: clamp(1.05rem, 4vw, 1.35rem); }
.welcome-banner h2{ font-size: clamp(1.2rem, 4.2vw, 1.5rem); }
.tier-card .tier-name{ font-size: clamp(1.2rem, 4vw, 1.5rem); }

/* Slightly softer, more contemporary card borders — shadow does the work */
.stat-card, .trip-card, .saved-card, .booking-row, .notif-item,
.profile-card, .settings-card, .side-card, .companion-card, .reward-item{
  border-color: rgba(93,64,55,0.07);
}

/* Modern touch-friendly tap targets on small screens */
@media (max-width:640px){
  .nav-link{ padding:.85rem 1.5rem; }
  .btn, .icon-btn, .chip-select{ min-height:44px; }
  .stat-card{ padding:1rem; }
  .stat-card .stat-num{ font-size:1.35rem; }
  .trip-actions{ flex-wrap:wrap; }
  .trip-actions .icon-btn{ flex:1 1 auto; min-width:70px; }
  .modal{ padding:1.5rem 1.3rem 1.4rem; border-radius:var(--radius-m) var(--radius-m) 0 0; }
  .modal-overlay{ align-items:flex-end; padding:0; }
  .modal-overlay .modal{ max-height:92vh; animation:sheetIn .3s var(--ease) both; }
}
@keyframes sheetIn{ from{ transform:translateY(30px); opacity:0;} to{ transform:translateY(0); opacity:1; } }

@media (max-width:380px){
  .stats-grid{ gap:.55rem; }
  .stat-card{ padding:.8rem; }
  .welcome-banner{ padding:1.2rem 1.1rem; }
  .page-sub{ display:none; }
}

/* Flex text-containers need min-width:0 to actually shrink instead of
   forcing their siblings out of the row on narrow screens */
.topbar-left, .topbar-left > div, .booking-info, .notif-item > div{ min-width:0; }

/* Auth pages: trim the heritage panel on small screens so the form
   is reachable without excess scrolling, while keeping the identity */
@media (max-width:600px){
  .panel{ padding: 1.6rem 1.3rem 0; }
  .fact-list{ display:none; }
  .panel-quote{ display:none; }
  .panel-copy{ margin-top:1.4rem; }
  .skyline{ max-height:90px; }
}

@media (max-width:900px) and (min-width:601px){
  .fact-list{ gap:.6rem; }
}

/* ============================================================
   BRAND GUIDE COMPLIANCE — remaining utility classes
   ============================================================ */
.subsection-title{
  font-family:var(--font-h);
  font-weight:500;
  letter-spacing:.3px;
  font-size:1.05rem;
  line-height:1.3;
  color:var(--stone);
  margin:0 0 1rem;
}
.subsection-title.tight{ margin:0; }

/* Pull-quote utility, reusable anywhere in editorial content */
.pull-quote{
  font-family:var(--font-quote);
  font-style:italic;
  font-size:1.25rem;
  line-height:1.5;
  color:var(--stone);
  border-left:2px solid var(--gold);
  padding:.2rem 0 .2rem 1rem;
  margin:1rem 0;
}

/* Mono utility for any inline figure/data value */
.mono-num{ font-family:var(--font-mono); font-weight:500; }

/* Success state text, per color-rule table */
.text-success{ color:var(--green); }
.text-error{ color:var(--error-red); }
