/* =====================================================================
   ERP — styles de base
   Palette : pétrole (structure), safran (repères actifs), papier (fond)
   ===================================================================== */
:root {
  --petrol: #0E4A55;
  --petrol-deep: #0A363E;
  --petrol-soft: #E3EEEF;
  --saffron: #D9A23A;
  --saffron-soft: #F7EBD2;
  --paper: #F4F6F5;
  --surface: #FFFFFF;
  --ink: #1B2A2F;
  --muted: #5E6F75;
  --line: #D8DFDD;
  --danger: #B3412E;
  --danger-soft: #F6E1DC;
  --success: #2F7D5B;
  --success-soft: #DCEFE5;
  --warning-soft: #F7EBD2;

  --font: "Instrument Sans", "Segoe UI", system-ui, -apple-system, sans-serif;
  --radius-s: 4px;
  --radius-m: 8px;
  --on-primary: #FFFFFF;
  --on-accent: #0A363E;
  --accent-ink: #7A5410;
  --ring: #C2DADD;
  --cell-y: .55rem;
  --field-y: .6rem;
  --sb-bg: var(--petrol-deep);
  --sb-ink: #D5E2E4;
  --sb-strong: #FFFFFF;
  --sb-muted: #8FAEB3;
  --sb-dim: #7F9EA3;
  --sb-hover: rgba(255,255,255,.07);
  --sb-active: rgba(255,255,255,.12);
  --sb-active-ink: #FFFFFF;
  --sb-line: rgba(255,255,255,.09);
  --sb-edge: transparent;
  --sidebar-w: 256px;
  --topbar-h: 60px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--font);
  font-size: 15px;
  line-height: 1.5;
  color: var(--ink);
  background: var(--paper);
  font-variant-numeric: tabular-nums;
}
a { color: var(--petrol); }
h1, h2, h3 { line-height: 1.2; margin: 0 0 .5em; }
h1 { font-size: 1.6rem; font-weight: 600; letter-spacing: -.01em; }
h2 { font-size: 1.1rem; font-weight: 600; }
p { margin: 0 0 1em; }
.icon { width: 18px; height: 18px; flex: none; }
.muted { color: var(--muted); }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

:focus-visible { outline: 2px solid var(--petrol); outline-offset: 2px; }

/* ---------- Boutons & champs ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  font: inherit; font-weight: 600; padding: var(--field-y) 1.1rem;
  border-radius: var(--radius-s); border: 1px solid transparent; cursor: pointer;
  text-decoration: none;
}
.btn-primary { background: var(--petrol); color: var(--on-primary); }
.btn-primary:hover { background: var(--petrol-deep); }
.btn-ghost { background: transparent; color: var(--ink); border-color: var(--line); }
.btn-ghost:hover { background: var(--paper); }
.btn-block { width: 100%; }

.field { display: grid; gap: .35rem; margin-bottom: 1rem; }
.field label { font-weight: 600; font-size: .9rem; }
.input {
  font: inherit; width: 100%; padding: var(--field-y) .75rem;
  border: 1px solid var(--line); border-radius: var(--radius-s); background: var(--surface); color: var(--ink);
}
.input:focus { border-color: var(--petrol); outline: 3px solid var(--ring); outline-offset: 0; }
.input-affix { display: flex; align-items: stretch; }
.input-affix .input { border-radius: var(--radius-s) 0 0 var(--radius-s); }
.input-affix span {
  display: flex; align-items: center; padding: 0 .75rem; background: var(--paper);
  border: 1px solid var(--line); border-left: 0; border-radius: 0 var(--radius-s) var(--radius-s) 0;
  color: var(--muted); white-space: nowrap; font-size: .9rem;
}

/* ---------- Messages ---------- */
.alert { padding: .7rem .9rem; border-radius: var(--radius-s); margin-bottom: 1rem; border-left: 3px solid; }
.alert-error   { background: var(--danger-soft);  border-color: var(--danger);  }
.alert-success { background: var(--success-soft); border-color: var(--success); }
.alert-warning { background: var(--warning-soft); border-color: var(--saffron); }

/* =====================================================================
   Layout invité (connexion, portail)
   ===================================================================== */
.guest {
  min-height: 100vh; display: grid; grid-template-columns: minmax(280px, 5fr) 7fr;
}
.guest-brand {
  background: var(--petrol); color: #fff; padding: 3rem;
  display: flex; flex-direction: column; justify-content: space-between;
}
.guest-brand .tenant-host { color: var(--saffron); font-weight: 600; word-break: break-all; }
.guest-brand h1 { font-size: 2.4rem; font-weight: 600; margin: .75rem 0 0; }
.guest-brand .tenant-mark { width: 48px; height: 48px; font-size: 1.1rem; }
.guest-brand .foot { color: #B8CDD0; font-size: .85rem; }
.guest-main { display: flex; align-items: center; justify-content: center; padding: 2rem; }
.guest-card { width: 100%; max-width: 380px; }
.guest-card h2 { font-size: 1.4rem; margin-bottom: .25rem; }
.guest-card .lead { color: var(--muted); margin-bottom: 1.75rem; }

.error-page { max-width: 520px; }
.error-page .code { font-size: 4rem; font-weight: 600; color: var(--petrol); line-height: 1; margin-bottom: .5rem; }

@media (max-width: 800px) {
  .guest { grid-template-columns: 1fr; }
  .guest-brand { padding: 1.5rem; }
  .guest-brand h1 { font-size: 1.6rem; }
  .guest-brand .tenant-mark { width: 48px; height: 48px; font-size: 1.1rem; }
.guest-brand .foot { display: none; }
}

/* =====================================================================
   Layout application
   ===================================================================== */
.shell { display: grid; grid-template-columns: var(--sidebar-w) 1fr; min-height: 100vh; }

/* ---------- Barre latérale ---------- */
.sidebar {
  background: var(--sb-bg); color: var(--sb-ink); border-right: 1px solid var(--sb-edge);
  display: flex; flex-direction: column; position: sticky; top: 0; height: 100vh; overflow-y: auto;
}
.tenant-block {
  display: flex; align-items: center; gap: .75rem; padding: 1.1rem 1.1rem 1rem;
  border-bottom: 1px solid var(--sb-line);
}
.tenant-mark {
  width: 38px; height: 38px; flex: none; border-radius: var(--radius-s);
  background: var(--saffron); color: var(--on-accent);
  display: grid; place-items: center; font-weight: 700; font-size: .95rem;
}
.tenant-name { color: var(--sb-strong); font-weight: 600; line-height: 1.25; }
.tenant-host { font-size: .78rem; color: var(--sb-muted); word-break: break-all; }

.nav { padding: .75rem .6rem; flex: 1; }
.nav-group-title { font-size: .78rem; color: var(--sb-dim); padding: .9rem .6rem .35rem; }
.nav a, .nav .nav-soon, .nav summary {
  display: flex; align-items: center; gap: .65rem;
  padding: .5rem .6rem; border-radius: var(--radius-s);
  color: inherit; text-decoration: none; cursor: pointer; list-style: none;
  position: relative;
}
.nav summary::-webkit-details-marker { display: none; }
.nav a:hover, .nav summary:hover { background: var(--sb-hover); color: var(--sb-strong); }
.nav a.active { background: var(--sb-active); color: var(--sb-active-ink); }
.nav a.active::before {
  content: ""; position: absolute; left: -.6rem; top: .35rem; bottom: .35rem;
  width: 3px; border-radius: 0 2px 2px 0; background: var(--saffron);
}
.nav .nav-soon { cursor: default; color: var(--sb-dim); }
.nav .nav-soon small { margin-left: auto; font-size: .72rem; border: 1px solid var(--sb-line); padding: 0 .4rem; border-radius: 10px; }
.nav details .chev { margin-left: auto; transition: transform .15s; }
.nav details[open] .chev { transform: rotate(90deg); }
.nav details a { padding-left: 2.45rem; font-size: .93rem; }
/* Sous-titres de section dans un module (Documents, Encaissements, Configuration…) */
.nav details .nav-section { padding: .7rem .6rem .2rem 2.45rem; font-size: .68rem; font-weight: 650; letter-spacing: .06em; text-transform: uppercase; color: var(--sb-dim); }
.nav details > summary + .nav-section { padding-top: .35rem; }
.nav details[open] { padding-bottom: .35rem; }
/* Champ « Aller à… » du menu */
.nav-filter { position: relative; display: flex; align-items: center; margin: 0 0 .6rem; }
.nav-filter .icon { position: absolute; left: .6rem; width: 1rem; height: 1rem; color: var(--sb-muted); pointer-events: none; }
.nav-filter input { width: 100%; padding: .45rem 3.2rem .45rem 2rem; border-radius: var(--radius-s); border: 1px solid var(--sb-line);
  background: var(--sb-hover); color: var(--sb-strong); font: inherit; font-size: .88rem; }
.nav-filter input::placeholder { color: var(--sb-muted); }
.nav-filter input:focus { outline: 2px solid var(--saffron); outline-offset: 1px; background: var(--sb-active); }
.nav-filter input::-webkit-search-cancel-button { display: none; }
.nav-filter kbd { position: absolute; right: .45rem; font: inherit; font-size: .68rem; color: var(--sb-muted); border: 1px solid var(--sb-line); border-radius: 4px; padding: 0 .3rem; pointer-events: none; }
.nav-filter input:not(:placeholder-shown) + kbd { display: none; }
.nav-empty { margin: .2rem .6rem .6rem; font-size: .85rem; color: var(--sb-muted); }
.nav.is-filtering .nav-group-title { display: none; }
.nav [data-nav-link].is-first-match { background: var(--sb-hover); color: var(--sb-strong); }
/* Résultats complémentaires du champ « Aller à… » : pages récentes, actions de création */
.nav-extra { margin: 0 0 .5rem; padding-bottom: .4rem; border-bottom: 1px solid var(--sb-line); }
.nav-extra-title { font-size: .68rem; font-weight: 650; letter-spacing: .06em; text-transform: uppercase; color: var(--sb-dim); padding: .35rem .6rem .25rem; }
.nav .nav-extra a { display: grid; grid-template-columns: 1.1rem minmax(0, 1fr); column-gap: .65rem; row-gap: 0; align-items: center; font-size: .9rem; padding-top: .4rem; padding-bottom: .4rem; }
.nav-extra a small { grid-column: 2; font-size: .74rem; color: var(--sb-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nav-extra .nav-plus { width: 1.1rem; text-align: center; font-weight: 700; color: var(--saffron); }
.nav-extra .nav-recent-ico { width: 1.1rem; text-align: center; color: var(--sb-muted); }
.nav-extra a span.nav-label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Bouton « + Créer » de la barre du haut */
.create-menu { position: relative; }
.create-menu summary { list-style: none; cursor: pointer; }
.create-menu summary::-webkit-details-marker { display: none; }
.btn-create { display: inline-flex; align-items: center; gap: .35rem; white-space: nowrap; }
.btn-create span { font-size: 1.15rem; line-height: 1; }
.create-panel {
  position: absolute; right: 0; top: calc(100% + 6px); z-index: 20; width: min(460px, 92vw);
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .25rem .75rem; padding: .7rem;
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-m); box-shadow: 0 8px 24px rgba(14,74,85,.12);
}
.create-group { display: grid; align-content: start; }
.create-group > span { font-size: .7rem; font-weight: 650; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); padding: .45rem .55rem .2rem; }
.create-group a { padding: .42rem .55rem; border-radius: var(--radius-s); color: var(--ink); text-decoration: none; font-size: .92rem; }
.create-group a:hover, .create-group a:focus { background: var(--paper); outline: none; }
@media (max-width: 720px) {
  .btn-create { padding-inline: .7rem; }
  .btn-create-label { display: none; }
  /* Téléphone : le panneau occupe la largeur de l'écran sous la barre du haut, et défile s'il est long */
  .create-panel { position: fixed; left: 8px; right: 8px; top: calc(var(--topbar-h) + 4px); width: auto; grid-template-columns: 1fr 1fr; max-height: calc(100vh - var(--topbar-h) - 16px); overflow-y: auto; }
}

/* Page « Paramètres » */
.settings-hub { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1rem; align-items: start; }
.settings-hub-group { margin: 0; }
.settings-hub-group h2 { font-size: 1rem; margin: 0 0 .5rem; }
.settings-hub-group ul { list-style: none; margin: 0; padding: 0; }
.settings-hub-group a { display: grid; gap: .1rem; padding: .55rem .6rem; margin: 0 -.6rem; border-radius: var(--radius-s); color: var(--ink); text-decoration: none; }
.settings-hub-group a:hover { background: var(--paper); }
.settings-hub-group small { color: var(--muted); font-size: .84rem; }

.sidebar-foot { padding: .75rem .6rem 1rem; border-top: 1px solid var(--sb-line); }

/* ---------- Barre du haut ---------- */
.main { min-width: 0; display: flex; flex-direction: column; }
.topbar {
  height: var(--topbar-h); background: var(--surface); border-bottom: 1px solid var(--line);
  display: flex; align-items: center; gap: 1rem; padding: 0 1.5rem; position: sticky; top: 0; z-index: 10;
}
.topbar .menu-toggle { display: none; }
.top-tabs { display: flex; gap: .25rem; }
.top-tabs a, .top-tabs span {
  padding: .45rem .75rem; border-radius: var(--radius-s); text-decoration: none; color: var(--muted); font-weight: 600;
}
.top-tabs a:hover { background: var(--paper); color: var(--ink); }
.top-tabs span[aria-disabled] { opacity: .55; cursor: default; }

.global-search { flex: 1; max-width: 520px; position: relative; }
.global-search .icon { position: absolute; left: .7rem; top: 50%; transform: translateY(-50%); color: var(--muted); }
.global-search input { padding-left: 2.3rem; background: var(--paper); }
.global-search input:disabled { cursor: not-allowed; }

.top-actions { margin-left: auto; display: flex; align-items: center; gap: .5rem; }
.icon-btn {
  width: 38px; height: 38px; display: grid; place-items: center;
  border-radius: var(--radius-s); border: 1px solid transparent; background: transparent; color: var(--ink); cursor: pointer;
}
.icon-btn:hover { background: var(--paper); }
.icon-btn:disabled { color: var(--muted); cursor: not-allowed; opacity: .6; }

.user-menu { position: relative; }
.user-menu summary {
  list-style: none; display: flex; align-items: center; gap: .6rem; cursor: pointer;
  padding: .3rem .5rem; border-radius: var(--radius-s);
}
.user-menu summary::-webkit-details-marker { display: none; }
.user-menu summary:hover { background: var(--paper); }
.avatar {
  width: 32px; height: 32px; border-radius: 50%; background: var(--petrol-soft); color: var(--petrol);
  display: grid; place-items: center; font-weight: 700; font-size: .82rem;
}
.user-menu .who { line-height: 1.2; font-size: .9rem; }
.user-menu .who small { display: block; color: var(--muted); }
.user-panel {
  position: absolute; right: 0; top: calc(100% + 6px); min-width: 220px;
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-m);
  box-shadow: 0 8px 24px rgba(14,74,85,.12); padding: .4rem;
}
.user-panel button, .user-panel a {
  display: flex; gap: .6rem; align-items: center; width: 100%; padding: .55rem .6rem;
  font: inherit; color: var(--ink); background: none; border: 0; text-align: left; border-radius: var(--radius-s); cursor: pointer; text-decoration: none;
}
.user-panel button:hover, .user-panel a:hover { background: var(--paper); }

.content { padding: 2rem 1.5rem 3rem; max-width: 1200px; width: 100%; }

/* ---------- Composants de page ---------- */
.page-head { margin-bottom: 1.5rem; }
.page-head p { color: var(--muted); margin: 0; }

.panel {
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-m);
  padding: 1.25rem 1.4rem; margin-bottom: 1.25rem;
}
.grid-2 { display: grid; grid-template-columns: 3fr 2fr; gap: 1.25rem; align-items: start; }

.kv { display: grid; grid-template-columns: max-content 1fr; gap: .45rem 1.25rem; margin: 0; }
.kv dt { color: var(--muted); }
.kv dd { margin: 0; }

.tag {
  display: inline-block; padding: .05rem .5rem; border-radius: 10px; font-size: .8rem; font-weight: 600;
  background: var(--petrol-soft); color: var(--petrol); margin: 0 .25rem .25rem 0;
}

.table { width: 100%; border-collapse: collapse; }
.table th { text-align: left; font-size: .85rem; color: var(--muted); font-weight: 600; padding: calc(var(--cell-y) - .05rem) .6rem; border-bottom: 1px solid var(--line); }
.table td { padding: var(--cell-y) .6rem; border-bottom: 1px solid var(--line); }
.table tr:last-child td { border-bottom: 0; }
.table-wrap { overflow-x: auto; }

/* Feuille de route : c'est une vraie séquence, d'où la numérotation */
.steps { list-style: none; margin: 0; padding: 0; counter-reset: none; }
.step {
  display: grid; grid-template-columns: 2.5rem 1fr auto; gap: 1rem; align-items: start;
  padding: 1rem 0; border-bottom: 1px solid var(--line);
}
.step:last-child { border-bottom: 0; }
.step-num {
  width: 2.2rem; height: 2.2rem; border-radius: 50%; display: grid; place-items: center;
  font-weight: 700; border: 2px solid var(--line); color: var(--muted);
}
.step.is-done .step-num { background: var(--petrol); border-color: var(--petrol); color: #fff; }
.step.is-in_progress .step-num { border-color: var(--saffron); color: var(--petrol-deep); background: var(--saffron-soft); }
.step h3 { font-size: 1rem; margin: .15rem 0 .2rem; }
.step p { margin: 0; color: var(--muted); font-size: .92rem; }
.status { font-size: .8rem; font-weight: 600; padding: .15rem .55rem; border-radius: 10px; white-space: nowrap; }
.status-done { background: var(--success-soft); color: var(--success); }
.status-in_progress { background: var(--saffron-soft); color: var(--accent-ink); }
.status-todo { background: var(--paper); color: var(--muted); border: 1px solid var(--line); }

/* ---------- Responsive ---------- */
@media (max-width: 960px) {
  .shell { grid-template-columns: 1fr; }
  .sidebar {
    position: fixed; inset: 0 auto 0 0; width: var(--sidebar-w); z-index: 30;
    transform: translateX(-100%); transition: transform .2s ease;
  }
  body.nav-open .sidebar { transform: none; box-shadow: 0 0 0 100vmax rgba(10,54,62,.4); }
  .topbar .menu-toggle { display: grid; }
  .top-tabs, .user-menu .who { display: none; }
  .grid-2 { grid-template-columns: 1fr; }
  .content { padding: 1.25rem 1rem 2rem; }
}

@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; }
}

/* =====================================================================
   Étape 1 : formulaires, listes, administration, console plateforme
   ===================================================================== */
.page-head-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.back { display: inline-block; font-size: .88rem; color: var(--muted); text-decoration: none; margin-bottom: .4rem; }
.back::before { content: "‹ "; }
.back:hover { color: var(--petrol); }
.h-small { font-size: .95rem; margin-top: 1rem; }
.nowrap { white-space: nowrap; }
.muted-light { color: #B8CDD0; font-size: .9rem; }

.btn-danger { background: var(--danger); color: #fff; }
.btn-danger:hover { background: #962F1F; }
.btn-ghost-light { background: transparent; color: #fff; border-color: rgba(255,255,255,.3); }
.btn-ghost-light:hover { background: rgba(255,255,255,.08); }

.toolbar { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1rem; align-items: center; }
.toolbar .input { width: auto; flex: 1 1 180px; max-width: 320px; }
.inline-label { display: flex; align-items: center; gap: .4rem; color: var(--muted); font-size: .9rem; }
.inline-label .input { flex: none; }

.panel-flush { padding: 0; }
.panel-flush .table th, .panel-flush .table td { padding-left: 1.2rem; padding-right: 1.2rem; }
.panel-danger { border-color: #E6C3BB; }
.panel h2 + .check-list, .panel h2 + .field { margin-top: .5rem; }
.panel h2:not(:first-child) { margin-top: 1.5rem; }
.empty { color: var(--muted); padding: 1.5rem 1.25rem; margin: 0; }

.badge {
  display: inline-block; padding: .1rem .55rem; border-radius: 10px; font-size: .78rem; font-weight: 600;
  background: var(--paper); color: var(--muted); border: 1px solid var(--line);
}
.badge-ok  { background: var(--success-soft); color: var(--success); border-color: transparent; }
.badge-off { background: var(--danger-soft);  color: var(--danger);  border-color: transparent; }
.badge-lg  { font-size: .9rem; padding: .25rem .75rem; }

.form-narrow { max-width: 640px; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1rem; }
.form-actions { display: flex; gap: .5rem; flex-wrap: wrap; margin-top: .5rem; }
.field-error { color: var(--danger); font-size: .86rem; margin: 0; }
.hint { color: var(--muted); font-size: .85rem; margin: 0; }
.field-check { align-content: end; }
.field-check label { display: flex; gap: .5rem; align-items: center; font-weight: 400; padding-bottom: .6rem; }
.input[disabled] { background: var(--paper); color: var(--muted); }
select.input { appearance: auto; }

.check-list, .plain-list { list-style: none; margin: 0 0 1rem; padding: 0; }
.check-list li { padding: .3rem 0; }
.check-list label { display: flex; gap: .55rem; align-items: baseline; cursor: pointer; }
.plain-list li { padding: .4rem 0; border-bottom: 1px solid var(--line); }
.plain-list li:last-child { border-bottom: 0; }
.plain-list .muted { margin-left: .4rem; font-size: .88rem; }
.mono-list li { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: .88rem; }

/* Identifiants affichés une seule fois */
.credentials {
  border: 2px solid var(--saffron); background: var(--saffron-soft);
  border-radius: var(--radius-m); padding: 1.1rem 1.3rem; margin-bottom: 1.25rem;
}
.credentials p { color: var(--accent-ink); }
.secret {
  font-size: 1.05rem; background: var(--surface); padding: .15rem .5rem; border-radius: var(--radius-s);
  border: 1px solid var(--line); user-select: all; letter-spacing: .03em;
}

/* Grille de permissions */
.perm-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1rem; }
.perm-group { border: 1px solid var(--line); border-radius: var(--radius-m); padding: .75rem 1rem 1rem; margin: 0; }
.perm-group legend { font-weight: 600; padding: 0 .35rem; }
.perm { display: flex; gap: .55rem; align-items: baseline; padding: .3rem 0; cursor: pointer; }

/* Organigramme : l'indentation porte la hiérarchie */
.org-tree { list-style: none; margin: 0; padding: 0; }
.org-node {
  margin-left: calc(var(--depth) * 1.75rem);
  padding: .7rem .9rem; border-left: 3px solid var(--petrol-soft);
  border-bottom: 1px solid var(--line);
}
.org-node[style*="--depth: 0"] { border-left-color: var(--petrol); }
.org-node.is-inactive { opacity: .6; }
.org-main { display: flex; align-items: baseline; gap: .6rem; flex-wrap: wrap; }
.org-main a { text-decoration: none; color: var(--ink); }
.org-main a:hover { color: var(--petrol); text-decoration: underline; }
.org-type { font-size: .78rem; color: var(--petrol); background: var(--petrol-soft); padding: .05rem .5rem; border-radius: 10px; }
.org-meta { display: flex; gap: 1.25rem; flex-wrap: wrap; font-size: .86rem; color: var(--muted); margin-top: .25rem; }

.logo-preview { background: var(--paper); border: 1px dashed var(--line); border-radius: var(--radius-m); padding: 1rem; margin-bottom: 1rem; text-align: center; }
.logo-preview img { max-width: 100%; max-height: 90px; }
.tenant-logo { background: #fff; padding: 3px; }
.tenant-logo img { max-width: 100%; max-height: 100%; object-fit: contain; }
.guest-logo { background: #fff; display: inline-block; padding: .6rem .9rem; border-radius: var(--radius-m); }
.guest-logo img { max-height: 56px; max-width: 220px; display: block; }

.pagination { display: flex; align-items: center; gap: 1rem; justify-content: center; margin-top: 1rem; }

/* Console plateforme */
.platform-bar {
  background: var(--petrol-deep); color: #fff; display: flex; align-items: center; gap: 2rem;
  padding: 0 1.5rem; min-height: 60px; flex-wrap: wrap;
}
.platform-brand { display: flex; flex-direction: column; line-height: 1.2; padding: .6rem 0; }
.platform-brand span { color: var(--saffron); font-size: .82rem; }
.platform-nav { display: flex; gap: .25rem; }
.platform-nav a { color: #D5E2E4; text-decoration: none; padding: .45rem .75rem; border-radius: var(--radius-s); font-weight: 600; }
.platform-nav a:hover { background: rgba(255,255,255,.08); color: #fff; }
.platform-nav a.active { background: rgba(255,255,255,.12); color: #fff; box-shadow: inset 0 -2px 0 var(--saffron); }
.platform-out { margin-left: auto; display: flex; align-items: center; gap: .75rem; }
.platform-content { margin: 0 auto; }

@media (max-width: 960px) {
  .form-grid { grid-template-columns: 1fr; }
  .org-node { margin-left: calc(var(--depth) * .9rem); }
  .platform-bar { gap: .75rem; padding: .5rem 1rem; }
}

/* Mise en route : une vraie séquence, d'où la liste numérotée */
.setup { border-left: 3px solid var(--saffron); }
.setup-list { margin: 0; padding-left: 1.3rem; }
.setup-list li { padding: .3rem 0; }
.setup-list li.is-done span { color: var(--muted); text-decoration: line-through; }
.setup-list li.is-done::marker { color: var(--success); }

/* =====================================================================
   Étape 2 : communication
   ===================================================================== */
.nav-badge {
  margin-left: auto; min-width: 1.35rem; padding: 0 .4rem; border-radius: 10px; text-align: center;
  background: var(--saffron); color: var(--on-accent); font-size: .75rem; font-weight: 700; line-height: 1.35rem;
}
.nav a .nav-badge { margin-left: auto; }
.has-badge { position: relative; text-decoration: none; }
.top-badge {
  position: absolute; top: 2px; right: 0; min-width: 18px; height: 18px; padding: 0 4px; border-radius: 9px;
  background: var(--danger); color: #fff; font-size: .7rem; font-weight: 700; line-height: 18px; text-align: center;
}
[hidden] { display: none !important; }

.bell-menu { position: relative; }
.bell-menu summary { list-style: none; }
.bell-menu summary::-webkit-details-marker { display: none; }
.bell-panel {
  position: absolute; right: 0; top: calc(100% + 6px); width: min(360px, 90vw); z-index: 20;
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-m);
  box-shadow: 0 8px 24px rgba(14,74,85,.12);
}
.bell-head { display: flex; justify-content: space-between; align-items: center; padding: .75rem 1rem; border-bottom: 1px solid var(--line); font-size: .9rem; }
.bell-all { display: block; text-align: center; padding: .65rem; border-top: 1px solid var(--line); font-size: .9rem; }

.notif-list { list-style: none; margin: 0; padding: 0; }
.notif-list li { border-bottom: 1px solid var(--line); }
.notif-list li:last-child { border-bottom: 0; }
.notif-list a { display: grid; gap: .15rem; padding: .8rem 1.2rem; color: var(--ink); text-decoration: none; }
.notif-list a:hover { background: var(--paper); }
.notif-list li.unread a { box-shadow: inset 3px 0 0 var(--saffron); background: #FCF8EE; }
.notif-list li:not(.unread) strong { font-weight: 400; }
.notif-body { color: var(--muted); font-size: .9rem; }
.notif-list time { font-size: .8rem; }
.notif-list.compact { max-height: 340px; overflow-y: auto; }
.notif-list.compact a { padding: .6rem 1rem; font-size: .9rem; }

.tabs { display: flex; gap: .25rem; margin-bottom: 1rem; border-bottom: 1px solid var(--line); }
.tabs a { padding: .5rem .9rem; text-decoration: none; color: var(--muted); font-weight: 600; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.tabs a.active { color: var(--petrol); border-bottom-color: var(--petrol); }

/* Messagerie */
.chat {
  display: grid; grid-template-columns: 300px 1fr; height: calc(100vh - var(--topbar-h) - 9rem); min-height: 420px;
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-m); overflow: hidden;
}
.chat-list { border-right: 1px solid var(--line); overflow-y: auto; }
.chat-item { display: grid; gap: .15rem; padding: .8rem 1rem; border-bottom: 1px solid var(--line); text-decoration: none; color: var(--ink); }
.chat-item:hover { background: var(--paper); }
.chat-item.active { background: var(--petrol-soft); }
.chat-item-top { display: flex; align-items: center; gap: .5rem; }
.chat-item-top strong { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chat-item:not(.unread) .chat-item-top strong { font-weight: 400; }
.chat-item-preview { color: var(--muted); font-size: .86rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chat-thread { display: flex; flex-direction: column; min-width: 0; }
.chat-head { padding: .9rem 1.2rem; border-bottom: 1px solid var(--line); }
.chat-head h2 { margin: 0; }
.chat-head p { margin: .1rem 0 0; font-size: .86rem; }
.chat-back { display: none; }
.chat-messages { flex: 1; overflow-y: auto; padding: 1rem 1.2rem; display: flex; flex-direction: column; gap: .6rem; background: var(--paper); }
.msg { max-width: min(75%, 560px); background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-m); padding: .55rem .8rem; align-self: flex-start; }
.msg-mine { align-self: flex-end; background: var(--petrol-soft); border-color: transparent; }
.msg header { display: flex; gap: .6rem; align-items: baseline; font-size: .82rem; }
.msg time { color: var(--muted); }
.msg-body { white-space: normal; overflow-wrap: anywhere; margin-top: .15rem; }
.msg-file { display: block; margin-top: .35rem; font-size: .9rem; }
.chat-form { border-top: 1px solid var(--line); padding: .75rem 1rem; display: grid; gap: .5rem; }
.chat-form textarea { resize: vertical; min-height: 2.8rem; }
.chat-form-actions { display: flex; align-items: center; gap: .6rem; }
.chat-form-actions .btn-primary { margin-left: auto; }
.chat-files { font-size: .85rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.people { max-height: 260px; overflow-y: auto; border: 1px solid var(--line); border-radius: var(--radius-s); padding: .25rem .75rem; margin-top: .4rem; }

@media (max-width: 960px) {
  .chat { grid-template-columns: 1fr; height: calc(100vh - var(--topbar-h) - 7rem); }
  .chat.has-current .chat-list { display: none; }
  .chat:not(.has-current) .chat-thread { display: none; }
  .chat-back { display: inline-block; }
}

/* Historique et commentaires */
.feed { list-style: none; margin: 0; padding: 0; }
.feed li { display: grid; grid-template-columns: 2rem 1fr; gap: .75rem; padding: .75rem 0; border-bottom: 1px solid var(--line); }
.feed li:last-child { border-bottom: 0; }
.feed p { margin: 0; }
.feed-meta { font-size: .82rem; margin-top: .15rem !important; }
.avatar-s { width: 2rem; height: 2rem; font-size: .72rem; }
.comment-body { background: var(--paper); border-radius: var(--radius-m); padding: .55rem .8rem; margin-top: .35rem; overflow-wrap: anywhere; }
.timeline-form { display: grid; gap: .5rem; margin-bottom: 1rem; }
.timeline-form .btn { justify-self: start; }
.notify-pick summary { cursor: pointer; color: var(--petrol); font-size: .9rem; }
.notify-pick[open] summary { margin-bottom: .4rem; }
.check-inline { display: flex; gap: .5rem; align-items: baseline; margin: .75rem 0 .25rem; cursor: pointer; }

/* =====================================================================
   Étape 3 : projets et tâches
   ===================================================================== */
.num { text-align: right; white-space: nowrap; }
.is-late { color: var(--danger); font-weight: 600; }
.panel-title-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.1rem 1.2rem .4rem; }
.panel-title-row h2 { margin: 0; }
.prose-block { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--line); overflow-wrap: anywhere; }
.inline-form { display: inline; margin: 0; }
.input-s { padding: .3rem .5rem; font-size: .88rem; width: auto; }
.btn-link { background: none; border: 0; padding: 0; font: inherit; font-size: .88rem; color: var(--petrol); cursor: pointer; text-decoration: underline; }
.btn-link:hover { color: var(--petrol-deep); }
.inline-grid { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .75rem; }
.inline-grid .input { flex: 1 1 140px; width: auto; }
.form-grid-3 { grid-template-columns: repeat(3, 1fr); }
.form-grid-4 { grid-template-columns: repeat(4, 1fr); }

/* Indicateurs */
.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 1rem; margin-bottom: 1.25rem; }
.kpi { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-m); padding: .9rem 1.1rem; display: grid; gap: .3rem; align-content: start; }
.kpi-label { color: var(--muted); font-size: .85rem; }
.kpi-value { font-size: 1.45rem; font-weight: 600; line-height: 1.15; }
.kpi a, .kpi span:not(.kpi-label):not(.kpi-value):not(.progress):not(.progress-bar):not(.progress-label) { font-size: .85rem; }
.kpi-alert { border-color: #E6C3BB; background: #FDF6F4; }
.kpi-alert .kpi-value { color: var(--danger); }

/* Barre d'avancement */
.progress { display: inline-block; vertical-align: middle; width: 90px; height: 6px; background: var(--petrol-soft); border-radius: 3px; overflow: hidden; }
.progress-bar { display: block; height: 100%; background: var(--petrol); border-radius: 3px; }
.progress-label { font-size: .82rem; color: var(--muted); margin-left: .4rem; }
.kpi .progress { width: 100%; }
.kpi .progress-label { display: none; }

/* Statuts */
.pstatus, .tstatus { display: inline-block; font-size: .8rem; font-weight: 600; padding: .1rem .55rem; border-radius: 10px; white-space: nowrap; }
.pstatus-draft, .tstatus-todo { background: var(--paper); color: var(--muted); border: 1px solid var(--line); }
.pstatus-active, .tstatus-in_progress { background: var(--petrol-soft); color: var(--petrol); }
.pstatus-on_hold, .tstatus-review { background: var(--saffron-soft); color: var(--accent-ink); }
.pstatus-completed, .tstatus-done { background: var(--success-soft); color: var(--success); }
.pstatus-cancelled, .tstatus-blocked { background: var(--danger-soft); color: var(--danger); }
select.tstatus { border-radius: var(--radius-s); border: 1px solid var(--line); padding: .3rem .5rem; font-size: .85rem; }
.prio { font-size: .75rem; font-weight: 600; margin-left: .35rem; }
.prio-high { color: var(--accent-ink); }
.prio-critical { color: var(--danger); }
tr.is-done td a strong { color: var(--muted); text-decoration: line-through; font-weight: 400; }

.projects-table tr.is-child td:first-child { padding-left: 2.4rem; position: relative; }
.projects-table tr.is-child td:first-child::before {
  content: ""; position: absolute; left: 1.3rem; top: 0; bottom: 50%; width: .7rem;
  border-left: 1px solid var(--line); border-bottom: 1px solid var(--line);
}

/* Création : choix du type */
.type-pick { border: 0; padding: 0; margin: 0 0 1rem; display: grid; gap: .5rem; }
.type-pick legend { font-weight: 600; font-size: .9rem; margin-bottom: .4rem; }
.type-option { display: flex; gap: .7rem; align-items: flex-start; border: 1px solid var(--line); border-radius: var(--radius-m); padding: .7rem .9rem; cursor: pointer; }
.type-option:has(input:checked) { border-color: var(--petrol); background: var(--petrol-soft); }
.type-option span { display: grid; gap: .1rem; }
.type-option small { color: var(--muted); }
.type-option.is-disabled { opacity: .5; cursor: not-allowed; }

.quick-add summary { cursor: pointer; }
.quick-add[open] summary { margin-bottom: 1rem; }

/* Sous-tâches */
.subtasks { list-style: none; margin: 0 0 .5rem; padding: 0; }
.subtasks li { display: flex; align-items: center; gap: .6rem; padding: .45rem 0; border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.subtasks li.is-done a { color: var(--muted); text-decoration: line-through; }
.check-btn {
  width: 1.25rem; height: 1.25rem; border: 1.5px solid var(--petrol); border-radius: 4px; background: var(--surface);
  display: inline-grid; place-items: center; font-size: .8rem; line-height: 1; color: #fff; cursor: pointer; padding: 0;
}
.subtasks li.is-done .check-btn { background: var(--petrol); }

/* Documents */
.doc-cat { font-size: .95rem; padding: 1.1rem 1.2rem .3rem; margin: 0; color: var(--petrol); }
.doc-list { list-style: none; margin: 0; padding: 0 1.2rem .5rem; }
.doc-list > li { padding: .65rem 0; border-bottom: 1px solid var(--line); display: grid; gap: .3rem; }
.doc-list > li:last-child { border-bottom: 0; }
.doc-main { display: flex; flex-wrap: wrap; align-items: baseline; gap: .5rem; }
.doc-main small { flex-basis: 100%; }
.doc-actions { display: flex; gap: 1rem; }
.doc-versions summary { cursor: pointer; font-size: .85rem; color: var(--muted); }
.doc-versions ul { margin: .3rem 0 0; padding-left: 1.2rem; font-size: .88rem; }

.task-group-overdue { border-left: 3px solid var(--danger); }
.task-group-today { border-left: 3px solid var(--saffron); }

@media (max-width: 960px) {
  .form-grid-3, .form-grid-4 { grid-template-columns: 1fr 1fr; }
}
.kpi-link { text-decoration: none; color: var(--ink); }
.kpi-link:hover { border-color: var(--petrol); }

/* =====================================================================
   Étape 3B : Gantt, calendrier, charge de travail
   ===================================================================== */
.gantt-toolbar { display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; margin-bottom: .75rem; }
.gantt-msg { font-size: .88rem; color: var(--success); }
.gantt-msg.is-error { color: var(--danger); }
.gantt-hint { margin-bottom: .75rem; }
[data-date-reason][hidden] { display: none; }
.req { color: var(--danger); }
.date-changes li { padding: .5rem 0; border-bottom: 1px solid var(--line); }
.date-changes li:last-child { border-bottom: 0; }
.date-change-reason { display: inline-block; margin: .15rem 0; }
.gantt-dialog { border: 1px solid var(--line); border-radius: var(--radius-m); padding: 0; max-width: min(30rem, 92vw); width: 100%; color: var(--ink); background: var(--surface); }
.gantt-dialog::backdrop { background: rgba(10, 54, 62, .45); }
.gantt-dialog-form { display: grid; gap: .5rem; padding: 1.25rem; }
.gantt-dialog-form h3 { margin: 0 0 .25rem; }
.gantt-dialog-form p { margin: 0; }
.gantt-dialog-form label { font-weight: 600; font-size: .9rem; margin-top: .4rem; }
.gantt-dialog .gd-title { font-weight: 600; }
.gantt-dialog .gd-dates { color: var(--muted); font-size: .9rem; }
.gantt-dialog .gd-actions { display: flex; justify-content: flex-end; gap: .5rem; margin-top: .5rem; }
.seg { display: inline-flex; border: 1px solid var(--line); border-radius: var(--radius-s); overflow: hidden; }
.seg-btn { font: inherit; font-size: .88rem; padding: .45rem .8rem; border: 0; background: var(--surface); color: var(--muted); cursor: pointer; }
.seg-btn + .seg-btn { border-left: 1px solid var(--line); }
.seg-btn.is-active { background: var(--petrol); color: #fff; }

.gantt { display: grid; grid-template-columns: minmax(180px, 280px) 1fr; background: var(--surface);
  border: 1px solid var(--line); border-radius: var(--radius-m); overflow: hidden; margin-bottom: 1rem; }
.gantt-names { border-right: 1px solid var(--line); min-width: 0; }
.gantt-names-head { border-bottom: 1px solid var(--line); background: var(--paper); }
.gantt-name { display: flex; flex-direction: column; justify-content: center; padding: 0 .8rem; border-bottom: 1px solid #EEF1F0;
  text-decoration: none; color: var(--ink); overflow: hidden; }
.gantt-name span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: .9rem; font-weight: 600; }
.gantt-name small { color: var(--muted); font-size: .75rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gantt-name.depth-1 { padding-left: 1.8rem; }
.gantt-name.depth-1 span { font-weight: 400; }
.gantt-name:hover { background: var(--paper); }
.gantt-chart { overflow-x: auto; position: relative; }
.gantt-canvas { position: relative; background-image: linear-gradient(#EEF1F0 1px, transparent 1px); background-size: 100% 34px; background-position: 0 46px; }
.g-month { position: absolute; top: 4px; font-size: .78rem; font-weight: 600; color: var(--petrol); padding-left: 4px; white-space: nowrap; }
.g-tick { position: absolute; top: 24px; font-size: .72rem; color: var(--muted); padding-left: 3px; white-space: nowrap; overflow: hidden; }
.g-line { position: absolute; top: 22px; border-left: 1px solid #EEF1F0; }
.g-line-month { top: 0; border-left-color: var(--line); }
.g-weekend { position: absolute; top: 46px; background: rgba(14,74,85,.035); }
.g-today { position: absolute; top: 0; border-left: 2px solid var(--saffron); z-index: 2; pointer-events: none; }
.gbar { position: absolute; height: 20px; border-radius: 4px; background: #9DBDC3; overflow: hidden; z-index: 3;
  display: flex; align-items: center; cursor: pointer; box-shadow: 0 1px 2px rgba(10,54,62,.15); user-select: none; touch-action: none; }
.gbar.is-editable { cursor: grab; }
.gbar.is-editable:active { cursor: grabbing; }
.gbar.is-sub { height: 14px; margin-top: 3px; opacity: .9; }
.gbar-progress { position: absolute; inset: 0 auto 0 0; background: var(--petrol); }
.gbar-label { position: relative; font-size: .74rem; color: #fff; padding: 0 6px; white-space: nowrap; text-shadow: 0 0 2px rgba(0,0,0,.4); }
.gbar-handle { position: absolute; top: 0; bottom: 0; width: 7px; cursor: ew-resize; z-index: 1; }
.gbar-handle-l { left: 0; } .gbar-handle-r { right: 0; }
.gbar.is-editable:hover .gbar-handle { background: rgba(255,255,255,.35); }
.g-links { position: absolute; top: 0; left: 0; z-index: 2; pointer-events: none; overflow: visible; }
.g-link { fill: none; stroke: #7C8E93; stroke-width: 1.4; }
.g-arrow { fill: #7C8E93; }
.gantt.show-critical .gbar-critical { box-shadow: 0 0 0 2px var(--danger); }
.gantt.show-critical .g-link-critical { stroke: var(--danger); stroke-width: 2; }
.gantt.show-critical .g-arrow.g-link-critical { fill: var(--danger); }
.gbar-done { background: #A9CDB8; } .gbar-done .gbar-progress { background: var(--success); }
.gbar-blocked { background: #E3B4AA; } .gbar-blocked .gbar-progress { background: var(--danger); }
.gbar-review { background: #EBD29C; } .gbar-review .gbar-progress { background: #B78A2A; }

/* Calendrier */
.cal-nav { display: flex; align-items: center; gap: .5rem; }
.cal-nav strong { min-width: 9rem; text-align: center; }
.calendar { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); background: var(--line); gap: 1px;
  border: 1px solid var(--line); border-radius: var(--radius-m); overflow: hidden; }
.cal-head { background: var(--paper); padding: .45rem; font-size: .82rem; font-weight: 600; color: var(--muted); text-align: center; }
.cal-day { background: var(--surface); min-height: 108px; padding: .35rem; display: flex; flex-direction: column; gap: .2rem; min-width: 0; }
.cal-day.is-out { background: #FAFBFA; }
.cal-day.is-out .cal-num { color: #B3BEBC; }
.cal-day.is-weekend { background: #F8FAF9; }
.cal-day.is-today .cal-num { background: var(--petrol); color: #fff; border-radius: 50%; }
.cal-num { font-size: .8rem; width: 1.6rem; height: 1.6rem; display: grid; place-items: center; font-weight: 600; }
.cal-item { display: block; font-size: .76rem; padding: .1rem .35rem; border-radius: 3px; text-decoration: none;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cal-item.is-late-item { box-shadow: inset 3px 0 0 var(--danger); }
.cal-project { background: var(--petrol); color: #fff; font-weight: 600; }

/* Charge de travail */
.workload td.wl { font-size: .88rem; line-height: 1.25; }
.wl-l0 { color: #B3BEBC; }
.wl-l1 { background: #EEF5F5; }
.wl-l2 { background: #CFE2E4; }
.wl-l3 { background: var(--saffron-soft); color: var(--accent-ink); font-weight: 600; }
.wl-l4 { background: var(--danger-soft); color: var(--danger); font-weight: 700; }
.wl-legend { display: flex; flex-wrap: wrap; gap: 1.25rem; font-size: .85rem; color: var(--muted); margin: .5rem 0; }
.wl-legend i { display: inline-block; width: .9rem; height: .9rem; border-radius: 2px; vertical-align: -2px; margin-right: .3rem; border: 1px solid var(--line); }

@media (max-width: 960px) {
  .gantt { grid-template-columns: 130px 1fr; }
  .cal-day { min-height: 70px; }
  .cal-item { font-size: 0; height: 6px; padding: 0; }
}

/* =====================================================================
   Étape 4A : commercial
   ===================================================================== */
.cstatus, .stage { display: inline-block; font-size: .78rem; font-weight: 600; padding: .1rem .55rem; border-radius: 10px; white-space: nowrap; }
.cstatus-prospect { background: var(--saffron-soft); color: var(--accent-ink); }
.cstatus-client { background: var(--success-soft); color: var(--success); }
.cstatus-inactive { background: var(--paper); color: var(--muted); border: 1px solid var(--line); }
.stage-new, .stage-qualified { background: var(--paper); color: var(--muted); border: 1px solid var(--line); }
.stage-proposal, .stage-negotiation { background: var(--petrol-soft); color: var(--petrol); }
.stage-won { background: var(--success-soft); color: var(--success); }
.stage-lost { background: var(--danger-soft); color: var(--danger); }

.board { display: grid; grid-template-columns: repeat(4, minmax(220px, 1fr)); gap: .75rem; overflow-x: auto; padding-bottom: .5rem; margin-bottom: .5rem; }
.board-col { background: #EBEFEE; border-radius: var(--radius-m); padding: .6rem; display: flex; flex-direction: column; min-height: 240px; }
.board-col.is-over { outline: 2px dashed var(--petrol); outline-offset: -2px; background: var(--petrol-soft); }
.board-col header { display: flex; flex-direction: column; gap: .1rem; padding: .2rem .3rem .6rem; font-size: .9rem; }
.board-col header .muted { font-size: .8rem; }
.board-cards { display: grid; gap: .5rem; align-content: start; flex: 1; }
.deal-card { display: grid; gap: .2rem; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-m);
  padding: .6rem .7rem; text-decoration: none; color: var(--ink); font-size: .9rem; box-shadow: 0 1px 2px rgba(10,54,62,.06); }
.deal-card[draggable="true"] { cursor: grab; }
.deal-card:hover { border-color: var(--petrol); }
.deal-card.is-dragging { opacity: .5; }
.deal-card .muted { font-size: .82rem; }
.deal-meta { display: flex; justify-content: space-between; gap: .5rem; font-size: .85rem; }

.crm-acts { list-style: none; margin: 0 0 1rem; padding: 0; }
.crm-acts li { display: flex; gap: .6rem; align-items: flex-start; padding: .55rem 0; border-bottom: 1px solid var(--line); }
.crm-acts li:last-child { border-bottom: 0; }
.crm-acts li > div { display: grid; gap: .1rem; }
.crm-acts li.is-done strong { color: var(--muted); text-decoration: line-through; font-weight: 400; }
.crm-acts li.is-done .check-btn { background: var(--petrol); }
.crm-acts p { margin: .2rem 0 0; font-size: .88rem; }
.act-form summary { cursor: pointer; color: var(--petrol); font-weight: 600; font-size: .92rem; }
.act-form[open] summary { margin-bottom: .75rem; }
.lost-pick { position: relative; }
.lost-pick summary { list-style: none; }
.lost-pick summary::-webkit-details-marker { display: none; }
.lost-pick .panel { position: absolute; right: 0; top: calc(100% + 6px); width: 300px; z-index: 5; display: grid; gap: .5rem;
  box-shadow: 0 8px 24px rgba(14,74,85,.12); }

@media (max-width: 960px) { .board { grid-template-columns: repeat(4, 240px); } }

/* =====================================================================
   Étape 4B : devis et factures
   ===================================================================== */
.qstatus, .istatus { display: inline-block; font-size: .78rem; font-weight: 600; padding: .1rem .55rem; border-radius: 10px; white-space: nowrap; }
.qstatus-draft, .istatus-draft { background: var(--paper); color: var(--muted); border: 1px solid var(--line); }
.qstatus-sent, .istatus-issued { background: var(--petrol-soft); color: var(--petrol); }
.qstatus-accepted, .qstatus-invoiced, .istatus-paid { background: var(--success-soft); color: var(--success); }
.istatus-partial { background: var(--saffron-soft); color: var(--accent-ink); }
.qstatus-refused, .istatus-cancelled { background: var(--danger-soft); color: var(--danger); }

.lines-table td { vertical-align: top; }
.lines-table .line-main { min-width: 260px; display: grid; gap: .35rem; }
.lines-table .line-main textarea { min-height: 2.6rem; resize: vertical; font-size: .9rem; }
.num-in { width: 6.5rem; text-align: right; }
.line-total { font-weight: 600; padding-top: .9rem !important; }
.lines-totals { display: grid; grid-template-columns: 1fr auto; gap: .35rem 1.5rem; max-width: 420px; margin: 1rem 0 .5rem auto; }
.lines-totals dt { color: var(--muted); }
.lines-totals dd { margin: 0; text-align: right; font-variant-numeric: tabular-nums; }
.lines-totals .grand { font-weight: 700; font-size: 1.1rem; color: var(--ink); border-top: 2px solid var(--petrol); padding-top: .4rem; }

.doc-steps { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.issue-box { display: grid; gap: .75rem; border-left: 3px solid var(--saffron); }
.pay-form { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--line); }
.color-in { height: 2.6rem; padding: .2rem; width: 5rem; }

/* =====================================================================
   Étape 5 : achats
   ===================================================================== */
.rstatus, .ostatus, .sistatus { display: inline-block; font-size: .78rem; font-weight: 600; padding: .1rem .55rem; border-radius: 10px; white-space: nowrap; }
.rstatus-draft, .ostatus-draft { background: var(--paper); color: var(--muted); border: 1px solid var(--line); }
.rstatus-submitted, .ostatus-sent, .sistatus-to_pay { background: var(--petrol-soft); color: var(--petrol); }
.rstatus-approved, .ostatus-partial, .sistatus-partial { background: var(--saffron-soft); color: var(--accent-ink); }
.rstatus-ordered, .ostatus-received, .sistatus-paid { background: var(--success-soft); color: var(--success); }
.rstatus-rejected, .rstatus-cancelled, .ostatus-cancelled { background: var(--danger-soft); color: var(--danger); }
.is-ok { color: var(--success); font-weight: 600; }

.decision { border-left: 3px solid var(--saffron); }
.approval-steps { list-style: none; margin: 0; padding: 0; counter-reset: step; }
.approval-steps li { position: relative; padding: .2rem 0 1rem 2.4rem; display: grid; gap: .1rem; counter-increment: step; }
.approval-steps li::before {
  content: counter(step); position: absolute; left: 0; top: .1rem; width: 1.7rem; height: 1.7rem; border-radius: 50%;
  display: grid; place-items: center; font-size: .8rem; font-weight: 700; border: 2px solid var(--line); color: var(--muted); background: var(--surface);
}
.approval-steps li:not(:last-child)::after { content: ""; position: absolute; left: .8rem; top: 1.9rem; bottom: .1rem; border-left: 2px solid var(--line); }
.approval-steps li.ap-approved::before { content: "✓"; background: var(--success); border-color: var(--success); color: #fff; }
.approval-steps li.ap-rejected::before { content: "✕"; background: var(--danger); border-color: var(--danger); color: #fff; }
.approval-steps li.is-current::before { border-color: var(--saffron); color: var(--petrol-deep); background: var(--saffron-soft); }
.approval-steps em { color: var(--muted); font-size: .9rem; }

/* =====================================================================
   Étape 6 : aperçu, recherche, conventions
   ===================================================================== */
.top-tabs a.active { color: var(--petrol); background: var(--petrol-soft); }
.global-search { position: relative; }
.search-suggest {
  position: absolute; left: 0; right: 0; top: calc(100% + 6px); z-index: 30; max-height: 70vh; overflow-y: auto;
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-m); box-shadow: 0 10px 28px rgba(14,74,85,.16); padding: .35rem;
}
.ss-group + .ss-group { border-top: 1px solid var(--line); margin-top: .25rem; padding-top: .25rem; }
.ss-label { font-size: .74rem; font-weight: 700; color: var(--muted); padding: .35rem .6rem .15rem; }
.search-suggest a, .ss-item { display: grid; gap: .05rem; padding: .45rem .6rem; border-radius: var(--radius-s); text-decoration: none; color: var(--ink); }
.search-suggest a:hover, .search-suggest a:focus { background: var(--petrol-soft); outline: none; }
.search-suggest small { color: var(--muted); font-size: .8rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ss-all { width: 100%; margin-top: .3rem; font: inherit; font-size: .88rem; font-weight: 600; color: var(--petrol); background: var(--paper);
  border: 0; border-radius: var(--radius-s); padding: .5rem; cursor: pointer; }
.search-groups { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 1rem; align-items: start; }
.search-list { list-style: none; margin: 0 0 .5rem; padding: 0; }
.search-list li { display: grid; gap: .1rem; padding: .45rem 0; border-bottom: 1px solid var(--line); }
.search-list li:last-child { border-bottom: 0; }

.ov-section { margin-bottom: 1.5rem; }
.ov-section > h2 { font-size: 1rem; color: var(--petrol); margin-bottom: .6rem; }
.ov-section .kpis { margin-bottom: .75rem; }

.cvstatus { display: inline-block; font-size: .78rem; font-weight: 600; padding: .1rem .55rem; border-radius: 10px; white-space: nowrap; }
.cvstatus-draft { background: var(--paper); color: var(--muted); border: 1px solid var(--line); }
.cvstatus-active { background: var(--success-soft); color: var(--success); }
.cvstatus-terminated, .cvstatus-expired { background: var(--danger-soft); color: var(--danger); }
.seg label.seg-btn { cursor: pointer; }
.type-pick select, .type-pick input.input { margin-top: .6rem; }

/* Envoi de documents par email */
.send-doc summary { cursor: pointer; color: var(--petrol); }
.send-doc[open] summary { margin-bottom: 1rem; }

/* Import de fiches */
.import-steps { list-style: none; display: flex; gap: .5rem; padding: 0; margin: 0 0 1.25rem; flex-wrap: wrap; counter-reset: st; }
.import-steps li { counter-increment: st; display: flex; align-items: center; gap: .45rem; color: var(--muted); font-size: .9rem; }
.import-steps li::before { content: counter(st); width: 1.5rem; height: 1.5rem; border-radius: 50%; display: grid; place-items: center;
  border: 2px solid var(--line); font-size: .78rem; font-weight: 700; background: var(--surface); }
.import-steps li + li::after { order: -1; content: ""; width: 1.5rem; border-top: 2px solid var(--line); }
.import-steps li.is-done::before { content: "✓"; background: var(--success); border-color: var(--success); color: #fff; }
.import-steps li.is-current { color: var(--ink); font-weight: 600; }
.import-steps li.is-current::before { border-color: var(--saffron); background: var(--saffron-soft); color: var(--petrol-deep); }
tr.is-unmapped td { opacity: .6; }
.imp { display: inline-block; font-size: .78rem; font-weight: 600; padding: .1rem .55rem; border-radius: 10px; }
.imp-created { background: var(--success-soft); color: var(--success); }
.imp-updated, .imp-contact { background: var(--petrol-soft); color: var(--petrol); }
.imp-skipped { background: var(--paper); color: var(--muted); border: 1px solid var(--line); }
.imp-error { background: var(--danger-soft); color: var(--danger); }

/* =====================================================================
   Design v2 : lisibilité, hiérarchie, finitions
   Tout ce qui suit s'appuie sur les variables de thème : chaque société
   garde sa couleur, son arrondi et sa densité.
   ===================================================================== */
:root {
  --shadow-1: 0 1px 2px rgba(16, 42, 48, .05);
  --shadow-2: 0 6px 20px rgba(16, 42, 48, .10);
}
body { font-size: 15px; letter-spacing: -.003em; -webkit-font-smoothing: antialiased; }
h1 { font-size: 1.65rem; font-weight: 650; letter-spacing: -.02em; }
h2 { font-weight: 650; letter-spacing: -.01em; }
a { text-underline-offset: 2px; }
::selection { background: var(--ring); }

/* Boutons */
.btn { transition: background-color .12s, border-color .12s, box-shadow .12s, transform .05s; }
.btn:active { transform: translateY(1px); }
.btn-primary { box-shadow: 0 1px 0 rgba(0,0,0,.12), inset 0 1px 0 rgba(255,255,255,.14); }
.btn-ghost { background: var(--surface); }
.btn-ghost:hover { border-color: var(--petrol); color: var(--petrol); background: var(--petrol-soft); }
.btn[disabled], .btn[aria-disabled="true"] { opacity: .55; cursor: not-allowed; box-shadow: none; }
.btn-sm { padding: .3rem .7rem; font-size: .88rem; }

/* Champs */
.input { transition: border-color .12s, outline-color .12s; }
.input:hover:not(:focus):not([disabled]) { border-color: #B9C5C3; }
.field label, .label-like { font-weight: 600; font-size: .9rem; }
.label-like { display: block; }
.hint { line-height: 1.4; }

/* Structure de page */
.content { max-width: 1280px; padding: 1.75rem 2rem 3.5rem; }
.page-head { margin-bottom: 1.6rem; }
.page-head h1 { margin-bottom: .3rem; }
.page-head p { font-size: .95rem; max-width: 70ch; }
.panel { box-shadow: var(--shadow-1); padding: 1.3rem 1.5rem; }
.panel > h2:first-child { padding-bottom: .7rem; margin-bottom: .9rem; border-bottom: 1px solid var(--line); }
.panel.panel-flush { padding: 0; overflow: hidden; }
.panel-flush > h2:first-child { padding: 1rem 1.2rem .8rem; margin: 0; }
.panel.setup { border-left-width: 4px; }

/* Barre latérale */
.tenant-block { padding: 1.2rem 1.1rem 1.1rem; }
.tenant-mark { border-radius: var(--radius-m); }
.tenant-name { font-weight: 650; letter-spacing: -.01em; }
.nav { padding: .8rem .65rem; }
.nav a, .nav .nav-soon, .nav summary { padding: .52rem .65rem; border-radius: var(--radius-s); font-weight: 500; transition: background-color .12s, color .12s; }
.nav summary { font-weight: 600; }
.nav-group-title { font-weight: 600; letter-spacing: .01em; padding-top: 1.1rem; }
.nav a.active { font-weight: 600; }
.nav a.active::before { left: -.65rem; width: 4px; background: var(--saffron); }
.nav details a { margin-left: 1.05rem; padding-left: 1.4rem; border-left: 1px solid var(--sb-line); border-radius: 0 var(--radius-s) var(--radius-s) 0; }
.nav details a.active::before { left: -1px; top: .25rem; bottom: .25rem; width: 2px; border-radius: 2px; }
.nav details a.active { border-left-color: transparent; }
.sidebar::-webkit-scrollbar { width: 8px; }
.sidebar::-webkit-scrollbar-thumb { background: var(--sb-line); border-radius: 4px; }

/* Barre du haut */
.topbar { box-shadow: var(--shadow-1); gap: 1.25rem; }
.top-tabs a { position: relative; border-radius: var(--radius-s); }
.top-tabs a.active { color: var(--petrol); background: var(--petrol-soft); }
.global-search input { border-radius: 999px; padding-left: 2.5rem; border-color: transparent; background: var(--paper); transition: background-color .12s, border-color .12s; }
.global-search input:hover { border-color: var(--line); }
.global-search input:focus { background: var(--surface); }
.global-search .icon { left: .9rem; }
.avatar { background: var(--petrol); color: var(--on-primary); }

/* Tableaux */
.table th { background: var(--paper); border-bottom: 1px solid var(--line); position: relative; white-space: nowrap; }
.table thead th:first-child { border-top-left-radius: var(--radius-s); }
.table thead th:last-child { border-top-right-radius: var(--radius-s); }
.table tbody tr { transition: background-color .1s; }
.table tbody tr:hover { background: color-mix(in srgb, var(--petrol-soft) 55%, transparent); }
.table td a { font-weight: 500; }
.panel-flush .table thead th:first-child, .panel-flush .table thead th:last-child { border-radius: 0; }

/* Indicateurs */
.kpi { position: relative; padding: 1rem 1.15rem 1rem 1.3rem; box-shadow: var(--shadow-1); overflow: hidden; }
.kpi::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--saffron); }
.kpi-value { font-size: 1.7rem; font-weight: 650; letter-spacing: -.02em; }
.kpi-alert::before { background: var(--danger); }
.kpi-link { transition: border-color .12s, box-shadow .12s; }
.kpi-link:hover { border-color: var(--petrol); box-shadow: var(--shadow-2); }
.progress { height: 7px; border-radius: 4px; }

/* Étiquettes et statuts */
.badge, .tag, .status, .pstatus, .tstatus { letter-spacing: 0; }
.badge-ok::before, .badge-off::before { content: ""; display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: currentColor; margin-right: .4rem; vertical-align: 1px; }

/* Messages */
.alert { border-radius: var(--radius-s); padding: .8rem 1rem; box-shadow: var(--shadow-1); }
.empty { text-align: center; padding: 2.2rem 1.25rem; }

/* Menus déroulants */
.user-panel, .bell-panel { box-shadow: var(--shadow-2); }

/* ---------- Connexion ---------- */
.guest-brand {
  position: relative; overflow: hidden;
  background:
    radial-gradient(120% 70% at 0% 0%, color-mix(in srgb, var(--petrol) 100%, #fff 14%) 0%, transparent 60%),
    radial-gradient(90% 60% at 100% 100%, color-mix(in srgb, var(--saffron) 38%, transparent) 0%, transparent 62%),
    var(--petrol-deep);
}
.guest-brand h1 { letter-spacing: -.025em; line-height: 1.1; }
.guest-brand .foot { max-width: 34ch; line-height: 1.5; color: rgba(255,255,255,.78); }
.guest-brand .tenant-host { font-size: .9rem; margin-top: .4rem; color: color-mix(in srgb, var(--saffron) 70%, #fff); }
.guest-card { background: var(--surface); border: 1px solid var(--line); border-radius: calc(var(--radius-m) + 4px); padding: 2rem 2rem 1.75rem; box-shadow: var(--shadow-2); }
.guest-card h2 { font-size: 1.5rem; letter-spacing: -.02em; }
.guest-main { background: var(--paper); }

/* ---------- Réglages d'apparence ---------- */
.logo-actions { display: flex; justify-content: center; margin: -.4rem 0 1rem; }
.presets { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: .5rem; margin-top: .35rem; }
.preset {
  display: flex; align-items: center; gap: .55rem; text-align: left; font: inherit; font-size: .86rem; font-weight: 600;
  padding: .45rem .6rem; background: var(--surface); color: var(--ink); border: 1px solid var(--line); border-radius: var(--radius-s); cursor: pointer;
}
.preset:hover { border-color: var(--petrol); background: var(--petrol-soft); }
.preset-sw { display: inline-flex; flex: none; border-radius: 50%; overflow: hidden; width: 26px; height: 26px; box-shadow: inset 0 0 0 1px rgba(0,0,0,.12); }
.preset-sw i { flex: 1; }
.preset-name { line-height: 1.2; }

.color-field { display: flex; gap: .5rem; align-items: stretch; }
.color-field input[type="color"] { width: 46px; flex: none; padding: 3px; border: 1px solid var(--line); border-radius: var(--radius-s); background: var(--surface); cursor: pointer; }
.color-field .input { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; text-transform: uppercase; }

.segmented { display: inline-flex; flex-wrap: wrap; border: 1px solid var(--line); border-radius: var(--radius-s); background: var(--surface); overflow: hidden; margin-top: .35rem; }
.segmented label { margin: 0; font-weight: 500; cursor: pointer; }
.segmented input { position: absolute; opacity: 0; pointer-events: none; }
.segmented span { display: block; padding: .45rem .8rem; font-size: .88rem; border-right: 1px solid var(--line); }
.segmented label:last-child span { border-right: 0; }
.segmented label:hover span { background: var(--paper); }
.segmented input:checked + span { background: var(--petrol); color: var(--on-primary); font-weight: 600; }
.segmented input:focus-visible + span { outline: 2px solid var(--petrol); outline-offset: -2px; }

.theme-preview {
  display: grid; grid-template-columns: 76px 1fr; height: 150px; margin-top: .4rem;
  border: 1px solid var(--line); border-radius: var(--radius-m); overflow: hidden; background: var(--paper);
  font-size: 11px; pointer-events: none;
}
.tp-side { background: var(--sb-bg); border-right: 1px solid var(--sb-edge); padding: 10px 8px; display: grid; gap: 7px; align-content: start; }
.tp-side b { display: block; width: 22px; height: 22px; border-radius: var(--radius-s); background: var(--saffron); margin-bottom: 4px; }
.tp-side i { display: block; height: 9px; border-radius: 3px; background: var(--sb-line); }
.tp-side i.on { background: var(--sb-active); box-shadow: inset 3px 0 0 var(--saffron); }
.tp-main { padding: 0 12px 10px; display: grid; grid-template-rows: 28px auto 1fr; gap: 9px; }
.tp-top { margin: 0 -12px; background: var(--surface); border-bottom: 1px solid var(--line); }
.tp-row { display: flex; align-items: center; gap: 8px; }
.tp-btn { background: var(--petrol); color: var(--on-primary); padding: var(--field-y) 10px; padding-top: calc(var(--field-y) / 2); padding-bottom: calc(var(--field-y) / 2); border-radius: var(--radius-s); font-weight: 600; }
.tp-tag { background: var(--petrol-soft); color: var(--petrol); padding: 2px 8px; border-radius: 10px; font-weight: 600; }
.tp-link { color: var(--petrol); text-decoration: underline; }
.tp-table { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-m); padding: 0 8px; display: grid; align-content: start; }
.tp-table u { display: block; height: calc(var(--cell-y) * 2 + 4px); border-bottom: 1px solid var(--line); text-decoration: none; position: relative; }
.tp-table u:last-child { border-bottom: 0; }
.tp-table u::after { content: ""; position: absolute; left: 0; top: 50%; width: 55%; height: 5px; margin-top: -2.5px; border-radius: 3px; background: var(--line); }

@media (max-width: 960px) {
  .content { padding: 1.25rem 1rem 2.5rem; }
  .guest-card { padding: 1.5rem 1.25rem; }
  .presets { grid-template-columns: repeat(2, 1fr); }
}
@media print {
  .sidebar, .topbar { display: none !important; }
  .shell { display: block; }
  .panel { box-shadow: none; }
}


/* ---- Tableaux de bord de module ---------------------------------------- */
.dash-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; margin-bottom: 1.25rem; align-items: start; }
.dash-grid .panel { margin-bottom: 0; }
.dash-block-head { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; margin-bottom: .6rem; }
.dash-block-head h2 { margin: 0; }
.dash-more { font-size: .85rem; white-space: nowrap; }
.bars { list-style: none; margin: 0; padding: 0; display: grid; gap: .6rem; }
.bar-row { display: grid; grid-template-columns: minmax(90px, 9.5rem) 1fr auto; gap: .75rem; align-items: center; font-size: .92rem; }
.bar-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bar-track { height: 8px; background: var(--petrol-soft); border-radius: 4px; overflow: hidden; }
.bar-fill { display: block; height: 100%; background: var(--petrol); border-radius: 4px; }
.bar-fill.is-alert { background: var(--danger); }
.bar-value { font-variant-numeric: tabular-nums; color: var(--muted); min-width: 3.2rem; text-align: right; }
.dash-links { display: flex; flex-wrap: wrap; gap: .5rem; }
@media (max-width: 900px) { .dash-grid { grid-template-columns: 1fr; } .bar-row { grid-template-columns: 7rem 1fr auto; } }

/* =====================================================================
   Connexion — mise en valeur du logo et de l'identité de la société
   ===================================================================== */
.guest-brand { padding: clamp(1.75rem, 4vw, 3.5rem); gap: 2rem; }
.guest-brand > * { position: relative; z-index: 1; }

/* Bannière officielle : grande, sur carte blanche, liseré d'accent */
.guest-logo-card {
  background: #fff; width: 100%; max-width: 620px;
  padding: clamp(.9rem, 1.6vw, 1.4rem) clamp(1rem, 2vw, 1.75rem);
  border-radius: calc(var(--radius-m) + 8px);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--saffron) 60%, transparent), 0 24px 48px -20px rgba(0,0,0,.6);
}
.guest-logo-card img { display: block; width: 100%; height: auto; }

/* Nom de la société */
.guest-id { margin: auto 0; }
.guest-rule { display: block; width: 64px; height: 4px; border-radius: 2px; background: var(--saffron); margin-bottom: 1.25rem; }
.guest-brand h1 { font-size: clamp(2.2rem, 3.4vw, 3.6rem); font-weight: 700; line-height: 1.05; text-wrap: balance; }
.guest-brand .tenant-host { font-size: 1rem; margin-top: .9rem; letter-spacing: .01em; }
.guest-brand .tenant-mark { width: 72px; height: 72px; font-size: 1.6rem; }

/* Emblème en filigrane (découpé dans le logo) */
.guest-brand.has-emblem-bg::after {
  content: ""; position: absolute; z-index: 0; right: -110px; bottom: -110px;
  width: 440px; aspect-ratio: 1; border-radius: 50%;
  background: var(--emblem);
  mix-blend-mode: multiply; opacity: .26; pointer-events: none;
}

/* Médaillon de l'emblème sur la carte de connexion */
.guest-card.has-emblem { position: relative; margin-top: 44px; padding-top: 3.25rem; }
.guest-emblem {
  position: absolute; top: -44px; left: 50%; transform: translateX(-50%);
  width: 88px; height: 88px; border-radius: 50%;
  background: #fff var(--emblem);
  border: 4px solid #fff;
  box-shadow: 0 0 0 2px var(--saffron), 0 12px 28px -10px rgba(0,0,0,.35);
}
.guest-card.has-emblem h2 { text-align: center; }
.guest-card.has-emblem .lead { text-align: center; }

@media (max-width: 800px) {
  .guest-brand { gap: 1.25rem; padding: 1.25rem; }
  .guest-id { margin: 0; }
  .guest-rule { margin-bottom: .75rem; }
  .guest-brand h1 { font-size: 1.7rem; }
  .guest-brand.has-emblem-bg::after { width: 260px; right: -80px; bottom: -80px; }
}

/* =====================================================================
   Portail : demande d'espace + suivi dans la console
   ===================================================================== */
.portal-help { margin-top: 1.25rem; font-size: .9rem; color: var(--muted); }
.guest-card.guest-card-wide { max-width: 520px; }
.guest-card .back { margin-bottom: .75rem; }
.guest-card textarea.input { resize: vertical; min-height: 6rem; font: inherit; }
/* champ piège anti-robots : hors écran, jamais affiché */
.hp-field { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.contact-sent { text-align: center; }
.contact-sent-icon { width: 56px; height: 56px; margin: 0 auto 1rem; border-radius: 50%; background: var(--success-soft); color: var(--success); display: grid; place-items: center; font-size: 1.6rem; font-weight: 700; }
.contact-sent .lead { margin-bottom: 1.5rem; }

.nav-count { display: inline-block; min-width: 1.25rem; padding: 0 .4rem; margin-left: .25rem; border-radius: 10px; background: var(--saffron); color: var(--on-accent); font-size: .75rem; font-weight: 700; text-align: center; line-height: 1.25rem; }
.filter-tabs { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: 1rem; }
.filter-tabs a { padding: .35rem .8rem; border: 1px solid var(--line); border-radius: 999px; background: var(--surface); color: var(--ink); text-decoration: none; font-size: .88rem; font-weight: 600; }
.filter-tabs a span { color: var(--muted); font-weight: 500; margin-left: .25rem; }
.filter-tabs a:hover { border-color: var(--petrol); }
.filter-tabs a.active { background: var(--petrol); border-color: var(--petrol); color: var(--on-primary); }
.filter-tabs a.active span { color: inherit; opacity: .8; }
.rstatus { display: inline-block; font-size: .8rem; font-weight: 600; padding: .1rem .55rem; border-radius: 10px; white-space: nowrap; }
.rstatus-new { background: var(--saffron-soft); color: var(--accent-ink); }
.rstatus-contacted { background: var(--petrol-soft); color: var(--petrol); }
.rstatus-created { background: var(--success-soft); color: var(--success); }
.rstatus-rejected { background: var(--danger-soft); color: var(--danger); }

/* =====================================================================
   Portail novaxis.click : accueil, demande d'espace
   ===================================================================== */
.portal-brand {
  isolation: isolate; gap: 2rem;
  background:
    radial-gradient(55% 45% at 88% 8%, color-mix(in srgb, var(--saffron) 26%, transparent) 0%, transparent 70%),
    radial-gradient(90% 60% at 0% 100%, color-mix(in srgb, var(--petrol) 100%, #fff 16%) 0%, transparent 65%),
    linear-gradient(165deg, var(--petrol) 0%, var(--petrol-deep) 75%);
}
/* trame de points qui s'estompe vers le bas */
.portal-brand::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background-image: radial-gradient(rgba(255,255,255,.16) 1px, transparent 1.4px); background-size: 24px 24px;
  -webkit-mask-image: linear-gradient(180deg, #000 0%, transparent 70%); mask-image: linear-gradient(180deg, #000 0%, transparent 70%);
}
/* orbites décoratives */
.portal-brand::after {
  content: ""; position: absolute; z-index: -1; pointer-events: none;
  width: 560px; aspect-ratio: 1; right: -220px; bottom: -220px; border-radius: 50%;
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 0 0 64px transparent, 0 0 0 65px rgba(255,255,255,.07), 0 0 0 132px transparent, 0 0 0 133px rgba(255,255,255,.05);
}
.pb-logo { display: inline-flex; align-items: center; gap: .7rem; color: var(--saffron); text-decoration: none; }
.pb-logo span { color: #fff; font-size: 1.35rem; font-weight: 700; letter-spacing: -.02em; }
.pb-mark { width: 40px; height: 40px; flex: none; box-shadow: 0 8px 20px -8px rgba(0,0,0,.6); border-radius: 11px; }

.pb-hero { margin: auto 0; max-width: 34rem; }
.pb-eyebrow { display: inline-flex; align-items: center; gap: .5rem; margin: 0 0 1.1rem; font-size: .78rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: color-mix(in srgb, var(--saffron) 75%, #fff); }
.pb-eyebrow::before { content: ""; width: 28px; height: 2px; border-radius: 2px; background: var(--saffron); }
.portal-brand h1 { margin: 0; font-size: clamp(2.2rem, 3.6vw, 3.6rem); font-weight: 700; line-height: 1.04; letter-spacing: -.03em; text-wrap: balance; }
.portal-brand h1 em { font-style: normal; color: var(--saffron); }
.pb-lead { margin: 1.25rem 0 2rem; max-width: 30rem; font-size: 1.05rem; line-height: 1.55; color: rgba(255,255,255,.78); }

.pb-modules { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: .7rem; }
.pb-modules li {
  display: flex; align-items: center; gap: .8rem; padding: .8rem .9rem;
  background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.12); border-radius: 14px;
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); transition: background .2s, border-color .2s, transform .2s;
}
.pb-modules li:hover { background: rgba(255,255,255,.11); border-color: color-mix(in srgb, var(--saffron) 55%, transparent); transform: translateY(-2px); }
.pb-ico { flex: none; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 11px; background: color-mix(in srgb, var(--saffron) 20%, transparent); color: var(--saffron); }
.pb-ico .icon { width: 20px; height: 20px; }
.pb-modules strong { display: block; font-size: .95rem; }
.pb-modules small { display: block; margin-top: .1rem; font-size: .78rem; color: rgba(255,255,255,.66); }
.pb-foot { margin: 0; font-size: .85rem; color: rgba(255,255,255,.55); }

/* côté formulaire */
.portal-main {
  background:
    radial-gradient(40% 35% at 100% 0%, color-mix(in srgb, var(--saffron) 12%, transparent) 0%, transparent 70%),
    radial-gradient(45% 40% at 0% 100%, color-mix(in srgb, var(--petrol) 9%, transparent) 0%, transparent 70%),
    var(--paper);
}
.guest-card.portal-card { max-width: 440px; padding: 2.25rem 2.25rem 2rem; border-radius: 22px; border-color: transparent; position: relative; overflow: hidden;
  box-shadow: 0 1px 2px rgba(10,54,62,.06), 0 24px 48px -24px rgba(10,54,62,.3); }
.guest-card.portal-card.guest-card-wide { max-width: 540px; }
.guest-card.portal-card::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 5px; background: linear-gradient(90deg, var(--petrol), var(--saffron)); }
.portal-eyebrow { margin: 0 0 .4rem; font-size: .75rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--accent-ink); }
.portal-card h2 { font-size: 1.75rem; }
.btn-lg { padding-top: .8rem; padding-bottom: .8rem; font-size: 1rem; }

/* séparateur « ou » */
.portal-or { display: flex; align-items: center; gap: .9rem; margin: 1.6rem 0 1.2rem; color: var(--muted); font-size: .8rem; text-transform: uppercase; letter-spacing: .1em; }
.portal-or::before, .portal-or::after { content: ""; flex: 1; height: 1px; background: var(--line); }

/* bloc « Besoin d'un espace ? » mis en valeur : carte sombre, bouton safran */
.portal-cta {
  padding: 1.2rem 1.2rem 1.3rem; border-radius: 16px; position: relative; overflow: hidden; color: #fff;
  background:
    radial-gradient(70% 90% at 100% 0%, color-mix(in srgb, var(--saffron) 34%, transparent) 0%, transparent 70%),
    linear-gradient(150deg, var(--petrol) 0%, var(--petrol-deep) 100%);
  box-shadow: 0 18px 34px -20px rgba(10,54,62,.75);
}
.portal-cta-head { display: flex; gap: .9rem; align-items: flex-start; margin-bottom: 1.05rem; }
.portal-cta-ico { flex: none; width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; background: var(--saffron); color: var(--petrol-deep); }
.portal-cta-ico svg { width: 24px; height: 24px; }
.portal-cta strong { display: block; font-size: 1.15rem; color: #fff; letter-spacing: -.01em; }
.portal-cta p { margin: .25rem 0 0; font-size: .9rem; line-height: 1.4; color: rgba(255,255,255,.78); }
.btn-accent { background: var(--saffron); color: var(--on-accent); border-color: transparent; font-weight: 700; }
.btn-accent:hover { background: color-mix(in srgb, var(--saffron) 88%, #fff); box-shadow: 0 10px 22px -10px rgba(0,0,0,.6); }
.btn-accent span { display: inline-block; transition: transform .2s; }
.btn-accent:hover span { transform: translateX(4px); }
.btn-primary.btn-lg span { display: inline-block; transition: transform .2s; }
.btn-primary.btn-lg:hover span { transform: translateX(4px); }

@media (max-width: 800px) {
  .portal-brand { gap: 1rem; padding: 1.25rem 1.25rem 1.5rem; }
  .portal-brand::after { width: 300px; right: -140px; bottom: -150px; }
  .pb-hero { margin: 0; }
  .pb-lead, .pb-modules, .pb-foot { display: none; }
  .portal-brand h1 { font-size: 1.7rem; }
  .pb-eyebrow { margin-bottom: .6rem; }
  .guest-card.portal-card { padding: 1.75rem 1.25rem 1.5rem; }
}
@media (prefers-reduced-motion: reduce) {
  .pb-modules li, .btn-accent span, .btn-primary.btn-lg span { transition: none; }
  .pb-modules li:hover { transform: none; }
}

.portal-card .alert { margin-bottom: 1.25rem; }

/* après un identifiant inconnu, le bloc « Demandez votre espace » attire l'œil une fois */
.portal-card .alert-error ~ .portal-cta { animation: cta-attention 1.6s ease-out .3s 2; }
@keyframes cta-attention {
  0%   { box-shadow: 0 18px 34px -20px rgba(10,54,62,.75), 0 0 0 0 color-mix(in srgb, var(--saffron) 70%, transparent); }
  70%  { box-shadow: 0 18px 34px -20px rgba(10,54,62,.75), 0 0 0 14px transparent; }
  100% { box-shadow: 0 18px 34px -20px rgba(10,54,62,.75), 0 0 0 0 transparent; }
}
@media (prefers-reduced-motion: reduce) { .portal-card .alert-error ~ .portal-cta { animation: none; } }

/* Formulaire de demande d'espace : choix des modules */
fieldset.module-pick { border: 0; padding: 0; margin: 0 0 1rem; min-width: 0; }
fieldset.module-pick legend { font-weight: 600; margin-bottom: .4rem; padding: 0; }
.module-pick .check-list { margin-bottom: .5rem; }
.module-pick .check-list li { padding: .35rem 0; border-bottom: 1px solid rgba(0,0,0,.06); }
.module-pick .check-list li:last-child { border-bottom: 0; }
.module-pick small { line-height: 1.35; }

/* Bons de livraison */
.dstatus { display: inline-block; padding: .1rem .55rem; border-radius: 10px; white-space: nowrap; font-size: .78rem; font-weight: 600; }
.dstatus-draft { background: var(--paper); color: var(--muted); border: 1px solid var(--line); }
.dstatus-delivered { background: var(--petrol-soft); color: var(--petrol); }
.dstatus-invoiced { background: var(--success-soft); color: var(--success); }
.dstatus-cancelled { background: var(--danger-soft); color: var(--danger); }

/* Retenue à la source */
.wh-box { margin: .5rem 0 1rem; padding: .6rem .8rem; border: 1px solid var(--line); border-radius: 10px; background: var(--paper); }
.wh-box summary { cursor: pointer; font-weight: 600; }
.wh-box .check-list { margin: .6rem 0; }
.wh-cert { display: inline-flex; gap: .4rem; align-items: center; margin-top: .25rem; }
.wh-cert .input-s { width: 9rem; }

.teif-box { margin-top: 1rem; padding-top: .8rem; border-top: 1px solid var(--line); }

/* Consultations fournisseurs : meilleur prix */
.best-price { color: var(--success); font-weight: 700; }

/* Contacts d'un client (fiche client) */
.contact-list { list-style: none; margin: 0; padding: 0; }
.contact { display: flex; gap: 1rem; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; padding: .9rem 0; border-bottom: 1px solid var(--line); }
.contact:first-child { padding-top: .4rem; }
.contact:last-child { border-bottom: 0; }
.contact-main { flex: 1 1 260px; min-width: 0; }
.contact-name { display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; }
.contact-name .tag { margin: 0; }
.contact-role { color: var(--muted); font-size: .88rem; margin-top: .1rem; }
.contact-meta { display: flex; flex-wrap: wrap; gap: .2rem 1rem; font-size: .9rem; margin-top: .35rem; overflow-wrap: anywhere; }
.contact-portal { font-size: .84rem; color: var(--success); margin-top: .35rem; }
.contact-portal.muted { color: var(--muted); }
.contact-actions { display: flex; align-items: center; gap: .9rem; flex-wrap: wrap; }
.btn-link-danger { color: var(--muted); text-decoration: none; }
.btn-link-danger:hover { color: var(--danger); text-decoration: underline; }

/* Paiements d'une facture */
.pay-summary { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: .75rem; margin-top: .25rem; }
.pay-summary > div { background: var(--paper); border-radius: var(--radius-m); padding: .65rem .8rem; display: grid; gap: .15rem; min-width: 0; }
.pay-summary span { color: var(--muted); font-size: .82rem; }
.pay-summary strong { font-size: 1.05rem; font-weight: 600; overflow-wrap: anywhere; }
.pay-summary .is-done { background: var(--success-soft); }
.pay-summary .is-done strong { color: var(--success); }
.pay-summary .is-alert { background: var(--danger-soft); }
.pay-summary .is-alert strong { color: var(--danger); }
.pay-progress { height: 6px; background: var(--petrol-soft); border-radius: 3px; overflow: hidden; margin-top: .9rem; }
.pay-progress span { display: block; height: 100%; background: var(--success); border-radius: 3px; }
.pay-progress-label { font-size: .84rem; color: var(--muted); margin: .35rem 0 0; }
.pay-list { list-style: none; margin: 1.1rem 0 0; padding: 0; display: grid; gap: .7rem; }
.pay-item { border: 1px solid var(--line); border-radius: var(--radius-m); padding: .8rem .95rem; }
.pay-item-head { display: flex; justify-content: space-between; align-items: baseline; gap: .75rem; flex-wrap: wrap; }
.pay-amount { font-weight: 600; font-size: 1.05rem; white-space: nowrap; }
.pay-amount small { font-weight: 400; color: var(--muted); font-size: .8rem; margin-left: .3rem; }
.pay-detail { font-size: .88rem; margin-top: .4rem; }
.pay-cert { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }
.pay-cert .inline-grid { margin-top: 0; flex: 1 1 220px; }
.pay-cert-edit summary { cursor: pointer; color: var(--petrol); font-size: .84rem; }
.pay-cert-edit[open] { flex-basis: 100%; }
.pay-cert-edit .inline-grid { margin-top: .4rem; }
.pay-delete { margin-top: .5rem; text-align: right; }
.pay-delete .btn-link { font-size: .82rem; }
.pay-form-title { font-size: 1rem; margin: 1.4rem 0 0; padding-top: 1.1rem; border-top: 1px solid var(--line); }
.pay-form-title + .pay-form { margin-top: .6rem; padding-top: 0; border-top: 0; }
@media (max-width: 520px) { .pay-summary { grid-template-columns: 1fr; } }

/* Listes de documents : numéro sur une ligne, objet sur deux lignes au plus (texte complet au survol) */
.doc-cell { min-width: 10rem; max-width: 24rem; }
.doc-cell > a { white-space: nowrap; }
.doc-sub { display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
           margin-top: .15rem; font-size: .8rem; line-height: 1.35; color: var(--muted); white-space: normal; }
.table th.num { text-align: right; }

/* =====================================================================
   Design v3 : inspiré de Bootstrap 5.3 / Tabler, sans dépendance
   Mêmes classes qu'avant ; tout passe par les variables de thème, donc
   chaque société garde ses couleurs, son arrondi et sa densité.
   ===================================================================== */
:root {
  --line-soft: color-mix(in srgb, var(--line) 62%, var(--surface));
  --head-bg: color-mix(in srgb, var(--paper) 70%, var(--surface));
  --card-radius: calc(var(--radius-m) + 2px);
  --shadow-1: 0 1px 2px rgba(16, 24, 40, .04), 0 1px 3px rgba(16, 24, 40, .05);
  --shadow-2: 0 12px 32px -10px rgba(16, 24, 40, .22), 0 2px 6px rgba(16, 24, 40, .06);
  --focus-ring: 0 0 0 .22rem color-mix(in srgb, var(--petrol) 20%, transparent);
}
body { font-size: 14.5px; line-height: 1.55; }
h1 { font-size: 1.55rem; font-weight: 700; letter-spacing: -.022em; }
h2 { font-size: 1.02rem; font-weight: 650; }
h3 { font-size: .95rem; font-weight: 650; }

/* ---------- Structure ---------- */
.content { padding: 1.75rem 2rem 4rem; max-width: 1440px; margin-inline: auto; }
.page-head { margin-bottom: 1.4rem; }
.page-head-row { align-items: center; }
.page-head p { font-size: .92rem; margin-top: .1rem; }
.page-head-row > :last-child:not(:first-child) { display: flex; gap: .5rem; flex-wrap: wrap; align-items: center; }
.back { font-weight: 500; margin-bottom: .55rem; }

/* ---------- Barre du haut ---------- */
.topbar {
  height: 62px; box-shadow: none; border-bottom: 1px solid var(--line-soft);
  background: color-mix(in srgb, var(--surface) 88%, transparent);
  backdrop-filter: saturate(160%) blur(10px); -webkit-backdrop-filter: saturate(160%) blur(10px);
}
.top-tabs a { font-weight: 600; font-size: .93rem; padding: .45rem .8rem; }
.top-tabs a.active { box-shadow: inset 0 -2px 0 var(--petrol); border-radius: var(--radius-s) var(--radius-s) 0 0; }
.global-search input { height: 40px; border: 1px solid var(--line-soft); background: var(--head-bg); }
.global-search input:focus { border-color: var(--petrol); box-shadow: var(--focus-ring); outline: 0; }
.icon-btn { border-radius: 50%; color: var(--muted); transition: background-color .12s, color .12s; }
.icon-btn:hover { color: var(--petrol); background: var(--petrol-soft); }
.top-badge { box-shadow: 0 0 0 2px var(--surface); }
.user-menu summary { padding: .25rem .6rem .25rem .3rem; border-radius: 999px; }
.user-menu .who { font-weight: 600; }
.user-menu .who small { font-weight: 400; font-size: .78rem; }
.user-panel, .bell-panel { border-color: var(--line-soft); border-radius: var(--card-radius); }

/* ---------- Barre latérale ---------- */
.tenant-block { padding: 1.15rem 1.1rem; }
.tenant-host { opacity: .85; }
.nav { padding: .7rem .7rem 1.5rem; }
.nav-group-title { text-transform: uppercase; font-size: .68rem; letter-spacing: .08em; padding: 1.2rem .65rem .4rem; }
.nav a, .nav .nav-soon, .nav summary { font-size: .92rem; padding: .5rem .7rem; }
.nav .icon { width: 18px; height: 18px; opacity: .85; }
.nav a.active .icon, .nav summary:hover .icon { opacity: 1; }
.nav details a { font-size: .88rem; padding-top: .42rem; padding-bottom: .42rem; }
.nav details[open] > summary { color: var(--sb-strong); }

/* ---------- Cartes (panneaux) ---------- */
.panel { border-color: var(--line-soft); border-radius: var(--card-radius); box-shadow: var(--shadow-1); padding: 1.25rem 1.4rem; }
.panel > h2:first-child { font-size: 1rem; margin: -.2rem 0 1rem; padding-bottom: .8rem; border-bottom-color: var(--line-soft); }
.panel-flush > h2:first-child { margin: 0; padding: 1rem 1.25rem .85rem; }
.panel-danger { border-color: color-mix(in srgb, var(--danger) 30%, var(--line)); }
.grid-2 { gap: 1.25rem; }
.kv { gap: .55rem 1.5rem; }
.kv dt { font-size: .88rem; }

/* ---------- Boutons ---------- */
.btn { min-height: 38px; padding: .45rem 1rem; font-size: .92rem; font-weight: 600; letter-spacing: -.003em; border-radius: var(--radius-s); line-height: 1.3; }
.btn .icon { width: 16px; height: 16px; }
.btn:focus-visible { outline: 0; box-shadow: var(--focus-ring); }
.btn-primary { box-shadow: 0 1px 2px rgba(16, 24, 40, .12); }
.btn-primary:hover { background: color-mix(in srgb, var(--petrol) 86%, #000); }
.btn-ghost { border-color: var(--line); box-shadow: 0 1px 2px rgba(16, 24, 40, .05); }
.btn-ghost:hover { border-color: color-mix(in srgb, var(--petrol) 45%, var(--line)); background: var(--petrol-soft); color: var(--petrol); }
.btn-danger { box-shadow: 0 1px 2px rgba(16, 24, 40, .12); }
.btn-danger:hover { background: color-mix(in srgb, var(--danger) 86%, #000); }
.btn-sm { min-height: 30px; padding: .25rem .65rem; font-size: .84rem; }

/* ---------- Champs ---------- */
.field { gap: .4rem; margin-bottom: 1.05rem; }
.field label, .label-like { font-weight: 600; font-size: .86rem; color: color-mix(in srgb, var(--ink) 88%, var(--muted)); }
.input { min-height: 38px; padding: .45rem .75rem; font-size: .93rem; border-color: var(--line); box-shadow: inset 0 1px 1px rgba(16, 24, 40, .03);
         transition: border-color .12s, box-shadow .12s; }
.input::placeholder { color: color-mix(in srgb, var(--muted) 75%, var(--surface)); }
.input:focus { outline: 0; border-color: var(--petrol); box-shadow: var(--focus-ring); }
.input[disabled], .input[readonly] { background: var(--head-bg); color: var(--muted); }
textarea.input { min-height: 90px; line-height: 1.5; }
select.input:not([multiple]):not([size]) {
  appearance: none; -webkit-appearance: none; padding-right: 2.2rem; cursor: pointer;
  background: var(--surface) url("../img/select-chevron.svg") no-repeat right .7rem center / 16px 16px;
}
.input-affix span { background: var(--head-bg); font-size: .86rem; }
.hint { font-size: .82rem; }
input[type="checkbox"], input[type="radio"] { accent-color: var(--petrol); width: 1rem; height: 1rem; }
.field .error, .field-error, .error-text { font-size: .82rem; }

/* Filtres au-dessus d'une liste : une barre posée comme une carte */
.content > .toolbar {
  background: var(--surface); border: 1px solid var(--line-soft); border-radius: var(--card-radius);
  padding: .7rem .8rem; box-shadow: var(--shadow-1); margin-bottom: 1rem;
}
.content > .toolbar .input { max-width: 340px; }

/* ---------- Tableaux ---------- */
.table { font-size: .92rem; }
.table th {
  background: var(--head-bg); color: var(--muted); font-size: .72rem; font-weight: 650;
  text-transform: uppercase; letter-spacing: .055em; padding-top: .7rem; padding-bottom: .7rem; border-bottom-color: var(--line-soft);
}
.table td { border-bottom-color: var(--line-soft); vertical-align: middle; padding-top: calc(var(--cell-y) + .1rem); padding-bottom: calc(var(--cell-y) + .1rem); }
.table tbody tr:hover { background: color-mix(in srgb, var(--petrol-soft) 45%, transparent); }
.table td a { text-decoration: none; font-weight: 600; }
.table td a:hover { text-decoration: underline; }
.table td small.muted, .table td .muted small { font-size: .8rem; }
.table tfoot td, .table tfoot th { background: var(--head-bg); font-weight: 650; border-top: 1px solid var(--line); }
.panel-flush .table th:first-child, .panel-flush .table td:first-child { padding-left: 1.25rem; }
.panel-flush .table th:last-child, .panel-flush .table td:last-child { padding-right: 1.25rem; }
.empty { color: var(--muted); font-size: .93rem; }

/* ---------- Étiquettes, statuts ---------- */
.badge, .tag, .status, .qstatus, .istatus, .pstatus, .tstatus {
  border-radius: 999px; font-size: .74rem; font-weight: 600; padding: .18rem .6rem; line-height: 1.35;
}
.tag { padding: .12rem .55rem; }

/* ---------- Indicateurs ---------- */
.kpis { gap: 1rem; }
.kpi { border-color: var(--line-soft); border-radius: var(--card-radius); padding: 1rem 1.15rem 1.05rem 1.3rem; }
.kpi::before { width: 3px; }
.kpi-label { font-size: .74rem; font-weight: 650; text-transform: uppercase; letter-spacing: .05em; }
.kpi-value { font-size: 1.6rem; font-weight: 700; }
.kpi-alert { background: color-mix(in srgb, var(--danger-soft) 45%, var(--surface)); }

/* ---------- Onglets, pagination ---------- */
.tabs { border-bottom-color: var(--line-soft); gap: .1rem; }
.tabs a { font-size: .92rem; padding: .6rem 1rem; border-radius: var(--radius-s) var(--radius-s) 0 0; }
.tabs a:hover { color: var(--ink); background: var(--head-bg); }
.pagination a, .pagination span { border-radius: var(--radius-s); }

/* ---------- Messages ---------- */
.alert { display: block; border: 1px solid; border-left-width: 4px; border-radius: var(--radius-m); padding: .8rem 1rem; font-size: .93rem; box-shadow: none; }
.alert-error   { border-color: color-mix(in srgb, var(--danger) 30%, transparent);  border-left-color: var(--danger);  color: color-mix(in srgb, var(--danger) 70%, var(--ink)); }
.alert-success { border-color: color-mix(in srgb, var(--success) 30%, transparent); border-left-color: var(--success); color: color-mix(in srgb, var(--success) 65%, var(--ink)); }
.alert-warning { border-color: color-mix(in srgb, var(--saffron) 40%, transparent); border-left-color: var(--saffron); color: var(--ink); }

/* ---------- Petits écrans ---------- */
@media (max-width: 960px) {
  .content { padding: 1.25rem 1rem 2.5rem; }
  .content > .toolbar .input { max-width: none; }
}
@media (max-width: 560px) {
  h1 { font-size: 1.3rem; }
  .page-head-row { align-items: flex-start; }
  .panel { padding: 1rem 1.05rem; }
  .content > .toolbar > * { flex: 1 1 100%; max-width: none; }
}

/* ---------- Fenêtre de confirmation ---------- */
.confirm-dialog {
  width: min(440px, calc(100vw - 2rem)); padding: 0; border: 1px solid var(--line-soft); border-radius: calc(var(--radius-m) + 4px);
  background: var(--surface); color: var(--ink); box-shadow: 0 24px 60px -12px rgba(16, 24, 40, .35);
}
.confirm-dialog::backdrop { background: rgba(16, 24, 40, .45); backdrop-filter: blur(2px); }
.confirm-dialog[open] { animation: confirm-in .16s ease-out; }
.confirm-dialog form { display: grid; grid-template-columns: auto 1fr; gap: .9rem 1rem; padding: 1.4rem 1.4rem 1.2rem; margin: 0; }
.confirm-icon { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: var(--petrol-soft); color: var(--petrol); font-weight: 700; font-size: 1.1rem; }
.confirm-icon::before { content: "?"; }
.confirm-dialog.is-danger .confirm-icon { background: var(--danger-soft); color: var(--danger); }
.confirm-dialog.is-danger .confirm-icon::before { content: "!"; }
.confirm-text h2 { font-size: 1.02rem; font-weight: 650; line-height: 1.4; margin: .45rem 0 0; }
.confirm-body { margin: .45rem 0 0; color: var(--muted); font-size: .92rem; }
.confirm-actions { grid-column: 1 / -1; display: flex; justify-content: flex-end; gap: .5rem; margin-top: .4rem; }
@keyframes confirm-in { from { opacity: 0; transform: translateY(6px) scale(.98); } to { opacity: 1; transform: none; } }

/* ---------- Notifications ---------- */
.toast-stack { position: fixed; right: 1.25rem; bottom: 1.25rem; z-index: 60; display: grid; gap: .5rem; width: min(380px, calc(100vw - 2rem)); }
.toast {
  display: flex; align-items: flex-start; gap: .75rem; padding: .8rem .8rem .8rem 1rem; border-radius: var(--radius-m);
  background: var(--surface); border: 1px solid var(--line-soft); border-left: 4px solid var(--success);
  box-shadow: var(--shadow-2); font-size: .92rem; animation: toast-in .2s ease-out;
}
.toast-info { border-left-color: var(--petrol); }
.toast-msg { flex: 1; padding-top: .1rem; }
.toast-msg::before { content: "✓"; display: inline-grid; place-items: center; width: 1.2rem; height: 1.2rem; margin-right: .5rem; border-radius: 50%;
                     background: var(--success-soft); color: var(--success); font-size: .75rem; font-weight: 700; vertical-align: 1px; }
.toast-info .toast-msg::before { content: "i"; background: var(--petrol-soft); color: var(--petrol); }
.toast-close { flex: none; width: 26px; height: 26px; border: 0; border-radius: 50%; background: transparent; color: var(--muted); font-size: 1.15rem; line-height: 1; cursor: pointer; }
.toast-close:hover { background: var(--head-bg); color: var(--ink); }
.toast.is-leaving { opacity: 0; transform: translateY(6px); transition: opacity .25s, transform .25s; }
@keyframes toast-in { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@media (max-width: 560px) { .toast-stack { right: 1rem; left: 1rem; bottom: 1rem; width: auto; } }

/* ---------- Bandeau en tête des factures et devis ---------- */
.doc-head {
  background: var(--surface); border: 1px solid var(--line-soft); border-radius: var(--card-radius);
  box-shadow: var(--shadow-1); margin-bottom: 1.25rem; overflow: visible;
}
.doc-head-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem 1.5rem; flex-wrap: wrap; padding: 1.1rem 1.4rem 1rem; }
.doc-head-id { min-width: 0; }
.doc-head .back { margin-bottom: .35rem; }
.doc-head-title { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }
.doc-head-title h1 { margin: 0; font-size: 1.45rem; }
.doc-head-meta { display: flex; flex-wrap: wrap; gap: .2rem 0; margin: .35rem 0 0; color: var(--muted); font-size: .9rem; }
.doc-head-meta > * + *::before { content: "·"; margin: 0 .5rem; color: var(--line); }
.doc-head-meta a { font-weight: 600; text-decoration: none; }
.doc-head-meta a:hover { text-decoration: underline; }
.doc-head-actions { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; }
.doc-figures { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); border-top: 1px solid var(--line-soft); }
.doc-figures > div { padding: .8rem 1.4rem .9rem; display: grid; gap: .1rem; align-content: start; }
.doc-figures > div + div { border-left: 1px solid var(--line-soft); }
.doc-figures span { font-size: .72rem; font-weight: 650; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }
.doc-figures strong { font-size: 1.15rem; font-weight: 700; letter-spacing: -.01em; white-space: nowrap; }
.doc-figures small { font-size: .8rem; color: var(--muted); }
.doc-figures .is-key strong { color: var(--ink); font-size: 1.25rem; }
.doc-figures .is-done strong { color: var(--success); }
.doc-figures .is-alert { background: color-mix(in srgb, var(--danger-soft) 45%, transparent); }
.doc-figures .is-alert strong, .doc-figures .is-alert small { color: var(--danger); }
.doc-figures > div:last-child { border-bottom-right-radius: var(--card-radius); }
@media (max-width: 560px) {
  .doc-head-top, .doc-figures > div { padding-left: 1rem; padding-right: 1rem; }
  .doc-figures { grid-template-columns: 1fr 1fr; }
  .doc-figures > div:nth-child(odd) { border-left: 0; }
  .doc-figures > div:nth-child(n+3) { border-top: 1px solid var(--line-soft); }
}

/* ---------- Menu « Plus d'actions » ---------- */
.menu-more { position: relative; }
.menu-more > summary { list-style: none; min-width: 38px; padding-left: .6rem; padding-right: .6rem; }
.menu-more > summary::-webkit-details-marker { display: none; }
.menu-more[open] > summary { background: var(--petrol-soft); border-color: color-mix(in srgb, var(--petrol) 45%, var(--line)); color: var(--petrol); }
.menu-panel {
  position: absolute; right: 0; top: calc(100% + 6px); z-index: 20; min-width: 230px; padding: .35rem;
  background: var(--surface); border: 1px solid var(--line-soft); border-radius: var(--card-radius); box-shadow: var(--shadow-2);
}
.menu-panel form { margin: 0; }
.menu-panel a, .menu-panel button {
  display: flex; align-items: center; gap: .6rem; width: 100%; padding: .5rem .65rem; border: 0; border-radius: var(--radius-s);
  background: none; color: var(--ink); font: inherit; font-size: .9rem; text-align: left; text-decoration: none; cursor: pointer;
}
.menu-panel a:hover, .menu-panel button:hover { background: var(--head-bg); color: var(--petrol); }
.menu-panel .icon { width: 16px; height: 16px; color: var(--muted); }

/* ---------- Réglage des prochains numéros ---------- */
.numbering-table { margin: .5rem 0 1rem; }
.numbering-table td { vertical-align: top; }
.numbering-table .input-s { width: 9rem; }
.numbering-preview { font-size: .9rem; padding: .2rem .5rem; border-radius: var(--radius-s); background: var(--head-bg); white-space: nowrap; display: inline-block; margin-top: .45rem; }
.numbering-gap p { margin: 0 0 .5rem; }
.numbering-freed { color: var(--accent-ink); font-size: .78rem; white-space: nowrap; }

/* ---------- Listes : tri, en-têtes fixes, filtres, pagination ---------- */
.th-sort a { display: inline-flex; align-items: center; gap: .3rem; color: inherit; text-decoration: none; font-weight: inherit; }
.th-sort a:hover { color: var(--ink); }
.th-sort.num a { flex-direction: row-reverse; }
.sort-ind { width: 0; height: 0; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 5px solid currentColor; opacity: .25; transition: opacity .12s; }
.th-sort a:hover .sort-ind { opacity: .6; }
.th-sort.is-sorted { color: var(--petrol); }
.th-sort.is-sorted .sort-ind { opacity: 1; }
.th-sort.is-asc .sort-ind { border-top: 0; border-bottom: 5px solid currentColor; }
.table td a:hover, .th-sort a:hover { text-decoration: none; }

.panel.panel-flush { overflow: clip; }
.content .table-wrap.is-fit { overflow: visible; }
.content .table-wrap.is-fit .table thead th { position: sticky; top: 62px; z-index: 3; box-shadow: inset 0 -1px 0 var(--line-soft); }

.filter-chips { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; margin: -.35rem 0 1rem; font-size: .86rem; }
.chip { display: inline-flex; align-items: center; gap: .35rem; padding: .2rem .35rem .2rem .7rem; border-radius: 999px;
        background: var(--petrol-soft); color: var(--petrol); font-weight: 600; text-decoration: none; border: 1px solid transparent; }
.chip:hover { border-color: color-mix(in srgb, var(--petrol) 40%, transparent); }
.chip-x { display: inline-grid; place-items: center; width: 1.15rem; height: 1.15rem; border-radius: 50%; font-size: .95rem; line-height: 1; }
.chip:hover .chip-x { background: color-mix(in srgb, var(--petrol) 18%, transparent); }
.chip-clear { color: var(--muted); font-size: .84rem; margin-left: .25rem; }

.pagination { justify-content: space-between; flex-wrap: wrap; gap: .75rem 1.5rem; }
.pagination-pages { display: flex; align-items: center; gap: .75rem; }
.per-page { display: flex; align-items: center; gap: .15rem; font-size: .86rem; }
.per-page .muted { margin-right: .4rem; }
.per-page a { min-width: 2.1rem; text-align: center; padding: .2rem .45rem; border-radius: var(--radius-s); text-decoration: none; color: var(--muted); font-weight: 600; }
.per-page a:hover { background: var(--head-bg); color: var(--ink); }
.per-page a[aria-current] { background: var(--petrol-soft); color: var(--petrol); }

/* ---------- Bouton en cours d'envoi ---------- */
.btn.is-loading { position: relative; color: transparent !important; pointer-events: none; }
.btn.is-loading .icon { visibility: hidden; }
.btn.is-loading::after {
  content: ""; position: absolute; left: 50%; top: 50%; width: 1rem; height: 1rem; margin: -.5rem 0 0 -.5rem; border-radius: 50%;
  border: 2px solid var(--petrol); border-right-color: transparent; animation: btn-spin .7s linear infinite;
}
.btn-primary.is-loading::after, .btn-danger.is-loading::after { border-color: var(--on-primary); border-right-color: transparent; }
@keyframes btn-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .btn.is-loading::after { animation-duration: 2s; } }
@media (max-width: 560px) { .pagination { justify-content: center; } }

/* =====================================================================
   Thème sombre : réglage de l'ordinateur (Auto) ou choix dans le menu utilisateur (Clair / Sombre).
   La couleur de la société (--brand) est éclaircie pour rester lisible ; documents imprimés et PDF restent clairs.
   ===================================================================== */
:root { --brand: #0E4A55; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --paper: #0F1416; --surface: #171D20; --surface-2: #1B2226; --head-bg: #1B2226;
    --ink: #E3E9EA; --muted: #98A6AA; --line: #2E373B; --line-soft: #252D31;
    --petrol: color-mix(in srgb, var(--brand) 42%, #E2F0F2);
    --petrol-deep: color-mix(in srgb, var(--brand) 72%, #000);
    --petrol-soft: color-mix(in srgb, var(--brand) 32%, #171D20);
    --on-primary: #0F1416; --ring: color-mix(in srgb, var(--brand) 55%, transparent);
    --saffron-soft: color-mix(in srgb, var(--saffron) 22%, #171D20); --accent-ink: color-mix(in srgb, var(--saffron) 70%, #fff);
    --danger: #EC8A78; --danger-soft: #3B2421; --success: #6FCB9F; --success-soft: #1C3328; --warning-soft: #3A3121;
    --shadow-1: 0 1px 2px rgba(0, 0, 0, .45); --shadow-2: 0 14px 34px -10px rgba(0, 0, 0, .7), 0 2px 6px rgba(0, 0, 0, .4);
    --sb-bg: color-mix(in srgb, var(--brand) 22%, #0B0F11); --sb-ink: #C8D3D5; --sb-strong: #FFFFFF; --sb-muted: #8C9CA0; --sb-dim: #7D8D91;
    --sb-hover: rgba(255, 255, 255, .06); --sb-active: rgba(255, 255, 255, .1); --sb-active-ink: #FFFFFF; --sb-line: rgba(255, 255, 255, .07); --sb-edge: #222A2E;
  }
  :root:not([data-theme="light"]) .notif-list li.unread a { background: var(--saffron-soft); }
  :root:not([data-theme="light"]) .gantt-name, .g-line { border-color: var(--line-soft); }
  :root:not([data-theme="light"]) .cal-day.is-out, .cal-day.is-weekend, .board-col { background: var(--head-bg); }
  :root:not([data-theme="light"]) .wl-l1 { background: color-mix(in srgb, var(--petrol-soft) 60%, transparent); }
  :root:not([data-theme="light"]) .wl-l2 { background: var(--petrol-soft); }
  :root:not([data-theme="light"]) .input:hover:not(:focus):not([disabled]) { border-color: var(--muted); }
  :root:not([data-theme="light"]) .kpi-alert { border-color: color-mix(in srgb, var(--danger) 35%, var(--line)); }
  :root:not([data-theme="light"]) .topbar { background: color-mix(in srgb, var(--surface) 90%, transparent); }
  :root:not([data-theme="light"]) .avatar { color: var(--on-primary); }
  :root:not([data-theme="light"]) img { color-scheme: light; }
  :root:not([data-theme="light"]) .guest-brand { background: radial-gradient(120% 70% at 0% 0%, color-mix(in srgb, var(--brand) 85%, #fff 15%) 0%, transparent 60%),
      radial-gradient(90% 60% at 100% 100%, color-mix(in srgb, var(--saffron) 30%, transparent) 0%, transparent 62%), color-mix(in srgb, var(--brand) 70%, #000); }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --paper: #0F1416; --surface: #171D20; --surface-2: #1B2226; --head-bg: #1B2226;
  --ink: #E3E9EA; --muted: #98A6AA; --line: #2E373B; --line-soft: #252D31;
  --petrol: color-mix(in srgb, var(--brand) 42%, #E2F0F2);
  --petrol-deep: color-mix(in srgb, var(--brand) 72%, #000);
  --petrol-soft: color-mix(in srgb, var(--brand) 32%, #171D20);
  --on-primary: #0F1416; --ring: color-mix(in srgb, var(--brand) 55%, transparent);
  --saffron-soft: color-mix(in srgb, var(--saffron) 22%, #171D20); --accent-ink: color-mix(in srgb, var(--saffron) 70%, #fff);
  --danger: #EC8A78; --danger-soft: #3B2421; --success: #6FCB9F; --success-soft: #1C3328; --warning-soft: #3A3121;
  --shadow-1: 0 1px 2px rgba(0, 0, 0, .45); --shadow-2: 0 14px 34px -10px rgba(0, 0, 0, .7), 0 2px 6px rgba(0, 0, 0, .4);
  --sb-bg: color-mix(in srgb, var(--brand) 22%, #0B0F11); --sb-ink: #C8D3D5; --sb-strong: #FFFFFF; --sb-muted: #8C9CA0; --sb-dim: #7D8D91;
  --sb-hover: rgba(255, 255, 255, .06); --sb-active: rgba(255, 255, 255, .1); --sb-active-ink: #FFFFFF; --sb-line: rgba(255, 255, 255, .07); --sb-edge: #222A2E;
}
:root[data-theme="dark"] .notif-list li.unread a { background: var(--saffron-soft); }
:root[data-theme="dark"] .gantt-name, .g-line { border-color: var(--line-soft); }
:root[data-theme="dark"] .cal-day.is-out, .cal-day.is-weekend, .board-col { background: var(--head-bg); }
:root[data-theme="dark"] .wl-l1 { background: color-mix(in srgb, var(--petrol-soft) 60%, transparent); }
:root[data-theme="dark"] .wl-l2 { background: var(--petrol-soft); }
:root[data-theme="dark"] .input:hover:not(:focus):not([disabled]) { border-color: var(--muted); }
:root[data-theme="dark"] .kpi-alert { border-color: color-mix(in srgb, var(--danger) 35%, var(--line)); }
:root[data-theme="dark"] .topbar { background: color-mix(in srgb, var(--surface) 90%, transparent); }
:root[data-theme="dark"] .avatar { color: var(--on-primary); }
:root[data-theme="dark"] img { color-scheme: light; }
:root[data-theme="dark"] .guest-brand { background: radial-gradient(120% 70% at 0% 0%, color-mix(in srgb, var(--brand) 85%, #fff 15%) 0%, transparent 60%),
    radial-gradient(90% 60% at 100% 100%, color-mix(in srgb, var(--saffron) 30%, transparent) 0%, transparent 62%), color-mix(in srgb, var(--brand) 70%, #000); }

/* Choix de l'apparence (menu utilisateur) */
.theme-switch { display: flex; align-items: center; justify-content: space-between; gap: .6rem; padding: .55rem .6rem .35rem; margin-top: .25rem; border-top: 1px solid var(--line-soft); font-size: .86rem; color: var(--muted); }
.theme-options { display: inline-flex; border: 1px solid var(--line); border-radius: var(--radius-s); overflow: hidden; }
.user-panel .theme-options button { width: auto; padding: .25rem .55rem; font-size: .8rem; border-radius: 0; color: var(--muted); }
.user-panel .theme-options button + button { border-left: 1px solid var(--line); }
.user-panel .theme-options button[aria-pressed="true"] { background: var(--petrol-soft); color: var(--petrol); font-weight: 600; }

/* ---------- Graphiques des tableaux de bord (App\Core\Charts) ---------- */
.cols-summary { margin: -.35rem 0 1rem; font-size: .86rem; color: var(--muted); }
.cols { display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); gap: 4px; height: 200px; padding-top: 1.1rem; }
.col { position: relative; display: flex; flex-direction: column; min-width: 0; cursor: default; }
.col-plot { position: relative; flex: 1; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; border-bottom: 1px solid var(--line); }
.col-bar { height: var(--h); width: min(72%, 34px); min-height: 0; background: var(--petrol); opacity: .5; border-radius: 4px 4px 0 0; transition: opacity .12s; }
.col.is-current .col-bar, .col:hover .col-bar { opacity: 1; }
.col-val { font-size: .72rem; font-weight: 650; color: var(--ink); margin-bottom: 4px; white-space: nowrap; }
.col-label { margin-top: .4rem; font-size: .72rem; color: var(--muted); text-align: center; white-space: nowrap; overflow: hidden; }
.col.is-current .col-label { color: var(--ink); font-weight: 650; }
.col-tip {
  position: absolute; bottom: min(calc(var(--h) + 8px), calc(100% - 3.2rem)); left: 50%; transform: translateX(-50%); z-index: 5; display: grid; gap: .1rem;
  padding: .4rem .6rem; border-radius: var(--radius-s); background: var(--ink); color: var(--surface); font-size: .78rem; white-space: nowrap;
  box-shadow: var(--shadow-2); opacity: 0; pointer-events: none; transition: opacity .1s;
}
.col-tip strong { font-weight: 650; text-transform: capitalize; }
.col:nth-child(-n+2) .col-tip { left: 0; transform: none; }
.col:nth-last-child(-n+2) .col-tip { left: auto; right: 0; transform: none; }
.col:hover .col-tip { opacity: 1; }
.kpi-spark { display: block; width: 100%; height: 28px; margin-top: .45rem; overflow: visible; }
.kpi-spark-line { fill: none; stroke: var(--petrol); stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.kpi-spark-area { fill: var(--petrol); opacity: .1; }
@media (max-width: 560px) {
  .cols { height: 170px; gap: 2px; }
  .col-val { display: none; }
  .col:nth-child(even) .col-label { visibility: hidden; }
  .kpis { grid-template-columns: 1fr; gap: .75rem; }
  .kpi-value { font-size: 1.4rem; white-space: nowrap; }
}

/* ---------- Fil d'Ariane ---------- */
.breadcrumb ol { display: flex; flex-wrap: wrap; align-items: center; list-style: none; margin: 0 0 .55rem; padding: 0; font-size: .86rem; color: var(--muted); }
.breadcrumb li { display: inline-flex; align-items: center; min-width: 0; }
.breadcrumb li + li::before { content: "›"; margin: 0 .5rem; color: var(--muted); opacity: .6; }
.breadcrumb a { color: var(--muted); text-decoration: none; font-weight: 500; }
.breadcrumb a:hover { color: var(--petrol); text-decoration: underline; }
.breadcrumb [aria-current] { color: var(--ink); font-weight: 600; max-width: 36ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---------- Listes vides ---------- */
.empty-state { display: grid; justify-items: center; gap: .35rem; text-align: center; padding: 2.75rem 1.5rem 3rem; }
.empty-icon { display: grid; place-items: center; width: 52px; height: 52px; margin-bottom: .45rem; border-radius: 50%; background: var(--petrol-soft); color: var(--petrol); }
.empty-icon .icon { width: 24px; height: 24px; }
.empty-title { margin: 0; font-size: 1rem; font-weight: 650; color: var(--ink); }
.empty-text { margin: 0 0 .7rem; max-width: 46ch; font-size: .92rem; color: var(--muted); }

/* ---------- Impression des listes et des fiches ---------- */
@media print {
  :root:not([data-theme="light"]), :root[data-theme="dark"] {
    color-scheme: light;
    --paper: #FFFFFF; --surface: #FFFFFF; --surface-2: #F3F4F4; --head-bg: #F3F4F4; --ink: #111111; --muted: #555555; --line: #CCCCCC; --line-soft: #DDDDDD;
    --petrol: var(--brand); --petrol-soft: #ECEFEF; --on-primary: #FFFFFF; --saffron-soft: #F7EBD2; --accent-ink: #7A5410;
    --danger: #B3412E; --danger-soft: #F6E1DC; --success: #2F7D5B; --success-soft: #DCEFE5; --warning-soft: #F7EBD2;
  }
  @page { margin: 12mm; }
  body { background: #FFFFFF; font-size: 10.5pt; }
  .content { max-width: none; margin: 0; padding: 0; }
  .btn, .toolbar, .filter-chips, .pagination, .breadcrumb, .doc-head-actions, .menu-more, .form-actions, .toast-stack, .confirm-dialog,
  .col-tip, .theme-switch, .alert .btn, form.inline-form { display: none !important; }
  .panel, .doc-head, .kpi, .content > .toolbar { box-shadow: none !important; border-color: #CCCCCC; break-inside: avoid; }
  .panel.panel-flush { overflow: visible; }
  .table-wrap { overflow: visible !important; }
  .table thead { display: table-header-group; }
  .table thead th { position: static !important; box-shadow: none !important; }
  .table tr { break-inside: avoid; }
  .table td a, .doc-head-meta a { color: inherit; text-decoration: none; }
  .grid-2, .dash-grid { display: block; }
  .doc-figures .is-alert { background: none; }
  .col-bar, .kpi-spark, .badge, .tag, .qstatus, .istatus, .status { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  h1 { font-size: 16pt; }
}

/* ---------- Indicateurs : variation et définition ---------- */
.kpi-delta { display: block; font-size: .82rem; font-weight: 650; line-height: 1.4; }
.kpi-delta-val { white-space: nowrap; margin-right: .25rem; }
.kpis { grid-template-columns: repeat(auto-fill, minmax(min(100%, 235px), 1fr)); }
.kpi-value { font-size: 1.5rem; white-space: nowrap; }
.kpi-delta [aria-hidden] { font-size: .7rem; }
.kpi-delta.is-good { color: var(--success); }
.kpi-delta.is-bad { color: var(--danger); }
.kpi-delta.is-flat { color: var(--muted); }
.kpi-delta-label { font-weight: 400; color: var(--muted); }
.kpi-help { display: inline-grid; place-items: center; width: 14px; height: 14px; margin-left: .2rem; border-radius: 50%; border: 1px solid currentColor;
            font-size: .6rem; font-weight: 700; text-transform: none; opacity: .65; cursor: help; vertical-align: 1px; }
.kpi-label[title] { cursor: help; }

/* ---------- Feuilles de temps ---------- */
.time-status { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1rem; }
.tstatus-draft { background: var(--head-bg); color: var(--muted); border: 1px solid var(--line); }
.tstatus-submitted { background: var(--saffron-soft); color: var(--accent-ink); }
.tstatus-approved { background: var(--success-soft); color: var(--success); }
.tstatus-rejected { background: var(--danger-soft); color: var(--danger); }
.time-table { min-width: 860px; }
.time-table th.is-weekend, .time-table td.is-weekend { background: color-mix(in srgb, var(--head-bg) 60%, transparent); }
.time-table th.is-today { color: var(--petrol); }
.time-table td { vertical-align: middle; }
.time-table td:first-child { min-width: 230px; }
.time-table .time-new td:first-child { display: grid; gap: .3rem; }
.time-table .time-new .input-s { width: 100%; }
.time-cell { width: 4.2rem; min-height: 34px; padding: .3rem .4rem; text-align: right; font-variant-numeric: tabular-nums; }
.time-cell.is-invalid { border-color: var(--danger); box-shadow: 0 0 0 .18rem color-mix(in srgb, var(--danger) 20%, transparent); }
.time-cell.is-rejected { border-color: color-mix(in srgb, var(--danger) 55%, var(--line)); }
.time-locked { display: inline-block; min-width: 3.4rem; padding: .3rem .45rem; border-radius: var(--radius-s); text-align: right; font-weight: 600; }
.time-bill { text-align: center; width: 3rem; }
.time-row-total { font-weight: 650; white-space: nowrap; }
.time-table tfoot th { white-space: nowrap; }
.time-actions { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: .75rem 1.5rem; padding: 1rem 1.25rem; border-top: 1px solid var(--line-soft); }
.time-actions .hint { margin: 0; max-width: 60ch; }
.time-detail summary, .time-reject summary { cursor: pointer; font-size: .82rem; color: var(--muted); list-style: none; }
.time-detail summary::-webkit-details-marker, .time-reject summary::-webkit-details-marker { display: none; }
.time-detail ul { margin: .35rem 0 0; font-size: .84rem; }
.time-reject { display: inline-block; margin-left: .35rem; }
.time-reject[open] summary { display: none; }
.time-reject-form { display: flex; gap: .35rem; align-items: center; }
.time-rate-form { margin-bottom: 1.1rem; padding-bottom: 1.1rem; border-bottom: 1px solid var(--line-soft); }

/* ---- Contrats clients ------------------------------------------------- */
.alert-info { border-color: color-mix(in srgb, var(--petrol) 25%, transparent); border-left-color: var(--petrol); background: var(--petrol-soft); color: var(--ink); }
.ctr-status { display: inline-block; font-size: .78rem; font-weight: 600; padding: .1rem .55rem; border-radius: 10px; white-space: nowrap; }
.ctr-draft { background: var(--paper); color: var(--muted); border: 1px dashed var(--line); }
.ctr-active { background: var(--success-soft); color: var(--success); }
.ctr-suspended { background: var(--saffron-soft); color: var(--accent-ink); }
.ctr-terminated { background: var(--danger-soft); color: var(--danger); }
.ctr-expired { background: var(--paper); color: var(--muted); border: 1px solid var(--line); }
.ctr-sit { font-size: .86rem; color: var(--muted); }
.ctr-sit-to_decide, .ctr-sit-ending { color: var(--danger); font-weight: 600; }
.ctr-sit-terminating, .ctr-sit-suspended { color: var(--accent-ink); font-weight: 600; }
.ctr-sit-notice_passed { color: var(--ink); }
.ctr-banner { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .9rem; }
.ctr-banner .inline-form { display: inline-flex; align-items: center; gap: .6rem; margin: 0; }
.ctr-grid { align-items: start; }
.ctr-steps { list-style: none; margin: .2rem 0 0; padding: 0; position: relative; }
.ctr-steps::before { content: ""; position: absolute; left: 6px; top: .55rem; bottom: .55rem; width: 2px; background: var(--line); }
.ctr-steps li { position: relative; display: flex; justify-content: space-between; gap: 1rem; padding: .42rem 0 .42rem 1.6rem; }
.ctr-dot { position: absolute; left: 0; top: .72rem; width: 14px; height: 14px; border-radius: 50%; background: var(--surface); border: 2px solid var(--petrol); }
.ctr-steps li.is-past .ctr-dot { background: var(--petrol); }
.ctr-steps li.is-past .ctr-step-label { color: var(--muted); }
.ctr-steps li.is-key .ctr-dot { border-color: var(--saffron); box-shadow: 0 0 0 3px var(--saffron-soft); }
.ctr-steps li.is-key .ctr-step-label { font-weight: 600; }
.ctr-steps li.is-end .ctr-dot { border-color: var(--danger); background: var(--danger-soft); }
.ctr-steps li.is-next .ctr-dot { border-style: dashed; }
.ctr-steps li.is-next { color: var(--muted); }
.ctr-step-date { font-variant-numeric: tabular-nums; white-space: nowrap; color: var(--muted); }
.ctr-desc { margin-top: 1rem; padding-top: .9rem; border-top: 1px solid var(--line-soft); line-height: 1.55; }
.ctr-billing { padding: .8rem .9rem; border: 1px solid var(--line-soft); border-radius: var(--radius-s); margin-bottom: 1rem; }
.ctr-billing p { margin: .35rem 0; }
.ctr-billing .tag { margin-left: .4rem; }
.ctr-link { margin-top: .9rem; align-items: end; }
.ctr-link select { min-width: 16rem; }
.ctr-terminate summary { cursor: pointer; list-style: none; }
.ctr-terminate summary::-webkit-details-marker { display: none; }
.ctr-terminate summary h2 { display: inline; margin: 0; }
.ctr-terminate summary::after { content: "▸"; margin-left: .5rem; color: var(--muted); }
.ctr-terminate[open] summary::after { content: "▾"; }
.ctr-terminate[open] summary { margin-bottom: .8rem; }
.ctr-terminate .btn-danger { margin-top: .4rem; }
.menu-panel .is-danger, .menu-panel .is-danger:hover { color: var(--danger); }
.contract-preview { margin: .2rem 0 0; min-height: 1.2em; }
.contract-preview strong { color: var(--ink); }
.contract-form .field .seg { display: flex; width: fit-content; max-width: 100%; }
.contract-form .field > .label { display: block; font-weight: 600; margin-bottom: .35rem; }
.contract-form .seg-btn:focus-within { outline: 2px solid var(--focus-ring, var(--petrol)); outline-offset: -2px; }

/* ---- Aperçu : « À traiter » ------------------------------------------- */
.ov-todo { margin-bottom: 1.5rem; }
.ov-todo > h2 { font-size: 1rem; margin: 0 0 .8rem; }
.ov-todo-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: .6rem; }
.ov-todo-item { display: flex; align-items: center; gap: .8rem; padding: .65rem .8rem; border: 1px solid var(--line-soft); border-left: 4px solid var(--saffron);
  border-radius: var(--radius-s); background: var(--surface); color: var(--ink); text-decoration: none; height: 100%; }
.ov-todo-item.is-alert { border-left-color: var(--danger); }
a.ov-todo-item:hover { background: var(--head-bg); }
a.ov-todo-item:focus-visible { outline: 2px solid var(--petrol); outline-offset: 1px; }
.ov-todo-count { min-width: 2.2rem; text-align: center; font-size: 1.25rem; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--accent-ink); }
.ov-todo-item.is-alert .ov-todo-count { color: var(--danger); }
.ov-todo-text { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.ov-todo-text strong { font-size: .92rem; }
.ov-todo-text small { color: var(--muted); font-size: .8rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ov-todo-go { color: var(--muted); font-size: 1.3rem; line-height: 1; }
.ov-clear { margin: 0; color: var(--muted); display: flex; align-items: center; gap: .5rem; }
.ov-clear-icon { display: inline-grid; place-items: center; width: 1.5rem; height: 1.5rem; border-radius: 50%; background: var(--success-soft); color: var(--success); font-weight: 700; }
.ov-sub { padding: .9rem 1.2rem .3rem; align-items: baseline; }
.ov-sub h3 { margin: 0; font-size: .95rem; }
.ov-sub a { font-size: .86rem; }
.ov-section .panel-flush { margin-top: .2rem; }

/* ---- Accueil « Ma journée » ------------------------------------------- */
.myday-head h1 { margin-bottom: .2rem; }
.myday-date { color: var(--ink); font-weight: 600; }
.myday-grid { display: grid; grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr); gap: 1.2rem; align-items: start; }
@media (max-width: 960px) { .myday-grid { grid-template-columns: 1fr; } }
.myday-main, .myday-side { display: flex; flex-direction: column; gap: 1.2rem; min-width: 0; }
.myday-panel { margin: 0; }
.myday-title-row { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; margin-bottom: .6rem; }
.myday-title-row h2 { margin: 0; font-size: 1rem; }
.myday-title-row a { font-size: .86rem; white-space: nowrap; }
.myday-list { list-style: none; margin: 0; padding: 0; }
.myday-list > li { border-top: 1px solid var(--line-soft); }
.myday-list > li:first-child { border-top: 0; }
.myday-row { display: flex; align-items: center; gap: .75rem; padding: .55rem .25rem; color: var(--ink); text-decoration: none; min-width: 0; flex: 1; border-radius: var(--radius-s); }
a.myday-row:hover { background: var(--head-bg); }
a.myday-row:focus-visible { outline: 2px solid var(--petrol); outline-offset: -2px; }
.myday-kind { flex: none; font-size: .74rem; font-weight: 600; text-transform: uppercase; letter-spacing: .03em; color: var(--muted); min-width: 6.5rem; }
.myday-title { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .1rem; }
.myday-title small { font-size: .8rem; }
.myday-meta { flex: none; font-size: .82rem; color: var(--muted); white-space: nowrap; font-variant-numeric: tabular-nums; }
.myday-meta.is-late { color: var(--danger); font-weight: 600; }
.myday-task { display: flex; align-items: center; gap: .35rem; }
.myday-done { margin: 0; flex: none; }
.myday-check { width: 26px; height: 26px; display: grid; place-items: center; border: 1.5px solid var(--line); border-radius: 50%; background: var(--surface); color: transparent; cursor: pointer; padding: 0; }
.myday-check .icon { width: 15px; height: 15px; }
.myday-check:hover, .myday-check:focus-visible { border-color: var(--success); color: var(--success); background: var(--success-soft); outline: none; }
.myday-group { display: flex; align-items: center; gap: .4rem; margin: .8rem 0 .2rem; font-size: .78rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); }
.myday-group:first-of-type { margin-top: .2rem; }
.myday-group span { font-weight: 600; background: var(--head-bg); border-radius: 8px; padding: 0 .4rem; }
.myday-group.is-late { color: var(--danger); }
.myday-group.is-today { color: var(--accent-ink); }
.tag-prio { font-size: .7rem; vertical-align: middle; background: var(--danger-soft); color: var(--danger); }
.myday-empty { margin: 0; color: var(--muted); }
.myday-big { margin: 0 0 .4rem; font-size: 1.6rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.myday-big small { font-size: .85rem; font-weight: 500; color: var(--muted); }
.myday-small { margin: .45rem 0 0; font-size: .88rem; }
.myday-progress { display: block; width: 100%; }
.myday-warn { margin: .6rem 0 0; padding: .45rem .6rem; border-radius: var(--radius-s); background: var(--warning-soft); font-size: .86rem; }
.myday-notifs li.is-unread .myday-title { font-weight: 600; }
.myday-notifs li.is-unread .myday-row::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--petrol); flex: none; }
.myday-sub { margin: 1rem 0 .3rem; font-size: .82rem; color: var(--muted); font-weight: 600; }
.myday-logins { list-style: none; margin: 0; padding: 0; font-size: .85rem; }
.myday-logins li { display: flex; justify-content: space-between; gap: .5rem; padding: .2rem 0; }
.myday-line { display: block; }
.myday-line .tag { margin-left: .3rem; }
@media (max-width: 600px) {
  .myday-row { flex-wrap: wrap; row-gap: .15rem; }
  .myday-kind { min-width: 0; width: 100%; }
}

/* ---- Inventaire physique ---------------------------------------------- */
.cnt-status { display: inline-block; font-size: .78rem; font-weight: 600; padding: .1rem .55rem; border-radius: 10px; white-space: nowrap; }
.cnt-counting { background: var(--saffron-soft); color: var(--accent-ink); }
.cnt-validated { background: var(--success-soft); color: var(--success); }
.cnt-cancelled { background: var(--paper); color: var(--muted); border: 1px solid var(--line); }
.cnt-form { max-width: 820px; }
.cnt-scope { border: 0; padding: 0; margin: 0 0 1rem; display: flex; flex-direction: column; gap: .5rem; }
.cnt-scope legend { font-weight: 600; margin-bottom: .4rem; }
.cnt-scope .check-inline { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.cnt-scope select { max-width: 18rem; }
.cnt-tools { position: sticky; top: 62px; z-index: 5; background: var(--paper); flex-wrap: wrap; gap: .6rem; }
.cnt-tools input[type="search"] { flex: 1 1 18rem; }
.cnt-tools .seg-btn span { display: inline-block; min-width: 1.2rem; margin-left: .2rem; font-variant-numeric: tabular-nums; opacity: .8; }
.cnt-col-qty { width: 11rem; white-space: nowrap; }
.cnt-input { width: 7rem; text-align: right; font-variant-numeric: tabular-nums; display: inline-block; }
.cnt-input.is-invalid { border-color: var(--danger); box-shadow: 0 0 0 3px var(--danger-soft); }
.cnt-unit { margin-left: .35rem; color: var(--muted); font-size: .82rem; }
.cnt-note-input { min-width: 10rem; font-size: .86rem; }
.cnt-table tr.is-counted td:first-child { box-shadow: inset 3px 0 0 var(--success); }
.cnt-table tr.has-error td { background: var(--danger-soft); }
.cnt-plus { color: var(--success); font-weight: 600; }
.cnt-savebar { position: sticky; bottom: 0; z-index: 6; display: flex; justify-content: flex-end; align-items: center; gap: 1rem; padding: .75rem 1rem;
  margin-top: .8rem; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-m); box-shadow: var(--shadow-2); }
.cnt-sheet.is-dirty [data-cnt-dirty] { color: var(--accent-ink); font-weight: 600; }
.cnt-savebar.is-flash { box-shadow: 0 0 0 3px var(--saffron), var(--shadow-2); }
.cnt-review { margin-top: 1.5rem; border-left: 3px solid var(--petrol); }
.cnt-review fieldset { border: 0; padding: 0; margin: .8rem 0; display: flex; flex-direction: column; gap: .4rem; }
.cnt-review legend { font-weight: 600; margin-bottom: .3rem; }
.cnt-note { border-left: 3px solid var(--petrol); padding: .8rem 1rem; margin-bottom: 1rem; }
@media (max-width: 700px) {
  .cnt-col-note { display: none; }
  .cnt-col-qty { width: auto; }
  .cnt-input { width: 5.5rem; font-size: 1rem; }
  .cnt-tools { top: 56px; }
}
@media print {
  .cnt-tools, .cnt-savebar, .cnt-review, .doc-head-actions { display: none !important; }
  .cnt-table tr[hidden] { display: table-row !important; }
  .cnt-input, .cnt-note-input { border: 0; border-bottom: 1px solid #999; border-radius: 0; box-shadow: none; background: transparent; }
}

/* ---- Abonnements -------------------------------------------------------- */
.sub-badge { display: inline-block; font-size: .78rem; font-weight: 600; padding: .1rem .55rem; border-radius: 10px; white-space: nowrap; text-decoration: none; }
.sub-none { background: var(--paper); color: var(--muted); border: 1px solid var(--line); }
.sub-trial { background: var(--petrol-soft); color: var(--petrol); }
.sub-active, .sub-free { background: var(--success-soft); color: var(--success); }
.sub-renew { background: var(--saffron-soft); color: var(--accent-ink); }
.sub-grace, .sub-expired { background: var(--danger-soft); color: var(--danger); }
.sub-inv { display: inline-block; font-size: .78rem; font-weight: 600; padding: .1rem .55rem; border-radius: 10px; white-space: nowrap; }
.sub-inv-issued { background: var(--saffron-soft); color: var(--accent-ink); }
.sub-inv-paid { background: var(--success-soft); color: var(--success); }
.sub-inv-cancelled { background: var(--paper); color: var(--muted); border: 1px solid var(--line); }
.sub-inv-late { background: var(--danger-soft); color: var(--danger); }
.sub-banner { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem 1rem; padding: .65rem 1rem; margin-bottom: 1rem; border-radius: var(--radius-m);
  border: 1px solid var(--line); border-left: 4px solid var(--saffron); background: var(--warning-soft); font-size: .92rem; }
.sub-banner a { font-weight: 600; }
.sub-banner-trial { border-left-color: var(--petrol); background: var(--petrol-soft); }
.sub-banner-grace, .sub-banner-expired { border-left-color: var(--danger); background: var(--danger-soft); }
.sub-tabs { display: flex; gap: .3rem; margin: 0 0 1.2rem; border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.sub-tabs a { padding: .55rem .9rem; color: var(--muted); text-decoration: none; border-bottom: 2px solid transparent; margin-bottom: -1px; font-weight: 500; }
.sub-tabs a.is-active { color: var(--petrol); border-bottom-color: var(--petrol); }
.sub-strip { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .9rem; margin: 0 0 1rem; }
.plan-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1rem; }
.plan-card { display: flex; flex-direction: column; gap: .4rem; color: var(--ink); text-decoration: none; margin: 0; border-top: 4px solid var(--petrol); }
.plan-card:hover { box-shadow: var(--shadow-2); }
.plan-card.is-off { opacity: .65; border-top-color: var(--line); }
.plan-card h2 { margin: 0; }
.plan-card p { margin: 0; }
.plan-top { display: flex; justify-content: space-between; align-items: center; }
.plan-price strong { font-size: 1.35rem; }
.plan-mods { list-style: none; padding: 0; margin: .3rem 0; display: flex; flex-wrap: wrap; gap: .3rem; }
.plan-mods li { font-size: .8rem; background: var(--head-bg); border-radius: 8px; padding: .1rem .5rem; }
.plan-foot { margin-top: auto !important; font-size: .82rem; }
.sub-panel { margin-bottom: 1.2rem; border-left: 3px solid var(--petrol); }
.sub-head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem; align-items: flex-start; }
.sub-head h2 { margin: 0 0 .3rem; }
.sub-figures { display: flex; gap: 1.6rem; margin: 0; }
.sub-figures dt { font-size: .74rem; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); }
.sub-figures dd { margin: .1rem 0 0; font-weight: 700; font-size: 1.05rem; font-variant-numeric: tabular-nums; }
.sub-next { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: .8rem; margin: 1rem 0; padding: .8rem 1rem;
  background: var(--head-bg); border-radius: var(--radius-s); }
.sub-next .inline-form { display: flex; align-items: center; gap: .8rem; margin: 0; }
.sub-edit { margin: 1rem 0; border: 1px solid var(--line-soft); border-radius: var(--radius-s); padding: .6rem 1rem; }
.sub-edit > summary { cursor: pointer; font-weight: 600; color: var(--petrol); }
.sub-edit[open] > summary { margin-bottom: .9rem; }
.sub-checks { display: flex; flex-direction: column; gap: .4rem; margin: .4rem 0 1rem; }
.sub-actions { display: flex; flex-wrap: nowrap; gap: .35rem; align-items: center; justify-content: flex-end; }
.sub-actions .inline-form { margin: 0; display: inline-flex; }
.sub-actions .btn, .sub-pay > summary.btn { margin: 0; min-height: 2rem; }
.sub-pay { display: inline-block; position: relative; }
.sub-pay > summary { list-style: none; cursor: pointer; }
.sub-pay > summary::-webkit-details-marker { display: none; }
.sub-pay[open] > summary { box-shadow: 0 0 0 2px color-mix(in srgb, var(--petrol) 30%, transparent); }
.sub-pay-form { display: flex; flex-wrap: wrap; gap: .45rem; align-items: center; padding: .7rem; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-s); }
.sub-pay[open] > .sub-pay-form { position: absolute; right: 0; top: calc(100% + .4rem); z-index: 20; width: 19rem; box-shadow: 0 10px 28px rgba(0,0,0,.14); }
.sub-pay[open] > .sub-pay-form .input { width: 100%; min-width: 0; }
.sub-pay[open] > .sub-pay-form .btn { width: 100%; justify-content: center; }
.sub-pay-form .input { width: auto; min-width: 9rem; }
.table-wrap:has(details.sub-pay[open]) { overflow: visible; }
@media (max-width: 900px) {
  .sub-actions { flex-wrap: wrap; justify-content: flex-start; }
  .sub-pay[open] > .sub-pay-form { position: static; width: 16rem; box-shadow: none; margin-top: .4rem; }
}
.sub-panel .table td:last-child, .sub-panel .table th:last-child { text-align: right; }
.sub-panel .table td { vertical-align: middle; }
.sub-panel.tone-warn { border-left-color: var(--saffron); }
.sub-panel.tone-alert { border-left-color: var(--danger); }
.sub-figures dd small { display: block; font-size: .78rem; font-weight: 500; color: var(--muted); }
.sub-figures .tone-warn dd small { color: var(--accent-ink); }
.sub-figures .tone-alert dd, .sub-figures .tone-alert dd small { color: var(--danger); }
.sub-next-due { display: inline-flex; align-items: center; gap: .4rem; margin-top: .35rem; }
.sub-head-meta { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .5rem; margin: 0; }
.sub-head-meta .sep { color: var(--line); }
.sub-request { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.sub-request .inline-form { margin: 0 0 0 auto; }
.sub-payinfo { border-left: 3px solid var(--saffron); }
.myday-abo { border-top: 4px solid var(--success); }
.myday-abo.tone-warn { border-top-color: var(--saffron); }
.myday-abo.tone-alert { border-top-color: var(--danger); }
.myday-abo.tone-alert .myday-big { color: var(--danger); }
.myday-abo-plan { margin: 0 0 .4rem; display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.myday-abo.tone-warn .myday-abo-bar .progress-bar { background: var(--saffron); }
.myday-abo.tone-alert .myday-abo-bar .progress-bar { background: var(--danger); }
.myday-abo-cta { margin-top: .7rem; }
.myday-abo-note { margin-left: .4rem; font-weight: 600; color: var(--accent-ink); }
.myday-abo-note.tone-alert { color: var(--danger); }
.sub-banner-close { margin-left: auto; border: 0; background: transparent; color: var(--muted); font-size: 1.25rem; line-height: 1; cursor: pointer; padding: 0 .2rem; }
.sub-banner-close:hover, .sub-banner-close:focus-visible { color: var(--ink); }
.sub-banner.is-critical { font-weight: 600; }
.sub-banner.tone-warn { border-left-color: var(--saffron); background: var(--warning-soft); }
.sub-banner.tone-alert { border-left-color: var(--danger); background: var(--danger-soft); color: var(--ink); }
.sub-banner.tone-alert > span:first-child { font-weight: 600; }
.sub-banner.tone-ok { border-left-color: var(--petrol); background: var(--petrol-soft); }

/* ---- Déclaration mensuelle ---- */
.decl-nav { flex-wrap: wrap; align-items: center; }
.decl-nav .inline-form { display: inline-flex; }
.decl-filed { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; }
.decl-filed .inline-form { margin-left: auto; }
.decl-warn { margin: 0; padding-left: 1.1rem; }
.decl-grid { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 1.25rem; align-items: start; margin-top: 1.25rem; }
.decl-grid > div, .decl-grid > aside { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.25rem; min-width: 0; }
.decl-section h2, .decl-detail summary h2 { font-size: 1.05rem; margin: 0; padding: 1rem 1.25rem .5rem; }
.decl-table td.num, .decl-table th.num { white-space: nowrap; }
.decl-table .decl-c { width: 2.25rem; text-align: center; padding-left: 0; padding-right: .5rem; }
.decl-table .decl-sub td { border-top: 1px solid var(--line); }
.decl-table .decl-total td { border-top: 2px solid var(--line); background: color-mix(in srgb, var(--ink) 3%, transparent); font-weight: 600; }
.decl-table .decl-grand td { font-size: 1.05rem; }
.decl-link { font-size: .82rem; font-weight: 500; margin-left: .5rem; }
.decl-copy { display: inline-flex; align-items: center; justify-content: center; width: 1.75rem; height: 1.75rem; padding: 0; border: 1px solid transparent; border-radius: 6px; background: none; color: var(--muted); cursor: pointer; vertical-align: middle; }
.decl-copy svg { width: 15px; height: 15px; }
.decl-copy:hover, .decl-copy:focus-visible { color: var(--ink); border-color: var(--line); background: var(--surface); }
.decl-copy.is-copied { color: var(--success, #1f8a4c); border-color: currentColor; }
td.num .decl-copy { opacity: .55; }
td.num .decl-copy:hover, td.num .decl-copy:focus-visible { opacity: 1; }
.decl-inputs h2, .decl-help h2 { font-size: 1.05rem; margin: 0 0 .35rem; }
.decl-inputs .field { margin-top: .75rem; }
.decl-inputs .hint { margin: .25rem 0 0; font-size: .82rem; }
.decl-file { margin-top: 1.25rem; padding-top: 1rem; border-top: 1px solid var(--line); }
.decl-file h3 { font-size: .95rem; margin: 0 0 .5rem; }
.decl-file .form-grid { grid-template-columns: 1fr 1fr; gap: .75rem; }
.decl-file .btn { width: 100%; margin-top: .75rem; justify-content: center; }
.decl-help ul { margin: .25rem 0 0; padding-left: 1.1rem; font-size: .88rem; display: grid; gap: .35rem; }
.decl-help svg { width: 14px; height: 14px; vertical-align: -2px; }
.decl-detail { margin-top: 1.25rem; }
.decl-detail summary { cursor: pointer; list-style: none; }
.decl-detail summary::-webkit-details-marker { display: none; }
.decl-detail summary h2::before { content: '▸ '; color: var(--muted); }
.decl-detail[open] summary h2::before { content: '▾ '; }
.decl-detail .empty { padding: 0 1.25rem 1rem; }
@media (max-width: 960px) { .decl-grid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 600px) { .decl-table td, .decl-table th { padding-left: .5rem; padding-right: .5rem; } .decl-table td:first-child { min-width: 9rem; } td.num .decl-copy { display: none; } }

/* ---- Session d'assistance ---- */
.support-banner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem 1rem; padding: .6rem 1rem; margin-bottom: 1rem;
  border-radius: var(--radius-m); background: #0E4A55; color: #fff; font-size: .92rem; }
.support-banner.is-readonly { background: #123A42; }
.support-banner .btn { background: #fff; color: #0E4A55; border-color: #fff; }
.support-banner .inline-form { margin: 0; }
.support-panel .field { margin-bottom: .75rem; }
.support-hist { margin-top: 1rem; }
.support-list li { display: flex; flex-wrap: wrap; align-items: baseline; gap: .15rem .5rem; padding: .45rem 0; border-top: 1px solid var(--line); font-size: .88rem; }
.support-list li small { flex-basis: 100%; }
.support-list .tag { margin-left: auto; }

/* ---- Fichier TEJ (retenues à la source) ---- */
.tej-panel { margin: 1.25rem 0; }
.tej-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem 1rem; }
.tej-head h2 { margin: 0 0 .2rem; font-size: 1.05rem; }
.tej-head p { margin: 0; }
.tej-panel .alert { margin: .9rem 0 0; }
.tej-panel .alert ul { margin: .35rem 0 0; padding-left: 1.1rem; }
.tej-panel .hint { margin: .75rem 0 0; }
.sub-payonline { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; margin-top: .85rem; }
.sub-payonline .muted { font-size: .85rem; }
.pay-settings { margin-top: 1.25rem; }
.pay-settings fieldset { border: 0; padding: 0; margin: .5rem 0 .75rem; display: flex; flex-wrap: wrap; gap: .4rem 1.25rem; }
.pay-settings legend { font-weight: 600; margin-bottom: .35rem; width: 100%; }
.myday-pay { display: inline; margin-left: .5rem; }

/* ---- Vérification en deux étapes ---- */
.tfa-code { letter-spacing: .25em; font-size: 1.25rem; font-variant-numeric: tabular-nums; text-align: center; }
.tfa-code.is-backup { letter-spacing: .12em; }
.tfa-code::placeholder { letter-spacing: .25em; }
.tfa-code.is-backup::placeholder { letter-spacing: .12em; }
.tfa-help { display: grid; gap: .6rem; margin-top: 1.1rem; padding-top: 1rem; border-top: 1px solid var(--line); justify-items: start; }
.tfa-lost { font-size: .88rem; color: var(--muted); }
.tfa-lost summary { cursor: pointer; color: var(--muted); text-decoration: underline; text-decoration-color: var(--line); }
.tfa-lost[open] summary { margin-bottom: .35rem; color: var(--ink); }
.tfa-lost p { margin: 0; line-height: 1.5; }
.tfa-cancel { margin-top: 1rem; }
.tfa-cancel .btn-link { color: var(--muted); }

/* ---- Accueil « Ma journée » : en-tête, raccourcis, indicateurs ---- */
.myday-hero { display: flex; flex-direction: column; gap: 1.1rem; margin: 0 0 1.2rem; padding: 1.4rem 1.6rem; border-radius: var(--radius-m); border: 1px solid var(--line);
  background: radial-gradient(90% 160% at 100% 0%, color-mix(in srgb, var(--petrol) 11%, transparent) 0%, transparent 60%), var(--surface); }
.myday-hello { display: flex; align-items: center; gap: 1rem; min-width: 0; }
.myday-avatar { flex: none; width: 52px; height: 52px; border-radius: 50%; display: grid; place-items: center; font-weight: 700; font-size: 1.1rem; letter-spacing: .02em;
  background: var(--petrol); color: #fff; box-shadow: 0 0 0 4px color-mix(in srgb, var(--petrol) 15%, transparent); }
.myday-hello h1 { margin: 0; font-size: 1.65rem; line-height: 1.15; }
.myday-hero .myday-date { margin: 0 0 .1rem; font-size: .78rem; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); }
.myday-summary { margin: .3rem 0 0; color: var(--muted); }
.myday-shortcuts { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0; padding-top: 1rem; border-top: 1px solid var(--line-soft); }
.myday-shortcut { display: inline-flex; align-items: center; gap: .55rem; padding: .4rem .85rem .4rem .45rem; border: 1px solid var(--line); border-radius: 999px;
  background: var(--surface); color: var(--ink); text-decoration: none; font-size: .86rem; font-weight: 600; white-space: nowrap;
  transition: border-color .15s, box-shadow .15s, background .15s; }
.myday-shortcut:hover, .myday-shortcut:focus-visible { border-color: var(--petrol); background: color-mix(in srgb, var(--petrol) 6%, var(--surface)); box-shadow: 0 4px 12px color-mix(in srgb, var(--petrol) 14%, transparent); outline: none; }
.myday-shortcut-icon { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: color-mix(in srgb, var(--petrol) 12%, transparent); color: var(--petrol); }
.myday-shortcut-icon .icon { width: 16px; height: 16px; }

.myday-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: .8rem; margin: 0 0 1.2rem; }
.myday-stat { display: flex; align-items: flex-start; gap: .8rem; padding: 1rem 1.1rem; border-radius: var(--radius-m); border: 1px solid var(--line); background: var(--surface);
  color: var(--ink); text-decoration: none; transition: border-color .15s, box-shadow .15s; }
.myday-stat:hover, .myday-stat:focus-visible { border-color: color-mix(in srgb, var(--petrol) 45%, var(--line)); box-shadow: 0 4px 14px rgba(0,0,0,.06); outline: none; }
.myday-stat-icon { flex: none; width: 38px; height: 38px; border-radius: 10px; display: grid; place-items: center; background: var(--head-bg); color: var(--muted); }
.myday-stat-icon .icon { width: 19px; height: 19px; }
.myday-stat-body { display: flex; flex-direction: column; min-width: 0; }
.myday-stat-label { font-size: .74rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }
.myday-stat-value { font-size: 1.7rem; font-weight: 700; line-height: 1.15; font-variant-numeric: tabular-nums; }
.myday-stat-note { font-size: .8rem; color: var(--muted); }
.myday-stat.tone-ok .myday-stat-value { color: color-mix(in srgb, var(--ink) 55%, transparent); }
.myday-stat.tone-warn { border-color: color-mix(in srgb, var(--saffron) 55%, var(--line)); }
.myday-stat.tone-warn .myday-stat-icon { background: var(--saffron-soft); color: var(--accent-ink); }
.myday-stat.tone-alert { border-color: color-mix(in srgb, var(--danger) 45%, var(--line)); background: color-mix(in srgb, var(--danger-soft) 45%, var(--surface)); }
.myday-stat.tone-alert .myday-stat-icon { background: var(--danger-soft); color: var(--danger); }
.myday-stat.tone-alert .myday-stat-value { color: var(--danger); }
.myday-stat.tone-info .myday-stat-icon { background: color-mix(in srgb, var(--petrol) 12%, transparent); color: var(--petrol); }
.myday-stat.tone-info .myday-stat-value { color: var(--petrol); }

.myday-panel { border-radius: var(--radius-m); }
.myday-title-row { padding-bottom: .55rem; border-bottom: 1px solid var(--line-soft); margin-bottom: .55rem; }
.myday-abo { border-top-width: 3px; }
@media (max-width: 720px) {
  .myday-hero { padding: 1.1rem; }
  .myday-shortcut { flex: 1 1 calc(50% - .5rem); min-width: 0; white-space: normal; border-radius: 12px; }
  .myday-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .myday-stat { flex-direction: column; gap: .5rem; padding: .85rem; }
}

/* ---- Liens d'action en forme de bouton : « Tout voir », « Détails », « Profil », « Saisir », « Mes congés »…
   (en-têtes de blocs, encadrés d'alerte et classe .link-btn) ; les liens au fil d'une phrase restent des liens ---- */
.myday-title-row > a:not(.btn), .panel-title-row > a:not(.btn), .myday-warn a, .sub-banner > a, .link-btn {
  display: inline-flex; align-items: center; gap: .3rem; padding: .32rem .75rem; border: 1px solid var(--line); border-radius: var(--radius-s);
  background: var(--surface); color: var(--petrol); font-size: .82rem; font-weight: 600; line-height: 1.2; text-decoration: none; white-space: nowrap;
  transition: border-color .12s, background-color .12s, box-shadow .12s; }
.myday-title-row > a:not(.btn)::after, .panel-title-row > a:not(.btn)::after, .link-btn.is-next::after { content: "›"; font-size: 1.05em; line-height: 1; margin-left: .1rem; }
.myday-title-row > a:not(.btn):hover, .panel-title-row > a:not(.btn):hover, .myday-warn a:hover, .sub-banner > a:hover, .link-btn:hover,
.myday-title-row > a:not(.btn):focus-visible, .panel-title-row > a:not(.btn):focus-visible, .myday-warn a:focus-visible, .sub-banner > a:focus-visible, .link-btn:focus-visible {
  border-color: var(--petrol); background: var(--petrol-soft); color: var(--petrol); outline: none; box-shadow: 0 0 0 3px color-mix(in srgb, var(--petrol) 14%, transparent); }
.myday-title-row { align-items: center; }
.myday-warn a { margin: .1rem 0 0 .35rem; vertical-align: middle; padding: .2rem .6rem; font-size: .8rem; background: color-mix(in srgb, var(--surface) 70%, transparent); }
.sub-banner > a { padding: .25rem .7rem; }
.sub-banner.tone-alert > a { color: var(--danger); border-color: color-mix(in srgb, var(--danger) 40%, transparent); }
.link-btn + .link-btn { margin-left: .35rem; }

/* ---- Espace comptable et cabinet comptable ---- */
.acc-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: .8rem; margin: 0 0 1.2rem; }
.acc-stat { display: flex; flex-direction: column; gap: .15rem; padding: 1rem 1.1rem; border: 1px solid var(--line); border-radius: var(--radius-m); background: var(--surface); }
.acc-stat span { font-size: .74rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }
.acc-stat strong { font-size: 1.35rem; font-variant-numeric: tabular-nums; }
.acc-stat small { font-size: .8rem; color: var(--muted); }
.acc-stat.tone-ok strong { color: var(--success); }
.acc-stat.tone-warn strong { color: var(--accent-ink); }
.acc-downloads h2 { margin: 0 0 .8rem; font-size: 1.05rem; }
.acc-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: .6rem; }
.acc-tile { display: flex; align-items: flex-start; gap: .75rem; padding: .85rem 1rem; border: 1px solid var(--line); border-radius: var(--radius-s); background: var(--surface);
  color: var(--ink); text-decoration: none; transition: border-color .12s, box-shadow .12s; }
.acc-tile:hover, .acc-tile:focus-visible { border-color: var(--petrol); box-shadow: 0 4px 14px color-mix(in srgb, var(--petrol) 14%, transparent); outline: none; }
.acc-tile .icon { flex: none; width: 34px; height: 34px; padding: 8px; border-radius: 10px; background: color-mix(in srgb, var(--petrol) 12%, transparent); color: var(--petrol); }
.acc-tile span { display: flex; flex-direction: column; gap: .1rem; min-width: 0; }
.acc-tile strong { font-size: .92rem; }
.acc-tile small { font-size: .8rem; color: var(--muted); }
.acc-tile.is-main { border-color: var(--petrol); background: color-mix(in srgb, var(--petrol) 6%, var(--surface)); }
.acc-tile.is-main .icon { background: var(--petrol); color: #fff; }
.acc-grid { display: grid; grid-template-columns: minmax(0, 2.2fr) minmax(300px, 1fr); gap: 1.2rem; align-items: start; }
.acc-actions { display: flex; gap: .35rem; justify-content: flex-end; align-items: center; }
.acc-actions .inline-form { margin: 0; }
.acc-actions .btn, .acc-actions summary.btn { white-space: nowrap; }
.acc-grid .table td { vertical-align: middle; }
.acc-grid .panel h2 { margin-top: 0; }
@media (max-width: 960px) { .acc-grid { grid-template-columns: minmax(0, 1fr); } }

/* ---- Espaces liés (groupe de sociétés) ---- */
.space-badge { flex: none; width: 30px; height: 30px; border-radius: 8px; display: grid; place-items: center; font-size: .74rem; font-weight: 700;
  background: color-mix(in srgb, var(--petrol) 14%, transparent); color: var(--petrol); }
.spaces-list { list-style: none; margin: .4rem 0 0; padding: 0; }
.spaces-list li { display: flex; align-items: center; gap: .8rem; padding: .75rem 0; border-top: 1px solid var(--line-soft); }
.spaces-list li:first-child { border-top: 0; }
.spaces-list li.is-here .space-badge { background: var(--petrol); color: #fff; }
.spaces-list li.is-off { opacity: .65; }
.spaces-list .space-badge { width: 40px; height: 40px; font-size: .9rem; border-radius: 10px; }
.space-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .1rem; }
.space-body small { font-size: .8rem; color: var(--muted); }
.space-actions { display: flex; gap: .35rem; flex-wrap: wrap; justify-content: flex-end; }
.space-actions .inline-form { margin: 0; }
.input-suffix { display: flex; align-items: stretch; }
.input-suffix .input { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.input-suffix span { display: flex; align-items: center; padding: 0 .7rem; border: 1px solid var(--line); border-left: 0; border-radius: 0 var(--radius-s) var(--radius-s) 0;
  background: var(--head-bg); color: var(--muted); font-size: .88rem; white-space: nowrap; }
.space-switch { display: flex; flex-direction: column; gap: .15rem; padding: .35rem .2rem .6rem; margin-bottom: .35rem; border-bottom: 1px solid var(--line-soft); }
.space-switch > span:first-child { font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); padding: 0 .5rem .2rem; }
.space-switch form { margin: 0; }
.space-item { width: 100%; display: flex; align-items: center; gap: .55rem; padding: .4rem .5rem; border: 0; border-radius: var(--radius-s); background: none;
  color: var(--ink); font: inherit; font-size: .88rem; text-align: left; cursor: pointer; }
button.space-item:hover, button.space-item:focus-visible { background: var(--head-bg); outline: none; }
.space-item.is-here { cursor: default; font-weight: 600; }
.space-item.is-here .space-badge { background: var(--petrol); color: #fff; }
.space-item .icon { margin-left: auto; width: 16px; height: 16px; color: var(--success); }
.space-item > span:nth-child(2) { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---- Groupe de sociétés : vue consolidée et console -------------------------------- */
.grp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 330px), 1fr)); gap: 1rem; align-items: start; }
.grp-co { margin: 0; display: flex; flex-direction: column; gap: .7rem; }
.grp-co.is-here { border-color: var(--petrol); box-shadow: inset 3px 0 0 var(--petrol); }
.grp-co.is-locked { background: var(--head-bg); }
.grp-co-head { display: flex; align-items: center; gap: .6rem; min-width: 0; }
.grp-co .grp-co-head h2 { margin: 0; font-size: 1.05rem; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.grp-co-head form { margin: 0; }
.grp-co-head .space-badge { width: 34px; height: 34px; font-size: .8rem; flex: none; }
.grp-co.is-here .space-badge { background: var(--petrol); color: #fff; }
.grp-co-msg { margin: 0; color: var(--muted); font-size: .9rem; }
.grp-metrics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .55rem .9rem; margin: 0; }
.grp-metrics > div { padding: .55rem .7rem; border-radius: var(--radius-m); background: var(--head-bg); min-width: 0; }
.grp-metrics dt { font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); }
.grp-metrics dd { margin: .15rem 0 0; font-weight: 700; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.grp-metrics .tone-warn dd { color: var(--accent-ink); }
.grp-metrics .tone-alert dd, .acc-stat.tone-alert strong { color: var(--danger); }
.grp-co .hint { margin: 0; }
.grp-foot { margin-top: 1.2rem; }
.grp-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 340px); gap: 1rem; align-items: start; }
@media (max-width: 900px) { .grp-layout { grid-template-columns: minmax(0, 1fr); } }
.grp-head { display: flex; align-items: center; justify-content: space-between; gap: .8rem; margin-bottom: .6rem; }
.grp-head h2 { margin: 0; }
.grp-members { list-style: none; margin: 0 0 .8rem; padding: 0; display: flex; flex-direction: column; }
.grp-members li { display: flex; align-items: center; justify-content: space-between; gap: .8rem; padding: .55rem 0; border-top: 1px solid var(--line); }
.grp-members li:first-child { border-top: 0; }
.grp-members li > span { display: flex; flex-wrap: wrap; align-items: baseline; gap: .2rem .6rem; min-width: 0; }
.grp-members form { margin: 0; }
.grp-edit summary { cursor: pointer; color: var(--petrol); font-weight: 600; font-size: .9rem; }
.grp-edit[open] summary { margin-bottom: .7rem; }
.grp-delete { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; margin-top: .8rem; padding-top: .8rem; border-top: 1px solid var(--line); }
.grp-pick { display: flex; flex-wrap: wrap; gap: .5rem; margin: .4rem 0; }
.grp-pick .input { flex: 1; min-width: 180px; }
.grp-billing { margin: .2rem 0 .9rem; padding: .8rem .9rem; border: 1px solid var(--line); border-radius: var(--radius-m); background: var(--head-bg); }
.grp-billing.is-grouped { border-color: var(--petrol); }
.grp-billing .h-small { margin: 0 0 .5rem; }
.grp-billing-form { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .9rem; }
.grp-billing-form .input { flex: 1; min-width: 180px; max-width: 280px; }
.grp-billing-form .field-error { flex-basis: 100%; }
.grp-subs { list-style: none; margin: .8rem 0 .4rem; padding: 0; }
.grp-subs li { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .2rem .8rem; padding: .35rem 0; border-top: 1px dashed var(--line); font-size: .9rem; }
.grp-pending { margin: .5rem 0; font-size: .9rem; }
.grp-invoice { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; margin: .7rem 0 .4rem; }
.grp-billing .hint { margin: .3rem 0 0; }
/* ---- Console : tableau de bord de la plateforme ------------------------------------ */
a.acc-stat { color: inherit; text-decoration: none; transition: border-color .15s; }
a.acc-stat:hover { border-color: var(--petrol); }
.pd-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); gap: 1rem; align-items: start; }
@media (max-width: 900px) { .pd-grid { grid-template-columns: minmax(0, 1fr); } }
.pd-grid .panel { margin: 0; }
.pd-ok { display: flex; align-items: center; gap: .5rem; margin: 0; color: var(--success); font-weight: 600; }
.pd-ok .icon { width: 18px; height: 18px; }
.pd-todo { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .45rem; }
.pd-todo a { display: flex; align-items: center; justify-content: space-between; gap: .8rem; padding: .6rem .8rem; border-radius: var(--radius-m);
  border: 1px solid var(--line); border-left-width: 4px; color: inherit; text-decoration: none; font-size: .92rem; }
.pd-todo a:hover { background: var(--head-bg); }
.pd-todo .icon { width: 16px; height: 16px; flex: none; color: var(--muted); }
.pd-todo .tone-alert a { border-left-color: var(--danger); }
.pd-todo .tone-warn a { border-left-color: var(--saffron, #D9A23A); }
.pd-todo .tone-info a { border-left-color: var(--petrol); }
.pd-bars { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: clamp(2px, .8vw, .35rem); align-items: end; height: 170px; margin: .4rem 0 .6rem; }
.pd-bar { display: flex; flex-direction: column; justify-content: flex-end; align-items: stretch; height: 100%; min-width: 0; }
.pd-bar span { display: block; background: var(--petrol); opacity: .55; border-radius: 4px 4px 0 0; min-height: 0; }
.pd-bar.is-current span { opacity: 1; }
.pd-bar small { flex: none; height: 1.1rem; line-height: 1.1rem; margin-top: .3rem; font-size: .68rem; color: var(--muted); text-align: center; white-space: nowrap; overflow: hidden; }
.pd-usage { margin-top: 1rem; }
.pd-usage .panel-title-row { flex-wrap: wrap; }
.pd-idle td:first-child { box-shadow: inset 3px 0 0 var(--danger); }
.tag.tag-warn { background: var(--danger-soft); color: var(--danger); }
.pd-more { padding: .2rem 1.2rem 1rem; margin: 0; }
.pd-recent li { display: flex; flex-wrap: wrap; align-items: baseline; gap: .2rem .6rem; }
/* ---- Portail : inscription directe ---- */
.signup-recap { display: grid; gap: .5rem; margin: 0 0 1.2rem; padding: .8rem 1rem; border: 1px solid var(--line); border-radius: var(--radius-m); background: var(--head-bg); }
.signup-recap div { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .2rem 1rem; }
.signup-recap dt { color: var(--muted); font-size: .85rem; }
.signup-recap dd { margin: 0; font-weight: 600; overflow-wrap: anywhere; }
.signup-settings > summary { cursor: pointer; display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .5rem; }
.signup-settings[open] > summary { margin-bottom: .9rem; }
.signup-form { display: flex; flex-direction: column; gap: .7rem; }
.signup-form .check-inline { align-items: flex-start; }
.signup-form .btn { align-self: flex-start; }
.tag.tag-ok { background: var(--success-soft); color: var(--success); }
.rstatus-pending { background: var(--paper); color: var(--muted); border: 1px solid var(--line); }
.contact-sent .btn + .hint { margin-top: .9rem; }
/* ---- Lignes : nouvel article du catalogue depuis un document ---- */
.quick-product { max-width: min(38rem, 94vw); }
.quick-product .hint { margin: 0 0 .3rem; }
.qp-grid3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 560px) { .qp-grid3 { grid-template-columns: minmax(0, 1fr); } }
.quick-product .num-in { width: 100%; max-width: none; }
button.link-inline { background: none; border: 0; padding: .25rem 0 0; color: var(--petrol); font: inherit; font-size: .84rem; cursor: pointer; text-align: left; }
button.link-inline:hover { text-decoration: underline; }
.qp-class .input + .input { margin-top: 0; }
.qp-class { padding: .7rem .8rem .2rem; border: 1px solid var(--line); border-radius: var(--radius-m); background: var(--head-bg); }
.qc-exempt { display: flex; align-items: flex-end; padding-bottom: .55rem; }
.form-grid.grid-top { align-items: start; }
.no-validity { display: inline-flex; align-items: center; gap: .45rem; margin-top: .55rem; padding: .4rem .7rem; border: 1px solid var(--line); border-radius: var(--radius-m);
  background: var(--head-bg); font-weight: 600; font-size: .9rem; cursor: pointer; }
.no-validity input { width: 1.05rem; height: 1.05rem; margin: 0; accent-color: var(--petrol); }
.field.is-off .no-validity { border-color: var(--petrol); background: var(--petrol-soft); color: var(--petrol); }
.field.is-off input[type="date"] { opacity: .45; pointer-events: none; background: var(--head-bg); }
.field.is-off > .hint { display: none; }
.istatus-pending { background: var(--saffron-soft); color: var(--accent-ink); }
small.istatus-pending { margin-top: .25rem; font-size: .7rem; }
.doc-pending { display: flex; gap: .55rem; align-items: flex-start; margin: .2rem 0 .9rem; padding: .65rem .85rem; border-radius: var(--radius-m);
  background: var(--saffron-soft); color: var(--accent-ink); font-size: .9rem; }
.doc-pending .icon { width: 18px; height: 18px; flex: none; margin-top: .1rem; }
.reopen-box { margin-top: 1rem; padding: .8rem .9rem; border: 1px dashed var(--line); border-radius: var(--radius-m); background: var(--head-bg); }
.reopen-box p { margin: 0 0 .6rem; font-size: .9rem; }
.lock-choice { display: flex; flex-direction: column; gap: .6rem; align-items: flex-start; }
.lock-choice .check-inline { align-items: flex-start; }
.unlock-box { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--line); }
.unlock-box .h-small { margin: 0 0 .4rem; }
.unlock-form { display: flex; flex-direction: column; gap: .2rem; }
.unlock-form .btn { align-self: flex-start; margin-top: .3rem; }
/* =====================================================================
   Console plateforme : barre latérale par thème, barre du haut, liste et fiche des sociétés
   ===================================================================== */
body.platform .content { max-width: 1280px; }
.console-brand { text-decoration: none; color: inherit; }
.console-brand > span:last-child { display: flex; flex-direction: column; min-width: 0; }
.console-brand .tenant-mark { background: linear-gradient(135deg, var(--saffron), #EBC26E); font-size: 1.05rem; }
.console-account { display: flex; align-items: center; gap: .6rem; }
.console-avatar { width: 34px; height: 34px; flex: none; border-radius: 50%; display: grid; place-items: center; font-size: .78rem; font-weight: 700;
  background: rgba(255,255,255,.12); color: var(--sb-strong); }
.console-who { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.25; }
.console-who strong { color: var(--sb-strong); font-size: .86rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.console-who small { color: var(--sb-muted); font-size: .74rem; }
.console-account form { margin: 0; }
.console-out { color: var(--sb-ink); }
.console-out:hover { background: var(--sb-hover); color: var(--sb-strong); }
.console-topbar .global-search { max-width: 460px; }
.console-chip { font-size: .7rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; padding: .25rem .6rem; border-radius: 999px;
  background: var(--saffron-soft); color: var(--accent-ink); }
.console-topbar .btn { white-space: nowrap; }
@media (max-width: 640px) {
  .console-chip { display: none; }
  .console-topbar { gap: .5rem; padding: 0 .75rem; }
  .console-new-label { display: none; }
}
.filter-tabs a.active { background: var(--petrol); border-color: var(--petrol); color: #fff; }
.filter-tabs a.active span { color: rgba(255,255,255,.8); }
.tl-mrr { display: flex; flex-direction: column; align-items: flex-end; text-align: right; }
.tl-mrr span { font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); }
.tl-mrr strong { font-size: 1.3rem; font-variant-numeric: tabular-nums; }
.tl-mrr small { font-size: .78rem; color: var(--muted); }
.tl-table td { vertical-align: middle; }
.tl-name { display: flex; align-items: center; gap: .75rem; text-decoration: none; color: inherit; min-width: 220px; }
.tl-name strong { display: block; color: var(--petrol); }
.tl-name:hover strong { text-decoration: underline; }
.tl-name small { display: block; color: var(--muted); font-size: .8rem; }
.tl-mark { width: 36px; height: 36px; flex: none; border-radius: 9px; display: grid; place-items: center; font-weight: 700; font-size: .8rem;
  background: var(--petrol-soft); color: var(--petrol); }
tr.is-off .tl-mark { background: var(--paper); color: var(--muted); }
tr.is-off .tl-name strong { color: var(--muted); }
.tl-sub { display: flex; align-items: center; gap: .4rem; white-space: nowrap; }
.tl-table small.muted { display: block; font-size: .78rem; margin-top: .15rem; }
.tl-status { display: inline-flex; align-items: center; gap: .4rem; font-size: .85rem; font-weight: 600; color: var(--success); white-space: nowrap; }
.tl-status::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
.tl-status.is-off { color: var(--danger); }
@media (max-width: 640px) {
  .tl-table thead, .tl-table td.num { display: none; }
  .tl-table, .tl-table tbody { display: block; }
  .tl-table tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: .55rem .8rem; padding: .85rem 1rem; border-bottom: 1px solid var(--line); }
  .tl-table tr:last-child { border-bottom: 0; }
  .tl-table td { display: block; padding: 0; border: 0; }
  .tl-table td:first-child { grid-column: 1 / -1; }
  .tl-hide-sm { display: none; }
  .tl-mrr { align-items: flex-start; text-align: left; }
  .tl-name { min-width: 0; }
}
/* Fiche société (console) */
.ts-hero { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: "mark id actions" "facts facts facts";
  gap: 1rem 1.1rem; align-items: center; background: var(--surface); border: 1px solid var(--line); border-radius: 12px;
  padding: 1.3rem 1.5rem; box-shadow: var(--shadow-1); border-top: 4px solid var(--petrol); margin-bottom: .9rem; }
.ts-hero.is-off { border-top-color: var(--danger); }
.ts-mark { grid-area: mark; width: 56px; height: 56px; border-radius: 14px; display: grid; place-items: center; font-weight: 700; font-size: 1.15rem;
  background: var(--petrol); color: #fff; }
.ts-hero.is-off .ts-mark { background: var(--paper); color: var(--muted); }
.ts-id { grid-area: id; min-width: 0; }
.ts-id h1 { margin: 0 0 .25rem; font-size: 1.5rem; line-height: 1.2; overflow-wrap: anywhere; }
.ts-id p { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .9rem; font-size: .88rem; }
.ts-id p a { color: var(--petrol); overflow-wrap: anywhere; }
.ts-actions { grid-area: actions; display: flex; gap: .5rem; flex-wrap: wrap; justify-content: flex-end; }
.ts-facts { grid-area: facts; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; border-top: 1px solid var(--line); padding-top: .9rem; }
.ts-facts > div { padding: 0 1rem; border-left: 1px solid var(--line); min-width: 0; }
.ts-facts > div:first-child { padding-left: 0; border-left: 0; }
.ts-facts dt { font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); margin-bottom: .2rem; }
.ts-facts dd { margin: 0; font-size: 1.05rem; font-weight: 600; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.ts-facts dd small { font-size: .8rem; font-weight: 500; color: var(--muted); }
.ts-sub { color: var(--success); }
.ts-sub.is-trial, .ts-sub.is-renew, .ts-sub.is-grace { color: var(--accent-ink); }
.ts-sub.is-expired, .ts-sub.is-none { color: var(--danger); }
.ts-nav { position: sticky; top: var(--topbar-h); z-index: 5; display: flex; gap: .25rem; overflow-x: auto; scrollbar-width: none;
  background: color-mix(in srgb, var(--paper) 92%, transparent); backdrop-filter: blur(6px); padding: .5rem 0; margin-bottom: .9rem; border-bottom: 1px solid var(--line); }
.ts-nav::-webkit-scrollbar { display: none; }
.ts-nav a { flex: none; padding: .38rem .75rem; border-radius: 999px; font-size: .85rem; font-weight: 600; color: var(--muted); text-decoration: none; white-space: nowrap; }
.ts-nav a:hover { background: var(--surface); color: var(--petrol); }
.ts-nav a.is-danger { margin-left: auto; color: var(--danger); }
.ts-nav a.is-danger:hover { background: var(--danger-soft); }
[id="abonnement"], [id="modules"], [id="factures"], [id="options"], [id="utilisateurs"], [id="groupe"], [id="assistance"], [id="zone-sensible"] {
  scroll-margin-top: calc(var(--topbar-h) + 64px); }
.ts-grid { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 1rem; align-items: start; margin-top: 1rem; }
.ts-main, .ts-side { display: flex; flex-direction: column; gap: 1rem; min-width: 0; }
.ts-main > .panel, .ts-side > .panel { margin: 0; }
.check-list.ts-modules { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: .15rem 1rem; }
.check-list.ts-modules li { padding: .4rem .55rem; border-radius: var(--radius-m); }
.check-list.ts-modules li:hover { background: var(--paper); }
.ts-danger { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 1rem; margin-top: 1.5rem; padding-top: 1.25rem;
  border-top: 1px dashed #E6C3BB; }
.ts-danger > .panel { margin: 0; }
@media (max-width: 960px) {
  .ts-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 640px) {
  .ts-hero { grid-template-columns: auto minmax(0, 1fr); grid-template-areas: "mark id" "facts facts" "actions actions"; padding: 1rem; }
  .ts-mark { width: 46px; height: 46px; font-size: 1rem; }
  .ts-id h1 { font-size: 1.25rem; }
  .ts-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem 0; }
  .ts-facts > div:nth-child(3) { padding-left: 0; border-left: 0; }
  .ts-actions { justify-content: stretch; }
  .ts-actions .btn { flex: 1; justify-content: center; }
  .ts-danger { grid-template-columns: minmax(0, 1fr); }
}
/* Tableau de bord console : version mobile plus compacte */
@media (max-width: 640px) {
  .pd-stats { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: .6rem; }
  .pd-stats .acc-stat { padding: .8rem .9rem; min-width: 0; }
  .pd-stats .acc-stat strong { font-size: 1.1rem; overflow-wrap: anywhere; }
  .pd-stats .acc-stat:last-child { grid-column: 1 / -1; }
  .pd-usage .table thead { display: none; }
  .pd-usage .table, .pd-usage .table tbody { display: block; }
  .pd-usage .table tr { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .35rem .6rem; padding: .8rem 1rem; border-bottom: 1px solid var(--line); }
  .pd-usage .table td { display: block; padding: 0; border: 0; text-align: left; font-size: .85rem; }
  .pd-usage .table td:first-child { grid-column: 1 / -1; font-size: .95rem; }
  .pd-usage .table td:nth-child(2)::before { content: "Utilisateurs "; color: var(--muted); }
  .pd-usage .table td:nth-child(3)::before { content: "Connectés "; color: var(--muted); }
  .pd-usage .table td:nth-child(5)::before { content: "Actions "; color: var(--muted); }
  .pd-usage .table tr.pd-idle { box-shadow: inset 3px 0 0 var(--danger); }
  .pd-usage .table tr.pd-idle td:first-child { box-shadow: none; }
}
/* Console : pages secondaires (groupes, demandes, emails, mises à jour, avancement, abonnements) */
body.platform .content { max-width: 1440px; }
.cx-explain { margin: -.6rem 0 1.2rem; font-size: .9rem; max-width: 80ch; }
.cx-explain summary { cursor: pointer; color: var(--petrol); font-weight: 600; width: fit-content; }
.cx-explain p { margin: .5rem 0 0; color: var(--muted); }
.cx-empty { display: flex; align-items: center; gap: 1rem; padding: 1.6rem 1.4rem; color: var(--muted); }
.cx-empty p { margin: 0; }
.cx-empty strong { color: var(--ink); }
.cx-empty-icon { width: 46px; height: 46px; flex: none; display: grid; place-items: center; border-radius: 12px; background: var(--petrol-soft); color: var(--petrol); }
.cx-empty-icon svg { width: 22px; height: 22px; }
.cx-pill { display: inline-flex; align-items: center; gap: .45rem; padding: .35rem .8rem; border-radius: 999px; font-size: .82rem; font-weight: 600; white-space: nowrap; }
.cx-pill::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
.cx-pill.is-ok { background: var(--success-soft); color: var(--success); }
.cx-pill.is-warn { background: var(--saffron-soft); color: var(--accent-ink); }
.cx-stats { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
.cx-inline-form { margin-top: 1.25rem; padding-top: 1.1rem; border-top: 1px solid var(--line); }
.cx-section { margin-top: 1rem; }
.cx-section .panel-title-row h2 { margin: 0; }
.hint code, .pay-settings code, .panel p code { overflow-wrap: anywhere; }
/* État du système (Mises à jour) */
.cx-health { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: .8rem; margin-bottom: 1rem; }
.cx-health-item { position: relative; display: flex; flex-direction: column; gap: .15rem; padding: 1rem 1.1rem 1rem 1.35rem; background: var(--surface);
  border: 1px solid var(--line); border-radius: var(--radius-m); box-shadow: var(--shadow-1); color: inherit; text-decoration: none; overflow: hidden; }
.cx-health-item::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--muted); }
.cx-health-item:hover { border-color: var(--petrol); }
.cx-health-item span { font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }
.cx-health-item strong { font-size: 1.1rem; }
.cx-health-item small { font-size: .8rem; color: var(--muted); }
.cx-health-item.is-ok::before { background: var(--success); }
.cx-health-item.is-ok strong { color: var(--success); }
.cx-health-item.is-warn::before { background: var(--saffron); }
.cx-health-item.is-alert::before { background: var(--danger); }
.cx-health-item.is-alert strong { color: var(--danger); }
.cx-health-item.is-info::before { background: var(--petrol); }
.cx-callout { border-left: 4px solid var(--danger); }
.cx-fold > summary { cursor: pointer; display: flex; align-items: center; flex-wrap: wrap; gap: .5rem; list-style: none; }
.cx-fold > summary::-webkit-details-marker { display: none; }
.cx-fold > summary::before { content: "▸"; color: var(--muted); transition: transform .15s; }
.cx-fold[open] > summary::before { transform: rotate(90deg); }
.cx-fold[open] > summary { padding-bottom: .7rem; margin-bottom: .8rem; border-bottom: 1px solid var(--line); }
.cx-cols { columns: 3 220px; column-gap: 2rem; }
.cx-cols li { break-inside: avoid; }
/* Groupes */
.grp-head { justify-content: flex-start; }
.grp-head h2, .panel .grp-head h2:not(:first-child) { flex: 1; min-width: 0; margin: 0; }
.grp-icon { width: 34px; height: 34px; flex: none; display: grid; place-items: center; border-radius: 9px; background: var(--saffron-soft); color: var(--accent-ink); }
.grp-icon svg { width: 18px; height: 18px; }
.grp-members li { justify-content: flex-start; }
.grp-members li .tl-name { flex: 1; min-width: 0; }
.grp-members .tl-mark { width: 32px; height: 32px; font-size: .74rem; }
.grp-new { position: sticky; top: calc(var(--topbar-h) + 1rem); }
.pick-list { list-style: none; margin: .3rem 0 0; padding: .3rem; border: 1px solid var(--line); border-radius: var(--radius-m); max-height: 260px; overflow-y: auto; background: var(--surface); }
.pick-list label { display: flex; align-items: center; gap: .6rem; padding: .4rem .5rem; border-radius: 6px; cursor: pointer; }
.pick-list label:hover { background: var(--paper); }
.pick-list label:has(input:checked) { background: var(--petrol-soft); }
.pick-list .tl-mark { width: 26px; height: 26px; font-size: .66rem; border-radius: 7px; }
.field > .label { display: block; font-weight: 600; font-size: .88rem; margin-bottom: .35rem; }
/* Demandes */
.rq-table tr.is-new td:first-child { box-shadow: inset 3px 0 0 var(--saffron); }
/* Avancement */
.rm-summary { display: grid; gap: .6rem; }
.rm-figures { display: flex; flex-wrap: wrap; gap: 2rem; }
.rm-figures div { display: flex; align-items: baseline; gap: .4rem; }
.rm-figures strong { font-size: 1.6rem; font-variant-numeric: tabular-nums; }
.rm-figures span { color: var(--muted); }
.rm-bar { height: 10px; border-radius: 999px; background: var(--paper); overflow: hidden; }
.rm-bar span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--petrol), #2C7F8C); }
.rm-summary p { margin: 0; font-size: .88rem; }
/* Nouvelle société */
.nt-form { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 1rem; align-items: start; }
.nt-form > .panel { margin: 0; }
.nt-actions { grid-column: 1 / -1; margin: 0; }
.check-list.nt-modules { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: .1rem .8rem; }
.check-list.nt-modules li { padding: .4rem .5rem; border-radius: var(--radius-m); }
.check-list.nt-modules li:hover { background: var(--paper); }
@media (max-width: 960px) {
  .nt-form, .grp-layout { grid-template-columns: minmax(0, 1fr); }
  .grp-new { position: static; }
}
@media (max-width: 640px) {
  .rq-table td:nth-child(3) { display: none; }
  .cx-empty { flex-direction: column; text-align: center; }
  .page-head-row .cx-pill { align-self: flex-start; }
}
body.platform .form-grid { align-items: start; }
@media (max-width: 640px) {
  .cx-stats, body.platform .kpis { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: .6rem; }
  .cx-stats .acc-stat:last-child:nth-child(odd), body.platform .kpis > :last-child:nth-child(odd) { grid-column: 1 / -1; }
  body.platform .kpi-value, .cx-stats .acc-stat strong { font-size: 1.15rem; overflow-wrap: anywhere; }
  body.platform .sub-tabs { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  body.platform .sub-tabs a { flex: none; white-space: nowrap; }
}
/* Console : Référencement */
.seo-preview { margin-top: 1rem; padding: 1rem 1.1rem; border: 1px solid var(--line); border-radius: var(--radius-m); background: var(--surface); font-family: Arial, sans-serif; max-width: 640px; }
.seo-preview-url { display: block; font-size: .8rem; color: #4d5156; }
.seo-preview strong { display: block; color: #1a0dab; font-size: 1.15rem; font-weight: 400; margin: .15rem 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.seo-preview p { margin: 0; color: #4d5156; font-size: .88rem; line-height: 1.45; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.seo-links li { padding: .3rem 0; }
.seo-steps { margin: 0; padding-left: 1.3rem; display: grid; gap: .55rem; }
.seo-steps code { overflow-wrap: anywhere; }
.seo-form .ts-side .form-actions { margin: 0; }

/* ---------- Listes longues avec recherche (combobox) ---------- */
.combo { position: relative; width: 100%; min-width: 0; }
.combo > .combo-input { width: 100%; }
.combo-native { position: absolute !important; width: 1px !important; height: 1px !important; opacity: 0; pointer-events: none; overflow: hidden; clip: rect(0 0 0 0); }
.combo-input { padding-right: 2rem; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2378868B' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='6'/%3E%3Cpath d='m20 20-4.5-4.5'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right .6rem center; background-size: 1rem; }
.combo-list { position: fixed; z-index: 60; max-width: min(560px, calc(100vw - 16px)); max-height: 300px; overflow-y: auto; margin: 0; padding: .3rem; list-style: none;
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-m); box-shadow: 0 10px 28px rgba(14,74,85,.16); }
.combo-list [role="option"] { padding: .45rem .6rem; border-radius: var(--radius-s); cursor: pointer; font-size: .92rem; line-height: 1.3; }
.combo-list [role="option"].is-active, .combo-list [role="option"]:hover { background: var(--petrol-soft); color: var(--petrol); }
.combo-list [aria-selected="true"] { font-weight: 650; }
.combo-list .combo-special { color: var(--muted); }
.combo-list .combo-group { padding: .5rem .6rem .2rem; font-size: .7rem; font-weight: 650; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.combo-list .combo-none { padding: .5rem .6rem; color: var(--muted); font-size: .9rem; }

/* ---------- Devis, factures : barre d'enregistrement fixe ---------- */
.form-actions.doc-bar { position: sticky; bottom: 0; z-index: 15; align-items: center; margin: 1rem -.25rem 0; padding: .7rem 1rem;
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-m); box-shadow: 0 -6px 20px rgba(14,74,85,.08); }
.doc-bar-total { margin-right: auto; color: var(--muted); font-size: .92rem; }
.doc-bar-total strong { color: var(--ink); font-size: 1.1rem; margin-left: .35rem; font-variant-numeric: tabular-nums; }
.lines-table .line-main textarea { overflow: hidden; resize: none; }

/* Champ facultatif replié (« Texte d'introduction » des devis) */
.field-toggle > summary { display: inline-flex; align-items: center; gap: .4rem; cursor: pointer; list-style: none; font-weight: 600; color: var(--petrol); font-size: .92rem; padding: .2rem 0; }
.field-toggle > summary::-webkit-details-marker { display: none; }
.field-toggle > summary::before { content: "+"; display: inline-grid; place-items: center; width: 1.2rem; height: 1.2rem; border-radius: 50%; background: var(--petrol-soft); font-weight: 700; }
.field-toggle[open] > summary::before { content: "−"; }
.field-toggle > summary .muted { font-weight: 400; }
.field-toggle > textarea { margin-top: .45rem; }

@media (max-width: 600px) {
  /* Barre d'enregistrement : une seule ligne (le retour se fait par le navigateur ou le fil d'Ariane) */
  .form-actions.doc-bar { flex-wrap: nowrap; padding: .55rem .75rem; margin-inline: -.5rem; border-radius: var(--radius-m) var(--radius-m) 0 0; }
  .form-actions.doc-bar .btn-ghost { display: none; }
  .doc-bar-total { font-size: .82rem; line-height: 1.2; }
  .doc-bar-total strong { display: block; margin: 0; font-size: 1rem; }
}

/* Fiche client : chiffres clés et sections vides compactes */
.client-kpis { margin-top: -.25rem; }
.panel.panel-empty { padding-top: .85rem; padding-bottom: .85rem; }
.panel.panel-empty h2 { margin-bottom: 0; padding-bottom: 0; border-bottom: 0; }
.panel.panel-empty .panel-title-row { padding: 0 !important; }
.panel.panel-empty > .empty, .panel.panel-empty > p.empty { padding: .2rem 0 0 !important; text-align: left; font-size: .88rem; color: var(--muted); }
.menu-more .menu-panel a[data-open-details] { cursor: pointer; }
.panel.panel-empty .panel-title-row .btn { padding: .3rem .7rem; font-size: .85rem; }
.page-head .menu-more > summary .icon { transform: rotate(90deg); width: .9rem; height: .9rem; transition: transform .15s; }
.page-head .menu-more[open] > summary .icon { transform: rotate(-90deg); }

/* Zone de suppression (compte bancaire…) */
.panel.danger-zone { border-color: color-mix(in srgb, var(--danger) 35%, var(--line)); }
.panel.danger-zone h2 { color: var(--danger); }
.fc-planned > summary { cursor: pointer; font-weight: 600; color: var(--petrol); padding: .4rem 0; }
.fc-planned[open] > summary { margin-bottom: .4rem; }

/* ---------- Trésorerie : prévision détaillée ---------- */
.fc-head { display: flex; flex-wrap: wrap; gap: .8rem 1.5rem; align-items: flex-end; justify-content: space-between; padding: 1.2rem 1.2rem .4rem; }
.fc-head h2 { margin: 0 0 .25rem; }
.fc-head .hint { margin: 0; max-width: 680px; }
.fc-level { display: flex; flex-wrap: wrap; gap: .8rem; margin: 0; align-items: end; }
.fc-level-f { display: grid; gap: .25rem; }
.fc-level label { font-size: .78rem; font-weight: 650; color: var(--muted); }
.fc-level .input { min-width: 300px; }
.fc-legend { display: flex; flex-wrap: wrap; gap: .4rem 1.2rem; padding: .2rem 1.2rem .8rem; font-size: .84rem; color: var(--muted); }
.fc-legend .fc-late { color: var(--danger); }
.fc-lvl { display: inline-block; padding: .05rem .45rem; border-radius: 999px; font-size: .72rem; font-weight: 650; white-space: nowrap; }
.fc-lvl-certain { background: var(--petrol-soft); color: var(--petrol); }
.fc-lvl-prevu { background: var(--saffron-soft, #FBF1DC); color: var(--accent-ink, #7A5A12); }
.fc-lvl-probable { background: var(--paper); color: var(--muted); border: 1px dashed var(--line); }
.fc-table .fc-week.has-detail { cursor: pointer; }
.fc-table .fc-week.has-detail:hover, .fc-table .fc-week[aria-expanded="true"] { background: var(--paper); }
.fc-table .fc-week:focus-visible { outline: 2px solid var(--ring); outline-offset: -2px; }
.fc-chev { display: inline-block; width: .9rem; color: var(--muted); transition: transform .15s; }
.fc-week[aria-expanded="true"] .fc-chev { transform: rotate(90deg); }
.fc-pos { color: var(--success, #1F7A4D); }
.fc-detail > td { background: var(--paper); padding: .2rem 1rem .8rem 2.2rem; }
.fc-items { width: 100%; border-collapse: collapse; font-size: .9rem; }
.fc-items td { padding: .45rem .6rem; border-bottom: 1px solid var(--line-soft, var(--line)); vertical-align: top; }
.fc-items tr:last-child td { border-bottom: 0; }
.fc-items .num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.fc-off { opacity: .55; }
.fc-origins tr.fc-empty td { color: var(--muted); }
.fc-origins tr.fc-empty strong { font-weight: 500; }
.fc-origins .fc-total td { font-weight: 700; border-top: 2px solid var(--line); }
.fc-origins + .fc-origins { margin-top: .6rem; }
.fc-notes { margin: .3rem 0 0; padding-left: 1.2rem; color: var(--muted); font-size: .9rem; display: grid; gap: .3rem; }
@media (max-width: 720px) { .fc-level .input { min-width: 0; } .fc-detail > td { padding-left: .6rem; } }
@media (max-width: 600px) {
  /* Prévision sur téléphone : semaine, variation nette et solde ; le détail (entrées et sorties) s'ouvre d'un toucher */
  .fc-table th:nth-child(2), .fc-table th:nth-child(3),
  .fc-table > tbody > tr > td:nth-child(2), .fc-table > tbody > tr > td:nth-child(3) { display: none; }
  .fc-table > tbody > tr.fc-detail > td { display: table-cell; }
  .fc-table .fc-week td:first-child small { display: none; }
  .fc-table .fc-week td:first-child { white-space: normal; }
  .panel-flush .fc-table th, .panel-flush .fc-table td { padding-left: .5rem; padding-right: .5rem; font-size: .84rem; }
  .fc-items td:nth-child(3), .fc-items td:nth-child(4) { display: none; }
  .fc-items td { white-space: normal; }
}

/* ---- Trésorerie : courbe du solde prévu et seuil d'alerte ---- */
.fc-curve .fc-head { margin-bottom: .4rem; }
.fc-ok { margin: 0 0 .6rem; color: var(--success); font-weight: 600; font-size: .9rem; }
.fc-chart { margin: .4rem 0 0; }
.fc-chart svg { display: block; width: 100%; height: auto; overflow: visible; }
.fc-chart .fc-grid { stroke: var(--line); stroke-width: 1; }
.fc-chart .fc-zero { stroke: var(--muted); }
.fc-chart .fc-axis { fill: var(--muted); font-size: 11px; font-family: var(--font); }
.fc-chart .fc-line { fill: none; stroke: var(--petrol); stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.fc-chart .fc-pt circle { fill: var(--petrol); stroke: var(--surface); stroke-width: 2; }
.fc-chart .fc-pt.is-low circle { fill: var(--danger); }
.fc-chart .fc-hit { fill: transparent; }
.fc-chart .fc-pt:hover circle, .fc-chart .fc-pt:focus circle { r: 6; }
.fc-chart .fc-pt:focus { outline: none; }
.fc-chart .fc-pt:focus .fc-hit { fill: var(--petrol-soft); opacity: .5; }
.fc-chart .fc-threshold { stroke: var(--danger); stroke-width: 1.5; stroke-dasharray: 6 4; }
.fc-chart .fc-threshold-l { fill: var(--danger); font-size: 11px; font-weight: 650; font-family: var(--font); }
.fc-chart .fc-danger-zone { fill: var(--danger-soft); opacity: .55; }
.fc-chart figcaption { margin-top: .3rem; }
.fc-threshold-form { display: flex; flex-wrap: wrap; gap: .8rem; align-items: end; margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--line); }
.fc-threshold-form .field { margin: 0; min-width: 200px; }
.fc-threshold-form .hint { flex-basis: 100%; margin: 0; }
@media (max-width: 720px) { .fc-chart { overflow-x: auto; -webkit-overflow-scrolling: touch; } .fc-chart svg { min-width: 560px; } .fc-chart figcaption { position: sticky; left: 0; } }
.fc-level .input.fc-short { min-width: 0; }
.fc-export { margin: .6rem 0 0; display: flex; flex-wrap: wrap; gap: .3rem .7rem; align-items: center; }
.fc-chart.is-dense .fc-pt:not(.is-low) circle { opacity: 0; }
.fc-chart.is-dense .fc-pt:hover circle, .fc-chart.is-dense .fc-pt:focus circle { opacity: 1; }
.fc-chart.is-dense .fc-pt.is-low circle { r: 3.5; }

/* ---- Trésorerie : portefeuille de chèques et d'effets ---- */
.col-check { width: 2.2rem; }
.badge-muted { background: var(--paper); color: var(--muted); border-color: transparent; }
.row-menu { position: relative; display: inline-block; }
.row-menu > summary { list-style: none; cursor: pointer; }
.row-menu > summary::-webkit-details-marker { display: none; }
.row-menu-panel { position: absolute; right: 0; top: calc(100% + 4px); z-index: 30; width: min(380px, 86vw); padding: .4rem .9rem .9rem; background: var(--surface);
  border: 1px solid var(--line); border-radius: var(--radius-m); box-shadow: 0 8px 24px rgba(16, 24, 40, .14); white-space: normal; }
.row-menu-panel p { margin: .7rem 0 .3rem; font-size: .88rem; }
.row-menu-panel .inline-grid { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; }
.row-menu-panel .input-s { flex: 1 1 8rem; min-width: 0; }
.remit-bar .inline-grid { display: flex; flex-wrap: wrap; gap: .8rem; align-items: end; }
.remit-bar .field { margin: 0; }
.slip { max-width: 900px; }
.slip-head { display: flex; justify-content: space-between; gap: 1.5rem; flex-wrap: wrap; margin-bottom: 1rem; }
.slip-sign { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; margin-top: 2.5rem; }
.slip-sign div { border-top: 1px solid var(--ink); padding-top: .4rem; font-size: .85rem; color: var(--muted); }
@media print { .no-print { display: none !important; } .slip { max-width: none; } .slip .panel { border: 0; padding: 0; } }
.rule-range { display: flex; gap: .5rem; }
.rule-range .input { min-width: 0; }
.fc-chart .fc-overdraft { fill: none; stroke: var(--ink); stroke-width: 1.5; stroke-dasharray: 2 4; opacity: .7; }
.fc-chart .fc-overdraft-l { fill: var(--muted); font-size: 11px; font-weight: 600; font-family: var(--font); }
.fc-chart .fc-pt.is-over circle { fill: var(--ink); stroke: var(--danger); stroke-width: 2.5; opacity: 1; }

/* ---- Trésorerie : scénarios « et si » (couleurs validées : contraste, daltonisme, clair et sombre) ---- */
:root { --scen-a: #2a78d6; --scen-b: #eb6834; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --scen-a: #3987e5; --scen-b: #d95926; } }
:root[data-theme="dark"] { --scen-a: #3987e5; --scen-b: #d95926; }
.scen-key { display: inline-block; width: 18px; height: 0; border-top: 2px solid var(--muted); margin-right: .45rem; vertical-align: middle; }
.scen-key-base { border-top-style: dashed; }
.scen-key-a { border-top-color: var(--scen-a); border-top-width: 3px; }
.scen-key-b { border-top-color: var(--scen-b); border-top-width: 3px; }
.scen-legend { display: flex; flex-wrap: wrap; gap: .4rem 1.2rem; font-size: .85rem; color: var(--ink); margin: .6rem 0 .2rem; }
.scen-legend i { display: inline-block; }
.scen-chart .scen-line { fill: none; stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.scen-chart .scen-line-base { stroke: var(--muted); stroke-dasharray: 5 4; }
.scen-chart .scen-line-a { stroke: var(--scen-a); stroke-width: 2.5; }
.scen-chart .scen-line-b { stroke: var(--scen-b); stroke-width: 2.5; }
.scen-chart .scen-end { font-size: 11px; font-weight: 650; font-family: var(--font); fill: var(--ink); }
.scen-chart .scen-dot { opacity: 0; stroke: var(--surface); stroke-width: 2; }
.scen-chart .scen-dot-base { fill: var(--muted); } .scen-chart .scen-dot-a { fill: var(--scen-a); } .scen-chart .scen-dot-b { fill: var(--scen-b); }
.scen-chart .scen-cross { stroke: var(--line); stroke-width: 1; opacity: 0; }
.scen-chart .scen-col:hover .scen-dot, .scen-chart .scen-col:focus .scen-dot, .scen-chart .scen-col:hover .scen-cross, .scen-chart .scen-col:focus .scen-cross { opacity: 1; }
.scen-chart .scen-col:focus { outline: none; }
.scen-sum td:first-child { color: var(--muted); }
.scen-adj { margin: 0 0 1rem; padding-left: 1.2rem; display: grid; gap: .45rem; }
.scen-adj .inline-form { display: inline; margin-left: .4rem; }
.scen-form { border-top: 1px solid var(--line); padding-top: 1rem; }
.scen-mini { margin: 0; font-size: .88rem; }

/* =====================================================================
   Trésorerie : mise en page en onglets, réglages en boutons, courbe, listes
   ===================================================================== */
.tr-head h1 { margin-bottom: .15rem; }
.tr-sub { margin: 0; font-size: 1rem; color: var(--muted); }
.tr-sub strong { color: var(--ink); font-size: 1.15rem; font-variant-numeric: tabular-nums; }
.tr-tools { width: min(320px, 90vw); padding: .4rem; display: grid; }
.tr-tools a { display: grid; gap: .05rem; padding: .55rem .7rem; border-radius: var(--radius-s); text-decoration: none; color: var(--ink); }
.tr-tools a:hover, .tr-tools a:focus-visible { background: var(--petrol-soft); }
.tr-tools small { color: var(--muted); font-size: .8rem; }

.tr-todo { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin: -.25rem 0 1.1rem; }
.tr-todo-label { font-size: .75rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); margin-right: .2rem; }
.tr-chip { display: inline-flex; align-items: center; gap: .35rem; padding: .35rem .75rem; border-radius: 999px; font-size: .86rem; font-weight: 600;
  text-decoration: none; color: var(--ink); background: var(--surface); border: 1px solid var(--line); }
.tr-chip:hover { border-color: var(--petrol); color: var(--petrol); }
.tr-chip.is-warn { background: var(--warning-soft); border-color: transparent; color: var(--accent-ink); }

.tr-settings { display: flex; flex-wrap: wrap; gap: .8rem 1.6rem; align-items: center; padding: .75rem 1rem; margin-bottom: .9rem;
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-m); }
.tr-seg-group { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }
.tr-seg-label { font-size: .78rem; font-weight: 650; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; cursor: help; }
.tr-seg { display: inline-flex; padding: 3px; gap: 2px; border-radius: 9px; background: var(--paper); border: 1px solid var(--line); }
.tr-seg a { padding: .32rem .75rem; border-radius: 7px; font-size: .86rem; font-weight: 600; color: var(--muted); text-decoration: none; white-space: nowrap; }
.tr-seg a:hover { color: var(--ink); }
.tr-seg a.is-on { background: var(--surface); color: var(--ink); box-shadow: 0 1px 2px rgba(16, 24, 40, .12), 0 0 0 1px var(--line); }

.tr-tabs { position: sticky; top: 0; z-index: 20; display: flex; gap: .2rem; overflow-x: auto; scrollbar-width: none;
  margin: 0 0 1.1rem; padding: .35rem 0 0; background: var(--paper); border-bottom: 1px solid var(--line); }
.tr-tabs::-webkit-scrollbar { display: none; }
.tr-tabs a { position: relative; padding: .6rem 1rem .7rem; font-weight: 650; font-size: .93rem; color: var(--muted); text-decoration: none; white-space: nowrap; }
.tr-tabs a:hover { color: var(--ink); }
.tr-tabs a.is-on { color: var(--petrol); }
.tr-tabs a.is-on::after { content: ""; position: absolute; left: .6rem; right: .6rem; bottom: -1px; height: 3px; border-radius: 3px 3px 0 0; background: var(--petrol); }
.tr-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--danger); vertical-align: 2px; margin-left: .25rem; }
.tr-pane { scroll-margin-top: 4rem; }
.tr-pane > .panel:last-child, .tr-pane > .tr-grid:last-child { margin-bottom: 0; }

.tr-chart-panel { padding-bottom: .8rem; }
.tr-chart-head { display: flex; justify-content: space-between; gap: 1rem 2rem; flex-wrap: wrap; align-items: flex-start; }
.tr-chart-head h2 { margin: 0 0 .2rem; }
.tr-figs { display: flex; gap: 1.8rem; margin: 0; flex-wrap: wrap; }
.tr-figs div { display: grid; gap: .1rem; }
.tr-figs dt { font-size: .72rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); }
.tr-figs dd { margin: 0; font-size: 1.15rem; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--ink); }
.tr-figs dd.is-late { color: var(--danger); } .tr-figs dd.fc-pos { color: var(--success); }
.tr-figs small { display: block; font-size: .78rem; font-weight: 500; color: var(--muted); }
.tr-chart { position: relative; margin-top: .6rem; }
.tr-chart svg { max-height: 340px; }
.tr-chart .fc-axis { font-size: 12px; }
.tr-chart .fc-line { stroke-width: 2.5; }
.tr-area-top { stop-color: var(--petrol); stop-opacity: .16; }
.tr-area-bottom { stop-color: var(--petrol); stop-opacity: 0; }
.tr-chart .tr-mark { fill: var(--surface); stroke: var(--petrol); stroke-width: 2.5; }
.tr-chart .tr-mark.is-low { stroke: var(--danger); }
.tr-chart .tr-mark-l, .tr-chart .tr-end-l { font-size: 12px; font-weight: 700; fill: var(--ink); font-family: var(--font); }
.tr-chart .tr-mark-l { fill: var(--muted); font-weight: 600; }
.tr-chart .fc-threshold-l, .tr-chart .fc-overdraft-l { font-size: 12px; }
.tr-chart .tr-cross { stroke: var(--line); stroke-width: 1; opacity: 0; }
.tr-chart .tr-dot-pt { fill: var(--petrol); stroke: var(--surface); stroke-width: 2; opacity: 0; }
.tr-chart .tr-col.is-low .tr-dot-pt { fill: var(--danger); opacity: 1; r: 4; }
.tr-chart .tr-col.is-over .tr-dot-pt { fill: var(--ink); stroke: var(--danger); opacity: 1; }
.tr-chart .tr-col:hover .tr-cross, .tr-chart .tr-col:focus .tr-cross, .tr-chart .tr-col:hover .tr-dot-pt, .tr-chart .tr-col:focus .tr-dot-pt { opacity: 1; }
.tr-chart .tr-col:focus { outline: none; }
.tr-tip { position: absolute; z-index: 5; pointer-events: none; min-width: 170px; padding: .5rem .7rem; border-radius: 8px; background: var(--surface);
  border: 1px solid var(--line); box-shadow: 0 8px 24px rgba(16, 24, 40, .16); font-size: .82rem; transform: translate(-50%, calc(-100% - 12px)); }
.tr-tip b { display: block; font-size: 1rem; font-variant-numeric: tabular-nums; }
.tr-tip small { color: var(--muted); }

.tr-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; margin-bottom: 1.25rem; align-items: start; }
.tr-grid > .panel { margin-bottom: 0; }
.tr-next-head { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; margin-bottom: .5rem; }
.tr-next-head h2 { margin: 0; }
.tr-next-head > strong { font-size: 1.05rem; font-variant-numeric: tabular-nums; white-space: nowrap; }
.tr-list { list-style: none; margin: 0; padding: 0; }
.tr-list li { display: grid; grid-template-columns: 5.6rem minmax(0, 1fr) auto; gap: .8rem; align-items: center; padding: .6rem 0; border-top: 1px solid var(--line); }
.tr-date { font-size: .8rem; font-weight: 700; color: var(--muted); text-transform: uppercase; letter-spacing: .02em; }
.tr-what { display: grid; min-width: 0; }
.tr-what strong { font-size: .93rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tr-what small { color: var(--muted); font-size: .8rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tr-what small a { color: inherit; }
.tr-amt { font-weight: 700; font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap; }
.tr-amt small { display: block; font-size: .72rem; font-weight: 600; color: var(--accent-ink); }
.tr-more { display: block; margin-top: .6rem; font-size: .85rem; }
.tr-empty { margin: .4rem 0 .2rem; }

.tr-pane-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; flex-wrap: wrap; padding: 1.2rem 1.2rem .6rem; }
.tr-pane-head h2 { margin: 0 0 .2rem; }
.tr-pane-head .hint { margin: 0; }
.tr-table td.num, .tr-table th.num, .fc-table td.num { font-variant-numeric: tabular-nums; }
.tr-table .tr-plan, .fc-table .tr-plan { display: block; font-size: .75rem; color: var(--muted); font-weight: 500; }
.fc-table tr.tr-today td { background: var(--paper); font-weight: 600; color: var(--muted); }
.fc-table tr.is-quiet td { color: var(--muted); padding-top: .4rem; padding-bottom: .4rem; }
.fc-table tr.is-quiet td strong { font-weight: 600; }
.fc-table tr.is-below td:first-child { box-shadow: inset 3px 0 0 var(--danger); }
.tr-foot { padding: .4rem 1.2rem 1rem; }
.tr-foot .hint { margin: .2rem 0; }
.tr-pill { display: inline-block; padding: .15rem .55rem; border-radius: 999px; font-size: .82rem; font-weight: 650; background: var(--paper); color: var(--ink); }
.tr-pill.is-bad { background: var(--danger-soft); color: var(--danger); }
.tr-pill.is-good { background: var(--success-soft); color: var(--success); }

.tr-orig-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .9rem; }
.tr-orig-list li { cursor: help; }
.tr-orig-top { display: flex; justify-content: space-between; gap: 1rem; align-items: baseline; }
.tr-orig-top .fc-lvl { margin-left: .3rem; }
.tr-bar { height: 6px; margin: .35rem 0 .25rem; border-radius: 3px; background: var(--paper); overflow: hidden; }
.tr-bar span { display: block; height: 100%; border-radius: 3px; }
.tr-bar .is-in { background: var(--success); } .tr-bar .is-out { background: var(--petrol); }
.tr-empty-list { margin: 1rem 0 0; padding-top: .8rem; border-top: 1px solid var(--line); }
.tr-add { padding: .4rem 1.2rem 1.2rem; }
.tr-add > summary { list-style: none; display: inline-flex; cursor: pointer; }
.tr-add > summary::-webkit-details-marker { display: none; }
.tr-add[open] > summary { margin-bottom: 1rem; }

@media (max-width: 900px) {
  .tr-grid { grid-template-columns: 1fr; }
  .tr-settings { gap: .7rem; }
  .tr-list li { grid-template-columns: 4.6rem minmax(0, 1fr) auto; }
}
@media (max-width: 720px) {
  .tr-chart { overflow-x: auto; }
  .tr-chart svg { min-width: 640px; }
  .tr-figs { gap: 1rem; }
  .tr-seg a { padding: .32rem .55rem; }
}
@media (max-width: 720px) {
  .tr-page .kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; }
  .tr-page .kpi { padding: .8rem .9rem; }
  .tr-page .kpi-value { font-size: .98rem; overflow-wrap: anywhere; }
  .tr-page .kpi-label { font-size: .68rem; }
  .tr-figs dd { font-size: 1rem; }
  .tr-figs div { flex: 1 1 40%; }
  .tr-list li { grid-template-columns: 3.6rem minmax(0, 1fr); gap: .2rem .6rem; }
  .tr-list .tr-amt { grid-column: 2; text-align: left; }
  .tr-what strong, .tr-what small { white-space: normal; }
  .tr-next-head { flex-wrap: wrap; }
  .tr-todo .tr-chip { font-size: .8rem; }
}

/* =====================================================================
   Paie
   ===================================================================== */
label.field > span:first-child { font-weight: 600; font-size: .86rem; color: color-mix(in srgb, var(--ink) 88%, var(--muted)); }
.panel-head-pad { padding: 1rem 1.2rem .4rem; }
.panel-head-pad h2 { margin: 0; }
.pay-status { display: inline-block; vertical-align: middle; font-size: .78rem; font-weight: 600; padding: .15rem .6rem; border-radius: 999px; letter-spacing: 0; white-space: nowrap; }
h1 .pay-status { font-size: .8rem; margin-left: .4rem; }
h2 .pay-status { font-size: .74rem; margin-left: .3rem; }
.pay-status-draft { background: var(--saffron-soft); color: var(--accent-ink); }
.pay-status-validated { background: var(--petrol-soft); color: var(--petrol); }
.pay-status-paid { background: var(--success-soft); color: var(--success); }
.pay-alert { display: flex; gap: 1rem; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.pay-top { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: 1.25rem; align-items: stretch; margin-bottom: 1.25rem; }
.pay-top .panel { margin-bottom: 0; }
.pay-new h2, .pay-last h2 { margin-top: 0; }
.pay-new-form { display: flex; gap: .75rem; align-items: end; flex-wrap: wrap; }
.pay-new-form .field { margin-bottom: 0; }
.pay-figs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; }
.pay-figs div { display: grid; gap: .2rem; padding: .75rem .9rem; background: var(--paper); border-radius: var(--radius-m); }
.pay-figs span { font-size: .8rem; color: var(--muted); }
.pay-figs strong { font-size: 1.1rem; font-variant-numeric: tabular-nums; }
.pay-links { list-style: none; margin: 0; padding: 0; display: grid; gap: .45rem; }
.pay-flow { margin: 0; padding-left: 1.1rem; display: grid; gap: .45rem; }
.pay-steps { list-style: none; display: flex; gap: 0; margin: 0 0 1.25rem; padding: 0; counter-reset: none; }
.pay-steps li { flex: 1; display: flex; align-items: center; gap: .6rem; position: relative; padding-right: 1rem; color: var(--muted); }
.pay-steps li:not(:last-child)::after { content: ""; flex: 1; height: 2px; background: var(--line); margin-left: .4rem; }
.pay-steps li.is-done:not(:last-child)::after { background: var(--petrol); }
.pay-steps li > span:last-child { display: grid; line-height: 1.25; }
.pay-steps small { font-size: .78rem; }
.pay-step-dot { flex: none; width: 1.9rem; height: 1.9rem; border-radius: 50%; display: grid; place-items: center; font-weight: 700; font-size: .85rem; border: 2px solid var(--line); background: var(--surface); }
.pay-steps li.is-done, .pay-steps li.is-current { color: var(--ink); }
.pay-steps li.is-done .pay-step-dot { background: var(--petrol); border-color: var(--petrol); color: var(--on-primary); }
.pay-steps li.is-current .pay-step-dot { border-color: var(--saffron); box-shadow: 0 0 0 3px var(--saffron-soft); }
.pay-cash h2 { margin-top: 0; }
.pay-cash-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .9rem; }
.pay-cash-grid > div { display: grid; gap: .2rem; padding: .8rem 1rem; border: 1px solid var(--line); border-left: 3px solid var(--petrol); border-radius: var(--radius-m); }
.pay-cash-grid strong { font-size: 1.15rem; font-variant-numeric: tabular-nums; }
.pay-cash-grid span { font-size: .85rem; color: var(--muted); }
.pay-cash-date { font-weight: 600; color: var(--petrol) !important; font-size: .8rem !important; text-transform: uppercase; letter-spacing: .04em; }
.pay-grid-head { display: flex; justify-content: space-between; gap: 1rem; align-items: baseline; flex-wrap: wrap; padding-bottom: .8rem; }
.pay-table td, .pay-table th { white-space: nowrap; }
.pay-table td:first-child { white-space: normal; min-width: 11rem; }
.pay-in { width: 5.2rem; padding: .3rem .45rem; min-height: 32px; text-align: right; }
.pay-in-l { width: 7.5rem; padding: .3rem .45rem; min-height: 32px; text-align: right; }
.pay-in-xs { width: 3.2rem; padding: .3rem .4rem; min-height: 32px; text-align: center; }
.pay-in-m { width: 7.5rem; padding: .3rem .4rem; min-height: 32px; }
.pay-in-rib { width: 13rem; padding: .3rem .45rem; min-height: 32px; font-variant-numeric: tabular-nums; }
.pay-grid-actions { display: flex; gap: 1rem; align-items: center; flex-wrap: wrap; padding: 1rem 1.2rem; border-top: 1px solid var(--line-soft); }
.pay-actions { display: flex; gap: .6rem; flex-wrap: wrap; }
.pay-pay-form { display: flex; gap: .75rem; align-items: end; flex-wrap: wrap; }
.pay-pay-form .field { margin-bottom: 0; }
.pay-reopen { margin-top: 1rem; }
tr.is-alert-row td { background: var(--danger-soft); }
tr.is-muted-row td { opacity: .55; }
.pay-c { text-align: center; }
.pay-el-wrap { max-height: 70vh; }
.pay-el th, .pay-el td { white-space: nowrap; vertical-align: middle; }
.pay-el th.pay-el-group { text-align: center; border-bottom: 1px solid var(--line); font-size: .78rem; }
.pay-el .pay-el-name { position: sticky; left: 0; background: var(--surface); z-index: 1; min-width: 11rem; white-space: normal; box-shadow: 1px 0 0 var(--line-soft); }
.pay-el thead .pay-el-name { background: var(--head-bg, var(--surface)); z-index: 2; }
.table.pay-el thead th { font-size: .72rem; max-width: 7.5rem; white-space: normal; line-height: 1.2; vertical-align: bottom; }
.pay-set-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; align-items: start; }
.pay-set-grid .panel { margin-bottom: 0; }
form + .pay-set-grid { margin-top: 1.25rem; }
.pay-fields { display: grid; grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr)); gap: 0 1rem; }
.pay-brackets td, .pay-brackets th { padding: .3rem .5rem; }
.pay-brackets .input { min-height: 32px; padding: .3rem .5rem; text-align: right; }
.pay-sticky-save { position: sticky; bottom: 0; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-m); margin-top: 1.25rem; z-index: 5; }
.pay-sim-form { display: flex; gap: .75rem; align-items: end; flex-wrap: wrap; }
.pay-sim-form .field { margin-bottom: 0; width: 10rem; }
.pay-sim-form .check-inline { margin: 0 0 .6rem; }
.pay-sim { margin-top: 1rem; }
.pay-items-table .input { min-height: 32px; padding: .3rem .5rem; }
.pay-slip-layout { display: grid; grid-template-columns: minmax(0, 360px) minmax(0, 1fr); gap: 1.25rem; align-items: start; }
.pay-slip-layout > .pay-slip-main:only-child { grid-column: 1 / -1; max-width: 900px; }
.pay-slip-side .panel h2 { margin-top: 0; }
.pay-slip-side .pay-fields { grid-template-columns: 1fr 1fr; }
.pay-items { list-style: none; margin: 0 0 1rem; padding: 0; display: grid; gap: .1rem; }
.pay-items li { display: grid; grid-template-columns: 1fr auto auto; gap: .6rem; align-items: center; padding: .45rem 0; border-bottom: 1px solid var(--line-soft); }
.pay-items li > span:first-child { display: grid; }
.pay-items .num { font-variant-numeric: tabular-nums; font-weight: 600; }
.pay-fixed { font-size: .72rem; color: var(--muted); border: 1px solid var(--line); border-radius: 999px; padding: .05rem .45rem; }
.pay-add { border-top: 1px solid var(--line-soft); padding-top: .8rem; }
.pay-add h3 { margin: 0 0 .6rem; font-size: .95rem; }
.pay-pos { align-self: center; font-variant-numeric: tabular-nums; }

/* Bulletin */
.pay-bulletin { background: #fff; color: #1a1a1a; border: 1px solid var(--line); border-radius: var(--radius-m); padding: 1.6rem 1.8rem; font-size: .9rem; }
.pay-bulletin + .pay-bulletin, .pay-b-draft + .pay-bulletin { margin-top: 1.5rem; }
.pay-b-head { display: flex; justify-content: space-between; gap: 1.5rem; flex-wrap: wrap; padding-bottom: 1rem; border-bottom: 2px solid #0E4A55; }
.pay-b-employer, .pay-b-title { display: grid; gap: .15rem; }
.pay-b-employer strong { font-size: 1.05rem; }
.pay-b-employer span, .pay-b-title span { font-size: .82rem; color: #555; }
.pay-b-title { text-align: right; }
.pay-b-title h2 { margin: 0; font-size: 1.25rem; color: #0E4A55; text-transform: uppercase; letter-spacing: .04em; }
.pay-b-title .pay-b-period { font-size: 1rem !important; font-weight: 700; color: #1a1a1a !important; }
.pay-b-emp { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .55rem 1rem; margin: 1rem 0; padding: .8rem 1rem; background: #F4F6F6; border-radius: 6px; }
.pay-b-emp div { display: grid; gap: .1rem; min-width: 0; }
.pay-b-emp dt { font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; color: #666; }
.pay-b-emp dd { margin: 0; overflow-wrap: anywhere; }
.pay-b-table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.pay-b-table th { text-align: left; font-size: .74rem; text-transform: uppercase; letter-spacing: .04em; color: #555; border-bottom: 1px solid #bbb; padding: .4rem .5rem; }
.pay-b-table td { padding: .38rem .5rem; border-bottom: 1px solid #e3e3e3; }
.pay-b-table .num { text-align: right; white-space: nowrap; }
.pay-b-table td small { color: #777; }
.pay-b-table tr.pay-b-sub td { font-weight: 700; background: #F4F6F6; }
.pay-b-table tr.pay-b-net td { font-weight: 700; font-size: 1rem; background: #E4EEEF; border-bottom: 2px solid #0E4A55; }
.pay-b-foot { display: flex; gap: 1.2rem; align-items: stretch; margin: 1rem 0; flex-wrap: wrap; }
.pay-b-netbox { display: grid; align-content: center; gap: .1rem; padding: .8rem 1.2rem; background: #0E4A55; color: #fff; border-radius: 6px; min-width: 13rem; }
.pay-b-netbox span { font-size: .78rem; text-transform: uppercase; letter-spacing: .05em; opacity: .85; }
.pay-b-netbox strong { font-size: 1.45rem; font-variant-numeric: tabular-nums; }
.pay-b-mini { flex: 1; display: grid; grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr)); gap: .5rem 1rem; margin: 0; }
.pay-b-mini div { display: grid; gap: .1rem; }
.pay-b-mini dt { font-size: .74rem; color: #666; }
.pay-b-mini dd { margin: 0; font-weight: 600; font-variant-numeric: tabular-nums; }
.pay-b-cols { display: grid; grid-template-columns: 3fr 2fr; gap: 1.2rem; }
.pay-b-small { font-size: .8rem; }
.pay-b-note { margin: 1rem 0 0; font-style: italic; color: #444; }
.pay-b-draft { text-align: center; color: var(--danger); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; font-size: .8rem; margin: .5rem 0 0; }
.pay-print { max-width: 900px; }

@media (max-width: 1100px) {
  .pay-slip-layout { grid-template-columns: 1fr; }
  .pay-top { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .pay-figs, .pay-cash-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pay-set-grid { grid-template-columns: 1fr; }
  .pay-b-emp { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pay-b-cols { grid-template-columns: 1fr; }
  .pay-bulletin { padding: 1rem; }
  .pay-b-title { text-align: left; }
  .pay-steps li { padding-right: .4rem; }
  .pay-steps small { display: none; }
}
@media (max-width: 480px) { .pay-cash-grid, .pay-figs { grid-template-columns: 1fr; } }
@media print {
  .pay-print { max-width: none; }
  .pay-bulletin { border: 0; padding: 0; font-size: 9.5pt; break-after: page; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .pay-bulletin:last-of-type { break-after: auto; }
  .pay-bulletin + .pay-bulletin, .pay-b-draft + .pay-bulletin { margin-top: 0; }
  .pay-b-table tr { break-inside: avoid; }
}

.pay-title { display: flex; align-items: center; gap: .7rem; flex-wrap: wrap; }
.pay-title h1 { margin: 0; }
.pay-cash .hint { margin: .9rem 0 0; }
.pay-table { font-size: .9rem; }
.pay-table th { font-size: .74rem; }

.pay-table td, .pay-table th { padding-left: .5rem; padding-right: .5rem; }
.pay-table .pay-in { width: 4.2rem; }
.pay-table .pay-in-a { width: 6rem; }
.pay-table td:first-child { min-width: 9.5rem; }

.pay-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.pay-kpis .kpi-value { font-size: clamp(1.05rem, 1.9vw, 1.45rem); white-space: nowrap; }
.table.pay-table th { white-space: normal; line-height: 1.2; vertical-align: bottom; }
.table.pay-table tfoot th { white-space: nowrap; }
.panel-flush .pay-table td, .panel-flush .pay-table th, .panel-flush .pay-el td, .panel-flush .pay-el th { padding-left: .45rem; padding-right: .45rem; }
.panel-flush .pay-table td:first-child, .panel-flush .pay-table th:first-child, .panel-flush .pay-el td:first-child, .panel-flush .pay-el th:first-child { padding-left: 1.1rem; }
.panel-flush .pay-table td:last-child, .panel-flush .pay-table th:last-child { padding-right: 1.1rem; }
.pay-table td:first-child { min-width: 8.5rem; }
@media (max-width: 760px) { .pay-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.pay-set-2 { grid-template-columns: 1fr; }
.pay-set-2 #simulation { max-width: 760px; }
.pay-items-table input[name="name"] { min-width: 12rem; }
.pay-items-table select { min-width: 7rem; }
@media (max-width: 1100px) { .pay-set-2 { grid-template-columns: 1fr; } }

.pay-item-actions { display: flex; gap: .35rem; flex-wrap: wrap; justify-content: flex-end; }
.pay-item-actions form { margin: 0; }
.pay-del { color: var(--danger); }
.pay-usage { white-space: nowrap; font-size: .85rem; }
.pay-status-off { background: var(--paper); color: var(--muted); border: 1px solid var(--line); }

.pay-status-late { background: var(--danger-soft); color: var(--danger); }
.pay-cnss td { vertical-align: top; }
.pay-cnss-pay { position: relative; }
.pay-cnss-pay > summary { list-style: none; cursor: pointer; }
.pay-cnss-pay > summary::-webkit-details-marker { display: none; }
.pay-cnss-pay[open] { flex-basis: 100%; }
.pay-cnss-form { display: flex; flex-wrap: wrap; gap: .6rem; align-items: end; margin-top: .6rem; justify-content: flex-end; }
.pay-cnss-form .field { margin: 0; width: 9.5rem; }
.pay-cnss-pay .hint { text-align: right; margin: .4rem 0 0; }
.pay-tx-match { border: 1px solid var(--line); border-left: 3px solid var(--success); border-radius: var(--radius-m); padding: .8rem 1rem; margin-bottom: 1rem; background: var(--success-soft); }
.pay-tx-match p { margin: 0 0 .5rem; }
.pay-tx-row { display: flex; gap: .8rem; align-items: center; justify-content: space-between; flex-wrap: wrap; padding: .35rem 0; }
.tx-pay { border-left: 3px solid var(--petrol); }

.pay-mailed { color: var(--success); }
.pay-validate { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
.pay-validate .check-inline { margin: 0; }
.pay-mail-box { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; padding: .6rem .9rem; margin-bottom: 1rem; border: 1px solid var(--line); border-radius: var(--radius-m); background: var(--paper); }
.pay-mail-box form { margin: 0; }

.loan-form { display: grid; grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr)); gap: 0 1rem; align-items: end; }
.loan-form .loan-wide { grid-column: span 2; }
.loan-form [hidden] { display: none; }
.loan-submit { padding-bottom: 1rem; }
.loan-bar { height: 4px; background: var(--petrol-soft); border-radius: 2px; margin: .3rem 0 .15rem auto; width: 6rem; overflow: hidden; }
.loan-bar span { display: block; height: 100%; background: var(--success); }
.loan-inst { display: flex; gap: .3rem; align-items: center; }
.loan-inst .input { width: 6.5rem; min-height: 30px; padding: .25rem .45rem; text-align: right; }
.loan-table td { vertical-align: top; }
@media (max-width: 600px) { .loan-form .loan-wide { grid-column: auto; } }

.panel-flush .loan-table td, .panel-flush .loan-table th { padding-left: .5rem; padding-right: .5rem; }
.panel-flush .loan-table td:first-child, .panel-flush .loan-table th:first-child { padding-left: 1.1rem; }
.loan-table .pay-item-actions { flex-direction: column; align-items: stretch; min-width: 7.5rem; }
.loan-table td:first-child { min-width: 9rem; }

.pay-exit-tag { display: inline-block; font-size: .72rem; font-weight: 600; color: var(--accent-ink); background: var(--saffron-soft); border-radius: 999px; padding: .05rem .5rem; margin-top: .15rem; }
.emp-cert { margin: 0 0 1rem; text-align: right; }

.loan-form .loan-full { grid-column: 1 / -1; }
.loan-form .check-inline.loan-full { margin: .2rem 0 .4rem; }

.decl-tx-row { display: flex; gap: .8rem; align-items: center; justify-content: space-between; flex-wrap: wrap; padding: .35rem 0 0; }

/* Budget de trésorerie */
.bud-table { font-size: .82rem; }
.bud-table .bud-label, .bud-table thead th:first-child { position: sticky; left: 0; background: var(--surface, #fff); z-index: 1; min-width: 12rem; text-align: left; }
.bud-table td, .bud-table th { padding: .45rem .5rem; white-space: nowrap; }
.bud-table small { font-size: .72rem; }
.bud-table .bud-group th { background: var(--surface-2, #F4F6F5); font-size: .75rem; text-transform: uppercase; letter-spacing: .04em; color: var(--muted, #5E6F75); position: static; }
.bud-table .bud-cur { background: color-mix(in srgb, var(--petrol, #0E4A55) 6%, transparent); }
.bud-edit .bud-in { width: 6.2rem; padding: .3rem .4rem; text-align: right; font-size: .82rem; }
.bud-pct { width: 4.5rem; display: inline-block; margin: 0 .3rem; }
.bud-prefill { display: flex; align-items: center; flex-wrap: wrap; gap: .3rem; }
.panel-foot-pad { padding: .8rem 1.2rem 1rem; }
.bud-table .bud-label { font-weight: 600; }
.bud-table tfoot th { text-transform: none; letter-spacing: 0; font-size: .82rem; }
.pay-import { display: flex; gap: .6rem; flex-wrap: wrap; align-items: center; margin-top: .6rem; }
.pay-import input[type="file"] { max-width: 22rem; }
.bud-table .bud-sub td { font-size: .76rem; color: var(--muted, #5E6F75); padding-top: .25rem; padding-bottom: .25rem; }
.bud-table .bud-sub .bud-label { font-weight: 400; padding-left: 1.6rem; }
.bud-table .bud-link { color: inherit; text-decoration: none; border-bottom: 1px dotted currentColor; }
.bud-table .bud-link:hover { color: var(--petrol, #0E4A55); }
.bud-table .bud-sel { outline: 2px solid var(--petrol, #0E4A55); outline-offset: -2px; }
.emp-cert-sal { display: inline-flex; gap: .3rem; align-items: center; margin-left: .6rem; font-size: .85rem; color: var(--muted, #5E6F75); flex-wrap: wrap; }
.pay-b-cols > table:nth-child(3) { grid-column: 2; }
@media (max-width: 760px) { .pay-b-cols > table:nth-child(3) { grid-column: 1; } }
/* Clôture du mois */
.mc-summary p { margin: .6rem 0 0; }
.mc-list { list-style: none; margin: 0; padding: 0; }
.mc-item { display: flex; gap: .9rem; align-items: flex-start; padding: .8rem 1.2rem; border-top: 1px solid var(--line-soft, #E6EBEA); }
.mc-item a { color: inherit; text-decoration: none; }
.mc-item a:hover strong { text-decoration: underline; }
.mc-badge { flex: 0 0 auto; min-width: 5.6rem; text-align: center; font-size: .72rem; font-weight: 700; padding: .25rem .5rem; border-radius: 999px; text-transform: uppercase; letter-spacing: .03em; }
.mc-ok { background: var(--success-soft, #E3F2EA); color: var(--success, #1F7A4D); }
.mc-todo { background: var(--danger-soft, #F6E1DC); color: var(--danger, #B3412E); }
.mc-warn { background: var(--warning-soft, #F7EBD2); color: #8A5A00; }
.mc-na { background: var(--surface-2, #F3F4F4); color: var(--muted, #5E6F75); }