/* =========================================================================
   CUSTOM SELECT – editorial dropdown (istora štandard)
   Natívny <select> je skrytý, UI kreslí select.js.
   Farby výhradne cez CSS premenné z theme.css.
   ========================================================================= */
.csel{position:relative;width:100%}
.csel select{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none;margin:0;padding:0;border:0;clip:rect(0 0 0 0)}

.csel-btn{
  width:100%;display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:14px 16px;border:1px solid var(--line);background:var(--bg);color:var(--ink);
  font-family:var(--font-sans);font-size:16px;line-height:1.3;text-align:left;
  cursor:pointer;transition:border-color .15s;border-radius:var(--radius-btn,0);appearance:none;
}
.csel-btn:hover{border-color:var(--line-strong)}
.csel-btn:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.csel.open .csel-btn{border-color:var(--accent)}

.csel-btn .chev{flex:0 0 auto;width:11px;height:7px;transition:transform .18s ease}
.csel-btn .chev path{stroke:var(--accent);stroke-width:1.4;fill:none}
.csel.open .csel-btn .chev{transform:rotate(180deg)}

.csel-list{
  position:absolute;z-index:200;left:0;right:0;top:calc(100% - 1px);
  background:var(--white);border:1px solid var(--accent);
  max-height:288px;overflow-y:auto;display:none;margin:0;padding:0;list-style:none;
}
.csel.open .csel-list{display:block}
.csel.drop-up .csel-list{top:auto;bottom:calc(100% - 1px)}

.csel-opt{
  padding:13px 16px;font-family:var(--font-sans);font-size:15px;color:var(--ink);
  border-bottom:1px solid var(--line);cursor:pointer;display:flex;align-items:baseline;justify-content:space-between;gap:12px;
}
.csel-opt:last-child{border-bottom:none}
.csel-opt[aria-selected="true"]{color:var(--accent);font-weight:600;box-shadow:inset 2px 0 0 var(--accent)}
.csel-opt.hl,.csel-opt:hover{background:var(--accent);color:var(--bg);box-shadow:none}
.csel-opt[aria-disabled="true"]{color:var(--ink-muted);cursor:default;background:none;box-shadow:none}

@media(max-width:600px){
  .csel-btn{font-size:16px}
  .csel-opt{padding:14px 16px;font-size:16px}
}

/* Zaoblenie listboxu podľa témy (verejný web: --radius-btn; admin prepisuje cez --r) */
.csel-list{border-radius:var(--radius-btn,0)}