/* Familienkompass+ Schwangerschaftswoche, v6.0.1. Ergaenzt fk-rezepte.css (Kopfzeile, Buttons, Eingaben, Toast)
   um Wochen-Navigation, Baby-Karte, Textkarten, Termine, Werkzeuge, Wochenraster und Teaser. */
.fz-ssw { max-width: 900px; }
.fz-ssw [hidden] { display: none !important; }
.fz-ssw__h2 { font-family: "Cormorant Garamond", Georgia, serif; font-size: 1.25rem; font-weight: 600; margin: 0 0 8px; color: #3f3330; }
.fz-ssw__text { margin: 0; font-size: .95rem; color: #5a4d48; line-height: 1.65; }
.fz-ssw__hinweis { margin: 10px 0 0; padding: 10px 14px; background: #fdf0f0; border-left: 4px solid #c49090; border-radius: 0 12px 12px 0; font-size: .86rem; color: #5a4d48; }

/* Termin eintragen */
.fz-ssw__termin { background: #fff; border: 1px solid #eadfd9; border-radius: 14px; padding: 16px 18px; margin: 12px 0 0; }
.fz-ssw__termin .fz-ssw__text { margin-bottom: 10px; }
.fz-ssw__termin-zeile { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.fz-ssw__termin-zeile .fz-rz__input { width: auto; min-width: 170px; flex: 1; }

/* Wochen-Navigation */
.fz-ssw__nav { position: sticky; top: 0; z-index: 5; display: flex; align-items: center; justify-content: space-between; gap: 10px; background: #fff; border: 1px solid #eadfd9; border-radius: 14px; padding: 10px 12px; margin: 12px 0 8px; transition: box-shadow .2s; }
.fz-ssw__nav.is-stuck { box-shadow: 0 6px 18px rgba(63,51,48,.10); }
.fz-ssw__nav-btn { width: 44px; height: 44px; flex: 0 0 44px; border-radius: 50%; border: 1px solid #eadfd9; background: #fff; font: inherit; font-size: 1.4rem; line-height: 1; color: #7a5555; cursor: pointer; }
.fz-ssw__nav-btn:hover { border-color: #ab8d8d; background: #faf7f6; }
.fz-ssw__nav-btn:disabled { opacity: .35; cursor: default; }
.fz-ssw__nav-btn:focus-visible, .fz-ssw__tab:focus-visible, .fz-ssw__w:focus-visible, .fz-ssw__abschnitt-kopf:focus-visible, .fz-ssw__link-btn:focus-visible { outline: 2px solid #ab8d8d; outline-offset: 2px; }
.fz-ssw__nav-mitte { text-align: center; min-width: 0; }
.fz-ssw__nav-woche { font-family: "Cormorant Garamond", Georgia, serif; font-size: 1.6rem; font-weight: 600; line-height: 1.05; color: #3f3330; }
.fz-ssw__nav-sub { font-size: .78rem; color: #8a7d78; margin-top: 2px; }
.fz-ssw__nav-sub b { color: #5a4d48; }
.fz-ssw__pill { display: inline-block; font-size: .72rem; font-weight: 600; padding: 4px 10px; border-radius: 9px; white-space: nowrap; }
.fz-ssw__pill--tri { background: #f5eded; color: #7a5555; margin-top: 4px; }
.fz-ssw__pill--kbg { background: #faf7f6; color: #5a4d48; }
.fz-ssw__pill--neu { background: #f5eded; color: #7a5555; }
.fz-ssw__pill--jetzt { background: #ab8d8d; color: #fff; }
.fz-ssw__aktuell { display: flex; justify-content: center; margin: 0 0 10px; }
.fz-ssw__link-btn { background: none; border: 1px solid #eadfd9; border-radius: 20px; padding: 8px 14px; font: inherit; font-size: .84rem; font-weight: 600; color: #7a5555; cursor: pointer; min-height: 38px; }
.fz-ssw__link-btn:hover { border-color: #ab8d8d; background: #faf7f6; }

/* Karten */
.fz-ssw__karte { background: #fff; border: 1px solid #eadfd9; border-radius: 14px; padding: 16px 18px; margin-bottom: 10px; }
.fz-ssw__baby { text-align: center; padding: 22px 18px 18px; }
.fz-ssw__baby-bild { font-size: 3.4rem; line-height: 1; margin: 6px 0 8px; }
.fz-ssw__baby-vergleich { font-family: "Cormorant Garamond", Georgia, serif; font-size: 1.35rem; font-weight: 600; color: #3f3330; }
.fz-ssw__baby-vergleich b { color: #7a5555; }
.fz-ssw__baby-masse { display: flex; justify-content: center; gap: 18px; flex-wrap: wrap; margin-top: 8px; font-size: .92rem; color: #5a4d48; }
.fz-ssw__baby-masse b { color: #3f3330; }
.fz-ssw__baby-hinweis { font-size: .78rem; color: #8a7d78; margin-top: 8px; }
.fz-ssw__abschnitt-kopf { display: flex; justify-content: space-between; align-items: center; gap: 10px; width: 100%; background: none; border: none; padding: 0; margin: 0 0 6px; font: inherit; text-align: left; cursor: pointer; color: inherit; }
.fz-ssw__abschnitt-kopf .fz-ssw__h2 { margin: 0; }
.fz-ssw__chevron { color: #8a7d78; font-size: .9rem; transition: transform .2s; }
.fz-ssw__abschnitt-kopf[aria-expanded="false"] .fz-ssw__chevron { transform: rotate(-90deg); }
.fz-ssw__karte--moment { background: #f5eded; border-color: transparent; }
.fz-ssw__moment { color: #7a5555; font-style: italic; }

/* Wischen und Wochenwechsel */
.fz-ssw__swipe { position: relative; overflow: hidden; }
.fz-ssw__inhalt { transition: opacity .18s ease, transform .18s ease; }
.fz-ssw__inhalt.fz-ssw--raus-links { opacity: 0; transform: translateX(-16px); }
.fz-ssw__inhalt.fz-ssw--raus-rechts { opacity: 0; transform: translateX(16px); }
.fz-ssw__swipe-hint { text-align: center; font-size: .78rem; color: #8a7d78; padding: 4px 0 8px; animation: fzSswHint 3s ease 1s forwards; }
@keyframes fzSswHint { to { opacity: 0; height: 0; padding: 0; } }
@media (prefers-reduced-motion: reduce) { .fz-ssw__inhalt { transition: none; } .fz-ssw__swipe-hint { animation: none; } }

/* Termine */
.fz-ssw__termin-eintrag { display: flex; gap: 12px; align-items: flex-start; padding: 10px 0; border-top: 1px solid #eadfd9; }
.fz-ssw__termin-eintrag:first-child { border-top: none; padding-top: 0; }
.fz-ssw__termin-frist { flex: 0 0 132px; font-size: .8rem; color: #8a7d78; padding-top: 2px; }
.fz-ssw__termin-text { flex: 1; min-width: 0; font-size: .94rem; color: #3f3330; }
.fz-ssw__termin-text b { display: block; }
.fz-ssw__termin-text a { color: #7a5555; }
.fz-ssw__termin-text span { display: block; font-size: .82rem; color: #8a7d78; }
.fz-ssw__tags { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 4px; }
.fz-ssw__termine-hinweis, .fz-ssw__termine-leer { font-size: .9rem; color: #5a4d48; margin: 0 0 8px; }
.fz-ssw__legende { margin: 10px 0 0; font-size: .8rem; color: #8a7d78; }
.fz-ssw__legende a { color: #7a5555; }
.fz-ssw__sperre { position: relative; min-height: 150px; }
.fz-ssw__sperre-blur { filter: blur(4px); opacity: .6; pointer-events: none; user-select: none; }
.fz-ssw__sperre-overlay { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; text-align: center; padding: 14px; }
.fz-ssw__sperre-overlay p { margin: 0; font-size: .92rem; color: #3f3330; max-width: 40ch; }

/* Werkzeuge */
.fz-ssw__tools { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 8px; }
.fz-ssw__tool { display: flex; justify-content: space-between; align-items: center; gap: 10px; background: #fff; border: 1px solid #eadfd9; border-radius: 10px; padding: 12px 14px; text-decoration: none; color: #3f3330; font-size: .92rem; font-weight: 600; min-height: 44px; }
.fz-ssw__tool:hover { border-color: #ab8d8d; background: #faf7f6; }
.fz-ssw__tool small { display: block; font-weight: 400; color: #8a7d78; font-size: .78rem; }
.fz-ssw__tool-pfeil { color: #ab8d8d; font-size: 1.2rem; }

/* Wochenraster */
.fz-ssw__tabs { display: flex; gap: 6px; margin: 0 0 10px; }
.fz-ssw__tab { flex: 1; padding: 10px 8px; border-radius: 10px; border: 1px solid #eadfd9; background: #fff; font: inherit; font-size: .86rem; font-weight: 600; color: #5a4d48; cursor: pointer; min-height: 44px; }
.fz-ssw__tab.is-active { background: #ab8d8d; border-color: #ab8d8d; color: #fff; }
.fz-ssw__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(44px, 1fr)); gap: 6px; }
.fz-ssw__w { min-height: 44px; border-radius: 10px; border: 1px solid #eadfd9; background: #fff; font: inherit; font-weight: 600; color: #5a4d48; cursor: pointer; }
.fz-ssw__w.is-active { background: #ab8d8d; border-color: #ab8d8d; color: #fff; }
.fz-ssw__w.is-current { border-color: #ab8d8d; color: #7a5555; }
.fz-ssw__quellen { margin: 14px auto 0; font-size: .78rem; color: #8a7d78; text-align: center; max-width: 70ch; line-height: 1.55; }

/* Teaser */
.fz-ssw--teaser .fz-ssw__baby .fz-ssw__pill { margin: 0 0 8px; }
.fz-ssw__teaser-text { text-align: left; margin-top: 12px; }
.fz-ssw__teaser-liste { margin: 0 0 12px; padding-left: 20px; font-size: .92rem; color: #5a4d48; }
.fz-ssw__teaser-liste li { margin-bottom: 4px; }
.fz-ssw__teaser-cta { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.fz-ssw__teaser-login { font-size: .86rem; color: #8a7d78; }
.fz-ssw__teaser-login a { color: #7a5555; }

@media (max-width: 640px) {
  .fz-ssw__termin-eintrag { flex-direction: column; gap: 2px; }
  .fz-ssw__termin-frist { flex-basis: auto; }
  .fz-ssw__tabs { flex-wrap: wrap; }
  .fz-ssw__tab { flex-basis: calc(33% - 4px); font-size: .8rem; padding: 8px 4px; }
  .fz-ssw__termin-zeile .fz-rz__input { min-width: 0; }
  .fz-ssw__termin-zeile .fz-rz__btn { flex: 1; }
}