/* TFIP – Warenströme & Handelsrouten (core/tfip-tradeflows.js). Präfix tf-flow- (gemeinsame App-Schicht). Farben aus dem Design-Theme:
   --tone-critical (Hochrisiko), --tone-high (Risiko), --tone-elevated (sensibel), --tone-seq2 (bekannt). Linienmuster = farbunabhängig. */
.tf-flow-sw { display: inline-block; flex: none; width: 26px; height: 0; border-top: 3px solid var(--tone-seq2, #7aaae6); vertical-align: middle; opacity: .7; }
.tf-flow-sw[data-cls="known"] { border-top-width: 2px; }
.tf-flow-sw[data-cls="sensitive"] { border-top: 3px dashed var(--tone-elevated, #f2c85b); opacity: 1; }
.tf-flow-sw[data-cls="risk"] { border-top: 3px dotted var(--tone-high, #ff9f5a); opacity: 1; height: 0; box-shadow: 0 -3px 0 -1px transparent; }
.tf-flow-sw[data-cls="high"] { border-top: 4px solid var(--tone-critical, #ff6b6e); opacity: 1; }
.tf-flow-badge { display: inline-flex; align-items: center; gap: .45rem; padding: .15rem .55rem; border: 1px solid var(--tf-line, #22343d); border-radius: 999px; font-size: .86rem; font-weight: 600; }
.tf-flow-badge[data-cls="high"] { border-color: var(--tone-critical); } .tf-flow-badge[data-cls="risk"] { border-color: var(--tone-high); } .tf-flow-badge[data-cls="sensitive"] { border-color: var(--tone-elevated); }
.tf-flow-level { display: inline-block; flex: none; padding: .05rem .45rem; border-radius: 6px; font-size: .78rem; font-variant-numeric: tabular-nums; border: 1px solid var(--tf-line, #22343d); color: var(--tf-muted, #9db0b6); }
.tf-flow-level[data-level="active"] { color: var(--tf-text, #e8f0ee); border-color: var(--tone-elevated); }
.tf-flow-level[data-level="elevated"] { color: var(--tf-text, #e8f0ee); border-color: var(--tone-critical); background: color-mix(in srgb, var(--tone-critical) 18%, transparent); }

/* Dock-Eintrag in der Drittindikator-Untergruppe */
.tf-flow-dock { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .35rem; }
.tf-flow-toggle { display: inline-flex; align-items: center; gap: .5rem; }
.tf-flow-toggle[aria-pressed="true"] { outline: 2px solid var(--tone-critical, #ff6b6e); outline-offset: -2px; }

/* Steuerkarte */
.tf-flow-card { display: grid; gap: .6rem; align-content: start; min-width: 0; }
.tf-flow-card:empty { display: none; }
.tf-flow-head { display: flex; align-items: flex-start; gap: .4rem; }
.tf-flow-titles { flex: 1; min-width: 0; }
.tf-flow-titles .tf-h { font-size: 1.05rem; margin: 0; }
.tf-flow-controls { display: grid; gap: .5rem; min-width: 0; }
.tf-flow-classes { display: flex; flex-wrap: wrap; gap: .35rem; align-items: center; }
.tf-flow-cls { display: inline-flex; align-items: center; gap: .45rem; min-height: 36px; padding: .25rem .6rem; border: 1px solid var(--tf-line, #22343d); border-radius: 999px; background: rgba(7, 13, 18, .45); color: var(--tf-text, #e8f0ee); font: inherit; font-size: .88rem; cursor: pointer; }
.tf-flow-cls[aria-pressed="false"] { opacity: .5; }
.tf-flow-cls[aria-pressed="false"] .tf-flow-sw { filter: grayscale(1); }
.tf-flow-cls:hover { border-color: var(--tf-control, #6b8893); }
.tf-flow-dir { flex-basis: 100%; margin: 0; }
.tf-flow-row { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.tf-flow-goods .tf-chips { flex-wrap: wrap; }
.tf-flow-x summary { cursor: pointer; font-size: .88rem; color: var(--tf-muted, #9db0b6); min-height: 32px; display: flex; align-items: center; }
.tf-flow-x .tf-chips { margin-top: .35rem; }
.tf-flow-tabs { margin-top: .2rem; }
.tf-flow-tabbody { margin-top: .5rem; min-width: 0; }
.tf-flow-routes, .tf-flow-rank, .tf-flow-pwlist, .tf-flow-newslist, .tf-flow-goodslist, .tf-flow-roles, .tf-flow-factors { list-style: none; margin: 0; padding: 0; display: grid; gap: .3rem; min-width: 0; }
.tf-flow-route, .tf-flow-rank-row { display: flex; align-items: center; gap: .55rem; width: 100%; min-height: 40px; padding: .35rem .55rem; border: 1px solid transparent; border-radius: 8px; background: rgba(7, 13, 18, .35); color: var(--tf-text, #e8f0ee); font: inherit; font-size: .9rem; text-align: left; cursor: pointer; }
.tf-flow-route:hover, .tf-flow-rank-row:hover { border-color: var(--tf-control, #6b8893); }
.tf-flow-route-name, .tf-flow-rank-name { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.tf-flow-rank { counter-reset: tfr; }
.tf-flow-rank-row strong { font-variant-numeric: tabular-nums; }
.tf-flow-detail { display: grid; gap: .5rem; min-width: 0; }
.tf-flow-detail .tf-h { font-size: 1.1rem; margin: 0; }
.tf-flow-badges { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem; }
.tf-flow-goodslist li, .tf-flow-roles li { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem; }
.tf-flow-roles .tf-chip[data-flag="1"] { border-color: var(--tone-high, #ff9f5a); }
.tf-chip[data-cls="high"] { border-color: var(--tone-critical); } .tf-chip[data-cls="risk"] { border-color: var(--tone-high); } .tf-chip[data-cls="sensitive"] { border-color: var(--tone-elevated); }
.tf-flow-news { display: grid; gap: .2rem; padding: .45rem .55rem; border-left: 3px solid var(--tf-line, #22343d); background: rgba(7, 13, 18, .3); border-radius: 0 8px 8px 0; min-width: 0; }
.tf-flow-news-meta { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; font-size: .8rem; color: var(--tf-muted, #9db0b6); }
.tf-flow-news-title { overflow-wrap: anywhere; font-size: .92rem; }
.tf-flow-news-chips { margin-top: .15rem; }
/* Pflichthinweis des Herausgebers an der Meldung (z. B. NGA): sichtbarer Kurzverweis, Wortlaut aufklappbar */
.tf-flow-news-notice { font-size: .78rem; color: var(--tf-muted, #9db0b6); min-width: 0; }
.tf-flow-news-notice > summary { cursor: pointer; list-style: none; min-height: 24px; display: flex; align-items: center; gap: .3rem; color: var(--tone-elevated, #f2c85b); }
.tf-flow-news-notice > summary::-webkit-details-marker { display: none; }
.tf-flow-news-notice > summary::before { content: '\25B8'; font-size: .75rem; transition: transform .15s ease; }
.tf-flow-news-notice[open] > summary::before { transform: rotate(90deg); }
.tf-flow-news-notice > p { margin: .2rem 0 0; overflow-wrap: anywhere; }
@media (prefers-reduced-motion: reduce) { .tf-flow-news-notice > summary::before { transition: none; } }
@media (pointer: coarse) { .tf-flow-news-notice > summary { min-height: 44px; } }
.tf-flow-src { overflow-wrap: anywhere; }
.tf-flow-src[data-status="unverified"] small { color: var(--tone-high, #ff9f5a); }
.tf-flow-pw { display: grid; gap: .25rem; padding: .5rem .6rem; border: 1px solid var(--tf-line, #22343d); border-radius: 10px; }
.tf-flow-pw[data-state="disrupted"] { border-color: var(--tone-critical); } .tf-flow-pw[data-state="reduced"] { border-color: var(--tone-elevated); }
.tf-flow-pw-line { margin: 0; font-size: .88rem; }
.tf-flow-spark { width: 100%; max-width: 320px; height: 46px; display: block; }
.tf-flow-spark-area { fill: color-mix(in srgb, var(--tone-seq2, #7aaae6) 25%, transparent); }
.tf-flow-spark-line { fill: none; stroke: var(--tone-seq2, #7aaae6); stroke-width: 1.5; vector-effect: non-scaling-stroke; }
.tf-flow-spark[data-state="disrupted"] .tf-flow-spark-line { stroke: var(--tone-critical, #ff6b6e); }
.tf-flow-spark[data-state="disrupted"] .tf-flow-spark-area { fill: color-mix(in srgb, var(--tone-critical, #ff6b6e) 22%, transparent); }
.tf-flow-marad { display: grid; gap: .2rem; padding: .45rem .6rem; border-left: 3px solid var(--tone-critical, #ff6b6e); background: rgba(7, 13, 18, .3); border-radius: 0 8px 8px 0; }
.tf-flow-marad .tf-text { margin: 0; overflow-wrap: anywhere; font-size: .88rem; }

/* Handelsmengen (UN Comtrade, CHPL-Güter): Säule je Jahr, Basisjahre blass, Ø der Basisjahre gestrichelt, fehlende Meldung als leerer Rahmen.
   Signal nicht nur über Farbe: Rahmen + Textmarke „Mengensignal“. */
.tf-flow-ctblock, .tf-flow-ctsig { display: grid; gap: .45rem; min-width: 0; }
.tf-flow-ctblock > .tf-meta, .tf-flow-ctsig > .tf-meta, .tf-flow-ctblock > .tf-hint, .tf-flow-ctsig > .tf-hint { margin: 0; overflow-wrap: anywhere; }
.tf-flow-ctsig { margin-top: .6rem; }
.tf-flow-ct { display: grid; gap: .25rem; padding: .5rem .6rem; border: 1px solid var(--tf-line, #22343d); border-radius: 10px; min-width: 0; }
.tf-flow-ct[data-signal="1"] { border-color: var(--tone-critical, #ff6b6e); }
.tf-flow-ct-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .4rem; font-size: .9rem; font-weight: 600; }
.tf-flow-ct-name { min-width: 0; overflow-wrap: anywhere; }
.tf-flow-ct-chart { width: 100%; max-width: 340px; height: auto; aspect-ratio: 280 / 74; display: block; }
.tf-flow-ct-bar { fill: var(--tone-seq2, #7aaae6); }
.tf-flow-ct-bar[data-base="1"] { fill: color-mix(in srgb, var(--tone-seq2, #7aaae6) 45%, transparent); }
.tf-flow-ct[data-signal="1"] .tf-flow-ct-bar[data-latest="1"] { fill: var(--tone-critical, #ff6b6e); }
.tf-flow-ct-na { fill: none; stroke: var(--tf-muted, #9db0b6); stroke-width: 1; stroke-dasharray: 2 2; }
.tf-flow-ct-na.tf-flow-ct-partial { stroke: var(--tone-elevated, #f2c85b); } /* EU27: Jahr mit Teilmeldung (nicht alle 27 Staaten) – eigens gekennzeichnet, nicht wie „keine Meldung“ */
.tf-flow-ct-bar.tf-flow-ct-partial { fill: color-mix(in srgb, var(--tone-elevated, #f2c85b) 30%, transparent); stroke: var(--tone-elevated, #f2c85b); stroke-dasharray: 3 2; } /* EU27: Teilsumme eines unvollständigen Jahres (04.10.2026) – sichtbar, aber nie Basis oder Signal */
.tf-flow-ct-baseline { stroke: var(--tf-text, #e8f0ee); stroke-width: 1; stroke-dasharray: 4 3; opacity: .75; vector-effect: non-scaling-stroke; }
.tf-flow-ct-year { fill: var(--tf-muted, #9db0b6); font-size: 10px; font-family: inherit; }
.tf-flow-ct-line { margin: 0; font-size: .86rem; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.tf-flow-ct-license { margin: 0; padding: .35rem .55rem; border-left: 3px solid var(--tone-elevated, #f2c85b); background: rgba(7, 13, 18, .3); border-radius: 0 8px 8px 0; font-size: .82rem; overflow-wrap: anywhere; }
.tf-flow-cttable-wrap { overflow-x: auto; margin: .4rem 0; }
.tf-flow-cttable { width: 100%; border-collapse: collapse; font-size: .86rem; font-variant-numeric: tabular-nums; }
.tf-flow-cttable caption { text-align: left; caption-side: top; padding-bottom: .3rem; }
.tf-flow-cttable th, .tf-flow-cttable td { padding: .3rem .5rem; border-bottom: 1px solid var(--tf-line, #22343d); text-align: right; white-space: nowrap; }
.tf-flow-cttable th[scope="row"], .tf-flow-cttable thead th:first-child { text-align: left; white-space: normal; }
.tf-flow-cttable tr[data-signal="1"] th[scope="row"] { box-shadow: inset 3px 0 0 var(--tone-critical, #ff6b6e); padding-left: .7rem; }
.tf-flow-cttable tr[data-signal="1"] td:last-child { font-weight: 600; }

/* Länderprofil: Faktor-Balken (grafische Aufschlüsselung der TF-1-Punkte) */
.tf-flow-profile-head { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.tf-flow-score { font-variant-numeric: tabular-nums; }
.tf-flow-factors li { display: grid; gap: .2rem; }
.tf-flow-factors li[data-zero="1"] { opacity: .7; }
.tf-flow-factor-head { display: flex; justify-content: space-between; gap: .6rem; font-size: .9rem; }
.tf-flow-factor-head strong { font-variant-numeric: tabular-nums; flex: none; }
.tf-flow-bar { display: block; height: 7px; border-radius: 4px; background: rgba(127, 227, 189, .08); overflow: hidden; }
.tf-flow-bar-fill { display: block; height: 100%; border-radius: 4px; background: linear-gradient(90deg, var(--tone-elevated, #f2c85b), var(--tone-critical, #ff6b6e)); }
.tf-flow-factor-refs { display: flex; flex-wrap: wrap; gap: .3rem; font-size: .84rem; }
.tf-flow-ref { overflow-wrap: anywhere; }

/* Bibliothek (Updates-Seite) */
.tf-flow-libbar { display: flex; flex-wrap: wrap; gap: .5rem; }
.tf-flow-libbar > * { flex: 1 1 180px; min-width: 0; }
.tf-flow-libresults { margin-top: .5rem; }
/* Pflichthinweise der Herausgeber (sources.json licenseNotice) unter der Feed-Liste: vom folgenden Hinweis abgesetzt, lange Texte umbrechen */
.tf-flow-notices { display: grid; gap: .5rem; margin: .6rem 0 1rem; overflow-wrap: anywhere; }
.tf-flow-notices .tf-note { margin: 0; border-left-color: var(--tone-elevated, #f2c85b); }
@media (prefers-reduced-motion: reduce) { .tf-flow-cls, .tf-flow-route { transition: none; } }
@media print { .tf-flow-card { display: none !important; } }
