:root{
  --bg:#050b14;
  --panel:#071224;
  --panel2:#06101f;

  --text:#d9e6ff;
  --muted:#7d8aa3;

  --teal:#00d7c8;
  --gold:#ff9f1a;
  --red:#ff4d4d;

  --btnA:#0b1f37;
  --btnB:#081a2e;

  --radius:22px;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  color:var(--text);
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background: radial-gradient(900px 600px at 30% 0%, #0a1b33 0%, var(--bg) 60%);
}

/* ===== TOPBAR ===== */
.topbar{
  display:grid;
  grid-template-columns: 240px 1fr;
  gap:16px;
  align-items:center;
  padding:16px 18px;
  border-bottom:1px solid rgba(255,255,255,.06);
}
.topbar__brand{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:260px;
}

.brand-logo{
  width:56px;
  height:56px;
  object-fit:contain;
  filter: drop-shadow(0 0 6px rgba(255,182,108,.35));
}
.brand__title{font-weight:950; letter-spacing:.5px}
.brand__sub{font-size:12px; color:var(--muted); font-weight:750; letter-spacing:.7px}

.topbar__row{
  display:grid;
  grid-template-columns: 160px 1fr;
  gap:12px;
  align-items:center;
  justify-items:end;
}

.pill{
  justify-self:start;
  padding:10px 14px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(7,18,36,.65);
  font-weight:900;
  white-space:nowrap;
}
.pill--warn{color:var(--gold); border-color:rgba(255,159,26,.35)}

.topbar__actions{
  display:grid;
  grid-template-columns: repeat(3, 170px);
  gap:10px;
  justify-content:end;
}

/* ===== BUTTONS ===== */
.btn{
  background:linear-gradient(145deg,var(--btnA),var(--btnB));
  border:1px solid rgba(255,255,255,.10);
  color:var(--text);
  padding:12px 14px;
  border-radius:16px;
  font-weight:900;
  cursor:pointer;
  user-select:none;
}
.btn:hover{filter:brightness(1.08)}
.btn--primary{
  background:linear-gradient(145deg,#ffb25a,#ff8c1a);
  border-color:rgba(255,159,26,.55);
  color:#1b1207;
}
.btn--ghost{background:transparent}
.btn--danger{border-color:rgba(255,77,77,.5); color:var(--red)}
.iconbtn{
  width:42px;height:42px;border-radius:14px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(0,0,0,.25);
  color:var(--text);
  cursor:pointer;
  font-size:18px;
}
.btn--outline-gold{
  background:transparent;
  color:#ffb25a;
  border:1.5px solid rgba(255,159,26,.7);
  font-weight:600;
}

.btn--outline-gold:hover{
  background:rgba(255,159,26,.08);
}

/* ===== PAGE LAYOUT ===== */
.page{
  max-width:1120px;
  margin:18px auto;
  padding:0 14px;
}

/* ===== SEARCH PANEL ===== */
.panel{
  padding:18px;
  background:linear-gradient(180deg, rgba(7,18,36,.80), rgba(6,16,31,.75));
  border:1px solid rgba(255,255,255,.06);
  border-radius:var(--radius);
}
.panel--search{
  display:grid;
  grid-template-columns: 180px 120px 1fr;
  gap:16px;
  align-items:center;
}
.panel__title{
  font-size:22px;
  font-weight:950;
  color:#aebbe0;
  opacity:.92;
  text-align:center;
}
.panel__filters{display:grid; gap:12px}

.filters-row{display:grid; gap:12px; align-items:end}
.filters-row--top{grid-template-columns: 1.2fr 1.2fr .9fr}
.filters-row--bottom{grid-template-columns: minmax(0,1fr) minmax(0,1fr); max-width: 520px}

.field span{
  display:block;
  font-size:11px;
  color:#9db0d8;
  margin:0 0 6px 2px;
  letter-spacing:.2px;
}
.field input, .field select{
  width:100%;
  padding:12px 12px;
  border-radius:12px;
  background:rgba(3,8,16,.55);
  border:1px solid rgba(255,255,255,.10);
  color:var(--text);
  outline:none;
}
.field input:focus, .field select:focus{
  border-color:rgba(0,215,200,.5);
  box-shadow:0 0 0 3px rgba(0,215,200,.12);
}

/* fixed prefix: 4. + select */
.aptpick{
  display:flex;
  align-items:center;
  gap:8px;
  padding:10px 12px;
  border-radius:12px;
  background:rgba(3,8,16,.55);
  border:1px solid rgba(255,255,255,.10);
}
.aptpick__prefix{
  color:var(--teal);
  font-weight:1000;
  letter-spacing:2px;
}
.aptpick select{
  border:0;
  background:transparent;
  color:var(--text);
  font-weight:950;
  outline:none;
  width:100%;
}
.aptpick--small{padding:10px 12px}
.aptpick--big{
  width:240px;
  padding:10px 14px;
  border-radius:14px;
  border-color:rgba(0,215,200,.28);
}
.aptpick--big .aptpick__prefix{font-size:28px}
.aptpick--big select{font-size:28px; letter-spacing:2px}

/* ===== META ===== */
.meta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin:14px 4px 10px;
}
.meta__chips{display:flex; gap:10px}
.chip{
  padding:8px 12px;
  border-radius:999px;
  border:1px solid rgba(0,215,200,.22);
  color:var(--teal);
  background:rgba(0,215,200,.06);
  font-weight:950;
}

.meta__legend{
  display:flex;
  gap:12px;
  align-items:center;
}

/* Button-like filters (Obsadené/odchádza, Obsadené, Voľné) */
.seg{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:10px 14px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(7,18,36,.55);
  color:#c7d5ff;
  font-weight:950;
  cursor:pointer;
  user-select:none;
}
.seg b{
  display:inline-grid;
  place-items:center;
  min-width:24px;
  height:22px;
  padding:0 8px;
  border-radius:999px;
  background:rgba(0,0,0,.25);
  border:1px solid rgba(255,255,255,.10);
}
.seg:hover{filter:brightness(1.08)}
.seg.is-active{box-shadow:0 0 0 3px rgba(255,255,255,.08) inset}

.seg--free{border-color:rgba(0,215,200,.22)}
.seg--occupied{border-color:rgba(255,159,26,.22)}
.seg--depart{border-color:rgba(255,77,77,.24)}

.seg--free.is-active{box-shadow:0 0 0 3px rgba(0,215,200,.16) inset}
.seg--occupied.is-active{box-shadow:0 0 0 3px rgba(255,159,26,.16) inset}
.seg--depart.is-active{box-shadow:0 0 0 3px rgba(255,77,77,.16) inset}

/* ===== CARDS ===== */
.cards{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap:14px;
  padding:18px;
  background:linear-gradient(180deg, rgba(7,18,36,.60), rgba(6,16,31,.50));
  border:1px solid rgba(255,255,255,.06);
  border-radius:var(--radius);
}
.apt-card{
  border-radius:18px;
  padding:12px 12px 10px;
  border:1px solid rgba(255,255,255,.10);
  background: radial-gradient(circle at top left, rgba(11,35,70,.55) 0, rgba(6,16,31,.55) 38%, rgba(5,12,23,.92) 100%);
  cursor:pointer;
  transition:transform .08s ease, filter .08s ease;
  min-height:96px;
}
.apt-card:hover{transform:translateY(-1px); filter:brightness(1.06)}
.apt-top{display:flex; justify-content:space-between; gap:12px; align-items:flex-start}
.apt-title{font-weight:950; letter-spacing:.35px; text-transform:uppercase; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;}
.apt-title span{display:block; color:#a9b7de; font-weight:850; margin-top:4px}
.apt-no{font-size:26px; font-weight:1000; letter-spacing:1px}
.apt-bottom{display:flex; align-items:center; gap:12px; margin-top:10px; color:#a9b7de; font-weight:900}
.apt-bottom .line{flex:1; height:2px; background:rgba(255,255,255,.10)}
.apt-bottom.ghost{opacity:.45}
.apt-no.teal{color:var(--teal)}

.apt-card.free{
  border-color:rgba(0,215,200,.35);
  background: radial-gradient(circle at top left, rgba(0,215,200,.18) 0, rgba(6,20,30,.65) 42%, rgba(5,12,23,.95) 100%);
}
.apt-card.occupied{
  border-color:rgba(255,159,26,.40);
  background: radial-gradient(circle at top left, #39200c 0, #120b04 38%, #050c17 100%);
}
.apt-card.departing{
  border-color:rgba(255,77,77,.55);
  background: radial-gradient(circle at top left, rgba(130,30,30,.65) 0, rgba(18,11,4,.65) 40%, rgba(5,12,23,1) 100%);
  box-shadow:0 0 14px rgba(255,77,77,.18);
}

/* OVERDUE = mal už odísť (výstraha) */
.apt-card.overdue{
  border-color:rgba(255,77,77,.75);
  background: radial-gradient(circle at top left, rgba(170,28,28,.78) 0, rgba(35,8,10,.70) 42%, rgba(5,12,23,1) 100%);
  box-shadow:0 0 18px rgba(255,77,77,.25);
}

/* ===== MODALS ===== */
.modal{
  position:fixed; inset:0;
  display:none;
  overflow:auto;
  background:rgba(0,0,0,.55);
  padding:22px;
  z-index:50;
}
.modal.show{display:flex; align-items:flex-start; justify-content:center}
.modal__card{
  width:min(1120px, 96vw);
  max-height: calc(100dvh - 44px);
  display:flex;
  flex-direction:column;
  background:linear-gradient(180deg, rgba(7,18,36,.92), rgba(6,16,31,.92));
  border:1px solid rgba(255,255,255,.10);
  border-radius:var(--radius);
  overflow:hidden;
}
.modal__head{
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 16px;
  border-bottom:1px solid rgba(255,255,255,.06);
}
.modal__title{font-weight:1000; letter-spacing:.5px}
.modal__grid{
  display:grid;
  grid-template-columns: minmax(0,1fr) minmax(0,1fr);
  gap:18px;
  padding:16px;
}
.block{
  border:1px solid rgba(255,255,255,.06);
  border-radius:18px;
  padding:14px;
  background:rgba(2,7,14,.28);
}
.block__title{
  font-size:18px;
  font-weight:1000;
  color:#b9c7ea;
  margin-bottom:12px;
}
.row2{display:grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap:12px}

.sig{margin-top:12px}
.sig__title{font-weight:900; color:#9db0d8; margin-bottom:8px}
.sig__box{
  height:140px;
  border-radius:16px;
  border:1px solid rgba(0,215,200,.18);
  background:rgba(0,0,0,.18);
  display:flex; align-items:center; justify-content:center;
  color:#7d8aa3;
  font-weight:900;
}

.modal__foot{
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 16px;
  border-top:1px solid rgba(255,255,255,.06);

  position: sticky;
  bottom: 0;
  background: linear-gradient(180deg, rgba(6,12,24,.55), rgba(6,12,24,.92));
  backdrop-filter: blur(10px);
}

.modal__footRight{display:flex; gap:10px}
.bigValue{
  font-size:34px;
  font-weight:1100;
  letter-spacing:2px;
  color:var(--teal);
  margin-bottom:10px;
}
.info{color:#a9b7de; font-weight:850; line-height:1.45}

/* ===== Tablet tweaks (Lenovo Tab 11") ===== */
@media (max-width: 980px){
  .topbar{grid-template-columns: 220px 1fr}
  .topbar__actions{grid-template-columns: repeat(3, 1fr)}
  .panel--search{grid-template-columns: 180px 90px 1fr}
  .panel__filters{display:grid; gap:12px}
}

.field--apt span{white-space:nowrap;}

.apt-prefix{display:none;}

/* Meta filter buttons – more výrazné */
.meta__legend button,
.legend button,
.stat-btn{
  border-width:2px !important;
  font-weight:1000 !important;
  background:rgba(0,0,0,.18);
}
.stat-btn[data-filter="departing"]{
  border-color:rgba(255,77,77,.75);
  background: radial-gradient(circle at top left, #3a0f0f 0, #120606 38%, #050c17 100%);
  box-shadow:0 0 14px rgba(255,77,77,.18);
}
.stat-btn[data-filter="occupied"]{
  border-color:rgba(255,182,108,.70);
  background: radial-gradient(circle at top left, #39200c 0, #120b04 38%, #050c17 100%);
  box-shadow:0 0 14px rgba(255,182,108,.12);
}
.stat-btn[data-filter="free"]{
  border-color:rgba(0,215,200,.75);
  background: radial-gradient(circle at top left, #0a3a36 0, #061a18 38%, #050c17 100%);
  box-shadow:0 0 14px rgba(0,215,200,.12);
}
.stat-btn[aria-pressed="true"]{filter:brightness(1.12);}

/* Date inputs – ukáž ikonku kalendára na tmavom pozadí + klik kdekoľvek */
input[type="date"], input[type="time"]{cursor:pointer;}
input[type="date"]::-webkit-calendar-picker-indicator{
  opacity:1;
  filter: invert(1);
}

/* Segmented filter buttons (meta right) – výraznejšie */
.meta__legend{display:flex; gap:12px; align-items:center}
.seg{
  padding:10px 14px;
  border-radius:999px;
  border:2px solid rgba(255,255,255,.14);
  color:var(--text);
  font-weight:1000;
  letter-spacing:.2px;
  background:rgba(0,0,0,.18);
  cursor:pointer;
}
.seg b{margin-left:6px}
.seg--depart{
  border-color:rgba(255,77,77,.75);
  background: radial-gradient(circle at top left, #3a0f0f 0, #120606 38%, #050c17 100%);
  box-shadow:0 0 14px rgba(255,77,77,.18);
}
.seg--occupied{
  border-color:rgba(255,182,108,.70);
  background: radial-gradient(circle at top left, #39200c 0, #120b04 38%, #050c17 100%);
  box-shadow:0 0 14px rgba(255,182,108,.12);
}
.seg--free{
  border-color:rgba(0,215,200,.75);
  background: radial-gradient(circle at top left, #0a3a36 0, #061a18 38%, #050c17 100%);
  box-shadow:0 0 14px rgba(0,215,200,.12);
}
.seg[aria-pressed="true"]{filter:brightness(1.14);}

/* Rozpis počtu odchodov v segmente: DNES vs ⚠ OVERDUE */
.seg-split{
  display:inline-flex;
  gap:8px;
  margin-left:10px;
}
.seg-mini{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 8px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(0,0,0,.18);
  font-weight:950;
  line-height:1;
}
.seg-mini__icon{
  font-size:11px;
  letter-spacing:.3px;
  opacity:.95;
}
.seg-mini b{
  margin:0;
  min-width:18px;
  height:18px;
  padding:0 6px;
  border-radius:999px;
  background:rgba(0,0,0,.22);
  border:1px solid rgba(255,255,255,.14);
  display:inline-grid;
  place-items:center;
}
.seg-mini--today{border-color:rgba(255,77,77,.55);}
.seg-mini--today .seg-mini__icon{color:rgba(255,77,77,.95);}
.seg-mini--overdue{border-color:rgba(255,77,77,.40);}
.seg-mini--overdue .seg-mini__icon{color:rgba(255,77,77,.95);}


/* === Badge DNES (len pre departing) === */
.apt-card{ position:relative; }

.badge-today{
  position:absolute;
  top:10px;
  right:10px;
  padding:6px 10px;
  border-radius:999px;
  font-weight:1000;
  font-size:12px;
  letter-spacing:.4px;
  border:2px solid rgba(255,77,77,.75);
  color: rgba(255,77,77,0.95);
  background: radial-gradient(circle at top left, #3a0f0f 0, #120606 38%, #050c17 100%);
  box-shadow: 0 0 12px rgba(255,77,77,.22);
}

/* DNES medzi dátumami */
.today-pill{
  padding:4px 10px;
  border-radius:999px;
  font-weight:1000;
  font-size:12px;
  letter-spacing:.35px;

  border:2px solid rgba(255,77,77,.75);
  color: rgba(255,77,77,0.95);
  background: radial-gradient(circle at top left, #3a0f0f 0, #120606 38%, #050c17 100%);
  box-shadow: 0 0 10px rgba(255,77,77,.18);
}

/* Aby badge DNES nič nerozťahoval */
.apt-bottom{ position:relative; }

.today-float{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  padding:3px 8px;
  border-radius:999px;

  font-weight:1000;
  font-size:11px;
  letter-spacing:.3px;

  border:1.5px solid rgba(255,77,77,.75);
  color: rgba(255,77,77,.95);
  background: rgba(0,0,0,.35);
  box-shadow: 0 0 10px rgba(255,77,77,.18);

  pointer-events:none; /* nech to neblokuje klik */
  white-space:nowrap;
}
.today-float{ background: radial-gradient(circle at top left, #3a0f0f 0, #120606 38%, rgba(0,0,0,.35) 100%); }

/* Výstraha pre OVERDUE (mal odísť) */
.warn-float{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  padding:2px 7px;
  border-radius:999px;

  font-weight:1000;
  font-size:12px;
  line-height:1;

  border:1.5px solid rgba(255,77,77,.85);
  color: rgba(255,77,77,.98);
  background: radial-gradient(circle at top left, #4a1010 0, #160707 38%, rgba(0,0,0,.35) 100%);
  box-shadow: 0 0 12px rgba(255,77,77,.22);
  pointer-events:none;
  white-space:nowrap;
}


/* gold cards use same styling as occupied */
.apt-card.gold{
  border-color:rgba(255,159,26,.40);
  background: radial-gradient(circle at top left, #39200c 0, #120b04 38%, #050c17 100%);
}

/* ===== POISTKA: farby mena + čísla podľa farby karty ===== */

/* číslo apartmánu */
.apt-card.free .apt-no{ color: var(--teal) !important; }
.apt-card.gold .apt-no,
.apt-card.occupied .apt-no{ color: var(--gold) !important; }
.apt-card.departing .apt-no,
.apt-card.overdue .apt-no{ color: var(--red) !important; }

/* meno nájomníka / VOĽNÝ */
.apt-card.free .apt-title{ color: rgba(0,215,200,.85) !important; }
.apt-card.gold .apt-title,
.apt-card.occupied .apt-title{ color: rgba(255,182,108,.85) !important; }
.apt-card.departing .apt-title,
.apt-card.overdue .apt-title{ color: rgba(255,77,77,.85) !important; }

/* voliteľný jemný glow (vyzerá prémiovo) */
.apt-card.gold .apt-no,
.apt-card.occupied .apt-no{ text-shadow: 0 0 8px rgba(255,182,108,.28); }
.apt-card.departing .apt-no,
.apt-card.overdue .apt-no{ text-shadow: 0 0 8px rgba(255,77,77,.28); }
.apt-card.free .apt-no{ text-shadow: 0 0 8px rgba(0,215,200,.28); }

/* ===== ZJEDNOTENIE TYPOGRAFIE V MODALOCH ===== */

.modal,
.modal input,
.modal select,
.modal label,
.modal .form-label {
  font-size: 14px;
  line-height: 1.4;
}
.modal .form-row,
.modal .field,
.modal .input-group {
  margin-bottom: 12px;
}
.modal .form-grid {
  row-gap: 12px;
}
.modal label,
.modal .form-label {
  display: block;
  margin-bottom: 6px;
  opacity: 0.85;
}



.modal__grid > .block{min-width:0;}

html.modal-open, body.modal-open{overflow:hidden !important; height:100% !important;}

.block__title .nowrap{white-space:nowrap;}
.block__title .muted{display:inline-block; margin-top:4px; font-size:12px; opacity:.75; font-weight:800;}

.modal .aptpick--big{width:260px;}
.modal .aptpick--big select{
  appearance:none; -webkit-appearance:none;
  font-size:18px; font-weight:1000; letter-spacing:.6px;
}


/* ===== Modal scroll fix: scroll inside modal body, not page ===== */
.modal{
  overflow:hidden; /* prevent scrolling the overlay itself */
}
.modal__card{
  overflow:hidden;
}
.modal__body{
  flex:1;
  min-height:0;
  overflow:auto;
  -webkit-overflow-scrolling: touch;
}

/* lock background scroll when modal open (JS also adds modal-open) */
html.modal-open, body.modal-open{
  overflow:hidden !important;
  height:100% !important;
}



/* ===== Modal grid: enforce equal columns ===== */
.modal__grid{
  grid-template-columns: minmax(0,1fr) minmax(0,1fr);
}
.modal__grid > .block{
  min-width:0;
}



/* ===== Custom apartment picker (readable list) ===== */
.aptpick{
  position:relative;
}
.aptpick__btn{
  width:100%;
  display:flex;
  align-items:center;
  gap:10px;
  background: transparent;
  border:0;
  padding:0;
  color: var(--text);
  font: inherit;
  cursor:pointer;
}
.aptpick__display{
  display:flex;
  align-items:baseline;
  gap:8px;
  width:100%;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(0,215,200,.35);
  background: rgba(0,0,0,.18);
}
.aptpick__prefix{
  font-weight:1000;
  font-size:18px;
  color: rgba(0,215,200,.95);
}
.aptpick__value{
  font-size:18px;
  font-weight:1000;
  letter-spacing:.6px;
}
.aptpick__chev{
  margin-left:auto;
  opacity:.75;
  font-weight:900;
}

.aptpick__native{
  position:absolute;
  inset:auto 0 0 auto;
  width:1px;
  height:1px;
  opacity:0;
  pointer-events:none;
}

.aptpick__menu{
  position:absolute;
  top: calc(100% + 8px);
  left:0;
  right:0;
  max-height: 320px;
  overflow:auto;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.12);
  background: radial-gradient(circle at top left, rgba(10,30,55,.98) 0, rgba(5,12,23,.98) 55%, rgba(3,8,16,.98) 100%);
  box-shadow: 0 18px 60px rgba(0,0,0,.55);
  z-index:80;
  display:none;
  padding:6px;
}
.aptpick.open .aptpick__menu{ display:block; }

.aptpick__item{
  width:100%;
  text-align:left;
  border:1px solid transparent;
  background: rgba(255,255,255,.04);
  color: rgba(235,245,255,.92);
  padding:10px 12px;
  border-radius:12px;
  font-weight:900;
  letter-spacing:.5px;
  cursor:pointer;
}
.aptpick__item:hover{
  border-color: rgba(0,215,200,.35);
  background: rgba(0,215,200,.10);
}
.aptpick__item[aria-selected="true"]{
  border-color: rgba(0,215,200,.55);
  background: rgba(0,215,200,.16);
}
.aptpick__empty{
  padding:12px;
  color: rgba(235,245,255,.65);
  font-weight:800;
}



/* ===== FINAL modal fit + internal scroll (authoritative) ===== */
.modal.show{display:grid; place-items:center;}
.modal{padding:12px; overflow:hidden;}
.modal__card{width:min(1120px, calc(100vw - 24px)); max-height:calc(100dvh - 24px); overflow:hidden;}
.modal__body{min-height:0; overflow:auto; -webkit-overflow-scrolling:touch;}

/* ===== MODAL: jednotné labely nad inputmi (vľavo aj vpravo) ===== */
.modal .field > span,
.modal label,
.modal .form-label {
  display: block;
  margin: 0 0 6px 0;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.25;
  color: rgba(220, 230, 255, .85); /* default */
}
.modal .field { margin-bottom: 14px; }

/* ===== MODAL: farebné role ===== */
.modal .role-tenant .field > span,
.modal .role-tenant label,
.modal .role-tenant .form-label{
  color: rgba(0, 215, 200, .95) !important;
  text-shadow: 0 0 10px rgba(0, 215, 200, .12);
}
.modal .role-staff .field > span,
.modal .role-staff label,
.modal .role-staff .form-label{
  color: rgba(255, 182, 108, .95) !important;
  text-shadow: 0 0 10px rgba(255, 182, 108, .12);
}

/* podpisové nadpisy */
.modal .sig__title{
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.25;
  color: rgba(220, 230, 255, .85);
  margin-bottom: 8px;
}
.modal .role-tenant .sig__title{
  color: rgba(0, 215, 200, .95) !important;
  text-shadow: 0 0 10px rgba(0, 215, 200, .12);
}
.modal .role-staff .sig__title{
  color: rgba(255, 182, 108, .95) !important;
  text-shadow: 0 0 10px rgba(255, 182, 108, .12);
}
.sig{
  margin-bottom: 18px;
}
.sig__box{
  margin-bottom: 6px;
}

/* ===== MODAL: disabled fields ===== */
.modal input:disabled,
.modal select:disabled,
.modal textarea:disabled{
  opacity: .55;
  filter: grayscale(.15);
  cursor: not-allowed;
}

/* left header title: keep 'Nová rezervácia' on one line */
.modal .left-head__title{ white-space: nowrap; }
.modal .left-head__title .muted{ white-space: normal; }

/* ===== Hľadaj: ČÍSLO APARTMÁNU v jednom riadku ===== */
.field--apt > span{white-space:nowrap;}
.field--apt .apt-prefix{display:none;} /* prefix zobrazujeme v texte labelu */

/* ===== Modal: krajší ľavý header (ako pravý) ===== */
.modal .left-head{align-items:flex-end; margin-bottom:14px;}
.modal .left-head__title.block__title{margin:0; font-size:24px; font-weight:900; line-height:1.05;}
.modal .left-head__title.block__title .muted{
  display:block;
  margin-top:6px;
  font-size:14px;
  font-weight:800;
  opacity:.78;
}

/* ===== Modal: luxusný výber apartmánu ===== */
.modal .apt-select--modal{
  border: 1px solid rgba(0,215,200,.40);
  background: radial-gradient(circle at top left, rgba(0,215,200,.12) 0, rgba(0,0,0,.18) 42%, rgba(5,12,23,.92) 100%);
  box-shadow: 0 10px 30px rgba(0,0,0,.35);
}
.modal .apt-select--modal .apt-prefix{font-size:22px; letter-spacing:.5px;}
.modal .apt-select--modal select{
  font-size:22px !important;
  font-weight:1000 !important;
  letter-spacing:1px !important;
}

/* ===== Hľadaj: štýlový select (ako v modale, ale jemnejší) ===== */
.apt-select--search{
  border: 1px solid rgba(0,215,200,.28);
  background: radial-gradient(circle at top left, rgba(0,215,200,.10) 0, rgba(0,0,0,.16) 40%, rgba(5,12,23,.92) 100%);
  box-shadow: 0 10px 26px rgba(0,0,0,.28);
}
.apt-select--search select{
  font-weight: 800;
  letter-spacing: .5px;
}

/* ===== MODAL: disabled signature boxes ===== */
.modal .sig__box.is-disabled{
  opacity:.45;
  filter: grayscale(.2);
  pointer-events:none;
}

/* ===== Apartmán: OVERDUE (mal už odísť) ===== */
.apt-card.overdue{
  background: radial-gradient(circle at top left, rgba(110,12,18,.55) 0, rgba(18,11,4,.72) 40%, rgba(5,12,23,1) 100%);
  border-color: rgba(255,80,80,.55);
  box-shadow: 0 0 0 1px rgba(255,80,80,.18) inset;
}
.apt-card.overdue .apt-title{ color: #ff6a6a; }
.apt-card.overdue .apt-no{ color: #ff6a6a; }

.overdue-float{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height: 22px;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px solid rgba(255,80,80,.7);
  color: #ff6a6a;
  background: rgba(10,10,14,.55);
  font-weight: 900;
  font-size: 12px;
  letter-spacing: .5px;
}

/* ===== Mini badges (DNES / ⚠) v tlačidle Obsadené / odchádza ===== */
.mini-badge{
  appearance:none;
  border: 1px solid rgba(255,255,255,.18);

  display:inline-flex;
  align-items:center;
  gap:6px;
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(0,0,0,.18);
  font-weight: 800;
  font-size: 12px;
  line-height: 1;
  margin-left: 10px;
  user-select: none;
  cursor: pointer;
}
.mini-badge__label{opacity:.9;}
.mini-badge--today{ border-color: rgba(0,215,200,.35); }
.mini-badge--warn{ border-color: rgba(255,80,80,.40); }
.mini-badge.is-active{
  box-shadow: 0 0 0 2px rgba(255,255,255,.08) inset, 0 10px 25px rgba(0,0,0,.25);
  background: rgba(255,255,255,.06);
}

.mini-badge{pointer-events:auto;}
.mini-badge *{pointer-events:none;}

/* ===== Status group: Obsadené / odchádza + mini chips vedľa ===== */
.statusgroup{
  display:flex;
  align-items:center;
  gap:10px;
}
.statusgroup__chips{
  display:flex;
  align-items:center;
  gap:10px;
}
.statusgroup__chips .mini-badge{
  margin-left: 0; /* už je v samostatnom rade */
}
/* Mini chips iba info (žiadne kliky, nerozbije layout) */
.statusgroup__chips {
  pointer-events: none;
}
/* podpisové boxy – základ */
.sig__box{
  min-height: 140px;          /* viac miesta na podpis */
  padding: 14px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 14px;
  letter-spacing: .2px;
  cursor: pointer;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.sig__box{
  color: rgba(200,220,235,.45);
  text-align: center;
}
.sig.role-tenant .sig__box{
  border: 1px solid rgba(0, 215, 200, .35);
  background:
    radial-gradient(
      circle at top left,
      rgba(0,215,200,.08),
      rgba(5,15,25,.92)
    );
}
.sig.role-staff .sig__box{
  border: 1px solid rgba(255, 180, 80, .35);
  background:
    radial-gradient(
      circle at top left,
      rgba(255,180,80,.10),
      rgba(10,12,18,.92)
    );
}
.sig__box{
  cursor: pointer;
  transition: border-color .2s ease, box-shadow .2s ease;
}

.sig__box:hover{
  box-shadow: 0 0 0 1px rgba(255,255,255,.06);
}
.sig{
  margin-bottom: 22px;
}




/* ===== Signature canvas ===== */
.sig__box--canvas{
  position: relative;
  overflow: hidden;
  padding: 0; /* canvas fills the box */
}

/* canvas fills the whole signature box reliably (flex-safe) */
.sig__canvas{
  position: absolute;
  inset: 10px;
  width: auto;
  height: auto;
  display: block;
  border-radius: 12px;
  touch-action: none; /* tablet stylus/prst */
  cursor: crosshair;
}

/* clear button floats above canvas */
.sig__clear{
  position: absolute;
  right: 10px;
  bottom: 10px;
  z-index: 2;
  padding: 8px 10px;
  border-radius: 12px;
  font-size: 12px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.28);
  color: rgba(235,245,255,.85);
  backdrop-filter: blur(6px);
}
.sig__clear:active{ transform: translateY(1px); }

.sig__box--canvas{ cursor: default; }

.sig__canvas{ z-index: 1; position: absolute; }
.sig__clear{ z-index: 2; }

.sig__box--canvas{ position: relative; }
.sig__canvas{ width:100%; height:100%; display:block; }


/* CAPS for official tenant data (passport-style) */
.input--caps {
  text-transform: uppercase;
}


/* Validation */
.is-invalid{
  outline: 2px solid rgba(255, 77, 77, .85);
  outline-offset: 2px;
}
.sig--invalid .sig__box{
  outline: 2px solid rgba(255, 77, 77, .85);
  outline-offset: 4px;
  border-radius: 14px;
}


/* ===== History modal list ===== */
.modal__panel--wide { max-width: 980px; }
.lbl2 { display:block; font-size:12px; color:#555; margin: 0 0 6px; }
.inp { width:100%; padding:10px 12px; border:1px solid #ccc; border-radius:10px; font-size:14px; }
.hist-list { margin-top:10px; border:1px solid #ddd; border-radius:12px; overflow:hidden; }
.hist-item { display:flex; gap:12px; padding:10px 12px; border-top:1px solid #eee; align-items:center; }
.hist-item:first-child { border-top:none; }
.hist-apt { font-weight:800; min-width:80px; }
.hist-main { flex:1; min-width:0; }
.hist-title { font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.hist-sub { font-size:12px; color:#666; margin-top:2px; display:flex; gap:10px; flex-wrap:wrap; }
.hist-chip { font-size:11px; border:1px solid #ddd; border-radius:999px; padding:4px 8px; color:#444; }


/* ===== History readability patch ===== */
#modalHistory { z-index: 9999; }
#modalHistory .modal__overlay{
  background: rgba(0,0,0,.72);
  backdrop-filter: blur(6px);
}
#modalHistory .modal__panel{
  background: #0f1623;
  color: #e9eef7;
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: 0 20px 60px rgba(0,0,0,.55);
}
#modalHistory .modal__head{
  background: rgba(255,255,255,.06);
  border-bottom: 1px solid rgba(255,255,255,.10);
}
#modalHistory .modal__title{ color:#ffffff; }
#modalHistory .modal__body{ padding-top: 14px; }
#modalHistory .lbl2{ color: rgba(233,238,247,.82); }
#modalHistory .inp{
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.18);
  color: #fff;
}
#modalHistory .inp::placeholder{ color: rgba(255,255,255,.55); }
#modalHistory .muted{ color: rgba(233,238,247,.70); }

#modalHistory .hist-list{
  background: rgba(0,0,0,.15);
  border: 1px solid rgba(255,255,255,.12);
}
#modalHistory .hist-item{
  background: rgba(255,255,255,.05);
  border-top: 1px solid rgba(255,255,255,.08);
}
#modalHistory .hist-apt{ color:#fff; }
#modalHistory .hist-title{ color:#fff; }
#modalHistory .hist-sub{ color: rgba(233,238,247,.75); }
#modalHistory .hist-chip{
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(0,0,0,.18);
  color: rgba(233,238,247,.90);
}
#modalHistory .modal__foot{
  background: rgba(255,255,255,.04);
  border-top: 1px solid rgba(255,255,255,.10);
}

#modalHistory .hist-item{ cursor:pointer; }


/* ===== History detail modal ===== */
#modalHistDetail { z-index: 10000; }
#modalHistDetail .modal__overlay{
  background: rgba(0,0,0,.72);
  backdrop-filter: blur(6px);
}
#modalHistDetail .modal__panel{
  background: #0f1623;
  color: #e9eef7;
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: 0 20px 60px rgba(0,0,0,.55);
}
#modalHistDetail .kv{
  display:flex; gap:12px; flex-wrap:wrap;
}
#modalHistDetail .kv .k{
  font-size:11px; color: rgba(233,238,247,.75);
  margin-bottom:4px;
}
#modalHistDetail .kv .v{
  font-size:13px; font-weight:700; color:#fff;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.04);
  border-radius:12px;
  padding:10px 12px;
  min-width: 240px;
}
#modalHistDetail .grid2{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:10px;
}
@media (max-width: 820px){
  #modalHistDetail .grid2{ grid-template-columns: 1fr; }
}
#modalHistDetail .sigbox{
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 12px;
  background: rgba(0,0,0,.15);
  padding: 10px;
  min-height: 140px;
}
#modalHistDetail .sigbox img{
  width:100%;
  height:100px;
  object-fit:contain;
  display:block;
}
#modalHistDetail .siglbl{
  font-size:11px;
  color: rgba(233,238,247,.75);
  margin-bottom:6px;
}
#modalHistDetail .muted2{
  color: rgba(233,238,247,.70);
  font-size: 12px;
}

#modalHistory #btnHistCsv{ font-weight:700; }


/* ===== Modal scrolling fix (History) ===== */
#modalHistory .modal__panel{
  max-height: calc(100vh - 40px);
  display: flex;
  flex-direction: column;
}
#modalHistory .modal__body{
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  flex: 1 1 auto;
}
#modalHistory .modal__head, #modalHistory .modal__foot{
  flex: 0 0 auto;
}


/* ===== History toolbar ===== */
.hist-toolbar{
  display:flex;
  align-items:center;
  gap:12px;
  margin-top:10px;
}
.hist-toolbar__left,
.hist-toolbar__right{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.hist-toolbar__right{
  margin-left:auto;
}
@media (max-width: 720px){
  .hist-toolbar{
    flex-direction:column;
    align-items:stretch;
  }
  .hist-toolbar__right{
    margin-left:0;
    justify-content:flex-start;
  }
}


/* Subtle emphasis for Undo action (danger-lite) */
.btn-undo{
  border-color: rgba(255, 99, 71, .45);
  color: #ffd6cf;
  background: linear-gradient(180deg, rgba(255,99,71,.10), rgba(255,99,71,.05));
}
.btn-undo:hover{
  border-color: rgba(255, 99, 71, .7);
  background: linear-gradient(180deg, rgba(255,99,71,.16), rgba(255,99,71,.08));
}
.btn-print{
  border-color: rgba(120, 160, 255, .45);
  color: #e8edff;
  background: linear-gradient(180deg, rgba(120,160,255,.10), rgba(120,160,255,.05));
}
.btn-print:hover{
  border-color: rgba(120, 160, 255, .7);
  background: linear-gradient(180deg, rgba(120,160,255,.16), rgba(120,160,255,.08));
}