.bdf-french-audio-slot {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin-inline-start: 0.35rem;
  vertical-align: middle;
}

.bdf-french-audio,
.bdf-widget button.bdf-french-audio {
  display: inline-grid;
  min-width: 44px;
  min-height: 44px;
  place-items: center;
  flex: 0 0 auto;
  padding: 6px;
  border: 1px solid #d5dce5;
  border-radius: 6px;
  color: #15345b;
  background: #fff;
  box-shadow: 0 1px 2px rgba(15, 39, 71, 0.08);
  cursor: pointer;
}

.bdf-french-audio:hover,
.bdf-french-audio:focus-visible {
  border-color: #1f5fa7;
  color: #0c4f96;
  background: #eef7ff;
  outline: 2px solid transparent;
}

.bdf-french-audio span {
  line-height: 1;
  font-size: 0.92rem;
}

.bdf-french-audio svg { width: 20px; height: 20px; }
.bdf-french-audio:has(svg) .bdf-french-audio__label { display: none; }
.bdf-french-audio.is-speaking { background: #e5efff; border-color: #24559a; }
.bdf-french-audio:focus-visible { outline: 2px solid #24559a; outline-offset: 2px; }
.bdf-french-audio-status { font-size: 13px; color: #9c273b; max-width: 280px; line-height: 1.5; }

@media (max-width: 680px) {
  .bdf-french-audio-slot {
    margin-inline-start: 0.25rem;
  }

  .bdf-french-audio {
    min-width: 44px;
    min-height: 44px;
  }
}