/* Reklamácia tovaru – /reklamacia (reklamacia-zakaznik.js). Len to, čo v styl.css nie je:
   dlaždice fotiek vady, rámik návrhu riešenia, priebeh reklamácie. Karta, polia, výber položiek,
   pilulky, sivý rámček a tlačidlá sú existujúce triedy (`.mr-karta`, `.uc-pole`, `.od-pol`, `.uc-pilulky`,
   `.mr-zrus`, `.btn`). Hodnoty z návrhu 27. 10. 2026 (Main, Mobil, Hotovo, Navrh). */
#rk .mr-bezfoto{display:grid;place-items:center;color:var(--line-2)}
#rk .mr-bezfoto svg{width:22px;height:22px}
#rk .od-sek .uc-pilulky{margin-top:0}
.rz-dva{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 12px}
.rz-dva .rz-cely{grid-column:span 2}
.rz-adresa{margin-bottom:6px}
.rz-pozn{font-size:.78rem;color:var(--ink-soft);line-height:1.45}
.rz-pozn[hidden]{display:none}
.rz-stred{text-align:center}
.od-sek-n em{font-style:normal;font-weight:400;color:var(--ink-soft)}

/* Fotodokumentácia: dlaždice 84 px, tlačidlo Pridať / Odfotiť s prerušovaným rámom. */
.rz-fotky{display:flex;flex-wrap:wrap;gap:10px}
.rz-foto{position:relative;width:84px;height:84px;border-radius:12px}
.rz-foto img{width:100%;height:100%;object-fit:cover;border-radius:12px;display:block;background:var(--bg-soft)}
.rz-foto button{position:absolute;top:-7px;right:-7px;width:24px;height:24px;padding:0;border-radius:50%;border:2px solid var(--v-okne);
  background:var(--ink-2);color:var(--v-okne);display:grid;place-items:center;cursor:pointer}
.rz-foto button svg{width:10px;height:10px}
.rz-foto button:focus-visible,.rz-pridat:focus-visible{outline:2px solid var(--red);outline-offset:2px}
.rz-pridat{width:84px;height:84px;padding:0;border-radius:12px;border:1.5px dashed rgba(107,99,96,.45);background:rgba(255,255,255,.5);
  color:var(--ink-soft);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
  font:600 .75rem var(--text);cursor:pointer}
.rz-pridat:hover{border-color:var(--red);color:var(--red-dk)}
.rz-pridat svg{width:22px;height:22px}

/* Hotovo: zhrnutie na bielom podklade a pilulkové tlačidlo Sledovať stav. */
.rz-zhrnutie{padding:14px 16px;border-radius:14px;background:rgba(255,255,255,.78);border:1px solid rgba(255,255,255,.9)}
.rz-zhrnutie div{font-size:.88rem}
a.mr-sklo-tl.rz-sled,button.mr-sklo-tl.rz-sled{height:48px;box-sizing:border-box;border-radius:999px;align-self:stretch;font-size:.88rem}

/* Návrh riešenia (?k=): rámik s navrhnutým riešením. */
.rz-navrh{padding:16px;border-radius:14px;background:rgba(255,255,255,.85);border:1.5px solid var(--red);display:flex;flex-direction:column;gap:6px}
.rz-nav-n{font-size:.69rem;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--red-dk)}
.rz-navrh b{font-family:var(--head);font-size:1.25rem;font-weight:600;letter-spacing:.02em;text-transform:uppercase;color:var(--ink)}
.rz-navrh span:last-child:not(.rz-nav-n){font-size:.9rem;line-height:1.55}
.rz-proti{display:flex;flex-direction:column;gap:10px;padding:16px;border-radius:14px;background:rgba(255,255,255,.5);border:1px dashed rgba(107,99,96,.35)}
.rz-proti > b{font-size:.9rem;color:var(--ink)}
.rz-proti .uc-pole{margin:0}
.rz-proti .uc-pilulky{margin-top:0}
.rz-hlaska{text-align:center}
/* Odkaz z e-mailu (&r=suhlas / &r=protinavrh) zvýrazní zvolenú možnosť; nič sa nezapíše bez kliku. */
.rz-zvyrazni{animation:rzZvyrazni 1.6s ease-out 2}
@keyframes rzZvyrazni{0%,100%{box-shadow:0 0 0 0 rgba(225,33,31,0)}35%{box-shadow:0 0 0 5px rgba(225,33,31,.28)}}
@media (prefers-reduced-motion:reduce){.rz-zvyrazni{animation:none;outline:3px solid var(--red);outline-offset:3px}}

/* Priebeh reklamácie: bodky podľa druhu udalosti. */
.rz-priebeh{display:flex;flex-direction:column;gap:10px;font-size:.84rem;line-height:1.45}
.rz-priebeh > div{display:flex;gap:10px}
.rz-pr-n{font-size:.69rem;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-soft)}
.rz-priebeh b{color:var(--ink)}
.rz-bodka{width:8px;height:8px;border-radius:50%;margin-top:6px;flex:none}
.rz-bodka.zel{background:#1f7a3a}
.rz-bodka.zlta{background:#d49a1f}
.rz-bodka.fial{background:#5b3f8f}
.rz-bodka.cerv{background:var(--red)}
.rz-bodka.siva{background:var(--ink-soft)}

@media (max-width:640px){
  .rz-dva{grid-template-columns:minmax(0,1fr)}
  .rz-dva .rz-cely{grid-column:auto}
  /* Mobil: riadok položky sa zalomí, počet kusov ide pod názov (návrh Mobil). */
  #rk .od-pol{gap:10px;padding:10px 12px 10px 10px;flex-wrap:wrap}
  #rk .od-pol .od-n{flex:1 1 150px;font-size:.875rem}
  #rk .od-pol .od-ks{margin-left:84px}
}