/* INTERFACE THEME — Visual Refresh v2 (premium dark trading terminal). Ostatnia globalna warstwa stylów:
   wspólne komponenty: panele, karty, przyciski, pola, tabele, chipy (tokeny --df-* i motywy: theme-tokens.css). Tylko wygląd.
   Kolory znaczeniowe: niebieski = aktywny UI · zielony = profit/LONG · czerwony = strata/SHORT/SL/zagrożenie ·
   złoty = DigitalFortune, Simon Quant, AI, premium. Fonty lokalnie (vendor/fonts, SIL OFL 1.1). */
/* tokeny --df-* i @font-face: theme-tokens.css (ładowany w <head> przed innymi arkuszami) */
html,body{background:var(--df-bg);color:var(--df-text);font-family:var(--df-font-ui);font-feature-settings:"cv11","ss03";-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
body{font-variant-numeric:tabular-nums}
::selection{background:var(--df-selection);color:var(--df-text)}
*{scrollbar-width:thin;scrollbar-color:var(--df-border-3) transparent}
::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--df-border-2);border-radius:8px;border:2px solid var(--df-bg)}::-webkit-scrollbar-thumb:hover{background:var(--df-border-3)}

/* ---------------- 2. sidebar i pasek górny ---------------- */
.sidebar{background:var(--df-bg-elev);border-right:1px solid var(--df-border)}
/* logo DigitalFortune: znak (brand/df-app-icon.svg, brand/df-mark.svg) + napis Digital|Fortune w HTML (kolor z motywu) */
.brand-mark{width:38px;height:38px;display:block;flex:none;border-radius:9px}
.df-wordmark{font-weight:700;letter-spacing:-.02em;color:var(--df-text)}.df-wordmark span,.brand .df-wordmark span{display:inline;font-size:inherit;margin:0;color:var(--df-gold)}
.brand b{color:var(--df-text);letter-spacing:-.01em}.brand span{color:var(--df-muted)}
.mode-chip{border-radius:var(--df-radius-xs);background:var(--df-accent-soft);border-color:var(--df-accent-line);color:var(--df-accent-text);letter-spacing:.06em}
.mode-chip i,.status-chip i,.server-state i{background:var(--df-pos);box-shadow:0 0 0 3px var(--df-pos-soft)}
body .nav{font-weight:500!important;color:var(--df-text-2)!important;border-radius:var(--df-radius-sm);border:1px solid transparent;transition:background .12s,color .12s}
body .nav:hover{background:var(--df-panel-2);color:var(--df-text)!important}
body .nav.active{background:var(--df-accent-soft);border-color:transparent;color:var(--df-text)!important;font-weight:600!important;box-shadow:inset 2px 0 0 var(--df-accent)}
.nav-label{color:var(--df-faint);font-weight:600;letter-spacing:.14em}
.server-state{border-top-color:var(--df-border);color:var(--df-muted)}
.topbar{border-bottom:1px solid var(--df-border)}
.topbar h1{font-weight:650;letter-spacing:-.02em;color:var(--df-text)}
.topbar p{color:var(--df-muted)}
.eyebrow{color:var(--df-label);font-weight:700;letter-spacing:.14em}
.status-chip,.tiny-pill{border-radius:var(--df-radius-xs);border-color:var(--df-border-2);background:var(--df-panel-2);color:var(--df-text-2);letter-spacing:.06em}
.top-icon{background:var(--df-panel-2);border:1px solid var(--df-border-2);border-radius:var(--df-radius-sm);color:var(--df-text-2)}
.top-icon:hover{border-color:var(--df-border-3);color:var(--df-text)}
.df-settings-btn{display:inline-grid;place-items:center;padding:0}.df-settings-btn svg{transition:transform .25s}.df-settings-btn:hover svg{transform:rotate(45deg);color:var(--df-gold)}

/* ---------------- 3. panele i karty ---------------- */
body .panel{background:var(--df-panel);border:1px solid var(--df-border);border-radius:var(--df-radius);box-shadow:var(--df-shadow)}
.panel-head h2,.cc-section-head h2{color:var(--df-text);font-weight:650;letter-spacing:-.01em}
.panel-head p,.cc-section-head p{color:var(--df-muted)}
.stat-card,.cc-kpi,.portfolio-summary article{background:var(--df-panel);border:1px solid var(--df-border);border-radius:var(--df-radius);box-shadow:var(--df-shadow)}
.stat-card span,.stat-card small,.cc-kpi>span,.cc-kpi>small{color:var(--df-muted)}
.cc-kpi>span{color:var(--df-label);font-weight:700}
.cc-kpi strong,.stat-card strong{color:var(--df-text);font-weight:500;letter-spacing:-.01em}
.portfolio-summary article strong{font-weight:600;letter-spacing:-.01em}
.cc-bot{background:var(--df-panel);border:1px solid var(--df-border);border-left:3px solid var(--df-border-3);border-radius:var(--df-radius);box-shadow:var(--df-shadow)}
.cc-bot:hover,.cc-bot:focus-visible{border-color:var(--df-border-3);background:var(--df-panel-2)}
.cc-bot.cc-st-run{border-left-color:var(--df-pos)}.cc-bot.cc-st-pause{border-left-color:var(--df-warn)}.cc-bot.cc-st-err{border-left-color:var(--df-neg)}
.cc-bot.cc-bot-live{box-shadow:inset 0 0 0 1px var(--df-neg-soft),var(--df-shadow)}
.cc-bot h3{color:var(--df-text);font-weight:600}.cc-bot header p,.cc-pos-msg{color:var(--df-muted)}
.cc-trade-card{background:var(--df-panel);border-color:var(--df-border);border-left-color:var(--df-accent);border-radius:var(--df-radius)}
.cc-trade-card.cc-live-row{border-left-color:var(--df-neg)}
.cc-status-run{color:var(--df-pos-text)}.cc-status-pause{color:var(--df-warn)}.cc-status-stop{color:var(--df-text-2)}.cc-status-err{color:var(--df-neg-text)}
.cc-mode{border-radius:var(--df-radius-xs);border-color:var(--df-border-3);color:var(--df-text-2);background:var(--df-panel-2)}
.cc-mode-live{border-color:var(--df-neg-line);color:var(--df-neg-text);background:var(--df-neg-soft)}
.cc-mode-dry-run{border-color:var(--df-accent-line);color:var(--df-accent-text);background:var(--df-accent-soft)}
.cc-mode-paper{border-color:var(--df-border-3);color:var(--df-text-2);background:var(--df-panel-2)}
.cc-start:not(:disabled){border-color:var(--df-pos-line);color:var(--df-pos-text)}
.cc-stop:not(:disabled){border-color:var(--df-warn-line);color:var(--df-warn)}
.cc-del:not(:disabled){color:var(--df-neg-text)}
.cc-toolbar select,#ccPerfBot{background:var(--df-input);border-color:var(--df-border-2);color:var(--df-text);border-radius:var(--df-radius-sm)}
.cc-emergency{background:var(--df-danger-zone);border-color:rgba(240,74,93,.28);border-radius:var(--df-radius)}
.cc-em-card{background:var(--df-danger-card);border-color:rgba(240,74,93,.2);border-radius:var(--df-radius)}
.cc-btn-danger{background:var(--df-neg);border-radius:var(--df-radius-sm)}.cc-btn-danger:hover{background:#ff5b6d}
.cc-btn-danger-outline{border-color:var(--df-neg-line);background:var(--df-neg-soft);color:var(--df-neg-text);border-radius:var(--df-radius-sm)}
.cc-btn-warn{border-color:var(--df-warn-line);background:var(--df-warn-soft);color:var(--df-warn);border-radius:var(--df-radius-sm)}
.portfolio-account,.portfolio-connect{border-radius:var(--df-radius)}

/* ---------------- 4. przyciski ---------------- */
body .create-btn{background:var(--df-accent);color:var(--df-on-accent);border:1px solid var(--df-accent);border-radius:var(--df-radius-sm);font-weight:600;box-shadow:0 1px 0 rgba(255,255,255,.12) inset;transition:background .12s,border-color .12s}
body .create-btn:hover:not(:disabled){background:var(--df-accent-hover);border-color:var(--df-accent-hover)}
body .create-btn:active:not(:disabled){background:var(--df-accent-press)}
body .secondary-btn{background:var(--df-panel-2);color:var(--df-text-2);border:1px solid var(--df-border-2);border-radius:var(--df-radius-sm);font-weight:500;transition:background .12s,border-color .12s,color .12s}
body .secondary-btn:hover:not(:disabled){background:var(--df-panel-3);border-color:var(--df-border-3);color:var(--df-text)}
body .secondary-btn.selected,body .secondary-btn.on,.cc-filters button.selected,.portfolio-filters button.selected{background:var(--df-accent-soft);border-color:var(--df-accent-line);color:var(--df-text)}
.cc-filters button,.portfolio-filters button{background:var(--df-panel-2);border-color:var(--df-border-2);color:var(--df-text-2);border-radius:var(--df-radius-sm);font-weight:600}
body .danger-btn{background:var(--df-neg-soft);color:var(--df-neg-text);border:1px solid var(--df-neg-line);border-radius:var(--df-radius-sm)}
body button:disabled{cursor:not-allowed}
body button:focus-visible,body a:focus-visible{outline:var(--df-focus-width) solid var(--df-accent-line);outline-offset:2px}

/* ---------------- 5. pola formularzy ---------------- */
body input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]),body select,body textarea{font:inherit;color:var(--df-text);background:var(--df-input);border:1px solid var(--df-border-2);border-radius:var(--df-radius-sm);padding:10px 12px;min-height:40px;box-sizing:border-box;transition:border-color .12s,box-shadow .12s}
body input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):hover,body select:hover,body textarea:hover{border-color:var(--df-border-3)}
body select option{background:var(--df-panel-2);color:var(--df-text)}
body input::placeholder,body textarea::placeholder{color:var(--df-faint)}
body input:focus,body select:focus,body textarea:focus{outline:none;border-color:var(--df-accent);box-shadow:0 0 0 3px var(--df-accent-soft)}
body input[type=checkbox],body input[type=radio],body input[type=range]{accent-color:var(--df-accent)}
.config-block label,.cc-toolbar label{color:var(--df-text-2)}

/* ---------------- 6. tabele ---------------- */
.data-table th,.cc-pos-table th{color:var(--df-muted);font-weight:600;border-bottom:1px solid var(--df-border-2);background:transparent}
.data-table td,.cc-pos-table td{border-bottom:1px solid var(--df-border);color:var(--df-text)}
.data-table tbody tr:hover td,.cc-pos-table tbody tr:hover td{background:var(--df-row-hover)}

/* ---------------- 7. znaczenia: profit / strata ---------------- */
.long,.cc-pos,.pos{color:var(--df-pos-text)}
.short,.cc-neg,.neg{color:var(--df-neg-text)}
.signal-badge{border-radius:var(--df-radius-xs);letter-spacing:.05em}
.signal-badge.long{background:var(--df-pos-soft);color:var(--df-pos-text)}
.signal-badge.short{background:var(--df-neg-soft);color:var(--df-neg-text)}
/* AI = złoty akcent (panel setupu AI, analiza Claude) */
.setup-panel{border-top:1px solid var(--df-gold-line)}
.setup-panel>.panel-head h2{color:var(--df-gold-text)}

/* ---------------- 8. liczby: font monospace ---------------- */
/* tylko główne wartości — drobne linie pomocnicze i etykiety paska Active Trades zostają w Inter (szerokość kolumn bez zmian);
   w tabelach liczby wyrównuje tabular-nums z body */
.df-num,.cc-kpi strong,.stat-card strong,.at-stat b,.at-pnl b,.at-volume,.cc-deal-pnl,.cc-deal-volume,.cc-trade-pnl,.ct-summary b{font-family:var(--df-font-mono);letter-spacing:-.01em}

/* ---------------- 9. Active Trades (My Portfolio, sekcja 4) — lokalne tokeny → globalne ---------------- */
#ccPositions .at-seg button.on{background:var(--df-accent-soft);color:var(--df-text);box-shadow:inset 0 -2px 0 var(--df-accent)}
#ccPositions,#ccClosed{--at-bg:var(--df-panel);--at-bg2:var(--df-bg-elev);--at-line:var(--df-border);--at-muted:var(--df-muted);--at-text:var(--df-text);--at-pos:var(--df-pos-text);--at-neg:var(--df-neg-text);--at-warn:var(--df-warn);--at-blue:var(--df-accent);--at-cur:var(--df-text)}

/* ---------------- 10. Simon Quant — premium, subtelne złoto (postać CRT i jej kolory bez zmian) ---------------- */
.jw-tip{background:var(--df-panel-2);border-color:var(--df-gold-line);border-radius:var(--df-radius-sm);box-shadow:var(--df-shadow-pop)}
.jw-tip b{color:var(--df-gold-text)}
.jw-trigger:focus-visible{outline-color:var(--df-gold)}
.jw-panel{background:var(--df-simon-bg);border-left:1px solid var(--df-gold-line);box-shadow:-18px 0 44px rgba(0,0,0,.55)}
.jw-panel::after{content:"";position:absolute;inset:0 0 auto 0;height:1px;background:linear-gradient(90deg,transparent,var(--df-gold-line),transparent);pointer-events:none}
.jw-title b{color:var(--df-gold-text);text-shadow:none;letter-spacing:.08em}
.jw-title span{color:var(--df-muted)}
.jw-close{background:var(--df-panel-2);border-color:var(--df-border-2);color:var(--df-text-2);border-radius:var(--df-radius-sm)}
.jw-close:hover{border-color:var(--df-gold-line);color:var(--df-text)}
.jw-chip{background:var(--df-panel-2);border-color:var(--df-border-2);color:var(--df-text-2);border-radius:var(--df-radius-sm)}
.jw-chip:hover,.jw-link:hover{border-color:var(--df-gold-line);color:var(--df-gold-text)}
.jw-card{background:var(--df-panel);border-color:var(--df-border);border-radius:var(--df-radius)}
.jw-card[data-source="ai"]{border-color:var(--df-gold-line);box-shadow:inset 2px 0 0 var(--df-gold)}
.jw-card[data-source="cache"]{border-color:var(--df-border-2)}
.jw-head h4{color:var(--df-text)}.jw-q,.jw-foot{color:var(--df-muted)}
.jw-form input{background:var(--df-input);border-color:var(--df-border-2);color:var(--df-text);border-radius:var(--df-radius-sm)}
.jw-form input:focus{border-color:var(--df-gold);box-shadow:0 0 0 3px var(--df-gold-soft)}
.jw-send{background:linear-gradient(140deg,#dcbc78,#b08a43);color:#17120a;border-radius:var(--df-radius-sm)}
.jw-say{background:var(--df-panel-2);border-color:var(--df-gold-line);color:var(--df-text)}
.jw-say::before{color:var(--df-gold-text)}
.jw-say[data-tone=neutral]{background:var(--df-panel-2);border-color:var(--df-border-2);color:var(--df-text)}
.jw-ctx{background:var(--df-panel-2);border-color:var(--df-border-2);color:var(--df-text-2);border-radius:var(--df-radius-sm)}
.jw-link{border-color:var(--df-border-2);color:var(--df-accent-text);border-radius:var(--df-radius-sm)}
.jw-ai-btn{background:linear-gradient(140deg,#dcbc78,#b08a43);color:#17120a;border-radius:var(--df-radius-sm)}
.jw-ai-btn:disabled{background:var(--df-panel-3);color:var(--df-faint)}
.jw-badge{border-radius:var(--df-radius-xs)}.jw-badge.jw-ai{background:var(--df-gold-soft);color:var(--df-gold-text)}.jw-badge.jw-cache{background:var(--df-accent-soft);color:var(--df-accent-text)}
.jw-send:hover:not(:disabled){background:linear-gradient(140deg,#e6c98c,#bf9850)}

/* ---------------- 11. Ustawienia → Wygląd aplikacji (theme.js mountPicker) ---------------- */
.df-theme-note{color:var(--df-muted);font-size:12px;margin:4px 0 14px}
.df-theme-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px}
.df-theme-option{position:relative;display:grid;gap:10px;padding:10px;border:1px solid var(--df-border-2);border-radius:var(--df-radius);background:var(--df-panel-2);cursor:pointer;transition:border-color .12s,background .12s}
.df-theme-option:hover{border-color:var(--df-border-3)}
.df-theme-option.on{border-color:var(--df-accent);box-shadow:0 0 0 1px var(--df-accent) inset;background:var(--df-accent-soft)}
.df-theme-option input{position:absolute;opacity:0;pointer-events:none}
.df-theme-option:has(input:focus-visible){outline:var(--df-focus-width) solid var(--df-accent-line);outline-offset:2px}
.df-theme-label b{display:block;font-size:13px;color:var(--df-text)}.df-theme-label small{display:block;font-size:11px;color:var(--df-muted);margin-top:2px}
.df-theme-preview{display:flex;height:74px;border-radius:var(--df-radius-sm);overflow:hidden;background:var(--p-bg);border:1px solid var(--p-line)}
.df-theme-preview i{display:flex;flex-direction:column;gap:5px;padding:7px}.df-theme-preview b{display:block;border-radius:2px}
.df-theme-preview .p-side{width:26%;border-right:1px solid var(--p-line)}.df-theme-preview .p-side b{height:4px;background:var(--p-line)}.df-theme-preview .p-side b:first-child{background:var(--p-gold);width:60%}
.df-theme-preview .p-main{flex:1;margin:6px;padding:7px;background:var(--p-panel);border:1px solid var(--p-line);border-radius:3px}
.df-theme-preview .p-title{height:5px;width:55%;background:var(--p-text)}.df-theme-preview .p-row{height:4px;background:var(--p-line)}.df-theme-preview .p-row.short{width:70%}
.df-theme-preview .p-btn{height:8px;width:38%;margin-top:auto;background:var(--p-accent)}
.df-theme-option.on .df-theme-label b::after{content:" ✓";color:var(--df-accent-text)}

/* ---------------- 12. dotychczasowe reguły układu (bez zmian) ---------------- */
.config-fields>label{display:flex;flex-direction:column;gap:7px;font-weight:600}.config-fields{gap:16px}#dca-active .config-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(155px,1fr));align-items:end;margin:20px 0}#dcaActionMessage{grid-column:1/-1}#activeBots td:last-child{min-width:210px}.account-switch{display:flex;gap:10px;align-items:center;padding:12px 0}.account-switch strong{color:var(--df-accent-text)}.account-switch small{color:var(--df-muted)}