/* QUALITE 24 — SOCLE DE DESIGN COMMUN « Apple » (22/10/2026)
   Une seule source pour les couleurs, la typo, les espacements, les rayons, les ombres, les matières (flou) et les composants
   des applis Conducteur (+ Chantier, Chef de groupe), Finance, Équipe, Conseiller et Compta. Même vocabulaire de jetons (--q-…)
   que BALTA (balta/css/v82.css, section 30). L'appli Architecte ne charge PAS ce fichier (autre chantier en cours).

   Chargement : EN DERNIER dans chaque appli, <html class="q-apple"> ; toutes les adaptations aux applis commencent par html.q-apple,
   pour l'emporter sur les feuilles propres aux applis sans les modifier. Aucun JavaScript, aucune fonction changée : CSS seulement.
   Les anciennes variables --i-… (css/q24-ios.css) sont reliées ici aux jetons --q-… : une couleur se change à UN endroit.

   Règles tirées des Human Interface Guidelines d'Apple (lues le 22/10/2026 sur developer.apple.com/design/human-interface-guidelines) :
   - Typographie (…/typography) : échelle Dynamic Type iOS — Large Title 34/41 gras, Title 1 28/34, Title 2 22/28, Title 3 20/25,
     Headline 17/22 semi-gras, Body 17/22, Callout 16/21, Subheadline 15/20, Footnote 13/18, Caption 12/16 ; police système SF Pro.
     macOS : corps 13 pt, grand titre 26 pt (densité plus forte sur ordinateur).
   - Accessibilité (…/accessibility) : texte par défaut 17 pt / minimum 11 pt sur iOS (ici jamais sous 12 px) ; contraste 4,5:1 jusqu'à 17 pt,
     3:1 au-delà ou en gras ; commandes 44 × 44 pt sur iOS (28 × 28 pt sur macOS) ; ~12 pt d'espace autour d'un élément à fond ;
     ne pas transmettre une information par la couleur seule ; respecter « Réduire les animations », « Augmenter le contraste ».
   - Barres d'onglets (…/tab-bars) : en bas sur iPhone, navigation seulement, toujours visible, libellés d'un mot, pastille rouge pour
     une information importante ; sur iOS 26 la barre flotte sur le contenu avec une matière translucide (Liquid Glass).
   - Barres latérales (…/sidebars) : sur iPad / Mac pour des sections nombreuses ; deux niveaux au plus ; icônes à la couleur d'accent
     de l'appli ; rien d'important tout en bas.
   - Listes et tableaux (…/lists-and-tables) : style « groupé » (en-têtes, cartes arrondies, séparateurs) sur iOS ; retour visuel à la sélection.
   - Feuilles (…/sheets) : une seule feuille à la fois ; Annuler à gauche, Terminé à droite ; sur Mac, carte arrondie qui flotte sur la fenêtre assombrie.
   - Boutons (…/buttons) : un seul bouton « proéminent » (couleur d'accent) pour l'action la plus probable ; un état « appuyé » toujours visible ;
     destructif en rouge, jamais en rôle principal.
   - Couleur / mode sombre (…/color, …/dark-mode) : couleurs sémantiques qui s'adaptent ; fonds « de base » et « surélevés » en sombre ;
     contraste vérifié en clair ET en sombre.
   - Matières (…/materials) : la matière translucide est réservée à la couche des commandes (barres, barre latérale), jamais au contenu.
   - Mise en page (…/layout) : marges et zones sûres (encoche, barre d'accueil), ordre d'importance de haut en bas, regroupement par cartes.
   - Animation (…/motion) : sobre, utile, jamais obligatoire, interrompable ; coupée si « Réduire les animations ».
   Grille d'espacement : multiples de 4 (4, 8, 12, 16, 20, 24, 32, 40). Identité QUALITE 24 : rouge #B3121D (corail #FF5A52 en sombre). */

/* ===================================================================================================================== */
/* 1. JETONS                                                                                                              */
/* ===================================================================================================================== */
:root{
  /* Couleurs (clair) — mêmes valeurs que BALTA */
  --q-bg:#f2f2f7;--q-card:#ffffff;--q-card2:#f7f7fa;--q-elevated:#ffffff;
  --q-fill:rgba(118,118,128,.12);--q-fill2:rgba(118,118,128,.08);
  --q-label:#1c1c1e;--q-label2:#6c6c70;--q-label3:#aeaeb2;--q-sep:rgba(60,60,67,.16);--q-sep-strong:rgba(60,60,67,.29);
  --q-accent:#b3121d;--q-accent-press:#8f0e17;--q-accent-tint:rgba(179,18,29,.09);--q-on-accent:#ffffff;
  --q-green:#1f7a35;--q-green-tint:rgba(52,199,89,.15);--q-orange:#a64500;--q-orange-tint:rgba(255,149,0,.16);
  --q-blue:#0a5fcc;--q-blue-tint:rgba(0,122,255,.11);--q-violet:#6e3bd8;--q-violet-tint:rgba(175,82,222,.12);
  --q-red:#c4161f;--q-red-tint:rgba(255,59,48,.12);
  /* Matières : barres et barre latérale seulement (jamais le contenu) */
  --q-bar:rgba(249,249,251,.80);--q-sidebar-bg:rgba(242,242,247,.86);--q-blur:saturate(180%) blur(24px);
  --q-scrim:rgba(0,0,0,.38);
  /* Ombres : 1 = carte, 2 = élément flottant (barre, bulle), 3 = fenêtre */
  --q-shadow:0 1px 2px rgba(0,0,0,.04),0 8px 24px rgba(0,0,0,.05);
  --q-shadow-2:0 1px 1px rgba(0,0,0,.04),0 6px 20px rgba(0,0,0,.10);
  --q-shadow-3:0 2px 6px rgba(0,0,0,.08),0 24px 60px rgba(0,0,0,.22);
  /* Typo : police du système (San Francisco sur iPhone et Mac) */
  --q-font:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Helvetica Neue","Segoe UI",Roboto,Arial,sans-serif;
  --q-mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --q-t-large:700 34px/41px var(--q-font);--q-t-title1:700 28px/34px var(--q-font);--q-t-title2:700 22px/28px var(--q-font);
  --q-t-title3:600 20px/25px var(--q-font);--q-t-headline:600 17px/22px var(--q-font);--q-t-body:400 17px/22px var(--q-font);
  --q-t-callout:400 16px/21px var(--q-font);--q-t-subhead:400 15px/20px var(--q-font);--q-t-footnote:400 13px/18px var(--q-font);
  --q-t-caption:400 12px/16px var(--q-font);
  /* Espacements (grille de 4) */
  --q-1:4px;--q-2:8px;--q-3:12px;--q-4:16px;--q-5:20px;--q-6:24px;--q-8:32px;--q-10:40px;
  /* Rayons */
  --q-r-xs:6px;--q-r-s:10px;--q-r-m:12px;--q-r-l:16px;--q-r-xl:22px;--q-r-pill:999px;--q-radius:12px;--q-radius-lg:16px;
  /* Zones de toucher : 44 pt (iOS), 56 px pour les salariés de chantier (gants) */
  --q-touch:44px;--q-touch-gants:56px;
  /* Animations sobres */
  --q-ease:cubic-bezier(.2,.8,.2,1);--q-dur-1:.12s;--q-dur-2:.22s;--q-dur-3:.32s;
  /* Mise en page */
  --q-sidebar:264px;--q-content-max:1120px;--q-lecture-max:760px;--q-marge:16px;--q-marge-ordi:clamp(24px,2.6vw,40px);
  color-scheme:light;

  /* Anciennes variables (css/q24-ios.css) reliées au socle : les 5 applis suivent les jetons --q-… */
  --i-bg:var(--q-bg);--i-card:var(--q-card);--i-card2:var(--q-card2);--i-fill:var(--q-fill);--i-fill2:var(--q-fill2);
  --i-label:var(--q-label);--i-label2:var(--q-label2);--i-label3:var(--q-label3);--i-sep:var(--q-sep);--i-sep-strong:var(--q-sep-strong);
  --i-accent:var(--q-accent);--i-accent-press:var(--q-accent-press);--i-accent-tint:var(--q-accent-tint);--i-on-accent:var(--q-on-accent);
  --i-green:var(--q-green);--i-green-tint:var(--q-green-tint);--i-orange:var(--q-orange);--i-orange-tint:var(--q-orange-tint);
  --i-blue:var(--q-blue);--i-blue-tint:var(--q-blue-tint);--i-violet:var(--q-violet);--i-violet-tint:var(--q-violet-tint);
  --i-bar:var(--q-bar);--i-shadow:var(--q-shadow);--i-font:var(--q-font);
}
/* Sombre (réglage de l'appareil) : fond de base noir, cartes #1C1C1E, fenêtres surélevées #2C2C2E */
@media (prefers-color-scheme:dark){
  :root{
    --q-bg:#000000;--q-card:#1c1c1e;--q-card2:#2c2c2e;--q-elevated:#2c2c2e;
    --q-fill:rgba(118,118,128,.24);--q-fill2:rgba(118,118,128,.16);
    --q-label:#f5f5f7;--q-label2:#98989f;--q-label3:#636366;--q-sep:rgba(84,84,88,.55);--q-sep-strong:rgba(84,84,88,.75);
    --q-accent:#ff5a52;--q-accent-press:#ff7a73;--q-accent-tint:rgba(255,90,82,.16);--q-on-accent:#000000;
    --q-green:#30d158;--q-green-tint:rgba(48,209,88,.18);--q-orange:#ff9f0a;--q-orange-tint:rgba(255,159,10,.18);
    --q-blue:#409cff;--q-blue-tint:rgba(64,156,255,.18);--q-violet:#bf5af2;--q-violet-tint:rgba(191,90,242,.18);
    --q-red:#ff6961;--q-red-tint:rgba(255,69,58,.2);
    --q-bar:rgba(22,22,24,.80);--q-sidebar-bg:rgba(28,28,30,.88);--q-scrim:rgba(0,0,0,.55);
    --q-shadow:none;--q-shadow-2:0 6px 20px rgba(0,0,0,.45);--q-shadow-3:0 24px 60px rgba(0,0,0,.6);
    color-scheme:dark;
  }
}
/* « Augmenter le contraste » (réglage d'accessibilité) : textes secondaires plus foncés, séparateurs visibles, cartes cernées */
@media (prefers-contrast:more){
  :root{--q-label2:#3c3c43;--q-label3:#6c6c70;--q-sep:rgba(60,60,67,.45);--q-sep-strong:rgba(60,60,67,.65);--q-accent:#8f0e17;--q-fill:rgba(118,118,128,.22);--q-fill2:rgba(118,118,128,.16);--q-bar:rgba(249,249,251,.97)}
}
@media (prefers-contrast:more) and (prefers-color-scheme:dark){
  :root{--q-label2:#c7c7cc;--q-label3:#98989f;--q-sep:rgba(142,142,147,.7);--q-sep-strong:rgba(174,174,178,.8);--q-accent:#ff8c85;--q-bar:rgba(22,22,24,.97)}
}
/* « Réduire la transparence » : barres pleines, sans flou */
@media (prefers-reduced-transparency:reduce){
  :root{--q-bar:var(--q-card);--q-sidebar-bg:var(--q-card2);--q-blur:none}
}

/* ===================================================================================================================== */
/* 2. BASE                                                                                                                */
/* ===================================================================================================================== */
html.q-apple{background:var(--q-bg);-webkit-text-size-adjust:100%;text-size-adjust:100%;
  scroll-padding-top:calc(72px + env(safe-area-inset-top,0px));scroll-padding-bottom:calc(96px + env(safe-area-inset-bottom,0px))}
html.q-apple body{font-family:var(--q-font);background:var(--q-bg);color:var(--q-label);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;font-variant-numeric:proportional-nums}
html.q-apple ::selection{background:var(--q-accent-tint)}
html.q-apple :is(button,a,summary,[role=button],input,select,textarea):focus-visible{outline:2px solid var(--q-accent);outline-offset:2px}
html.q-apple :is(button,a,[role=button]){-webkit-tap-highlight-color:transparent}

/* ===================================================================================================================== */
/* 3. COMPOSANTS GÉNÉRIQUES (.q-…) — pour tout nouvel écran ; les écrans existants sont habillés en section 4               */
/* ===================================================================================================================== */
/* Titres */
.q-grand-titre{margin:var(--q-2) 0 var(--q-1);font:var(--q-t-large);letter-spacing:.011em;color:var(--q-label)}
.q-titre{margin:0 0 var(--q-2);font:var(--q-t-title2);color:var(--q-label)}
.q-entete-section{margin:var(--q-6) var(--q-4) var(--q-2);font:var(--q-t-footnote);font-weight:600;letter-spacing:.02em;text-transform:uppercase;color:var(--q-label2)}
.q-pied-section{margin:var(--q-2) var(--q-4) var(--q-4);font:var(--q-t-footnote);color:var(--q-label2)}
/* Carte */
.q-carte{background:var(--q-card);border-radius:var(--q-r-l);box-shadow:var(--q-shadow);padding:var(--q-4);margin:0 0 var(--q-3)}
/* Liste groupée « inset grouped » : lignes de 44 px au moins, séparateurs décalés après l'icône */
.q-liste{list-style:none;margin:0 0 var(--q-4);padding:0;background:var(--q-card);border-radius:var(--q-r-l);box-shadow:var(--q-shadow);overflow:hidden}
.q-liste>li{position:relative}
.q-liste>li+li::before{content:"";position:absolute;top:0;right:0;left:var(--q-sep-gauche,16px);border-top:.5px solid var(--q-sep);pointer-events:none}
.q-ligne{display:flex;align-items:center;gap:var(--q-3);width:100%;min-height:var(--q-touch);padding:11px var(--q-4);border:0;background:transparent;color:var(--q-label);font:var(--q-t-body);text-align:left;text-decoration:none;cursor:pointer}
.q-ligne__ico{flex:none;display:inline-grid;place-items:center;width:30px;height:30px;border-radius:7px;background:var(--q-accent);color:var(--q-on-accent)}
.q-ligne__corps{flex:1;min-width:0}
.q-ligne__corps small{display:block;font:var(--q-t-subhead);color:var(--q-label2)}
.q-ligne__valeur{flex:none;color:var(--q-label2)}
.q-ligne__chevron{flex:none;color:var(--q-label3);font-size:20px;line-height:1}
.q-liste--ico{--q-sep-gauche:58px}
@media (hover:hover){.q-ligne:hover{background:var(--q-fill2)}}
.q-ligne:active{background:var(--q-fill)}
.q-liste .q-ligne:focus-visible{outline-offset:-3px}
/* Boutons : proéminent (accent), gris, lien, destructif ; état appuyé toujours visible */
.q-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--q-2);min-height:var(--q-touch);padding:0 var(--q-4);border:0;border-radius:var(--q-r-m);
  background:var(--q-fill);color:var(--q-label);font:var(--q-t-headline);text-decoration:none;cursor:pointer;transition:transform var(--q-dur-1) ease,opacity var(--q-dur-1) ease}
.q-btn:active{transform:scale(.97);opacity:.85}
.q-btn:disabled{opacity:.45;cursor:default}
.q-btn--principal{background:var(--q-accent);color:var(--q-on-accent)}
.q-btn--lien{background:transparent;color:var(--q-accent);padding:0 var(--q-2)}
.q-btn--destructif{background:var(--q-red-tint);color:var(--q-red)}
.q-btn--grand{width:100%;min-height:50px;border-radius:14px}
/* Champs */
.q-champ{display:block;width:100%;min-height:var(--q-touch);padding:10px var(--q-3);border:0;border-radius:var(--q-r-s);background:var(--q-fill2);color:var(--q-label);font:var(--q-t-body)}
.q-champ:focus{outline:2px solid var(--q-accent);outline-offset:0}
.q-libelle{display:block;margin:var(--q-2) 0 var(--q-1);font:var(--q-t-subhead);font-weight:600;color:var(--q-label)}
/* Pastilles (badges) : la couleur n'est jamais seule, le texte dit l'état */
.q-badge{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:var(--q-r-pill);background:var(--q-fill);color:var(--q-label2);font:600 13px/18px var(--q-font)}
.q-badge--rouge{background:var(--q-accent-tint);color:var(--q-accent)}
.q-badge--orange{background:var(--q-orange-tint);color:var(--q-orange)}
.q-badge--vert{background:var(--q-green-tint);color:var(--q-green)}
.q-badge--bleu{background:var(--q-blue-tint);color:var(--q-blue)}
.q-compteur{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 6px;border-radius:10px;background:var(--q-accent);color:var(--q-on-accent);font:700 13px/20px var(--q-font)}
/* Contrôle segmenté */
.q-seg{display:inline-flex;gap:2px;padding:2px;border-radius:9px;background:var(--q-fill)}
.q-seg>button{min-height:32px;padding:0 var(--q-3);border:0;border-radius:7px;background:transparent;color:var(--q-label);font:600 15px var(--q-font);cursor:pointer}
.q-seg>button[aria-pressed=true],.q-seg>button[aria-selected=true]{background:var(--q-card);box-shadow:0 1px 3px rgba(0,0,0,.12)}
/* Barre d'onglets (téléphone) et barre latérale (ordinateur) */
.q-onglets{position:fixed;left:0;right:0;bottom:0;z-index:30;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);padding:4px 4px calc(4px + env(safe-area-inset-bottom,0px));
  background:var(--q-bar);-webkit-backdrop-filter:var(--q-blur);backdrop-filter:var(--q-blur);border-top:.5px solid var(--q-sep-strong)}
.q-barre-laterale{position:fixed;top:0;bottom:0;left:0;width:var(--q-sidebar);overflow-y:auto;padding:var(--q-4) var(--q-3);background:var(--q-sidebar-bg);
  -webkit-backdrop-filter:var(--q-blur);backdrop-filter:var(--q-blur);border-right:.5px solid var(--q-sep-strong)}
/* Feuille (iPhone : monte du bas ; ordinateur : carte au centre) */
.q-feuille{border:0;padding:var(--q-5) var(--q-4) calc(var(--q-5) + env(safe-area-inset-bottom,0px));width:100%;max-width:640px;margin:auto auto 0;
  border-radius:var(--q-r-xl) var(--q-r-xl) 0 0;background:var(--q-elevated);color:var(--q-label);box-shadow:var(--q-shadow-3)}
.q-feuille::backdrop{background:rgba(0,0,0,.38)}
@media (min-width:1024px){.q-feuille{margin:auto;border-radius:var(--q-r-xl);padding-bottom:var(--q-5)}}

/* ===================================================================================================================== */
/* 4. LES APPLIS : Conducteur / Chantier / Finance (pt-), Équipe (eq-), Conseiller (cs-), Compta (cp-)                     */
/* ===================================================================================================================== */

/* 4.1 Barre du haut (barre de navigation iOS) : matière translucide, titre 17 semi-gras, filet fin */
html.q-apple :is(.pt-haut,.eq-haut,.cs-haut,.cp-haut){background:var(--q-bar)!important;-webkit-backdrop-filter:var(--q-blur);backdrop-filter:var(--q-blur);
  border-bottom:.5px solid var(--q-sep-strong)!important;box-shadow:none!important}
html.q-apple :is(.pt-haut__titre,.eq-haut__titre,.cs-haut__titre,.cp-haut__titre){font-weight:600;letter-spacing:-.01em}

/* Zone de toucher de 44 px pour « Mes applis » (36 px) et le choix FR / TR de l'appli Équipe (32 px), sans changer leur dessin */
html.q-apple :is(.pt-haut,.eq-haut,.cs-haut,.cp-haut) :is(.mes-applis-bouton,.eq-langue button){position:relative}
html.q-apple :is(.pt-haut,.eq-haut,.cs-haut,.cp-haut) .mes-applis-bouton::after{content:"";position:absolute;inset:-4px -2px}
html.q-apple :is(.pt-haut,.eq-haut,.cs-haut,.cp-haut) .eq-langue button::after{content:"";position:absolute;inset:-6px -1px}
/* Messagerie commune : heures des messages à 12 px au moins (elles tombaient à 10,8 px) */
html.q-apple .mc small{font-size:max(12px,.85em)}

/* 4.2 Grands titres (Large Title 34/41) et titres de section */
html.q-apple :is(.pt-grand-titre,.eq-grand-titre,.cs-grand-titre,.cp-grand-titre){font:var(--q-t-large)!important;letter-spacing:.011em!important;margin:var(--q-2) 0 var(--q-1)!important}
@media (max-width:359px){html.q-apple :is(.pt-grand-titre,.eq-grand-titre,.cs-grand-titre,.cp-grand-titre){font-size:30px!important;line-height:36px!important}}
html.q-apple :is(.pt-entete__date,.eq-entete__date,.cs-entete__date,.cp-entete__date){font:600 13px/18px var(--q-font);letter-spacing:.06em}

/* Messagerie commune : le titre de l'écran « Messages » en grand titre, comme les autres onglets */
html.q-apple .mc-tete:not(.mc-tete--fil) .mc-titre{font-size:34px;line-height:41px;letter-spacing:.011em}
@media (max-width:359px){html.q-apple .mc-tete:not(.mc-tete--fil) .mc-titre{font-size:30px;line-height:36px}}
@media (min-width:1024px){html.q-apple .mc-tete:not(.mc-tete--fil) .mc-titre{font-size:30px;line-height:36px}}

html.q-apple .mc-champ{border:0;background:var(--q-fill2)}
html.q-apple .mc-champ:focus{outline:2px solid var(--q-accent);outline-offset:0}

/* 4.3 Barre d'onglets (iPhone) : matière translucide, onglet actif = couleur d'accent + fond en pastille (pas la couleur seule),
       libellés resserrés pour ne plus être coupés (« Aujourd'hui ») sur un iPhone de 375 px */
html.q-apple :is(.pt-nav,.eq-barre,.cs-barre,.cp-barre){background:var(--q-bar)!important;-webkit-backdrop-filter:var(--q-blur);backdrop-filter:var(--q-blur);
  border-top:.5px solid var(--q-sep-strong)}
html.q-apple :is(.pt-nav,.eq-barre,.cs-barre,.cp-barre) button{isolation:isolate;padding-left:1px;padding-right:1px}
/* 5 onglets sur un iPhone de 375 px : « Aujourd'hui » entier (il était coupé en « Aujourd… ») */
@media (max-width:430px){html.q-apple :is(.pt-nav,.eq-barre,.cs-barre,.cp-barre):not(:has(>button:nth-of-type(6))) button{letter-spacing:-.015em}}
html.q-apple :is(.pt-nav,.eq-barre,.cs-barre,.cp-barre) button>span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html.q-apple :is(.pt-nav,.eq-barre,.cs-barre,.cp-barre) button[aria-current=true]::before{content:"";position:absolute;inset:2px 2px;z-index:-1;border-radius:14px;background:var(--q-fill)}
@media (prefers-reduced-motion:no-preference){
  html.q-apple :is(.pt-nav,.eq-barre,.cs-barre,.cp-barre) button[aria-current=true]::before{animation:q-pastille var(--q-dur-2) var(--q-ease)}
}
@keyframes q-pastille{from{opacity:0;transform:scale(.86)}to{opacity:1;transform:none}}
/* Tablette (820 à 1023 px) : la barre flotte, comme sur iOS 26 */
@media (min-width:820px) and (max-width:1023px){
  html.q-apple :is(.pt-nav,.eq-barre,.cs-barre,.cp-barre){box-shadow:var(--q-shadow-2);border:.5px solid var(--q-sep-strong);border-radius:26px}
}

/* 4.4 Listes groupées (inset grouped) : une carte, des lignes séparées par un filet décalé après l'avatar.
       Chantiers / clients (Conducteur, Finance), clients (Conseiller), lignes de l'appli Équipe. */
html.q-apple .pt-liste-cartes:has(>li>.pt-rangee),
html.q-apple .cs-liste:has(>li>.cs-client),
html.q-apple .cs-liste--simple:has(>li>.cs-ligne),
html.q-apple .eq-lignes{display:block!important;gap:0;background:var(--q-card);border-radius:var(--q-r-l);box-shadow:var(--q-shadow);overflow:hidden}
html.q-apple :is(.pt-liste-cartes,.cs-liste,.eq-lignes)>li{position:relative;margin:0!important}
html.q-apple .pt-liste-cartes:has(>li>.pt-rangee)>li+li::before,
html.q-apple .cs-liste:has(>li>.cs-client)>li+li::before,
html.q-apple .cs-liste--simple:has(>li>.cs-ligne)>li+li::before,
html.q-apple .eq-lignes>li+li::before{content:"";position:absolute;top:0;right:0;left:68px;z-index:1;border-top:.5px solid var(--q-sep);pointer-events:none}
html.q-apple .cs-liste--simple>li+li::before,html.q-apple .eq-lignes>li+li::before{left:16px}
html.q-apple .eq-lignes>li+li:has(.eq-avatar)::before{left:66px}
html.q-apple .cs-liste>li+li:has(>a.cs-client)::before{left:16px}
/* « Mes devis » (Conseiller) : lignes de liste et non liens soulignés ; pastilles à leur taille (elles s'étiraient sur toute la ligne) */
html.q-apple .cs-liste a.cs-client{text-decoration:none;color:var(--q-label)}
html.q-apple .cs-liste a.cs-client .cs-client__quand{color:var(--q-label2)}
html.q-apple .cs-liste a.cs-client>.cs-badge{align-self:flex-start;width:fit-content;max-width:100%}
html.q-apple .cs-liste a.cs-client .cs-client__apercu{color:var(--q-label2)}
html.q-apple .pt-liste-cartes>li>.pt-rangee,
html.q-apple .cs-liste>li>.cs-client,
html.q-apple .cs-liste--simple>li>.cs-ligne,
html.q-apple .eq-lignes .eq-ligne{margin:0!important;border-radius:0!important;box-shadow:none!important;background:transparent!important}
html.q-apple :is(.pt-liste-cartes>li>.pt-rangee,.cs-liste>li>.cs-client,.cs-liste--simple>li>.cs-ligne,.eq-lignes button.eq-ligne,.eq-lignes a.eq-ligne):focus-visible{outline-offset:-3px}
@media (hover:hover){
  html.q-apple :is(.pt-liste-cartes>li>button.pt-rangee,.cs-liste>li>.cs-client,.cs-liste--simple>li>.cs-ligne,.eq-lignes button.eq-ligne):hover{background:var(--q-fill2)!important}
}
html.q-apple :is(.pt-liste-cartes>li>button.pt-rangee,.cs-liste>li>.cs-client,.cs-liste--simple>li>.cs-ligne,.eq-lignes button.eq-ligne):active{background:var(--q-fill)!important}
/* Liste groupée posée dans une carte : fond secondaire, sans ombre */
html.q-apple :is(.eq-carte,.pt-carte,.cs-carte) .eq-lignes,html.q-apple .pt-carte .pt-liste-cartes:has(>li>.pt-rangee){background:var(--q-card2);box-shadow:none;border-radius:var(--q-r-m)}

/* 4.5 Menus « Plus » / « Ma fiche » (déjà groupés) : séparateur décalé après l'icône, comme Réglages */
html.q-apple :is(.pt-menu,.eq-menu,.cs-menu,.cp-menu)>li{position:relative}
html.q-apple .pt-menu>li+li:has(.pt-menu__ico),html.q-apple .eq-menu>li+li:has(.eq-menu__ico),
html.q-apple .cs-menu>li+li:has(.cs-menu__ico),html.q-apple .cp-menu>li+li:has(.cp-menu__ico){border-top-color:transparent!important}
html.q-apple .pt-menu>li+li:has(.pt-menu__ico)::before,html.q-apple .eq-menu>li+li:has(.eq-menu__ico)::before,
html.q-apple .cs-menu>li+li:has(.cs-menu__ico)::before,html.q-apple .cp-menu>li+li:has(.cp-menu__ico)::before{content:"";position:absolute;top:0;right:0;left:58px;border-top:.5px solid var(--q-sep);pointer-events:none}
html.q-apple :is(.pt-menu__ico,.eq-menu__ico,.cs-menu__ico,.cp-menu__ico){border-radius:8px}
@media (hover:hover){html.q-apple :is(.pt-menu a,.pt-menu__bouton,.eq-menu a,.eq-menu__bouton,.cs-menu a,.cp-menu a):hover{background:var(--q-fill2)}}
html.q-apple :is(.pt-menu a,.pt-menu__bouton,.eq-menu a,.eq-menu__bouton,.cs-menu a,.cp-menu a):active{background:var(--q-fill)}

/* 4.6 Boutons : état appuyé, survol (souris), désactivé — mêmes règles partout */
html.q-apple :is(.pt-btn,.eq-btn,.cs-btn,.cp-btn){transition:transform var(--q-dur-1) ease,opacity var(--q-dur-1) ease,filter var(--q-dur-1) ease}
@media (hover:hover){html.q-apple :is(.pt-btn,.eq-btn,.cs-btn,.cp-btn):not(:disabled):hover{filter:brightness(.96)}}
@media (hover:hover) and (prefers-color-scheme:dark){html.q-apple :is(.pt-btn,.eq-btn,.cs-btn,.cp-btn):not(:disabled):hover{filter:brightness(1.12)}}
html.q-apple :is(.pt-btn,.eq-btn,.cs-btn,.cp-btn):not(:disabled):active{transform:scale(.97);opacity:.85}
html.q-apple :is(.pt-btn,.eq-btn,.cs-btn,.cp-btn):disabled{opacity:.45}

/* 4.7 Fenêtres de confirmation (alertes) : carte surélevée, fond assombri, boutons de même largeur côte à côte */
html.q-apple :is(.pt-dialogue,.eq-dialogue,.cs-dialogue,.cp-dialogue){border:0;border-radius:20px!important;background:var(--q-elevated)!important;color:var(--q-label);box-shadow:var(--q-shadow-3)!important}
/* ::backdrop n'hérite pas toujours des variables : valeurs écrites en clair */
html.q-apple :is(.pt-dialogue,.eq-dialogue,.cs-dialogue,.cp-dialogue,.eq-feuille,.pt-feuille)::backdrop{background:rgba(0,0,0,.38)}
@media (prefers-color-scheme:dark){html.q-apple :is(.pt-dialogue,.eq-dialogue,.cs-dialogue,.cp-dialogue,.eq-feuille,.pt-feuille)::backdrop{background:rgba(0,0,0,.55)}}
html.q-apple :is(.pt-dialogue__actions,.eq-dialogue__actions,.cs-dialogue__actions,.cp-dialogue__actions){display:grid!important;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:var(--q-2)}
html.q-apple :is(.pt-dialogue__actions,.eq-dialogue__actions,.cs-dialogue__actions,.cp-dialogue__actions)>.pt-btn,
html.q-apple :is(.pt-dialogue__actions,.eq-dialogue__actions,.cs-dialogue__actions,.cp-dialogue__actions)>:is(.eq-btn,.cs-btn,.cp-btn){width:100%;margin:0}
/* Feuilles (formulaires) : fond surélevé en sombre */
html.q-apple :is(dialog.pt-feuille,.eq-feuille){background:var(--q-elevated)!important;box-shadow:var(--q-shadow-3)}
/* « Signaler » : les 6 tuiles remplissent leur colonne (« Retard » faisait 68 px de large à côté de tuiles de 153 px) */
html.q-apple .pt-types .pt-type{align-items:stretch}
html.q-apple .pt-types .pt-type>.pt-type__corps{flex:1;min-width:0}
/* Feuille « Modifier » : « Avancement : 40 % » sur une ligne, le curseur dessous (il s'empilait sur 3 lignes) */
html.q-apple .pt-feuille .pt-form label:has(>input[type=range]){display:flex;flex-wrap:wrap;align-items:baseline;column-gap:4px}
html.q-apple .pt-feuille .pt-form label:has(>input[type=range])>input[type=range]{flex:1 0 100%}
@media (prefers-reduced-motion:no-preference){
  html.q-apple :is(.pt-dialogue,.eq-dialogue,.cs-dialogue,.cp-dialogue)[open]{animation:q-alerte var(--q-dur-2) var(--q-ease)}
  html.q-apple dialog.pt-feuille[open]{animation:q-feuille var(--q-dur-3) var(--q-ease)}
}
@keyframes q-alerte{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:none}}
@keyframes q-feuille{from{opacity:0;transform:translateY(32px)}to{opacity:1;transform:none}}

/* 4.8 Messages éphémères (toast) */
html.q-apple :is(.pt-toast,.eq-toast,.cs-toast,.cp-toast){border-radius:14px!important;box-shadow:var(--q-shadow-2)!important}

/* 4.9 Cartes : même rayon et même ombre légère partout (aucune ombre en sombre) */
html.q-apple :is(.pt-carte,.pt-tache,.eq-carte,.cs-carte,.cp-carte){border-radius:var(--q-r-l)}

/* ===================================================================================================================== */
/* 5. ORDINATEUR (≥ 1024 px) : barre latérale à gauche (comme sur Mac), contenu centré, densité adaptée                   */
/* ===================================================================================================================== */
@media (min-width:1024px){
  /* Coque : la page entière, la barre latérale à gauche, le contenu centré à droite */
  html.q-apple .pt:has(>.pt-coque:not([hidden])),html.q-apple .eq:has(>.eq-coque:not([hidden])),
  html.q-apple .cs:has(>.cs-coque:not([hidden])),html.q-apple .cp:has(>.cp-coque:not([hidden])){max-width:none!important;margin:0!important;padding:0 0 48px!important}
  html.q-apple :is(.pt-coque,.eq-coque,.cs-coque,.cp-coque){margin-left:var(--q-sidebar)!important;padding:0 var(--q-marge-ordi)!important;max-width:none!important;min-height:100vh}
  /* Barre d'outils du haut : au-dessus du contenu seulement ; le logo passe dans la barre latérale */
  html.q-apple :is(.pt-haut,.eq-haut,.cs-haut,.cp-haut){margin:0 calc(-1 * var(--q-marge-ordi)) 16px!important;padding:10px var(--q-marge-ordi)!important;min-height:56px}
  html.q-apple :is(.pt-haut__logo,.eq-haut__logo,.cs-haut__logo,.cp-haut__logo){display:none!important}
  html.q-apple :is(.pt-haut__titre,.eq-haut__titre,.cs-haut__titre,.cp-haut__titre){font-size:17px}
  html.q-apple :is(.pt-vue,.eq-vue,.cs-vue,.cp-vue){max-width:var(--q-content-max)!important;margin:0 auto!important}
  html.q-apple :is(.eq-bandeau){max-width:var(--q-content-max);margin-left:auto;margin-right:auto}
  html.q-apple :is(.pt-seg,.eq-seg,.cs-seg,.cp-seg){top:56px}
  /* Barre latérale */
  html.q-apple :is(.pt-nav,.eq-barre,.cs-barre,.cp-barre){position:fixed!important;top:0!important;bottom:0!important;left:0!important;right:auto!important;transform:none!important;
    width:var(--q-sidebar)!important;height:auto;display:flex!important;flex-direction:column;align-items:stretch;gap:2px;overflow-y:auto;
    padding:84px 12px 16px!important;border:0!important;border-right:.5px solid var(--q-sep-strong)!important;border-radius:0!important;box-shadow:none!important;
    background:var(--q-sidebar-bg)!important;z-index:30}
  html.q-apple :is(.pt-nav,.eq-barre,.cs-barre,.cp-barre)::after{content:"";position:absolute;top:20px;left:22px;width:118px;height:48px;
    background:url(/assets/equipe/logo-qualite24.png) no-repeat left center/contain;pointer-events:none}
  html.q-apple :is(.pt-nav,.eq-barre,.cs-barre,.cp-barre) button{flex:none;flex-direction:row!important;align-items:center;justify-content:flex-start!important;gap:12px!important;
    min-height:44px!important;padding:0 12px!important;border-radius:10px!important;color:var(--q-label)!important;font:500 15px/1.2 var(--q-font)!important;letter-spacing:-.01em;text-align:left}
  html.q-apple :is(.pt-nav,.eq-barre,.cs-barre,.cp-barre) button svg{flex:none;width:22px!important;height:22px!important;color:var(--q-accent);stroke-width:1.8}
  html.q-apple :is(.pt-nav,.eq-barre,.cs-barre,.cp-barre) button>span{flex:1;min-width:0}
  html.q-apple :is(.pt-nav,.eq-barre,.cs-barre,.cp-barre) button[aria-current=true]{background:var(--q-accent-tint)!important;color:var(--q-accent)!important;font-weight:600!important}
  html.q-apple :is(.pt-nav,.eq-barre,.cs-barre,.cp-barre) button[aria-current=true]::before{content:none}
  html.q-apple :is(.pt-nav,.eq-barre,.cs-barre,.cp-barre) button:not([aria-current=true]):hover{background:var(--q-fill2)!important}
  html.q-apple :is(.pt-nav__pastille,.eq-barre__pastille,.cs-barre__pastille,.cp-barre__pastille){position:static!important;margin-left:auto;flex:none;transform:none}
  html.q-apple .pt-nav .pt-long{display:inline}
  html.q-apple .pt-nav .pt-court{display:none}
  /* Messages, bulles et fenêtres : centrés sur le contenu, pas sur la fenêtre */
  html.q-apple :is(.pt-toast,.eq-toast,.cs-toast,.cp-toast){left:calc(50% + var(--q-sidebar) / 2)!important;right:auto!important;transform:translateX(-50%)!important;bottom:24px!important;width:max-content;max-width:min(560px,calc(100vw - var(--q-sidebar) - 48px))}
  html.q-apple :is(.pt-etude__barre){bottom:16px}
  html.q-apple :is(.cp-totaux){bottom:16px}
  html.q-apple dialog.pt-feuille{margin:auto;border-radius:var(--q-r-xl)!important;max-height:min(86vh,860px);overflow:auto;padding-bottom:20px}
  html.q-apple section[aria-label="Simulateur de démonstration"]{left:auto!important;right:16px!important;bottom:16px!important}
  html.q-apple :is(.pt-grand-titre,.eq-grand-titre,.cs-grand-titre,.cp-grand-titre){font-size:30px!important;line-height:36px!important}
  html.q-apple body{padding-bottom:0}
}
/* Logo de la barre latérale lisible en sombre (lettres noires → blanches, le rouge reste rouge) */
@media (min-width:1024px) and (prefers-color-scheme:dark){
  html.q-apple :is(.pt-nav,.eq-barre,.cs-barre,.cp-barre)::after{filter:invert(1) hue-rotate(180deg) saturate(1.2)}
}
/* Densité « Mac » avec une souris : corps 15 px, commandes de 36 à 40 px (macOS : 28 pt par défaut) — sauf l'appli Équipe (gants, plein soleil) */
@media (min-width:1024px) and (pointer:fine){
  html.q-apple :is(.pt-nav,.eq-barre,.cs-barre,.cp-barre) button{min-height:38px!important}
  html.q-apple :is(.pt-coque,.cs-coque,.cp-coque){font-size:15px}
  html.q-apple :is(.pt-btn,.cs-btn,.cp-btn){min-height:38px;font-size:15px!important}
  html.q-apple :is(.pt-btn--xl,.cs-btn--xl,.cp-btn--xl,.pt-btn--plein){min-height:44px}
  html.q-apple :is(.pt-coque,.cs-coque,.cp-coque) :is(.pt-champ,.pt-zone,.pt-recherche,.cs-champ,.cs-zone,.cs-recherche,.cp-champ,.cp-zone,.cp-recherche){min-height:36px;font-size:15px!important}
  html.q-apple :is(.pt-filtres,.cs-filtres,.cp-filtres,.pt-seg,.cs-seg,.cp-seg) :is(button,a){min-height:34px}
  html.q-apple :is(.pt-rangee,.cs-client){padding-top:10px;padding-bottom:10px}
}

/* ===================================================================================================================== */
/* 6. ANIMATIONS COUPÉES si « Réduire les animations »                                                                    */
/* ===================================================================================================================== */
@media (prefers-reduced-motion:reduce){
  html.q-apple *,html.q-apple *::before,html.q-apple *::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}