/* ═══════════ Carronova ═══════════ */
:root, [data-theme="light"] {
  --brand: #0E8A62; --brand-hover: #0B7452; --brand-txt: #0A6B4B; --brand-2: #17A777; --brand-deep: #08402F; --brand-hi: #34D399;
  --brand-soft: #DCF2E9; --brand-tint: #EEF8F3;
  --ink: #0F1A17; --ink-2: #4A5A54; --ink-3: #85948E;
  --line: #DCE5E1; --line-2: #EAF0ED; --bg: #F2F5F4; --card: #FFFFFF; --tint: #F6F9F8; --tint-2: #ECF2EF;
  --pos: #12855A; --pos-soft: #DFF3E8; --neg: #C2541A; --neg-soft: #FBEADF; --warn: #B7791F; --warn-soft: #FDF3DC;
  --side-bg: #0D1412; --side-line: #1B2622;
  --radius: 14px; --radius-sm: 9px;
  --shadow: 0 1px 2px rgba(8, 40, 30, .06), 0 4px 16px rgba(8, 40, 30, .06);
  --font: 'Jost', 'Futura', 'Century Gothic', system-ui, sans-serif;
  --sidebar: 248px; color-scheme: light;
}
[data-theme="dark"] {
  --brand: #13A372; --brand-hover: #0F8C61; --brand-txt: #4ADE9F; --brand-2: #1DBF86; --brand-deep: #06291E; --brand-hi: #4ADE9F;
  --brand-soft: rgba(29, 191, 134, .16); --brand-tint: rgba(29, 191, 134, .08);
  --ink: #E6EEEB; --ink-2: #A7B6B0; --ink-3: #74847E;
  --line: #24312C; --line-2: #1C2723; --bg: #0A0E0D; --card: #111816; --tint: #141C19; --tint-2: #18221F;
  --pos: #3DD68C; --pos-soft: rgba(61, 214, 140, .13); --neg: #FF8F57; --neg-soft: rgba(255, 143, 87, .13); --warn: #F2B84B; --warn-soft: rgba(242, 184, 75, .13);
  --side-bg: #080B0A; --side-line: #18211E;
  --shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 6px 20px rgba(0, 0, 0, .28);
  color-scheme: dark;
}
/* papier (aperçus devis, impressions) : toujours clair */
.fxp, .pd, .pd-doc, .fx-tpl-mini, #print-root {
  --ink: #0F1A17; --ink-2: #4A5A54; --ink-3: #85948E; --line: #DCE5E1; --line-2: #EAF0ED; --card: #FFFFFF; --tint: #F6F9F8; --tint-2: #ECF2EF; --bg: #FFFFFF;
  --brand: #0E8A62; --brand-txt: #0A6B4B; --brand-soft: #DCF2E9; --brand-tint: #EEF8F3; color: #0F1A17;
}
@media print { :root, [data-theme] { --ink: #0F1A17; --ink-2: #4A5A54; --ink-3: #85948E; --line: #DCE5E1; --line-2: #EAF0ED; --card: #FFFFFF; --tint: #F6F9F8; --tint-2: #ECF2EF; --bg: #FFFFFF; --brand: #0E8A62; --brand-txt: #0A6B4B; --brand-soft: #DCF2E9; --brand-tint: #EEF8F3; --pos-soft: #DFF3E8; --neg-soft: #FBEADF; --warn-soft: #FDF3DC; } body { background: #fff !important; color: #0F1A17; } }

* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; }
body {
  font-family: var(--font);
  color: var(--ink);
  background: var(--bg);
  font-size: 15px;
  line-height: 1.45;
  -webkit-font-smoothing: antialiased;
}
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
.ico { width: 20px; height: 20px; flex: none; stroke: currentColor; fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.ico.sm { width: 16px; height: 16px; }
.ico.lg { width: 26px; height: 26px; }
.muted { color: var(--ink-3); }
.pos { color: var(--pos); }
.neg { color: var(--neg); }
.hidden { display: none !important; }

/* ─────────── LOGIN ─────────── */
.login {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 32px 18px calc(32px + env(safe-area-inset-bottom));
  background:
    radial-gradient(1000px 560px at 12% -12%, rgba(19,163,114,.35) 0%, transparent 60%),
    radial-gradient(800px 480px at 110% 110%, rgba(19,163,114,.22) 0%, transparent 60%),
    #0B0F0E;
  color: #fff;
}
.login-box { width: 100%; max-width: 440px; text-align: center; }
.login-logo { width: 230px; max-width: 70%; margin: 0 auto 6px; display: block; }
.login-sub { font-weight: 300; letter-spacing: .14em; text-transform: uppercase; font-size: 12px; opacity: .75; margin-bottom: 28px; }
.login-card {
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 20px;
  padding: 22px;
  backdrop-filter: blur(6px);
}
.login-card h2 { margin: 0 0 16px; font-weight: 500; font-size: 18px; }
.user-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: 10px; }
.user-tile {
  background: rgba(255,255,255,.1);
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 14px;
  padding: 14px 8px 12px;
  color: #fff;
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  transition: background .15s, transform .1s;
}
.user-tile:hover { background: rgba(255,255,255,.18); }
.user-tile:active { transform: scale(.97); }
.avatar {
  width: 44px; height: 44px; border-radius: 50%;
  display: grid; place-items: center;
  background: var(--card); color: var(--brand); font-weight: 600; font-size: 16px;
}
.user-tile .nm { font-weight: 500; font-size: 14px; line-height: 1.2; }
.user-tile .rl { font-size: 11px; opacity: .7; text-transform: uppercase; letter-spacing: .08em; }

.pin-head { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; text-align: left; }
.pin-head .back { background: none; border: 0; color: #fff; padding: 6px; border-radius: 8px; opacity: .8; }
.pin-head .back:hover { opacity: 1; background: rgba(255,255,255,.1); }
.pin-dots { display: flex; justify-content: center; gap: 14px; margin: 6px 0 20px; }
.pin-dots span { width: 14px; height: 14px; border-radius: 50%; border: 2px solid rgba(255,255,255,.7); transition: background .12s; }
.pin-dots span.on { background: var(--card); border-color: #fff; }
.pin-dots.shake { animation: shake .35s; }
@keyframes shake { 20%,60% { transform: translateX(-8px); } 40%,80% { transform: translateX(8px); } }
.pin-pad { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; max-width: 280px; margin: 0 auto; }
.pin-pad button {
  height: 58px; border-radius: 14px; border: 1px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.1); color: #fff; font-size: 22px; font-weight: 500;
  display: grid; place-items: center;
}
.pin-pad button:hover { background: rgba(255,255,255,.18); }
.pin-pad button:active { background: rgba(255,255,255,.26); }
.pin-pad .ghost { background: none; border-color: transparent; }
.pin-err { min-height: 20px; margin-top: 12px; color: #FFD2BD; font-size: 13px; }
.demo-note { margin-top: 18px; font-size: 12.5px; opacity: .75; line-height: 1.5; }
.demo-note b { font-weight: 600; }

/* ─────────── SHELL ─────────── */
.shell { display: flex; min-height: 100vh; }
.sidebar {
  width: var(--sidebar); flex: none;
  background: var(--side-bg); border-right: 1px solid var(--side-line);
  color: #fff;
  display: flex; flex-direction: column;
  position: fixed; left: 0; top: 0; bottom: 0; z-index: 10;
  padding: 22px 14px 16px;
}
.sb-logo { padding: 4px 10px 22px; border-bottom: 1px solid rgba(255,255,255,.12); margin-bottom: 14px; }
.sb-logo img { width: 100%; max-width: 190px; display: block; }
.nav { display: flex; flex-direction: column; gap: 3px; flex: 1; overflow-y: auto; }
.nav-sec { font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; opacity: .5; padding: 14px 12px 6px; }
.nav button {
  display: flex; align-items: center; gap: 12px;
  border: 0; background: none; color: rgba(255,255,255,.82);
  padding: 10px 12px; border-radius: 10px; text-align: left; font-size: 14.5px; font-weight: 400;
  transition: background .12s, color .12s;
}
.nav button:hover { background: rgba(255,255,255,.08); color: #fff; }
.nav button.active { background: rgba(19,163,114,.18); color: #fff; font-weight: 500; box-shadow: inset 3px 0 0 var(--brand-hi); }
.nav button.active .ico { color: var(--brand-hi); }
.nav .badge { margin-left: auto; background: var(--card); color: var(--brand); font-size: 11.5px; font-weight: 600; border-radius: 999px; padding: 1px 8px; }
.sb-user { display: flex; align-items: center; gap: 10px; padding: 12px 8px 0; border-top: 1px solid rgba(255,255,255,.12); margin-top: 10px; }
.sb-user .avatar { width: 36px; height: 36px; font-size: 13px; }
.sb-user .who { flex: 1; min-width: 0; }
.sb-user .who b { display: block; font-weight: 500; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sb-user .who span { font-size: 11.5px; opacity: .65; }
.icon-btn { border: 0; background: none; color: inherit; padding: 8px; border-radius: 9px; display: grid; place-items: center; opacity: .85; }
.icon-btn:hover { background: rgba(255,255,255,.12); opacity: 1; }

.main { flex: 1; min-width: 0; padding: 28px 32px 48px; margin-left: var(--sidebar); }
.topbar { display: none; }
.page-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 22px; }
.page-head h1 { margin: 0; font-size: 26px; font-weight: 600; letter-spacing: -.01em; }
.page-head .sub { color: var(--ink-2); margin-top: 2px; }
.head-actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.demo-banner {
  background: var(--warn-soft); color: var(--warn); border: 1px solid var(--line);
  padding: 8px 14px; border-radius: 10px; font-size: 13px; margin-bottom: 18px;
  display: flex; align-items: center; gap: 10px;
}

/* ─────────── CARDS / TILES ─────────── */
.card { background: var(--card); border-radius: var(--radius); box-shadow: var(--shadow); padding: 20px; }
.card + .card { margin-top: 18px; }
.card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.card-head h3 { margin: 0; font-size: 16px; font-weight: 600; display: flex; align-items: center; gap: 8px; }
.card-head h3 .ico { color: var(--brand); }

.tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 14px; margin-bottom: 18px; }
.tile { background: var(--card); border-radius: var(--radius); box-shadow: var(--shadow); padding: 16px 18px; display: flex; gap: 14px; align-items: center; }
.tile .ti { width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; background: var(--brand-soft); color: var(--brand); flex: none; }
.tile .ti.pos { background: var(--pos-soft); color: var(--pos); }
.tile .ti.neg { background: var(--neg-soft); color: var(--neg); }
.tile .ti.warn { background: var(--warn-soft); color: var(--warn); }
.tile .tl { font-size: 12.5px; color: var(--ink-2); }
.tile .tv { font-size: 22px; font-weight: 600; line-height: 1.15; }

.grid-2 { display: grid; grid-template-columns: minmax(340px, 440px) 1fr; gap: 18px; align-items: start; }

/* Compteur */
.counter {
  border-radius: var(--radius); padding: 22px; color: #fff; position: relative; overflow: hidden;
  background: linear-gradient(140deg, var(--brand-2) 0%, var(--brand) 45%, var(--brand-deep) 100%);
  box-shadow: var(--shadow);
}
.counter::after {
  content: ''; position: absolute; right: -40px; bottom: -50px; width: 190px; height: 190px;
  background: url('assets/cn-mark.png') center / contain no-repeat; opacity: .10; border-radius: 40px;
}
.counter .cl { font-size: 12px; letter-spacing: .14em; text-transform: uppercase; opacity: .78; }
.counter .cv { font-size: 46px; font-weight: 600; line-height: 1.05; margin: 8px 0 4px; letter-spacing: -.02em; }
.counter .cs { display: inline-flex; align-items: center; gap: 6px; font-size: 13.5px; font-weight: 500; padding: 4px 11px; border-radius: 999px; background: rgba(255,255,255,.16); }
.counter .cs.pos { background: #CDEFDD; color: #12603D; }
.counter .cs.neg { background: #FADCC9; color: #8C3A0F; }
.counter .cd { font-size: 12.5px; opacity: .72; margin-top: 12px; }

/* Semaine */
.week { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; }
.wd {
  border: 1px solid var(--line); background: var(--card); border-radius: 10px;
  padding: 8px 4px; text-align: center; display: flex; flex-direction: column; gap: 2px; align-items: center;
  transition: border-color .12s, background .12s;
}
.wd:hover { border-color: var(--brand); }
.wd.sel { border-color: var(--brand); background: var(--brand-tint); box-shadow: inset 0 0 0 1px var(--brand); }
.wd.today .dn { color: var(--brand); font-weight: 600; }
.wd .dn { font-size: 11.5px; color: var(--ink-3); text-transform: uppercase; letter-spacing: .04em; }
.wd .dd { font-size: 15px; font-weight: 600; }
.wd .dh { font-size: 12px; color: var(--ink-2); min-height: 17px; }
.wd .dx { font-size: 11px; font-weight: 600; min-height: 15px; }
.wd .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--line); }
.wd .dot.ok { background: var(--brand); }
.wd .dot.miss { background: var(--neg); }
.wd .dot.off { background: transparent; }
.week-tot { display: flex; justify-content: space-between; gap: 10px; margin-top: 12px; font-size: 13.5px; color: var(--ink-2); flex-wrap: wrap; }
.week-tot b { color: var(--ink); font-weight: 600; }

/* ─────────── FORM ─────────── */
.date-nav { display: flex; align-items: center; gap: 8px; }
.date-nav .dl { flex: 1; text-align: center; font-weight: 600; font-size: 16px; text-transform: capitalize; }
.date-nav input[type=date] { position: absolute; opacity: 0; pointer-events: none; width: 0; height: 0; }
.nbtn {
  width: 38px; height: 38px; border-radius: 10px; border: 1px solid var(--line); background: var(--card);
  display: grid; place-items: center; color: var(--ink-2);
}
.nbtn:hover { border-color: var(--brand); color: var(--brand); }

.chips { display: flex; flex-wrap: wrap; gap: 7px; }
.chip {
  border: 1px solid var(--line); background: var(--card); color: var(--ink-2);
  border-radius: 999px; padding: 7px 13px; font-size: 13.5px; display: inline-flex; align-items: center; gap: 6px;
  transition: all .12s;
}
.chip:hover { border-color: var(--brand); color: var(--brand); }
.chip.on { background: var(--brand); border-color: var(--brand); color: #fff; }

.field { display: flex; flex-direction: column; gap: 5px; }
.field label { font-size: 12.5px; font-weight: 500; color: var(--ink-2); }
.input, select.input, textarea.input {
  width: 100%; border: 1px solid var(--line); background: var(--card); border-radius: var(--radius-sm);
  padding: 10px 12px; font-size: 15px; outline: none; transition: border-color .12s, box-shadow .12s;
}
.input:focus { border-color: var(--brand); box-shadow: 0 0 0 3px rgba(26,94,105,.14); }
.input:disabled { background: var(--bg); color: var(--ink-3); }
textarea.input { resize: vertical; min-height: 64px; }
.row { display: grid; gap: 12px; }
.row.c3 { grid-template-columns: 1fr 1fr 1fr; }
.row.c2 { grid-template-columns: 1fr 1fr; }
.stack { display: flex; flex-direction: column; gap: 14px; }

.calc {
  display: grid; grid-template-columns: repeat(3, 1fr); background: var(--brand-tint);
  border: 1px solid var(--brand-soft); border-radius: 12px; overflow: hidden;
}
.calc > div { padding: 12px; text-align: center; }
.calc > div + div { border-left: 1px solid var(--brand-soft); }
.calc .k { font-size: 11.5px; color: var(--ink-2); text-transform: uppercase; letter-spacing: .06em; }
.calc .v { font-size: 20px; font-weight: 600; margin-top: 2px; }
.hint { font-size: 12.5px; color: var(--ink-3); display: flex; gap: 6px; align-items: flex-start; }
.hint .ico { margin-top: 1px; }

.btn {
  border: 1px solid transparent; border-radius: 10px; padding: 10px 16px; font-weight: 500; font-size: 14.5px;
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; transition: all .12s; white-space: nowrap;
}
.btn.primary { background: var(--brand); color: #fff; }
.btn.primary:hover { background: var(--brand-hover); }
.btn.light { background: var(--card); border-color: var(--line); color: var(--ink); }
.btn.light:hover { border-color: var(--brand); color: var(--brand); }
.btn.soft { background: var(--brand-soft); color: var(--brand-txt); }
.btn.soft:hover { background: var(--brand-soft); filter: brightness(.95); }
.btn.danger { background: var(--card); border-color: var(--line); color: var(--neg); }
.btn.danger:hover { background: var(--neg-soft); }
.btn.sm { padding: 6px 11px; font-size: 13px; border-radius: 8px; }
.btn:disabled { opacity: .5; cursor: not-allowed; }
.btn-row { display: flex; gap: 8px; flex-wrap: wrap; }
.btn-row .grow { flex: 1; }

.locked {
  display: flex; gap: 10px; align-items: center; background: var(--pos-soft); color: var(--pos);
  border-radius: 10px; padding: 10px 12px; font-size: 13.5px;
}

/* ─────────── TABLES ─────────── */
.tbl-wrap { overflow-x: auto; margin: 0 -20px; padding: 0 20px; }
table.tbl { width: 100%; border-collapse: collapse; font-size: 14px; }
.tbl th {
  text-align: left; font-weight: 500; font-size: 12px; color: var(--ink-3); text-transform: uppercase; letter-spacing: .06em;
  padding: 8px 10px; border-bottom: 1px solid var(--line); white-space: nowrap;
}
.tbl td { padding: 11px 10px; border-bottom: 1px solid var(--line-2); vertical-align: middle; }
.tbl tr:last-child td { border-bottom: 0; }
.tbl tbody tr:hover td { background: var(--tint); }
.tbl .num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.tbl tfoot td { font-weight: 600; border-top: 2px solid var(--line); border-bottom: 0; }
.who-cell { display: flex; align-items: center; gap: 10px; }
.who-cell .avatar { width: 32px; height: 32px; font-size: 12px; background: var(--brand-soft); color: var(--brand); }

.pill { display: inline-flex; align-items: center; gap: 5px; border-radius: 999px; padding: 3px 10px; font-size: 12.5px; font-weight: 500; white-space: nowrap; }
.pill.pos { background: var(--pos-soft); color: var(--pos); }
.pill.neg { background: var(--neg-soft); color: var(--neg); }
.pill.neu { background: var(--bg); color: var(--ink-2); }
.pill.brand { background: var(--brand-soft); color: var(--brand-txt); }
.pill.warn { background: var(--warn-soft); color: var(--warn); }

.empty { text-align: center; color: var(--ink-3); padding: 34px 10px; }
.empty .ico { width: 34px; height: 34px; color: var(--ink-3); margin-bottom: 6px; }

.toolbar { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.month-nav { display: flex; align-items: center; gap: 6px; background: var(--card); border: 1px solid var(--line); border-radius: 10px; padding: 3px; }
.month-nav .ml { min-width: 130px; text-align: center; font-weight: 600; text-transform: capitalize; font-size: 14.5px; }
.month-nav .nbtn { width: 32px; height: 32px; border: 0; }
.sel-user { min-width: 180px; }

.chk { width: 18px; height: 18px; accent-color: var(--brand); }

/* ─────────── MODAL / TOAST ─────────── */
.modal-bg {
  position: fixed; inset: 0; background: rgba(14, 40, 45, .45); display: grid; place-items: center;
  padding: 18px; z-index: 50; animation: fade .15s;
}
.modal { background: var(--card); border-radius: 18px; width: 100%; max-width: 520px; max-height: 92vh; overflow: auto; box-shadow: 0 20px 60px rgba(0,0,0,.25); animation: pop .18s; }
.modal-h { display: flex; align-items: center; justify-content: space-between; padding: 18px 20px 6px; }
.modal-h h3 { margin: 0; font-size: 18px; font-weight: 600; }
.modal-b { padding: 10px 20px 4px; }
.modal-f { display: flex; justify-content: flex-end; gap: 8px; padding: 16px 20px 20px; }
@keyframes fade { from { opacity: 0; } }
@keyframes pop { from { transform: translateY(10px) scale(.98); opacity: 0; } }
#toast-root { position: fixed; left: 50%; bottom: calc(24px + env(safe-area-inset-bottom)); transform: translateX(-50%); z-index: 60; display: flex; flex-direction: column; gap: 8px; align-items: center; pointer-events: none; }
.toast { background: var(--ink); color: #fff; padding: 10px 16px; border-radius: 10px; font-size: 14px; box-shadow: 0 8px 24px rgba(0,0,0,.2); animation: pop .2s; display: flex; gap: 8px; align-items: center; }
.toast.err { background: #8C3A0F; }

.hours-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; }
.hours-grid .field label { text-align: center; }
.hours-grid .input { text-align: center; padding: 9px 4px; }


/* ─────────── DOCUMENTS ─────────── */
.docs-grid { grid-template-columns: minmax(340px, 500px) 1fr; }
.scan-btns { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.scan-btn {
  border: 1.5px dashed var(--line); border-radius: 14px; padding: 18px 12px; text-align: center; cursor: pointer;
  display: flex; flex-direction: column; align-items: center; gap: 4px; color: var(--brand-txt); background: var(--brand-tint);
  transition: all .12s;
}
.scan-btn:hover { border-color: var(--brand); background: var(--brand-soft); }
.scan-btn b { font-weight: 600; font-size: 14.5px; margin-top: 4px; }
.scan-btn span { font-size: 12.5px; color: var(--ink-2); }
.scan-btn.primary { background: var(--brand); border: 1.5px solid var(--brand); color: #fff; }
.scan-btn.primary span { color: rgba(255,255,255,.78); }
.scan-btn.primary:hover { background: var(--brand-hover); }
.pages { display: grid; grid-template-columns: repeat(auto-fill, minmax(92px, 1fr)); gap: 10px; }
.page {
  position: relative; aspect-ratio: 3 / 4; border-radius: 10px; overflow: hidden; background: var(--bg);
  border: 1px solid var(--line); display: grid; place-items: center;
}
.page img { width: 100%; height: 100%; object-fit: cover; }
.page .pdf { display: flex; flex-direction: column; align-items: center; gap: 4px; color: var(--brand); padding: 6px; text-align: center; }
.page .pdf small { font-size: 10.5px; color: var(--ink-2); word-break: break-all; line-height: 1.2; }
.page .rm { position: absolute; top: 5px; right: 5px; width: 26px; height: 26px; border-radius: 50%; border: 0; background: rgba(21,41,45,.75); color: #fff; display: grid; place-items: center; }
.page em { position: absolute; bottom: 5px; left: 6px; font-style: normal; font-size: 11px; font-weight: 600; background: rgba(255,255,255,.9); border-radius: 6px; padding: 0 6px; color: var(--ink); }
.page.add { cursor: pointer; border-style: dashed; color: var(--brand); display: flex; flex-direction: column; justify-content: center; gap: 4px; }
.page.add small { font-size: 11.5px; color: var(--ink-2); }
.page.add:hover { border-color: var(--brand); background: var(--brand-tint); }
.toggle { display: flex; align-items: center; gap: 8px; font-size: 13.5px; color: var(--ink-2); cursor: pointer; }
.toggle .ico { color: var(--brand); }
.thumb {
  border: 1px solid var(--line); border-radius: 7px; background: var(--bg); padding: 0; overflow: hidden;
  display: grid; place-items: center; color: var(--brand); flex: none;
}
.thumb:hover { border-color: var(--brand); box-shadow: 0 0 0 2px rgba(26,94,105,.15); }
.thumb img { width: 100%; height: 100%; object-fit: cover; }
.thumb span { display: flex; flex-direction: column; align-items: center; }
.thumb small { font-size: 9.5px; font-weight: 600; }
.doc-list { display: flex; flex-direction: column; }
.doc-item { display: flex; gap: 12px; align-items: flex-start; padding: 12px 0; border-bottom: 1px solid var(--line-2); }
.doc-item:last-child { border-bottom: 0; }
.di-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.di-top { display: flex; justify-content: space-between; gap: 8px; align-items: center; flex-wrap: wrap; }
.di-top b { font-weight: 600; display: inline-flex; gap: 6px; align-items: center; }
.di-top b .ico { color: var(--brand); }
.di-det { font-size: 13.5px; }
.viewer { background: var(--tint-2); border-radius: 12px; min-height: 240px; display: grid; place-items: center; overflow: hidden; }
.viewer img { max-width: 100%; max-height: 68vh; display: block; }
.chip .cnt { font-size: 11.5px; background: var(--bg); color: var(--ink-2); border-radius: 999px; padding: 0 7px; font-weight: 600; }
.chip.on .cnt { background: rgba(255,255,255,.22); color: #fff; }
@media (max-width: 900px) { .docs-grid, .grid-2 { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 760px) { .scan-btns { grid-template-columns: 1fr; } .scan-btn { flex-direction: row; text-align: left; padding: 14px; gap: 12px; } .scan-btn b { margin: 0; } .scan-btn span { display: none; } }


/* ─────────── CHANTIERS ─────────── */
.ch-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 14px; }
.ch-card {
  text-align: left; background: var(--card); border: 1px solid transparent; border-radius: var(--radius); box-shadow: var(--shadow);
  padding: 16px 18px; display: flex; flex-direction: column; gap: 5px; transition: border-color .12s, transform .1s;
}
.ch-card:hover { border-color: var(--brand); }
.ch-card:active { transform: scale(.995); }
.chc-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; margin-bottom: 4px; }
.chc-top b { font-weight: 600; font-size: 16px; line-height: 1.25; }
.chc-line { display: flex; gap: 7px; align-items: center; font-size: 13.5px; color: var(--ink-2); }
.chc-line .ico { color: var(--ink-3); }
.chc-foot { display: flex; gap: 6px; align-items: center; font-size: 12.5px; color: var(--ink-3); border-top: 1px solid var(--line-2); padding-top: 9px; margin-top: 6px; }
.prog { height: 8px; border-radius: 999px; background: var(--tint-2); overflow: hidden; }
.prog span { display: block; height: 100%; border-radius: 999px; background: var(--brand); }
.prog span.warn { background: var(--warn); }
.prog span.neg { background: var(--neg); }
.prog-lbl { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--ink-2); margin-top: 6px; }
.prog-lbl b { color: var(--ink); font-weight: 600; }
.ch-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px; }
.ch-mini { text-align: left; border: 1px solid var(--line); background: var(--card); border-radius: 12px; padding: 12px 14px; display: flex; flex-direction: column; gap: 3px; }
.ch-mini:hover { border-color: var(--brand); }
.ch-mini b { font-weight: 600; }
.ch-mini > span.muted { font-size: 12.5px; }
.info-list { display: flex; flex-direction: column; gap: 12px; font-size: 14px; }
.info-list > div { display: flex; gap: 10px; align-items: flex-start; }
.info-list .ico { color: var(--brand); margin-top: 2px; }
.info-list a { color: var(--brand); font-weight: 500; }
.consignes { margin-top: 16px; background: var(--brand-tint); border-left: 3px solid var(--brand); border-radius: 0 10px 10px 0; padding: 12px 14px; font-size: 14px; line-height: 1.55; }
.consignes .k { font-size: 11.5px; text-transform: uppercase; letter-spacing: .08em; color: var(--brand); font-weight: 600; margin-bottom: 4px; }
.fiches { display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: 12px; }
.fiche { display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center; }
.fiche-nm { font-size: 12px; color: var(--ink-2); word-break: break-all; line-height: 1.25; }
.tile.flat { box-shadow: none; background: var(--bg); padding: 12px 14px; }
.tile.flat .tv { font-size: 19px; }
.split { display: flex; flex-direction: column; gap: 8px; }
.split-row { display: grid; grid-template-columns: 1fr 90px 38px; gap: 8px; align-items: center; }
.split-foot { display: flex; justify-content: space-between; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 8px; font-size: 13.5px; font-weight: 600; }
.linkbtn { border: 0; background: none; color: var(--brand); font-size: 13.5px; font-weight: 500; padding: 8px 0 0; display: inline-flex; gap: 6px; align-items: center; text-align: left; }
.linkbtn:hover { text-decoration: underline; }
@media (max-width: 900px) { .ch-detail { grid-template-columns: minmax(0, 1fr); } }

/* ─────────── MOBILE ─────────── */
@media (max-width: 900px) {
  .grid-2 { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px) {
  body { font-size: 15px; }
  .sidebar { display: none; }
  .main { padding: 0 14px calc(92px + env(safe-area-inset-bottom)); margin-left: 0; }
  .topbar {
    display: flex; align-items: center; justify-content: space-between;
    background: var(--side-bg); color: #fff; margin: 0 -14px 18px; border-bottom: 1px solid var(--side-line);
    padding: calc(12px + env(safe-area-inset-top)) 14px 12px; position: sticky; top: 0; z-index: 20;
  }
  .topbar img { height: 34px; }
  .topbar .tb-r { display: flex; align-items: center; gap: 6px; font-size: 13.5px; }
  .page-head h1 { font-size: 22px; }
  .bottom-nav {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; background: var(--card); border-top: 1px solid var(--line);
    display: flex; justify-content: space-around; padding: 6px 4px calc(6px + env(safe-area-inset-bottom));
    overflow-x: auto;
  }
  .bottom-nav button {
    border: 0; background: none; color: var(--ink-3); display: flex; flex-direction: column; align-items: center; gap: 2px;
    font-size: 10.5px; padding: 6px 6px; min-width: 58px; border-radius: 10px; position: relative;
  }
  .bottom-nav button.active { color: var(--brand); font-weight: 600; }
  .bottom-nav .badge { position: absolute; top: 2px; right: 8px; background: var(--neg); color: #fff; font-size: 10px; border-radius: 999px; padding: 0 5px; }
  .counter .cv { font-size: 40px; }
  .row.c3 { grid-template-columns: 1fr 1fr; }
  .row.c3 .field:last-child { grid-column: span 2; }
  .card { padding: 16px; }
  .tbl-wrap { margin: 0 -16px; padding: 0 16px; }
  .tiles { grid-template-columns: 1fr 1fr; gap: 10px; }
  .tile { padding: 12px; gap: 10px; }
  .tile .ti { width: 36px; height: 36px; }
  .tile .tv { font-size: 18px; }
  .hide-m { display: none; }
}
@media (min-width: 761px) { .bottom-nav { display: none; } }

/* ─────────── PRINT ─────────── */
.print-only { display: none; }
@media print {
  body { background: #fff; font-size: 12px; }
  .sidebar, .topbar, .bottom-nav, .head-actions, .toolbar, .demo-banner, .no-print, .btn { display: none !important; }
  .main { padding: 0; }
  .card, .tile { box-shadow: none; border: 1px solid #ccc; }
  .print-only { display: block; }
  .print-head { display: flex; justify-content: space-between; align-items: center; border-bottom: 2px solid var(--brand); padding-bottom: 8px; margin-bottom: 14px; }
  .print-head img { height: 50px; }
}
.prog-lbl { white-space: nowrap; }
.ch-mini .prog-lbl { font-size: 12px; }

/* ─────────── PRIME PANIER ─────────── */
.panier {
  display: flex; align-items: center; gap: 12px; border: 1px solid var(--line); border-radius: 12px; padding: 11px 14px;
  cursor: pointer; transition: all .12s; background: var(--card); user-select: none;
}
.panier:hover { border-color: var(--brand); }
.panier .ico { color: var(--ink-3); width: 24px; height: 24px; }
.panier span { display: flex; flex-direction: column; line-height: 1.25; }
.panier b { font-weight: 600; font-size: 14.5px; }
.panier small { font-size: 12.5px; color: var(--ink-3); }
.panier.on { border-color: var(--pos); background: var(--pos-soft); }
.panier.on .ico { color: var(--pos); }
.panier .chk { width: 20px; height: 20px; accent-color: var(--pos); }
.panier-cfg {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 16px; padding: 12px 14px;
  background: var(--pos-soft); border-radius: 12px; color: var(--pos); font-size: 14px;
}
.panier-cfg > span { flex: 1; min-width: 200px; }
.panier-cfg label { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--ink-2); }
.panier-cfg .input { width: 100px; padding: 7px 10px; }

/* ─────────── REMARQUES CHANTIER ─────────── */
.note-form { display: flex; flex-direction: column; gap: 8px; margin-bottom: 14px; padding-bottom: 14px; border-bottom: 1px solid var(--line-2); }
.notes { display: flex; flex-direction: column; gap: 10px; }
.note { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; border-radius: 12px; background: var(--bg); border-left: 3px solid var(--brand); }
.note.n-manque { border-left-color: var(--warn); background: var(--warn-soft); }
.note.n-probleme { border-left-color: var(--neg); background: var(--neg-soft); }
.note.n-fin { border-left-color: var(--pos); background: var(--pos-soft); }
.note.n-reste { border-left-color: var(--warn); background: var(--warn-soft); }
.note.done { opacity: .6; }
.note-ic { width: 28px; height: 28px; border-radius: 8px; display: grid; place-items: center; background: var(--card); color: var(--brand); flex: none; }
.n-manque .note-ic, .n-reste .note-ic { color: var(--warn); } .n-probleme .note-ic { color: var(--neg); } .n-fin .note-ic { color: var(--pos); }
.note-b { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.note-h { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; font-size: 13px; }
.note-h b { font-weight: 600; }
.note-t { font-size: 14px; line-height: 1.45; }
.note-a { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }

/* ─────────── PENSE-BÊTE ─────────── */
.pb { border-top: 3px solid #E8B64C; }
.pb .card-head h3 .ico { color: #C98E12; }
.pb-list { display: flex; flex-direction: column; gap: 4px; margin-bottom: 12px; }
.pb-item { display: flex; gap: 10px; align-items: center; padding: 8px 10px; border-radius: 10px; background: var(--warn-soft); cursor: pointer; }
.pb-item > span { flex: 1; display: flex; flex-direction: column; line-height: 1.3; }
.pb-t { font-size: 14px; font-weight: 500; }
.pb-item small { font-size: 12px; color: var(--ink-3); }
.pb-item.done { background: var(--bg); }
.pb-item.done .pb-t { text-decoration: line-through; color: var(--ink-3); }
.pb-item .chk { accent-color: #C98E12; }
.pb-form { display: flex; gap: 8px; flex-wrap: wrap; }
.pb-form #rp-txt { flex: 2 1 180px; }
.pb-form select, .pb-form #rp-date { flex: 1 1 160px; }

/* ─────────── CLÔTURE ─────────── */
.cl-banner { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; padding: 14px 16px; border-radius: var(--radius); margin-bottom: 18px; box-shadow: var(--shadow); }
.cl-banner.fin { background: var(--pos-soft); border: 1px solid var(--line); }
.cl-banner.reste { background: var(--warn-soft); border: 1px solid var(--line); }
.cl-ic { width: 40px; height: 40px; border-radius: 12px; background: var(--card); display: grid; place-items: center; flex: none; }
.fin .cl-ic { color: var(--pos); } .reste .cl-ic { color: var(--warn); }
.cl-b { flex: 1; min-width: 200px; }
.cl-b b { font-weight: 600; }
.cl-t { margin-top: 4px; font-size: 14px; }
.cl-choices { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.cl-choice { border: 1.5px solid var(--line); background: var(--card); border-radius: 14px; padding: 16px 10px; display: flex; flex-direction: column; align-items: center; gap: 4px; text-align: center; color: var(--ink-2); }
.cl-choice b { color: var(--ink); font-weight: 600; font-size: 14.5px; }
.cl-choice span { font-size: 12px; }
.cl-choice[data-clc="fin"].on { border-color: var(--pos); background: var(--pos-soft); color: var(--pos); }
.cl-choice[data-clc="reste"].on { border-color: var(--warn); background: var(--warn-soft); color: var(--warn); }
@media (max-width: 760px) { .note { flex-wrap: wrap; } .note-a { width: 100%; } }

/* ─────────── PLANNING ─────────── */
.pl-wrap { display: grid; grid-template-columns: 270px minmax(0, 1fr); gap: 18px; align-items: start; }
.pl-todo { position: sticky; top: 18px; display: flex; flex-direction: column; gap: 10px; max-height: calc(100vh - 36px); overflow-y: auto; }
.pl-tcard { border: 1px solid var(--line); border-left: 4px solid var(--c); border-radius: 10px; padding: 10px 12px; background: var(--card); cursor: grab; display: flex; flex-direction: column; gap: 3px; }
.pl-tcard:hover { box-shadow: 0 2px 10px rgba(14,57,64,.1); }
.pl-tcard.dragging { opacity: .45; }
.pl-tc-top { display: flex; gap: 8px; align-items: center; }
.pl-tc-top b { font-weight: 600; font-size: 14px; line-height: 1.25; }
.pl-tc-foot { display: flex; justify-content: space-between; align-items: center; margin-top: 6px; }
.pl-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--c); flex: none; display: inline-block; }
.pl-grid-card { padding: 0; overflow: hidden; }
.pl-scroll { overflow-x: auto; }
.pl-grid { width: 100%; border-collapse: separate; border-spacing: 0; min-width: 640px; }
.pl-grid th { font-weight: 500; font-size: 12px; color: var(--ink-3); padding: 10px 4px; border-bottom: 1px solid var(--line); text-align: center; background: var(--tint); }
.pl-grid th span { display: block; text-transform: uppercase; letter-spacing: .05em; font-size: 11px; }
.pl-grid th b { font-size: 16px; color: var(--ink); font-weight: 600; }
.pl-grid th.today b { color: #fff; background: var(--brand); border-radius: 50%; width: 28px; height: 28px; display: inline-grid; place-items: center; }
.pl-grid th.wk, .pl-grid td.wk { border-left: 2px solid var(--line); }
.pl-who { text-align: left !important; padding: 8px 12px !important; position: sticky; left: 0; background: var(--card); z-index: 2; min-width: 120px; border-right: 1px solid var(--line); }
.pl-grid th.pl-who { background: var(--tint); }
.pl-who .who-cell span { font-weight: 500; font-size: 14px; }
.pl-cell { border-bottom: 1px solid var(--line-2); border-right: 1px solid var(--tint-2); padding: 5px; vertical-align: top; height: 64px; min-width: 96px; cursor: pointer; transition: background .1s; }
.dense .pl-cell { min-width: 52px; height: 52px; padding: 3px; }
.pl-cell:hover { background: var(--brand-tint); }
.pl-cell.today { background: var(--tint); }
.pl-cell.off { background: repeating-linear-gradient(-45deg, var(--tint), var(--tint) 6px, var(--tint-2) 6px, var(--tint-2) 12px); }
.pl-cell.over { background: var(--brand-soft) !important; box-shadow: inset 0 0 0 2px var(--brand); }
.pl-chip { display: block; width: 100%; text-align: left; border: 0; border-radius: 7px; padding: 5px 7px; margin-bottom: 4px; background: var(--c); color: #fff; font-size: 12.5px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dense .pl-chip { font-size: 10.5px; padding: 3px 4px; }
.pl-chip:hover { filter: brightness(1.1); }
.pl-abs { display: block; font-size: 11px; color: var(--ink-2); background: var(--tint-2); border-radius: 6px; padding: 3px 6px; margin-bottom: 4px; text-align: center; }
.pl-add { display: grid; place-items: center; height: 100%; min-height: 40px; color: transparent; }
.pl-cell:hover .pl-add { color: var(--brand); }
.pl-grid tfoot td { padding: 8px 4px; border-top: 1px solid var(--line); }
.pl-legend { display: flex; flex-wrap: wrap; gap: 8px; padding: 12px 16px; border-top: 1px solid var(--line); }
.pl-leg { border: 1px solid var(--line); background: var(--card); border-radius: 999px; padding: 5px 12px; font-size: 13px; display: inline-flex; gap: 6px; align-items: center; }
.pl-leg:hover { border-color: var(--c); }
@media (max-width: 1000px) { .pl-wrap { grid-template-columns: minmax(0, 1fr); } .pl-todo { position: static; max-height: none; } }
@media print { .pl-wrap { grid-template-columns: 1fr; } .pl-chip { -webkit-print-color-adjust: exact; print-color-adjust: exact; } }
.pl-sum { background: var(--brand-tint); border: 1px solid var(--brand-soft); border-radius: 10px; padding: 10px 12px; font-size: 13.5px; display: flex; flex-direction: column; gap: 4px; }
.pl-sum:empty { display: none; }
.pl-sum .pill { margin-left: 6px; }

/* ─────────── DISPONIBILITÉS ─────────── */
.pl-tiles { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.tile.hl { background: linear-gradient(135deg, var(--pos-soft), var(--card)); border: 1px solid var(--line); }
.tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--line); margin-bottom: 18px; }
.tab { border: 0; background: none; padding: 10px 14px; font-size: 14.5px; color: var(--ink-2); border-bottom: 2px solid transparent; margin-bottom: -1px; display: inline-flex; gap: 7px; align-items: center; }
.tab:hover { color: var(--brand); }
.tab.on { color: var(--brand); border-bottom-color: var(--brand); font-weight: 600; }
.dispo-grid { grid-template-columns: minmax(0, 1fr); }
.dispo-hero { background: linear-gradient(140deg, var(--brand-2) 0%, var(--brand) 45%, var(--brand-deep) 100%); color: #fff; }
.dispo-hero .k { font-size: 12px; letter-spacing: .12em; text-transform: uppercase; opacity: .8; }
.dispo-hero .v { font-size: 30px; font-weight: 600; margin: 6px 0 8px; text-transform: capitalize; }
.dispo-hero .muted { color: rgba(255,255,255,.8); }
.dispo-hero b { color: #fff; }
@media (max-width: 1100px) { .pl-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); } .dispo-grid { grid-template-columns: minmax(0, 1fr); } }

.dispo-who { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-bottom: 14px; }
.dispo-chip { background: rgba(255,255,255,.18); border: 1px solid rgba(255,255,255,.25); border-radius: 999px; padding: 3px 11px; font-size: 13px; font-weight: 500; }
.dispo-sub { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; border-top: 1px solid rgba(255,255,255,.18); padding-top: 12px; }
.dispo-sub span { display: block; font-size: 11.5px; text-transform: uppercase; letter-spacing: .08em; opacity: .75; }
.dispo-sub b { font-weight: 600; text-transform: capitalize; }
@media (max-width: 760px) { .dispo-sub { grid-template-columns: 1fr; } }

/* ─────────── CONGÉS ─────────── */
.cg-mini { display: flex; align-items: center; gap: 14px; border: 0; width: 100%; cursor: pointer; padding: 14px 18px; }
.cg-mini:hover { box-shadow: 0 0 0 2px var(--brand-soft), var(--shadow); }
.cg-mini .cg-ic { width: 42px; height: 42px; border-radius: 12px; background: var(--brand-soft); color: var(--brand-txt); display: grid; place-items: center; }
.cg-mini .tl { font-size: 12.5px; color: var(--ink-2); }
.cg-mini .tv { font-size: 22px; font-weight: 600; line-height: 1.1; }
.cg-grid { display: grid; grid-template-columns: minmax(280px, 360px) 1fr 1fr; gap: 18px; align-items: start; }
.cg-hero { background: linear-gradient(140deg, #2C8A8B 0%, var(--brand-2) 55%, #144E52 100%); color: #fff; }
.cg-hero .k { font-size: 12px; letter-spacing: .12em; text-transform: uppercase; opacity: .8; }
.cg-hero .v { font-size: 44px; font-weight: 600; line-height: 1.1; margin: 6px 0 14px; }
.cg-hero .v small { font-size: 18px; font-weight: 400; opacity: .8; }
.cg-hero .v.neg { color: #FFD2BD; }
.cg-bar { height: 10px; border-radius: 999px; background: rgba(255,255,255,.22); display: flex; overflow: hidden; }
.cg-bar .p { background: var(--card); } .cg-bar .a { background: #F6C768; }
.cg-leg { display: flex; flex-wrap: wrap; gap: 12px; font-size: 12.5px; margin-top: 8px; opacity: .92; }
.cg-leg i { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 4px; }
.cg-leg i.p { background: var(--card); } .cg-leg i.a { background: #F6C768; } .cg-leg i.r { background: rgba(255,255,255,.35); }
.k-sub { font-size: 11.5px; text-transform: uppercase; letter-spacing: .08em; color: var(--ink-3); margin: 6px 0 6px; }
.cg-per { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--line-2); font-size: 14px; }
.cg-per:last-child { border-bottom: 0; }
.cg-per.fut b { font-weight: 500; }
.sel-row td { background: var(--brand-tint); }
.pl-cell.abs { background: repeating-linear-gradient(-45deg, var(--tint), var(--tint) 6px, var(--tint-2) 6px, var(--tint-2) 12px); cursor: not-allowed; }
.pl-abs.cg { background: var(--brand-soft); color: var(--brand-2); font-weight: 600; display: flex; gap: 4px; align-items: center; justify-content: center; }
@media (max-width: 1100px) { .cg-grid { grid-template-columns: minmax(0, 1fr); } }

/* ─────────── IMPRESSION (corrections) ─────────── */
@media print {
  .main { margin-left: 0 !important; padding: 0 !important; }
  .page-head { margin-bottom: 10px; }
  .page-head .sub { display: none; }
  .tabs, .pl-todo, .toast, #toast-root, .modal-bg { display: none !important; }
  .pl-wrap { display: block; }
  .pl-grid-card { overflow: visible; box-shadow: none; border: 1px solid #ccc; }
  .pl-scroll { overflow: visible; }
  .pl-grid { min-width: 0; width: 100%; table-layout: fixed; }
  .pl-who { position: static; min-width: 0; width: 110px; }
  .pl-cell { min-width: 0; height: auto; padding: 3px; }
  .pl-chip { white-space: normal; font-size: 10px; padding: 3px 5px; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .pl-abs, .pl-cell.abs, .pl-cell.off, .pl-grid th.today b { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .pl-add { display: none; }
  .tiles { gap: 8px; margin-bottom: 10px; }
  .tile { padding: 8px 10px; }
  .tile .ti { display: none; }
  .tile .tv { font-size: 15px !important; }
  body.print-planning .pl-tiles { grid-template-columns: repeat(4, 1fr); }
  .dispo-hero, .cg-hero, .counter { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .card, .tile { break-inside: avoid; }
}

/* ─────────── MON PLANNING (salarié) ─────────── */
.np-card { display: flex; align-items: center; gap: 14px; border: 0; width: 100%; cursor: pointer; padding: 14px 18px; border-left: 4px solid var(--brand); }
.np-card:hover { box-shadow: 0 0 0 2px var(--brand-soft), var(--shadow); }
.np-ic { width: 42px; height: 42px; border-radius: 12px; background: var(--brand-soft); color: var(--brand); display: grid; place-items: center; flex: none; }
.np-card .tl { font-size: 12.5px; color: var(--ink-2); text-transform: capitalize; }
.np-ch { display: flex; align-items: center; gap: 6px; font-size: 14.5px; margin-top: 2px; flex-wrap: wrap; }
.np-ch b { font-weight: 600; }
.mp-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.mp-big { border-left: 4px solid var(--c); padding: 4px 0 4px 14px; display: flex; flex-direction: column; gap: 6px; }
.mp-big + .mp-big { margin-top: 18px; }
.mp-top { display: flex; gap: 8px; align-items: center; font-size: 18px; }
.mp-top b { font-weight: 600; }
.mp-big a { color: var(--brand); font-weight: 500; }
.mp-pb { background: var(--warn-soft); border-radius: 10px; padding: 8px 10px; font-size: 13.5px; margin-top: 6px; }
.mp-pb .ico { color: #C98E12; }
.mp-list { display: flex; flex-direction: column; margin-bottom: 8px; }
.mp-day { display: flex; gap: 12px; align-items: center; padding: 8px 4px; border-bottom: 1px solid var(--line-2); }
.mp-day:last-child { border-bottom: 0; }
.mp-day.today { background: var(--brand-tint); border-radius: 10px; }
.mp-day.past { opacity: .5; }
.mp-date { width: 44px; text-align: center; flex: none; }
.mp-date span { display: block; font-size: 11px; text-transform: uppercase; color: var(--ink-3); }
.mp-date b { font-size: 18px; font-weight: 600; }
.mp-what { flex: 1; min-width: 0; }

/* ─────────── RDV CLIENTS & MÉTRÉS ─────────── */
.rdv-up { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 10px; }
.rdv-upc { text-align: left; border: 1px solid var(--line); background: var(--card); border-radius: 12px; padding: 10px 12px; display: flex; flex-direction: column; gap: 2px; border-left: 4px solid var(--brand); }
.rdv-upc:hover { border-color: var(--brand); }
.rdv-upc b { font-weight: 600; color: var(--brand); }
.rdv-grid { grid-template-columns: minmax(0, 1fr) 360px; }
.rdv-tot { position: sticky; top: 18px; }
.rdv-tot-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 8px; }
.rdv-tot-grid > div { background: var(--bg); border-radius: 10px; padding: 9px 11px; }
.rdv-tot-grid span { display: block; font-size: 11.5px; color: var(--ink-2); }
.rdv-tot-grid b { font-size: 16px; font-weight: 600; }
.rdv-tot-grid > div:first-child, .rdv-tot-grid > div:nth-child(3) { background: var(--brand-tint); }
.pieces { display: flex; flex-direction: column; gap: 14px; }
.piece { border: 1px solid var(--line); border-radius: 14px; overflow: hidden; }
.piece-h { display: flex; align-items: center; gap: 10px; background: var(--tint); padding: 10px 12px; border-bottom: 1px solid var(--line); }
.piece-n { width: 28px; height: 28px; border-radius: 50%; background: var(--brand); color: #fff; display: grid; place-items: center; font-weight: 600; font-size: 13px; flex: none; }
.piece-nom { flex: 1; font-weight: 500; }
.piece-m2 { font-weight: 700; color: var(--brand); white-space: nowrap; font-size: 15px; }
.piece-b { padding: 12px; display: flex; flex-direction: column; gap: 12px; }
.pc-dims { grid-template-columns: 1.2fr repeat(5, minmax(0, 1fr)); }
.pc-carr { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.pc-opts { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-end; }
.pc-chk { display: inline-flex; gap: 7px; align-items: center; border: 1px solid var(--line); border-radius: 999px; padding: 7px 12px; font-size: 13.5px; cursor: pointer; background: var(--card); height: 38px; }
.pc-chk.on { border-color: var(--brand); background: var(--brand-tint); color: var(--brand-txt); font-weight: 500; }
.pc-sub { display: flex; gap: 8px; }
.pc-sub .field { min-width: 110px; }
.pc-bag { flex-wrap: wrap; background: var(--brand-tint); border-radius: 12px; padding: 8px 10px; }
.pc-bag .field { min-width: 120px; flex: 1; }
@media (max-width: 1100px) { .rdv-grid, .mp-grid { grid-template-columns: minmax(0, 1fr); } .rdv-tot { position: static; } .pc-dims { grid-template-columns: repeat(3, minmax(0, 1fr)); } .pc-carr { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { .pc-dims { grid-template-columns: repeat(2, minmax(0, 1fr)); } .pc-carr { grid-template-columns: minmax(0, 1fr); } }
@media print { .piece { break-inside: avoid; } .pc-chk:not(.on) { display: none; } .rdv-grid { grid-template-columns: 1fr; } .rdv-tot { position: static; } }

.pc-esc { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.esc-calc { background: var(--brand-tint); border-radius: 10px; padding: 8px 12px; font-size: 13px; color: var(--ink-2); display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.esc-calc b { color: var(--ink); }
@media (max-width: 760px) { .pc-esc { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.pc-add-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 12px; }

.paliers { border: 1px dashed var(--line); border-radius: 12px; padding: 10px 12px; display: flex; flex-direction: column; gap: 8px; }
.pal-h { display: flex; justify-content: space-between; align-items: center; }
.pal-h b { font-weight: 600; font-size: 14px; }
.pal-row { display: flex; align-items: flex-end; gap: 8px; }
.pal-row .field { flex: 1; max-width: 160px; }
.pal-n { width: 24px; height: 24px; border-radius: 50%; background: var(--brand-soft); color: var(--brand); display: grid; place-items: center; font-size: 12px; font-weight: 600; margin-bottom: 8px; }
.pal-x { margin-bottom: 10px; color: var(--ink-3); }
.pal-m2 { margin: 0 0 10px auto; white-space: nowrap; color: var(--brand); }
.pal-row .icon-btn { margin-bottom: 4px; }

.bag-calc { flex-basis: 100%; font-size: 13px; color: var(--ink-2); display: flex; gap: 6px; align-items: center; flex-wrap: wrap; padding-top: 2px; }
.bag-calc b { color: var(--ink); }

.pc-jt { grid-template-columns: 150px 170px 1fr; align-items: end; }
.pc-jt .mat-line:last-child:nth-child(4) { grid-column: 1 / -1; }
.pc-jt > .field:nth-child(3) { max-width: 320px; }
.mat-line { font-size: 12.5px; color: var(--ink-2); background: var(--tint); border-radius: 10px; padding: 8px 10px; display: flex; gap: 5px; align-items: center; flex-wrap: wrap; min-height: 40px; }
.mat-line:empty { background: none; }
.mat-line b { color: var(--ink); }
.mat-item { background: var(--tint); }
@media (max-width: 760px) { .pc-jt { grid-template-columns: 1fr 1fr; } .pc-jt .mat-line { grid-column: span 2; } .pc-jt > .field:nth-child(3) { grid-column: span 2; max-width: none; } }
.mur-row .mur-nom { max-width: 280px; flex: 2.4; }
.mur-row .field:not(.mur-nom) { max-width: 115px; }
.mur-row .field { min-width: 0; } .mur-row .field label { white-space: nowrap; }
@media (max-width: 760px) {
  .mur-row { display: grid; grid-template-columns: 24px minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) 32px; grid-template-areas: "n nom nom m del" ". l h d d"; gap: 6px 8px; padding-bottom: 10px; border-bottom: 1px solid var(--line); }
  .mur-row > :nth-child(1) { grid-area: n; align-self: end; } .mur-row > :nth-child(2) { grid-area: nom; max-width: none; }
  .mur-row > :nth-child(3) { grid-area: l; } .mur-row > :nth-child(4) { display: none; } .mur-row > :nth-child(5) { grid-area: h; } .mur-row > :nth-child(6) { grid-area: d; }
  .mur-row > :nth-child(7) { grid-area: m; align-self: end; margin: 0 0 12px; justify-self: end; font-size: 13px; } .mur-row > :nth-child(8) { display: none; } .mur-row > :nth-child(9) { grid-area: del; align-self: end; }
  .mur-row .field:not(.mur-nom) { max-width: none; } .mur-row .field label { font-size: 12px; } .mur-row .input { padding-left: 10px; padding-right: 6px; }
}

/* ─────────── DOCUMENTS IMPRIMABLES ─────────── */
#print-doc { display: none; }
.pd { font-family: inherit; color: var(--ink); font-size: 10.5pt; line-height: 1.4; }
.pd-head { display: grid; grid-template-columns: auto 1fr auto; gap: 16px; align-items: center; padding-bottom: 12px; border-bottom: 3px solid var(--brand); margin-bottom: 14px; }
.pd-head img { height: 58px; }
.pd-k { font-size: 8pt; letter-spacing: .14em; text-transform: uppercase; color: var(--brand); font-weight: 600; }
.pd-head h1 { font-size: 19pt; margin: 1px 0 0; font-weight: 600; letter-spacing: -.01em; }
.pd-sub { font-size: 11.5pt; color: #4A5B5E; }
.pd-meta { display: flex; gap: 6px; }
.pd-meta div { background: #EEF5F5; border-radius: 8px; padding: 5px 10px; text-align: right; min-width: 70px; }
.pd-meta span, .pd-stats span, .pd-kv span { display: block; font-size: 7.5pt; text-transform: uppercase; letter-spacing: .08em; color: #6B7C7F; }
.pd-meta b { font-size: 10pt; font-weight: 600; }
.pd-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 12px; }
.pd-box2 { border: 1px solid #D9E4E4; border-radius: 10px; padding: 9px 12px; break-inside: avoid; }
.pd-h2 { font-size: 8.5pt; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: var(--brand); margin-bottom: 5px; }
.pd-kv { display: flex; flex-direction: column; gap: 4px; }
.pd-kv div { display: grid; grid-template-columns: 105px 1fr; gap: 8px; align-items: baseline; }
.pd-kv span { font-size: 7.5pt; }
.pd-kv b { font-weight: 500; font-size: 10pt; }
.pd-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin: 4px 0 14px; break-inside: avoid; }
.pd-stats div { background: var(--brand); color: #fff; border-radius: 10px; padding: 8px 12px; }
.pd-stats div:not(:first-child) { background: #EEF5F5; color: #1C2B2D; }
.pd-stats div:first-child span { color: rgba(255,255,255,.75); }
.pd-stats b { font-size: 14pt; font-weight: 600; }
.pd-h { font-size: 12pt; font-weight: 600; margin: 16px 0 8px; padding-left: 9px; border-left: 4px solid var(--brand); break-after: avoid; }
.pd-piece { border: 1px solid #D9E4E4; border-radius: 10px; padding: 9px 12px 10px; margin-bottom: 9px; break-inside: avoid; }
.pd-ph { display: flex; align-items: center; gap: 9px; margin-bottom: 7px; }
.pd-ph b { font-size: 11.5pt; font-weight: 600; }
.pd-n { width: 20px; height: 20px; border-radius: 50%; background: var(--brand); color: #fff; display: grid; place-items: center; font-size: 8.5pt; font-weight: 700; }
.pd-zone { font-size: 8pt; background: #EEF5F5; color: var(--brand); border-radius: 999px; padding: 1px 8px; }
.pd-m2 { margin-left: auto; font-weight: 700; color: var(--brand); font-size: 12pt; }
.pd-grid3 { display: grid; grid-template-columns: 1fr 1fr 1.25fr; gap: 12px; }
.pd-grid3 .pd-kv div { grid-template-columns: 84px 1fr; }
.pd-grid3 .pd-kv b { font-size: 9pt; }
.pd-tags { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 7px; }
.pd-tags span { font-size: 8.5pt; border: 1px solid #CFE0E0; background: #F6FAFA; border-radius: 999px; padding: 1px 8px; }
.pd-note { margin-top: 6px; font-size: 9pt; font-style: italic; color: #4A5B5E; }
.pd-line { font-size: 9.5pt; color: #4A5B5E; margin-bottom: 6px; }
.pd-tab { width: 100%; border-collapse: collapse; font-size: 9.5pt; margin-bottom: 6px; }
.pd-tab th { text-align: left; font-size: 7.5pt; text-transform: uppercase; letter-spacing: .08em; color: #6B7C7F; font-weight: 600; border-bottom: 1.5px solid #CFE0E0; padding: 4px 6px; }
.pd-tab td { border-bottom: 1px solid #E8EFEF; padding: 4px 6px; vertical-align: top; }
.pd-tab tr { break-inside: avoid; }
.pd-tab .r { text-align: right; } .pd-tab .nw { white-space: nowrap; }
.pd-sm { font-size: 9pt; margin: 0 0 7px; }
.pd-cat td { background: #EEF5F5; font-size: 7.5pt; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: var(--brand); padding: 4px 6px; border: 0; }
.pd-mat td { padding: 5px 6px; }
.c-chk { width: 18px; }
.pd-box { display: inline-block; width: 11px; height: 11px; border: 1.5px solid #8FA3A6; border-radius: 3px; vertical-align: -1px; }
.pd-box.on { background: var(--brand); border-color: var(--brand); }
.pd-cons { background: #F6FAFA; border-left: 3px solid var(--brand); border-radius: 6px; padding: 8px 12px; font-size: 9.5pt; }
.pd-small { font-size: 7.5pt; color: #6B7C7F; margin-top: 6px; }
.pd-empty { color: #6B7C7F; font-style: italic; }
.pd-sign { margin-top: 18px; break-inside: avoid; }
.pd-sign > div:first-child { font-size: 8.5pt; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: var(--brand); }
.pd-lines { height: 90px; background: repeating-linear-gradient(transparent 0 21px, #D9E4E4 21px 22px); }
.pd-foot { display: flex; justify-content: space-between; font-size: 7.5pt; color: #8A9A9C; border-top: 1px solid #D9E4E4; padding-top: 6px; margin-top: 18px; }
@media print {
  @page { size: A4; margin: 11mm 12mm; }
  body.print-doc > *:not(#print-doc) { display: none !important; }
  body.print-doc #print-doc { display: block; }
  body.print-doc { background: #fff; }
  .pd, .pd * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .pd-break { break-before: auto; }
  /* écrans imprimés tels quels (heures, récap, planning) : rendu plus propre */
  .print-head { border-bottom: 3px solid var(--brand); padding-bottom: 10px; margin-bottom: 16px; }
  .print-head img { height: 54px; }
  .print-head b { font-size: 15pt; font-weight: 600; color: var(--ink); }
  .main .page-head h1 { font-size: 16pt; }
  .tile, .card { break-inside: avoid; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  table { break-inside: auto; } tr { break-inside: avoid; }
  .tbl th, table th { background: #EEF5F5 !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  input, select, textarea { border-color: transparent !important; background: transparent !important; box-shadow: none !important; }
  .pill { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}
.gcal-chip { display: inline-flex; align-items: center; gap: 6px; padding: 8px 12px; border-radius: 10px; border: 1px dashed var(--line); color: var(--ink-2); font-size: 13.5px; text-decoration: none; background: var(--card); }
a.gcal-chip, .gcal-chip.link { cursor: pointer; color: var(--brand); border-style: solid; border-color: var(--brand-soft); background: var(--brand-tint); font-weight: 500; }
a.gcal-chip:hover, .gcal-chip.link:hover { border-color: var(--brand); }
.gcal-chip.on { border-style: solid; border-color: var(--line); background: var(--pos-soft); color: var(--pos); font-weight: 500; }
.gcal-field > div { min-height: 42px; display: flex; align-items: center; }
.gcal-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--pos); display: inline-block; margin-left: 2px; }

/* ─────────── FICHE SALARIÉ ─────────── */
tr.row-link { cursor: pointer; }
tr.row-link:hover td { background: var(--brand-tint); }
.avatar.lg { width: 52px; height: 52px; font-size: 18px; }
.sal-tiles { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-bottom: 18px; }
.sal-tiles .tile.neg-t { background: linear-gradient(135deg, var(--neg-soft), var(--card)); }
.sal-grid { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); align-items: start; }
.m2-chart { width: 100%; height: auto; display: block; }
.m2-chart rect { fill: var(--brand-soft); } .m2-chart rect.cur { fill: var(--brand); }
.m2-chart .grid { stroke: var(--tint-2); stroke-dasharray: 3 4; } .m2-chart .base { stroke: var(--line); }
.m2-chart .ax { font-size: 11px; fill: var(--ink-3); } .m2-chart .ax.b { fill: var(--brand); font-weight: 700; }
.m2-chart .val { font-size: 11px; fill: var(--ink-2); font-weight: 600; }
.urg { margin-top: 12px; padding: 10px 12px; border-radius: 12px; background: var(--neg-soft); border: 1px solid var(--line); display: flex; flex-direction: column; align-items: flex-start; gap: 2px; font-size: 14px; }
.urg .k { font-size: 11.5px; text-transform: uppercase; letter-spacing: .08em; color: var(--neg); font-weight: 600; display: flex; gap: 6px; align-items: center; margin-bottom: 2px; }
.urg.empty-u { background: var(--bg); border-color: var(--line); } .urg.empty-u .k { color: var(--ink-3); }
.msg-thread { display: flex; flex-direction: column; gap: 8px; max-height: 360px; overflow-y: auto; padding: 4px 2px 10px; }
.msg-thread.compact { max-height: 260px; }
.msg { max-width: 82%; align-self: flex-start; }
.msg.me { align-self: flex-end; text-align: right; }
.msg-b { background: var(--bg); border-radius: 14px 14px 14px 4px; padding: 8px 12px; font-size: 14px; text-align: left; display: inline-block; }
.msg.me .msg-b { background: var(--brand); color: #fff; border-radius: 14px 14px 4px 14px; }
.msg-m { font-size: 11.5px; color: var(--ink-3); margin-top: 3px; }
.msg-form { display: flex; gap: 8px; align-items: flex-end; border-top: 1px solid var(--line); padding-top: 10px; }
.msg-form textarea { flex: 1; resize: vertical; min-height: 44px; }
.msg-form .btn { height: 44px; }
.paie-up { display: flex; gap: 8px; margin-bottom: 12px; flex-wrap: wrap; } .paie-up .input { flex: 1; min-width: 150px; }
.paie-list { display: flex; flex-direction: column; gap: 6px; }
.paie-row { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 12px; }
.paie-ic { width: 34px; height: 34px; border-radius: 10px; background: var(--brand-tint); color: var(--brand); display: grid; place-items: center; }
@media (max-width: 1100px) { .sal-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); } .sal-grid { grid-template-columns: minmax(0, 1fr); } }

.sal-tiles .ts { font-size: 12px; color: var(--ink-3); margin-top: 1px; }
.push-banner { display: flex; align-items: center; gap: 10px; background: var(--brand-tint); border: 1px solid var(--brand-soft); color: var(--brand-deep, var(--brand)); border-radius: 12px; padding: 10px 14px; margin-bottom: 16px; font-size: 14px; }
.push-banner > span { flex: 1; }
.icon-btn { position: relative; }
.bell-on { position: absolute; top: 5px; right: 5px; width: 7px; height: 7px; border-radius: 50%; background: #4ADE80; }
.note-ph { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 8px; }
.note-img { width: 84px; height: 84px; border-radius: 10px; overflow: hidden; border: 1px solid var(--line); background: var(--bg); padding: 0; display: grid; place-items: center; cursor: zoom-in; position: relative; color: var(--ink-3); }
.note-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.note-img.pend { cursor: default; }
.np-x { position: absolute; top: 3px; right: 3px; width: 22px; height: 22px; border-radius: 50%; border: 0; background: rgba(0,0,0,.6); color: #fff; display: grid; place-items: center; padding: 0; }
@media print { .note-img { width: 120px; height: 120px; } }
.rdv-acts { display: flex; gap: 8px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--line); }
.rdv-acts .btn { flex: 1; justify-content: center; min-width: 0; white-space: nowrap; }
.rdv-acts .rv-win { flex: 1.8; background: var(--pos); color: #fff; border-color: var(--pos); }
.rdv-acts .rv-win:hover { filter: brightness(1.05); }
.rdv-acts .rv-lost { color: var(--neg); }
.ch-card[role=button] { cursor: pointer; }
.pc-niches { display: flex; flex-direction: column; gap: 8px; flex-basis: 100%; }
.niche-row { display: flex; align-items: flex-end; gap: 8px; flex-wrap: wrap; }
.niche-row .field { max-width: 120px; min-width: 0; flex: 1; }
.niche-row .pal-m2 { margin-bottom: 10px; }
.pc-opts { flex-direction: column; align-items: stretch; gap: 10px; }
.pc-grp { border: 1px solid var(--line); border-radius: 12px; padding: 10px 12px 12px; background: var(--card); }
.pc-grp:not(:has(.pc-chk)) { display: none; }
.pc-grp-h { display: flex; align-items: center; gap: 8px; font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--brand); margin-bottom: 8px; }
.pc-grp-h span { width: 20px; height: 20px; border-radius: 50%; background: var(--brand); color: #fff; display: grid; place-items: center; font-size: 11px; letter-spacing: 0; }
.pc-grp-b { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-end; }
@media print { .pc-grp:not(:has(.pc-chk.on)) { display: none; } }

.pc-opts { counter-reset: pcg; } .pc-grp { counter-increment: pcg; } .pc-grp-h span::before { content: counter(pcg); }

/* ═══════════ GESTION COMMERCIALE ═══════════ */
.row.c4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 760px) { .row.c4 { grid-template-columns: 1fr 1fr; } }
tr.off td { opacity: .5; }
.tabs { flex-wrap: wrap; }
.fx-chart rect { fill: var(--brand-soft); } .fx-chart rect.cur { fill: var(--brand); } .fx-chart rect.enc { fill: #7BC59A; }
.lg-dot { display: inline-block; width: 9px; height: 9px; border-radius: 2px; background: var(--brand); vertical-align: middle; } .lg-dot.enc { background: #7BC59A; }
.fx-hist { display: flex; flex-direction: column; font-size: 13.5px; padding: 7px 0; border-bottom: 1px solid var(--line-2); } .fx-hist span { font-size: 12px; }
.fx-cli-box { background: var(--bg); border-radius: 10px; padding: 10px 12px; font-size: 13.5px; line-height: 1.45; margin-top: 8px; }
.fx-edit { display: flex; flex-direction: column; gap: 18px; }
.fx-edit-top { align-items: start; }
.fx-lines { display: flex; flex-direction: column; gap: 6px; }
.fx-lh, .fx-l { display: grid; grid-template-columns: 26px minmax(220px, 1fr) 80px 70px 100px 64px 84px 100px 62px; gap: 6px; align-items: start; }
.fx-lh { font-size: 11.5px; text-transform: uppercase; letter-spacing: .06em; color: var(--ink-3); font-weight: 600; padding: 0 0 4px; border-bottom: 1px solid var(--line); }
.fx-l { padding: 6px 0; border-bottom: 1px dashed var(--line); }
.fx-l .input { padding: 7px 8px; font-size: 13.5px; min-width: 0; }
.fx-l > b.num { padding-top: 9px; font-size: 13.5px; text-align: right; }
.fx-des { display: flex; flex-direction: column; gap: 4px; } .fx-des textarea.sm { font-size: 12.5px; color: var(--ink-2); resize: vertical; min-height: 32px; }
.fx-l.sec { grid-template-columns: 26px 1fr 200px 62px; background: var(--brand-tint); border-radius: 10px; padding: 6px 4px; border: 0; }
.fx-l.sec .input { font-weight: 600; background: var(--card); } .fx-l.sec span { padding-top: 9px; font-size: 13px; text-align: right; }
.fx-l.txt { grid-template-columns: 26px 1fr 62px; }
.fx-mv { display: flex; flex-direction: column; } .fx-mv .icon-btn { width: 24px; height: 18px; font-size: 9px; color: var(--ink-3); padding: 0; }
.fx-la { display: flex; gap: 2px; padding-top: 4px; } .fx-la .icon-btn { width: 28px; height: 28px; color: var(--ink-3); }
.fx-tot-edit { display: flex; justify-content: space-between; align-items: flex-start; gap: 18px; margin-top: 14px; flex-wrap: wrap; }
.fx-tot-box { min-width: 320px; background: var(--bg); border-radius: 12px; padding: 10px 14px; display: flex; flex-direction: column; gap: 4px; font-size: 14px; }
.fx-tot-box div { display: flex; justify-content: space-between; gap: 20px; } .fx-tot-box .big { font-size: 17px; border-top: 1px solid var(--line); padding-top: 6px; margin-top: 2px; } .fx-tot-box .big b { color: var(--brand); }
.fx-choice .fx-opt { display: flex; gap: 12px; align-items: flex-start; border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px; cursor: pointer; }
.fx-choice .fx-opt:has(input:checked) { border-color: var(--brand); background: var(--brand-tint); }
.fx-choice .fx-opt.dis { opacity: .55; cursor: not-allowed; }
.fx-choice .fx-opt div { display: flex; flex-direction: column; gap: 3px; } .fx-choice .fx-opt span { font-size: 13px; color: var(--ink-2); }
.fx-pick-list { max-height: 55vh; overflow: auto; display: flex; flex-direction: column; gap: 4px; }
.fx-pick { display: flex; gap: 10px; align-items: center; padding: 7px 10px; border-radius: 10px; cursor: pointer; } .fx-pick:hover { background: var(--bg); }
.fx-pick span { display: flex; flex-direction: column; } .fx-pick small { color: var(--ink-3); font-size: 12px; }
.fx-pick:has(input:checked) { background: var(--brand-tint); }
.fx-tpls { display: flex; gap: 10px; flex-wrap: wrap; }
.fx-tpl { border: 2px solid var(--line); border-radius: 12px; background: var(--card); padding: 8px; display: flex; flex-direction: column; align-items: center; gap: 6px; font-size: 13px; cursor: pointer; }
.fx-tpl.on { border-color: var(--brand); background: var(--brand-tint); font-weight: 600; }
.fx-tpl-mini { width: 86px; height: 112px; background: #fff; border: 1px solid #DDE6E6; border-radius: 4px; position: relative; overflow: hidden; }
.fx-tpl-mini i { position: absolute; left: 8px; top: 8px; width: 22px; height: 12px; background: #C9D3D4; border-radius: 2px; }
.fx-tpl-mini b { position: absolute; right: 8px; top: 9px; width: 30px; height: 8px; background: var(--fxc); border-radius: 2px; }
.fx-tpl-mini u { display: block; position: absolute; left: 8px; right: 8px; height: 5px; background: #E7EDED; border-radius: 2px; }
.fx-tpl-mini u:nth-of-type(1) { top: 46px; background: var(--fxc); opacity: .85; } .fx-tpl-mini u:nth-of-type(2) { top: 58px; } .fx-tpl-mini u:nth-of-type(3) { top: 68px; }
.fx-tpl-mini s { position: absolute; right: 8px; bottom: 12px; width: 34px; height: 12px; background: var(--fxc); opacity: .25; border-radius: 2px; }
.fx-tpl-mini.tpl-moderne::before { content: ''; position: absolute; inset: 0 0 auto 0; height: 30px; background: var(--fxc); }
.fx-tpl-mini.tpl-moderne i { background: rgba(255,255,255,.7); } .fx-tpl-mini.tpl-moderne b { background: #fff; }
.fx-tpl-mini.tpl-epure u:nth-of-type(1) { background: #2b2b2b; height: 1px; } .fx-tpl-mini.tpl-epure b { background: #2b2b2b; } .fx-tpl-mini.tpl-epure s { background: #2b2b2b; opacity: .15; }
.fx-swatch { width: 26px; height: 26px; border-radius: 50%; border: 2px solid #fff; box-shadow: 0 0 0 1px var(--line); cursor: pointer; }
.fx-logo-row { display: flex; gap: 14px; align-items: center; } .fx-logo-box { width: 150px; height: 90px; border: 1px dashed var(--line); border-radius: 12px; display: grid; place-items: center; background: var(--card); padding: 8px; }
.fx-logo-box img { max-width: 100%; max-height: 100%; object-fit: contain; }
.fx-view { grid-template-columns: minmax(0, 1.6fr) minmax(280px, 1fr); align-items: start; }
.fx-paper-wrap, .fx-prev { background: var(--tint-2); border-radius: 14px; padding: 18px; overflow: auto; }
.fx-paper { background: var(--card); box-shadow: 0 6px 24px rgba(0,0,0,.12); width: 210mm; max-width: 100%; margin: 0 auto; }
@media (max-width: 1100px) { .fx-view { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 900px) {
  .fx-lh { display: none; }
  .fx-l:not(.sec):not(.txt) { grid-template-columns: 26px 1fr 1fr 1fr 60px; grid-template-areas: "mv des des des des" ". q u p p" ". r t tot act"; }
  .fx-l:not(.sec):not(.txt) > :nth-child(1) { grid-area: mv; } .fx-l:not(.sec):not(.txt) > :nth-child(2) { grid-area: des; } .fx-l:not(.sec):not(.txt) > :nth-child(3) { grid-area: q; } .fx-l:not(.sec):not(.txt) > :nth-child(4) { grid-area: u; }
  .fx-l:not(.sec):not(.txt) > :nth-child(5) { grid-area: p; } .fx-l:not(.sec):not(.txt) > :nth-child(6) { grid-area: r; } .fx-l:not(.sec):not(.txt) > :nth-child(7) { grid-area: t; } .fx-l:not(.sec):not(.txt) > :nth-child(8) { grid-area: tot; } .fx-l:not(.sec):not(.txt) > :nth-child(9) { grid-area: act; justify-content: flex-end; }
  .fx-l.sec { grid-template-columns: 26px 1fr 60px; } .fx-l.sec > span { display: none; }
  .fx-lines-card .card-head { flex-wrap: wrap; gap: 8px; }
  .fx-tot-box { min-width: 0; width: 100%; }
}

/* ── document imprimable (3 modèles) ── */
.fx-pdf-host { position: fixed; left: -10000px; top: 0; width: 210mm; background: var(--card); }
.fxp { --fxc: #1A5E69; font-family: inherit; color: #1D2A2C; font-size: 9.6pt; line-height: 1.38; padding: 14mm 13mm 10mm; background: #fff; }
.fxp.pdf { padding: 4mm 13mm 0; }
.fxp-head { display: flex; justify-content: space-between; gap: 18px; align-items: flex-start; margin-bottom: 8mm; }
.fxp-co { display: flex; gap: 12px; align-items: flex-start; font-size: 8.8pt; color: #4A5B5E; }
.fxp-co img { max-height: 22mm; max-width: 50mm; object-fit: contain; }
.fxp-co b { color: #1D2A2C; font-size: 10.5pt; }
.fxp-title { text-align: right; } .fxp-title h1 { font-size: 21pt; letter-spacing: .06em; margin: 0 0 4px; color: var(--fxc); font-weight: 700; }
.fxp-title table { margin-left: auto; border-collapse: collapse; font-size: 9pt; } .fxp-title td { padding: 1px 0 1px 12px; text-align: right; white-space: nowrap; } .fxp-title td:first-child { color: #6B7C7F; }
.fxp-parties { display: grid; grid-template-columns: 1fr 1fr; gap: 10mm; margin-bottom: 5mm; }
.fxp-box { border: 1px solid #D5E0E0; border-radius: 6px; padding: 3mm 4mm; font-size: 9.4pt; min-height: 20mm; }
.fxp-box span { display: block; font-size: 7.6pt; text-transform: uppercase; letter-spacing: .1em; color: var(--fxc); font-weight: 700; margin-bottom: 2px; }
.fxp-client { border-color: var(--fxc); }
.fxp-objet { margin: 0 0 4mm; font-size: 10pt; } .fxp-objet span { font-weight: 700; color: var(--fxc); }
.fxp-lines { width: 100%; border-collapse: collapse; font-size: 9pt; }
.fxp-lines th { background: var(--fxc); color: #fff; font-weight: 600; text-align: left; padding: 2.2mm 2mm; font-size: 8.2pt; text-transform: uppercase; letter-spacing: .04em; }
.fxp-lines td { padding: 2mm; border-bottom: 1px solid #E4ECEC; vertical-align: top; }
.fxp-lines .r { text-align: right; white-space: nowrap; } .fxp-lines .ref { color: #6B7C7F; font-size: 8pt; width: 14mm; }
.fxp-lines .des div { color: #5A6B6E; font-size: 8.4pt; margin-top: 1px; } .fxp-lines .rem { color: #8C3A0F; font-size: 7.6pt; }
.fxp-lines tr.sec td { font-weight: 700; color: var(--fxc); background: var(--fxc-soft, #EEF5F5); border-bottom: 0; padding-top: 2.6mm; }
.fxp-lines tr.txt td { color: #4A5B5E; font-style: italic; }
.fxp-lines tr { break-inside: avoid; }
.fxp-bottom { display: grid; grid-template-columns: 1fr 72mm; gap: 8mm; margin-top: 5mm; break-inside: avoid; }
.fxp-tva { border-collapse: collapse; font-size: 8.4pt; margin-bottom: 3mm; } .fxp-tva th { text-align: left; color: #6B7C7F; font-weight: 600; padding: 1mm 3mm 1mm 0; border-bottom: 1px solid #D5E0E0; } .fxp-tva td { padding: 1mm 3mm 1mm 0; } .fxp-tva .r { text-align: right; }
.fxp-txt { font-size: 8.4pt; color: #3E4F52; margin-bottom: 3mm; } .fxp-txt b { color: #1D2A2C; }
.fxp-tot { display: flex; flex-direction: column; gap: 1.2mm; font-size: 9.4pt; }
.fxp-tot div { display: flex; justify-content: space-between; gap: 10px; }
.fxp-tot .ttc { background: var(--fxc); color: #fff; border-radius: 4px; padding: 2.4mm 3mm; font-size: 11.5pt; margin-top: 1mm; } .fxp-tot .ttc b { font-size: 12.5pt; }
.fxp-tot .sub { font-size: 9pt; color: #3E4F52; padding: 0 3mm; }
.fxp-notes { margin-top: 4mm; border-left: 3px solid var(--fxc); padding-left: 3mm; }
.fxp-mention { margin-top: 4mm; font-size: 7.8pt; color: #3E4F52; border: 1px dashed #B9C8C9; border-radius: 6px; padding: 2.5mm 3mm; break-inside: avoid; }
.fxp-sign { display: grid; grid-template-columns: 1fr 72mm; gap: 8mm; margin-top: 5mm; font-size: 8.6pt; break-inside: avoid; }
.fxp-sign-box { border: 1px solid #C9D6D7; border-radius: 6px; height: 26mm; }
.fxp-cgv { margin-top: 4mm; font-size: 7.4pt; }
.fxp-foot { margin-top: 6mm; border-top: 1px solid #D5E0E0; padding-top: 2mm; font-size: 7.1pt; color: #6B7C7F; text-align: center; display: flex; flex-direction: column; gap: 1mm; break-inside: avoid; }
.fx-miss { color: #C2410C; font-weight: 700; }
/* moderne */
.fxp.tpl-moderne { padding-top: 0; }
.fxp.tpl-moderne .fxp-head { background: var(--fxc); color: #fff; margin: 0 -13mm 8mm; padding: 9mm 13mm 7mm; }
.fxp.tpl-moderne.pdf .fxp-head { margin-top: -4mm; }
.fxp.tpl-moderne .fxp-co, .fxp.tpl-moderne .fxp-co b, .fxp.tpl-moderne .fxp-title h1, .fxp.tpl-moderne .fxp-title td { color: #fff; }
.fxp.tpl-moderne .fxp-title td:first-child { color: rgba(255,255,255,.75); }
.fxp.tpl-moderne .fxp-co img { background: #fff; border-radius: 6px; padding: 2mm; }
.fxp.tpl-moderne .fxp-box { background: #F4F7F7; border: 0; border-left: 3px solid var(--fxc); border-radius: 0 6px 6px 0; }
.fxp.tpl-moderne .fxp-lines th { background: #F0F4F4; color: var(--fxc); border-bottom: 2px solid var(--fxc); }
/* épuré */
.fxp.tpl-epure { --fxc: #222; }
.fxp.tpl-epure .fxp-title h1 { font-weight: 300; letter-spacing: .18em; color: #111; }
.fxp.tpl-epure .fxp-box { border: 0; border-top: 1px solid #111; border-radius: 0; padding-left: 0; }
.fxp.tpl-epure .fxp-box span { color: #111; }
.fxp.tpl-epure .fxp-lines th { background: none; color: #111; border-bottom: 1.5px solid #111; padding-left: 0; }
.fxp.tpl-epure .fxp-lines td { padding-left: 0; }
.fxp.tpl-epure .fxp-lines tr.sec td { background: none; color: #111; text-transform: uppercase; letter-spacing: .06em; font-size: 8.4pt; }
.fxp.tpl-epure .fxp-tot .ttc { background: none; color: #111; border-top: 1.5px solid #111; border-bottom: 1.5px solid #111; border-radius: 0; padding-left: 0; padding-right: 0; }
@media print {
  body.print-fx #print-doc .fxp { padding: 0; } body.print-fx #print-doc .fxp.tpl-moderne .fxp-head { margin: 0 0 8mm; border-radius: 4px; }
  .fxp, .fxp * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}


/* ═══════════ CARRONOVA — marque, thème sombre, accueil ═══════════ */
.cn-brand { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; color: inherit; }
.cn-brand img { width: 34px; height: 34px; border-radius: 9px; display: block; }
.cn-brand span { font-weight: 300; letter-spacing: .22em; font-size: 17px; white-space: nowrap; }
.cn-brand span b { font-weight: 600; color: var(--brand-hi); }
.cn-brand.lg img { width: 44px; height: 44px; border-radius: 11px; } .cn-brand.lg span { font-size: 21px; }
.cn-brand.sm img { width: 26px; height: 26px; border-radius: 7px; } .cn-brand.sm span { font-size: 14px; }
.login .cn-brand { margin-bottom: 8px; } .login .cn-brand span { color: #fff; }
.sb-logo .cn-brand span { color: #fff; }
.sb-ent { margin-top: 10px; font-size: 12px; color: rgba(255,255,255,.55); letter-spacing: .04em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.topbar .cn-brand img { width: 30px; height: 30px; } .topbar .cn-brand span { font-size: 15px; color: #fff; }
[data-theme="dark"] body { background: var(--bg); }
[data-theme="dark"] .input, [data-theme="dark"] select.input, [data-theme="dark"] textarea.input, [data-theme="dark"] input, [data-theme="dark"] select, [data-theme="dark"] textarea { background-color: var(--tint); color: var(--ink); border-color: var(--line); }
[data-theme="dark"] .modal, [data-theme="dark"] .modal-box, [data-theme="dark"] .sheet { background: var(--card); color: var(--ink); }
[data-theme="dark"] .bottom-nav { background: var(--side-bg); border-top-color: var(--side-line); }
[data-theme="dark"] .bottom-nav button { color: rgba(255,255,255,.6); } [data-theme="dark"] .bottom-nav button.active { color: var(--brand-hi); }
[data-theme="dark"] .btn.light { background: var(--tint-2); color: var(--ink); border-color: var(--line); }
[data-theme="dark"] .chip { background: var(--tint); color: var(--ink-2); border-color: var(--line); }
[data-theme="dark"] .chip.on { background: var(--brand-soft); color: var(--brand-hi); border-color: var(--brand); }
[data-theme="dark"] .tbl th { background: var(--tint); color: var(--ink-3); }
[data-theme="dark"] .toast { background: #1E2A26; color: #fff; }
[data-theme="dark"] ::placeholder { color: var(--ink-3); }
[data-theme="dark"] img.fx-logo-prev { background: #fff; border-radius: 6px; }

/* Accueil public */
.ln { min-height: 100vh; background: radial-gradient(1100px 600px at 85% -10%, rgba(19,163,114,.20), transparent 60%), radial-gradient(900px 500px at -10% 40%, rgba(19,163,114,.10), transparent 60%), var(--bg); color: var(--ink); }
.ln-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: calc(16px + env(safe-area-inset-top)) clamp(16px, 5vw, 64px) 16px; max-width: 1240px; margin: 0 auto; }
.ln-top .cn-brand span { color: var(--ink); }
.ln-top-a { display: flex; align-items: center; gap: 8px; }
.ln-top-a .icon-btn:hover { background: var(--tint-2); }
.ln-hero { display: grid; grid-template-columns: 1.15fr .85fr; gap: clamp(24px, 4vw, 64px); align-items: center; padding: clamp(24px, 6vh, 72px) clamp(16px, 5vw, 64px); max-width: 1240px; margin: 0 auto; }
.ln-kicker { display: inline-block; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; color: var(--brand-txt); background: var(--brand-soft); border-radius: 999px; padding: 5px 12px; margin-bottom: 18px; font-weight: 500; }
.ln-hero h1 { font-size: clamp(32px, 4.6vw, 56px); line-height: 1.05; letter-spacing: -.025em; font-weight: 600; margin: 0 0 18px; }
.ln-hero h1 span { color: var(--brand-txt); }
.ln-hero p { font-size: 17px; color: var(--ink-2); max-width: 560px; margin: 0 0 26px; line-height: 1.6; }
.ln-cta { display: flex; gap: 10px; flex-wrap: wrap; }
.ln-cta .btn { padding: 13px 20px; font-size: 15.5px; }
.ln-small { margin-top: 16px; font-size: 13px; color: var(--ink-3); }
.ln-card { background: var(--card); border: 1px solid var(--line); border-radius: 20px; padding: 26px; box-shadow: var(--shadow); }
.ln-card h2 { margin: 0 0 4px; font-size: 22px; font-weight: 600; }
.ln-card form { margin-top: 16px; }
.ln-card .btn.primary { width: 100%; justify-content: center; padding: 12px; }
.ln-who { margin: 12px 0 4px; }
.ln-alt { margin-top: 14px; font-size: 13.5px; color: var(--ink-3); text-align: center; }
.ln-alt a { color: var(--brand-txt); }
.ln-msg { margin-top: 12px; padding: 10px 12px; border-radius: 10px; background: var(--neg-soft); color: var(--neg); font-size: 14px; }
.ln-msg.ok { background: var(--pos-soft); color: var(--pos); }
.ln-cgu { display: flex; gap: 8px; align-items: flex-start; font-size: 13px; color: var(--ink-2); }
.ln-feat { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; padding: 24px clamp(16px, 5vw, 64px) 40px; max-width: 1240px; margin: 0 auto; }
.ln-f { background: var(--card); border: 1px solid var(--line); border-radius: 16px; padding: 22px; }
.ln-fi { width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; background: var(--brand-soft); color: var(--brand-txt); margin-bottom: 14px; }
.ln-f h3 { margin: 0 0 6px; font-size: 17px; font-weight: 600; } .ln-f p { margin: 0; color: var(--ink-2); font-size: 14.5px; line-height: 1.55; }
.ln-band { display: grid; grid-template-columns: 1.3fr .7fr; gap: 28px; align-items: center; margin: 20px auto 40px; max-width: 1112px; padding: 34px; border-radius: 24px; background: linear-gradient(140deg, #0E1A16, #0A2A1F 60%, #0E8A62 160%); color: #E6EEEB; }
.ln-band h2 { margin: 0 0 10px; font-size: 28px; letter-spacing: -.01em; font-weight: 600; } .ln-band p { margin: 0; color: rgba(230,238,235,.75); line-height: 1.6; }
.ln-price { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); border-radius: 18px; padding: 22px; }
.ln-p-k { font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: #4ADE9F; } .ln-p-v { font-size: 26px; font-weight: 600; margin: 4px 0 12px; }
.ln-price ul { list-style: none; padding: 0; margin: 0 0 16px; display: flex; flex-direction: column; gap: 7px; font-size: 14.5px; } .ln-price li { display: flex; gap: 8px; align-items: center; } .ln-price li .ico { color: #4ADE9F; }
.ln-price .btn { width: 100%; justify-content: center; }
.ln-foot { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; padding: 22px clamp(16px, 5vw, 64px) calc(22px + env(safe-area-inset-bottom)); max-width: 1240px; margin: 0 auto; border-top: 1px solid var(--line); color: var(--ink-3); font-size: 13px; }
.ln-foot .cn-brand span { color: var(--ink); }
.ln-pay, .ln-admin { max-width: 1240px; margin: 0 auto; padding: 24px clamp(16px, 5vw, 64px) 60px; }
.ln-pay .ln-card { max-width: 520px; margin: 6vh auto; }
.ln-pay .ln-card p { color: var(--ink-2); line-height: 1.6; }
.ln-admin code { background: var(--tint-2); padding: 2px 6px; border-radius: 6px; font-size: 12.5px; }
@media (max-width: 900px) { .ln-hero, .ln-band { grid-template-columns: 1fr; } .ln-feat { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .ln-feat { grid-template-columns: 1fr; } .ln-top-a .btn.light { display: none; } .ln-band { margin: 12px; padding: 22px; } .ln-hero h1 { font-size: 32px; } }
.input-unit { display: flex; align-items: stretch; }
.input-unit .input { border-top-right-radius: 0; border-bottom-right-radius: 0; min-width: 0; flex: 1; }
.input-unit span { display: grid; place-items: center; padding: 0 10px; font-size: 12.5px; color: var(--ink-3); background: var(--tint-2); border: 1px solid var(--line); border-left: 0; border-radius: 0 var(--radius-sm) var(--radius-sm) 0; white-space: nowrap; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 14px; }
@media (max-width: 560px) { .form-grid { grid-template-columns: 1fr; } }
.kv-list { display: flex; flex-direction: column; }
.kv-list div { display: flex; justify-content: space-between; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--line-2); }
.kv-list div:last-child { border-bottom: 0; }
.kv-list b { font-weight: 500; text-align: right; }

a.btn { text-decoration: none; }
.reg-save { justify-content: flex-end; margin-top: 18px; position: sticky; bottom: 12px; z-index: 5; }
.reg-save .btn { box-shadow: 0 6px 20px rgba(0,0,0,.25); }
.reg-narrow { max-width: 820px; }
.reg-sec { font-size: 11.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--brand-txt); font-weight: 600; margin-top: 6px; padding-top: 10px; border-top: 1px solid var(--line-2); }
.reg-sec:first-of-type { border-top: 0; padding-top: 0; margin-top: 0; }
.fx-params:not(.grid-2) { display: grid; grid-template-columns: repeat(auto-fit, minmax(380px, 1fr)); gap: 18px; align-items: start; }
.fx-params:not(.grid-2) > .stack { display: contents; }
@media (max-width: 560px) { .fx-params:not(.grid-2) { grid-template-columns: 1fr; } }
.droits-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
@media (max-width: 560px) { .droits-grid { grid-template-columns: 1fr; } }
.droit { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; border: 1px solid var(--line); border-radius: 12px; cursor: pointer; background: var(--tint); transition: border-color .12s, background .12s; }
.droit input { margin-top: 3px; accent-color: var(--brand); }
.droit.on { border-color: var(--brand); background: var(--brand-tint); }
.droit-ic { width: 28px; height: 28px; border-radius: 8px; display: grid; place-items: center; background: var(--brand-soft); color: var(--brand-txt); flex: none; }
.droit b { display: block; font-weight: 500; font-size: 14px; }
.droit small { display: block; color: var(--ink-3); font-size: 12px; line-height: 1.35; margin-top: 2px; }
/* CGV */
.cgv-area { font-size: 13px; line-height: 1.5; min-height: 260px; }
.fxp-cgv p { margin: 0 0 1.6mm; }
.fxp-cgvpage { page-break-before: always; break-before: page; padding-top: 2mm; color: #1D2A2C; }
.fxp-cgvpage h2 { font-size: 13pt; margin: 0 0 1mm; color: var(--fxc, #0E8A62); letter-spacing: .01em; }
.fxp-cgvsub { font-size: 8pt; color: #6B7C7F; margin-bottom: 4mm; padding-bottom: 2.5mm; border-bottom: 1px solid #DCE5E1; }
.fxp-cgvcols { column-count: 2; column-gap: 7mm; font-size: 7.3pt; line-height: 1.42; text-align: justify; color: #2B3A3D; }
.fxp-cgvcols p { margin: 0 0 2.2mm; break-inside: avoid-column; }
.fxp-cgvcols b { color: #1D2A2C; display: inline-block; margin-bottom: .4mm; }
.fxp-cgvsign { margin-top: 6mm; margin-left: auto; width: 46%; height: 26mm; border: 1px solid #CFDAD6; border-radius: 2mm; padding: 2.5mm; font-size: 7.5pt; color: #4A5A54; }
.sb-me { display: flex; align-items: center; gap: 10px; flex: 1; min-width: 0; background: none; border: 0; padding: 4px; margin: -4px; border-radius: 10px; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.sb-me:hover { background: rgba(255,255,255,.07); }
.sb-me .who span { display: inline-flex; align-items: center; gap: 4px; }
.sb-me .who .ico { width: 11px; height: 11px; }
.tb-me { display: inline-flex; align-items: center; gap: 5px; background: none; border: 0; color: inherit; font: inherit; font-size: 14px; padding: 6px 8px; border-radius: 8px; cursor: pointer; }
.tb-me .ico { width: 12px; height: 12px; opacity: .7; }
.tb-me:hover { background: rgba(255,255,255,.08); }
.sb-user { flex-wrap: wrap; row-gap: 6px; }
.sb-user .sb-me { flex: 1 1 100%; margin: 0 0 2px; }
.sb-user .sb-me .who span { white-space: nowrap; }
.sb-user > .icon-btn { flex: 1; }