/* TrailHikers UI kit — popover, calendar, select, pills. Brand: ink #1E3447, teal #00B7C2 → green gradient. */
:root{
  --thui-ink:var(--ink,#1E3447);
  --thui-muted:#6B7C88;
  --thui-line:#E3E6E8;
  --thui-soft:#F4F7F8;
  --thui-teal:#007B8C;
  --thui-accent:var(--accent,#00B7C2);
  --thui-grad:var(--brand-gradient,linear-gradient(110deg,#007B8C 0%,#00B7A9 55%,#1DB954 100%));
  --thui-ring:0 0 0 4px rgba(0,183,194,.16);
  --thui-shadow:0 30px 70px -12px rgba(15,30,41,.28),0 8px 24px rgba(15,30,41,.08);
}

/* ---------- popover ---------- */
.thui-backdrop{position:fixed;inset:0;z-index:9998;background:transparent;pointer-events:none}
.thui-backdrop.is-sheet{background:rgba(9,20,28,0);pointer-events:auto;transition:background .2s}
.thui-backdrop.is-sheet.is-in{background:rgba(9,20,28,.45)}
.thui-pop{position:absolute;z-index:9999;background:#fff;border-radius:20px;border:1px solid rgba(30,52,71,.08);box-shadow:var(--thui-shadow);opacity:0;transform:translateY(-6px) scale(.985);transform-origin:top left;transition:opacity .18s ease,transform .18s cubic-bezier(.2,.8,.3,1);font-family:Archivo,system-ui,sans-serif;color:var(--thui-ink)}
.thui-pop.is-in{opacity:1;transform:none}
.thui-pop--sheet{position:fixed;left:0!important;right:0;bottom:0;top:auto!important;border-radius:22px 22px 0 0;max-height:86vh;overflow:auto;transform:translateY(100%);padding-bottom:env(safe-area-inset-bottom)}
.thui-pop--sheet.is-in{transform:none}
.thui-pop--sheet::before{content:'';display:block;width:42px;height:4px;border-radius:4px;background:#D5DBDF;margin:10px auto 2px}

/* ---------- buttons, chips, links ---------- */
.thui-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 20px;border:0;border-radius:12px;background:var(--thui-grad);color:#fff;font:700 14px Archivo,sans-serif;letter-spacing:.02em;cursor:pointer;box-shadow:0 12px 24px -10px rgba(0,183,169,.75);transition:transform .2s,box-shadow .2s,filter .2s}
.thui-btn:hover{transform:translateY(-1px);filter:brightness(1.05)}
.thui-btn--sm{height:36px;padding:0 16px;font-size:13px;border-radius:10px}
.thui-link{border:0;background:none;padding:6px 4px;color:var(--thui-muted);font:700 13px Archivo,sans-serif;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.thui-link:hover{color:var(--thui-ink)}
.thui-link[hidden]{display:none}
.thui-chip{display:inline-flex;align-items:center;gap:7px;height:36px;padding:0 14px;border-radius:999px;border:1.5px solid var(--thui-line);background:#fff;color:var(--thui-ink);font:700 13px Archivo,sans-serif;white-space:nowrap;cursor:pointer;transition:border-color .2s,background .2s,color .2s,box-shadow .2s,transform .2s}
.thui-chip:hover{border-color:rgba(0,183,194,.6);transform:translateY(-1px)}
.thui-chip.is-on{background:var(--thui-grad);border-color:transparent;color:#fff;box-shadow:0 10px 20px -10px rgba(0,183,169,.8)}
.thui-chip svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* ---------- calendar ---------- */
.thui-cal{position:relative;padding:18px 18px 14px;width:max-content;max-width:100%;user-select:none}
.thui-pop--sheet .thui-cal{width:100%;padding:8px 16px 18px}
.thui-cal__head{position:absolute;left:14px;right:14px;top:14px;display:flex;justify-content:space-between;pointer-events:none;z-index:1}
.thui-pop--sheet .thui-cal__head{top:6px}
.thui-cal__nav{pointer-events:auto;width:36px;height:36px;border-radius:50%;border:1.5px solid var(--thui-line);background:#fff;display:grid;place-items:center;cursor:pointer;transition:border-color .2s,background .2s}
.thui-cal__nav:hover:not(:disabled){border-color:var(--thui-accent);background:#EAF7F6}
.thui-cal__nav:disabled{opacity:.35;cursor:default}
.thui-cal__nav svg{width:16px;height:16px;fill:none;stroke:var(--thui-ink);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.thui-cal__months{display:flex;gap:28px}
.thui-cal__month{width:294px}
.thui-pop--sheet .thui-cal__month{width:100%}
.thui-cal__title{height:36px;display:flex;align-items:center;justify-content:center;gap:6px;font:800 15.5px Archivo,sans-serif;letter-spacing:-.01em}
.thui-cal__title span{color:var(--thui-muted);font-weight:600}
.thui-cal__grid{display:grid;grid-template-columns:repeat(7,1fr);row-gap:4px;margin-top:10px}
.thui-cal__wd{height:28px;display:grid;place-items:center;font:500 10.5px 'IBM Plex Mono',monospace;letter-spacing:.12em;text-transform:uppercase;color:#94A3AD}
.thui-day{position:relative;height:42px;border:0;background:none;padding:0;cursor:pointer;font:600 14px Archivo,sans-serif;color:var(--thui-ink);display:grid;place-items:center}
.thui-day span{position:relative;z-index:1;width:40px;height:40px;display:grid;place-items:center;border-radius:12px;transition:background .15s,color .15s,box-shadow .15s}
.thui-day:hover:not(:disabled) span{background:#EAF7F6;color:var(--thui-teal)}
.thui-day.is-today span{box-shadow:inset 0 0 0 1.5px rgba(0,123,140,.45)}
.thui-day.is-off{cursor:default;color:#C3CBD1}
.thui-day.is-off span{text-decoration:line-through;text-decoration-color:rgba(195,203,209,.7)}
.thui-day i{position:absolute;z-index:2;bottom:4px;left:50%;width:5px;height:5px;margin-left:-2.5px;border-radius:50%;background:var(--thui-accent)}
.thui-day.is-in::before,.thui-day.is-preview::before,.thui-day.is-start:not(.is-solo)::before,.thui-day.is-end::before{content:'';position:absolute;top:1px;bottom:1px;left:0;right:0;background:#E3F5F4}
.thui-day.is-preview::before{background:#F0F8F8}
.thui-day.is-start:not(.is-solo)::before{left:50%}
.thui-day.is-end::before{right:50%}
.thui-day.is-start.is-end::before{display:none}
.thui-day.is-start span,.thui-day.is-end span,.thui-day.is-sel span{background:var(--thui-grad)!important;color:#fff!important;box-shadow:0 8px 18px -8px rgba(0,123,140,.9)}
.thui-day.is-start i,.thui-day.is-end i,.thui-day.is-sel i{background:#fff}
.thui-cal__presets{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;padding-top:14px;border-top:1px dashed var(--thui-line)}
.thui-cal__foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px}
.thui-cal__hint{font:600 13px Archivo,sans-serif;color:var(--thui-muted)}

/* ---------- select ---------- */
.thui-sel{position:relative;width:100%}
.thui-sel__ctrl,.thui-datefield{width:100%;height:50px;display:flex;align-items:center;gap:10px;padding:0 14px 0 16px;border-radius:14px;border:1.5px solid var(--thui-line);background:#F7F9FA;color:var(--thui-ink);font:600 14.5px Archivo,sans-serif;text-align:left;cursor:pointer;transition:border-color .2s,box-shadow .2s,background-color .2s}
.thui-sel__ctrl:hover,.thui-datefield:hover{border-color:rgba(0,183,194,.55);background:#fff}
.thui-sel.is-open .thui-sel__ctrl,.thui-sel__ctrl:focus-visible,.thui-datefield[aria-expanded=true],.thui-datefield:focus-visible{outline:0;border-color:var(--thui-accent);background:#fff;box-shadow:var(--thui-ring)}
.thui-sel__body{flex:1;min-width:0;display:flex;align-items:center;gap:6px;overflow:hidden;white-space:nowrap}
.thui-sel__ph,.thui-datefield:not(.has-value) .thui-datefield__txt{color:#94A3AD;font-weight:600}
.thui-sel__val{overflow:hidden;text-overflow:ellipsis}
.thui-sel__chev{flex:0 0 auto;display:grid;place-items:center;width:20px;height:20px;transition:transform .25s}
.thui-sel__chev svg{width:18px;height:18px;fill:none;stroke:var(--thui-muted);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.thui-sel.is-open .thui-sel__chev,.thui-datefield[aria-expanded=true] .thui-sel__chev{transform:rotate(180deg)}
.thui-pill[hidden]{display:none}

.thui-pill{flex:0 1 auto;min-width:0;display:inline-flex;align-items:center;gap:4px;height:30px;padding:0 6px 0 11px;border-radius:999px;background:#E3F5F4;color:var(--thui-teal);font:700 12.5px Archivo,sans-serif}
.thui-pill > span:first-child{overflow:hidden;text-overflow:ellipsis}
.thui-pill__x{flex:0 0 auto;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;cursor:pointer;transition:background .15s}
.thui-pill__x:hover{background:rgba(0,123,140,.16)}
.thui-pill__x svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round}
.thui-pill--more{flex:0 0 auto;padding:0 10px;background:var(--thui-ink);color:#fff}
.thui-sel__panel{padding:8px;max-width:min(380px,calc(100vw - 24px))}
.thui-pop--sheet .thui-sel__panel{max-width:none;padding:6px 12px 14px}
.thui-sel__search{display:flex;align-items:center;gap:8px;height:42px;margin:2px 2px 8px;padding:0 12px;border-radius:11px;background:var(--thui-soft);border:1.5px solid transparent;transition:border-color .2s,background .2s}
.thui-sel__search:focus-within{border-color:var(--thui-accent);background:#fff}
.thui-sel__search svg{width:17px;height:17px;flex:0 0 auto;fill:none;stroke:var(--thui-muted);stroke-width:2.2;stroke-linecap:round}
.thui-sel__search input{flex:1;min-width:0;height:100%;border:0!important;outline:0;background:none!important;box-shadow:none!important;padding:0!important;font:600 14px Archivo,sans-serif;color:var(--thui-ink)}
.thui-sel__list{max-height:300px;overflow:auto;padding:2px;overscroll-behavior:contain}
.thui-opt{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:11px;cursor:pointer;font:600 14px Archivo,sans-serif;transition:background .12s}
.thui-opt:hover,.thui-opt.is-active{background:#F0F8F8}
.thui-opt.is-dim{opacity:.5}
.thui-opt__label{flex:1;min-width:0}
.thui-opt__count{min-width:26px;height:22px;padding:0 7px;border-radius:999px;background:var(--thui-soft);color:var(--thui-muted);font:700 11.5px Archivo,sans-serif;display:grid;place-items:center}
.thui-opt__box{flex:0 0 auto;width:20px;height:20px;border-radius:6px;border:1.8px solid #C9D1D6;display:grid;place-items:center;transition:background .15s,border-color .15s}
.thui-opt__box svg,.thui-opt__tick svg{width:13px;height:13px;fill:none;stroke:#fff;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;opacity:0}
.thui-opt.is-on .thui-opt__box{background:var(--thui-grad);border-color:transparent}
.thui-opt.is-on .thui-opt__box svg{opacity:1}
.thui-opt.is-on{color:var(--thui-teal)}
.thui-opt__tick svg{stroke:var(--thui-teal);opacity:1;width:16px;height:16px}
.thui-opt-empty{padding:18px 12px;color:var(--thui-muted);font:600 13.5px Archivo,sans-serif;text-align:center}
.thui-sel__foot{display:flex;align-items:center;justify-content:space-between;margin-top:6px;padding:8px 4px 2px;border-top:1px solid #EEF1F3}

/* ---------- date field (replaces <input type=date>) ---------- */
.thui-datefield__ico{display:grid;place-items:center}
.thui-datefield__ico svg{width:18px;height:18px;fill:none;stroke:var(--thui-teal);stroke-width:2;stroke-linecap:round}
.thui-datefield__txt{flex:1;min-width:0}

@media (max-width:640px){
  .thui-cal__months{gap:0}
  .thui-day{height:46px}
  .thui-day span{width:42px;height:42px}
}
@media (prefers-reduced-motion:reduce){.thui-pop,.thui-day span,.thui-chip{transition:none}}

/* ---------- tours archive: instant filter bar (assets/th-tours.js) ---------- */
.th-tf{display:flex;flex-direction:column;width:100%}
.th-tf__row{display:flex;flex-wrap:wrap;gap:14px;align-items:flex-end}
.th-tf__row--sub{margin-top:16px;padding-top:16px;border-top:1px dashed #E1E5E8;align-items:center;justify-content:space-between}
.th-tf__f{flex:1 1 170px;min-width:0;display:flex;flex-direction:column;gap:7px;margin:0}
.th-tf__f--q{flex:1.25 1 220px}
.th-tf__f--sort{flex:.8 1 160px}
.th-tf__label{font:500 10px/1 'IBM Plex Mono',monospace;letter-spacing:.22em;text-transform:uppercase;color:var(--thui-muted)}
.th-tf__q{position:relative;display:flex;align-items:center;height:50px;padding:0 10px 0 15px;gap:10px;border-radius:14px;border:1.5px solid var(--thui-line);background:#F7F9FA;transition:border-color .2s,box-shadow .2s,background-color .2s}
.th-tf__q:hover{border-color:rgba(0,183,194,.55);background:#fff}
.th-tf__q:focus-within{border-color:var(--thui-accent);background:#fff;box-shadow:var(--thui-ring)}
.th-tf__q > svg{width:18px;height:18px;flex:0 0 auto;fill:none;stroke:var(--thui-muted);stroke-width:2.2;stroke-linecap:round}
.th-tf .th-tf__q input{flex:1;min-width:0;height:100%;padding:0!important;border:0!important;background:none!important;box-shadow:none!important;outline:0;font:600 14.5px Archivo,sans-serif;color:var(--thui-ink)}
.th-tf__q input::placeholder{color:#94A3AD}
.th-tf__q input::-webkit-search-cancel-button{display:none}
.th-tf__qx{flex:0 0 auto;width:28px;height:28px;border:0;border-radius:50%;background:var(--thui-soft);display:grid;place-items:center;cursor:pointer}
.th-tf__qx[hidden]{display:none}
.th-tf__qx svg{width:13px;height:13px;fill:none;stroke:var(--thui-muted);stroke-width:2.6;stroke-linecap:round}
.th-tf__when.has-value{border-color:rgba(0,183,194,.55);background:#fff}
.th-tf__diff{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.th-tf__chips{display:flex;flex-wrap:wrap;gap:8px}
.th-tf__chip:disabled{opacity:.45;cursor:default;transform:none}
.th-tf__n{min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--thui-soft);color:var(--thui-muted);font:700 11px Archivo,sans-serif;display:grid;place-items:center}
.th-tf__chip.is-on .th-tf__n{background:rgba(255,255,255,.25);color:#fff}
.th-tf__meta{display:flex;align-items:center;gap:14px;margin-left:auto;font:600 13.5px Archivo,sans-serif;color:var(--thui-muted)}
.th-tf__meta b{color:var(--thui-ink);font-weight:800}
.th-tf__reset[hidden]{display:none}

.th-results .th-tf-hide{display:none!important}
.th-results .th-tf-in{animation:th-tf-in .45s cubic-bezier(.2,.8,.3,1) both}
@keyframes th-tf-in{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}
.th-tf-empty{grid-column:1/-1;display:flex;flex-direction:column;align-items:center;gap:10px;padding:60px 20px;border-radius:20px;background:#fff;border:1px dashed #D5DCE0;text-align:center;font:500 15px/1.5 Archivo,sans-serif;color:var(--thui-muted)}
.th-tf-empty strong{font:800 19px Archivo,sans-serif;color:var(--thui-ink)}
.th-tf-empty .thui-btn{margin-top:8px}

@media (max-width:767px){
  .th-tf__f,.th-tf__f--q,.th-tf__f--sort{flex:1 1 100%}
  .th-tf__f--sort{flex:1 1 calc(50% - 7px)}
  .th-tf__row--sub{flex-direction:column;align-items:stretch;gap:12px}
  .th-tf__meta{margin-left:0;justify-content:space-between}
}

.thui-pill:not(:has(.thui-pill__x)){padding:0 11px}

.th-tf-empty__cta{display:flex;align-items:center;gap:16px;flex-wrap:wrap;justify-content:center;margin-top:8px}
.th-tf-empty__cta .thui-btn{margin:0}
.th-tf-plan{display:flex;align-items:center;justify-content:space-between;gap:24px;width:100%;padding:28px 32px;border-radius:22px;background:radial-gradient(600px 200px at 100% 0,rgba(0,183,169,.35),transparent 70%),#16242F;color:#fff;box-shadow:0 30px 70px -20px rgba(15,30,41,.45)}
.th-tf-plan > div{display:flex;flex-direction:column;gap:6px}
.th-tf-plan__eyebrow{font:500 10.5px/1 'IBM Plex Mono',monospace;letter-spacing:.24em;text-transform:uppercase;color:#94D2BD}
.th-tf-plan strong{font:800 24px/1.2 Archivo,sans-serif}
.th-tf-plan > div > span:last-child{max-width:60ch;font:500 15px/1.5 Archivo,sans-serif;color:rgba(255,255,255,.8)}
.th-tf-plan .thui-btn{flex:0 0 auto;height:50px;padding:0 26px;text-decoration:none}
@media (max-width:767px){.th-tf-plan{flex-direction:column;align-items:flex-start;padding:24px 22px}}
