/**
 * rd-legal.css · Welle 23 · Block D
 *
 * Hand-written CSS für drei Komponenten aus der Pre-Live-Rechtsrisiko-Welle:
 *   - rd-notice            (Hinweis-Boxen: medical / legal / guidance / sourcing)
 *   - rd-notruf-box        (DACH-Giftnotruf-Inline-Box)
 *   - rd-werbung / rd-affiliate-disclosure (Affiliate-Kennzeichnung)
 *
 * Diese Datei ist NICHT auto-generiert (rundum.css ist auto-gen aus
 * _schema/bem-components.json + design-tokens.json). Sie wird separat
 * enqueued in functions.php Section 1, Priorität nach rundum.css. Bei
 * Gelegenheit post-Live in das Schema-Master integrieren.
 *
 * Tokens werden aus rundum.css übernommen (--rd-bg-soft, --rd-accent, etc.).
 */

/* ─────────────────────────────────────────────────────────────────────
 * 1. rd-notice — generischer Hinweis-Block
 * ──────────────────────────────────────────────────────────────────── */
.rd-notice {
    margin: var(--rd-space-6, 24px) 0;
    padding: var(--rd-space-4, 16px) var(--rd-space-5, 20px);
    background: var(--rd-bg-alt, #FAF2EC);
    border: 1px solid var(--rd-border, #e5ddd7);
    border-left: 4px solid var(--rd-accent, #B56A34);
    border-radius: var(--rd-r-md, 12px);
    font-family: var(--rd-font-body, Inter), sans-serif;
}

.rd-notice__title {
    font-weight: 600;
    color: var(--rd-text, #2a2a2a);
    margin: 0 0 6px 0;
    font-size: 0.95em;
}

.rd-notice__body {
    color: var(--rd-text-secondary, #3a3a3a);
    font-size: 0.9em;
    line-height: 1.55;
}

.rd-notice__body a {
    color: var(--rd-accent-strong, #a86e42);
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 2px;
}

.rd-notice__body a:hover {
    color: var(--rd-accent, #B56A34);
}

/* Varianten — Akzent-Farbe pro Risiko-Klasse */
.rd-notice--medical  { border-left-color: #C94B3B; }              /* Tierarzt → kräftiges Rot */
.rd-notice--legal    { border-left-color: #6B8AA5; }              /* Recht → ruhiges Blau */
.rd-notice--guidance { border-left-color: #6B8E5A; }              /* Training → Grün */
.rd-notice--sourcing { border-left-color: var(--rd-accent, #B56A34); } /* Sourcing → Brand */
.rd-notice--update   { border-left-color: #0891b2; background: #ecfeff; }   /* Update-Kasten → Cyan */

/* ─────────────────────────────────────────────────────────────────────
 * 2. rd-notruf-box — DACH-Giftnotruf-Inline
 * ──────────────────────────────────────────────────────────────────── */
.rd-notruf-box {
    margin: var(--rd-space-6, 24px) 0;
    padding: var(--rd-space-5, 20px);
    background: #FFF5F2;
    border: 1px solid #F1C9C0;
    border-left: 4px solid #C94B3B;
    border-radius: var(--rd-r-md, 12px);
}

.rd-notruf-box__title {
    font-weight: 700;
    font-size: 1.05em;
    color: #2a2a2a;
    margin: 0 0 var(--rd-space-3, 12px) 0;
}

.rd-notruf-box__laender {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--rd-space-3, 12px);
}

@media (min-width: 768px) {
    .rd-notruf-box__laender {
        grid-template-columns: repeat(3, 1fr);
        gap: var(--rd-space-4, 16px);
    }
}

.rd-notruf-box__land {
    background: #fff;
    padding: var(--rd-space-3, 12px) var(--rd-space-4, 16px);
    border-radius: 8px;
    border: 1px solid #F1C9C0;
}

.rd-notruf-box__label {
    font-size: 0.75em;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #6B6B6B;
    font-weight: 600;
    margin: 0 0 6px 0;
}

.rd-notruf-box__list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.rd-notruf-box__row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 8px;
    padding: 4px 0;
    border-bottom: 1px dashed #F1C9C0;
}

.rd-notruf-box__row:last-child {
    border-bottom: 0;
}

.rd-notruf-box__name {
    font-size: 0.85em;
    color: #3a3a3a;
}

.rd-notruf-box__tel {
    font-weight: 700;
    color: #C94B3B;
    text-decoration: none;
    font-feature-settings: "tnum" 1;
    white-space: nowrap;
}

.rd-notruf-box__tel:hover {
    text-decoration: underline;
}

.rd-notruf-box__hinweis {
    margin: var(--rd-space-3, 12px) 0 0 0;
    font-size: 0.8em;
    color: #6B6B6B;
    line-height: 1.5;
}

/* ─────────────────────────────────────────────────────────────────────
 * 3. rd-werbung — Inline-Affiliate-Marker
 * ──────────────────────────────────────────────────────────────────── */
.rd-werbung {
    display: inline-block;
    font-size: 0.7em;
    font-weight: 600;
    line-height: 1;
    padding: 2px 6px;
    margin-left: 4px;
    vertical-align: 1px;
    background: #FFF5E6;
    color: #8a5a1a;
    border: 1px solid #F0D9B0;
    border-radius: 4px;
    text-decoration: none;
    cursor: help;
    font-feature-settings: "tnum" 1;
}

/* ─────────────────────────────────────────────────────────────────────
 * 4. rd-affiliate-disclosure — Top-Box auf Posts mit Affiliate-Links
 * ──────────────────────────────────────────────────────────────────── */
.rd-affiliate-disclosure {
    margin: 0 0 var(--rd-space-5, 20px) 0;
    padding: var(--rd-space-3, 12px) var(--rd-space-4, 16px);
    background: #FFF5E6;
    border: 1px solid #F0D9B0;
    border-radius: var(--rd-r-md, 12px);
    font-size: 0.85em;
    color: #6a4a14;
    line-height: 1.5;
}

.rd-affiliate-disclosure strong {
    font-weight: 700;
    color: #8a5a1a;
}

.rd-affiliate-disclosure a {
    color: var(--rd-accent-strong, #a86e42);
    text-decoration: underline;
    text-underline-offset: 2px;
}
