/* Thème « Clarté » : SaaS moderne, menu flottant, tuiles arrondies, bleu Héaux #234bdc et touche corail #f17655.
   Actif seulement quand l'administrateur le choisit (html[data-skin="clarte"]) ; le rendu classique n'est pas modifié. */
html[data-skin="clarte"]{--cl-bg:#f2f4fa;--cl-card:#fff;--cl-ink:#131a35;--cl-mut:#74809f;--cl-line:#e6eaf4;--cl-blue:#234bdc;--cl-blue-2:#e8edff;--cl-coral:#f17655;--cl-coral-2:#fff0ea;--cl-green:#139a68;--cl-green-2:#e1f5ec;--cl-amber:#c97d10;--cl-amber-2:#fff3dc;--cl-violet:#6a57d8;--cl-violet-2:#eeebff;--cl-shadow:0 8px 30px #20306a0f;
 --blue:#234bdc;--ink:#131a35;--muted:#74809f;--border:#e6eaf4;--bg:#f2f4fa;--suite-blue:#234bdc;--suite-text:#131a35;--suite-bg:#f2f4fa}
html[data-skin="clarte"] body{background:var(--cl-bg);color:var(--cl-ink);font-family:'DM Sans',Arial,sans-serif}
html[data-skin="clarte"] h1,html[data-skin="clarte"] h2,html[data-skin="clarte"] h3{font-family:Manrope,Arial,sans-serif;letter-spacing:-.025em;color:var(--cl-ink)}

/* Menu de gauche : bloc flottant arrondi (bureau uniquement ; le menu mobile reste celui du CRM) */
html[data-skin="clarte"] .sidebar{background:var(--cl-card);border:0;box-shadow:var(--cl-shadow)}
html[data-skin="clarte"] .sidebar .brand{background:none}
html[data-skin="clarte"] .sidebar .heaux-logo{border-radius:12px}
html[data-skin="clarte"] .sidebar .nav-caption{color:#a0a9c2;letter-spacing:.14em}
html[data-skin="clarte"] .sidebar .quick-search{background:var(--cl-bg);border:0;border-radius:14px;color:var(--cl-mut)}
html[data-skin="clarte"] .sidebar .quick-search input:not([type=checkbox]):not([type=radio]){background:transparent;color:var(--cl-ink);border:0;outline:0;font-size:13px}
html[data-skin="clarte"] .sidebar .quick-search input::placeholder{color:var(--cl-mut)}
html[data-skin="clarte"] .sidebar .quick-icon{color:var(--cl-mut)}
html[data-skin="clarte"] .sidebar nav button{color:#59658a;border-radius:14px;font-weight:550;min-height:44px}
html[data-skin="clarte"] .sidebar nav button:hover{background:#f4f6fc;color:var(--cl-ink)}
html[data-skin="clarte"] .sidebar nav button.active{background:var(--cl-blue);color:#fff;font-weight:650;box-shadow:0 8px 18px #234bdc40}
html[data-skin="clarte"] #nav .nav-ico{border-radius:11px;box-shadow:none}
html[data-skin="clarte"] .sidebar .nav-count,html[data-skin="clarte"] .sidebar .nav-badge{background:var(--cl-coral-2);color:var(--cl-coral);border-radius:20px;font-weight:700}
html[data-skin="clarte"] .sidebar nav button.active .nav-count,html[data-skin="clarte"] .sidebar nav button.active .nav-badge{background:#ffffff33;color:#fff}
html[data-skin="clarte"] .sidebar .account-actions,html[data-skin="clarte"] .sidebar-bottom small,html[data-skin="clarte"] .sidebar .brand-sub{color:var(--cl-mut)}
html[data-skin="clarte"] .sidebar .demo-note{background:var(--cl-bg);color:#59658a;border-radius:14px;border:0}
html[data-skin="clarte"] .sidebar .profile{border-color:var(--cl-line);color:var(--cl-ink)}
html[data-skin="clarte"] .sidebar .mcp-management,html[data-skin="clarte"] .sidebar .optim-direct-link{color:var(--cl-blue)}
html[data-skin="clarte"] .sidebar .outline-button{background:var(--cl-card);color:var(--cl-blue);border-color:var(--cl-line)}
@media(min-width:651px){
 html[data-skin="clarte"] .sidebar{top:16px;bottom:16px;left:16px;width:248px;border-radius:24px;padding:16px 12px;overflow-y:auto;scrollbar-width:thin}
 html[data-skin="clarte"] .sidebar nav button{min-height:40px;padding-block:7px}
 html[data-skin="clarte"] .shell{margin-left:280px}
}

/* Barre du haut et en-tête de page */
html[data-skin="clarte"] .topbar{background:transparent;border:0;height:72px}
html[data-skin="clarte"] .breadcrumb b{color:var(--cl-ink)}
html[data-skin="clarte"] .theme-switch{background:var(--cl-card);border:0;border-radius:14px;box-shadow:var(--cl-shadow);padding:4px}
html[data-skin="clarte"] .theme-switch button{border-radius:10px}
html[data-skin="clarte"] .theme-switch button[aria-pressed="true"]{background:var(--cl-blue-2);color:var(--cl-blue)}
html[data-skin="clarte"] .avatar{background:var(--cl-violet-2);color:var(--cl-violet)}
html[data-skin="clarte"] .page-heading h1{font-weight:800;font-size:34px;letter-spacing:-.035em;line-height:1.1}
html[data-skin="clarte"] .page-heading p,html[data-skin="clarte"] .muted{color:var(--cl-mut)}

/* Boutons et champs */
html[data-skin="clarte"] .primary{background:var(--cl-blue);color:#fff;border:0;border-radius:14px;font-weight:700;box-shadow:0 8px 20px #234bdc3d}
html[data-skin="clarte"] .primary:hover{background:#1d3fc0}
html[data-skin="clarte"] .outline-button{background:var(--cl-card);border:1px solid #dfe5f3;border-radius:12px;color:var(--cl-blue);font-weight:650}
html[data-skin="clarte"] .outline-button:hover{background:var(--cl-blue-2)}
html[data-skin="clarte"] .text-button{color:var(--cl-blue);font-weight:700}
html[data-skin="clarte"] input:not([type=checkbox]):not([type=radio]),html[data-skin="clarte"] select,html[data-skin="clarte"] textarea{border:1px solid #dfe5f3;border-radius:12px;background:var(--cl-card);color:var(--cl-ink)}
html[data-skin="clarte"] input:focus,html[data-skin="clarte"] select:focus,html[data-skin="clarte"] textarea:focus{outline:2px solid #234bdc66;outline-offset:1px;border-color:var(--cl-blue)}
html[data-skin="clarte"] .search-box{background:var(--cl-card);border:0;border-radius:30px;box-shadow:var(--cl-shadow)}
html[data-skin="clarte"] .search-box input:not([type=checkbox]):not([type=radio]){border:0;box-shadow:none;background:transparent;outline:0}
html[data-skin="clarte"] .segmented{background:var(--cl-card);border:0;border-radius:14px;padding:4px;box-shadow:var(--cl-shadow)}
html[data-skin="clarte"] .segmented button{border-radius:10px;color:var(--cl-mut);font-weight:600}
html[data-skin="clarte"] .segmented button.selected{background:var(--cl-blue-2);color:var(--cl-blue);box-shadow:none}

/* Tuiles : indicateurs, panneaux, tableaux */
html[data-skin="clarte"] .panel,html[data-skin="clarte"] .metric,html[data-skin="clarte"] .support-card,html[data-skin="clarte"] .suite-mini-kpi,html[data-skin="clarte"] .cc-card{background:var(--cl-card);border:0;border-radius:22px;box-shadow:var(--cl-shadow)}
html[data-skin="clarte"] .metric{padding:20px 22px}
html[data-skin="clarte"] .metric-top{color:var(--cl-mut);font-weight:550}
html[data-skin="clarte"] .metric strong{font-family:Manrope,sans-serif;font-weight:800;letter-spacing:-.04em;color:var(--cl-ink)}
html[data-skin="clarte"] .metrics .metric:first-child{background:var(--cl-blue);color:#fff}
html[data-skin="clarte"] .metrics .metric:first-child strong,html[data-skin="clarte"] .metrics .metric:first-child .metric-top,html[data-skin="clarte"] .metrics .metric:first-child .metric-bottom,html[data-skin="clarte"] .metrics .metric:first-child .muted{color:#fff}
html[data-skin="clarte"] .metrics .metric:first-child .metric-top,html[data-skin="clarte"] .metrics .metric:first-child .metric-bottom{color:#cbd6ff}
html[data-skin="clarte"] .panel-heading h2{font-weight:700}
html[data-skin="clarte"] .count-bubble{background:var(--cl-coral-2);color:var(--cl-coral);font-weight:800}
html[data-skin="clarte"] .section-label,html[data-skin="clarte"] .table-heading span:first-child{font-family:Manrope,sans-serif;font-weight:700}
html[data-skin="clarte"] table{border-collapse:collapse}
html[data-skin="clarte"] th{color:var(--cl-mut);font-size:12px;font-weight:650;letter-spacing:0;text-transform:none;background:transparent}
html[data-skin="clarte"] td{border-top:1px solid var(--cl-line);border-bottom:0;padding-block:13px}
html[data-skin="clarte"] tbody tr:hover td{background:#f7f9ff}
html[data-skin="clarte"] .table-scroll{border-radius:18px}
html[data-skin="clarte"] .section-divider{border-color:var(--cl-line)}
html[data-skin="clarte"] .task-item,html[data-skin="clarte"] .renewal-item{border-color:var(--cl-line)}
html[data-skin="clarte"] .renewal-total{background:var(--cl-coral-2);color:#9a4a30;border-radius:14px}
html[data-skin="clarte"] .renewals .tag.orange{background:var(--cl-coral);color:#fff}
html[data-skin="clarte"] .company-logo{background:var(--cl-blue-2);color:var(--cl-blue);border-radius:12px;font-weight:800}
html[data-skin="clarte"] .source-notice{background:var(--cl-blue-2);color:#2f47b8;border:0;border-radius:16px}
html[data-skin="clarte"] .contract-banner{border-radius:22px;background:var(--cl-blue);color:#fff;border:0}
html[data-skin="clarte"] .contract-banner *{color:inherit}

/* Pastilles de statut */
html[data-skin="clarte"] .tag{border-radius:20px;font-weight:650;border:0}
html[data-skin="clarte"] .tag.blue{background:var(--cl-blue-2);color:var(--cl-blue)}
html[data-skin="clarte"] .tag.green{background:var(--cl-green-2);color:var(--cl-green)}
html[data-skin="clarte"] .tag.orange{background:var(--cl-amber-2);color:var(--cl-amber)}
html[data-skin="clarte"] .tag.purple{background:var(--cl-violet-2);color:var(--cl-violet)}

/* Graphiques */
html[data-skin="clarte"] .bar{background:linear-gradient(var(--cl-blue),#4a6ef0);border-radius:8px 8px 0 0}
html[data-skin="clarte"] .bar.old{background:#c9d4fb}
html[data-skin="clarte"] .pipeline-step{border-radius:14px}
html[data-skin="clarte"] .cc-bar{background:var(--cl-blue);border-radius:6px}

/* Pipeline : colonnes douces, cartes blanches */
html[data-skin="clarte"] .board-column,html[data-skin="clarte"] .board-column:nth-child(n){background:#e8ecf7;border-radius:22px;padding:12px}
html[data-skin="clarte"] .column-heading{font-family:Manrope,sans-serif;font-weight:700;font-size:14px;gap:8px}
html[data-skin="clarte"] .column-heading>span:first-child:before{content:"";display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:8px;background:var(--cl-blue)}
html[data-skin="clarte"] .board-column:nth-child(1) .column-heading>span:first-child:before{background:#8aa2ff}
html[data-skin="clarte"] .board-column:nth-child(2) .column-heading>span:first-child:before{background:#5b7bff}
html[data-skin="clarte"] .board-column:nth-child(3) .column-heading>span:first-child:before{background:#234bdc}
html[data-skin="clarte"] .board-column:nth-child(4) .column-heading>span:first-child:before{background:var(--cl-coral)}
html[data-skin="clarte"] .board-column:nth-child(5) .column-heading>span:first-child:before{background:var(--cl-green)}
html[data-skin="clarte"] .board-column:nth-child(6) .column-heading>span:first-child:before{background:#9aa3bd}
html[data-skin="clarte"] .column-heading .tag{background:var(--cl-card);color:var(--cl-mut)}
html[data-skin="clarte"] .column-total{font-family:Manrope,sans-serif;font-weight:800;font-size:17px;letter-spacing:-.03em;color:var(--cl-ink)}
html[data-skin="clarte"] .deal-card{background:var(--cl-card);border:0;border-radius:16px;padding:14px;box-shadow:0 4px 14px #20306a0f}
html[data-skin="clarte"] .deal-card:hover,html[data-skin="clarte"] .deal-card:focus-visible{box-shadow:0 8px 22px #20306a1f}
html[data-skin="clarte"] .deal-card h3{font-size:14px;font-weight:700}
html[data-skin="clarte"] .deal-card p{color:var(--cl-mut)}
html[data-skin="clarte"] .deal-card .amount{font-family:Manrope,sans-serif;font-weight:800;font-size:16px;letter-spacing:-.03em;color:var(--cl-ink)}

/* Fenêtres et fiches */
html[data-skin="clarte"] dialog{border:0;border-radius:24px;box-shadow:0 24px 70px #131a3540}
html[data-skin="clarte"] dialog::backdrop{background:#131a3566}
html[data-skin="clarte"] .client-roster-item{border-radius:14px}
html[data-skin="clarte"] .skin-option{border-radius:16px}