/* ==========================================================================
   OKNA.EU — souhlas s cookies (okc-)
   Sdílený systémový prvek jako navbar a patička: objevuje se na všech
   vrstvách (core, av2, bf), proto je záměrně NEUTRÁLNÍ — inkoust, bílá,
   slate. Žádná modrá, žádná zlatá, aby se vrstvy nekřížily.
   Hodnoty odpovídají ok-ui tokenům, ale deklarují se lokálně, aby prvek
   nezávisel na načtení ok-ui.css.
   ========================================================================== */

.okc-root {
  --okc-ink: #0f172a;
  --okc-text: #334155;
  --okc-muted: #64748b;
  --okc-line: #e2e8f0;
  --okc-bg: #ffffff;
  --okc-bg-tint: #f6f8fb;
  --okc-r-card: 16px;
  --okc-r-control: 12px;
  --okc-shadow: 0 10px 30px rgba(15, 23, 42, .13), 0 2px 8px rgba(15, 23, 42, .06);

  position: fixed;
  z-index: 2147483000;          /* nad navbarem i nad mapami */
  left: 24px;
  bottom: 24px;
  width: min(460px, calc(100vw - 48px));
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  opacity: 0;
  transform: translateY(12px);
  transition: opacity .28s ease, transform .28s ease;
}

.okc-root.is-open { opacity: 1; transform: none; }

.okc-card {
  background: var(--okc-bg);
  border: 1px solid var(--okc-line);
  border-radius: var(--okc-r-card);
  box-shadow: var(--okc-shadow);
  overflow: hidden;
}

.okc-body { padding: 24px; }

.okc-title {
  margin: 0 0 8px;
  font-size: 1.125rem;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -.02em;
  color: var(--okc-ink);
}

.okc-lead {
  margin: 0;
  font-size: .9375rem;
  line-height: 1.6;
  color: var(--okc-text);
}

.okc-policy { white-space: nowrap; color: var(--okc-ink); text-decoration: underline; text-underline-offset: 2px; }
.okc-policy:hover { color: var(--okc-muted); }

/* ---------- kategorie ---------- */

.okc-details {
  margin-top: 20px;
  border-top: 1px solid var(--okc-line);
  max-height: min(46vh, 420px);
  overflow-y: auto;
}

.okc-cat { padding: 16px 0; border-bottom: 1px solid var(--okc-line); }
.okc-cat:last-child { border-bottom: 0; padding-bottom: 4px; }

.okc-cat__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }

.okc-cat__name { font-size: .9375rem; font-weight: 600; color: var(--okc-ink); }

.okc-cat__always {
  font-size: .75rem;
  font-weight: 600;
  color: var(--okc-muted);
  background: var(--okc-bg-tint);
  border-radius: 999px;
  padding: 3px 10px;
  white-space: nowrap;
}

.okc-cat__desc {
  margin: 8px 0 0;
  font-size: .8125rem;
  line-height: 1.55;
  color: var(--okc-muted);
}

/* ---------- přepínač ---------- */

.okc-switch { display: flex; align-items: center; gap: 10px; cursor: pointer; }
.okc-switch input { position: absolute; opacity: 0; width: 0; height: 0; }

.okc-switch__track {
  flex: none;
  width: 38px;
  height: 22px;
  border-radius: 999px;
  background: #cbd5e1;
  position: relative;
  transition: background .2s ease;
}

.okc-switch__track::after {
  content: "";
  position: absolute;
  top: 2px; left: 2px;
  width: 18px; height: 18px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 3px rgba(15, 23, 42, .25);
  transition: transform .2s ease;
}

.okc-switch input:checked + .okc-switch__track { background: var(--okc-ink); }
.okc-switch input:checked + .okc-switch__track::after { transform: translateX(16px); }
.okc-switch input:disabled + .okc-switch__track { background: #94a3b8; }
.okc-switch input:disabled ~ .okc-cat__name { color: var(--okc-muted); }
.okc-switch input:disabled { cursor: default; }
.okc-switch:has(input:disabled) { cursor: default; }

.okc-switch input:focus-visible + .okc-switch__track {
  outline: 2px solid var(--okc-ink);
  outline-offset: 2px;
}

/* ---------- akce ---------- */

.okc-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 20px;
}

.okc-btn {
  appearance: none;
  border: 1px solid transparent;
  border-radius: 999px;          /* pilulka = jen tlačítka */
  padding: 10px 18px;
  font: inherit;
  font-size: .875rem;
  font-weight: 600;
  line-height: 1.2;
  cursor: pointer;
  transition: background .18s ease, border-color .18s ease, color .18s ease;
}

.okc-btn:focus-visible { outline: 2px solid var(--okc-ink); outline-offset: 2px; }

.okc-btn--primary { background: var(--okc-ink); color: #fff; margin-left: auto; }
.okc-btn--primary:hover { background: #1e293b; }

.okc-btn--secondary { background: #fff; color: var(--okc-ink); border-color: #cbd5e1; }
.okc-btn--secondary:hover { border-color: var(--okc-ink); }

.okc-btn--ghost { background: transparent; color: var(--okc-muted); padding-left: 4px; padding-right: 4px; }
.okc-btn--ghost:hover { color: var(--okc-ink); }

/* „Odmítnout" a „Přijmout" musí mít stejnou váhu — sekundární tlačítko
   nesmí být opticky potlačené proti primárnímu. */
.okc-btn--secondary { min-width: 120px; }
.okc-btn--primary { min-width: 120px; }

/* V rozbaleném nastavení jsou čtyři akce. Na jeden řádek se nevejdou, takže
   místo náhodného zalomení drží záměrnou mřížku 2×2:
   Zpět | Uložit výběr  /  Odmítnout vše | Přijmout vše */
.okc-root.is-details .okc-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
}
.okc-root.is-details .okc-btn { min-width: 0; margin-left: 0; }
.okc-root.is-details .okc-btn--ghost { justify-self: start; }

/* ---------- mobil ---------- */

@media (max-width: 640px) {
  .okc-root {
    left: 0; right: 0; bottom: 0;
    width: 100%;
  }
  .okc-card {
    border-radius: var(--okc-r-card) var(--okc-r-card) 0 0;
    border-left: 0; border-right: 0; border-bottom: 0;
  }
  .okc-body { padding: 20px; }
  .okc-actions > .okc-btn--primary,
  .okc-actions > .okc-btn--secondary { flex: 1 1 auto; margin-left: 0; }
  .okc-btn--ghost { order: 3; width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .okc-root { transition: none; opacity: 1; transform: none; }
  .okc-switch__track, .okc-switch__track::after, .okc-btn { transition: none; }
}