/* ================= Aspectul „Studio” (stil Apple, macOS / iPadOS) =================
   Strat separat peste glass.css: se aplică doar când <html> are clasa „look-studio”.
   Nu schimbă nimic din funcții; aspectul clasic revine din meniul contului („Aspect: Clasic”).
   Reguli: sticla doar pe meniul lateral și pe ferestre; listele, tabelele și cardurile pe fundal solid, ca să se citească repede.
   Toate culorile sunt aici sus, ca tokeni. */
html.look-studio{
  --st-bg:#f5f7f6; --st-surface:#fff; --st-surface2:#f2f2f7; --st-fill:rgba(118,118,128,.12); --st-fill2:rgba(118,118,128,.2);
  --st-sep:rgba(60,60,67,.10); --st-border:rgba(60,60,67,.14); --st-text:#1d1d1f; --st-muted:#6e6e73;
  --st-acc:#4be39c; --st-acc-ink:#04281c; --st-acc-text:#0a8f65; --st-sel:rgba(75,227,156,.16); --st-ring:rgba(75,227,156,.45);
  --st-red:#d70015; --st-orange:#b25000; --st-blue:#0071e3; --st-purple:#8944ab; --st-green:#248a3d;
  --st-glass:rgba(255,255,255,.62); --st-glass-edge:rgba(255,255,255,.75); --st-blur:blur(28px) saturate(1.8);
  --st-glass-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 0 0 1px rgba(255,255,255,.35) inset,0 24px 60px -34px rgba(0,0,0,.35);
  --st-shadow:0 1px 2px rgba(0,0,0,.04),0 8px 24px -18px rgba(0,0,0,.2);
  --st-num:ui-rounded,"SF Pro Rounded",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --st-ease:cubic-bezier(.22,.8,.22,1);
  --st-spring:linear(0,.009,.035 2.1%,.141 4.4%,.723 12.9%,.938 16.7%,1.017 19.8%,1.061 22.7%,1.072 25.9%,1.056 30.4%,1.012 39.5%,.994 46.3%,1.001 66.7%,1);
  /* tokenii vechi, ca restul paginii să urmeze aceeași paletă */
  --text:var(--st-text); --muted:var(--st-muted); --line:var(--st-sep); --card:var(--st-surface); --soft:var(--st-fill); --soft2:var(--st-fill2);
  --accent:var(--st-acc); --accent-ink:var(--st-acc-ink); --accent-t:var(--st-acc-text); --num:var(--st-num);
  --red:var(--st-red); --green:var(--st-green); --blue:var(--st-blue);
  --bg-grad:radial-gradient(45% 40% at 0% 0%,rgba(75,227,156,.20),transparent 70%),radial-gradient(40% 40% at 100% 100%,rgba(0,113,227,.10),transparent 70%),var(--st-bg);
}
html.look-studio[data-theme=dark]{
  --st-bg:#000; --st-surface:#1c1c1e; --st-surface2:#2c2c2e; --st-fill:rgba(118,118,128,.24); --st-fill2:rgba(118,118,128,.36);
  --st-sep:rgba(84,84,88,.42); --st-border:rgba(84,84,88,.6); --st-text:#f5f5f7; --st-muted:#98989d;
  --st-acc-text:#4be39c; --st-sel:rgba(75,227,156,.15);
  --st-red:#ff453a; --st-orange:#ff9f0a; --st-blue:#0a84ff; --st-purple:#bf5af2; --st-green:#30d158;
  --st-glass:rgba(30,32,31,.62); --st-glass-edge:rgba(255,255,255,.10);
  --st-glass-shadow:0 1px 0 rgba(255,255,255,.12) inset,0 0 0 1px rgba(255,255,255,.04) inset,0 24px 60px -30px rgba(0,0,0,.8); --st-shadow:none;
  --bg-grad:radial-gradient(45% 40% at 0% 0%,rgba(75,227,156,.10),transparent 70%),#000;
}
@media (prefers-color-scheme:dark){
  html.look-studio:not([data-theme=light]){
    --st-bg:#000; --st-surface:#1c1c1e; --st-surface2:#2c2c2e; --st-fill:rgba(118,118,128,.24); --st-fill2:rgba(118,118,128,.36);
    --st-sep:rgba(84,84,88,.42); --st-border:rgba(84,84,88,.6); --st-text:#f5f5f7; --st-muted:#98989d;
    --st-acc-text:#4be39c; --st-sel:rgba(75,227,156,.15);
    --st-red:#ff453a; --st-orange:#ff9f0a; --st-blue:#0a84ff; --st-purple:#bf5af2; --st-green:#30d158;
    --st-glass:rgba(30,32,31,.62); --st-glass-edge:rgba(255,255,255,.10);
    --st-glass-shadow:0 1px 0 rgba(255,255,255,.12) inset,0 0 0 1px rgba(255,255,255,.04) inset,0 24px 60px -30px rgba(0,0,0,.8); --st-shadow:none;
    --bg-grad:radial-gradient(45% 40% at 0% 0%,rgba(75,227,156,.10),transparent 70%),#000;
  }
}

/* ---------- pagina și textul ---------- */
html.look-studio body{background:var(--bg-grad)!important;background-attachment:fixed!important;color:var(--st-text);font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}
html.look-studio .head{margin-bottom:14px}
html.look-studio .head h1{font-size:26px;font-weight:700;letter-spacing:-.022em;color:var(--st-text)}
html.look-studio .muted{color:var(--st-muted)}
html.look-studio .n,html.look-studio .kpi b{font-family:var(--st-num);font-variant-numeric:tabular-nums}
html.look-studio h2{letter-spacing:-.01em}

/* ---------- suprafețe: carduri și cifre (solide, fără sticlă) ---------- */
html.look-studio .card,html.look-studio .glass-card{background:var(--st-surface)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;
  border:0!important;border-radius:18px!important;box-shadow:var(--st-shadow),0 0 0 .5px var(--st-sep)!important;padding:18px}
html.look-studio .card h2{font-size:12px;font-weight:600;color:var(--st-muted);text-transform:uppercase;letter-spacing:.04em}
html.look-studio .kpi{background:var(--st-surface)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;border:0!important;border-radius:16px!important;
  box-shadow:var(--st-shadow),0 0 0 .5px var(--st-sep)!important;padding:14px 16px!important;transition:transform .18s var(--st-ease),box-shadow .18s}
html.look-studio .kpi small{color:var(--st-muted);font-weight:500}
html.look-studio .kpi b{font-size:22px;font-weight:700;letter-spacing:-.02em;color:var(--st-text)}
html.look-studio .kpi.drillable:hover,html.look-studio button.kpi:hover{transform:translateY(-2px);box-shadow:0 1px 2px rgba(0,0,0,.04),0 14px 30px -18px rgba(0,0,0,.28),0 0 0 .5px var(--st-sep)!important}

/* ---------- butoane ---------- */
html.look-studio .btn{background:var(--st-fill)!important;color:var(--st-text);box-shadow:none!important;border-radius:10px!important;font-weight:600;
  transition:transform .12s var(--st-ease),background .15s,filter .15s}
html.look-studio .btn:hover{background:var(--st-fill2)!important}
html.look-studio .btn:active{transform:scale(.97)}
html.look-studio .btn.pri,html.look-studio .go{background:var(--st-acc)!important;color:var(--st-acc-ink)!important}
html.look-studio .btn.pri:hover,html.look-studio .go:hover{filter:brightness(.96)}
html.look-studio .btn.green{background:var(--st-green)!important;color:#fff!important}
html.look-studio .btn.red{color:var(--st-red)!important}
html.look-studio .btn:focus-visible,html.look-studio .go:focus-visible{outline:none;box-shadow:0 0 0 3px var(--st-ring)!important}

/* ---------- câmpuri ---------- */
html.look-studio input:not([type=checkbox]):not([type=radio]):not([type=range]),html.look-studio select,html.look-studio textarea{
  background-color:var(--st-fill);border:0;border-radius:10px;color:var(--st-text);box-shadow:none;transition:box-shadow .15s}
html.look-studio input:focus,html.look-studio select:focus,html.look-studio textarea:focus{outline:none;box-shadow:0 0 0 3px var(--st-ring)}
html.look-studio .f{color:var(--st-muted);font-weight:600}
/* căutările: un singur câmp gri cu lupa înăuntru (fără fundal dublu) */
html.look-studio :is(.srch,.tfq,.search,.stq,.vsearch){background:var(--st-fill)!important;box-shadow:none!important;border:0!important;border-radius:10px!important}
html.look-studio :is(.srch,.tfq,.search,.stq,.vsearch):focus-within{box-shadow:0 0 0 3px var(--st-ring)!important}
html.look-studio :is(.srch,.tfq,.search,.stq,.vsearch) input{background:transparent!important;box-shadow:none!important}

/* ---------- filtre (chips) ca butoanele segmentate Apple ---------- */
html.look-studio .chips{display:flex;width:max-content;max-width:100%;gap:2px;padding:2px;margin:8px 0 12px;background:var(--st-fill);border-radius:10px;overflow-x:auto}
html.look-studio .chips button{background:none!important;box-shadow:none!important;border-radius:8px;padding:6px 14px;font-size:13px;font-weight:500;color:var(--st-text);transition:background .25s var(--st-spring)}
html.look-studio .chips button:hover{background:rgba(255,255,255,.5)!important}
html.look-studio .chips button.on{background:var(--st-surface)!important;color:var(--st-text)!important;font-weight:600;box-shadow:0 1px 3px rgba(0,0,0,.12),0 0 0 .5px rgba(0,0,0,.04)!important}
html.look-studio .chips button.on small{color:var(--st-muted)}
html.look-studio[data-theme=dark] .chips button.on{background:#636366!important}
@media (prefers-color-scheme:dark){html.look-studio:not([data-theme=light]) .chips button.on{background:#636366!important}}

/* ---------- etichete de stare ---------- */
html.look-studio .tag{border-radius:999px;font-weight:600;font-size:11.5px;padding:3px 9px}
html.look-studio .t-green{background:color-mix(in srgb,var(--st-green) 13%,transparent);color:var(--st-green)}
html.look-studio .t-red{background:color-mix(in srgb,var(--st-red) 12%,transparent);color:var(--st-red)}
html.look-studio .t-blue{background:color-mix(in srgb,var(--st-blue) 12%,transparent);color:var(--st-blue)}
html.look-studio .t-orange{background:color-mix(in srgb,var(--st-orange) 13%,transparent);color:var(--st-orange)}
html.look-studio .t-purple{background:color-mix(in srgb,var(--st-purple) 13%,transparent);color:var(--st-purple)}
html.look-studio .t-gray{background:var(--st-fill);color:var(--st-muted)}

/* ---------- tabele: dense, cap lipit sus, rând ales cu mentă ---------- */
html.look-studio table.t{border-collapse:separate;border-spacing:0;font-size:13.5px;font-variant-numeric:tabular-nums}
html.look-studio table.t th{font-size:11.5px;font-weight:600;color:var(--st-muted);text-transform:none;letter-spacing:0;padding:8px 12px;border-bottom:1px solid var(--st-sep);background:transparent}
html.look-studio table.t td{padding:9px 12px;border-bottom:1px solid var(--st-sep)}
html.look-studio table.t tbody tr{transition:background .12s}
html.look-studio table.t tbody tr:hover td{background:var(--st-fill)}
html.look-studio table.t tr.click:active td{background:var(--st-sel)}

/* ---------- ferestre ---------- */
html.look-studio .ov{background:rgba(0,0,0,.30)!important;-webkit-backdrop-filter:blur(14px) saturate(1.4)!important;backdrop-filter:blur(14px) saturate(1.4)!important}
html.look-studio .sheet{background:var(--st-surface)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;border:0!important;border-radius:24px!important;
  box-shadow:0 30px 80px -30px rgba(0,0,0,.45),0 0 0 .5px var(--st-sep)!important;animation:stPop .38s var(--st-spring)}
@keyframes stPop{from{opacity:0;transform:translateY(10px) scale(.97)}}
html.look-studio .urow{background:var(--st-fill)!important;border-radius:12px}
html.look-studio .toast{border-radius:14px}

/* ---------- coșul de vânzare: panou solid ---------- */
html.look-studio .vcart{background:var(--st-surface)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;border:0!important;box-shadow:var(--st-shadow),0 0 0 .5px var(--st-sep)!important;border-radius:22px!important}

/* ---------- iconițe Phosphor (MIT) + mișcările Iconimate (MIT), traduse în CSS ---------- */
html.look-studio svg.ph{fill:currentColor!important;stroke:none!important;overflow:visible}
html.look-studio svg.ph .phs{fill:none;stroke:currentColor;stroke-width:16;stroke-linecap:round;stroke-linejoin:round}
html.look-studio svg.ph g,html.look-studio svg.ph path{transform-box:view-box}
html.look-studio .pa-shell{transform-origin:128px 24px}
html.look-studio .pa-hunt{transform-origin:123.5px 123.5px}
html.look-studio .pa-hl{transform-origin:64px 120px}html.look-studio .pa-hc{transform-origin:128px 184px}html.look-studio .pa-hr{transform-origin:192px 120px}
html.look-studio :is(button,a,.si,.dsb,label,.kpi):hover > svg.pha .pa-shell{animation:phBell .85s ease-in-out}
html.look-studio :is(button,a,.si,.dsb,label,.kpi):hover > svg.pha .pa-clap{animation:phClap .85s ease-in-out}
html.look-studio :is(button,a,.si,.dsb,label,.kpi):hover > svg.pha .pa-hunt,html.look-studio label:focus-within > svg.pha .pa-hunt{animation:phHunt .9s ease-in-out}
html.look-studio :is(button,a,.si,.dsb,label,.kpi):hover > svg.pha .pa-r1{animation:phRow1 .78s ease-in-out}
html.look-studio :is(button,a,.si,.dsb,label,.kpi):hover > svg.pha .pa-r3{animation:phRow3 .78s ease-in-out}
html.look-studio :is(button,a,.si,.dsb,label,.kpi):hover > svg.pha .pa-hl{animation:phTiltS .9s ease-in-out}
html.look-studio :is(button,a,.si,.dsb,label,.kpi):hover > svg.pha .pa-hc{animation:phTiltC .9s ease-in-out .07s}
html.look-studio :is(button,a,.si,.dsb,label,.kpi):hover > svg.pha .pa-hr{animation:phTiltS .9s ease-in-out .14s}
@keyframes phBell{0%{transform:rotate(0)}20%{transform:rotate(-11deg)}44%{transform:rotate(12deg)}64%{transform:rotate(-9.5deg)}80%{transform:rotate(7.4deg)}92%{transform:rotate(-2.5deg)}100%{transform:rotate(0)}}
@keyframes phClap{0%{transform:translateX(0)}24%{transform:translateX(-16px)}48%{transform:translateX(16px)}68%{transform:translateX(-13px)}84%{transform:translateX(9px)}94%{transform:translateX(-3.5px)}100%{transform:translateX(0)}}
@keyframes phHunt{0%{transform:translate(0,0) rotate(0)}12.5%{transform:translate(6.71px,-5.4px) rotate(4.69deg)}25%{transform:translate(6.98px,-13.34px) rotate(6.96deg)}37.5%{transform:translate(.5px,-19.12px) rotate(4.93deg)}50%{transform:translate(-8.93px,-19.34px) rotate(-.21deg)}62.5%{transform:translate(-15.78px,-13.89px) rotate(-5.45deg)}75%{transform:translate(-16.05px,-5.94px) rotate(-7.72deg)}87.5%{transform:translate(-9.57px,-.17px) rotate(-5.69deg)}100%{transform:translate(0,0) rotate(0)}}
@keyframes phRow1{0%{transform:translateY(0)}34%,48%{transform:translateY(64px)}62%{transform:translateY(-5px)}100%{transform:translateY(0)}}
@keyframes phRow3{0%{transform:translateY(0)}34%,48%{transform:translateY(-64px)}62%{transform:translateY(5px)}100%{transform:translateY(0)}}
@keyframes phTiltS{0%{transform:rotate(0)}18%,32%{transform:rotate(17deg)}58%,70%{transform:rotate(-17deg)}100%{transform:rotate(0)}}
@keyframes phTiltC{0%{transform:rotate(0)}18%,32%{transform:rotate(14deg)}58%,70%{transform:rotate(-14deg)}100%{transform:rotate(0)}}
/* restul iconițelor: o mică săritură cu arc */
html.look-studio .i{transition:transform .45s var(--st-spring)}
html.look-studio :is(.si,.dsb,.btn):hover > .i:not(.pha){transform:scale(1.12) rotate(-6deg)}
html.look-studio .si:active .i,html.look-studio .dsb:active .i{transform:scale(.86)}

/* =====================================================================
   Calculator (≥1100px): meniul în stânga, ca bara laterală din Mac.
   Sus în bară: logo + unelte; apoi departamentele; apoi secțiunile departamentului.
   ===================================================================== */
@media (min-width:1100px){
  html.look-studio .shell{display:grid!important;grid-template-columns:244px minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);column-gap:12px;row-gap:0!important;
    padding:12px!important;height:100vh;height:100dvh}
  /* bara laterală = .top (sus) + .snav (jos), lipite într-un singur panou de sticlă */
  html.look-studio .top,html.look-studio .snav{background:var(--st-glass)!important;-webkit-backdrop-filter:var(--st-blur)!important;backdrop-filter:var(--st-blur)!important;
    border:1px solid var(--st-glass-edge)!important;box-shadow:var(--st-glass-shadow)!important}
  html.look-studio .top,html.look-studio .snav{position:relative!important;inset:auto!important;transform:none!important;width:auto!important;max-width:none!important;margin:0!important}
  html.look-studio .top{grid-column:1;grid-row:1;display:flex!important;flex-wrap:wrap;align-items:center;gap:10px!important;
    min-height:0!important;padding:16px 12px 10px!important;border-radius:22px 22px 0 0!important;border-bottom:0!important;z-index:40!important}
  html.look-studio .snav{grid-column:1;grid-row:2;display:flex!important;flex-direction:column;align-items:stretch;justify-content:flex-start!important;gap:1px!important;overflow-x:hidden!important;overflow-y:auto!important;
    padding:10px 10px 14px!important;border-radius:0 0 22px 22px!important;border-top:0!important;z-index:30!important}
  html.look-studio #main{grid-column:2;grid-row:1/3;position:relative!important;inset:auto!important;overflow:auto;padding:22px 26px 40px!important;scroll-padding-top:12px!important;
    border-radius:22px!important;max-width:none!important}
  html.look-studio .tl{flex:1;display:flex;align-items:center}
  html.look-studio .top .tlogo{height:22px!important;margin:0 0 0 6px!important}
  html.look-studio .tr{flex:1 1 100%;order:2;display:flex;flex-wrap:wrap;align-items:center;gap:2px;min-width:0}
  html.look-studio .tr .dayp{order:9;flex:1 1 100%;margin-top:4px;padding:8px 10px;border-radius:12px;background:var(--st-fill)}
  html.look-studio .tr .me{margin-left:auto}
  html.look-studio .tr .mename{display:none}
  html.look-studio .themebtn,html.look-studio .bell{width:32px;height:32px;border-radius:9px}
  html.look-studio .themebtn:hover,html.look-studio .bell:hover{background:var(--st-fill)}
  /* departamentele: listă verticală */
  html.look-studio .dsw{order:5;flex-basis:100%;display:flex!important;flex-direction:column;gap:1px!important;padding:8px 0 0!important;margin:4px 0 0!important;background:none!important;box-shadow:none!important;border-top:1px solid var(--st-sep);border-radius:0!important}
  html.look-studio .dsw::before{content:"DEPARTAMENTE";font-size:10.5px;font-weight:600;letter-spacing:.06em;color:var(--st-muted);padding:4px 10px 4px}
  html.look-studio #dind,html.look-studio #sind{display:none!important}
  html.look-studio .dsb{width:100%;justify-content:flex-start!important;height:34px!important;padding:0 10px!important;gap:10px!important;border-radius:9px!important;font-size:13.5px!important;font-weight:500!important;color:var(--st-text)!important}
  html.look-studio .dsb span{display:inline!important}
  html.look-studio .dsb .i{width:18px!important;height:18px!important;color:var(--st-muted)}
  html.look-studio .dsb:hover{background:var(--st-fill)}
  html.look-studio .dsb.on{background:var(--st-fill2)!important;font-weight:600!important}
  html.look-studio .dsb.on .i{color:var(--st-acc-text)!important}
  /* secțiunile: rânduri cu iconiță la stânga, cea aleasă pe mentă */
  html.look-studio .si{flex-direction:row!important;justify-content:flex-start!important;min-width:0!important;width:100%;height:34px;gap:10px!important;padding:0 10px!important;
    border-radius:9px!important;font-size:13.5px!important;font-weight:500!important;color:var(--st-text)!important;text-align:left;animation:none!important}
  html.look-studio .si span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  html.look-studio .si .i{width:18px!important;height:18px!important;color:var(--st-muted)}
  html.look-studio .si:hover{background:var(--st-fill)!important}
  html.look-studio .si.on{background:var(--st-acc)!important;color:var(--st-acc-ink)!important;font-weight:600!important}
  html.look-studio .si.on .i{color:var(--st-acc-ink)!important}
  html.look-studio .snav.in .si{animation:stSi .4s var(--st-spring) both!important;animation-delay:calc(var(--i) * 18ms)!important}
  @keyframes stSi{from{opacity:0;transform:translateX(-6px)}}
  html.look-studio .bnav{display:none!important}
  /* meniul contului se deschide în dreapta barei laterale, nu tăiat de ea */
  html.look-studio #menu{position:fixed!important;left:264px!important;top:16px!important;right:auto!important;width:300px;z-index:200!important;
    background:var(--st-surface)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;border-radius:16px!important;box-shadow:0 20px 50px -20px rgba(0,0,0,.35),0 0 0 .5px var(--st-sep)!important}
  /* paginile care foloseau înălțimea barei de sus */
  html.look-studio .vit{height:calc(100dvh - 24px)!important}
  html.look-studio #main.flush{padding:0!important}
}

/* ---------- telefon și tabletă: păstrăm așezarea, schimbăm suprafețele ---------- */
@media (max-width:1099px){
  html.look-studio .top,html.look-studio .bnav,html.look-studio .snav{background:var(--st-glass)!important;border:1px solid var(--st-glass-edge)!important;box-shadow:var(--st-glass-shadow)!important}
  html.look-studio .bnav button.on{background:var(--st-acc)!important;color:var(--st-acc-ink)!important;box-shadow:none!important}
  html.look-studio .bnav button.on .i{color:var(--st-acc-ink)!important}
  html.look-studio .si.on{color:var(--st-acc-text)!important}
}
@media (max-width:760px){
  html.look-studio .head h1{font-size:24px}
  html.look-studio .card{padding:14px;border-radius:16px!important}
  html.look-studio .sheet{border-radius:24px 24px 0 0!important}
}
@media (prefers-reduced-motion:reduce){html.look-studio *{animation:none!important;transition:none!important}}