/* ============================================================
   Wendewerk Gesundheits-Dashboard – Geteiltes Frontend-CSS
   (Alert-Boxen, [hidden]-Override, Grundschrift)
   ============================================================ */

[data-wwgd-dashboard],
[data-wwgd-onboarding],
[data-wwgd-meine-krankenkasse],
[data-wwgd-meine-vorsorge],
[data-wwgd-register],
[data-wwgd-login] {
    font-family: inherit;
    color: var(--wwgd-text);
    max-width: 860px;
    margin: 0 auto;
    box-sizing: border-box;
}

[data-wwgd-dashboard] *,
[data-wwgd-onboarding] *,
[data-wwgd-meine-krankenkasse] *,
[data-wwgd-meine-vorsorge] *,
[data-wwgd-register] *,
[data-wwgd-login] * {
    box-sizing: inherit;
}

[data-wwgd-dashboard] [hidden],
[data-wwgd-onboarding] [hidden],
[data-wwgd-meine-krankenkasse] [hidden],
[data-wwgd-meine-vorsorge] [hidden],
[data-wwgd-register] [hidden],
[data-wwgd-login] [hidden] {
    display: none !important;
}

/* Defensiver Grund-Reset für <button>: viele Themes (u. a. Astra) stylen
   Buttons global mit eigener Textfarbe/Padding – ohne diesen Reset erben
   unsere schlichten <button>-Elemente (z. B. Kassen-Dropdown-Items) diese
   Theme-Farbe und werden dadurch unsichtbar. :where(...) sorgt dafür, dass
   dieser Reset selbst KEINE Spezifität mitbringt (0 statt Attribut+Tag),
   damit spezifischere Klassen wie .wwgd-db__button ihn zuverlässig wieder
   überschreiben können – ohne :where() würde `[attr] button` (Spezifität
   0,1,1) sonst eine einzelne Klasse wie .wwgd-db__button (0,1,0) schlagen. */
:where(
    [data-wwgd-dashboard],
    [data-wwgd-onboarding],
    [data-wwgd-meine-krankenkasse],
    [data-wwgd-meine-vorsorge],
    [data-wwgd-register],
    [data-wwgd-login]
) button {
    font-family: inherit;
    color: var(--wwgd-text);
    background: none;
    border: none;
    padding: 0;
}

.wwgd-alert {
    padding: 14px 18px;
    border-radius: var(--wwgd-radius);
    font-size: 14px;
    line-height: 1.6;
    margin-bottom: 20px;
}

.wwgd-alert--notice {
    background: #eff6ff;
    border: 1px solid #bfdbfe;
    color: #1e40af;
}

.wwgd-alert--error {
    background: #fef2f2;
    border: 1px solid #fecaca;
    color: #991b1b;
}

.wwgd-alert--success {
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    color: #15803d;
}

/* ── Icons (SVG statt Emoji, Wendewerk-CI) ────────────────────── */
.wwgd-icon {
    display: inline-block;
    width: 1em;
    height: 1em;
    vertical-align: -0.15em;
}

.wwgd-icon--gruen { color: var(--wwgd-green); }
.wwgd-icon--gelb  { color: var(--wwgd-yellow); }
.wwgd-icon--rot   { color: var(--wwgd-red); }