/* ─── Reset & base ───────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

[hidden] { display: none !important; }

:root {
/* ─── Tokens : surface ──────────────────────────────────────────────────────── */
  --surface: #fff;
  --surface-alt: #f2f5f9;
/* ─── Tokens : echelle typographique ────────────────────────────────────────── */
  --fs-9: .5625rem;
  --fs-10: .625rem;
  --fs-11: .6875rem;
  --fs-12: .75rem;
  --fs-13: .8125rem;
  --fs-14: .875rem;
  --fs-15: .9375rem;
  --fs-16: 1rem;
  --fs-17: 1.0625rem;
  --fs-18: 1.125rem;
  --fs-20: 1.25rem;
  --fs-22: 1.375rem;
  --fs-24: 1.5rem;
  --fs-26: 1.625rem;
  --fs-28: 1.75rem;
  --fs-30: 1.875rem;
  --fs-32: 2rem;
  --fs-36: 2.25rem;
  --fs-40: 2.5rem;
  --fs-80: 5rem;
/* ─── Tokens : echelle d'espacement ─────────────────────────────────────────── */
  --sp-2: .125rem;
  --sp-3: .1875rem;
  --sp-4: .25rem;
  --sp-5: .3125rem;
  --sp-6: .375rem;
  --sp-7: .4375rem;
  --sp-8: .5rem;
  --sp-9: .5625rem;
  --sp-10: .625rem;
  --sp-11: .6875rem;
  --sp-12: .75rem;
  --sp-14: .875rem;
  --sp-16: 1rem;
  --sp-18: 1.125rem;
  --sp-20: 1.25rem;
  --sp-22: 1.375rem;
  --sp-24: 1.5rem;
  --sp-28: 1.75rem;
  --sp-32: 2rem;
  --sp-36: 2.25rem;
  --sp-40: 2.5rem;
  --sp-48: 3rem;
  --sp-56: 3.5rem;
  --sp-64: 4rem;
  --sp-80: 5rem;
/* ─── Tokens : ordre d'empilement ───────────────────────────────────────────── */
  --z-base: 1;
  --z-raised: 2;
  --z-panel: 20;
  --z-popover: 40;
  --z-nav: 60;
  --z-overlay: 99;
  --z-drawer: 100;
  --z-skip: 200;
  --z-backdrop: 999;
  --z-modal: 1000;
/* ─── Tokens : teintes semantiques ──────────────────────────────────────────── */
  --red-50: #fdecea;
  --red-200: #f5c3c1;
  --amber-50: #fff4e0;
  --amber-100: #fef3c7;
  --amber-400: #e8a020;
  --amber-500: #f59e0b;
  --amber-600: #ba7517;
  --amber-700: #b07000;
  --amber-800: #92400e;
  --green-50: #ecfdf5;
  --green-200: #6ee7b7;
  --green-600: #007a4b;
  --green-700: #0f6e56;
  --green-800: #065f46;
  --blue-50: #eff6ff;
  --blue-700: #1a5fa0;
  --indigo-100: #ede9fe;
  --indigo-500: #6366f1;
  --indigo-600: #4f46e5;
  --yellow-100: #fff3b0;
  --slate-200: #dde2ea;
  --slate-300: #c5cfe0;
  --neutral-100: #f0f2f5;

/* ─── Tokens : palette de marque ────────────────────────────────────────────── */
	--pr-primary-color: #C23F38;
	--pr-secondary-color: #0a3d62;
	--pr-tertiary-color: #008090;

  --pr-primary-shadow-box: rgba(194,63,56,0.5);
  --pr-blue-shadow-box:  rgba(0,128,144,0.25);

	--pr-primary-transp:#FEEBE7;
	--pr-secondary-transp: #d7dce3;
	--pr-tertiary-transp:#E2F5F4;

/* ─── Tokens : gris ─────────────────────────────────────────────────────────── */
  --gray-50:  #F9FAFB;
  --gray-100: #F3F4F6;
  --gray-200: #E5E7EB;
  --gray-300: #D1D5DB;
  --gray-400: #9CA3AF;
  --gray-500: #6B7280;
  --gray-600: #4B5563;
  --gray-700: #374151;
  --gray-800: #1F2937;
  --gray-900: #111827;
  --text:     #111827;

  --heading:  #0f172a;

/* ─── Tokens : rayons, ombres ───────────────────────────────────────────────── */
  --radius:    8px;
  --radius-lg: 12px;
  --radius-pill: 99px;

  --radius-card: var(--radius-lg);

  --shadow-xs: 0 1px 2px rgba(16,24,40,.05);
  --shadow-sm: 0 1px 2px rgba(16,24,40,.04), 0 1px 3px rgba(16,24,40,.07);
  --shadow-md: 0 4px 12px rgba(16,24,40,.08);

  --shadow-glow: 0 0 9px 1px rgba(193,210,232,.7);

  --amber-bg:     #FCFBF6;
  --amber-border: #ECE7D9;
  --amber-text:   #8A6A2F;
}

html { font-size: var(--fs-16); }
body { font-family: system-ui, -apple-system, sans-serif; color: var(--text); background: var(--gray-50); line-height: 1.5;
       min-height: 100vh; display: flex; flex-direction: column; }
a { color: var(--pr-primary-color); text-decoration: none; }
a:hover { text-decoration: underline; }

/* ─── Layout ─────────────────────────────────────────────────────────────── */
.container { max-width: 1100px; width: 100%; margin: 0 auto; padding: 0 var(--sp-20); margin-bottom: var(--sp-40);}

/* ─── Header ─────────────────────────────────────────────────────────────── */
.site-header { background: var(--surface); border-bottom: 1px solid var(--gray-200); }
.header-inner { display: flex; align-items: center; justify-content: space-between; height: 72px; margin-bottom:0 }
.logo { display: flex; align-items: center; gap: var(--sp-10); text-decoration: none; }
.logo:hover { opacity: .85; text-decoration: none; }
.logo-img   { width: 44px; height: 44px; object-fit: contain; flex-shrink: 0; }
.logo-text  { display: flex; flex-direction: column; line-height: 1.2; }
.logo-title { font-weight: 600; font-size: var(--fs-20); color: var(--pr-secondary-color); letter-spacing: -.02em; text-transform: uppercase;}
.logo-wrap { position: relative; display: inline-flex; }
.logo-plan {
  position: absolute; bottom: 64%; left: calc(100% + 5px);
  padding: 0 var(--sp-4);
  border-radius: 4px;
  background: var(--pr-secondary-color);
  color: var(--surface);
  font-size: var(--fs-9); font-weight: 700; line-height: 1.7;
  letter-spacing: .06em; text-transform: uppercase; white-space: nowrap;
}
.logo-plan:hover { text-decoration: none; opacity: .85; }
.logo-plan--trial { background: var(--pr-tertiary-color); }
.logo-plan--pro,
.logo-plan--team { background: var(--pr-primary-color); }

.nav { display: flex; align-items: center; gap: var(--sp-12); font-size: var(--fs-14); }
.nav a { color: var(--gray-600); }
.nav a:hover { color: var(--pr-primary-color); text-decoration: none; }
.nav .btn-secondary { background: var(--pr-secondary-color); color: var(--surface); border-color: var(--pr-secondary-color); }
.nav .btn-secondary:hover { background: rgba(10, 61, 98, 0.75); color: var(--surface); text-decoration: none; }

.filtre-liste { margin: 0 0 var(--sp-20); }
.filtre-liste-input, .cmp-picker-input {
  width: 100%; padding: var(--sp-9) var(--sp-14);
  border: 1px solid var(--gray-200); border-radius: var(--radius);
  font: inherit; color: var(--gray-700); background: var(--surface);
}
.filtre-liste-input:focus, .cmp-picker-input:focus {
  outline: none; border-color: var(--pr-primary-color);
  box-shadow: 0 0 0 3px var(--pr-primary-shadow-box);
}
.rgpd-index-none { padding: var(--sp-16) 0; }

.card-head h2 { display: inline-flex; align-items: center; gap: var(--sp-7); }
.card-head-ico { flex-shrink: 0; opacity: .75; }

.skip-link {
  position: absolute; left: -9999px; top: 0; z-index: var(--z-skip);
  background: var(--pr-secondary-color); color: var(--surface);
  padding: var(--sp-10) var(--sp-16); border-radius: 0 0 var(--radius) 0;
  font-size: var(--fs-14); font-weight: 500; text-decoration: none;
}
.skip-link:focus { left: 0; }

#contenu:focus { outline: none; }

/* ─── Buttons ────────────────────────────────────────────────────────────── */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--sp-6);
  padding: var(--sp-7) var(--sp-16); border-radius: var(--radius);
  font-size: var(--fs-14); font-weight: 500; cursor: pointer;
  border: 1px solid transparent; transition: background .15s, border-color .15s, opacity .15s;
  appearance: none; -webkit-appearance: none;
}
.btn-primary  { background: var(--pr-primary-color); color: var(--surface); }
.btn-primary:hover { background: color-mix(in srgb, var(--pr-primary-color) 85%, black); text-decoration: none; }
.btn-primary[disabled] { background: var(--gray-400); border-color: var(--gray-400); color: var(--surface); opacity: 1; pointer-events: none; }
.btn-secondary { background: var(--surface); color: var(--gray-800); border-color: var(--gray-200); }
.btn-secondary:hover { background: var(--gray-50); text-decoration: none; }
.btn-ghost { background: transparent; color: var(--gray-600); }
.btn-ghost:hover { background: var(--gray-100); color: var(--text); text-decoration: none; }
.btn-danger { background: var(--surface); color: var(--pr-primary-color); border-color: var(--pr-primary-color); }
.btn-danger:hover { background: var(--pr-primary-transp); text-decoration: none; }
.btn-xs { padding: var(--sp-3) var(--sp-10); font-size: var(--fs-13); }

.btn:focus-visible,
.btn-link:focus-visible,
.toolbar-btn:focus-visible,
.view-btn:focus-visible,
.app-nav-link:focus-visible,
.nav-toggle:focus-visible,
.nav-drawer-close:focus-visible,
.nav-group-label:focus-visible,
.lang-btn:focus-visible,
.pwd-toggle:focus-visible,
.fav-btn:focus-visible,
.ws-filter:focus-visible,
.ws-item__pin:focus-visible,
.ws-item__removebtn:focus-visible,
.recitals:focus-visible,
.chap:focus-visible,
.faq-item summary:focus-visible {
  outline: 2px solid var(--pr-secondary-color);
  outline-offset: 2px;
  border-radius: var(--radius);
}

.btn-xs,
.lang-btn,
.view-btn,
.toolbar-btn,
.fav-btn--hit,
.ws-item__pin,
.ws-item__removebtn {
  min-height: 24px;
}
.lang-btn { display: inline-flex; align-items: center; }

/* ─── Badges ───────────────────────────────────────────────────────────────── */
.badge {
  display: inline-flex; align-items: center;
  padding: var(--sp-2) var(--sp-8); border-radius: var(--radius-pill);
  font-size: var(--fs-12); font-weight: 600; letter-spacing: .01em;
}
.badge-pending  { background: var(--gray-100); color: var(--gray-600); }
.badge.decision { background: var(--red-50);  color: var(--pr-primary-color); }
.badge.veille   { background: var(--blue-50); color: var(--pr-secondary-color); }
.badge.primary  { background: var(--pr-primary-color); color: var(--surface); }
.badge.danger   { background: var(--pr-primary-transp); color: var(--pr-primary-color); }
.badge.warn     { background: var(--amber-100); color: var(--amber-800); }

.badge-importance { border-radius: 4px; font-size: var(--fs-11); letter-spacing: .04em; text-transform: uppercase; }
.badge-importance.imp-critical { background: var(--red-50);     color: var(--pr-primary-color); }
.badge-importance.imp-high     { background: var(--amber-50);   color: var(--amber-700); }
.badge-importance.imp-medium   { background: var(--blue-50);    color: var(--pr-secondary-color); }
.badge-importance.imp-low      { background: var(--neutral-100); color: var(--gray-500); }

/* ─── Alerts ─────────────────────────────────────────────────────────────── */
.alert { padding: var(--sp-12) var(--sp-16); border-radius: var(--radius); margin-bottom: var(--sp-20); font-size: var(--fs-14); }
.alert-error { background: var(--pr-primary-transp); color: var(--pr-primary-color); border: 1px solid var(--red-200); }
.alert-success { background: var(--green-50); color: var(--green-800); border: 1px solid var(--green-200); }

/* ─── Page header ────────────────────────────────────────────────────────── */
.page-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: var(--sp-24) 0; gap: var(--sp-16);
}
.page-header h1 { font-size: var(--fs-24); font-weight: 700; }
.page-subtitle { font-size: var(--fs-13); color: var(--gray-500); margin-top: var(--sp-2); }
.page-header-actions { display: flex; align-items: center; gap: var(--sp-12); flex-shrink: 0; }

.page-header--toolbar { justify-content: flex-end; padding: var(--sp-16) 0; }
#authority-compare-app .page-header { padding: 0 0 var(--sp-24); }

.toolbar { display: inline-flex; align-items: center; gap: var(--sp-6); }
.toolbar-btn { position: relative; display: inline-flex; align-items: center; justify-content: center; padding: var(--sp-6) var(--sp-8); border: 1px solid var(--gray-200); background: var(--surface); cursor: pointer; border-radius: var(--radius); color: var(--gray-500); transition: color .15s, border-color .15s, background .15s; }
.toolbar-btn:hover { color: var(--pr-secondary-color); border-color: var(--gray-300); }
.toolbar-btn.is-active { color: var(--surface); background: var(--pr-secondary-color); border-color: var(--pr-secondary-color); }
.toolbar-badge { position: absolute; top: -6px; right: -6px; min-width: 15px; height: 15px; padding: 0 var(--sp-3); font-size: var(--fs-10); line-height: 15px; text-align: center; color: var(--surface); background: var(--pr-primary-color); border-radius: 8px; }

.feed-search { display: inline-flex; align-items: center; gap: var(--sp-6); }
.feed-search-input { width: 0; padding: 0; border: 1px solid transparent; background: var(--surface); border-radius: var(--radius); font: inherit; color: var(--gray-700); opacity: 0; transition: width .2s, opacity .2s, padding .2s; overflow: hidden; }
.feed-search.is-open .feed-search-input { width: 180px; padding: var(--sp-6) var(--sp-10); border-color: var(--gray-200); opacity: 1; }
.feed-search.is-open .feed-search-input:focus { outline: none; border-color: var(--pr-secondary-color); }
/* ─── Responsive (≤ 640px) ───────────────────────────────────────────────── */
@media (max-width: 640px) { .feed-search.is-open .feed-search-input { width: 130px; } }

.filter-group { margin: var(--sp-24) var(--sp-8); }
.folder-dialog-actions { display: flex; gap: var(--sp-8); justify-content: flex-end; margin-top: var(--sp-48)}

@keyframes status-pulse {
  0%   { box-shadow: 0 0 0 0 var(--pulse-color); }
  100% { box-shadow: 0 0 0 6px transparent; }
}

html.view-grid .feed-list:not(.is-explore):not(.is-read) {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: var(--sp-12);
}

/* ─── État vide ────────────────────────────────────────────────────────────── */
.empty, .ais-Hits-empty {
  padding: var(--sp-32) var(--sp-16); text-align: center;
  color: var(--gray-500); font-size: var(--fs-14);
}
.dashboard-page .empty, .authority .empty, .news-detail-page .empty, .rgpd-stats .empty {
  padding: var(--sp-12) 0; text-align: left;
}

/* ─── Table (composant unique) ─────────────────────────────────────────────── */
.table { width: 100%; border-collapse: collapse; font-size: var(--fs-14); text-align: left; }
.table thead th {
  padding: var(--sp-8) var(--sp-12); font-size: var(--fs-13); font-weight: 600;
  color: var(--gray-600); text-align: left; white-space: nowrap;
  border-bottom: 1px solid var(--gray-200);
}
.table tbody td { padding: var(--sp-12); border-bottom: 1px solid var(--gray-100); vertical-align: top; text-align: left; }
.table tbody tr:hover { background: var(--gray-50); }
.table--middle tbody td { vertical-align: middle; }

.table--banner thead th {
  padding: var(--sp-10) var(--sp-12); font-size: var(--fs-12); color: var(--surface);
  background: var(--pr-primary-color); border: none;
}
.table--banner thead th:first-child { border-top-left-radius: var(--radius); border-bottom-left-radius: var(--radius); }
.table--banner thead th:last-child  { border-top-right-radius: var(--radius); border-bottom-right-radius: var(--radius); }
.table--banner thead th.theader { cursor: pointer; user-select: none; }
.table--banner thead th .sort-icon { font-size: var(--fs-10); color: rgba(255,255,255,.75); }

.table--grid th, .table--grid td { border: 1px solid var(--gray-200); padding: var(--sp-8) var(--sp-12); vertical-align: top; }
.table--grid thead th { background: var(--gray-100); color: var(--gray-700); white-space: normal; }
.table--grid tbody tr:hover { background: transparent; }
@media (max-width: 640px) { .table--grid { display: block; overflow-x: auto; } }

.table-scroll, .radar-table-scroll, .fines-table-scroll, .jp-table-scroll { overflow-x: auto; }

/* ─── Card (composant unique) ──────────────────────────────────────────────── */
.card, .hit-content, .form-card {
  background: var(--surface);
  border: 1px solid var(--gray-200);
  border-radius: var(--radius-card);
}
.card {
  box-shadow: var(--shadow-sm);
  overflow: hidden;
}
.card-head {
  display: flex; align-items: center; justify-content: space-between;
  gap: var(--sp-12);
  padding: var(--sp-14) var(--sp-16);
  border-bottom: 1px solid var(--gray-200);
}
.card-head h2, .card-head h3 { margin: 0; font-size: var(--fs-17); color: var(--pr-secondary-color); }
.card .body { padding: var(--sp-14) var(--sp-16); }

/* ─── Forms ──────────────────────────────────────────────────────────────── */
.form-card {
  box-shadow: var(--shadow-sm); margin: auto;
  padding: var(--sp-28); max-width: 720px; display: flex; flex-direction: column; gap: var(--sp-20);
}
.form-card--flush { box-shadow: none; margin: 0; border: 0; padding: 0; }
.form-card--moyen { max-width: 480px; margin: 0 auto; }
.form-pile { display: flex; flex-direction: column; gap: var(--sp-16); }
.btn--pleine { width: 100%; justify-content: center; }
.form-group { display: flex; flex-direction: column; gap: var(--sp-6); }
.form-group label { font-size: var(--fs-14); font-weight: 500; margin-top: var(--sp-8); }
.form-group small { font-size: var(--fs-13); color: var(--gray-600); }
input[type="text"], input[type="email"], input[type="password"], select, textarea, input[type=date] {
  padding: var(--sp-8) var(--sp-12); border: 1px solid var(--gray-200); border-radius: var(--radius);
  font-size: var(--fs-15); background: var(--surface); color: var(--text);
  transition: border-color .15s; font-family: inherit;
}
textarea { resize: vertical; }
.pwd-wrap { position: relative; display: flex; align-items: center; }
.pwd-wrap input[type="password"], .pwd-wrap input[type="text"] { padding-right: var(--sp-40); width: 100%; }
.pwd-toggle { position: absolute; right: .6rem; background: none; border: none; padding: var(--sp-4); cursor: pointer; color: var(--gray-500); line-height: 0; }
.pwd-toggle:hover { color: var(--gray-600); }

.pwd-force { display: flex; align-items: center; gap: var(--sp-8); margin-top: var(--sp-6); }
.pwd-force-bar { flex: 1; height: 4px; border-radius: var(--radius-pill); background: var(--gray-200); overflow: hidden; }
.pwd-force-fill { display: block; height: 100%; width: 0; border-radius: var(--radius-pill);
                  background: var(--gray-400); transition: width .15s, background .15s; }
.pwd-force-txt { font-size: var(--fs-12); color: var(--gray-500); white-space: nowrap; }
.pwd-force[data-niveau="0"] .pwd-force-fill,
.pwd-force[data-niveau="1"] .pwd-force-fill { background: var(--pr-primary-color); }
.pwd-force[data-niveau="2"] .pwd-force-fill { background: var(--amber-500); }
.pwd-force[data-niveau="3"] .pwd-force-fill,
.pwd-force[data-niveau="4"] .pwd-force-fill { background: var(--green-600); }

.pwd-match { font-size: var(--fs-12); margin-top: var(--sp-6); color: var(--gray-500); }
.pwd-match[data-etat="ok"] { color: var(--green-700); }
.pwd-match[data-etat="ko"] { color: var(--pr-primary-color); }

.auth-essai { margin-top: var(--sp-10); font-size: var(--fs-12); color: var(--gray-500); text-align: center; }
.auth-suite { display: flex; flex-direction: column; gap: var(--sp-12); margin-top: var(--sp-16); font-size: var(--fs-14); color: var(--gray-600); }

.form-card--sortie { margin-top: var(--sp-32); border-top: 2px solid var(--gray-200); }
.form-perte-titre { margin-top: var(--sp-12); font-size: var(--fs-13); color: var(--gray-600); font-weight: 500; }
.form-perte { margin: var(--sp-4) 0 var(--sp-16); padding-left: var(--sp-20); font-size: var(--fs-13); color: var(--gray-600); list-style: disc; }
.form-perte li { margin-bottom: var(--sp-4); }
.success-facture { margin-top: var(--sp-12); font-size: var(--fs-13); color: var(--gray-600); }
input[type="text"]:focus, input[type="email"]:focus, input[type="password"]:focus, select:focus, textarea:focus {
  outline: none; border-color: var(--pr-primary-color);
  box-shadow: 0 0 0 3px var(--pr-primary-shadow-box);
}
.contact-form { display: flex; flex-direction: column; gap: var(--sp-20); max-width: 520px; margin: var(--sp-24) auto 0; }
.checkbox-label { display: flex; align-items: center; gap: var(--sp-8); font-weight: 400; font-size: var(--fs-15); cursor: pointer; }
.form-actions { display: flex; align-items: center; gap: var(--sp-12); padding-top: var(--sp-8); }

.switch { display: inline-flex; align-items: center; gap: var(--sp-10); font-size: var(--fs-15); cursor: pointer; }
.switch input { position: absolute; opacity: 0; width: 0; height: 0; }
.switch-track { position: relative; flex: none; width: 40px; height: 22px; border-radius: 22px; background: var(--gray-300); transition: background .15s; }
.switch-track::before { content: ""; position: absolute; top: 2px; left: 2px; width: 18px; height: 18px; border-radius: 50%; background: var(--surface); box-shadow: 0 1px 2px rgba(0,0,0,.25); transition: transform .15s; }
.switch input:checked + .switch-track { background: var(--pr-primary-color); }
.switch input:checked + .switch-track::before { transform: translateX(18px); }
.switch input:focus-visible + .switch-track { box-shadow: 0 0 0 3px var(--pr-primary-shadow-box); }
.settings-form { display: flex; flex-direction: column; gap: var(--sp-20); }
.settings-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-20) var(--sp-32);
}
@media (max-width: 640px) { .settings-grid { grid-template-columns: 1fr; } }

.section-title { font-size: var(--fs-18); font-weight: 600; margin-bottom: var(--sp-16); }

/* ─── Account page ───────────────────────────────────────────────────────── */
.account-section { background: var(--surface); border: 1px solid var(--gray-200); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); padding: var(--sp-20) var(--sp-24); margin-bottom: var(--sp-20); }
.account-row { display: flex; align-items: baseline; gap: var(--sp-16); margin: 0; padding: var(--sp-6) 0; border-bottom: 1px solid var(--gray-100); }
.account-row:last-of-type { border-bottom: none; }
.account-label { width: 9rem; flex-shrink: 0; font-size: var(--fs-14); color: var(--gray-600); font-weight: 500; }
.account-value { margin: 0; font-size: var(--fs-14); color: var(--text); }
.account-hint { font-size: var(--fs-13); color: var(--gray-600); margin-top: var(--sp-12); }

.account-note { display: block; font-size: var(--fs-13); color: var(--gray-500); }
.members-list { display: flex; flex-direction: column; gap: var(--sp-6); margin-bottom: var(--sp-8); }
.member-row { display: flex; align-items: center; gap: var(--sp-12); padding: var(--sp-6) var(--sp-8); background: var(--gray-50); border-radius: var(--radius); }
.member-email { flex: 1; font-size: var(--fs-14); color: var(--text); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ─── Veille : recherches sauvegardées (/saved-searches) ─────────────────── */
.ss-toolbar { margin-bottom: var(--sp-12); }
.ss-search {
  width: 100%; max-width: 22rem; padding: var(--sp-6) var(--sp-10);
  font-size: var(--fs-14); border: 1px solid var(--gray-300); border-radius: var(--radius);
}
.ss-list { display: flex; flex-direction: column; gap: var(--sp-6); margin-bottom: var(--sp-32); }
.ss-list__vide { padding: var(--sp-16); text-align: center; color: var(--gray-500); font-size: var(--fs-14); }

.ss-row { border: 1px solid var(--gray-200); border-radius: var(--radius); background: var(--surface); }
.ss-row[open] { border-color: var(--gray-300); box-shadow: var(--shadow-sm); }
.ss-row__head {
  display: flex; align-items: center; gap: var(--sp-10);
  padding: var(--sp-8) var(--sp-12); cursor: pointer; list-style: none;
}
.ss-row__head::-webkit-details-marker { display: none; }
.ss-row__head:hover { background: var(--gray-50); }
.ss-row[open] .ss-row__head { border-bottom: 1px solid var(--gray-100); }
.ss-row__name {
  font-weight: 600; font-size: var(--fs-14); color: var(--pr-secondary-color);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; flex-shrink: 0; max-width: 40%;
}
.ss-row__filters {
  flex: 1; min-width: 0; margin-left: auto;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  font-size: var(--fs-13); color: var(--gray-600); text-align: right;
}
.ss-row__caret { flex-shrink: 0; font-size: var(--fs-18); line-height: 1; color: var(--gray-500); transform: rotate(90deg); transition: transform .2s; }
.ss-row[open] .ss-row__caret { transform: rotate(-90deg); }
.ss-row .ss-query { font-size: var(--fs-13); color: var(--gray-500); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; flex-shrink: 1; }

.ss-row__body { padding: var(--sp-12); display: flex; flex-direction: column; gap: var(--sp-12); }
.ss-row__foot {
  display: flex; align-items: center; justify-content: space-between;
  gap: var(--sp-16); flex-wrap: wrap;
}
.ss-row__actions { display: flex; align-items: center; gap: var(--sp-8); }

.ss-rename { display: inline-flex; align-items: center; gap: var(--sp-8); margin: 0; }
.ss-rename-trigger { background: none; border: 0; padding: 0; cursor: text; text-align: left; }
.ss-rename-trigger:hover strong { text-decoration: underline dotted; }
.ss-rename-input {
  font-size: var(--fs-15); font-weight: 600; color: var(--pr-secondary-color);
  padding: var(--sp-2) var(--sp-6); border: 1px solid var(--gray-300); border-radius: var(--radius);
  min-width: 12rem;
}

.ss-filters { display: flex; flex-wrap: wrap; gap: var(--sp-6); }
.ss-filter {
  display: inline-flex; align-items: center; gap: var(--sp-6);
  padding: var(--sp-3) var(--sp-8); border-radius: var(--radius);
  background: var(--gray-50); border: 1px solid var(--gray-200);
  font-size: var(--fs-13); line-height: 1.35;
}
.ss-filter-field { color: var(--gray-600); font-weight: 600; }
.ss-filter-value { display: inline-flex; align-items: center; gap: var(--sp-3); color: var(--text); }
.ss-filter-remove { display: inline; margin: 0; }
.ss-filter-remove button {
  background: none; border: 0; padding: 0 var(--sp-2); cursor: pointer;
  color: var(--gray-500); font-size: var(--fs-14); line-height: 1;
}
.ss-filter-remove button:hover { color: var(--pr-primary-color); }
.ss-filters-none { font-size: var(--fs-13); color: var(--gray-500); }

.ss-alert-form { display: flex; align-items: center; gap: var(--sp-20); flex-wrap: wrap; margin: 0; }
.ss-alert-status { font-size: var(--fs-13); color: var(--green-600); white-space: nowrap; opacity: 0; transition: opacity .25s; }
.ss-alert-status.is-visible { opacity: 1; }
.ss-alert-status.is-error { color: var(--pr-primary-color); }
.ss-delete-form { margin: 0; }
.ss-freq { display: inline-flex; align-items: center; gap: var(--sp-8); font-size: var(--fs-14); }
.ss-freq-label { color: var(--gray-600); }
.ss-freq select { padding: var(--sp-4) var(--sp-8); font-size: var(--fs-13); }
.ss-new { max-width: 720px; }
@media (max-width: 640px) {
  .ss-row__head { flex-wrap: wrap; }
  .ss-row__name { max-width: 100%; }
  .ss-row__filters { flex-basis: 100%; text-align: left; margin-left: 0; }
  .ss-alert-form { gap: var(--sp-12); }
}

/* ─── Landing ────────────────────────────────────────────────────────────── */
.hero { text-align: center; padding: var(--sp-80) var(--sp-16) var(--sp-64); }

.hero h1 { font-size: var(--fs-36); font-weight: 700; line-height: 1.2; letter-spacing: -.03em; color: var(--pr-secondary-color); text-wrap: balance; }
.hero-sub { max-width: 520px; margin: var(--sp-20) auto; color: var(--gray-600); font-size: var(--fs-17); }
.hero-cta { display: flex; justify-content: center; align-items: center; gap: var(--sp-16); margin-top: var(--sp-32); flex-wrap: wrap; }
.hero-hint { margin-top: var(--sp-7); font-size: var(--fs-12); color: var(--gray-500); text-align: center; }
.hero-proof {
  margin-top: var(--sp-20); padding-top: var(--sp-16); border-top: 1px solid var(--gray-200);
  font-size: var(--fs-13); font-weight: 600; color: var(--pr-secondary-color); text-align: center;
}
.hero-visual { margin: var(--sp-40) auto 0; max-width: 860px; }

.hero--split {
  display: grid; grid-template-columns: 1.05fr 1fr; gap: var(--sp-48);
  align-items: center; text-align: left;
}
.hero--split .hero-sub  { margin: var(--sp-20) 0; }
.hero--split .hero-cta  { justify-content: flex-start; }
.hero--split .hero-hint  { text-align: left; }
.hero--split .hero-proof { text-align: left; }
.hero--split .hero-visual { margin: 0; max-width: none; }

.hero-badge {
  display: inline-flex; align-items: center; gap: var(--sp-7);
  font-size: var(--fs-12); font-weight: 700; letter-spacing: .02em;
  color: var(--pr-primary-color); background: var(--pr-primary-transp);
  padding: var(--sp-5) var(--sp-11) var(--sp-5) var(--sp-10); border-radius: var(--radius-pill); margin-bottom: var(--sp-16);
}
.hero-badge-dot {
  width: 7px; height: 7px; border-radius: 50%; background: var(--pr-primary-color);
  box-shadow: 0 0 0 0 var(--pr-primary-shadow-box); animation: hero-pulse 2.4s ease-out infinite;
}
@keyframes hero-pulse {
  0%   { box-shadow: 0 0 0 0 var(--pr-primary-shadow-box); }
  70%  { box-shadow: 0 0 0 7px rgba(194,63,56,0); }
  100% { box-shadow: 0 0 0 0 rgba(194,63,56,0); }
}

/* ─── Maquette du Radar ──────────────────────────────────────────────────── */
.mock--radar { gap: var(--sp-10); padding: var(--sp-16); background: var(--surface); box-shadow: var(--shadow-md); }
.mock-window {
  display: flex; align-items: baseline; justify-content: space-between; gap: var(--sp-8);
  padding-bottom: var(--sp-8); border-bottom: 1px solid var(--gray-200);
}
.mock-window-title  { font-size: var(--fs-13); font-weight: 700; color: var(--pr-secondary-color); }
.mock-window-period { font-size: var(--fs-10); color: var(--gray-500); }
.mock-kpis { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-8); }
.mock-kpi {
  background: var(--surface); border: 1px solid var(--gray-200); border-radius: var(--radius);
  padding: var(--sp-10) var(--sp-12); display: grid; gap: var(--sp-3);
}
.mock-kpi-value { font-size: var(--fs-18); font-weight: 700; line-height: 1; color: var(--pr-secondary-color); letter-spacing: -.02em; }
.mock-kpi-label { font-size: var(--fs-10); color: var(--gray-600); }
.mock-table { width: 100%; border-collapse: collapse; background: var(--surface); border: 1px solid var(--gray-200); border-radius: var(--radius); overflow: hidden; }
.mock-table th {
  font-size: var(--fs-9); font-weight: 700; letter-spacing: .03em; text-transform: uppercase;
  color: var(--gray-500); text-align: left; padding: var(--sp-6) var(--sp-8); border-bottom: 1px solid var(--gray-200);
}
.mock-table td { padding: var(--sp-7) var(--sp-8); border-bottom: 1px solid var(--gray-100); vertical-align: middle; }
.mock-table tr:last-child td { border-bottom: 0; }
.mock-auth     { display: block; font-size: var(--fs-11); font-weight: 600; color: var(--heading); }
.mock-auth-sub { display: block; font-size: var(--fs-9); color: var(--gray-500); }
.mock-score { display: flex; align-items: center; gap: var(--sp-6); }
.mock-score-track { flex: 1; min-width: 42px; height: 6px; background: var(--gray-100); border-radius: var(--radius-pill); overflow: hidden; }
.mock-score-fill  { display: block; height: 100%; border-radius: var(--radius-pill); }
.mock-score-val   { font-size: var(--fs-10); font-weight: 700; min-width: 16px; text-align: right; }
.mock-score--hot.mock-score-fill  { background: var(--pr-primary-color); } .mock-score--hot.mock-score-val  { color: var(--pr-primary-color); }
.mock-score--warm.mock-score-fill { background: var(--amber-600); } .mock-score--warm.mock-score-val { color: var(--amber-600); }
.mock-score--cool.mock-score-fill { background: var(--green-700); } .mock-score--cool.mock-score-val { color: var(--green-700); }

.mock-cmp-heads { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-8); }
.mock-cmp-head {
  display: flex; align-items: center; flex-wrap: wrap; gap: var(--sp-4) var(--sp-6);
  background: var(--surface); border: 1px solid var(--gray-200); border-radius: 6px; padding: var(--sp-7) var(--sp-8);
}
.mock-cmp-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.mock-cmp-dot--a { background: var(--blue-700); }
.mock-cmp-dot--b { background: var(--pr-primary-color); }
.mock-cmp-name { font-size: var(--fs-11); font-weight: 700; color: var(--heading); }
.mock-cmp-country { font-size: var(--fs-9); color: var(--gray-500); }
.mock-cmp {
  width: 100%; border-collapse: collapse; background: var(--surface);
  border: 1px solid var(--gray-200); border-radius: var(--radius); overflow: hidden;
}
.mock-cmp th {
  text-align: left; font-size: var(--fs-10); font-weight: 600; color: var(--gray-500);
  padding: var(--sp-6) var(--sp-8); border-bottom: 1px solid var(--gray-100); width: 34%;
}
.mock-cmp td {
  text-align: right; font-size: var(--fs-11); font-weight: 600; color: var(--gray-700);
  padding: var(--sp-6) var(--sp-8); border-bottom: 1px solid var(--gray-100);
}
.mock-cmp tr:last-child th, .mock-cmp tr:last-child td { border-bottom: 0; }
.mock-cmp td.is-top { font-weight: 700; color: var(--pr-secondary-color); background: var(--blue-50); }
.mock-trend { font-size: var(--fs-9); font-weight: 600; padding: var(--sp-2) var(--sp-6); border-radius: 4px; white-space: nowrap; }
.mock-trend--up   { background: var(--pr-primary-transp); color: var(--pr-primary-color); }
.mock-trend--down { background: var(--amber-100); color: var(--amber-800); }

.features { padding: 0 0 var(--sp-64); border-bottom: 1px solid var(--gray-200); }

.pricing { padding: var(--sp-64) 0 var(--sp-80); border-bottom: 1px solid var(--gray-200); }
.pricing-compare { text-align: center; margin-top: -1.75rem; font-size: var(--fs-14); color: var(--gray-600); margin-bottom: var(--sp-32); }
.plans { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--sp-20); max-width: 560px; margin: 0 auto; }
.plans--three { max-width: 840px; }
.plan {
  background: var(--surface); border: 1px solid var(--gray-200); border-radius: var(--radius);
  padding: var(--sp-28); position: relative; display: flex; flex-direction: column;
}
.plan-pro  { border-color: var(--pr-primary-color); }
.plan-team { }
.plan-badge {
  position: absolute; top: -12px; left: 50%; transform: translateX(-50%);
  background: var(--pr-primary-color); color: var(--surface); font-size: var(--fs-12); font-weight: 700;
  padding: var(--sp-3) var(--sp-12); border-radius: var(--radius-pill);
}
.plan-badge--team { background: var(--pr-secondary-color); }
.plan h3 { font-size: var(--fs-16); font-weight: 700; margin-bottom: var(--sp-8); color: var(--pr-secondary-color); }
.plan-price { font-size: var(--fs-32); font-weight: 700; margin-bottom: var(--sp-16); color: var(--pr-secondary-color); }
.plan-price span { font-size: var(--fs-16); font-weight: 400; color: var(--gray-600); }

.plan-price .price-quarterly, .plan-price .price-annual { font-size: var(--fs-32); font-weight: 700; color: var(--pr-secondary-color); }
.plan ul { list-style: none; display: flex; flex-direction: column; gap: var(--sp-6); margin-bottom: var(--sp-24); }
.plan li { font-size: var(--fs-14); color: var(--gray-600); }
.plan li::before { content: '✓ '; color: var(--pr-primary-color); }
.plan li.no { color: var(--gray-400); }
.plan li.no::before { content: '✗ '; color: var(--gray-300); }
.plan .btn { margin-top: auto; }
.plan-price .plan-note { display: block; font-size: var(--fs-13); font-weight: 400; color: var(--gray-500); margin-top: var(--sp-4); }

.billing-period-toggle { display: inline-flex; gap: var(--sp-4); padding: var(--sp-4); margin: 0 auto var(--sp-32); border: 1px solid var(--gray-200); border-radius: var(--radius-pill); background: var(--gray-50); }
.pricing .billing-period-toggle { display: flex; width: max-content; }
.billing-period-toggle .period-option { position: relative; display: inline-flex; align-items: center; gap: var(--sp-6); padding: var(--sp-8) var(--sp-16); border-radius: var(--radius-pill); font-size: var(--fs-14); font-weight: 600; color: var(--gray-600); cursor: pointer; transition: background .15s, color .15s; }
.billing-period-toggle .period-option input { position: absolute; opacity: 0; width: 0; height: 0; }
.billing-period-toggle .period-option.selected { background: var(--pr-primary-color); color: var(--surface); }
.billing-period-toggle .period-save { font-size: var(--fs-12); font-weight: 700; padding: var(--sp-2) var(--sp-6); border-radius: var(--radius-pill); background: color-mix(in srgb, var(--pr-primary-color) 15%, transparent); color: var(--pr-primary-color); }
.billing-period-toggle .period-option.selected .period-save { background: rgba(255,255,255,.25); color: var(--surface); }
.steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--sp-24); max-width: 860px; margin: 0 auto; }
.step {
  background: var(--surface); border: 1px solid var(--gray-200); border-radius: var(--radius);
  padding: var(--sp-24) var(--sp-20); position: relative;
}
.step h3 { font-size: var(--fs-15); font-weight: 600; margin-bottom: var(--sp-6); color: var(--pr-secondary-color); }
.step p  { font-size: var(--fs-14); color: var(--gray-600); }

/* ─── FAQ ────────────────────────────────────────────────────────────────── */
.faq-section { padding: var(--sp-64) 0; }
.faq-list { display: flex; flex-direction: column; max-width: 700px; margin: 0 auto; }
.faq-item { margin-bottom: var(--sp-5); }
.faq-item summary {
  cursor: pointer; list-style: none; outline: none;
  border: 1px solid rgba(0,0,0,.3); border-radius: var(--radius);
  padding: var(--sp-10) var(--sp-40) var(--sp-10) var(--sp-16);
  font-size: var(--fs-15); font-weight: 500; color: var(--pr-secondary-color);
  transition: background-color .4s, color .4s, border-color .4s;
  position: relative;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after {
  content: '>'; font-size: 1.25em;
  position: absolute; right: 14px; top: 50%;
  transform: translateY(-50%) rotate(90deg);
  transition: transform .2s ease;
}
.faq-item[open] summary, .faq-item summary:hover, .faq-item summary:focus {
  background-color: var(--pr-primary-color); color: var(--surface); border-color: var(--neutral-100);
}
.faq-item[open] summary::after { transform: translateY(-50%) rotate(-90deg); }
.faq-panel { padding: var(--sp-10) var(--sp-18) 0; }
.faq-panel p { padding: 0 0 var(--sp-14); font-size: var(--fs-14); color: var(--gray-600); line-height: 1.6; margin: 0; }

/* ─── CTA banner ─────────────────────────────────────────────────────────── */
.cta-banner {
  text-align: center;
  padding: var(--sp-64) var(--sp-20);
  background: var(--pr-primary-transp);
  border-radius: var(--radius);
  margin: 0 0 var(--sp-48);
}
.cta-banner h2 { font-size: var(--fs-28); font-weight: 700; color: var(--pr-secondary-color); margin-bottom: var(--sp-12); letter-spacing: -.02em; }
.cta-banner p  { font-size: var(--fs-16); color: var(--gray-600); margin-bottom: var(--sp-28); }
.btn-lg { padding: var(--sp-11) var(--sp-28); font-size: var(--fs-16); }

.hp-field { position: absolute; opacity: 0; top: 0; left: 0; height: 0; width: 0; z-index: -1; overflow: hidden; }
.contact-section { padding: var(--sp-64) 0 var(--sp-48); }
.contact-section h2 { font-size: var(--fs-24); font-weight: 700; text-align: center; margin-bottom: var(--sp-8); color: var(--pr-secondary-color); }
.contact-sub { text-align: center; color: var(--gray-600); font-size: var(--fs-16); margin-bottom: 0; }
.hint { font-size: var(--fs-13); color: var(--gray-600); font-weight: 400; }
.required { color: var(--pr-primary-color); font-weight: 700; margin-left: var(--sp-2); }
.contact-legal { font-size: var(--fs-13); color: var(--gray-600); line-height: 1.5; margin-top: var(--sp-4); }
.contact-legal a { color: var(--gray-600); text-decoration: underline; }

/* ─── Auth pages ─────────────────────────────────────────────────────────── */
.auth-page { display: flex; flex-direction: column; align-items: center; padding: var(--sp-48) var(--sp-16); }
.auth-banner { width: 100%; max-width: 400px; margin-top: 0; }
.auth-card {
  width: 100%; max-width: 400px;
  display: flex; flex-direction: column; gap: var(--sp-20);
  background: var(--surface); padding: var(--sp-32); border-radius: var(--radius);
  border-left: 4px solid var(--pr-primary-color);
  box-shadow: var(--shadow-glow);
}
.auth-card h1 { font-size: var(--fs-24); font-weight: 700; color: var(--pr-secondary-color); }
.auth-separator { text-align: center; color: var(--gray-400); font-size: var(--fs-14); position: relative; }
.auth-separator::before, .auth-separator::after {
  content: ''; position: absolute; top: 50%; width: 42%; height: 1px; background: var(--gray-200);
}
.auth-separator::before { left: 0; }
.auth-separator::after  { right: 0; }
.auth-switch { font-size: var(--fs-14); color: var(--gray-600); text-align: center; }
.auth-switch--espace { margin-top: var(--sp-12); }

.pwd-toggle .eye-off { display: none; }
.pwd-toggle.is-shown .eye-on { display: none; }
.pwd-toggle.is-shown .eye-off { display: inline; }
.alert-info { color: var(--pr-secondary-color); border: 1px solid var(--pr-secondary-color); margin-top: var(--sp-16);}

.alert-warning { background: var(--amber-100); color: var(--amber-800); border: 1px solid var(--amber-500); border-radius: var(--radius); padding: var(--sp-12) var(--sp-16); font-size: var(--fs-14); }

/* ─── Landing footer ─────────────────────────────────────────────────────── */
.landing-footer {
  border-top: 1px solid var(--gray-200);
  background: var(--surface);
  padding: var(--sp-28) 0;
  margin-top: auto;
}
.landing-footer .container { margin-bottom: 0; }

.landing-footer-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-16);
  flex-wrap: wrap;
}
.footer-brand { font-size: var(--fs-13); color: var(--gray-500); font-weight: 500; }
.footer-nav { display: flex; align-items: center; gap: var(--sp-20); }
.footer-nav a { font-size: var(--fs-13); color: var(--gray-500); }
.footer-nav a:hover { color: var(--text); text-decoration: none; }

.trial-banner {
  display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-8) var(--sp-16);
  padding: var(--sp-10) var(--sp-20);
  background: var(--pr-secondary-transp);
  color: var(--pr-secondary-color);
  border-bottom: 1px solid var(--pr-secondary-color);
  font-size: var(--fs-14);
}
.trial-banner .link { font-weight: 600; text-decoration: underline; }

.free-outro {
  margin-top: var(--sp-24);
  padding-top: var(--sp-16);
  border-top: 1px solid var(--gray-200);
  font-size: var(--fs-13);
  color: var(--gray-500);
  text-align: center;
}
.free-outro .link { font-weight: 600; }

/* ─── Error page ─────────────────────────────────────────────────────────── */
.error-page { text-align: center; padding: var(--sp-80) var(--sp-16); }
.error-page h1 { font-size: var(--fs-80); font-weight: 700; color: var(--pr-secondary-transp); }
.error-page p { font-size: var(--fs-16); color: var(--gray-600); margin-bottom: var(--sp-24); }

.upsell--page {
  text-align: center;
  max-width: 640px;
  margin: var(--sp-64) auto;
  padding: var(--sp-40) var(--sp-32);
  background: var(--surface);
  border: 1px solid var(--gray-200);
  border-radius: var(--radius);
}
.upsell--page .upsell-icon { font-size: var(--fs-40); line-height: 1; margin-bottom: var(--sp-12); }
.upsell--page h1 { font-size: var(--fs-24); font-weight: 700; color: var(--pr-secondary-color); margin-bottom: var(--sp-12); }
.upsell-lede { font-size: var(--fs-15); color: var(--gray-600); max-width: 46ch; margin: 0 auto var(--sp-24); }

.upsell-preview {
  display: grid; gap: var(--sp-8);
  padding: var(--sp-16); margin-bottom: var(--sp-24);
  background: var(--gray-50); border: 1px solid var(--gray-200); border-radius: var(--radius);
  filter: blur(2.5px); opacity: .7; pointer-events: none; user-select: none;
}
.upsell-preview span { height: var(--sp-10); border-radius: var(--radius-pill); background: var(--gray-200); }
.upsell-preview--doc span:nth-child(1) { width: 55%; height: var(--sp-16); background: var(--gray-300); }
.upsell-preview--doc span:nth-child(4) { width: 82%; }
.upsell-preview--doc span:nth-child(6) { width: 40%; }
.upsell-preview--table { grid-template-columns: 2fr 1fr 1fr; }
.upsell-preview--table span:nth-child(-n+3) { background: var(--gray-300); }
.upsell-preview--list { grid-template-columns: 1fr 1fr; }
.upsell-preview--list span { height: var(--sp-32); border-radius: var(--radius); }

.upsell-unlocks-title {
  font-size: var(--fs-12); font-weight: 600; text-transform: uppercase; letter-spacing: .04em;
  color: var(--gray-500); margin-bottom: var(--sp-10);
}
.upsell-unlocks {
  list-style: none; display: grid; gap: var(--sp-8); text-align: left;
  max-width: 420px; margin: 0 auto var(--sp-28); padding: 0;
}
.upsell-unlocks li { position: relative; padding-left: var(--sp-24); font-size: var(--fs-15); color: var(--text); }
.upsell-unlocks li::before { content: "\2713"; position: absolute; left: 0; font-weight: 700; color: var(--pr-primary-color); }

.upsell-price { font-size: var(--fs-15); font-weight: 600; color: var(--text); margin-top: var(--sp-16); }
.upsell-reassure { font-size: var(--fs-12); color: var(--gray-500); margin-top: var(--sp-4); }
.upsell-secondary { display: inline-block; font-size: var(--fs-14); margin-top: var(--sp-16); }

.upsell--inline .alert-texte { flex: 1 1 320px; }

.upsell--inline-card {
  border: 1px solid var(--pr-primary-color); border-radius: var(--radius-lg);
  background: var(--pr-primary-transp); padding: var(--sp-20) var(--sp-22); margin-top: var(--sp-16);
}
.upsell-inline-head { display: flex; align-items: flex-start; gap: var(--sp-12); }
.upsell-inline-lock { font-size: var(--fs-20); line-height: 1.2; }
.upsell-inline-title { font-size: var(--fs-15); font-weight: 700; color: var(--pr-secondary-color); }
.upsell-inline-body { font-size: var(--fs-14); color: var(--gray-600); margin-top: var(--sp-4); }
.upsell--inline-card .upsell-preview { margin: var(--sp-16) 0 0; }
.upsell-inline-count { margin-top: var(--sp-14); font-size: var(--fs-14); font-weight: 600; color: var(--text); }
.upsell-inline-actions { display: flex; align-items: center; gap: var(--sp-12); flex-wrap: wrap; margin-top: var(--sp-16); }
.upsell-inline-price { font-size: var(--fs-13); color: var(--gray-600); }

.btn.is-locked { pointer-events: auto; cursor: not-allowed; }

/* ─── Auth buttons (toujours pleine largeur dans la card) ────────────────── */
.auth-card .btn { width: 100%; }

/* ─── Language switcher ──────────────────────────────────────────────────── */
.lang-switcher { display: flex; align-items: center; gap: var(--sp-4); margin-left: var(--sp-4); }
.lang-btn { font-size: var(--fs-12); font-weight: 600; color: var(--gray-500); text-decoration: none; padding: var(--sp-2) var(--sp-4); border-radius: 3px; }
.lang-btn:hover { color: var(--text); }
.lang-btn--active { color: var(--pr-primary-color); }
.lang-sep { font-size: var(--fs-12); color: var(--gray-300); }

/* ─── Nav mobile : hamburger + drawer ────────────────────────────────────── */
.nav-toggle {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: var(--sp-5);
  width: 36px;
  height: 36px;
  background: none;
  border: none;
  cursor: pointer;
  padding: var(--sp-6);
  border-radius: var(--radius);
  flex-shrink: 0;
}
.nav-toggle:hover { background: var(--gray-100); }
.nav-toggle span {
  display: block;
  width: 100%;
  height: 2px;
  background: var(--gray-600);
  border-radius: 2px;
  transition: transform .2s, opacity .2s;
}
.nav-toggle.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-toggle.is-open span:nth-child(2) { opacity: 0; }
.nav-toggle.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.nav-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, .35);
  z-index: var(--z-overlay);
}
.nav-overlay.is-open { display: block; }

.nav-drawer {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  width: 240px;
  background: var(--surface);
  box-shadow: -4px 0 24px rgba(0, 0, 0, .12);
  z-index: var(--z-drawer);
  transform: translateX(100%);

  visibility: hidden;
  transition: transform .25s ease, visibility 0s linear .25s;
  display: flex;
  flex-direction: column;
  padding: var(--sp-16) var(--sp-20);
}
.nav-drawer.is-open { transform: translateX(0); visibility: visible; transition: transform .25s ease, visibility 0s; }

.nav-drawer-close {
  align-self: flex-end;
  background: none;
  border: none;
  cursor: pointer;
  font-size: var(--fs-20);
  line-height: 1;
  color: var(--gray-500);
  padding: var(--sp-4);
  margin-bottom: var(--sp-20);
}
.nav-drawer-close:hover { color: var(--text); }

.nav-drawer nav {
  display: flex;
  flex-direction: column;
  gap: var(--sp-12);
}
.nav-drawer nav a { font-size: var(--fs-15); color: var(--gray-600); }
.nav-drawer nav a:hover { color: var(--text); text-decoration: none; }
.nav-drawer nav .btn { width: 100%; justify-content: center; }
.nav-drawer nav form { margin: 0; }

.nav-drawer-lang {
  display: flex;
  align-items: center;
  gap: var(--sp-4);
  margin-top: var(--sp-24);
  padding-top: var(--sp-16);
  border-top: 1px solid var(--gray-200);
}

/* ─── Pagination ─────────────────────────────────────────────────────────── */
.pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-16);
  margin: var(--sp-24) 0 var(--sp-8);
}

/* ─── Legal pages ────────────────────────────────────────────────────────── */
.legal-page {
  padding: var(--sp-48) var(--sp-20) var(--sp-64);
  max-width: 900px;
}
.legal-page h1 {
  font-size: var(--fs-28);
  font-weight: 700;
  margin-bottom: var(--sp-8);
  color: var(--pr-secondary-color);
}
.legal-updated {
  font-size: var(--fs-14);
  color: var(--gray-500);
  margin-bottom: var(--sp-40);
}
.legal-page h2 {
  font-size: var(--fs-18);
  font-weight: 600;
  margin: var(--sp-32) 0 var(--sp-12);
  color: var(--gray-900);
}
.legal-page h3 {
  font-size: var(--fs-16);
  font-weight: 600;
  margin: var(--sp-24) 0 var(--sp-8);
  color: var(--gray-700);
}
.legal-page p,
.legal-page li {
  font-size: var(--fs-15);
  line-height: 1.7;
  color: var(--gray-700);
  margin-bottom: var(--sp-12);
}
.legal-page ul {
  padding-left: var(--sp-24);
  margin-bottom: var(--sp-12);
}
.legal-page a { color: var(--pr-primary-color); }
.legal-table { margin: var(--sp-16) 0 var(--sp-24); }
.legal-table-wrap { overflow-x: auto; margin: var(--sp-16) 0 var(--sp-24); }
.legal-table-wrap .legal-table { margin: 0; min-width: 700px; }

.legal-register { display: flex; flex-direction: column; gap: var(--sp-5); margin: var(--sp-16) 0 var(--sp-24); }
.legal-item > summary {
  cursor: pointer; list-style: none; outline: none;
  border: 1px solid var(--gray-200); border-radius: var(--radius);
  background: var(--gray-100);
  padding: var(--sp-10) var(--sp-40) var(--sp-10) var(--sp-16);
  font-size: var(--fs-15); font-weight: 500; color: var(--pr-secondary-color);
  position: relative; transition: background-color .2s, border-color .2s;
}
.legal-item > summary::-webkit-details-marker { display: none; }
.legal-item > summary::after {
  content: '>'; font-size: 1.25em;
  position: absolute; right: 14px; top: 50%;
  transform: translateY(-50%) rotate(90deg);
  transition: transform .2s ease;
}
.legal-item[open] > summary::after { transform: translateY(-50%) rotate(-90deg); }
.legal-item > summary:hover, .legal-item > summary:focus-visible { border-color: var(--pr-primary-color); }
.legal-panel { padding: var(--sp-12) var(--sp-16) var(--sp-4); }
.legal-panel dl { display: grid; grid-template-columns: 200px 1fr; gap: var(--sp-8) var(--sp-16); margin: 0; }
.legal-panel dt { font-weight: 600; color: var(--pr-secondary-color); font-size: var(--fs-14); }
.legal-panel dd { margin: 0; font-size: var(--fs-14); color: var(--gray-600); line-height: 1.6; }
.legal-panel dd ul { margin: 0; padding-left: var(--sp-18); }
.legal-panel dd li { margin-bottom: var(--sp-4); }
.legal-note { margin: var(--sp-14) 0 0; font-size: var(--fs-14); color: var(--gray-600); line-height: 1.6; }
@media (max-width: 640px) {
  .legal-panel dl { grid-template-columns: 1fr; gap: var(--sp-2) 0; }
  .legal-panel dt { margin-top: var(--sp-10); }
}

/* ─── Wiki (centre d'aide public) ────────────────────────────────────────── */
.wiki-index { padding-bottom: var(--sp-64); }
.wiki-cats { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: var(--sp-24); margin-top: var(--sp-24); }
.wiki-cat { padding: var(--sp-18) var(--sp-20); background: var(--surface); border: 1px solid var(--gray-200); border-radius: var(--radius-lg); box-shadow: var(--shadow-xs); }
.wiki-cat h2 { margin: 0 0 var(--sp-12); font-size: var(--fs-13); font-weight: 700; letter-spacing: .03em; text-transform: uppercase; color: var(--pr-primary-color); }
.wiki-cat-list { margin: 0; padding: 0; list-style: none; }
.wiki-cat-list li + li { margin-top: var(--sp-14); }
.wiki-cat-list a { font-size: var(--fs-15); font-weight: 600; color: var(--pr-secondary-color); }
.wiki-cat-list a:hover { color: var(--pr-primary-color); }
.wiki-cat-list p { margin: var(--sp-3) 0 0; font-size: var(--fs-13); line-height: 1.5; color: var(--gray-600); }

.wiki-title { display: flex; align-items: center; gap: var(--sp-10); margin: 0 0 var(--sp-8); font-size: var(--fs-28); font-weight: 700; color: var(--pr-secondary-color); }
.wiki-title-ico { flex: none; width: 1.15em; height: 1.15em; color: var(--pr-secondary-color); }
.wiki-lede { margin: 0 0 var(--sp-32); font-size: var(--fs-16); line-height: 1.6; color: var(--gray-600); }

.wiki-prose { max-width: 720px; }
.wiki-prose h2 { margin: var(--sp-36) 0 var(--sp-12); font-size: var(--fs-20); font-weight: 600; color: var(--gray-900); }
.wiki-prose h3 { margin: var(--sp-24) 0 var(--sp-8); font-size: var(--fs-16); font-weight: 600; color: var(--gray-700); }
.wiki-prose h2:first-child, .wiki-prose h3:first-child { margin-top: 0; }
.wiki-prose p { margin: 0 0 var(--sp-12); font-size: var(--fs-15); line-height: 1.7; color: var(--gray-700); }
.wiki-prose ul, .wiki-prose ol { margin: 0 0 var(--sp-12); padding-left: var(--sp-24); }
.wiki-prose li { margin-bottom: var(--sp-5); font-size: var(--fs-15); line-height: 1.7; color: var(--gray-700); }
.wiki-prose a { color: var(--pr-primary-color); }
.wiki-prose strong { color: var(--gray-900); }
.wiki-prose table { width: 100%; border-collapse: collapse; margin: var(--sp-16) 0 var(--sp-24); font-size: var(--fs-14); }
.wiki-prose th, .wiki-prose td { padding: var(--sp-8) var(--sp-10); border: 1px solid var(--gray-200); text-align: left; vertical-align: top; }
.wiki-prose th { background: var(--gray-100); font-weight: 600; color: var(--gray-900); }
.wiki-prose .toolbar-btn { vertical-align: middle; margin: var(--sp-2) var(--sp-2) var(--sp-2) 0; cursor: default; }
.wiki-prose .toolbar-btn:hover { color: var(--gray-500); border-color: var(--gray-200); }
.wiki-prose .logo-plan { position: static; display: inline-block; vertical-align: middle; }
.wiki-prose .logo-plan--free { background: var(--pr-secondary-color); }

.wiki-cta { margin-top: var(--sp-40); padding: var(--sp-24); background: var(--pr-secondary-color); border-radius: var(--radius-lg); }
.wiki-cta p { margin: 0 0 var(--sp-12); font-size: var(--fs-15); color: var(--surface); }

/* ─── Responsive tablette (≤ 900px) ──────────────────────────────────────── */
@media (max-width: 900px) {
  .plans--three { max-width: 560px; }

  .hero--split { grid-template-columns: 1fr; gap: 0; text-align: center; }
  .hero--split .hero-sub  { margin: var(--sp-20) auto; }
  .hero--split .hero-cta  { justify-content: center; }
  .hero--split .hero-hint { text-align: center; }
  .hero--split .hero-visual { margin: var(--sp-32) auto 0; max-width: 560px; }
}

@media (max-width: 640px) {
  .nav { display: none; }
  .nav-toggle { display: flex; }

  .hero { padding: var(--sp-40) var(--sp-16) var(--sp-32); }
  .hero h1 { font-size: var(--fs-26); }
  .hero-sub { font-size: var(--fs-15); }

  .page-header { flex-direction: column; gap: var(--sp-12); padding: var(--sp-24) 0 var(--sp-16); }
  .page-header--toolbar { flex-direction: row; }
  .page-header-actions { flex-wrap: wrap; }

  .steps { grid-template-columns: 1fr; }
  .plans { grid-template-columns: 1fr; }
  .cta-banner h2 { font-size: var(--fs-22); }
  .faq-item summary { font-size: var(--fs-14); }

  .landing-footer-inner { flex-direction: column; gap: var(--sp-12); }
}
.kpi-card {
  background: var(--surface); border: 1px solid var(--gray-200);
  border-radius: var(--radius); padding: var(--sp-18) var(--sp-16);
}
.kpi-value {
  font-size: var(--fs-30); font-weight: 700; line-height: 1;
  color: var(--pr-secondary-color); letter-spacing: -.02em;
}
.kpi-grid .kpi-value { font-size: var(--fs-18); }
.kpi-label { font-size: var(--fs-13); color: var(--gray-600); margin-top: var(--sp-6); }

/* ─── Landing Kortlex : sections additionnelles ──────────────────────────── */
/* ─── « Pourquoi Kortlex » ───────────────────────────────────────────────── */
.why { padding: var(--sp-56) 0; border-bottom: 1px solid var(--gray-200); }

.why-panels {
  display: grid; grid-template-columns: 1fr auto 1fr; gap: var(--sp-20);
  align-items: center; max-width: 900px; margin: 0 auto;
}
.why-arrow { color: var(--gray-300); font-size: var(--fs-24); line-height: 1; }
.why-panel { border-radius: var(--radius-card); padding: var(--sp-20); display: grid; gap: var(--sp-10); }
.why-panel h3 { font-size: var(--fs-12); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.why-lead { font-size: var(--fs-13); color: var(--gray-600); }
.why-foot { font-size: var(--fs-14); font-weight: 600; }

.why-panel--before { background: var(--gray-100); border: 1px dashed var(--gray-300); }
.why-panel--before h3 { color: var(--gray-500); }
.why-panel--before .why-foot { color: var(--gray-600); }
.why-scatter { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: var(--sp-6); }
.why-scatter li {
  font-size: var(--fs-13); color: var(--gray-600); background: var(--surface);
  border: 1px solid var(--gray-300); border-radius: 6px; padding: var(--sp-5) var(--sp-10);
}
.why-scatter li:nth-child(2n) { transform: rotate(-1.2deg); }
.why-scatter li:nth-child(3n) { transform: rotate(1.5deg); }
.why-scatter li:nth-child(5n) { transform: rotate(-.6deg); }

.why-panel--after { background: var(--surface); border: 1px solid var(--gray-200); box-shadow: var(--shadow-sm); }
.why-panel--after h3 { color: var(--pr-primary-color); }
.why-panel--after .why-foot { color: var(--pr-secondary-color); }
.why-mock { margin: 0; }

.why-edge {
  max-width: 640px; margin: var(--sp-28) auto 0; text-align: center;
  font-size: var(--fs-15); line-height: 1.6; color: var(--gray-600);
}
.why-edge strong { color: var(--pr-secondary-color); }

@media (max-width: 900px) {
  .why-panels { grid-template-columns: 1fr; }
  .why-arrow  { transform: rotate(90deg); justify-self: center; }
}

.proof { max-width: 960px; margin: 0 auto var(--sp-56); }
.proof-kicker {
  text-align: center; font-size: var(--fs-12); font-weight: 700; letter-spacing: .08em;
  text-transform: uppercase; color: var(--gray-500); margin-bottom: var(--sp-20);
}
.proof-quotes { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--sp-20); }
.proof-card {
  background: var(--surface); border: 1px solid var(--gray-200); border-radius: var(--radius-card);
  padding: var(--sp-24); margin: 0; box-shadow: var(--shadow-sm);
  display: flex; flex-direction: column; gap: var(--sp-14); position: relative; overflow: hidden;
}

.proof-card::before {
  content: "\201C"; position: absolute; top: -1.25rem; right: .75rem;
  font-size: var(--fs-80); line-height: 1; color: var(--pr-tertiary-transp); pointer-events: none;
}
.proof-tag {
  align-self: flex-start; font-size: var(--fs-11); font-weight: 700;
  padding: var(--sp-3) var(--sp-10); border-radius: var(--radius-pill);
  background: var(--pr-tertiary-transp); color: var(--pr-tertiary-color);
}
.proof-text {
  font-size: var(--fs-16); line-height: 1.55; color: var(--gray-800); margin: 0;
  position: relative; z-index: var(--z-base); flex: 1;
}

.proof-text::before { content: "\00AB\00A0"; }
.proof-text::after  { content: "\00A0\00BB"; }
:lang(en) .proof-text::before { content: "\201C"; }
:lang(en) .proof-text::after  { content: "\201D"; }
.proof-author { display: flex; align-items: center; gap: var(--sp-12); padding-top: var(--sp-14); border-top: 1px solid var(--gray-100); }
.proof-avatar {
  width: 36px; height: 36px; border-radius: 50%; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--pr-secondary-transp); color: var(--pr-secondary-color);
  font-weight: 700; font-size: var(--fs-15);
}
.proof-identity { display: grid; }
.proof-name { font-size: var(--fs-14); font-weight: 700; color: var(--heading); }
.proof-role { font-size: var(--fs-13); color: var(--gray-500); }

@media (max-width: 900px) {
  .proof-quotes { grid-template-columns: 1fr; }
}

/* ─── Section « Comment ça marche » (landing) ────────────────────────────── */
/* ─── Partenaires (landing) ──────────────────────────────────────────────── */
.partners {
  background: var(--surface-alt);
  border-top: 1px solid var(--gray-200);
  padding: var(--sp-48) 0 var(--sp-56);
}
.partners .container { margin-bottom: 0; }
.partners-title {
  text-align: center; font-size: var(--fs-28); font-weight: 700;
  color: var(--pr-secondary-color); letter-spacing: -.02em; margin-bottom: var(--sp-32);
}
.partners-logos {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: center;
  gap: var(--sp-56);
}
.partners-logo {
  display: inline-flex; align-items: center; justify-content: center;
  transition: transform .2s ease;
}
.partners-logo:hover, .partners-logo:focus-visible { transform: translateY(-3px); }
.partners-logo img { display: block; width: auto; max-width: 100%; height: 124px; object-fit: contain; }
.partners-logo--rond img {
  width: 124px; border-radius: 50%; object-fit: cover; background: var(--surface);
}

@media (max-width: 640px) {
  .partners { padding: var(--sp-32) 0 var(--sp-36); }
  .partners-title { font-size: var(--fs-22); margin-bottom: var(--sp-24); }
  .partners-logos { gap: var(--sp-32); }
  .partners-logo img { height: 88px; }
  .partners-logo--rond img { width: 88px; }
}

.sec-kicker {
  text-align: center; font-size: var(--fs-12); font-weight: 700; letter-spacing: .08em;
  text-transform: uppercase; color: var(--pr-tertiary-color); margin-bottom: var(--sp-8);
}
.sec-title {
  font-size: var(--fs-28); font-weight: 700; text-align: center;
  color: var(--pr-secondary-color); letter-spacing: -.02em; margin-bottom: var(--sp-40);
}

.pipeline {
  list-style: none; padding: 0; max-width: 960px; margin: 0 auto var(--sp-56);
  display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-16); counter-reset: step;
}
.pipeline-step {
  position: relative; background: var(--surface); border: 1px solid var(--gray-200);
  border-radius: var(--radius-card); padding: var(--sp-24) var(--sp-20) var(--sp-20);
  box-shadow: var(--shadow-xs);
}

.pipeline-step + .pipeline-step::before {
  content: "→"; position: absolute; left: -.95rem; top: 50%; transform: translateY(-50%);
  color: var(--gray-300); font-size: var(--fs-18); line-height: 1;
}
.pipeline-icon { font-size: var(--fs-28); line-height: 1; display: block; }
.pipeline-num {
  position: absolute; top: 1.25rem; right: 1.25rem;
  width: 22px; height: 22px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--pr-primary-transp); color: var(--pr-primary-color);
  font-size: var(--fs-12); font-weight: 700;
}
.pipeline-step h3 { font-size: var(--fs-16); font-weight: 700; color: var(--pr-secondary-color); margin: var(--sp-12) 0 var(--sp-6); }
.pipeline-step p { font-size: var(--fs-14); color: var(--gray-600); line-height: 1.55; }

.pillars-carousel { max-width: 960px; margin: 0 auto; }
.pillars {
  display: flex; gap: var(--sp-24); overflow-x: auto; padding: var(--sp-4);
  scroll-snap-type: x mandatory; scroll-behavior: smooth; overscroll-behavior-x: contain;
  scrollbar-width: none;
}
.pillars::-webkit-scrollbar { display: none; }
.pillars:focus-visible { outline: 2px solid var(--pr-tertiary-color); outline-offset: 4px; border-radius: var(--radius-card); }
.pillar {
  flex: 0 0 100%; scroll-snap-align: start;
  background: var(--surface); border: 1px solid var(--gray-200); border-radius: var(--radius-card);
  padding: var(--sp-28); box-shadow: var(--shadow-sm);
  display: flex; flex-direction: column;
}

.carousel-dots { display: flex; align-items: center; justify-content: center; gap: var(--sp-4); margin-top: var(--sp-20); }
.carousel-dot {
  width: 24px; height: 24px; padding: 0; border: 0; background: none; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
}
.carousel-dot::before {
  content: ''; width: 8px; height: 8px; border-radius: 50%;
  background: var(--gray-300); transition: background .15s, transform .15s;
}
.carousel-dot:hover::before { background: var(--gray-400); }
.carousel-dot.is-active::before { background: var(--pr-primary-color); transform: scale(1.3); }
.carousel-dot:focus-visible { outline: 2px solid var(--pr-tertiary-color); outline-offset: 0; border-radius: 50%; }
.pillar-tag {
  display: inline-block; font-size: var(--fs-11); font-weight: 700; letter-spacing: .06em;
  padding: var(--sp-3) var(--sp-10); border-radius: var(--radius-pill); margin-bottom: var(--sp-12);
}
.pillar-tag--veille { background: var(--pr-primary-transp); color: var(--pr-primary-color); }
.pillar-tag--doc    { background: var(--pr-tertiary-transp); color: var(--pr-tertiary-color); }
.pillar-tag--radar  { background: var(--pr-secondary-transp); color: var(--pr-secondary-color); }
.pillar-head h3 { font-size: var(--fs-20); font-weight: 700; color: var(--pr-secondary-color); letter-spacing: -.01em; }
.pillar-head p  { font-size: var(--fs-15); color: var(--gray-600); margin-top: var(--sp-8); line-height: 1.55; }
.pillar-list { list-style: none; padding: 0; margin: var(--sp-20) 0 0; display: grid; gap: var(--sp-10); }
.pillar-list li { position: relative; padding-left: var(--sp-22); font-size: var(--fs-14); color: var(--gray-700); line-height: 1.5; }
.pillar-list li::before {
  content: "✓"; position: absolute; left: 0; top: 0;
  color: var(--pr-tertiary-color); font-weight: 700; font-size: var(--fs-13);
}

@media (min-width: 900px) {
  .pillar {
    display: grid; align-content: center; padding: var(--sp-32);
    grid-template-columns: 1fr 1fr; grid-template-areas: "head mock" "list mock";
    column-gap: var(--sp-32); row-gap: var(--sp-8);
  }
  .pillar-head  { grid-area: head; }
  .pillar .mock { grid-area: mock; align-self: center; margin-top: 0; }
  .pillar-list  { grid-area: list; align-self: start; }
}

.mock {
  margin-top: var(--sp-20); padding: var(--sp-14); border-radius: var(--radius);
  background: var(--gray-50); border: 1px solid var(--gray-200);
  display: grid; gap: var(--sp-8); user-select: none;
}
.mock-faded { opacity: .45; }
.mock-lines { display: grid; gap: var(--sp-5); min-width: 0; }
.mock-lines i { display: block; height: 6px; border-radius: 3px; background: var(--gray-200); }
.mock-lines .l-95 { width: 95%; } .mock-lines .l-85 { width: 85%; } .mock-lines .l-80 { width: 80%; }
.mock-lines .l-70 { width: 70%; } .mock-lines .l-55 { width: 55%; }
.mock-lines .l-50 { width: 50%; } .mock-lines .l-40 { width: 40%; }
.mock-date { font-size: var(--fs-10); color: var(--gray-500); }

/* ─── Maquette du fil ────────────────────────────────────────────────────── */
.mock-chips { display: grid; gap: var(--sp-5); }
.mock-chip {
  display: flex; align-items: center; gap: var(--sp-6);
  font-size: var(--fs-11); padding: var(--sp-5) var(--sp-8); border-radius: 6px;
  background: var(--gray-50); border: 1px dashed var(--gray-200); color: var(--gray-700);
}
.mock-chip::before { content: ''; width: 3px; height: 12px; border-radius: 2px; background: var(--slate-200); flex-shrink: 0; }
.mock-chip.is-on { background: var(--surface); border-style: solid; border-color: var(--slate-300); color: var(--heading); box-shadow: var(--shadow-xs); }
.mock-chip.is-on::before { background: var(--pr-primary-color); }
.mock-chip.is-on::after { content: '✓'; margin-left: auto; font-weight: 700; color: var(--pr-primary-color); }

.mock-card {
  background: var(--surface); border: 1px solid var(--gray-200); border-left: 4px solid var(--gray-400);
  border-radius: 8px; padding: var(--sp-10) var(--sp-12); display: grid; gap: var(--sp-6);
}
.mock-card--critical { border-left-color: var(--pr-primary-color); }
.mock-card--high     { border-left-color: var(--amber-400); }
.mock-card-head { display: flex; gap: var(--sp-5); flex-wrap: wrap; align-items: center; }
.mock-imp {
  font-size: var(--fs-9); font-weight: 600; letter-spacing: .04em; text-transform: uppercase;
  padding: var(--sp-2) var(--sp-6); border-radius: 4px;
}
.mock-imp--critical { background: var(--red-50); color: var(--pr-primary-color); }
.mock-imp--high     { background: var(--amber-50); color: var(--amber-700); }
.mock-type { font-size: var(--fs-9); font-weight: 600; padding: var(--sp-2) var(--sp-6); border-radius: 4px; }
.mock-type--decision { background: var(--red-50); color: var(--pr-primary-color); }
.mock-type--veille   { background: var(--blue-50); color: var(--pr-secondary-color); }
.mock-card-title { font-size: var(--fs-12); font-weight: 600; color: var(--heading); line-height: 1.35; }
.mock-card-foot { display: flex; gap: var(--sp-5); flex-wrap: wrap; padding-top: var(--sp-6); border-top: 1px solid var(--gray-200); }
.mock-tag { font-size: var(--fs-9); padding: var(--sp-2) var(--sp-6); border-radius: var(--radius-pill); background: var(--gray-100); color: var(--gray-700); }
.mock-tag--match { background: var(--blue-50); color: var(--pr-secondary-color); border: 1px solid var(--pr-secondary-color); }

/* ─── Maquette de la recherche ───────────────────────────────────────────── */
.mock-topbar { display: flex; gap: var(--sp-6); }
.mock-input {
  flex: 1; min-width: 0; display: flex; align-items: center; gap: var(--sp-6);
  background: var(--surface); border: 1px solid var(--pr-tertiary-color); border-radius: 6px;
  padding: var(--sp-6) var(--sp-8); box-shadow: var(--shadow-glow);
}
.mock-search-icon { font-size: var(--fs-12); flex-shrink: 0; }
.mock-query { font-size: var(--fs-12); color: var(--gray-700); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mock-caret { width: 1px; height: 13px; background: var(--pr-tertiary-color); flex-shrink: 0; animation: mock-blink 1.1s step-end infinite; }
@keyframes mock-blink { 50% { opacity: 0; } }
.mock-select {
  flex-shrink: 0; font-size: var(--fs-11); color: var(--gray-700);
  background: var(--surface); border: 1px solid var(--gray-300); border-radius: 6px; padding: var(--sp-6) var(--sp-8);
}
.mock-search-body { display: grid; grid-template-columns: 88px 1fr; gap: var(--sp-8); }
.mock-facets {
  display: grid; gap: var(--sp-3); align-content: start;
  border-right: 1px solid var(--gray-200); padding-right: var(--sp-8);
}
.mock-facet-title {
  font-size: var(--fs-9); font-weight: 700; letter-spacing: .03em; text-transform: uppercase;
  color: var(--gray-600); margin-top: var(--sp-4);
}
.mock-facet { display: flex; align-items: center; gap: var(--sp-5); font-size: var(--fs-10); color: var(--gray-600); }
.mock-facet::before {
  content: ''; width: 9px; height: 9px; border-radius: 2px;
  border: 1px solid var(--gray-300); background: var(--surface); flex-shrink: 0;
}
.mock-facet.is-on { color: var(--pr-secondary-color); font-weight: 600; }
.mock-facet.is-on::before { background: var(--pr-secondary-color); border-color: var(--pr-secondary-color); }
.mock-hits { display: grid; gap: var(--sp-6); align-content: start; min-width: 0; }
.mock-stats { font-size: var(--fs-10); color: var(--gray-500); }
.mock-hit {
  background: var(--surface); border: 1px solid var(--gray-200); border-left: 4px solid var(--pr-primary-color);
  border-radius: 8px; padding: var(--sp-8) var(--sp-10); display: grid; gap: var(--sp-5);
  box-shadow: var(--shadow-glow);
}
.mock-hit-title { font-size: var(--fs-12); font-weight: 600; color: var(--heading); line-height: 1.35; }
.mock-themes { display: flex; gap: var(--sp-4); flex-wrap: wrap; }
.mock-themes span {
  font-size: var(--fs-9); padding: var(--sp-2) var(--sp-7); border-radius: 7px;
  background: rgba(0,128,144,.15); color: var(--pr-tertiary-color);
}

.features-bridge {
  text-align: center; font-size: var(--fs-14); color: var(--pr-secondary-color);
  background: var(--surface); border: 1px dashed var(--gray-300); border-radius: var(--radius-pill);
  max-width: 640px; margin: var(--sp-20) auto 0; padding: var(--sp-10) var(--sp-20);
  line-height: 1.5;
}

.features-punch {
  text-align: center; font-size: var(--fs-16); color: var(--gray-600);
  max-width: 640px; margin: var(--sp-32) auto 0; line-height: 1.6;
}
.features-punch strong { color: var(--pr-secondary-color); }

@media (max-width: 900px) {
  .pipeline { grid-template-columns: 1fr; }
  .pipeline-step + .pipeline-step::before { content: none; }
}

@media (max-width: 420px) {
  .pillar { padding: var(--sp-20); }
  .mock-search-body { grid-template-columns: 1fr; }
  .mock-facets { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .mock-caret, .hero-badge-dot { animation: none; }
  .pillars { scroll-behavior: auto; }
  .rgpd-main, .rgpd-menu-chevron { transition: none; }
}

.cta-banner--slim { padding: var(--sp-36) var(--sp-20); }
.cta-banner--slim p { font-size: var(--fs-18); font-weight: 600; color: var(--pr-secondary-color); margin-bottom: var(--sp-20); }

.app-shell { flex: 1; display: flex; align-items: stretch; min-height: 0; }

.app-shell-main { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }

.app-sidebar {
  display: none;
  flex: 0 0 auto;
  width: 260px;
  position: sticky;
  top: 0;
  height: 100vh;
  height: 100dvh;
  padding: var(--sp-20) var(--sp-14) var(--sp-16);
  background: var(--surface);
  border-right: 1px solid var(--gray-200);
}
.app-sidebar-logo { align-self: flex-start; margin: 0 var(--sp-8) var(--sp-28); flex: 0 0 auto; }

.app-nav {
  min-width: 0;
  display: flex; flex-direction: column;
  flex: 1 1 auto; min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: var(--gray-300) transparent;
}
.app-nav-list { list-style: none; display: flex; flex-direction: column; gap: var(--sp-2); flex: 1 1 auto; }

.app-nav .app-nav-link {
  display: flex; align-items: center; gap: var(--sp-11);
  padding: var(--sp-9) var(--sp-10);
  border-radius: var(--radius);
  font-size: var(--fs-14);
  color: var(--gray-600);
  text-decoration: none;
  transition: background .15s ease, color .15s ease;
}
.app-nav .app-nav-link:hover { background: var(--gray-100); color: var(--text); text-decoration: none; }
.app-nav .app-nav-link.is-active {
  background: var(--pr-primary-transp);
  color: var(--pr-primary-color);
  font-weight: 600;
}
.app-nav-icon { display: inline-flex; flex-shrink: 0; color: var(--gray-500); }
.app-nav .app-nav-link:hover .app-nav-icon { color: var(--gray-600); }
.app-nav .app-nav-link.is-active .app-nav-icon { color: var(--pr-primary-color); }
.app-nav-label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.app-nav-sep { margin-top: var(--sp-8); padding-top: var(--sp-8); border-top: 1px solid var(--gray-200); }

.app-nav-apart { margin-top: auto; padding-top: var(--sp-8); }

.app-nav-foot { flex: 0 0 auto; margin-top: auto; padding-top: var(--sp-16); border-top: 1px solid var(--gray-200); }
.app-nav-foot .lang-switcher { justify-content: center; margin: 0 0 var(--sp-12); }

.app-user {
  display: flex; align-items: center; gap: var(--sp-10);
  padding: var(--sp-8) var(--sp-10);
  border-radius: var(--radius);
  text-decoration: none;
  color: var(--gray-700);
}
.app-user:hover { background: var(--gray-100); text-decoration: none; }
.app-user-avatar {
  display: inline-flex; align-items: center; justify-content: center;
  flex-shrink: 0; width: 32px; height: 32px;
  border-radius: 50%;
  background: var(--pr-secondary-transp);
  color: var(--pr-secondary-color);
  font-size: var(--fs-11); font-weight: 700; letter-spacing: .02em;
}
.app-user-text { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
.app-user-name { font-size: var(--fs-13); font-weight: 600; }
.app-user-mail { font-size: var(--fs-11); color: var(--gray-500); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.app-signout-form { margin: var(--sp-4) 0 0; }
.app-signout {
  display: flex; align-items: center; gap: var(--sp-11);
  width: 100%; padding: var(--sp-9) var(--sp-10);
  background: none; border: none; border-radius: var(--radius);
  font: inherit; font-size: var(--fs-14); color: var(--gray-600);
  text-align: left; cursor: pointer;
}
.app-signout:hover { background: var(--gray-100); color: var(--text); }

.nav-drawer--app { width: 280px; padding: var(--sp-16); }
.nav-drawer--app nav { gap: 0; }
.nav-drawer--app .app-nav-foot { margin-top: auto; }

@media (min-width: 1024px) {
  body.app .app-sidebar       { display: flex; flex-direction: column; }
  body.app .app-mobile-header { display: none; }
}

@media (max-width: 1023.98px) {
  body.app .app-mobile-header .nav-toggle { display: flex; }
}

/* ─── Navbar app : menus déroulants ──────────────────────────────────────── */
.nav-group { position: relative; }
.nav-group-label {
  display: inline-flex; align-items: center; gap: var(--sp-4);
  background: none; border: 0; cursor: pointer; padding: var(--sp-4) var(--sp-2);
  font-size: var(--fs-14); font-family: inherit; color: var(--gray-600);
}
.nav-group-label:hover { color: var(--pr-primary-color); }
.nav-caret { font-size: .7em; transition: transform .15s ease; }
@media (hover: hover) and (pointer: fine) {
  .nav-group:hover .nav-caret { transform: rotate(180deg); }
}
.nav-group-label[aria-expanded="true"] .nav-caret { transform: rotate(180deg); }
.nav-submenu {
  position: absolute; top: 100%; left: 0; margin: 0; padding: var(--sp-6);
  min-width: 210px; list-style: none;
  background: var(--surface); border: 1px solid var(--gray-200); border-radius: var(--radius);
  box-shadow: var(--shadow-md);
  opacity: 0; visibility: hidden; transform: translateY(4px);
  transition: opacity .12s ease, transform .12s ease, visibility .12s;
  z-index: var(--z-nav);
}

@media (hover: hover) and (pointer: fine) {
  .nav-group:hover .nav-submenu { opacity: 1; visibility: visible; transform: translateY(0); }
}
.nav-submenu.open {
  opacity: 1; visibility: visible; transform: translateY(0);
}
.nav-submenu li { margin: 0; }
.nav-submenu a {
  display: block; padding: var(--sp-8) var(--sp-10); border-radius: 6px;
  font-size: var(--fs-14); color: var(--gray-700); white-space: nowrap;
}
.nav-submenu a:hover { background: var(--pr-primary-transp); color: var(--pr-primary-color); text-decoration: none; }

.nav-drawer-group { border-bottom: 1px solid var(--gray-100); padding: var(--sp-4) 0; }
.nav-drawer-group summary {
  cursor: pointer; list-style: none; font-weight: 600; font-size: var(--fs-15);
  color: var(--pr-secondary-color); padding: var(--sp-6) 0;
}
.nav-drawer-group summary::-webkit-details-marker { display: none; }
.nav-drawer-group a { display: block; padding: var(--sp-6) 0 var(--sp-6) var(--sp-12); font-size: var(--fs-14); }

/* ─── FIL D'ACTUALITÉS PERSONNALISÉ (page /feed) ─────────────────────────── */
.feed-page .toolbar { gap: var(--sp-12); }

.feed-summary {
  color: var(--gray-700); font-size: var(--fs-14); margin: var(--sp-4) 0 var(--sp-14);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.feed-note { color:var(--gray-500); font-size: var(--fs-13); margin-top: var(--sp-18); }
.feed-day-title { color:var(--gray-500); font-size: var(--fs-14); }

.dash{display:grid;gap: var(--sp-16)}
@media (min-width:980px){ .dash{grid-template-columns:1.1fr 0.9fr} }

.dashboard-page .card .body{min-height:0}
.dash-col{display:grid;gap: var(--sp-16);align-content:start}
.dash-feed-cta{display:block;width:100%;text-align:center;text-decoration:none}

.bars{display:flex;flex-direction:column;gap: var(--sp-8)}
.bar{display:flex;align-items:center;gap: var(--sp-10);font-size: var(--fs-14)}
.bar .facet-link{flex:0 0 34%;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;color:inherit}
.bar .track{flex:1 1 auto;height:10px;border-radius:var(--radius-pill);background:var(--gray-100);overflow:hidden}
.bar .track .fill{display:block;height:100%;border-radius:var(--radius-pill);background:var(--pr-primary-color)}
.bar.active .track .fill{background:var(--pr-primary-color)}

.themes-list{display:flex;flex-wrap:wrap;gap: var(--sp-8)}
.theme-item .facet-link{
  display:inline-flex;align-items:center;gap: var(--sp-6);cursor:pointer;
  padding: var(--sp-5) var(--sp-10);border:1px solid var(--gray-200);border-radius:var(--radius-pill);
  background:var(--surface);font-size: var(--fs-13);color:inherit;
}
.theme-item.active .facet-link{border-color:var(--pr-primary-color);color:var(--pr-primary-color)}
.theme-item .muted{color:var(--gray-500)}

.dashboard-page .bar .facet-link{
  border:1px dashed transparent;border-radius:var(--radius-pill);padding-left: var(--sp-4);text-align:left;
}
.dashboard-page .bar .facet-link:hover,
.dashboard-page .bar.active .facet-link,
.dashboard-page .theme-item .facet-link:hover,
.dashboard-page .theme-item.active .facet-link{
  background:var(--pr-primary-transp);border:1px dashed var(--pr-primary-color);
}

.list .hit-content{
  display:flex;
  gap: var(--sp-12);
  align-items:flex-start;
  background:transparent;border:0;border-left:0;box-shadow:none;padding: 0;
  margin-bottom: var(--sp-14) !important;
}
.list .hit-content:hover{transform:none;box-shadow:none;}
.list .rank{
  flex:0 0 auto;
  min-width:30px;
  height:30px;
  border-radius:8px;
  background-color:var(--pr-secondary-color);
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:700;
  color:white;
}
.list .hit-content .col{min-width:0}
.list .hit-content .card-title{font-size: var(--fs-15)}
.list .hit-content .meta{font-size: var(--fs-12);color:var(--gray-500);margin-top: var(--sp-2)}

.kpi-grid{display:grid;gap: var(--sp-12);grid-template-columns:1fr;margin-bottom: var(--sp-16)}
@media (min-width:680px){ .kpi-grid{grid-template-columns:repeat(3,1fr)} }

.popover{
  position:absolute;z-index: var(--z-popover);display:none;min-width:220px;
  background:var(--surface);border:1px solid var(--gray-200);border-radius:12px;
  box-shadow:0 8px 24px rgba(0,0,0,.10);padding: var(--sp-14);
}
.popover.open{display:block}
.popover-hint{margin: 0 0 var(--sp-10);font-size: var(--fs-13);color:var(--gray-600)}

.popover.filter-popover{width:340px;max-width:calc(100vw - 16px)}

#rangePopover.filter-popover{width:420px}
.popover.filter-popover h3{margin: 0 0 var(--sp-16);font-size: var(--fs-16);color:var(--pr-secondary-color)}
.popover .quickpick{margin-top: var(--sp-16)}
.popover .folder-dialog-actions{margin-top: var(--sp-20)}

.filter-popover-fields{display:flex;flex-direction:column;gap: var(--sp-10)}
#filtersPopover .multiselect{width:100%;max-width:none;box-sizing:border-box}
#filtersPopover .multiselect .selected{max-width:none}

@media (max-width:640px){
  .popover.filter-popover{
    position:fixed!important;
    left:0!important;right:0!important;bottom:0!important;top:auto!important;
    width:100%;max-width:100%;
    border-radius:16px 16px 0 0;
    box-shadow:0 -8px 24px rgba(0,0,0,.18);
    max-height:85vh;overflow-y:auto;
    z-index: var(--z-nav);
  }
}

.saved-searches-chips{display:flex;flex-wrap:wrap;gap: var(--sp-8)}

.feed{max-width:1330px;margin: 0 auto}

.hit-content{
  padding: var(--sp-28) var(--sp-32); max-width:1330px;
  margin-bottom: 0 !important; border-left:4px solid var(--pr-primary-color);
  box-shadow: var(--shadow-glow);
  transition:transform .2s, box-shadow .2s;
  color:var(--text); font-weight:400; cursor:pointer; position:relative;
}
.hit-content:hover{ transform:scale(1.005); box-shadow:0 0 9px 1px rgba(193,210,232,.95); border-top-color:var(--gray-300); border-right-color:var(--gray-300); border-bottom-color:var(--gray-300); }
.hit-content.prio-border-critical { border-left-color: var(--pr-primary-color); }
.hit-content.prio-border-high     { border-left-color: var(--amber-400); }
.hit-content.prio-border-medium   { border-left-color: var(--pr-secondary-color); }
.hit-content.prio-border-low      { border-left-color: var(--gray-400); }

.chips{display:flex;flex-wrap:wrap;gap: var(--sp-8)}
.chip{
  font-size: var(--fs-14); background-color:var(--gray-50); border:1px dashed var(--gray-200); color:var(--gray-800);
  display: inline-flex; align-items: center; gap: var(--sp-8); padding: var(--sp-7) var(--sp-12) var(--sp-7) var(--sp-10);
  border-radius: 8px; width: 100%; cursor:pointer;
}
.chip::before {
  content: ''; display: inline-block; width: 3px; height: 16px; border-radius: 2px;
  background: var(--slate-200); flex-shrink: 0; transition: background 0.15s ease;
}
.chip.active { background: var(--surface); border-color: var(--slate-300); color: var(--heading); box-shadow: 0 1px 4px rgba(15, 23, 42, 0.06);}
.chip.active::before { background: var(--pr-primary-color);}
.chip.active::after { content: '✓'; margin-left: auto; font-size: var(--fs-12); color: var(--pr-primary-color); font-family: system-ui, sans-serif; font-weight: 700; flex-shrink: 0;}
.chip:hover { background: var(--gray-100); border-color: var(--slate-300); color: var(--heading);}
.chip.active:hover { background: var(--red-50); border-color: var(--pr-primary-color);}
.chip.active:hover::before { background: var(--pr-primary-color);}

.chip.match, .tag.match{ border-color:var(--pr-secondary-color); color:var(--pr-secondary-color); background:var(--blue-50); }
.tag{ font-size: var(--fs-12); padding: var(--sp-2) var(--sp-6); border-radius:var(--radius-pill); background:var(--gray-100); color:black; }

.card-header{ display:flex; justify-content:space-between; align-items:baseline; }
.card-title{ display:block; font-weight:600; font-size: var(--fs-16); margin-bottom: var(--sp-6); color:var(--heading); text-decoration:none; }
.card-title:hover{text-decoration:underline}
.context{font-size: var(--fs-15);color:var(--text);margin: 0 0 var(--sp-8)}
.date{margin: -5px 0 var(--sp-8) 0; font-size: var(--fs-12); color:var(--gray-500);}
.card-footer{ display:flex; gap: var(--sp-8); flex-wrap:wrap; font-size: var(--fs-13); padding-top: var(--sp-8); border-top:1px solid var(--gray-200); align-items:center; justify-content:space-between;}
.card-arrow { color:var(--gray-500); font-size: var(--fs-14); transition:color 0.2s, transform 0.2s; flex-shrink:0; }
.hit-content:hover .card-arrow { color: var(--pr-primary-color); transform: translateX(3px); }
.card-tags-group { display:flex; gap: var(--sp-5); flex-wrap:wrap; }

.range-label {color:var(--gray-900);font-weight:600; opacity:.75;}
.range-row{display:flex;gap: var(--sp-12)}
.range-field{ flex:1; display:flex; flex-direction:column; gap: var(--sp-8); color:var(--heading); font-size: var(--fs-14);}
.range-field input{ border:1px solid var(--gray-300); border-radius:10px; padding: var(--sp-10) var(--sp-12); font-size: var(--fs-14);}
.quickpick { margin-top: var(--sp-10); }
.quickpick .range-label { display:block; margin-bottom: var(--sp-8); font-size: var(--fs-13); font-weight:600; color:var(--gray-600); }
.quickpick-btns { display:flex; flex-wrap:wrap; gap: var(--sp-8); align-items:center; }
.quickpick .date {display:inline-flex;align-items:center;gap: var(--sp-8);border:1px solid var(--gray-200);padding: var(--sp-8) var(--sp-12);border-radius:10px;background:var(--surface);cursor:pointer;color: black; font-size: var(--fs-14)}
.quickpick .date.primary{background-color: var(--pr-primary-color);color:var(--surface);border-color:transparent}
.quickpick .date:focus, .quickpick .date:hover, .quickpick .active {background-color: var(--pr-primary-color); color: var(--surface); font-weight: bold; border-color: var(--pr-primary-color)}
.quickpick .date:hover {font-weight: normal}

.view-toggle{ display:flex; gap: var(--sp-8); padding: var(--sp-4); border:1px solid rgba(15,23,42,.10); border-radius:12px; background:rgba(15,23,42,.02); }
.view-btn{
  appearance:none; border:0; cursor:pointer; flex:1; padding: var(--sp-10) var(--sp-10); border-radius:10px;
  background:transparent; font-weight:600; font-size: var(--fs-15); color:var(--heading); display:flex;
  align-items:center; justify-content:center; gap: var(--sp-8); line-height:1;
}
.view-btn:hover{background:rgba(15,23,42,.05); color:black}
.view-btn.is-active{ background: var(--pr-primary-color); color:var(--surface); box-shadow:0 1px 2px rgba(10,61,98,.25); }

#qaPrioToggle .view-btn{ min-width:0; padding: var(--sp-10) var(--sp-6); font-size: var(--fs-14); }

#feedView.view-toggle { display: inline-flex; align-items: center; gap: var(--sp-2); padding: var(--sp-2); border: 0; background: var(--gray-100); border-radius: var(--radius); }
#feedView .view-btn { flex: 0 0 auto; padding: var(--sp-5) var(--sp-7); border: none; background: none; border-radius: calc(var(--radius) - 2px); font-weight: 400; color: var(--gray-500); box-shadow: none; transition: color .15s, background .15s; }
#feedView .view-btn:hover { background: none; color: var(--gray-700); }

html:not(.feed-read) #feedView .view-btn[data-view="explore"],
html.feed-read #feedView .view-btn[data-view="read"] { background: var(--surface); color: var(--pr-secondary-color); box-shadow: var(--shadow-sm); }

.feed-list{ display:flex; flex-direction:column; gap: var(--sp-16); margin-top: var(--sp-16); }
.feed-day{display:block}
.feed-subday{margin-bottom: var(--sp-10); margin-top: var(--sp-14);}
.feed-subday-title{
  margin: 0 0 var(--sp-14); font-size: var(--fs-12); font-weight:700; text-transform:uppercase;
  letter-spacing:0.1em; color:var(--gray-500); display:flex; align-items:center; gap: var(--sp-10);
}
.feed-subday-title::after { content:''; flex:1; height:1px; background:var(--gray-200); }
.feed-day-grid{ display:grid; gap: var(--sp-12); }
.feed-day-grid .hit-content { display:flex; }
.feed-day-grid .hit-content > a{ display:flex; flex-direction:column; flex:1; min-height:0; color:inherit; text-decoration:none;}
.feed-day-grid .hit-content .card-wrapper{ display:flex; flex-direction:column; flex:1; min-height:0;}
.feed-list.is-explore .feed-day-grid .hit-content .context{ flex:0 0 auto; max-height: calc(1.6em * 4); }
.feed-day-grid .hit-content .card-footer{ width:100%; margin-top: auto; flex-wrap:nowrap; align-items:center; }
.feed-day-grid .hit-content .card-footer .card-tags-group{ flex:1 1 auto; min-width:0; }
.feed-day-grid .hit-content .card-footer .card-arrow{ align-self:center; margin-left: auto; }
.feed-list.is-explore .feed-day-grid{ grid-template-columns:repeat(3, minmax(0, 1fr)); grid-auto-rows: 1fr; }
.feed-list.is-explore .feed-day-grid .hit-content .card-header {justify-content: flex-start;}
@media (max-width:1200px){ .feed-list.is-explore .feed-day-grid{ grid-template-columns:repeat(2, minmax(0, 1fr));} }
@media (max-width:720px){  .feed-list.is-explore .feed-day-grid{ grid-template-columns:1fr;} }
.feed-list.is-read .feed-day-grid{ grid-template-columns:1fr;}
.feed-list.is-explore .badge:not(.badge-importance) { display: none; }
.feed-list.is-explore .hit-content {padding: var(--sp-12) var(--sp-12) var(--sp-10); display: flex; flex-direction: column; align-self: stretch;}
.feed-list.is-explore .context{ display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; overflow:hidden;}
.feed-list.is-read .hit-content{padding: var(--sp-18) var(--sp-18) var(--sp-12)}
.feed-list.is-read .card-title{font-size: var(--fs-18)}
.feed-list.is-read .context{line-height:1.6}

.context > :first-child{margin-top: 0}
.context > :last-child{margin-bottom: 0}
.context p{margin: 0 0 var(--sp-8)}
.context strong, .context b{font-weight:600;color:var(--heading)}
.context ul, .context ol{margin: 0 0 var(--sp-8);padding-left: var(--sp-20)}
.context li{margin: 0 0 var(--sp-2)}
.context ul{list-style:disc}
.context ol{list-style:decimal}

.context h1, .context h2, .context h3, .context h4, .context h5, .context h6{
  font-size: var(--fs-15);font-weight:600;color:var(--heading);margin: var(--sp-16) 0 var(--sp-5);line-height:1.3;
}
.context h1{font-size: var(--fs-17)}
.context h2{font-size: var(--fs-16)}

.context a:not(.card-title){color:var(--pr-primary-color);text-decoration:underline;text-underline-offset:2px}
.context a:not(.card-title):hover{text-decoration-thickness:2px}

.feed-list.is-read .context p{margin: 0 0 var(--sp-11)}
.feed-list.is-read .context ul, .feed-list.is-read .context ol{margin: 0 0 var(--sp-11);padding-left: var(--sp-22)}
.feed-list.is-read .context li{margin: 0 0 var(--sp-5)}

.feed-list.is-explore .context p, .feed-list.is-explore .context ul, .feed-list.is-explore .context ol{margin: 0}
.feed-list.is-explore .context li{margin: 0}

.pagination-container { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-16); margin-top: var(--sp-16); font-size: var(--fs-14); color: var(--gray-500); }
.pagination-container button { border: none; background-color: var(--pr-primary-color); color: white; padding: var(--sp-5) var(--sp-10); cursor: pointer; font-size: var(--fs-14); border-radius: 32px; }
.pagination-container button:disabled {background-color: var(--gray-300); cursor: not-allowed;}
#page-info {font-size: var(--fs-14);}
.display-info {font-size: var(--fs-12)}

/* ─── RECHERCHE (Kortlex Documentation) ──────────────────────────────────── */
.save-feedback {
  margin-bottom: var(--sp-12); padding: var(--sp-8) var(--sp-12);
  border-radius: var(--radius); background: var(--green-50, var(--gray-50));
  border: 1px solid var(--gray-200); font-size: var(--fs-14); color: var(--text);
}
.save-feedback a { color: var(--pr-primary-color); text-decoration: underline; margin-left: var(--sp-8); }

.save-popover .save-field { display: block; margin-bottom: var(--sp-12); }
.save-popover .save-field > span { display: block; font-weight: 600; font-size: var(--fs-13); margin-bottom: var(--sp-4); color: var(--gray-700); }
.save-popover input[type="text"],
.save-popover select { width: 100%; padding: var(--sp-6) var(--sp-8); font-size: var(--fs-14); }
.save-popover .save-alert { margin-bottom: var(--sp-8); }
.save-popover #save-frequency-field { margin: var(--sp-8) 0 0; }

.search-page { max-width: none; padding: 0; }
.search-layout { display: flex; align-items: stretch; }
.search-main { flex: 1 1 auto; min-width: 0; padding: 0 var(--sp-28) var(--sp-48); }

.search-main > * { max-width: 1100px; margin-left: auto; margin-right: auto; }

.cmswt-InstantSearch { display: block; margin: 0; }

.cmswt-TopBar { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-12) var(--sp-16); margin-bottom: var(--sp-24); }

.cmswt-SearchGroup { display: flex; align-items: stretch; flex: 1 1 340px; min-width: 260px; }
.cmswt-SearchBox { flex: 1 1 auto; min-width: 0; }
.cmswt-SearchBox .ais-SearchBox-form { position: relative; }
.cmswt-SearchBox .ais-SearchBox-input { width: 100%; height: 56px; padding: 0 var(--sp-40) 0 var(--sp-18); border: 1px solid var(--gray-200); border-radius: var(--radius) 0 0 var(--radius); background: var(--surface); font-size: var(--fs-16); }
.cmswt-SearchBox .ais-SearchBox-input:focus { outline: none; border-color: var(--gray-500); }
.cmswt-Switcher { display: flex; align-items: stretch; }
.cmswt-index-switcher { height: 56px; padding: 0 var(--sp-12); border: 1px solid var(--gray-200); border-left: none; border-radius: 0 var(--radius) var(--radius) 0; background: var(--gray-100); font: inherit; color: var(--text); cursor: pointer; }
.search-restricted-hint { flex: 1 1 auto; min-width: 0; margin: 0; padding: 0 var(--sp-18); display: flex; align-items: center; height: 56px; border: 1px dashed var(--gray-200); border-radius: var(--radius) 0 0 var(--radius); background: var(--gray-100); color: var(--gray-600); font-size: var(--fs-13); }

.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

.cmswt-SearchBox .ais-SearchBox-submit { position: absolute; right: 1rem; top: 0; bottom: 0; display: flex; align-items: center; padding: 0; border: 0; background: none; color: var(--gray-500); cursor: pointer; }
.cmswt-SearchBox .ais-SearchBox-submitIcon { width: 16px; height: 16px; fill: currentColor; }
.cmswt-SearchBox .ais-SearchBox-reset { display: none; }
.cmswt-SearchBox .ais-SearchBox-loadingIndicator {
  position: absolute; right: var(--sp-40); top: 0; bottom: 0;
  display: flex; align-items: center; color: var(--gray-500);
}
.cmswt-SearchBox .ais-SearchBox-loadingIcon { width: 16px; height: 16px; }
.cmswt-Actions { display: flex; align-items: center; gap: var(--sp-8); flex-wrap: wrap; }

.cmswt-SortPanel { margin-bottom: 0; padding-bottom: 0; border-bottom: none; }
.filter-title { font-weight: 700; font-size: var(--fs-12); letter-spacing: .03em; text-transform: uppercase; color: var(--gray-600, var(--gray-600)); margin: var(--sp-8) 0; padding: 0 var(--sp-8); }
#cmswt-sortby select, #cmswt-sortby .ais-SortBy-select { width: 100%; padding: var(--sp-10) var(--sp-11); border: 1px solid var(--gray-200); border-radius: var(--radius); background: var(--surface); font: inherit; color: var(--gray-600, var(--gray-600)); cursor: pointer; }

.cmswt-Stats { font-size: var(--fs-12); color: var(--gray-500); margin-top: var(--sp-12); text-align: right; }
.cmswt-CurrentRefinements { display: flex; flex-wrap: wrap; gap: var(--sp-6); }
.cmswt-CurrentRefinements .ais-CurrentRefinements-label { display: none; }
.cmswt-CurrentRefinements .ais-CurrentRefinements-item { display: inline-flex; gap: var(--sp-6); flex-wrap: wrap; }
.cmswt-CurrentRefinements .ais-CurrentRefinements-category { display: inline-flex; align-items: center; gap: var(--sp-5); background: var(--pr-tertiary-transp); color: var(--pr-tertiary-color); padding: var(--sp-2) var(--sp-8); border-radius: var(--radius-pill); font-size: var(--fs-12); }
.cmswt-CurrentRefinements .ais-CurrentRefinements-delete { border: none; background: none; color: inherit; cursor: pointer; font-weight: 700; }

.cmswt-FilterPanel {
  width: 20%;
  min-width: 300px;
  flex: 0 0 auto;
  align-self: stretch;
  padding: var(--sp-24) var(--sp-20) var(--sp-32);
  border-right: 1px solid var(--gray-100);
}

.cmswt-Body { margin-top: var(--sp-16); }
.cmswt-MainPanel { min-width: 0; }

.recitals { display: flex; align-items: center; justify-content: space-between; padding: var(--sp-11) var(--sp-8); margin-top: var(--sp-4); font-weight: 700; font-size: var(--fs-12); letter-spacing: .03em; text-transform: uppercase; color: var(--gray-600, var(--gray-600)); cursor: pointer; border-radius: var(--radius); user-select: none; transition: background .2s, color .2s; }
.recitals::after { content: '›'; transform: rotate(90deg); font-size: var(--fs-18); line-height: 1; color: var(--gray-500); transition: transform .2s; }
.recitals:hover { background: var(--pr-primary-transp); color: var(--pr-primary-color); }
.recitals.ractive { color: var(--pr-primary-color); }
.recitals.ractive::after { transform: rotate(-90deg); color: var(--pr-primary-color); }
.rpanel { max-height: 0; overflow: hidden; transition: max-height .3s ease; }
.rpanel > div { padding: var(--sp-10) var(--sp-8) var(--sp-16); }
.cmswt-FilterPanel > [id^="facet-"]:not(.rpanel) { padding: var(--sp-5) var(--sp-8) var(--sp-16); }

.ais-RefinementList-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--sp-6); }
.ais-RefinementList--asTags .ais-RefinementList-list { flex-direction: row; flex-wrap: wrap; gap: var(--sp-6); }
.ais-RefinementList-label { display: flex; align-items: center; gap: var(--sp-6); font-size: var(--fs-14); cursor: pointer; }
.ais-RefinementList-count { margin-left: auto; font-size: var(--fs-12); color: var(--gray-500); background: var(--gray-100); border-radius: var(--radius-pill); padding: 0 var(--sp-7); }

.ais-RefinementList--asTags .ais-RefinementList-item { border: 1px solid rgba(0,0,0,.1); border-radius: 5px; padding: var(--sp-6) var(--sp-8); cursor: pointer; font-size: var(--fs-13); transition: background .2s; }
.ais-RefinementList--asTags .ais-RefinementList-item--selected { background: var(--pr-primary-color); border-color: var(--pr-primary-color); }
.ais-RefinementList--asTags .ais-RefinementList-item--selected .ais-RefinementList-label { color: var(--surface); }
.ais-RefinementList--asTags .ais-RefinementList-checkbox { display: none; }
.ais-RefinementList--asTags .ais-RefinementList-count { background: var(--gray-100); color: var(--gray-600, var(--gray-600)); }
.ais-RefinementList-showMore { margin-top: var(--sp-8); font-size: var(--fs-13); background: none; border: none; color: var(--pr-primary-color); cursor: pointer; padding: 0; }
.ais-MenuSelect-select { width: 100%; margin-top: var(--sp-4); padding: var(--sp-8) var(--sp-10); border: 1px solid var(--gray-200); border-radius: var(--radius); background: var(--surface); color: var(--gray-600, var(--gray-600)); font: inherit; }

.rpanel .ais-SearchBox-form { position: relative; }
.rpanel .ais-SearchBox-input { width: 100%; padding: var(--sp-8) var(--sp-32) var(--sp-8) var(--sp-10); margin-bottom: var(--sp-8); border: 1px solid var(--gray-200); border-radius: var(--radius); }
.rpanel .ais-SearchBox-submit { position: absolute; right: .55rem; top: 0; bottom: .5rem; display: flex; align-items: center; padding: 0; border: 0; background: none; color: var(--gray-500); cursor: pointer; }
.rpanel .ais-SearchBox-submitIcon { width: 13px; height: 13px; fill: currentColor; }
.rpanel .ais-SearchBox-reset,
.rpanel .ais-SearchBox-loadingIndicator { display: none; }
.ais-Panel-header { display: none; }
.ais-RangeSlider { margin: var(--sp-20) var(--sp-8); }

.ais-Hits-list, .ais-InfiniteHits-list { list-style: none; margin: 0; padding: 0; }
.cmswt-Result-hits_jurisprudence, .cmswt-Result-hits_veille { display: flex; flex-direction: column; }
.cmswt-Result-hits_jurisprudence .ais-Hits-list,
.cmswt-Result-hits_veille .ais-Hits-list { display: flex; flex-direction: column; gap: var(--sp-16); }
a.applink, .applink { display: block; color: var(--text); }
a.applink:hover { text-decoration: none; }
h5.title { margin: 0 0 var(--sp-2); color: var(--pr-primary-color); font-size: var(--fs-17); font-weight: 700; }
.hit-content .date { font-size: var(--fs-13); color: var(--gray-500); margin: 0 0 var(--sp-10); }
.hit-content .context { font-size: var(--fs-15); line-height: 1.65; color: var(--text); }
.hit-content .context strong, .hit-content > div > strong { color: var(--text); }
.card-title-wrap { margin: 0 0 var(--sp-6); }
a.card-title { display: block; font-size: var(--fs-17); font-weight: 700; color: var(--heading); }
a.card-title:hover { color: var(--pr-secondary-color); text-decoration: underline; }
.rgpd-bref { font-size: var(--fs-15); line-height: 1.65; }
.apports { list-style: none; padding-left: 0; margin: var(--sp-8) 0; }
.apport { margin-left: var(--sp-8); margin-bottom: var(--sp-8); font-size: var(--fs-15); }
.apport::before { content: '✦'; margin-right: .5em; color: var(--pr-tertiary-color); }

.apports-themes .themes, .donnee ul { list-style: none; display: flex; flex-wrap: wrap; gap: var(--sp-6); padding: 0; margin: var(--sp-11) 0 0; }
.theme, .donnees { display: inline-block; padding: var(--sp-2) var(--sp-11); border-radius: 7px; font-size: var(--fs-13); transition: opacity .2s; }
.theme { background: rgba(0,128,144,.15); }
.donnees { background: rgba(0,144,88,.15); }
.theme, .theme a.facet-toggle { color: var(--pr-tertiary-color); }
.donnees, .donnees a.facet-toggle { color: var(--green-600); }
a.facet-toggle { cursor: pointer; text-decoration: none; }
.theme:hover, .donnees:hover { opacity: .8; }
.theme--locked:hover, .donnees--locked:hover {
  opacity: 1;
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24'%3E%3Ctext x='0' y='18' font-size='18'%3E%F0%9F%94%92%3C/text%3E%3C/svg%3E") 12 12, not-allowed;
}
.hit-content mark { background: var(--yellow-100); }

.cmswt-Pagination-jurisprudence, .cmswt-Pagination-veille { margin-top: var(--sp-16); }
.cmswt-Pagination-jurisprudence .ais-Pagination-list, .cmswt-Pagination-veille .ais-Pagination-list { list-style: none; display: flex; flex-wrap: wrap; gap: var(--sp-5); padding: 0; margin: 0 0 var(--sp-16); justify-content: center; }
.ais-Pagination-link { display: inline-block; padding: var(--sp-6) var(--sp-11); border: 1px solid var(--gray-200); border-radius: var(--radius); color: var(--pr-secondary-color); }
.ais-Pagination-item--selected .ais-Pagination-link { background: var(--pr-primary-color); color: var(--surface); border-color: var(--pr-primary-color); }

.typesense-empty-message { margin-top: var(--sp-16); }
.ts-welcome-steps { display: flex; flex-wrap: wrap; gap: var(--sp-16); }
.ts-welcome-step { flex: 1 1 220px; background: var(--pr-primary-transp); border-radius: var(--radius-lg); padding: var(--sp-24); box-shadow: var(--shadow-sm, 0 1px 3px rgba(0,0,0,.08)); text-align: center; }
.ts-welcome-num { width: 40px; height: 40px; margin: 0 auto var(--sp-12); display: flex; align-items: center; justify-content: center; border-radius: 50%; background: white; color: var(--pr-primary-color); font-weight: 700; }
.ts-welcome-step h4 { margin: 0 0 var(--sp-8); color: var(--pr-secondary-color); }
.ts-welcome-step p { margin: 0; font-size: var(--fs-14); color: var(--gray-600, var(--gray-600)); }

.cmswt-FilterPanel-items {
  display: flex; flex-direction: column;
  position: fixed; top: 0; left: 0; bottom: 0;
  width: min(360px, 90vw); z-index: var(--z-modal);
  background: var(--surface); padding: var(--sp-16); overflow-y: auto;
  box-shadow: 2px 0 16px rgba(15, 23, 42, .18);
  transform: translateX(-100%); transition: transform .25s ease;
}
.cmswt-FilterPanel-items.cmswt-FilterPanel-items--show { transform: translateX(0); }

.cmswt-FilterPanel-items .filter-title,
.cmswt-FilterPanel-items .recitals { margin-top: var(--sp-24); }
.cmswt-FilterPanel-items #filterMobileContent > .cmswt-MobileFilterWrapper:first-child .filter-title,
.cmswt-FilterPanel-items #filterMobileContent > .cmswt-MobileFilterWrapper:first-child .recitals { margin-top: 0; }
.cmswt-FilterPanel-items #filterMobileContent > .cmswt-MobileFilterWrapper:has(.recitals) ~ .cmswt-MobileFilterWrapper .recitals { margin-top: var(--sp-4); }
.cmswt-FilterPanel-itemsHeader { display: flex; align-items: center; justify-content: space-between; font-weight: 700; padding-bottom: var(--sp-12); border-bottom: 1px solid var(--gray-100); }
.cmswt-FilterPanel-itemsClose { border: none; background: none; font-size: var(--fs-18); cursor: pointer; }
.cmswt-FilterPanel-itemsFooter { margin-top: auto; padding-top: var(--sp-16); display: flex; gap: var(--sp-8); flex-wrap: wrap; }
.cmswt-FilterPanel-itemsFooter .btn { flex: 1; }

.cmswt-FilterPanel-backdrop { position: fixed; inset: 0; z-index: var(--z-backdrop); background: rgba(0, 0, 0, .4); }

.search-layout > .cmswt-FilterPanel { display: none; }

@media (max-width: 640px) {
  .cmswt-FilterPanel-items { width: 100%; }
}

/* ─── Radar des autorités (/radar) ───────────────────────────────────────── */
.radar-page { padding-bottom: var(--sp-40); }

.card-head.radar-toolbar { flex-wrap: wrap; align-items: center; justify-content: flex-start; gap: var(--sp-8); }
.card-head.radar-toolbar .radar-table-meta { margin-left: auto; }
.toolbar-btn .toolbar-label { margin-left: var(--sp-6); font-size: var(--fs-13); font-weight: 500; }

.multiselect {
  position: relative; min-width: 130px; display: inline-block;
  padding: var(--sp-6) var(--sp-10); font-size: var(--fs-14); cursor: pointer; user-select: none;
  background: var(--surface); border: 1px solid var(--gray-200); border-radius: var(--radius);
  color: var(--gray-700);
}
.multiselect:hover { border-color: var(--gray-300); }
.multiselect .selected { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-8); max-width: 180px; }
.multiselect .selected-text { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.multiselect .dropdown-arrow { font-size: var(--fs-9); line-height: 1; color: var(--gray-500); }
.multiselect .dropdown-options {
  display: none; position: absolute; top: calc(100% + 4px); left: 0; z-index: var(--z-panel);
  min-width: 100%; width: max-content; max-width: 280px; max-height: 300px; overflow-y: auto;
  margin: 0; padding: var(--sp-4); list-style: none;
  background: var(--surface); border: 1px solid var(--gray-200); border-radius: var(--radius);
  box-shadow: var(--shadow-md);
}
.multiselect .dropdown-options li {
  padding: var(--sp-6) var(--sp-9); font-size: var(--fs-13); border-radius: 6px; white-space: nowrap;
}
.multiselect .dropdown-options li:hover { background: var(--gray-100); }
.multiselect .dropdown-options li.active { color: var(--pr-primary-color); background: var(--pr-primary-transp); font-weight: 600; }

.radar-insights { display: grid; gap: var(--sp-12); grid-template-columns: repeat(2, 1fr); margin: 0 0 var(--sp-16); }
@media (min-width: 760px) { .radar-insights { grid-template-columns: repeat(4, 1fr); } }
.radar-insights .kpi-value { font-size: var(--fs-18); }

.radar-compare-bar {
  display: flex; align-items: center; gap: var(--sp-12); flex-wrap: wrap; margin: 0 0 var(--sp-16);
  padding: var(--sp-10) var(--sp-14); background: var(--gray-50);
  border: 1px solid var(--gray-200); border-radius: var(--radius-lg);
}
.radar-compare-bar .chips { flex: 1; margin: 0; }
.radar-compare-bar .btn { margin-left: auto; }

.radar-page .card .body { padding: 0; }
.radar-table-meta { font-size: var(--fs-12); color: var(--gray-500); white-space: nowrap; }

.radar-table .authority-row { cursor: pointer; }
.radar-table .col-compare { width: 32px; text-align: center; cursor: pointer; }
.radar-table .region-tag {
  display: inline-block; padding: var(--sp-2) var(--sp-8); font-size: var(--fs-12); font-weight: 600;
  color: var(--pr-secondary-color); background: var(--pr-secondary-transp); border-radius: var(--radius-pill);
}

/* ─── Suivi des sanctions (/fines) ───────────────────────────────────────── */
.card-head.fines-toolbar { flex-wrap: wrap; align-items: center; justify-content: flex-start; gap: var(--sp-8); }
.card-head.fines-toolbar .fines-table-meta { margin-left: auto; }
.fines-table-meta { font-size: var(--fs-12); color: var(--gray-500); white-space: nowrap; }

.fines-page .card .body { padding: 0; }

.fines-table th[data-sort="amount"] { text-align: right; }
.fines-table .fines-amount {
  font-weight: 700; white-space: nowrap; text-align: right;
  font-variant-numeric: tabular-nums; font-size: var(--fs-15);
  color: var(--pr-primary-color);
}
.fines-table .fines-title { min-width: 220px; }
.fines-total { font-size: var(--fs-13); font-weight: 600; color: var(--text); }
.fines-table .fines-source { text-align: center; }
.fines-table .fines-source a { color: var(--pr-secondary-color); }

.fines-table .facet-link {
  display: inline-flex; align-items: center; cursor: pointer;
  padding: 0 var(--sp-8); line-height: 1.2;
  border: 1px dashed transparent; border-radius: var(--radius-pill);
  background: var(--surface); font-size: var(--fs-13); color: inherit;
}
.fines-table .facet-link:hover,
.fines-table .facet-link.active {
  background: var(--pr-primary-transp); border: 1px dashed var(--pr-primary-color); color: inherit;
}
.fines-table .facet-link:focus-visible { outline: 2px solid var(--pr-secondary-color); outline-offset: 1px; }

.fines-table .fines-more {
  display: inline-block; margin-top: var(--sp-3); padding: 0 var(--sp-8); border: none; background: none;
  cursor: pointer; font-size: var(--fs-12); color: var(--pr-secondary-color); text-decoration: underline;
}
.fines-table .fines-more:hover { color: var(--pr-primary-color); }

@media (max-width: 900px) {
  .fines-table-scroll { overflow-x: visible; }
  .fines-table, .fines-table tbody, .fines-table tr, .fines-table td { display: block; width: auto; }
  .fines-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .fines-table tr.fines-row {
    margin: var(--sp-10) var(--sp-12); padding: var(--sp-12) var(--sp-14);
    background: var(--surface); border: 1px solid var(--gray-200); border-radius: var(--radius);
  }
  .fines-table tr.fines-row td {
    display: grid; grid-template-columns: 38% 1fr; gap: var(--sp-8);
    align-items: baseline; border: 0; padding: var(--sp-3) 0;
  }
  .fines-table tr.fines-row td::before {
    content: attr(data-label);
    font-size: var(--fs-11); font-weight: 700; letter-spacing: .03em; text-transform: uppercase;
    color: var(--gray-500);
  }
  .fines-table tr.fines-row td.fines-amount { text-align: left; font-size: var(--fs-18); }
  .fines-table tr.fines-row td.fines-title { min-width: 0; font-weight: 600; }
  .fines-table tr.fines-row td.fines-source { text-align: left; }
}

.fines-pagination { padding: var(--sp-14) var(--sp-16); border-top: 1px solid var(--gray-200); }
.fines-pagination .pagination-container { margin-top: 0; }
.fines-pagination .display-info { font-size: var(--fs-12); color: var(--gray-500); }
.fines-pagination .pagination-nav { display: inline-flex; align-items: center; gap: var(--sp-10); }

.jp-pagination { padding: var(--sp-14) var(--sp-16); border-top: 1px solid var(--gray-200); }
.jp-pagination .pagination-container { margin-top: 0; }
.jp-pagination .display-info { font-size: var(--fs-12); color: var(--gray-500); }
.jp-pagination .pagination-nav { display: inline-flex; align-items: center; gap: var(--sp-10); }

/* ─── Fil d'Ariane & identité d'autorité ──────────────────────────────────── */
.authority-breadcrumb { display: flex; align-items: center; gap: var(--sp-8); flex-wrap: wrap; }
.breadcrumb-sep { color: var(--gray-400); }
.breadcrumb-current { font-size: var(--fs-14); font-weight: 600; color: var(--text); }

.authority-ident { margin-bottom: var(--sp-16); }
.authority-ident-name { margin: 0; font-size: var(--fs-24); font-weight: 700; }
.authority-ident-meta { display: flex; gap: var(--sp-6); flex-wrap: wrap; margin-top: var(--sp-6); }
.authority-chip {
  padding: var(--sp-2) var(--sp-10); border-radius: 999px;
  background: var(--pr-primary-transp); color: var(--pr-primary-color);
  font-size: var(--fs-12); font-weight: 600;
}

/* ─── Comparaison d'autorités (/authorities/compare) ─────────────────────── */
.cmp-picker {
  margin-bottom: var(--sp-20); padding: var(--sp-16) var(--sp-18);
  background: var(--surface); border: 1px solid var(--gray-200); border-radius: var(--radius-lg);
}
.cmp-picker-title { margin: 0; font-size: var(--fs-15); font-weight: 700; }
.cmp-picker-hint { margin: var(--sp-4) 0 var(--sp-12); font-size: var(--fs-13); color: var(--gray-600); }
.cmp-picker-selected { display: flex; flex-wrap: wrap; gap: var(--sp-8); list-style: none; margin: 0 0 var(--sp-12); padding: 0; }
.cmp-picker-selected:empty { display: none; }
.cmp-chip {
  display: inline-flex; align-items: center; gap: var(--sp-6);
  padding: var(--sp-4) var(--sp-6) var(--sp-4) var(--sp-12); border-radius: 999px;
  background: var(--pr-primary-transp); border: 1px solid var(--pr-primary-color);
  font-size: var(--fs-13); color: var(--pr-secondary-color);
}
.cmp-chip-remove { border: 0; background: none; cursor: pointer; color: inherit; font-size: var(--fs-13); line-height: 1; padding: var(--sp-2) var(--sp-4); }
.cmp-chip-remove:hover { color: var(--pr-primary-color); }
.cmp-picker-search { position: relative; display: flex; align-items: center; }
.cmp-picker-ico {
  position: absolute; left: var(--sp-12); color: var(--gray-500);
  pointer-events: none; flex-shrink: 0;
}
.cmp-picker-input { width: 100%; padding-left: var(--sp-36); }
.cmp-picker-input::-webkit-search-cancel-button { cursor: pointer; }
.cmp-picker-results { list-style: none; margin: var(--sp-8) 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--sp-6); }
.cmp-picker-option {
  display: inline-flex; align-items: baseline; gap: var(--sp-6);
  padding: var(--sp-4) var(--sp-10); border: 1px solid var(--gray-300); border-radius: 999px;
  background: var(--surface); cursor: pointer; font-size: var(--fs-13); color: var(--text);
}
.cmp-picker-option:hover { border-color: var(--pr-primary-color); color: var(--pr-primary-color); }
.cmp-picker-pays { font-size: var(--fs-11); color: var(--gray-500); }
.cmp-picker-note { font-size: var(--fs-13); color: var(--gray-500); }

.authority-compare-page .card { margin-bottom: var(--sp-16); }
.authority-compare-page .card .body { padding: 0; }
.authority-compare-page .muted { color: var(--gray-500); font-size: var(--fs-14); }
.cmp-subtitle { margin: -4px 0 var(--sp-16); }

.cmp-grid { display: grid; gap: var(--sp-12); grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); margin-bottom: var(--sp-16); }
.authority-compare-page .cmp-card { margin-bottom: 0; }
.authority-compare-page .cmp-card .body { padding: var(--sp-14) var(--sp-16); }
.cmp-card-head { display: flex; align-items: center; gap: var(--sp-8); font-size: var(--fs-15); margin-bottom: var(--sp-4); }
.cmp-dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }
.cmp-card-meta { margin-top: var(--sp-8); }
.cmp-card-link { display: inline-block; margin-top: var(--sp-10); font-size: var(--fs-13); color: var(--pr-secondary-color); text-decoration: none; }
.cmp-card-link:hover { text-decoration: underline; }

.cmp-chart-wrap { position: relative; height: 300px; padding: var(--sp-16) var(--sp-16) var(--sp-4); }
.cmp-legend-note { padding: var(--sp-4) var(--sp-16) var(--sp-14); font-size: var(--fs-12); }

.cmp-table thead th .cmp-dot { width: 9px; height: 9px; margin-right: var(--sp-6); vertical-align: baseline; border: 1px solid rgba(255,255,255,.7); }
.cmp-table tbody th[scope="row"] {
  padding: var(--sp-12); font-size: var(--fs-13); font-weight: 600; color: var(--gray-600);
  background: var(--gray-50); text-align: left; white-space: nowrap;
  border-bottom: 1px solid var(--gray-100); vertical-align: middle;
}
.cmp-table td.is-top { font-weight: 700; color: var(--pr-secondary-color); background: var(--blue-50); }
.cmp-chips { gap: var(--sp-6); }
.cmp-chips .chip { font-size: var(--fs-12); }

/* ─── Fiche autorité (/authorities/:slug) ────────────────────────────────── */
.authority .tend-chip { display: none !important; }

.authority { margin: 0 auto; }
.authority .muted { color: var(--gray-500); font-size: var(--fs-13); }
.authority .note  { margin-top: var(--sp-6); color: var(--gray-600); font-size: var(--fs-14); }

.authority .grid { display: grid; gap: var(--sp-16); grid-template-columns: repeat(3, 1fr); align-items: start; }
.authority .stack-col { display: flex; flex-direction: column; gap: var(--sp-16); min-width: 0; }
.authority .stack-col > .card { margin: 0; }

.authority .card.wide { grid-column: 1 / -1; }
.authority .card .head {
  padding: var(--sp-14) var(--sp-16); padding-bottom: var(--sp-10); border-bottom: 1px solid var(--gray-200);
  display: flex; align-items: center; justify-content: space-between; gap: var(--sp-10);
}
.authority .card .head h3,
.authority .card .card-title { margin: 0; font-size: var(--fs-17); font-weight: 700; color: var(--pr-secondary-color); }
.authority .card .head h3 { display: inline-flex; align-items: center; gap: var(--sp-7); }
.authority .card .body { padding: var(--sp-14) var(--sp-16); }

.authority .hero {
  position: relative; border-radius: 18px; overflow: hidden;
  background-size: cover; background-position: center; padding: 0;
}
.authority .hero-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(90deg, rgba(7,16,32,.88), rgba(7,16,32,.35));
}
.authority .hero-inner {
  position: relative; display: flex; gap: var(--sp-14); justify-content: space-between;
  padding: var(--sp-18); color: var(--surface); align-items: flex-start;
}
.authority .hero-left { text-align: left; }
.authority .hero-title {
  display: flex; align-items: baseline; flex-wrap: wrap; gap: var(--sp-8);
  margin: 0; font-size: var(--fs-28); font-weight: 700; line-height: 1.1;
}
.authority .hero-name { color: var(--surface); font-weight: 700; }
.authority .hero-pays {
  color: var(--surface); font-size: var(--fs-16); font-weight: 500; white-space: nowrap;
}
.authority .hero-pays::before { content: "·"; margin-right: var(--sp-8); opacity: .65; }
.authority .hero-desc { opacity: .9; margin-top: var(--sp-6); }
.authority .hero-meta { opacity: .9; margin-top: var(--sp-4); font-size: var(--fs-13); }

.authority-score {
  position: relative; display: block; text-align: left; padding: var(--sp-12) var(--sp-14); border-radius: 14px;
  color: var(--surface); min-width: 230px; border: 1px solid rgba(255,255,255,.18);
  background: rgba(255,255,255,.14);
}
.authority-score__top { font-size: var(--fs-13); opacity: .95; }
.authority-score__top b { font-size: var(--fs-16); }
.authority-score__bot { font-size: var(--fs-18); font-weight: 900; margin-top: var(--sp-4); }
.authority-score--danger { background: rgba(194,63,56,.88); border-color: rgba(194,63,56,.95); }
.authority-score--warn   { background: rgba(217,119,6,.88); border-color: rgba(217,119,6,.95); }
.authority-score--ok     { background: rgba(0,128,144,.85); border-color: rgba(0,128,144,.95); }

.authority .kpis {
  position: relative; display: grid; grid-template-columns: repeat(5, 1fr);
  gap: var(--sp-10); padding: 0 var(--sp-18) var(--sp-18); color: var(--surface);
}
.authority .kpi {
  min-width: 0; background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.12); border-radius: 14px; padding: var(--sp-10); text-align: left;
}

.authority .kpis .kpi-label { color: var(--surface); opacity: .85; font-size: var(--fs-11); text-transform: uppercase; letter-spacing: .04em; margin-top: 0; }
.authority .kpis .kpi-value { color: var(--surface); font-size: var(--fs-20); font-weight: 700; margin-top: var(--sp-8); letter-spacing: 0; line-height: 1.2; }

.authority .bar { display: flex; align-items: center; gap: var(--sp-10); }
.authority .bar .track { flex: 1; height: 10px; background: var(--gray-100); border-radius: var(--radius-pill); overflow: hidden; }
.authority .bar .fill { height: 100%; display: block; background: var(--pr-primary-color); border-radius: var(--radius-pill); }
.authority .bar span:last-child { font-size: var(--fs-13); color: var(--gray-500); }

.authority .facet-link {
  flex: 0 0 40%; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  border-radius: var(--radius-pill); cursor: pointer; text-align: left;
  border: 1px dashed transparent; font-size: var(--fs-13); padding-left: var(--sp-4);
}
.authority .facet-link b { font-weight: 600; }
.authority .facet-link:hover,
.authority .bar.active .facet-link {
  background: var(--pr-primary-transp); border: 1px dashed var(--pr-primary-color);
}

.authority .prio-list { margin: 0; padding-left: var(--sp-18); }
.authority .prio-list li { font-size: var(--fs-14); margin-bottom: var(--sp-4); }
.authority .prio-level-label { font-size: .72em; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--gray-500); margin-bottom: var(--sp-6); }
.authority .prio-level-label--eu { color: var(--pr-secondary-color); }
.authority .prio-level-sep { border-top: 1px solid var(--gray-200); margin: var(--sp-12) 0; }

.authority .recent-list { display: grid; gap: var(--sp-4); font-size: var(--fs-14); }
.authority .recent-row { display: flex; align-items: center; gap: var(--sp-10); padding: var(--sp-7) 0; border-bottom: 1px solid var(--gray-200); }
.authority .recent-dot { width: 7px; height: 7px; border-radius: var(--radius-pill); background: var(--pr-primary-color); flex: 0 0 auto; }
.authority .recent-title { flex: 1; min-width: 0; }
a.recent-title { color: inherit; text-decoration: none; }
a.recent-title:hover { color: var(--pr-primary-color); text-decoration: underline; }
.authority .recent-meta { font-size: .8em; color: var(--gray-500); white-space: nowrap; }
.authority .btn {
  display: inline-flex; align-items: center; gap: var(--sp-8); border: 1px solid var(--gray-200);
  padding: var(--sp-8) var(--sp-12); border-radius: 10px; background: var(--surface); color: var(--text); cursor: pointer;
}
.authority .btn:hover { background: var(--pr-primary-color); color: var(--surface); border-color: var(--pr-primary-color); }

.authority .radar-svg { display: block; margin: 0 auto; max-width: 100%; }
.authority .radar-grid { fill: none; stroke: var(--gray-200); stroke-width: 1; }
.authority .radar-axis { stroke: var(--gray-200); stroke-width: 1; }
.authority .radar-label { font-size: var(--fs-11); fill: var(--gray-500); }
.authority .radar-area { fill: var(--pr-primary-transp); opacity: .7; }
.authority .radar-stroke { fill: none; stroke: var(--pr-primary-color); stroke-width: 2; }
.authority .radar-point { fill: var(--pr-primary-color); }

.authority .hchart-root { font-family: inherit; }
.authority .hchart-header { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: var(--sp-8); margin-bottom: var(--sp-10); }
.authority .hchart-legend { display: flex; gap: var(--sp-14); font-size: var(--fs-12); color: var(--gray-500); align-items: center; }
.authority .hchart-legend-item { display: flex; align-items: center; gap: var(--sp-5); }
.authority .hchart-legend-bar { width: 12px; height: 12px; border-radius: 2px; background: rgba(165,180,252,.85); display: inline-block; }
.authority .hchart-legend-line { width: 22px; height: 2px; border-radius: 1px; background: var(--pr-primary-color); display: inline-block; }
.authority .hchart-toggle { display: flex; gap: var(--sp-6); }
.authority .hchart-btn {
  font-size: var(--fs-12); padding: var(--sp-3) var(--sp-12); border-radius: var(--radius-pill); border: .5px solid var(--gray-300);
  background: transparent; color: var(--gray-500); cursor: pointer; line-height: 1.6; font-family: inherit; transition: all .15s;
}
.authority .hchart-btn.active { border-color: var(--indigo-500); background: var(--indigo-100); color: var(--indigo-600); font-weight: 500; }
.authority .hchart-inner { position: relative; width: 100%; height: 260px; }
.authority .hchart-empty {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  text-align: center; color: var(--gray-500); font-size: var(--fs-13);
}
.authority .hchart-empty[hidden] { display: none; }
.authority .hchart-inner canvas[hidden] { display: none !important; }
.authority .hchart-loader { display: none; position: absolute; inset: 0; align-items: center; justify-content: center; background: rgba(255,255,255,.6); border-radius: 6px; }
@keyframes klSpin { to { transform: rotate(360deg); } }
.authority .hchart-spinner { animation: klSpin .8s linear infinite; }
.authority .hchart-axis-labels { display: flex; justify-content: space-between; font-size: var(--fs-11); margin-top: var(--sp-4); padding: 0 var(--sp-2); }
.authority .hchart-axis-left { color: var(--indigo-500); }
.authority .hchart-axis-right { color: var(--pr-primary-color); }

.authority .head-sub { font-size: .75em; color: var(--gray-500); margin-left: var(--sp-8); }

@media (max-width: 900px) {
  .authority .grid { grid-template-columns: 1fr; }
  .authority .kpis { grid-template-columns: repeat(2, 1fr); }
}

/* ─── RGPD ANNOTÉ (/rgpd, /rgpd/article-N) ───────────────────────────────── */
.rpanel--open { max-height: none; margin: 0 var(--sp-16); }
.cpanel { max-height: 0; overflow: hidden; }
.cpanel--open { max-height: none; }

/* ─── Sommaire (/rgpd) ───────────────────────────────────────────────────── */
.rgpd-index-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: var(--sp-24); margin-top: var(--sp-24); }
.rgpd-index-chapter { padding: var(--sp-18) var(--sp-20); background: var(--surface); border: 1px solid var(--gray-200); border-radius: var(--radius-lg); box-shadow: var(--shadow-xs); }
.rgpd-index-chapter h2 { margin: 0 0 var(--sp-10); font-size: var(--fs-13); font-weight: 700; letter-spacing: .03em; text-transform: uppercase; color: var(--pr-primary-color); }
.rgpd-index-list { margin: 0; padding: 0; list-style: none; }
.rgpd-index-list li + li { margin-top: var(--sp-5); }

.rgpd-index-list a { font-size: var(--fs-15); color: var(--text); }
.rgpd-index-list a:hover { color: var(--pr-primary-color); }
.rgpd-piliers {
  display: flex; align-items: center; flex-wrap: wrap; gap: var(--sp-8);
  margin-bottom: var(--sp-16);
}
.rgpd-piliers-label { font-size: var(--fs-12); font-weight: 700; letter-spacing: .03em; text-transform: uppercase; color: var(--gray-600); }
.rgpd-pilier {
  display: inline-flex; align-items: center; gap: var(--sp-4);
  padding: var(--sp-4) var(--sp-10); border: 1px solid var(--gray-300); border-radius: 999px;
  background: var(--surface); font-size: var(--fs-13); color: var(--text); text-decoration: none;
}
.rgpd-pilier:hover { border-color: var(--pr-primary-color); color: var(--pr-primary-color); }

/* ─── Fiche article : 2 colonnes (menu + contenu) ────────────────────────── */
.rgpd-page { max-width: none; margin: 0; padding: 0; }
.rgpd-layout { display: flex; align-items: stretch; }
.rgpd-sidebar {
  width: 20%;
  min-width: 280px;
  flex: 0 0 auto;
  align-self: stretch;
  position: sticky;
  top: 0;
  height: 100vh;
  overflow-y: auto;
  padding: var(--sp-24) var(--sp-20) var(--sp-32);
  border-right: 1px solid var(--gray-100);
}
.rgpd-main { flex: 1 1 auto; min-width: 0; margin-right: max(20%, 280px); padding: var(--sp-24) var(--sp-28) var(--sp-48); transition: margin-right .18s ease; }
.rgpd-main > * { max-width: 820px; margin-left: auto; margin-right: auto; }
.rgpd-main-head { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--sp-16); }
.rgpd-sidebar-toggle { display: none; flex: 0 0 auto; }
.rgpd-article-title { margin: 0 0 var(--sp-20); font-size: var(--fs-26); }

.rgpd-menu { margin-top: var(--sp-16); }
.rgpd-menu-chapter + .rgpd-menu-chapter { margin-top: var(--sp-3); }
.chap { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-8); width: 100%; padding: var(--sp-9) var(--sp-8); font-size: var(--fs-12); font-weight: 700; line-height: 1.3; text-align: left; text-transform: uppercase; letter-spacing: .02em; color: var(--gray-600); background: none; border: 0; border-radius: var(--radius); cursor: pointer; }
.chap::after { content: '›'; transform: rotate(90deg); color: var(--gray-500); transition: transform .2s; }
.chap:hover { background: var(--pr-primary-transp); color: var(--pr-primary-color); }
.chap.cactive { color: var(--pr-primary-color); }
.chap.cactive::after { transform: rotate(-90deg); }
.rgpd-menu-section { padding: var(--sp-8) var(--sp-8) var(--sp-3); font-size: var(--fs-12); font-weight: 600; color: var(--gray-500); }
.rgpd-menu-list { margin: 0; padding: 0 0 var(--sp-6); list-style: none; }
.rgpd-menu-list a.art { display: block; padding: var(--sp-5) var(--sp-10); font-size: var(--fs-14); color: var(--gray-700); text-decoration: none; border-left: 2px solid var(--gray-200); }
.rgpd-menu-list a.art:hover { color: var(--pr-primary-color); border-left-color: var(--pr-primary-color); }
.rgpd-menu-list a.art.cactive { font-weight: 600; color: var(--pr-primary-color); border-left-color: var(--pr-primary-color); background: var(--pr-primary-transp); }

/* ─── Onglets ────────────────────────────────────────────────────────────── */
.tab-head { display: flex; flex-wrap: wrap; gap: var(--sp-4); border-bottom: 1px solid var(--gray-200); }
.tablink { display: inline-flex; align-items: center; gap: var(--sp-6); padding: var(--sp-11) var(--sp-18); font-size: var(--fs-15); font-weight: 600; color: var(--gray-500); background: none; border: 0; border-bottom: 2px solid transparent; cursor: pointer; }
.tablink svg { flex-shrink: 0; }
.tablink:hover { color: var(--pr-primary-color); }
.tablink--active { color: var(--pr-primary-color); border-bottom-color: var(--pr-primary-color); }
.tab-lock { font-size: var(--fs-11); line-height: 1; opacity: .75; }
.tabcontent[hidden] { display: none; }
.boxed-content { padding: var(--sp-24) 0; }
.boxed-content h3 { margin-top: 0; }

.rgpd-main > .feedback-card { margin-left: auto; margin-right: auto; }

.rgpd-page .boxed-content ul, .rgpd-page .boxed-content ol { margin: 0 0 var(--sp-11); padding-left: var(--sp-22); list-style: none; }
.rgpd-page .boxed-content li { margin: 0 0 var(--sp-5); }

#more .recitals { margin-top: var(--sp-16); }

.rgpd-stats { margin-top: var(--sp-16); }
.rgpd-stats-status { padding: var(--sp-24) 0; }
.rgpd-stats-note { font-size: var(--fs-13); margin: var(--sp-10) 0 0; }
.rgpd-stats-cols { display: grid; gap: var(--sp-16); grid-template-columns: 1fr; margin: var(--sp-20) 0; }
@media (min-width: 720px) { .rgpd-stats-cols { grid-template-columns: 1fr 1fr; } }

.rgpd-stats-block {
  min-width: 0; background: var(--surface); border: 1px solid var(--gray-200);
  border-radius: var(--radius-card); overflow: hidden;
}
.rgpd-stats-cols + .rgpd-stats-block { margin-top: var(--sp-16); }
.rgpd-stats-block h4 {
  margin: 0; padding: var(--sp-14) var(--sp-16); border-bottom: 1px solid var(--gray-200);
  font-size: var(--fs-16); font-weight: 700; color: var(--pr-secondary-color);
  display: flex; align-items: center; gap: var(--sp-8);
}
.rgpd-stats-ico { font-size: var(--fs-17); line-height: 1; }
.rgpd-stats-block > .bars { padding: var(--sp-14) var(--sp-16); gap: var(--sp-10); }

.rgpd-stats .bar .facet-link[data-watch] {
  border-radius: var(--radius-pill); padding-left: var(--sp-4); border: 1px dashed transparent;
}
.rgpd-stats .bar .facet-link[data-watch]:hover,
.rgpd-stats .bar.active .facet-link[data-watch] {
  background: var(--pr-primary-transp); border: 1px dashed var(--pr-primary-color);
}
.rgpd-stats .bar .facet-link[data-watch]:focus-visible {
  outline: 2px solid var(--pr-secondary-color); outline-offset: 1px;
}

.rgpd-stats-body.is-loading { opacity: .5; pointer-events: none; transition: opacity .15s ease; }
.rgpd-stats-chart { position: relative; width: 100%; height: 280px; padding: var(--sp-14) var(--sp-16); box-sizing: border-box; }
.rgpd-stats-more { margin-top: var(--sp-10); font-size: var(--fs-13); padding: var(--sp-4) var(--sp-10); }
#more .recitals ~ .recitals { margin-top: 0; }
.rgpd-page .rpanel > p, .rgpd-page .rpanel > div { padding: var(--sp-3) var(--sp-8) var(--sp-16); }

.rgpd-doc-link,
.rgpd-page .rpanel > a { display: block; padding: var(--sp-2) var(--sp-8); text-decoration: none; border-radius: var(--radius); }
.rgpd-doc-link:hover,
.rgpd-page .rpanel > a:hover { background-color: var(--gray-200); color: var(--text); text-decoration: none; }
.rgpd-page .lien,
.rgpd-doc-link .lien,
.rgpd-page .rpanel a[data-rgpd-article] { display: block; padding: var(--sp-7); font-size: 0.95em; line-height: 21px; cursor: pointer; color: var(--text); text-transform: none; }
.rgpd-page .lien:hover,
.rgpd-doc-link .lien:hover,
.rgpd-page .rpanel a[data-rgpd-article]:hover { background-color: var(--gray-200); color: var(--text); }
.rgpd-page .date,
.rgpd-doc-link .date { display: block; font-size: var(--fs-13); color: var(--gray-500); }
.rgpd-page .rpanel h5 { margin: var(--sp-24) 0 var(--sp-5); font-size: var(--fs-13); text-transform: uppercase; letter-spacing: .03em; color: var(--gray-500); }
.rgpd-page .rpanel h5:first-of-type { margin-top: var(--sp-8); }
.rgpd-softlaw-more { padding: var(--sp-8); font-size: var(--fs-14); text-align: right; }

/* ─── Tableau de jurisprudence (/rgpd/:article) ──────────────────────────── */
.jp-table-card { overflow: hidden; }
.card-head.jp-toolbar { flex-wrap: wrap; align-items: center; justify-content: flex-start; gap: var(--sp-8); margin-top: var(--sp-16); margin-bottom: var(--sp-16); }
.card-head.jp-toolbar .jp-table-meta { margin-left: auto; }
.jp-table-search {
  flex: 1 1 180px; min-width: 160px; max-width: 260px;
  padding: var(--sp-6) var(--sp-10); font-size: var(--fs-14);
  border: 1px solid var(--gray-200); border-radius: var(--radius);
  background: var(--surface); color: var(--text);
}
.jp-table-search:focus { outline: none; border-color: var(--pr-primary-color); box-shadow: 0 0 0 3px var(--pr-primary-shadow-box); }
.jp-table-meta { font-size: var(--fs-12); color: var(--gray-500); white-space: nowrap; }
.jp-table tbody td:first-child { min-width: 5.5rem; }

/* ─── Actualités liées ───────────────────────────────────────────────────── */
#news .page-subtitle { margin-bottom: var(--sp-12); }

.rgpd-news { grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); grid-auto-rows: 1fr; }

.rgpd-news .hit-content { margin-bottom: 0; padding: var(--sp-12) var(--sp-12) var(--sp-10); display: flex; flex-direction: column; align-self: stretch; }
.rgpd-news .hit-content .card-header { justify-content: flex-start; }
.rgpd-news .hit-content:hover { border-left-color: var(--pr-primary-color); }
.rgpd-news .context {
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
  flex: 0 0 auto;
  max-height: calc(1.6em * 4);
}

.card-left { display: flex; align-items: center; gap: var(--sp-6); flex-wrap: wrap; }

/* ─── Sommaire mobile ────────────────────────────────────────────────────── */
.rgpd-sidebar-items { display: none; position: fixed; inset: 0; z-index: var(--z-modal); background: var(--surface); padding: var(--sp-16); overflow-y: auto; flex-direction: column; }
.rgpd-sidebar-items.rgpd-sidebar-items--show { display: flex; }
.rgpd-sidebar-itemsHeader { display: flex; align-items: center; justify-content: space-between; font-weight: 700; padding-bottom: var(--sp-12); border-bottom: 1px solid var(--gray-100); }
.rgpd-sidebar-itemsClose { border: none; background: none; font-size: var(--fs-18); cursor: pointer; }

/* ─── En-tête compact du sommaire (titre + chevron sur une ligne) ────────── */
.rgpd-side-head { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-8); margin-bottom: var(--sp-12); padding-bottom: var(--sp-8); border-bottom: 1px solid var(--gray-100); }
.rgpd-side-home { font-size: var(--fs-12); font-weight: 700; text-transform: uppercase; letter-spacing: .02em; color: var(--gray-600); text-decoration: none; }
.rgpd-side-home:hover { color: var(--pr-primary-color); }
.rgpd-sidebar-items .rgpd-side-head { display: none; }

/* ─── Sommaire replié ────────────────────────────────────────────────────── */
.rgpd-menu-chevron {
  display: block; flex: 0 0 auto; margin: 0;
  padding: var(--sp-5); border: 0; border-radius: var(--radius);
  color: var(--gray-500); background: none; cursor: pointer;
  transition: transform .18s ease;
}
.rgpd-menu-chevron:hover { color: var(--pr-primary-color); background: var(--pr-primary-transp); }

html.rgpd-menu-closed .rgpd-sidebar { width: auto; min-width: 0; padding-left: var(--sp-8); padding-right: var(--sp-8); }
html.rgpd-menu-closed .rgpd-sidebar > :not(.rgpd-side-head) { display: none; }
html.rgpd-menu-closed .rgpd-side-head { justify-content: center; margin-bottom: 0; padding-bottom: 0; border-bottom: 0; }
html.rgpd-menu-closed .rgpd-side-home { display: none; }
html.rgpd-menu-closed .rgpd-menu-chevron { transform: rotate(180deg); }
html.rgpd-menu-closed .rgpd-main { margin-right: 0; }
html.rgpd-menu-closed .rgpd-main > * { max-width: 1060px; }

/* ─── Responsive ─────────────────────────────────────────────────────────── */
@media (max-width: 1200px) {
  .rgpd-sidebar-toggle { display: inline-flex; }
  .rgpd-menu-chevron { display: none; }
  .rgpd-layout > .rgpd-sidebar { display: none; }
  .rgpd-main { margin-right: 0; padding: var(--sp-20) var(--sp-16) var(--sp-40); }
}
@media (max-width: 900px) {
  .jp-table .hidden-mobile, .rgpd-page .hidden-mobile { display: none; }
}

/* ─── Fiche actualité (/news/:slug) ──────────────────────────────────────── */
.news-detail-page .muted { color: var(--gray-500); font-size: var(--fs-13); }

.news-boxed {
  margin-bottom: var(--sp-28);
  background: var(--surface);
  border: 1px solid var(--gray-200);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
  padding: var(--sp-24);
}
.news-fiche {
  float: right; width: 38%; min-width: 280px; margin: 0 0 var(--sp-16) var(--sp-28);
  background-color: var(--pr-primary-transp);
  padding: var(--sp-14) var(--sp-18); border-radius: 7px;
}
.news-extra { clear: both; margin-top: var(--sp-20); }
.news-fiche-heading { margin: 0 0 var(--sp-8); text-align: center; font-size: var(--fs-16); }

.news-fiche-row { margin-bottom: var(--sp-5); line-height: 1.7; overflow-wrap: break-word; }
.news-fiche-row:last-child { margin-bottom: 0; }
.news-fiche-title { display: inline; font-weight: 600; margin-right: var(--sp-6); }
.news-fiche-value { display: inline; }

.news-source-link { color: var(--pr-secondary-color); font-weight: 600; }
.news-source-link:hover { text-decoration: underline; }

.news-detail-title { margin: 0 0 var(--sp-12); font-size: var(--fs-20); line-height: 1.35; font-weight: 700; }

.news-detail-page .context { line-height: 1.6; }
.news-detail-page .context p { margin: 0 0 var(--sp-11); }
.news-detail-page .context ul, .news-detail-page .context ol { margin: 0 0 var(--sp-11); padding-left: var(--sp-22); }
.news-detail-page .context li { margin: 0 0 var(--sp-5); }
.news-detail-page .context h4 { margin-top: var(--sp-16); }

.news-subtitle {
  margin: 0 0 var(--sp-10); background-color: var(--pr-primary-color);
  color: var(--surface); padding: var(--sp-5); font-size: var(--fs-16);
}

.news-facet-link, .news-facet-link:focus {
  color: var(--surface); border: 1px solid var(--pr-primary-color); border-radius: 7px;
  padding: 0 var(--sp-10); background-color: var(--pr-primary-color);
  display: inline-block; overflow-wrap: break-word; line-height: 1.6;
  margin: var(--sp-2) var(--sp-4) var(--sp-2) 0; text-decoration: none;
}
.news-facet-link:hover { color: var(--surface); opacity: .8; }

.news-message { display: block; padding: var(--sp-28) var(--sp-24); }

.news-amount { font-variant-numeric: tabular-nums; font-weight: 700; }
.news-extra-empty { margin: 0; }

@media (max-width: 900px) {
  .news-fiche { float: none; width: 75%; min-width: 0; margin: 0 auto var(--sp-14); }
}
@media (max-width: 640px) {
  .news-fiche { width: 100%; }
}

.feedback-card {
  margin: var(--sp-48) 0 var(--sp-24); padding: var(--sp-18) var(--sp-22);
  background: var(--pr-primary-transp); border: 1px solid var(--pr-primary-color); border-radius: var(--radius-lg);
}
.feedback-summary {
  display: flex; align-items: center; justify-content: space-between; gap: var(--sp-16); flex-wrap: wrap;
  cursor: pointer; list-style: none;
}
.feedback-summary::-webkit-details-marker { display: none; }
.feedback-title { font-size: var(--fs-15); font-weight: 600; color: var(--pr-primary-color); }
.feedback-text { font-size: var(--fs-13); color: var(--gray-700); margin-top: var(--sp-2); }
.feedback-cta { flex-shrink: 0; }
.feedback-cta svg { color: currentColor; }
.feedback-alert { margin-top: var(--sp-16); }
.feedback-form { margin-top: var(--sp-18); border-top: 1px solid var(--pr-primary-color); padding-top: var(--sp-18); }
.feedback-note { font-size: var(--fs-12); color: var(--gray-600); margin: var(--sp-8) 0 var(--sp-14); }

/* ─── Fiches détail SERVEUR - jurisprudence & droit souple ───────────────── */
.fiche-page .muted { color: var(--gray-500); font-size: var(--fs-14); }

.fiche-boxed {
  margin-bottom: var(--sp-28);
  background: var(--surface);
  border: 1px solid var(--gray-200);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
  padding: var(--sp-24);
}
.fiche-heading { margin: 0 0 var(--sp-6); text-align: center; font-size: var(--fs-22); line-height: 1.35; text-wrap: balance; }
.fiche-heading-sub { margin: 0 0 var(--sp-12); text-align: center; font-size: var(--fs-13); color: var(--gray-500); }
.fiche-line { height: 2px; width: 60px; margin: 0 auto var(--sp-22); background: var(--pr-primary-color); border-radius: 2px; }

.fiche {
  float: right; width: 38%; min-width: 280px; margin: 0 0 var(--sp-16) var(--sp-28);
  background-color: var(--pr-primary-transp);
  padding: var(--sp-14) var(--sp-18); border-radius: 7px;
}
.fiche-box-heading { margin: 0 0 var(--sp-10); text-align: center; font-size: var(--fs-16); }
.fiche-row { margin-bottom: var(--sp-6); line-height: 1.7; overflow-wrap: break-word; }
.fiche-row:last-child { margin-bottom: 0; }
.fiche-row-title { font-weight: 600; margin-right: var(--sp-6); }
.fiche-row-value { }
.fiche-source-link { color: var(--pr-secondary-color); font-weight: 600; }
.fiche-source-link:hover { text-decoration: underline; }

.fiche-subtitle {
  overflow: hidden;
  margin: var(--sp-22) 0 var(--sp-12); background-color: var(--pr-primary-color);
  color: var(--surface); padding: var(--sp-6) var(--sp-10); font-size: var(--fs-16);
}
.fiche-contexte { clear: none; }
.fiche-contexte .context { line-height: 1.6; min-height: 60px; }
.fiche-contexte .context p { margin: 0 0 var(--sp-11); }
.fiche-contexte .context ul, .fiche-contexte .context ol { margin: 0 0 var(--sp-11); padding-left: var(--sp-22); }
.fiche-contexte .context li { margin: 0 0 var(--sp-5); }

.fiche-apports, .fiche-references { clear: both; }
.fiche-apports--flow { clear: none; }

.fiche-page .CVlink, .fiche-page .CVlink:focus {
  color: var(--surface); border: 1px solid var(--pr-primary-color); border-radius: 7px;
  padding: 0 var(--sp-10); background-color: var(--pr-primary-color);
  display: inline-block; overflow-wrap: break-word; line-height: 1.7;
  margin: var(--sp-2) var(--sp-4) var(--sp-2) 0; text-decoration: none; font-size: var(--fs-14);
}
.fiche-page .CVlink:hover { color: var(--surface); opacity: .85; }

.fiche-apports .recitals {
  margin-top: var(--sp-8); padding: var(--sp-12) var(--sp-16); font-size: var(--fs-15); font-weight: 600;
  text-transform: none; letter-spacing: 0; color: var(--text);
  border: 1px solid var(--gray-200);
}
.fiche-apports .recitals.ractive { color: var(--pr-primary-color); border-color: var(--pr-primary-color); }
.fiche-apports .rpanel { border-left: 1px solid var(--gray-200); border-right: 1px solid var(--gray-200); }
.fiche-apports .rpanel.rpanel--open { border-bottom: 1px solid var(--gray-200); }
.fiche-apports .rpanel > div { padding: var(--sp-12) var(--sp-16) var(--sp-18); }

.fiche-subtable { list-style: none; margin: 0; padding: 0; }
.fiche-subtable > li { margin: 0 0 var(--sp-14); }
.fiche-subtable > li:last-child { margin-bottom: 0; }
.fiche-subtable--flat { border: 1px solid var(--gray-200); border-radius: var(--radius); padding: var(--sp-16) var(--sp-18); }
.fiche-empty {
  display: flex; align-items: baseline; flex-wrap: wrap; gap: var(--sp-4) var(--sp-8);
  padding: var(--sp-14) var(--sp-16); border-radius: var(--radius);
  border: 1px dashed var(--gray-300); background: var(--gray-50);
  color: var(--gray-600); font-size: var(--fs-14);
}
.fiche-empty-cta { color: var(--pr-primary-color); font-weight: 500; white-space: nowrap; }
.fiche-empty-cta:hover { text-decoration: underline; }

.fiche-apport-panel { border: 1px solid var(--gray-200); border-radius: var(--radius); padding: var(--sp-12) var(--sp-16) var(--sp-18); }
.fiche-apport-panel .fiche-subtable--flat { border: 0; padding: 0; }
.fiche-ref-none { margin: 0; }
.fiche-collection { margin: 0 0 var(--sp-8); text-align: center; }
.fiche-plaintext { white-space: pre-wrap; overflow-wrap: break-word; }
.fiche-col-title { display: block; font-weight: 700; font-size: var(--fs-12); letter-spacing: .03em; text-transform: uppercase; color: var(--gray-500); margin-bottom: var(--sp-5); }
.fiche-col-value { display: block; line-height: 1.6; }
.fiche-col-value p { margin: 0 0 var(--sp-8); }
.fiche-col-value p:last-child { margin-bottom: 0; }

.fiche-ref-heading { margin: var(--sp-20) 0 var(--sp-6); font-size: var(--fs-13); text-transform: uppercase; letter-spacing: .03em; color: var(--gray-500); }

.fiche-ref-group:not(.is-expanded) .fiche-ref-extra { display: none; }
.fiche-ref-toggle {
  margin-top: var(--sp-6); padding: 0; border: 0; background: none; cursor: pointer;
  font-size: var(--fs-13); font-weight: 600; color: var(--pr-primary-color);
}
.fiche-ref-toggle:hover { text-decoration: underline; }

@media (max-width: 900px) {
  .fiche { float: none; width: 75%; min-width: 0; margin: 0 auto var(--sp-16); }
}
@media (max-width: 640px) {
  .fiche { width: 100%; }
}

/* ─── Copier la référence (fiches de contenu) ─────────────────────────────── */
.copy-ref { display: none; align-items: center; gap: var(--sp-8); }
.copy-ref.is-ready { display: inline-flex; }
.copy-ref-btn { display: inline-flex; align-items: center; gap: var(--sp-6); }
.copy-ref-status { font-size: var(--fs-13); color: var(--pr-primary-color); min-width: 0; }

@media (max-width: 640px) {
  .copy-ref-btn[data-copy="reference"] span { display: none; }
}

/* ─── Abonnement & facturation (subscribe / billing-upgrade) ─────────────── */
#subscribe-form .form-card { max-width: none; }
.form-section-title { font-size: var(--fs-16); font-weight: 600; margin-bottom: var(--sp-16); color: var(--pr-secondary-color); }
.plan-selectable { cursor: pointer; transition: border-color .15s, box-shadow .15s; border-color: var(--gray-200); }
.plan-selectable input[type="radio"] { position: absolute; opacity: 0; width: 0; height: 0; }
.plan-selectable.selected { border-color: var(--pr-primary-color); box-shadow: 0 0 0 2px color-mix(in srgb, var(--pr-primary-color) 20%, transparent); }
.subscribe-total { font-size: var(--fs-18); font-weight: 700; color: var(--pr-secondary-color); margin: var(--sp-40) 0 var(--sp-8); }
.subscribe-total span { font-weight: 400; font-size: var(--fs-15); color: var(--gray-600); }
.addon-row { display: flex; align-items: center; gap: var(--sp-16); }
.addon-row input[type="number"] { width: 5rem; }
.addon-price { font-size: var(--fs-14); color: var(--gray-600); white-space: nowrap; }
.invoice-table { font-size: var(--fs-15); }
.invoice-table tbody td { padding: var(--sp-8); }

/* ─── Admin (stats / audit) ──────────────────────────────────────────────── */
.admin-page { padding-top: var(--sp-32); padding-bottom: var(--sp-48); }
.admin-page h1 { font-size: var(--fs-22); }
.admin-page h2 { font-size: var(--fs-16); }
.page-header--espace { margin-bottom: var(--sp-32); }
.admin-audit-count { margin-bottom: var(--sp-12); }
.admin-stats-section { margin-bottom: var(--sp-32); }
.admin-audit-filters { display: flex; flex-wrap: wrap; gap: var(--sp-12); align-items: end; margin-bottom: var(--sp-24); }
.admin-audit-filters label { display: flex; flex-direction: column; gap: var(--sp-4); }
.admin-audit-table tbody td { padding: var(--sp-8); border-bottom-color: var(--gray-200); }
.admin-audit-table .col-nowrap { white-space: nowrap; }
.admin-audit-table .col-mono { font-family: monospace; }
.admin-audit-table .col-sm { font-size: var(--fs-12); }
.admin-audit-table summary { cursor: pointer; display: block; max-width: 280px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.admin-audit-table pre { white-space: pre-wrap; word-break: break-word; margin: var(--sp-8) 0 0; background: var(--gray-50); padding: var(--sp-8); border-radius: 4px; }
.admin-pagination { display: flex; gap: var(--sp-8); align-items: center; justify-content: center; margin-top: var(--sp-24); }

/* ─── Onboarding (flux post-inscription : persona + ciblage de la veille) ─── */
.onboarding-page { max-width: 720px; margin: var(--sp-32) auto; }
.onboarding-card {
  background: var(--surface); border: 1px solid var(--gray-200); border-radius: var(--radius-card);
  box-shadow: var(--shadow-sm); padding: var(--sp-28) var(--sp-28) var(--sp-20);
}
.onboarding-head h1 { margin: 0 0 var(--sp-6); font-size: var(--fs-22); color: var(--pr-secondary-color); }
.onboarding-head .page-subtitle { margin: 0; color: var(--gray-600); }

.onboarding-progress { margin: var(--sp-20) 0 var(--sp-24); }
.onboarding-step-label { display: block; font-size: var(--fs-13); color: var(--gray-500); margin-bottom: var(--sp-6); }
.onboarding-bar { height: 8px; background: var(--gray-200); border-radius: var(--radius-pill); overflow: hidden; }
.onboarding-bar-fill { height: 100%; width: 50%; background: var(--pr-primary-color); border-radius: var(--radius-pill); transition: width .25s ease; }

.onboarding-step { border: 0; padding: 0; margin: 0; min-inline-size: auto; }
.onboarding-step > legend,
.onboarding-group > legend { font-weight: 600; color: var(--heading); margin-bottom: var(--sp-12); padding: 0; font-size: var(--fs-16); }
.onboarding-group { margin-bottom: var(--sp-24); }

.onboarding-options { display: flex; flex-wrap: wrap; gap: var(--sp-8); }
.onboarding-options--single { flex-direction: column; }
.onboarding-option {
  display: inline-flex; align-items: center; gap: var(--sp-8);
  padding: var(--sp-8) var(--sp-12); border: 1px solid var(--gray-200); border-radius: var(--radius);
  cursor: pointer; background: var(--surface); transition: border-color .15s, background .15s;
  font-size: var(--fs-15); color: var(--gray-700);
}
.onboarding-option:hover { border-color: var(--gray-300); }
.onboarding-option:has(input:checked) { border-color: var(--pr-primary-color); background: var(--pr-primary-transp); color: var(--pr-primary-color); font-weight: 500; }

.onboarding-option input[type="radio"] { accent-color: var(--pr-primary-color); }
.onboarding-option input[type="checkbox"] { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; pointer-events: none; }
.onboarding-option:has(input:focus-visible) { outline: 2px solid var(--pr-primary-color); outline-offset: 2px; }

.onboarding-hint { margin: var(--sp-8) 0 0; font-size: var(--fs-13); color: var(--gray-500); }
.onboarding-group { border: 0; padding: 0; min-inline-size: auto; }
.onboarding-filtre { max-width: 320px; margin-bottom: var(--sp-12); }
.onboarding-vide { margin: var(--sp-8) 0 0; font-size: var(--fs-13); color: var(--gray-500); font-style: italic; }
.onboarding-rgpd { margin: var(--sp-24) 0 0; padding: var(--sp-14) var(--sp-16); background: var(--gray-50); border: 1px solid var(--gray-200); border-radius: var(--radius); font-size: var(--fs-13); color: var(--gray-600); line-height: 1.5; }
.onboarding-rgpd a { color: var(--pr-primary-color); }

.onboarding-actions { display: flex; gap: var(--sp-12); justify-content: flex-end; margin-top: var(--sp-28); }
.onboarding-skip { text-align: center; margin-top: var(--sp-16); }
.onboarding-skip .btn-link { background: none; border: 0; cursor: pointer; color: var(--gray-500); font: inherit; text-decoration: underline; }
.onboarding-skip .btn-link:hover { color: var(--gray-700); }

/* ─── Modal « Sauvegarder cette recherche » (/search) ────────────────────── */
/* ─── Modale (composant unique) ────────────────────────────────────────────── */
.modal { margin: auto; padding: 0; border: 0; background: transparent; max-width: 100vw; max-height: 100vh; }
.modal::backdrop { background: rgba(16,24,40,.45); }
.modal-card {
  position: relative; width: 100%; max-width: 460px; background: var(--surface);
  border: 1px solid var(--gray-200); border-radius: var(--radius-card);
  box-shadow: var(--shadow-md); padding: var(--sp-24); max-height: 90vh; overflow-y: auto;
}
.modal-title { margin: 0 0 var(--sp-20); font-size: var(--fs-18); color: var(--pr-secondary-color); }
.modal-body { margin: 0 0 var(--sp-20); font-size: var(--fs-15); color: var(--gray-700); }
.modal-actions { display: flex; gap: var(--sp-12); justify-content: center; margin-top: var(--sp-24); }
.modal--confirm .modal-card { max-width: 420px; }
.modal-form .save-field { border: 0; padding: 0; margin: 0 0 var(--sp-20); min-inline-size: auto; }
.modal-form .save-field > label,
.modal-form .save-field > legend { display: block; font-weight: 600; color: var(--heading); margin-bottom: var(--sp-6); padding: 0; font-size: var(--fs-15); }
.save-req { font-weight: 400; font-style: normal; color: var(--pr-primary-color); font-size: var(--fs-13); margin-left: var(--sp-4); }
.modal-form input[type="text"],
.modal-form select {
  width: 100%; padding: var(--sp-9) var(--sp-11); border: 1px solid var(--gray-300);
  border-radius: var(--radius); font: inherit; color: var(--gray-800); background: var(--surface);
}
.modal-form input[type="text"]:focus,
.modal-form select:focus { outline: none; border-color: var(--pr-primary-color); box-shadow: 0 0 0 3px var(--pr-primary-transp); }
.save-counter { display: block; margin-top: var(--sp-6); font-size: var(--fs-12); color: var(--gray-500); }
.save-radio { display: inline-flex; align-items: center; gap: var(--sp-6); margin-right: var(--sp-20); font-size: var(--fs-15); color: var(--gray-700); cursor: pointer; }
.save-radio input { accent-color: var(--pr-primary-color); }
.save-hint { display: block; margin-top: var(--sp-8); font-size: var(--fs-13); color: var(--gray-500); }

/* ─── Tunnel payant : abonnement, facturation, compte ──────────────────────── */
.container--etroit { max-width: 760px; }

.billing-page .form-card,
.subscribe-page .form-card { margin-bottom: var(--sp-24); }

.form-card--etat { gap: var(--sp-12); }
.billing-etat { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--sp-4) var(--sp-10); margin: 0; font-size: var(--fs-14); color: var(--gray-600); }
.billing-etat strong { font-size: var(--fs-16); font-weight: 600; color: var(--text); }
.billing-etat > * + *::before { content: "\00B7"; margin-right: var(--sp-10); color: var(--gray-300); }
.billing-actions { flex-wrap: wrap; }

/* ── Facturation en petite largeur ────────────────────────────────────────────── */
@media (max-width: 640px) {
  .billing-page .form-card { padding: var(--sp-20) var(--sp-16); }

  .billing-page .form-actions { flex-direction: column; align-items: stretch; }
  .billing-page .form-actions .btn { width: 100%; min-height: 44px; }

  .invoice-table thead {
    position: absolute; width: 1px; height: 1px; overflow: hidden;
    clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap;
  }
  .invoice-table, .invoice-table tbody, .invoice-table tr, .invoice-table td { display: block; width: 100%; }
  .invoice-table tr[hidden] { display: none; }
  .invoice-table tr {
    border: 1px solid var(--gray-200); border-radius: var(--radius);
    padding: var(--sp-12); margin-bottom: var(--sp-12);
  }
  .invoice-table tbody tr:hover { background: transparent; }
  .invoice-table tbody td {
    display: flex; justify-content: space-between; align-items: baseline;
    gap: var(--sp-16); padding: var(--sp-4) 0; border-bottom: 0;
  }
  .invoice-table tbody td::before {
    content: attr(data-label); color: var(--gray-500); font-weight: 500; flex-shrink: 0;
  }
  .invoice-table tbody td:last-child { justify-content: flex-start; padding-top: var(--sp-8); }
  .invoice-table tbody td:last-child::before { content: none; }
  #invoices-show-more { width: 100%; min-height: 44px; }
  .form-row-head { flex-wrap: wrap; }
}

.form-section-title--serre { margin-bottom: var(--sp-8); }
.form-group--espace { margin-bottom: var(--sp-24); }
.form-group--suite { margin-top: var(--sp-12); }
.btn-espace { margin-top: var(--sp-8); }
.form-lien-secondaire { margin: var(--sp-24) 0 0; }
.form-lien-secondaire a { font-size: var(--fs-14); color: var(--gray-500); }
.billing-period-wrap { text-align: center; }
.subscribe-total--nu { margin: 0; }
.account-hint--avant { margin-top: 0; margin-bottom: var(--sp-12); }
.form-etroit--espace { margin-top: var(--sp-16); }

.form-note { font-size: var(--fs-14); color: var(--gray-500); margin: 0; }
.form-note--fonce { color: var(--gray-600); }
.form-note--espacee { margin-bottom: var(--sp-16); }
.form-note--attention {
  margin: var(--sp-16) 0; padding: var(--sp-10) var(--sp-12);
  color: var(--amber-text); background: var(--amber-bg);
  border: 1px solid var(--amber-border); border-radius: var(--radius);
}

.form-row-head { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-16); margin-bottom: var(--sp-16); }
.form-row-head .form-section-title { margin: 0; }
.form-select--court { max-width: 8rem; }

.actions-row { display: flex; gap: var(--sp-12); align-items: center; flex-wrap: wrap; }

.form-nu { margin: 0; }

.form-etroit { max-width: 420px; }

.plans--pleine { max-width: 100%; margin: 0 0 var(--sp-32); }

input[readonly].form-fige { background: var(--gray-50); color: var(--gray-500); }

.account-section--fin { margin-top: var(--sp-32); }
.account-subtitle { margin-top: var(--sp-20); font-size: var(--fs-15); }
.account-section--danger { border-color: var(--red-200); }
.account-section--danger .section-title { color: var(--pr-primary-color); }

/* ─── Onboarding : marqueur facultatif + aperçu des veilles ──────────────── */
.onboarding-optional { font-weight: 400; font-style: normal; font-size: var(--fs-13); color: var(--gray-500); margin-left: var(--sp-4); }
.onboarding-preview { margin: var(--sp-24) 0 0; padding: var(--sp-14) var(--sp-16); background: var(--pr-tertiary-transp); border: 1px solid var(--pr-tertiary-color); border-radius: var(--radius); }
.onboarding-preview-title { display: block; font-weight: 600; font-size: var(--fs-14); color: var(--pr-secondary-color); margin-bottom: var(--sp-6); }
.onboarding-preview-list { margin: 0; padding-left: var(--sp-18); }
.onboarding-preview-list li { font-size: var(--fs-14); color: var(--gray-700); margin: var(--sp-2) 0; }

.fav-form { display: inline-flex; }
.fav-btn {
  display: inline-flex; align-items: center; gap: var(--sp-6);
  padding: var(--sp-6) var(--sp-11); border: 1px solid var(--gray-300); border-radius: var(--radius-pill);
  background: var(--surface); color: var(--gray-600); font-size: var(--fs-14); line-height: 1; cursor: pointer;
}
.fav-btn:hover { background: var(--gray-50); color: var(--text); }
.fav-btn.is-on { border-color: var(--pr-primary-color, var(--gray-400)); color: var(--pr-primary-color, var(--text)); }
.fav-btn[disabled] { opacity: .6; cursor: default; }

.hit-wrap { position: relative; }
.fav-btn--hit {
  position: absolute; top: .6rem; right: .6rem; z-index: var(--z-raised);
  padding: var(--sp-5) var(--sp-8); font-size: var(--fs-16);
}
.applink > .fav-btn--hit { position: absolute; top: .6rem; right: .6rem; }
.applink { position: relative; }

.hit-wrap, .applink { transition: transform .2s; }
.hit-wrap:hover, .applink:hover { transform: scale(1.005); }

.hit-wrap > .applink:hover { transform: none; }

.hit-wrap .hit-content:hover,
.applink .hit-content:hover { transform: none; }

.fav-section { margin-top: var(--sp-32); }
.fav-section > h2 { font-size: var(--fs-17); margin-bottom: var(--sp-12); }
.fav-card { padding: var(--sp-16); margin-bottom: var(--sp-12); }
.fav-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--sp-16); }
.fav-card-title { font-weight: 600; }
.fav-note-form { margin-top: var(--sp-12); }
.fav-note-form textarea { width: 100%; font: inherit; padding: var(--sp-8) var(--sp-10); border: 1px solid var(--gray-300); border-radius: var(--radius); }
.fav-card-actions { margin-top: var(--sp-8); }
.fav-delete-form { margin-top: var(--sp-8); }

.fav-picker-wrap { position: relative; display: inline-block; }
.fav-picker-wrap > summary { list-style: none; cursor: pointer; }
.fav-picker-wrap > summary::-webkit-details-marker { display: none; }

.fav-picker {
  position: absolute; z-index: var(--z-panel); top: calc(100% + .35rem); right: 0; left: auto;
  min-width: 230px; max-width: min(320px, calc(100vw - 2rem));
  padding: var(--sp-12); background: var(--surface); border: 1px solid var(--gray-200);
  border-radius: var(--radius); box-shadow: var(--shadow-sm); text-align: left;
}

.fav-picker--ancre { box-shadow: var(--shadow-md); }
.fav-picker__title { margin: 0 0 var(--sp-8); font-size: var(--fs-13); font-weight: 600; color: var(--gray-600); }
.fav-picker__list { list-style: none; margin: 0 0 var(--sp-10); padding: 0; max-height: 220px; overflow-y: auto; }
.fav-picker__list li { margin: var(--sp-4) 0; }
.fav-picker__list label { display: flex; align-items: center; gap: var(--sp-7); font-size: var(--fs-14); cursor: pointer; }
.fav-picker__actions { display: flex; align-items: center; gap: var(--sp-10); }
.fav-picker__manage { font-size: var(--fs-13); }

/* ─── Dossiers (workspaces) ──────────────────────────────────────────────── */
.ws-desc { font-size: var(--fs-14); color: var(--gray-600); margin-top: var(--sp-8); max-width: 60ch; }

.ws-new, .ws-settings { position: relative; }
.ws-new > summary, .ws-settings > summary { list-style: none; cursor: pointer; }
.ws-new > summary::-webkit-details-marker,
.ws-settings > summary::-webkit-details-marker { display: none; }
.ws-new__form, .ws-settings__panel {
  position: absolute; z-index: var(--z-panel); top: calc(100% + .4rem); right: 0; width: 320px;
  padding: var(--sp-16); background: var(--surface); border: 1px solid var(--gray-200);
  border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); text-align: left;
}
.ws-settings__panel { width: 340px; max-height: 70vh; overflow-y: auto; }
.ws-new__form label, .ws-form label {
  display: block; font-size: var(--fs-13); font-weight: 600; margin: var(--sp-10) 0 var(--sp-4); color: var(--gray-700);
}
.ws-new__form label:first-child, .ws-form label:first-child { margin-top: 0; }
.ws-new__form input, .ws-new__form textarea,
.ws-form input[type="text"], .ws-form textarea, .ws-form select {
  width: 100%; font: inherit; font-size: var(--fs-14); padding: var(--sp-7) var(--sp-10);
  border: 1px solid var(--gray-300); border-radius: var(--radius);
}
.ws-new__form button { margin-top: var(--sp-12); }
.ws-form + .ws-form { margin-top: var(--sp-16); padding-top: var(--sp-16); border-top: 1px solid var(--gray-200); }
.ws-form button { margin-top: var(--sp-10); }
.ws-form--danger { text-align: right; }
.ws-hint { font-size: var(--fs-12); color: var(--gray-500); margin: var(--sp-6) 0 0; }

.ws-items {
  list-style: none; margin: 0; padding: 0;
  background: var(--surface); border: 1px solid var(--gray-200); border-radius: var(--radius-card);
  overflow: hidden;
}
.ws-item { padding: var(--sp-14) var(--sp-18); }
.ws-item + .ws-item { border-top: 1px solid var(--gray-200); }
.ws-item__head { display: flex; align-items: baseline; gap: var(--sp-12); }

.ws-item--pinned { border-left: 3px solid var(--pr-secondary-color); }
.ws-item__pinform { flex-shrink: 0; line-height: 0; }
.ws-item__pin {
  display: inline-flex; padding: var(--sp-3); border: 0; background: none; cursor: pointer;
  color: var(--gray-500); border-radius: var(--radius); transition: color .15s, background .15s;
}
.ws-item__pin:hover { color: var(--pr-secondary-color); background: var(--pr-tertiary-transp); }
.ws-item__pin.is-pinned { color: var(--pr-secondary-color); }

.ws-item__pinbadge {
  flex-shrink: 0; background: var(--pr-tertiary-transp); color: var(--pr-secondary-color);
}
.ws-item__title { font-size: var(--fs-15); font-weight: 600; min-width: 0; flex: 1; }

.ws-item__title a { color: var(--pr-secondary-color); }
.ws-item__title a:hover { text-decoration: underline; }
.ws-item__type { flex-shrink: 0; }
.ws-item__meta { font-size: var(--fs-12); color: var(--gray-500); margin: var(--sp-4) 0 0; }
.ws-item__note {
  margin: var(--sp-8) 0 0; padding: var(--sp-8) var(--sp-11); font-size: var(--fs-14); color: var(--gray-700);
  background: var(--gray-50); border-left: 2px solid var(--gray-300); border-radius: 0 var(--radius) var(--radius) 0;

  overflow-wrap: anywhere;
}

.ws-item__edit { margin-top: var(--sp-8); }
.ws-item__edit > summary {
  list-style: none; cursor: pointer;
  display: inline-flex; align-items: center; gap: var(--sp-6);
  width: fit-content; margin-left: auto; padding: var(--sp-4) var(--sp-10);
  border: 1px solid var(--gray-200); border-radius: var(--radius-pill);
  background: var(--surface); font-size: var(--fs-12); color: var(--gray-600);
  transition: border-color .15s, color .15s;
}
.ws-item__edit > summary::-webkit-details-marker { display: none; }
.ws-item__edit > summary:hover { border-color: var(--gray-300); color: var(--pr-secondary-color); }
.ws-item__edit[open] > summary {
  border-color: var(--pr-secondary-color); color: var(--pr-secondary-color);
}

.ws-item__panel {
  margin-top: var(--sp-11); padding-top: var(--sp-11); border-top: 1px solid var(--gray-200);
}
.ws-item__label {
  display: block; font-size: var(--fs-12); font-weight: 600; color: var(--gray-600); margin-bottom: var(--sp-5);
}
.ws-item__edit textarea {
  width: 100%; font: inherit; font-size: var(--fs-14); padding: var(--sp-8) var(--sp-10);
  border: 1px solid var(--gray-300); border-radius: var(--radius);
}

.ws-item__actions { display: flex; align-items: center; gap: var(--sp-12); margin-top: var(--sp-10); }

.ws-item__removebtn {
  margin-left: auto; display: inline-flex; padding: var(--sp-5); border: 0; background: none;
  cursor: pointer; color: var(--gray-500); border-radius: var(--radius);
  transition: color .15s, background .15s;
}
.ws-item__removebtn:hover { color: var(--pr-primary-color); background: var(--pr-primary-transp); }

@media (max-width: 640px) {
  .ws-new__form, .ws-settings__panel { position: static; width: auto; margin-top: var(--sp-10); }
  .ws-picker__panel { width: min(300px, calc(100vw - 3rem)); }
}

.ws-filters { display: flex; flex-wrap: wrap; gap: var(--sp-6); margin-bottom: var(--sp-20); }
.ws-filter {
  display: inline-flex; align-items: center; gap: var(--sp-6);
  padding: var(--sp-6) var(--sp-11); border: 1px solid var(--gray-200); border-radius: var(--radius-pill);
  background: var(--surface); color: var(--gray-600); font-size: var(--fs-13); text-decoration: none;
  transition: border-color .15s, color .15s, background .15s;
}
.ws-filter:hover { border-color: var(--gray-300); color: var(--text); text-decoration: none; }
.ws-filter.is-active {
  background: var(--pr-secondary-color); border-color: var(--pr-secondary-color); color: var(--surface);
}
.ws-filter__n { font-size: var(--fs-12); opacity: .7; font-variant-numeric: tabular-nums; }

.ws-page .page-header { padding-bottom: var(--sp-6); }

.ws-page--manage .page-header { padding-bottom: var(--sp-24); }
.ws-panel { margin-top: var(--sp-8); }
.ws-panel__head {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: var(--sp-16); flex-wrap: wrap; margin-bottom: var(--sp-32);
}
.ws-panel__ident { min-width: 0; }
.ws-panel__title { font-size: var(--fs-17); font-weight: 700; color: var(--pr-secondary-color); }

.ws-picker { position: relative; }
.ws-picker > summary { list-style: none; cursor: pointer; }
.ws-picker > summary::-webkit-details-marker { display: none; }
.ws-picker__btn {
  display: inline-flex; align-items: center; gap: var(--sp-7);
  padding: var(--sp-3) var(--sp-7); margin-left: -.45rem; border-radius: var(--radius);
  color: var(--pr-secondary-color);
}
.ws-picker__btn:hover { background: var(--pr-tertiary-transp); }
.ws-picker[open] > summary .nav-caret { transform: rotate(180deg); }
.ws-picker__icon { display: inline-flex; flex-shrink: 0; }

.ws-picker__name { display: inline; margin: 0; }

.ws-picker__panel {
  position: absolute; z-index: var(--z-panel); top: calc(100% + .4rem); left: 0; width: 300px;
  padding: var(--sp-10); background: var(--surface); border: 1px solid var(--gray-200);
  border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); text-align: left;
}
.ws-picker__filter {
  width: 100%; font: inherit; font-size: var(--fs-14); padding: var(--sp-6) var(--sp-9); margin-bottom: var(--sp-6);
  border: 1px solid var(--gray-300); border-radius: var(--radius);
}

.ws-picker__list { max-height: 46vh; overflow-y: auto; }
.ws-picker__list .filter-title { margin: var(--sp-8) 0 var(--sp-4); }
.ws-picker__list .filter-title:first-child { margin-top: var(--sp-2); }
.ws-picker__opt {
  display: flex; align-items: center; gap: var(--sp-8);
  padding: var(--sp-6) var(--sp-8); border-radius: var(--radius);
  color: var(--text); font-size: var(--fs-14); text-decoration: none;
}
.ws-picker__opt:hover { background: var(--gray-50); color: var(--text); text-decoration: none; }
.ws-picker__opt.is-active { background: var(--pr-tertiary-transp); color: var(--pr-secondary-color); font-weight: 600; }

.ws-picker__opt-ident { flex: 1; min-width: 0; }
.ws-picker__opt-name { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ws-picker__opt-who {
  display: block; font-size: var(--fs-12); font-weight: 400; color: var(--gray-500);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.ws-picker__opt-share { color: var(--pr-secondary-color); font-size: var(--fs-14); line-height: 1; }
.ws-picker__opt-n { font-size: var(--fs-12); color: var(--gray-500); font-variant-numeric: tabular-nums; }
.ws-picker__empty { font-size: var(--fs-13); color: var(--gray-500); margin: var(--sp-4) var(--sp-8); }
.ws-panel__meta { font-size: var(--fs-13); color: var(--gray-500); margin-top: var(--sp-2); }
.ws-panel .page-header-actions { flex-shrink: 0; }

.toolbar-btn--label { gap: var(--sp-5); }

.ws-sort { position: relative; }
.ws-sort > summary { list-style: none; }
.ws-sort > summary::-webkit-details-marker { display: none; }
.ws-sort__panel { width: 220px; padding: var(--sp-8); }
.ws-sort__opt {
  display: block; padding: var(--sp-7) var(--sp-10); border-radius: var(--radius);
  font-size: var(--fs-14); color: var(--gray-600); text-decoration: none;
}
.ws-sort__opt:hover { background: var(--gray-100); color: var(--text); text-decoration: none; }
.ws-sort__opt.is-active { background: var(--pr-primary-transp); color: var(--pr-primary-color); font-weight: 600; }

#wsView.view-toggle { display: inline-flex; gap: var(--sp-2); padding: var(--sp-2); border: 0; background: var(--gray-100); border-radius: var(--radius); }
#wsView .view-btn { flex: 0 0 auto; padding: var(--sp-5) var(--sp-7); color: var(--gray-500); }
html:not(.view-grid) #wsView .view-btn[data-view="list"],
html.view-grid       #wsView .view-btn[data-view="grid"] {
  background: var(--surface); color: var(--pr-secondary-color); box-shadow: var(--shadow-sm);
}
html.view-grid .ws-items {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: var(--sp-12);
  background: none; border: 0; border-radius: 0; overflow: visible;

  align-items: start;
}
html.view-grid .ws-item {
  background: var(--surface); border: 1px solid var(--gray-200); border-radius: var(--radius-card);
}
html.view-grid .ws-item + .ws-item { border-top: 1px solid var(--gray-200); }
html.view-grid .ws-item__head { flex-direction: column; align-items: flex-start; gap: var(--sp-6); }

html.view-grid .ws-item__note {
  display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden;
}

@media (max-width: 640px) {
  .ws-panel__head { flex-direction: column; }
  .ws-sort__panel { position: static; width: auto; margin-top: var(--sp-10); }
}
.fav-picker__error {
  margin: 0 0 var(--sp-8); padding: var(--sp-6) var(--sp-9); font-size: var(--fs-12);
  color: var(--pr-primary-color); background: var(--pr-primary-transp);
  border: 1px solid var(--red-200); border-radius: var(--radius);
}

.content-detail .fav-picker { left: 0; right: auto; }

.fav-btn--icone { padding: var(--sp-5) var(--sp-8); font-size: var(--fs-17); line-height: 1; }
.applink--inerte { cursor: default; }

/* ─── Support authentifié (/support) ───────────────────────────────────────── */
.support-page .support-form { max-width: 620px; }
.support-form select, .support-form textarea {
  width: 100%; font: inherit; font-size: var(--fs-14); padding: var(--sp-8) var(--sp-10);
  border: 1px solid var(--gray-300); border-radius: var(--radius);
}
.support-form .form-group { margin-bottom: var(--sp-16); }
.support-form label { display: block; font-size: var(--fs-13); font-weight: 600; color: var(--gray-700); margin-bottom: var(--sp-5); }

.support-from { font-size: var(--fs-13); color: var(--gray-500); margin: 0 0 var(--sp-16); }
.support-form input[type="url"] {
  width: 100%; font: inherit; font-size: var(--fs-14); padding: var(--sp-8) var(--sp-10);
  border: 1px solid var(--gray-300); border-radius: var(--radius);
}
.support-note { font-size: var(--fs-12); color: var(--gray-500); margin: var(--sp-5) 0 0; }
.support-form:has(#support-subject option[value="bug"]:checked) .support-if[data-support-if="bug"],
.support-form:has(#support-subject option[value="rgpd"]:checked) .support-if[data-support-if="rgpd"] { display: block; }
.support-hint {
  max-width: 620px; margin: var(--sp-24) 0 0; padding: var(--sp-12) var(--sp-14);
  font-size: var(--fs-13); color: var(--gray-600);
  background: var(--gray-50); border-left: 2px solid var(--gray-300);
  border-radius: 0 var(--radius) var(--radius) 0;
}

/* ─── États de chargement / vide / erreur (squelettes) ───────────────────── */
.skel {
  display: inline-block; width: 100%; height: .72em; vertical-align: middle;
  background: var(--gray-200); border-radius: var(--radius);
  position: relative; overflow: hidden;
}
.skel::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.65), transparent);
  transform: translateX(-100%);
  animation: skel-shimmer 1.4s ease-in-out infinite;
}
@keyframes skel-shimmer { 100% { transform: translateX(100%); } }
@media (prefers-reduced-motion: reduce) {
  .skel::after { animation: none; }
}
.skel-line { display: block; position: relative; margin: 0; }
.skel-line::before { content: "\200B"; }
.skel-line > .skel { position: absolute; left: 0; top: 50%; transform: translateY(-50%); }
.skel--pill { border-radius: var(--radius-pill); }

/* ─── Bloc d'état (vide / erreur) ───────────────────────────────────────── */
.state-block {
  display: flex; flex-direction: column; align-items: center; gap: var(--sp-8);
  text-align: center; padding: var(--sp-40) var(--sp-24);
  color: var(--gray-600);
}
.state-block__icon { color: var(--gray-400); margin-bottom: var(--sp-4); }
.state-block__title { font-size: var(--fs-16); font-weight: 600; color: var(--gray-800); }
.state-block__hint { font-size: var(--fs-14); color: var(--gray-500); max-width: 46ch; }
.state-block__actions { display: flex; gap: var(--sp-8); flex-wrap: wrap; justify-content: center; margin-top: var(--sp-8); }
.state-block--error .state-block__icon { color: var(--pr-primary-color); }
.state-block--encadre {
  padding: var(--sp-56) var(--sp-32); gap: var(--sp-16);
  background: var(--surface); border: 1px dashed var(--gray-300); border-radius: var(--radius-lg);
}
td > .state-block { padding: var(--sp-32) var(--sp-16); }

.cmswt-MainPanel.is-searching .ais-Hits-list,
.cmswt-MainPanel.is-searching .ais-Hits-empty { opacity: .45; transition: opacity .15s ease; }

/* ─── Réassurance de /subscribe ──────────────────────────────────────────── */
.reassure { margin: 0 0 var(--sp-24); }
.reassure-title { font-size: var(--fs-13); font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: var(--gray-500); margin: 0 0 var(--sp-10); }
.reassure-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--sp-8); }
.reassure-list li { position: relative; padding-left: var(--sp-24); font-size: var(--fs-14); color: var(--gray-600); }
.reassure-list li::before {
  content: ""; position: absolute; left: var(--sp-4); top: .45em;
  width: 9px; height: 5px; border-left: 2px solid var(--green-600); border-bottom: 2px solid var(--green-600);
  transform: rotate(-45deg);
}

/* ─── Retour de paiement (/billing/success) ──────────────────────────────── */
.success-page { max-width: 520px; text-align: center; padding-top: var(--sp-48); }
.success-icon { margin-bottom: var(--sp-20); }
.success-title { font-size: var(--fs-24); font-weight: 700; color: var(--pr-secondary-color); margin-bottom: var(--sp-12); }
.success-body { color: var(--gray-600); margin-bottom: var(--sp-24); }
.success-recap {
  text-align: left; background: var(--surface); border: 1px solid var(--gray-200);
  border-radius: var(--radius-lg); padding: var(--sp-16) var(--sp-18); margin-bottom: var(--sp-24);
}
.success-recap-title { font-size: var(--fs-13); font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: var(--gray-500); margin: 0 0 var(--sp-12); }
.success-recap-list { margin: 0; display: flex; flex-direction: column; gap: var(--sp-8); }
.success-recap-list > div { display: flex; justify-content: space-between; gap: var(--sp-16); font-size: var(--fs-14); }
.success-recap-list dt { color: var(--gray-600); margin: 0; }
.success-recap-list dd { margin: 0; font-weight: 600; color: var(--gray-800); }
.success-actions { display: flex; gap: var(--sp-10); justify-content: center; flex-wrap: wrap; margin-bottom: var(--sp-16); }
.success-redirect { font-size: var(--fs-14); color: var(--gray-500); }

/* ─── Alerte de page (partial common/partials/alert.ejs) ─────────────────── */
.alert { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--sp-8); }
.alert-texte { flex: 1 1 auto; min-width: 0; }
.alert--centre { max-width: 520px; margin-left: auto; margin-right: auto; }