/* Sondagix — barre de navigation, authentification, assistant de création. Complète apple.css. */
body { background: #f5f5f7; margin: 0; font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", Inter, "Segoe UI", Roboto, sans-serif; color: #1d1d1f; }
.sx-bar { position: sticky; top: 0; z-index: 20; background: rgba(255,255,255,.82); backdrop-filter: saturate(180%) blur(20px); -webkit-backdrop-filter: saturate(180%) blur(20px); border-bottom: 1px solid rgba(0,0,0,.08); }
.sx-bar-in { max-width: 1040px; margin: 0 auto; padding: .6rem 1rem; display: flex; align-items: center; gap: 1.25rem; flex-wrap: wrap; }
.sx-logo { display: inline-flex; align-items: center; gap: .5rem; font-weight: 700; font-size: 1.15rem; letter-spacing: -.02em; color: #1d1d1f; text-decoration: none; }
.sx-mark { width: 26px; height: 26px; border-radius: 6px; background:url(icon.svg) center/cover no-repeat; display: inline-block; box-shadow: 0 1px 3px rgba(0,0,0,.25); }
.sx-nav { display: flex; gap: .15rem; flex-wrap: wrap; flex: 1; }
.sx-nav a { color: #424245; text-decoration: none; padding: .35rem .8rem; border-radius: 980px; font-size: .95rem; }
.sx-nav a:hover { background: rgba(0,0,0,.05); } .sx-nav a.on { background: rgba(0,0,0,.07); color: #1d1d1f; font-weight: 600; }
.sx-out { display: flex; align-items: center; gap: .6rem; margin: 0 0 0 auto; } .sx-who { font-size: .9rem; color: #6e6e73; }
.sx-auth { max-width: 460px; } .sx-foot { text-align: center; color: #6e6e73; font-size: .85rem; padding: 2rem 1rem; } .sx-foot a { color: #6e6e73; }
.ap { max-width: 1040px; margin: 0 auto; padding: 1.5rem 1rem 3rem; }
.ap .btn-primary { --bs-btn-bg: var(--acc, #0a6cd6); --bs-btn-border-color: var(--acc, #0a6cd6); --bs-btn-hover-bg: var(--acc, #0a6cd6); --bs-btn-hover-border-color: var(--acc, #0a6cd6); --bs-btn-hover-color: #fff; filter: none; }
.ap .btn-primary:hover { filter: brightness(.92); }
code, pre { font-size: .85rem; } pre { background: #f2f2f5; border-radius: 12px; padding: .9rem 1rem; overflow-x: auto; }
.meter { height: 8px; border-radius: 99px; background: #e5e5ea; overflow: hidden; } .meter > i { display: block; height: 100%; background: var(--acc, #0a6cd6); }

/* Parcours / Flux (pages « Parcours » et « Flux ») */
.flx{border-radius:1.1rem}.flx-head{display:flex;flex-wrap:wrap;gap:.3rem .9rem;align-items:baseline}.flx-head h2{font-size:1.25rem;margin:0}
.flx-who{font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;color:#5b6b80}
.flx-nav{display:flex;flex-wrap:wrap;gap:.4rem}.flx-nav a{font-size:.9rem;text-decoration:none;border:1px solid rgba(0,0,0,.12);border-radius:980px;padding:.25rem .8rem;color:#1d1d1f;background:#fff}.flx-nav a:hover{background:rgba(0,0,0,.05)}
.flx-steps{list-style:none;margin:.5rem 0 0;padding:0;counter-reset:fs}
.flx-steps li{counter-increment:fs;position:relative;display:flex;flex-direction:column;gap:.15rem;align-items:flex-start;padding:0 0 1rem 2.7rem;min-width:0;overflow-wrap:anywhere}
.flx-steps li::before{content:counter(fs);position:absolute;left:0;top:0;width:1.9rem;height:1.9rem;border-radius:50%;background:var(--acc,#0a6cd6);color:#fff;display:grid;place-items:center;font-weight:700;font-size:.85rem}
.flx-where{font-size:.85rem;color:#5b6b80}
.flx-go{margin-top:.3rem}.flx-link{font-size:.82rem}
.flx-sys{display:block;margin-top:.3rem;padding:.5rem .7rem;background:#f2f2f5;border-radius:.6rem;font-size:.88rem;max-width:100%}.flx-sys i{font-style:normal;font-weight:700;margin-right:.35rem;color:#033c73}

/* Aide (base de connaissances) et portail Support */
.kb-search .btn{white-space:nowrap}
.kb-crumb{display:flex;flex-wrap:wrap;gap:.25rem .5rem;align-items:center;font-size:.9rem;color:#5b6b80;margin:0 0 .75rem;min-width:0}.kb-crumb a{color:#0b57b8}.kb-crumb span{overflow-wrap:anywhere}
.kb-cats{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:.75rem}
.kb-cat,.kb-card{display:flex;flex-direction:column;gap:.2rem;padding:.8rem 1rem;border:1px solid rgba(0,0,0,.1);border-radius:1rem;background:#fff;color:#1d1d1f;text-decoration:none;min-width:0;overflow-wrap:anywhere}
.kb-cat:hover,.kb-card:hover{border-color:var(--acc,#0a6cd6);background:#fafcff}.kb-cat span,.kb-card span{font-size:.9rem;color:#4b5563}.kb-cat i,.kb-card i{font-style:normal;font-size:.8rem;color:#5b6b80}
.kb-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:.75rem}
.kb-art h1{font-size:1.6rem;overflow-wrap:anywhere}.kb-art h2{font-size:1.1rem;margin:1.4rem 0 .5rem}.kb-art .card-body{min-width:0;overflow-wrap:anywhere}
.kb-lead{font-size:1.05rem;color:#3a3a3c}.kb-badge{display:inline-block;margin:0 0 .5rem;padding:.15rem .7rem;border-radius:99px;background:#fff3cd;color:#664d03;font-size:.8rem;font-weight:600}
.kb-steps{padding-left:1.3rem}.kb-steps li{margin:.35rem 0}
.kb-faq dt{font-weight:600;margin-top:.7rem}.kb-faq dd{margin:.15rem 0 0 0;color:#3a3a3c}
.kb-sup{margin-top:1.8rem;padding:1rem 1.1rem;border:2px solid #b45309;border-radius:1rem;background:#fffbeb}.kb-sup h2{margin-top:0;color:#7c2d12}.kb-sup h3{font-size:1rem;margin:1rem 0 .3rem}.kb-never{color:#9b1c1c}
.kb-mod{scroll-margin-top:5rem}.kb-mod details{border:1px solid rgba(0,0,0,.1);border-radius:.8rem;padding:.5rem .8rem;background:#fff;margin:.4rem 0}.kb-mod summary{cursor:pointer;font-weight:600}
.sp-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:.75rem}
.sp-dl{display:grid;grid-template-columns:minmax(140px,220px) 1fr;gap:.35rem 1rem;margin:0}.sp-dl dt{font-weight:600;color:#3a3a3c}.sp-dl dd{margin:0;min-width:0;overflow-wrap:anywhere}
.sp-tag{display:inline-block;padding:.1rem .6rem;border-radius:99px;font-size:.78rem;font-weight:600;background:#e5e5ea;color:#1d1d1f}.sp-tag.ok{background:#d1fae5;color:#065f46}.sp-tag.warn{background:#fef3c7;color:#92400e}.sp-tag.bad{background:#fee2e2;color:#991b1b}
.sp-note{border:1px solid rgba(0,0,0,.1);border-radius:.8rem;padding:.6rem .9rem;background:#fff}.sp-note small{color:#5b6b80}.sp-note p{margin:.25rem 0 0;white-space:pre-wrap;overflow-wrap:anywhere}
.meter.over>i{background:#c0392b}
.sp-table td,.sp-table th{vertical-align:top;overflow-wrap:anywhere}
@media (max-width:575px){.sp-dl{grid-template-columns:1fr;gap:.1rem}.sp-dl dd{margin-bottom:.5rem}.kb-art h1{font-size:1.35rem}}
.ap .d-grid > *{min-width:0}.kb-art{min-width:0}.kb-art pre{max-width:100%;white-space:pre-wrap;overflow-wrap:anywhere}

/* ===== Sondagix : accent bleu (clair #0a6cd6 / sombre #5aa9ff), marque personnalisée via --brand ===== */
:root { --acc: var(--brand, #0a6cd6); --bs-primary: var(--acc); --bs-primary-rgb: 217,72,15; --bs-link-color: var(--acc); --bs-link-hover-color: var(--acc); --bs-link-color-rgb: 217,72,15; --bs-link-hover-color-rgb: 217,72,15; --card-bg: #fff; --ink: #1d1d1f; --mute: #6e6e73; --line: #d2d2d7; --soft: #f5f5f7; color-scheme: light dark; }
.ap a:not(.btn):not(.kb-card):not(.kb-cat) { color: var(--acc); }
.ap .btn-primary { --bs-btn-color: #fff; --bs-btn-hover-color: #fff; --bs-btn-active-bg: var(--acc); --bs-btn-active-border-color: var(--acc); --bs-btn-disabled-bg: var(--acc); --bs-btn-disabled-border-color: var(--acc); }
.ap .btn-outline-primary, .ap .btn-outline-secondary { color: var(--acc); }
.ap .btn-outline-secondary { color: inherit; }
.sx-logo, .sx-nav a, .sx-who { color: inherit; }
.sx-out { margin-left: auto; display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; }
.sx-space { display: flex; gap: .35rem; margin: 0; } .sx-space select { max-width: 11rem; }
.sx-plans { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1rem; } .sx-plan { background: var(--soft); border-radius: 18px; padding: 1.2rem 1.3rem; }
.sx-tabs { display: flex; flex-wrap: wrap; gap: .35rem; }
.sx-tabs a { text-decoration: none; padding: .3rem .9rem; border-radius: 980px; font-size: .92rem; border: 1px solid rgba(127,127,127,.28); color: inherit !important; }
.sx-tabs a[aria-current] { background: var(--acc); color: #fff !important; border-color: var(--acc); font-weight: 600; }
.sx-pill { display: inline-block; font-size: .76rem; font-weight: 600; padding: .15rem .65rem; border-radius: 980px; background: rgba(127,127,127,.18); }
.sx-pill.on { background: #d9f5e1; color: #0a6b2d; } .sx-pill.off { background: #fee2e2; color: #991b1b; } .sx-pill.draft { background: #fef3c7; color: #92400e; }
.sx-list { display: grid; gap: .75rem; } .sx-srow { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .5rem 1rem; align-items: center; padding: 1rem 1.15rem; border-radius: 18px; background: var(--card-bg); box-shadow: 0 1px 2px rgba(0,0,0,.04), 0 6px 20px rgba(0,0,0,.05); }
.sx-srow h2 { font-size: 1.1rem; margin: 0; overflow-wrap: anywhere; } .sx-srow h2 a { color: inherit !important; text-decoration: none; }
.sx-meta { display: flex; flex-wrap: wrap; gap: .25rem 1rem; font-size: .85rem; color: var(--mute); }
.sx-meter { height: 8px; border-radius: 99px; background: rgba(127,127,127,.2); overflow: hidden; } .sx-meter > i { display: block; height: 100%; background: var(--acc); } .sx-meter.over > i { background: #c0392b; }
.tpl-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1rem; } .tpl-card { display: flex; flex-direction: column; gap: .5rem; padding: 1.1rem 1.2rem; border-radius: 18px; background: var(--card-bg); box-shadow: 0 1px 2px rgba(0,0,0,.04), 0 6px 20px rgba(0,0,0,.05); } .tpl-card p { margin: 0; color: var(--mute); font-size: .92rem; } .tpl-card form { margin-top: auto; }
/* créateur */
.bq { border: 1px solid rgba(127,127,127,.28); border-radius: 18px; background: var(--card-bg); overflow: hidden; } .bq + .bq { margin-top: .6rem; }
.bq > summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: 2.2rem minmax(0, 1fr) auto; gap: .6rem; align-items: center; padding: .75rem 1rem; } .bq > summary::-webkit-details-marker { display: none; }
.bq-n { width: 2rem; height: 2rem; border-radius: 50%; background: var(--acc); color: #fff; display: grid; place-items: center; font-weight: 700; font-size: .85rem; } .bq.sec .bq-n { border-radius: 8px; }
.bq-t { min-width: 0; overflow-wrap: anywhere; font-weight: 600; } .bq-t small { display: block; font-weight: 400; color: var(--mute); }
.bq-body { padding: .25rem 1rem 1rem; border-top: 1px solid rgba(127,127,127,.2); display: grid; gap: .9rem; }
.bq-tools { display: flex; flex-wrap: wrap; gap: .35rem; } .bq-tools form { margin: 0; }
.bq-warn { color: #b45309; font-size: .85rem; }
.lg-row { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1.4fr) minmax(0, 1.4fr); gap: .4rem; } @media (max-width: 575px) { .lg-row { grid-template-columns: 1fr; } .bq > summary { grid-template-columns: 2rem minmax(0, 1fr); } .bq > summary .sx-pill { display: none; } }
.code-box { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; } .code-box code { flex: 1 1 260px; min-width: 0; overflow-wrap: anywhere; padding: .5rem .7rem; background: var(--soft); border-radius: 10px; }
.qr-box { width: 200px; max-width: 100%; border-radius: 12px; overflow: hidden; border: 1px solid rgba(127,127,127,.3); } .qr-box svg { display: block; width: 100%; height: auto; }
.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: .75rem; } .kpi { background: var(--card-bg); border-radius: 16px; padding: .9rem 1.1rem; box-shadow: 0 1px 2px rgba(0,0,0,.04), 0 4px 16px rgba(0,0,0,.04); } .kpi b { display: block; font-size: 1.7rem; letter-spacing: -.02em; line-height: 1.1; } .kpi span { font-size: .85rem; color: var(--mute); }
/* graphiques SVG */
.sxc0 { fill: #0a6cd6; } .sxc1 { fill: #0ea5a4; } .sxc2 { fill: #f59e0b; } .sxc3 { fill: #ec4899; } .sxc4 { fill: #3b82f6; } .sxc5 { fill: #22c55e; } .sxc6 { fill: #ef4444; } .sxc7 { fill: #94a3b8; }
.sxs0 { stroke: #0a6cd6; } .sxs1 { stroke: #0ea5a4; } .sxs2 { stroke: #f59e0b; } .sxs3 { stroke: #ec4899; } .sxs4 { stroke: #3b82f6; } .sxs5 { stroke: #22c55e; } .sxs6 { stroke: #ef4444; } .sxs7 { stroke: #94a3b8; }
.sxb0 { background: #0a6cd6; } .sxb1 { background: #0ea5a4; } .sxb2 { background: #f59e0b; } .sxb3 { background: #ec4899; } .sxb4 { background: #3b82f6; } .sxb5 { background: #22c55e; } .sxb6 { background: #ef4444; } .sxb7 { background: #94a3b8; }
.nps-d, .nps-db { fill: #ef4444; background: #ef4444; } .nps-p, .nps-pb { fill: #f59e0b; background: #f59e0b; } .nps-g, .nps-gb { fill: #22c55e; background: #22c55e; }
.ch-bars { display: grid; gap: .55rem; } .ch-row { display: grid; grid-template-columns: minmax(90px, 32%) minmax(0, 1fr) minmax(70px, auto); gap: .6rem; align-items: center; } .ch-l { overflow-wrap: anywhere; font-size: .92rem; } .ch-v { font-size: .85rem; text-align: right; white-space: nowrap; } .ch-v span, .ch-v small { color: var(--mute); }
.ch-bar { width: 100%; height: 14px; border-radius: 99px; overflow: hidden; display: block; } .ch-track, .ch-trackc { fill: rgba(127,127,127,.2); stroke: rgba(127,127,127,.2); } .ch-trackc { fill: none; }
@media (max-width: 575px) { .ch-row { grid-template-columns: 1fr auto; } .ch-row .ch-bar { grid-column: 1 / -1; grid-row: 2; } .ch-row .ch-v { grid-row: 1; grid-column: 2; } }
.ch-pie { display: flex; flex-wrap: wrap; gap: 1rem 1.5rem; align-items: center; } .ch-donut { width: 150px; height: 150px; flex: none; } .ch-mid { font-size: 20px; font-weight: 700; fill: currentColor; }
.ch-leg { list-style: none; margin: 0; padding: 0; display: grid; gap: .3rem; flex: 1 1 200px; min-width: 0; font-size: .9rem; } .ch-leg li { display: flex; flex-wrap: wrap; gap: .1rem .5rem; align-items: baseline; overflow-wrap: anywhere; } .ch-leg i { width: .8rem; height: .8rem; border-radius: 3px; display: inline-block; flex: none; align-self: center; } .ch-legrow { grid-auto-flow: row; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); margin-bottom: .6rem; }
.ch-cols { width: 100%; max-width: 560px; height: auto; display: block; } .ch-t { font-size: 10px; fill: currentColor; } .ch-tl { fill: var(--mute); } .ch-axis { stroke: rgba(127,127,127,.4); stroke-width: 1; }
.ch-avg { min-width: 180px; max-width: 260px; } .ch-big { font-size: 2.2rem; font-weight: 700; letter-spacing: -.03em; line-height: 1; } .ch-big small { font-size: .9rem; font-weight: 400; } .ch-avg svg { width: 100%; height: 26px; display: block; margin-top: .4rem; } .ch-knob { fill: #fff; stroke: #0a6cd6; stroke-width: 3; } .ch-ends { display: flex; justify-content: space-between; font-size: .75rem; color: var(--mute); }
.ch-numw { display: flex; flex-wrap: wrap; gap: 1rem 1.5rem; align-items: center; } .ch-numw > div:last-child { flex: 1 1 260px; min-width: 0; }
.ch-npsw { display: flex; flex-wrap: wrap; gap: 1rem 1.5rem; align-items: center; } .ch-score b { display: block; font-size: 3rem; line-height: 1; letter-spacing: -.04em; } .ch-score span { color: var(--mute); font-size: .85rem; } .ch-npsr { flex: 1 1 260px; min-width: 0; display: grid; gap: .6rem; } .ch-nps { width: 100%; height: 22px; display: block; border-radius: 99px; overflow: hidden; }
.rs-text { list-style: none; padding: 0; margin: 0; display: grid; gap: .45rem; max-height: 22rem; overflow: auto; } .rs-text li { padding: .5rem .8rem; background: var(--soft); border-radius: 12px; overflow-wrap: anywhere; } .rs-text small { display: block; color: var(--mute); font-size: .75rem; }
.rs-q { min-width: 0; } .rs-q .card-body { min-width: 0; }
.resp-card { border: 1px solid rgba(127,127,127,.28); border-radius: 16px; background: var(--card-bg); } .resp-card > summary { cursor: pointer; padding: .7rem 1rem; list-style: none; display: flex; flex-wrap: wrap; gap: .3rem 1rem; justify-content: space-between; } .resp-card > summary::-webkit-details-marker { display: none; } .resp-body { padding: 0 1rem 1rem; }
.resp-body dt { font-size: .85rem; color: var(--mute); font-weight: 600; margin-top: .6rem; } .resp-body dd { margin: 0; overflow-wrap: anywhere; }
/* page imprimable (PDF) */
.print-only { display: none; } @media print { .sx-bar, .sx-foot, .no-print { display: none !important; } body { background: #fff !important; color: #000 !important; } .ap { max-width: none; padding: 0; } .ap .card { box-shadow: none !important; border: 1px solid #ccc; break-inside: avoid; } .print-only { display: block; } }
/* Intégrations */
.ap pre { background: var(--soft); border-radius: 12px; padding: .9rem 1rem; overflow-x: auto; max-width: 100%; } .ap pre code { white-space: pre; }
.int-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1rem; }

/* ===== thème sombre de l'application ===== */
@media (prefers-color-scheme: dark) {
  :root { --acc: var(--brand-dark, #5aa9ff); --bs-primary-rgb: 255,138,76; --bs-link-color-rgb: 255,138,76; --bs-link-hover-color-rgb: 255,138,76; --card-bg: #1c1c22; --ink: #f2f2f7; --mute: #a1a1aa; --line: #3a3a44; --soft: #26262e;
    --bs-body-bg: #0e0e12; --bs-body-color: #ececf1; --bs-body-color-rgb: 236,236,241; --bs-body-bg-rgb: 14,14,18; --bs-border-color: #3a3a44; --bs-secondary-color: #a1a1aa; --bs-secondary-bg: #26262e; --bs-tertiary-bg: #1c1c22; --bs-emphasis-color: #fff;
    --bs-success-bg-subtle: #12361c; --bs-success-text-emphasis: #7ee0a0; --bs-success-border-subtle: #1f5a31; --bs-danger-bg-subtle: #3d1519; --bs-danger-text-emphasis: #ff9ca4; --bs-danger-border-subtle: #6b252c; --bs-warning-bg-subtle: #3a2a0c; --bs-warning-text-emphasis: #ffd27a; --bs-warning-border-subtle: #6b4d12; --bs-info-bg-subtle: #0f2c52; --bs-info-text-emphasis: #b7d6fc; --bs-info-border-subtle: #1f4f8f; }
  body, body:has(.ap) { background: #0e0e12; color: #ececf1; --bs-body-bg: #0e0e12; }
  .ap { color: #ececf1; } .ap .card, .ap-empty, .ap-card, .ap-section { background: #1c1c22; box-shadow: 0 1px 2px rgba(0,0,0,.4) !important; color: #ececf1; }
  .ap .text-body-secondary, .ap .ap-sub, .ap .ap-note, .ap small, .flx-where, .flx-who, .kb-crumb { color: #a1a1aa !important; }
  .ap .form-control, .ap .form-select, .ap textarea { background-color: #121217; color: #f2f2f7; border-color: #3a3a44; } .ap .form-control::placeholder { color: #71717a; } .ap .form-control:disabled { background: #1c1c22; }
  .ap .btn-outline-primary, .ap .btn-outline-secondary { background: rgba(255,255,255,.07); color: #f2f2f7; } .ap .btn-outline-primary { color: var(--acc); } .ap .btn-primary { --bs-btn-color: #0b0b12; --bs-btn-hover-color: #0b0b12; --bs-btn-active-color: #0b0b12; color: #0b0b12; } .ap .btn-outline-danger { background: rgba(255,59,48,.14); color: #ff8a82; }
  .sx-bar { background: rgba(20,20,26,.82); border-bottom-color: rgba(255,255,255,.1); } .sx-nav a { color: #c8c8d0; } .sx-nav a:hover { background: rgba(255,255,255,.08); } .sx-nav a.on { background: rgba(255,255,255,.12); color: #fff; } .sx-who, .sx-foot, .sx-foot a { color: #a1a1aa; }
  .ap table { color: #ececf1; --bs-table-color: #ececf1; --bs-table-bg: transparent; --bs-table-border-color: #3a3a44; } .ap .table > :not(caption) > * > * { color: #ececf1; background-color: transparent; border-bottom-color: #3a3a44; }
  .ap pre, pre { background: #26262e; color: #ececf1; } .ap code, code { color: #d6e8fc; }
  .kb-cat, .kb-card, .sp-note, .kb-mod details, .flx-nav a { background: #1c1c22; color: #ececf1; border-color: #3a3a44; } .kb-cat:hover, .kb-card:hover { background: #26262e; } .kb-cat span, .kb-card span, .kb-lead, .kb-faq dd, .sp-dl dt { color: #b4b4be; }
  .flx-sys { background: #26262e; } .flx-sys i { color: #b7d6fc; } .kb-sup { background: #2b2210; border-color: #b45309; } .kb-sup h2 { color: #fdba74; } .kb-never { color: #ff9ca4; } .kb-badge { background: #3a2a0c; color: #ffd27a; }
  .sp-tag { background: #2e2e38; color: #ececf1; } .sp-tag.ok { background: #12361c; color: #7ee0a0; } .sp-tag.warn { background: #3a2a0c; color: #ffd27a; } .sp-tag.bad { background: #3d1519; color: #ff9ca4; } .meter { background: #2e2e38; }
  .sx-pill.on { background: #12361c; color: #7ee0a0; } .sx-pill.off { background: #3d1519; color: #ff9ca4; } .sx-pill.draft { background: #3a2a0c; color: #ffd27a; }
  .ch-knob { fill: #1c1c22; } .sxc0 { fill: #5aa9ff; } .sxs0 { stroke: #5aa9ff; } .sxb0 { background: #5aa9ff; } .ch-big, .ch-score b { color: #fff; }
  .bq-warn { color: #ffd27a; }
}
.sx-code { background: var(--soft); border-radius: 12px; padding: .8rem 1rem; margin: 0; overflow-x: auto; max-width: 100%; font-size: .82rem; white-space: pre; } .sx-code code { color: inherit; background: none; }
.card-body table { display: block; overflow-x: auto; max-width: 100%; }
.sx-note { background: var(--soft); border-radius: 14px; padding: .8rem 1rem; }

/* Titres : la feuille Bootstrap fournie colore h1–h6 en bleu ; on impose la couleur du texte. */
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { color: var(--ink, #1d1d1f); }
.btn-primary { --bs-btn-bg: var(--acc, #0a6cd6); --bs-btn-border-color: var(--acc, #0a6cd6); --bs-btn-hover-bg: var(--acc, #0a6cd6); --bs-btn-hover-border-color: var(--acc, #0a6cd6); --bs-btn-active-bg: var(--acc, #0a6cd6); --bs-btn-active-border-color: var(--acc, #0a6cd6); --bs-btn-color: #fff; --bs-btn-hover-color: #fff; background-image: none !important; background-color: var(--acc, #0a6cd6); border-color: var(--acc, #0a6cd6); color: #fff; }
.btn-primary:hover, .btn-primary:focus { filter: brightness(.92); }
@media (prefers-color-scheme: dark) { .btn-primary, .ap .btn-primary { --bs-btn-color: #06182e; --bs-btn-hover-color: #06182e; color: #06182e; } }