/* ============ Pecka harmonogram — UI (LIGHT) ============ */

/* Paleta */
:root{
  --bg:#FFFFFF;         /* pozadí stránky */
  --panel:#FFFFFF;      /* karty/panely */
  --muted:#666666;      /* sekundární text */
  --text:#000000;       /* primární text */
  --line:#E6E6E6;       /* linky/rámečky */

  --accent:#FCC11E;     /* žlutá */
  --accent-2:#5E2281;   /* fialová */

  --radius:12px;
  --shadow:none;
}

/* Reset + základ */
*{ box-sizing:border-box }
html,body{ height:100% }
body{
  margin:0; background:var(--bg); color:var(--text);
  font-family:TheMix,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
}
a, a:visited{ color:var(--accent-2); text-decoration:none }
a:hover{ text-decoration:underline }

/* Layout */
.container{ max-width:1100px; margin:0 auto; padding:24px }
.page-wrap{ max-width:1100px; margin:0 auto; padding:16px 16px 24px }
.stack{ display:grid; gap:16px }
.row{ display:flex; gap:10px; flex-wrap:wrap; align-items:center }
.kv{ display:grid; grid-template-columns:120px 1fr; gap:6px 16px }

/* Hlavičky */
h1{ font-family:"Skaut-Bold",TheMix,sans-serif; margin:0 0 12px; font-size:28px }
h2{ margin:16px 0 8px; font-size:18px; color:var(--muted) }

/* Toolbar (vrchní lišta) */
.toolbar{
  display:flex; gap:8px; flex-wrap:wrap; align-items:center; justify-content:space-between;
}
.notice{ color:var(--muted); font-size:14px }

/* Karty, tabulky */
.card{
  background:var(--panel); border:1px solid var(--line);
  border-radius:var(--radius); box-shadow:var(--shadow);
  padding:16px;
}
table{ width:100%; border-collapse:collapse; table-layout:fixed }
th,td{ padding:10px; border-bottom:1px solid var(--line); vertical-align:top }
th{ text-align:left; color:var(--muted); font-weight:600 }
tr.clickable:hover td{ background:#F7F7FA }

/* Form prvky + tlačítka */
input,select,button,textarea{
  border-radius:10px; border:1px solid var(--line);
  background:#FFFFFF; color:#000000; padding:10px 12px; font:inherit;
}
button{ cursor:pointer; font-weight:700 }
button.primary{ background:var(--accent); border:0; color:#000 }
button.primary:active{ transform:none }
button.ghost{
  background:transparent; border:2px dashed var(--accent-2);
  color:var(--accent); font-weight:800;
}
button.ghost.danger{ border-color:#5E2281; color:#5E2281 }

/* Chip (odkaz/tlačítko s čárkovaným rámečkem) */
.chip{
  display:inline-flex; align-items:center; gap:8px;
  padding:8px 12px; border-radius:999px;
  background:transparent; color:var(--accent);
  border:2px dashed var(--accent-2); font-weight:800; text-decoration:none; white-space:nowrap;
}
.chip:hover{ opacity:.92 }
.chip:focus{ outline:3px solid #FCC11E55; outline-offset:2px }

/* „Sticky“ hlavička uvnitř karty (editor/public) */
.sticky-head{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:10px 16px; border-bottom:1px solid var(--line);
  background:var(--panel);
}
.sticky-head h1{
  font-family:"Skaut-Bold",TheMix,sans-serif;
  font-size:18px; margin:0; line-height:1.2; color:var(--text);
}
.links-bar{ display:flex; gap:10px; flex-wrap:nowrap; overflow-x:auto; margin-left:auto }

/* Kategorie / swatche */
.cat{ display:inline-flex; align-items:center; gap:6px }
.cat .swatch{ inline-size:10px; block-size:10px; border-radius:3px; border:1px solid rgba(0,0,0,.2) }

/* Časová osa (editor/public) – výchozí vzhled bez kategorie */
.day{ padding:10px 12px; border:1px solid var(--line); border-radius:10px; background:#FFF }
.day-timeline{ position:relative; border:1px solid var(--line); border-radius:12px; background:#FFF; padding:12px }
.lane-wrap{ position:relative }
.cluster{ position:absolute; left:0; right:0; pointer-events:none }
.event{
  position:absolute; padding:10px;
  border:2px solid var(--line); border-radius:12px; background:#FFFFFF;
  display:flex; flex-direction:column; gap:4px;
  box-sizing:border-box; overflow:hidden; pointer-events:auto;
}
.event .time{ font-weight:900; margin-bottom:2px; font-size:12px }
.event.selected{ outline:3px solid #FCC11E99 }
.time-scale{ position:absolute; left:-52px; top:0; bottom:0; width:44px; color:#888888; font-size:12px }
.time-scale div{ position:absolute; transform:translateY(-50%); white-space:nowrap }
kbd{ padding:2px 6px; border:1px solid var(--line); border-radius:6px; background:#F7F7FA; font-size:12px; color:#666 }

/* Utility */
hr{ border:0; border-top:1px solid var(--line); margin:16px 0 }

/* Patička = skrytá všude (podle přání) */
footer, .footer, .site-footer, #footer{ display:none !important }

/* Tisk – bílé pozadí, bez hlaviček/patiček, bloky se nedělí */
@media print{
  html,body{ background:#FFFFFF !important; color:#000000 !important }
  .no-print, .toolbar, .sticky-head, .links-bar{ display:none !important }
  a, a:visited{ color:#000000; text-decoration:none }
  .card{ border:0; padding:0 }
  .day{ border:0; padding:0; background:#FFF }
  .day-timeline{ border:0; padding:0 }

  /* A4 na výšku: necháme prohlížeč; hlavně zabránit dělení bloků */
  .event{
    break-inside: avoid;           /* modern */
    page-break-inside: avoid;      /* legacy */
  }
  footer, .footer, .site-footer, #footer{ display:none !important }
}

/* Responzivně skryj levý sloupec časové osy na malých šířkách */
@media (max-width:900px){
  .time-scale{ display:none }
}

/* Program titles everywhere (editor / public / print / TV) */
.event .title,
.now .title,
.next .title { font-weight: 900; }