/* Survey — jetons de design. AUCUNE valeur de couleur, de rayon, d'espacement ou de
   police ailleurs que dans ce fichier.
   SOCLE SOMBRE ALLYO (décision Mathieu 12/09 : « s'inspirer du design de allyo, en
   version smartphone ») : mêmes valeurs que inc/espace-ui.php du socle, portées au
   téléphone. L'accent de marque (--s-brand) est injecté par le tenant. */
:root {
  /* Couleur — miroir du socle */
  --s-deep:     #060d1e;   /* fond */
  --s-navy:     #0c1c39;   /* barres */
  --s-card:     #111a2e;
  --s-surf:     #16213a;
  --s-pop:      #0b1424;
  --s-ink:      #eaf0fb;
  --s-muted:    #8ea2c8;
  --s-faint:    #5f7099;
  --s-line:     rgba(255,255,255,.10);
  --s-line-2:   rgba(255,255,255,.055);
  --s-field:    rgba(0,0,0,.28);
  --s-field-focus: rgba(0,0,0,.42);
  --s-mint:     #4fe3c1;   /* accent d'action */
  --s-mint-2:   #2bbfa0;
  --s-mint-ink: #03241d;   /* texte sur bouton mint */
  /* Témoins de la carte = mêmes couleurs que le calepinage Solaire (client.php TYPES). */
  --s-temoin-pdl:      #7c3aed;
  --s-temoin-onduleur: #0ea5e9;
  --s-temoin-tgbt:     #ea580c;
  --s-alerte:   #ff9a8b;
  --s-sky:      #7aa2ff;   /* état « en cours », comme au socle */
  --s-brand:    #4fe3c1;   /* repli — écrasé par la couleur du tenant */
  /* Fonds des pastilles d'état, du crédit de carte, flèche des listes déroulantes */
  --s-st-cours-fond: rgba(122,162,255,.18);
  --s-st-fait-fond:  rgba(79,227,193,.16);
  --s-attribution:   rgba(6,13,30,.75);
  --s-attente-opacite: .55;  /* vignette d'une photo pas encore envoyée (file hors-ligne) */
  --s-fleche: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%234fe3c1" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m6 9 6 6 6-6"/></svg>');
  --s-survol: var(--s-card);  /* ligne de menu survolée */
  --s-theme-color: #060d1e;  /* barre d'état du téléphone (meta theme-color, relue par le script) */
  color-scheme: dark;

  /* Typographie — les trois familles du socle, servies en local (public/fonts) */
  --s-display:  'Sora', system-ui, sans-serif;
  --s-texte:    'Plus Jakarta Sans', system-ui, sans-serif;
  --s-mono:     'JetBrains Mono', ui-monospace, monospace;

  /* Base FIXE 14 px (Mathieu 27/07) — aucun grossissement avec la largeur */
  --s-t-base:    14px;
  --s-t-titre:   clamp(1.4rem, 3.4vw, 1.9rem);
  --s-t-sous:    1.08rem;
  --s-t-texte:   .95rem;
  --s-t-petit:   .82rem;
  --s-t-kicker:  .68rem;
  --s-t-num:     .74rem;      /* numéros mono des questions */
  --s-t-discours: clamp(1.7rem, 3.2vw, 2.4rem);

  --s-i-titre:   1.15;
  --s-i-texte:   1.6;
  --s-l-titre:   -.03em;
  --s-l-kicker:  .2em;
  --s-l-num:     .08em;

  /* Espacement */
  --s-e-1:  .5rem;
  --s-e-2:  1rem;      /* gouttière latérale */
  --s-e-3:  1.6rem;
  --s-e-4:  2.4rem;

  /* Rayons — hiérarchisés */
  --s-r-carte:  18px;
  --s-r-champ:  11px;
  --s-r-pastille: 999px;
  --s-r-mini:   50%;

  /* Cible tactile — convention socle */
  --touch-min: 44px;
  --touch-large: 56px;   /* action de contact au pouce (appeler, SMS, itinéraire) */

  /* Coque : barre haute + barre basse, du téléphone au PC */
  --s-haut-h:       56px;
  --s-bas-h:        calc(var(--touch-min) + 8px);
  --s-contenu-max:  64rem;
  --s-mini:         2rem;
  --s-flottant:     3.25rem;

  /* Le geste : la colonne des numéros (fil mono continu 01 → n), comme au constructeur */
  --s-fil:          3.2rem;   /* largeur de la colonne des numéros */

  /* Écrans d'authentification — panneau de marque : encre profonde fixe + photo en luminance */
  --s-marque-fond:    #0B0F14;
  --s-auth-colonne:   clamp(21rem, 38%, 34rem);
  --s-auth-marge:     3rem;
  --s-photo-opacite:  .34;
  --s-photo-cadrage:  50% 40%;
}

/* Thème CLAIR (menu du commercial « Thème clair ») — mêmes valeurs que le thème clair du
   socle (inc/espace-ui.php), clé localStorage commune `allyo-theme` = 'light' posée sur
   <html data-theme="light"> avant le premier rendu. Les barres passent en blanc : elles
   portent du texte à l'encre, et le logo servi est la variante pour fond clair. */
html[data-theme=light] {
  --s-deep:     #eef1f7;
  --s-navy:     #ffffff;
  --s-card:     #ffffff;
  --s-surf:     #e9edf6;
  --s-pop:      #ffffff;
  --s-ink:      #17223a;
  --s-muted:    #54648a;
  --s-faint:    #5f6e90;
  --s-line:     rgba(12,28,57,.16);
  --s-line-2:   rgba(12,28,57,.08);
  --s-field:    rgba(12,28,57,.05);
  --s-field-focus: rgba(12,28,57,.09);
  --s-mint:     #0b7a65;
  --s-mint-2:   #096a58;
  --s-mint-ink: #ffffff;
  --s-alerte:   #b8382a;
  --s-sky:      #3559c7;
  --s-st-cours-fond: rgba(53,89,199,.12);
  --s-st-fait-fond:  rgba(11,122,101,.12);
  --s-attribution:   rgba(255,255,255,.85);
  --s-fleche: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%230b7a65" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m6 9 6 6 6-6"/></svg>');
  --s-survol: var(--s-surf);
  --s-theme-color: #ffffff;
  color-scheme: light;
}
/* Le panneau de marque des écrans d'auth reste sur son encre profonde fixe. */
html[data-theme=light] .s-authmarque { --s-ink: #eaf0fb; --s-muted: #8ea2c8; --s-faint: #8391b0; }
