/* ---------------------------------------------------------------------------
 * anthro|ki Branding für Easy!Appointments (Buchungsseite termin.anthro-ki.de)
 * Wird NACH frontend.css geladen (Override). Marken-Guide: 00 Kontext/Branding.md
 * Farben: Eierschale #F4EFE4 · Anthrazit #272724 · Venezianisch-Rot #B4573A
 *         Eierschale2 #EDE7D8 · Linie #C8C4BC · Mittelton #9A9A92
 * Fonts:  Fraunces (Headlines), DM Sans (UI), JetBrains Mono (Meta) — selbst gehostet
 * Form:   Blattradius 12px 0 12px 0 (Flächen) / 8px 0 8px 0 (Buttons)
 * ------------------------------------------------------------------------- */

:root,
[data-bs-theme="light"] {
  --bs-primary: #B4573A;
  --bs-primary-rgb: 180, 87, 58;
  --bs-link-color: #B4573A;
  --bs-link-color-rgb: 180, 87, 58;
  --bs-link-hover-color: #8F4530;
  --bs-body-bg: #F4EFE4;
  --bs-body-color: #272724;
  --bs-border-color: #C8C4BC;
  --bs-secondary-color: #9A9A92;
  --bs-font-sans-serif: "DM Sans", "Helvetica Neue", sans-serif;
  --aki-leaf: 12px 0 12px 0;
  --aki-leaf-sm: 8px 0 8px 0;
}

body {
  background-color: #F4EFE4 !important;
  color: #272724;
  font-family: "DM Sans", "Helvetica Neue", sans-serif;
}

h1, h2, h3, h4, .frame-title {
  font-family: "Fraunces", "Georgia", serif !important;
  font-weight: 300 !important;
  color: #272724 !important;
}

.text-muted { color: #9A9A92 !important; }

/* Kopfbalken: Anthrazit (Logo-Variante dunkel), Eierschale-Text */
#header {
  background-color: #272724 !important;
  border-bottom: 2px solid #B4573A;
}
#header,
#header * { color: #F4EFE4 !important; }

/* Schritt-Badges (1/2/3) */
#steps .book-step {
  background-color: rgba(244, 239, 228, 0.16) !important;
  color: #F4EFE4 !important;
  border-radius: var(--aki-leaf-sm) !important;
}
#steps .book-step.active-step {
  background-color: #B4573A !important;
  color: #F4EFE4 !important;
}

/* Inhalts-Karte als Blattform auf Eierschale2 */
.wizard-frame {
  background-color: #EDE7D8 !important;
  border: 1px solid #C8C4BC;
  border-radius: var(--aki-leaf) !important;
}

/* Buttons: Blattradius, Markenrot */
.btn { border-radius: var(--aki-leaf-sm) !important; }
.btn-primary,
#book-appointment-submit {
  background-color: #B4573A !important;
  border-color: #B4573A !important;
  color: #F4EFE4 !important;
}
.btn-primary:hover,
#book-appointment-submit:hover {
  background-color: #8F4530 !important;
  border-color: #8F4530 !important;
}
.btn-outline-primary {
  color: #B4573A !important;
  border-color: #B4573A !important;
}

/* Zeit-Slots */
.available-hour {
  border-radius: var(--aki-leaf-sm) !important;
  border-color: #C8C4BC !important;
  color: #272724 !important;
  font-variant-numeric: oldstyle-nums;
}
.available-hour:hover {
  border-color: #B4573A !important;
  color: #B4573A !important;
}
.available-hour.selected-hour,
.available-hour.selected {
  background-color: #B4573A !important;
  border-color: #B4573A !important;
  color: #F4EFE4 !important;
}

/* Formularfelder + Fokus in Markenrot */
.form-control:focus,
.form-select:focus {
  border-color: #B4573A !important;
  box-shadow: 0 0 0 0.2rem rgba(180, 87, 58, 0.2) !important;
}

/* Kalender-Datepicker (flatpickr) in Markenfarben */
.flatpickr-day.selected,
.flatpickr-day.selected:hover {
  background: #B4573A !important;
  border-color: #B4573A !important;
}
.flatpickr-day.today { border-color: #B4573A !important; }

a { color: #B4573A; }
a:hover { color: #8F4530; }