/* Seitenrahmen angelehnt an www.st-birgid.de (Theme ColorMag).
   Die Akzentfarbe (St.-Birgid-Rot) wird NUR hier eingestellt und gilt für Seite, Formular und Buttons. */

:root {
  --akzent: #66899c;         /* St.-Birgid-Rot – exakten Wert aus WordPress hier eintragen (Rot: #b8161c) */
  --akzent-dunkel: #8f1015;
  --menue: #66899c;          /* Menüstreifen unter dem Kopf */
  --text: #333;
  --text-leise: #5b6670;
  --hintergrund: #f2f4f5;
  --rand: #dde2e6;
}

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: var(--hintergrund);
  color: var(--text);
  font-family: "Open Sans", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  line-height: 1.6;
}

a { color: var(--akzent); }
h1, h2, h3 { color: #222; line-height: 1.3; font-weight: 600; }
h1 { font-size: 1.75rem; margin: 0 0 0.75em; }
h2 { font-size: 1.35rem; }
h3 { font-size: 1.1rem; }

/* Kopf wie auf www.st-birgid.de: Logo links, Pfarrbüro-Anschrift rechts, rote Leiste darunter */
.kopf { background: #fff; }
.kopf-innen {
  max-width: 1140px;
  margin: 0 auto;
  padding: 1.25rem 1.25rem 1rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
}
.logo img { display: block; max-height: 110px; width: auto; max-width: 100%; }
.kopf-adresse {
  font-style: normal;
  font-size: 0.875rem;
  line-height: 1.5;
  color: var(--text);
}
.kopf-adresse strong { font-weight: 600; }
.kopf-adresse a { color: var(--akzent); text-decoration: none; }
.kopf-adresse a:hover { text-decoration: underline; }
.kopf-leiste { background: var(--menue); }
.kopf-leiste-innen {
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 1.25rem;
  min-height: 2.6rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}
.kopf-leiste a { color: #fff; text-decoration: none; font-size: 0.9rem; font-weight: 600; }
.kopf-leiste a:hover { text-decoration: underline; }
.kopf-links { display: flex; flex-wrap: wrap; }
.kopf-links a { margin-right: 1.75rem; }
@media (max-width: 700px) {
  .kopf-innen { flex-direction: column; align-items: flex-start; gap: 0.75rem; }
  .kopf-adresse { font-size: 0.8rem; }
}

/* Inhalt */
.inhalt {
  max-width: 860px;
  margin: 2rem auto;
  padding: 2rem 2.25rem 2.5rem;
  background: #fff;
  border-top: 3px solid var(--akzent);
}
@media (max-width: 700px) {
  .inhalt { margin: 0; padding: 1.5rem 1.1rem 2rem; border-top: 0; }
  h1 { font-size: 1.45rem; }
  .logo img { max-height: 72px; }
}

/* Anmeldung */
.anmeldung { max-width: 26rem; }
.anmeldung-form label { display: block; font-weight: 600; margin-bottom: 0.3em; }
.anmeldung-form input[type="password"] {
  width: 100%;
  padding: 0.6em 0.75em;
  margin-bottom: 1em;
  border: 1px solid #c5ccd3;
  border-radius: 3px;
  font: inherit;
}
.anmeldung-form input:focus-visible { outline: 2px solid var(--akzent); outline-offset: 2px; }
.anmeldung-form .pf-btn {
  padding: 0.6em 1.4em;
  border: 1px solid var(--akzent);
  border-radius: 3px;
  background: var(--akzent);
  color: #fff;
  font: inherit;
  cursor: pointer;
}
.hinweis-fehler {
  padding: 0.7em 1em;
  border-left: 4px solid #b3261e;
  background: #fdf1f0;
}

/* Auswahl */
.auswahl { list-style: none; padding: 0; margin: 1.5em 0 0; }
.auswahl li { margin: 0 0 0.9rem; }
.auswahl a,
.auswahl-geplant {
  display: block;
  padding: 1.1em 1.25em;
  border: 1px solid var(--rand);
  border-left: 5px solid var(--akzent);
  color: var(--text);
  text-decoration: none;
}
.auswahl a:hover { background: #fbf4f4; border-color: var(--akzent); }
.auswahl a:focus-visible { outline: 2px solid var(--akzent); outline-offset: 2px; }
.auswahl-titel { display: block; font-size: 1.15rem; font-weight: 600; color: var(--akzent); }
.auswahl-text { display: block; margin-top: 0.25em; font-size: 0.925rem; color: var(--text-leise); }
.auswahl-geplant { border-left-color: var(--rand); background: #fafbfc; }
.auswahl-geplant .auswahl-titel { color: var(--text-leise); }

/* Status */
.status { border-collapse: collapse; margin: 1em 0; width: 100%; }
.status td, .status th { padding: 0.4em 0.6em; border-bottom: 1px solid var(--rand); text-align: left; vertical-align: top; }
.ok { color: #1a7f37; font-weight: 700; }
.nein { color: #b3261e; font-weight: 700; }
code { font-size: 0.9em; background: #f3f5f7; padding: 0.05em 0.3em; border-radius: 2px; }

/* Formular-Überschrift im Rahmen */
.pf-seitentitel { margin-top: 0; }

/* Fuß */
.fuss { color: var(--text-leise); font-size: 0.875rem; }
.fuss-innen {
  max-width: 1140px;
  margin: 0 auto;
  padding: 1.25rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 0.5rem 1.5rem;
}
.fuss a { color: var(--text-leise); }

.testmail input[type="email"] { width: 100%; padding: 0.6em 0.75em; margin-bottom: 1em; border: 1px solid #c5ccd3; border-radius: 3px; font: inherit; }
.protokoll { margin: 0; padding: 0.6em 0.8em; background: #f6f8fa; font-size: 0.8rem; white-space: pre-wrap; overflow-wrap: anywhere; max-height: 22rem; overflow: auto; }
