/* =====================================================================
   MANIÈRE CUT PLUS — LE ROUGE REDEVIENT UN SIGNAL
   ---------------------------------------------------------------------
   À charger EN DERNIER, après mc-boutons.css. Comme elle, cette feuille
   ne renomme rien et ne touche à aucun HTML : elle réattribue des rôles.
   La retirer rend l'ancien état.

   CE QUI A ÉTÉ MESURÉ
   Le rouge machine apparaît 128 fois dans les feuilles de style. Il sert
   au bouton principal, à l'onglet actif, au profilé sélectionné, au
   badge d'essai, au bandeau d'essai, aux badges de quantité, au repère
   de colonne, aux titres de section, au focus de saisie, aux survols et
   à la décoration du portail.

   Sur le seul écran de calcul — celui où l'artisan passe ses journées —
   SEPT choses sont rouges en même temps. L'œil n'a plus aucun moyen de
   savoir où appuyer. Une couleur qui dit tout ne dit plus rien.

   LA RÉPARTITION RETENUE
     ROUGE MACHINE   ce qui coupe, et ce qui coûte une barre si on se
                     trompe : le bouton qui lance le plan, l'action
                     principale, et le repère de la colonne LARGEUR.
     LAITON          ce qui attend ou avertit : mode essai, échéance
                     proche, focus de saisie, titres de section.
     VERT            ce qui est acquis : abonnement actif, validé.
     ACIER           la structure et les données : quantités, cadres,
                     libellés secondaires.

   POURQUOI LA COLONNE « LARGEUR » GARDE LE ROUGE
   C'est le seul endroit de l'application où la couleur empêche une
   erreur coûteuse : saisir une hauteur dans la colonne largeur, c'est
   une barre d'aluminium perdue. Ce n'est pas de la décoration, c'est un
   garde-fou — il reste au même rang que le bouton qui coupe.
   ===================================================================== */

/* Les jetons de rôle (--role-couper, --role-attente…) sont maintenant
   définis dans mc-jetons.css, avec le reste du vocabulaire.
   
   Ils vivaient ici, et --role-couper valait var(--primary). Or --primary
   vaut désormais var(--role-couper) : la boucle rendait le jeton
   invalide et la couleur disparaissait purement et simplement. C'est le
   piège de l'aliasing — le sens doit toujours aller de l'ancien nom vers
   le canonique, jamais l'inverse. */

/* =====================================================================
   1. LE PROFILÉ SÉLECTIONNÉ CESSE DE CRIER
   ---------------------------------------------------------------------
   La puce active était un aplat rouge en dégradé, de la taille du bouton
   « Plan » et posée juste au-dessus de lui. Deux blocs rouges de même
   force sur le même écran, dont un seul déclenche quelque chose.

   Une sélection n'a pas besoin de crier : elle a besoin d'être
   distincte. Un fond légèrement relevé et un trait sous la puce
   suffisent — et c'est le geste du métier, le trait de crayon sous la
   cote qu'on retient.
   ===================================================================== */
.profile-chip.active,
.preset-chip.active,
/* .mcb-fam.on est la puce réellement employée aujourd'hui — celle du
   catalogue de profilés, en haut de l'écran de calcul. Son style est
   injecté par mc-menu.js dans une balise <style> ajoutée à l'exécution,
   donc APRÈS cette feuille dans le document : à spécificité égale, c'est
   elle qui gagnerait. On passe par le conteneur (.mcb-familles) pour
   ajouter une classe et reprendre la main.

   C'est le prix des styles injectés depuis le JavaScript : ils échappent
   à l'ordre des feuilles. Les ramener dans un fichier CSS fait partie du
   chantier 01. */
.mcb-familles .mcb-fam.on {
  background: var(--role-choisi-fond);
  background-image: none;
  border-color: var(--mc-line, #2C313B);
  color: var(--mc-ink, #F3F5F8);
  box-shadow: inset 0 -3px 0 var(--role-couper);
}

.profile-chip:hover:not(.active),
.preset-chip:hover:not(.active),
.mcb-familles .mcb-fam:hover:not(.on) {
  border-color: var(--role-structure);
  color: var(--mc-ink, #F3F5F8);
  background: rgba(255, 255, 255, .03);
}

/* =====================================================================
   2. LE BANDEAU D'ESSAI ET SON BADGE : UN AVERTISSEMENT, PAS UNE ALERTE
   ---------------------------------------------------------------------
   Le mode essai n'est ni un danger ni une action : c'est un état, et un
   état qui dure. En rouge, il criait aussi fort que le bouton qui coupe,
   en permanence, sur toutes les pages.
   ===================================================================== */
.trial-banner {
  background: var(--role-attente-fond);
  border-color: var(--role-attente-fil);
}
.trial-banner-text strong { color: var(--role-attente); }

#abo-badge,
.mc6-badge-essai,
.trial-badge {
  border-color: var(--role-attente) !important;
}

/* =====================================================================
   3. LES QUANTITÉS SONT DES DONNÉES, PAS DES ALERTES
   ---------------------------------------------------------------------
   Les badges « ×2 » de l'en-tête de tableau disent combien de morceaux
   couper. C'est une information, répétée sur toute la ligne. En rouge
   vif, ils tiraient l'œil autant que le repère de largeur, qui lui
   protège d'une vraie erreur.
   ===================================================================== */
.horizontal-table th:nth-child(n+4) {
  color: var(--role-structure);
}
.horizontal-table th:nth-child(n+4) .qty-badge {
  background: var(--role-structure);
  color: var(--bg, #0C0C0E);
}

/* =====================================================================
   4. LE FOCUS DE SAISIE
   ---------------------------------------------------------------------
   Un champ qui reçoit le curseur n'est pas une alerte. Le focus passe au
   laiton — visible, mais qui ne se confond pas avec ce qui coupe.

   EXCEPTION ASSUMÉE : les colonnes LARGEUR et HAUTEUR du tableau des
   cotes gardent leurs repères. C'est le seul endroit où la couleur
   empêche une erreur qui coûte une barre d'aluminium.
   ===================================================================== */
.v-input:focus,
.search-supplier-input:focus,
.setting-group input:focus,
.project-select:focus,
.cc-add-row input:focus,
.portal-input:focus,
.dv-input:focus,
.dv-select:focus,
.mc6-champ:focus,
.mm-champ:focus {
  border-color: var(--role-attente);
  box-shadow: 0 0 0 3px var(--role-attente-fond);
  outline: none;
}
.search-supplier-input:focus + svg { color: var(--role-attente); }

/* =====================================================================
   5. LES TITRES DE SECTION REDEVIENNENT DES TITRES
   ---------------------------------------------------------------------
   Un intitulé de section n'appelle aucune action : il range. En rouge,
   chaque titre entrait en concurrence avec le seul bouton qui compte.
   ===================================================================== */
.cc-section-title,
.vitrage-card-title,
.res-header,
.device-label,
.mcc-titre,
.mdc-titre {
  color: var(--role-attente);
}

/* =====================================================================
   6. CE QUI EST ACQUIS PASSE AU VERT
   ---------------------------------------------------------------------
   Abonnement actif, fiche vérifiée, partenaire en ligne : ce sont des
   états positifs et stables. Ils n'ont jamais rien eu à voir avec le
   rouge, ni avec le laiton de l'attente.
   ===================================================================== */
.mc6-etat-puce.ok,
.pt-etiq-verifie,
.an-verifie {
  background: var(--role-acquis);
}

/* =====================================================================
   7. CE QUI GARDE LE ROUGE, ET SEULEMENT CELA
   ---------------------------------------------------------------------
   Écrit noir sur blanc pour que la règle survive à la prochaine
   livraison : sans cette liste, le rouge repartira à la conquête du
   reste de l'application, un écran à la fois, sans que personne ne
   décide jamais de le faire.

       .btn-optimize      lancer le calcul
       .btn-add / -v-add  ajouter une baie, une dimension
       .btn-unlock        activer
       .btn-hero-primary  l'essai, sur le portail
       .btn-price-order   commander
       .dv-btn-primaire   générer le PDF
       .rp-faire          l'action du rappel
       --col-larg         le repère de la colonne LARGEUR
       .profile-chip.active  le trait sous le profilé choisi

   Tout le reste emploie le laiton, le vert ou l'acier.
   ===================================================================== */
