/* ============================================================================
 * paramIngredient.css — TripCooking · « Paramètres des ingrédients »
 * ----------------------------------------------------------------------------
 * v2 — thème SOMBRE « épices ». Structure ISOLÉE sous le namespace « #tcxRoot »
 * (marqueur posé sur .param-page) afin qu'AUCUN style global du site ne puisse
 * repeindre la structure. Les classes des FORMULAIRES et des MODALES ne sont
 * pas modifiées : leurs règles restent globales et intactes.
 * Astuce : les cartes de modales redéfinissent localement les jetons de surface
 * (--tcx-card, --tcx-field, --tcx-text…) → mêmes règles = sombre sur la page / clair en modale.
 * ========================================================================== */

:root{
  --tcx-saffron:#E8A33D; --tcx-harissa:#C6402E; --tcx-harissa-2:#E0563E;
  --tcx-primary:var(--tcx-harissa); --tcx-primary-deep:#9E2E1D; --tcx-primary2:var(--tcx-saffron);
  --tcx-primary-soft:rgba(232,163,61,.14); --tcx-primary-soft-2:rgba(232,163,61,.22);
  --tcx-ok:#5FBF7A; --tcx-danger:#E0565B; --tcx-danger-soft:rgba(224,86,91,.16);

  --tcx-ink:#0F0E13; --tcx-ink-2:#17161D; --tcx-bg:var(--tcx-ink);
  --tcx-card:#1E1D26; --tcx-card-strong:#26242F; --tcx-field:#26242F;
  --tcx-border:#2E2C39; --tcx-border-2:#242230; --tcx-border-strong:rgba(232,163,61,.5);
  --tcx-text:#F3F0EA; --tcx-muted:#9B98A8; --tcx-muted-2:#6C6A78;

  --tcx-shadow:0 18px 40px -22px rgba(0,0,0,.75);
  --tcx-shadow2:0 10px 30px -18px rgba(0,0,0,.7);
  --tcx-shadow-pop:0 34px 80px -24px rgba(0,0,0,.85);
  --tcx-r:18px; --tcx-r2:22px; --tcx-rsm:14px;
  --tcx-focus:0 0 0 3px rgba(232,163,61,.24);
  --tcx-ui:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,"Apple Color Emoji","Segoe UI Emoji";
  --tcx-mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
}

*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
body{
  min-height:100vh; font-family:var(--tcx-ui); color:var(--tcx-text);
  background:
    radial-gradient(1100px 520px at 82% -8%, rgba(232,163,61,.12), transparent 60%),
    radial-gradient(900px 480px at 0% 4%, rgba(198,64,46,.12), transparent 55%),
    var(--tcx-bg);
  overflow-x:hidden;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
button,input,select,textarea{ font:inherit; }
button{ cursor:pointer; border:0; background:none; color:inherit; }
[hidden]{ display:none !important; }

@keyframes tcSpin{ to{ transform:rotate(360deg); } }
@keyframes tcPopIn{ from{ opacity:0; transform:translateY(8px) scale(.975); } to{ opacity:1; transform:none; } }
@keyframes tcFade{ from{ opacity:0; } to{ opacity:1; } }


/* =========================================================
   FOND DE PAGE (insurance : dark même si le body est surchargé)
========================================================= */
.tcx-bg{ min-height:100vh; padding:26px 20px 120px;
  background:
    radial-gradient(1100px 520px at 82% -8%, rgba(232,163,61,.10), transparent 60%),
    radial-gradient(900px 480px at 0% 4%, rgba(198,64,46,.10), transparent 55%),
    var(--tcx-ink); }
.tcx-bg .parametre-shell,
.parametre-shell{ max-width:1240px; margin:0 auto; }
#tcxRoot{ margin-top:8px; }


/* =========================================================
   ISOLATION — tout ce qui suit est scopé sous #tcxRoot et prime
   sur le thème global du site (couleurs fixées explicitement).
========================================================= */

/* Fil d'ariane + titre */
#tcxRoot .ps-crumb{ display:flex; align-items:center; gap:8px; font-weight:700; font-size:13px; color:var(--tcx-muted-2); margin:2px 2px 14px; flex-wrap:wrap; }
#tcxRoot .ps-crumb a{ color:var(--tcx-muted-2) !important; }
#tcxRoot .ps-crumb a:hover{ color:var(--tcx-muted) !important; }
#tcxRoot .ps-crumb .sep{ color:var(--tcx-muted-2); opacity:.6; }
#tcxRoot .ps-crumb b{ color:var(--tcx-saffron) !important; font-weight:700; }

#tcxRoot .ps-pagehead{ display:flex; align-items:flex-end; justify-content:space-between; gap:16px; flex-wrap:wrap; margin:0 2px 22px; }
#tcxRoot .ps-pagehead__ttl h1{ margin:0; font-size:32px; font-weight:800; letter-spacing:-.02em; color:var(--tcx-text) !important; }
#tcxRoot .ps-pagehead__sub{ margin-top:6px; display:flex; align-items:center; gap:8px; color:var(--tcx-muted) !important; font-weight:600; }
#tcxRoot .ps-pagehead__sub span{ color:var(--tcx-muted) !important; }
#tcxRoot .ps-pagehead__acts{ display:flex; align-items:center; gap:10px; }

/* Boutons (page + modales : sélecteur combiné, couleurs par variables) */
#tcxRoot .tc-btn, #tcxRoot .option-btn, #tcxRoot .btnSmall,
.param-modal__card .tc-btn, .tc-modal__card .tc-btn, .modalParametreContent .tc-btn, .tc-qty__card .tc-btn, .etapePhoto-card .tc-btn,
.param-modal__card .option-btn, .param-modal__card .btnSmall, .etapePhoto-card .etapePhoto-cancel{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  min-height:40px; padding:10px 15px; border-radius:12px; font-weight:700; white-space:nowrap;
  background:var(--tcx-card-strong); color:var(--tcx-text) !important; border:1px solid var(--tcx-border);
  box-shadow:var(--tcx-shadow2);
  transition:transform .12s ease, background .12s ease, box-shadow .12s ease, filter .12s ease, border-color .12s ease; }
#tcxRoot .tc-btn:hover, #tcxRoot .option-btn:hover, #tcxRoot .btnSmall:hover,
.param-modal__card .tc-btn:hover, .etapePhoto-card .etapePhoto-cancel:hover{ transform:translateY(-1px); border-color:var(--tcx-muted-2); }

#tcxRoot .tc-btn-primary, #tcxRoot .post-button,
.param-modal__card .tc-btn-primary, .tc-modal__card .tc-btn-primary, .tc-qty__card .tc-qty__submit,
.etapePhoto-card .etapePhoto-submit, .param-modal__card .post-button{
  border:none !important; color:#1a0f0a !important;
  background:linear-gradient(135deg,var(--tcx-harissa),var(--tcx-saffron)) !important;
  box-shadow:0 14px 28px -12px rgba(232,163,61,.7) !important; }
#tcxRoot .tc-btn-primary:hover, .param-modal__card .tc-btn-primary:hover{ transform:translateY(-1px); filter:brightness(1.05); }
#tcxRoot .tc-btn-wide, .param-modal__card .tc-btn-wide{ width:100%; }

/* Enregistrer (haut + liste) : rouge harissa */
#tcxRoot #psSaveTop, #tcxRoot .ps-save, #tcxRoot #psSaveList, #tcxRoot .tcx-btn--tcx-primary{
  background:linear-gradient(135deg,var(--tcx-harissa),var(--tcx-harissa-2)) !important;
  box-shadow:0 14px 28px -12px rgba(198,64,46,.7) !important; color:#fff !important; border:none !important; }
#tcxRoot .tcx-btn--tcx-wide{ width:100%; }

/* ===== Barre de config (3 groupes) ===== */
#tcxRoot .param-config{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin:0 0 22px; }
#tcxRoot .cfg-group{ background:var(--tcx-ink-2) !important; border:1px solid var(--tcx-border-2) !important; border-radius:var(--tcx-r); padding:14px 16px; }
#tcxRoot .cfg-group__lbl{ font-family:var(--tcx-mono); font-size:10.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--tcx-muted-2) !important; margin-bottom:12px; }
#tcxRoot .cfg-chips{ display:flex; flex-wrap:wrap; gap:9px; }
#tcxRoot .cfg-chips .tc-btn, #tcxRoot .cfg-chips .option-btn{ min-height:38px; padding:8px 13px; border-radius:11px; font-size:13.5px; }

/* Badges / chips de structure (page uniquement) */
#tcxRoot .parametre-badge, #tcxRoot .tcx-chip{
  display:inline-flex; align-items:center; gap:8px; padding:8px 13px; border-radius:999px;
  background:var(--tcx-card-strong) !important; border:1px solid var(--tcx-border) !important; color:var(--tcx-text) !important; font-weight:700; font-size:13px; }
#tcxRoot .parametre-badgeBtn, #tcxRoot .tcx-chip--tcx-accent{
  background:rgba(232,163,61,.14) !important; border-color:rgba(232,163,61,.3) !important; cursor:pointer;
  transition:transform .12s ease, background .12s ease, border-color .12s ease; }
#tcxRoot .parametre-badgeBtn:hover, #tcxRoot .tcx-chip--tcx-accent:hover{ transform:translateY(-1px); background:rgba(232,163,61,.22) !important; border-color:rgba(232,163,61,.5) !important; }

/* ===== Bandeau résumé ===== */
#tcxRoot .param-summary{ display:grid; grid-template-columns:auto 1fr; gap:22px; align-items:center;
  padding:20px 22px; margin:0 0 22px; position:relative; overflow:hidden;
  background:
    radial-gradient(520px 260px at 92% 130%, rgba(198,64,46,.20), transparent 60%),
    linear-gradient(135deg,#211a17,#181620 60%) !important;
  border:1px solid var(--tcx-border) !important; border-radius:var(--tcx-r); box-shadow:var(--tcx-shadow); }
#tcxRoot .ps-emblem{ display:flex; align-items:center; gap:16px; min-width:0; }
#tcxRoot .ps-emblem__media{ width:96px; height:96px; flex:0 0 auto; border-radius:18px; overflow:hidden;
  border:1px solid var(--tcx-border); background:rgba(232,163,61,.08); background-size:cover; background-position:center; box-shadow:var(--tcx-shadow2); }
#tcxRoot .ps-emblem__id{ min-width:0; }
#tcxRoot .ps-emblem__cat{ font-size:11.5px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:var(--tcx-saffron) !important; }
#tcxRoot .ps-emblem__ttl{ margin:6px 0 10px; font-size:26px; font-weight:800; letter-spacing:-.015em; line-height:1.05; color:var(--tcx-text) !important; }
#tcxRoot .ps-emblem__badges{ display:flex; flex-wrap:wrap; gap:8px; }
#tcxRoot .ps-metrics{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
#tcxRoot .ps-metric{ position:relative; background:rgba(255,255,255,.04); border:1px solid var(--tcx-border); border-radius:14px; padding:13px 14px; }
#tcxRoot .ps-metric b{ font-size:26px; font-weight:800; line-height:1; display:block; letter-spacing:-.01em; color:var(--tcx-text) !important; }
#tcxRoot .ps-metric span{ font-size:11px; color:var(--tcx-muted) !important; text-transform:uppercase; letter-spacing:.06em; margin-top:6px; display:block; }
#tcxRoot .ps-metric .barmini{ height:6px; border-radius:999px; background:var(--tcx-ink-2); margin-top:10px; overflow:hidden; }
#tcxRoot .ps-metric .barmini i{ display:block; height:100%; border-radius:999px; background:linear-gradient(90deg,var(--tcx-harissa),var(--tcx-saffron)); }
#tcxRoot .ps-metric .param-icon-btn{ position:absolute; top:8px; right:8px; }

/* ===== Cartes (composer / étapes) — page ===== */
#tcxRoot .param-card{ background:var(--tcx-card) !important; border:1px solid var(--tcx-border-2) !important; border-radius:var(--tcx-r); box-shadow:var(--tcx-shadow); overflow:visible; }
#tcxRoot .param-card + .param-card{ margin-top:18px; }
#tcxRoot .param-card__head{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:15px 18px; background:transparent !important; border-bottom:1px solid var(--tcx-border-2) !important; }
#tcxRoot .param-card__title{ display:flex; align-items:center; gap:11px; min-width:0; }
#tcxRoot .param-card__title h2, #tcxRoot .param-card__title h3{ margin:0; font-size:1.02rem; font-weight:800; color:var(--tcx-text) !important; }
#tcxRoot .param-icon{ width:32px; height:32px; border-radius:11px; display:grid; place-items:center; background:rgba(232,163,61,.16) !important; color:var(--tcx-saffron) !important; font-weight:800; }
#tcxRoot .param-icon-btn{ width:34px; height:34px; border-radius:11px; display:grid; place-items:center; color:var(--tcx-muted) !important; background:transparent; transition:background .12s ease, color .12s ease; }
#tcxRoot .param-icon-btn:hover{ background:rgba(232,163,61,.12); color:var(--tcx-text) !important; }
#tcxRoot .param-muted{ color:var(--tcx-muted) !important; font-weight:600; }

/* ===== Recherche (composer) ===== */
#tcxRoot .tc-inline-search{ position:relative; padding:16px 18px; display:flex; align-items:center; gap:11px; }
#tcxRoot .tc-inline-search .tc-muted{ width:44px; height:44px; border-radius:12px; display:grid; place-items:center; flex:0 0 auto;
  background:linear-gradient(135deg,var(--tcx-harissa),var(--tcx-saffron)) !important; color:#1a0f0a !important; font-weight:700; border:0; }
#tcxRoot .form-control{ width:100%; border-radius:12px; border:1px solid var(--tcx-border) !important; background:var(--tcx-field) !important; padding:12px 13px; outline:none; color:var(--tcx-text) !important;
  transition:border-color .14s ease, box-shadow .14s ease, background .14s ease; }
#tcxRoot .form-control::placeholder{ color:var(--tcx-muted-2) !important; }
#tcxRoot .form-control:focus{ border-color:var(--tcx-border-strong) !important; box-shadow:var(--tcx-focus); }
#tcxRoot .tc-inline-search input[type="search"], #tcxRoot .tc-inline-search .chercheIngredient{ height:46px; padding:0 15px; }
#tcxRoot #resultatsIngredients.results{ margin:0 18px 16px; padding:10px; border-radius:14px; border:1px solid var(--tcx-border) !important; background:var(--tcx-card-strong) !important; box-shadow:var(--tcx-shadow); max-height:320px; overflow:auto; display:none; }
#tcxRoot #resultatsIngredients.results ul{ list-style:none; margin:0; padding:0; }
#tcxRoot #resultatsIngredients.results li{ display:flex; align-items:center; gap:10px; padding:10px; border-radius:12px; cursor:pointer; transition:background .12s ease, transform .10s ease; }
#tcxRoot #resultatsIngredients.results li:hover{ background:rgba(232,163,61,.10); transform:translateY(-1px); }

/* ===== Compartiments (cartes <details>) ===== */
#tcxRoot .param-comps-head{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin:8px 2px 14px; flex-wrap:wrap; }
#tcxRoot .param-comps-head h3{ margin:0; font-size:20px; font-weight:800; color:var(--tcx-text) !important; }
#tcxRoot .param-comps-head .hint{ font-size:12.5px; color:var(--tcx-muted-2) !important; }
#tcxRoot .param-comps{ display:flex; flex-direction:column; gap:16px; margin:0 0 30px; }

#tcxRoot .pc-comp{ border:1px solid var(--tcx-border-2); border-radius:var(--tcx-r); overflow:hidden; background:var(--tcx-card); box-shadow:var(--tcx-shadow); border-left:4px solid var(--tcx-spine,var(--tcx-saffron)); }
#tcxRoot .pc-head{ display:grid; grid-template-columns:auto 1fr auto; gap:18px; align-items:center; padding:15px 18px; cursor:pointer; list-style:none;
  background:linear-gradient(0deg, rgba(255,255,255,.015), rgba(255,255,255,.015)); }
#tcxRoot .pc-head::-webkit-details-marker{ display:none; }
#tcxRoot .pc-title{ display:flex; align-items:center; gap:11px; min-width:0; }
#tcxRoot .pc-dot{ width:11px; height:11px; border-radius:50%; flex:0 0 auto; }
#tcxRoot .pc-nm{ font-size:16px; font-weight:800; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:var(--tcx-text) !important; }
#tcxRoot .pc-n{ font-family:var(--tcx-mono); font-size:11px; background:var(--tcx-ink-2); border:1px solid var(--tcx-border); padding:3px 9px; border-radius:999px; color:var(--tcx-muted); }
#tcxRoot .pc-fill{ display:flex; align-items:center; gap:10px; justify-self:center; min-width:190px; }
#tcxRoot .pc-fill__t{ font-size:11.5px; color:var(--tcx-muted); white-space:nowrap; font-family:var(--tcx-mono); }
#tcxRoot .pc-bar{ flex:1; height:6px; border-radius:999px; background:var(--tcx-ink-2); overflow:hidden; min-width:70px; }
#tcxRoot .pc-bar i{ display:block; height:100%; }
#tcxRoot .pc-chev{ color:var(--tcx-muted-2); font-size:14px; transition:transform .18s ease; }
#tcxRoot .pc-comp[open] .pc-chev{ transform:rotate(180deg); }
#tcxRoot .pc-actions{ display:flex; gap:8px; padding:0 18px 4px; margin-top:12px; }
#tcxRoot .pc-add{ min-height:36px; padding:7px 13px; border-radius:10px; font-size:12.5px;
  background:var(--tcx-card-strong); color:var(--tcx-text) !important; border:1px solid color-mix(in srgb, var(--tcx-spine,var(--tcx-saffron)) 45%, var(--tcx-border)); }
#tcxRoot .pc-add:hover{ border-color:var(--tcx-spine,var(--tcx-saffron)); }
#tcxRoot .pc-body{ padding:8px 14px 14px; }

/* Tableau linéarisé (on garde <table>/<tr>/<td> pour le JS) */
#tcxRoot .pc-body .param-table-wrap{ overflow:visible; border:0; background:transparent; border-radius:0; }
#tcxRoot .pc-body .ingredientTable{ display:block; width:100%; min-width:0; border-collapse:separate; border-spacing:0; }
#tcxRoot .pc-body .ingredientTable thead{ display:none; }
#tcxRoot .pc-body .ingredientTable tbody{ display:flex; flex-direction:column; gap:9px; }
#tcxRoot .pc-body .ing-group{ display:none !important; }
#tcxRoot .pc-body tr.ing-row{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; padding:11px 13px; border-radius:var(--tcx-rsm);
  background:var(--tcx-card-strong) !important; border:1px solid var(--tcx-border-2) !important; border-left:3px solid var(--tcx-spine,transparent) !important;
  transition:transform .12s ease, border-color .12s ease; }
#tcxRoot .pc-body tr.ing-row:hover{ transform:translateX(2px); border-color:var(--tcx-border) !important; }
#tcxRoot .pc-body tr.ing-row td{ display:block; padding:0 !important; border:0 !important; background:transparent !important; }
#tcxRoot .pc-body tr.ing-row td:nth-child(1){ flex:0 0 auto; }
#tcxRoot .pc-body tr.ing-row td:nth-child(2){ flex:1 1 auto; min-width:120px; font-weight:700; color:var(--tcx-text) !important; }
#tcxRoot .pc-body tr.ing-row td:nth-child(3){ flex:0 0 auto; }
#tcxRoot .pc-body tr.ing-row td:nth-child(4){ flex:0 0 auto; color:var(--tcx-muted) !important; }
#tcxRoot .pc-body tr.ing-row td:nth-child(5){ flex:0 0 auto; }
#tcxRoot .pc-body tr.ing-row td:nth-child(6){ flex:0 0 auto; margin-left:auto; }

/* image d'ingrédient */
#tcxRoot .imageColumn{ width:auto; }
#tcxRoot .ingredientImageWrapper{ position:relative; width:52px; height:52px; border-radius:13px; overflow:hidden; border:1px solid var(--tcx-border); background:rgba(232,163,61,.10); }
#tcxRoot .ingredientAvatar{ width:100%; height:100%; object-fit:cover; }
#tcxRoot .editOverlay{ position:absolute; inset:auto 0 0 0; padding:3px 4px; background:rgba(15,14,19,.78); border-top:1px solid var(--tcx-border); font-size:.66rem; font-weight:700; text-align:center; color:var(--tcx-saffron) !important; opacity:0; transition:opacity .15s ease; }
#tcxRoot .ingredientImageWrapper:hover .editOverlay{ opacity:1; }
/* gramme + liens */
#tcxRoot .js-gramme-valeur{ display:inline-block; font-family:var(--tcx-mono); font-weight:700; font-size:.92rem; background:var(--tcx-ink-2) !important; border:1px solid var(--tcx-border) !important; border-radius:9px; padding:6px 10px; min-width:52px; text-align:center; color:var(--tcx-text) !important; }
#tcxRoot .modificationGramme, #tcxRoot .btnParametreType{ display:inline-block; margin-left:8px; color:var(--tcx-saffron) !important; font-weight:700; font-size:.8rem; border-bottom:1px dashed rgba(232,163,61,.45); }
#tcxRoot .modificationGramme:hover, #tcxRoot .btnParametreType:hover{ color:var(--tcx-harissa-2) !important; }
/* select compartiment */
#tcxRoot .selectPreparation{ min-width:150px; padding:9px 32px 9px 12px; border-radius:11px; border:1px solid var(--tcx-border) !important; background:var(--tcx-field) !important; color:var(--tcx-text) !important; outline:none; font-weight:600; font-size:12.5px; cursor:pointer;
  -webkit-appearance:none; appearance:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23E8A33D' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
  background-repeat:no-repeat; background-position:right 11px center; transition:border-color .14s ease, box-shadow .14s ease; }
#tcxRoot .selectPreparation:focus{ border-color:var(--tcx-border-strong) !important; box-shadow:var(--tcx-focus); }
/* supprimer */
#tcxRoot .btnDelete, #tcxRoot .supprimerIngredient{ display:inline-flex; align-items:center; gap:6px; color:var(--tcx-harissa-2) !important; font-weight:700; padding:7px 11px; border-radius:10px; border:1px solid transparent; white-space:nowrap; font-size:12.5px; background:transparent; transition:background .12s ease, border-color .12s ease; }
#tcxRoot .btnDelete:hover, #tcxRoot .supprimerIngredient:hover{ background:var(--tcx-danger-soft); border-color:rgba(224,86,91,.28); }

/* ===== Étapes (grille) ===== */
#tcxRoot .param-steps{ display:grid; grid-template-columns:1fr 1fr; gap:14px; padding:16px 18px 18px; }
#tcxRoot .param-steps > .param-muted, #tcxRoot .param-steps > .tcx-muted{ grid-column:1/-1; padding:16px 4px; text-align:center; color:var(--tcx-muted) !important; }
#tcxRoot .step-card{ background:var(--tcx-card-strong) !important; border:1px solid var(--tcx-border-2) !important; border-radius:var(--tcx-r); padding:16px; box-shadow:var(--tcx-shadow2); }
#tcxRoot .step-card-body{ display:flex; flex-direction:column; gap:10px; }
#tcxRoot .step-header{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
#tcxRoot .step-number{ font-weight:700; font-size:.74rem; letter-spacing:.05em; text-transform:uppercase; color:var(--tcx-saffron) !important; background:rgba(232,163,61,.16) !important; border:1px solid rgba(232,163,61,.32); border-radius:999px; padding:4px 11px; font-family:var(--tcx-mono); }
#tcxRoot .step-header .btnSmall{ margin-left:auto; min-height:32px; padding:6px 11px; border-radius:10px; font-size:.78rem; }
#tcxRoot .step-header .editStepBtn{ color:var(--tcx-saffron) !important; font-weight:700; font-size:.8rem; }
#tcxRoot .step-text{ color:#dcd9e2 !important; line-height:1.55; font-size:.92rem; }
#tcxRoot .step-controls{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding-top:10px; border-top:1px solid var(--tcx-border-2); }
#tcxRoot .sp-play{ border:1px solid var(--tcx-border); background:var(--tcx-ink-2); padding:9px 12px; border-radius:11px; color:var(--tcx-saffron) !important; font-weight:700; transition:transform .12s ease, background .12s ease; }
#tcxRoot .sp-play:hover{ transform:translateY(-1px); background:rgba(232,163,61,.1); }
#tcxRoot .sp-status{ color:var(--tcx-muted) !important; font-weight:700; font-family:var(--tcx-mono); font-size:.78rem; }


/* =========================================================
   PRIMITIVES DE FORMULAIRE (communes aux modales) — globales
========================================================= */
.tc-stack{ display:flex; flex-direction:column; gap:12px; }
.form-group{ display:flex; flex-direction:column; gap:7px; }
.form-group > label, .form-group .param-muted{ font-weight:700; font-size:.9rem; color:var(--tcx-text); }
.form-group .param-muted{ color:var(--tcx-muted); }
textarea.form-control{ min-height:110px; resize:vertical; line-height:1.5; }
select.form-control{ -webkit-appearance:none; appearance:none; padding-right:38px; cursor:pointer;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23E8A33D' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
  background-repeat:no-repeat; background-position:right 13px center; }
input[type="number"].form-control{ font-variant-numeric:tabular-nums; }

.param-row{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 14px; border-radius:12px; background:var(--tcx-primary-soft); border:1px solid rgba(232,163,61,.22); }
.param-meta{ display:flex; flex-direction:column; gap:2px; }
.param-meta .param-muted{ font-size:.8rem; }
.param-meta b{ font-weight:800; font-size:1.15rem; color:var(--tcx-primary-deep); font-family:var(--tcx-mono); }

.param-choice{ display:flex; align-items:center; gap:12px; padding:12px 14px; border-radius:12px; border:1px solid var(--tcx-border); background:var(--tcx-field); cursor:pointer; font-weight:700; transition:border-color .12s ease, background .12s ease, box-shadow .12s ease; }
.param-choice:hover{ border-color:rgba(232,163,61,.45); background:rgba(232,163,61,.06); }
.param-choice input[type="radio"]{ width:20px; height:20px; accent-color:var(--tcx-saffron); flex:0 0 auto; cursor:pointer; }
.param-choice:has(input:checked){ border-color:var(--tcx-saffron); background:var(--tcx-primary-soft-2); box-shadow:var(--tcx-focus); }
.param-choice:has(input:focus-visible){ box-shadow:var(--tcx-focus); }

.erreurType,.erreurEtape,.erreurTemps,.erreurDifficulte,.erreurCompartiment,.erreurMateriel,.erreurGeoloc,.tc-qty__error,.etapePhoto-message{ min-height:0; color:var(--tcx-danger); font-weight:700; font-size:.86rem; }
.erreurType:not(:empty),.erreurEtape:not(:empty),.erreurTemps:not(:empty),.erreurDifficulte:not(:empty),
.erreurCompartiment:not(:empty),.erreurMateriel:not(:empty),.erreurGeoloc:not(:empty),.tc-qty__error:not(:empty){ display:flex; align-items:center; gap:8px; padding:10px 12px; border-radius:12px; background:var(--tcx-danger-soft); border:1px solid rgba(224,86,91,.28); }
.erreurType:not(:empty)::before,.erreurEtape:not(:empty)::before,.erreurTemps:not(:empty)::before,.erreurDifficulte:not(:empty)::before,.erreurCompartiment:not(:empty)::before,.erreurMateriel:not(:empty)::before,.erreurGeoloc:not(:empty)::before,.tc-qty__error:not(:empty)::before{ content:"⚠"; font-size:.95rem; }

.loaderType,.loaderEtape,.loaderTemps,.loaderDifficulte,.loaderCompartiment,.loaderMateriel,.loaderGeoloc,.tc-qty__loader,.etapePhoto-loader{ display:flex; justify-content:center; align-items:center; padding:4px 0; }
.loaderType img,.loaderEtape img,.loaderTemps img,.loaderDifficulte img,.loaderCompartiment img,.loaderMateriel img,.loaderGeoloc img,.tc-qty__loader img,.etapePhoto-loader img,#loaderEtape img,#loader-photoEtape img{ width:30px; height:30px; animation:tcSpin .9s linear infinite; }
.submitEtape,.submitType,.submitPart{ display:flex; }
.submitEtape .tc-btn-wide,.submitType input[type="submit"],.submitPart input[type="submit"]{ width:100%; }


/* =========================================================
   SYSTÈME DE MODALES — globales (cartes = surface CLAIRE)
========================================================= */
body.modal-open{ overflow:hidden; }
.param-overlay,.tc-qty__overlay,#qtyOverlay,.etapePhoto-overlay{ position:fixed; inset:0; z-index:9998; background:rgba(6,4,10,.62); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); animation:tcFade .18s ease; }
.param-overlay[hidden],.tc-qty__overlay[hidden],#qtyOverlay[hidden],.etapePhoto-overlay[hidden]{ display:none !important; }
.param-modal,.tc-modal,.modalParametre,#qtyModal,.etapePhoto-modal{ position:fixed; inset:0; z-index:9999; display:flex; align-items:center; justify-content:center; padding:18px; }
.param-modal[hidden],.tc-modal[hidden],.modalParametre[hidden],#qtyModal[hidden],.etapePhoto-modal[hidden]{ display:none !important; }
.param-modal--tcx-with-bg,.modalParametre{ background:rgba(6,4,10,.62); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); }

.param-modal__card,.tc-modal__card,.modalParametreContent,.tc-qty__card,.etapePhoto-card{
  --tcx-card:rgba(255,255,255,.80); --tcx-card-strong:rgba(255,255,255,.97); --tcx-field:#ffffff;
  --tcx-border:rgba(120,80,200,.16); --tcx-border-2:rgba(31,26,42,.08); --tcx-border-strong:rgba(232,163,61,.55);
  --tcx-text:#1f1a2a; --tcx-muted:rgba(31,26,42,.62); --tcx-muted-2:rgba(31,26,42,.46);
  position:relative; width:min(620px,100%); max-width:100%; max-height:90vh; overflow:auto; margin:auto; color:var(--tcx-text);
  background:var(--tcx-card-strong); border-radius:22px; border:1px solid rgba(60,40,90,.14); box-shadow:var(--tcx-shadow-pop); padding:22px 22px 20px;
  animation:tcPopIn .22s cubic-bezier(.2,.8,.2,1); scrollbar-width:thin; scrollbar-color:var(--tcx-saffron) transparent; overscroll-behavior:contain; }
.param-modal__card::-webkit-scrollbar,.tc-modal__card::-webkit-scrollbar,.modalParametreContent::-webkit-scrollbar,.tc-qty__card::-webkit-scrollbar,.etapePhoto-card::-webkit-scrollbar{ width:10px; }
.param-modal__card::-webkit-scrollbar-thumb,.tc-modal__card::-webkit-scrollbar-thumb,.modalParametreContent::-webkit-scrollbar-thumb,.tc-qty__card::-webkit-scrollbar-thumb,.etapePhoto-card::-webkit-scrollbar-thumb{ background:linear-gradient(var(--tcx-harissa),var(--tcx-saffron)); border:2px solid transparent; border-radius:999px; background-clip:padding-box; }
.param-modal__card--tcx-xs{ width:min(560px,100%); }
.param-modal__card--tcx-sm{ width:min(520px,100%); }
.param-modal__card--tcx-md{ width:min(680px,100%); }
.param-modal__card--tcx-lg{ width:min(720px,100%); max-height:min(86vh,820px); }
#modalTemps .tc-modal__card,#difficulteModal .tc-modal__card{ width:min(520px,100%); }
#compartimentsModal .tc-modal__card{ width:min(620px,100%); }
#equipmentModal .tc-modal__card{ width:min(720px,100%); max-height:min(86vh,820px); }
#etapeModal .tc-modal__card{ width:min(680px,100%); }

.param-modal__header,.tc-modal__header{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding-right:55px; }
.param-modal__titleRow,.tc-modal__titleRow{ display:flex; align-items:center; gap:10px; }
.param-modal__titleRow .param-icon,.tc-modal__titleRow .param-icon{ width:38px; height:38px; border-radius:13px; font-size:1.1rem; background:rgba(232,163,61,.18); color:var(--tcx-harissa); }
.param-modal__title,.tc-modal__title{ margin:0; font-size:20px; font-weight:800; color:var(--tcx-text); }
.param-modal__subtitle,.tc-modal__subtitle{ margin:6px 0 0; font-size:14px; line-height:1.45; color:var(--tcx-muted); font-weight:500; }
.param-modal__body,.tc-modal__body{ margin-top:16px; }
.param-modal__close,.tc-modal__close{ position:absolute; top:14px; right:14px; width:42px; height:42px; border:none; border-radius:13px; background:rgba(198,64,46,.12); color:var(--tcx-harissa); font-size:22px; font-weight:800; line-height:1; display:flex; align-items:center; justify-content:center; transition:background .12s ease, transform .12s ease; }
.param-modal__close:hover,.tc-modal__close:hover{ background:rgba(198,64,46,.20); transform:rotate(90deg); }

/* param-card / muted / icon DANS une modale (surface claire) */
.param-modal__card .param-card,.tc-modal__card .param-card,.modalParametreContent .param-card{ box-shadow:none !important; border:1px solid var(--tcx-border) !important; border-radius:16px; background:var(--tcx-card) !important; }
.param-modal__card .param-card__head{ padding:12px 14px; background:transparent; border-bottom:1px solid var(--tcx-border-2); }
.param-modal__card .param-card__title h2{ font-size:15px; color:var(--tcx-text); }
.param-modal__card .param-muted,.tc-modal__card .param-muted{ color:var(--tcx-muted); }
.param-modal__card .param-icon,.tc-modal__card .param-icon{ background:rgba(232,163,61,.16); color:var(--tcx-harissa); }
.param-modal__card .form-control,.tc-modal__card .form-control,.tc-qty__card .form-control,.etapePhoto-card .form-control{
  width:100%; border-radius:12px; border:1px solid var(--tcx-border); background:var(--tcx-field); color:var(--tcx-text); padding:12px 13px; outline:none; }
.param-modal__card .form-control:focus{ border-color:var(--tcx-border-strong); box-shadow:var(--tcx-focus); }
.param-modal__card .form-control::placeholder{ color:var(--tcx-muted-2); }
.param-modal__card .tc-inline-search .tc-muted{ width:34px; height:34px; border-radius:11px; display:grid; place-items:center; background:rgba(232,163,61,.14); color:var(--tcx-harissa); border:1px solid rgba(232,163,61,.2); }


/* ===== Modale paramètre unité ===== */
.modalParametreContent{ width:min(520px,100%); padding:18px 18px 16px; }
.modalParametreContent h2{ margin:0 44px 14px 0; font-size:1.15rem; font-weight:800; }
.closeParametre{ position:absolute; top:12px; right:12px; width:40px; height:40px; border-radius:13px; display:grid; place-items:center; border:1px solid rgba(198,64,46,.2); background:rgba(198,64,46,.12); color:var(--tcx-harissa); font-size:22px; line-height:1; transition:background .12s ease, transform .12s ease; }
.closeParametre:hover{ background:rgba(198,64,46,.2); transform:rotate(90deg); }
#parametreForm{ display:flex; flex-direction:column; gap:12px; }
#parametreForm label{ font-weight:700; color:var(--tcx-text); font-size:.92rem; }
#parametreForm select,#typeQuantite{ width:100%; border-radius:12px; border:1px solid var(--tcx-border); background:var(--tcx-field); color:var(--tcx-text); padding:11px 38px 11px 12px; outline:none; -webkit-appearance:none; appearance:none; cursor:pointer;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23C6402E' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
  background-repeat:no-repeat; background-position:right 13px center; }
#parametreForm select:focus,#typeQuantite:focus{ border-color:var(--tcx-border-strong); box-shadow:var(--tcx-focus); }
.submitType input[type="submit"]{ width:100%; border:none; border-radius:12px; padding:13px 14px; font-weight:800; color:#1a0f0a; background:linear-gradient(135deg,var(--tcx-harissa),var(--tcx-saffron)); box-shadow:0 14px 28px -12px rgba(232,163,61,.6); transition:transform .12s ease, filter .12s ease; }
.submitType input[type="submit"]:hover{ transform:translateY(-1px); filter:brightness(1.05); }

/* ===== Modale quantité ===== */
.tc-qty__card{ width:min(560px,100%); padding:18px 18px 16px; }
.tc-qty__close{ position:absolute; top:12px; right:12px; width:40px; height:40px; border-radius:13px; display:grid; place-items:center; border:1px solid rgba(198,64,46,.2); background:rgba(198,64,46,.12); color:var(--tcx-harissa); font-size:22px; line-height:1; transition:background .12s ease, transform .12s ease; }
.tc-qty__close:hover{ background:rgba(198,64,46,.2); transform:rotate(90deg); }
.tc-qty__form{ display:flex; flex-direction:column; gap:12px; }
.tc-qty__title,#qtyTitle{ margin:0 44px 4px 0; font-size:1.2rem; font-weight:800; color:var(--tcx-text); }
#qtyIngredientName{ color:var(--tcx-harissa); }
#grammeContenu{ font-family:var(--tcx-mono); font-size:1.05rem; }

/* ===== Modale étape ===== */
.etape-modal__card{ width:min(680px,100%); }
.etape-modal__header{ padding-right:55px; margin-bottom:14px; }
.etape-modal__badge,.etapePhoto-badge{ display:inline-flex; align-items:center; justify-content:center; padding:6px 12px; border-radius:999px; font-size:12px; font-weight:800; letter-spacing:.08em; background:rgba(232,163,61,.16); border:1px solid rgba(232,163,61,.32); color:var(--tcx-harissa); margin-bottom:8px; }
.etape-modal__title{ margin:0; font-size:20px; font-weight:800; color:var(--tcx-text); }
.etape-modal__subtitle{ margin:6px 0 0; font-size:14px; line-height:1.45; color:var(--tcx-muted); font-weight:500; }
#etapeContenu.form-control{ min-height:130px; resize:vertical; border-radius:16px; padding:14px; background:rgba(232,163,61,.05); }

/* ===== Modale photo étape ===== */
.etapePhoto-card{ width:min(560px,100%); padding:0; }
.etapePhoto-close{ position:absolute; top:14px; right:14px; width:44px; height:44px; border-radius:999px; border:1px solid rgba(198,64,46,.2); background:rgba(198,64,46,.12); color:var(--tcx-harissa); font-size:24px; line-height:1; display:flex; align-items:center; justify-content:center; transition:background .12s ease, transform .12s ease; }
.etapePhoto-close:hover{ background:rgba(198,64,46,.2); transform:rotate(90deg); }
.etapePhoto-header{ padding:24px 22px 14px; text-align:center; }
.etapePhoto-title{ margin:10px 0 6px; font-size:22px; font-weight:800; color:var(--tcx-text); }
.etapePhoto-subtitle{ margin:0; font-size:14px; color:var(--tcx-muted); font-weight:500; }
#form-photoEtape{ padding:0 22px 20px; }
.etapePhoto-drop{ margin-top:6px; position:relative; }
.etapePhoto-drop input[type="file"]{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.etapePhoto-dropLabel{ width:100%; min-height:104px; border-radius:16px; border:2px dashed rgba(232,163,61,.4); background:rgba(232,163,61,.06); display:flex; align-items:center; gap:14px; padding:18px; cursor:pointer; transition:border-color .14s ease, background .14s ease, transform .14s ease; }
.etapePhoto-dropLabel:hover{ border-color:var(--tcx-saffron); background:rgba(232,163,61,.1); transform:translateY(-1px); }
.etapePhoto-dropIcon{ width:48px; height:48px; border-radius:13px; background:#fff; border:1px solid rgba(232,163,61,.24); display:flex; align-items:center; justify-content:center; font-size:22px; flex:0 0 auto; }
.etapePhoto-dropText strong{ display:block; font-size:15px; font-weight:800; color:var(--tcx-text); }
.etapePhoto-dropText span{ display:block; margin-top:4px; font-size:13px; color:var(--tcx-muted); font-weight:500; }
.etapePhoto-previewWrap{ margin-top:14px; display:flex; justify-content:center; }
.etapePhoto-preview{ width:min(340px,100%); aspect-ratio:4/3; object-fit:cover; border-radius:16px; border:1px solid rgba(232,163,61,.2); box-shadow:0 14px 30px -14px rgba(0,0,0,.4); }
.etapePhoto-message{ margin-top:12px; text-align:center; font-size:14px; font-weight:600; }
.etapePhoto-message:empty{ display:none; }
.etapePhoto-actions{ margin-top:16px; display:flex; gap:12px; }
.etapePhoto-cancel{ flex:1; }
.etapePhoto-submit{ flex:2; }

/* ===== Modale compartiments ===== */
#compartimentsModal .param-modal__titleRow .param-icon,#compartimentsModal .param-icon{ width:38px; height:38px; border-radius:13px; font-size:1.15rem; }
#compartimentsModal .param-modal__body > .param-card{ box-shadow:none; border:1px solid var(--tcx-border); border-radius:16px; background:var(--tcx-card); margin:0 0 14px; }
#compartimentsModal .param-card__head{ padding:12px 14px; }
#compartimentsModal .param-card__head h2{ font-size:15px; font-weight:800; color:var(--tcx-text); }
#compartimentsModal .param-card__head .param-icon{ width:28px; height:28px; border-radius:9px; font-size:14px; }
#compartimentCount,#materielResultCount,#materielLinkedCount,#geolocResultCount{ font-family:var(--tcx-mono); font-weight:700; font-size:12px; color:var(--tcx-muted); background:rgba(232,163,61,.12); border:1px solid rgba(232,163,61,.2); border-radius:999px; padding:3px 10px; }
#compartimentsList{ display:flex; flex-direction:column; gap:8px; padding:4px 14px 14px; }
#compartimentsList .param-muted{ padding:10px 2px; color:var(--tcx-muted); font-weight:700; }
#compartimentsList .comp-item{ display:flex; align-items:center; gap:11px; padding:11px 12px; border-radius:12px; background:var(--tcx-card-strong); border:1px solid var(--tcx-border); transition:border-color .14s ease, transform .14s ease, box-shadow .14s ease; }
#compartimentsList .comp-item:hover{ border-color:rgba(232,163,61,.4); transform:translateY(-1px); box-shadow:0 10px 22px -14px rgba(0,0,0,.4); }
#compartimentsList .comp-item__ic{ width:30px; height:30px; border-radius:9px; display:grid; place-items:center; font-size:15px; flex:0 0 auto; background:rgba(232,163,61,.14); color:var(--tcx-harissa); }
#compartimentsList .comp-item__nm{ font-weight:700; font-size:14px; color:var(--tcx-text); }
#creerCompartiment{ display:flex; flex-direction:column; gap:12px; margin-top:2px; }
#preparationContenu{ height:48px; }
#creerCompartiment .tc-btn-wide{ height:48px; }
#compartimentLoader{ display:none; justify-content:center; align-items:center; padding:2px 0; }
#compartimentLoader img{ width:28px; height:28px; animation:tcSpin .9s linear infinite; }
#compartimentError:empty{ display:none; }
#compartimentError:not(:empty){ display:flex; align-items:center; gap:8px; color:var(--tcx-danger); font-weight:700; font-size:.86rem; padding:10px 12px; border-radius:12px; background:var(--tcx-danger-soft); border:1px solid rgba(224,86,91,.28); }
#compartimentError:not(:empty)::before{ content:"⚠"; font-size:.95rem; }
#compartimentNotice{ display:none; align-items:center; gap:8px; margin-top:2px; padding:10px 12px; border-radius:12px; font-weight:700; font-size:.86rem; }
#compartimentNotice[data-kind="ok"]{ color:#137a52; background:rgba(31,169,113,.12); border:1px solid rgba(31,169,113,.3); }
#compartimentNotice[data-kind="info"]{ color:var(--tcx-harissa); background:rgba(232,163,61,.12); border:1px solid rgba(232,163,61,.3); }

/* ===== Modale matériel ===== */
#equipmentModal .tc-inline-search{ padding:0; margin-bottom:12px; }
#materielHint,#geolocHint{ font-size:.86rem; }
#resultMateriel,#linkedMateriel{ display:flex; flex-direction:column; gap:8px; padding:0 14px 12px; }
#resultMateriel .param-row,#linkedMateriel .param-row,#equipmentModal .param-row{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px; border-radius:14px; background:var(--tcx-card-strong); border:1px solid var(--tcx-border); }

/* ===== Modale géolocalisation ===== */
#geolocModal .param-modal__body > .param-card{ box-shadow:none; border:1px solid var(--tcx-border); border-radius:16px; background:var(--tcx-card); }
#resultGeoloc ul{ list-style:none; margin:0; padding:0; }
#resultGeoloc li{ padding:6px 2px; }


/* =========================================================
   RESPONSIVE
========================================================= */
@media (max-width:1024px){
  #tcxRoot .param-config{ grid-template-columns:1fr; }
  #tcxRoot .param-summary{ grid-template-columns:1fr; }
}
@media (max-width:900px){
  #tcxRoot .param-steps{ grid-template-columns:1fr; }
  #tcxRoot .ps-metrics{ grid-template-columns:repeat(2,1fr); }
  #tcxRoot .pc-head{ grid-template-columns:1fr auto; row-gap:12px; }
  #tcxRoot .pc-fill{ grid-column:1/-1; justify-self:stretch; }
}
@media (max-width:768px){
  .tcx-bg{ padding:18px 12px 100px; }
  #tcxRoot .ps-pagehead__ttl h1{ font-size:26px; }
  #tcxRoot .ps-emblem__ttl{ font-size:22px; }
  #tcxRoot .pc-body tr.ing-row td:nth-child(2){ flex:1 1 100%; order:-1; }
  #tcxRoot .pc-body tr.ing-row td:nth-child(6){ margin-left:0; }
  .param-modal,.tc-modal,.modalParametre,#qtyModal,.etapePhoto-modal{ padding:12px; align-items:flex-end; }
  .param-modal__card,.tc-modal__card,.modalParametreContent,.tc-qty__card,.etapePhoto-card{ width:100%; max-height:92vh; border-radius:22px 22px 16px 16px; }
}
@media (max-width:560px){
  #tcxRoot .ps-pagehead{ align-items:stretch; }
  #tcxRoot .ps-pagehead__acts{ width:100%; }
  #tcxRoot .ps-pagehead__acts .tc-btn{ flex:1; }
  #tcxRoot .ps-emblem{ flex-direction:column; align-items:flex-start; }
  #tcxRoot .ps-metrics{ grid-template-columns:1fr 1fr; }
  #tcxRoot .cfg-chips{ width:100%; }
  #tcxRoot .pc-body tr.ing-row td:nth-child(5){ flex:1 1 100%; }
  #tcxRoot .selectPreparation{ width:100%; }
  .param-modal__header,.tc-modal__header{ padding-right:48px; }
  .param-modal__close,.tc-modal__close,.etapePhoto-close,.tc-qty__close,.closeParametre{ width:38px; height:38px; font-size:20px; }
  .etapePhoto-actions{ flex-direction:column; }
  .etapePhoto-actions > *{ width:100%; }
}
@media (prefers-reduced-motion:reduce){ *{ animation:none !important; transition:none !important; } }


/* =========================================================
   DURCISSEMENT — force le thème sombre sur la structure quel
   que soit le CSS global du site (dégradés de texte, couleurs
   !important, en-têtes clairs…). Ancré sur #tcxRoot (id).
   N'affecte PAS les modales : elles sont hors de #tcxRoot.
========================================================= */
#tcxRoot{ color:var(--tcx-text); }

/* Annule tout remplissage de texte en dégradé / ombre héritée du thème */
#tcxRoot :where(h1,h2,h3,h4,h5,h6,b,strong,span,a,p,label,summary,li,td,th,button,input,select,textarea,div,small,em,i){
  -webkit-text-fill-color: currentColor !important;
}
#tcxRoot :where(h1,h2,h3,h4,h5,h6,b,strong){
  background:none !important;
  -webkit-background-clip:border-box !important;
          background-clip:border-box !important;
  text-shadow:none !important;
}

/* Réaffirme les couleurs clés (id > classes du thème) */
#tcxRoot .ps-pagehead__ttl h1{ color:var(--tcx-text) !important; }
#tcxRoot .ps-emblem__ttl,
#tcxRoot .ps-metric b,
#tcxRoot .param-comps-head h3,
#tcxRoot .param-card__title h2,
#tcxRoot .param-card__title h3,
#tcxRoot .pc-nm,
#tcxRoot .pc-body tr.ing-row td:nth-child(2){ color:var(--tcx-text) !important; }
#tcxRoot .ps-pagehead__sub, #tcxRoot .ps-metric span,
#tcxRoot .param-muted, #tcxRoot .pc-fill__t, #tcxRoot .sp-status{ color:var(--tcx-muted) !important; }
#tcxRoot .ps-crumb b, #tcxRoot .ps-emblem__cat, #tcxRoot .step-number,
#tcxRoot .modificationGramme, #tcxRoot .btnParametreType,
#tcxRoot .step-header .editStepBtn, #tcxRoot .sp-play{ color:var(--tcx-saffron) !important; }
#tcxRoot .btnDelete, #tcxRoot .supprimerIngredient{ color:var(--tcx-harissa-2) !important; }

/* En-têtes de cartes : jamais de fond clair hérité */
#tcxRoot .param-card__head{ background:transparent !important; background-image:none !important; }
#tcxRoot .param-card{ background:var(--tcx-card) !important; }

/* Puces / chips lisibles */
#tcxRoot .parametre-badge{ color:var(--tcx-text) !important; }
#tcxRoot .cfg-chips .tc-btn, #tcxRoot .cfg-chips .option-btn,
#tcxRoot .ps-pagehead__acts .tc-btn{ color:var(--tcx-text) !important; background:var(--tcx-card-strong) !important; }