/* =========================================================================
   id4web – Montessori Kinderhaus Schwangau
   Angleichung an das alte Design (bootstrap_package 9 / Bootstrap 3)
   auf bootstrap_package 16 / Bootstrap 5.
   Farben & Regeln portiert aus dem alten sys_template + custom.less.
   ========================================================================= */

/* ---- Source Sans Pro (selbst gehostet, aus der Alt-Seite) ---------------- */
@font-face {
  font-family: 'Source Sans Pro'; font-style: normal; font-weight: 300;
  src: url('../Fonts/source-sans-pro-v11-latin-300.woff2') format('woff2'),
       url('../Fonts/source-sans-pro-v11-latin-300.woff') format('woff');
  font-display: swap;
}
@font-face {
  font-family: 'Source Sans Pro'; font-style: normal; font-weight: 400;
  src: url('../Fonts/source-sans-pro-v11-latin-regular.woff2') format('woff2'),
       url('../Fonts/source-sans-pro-v11-latin-regular.woff') format('woff');
  font-display: swap;
}
@font-face {
  font-family: 'Source Sans Pro'; font-style: normal; font-weight: 700;
  src: url('../Fonts/source-sans-pro-v11-latin-700.woff2') format('woff2'),
       url('../Fonts/source-sans-pro-v11-latin-700.woff') format('woff');
  font-display: swap;
}

/* ---- Marken-Palette (alte LESS-Konstanten -> BS5 CSS-Variablen) ---------- */
:root {
  --bs-primary: #314995;            --bs-primary-rgb: 49,73,149;
  --bs-secondary: #69b021;          --bs-secondary-rgb: 105,176,33;
  --bs-body-font-family: 'Source Sans Pro', system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --bs-body-font-size: 19px;
  --bs-body-line-height: 1.65;
  --bs-link-color: #314995;         --bs-link-color-rgb: 49,73,149;
  --bs-link-hover-color: #243668;   --bs-link-hover-color-rgb: 36,54,104;
  /* eckige Ecken wie border-radius-base = 0 */
  --bs-border-radius: 0; --bs-border-radius-sm: 0; --bs-border-radius-lg: 0;
  --bs-border-radius-xl: 0; --bs-border-radius-xxl: 0; --bs-border-radius-pill: 0;
}

body {
  font-family: var(--bs-body-font-family);
  font-size: 19px;
  line-height: 1.65;
}

/* ---- Überschriften: primary, fett, Größen wie im Bestand ----------------- */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  color: #314995;
  font-weight: 700;
  line-height: 1.2;
}
h1, .h1 { font-size: 2.30rem; }   /* alt: 2.07em */
h2, .h2 { font-size: 1.85rem; }   /* alt: 1.67em */
h3, .h3 { font-size: 1.55rem; }   /* alt: 1.40em */
h4, .h4 { font-size: 1.18rem; }   /* alt: 1.05em */

/* ---- Links --------------------------------------------------------------- */
a { color: #314995; }
a:hover, a:focus { color: #243668; }

/* ---- Primary-Button ------------------------------------------------------ */
.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: #314995;
  --bs-btn-border-color: #314995;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #28396f;
  --bs-btn-hover-border-color: #26356a;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #26356a;
  --bs-btn-active-border-color: #243363;
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #314995;
  --bs-btn-disabled-border-color: #314995;
}

/* ---- Navigation (alt: navbar-default gelb, Links primary, UPPERCASE) ------ */
.navbar-default,
.navbar-default.navbar-fixed-top { background-color: #ffcc00 !important; border: none; }
.navbar-default .navbar-nav .nav-link { color: #314995; text-transform: uppercase; }
.navbar-default .navbar-nav .nav-link:hover,
.navbar-default .navbar-nav .nav-link:focus { color: #314995; }
.navbar-default .navbar-nav .nav-item.active > .nav-link,
.navbar-default .navbar-nav .nav-link.active,
.navbar-default .navbar-nav .show > .nav-link { color: #314995; }

/* Menü nach rechts schieben (Logo links, Navigation rechts wie im Bestand).
   Die navbar-nav füllt die volle Breite -> Items per justify-content rechts. */
@media (min-width: 992px) {
  .navbar-mainnavigation .navbar-nav { justify-content: flex-end; }
}
/* Logo ca. 1/3 größer */
.navbar-brand-image > img { max-height: 62px; height: auto; width: auto; }

/* Navigations-Schrift ca. 10% größer (1rem -> 1.1rem) */
.navbar-mainnavigation {
  --mainnavigation-link-font-size: 1.1rem;
  /* mehr Platz oben/unten zwischen den Submenü-Einträgen (Standard .2rem) */
  --mainnavigation-dropdown-link-padding-y: 0.6rem;
}

/* Dünne graue Trennlinien zwischen den Submenü-Einträgen */
.navbar-mainnavigation .dropdown-nav > .nav-item + .nav-item {
  border-top: 1px solid #ccc;
}

/* ---- Content-Element-Hintergrundfarben (vorkompiliertes Theme hat die
       bootstrap_package-Default-Farben eingebacken -> hier auf Marke setzen) -- */
.frame-background-primary { background-color: #314995 !important; color: #fff; }
.frame-background-secondary { background-color: #69b021 !important; color: #fff; }
.frame-background-primary a, .frame-background-secondary a,
.frame-background-dark a { color: #fff; }
.frame-background-primary h1, .frame-background-primary h2, .frame-background-primary h3,
.frame-background-primary h4, .frame-background-primary h5, .frame-background-primary h6,
.frame-background-secondary h1, .frame-background-secondary h2, .frame-background-secondary h3,
.frame-background-secondary h4, .frame-background-secondary h5, .frame-background-secondary h6,
.frame-background-dark h1, .frame-background-dark h2, .frame-background-dark h3,
.frame-background-dark h4, .frame-background-dark h5, .frame-background-dark h6 { color: #fff; }

/* ---- Haupt-Section: Deko-Hand (grün) ------------------------------------- */
.main-section { background: url('../Images/kiha_hand_gruen20.png') no-repeat 50px 50px; }

/* ---- Footer-Optik (Bestand: kompletter Footer grün + ALLES weiß) --------- */
.footer-section,
.footer-section-content,
.footer-section-meta {
  color: #fff;
  /* bootstrap_package-Theme setzt hier eine grün-graue Link-/Textfarbe -> weiß */
  --frame-color: #fff;
  --frame-link-color: #fff;
  --frame-link-hover-color: #eee;
  --bs-link-color: #fff;
  --bs-link-color-rgb: 255,255,255;
  --bs-link-hover-color: #eee;
}
.footer-section { background-color: #69b021 !important; }
.footer-section-content { border-top: solid 70px #e32622; }
.footer-section-meta {
  background-color: #61a31f !important;
  border-bottom: solid 70px #314995;
}
.footer-section a, .footer-section a:link, .footer-section a:visited,
.footer-section-meta a, .footer-section-content a { color: #fff !important; }
.footer-section a:hover, .footer-section a:focus,
.footer-section-meta a:hover { color: #eee !important; }
.footer-section h1, .footer-section h2, .footer-section h3,
.footer-section h4, .footer-section h5, .footer-section h6 { color: #fff; }

/* ---- Dunkler Rahmen-Hintergrund = secondary ------------------------------ */
.frame-background-dark { background-color: #69b021; }

/* ---- Tabellen (alt): transparent, damit Box-Hintergrund durchscheint ----- */
.table {
  --bs-table-bg: transparent;
  background-color: transparent;
  margin-bottom: 0;
}
.table > :not(caption) > * > * { background-color: transparent !important; }
.table > tbody > tr > td, .table > tfoot > tr > td { border-top: none; }
