/* ============================================================
   21 — Kódáttekintés: oldalspecifikus elemek
   okok · javaslat-minta · döntéskártyák · pipalista · Kód-bíró · Review-labor
   ============================================================ */

.ix.term::before{content:"⌨ REVIEW-LABOR";}
ol.lepesek{padding-left:22px;}
ol.lepesek li{margin-bottom:6px;}
.ok-jel{color:var(--green); font-weight:800;} .hiba-jel{color:var(--red); font-weight:800;}

/* ---------- miért? ---------- */
.okok, .dontesek{display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:10px; margin:14px 0;}
.dontesek{grid-template-columns:repeat(3, minmax(0,1fr));}
.ok-k, .dt{background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:12px 14px; min-width:0;}
.ok-k b, .dt b{display:block; color:var(--ink-strong); margin-bottom:4px;}
.ok-k small, .dt small{color:var(--muted); font-size:.84rem; line-height:1.45; display:block;}
.dt.zold{border-color:color-mix(in srgb, var(--green) 55%, transparent);}
.dt.piros{border-color:color-mix(in srgb, var(--red) 55%, transparent);}

/* ---------- javaslat-minta ---------- */
.jav-minta{border:1px solid var(--line); border-radius:10px; overflow:hidden; margin:12px 0; max-width:520px; background:var(--card-in);}
.jm-f{font-size:.8rem; color:var(--muted); padding:5px 12px; border-bottom:1px solid var(--line); background:var(--panel);}
.jm-sor{font-family:"Cascadia Mono",Consolas,monospace; font-size:.84rem; padding:2px 12px; white-space:pre-wrap;}
.jm-sor.del{background:rgba(248,81,73,.12);} .jm-sor.add{background:rgba(46,160,67,.16);}
.jm-g{display:flex; flex-wrap:wrap; gap:8px; padding:8px 12px; border-top:1px solid var(--line);}
.jm-btn{font-size:.8rem; font-weight:700; padding:3px 10px; border-radius:6px; background:#238636; color:#ffffff;}
.jm-btn.ghost{background:var(--panel2); color:var(--ink); border:1px solid var(--line);}

/* ---------- pipalista ---------- */
ul.pipalista{list-style:none; padding-left:0;}
ul.pipalista li{position:relative; padding-left:30px; margin-bottom:8px;}
ul.pipalista li::before{content:"☐"; position:absolute; left:4px; top:-1px; color:var(--accent2); font-size:1.1rem;}

/* ---------- Kód-bíró ---------- */
.ix.biro::before{content:"⚖ KÓD-BÍRÓ";}
.kb-fajl{border:1px solid var(--line); border-radius:10px; overflow:hidden; margin:12px 0; background:var(--code-bg);}
.kb-fajl-f{display:flex; justify-content:space-between; gap:8px; padding:6px 12px; background:var(--panel2); border-bottom:1px solid var(--line); font-size:.82rem; font-weight:700; color:var(--ink-strong);}
.kb-fajl-f span:last-child{color:var(--muted); font-weight:600;}
.kb-sorok{overflow-x:auto;}
.kb-sor{
  display:flex; width:100%; min-width:max-content; text-align:left; border:0; background:transparent; color:var(--code-ink); cursor:pointer; padding:0;
  font-family:"Cascadia Mono",Consolas,monospace; font-size:.8rem; line-height:1.7; white-space:pre;
}
.kb-sor .ln{flex:0 0 auto; width:40px; text-align:right; padding-right:10px; color:#6b7684; user-select:none;}
.kb-sor .j{flex:0 0 auto; width:16px; color:#6b7684;}
.kb-sor .s{padding-right:14px;}
.kb-sor.add{background:rgba(46,160,67,.13);}
.kb-sor:hover{outline:1px solid var(--cyan); outline-offset:-1px;}
.kb-sor[aria-pressed="true"]{background:rgba(96,165,250,.25); box-shadow:inset 4px 0 0 var(--blue);}
.kb-sor.talalt{background:rgba(74,222,128,.25); box-shadow:inset 4px 0 0 var(--green);}
.kb-sor.kihagyott{background:rgba(251,191,36,.22); box-shadow:inset 4px 0 0 var(--orange);}
.kb-sor.teves{background:rgba(248,113,113,.2); box-shadow:inset 4px 0 0 var(--red);}
.kb-szaml{font-size:.85rem; color:var(--muted); align-self:center;}
.kb-eredm:empty{display:none;}
.kb-eredm{background:var(--card-in); border:1px solid var(--line); border-radius:12px; padding:10px 14px; margin-top:12px; font-size:.9rem;}
.kb-eredm ul{margin:6px 0; padding-left:20px;}
.kb-eredm li{margin-bottom:4px;}
.kb-eredm .ok{color:var(--green);} .kb-eredm .ki{color:var(--orange);} .kb-eredm .rossz{color:var(--red);}
.kb-dontes{margin-top:12px;}
.kb-dg{display:flex; flex-wrap:wrap; gap:8px;}
.kb-dg button{font:inherit; font-size:.88rem; font-weight:700; color:var(--ink); background:var(--opt-bg); border:1px solid var(--line); border-radius:9px; padding:7px 14px; cursor:pointer;}
.kb-dg button:hover{border-color:var(--accent);}
.kb-dg button.jo{background:var(--ok-bg); border-color:var(--green); color:var(--ok-ink);}
.kb-dg button.rossz{background:var(--bad-bg); border-color:var(--red); color:var(--bad-ink);}
.kb-dfb{font-size:.9rem;}

@media (max-width:760px){
  .okok{grid-template-columns:repeat(2, minmax(0,1fr));}
  .dontesek{grid-template-columns:minmax(0,1fr);}
}
@media (max-width:460px){
  .okok{grid-template-columns:minmax(0,1fr);}
}