/*
 * Brani Public API – vizuální téma dokumentace.
 *
 * Barvy, písmo a zaoblení vychází z brani.cz (Poppins, růžová #fe019a,
 * žlutá #e8df55, navy #132d44). Scalar API Reference se stylují přes
 * CSS proměnné `--scalar-*`; přebíjíme je vyšší specificitou, protože
 * Scalar vkládá vlastní styly až za runtime.
 */

:root {
  --brani-pink: #fe019a;
  --brani-pink-light: #ffe3f8;
  --brani-pink-dark: #5e0030;
  --brani-yellow: #e8df55;
  --brani-yellow-light: #f6f7ca;
  --brani-yellow-hover: #f2e858;
  --brani-navy: #132d44;
  --brani-navy-2: #0f2136;
  --brani-navy-3: #1c3a56;
  --brani-ink: #000;
  --brani-ink-2: #254551;
  --brani-ink-3: #435a63;
  --brani-ink-4: #647880;
  --brani-line: #dee4e5;
  --brani-bg-50: #fafbfb;
  --brani-bg-100: #eef4f6;
  --brani-teal: #087a7d;
  --brani-blue: #3232ff;

  --brani-font: "Poppins", system-ui, -apple-system, "Segoe UI", sans-serif;
  --brani-font-code: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  --brani-header-height: 64px;
  --scalar-custom-header-height: var(--brani-header-height);
}

html,
body {
  margin: 0;
  padding: 0;
  background: #fff;
  font-family: var(--brani-font);
  -webkit-font-smoothing: antialiased;
}

/* ------------------------------------------------------------------ */
/* Hlavička                                                            */
/* ------------------------------------------------------------------ */

.brani-header {
  position: sticky;
  top: 0;
  z-index: 1000;
  box-sizing: border-box;
  height: var(--brani-header-height);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  padding: 0 1.5rem;
  background: #fff;
  border-bottom: 1px solid var(--brani-line);
}

.brani-header::before {
  /* tenký akcentní proužek v barvách značky */
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 3px;
  background: linear-gradient(90deg, var(--brani-pink) 0%, var(--brani-pink) 55%, var(--brani-yellow) 100%);
}

.brani-header__brand {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  color: var(--brani-ink);
  text-decoration: none;
}

.brani-header__brand img {
  display: block;
  height: 24px;
  width: auto;
}

.brani-header__brand .logo-dark {
  display: none;
}

.brani-header__badge {
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--brani-pink-dark);
  background: var(--brani-pink-light);
  border-radius: 999px;
  padding: 0.25rem 0.625rem;
  line-height: 1;
}

.brani-header__nav {
  display: flex;
  align-items: center;
  gap: 1.25rem;
}

.brani-header__nav a {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--brani-ink-3);
  text-decoration: none;
  transition: color 0.15s;
}

.brani-header__nav a:hover {
  color: var(--brani-pink);
}

.brani-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 2.5rem;
  padding: 0 1.125rem;
  border: 2px solid var(--brani-yellow);
  border-radius: 0.375rem;
  background: var(--brani-yellow);
  color: var(--brani-ink) !important;
  font-weight: 700 !important;
  transition: background-color 0.2s, border-color 0.2s, transform 0.15s;
}

.brani-btn:hover {
  background: var(--brani-yellow-hover);
  border-color: var(--brani-yellow-hover);
  color: var(--brani-ink) !important;
  transform: translateY(-1px);
}

@media (max-width: 720px) {
  .brani-header {
    padding: 0 1rem;
  }
  .brani-header__nav a:not(.brani-btn) {
    display: none;
  }
}

/* ------------------------------------------------------------------ */
/* Fallback, když se nepodaří načíst Scalar z CDN                       */
/* ------------------------------------------------------------------ */

.brani-fallback {
  max-width: 44rem;
  margin: 4rem auto;
  padding: 0 1.5rem;
  color: var(--brani-ink-2);
  line-height: 1.6;
}

.brani-fallback h1 {
  font-size: 1.75rem;
  letter-spacing: -0.02em;
  margin-bottom: 0.5rem;
}

.brani-fallback a {
  color: var(--brani-pink);
}

/* ------------------------------------------------------------------ */
/* Scalar – světlý režim                                                */
/* ------------------------------------------------------------------ */

html .light-mode,
html.light-mode,
body .light-mode {
  --scalar-font: var(--brani-font);
  --scalar-font-code: var(--brani-font-code);

  --scalar-radius: 0.375rem;
  --scalar-radius-lg: 0.75rem;
  --scalar-radius-xl: 1.25rem;

  --scalar-background-1: #ffffff;
  --scalar-background-2: var(--brani-bg-50);
  --scalar-background-3: var(--brani-bg-100);
  --scalar-background-accent: var(--brani-pink-light);

  --scalar-color-1: var(--brani-ink);
  --scalar-color-2: var(--brani-ink-3);
  --scalar-color-3: var(--brani-ink-4);
  --scalar-color-accent: var(--brani-pink);

  --scalar-border-color: var(--brani-line);

  --scalar-button-1: var(--brani-yellow);
  --scalar-button-1-color: var(--brani-ink);
  --scalar-button-1-hover: var(--brani-yellow-hover);

  --scalar-color-green: var(--brani-teal);
  --scalar-color-blue: var(--brani-blue);
  --scalar-color-orange: #d96b00;
  --scalar-color-purple: #6f3ad6;
  --scalar-color-red: #d0263d;
  --scalar-color-yellow: #a88b00;

  --scalar-scrollbar-color: rgba(19, 45, 68, 0.18);
  --scalar-scrollbar-color-active: rgba(19, 45, 68, 0.36);

  --scalar-sidebar-background-1: var(--brani-bg-50);
  --scalar-sidebar-color-1: var(--brani-navy);
  --scalar-sidebar-color-2: var(--brani-ink-3);
  --scalar-sidebar-color-active: var(--brani-pink-dark);
  --scalar-sidebar-border-color: var(--brani-line);
  --scalar-sidebar-item-hover-color: var(--brani-navy);
  --scalar-sidebar-item-hover-background: var(--brani-bg-100);
  --scalar-sidebar-item-active-background: var(--brani-pink-light);
  --scalar-sidebar-search-background: #ffffff;
  --scalar-sidebar-search-border-color: var(--brani-line);
  --scalar-sidebar-search-color: var(--brani-ink-3);
}

/* ------------------------------------------------------------------ */
/* Scalar – tmavý režim (navy z brani.cz)                              */
/* ------------------------------------------------------------------ */

html .dark-mode,
html.dark-mode,
body .dark-mode {
  --scalar-font: var(--brani-font);
  --scalar-font-code: var(--brani-font-code);

  --scalar-radius: 0.375rem;
  --scalar-radius-lg: 0.75rem;
  --scalar-radius-xl: 1.25rem;

  --scalar-background-1: var(--brani-navy-2);
  --scalar-background-2: var(--brani-navy);
  --scalar-background-3: var(--brani-navy-3);
  --scalar-background-accent: rgba(254, 1, 154, 0.16);

  --scalar-color-1: #ffffff;
  --scalar-color-2: #c5cee4;
  --scalar-color-3: #8fa3b3;
  --scalar-color-accent: #ff4fb8;

  --scalar-border-color: #27455f;

  --scalar-button-1: var(--brani-yellow);
  --scalar-button-1-color: var(--brani-ink);
  --scalar-button-1-hover: var(--brani-yellow-hover);

  --scalar-color-green: #4fd1c5;
  --scalar-color-blue: #7b8cff;
  --scalar-color-orange: #ffa64d;
  --scalar-color-purple: #b794f6;
  --scalar-color-red: #ff6b7a;
  --scalar-color-yellow: var(--brani-yellow);

  --scalar-scrollbar-color: rgba(255, 255, 255, 0.16);
  --scalar-scrollbar-color-active: rgba(255, 255, 255, 0.32);

  --scalar-sidebar-background-1: #0b1826;
  --scalar-sidebar-color-1: #ffffff;
  --scalar-sidebar-color-2: #b6c3d4;
  --scalar-sidebar-color-active: var(--brani-yellow);
  --scalar-sidebar-border-color: #27455f;
  --scalar-sidebar-item-hover-color: #ffffff;
  --scalar-sidebar-item-hover-background: rgba(255, 255, 255, 0.06);
  --scalar-sidebar-item-active-background: rgba(232, 223, 85, 0.14);
  --scalar-sidebar-search-background: rgba(255, 255, 255, 0.06);
  --scalar-sidebar-search-border-color: #27455f;
  --scalar-sidebar-search-color: #b6c3d4;
}

/* hlavička v tmavém režimu */
html.dark-mode .brani-header,
body.dark-mode .brani-header,
.dark-mode .brani-header {
  background: #0b1826;
  border-bottom-color: #27455f;
}

html.dark-mode .brani-header__brand .logo-light,
body.dark-mode .brani-header__brand .logo-light,
.dark-mode .brani-header__brand .logo-light {
  display: none;
}

html.dark-mode .brani-header__brand .logo-dark,
body.dark-mode .brani-header__brand .logo-dark,
.dark-mode .brani-header__brand .logo-dark {
  display: block;
}

html.dark-mode .brani-header__nav a,
body.dark-mode .brani-header__nav a,
.dark-mode .brani-header__nav a {
  color: #c5cee4;
}

html.dark-mode .brani-header__badge,
body.dark-mode .brani-header__badge,
.dark-mode .brani-header__badge {
  color: #ffd1ec;
  background: rgba(254, 1, 154, 0.22);
}

/* ------------------------------------------------------------------ */
/* Drobné typografické doladění obsahu (markdown v popisech)           */
/* ------------------------------------------------------------------ */

.scalar-app h1,
.scalar-app h2,
.scalar-app h3 {
  letter-spacing: -0.02em;
}

.scalar-app .markdown table {
  font-size: 0.875rem;
}

.scalar-app .markdown blockquote {
  border-left: 3px solid var(--brani-yellow);
  background: var(--scalar-background-2);
  border-radius: 0 var(--scalar-radius) var(--scalar-radius) 0;
}

/* Scalar nabízí v patičce menu „Generate MCP“ (jejich hostovaná služba) – pro naši dokumentaci nechceme.
   AI agenta („Ask AI“) a Developer Tools vypíná konfigurace v index.html. */
.scalar-app .scalar-mcp-layer {
  display: none !important;
}