/* Logiciel, et non page web : le texte de l’interface ne se sélectionne pas et le curseur reste une
   flèche ; champs de saisie et blocs « selectable » (identifiants, clés à remettre) restent copiables. */
html {
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: transparent;
  cursor: default;
}
input,
textarea,
[contenteditable='true'],
.selectable,
.selectable * {
  -webkit-user-select: text;
  user-select: text;
}
.selectable {
  cursor: text;
}
img,
a,
svg {
  -webkit-user-drag: none;
}
/* Contrôles de formulaire : une apparence unique, conforme à la plateforme, sur tous les écrans.
 * Le comportement natif est conservé (clavier, lecteurs d’écran, longues listes de pays) ;
 * seule l’apparence change. Le préfixe #app / #overlay l’emporte sur les règles de contexte
 * plus anciennes sans recourir à !important.
 */
:root {
  color-scheme: light;
  --control-line: #cfdac7;
  --control-hover: #9fb592;
  --control-ring: 0 0 0 3px #2f6c5922;
  --chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%23577a4a' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  --tick: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m3.5 8.4 2.8 2.8 6.2-6.4' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  --calendar: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 6h16v14H4z M8 3v5 M16 3v5 M4 10h16' fill='none' stroke='%23577a4a' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* Listes de choix */
:is(#app, #overlay) select {
  appearance: none;
  -webkit-appearance: none;
  background-color: #fff;
  background-image: var(--chevron);
  background-repeat: no-repeat;
  background-position: right 11px center;
  background-size: 14px 14px;
  border: 1px solid var(--control-line);
  border-radius: 6px;
  color: var(--ink);
  padding-right: 34px;
  text-overflow: ellipsis;
  cursor: pointer;
  transition: border-color 0.15s, box-shadow 0.15s;
}
:is(#app, #overlay) select:hover {
  border-color: var(--control-hover);
}
:is(#app, #overlay) select:focus,
:is(#app, #overlay) select:focus-visible {
  outline: none;
  border-color: var(--green);
  box-shadow: var(--control-ring);
}
:is(#app, #overlay) select:disabled {
  cursor: not-allowed;
  background-color: var(--soft);
  color: var(--muted);
}
:is(#app, #overlay) select:invalid {
  color: var(--muted);
}
:is(#app, #overlay) option {
  color: var(--ink);
}

/* L’apparence ne décide jamais de l’affichage : un sélecteur masqué par son contexte le reste. */
:is(#app, #overlay) select[hidden] {
  display: none;
}

/* Le menu ouvert est celui de la plateforme (public/select.js), dans tous les moteurs. */

/* Cases à cocher et boutons radio */
:is(#app, #overlay) input[type='checkbox'],
:is(#app, #overlay) input[type='radio'] {
  appearance: none;
  -webkit-appearance: none;
  flex: none;
  width: 18px;
  height: 18px;
  min-width: 18px;
  min-height: 18px;
  margin: 0;
  padding: 0;
  border: 1.5px solid var(--control-hover);
  background: #fff;
  vertical-align: middle;
  cursor: pointer;
  transition: background-color 0.15s, border-color 0.15s, box-shadow 0.15s;
}
:is(#app, #overlay) input[type='checkbox'] {
  border-radius: 4px;
}
:is(#app, #overlay) input[type='radio'] {
  border-radius: 50%;
}
:is(#app, #overlay) input[type='checkbox']:checked {
  background: var(--green) var(--tick) center / 13px 13px no-repeat;
  border-color: var(--green);
}
:is(#app, #overlay) input[type='radio']:checked {
  border-color: var(--green);
  background: radial-gradient(circle, var(--green) 0 4.5px, #fff 5px);
}
:is(#app, #overlay) input[type='checkbox']:hover,
:is(#app, #overlay) input[type='radio']:hover {
  border-color: var(--green);
}
:is(#app, #overlay) input[type='checkbox']:focus-visible,
:is(#app, #overlay) input[type='radio']:focus-visible {
  outline: none;
  box-shadow: var(--control-ring);
}
:is(#app, #overlay) input[type='checkbox']:disabled,
:is(#app, #overlay) input[type='radio']:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}
/* Les choix illustrés gardent leur carte : le bouton radio reste invisible, la carte porte l’état. */
:is(#app, #overlay) .choice-option input[type='radio'] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

/* Dates, mois, nombres */
:is(#app, #overlay) input[type='date'],
:is(#app, #overlay) input[type='month'] {
  color: var(--ink);
  min-height: 38px;
}
:is(#app, #overlay) input[type='date']::-webkit-calendar-picker-indicator,
:is(#app, #overlay) input[type='month']::-webkit-calendar-picker-indicator {
  width: 16px;
  height: 16px;
  padding: 2px;
  border-radius: 4px;
  background: var(--calendar) center / 16px 16px no-repeat;
  color: transparent;
  opacity: 1;
  cursor: pointer;
}
:is(#app, #overlay) input[type='date']::-webkit-calendar-picker-indicator:hover,
:is(#app, #overlay) input[type='month']::-webkit-calendar-picker-indicator:hover {
  background-color: var(--soft);
}
:is(#app, #overlay) input[type='date']::-webkit-datetime-edit-fields-wrapper,
:is(#app, #overlay) input[type='month']::-webkit-datetime-edit-fields-wrapper {
  padding: 0;
}
:is(#app, #overlay) input[type='number'] {
  -moz-appearance: textfield;
  appearance: textfield;
}
:is(#app, #overlay) input[type='number']::-webkit-inner-spin-button,
:is(#app, #overlay) input[type='number']::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Fichiers : le bouton du sélecteur reprend le bouton secondaire de la plateforme. */
:is(#app, #overlay) input[type='file'] {
  color: var(--muted);
  font-size: 11px;
  cursor: pointer;
}
:is(#app, #overlay) input[type='file']::file-selector-button {
  font: inherit;
  font-size: 11px;
  font-weight: 500;
  color: var(--ink);
  background: #fff;
  border: 1px solid #d7dfd7;
  border-radius: 5px;
  padding: 9px 13px;
  margin-right: 12px;
  cursor: pointer;
  transition: border-color 0.15s, background-color 0.15s;
}
:is(#app, #overlay) input[type='file']::file-selector-button:hover {
  border-color: var(--control-hover);
  background: var(--soft);
}

/* Zones de saisie : même bordure que les listes. */
:is(#app, #overlay) textarea {
  border-color: var(--control-line);
  border-radius: 6px;
}

/* Barres de défilement fines et teintées (épaisses et grises par défaut sous Windows). */
* {
  scrollbar-width: thin;
  scrollbar-color: #c3d1bd transparent;
}

@media (prefers-reduced-motion: reduce) {
  :is(#app, #overlay) select,
  :is(#app, #overlay) select::picker-icon,
  :is(#app, #overlay) input[type='checkbox'],
  :is(#app, #overlay) input[type='radio'],
  :is(#app, #overlay) input[type='file']::file-selector-button {
    transition: none;
  }
}

/* Tableaux dans une fenêtre étroite (taille minimale de l’application : 1024 px) : marges
 * resserrées, titres sur deux lignes ; la colonne de la flèche, purement décorative, laisse
 * sa place aux données. La ligne entière reste cliquable. */
@media (max-width: 1180px) {
  :is(#app, #overlay) .table th,
  :is(#app, #overlay) .table td {
    padding-left: 9px;
    padding-right: 9px;
  }
  :is(#app, #overlay) .table th {
    white-space: normal;
  }
  :is(#app, #overlay) .table th:last-child:empty,
  :is(#app, #overlay) .table td:last-child:has(> svg.icon:only-child) {
    display: none;
  }
}