/*
 * KiP MediArchiv 0.4.1 – gemeinsame Gestaltung
 * Ziel: Wartungsprojekt maint-0.4, Style -> projektweites Custom CSS.
 * ERGÄNZEN: bestehendes Custom CSS bewahren; diesen Block am Ende einfügen.
 * Bei späteren Updates nur diesen gekennzeichneten KiP-Block ERSETZEN.
 * Assets: Custom Files -> Ordner kip-brand/ mit Schrift und Logo anlegen.
 * Keine generierten CSS-Dateien bearbeiten; keine statischen Item-IDs.
 */

@font-face {
  font-family: "KiP Roboto Flex";
  src: url("/kip-brand/roboto-flex-latin.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

:root {
  /* Zentral anpassbar: Schriftfamilien und Größen. */
  --kip-font-body: "KiP Roboto Flex", Arial, sans-serif;
  --kip-font-heading: var(--kip-font-body);
  --kip-size-body: 15px;
  --kip-size-grid: 15px;
  --kip-size-navigation: 15px;
  --kip-size-heading-1: 30px;
  --kip-size-heading-2: 26px;
  --kip-size-heading-3: 22px;
  --kip-line-height: 1.55;

  /* Originale Websitefarben plus kontrastreiche Logo-/Bedienfarben. */
  --kip-ink: #223046;
  --kip-green: #5fac81;
  --kip-link: #046935;
  --kip-muted: #5f7391;
  --kip-surface: #ffffff;
  --kip-background: #fdfeff;
  --kip-soft: #eaf4ee;
  --kip-row: #f7faf8;
  --kip-border: #d4dfd8;
  --kip-focus: #0b3e81;
  --kip-match: #fff0cf;
}

body {
  font-family: var(--kip-font-body);
  font-size: var(--kip-size-body);
  line-height: var(--kip-line-height);
  color: var(--kip-ink);
  background-color: var(--kip-background);
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: var(--kip-font-heading);
  color: var(--kip-ink);
  line-height: 1.25;
}
h1, .h1 { font-size: var(--kip-size-heading-1); }
h2, .h2 { font-size: var(--kip-size-heading-2); }
h3, .h3 { font-size: var(--kip-size-heading-3); }
.btn, .form-control, input, select, textarea, button, .tooltip, .popover,
.r-vbar-page .r-left, .r-leftbar-top-page > .r-under .r-left,
.r-grid-cards [data-field-style="title"],
.r-grid-cards [data-field-style="subtitle"],
.r-grid-cards [data-field-style="price"] {
  font-family: var(--kip-font-body);
}
.form-control {
  color: var(--kip-ink);
  border-color: var(--kip-border);
}
.form-control:focus {
  border-color: var(--kip-link);
  box-shadow: 0 0 0 2px var(--kip-soft);
}
a { color: var(--kip-link); }
a:hover, a:focus { color: var(--kip-ink); }
a:focus-visible, button:focus-visible, .btn:focus-visible,
input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 3px solid var(--kip-focus);
  outline-offset: 3px;
}

/* Heller Kopf wie auf redaktion-kip.de; keine Layout-/Sticky-Änderung. */
.navbar.navbar-default {
  background-color: var(--kip-surface);
  background-image: none;
  border-color: var(--kip-border);
}
.navbar-default .navbar-nav > li > a,
.navbar-default .navbar-brand {
  color: var(--kip-ink);
  font-size: var(--kip-size-navigation);
}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus,
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus,
.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus {
  color: var(--kip-ink);
  background-color: var(--kip-soft);
}
.navbar-default .navbar-toggle {
  border-color: var(--kip-border);
}
.navbar-default .navbar-toggle .icon-bar { background-color: var(--kip-ink); }
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus { background-color: var(--kip-soft); }
.navbar-default .navbar-brand:hover,
.navbar-default .navbar-brand:focus { color: var(--kip-link); }
.kip-brand img {
  display: block;
  width: auto;
  height: 32px;
  max-width: 100%;
}
.navbar-brand.kip-brand {
  display: inline-flex;
  align-items: center;
  height: 60px;
  padding-top: 10px;
  padding-bottom: 10px;
}

/* Primäraktion: Grün mit dunkler Schrift; Weiß auf diesem Grün wäre zu blass. */
.btn.btn-primary, .navbar.navbar-default .btn-primary:not(:hover) {
  color: var(--kip-ink);
  background-color: var(--kip-green);
  border-color: var(--kip-green);
  background-image: none;
}
.btn.btn-primary:hover, .btn.btn-primary:focus,
.btn.btn-primary:active, .btn.btn-primary.active,
.open > .dropdown-toggle.btn-primary {
  color: var(--kip-surface);
  background-color: var(--kip-link);
  border-color: var(--kip-link);
}
.btn.btn-default, .navbar.navbar-default .btn-default:not(:hover) {
  color: var(--kip-ink);
  background-color: var(--kip-surface);
  border-color: var(--kip-muted);
  background-image: none;
}
.btn.btn-default:hover, .btn.btn-default:focus,
.btn.btn-default:active, .btn.btn-default.active {
  color: var(--kip-ink);
  background-color: var(--kip-soft);
  border-color: var(--kip-link);
}
/* Erfolgs-/Warn-/Löschbuttons behalten ihre semantischen Themefarben. */

/* Startseiten-Kacheln statt der bisherigen blauen Flächen. */
[data-itemtype="welcome_item"] .bs-welcome-header,
.bs-welcome-item[data-itemtype="welcome_item"][data-comment-len="0"] > .bs-welcome-header {
  background: var(--kip-surface) !important;
  border: 2px solid var(--kip-green);
  border-radius: 5px;
}
[data-itemtype="welcome_item"] .bs-welcome-header > a {
  color: var(--kip-ink) !important;
  text-decoration: none;
}
[data-itemtype="welcome_item"] .bs-welcome-header:hover,
[data-itemtype="welcome_item"] .bs-welcome-header:focus-within,
.bs-welcome-item[data-itemtype="welcome_item"][data-comment-len="0"] > .bs-welcome-header:hover,
.bs-welcome-item[data-itemtype="welcome_item"][data-comment-len="0"] > .bs-welcome-header:focus-within {
  background: var(--kip-soft) !important;
  border-color: var(--kip-link);
}

/* Eine gemeinsame, ruhigere Seitennavigation. */
.pagination > li > a, .pagination > li > span {
  color: var(--kip-link);
  background-color: var(--kip-surface);
  border: 1px solid var(--kip-border);
}
.pagination > li > a:hover, .pagination > li > a:focus,
.pagination > li > span:hover, .pagination > li > span:focus {
  color: var(--kip-ink);
  background-color: var(--kip-soft);
  border-color: var(--kip-green);
}
.pagination > .active > a, .pagination > .active > span,
.pagination > .active > a:hover, .pagination > .active > span:hover,
.pagination > .active > a:focus, .pagination > .active > span:focus {
  color: var(--kip-surface);
  background-color: var(--kip-link);
  border-color: var(--kip-link);
}
.pagination > .disabled > a, .pagination > .disabled > span,
.pagination > .disabled > a:hover, .pagination > .disabled > span:hover,
.pagination > .disabled > a:focus, .pagination > .disabled > span:focus {
  color: var(--kip-muted);
  background-color: var(--kip-row);
  border-color: var(--kip-border);
}

/* Öffentliche Trefferliste. !important überstimmt explizite Designer-Zellfarben. */
table[data-location="grid"][data-page^="beitrag_public_"] {
  font-size: var(--kip-size-grid);
  color: var(--kip-ink);
}
table[data-location="grid"][data-page^="beitrag_public_"] > thead > tr > th {
  color: var(--kip-ink) !important;
  background-color: var(--kip-soft) !important;
  border-color: var(--kip-border);
  font-weight: 600;
}
table[data-location="grid"][data-page^="beitrag_public_"] > thead > tr > th a {
  color: var(--kip-ink) !important;
}
table[data-location="grid"][data-page^="beitrag_public_"] > tbody > tr.r-gridrow {
  background-color: var(--kip-surface);
}
table[data-location="grid"][data-page^="beitrag_public_"] > tbody > tr.r-gridrow:nth-of-type(even) {
  background-color: var(--kip-row);
}
table[data-location="grid"][data-page^="beitrag_public_"] > tbody > tr.r-gridrow:hover > td,
table[data-location="grid"][data-page^="beitrag_public_"] .bs-clickable.bs-clickable:hover {
  background-color: var(--kip-soft) !important;
}
table[data-location="grid"][data-page^="beitrag_public_"] > tbody > tr > td a:not(.btn) {
  color: var(--kip-link);
  text-decoration: underline;
  text-underline-offset: 2px;
}
/* Die Suchfunktion bleibt unverändert; nur ihre Markierung wird ruhiger. */
.r-search-highlight {
  color: var(--kip-ink);
  background-color: var(--kip-match);
  font-weight: 600;
  border-radius: 2px;
}
