/* =============================================================================
   Himalaya Services — Feuille de style partagée
   -----------------------------------------------------------------------------
   Corrections transversales appliquées de façon identique sur les 4 pages :
   curseur natif, indicateur de focus, mouvement réduit, états de formulaire
   et état vide des filtres.
   ========================================================================== */

/* ── CURSEUR ──────────────────────────────────────────────────────────────
   Le pointeur natif n'est masqué QUE lorsque le curseur personnalisé est
   effectivement actif (classe ajoutée par js/site.js). Sans JavaScript, ou
   si le script échoue, le pointeur natif reste visible partout.
   Les champs de saisie conservent toujours le curseur texte.               */

body.has-custom-cursor { cursor: none; }
body.has-custom-cursor a,
body.has-custom-cursor button,
body.has-custom-cursor .skill-card,
body.has-custom-cursor .port-card,
body.has-custom-cursor .saas-card,
body.has-custom-cursor .proj-card,
body.has-custom-cursor .recent-card,
body.has-custom-cursor .car-btn,
body.has-custom-cursor .modal-close { cursor: none; }

/* Saisie de texte : curseur natif obligatoire (lisibilité + accessibilité). */
body.has-custom-cursor input,
body.has-custom-cursor textarea,
body.has-custom-cursor select,
body.has-custom-cursor [contenteditable] { cursor: auto !important; }

input, textarea, select { cursor: auto; }

/* ── FOCUS VISIBLE ──────────────────────────────────────────────────────
   Sans cet indicateur, un utilisateur clavier ne peut pas savoir où il se
   trouve (WCAG 2.4.7).                                                       */

:focus-visible {
  outline: 2px solid #7c8cf8;
  outline-offset: 3px;
  border-radius: 4px;
}

.saas-card:focus-visible,
.proj-card:focus-visible,
.recent-card:focus-visible,
.skill-card:focus-visible {
  outline: 2px solid #7c8cf8;
  outline-offset: 4px;
}

/* ── MOUVEMENT RÉDUIT ───────────────────────────────────────────────────
   Les animations décoratives permanentes sont désactivées à la demande de
   l'utilisateur (WCAG 2.3.3 / prefers-reduced-motion).                    */

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}

html.reduced-motion *,
html.reduced-motion *::before,
html.reduced-motion *::after {
  animation-duration: 0.001ms !important;
  animation-iteration-count: 1 !important;
  transition-duration: 0.001ms !important;
  scroll-behavior: auto !important;
}

/* ── ÉTATS DE FORMULAIRE ───────────────────────────────────────────────
   Les retours utilisateur (newsletter, formulaire de contact) sont annoncés
   via role="status"/"alert" et stylés de façon visible.                     */

.cform-error {
  display: none;
  margin: 0 0 16px;
  padding: 12px 16px;
  border-radius: 12px;
  border: 1px solid rgba(255, 138, 138, 0.4);
  background: rgba(196, 60, 60, 0.12);
  color: #ffc9c9;
  font-size: 12.5px;
  line-height: 1.6;
}
.cform-error.on { display: block; }

.foot-nl-msg {
  margin: 10px 0 0;
  font-size: 11px;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.45);
  min-height: 0;
}
.foot-nl-msg.is-error { color: #ffc9c9; }
.foot-nl-msg.is-ok { color: #a9e5b4; }
.foot-nl-link,
.f-ok-link {
  color: #8fa0ff;
  text-decoration: underline;
  text-underline-offset: 3px;
  font-weight: 600;
}
.f-ok-link { display: inline-block; margin-top: 10px; }

/* ── ÉTAT VIDE DES FILTRES ─────────────────────────────────────────────
   Un filtre sans correspondance doit l'indiquer explicitement.            */

.saas-empty,
.empty-state {
  display: none;
  padding: 40px 24px;
  text-align: center;
  border: 1px dashed rgba(255, 255, 255, 0.18);
  border-radius: 16px;
  color: rgba(255, 255, 255, 0.55);
  font-size: 14px;
}
.saas-empty.on,
.empty-state.on { display: block; }
