/* =======================================================
   LimeSurvey 3.28 — Thème IARA (custom.css) — VERSION COMPACTE
   Allégé, accessible, sans aplats agressifs
   -------------------------------------------------------
   À placer dans : /upload/themes/survey/iara/css/custom.css
   Puis : Admin > Thèmes > Reconstruire les caches
   ======================================================= */

/* ========== Variables (palette + rythme) ========== */
:root{
  /* Couleurs IARA */
  --iara-orange:      #f26c1f;  /* normal */
  --iara-orange-550:  #e05512;  /* hover */
  --iara-orange-600:  #d35400;  /* compat */
  --iara-orange-650:  #c44a00;  /* focus/active */
  --iara-orange-700:  #a84300;  /* compat */
  --iara-orange-750:  #a84300;  /* actif renforcé */

  --ink:#1d1d1b;
  --muted:#6b7280;
  --border:#e6e7eb;
  --bg:#fff;

  /* Teintes légères (sur fond blanc) */
  --tint-4: rgba(242,108,31,.04);
  --tint-6: rgba(242,108,31,.06);
  --tint-8: rgba(242,108,31,.08);

  /* Rythme */
  --radius: 10px;
  --space-2: .5rem;
  --space-3: .75rem;
  --space-4: 1rem;
  --space-6: 1.5rem;
}

/* ========== Base typographique ========== */
html { font-size: 100%; } /* respecte les préférences utilisateur */
body{
  color: var(--ink);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
h1, h2, h3, h4, h5, h6{
  font-family: inherit;
  font-weight: 500;
  line-height: 1.3;
  color: var(--ink);
  margin: .75em 0 .4em;       /* compact */
}
h1{ font-size: 2.4rem; }
h2{ font-size: 2rem; }
h3{ font-size: 1.6rem; }

/* ========== Titres de question ========== */
h2.question-title,
h3.question-title{
  color: var(--ink);
  font-weight: 600;
  border-bottom: 1px solid var(--border);
  padding-bottom: .2rem;       /* compact */
  margin-bottom: .5rem;        /* compact */
}

/* ========== Encarts intro / descriptions (légers) ========== */
.question-title-container,
.group-description.row.well.space-col{
  background: var(--tint-6);
  border-left: 4px solid var(--iara-orange);
  color: var(--ink);
  font-weight: 500;
  font-size: 1.125rem;         /* ≈18px */
  padding: .5rem .75rem;       /* compact */
  margin-bottom: .5rem;        /* compact */
}

/* ========== Asterisques (obligatoire) ========== */
.asterisk, .question .asterisk, .important-asterisk{
  color: #b42318;
  font-weight: 600;
  margin: 0 .4em 0 .3em;
  font-size: 1.1rem;
  vertical-align: middle;
}

/* ========== Champs / focus ========== */
.form-control, .ls-input, input[type="text"], select, textarea{
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: none;
}
.form-control:focus, .ls-input:focus, select:focus, textarea:focus{
  outline: 2px solid transparent;
  border-color: var(--iara-orange-600);
  box-shadow: 0 0 0 3px rgba(242,108,31,.2);
}

/* ========== Texte d’info (accessible) ========== */
.fruity .text-info{
  color: #000;
  font-size: 1rem;     /* 16px par défaut */
  line-height: 1.4;
  text-align:justify
}

/* ========== Boutons Oui/Non — version accessible IARA ========== */
.ls-answers .button-item{
  background: var(--iara-orange);
  color: #fff;
  border: 1px solid var(--iara-orange-650);
  border-radius: var(--radius);
  font-weight: 700;
  letter-spacing: .2px;
  padding: .5rem .75rem;       /* compact */
  transition: background .15s ease, box-shadow .15s ease, transform .06s ease;
}
.ls-answers .button-item:hover{ background: var(--iara-orange-550); }
/* Focus clavier très visible */
.ls-answers .button-item:focus{
  outline: 2px solid transparent;
  box-shadow: 0 0 0 3px #fff, 0 0 0 5px rgba(196,74,0,.6);
}
/* Actif / sélectionné */
.ls-answers .button-item.active{
  background: var(--iara-orange-750) !important;
  border-color: var(--iara-orange-750) !important;
  color: #fff;
  box-shadow: 0 0 0 3px #fff, 0 0 0 5px rgba(168,67,0,.65);
}
/* Désactivé */
.ls-answers .button-item[disabled],
.ls-answers .button-item.disabled{
  background: #e9ecef;
  color: #68707a;
  border-color: #d0d5da;
  cursor: not-allowed;
  opacity: 1;
}
/* Diviseur visuel adouci entre deux boutons collés */
.ls-answers .button-item + .button-item{ border-left-color: rgba(0,0,0,.08); }

@media (forced-colors: active){
  .ls-answers .button-item:focus{ outline: 2px solid Highlight; box-shadow: none; }
}

/* ========== Radios / Checkboxes (sans aplats agressifs) ========== */
.radio-list .radio input[type="radio"]:checked + label,
.checkbox-list .checkbox input[type="checkbox"]:checked + label{
  background: var(--tint-8);
  color: var(--ink);
  border-color: var(--iara-orange-600);
  font-weight: 600;
}

/* ========== Cartes de question / espacement ========== */
.question-item{
  padding-top: 0;                /* compact */
  padding-bottom: .5rem;         /* compact */
  background: transparent;
  border: 1px solid transparent;
}
.ls-question-container:hover{
  background: transparent;
  box-shadow: 0 2px 8px rgba(0,0,0,.06);
}

/* ========== Tables / matrices ========== */
.ls-answers th, .ls-answers td{ border-color: var(--border); }
.ls-answers tbody tr:nth-child(odd) td{ background: #fafafa; }

/* ========== Progress bar ========== */
.progress{
  height: .75rem;
  border-radius: 999px;
  background: #eef1f4;
}
.progress-bar{ background: var(--iara-orange); }

/* ========== Images responsives & textes d’accueil ========== */
.img-responsive{ display: block; max-width: 100%; height: auto; margin: 0 auto; }
.survey-welcome{
  text-align: justify !important;
  text-justify: inter-word;
  hyphens: auto;
}

/* ========== Liens (accessibilité + clarté) ========== */
a{
  color: #0645ad;
  text-decoration: underline;
}
a:hover,
a:focus{
  color: #071aef;
  text-decoration: underline;
}
a:visited{ color: #5a3696; }

/* Liens d’action secondaires (LoadAll / SaveAll) — normalisation forte */
a[data-limesurvey-submit*="saveall"],
a[data-limesurvey-submit*="loadall"],
a.ls-link-action.ls-link-saveall,
a.ls-link-action.ls-link-loadall{
  font-size: 1rem !important;
  line-height: 1.35 !important;
  font-weight: 500 !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  padding: 0 !important;
  margin: 0 !important;
  display: inline !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: none !important;
  box-shadow: none !important;
}
/* Si le thème ajoute des classes de bouton, on neutralise aussi */
a[data-limesurvey-submit*="saveall"].btn,
a[data-limesurvey-submit*="saveall"].btn-link,
a[data-limesurvey-submit*="loadall"].btn,
a[data-limesurvey-submit*="loadall"].btn-link{
  background: none !important;
  border: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
  text-decoration: underline !important;
  color: inherit !important;
}
/* États d’interaction sobres */
a[data-limesurvey-submit*="saveall"]:hover,
a[data-limesurvey-submit*="saveall"]:focus,
a[data-limesurvey-submit*="loadall"]:hover,
a[data-limesurvey-submit*="loadall"]:focus{
  text-decoration: underline !important;
  outline-offset: 2px;
}
/* Espace entre les deux liens d’action */
a[data-limesurvey-submit*="loadall"]{ margin-right: .75rem !important; }

/* ========== Accessibilité générale ========== */
:focus-visible{ outline: 3px solid rgba(242,108,31,.35); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce){
  *{ animation: none !important; transition: none !important; }
}

/* ========== Responsive ========== */
@media (max-width: 768px){
  .ls-answers table{ display: block; overflow-x: auto; }
  .btn, .ls-btn-action{ padding: .5rem .75rem; }
}

/* ===== MODE COMPACT VERTICAL UNIQUEMENT ===== */

/* Titres */
h1,h2,h3,h4,h5,h6{
  margin-block: .5em .25em !important; /* vertical only */
  margin-top:.5em !important; margin-bottom:.25em !important; /* fallback */
  line-height:1.2 !important;
}

/* Titres de question */
h2.question-title,h3.question-title{
  padding-block-end:.15rem !important;
  padding-bottom:.15rem !important;      /* fallback */
  margin-block-end:.35rem !important;
  margin-bottom:.35rem !important;        /* fallback */
}

/* Encarts intro / descriptions (garde L/R intacts) */
.question-title-container,
.group-description.row.well.space-col{
  padding-block:.35rem !important;
  padding-top:.35rem !important; padding-bottom:.35rem !important; /* fallback */
  margin-block-end:.4rem !important;
  margin-bottom:.4rem !important;          /* fallback */
}

/* Blocs de question */
.question-item{
  padding-block-start:0 !important; padding-block-end:.35rem !important;
  padding-top:0 !important; padding-bottom:.35rem !important;       /* fallback */
}

/* Paragraphes / listes à l'intérieur des questions */
.ls-question-container p,
.ls-question-container li,
.group-description p,
.group-description li{
  margin-block:.0 .35rem !important;
  margin-top:0 !important; margin-bottom:.35rem !important;         /* fallback */
  line-height:1.3 !important;
}
.ls-question-container p:last-child,
.ls-question-container ul:last-child,
.ls-question-container ol:last-child{
  margin-block-end:0 !important; margin-bottom:0 !important;        /* fallback */
}

/* Matrices / tableaux : padding vertical uniquement */
.ls-answers table>tbody>tr>td,
.ls-answers table>thead>tr>th{
  padding-block:.35rem !important;
  padding-top:.35rem !important; padding-bottom:.35rem !important;   /* fallback */
}

/* Boutons (Oui/Non…) : vertical uniquement */
.ls-answers .button-item{
  padding-block:.4rem !important;
  padding-top:.4rem !important; padding-bottom:.4rem !important;     /* fallback */
}

/* Barre de progression : marges verticales réduites */
.progress{
  margin-block:.35rem !important;
  margin-top:.35rem !important; margin-bottom:.35rem !important;     /* fallback */
}

/* “well” hérités (si présents) : vertical uniquement */
.well.space-col{
  margin-block:.4rem !important;
  margin-top:.4rem !important; margin-bottom:.4rem !important;       /* fallback */
  padding-block:.5rem !important;
  padding-top:.5rem !important; padding-bottom:.5rem !important;     /* fallback */
}

/* Dernière question : pas d'espace en bas */
.ls-question-container:last-of-type .question-item{
  padding-block-end:0 !important; padding-bottom:0 !important;       /* fallback */
}

/* Mobile : on ajuste seulement la hauteur des titres (pas la largeur) */
@media (max-width:768px){
  h1{ font-size:1.8rem !important; }
  h2{ font-size:1.4rem !important; }
  h3{ font-size:1.2rem !important; }
}