/* ===== KI-Rundschau Brand Customization for Headline Theme ===== */

:root {
  /* Brand colors override Headline */
  --color-primary: #1A2B4A;
  --color-accent: #B8543B;
  --color-bg: #FFFFFF;
  --color-darkgrey: #1A2B4A;
  --color-midgrey: #6B6B6B;
  --color-lightgrey: #E6E2DA;
  --color-border: #E6E2DA;

  --kir-ink: #1A2B4A;
  --kir-accent: #B8543B;
  --kir-cream: #FAF7F0;
  --kir-text: #1F1F1F;
  --kir-muted: #6B6B6B;
}

/* Dark Mode via system preference + toggle */
:root[data-kir-theme="dark"] {
  --color-primary: #E07B5B;
  --color-accent: #E07B5B;
  --color-bg: #0F1620;
  --color-darkgrey: #E6E2DA;
  --color-midgrey: #9DA8BC;
  --color-lightgrey: #2A3D60;
  --color-border: #2A3D60;
  --kir-ink: #E6E2DA;
  --kir-accent: #E07B5B;
  --kir-cream: #1A2030;
  --kir-text: #E6E2DA;
  --kir-muted: #9DA8BC;
}
:root[data-kir-theme="dark"] body {
  background-color: #0F1620 !important;
  color: #E6E2DA;
}
:root[data-kir-theme="dark"] .gh-head {
  background-color: #0F1620 !important;
  border-bottom-color: #2A3D60 !important;
}
:root[data-kir-theme="dark"] .gh-card, :root[data-kir-theme="dark"] .gh-loop-card {
  background-color: #1A2030 !important;
  border-color: #2A3D60 !important;
}
:root[data-kir-theme="dark"] .gh-card-title, :root[data-kir-theme="dark"] h1, :root[data-kir-theme="dark"] h2, :root[data-kir-theme="dark"] h3 { color: #E6E2DA !important; }
:root[data-kir-theme="dark"] input[type="email"] { background: #1A2030 !important; color: #E6E2DA !important; border-color: #2A3D60 !important; }

/* Brand-accent override */
.is-head-brand,
.gh-burger:checked ~ .gh-head,
.gh-topic-name a:hover,
.gh-topic-link:hover {
  color: var(--kir-accent);
}

/* Vergleichstabelle (.kir-table) */
table.kir-table {
  width: 100% !important;
  border-collapse: collapse !important;
  font-size: 0.92rem;
  margin: 2em 0;
  border: 1px solid var(--color-border);
  table-layout: auto;
}
table.kir-table thead {
  background: var(--kir-ink) !important;
  color: #fff !important;
}
table.kir-table th {
  padding: 0.85em 1em;
  text-align: left;
  font-weight: 700;
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #fff !important;
  background: var(--kir-ink) !important;
}
table.kir-table td {
  padding: 0.95em 1em;
  border-bottom: 1px solid var(--color-border);
  vertical-align: middle;
}
table.kir-table tbody tr:hover td { background: var(--kir-cream); }
table.kir-table td:first-child { font-weight: 700; color: var(--kir-ink); }
@media (max-width: 800px) {
  table.kir-table { display: block; overflow-x: auto; }
}

/* /go/ button */
a.kir-go {
  display: inline-block !important;
  padding: 0.55em 1.05em !important;
  background: var(--kir-ink) !important;
  color: #fff !important;
  border-radius: 4px !important;
  font-weight: 600 !important;
  font-size: 0.85rem !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  border: none !important;
  transition: background 0.15s;
}
a.kir-go:hover { background: var(--kir-accent) !important; }
a.kir-go-secondary {
  background: transparent !important;
  color: var(--kir-ink) !important;
  border: 1.5px solid var(--kir-ink) !important;
}
a.kir-go-secondary:hover { background: var(--kir-ink) !important; color: #fff !important; }
:root[data-kir-theme="dark"] a.kir-go { background: var(--kir-accent) !important; color: #0F1620 !important; }
:root[data-kir-theme="dark"] a.kir-go:hover { background: #F09373 !important; }

/* TOC */
.kir-toc { margin: 2em 0; padding: 1.5em 1.75em; background: var(--kir-cream); border-radius: 8px; font-size: 0.95rem; }
.kir-toc-title { margin: 0 0 0.8em; font-size: 1.05rem; color: var(--kir-ink); font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; }
.kir-toc ol { margin: 0; padding-left: 1.4em; }
.kir-toc li { margin: 0.3em 0; line-height: 1.5; }
.kir-toc a { color: var(--kir-ink); }
.kir-toc a:hover { color: var(--kir-accent); }

/* Author Box */
.kir-author-box {
  margin: 3em 0 1em;
  padding: 1.75em 2em;
  background: var(--kir-cream);
  border: 1px solid var(--color-border);
  border-radius: 8px;
  display: flex; gap: 1.5em; align-items: flex-start;
}
.kir-author-avatar {
  flex-shrink: 0; width: 80px; height: 80px;
  border-radius: 50%; background: var(--kir-ink);
  color: #fff; display: flex; align-items: center; justify-content: center;
  font-size: 1.8rem; font-weight: 700;
}
.kir-author-name { margin: 0 0 0.2em; font-size: 1.25rem; font-weight: 700; color: var(--kir-ink); }
.kir-author-role { margin: 0 0 0.6em; font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--kir-accent); font-weight: 700; }
.kir-author-bio { margin: 0 0 0.6em; font-size: 0.97rem; line-height: 1.55; color: var(--kir-text); }
.kir-author-links a { display: inline-block; margin-right: 1em; font-size: 0.88rem; font-weight: 600; color: var(--kir-ink); }

/* Theme toggle */
.kir-theme-toggle {
  position: fixed; bottom: 1.25em; right: 1.25em;
  width: 44px; height: 44px; border-radius: 50%;
  background: var(--kir-ink); color: #fff;
  border: none; cursor: pointer; z-index: 999;
  box-shadow: 0 4px 14px -4px rgba(0,0,0,0.3);
  display: flex; align-items: center; justify-content: center;
  font-size: 1.2rem; transition: transform 0.15s, background 0.15s;
}
.kir-theme-toggle:hover { transform: scale(1.05); background: var(--kir-accent); }
:root[data-kir-theme="dark"] .kir-theme-toggle { background: var(--kir-accent); color: #0F1620; }

/* Skip-link */
.kir-skip-link {
  position: absolute; top: -100px; left: 0;
  background: var(--kir-ink); color: #fff;
  padding: 0.75em 1.25em; font-weight: 600;
  z-index: 100; text-decoration: none;
}
.kir-skip-link:focus { top: 0; }

/* ROI Calculator */
.kir-roi-calc {
  margin: 2.5em 0;
  padding: 2em;
  background: var(--kir-cream);
  border: 1px solid var(--color-border);
  border-radius: 12px;
}
.kir-roi-calc h3 {
  margin: 0 0 0.4em;
  font-size: 1.5rem;
  color: var(--kir-ink);
  font-weight: 700;
}
.kir-roi-calc .sub { margin: 0 0 1.5em; color: var(--kir-muted); font-size: 0.95rem; }
.kir-roi-calc .row { display: grid; grid-template-columns: 1fr auto; gap: 1em; align-items: center; margin: 1em 0; }
.kir-roi-calc label { font-weight: 600; color: var(--kir-ink); }
.kir-roi-calc input[type="range"] { width: 100%; accent-color: var(--kir-accent); }
.kir-roi-calc .val { font-family: 'Fraunces', Georgia, serif; font-size: 1.4rem; font-weight: 700; color: var(--kir-ink); min-width: 100px; text-align: right; }
.kir-roi-calc .results { margin-top: 1.5em; padding-top: 1.5em; border-top: 1px solid var(--color-border); }
.kir-roi-calc .result-row { display: flex; justify-content: space-between; padding: 0.5em 0; font-size: 1.05rem; }
.kir-roi-calc .result-row.total { padding-top: 1em; border-top: 2px solid var(--kir-ink); margin-top: 0.5em; font-size: 1.3rem; font-weight: 700; color: var(--kir-ink); }
.kir-roi-calc .result-row .label { color: var(--kir-text); }
.kir-roi-calc .result-row .value { font-family: 'Fraunces', Georgia, serif; font-weight: 700; }
.kir-roi-calc .result-row.positive .value { color: #2E7D32; }

/* Focus indicators */
:focus-visible {
  outline: 3px solid var(--kir-accent) !important;
  outline-offset: 2px;
  border-radius: 4px;
}