/* ── Styles custom (complément de Tailwind) ────────────── */

body {
  font-family: "Helvetica Neue", Helvetica, Inter, Arial, sans-serif;
}

html {
  scroll-behavior: smooth;
}

/* Chiffres alignés en colonnes, façon fiche de paie */
.tnum {
  font-variant-numeric: tabular-nums;
}

/* Focus clavier visible */
input:focus-visible,
select:focus-visible,
a:focus-visible,
summary:focus-visible {
  outline: 2px solid var(--color-brand);
  outline-offset: 2px;
}

/* Ombre "dure" façon affiche suisse */
.shadow-hard {
  box-shadow: 6px 6px 0 0 #111827;
}

.shadow-hard-sm {
  box-shadow: 4px 4px 0 0 #111827;
}

/* Petit flash rouge quand le résultat se met à jour */
@keyframes flash-update {
  0% { color: var(--color-brand); }
  100% { color: inherit; }
}

.flash {
  animation: flash-update 0.6s ease-out;
}

/* FAQ en accordéon natif <details> avec chevron custom */
details > summary {
  list-style: none;
  cursor: pointer;
}

details > summary::-webkit-details-marker {
  display: none;
}

details summary .chevron {
  transition: transform 0.2s ease;
}

details[open] summary .chevron {
  transform: rotate(180deg);
}