/* ═══════════════════════════════════════════════
   WANDERLUST APP SHELL — shared across all pages
   Bottom-tab nav + sticky appbar. Does NOT touch
   any page's booking logic; purely presentational.
   ═══════════════════════════════════════════════ */
:root{
  --wls-sea-deep:#071a2e; --wls-sea:#0b2742;
  --wls-sun-glow:#ffce6b; --wls-sun-deep:#e87a26;
  --wls-txt:#eaf1f8; --wls-txt2:#9fb3c8; --wls-txt3:#5f7590;
  --wls-line:rgba(255,255,255,.10);
  --wls-tabh:64px;
}

/* make room for the tab bar on every page */
body{padding-bottom:var(--wls-tabh)!important;}

/* ── sticky appbar (replaces the mounted top nav look) ── */
.wls-appbar{
  position:sticky;top:0;z-index:80;
  background:linear-gradient(180deg,var(--wls-sea-deep) 70%,rgba(7,26,46,0));
  padding:12px 18px 12px;display:flex;align-items:center;gap:12px;
  backdrop-filter:blur(6px);
}
.wls-appbar .wls-back{
  width:34px;height:34px;border-radius:50%;
  background:rgba(255,255,255,.08);border:1px solid var(--wls-line);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
  text-decoration:none;
}
.wls-appbar .wls-back svg{width:17px;height:17px;stroke:var(--wls-txt);fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;}
.wls-appbar .wls-title{font-family:'Fraunces',serif;font-weight:600;font-size:17px;color:var(--wls-txt);letter-spacing:-.3px;}
.wls-appbar .wls-title em{color:var(--wls-sun-glow);font-style:normal;}
.wls-appbar .wls-loc{margin-left:auto;font-size:12px;color:var(--wls-txt2);display:flex;align-items:center;gap:5px;}
.wls-appbar .wls-loc svg{width:13px;height:13px;stroke:var(--wls-sun-glow);fill:none;stroke-width:2;}

/* ── bottom tab bar ── */
.wls-tabbar{
  position:fixed;bottom:0;left:50%;transform:translateX(-50%);
  width:100%;max-width:560px;height:var(--wls-tabh);
  background:rgba(11,39,66,.94);backdrop-filter:blur(16px);
  border-top:1px solid var(--wls-line);
  display:flex;z-index:1000;padding-bottom:env(safe-area-inset-bottom);
}
.wls-tab{
  flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:3px;color:var(--wls-txt3);font-size:10px;font-weight:600;
  cursor:pointer;background:none;border:none;font-family:inherit;text-decoration:none;
  transition:color .15s;
}
.wls-tab svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.wls-tab.active{color:var(--wls-sun-glow);}
.wls-tab:active{transform:scale(.94);}

/* ── "check booking" modal ── */
.wls-modal{position:fixed;inset:0;z-index:1100;background:rgba(7,26,46,.75);backdrop-filter:blur(6px);display:none;align-items:flex-end;justify-content:center;}
.wls-modal.open{display:flex;}
.wls-sheet{background:var(--wls-sea);width:100%;max-width:480px;border-radius:20px 20px 0 0;padding:22px 22px calc(28px + env(safe-area-inset-bottom));border-top:1px solid var(--wls-line);}
.wls-sheet h3{font-family:'Fraunces',serif;font-size:20px;color:var(--wls-txt);margin:0 0 6px;}
.wls-sheet p{font-size:13px;color:var(--wls-txt2);line-height:1.5;margin:0 0 16px;}
.wls-sheet a.wls-wa{display:flex;align-items:center;justify-content:center;gap:10px;background:#25d366;color:#fff;font-weight:700;font-size:15px;padding:15px;border-radius:14px;text-decoration:none;}
.wls-sheet a.wls-wa svg{width:22px;height:22px;fill:#fff;}
.wls-sheet .wls-close{width:100%;text-align:center;margin-top:12px;background:none;border:none;color:var(--wls-txt3);font-size:13px;cursor:pointer;font-family:inherit;padding:8px;}