/* ════════════════════════════════════════════════════════════════
   FORMULAIRE DE SAISIE (labo) — sorti de style.css le 30/09/2026 : ces règles
   ne servent qu’à la fiche de prescription (index.html). Chargé APRÈS style.css
   par index.html seul : l’espace dentiste et le chat ne les téléchargent plus.
   Tout style propre au formulaire (#prescription-form, .ox-*, .acte-popup) va ICI.
   ════════════════════════════════════════════════════════════════ */
html[data-theme="dark"] .acte-popup-jaw button { background: var(--surface); border-color: var(--border); color: var(--ppx-c, var(--accent-text)); }
  html[data-theme="dark"] .acte-popup-jaw button.active { background: color-mix(in srgb, var(--ppx-a, var(--accent)) 22%, var(--surface)); color: var(--ppx-c, var(--accent-text)); border-color: var(--ppx-a, var(--accent)); }
  .ord-ck.ox-trace input:checked + .bx svg { animation: ordTrace var(--dur-fast) ease; }
  /* Bulle détail acte (clic droit) — cadre + en-tête déplaçable + champs scopés */
  .acte-popup { background:var(--surface); color:var(--text); border:1px solid var(--line); border-radius:12px;
    padding:12px 14px; box-shadow:0 12px 34px -8px color-mix(in srgb, var(--accent) 22%, transparent), 0 4px 14px rgba(0,0,0,.18); }
  .acte-popup-head { display:flex; align-items:center; justify-content:space-between; gap:8px;
    font-size:.74rem; font-weight:700; color:var(--accent-text); margin-bottom:10px; cursor:move; user-select:none; }
  .acte-popup-close { color:var(--muted); cursor:pointer; font-size:1rem; line-height:1; }
  /* Fenêtre des dents : icône de l'acte en grand. */
  .acte-popup-head:has(.ilx-acte) { font-size:.95rem; }
  .acte-popup-head:has(.ilx-acte) > span:first-child { display:flex; align-items:center; gap:10px; }
  .acte-popup-head .ilx-acte { --ilx-t:36px; flex:none; }
  .acte-popup-head .ilx-acte svg { width:var(--ilx-t); height:var(--ilx-t); }
  .acte-popup-close:hover { color:var(--text); }
  .acte-popup-lbl { font-size:.67rem; color:var(--muted); margin-bottom:4px; }
  .acte-popup-lbl .opt { font-style:italic; }
  .acte-popup-in { width:100%; box-sizing:border-box; padding:6px 9px; font-size:.78rem; font-family:inherit;
    border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--text);
    margin-bottom:8px; transition:border-color var(--dur-fast), box-shadow var(--dur-fast); }
  .acte-popup-sep { border-top:1px dashed var(--line); margin:8px 0 4px; padding-top:8px; }
  .acte-popup-sep .acte-popup-in { margin-bottom:4px; }
  .acte-popup-hint { font-size:.64rem; color:var(--muted); }
  .acte-popup input[type="text"]:focus, .acte-popup input[type="number"]:focus, .acte-popup-in:focus {
    outline:none; border-color:var(--accent); box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 18%, transparent); }
  .acte-popup-jaw { display:flex; gap:5px; margin-bottom:8px; }
  /* --ppx-a / --ppx-c : hooks de teinte posés par les popups clic droit qui
     réutilisent cette grammaire avec une autre couleur (ex. Scan = violet).
     Sans hook posé → accent tenant, comportement historique inchangé. */
  .acte-popup-jaw button {
    flex:1; padding:5px 4px; border-radius:8px; border:1px solid var(--line);
    background:var(--surface); cursor:pointer; font-size:0.75rem; font-weight:600; color:var(--ppx-c, var(--accent-text));
    transition:transform var(--dur-fast), border-color var(--dur-fast), background var(--dur-fast), box-shadow var(--dur-fast);
  }
  .acte-popup-jaw button:hover { transform:translateY(-1px); border-color:color-mix(in srgb, var(--ppx-a, var(--accent)) 45%, var(--line)); }
  .acte-popup-jaw button.active { background:color-mix(in srgb, var(--ppx-a, var(--accent)) 16%, var(--surface)); color:var(--ppx-c, var(--accent-text)); border-color:var(--ppx-a, var(--accent));
    box-shadow:0 0 0 1px color-mix(in srgb, var(--ppx-a, var(--accent)) 30%, transparent); }
  .acte-popup-jaw button:active { transform:translateY(0); }
  .acte-popup-jaw button:focus-visible { outline:2px solid color-mix(in srgb, var(--ppx-a, var(--accent)) 45%, transparent); outline-offset:1px; }
  .acte-popup-actions { display:flex; gap:6px; margin-top:2px; }
  .acte-popup-actions button { flex:1; padding:6px 8px; border-radius:8px; border:1px solid transparent; cursor:pointer; font-size:0.72rem; font-weight:700;
    transition:transform var(--dur-fast), filter var(--dur-fast), box-shadow var(--dur-fast); }
  .acte-popup-actions button:hover { transform:translateY(-1px); }
  .acte-popup-actions button:active { transform:translateY(0); }
  .acte-popup-ok { background:var(--accent); color:#fff; }
  .acte-popup-ok:hover { filter:brightness(1.08); box-shadow:0 8px 18px -8px color-mix(in srgb, var(--accent) 70%, transparent); }
  .acte-popup-clear { background:color-mix(in srgb, var(--danger) 10%, var(--surface)); color:var(--danger); border-color:color-mix(in srgb, var(--danger) 22%, transparent); }
  .acte-popup-clear:hover { background:color-mix(in srgb, var(--danger) 16%, var(--surface)); }

  /* 4. PRESCRIPTION — vue mobile (768px CSS du tel) : faire tenir TOUS les
        libellés sans coupe ni chevauchement (audit S24 27/06). Mesuré : 0 résidu. */

  /* a) Libellés d'actes (colonnes CONJOINTE/ADJOINTE) : par défaut white-space:nowrap
        (style.css ~1821) → les longs (« Céram. Rose Collet », « épaulement Céramique »,
        « CIRE D'OCCLUSION », « DENT À EXTRAIRE ») étaient COUPÉS dans leur sous-colonne.
        On GARDE une seule ligne (pas de repli → aucune hauteur perdue, demande Illan) et
        on réduit la police + resserre case/écart/padding + le padding inter-colonnes :
        tout tient sur une ligne. Mesuré : 0 coupe. (Scopé .grid2 → n'affecte PAS les
        options de finitions qui, elles, se replient dans leurs colonnes étroites.) */
  html.mobile-zoom-default #prescription-form .grid2 .ord-ck { font-size: 0.6rem; gap: 3px; padding: 1px 2px; }
  html.mobile-zoom-default #prescription-form .grid2 .ord-ck .bx { width: 14px; height: 14px; }
  html.mobile-zoom-default #prescription-form .grid2 > div:first-child { padding-right: 4px; }
  html.mobile-zoom-default #prescription-form .grid2 > div:last-child { padding-left: 4px; }

  /* b) En-têtes de groupe « … | ACKERS » : gardés sur UNE seule ligne (nowrap), police
        assez petite pour que « APP. RÉSINE | ACKERS » (le plus long) tienne dans la
        colonne. Évite le repli où « APP. RÉSINE » passait sur 2 lignes et le trait
        séparateur flottait avec un espace bizarre. */
  html.mobile-zoom-default #prescription-form .ord-h { white-space: nowrap; font-size: 0.55rem; gap: 3px; }
  html.mobile-zoom-default #prescription-form .ord-h span { white-space: nowrap; }
  html.mobile-zoom-default #prescription-form .ord-ack { font-size: 0.48rem !important; padding: 1px 3px !important; }

  /* c) En-têtes de la ligne finitions (Maquillage sillon / Point contact / Occlusion
        / Embrasure / Limite) : 5 colonnes serrées, les mots uniques (« Maquillage »,
        « Embrasure », « Occlusion ») dépassaient → police réduite + letter-spacing 0. */
  html.mobile-zoom-default #prescription-form .optrow .ord-oh { font-size: 0.42rem; letter-spacing: 0; line-height: 1.1; }
  /* options de la ligne finitions (« sous gingival » la plus longue) : police un
     poil réduite + repli pour ne pas déborder de la dernière colonne (Limite). */
  html.mobile-zoom-default #prescription-form .optrow .ord-ck { font-size: 0.6rem; }
  html.mobile-zoom-default #prescription-form .optrow .ord-ck .t { white-space: normal; line-height: 1.1; }

  /* d) Pastilles teinte : 26px figés coupaient « A3.5 » (4 car. en DM Mono).
        Élargies à 36px + police légèrement réduite (la section a la place). */
  html.mobile-zoom-default #prescription-form .teinte-mini.teinte-options { grid-template-columns: repeat(5, 36px); }
  html.mobile-zoom-default #prescription-form .teinte-mini .teinte-chip { width: 36px; font-size: 0.56rem; }

  /* ─ FORM-2 : formulaire — cibles teinte/saisie/actions.
       (On NE touche PAS la densité des colonnes actes = choix Illan documenté.) ─ */
  html.mobile-zoom-default #prescription-form #saisie-continue { width: 20px !important; height: 20px !important; }
  html.mobile-zoom-default #prescription-form #teinte-clear { font-size: 1.1rem; padding: 4px 8px; }
  html.mobile-zoom-default #prescription-form .actions .f2-reset,
  html.mobile-zoom-default #prescription-form .actions .f2-save { padding: 11px 20px; font-size: 0.9rem; }

/* ══ ORDONNANCE : sous-menus, tableaux, annexes dans les cartes (28/09/2026) ══════
   Refonte validée sur la maquette (tests/harnais/fiche-prescription.html), code dans
   js/ordonnance-sous-menus.js. Classes .ox-* (scopées à la fiche). Couleurs : celles
   des familles du catalogue DU LABO, lues sur --tnt / --tnt-t (classes tnt-<id>
   générées par catalogue.js, clair + nuit) — aucune couleur écrite ici. */
#prescription-form .ox-sbody { position: relative; }
#prescription-form .ox-reelles[hidden], #prescription-form [data-ox-slot][hidden], #prescription-form #piv-container[hidden] { display: none !important; }
/* « Annexes » dans la ligne du titre de chaque carte. */
.ox-plus { position: absolute; top: 10px; right: 11px; display: inline-flex; align-items: center; gap: 4px; }
.ox-alias { position: absolute; top: 10px; left: 11px; width: 26px; height: 24px; display: grid; place-items: center; padding: 0; border: 1px solid var(--border); border-radius: 7px; background: var(--surface); cursor: pointer; color: var(--muted);
  transition: border-color var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-out); }
.ox-alias:hover { border-color: var(--accent); transform: translateY(-1px); }
/* Le panneau des annexes d'une carte : une LIGNE par famille (nom à gauche, articles à droite). */
.ox-pan { margin: 0 0 8px; padding: 8px; border: 1px solid var(--border); border-radius: 9px; background: var(--surface); }
.ox-pan .in2 { width: 100%; box-sizing: border-box; }
.ox-rows { display: grid; grid-template-columns: 84px minmax(0, 1fr); gap: 5px 8px; align-items: start; margin-top: 7px; }
.ox-gt { --k: var(--tnt, var(--muted)); font-size: .52rem; font-weight: 800; line-height: 1.25; padding-top: 5px; letter-spacing: .04em; text-transform: uppercase; color: var(--tnt-t, var(--muted)); }
.ox-chipl { display: flex; flex-wrap: wrap; gap: 4px; }
.ox-chip { --k: var(--tnt, var(--accent)); display: inline-flex; align-items: center; gap: 6px; font: inherit; font-size: .72rem; font-weight: 700; padding: 3px 10px; border-radius: 8px; border: 1px solid color-mix(in srgb, var(--k) 40%, var(--border)); color: var(--tnt-t, var(--accent-text)); background: color-mix(in srgb, var(--k) 8%, var(--surface)); cursor: pointer; text-align: left;
  transition: background-color var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-out); }
.ox-chip:hover { background: color-mix(in srgb, var(--k) 16%, var(--surface)); transform: translateY(-1px); }
/* Allure d'un article du résumé IA. */
.ox-chip:has(.ox-chip-ic) { padding-left: 5px; }
.ox-chip-ic { flex: none; display: inline-flex; margin: -2px 0; }
.ox-chip-ic .ilx { --ilx-t: 22px; }
.ox-chip-ic .ilx svg { width: var(--ilx-t); height: var(--ilx-t); }
.ox-vide { font-size: .64rem; color: var(--muted); }
/* Une annexe ajoutée : dans SA carte, comme une case. */
.ox-anx { margin-top: 6px; padding-top: 6px; border-top: 1px dashed color-mix(in srgb, var(--accent) 25%, var(--border)); }
.ox-slot .anx-row, .ox-anx .anx-row { margin: 0; padding: 0; border: 0; background: none; }
.ox-slot .anx-detail { margin: 2px 0 4px 18px; }
/* Titres de famille : couleur de la famille, un trait fin SOUS LE MOT. */
#prescription-form .ord-h[data-ox-t] { color: var(--tnt-t); }
.ox-bas .ord-h, .ox-conj .grid2 > div > .ord-h { width: fit-content; padding-bottom: 1px; margin-bottom: 3px; border-bottom: 1px solid color-mix(in srgb, currentColor 45%, transparent); }
.ox-hs { margin-top: 6px; }
/* Toutes les cases du bas de l'adjointe sur le même bord (annexes sorties comprises). */
.ox-adj .ox-bas .ord-ck { padding-left: 2px; padding-right: 2px; }
.ox-adj #dent-extraire-container { padding-left: 0 !important; padding-right: 0 !important; }
/* Annexe sortie : couleur de SA famille. */
#prescription-form .ox-slot[data-ox-t] .ord-ck input:checked + .bx { background: var(--tnt); border-color: var(--tnt); box-shadow: none; }
#prescription-form .ox-slot[data-ox-t] .ord-ck:has(input:checked) { background: color-mix(in srgb, var(--tnt) 12%, var(--surface)); border-left-color: var(--tnt); }
#prescription-form .ox-slot[data-ox-t] .anx-jaw-b { color: var(--tnt-t); }
#prescription-form .ox-slot[data-ox-t] .anx-jaw-b:hover { border-color: color-mix(in srgb, var(--tnt) 45%, var(--border)); }
#prescription-form .ox-slot[data-ox-t] .anx-jaw-b.on { border-color: var(--tnt); background: color-mix(in srgb, var(--tnt) 14%, var(--surface)); box-shadow: 0 0 0 1px color-mix(in srgb, var(--tnt) 30%, transparent); }
/* Case sortie d'une autre famille (barre implantaire, contre-plaque : implants). */
.ox-slot-imp .ord-ck input:checked + .bx { background: var(--acte-imp-fg); border-color: var(--acte-imp-fg); box-shadow: none; }
.ox-slot-imp .ord-ck:has(input:checked) { background: color-mix(in srgb, var(--acte-imp-fg) 12%, var(--surface)); border-left-color: var(--acte-imp-fg); }

/* ── SOUS-MENU d'un item : la case (clic = le choix courant) + une flèche ronde ;
      dessous, les choix faits en pastilles, comme les dents d'une case. ── */
.ox-sm, .ox-sm-pop { --k: var(--tnt, var(--accent)); }
.ox-sm { margin: 0 0 1px; }
.ox-smh { display: flex; align-items: center; gap: 2px; }
.ox-smh > .ord-ck { flex: 0 1 auto; min-width: 0; margin: 0; }
.ox-smc { flex: none; display: grid; place-items: center; width: 17px; height: 17px; padding: 0; border-radius: 50%;
  border: 1px solid color-mix(in srgb, var(--k) 22%, var(--border)); background: color-mix(in srgb, var(--k) 5%, var(--surface));
  color: color-mix(in srgb, var(--k) 70%, var(--muted)); cursor: pointer;
  transition: background-color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-out); }
.ox-smc svg { width: 10px; height: 10px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; transition: transform var(--dur-base) var(--ease-out); }
.ox-smc:hover { border-color: var(--k); background: color-mix(in srgb, var(--k) 12%, var(--surface)); transform: translateY(-1px); }
.ox-smc:focus-visible { outline: 2px solid color-mix(in srgb, var(--k) 45%, transparent); outline-offset: 1px; }
.ox-sm.ouvert .ox-smc { background: var(--k); border-color: var(--k); color: var(--surface); }
.ox-sm.ouvert .ox-smc svg { transform: rotate(180deg); }
.ox-smb { display: flex; flex-wrap: wrap; gap: 3px; margin: 1px 0 3px 22px; cursor: pointer; }
.ox-smb .ord-teeth { white-space: nowrap; padding: 1px 4px; }
.ord-teeth.ox-pil { color: var(--tnt-t); background: color-mix(in srgb, var(--tnt) 10%, var(--surface)); }
.ox-sm .ox-smp input:checked + .bx { background: var(--k); border-color: var(--k); box-shadow: none; }
.ox-sm .ox-smp:has(input:checked) { background: color-mix(in srgb, var(--k) 12%, var(--surface)); border-left-color: var(--k); }
/* Porté par un TITRE (INLAY CORE, Onlay) : le titre + sa flèche. */
.ox-sm-t .ox-smh { gap: 4px; }
.ox-smt { cursor: pointer; margin: 0; }
.ox-conj .grid2 > div > .ox-sm-t { margin: 8px 0 3px; }
.ox-conj .grid2 > div > .ox-sm-t .ox-smt { width: fit-content; padding-bottom: 1px; border-bottom: 1px solid color-mix(in srgb, currentColor 45%, transparent); }
.ox-mat .ox-rh .ox-sm { margin: 0; }
.ox-mat .ox-rh .ox-smt { font-size: .64rem; line-height: 1.15; }
.ox-mat .ox-rh .ox-smb { margin-left: 0; }

/* Le panneau d'un sous-menu : ancré à l'item (pointe), en LIGNES souples (Illan, 28/09/2026 :
   « plus fluide ») — ni tuiles encadrées ni pied ; la couleur de la famille dans la pastille
   du titre, le survol et le choix. On ferme par ×, Échap ou un clic à côté. */
.ox-sm-pop { position: fixed; z-index: 2000; width: 244px; box-sizing: border-box; transform-origin: 20px 0;
  background: var(--surface); color: var(--text); border: 1px solid color-mix(in srgb, var(--k) 22%, var(--border)); border-radius: 14px;
  box-shadow: 0 16px 36px -16px color-mix(in srgb, var(--k) 42%, transparent), 0 2px 8px color-mix(in srgb, var(--text) 8%, transparent); font-family: inherit; }
.ox-sm-pop.en-haut { transform-origin: 20px 100%; }
.ox-sm-pop.is-opening { animation: oxSmIn var(--dur-enter) var(--ease-out); }
.ox-sm-pop.is-closing { animation: oxSmOut var(--dur-exit) var(--ease-out) forwards; }
.ox-pp-pt { position: absolute; left: 14px; top: -6px; width: 10px; height: 10px; background: var(--surface); transform: rotate(45deg);
  border: 1px solid color-mix(in srgb, var(--k) 22%, var(--border)); border-width: 1px 0 0 1px; border-radius: 2px 0 0 0; }
.ox-sm-pop.en-haut .ox-pp-pt { top: auto; bottom: -6px; border-width: 0 1px 1px 0; border-radius: 0 0 2px 0; }
.ox-pp-hd { position: relative; display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; padding: 10px 8px 4px 12px; }
.ox-pp-ey { display: flex; align-items: center; gap: 5px; font-size: .52rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; color: var(--tnt-t, var(--k)); }
.ox-pp-ey::before { content: ''; flex: none; width: 6px; height: 6px; border-radius: 50%; background: var(--k); }
.ox-pp-ey:empty { display: none; }
.ox-pp-ti { font-size: .82rem; font-weight: 700; letter-spacing: -.01em; margin-top: 1px; }
.ox-pp-hd .ox-pp-hint { margin-top: 1px; }
.ox-pp-x { flex: none; width: 22px; height: 22px; display: grid; place-items: center; border: 0; border-radius: 50%; background: none; color: var(--muted); cursor: pointer; font-size: .95rem; line-height: 1;
  transition: background-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out); }
.ox-pp-x:hover { background: color-mix(in srgb, var(--k) 12%, var(--surface)); color: var(--text); }
.ox-pp-bd { padding: 2px 6px 7px; }
.ox-pp-bd:empty { display: none; }
.ox-pp-grp[data-ox-t] { --k: var(--tnt); }
.ox-pp-grp + .ox-pp-grp { margin-top: 4px; padding-top: 2px; border-top: 1px solid color-mix(in srgb, var(--border) 70%, transparent); }
.ox-pp-gt { display: flex; align-items: baseline; gap: 5px; margin: 6px 6px 2px; font-size: .54rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; color: var(--muted); }
.ox-pp-grp[data-ox-t] .ox-pp-gt { color: var(--tnt-t); }
.ox-pp-gt i { font-style: normal; font-weight: 600; letter-spacing: 0; text-transform: none; }
.ox-tile { margin-top: 1px; border-radius: 9px; transition: background-color var(--dur-fast) var(--ease-out); }
.ox-tile:hover { background: color-mix(in srgb, var(--k) 7%, var(--surface)); }
.ox-tile.on { background: color-mix(in srgb, var(--k) 12%, var(--surface)); }
/* Article absent du Cogilog du labo : grisé, ne se coche pas (js/produits-annexes.js _anxAbsentCogilog). */
.ox-tile.off { opacity: .45; }
.ox-tile.off:hover { background: none; }
.ox-tile.off .ox-tile-b { cursor: not-allowed; }
.ox-tile-b { display: flex; align-items: center; gap: 9px; width: 100%; padding: 6px 8px; border: 0; background: none; color: var(--text); font: inherit; font-size: .74rem; text-align: left; cursor: pointer; border-radius: 9px; }
.ox-tile-b:focus-visible { outline: 2px solid color-mix(in srgb, var(--k) 45%, transparent); outline-offset: -2px; }
.ox-tile.on .ox-tile-n { font-weight: 700; }
.ox-tile-ic { flex: none; display: inline-flex; margin: -3px -2px -3px -2px; }
.ox-tile-ic .ilx { --ilx-t: 24px; }
.ox-tile-ic .ilx svg { width: var(--ilx-t); height: var(--ilx-t); }
.ox-tile-r { margin-left: auto; font-size: .62rem; font-weight: 700; color: var(--tnt-t, var(--k)); white-space: nowrap; }
.ox-tile-ck { flex: none; width: 15px; height: 15px; display: grid; place-items: center; border: 1.5px solid color-mix(in srgb, var(--k) 35%, var(--border)); border-radius: 5px; background: var(--surface);
  transition: background-color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-spring); }
.ox-tile-ck.un { border-radius: 50%; }
.ox-tile-b:hover .ox-tile-ck { border-color: var(--k); }
.ox-tile-b:active .ox-tile-ck { transform: scale(.88); }
.ox-tile-ck svg { width: 10px; height: 10px; fill: none; stroke: var(--surface); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; opacity: 0; transform: scale(.6);
  transition: opacity var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-out); }
.ox-tile.on .ox-tile-ck { background: var(--k); border-color: var(--k); }
.ox-tile.on .ox-tile-ck svg { opacity: 1; transform: none; }
.ox-tile-ctl { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 0 8px 8px 32px; }
/* Les réglages de l'item lui-même (arcade, dents du PEI) : en tête, sans case en double. */
.ox-self { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 4px 6px 6px; }
.ox-seg { flex: none; display: inline-flex; gap: 2px; padding: 2px; border-radius: 9px; background: color-mix(in srgb, var(--k) 8%, var(--surface)); }
.ox-seg button { display: inline-flex; align-items: center; gap: 3px; padding: 3px 7px; border: 0; border-radius: 7px; background: none; color: var(--muted); font: inherit; font-size: .68rem; cursor: pointer;
  transition: background-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out); }
.ox-seg button:hover { color: var(--text); background: color-mix(in srgb, var(--k) 12%, var(--surface)); }
.ox-seg button.active { background: var(--k); color: var(--surface); font-weight: 700; }
.ox-tile-ctl input, .ox-self input { flex: 1 1 auto; min-width: 72px; width: 60px; padding: 4px 8px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); color: var(--text); font: inherit; font-size: .7rem;
  transition: border-color var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out); }
.ox-tile-ctl input:focus, .ox-self input:focus { outline: none; border-color: var(--k); box-shadow: 0 0 0 3px color-mix(in srgb, var(--k) 16%, transparent); }
.ox-tile-ctl input[type="number"], .ox-self input[type="number"] { flex: none; width: 56px; }
.ox-pp-hint { font-size: .6rem; color: var(--muted); line-height: 1.3; }
.ox-pp-hint b { color: var(--text); font-weight: 600; }

/* ── Tableaux : l'intitulé de colonne écrit UNE fois, une case par croisement. Tout se
      cale en HAUT de sa ligne : une case qui prend ses dents dessous reste en face de son
      intitulé. ── */
.ox-mat { display: grid; align-items: start; gap: 1px 4px; }
.ox-mat > .ox-ch { align-self: end; }
.ox-mat > .ox-rh, .ox-mat > .ox-no { min-height: 22px; display: flex; align-items: center; }
.ox-mat > .ox-no { justify-content: center; }
.ox-mat .ox-ch { font-size: .64rem; font-weight: 700; letter-spacing: -.01em; color: color-mix(in srgb, var(--text) 85%, transparent); text-align: center; line-height: 1.1; padding-bottom: 2px; }
.ox-mat .ox-ch::first-letter { text-transform: uppercase; }
.ox-mat .ord-h.ox-rh { margin: 0; font-size: .64rem; white-space: normal; line-height: 1.15; }
.ox-mat .ox-c { position: relative; display: flex; justify-content: center; min-width: 0; }
.ox-onl { grid-template-columns: auto repeat(2, minmax(0, 1fr)); column-gap: 6px; margin: 8px 0 4px; }
.ox-onl .ox-ch { letter-spacing: -.01em; font-size: .58rem; }
.ox-mat .ox-c .ord-ck { align-content: flex-start; padding: 2px 1px; gap: 2px; flex-wrap: wrap; justify-content: center; border-left-width: 0; margin: 0; }
.ox-mat .ox-c .ord-teeth { padding: 1px 4px; }
.ox-mat .ox-c .ord-ck .t { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ox-mat .ox-c .acte-detail-badge { justify-content: center; white-space: nowrap; }
.ox-mat .ox-c .acte-detail-badge .ord-teeth { white-space: nowrap; }
.ox-mat .ox-no::before { content: '·'; color: color-mix(in srgb, var(--muted) 45%, transparent); font-weight: 800; }
.ox-mat .ox-c .anx-row { display: flex; flex-direction: column; align-items: center; }
.ox-mat .ox-c .anx-detail { position: absolute; top: 100%; right: 0; z-index: 6; width: max-content; margin: 2px 0 0; padding: 6px; background: var(--surface); border: 1px solid var(--border); border-radius: 8px; box-shadow: var(--shadow-md, 0 4px 14px rgba(0,0,0,.12)); }
.ox-mat .ox-c .anx-detail.ox-det-g { right: auto; left: 0; }
.ox-mat .ox-ch-imp { color: var(--acte-imp-fg); }
/* Adjointe : les ÉTAPES d'un appareil (montage, finition, fin. Valplast) en rose ; nu, grille
   et Ackers restent en noir (Illan, 28/09/2026). */
.sec-adj .ox-mat .ox-ch-etape { color: var(--rose); }
html:not(.mobile-zoom-default) .main-row .sbody .ox-mat > .ox-rh,
html:not(.mobile-zoom-default) .main-row .sbody .ox-mat > .ox-no { min-height: 32px; }
/* …sauf un titre de ligne d'un tableau (FACETTE) : il reste à la hauteur de ses cases. */
html:not(.mobile-zoom-default) .main-row .sbody .grid2 .ox-mat > .ord-h.ox-rh { margin-top: 0; }
.ox-mat .ox-cimp .ord-ck input:checked + .bx { background: var(--acte-imp-fg); box-shadow: none; }
.ox-mat .ox-cimp .ord-ck:has(input:checked) { background: color-mix(in srgb, var(--acte-imp-fg) 14%, var(--surface)); }
.ox-apg { grid-template-columns: auto repeat(6, min-content) min-content; justify-content: space-between; column-gap: 2px; margin: 0 0 6px; padding-bottom: 7px; border-bottom: 1.5px solid color-mix(in srgb, var(--accent) 15%, var(--border)); }
/* Petites options sur une ligne (scellée · transvissée, métal · céramisé). */
/* Sous-lignes (inlay core, onlay, facette, implant) : une par ligne, alignées (Illan, 28/09/2026). */
.ox-inl { display: flex; flex-direction: column; align-items: flex-start; }
.ox-inl > .ord-ck { margin: 0 0 1px; }
.ox-inl .ord-ck { padding: 1px 4px; gap: 4px; }
/* Implant en violet, comme dans le résumé IA et le catalogue. */
.ox-imp .ord-ck input:checked + .bx { background: var(--acte-imp-fg); box-shadow: none; }
.ox-imp .ord-ck:has(input:checked) { background: color-mix(in srgb, var(--acte-imp-fg) 14%, var(--surface)); border-left-color: var(--acte-imp-fg); }
.ox-imp [data-ox-sm="implant"] .ox-smh > .ord-ck .t { color: var(--acte-imp-fg); }
/* « Implant » écrit comme un titre de la fiche (EMPREINTE, INLAY CORE) : même taille, capitales,
   souligné — la case reste, elle porte les dents de l'implant (Illan, 28/09/2026). */
.ox-imp [data-ox-sm="implant"] .ox-smh > .ord-ck .t { font-size: .67rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase;
  padding-bottom: 1px; border-bottom: 1px solid color-mix(in srgb, currentColor 45%, transparent); }
html.mobile-zoom-default #prescription-form .ox-imp [data-ox-sm="implant"] .ox-smh > .ord-ck .t { font-size: .55rem; }
/* Le bas de l'adjointe (empreinte, réparation, gouttière, attachements, ortho) et les finitions : une majuscule
   à chaque item — à l'affichage seul, la valeur lue par l'IA et l'export ne change pas (Illan, 28/09/2026). */
/* Case dont l'article a SA couleur dans Actes & codes (refTeinteCase) : cochée, elle la prend. */
#prescription-form .ord-ck[data-case-t] input:checked + .bx { background: var(--tnt); border-color: var(--tnt); box-shadow: none; }
#prescription-form .ord-ck[data-case-t]:has(input:checked) { background: color-mix(in srgb, var(--tnt) 12%, var(--surface)); border-left-color: var(--tnt); }
#prescription-form .ord-ck[data-case-t]:has(input:checked) .t { color: var(--tnt-t); }
.ox-tile[data-ox-t] { --k: var(--tnt); }
/* Une majuscule à chaque option des sous-menus (Mâle, Femelle, Résine molle…), à l'affichage seul. */
.ox-tile-n::first-letter { text-transform: uppercase; }
#prescription-form .ox-bas .ord-ck .t::first-letter,
#prescription-form .optrow .ord-ck .t::first-letter { text-transform: uppercase; }
/* Femme / Homme : deux pastilles sur la ligne du nom. */
.rad.ox-sexe { margin: 0; gap: 4px; align-items: stretch; flex: none; display: flex; }
.ox-sexe label { display: inline-flex; align-items: center; padding: 0 7px; border: 1px solid var(--border); border-radius: 8px; cursor: pointer; background: var(--surface); position: relative; }
.ox-sexe input { position: absolute; opacity: 0; width: 0; height: 0; }
.ox-sexe .sx { margin: 0; font-size: .95rem; }
.ox-sexe label:has(input:checked) { background: color-mix(in srgb, var(--accent) 14%, var(--surface)); border-color: var(--accent); }
