/* =====================================================================
   eSI — kalkulátorok és öntesztek (felho-tco, leallas-koltseg, sla-error-budget,
   nis2-dora-gyorsteszt). A régi osztálynevek maradnak, mert a számoló szkriptek
   ezekre épülnek; a megjelenés az esi.css tokenjeiből jön.
   ===================================================================== */

/* ---------- elrendezés: bemenet és eredmény egymás mellett ---------- */
.calc{max-width:var(--measure-title)}
.tco-grid,.dt-grid,.nt-grid,.sl-wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--gap-items);align-items:start}
.nt-grid{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr)}
@media (min-width:901px){
  .tco-result,.dt-result,.nt-result{position:sticky;top:var(--pin-top)}
}
@media (max-width:900px){
  .tco-grid,.dt-grid,.nt-grid,.sl-wrap{grid-template-columns:minmax(0,1fr)}
}

/* ---------- kártyák ---------- */
.tco-form,.tco-result,.dt-form,.dt-result,.sl-card,.nt-result,.nt-q{background:var(--surface);border-radius:var(--r-card);padding:var(--sp-24) var(--sp-32)}
.tco-form h2,.tco-result h2,.dt-form h2,.dt-result h2,.sl-card h2,.nt-result h2{font-size:var(--fs-body);font-weight:600;line-height:var(--lh-text);margin-bottom:var(--sp-24)}
@media (max-width:767px){
  .tco-form,.tco-result,.dt-form,.dt-result,.sl-card,.nt-result,.nt-q{padding:var(--sp-24)}
}

/* ---------- mezők ---------- */
.tco-field,.dt-field,.sl-field{margin-bottom:var(--sp-24)}
.tco-field.mb-0,.dt-field.mb-0,.sl-field.mb-0,.mb-0{margin-bottom:0}
.tco-field > label,.dt-field > label,.sl-field > label{display:flex;justify-content:space-between;align-items:baseline;gap:var(--sp-12);font-weight:500;margin-bottom:var(--sp-12)}
.calc .val{font-family:var(--font-mono);font-weight:500;color:var(--accent-text);white-space:nowrap;font-variant-numeric:tabular-nums}
.tco-hint{margin-top:var(--sp-8);color:var(--ink-muted);font-size:var(--fs-eyebrow);line-height:var(--lh-text)}

/* csúszka: vászonszínű sín, tintaszínű fogantyú, 44 px-es érintési magasság */
.tco-range,.dt-range,.sl-range{-webkit-appearance:none;appearance:none;display:block;width:100%;height:44px;margin:0;background:transparent;cursor:pointer}
.tco-range::-webkit-slider-runnable-track,.dt-range::-webkit-slider-runnable-track,.sl-range::-webkit-slider-runnable-track{height:8px;border-radius:var(--r-pill);background:var(--canvas)}
.tco-range::-webkit-slider-thumb,.dt-range::-webkit-slider-thumb,.sl-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:24px;height:24px;margin-top:-8px;border:0;border-radius:var(--r-circle);background:var(--action)}
.tco-range::-moz-range-track,.dt-range::-moz-range-track,.sl-range::-moz-range-track{height:8px;border-radius:var(--r-pill);background:var(--canvas)}
.tco-range::-moz-range-thumb,.dt-range::-moz-range-thumb,.sl-range::-moz-range-thumb{width:24px;height:24px;border:0;border-radius:var(--r-circle);background:var(--action)}
.tco-range:focus,.dt-range:focus,.sl-range:focus{outline:none}
.tco-range:focus-visible,.dt-range:focus-visible,.sl-range:focus-visible{outline:var(--focus-w) solid var(--focus);outline-offset:var(--focus-offset);border-radius:var(--r-pill)}

/* szegmens- és válaszgombok: a kiválasztott tintaszínű, mint a gomb */
.tco-seg,.dt-seg,.sl-seg,.nt-opts{display:flex;flex-wrap:wrap;gap:var(--sp-8)}
.tco-seg button,.dt-seg button,.sl-seg button,.nt-opts button{flex:1 1 auto;min-height:44px;padding:var(--sp-8) var(--sp-16);border:0;border-radius:var(--r-pill);
  background:var(--canvas);color:var(--ink);font-size:var(--fs-eyebrow);font-weight:500;line-height:var(--lh-ui);cursor:pointer;
  transition:background-color var(--dur-fast) var(--ease-out),color var(--dur-fast) var(--ease-out)}
.tco-seg button:hover,.dt-seg button:hover,.sl-seg button:hover,.nt-opts button:hover{background:var(--surface-hover)}
.tco-seg button[aria-pressed="true"],.dt-seg button[aria-pressed="true"],.sl-seg button[aria-pressed="true"],.nt-opts button[aria-pressed="true"]{background:var(--action);color:var(--on-action)}
.tco-seg .sub{color:var(--ink-muted);font-weight:400}
.tco-seg button[aria-pressed="true"] .sub{color:inherit}

/* ---------- eredmény ---------- */
.tco-row{margin-bottom:var(--sp-24)}
.tco-bar-head{display:flex;justify-content:space-between;align-items:baseline;gap:var(--sp-12);margin-bottom:var(--sp-8)}
.tco-bar-head .nm{font-weight:500}
.tco-bar-head .nm small{display:block;font-size:var(--fs-eyebrow);font-weight:400;color:var(--ink-muted)}
.tco-bar-head .amt,.dt-line .v,.sl-cell .d{font-family:var(--font-mono);font-weight:500;white-space:nowrap;font-variant-numeric:tabular-nums}
.tco-bar,.nt-meter{height:12px;border-radius:var(--r-pill);background:var(--canvas);overflow:hidden}
.tco-bar i,.nt-meter i{display:block;height:100%;width:0;background:var(--ink-subtle);transition:width var(--dur-state) var(--ease-out)}
.tco-bar.onprem i{background:var(--green-500)}
.tco-bar.hybrid i{background:var(--gold-500)}
.tco-bar.cloud i{background:var(--blue-500)}
.tco-row.win .tco-bar-head .nm::after{content:"· legkedvezőbb";margin-left:var(--sp-8);font-family:var(--font-mono);font-size:var(--fs-chip);color:var(--accent-text)}
.tco-save{font-family:var(--font-mono);font-weight:500;color:var(--success)}

.dt-line{display:flex;justify-content:space-between;align-items:baseline;gap:var(--sp-16);padding:var(--sp-12) 0;border-top:var(--stroke) solid var(--canvas)}
.dt-line:first-of-type{border-top:0;padding-top:0}
.dt-line .k{color:var(--ink-muted)}
.dt-big,.sl-eb{margin-top:var(--sp-16);background:var(--canvas);border-radius:var(--r-well);padding:var(--sp-16) var(--sp-24)}
.dt-big .lbl,.sl-eb .lbl,.calc .lbl{display:block;font-size:var(--fs-label);font-weight:500;line-height:var(--lh-ui);letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--ink-muted)}
.dt-big .amt,.sl-eb .pct{display:block;margin-top:var(--sp-8);font-size:var(--fs-h2);font-weight:500;line-height:var(--lh-h2);font-variant-numeric:tabular-nums}
.dt-sub,.sl-eb .sub{margin-top:var(--sp-4);color:var(--ink-muted);font-size:var(--fs-eyebrow)}

.sl-ladder{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(112px,100%),1fr));gap:var(--sp-8);margin-top:var(--sp-16)}
.sl-cell{background:var(--canvas);border-radius:var(--r-well);padding:var(--sp-12)}
.sl-cell .w{display:block;color:var(--ink-muted);font-size:var(--fs-chip)}
.sl-cell .d{display:block;margin-top:var(--sp-4);font-size:var(--fs-eyebrow);white-space:normal}
.sl-req{margin-top:var(--sp-16)}

.tco-verdict,.dt-verdict,.sl-verdict,.nt-verdict{margin-top:var(--sp-24);background:var(--canvas);border-radius:var(--r-well);padding:var(--sp-16) var(--sp-24)}
.sl-verdict:empty{display:none}
.tco-disclaimer,.dt-disc,.sl-disc,.nt-disc{margin-top:var(--sp-16);color:var(--ink-muted);font-size:var(--fs-eyebrow);line-height:var(--lh-text)}

/* NIS2–DORA gyorsteszt */
#ntQuestions{display:grid;gap:var(--gap-items)}
.nt-qhead{display:flex;gap:var(--sp-16);align-items:flex-start;margin-bottom:var(--sp-16)}
.nt-num{width:32px;height:32px;border-radius:var(--r-circle);border:var(--stroke) solid currentColor;display:inline-flex;align-items:center;justify-content:center;
  font-size:var(--fs-eyebrow);font-weight:600;line-height:1;flex:none;font-variant-numeric:tabular-nums}
.nt-qt{font-weight:500}
.nt-cat{display:block;margin-top:var(--sp-4);font-family:var(--font-mono);font-size:var(--fs-chip);font-weight:500;letter-spacing:var(--ls-eyebrow);text-transform:uppercase;color:var(--accent-text)}
.nt-score{display:flex;align-items:center;flex-wrap:wrap;gap:var(--sp-12) var(--sp-16);margin-bottom:var(--sp-16)}
.nt-pct{font-size:var(--fs-h2);font-weight:500;line-height:var(--lh-h2);font-variant-numeric:tabular-nums}
.nt-band{display:inline-flex;align-items:center;min-height:32px;padding:0 var(--sp-12);border-radius:var(--r-pill);border:var(--stroke) solid var(--ink-faint);
  font-size:var(--fs-chip);font-weight:500;line-height:var(--lh-ui)}
.nt-meter i{background:var(--accent)}
.nt-prog{margin-top:var(--sp-8);color:var(--ink-muted);font-size:var(--fs-eyebrow)}
.nt-weak{margin-top:var(--sp-16)}
.nt-weak ul{list-style:none;display:grid;gap:var(--sp-8);margin-top:var(--sp-8)}
.nt-weak li{position:relative;padding-left:var(--sp-24)}
.nt-weak li::before{content:"";position:absolute;left:2px;top:.55em;width:6px;height:6px;border-radius:var(--r-circle);background:var(--ink-subtle)}
.nt-weak li.gap::before{background:var(--danger)}
.nt-weak li.part::before{background:var(--gold-500)}

/* feltételezések */
.tco-assume{margin-top:var(--gap-items);background:var(--surface);border-radius:var(--r-card);padding:0 var(--sp-32)}
.tco-assume summary{cursor:pointer;font-weight:500;padding:var(--sp-16) 0;min-height:48px;display:flex;align-items:center}
.tco-assume ul{padding:0 0 var(--sp-24) 1.2em;display:grid;gap:var(--sp-8);color:var(--ink-muted);max-width:var(--measure)}
.tco-assume ul b{color:var(--ink)}
@media (max-width:767px){ .tco-assume{padding:0 var(--sp-24)} }