@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@800&display=swap');
/* ===== THEME TOKENS ===== */
:root, body.dark{
  --bg:#08090b; --shell:#0a0b0d; --panel:#101216; --panel2:#14171c; --inset:#0c0e11;
  --line:#1f2329; --line2:#272c33;
  --ink:#ece7dc; --ink-strong:#f3eee3; --ink2:#c7c3b9; --mut:#8c8a83; --mut2:#6f6d67;
  --gold:#cda96a; --gold2:#e3c489; --goldsoft:#1a1408; --goldline:#3a2f15;
  --green:#7fd9ad; --greenline:#1f4a3c; --greensoft:#0c1a15;
  --red:#dd9a8e; --redline:#4a261f;
  --blue:#8fb7e6; --blueline:#274768; --bluesoft:#0e1722;
  --violet:#b9a3e3; --violetline:#3a3060; --violetsoft:#171228;
  --orange:#e8995a;
  --logo-ink:#f3eee3;
  --track:#1a1e24; --grid:#1c2026; --rowline:#15181d; --prodbg:#f5f3ee;
}
body.light{
  --bg:#efe9dd; --shell:#f6f2ea; --panel:#ffffff; --panel2:#fbf8f1; --inset:#f3eee3;
  --line:#e4ddcd; --line2:#d8cfba;
  --ink:#1c1a15; --ink-strong:#15130d; --ink2:#3f3a2f; --mut:#7c766a; --mut2:#9b9484;
  --gold:#a07320; --gold2:#8a611a; --goldsoft:#f6edd7; --goldline:#e3d2a4;
  --green:#1d8a5f; --greenline:#bfe3d2; --greensoft:#e7f4ec;
  --red:#b14f3c; --redline:#edcbc1;
  --blue:#356fb0; --blueline:#c2d6ee; --bluesoft:#e8f0f9;
  --violet:#6a4ca6; --violetline:#d9cdf0; --violetsoft:#efe9fb;
  --orange:#c96a1f;
  --logo-ink:#15130d;
  --track:#ece4d3; --grid:#e7ddc9; --rowline:#efe8da; --prodbg:#ffffff;
}
body.white{
  --bg:#ffffff; --shell:#ffffff; --panel:#ffffff; --panel2:#fafafa; --inset:#f4f4f5;
  --line:#e8e8ea; --line2:#dadade;
  --ink:#18181b; --ink-strong:#0f0f11; --ink2:#3f3f46; --mut:#71717a; --mut2:#a1a1aa;
  --gold:#a07320; --gold2:#8a611a; --goldsoft:#f6edd7; --goldline:#e3d2a4;
  --green:#1d8a5f; --greenline:#bfe3d2; --greensoft:#e7f4ec;
  --red:#b14f3c; --redline:#edcbc1;
  --blue:#356fb0; --blueline:#c2d6ee; --bluesoft:#e8f0f9;
  --violet:#6a4ca6; --violetline:#d9cdf0; --violetsoft:#efe9fb;
  --orange:#c96a1f;
  --logo-ink:#0f0f11;
  --track:#ececef; --grid:#eeeef0; --rowline:#f1f1f3; --prodbg:#ffffff;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--ink);font-family:'Hanken Grotesk',system-ui,sans-serif;-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%;text-size-adjust:100%;transition:background .25s,color .25s}
.num{font-family:'Archivo',sans-serif;font-variant-numeric:tabular-nums}
.wrap{max-width:1180px;margin:0 auto;padding:26px 20px 60px}
.dash{background:var(--shell);border:1px solid var(--line2);border-radius:16px;overflow:hidden;transition:background .25s,border-color .25s}

/* topbar */
.top{display:flex;align-items:center;justify-content:flex-start;gap:14px;padding:16px 22px;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:6px}
.logolink{display:inline-flex;align-items:center;cursor:pointer;text-decoration:none}
.logo{height:27px;width:auto;fill:var(--logo-ink);transition:fill .25s,opacity .15s}
.logolink:hover .logo{opacity:.7}
.pill{display:inline-flex;align-items:center;gap:7px;font-size:11.5px;color:var(--gold2);background:var(--goldsoft);border:1px solid var(--goldline);border-radius:20px;padding:0 11px;height:27px;box-sizing:border-box}
.dot{width:7px;height:7px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 0 rgba(205,169,106,.6);animation:pulse 2.4s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(205,169,106,.5)}70%{box-shadow:0 0 0 7px rgba(205,169,106,0)}100%{box-shadow:0 0 0 0 rgba(205,169,106,0)}}
.pill{cursor:default}
#statusPill{user-select:none;cursor:pointer}
#statusPill:hover{border-color:var(--goldline)}
.dot.syncing{background:#e8c14a;position:relative;animation:none;box-shadow:none}
.dot.syncing::before,.dot.syncing::after{content:"";position:absolute;inset:0;border-radius:50%;border:1.5px solid rgba(232,193,74,.75);animation:radar 1.3s ease-out infinite}
.dot.syncing::after{animation-delay:.65s}
@keyframes radar{0%{transform:scale(1);opacity:.85}100%{transform:scale(5);opacity:0}}
@keyframes pulseY{0%{box-shadow:0 0 0 0 rgba(232,193,74,.55)}70%{box-shadow:0 0 0 7px rgba(232,193,74,0)}100%{box-shadow:0 0 0 0 rgba(232,193,74,0)}}
.dot.done{background:var(--red);animation:none;box-shadow:none}
.dot.ok{background:var(--green);animation:none;box-shadow:none}
.dot.warn{background:#e8c14a;animation:none;box-shadow:none}
.pill.ok{color:var(--green);background:var(--greensoft);border-color:var(--greenline)}
.pill.warn{color:var(--gold2);background:var(--goldsoft);border-color:var(--goldline)}
.controls{display:flex;align-items:center;gap:10px;position:relative}
.seg{display:inline-flex;background:var(--inset);border:1px solid var(--line);border-radius:9px;overflow:hidden}
.seg button{font-family:inherit;font-size:12px;padding:6px 11px;color:var(--mut);background:none;border:0;cursor:pointer;transition:.15s}
.seg button:last-child{border-right:0}
.seg button.on{background:var(--gold);color:var(--bg);font-weight:600;border-radius:9px}
/* ---- bara de perioadă (Azi/Ieri · Zi · Zile · Luni · …) ---- */
.pbar{display:flex;align-items:stretch;gap:7px;flex-wrap:nowrap;width:100%}
.pbar .seg button{padding:7px 13px}
.pdrop{position:relative}
.pbtn{font-family:inherit;font-size:12px;color:var(--gold2);background:var(--goldsoft);border:1px solid var(--goldline);border-radius:9px;padding:7px 12px;cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:.15s;white-space:nowrap}
.pbtn:hover{border-color:var(--gold)}
.pbtn.caret::after{content:"";width:8px;height:5px;flex:none;background:no-repeat center/8px 5px url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="8" height="5" viewBox="0 0 8 5" fill="none" stroke="%23cda96a" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"><path d="M1 1l3 3 3-3"/></svg>')}
.pbtn.on{background:var(--gold);color:var(--bg);border-color:var(--gold);font-weight:600}
.pbtn.on.caret::after{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="8" height="5" viewBox="0 0 8 5" fill="none" stroke="%23121212" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M1 1l3 3 3-3"/></svg>')}
.pdrop.open .pbtn.caret::after{transform:scaleY(-1)}
.pmenu{position:absolute;top:calc(100% + 6px);left:0;z-index:45;min-width:178px;background:var(--panel);border:1px solid var(--line2);border-radius:11px;padding:6px;box-shadow:0 14px 34px rgba(0,0,0,.45);display:flex;flex-direction:column;gap:2px}
.pmenu[hidden]{display:none}
.pdrop[data-drop="more"] .pmenu{left:auto;right:0}
.pmenu.compact{min-width:0;width:100%;padding:5px}
.pmenu.compact button{text-align:center;padding:8px 6px;font-variant-numeric:tabular-nums}
.pmenu button{font-family:inherit;font-size:12.5px;text-align:left;color:var(--ink2);background:none;border:0;border-radius:7px;padding:8px 11px;cursor:pointer;transition:.12s;white-space:nowrap}
.pmenu button:hover{background:var(--inset);color:var(--gold2)}
.pmenu.cal{padding:11px;gap:9px;min-width:0}
.cal-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
.cal-title{font-family:'Archivo',sans-serif;font-size:12.5px;font-weight:600;color:var(--ink-strong);letter-spacing:.01em}
.cal-nav{width:26px;height:26px;display:inline-flex;align-items:center;justify-content:center;font-size:16px;line-height:1;color:var(--gold2);background:var(--goldsoft);border:1px solid var(--goldline);border-radius:7px;cursor:pointer;transition:.12s}
.cal-nav:hover{background:var(--gold);color:var(--bg);border-color:var(--gold)}
.cal-dow,.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.cal-dow span{text-align:center;font-size:9.5px;letter-spacing:.03em;color:var(--mut);padding:2px 0;text-transform:uppercase}
.cal-cell{width:30px;height:30px;display:inline-flex;align-items:center;justify-content:center;font-family:'Archivo',sans-serif;font-size:12px;color:var(--ink2);background:none;border:1px solid transparent;border-radius:7px;cursor:pointer;transition:.1s}
.cal-cell:hover:not(.disabled){background:var(--inset);color:var(--gold2)}
.cal-cell.empty{visibility:hidden;cursor:default}
.cal-cell.today{border-color:var(--goldline);color:var(--gold2)}
.cal-cell.sel{background:var(--gold);color:var(--bg);border-color:var(--gold);font-weight:600}
.cal-cell.disabled{color:var(--mut2);opacity:.4;cursor:default}
.periodsel{font-family:inherit;font-size:12px;color:var(--gold2);background:var(--goldsoft);border:1px solid var(--goldline);border-radius:9px;padding:7px 30px 7px 12px;cursor:pointer;-webkit-appearance:none;appearance:none;background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="10" height="6" viewBox="0 0 10 6" fill="none" stroke="%23cda96a" stroke-width="1.6"><path d="M1 1l4 4 4-4"/></svg>');background-repeat:no-repeat;background-position:right 11px center}
.periodsel:focus{outline:none;border-color:var(--gold)}
.periodsel option{background:var(--panel);color:var(--ink)}
.iconbtn{width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;background:var(--inset);border:1px solid var(--line);border-radius:9px;cursor:pointer;color:var(--ink2);transition:.15s}
.iconbtn:hover{border-color:var(--goldline);color:var(--gold2)}
.iconbtn svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.7}

/* kpis */
.kpis{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--line);border-bottom:1px solid var(--line)}
.k{background:var(--panel);padding:13px 15px;transition:background .25s}
.k .label{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--mut);margin-bottom:7px}
.k .v{font-family:'Archivo',sans-serif;font-variant-numeric:tabular-nums;font-weight:600;font-size:21px;color:var(--ink-strong);line-height:1}
.k .v small{font-size:12px;color:var(--mut);font-weight:400}
.k .s{font-size:10.5px;color:var(--mut2);margin-top:5px}
.k.gold{box-shadow:inset 3px 0 0 var(--gold)}
.k.green .v{color:var(--green)} .k.green{box-shadow:inset 3px 0 0 var(--green)}
.k.red .v{color:var(--red)}
.estbadge{font-family:'Archivo',sans-serif;font-size:9px;letter-spacing:.06em;color:var(--gold2);background:var(--goldsoft);border:1px solid var(--goldline);border-radius:5px;padding:1px 5px;text-transform:uppercase}

/* body */
.body{display:grid;grid-template-columns:1.75fr 1fr;gap:1px;background:var(--line)}
.card{background:var(--shell);min-width:0}
.body>.card{display:flex;flex-direction:column}
.ch{display:flex;justify-content:space-between;align-items:center;padding:13px 16px 6px}
.ch .t{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--mut)}
.ch .t b{color:var(--gold);font-weight:500}
.ch .range{font-family:'Archivo',sans-serif;font-variant-numeric:tabular-nums;text-transform:none;letter-spacing:0;color:var(--ink2);font-weight:600}
svg.chart{width:100%;height:176px;display:block;padding:0 12px 12px}

/* chart HTML — vânzări zilnice */
.chart2{display:flex;flex-direction:column;gap:6px;flex:1;min-height:198px;padding:10px 16px 14px;box-sizing:border-box}
.chart2 .main{display:flex;gap:6px;flex:1;min-height:0}
.chart2 .yax{position:relative;width:34px;flex:none;font-family:'Archivo',sans-serif;font-variant-numeric:tabular-nums}
.chart2 .yl{position:absolute;right:0;font-size:9px;color:var(--mut2);line-height:1;white-space:nowrap}
.chart2 .yl.mid{transform:translateY(50%);color:var(--mut)}
.chart2 .plot{position:relative;flex:1;min-width:0}
.chart2 .avgline{position:absolute;left:0;right:0;height:0;border-top:1px dashed var(--line2)}
.chart2 .cols{position:absolute;inset:0;display:flex;align-items:flex-end;gap:2px}
.chart2 .col{flex:1;min-width:0;height:100%;display:flex;align-items:flex-end}
.chart2 .col i{display:block;width:100%;background:var(--gold);border-radius:2px 2px 0 0;min-height:1px}
.chart2 .col.peak i{background:var(--gold2)}
.chart2 .col.empty i{opacity:.28}
.chart2 .xrow{display:flex;gap:6px;height:14px;flex:none}
.chart2 .xrow .sp{width:34px;flex:none}
.chart2 .xlabels{flex:1;min-width:0;display:flex;gap:2px}
.chart2 .xlabels .xl{flex:1;min-width:0;text-align:center;font-family:'Archivo',sans-serif;font-size:9px;color:var(--mut2);white-space:nowrap;overflow:visible}
.chart2 .ctip{position:absolute;transform:translateX(-50%);background:var(--panel);color:var(--ink-strong);border:1px solid var(--line2);border-radius:7px;padding:4px 9px;font-family:'Archivo',sans-serif;font-size:11px;font-weight:600;white-space:nowrap;pointer-events:none;box-shadow:0 6px 16px rgba(0,0,0,.35);z-index:6}
.chart2 .ctip[hidden]{display:none}
.chart2 .ctip::after{content:"";position:absolute;left:50%;top:100%;transform:translateX(-50%);width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-top:6px solid var(--panel);filter:drop-shadow(0 1px 0 var(--line2))}
.chart2 .col{cursor:pointer}
.rail{padding:13px 16px}
.mini{margin-bottom:12px}
.prop{margin-bottom:16px}
.ordtbl{min-width:600px}
.vchk{color:var(--green);font-weight:700;font-size:13px}
.vno{color:var(--mut2)}
.onum{color:var(--ink2);font-size:12px;white-space:nowrap;text-decoration:none;display:inline-block}
a.onum:hover{color:var(--gold2);text-decoration:underline}
.obadges{display:flex;gap:4px;margin-top:5px}

/* tooltip la tap pe badge-uri (mobil + desktop) */
.obtip{position:absolute;z-index:600;background:var(--ink-strong);color:var(--bg);font-family:'Archivo',sans-serif;font-size:11px;font-weight:500;padding:4px 9px;border-radius:6px;white-space:pre-line;text-align:center;line-height:1.3;max-width:min(240px,80vw);pointer-events:none;opacity:0;transform:translateY(3px);transition:opacity .12s,transform .12s;box-shadow:0 5px 16px rgba(0,0,0,.4);-webkit-text-size-adjust:100%;text-size-adjust:100%;max-height:100000px}
.obtip.show{opacity:1;transform:translateY(0)}
/* săgeata („v") care leagă tooltipul de elementul la care se referă */
.obtip::after{content:"";position:absolute;top:100%;left:var(--ax,50%);transform:translateX(-50%);border:6px solid transparent;border-top-color:var(--ink-strong);filter:drop-shadow(0 2px 1px rgba(0,0,0,.18))}
.obtip.below::after{top:auto;bottom:100%;border-top-color:transparent;border-bottom-color:var(--ink-strong);filter:drop-shadow(0 -2px 1px rgba(0,0,0,.18))}
.obadges .ob{cursor:pointer}
.ob{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:5px;font-family:'Archivo',sans-serif;font-size:10px;font-weight:700;border:1px solid}
.ob-r{color:var(--gold2);background:var(--goldsoft);border-color:var(--goldline)}
.ob-cc{width:auto;padding:0 4px;color:var(--blue);background:var(--bluesoft);border-color:var(--blueline);letter-spacing:.04em}
.ob-x{color:#fff;background:var(--red);border-color:var(--red);font-size:12px}
.ob-c{color:var(--green);background:var(--greensoft);border-color:var(--greenline)}
.ob-g{border:0;background:none;overflow:visible}
.ob-g .gico{width:16px;height:16px;display:block}
@media(max-width:720px){.ob-g .gico{width:14px;height:14px}}
/* fulfillment: cerc mic (ca Genius) — E=FBE (roșu), S=vânzător (albastru).
   Textul folosește tokenul „line" (opusul temei față de fill) => lizibil în dark ȘI light. */
.ob-e{width:15px;height:15px;border-radius:50%;font-size:9px;color:var(--redline);background:var(--red);border-color:var(--red)}
.ob-s{width:15px;height:15px;border-radius:50%;font-size:9px;color:var(--blueline);background:var(--blue);border-color:var(--blue)}
@media(max-width:720px){.ob-e,.ob-s{width:13px;height:13px;font-size:8px}}
/* țară BG/HU: cod albastru pe text, fără chenar/fundal */
.ob-flag{display:inline-flex;align-items:center;cursor:pointer;font-family:'Archivo',sans-serif;font-size:11px;font-weight:800;letter-spacing:.02em;color:var(--blue)}
@media(max-width:720px){.ob-flag{font-size:10px}}
/* badge-uri cu iconiță (card/ramburs): fără chenar/fundal, doar iconița colorată */
.ob-ic{border:0;background:none}
.ob-ic svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:720px){.ob-ic svg{width:12px;height:12px}}
.ordtbl .vcol{text-align:center;font-family:'Archivo',sans-serif;font-variant-numeric:tabular-nums;line-height:1.15}
/* .vpaid = suma primită, verde mare (sus): comandă fără discount ȘI suma finală la comenzile cu discount */
.ordtbl .vcol .vpaid{font-size:15.5px;font-weight:600;color:var(--green)}
/* .vorig = valoarea înainte de discount, roșu TĂIAT text mic pe rândul 2 (stil reducere) */
.ordtbl .vcol .vorig{display:block;font-size:12.5px;color:var(--red);text-decoration:line-through;font-weight:500;margin-top:0}
.ordtbl .vcol .vship{display:block;font-size:11px;color:var(--mut);font-weight:500;margin-top:1px;white-space:nowrap}
.ordtbl .vchcol{text-align:center;vertical-align:middle}
.vtags{display:flex;flex-direction:row;flex-wrap:wrap;gap:5px;align-items:center;justify-content:center}
.vdot{display:inline-flex;align-items:center;justify-content:center;min-width:34px;height:23px;padding:0 8px;border-radius:999px;border:1px solid;font-family:'Archivo',sans-serif;font-size:11.5px;font-weight:600;font-variant-numeric:tabular-nums}
.vdot-seller{border-color:var(--redline);background:var(--redsoft,rgba(221,154,142,.1));color:var(--red)}
.vdot-emag{border-color:var(--greenline);background:var(--greensoft);color:var(--green)}
.vdot-ico{min-width:26px;width:26px;height:26px;padding:0;border-radius:50%}
.vdot-ico .vico{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* orders table — compact pe mobil ca să încapă fără scroll */
@media(max-width:560px){
  .ordtbl{min-width:0;font-size:11px}
  .ordtbl thead th{padding:7px 4px;font-size:8.5px;letter-spacing:0}
  .ordtbl td{padding:5px 4px}
  /* max 3 produse pe rând, al 4-lea trece sub primul; ~5px până la liniile rândului */
  .ordtbl .pcell{gap:3px;flex-wrap:wrap;max-width:110px}
  .ordtbl .pcell img,.ordtbl .pcell .pi img{width:34px;height:34px;padding:2px}
  .ordtbl .pi .qty{font-size:8px;right:-4px;bottom:-4px;line-height:12px;padding:0 3px}
  .onum{font-size:10.5px}
  .obadges{gap:3px;margin-top:4px}
  .ob{width:15px;height:15px;font-size:8.5px;border-radius:4px}
  .vchk{font-size:12px}
  .vdot{min-width:30px;height:20px;font-size:10.5px;padding:0 6px}
  .vdot-ico{min-width:22px;width:22px;height:22px;padding:0}
  .vdot-ico .vico{width:12px;height:12px}
}
.prop .ptitle{font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--mut);margin-bottom:7px}
.propbar{display:flex;align-items:stretch;height:22px;border-radius:7px;overflow:hidden;background:var(--track)}
.pseg{display:flex;align-items:center;height:100%;font-family:'Archivo',sans-serif;font-size:12px;font-weight:800;letter-spacing:.02em;color:#000;white-space:nowrap;overflow:hidden;transition:width .3s}
.psep{width:2px;flex:none;background:var(--bg)}
.propleg{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px 16px;margin-top:8px}
.pleg{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;color:var(--mut)}
.pleg i{width:9px;height:9px;border-radius:2px;flex:none}
.pleg b{font-family:'Archivo',sans-serif;color:var(--ink2);font-weight:600}
.mh{display:flex;justify-content:space-between;font-size:11.5px;color:var(--ink2);margin-bottom:5px}
.mh span:last-child{color:var(--mut)}
.track{height:7px;background:var(--track);border-radius:5px;overflow:hidden}
.fill{height:100%}
.g2{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:6px}
.ms{background:var(--inset);border:1px solid var(--line);border-radius:8px;padding:8px 9px}
.ms .l{font-size:10px;color:var(--mut);margin-bottom:3px}
.ms .n{font-family:'Archivo',sans-serif;font-weight:600;font-size:15px;color:var(--ink)}
.msbtn{cursor:pointer;transition:.12s;user-select:none}
.msbtn:hover{border-color:var(--line2);background:var(--panel2)}
.msbtn.on{background:var(--redsoft,rgba(221,154,142,.1));border-color:var(--red);box-shadow:inset 0 2px 5px rgba(0,0,0,.18);transform:translateY(1px)}
.msbtn.on .n{color:var(--red)}
.motiv{font-size:11.5px;color:var(--ink2);max-width:340px;line-height:1.45;text-wrap:pretty}

/* products row */
.prodrow{display:grid;grid-template-columns:repeat(6,1fr);background:var(--shell);border-top:1px solid var(--line)}
.pt{background:var(--shell);padding:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:6px;min-width:0;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.pt img{width:60px;height:60px;object-fit:contain;background:var(--prodbg);border-radius:9px;padding:2.5px}
.pt .pv{font-family:'Archivo',sans-serif;font-weight:600;font-size:14px;color:var(--ink-strong)}
.pt .ps{font-size:10px;color:var(--mut);white-space:nowrap}
.pt .ps.big{font-size:12px;font-weight:600;color:var(--ink2)}
/* produs selectabil -> filtreaz\u0103 tabelul */
.pt{cursor:pointer;position:relative;transition:background .12s}
.pt:hover{background:var(--inset)}
.pt.sel{background:var(--redsoft,rgba(221,154,142,.08));box-shadow:inset 0 0 0 2px var(--red);border-radius:12px;z-index:1}
/* caption tabel comenzi filtrat pe produs */
#ordCaption{background:var(--panel);border-top:1px solid var(--line)}
.ordcap{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;padding:11px 16px}
.ordcap-t{font-family:'Fraunces',serif;font-size:15px;color:var(--ink-strong)}
.ordcap-t b{color:var(--red);font-weight:600}
.ordcap-x{font-size:11px;color:var(--mut2)}

/* table */
table{width:100%;border-collapse:collapse;font-size:12px}
thead th{text-align:left;font-size:10px;text-transform:uppercase;letter-spacing:.04em;color:var(--mut2);font-weight:500;padding:10px 16px 8px;border-bottom:1px solid var(--line);border-top:1px solid var(--line)}
td{padding:8px 16px;border-bottom:1px solid var(--rowline);color:var(--ink2)}
tr:last-child td{border-bottom:0}
td.r{text-align:right;font-family:'Archivo',sans-serif}
.pcell img{width:46px;height:46px;object-fit:contain;background:var(--prodbg);border-radius:3.5px;padding:1.5px;display:block}
/* imaginile din lista de comenzi mai mari: rândul se strânge la 3px sus/jos (doar desktop) */
@media(min-width:561px){.ordtbl td{padding-top:3px;padding-bottom:3px;vertical-align:middle}}
.bdg{font-size:9.5px;padding:2px 6px;border-radius:5px;border:1px solid;white-space:nowrap}
.b-card{color:var(--green);border-color:var(--greenline);background:var(--greensoft)}
.b-cod{color:var(--gold2);border-color:var(--goldline);background:var(--goldsoft)}
.b-gen{color:var(--violet);border-color:var(--violetline);background:var(--violetsoft)}
.b-fbe{color:var(--green);border-color:var(--greenline);background:var(--greensoft)}
.b-own{color:var(--mut);border-color:var(--line2);background:var(--inset)}

/* footer nav */
.footnav{display:flex;flex-wrap:wrap;align-items:center;gap:10px;border-top:1px solid var(--line);padding:14px 20px;background:var(--inset)}
.footnav .grow{flex:1}
.fbtn{display:inline-flex;align-items:center;gap:8px;font-family:inherit;font-size:12.5px;color:var(--ink2);background:var(--panel);border:1px solid var(--line2);border-radius:9px;padding:9px 14px;cursor:pointer;transition:.15s;text-decoration:none}
.fbtn:hover{border-color:var(--goldline);color:var(--gold2)}
.fbtn svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.7}
.fbtn.on{background:var(--goldsoft);border-color:var(--goldline);color:var(--gold2)}
.fbtn.busy{background:var(--goldsoft);border-color:var(--goldline);color:var(--gold2);animation:pulseY 1.1s ease-in-out infinite}
.fbtn.busy svg{stroke:var(--gold2)}
.fbtn.done{background:var(--greensoft);border-color:var(--greenline);color:var(--green)}
.synccount{font-family:'Archivo',sans-serif;font-variant-numeric:tabular-nums;font-size:12px;color:var(--mut);padding:0 4px;white-space:nowrap}
.synccount.mismatch{color:var(--red);font-weight:600}
/* contor sincronizare pe cont+țară (FBE RO 8.402/8.402 · BG … — FBS RO …) */
.synccount .cok{color:var(--mut)}
.synccount .cbad{color:var(--red);font-weight:600}
.synccount .cna{color:var(--mut2)}
.synccount .csep{color:var(--mut2);padding:0 6px}
.synccount .cacc{color:var(--ink2);font-weight:600;letter-spacing:.03em}
.synccount .csep2{color:var(--mut2);padding:0 9px}
/* pe mobil: contorul devine bloc compact pe 2 rânduri (FBE / FBS), deasupra butoanelor */
@media(max-width:720px){
  .synccount{order:-1;flex:1 1 100%;display:flex;flex-direction:column;gap:3px;white-space:normal;font-size:10.5px;line-height:1.4;padding:0 2px 4px}
  .synccount .caccrow{display:flex;align-items:baseline;flex-wrap:wrap;gap:0 4px;white-space:nowrap}
  .synccount .cacc{min-width:30px}
  .synccount .csep{padding:0 3px}
  .synccount .csep2{display:none}
}

/* dialog Curs valutar (BGN/HUF -> lei) */
.fxoverlay{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:500;display:flex;align-items:center;justify-content:center}
.fxoverlay[hidden]{display:none}
.fxbox{background:var(--shell);border:1px solid var(--line2);border-radius:14px;padding:20px 22px;min-width:300px;max-width:92vw;box-shadow:0 22px 60px rgba(0,0,0,.55)}
.fxtitle{font-size:14px;font-weight:600;color:var(--ink-strong);margin-bottom:14px}
.fxrow{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--ink2);margin-bottom:10px;white-space:nowrap}
.fxinp{font-family:'Archivo',sans-serif;font-size:13px;width:110px;padding:7px 9px;border-radius:8px;border:1px solid var(--line2);background:var(--inset);color:var(--ink-strong)}
.fxinp:focus{outline:none;border-color:var(--goldline)}
.fxhint{font-size:11.5px;color:var(--mut);line-height:1.45;margin:10px 0 14px;max-width:340px;white-space:normal}
.fxactions{display:flex;justify-content:flex-end;gap:8px}
.fxbtn{font-family:inherit;font-size:12.5px;padding:8px 14px;border-radius:9px;border:1px solid var(--line2);background:var(--inset);color:var(--ink2);cursor:pointer;transition:.12s}
.fxbtn:hover{color:var(--ink-strong);border-color:var(--line2)}
.fxbtn-save{color:var(--gold2);background:var(--goldsoft);border-color:var(--goldline)}
.fxbtn-save:hover{color:var(--gold2);filter:brightness(1.1)}

/* steaguri conturi×țări în meniul ☰ (deasupra Profit): cerculețe cu steagul țării —
   colorat = activ, gri (desaturat) = inactiv; click = activare/dezactivare.
   Două rânduri: FBE (contul principal) și FBS (metrixtrends). */
.mflags{display:flex;flex-direction:column;gap:7px;padding:9px 11px 11px;border-bottom:1px solid var(--line);margin-bottom:4px}
.mfrow{display:flex;align-items:center;gap:6px}
.mfl{font-family:'Archivo',sans-serif;font-size:10px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--mut);width:56px;flex:none}
.cchk{position:relative;display:inline-flex;cursor:pointer}
.cchk input{position:absolute;inset:0;opacity:0;cursor:pointer;margin:0;z-index:1}
.cchk span{display:block;min-width:36px;text-align:center;padding:5px 8px;border-radius:9px;border:1px solid var(--line2);font-family:'Archivo',sans-serif;font-size:11px;font-weight:600;letter-spacing:.06em;line-height:1;color:var(--mut);user-select:none;transition:background .15s,color .15s,border-color .15s}
.cchk input:checked + span{background:var(--gold);border-color:var(--gold);color:var(--bg)}
.cchk:hover span{border-color:var(--goldline);color:var(--ink2)}
@media(max-width:720px){.cbar{gap:4px}.cchk span{min-width:32px;padding:4px 6px;font-size:10.5px}}
/* buton "V" -> ghid & versiuni (in stanga cifrei comenzilor) */
.vbtn{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;flex:none;font-family:'Fraunces',serif;font-weight:600;font-size:16px;line-height:1;color:var(--gold2);background:var(--goldsoft);border:1px solid var(--goldline);border-radius:8px;cursor:pointer;text-decoration:none;transition:.15s}
.vbtn:hover{background:var(--gold);color:var(--bg);border-color:var(--gold)}

/* ===== stare Raspberry Pi (chenar jos) ===== */
.health{background:var(--shell);border:1px solid var(--line2);border-radius:16px;margin-top:14px;padding:14px 18px 16px;transition:background .25s,border-color .25s}
.health .hh{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;gap:10px}
.health .ht{display:flex;align-items:center;gap:8px;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--mut);font-weight:600}
.health .hsub{font-family:'Archivo',sans-serif;font-size:11px;color:var(--mut2);white-space:nowrap}
.hdot{width:8px;height:8px;border-radius:50%;background:var(--mut2);flex:none}
.hdot.ok{background:var(--green);animation:pulse 2.4s infinite}
.hdot.bad{background:var(--red)}
.hgrid{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:11px;overflow:hidden}
.hc{background:var(--panel);padding:12px 14px;transition:background .25s}
.hc .hl{font-size:10.5px;color:var(--mut);margin-bottom:7px}
.hc .hv{font-family:'Archivo',sans-serif;font-weight:600;font-size:20px;color:var(--ink-strong);line-height:1;font-variant-numeric:tabular-nums}
.hc .hv.ok{color:var(--green)}
.hc .hv.warn{color:var(--orange)}
.hc .hv.bad{color:var(--red)}
.hc .hs{font-size:10.5px;color:var(--mut2);margin-top:5px;min-height:13px}
.hbar{height:5px;border-radius:4px;background:var(--track);margin-top:8px;overflow:hidden}
.hbar i{display:block;height:100%;border-radius:4px;background:var(--gold)}
.hbar i.ok{background:var(--green)}
.hbar i.warn{background:var(--orange)}
.hbar i.bad{background:var(--red)}
.hempty{padding:18px;text-align:center;color:var(--mut);font-size:12px;grid-column:1/-1}
@media(max-width:760px){.hgrid{grid-template-columns:repeat(2,1fr)}}
.foot-note{font-size:10.5px;color:var(--mut2);padding:0 20px 16px;line-height:1.5;background:var(--inset)}

/* date-range popover (sub butonul Perioadă) */
.rangepop{position:absolute;top:calc(100% + 10px);right:0;z-index:40;background:var(--panel);border:1px solid var(--line2);border-radius:12px;padding:14px;box-shadow:0 14px 34px rgba(0,0,0,.45);display:flex;flex-direction:column;gap:11px;min-width:262px;max-width:calc(100vw - 32px)}
.rangepop[hidden]{display:none}
.rangepop::before{content:"";position:absolute;top:-6px;right:44px;width:11px;height:11px;background:var(--panel);border-left:1px solid var(--line2);border-top:1px solid var(--line2);transform:rotate(45deg)}
.rp-row{display:flex;gap:10px}
.rp-row label{display:flex;flex-direction:column;gap:5px;font-size:10px;text-transform:uppercase;letter-spacing:.05em;color:var(--mut);flex:1}
.rangepop input[type=date]{font-family:'Archivo',sans-serif;font-size:12px;background:var(--inset);border:1px solid var(--line2);border-radius:8px;padding:7px 6px;text-align:center;color:var(--ink-strong);color-scheme:dark;width:100%}
body.light .rangepop input[type=date]{color-scheme:light}
.rangepop input[type=date]:focus{outline:none;border-color:var(--gold)}
.rp-apply{font-family:inherit;font-size:12.5px;background:var(--goldsoft);border:1px solid var(--goldline);color:var(--gold2);border-radius:9px;padding:9px 12px;cursor:pointer;transition:.15s}
.rp-apply:hover{background:var(--gold);color:var(--bg);border-color:var(--gold)}
@media(max-width:720px){
  .rangepop{right:0;left:auto;min-width:0;width:288px;max-width:calc(100vw - 24px);padding:12px}
  .rp-row{gap:12px}
  .rangepop input[type=date]{font-size:11px;padding:6px 4px;min-width:0}
  .rp-row label{font-size:9px}
}

@media(max-width:980px){.kpis{grid-template-columns:repeat(3,1fr)}.body{grid-template-columns:minmax(0,1fr)}.prodrow{grid-template-columns:repeat(4,1fr)}.g2{max-width:320px}}
@media(max-width:560px){.kpis{grid-template-columns:repeat(2,1fr)}}

/* ===== topbar responsive (mobil) ===== */
@media(max-width:720px){
  .wrap{padding:16px 12px 48px}
  .top{flex-wrap:nowrap;gap:10px;padding:14px 14px}
  .brand{flex-wrap:wrap;gap:6px 6px;flex:1 1 auto;min-width:0}
  .brand .pill{font-size:10.5px;padding:4px 9px;white-space:nowrap}
  .controls{width:100%;gap:8px}
  .seg{flex:1 1 auto;width:100%;overflow-x:auto}
  .seg button{flex:1 1 auto;min-width:max-content;padding:9px 8px;font-size:11.5px;text-align:center;white-space:nowrap}
  .iconbtn{flex:none}
  .pagehdr{flex-wrap:wrap;gap:8px;padding:16px 14px 12px}
  .top--min{flex-wrap:nowrap;align-items:center}
  .top--min .brand{flex:1 1 auto;width:auto}
  .top--min .controls{width:auto;flex:none}
}
@media(max-width:380px){
  .top{padding:12px 12px}
  .seg button{padding:9px 6px;font-size:11px}
}

/* ===== multi-product cell (quantities) ===== */
.pcell{display:flex;align-items:center;justify-content:center;gap:7px;flex-wrap:nowrap}
/* antetul coloanei Produse centrat, la fel ca imaginile de sub el */
.ordtbl:not(.ret) thead th:nth-child(4){text-align:center}
.pi{position:relative;display:inline-flex}
.pi img{width:46px;height:46px;object-fit:contain;background:var(--prodbg);border-radius:3.5px;padding:1.5px;display:block}
.pi .qty{position:absolute;right:-5px;bottom:-5px;font-family:'Archivo',sans-serif;font-size:9px;font-weight:600;color:var(--ink-strong);background:var(--panel);border:1px solid var(--line2);border-radius:6px;padding:0 4px;line-height:14px}
.pi.solo .qty{display:none}
.imgph{width:34px;height:34px;border-radius:7px;background:var(--inset);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--mut2);font-size:14px}
.pt .imgph{width:60px;height:60px;border-radius:9px;font-size:22px}

/* status pill states */
.dot.off{background:var(--mut2);animation:none}
.pill.off{color:var(--mut);background:var(--inset);border-color:var(--line2)}
.banner{margin:0;padding:11px 18px;font-size:12.5px;background:var(--goldsoft);border-bottom:1px solid var(--goldline);color:var(--gold2)}
.spin{animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}


/* ===== pages: costuri + profit ===== */
.pagehdr{padding:20px 22px 12px;display:flex;align-items:center;justify-content:space-between;gap:14px;border-bottom:1px solid var(--line)}
.pagehdr h1{font-family:'Fraunces',serif;font-weight:500;font-size:22px;margin:0;color:var(--ink-strong)}
.pagehdr .desc{font-size:12.5px;color:var(--mut);margin-top:4px;max-width:640px;line-height:1.55}

.summary{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--line);border-bottom:1px solid var(--line)}
.sm{background:var(--panel);padding:13px 15px}
.sm .lab{font-size:11px;color:var(--mut);margin-bottom:6px}
.sm .vv{font-family:'Archivo';font-weight:600;font-size:20px;color:var(--ink-strong);font-variant-numeric:tabular-nums;line-height:1}
.sm .vv small{font-size:12px;color:var(--mut);font-weight:400}
.sm.gold{box-shadow:inset 3px 0 0 var(--gold)}
.sm.green .vv{color:var(--green)} .sm.green{box-shadow:inset 3px 0 0 var(--green)}
.sm.red .vv{color:var(--red)}

.tblwrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
table.full{width:100%;border-collapse:collapse;font-size:12.5px;min-width:920px}
table.full thead th{position:sticky;top:0;background:var(--shell);text-align:left;font-size:10px;text-transform:uppercase;letter-spacing:.04em;color:var(--mut2);font-weight:500;padding:11px 12px;border-bottom:1px solid var(--line)}
table.full th.r,table.full td.r{text-align:right;font-family:'Archivo';font-variant-numeric:tabular-nums}
table.full tbody td{padding:9px 12px;border-bottom:1px solid var(--rowline);color:var(--ink2);vertical-align:middle}
table.full tbody tr:last-child td{border-bottom:0}
table.full tbody tr:hover{background:var(--inset)}
table.full .nm{display:flex;align-items:center;gap:10px;min-width:200px}
table.full .nm img,table.full .nm .imgph{width:38px;height:38px;border-radius:7px;flex:none}
table.full .nm img{object-fit:contain;background:var(--prodbg);padding:3px}
table.full .nm .ti{display:flex;flex-direction:column;gap:2px;min-width:0}
table.full .nm .ti b{font-weight:500;color:var(--ink);font-size:12.5px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;max-width:280px}
table.full .nm .ti .pnk{font-family:'Archivo';font-size:10px;color:var(--mut2);letter-spacing:.04em}
/* profit/costuri compact (mobil): doar thumbnail, fără titlu/PNK */
table.full .pthumb{display:inline-flex;align-items:center;gap:6px}
table.full .pthumb img,table.full .pthumb .imgph{width:64px;height:64px;border-radius:0;flex:none;object-fit:contain}
table.full.compact{min-width:0;width:100%;font-size:12px}
table.full.compact thead th{padding:7px 4px;vertical-align:bottom}
table.full.compact tbody td{padding:6px 4px}
/* antet pe 2 rânduri: eticheta + unitatea dedesubt */
table.full.compact thead th.r .unit{display:block;margin:1px 0 0;font-size:9px;letter-spacing:.04em}
table.full.compact thead th.r{text-align:center}
table.full.compact tbody td.r{text-align:center}
table.full.compact .cinp{width:100%;min-width:0;max-width:62px;padding:6px 5px;font-size:12px}
table.full.compact .pthumb img,table.full.compact .pthumb .imgph{width:58px;height:58px}

.cinp{font-family:'Archivo';font-size:12.5px;font-variant-numeric:tabular-nums;width:78px;padding:6px 8px;background:var(--inset);border:1px solid var(--line);border-radius:7px;color:var(--ink-strong);text-align:center;transition:.12s}
.cinp:focus{outline:none;border-color:var(--gold);background:var(--panel)}
.cinp.saved{border-color:var(--green);box-shadow:0 0 0 2px rgba(127,217,173,.15)}
.cinp.err{border-color:var(--red);box-shadow:0 0 0 2px rgba(221,154,142,.15)}
.cinp.dirty{border-color:var(--gold)}
.unit{font-size:10px;color:var(--mut2);margin-left:4px}
.genius-eff{display:block;margin-top:2px;font-size:11px;font-weight:600;color:var(--green);font-variant-numeric:tabular-nums}
.soldsel{display:inline-block;margin-left:6px;font-family:'Hanken Grotesk',sans-serif;font-size:10.5px;color:var(--gold2);background:var(--goldsoft);border:1px solid var(--goldline);border-radius:7px;padding:3px 6px;cursor:pointer;text-transform:none;letter-spacing:0;vertical-align:middle}
.soldsel:focus{outline:none;border-color:var(--gold)}
.soldsel option{background:var(--panel);color:var(--ink)}

.notcfg{color:var(--mut2);font-size:10.5px;font-family:'Archivo';letter-spacing:.04em;text-transform:uppercase}
.profit-pos{color:var(--green)}
.profit-neg{color:var(--red)}
.barpct{display:inline-block;height:5px;width:80px;background:var(--track);border-radius:3px;overflow:hidden;vertical-align:middle;margin-left:6px}
.barpct i{display:block;height:100%}

.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:var(--panel);color:var(--ink-strong);border:1px solid var(--line2);border-radius:9px;padding:10px 16px;font-size:13px;box-shadow:0 8px 24px rgba(0,0,0,.4);opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;z-index:50}
.toast.ok{border-color:var(--greenline);color:var(--green)}
.toast.err{border-color:var(--redline);color:var(--red)}
.toast.show{opacity:1;transform:translateX(-50%) translateY(-4px)}

@media(max-width:880px){
  .summary{grid-template-columns:repeat(2,1fr)}
  .summary .sm.wide{grid-column:1 / -1}
  .summary .sm.wide .lab:last-child{font-size:12.5px;color:var(--ink);letter-spacing:.01em;margin-top:7px;line-height:1.5}
}


/* ---- bara de perioade: rand propriu sub logo, intinsa pe toata latimea ---- */
.pbar-row{position:relative;padding:10px 12px;border-bottom:1px solid var(--line)}
.pbar{display:flex;align-items:stretch;gap:7px;width:100%;flex-wrap:nowrap}
.pbar > .seg{flex:2 1 0;width:auto;overflow:visible}
.pbar .seg button{flex:1 1 0;min-width:0;justify-content:center;display:flex;align-items:center;white-space:nowrap}
.pbar > .pdrop{flex:1 1 0;display:flex}
.pbar .pdrop > .pbtn{width:100%;justify-content:center}
.pbar > .rangepop{flex:0 0 auto}
@media(max-width:720px){
  .pbar-row{padding:9px 8px}
  .pbar{gap:5px}
  .pbar .seg button{padding:8px 4px;font-size:11.5px}
  .pbar .pbtn{padding:8px 5px;font-size:11.5px}
}

/* coloana # + data/ora pe doua randuri */
.ordtbl .numcol{width:1%;white-space:nowrap;text-align:center;color:var(--mut2);font-size:11px;font-variant-numeric:tabular-nums}
.ordtbl .odate{font-weight:500}
.ordtbl .otime{font-size:11px;color:var(--mut);margin-top:1px}

.iconbtn.active{background:var(--goldsoft);border-color:var(--goldline);color:var(--gold2)}

.pill.round{width:27px;height:27px;min-width:27px;padding:0;gap:0;border-radius:50%;justify-content:center}
/* status sync: cercul rămâne mereu cerc, eticheta stă AFARĂ lângă el.
   Pulsează: Live=verde (valuri verzi), Syncing=galben. Stale (>3min)=galben solid. */
.statuswrap{display:inline-flex;align-items:center;gap:3px;cursor:pointer}
.statuswrap .synclabel{cursor:pointer;user-select:none}
.synccirc{background:none;border:none;margin:0;padding:4px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;line-height:0}
.synccirc:hover .dot{filter:brightness(1.18)}
.synccirc .dot{width:8px;height:8px;border-radius:50%;position:relative}
.synccirc .dot::before,.synccirc .dot::after{display:none}
.synccirc .dot.live{background:var(--green);animation:pulseG 1.9s ease-out infinite}
.synccirc .dot.syncing{background:#e8c14a;animation:pulseY 1.05s ease-out infinite}
.synccirc .dot.stale{background:#e8c14a;animation:none;box-shadow:none}
.synccirc .dot.off{background:var(--mut2);animation:none;box-shadow:none}
@keyframes pulseG{0%{box-shadow:0 0 0 0 rgba(60,180,110,.5)}70%{box-shadow:0 0 0 8px rgba(60,180,110,0)}100%{box-shadow:0 0 0 0 rgba(60,180,110,0)}}
.synclabel{font-size:11.5px;color:var(--mut);white-space:nowrap;transition:opacity .25s;font-variant-numeric:tabular-nums}
.synclabel.live{color:var(--green)}
.synclabel.syncing{color:#e8c14a}
.synclabel.stale{color:var(--mut)}
.synclabel.cooling{color:var(--mut)}
.synclabel.fading{opacity:0;transition:opacity 1s linear}

.top > .brand{margin-right:auto}

.cinp::-webkit-outer-spin-button,.cinp::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.cinp{-moz-appearance:textfield;appearance:textfield}

.footnav{justify-content:flex-start}

/* meniu hamburger (adună butoanele din antet) */
.hmenu{position:relative;display:inline-flex}
.hmenu-panel{position:absolute;top:calc(100% + 8px);right:0;min-width:224px;background:var(--shell);border:1px solid var(--line2);border-radius:12px;padding:6px;box-shadow:0 16px 42px rgba(0,0,0,.5);z-index:300;display:flex;flex-direction:column;gap:2px}
.hmenu-panel[hidden]{display:none}
.hmenu-panel .iconbtn{width:100%;height:auto;justify-content:flex-start;gap:11px;padding:9px 11px;border-radius:9px;background:none;border:0;color:var(--ink2);text-decoration:none}
.hmenu-panel .iconbtn:hover{background:var(--panel);color:var(--ink-strong)}
.hmenu-panel .iconbtn.active,.hmenu-panel a.active{background:var(--goldsoft);color:var(--gold2);font-weight:600}
.hmenu-panel .iconbtn.active svg{color:var(--gold2)}
.hmenu-panel .iconbtn svg,.hmenu-panel .ticon svg{width:19px;height:19px;flex:none}
.hmenu-panel .ticon{display:inline-flex;align-items:center;line-height:0}
.hmenu-panel .mlabel{font-size:13px;font-weight:500;white-space:nowrap;font-family:inherit}

/* wordmark METRIX (gradient rosu->roz->mov->albastru) */
.logoword{font-family:'Montserrat',system-ui,sans-serif;font-weight:800;font-size:24px;line-height:1;letter-spacing:.012em;text-transform:uppercase;white-space:nowrap;display:inline-block;text-decoration:none;background:linear-gradient(90deg,#ff4d4d 0%,#ff2d8e 36%,#9b5cff 62%,#3b86ff 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.logolink:hover .logoword{opacity:.75}
@media(max-width:720px){.logoword{font-size:21px}}

.logout-row{color:var(--red)}
.logout-row svg{stroke:var(--red)}

.synccount .scount-lbl{color:var(--mut);font-weight:500;margin-right:5px}

.plegpct{color:var(--mut2);font-weight:600}

html.mx-app .wrap{padding-left:3px;padding-right:3px}

html.mx-app-ios .wrap{padding-top:env(safe-area-inset-top)}