/* SAV Dashboard ROUSSEY ET FILS */
/* Skip link */
.skip-link{position:absolute;top:-100px;left:16px;background:var(--primary);color:#fff;padding:12px 20px;border-radius:8px;z-index:9999;font-size:14px;font-weight:600;text-decoration:none;transition:top .2s}
.skip-link:focus{top:16px}
/* Loading spinner */
.loading-spinner{display:flex;align-items:center;justify-content:center;padding:40px;gap:10px;color:var(--text3);font-size:13px}
.loading-spinner::before{content:'';width:20px;height:20px;border:2px solid var(--border);border-top-color:var(--primary);border-radius:50%;animation:spin .6s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
/* Skeleton loading */
.skeleton{background:linear-gradient(90deg,var(--card) 25%,rgba(255,255,255,.06) 50%,var(--card) 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:var(--radius-sm);height:18px;margin:6px 0}
.skeleton-row{display:flex;gap:12px;padding:10px 0;border-bottom:1px solid var(--border)}
.skeleton-row .skeleton{flex:1}
@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
:root{
  --bg:#0f172a;--bg-end:#162033;--surface:rgba(30,41,59,0.85);--card:rgba(30,41,59,0.7);--card-hover:rgba(40,52,72,0.8);
  --border:rgba(255,255,255,0.06);--primary:#3b82f6;--primary-glow:#3b82f655;
  --success:#22c55e;--warning:#f59e0b;--danger:#ef4444;--purple:#a78bfa;--cyan:#22d3ee;
  --text:#e2e8f0;--text2:#94a3b8;--text3:#475569;
  --radius:24px;--radius-sm:14px;--shadow:0 4px 24px #0004;
  --glass-bg:rgba(30,41,59,0.5);--glass-border:rgba(255,255,255,0.1);--glass-blur:blur(12px);
  --touch-min:44px;
}
*{margin:0;padding:0;box-sizing:border-box}
/* 23/05/2026 fix mobile : double protection contre scroll horizontal indésirable */
html{overflow-x:hidden;max-width:100vw}
body{font-family:'Segoe UI',system-ui,sans-serif;background:linear-gradient(145deg,var(--bg) 0%,var(--bg-end) 100%);color:var(--text);min-height:100vh;overflow-x:hidden;overflow-y:scroll;max-width:100vw;position:relative}
/* Scrollbar plus visible pour usage souris (Chrome/Safari/Edge) */
::-webkit-scrollbar{width:12px;height:12px}
::-webkit-scrollbar-track{background:var(--surface);border-radius:6px}
::-webkit-scrollbar-thumb{background:var(--border);border-radius:6px;border:2px solid var(--surface)}
::-webkit-scrollbar-thumb:hover{background:var(--text3)}
::-webkit-scrollbar-corner{background:var(--surface)}
/* Firefox */
*{scrollbar-width:thin;scrollbar-color:var(--border) var(--surface)}
a{color:var(--primary);text-decoration:none}
input,select,textarea{background:var(--surface);border:1px solid var(--border);color:var(--text);padding:10px 14px;border-radius:var(--radius-sm);font-size:14px;width:100%;outline:none;transition:.2s}
input:focus,select:focus,textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-glow)}
textarea{resize:vertical;min-height:80px}
select{cursor:pointer;-webkit-appearance:menulist;appearance:menulist;padding-right:30px;background-image:none}
label{font-size:13px;color:var(--text2);margin-bottom:4px;display:block}

.header{position:fixed;top:0;left:0;right:0;height:60px;background:var(--glass-bg);border-bottom:1px solid var(--glass-border);display:flex;align-items:center;justify-content:space-between;padding:0 20px;z-index:100;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
.header-left{display:flex;align-items:center;gap:12px}
.logo-spin{animation:logoSpin 6s ease-in-out infinite;transform-style:preserve-3d}
@keyframes logoSpin{0%{transform:rotateY(0deg)}40%{transform:rotateY(360deg)}100%{transform:rotateY(360deg)}}
.logo{font-size:20px;font-weight:800;background:linear-gradient(135deg,var(--primary),var(--cyan));-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.header-date{font-size:12px;color:var(--text2);line-height:1.3;white-space:nowrap}
.header-right{display:flex;align-items:center;gap:12px}
.header-btn{background:var(--card);border:1px solid var(--glass-border);color:var(--text);padding:8px 14px;border-radius:var(--radius-sm);cursor:pointer;font-size:13px;transition:all .2s;display:flex;align-items:center;gap:6px}
.header-btn:hover{background:var(--card-hover);border-color:rgba(255,255,255,.15)}
.badge-count{background:var(--danger);color:#fff;font-size:10px;padding:2px 6px;border-radius:10px;font-weight:700}

.nav{position:fixed;top:60px;left:0;width:220px;bottom:0;background:rgba(15,23,42,.8);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-right:1px solid var(--glass-border);padding:0;z-index:90;transition:.3s;display:flex;flex-direction:column}
.nav-scroll{flex:1;overflow-y:auto;padding:8px;display:flex;flex-direction:column;gap:1px}
.nav-section-label{font-size:10px;font-weight:700;color:var(--text3);letter-spacing:.08em;text-transform:uppercase;padding:12px 14px 4px;user-select:none}
.nav-section-label:first-child{padding-top:6px}
/* ═══ Visibilite par role (data-role) ═══
 * Chaque .nav-item a un data-role="role1 role2 ..." listant les roles autorises.
 * Le body a data-user-role="..." positionne a la connexion.
 * Item masque si le role user n'est pas dans la liste. Admin voit tout. */
body[data-user-role="technicien"] [data-role]:not([data-role~="tech"]){display:none!important}
body[data-user-role="assistante"] [data-role]:not([data-role~="assist"]){display:none!important}
body[data-user-role="secretaire"] [data-role]:not([data-role~="secr"]){display:none!important}
body[data-user-role="boss"] [data-role]:not([data-role~="boss"]){display:none!important}
body[data-user-role="direction"] [data-role]:not([data-role~="direction"]){display:none!important}
/* admin : pas de restriction, voit tout (data-user-role="admin" ne cache rien) */
.nav-item{display:flex;align-items:center;gap:10px;padding:11px 14px;min-height:44px;cursor:pointer;transition:all .2s;color:var(--text2);font-size:13px;border-radius:var(--radius-sm);position:relative;border:none;background:transparent;text-align:left;font-family:inherit;box-sizing:border-box}
.nav-item:hover{background:rgba(255,255,255,.05);color:var(--text)}
.nav-item.active{background:linear-gradient(135deg,rgba(59,130,246,.15),rgba(59,130,246,.05));color:#fff;font-weight:600}
.nav-item.active::after{content:'';position:absolute;right:8px;top:50%;transform:translateY(-50%);width:5px;height:5px;border-radius:50%;background:var(--primary);box-shadow:0 0 8px var(--primary),0 0 16px var(--primary)}
.nav-svg{width:20px;height:20px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.nav-svg svg{width:18px;height:18px;stroke-width:1.8}
.nav-item span.icon{font-size:17px;width:24px;text-align:center;transition:all .2s}
.nav-item.active .nav-svg{color:var(--primary);filter:drop-shadow(0 0 8px var(--primary))}
.nav-item:not(.active) .nav-svg{color:var(--text3)}
.nav-more-item{padding:10px 16px;cursor:pointer;font-size:13px;color:var(--text);transition:.15s}
.nav-more-item:hover{background:var(--card)}

/* User profile block at bottom of sidebar */
.nav-user{display:flex;align-items:center;gap:10px;padding:14px 16px;border-top:1px solid var(--glass-border);border-left:none;border-right:none;border-bottom:none;cursor:pointer;transition:background .2s;flex-shrink:0;background:transparent;width:100%;text-align:left;font-family:inherit;color:inherit}
.nav-user:hover{background:rgba(255,255,255,.05)}
.nav-user-avatar{width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,var(--primary),var(--cyan));display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;color:#fff;flex-shrink:0}
.nav-user-info{overflow:hidden}
.nav-user-name{font-size:13px;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nav-user-role{font-size:10px;color:var(--text3);text-transform:capitalize}

.content{margin-left:220px;margin-top:60px;padding:24px;min-height:calc(100vh - 60px)}
/* Sidebar masquee (desktop uniquement, mobile gere par @media plus bas) */
body.nav-collapsed .nav{transform:translateX(-100%);pointer-events:none}
body.nav-collapsed .content{margin-left:0}
.page{display:none}.page.active{display:block}
h2.page-title,div.page-title,.page-title{font-size:24px;font-weight:700;margin:0 0 20px 0;display:flex;align-items:center;gap:10px}

.stats-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;margin-bottom:24px}
.stat-card{background:var(--card);border:1px solid var(--glass-border);border-radius:var(--radius);padding:20px;position:relative;overflow:hidden;transition:all .3s ease;backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur)}
.stat-card:hover{transform:translateY(-3px);box-shadow:0 12px 40px rgba(0,0,0,.3);border-color:rgba(255,255,255,.15)}
.stat-card[onclick]{cursor:pointer}
.stat-card .stat-icon{font-size:28px;margin-bottom:8px}
.stat-card .stat-value{font-size:28px;font-weight:800}
.stat-card .stat-label{font-size:12px;color:var(--text2);margin-top:4px}
.stat-card.blue{box-shadow:0 1px 0 var(--primary),inset 0 -1px 0 var(--primary)}.stat-card.green{box-shadow:0 1px 0 var(--success),inset 0 -1px 0 var(--success)}
.stat-card.amber{box-shadow:0 1px 0 var(--warning),inset 0 -1px 0 var(--warning)}.stat-card.red{box-shadow:0 1px 0 var(--danger),inset 0 -1px 0 var(--danger)}
.stat-card.purple{box-shadow:0 1px 0 var(--purple),inset 0 -1px 0 var(--purple)}.stat-card.cyan{box-shadow:0 1px 0 var(--cyan),inset 0 -1px 0 var(--cyan)}
.stat-card.blue:hover{box-shadow:0 12px 40px rgba(59,130,246,.15)}.stat-card.green:hover{box-shadow:0 12px 40px rgba(34,197,94,.15)}
.stat-card.amber:hover{box-shadow:0 12px 40px rgba(245,158,11,.15)}.stat-card.red:hover{box-shadow:0 12px 40px rgba(239,68,68,.15)}
.stat-card.purple:hover{box-shadow:0 12px 40px rgba(167,139,250,.15)}.stat-card.cyan:hover{box-shadow:0 12px 40px rgba(34,211,238,.15)}

.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.grid-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px}

.section{background:var(--card);border:1px solid var(--glass-border);border-radius:var(--radius);padding:20px;margin-bottom:20px;backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur)}
.section-title{font-size:16px;font-weight:700;margin-bottom:16px;display:flex;align-items:center;justify-content:space-between}
.section-title .count{font-size:12px;background:var(--primary);color:#fff;padding:2px 8px;border-radius:10px}

.btn{min-height:44px;padding:12px 20px;border:none;border-radius:var(--radius-sm);cursor:pointer;font-size:15px;font-weight:600;transition:.2s;display:inline-flex;align-items:center;justify-content:center;gap:6px}
.btn:hover{transform:translateY(-1px)}
.btn:active{transform:translateY(0)}
.btn-primary{background:var(--primary);color:#fff}.btn-primary:hover{background:#2563eb}
.btn-success{background:var(--success);color:#fff}.btn-success:hover{background:#16a34a}
.btn-warning{background:var(--warning);color:#000}.btn-warning:hover{background:#d97706}
.btn-danger{background:var(--danger);color:#fff}.btn-danger:hover{background:#dc2626}
.btn-ghost{background:transparent;color:var(--text2);border:1px solid var(--border)}.btn-ghost:hover{color:var(--text);border-color:var(--text2)}
.btn-sm{min-height:36px;padding:8px 14px;font-size:13px}
.btn-lg{min-height:56px;padding:16px 28px;font-size:17px;font-weight:700}
.btn-block{width:100%;justify-content:center}
.btn:disabled{opacity:.5;cursor:not-allowed;transform:none!important}

/* Badges de modification post-signature */
.mod-badge{display:inline-flex;align-items:center;gap:4px;padding:3px 9px;border-radius:10px;font-size:11px;font-weight:700;line-height:1.4;white-space:nowrap;vertical-align:middle;margin-left:6px}
.mod-badge-minor{background:rgba(59,130,246,.15);color:#3b82f6;border:1px solid rgba(59,130,246,.35)}
.mod-badge-major{background:rgba(239,68,68,.15);color:#ef4444;border:1px solid rgba(239,68,68,.4);animation:pulseUrgent 2.5s ease-in-out infinite}
.mod-badge-resigned{background:rgba(34,197,94,.15);color:#22c55e;border:1px solid rgba(34,197,94,.35)}

/* Empty states — informatifs et actionnables */
.empty,.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:40px 24px;color:var(--text2);background:var(--surface);border:1px dashed var(--border);border-radius:var(--radius);margin:12px 0}
.empty-state .empty-icon{font-size:48px;margin-bottom:12px;opacity:.7;filter:grayscale(.3)}
.empty-state h3{margin:0 0 6px;font-size:16px;color:var(--text);font-weight:600}
.empty-state p{margin:0 0 18px;font-size:13px;color:var(--text3);max-width:340px;line-height:1.5}
.empty-state .btn{margin-top:4px}
.empty p{margin:0;font-size:13px}
@media(max-width:768px){.empty-state{padding:28px 16px}.empty-state .empty-icon{font-size:40px}}

/* Tooltip d'aide contextuelle */
.help-tip{display:inline-flex;width:18px;height:18px;border-radius:50%;background:var(--text3);color:#fff;font-size:11px;font-weight:700;align-items:center;justify-content:center;cursor:help;position:relative;margin-left:6px;vertical-align:middle;user-select:none;transition:.2s}
.help-tip:hover{background:var(--primary);transform:scale(1.1)}
.help-tip:hover::after{content:attr(data-tip);position:absolute;bottom:130%;left:50%;transform:translateX(-50%);background:#0f172a;color:#fff;padding:8px 12px;border-radius:6px;width:240px;font-size:12px;font-weight:400;line-height:1.4;box-shadow:0 4px 16px #000a;z-index:9999;pointer-events:none;text-align:left;border:1px solid var(--border)}
.help-tip:hover::before{content:'';position:absolute;bottom:130%;left:50%;transform:translateX(-50%) translateY(8px);border:5px solid transparent;border-top-color:#0f172a;z-index:9999}
@media(max-width:768px){.help-tip:hover::after{width:200px;font-size:11px}}

/* Breadcrumb / Fil d'Ariane */
.breadcrumb{display:flex;align-items:center;gap:8px;padding:10px 18px;margin:0 0 14px;font-size:13px;color:var(--text2);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);flex-wrap:wrap}
.breadcrumb a{color:var(--text2);text-decoration:none;transition:color .2s;padding:2px 4px;border-radius:4px}
.breadcrumb a:hover{color:var(--primary);background:rgba(59,130,246,.08)}
.breadcrumb .bc-sep{color:var(--text3);font-weight:300;user-select:none}
.breadcrumb .bc-section{color:var(--text3);font-style:italic}
.breadcrumb .bc-current{color:var(--text);font-weight:600}
@media(max-width:768px){.breadcrumb{font-size:12px;padding:8px 12px;margin-bottom:10px}}
.header-desktop-only{}
@media(max-width:768px){
  .header-desktop-only{display:none!important}
  .btn{min-height:48px;font-size:16px}
  .btn-lg{min-height:60px;font-size:18px}
  .btn-sm{min-height:40px;padding:10px 14px!important;font-size:14px!important}
  input,select,textarea{font-size:16px!important;min-height:48px}
  .detail-grid{grid-template-columns:1fr!important}
  .sig-grid-responsive{grid-template-columns:1fr!important}
  .grid-2{grid-template-columns:1fr!important}
  .dash-pipeline-row{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .page-title{font-size:1.1rem!important}
}
/* ═══ ROLE DASHBOARDS ═══ */
.dash-role-section{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:14px;margin-bottom:14px}
.dash-role-title{font-size:13px;font-weight:800;margin-bottom:10px;display:flex;align-items:center;gap:6px}
.dash-kpi-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(90px,1fr));gap:8px;margin-bottom:14px}
.dash-kpi-box{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:12px 8px;text-align:center;cursor:pointer;transition:transform .15s}
.dash-kpi-box:active{transform:scale(0.96)}
.dash-kpi-num{font-size:28px;font-weight:900}
.dash-kpi-label{font-size:10px;font-weight:700;color:var(--text2);margin-top:2px}
.dash-big-btn{min-height:52px;font-size:15px;font-weight:700;flex:1;text-align:center;display:flex;align-items:center;justify-content:center;gap:6px;border-radius:10px;border:none;cursor:pointer;transition:transform .1s}
.dash-big-btn:active{transform:scale(0.95)}
.dash-team-row{display:flex;align-items:center;gap:10px;padding:8px 0}
.dash-team-bar{width:50px;height:6px;background:var(--border);border-radius:3px;flex-shrink:0}
.dash-team-fill{height:100%;background:var(--success);border-radius:3px}
/* ═══ TECH ═══ */
.tech-day-card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:14px;margin-bottom:10px;cursor:pointer;transition:all .15s;position:relative}
.tech-day-card:active{transform:scale(0.98)}
.tech-day-card.done{opacity:0.5}
.tech-day-time{font-size:18px;font-weight:900;color:var(--primary)}
.tech-day-client{font-size:16px;font-weight:700}
.tech-day-meta{font-size:12px;color:var(--text2);margin-top:4px}
.tech-day-actions{display:flex;gap:8px;margin-top:10px}
/* ═══ SECRETARY ═══ */
.sec-hero-call{cursor:pointer;background:linear-gradient(135deg,var(--primary),#2563eb);border-radius:16px;padding:20px;text-align:center;margin-bottom:16px;box-shadow:0 4px 20px rgba(59,130,246,0.3)}
.sec-hero-call:active{transform:scale(0.98)}
.sec-search{width:100%;padding:14px 16px;font-size:16px;border-radius:12px;border:2px solid var(--border);background:var(--surface);color:var(--text);outline:none;transition:border .2s}
.sec-search:focus{border-color:var(--primary)}
/* ═══ BOSS ═══ */
.boss-kpi-hero{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;margin-bottom:16px}
.boss-kpi-card{background:var(--card);border-radius:12px;padding:16px;text-align:center;border:1px solid var(--border)}
.boss-kpi-val{font-size:32px;font-weight:900}
.boss-kpi-sub{font-size:11px;color:var(--text3);margin-top:2px}
/* ═══ NOTIF LIVE ═══ */
.notif-feed{max-height:200px;overflow-y:auto}
.notif-item{padding:8px 0;border-bottom:1px solid var(--border);font-size:12px;display:flex;gap:8px;align-items:flex-start}
.notif-time{font-size:10px;color:var(--text3);flex-shrink:0;min-width:40px}

.tech-fab{position:fixed;bottom:80px;right:16px;z-index:100;display:flex;flex-direction:column;gap:8px;align-items:flex-end}
.tech-fab-btn{width:56px;height:56px;border-radius:50%;border:none;font-size:22px;color:#fff;cursor:pointer;box-shadow:0 4px 16px rgba(0,0,0,0.3);display:flex;align-items:center;justify-content:center;transition:transform .15s}
.tech-fab-btn:active{transform:scale(0.92)}
.tech-fab-main{width:64px;height:64px;font-size:26px;background:linear-gradient(135deg,var(--primary),#2563eb);position:relative}
.tech-fab-badge{position:absolute;top:-4px;right:-4px;min-width:22px;height:22px;padding:0 6px;border-radius:11px;background:#dc2626;color:#fff;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;border:2px solid var(--bg, #0f172a);box-shadow:0 2px 6px rgba(0,0,0,.4)}
.tech-fab-label{position:absolute;right:72px;top:50%;transform:translateY(-50%);background:rgba(15,23,42,.95);color:#fff;padding:6px 10px;border-radius:8px;font-size:12px;font-weight:600;white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .15s;border:1px solid rgba(255,255,255,.1)}
.tech-fab:hover .tech-fab-label{opacity:1}
.tech-fab-secondary{width:48px;height:48px;font-size:18px;background:var(--success)}
.tech-fab-warn{width:48px;height:48px;font-size:18px;background:var(--warning)}
.tech-rdv-card{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:12px;margin-bottom:8px;cursor:pointer;transition:all .15s}
.tech-rdv-card:active{transform:scale(0.98);background:var(--card-hover)}
.inter-filter-btn{background:var(--card);border:1px solid var(--border);color:var(--text2);transition:all .15s;flex-shrink:0;white-space:nowrap}
/* Layout dashboard tech : empilement vertical par defaut (mobile-first) */
#dashTechLayout{display:flex;flex-direction:column;gap:14px}
#dashTechLayout > #dashRoleView,
#dashTechLayout > #dashRightCol,
#dashTechLayout > #dashboardWidgetsZone{min-width:0}
#dashTechLayout > #dashRightCol{display:flex;flex-direction:column;gap:0}
#dashTechLayout > #dashRightCol > #dashRdvSection{margin-bottom:0}
#dashTechLayout.dash-calendar-collapsed > #dashRightCol > #dashRdvSection{display:none}
/* Mode 2 colonnes : optionnel (legacy, declenche par classList.add('tech-2col')) */
/* Layout tech 2 colonnes : EQUILIBRE 50/50 + separateur visuel au milieu (decision Boss 04/05).
   Avant : 1.6fr / 1fr (62/38 desequilibre). Apres : 1fr / 1fr avec border-right discret.
   FIX 04/05 v2 : col gauche contient maintenant un wrapper #dashLeftCol (interventions + Atelier
   deplace par JS pour combler le vide a gauche). */
#dashTechLayout.tech-2col{display:grid;grid-template-columns:minmax(340px,1fr) minmax(280px,1fr);gap:24px;align-items:flex-start}
#dashTechLayout.tech-2col > #dashLeftCol{border-right:1px solid var(--border);padding-right:24px;margin-right:-12px;display:flex;flex-direction:column;gap:14px;min-width:0}
#dashTechLayout.tech-2col.dash-calendar-collapsed{grid-template-columns:1fr}
#dashTechLayout.tech-2col.dash-calendar-collapsed > #dashLeftCol{border-right:none;padding-right:0;margin-right:0}

/* Sur petits ecrans (<900px) : repasse en 1 colonne pour eviter ecrasement */
@media (max-width:900px){
  #dashTechLayout.tech-2col{grid-template-columns:1fr;gap:14px}
  #dashTechLayout.tech-2col > #dashLeftCol{border-right:none;padding-right:0;margin-right:0}
  /* 25/05/2026 REFONTE Boss : sur portrait/tablette, Prochain RDV en 1er.
     On reordonne en flex et n'extrait QUE dashTechAction (pas le calendrier
     ni les pieces qui sont moins urgents le matin). */
  #dashTechLayout.tech-2col > #dashRightCol{
    order:-1;
    display:flex;
    flex-direction:column;
  }
  #dashTechLayout.tech-2col > #dashRightCol > #dashTechAction{
    order:-1;
  }
  #dashTechLayout.tech-2col > #dashRightCol > #dashRdvSection{
    order:10;  /* Calendrier en bas (tech a deja sa liste interventions) */
  }
  #dashTechLayout.tech-2col > #dashRightCol > #dashTechPieces{
    order:11;
  }
}
@media (max-width:900px){#dashTechLayout.tech-2col{grid-template-columns:1fr}}
.inter-filter-btn.active{background:var(--primary);border-color:var(--primary);color:#fff}
.inter-sect-btn{background:var(--card);border:1px solid var(--border);color:var(--text2);transition:all .15s;font-size:11px;padding:3px 10px}
.inter-sect-btn.active{background:var(--cyan);border-color:var(--cyan);color:#fff}
/* Chips de filtres dashboard — pills lisibles et respirables */
.dash-filter-bar{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-bottom:14px;padding:8px;background:var(--surface);border:1px solid var(--border);border-radius:10px}
.dash-filter-group{display:flex;flex-wrap:wrap;gap:5px;align-items:center}
.dash-filter-sep{width:1px;align-self:stretch;background:var(--border);margin:2px 4px}
.dash-inter-filter{background:transparent;border:1px solid var(--border);color:var(--text2);padding:6px 12px;border-radius:18px;font-size:12px;font-weight:600;cursor:pointer;transition:all .18s;display:inline-flex;align-items:center;gap:5px;line-height:1.2;white-space:nowrap}
.dash-inter-filter:hover{background:var(--card);border-color:var(--text2);color:var(--text);transform:translateY(-1px)}
.dash-inter-filter.active{background:var(--primary);border-color:var(--primary);color:#fff;box-shadow:0 2px 6px rgba(59,130,246,.35)}
.dash-inter-filter.active:hover{transform:translateY(-1px);background:#2563eb}
.dash-inter-filter .chip-count{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:rgba(0,0,0,.25);color:#fff;font-size:10px;font-weight:800;margin-left:2px}
.dash-filter-urgent{border-color:var(--danger);color:var(--danger)}
.dash-filter-urgent:hover{background:rgba(239,68,68,.08);border-color:var(--danger);color:var(--danger)}
.dash-filter-urgent.active{background:var(--danger);border-color:var(--danger);color:#fff;box-shadow:0 2px 8px rgba(239,68,68,.4);animation:pulseUrgent 2s ease-in-out infinite}
.dash-filter-urgent.active:hover{background:#dc2626}
.dash-filter-urgent .chip-count{background:#fff;color:var(--danger)}
.dash-filter-urgent.active .chip-count{background:rgba(255,255,255,.95);color:var(--danger)}
@keyframes pulseUrgent{0%,100%{box-shadow:0 2px 8px rgba(239,68,68,.4)}50%{box-shadow:0 2px 14px rgba(239,68,68,.7)}}
@media(max-width:768px){.dash-inter-filter{font-size:13px;padding:7px 12px;min-height:36px}.dash-filter-bar{padding:6px;gap:5px}}
/* 20/05/2026 audit Boss : 5 interventions visibles + scroll pour drag/drop
   vers le calendrier (sinon il faut descendre toute la page pour voir le
   widget calendrier en dessous). max-height ~ 5 cartes * 90px + marges. */
.dash-inter-scroll{padding-right:4px;max-height:520px;overflow-y:auto}
.dash-inter-scroll::-webkit-scrollbar{width:6px}
.dash-inter-scroll::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}
.dash-inter-scroll::-webkit-scrollbar-thumb:hover{background:var(--text3)}
#dashInter{max-height:500px;overflow-y:auto;padding-right:4px}
#dashInter::-webkit-scrollbar{width:6px}
#dashInter::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}
#dashInter .card-item{margin-bottom:8px}
.nav-more-btn{display:none}
@media(min-width:769px) and (max-width:1024px){
  #navMorePanel{left:60px!important;right:auto!important;bottom:0!important;top:0!important;width:240px;border-radius:0!important;border-right:1px solid var(--border)!important;border-top:none!important}
  #navMoreOverlay{z-index:190!important}
  #navMorePanel{z-index:195!important}
}
.nav-more-item{display:flex;flex-direction:column;align-items:center;gap:5px;padding:14px 8px;border-radius:var(--radius-sm);cursor:pointer;font-size:11px;color:var(--text2);transition:all .15s;border:1px solid transparent}
.nav-more-item:hover,.nav-more-item:active{background:var(--card);border-color:var(--glass-border);color:var(--text)}

.badge{display:inline-block;padding:4px 10px;border-radius:20px;font-size:11px;font-weight:700}
.badge-blue{background:#3b82f622;color:var(--primary)}
.badge-green{background:#22c55e22;color:var(--success)}
.badge-amber{background:#f59e0b22;color:var(--warning)}
.badge-red{background:#ef444422;color:var(--danger)}
.badge-purple{background:#a78bfa22;color:var(--purple)}
.badge-cyan{background:#22d3ee22;color:var(--cyan)}
.badge-teal{background:#14b8a622;color:#14b8a6}
.badge-orange{background:#f9731622;color:#f97316}

.table-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse}
th{text-align:left;padding:12px;font-size:12px;color:var(--text2);border-bottom:1px solid var(--border);font-weight:600;text-transform:uppercase;letter-spacing:.5px}
td{padding:12px;border-bottom:1px solid var(--border);font-size:14px}
tr:hover td{background:var(--card-hover)}
.td-actions{display:flex;gap:6px}

.card{background:var(--card);border:1px solid var(--glass-border);border-radius:var(--radius);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur)}

.card-list{display:flex;flex-direction:column;gap:12px}
.card-item{background:var(--card);border:1px solid var(--glass-border);border-radius:var(--radius-sm);padding:16px;transition:all .2s ease;cursor:pointer;backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur)}
.card-item:hover{border-color:rgba(255,255,255,.15);background:var(--card-hover);transform:translateY(-1px)}
.card-item-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.card-item-title{font-weight:600;font-size:15px}
.card-item-body{font-size:13px;color:var(--text2);line-height:1.5}
.card-item-footer{display:flex;justify-content:space-between;align-items:center;margin-top:12px;font-size:12px;color:var(--text3)}

.card-item[draggable="true"]{cursor:grab;touch-action:none}
.card-item[draggable="true"]:active{cursor:grabbing}
.card-item.dragging{opacity:0.4;transform:scale(0.95);border:2px dashed var(--primary)}
.dash-drop-zone{min-height:60px;transition:all .2s ease;border-radius:var(--radius-sm)}
.dash-drop-zone.drag-over{background:rgba(59,130,246,0.08);border:2px dashed var(--primary);border-radius:var(--radius-sm)}
.dash-drop-hint{display:none;text-align:center;padding:12px;font-size:12px;color:var(--primary);font-weight:600}
.dash-drop-zone.drag-over .dash-drop-hint{display:block}
.agenda-row.agenda-drop-target{background:rgba(59,130,246,0.1);border-radius:6px;outline:2px dashed var(--primary);outline-offset:-2px;transition:all .15s}
.agenda-row.agenda-drop-target .agenda-hour{color:var(--primary);font-weight:800}
.agenda-event[draggable="true"]{cursor:grab;touch-action:none}
.agenda-event[draggable="true"]:active{cursor:grabbing}

.toolbar{display:flex;gap:12px;margin-bottom:20px;flex-wrap:wrap;align-items:center}
.toolbar .search-input{max-width:300px}
.toolbar select{max-width:180px}

.modal-overlay{position:fixed;inset:0;background:#000a;z-index:200;display:none;align-items:center;justify-content:center;padding:20px}
.modal-overlay.show{display:flex}
.modal{background:var(--surface);border:1px solid var(--glass-border);border-radius:var(--radius);width:100%;max-width:700px;max-height:90vh;overflow:hidden;padding:0;backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);display:flex;flex-direction:column}
.modal-header{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;border-bottom:1px solid var(--border);background:var(--surface);z-index:1;flex-shrink:0}
.modal-header h3{font-size:18px;font-weight:700}
.modal-close{background:none;border:none;color:var(--text2);font-size:24px;cursor:pointer;padding:4px 8px;border-radius:6px}
.modal-close:hover{background:var(--card);color:var(--text)}
.modal-body{padding:24px;overflow-y:auto;flex:1;-webkit-overflow-scrolling:touch}
.modal-footer{padding:16px 24px;border-top:1px solid var(--border);display:flex;justify-content:flex-end;gap:10px;background:var(--surface);flex-shrink:0}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}
.form-group{margin-bottom:16px}
.autocomplete-wrap{position:relative}
.autocomplete-dropdown{position:absolute;top:100%;left:0;right:0;background:var(--card);border:1px solid var(--primary);border-radius:var(--radius-sm);z-index:9999;max-height:220px;overflow-y:auto;box-shadow:0 8px 24px #0006;display:none}
.autocomplete-dropdown.open{display:block}
.ac-item{padding:10px 14px;cursor:pointer;font-size:14px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between}
.ac-item:hover,.ac-item.ac-active{background:var(--card-hover);color:var(--primary)}
.ac-item .ac-sub{font-size:11px;color:var(--text3)}
.ac-create{padding:10px 14px;cursor:pointer;font-size:13px;color:var(--success);font-weight:600;border-top:1px solid var(--border)}
.ac-create:hover{background:var(--card-hover)}
.sac-wrap{position:relative;display:block;z-index:1}
.sac-wrap:focus-within{z-index:100}
.sac-input{width:100%;cursor:pointer}
.sac-dropdown{position:absolute;top:100%;left:0;right:0;background:var(--surface);border:1px solid var(--primary);border-radius:10px;z-index:9999;max-height:200px;overflow-y:auto;box-shadow:0 8px 24px #0006;display:none;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.sac-dropdown.open{display:block}
.sac-item{padding:9px 14px;cursor:pointer;font-size:13px;border-bottom:1px solid var(--border)}
.sac-item:hover,.sac-item.sac-active{background:var(--primary);color:#fff}
.sac-empty{padding:10px 14px;font-size:13px;color:var(--text3)}

.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:20px}
.detail-item{padding:12px;background:var(--card);border-radius:var(--radius-sm)}
.detail-item label{font-size:11px;color:var(--text3);text-transform:uppercase;letter-spacing:.5px}
.detail-item .val{font-size:15px;font-weight:600;margin-top:4px}
.detail-item .val a{white-space:nowrap}
.modal-footer{flex-wrap:wrap}
.modal-footer .btn{flex:1;min-width:100px;justify-content:center;font-size:13px;padding:10px 12px}

.timeline{position:relative;padding-left:24px;margin:16px 0}
.timeline::before{content:'';position:absolute;left:8px;top:0;bottom:0;width:2px;background:var(--border)}
.timeline-item{position:relative;margin-bottom:16px;padding-left:16px}
.timeline-item::before{content:'';position:absolute;left:-20px;top:6px;width:12px;height:12px;border-radius:50%;background:var(--primary);border:2px solid var(--surface)}
.timeline-item .t-date{font-size:11px;color:var(--text3)}
.timeline-item .t-text{font-size:13px;margin-top:2px}

.timer-widget{position:fixed;bottom:24px;right:24px;background:var(--surface);border:2px solid var(--primary);border-radius:var(--radius);padding:16px 20px;z-index:150;display:none;box-shadow:0 8px 32px #0008;min-width:240px}
.timer-widget.show{display:block}
.timer-display{font-size:32px;font-weight:800;font-family:'Courier New',monospace;text-align:center;color:var(--primary);margin:8px 0}
.timer-label{font-size:12px;color:var(--text2);text-align:center}
.timer-btns{display:flex;gap:8px;margin-top:12px}
.timer-btns .btn{flex:1;justify-content:center}

.search-overlay{position:fixed;inset:0;background:#000c;z-index:300;display:none;padding:60px 20px 20px}
.search-overlay.show{display:block}
.search-box{max-width:600px;margin:0 auto}
.search-box input{font-size:18px;padding:16px 20px;border-radius:var(--radius);background:var(--surface);border:2px solid var(--primary)}
.search-results{max-width:600px;margin:12px auto;max-height:60vh;overflow-y:auto}
.search-result-item{padding:14px 16px;background:var(--card);border:1px solid var(--border);margin-bottom:4px;border-radius:var(--radius-sm);cursor:pointer;transition:.2s}
.search-result-item:hover{border-color:var(--primary);background:var(--card-hover)}
.search-result-type{font-size:10px;text-transform:uppercase;color:var(--primary);font-weight:700}
.search-result-title{font-size:14px;font-weight:600;margin-top:2px}
.search-result-desc{font-size:12px;color:var(--text2);margin-top:2px}

.chart-container{background:var(--card);border:1px solid var(--glass-border);border-radius:var(--radius);padding:20px;backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur)}
.chart-container h4{margin-bottom:16px;font-size:15px}
canvas{width:100%!important;border-radius:var(--radius-sm)}

.print-overlay{position:fixed;inset:0;background:#fff;z-index:400;display:none;overflow-y:auto;color:#000}
.print-overlay.show{display:block}
.print-content{max-width:1100px;margin:0 auto;padding:30px 40px}
.print-header{text-align:center;border-bottom:3px solid #333;padding-bottom:20px;margin-bottom:30px}
.print-header h1{font-size:24px;color:#333}
.print-header p{color:#666;margin-top:4px}
.print-table{width:100%;border-collapse:collapse;margin:20px 0}
.print-table th,.print-table td{border:1px solid #ddd;padding:10px;text-align:left}
.print-table th{background:#f5f5f5;font-weight:700}
.print-total{text-align:right;font-size:18px;margin-top:16px}
.print-actions{position:fixed;top:20px;right:20px;display:flex;gap:10px;z-index:401}
.print-actions .btn{box-shadow:0 2px 8px #0003}

.alert{padding:12px 16px;border-radius:var(--radius-sm);margin-bottom:12px;font-size:13px;display:flex;align-items:center;gap:8px}
.alert-warn{background:#f59e0b18;border:1px solid #f59e0b44;color:var(--warning)}
.alert-danger{background:#ef444418;border:1px solid #ef444444;color:var(--danger)}
.alert-info{background:#3b82f618;border:1px solid #3b82f644;color:var(--primary)}

.empty{text-align:center;padding:60px 20px;color:var(--text3)}
.empty .empty-icon{font-size:48px;margin-bottom:12px}
.empty p{font-size:14px}

.quick-actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin-bottom:24px}
.quick-action{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius);padding:18px 16px;text-align:center;cursor:pointer;transition:all .3s ease;backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);position:relative;overflow:hidden}
.quick-action::after{content:'';position:absolute;bottom:0;left:20%;right:20%;height:2px;border-radius:1px;opacity:0;transition:opacity .3s}
.quick-action:hover{transform:translateY(-3px);border-color:rgba(255,255,255,.18)}
.quick-action:hover::after{opacity:1}
.quick-action:nth-child(1){border-color:rgba(59,130,246,.25)}.quick-action:nth-child(1):hover{box-shadow:0 8px 32px rgba(59,130,246,.15)}.quick-action:nth-child(1)::after{background:var(--primary);box-shadow:0 0 12px var(--primary)}
.quick-action:nth-child(2){border-color:rgba(249,115,22,.25)}.quick-action:nth-child(2):hover{box-shadow:0 8px 32px rgba(249,115,22,.15)}.quick-action:nth-child(2)::after{background:#f97316;box-shadow:0 0 12px #f97316}
.quick-action:nth-child(3){border-color:rgba(34,197,94,.25)}.quick-action:nth-child(3):hover{box-shadow:0 8px 32px rgba(34,197,94,.15)}.quick-action:nth-child(3)::after{background:var(--success);box-shadow:0 0 12px var(--success)}
.quick-action .qa-icon{font-size:26px;margin-bottom:6px;transition:transform .3s,filter .3s}
.quick-action:hover .qa-icon{transform:scale(1.15)}
.quick-action:nth-child(1) .qa-icon{filter:drop-shadow(0 0 8px rgba(59,130,246,.5))}
.quick-action:nth-child(2) .qa-icon{filter:drop-shadow(0 0 8px rgba(249,115,22,.5))}
.quick-action:nth-child(3) .qa-icon{filter:drop-shadow(0 0 8px rgba(34,197,94,.5))}
.quick-action .qa-text{font-size:12px;color:var(--text2);font-weight:600}

@media(max-width:1024px){
  .nav{top:auto!important;bottom:8px!important;left:8px!important;right:8px!important;width:auto!important;height:auto!important;display:flex!important;padding:6px 8px!important;overflow-x:auto!important;overflow-y:hidden!important;-webkit-overflow-scrolling:touch;border-right:none!important;border-top:none!important;border-radius:var(--radius)!important;border:1px solid var(--glass-border)!important;box-shadow:0 8px 32px rgba(0,0,0,.4);gap:0;flex-direction:row!important;flex-wrap:nowrap!important}
  .nav-scroll{display:contents}
  .nav-item{flex-direction:column;padding:6px 2px;font-size:10px;min-width:48px;min-height:44px;border-radius:var(--radius-sm);gap:2px;flex:0 0 auto;justify-content:center}
  .nav-item.active{background:rgba(59,130,246,.12);box-shadow:0 0 16px rgba(59,130,246,.15)}
  .nav-item.active::after{display:none}
  .nav-item.active::before{content:'';position:absolute;top:2px;left:50%;transform:translateX(-50%);width:16px;height:3px;background:var(--primary);border-radius:2px;box-shadow:0 0 6px var(--primary)}
  .nav-item span.label{display:block;font-size:9px}
  .nav-item span.icon{font-size:16px}
  .nav-section-label,.nav-secondary,.nav-secondary-label{display:none!important}
  .nav-more-btn{display:flex!important}
  .nav-user,.nav-user-info{display:none!important}
  .content{margin-left:0!important;margin-bottom:76px;padding:16px}
  .header{padding:0 12px}.stats-row{grid-template-columns:1fr 1fr}
  .grid-2,.grid-3{grid-template-columns:1fr}.form-row{grid-template-columns:1fr}
}
@keyframes fadeIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
.page.active{animation:fadeIn .3s ease}
#loginScreen{position:fixed;inset:0;background:var(--bg);z-index:9999;display:flex;align-items:center;justify-content:center}
#loginScreen.hidden{display:none}
.login-box{background:var(--surface);border:1px solid var(--glass-border);border-radius:var(--radius);padding:40px 32px;width:100%;max-width:380px;box-shadow:0 8px 32px #0004;backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur)}
.login-box img{height:50px;object-fit:contain;margin-bottom:20px;display:block}
.login-box h2{font-size:20px;font-weight:700;margin-bottom:6px}
.login-box p{font-size:13px;color:var(--text2);margin-bottom:24px}
.login-error{color:var(--danger);font-size:13px;margin-top:10px;display:none}
@media print{
  body *{visibility:hidden!important}
  #printOverlay,#printOverlay *{visibility:visible!important}
  #printOverlay{position:static!important;inset:auto!important;z-index:9999!important;background:#fff!important;overflow:visible!important;display:block!important;height:auto!important;max-height:none!important}
  #printContent{display:block!important;box-shadow:none!important;margin:0!important;padding:5mm!important;max-height:none!important;overflow:visible!important;width:100%!important;max-width:100%!important;height:auto!important}
  #printContent *{color:#000!important;-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important}
  #printContent table{width:100%!important;page-break-inside:auto!important;table-layout:auto!important}
  #printContent tr{page-break-inside:avoid!important;page-break-after:auto!important}
  #printContent td,#printContent th{overflow:visible!important;word-break:break-word!important}
  #signatureSection{display:none!important;visibility:hidden!important}
  .print-actions{display:none!important;visibility:hidden!important}
  .header,.nav,.content,#navMoreOverlay,#navMorePanel,#toastContainer{display:none!important}
  @page{margin:6mm 5mm;size:A4 portrait}
}
@media(max-width:768px){
  .nav{width:auto;height:auto;top:auto;bottom:12px;left:12px;right:12px;flex-direction:row;overflow-x:hidden;overflow-y:hidden;display:flex;padding:8px 15px;border-right:none;border-top:none;border:1px solid var(--glass-border);border-radius:var(--radius);z-index:200;box-shadow:0 8px 32px rgba(0,0,0,.4);gap:2px}
  .nav-item{flex-direction:column;padding:8px 4px;gap:3px;min-width:52px;min-height:44px;flex:1;font-size:10px;border-radius:var(--radius-sm)}
  .nav-item.active{background:rgba(59,130,246,.12);box-shadow:0 0 16px rgba(59,130,246,.15)}
  .nav-item.active::after{display:none}
  .nav-item.active::before{content:'';position:absolute;top:2px;left:50%;transform:translateX(-50%);width:16px;height:3px;background:var(--primary);border-radius:2px;box-shadow:0 0 6px var(--primary)}
  .nav-item span.label{font-size:9px}
  .nav-secondary,.nav-secondary-label,.nav-section-label{display:none!important}
  .nav-item.mobile-nav-hidden{display:none!important}
  .nav-user{display:none!important}
  .nav-scroll{padding:4px}
  .nav-more-btn{display:flex!important;flex:1}
  .content{margin-left:0;margin-bottom:76px;padding:12px}
  .header{padding:0 10px;gap:6px}
  .header-left{gap:8px}
  .header-left .logo-spin{height:36px!important}
  .header-right{gap:6px}
  .header-btn{padding:6px 10px;font-size:11px}
  .grid-2,.grid-3{grid-template-columns:1fr}
  .stats-row{grid-template-columns:1fr 1fr}
  .form-row{flex-direction:column}
  /* Audit mobile 23/05/2026 — modale prend toute la hauteur dispo et nav inférieure
     est masquée tant qu'une modale est ouverte (sinon footer modale caché par nav). */
  .modal{max-width:100%;margin:0;border-radius:var(--radius) var(--radius) 0 0;position:fixed;bottom:0;left:0;right:0;max-height:calc(100vh - 60px);overflow:hidden;display:flex;flex-direction:column}
  body.modal-open .nav{display:none!important}
  .modal-overlay{align-items:flex-end;padding:0}
  .modal-body{padding:14px}
  .modal-header{padding:14px 16px;background:var(--surface)}
  /* Titre intervention : autoriser à wrapper sur plusieurs lignes (sinon "L..") */
  .modal-header h3{font-size:15px;line-height:1.3;white-space:normal;word-break:break-word}
  .modal-footer .btn{min-width:auto;font-size:12px;padding:8px 10px}
  .table-wrap{font-size:12px}
  th,td{padding:8px 6px}
  .header{padding:0 12px}
  .logo{font-size:16px}
  .page-title{font-size:18px}
  #toastContainer{bottom:86px;right:12px;left:12px}
  .toast{max-width:100%}
  /* Audit mobile 23/05/2026 — KPI géants → réduction sur petit écran */
  .dash-kpi-num,.boss-kpi-val,.dash-flux-value{font-size:20px}
  /* Timer fluide */
  .timer-widget{min-width:auto;left:12px;right:12px}
  /* FAB tech masqué quand modale ouverte (évite collision boutons modale) */
  body.modal-open .tech-fab{display:none!important}
  /* Toolbar search prend toute la largeur */
  .toolbar .search-input{max-width:none;flex:1 1 100%}
  /* Detail-grid : adresse/email peuvent wrapper proprement */
  .detail-grid .val a{white-space:normal;word-break:break-word}
  /* Print content : padding réduit sur petit écran */
  .print-content{padding:16px}
  /* Tooltip d'aide : limité au viewport */
  .aide-tour-tooltip{max-width:calc(100vw - 24px)}
  /* Bouton Imprimer en haut : sous le header */
  .print-actions{top:70px!important}
}
/* 22/05/2026 Boss : toasts flous/invisibles derriere les modales.
   Cause : z-index 9998 identique a #modal-bi-v2 + backdrop-filter blur(4px)
   de la modale -> les toasts passent sous le blur. Fix : 100000 (au-dessus
   de toutes les modales steppers, .modal-overlay, UIModal.confirm/prompt). */
#toastContainer{position:fixed;bottom:24px;right:24px;z-index:100000;display:flex;flex-direction:column;gap:10px;pointer-events:none}
.toast{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-sm);padding:12px 18px;font-size:14px;font-weight:600;display:flex;align-items:center;gap:10px;box-shadow:0 4px 20px #0006;pointer-events:all;animation:toastIn .25s ease;max-width:320px}
.toast.success{border-left:4px solid var(--success)}.toast.error{border-left:4px solid var(--danger)}.toast.info{border-left:4px solid var(--primary)}.toast.warning{border-left:4px solid var(--warning)}
@keyframes toastIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@keyframes toastOut{to{opacity:0;transform:translateY(16px)}}

/* KPI & Alertes */
.stat-card{border-radius:var(--radius);padding:14px 18px;display:flex;flex-direction:column;gap:4px;min-width:120px;}
.stat-val{font-size:26px;font-weight:700;color:#fff;}

.stat-label{font-size:11px;color:#94a3b8;text-transform:uppercase;letter-spacing:.05em;}
#kpiStats{display:flex;flex-wrap:wrap;gap:12px;padding:12px 0;}
@keyframes alertePulse{0%,100%{opacity:1}50%{opacity:.5}}
.alerte-pulse{animation:alertePulse 1.2s infinite;}

/* Neon icon system */
.neon-icon{width:40px;height:40px;border-radius:12px;display:flex;align-items:center;justify-content:center;margin-bottom:6px;transition:box-shadow .3s}
.neon-icon svg{width:22px;height:22px;stroke-width:2;fill:none;stroke:currentColor}
.stat-card.blue .neon-icon{color:var(--primary);background:#3b82f618;box-shadow:0 0 12px #3b82f633}
.stat-card.green .neon-icon{color:var(--success);background:#22c55e18;box-shadow:0 0 12px #22c55e33}
.stat-card.amber .neon-icon{color:#f97316;background:rgba(249,115,22,.12);box-shadow:0 0 14px rgba(249,115,22,.4)}
.stat-card.red .neon-icon{color:var(--danger);background:#ef444418;box-shadow:0 0 12px #ef444433}
.stat-card.purple .neon-icon{color:var(--purple);background:#a78bfa18;box-shadow:0 0 12px #a78bfa33}
.stat-card.cyan .neon-icon{color:var(--cyan);background:#22d3ee18;box-shadow:0 0 12px #22d3ee33}
.stat-card:hover .neon-icon{box-shadow:0 0 20px currentColor}
.alert-neon{width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.alert-neon svg{width:20px;height:20px;stroke-width:2;fill:none;stroke:currentColor}

/* Agenda Timeline (Google Calendar style) */
.agenda-timeline{max-height:380px;overflow-y:auto;padding-right:4px}
.agenda-row{display:flex;min-height:44px;border-bottom:1px solid var(--border);position:relative;transition:background .15s;min-width:0}
.agenda-row:last-child{border-bottom:none}
.agenda-row.agenda-past{opacity:.45}
.agenda-row.agenda-now{background:rgba(59,130,246,.04)}
.agenda-hour{width:50px;flex-shrink:0;font-size:11px;color:var(--text3);padding:8px 0 0 2px;font-weight:500;font-variant-numeric:tabular-nums}
.agenda-row.agenda-now .agenda-hour{color:var(--primary);font-weight:700}
.agenda-slot{flex:1;position:relative;padding:4px 0;min-height:40px;min-width:0;overflow:visible}
/* 24/05/2026 Boss : evenement multi-heure (BI terminé avec arrivée+départ) prend
   plus de hauteur pour visualiser sa duree. Rendu IN-FLOW (pas absolute) :
   la cellule horaire s'agrandit naturellement, evite les chevauchements
   visuels. La timeline a gauche reste alignee avec le contenu de chaque slot. */
.agenda-event--span{box-shadow:0 2px 8px rgba(0,0,0,.12);align-items:stretch}
/* Ligne "maintenant" : style Google Calendar — rouge vif + label heure + dot */
.agenda-now-line{position:absolute;left:0;right:0;height:2px;background:#ef4444;z-index:5;pointer-events:none;box-shadow:0 0 4px rgba(239,68,68,.5)}
.agenda-now-dot{position:absolute;left:-6px;top:-5px;width:12px;height:12px;border-radius:50%;background:#ef4444;box-shadow:0 0 8px rgba(239,68,68,.7);border:2px solid #fff}
.agenda-now-label{position:absolute;left:6px;top:-9px;background:#ef4444;color:#fff;font-size:10px;font-weight:800;padding:2px 6px;border-radius:4px;font-family:'Consolas',monospace;letter-spacing:.5px;box-shadow:0 1px 4px rgba(0,0,0,.2);pointer-events:none}
/* Surligne la ligne d'heure courante pour la voir mieux */
.agenda-row.agenda-now{background:rgba(239,68,68,.04) !important;border-left:2px solid #ef4444}
.agenda-row.agenda-now .agenda-hour{color:#ef4444 !important;font-weight:800 !important}
.agenda-event{display:flex;align-items:stretch;gap:8px;background:rgba(59,130,246,.08);border-radius:8px;padding:6px 10px;margin:3px 0;cursor:pointer;transition:all .2s;border:1px solid transparent;min-width:0;flex-wrap:wrap}
.agenda-event:hover{background:rgba(59,130,246,.14);border-color:rgba(59,130,246,.2);transform:translateX(2px)}
.agenda-event-bar{width:3px;border-radius:2px;background:var(--primary);flex-shrink:0;align-self:stretch}
.agenda-event-content{flex:1 1 100%;min-width:0;display:flex;flex-direction:column;gap:2px;justify-content:center;order:1}
/* Client = priorite visuelle MAX, taille + bold + autorise wrap sur 2 lignes */
.agenda-event-title{font-size:14px;font-weight:800;color:var(--text);overflow:hidden;display:flex;align-items:center;gap:6px;line-height:1.25;flex-wrap:wrap}
.agenda-event-title .agenda-event-client{font-size:14px;font-weight:800;letter-spacing:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word;white-space:normal}
.agenda-event-heure{background:var(--primary);color:#fff;font-family:'Consolas',monospace;font-size:11px;font-weight:800;padding:1px 6px;border-radius:4px;flex-shrink:0;letter-spacing:.3px}
.agenda-event-client{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}
.agenda-event-meta{font-size:11px;color:var(--text2);margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:flex;gap:8px}
.agenda-event-meta-item{overflow:hidden;text-overflow:ellipsis;min-width:0;flex:0 1 auto;max-width:100%}
.agenda-event-tech{font-size:10px;color:var(--primary);font-weight:600}
.agenda-event-dur{font-size:10px;color:var(--text3);font-family:monospace}
.agenda-event-subline{font-size:10px;color:var(--text3);margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:flex;gap:8px}
.agenda-event-actions{display:flex;gap:2px;align-items:center;margin-left:auto;flex-shrink:0;opacity:.4;transition:opacity .15s;order:3}
.agenda-event:hover .agenda-event-actions{opacity:1}
.agenda-event-act{background:var(--surface);border:1px solid var(--border);color:var(--text2);width:22px;height:22px;border-radius:5px;font-size:11px;cursor:pointer;padding:0;display:flex;align-items:center;justify-content:center;transition:all .15s}
/* Badge statut (En cours / Resolu tel...) en vue jour : compact sur la cote */
.agenda-event > .badge{font-size:10px;padding:2px 6px;align-self:flex-start;order:2;margin-top:2px}
.agenda-event-act:hover{background:var(--primary);color:#fff;border-color:var(--primary)}
.agenda-event-act.danger:hover{background:#ef4444;border-color:#ef4444}
.agenda-week-cell .agenda-event-actions{opacity:1}
.agenda-week-cell .agenda-event-act{width:22px;height:22px;font-size:11px}
@media (max-width:700px){.agenda-event-actions{opacity:1}.agenda-event-act{width:30px;height:30px;font-size:14px}}
.agenda-upcoming{margin-top:14px;padding-top:12px;border-top:1px solid var(--border)}
.agenda-upcoming-title{font-size:11px;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:.05em;margin-bottom:8px}
.agenda-upcoming-day{display:flex;align-items:center;justify-content:space-between;padding:6px 8px;font-size:13px;color:var(--text2);border-radius:8px;transition:background .15s}
.agenda-upcoming-day:hover{background:rgba(255,255,255,.05)}
.agenda-upcoming-label{font-weight:500;text-transform:capitalize}
.agenda-upcoming-count{font-size:11px;background:var(--primary);color:#fff;padding:2px 8px;border-radius:10px;font-weight:600}

/* ── AGENDA TOOLBAR (Jour/Semaine/Mois) ── */
.agenda-toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px;padding-bottom:10px;border-bottom:1px solid var(--border)}
.agenda-toolbar-title{font-size:14px;font-weight:700;color:var(--text);display:flex;align-items:center;gap:6px}
.agenda-toolbar-nav{display:flex;align-items:center;gap:4px}
.agenda-toolbar-nav input[type="date"]{background:var(--surface);border:1px solid var(--border);border-radius:6px;padding:4px 8px;font-size:12px;color:var(--text)}
.agenda-view-toggle{display:flex;background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:2px;gap:1px}
.agenda-view-btn{background:transparent;border:none;color:var(--text2);padding:5px 12px;font-size:12px;font-weight:600;border-radius:6px;cursor:pointer;transition:all .15s}
.agenda-view-btn:hover{background:rgba(255,255,255,.05);color:var(--text)}
.agenda-view-btn.active{background:var(--primary);color:#fff}
@media (max-width:600px){.agenda-toolbar-title{order:-1;width:100%}.agenda-toolbar-nav{flex:1;min-width:0}.agenda-view-btn{padding:5px 8px;font-size:11px}}

/* ── AGENDA VUE SEMAINE ── */
.agenda-week{display:grid;grid-template-columns:50px repeat(5,minmax(var(--agenda-week-col-min,0px),1fr));gap:1px;background:var(--border);border-radius:8px;overflow:auto;max-height:600px}
/* Forcer les cells a ne pas s'elargir pour accomoder les long titres */
.agenda-week>*{min-width:0}
.agenda-week-cell{overflow:hidden}
/* Vue semaine = dense : garder heure/client/ville/machine visibles mais compacts */
.agenda-week-cell .agenda-event{max-width:100%;min-width:0;padding:3px 5px;gap:4px;margin:2px 0;border-radius:5px;flex-direction:column;align-items:stretch}
.agenda-week-cell .agenda-event-bar{display:none}
.agenda-week-cell .agenda-event{border-left:3px solid var(--primary)}
.agenda-week-cell .agenda-event-content{gap:0}
.agenda-week-cell .agenda-event-title{font-size:10.5px;line-height:1.2;gap:4px}
.agenda-week-cell .agenda-event-heure{font-size:9.5px;padding:0 4px}
.agenda-week-cell .agenda-event-meta{font-size:9.5px;line-height:1.2;gap:5px}
.agenda-week-cell .agenda-event-subline{font-size:9px;line-height:1.2;gap:5px}
.agenda-week-cell .agenda-event-actions{display:none}
.agenda-week-cell .agenda-event .drag-handle{position:absolute;top:2px;right:2px;width:12px;font-size:10px;opacity:.35}
/* Au besoin: ville/machine sur la meme ligne, wrap si tres etroit */
.agenda-week-cell{min-width:0}
@media (max-width:900px){
  .agenda-week{grid-template-columns:40px repeat(5,minmax(var(--agenda-week-col-min,110px),1fr));max-height:500px}
  .agenda-week-header{padding:6px 2px;font-size:10px}
  .agenda-week-header-date{font-size:14px}
  .agenda-week-hour{padding:3px 4px;font-size:9px}
  .agenda-week-cell .agenda-event{padding:3px 5px}
  .agenda-week-cell .agenda-event-title{font-size:10px}
  .agenda-week-cell .agenda-event-meta{font-size:9px}
  .agenda-week-cell .agenda-event-subline{font-size:9px}
}
.agenda-week-header{background:var(--card);padding:8px 4px;text-align:center;font-size:11px;font-weight:700;color:var(--text2);position:sticky;top:0;z-index:3;border-bottom:1px solid var(--border)}
.agenda-week-header.today{background:rgba(59,130,246,.12);color:var(--primary)}
.agenda-week-header-day{font-size:10px;text-transform:uppercase;color:var(--text3);letter-spacing:.05em}
.agenda-week-header-date{font-size:16px;font-weight:800;color:var(--text);margin-top:2px}
.agenda-week-header.today .agenda-week-header-date{color:var(--primary)}
.agenda-week-hour{background:var(--card);padding:4px 6px;font-size:10px;color:var(--text3);text-align:right;font-variant-numeric:tabular-nums;min-height:40px}
.agenda-week-cell{background:var(--card);padding:2px;min-height:40px;position:relative;transition:background .15s;cursor:pointer}
.agenda-week-cell:hover{background:rgba(59,130,246,.04)}
.agenda-week-cell.today{background:rgba(59,130,246,.04)}
.agenda-week-cell.past{opacity:.5}
.agenda-week-cell.agenda-drop-target{background:rgba(59,130,246,.15)!important;outline:2px dashed var(--primary);outline-offset:-2px}
.agenda-week-cell .agenda-event{padding:4px 6px;margin:1px 0;border-radius:6px;font-size:11px;gap:4px}
.agenda-week-cell .agenda-event-bar{height:18px;width:2px}
.agenda-week-cell .agenda-event-title{font-size:11px}
.agenda-week-cell .agenda-event-meta{font-size:10px}
.agenda-week-cell .agenda-event-tech{font-size:9px}
.agenda-week-now-line{position:absolute;left:0;right:0;height:2px;background:#ef4444;z-index:2;pointer-events:none;box-shadow:0 0 4px #ef4444}
.agenda-week-now-dot{position:absolute;left:-4px;top:-4px;width:8px;height:8px;border-radius:50%;background:#ef4444}

/* ── AGENDA VUE MOIS ── */
.agenda-month{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1px;background:var(--border);border-radius:8px;overflow:hidden}
.agenda-month-header{background:var(--surface);padding:8px 4px;text-align:center;font-size:11px;font-weight:700;color:var(--text2);text-transform:uppercase;letter-spacing:.05em;min-width:0}
/* min-width:0 critique : sans, white-space:nowrap des events force les cellules à se gonfler et casse repeat(5,1fr) (bug 18/05/2026) */
.agenda-month-cell{background:var(--card);padding:6px;min-height:90px;min-width:0;position:relative;cursor:pointer;transition:background .15s;display:flex;flex-direction:column;gap:3px}
.agenda-month-cell:hover{background:rgba(59,130,246,.04)}
.agenda-month-cell.today{background:rgba(59,130,246,.08);border:2px solid var(--primary);padding:4px}
.agenda-month-cell.other-month{opacity:.4}
.agenda-month-cell.agenda-drop-target{background:rgba(59,130,246,.15)!important;outline:2px dashed var(--primary);outline-offset:-2px}
.agenda-month-daynum{font-size:13px;font-weight:700;color:var(--text);align-self:flex-end}
.agenda-month-cell.today .agenda-month-daynum{color:var(--primary)}
.agenda-month-event{background:rgba(59,130,246,.14);color:var(--text);border-left:3px solid var(--primary);padding:2px 5px;border-radius:3px;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer}
.agenda-month-event:hover{background:rgba(59,130,246,.22)}
.agenda-month-event-more{font-size:10px;color:var(--text3);font-weight:600;margin-top:2px}
@media (max-width:700px){.agenda-month-cell{min-height:60px;padding:4px}.agenda-month-event{font-size:9px}}

/* ── AIDE PAGE ── */
.aide-actions{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:8px}
.aide-role-badge{font-size:13px;color:var(--text2);background:var(--card);padding:6px 14px;border-radius:var(--radius-sm);border:1px solid var(--border)}
.aide-accordion{margin-bottom:8px;border-radius:var(--radius-sm);overflow:hidden;border:1px solid var(--border);background:var(--card);transition:border-color .2s}
.aide-accordion:hover{border-color:rgba(255,255,255,.12)}
.aide-accordion-header{display:flex;align-items:center;gap:12px;width:100%;padding:16px 18px;border:none;background:transparent;color:var(--text);font-size:15px;cursor:pointer;font-family:inherit;text-align:left;transition:background .15s}
.aide-accordion-header:hover{background:rgba(255,255,255,.04)}
.aide-accordion-icon{font-size:20px;flex-shrink:0;width:28px;text-align:center}
.aide-accordion-title{flex:1;font-weight:600}
.aide-accordion-arrow{font-size:11px;color:var(--text3);transition:transform .2s;flex-shrink:0}
.aide-accordion-body{padding:0 18px 18px 18px}
.aide-section-desc{font-size:13px;color:var(--text2);margin-bottom:14px;line-height:1.5}
.aide-steps{list-style:none;counter-reset:aide-step;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}
.aide-step{display:flex;align-items:flex-start;gap:12px;padding:12px 14px;background:var(--surface);border-radius:var(--radius-sm);border:1px solid var(--border);counter-increment:aide-step;position:relative}
.aide-step::before{content:counter(aide-step);position:absolute;top:12px;left:-8px;width:20px;height:20px;border-radius:50%;background:var(--primary);color:#fff;font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.aide-step-icon{font-size:18px;flex-shrink:0;width:24px;text-align:center;margin-top:1px}
.aide-step-text{font-size:13px;color:var(--text);line-height:1.5}
.aide-step-text b{color:var(--primary);font-weight:600}

/* Tour guide overlay */
.aide-tour-overlay{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:9990;backdrop-filter:blur(2px)}
.aide-tour-highlight{position:fixed;z-index:9991;border:2px solid var(--primary);border-radius:var(--radius-sm);box-shadow:0 0 0 4000px rgba(0,0,0,.5),0 0 20px var(--primary-glow);pointer-events:none;transition:all .3s ease}
.aide-tour-tooltip{position:fixed;z-index:9992;background:var(--surface);border:1px solid var(--primary);border-radius:var(--radius-sm);padding:16px;max-width:340px;min-width:240px;box-shadow:0 8px 32px rgba(0,0,0,.5);opacity:0;transition:opacity .2s}
.aide-tour-text{font-size:14px;color:var(--text);line-height:1.6;margin-bottom:12px}
.aide-tour-footer{display:flex;align-items:center;justify-content:space-between;gap:10px}
.aide-tour-counter{font-size:11px;color:var(--text3);font-weight:600}
.aide-tour-btns{display:flex;gap:8px}
.btn-sm{padding:6px 12px!important;font-size:12px!important}

/* ── PHOTOS MODULE ── */
.photo-gallery{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
.photo-thumb{width:80px;height:80px;border-radius:8px;object-fit:cover;cursor:pointer;border:1px solid var(--border);transition:transform .15s,box-shadow .15s}
.photo-thumb:hover{transform:scale(1.08);box-shadow:0 2px 12px rgba(59,130,246,.3)}
.photo-thumb-del{position:absolute;top:-6px;right:-6px;width:20px;height:20px;border-radius:50%;background:var(--danger);color:#fff;border:none;font-size:14px;line-height:20px;text-align:center;cursor:pointer;display:none;padding:0}
.photo-gallery>div:hover .photo-thumb-del{display:block}
.photo-capture-btn{display:inline-flex;align-items:center;gap:6px;background:var(--card);border:1px solid var(--border);color:var(--text);padding:8px 14px;border-radius:var(--radius-sm);cursor:pointer;font-size:13px;transition:all .2s}
.photo-capture-btn:hover{background:var(--card-hover);border-color:rgba(255,255,255,.15)}
.photo-viewer{position:fixed;inset:0;z-index:9500;background:rgba(0,0,0,.95);display:flex;align-items:center;justify-content:center;cursor:pointer}
.photo-viewer img{max-width:95%;max-height:90vh;object-fit:contain;border-radius:4px;cursor:default}
.photo-viewer-close{position:absolute;top:16px;right:20px;background:transparent;border:none;color:#fff;font-size:36px;cursor:pointer;z-index:9501;line-height:1;padding:4px 10px}
/* Chantier timeline */
.chantier-timeline{position:relative;padding-left:20px}
.chantier-timeline::before{content:'';position:absolute;left:7px;top:0;bottom:0;width:2px;background:var(--border)}
.timeline-day{margin-bottom:20px}
.timeline-day-header{display:flex;align-items:center;gap:10px;margin-bottom:10px;position:relative}
.timeline-day-dot{width:14px;height:14px;border-radius:50%;background:var(--primary);border:2px solid var(--bg);position:absolute;left:-24px;box-shadow:0 0 8px rgba(59,130,246,0.3)}
.timeline-day-label{font-size:14px;font-weight:700;color:var(--text)}
.timeline-day-count{font-size:11px;color:var(--text3);background:var(--card);padding:2px 8px;border-radius:10px;border:1px solid var(--border)}
.timeline-day-photos{display:flex;flex-direction:column;gap:10px}
.timeline-photo-card{display:flex;gap:12px;padding:10px;background:var(--card);border:1px solid var(--border);border-radius:10px;transition:all .2s}
.timeline-photo-card:hover{border-color:var(--primary);box-shadow:0 2px 12px rgba(59,130,246,0.1)}
.timeline-photo-img{width:100px;height:80px;object-fit:cover;border-radius:8px;cursor:pointer;flex-shrink:0;transition:transform .2s}
.timeline-photo-img:hover{transform:scale(1.05)}
.timeline-photo-info{flex:1;min-width:0}
.timeline-photo-caption{font-size:13px;color:var(--text);line-height:1.4;word-break:break-word}

/* ─────── Chiffrage / Facturation : tableau pro + card totaux ─────── */
.chiff-table{border:1px solid var(--border);border-radius:10px;overflow:hidden;background:var(--card)}
.chiff-grid{display:grid;grid-template-columns:88px minmax(140px,2fr) minmax(90px,1fr) 68px 96px 72px 100px 56px;gap:8px;align-items:center;padding:8px 10px}
.chiff-grid-header{background:linear-gradient(180deg,var(--bg2),var(--card));border-bottom:1px solid var(--border);font-size:11px;font-weight:700;letter-spacing:0.5px;text-transform:uppercase;color:var(--text2);padding:10px}
.chiff-grid-row{border-bottom:1px solid var(--border);transition:background .15s}
.chiff-grid-row:last-child{border-bottom:0}
.chiff-grid-row:hover{background:var(--bg2)}
.chiff-grid-row input{width:100%;padding:6px 8px;font-size:13px;border:1px solid var(--border);border-radius:6px;background:var(--bg);color:var(--text);transition:border-color .15s,box-shadow .15s}
.chiff-grid-row input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px rgba(59,130,246,0.15)}
@media (max-width:820px){
  .chiff-grid{grid-template-columns:1fr 1fr;gap:6px}
  .chiff-grid-header{display:none}
}
.chiff-totaux-card{margin-top:14px;margin-left:auto;max-width:360px;background:var(--card);border:1px solid var(--border);border-radius:12px;overflow:hidden;box-shadow:0 2px 10px rgba(0,0,0,0.04)}
.chiff-totaux-head{background:linear-gradient(135deg,#1e3a5f,#3b82f6);color:#fff;padding:10px 14px;font-size:11px;font-weight:700;letter-spacing:0.8px;text-transform:uppercase}
.chiff-totaux-body{padding:10px 14px}
.chiff-tot-row{display:flex;justify-content:space-between;padding:4px 0;font-size:13px;color:var(--text2);font-variant-numeric:tabular-nums}
.chiff-tot-row span:last-child{color:var(--text)}
.chiff-totaux-ttc{display:flex;justify-content:space-between;padding:12px 14px;background:var(--bg2);border-top:2px solid var(--primary);font-size:16px;font-weight:800;color:var(--text);font-variant-numeric:tabular-nums}

/* Facturation : stat cards, tables, badges status */
.fact-stat-card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:14px 16px;box-shadow:0 2px 6px rgba(0,0,0,0.03);transition:transform .15s,box-shadow .15s}
.fact-stat-card:hover{transform:translateY(-1px);box-shadow:0 4px 14px rgba(0,0,0,0.06)}
.fact-stat-label{font-size:11px;font-weight:700;letter-spacing:0.5px;text-transform:uppercase;color:var(--text3);margin-bottom:6px}
.fact-stat-value{font-size:22px;font-weight:800;color:var(--text);font-variant-numeric:tabular-nums}
.fact-stat-sub{font-size:11px;color:var(--text3);margin-top:2px}
.fact-table{width:100%;border-collapse:collapse;background:var(--card);border:1px solid var(--border);border-radius:10px;overflow:hidden}
.fact-table th{background:linear-gradient(180deg,var(--bg2),var(--card));font-size:10px;font-weight:700;letter-spacing:0.4px;text-transform:uppercase;color:var(--text2);padding:8px 8px;text-align:left;border-bottom:1px solid var(--border);white-space:nowrap}
.fact-table td{padding:8px 8px;font-size:12px;border-bottom:1px solid var(--border);color:var(--text);vertical-align:middle}
.fact-table tr:last-child td{border-bottom:0}
.fact-table tbody tr:hover{background:var(--bg2)}
/* 25/05/2026 Boss : tableau compact (table-layout fixed + colonnes
   distribuees) -> tout tient dans la largeur dispo SANS scroll horizontal.
   Largeurs % calibrees pour ecrans 1280-1920 et padding/font minimaux. */
/* 25/05/2026 fix Boss tablette : nouvelle approche table Devis via colgroup
   explicite — table-layout:fixed + col widths en %. Plus de bug compression
   colonne Actions. */
.fact-devis-wrap{width:100%;overflow-x:auto}
.fact-table--devis{table-layout:fixed;width:100%;font-size:12px}
.fact-table--devis th,
.fact-table--devis td{padding:6px 8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fact-table--devis .td-actions{overflow:visible}  /* boutons icones doivent etre visibles entiers */
/* legacy : ancienne classe maintenue pour compat (factures) */
.fact-table--compact{table-layout:fixed;font-size:12px;width:100%}
.fact-table--compact th,
.fact-table--compact td{padding:6px 8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fact-table--compact th:nth-child(1),
.fact-table--compact td:nth-child(1){width:9%}
.fact-table--compact th:nth-child(2),
.fact-table--compact td:nth-child(2){width:17%}
.fact-table--compact th:nth-child(3),
.fact-table--compact td:nth-child(3){width:11%}
.fact-table--compact th:nth-child(4),
.fact-table--compact td:nth-child(4){width:19%}
.fact-table--compact th:nth-child(5),
.fact-table--compact td:nth-child(5){width:7%}
.fact-table--compact th:nth-child(6),
.fact-table--compact td:nth-child(6){width:7%;text-align:right}
.fact-table--compact th:nth-child(7),
.fact-table--compact td:nth-child(7){width:8%;text-align:right}
.fact-table--compact th:nth-child(8),
.fact-table--compact td:nth-child(8){width:10%}
.fact-table--compact th:nth-child(9),
.fact-table--compact td:nth-child(9){width:12%;text-align:right;white-space:nowrap}
/* Bouton icone compact pour la colonne Actions */
.btn-icon-sm{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;margin:0 2px;border:none;border-radius:6px;cursor:pointer;font-size:13px;line-height:1;transition:transform .1s;font-weight:600}
.btn-icon-sm:hover{transform:scale(1.1)}
.btn-icon-sm:active{transform:scale(.95)}
.fact-status{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:12px;font-size:11px;font-weight:700;letter-spacing:0.3px;text-transform:uppercase;white-space:nowrap}
.fact-status-dot{width:6px;height:6px;border-radius:50%}

/* ═══════════════════════════════════════════════════════════════
   FACTURATION REFONTE COCKPIT — 25/05/2026
   Page-head, 4 cartes KPI cliquables, onglets pleine largeur,
   tableau A facturer unifie, etats vides stylises.
   ═══════════════════════════════════════════════════════════════ */

/* Bandeau titre + recherche globale */
.fact-page-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px;flex-wrap:wrap}
.fact-global-search{flex:1;max-width:480px;min-width:240px}
.fact-global-search input{width:100%;padding:9px 14px 9px 36px;background:var(--bg2);border:1px solid var(--border);border-radius:10px;color:var(--text);font-size:13px;outline:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2'><circle cx='11' cy='11' r='7'/><line x1='21' y1='21' x2='16.65' y2='16.65'/></svg>");background-repeat:no-repeat;background-position:10px center;background-size:16px}
.fact-global-search input:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(99,102,241,.15)}

/* Cockpit — 4 cartes d'action cliquables */
.fact-cockpit{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-bottom:22px}
@media(max-width:1100px){.fact-cockpit{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.fact-cockpit{grid-template-columns:1fr}}

.fact-kpi{position:relative;display:flex;flex-direction:column;align-items:flex-start;text-align:left;gap:4px;padding:18px 18px 16px;background:var(--card);border:1px solid var(--border);border-radius:14px;cursor:pointer;transition:transform .15s,box-shadow .2s,border-color .2s;overflow:hidden;font-family:inherit;color:var(--text)}
.fact-kpi::before{content:'';position:absolute;top:0;left:0;bottom:0;width:4px;background:var(--kpi-accent,#94a3b8);transition:width .2s}
.fact-kpi:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 10px 26px rgba(0,0,0,.18);border-color:var(--kpi-accent,#94a3b8)}
.fact-kpi:hover::before{width:6px}
.fact-kpi:active{transform:translateY(0)}

.fact-kpi-icon{font-size:22px;line-height:1;margin-bottom:2px}
.fact-kpi-label{font-size:11px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--text3)}
.fact-kpi-value{font-size:34px;font-weight:800;line-height:1.1;color:var(--text);font-variant-numeric:tabular-nums;margin-top:2px}
.fact-kpi-sub{font-size:11.5px;color:var(--text2);min-height:14px;line-height:1.3}
.fact-kpi-cta{margin-top:10px;font-size:11px;font-weight:700;color:var(--kpi-accent,var(--primary));letter-spacing:.3px;opacity:.9}
.fact-kpi:hover .fact-kpi-cta{opacity:1}

/* Variantes coloreees par ton */
.fact-kpi--warning{--kpi-accent:#f59e0b}
.fact-kpi--warning .fact-kpi-value{color:#fbbf24}
.fact-kpi--success{--kpi-accent:#22c55e}
.fact-kpi--success .fact-kpi-value{color:#4ade80}
.fact-kpi--info{--kpi-accent:#06b6d4}
.fact-kpi--info .fact-kpi-value{color:#22d3ee}
.fact-kpi--danger{--kpi-accent:#ef4444}
.fact-kpi--danger .fact-kpi-value{color:#fca5a5}
/* 27/05/2026 Boss : tonalite "purple" pour la carte "Devis a faire" — coherent
 * avec la couleur dashboard (📄 devis a faire = #8b5cf6) */
.fact-kpi--purple{--kpi-accent:#8b5cf6}
.fact-kpi--purple .fact-kpi-value{color:#a78bfa}
/* Pulse subtil quand danger (retard) */
.fact-kpi--danger{animation:fact-kpi-pulse 2.4s ease-in-out infinite}
@keyframes fact-kpi-pulse{0%,100%{box-shadow:0 0 0 0 rgba(239,68,68,.0)}50%{box-shadow:0 0 0 6px rgba(239,68,68,.08)}}

/* Etat vide : ton attenue, pas d'action */
.fact-kpi--empty{cursor:default;opacity:.62}
.fact-kpi--empty:hover{transform:none;box-shadow:none}
.fact-kpi--empty .fact-kpi-cta{display:none}

/* Barre onglets pleine largeur, sticky en haut quand on scrolle */
.fact-tabs-bar{display:flex;gap:4px;align-items:center;flex-wrap:wrap;border-bottom:1px solid var(--border);margin-bottom:16px;padding-bottom:8px}
.fact-tabs-spacer{flex:1}
.fact-tab{position:relative;padding:9px 16px;background:transparent;border:0;color:var(--text2);font-weight:600;cursor:pointer;font-size:13px;border-radius:8px 8px 0 0;transition:color .15s,background .15s;display:inline-flex;align-items:center;gap:8px}
.fact-tab:hover{background:var(--bg2);color:var(--text)}
.fact-tab.active{color:var(--primary);background:var(--bg2)}
.fact-tab.active::after{content:'';position:absolute;left:10px;right:10px;bottom:-9px;height:2px;background:var(--primary);border-radius:2px}
.fact-tab-count{display:inline-block;padding:1px 7px;font-size:10px;font-weight:700;border-radius:10px;background:rgba(148,163,184,.15);color:var(--text2);border:1px solid var(--border)}
.fact-tab.active .fact-tab-count{background:var(--primary);color:#fff;border-color:var(--primary)}
.fact-tab-count--alert--on{background:#ef4444 !important;color:#fff !important;border-color:#ef4444 !important;animation:fact-pulse-pill 1.6s ease-in-out infinite}
@keyframes fact-pulse-pill{0%,100%{box-shadow:0 0 0 0 rgba(239,68,68,.5)}50%{box-shadow:0 0 0 4px rgba(239,68,68,0)}}

/* Onglet A facturer — note d'aide + tableau unifie */
.fact-a-facturer-note{font-size:12px;color:var(--text2);background:var(--bg2);border-left:3px solid var(--primary);padding:8px 12px;border-radius:6px;margin-bottom:12px}
.fact-a-facturer-table{background:var(--card);border:1px solid var(--border);border-radius:10px;overflow:hidden}
.fact-table--afacturer{width:100%;border-collapse:collapse}
.fact-table--afacturer th{background:var(--bg2);font-size:10px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;color:var(--text2);padding:10px;text-align:left;border-bottom:1px solid var(--border)}
.fact-table--afacturer td{padding:10px;font-size:12.5px;border-bottom:1px solid var(--border);color:var(--text);vertical-align:middle}
.fact-table--afacturer tbody tr:last-child td{border-bottom:0}
.fact-table--afacturer tbody tr:hover{background:var(--bg2)}
.fact-cell-ellipsis{max-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fact-cell-muted{color:var(--text2);font-size:11.5px}
.fact-link-numero{color:var(--primary);text-decoration:none;font-weight:600;font-family:Consolas,monospace}
.fact-link-numero:hover{text-decoration:underline}

/* Badges type (Inter vs Atelier) */
.fact-kind{display:inline-flex;align-items:center;gap:4px;font-size:10.5px;font-weight:700;padding:3px 8px;border-radius:6px;white-space:nowrap}
.fact-kind--inter{background:rgba(34,197,94,.12);color:#4ade80;border:1px solid rgba(34,197,94,.3)}
.fact-kind--atelier{background:rgba(245,158,11,.12);color:#fbbf24;border:1px solid rgba(245,158,11,.3)}

/* Mini-pill complementaire (statut atelier) */
.fact-mini-pill{display:inline-block;font-size:9.5px;font-weight:700;padding:1px 6px;border-radius:6px;text-transform:uppercase;letter-spacing:.3px}
.fact-mini-pill--success{background:rgba(34,197,94,.15);color:#4ade80}
.fact-mini-pill--info{background:rgba(99,102,241,.15);color:#a5b4fc}

/* 25/05/2026 : barre filtres historique - compacte, multi-criteres */
.fact-hist-filters{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:10px 14px;margin-bottom:14px}
.fact-hist-filters-row{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end}
.fact-hist-field{display:flex;flex-direction:column;gap:3px;position:relative}
.fact-hist-field label{font-size:10px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;color:var(--text3)}
.fact-hist-field input,
.fact-hist-field select{background:var(--bg2);border:1px solid var(--border);color:var(--text);border-radius:6px;padding:6px 10px;font-size:12px;min-width:110px}
.fact-hist-field input:focus,
.fact-hist-field select:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 2px rgba(99,102,241,.15)}
.fact-hist-counter{font-size:11px;color:var(--text2);margin-top:8px;text-align:right}

/* Etat vide stylise (utilise par tous les onglets quand 0 resultat) */
.fact-empty-state{text-align:center;padding:64px 20px;background:var(--card);border:1px dashed var(--border);border-radius:12px}
.fact-empty-icon{font-size:48px;margin-bottom:12px;opacity:.8}
.fact-empty-title{font-size:16px;font-weight:700;color:var(--text);margin-bottom:6px}
.fact-empty-sub{font-size:13px;color:var(--text2)}

/* Nouveau Devis — tableau lignes */
.fact-devis-table{border:1px solid var(--border);border-radius:10px;overflow:hidden;background:var(--card)}
.fact-devis-grid{display:grid;grid-template-columns:minmax(90px,0.8fr) minmax(180px,2.5fr) minmax(100px,1fr) 68px 100px 110px 40px;gap:8px;align-items:center;padding:8px 10px}
.fact-devis-grid-header{background:linear-gradient(180deg,var(--bg2),var(--card));border-bottom:1px solid var(--border);font-size:11px;font-weight:700;letter-spacing:0.5px;text-transform:uppercase;color:var(--text2);padding:10px}
.fact-devis-grid-row{border-bottom:1px solid var(--border);transition:background .15s}
.fact-devis-grid-row:last-child{border-bottom:0}
.fact-devis-grid-row:hover{background:var(--bg2)}
.fact-devis-grid-row input{width:100%;padding:6px 8px;font-size:13px;border:1px solid var(--border);border-radius:6px;background:var(--bg);color:var(--text);transition:border-color .15s,box-shadow .15s}
.fact-devis-grid-row input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px rgba(59,130,246,0.15)}
@media (max-width:760px){
  .fact-devis-grid{grid-template-columns:1fr 1fr;gap:6px}
  .fact-devis-grid-header{display:none}
}
@media(max-width:600px){.timeline-photo-card{flex-direction:column}.timeline-photo-img{width:100%;height:150px}}
/* 13/05/2026 audit Boss : indicateur visuel champ obligatoire vide.
   Applique au focus/blur sur input avec attribut required ou classe ajoutee
   par JS (chiffrageObjet, etc.). Bordure rouge + halo subtil. */
.input-empty-required,
input.input-empty-required,
textarea.input-empty-required {
  border-color: #ef4444 !important;
  box-shadow: 0 0 0 3px rgba(239,68,68,.18) !important;
  background: rgba(239,68,68,.04) !important;
}

/* Bouton Nouvelle intervention : label dynamique selon role user (18/05/2026) */
/* Tech voit "Nouveau BI" (vocab terrain), bureau voit "Nouvelle fiche" (vocab bureau) */
#btnNouvelleIntervention .lbl-tech { display: none; }
#btnNouvelleIntervention .lbl-bureau { display: inline; }
body[data-user-role="technicien"] #btnNouvelleIntervention .lbl-tech { display: inline; }
body[data-user-role="technicien"] #btnNouvelleIntervention .lbl-bureau { display: none; }

/* ═══ Dashboard Tech — refactor 24/05/2026 ═══
   Refonte styles inline → classes utilitaires pour permettre les overrides
   mobile et homogeneiser le rendu. Toutes les couleurs viennent du theme
   (var(--*)) sauf 4 exceptions documentees (warning/info/devis/rappel)
   pour lesquelles aucune variable n'existe encore.
   --------------------------------------------------------------------- */
.tech-welcome{font-size:18px;font-weight:800;color:var(--text);margin-bottom:8px}
.tech-welcome-sub{font-size:13px;color:var(--text2);margin-bottom:14px}

/* Bandeau actions principales (Toutes / Tournee / Atelier / Camion) */
.tech-action-bar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.tech-action-bar__btn{min-height:56px;min-width:80px;flex:1;font-weight:700;border-radius:8px;display:flex;align-items:center;justify-content:center;gap:4px;cursor:pointer;border:none;transition:transform .1s;font-size:14px}
.tech-action-bar__btn:active{transform:scale(.96)}
.tech-action-bar__btn--primary{background:var(--primary);color:#fff}
.tech-action-bar__btn--ghost{background:var(--surface);color:var(--text);border:1px solid var(--border)}
.tech-action-bar__btn--purple{background:rgba(139,92,246,.12);color:var(--purple);border:1px solid rgba(139,92,246,.3);flex:0 0 auto;padding:0 14px}

/* Sections regroupees */
.tech-section{margin-bottom:16px}
.tech-section__title{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--text3);margin-bottom:6px}
.tech-inter-list{display:flex;flex-direction:column;gap:6px}

/* Carte intervention (remplace les styles inline empiles) */
.tech-card{padding:12px;border-radius:8px;background:var(--card);border:1px solid var(--border);display:flex;gap:8px;margin-bottom:6px;transition:transform .1s;overflow:hidden}
.tech-card:active{transform:scale(.98)}
.tech-card--urgent{border-left:3px solid var(--danger)}
.tech-card--unassigned{border-left:3px solid #f59e0b} /* warning : pas de var dispo */
.tech-card--encours{border-left:3px solid var(--primary)}
.tech-card--attente{border-left:3px solid #06b6d4}    /* info cyan : pas de var dispo */
.tech-card--done{border-left:3px solid var(--success);opacity:.8}
.tech-card--devis{border-left:3px solid #a855f7}      /* devis purple : pas de var dispo */

.tech-card__header{display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}
.tech-card__title{font-size:14px;font-weight:700;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tech-card__line{font-size:12px;color:var(--text2);line-height:1.4;overflow:hidden;text-overflow:ellipsis}
.tech-card__line--muted{font-size:11px;color:var(--text3)}
.tech-card__demande{font-style:italic;color:var(--text2);font-size:12px;line-height:1.3;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}

.tech-card__badges{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.tech-card__badge{display:inline-block;padding:2px 6px;border-radius:4px;font-size:10px;font-weight:700;white-space:nowrap}
.tech-card__badge--urgent{background:var(--danger);color:#fff}
.tech-card__badge--important{background:#f97316;color:#fff} /* orange : pas de var dispo */
.tech-card__badge--time{background:var(--primary);color:#fff;font-family:monospace;letter-spacing:.3px}
.tech-card__badge--contract{background:rgba(34,197,94,.15);color:var(--success);border:1px solid var(--success)}
.tech-card__badge--warning{color:#f59e0b;font-weight:700;font-size:10px;background:transparent;padding:0}

/* Handle drag : zone tactile elargie 26→44px (audit point 5) */
.tech-card__drag{width:44px;min-height:44px;display:flex;align-items:center;justify-content:center;color:var(--text3);cursor:grab;background:var(--surface);flex-shrink:0;touch-action:none;user-select:none;font-size:13px;border-right:1px solid var(--border)}
.tech-card__body{flex:1;padding:8px 10px;cursor:pointer;min-width:0;display:flex;flex-direction:column;gap:3px}
.tech-card__plan-btn{border:none;border-left:1px solid var(--border);background:var(--surface);padding:0 12px;cursor:pointer;color:var(--primary);font-size:18px;flex-shrink:0;min-width:44px;min-height:44px}

/* Mobile : on garde la lisibilite (pas plus petit que 11/13px) */
@media (max-width: 480px){
  .tech-card__line{font-size:11px}
  .tech-card__title{font-size:13px}
}

/* ═══ Tech Action Sheet (24/05/2026) ═══
   Mini bottom-sheet au tap du FAB tech : 3 actions rapides
   (Terminer / Pièce / Devis) sans avoir à scroller dans le détail BI.
   Gain : 3 taps + scroll → 2 taps. */
.tech-action-sheet { position: fixed; inset: 0; z-index: 9999; display: flex; }
.tech-action-sheet__overlay { position: absolute; inset: 0; background: rgba(0,0,0,.5); }
.tech-action-sheet__content {
  position: absolute; bottom: 0; left: 0; right: 0;
  background: var(--card); padding: 20px 16px 32px;
  border-top-left-radius: 16px; border-top-right-radius: 16px;
  display: flex; flex-direction: column; gap: 10px;
  animation: tech-action-sheet-slide-up .2s ease-out;
  max-width: 560px; margin: 0 auto;
  box-shadow: 0 -8px 24px rgba(0,0,0,.4);
}
.tech-action-sheet__title {
  font-size: 14px; font-weight: 700; color: var(--text);
  padding-bottom: 6px; border-bottom: 1px solid var(--border); margin-bottom: 6px;
}
.tech-action-sheet__btn {
  min-height: 56px; border-radius: 10px; font-size: 15px; font-weight: 700;
  border: none; padding: 14px; color: #fff; cursor: pointer;
  display: flex; align-items: center; justify-content: center; gap: 8px;
}
.tech-action-sheet__btn:active { transform: scale(.98); }
.tech-action-sheet__btn--done { background: var(--success); }
.tech-action-sheet__btn--piece { background: #f59e0b; }
.tech-action-sheet__btn--devis { background: #a855f7; }
.tech-action-sheet__btn--detail { background: var(--primary); }
.tech-action-sheet__btn--cancel {
  background: transparent; color: var(--text2);
  border: 1px solid var(--border); min-height: 44px;
}
@keyframes tech-action-sheet-slide-up {
  from { transform: translateY(100%); }
  to { transform: translateY(0); }
}

/* ─────────────────────────────────────────────────────────────────────────
   BADGE SYNC HEADER (24/05/2026 audit UX)
   Remplace l'ancienne pastille 10x10 muette. 6 etats lisibles d'un coup d'oeil :
   Sync OK / N en attente / Sync... / Hors ligne / N modif locale / N bloque(s).
   ───────────────────────────────────────────────────────────────────────── */
.sync-badge{display:inline-flex;align-items:center;gap:4px;padding:4px 8px;border-radius:6px;font-size:11px;font-weight:700;line-height:1;min-height:24px;cursor:pointer;border:1px solid transparent;user-select:none;transition:background .15s,color .15s}
.sync-badge:focus{outline:2px solid var(--primary);outline-offset:2px}
.sync-badge__icon{display:inline-flex;align-items:center;font-size:12px;line-height:1}
.sync-badge__txt{white-space:nowrap}
.sync-badge--ok{background:rgba(34,197,94,.15);color:var(--success)}
.sync-badge--pending{background:rgba(245,158,11,.15);color:#d97706}
.sync-badge--syncing{background:rgba(59,130,246,.15);color:var(--primary)}
.sync-badge--offline{background:rgba(239,68,68,.15);color:var(--danger)}
.sync-badge--dead{background:rgba(239,68,68,.2);color:var(--danger);animation:sync-badge-pulse 2s ease-in-out infinite}
.sync-badge__spin{display:inline-block;animation:sync-badge-spin 1.2s linear infinite;transform-origin:50% 50%}
@keyframes sync-badge-pulse{0%,100%{opacity:1}50%{opacity:.6}}
@keyframes sync-badge-spin{from{transform:rotate(0)}to{transform:rotate(360deg)}}
/* Sur tres petits ecrans : on cache le texte, on garde juste l'icone (gain de place) */
@media (max-width:480px){
  .sync-badge__txt{display:none}
  .sync-badge{padding:4px 6px}
}

/* ─────────────────────────────────────────────────────────────────────────
   AGENDA EVENT ECHO (24/05/2026 audit UX)
   Variante compacte d'une ligne calendrier deja affichee dans la carte
   "Prochain RDV" du bandeau action tech. Reduit padding/font + ajoute un lien
   ↑ voir ci-dessus qui scrolle vers la carte complete.
   ───────────────────────────────────────────────────────────────────────── */
.agenda-event--echo{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  background:rgba(148,163,184,.06);
  padding:3px 8px;margin:2px 0;min-height:22px;
  font-size:11px;color:var(--text3);
  opacity:.75;cursor:default;
}
.agenda-event--echo:hover{background:rgba(148,163,184,.1);opacity:1;transform:none}
.agenda-event--echo .agenda-event-content{flex-direction:row;align-items:center;gap:6px;flex-wrap:wrap}
.agenda-event--echo .agenda-event-heure{
  background:transparent;color:var(--text3);font-weight:700;padding:0;
}
.agenda-event--echo .agenda-event-client{font-size:11px;font-weight:600;color:var(--text2);-webkit-line-clamp:1;white-space:nowrap}
.agenda-event--echo-line{flex:1;min-width:0;display:flex;align-items:center;gap:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.agenda-event--echo-jump{
  flex-shrink:0;font-size:10px;font-weight:700;color:var(--primary);
  text-decoration:none;padding:2px 6px;border-radius:4px;
  background:rgba(59,130,246,.1);cursor:pointer;
}
.agenda-event--echo-jump:hover{background:rgba(59,130,246,.2);text-decoration:none}

/* Highlight bref quand on scrolle vers la carte Prochain RDV via le lien echo */
.dash-action-highlight{
  animation:dash-action-flash 1.5s ease-out;
}
@keyframes dash-action-flash{
  0%{box-shadow:0 0 0 4px rgba(59,130,246,.45)}
  100%{box-shadow:0 0 0 0 rgba(59,130,246,0)}
}