/* ═══════════════════════════════════════════════════════════════
   ai_voice_help.css — Permission-Hilfe-Box im KI-Modal
   ───────────────────────────────────────────────────────────────
   Ergänzt ai_modal.css für den Fall, dass der Mikrofon-Zugriff
   verweigert wurde und eine mehrzeilige plattformspezifische
   Hilfe-Anleitung angezeigt werden muss.
   ═══════════════════════════════════════════════════════════════ */

/* Wenn die Hilfe aktiv ist: mehrzeilig, Card-Stil, kein Punkt davor */
.ai-mic-hint.ai-mic-hint-help {
    display: block;
    align-items: initial;
    margin-top: 10px;
    padding: 10px 12px;
    background: rgba(255, 59, 48, 0.08);
    border: 1px solid rgba(255, 59, 48, 0.22);
    border-radius: 10px;
    color: rgba(120, 20, 15, 0.95);
    font-size: 12px;
    font-weight: 500;
    line-height: 1.55;
    letter-spacing: 0;
}
.ai-mic-hint.ai-mic-hint-help::before {
    display: none;
}
.ai-mic-hint.ai-mic-hint-help strong {
    font-weight: 700;
    color: rgba(180, 30, 20, 1);
}
.ai-mic-hint.ai-mic-hint-help br {
    /* etwas Luft zwischen den Zeilen */
    content: '';
    display: block;
    margin-bottom: 2px;
}
.ai-mic-hint.ai-mic-hint-help em {
    display: block;
    margin-top: 6px;
    padding-top: 6px;
    border-top: 1px dashed rgba(255, 59, 48, 0.18);
    color: rgba(120, 20, 15, 0.75);
    font-style: normal;
    font-size: 11.5px;
}

/* Dark Mode */
[data-theme="dark"] .ai-mic-hint.ai-mic-hint-help {
    background: rgba(255, 100, 90, 0.10);
    border-color: rgba(255, 100, 90, 0.28);
    color: rgba(255, 200, 195, 0.95);
}
[data-theme="dark"] .ai-mic-hint.ai-mic-hint-help strong {
    color: rgba(255, 220, 215, 1);
}
[data-theme="dark"] .ai-mic-hint.ai-mic-hint-help em {
    border-top-color: rgba(255, 100, 90, 0.22);
    color: rgba(255, 200, 195, 0.75);
}