/*
Theme Name: FH Base
Theme URI: https://ideal-tech.de
Description: Block-Theme der WordPress-Plattform (Ideal Tech). Child-Theme je Site traegt Farben, Logo, Pattern-Overrides. Doku: vault business/projekte/wordpress-plattform/wordpress-plattform.md
Version: 1.0.4
Requires at least: 6.7
Requires PHP: 8.2
Author: Ideal Tech
License: GPL-2.0-or-later
Text Domain: fh-base
*/

/* ---------------------------------------------------------------------------
   Plattform-Grundlage. Alles hier ist site-unabhaengig: Struktur, Bedienbarkeit
   und die Formular-Grundgestalt, die JEDE Kundensite braucht (Contact Form 7 ist
   Pflichtbestandteil der Plattform). Farben, Schrift, Masse setzt das Child-Theme.
   Die Werte kommen aus theme.json-Presets, damit ein Child sie ueber theme.json
   aendern kann, ohne CSS zu ueberschreiben.
   --------------------------------------------------------------------------- */

/* Skip-Link und Fokus sichtbar halten (theme.json kennt beides nicht). */
.skip-link:focus { position: static; width: auto; height: auto; padding: .5rem 1rem; }
:where(a, button, input, textarea, select):focus-visible { outline: 2px solid var(--wp--preset--color--primary, #2563eb); outline-offset: 2px; }

/* Classic-Block-Inhalte aus der Migration bekommen denselben Fluss wie Bloecke.
   :where() haelt die Spezifitaet bei 0, damit ein Child seine eigenen Absatz-
   Abstaende setzen kann, ohne !important zu brauchen. */
.wp-block-freeform > :where(* + *) { margin-block-start: 1.25rem; }
.wp-block-freeform img { height: auto; max-width: 100%; }

/* Grundabstand des Inhaltsbereichs. Steht als Klasse (nicht als Inline-Style im
   Template), damit das Child-Theme ihn per CSS ueberschreiben kann — Inline-Styles
   aus Block-Attributen liessen sich nur mit !important schlagen. */
.fh-main { padding-block: 2.5rem 3rem; }

/* Kopfbild (Header-Part, an die Site-Daten gebunden): volle Breite, ohne Fuge. */
.fh-hero { margin: 0; line-height: 0; }
.fh-hero img { display: block; width: 100%; height: auto; }

/* ---------------------------------------------------------------------------
   Kopf — Grundverhalten fuer Sites OHNE eigenes Child-CSS.
   Der Kopf-Block selbst ist bewusst NICHT `constrained`: das Kopfbild darunter
   soll ueber die volle Breite laufen, und ein `constrained`-Kasten wuerde es auf
   contentSize einschnueren. Die Zentrierung macht deshalb dieses CSS — eine Site,
   deren Kopf randlos sein soll (historikercontor), setzt max-width auf none.
   --------------------------------------------------------------------------- */
.fh-header .fh-header__inner {
  box-sizing: border-box;
  max-width: var(--wp--style--global--wide-size, 1120px);
  margin-inline: auto;
  padding-inline: var(--wp--style--root--padding-left, 1.25rem) var(--wp--style--root--padding-right, 1.25rem);
}
.fh-header .wp-block-site-logo img { height: auto; }

/* Mobil-Rueckfall. Der Kopf-Part setzt bewusst overlayMenu:"never" (kein Hamburger)
   und flex-wrap:nowrap — ohne diese Regeln liefe die Navigation einer Site ohne
   eigenes Child-CSS bei schmalen Fenstern seitlich aus dem Bild. Kein
   justify-content: die Menuepunkte brechen linksbuendig um, damit eine Site, die
   ihre Punkte auf feste Breiten setzt, keine mittig haengende letzte Zeile bekommt. */
@media (max-width: 768px) {
  .fh-header .fh-header__inner {
    flex-direction: column;
    align-items: center;
    flex-wrap: wrap;
  }
  .fh-header .wp-block-site-logo img { max-width: 60vw; }
  .fh-header .wp-block-navigation { width: 100%; }
  .fh-header .wp-block-navigation__container { flex-wrap: wrap; }
}

/* Fussbereich: eine Zeile aus Beschriftung + gebundenem Wert ("Telefon: …") zeigt
   ohne diese Regel nur die nackte Beschriftung, wenn die Site-Daten den Wert nicht
   fuehren — auf einer frisch angelegten Site steht dann "Telefon:" ohne Nummer im
   Fuss. Browser ohne :has() zeigen weiterhin die Beschriftung; das ist der alte
   Zustand, kein neuer Fehler. */
.fh-footer__line:has(> p:last-child:empty) { display: none; }

/* ---------------------------------------------------------------------------
   Contact Form 7 — Plattform-Grundgestalt (Spec: jede Kundensite hat CF7).
   CF7 liefert unformatierte Felder aus; ohne diese Regeln steht auf jeder Site
   ein Browser-Rohformular.

   Farbgebung: was die Palette hergibt, kommt aus den theme.json-Presets
   (--wp--preset--color--primary/base) mit Rueckfallwert. Feldrahmen, Fehlerrot und
   Eckenradius haben in einer Fuenf-Farben-Palette kein sinnvolles Gegenstueck —
   `surface` waere als Rahmen praktisch unsichtbar — und stehen deshalb als eigene
   Variablen, die ein Child ohne Neuschreiben der Regeln umsetzen kann:
   --fh-form-border-color, --fh-form-error-color, --fh-form-radius.
   --------------------------------------------------------------------------- */
.wpcf7-form p { margin: 0 0 1rem; }
.wpcf7-form label { display: block; font-weight: 600; }
.wpcf7-form .wpcf7-form-control-wrap { display: block; }
.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form input[type="tel"],
.wpcf7-form input[type="url"],
.wpcf7-form input[type="number"],
.wpcf7-form input[type="date"],
.wpcf7-form select,
.wpcf7-form textarea {
  box-sizing: border-box;
  width: 100%;
  padding: 10px;
  border: 1px solid var(--fh-form-border-color, #ccc);
  border-radius: var(--fh-form-radius, 4px);
  background: var(--wp--preset--color--base, #fff);
  color: inherit;
  font-family: inherit;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.4;
}
.wpcf7-form textarea { resize: vertical; min-height: 8em; }
.wpcf7-form input:focus, .wpcf7-form select:focus, .wpcf7-form textarea:focus {
  border-color: var(--wp--preset--color--primary, #2563eb);
}
/* Einwilligungs-Kaestchen: nicht als Block-Label, sondern Kaestchen neben Text. */
.wpcf7-form .wpcf7-acceptance label {
  display: flex;
  gap: .5rem;
  align-items: flex-start;
  font-weight: 400;
}
.wpcf7-form .wpcf7-acceptance input[type="checkbox"] { margin-top: .35em; flex: 0 0 auto; }
.wpcf7-form .wpcf7-list-item { margin: 0; }
.wpcf7-form .wpcf7-submit {
  width: auto;
  border: none;
  border-radius: var(--fh-form-radius, 4px);
  background: var(--wp--preset--color--primary, #2563eb);
  color: var(--wp--preset--color--base, #fff);
  padding: 12px 32px;
  font-family: inherit;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.4;
  cursor: pointer;
}
.wpcf7-form .wpcf7-submit:hover { filter: brightness(.94); }
.wpcf7-form .wpcf7-spinner { margin: 0 0 0 .75em; }
/* Rueckmeldungen: CF7 setzt nur duenne Rahmen, ohne Innenabstand kleben sie am Text. */
.wpcf7-not-valid-tip { display: block; margin-top: .25rem; font-size: 13px; color: var(--fh-form-error-color, #b32d2e); }
.wpcf7 form .wpcf7-response-output {
  margin: 1rem 0 0;
  padding: .75rem 1rem;
  border-width: 1px;
  border-radius: var(--fh-form-radius, 4px);
  font-size: 14px;
}