/* Familienkompass+ Schwangerschaftswochen-Teaser (Startseite), v2.0.0. Eigenstaendig, keine
   Abhaengigkeit zu fk-rezepte.css. Schrift DM Sans und Cormorant Garamond kommen aus dem Theme,
   hier nicht nachgeladen. Nur Palette-Farben, keine Pillen (Radius hoechstens 12px). */

.fz-sswt-wrap, .fz-sswt-wrap * { box-sizing: border-box; }
.fz-sswt-wrap [hidden] { display: none !important; }
.fz-sswt-wrap { font-family: "DM Sans", system-ui, Arial, sans-serif; color: #3f3330; line-height: 1.6; }
.fz-sswt-wrap :focus-visible { outline: 2px solid #ab8d8d; outline-offset: 2px; }

/* Karte */
.fz-sswt-card { max-width: 720px; margin: 0 auto; background: #fff; border: 1px solid #eadfd9; border-radius: 12px; overflow: hidden; }
.fz-sswt-header { background: #b89a9a; color: #fff; text-align: center; padding: 24px 20px; }
.fz-sswt-header h2 { margin: 0 0 6px; font-family: "Cormorant Garamond", Georgia, serif; font-size: 28px; font-weight: 600; color: #fff; }
.fz-sswt-header p { margin: 0; font-size: 15px; color: #fff; }
.fz-sswt-body { padding: 24px 20px; }

/* Eingabe */
.fz-sswt-sub { margin: 0 0 20px; font-size: 15px; color: #5a4d48; text-align: center; }
.fz-sswt-field { margin-bottom: 18px; }
.fz-sswt-label { display: block; margin-bottom: 6px; font-size: 14px; font-weight: 600; color: #5a4d48; }
.fz-sswt-input {
    display: block;
    width: 100%;
    min-width: 0;
    height: 44px;
    padding: 0 12px;
    border: 1px solid #d9c7c2;
    border-radius: 10px;
    background: #fff;
    color: #3f3330;
    font-family: inherit;
    font-size: 16px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
.fz-sswt-input:focus { outline: 2px solid #ab8d8d; outline-offset: 2px; border-color: #ab8d8d; }
.fz-sswt-error { margin: 8px 0 0; font-size: 14px; color: #8a3f38; }

.fz-sswt-btn {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 44px;
    padding: 12px 20px;
    border: none;
    border-radius: 10px;
    background: #ab8d8d;
    color: #fff;
    font-family: inherit;
    font-size: 16px;
    font-weight: 600;
    text-decoration: none;
    text-align: center;
    cursor: pointer;
    transition: background-color .15s ease;
}
.fz-sswt-btn:hover, .fz-sswt-btn:focus-visible { background: #967a7a; color: #fff; }

/* Ergebnis: Wochenblock */
.fz-sswt-week-block { text-align: center; margin-bottom: 20px; }
.fz-sswt-week-num { font-family: "Cormorant Garamond", Georgia, serif; font-size: 36px; font-weight: 700; color: #3f3330; line-height: 1.15; }
.fz-sswt-week-days { margin-top: 2px; font-size: 18px; font-weight: 600; color: #7a5555; }
.fz-sswt-week-countdown { margin-top: 6px; font-size: 15px; color: #5a4d48; }
.fz-sswt-meldung { margin: 0; font-size: 16px; color: #5a4d48; line-height: 1.6; }

/* Baby-Karte und Moment */
.fz-sswt-baby-card { text-align: center; background: #f5eded; border-radius: 12px; padding: 22px 18px; margin-bottom: 18px; }
.fz-sswt-baby-bild { font-size: 44px; line-height: 1; margin-bottom: 8px; }
.fz-sswt-baby-compare { font-family: "Cormorant Garamond", Georgia, serif; font-size: 19px; font-weight: 600; color: #3f3330; margin-bottom: 8px; overflow-wrap: break-word; }
.fz-sswt-baby-stat { font-size: 15px; color: #5a4d48; }
.fz-sswt-baby-note { margin: 10px 0 0; font-size: 14px; color: #8a7d78; }
.fz-sswt-moment {
    background: #fff;
    border: 1px solid #eadfd9;
    border-left: 4px solid #caa9a9;
    border-radius: 0 10px 10px 0;
    padding: 14px 16px;
    margin-bottom: 20px;
    font-size: 15px;
    color: #5a4d48;
    line-height: 1.65;
}

/* Wochenraster */
.fz-sswt-weeks { margin-bottom: 18px; }
.fz-sswt-week-row { margin-bottom: 14px; }
.fz-sswt-week-row-label { font-size: 14px; color: #8a7d78; margin-bottom: 8px; text-align: center; }
.fz-sswt-week-row-grid { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; }
.fz-sswt-week-btn {
    flex: 0 0 44px;
    min-width: 44px;
    min-height: 44px;
    border-radius: 10px;
    border: 1px solid #eadfd9;
    background: #faf7f6;
    color: #8a7d78;
    font-family: inherit;
    font-size: 15px;
    font-weight: 500;
    padding: 0;
    transition: background-color .15s ease, border-color .15s ease;
}
.fz-sswt-week-btn:disabled { background: #faf7f6; color: #8a7d78; border-color: #eadfd9; opacity: 1; cursor: default; }
.fz-sswt-week-btn-interactive {
    background: #fff;
    border: 1px solid #caa9a9;
    color: #7a5555;
    cursor: pointer;
}
.fz-sswt-week-btn-interactive:hover { background: #faf7f6; border-color: #ab8d8d; }
.fz-sswt-week-btn-current {
    background: #ab8d8d;
    border-color: #ab8d8d;
    color: #fff;
    font-weight: 700;
    cursor: default;
}
.fz-sswt-weeks-note { font-size: 14px; color: #5a4d48; text-align: center; margin: 0 0 18px; }

/* Anmeldung */
.fz-sswt-login-hint { margin: 14px 0 0; font-size: 15px; color: #5a4d48; text-align: center; }
.fz-sswt-login-hint a { color: #7a5555; text-decoration: underline; }
.fz-sswt-hint { margin: 14px 0 0; font-size: 14px; color: #8a7d78; text-align: center; }
.fz-sswt-aendern { margin: 18px 0 0; text-align: center; }
.fz-sswt-aendern a { color: #7a5555; font-size: 14px; text-decoration: underline; }

/* Angemeldet */
.fz-sswt-angemeldet-text { margin: 0 0 20px; font-size: 16px; color: #3f3330; text-align: center; }

@media (prefers-reduced-motion: reduce) {
    .fz-sswt-wrap * { transition: none !important; animation: none !important; }
}

@media (max-width: 420px) {
    .fz-sswt-header { padding: 20px 16px; }
    .fz-sswt-header h2 { font-size: 24px; }
    .fz-sswt-body { padding: 20px 16px; }
    .fz-sswt-week-num { font-size: 30px; }
}
