/* Admin stylesheet. Served from admin/public through the Worker (see
   admin/wrangler.jsonc `run_worker_first`), under `style-src 'self'` — every
   look lives here, never in a style attribute. Colours are the public site's
   brand tokens (src/styles/tokens.css); red is used for actions on white, not
   as text on dark. */
:root {
  --cervena: #D80101;
  --cervena-hover: #C00000;
  --inkoust: #0E0E10;
  --text: #0E0E10;
  --text-tlumeny: #6B6B73;
  --okraj: #E4E4E8;
  --pozadi: #F8F8FA;
  --chyba-pozadi: #FDEDED;
  font-family: system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  color: var(--text);
  background: var(--pozadi);
}

* { box-sizing: border-box; }

body { margin: 0; line-height: 1.5; }

.hlavicka {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem 2rem;
  padding: 0.75rem 1.5rem;
  background: var(--inkoust);
  color: #fff;
}

.hlavicka a { color: #fff; }
.hlavicka__znacka { font-weight: 700; text-decoration: none; }
.hlavicka__nav { display: flex; gap: 1rem; flex: 1; }
.hlavicka__ucet { display: flex; align-items: center; gap: 1rem; }
.hlavicka__ucet form { margin: 0; }

.obsah {
  max-width: 48rem;
  margin: 2rem auto;
  padding: 0 1.5rem;
}

h1 { font-size: 1.75rem; margin: 0 0 1rem; }

.formular {
  display: grid;
  gap: 0.5rem;
  max-width: 26rem;
  padding: 1.5rem;
  background: #fff;
  border: 1px solid var(--okraj);
  border-radius: 8px;
}

.formular label { font-weight: 600; margin-top: 0.5rem; }

.formular input {
  font: inherit;
  padding: 0.6rem 0.75rem;
  border: 1px solid #CCCCCC;
  border-radius: 6px;
}

.formular input:focus-visible,
.tlacitko:focus-visible { outline: 3px solid var(--inkoust); outline-offset: 2px; }

.napoveda { margin: 0; color: var(--text-tlumeny); font-size: 0.9rem; }

.cf-turnstile { margin: 0.75rem 0; min-height: 65px; }

.tlacitko {
  display: inline-block;
  font: inherit;
  font-weight: 600;
  padding: 0.6rem 1.25rem;
  border: 0;
  border-radius: 6px;
  background: var(--cervena);
  color: #fff;
  text-decoration: none;
  cursor: pointer;
}

.tlacitko:hover { background: var(--cervena-hover); }
.tlacitko[disabled] { opacity: 0.6; cursor: progress; }

.tlacitko--vedlejsi {
  background: transparent;
  color: #fff;
  border: 1px solid #fff;
  padding: 0.35rem 0.9rem;
}

.tlacitko--vedlejsi:hover { background: #2E2E2E; }

.hlaska { padding: 0.75rem 1rem; border-radius: 6px; max-width: 26rem; }
.hlaska--chyba { background: var(--chyba-pozadi); border: 1px solid var(--cervena); }

/* Photo editor (admin.js, input[data-obrazek]): a preview canvas the editor
   clicks on, turn buttons and the finished result. */
.obrazek-editor { display: grid; gap: 0.75rem; margin-top: 0.5rem; }
.obrazek-editor[hidden],
.obrazek-editor__vysledek[hidden] { display: none; }
.obrazek-editor__platno {
  width: 100%;
  max-width: 45rem;
  height: auto;
  border: 1px solid var(--okraj);
  border-radius: 6px;
  cursor: crosshair;
  background: #fff;
}
.obrazek-editor__platno:focus-visible { outline: 3px solid var(--inkoust); outline-offset: 2px; }
.obrazek-editor__tlacitka { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.obrazek-editor__vysledek { max-width: 16rem; height: auto; border: 1px solid var(--okraj); border-radius: 6px; }

/* Section pages (Task 11 on): lists, wide forms, drafts. */
.vizualne-skryte {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

.rozcestnik { padding-left: 1.25rem; }

.tabulka {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
  border: 1px solid var(--okraj);
  margin: 1rem 0;
}
.tabulka th,
.tabulka td { padding: 0.6rem 0.75rem; text-align: left; border-bottom: 1px solid var(--okraj); vertical-align: top; }
.tabulka th { font-size: 0.9rem; color: var(--text-tlumeny); }

.formular--siroky { max-width: 45rem; }
.formular textarea {
  font: inherit;
  padding: 0.6rem 0.75rem;
  border: 1px solid #CCCCCC;
  border-radius: 6px;
  resize: vertical;
  width: 100%;
}
.formular textarea:focus-visible,
.formular input:focus-visible { outline: 3px solid var(--inkoust); outline-offset: 2px; }
.formular input[type="checkbox"] { padding: 0; width: 1.1rem; height: 1.1rem; }
.formular input[type="file"] { border: 0; padding: 0.25rem 0; }

.formular__skupina {
  display: grid;
  gap: 0.5rem;
  margin: 0.75rem 0 0;
  padding: 0.75rem 1rem 1rem;
  border: 1px solid var(--okraj);
  border-radius: 6px;
}
.formular__skupina legend { font-weight: 600; padding: 0 0.25rem; }
.formular__fotka { margin: 0; }
.formular__fotka img { max-width: 16rem; height: auto; border: 1px solid var(--okraj); border-radius: 6px; display: block; }

.formular .zaskrtavatko,
.zaskrtavatko { display: flex; align-items: center; gap: 0.5rem; font-weight: 400; }

.formular__tlacitka { display: flex; flex-wrap: wrap; gap: 0.75rem; align-items: center; margin-top: 0.75rem; }
.formular__smazat { margin: 1.5rem 0 0; }

/* A secondary button on a light background (.tlacitko--vedlejsi is for the dark header). */
.tlacitko--obrys { background: #fff; color: var(--inkoust); border: 1px solid var(--inkoust); }
.tlacitko--obrys:hover { background: var(--pozadi); }
.tlacitko--nebezpecne { background: #fff; color: var(--cervena); border: 1px solid var(--cervena); }
.tlacitko--nebezpecne:hover { background: var(--chyba-pozadi); }
.tlacitko--male { padding: 0.3rem 0.75rem; font-size: 0.9rem; }

/* Coach list: the row buttons (each in its own small form) sit side by side. */
.tabulka__akce { display: flex; flex-wrap: wrap; gap: 0.4rem; align-items: center; }
.radkova-akce { margin: 0; }

.markdown-lista { display: flex; flex-wrap: wrap; gap: 0.5rem; }

.koncept {
  max-width: 45rem;
  margin: 0 0 1rem;
  padding: 0.75rem 1rem;
  border: 1px solid var(--inkoust);
  border-radius: 6px;
  background: #fff;
}
.koncept p { margin: 0; }

.hlaska ul { margin: 0.25rem 0 0; padding-left: 1.25rem; }
.hlaska p { margin: 0; }
.hlaska { margin-bottom: 1rem; }

/* The „Kempy“ date rows. [hidden] needs its own rule: .tlacitko sets display. */
.tlacitko[hidden] { display: none; }
.terminy { display: grid; gap: 0.5rem; margin-top: 0.75rem; }
.terminy__nadpis { font-size: 1.1rem; margin: 0; }
.terminy__radek .tlacitko { justify-self: start; margin-top: 0.5rem; }

/* Settings forms: opening-hours rows, the live bar preview, the link picker. */
.formular select {
  font: inherit;
  padding: 0.6rem 0.75rem;
  border: 1px solid #CCCCCC;
  border-radius: 6px;
  background: #fff;
}
.formular select:focus-visible { outline: 3px solid var(--inkoust); outline-offset: 2px; }
.formular input[aria-invalid="true"],
.formular select[aria-invalid="true"] { border-color: var(--cervena); }
.chyba-pole { margin: 0; color: var(--cervena); font-size: 0.9rem; font-weight: 600; }

.radek-doby {
  margin: 0.5rem 0 0;
  padding: 0.5rem 1rem 1rem;
  border: 1px solid var(--okraj);
  border-radius: 6px;
}
.radek-doby legend { font-weight: 600; padding: 0 0.25rem; }
.radek-doby__pole { display: flex; flex-wrap: wrap; gap: 0.75rem 1rem; }
.radek-doby__pole > div { display: grid; gap: 0.25rem; }

.nahled-listy {
  margin-top: 0.75rem;
  padding: 0.75rem 1rem;
  border: 1px dashed var(--okraj);
  border-radius: 6px;
  background: var(--pozadi);
}
.nahled-listy p { margin: 0; }
.nahled-listy__nadpis { font-size: 0.9rem; color: var(--text-tlumeny); }
.nahled-listy__text { font-weight: 700; min-height: 1.5em; }
.nahled-listy--moc .nahled-listy__text,
.nahled-listy--moc [data-nahled-pocet] { color: var(--cervena); }

.odkaz-vyber { display: grid; gap: 0.5rem; }
.odkaz-vyber[hidden],
.odkaz-vyber__url[hidden] { display: none; }
.odkaz-vyber__url { display: grid; gap: 0.5rem; }

/* Overview: a tile per section, and the latest changes. */
.dlazdice {
  list-style: none;
  margin: 1rem 0 1.5rem;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
  gap: 0.75rem;
}
.dlazdice__odkaz {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  height: 100%;
  padding: 1rem;
  background: #fff;
  border: 1px solid var(--okraj);
  border-radius: 6px;
  color: var(--text);
  text-decoration: none;
}
.dlazdice__odkaz strong { font-size: 1.1rem; }
.dlazdice__odkaz span { color: var(--text-tlumeny); font-size: 0.9rem; }
.dlazdice__odkaz:hover { border-color: var(--cervena); }
.dlazdice__odkaz:focus-visible { outline: 3px solid var(--inkoust); outline-offset: 2px; }

/* Only the overview's section headings; the other pages style their own. */
.prehled h2 { font-size: 1.25rem; margin: 1.5rem 0 0.5rem; }
.zmeny { list-style: none; margin: 0 0 1rem; padding: 0; }
.zmeny li { padding: 0.4rem 0; border-bottom: 1px solid var(--okraj); }
.zmeny__kdy { color: var(--text-tlumeny); margin-right: 0.5rem; white-space: nowrap; }

/* The „Ukládáme…“ page: the live status line written by admin.js. */
.stav-zmeny__stav { font-weight: 600; }
.stav-zmeny__stav:empty { display: none; }
.tabulka form { margin: 0; }

/* The reception guide (GET /navod): a comfortable reading width. */
.navod {
  max-width: 46rem;
}
.navod h2 {
  margin-top: 2rem;
}