/* v46.2 UI (owner renders owner3 to owner6): the AI pill and sheet, the Day header and track, the opened stop, the
   Bookings tab's chips, the trip page's photo. Tokens only, so light and charcoal follow the app; every tap 44 px. */

/* ---------- the top bar's AI pill: raised like the bar's other buttons, left of its right-side control ---------- */
.sh-aipill{flex:none;gap:8px;min-height:var(--tap);padding:0 18px 0 15px;font:600 1rem/1 var(--font);}
.sh-aipill .d-ic{width:20px;height:20px;}

/* ---------- the AI sheet: floating, about 85% of the screen, the page dimmed behind ---------- */
.d-sheet.ch-ai.sh-full{height:calc(85dvh - env(safe-area-inset-top));}
.ch-head-ai{flex-direction:row;align-items:center;}
.ch-seg{display:inline-flex;flex:none;max-width:100%;padding:3px;}
.ch-seg .ch-side{flex:none;min-height:var(--tap);padding:6px 18px;}
.ch-ai .ch-privacy{margin:4px 0 0;}
.ch-starter-wrap{display:flex;flex-direction:column;align-items:flex-start;gap:12px;}
.ch-starter-line{margin:0;}
.ch-starter.d-chip{margin:0;min-height:var(--tap);}
.ch-own{display:flex;flex-direction:column;}
.ai-own{display:flex;flex-direction:column;gap:12px;padding:8px 0 calc(16px + env(safe-area-inset-bottom));}
.ai-own .ai-copy{margin-top:4px;}
.ai-own-note{margin:-2px 0 12px;text-align:center;}
.ai-own-h{display:block;margin:8px 0 0;}
.ai-paste{min-height:9.5em;resize:none;font:400 var(--fs-body-sm)/1.4 var(--font);}

/* ---------- the Day header: the title on its own line, two quiet pills under it ---------- */
.dy-dayhead-row{display:block;}
.dy-qpills{display:flex;flex-wrap:wrap;gap:4px 8px;margin:8px 0 0 -2px;}
.dy-qpill .of-pill-face{height:34px;padding:0 16px;background:var(--well);box-shadow:none;font-weight:500;}
.dy-qpill:active .of-pill-face{box-shadow:var(--in);}
.dy-qpill:focus-visible{outline:none;}
.dy-qpill:focus-visible .of-pill-face{outline:2px solid var(--brass-ink);outline-offset:2px;}
/* the day before and the day after: two quiet arrows at the header's top right */
.dy-steprow{display:flex;align-items:flex-start;gap:16px;}
.dy-steprow>.dy-dayhead-text{flex:1 1 auto;}
.dy-steps{display:flex;flex:none;gap:8px;}
.dy-step{background:var(--well);box-shadow:none;color:var(--ink);}
.dy-step:active{box-shadow:var(--in);}
.dy-step:disabled{opacity:.35;}
.dy-step:focus-visible{outline:2px solid var(--brass-ink);outline-offset:2px;}

/* the day's real map, small and still: a tap opens the full map */
.dm-thumb{position:relative;height:124px;margin:6px 0 14px;border-radius:var(--r-lg);overflow:hidden;background:var(--well);box-shadow:var(--in);isolation:isolate;}
.dm-thumb .dm-thumb-map{position:absolute;inset:0;min-height:0;border-radius:inherit;box-shadow:none;pointer-events:none;}
.dm-thumb .dm-pin{width:30px;height:30px;cursor:default;pointer-events:none;}
.dm-thumb .dm-dot{width:24px;height:24px;font-size:.75rem;}
.dm-thumb .dm-pin-base .dm-dot{width:26px;height:26px;}
.dm-thumb .dm-pin-base .dm-dot .d-ic{width:14px;height:14px;}
.dm-thumb-credit{position:absolute;right:10px;bottom:6px;z-index:2;padding:1px 6px;border-radius:var(--r-sm);background:color-mix(in srgb,var(--ground) 72%,transparent);color:var(--ink-2);font:400 .6875rem/1.4 var(--font);pointer-events:none;}
.dm-thumb-open{position:absolute;inset:0;z-index:3;width:100%;height:100%;padding:0;border:0;border-radius:inherit;background:transparent;cursor:pointer;-webkit-tap-highlight-color:transparent;}
.dm-thumb-open:active{background:color-mix(in srgb,var(--ink) 6%,transparent);}
.dm-thumb-open:focus-visible{outline:2px solid var(--brass-ink);outline-offset:2px;}

/* ---------- the track: each stop's dot on the road's line ---------- */
.tr-dot{position:absolute;inset-inline-start:-52px;top:8px;z-index:2;display:flex;align-items:center;justify-content:center;width:var(--tap);height:var(--tap);padding:0;border:0;background:none;color:var(--ink);-webkit-tap-highlight-color:transparent;touch-action:manipulation;}
button.tr-dot{cursor:pointer;}
.tr-face{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;box-sizing:border-box;border-radius:50%;background:var(--ground);border:2px solid var(--ink-2);color:var(--ink);box-shadow:0 0 0 3px var(--ground);font:600 .8125rem/1 var(--font);font-variant-numeric:tabular-nums;transition:transform 120ms var(--ease);}
.tr-plain .tr-face{width:14px;height:14px;}
.tr-here .tr-face{background:var(--sage);border-color:var(--sage);color:var(--ground);}
.tr-here .tr-face .d-ic{width:15px;height:15px;stroke-width:2.4;}
.tr-cancelled .tr-face{width:16px;height:16px;border-width:1.5px;border-color:color-mix(in srgb,var(--ink-2) 60%,transparent);background:var(--ground);}
.tr-dot.is-now .tr-face{border-color:var(--brass-ink);box-shadow:0 0 0 3px var(--ground),0 0 0 5px color-mix(in srgb,var(--brass) 45%,transparent);}
button.tr-dot:active .tr-face{transform:scale(.9);}
button.tr-dot:focus-visible{outline:none;}
button.tr-dot:focus-visible .tr-face{outline:2px solid var(--brass-ink);outline-offset:2px;}
.dy-item.is-open>.tr-dot{inset-inline-start:-40px;}

/* how you get to a stop, on its time line */
.tr-travel{display:inline-flex;align-items:center;gap:5px;margin-inline-start:8px;color:var(--ink-2);}
.tr-travel .d-ic{width:15px;height:15px;flex:none;}
/* the one line of its own: the way back to the stay */
.tr-back{display:flex;align-items:center;min-height:44px;margin:2px 0 6px;color:var(--ink-2);}
.tr-back-t{display:inline-flex;align-items:center;gap:8px;}
.tr-back-t .d-ic{width:16px;height:16px;flex:none;}

/* a cancelled stop: struck through and muted, still on the day */
.dy-cancelled .dy-time,.dy-cancelled .dy-title{text-decoration:line-through;text-decoration-thickness:1.5px;color:var(--ink-2);}
.dy-cancelled .dy-l3,.dy-cancelled .dy-caret{opacity:.6;}

/* ---------- the opened stop: Walk, Ride, Hours & Photos on one line ---------- */
/* one line at every phone width and in Spanish: the three share the line, and a line too narrow for the icons drops them
   (the words stay whole) */
.dy-golin{display:flex;flex-wrap:nowrap;align-items:center;gap:0;margin:0 0 0 -8px;container-type:inline-size;}
.dy-go{flex:0 1 auto;min-width:0;gap:6px;min-height:var(--tap);padding:8px 8px;font:600 .9375rem/1.2 var(--font);color:var(--ink);text-decoration:none;white-space:nowrap;}
.dy-go .d-ic{width:17px;height:17px;flex:none;}
@container (max-width:300px){.dy-go{gap:5px;padding:8px 6px;}}
@container (max-width:268px){.dy-go .d-ic{display:none;}}
@container (max-width:330px){:lang(es) .dy-go{gap:5px;padding:8px 6px;}}
@container (max-width:318px){:lang(es) .dy-go .d-ic{display:none;}}
.dy-faces-row{display:flex;justify-content:flex-end;}
.of-panel-foot .pp-stack,.of-panel-foot .d-av-stack{margin-inline-start:auto;}

/* ---------- the automatic check-in's one question, and its tie ---------- */
.ci-ask{display:flex;flex-direction:column;gap:6px;margin:4px 0 12px;padding:12px 14px;border-radius:var(--r-md);background:var(--well);box-shadow:var(--in);}
.ci-ask-t{margin:0;}
.ci-ask-acts{display:flex;justify-content:flex-end;align-items:center;gap:8px;}
.ci-ask-acts .d-btn{min-height:var(--tap);}
.ci-which.sh-toast{flex-wrap:wrap;row-gap:0;padding-top:10px;}
.ci-which .sh-toast-msg{flex:1 1 100%;}
.ci-which-acts{display:flex;flex-wrap:wrap;gap:0 4px;margin-inline-start:auto;}
.ci-which-acts .d-btn-quiet{margin-left:0;max-width:16em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

/* a question for later on the trip page (asks.js): its answers are 44 px like every tap */
.ak-chips .d-chip{min-height:var(--tap);}

/* ---------- the Bookings tab ---------- */
.bk-title{margin:4px 0 10px;}
.bk-chips{margin:0 calc(-1 * var(--gutter)) 14px;}
/* v46.2.1: the filters wrap to a second line on a narrow phone, so every chip shows whole (never cut at the edge) */
.dy-chiprow.bk-chips{flex-wrap:wrap;overflow-x:visible;-webkit-mask-image:none;mask-image:none;}
.bk-daychip .d-ic{width:15px;height:15px;margin-inline-start:2px;}
.bk-focal{margin-bottom:8px;}
.bk-door{flex:none;grid-column:3;grid-row:1;justify-self:end;color:var(--ink);}
.bk-more{margin-top:18px;}

/* ---------- the trip page: the photo with the name and the faces on it ---------- */
.sh-head-hero{display:flex;flex-direction:column;}
.sh-hero-fig{position:relative;margin:4px 0 12px;}
.sh-hero{border-radius:var(--r-lg);}
.sh-hero-strip{--strip-mix:40%;position:absolute;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:64px;padding:8px 16px 8px 20px;border-radius:0 0 var(--r-lg) var(--r-lg);background:color-mix(in srgb,var(--ground) var(--strip-mix),transparent);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);}
html[data-theme="dark"] .sh-hero-strip{--strip-mix:35%;}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) .sh-hero-strip{--strip-mix:35%;}}
/* press and hold (editors) changes the photo: no text selection, no phone image menu */
.sh-hero-fig.is-editable{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;}
.sh-hero-fig.is-editable img{-webkit-touch-callout:none;-webkit-user-drag:none;pointer-events:none;}
.sh-hero-strip.is-top{top:0;bottom:auto;min-height:56px;border-radius:var(--r-lg) var(--r-lg) 0 0;}
/* the name whole (it wraps, never cut), with a faint halo of the page colour so it reads on a bright sky */
.sh-hero-name.d-t-display{margin:0;min-width:0;font-size:1.625rem;line-height:1.15;overflow-wrap:anywhere;text-shadow:0 0 1px color-mix(in srgb,var(--ground) 70%,transparent),0 0 8px color-mix(in srgb,var(--ground) 60%,transparent);}
.sh-hero-crew{flex:none;padding:0;border:0;background:none;cursor:pointer;min-height:var(--tap);display:inline-flex;align-items:center;-webkit-tap-highlight-color:transparent;}
.sh-hero-crew:focus-visible{outline:2px solid var(--brass-ink);outline-offset:2px;border-radius:var(--r-pill);}
.sh-hero-faces{position:absolute;left:16px;bottom:12px;}
.sh-hero-fig .sh-hero-credit{position:absolute;top:0;right:12px;margin:0;max-width:calc(100% - 24px);color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.6);font-size:.6875rem;}
.sh-hero-fig.is-b .sh-hero-credit{top:auto;bottom:0;}
.sh-hero-fig .sh-hero-credit a{display:inline-flex;align-items:center;min-height:var(--tap);color:inherit;text-decoration:none;}
.sh-hero-plain{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:4px 0 4px;}
.sh-hero-plain .sh-hero-name{font-size:2rem;}
.sh-dayline{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;margin:0 0 6px;}
.sh-dayline-wx{display:inline-flex;align-items:center;gap:6px;}
.sh-dayline-wx[hidden]{display:none;}
.sh-dayline-wx .d-ic{width:18px;height:18px;}
.sh-dot{color:var(--ink-2);}

@media (prefers-reduced-motion:reduce){.tr-face{transition:none;}button.tr-dot:active .tr-face{transform:none;opacity:.8;}}

/* ---------- Today (v46.2.3): today's stops on the Day's track; the next stop is its one opened stop ---------- */
.td-road.tr-road{margin-top:24px;}
.td-focal>.tr-dot{top:10px;}
.td-focal-in{display:flex;flex-direction:column;gap:2px;padding:12px 0 0;min-width:0;}
.td-focal-in>p{margin:0;}
.td-focal-in .td-readout{margin-bottom:2px;}
.td-focal-title{margin:0;font:600 var(--fs-head)/1.3 var(--font);letter-spacing:-.01em;color:var(--ink);overflow-wrap:anywhere;}
.td-focal-in .dy-place{margin:2px 0 0;}
.td-focal-in .dy-golin{margin-top:6px;}
.td-focal-in .td-go{margin-top:8px;}
.td-focal+li{margin-top:4px;}
.td-road .td-more,.td-road .td-row{width:100%;}
/* the way back to the stay with its Ride: one line, the words left, Ride at the end */
.tr-back-act{justify-content:space-between;gap:8px;}
.tr-back-act .tr-back-t{min-width:0;}
.tr-back-act .dy-go{flex:none;margin-inline-end:-8px;}
.td-empty .tr-back-act{margin-top:12px;}
