/* Trip File (Phase 13.4). Mobile-first, RTL-safe (logical properties), light + dark through design-system tokens only. */
.tf{--tf-sticky-top:0px;max-width:100%;overflow-x:hidden;color:var(--ds-text)}
.tf *{min-width:0;overflow-wrap:anywhere;box-sizing:border-box}
.tf-stack{display:flex;flex-direction:column;gap:var(--ds-space-3);margin-block-start:var(--ds-space-3)}

/* sticky summary + sticky next action */
.tf-head{position:sticky;top:var(--tf-sticky-top);z-index:15;background:var(--ds-surface);border:var(--ds-border-w) solid var(--ds-border-subtle);border-radius:var(--ds-radius-lg);box-shadow:var(--ds-shadow-card);padding:var(--ds-space-3);margin-block-end:var(--ds-space-3)}
.tf-head-top{display:flex;align-items:center;justify-content:space-between;gap:var(--ds-space-3)}
.tf-head-id{flex:1 1 auto}
.tf-no{margin:0;font-size:var(--ds-fs-section-title);font-weight:var(--ds-fw-bold)}
.tf-chips{display:flex;flex-wrap:wrap;gap:var(--ds-space-1);margin-block-start:var(--ds-space-1)}
.tf-next{flex:0 0 auto;min-height:var(--ds-touch-min);max-width:48%;white-space:normal;line-height:1.25}
.tf-route{display:flex;flex-wrap:wrap;gap:var(--ds-space-2);align-items:center;margin-block-start:var(--ds-space-2);font-size:var(--ds-fs-secondary);color:var(--ds-text-muted)}
.tf-head-more{margin-block-start:var(--ds-space-2)}
.tf-head-more>summary{cursor:pointer;font-size:var(--ds-fs-label);color:var(--ds-text-muted);min-height:32px;display:flex;align-items:center}
.tf-blocker{margin-block-start:var(--ds-space-2);padding:var(--ds-space-2) var(--ds-space-3);border-radius:var(--ds-radius-md);background:var(--ds-danger-bg);color:var(--ds-danger);font-size:var(--ds-fs-secondary)}

/* stepper: compact bar on phones, full list from tablet up (never horizontal-scrolls) */
.tf-steps{margin-block-end:var(--ds-space-2)}
.tf-steps-compact{font-size:var(--ds-fs-secondary);padding:var(--ds-space-2) var(--ds-space-3);background:var(--ds-surface);border:var(--ds-border-w) solid var(--ds-border-subtle);border-radius:var(--ds-radius-md)}
.tf-bar{height:6px;border-radius:99px;background:var(--ds-border-subtle);margin-block-start:var(--ds-space-2);overflow:hidden}
.tf-bar>i{display:block;height:100%;background:var(--ds-primary);border-radius:99px}
.tf-steps-full{display:none;list-style:none;margin:0;padding:0;gap:var(--ds-space-2);flex-wrap:wrap}
.tf-steps-full li{display:flex;align-items:center;gap:var(--ds-space-1);font-size:var(--ds-fs-caption);color:var(--ds-text-muted);padding:2px 8px;border-radius:99px;border:var(--ds-border-w) solid var(--ds-border-subtle);background:var(--ds-surface)}
.tf-steps-full li.is-done{color:var(--ds-success)}
.tf-steps-full li.is-cur{color:var(--ds-primary);border-color:var(--ds-primary);font-weight:var(--ds-fw-bold);background:var(--ds-primary-soft,var(--ds-info-bg))}
.tf-steps-full li.is-byp{border-style:dashed}
.tf-dot{display:inline-grid;place-items:center;width:18px;height:18px;border-radius:50%;background:var(--ds-border-subtle);font-size:var(--fs-helper)}
@media (min-width:720px){.tf-steps-compact{display:none}.tf-steps-full{display:flex}.tf-next{max-width:none}}

/* collapsible sections */
.tf-sec{background:var(--ds-surface);border:var(--ds-border-w) solid var(--ds-border-subtle);border-radius:var(--ds-radius-lg);box-shadow:var(--ds-shadow-card)}
.tf-sec[open]{border-color:var(--ds-border)}
.tf-sec-sum{display:flex;align-items:center;gap:var(--ds-space-2);min-height:var(--ds-touch-min);padding:var(--ds-space-2) var(--ds-space-3);cursor:pointer;list-style:none}
.tf-sec-sum::-webkit-details-marker{display:none}
.tf-sec-sum::before{content:"\25B8";color:var(--ds-text-muted);transition:transform var(--ds-dur-fast,120ms)}
.tf-sec[open]>.tf-sec-sum::before{transform:rotate(90deg)}
[dir="rtl"] .tf-sec-sum::before,:root[dir="rtl"] .tf-sec-sum::before{content:"\25C2"}
[dir="rtl"] .tf-sec[open]>.tf-sec-sum::before{transform:rotate(-90deg)}
.tf-sec-title{font-weight:var(--ds-fw-semibold);font-size:var(--ds-fs-card-title);flex:0 0 auto}
.tf-sec-brief{flex:1 1 auto;color:var(--ds-text-muted);font-size:var(--ds-fs-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tf-sec-body{padding:var(--ds-space-2) var(--ds-space-3) var(--ds-space-4)}
.tf-flash{outline:2px solid var(--ds-primary);outline-offset:2px}
.tf-inner{margin-block-start:var(--ds-space-3)}
.tf-inner>summary{cursor:pointer;color:var(--ds-primary);font-size:var(--ds-fs-secondary);min-height:36px;display:flex;align-items:center}

/* content atoms */
.tf-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--ds-space-2) var(--ds-space-4);margin:0}
@media (min-width:560px){.tf-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1000px){.tf-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.tf-kv{display:flex;flex-direction:column;gap:2px;margin:0}
.tf-kv dt{font-size:var(--ds-fs-caption);color:var(--ds-text-muted)}
.tf-kv dd{margin:0;font-size:var(--ds-fs-body)}
.tf-dim{color:var(--ds-text-muted)}
.tf-empty{margin:0}
.tf-good{color:var(--ds-success)}.tf-bad{color:var(--ds-danger)}
.tf-lead{margin:0 0 var(--ds-space-3);font-size:var(--ds-fs-body)}
.tf-h5{margin:var(--ds-space-3) 0 var(--ds-space-2);font-size:var(--ds-fs-label);color:var(--ds-text-muted);font-weight:var(--ds-fw-semibold)}
.tf-row{display:flex;flex-wrap:wrap;gap:var(--ds-space-2);margin-block-start:var(--ds-space-3)}
.tf-row>.tf-btn{flex:1 1 auto;min-height:var(--ds-touch-min)}
@media (min-width:720px){.tf-row>.tf-btn{flex:0 0 auto}}
.tf-sub{border-block-start:var(--ds-border-w) dashed var(--ds-border-subtle);padding-block-start:var(--ds-space-3)}
.tf-link{background:none;border:0;padding:0 4px;color:var(--ds-primary);cursor:pointer;text-decoration:underline;font:inherit;font-size:var(--ds-fs-secondary);min-height:32px}
.tf-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--ds-space-2)}
.tf-blk,.tf-okrow,.tf-doc{display:flex;align-items:center;gap:var(--ds-space-2);flex-wrap:wrap;padding:var(--ds-space-2);border-radius:var(--ds-radius-md);background:var(--ds-hover)}
.tf-blk-t{flex:1 1 160px}
.tf-note{padding:var(--ds-space-2) var(--ds-space-3);border-radius:var(--ds-radius-md);background:var(--ds-info-bg);font-size:var(--ds-fs-secondary);margin-block-end:var(--ds-space-2)}
.tf-warn{background:var(--ds-warning-bg);color:var(--ds-warning)}
.tf-line{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--ds-space-2);align-items:center;padding:var(--ds-space-2) var(--ds-space-3);border:var(--ds-border-w) solid var(--ds-border-subtle);border-radius:var(--ds-radius-md)}
.tf-sugg{border-style:dashed;background:var(--ds-info-bg)}
.tf-line-act{grid-column:1/-1;display:flex;gap:var(--ds-space-2);flex-wrap:wrap}
.tf-amt{font-weight:var(--ds-fw-semibold);white-space:nowrap}
.tf-total{display:flex;justify-content:space-between;margin-block-start:var(--ds-space-3);padding-block-start:var(--ds-space-2);border-block-start:var(--ds-border-w) solid var(--ds-border-subtle)}
.tf-cust-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--ds-space-2);margin-block:var(--ds-space-3)}
.tf-cust-pair>div{padding:var(--ds-space-2) var(--ds-space-3);border:var(--ds-border-w) solid var(--ds-border-subtle);border-radius:var(--ds-radius-md)}
.tf-cust-pair small{display:block;color:var(--ds-text-muted);font-size:var(--ds-fs-caption)}
.tf-choice{display:flex;flex-direction:column;gap:var(--ds-space-2);margin-block-end:var(--ds-space-3)}
.tf-choice label{display:flex;gap:var(--ds-space-2);align-items:center;min-height:var(--ds-touch-min)}
.tf-scroll{overflow-x:auto;max-width:100%}
.tf-table{width:100%;border-collapse:collapse;font-size:var(--ds-fs-secondary)}
.tf-table th,.tf-table td{padding:6px 8px;text-align:start;border-block-end:var(--ds-border-w) solid var(--ds-border-subtle);white-space:nowrap}
.tf-tl{list-style:none;margin:0;padding:0;border-inline-start:2px solid var(--ds-border-subtle)}
.tf-tl-i{padding:var(--ds-space-1) var(--ds-space-3);display:flex;flex-direction:column;font-size:var(--ds-fs-secondary)}
.tf-tl-i time{font-size:var(--ds-fs-caption);color:var(--ds-text-muted)}
.tf-tl-i.is-bad{border-inline-start:3px solid var(--ds-danger);margin-inline-start:-2px}
.tf-tl-i.is-warn{border-inline-start:3px solid var(--ds-warning);margin-inline-start:-2px}
.tf-inline-error{margin:var(--ds-space-2) var(--ds-space-4);padding:var(--ds-space-2) var(--ds-space-3);border-radius:var(--ds-radius-md);background:var(--ds-danger-bg);color:var(--ds-danger);font-size:var(--ds-fs-secondary)}
.tf-legacy{margin-block-start:var(--ds-space-4)}
.tf-legacy>summary{cursor:pointer;min-height:var(--ds-touch-min);display:flex;align-items:center;color:var(--ds-text-muted);font-size:var(--ds-fs-secondary)}
@media (max-width:430px){.tf-cust-pair{grid-template-columns:minmax(0,1fr)}.tf-head-top{align-items:flex-start}.tf-sec-brief{display:none}}
@media (prefers-reduced-motion:reduce){.tf-sec-sum::before{transition:none}}