/* Habillage du CRM, chargé après style.css : variables et composants partagés avec l'identité de la vitrine. Ne jamais utiliser !important. */
:root {
  --r: 16px; --r-carte: 28px; --r-btn: 999px; --r-champ: 12px;
  --f-titre: "Google Sans", sans-serif;
  --t-jaune: #F1D66E; --t-bleu: #A9C9F2; --t-vert: #A8DDBB; --t-corail: #F0B7AC; --t-lavande: #C3BDF0; --t-sable: #DDD3B0;
  --relief: 0 1px 0 rgba(255, 255, 255, .6) inset, 0 18px 36px -24px rgba(15, 25, 45, .28), 0 3px 8px -4px rgba(15, 25, 45, .12);
  --relief-doux: 0 12px 26px -20px rgba(15, 25, 45, .22);
  --halo: rgba(30, 58, 102, .10);
  --duree: 150ms;
  --bg: #FFFFFF; --surface: #F4F4F3; --sunk: #E9E9E7; --line: #DCDCDA;
}
@media (prefers-color-scheme: dark) {
  :root {
    --t-jaune: #6B5A1D; --t-bleu: #27456C; --t-vert: #245443; --t-corail: #6A3029; --t-lavande: #3D3670; --t-sable: #4A4631;
    --relief: 0 1px 0 rgba(255, 255, 255, .05) inset, 0 22px 40px -22px rgba(0, 0, 0, .7), 0 2px 6px -2px rgba(0, 0, 0, .5);
    --relief-doux: 0 12px 26px -18px rgba(0, 0, 0, .6);
    --halo: rgba(142, 169, 218, .12);
    --bg: #0D0D0E; --surface: #1D1D1F; --sunk: #2B2B2E; --line: #303033;
  }
}
@media (prefers-reduced-motion: reduce) { :root { --duree: 0ms; } }

/* Boutons : pastilles, primaire encre, secondaire à contour fin */
.btn { border-radius: var(--r-btn); padding: 8px 16px; font-weight: 600; background: transparent; border: 1px solid var(--muted); box-shadow: none; transition: background-color var(--duree), color var(--duree), border-color var(--duree); }
.btn:hover { border-color: var(--ink); }
.btn.primary { background: var(--accent); color: var(--accent-ink); border-color: var(--accent); }
.btn.primary:not(:disabled):hover { background: transparent; color: var(--accent); opacity: 1; filter: none; }
@media (prefers-color-scheme: dark) { .btn.primary { background: var(--strong); color: var(--bg); border-color: var(--strong); } .btn.primary:not(:disabled):hover { background: transparent; color: var(--strong); } }
.btn.sm { padding: 4px 12px; }
@media (max-width: 760px) { .btn { min-height: 44px; } .btn.sm.ghost { min-width: 44px; } }
/* Fin des boutons */

/* Cartes : fonds neutres, coins de 16 px, repère de couleur sur les indicateurs, titres de la charte */
.kpi { border: 0; border-radius: 16px; box-shadow: none; background: var(--surface); }
.kpi:nth-child(4n + 1) { --t: #F1D66E; }
.kpi:nth-child(4n + 2) { --t: #A9C9F2; }
.kpi:nth-child(4n + 3) { --t: #A8DDBB; }
.kpi:nth-child(4n + 4) { --t: #F0B7AC; }
@media (prefers-color-scheme: light) { .kpi:nth-child(4n + 1) { --t: #9A7400; } .kpi:nth-child(4n + 2) { --t: #3F6FAE; } .kpi:nth-child(4n + 3) { --t: #2F8456; } .kpi:nth-child(4n + 4) { --t: #C0503F; } }
.kpi::before { content: ""; display: block; width: 26px; height: 4px; border-radius: 2px; background: var(--t); margin-bottom: 10px; }
.kpi .val { font-family: var(--f-titre); font-weight: 500; letter-spacing: -.03em; color: var(--strong); }
.panel, .sec, .ap, .cattile { border: 0; border-radius: 16px; box-shadow: none; }
.panel > header h2, .sec > h3, .top h1 { font-family: var(--f-titre); font-weight: 500; letter-spacing: -.03em; }
@media (min-width: 761px) { .top h1 { font-size: clamp(26px, 2.4vw, 34px); line-height: 1.05; } }
input, select, textarea { border-radius: var(--r-champ); }
input, select, textarea { border-color: #8C8C88; }
@media (prefers-color-scheme: dark) { input, select, textarea { border-color: #7A7A7E; } }
.toast { border-radius: 999px; }
/* Fin des cartes */

/* Menu latéral : page active en gris avec repère jaune */
.nav button { border-radius: 8px; transition: background-color var(--duree), color var(--duree); }
.nav button:hover { background: var(--sunk); color: var(--ink); }
.nav button[aria-current="page"] { background: var(--sunk); color: var(--ink); box-shadow: inset 3px 0 0 var(--mark); font-weight: 600; }
.brand strong { font-family: var(--f-titre); font-weight: 500; letter-spacing: -.03em; }
.acct { border-radius: var(--r-champ); }
/* Fin du menu */

/* Vie 1 : icônes du menu, repères de couleur du pipeline, transitions douces, états vides, finitions (CSS seul, aucune modification de structure) */
@media (min-width: 761px) {
  .app { grid-template-columns: 236px minmax(0, 1fr); }
  .nav button[data-view] { display: grid; grid-template-columns: 16px 1fr auto; column-gap: 10px; row-gap: 1px; align-items: center; }
  .nav button[data-view]::before { content: ""; grid-column: 1; grid-row: 1; width: 16px; height: 16px; background: currentColor; opacity: .8; -webkit-mask: var(--ico) center / contain no-repeat; mask: var(--ico) center / contain no-repeat; }
  .nav button[data-view] .nl { grid-column: 2; grid-row: 1; }
  .nav button.nav-logout { display: grid; grid-template-columns: 16px 1fr auto; column-gap: 10px; row-gap: 1px; align-items: center; }
  .nav button.nav-logout::before { content: ""; grid-column: 1; grid-row: 1; width: 16px; height: 16px; background: currentColor; opacity: .8; -webkit-mask: var(--ico) center / contain no-repeat; mask: var(--ico) center / contain no-repeat; }
  .nav button.nav-logout .nl { grid-column: 2; grid-row: 1; }
  .nav button[data-view] .count { grid-column: 2; grid-row: 2; }
  .nav button.inl[data-view] .count { grid-column: 3; grid-row: 1; }
  .nav button[aria-current="page"]::before { opacity: 1; }
}
.nav button[data-view="dash"] { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11l9-7 9 7v9a1 1 0 0 1-1 1h-5v-6h-6v6H4a1 1 0 0 1-1-1z'/%3E%3C/svg%3E"); }
.nav button[data-view="demandes"] { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 5h16v11H8l-4 4z'/%3E%3C/svg%3E"); }
.nav button[data-view="pipe"] { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 5h16l-6 8v6l-4-2v-4z'/%3E%3C/svg%3E"); }
.nav button[data-view="prospects"] { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21c1-4 4-6 8-6s7 2 8 6'/%3E%3C/svg%3E"); }
.nav button[data-view="clients"] { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='8' r='3.5'/%3E%3Cpath d='M2 20c1-3.5 3.5-5 7-5s6 1.5 7 5'/%3E%3Cpath d='M16 4.5a3.5 3.5 0 0 1 0 7M18 15c2 .6 3.4 2.3 4 5'/%3E%3C/svg%3E"); }
.nav button[data-view="ech"] { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='5' width='16' height='15' rx='2'/%3E%3Cpath d='M4 10h16M9 3v4M15 3v4'/%3E%3C/svg%3E"); }
.nav button[data-view="agenda"] { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E"); }
.nav button[data-view="notes"] { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3h9l4 4v14H6z'/%3E%3Cpath d='M9 12h7M9 16h7'/%3E%3C/svg%3E"); }
.nav button[data-view="ia"] { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l2 5 5 2-5 2-2 5-2-5-5-2 5-2z'/%3E%3C/svg%3E"); }
.nav button[data-view="comm"] { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M15 9.5c-.6-1-1.6-1.5-3-1.5-1.7 0-3 .8-3 2s1.2 1.6 3 2 3 .8 3 2-1.3 2-3 2c-1.4 0-2.5-.5-3-1.5'/%3E%3Cpath d='M12 6v2M12 16v2'/%3E%3C/svg%3E"); }
.nav button[data-view="gestion"] { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 20V10M10 20V4M16 20v-7M22 20H2'/%3E%3C/svg%3E"); }
.nav button[data-view="cies"] { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 21V7l8-4 8 4v14'/%3E%3Cpath d='M9 21v-6h6v6'/%3E%3C/svg%3E"); }
.nav button[data-view="apporteurs"] { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12l5-5 4 4 7-7'/%3E%3Cpath d='M16 4h4v4'/%3E%3C/svg%3E"); }
.nav button[data-view="reglages"] { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='M12 2v3M12 19v3M2 12h3M19 12h3M5 5l2 2M17 17l2 2M19 5l-2 2M7 17l-2 2'/%3E%3C/svg%3E"); }
.nav button[data-view="suggestions"] { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18h6M10 21h4'/%3E%3Cpath d='M12 3a6 6 0 0 0-3.5 10.9c.6.5 1 1.2 1 2.1h5c0-.9.4-1.6 1-2.1A6 6 0 0 0 12 3z'/%3E%3C/svg%3E"); }
.nav button.nav-logout { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 4H5a1 1 0 0 0-1 1v14a1 1 0 0 0 1 1h4'/%3E%3Cpath d='M16 8l4 4-4 4M20 12H9'/%3E%3C/svg%3E"); }
.col { position: relative; padding-top: 22px; }
.col::before { content: ""; position: absolute; top: 9px; left: 16px; right: 16px; height: 3px; border-radius: 2px; background: var(--t); }
.col:nth-child(5n + 1) { --t: #A9C9F2; } .col:nth-child(5n + 2) { --t: #F1D66E; } .col:nth-child(5n + 3) { --t: #C3BDF0; } .col:nth-child(5n + 4) { --t: #A8DDBB; } .col:nth-child(5n + 5) { --t: #F0B7AC; }
.card { transition: transform var(--duree), box-shadow var(--duree); }
.card:hover { transform: translateY(-2px); box-shadow: var(--relief-doux); }
.kpi, .panel, .sec { transition: box-shadow var(--duree); }
.empty { text-align: center; padding: 28px 20px; border-radius: var(--r-champ); background: var(--surface); }
.empty::before { content: ""; display: block; width: 36px; height: 36px; margin: 0 auto 10px; background: var(--muted); opacity: .7; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 13l3-8h12l3 8v6a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1z'/%3E%3Cpath d='M3 13h5l1 3h6l1-3h5'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 13l3-8h12l3 8v6a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1z'/%3E%3Cpath d='M3 13h5l1 3h6l1-3h5'/%3E%3C/svg%3E") center / contain no-repeat; }
::selection { background: var(--mark); color: var(--mark-ink); }
html { scrollbar-width: thin; scrollbar-color: var(--line) transparent; }
/* Fin de Vie 1 */

/* Vie 2 : initiales colorées (début) */
.ini { display: inline-flex; align-items: center; justify-content: center; flex: none; box-sizing: border-box; width: 28px; height: 28px; margin-right: 8px; border-radius: 50%; vertical-align: middle; font: 600 11px/1 var(--f-body); letter-spacing: .02em; color: var(--strong); background: var(--t-sable); }
.ini-jaune { background: var(--t-jaune); } .ini-bleu { background: var(--t-bleu); } .ini-vert { background: var(--t-vert); } .ini-corail { background: var(--t-corail); } .ini-lavande { background: var(--t-lavande); } .ini-sable { background: var(--t-sable); }
.row .who .ini + .lnm { max-width: calc(100% - 36px); }
.liste-contacts td:has(> div > .ini) > .sub2 { padding-left: 36px; }
@media (forced-colors: active) { .ini { border: 1px solid CanvasText; } }
/* Vie 2 : initiales colorées (fin) */
/* Vie 2 : salutation (début) */
.top .dash-phrase { color: var(--ink); font-size: 15px; }
/* Vie 2 : salutation (fin) */
/* Vie 2 : actions rapides (début) */
.dash-rapides { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0 4px; }
.dash-rapide { display: inline-flex; align-items: center; gap: 8px; }
.dash-rapide::before { content: ""; width: 16px; height: 16px; flex: none; background: currentColor; opacity: .8; -webkit-mask: var(--ico) center / contain no-repeat; mask: var(--ico) center / contain no-repeat; }
.dash-rapide[data-rapide="prospect"] { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='10' cy='8' r='4'/%3E%3Cpath d='M2 21c1-4 4-6 8-6'/%3E%3Cpath d='M18 8v6M15 11h6'/%3E%3C/svg%3E"); }
.dash-rapide[data-rapide="import"] { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 16V4M7 9l5-5 5 5'/%3E%3Cpath d='M4 16v3a1 1 0 0 0 1 1h14a1 1 0 0 0 1-1v-3'/%3E%3C/svg%3E"); }
.dash-rapide[data-rapide="bordereau"] { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3h9l4 4v14H6z'/%3E%3Cpath d='M9 9h3M9 13h7M9 17h7'/%3E%3C/svg%3E"); }
.dash-rapide[data-rapide="formulaire"] { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 3L3 10l7 3 3 7z'/%3E%3Cpath d='M10 13L21 3'/%3E%3C/svg%3E"); }
/* Vie 2 : actions rapides (fin) */
/* Vie 2 : totaux du pipeline (début) */
.pipe-ind .pipe-tot { color: var(--strong); font-weight: 600; }
/* Vie 2 : totaux du pipeline (fin) */
/* Vie 2 : états vides (début) */
.empty-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 14px; }
/* Vie 2 : états vides (fin) */
/* Vie 2 : cartouches de la fiche sur téléphone (début) */
@media (max-width: 760px) {
  .f-head #d-headinfo { display: flex; flex-direction: column; gap: 8px; }
  .f-head .numero, .f-head .tags { gap: 8px; align-items: center; }
  .f-head .numero .chip, .f-head .tags .chip { display: inline-block; box-sizing: border-box; min-height: 24px; padding: 2px 8px; font-size: 12.5px; line-height: 20px; border-radius: 6px; }
  .f-head .contact { gap: 4px 14px; font-size: 14px; }
  .f-head .f-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; overflow: visible; padding-bottom: 0; }
  .f-head .f-actions > * { min-width: 0; width: 100%; box-sizing: border-box; justify-content: center; text-align: center; white-space: normal; overflow-wrap: anywhere; }
  .f-head .f-actions > .lockwrap { display: flex; }
  .f-head .f-actions > .lockwrap > .btn { width: 100%; justify-content: center; text-align: center; white-space: normal; overflow-wrap: anywhere; box-sizing: border-box; }
  .f-head .f-actions .btn { padding-left: 10px; padding-right: 10px; font-size: 14px; text-wrap: balance; }
}
/* Vie 2 : cartouches de la fiche sur téléphone (fin) */
