/* ── VARIABLES CARACOL ── */
:root {
  --caracol-jaune:   #F9D967;
  --caracol-rouge-h: #D76969;
  --caracol-creme:   #FAFAF5;
  --caracol-noir:    #1A1A1A;
  --caracol-gris:    #6B6B6B;
  --caracol-blanc:   #FFFFFF;
}

/* ── BOUTONS : contour jaune, hover fond rouge ── */
.ab-button,
[class*="button"] {
  background-color: transparent !important;
  color: var(--caracol-noir) !important;
  border: 2px solid var(--caracol-jaune) !important;
  border-radius: 6px !important;
  font-family: 'IBM Plex Sans', sans-serif !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease !important;
}

.ab-button:hover,
[class*="button"]:hover {
  background-color: var(--caracol-rouge-h) !important;
  border-color: var(--caracol-rouge-h) !important;
  color: var(--caracol-blanc) !important;
  text-decoration: none !important;
}
/* FOND */
body, .ab-page {
  background-color: var(--caracol-creme) !important;
  color: var(--caracol-noir) !important;
}



/* LIENS */
a {
  color: var(--caracol-jaune) !important;
  text-decoration: none !important;
}

a:hover {
  color: var(--caracol-jaune-h) !important;
  text-decoration: none !important;
}

p a:hover, span a:hover, .ab-text a:hover {
  text-decoration: underline !important;
}

/* TABLEAUX header */
[class*="table"] th,
[class*="table"] thead {
  background-color: var(--caracol-noir) !important;
  color: var(--caracol-blanc) !important;
}

[class*="table"] tr:nth-child(even) {
  background-color: #F0EFE8 !important;
}

/* INPUTS focus */
input:focus, textarea:focus,
[class*="input"]:focus {
  border-color: var(--caracol-jaune) !important;
  box-shadow: 0 0 0 2px rgba(212, 168, 67, 0.25) !important;
}

/* ── TYPOGRAPHIE ── */
body, .ab-page * {
  font-family: 'IBM Plex Sans', sans-serif !important;
}

h1, h2, h3, .ab-heading {
  font-family: 'IBM Plex Sans', sans-serif !important;
  font-weight: 700 !important;
  color: var(--caracol-noir) !important;
}

/* ── RADIOS / CHECKBOXES : noir par défaut, jaune au hover ── */
[class*="radio"],
[class*="checkbox"],
[class*="choice"] {
  color: var(--caracol-noir) !important;
  border-color: var(--caracol-noir) !important;
  text-decoration: none !important;
}

[class*="radio"] label,
[class*="checkbox"] label,
[class*="choice"] label {
  color: var(--caracol-noir) !important;
  text-decoration: none !important;
}

[class*="radio"]:hover,
[class*="checkbox"]:hover,
[class*="choice"]:hover {
  border-color: var(--caracol-jaune) !important;
  text-decoration: none !important;
}

[class*="radio"] label:hover,
[class*="checkbox"] label:hover,
[class*="choice"] label:hover {
  color: var(--caracol-jaune) !important;
  text-decoration: none !important;
}

/* Checkbox/radio coché : accent jaune */
input[type="radio"]:checked,
input[type="checkbox"]:checked {
  accent-color: var(--caracol-rouge-h) !important;
}