/* AK SOLUTIONS — Application dossiers techniciens — feuille de style commune */
:root{
  color-scheme:light dark;
  --bleu:#2E3193; --cyan:#00ADEF; --rouge:#E4442A; --nuit:#12203A;
  --fond:#F1F4F9; --carte:#FFFFFF; --champ:#FFFFFF; --trait:#D5DCE7;
  --texte:#12203A; --gris:#55617A; --ok:#1C7A55; --ok-fond:#E4F5EC; --ko-fond:#FDECE8; --info-fond:#E6F5FD;
  --primaire:#2E3193; --primaire-texte:#FFFFFF; --focus:#E4442A;
  --r:14px;
  --ui:"IBM Plex Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
  padding-top:env(safe-area-inset-top,0px);
}
@media (prefers-color-scheme:dark){ :root:not([data-theme="light"]){
  --fond:#0B1424; --carte:#12203A; --champ:#0E1A2F; --trait:#28395A;
  --texte:#EEF2F8; --gris:#A8B4C8; --ok:#5ED39B; --ok-fond:#123A2B; --ko-fond:#4A1F17; --info-fond:#0F2E44;
  --primaire:#4B50D6; --primaire-texte:#FFFFFF; --focus:#FF8A6E;
}}
:root[data-theme="dark"]{
  --fond:#0B1424; --carte:#12203A; --champ:#0E1A2F; --trait:#28395A;
  --texte:#EEF2F8; --gris:#A8B4C8; --ok:#5ED39B; --ok-fond:#123A2B; --ko-fond:#4A1F17; --info-fond:#0F2E44;
  --primaire:#4B50D6; --primaire-texte:#FFFFFF; --focus:#FF8A6E;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--fond);color:var(--texte);font-family:var(--ui);font-size:17px;line-height:1.5;
  min-height:100vh;min-height:100dvh}
body.avec-bouton{padding-bottom:110px}
a{color:var(--primaire)}
:root[data-theme="dark"] a{color:#8FD8FF}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) a{color:#8FD8FF}}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
h1{font-size:26px;line-height:1.15;margin:0 0 12px;letter-spacing:-.3px;text-wrap:balance}
h2{font-size:20px;margin:0 0 8px}
p{margin:0 0 14px}
.gris{color:var(--gris)}
.centre{text-align:center}
.eyebrow{font:600 16px var(--mono);letter-spacing:2px;text-transform:uppercase;color:var(--cyan);margin:0 0 8px}
/* accueil du technicien : le prénom d'abord, centré, puis l'espace en dessous */
.accueil-tech h1{text-align:center;margin-bottom:4px}
.accueil-tech .eyebrow{text-align:center;margin:0 0 16px}

/* ---- barre du haut ---- */
.haut{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:12px;padding:10px 16px;
  background:var(--carte);border-bottom:1px solid var(--trait)}
.haut .marque img{display:block;height:44px;width:auto;background:#fff;border-radius:8px;padding:4px 8px}
.haut .titre-haut{flex:1;font-weight:600;font-size:16px;text-wrap:balance}
.accueil-haut{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 14px;border-radius:12px;border:1px solid var(--trait);
  background:var(--champ);color:var(--texte);text-decoration:none;font-weight:600;font-size:16px;white-space:nowrap;flex:0 0 auto}
.accueil-haut:hover{border-color:var(--primaire)}
@media (max-width:420px){.haut{gap:8px;padding:10px 12px}.haut .marque img{height:40px;padding:3px 6px}.accueil-haut{padding:0 12px}}
/* bouton clair / sombre : l'icône ronde de l'application, seule, cerclée d'un liseré tricolore fixe (comme le bouton d'accueil de l'outil).
   Rien d'autre sur le bouton, rien qui bouge : un appui bascule clair / sombre (le mode se voit à l'écran lui-même). */
.theme{position:relative;flex:0 0 auto;width:48px;height:48px;padding:0;border:2px solid transparent;border-radius:50%;color:var(--texte);
  background:linear-gradient(var(--champ),var(--champ)) padding-box,linear-gradient(135deg,#2E3193 0%,#00ADEF 55%,#E4442A 100%) border-box;
  box-shadow:0 8px 18px -10px rgba(0,173,239,.85);cursor:pointer;display:grid;place-items:center;transition:transform .12s}
.theme img{width:42px;height:42px;border-radius:50%;display:block;background:#fff}
.theme:hover{box-shadow:0 10px 22px -10px rgba(0,173,239,1)}
.theme:active{transform:scale(.94)}

/* ---- enveloppe et cartes ---- */
.enveloppe{max-width:560px;margin:0 auto;padding:20px 16px 40px}
.carte{background:var(--carte);border:1px solid var(--trait);border-radius:var(--r);padding:22px 18px;margin-bottom:16px;
  box-shadow:0 10px 30px -24px rgba(18,32,58,.45)}
.carte h1{margin-top:0}

/* ---- écran d'entrée ---- */
.page-entree{background:linear-gradient(170deg,#16294A 0%,#12203A 60%,#0B1424 100%);color:#F2F6FB}
.page-entree .enveloppe{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;justify-content:center;padding-top:32px}
.entree{text-align:center}
.entree-logo{display:inline-block;background:#fff;border-radius:18px;padding:14px 22px;margin:0 auto 26px;
  box-shadow:0 20px 40px -20px rgba(0,0,0,.7)}
.entree-logo img{display:block;width:220px;max-width:70vw;height:auto}
.entree h1{color:#fff;font-size:30px}
.entree .gris{color:#B9C6DA;max-width:38ch;margin:0 auto 28px}
.entree-actions{display:flex;flex-direction:column;gap:12px;max-width:380px;margin:0 auto}
.page-entree .bouton.creux{color:#fff;border-color:rgba(255,255,255,.55);background:rgba(255,255,255,.06)}
.page-entree .bouton.creux:hover{background:rgba(255,255,255,.12)}

/* ---- formulaires ---- */
label{display:block;font-weight:600;font-size:16px;margin:16px 0 6px}
input[type=text],input[type=email],input[type=tel],input[type=password],input[type=number],input[type=search],input[type=url],input[type=date],input[type=time],select,textarea{
  width:100%;min-height:56px;font:inherit;font-size:17px;color:var(--texte);background:var(--champ);
  border:1.5px solid var(--trait);border-radius:12px;padding:12px 14px}
/* menus déroulants, dates et heures : la même flèche partout, décollée du bord (le navigateur la collait au bord droit) */
select,input[type=date],input[type=time]{-webkit-appearance:none;appearance:none;padding-right:50px;position:relative;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'><path d='M3 6l5 5 5-5' fill='none' stroke='%2355617A' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  background-repeat:no-repeat;background-position:right 18px center;background-size:16px 16px}
select::-ms-expand{display:none}
input[type=date]::-webkit-calendar-picker-indicator,input[type=time]::-webkit-calendar-picker-indicator{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
:root[data-theme="dark"] select,:root[data-theme="dark"] input[type=date],:root[data-theme="dark"] input[type=time]{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'><path d='M3 6l5 5 5-5' fill='none' stroke='%23A8B4C8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>")}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) select,:root:not([data-theme="light"]) input[type=date],:root:not([data-theme="light"]) input[type=time]{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'><path d='M3 6l5 5 5-5' fill='none' stroke='%23A8B4C8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>")}}
input:focus{border-color:var(--cyan)}
input[aria-invalid="true"]{border-color:var(--rouge);box-shadow:0 0 0 3px rgba(228,68,42,.18)}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:420px){.duo{grid-template-columns:1fr}}
.aide{font-size:16px;color:var(--gris);margin:6px 0 0}
.erreur-champ{color:var(--rouge);font-size:16px;font-weight:600;margin:6px 0 0}
:root[data-theme="dark"] .erreur-champ{color:#FF9A82}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .erreur-champ{color:#FF9A82}}
.mdp{display:flex;gap:8px;align-items:stretch}
.mdp input{flex:1;min-width:0}
.oeil{flex:0 0 auto;min-width:64px;min-height:56px;border-radius:12px;border:1.5px solid var(--trait);
  background:var(--champ);color:var(--texte);font:600 16px var(--ui);cursor:pointer;padding:0 12px}
.rgpd{font-size:16px;color:var(--gris);line-height:1.5;margin:22px 0 0;padding-top:14px;border-top:1px dashed var(--trait)}

/* ---- boutons ---- */
.bouton{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:56px;padding:0 22px;
  border-radius:14px;border:2px solid var(--primaire);background:var(--primaire);color:var(--primaire-texte);
  font:600 17px var(--ui);text-decoration:none;cursor:pointer;width:100%;transition:filter .15s,transform .05s}
.bouton:hover{filter:brightness(1.08)}
.bouton:active{transform:translateY(1px)}
.bouton:disabled{opacity:.6;cursor:wait}
.bouton.creux{background:transparent;color:var(--primaire)}
:root[data-theme="dark"] .bouton.creux{color:#DDE3FF;border-color:#5C63E0}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .bouton.creux{color:#DDE3FF;border-color:#5C63E0}}
.actions{display:flex;flex-direction:column;gap:10px}
.actions form{margin:0}
.pied-action{position:fixed;left:0;right:0;bottom:0;z-index:30;padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px));
  background:var(--carte);border-top:1px solid var(--trait)}
.pied-action .bouton{max-width:560px;margin:0 auto;display:flex}

/* ---- messages ---- */
.bandeau{border-radius:12px;padding:14px 16px;margin:0 0 16px;font-size:16px;border:1px solid transparent}
.bandeau.ok{background:var(--ok-fond);color:var(--ok);border-color:color-mix(in srgb,var(--ok) 30%,transparent)}
.bandeau.ko{background:var(--ko-fond);color:var(--rouge);border-color:color-mix(in srgb,var(--rouge) 30%,transparent)}
:root[data-theme="dark"] .bandeau.ko{color:#FFB3A1}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .bandeau.ko{color:#FFB3A1}}
.bandeau.info{background:var(--info-fond);color:var(--texte);border-color:color-mix(in srgb,var(--cyan) 35%,transparent)}
.bandeau ul{margin:8px 0 0;padding-left:20px}
.bandeau li{margin:4px 0}
.bandeau.ko a{color:inherit}

/* ---- tableau de bord ---- */
.pictos{font-size:44px;line-height:1;margin:4px 0 14px}
.compteurs{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:8px 0 16px}
.compteur{background:var(--champ);border:1px solid var(--trait);border-radius:12px;padding:14px;text-align:center}
.compteur b{display:block;font-size:34px;line-height:1;color:var(--primaire)}
:root[data-theme="dark"] .compteur b{color:#8FD8FF}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .compteur b{color:#8FD8FF}}
.compteur span{display:block;font-size:16px;color:var(--gris);margin-top:6px}

.compteurs.trois{grid-template-columns:1fr 1fr 1fr}
a.compteur{text-decoration:none;color:inherit;transition:border-color .15s}
a.compteur:hover{border-color:var(--cyan)}
.compteur.alerte{border-color:var(--rouge)}
.compteur.alerte b{color:var(--rouge)}

/* ---- gestion des comptes ---- */
.onglets{display:flex;gap:8px;margin:0 0 16px;overflow-x:auto;padding-bottom:2px}
.onglet{flex:1 0 auto;min-height:48px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:0 16px;
  border-radius:999px;border:1.5px solid var(--trait);background:var(--carte);color:var(--texte);text-decoration:none;font-weight:600;font-size:16px}
.onglet b{font-size:16px;background:var(--champ);border:1px solid var(--trait);border-radius:999px;padding:2px 10px;line-height:1.3}
.onglet.actif{background:var(--primaire);border-color:var(--primaire);color:#fff}
.onglet.actif b{background:rgba(255,255,255,.18);border-color:transparent;color:#fff}
.comptes{display:grid;gap:14px}
.compte{background:var(--carte);border:1px solid var(--trait);border-radius:var(--r);padding:18px;box-shadow:0 10px 30px -24px rgba(18,32,58,.45)}
.compte-tete{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:10px}
.compte h3{font-size:19px;margin:0;line-height:1.3}
.badge{display:inline-block;font-size:16px;font-weight:600;color:var(--cyan);border:1px solid color-mix(in srgb,var(--cyan) 45%,transparent);
  border-radius:999px;padding:1px 10px;margin-left:6px;vertical-align:middle}
.badge.gris{color:var(--gris);border-color:var(--trait)}
.etat{flex:0 0 auto;font-size:16px;font-weight:600;border-radius:999px;padding:5px 12px;border:1px solid transparent}
.etat.en_attente{background:#FFF3D6;color:#7A4B00;border-color:#F2C978}
.etat.actif{background:var(--ok-fond);color:var(--ok)}
.etat.suspendu{background:var(--ko-fond);color:var(--rouge)}
:root[data-theme="dark"] .etat.en_attente{background:#4A3410;color:#FFD68A;border-color:#7A5A1E}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .etat.en_attente{background:#4A3410;color:#FFD68A;border-color:#7A5A1E}
  :root:not([data-theme="light"]) .etat.suspendu{color:#FFB3A1}}
:root[data-theme="dark"] .etat.suspendu{color:#FFB3A1}
.compte-infos{margin:0;display:grid;grid-template-columns:1fr 1fr;gap:8px 16px}
.compte-infos div{min-width:0}
.compte-infos dt{font-size:16px;color:var(--gris)}
.compte-infos dd{margin:0;font-size:16px;font-weight:600;overflow-wrap:anywhere}
.compte-actions{display:flex;flex-direction:column;gap:10px;margin-top:16px}
.compte-actions form{margin:0}
.bouton.danger{color:var(--rouge);border-color:var(--rouge)}
:root[data-theme="dark"] .bouton.danger{color:#FFB3A1;border-color:#E4442A}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .bouton.danger{color:#FFB3A1;border-color:#E4442A}}
/* ---- mes dossiers (technicien) ---- */
.dossiers{display:grid;gap:14px;margin-bottom:16px}
.dossier-tete{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;margin-bottom:12px;padding-bottom:12px;border-bottom:1px solid var(--trait)}
.dossier-tech .dossier-actions{grid-template-columns:1fr 1fr}
.dossier-tech .dossier-actions form{margin:0;grid-column:1 / -1}
.dossier-tech .dossier-actions .bouton{width:100%}
.popup-alerte{position:fixed;left:16px;right:16px;bottom:16px;z-index:60;max-width:440px;margin:0 auto;background:var(--carte);color:var(--texte);border:2px solid var(--rouge);border-radius:16px;
  padding:14px 16px;box-shadow:0 18px 40px -14px rgba(18,32,58,.7)}
.popup-alerte[hidden]{display:none}
.popup-alerte p{margin:0 0 8px;font-size:16px}
.popup-alerte .popup-titre{font-weight:700;font-size:17px;color:var(--rouge)}
:root[data-theme="dark"] .popup-alerte .popup-titre{color:#FFB3A1}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .popup-alerte .popup-titre{color:#FFB3A1}}
.popup-actions{display:flex;gap:8px;margin-top:10px}
.popup-actions .bouton{flex:1 1 auto;width:auto;min-height:48px;padding:0 14px}
.coche-fiche{display:flex;align-items:center;gap:10px;min-height:48px;margin:-6px 0 4px;font-weight:600;color:var(--gris);cursor:pointer;width:max-content}
.coche-fiche input{width:26px;height:26px;accent-color:var(--primaire);cursor:pointer}
.rappel-action{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;flex:1 1 100%;margin:6px 0 0}
.rappel-action .bouton{width:auto;min-height:48px;padding:0 14px}
.rappel-fiche{margin-top:14px}
.docs.rappels li{flex-wrap:wrap}
.quota{margin:0;font-weight:600;color:var(--gris)}
.quota.alerte{color:var(--rouge)}
.recherche-tech input[type=search]{margin-bottom:0}
/* ---- sélection en lot (bureau) ---- */
.tableau td.sel,.tableau th.sel{width:48px;text-align:center;vertical-align:middle}
.tableau input[type=checkbox]{width:26px;height:26px;accent-color:var(--primaire);cursor:pointer}
.barre-lot{position:fixed;left:0;right:0;bottom:0;z-index:30;background:var(--carte);border-top:2px solid var(--primaire);padding:10px 16px calc(10px + env(safe-area-inset-bottom,0px));
  box-shadow:0 -10px 30px -20px rgba(18,32,58,.5)}
.barre-lot[hidden]{display:none}
.barre-lot .int{max-width:960px;margin:0 auto;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.barre-lot .nb{font-weight:700;flex:1 1 100%}
.barre-lot .bouton{width:auto;flex:1 1 auto;min-height:48px;padding:0 14px;font-size:16px}
.barre-lot input[type=email]{flex:1 1 220px;min-height:48px}
.barre-lot .dest-lot{flex:1 1 240px}
.barre-lot .dest-lot select{min-height:48px;padding:0 12px}
.barre-lot .dest-lot input[type=email]{width:100%;margin:0}
.dest-autre[hidden],.dest-copie[hidden]{display:none}
.dest-autre{margin-top:6px}
select.dest-choix{margin-bottom:6px}
body.avec-lot{padding-bottom:180px}
.lot-tete{display:flex;justify-content:flex-start;margin:0 0 10px}
.lot-tete .bouton{width:auto;min-height:48px;padding:0 16px}
.lot-tete .bouton[hidden]{display:none}
/* menu d'actions d'un dossier : un seul bouton, la liste s'ouvre dessous */
.menu-actions{position:relative;margin:0}
.menu-actions summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 14px;border-radius:10px;
  border:1.5px solid var(--trait);background:var(--champ);color:var(--texte);font-weight:600;font-size:16px;white-space:nowrap;user-select:none}
.menu-actions summary::-webkit-details-marker{display:none}
.menu-actions summary::after{content:"▾";font-size:14px}
.menu-actions[open] summary{border-color:var(--primaire)}
.menu-actions[open] summary::after{content:"▴"}
.menu-actions .menu{position:absolute;right:0;top:calc(100% + 4px);z-index:35;min-width:240px;background:var(--carte);border:1px solid var(--trait);border-radius:12px;
  box-shadow:0 18px 40px -18px rgba(18,32,58,.6);padding:6px;display:grid;gap:2px;text-align:left}
.menu-actions .menu a{display:flex;align-items:center;min-height:48px;padding:0 12px;border-radius:8px;color:var(--texte);text-decoration:none;font-weight:600;font-size:16px;white-space:nowrap}
.menu-actions .menu a:hover,.menu-actions .menu a:focus-visible{background:var(--champ)}
.menu-actions .menu a.danger{color:var(--rouge)}
:root[data-theme="dark"] .menu-actions .menu a.danger{color:#FFB3A1}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .menu-actions .menu a.danger{color:#FFB3A1}}
.dossier{background:var(--carte);border:1px solid var(--trait);border-radius:var(--r);padding:18px;box-shadow:0 10px 30px -24px rgba(18,32,58,.45)}
.dossier h3{font-size:19px;margin:0;line-height:1.3}
.dossier-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}
.dossier-actions .bouton:only-child{grid-column:1 / -1}
.montant{font-family:var(--mono);font-variant-numeric:tabular-nums}
.etat.en_cours{background:#FFF3D6;color:#7A4B00;border-color:#F2C978}
.etat.signe{background:var(--info-fond);color:var(--texte);border-color:color-mix(in srgb,var(--cyan) 45%,transparent)}
.etat.envoye{background:var(--ok-fond);color:var(--ok)}
:root[data-theme="dark"] .etat.en_cours{background:#4A3410;color:#FFD68A;border-color:#7A5A1E}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .etat.en_cours{background:#4A3410;color:#FFD68A;border-color:#7A5A1E}}
.mdp-provisoire{border:2px solid var(--cyan);background:var(--info-fond)}
.code-mdp{font:700 28px var(--mono);letter-spacing:1px;background:var(--carte);border:1.5px dashed var(--cyan);border-radius:12px;
  padding:14px;text-align:center;user-select:all;margin:10px 0 14px;overflow-wrap:anywhere}

/* ---- espace bureau ---- */
.nav-app{display:flex;gap:8px;overflow-x:auto;padding:2px 2px 10px;margin:-6px 0 12px;scrollbar-width:none}
.nav-app::-webkit-scrollbar{display:none}
.nav-app a{flex:0 0 auto;min-height:48px;display:inline-flex;align-items:center;padding:0 16px;border-radius:999px;border:1.5px solid var(--trait);
  background:var(--carte);color:var(--texte);text-decoration:none;font-weight:600;font-size:16px;white-space:nowrap}
.nav-app a.actif{background:var(--primaire);border-color:var(--primaire);color:#fff}
.stats{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:8px 0 6px}
.stat{display:block;background:var(--champ);border:1px solid var(--trait);border-radius:12px;padding:14px;text-decoration:none;color:inherit;min-height:48px}
a.stat:hover{border-color:var(--cyan)}
.stat b{display:block;font-size:30px;line-height:1.1;color:var(--primaire);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.stat.ca b{font-size:24px;font-family:var(--mono)}
.stat>span{display:block;font-size:16px;color:var(--gris);margin-top:6px}
.stat.alerte{border-color:var(--rouge)}
.stat.alerte b{color:var(--rouge)}
:root[data-theme="dark"] .stat b{color:#8FD8FF}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .stat b{color:#8FD8FF}}
.delta{font-size:16px;margin-top:4px}
.delta.plus{color:var(--ok)}
.delta.moins{color:var(--rouge)}
.delta.neutre{color:var(--gris)}
/* ---- accueil du bureau : bloc bleu nuit aux couleurs AK ---- */
.hero{position:relative;isolation:isolate;overflow:hidden;border-radius:18px;padding:22px 18px 16px;margin-bottom:16px;color:#F2F6FB;
  background:linear-gradient(160deg,#182D52 0%,#12203A 55%,#0D182C 100%);border:1px solid rgba(255,255,255,.10);box-shadow:0 22px 44px -26px rgba(18,32,58,.75)}
.hero::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;z-index:2;background:linear-gradient(90deg,#2E3193 0%,#00ADEF 55%,#E4442A 100%)}
.hero::after{content:"";position:absolute;z-index:-1;width:420px;height:420px;right:-170px;top:-200px;border-radius:50%;background:radial-gradient(closest-side,rgba(0,173,239,.32),rgba(0,173,239,0))}
.hero-haut{display:flex;justify-content:center;align-items:flex-start;gap:12px;flex-wrap:wrap;text-align:center}
.titre-crm{font-size:38px;letter-spacing:3px;margin:0 0 2px;color:#fff;text-shadow:0 2px 18px rgba(0,173,239,.35)}
.hero-date{font:600 16px var(--mono);letter-spacing:1px;text-transform:uppercase;color:#00ADEF;margin:0 0 14px}
.hero-date{margin-bottom:10px}
.recherche-rapide{display:flex;gap:8px;margin:0 0 14px;align-items:flex-start;position:relative}
.suggest-zone{position:static;flex:1;min-width:0}
.suggest-zone input[type=search]{width:100%}
.suggestions{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:40;background:var(--carte);color:var(--texte);border:1px solid var(--trait);border-radius:12px;
  box-shadow:0 18px 40px -18px rgba(18,32,58,.6);overflow:hidden;text-align:left}
.suggestions a{display:block;padding:12px 14px;text-decoration:none;color:var(--texte);border-top:1px solid var(--trait);min-height:48px}
.suggestions a:first-child{border-top:0}
.suggestions a:hover,.suggestions a:focus{background:var(--champ)}
.suggestions a b{display:block;font-size:16px}
.suggestions a span{display:block;font-size:16px;color:var(--gris)}
.suggestions p{margin:0;padding:12px 14px;font-size:16px;color:var(--gris)}
.recherche-rapide input[type=search]{flex:1;min-width:0;background:#fff;color:#12203A;border-color:transparent}
.recherche-rapide input[type=search]::placeholder{color:#55617A}
.recherche-rapide .bouton{width:auto;flex:0 0 auto;padding:0 18px;background:#fff;color:#12203A;border-color:#fff}
/* « Vendu ce mois » : une petite étiquette à liseré tricolore, fond teinté comme les trois cases du dessous,
   la phrase centrée, le nombre de dossiers dans une bulle et le total en euros */
.vendu{position:relative;isolation:isolate;overflow:hidden;display:block;text-decoration:none;color:#fff;border:2px solid transparent;border-radius:16px;padding:12px 14px 14px;margin:0 0 10px;text-align:center;
  background:linear-gradient(160deg,color-mix(in srgb,#00ADEF 22%,#16294A) 0%,color-mix(in srgb,#2E3193 26%,#16294A) 55%,color-mix(in srgb,#D68910 16%,#16294A) 100%) padding-box,linear-gradient(135deg,#2E3193 0%,#00ADEF 55%,#E4442A 100%) border-box;
  box-shadow:0 12px 26px -18px rgba(0,173,239,.9);transition:transform .15s,box-shadow .15s}
.vendu::after{content:"";position:absolute;z-index:-1;width:170px;height:170px;right:-70px;bottom:-90px;border-radius:50%;background:radial-gradient(closest-side,rgba(242,163,58,.30),transparent)}
.vendu::before{content:"";position:absolute;z-index:-1;width:120px;height:120px;left:-50px;top:-60px;border-radius:50%;background:radial-gradient(closest-side,rgba(0,173,239,.28),transparent)}
.vendu:hover{transform:translateY(-2px);box-shadow:0 16px 30px -16px rgba(0,173,239,.9)}
.vendu-lib{display:block;font-size:16px;color:#D6E1F0;margin-bottom:10px;text-align:center}
.vendu-chiffres{display:flex;justify-content:center;align-items:center;gap:16px}
.vendu .vendu-nb{flex:0 0 auto;display:inline-grid;place-items:center;width:58px;height:58px;border-radius:50%;background:linear-gradient(135deg,#00ADEF,#2E3193);color:#fff;font:800 26px var(--mono);
  border:2px solid rgba(255,255,255,.4);box-shadow:0 10px 20px -12px rgba(0,173,239,.95),0 0 0 4px rgba(0,173,239,.14);font-variant-numeric:tabular-nums}
.vendu .vc{display:flex;flex-direction:column;min-width:0;text-align:left}
.vendu .vc b{display:block;font:700 clamp(24px,7.2vw,34px)/1.1 var(--mono);letter-spacing:-.3px;white-space:nowrap;color:#fff;font-variant-numeric:tabular-nums}
.vendu .vc small{font-size:16px;color:#B9C6DA;margin-top:2px;line-height:1.2}
.mini-stat .delta{display:block;margin-top:6px}
.hero .delta.plus{color:#5ED39B}
.hero .delta.moins{color:#FF9A82}
.hero .delta.neutre{color:#B9C6DA}
.trio{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.mini-stat{position:relative;display:block;text-decoration:none;color:#fff;background:linear-gradient(160deg,rgba(255,255,255,.10),rgba(255,255,255,.04));border:1px solid rgba(255,255,255,.14);border-radius:16px;padding:16px 8px 14px;text-align:center;min-height:48px;
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease;overflow:hidden;isolation:isolate}
.mini-stat::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--accent,#00ADEF)}
.mini-stat::after{content:"";position:absolute;z-index:-1;width:150px;height:150px;right:-60px;bottom:-80px;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--accent,#00ADEF) 28%,transparent),transparent)}
.mini-stat.encours{--accent:#F2A33A}
.mini-stat.signes{--accent:#00ADEF}
.mini-stat.envoyes{--accent:#5ED39B}
.mini-stat:hover{transform:translateY(-3px);box-shadow:0 14px 30px -14px rgba(0,0,0,.6);background:linear-gradient(160deg,rgba(255,255,255,.16),rgba(255,255,255,.06))}
.mini-stat i{display:block;font-style:normal;font-size:22px;line-height:1;margin-bottom:8px}
.mini-stat b{display:block;font:700 34px/1 var(--mono);font-variant-numeric:tabular-nums;color:#fff}
.mini-stat>span{display:block;font-size:16px;color:#B9C6DA;margin-top:6px;line-height:1.2}
.mini-stat .delta{font-size:16px}
.mini-stat.alerte{border-color:#E4442A;box-shadow:inset 0 0 0 1px rgba(228,68,42,.35)}
.mini-stat.alerte b{color:#FF9A82}
.hero-note{margin:12px 0 0;font-size:16px;color:#8E9DB5;text-align:center}
.hero :focus-visible{outline-color:#00ADEF}
@media (min-width:700px){
  .hero{padding:26px 26px 20px}
  .vendu .vc b{font-size:38px}
  .vendu-chiffres{gap:22px}
  .vendu .vendu-nb{width:64px;height:64px;font-size:30px}
  .vendu{max-width:560px;margin:0 auto 12px}
}
.activite-tech .rang{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--primaire);color:#fff;font-size:15px;font-weight:700;margin-right:8px;vertical-align:middle}
.activite-tech tr.sans-activite td{color:var(--gris)}
.activite-tech tr.sans-activite a{font-weight:500}
.badge.rouge{color:var(--rouge);border-color:color-mix(in srgb,var(--rouge) 45%,transparent)}
.carte.a-rappeler{border-color:color-mix(in srgb,var(--rouge) 45%,transparent)}
.derniers li a{font-weight:500}
.raccourcis .bouton b{margin-left:6px;background:rgba(255,255,255,.18);border-radius:999px;padding:2px 10px;font-size:16px}
.raccourcis .bouton.creux b{background:var(--champ);border:1px solid var(--trait)}
.podium{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.podium a{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;align-items:center;padding:12px 14px;border:1px solid var(--trait);border-radius:12px;background:var(--champ);color:inherit;text-decoration:none;min-height:56px}
.podium .rang{grid-row:1 / span 2;width:40px;height:40px;border-radius:50%;background:var(--primaire);color:#fff;display:grid;place-items:center;font-weight:700;font-size:18px}
.podium b{font-size:17px}
.podium span:not(.rang){color:var(--gris);font-size:16px}
.raccourcis{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.raccourcis .bouton:first-child{grid-column:1 / -1}
.filtres{background:var(--carte);border:1px solid var(--trait);border-radius:var(--r);padding:14px 16px 16px;margin-bottom:14px}
.filtres input[type=search]{margin-bottom:8px}
.filtres-grille{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}
.filtres-grille label{margin-top:10px;font-size:16px}
.filtres-plus{margin:0}
.filtres-plus summary{list-style:none;cursor:pointer;display:none;align-items:center;justify-content:space-between;min-height:48px;padding:0 4px;font-weight:600;font-size:16px;color:var(--primaire);user-select:none}
.filtres-plus summary::-webkit-details-marker{display:none}
.filtres-plus summary::after{content:"Afficher ▾";font-weight:500;color:var(--gris)}
.filtres-plus[open] summary::after{content:"Masquer ▴"}
@media (max-width:699px){.filtres-plus summary{display:flex;margin-top:4px}}
.recherche-ligne{display:flex;gap:8px;align-items:flex-start;position:relative}
.recherche-ligne .suggest-zone input[type=search]{margin-bottom:0}
.recherche-ligne .bouton{width:auto;flex:0 0 auto;padding:0 18px}
.filtres-retour{margin:10px 0 0;font-size:16px}
.filtres-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.filtres-actions .bouton{width:auto;flex:1 1 auto}
.js .bouton-filtrer{display:none}
.visuellement-cache{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.resultat{margin:0 0 10px;color:var(--gris);font-weight:600}
#liste.charge{opacity:.55;transition:opacity .15s}
.tableau{width:100%;border-collapse:separate;border-spacing:0;background:var(--carte);border:1px solid var(--trait);border-radius:var(--r);margin-bottom:14px}
.tableau thead th:first-child{border-top-left-radius:var(--r)}
.tableau thead th:last-child{border-top-right-radius:var(--r)}
.tableau tbody tr:last-child td:first-child{border-bottom-left-radius:var(--r)}
.tableau tbody tr:last-child td:last-child{border-bottom-right-radius:var(--r)}
.tableau th{text-align:left;font-size:16px;color:var(--gris);padding:12px 10px;border-bottom:1px solid var(--trait);background:var(--champ);vertical-align:bottom}
.tableau td{padding:12px 10px;border-bottom:1px solid var(--trait);vertical-align:top;font-size:16px}
.tableau tr:last-child td{border-bottom:0}
.tableau a.client{font-weight:700}
.tableau td.montant{white-space:nowrap}
.tableau .fichier{display:block;font-size:16px;overflow-wrap:anywhere;margin:0 0 4px}
.tableau .fichier small{color:var(--gris);font-size:16px}
.tableau .actions{white-space:nowrap}
.mini{display:inline-flex;align-items:center;min-height:40px;padding:0 10px;margin:2px 4px 2px 0;border-radius:8px;border:1px solid var(--trait);background:var(--champ);color:var(--texte);text-decoration:none;font-weight:600;font-size:16px}
.mini.danger{color:var(--rouge);border-color:color-mix(in srgb,var(--rouge) 45%,transparent)}
@media (max-width:699px){
  .tableau,.tableau tbody,.tableau tr,.tableau td{display:block;width:100%}
  .tableau thead{display:none}
  .tableau tr{padding:6px 0 10px;border-bottom:8px solid var(--fond)}
  .tableau td{border-bottom:0;padding:8px 14px;display:grid;grid-template-columns:110px 1fr;gap:10px;align-items:start}
  .tableau td::before{content:attr(data-l);color:var(--gris);font-size:16px}
  .tableau td.actions{white-space:normal;grid-template-columns:1fr}
  .tableau td.actions::before{display:none}
  .tableau td.actions .mini{min-height:48px;padding:0 14px}
  /* fiches compactes sur téléphone : case à gauche, l'essentiel sur trois lignes, un menu d'actions */
  .dossiers-tableau tr,.clients-tableau tr{display:grid;gap:4px 10px;align-items:center;padding:12px 14px 14px;width:auto;border-bottom:8px solid var(--fond)}
  .dossiers-tableau tr{grid-template-columns:auto auto minmax(0,1fr) auto;grid-template-areas:"sel client client etat" ". date doc montant" ". adresse adresse adresse" ". contact contact contact" ". tech tech tech" ". fichiers fichiers fichiers" "actions actions actions actions"}
  .clients-tableau tr{grid-template-columns:auto auto minmax(0,1fr);grid-template-areas:"sel client client" ". date tech" ". ville nb" ". prochain prochain"}
  .clients-tableau td.c-date{grid-area:date;color:var(--gris)}
  .clients-tableau td.c-tech{grid-area:tech}
  .clients-tableau td.c-ville{grid-area:ville;color:var(--gris)}
  .clients-tableau td.c-nb{grid-area:nb}
  .clients-tableau td.c-date a,.clients-tableau td.c-tech a,.clients-tableau td.c-nb a{color:inherit;text-decoration:none}
  .clients-tableau td.c-tech::before{display:inline;content:"par ";color:var(--gris)}
  .dossiers-tableau td,.clients-tableau td{display:block;width:auto;padding:0;min-width:0;overflow-wrap:anywhere;border:0}
  .dossiers-tableau td::before,.clients-tableau td::before{display:none}
  .dossiers-tableau td.sel,.clients-tableau td.sel{grid-area:sel;display:flex;align-items:center;align-self:start;padding:2px 0 0;width:auto}
  .c-client{grid-area:client;font-size:18px}
  .c-etat{grid-area:etat;justify-self:end}
  .c-date{grid-area:date;color:var(--gris)}
  .c-doc{grid-area:doc;color:var(--gris)}
  .c-doc br{display:none}
  .c-doc small{font-size:16px;margin-left:5px}
  .c-montant{grid-area:montant;justify-self:end;font-weight:700;white-space:nowrap}
  .c-adresse{grid-area:adresse}
  .dossiers-tableau td.c-contact,.clients-tableau td.c-contact{grid-area:contact;display:flex;flex-wrap:wrap;gap:2px 12px;align-items:baseline}
  .c-contact br{display:none}
  .c-contact a,.c-contact span{max-width:100%}
  .c-contact a:first-child,.c-contact span:first-child{white-space:nowrap}
  .c-total{white-space:nowrap}
  .c-tech{grid-area:tech;color:var(--gris)}
  .dossiers-tableau td.c-tech::before{display:inline;content:"Technicien : "}
  .c-fichiers{grid-area:fichiers}
  .dossiers-tableau .fichier{display:flex;gap:8px;align-items:baseline;margin:2px 0 0}
  .dossiers-tableau .fichier .nom{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .dossiers-tableau td.actions{grid-area:actions;margin-top:8px}
  .menu-actions summary{width:100%}
  .menu-actions .menu{position:static;margin-top:6px;box-shadow:none;min-width:0}
  .menu-actions .menu a{white-space:normal}
  .c-nb{grid-area:nb}
  .c-total{grid-area:total}
  .c-dernier{grid-area:dernier}
  .c-prochain{grid-area:prochain}
  .clients-tableau td.c-prochain::before{display:inline;content:attr(data-l) " : ";color:var(--gris);font-size:16px}
  .dest-lot{flex:1 1 220px;display:flex;flex-wrap:wrap;gap:8px}
  .dest-lot select{flex:1 1 200px;min-height:48px;margin:0}
  .dest-lot .dest-autre{flex:1 1 100%}
  .dest-lot .dest-autre[hidden]{display:none}
  .tableau tbody tr:last-child td{border-radius:0}
}
.pagination{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:8px 0 18px}
.pagination .bouton{width:auto}
.docs{list-style:none;margin:0;padding:0}
.docs li{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 14px;padding:12px 0;border-top:1px solid var(--trait)}
.docs li:first-child{border-top:0}
.docs li a{font-weight:600;overflow-wrap:anywhere}
.docs li span{font-size:16px}
.pj-choix{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:10px 0}
.fichier-bouton{cursor:pointer}
.coche-ligne{display:flex;align-items:center;gap:12px;margin:14px 0;font-weight:600;min-height:48px}
.coche-ligne input{width:26px;height:26px;accent-color:var(--primaire)}
textarea{width:100%;font:inherit;font-size:17px;color:var(--texte);background:var(--champ);border:1.5px solid var(--trait);border-radius:12px;padding:12px 14px;min-height:96px}

@media (min-width:700px){
  .stats{grid-template-columns:repeat(4,1fr)}
  .raccourcis{grid-template-columns:repeat(3,1fr)}
  .raccourcis .bouton:first-child{grid-column:auto}
  .filtres-grille{grid-template-columns:repeat(4,1fr)}
  .enveloppe{padding-top:32px}
  .carte{padding:28px 26px}
  .enveloppe.large{max-width:1180px}
  .compte{display:grid;grid-template-columns:1fr auto;gap:8px 24px;align-items:start}
  .compte-tete{grid-column:1;margin:0}
  .compte-infos{grid-column:1;grid-template-columns:repeat(3,1fr)}
  .compte-actions{grid-column:2;grid-row:1 / span 2;margin:0;min-width:220px}
  .dossiers{grid-template-columns:1fr 1fr}
}

/* ============================================================
   Planning : rendez-vous du bureau et « Mon planning » du technicien
   ============================================================ */
.pastille-nav{margin-left:6px;background:var(--rouge);color:#fff;border-radius:999px;padding:1px 8px;font-size:14px;line-height:1.4}
.nav-app a.actif .pastille-nav{background:#fff;color:var(--primaire)}
.planning-tete h1{margin:0}
.planning-titre{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.planning-titre .bouton{width:auto;padding:0 18px}
.planning-nav{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.planning-nav .bouton{width:auto;min-width:48px;padding:0 14px;margin:0}
.planning-nav input[type=date]{width:auto;flex:1 1 150px;min-height:48px;margin:0}
.planning-nav select{width:auto;flex:1 1 180px;min-height:48px;margin:0}
.planning-maj{margin:6px 0 20px;font-size:16px}
.rdv-jour{font-size:18px;margin:18px 0 10px;color:var(--gris);font-weight:600}
.rdv-jour.auj{color:var(--primaire)}
.rdv-liste{display:grid;gap:12px}
.rdv{background:var(--carte);border:1px solid var(--trait);border-left:6px solid var(--gris);border-radius:var(--r);padding:16px;box-shadow:0 10px 30px -24px rgba(18,32,58,.45)}
.rdv{border-left-color:var(--sc,var(--gris))}
.rdv.st-annule{opacity:.72}
.rdv.st-termine{opacity:.85}
.rdv.st-a_planifier{border-style:dashed}
.rdv.rdv-neuf{box-shadow:0 0 0 2px color-mix(in srgb,var(--rouge) 40%,transparent)}
.rdv-tete{display:flex;gap:14px;align-items:flex-start}
.rdv-heure{flex:0 0 64px;text-align:center;padding:8px 0;border-radius:12px;background:var(--champ);border:1px solid var(--trait)}
.rdv-heure b{display:block;font:700 20px var(--mono);line-height:1.1}
.rdv-heure small{display:block;font-size:14px;color:var(--gris);margin-top:2px}
.rdv-corps{flex:1;min-width:0}
.rdv-corps p{margin:0 0 4px;font-size:16px;overflow-wrap:anywhere}
.rdv-client{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:18px!important}
.rdv-client .client,.rdv-client b{font-weight:700;font-size:18px}
.rdv-type{font-weight:600}
.rdv-adr a{text-decoration:none;font-weight:600}
.rdv-contact,.rdv-note{color:var(--gris)}
.rdv-tech{display:flex;align-items:center;gap:8px;margin-top:6px!important}
.rdv-tech .tech-nom{font-weight:600}
.etat.propose{background:#FFF3D6;color:#7A4B00;border-color:#F2C978}
.etat.confirme{background:var(--ok-fond);color:var(--ok)}
.etat.reporte{background:var(--ko-fond);color:var(--rouge)}
.etat.annule{background:var(--champ);color:var(--gris);border-color:var(--trait)}
.etat.termine{background:var(--info-fond);color:var(--texte);border-color:color-mix(in srgb,var(--primaire) 40%,transparent)}
.etat.a_planifier{background:var(--info-fond);color:var(--texte);border-color:color-mix(in srgb,var(--cyan) 45%,transparent)}
:root[data-theme="dark"] .etat.propose{background:#4A3410;color:#FFD68A;border-color:#7A5A1E}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .etat.propose{background:#4A3410;color:#FFD68A;border-color:#7A5A1E}
  :root:not([data-theme="light"]) .etat.reporte{color:#FFB3A1}}
:root[data-theme="dark"] .etat.reporte{color:#FFB3A1}
.rdv-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;padding-top:12px;border-top:1px solid var(--trait)}
.rdv-actions .bouton{width:auto;flex:1 1 auto;padding:0 14px;margin:0}
.rdv-actions form.rdv-act{margin:0;flex:1 1 auto;display:flex}
.rdv-actions form.rdv-act .bouton{width:100%}
.rdv-actions .bouton.signer{flex:1 1 100%;background:var(--ok);border-color:var(--ok);color:#fff}
.rdv-plus{flex:1 1 auto;margin:0;position:relative}
.rdv-plus summary{list-style:none;cursor:pointer;width:100%;box-sizing:border-box}
.rdv-plus summary::-webkit-details-marker{display:none}
.rdv-plus[open]{flex:1 1 100%}
.rdv-reporter{margin:10px 0 0;padding:14px;border:1px solid var(--trait);border-radius:12px;background:var(--champ);display:grid;gap:8px}
.rdv-reporter label{margin:0;font-size:16px;font-weight:600}
.rdv-reporter input{margin:4px 0 0}
.rdv-reporter .bouton{width:auto;justify-self:start;padding:0 18px}
.avatar{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--c,var(--primaire));color:#fff;font:700 13px var(--ui);letter-spacing:.5px;flex:0 0 auto}
.avatar.vide{background:var(--trait);color:var(--gris)}
.semaine{display:grid;gap:10px}
.semaine .jour{background:var(--carte);border:1px solid var(--trait);border-radius:var(--r);padding:12px 14px}
.semaine .jour.aujourdhui{border-color:var(--primaire);box-shadow:inset 0 0 0 1px var(--primaire)}
.semaine .jour h2{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:16px;margin:0 0 8px;color:var(--gris)}
.semaine .jour h2 a{text-decoration:none;color:inherit;font-weight:700}
.semaine .jour.aujourdhui h2 a:first-child{color:var(--primaire)}
.semaine .ajout-jour{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:50%;border:1px solid var(--trait);color:var(--primaire);font-size:22px;background:var(--champ)}
.semaine .vide-jour{margin:0;font-size:16px}
.rdv-mini{display:grid;grid-template-columns:auto 1fr auto;gap:2px 10px;align-items:center;min-height:48px;padding:8px 10px;margin:0 0 6px;border-radius:10px;border:1px solid var(--trait);border-left:5px solid var(--gris);background:var(--champ);color:var(--texte);text-decoration:none;font-size:16px}
.rdv-mini{border-left-color:var(--sc,var(--gris))}.rdv-mini.st-annule{opacity:.7}.rdv-mini.st-termine{opacity:.85}
.rdv-mini b{font:700 16px var(--mono)}
.rdv-mini .avatar{width:28px;height:28px;font-size:11px;grid-column:3;grid-row:1 / span 2}
.rdv-mini small{grid-column:1 / span 2;color:var(--gris);font-size:15px}
@media (min-width:900px){.semaine{grid-template-columns:repeat(7,1fr)} .semaine .jour{padding:10px} .semaine .jour h2{font-size:15px;flex-direction:column;align-items:flex-start} .rdv-mini{grid-template-columns:1fr auto} .rdv-mini b{grid-column:1} .rdv-mini .avatar{grid-column:2;grid-row:1} .rdv-mini small{grid-column:1 / span 2}}
#rdv-form .trio-champs{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}
@media (max-width:480px){#rdv-form .trio-champs{grid-template-columns:1fr 1fr} #rdv-form .trio-champs>div:first-child{grid-column:1 / -1}}
.suggestions.ba{position:absolute}
.suggest-zone{position:relative}
.suggestions button{display:block;width:100%;text-align:left;padding:12px 14px;border:0;border-top:1px solid var(--trait);background:transparent;color:var(--texte);font:inherit;min-height:48px;cursor:pointer}
.suggestions button:first-child{border-top:0}
.suggestions button:hover,.suggestions button:focus{background:var(--champ)}
.suggestions button b{display:block;font-size:16px}
.suggestions button span{display:block;font-size:16px;color:var(--gris)}
input[data-adresse]{position:relative}
.planning-resume .compteurs{margin-top:14px}
.rdv-passes{padding:0}
.rdv-passes summary{cursor:pointer;min-height:48px;display:flex;align-items:center;padding:14px 18px;font-weight:600;font-size:16px;list-style:none}
.rdv-passes summary::-webkit-details-marker{display:none}
.rdv-passes summary::after{content:"▾";margin-left:auto;color:var(--gris)}
.rdv-passes[open] summary::after{content:"▴"}
.rdv-passes .rdv-liste{padding:0 14px 14px}

/* ---- tableau de bord : planning du jour, cartes des techniciens, trouver un client, à rappeler ---- */
.rdv-lignes{display:grid;gap:8px;margin:0 0 12px}
.rdv-ligne{display:flex;align-items:center;gap:12px;min-height:56px;padding:8px 12px;border:1px solid var(--trait);border-left:5px solid var(--gris);border-radius:12px;text-decoration:none;color:var(--texte);background:var(--champ)}
.rdv-ligne.st-annule{opacity:.7}.rdv-ligne.st-termine{opacity:.85}
.rdv-ligne .quand{flex:0 0 auto;text-align:center;min-width:54px}
.rdv-ligne .quand b{display:block;font:700 17px var(--mono)}
.rdv-ligne .qui{flex:1;min-width:0}
.rdv-ligne .qui b{display:block;font-size:16px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rdv-ligne .qui small{display:block;font-size:16px;color:var(--gris);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rdv-ligne .etat{display:none}
@media (min-width:520px){.rdv-ligne .etat{display:inline-block}}
.raccourcis-ligne{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}
.raccourcis-ligne .bouton{width:auto;flex:1 1 auto;padding:0 16px}
.raccourcis-ligne .bouton b{margin-left:6px;background:rgba(255,255,255,.18);border-radius:999px;padding:2px 10px;font-size:16px}
.raccourcis-ligne .bouton.creux b{background:var(--champ);border:1px solid var(--trait)}
.tech-cartes{display:grid;gap:12px}
@media (min-width:700px){.tech-cartes{grid-template-columns:1fr 1fr}}
@media (min-width:1060px){.tech-cartes{grid-template-columns:repeat(3,1fr)}}
.tech-carte{position:relative;isolation:isolate;overflow:hidden;background:var(--champ);border:1px solid var(--trait);border-top:5px solid var(--c,var(--primaire));border-radius:16px;padding:16px;box-shadow:0 10px 30px -24px rgba(18,32,58,.45)}
.tech-carte::after{content:"";position:absolute;z-index:-1;width:170px;height:170px;right:-70px;top:-90px;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--c,var(--primaire)) 22%,transparent),transparent)}
.tech-carte.sans-activite{opacity:.8}
.tech-tete{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.tech-tete .avatar{width:46px;height:46px;font-size:16px;background:var(--c,var(--primaire))}
.tech-nom{min-width:0;flex:1}
.tech-nom a.client{font-size:18px;font-weight:700;text-decoration:none;color:var(--texte)}
.tech-nom small{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:16px;color:var(--gris);margin-top:2px}
.tech-nom .rang{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--c,var(--primaire));color:#fff;font-size:13px;font-weight:700}
.tech-stats{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.tech-stat{display:block;text-decoration:none;color:var(--texte);background:var(--carte);border:1px solid var(--trait);border-radius:12px;padding:10px 12px;min-height:48px;transition:border-color .15s}
.tech-stat:hover{border-color:var(--c,var(--primaire))}
.tech-stat b{display:block;font:700 22px/1.1 var(--mono);font-variant-numeric:tabular-nums;color:var(--c,var(--primaire))}
.tech-stat.vendu-t{grid-column:1 / -1}
.tech-stat.vendu-t b{font-size:26px;color:var(--texte)}
.tech-stat span{display:block;font-size:16px;color:var(--gris);margin-top:2px;line-height:1.25}
.tech-stat.encours b{color:#B26A00}
.tech-stat.signes b{color:var(--cyan)}
.tech-stat.rdv.auj{border-color:var(--ok)}
.tech-stat.rdv.auj b{color:var(--ok)}
:root[data-theme="dark"] .tech-stat.encours b{color:#FFD68A}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .tech-stat.encours b{color:#FFD68A}}
.trouver-ligne{display:flex;gap:8px;align-items:stretch;margin-bottom:14px}
.trouver-ligne select{flex:1;min-width:0;margin:0}
.trouver-ligne .bouton{width:auto;flex:0 0 auto;padding:0 16px}
.trouver-client label{font-size:16px;color:var(--gris);font-weight:600;margin:0 0 6px;display:block}
.sous-titre{font-size:17px;margin:18px 0 6px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.sous-titre small{font-weight:400;font-size:16px}
.docs.derniers{margin-top:4px}
.rappel-action .bouton{width:auto;min-height:48px;padding:0 14px}
.rappel-action.inline{flex:0 1 auto;margin:0}
.docs.rappels li{align-items:center}
.docs.rappels li>a:first-child{flex:1 1 220px}
.docs.rappels li>span:not(.rappel-action){flex:1 1 220px;color:var(--gris)}

/* ---- voir un document dans l'application ---- */
.voir-tete h1{font-size:20px;margin:0 0 12px;overflow-wrap:anywhere}
.voir-actions{display:flex;gap:10px;flex-wrap:wrap}
.voir-actions .bouton{width:auto;flex:1 1 auto;padding:0 16px}
.voir-pdf{display:grid;gap:12px;justify-items:center;margin-bottom:24px}
.voir-page{max-width:100%;background:#fff;border:1px solid var(--trait);border-radius:6px;box-shadow:0 12px 30px -18px rgba(18,32,58,.6)}
.voir-image{text-align:center;margin-bottom:24px}
.voir-image img{max-width:100%;height:auto;border-radius:12px;border:1px solid var(--trait);background:#fff}
@media (max-width:480px){.trouver-ligne{flex-wrap:wrap} .trouver-ligne select{flex:1 1 100%} .trouver-ligne .bouton{flex:1 1 100%}}
.rdv-reporter input{display:block;width:100%;margin-top:4px}

/* ============================================================
   Planning v2 : calendrier, cartes dépliables, statuts en couleur (--sc)
   ============================================================ */
.rdv-legende{display:flex;flex-wrap:wrap;gap:6px 14px;margin:12px 0 0;font-size:16px;color:var(--gris)}
.rdv-legende span{display:inline-flex;align-items:center;gap:6px;min-height:28px}
.rdv-legende i{width:14px;height:14px;border-radius:50%;display:inline-block}
.etat.rdv-st{background:var(--sc);color:var(--sct,#fff);border-color:transparent;white-space:nowrap;font-weight:700;box-shadow:0 6px 14px -8px var(--sc)}
:root[data-theme="dark"] .etat.rdv-st{background:var(--sc);color:var(--sct,#fff)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .etat.rdv-st{background:var(--sc);color:var(--sct,#fff)}}
.bouton.st-btn{background:var(--sc);border-color:var(--sc);color:var(--sct,#fff)}
.bouton.st-btn:hover{filter:brightness(1.08)}
.calendrier{background:var(--carte);border:1px solid var(--trait);border-radius:var(--r);padding:12px 12px 10px;margin:0 0 16px;box-shadow:0 10px 30px -24px rgba(18,32,58,.45)}
.cal-tete{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}
.cal-nav{display:inline-grid;place-items:center;width:48px;height:48px;border-radius:12px;border:1px solid var(--trait);background:var(--champ);color:var(--primaire);text-decoration:none;font-size:24px;font-weight:700}
.cal-titre{text-align:center;flex:1}
.cal-titre b{display:block;font-size:18px}
.cal-titre a{font-size:16px;font-weight:600}
.cal-grille{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.cal-ent{text-align:center;font-size:14px;font-weight:600;color:var(--gris);text-transform:uppercase;letter-spacing:.5px;padding:2px 0 4px}
.cal-jour{position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;min-height:52px;padding:5px 6px 4px;border-radius:10px;border:1px solid var(--trait);background:var(--champ);color:var(--texte);text-decoration:none;font-size:16px;transition:border-color .15s,background .15s}
.cal-jour b{font-weight:600;line-height:1}
.cal-jour small{position:absolute;top:4px;right:5px;font:700 11px var(--mono);color:#fff;background:var(--gris);border-radius:999px;min-width:18px;height:18px;display:inline-grid;place-items:center;padding:0 4px}
.cal-jour .pts{display:flex;gap:3px;flex-wrap:wrap;min-height:8px}
.cal-jour .pt{width:8px;height:8px;border-radius:50%;display:inline-block}
.cal-jour.autre{opacity:.45}
.cal-jour.plein{border-color:color-mix(in srgb,var(--primaire) 40%,var(--trait))}
.cal-jour.plein small{background:var(--primaire)}
.cal-jour.auj{box-shadow:inset 0 0 0 2px var(--cyan)}
.cal-jour.sel{background:var(--primaire);border-color:var(--primaire);color:#fff}
.cal-jour.sel small{background:#fff;color:var(--primaire)}
.cal-jour:hover{border-color:var(--primaire)}
@media (min-width:700px){.cal-jour{min-height:64px;padding:7px 8px 6px} .cal-jour .pt{width:10px;height:10px} .calendrier{padding:16px}}
.rdv-jour .mini{margin-left:10px;font-size:16px;font-weight:600}
.rdv-jour.retard{color:var(--rouge)}
.rdv-sousjour{font-size:16px;color:var(--gris);margin:10px 0 2px;font-weight:600}
details.rdv{background:var(--carte);border:1px solid var(--trait);border-left:6px solid var(--sc,var(--gris));border-radius:var(--r);padding:0;box-shadow:0 10px 30px -24px rgba(18,32,58,.45)}
details.rdv.st-annule{opacity:.75}
details.rdv.st-termine{opacity:.85}
details.rdv.st-a_planifier{border-style:dashed}
details.rdv.rdv-neuf{box-shadow:0 0 0 2px color-mix(in srgb,var(--rouge) 40%,transparent)}
details.rdv>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;min-height:64px;padding:10px 12px}
details.rdv>summary::-webkit-details-marker{display:none}
details.rdv[open]>summary{border-bottom:1px solid var(--trait)}
details.rdv .rdv-heure{flex:0 0 58px;text-align:center;padding:6px 0;border-radius:10px;background:var(--champ);border:1px solid var(--trait)}
details.rdv .rdv-heure b{display:block;font:700 17px var(--mono);line-height:1.1}
details.rdv .rdv-heure small{display:block;font-size:13px;color:var(--gris);margin-top:1px}
details.rdv .rdv-resume{flex:1;min-width:0}
details.rdv .rdv-client{display:block;font-size:17px;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
details.rdv .rdv-type{display:block;font-size:16px;color:var(--gris);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
details.rdv .rdv-fleche{flex:0 0 auto;font-size:22px;color:var(--gris);transition:transform .15s;line-height:1}
details.rdv[open] .rdv-fleche{transform:rotate(90deg)}
details.rdv summary .avatar{width:30px;height:30px;font-size:12px}
@media (max-width:480px){details.rdv summary .etat.rdv-st{display:none} details.rdv summary .avatar{display:none}}
.rdv-corps{padding:12px 14px 14px}
.rdv-nom{margin:0 0 8px;font-size:18px}
.rdv-nom .client,.rdv-nom b{font-weight:700;font-size:18px}
.rdv-fiche{display:grid;grid-template-columns:1fr;gap:6px 16px;margin:0 0 12px}
.rdv-fiche div{display:grid;grid-template-columns:100px 1fr;gap:8px;align-items:start}
.rdv-fiche dt{font-size:16px;color:var(--gris)}
.rdv-fiche dd{margin:0;font-size:16px;overflow-wrap:anywhere}
.rdv-fiche dd a{text-decoration:none;font-weight:600}
@media (min-width:700px){.rdv-fiche{grid-template-columns:1fr 1fr}}
.rdv-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px;padding-top:12px;border-top:1px solid var(--trait)}
.rdv-plus.signer{flex:1 1 100%}
.rdv-plus.signer summary.bouton.signer{background:var(--ok);border-color:var(--ok);color:#fff;width:100%}
.menu-docs{display:grid;gap:8px;margin:10px 0 4px;padding:12px;border:1px solid var(--trait);border-radius:12px;background:var(--champ)}
.menu-docs .aide{margin:0 0 4px}
.menu-docs .bouton{width:100%;justify-content:flex-start;text-align:left}
.menu-docs .bouton small{margin-left:auto;font-weight:500;opacity:.85}
@media (min-width:700px){.menu-docs{grid-template-columns:1fr 1fr}.menu-docs .aide{grid-column:1 / -1}}
.rdv-mini{border-left-color:var(--sc,var(--gris))}
.rdv-mini .rm-nom{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.semaine.tdb{gap:8px;margin:8px 0 12px}
.semaine.tdb .jour{padding:10px 12px;min-height:56px}
.semaine.tdb .jour h3{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:16px;margin:0 0 6px;color:var(--gris)}
.semaine.tdb .jour h3 a{text-decoration:none;color:inherit;font-weight:700}
.semaine.tdb .jour h3 b{font:700 13px var(--mono);color:#fff;background:var(--primaire);border-radius:999px;min-width:22px;height:22px;display:inline-grid;place-items:center;padding:0 6px}
.semaine.tdb .jour.aujourdhui h3 a{color:var(--primaire)}
.semaine.tdb .jour.passe{opacity:.7}
.semaine.tdb .vide-jour{display:inline-flex;align-items:center;min-height:40px;font-size:16px;color:var(--gris);text-decoration:none}
.semaine.tdb .rdv-mini{margin-bottom:4px;min-height:44px;padding:6px 8px}
@media (min-width:900px){.semaine.tdb{grid-template-columns:repeat(7,1fr)} .semaine.tdb .jour h3{flex-direction:column;align-items:flex-start;font-size:15px} .semaine.tdb .rdv-mini{grid-template-columns:1fr auto} .semaine.tdb .rdv-mini b{grid-column:1} .semaine.tdb .rdv-mini .avatar{grid-column:2;grid-row:1} .semaine.tdb .rdv-mini small{grid-column:1 / span 2}}
@media (max-width:899px){.semaine.tdb .jour{display:grid;grid-template-columns:110px 1fr;gap:4px 10px;align-items:start} .semaine.tdb .jour h3{grid-column:1;flex-direction:column;align-items:flex-start;gap:4px;margin:0} .semaine.tdb .jour .rdv-mini,.semaine.tdb .jour .vide-jour{grid-column:2}}
.semaine-bloc h2 .badge{vertical-align:middle;text-decoration:none}
.vider-corbeille{margin-top:12px}
.vider-corbeille .bouton{width:auto;padding:0 18px}
.planning-nav select,.planning-nav input[type=date]{flex:1 1 200px}

.cal-jour small{top:auto;bottom:4px;right:4px}
.cal-jour .pts{max-width:calc(100% - 20px)}
@media (max-width:480px){.cal-jour{min-height:50px;padding:4px 4px 3px;font-size:15px} .cal-jour small{min-width:16px;height:16px;font-size:10px} .cal-jour .pt{width:7px;height:7px}}

/* ---- nouveau client / dossier créé par le bureau ---- */
.lot-tete{gap:10px;flex-wrap:wrap;align-items:center}
.lot-tete .nouveau-dossier-btn{margin-left:auto}
.nouveau-dossier h2{font-size:18px;margin:22px 0 8px;padding-top:14px;border-top:1px solid var(--trait)}
.nouveau-dossier h1+p+form h2:first-of-type{border-top:0;padding-top:0;margin-top:6px}
.nouveau-dossier .trio-champs{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}
@media (max-width:520px){.nouveau-dossier .trio-champs{grid-template-columns:1fr 1fr} .nouveau-dossier .trio-champs>div:first-child{grid-column:1 / -1}}
.nouveau-dossier .pj-choix{margin:8px 0 6px}
.nouveau-dossier #n-formule-bloc[hidden]{display:none}
.nouveau-dossier form > .duo:last-child{margin-top:18px}

/* ---- planning du tableau de bord : compteurs, calendrier du mois, jour choisi classé ---- */
.tdb-compteurs{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:0 0 12px}
@media (max-width:480px){.tdb-compteurs{grid-template-columns:1fr 1fr}}
.tdb-compteur{display:block;text-decoration:none;color:var(--texte);background:var(--champ);border:1px solid var(--trait);border-radius:12px;padding:10px 8px;text-align:center;min-height:48px}
.tdb-compteur b{display:block;font:700 26px/1 var(--mono);color:var(--gris)}
.tdb-compteur span{display:block;font-size:15px;color:var(--gris);margin-top:4px;line-height:1.2}
.tdb-compteur.plein b{color:var(--primaire)}
.tdb-compteur.auj.plein{border-color:var(--cyan);box-shadow:inset 0 0 0 1px var(--cyan)}
.tdb-compteur.alerte b{color:var(--rouge)}
:root[data-theme="dark"] .tdb-compteur.plein b{color:#8FD8FF}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .tdb-compteur.plein b{color:#8FD8FF}}
#tdb-planning .calendrier{margin-bottom:12px}
#tdb-planning.charge{opacity:.55;transition:opacity .15s}
.tdb-jour-tete{display:flex;justify-content:space-between;align-items:center;gap:8px 14px;flex-wrap:wrap;margin:0 0 8px}
.tdb-jour-tete .rdv-jour{margin:0}
.tdb-tri{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:16px;color:var(--gris)}
.tdb-tri span{margin-right:2px}
.tdb-tri .onglet{flex:0 0 auto;min-height:40px;padding:0 12px;font-size:15px}
.tdb-groupe{margin:8px 0 2px;font-size:16px;font-weight:700;color:var(--gris);display:flex;align-items:center;gap:8px}
.tdb-groupe b{font:700 13px var(--mono);color:#fff;background:var(--gris);border-radius:999px;min-width:20px;height:20px;display:inline-grid;place-items:center;padding:0 6px}
.tdb-lignes{margin-bottom:6px}
.tdb-vide{margin:4px 0 8px}
.rdv-ligne .etat.rdv-st{display:none}
@media (min-width:520px){.rdv-ligne .etat.rdv-st{display:inline-block}}

/* ---- derniers dossiers reçus : une carte par dossier ---- */
.sous-titre small{margin-left:4px}
.derniers.dossiers-lignes{display:grid;gap:8px;margin:6px 0 4px}
.dossier-ligne{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"ic nom droite" "ic det droite" "ic qui droite";gap:2px 12px;align-items:center;min-height:64px;padding:10px 12px;border:1px solid var(--trait);border-left:5px solid var(--dc,var(--gris));border-radius:14px;background:var(--champ);color:var(--texte);text-decoration:none;overflow:hidden;isolation:isolate;transition:transform .12s,box-shadow .15s,border-color .15s}
.dossier-ligne::after{content:"";position:absolute;z-index:-1;width:120px;height:120px;right:-60px;top:-60px;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--dc) 18%,transparent),transparent)}
.dossier-ligne:hover{transform:translateY(-1px);box-shadow:0 12px 26px -18px rgba(18,32,58,.6);border-color:color-mix(in srgb,var(--dc) 55%,var(--trait))}
.dossier-ligne .ic{grid-area:ic;width:46px;height:46px;border-radius:13px;display:grid;place-items:center;font-size:23px;background:color-mix(in srgb,var(--dc) 16%,var(--carte));border:1px solid color-mix(in srgb,var(--dc) 40%,transparent)}
.dossier-ligne .nom{grid-area:nom;font-size:17px;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.2}
.dossier-ligne .nom.vide{color:var(--gris);font-style:italic;font-weight:600}
.dossier-ligne .det{grid-area:det;font-size:15px;color:var(--gris);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dossier-ligne .qui{grid-area:qui;display:flex;align-items:center;gap:6px;font-size:15px;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dossier-ligne .qui .avatar{width:22px;height:22px;font-size:10px}
.dossier-ligne .qui small{color:var(--gris);font-size:14px}
.dossier-ligne .droite{grid-area:droite;display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.dossier-ligne .montant{font:700 16px var(--mono);font-variant-numeric:tabular-nums;white-space:nowrap}
.dossier-ligne .droite .etat{font-size:14px;padding:3px 10px}
@media (max-width:420px){.dossier-ligne{grid-template-columns:auto minmax(0,1fr);grid-template-areas:"ic nom" "ic det" "ic qui" "droite droite"} .dossier-ligne .droite{flex-direction:row;justify-content:flex-end;margin-top:4px}}

/* ============================================================
   Planning : habillage (compteurs colorés, liseré et calendrier soignés)
   ============================================================ */
.tdb-compteurs{gap:10px;margin:0 0 14px}
.tdb-compteur{position:relative;isolation:isolate;overflow:hidden;border:0;border-radius:16px;padding:14px 12px 12px;text-align:left;color:#fff;background:var(--g1,#2E3193);background-image:linear-gradient(135deg,var(--g1,#2E3193) 0%,var(--g2,#00ADEF) 100%);box-shadow:0 14px 28px -20px color-mix(in srgb,var(--g1,#2E3193) 85%,#000);transition:transform .15s,box-shadow .15s}
.tdb-compteur::before{content:"";position:absolute;z-index:-1;width:120px;height:120px;right:-40px;top:-50px;border-radius:50%;background:rgba(255,255,255,.14)}
.tdb-compteur::after{content:"";position:absolute;z-index:-1;width:70px;height:70px;right:20px;bottom:-35px;border-radius:50%;background:rgba(255,255,255,.10)}
.tdb-compteur i{display:block;font-style:normal;font-size:20px;line-height:1;margin-bottom:8px;opacity:.95}
.tdb-compteur b{display:block;font:700 30px/1 var(--mono);color:#fff;font-variant-numeric:tabular-nums}
.tdb-compteur span{display:block;font-size:15px;color:rgba(255,255,255,.88);margin-top:5px;line-height:1.2}
.tdb-compteur.plein b,.tdb-compteur.alerte b{color:#fff}
.tdb-compteur:hover{transform:translateY(-3px);box-shadow:0 18px 32px -18px color-mix(in srgb,var(--g1,#2E3193) 90%,#000)}
.tdb-compteur.c-auj{--g1:#2E63D6;--g2:#00ADEF}
.tdb-compteur.c-auj.plein{box-shadow:0 14px 28px -20px #2E63D6,inset 0 0 0 2px rgba(255,255,255,.35)}
.tdb-compteur.c-demain{--g1:#6C3FC5;--g2:#9B59D0}
.tdb-compteur.c-semaine{--g1:#146B3A;--g2:#1D9A6C}
.tdb-compteur.c-aplan{--g1:#D68910;--g2:#F2A33A}
.tdb-compteur.c-aplan.alerte{--g1:#C0392B;--g2:#F26B1D}
.tdb-compteur.c-aplan:not(.alerte) b{opacity:.85}
.cal-cadre{position:relative;padding:3px;border-radius:21px;background:linear-gradient(135deg,#2E3193 0%,#00ADEF 55%,#E4442A 100%);box-shadow:0 18px 40px -26px rgba(18,32,58,.7);margin:0 0 14px}
.cal-cadre .calendrier{margin:0;border:0;border-radius:18px;box-shadow:none}
.calendrier{background:linear-gradient(180deg,color-mix(in srgb,var(--primaire) 6%,var(--carte)) 0%,var(--carte) 120px)}
.cal-tete{padding:2px 2px 10px;border-bottom:1px solid var(--trait);margin-bottom:10px}
.cal-titre b{font-size:19px;letter-spacing:-.2px}
.cal-titre a{display:inline-flex;align-items:center;min-height:28px;padding:0 10px;border-radius:999px;background:color-mix(in srgb,var(--cyan) 14%,transparent);color:var(--primaire);text-decoration:none;font-size:14px}
:root[data-theme="dark"] .cal-titre a{color:#8FD8FF}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .cal-titre a{color:#8FD8FF}}
.cal-nav{border-radius:50%;box-shadow:0 6px 14px -10px rgba(18,32,58,.6)}
.cal-nav:hover{background:var(--primaire);color:#fff;border-color:var(--primaire)}
.cal-ent{font-size:12px;letter-spacing:1px;color:color-mix(in srgb,var(--gris) 80%,var(--primaire))}
.cal-ent:nth-child(6),.cal-ent:nth-child(7){color:var(--rouge)}
.cal-jour{border-radius:12px;background:var(--carte);border-color:color-mix(in srgb,var(--trait) 70%,transparent);box-shadow:inset 0 0 0 1px transparent;transition:transform .12s,border-color .15s,background .15s,box-shadow .15s}
.cal-grille .cal-jour:nth-child(7n+6),.cal-grille .cal-jour:nth-child(7n){background:color-mix(in srgb,var(--primaire) 4%,var(--carte))}
.cal-jour.plein{border-color:color-mix(in srgb,var(--primaire) 45%,var(--trait));background:color-mix(in srgb,var(--cyan) 7%,var(--carte))}
.cal-jour.plein:hover{transform:translateY(-2px);box-shadow:0 10px 20px -14px rgba(18,32,58,.6)}
.cal-jour.auj{box-shadow:inset 0 0 0 2px var(--cyan),0 0 0 3px color-mix(in srgb,var(--cyan) 20%,transparent)}
.cal-jour.sel{background:linear-gradient(160deg,#2E3193,#4B50D6);border-color:#2E3193;color:#fff;box-shadow:0 10px 20px -12px #2E3193}
.cal-jour.sel.auj{box-shadow:inset 0 0 0 2px var(--cyan),0 10px 20px -12px #2E3193}
.cal-jour .pt{box-shadow:0 0 0 1.5px var(--carte)}
.cal-jour.sel .pt{box-shadow:0 0 0 1.5px #2E3193}
.cal-jour small{background:var(--primaire);box-shadow:0 2px 6px -2px rgba(0,0,0,.4)}
.cal-jour.sel small{background:#fff;color:#2E3193}
.tdb-jour-tete{padding-top:4px}
.tdb-tri{background:var(--champ);border:1px solid var(--trait);border-radius:999px;padding:3px}
.tdb-tri span{padding-left:8px;font-size:14px}
.tdb-tri .onglet{min-height:36px;border:0;background:transparent}
.tdb-tri .onglet.actif{background:var(--primaire);color:#fff}
.planning-tete{position:relative;isolation:isolate;overflow:hidden}
.planning-tete::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:linear-gradient(90deg,#2E3193 0%,#00ADEF 55%,#E4442A 100%)}
#planning-contenu>.calendrier{padding:3px;border-radius:21px;background:linear-gradient(135deg,#2E3193 0%,#00ADEF 55%,#E4442A 100%);box-shadow:0 18px 40px -26px rgba(18,32,58,.7)}
#planning-contenu>.calendrier>.cal-tete,#planning-contenu>.calendrier>.cal-grille{background:var(--carte)}
#planning-contenu>.calendrier>.cal-tete{border-radius:18px 18px 0 0;padding:12px 14px 10px;margin:0}
#planning-contenu>.calendrier>.cal-grille{border-radius:0 0 18px 18px;padding:10px 12px 12px}
.semaine-bloc h2{display:flex;align-items:center;gap:10px}
.semaine-bloc h2::before{content:"📆";font-size:20px}

/* ---- téléphones et tablettes : rien ne dépasse de l'écran (grilles et textes contraints) ---- */
.rdv-liste,.rdv-lignes,.tdb-lignes,.derniers.dossiers-lignes,.semaine{grid-template-columns:minmax(0,1fr)}
@media (min-width:900px){.semaine{grid-template-columns:repeat(7,minmax(0,1fr))}}
@media (min-width:900px){.semaine.tdb{grid-template-columns:repeat(7,minmax(0,1fr))}}
details.rdv,.rdv-ligne,.rdv-mini,.dossier-ligne{min-width:0;max-width:100%;box-sizing:border-box}
details.rdv>summary{min-width:0;box-sizing:border-box}
details.rdv .rdv-resume{flex:1 1 0;min-width:0}
details.rdv .rdv-heure{flex:0 0 58px}
.rdv-corps{min-width:0;overflow-wrap:anywhere}
.rdv-fiche{min-width:0}
.rdv-fiche div{grid-template-columns:96px minmax(0,1fr)}
.rdv-actions{min-width:0}
.rdv-actions .bouton,.rdv-actions form.rdv-act{min-width:0;max-width:100%}
.rdv-actions .bouton{white-space:normal;line-height:1.2}
.tdb-jour-tete{min-width:0}
.tdb-jour-tete .rdv-jour{min-width:0;overflow-wrap:anywhere}
.tdb-tri{max-width:100%;overflow-x:auto;scrollbar-width:none}
.tdb-tri::-webkit-scrollbar{display:none}
.calendrier,.cal-cadre{min-width:0;max-width:100%;box-sizing:border-box}
.cal-grille{min-width:0}
.cal-jour{min-width:0}
.planning-tete,.planning-nav,.onglets{max-width:100%;box-sizing:border-box}
main.enveloppe{overflow-x:hidden}
.tdb-tri{flex-wrap:nowrap}
.tdb-tri span,.tdb-tri .onglet{white-space:nowrap}

/* ============================================================
   Marque AK sur le tableau de bord : titre aux couleurs du logo, liserés tricolores, cartes techniciens, raccourcis, compte
   ============================================================ */
.titre-crm{background:linear-gradient(90deg,#7C86FF 0%,#00ADEF 48%,#FF8A5B 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;text-shadow:none;filter:drop-shadow(0 4px 18px rgba(0,173,239,.28))}
.carte.liser{border:2px solid transparent;background:linear-gradient(var(--carte),var(--carte)) padding-box,linear-gradient(135deg,#2E3193 0%,#00ADEF 55%,#E4442A 100%) border-box}
.activite-tete{display:flex;justify-content:space-between;align-items:flex-start;gap:8px 16px;flex-wrap:wrap;margin-bottom:12px}
.activite-tete h2{margin:0}
.activite-tete h2 small{display:block;font:600 16px var(--mono);letter-spacing:1.5px;text-transform:uppercase;color:var(--cyan);margin-top:2px}
.date-jour{margin:0;display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 14px;border-radius:999px;background:linear-gradient(135deg,color-mix(in srgb,var(--primaire) 12%,var(--carte)),color-mix(in srgb,var(--cyan) 12%,var(--carte)));border:1px solid color-mix(in srgb,var(--cyan) 35%,var(--trait));font-size:16px;font-weight:600}
.date-jour i{font-style:normal}
.tech-carte{padding:0;border:1px solid color-mix(in srgb,var(--c,var(--primaire)) 35%,var(--trait));border-top:0;background:var(--carte)}
.tech-carte::after{display:none}
.tech-tete{margin:0;padding:14px 16px;color:#fff;background:linear-gradient(135deg,var(--c,#2E3193) 0%,color-mix(in srgb,var(--c,#2E3193) 55%,#12203A) 100%);position:relative;isolation:isolate;overflow:hidden}
.tech-tete::after{content:"";position:absolute;z-index:-1;width:140px;height:140px;right:-50px;top:-70px;border-radius:50%;background:rgba(255,255,255,.14)}
.tech-tete::before{content:"";position:absolute;z-index:-1;width:80px;height:80px;right:40px;bottom:-50px;border-radius:50%;background:rgba(255,255,255,.10)}
.tech-tete .avatar{width:48px;height:48px;font-size:17px;background:rgba(255,255,255,.2);border:2px solid rgba(255,255,255,.75);box-shadow:0 6px 14px -8px rgba(0,0,0,.6)}
.tech-nom a.client{color:#fff}
.tech-nom small{color:rgba(255,255,255,.88)}
.tech-nom .rang{background:#fff;color:var(--c,#2E3193)}
.tech-tete .badge{color:#fff;border-color:rgba(255,255,255,.55);background:rgba(255,255,255,.14)}
.tech-tete .badge.gris{color:#fff}
.tech-stats{padding:12px 14px 14px;gap:8px}
.tech-stat{--sc:var(--c,var(--primaire));border-left:4px solid var(--sc);background:linear-gradient(135deg,color-mix(in srgb,var(--sc) 10%,var(--carte)),var(--carte) 70%)}
.tech-stat b{color:var(--sc)}
.tech-stat:hover{border-color:var(--sc);box-shadow:0 10px 20px -16px var(--sc)}
.tech-stat.vendu-t{--sc:#D68910}
.tech-stat.vendu-t b{color:var(--texte);font-size:26px}
.tech-stat.encours{--sc:#E0A800}
.tech-stat.signes{--sc:#00ADEF}
.tech-stat.rdv{--sc:#1D9A6C}
:root[data-theme="dark"] .tech-stat.encours b{color:#FFD68A}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .tech-stat.encours b{color:#FFD68A}}
.aller-a .raccourcis{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media (min-width:700px){.aller-a .raccourcis{grid-template-columns:repeat(3,1fr)}}
.aller-a .raccourcis .racc:first-child{grid-column:auto}
.racc{position:relative;isolation:isolate;overflow:hidden;display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-areas:"ic txt" "ic badge";gap:2px 12px;align-items:center;min-height:76px;padding:12px;border-radius:16px;text-decoration:none;color:var(--texte);background:linear-gradient(160deg,color-mix(in srgb,var(--rc,#2E3193) 16%,var(--carte)) 0%,var(--carte) 70%);border:1px solid color-mix(in srgb,var(--rc,#2E3193) 40%,var(--trait));border-top:4px solid var(--rc,#2E3193);box-shadow:0 12px 26px -22px color-mix(in srgb,var(--rc,#2E3193) 80%,#000);transition:transform .12s,box-shadow .15s}
.racc::after{content:"";position:absolute;z-index:-1;width:110px;height:110px;right:-50px;bottom:-60px;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--rc,#2E3193) 28%,transparent),transparent)}
.racc:hover{transform:translateY(-3px);box-shadow:0 16px 30px -18px color-mix(in srgb,var(--rc,#2E3193) 85%,#000)}
.racc i{grid-area:ic;display:grid;place-items:center;width:46px;height:46px;border-radius:50%;font-style:normal;font-size:22px;background:color-mix(in srgb,var(--rc,#2E3193) 20%,var(--carte));border:2px solid color-mix(in srgb,var(--rc,#2E3193) 50%,transparent)}
.racc .racc-txt{grid-area:txt;font-size:16px;font-weight:700;line-height:1.15;min-width:0;overflow-wrap:anywhere}
.racc .racc-txt small{display:block;font-size:15px;font-weight:500;color:var(--gris);margin-top:2px;line-height:1.25}
.racc b{grid-area:badge;justify-self:start;font:700 13px var(--mono);color:#fff;background:var(--rc,#2E3193);border-radius:999px;min-width:22px;height:22px;display:inline-grid;place-items:center;padding:0 8px;margin-top:2px}
.mon-compte .compte-carte{display:flex;align-items:center;gap:14px;padding:14px;border-radius:16px;background:linear-gradient(135deg,color-mix(in srgb,var(--primaire) 10%,var(--carte)),color-mix(in srgb,var(--cyan) 8%,var(--carte)));border:1px solid color-mix(in srgb,var(--cyan) 30%,var(--trait));margin-bottom:12px}
.mon-compte .avatar.grand{width:56px;height:56px;font-size:20px;box-shadow:0 8px 18px -10px var(--c,#2E3193)}
.mon-compte .compte-id{display:flex;flex-direction:column;gap:3px;min-width:0}
.mon-compte .compte-id b{font-size:18px}
.mon-compte .compte-id span{font-size:16px;color:var(--gris);overflow-wrap:anywhere}
.mon-compte .compte-id .badge{align-self:flex-start;margin-top:2px}
.compte-actions-ligne{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.compte-actions-ligne form{margin:0}
@media (max-width:480px){.compte-actions-ligne{grid-template-columns:1fr}}
.hero-marque{display:flex;align-items:center;gap:14px;text-align:left}
.hero-logo{width:60px;height:60px;border-radius:16px;border:2px solid rgba(255,255,255,.45);box-shadow:0 12px 26px -10px rgba(0,173,239,.75),0 0 0 4px rgba(0,173,239,.12);background:#fff;flex:0 0 auto}
.hero-haut::before{content:"";position:absolute;z-index:-1;left:-140px;bottom:-190px;width:360px;height:360px;border-radius:50%;background:radial-gradient(closest-side,rgba(228,68,42,.20),rgba(228,68,42,0))}
.hero-haut::after{content:"";position:absolute;z-index:-1;left:35%;top:-120px;width:260px;height:260px;border-radius:50%;background:radial-gradient(closest-side,rgba(46,49,147,.55),rgba(46,49,147,0))}
.hero-date{color:#7FD6FF}
.tech-carte.sans-activite{opacity:1}
.carte.liser>h2:first-child{margin-top:0}
/* téléphone : les tuiles « Aller à » passent en colonne (icône, titre, sous-titre), le compteur dans le coin */
@media (max-width:699px){
  .racc{grid-template-columns:minmax(0,1fr);grid-template-areas:"ic" "txt";justify-items:center;text-align:center;padding:16px 10px 14px;gap:8px;min-height:112px}
  .racc i{width:44px;height:44px;font-size:21px}
  .racc .racc-txt small{font-size:14.5px}
  .racc b{grid-area:auto;position:absolute;top:10px;right:10px;margin:0}
}

/* ============================================================
   Écran d'entrée : la marque en couleurs, tout centré, liserés tricolores
   ============================================================ */
.page-entree{background:radial-gradient(900px 600px at 12% -10%,rgba(0,173,239,.38),transparent 62%),radial-gradient(700px 520px at 108% 18%,rgba(228,68,42,.30),transparent 62%),radial-gradient(900px 600px at 50% 118%,rgba(46,49,147,.60),transparent 62%),linear-gradient(170deg,#16294A 0%,#12203A 60%,#0B1424 100%);background-attachment:fixed}
.page-entree .enveloppe{padding-top:28px}
.entree-logo{position:relative;display:inline-block;background:#fff;border-radius:22px;padding:16px 24px;margin:0 auto 22px;border:3px solid transparent;
  background:linear-gradient(#fff,#fff) padding-box,linear-gradient(135deg,#2E3193 0%,#00ADEF 55%,#E4442A 100%) border-box;box-shadow:0 26px 54px -22px rgba(0,0,0,.8),0 0 0 8px rgba(0,173,239,.10)}
.entree-logo img{display:block;width:220px;max-width:70vw;height:auto}
.entree-logo.petit{padding:10px 18px;margin-bottom:18px;border-radius:18px}
.entree-logo.petit img{width:180px}
.entree-chips{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin:0 0 16px}
.entree-chips .chip{display:inline-flex;align-items:center;min-height:36px;padding:0 14px;border-radius:999px;font:600 16px var(--mono);letter-spacing:.8px;text-transform:uppercase;border:1px solid;white-space:nowrap}
.entree-chips .c1{color:#7FD6FF;border-color:rgba(0,173,239,.6);background:rgba(0,173,239,.12)}
.entree-chips .c2{color:#FFB39F;border-color:rgba(228,68,42,.6);background:rgba(228,68,42,.12)}
.titre-entree{font-size:34px;line-height:1.1;letter-spacing:-.5px;color:#fff;margin:0 0 12px}
.titre-entree .grad{display:block;background:linear-gradient(90deg,#7C86FF 0%,#00ADEF 50%,#FF8A5B 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.entree .gris{margin-bottom:18px}
.entree-points{list-style:none;display:flex;justify-content:center;flex-wrap:wrap;gap:8px;padding:0;margin:0 0 24px}
.entree-points li{display:inline-flex;align-items:center;gap:7px;min-height:44px;padding:0 14px;border-radius:12px;background:color-mix(in srgb,var(--pc,#2E3193) 22%,rgba(255,255,255,.06));border:1px solid color-mix(in srgb,var(--pc,#2E3193) 65%,transparent);border-bottom:3px solid var(--pc,#2E3193);font-size:16px;font-weight:600;color:#EAF0FA}
.entree-points li i{font-style:normal;font-size:18px}
.page-entree .bouton.entree-principal{background:linear-gradient(135deg,#2E3193 0%,#00ADEF 100%);border-color:transparent;min-height:60px;font-size:18px;box-shadow:0 16px 32px -12px rgba(0,173,239,.75)}
.page-entree .bouton.entree-second{border:2px solid transparent;background:linear-gradient(#152743,#152743) padding-box,linear-gradient(135deg,#2E3193 0%,#00ADEF 55%,#E4442A 100%) border-box;color:#fff;min-height:60px;font-size:17px}
.page-entree .bouton.entree-second:hover{background:linear-gradient(#1C3358,#1C3358) padding-box,linear-gradient(135deg,#2E3193 0%,#00ADEF 55%,#E4442A 100%) border-box}
.entree-pied{margin:24px 0 0;font-size:16px;color:#8E9DB5}
.entree-pied a{color:#7FD6FF;font-weight:600;text-decoration:none}
/* les écrans de connexion et de création de compte : le logo, puis une carte à liseré sur le fond de marque */
.entree.entree-form{text-align:center}
.entree .carte-entree{text-align:left;max-width:520px;margin:0 auto;padding:22px 18px 18px;color:var(--texte)}
.entree .carte-entree h1{color:var(--texte);font-size:28px;margin:0 0 12px}
.entree .carte-entree .eyebrow{margin:0 0 6px}
.entree .carte-entree .gris{color:var(--gris);max-width:none;margin:0 0 14px}
.entree .carte-entree .centre.gris{margin:16px 0 0;text-align:center}
.entree .carte-entree .bandeau{text-align:left}
.page-entree .pied-action{background:rgba(11,20,36,.86);border-top:1px solid rgba(255,255,255,.14);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.page-entree .pied-action .bouton{background:linear-gradient(135deg,#2E3193 0%,#00ADEF 100%);border-color:transparent;min-height:60px;font-size:18px;box-shadow:0 16px 32px -12px rgba(0,173,239,.75)}
.page-entree.avec-bouton .enveloppe{justify-content:flex-start;padding-bottom:120px}

/* ============================================================
   Espace technicien : Mes dossiers et Mon planning, aux couleurs de la marque
   ============================================================ */
.filtres.liser{border:2px solid transparent;background:linear-gradient(var(--carte),var(--carte)) padding-box,linear-gradient(135deg,#2E3193 0%,#00ADEF 55%,#E4442A 100%) border-box}
.compteurs.etats .compteur{--c1:#2E3193;--c2:#12203A;--ct:#fff;position:relative;isolation:isolate;overflow:hidden;border:0;color:var(--ct);background:linear-gradient(150deg,var(--c1) 0%,var(--c2) 100%);box-shadow:0 14px 28px -18px var(--c1);padding:14px 8px 12px;transition:transform .15s,box-shadow .15s}
.compteurs.etats .compteur::after{content:"";position:absolute;z-index:-1;width:120px;height:120px;right:-50px;top:-60px;border-radius:50%;background:rgba(255,255,255,.16)}
.compteurs.etats .compteur::before{content:"";position:absolute;z-index:-1;width:70px;height:70px;left:-30px;bottom:-40px;border-radius:50%;background:rgba(255,255,255,.10)}
.compteurs.etats .compteur i{display:block;font-style:normal;font-size:22px;line-height:1;margin-bottom:8px}
.compteurs.etats .compteur b,:root[data-theme="dark"] .compteurs.etats .compteur b{color:var(--ct);font:700 34px/1 var(--mono);font-variant-numeric:tabular-nums}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .compteurs.etats .compteur b{color:var(--ct)}}
.compteurs.etats .compteur span{color:var(--ct);opacity:.92;font-weight:600}
.compteurs.etats a.compteur:hover{transform:translateY(-2px);box-shadow:0 18px 30px -16px var(--c1)}
.compteurs.etats .compteur.alerte{box-shadow:0 0 0 3px color-mix(in srgb,var(--c1) 35%,transparent),0 14px 28px -18px var(--c1)}
.compteurs.etats .compteur.encours{--c1:#FF7A1A;--c2:#D9480F}
.compteurs.etats .compteur.signe{--c1:#00ADEF;--c2:#1E5BD6}
.compteurs.etats .compteur.envoye{--c1:#1FB57C;--c2:#0E7C86}
.compteurs.etats .compteur.auj{--c1:#2F55FF;--c2:#2E3193}
.compteurs.etats .compteur.avenir{--c1:#00ADEF;--c2:#0E7C86}
.compteurs.etats .compteur.aconf{--c1:#FFC400;--c2:#E08A00;--ct:#12203A}
.bouton.outil-btn{background:linear-gradient(135deg,#2E3193 0%,#00ADEF 100%);border-color:transparent;box-shadow:0 14px 28px -14px rgba(0,173,239,.75)}
.quota{display:flex;align-items:center;gap:10px}
.quota-barre{flex:1 1 auto;height:8px;border-radius:999px;background:var(--trait);overflow:hidden}
.quota-barre i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#2E3193,#00ADEF 60%,#E4442A)}
.onglets.etats .onglet{border-color:color-mix(in srgb,var(--oc,var(--primaire)) 55%,var(--trait));background:color-mix(in srgb,var(--oc,var(--primaire)) 8%,var(--carte))}
.onglets.etats .onglet b{background:var(--oc,var(--primaire));color:#fff;border-color:transparent;font-family:var(--mono)}
.onglets.etats .onglet.actif{background:var(--oc,var(--primaire));border-color:var(--oc,var(--primaire));color:#fff;box-shadow:0 10px 20px -12px var(--oc,var(--primaire))}
.onglets.etats .onglet.actif b{background:rgba(255,255,255,.24);color:#fff}
.onglet.onglet-rappeler{border-color:color-mix(in srgb,var(--oc) 55%,var(--trait))}
.onglet.onglet-rappeler b{background:var(--oc);color:#fff;border-color:transparent}
.onglet.onglet-rappeler.actif{background:var(--oc);border-color:var(--oc)}
/* les cartes de dossiers : liseré tricolore, bord haut à la couleur de l'état, icône du document */
.dossier-tech{position:relative;isolation:isolate;overflow:hidden;border:2px solid transparent;border-top:6px solid var(--dc,var(--primaire));background:linear-gradient(var(--carte),var(--carte)) padding-box,linear-gradient(135deg,#2E3193 0%,#00ADEF 55%,#E4442A 100%) border-box;padding:14px 16px 16px}
.dossier-tech::after{content:"";position:absolute;z-index:-1;width:170px;height:170px;right:-70px;top:-80px;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--dc,var(--primaire)) 18%,transparent),transparent)}
.dossier-tech .dossier-haut{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 6px}
.dossier-tech .coche-fiche{margin:0}
.dossier-tech .dossier-tete{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;margin-bottom:12px;padding-bottom:12px;border-bottom:1px dashed color-mix(in srgb,var(--dc,var(--primaire)) 40%,var(--trait))}
.dossier-tech .dossier-tete .ic{width:54px;height:54px;border-radius:14px;display:grid;place-items:center;font-size:25px;background:color-mix(in srgb,var(--dc,var(--primaire)) 16%,var(--carte));border:1.5px solid color-mix(in srgb,var(--dc,var(--primaire)) 45%,transparent)}
.dossier-tech .dossier-tete h3{font-size:20px;line-height:1.2;overflow-wrap:anywhere;margin-top:4px}
.dossier-tech .dossier-sous{margin:0;font-size:16px;color:var(--gris)}
.dossier-tech .dossier-infos{gap:8px}
.dossier-tech .dossier-infos div{background:var(--champ);border:1px solid var(--trait);border-radius:12px;padding:8px 10px}
.dossier-tech .dossier-infos dd.montant{color:var(--dc,var(--primaire));font-size:18px}
.dossier-tech .dossier-actions .bouton:not(.creux){background:var(--dc,var(--primaire));border-color:var(--dc,var(--primaire));color:#fff}
.dossier-tech.st-en_cours .dossier-actions .bouton:not(.creux){color:#fff}
/* les étiquettes d'état des dossiers : la même couleur que la case, partout (technicien et bureau) */
.etat.en_cours{background:color-mix(in srgb,#F26B1D 16%,var(--carte));color:#B84A00;border-color:color-mix(in srgb,#F26B1D 55%,transparent);font-weight:700}
.etat.signe{background:color-mix(in srgb,#00ADEF 16%,var(--carte));color:#0077A8;border-color:color-mix(in srgb,#00ADEF 60%,transparent);font-weight:700}
.etat.envoye{background:color-mix(in srgb,#1D9A6C 16%,var(--carte));color:#146B3A;border-color:color-mix(in srgb,#1D9A6C 60%,transparent);font-weight:700}
:root[data-theme="dark"] .etat.en_cours{background:color-mix(in srgb,#F26B1D 26%,var(--carte));color:#FFB27A;border-color:color-mix(in srgb,#F26B1D 60%,transparent)}
:root[data-theme="dark"] .etat.signe{background:color-mix(in srgb,#00ADEF 26%,var(--carte));color:#8FD8FF}
:root[data-theme="dark"] .etat.envoye{background:color-mix(in srgb,#1D9A6C 26%,var(--carte));color:#7FE3B4}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .etat.en_cours{background:color-mix(in srgb,#F26B1D 26%,var(--carte));color:#FFB27A;border-color:color-mix(in srgb,#F26B1D 60%,transparent)}
  :root:not([data-theme="light"]) .etat.signe{background:color-mix(in srgb,#00ADEF 26%,var(--carte));color:#8FD8FF}
  :root:not([data-theme="light"]) .etat.envoye{background:color-mix(in srgb,#1D9A6C 26%,var(--carte));color:#7FE3B4}}
/* les onglets de l'espace technicien (Tableau de bord · Mes dossiers · Mon planning) et le bouton Accueil */
.nav-app a{--nc:#2E3193;border:2px solid transparent;background:linear-gradient(var(--carte),var(--carte)) padding-box,linear-gradient(135deg,#2E3193 0%,#00ADEF 55%,#E4442A 100%) border-box;font-weight:700;gap:8px;transition:transform .12s,box-shadow .15s}
.nav-app a:nth-child(1){--nc:#2E3193}.nav-app a:nth-child(2){--nc:#00ADEF}.nav-app a:nth-child(3){--nc:#1D9A6C}.nav-app a:nth-child(4){--nc:#8E44AD}.nav-app a:nth-child(5){--nc:#0E7C86}.nav-app a:nth-child(6){--nc:#D68910}.nav-app a:nth-child(7){--nc:#E4442A}.nav-app a:nth-child(8){--nc:#5B7A6E}
.nav-app a::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--nc);box-shadow:0 0 0 3px color-mix(in srgb,var(--nc) 25%,transparent);flex:0 0 auto}
.nav-app a.actif{background:linear-gradient(135deg,var(--nc) 0%,color-mix(in srgb,var(--nc) 60%,#12203A) 100%);border-color:transparent;color:#fff;box-shadow:0 12px 24px -14px var(--nc)}
.nav-app a.actif::before{background:#fff;box-shadow:0 0 0 3px rgba(255,255,255,.3)}
.nav-app a:hover{transform:translateY(-1px)}
.accueil-haut{border:2px solid transparent;background:linear-gradient(var(--champ),var(--champ)) padding-box,linear-gradient(135deg,#2E3193 0%,#00ADEF 55%,#E4442A 100%) border-box;border-radius:999px;font-weight:700;gap:6px}
.accueil-haut::before{content:"⌂";font-size:19px;line-height:1;color:var(--cyan)}
.accueil-haut:hover{border-color:transparent;background:linear-gradient(color-mix(in srgb,var(--cyan) 10%,var(--champ)),color-mix(in srgb,var(--cyan) 10%,var(--champ))) padding-box,linear-gradient(135deg,#2E3193 0%,#00ADEF 55%,#E4442A 100%) border-box}
/* clients à rappeler : la liste des rendez-vous signalés depuis le planning */
.docs.rappels.rdv-rappeler li{border-left:4px solid var(--sc);padding-left:12px;border-radius:0 12px 12px 0}
.sous-titre .etat.rdv-st{padding:3px 10px;vertical-align:middle}
/* le bouton clair / sombre sur les écrans sans barre (entrée, connexion, création de compte) */
.theme-flottant{position:fixed;top:calc(12px + env(safe-area-inset-top,0px));right:14px;z-index:50;box-shadow:0 10px 24px -12px rgba(0,0,0,.8)}
/* ---- liaison Google Sheets ---- */
.gs-etapes{margin:0 0 16px;padding:0 0 0 0;list-style:none;counter-reset:gs}
.gs-etapes li{position:relative;padding:10px 0 10px 52px;font-size:16px;line-height:1.5;border-top:1px dashed var(--trait);counter-increment:gs}
.gs-etapes li:first-child{border-top:0}
.gs-etapes li::before{content:counter(gs);position:absolute;left:0;top:10px;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;font:700 17px var(--mono);color:#fff;background:linear-gradient(135deg,#2E3193,#00ADEF)}
.gs-codebloc{margin-top:8px}
.gs-codebloc textarea{width:100%;font:16px/1.4 var(--mono);color:var(--texte);background:var(--champ);border:1.5px solid var(--trait);border-radius:12px;padding:12px;resize:vertical;white-space:pre;overflow:auto}
.gs-codebloc .bouton{margin-top:10px;width:auto;padding:0 18px}
.gs-lien-tableau{margin:12px 0 0}
.gs-lien-tableau .bouton{width:auto;padding:0 18px}
.gs-ok{font-size:16px;vertical-align:middle;margin-left:4px}
.carte.gs form .duo{margin-top:14px}
/* ============================================================
   La marque partout : chaque carte du bureau et du technicien porte le liseré tricolore
   ============================================================ */
.carte,.compte,.filtres,.acc-rdv{border:2px solid transparent;background:linear-gradient(var(--carte),var(--carte)) padding-box,linear-gradient(135deg,#2E3193 0%,#00ADEF 55%,#E4442A 100%) border-box}
.carte.a-rappeler,.carte.mdp-provisoire{border-color:transparent}
.carte.mdp-provisoire{background:linear-gradient(var(--info-fond),var(--info-fond)) padding-box,linear-gradient(135deg,#2E3193 0%,#00ADEF 55%,#E4442A 100%) border-box}
.popup-alerte{border:2px solid transparent;background:linear-gradient(var(--carte),var(--carte)) padding-box,linear-gradient(135deg,#E4442A 0%,#F2A33A 60%,#2E3193 100%) border-box}
/* le menu des statuts du rendez-vous (bureau) : la couleur du statut choisi sur le bord */
.statut-menu{border-left:10px solid var(--sc,#55617A)!important;font-weight:700}
/* « Reporter » : bouton creux à la couleur du statut */
.bouton.st-btn.creux-st{background:color-mix(in srgb,var(--sc) 12%,var(--carte));color:var(--sc);border-color:var(--sc);font-weight:700}
:root[data-theme="dark"] .bouton.st-btn.creux-st{color:#fff}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .bouton.st-btn.creux-st{color:#fff}}
/* ============================================================
   Activité des techniciens : cinq cases qui claquent (icône, dégradé à la couleur de la case, chiffre en grand)
   ============================================================ */
.tech-stat{--sc:var(--c,var(--primaire));--ic:"🗂️";position:relative;isolation:isolate;overflow:hidden;min-height:82px;padding:12px 56px 10px 14px;border:2px solid transparent;border-left:2px solid transparent;border-radius:16px;
  background:linear-gradient(150deg,color-mix(in srgb,var(--sc) 24%,var(--carte)) 0%,color-mix(in srgb,var(--sc) 6%,var(--carte)) 70%) padding-box,linear-gradient(135deg,color-mix(in srgb,var(--sc) 70%,#fff) 0%,var(--sc) 100%) border-box;
  box-shadow:0 14px 26px -20px var(--sc);transition:transform .14s,box-shadow .16s}
.tech-stat::before{content:var(--ic);position:absolute;right:12px;top:50%;transform:translateY(-50%);font-size:28px;line-height:1;filter:drop-shadow(0 4px 8px rgba(0,0,0,.25));opacity:.95}
.tech-stat::after{content:"";position:absolute;z-index:-1;width:110px;height:110px;right:-40px;bottom:-50px;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--sc) 38%,transparent),transparent)}
.tech-stat:hover{transform:translateY(-2px);box-shadow:0 18px 30px -18px var(--sc);border-color:transparent}
.tech-stat b{font:800 30px/1 var(--mono);color:var(--sc);text-shadow:0 2px 10px color-mix(in srgb,var(--sc) 35%,transparent)}
.tech-stat span{font-weight:600;color:var(--texte);opacity:.85;margin-top:4px}
.tech-stat.vendu-t{--sc:#D68910;--ic:"💶";grid-column:1 / -1}
.tech-stat.vendu-t b{font-size:32px;background:linear-gradient(90deg,#B8860B 0%,#F2A33A 60%,#FFD27A 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;text-shadow:none}
.tech-stat.encours{--sc:#F26B1D;--ic:"⏳"}
.tech-stat.encours b{color:#F26B1D}
.tech-stat.signes{--sc:#00ADEF;--ic:"✍️"}
.tech-stat.rdv{--sc:#1D9A6C;--ic:"📅"}
.tech-stat.rdv.auj{--sc:#0EA84A;box-shadow:0 0 0 3px color-mix(in srgb,#0EA84A 30%,transparent),0 14px 26px -20px #0EA84A}
:root[data-theme="dark"] .tech-stat.encours b{color:#FFB27A}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .tech-stat.encours b{color:#FFB27A}}
.tech-stat{padding-right:48px}
.tech-stat::before{font-size:24px;right:10px}
.tech-stat.dossiers{--ic:"🗂️"}
.tech-stat:not(.plein):not(.vendu-t) b{opacity:.75}
@media (min-width:700px){.tech-stat{padding-right:56px} .tech-stat::before{font-size:28px;right:12px}}
.tech-stat.vendu-t{order:-1}
.tech-stat.dossiers{order:1}
.tech-stat.rdv{order:2}
.tech-stat.encours{order:3}
.tech-stat.signes{order:4}

/* facture oubliée : bouton orange sur les cartes de dossiers et la fiche du bureau */
.bouton.facture-oubliee{background:linear-gradient(135deg,#F26B1D,#E4442A);border-color:transparent;color:#fff;box-shadow:0 10px 20px -12px rgba(228,68,42,.8)}
.dossier-tech .dossier-actions .bouton.facture-oubliee{grid-column:1 / -1;color:#fff}
#facture .bandeau{margin:0 0 12px}
.dossier-tech .dossier-actions .bouton.facture-oubliee:not(.creux){background:linear-gradient(135deg,#F26B1D,#E4442A);border-color:transparent;color:#fff}

/* ============================================================
   Liste des dossiers du bureau : chaque dossier est une carte à liseré tricolore, bord haut à la couleur de l'état,
   icône du document, et un bouton Actions coloré qui propose tout ce qu'on peut faire avec ce dossier
   ============================================================ */
.dossiers-tableau tr{--dc:var(--primaire)}
.dossiers-tableau td.sel{border-left:5px solid var(--dc)}
.dossiers-tableau td.c-client .ic{display:inline-grid;place-items:center;width:34px;height:34px;margin-right:8px;border-radius:10px;font-size:18px;vertical-align:middle;background:color-mix(in srgb,var(--dc) 16%,var(--carte));border:1px solid color-mix(in srgb,var(--dc) 45%,transparent)}
.dossiers-tableau .menu-actions summary{background:linear-gradient(135deg,var(--dc),color-mix(in srgb,var(--dc) 55%,#12203A));border-color:transparent;color:#fff;font-weight:700;box-shadow:0 10px 20px -12px var(--dc)}
.dossiers-tableau .menu-actions summary::after{color:#fff}
.dossiers-tableau .menu-actions[open] summary{box-shadow:none}
.menu-actions .menu a i{font-style:normal;width:26px;text-align:center;margin-right:8px;flex:0 0 auto}
.menu-actions .menu a.facture-oubliee{color:#B84A00}
:root[data-theme="dark"] .menu-actions .menu a.facture-oubliee{color:#FFB27A}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .menu-actions .menu a.facture-oubliee{color:#FFB27A}}
@media (max-width:699px){
  .dossiers-tableau tbody{display:grid;gap:14px;padding:4px 0 8px}
  .dossiers-tableau tr{position:relative;isolation:isolate;overflow:hidden;border:2px solid transparent;border-top:6px solid var(--dc);border-radius:18px;background:linear-gradient(var(--carte),var(--carte)) padding-box,linear-gradient(135deg,#2E3193 0%,#00ADEF 55%,#E4442A 100%) border-box;padding:14px 14px 16px;gap:8px 10px;
    grid-template-columns:auto minmax(0,1fr) minmax(0,1fr);grid-template-areas:"sel client etat" ". date doc" ". montant tech" ". adresse adresse" ". contact contact" ". fichiers fichiers" "actions actions actions"}
  .dossiers-tableau td.c-client{min-width:0}
  .dossiers-tableau td.c-etat{align-self:start}
  .dossiers-tableau tr::after{content:"";position:absolute;z-index:-1;width:170px;height:170px;right:-70px;top:-80px;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--dc) 18%,transparent),transparent)}
  .dossiers-tableau td.sel{border-left:0}
  .dossiers-tableau td.c-client{font-size:19px;font-weight:700;display:flex;align-items:center;gap:8px}
  .dossiers-tableau td.c-client .ic{width:40px;height:40px;font-size:21px;margin:0}
  .dossiers-tableau td.c-date,.dossiers-tableau td.c-doc,.dossiers-tableau td.c-montant,.dossiers-tableau td.c-tech{background:var(--champ);border:1px solid var(--trait);border-radius:12px;padding:8px 10px;color:var(--texte);font-weight:600}
  .dossiers-tableau td.c-date::before,.dossiers-tableau td.c-doc::before,.dossiers-tableau td.c-montant::before{display:block;content:attr(data-l);color:var(--gris);font-size:14px;font-weight:400;margin-bottom:2px}
  .dossiers-tableau td.c-montant{justify-self:stretch;text-align:left;color:var(--dc);font-size:18px}
  .dossiers-tableau td.c-doc{color:var(--texte)}
  .dossiers-tableau td.c-tech::before{display:block;content:"Technicien";color:var(--gris);font-size:14px;font-weight:400;margin-bottom:2px}
  .dossiers-tableau td.c-adresse,.dossiers-tableau td.c-contact{padding:2px 0}
  .dossiers-tableau td.actions{margin-top:10px}
  .dossiers-tableau .menu-actions summary{min-height:52px;font-size:17px}
}
/* ============================================================
   Liste des clients du bureau : mêmes cartes que les dossiers (liseré tricolore, couleur selon le prochain entretien,
   avatar aux initiales) et un bouton Actions coloré qui propose tout ce qu'on peut faire pour ce client
   ============================================================ */
.clients-tableau tr{--dc:var(--primaire)}
.clients-tableau td.sel{border-left:5px solid var(--dc)}
.clients-tableau td.c-client .av{display:inline-grid;place-items:center;width:34px;height:34px;margin-right:8px;border-radius:50%;font-size:14px;font-weight:800;color:#fff;vertical-align:middle;background:linear-gradient(135deg,var(--dc),color-mix(in srgb,var(--dc) 55%,#12203A))}
.clients-tableau .menu-actions summary{background:linear-gradient(135deg,var(--dc),color-mix(in srgb,var(--dc) 55%,#12203A));border-color:transparent;color:#fff;font-weight:700;box-shadow:0 10px 20px -12px var(--dc)}
.clients-tableau .menu-actions summary::after{color:#fff}
.clients-tableau .menu-actions[open] summary{box-shadow:none}
@media (max-width:699px){
  .clients-tableau tbody{display:grid;gap:14px;padding:4px 0 8px}
  .clients-tableau tr{position:relative;isolation:isolate;overflow:hidden;border:2px solid transparent;border-top:6px solid var(--dc);border-radius:18px;background:linear-gradient(var(--carte),var(--carte)) padding-box,linear-gradient(135deg,#2E3193 0%,#00ADEF 55%,#E4442A 100%) border-box;padding:14px 14px 16px;gap:8px 10px;
    grid-template-columns:auto minmax(0,1fr) minmax(0,1fr);grid-template-areas:"sel client client" ". date tech" ". ville nb" ". prochain prochain" "actions actions actions"}
  .clients-tableau tr::after{content:"";position:absolute;z-index:-1;width:170px;height:170px;right:-70px;top:-80px;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--dc) 18%,transparent),transparent)}
  .clients-tableau td.sel{border-left:0}
  .clients-tableau td.c-client{font-size:19px;font-weight:700;display:flex;align-items:center;gap:8px;min-width:0}
  .clients-tableau td.c-client .av{width:40px;height:40px;font-size:16px;margin:0;flex:0 0 auto}
  .clients-tableau td.c-date,.clients-tableau td.c-tech,.clients-tableau td.c-ville,.clients-tableau td.c-nb,.clients-tableau td.c-prochain{background:var(--champ);border:1px solid var(--trait);border-radius:12px;padding:8px 10px;color:var(--texte);font-weight:600}
  .clients-tableau td.c-date a,.clients-tableau td.c-tech a,.clients-tableau td.c-nb a{color:inherit}
  .clients-tableau td.c-date::before,.clients-tableau td.c-ville::before,.clients-tableau td.c-nb::before{display:block;content:attr(data-l);color:var(--gris);font-size:14px;font-weight:400;margin-bottom:2px}
  .clients-tableau td.c-tech::before{display:block;content:"Technicien";color:var(--gris);font-size:14px;font-weight:400;margin-bottom:2px}
  .clients-tableau td.c-prochain{grid-area:prochain}
  .clients-tableau td.actions{grid-area:actions;margin-top:10px}
  .clients-tableau .menu-actions summary{min-height:52px;font-size:17px;width:100%}
}
/* ============================================================
   Gestion des comptes : une carte par compte à la couleur attitrée du technicien (la même que sur le tableau de bord
   et le planning), liseré tricolore, chiffres utiles, toutes les actions sous les yeux, et « Modifier les informations »
   ============================================================ */
.compte.compte-tech{position:relative;isolation:isolate;overflow:hidden;padding:0;border:2px solid transparent;border-radius:18px;
  background:linear-gradient(var(--carte),var(--carte)) padding-box,linear-gradient(135deg,#2E3193 0%,#00ADEF 55%,#E4442A 100%) border-box}
.compte-tech .tech-tete{border-radius:14px 14px 0 0}
.compte-tech .tech-tete h3{margin:0;font-size:20px;line-height:1.2;color:#fff;overflow-wrap:anywhere}
.compte-tech .tech-tete small{display:flex;flex-wrap:wrap;align-items:center;gap:6px;color:rgba(255,255,255,.9);font-size:16px;margin-top:4px}
.compte-tech .tech-tete .etat{margin-left:auto;background:#fff;color:#12203A;border-color:transparent;font-weight:700}
.compte-tech.st-suspendu .tech-tete .etat{background:#FBE3DF;color:#B02A1B}
.compte-tech.st-en_attente .tech-tete .etat{background:#FFF3D6;color:#7A4B00}
.compte-tech .compte-infos{padding:14px 16px 0;gap:8px}
.compte-tech .compte-infos div{background:var(--champ);border:1px solid var(--trait);border-radius:12px;padding:8px 10px}
.compte-tech .compte-infos dt{font-size:16px}
.compte-tech .compte-infos dd small{font-weight:400;color:var(--gris);font-size:16px}
.compte-tech .compte-infos dd.montant{color:var(--c,var(--primaire));font-size:18px}
.compte-tech .compte-actions-ligne{padding:14px 16px 0}
.compte-tech .compte-actions-ligne .bouton{width:100%;min-height:48px;padding:0 12px;font-size:16px;white-space:normal;line-height:1.2}
.compte-tech .compte-actions-ligne .bouton:not(.creux){background:var(--c,var(--primaire));border-color:var(--c,var(--primaire));color:#fff}
.compte-tech .compte-actions-ligne .bouton.creux:not(.danger){color:var(--c,var(--primaire));border-color:color-mix(in srgb,var(--c,var(--primaire)) 60%,transparent)}
:root[data-theme="dark"] .compte-tech .compte-actions-ligne .bouton.creux:not(.danger){color:var(--texte)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .compte-tech .compte-actions-ligne .bouton.creux:not(.danger){color:var(--texte)}}
.compte-modif{margin:12px 16px 16px}
.compte-modif summary{list-style:none;cursor:pointer;width:100%;min-height:48px;display:inline-flex;align-items:center;justify-content:center;font-size:16px}
.compte-modif summary::-webkit-details-marker{display:none}
.compte-modif[open] summary{background:var(--c,var(--primaire));border-color:var(--c,var(--primaire));color:#fff}
.compte-modif form{margin-top:12px;padding:14px;border:1px solid color-mix(in srgb,var(--c,var(--primaire)) 45%,var(--trait));border-radius:14px;background:var(--champ)}
.compte-modif form .bouton{width:100%;background:var(--c,var(--primaire));border-color:var(--c,var(--primaire));color:#fff}
.tech-tete .lien-compte{color:#fff;text-decoration:underline;text-underline-offset:3px}
@media (min-width:700px){.comptes{grid-template-columns:1fr 1fr}}
.mon-compte .compte-modif{margin:12px 0 0}
.mon-compte .compte-id span{display:block}

/* ============================================================
   Grille tarifaire : les prix de l'entreprise, lisibles d'un coup d'œil, aux couleurs de l'application
   ============================================================ */
.tarifs-hero h1{margin:4px 0 8px;font-size:26px;line-height:1.15;background:linear-gradient(90deg,#2E3193,#00ADEF 55%,#E4442A);-webkit-background-clip:text;background-clip:text;color:transparent}
.tarifs-sous{margin:0 0 10px;color:var(--gris);font-size:16px;line-height:1.45}
.tarifs-soc{margin:0;font-size:16px;line-height:1.5}
.tarifs-bloc h2{margin-top:0}
.tarif-liste{display:grid;gap:10px}
.tarif{position:relative;isolation:isolate;overflow:hidden;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px 14px;border-radius:16px;
  background:linear-gradient(160deg,color-mix(in srgb,var(--tc) 14%,var(--carte)) 0%,var(--champ) 70%);border:1px solid color-mix(in srgb,var(--tc) 40%,var(--trait));border-left:6px solid var(--tc)}
.tarif::after{content:"";position:absolute;z-index:-1;width:120px;height:120px;right:-60px;top:-60px;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--tc) 22%,transparent),transparent)}
.tarif i{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;font-style:normal;font-size:22px;background:color-mix(in srgb,var(--tc) 18%,var(--carte));border:2px solid color-mix(in srgb,var(--tc) 50%,transparent)}
.tarif-txt b{display:block;font-size:17px;line-height:1.2}
.tarif-txt small{display:block;font-size:16px;color:var(--gris);line-height:1.35;margin-top:2px}
.tarif-prix{text-align:right;white-space:nowrap}
.tarif-prix b{display:block;font-family:ui-monospace,"Cascadia Mono",Consolas,monospace;font-size:22px;color:var(--tc);font-variant-numeric:tabular-nums}
.tarif-prix b small{font-size:16px;color:var(--gris);margin-left:4px}
.tarif-prix span{display:block;font-size:16px;color:var(--gris)}
.formules{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.formule{position:relative;isolation:isolate;overflow:hidden;border-radius:16px;padding:14px;color:#fff;background:linear-gradient(135deg,var(--fc) 0%,color-mix(in srgb,var(--fc) 55%,#12203A) 100%);box-shadow:0 14px 26px -18px var(--fc)}
.formule::after{content:"";position:absolute;z-index:-1;width:120px;height:120px;right:-50px;top:-60px;border-radius:50%;background:rgba(255,255,255,.14)}
.formule-nom{margin:0;font-size:19px;font-weight:800;line-height:1.15}
.formule-nom small{display:block;font-size:16px;font-weight:600;opacity:.92;margin-top:2px}
.formule-couv{margin:8px 0 0;font-size:16px;line-height:1.35;opacity:.95}
.formule-prix{margin:10px 0 0;font-family:ui-monospace,"Cascadia Mono",Consolas,monospace;font-size:24px;font-weight:700;font-variant-numeric:tabular-nums}
.formule-prix small{font-size:16px;font-weight:600;margin-left:4px}
.formule-soit{margin:2px 0 0;font-size:16px;opacity:.92}
.tarifs-aide{margin:12px 0 0}
.conditions{margin:0;padding:0;list-style:none;display:grid;gap:8px}
.conditions li{padding:10px 12px 10px 16px;border-left:4px solid var(--cyan,#00ADEF);background:var(--champ);border-radius:0 12px 12px 0;font-size:16px;line-height:1.45}
.conditions li:nth-child(3n+2){border-left-color:#2E3193}
.conditions li:nth-child(3n){border-left-color:#E4442A}
.tarifs-legal{margin:14px 0 0;font-size:16px;color:var(--gris);line-height:1.45}
@media (max-width:480px){.formules{grid-template-columns:1fr} .tarif{grid-template-columns:auto minmax(0,1fr);grid-template-areas:"ic txt" "ic prix"} .tarif i{grid-area:ic} .tarif-txt{grid-area:txt} .tarif-prix{grid-area:prix;text-align:left} .tarif-prix span{display:inline;margin-left:6px}}

/* ============================================================
   Mes dossiers du technicien : Ouvrir + Voir le PDF sous les yeux, et un bouton Actions coloré qui propose tout le reste
   ============================================================ */
.dossier-tech .dossier-actions details.menu-actions{grid-column:1/-1;margin:0}
.dossier-tech .dossier-actions .menu-actions summary{width:100%;min-height:50px;font-size:16px;font-weight:700;color:#fff;border-color:transparent;
  background:linear-gradient(135deg,var(--dc,var(--primaire)),color-mix(in srgb,var(--dc,var(--primaire)) 55%,#12203A));box-shadow:0 10px 20px -12px var(--dc,var(--primaire))}
.dossier-tech .dossier-actions .menu-actions summary::after{color:#fff}
.dossier-tech .dossier-actions .menu-actions .menu{position:static;margin-top:6px;box-shadow:none;min-width:0}
.dossier-tech .dossier-actions .bouton.inactif{opacity:.55;pointer-events:none}
.menu-actions .menu form{margin:0}
.menu-actions .menu form button{display:flex;align-items:center;width:100%;min-height:48px;padding:0 12px;border:0;border-radius:8px;background:transparent;color:var(--texte);font:600 16px var(--ui);text-align:left;cursor:pointer}
.menu-actions .menu form button:hover,.menu-actions .menu form button:focus-visible{background:var(--champ)}
.menu-actions .menu form button:disabled{opacity:.5;cursor:default}
.menu-actions .menu form button.danger{color:var(--rouge)}
.menu-actions .menu form button i{font-style:normal;width:26px;text-align:center;margin-right:8px;flex:0 0 auto}
.dossier-tech .dossier-actions .menu-actions .menu a.facture-oubliee{color:#B84A00}
:root[data-theme="dark"] .menu-actions .menu form button.danger{color:#FFB3A1}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .menu-actions .menu form button.danger{color:#FFB3A1}}
/* ============================================================
   En-tête du tableau de bord bureau : icône centrée, CRM AKS, Espace bureau, la date sur une seule ligne
   ============================================================ */
.hero-marque{flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:4px;margin-top:-6px}
.hero-marque .hero-logo{width:64px;height:64px;margin-bottom:4px}
.hero-marque .titre-crm{margin:0;line-height:1.05}
.hero-espace{margin:2px 0 0;font:600 16px var(--mono);letter-spacing:2px;text-transform:uppercase;color:#7FD6FF}
.hero-marque .hero-date{margin:4px 0 12px;white-space:nowrap;letter-spacing:.5px;font-size:16px}

/* ============================================================
   Gestion des comptes, version compacte : la carte ne garde que son en-tête coloré ;
   la bulle « i », ronde, déroule la fiche (coordonnées, chiffres) et toutes les actions du compte
   ============================================================ */
.compte-tech .tech-tete{padding-right:70px;border-radius:14px 14px 14px 14px}
.compte-menu{margin:0}
.compte-menu>summary{list-style:none;cursor:pointer;position:absolute;top:12px;right:12px;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;
  background:rgba(255,255,255,.22);border:2px solid rgba(255,255,255,.85);box-shadow:0 6px 14px -6px rgba(0,0,0,.55);transition:transform .12s,background .15s}
.compte-menu>summary::-webkit-details-marker{display:none}
.compte-menu>summary i{font:800 22px Georgia,"Times New Roman",serif;font-style:italic;color:#fff;line-height:1}
.compte-menu>summary:hover{transform:scale(1.06);background:rgba(255,255,255,.34)}
.compte-menu[open]>summary{background:#fff;border-color:#fff}
.compte-menu[open]>summary i{color:var(--c,var(--primaire))}
.compte-menu-corps{padding:0 0 16px}
.compte-menu-corps .compte-infos{padding:14px 16px 0}
.compte-menu-corps .compte-actions-ligne{padding:14px 16px 0}
.compte-menu-corps .compte-modif{margin:12px 16px 0}
@media (min-width:1000px){.comptes{grid-template-columns:1fr 1fr 1fr}}
/* ============================================================
   Étiquettes techniciens du tableau de bord : compactes (initiales, nom, dossiers, total), l'activité complète se déplie
   derrière les initiales (bouton) ; beaucoup de techniciens tiennent sur l'écran d'un téléphone
   ============================================================ */
.tech-cartes{align-items:start}
.tech-carte>details.tech-menu{margin:0}
summary.tech-tete{list-style:none;cursor:pointer;gap:12px;align-items:center;-webkit-tap-highlight-color:transparent;user-select:none}
summary.tech-tete::-webkit-details-marker{display:none}
summary.tech-tete:focus-visible{outline-offset:-3px}
summary.tech-tete:hover .avatar{background:rgba(255,255,255,.34)}
summary.tech-tete:active .avatar{transform:scale(.94)}
.activite-note{margin:-4px 0 12px;font-size:16px;color:var(--gris)}
summary.tech-tete .avatar{position:relative;overflow:visible;flex:0 0 auto;transition:transform .12s,background .15s}
summary.tech-tete .avatar::after{content:"▾";position:absolute;right:-7px;bottom:-7px;width:22px;height:22px;border-radius:50%;background:#fff;color:color-mix(in srgb,var(--c,#2E3193) 65%,#12203A);
  font:700 14px/22px var(--ui);text-align:center;box-shadow:0 2px 6px rgba(0,0,0,.35);transition:transform .2s}
.tech-menu[open] .tech-tete .avatar{background:#fff;color:color-mix(in srgb,var(--c,#2E3193) 65%,#12203A)}
.tech-menu[open] .tech-tete .avatar::after{transform:rotate(180deg)}
.tech-nom .client{display:block;font-size:18px;font-weight:700;color:#fff;line-height:1.2;overflow-wrap:anywhere;padding-right:100px}
.tech-carte.st-suspendu .tech-nom .client{padding-right:126px}
.tech-nom .client .rang{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#fff;color:color-mix(in srgb,var(--c,#2E3193) 65%,#12203A);font-size:13px;vertical-align:2px;margin-right:6px}
.tech-nom .client .badge{vertical-align:2px}
.tech-resume{display:block;font-size:16px;color:rgba(255,255,255,.9);margin-top:3px;line-height:1.3}
.tech-resume b{color:#fff;font-family:var(--mono);font-variant-numeric:tabular-nums;white-space:nowrap}
.tech-etat{position:absolute;top:12px;right:12px;z-index:1;display:inline-flex;align-items:center;gap:6px;font-size:16px;font-weight:600;line-height:1.25;padding:2px 10px;border-radius:999px;
  background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.45);color:#fff;white-space:nowrap}
.tech-etat i{font-style:normal;font-size:13px;line-height:1}
.tech-etat.actif{background:rgba(255,255,255,.92);color:#0F6B45;border-color:#fff}
.tech-etat.actif i{color:#1C7A55}
.tech-etat.inactif{background:rgba(255,255,255,.92);color:#55617A;border-color:#fff}
.tech-etat.inactif i{color:#8A93A6}
.tech-etat.suspendu{background:#FBE3DF;color:#B02A1B;border-color:transparent}
.tech-etat.suspendu i{color:#B02A1B}
.tech-activite{padding:12px 14px 14px;border-top:1px solid color-mix(in srgb,var(--c,var(--primaire)) 25%,var(--trait))}
.tech-activite .tech-ligne{margin:0 0 10px;font-size:16px;color:var(--gris)}
.tech-activite .tech-stats{padding:0}
.tech-liens{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}
.tech-liens .bouton{min-height:48px;font-size:16px;padding:0 10px}
.tech-liens .bouton:nth-child(3){grid-column:1 / -1}
@media (max-width:359px){.tech-liens{grid-template-columns:1fr}.tech-liens .bouton:nth-child(3){grid-column:auto}}

/* ============================================================
   Fiche d'un dossier (bureau) : gérer les fichiers — télécharger, remplacer, retirer (chaque document, chaque justificatif)
   ============================================================ */
.docs-gerer li{align-items:flex-start}
.docs-gerer .doc-actions{flex-basis:100%;display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:6px}
.docs-gerer .doc-actions form{margin:0}
.docs-gerer .doc-actions .mini{min-height:48px;padding:0 14px;margin:0;cursor:pointer;font-size:16px}
.docs-gerer .doc-actions .mini.danger{color:var(--rouge);border-color:color-mix(in srgb,var(--rouge) 45%,var(--trait));background:color-mix(in srgb,var(--rouge) 6%,var(--champ))}
:root[data-theme="dark"] .docs-gerer .doc-actions .mini.danger{color:#FFB3A1}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .docs-gerer .doc-actions .mini.danger{color:#FFB3A1}}
.doc-remplacer{margin:0}
.doc-remplacer>summary{list-style:none}
.doc-remplacer>summary::-webkit-details-marker{display:none}
.doc-remplacer[open]>summary{border-color:var(--primaire)}
.doc-remplacer .doc-form{margin:10px 0 4px;padding:12px 14px;border:1px solid var(--trait);border-radius:12px;background:var(--champ);width:100%}
.doc-remplacer .doc-form .aide{margin:0 0 10px}
.doc-remplacer .doc-form .fichier-bouton{width:100%;margin:0 0 6px}

/* ============================================================
   Nouveau client (bureau) : le client, le matériel (pastilles), ce qui est convenu, le rendez-vous ; le dossier déjà fait dans un volet replié
   ============================================================ */
.nouveau-client h2{display:flex;align-items:center;gap:10px;margin:24px 0 10px;font-size:20px}
.nouveau-client h2 .num{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,#2E3193,#00ADEF);color:#fff;font:700 16px var(--mono)}
.nouveau-client textarea{min-height:96px}
/* les boutons du bas : Enregistrer en dégradé à liseré, Annuler en creux à liseré */
.nouveau-client .actions-nc{margin-top:8px}
.nouveau-client .actions-nc .bouton{min-height:58px;font-size:18px;border-radius:14px;border:2px solid transparent;display:inline-flex;align-items:center;justify-content:center;gap:10px}
.nouveau-client .actions-nc .bouton.principal{color:#fff;background:linear-gradient(135deg,#2E3193 0%,#00ADEF 100%) padding-box,linear-gradient(135deg,#2E3193 0%,#00ADEF 55%,#E4442A 100%) border-box;box-shadow:0 14px 26px -14px rgba(0,173,239,.95)}
.nouveau-client .actions-nc .bouton.principal:hover{transform:translateY(-1px)}
.nouveau-client .actions-nc .bouton.creux{color:var(--texte);background:linear-gradient(var(--carte),var(--carte)) padding-box,linear-gradient(135deg,#2E3193 0%,#00ADEF 55%,#E4442A 100%) border-box}
.nouveau-client .actions-nc .bouton span{font-size:20px;line-height:1}
details.deja{border:2px dashed color-mix(in srgb,var(--primaire) 40%,var(--trait));border-radius:14px;padding:12px 14px;margin:22px 0 18px;background:color-mix(in srgb,var(--primaire) 4%,var(--carte))}
details.deja>summary{list-style:none;cursor:pointer;display:flex;align-items:flex-start;gap:12px;min-height:48px;font-weight:700;font-size:17px;line-height:1.35}
details.deja>summary::-webkit-details-marker{display:none}
details.deja>summary input{margin:3px 0 0;width:22px;height:22px;flex:0 0 auto;accent-color:var(--primaire)}
details.deja h3{margin:18px 0 6px;font-size:18px}
/* fiche client : ses rendez-vous, avec la note du bureau */
.rdv-client li{display:grid;grid-template-columns:minmax(0,1fr);gap:6px 14px}
.rdv-client li a{overflow-wrap:normal;word-break:normal}
.rdv-client li>span{display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px}
.rdv-client li small.rdv-note-c{grid-column:1 / -1;display:block;font-size:16px;color:var(--gris)}
.rdv-client .etat{vertical-align:middle}
@media (min-width:700px){.rdv-client li{grid-template-columns:minmax(0,1fr) auto;align-items:center}}
/* carte de rendez-vous : la note du bureau bien visible pour le technicien */
.rdv-fiche .rdv-note dd{padding:8px 10px;border-radius:10px;background:color-mix(in srgb,#FFC400 14%,var(--carte));border:1px solid color-mix(in srgb,#FFC400 50%,var(--trait))}

/* ============================================================
   Page de connexion : titre en couleurs, carte à liseré, trois boutons d'aide (mot de passe oublié, appeler le bureau, créer mon compte)
   ============================================================ */
.carte-connexion{position:relative;isolation:isolate;overflow:hidden;padding:24px 18px 20px}
.carte-connexion::before{content:"";position:absolute;z-index:-1;width:240px;height:240px;right:-110px;top:-120px;border-radius:50%;background:radial-gradient(closest-side,rgba(0,173,239,.22),transparent)}
.carte-connexion::after{content:"";position:absolute;z-index:-1;width:200px;height:200px;left:-90px;bottom:-110px;border-radius:50%;background:radial-gradient(closest-side,rgba(228,68,42,.16),transparent)}
.entree .carte-connexion h1{font-size:36px;line-height:1.05;letter-spacing:-.5px;margin:0 0 6px;background:linear-gradient(90deg,#4B50D6 0%,#00ADEF 55%,#FF8A5B 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
:root[data-theme="dark"] .entree .carte-connexion h1{background:linear-gradient(90deg,#8F94FF 0%,#4FC9FF 55%,#FF9E72 100%);-webkit-background-clip:text;background-clip:text}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .entree .carte-connexion h1{background:linear-gradient(90deg,#8F94FF 0%,#4FC9FF 55%,#FF9E72 100%);-webkit-background-clip:text;background-clip:text}}
.carte-connexion .connexion-sous{margin:0 0 16px;font-size:16px;color:var(--gris)}
.carte-connexion .eyebrow{font-size:16px}
.connexion-aides{display:grid;gap:10px;margin:18px 0 0}
.aide-btn{--k1:#2E3193;--k2:#00ADEF;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;min-height:66px;padding:10px 14px;border-radius:16px;text-decoration:none;color:var(--texte);
  border:2px solid transparent;background:linear-gradient(var(--champ),var(--champ)) padding-box,linear-gradient(135deg,var(--k1) 0%,var(--k2) 100%) border-box;box-shadow:0 14px 26px -20px var(--k1);transition:transform .12s,box-shadow .15s}
.aide-btn:hover{transform:translateY(-2px);box-shadow:0 18px 30px -18px var(--k1)}
.aide-btn:active{transform:scale(.99)}
.aide-btn i{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;font-style:normal;font-size:22px;background:linear-gradient(135deg,color-mix(in srgb,var(--k1) 22%,var(--carte)),color-mix(in srgb,var(--k2) 22%,var(--carte)));border:1.5px solid color-mix(in srgb,var(--k2) 55%,transparent)}
.aide-btn span{display:flex;flex-direction:column;min-width:0}
.aide-btn b{font-size:17px;line-height:1.2}
.aide-btn small{font-size:16px;color:var(--gris);line-height:1.3;overflow-wrap:anywhere}
.aide-btn em{font-style:normal;font-size:26px;line-height:1;color:var(--k2)}
.aide-btn.a1{--k1:#2E3193;--k2:#00ADEF}
.aide-btn.a2{--k1:#1D9A6C;--k2:#00ADEF}
.aide-btn.a3{--k1:#F2A33A;--k2:#E4442A}

/* ============================================================
   Espace client : même fond de marque, mêmes cartes à liseré tricolore, mêmes boutons que l'équipe
   ============================================================ */
.centre-texte{text-align:center}
.centre-texte form{margin:6px 0 10px}
.page-espace .enveloppe{padding-top:24px}
/* l'espace suit le mode clair / sombre comme le bureau et les techniciens ; en clair, jamais de fond blanc :
   un fond fumé en dégradé aux couleurs du logo (bleu, cyan, rouge), les cartes restent blanches pour la lecture */
.page-espace{min-height:100vh;min-height:100dvh;background:radial-gradient(95% 50% at 0% 0%,rgba(46,49,147,.34),transparent 70%),radial-gradient(85% 45% at 100% 10%,rgba(0,173,239,.36),transparent 70%),radial-gradient(85% 40% at 0% 58%,rgba(0,173,239,.20),transparent 70%),radial-gradient(95% 45% at 100% 100%,rgba(228,68,42,.28),transparent 70%),linear-gradient(165deg,#D6DCF2 0%,#DAE9F7 40%,#ECE3EE 72%,#F5DFDA 100%)}
:root[data-theme="dark"] .page-espace{background:radial-gradient(95% 50% at 0% 0%,rgba(0,173,239,.30),transparent 70%),radial-gradient(85% 45% at 100% 12%,rgba(228,68,42,.22),transparent 70%),radial-gradient(95% 45% at 50% 100%,rgba(46,49,147,.55),transparent 70%),linear-gradient(170deg,#16294A 0%,#12203A 60%,#0B1424 100%)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .page-espace{background:radial-gradient(95% 50% at 0% 0%,rgba(0,173,239,.30),transparent 70%),radial-gradient(85% 45% at 100% 12%,rgba(228,68,42,.22),transparent 70%),radial-gradient(95% 45% at 50% 100%,rgba(46,49,147,.55),transparent 70%),linear-gradient(170deg,#16294A 0%,#12203A 60%,#0B1424 100%)}}
.theme-flottant~.enveloppe>.bandeau:first-child{margin-right:58px}
.espace{max-width:620px;margin:0 auto}
.espace>.entree-logo{display:block;width:max-content;margin:0 auto 18px}
.espace .carte{margin:0 0 14px}
.espace h2{display:flex;align-items:center;gap:10px;font-size:20px;margin:0 0 12px}
.espace-hero{position:relative;isolation:isolate;overflow:hidden;padding:24px 18px 20px}
.espace-hero::before{content:"";position:absolute;z-index:-1;width:240px;height:240px;right:-110px;top:-120px;border-radius:50%;background:radial-gradient(closest-side,rgba(0,173,239,.22),transparent)}
.espace-hero::after{content:"";position:absolute;z-index:-1;width:200px;height:200px;left:-90px;bottom:-110px;border-radius:50%;background:radial-gradient(closest-side,rgba(228,68,42,.16),transparent)}
.espace-hero .eyebrow{font-size:16px;margin:0 0 4px}
.espace-hero h1{font-size:34px;line-height:1.05;letter-spacing:-.5px;margin:0 0 6px;background:linear-gradient(90deg,#4B50D6 0%,#00ADEF 55%,#FF8A5B 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
:root[data-theme="dark"] .espace-hero h1{background:linear-gradient(90deg,#8F94FF 0%,#4FC9FF 55%,#FF9E72 100%);-webkit-background-clip:text;background-clip:text}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .espace-hero h1{background:linear-gradient(90deg,#8F94FF 0%,#4FC9FF 55%,#FF9E72 100%);-webkit-background-clip:text;background-clip:text}}
.espace-hero .sous{margin:0 0 16px;font-size:16px;color:var(--gris)}
.entretien-bloc{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px;align-items:center;padding:14px 16px;margin:0 0 14px;border-radius:16px;border:2px solid transparent;
  background:linear-gradient(135deg,color-mix(in srgb,#00ADEF 12%,var(--carte)),color-mix(in srgb,#2E3193 12%,var(--carte))) padding-box,linear-gradient(135deg,#2E3193 0%,#00ADEF 55%,#E4442A 100%) border-box}
.entretien-bloc.proche{background:linear-gradient(135deg,color-mix(in srgb,#F2A33A 18%,var(--carte)),color-mix(in srgb,#E4442A 10%,var(--carte))) padding-box,linear-gradient(135deg,#F2A33A 0%,#E4442A 100%) border-box}
.entretien-bloc i{font-style:normal;font-size:34px;line-height:1}
.entretien-bloc span{display:flex;flex-direction:column;gap:2px;min-width:0}
.entretien-bloc small{font-size:16px;color:var(--gris);line-height:1.35}
.entretien-bloc b{font:800 26px/1.15 var(--mono);color:var(--texte)}
.espace-contact{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.espace-contact .bouton{min-height:56px;font-size:17px;display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:14px;border:2px solid transparent;width:100%}
.espace-contact .bouton:not(.creux){color:#fff;background:linear-gradient(135deg,#2E3193 0%,#00ADEF 100%) padding-box,linear-gradient(135deg,#2E3193 0%,#00ADEF 55%,#E4442A 100%) border-box;box-shadow:0 14px 26px -16px rgba(0,173,239,.95)}
.espace-contact .bouton.creux{color:var(--texte);background:linear-gradient(var(--carte),var(--carte)) padding-box,linear-gradient(135deg,#2E3193 0%,#00ADEF 55%,#E4442A 100%) border-box}
@media (max-width:359px){.espace-contact{grid-template-columns:1fr}}
.materiel-type{display:inline-flex;align-items:center;min-height:40px;padding:0 14px;margin:0 0 12px;border-radius:999px;font-weight:700;font-size:16px;
  background:color-mix(in srgb,#1D9A6C 12%,var(--carte));border:1.5px solid color-mix(in srgb,#1D9A6C 50%,transparent)}
.appareil div{background:var(--champ);border:1px solid var(--trait);border-radius:12px;padding:8px 10px}
.photos-grille{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;margin-top:12px}
.photos-grille a{display:block;border-radius:14px;overflow:hidden;border:1px solid var(--trait);background:var(--champ);text-decoration:none;color:var(--texte)}
.photos-grille img{display:block;width:100%;height:140px;object-fit:cover}
.photos-grille small{display:block;padding:8px 10px;font-size:16px;line-height:1.25}
.espace-dossiers{display:grid;gap:10px}
.espace-dossier{padding:12px 14px;border-radius:14px;background:var(--champ);border:1px solid var(--trait);border-left:5px solid #1D9A6C}
.espace-dossier .titre{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 4px;font-size:17px}
.espace-dossier .titre small{margin-left:auto;font:600 16px var(--mono);color:var(--gris)}
.espace-dossier .docs li{padding:10px 0}
.espace-vide p{font-size:16px}
.espace #infos form{margin:12px 0 0}
.espace #infos .bouton.creux{width:100%;min-height:52px}

/* ============================================================
   Bureau : la page « Espaces clients » — mêmes cartes compactes que les comptes des techniciens
   ============================================================ */
.ec-tete{position:relative;isolation:isolate;overflow:hidden}
.ec-tete h1{margin:0 0 6px}
.ec-tete .eyebrow{margin:0 0 4px}
.ec-filtres{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:14px 0}
@media (min-width:700px){.ec-filtres{grid-template-columns:repeat(4,minmax(0,1fr))}}
.ec-filtre{position:relative;isolation:isolate;overflow:hidden;display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-areas:"ic nb" "ic lib";gap:0 10px;align-items:center;min-height:68px;padding:10px 12px;border-radius:14px;text-decoration:none;color:var(--texte);
  background:linear-gradient(160deg,color-mix(in srgb,var(--fc) 14%,var(--carte)),var(--carte) 75%);border:1.5px solid color-mix(in srgb,var(--fc) 45%,var(--trait));border-top:4px solid var(--fc);transition:transform .12s,box-shadow .15s}
.ec-filtre:hover{transform:translateY(-2px);box-shadow:0 12px 24px -18px var(--fc)}
.ec-filtre.actif{box-shadow:0 0 0 2px var(--fc) inset,0 12px 24px -16px var(--fc)}
.ec-filtre i{grid-area:ic;font-style:normal;font-size:22px;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:color-mix(in srgb,var(--fc) 18%,var(--carte))}
.ec-filtre b{grid-area:nb;font:800 24px/1.1 var(--mono);color:var(--fc)}
.ec-filtre span{grid-area:lib;font-size:16px;font-weight:600;line-height:1.2}
.ec-lien{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;padding:14px;border-radius:14px;background:var(--champ);border:1px dashed color-mix(in srgb,var(--cyan) 55%,var(--trait))}
.ec-lien p{margin:0;display:flex;flex-direction:column;gap:4px;font-size:16px}
.ec-lien a{font-weight:700;overflow-wrap:anywhere}
.ec-lien .bouton{min-height:52px;width:100%}
@media (min-width:700px){.ec-lien{grid-template-columns:minmax(0,1fr) auto;align-items:center}.ec-lien .bouton{width:auto;padding:0 22px}}
.recherche-ec{margin:6px 0 10px}
.recherche-ec input{min-height:56px}
.compte-espace .tech-nom small{overflow-wrap:anywhere}
.compte-espace .tech-tete{flex-wrap:wrap;row-gap:8px}
.compte-espace .tech-nom{flex:1 1 170px;min-width:0}
.compte-espace .tech-tete .etat{align-self:flex-start;margin-left:60px}   /* l'état passe sous le nom : le nom garde toute la largeur */
.compte-espace.st-actif .tech-tete .etat{background:#E4F5EC;color:#146B3A}
.compte-espace.st-a_confirmer .tech-tete .etat{background:#FFF3D6;color:#7A4B00}
.compte-espace.st-suspendu .tech-tete .etat{background:#E6EAF0;color:#3A4658}
.ec-resume{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:12px 16px 14px}
.ec-resume span{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 12px;border-radius:999px;background:var(--champ);border:1px solid var(--trait);font-size:16px}
.ec-resume b{font-family:var(--mono)}
.ec-aide{margin:12px 16px 0;padding:10px 12px;border-radius:12px;background:color-mix(in srgb,#F2A33A 12%,var(--carte));border:1px solid color-mix(in srgb,#F2A33A 45%,transparent)}
.onglet.onglet-espaces{border-color:color-mix(in srgb,#1D9A6C 55%,var(--trait));background:color-mix(in srgb,#1D9A6C 10%,var(--carte))}


/* ============================================================
   Espace client, version complète : six écrans, l'équipement en photos, la prise de rendez-vous, le parrainage, l'offre du moment.
   Mêmes cartes à liseré tricolore, mêmes couleurs, mêmes boutons que le bureau et les techniciens.
   ============================================================ */
.page-espace .enveloppe.large{max-width:1040px}
.espace{max-width:none}
.espace .carte{margin:0 0 16px}
.nav-espace{margin:-2px 0 14px}
.espace h2.offre-titre{display:block}
/* l'accueil */
.es-hero-haut{display:flex;gap:14px;align-items:center;margin:0 0 14px}
.es-hero-haut h1{margin:0 0 4px}
.es-hero-haut .sous{margin:0}
.es-avatar{width:60px;height:60px;flex:0 0 auto;font-size:21px;background:linear-gradient(135deg,#2E3193,#00ADEF);box-shadow:0 10px 22px -12px #00ADEF;border:2px solid #fff}
/* l'état du suivi : quatre petites cartes nettes, une icône colorée, un libellé, une valeur */
.es-statuts{list-style:none;margin:0 0 14px;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
@media (min-width:900px){.es-statuts{grid-template-columns:repeat(4,minmax(0,1fr))}}
.es-statuts li{display:flex;align-items:center;gap:10px;min-width:0;padding:10px 12px;border-radius:14px;background:var(--champ);border:1px solid var(--trait);box-shadow:0 8px 18px -16px var(--sc)}
.es-statuts i{flex:0 0 auto;width:42px;height:42px;display:grid;place-items:center;font-style:normal;font-size:20px;border-radius:12px;
  background:linear-gradient(135deg,color-mix(in srgb,var(--sc) 22%,var(--carte)),color-mix(in srgb,var(--sc) 8%,var(--carte)));box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--sc) 40%,transparent)}
.es-statuts span{display:flex;flex-direction:column;min-width:0;line-height:1.25}
.es-statuts small{font-size:16px;color:var(--gris)}
.es-statuts b{font-size:16px;color:var(--texte);overflow-wrap:anywhere}
.es-statuts .es-statut-plus{color:color-mix(in srgb,var(--sc) 70%,var(--texte));font-weight:600}
@media (max-width:360px){.es-statuts{grid-template-columns:1fr}}
.es-puces{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px;padding:0}
.es-puces li{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 12px;border-radius:999px;font-size:16px;font-weight:600;background:var(--champ);border:1px solid var(--trait)}
.es-puces li.ok{background:var(--ok-fond);color:var(--ok);border-color:color-mix(in srgb,var(--ok) 35%,transparent)}
.entretien-bloc .es-rdv-bouton{grid-column:1/-1;min-height:52px;margin:2px 0 0}
.entretien-bloc .es-rdv-bouton:not(.creux){color:#fff;border-color:transparent;background:linear-gradient(135deg,#E4442A 0%,#F26B1D 100%);box-shadow:0 12px 22px -14px #E4442A}
.entretien-bloc.fixe{background:linear-gradient(135deg,color-mix(in srgb,#1D9A6C 16%,var(--carte)),color-mix(in srgb,#00ADEF 10%,var(--carte))) padding-box,linear-gradient(135deg,#1D9A6C 0%,#00ADEF 100%) border-box}
@media (min-width:700px){.entretien-bloc{grid-template-columns:auto minmax(0,1fr) auto}.entretien-bloc .es-rdv-bouton{grid-column:auto;width:auto;padding:0 20px;margin:0}}
/* l'offre du moment (le client et le bureau voient la même) */
/* une carte claire et nette : bandeau rouge « Offre du moment », grande icône aux couleurs AK, titre bien lisible, bouton orangé qui se voit tout de suite */
.offre{position:relative;isolation:isolate;overflow:hidden;margin:0 0 16px;padding:0;border-radius:20px;border:2px solid transparent;color:var(--texte);
  background:linear-gradient(var(--carte),var(--carte)) padding-box,linear-gradient(135deg,#2E3193 0%,#00ADEF 55%,#E4442A 100%) border-box;box-shadow:0 22px 40px -30px rgba(228,68,42,.85)}
.offre::before{content:"";position:absolute;z-index:-1;width:300px;height:300px;right:-120px;bottom:-150px;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,#00ADEF 16%,transparent),transparent)}
.offre::after{content:"";position:absolute;z-index:-1;width:220px;height:220px;left:-90px;top:30px;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,#E4442A 10%,transparent),transparent)}
.offre-haut{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 12px;padding:10px 16px;color:#fff;background:linear-gradient(90deg,#E4442A 0%,#F26B1D 100%)}
.offre-ruban{display:inline-flex;align-items:center;gap:8px;font:800 16px var(--mono);letter-spacing:1.5px;text-transform:uppercase}
.offre-fin{font-size:16px;font-weight:600;color:#fff}
.offre-corps{display:flex;gap:16px;align-items:center;padding:18px 18px 6px}
.offre-icone{flex:0 0 auto;width:76px;height:76px;display:grid;place-items:center;font-size:40px;line-height:1;border-radius:22px;
  background:linear-gradient(135deg,#2E3193 0%,#00ADEF 100%);box-shadow:0 14px 26px -14px #00ADEF,inset 0 0 0 3px rgba(255,255,255,.35)}
.offre-txt{min-width:0}
.espace .offre .offre-titre,.offre .offre-titre{display:block;margin:0 0 6px;font-size:23px;line-height:1.2;font-weight:800;color:var(--texte)}
.offre-txt p{margin:0;font-size:16px;line-height:1.5;color:var(--texte);opacity:.85}
.offre-pied{display:flex;flex-wrap:wrap;gap:4px 18px;align-items:center;padding:12px 18px 16px}
.offre .offre-bouton{width:auto;min-height:56px;padding:0 24px;font-size:17px;color:#fff;border-color:transparent;background:linear-gradient(135deg,#E4442A 0%,#F26B1D 100%);box-shadow:0 14px 24px -14px #E4442A}
.offre .offre-bouton:hover{filter:brightness(1.06)}
.offre-conditions>summary{cursor:pointer;min-height:48px;display:inline-flex;align-items:center;font-weight:700;font-size:16px;color:var(--primaire);text-decoration:underline;text-underline-offset:3px}
:root[data-theme="dark"] .offre-conditions>summary{color:#8FD8FF}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .offre-conditions>summary{color:#8FD8FF}}
.offre-conditions p{margin:6px 0 0;font-size:16px;line-height:1.5;padding:12px 14px;border-radius:12px;background:var(--champ);border:1px solid var(--trait)}
.offre-conditions[open]{flex:1 1 100%}
.offre-grande .offre-titre{font-size:27px}
.offre-grande .offre-icone{width:88px;height:88px;font-size:46px}
@media (max-width:480px){.offre-corps{align-items:flex-start}.offre-icone{width:64px;height:64px;font-size:34px;border-radius:18px}.offre .offre-bouton{width:100%}.offre-conditions{width:100%;text-align:center}}
/* le dossier de l'installation (progression) */
.es-dossier-tete{display:flex;align-items:center;justify-content:space-between;gap:10px}
.es-dossier-tete h2{margin:0}
.es-pct{font:800 24px var(--mono);color:var(--texte)}
.es-jauge{height:12px;border-radius:999px;background:var(--champ);border:1px solid var(--trait);overflow:hidden;margin:10px 0 8px}
.es-jauge i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#2E3193,#00ADEF 60%,#E4442A)}
.es-etapes{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:10px}
.es-etapes li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px 12px;align-items:center;padding:12px;border-radius:14px;background:var(--champ);border:1px solid var(--trait)}
.es-etapes li>i{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-weight:800;color:#fff;border:2px solid var(--trait);background:var(--carte)}
.es-etapes li.fait>i{background:#1D9A6C;border-color:#1D9A6C}
.es-etapes span{display:flex;flex-direction:column;min-width:0}
.es-etapes small{font-size:16px;color:var(--gris);line-height:1.35}
.es-etapes .bouton{grid-column:1/-1;min-height:48px}
@media (min-width:700px){.es-etapes li{grid-template-columns:auto minmax(0,1fr) auto}.es-etapes .bouton{grid-column:auto;width:auto;padding:0 18px}}
/* les raccourcis */
.es-tuiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:0 0 16px}
@media (min-width:900px){.es-tuiles{grid-template-columns:repeat(4,minmax(0,1fr))}}
.es-tuile{position:relative;display:flex;flex-direction:column;gap:4px;min-height:136px;padding:14px;border-radius:16px;text-decoration:none;color:var(--texte);border:2px solid transparent;
  background:linear-gradient(160deg,color-mix(in srgb,var(--tc) 14%,var(--carte)),var(--carte) 70%) padding-box,linear-gradient(135deg,#2E3193 0%,#00ADEF 55%,#E4442A 100%) border-box;box-shadow:0 12px 26px -22px var(--tc);transition:transform .12s,box-shadow .15s}
.es-tuile:hover{transform:translateY(-2px);box-shadow:0 16px 28px -20px var(--tc)}
.es-tuile i{font-style:normal;font-size:24px;width:46px;height:46px;display:grid;place-items:center;border-radius:14px;background:color-mix(in srgb,var(--tc) 18%,var(--carte));margin:0 0 4px}
.es-tuile b{font-size:17px;line-height:1.2}
.es-tuile small{font-size:16px;color:var(--gris);line-height:1.3;padding-right:10px}
.es-chevron{position:absolute;right:12px;top:12px;font-size:26px;line-height:1;font-weight:700;color:var(--tc)}
/* nos engagements */
.es-engagements ul{list-style:none;margin:0;padding:0;display:grid;gap:12px}
@media (min-width:700px){.es-engagements ul{grid-template-columns:1fr 1fr}}
.es-engagements li{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-areas:"ic t" "ic s";gap:2px 12px;align-items:start;padding:12px;border-radius:14px;background:var(--champ);border:1px solid var(--trait);box-shadow:inset 4px 0 0 var(--ec)}
.es-engagements i{grid-area:ic;font-style:normal;font-size:22px;width:44px;height:44px;display:grid;place-items:center;border-radius:12px;background:color-mix(in srgb,var(--ec) 16%,var(--carte))}
.es-engagements b{grid-area:t;font-size:17px}
.es-engagements span{grid-area:s;font-size:16px;color:var(--gris);line-height:1.4}
/* qui nous sommes */
.es-societe{text-align:center;margin:24px 0 8px;padding:18px 12px 0;border-top:1px solid var(--trait);color:var(--gris);font-size:16px}
.es-societe img{width:120px;height:auto;background:#fff;border-radius:10px;padding:6px 10px}
.es-societe p{margin:6px 0}
.es-societe a{font-weight:600}
/* le titre de chaque écran */
.es-titre{padding:20px 18px}
.es-titre .eyebrow{margin:0 0 4px}
.es-titre h1{margin:0 0 6px;font-size:30px;line-height:1.1;background:linear-gradient(90deg,#4B50D6 0%,#00ADEF 55%,#FF8A5B 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
:root[data-theme="dark"] .es-titre h1{background:linear-gradient(90deg,#8F94FF 0%,#4FC9FF 55%,#FF9E72 100%);-webkit-background-clip:text;background-clip:text}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .es-titre h1{background:linear-gradient(90deg,#8F94FF 0%,#4FC9FF 55%,#FF9E72 100%);-webkit-background-clip:text;background-clip:text}}
.es-sous{margin:0;color:var(--gris);font-size:16px}
/* l'équipement */
.es-conseil{margin:0 0 16px}
.es-eq-tete{display:flex;align-items:center;gap:12px;margin:0 0 14px}
.espace .es-eq-tete h2{margin:0;display:block;overflow-wrap:anywhere}
.es-eq-tete .eyebrow{margin:0 0 2px;color:var(--c)}
.es-eq-icone{width:54px;height:54px;flex:0 0 auto;display:grid;place-items:center;font-size:26px;border-radius:16px;background:color-mix(in srgb,var(--c) 16%,var(--carte));border:1.5px solid color-mix(in srgb,var(--c) 45%,transparent)}
.es-eq-etat{margin-left:auto;align-self:flex-start;font-weight:700;font-size:16px;padding:4px 12px;border-radius:999px;background:color-mix(in srgb,#F2A33A 18%,var(--carte));color:color-mix(in srgb,#B06A00 80%,var(--texte));white-space:nowrap}
.es-eq-etat.complet{background:var(--ok-fond);color:var(--ok)}
.es-infos div{background:var(--champ);border:1px solid var(--trait);border-radius:12px;padding:8px 10px}
.es-remarque{margin:10px 0 0;padding:10px 12px;border-radius:12px;background:var(--info-fond);font-size:16px}
.es-releve-note{margin-top:10px}
.es-photos-titre{font-size:18px;margin:20px 0 10px}
.es-photos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
@media (min-width:600px){.es-photos{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:900px){.es-photos{grid-template-columns:repeat(4,minmax(0,1fr))}}
.es-photo{position:relative;margin:0;border-radius:14px;overflow:hidden;min-height:180px}
.es-photo.pleine{border:1px solid var(--trait);background:var(--champ)}
.es-photo.pleine img{display:block;width:100%;height:132px;object-fit:cover;background:var(--trait)}
.es-photo figcaption{display:flex;flex-direction:column;padding:8px 10px}
.es-photo figcaption b{font-size:16px;line-height:1.25}
.es-photo figcaption small{font-size:16px;color:var(--gris)}
.es-photo form{margin:0}
.es-photo-retirer{position:absolute;top:6px;right:6px;width:48px;height:48px;border-radius:50%;border:0;background:rgba(255,255,255,.94);color:#C0341F;font-size:17px;font-weight:800;cursor:pointer;box-shadow:0 4px 12px rgba(18,32,58,.3)}
.es-photo-retirer:hover{background:#E4442A;color:#fff}
.es-eq-tete{flex-wrap:wrap}
.es-eq-tete>div{flex:1 1 170px;min-width:0}
.es-photo.vide{border:2px dashed color-mix(in srgb,var(--c) 55%,var(--trait));background:color-mix(in srgb,var(--c) 6%,var(--carte))}
.es-photo.vide:focus-within{outline:3px solid var(--focus);outline-offset:2px}
.es-photo.vide:hover{background:color-mix(in srgb,var(--c) 12%,var(--carte))}
.es-photo-ajout{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:4px;min-height:180px;margin:0;padding:12px 10px;cursor:pointer;font-weight:400}
.es-photo-ajout input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.es-photo-ajout i{font-style:normal;font-size:26px;width:52px;height:52px;display:grid;place-items:center;border-radius:50%;background:color-mix(in srgb,var(--c) 18%,var(--carte));margin:0 0 4px}
.es-photo-ajout b{font-size:16px;line-height:1.25}
.es-photo-ajout small{font-size:16px;color:var(--gris);line-height:1.3}
.es-photo-etat{font-weight:700;font-size:16px;color:var(--primaire)}
.es-photo.envoi{opacity:.75}
.es-photo.erreur{border-color:var(--rouge)}
.es-photo.erreur .es-photo-etat{color:var(--rouge)}
.es-eq-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px;align-items:flex-start}
.es-eq-actions>*{flex:1 1 240px}
.es-modifier>summary{list-style:none;cursor:pointer}
.es-modifier>summary::-webkit-details-marker{display:none}
.es-modifier[open]>summary{margin-bottom:6px}
.es-types{border:0;padding:0;margin:0 0 4px;display:grid;gap:10px}
.es-types legend{font-weight:600;font-size:16px;margin:14px 0 8px;padding:0}
@media (min-width:760px){.es-types{grid-template-columns:repeat(3,minmax(0,1fr))}}
.es-type{margin:0;font-weight:400;position:relative}
.es-type input{position:absolute;opacity:0;width:1px;height:1px}
.es-type-carte{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-areas:"ic t" "ic s";gap:2px 10px;align-items:center;min-height:76px;padding:12px;border-radius:14px;border:2px solid var(--trait);background:var(--champ);cursor:pointer}
.es-type-carte i{grid-area:ic;font-style:normal;font-size:24px;width:46px;height:46px;display:grid;place-items:center;border-radius:12px;background:color-mix(in srgb,var(--c) 16%,var(--carte))}
.es-type-carte b{grid-area:t;font-size:16px}
.es-type-carte small{grid-area:s;font-size:16px;color:var(--gris);line-height:1.3}
.es-type input:checked+.es-type-carte{border-color:var(--c);background:color-mix(in srgb,var(--c) 10%,var(--carte));box-shadow:0 0 0 2px var(--c) inset}
.es-type input:focus-visible+.es-type-carte{outline:3px solid var(--focus);outline-offset:2px}
.es-valider{margin-top:16px}
.en-apercu [disabled]{opacity:.55;cursor:not-allowed}
/* les documents */
.es-filtres{display:flex;gap:8px;overflow-x:auto;margin:0 0 14px;padding:0 0 4px;scrollbar-width:none}
.es-filtre{flex:0 0 auto;min-height:48px;padding:0 16px;border-radius:999px;border:1.5px solid var(--trait);background:var(--champ);color:var(--texte);font:600 16px var(--ui);cursor:pointer}
.es-filtre.actif{background:var(--primaire);border-color:var(--primaire);color:#fff}
.espace-dossier[hidden]{display:none}
.es-par{margin:0 0 4px;font-size:16px;color:var(--gris)}
.espace-dossier .docs a{font-weight:600;overflow-wrap:anywhere}
/* prendre rendez-vous */
.es-rdv-form fieldset{border:0;padding:0;margin:0;min-width:0}
.es-cal{display:grid;gap:12px;margin:12px 0 0}
@media (min-width:760px){.es-cal{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}}
.es-cal-mois{padding:12px 10px;border-radius:14px;background:var(--champ);border:1px solid var(--trait)}
.es-cal-titre{margin:0 0 8px;font-weight:700;text-align:center;font-size:17px}
.es-cal-grille{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}
.es-cal-ent{text-align:center;font-size:16px;font-weight:600;color:var(--gris);padding:2px 0}
.es-jour{margin:0;position:relative;display:block;font-weight:600}
.es-jour input{position:absolute;opacity:0;width:1px;height:1px}
.es-jour span{display:grid;place-items:center;height:48px;border-radius:12px;border:1.5px solid color-mix(in srgb,#00ADEF 35%,var(--trait));background:var(--carte);cursor:pointer;font:700 16px var(--mono);color:var(--texte)}
.es-jour span:hover{border-color:#00ADEF}
.es-jour input:checked+span{background:linear-gradient(135deg,#2E3193,#00ADEF);color:#fff;border-color:transparent;box-shadow:0 8px 16px -10px #00ADEF}
.es-jour input:focus-visible+span{outline:3px solid var(--focus);outline-offset:1px}
.es-jour.off{display:grid;place-items:center;height:48px;font:600 16px var(--mono);color:color-mix(in srgb,var(--gris) 50%,transparent)}
.es-creneaux{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:14px!important}
.es-creneaux legend{font-weight:600;font-size:16px;margin:0 0 8px;padding:0}
.es-creneau{margin:0;position:relative;font-weight:400}
.es-creneau input{position:absolute;opacity:0;width:1px;height:1px}
.es-creneau>span{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:2px;min-height:92px;padding:8px 6px;border-radius:14px;border:2px solid var(--trait);background:var(--champ);cursor:pointer}
.es-creneau i{font-style:normal;font-size:22px}
.es-creneau b{font-size:16px}
.es-creneau small{font-size:16px;color:var(--gris);line-height:1.2}
.es-creneau input:checked+span{border-color:#00ADEF;background:color-mix(in srgb,#00ADEF 10%,var(--carte));box-shadow:0 0 0 2px #00ADEF inset}
.es-creneau input:focus-visible+span{outline:3px solid var(--focus);outline-offset:2px}
.es-rdv-fixe{display:flex;gap:12px;align-items:center;padding:14px;margin:0 0 14px;border-radius:14px;background:var(--ok-fond);border:1px solid color-mix(in srgb,var(--ok) 35%,transparent)}
.es-rdv-fixe.attente{background:var(--info-fond);border-color:color-mix(in srgb,var(--cyan) 40%,transparent)}
.es-rdv-fixe>i{font-style:normal;font-size:28px}
.es-rdv-fixe div{display:flex;flex-direction:column;gap:2px}
.es-rdv-fixe small{font-size:16px;color:var(--gris)}
.es-rdv form{margin-top:12px}
/* mon entretien */
.es-conseille{margin:0 0 4px;font-size:17px}
.espace .es-h2-sep{margin:6px 0 12px}
.es-deroule{list-style:none;counter-reset:e;margin:0;padding:0;display:grid;gap:10px}
.es-deroule li{counter-increment:e;position:relative;display:flex;flex-direction:column;padding:10px 12px 10px 58px;min-height:56px;justify-content:center;border-radius:14px;background:var(--champ);border:1px solid var(--trait)}
.es-deroule li::before{content:counter(e);position:absolute;left:12px;top:50%;transform:translateY(-50%);width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font:800 16px var(--mono);color:#fff;background:linear-gradient(135deg,#2E3193,#00ADEF)}
.es-deroule span{font-size:16px;color:var(--gris)}
.es-formules-liste{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:12px 0}
@media (min-width:800px){.es-formules-liste{grid-template-columns:repeat(4,minmax(0,1fr))}}
.es-formules-liste>div{display:flex;flex-direction:column;gap:2px;padding:12px;border-radius:14px;border:1.5px solid color-mix(in srgb,var(--fc) 45%,var(--trait));border-top:4px solid var(--fc);background:linear-gradient(160deg,color-mix(in srgb,var(--fc) 10%,var(--carte)),var(--carte) 70%)}
.es-formules-liste small{font-size:16px;color:var(--gris)}
.es-formules-liste span{font:800 20px var(--mono);margin-top:4px}
.es-formules-liste span small{font:600 16px var(--ui)}
.es-lien-tarifs{width:auto;padding:0 22px;margin:0 0 16px}
.es-contrat.en-cours{box-shadow:inset 5px 0 0 #1D9A6C}
.es-frise{list-style:none;margin:0;padding:0}
.es-frise li{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px 0;border-top:1px solid var(--trait)}
.es-frise li:first-child{border-top:0}
.es-frise i{font-style:normal;width:42px;height:42px;display:grid;place-items:center;border-radius:12px;background:var(--champ);border:1px solid var(--trait)}
.es-frise div{display:flex;flex-direction:column;min-width:0}
.es-frise small{font-size:16px;color:var(--gris)}
.es-frise a{min-height:48px;display:inline-flex;align-items:center;font-weight:700;padding:0 6px}
.es-conseil-famille{border:1px solid var(--trait);border-radius:14px;margin:0 0 10px;background:var(--champ);box-shadow:inset 4px 0 0 var(--c)}
.es-conseil-famille>summary{min-height:52px;display:flex;align-items:center;gap:10px;padding:0 14px 0 16px;font-weight:700;cursor:pointer}
.es-conseil-famille>summary i{font-style:normal}
.es-conseil-famille ul{margin:0;padding:0 16px 12px 38px}
.es-conseil-famille li{margin:6px 0;font-size:16px}
.es-panne .es-appel{margin-top:14px;color:#fff;border-color:transparent;background:linear-gradient(135deg,#E4442A,#F26B1D)}
/* parrainage */
.es-accord{align-items:flex-start}
.es-accord input{flex:0 0 auto;margin-top:2px}
.es-parr-liste{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.es-parr-liste li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px 12px;align-items:center;padding:12px;border-radius:14px;background:var(--champ);border:1px solid var(--trait);box-shadow:inset 4px 0 0 var(--sc)}
.es-parr-liste .avatar{width:44px;height:44px;font-size:16px;background:var(--sc)}
.es-parr-liste div{display:flex;flex-direction:column;min-width:0}
.es-parr-liste small{font-size:16px;color:var(--gris)}
.es-parr-etat{grid-column:1/-1;justify-self:start;font-weight:700;font-size:16px;padding:4px 12px;border-radius:999px;background:color-mix(in srgb,var(--sc) 14%,var(--carte));color:color-mix(in srgb,var(--sc) 70%,var(--texte))}
@media (min-width:600px){.es-parr-liste li{grid-template-columns:auto minmax(0,1fr) auto}.es-parr-etat{grid-column:auto}}
/* l'aperçu du bureau */
.es-apercu{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;padding:12px 14px;margin:0 0 16px;border-radius:14px;background:#FFF3D6;color:#5A3A00;border:1.5px solid #F2A33A;font-size:16px}
.es-apercu .bouton{width:auto;min-height:48px;padding:0 16px}
:root[data-theme="dark"] .es-apercu{background:#3A2C0E;color:#FFD68A}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .es-apercu{background:#3A2C0E;color:#FFD68A}}
.es-retour{width:auto;padding:0 22px}

/* ============================================================
   Bureau : l'onglet « Espaces clients » — liste compacte (un appui ouvre le client), rendez-vous demandés, parrainages, offre
   ============================================================ */
.ec-alerte{display:flex;flex-wrap:wrap;gap:8px 10px;align-items:center;margin:14px 0 0;padding:10px 12px;border-radius:14px;background:color-mix(in srgb,#E4442A 10%,var(--carte));border:1.5px solid color-mix(in srgb,#E4442A 50%,transparent)}
.ec-alerte>b{font-size:16px;margin-right:4px}
.ec-alerte a{display:inline-flex;align-items:center;min-height:48px;padding:0 14px;border-radius:999px;background:var(--carte);border:1.5px solid color-mix(in srgb,#E4442A 45%,var(--trait));font-weight:700;text-decoration:none;color:var(--texte)}
.ec-onglets{margin:0 0 14px}
.onglets .onglet b.ec-en-ligne{background:#1D9A6C;color:#fff}
.onglets .onglet b.ec-hors-ligne{background:var(--champ);color:var(--gris)}
.onglets .onglet b.ec-a-traiter{background:#E4442A;color:#fff}
.ec-outils{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;margin:4px 0 2px}
.ec-outils .recherche-ec{margin:0}
.ec-tri select{min-height:56px;min-width:200px}
@media (max-width:560px){.ec-outils{grid-template-columns:1fr}.ec-tri select{min-width:0}}
.ec-liste{display:grid;gap:8px;margin:0 0 16px}
@media (min-width:1000px){.ec-liste{grid-template-columns:1fr 1fr}}
.ec-ligne{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"av id vu" "av res res";gap:6px 12px;align-items:center;padding:10px 40px 10px 14px;border-radius:14px;text-decoration:none;color:var(--texte);border:1.5px solid transparent;
  background:linear-gradient(var(--carte),var(--carte)) padding-box,linear-gradient(135deg,#2E3193 0%,#00ADEF 55%,#E4442A 100%) border-box;box-shadow:inset 5px 0 0 var(--c);transition:transform .12s,box-shadow .15s}
.ec-ligne:hover{transform:translateY(-1px);box-shadow:inset 5px 0 0 var(--c),0 12px 24px -20px var(--c)}
.ec-ligne[hidden]{display:none}
.ec-av{grid-area:av;width:46px;height:46px;font-size:16px;background:var(--c);box-shadow:0 6px 14px -8px var(--c)}
.ec-id{grid-area:id;display:flex;flex-direction:column;min-width:0}
.ec-id b{font-size:17px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ec-id small{font-size:16px;color:var(--gris);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ec-vu{grid-area:vu;font-size:16px;color:var(--gris);white-space:nowrap}
.ec-ligne .ec-resume{grid-area:res;display:flex;flex-wrap:wrap;gap:6px;padding:0;margin:0}
.ec-ligne .ec-resume>span{min-height:30px;padding:0 10px;font-size:16px}
.ec-ligne .ec-resume .etat{font-weight:700;border:0;background:color-mix(in srgb,var(--c) 16%,var(--carte));color:color-mix(in srgb,var(--c) 70%,var(--texte))}
.ec-ligne .ec-resume .ec-nouveau{background:color-mix(in srgb,#00ADEF 16%,var(--carte));border-color:#00ADEF;font-weight:700}
.ec-ligne .ec-vu-m{display:none}
.ec-chevron{position:absolute;right:12px;top:50%;transform:translateY(-50%);font-size:28px;line-height:1;font-weight:700;color:var(--c)}
@media (max-width:560px){.ec-ligne{grid-template-columns:auto minmax(0,1fr);grid-template-areas:"av id" "av res"}.ec-vu,.ec-ligne .ec-fiche{display:none}.ec-ligne .ec-vu-m{display:inline-flex}}
/* la fiche d'un espace client */
.ec-fil{margin:0 0 8px}
.ec-fil a{display:inline-flex;align-items:center;min-height:48px;font-weight:700}
.ec-fiche-tete{display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.ec-fiche-tete>div{flex:1 1 220px;min-width:0}
.ec-fiche-tete h1{margin:0}
.ec-fiche-tete .eyebrow{margin:0 0 2px}
.ec-av.grand{width:64px;height:64px;font-size:22px}
.ec-coord{margin:4px 0 0;font-size:16px;overflow-wrap:anywhere}
.ec-fiche .ec-etat{font-weight:700;border:0;background:color-mix(in srgb,var(--c) 16%,var(--carte));color:color-mix(in srgb,var(--c) 70%,var(--texte))}
.ec-chiffres{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:16px 0}
.ec-chiffres div{text-align:center;padding:10px 4px;border-radius:12px;background:var(--champ);border:1px solid var(--trait)}
.ec-chiffres b{display:block;font:800 24px var(--mono)}
.ec-chiffres span{font-size:16px;color:var(--gris)}
.ec-fiche .ec-aide{margin:12px 0 0}
.ec-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}
@media (min-width:900px){.ec-actions{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:400px){.ec-actions{grid-template-columns:1fr}}
.ec-actions .bouton,.ec-actions form{width:100%;margin:0}
.ec-actions .bouton{min-height:52px}
.ec-eq{padding:12px;margin:0 0 12px;border-radius:14px;background:var(--champ);border:1px solid var(--trait);box-shadow:inset 5px 0 0 var(--c)}
.ec-eq-titre{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin:0 0 10px;padding-left:6px}
.ec-eq-titre small{font-size:16px;color:var(--gris)}
.ec-eq .es-infos div{background:var(--carte)}
.ec-photos{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px;margin-top:10px}
.ec-photos a{display:block;border-radius:12px;overflow:hidden;border:1px solid var(--trait);background:var(--carte);text-decoration:none;color:var(--texte)}
.ec-photos img{display:block;width:100%;height:110px;object-fit:cover}
.ec-photos small{display:block;padding:6px 8px;font-size:16px;line-height:1.2}
.ec-activite{list-style:none;margin:0;padding:0}
.ec-activite li{display:grid;gap:2px;padding:10px 0;border-top:1px solid var(--trait)}
.ec-activite li:first-child{border-top:0}
.ec-activite span{font-size:16px}
.ec-activite small{font-size:16px;color:var(--gris)}
.ec-rdv-fixe{margin:0 0 12px}
/* parrainages et rendez-vous demandés */
.ec-explique{margin:0 0 12px}
.ec-parr{list-style:none;margin:0;padding:0;display:grid;gap:12px}
@media (min-width:1000px){.ec-parr{grid-template-columns:1fr 1fr}}
.ec-parr-carte{padding:12px;border-radius:14px;background:var(--champ);border:1px solid var(--trait);box-shadow:inset 5px 0 0 var(--sc)}
.ec-parr-tete{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding-left:4px}
.ec-parr-tete .avatar{width:46px;height:46px;font-size:16px;background:var(--sc)}
.ec-parr-tete>div{display:flex;flex-direction:column;min-width:0;flex:1 1 160px}
.ec-parr-tete small{font-size:16px;overflow-wrap:anywhere}
.ec-parr-etat{font-weight:700;font-size:16px;padding:4px 12px;border-radius:999px;background:color-mix(in srgb,var(--sc) 14%,var(--carte));color:color-mix(in srgb,var(--sc) 70%,var(--texte))}
.ec-parr-infos{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 0;padding-left:4px}
.ec-parr-infos span{font-size:16px;padding:4px 10px;border-radius:999px;background:var(--carte);border:1px solid var(--trait)}
.ec-parr-msg{margin:10px 0 0 4px;font-style:italic;font-size:16px}
.ec-parr-suivi{display:grid;grid-template-columns:1fr;gap:8px;margin-top:12px}
@media (min-width:600px){.ec-parr-suivi{grid-template-columns:minmax(0,190px) minmax(0,1fr) auto}}
.ec-parr-suivi .bouton{width:auto;padding:0 18px}
.ec-date-bulle{display:grid;place-items:center;align-content:center;width:62px;height:62px;border-radius:16px;background:var(--sc);color:#fff;line-height:1.05;flex:0 0 auto}
.ec-date-bulle b{font:800 22px var(--mono)}
.ec-date-bulle small{font-size:16px}
.ec-demande-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}
.ec-demande-actions .bouton,.ec-demande-actions form{width:100%;margin:0}
.ec-demande-actions .bouton{min-height:52px}
@media (max-width:420px){.ec-demande-actions{grid-template-columns:1fr}}
/* l'offre, côté bureau */
.ec-offre-tete{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;margin:0 0 10px}
.ec-offre-tete h2{margin:0}
.ec-offre-tete .bouton{width:auto;padding:0 18px}
.ec-offres-liste{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.ec-offres-liste li{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px 12px;align-items:center;padding:12px;border-radius:14px;background:var(--champ);border:1px solid var(--trait)}
.ec-offres-liste li.en-ligne{box-shadow:inset 5px 0 0 #1D9A6C;border-color:color-mix(in srgb,#1D9A6C 50%,var(--trait))}
.ec-offre-icone{font-size:26px;width:50px;height:50px;display:grid;place-items:center;border-radius:14px;background:var(--carte);border:1px solid var(--trait)}
.ec-offre-txt{display:flex;flex-direction:column;min-width:0}
.ec-offre-txt small{font-size:16px;color:var(--gris)}
.ec-offre-etat{font-weight:700;font-size:16px;padding:4px 12px;border-radius:999px;background:var(--carte);border:1px solid var(--trait);white-space:nowrap}
.ec-offres-liste li.en-ligne .ec-offre-etat{background:var(--ok-fond);color:var(--ok);border-color:transparent}
.ec-offre-actions{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:8px}
.ec-offre-actions .bouton{width:auto;min-height:48px;padding:0 16px}
.ec-offre-actions form{margin:0}
.ec-offre-grille{display:grid;gap:18px}
@media (min-width:1000px){.ec-offre-grille{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);align-items:start}.ec-offre-apercu{position:sticky;top:90px}}
.ec-icones{border:0;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:8px}
.ec-icones legend{font-weight:600;font-size:16px;margin:0 0 8px;padding:0}
.ec-icones label{margin:0;position:relative}
.ec-icones input{position:absolute;opacity:0;width:1px;height:1px}
.ec-icones span[aria-hidden]{display:grid;place-items:center;width:52px;height:52px;border-radius:14px;border:2px solid var(--trait);background:var(--champ);font-size:26px;cursor:pointer}
.ec-icones input:checked+span{border-color:#2E3193;background:color-mix(in srgb,#2E3193 12%,var(--carte));box-shadow:0 0 0 2px #2E3193 inset}
.ec-icones input:focus-visible+span{outline:3px solid var(--focus);outline-offset:2px}
.ec-offre-boutons{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.ec-offre-boutons .bouton{width:auto;padding:0 22px}
.ec-offre-apercu .offre{margin:0}

/* mode sombre : la couleur des liens ne doit jamais s'appliquer aux boutons pleins ni aux cartes-liens de l'espace client et de l'onglet Espaces clients */
:root[data-theme="dark"] :is(.espace,.es-apercu,.ec-tete,.ec-alerte,.ec-liste,.ec-fiche,.ec-bloc,.ec-offres,.ec-offre-edit,.ec-offre-actuelle) a.bouton:not(.creux){color:#fff}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) :is(.espace,.es-apercu,.ec-tete,.ec-alerte,.ec-liste,.ec-fiche,.ec-bloc,.ec-offres,.ec-offre-edit,.ec-offre-actuelle) a.bouton:not(.creux){color:#fff}}
:root[data-theme="dark"] :is(.es-tuiles a.es-tuile,.ec-liste a.ec-ligne,.ec-alerte a){color:var(--texte)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) :is(.es-tuiles a.es-tuile,.ec-liste a.ec-ligne,.ec-alerte a){color:var(--texte)}}
/* l'offre : l'icône et le titre côte à côte, le texte en pleine largeur dessous */
.offre-corps{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px 16px;align-items:center}
.offre-txt{display:contents}
.espace .offre .offre-titre,.offre .offre-titre{grid-column:2;margin:0}
.offre-txt p{grid-column:1/-1}
@media (min-width:700px){.offre-txt p{grid-column:2}}
@media (max-width:480px){.espace .offre .offre-titre,.offre .offre-titre{font-size:20px}.offre-haut{padding:10px 14px}}
.ec-activite-plus>summary{list-style:none;cursor:pointer;margin-top:10px}
.ec-activite-plus>summary::-webkit-details-marker{display:none}
.ec-activite-plus[open]>summary{margin-bottom:6px}
/* téléphone : les petites cartes d'état gardent des mots entiers (icône au-dessus du texte) */
.es-statuts b{overflow-wrap:normal}
@media (max-width:520px){.es-statuts li{flex-direction:column;align-items:flex-start;gap:8px;padding:10px}.es-statuts i{width:36px;height:36px;font-size:18px;border-radius:10px}}
/* téléphone : des lignes serrées, les pastilles sur une seule ligne */
@media (max-width:560px){.ec-ligne{padding:8px 34px 8px 10px;gap:4px 10px}.ec-av{width:40px;height:40px}.ec-ligne .ec-resume{flex-wrap:nowrap;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent);mask-image:linear-gradient(90deg,#000 88%,transparent)}.ec-ligne .ec-resume>span{flex:0 0 auto;min-height:28px;padding:0 8px}}
/* ---------- relecture : lisibilité (contrastes), cases tactiles, calendrier dans l'étiquette ---------- */
/* les rouges-orangés portent du texte blanc : un dégradé plus soutenu (contraste ≥ 4,5:1) */
.offre-haut{background:linear-gradient(90deg,#C23A22 0%,#CC4B16 100%)}
.entretien-bloc .es-rdv-bouton:not(.creux),.offre .offre-bouton,.es-panne .es-appel{background:linear-gradient(135deg,#C23A22 0%,#CC4B16 100%)}
.offre .offre-bouton[hidden]{display:none}
/* libellés d'état teintés : plus sombres en clair, plus clairs en sombre */
.es-parr-etat,.ec-parr-etat,.es-statuts .es-statut-plus{color:color-mix(in srgb,var(--sc) 45%,var(--texte))}
.ec-ligne .ec-resume .etat,.ec-fiche .ec-etat{color:color-mix(in srgb,var(--c) 45%,var(--texte))}
:root[data-theme="dark"] .es-eq-etat:not(.complet){color:#FFD68A}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .es-eq-etat:not(.complet){color:#FFD68A}}
.ec-date-bulle,.es-parr-liste .avatar,.ec-parr-tete .avatar{background:color-mix(in srgb,var(--sc) 60%,#12203A)}
.ec-parr-filtres .onglet b{background:color-mix(in srgb,var(--oc) 60%,#12203A)}
.onglets .onglet b.ec-en-ligne{background:#146B4B}
.onglets .onglet b.ec-a-traiter{background:#C23A22}
.nav-app .pastille-nav{font-size:16px}
/* les titres en dégradé : plus soutenus en mode clair */
.espace-hero h1,.es-titre h1{background:linear-gradient(90deg,#2E3193 0%,#0077B6 55%,#C23A22 100%);-webkit-background-clip:text;background-clip:text}
:root[data-theme="dark"] :is(.espace-hero,.es-titre) h1{background:linear-gradient(90deg,#8F94FF 0%,#4FC9FF 55%,#FF9E72 100%);-webkit-background-clip:text;background-clip:text}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) :is(.espace-hero,.es-titre) h1{background:linear-gradient(90deg,#8F94FF 0%,#4FC9FF 55%,#FF9E72 100%);-webkit-background-clip:text;background-clip:text}}
/* le calendrier : six colonnes, du lundi au samedi (cases de 48 px sur téléphone) */
.es-cal-grille{grid-template-columns:repeat(6,minmax(0,1fr));gap:3px}
@media (max-width:420px){.es-cal-mois{padding:10px 4px}}
/* des zones tactiles de 48 px pour les liens importants */
.espace-dossier .docs a{display:inline-flex;align-items:center;gap:6px;min-height:48px}
.ec-parr-tete small a,.ec-parr-infos a{display:inline-flex;align-items:center;min-height:48px}
/* la fiche d'un espace, au téléphone : les compteurs sur deux colonnes */
@media (max-width:560px){.ec-chiffres{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* la liste des offres, au téléphone */
@media (max-width:560px){.ec-offres-liste li{grid-template-columns:auto minmax(0,1fr)}.ec-offre-etat{grid-column:2;justify-self:start;white-space:normal}}
/* l'alerte du bureau sous la barre de navigation (tableau de bord) */
.nav-app+.ec-alerte{margin:0 0 14px}
/* « Prendre mon rendez-vous » dans l'étiquette : le bouton, puis le calendrier qui se déplie en dessous */
.entretien-bloc>.es-rdv-deplie{grid-column:1/-1;min-width:0}
.es-rdv-deplie>summary{list-style:none;cursor:pointer;width:100%}
.es-rdv-deplie>summary::-webkit-details-marker{display:none}
.es-rdv-deplie[open]>summary{margin-bottom:12px}
.es-rdv-dans{padding:12px;border-radius:14px;background:var(--carte);border:1px solid var(--trait)}
.es-rdv-dans .es-cal{margin-top:0}
@media (min-width:700px){.entretien-bloc>.es-rdv-deplie>summary{width:auto;padding:0 22px}}.es-pct{white-space:nowrap}

/* ---------- l'en-tête de l'espace client, comme l'accueil des techniciens : bandeau sombre fumé, liseré tricolore, logo ---------- */
.espace-hero.es-couverture{position:relative;isolation:isolate;overflow:hidden;margin:0 0 14px;padding:26px 20px 22px;text-align:center;border-radius:18px;color:#F2F6FB;
  background:linear-gradient(160deg,#172B4E 0%,#12203A 55%,#0D182C 100%);border:1px solid rgba(255,255,255,.09);box-shadow:0 22px 44px -26px rgba(18,32,58,.7)}
.espace-hero.es-couverture::before{content:"";position:absolute;left:0;right:0;top:0;width:auto;height:4px;z-index:2;border-radius:0;background:linear-gradient(90deg,#2E3193 0%,#00ADEF 55%,#E4442A 100%)}
.espace-hero.es-couverture::after{content:"";position:absolute;z-index:-1;width:420px;height:420px;left:auto;right:-170px;top:-190px;bottom:auto;border-radius:50%;background:radial-gradient(closest-side,rgba(0,173,239,.30),rgba(0,173,239,0))}
.es-couv-logo{display:block;height:70px;width:auto;max-width:100%;margin:4px auto 16px;background:#fff;border-radius:14px;padding:8px 18px;box-shadow:0 14px 30px -14px rgba(0,0,0,.75)}
.es-couv-eyebrow{margin:0 0 6px;font:600 16px var(--mono);letter-spacing:2px;text-transform:uppercase;color:#00ADEF}
.espace-hero.es-couverture h1{margin:0 0 6px;font-size:30px;line-height:1.12;letter-spacing:-.4px;font-weight:700;background:none;color:#fff;-webkit-text-fill-color:#fff;text-wrap:balance}
:root[data-theme="dark"] .espace-hero.es-couverture h1{background:none}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .espace-hero.es-couverture h1{background:none}}
.es-couv-nom{margin:0 0 8px;font:600 16px var(--mono);letter-spacing:1px;text-transform:uppercase;color:#7FD6FF;overflow-wrap:anywhere}
.es-couv-sous{margin:0 auto;max-width:44ch;font-size:16px;line-height:1.5;color:#B9C6DA}
/* les quatre cases, fond fumé aux couleurs du logo */
.es-cases{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:0 0 16px}
@media (min-width:760px){.es-cases{grid-template-columns:repeat(4,minmax(0,1fr))}}
.es-case{--pc:#2E3193;position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;align-items:center;text-align:center;gap:2px;min-height:150px;padding:16px 10px 14px;
  border-radius:18px;text-decoration:none;color:var(--texte);background:linear-gradient(165deg,color-mix(in srgb,var(--pc) 18%,var(--carte)) 0%,var(--carte) 72%);
  border:1px solid color-mix(in srgb,var(--pc) 38%,var(--trait));border-top:4px solid var(--pc);box-shadow:0 12px 28px -22px color-mix(in srgb,var(--pc) 70%,#000);transition:transform .12s,box-shadow .15s}
.es-case::after{content:"";position:absolute;z-index:-1;width:130px;height:130px;right:-55px;bottom:-70px;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--pc) 30%,transparent),transparent)}
.es-case:active{transform:scale(.985)}
@media (hover:hover){.es-case:hover{transform:translateY(-2px);box-shadow:0 16px 30px -18px color-mix(in srgb,var(--pc) 80%,#000)}}
.es-case>b{display:grid;place-items:center;width:60px;height:60px;margin:0 auto 10px;border-radius:50%;font-size:28px;line-height:1;
  background:color-mix(in srgb,var(--pc) 20%,var(--carte));border:2px solid color-mix(in srgb,var(--pc) 50%,transparent);box-shadow:0 8px 18px -10px color-mix(in srgb,var(--pc) 80%,transparent)}
.es-case-titre{display:block;font-weight:700;font-size:17px;line-height:1.2;color:var(--texte)}
.es-case-sous{display:block;font-size:16px;line-height:1.3;color:var(--gris)}
.es-case-pastille{position:absolute;top:8px;right:9px;min-width:26px;height:26px;padding:0 7px;border-radius:999px;background:#C23A22;color:#fff;font:700 16px var(--mono);display:flex;align-items:center;justify-content:center}
:root[data-theme="dark"] .es-tuiles a.es-tuile,:root[data-theme="dark"] .es-cases a.es-case{color:var(--texte)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .es-cases a.es-case{color:var(--texte)}}
.es-carte-entretien{padding:16px}
.es-carte-entretien .entretien-bloc{margin:0 0 12px}
/* la case photo : deux boutons, l'appareil photo ou une photo déjà prise */
.es-photo-ajout{cursor:default}
.es-photo-choix{display:flex;flex-direction:column;gap:6px;width:100%;margin-top:8px}
.es-photo-btn{position:relative;display:flex;align-items:center;justify-content:center;min-height:48px;margin:0;padding:0 8px;border-radius:12px;font-weight:700;font-size:16px;cursor:pointer;overflow:hidden}
.es-photo-btn input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.es-photo-btn.prendre{color:#fff;background:linear-gradient(135deg,#2E3193 0%,#00ADEF 100%);box-shadow:0 10px 18px -12px #00ADEF}
.es-photo-btn.choisir{color:var(--texte);background:var(--carte);border:1.5px solid color-mix(in srgb,var(--c) 45%,var(--trait))}
.es-photo-btn:focus-within{outline:3px solid var(--focus);outline-offset:2px}
.es-photo.vide:focus-within{outline:none}
.es-photo-ajout{min-height:230px}
/* ---------- bureau : les quatre volets des espaces clients en cases fumées ---------- */
.ec-volets{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:0 0 16px}
@media (min-width:760px){.ec-volets{grid-template-columns:repeat(4,minmax(0,1fr))}}
.ec-volet{position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;align-items:center;text-align:center;gap:2px;min-height:124px;padding:14px 10px 12px;border-radius:16px;text-decoration:none;color:var(--texte);
  background:linear-gradient(165deg,color-mix(in srgb,var(--fc) 16%,var(--carte)) 0%,var(--carte) 75%);border:1.5px solid color-mix(in srgb,var(--fc) 40%,var(--trait));border-top:4px solid var(--fc);
  box-shadow:0 12px 26px -22px color-mix(in srgb,var(--fc) 70%,#000);transition:transform .12s,box-shadow .15s}
.ec-volet::after{content:"";position:absolute;z-index:-1;width:120px;height:120px;right:-50px;bottom:-64px;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--fc) 28%,transparent),transparent)}
@media (hover:hover){.ec-volet:hover{transform:translateY(-2px);box-shadow:0 16px 28px -18px color-mix(in srgb,var(--fc) 80%,#000)}}
.ec-volet>i{display:grid;place-items:center;width:48px;height:48px;margin:0 0 8px;border-radius:50%;font-style:normal;font-size:22px;background:color-mix(in srgb,var(--fc) 20%,var(--carte));border:2px solid color-mix(in srgb,var(--fc) 50%,transparent)}
.ec-volet>b{font-size:16px;line-height:1.2}
.ec-volet>span:not(.ec-volet-pastille){font-size:16px;color:var(--gris)}
.ec-volet.actif{background:linear-gradient(165deg,color-mix(in srgb,var(--fc) 30%,var(--carte)) 0%,color-mix(in srgb,var(--fc) 8%,var(--carte)) 80%);box-shadow:0 0 0 2px var(--fc) inset,0 14px 28px -18px color-mix(in srgb,var(--fc) 80%,#000)}
.ec-volet.alerte>span:not(.ec-volet-pastille){color:color-mix(in srgb,#C23A22 80%,var(--texte));font-weight:700}
.ec-volet-pastille{position:absolute;top:8px;right:9px;min-width:26px;height:26px;padding:0 7px;border-radius:999px;background:#C23A22;color:#fff;font:700 16px var(--mono);display:flex;align-items:center;justify-content:center}
:root[data-theme="dark"] .ec-volets a.ec-volet{color:var(--texte)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .ec-volets a.ec-volet{color:var(--texte)}}
/* « Rester connecté sur cet appareil », sur les pages de connexion */
.carte-connexion .coche-ligne.rester{margin:14px 0 2px}
.carte-connexion .rester-aide{margin:0 0 4px}

/* ---------- formation (bureau) : la même formation que les techniciens, le suivi, le catalogue ---------- */
.fo-bureau{max-width:720px;margin:0 auto}
.fo-volets{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:520px){.fo-volets{grid-template-columns:1fr 1fr}.fo-volets .ec-volet:first-child{grid-column:1/-1}}
.fo-form input[type=url]{width:100%}
.fo-jauge{display:inline-block;vertical-align:middle;width:90px;height:10px;border-radius:999px;background:color-mix(in srgb,var(--primaire) 15%,transparent);overflow:hidden;margin-right:6px}
.fo-jauge i{display:block;height:100%;width:var(--p,0%);background:linear-gradient(90deg,#2E3193,#00ADEF 60%,#E4442A);border-radius:999px}
.fo-form label{display:block;font-weight:600;margin:0 0 4px}
.fo-form>div{margin:0 0 12px}
.fo-liste{display:grid;gap:10px}
.fo-ligne{display:grid;grid-template-columns:128px 1fr;grid-template-areas:"min infos" "btn btn" "edit edit";gap:8px 12px;align-items:start;padding:10px;border:1px solid var(--trait);border-radius:var(--r);background:var(--champ)}
.fo-ligne.inactive{opacity:.9;border-style:dashed}
.fo-ligne .fo-min{grid-area:min;position:relative;display:block;width:128px;height:72px;border-radius:10px;overflow:hidden;background:#12203A}
.fo-ligne .fo-min img{display:block;width:100%;height:100%;object-fit:cover}
.fo-ligne .fo-min span{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:32px;height:32px;border-radius:50%;background:rgba(228,68,42,.95);color:#fff;display:grid;place-items:center;font-size:13px;padding-left:2px}
.fo-ligne .fo-infos{grid-area:infos;min-width:0;display:flex;flex-direction:column;gap:2px}
.fo-ligne .fo-infos b{font-size:16px;line-height:1.25}
.fo-ligne .fo-infos span{font-size:14px}
.fo-ligne .fo-infos small{font-size:14px;color:var(--gris)}
.fo-ligne .fo-infos .fo-prop-par{color:#B84A00;font-weight:600}
.fo-ligne .fo-boutons{grid-area:btn;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.fo-ligne .fo-inline{display:inline}
.fo-ligne .mini.ok{background:var(--ok-fond);color:var(--ok);border-color:color-mix(in srgb,var(--ok) 50%,transparent)}
.fo-ligne .fo-edit{grid-area:edit;padding:10px 0 0;border-top:1px dashed var(--trait)}
.fo-ligne .fo-edit label{display:block;font-weight:600;font-size:15px;margin:0 0 3px}
.fo-ligne .fo-edit .duo{margin:0 0 10px}
.fo-ligne .fo-edit p{margin:0}
.fo-theme-bureau{border:1px solid var(--trait);border-radius:var(--r);margin:0 0 10px;background:var(--carte)}
.fo-theme-bureau summary{display:flex;align-items:center;gap:10px;min-height:52px;padding:8px 14px;cursor:pointer;font-size:17px;list-style:none}
.fo-theme-bureau summary::-webkit-details-marker{display:none}
.fo-theme-bureau summary::before{content:"›";display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;border:1px solid var(--trait);color:var(--gris);transition:transform .2s}
.fo-theme-bureau[open] summary::before{transform:rotate(90deg)}
.fo-theme-bureau .fo-liste{padding:0 12px 12px}
@media (max-width:520px){.fo-ligne{grid-template-columns:1fr;grid-template-areas:"min" "infos" "btn" "edit"}.fo-ligne .fo-min{width:100%;height:auto;aspect-ratio:16/9}}
/* ============================================================
   Lot 15 : règlements (encaissements), fiche client 360, retour sans rien perdre, recherche globale
   ============================================================ */
/* la pastille de règlement, la même partout : liste, fiches, recherche. --rc = la couleur de l'état */
.regl{display:inline-flex;align-items:center;gap:4px;font-size:15px;font-weight:700;line-height:1.2;border-radius:999px;padding:4px 10px;white-space:nowrap;vertical-align:middle;--rc:#55617A;background:color-mix(in srgb,var(--rc) 16%,var(--carte));color:var(--rc);border:1px solid color-mix(in srgb,var(--rc) 45%,transparent)}
.regl.attente,.regl.attendu{--rc:#F26B1D;color:#B84A00}
.regl.partiel{--rc:#00ADEF;color:#0077A8}
.regl.retard{--rc:#E4442A;color:#B8321C}
.regl.regle,.regl.recu{--rc:#1D9A6C;color:#146B3A}
.regl.aucun{--rc:#55617A;color:#55617A}
:root[data-theme="dark"] .regl{background:color-mix(in srgb,var(--rc) 26%,var(--carte))}
:root[data-theme="dark"] .regl.attente,:root[data-theme="dark"] .regl.attendu{color:#FFB27A}
:root[data-theme="dark"] .regl.partiel{color:#8FD8FF}
:root[data-theme="dark"] .regl.retard{color:#FFB3A1}
:root[data-theme="dark"] .regl.regle,:root[data-theme="dark"] .regl.recu{color:#7FE3B4}
:root[data-theme="dark"] .regl.aucun{color:#C9D3E3}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .regl{background:color-mix(in srgb,var(--rc) 26%,var(--carte))}
  :root:not([data-theme="light"]) .regl.attente,:root:not([data-theme="light"]) .regl.attendu{color:#FFB27A}
  :root:not([data-theme="light"]) .regl.partiel{color:#8FD8FF}
  :root:not([data-theme="light"]) .regl.retard{color:#FFB3A1}
  :root:not([data-theme="light"]) .regl.regle,:root:not([data-theme="light"]) .regl.recu{color:#7FE3B4}
  :root:not([data-theme="light"]) .regl.aucun{color:#C9D3E3}
}
/* liste des dossiers : la pastille sous l'étiquette d'état (pas de colonne en plus) */
.dossiers-tableau td.c-etat .regl{display:inline-flex;margin-top:4px}
@media (max-width:699px){.dossiers-tableau td.c-etat{display:flex;flex-direction:column;align-items:flex-end;gap:4px}}
.clients-tableau td.c-nb .regl{margin-left:6px}
/* fiche d'un dossier : le règlement dans l'en-tête, puis la section Règlement */
.reglement-resume .regl{margin-right:4px}
.reglement-resume a{margin-left:6px;font-weight:600}
.regl-chiffres{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:0 0 14px}
.regl-chiffres>div{background:var(--champ);border:1px solid var(--trait);border-radius:12px;padding:12px 14px;min-height:48px}
.regl-chiffres span{display:block;font-size:16px;color:var(--gris)}
.regl-chiffres b{display:block;font:700 22px/1.2 var(--mono);font-variant-numeric:tabular-nums;color:var(--primaire);overflow-wrap:anywhere}
.regl-chiffres .regl-reste.alerte{border-color:var(--rouge)}
.regl-chiffres .regl-reste.alerte b{color:var(--rouge)}
:root[data-theme="dark"] .regl-chiffres b{color:#8FD8FF}
:root[data-theme="dark"] .regl-chiffres .regl-reste.alerte b{color:#FFB3A1}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .regl-chiffres b{color:#8FD8FF}:root:not([data-theme="light"]) .regl-chiffres .regl-reste.alerte b{color:#FFB3A1}}
@media (max-width:520px){.regl-chiffres{grid-template-columns:1fr}}
.regl-non-suivi{margin:0 0 14px}
.regl-non-suivi .bandeau{margin-bottom:10px}
.regl-non-suivi .bouton{width:auto}
.echeancier td.actions{white-space:normal}
.echeancier tr.pl-retard td:first-child{box-shadow:inset 4px 0 0 var(--rouge)}
.regl-actions{display:flex;flex-wrap:wrap;gap:6px;align-items:flex-start}
.regl-actions>details,.regl-actions>form{margin:0}
.regl-inline>summary{list-style:none;cursor:pointer}
.regl-inline>summary::-webkit-details-marker{display:none}
.regl-inline[open]>summary{border-color:var(--primaire)}
.regl-inline form{margin-top:8px;padding:12px;border:1px solid var(--trait);border-radius:12px;background:var(--champ);min-width:min(320px,100%)}
.regl-inline form .bouton{margin-top:6px}
.regl-formulaires{display:grid;gap:10px;margin:14px 0 0}
@media (min-width:700px){.regl-formulaires{grid-template-columns:1fr 1fr;align-items:start}}
.regl-ajout,.regl-plan{margin:0;border:1px solid var(--trait);border-radius:12px;background:var(--champ)}
.regl-ajout>summary,.regl-plan>summary{list-style:none;cursor:pointer;display:flex;align-items:center;min-height:52px;padding:0 16px;font-weight:700;font-size:16px;color:var(--primaire)}
.regl-ajout>summary::-webkit-details-marker,.regl-plan>summary::-webkit-details-marker{display:none}
.regl-ajout>summary::after,.regl-plan>summary::after{content:"▾";margin-left:auto;color:var(--gris)}
.regl-ajout[open]>summary::after,.regl-plan[open]>summary::after{content:"▴"}
.regl-ajout form,.regl-plan form{padding:0 16px 16px}
:root[data-theme="dark"] .regl-ajout>summary,:root[data-theme="dark"] .regl-plan>summary{color:#DDE3FF}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .regl-ajout>summary,:root:not([data-theme="light"]) .regl-plan>summary{color:#DDE3FF}}
.regl-tout{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:14px 0 0;padding-top:14px;border-top:1px dashed var(--trait)}
.regl-tout select{width:auto;flex:1 1 200px;margin:0;min-height:48px}
.regl-tout .bouton{width:auto;flex:1 1 220px}
/* tableau de bord : la ligne « à encaisser » sous les trois cases */
.a-encaisser{display:flex;align-items:center;gap:12px;margin:12px 0 0;padding:12px 16px;min-height:56px;border-radius:14px;text-decoration:none;color:#fff;background:linear-gradient(160deg,rgba(255,255,255,.10),rgba(255,255,255,.04));border:1px solid rgba(255,255,255,.14);font-size:16px}
.a-encaisser i{font-style:normal;font-size:22px;line-height:1}
.a-encaisser b{font-family:var(--mono);font-variant-numeric:tabular-nums;font-size:18px}
.a-encaisser em{font-style:normal;font-weight:700;color:#FF9A82}
.a-encaisser.alerte{border-color:#E4442A;box-shadow:inset 0 0 0 1px rgba(228,68,42,.35)}
.a-encaisser:hover,.a-encaisser:focus-visible{background:linear-gradient(160deg,rgba(255,255,255,.16),rgba(255,255,255,.06))}
/* fiche client 360 : en-tête, puces, cinq cases, volets, raccourcis sur chaque ligne */
.fiche-tete .fiche-puces{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}
.fiche-puces .puce{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:4px 12px;border-radius:999px;background:var(--champ);border:1px solid var(--trait);font-size:16px;font-weight:600}
.fiche-puces .puce a{font-weight:700}
.fiche-puces .regl{min-height:36px}
.compte-infos a.itineraire{margin-left:6px;font-weight:600;white-space:nowrap}
.fiche-tete .stat.du b{font-size:24px;font-family:var(--mono)}
@media (min-width:700px){.fiche-tete .stats{grid-template-columns:repeat(3,1fr)}}
@media (min-width:1000px){.fiche-tete .stats{grid-template-columns:repeat(5,1fr)}}
.fiche-volets{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:0 0 16px}
@media (min-width:760px){.fiche-volets{grid-template-columns:repeat(5,minmax(0,1fr))}}
.fiche-volets .ec-volet{min-height:112px}
:root[data-theme="dark"] .fiche-volets a.ec-volet{color:var(--texte)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .fiche-volets a.ec-volet{color:var(--texte)}}
.docs li .li-actions{flex:1 1 100%;display:flex;flex-wrap:wrap;gap:6px;margin-top:2px}
.docs li .li-actions a{display:inline-flex;align-items:center;min-height:44px;padding:0 12px;border-radius:8px;border:1px solid var(--trait);background:var(--champ);color:var(--texte);text-decoration:none;font-weight:600;font-size:16px}
.docs li .li-actions a:hover,.docs li .li-actions a:focus-visible{border-color:var(--primaire)}
.regl-tableau td.actions .mini{min-height:44px}
.regl-totaux{display:flex;flex-wrap:wrap;gap:8px 20px;margin:0;font-size:16px;color:var(--gris)}
.regl-totaux b{color:var(--texte);font-family:var(--mono);font-variant-numeric:tabular-nums}
.regl-totaux .alerte b{color:var(--rouge)}
:root[data-theme="dark"] .regl-totaux .alerte b{color:#FFB3A1}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .regl-totaux .alerte b{color:#FFB3A1}}
#notes form{margin:0 0 16px}
#notes textarea{min-height:88px}
#notes form .bouton{width:auto;min-width:200px}
.notes-liste li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 14px;align-items:start}
.notes-liste .note-tete{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;font-size:16px}
.notes-liste .note-genre{display:inline-flex;align-items:center;min-height:28px;padding:2px 10px;border-radius:999px;font-size:16px;font-weight:700;background:color-mix(in srgb,var(--cyan) 16%,var(--carte));color:#0077A8;border:1px solid color-mix(in srgb,var(--cyan) 50%,transparent)}
.notes-liste .note-genre.g-appel{background:color-mix(in srgb,#1D9A6C 16%,var(--carte));color:#146B3A;border-color:color-mix(in srgb,#1D9A6C 50%,transparent)}
.notes-liste .note-genre.g-visite{background:color-mix(in srgb,#8E44AD 16%,var(--carte));color:#6C2E86;border-color:color-mix(in srgb,#8E44AD 50%,transparent)}
.notes-liste .note-genre.g-sms,.notes-liste .note-genre.g-mail{background:color-mix(in srgb,#F26B1D 16%,var(--carte));color:#B84A00;border-color:color-mix(in srgb,#F26B1D 50%,transparent)}
.notes-liste .note-texte{grid-column:1 / -1;margin:0;font-size:16px;white-space:pre-wrap;overflow-wrap:anywhere}
.notes-liste form{margin:0}
:root[data-theme="dark"] .notes-liste .note-genre{color:#8FD8FF}
:root[data-theme="dark"] .notes-liste .note-genre.g-appel{color:#7FE3B4}
:root[data-theme="dark"] .notes-liste .note-genre.g-visite{color:#D9A8F2}
:root[data-theme="dark"] .notes-liste .note-genre.g-sms,:root[data-theme="dark"] .notes-liste .note-genre.g-mail{color:#FFB27A}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .notes-liste .note-genre{color:#8FD8FF}
  :root:not([data-theme="light"]) .notes-liste .note-genre.g-appel{color:#7FE3B4}
  :root:not([data-theme="light"]) .notes-liste .note-genre.g-visite{color:#D9A8F2}
  :root:not([data-theme="light"]) .notes-liste .note-genre.g-sms,:root:not([data-theme="light"]) .notes-liste .note-genre.g-mail{color:#FFB27A}
}
.activite-liste li span{font-size:16px}
.activite-liste li .mini{min-height:36px}
/* retour sans rien perdre : le bouton « Retour à … » en haut et en bas des fiches */
.retour-ligne{margin:0 0 12px;font-size:16px}
.retour-liste{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 14px;border-radius:10px;border:1px solid var(--trait);background:var(--carte);color:var(--primaire);text-decoration:none;font-weight:700;font-size:16px}
.retour-liste:hover,.retour-liste:focus-visible{border-color:var(--primaire)}
:root[data-theme="dark"] .retour-liste{color:#DDE3FF}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .retour-liste{color:#DDE3FF}}
.ec-fil.retour-ligne{margin-bottom:12px}
/* recherche globale : la ligne en haut de chaque page du bureau, les groupes de suggestions, la page des résultats */
.recherche-globale{display:flex;gap:8px;align-items:center;margin:0 0 14px;padding:0;min-height:56px}
.recherche-globale .suggest-zone{position:relative;flex:1;min-width:0}
.recherche-globale input[type=search]{margin:0;min-height:48px;border-radius:12px;border:1.5px solid var(--trait);background:var(--carte)}
.recherche-globale input[type=search]:focus{border-color:var(--cyan)}
.recherche-globale .bouton{width:auto;flex:0 0 auto;padding:0 18px;min-height:48px}
@media (max-width:520px){.recherche-globale{width:100%}.recherche-globale .bouton{display:none}}
.recherche-globale .suggestions,.recherche-globale-page .suggestions{max-height:70vh;overflow-y:auto}
.recherche-globale-page input[type=search]{font-size:18px;min-height:56px}
.recherche-globale-tete h1{margin-bottom:6px}
.recherche-globale-tete p{margin:0}
.suggestions .groupe{border-top:1px solid var(--trait)}
.suggestions .groupe:first-child{border-top:0}
.suggestions .groupe-titre{margin:0;padding:10px 14px 4px;font-size:16px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;color:var(--gris)}
.suggestions .groupe-titre+a{border-top:0}
.suggestions a.voir-tout{display:block;text-align:center;font-weight:700;color:var(--primaire);border-top:1px solid var(--trait);background:var(--champ)}
:root[data-theme="dark"] .suggestions a.voir-tout{color:#DDE3FF}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .suggestions a.voir-tout{color:#DDE3FF}}
.rg-sommaire{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}
.rg-sommaire a{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 14px;border-radius:999px;border:1px solid var(--trait);background:var(--carte);color:var(--texte);text-decoration:none;font-weight:600;font-size:16px}
.rg-sommaire a b{background:var(--primaire);color:#fff;border-radius:999px;padding:1px 9px;font-size:16px}
.rg-liste li{display:grid;grid-template-columns:minmax(0,1fr);gap:4px 14px}
@media (min-width:700px){.rg-liste li{grid-template-columns:minmax(0,1fr) auto;align-items:center}}
.rg-liste li>span{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;font-size:16px}
.carte.vide h2{margin-bottom:4px}
.carte.vide p{margin:0}

/* fiche client, cases de chiffres : une date entière tient sur une ligne sur téléphone */
@media (max-width:420px){.stat b{font-size:24px}.stat.ca b{font-size:22px}}


/* ============================================================
   Lot 16 — R : relances et courriers automatiques
   (page p=relances, « Courriers à envoyer » du tableau de bord, relances sur les fiches, 15 onglets du bureau)
   ============================================================ */
/* la barre du bureau compte 15 onglets : une couleur par onglet au-delà des 8 premiers (formation, statistiques, journal, corbeille, sauvegardes, Google Sheets, tarifs) */
.nav-app a:nth-child(9){--nc:#E67E22}.nav-app a:nth-child(10){--nc:#0E7C86}.nav-app a:nth-child(11){--nc:#5B7A6E}.nav-app a:nth-child(12){--nc:#C0392B}.nav-app a:nth-child(13){--nc:#D68910}.nav-app a:nth-child(14){--nc:#0F9D58}.nav-app a:nth-child(15){--nc:#B31BE8}
/* tableau de bord : « Courriers à envoyer », la même carte que « À encaisser », liseré orange (le hero est toujours sombre, texte blanc) */
.a-relances{display:flex;align-items:center;gap:12px;margin:12px 0 0;padding:12px 16px;min-height:56px;border-radius:14px;text-decoration:none;color:#fff;background:linear-gradient(160deg,rgba(255,255,255,.10),rgba(255,255,255,.04));border:1px solid #D68910;box-shadow:inset 0 0 0 1px rgba(214,137,16,.35);font-size:16px}
.a-relances i{font-style:normal;font-size:22px;line-height:1}
.a-relances b{font-family:var(--mono);font-variant-numeric:tabular-nums;font-size:18px}
.a-relances:hover,.a-relances:focus-visible{background:linear-gradient(160deg,rgba(255,255,255,.16),rgba(255,255,255,.06))}
/* page Relances : l'en-tête, les trois états, « Tout envoyer » et « Préparer maintenant » */
.relances-tete .onglets{margin:14px 0 12px}
.relances-actions-tete{display:flex;flex-wrap:wrap;gap:10px}
.relances-actions-tete form{margin:0;flex:1 1 220px}
.relances-actions-tete .bouton{width:100%;min-height:48px}
@media (min-width:600px){.relances-actions-tete form{flex:0 1 auto}.relances-actions-tete .bouton{width:auto}}
/* la liste : une carte par courrier, bord gauche à la couleur du genre (--rc), texte teinté lisible (--rct) */
.relances-liste{display:grid;gap:12px;margin:0 0 16px}
.relance{--rc:#2E3193;--rct:#2E3193;background:var(--carte);border:1px solid var(--trait);border-left:6px solid var(--rc);border-radius:var(--r);padding:14px 16px}
.relance.genre-impaye{--rct:#B8321C}.relance.genre-avis{--rct:#9A5F00}.relance.genre-renouvellement{--rct:#2E3193}
.relance-tete{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;font-size:16px}
.relance-tete .badge{margin:0;color:#fff;border-color:transparent;background:var(--rc);background:color-mix(in srgb,var(--rc) 70%,#12203A)}
.relance-tete b{font-size:17px}
.relance-tete b a{color:inherit}
.relance-tete .montant{font-weight:700;color:var(--rct)}
.relance-tete small{font-size:16px;color:var(--gris)}
.relance-echec{color:#B8321C;font-weight:700}
.relance-dest{margin:6px 0 0;font-size:16px}
.relance-texte{margin:6px 0 0}
.relance-texte>summary{cursor:pointer;min-height:44px;display:flex;align-items:center;font-weight:600;color:var(--primaire)}
.relance-texte .sujet{margin:4px 0 8px}
.relance-texte .corps{white-space:pre-wrap;overflow-wrap:anywhere;font:16px/1.5 var(--ui);margin:0;padding:12px 14px;background:var(--champ);border:1px solid var(--trait);border-radius:12px;color:var(--texte)}
/* les actions d'un courrier à envoyer : envoyer, modifier le texte, mettre de côté */
.relance-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-start;margin-top:12px}
.relance-actions form{margin:0}
.relance-actions .bouton{width:auto;min-height:48px}
.relance-modif{flex:0 0 auto}
.relance-modif[open]{flex:1 1 100%}
.relance-modif>summary{list-style:none;cursor:pointer;width:auto;min-height:48px}
.relance-modif>summary::-webkit-details-marker{display:none}
.relance-modif form{margin-top:10px}
.relance-modif textarea{min-height:240px}
.relance-modif form .bouton{width:100%}
@media (max-width:480px){.relance-actions form{flex:1 1 100%}.relance-actions .bouton{width:100%}.relance-modif{flex:1 1 100%}.relance-modif>summary{width:100%}}
/* les réglages, genre par genre */
#reglages-relances .rg-bloc{padding:12px 0 6px;border-top:1px solid var(--trait)}
#reglages-relances .rg-bloc:first-of-type{border-top:0;padding-top:0}
#reglages-relances .rg-bloc>label:first-child{font-size:18px;font-weight:700}
/* fiche du dossier : les relances sous l'échéancier, et « Relancer par e-mail » */
.regl-relances{margin:14px 0 12px;padding:12px 14px;border:1px solid var(--trait);border-radius:12px;background:var(--champ)}
.regl-relances h3{margin:0 0 6px;font-size:18px}
.regl-relances form{margin-top:10px}
.regl-relances .bouton{width:auto;min-height:48px}
.regl-relances p.gris{margin:6px 0 0}
/* fiche client : « Courriers envoyés » sous le tableau des règlements */
#reglements h3{margin:16px 0 6px;font-size:18px}
/* mode sombre (écrit deux fois : réglage de l'application, puis réglage du téléphone) */
:root[data-theme="dark"] .relance.genre-impaye{--rct:#FFB3A1}
:root[data-theme="dark"] .relance.genre-avis{--rct:#FFD68A}
:root[data-theme="dark"] .relance.genre-renouvellement{--rct:#B9BCFF}
:root[data-theme="dark"] .relance-echec{color:#FFB3A1}
:root[data-theme="dark"] .relance-tete .badge{background:var(--rc);background:color-mix(in srgb,var(--rc) 60%,#0B1424)}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .relance.genre-impaye{--rct:#FFB3A1}
  :root:not([data-theme="light"]) .relance.genre-avis{--rct:#FFD68A}
  :root:not([data-theme="light"]) .relance.genre-renouvellement{--rct:#B9BCFF}
  :root:not([data-theme="light"]) .relance-echec{color:#FFB3A1}
  :root:not([data-theme="light"]) .relance-tete .badge{background:var(--rc);background:color-mix(in srgb,var(--rc) 60%,#0B1424)}
}


/* ============================================================
   Lot 16 — S : statistiques du bureau et export comptable (p=statistiques, stats.php)
   ============================================================ */
/* en-tête : les filtres vivent dans la carte, sans second cadre */
.stats-tete .stats-filtres{margin:14px 0 0;padding:0;border:0;background:transparent;box-shadow:none}
.stats-tete .filtres-actions .bouton{flex:0 1 220px}
/* les six cases : 2 colonnes, puis 3, puis 6 ; les montants en chiffres alignés.
   « .vendu » (bloc bleu nuit du tableau de bord) et « .rdv » (cartes du planning) existent déjà : on les neutralise ici pour les cases */
#stats-cartes .stats{margin:0}
#stats-cartes .stat.vendu,#stats-cartes .stat.rdv{position:static;isolation:auto;overflow:visible;display:block;color:inherit;border:1px solid var(--trait);border-left-width:1px;border-style:solid;border-radius:12px;padding:14px;margin:0;text-align:left;background:var(--champ);box-shadow:none;transition:none;opacity:1}
#stats-cartes .stat.vendu::before,#stats-cartes .stat.vendu::after{content:none}
#stats-cartes .stat.vendu:hover,#stats-cartes .stat.rdv:hover{transform:none;box-shadow:none}
#stats-cartes .stat.vendu b{color:var(--primaire)}
#stats-cartes .stat.vendu b,#stats-cartes .stat.encaisse b,#stats-cartes .stat.du b,#stats-cartes .stat.panier b{font-size:24px;font-family:var(--mono)}
#stats-cartes .stat.encaisse b{color:var(--ok)}
.stat small{display:block;font-size:16px;font-weight:700;color:var(--rouge);margin-top:4px}
@media (min-width:700px){#stats-cartes .stats{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:1000px){#stats-cartes .stats{grid-template-columns:repeat(6,minmax(0,1fr))}}
@media (max-width:420px){#stats-cartes .stat.vendu b,#stats-cartes .stat.encaisse b,#stats-cartes .stat.du b,#stats-cartes .stat.panier b{font-size:20px}}
/* contrats : quatre cases ; impayés : deux cases */
#stats-contrats .stats,#stats-impayes .stats{margin:0 0 12px}
#stats-impayes .stat.retard b{font-size:24px;font-family:var(--mono)}
@media (min-width:700px){#stats-contrats .stats{grid-template-columns:repeat(4,minmax(0,1fr))}#stats-impayes .stats{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* mois par mois : un graphique en barres en CSS pur, une colonne par mois, deux barres (vendu, encaissé) ; les libellés sous l'axe */
.barres{display:grid;grid-template-columns:repeat(var(--n,12),minmax(0,1fr));gap:4px;align-items:stretch;height:160px;margin:8px 0 52px;border-bottom:1px solid var(--trait)}
.barres .mois{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:2px;align-items:end;height:100%;min-width:0;padding:0 2px;border-radius:6px 6px 0 0}
.barres .mois.courant{background:rgba(0,173,239,.10)}
.barres .b-vendu,.barres .b-encaisse{height:var(--h,0%);min-height:2px;border-radius:3px 3px 0 0}
.barres .b-vendu{background:#2E3193}
.barres .b-encaisse{background:#00ADEF}
.barres .lib{position:absolute;left:0;right:0;top:100%;padding-top:6px;text-align:center;font-size:16px;line-height:1.15;color:var(--gris);white-space:nowrap}
.barres .lib .an{display:block;font-size:16px;font-weight:700;color:var(--texte)}
@media (max-width:699px){
  .barres{gap:3px;margin-bottom:104px}
  .barres .lib{writing-mode:vertical-rl;left:50%;right:auto;width:auto;margin-left:-9px;padding-top:6px;line-height:1;text-align:left}
  .barres .lib .an{display:inline}
  .barres .lib .an::before{content:" "}
}
.barres-legende{display:flex;flex-wrap:wrap;gap:6px 18px;margin:0 0 8px;font-size:16px;color:var(--gris)}
.barres-legende span{display:inline-flex;align-items:center;gap:6px;min-height:28px}
.barres-legende i{width:14px;height:14px;border-radius:4px;display:inline-block}
.barres-legende .l-vendu{background:#2E3193}
.barres-legende .l-encaisse{background:#00ADEF}
.stats-detail summary{cursor:pointer;display:flex;align-items:center;min-height:44px;font-weight:700;font-size:16px;color:var(--primaire);list-style:none}
.stats-detail summary::-webkit-details-marker{display:none}
.stats-detail summary::before{content:"▸";margin-right:8px}
.stats-detail[open] summary::before{content:"▾"}
.stats-detail[open] summary{margin-bottom:8px}
.stats-tableau tr.courant td{background:rgba(0,173,239,.08)}
.stats-tableau tr.total td{border-top:2px solid var(--trait)}
/* par technicien, par document : avatar aux initiales, part en mini-barre */
.stats-tableau .avatar{width:40px;height:40px;font-size:16px;vertical-align:middle;margin-right:6px}
.stats-tableau .part-txt{display:block;font-weight:700;font-variant-numeric:tabular-nums}
.stats-tableau .part{display:block;height:10px;min-width:90px;border-radius:999px;background:var(--trait);overflow:hidden;margin-top:4px}
.stats-tableau .part i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#2E3193,#00ADEF)}
.stats-tableau td.actions .mini{min-height:44px}
#stats-types td i{font-style:normal}
#stats-contrats h3,#stats-impayes h3{font-size:18px;margin:16px 0 6px}
#stats-impayes .raccourcis-ligne{margin-top:14px}
.export-form .filtres-actions .bouton{flex:0 1 320px}
/* mode sombre : des barres qui ressortent sur le bleu nuit (écrit deux fois : choix de l'utilisateur, puis réglage de l'appareil) */
:root[data-theme="dark"] #stats-cartes .stat.vendu b{color:#8FD8FF}
:root[data-theme="dark"] .barres .b-vendu,:root[data-theme="dark"] .barres-legende .l-vendu{background:#7B80F5}
:root[data-theme="dark"] .barres .mois.courant{background:rgba(0,173,239,.14)}
:root[data-theme="dark"] .stats-tableau tr.courant td{background:rgba(0,173,239,.10)}
:root[data-theme="dark"] .stats-tableau .part i{background:linear-gradient(90deg,#7B80F5,#00ADEF)}
:root[data-theme="dark"] .stats-detail summary{color:#DDE3FF}
:root[data-theme="dark"] .stat small{color:#FFB3A1}
:root[data-theme="dark"] #stats-cartes .stat.du.alerte b,:root[data-theme="dark"] #stats-impayes .stat.alerte b,:root[data-theme="dark"] #stats-contrats .stat.alerte b{color:#FFB3A1}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) #stats-cartes .stat.vendu b{color:#8FD8FF}
  :root:not([data-theme="light"]) .barres .b-vendu,:root:not([data-theme="light"]) .barres-legende .l-vendu{background:#7B80F5}
  :root:not([data-theme="light"]) .barres .mois.courant{background:rgba(0,173,239,.14)}
  :root:not([data-theme="light"]) .stats-tableau tr.courant td{background:rgba(0,173,239,.10)}
  :root:not([data-theme="light"]) .stats-tableau .part i{background:linear-gradient(90deg,#7B80F5,#00ADEF)}
  :root:not([data-theme="light"]) .stats-detail summary{color:#DDE3FF}
  :root:not([data-theme="light"]) .stat small{color:#FFB3A1}
  :root:not([data-theme="light"]) #stats-cartes .stat.du.alerte b,:root:not([data-theme="light"]) #stats-impayes .stat.alerte b,:root:not([data-theme="light"]) #stats-contrats .stat.alerte b{color:#FFB3A1}
}


/* ============================================================
   Lot 16 (C) — portail d'entrée à deux portes, code de connexion, réglage de la sécurité
   ============================================================ */
/* ---- le portail : « Je suis client » / « Équipe AK » ---- */
.entree.portail .gris{margin-bottom:22px}
.portes{display:grid;grid-template-columns:1fr;gap:14px;max-width:560px;margin:0 auto}
@media (min-width:600px){.portes{grid-template-columns:1fr 1fr;max-width:760px}}
.page-entree .bouton.porte{--p1:#2E3193;--p2:#00ADEF;display:grid;grid-template-columns:56px minmax(0,1fr);grid-template-rows:auto auto;column-gap:14px;row-gap:2px;align-items:center;
  text-align:left;min-height:96px;padding:16px 18px;border-radius:20px;border:2px solid transparent;
  background:linear-gradient(#152743,#152743) padding-box,linear-gradient(135deg,#2E3193 0%,#00ADEF 55%,#E4442A 100%) border-box;
  color:#fff;box-shadow:0 18px 36px -22px rgba(0,0,0,.9);transition:transform .15s,box-shadow .15s}
.page-entree .bouton.porte:hover{transform:translateY(-2px);box-shadow:0 22px 40px -20px var(--p2)}
.page-entree .bouton.porte:active{transform:translateY(0)}
.porte i{grid-row:1/3;display:grid;place-items:center;width:56px;height:56px;border-radius:50%;font-style:normal;font-size:26px;line-height:1;
  background:linear-gradient(135deg,var(--p1),var(--p2));box-shadow:0 10px 20px -10px var(--p2)}
.porte b{font-size:20px;line-height:1.2;font-weight:700}
.porte span{font-size:16px;line-height:1.3;font-weight:500;color:#C7D2E4}
.page-entree .bouton.porte-client{--p1:#0087BD;--p2:#00ADEF;background:linear-gradient(135deg,#0E3A5E 0%,#152743 100%) padding-box,linear-gradient(135deg,#00ADEF 0%,#2E3193 55%,#E4442A 100%) border-box}
.page-entree .bouton.porte-equipe{--p1:#2E3193;--p2:#4B50D6;background:linear-gradient(135deg,#232A8C 0%,#1A2E5C 100%) padding-box,linear-gradient(135deg,#2E3193 0%,#00ADEF 55%,#E4442A 100%) border-box}

/* ---- l'écran du code reçu par e-mail ---- */
.entree .carte-code{position:relative;isolation:isolate;overflow:hidden;padding:24px 18px 20px}
.entree .carte-code::before{content:"";position:absolute;z-index:-1;width:240px;height:240px;right:-110px;top:-120px;border-radius:50%;background:radial-gradient(closest-side,rgba(0,173,239,.22),transparent)}
.entree .carte-code h1{font-size:28px;line-height:1.1;margin:0 0 8px}
.carte-code .eyebrow{font-size:16px}
.carte-code .connexion-sous{margin:0 0 6px;font-size:16px;color:var(--gris)}
.carte-code .connexion-sous b{color:var(--texte);overflow-wrap:anywhere}
.carte-code .bandeau{margin:12px 0 0;text-align:left}
input.code-saisie{font:700 32px var(--mono);letter-spacing:8px;text-align:center;min-height:68px;padding:10px 0 10px 8px;border-width:2px;
  border-color:#7FD6FF;border-color:color-mix(in srgb,var(--cyan) 55%,var(--trait))}
input.code-saisie::placeholder{color:var(--trait);letter-spacing:8px;font-weight:600}
input.code-saisie:focus{border-color:var(--cyan);box-shadow:0 0 0 4px rgba(0,173,239,.18);outline:none}
.carte-code .code-renvoyer{margin:16px 0 0}
.carte-code .code-retour{margin:14px 0 0;text-align:center;font-size:16px}
.carte-code .code-retour a{color:var(--gris);font-weight:600}
:root[data-theme="dark"] input.code-saisie{border-color:#2C86B8;color:#EEF2F8}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) input.code-saisie{border-color:#2C86B8;color:#EEF2F8}}
:root[data-theme="dark"] input.code-saisie::placeholder{color:#3A4C6E}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) input.code-saisie::placeholder{color:#3A4C6E}}
:root[data-theme="dark"] .carte-code .code-retour a{color:#A8B4C8}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .carte-code .code-retour a{color:#A8B4C8}}

/* ---- gestion des comptes : « Sécurité de la connexion » ---- */
.carte.securite{margin-top:18px}
.carte.securite h2{margin:0 0 6px;font-size:22px}
.carte.securite .aide{margin:0}
.securite-form{display:grid;gap:10px;margin-top:6px}
.securite-form label{margin:8px 0 0}
.securite-form select{margin:0}
@media (min-width:700px){.securite-form{grid-template-columns:minmax(0,1fr) auto;align-items:end}.securite-form label{grid-column:1/-1}.securite-form .bouton{width:auto;min-width:180px}}

/* lot 16, relecture : les petits boutons des listes de relances (fiche dossier, fiche client) font au moins 44 px */
.relances-client .mini,.relances-dossier .mini{min-height:44px;padding:0 12px}


/* ===== Lot 16-K : corbeille des clients, des comptes de l'équipe et des espaces clients ; total de la période dans la liste des dossiers ===== */
/* les quatre onglets de la page Corbeille : la couleur de chaque corbeille (--oc) est posée sur l'onglet (règles .onglets.etats existantes) */
.corbeille-onglets{margin-bottom:16px}
/* une fiche client, un compte ou un espace dans la corbeille : la même carte que les dossiers de la corbeille, avec un liseré de la couleur du volet */
.corbeille-item{background:var(--carte);border:1px solid var(--trait);border-left:6px solid var(--c,#8E44AD);border-radius:var(--r);padding:18px;margin-bottom:12px;box-shadow:0 10px 30px -24px rgba(18,32,58,.45)}
.corbeille-client{--c:#8E44AD}
.corbeille-espace{--c:#00ADEF}
.corbeille-item .compte-tete h3{display:flex;align-items:center;gap:10px;margin:0;font-size:20px}
.corbeille-item .compte-tete h3 .avatar{width:40px;height:40px;font-size:16px;background:var(--c,var(--primaire));color:#fff}
.corbeille-item .compte-infos dd b{color:var(--rouge)}
.corbeille-item .compte-infos dd a{color:var(--primaire)}
/* les gestes : Restaurer (plein), Supprimer définitivement (creux rouge), Voir (creux) ; chacun 48 px au moins */
.corbeille-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px;align-items:flex-start}
.corbeille-actions form{margin:0}
.corbeille-actions .bouton{min-height:48px;padding:0 16px;width:auto}
/* « Supprimer définitivement » un compte de l'équipe : le choix du compte qui reprend ses dossiers, puis le bouton */
.corbeille-purger.avec-choix,.tout-purger.avec-choix{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end}
.corbeille-choix{display:grid;gap:4px;align-content:start;flex:1 1 220px;min-width:0}
.corbeille-choix label{font-size:16px;color:var(--gris);margin:0}
.corbeille-choix select{margin:0;min-height:48px;width:100%}
/* « Tout supprimer définitivement (N) », sous le texte d'explication du volet */
.tout-purger{margin-top:12px}
.tout-purger .bouton{width:auto;padding:0 18px;min-height:48px}
/* le bandeau « dans la corbeille » en tête d'une fiche client ou d'un espace : le texte, puis Restaurer et le lien vers la Corbeille */
.corbeille-bandeau{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px}
.corbeille-bandeau span{flex:1 1 260px}
.corbeille-bandeau form{margin:0}
.corbeille-bandeau .bouton{min-height:48px;padding:0 16px;width:auto}
/* « Mettre ce client à la corbeille », en bas de la fiche client */
#corbeille-client .bouton{width:auto;min-height:48px;padding:0 18px}
/* le total de la période, sous « N dossiers » dans la liste des dossiers : vendu, encaissé, reste, le nombre de dossiers et la période, puis le lien vers les statistiques */
.total-periode{display:flex;flex-wrap:wrap;align-items:center;gap:6px 18px;margin:0 0 12px;padding:12px 16px;font-size:16px;color:var(--gris);border:2px solid transparent;border-radius:var(--r);
  background:linear-gradient(var(--carte),var(--carte)) padding-box,linear-gradient(135deg,#2E3193 0%,#00ADEF 55%,#E4442A 100%) border-box}
.total-periode b{color:var(--texte);font-family:var(--mono);font-variant-numeric:tabular-nums;font-weight:700}
.total-periode .tp-vendu b{font-size:18px;color:#2E3193}
.total-periode .tp-periode{flex-basis:100%;font-size:16px}
.total-periode .tp-stats{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border:1px solid var(--trait);border-radius:999px;color:var(--primaire);font-weight:600;text-decoration:none;background:var(--champ)}
/* mode sombre, écrit deux fois : le réglage de l'application, puis celui du téléphone */
:root[data-theme="dark"] .total-periode .tp-vendu b{color:#9BB3FF}
:root[data-theme="dark"] .corbeille-item .compte-infos dd b{color:#FFB3A1}
:root[data-theme="dark"] .corbeille-item .compte-infos dd a{color:#9BB3FF}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .total-periode .tp-vendu b{color:#9BB3FF}
  :root:not([data-theme="light"]) .corbeille-item .compte-infos dd b{color:#FFB3A1}
  :root:not([data-theme="light"]) .corbeille-item .compte-infos dd a{color:#9BB3FF}
}
/* téléphone : les gestes de la corbeille s'empilent sur toute la largeur */
@media (max-width:599px){
  .corbeille-actions{flex-direction:column;align-items:stretch}
  .corbeille-actions .bouton,.corbeille-bandeau .bouton,#corbeille-client .bouton,.tout-purger .bouton{width:100%}
  .corbeille-purger.avec-choix,.tout-purger.avec-choix{flex-direction:column;align-items:stretch}
  .corbeille-choix{flex:0 0 auto}                     /* en colonne, la base de 220 px deviendrait une hauteur : le choix garde sa taille naturelle */
  .corbeille-bandeau form,.corbeille-bandeau .bouton{flex:1 1 100%}
}