/* =========================================================
   DASHOUND CONTROL v30 — NOUVELLE IDENTITÉ VISUELLE
   Refonte complète de l'interface
   ========================================================= */

:root{
  --accent:var(--user-accent,#5d8fff);
  --accent-2:#72d6ff;
  --bg:#07101e;
  --bg-deep:#040a13;
  --panel:#0d1828;
  --panel-2:#111f32;
  --panel-3:#17283f;
  --panel-soft:rgba(255,255,255,.035);
  --line:#20324b;
  --line-soft:rgba(149,174,210,.14);
  --text:#f3f7ff;
  --text-2:#c4d0e2;
  --muted:#8293ad;
  --success:#55d492;
  --warning:#f0bd62;
  --danger:#ef6f82;
  --info:#6fa8ff;
  --shadow:0 16px 45px rgba(0,0,0,.23);
  --shadow-soft:0 8px 26px rgba(0,0,0,.15);
  --radius:16px;
  --radius-sm:10px;
  --sidebar:260px;
  --topbar:68px;
}

*{box-sizing:border-box}
html{background:var(--bg-deep);scroll-behavior:smooth}
body{
  margin:0;
  min-height:100vh;
  background:
    radial-gradient(circle at 75% 0%,rgba(69,111,201,.12),transparent 27rem),
    linear-gradient(160deg,#07101e 0%,#091424 55%,#07101e 100%);
  color:var(--text);
  font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-size:14px;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
body.has-branding-bg::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  background-image:
    linear-gradient(rgba(4,10,19,.86),rgba(4,10,19,.93)),
    var(--branding-background);
  background-size:cover;
  background-position:center;
}
a{color:inherit;text-decoration:none}
img{max-width:100%}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
code{
  padding:2px 6px;
  border-radius:6px;
  background:#081220;
  color:#9ec4ff;
  border:1px solid var(--line-soft);
  font-size:.88em;
}
h1,h2,h3,h4{margin:0;color:var(--text);letter-spacing:-.02em}
h1{font-size:30px;line-height:1.15;font-weight:800}
h2{font-size:20px;line-height:1.25;font-weight:760}
h3{font-size:15px;font-weight:720}
p{margin:8px 0}
small{font-size:11px;color:var(--muted)}
.muted{color:var(--muted)!important}
.text-link{color:#9fc1ff;font-size:12px;font-weight:700}
.text-link:hover{color:white}

/* ---------- App shell ---------- */
.control-app{
  display:grid;
  grid-template-columns:var(--sidebar) minmax(0,1fr);
  min-height:100vh;
}
.control-sidebar{
  position:fixed;
  inset:0 auto 0 0;
  width:var(--sidebar);
  padding:18px 14px 24px;
  overflow-y:auto;
  background:
    linear-gradient(180deg,rgba(13,24,40,.98),rgba(6,13,24,.99));
  border-right:1px solid var(--line);
  box-shadow:12px 0 36px rgba(0,0,0,.16);
  z-index:30;
  scrollbar-width:thin;
}
.control-sidebar.branding-glass{
  background:rgba(9,18,31,.88);
  backdrop-filter:blur(20px);
}
.control-brand{
  min-height:52px;
  display:flex;
  align-items:center;
  gap:12px;
  padding:8px 10px 16px;
  color:var(--branding-title,#fff);
  font-size:17px;
  font-weight:850;
  letter-spacing:-.02em;
  border-bottom:1px solid var(--line-soft);
  margin-bottom:14px;
}
.panel-logo{
  width:36px;
  height:36px;
  object-fit:contain;
  border-radius:10px;
  flex:0 0 auto;
}
.sidebar-group{margin:16px 0}
.sidebar-title{
  padding:0 10px 7px;
  font-size:9px;
  font-weight:850;
  letter-spacing:.14em;
  color:#5f7291;
}
.sidebar-group>a{
  display:flex;
  align-items:center;
  min-height:39px;
  margin:3px 0;
  padding:8px 10px;
  border-radius:10px;
  color:#afbdd1;
  font-size:12.5px;
  font-weight:650;
  transition:.15s ease;
  border:1px solid transparent;
}
.sidebar-group>a:hover{
  background:rgba(255,255,255,.045);
  color:#edf4ff;
}
.sidebar-group>a.active{
  background:
    linear-gradient(90deg,color-mix(in srgb,var(--accent) 20%,transparent),rgba(255,255,255,.025));
  border-color:color-mix(in srgb,var(--accent) 34%,transparent);
  box-shadow:inset 3px 0 0 var(--accent);
  color:#fff;
}
.control-main{
  grid-column:2;
  min-width:0;
  min-height:100vh;
}
.control-topbar{
  position:sticky;
  top:0;
  z-index:24;
  height:var(--topbar);
  display:flex;
  align-items:center;
  gap:14px;
  padding:0 24px;
  background:rgba(7,16,30,.82);
  border-bottom:1px solid var(--line);
  backdrop-filter:blur(18px);
}
.sidebar-toggle{
  display:none;
  width:38px;
  height:38px;
  border-radius:10px;
  border:1px solid var(--line);
  background:var(--panel);
  color:var(--text);
}
.topbar-page{
  font-size:13px;
  font-weight:800;
  color:#dfe8f7;
  white-space:nowrap;
}
.global-search{
  margin-left:10px;
  display:flex;
  align-items:center;
  width:min(480px,40vw);
  height:38px;
  padding:0 12px;
  border:1px solid var(--line);
  border-radius:11px;
  background:#0a1626;
}
.global-search span{opacity:.65}
.global-search input{
  width:100%;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  padding:0 8px!important;
}
.topbar-spacer{flex:1}
.appearance-shortcut,.logout-link{
  min-height:36px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 10px;
  border:1px solid var(--line);
  border-radius:9px;
  background:rgba(255,255,255,.025);
  color:#b8c5d9;
  font-size:11px;
}
.appearance-shortcut:hover,.logout-link:hover{color:white;border-color:#405573}
.user{
  display:flex;
  align-items:center;
  gap:8px;
  color:#dbe5f4;
  font-size:12px;
  font-weight:700;
}
.avatar{
  width:30px;
  height:30px;
  border-radius:50%;
  object-fit:cover;
  border:1px solid #3a4d69;
}
.avatar.big{width:52px;height:52px}
.control-content{
  width:100%;
  max-width:1680px;
  margin:0 auto;
  padding:28px 30px 60px;
}
.wrap{width:min(1180px,calc(100% - 32px));margin:0 auto}

/* ---------- Login / public ---------- */
header:not(.control-topbar){
  min-height:66px;
  border-bottom:1px solid var(--line);
  background:rgba(7,16,30,.86);
}
.nav{height:66px;display:flex;align-items:center}
.brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:18px}
.hero{
  margin:70px auto;
  max-width:860px;
  padding:38px;
  border:1px solid var(--line);
  border-radius:24px;
  background:linear-gradient(145deg,#101e32,#0a1525);
  box-shadow:var(--shadow);
}

/* ---------- Generic layout ---------- */
.page-heading{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
  margin-bottom:20px;
}
.page-heading p{margin-top:7px}
.eyebrow,.section-kicker{
  display:block;
  margin-bottom:7px;
  color:#7da9f8;
  font-size:9px;
  font-weight:900;
  letter-spacing:.15em;
}
.actions{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
.grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:14px;
}
.module-grid,.settings-card-grid,.stats-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:14px;
}
.card,.settings-section,.employee-editor-shell{
  position:relative;
  min-width:0;
  padding:18px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:
    linear-gradient(145deg,rgba(18,33,53,.92),rgba(11,22,38,.94));
  box-shadow:var(--shadow-soft);
}
.card+.card{margin-top:14px}
.card>h2:first-child,.card>h3:first-child{margin-bottom:10px}
.stat-card{
  min-height:118px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:17px;
  border:1px solid var(--line);
  border-radius:14px;
  background:linear-gradient(145deg,#111e31,#0b1728);
}
.stat-card span{color:var(--muted);font-size:11px;font-weight:650}
.stat-card strong,.stat{
  margin-top:7px;
  font-size:27px;
  line-height:1;
  font-weight:850;
  color:white;
}
.stat.small{font-size:18px}
.module-card,.settings-link-card{
  display:block;
  min-height:145px;
  padding:17px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#0e1b2e;
  transition:.15s ease;
}
.module-card:hover,.settings-link-card:hover{
  transform:translateY(-2px);
  border-color:color-mix(in srgb,var(--accent) 50%,var(--line));
  box-shadow:0 12px 30px rgba(0,0,0,.18);
}
.control-hero{
  padding:26px;
  margin-bottom:18px;
  border-radius:20px;
  border:1px solid color-mix(in srgb,var(--accent) 25%,var(--line));
  background:
    radial-gradient(circle at 85% 20%,color-mix(in srgb,var(--accent) 18%,transparent),transparent 28rem),
    linear-gradient(135deg,#102039,#0b1728);
}

/* ---------- Buttons ---------- */
.btn{
  min-height:38px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  padding:8px 13px;
  border:1px solid color-mix(in srgb,var(--accent) 50%,#324969);
  border-radius:10px;
  background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 90%,#fff 0%),color-mix(in srgb,var(--accent) 72%,#07101e));
  color:white;
  font-size:11px;
  font-weight:800;
  text-decoration:none;
  transition:.14s ease;
}
.btn:hover{filter:brightness(1.09);transform:translateY(-1px)}
.btn.secondary{
  background:#132138;
  border-color:#314760;
  color:#d9e5f5;
}
.btn.danger{
  background:#3a1821;
  border-color:#71303d;
  color:#ffb8c4;
}
.btn.danger-soft{
  background:rgba(239,111,130,.09);
  border-color:rgba(239,111,130,.28);
  color:#ffb1be;
}
.btn.mini{
  min-height:30px;
  padding:5px 9px;
  border-radius:8px;
  font-size:10px;
}
.btn.primary-lg{
  min-height:44px;
  padding:10px 18px;
  font-size:12px;
}
.mini-icon-btn{
  width:31px;
  height:31px;
  display:inline-grid;
  place-items:center;
  border-radius:8px;
  border:1px solid var(--line);
  background:#0d192b;
  color:#d8e4f4;
}

/* ---------- Forms ---------- */
input,select,textarea{
  width:100%;
  min-height:40px;
  padding:9px 11px;
  border:1px solid #2a405d;
  border-radius:10px;
  background:#081523;
  color:#edf4ff;
  outline:none;
  transition:border-color .13s ease,box-shadow .13s ease,background .13s ease;
}
textarea{min-height:100px;resize:vertical}
input::placeholder,textarea::placeholder{color:#536984}
input:focus,select:focus,textarea:focus{
  border-color:color-mix(in srgb,var(--accent) 76%,white 0%);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 15%,transparent);
  background:#0a192a;
}
select option{background:#0b1727;color:#f0f5ff}
select option:disabled{color:#6f7c8f}
label{
  display:block;
  margin-bottom:6px;
  color:#dce6f4;
  font-size:11px;
  font-weight:760;
}
.form-grid,.modern-form-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}
.form-grid .full,.field-span-2{grid-column:1/-1}
.field-block{
  min-width:0;
  padding:13px;
  border:1px solid var(--line-soft);
  border-radius:12px;
  background:rgba(4,12,23,.25);
}
.field-block small{display:block;margin-top:5px}
.sub-label{font-size:10px;color:#9eadc2}
.switch-line,.modern-switch{
  display:flex;
  align-items:center;
  gap:9px;
  min-height:40px;
  margin:0;
  padding:9px 11px;
  border:1px solid var(--line);
  border-radius:10px;
  background:#0a1626;
}
.switch-line input,.modern-switch input{
  width:17px;
  min-height:17px;
  height:17px;
  flex:0 0 17px;
  margin:0;
  accent-color:var(--accent);
}
.form-save-zone{
  position:sticky;
  bottom:12px;
  z-index:12;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin-top:16px;
  padding:13px 14px;
  border:1px solid color-mix(in srgb,var(--accent) 28%,var(--line));
  border-radius:13px;
  background:rgba(8,19,33,.95);
  backdrop-filter:blur(14px);
  box-shadow:0 10px 35px rgba(0,0,0,.28);
}
.form-save-zone>div{display:flex;flex-direction:column;min-width:0}
.form-save-zone strong{font-size:12px}
.form-save-zone span{color:var(--muted);font-size:10px}
.form-save-zone.compact{position:static}
.sticky-save-bar{
  position:sticky;
  bottom:10px;
  z-index:12;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  padding:12px;
  background:rgba(8,18,32,.93);
  border:1px solid var(--line);
  border-radius:12px;
  backdrop-filter:blur(12px);
}

/* ---------- Employee editor ---------- */
.employee-editor-shell{
  margin-top:18px;
  padding:0;
  overflow:hidden;
}
.section-heading{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  padding:18px 20px;
  border-bottom:1px solid var(--line);
  background:linear-gradient(90deg,rgba(255,255,255,.025),transparent);
}
.section-heading p{margin:5px 0 0;color:var(--muted);font-size:11px}
.employee-basic-form,.employee-editor-shell>form{padding:18px}
.save-state-badge{
  flex:0 0 auto;
  padding:6px 9px;
  border-radius:999px;
  border:1px solid #30455f;
  background:#0a1626;
  color:#9fb5d1;
  font-size:9px;
  font-weight:800;
}
.save-state-badge.success{color:#8ce9b7;border-color:rgba(85,212,146,.3)}
.save-state-badge.danger{color:#ffacba;border-color:rgba(239,111,130,.3)}
.discord-editor-shell{border-color:rgba(111,168,255,.25)}
.matricule-editor{
  background:
    linear-gradient(135deg,rgba(74,128,220,.07),rgba(4,12,23,.18));
}
.field-title-row{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
  margin-bottom:10px;
}
.matricule-editor-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
.matricule-status-legend{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:10px;
  color:#8798b1;
  font-size:10px;
}
.matricule-list-badge{
  display:inline-flex;
  min-width:42px;
  justify-content:center;
  padding:4px 8px;
  border-radius:8px;
  border:1px solid rgba(111,168,255,.28);
  background:rgba(111,168,255,.08);
  color:#bdd5ff;
  font-weight:850;
}
.discord-role-list{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin-top:12px;
}
.discord-role-pill{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 9px 6px 17px;
  border:1px solid var(--line);
  border-radius:999px;
  background:#091523;
  color:#cbd7e7;
  font-size:10px;
}
.discord-role-pill::before{
  content:"";
  position:absolute;
  left:7px;
  width:6px;height:6px;
  border-radius:50%;
  background:var(--role-color,#6f7d95);
}
.employee-vehicle-list,.roster-vehicle-list{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.employee-vehicle-chip,.roster-vehicle-chip{
  display:flex;
  flex-direction:column;
  min-width:150px;
  padding:9px 11px;
  border:1px solid var(--line);
  border-radius:10px;
  background:#091624;
}
.employee-vehicle-chip span,.roster-vehicle-chip span{color:var(--muted);font-size:10px}

/* ---------- Tables ---------- */
.table-wrap,.employee-table-wrap,.hr-roster-wrap{
  width:100%;
  overflow:auto;
  border:1px solid var(--line);
  border-radius:12px;
  background:#091421;
}
table{
  width:100%;
  border-collapse:collapse;
  border-spacing:0;
  font-size:11px;
}
thead{background:#101e31}
th{
  padding:10px 12px;
  text-align:left;
  color:#8093ad;
  font-size:9px;
  font-weight:850;
  letter-spacing:.05em;
  white-space:nowrap;
  border-bottom:1px solid var(--line);
}
td{
  padding:10px 12px;
  color:#d9e4f4;
  border-bottom:1px solid rgba(149,174,210,.08);
  vertical-align:middle;
}
tbody tr:hover{background:rgba(255,255,255,.022)}
tbody tr:last-child td{border-bottom:0}
.employee-table,.hr-roster-table{min-width:1050px}

/* ---------- Badges / state ---------- */
.badge,[class^="status-"],[class*=" status-"]{
  display:inline-flex;
  align-items:center;
  min-height:24px;
  padding:3px 8px;
  border-radius:999px;
  border:1px solid var(--line);
  font-size:9px;
  font-weight:800;
}
.badge.active,.active.badge{color:#8ee8b8;border-color:rgba(85,212,146,.3);background:rgba(85,212,146,.08)}
.badge.danger{color:#ffacb9;border-color:rgba(239,111,130,.3);background:rgba(239,111,130,.08)}
.badge.neutral{color:#aebdd0}
.away{color:#f3cd82!important;border-color:rgba(240,189,98,.3)!important}
.danger-zone{
  border-color:rgba(239,111,130,.28)!important;
  background:linear-gradient(145deg,rgba(49,18,26,.56),rgba(18,16,27,.9))!important;
}

/* ---------- Tabs / filters ---------- */
.folder-tabs,.settings-nav{
  display:flex;
  gap:7px;
  overflow:auto;
  padding:4px 0 10px;
  scrollbar-width:none;
}
.folder-tab,.settings-nav a{
  flex:0 0 auto;
  padding:8px 11px;
  border:1px solid var(--line);
  border-radius:9px;
  background:#0a1625;
  color:#9cadc5;
  font-size:10px;
  font-weight:750;
}
.folder-tab.active,.settings-nav a.active{
  color:white;
  background:color-mix(in srgb,var(--accent) 13%,#0a1625);
  border-color:color-mix(in srgb,var(--accent) 42%,var(--line));
}
.employee-controls-card{margin-bottom:14px}
.employee-filter-grid,.hr-roster-filter-grid{
  display:grid;
  grid-template-columns:minmax(220px,2fr) repeat(3,minmax(150px,1fr));
  gap:10px;
  align-items:end;
}
.employee-filter-actions,.hr-roster-filter-actions{display:flex;gap:7px;align-items:end}
.employee-add-collapsible summary{
  list-style:none;
  cursor:pointer;
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:4px 0;
}
.collapsible-body{padding-top:14px}

/* ---------- Search ---------- */
.search-section{margin:18px 0}
.search-result{
  display:block;
  padding:12px 14px;
  margin:7px 0;
  border:1px solid var(--line);
  border-radius:11px;
  background:#0b1829;
}
.search-result:hover{border-color:#405a7d}
.search-meta{margin-top:4px;color:var(--muted);font-size:10px}
.local-search,.matricule-page-search{max-width:430px}

/* ---------- Settings ---------- */
.settings-section{margin-bottom:16px}
.settings-section-head{
  display:flex;
  align-items:flex-start;
  gap:11px;
  margin-bottom:14px;
}
.settings-section-icon{
  width:36px;height:36px;
  display:grid;
  place-items:center;
  border-radius:10px;
  border:1px solid var(--line);
  background:#0b1728;
}
.setting-field-card{
  padding:12px;
  border:1px solid var(--line-soft);
  border-radius:11px;
  background:rgba(255,255,255,.018);
}
.settings-link-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:10px;
}
.setting-actions-inline{display:flex;gap:8px;align-items:end}
.color-field-row{display:flex;gap:8px}

/* ---------- Notices ---------- */
.notice{
  display:flex;
  gap:11px;
  margin:12px 0;
  padding:13px 14px;
  border:1px solid #2a405d;
  border-radius:12px;
  background:rgba(93,143,255,.055);
  color:#c8d6e9;
}
.notice-icon{font-size:18px;line-height:1}
.flash{
  margin-bottom:17px;
  padding:12px 14px;
  border:1px solid rgba(85,212,146,.28);
  border-radius:11px;
  background:rgba(85,212,146,.07);
  color:#a8edc7;
  font-size:11px;
  font-weight:700;
}

/* ---------- Timeline / logs ---------- */
.timeline-item{
  position:relative;
  padding:13px 14px;
  margin:9px 0;
  border:1px solid var(--line);
  border-radius:11px;
  background:#091624;
}
.timeline-item.audit{background:#08131f}
.timeline-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
}
.timeline-head strong{font-size:11px}

/* ---------- Matricules ---------- */
.matricule-grid,.matricule-page-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(112px,1fr));
  gap:7px;
}
.matricule-slot-wrap{display:flex;flex-direction:column;gap:4px}
.matricule-slot{
  min-height:68px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:9px;
  border:1px solid var(--line);
  border-radius:10px;
  background:#0a1625;
}
.matricule-slot strong{font-size:15px}
.matricule-slot span{margin-top:3px;color:var(--muted);font-size:9px}
.matricule-slot.available{border-color:rgba(85,212,146,.22)}
.matricule-slot.occupied{border-color:rgba(239,111,130,.22)}
.matricule-slot.unavailable{opacity:.72}
.matricule-slot-action{
  min-height:25px;
  border:1px solid var(--line);
  border-radius:7px;
  background:#0b1728;
  color:#9cafc7;
  font-size:8px;
}

/* ---------- Calendar ---------- */
.weekday-row{
  display:grid;
  grid-template-columns:repeat(7,1fr);
  gap:7px;
  margin-bottom:7px;
}
.weekday-row>*{
  text-align:center;
  color:#70839f;
  font-size:9px;
  font-weight:850;
}
.calendar-grid{
  display:grid;
  grid-template-columns:repeat(7,1fr);
  gap:7px;
}
.calendar-day{
  min-height:115px;
  padding:8px;
  border:1px solid var(--line);
  border-radius:10px;
  background:#091523;
}
.cal-item{
  display:block;
  margin-top:5px;
  padding:6px 7px;
  border-radius:7px;
  background:rgba(93,143,255,.09);
  border-left:2px solid var(--accent);
  font-size:9px;
}
.calendar-selection-block{
  border:1px solid var(--line);
  border-radius:12px;
  overflow:hidden;
  background:#091523;
}
.calendar-selection-block summary{
  list-style:none;
  display:flex;
  justify-content:space-between;
  gap:12px;
  padding:12px 13px;
  cursor:pointer;
}
.calendar-selection-body{padding:12px;border-top:1px solid var(--line)}
.calendar-check-toolbar{
  display:flex;
  gap:7px;
  margin-bottom:8px;
  flex-wrap:wrap;
}
.calendar-check-toolbar input{flex:1 1 240px}
.calendar-check-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
  gap:7px;
  max-height:330px;
  overflow:auto;
  padding:5px;
}
.calendar-check-card{
  display:flex;
  align-items:center;
  gap:8px;
  padding:9px;
  border:1px solid var(--line);
  border-radius:9px;
  background:#0c1828;
  cursor:pointer;
}
.calendar-check-card:has(input:checked){
  border-color:color-mix(in srgb,var(--accent) 55%,var(--line));
  background:color-mix(in srgb,var(--accent) 10%,#0c1828);
}
.calendar-check-card input{width:16px;min-height:16px;height:16px;flex:0 0 16px}
.calendar-check-main strong,.calendar-check-main small{display:block}

/* ---------- Permissions ---------- */
.permissions-layout{
  display:grid;
  grid-template-columns:280px minmax(0,1fr);
  gap:16px;
  align-items:start;
  margin-top:15px;
}
.role-selector-card{position:sticky;top:86px}
.permission-legend{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px;
  margin:12px 0;
}
.permission-help{
  padding:11px;
  border:1px solid var(--line);
  border-radius:10px;
  background:#0a1625;
}
.permission-help strong,.permission-help span{display:block}
.permission-help span{margin-top:4px;color:var(--muted);font-size:10px}
.selected-role-preview{
  display:flex;
  gap:9px;
  align-items:center;
  margin-top:10px;
  padding:10px;
  border:1px solid var(--line);
  border-radius:10px;
  background:#091523;
}
.selected-role-preview>div{display:flex;flex-direction:column;min-width:0}
.role-dot{width:8px;height:8px;border-radius:50%;flex:0 0 auto}
.preset-explain{
  margin-top:13px;
  padding-top:11px;
  border-top:1px solid var(--line-soft);
}
.preset-explain p{padding:8px;border-radius:8px;background:rgba(255,255,255,.02)}
.permission-preset-bar{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin:12px 0 14px;
  padding-bottom:13px;
  border-bottom:1px solid var(--line-soft);
}
.permission-module-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:9px;
}
.permission-module-card{
  padding:12px;
  border:1px solid var(--line);
  border-left-width:3px;
  border-radius:11px;
  background:#0a1625;
}
.level-border-none{border-left-color:#68778d}
.level-border-view{border-left-color:#6fa8ff}
.level-border-edit{border-left-color:#f0bd62}
.level-border-admin{border-left-color:#ef6f82}
.permission-module-top{
  display:flex;
  justify-content:space-between;
  gap:10px;
  align-items:flex-start;
}
.permission-module-info strong,.permission-module-info span{display:block}
.permission-module-info span{margin-top:3px;color:var(--muted);font-size:10px}
.permission-current{
  padding:3px 6px;
  border:1px solid var(--line);
  border-radius:999px;
  white-space:nowrap;
  font-size:8px;
}
.level-pill-view{color:#9bc3ff}
.level-pill-edit{color:#f5cd81}
.level-pill-admin{color:#ff9eb0}
.permission-level{margin-top:9px}
.permission-details{
  margin-top:8px;
  padding-top:8px;
  border-top:1px solid var(--line-soft);
}
.permission-details summary{
  cursor:pointer;
  color:#9fbcdf;
  font-size:9px;
  font-weight:800;
}
.permission-impact-list{
  display:grid;
  gap:5px;
  margin-top:7px;
}
.permission-impact-list>div{
  display:grid;
  grid-template-columns:115px 1fr;
  gap:7px;
  padding:5px 6px;
  border-radius:6px;
  background:rgba(255,255,255,.018);
  font-size:9px;
}
.permission-impact-list span{color:var(--muted)}
.permission-save-bar{
  position:sticky;
  bottom:10px;
  z-index:10;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  margin-top:14px;
  padding:11px 12px;
  border:1px solid var(--line);
  border-radius:11px;
  background:rgba(8,18,32,.95);
  backdrop-filter:blur(12px);
}
.basic-employee-preset{background:#163054;border-color:#2f5e97}
.employee-management-preset{background:#153929;border-color:#2d694d}

/* ---------- RH ↔ Discord ---------- */
.hr-discord-rule-list{display:grid;gap:10px}
.hr-discord-rule{padding:0!important;overflow:hidden}
.hr-discord-rule summary{
  list-style:none;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  padding:13px 15px;
  cursor:pointer;
}
.hr-discord-rule[open] summary{border-bottom:1px solid var(--line);background:#111e30}
.hr-discord-rule summary>div{display:flex;flex-direction:column}
.hr-discord-rule summary span{color:var(--muted);font-size:9px}
.hr-discord-rule-body{padding:15px}
.hr-discord-options{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  margin:12px 0;
}
.hr-discord-role-columns{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin:12px 0;
}
.role-checkbox-list{
  max-height:330px;
  overflow:auto;
  padding:5px;
  border:1px solid var(--line);
  border-radius:10px;
  background:#07121f;
}
.role-checkbox-item{
  display:flex;
  align-items:center;
  gap:8px;
  min-height:34px;
  padding:6px 7px;
  border-bottom:1px solid rgba(149,174,210,.07);
  cursor:pointer;
}
.role-checkbox-item:last-child{border-bottom:0}
.role-checkbox-item:hover{background:rgba(255,255,255,.025)}
.role-checkbox-item input{width:16px;min-height:16px;height:16px}

/* ---------- Tickets / Discord preview ---------- */
.ticket-option{
  padding:12px;
  border:1px solid var(--line);
  border-radius:10px;
  background:#0a1625;
}
.discord-preview-shell{
  border-radius:12px;
  overflow:hidden;
  border:1px solid #323743;
  background:#313338;
  color:#dbdee1;
}
.discord-preview-message{
  display:flex;
  gap:10px;
  padding:14px;
}
.discord-preview-avatar{
  width:36px;height:36px;
  display:grid;place-items:center;
  border-radius:50%;
  background:#5865f2;
  flex:0 0 auto;
}
.discord-preview-body{min-width:0;flex:1}
.discord-preview-user{font-weight:700;font-size:13px}
.discord-preview-user span{
  margin-left:5px;
  padding:1px 4px;
  border-radius:3px;
  background:#5865f2;
  font-size:8px;
}
.discord-preview-content{margin:3px 0;font-size:12px}
.discord-embed-preview{
  position:relative;
  max-width:520px;
  margin-top:7px;
  padding:11px;
  border-left:4px solid #5865f2;
  border-radius:4px;
  background:#2b2d31;
}
.discord-author{display:flex;gap:6px;align-items:center;font-size:10px}
.discord-author img{width:20px;height:20px;border-radius:50%}
.discord-title{margin:7px 0 3px;font-weight:700}
.discord-desc{font-size:11px;white-space:pre-wrap}
.discord-thumb{float:right;width:64px;height:64px;object-fit:cover;border-radius:4px}
.discord-large-image{display:block;width:100%;margin-top:8px;border-radius:5px}
.discord-footer{margin-top:8px;color:#b5bac1;font-size:9px}
.mention-picker{
  padding:11px;
  border:1px solid var(--line);
  border-radius:10px;
  background:#091624;
}
.mention-picker-row{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}

/* ---------- Dialogs ---------- */
dialog{
  width:min(760px,calc(100vw - 30px));
  max-height:88vh;
  overflow:auto;
  padding:0;
  border:1px solid var(--line);
  border-radius:16px;
  background:#0b1728;
  color:var(--text);
  box-shadow:0 30px 90px rgba(0,0,0,.55);
}
dialog::backdrop{background:rgba(1,6,12,.74);backdrop-filter:blur(5px)}
.dialog-header{
  position:sticky;
  top:0;
  z-index:2;
  display:flex;
  justify-content:space-between;
  gap:14px;
  padding:15px 17px;
  background:#0e1b2d;
  border-bottom:1px solid var(--line);
}
.dialog-close{
  width:32px;height:32px;
  border:1px solid var(--line);
  border-radius:8px;
  background:#091522;
  color:white;
}
.dashboard-dialog,.small-dialog{padding:16px}

/* ---------- Misc ---------- */
.center-state{
  max-width:650px;
  margin:65px auto;
  padding:30px;
  text-align:center;
}
.center-state-icon{font-size:36px}
.center-actions{justify-content:center}
.error-state{border-color:rgba(239,111,130,.32)}
.drag-handle{cursor:grab;color:#657893}
.dashboard-widget-row{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px;
  border:1px solid var(--line);
  border-radius:9px;
  background:#091624;
}
.widget-info{flex:1}
.move-actions{display:flex;gap:4px}

/* ---------- Personal appearance preferences ---------- */
.pref-compact-sidebar{--sidebar:218px}
.pref-compact-cards .card,
.pref-compact-cards .settings-section,
.pref-compact-cards .employee-editor-shell{padding:14px}
.pref-compact-cards .employee-editor-shell{padding:0}
.pref-reduced-motion *, .pref-reduced-motion *::before,.pref-reduced-motion *::after{
  transition:none!important;
  animation:none!important;
}
.pref-rounded-small{--radius:10px}
.pref-rounded-large{--radius:22px}
.pref-theme-soft{
  --panel:#101e30;
  --panel-2:#14243a;
}
.pref-theme-black{
  --bg:#03070d;
  --bg-deep:#000;
  --panel:#080d14;
  --panel-2:#0d131c;
  --line:#1d2938;
}

/* ---------- Responsive ---------- */
@media(max-width:1180px){
  .control-app{grid-template-columns:220px minmax(0,1fr)}
  :root{--sidebar:220px}
  .permission-legend{grid-template-columns:repeat(2,1fr)}
  .permission-module-grid{grid-template-columns:1fr}
  .employee-filter-grid,.hr-roster-filter-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:900px){
  .control-app{display:block}
  .control-sidebar{
    transform:translateX(-100%);
    transition:transform .18s ease;
    width:270px;
  }
  body:not(.sidebar-collapsed) .control-sidebar{transform:translateX(-100%)}
  body.sidebar-collapsed .control-sidebar{transform:translateX(0)}
  .control-main{grid-column:auto}
  .sidebar-toggle{display:inline-grid;place-items:center}
  .control-topbar{padding:0 14px}
  .global-search{width:min(420px,45vw)}
  .control-content{padding:22px 18px 50px}
  .permissions-layout{grid-template-columns:1fr}
  .role-selector-card{position:static}
  .hr-discord-role-columns{grid-template-columns:1fr}
  .calendar-grid,.weekday-row{min-width:760px}
  .calendar-grid-wrap{overflow:auto}
}
@media(max-width:700px){
  h1{font-size:24px}
  .control-topbar{gap:8px}
  .topbar-page{display:none}
  .global-search{flex:1;width:auto;margin-left:0}
  .appearance-shortcut,.logout-link{display:none}
  .user{font-size:0}
  .page-heading{flex-direction:column}
  .form-grid,.modern-form-grid,.matricule-editor-grid{grid-template-columns:1fr}
  .form-grid .full,.field-span-2{grid-column:auto}
  .employee-filter-grid,.hr-roster-filter-grid{grid-template-columns:1fr}
  .permission-legend{grid-template-columns:1fr}
  .permission-impact-list>div{grid-template-columns:1fr}
  .permission-save-bar,.form-save-zone{position:static;flex-direction:column;align-items:stretch}
  .form-save-zone .btn,.permission-save-bar .btn{width:100%}
  .section-heading{flex-direction:column}
  .save-state-badge{align-self:flex-start}
  .hr-discord-options{grid-template-columns:1fr}
  .mention-picker-row{grid-template-columns:1fr}
}
@media(max-width:480px){
  .control-content{padding:18px 12px 40px}
  .card{padding:14px}
  .stats-grid,.module-grid,.settings-card-grid{grid-template-columns:1fr}
  .actions{align-items:stretch}
  .actions>.btn,.actions>form{max-width:100%}
  .actions>form>.btn{width:100%}
}

/* ---------- Accessibility ---------- */
:focus-visible{
  outline:2px solid var(--accent);
  outline-offset:2px;
}


/* ---------- Compléments de composants v30 ---------- */
.dashboard-pinned-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:12px;
}
.dashboard-widget-editor{display:grid;gap:8px}
.widget-icon{
  width:34px;height:34px;display:grid;place-items:center;
  border-radius:9px;background:#0c1a2c;border:1px solid var(--line)
}

.employee-add-card{margin-bottom:14px}
.employee-search-field{min-width:0}
.discord-member-picker,.discord-member-picker-remote{
  position:relative;
  padding:11px;
  border:1px solid var(--line);
  border-radius:11px;
  background:#091523;
}
.discord-member-search{margin-bottom:8px}
.discord-member-results{
  max-height:280px;
  overflow:auto;
  display:grid;
  gap:5px;
}
.discord-member-option{
  display:flex;
  align-items:center;
  gap:9px;
  padding:8px 9px;
  border:1px solid var(--line-soft);
  border-radius:9px;
  background:#0b192a;
  cursor:pointer;
}
.discord-member-option:hover{border-color:#3a5478}
.discord-member-selected{
  margin-top:8px;
  padding:9px;
  border:1px solid rgba(85,212,146,.25);
  border-radius:9px;
  background:rgba(85,212,146,.05);
}
.member-search-empty{padding:12px;color:var(--muted);text-align:center}
.member-clear{
  border:0;background:transparent;color:#ff9daf;font-size:10px
}
.is-hidden{display:none!important}

.role-check-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
  gap:7px;
}
.role-check,.inline-check{
  display:flex;
  align-items:center;
  gap:8px;
  padding:8px 9px;
  border:1px solid var(--line);
  border-radius:9px;
  background:#091624;
}
.role-check input,.inline-check input{width:16px;min-height:16px;height:16px}

.vehicle-card-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(250px,1fr));
  gap:12px;
}
.vehicle-card{
  padding:14px;
  border:1px solid var(--line);
  border-radius:14px;
  background:linear-gradient(145deg,#101e31,#0a1626);
}
.vehicle-card-head{
  display:flex;
  justify-content:space-between;
  gap:10px;
  align-items:flex-start;
}
.vehicle-card-info{margin-top:10px;display:grid;gap:5px}
.vehicle-model{font-size:15px;font-weight:800}
.vehicle-card-actions{display:flex;gap:7px;flex-wrap:wrap;margin-top:12px}
.vehicle-detail-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.vehicle-current-assignment{
  padding:11px;
  border:1px solid rgba(111,168,255,.25);
  border-radius:10px;
  background:rgba(111,168,255,.055);
}
.vehicle-add-pop,.vehicle-add-mini{min-width:0}

.event-manage-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.event-stats{margin-bottom:14px}
.event-attendance-actions{display:flex;gap:5px;flex-wrap:wrap}
.event-time-results{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(120px,1fr));
  gap:8px;
}
.event-time-results>div{
  padding:10px;border:1px solid var(--line);border-radius:9px;background:#091624
}
.inline-vehicle-form{display:flex;gap:6px;min-width:220px}
.inline-vehicle-form select{min-width:150px}
.cal-event-link:hover{text-decoration:underline}
.cal-vehicles{margin-top:3px;color:#8ea3be;font-size:8px}
.calendar-head{
  display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px
}
.calendar-title{font-weight:800}
.calendar-num{font-size:10px;color:#8497b1}

.ticket-option-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
  gap:8px;
}
.ticket-config-callout,.ticket-redirect{
  padding:11px 12px;
  border:1px solid var(--line);
  border-radius:10px;
  background:#091624;
}
.ticket-preview-mini{
  padding:10px;border:1px solid #343942;border-radius:9px;background:#2b2d31;color:#dbdee1
}
.mention-picker-title{font-size:10px;font-weight:800;margin-bottom:7px}
.mention-special{color:#9fc4ff;font-weight:700}

.branding-preview{
  min-height:260px;
  display:grid;
  grid-template-columns:90px 1fr;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:13px;
  background:#081320;
}
.branding-preview-sidebar{background:#0d1a2c;border-right:1px solid var(--line)}
.branding-preview-content{padding:18px}

.hr-special-role-settings{
  border-color:rgba(240,189,98,.26);
}
.special-role-list{max-height:300px}

.rating-stars{white-space:nowrap;letter-spacing:1px;color:#f1c36e}
.readonly-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:8px;
}
.preview-card{
  padding:12px;border:1px solid var(--line);border-radius:10px;background:#091624
}
.summary-icon{margin-right:7px}
.summary-arrow{color:var(--muted)}

@media(max-width:900px){
  .vehicle-detail-grid,.event-manage-grid{grid-template-columns:1fr}
}
@media(max-width:700px){
  .branding-preview{grid-template-columns:60px 1fr}
  .inline-vehicle-form{flex-direction:column;min-width:0}
  .inline-vehicle-form select{min-width:0}
}


/* =========================================================
   v30.1 — Gestionnaire de versions / mises à jour
   ========================================================= */
.update-status-card{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin-bottom:16px;
  padding:18px 20px;
  border:1px solid var(--line);
  border-radius:16px;
  background:
    radial-gradient(circle at 90% 0%,rgba(93,143,255,.15),transparent 18rem),
    linear-gradient(145deg,#111f34,#0b1728);
}
.update-status-card h2{margin-top:2px}
.update-status-card p{margin:5px 0 0;color:var(--muted)}
.update-status-card.state-running,
.update-status-card.state-restarting,
.update-status-card.state-rollback{
  border-color:rgba(240,189,98,.35);
}
.update-status-card.state-success{
  border-color:rgba(85,212,146,.32);
}
.update-status-card.state-failed,
.update-status-card.state-failed_critical{
  border-color:rgba(239,111,130,.38);
}
.update-current-version{
  min-width:130px;
  padding:12px 14px;
  text-align:right;
  border:1px solid var(--line);
  border-radius:12px;
  background:rgba(3,10,18,.30);
}
.update-current-version small,
.update-current-version strong{display:block}
.update-current-version strong{
  margin-top:3px;
  font-size:22px;
  color:#fff;
}
.update-layout{
  display:grid;
  grid-template-columns:minmax(0,1.4fr) minmax(300px,.8fr);
  gap:14px;
  margin:16px 0;
}
.compact-heading{
  margin:-18px -18px 16px;
  padding:16px 18px;
}
.update-upload-card{overflow:hidden}
.update-upload-form{display:grid;gap:12px}
.update-dropzone{
  min-height:180px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  padding:20px;
  text-align:center;
  border:1px dashed #3d5c84;
  border-radius:14px;
  background:
    radial-gradient(circle at center,rgba(93,143,255,.08),transparent 70%),
    #081522;
  cursor:pointer;
  transition:.15s ease;
}
.update-dropzone:hover{
  border-color:color-mix(in srgb,var(--accent) 75%,#3d5c84);
  background:color-mix(in srgb,var(--accent) 5%,#081522);
}
.update-dropzone input{
  position:absolute;
  width:1px;
  height:1px;
  opacity:0;
  pointer-events:none;
}
.update-drop-icon{font-size:34px;margin-bottom:3px}
.update-dropzone strong{font-size:13px}
.update-dropzone small{max-width:430px}
.update-safety-list{display:grid;gap:9px;margin-top:13px}
.update-safety-list>div{
  display:grid;
  grid-template-columns:32px 1fr;
  gap:10px;
  align-items:center;
  padding:9px 10px;
  border:1px solid var(--line-soft);
  border-radius:10px;
  background:#091624;
}
.update-safety-list>div>span{
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  border-radius:8px;
  background:rgba(93,143,255,.10);
  color:#a9c7ff;
  font-size:10px;
  font-weight:900;
}
.update-safety-list p{margin:0}
.update-safety-list strong,
.update-safety-list small{display:block}
.update-safety-list strong{font-size:10px}
.update-safety-list small{margin-top:2px}
.version-history-card{overflow:hidden}
.version-list{display:grid;gap:8px}
.version-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:16px;
  align-items:center;
  padding:13px 14px;
  border:1px solid var(--line);
  border-radius:12px;
  background:#091624;
}
.version-row.is-current{
  border-color:rgba(85,212,146,.30);
  box-shadow:inset 3px 0 0 var(--success);
}
.version-main{min-width:0}
.version-title-line{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:7px;
}
.version-title-line>strong{
  font-size:15px;
  color:white;
}
.badge.warning{
  color:#f5cf88;
  border-color:rgba(240,189,98,.28);
  background:rgba(240,189,98,.07);
}
.version-meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px 14px;
  margin-top:5px;
  color:var(--muted);
  font-size:9px;
}
.version-warning{
  margin:7px 0 0;
  color:#c8a96f;
  font-size:9px;
}
.version-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:7px;
  flex-wrap:wrap;
  max-width:480px;
}
.version-actions form{margin:0}
.version-actions .btn{
  min-height:34px;
  font-size:9px;
}
.version-current-text{
  color:#8ce8b7;
  font-size:9px;
  font-weight:800;
}
.update-info-card{margin-top:14px}
.update-info-card p{max-width:1000px}

@media(max-width:1000px){
  .update-layout{grid-template-columns:1fr}
  .version-row{grid-template-columns:1fr}
  .version-actions{justify-content:flex-start;max-width:none}
}
@media(max-width:650px){
  .update-status-card{flex-direction:column;align-items:stretch}
  .update-current-version{text-align:left}
  .version-actions{display:grid;grid-template-columns:1fr}
  .version-actions form,.version-actions .btn{width:100%}
}

.version-history-tools{
  display:flex;
  align-items:center;
  gap:8px;
}
.version-history-tools input{
  width:210px;
  min-height:34px;
  font-size:10px;
}
@media(max-width:650px){
  .version-history-tools{width:100%;align-items:stretch;flex-direction:column}
  .version-history-tools input{width:100%}
}


/* =========================================================
   v30.2 — mentions, permissions fines, tickets, comptes externes, DEV
   ========================================================= */
.login-shell{
  width:min(980px,calc(100% - 30px));
  margin:70px auto;
  display:grid;
  grid-template-columns:1fr 70px 1fr;
  gap:18px;
  align-items:stretch;
}
.login-brand-panel,.login-local-panel{
  padding:28px;
  border:1px solid var(--line);
  border-radius:20px;
  background:linear-gradient(145deg,#101f34,#0a1626);
  box-shadow:var(--shadow);
}
.login-separator{display:grid;place-items:center;color:var(--muted)}
.login-separator span{
  width:42px;height:42px;display:grid;place-items:center;
  border:1px solid var(--line);border-radius:50%;background:#081522;font-size:10px
}
.login-local-form{display:grid;gap:10px;margin:16px 0 10px}
.forgot-link{display:inline-block;margin-top:6px;color:#9fc4ff;font-size:11px;font-weight:700}
.login-no-register,.dev-login-warning{
  margin-top:16px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;
  background:#091624;color:var(--muted);font-size:10px
}
.small-auth-card{max-width:560px}
.dev-mode-pill{
  display:inline-flex;align-items:center;padding:3px 7px;border-radius:999px;
  background:rgba(240,189,98,.12);border:1px solid rgba(240,189,98,.3);color:#f7ce83;
  font-size:8px;font-weight:900;letter-spacing:.08em
}

/* Mentions Discord v30.2 */
.mention-picker-v302{
  margin:12px 0;padding:13px;border:1px solid var(--line);border-radius:13px;background:#081522
}
.mention-picker-head,.mention-target-row{
  display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap
}
.mention-picker-head>div{display:flex;flex-direction:column}
.mention-picker-head span{color:var(--muted);font-size:10px}
.mention-target-row{margin-top:10px}
.mention-target-row label{margin:0}
.mention-target-row select{flex:1 1 280px}
.mention-status{font-size:9px;color:#ef9fac}
.mention-status.ready{color:#8fe8ba}
.mention-tabs{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0 8px}
.mention-tab,.mention-quick{
  min-height:32px;padding:6px 9px;border:1px solid var(--line);border-radius:8px;
  background:#0c192a;color:#aebdd1;font-size:10px;font-weight:750
}
.mention-tab.active{color:white;border-color:color-mix(in srgb,var(--accent) 45%,var(--line));background:rgba(93,143,255,.1)}
.mention-quick{color:#bcd3ff}
.mention-panel{display:none}
.mention-panel.active{display:block}
.mention-search{margin-bottom:7px}
.mention-choice-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:6px;
  max-height:260px;overflow:auto;padding:4px
}
.mention-choice{
  display:flex;align-items:center;gap:7px;min-width:0;padding:8px 9px;
  border:1px solid var(--line-soft);border-radius:9px;background:#0b1828;color:#d5e1f1;text-align:left
}
.mention-choice:hover{border-color:#405b7d;background:#101f34}
.mention-choice span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Permissions fines */
.permissions-v302-layout{display:grid;grid-template-columns:310px minmax(0,1fr);gap:15px;align-items:start}
.permission-role-browser{position:sticky;top:86px;max-height:calc(100vh - 110px);overflow:hidden;display:flex;flex-direction:column}
.permission-role-head{display:grid;gap:8px}
.permission-config-summary{
  display:flex;align-items:center;gap:8px;margin:10px 0;padding:9px;border:1px solid var(--line);
  border-radius:9px;background:#091624
}
.permission-config-summary strong{font-size:18px}
.permission-config-summary span{font-size:9px;color:var(--muted)}
.permission-role-list{overflow:auto;display:grid;gap:4px;padding-right:3px}
.permission-role-row{
  display:grid;grid-template-columns:10px minmax(0,1fr) auto;align-items:center;gap:8px;
  padding:8px 9px;border:1px solid transparent;border-radius:9px;color:#afbdd1
}
.permission-role-row:hover{background:#0b1828;border-color:var(--line)}
.permission-role-row.selected{background:rgba(93,143,255,.09);border-color:rgba(93,143,255,.32);color:white}
.permission-role-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px}
.permission-role-count{font-size:8px;color:#657890}
.permission-role-count.configured{color:#8ce7b7}
.large-role-dot{width:18px;height:18px}
.permission-quick-actions{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.capability-groups{display:grid;gap:9px}
.capability-group{border:1px solid var(--line);border-radius:11px;background:#091624;overflow:hidden}
.capability-group summary{
  list-style:none;display:flex;justify-content:space-between;align-items:center;gap:10px;
  padding:11px 12px;cursor:pointer;background:#0d1a2c
}
.capability-group summary span{font-size:9px;color:var(--muted)}
.capability-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding:9px}
.capability-row{
  display:flex;align-items:flex-start;gap:8px;margin:0;padding:9px;
  border:1px solid var(--line-soft);border-radius:9px;background:#081522;cursor:pointer
}
.capability-row:has(input:checked){border-color:rgba(85,212,146,.28);background:rgba(85,212,146,.045)}
.capability-row input{width:16px;min-height:16px;height:16px;margin-top:2px;accent-color:var(--accent)}
.capability-row span{display:flex;flex-direction:column;min-width:0}
.capability-row strong{font-size:10px}
.capability-row small{margin-top:3px}
.legacy-permission-reference{margin-top:12px;border:1px dashed var(--line);border-radius:10px;padding:10px}
.legacy-permission-reference summary{cursor:pointer;font-size:10px;color:#9fb8d8}
.legacy-level-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:6px;margin-top:9px}
.legacy-level-grid>div{display:flex;justify-content:space-between;gap:8px;padding:7px;background:#081522;border-radius:7px;font-size:9px}
.permission-readonly-note{border-style:dashed!important}

/* Comptes externes */
.external-user-layout,.external-detail-grid{display:grid;grid-template-columns:1.3fr .7fr;gap:14px}
.external-user-list{display:grid;gap:6px}
.external-user-row{
  display:flex;align-items:center;gap:10px;padding:10px;border:1px solid var(--line);
  border-radius:10px;background:#091624
}
.external-user-row:hover{border-color:#3a5577}
.external-avatar{
  width:34px;height:34px;display:grid;place-items:center;border-radius:9px;
  background:rgba(93,143,255,.12);border:1px solid rgba(93,143,255,.25);font-weight:850
}
.external-user-main{display:flex;flex-direction:column;flex:1;min-width:0}
.external-user-main span{font-size:9px;color:var(--muted)}
.external-user-flags{display:flex;gap:5px;flex-wrap:wrap;justify-content:flex-end}
.reset-request-box{margin-top:15px;padding-top:12px;border-top:1px solid var(--line-soft)}
.reset-request-row{display:flex;justify-content:space-between;padding:6px 0;border-bottom:1px solid var(--line-soft);font-size:9px}
.document-add-box{margin-top:12px;border:1px solid var(--line);border-radius:10px;padding:10px}
.document-add-box summary{cursor:pointer;font-weight:800}

/* Tickets v30.2 */
.ticket-architecture-box{
  padding:12px;border:1px solid rgba(93,143,255,.25);border-radius:11px;background:rgba(93,143,255,.045)
}
.ticket-architecture-flow{display:flex;align-items:center;justify-content:center;gap:9px;flex-wrap:wrap}
.ticket-architecture-flow span{padding:7px 9px;border:1px solid var(--line);border-radius:8px;background:#091624;font-size:10px;font-weight:750}
.ticket-role-summary{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.ticket-role-summary-item{display:flex;justify-content:space-between;padding:8px;border:1px solid var(--line);border-radius:8px;background:#091624}
.ticket-role-summary-item span{font-size:9px;color:var(--muted)}
.ticket-role-summary-item strong{font-size:10px}
.ticket-access-box{margin-top:12px;border:1px solid var(--line);border-radius:11px;overflow:hidden;background:#081522}
.ticket-access-box summary{
  list-style:none;display:flex;justify-content:space-between;gap:10px;padding:11px 12px;
  cursor:pointer;background:#0d1a2b
}
.ticket-access-box summary span{font-size:9px;color:var(--muted)}
.ticket-access-body{padding:12px}
.ticket-role-columns{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ticket-role-column-head p{margin:3px 0 9px;color:var(--muted);font-size:9px}
.compact-role-grid{max-height:280px;overflow:auto;padding:4px}
.role-list-search{margin-bottom:7px}
.ticket-role-note{margin-top:10px;padding:8px 10px;border:1px solid rgba(240,189,98,.22);border-radius:8px;background:rgba(240,189,98,.045);font-size:9px;color:#d8c397}
.internal-thread-config{border-top:1px solid var(--line-soft);padding-top:12px}

/* DEV */
.dev-mode-hero{
  display:flex;justify-content:space-between;align-items:center;gap:18px;padding:18px 20px;
  border:1px solid var(--line);border-radius:16px;background:linear-gradient(145deg,#121f33,#0a1626)
}
.dev-mode-hero.running{border-color:rgba(85,212,146,.3);box-shadow:inset 3px 0 0 var(--success)}
.dev-mode-hero.stopped{border-color:rgba(126,147,178,.22)}
.dev-mode-hero p{margin:4px 0;color:var(--muted)}
.dev-admin-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:14px}
.dev-action-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.dev-action-cards form{display:flex;flex-direction:column;gap:6px;padding:11px;border:1px solid var(--line);border-radius:10px;background:#091624}
.dev-test-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:10px}
.dev-test-steps>div{display:flex;gap:8px;padding:9px;border:1px solid var(--line);border-radius:9px;background:#091624}
.dev-test-steps b{width:22px;height:22px;display:grid;place-items:center;border-radius:7px;background:rgba(93,143,255,.12);color:#a8c7ff}
.dev-test-steps span{font-size:9px;color:#b8c5d7}

@media(max-width:1000px){
  .permissions-v302-layout,.external-user-layout,.external-detail-grid,.dev-admin-grid{grid-template-columns:1fr}
  .permission-role-browser{position:static;max-height:none}
  .ticket-role-columns{grid-template-columns:1fr}
  .dev-action-cards,.dev-test-steps{grid-template-columns:1fr}
}
@media(max-width:760px){
  .login-shell{grid-template-columns:1fr;margin:30px auto}
  .login-separator{display:none}
  .capability-grid{grid-template-columns:1fr}
  .ticket-role-summary{grid-template-columns:1fr}
  .dev-mode-hero{flex-direction:column;align-items:stretch}
}


/* =========================================================
   v30.2 — tickets / permissions / comptes / mode DEV
   ========================================================= */
.login-shell{max-width:1050px;margin:60px auto;display:grid;grid-template-columns:1fr 64px 1fr;gap:18px;align-items:stretch}
.login-brand-panel,.login-local-panel{padding:34px;border:1px solid var(--border);border-radius:22px;background:var(--card)}
.login-separator{display:flex;align-items:center;justify-content:center;color:var(--muted)}
.login-separator span{padding:8px;background:var(--bg)}
.login-local-form{display:grid;gap:12px;margin-top:18px}
.login-local-form label,.modern-form-grid label{display:block;margin-bottom:6px;font-weight:700}
.forgot-link,.text-link{display:inline-block;margin-top:14px}
.login-no-register{margin-top:18px;padding:12px;border-radius:12px;background:rgba(255,193,7,.08);font-size:12px}
.dev-login-warning{padding:12px;border-radius:12px;background:rgba(255,193,7,.12);font-weight:700}

.permissions-v302-layout{display:grid;grid-template-columns:310px minmax(0,1fr);gap:14px;align-items:start}
.permission-role-browser{position:sticky;top:80px;max-height:calc(100vh - 100px);overflow:hidden}
.permission-role-head{display:grid;gap:10px}
.permission-config-summary{display:flex;gap:8px;align-items:center;padding:10px;margin:10px 0;border-radius:12px;background:var(--soft)}
.permission-role-list{max-height:65vh;overflow:auto;display:grid;gap:5px}
.permission-role-row{display:grid;grid-template-columns:12px minmax(0,1fr) auto;gap:8px;align-items:center;padding:10px;border-radius:10px;text-decoration:none;color:inherit;border:1px solid transparent}
.permission-role-row:hover,.permission-role-row.selected{background:var(--soft);border-color:var(--border)}
.permission-role-count{font-size:10px;color:var(--muted)}
.permission-role-count.configured{color:#23a55a;font-weight:800}
.role-dot{display:inline-block;width:10px;height:10px;border-radius:999px;flex:0 0 auto}
.large-role-dot{width:18px;height:18px}
.permission-quick-actions{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:12px}
.capability-groups{display:grid;gap:10px}
.capability-group{border:1px solid var(--border);border-radius:14px;overflow:hidden;background:var(--card)}
.capability-group summary{display:flex;justify-content:space-between;padding:13px 15px;cursor:pointer;background:var(--soft)}
.capability-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--border)}
.capability-row{display:flex;gap:10px;align-items:flex-start;padding:12px;background:var(--card);cursor:pointer}
.capability-row input{margin-top:3px}
.capability-row span{display:grid;gap:4px}
.capability-row small{color:var(--muted)}
.permission-save-bar{position:sticky;bottom:10px;margin-top:14px;padding:12px;border:1px solid var(--border);border-radius:14px;background:var(--card);display:flex;justify-content:space-between;align-items:center;gap:12px;box-shadow:0 10px 30px rgba(0,0,0,.12)}
.legacy-permission-reference{margin-top:12px}
.legacy-level-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding:10px}
.legacy-level-grid div{display:flex;justify-content:space-between;padding:8px;background:var(--soft);border-radius:8px}

.mention-picker-v302{border:1px solid var(--border);border-radius:16px;padding:14px;background:var(--card);margin:14px 0}
.mention-picker-head,.mention-target-row{display:flex;align-items:center;justify-content:space-between;gap:10px}
.mention-picker-head>div{display:grid;gap:3px}
.mention-picker-head span{font-size:11px;color:var(--muted)}
.mention-target-row{margin:12px 0;padding:10px;background:var(--soft);border-radius:12px}
.mention-target-row select{flex:1}
.mention-status{font-size:11px;color:var(--muted)}
.mention-status.ready{color:#23a55a}
.mention-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}
.mention-tab,.mention-quick{border:1px solid var(--border);background:var(--soft);padding:8px 10px;border-radius:10px;cursor:pointer;color:inherit}
.mention-tab.active{font-weight:800;border-color:var(--user-accent)}
.mention-panel{display:none}
.mention-panel.active{display:block}
.mention-search{width:100%;margin-bottom:8px}
.mention-choice-grid{display:flex;gap:6px;flex-wrap:wrap;max-height:220px;overflow:auto}
.mention-choice{display:flex;align-items:center;gap:6px;border:1px solid var(--border);background:var(--card);color:inherit;border-radius:9px;padding:7px 9px;cursor:pointer}
.mention-choice:hover{background:var(--soft)}

.ticket-architecture-box,.ticket-role-summary,.internal-thread-config{padding:12px;border:1px solid var(--border);border-radius:14px;background:var(--soft)}
.ticket-architecture-flow{display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-weight:800}
.ticket-role-summary{display:flex;gap:12px;flex-wrap:wrap}
.ticket-role-summary-item{display:grid;gap:3px;padding:8px 12px;border-radius:10px;background:var(--card)}
.ticket-access-box{margin-top:14px;border:1px solid var(--border);border-radius:14px;overflow:hidden}
.ticket-access-box>summary{display:flex;justify-content:space-between;padding:14px;cursor:pointer;background:var(--soft)}
.ticket-access-body{padding:14px}
.ticket-role-columns{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.ticket-role-column-head{min-height:72px}
.compact-role-grid{max-height:300px;overflow:auto}
.role-list-search{width:100%;margin:8px 0}
.ticket-role-note{margin-top:12px;padding:10px;border-radius:10px;background:rgba(88,101,242,.08);font-size:11px}

.external-user-layout,.external-detail-grid,.dev-admin-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:14px}
.external-user-list{display:grid;gap:6px}
.external-user-row{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px;border:1px solid var(--border);border-radius:12px;color:inherit;text-decoration:none}
.external-user-row:hover{background:var(--soft)}
.external-avatar{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:var(--soft);font-weight:900}
.external-user-main{display:grid;gap:3px}
.external-user-main span{font-size:11px;color:var(--muted)}
.external-user-flags{display:flex;gap:5px;flex-wrap:wrap;justify-content:flex-end}
.modern-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.field-span-2{grid-column:1/-1}
.reset-request-box,.document-add-box{margin-top:14px}
.reset-request-row{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--border)}
.permission-readonly-note{border-left:3px solid #f0b232}

.dev-mode-pill{padding:4px 7px;border-radius:7px;background:#f0b232;color:#161616;font-weight:900;font-size:10px}
.dev-mode-hero{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:22px;border-radius:18px;margin-bottom:14px;border:1px solid var(--border)}
.dev-mode-hero.running{background:linear-gradient(135deg,rgba(35,165,90,.12),rgba(88,101,242,.08))}
.dev-mode-hero.stopped{background:var(--soft)}
.dev-production-actions{border:1px solid rgba(35,165,90,.35)}
.dev-action-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.dev-action-cards form{display:grid;gap:6px;padding:12px;border:1px solid var(--border);border-radius:12px}
.dev-test-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.dev-test-steps div{display:grid;grid-template-columns:28px 1fr;gap:8px;align-items:start;padding:10px;background:var(--soft);border-radius:10px}
.dev-test-steps b{width:26px;height:26px;border-radius:999px;display:grid;place-items:center;background:var(--card)}

@media(max-width:900px){
  .login-shell,.permissions-v302-layout,.external-user-layout,.external-detail-grid,.dev-admin-grid,.ticket-role-columns{grid-template-columns:1fr}
  .login-separator{display:none}
  .permission-role-browser{position:static;max-height:none}
  .capability-grid,.legacy-level-grid,.modern-form-grid{grid-template-columns:1fr}
  .field-span-2{grid-column:auto}
  .dev-action-cards,.dev-test-steps{grid-template-columns:1fr}
  .mention-picker-head,.mention-target-row,.dev-mode-hero{align-items:stretch;flex-direction:column}
}

.ticket-workflow{
  display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:14px 0
}
.ticket-workflow>div{
  display:flex;gap:9px;align-items:center;padding:10px 12px;border:1px solid var(--line);
  border-radius:11px;background:#091624
}
.ticket-workflow b{
  width:28px;height:28px;display:grid;place-items:center;border-radius:8px;
  background:rgba(93,143,255,.12);color:#acd0ff
}
.ticket-workflow span{display:flex;flex-direction:column}
.ticket-workflow small{margin-top:2px}
.ticket-dashboard-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(300px,.6fr);gap:14px}
.ticket-panel-card-list{display:grid;gap:7px;margin-top:9px}
.ticket-panel-card{
  display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:12px;
  padding:11px 12px;border:1px solid var(--line);border-radius:10px;background:#091624
}
.ticket-panel-card:hover{border-color:#415d80;background:#0d1b2e}
.ticket-panel-card-main{display:flex;flex-direction:column;min-width:0}
.ticket-panel-card-main span{font-size:9px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ticket-panel-card-stats{display:flex;gap:6px;flex-wrap:wrap}
.ticket-panel-card-stats span{padding:4px 6px;border-radius:7px;background:#0d1b2d;color:#8fa2bb;font-size:8px}
.ticket-panel-open{color:#9fc2f7;font-size:9px;font-weight:800}
.ticket-create-simple form{display:grid;gap:8px;margin-top:12px}
@media(max-width:900px){
  .ticket-workflow,.ticket-dashboard-grid{grid-template-columns:1fr}
  .ticket-panel-card{grid-template-columns:1fr}
}

.one-click-update-note{
  margin-top:10px;
  padding:9px 11px;
  border:1px solid rgba(85,212,146,.20);
  border-radius:9px;
  background:rgba(85,212,146,.045);
  color:#9fcbb7;
  font-size:9px;
  line-height:1.5;
}
.update-runtime-process{
  display:block;
  margin-top:3px;
  font-size:8px;
  color:var(--muted);
  font-weight:700;
}
.update-status-card.state-queued{
  border-color:rgba(93,143,255,.32);
  box-shadow:inset 3px 0 0 #6d9eff;
}

.calendar-view-actions{
  flex-wrap:wrap;
}
.calendar-list-card{
  margin-top:18px;
}
.calendar-event-list-table td{
  vertical-align:middle;
}
.event-edit-card summary{
  cursor:pointer;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
}
.event-linked-vehicle-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
  gap:9px;
  margin-top:14px;
}
.event-linked-vehicle{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  padding:10px 11px;
  border:1px solid var(--border);
  border-radius:10px;
  background:rgba(255,255,255,.025);
}
.event-linked-vehicle > div{
  display:flex;
  flex-direction:column;
  gap:2px;
}
.event-linked-vehicle span{
  color:var(--muted);
  font-size:9px;
}
.event-add-vehicle-form{
  margin-top:14px;
  padding-top:12px;
  border-top:1px solid var(--border);
}
.event-add-vehicle-form select{
  min-width:240px;
}
.event-danger-zone{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:18px;
  border-color:rgba(231,76,60,.25);
}
@media(max-width:800px){
  .event-danger-zone{align-items:stretch;flex-direction:column}
  .event-add-vehicle-form .actions{align-items:stretch}
  .event-add-vehicle-form select{min-width:0;width:100%}
}