/* World Beyond Home planner header: the same dusk bar as the rest of the site. Loaded last by the planner page.
   The planner's light theme targets ".top" through "html body:is(...):not(#ft-light)", so these selectors carry two
   :not(#id) clauses to outrank it. */
html body:not(#wl-a):not(#wl-b) header.top{background:rgba(22,36,58,.97)!important;border-bottom:1px solid rgba(240,180,80,.22)!important;box-shadow:0 8px 28px rgba(12,20,36,.18);color:#fff!important}
html body:not(#wl-a):not(#wl-b) header.top .brand,html body:not(#wl-a):not(#wl-b) header.top .brand .wl-wordmark span{color:#fff!important}
/* Trip summary on the dark bar: the trip name as a soft chip, actions as outline buttons (their own backgrounds were white). */
html body:not(#wl-a):not(#wl-b) header.top .trip-sum{color:#e6eaf2!important}
html body:not(#wl-a):not(#wl-b) header.top .trip-sum .where{background:rgba(255,255,255,.1)!important;color:#fff!important;border:1px solid rgba(255,255,255,.18)!important;box-shadow:none!important}
html body:not(#wl-a):not(#wl-b) header.top .trip-sum .where *{color:#fff!important}
html body:not(#wl-a):not(#wl-b) header.top .trip-sum :is(button,a):not(.where):not(.tok),
html body:not(#wl-a):not(#wl-b) header.top #account-open{background:transparent!important;color:#e6eaf2!important;border:1px solid rgba(255,255,255,.35)!important;box-shadow:none!important;opacity:1!important}
html body:not(#wl-a):not(#wl-b) header.top .trip-sum :is(button,a):not(.where):not(.tok):hover,
html body:not(#wl-a):not(#wl-b) header.top #account-open:hover{background:rgba(255,255,255,.1)!important;color:#fff!important;border-color:rgba(255,255,255,.6)!important}
html body:not(#wl-a):not(#wl-b) header.top .trip-sum :is(button,a):disabled{opacity:.55!important;cursor:default}
/* Tabs sit flush under the header on a solid surface, so page content never shows through or peeks around them. */
html body:not(#wl-a):not(#wl-b) .tabs{top:62px!important;background:#fbf7ef!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
/* The old square logo had a ring and shadow; the World Beyond Home mark is a cut-out figure and needs neither. */
html body:not(#wl-a):not(#wl-b) header.top .brand img{box-shadow:none!important;border-radius:0!important}
header.top a:focus-visible,header.top button:focus-visible{outline:3px solid var(--wl-lantern-hi,#e2c894);outline-offset:2px}
/* Pass 1 (Nov 2026): one primary action and one menu. Share is the only filled button; everything else sits under More. */
html body:not(#wl-a):not(#wl-b) header.top .trip-sum #tShare{background:var(--wl-lantern,#c8a46a)!important;color:var(--wl-ink,#0e1a2b)!important;border:1px solid var(--wl-lantern,#c8a46a)!important;font-weight:700}
html body:not(#wl-a):not(#wl-b) header.top .trip-sum #tShare:hover{background:#ffc566!important;border-color:#ffc566!important;color:var(--wl-ink,#0e1a2b)!important}
html body:not(#wl-a):not(#wl-b) header.top .top-in:has(.top-more) #account-open{display:none!important}
.top-more{position:relative}
.top-more>summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:2px}
.top-more>summary::-webkit-details-marker{display:none}
html body:not(#wl-a):not(#wl-b) header.top .trip-sum .top-more>summary{background:transparent!important;color:#e6eaf2!important;border:1px solid rgba(255,255,255,.35)!important;border-radius:999px}
html body:not(#wl-a):not(#wl-b) header.top .trip-sum .top-more[open]>summary{background:rgba(255,255,255,.12)!important;color:#fff!important}
.top-menu{position:absolute;right:0;top:calc(100% + 8px);z-index:60;min-width:210px;padding:6px;border-radius:14px;background:#fffdf8;border:1px solid #eadfc8;box-shadow:0 18px 40px rgba(12,20,36,.22);display:grid}
html body:not(#wl-a):not(#wl-b) header.top #tripSum .top-menu button{all:unset;box-sizing:border-box;display:block;width:100%;padding:11px 14px;border-radius:10px;font:600 15px/1.2 var(--body,system-ui);color:var(--wl-ink,#0e1a2b)!important;background:transparent!important;border:0!important;cursor:pointer}
html body:not(#wl-a):not(#wl-b) header.top #tripSum .top-menu button:hover,
html body:not(#wl-a):not(#wl-b) header.top #tripSum .top-menu button:focus-visible{background:#f6efe2!important;color:var(--wl-ink,#0e1a2b)!important;outline:none}
html body:not(#wl-a):not(#wl-b) header.top #tripSum .top-menu #tNext{border-top:1px solid #eadfc8!important;border-radius:0 0 10px 10px;margin-top:4px;color:#2f6b57!important}
/* The More menu drops down over the sticky step tabs (z-index 40), so the header must stack above them. On phones the
   header is static (familytrip-planner-light.css); relative keeps the same layout but lets its z-index apply. */
html body:not(#wl-a):not(#wl-b) header.top{z-index:50!important}
@media (max-width:640px){html body:not(#wl-a):not(#wl-b) header.top{position:relative!important}}
/* Trip card was hidden on phones to save header space; inside the More menu it costs none. */
html body:not(#wl-a):not(#wl-b) header.top #tripSum .top-menu #tCard{display:block!important}
