/* ═══════════════════════════════════════════════════════════
   RH Manager — components.css
   Composants UI réutilisables
   ═══════════════════════════════════════════════════════════ */

/* ── Calendrier ─────────────────────────────────────────── */
.cal-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 1px;
  background: var(--border);
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
  overflow: hidden;
}
.cal-header { background: var(--wit-dark); color: white; text-align: center; font-size: 11px; font-weight: 600; padding: 7px 2px; }
.cal-cell   { background: var(--surface); min-height: 72px; padding: 5px; }
.cal-empty  { background: var(--bg); }
.cal-weekend{ background: #F5F5F4; }
.cal-weekend .cal-num { color: #a8a29e; }
.cal-today  { background: #EFF6FF; box-shadow: inset 0 0 0 2px var(--info); }
.cal-ferme  { background: #FEF2F2; }
.cal-num    { font-size: 12px; font-weight: 600; color: var(--text); margin-bottom: 2px; }
.cal-ferm-label { font-size: 9px; color: #DC2626; font-weight: 600; line-height: 1.2; margin-bottom: 2px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.cal-dots   { display: flex; flex-wrap: wrap; gap: 2px; margin-top: 2px; }

/* ── Boutons ───────────────────────────────────────────── */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 15px;
  border-radius: var(--r-sm);
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  border: none;
  transition: all var(--transition);
  white-space: nowrap;
  text-decoration: none;
  line-height: 1.4;
}
.btn:disabled { opacity: .5; cursor: not-allowed; }

.btn-primary   { background: var(--wit);     color: #fff; }
.btn-primary:hover   { background: var(--wit-dark); }

.btn-con       { background: var(--con);     color: #fff; }
.btn-con:hover       { background: var(--con-dark); }

.btn-secondary { background: var(--surface); color: var(--text); border: 1px solid var(--border); }
.btn-secondary:hover { background: var(--bg); }

.btn-success   { background: var(--success); color: #fff; }
.btn-success:hover   { background: #059669; }

.btn-danger    { background: var(--danger);  color: #fff; }
.btn-danger:hover    { background: #dc2626; }

.btn-warning   { background: var(--warning); color: #fff; }
.btn-warning:hover   { background: #d97706; }

.btn-ghost     { background: transparent; color: var(--text-2); border: 1px solid transparent; }
.btn-ghost:hover     { background: var(--bg); border-color: var(--border); color: var(--text); }

.btn-full { width: 100%; justify-content: center; }
.btn-lg   { padding: 11px 20px; font-size: 14px; }
.btn-sm   { padding: 4px 10px; font-size: 11px; }
.btn-xs   { padding: 2px 8px;  font-size: 11px; }

/* ── Cards ─────────────────────────────────────────────── */
.card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r);
  padding: 18px;
  box-shadow: var(--shadow);
}

.card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 14px;
}

.card-title {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 15px;
  font-weight: 600;
}

.card-flush { padding: 0; overflow: hidden; }

/* ── Stat cards ────────────────────────────────────────── */
.stat-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r);
  padding: 16px 18px;
  box-shadow: var(--shadow);
}
.stat-label {
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .5px;
  color: var(--text-3);
  margin-bottom: 5px;
}
.stat-value {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 26px;
  font-weight: 700;
  letter-spacing: -1px;
  line-height: 1;
}
.stat-sub { font-size: 12px; color: var(--text-2); margin-top: 3px; }

/* ── Tables ────────────────────────────────────────────── */
table { width: 100%; border-collapse: collapse; }

th {
  text-align: left;
  padding: 9px 12px;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .5px;
  color: var(--text-3);
  border-bottom: 1px solid var(--border);
  white-space: nowrap;
  background: var(--bg);
}

td {
  padding: 11px 12px;
  border-bottom: 1px solid var(--border);
  font-size: 13px;
  vertical-align: middle;
}

tr:last-child td { border-bottom: none; }
tbody tr:hover td { background: var(--bg); }

/* ── Pills / Status ────────────────────────────────────── */
.pill {
  display: inline-block;
  padding: 2px 9px;
  border-radius: 20px;
  font-size: 11px;
  font-weight: 500;
  white-space: nowrap;
}
.pill-pending  { background: var(--warning-light); color: #854D0E; }
.pill-approved { background: var(--success-light); color: #166534; }
.pill-rejected { background: var(--danger-light);  color: #991B1B; }
.pill-sent     { background: var(--info-light);    color: #1e40af; }
.pill-grey     { background: #F3F4F6;              color: #374151; }
.pill-wit      { background: var(--wit-light);     color: var(--wit); }
.pill-con      { background: var(--con-light);     color: var(--con); }

/* ── Company tag ───────────────────────────────────────── */
.co-tag {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 9px;
  border-radius: 20px;
  font-size: 11px;
  font-weight: 500;
}
.co-tag-wit { background: var(--wit-light); color: var(--wit); }
.co-tag-con { background: var(--con-light); color: var(--con); }

/* ── Chip ──────────────────────────────────────────────── */
.chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 9px;
  border-radius: 20px;
  font-size: 11px;
  font-weight: 500;
  background: var(--bg);
  border: 1px solid var(--border);
  color: var(--text-2);
}

/* ── Alerts ────────────────────────────────────────────── */
.alert {
  padding: 11px 14px;
  border-radius: var(--r-sm);
  font-size: 13px;
  margin-bottom: 14px;
  display: flex;
  align-items: flex-start;
  gap: 9px;
  line-height: 1.5;
}
.alert-info    { background: var(--info-light);    color: #1e40af; border: 1px solid #BFDBFE; }
.alert-success { background: var(--success-light); color: #166534; border: 1px solid #BBF7D0; }
.alert-warning { background: var(--warning-light); color: #854D0E; border: 1px solid #FDE68A; }
.alert-danger  { background: var(--danger-light);  color: #991B1B; border: 1px solid #FECACA; }

/* ── Modals ────────────────────────────────────────────── */
.modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.4);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
  backdrop-filter: blur(2px);
}
.modal {
  background: var(--surface);
  border-radius: var(--r-lg);
  padding: 26px;
  width: 540px;
  max-width: min(95vw, 600px);
  max-height: 82vh;
  overflow-y: auto;
  box-shadow: var(--shadow-xl);
}
.modal-wide { width: 640px; max-width: min(95vw, 640px); }
.modal-xl   { width: 820px; max-width: min(95vw, 820px); }
.modal-sm   { width: 380px; max-width: min(95vw, 380px); }

.modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 18px;
}
.modal-title {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 17px;
  font-weight: 600;
}
.modal-close {
  background: none;
  border: none;
  font-size: 22px;
  cursor: pointer;
  color: var(--text-3);
  line-height: 1;
  padding: 2px;
  transition: color var(--transition);
}
.modal-close:hover { color: var(--text); }

/* ── Tabs ──────────────────────────────────────────────── */
.tabs {
  display: flex;
  gap: 2px;
  background: var(--bg);
  border-radius: var(--r-sm);
  padding: 3px;
  margin-bottom: 18px;
}
.tab {
  flex: 1;
  padding: 7px 12px;
  border-radius: 5px;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  border: none;
  background: none;
  color: var(--text-2);
  transition: all var(--transition);
  text-align: center;
}
.tab.active {
  background: var(--surface);
  color: var(--text);
  box-shadow: var(--shadow);
}

/* ── Sidebar ───────────────────────────────────────────── */
.sidebar {
  position: fixed;
  left: 0; top: 0; bottom: 0;
  width: var(--sb-width);
  background: var(--sb-bg);
  color: #fff;
  display: flex;
  flex-direction: column;
  z-index: 100;
  overflow-y: auto;
}

.sb-header {
  padding: 20px 18px 14px;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.sb-logo {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 17px;
  font-weight: 700;
  letter-spacing: -.3px;
}
.sb-logo span { color: #60A5FA; }
.sb-user {
  margin-top: 8px;
  font-size: 11px;
  color: rgba(255,255,255,.4);
}
.sb-user strong {
  display: block;
  color: rgba(255,255,255,.8);
  font-size: 12px;
  font-weight: 500;
}

.co-switcher {
  padding: 9px 12px;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.co-btn {
  display: block;
  width: 100%;
  padding: 6px 9px;
  border-radius: var(--r-sm);
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  border: none;
  text-align: left;
  transition: all var(--transition);
  margin-bottom: 3px;
  color: rgba(255,255,255,.5);
  background: transparent;
}
.co-btn:hover              { background: rgba(255,255,255,.08); color: #fff; }
.co-btn.active-wit         { background: rgba(29,78,216,.3);   color: #93C5FD; }
.co-btn.active-con         { background: rgba(15,118,110,.3);  color: #5EEAD4; }

.sb-nav { flex: 1; padding: 9px 9px; }

.nav-section {
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: rgba(255,255,255,.25);
  padding: 9px 7px 4px;
}
.nav-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px 8px;
  border-radius: var(--r-sm);
  color: rgba(255,255,255,.55);
  cursor: pointer;
  font-size: 13px;
  transition: all var(--transition);
  margin-bottom: 1px;
  border: none;
  background: none;
  width: 100%;
  text-align: left;
}
.nav-item:hover          { background: rgba(255,255,255,.08); color: #fff; }
.nav-item.active         { background: rgba(255,255,255,.12); color: #fff; font-weight: 500; }
.nav-icon                { font-size: 14px; width: 16px; text-align: center; flex-shrink: 0; }
.nav-badge {
  margin-left: auto;
  background: var(--danger);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  padding: 1px 6px;
  border-radius: 10px;
  min-width: 18px;
  text-align: center;
}

.sb-footer {
  padding: 12px;
  border-top: 1px solid rgba(255,255,255,.08);
}

/* ── Main content area ─────────────────────────────────── */
.main {
  margin-left: var(--sb-width);
  padding: 26px 30px;
  min-height: 100vh;
  min-width: 0;
  max-width: 100%;
}
.page { min-width: 0; max-width: 100%; }
.grid > * { min-width: 0; }

/* ── Page header ───────────────────────────────────────── */
.page-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 22px;
  gap: 12px;
  flex-wrap: wrap;
}
.page-title {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 21px;
  font-weight: 700;
  letter-spacing: -.5px;
}
.page-subtitle { color: var(--text-2); font-size: 13px; margin-top: 2px; }

/* ── Section title ─────────────────────────────────────── */
.section-title {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 10px;
  color: var(--text);
}

/* ── Process box ───────────────────────────────────────── */
.process-box {
  background: linear-gradient(135deg, var(--wit-light), #F0F9FF);
  border: 1px solid #BFDBFE;
  border-radius: var(--r);
  padding: 18px;
  margin-bottom: 18px;
}
.process-step {
  display: flex;
  gap: 11px;
  margin-bottom: 10px;
  align-items: flex-start;
}
.process-step:last-child { margin-bottom: 0; }
.process-num {
  width: 24px; height: 24px;
  border-radius: 50%;
  background: var(--wit);
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: 11px;
  flex-shrink: 0;
  margin-top: 1px;
}

/* ── Avatar ────────────────────────────────────────────── */
.avatar {
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  color: #fff;
  flex-shrink: 0;
}
.avatar-sm  { width: 32px; height: 32px; font-size: 12px; }
.avatar-md  { width: 38px; height: 38px; font-size: 14px; }
.avatar-lg  { width: 52px; height: 52px; font-size: 18px; }
.avatar-xl  { width: 72px; height: 72px; font-size: 26px; }
.avatar-wit { background: var(--wit); }
.avatar-con { background: var(--con); }
.avatar-grey{ background: #6B7280; }

/* ── Progress bar ──────────────────────────────────────── */
.progress-bar  { height: 5px; background: var(--border); border-radius: 3px; overflow: hidden; margin-top: 4px; }
.progress-fill { height: 100%; border-radius: 3px; transition: width .3s ease; }

/* ── Employee card ─────────────────────────────────────── */
.employee-card {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 13px;
  border: 1px solid var(--border);
  border-radius: var(--r);
  background: var(--surface);
  cursor: pointer;
  transition: all var(--transition);
  position: relative;
  min-width: 0;
}
.employee-card:hover         { border-color: var(--wit); box-shadow: var(--shadow-md); }
.employee-card.archived      { opacity: .55; background: var(--bg); }
.employee-card .archived-tag {
  position: absolute; top: 7px; right: 7px;
  background: #6B7280; color: #fff;
  font-size: 9px; padding: 1px 6px; border-radius: 10px; font-weight: 600;
}

/* ── Paie lines ────────────────────────────────────────── */
.paie-line {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 7px 0;
  border-bottom: 1px solid var(--border);
  font-size: 13px;
}
.paie-line:last-child { border-bottom: none; }
.paie-total {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 0 0;
  font-weight: 700;
  font-size: 15px;
  font-family: 'Space Grotesk', sans-serif;
}

/* ── Upload zone ───────────────────────────────────────── */
.upload-zone {
  border: 2px dashed var(--border);
  border-radius: var(--r);
  padding: 24px;
  text-align: center;
  cursor: pointer;
  transition: all var(--transition);
}
.upload-zone:hover {
  border-color: var(--wit);
  background: var(--wit-light);
}

/* ── Tickets resto ─────────────────────────────────────── */
.tr-neg  { color: var(--danger);  font-weight: 600; }
.tr-pos  { color: var(--success); font-weight: 600; }
.tr-zero { color: var(--text-2); }

/* ── CSV preview ───────────────────────────────────────── */
.csv-preview {
  overflow-x: auto;
  max-height: 240px;
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
  margin-top: 8px;
}
.csv-preview table  { font-size: 11px; }
.csv-preview th,
.csv-preview td     { padding: 5px 9px; }

/* ── Responsive ────────────────────────────────────────── */
.mobile-topbar {
  display: none;
  position: fixed; top: 0; left: 0; right: 0;
  height: 52px; z-index: 200;
  background: var(--sb-bg); color: #fff;
  align-items: center; gap: 12px; padding: 0 16px;
}
.hamburger {
  background: none; border: none; color: #fff;
  font-size: 22px; cursor: pointer; padding: 2px 4px; line-height: 1;
}
.sb-overlay {
  display: none; position: fixed; inset: 0;
  background: rgba(0,0,0,.45); z-index: 150;
}

@media (max-width: 768px) {
  .mobile-topbar { display: flex; }
  .sb-overlay.open { display: block; }
  .sidebar {
    transform: translateX(-100%);
    transition: transform .25s ease;
    z-index: 160;
  }
  .sidebar.mob-open { transform: translateX(0); }
  .main { margin-left: 0 !important; padding: 16px; padding-top: 68px; }
  .page-header { flex-direction: column; align-items: flex-start; gap: 10px; }
  .page-header > div:last-child { align-self: stretch; }
  .grid.g2 { grid-template-columns: 1fr; }
  .grid.g3 { grid-template-columns: 1fr 1fr; }
  .grid.g4 { grid-template-columns: 1fr 1fr; }
  .modal   { width: 96vw; max-width: none; margin: 10px; max-height: 92vh; overflow-y: auto; }
  .card-flush table { font-size: 12px; }
  .card-flush table th, .card-flush table td { padding: 5px 7px; }
  .btn-lg  { padding: 10px 18px; font-size: 14px; }
  .stat-card { padding: 12px; }
  .stat-value { font-size: 24px; }
  .process-box { padding: 14px; }
  .tabs { overflow-x: auto; white-space: nowrap; }
  .invite-benefits { grid-template-columns: 1fr !important; }
  .invite-email-row { flex-direction: column; }
  .invite-email-row .btn { width: 100%; justify-content: center; }
}

/* Veille réglementaire & assistant */
.reg-loading{padding:48px;color:var(--text-3)}
.reg-hero{padding:48px 52px 38px;background:#f7f5ef;border:1px solid #e8e3d8;border-radius:18px;margin-bottom:24px}
.reg-kicker{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:#766d5c;font-weight:700}
.reg-hero h1{font-family:Georgia,serif;font-size:38px;line-height:1.12;font-weight:400;color:#23221f;margin:12px 0 14px}
.reg-hero p{max-width:680px;font-size:15px;line-height:1.7;color:#625e55;margin:0}
.reg-layout{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(310px,.85fr);gap:24px;align-items:start}
.reg-section-title{display:flex;justify-content:space-between;gap:20px;align-items:end;margin:4px 0 16px}
.reg-section-title h2,.assistant-panel h2{font-family:Georgia,serif;font-weight:400;color:#292722;margin:7px 0 0;font-size:24px}
.reg-freshness,.reg-status{font-size:11px;color:#52705c;background:#edf4ee;border-radius:999px;padding:5px 9px}
.reg-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.reg-card{background:#fff;border:1px solid #e8e5de;border-radius:14px;padding:20px;min-height:190px;display:flex;flex-direction:column}
.reg-card-top{display:flex;justify-content:space-between;gap:12px;font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:#766d5c}
.reg-card h3{font-size:14px;font-weight:600;margin:22px 0 6px;color:#33312d}
.reg-value{font-family:Georgia,serif;font-size:21px;line-height:1.3;color:#191815}
.reg-meta{font-size:12px;color:#8a857b;margin:8px 0 18px}
.reg-card a,.assistant-bubble a{color:#4c5d55;text-decoration:underline;text-underline-offset:3px;font-size:12px;margin-top:auto}
.reg-alert-panel{display:flex;justify-content:space-between;align-items:center;gap:24px;border:1px solid #ded2ba;background:#fbf8f0;padding:18px 22px;border-radius:14px;margin-bottom:24px}
.reg-alert-panel h3{margin:5px 0 0}.reg-alert-panel p{max-width:520px;color:#6d6558;font-size:13px;margin:0}
.reg-alert-row{display:flex;align-items:center;gap:10px;margin-top:10px;font-size:12px}.reg-alert-row a{color:#4c5d55}.reg-alert-row button{border:1px solid #cfc4ae;background:#fff;border-radius:8px;padding:6px 8px;color:#554e43;cursor:pointer}
.assistant-panel{background:#222522;color:#fff;border-radius:18px;padding:25px;position:sticky;top:24px;box-shadow:0 14px 40px rgba(23,26,23,.12)}
.assistant-panel .reg-kicker{color:#b8b9ae}.assistant-panel h2{color:#fff}.assistant-intro{font-size:13px;line-height:1.55;color:#c9cbc5}
.assistant-messages{height:260px;overflow:auto;margin:18px -5px;padding:5px;display:flex;flex-direction:column;gap:10px}
.assistant-bubble{max-width:88%;padding:11px 13px;border-radius:13px;font-size:13px;line-height:1.5;display:flex;flex-direction:column;gap:7px}
.assistant-bubble-bot{background:#f2f0e9;color:#302f2b;border-bottom-left-radius:3px}.assistant-bubble-user{background:#586b61;color:#fff;align-self:flex-end;border-bottom-right-radius:3px}
.assistant-bubble small{font-size:10px;color:#77736a;border-top:1px solid #dcd8ce;padding-top:6px}
.assistant-suggestions{display:flex;gap:6px;overflow:auto;padding-bottom:10px}.reg-chip{white-space:nowrap;border:1px solid #4d514d;background:transparent;color:#dcddd8;border-radius:999px;padding:7px 10px;font-size:11px;cursor:pointer}
.reg-chip:hover{background:#343834}.assistant-form{display:flex;gap:8px;background:#fff;border-radius:12px;padding:6px;align-items:end}.assistant-form textarea{border:0;resize:none;outline:0;flex:1;padding:8px;font:inherit;font-size:13px}.assistant-send{width:38px;height:38px;border:0;border-radius:9px;background:#586b61;color:#fff;font-size:20px;cursor:pointer}.assistant-send:disabled{opacity:.45}
.assistant-privacy{font-size:10px;line-height:1.45;color:#999d96;margin-top:10px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.reg-faq-panel{background:#f7f5ef;border:1px solid #e3ded2;border-radius:18px;padding:25px;position:sticky;top:24px}.reg-faq-panel h2{font-family:Georgia,serif;font-size:25px;line-height:1.25;font-weight:400;margin:8px 0 10px;color:#292722}.reg-faq-intro{font-size:13px;line-height:1.6;color:#716b61;margin:0 0 18px}.reg-faq-list{display:flex;flex-direction:column;gap:8px}.reg-faq-item{background:#fff;border:1px solid #e7e2d8;border-radius:12px;padding:0 14px}.reg-faq-item summary{cursor:pointer;font-size:13px;font-weight:650;line-height:1.45;padding:13px 24px 13px 0;position:relative;list-style:none}.reg-faq-item summary::-webkit-details-marker{display:none}.reg-faq-item summary::after{content:'+';position:absolute;right:1px;top:11px;color:#53645b;font-size:18px;font-weight:400}.reg-faq-item[open] summary::after{content:'–'}.reg-faq-item p{font-size:12px;line-height:1.6;color:#6f6960;border-top:1px solid #eeeae2;margin:0;padding:12px 0 14px}
.invite-user-grid{display:grid;grid-template-columns:minmax(280px,2fr) minmax(170px,1fr) auto;align-items:end;gap:12px}
.invite-user-grid>*{min-width:0}
.access-user-row{display:flex;align-items:center;gap:12px;background:var(--bg);border:1px solid var(--border);border-radius:10px;padding:10px 14px;min-width:0}
.access-user-meta{font-size:11px;color:var(--text-2);display:flex;align-items:center;gap:8px;min-width:0;flex-wrap:wrap}
.access-user-email{overflow-wrap:anywhere;word-break:break-word}
.access-user-actions{display:flex;align-items:center;gap:8px;flex:0 0 auto}
.invite-email-field input{min-height:42px;font-size:14px}
.invite-user-button{min-height:42px;white-space:nowrap;padding-left:20px;padding-right:20px}

.accounting-company-followup{overflow:hidden}.accounting-company-heading{padding:13px 17px;background:#f6f5f2;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;gap:12px}.accounting-company-heading>div{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap}.accounting-company-heading span{font-weight:750;color:var(--text)}.accounting-company-heading small{color:var(--text-2)}.accounting-company-count{font-size:11px!important;color:var(--text-2)!important}.accounting-followup-row{display:grid;grid-template-columns:30px minmax(0,1fr) auto;align-items:center;gap:11px;padding:12px 17px;border-top:1px solid var(--border)}.accounting-followup-row:first-of-type{border-top:0}.accounting-followup-icon{width:30px;height:30px;border-radius:9px;background:#f1f4fb;display:flex;align-items:center;justify-content:center}.accounting-followup-copy{display:flex;flex-direction:column;gap:3px;min-width:0}.accounting-followup-copy strong{font-size:13px}.accounting-followup-copy span{font-size:11px;color:var(--text-2)}
.accountant-payroll-nav{display:flex;align-items:center;gap:12px;margin:0 0 18px;flex-wrap:wrap}.accountant-company-tabs{display:flex;gap:6px;flex-wrap:wrap}.accountant-company-tabs button{border:1px solid var(--border);background:#fff;color:var(--text-2);border-radius:999px;padding:7px 14px;font-weight:650;cursor:pointer}.accountant-company-tabs button.active{background:#26303a;color:#fff;border-color:#26303a}
.payroll-prime-row{display:grid;grid-template-columns:minmax(140px,1fr) 94px 76px auto;gap:7px;align-items:center;padding:8px 0;border-top:1px solid var(--border)}
.payroll-prime-row>*{min-width:0}.payroll-prime-row input,.payroll-prime-row select{width:100%;box-sizing:border-box}.payroll-prime-amount{display:flex;align-items:center;gap:4px}.payroll-prime-amount input{text-align:right}.payroll-prime-unit{font-weight:750}.payroll-prime-unit.is-net{border-color:#ef4444;color:#b91c1c;background:#fff7f7}.payroll-prime-delete{color:var(--danger);white-space:nowrap;padding-left:7px;padding-right:7px}
@media(max-width:900px){.reg-layout{grid-template-columns:1fr}.assistant-panel,.reg-faq-panel{position:static}.reg-hero{padding:32px 25px}.reg-hero h1{font-size:30px}}
@media(max-width:1000px){.accountant-home-grid{grid-template-columns:1fr!important}}
@media(max-width:1200px){.invite-user-grid{grid-template-columns:minmax(0,2fr) minmax(160px,1fr)}.invite-user-button{grid-column:1/-1;width:100%;justify-content:center}}
@media(max-width:760px){.invite-user-grid{grid-template-columns:1fr}.invite-user-button{width:100%;justify-content:center}}
@media(max-width:640px){
  .payroll-prime-row{grid-template-columns:minmax(0,1fr) 100px}.payroll-prime-unit{grid-column:1}.payroll-prime-delete{grid-column:2;width:100%;justify-content:center}
  .accounting-followup-row{grid-template-columns:30px minmax(0,1fr);padding:12px}.accounting-followup-row>button,.accounting-followup-row>div:last-child{grid-column:2;width:100%}.accounting-followup-row>button{justify-content:center}.accounting-company-heading{padding:12px}
  .main{padding-left:12px;padding-right:12px;overflow-x:hidden}
  .reg-hero,.reg-layout,.reg-layout>*,.reg-grid,.assistant-panel,.assistant-form{min-width:0;max-width:100%;box-sizing:border-box}.reg-hero{padding:24px 18px}.reg-hero h1{font-size:27px;overflow-wrap:anywhere}.reg-grid{grid-template-columns:1fr}.assistant-panel{padding:20px 16px;overflow:hidden}.assistant-messages{width:auto}.assistant-form textarea{min-width:0}.reg-chip{max-width:86vw;overflow:hidden;text-overflow:ellipsis}
  .page-header .btn{width:100%;justify-content:center}
  .employee-card{align-items:flex-start;flex-wrap:wrap}
  .employee-card>.avatar{flex:0 0 auto}
  .employee-card>div:last-child{width:100%;text-align:left!important;padding-left:49px}
  .access-user-row{align-items:flex-start;flex-wrap:wrap;padding:12px}
  .access-user-row>.avatar,.access-user-row>div:first-child{flex:0 0 auto}
  .access-user-actions{width:100%;padding-left:48px;flex-wrap:wrap}
  .access-user-actions select{flex:1 1 150px;min-width:0}
  .access-user-actions .btn{flex:1 1 auto;justify-content:center}
}
@media(max-width:560px){.reg-grid{grid-template-columns:1fr}.reg-section-title{align-items:start;flex-direction:column}.reg-alert-panel{align-items:start;flex-direction:column}}

/* Activation guidée, aperçu de rôle et tables mobiles */
.activation-screen{min-height:100vh;align-items:center;justify-content:center;padding:28px 14px;background:#f4f2ed}
.activation-shell{width:100%;max-width:560px}.activation-brand{display:block;width:165px;margin:0 auto 24px}
.activation-card{background:#fff;border:1px solid #dedbd4;border-radius:22px;padding:36px;box-shadow:0 18px 50px rgba(37,41,39,.1)}
.activation-loading{text-align:center;color:var(--text-2);padding:30px}.activation-kicker{text-transform:uppercase;letter-spacing:.13em;color:#176b68;font-size:11px;font-weight:700;text-align:center}
.activation-card h1{font-family:Georgia,serif;font-size:31px;font-weight:400;text-align:center;margin:10px 0 12px}.activation-lead{text-align:center;color:var(--text-2);font-size:14px;line-height:1.65;margin-bottom:24px}
.activation-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin:0 0 26px}.activation-steps span{font-size:11px;color:#65706b;background:#f1f4f3;border-radius:12px;padding:10px 8px;text-align:center}.activation-steps b{display:block;margin:0 auto 5px;width:22px;height:22px;line-height:22px;border-radius:50%;background:#176b68;color:#fff}
.activation-help{text-align:center;color:var(--text-3);font-size:11px;line-height:1.65;margin:18px 0 0}.activation-help a{color:var(--wit);font-weight:600}.activation-success{text-align:center;color:#176b68;font:400 26px/1.5 Georgia,serif;padding:40px 10px}.activation-success small{font:13px Arial,sans-serif;color:var(--text-2)}
.preview-banner{position:fixed;z-index:300;top:0;left:var(--sb-width);right:0;min-height:46px;background:#e8f1ef;border-bottom:1px solid #b8d4cf;color:#285b55;align-items:center;justify-content:center;gap:18px;padding:8px 16px;font-size:12px}.preview-banner-actions{display:flex;align-items:center;gap:8px}.preview-banner button{border:1px solid #176b68;background:#fff;color:#176b68;border-radius:999px;padding:6px 12px;font-weight:700}.preview-menu-button{display:none}body.preview-mode .main{padding-top:72px}body.preview-mode .main button:not(.preview-allowed),body.preview-mode .main input:not(.preview-allowed),body.preview-mode .main select:not(.preview-allowed),body.preview-mode .main textarea:not(.preview-allowed){pointer-events:none;opacity:.65}body.preview-mode .sb-footer{display:none}
.employee-guidance{display:flex;flex-direction:column;gap:9px;padding:15px 17px}.employee-guidance-row{display:flex;align-items:flex-start;gap:10px;font-size:13px;line-height:1.5}.employee-guidance-row b{display:flex;align-items:center;justify-content:center;flex:0 0 22px;height:22px;border-radius:50%;background:#fff;color:var(--wit);font-size:11px}

@media(max-width:640px){
  .activation-card{padding:26px 20px}.activation-card h1{font-size:27px}.activation-steps{grid-template-columns:1fr}.activation-steps span{display:flex;align-items:center;gap:8px;text-align:left}.activation-steps b{display:inline-block;text-align:center;margin:0}
  .preview-banner{left:0;top:52px;flex-direction:column;gap:6px;text-align:center}.preview-menu-button{display:inline-block}.preview-banner-actions{width:100%;justify-content:center}body.preview-mode .main{padding-top:146px}
  .mobile-card-table,.mobile-card-table tbody,.mobile-card-table tr,.mobile-card-table td{display:block;width:100%}.mobile-card-table thead{display:none}.mobile-card-table tr{padding:12px 14px;border-bottom:1px solid var(--border)}.mobile-card-table tr:last-child{border-bottom:0}.mobile-card-table td{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:5px 0!important;border:0!important;text-align:right!important;overflow-wrap:anywhere}.mobile-card-table td::before{content:attr(data-label);color:var(--text-3);font-size:10px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;text-align:left;flex:0 0 36%}.mobile-card-table td:first-child{font-size:14px;padding-bottom:9px!important}.mobile-card-table td:first-child::before{display:none}
  .compact-request-table tbody{display:block}.compact-request-table tr{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px 18px;padding:12px 14px}.compact-request-table td{display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;gap:3px;padding:0!important;text-align:left!important}.compact-request-table td::before{flex:none}.compact-request-table td:first-child{grid-column:1/-1;padding:0 0 4px!important}.compact-request-table td[data-label="Durée"]{grid-column:1;grid-row:3}.compact-request-table td[data-label="Statut"]{grid-column:2;grid-row:3}.compact-request-table td[data-label="Motif"]{grid-column:1/-1;grid-row:4}.compact-request-table td.mobile-optional-empty{display:none}
  .access-user-row{display:grid;grid-template-columns:40px minmax(0,1fr);align-items:start;gap:10px 12px}.access-user-actions{grid-column:2;width:auto;padding:0;display:grid;grid-template-columns:minmax(0,1fr) auto}.access-user-actions .btn{width:auto}
  .cv-document-banner{display:flex;flex-direction:column;align-items:flex-start;gap:10px}.cv-document-banner a,.cv-document-banner label{margin-left:0!important}
  .cv-employee-summary{grid-template-columns:1fr!important;gap:1px!important}.cv-employee-summary>div{padding:18px!important}.cv-response-actions{flex-direction:column}.cv-response-actions .btn{width:100%;justify-content:center}
}
