/* Sort modes (sort-modes.js): Activity bar + full-screen sorting sheet.
   Removable with the module. Theme tokens only, so every theme carries it. */
.sort-bar { display:flex; flex-wrap:wrap; gap:10px 16px; align-items:center; justify-content:space-between; margin:0 0 14px; padding:12px 14px; border:1px solid var(--border); border-radius:14px; background:var(--bg-surface); color:var(--text-primary); }
.sort-bar p { margin:0; }
.sort-bar-actions { display:flex; gap:8px; flex-wrap:wrap; }
.sort-bar-btn, .sort-tabs button, .sort-choice, .sort-chip, .sort-bill, .sort-primary, .sort-done-btn { font:inherit; cursor:pointer; color:var(--text-primary); background:var(--bg-elevated); border:1px solid var(--border-strong); border-radius:999px; padding:8px 14px; min-height:40px; }
.sort-bar-btn:hover, .sort-choice:hover:not(:disabled), .sort-chip:hover { background:var(--bg-hover); }
.sort-sheet button:focus-visible, .sort-bar button:focus-visible, .sort-sheet input:focus-visible, .sort-sheet summary:focus-visible { outline:3px solid var(--accent-primary); outline-offset:2px; }

.sort-sheet { margin:0 auto; padding:0; width:min(680px,100vw); max-width:100vw; height:100dvh; max-height:100dvh; border:0; border-inline:1px solid var(--border); background:var(--bg-base); color:var(--text-primary); display:flex; flex-direction:column; }
.sort-sheet:not([open]) { display:none; }
.sort-sheet::backdrop { background:rgba(0,0,0,.55); }
.sort-sheet * { box-sizing:border-box; }
.sort-head { padding:calc(14px + env(safe-area-inset-top,0px)) 16px 10px; border-bottom:1px solid var(--border); background:var(--bg-surface); display:grid; gap:10px; }
.sort-title { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.sort-title h2 { margin:0; font-size:1.15rem; line-height:1.25; }
.sort-tabs { display:flex; gap:6px; }
.sort-tabs button[aria-selected="true"] { background:var(--text-primary); color:var(--bg-base); border-color:var(--text-primary); }
.sort-split summary { cursor:pointer; color:var(--text-secondary); font-size:.88rem; }
.sort-split-fields { display:flex; flex-wrap:wrap; gap:8px 16px; margin-top:8px; font-size:.92rem; }
.sort-split-fields label { display:flex; gap:6px; align-items:center; }
.sort-split input { width:4.2em; font:inherit; padding:4px 6px; border:1px solid var(--border-strong); border-radius:8px; background:var(--bg-base); color:var(--text-primary); }

.sort-body { flex:1; overflow-y:auto; padding:16px; display:grid; align-content:start; gap:12px; }
.sort-sheet.is-busy .sort-body { opacity:.6; pointer-events:none; }
.sort-note { margin:0; color:var(--text-secondary); font-size:.9rem; }
.sort-progress { height:6px; border-radius:999px; background:var(--border); overflow:hidden; }
.sort-progress span { display:block; height:100%; background:var(--green-primary); transition:width .25s; }
.sort-one, .sort-store, .sort-finish { background:var(--bg-surface); border:1px solid var(--border); border-radius:14px; padding:16px; display:grid; gap:12px; min-width:0; }
.sort-one { text-align:center; padding-block:24px; }
.sort-one p, .sort-store p, .sort-finish p { margin:0; }
.sort-eyebrow { font-size:.78rem; letter-spacing:.06em; text-transform:uppercase; color:var(--text-secondary); }
.sort-who { margin:0; font-size:1.3rem; overflow-wrap:anywhere; }
.sort-amt { font-size:clamp(2.4rem,10vw,3.4rem); font-weight:700; line-height:1; font-variant-numeric:tabular-nums; }
.sort-tag { display:inline-block; font-size:.72rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase; border:1px solid var(--accent-secondary); color:var(--accent-secondary); border-radius:999px; padding:1px 8px; }
.sort-env { display:grid; gap:8px; justify-items:center; }
.sort-store .sort-env { justify-items:start; }
.sort-chips { display:flex; flex-wrap:wrap; gap:6px; justify-content:center; }
.sort-chip { min-height:36px; padding:6px 12px; font-size:.88rem; }
.sort-chip[aria-pressed="true"] { border-color:var(--status-info); color:var(--status-info); background:var(--status-info-muted); }
.sort-choices { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.sort-choice { border-radius:12px; border-width:2px; padding:10px 6px; min-height:52px; font-weight:700; }
.sort-choice small { display:block; font-weight:400; font-size:.76rem; color:var(--text-secondary); overflow-wrap:anywhere; }
.sort-choice[data-answer="mine"] { border-color:var(--status-info); }
.sort-choice[data-answer="split"] { border-color:var(--accent-primary); }
.sort-choice[data-answer="hers"] { border-color:var(--accent-secondary); }
.sort-choice:disabled { opacity:.45; cursor:not-allowed; }
.sort-choices.compact { display:flex; flex-wrap:wrap; gap:4px; grid-column:1 / -1; }
.sort-choices.compact .sort-choice { min-height:36px; padding:4px 10px; border-radius:999px; font-size:.82rem; }
.sort-choices.compact small { display:none; }
.sort-bill { justify-self:center; border-color:var(--green-primary); }
.sort-store .sort-bill { justify-self:start; }
.sort-link { font:inherit; font-weight:700; background:none; border:0; color:var(--accent-primary); cursor:pointer; padding:6px 0; }
.sort-link:disabled { color:var(--text-secondary); opacity:.6; cursor:default; }
.sort-row-actions { display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; }
.sort-primary { background:var(--accent-primary); color:#fff; border-color:var(--accent-primary); font-weight:700; }
.sort-store-head { display:grid; grid-template-columns:1fr auto; gap:2px 12px; align-items:baseline; }
.sort-store-head h3 { margin:0; font-size:1.05rem; overflow-wrap:anywhere; }
.sort-meta { grid-column:1 / -1; font-size:.85rem; color:var(--text-secondary); }
.sort-money { font-variant-numeric:tabular-nums; white-space:nowrap; font-weight:700; }
.sort-trips { display:grid; }
.sort-trip { display:grid; grid-template-columns:1fr auto; gap:6px 12px; padding-block:10px; border-top:1px solid var(--border); font-size:.92rem; }

.sort-foot { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; padding:10px 16px calc(10px + env(safe-area-inset-bottom,0px)); border-top:1px solid var(--border); background:var(--bg-surface); font-size:.82rem; color:var(--text-secondary); }
.sort-foot b { display:block; font-size:1.02rem; color:var(--text-primary); font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
@media (prefers-reduced-motion: reduce) { .sort-progress span { transition:none; } }
