/* Scoped to the notification bell; no sidebar, page or business-data styles. */
.gvn-voice { padding: 16px; border-bottom: 1px solid #dce5eb; background: #f4f8fb; color: #203344; font: inherit; min-width: 0; }
.gvn-voice .gvn-voice-title { font-size: 14px; font-weight: 700; margin-bottom: 10px; }
.gvn-voice .gvn-voice-recording { display: grid; gap: 3px; min-width: 0; padding: 9px 10px; border: 1px solid #b5c5d1; border-radius: 8px; background: #fff; color: #203344; }
.gvn-voice .gvn-voice-recording-label { font-size: 12px; line-height: 1.4; color: #546777; }
.gvn-voice .gvn-voice-recording strong { min-width: 0; font-size: 14px; line-height: 1.4; overflow-wrap: anywhere; }
.gvn-voice .gvn-voice-status { font-size: 13px; line-height: 1.5; margin: 10px 0; color: #3a5265; }
.gvn-voice .gvn-voice-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.gvn-voice .gvn-voice-actions button { width: auto; min-height: 42px; padding: 9px 12px; border: 1px solid #a9bdcc; border-radius: 8px; background: #fff; color: #015a9a; font: inherit; font-size: 13px; font-weight: 650; line-height: 1.4; cursor: pointer; }
.gvn-voice .gvn-voice-actions [data-voice-action="activate"] { background: #015a9a; color: #fff; border-color: #015a9a; }
.gvn-voice .gvn-voice-actions button:hover:not(:disabled) { border-color: #015a9a; box-shadow: 0 0 0 1px #015a9a; }
.gvn-voice [hidden] { display: none !important; }
.gvn-voice :disabled { opacity: .55; cursor: not-allowed; }
.gvn-voice .gvn-voice-hint { margin: 10px 0 0; color: #546777; font-size: 12px; line-height: 1.5; }
.gvn-voice button:focus-visible { outline: 3px solid #015a9a; outline-offset: 3px; }
body.dark-mode .gvn-voice { background: #263542; color: #e8f0f6; border-color: #3a4a59; }
body.dark-mode .gvn-voice .gvn-voice-recording { background: #202b35; color: #e8f0f6; border-color: #566a7a; }
body.dark-mode .gvn-voice :is(.gvn-voice-status, .gvn-voice-hint, .gvn-voice-recording-label) { color: #b5c3ce; }
body.dark-mode .gvn-voice .gvn-voice-actions button { color: #80ccef; background: #202b35; border-color: #566a7a; }
body.dark-mode .gvn-voice .gvn-voice-actions [data-voice-action="activate"] { color: #142b3a; background: #80ccef; border-color: #80ccef; }
body.dark-mode .gvn-voice .gvn-voice-actions button:hover:not(:disabled) { border-color: #80ccef; box-shadow: 0 0 0 1px #80ccef; }
body.dark-mode .gvn-voice button:focus-visible { outline-color: #80ccef; }
@media (max-width: 600px) {
  /* La cloche précède d'autres commandes : son bord droit ne correspond pas
     à celui de l'écran. Ancrer le panneau au viewport évite de le couper à gauche. */
  .main-content #notifPanel { position: fixed; left: 12px; right: 12px; top: 64px; width: auto; max-width: none; max-height: calc(100vh - 88px); max-height: calc(100dvh - 88px); }
  .gvn-voice { padding: 14px; }
  .gvn-voice .gvn-voice-actions button { min-height: 44px; flex: 1 1 auto; }
}