/* ═══════════════════════════════════════════════
   DIRECTION B · BIBLIOTHÈQUE MODERNE
   Ivoire + encre marine. Lora italique + Inter.
   Ambiance outil pro littéraire (Linear × Notion).
   ═══════════════════════════════════════════════ */


/* ── Page background ─────────────────────────── */
body[data-layout="bibliotheque"] {
  background: var(--body-bg);
  color: var(--text-main);
  font-family: var(--font-sans);
  /*font-size: 13.var(--space-sm-5);*/
}

/* ── Vue projet (overview) : sidebar masquée, layout 3 colonnes ── */
body[data-layout="bibliotheque"]:has(.tm-root) .pro-sidebar {
  display: none !important;
}

body[data-layout="bibliotheque"]:has(.tm-root) main.pro-content {
  margin-left: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  padding-bottom: 0 !important;
}

body[data-layout="bibliotheque"]:has(.tm-root) .pro-content-inner {
  padding: 0 !important;
  max-width: none !important;
}

/* ── Pages internes : sidebar visible + contenu ── */
body[data-layout="bibliotheque"]:not(:has(.tm-root)) .pro-sidebar {
  background: #fff !important;
  border-right: var(--space-xxs) solid var(--border-color) !important;
}

body[data-layout="bibliotheque"]:not(:has(.tm-root)) .pro-content-inner {
  padding: var(--space-lg-28) 36px !important;
  background: var(--body-bg) !important;
}

/* ── Masquer les wrappers legacy de new_body.html ── */
body[data-layout="bibliotheque"] .overview-topbar {
  display: none !important;
}

/* Colonne droite legacy — masquée, remplacée par .tm-right-rail */
body[data-layout="bibliotheque"] .overview-aside {
  display: none !important;
}

body[data-layout="bibliotheque"] .overview-layout {
  display: block;
  padding: 0;
  background: transparent;
}

body[data-layout="bibliotheque"] .overview-main {
  padding: 0;
}

body[data-layout="bibliotheque"] .project-page.professional-show {
  display: none !important;
}

body[data-layout="bibliotheque"] .overview-layout~#saveStatus {
  display: none !important;
}

/* ════════════════════════════════════════════════
   LAYOUT RACINE — 3 colonnes
   ════════════════════════════════════════════════ */
body[data-layout="bibliotheque"] .tm-root {
  display: flex;
  height: calc(100vh - 48px);
  overflow: hidden;
  background: var(--body-bg);
  font-family: var(--font-sans);
  color: var(--text-main);
}

/* ── Rail gauche — blanc, bordure droite ─────── */
body[data-layout="bibliotheque"] .tm-left-rail {
  width: 240px;
  flex-shrink: 0;
  background: var(--card-bg);
  border-right: var(--space-xxs) solid var(--border-color);
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  padding: var(--space-md-12) var(--space-md-12) var(--space-lg-18);
  gap: var(--space-sm);
}

/* ── Centre ──────────────────────────────────── */
body[data-layout="bibliotheque"] .tm-center {
  flex: 1;
  overflow-y: auto;
  min-width: 0;
  padding: var(--space-xl) var(--space-2xl) 48px;
  background: var(--body-bg);
}

/* ── Rail droit ──────────────────────────────── */
body[data-layout="bibliotheque"] .tm-right-rail {
  width: 290px;
  flex-shrink: 0;
  background: var(--card-bg);
  border-left: var(--space-xxs) solid var(--border-color);
  overflow-y: auto;
  padding: var(--space-lg);
  display: flex;
  flex-direction: column;
  gap: var(--space-md-14);
}

/* ════════════════════════════════════════════════
   RAIL GAUCHE — Éléments partagés
   ════════════════════════════════════════════════ */

body[data-layout="bibliotheque"] .tm-rail-label {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--text-faint);
  padding: var(--space-md) var(--space-sm) var(--space-sm);
  margin-top: var(--space-md);
}

body[data-layout="bibliotheque"] .tm-rail-link {
  display: flex;
  align-items: center;
  gap: var(--space-md-9);
  padding: var(--space-sm-6) var(--space-md);
  font-size: 13px;
  color: var(--text-main);
  text-decoration: none !important;
  border-radius: var(--radius-5px);
  transition: background 0.1s, color 0.1s;
  cursor: pointer;
  border-left: none;
}

body[data-layout="bibliotheque"] .tm-rail-link:hover {
  background: rgba(30, 42, 74, 0.06) !important;
  color: var(--text-main) !important;
  text-decoration: none !important;
}

body[data-layout="bibliotheque"] .tm-rail-link.is-active {
  background: var(--accent-bg) !important;
  color: var(--accent) !important;
  font-weight: 600;
  text-decoration: none !important;
}

body[data-layout="bibliotheque"] .tm-rail-count {
  margin-left: auto;
  font-size: 11px;
  color: var(--text-faint);
  background: var(--body-bg);
  padding: 0 var(--space-sm-6);
  border-radius: var(--radius-8px);
  font-variant-numeric: tabular-nums;
}

body[data-layout="bibliotheque"] .tm-rail-dot {
  display: inline-block;
  width: 14px;
  color: #cbd0db;
  font-size: 11px;
  text-align: center;
  flex-shrink: 0;
}

body[data-layout="bibliotheque"] .tm-rail-icon {
  width: 14px;
  font-size: 12px;
  text-align: center;
  flex-shrink: 0;
  opacity: 0.55;
  transition: opacity 0.1s;
}

body[data-layout="bibliotheque"] .tm-rail-link:hover .tm-rail-icon,
body[data-layout="bibliotheque"] .tm-rail-link.is-active .tm-rail-icon {
  opacity: 1;
}

body[data-layout="bibliotheque"] .tm-rail-sep {
  height: 1px;
  background: var(--border-color);
  margin: var(--space-md-10) 0;
}

/* ════════════════════════════════════════════════
   RAIL GAUCHE — Workspace switcher (spécifique B)
   ════════════════════════════════════════════════ */
.tb-workspace-switch {
  display: flex;
  align-items: center;
  gap: var(--space-md-9);
  padding: var(--space-md);
  background: var(--body-bg);
  border: var(--space-xxs) solid var(--border-color);
  border-radius: var(--radius-7px);
  margin-bottom: var(--space-md-10);
  /*cursor: pointer;*/
  transition: background 0.1s;
}

.tb-workspace-switch:hover {
  /*background: var(--border-light);*/
}

.tb-workspace-mark {
  width: 28px;
  height: 28px;
  border-radius: var(--radius-6px);
  background: var(--accent);
  color: #f7f6f2;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 600;
  font-family: var(--font-sans);
  flex-shrink: 0;
  letter-spacing: 0.03em;
}

.tb-workspace-info {
  flex: 1;
  min-width: 0;
}

.tb-workspace-name {
  font-size: 13px;
  font-weight: 600;
  color: var(--text-main);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.tb-workspace-meta {
  font-size: 11px;
  color: var(--text-muted);
  margin-top: var(--space-xxs);
}

.tb-workspace-chev {
  color: var(--text-faint);
  font-size: 15px;
  line-height: 1;
  flex-shrink: 0;
}

/* ── Chip projet (spécifique B) ──────────────── */
.tb-project-chip {
  display: flex;
  align-items: center;
  gap: var(--space-md-10);
  padding: var(--space-md-10);
  background: var(--card-bg-2);
  border: var(--space-xxs) solid var(--border-color);
  border-radius: var(--radius-md);
  margin: var(--space-xs) 0 var(--space-md);
}

.tb-project-spine {
  width: 36px;
  height: 52px;
  border-radius: var(--radius-3px);
  flex-shrink: 0;
  object-fit: cover;
  box-shadow: var(--space-xxs) var(--space-xs) var(--space-sm-6) rgba(0, 0, 0, .25), inset -var(--space-xs) 0 0 rgba(255, 255, 255, .08);
}

.tb-project-spine--placeholder {
  background: linear-gradient(170deg, #2a1f1a, #4a382c);
}

.tb-project-chip-info {
  flex: 1;
  min-width: 0;
}

.tb-project-chip-name {
  font-family: var(--font-serif);
  font-size: 14px;
  font-weight: 600;
  font-style: italic;
  color: var(--text-main);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.tb-project-chip-meta {
  font-size: 11px;
  color: var(--text-muted);
  margin-top: var(--space-xs);
}

/* ════════════════════════════════════════════════
   CENTRE — En-tête de page (B)
   ════════════════════════════════════════════════ */
body[data-layout="bibliotheque"] .tm-page-header {
  margin-bottom: var(--space-lg-22);
}

body[data-layout="bibliotheque"] .tm-eyebrow {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--text-faint);
  margin-bottom: var(--space-sm-6);
}

/* Spécificité (0,2,2) pour battre body.ui-pro .pro-content-inner h1 (0,2,1) */
body[data-layout="bibliotheque"] h1.tm-h1 {
  font-family: var(--font-serif) !important;
  font-style: italic !important;
  font-size: 32px !important;
  font-weight: 600 !important;
  line-height: 1.1 !important;
  color: var(--text-main) !important;
  margin: 0 !important;
  letter-spacing: -0.015em !important;
}

body[data-layout="bibliotheque"] .tm-subtitle {
  font-size: 13px;
  color: var(--text-muted);
  margin-bottom: 0;
}

/* ── Stats row — dans le header ──────────────── */
.tb-stat-row {
  display: flex;
  background: var(--card-bg);
  border: var(--space-xxs) solid var(--border-color);
  border-radius: var(--radius-8px);
  overflow: hidden;
  margin-top: var(--space-lg-18);
}

.tb-stat-cell {
  flex: 1;
  padding: var(--space-md-14) var(--space-lg-18);
  border-right: var(--space-xxs) solid var(--border-color);
}

.tb-stat-cell:last-child {
  border-right: none;
}

.tb-stat-label {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--text-faint);
  margin-bottom: var(--space-sm);
}

.tb-stat-value {
  font-family: var(--font-serif);
  font-size: 22px;
  font-weight: 600;
  color: var(--text-main);
  line-height: 1;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
}

.tb-stat-trend {
  font-size: 11.var(--space-sm-5);
  color: var(--text-muted);
  margin-top: var(--space-xs);
}

.tb-stat-trend.is-ok {
  color: var(--color-success);
}

/* ── Toolbar B : onglets + outils ────────────── */
.tb-toolbar-row {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: var(--space-md-12);
  margin-bottom: var(--space-lg-18);
  padding-bottom: var(--space-md-12);
  border-bottom: var(--space-xxs) solid var(--border-color);
}

.tb-tabs {
  display: flex;
  gap: var(--space-xs);
}

.tb-tab {
  padding: var(--space-sm-6) var(--space-md-12);
  font-size: 13px;
  background: transparent;
  border: none;
  border-radius: var(--radius-5px);
  cursor: pointer;
  color: var(--text-muted);
  font-family: var(--font-sans);
  text-decoration: none !important;
  display: inline-block;
  transition: background 0.1s, color 0.1s;
}

.tb-tab:hover {
  color: var(--text-main) !important;
  background: rgba(30, 42, 74, 0.05) !important;
  text-decoration: none !important;
}

.tb-tab.is-active {
  background: var(--accent) !important;
  color: #fff !important;
  font-weight: 500;
  text-decoration: none !important;
}

.tb-toolbar-right {
  display: flex;
  align-items: center;
  gap: var(--space-md);
  flex-shrink: 0;
}

/* ── Champ filtre ─────────────────────────────── */
body[data-layout="bibliotheque"] .tm-search-wrap {
  display: flex;
  align-items: center;
  gap: var(--space-sm-6);
  height: 30px;
  padding: 0;
}

body[data-layout="bibliotheque"] .tm-search-wrap input {
  border: none;
  outline: none;
  box-shadow: none;
  background: transparent;
  font-size: 13px;
  color: var(--text-main);
  flex: 1;
  min-width: 0;
  width: auto;
  padding: 0;
  font-family: var(--font-sans);
  -webkit-appearance: none;
  appearance: none;
}

body[data-layout="bibliotheque"] .tm-search-wrap input::placeholder {
  color: var(--text-faint);
}

/* ── Boutons ──────────────────────────────────── */
body[data-layout="bibliotheque"] .tm-btn {
  height: 30px;
  padding: 0 var(--space-md-12);
  background: var(--card-bg);
  border: var(--space-xxs) solid var(--border-color);
  border-radius: var(--radius-md);
  font-size: 13px;
  font-family: var(--font-sans);
  cursor: pointer;
  color: var(--text-main);
  text-decoration: none !important;
  display: inline-flex;
  align-items: center;
  gap: var(--space-sm-5);
  transition: background 0.1s, color 0.1s, border-color 0.1s;
  white-space: nowrap;
}

body[data-layout="bibliotheque"] .tm-btn:hover {
  background: var(--text-main) !important;
  color: #fff !important;
  border-color: var(--text-main) !important;
  text-decoration: none !important;
}

body[data-layout="bibliotheque"] .tm-btn-primary {
  background: var(--accent);
  color: #fff;
  border-color: var(--accent);
  font-weight: 500;
}

body[data-layout="bibliotheque"] .tm-btn-primary:hover {
  background: #162038 !important;
  color: #fff !important;
  border-color: #162038 !important;
}

/* ════════════════════════════════════════════════
   CENTRE — Chapitres (surcharge ms-*)
   ════════════════════════════════════════════════ */

/* Masquer la checkbox d'export, garder l'input d'ordre visible */
body[data-layout="bibliotheque"] .ms-hidden-cell .export-toggle {
  display: none;
}

body[data-layout="bibliotheque"] td.ms-hidden-cell {
  width: 44px;
  padding: 0 var(--space-sm);
  text-align: center;
}

body[data-layout="bibliotheque"] div.ms-hidden-cell {
  display: inline-flex;
  align-items: center;
}

body[data-layout="bibliotheque"] .ms-status-cell {
  display: table-cell;
}

/* ── Acte (group card) ───────────────────────── */
body[data-layout="bibliotheque"] .ms-act {
  background: var(--card-bg);
  border: var(--space-xxs) solid var(--border-color);
  border-radius: var(--radius-8px);
  margin-bottom: var(--space-md-14);
  overflow: hidden;
}

/* Summary = groupHeader du design */
body[data-layout="bibliotheque"] .ms-act>summary {
  display: flex !important;
  align-items: center;
  gap: var(--space-md-10);
  padding: var(--space-md-11) var(--space-lg) !important;
  cursor: pointer;
  list-style: none !important;
  border-bottom: var(--space-xxs) solid var(--border-light);
}

body[data-layout="bibliotheque"] .ms-act>summary::-webkit-details-marker {
  display: none;
}

body[data-layout="bibliotheque"] .ms-act>summary::marker {
  display: none;
}

body[data-layout="bibliotheque"] .ms-act>summary:hover {
  background: rgba(30, 42, 74, 0.025);
}

/* Chevron */
body[data-layout="bibliotheque"] .ms-act-arrow {
  font-size: 13px;
  color: var(--text-main);
  width: 12px;
  flex-shrink: 0;
  display: inline-block;
  transition: transform 0.15s;
}

/* Titre d'acte — Lora italic bold */
body[data-layout="bibliotheque"] .ms-act-title {
  font-family: var(--font-serif);
  font-style: italic;
  font-size: 16px;
  font-weight: 600;
  color: var(--text-main);
  flex: 1;
}

/* Méta acte — chapitres/pages à droite */
body[data-layout="bibliotheque"] .ms-act-meta {
  font-size: 12px;
  color: var(--text-muted);
  font-variant-numeric: tabular-nums;
  margin-left: auto;
  white-space: nowrap;
}

/* Actions d'acte — visibles au hover seulement */
body[data-layout="bibliotheque"] .ms-act-actions {
  display: flex;
  gap: var(--space-xs-3);
  opacity: 0;
  transition: opacity 0.15s;
}

body[data-layout="bibliotheque"] .ms-act>summary:hover .ms-act-actions {
  opacity: 1;
}

body[data-layout="bibliotheque"] .ms-act-actions .button.small,
body[data-layout="bibliotheque"] .ms-actions-cell .button.small {
  width: 26px !important;
  height: 26px !important;
  padding: 0 !important;
  min-width: unset !important;
  background: var(--card-bg) !important;
  border: var(--space-xxs) solid var(--border-color) !important;
  border-radius: var(--radius-5px) !important;
  color: var(--text-main) !important;
  font-size: 11px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* ── Table chapitres ─────────────────────────── */
body[data-layout="bibliotheque"] .ms-chapter-table {
  width: 100%;
  background: transparent;
  border: none;
  border-collapse: collapse;
}

/* Ligne chapitre */
body[data-layout="bibliotheque"] .ms-chapter-table tbody tr {
  border-bottom: var(--space-xxs) solid var(--border-light);
  transition: background 0.1s;
}

body[data-layout="bibliotheque"] .ms-chapter-table tbody tr:last-child {
  border-bottom: none;
}

body[data-layout="bibliotheque"] .ms-chapter-table tbody tr:hover {
  background: rgba(30, 42, 74, 0.025);
}

/* Cellules */
body[data-layout="bibliotheque"] .ms-chapter-table tbody td {
  padding: var(--space-md-10) var(--space-lg);
  vertical-align: middle;
}

/* Titre chapitre — Lora weight 500 */
body[data-layout="bibliotheque"] .ms-title-cell {
  width: 100%;
}

body[data-layout="bibliotheque"] .ms-chapter-link {
  font-family: var(--font-serif);
  font-size: 15px;
  font-weight: 500;
  color: var(--text-main);
  text-decoration: none !important;
}

body[data-layout="bibliotheque"] .ms-chapter-link:hover {
  color: var(--accent) !important;
  text-decoration: none !important;
}

/* Sous-chapitre marker */
body[data-layout="bibliotheque"] .ms-sub-marker {
  font-size: 11px;
  color: var(--text-faint);
  margin-left: var(--space-md);
}

/* Compteur de mots — monospace, dark */
body[data-layout="bibliotheque"] .ms-words-cell {
  font-family: var(--font-mono);
  font-size: 12px;
  color: var(--text-main);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  text-align: right;
}

/* Boutons actions — icon-buttons, visibles au hover */
body[data-layout="bibliotheque"] .ms-actions-cell {
  text-align: right;
  white-space: nowrap;
  opacity: 0;
  transition: opacity 0.15s;
}

body[data-layout="bibliotheque"] .ms-chapter-table tbody tr:hover .ms-actions-cell {
  opacity: 1;
}

body[data-layout="bibliotheque"] .ms-actions-cell .button.small {
  margin-left: var(--space-xs) !important;
}

body[data-layout="bibliotheque"] .ms-act-actions .button.small:hover,
body[data-layout="bibliotheque"] .ms-actions-cell .button.small:hover {
  background: var(--button-hover-bg) !important;
  color: var(--button-hover-text) !important;
}

body[data-layout="bibliotheque"] .button.small.delete {
  background: var(--button-bg) !important;
  color: var(--button-delete-hover-bg) !important;
}

body[data-layout="bibliotheque"] .button.small.delete:hover {
  background: var(--button-delete-hover-bg) !important;
  color: var(--button-bg) !important;
}


/* ── Lignes de sous-chapitres (= scènes dans le design) ─── */
body[data-layout="bibliotheque"] .ms-sub-row {
  background: var(--card-bg-2) !important;
}

body[data-layout="bibliotheque"] .ms-sub-row td {
  padding: var(--space-sm-5) var(--space-lg) var(--space-sm-5) var(--space-lg-28) !important;
}

body[data-layout="bibliotheque"] .ms-sub-indent {
  padding-left: var(--space-lg-28) !important;
}

body[data-layout="bibliotheque"] .ms-sub-link {
  font-family: var(--font-serif) !important;
  font-style: italic !important;
  /*font-size: 13.var(--space-sm-5) !important;*/
  color: var(--text-main) !important;
  text-decoration: none !important;
}

body[data-layout="bibliotheque"] .ms-sub-link:hover {
  color: var(--accent) !important;
  text-decoration: none !important;
}

/* ── Panneaux sections (avant/après chapitres) ── */
body[data-layout="bibliotheque"] .ms-panel {
  background: var(--card-bg);
  border: var(--space-xxs) solid var(--border-color);
  border-radius: var(--radius-8px);
  margin-bottom: var(--space-md-14);
  overflow: hidden;
}

body[data-layout="bibliotheque"] .ms-panel>summary {
  display: flex !important;
  align-items: center;
  gap: var(--space-md-10);
  /* padding: var(--space-md-11) var(--space-lg) !important; */
  list-style: none !important;
  border-bottom: var(--space-xxs) solid var(--border-light);
  cursor: pointer;
}

body[data-layout="bibliotheque"] .ms-panel>summary::-webkit-details-marker {
  display: none;
}

body[data-layout="bibliotheque"] .ms-panel>summary::marker {
  display: none;
}

body[data-layout="bibliotheque"] .ms-panel>summary:hover {
  background: rgba(30, 42, 74, 0.025);
}

body[data-layout="bibliotheque"] .collab-banner {
  background: var(--card-bg);
  border: var(--space-xxs) solid var(--border-color);
  border-radius: var(--radius-md);
  margin-bottom: var(--space-lg);
  color: var(--text-muted);
}

/* ════════════════════════════════════════════════
   RAIL DROIT — Cartes
   ════════════════════════════════════════════════ */
body[data-layout="bibliotheque"] .tm-card {
  background: var(--card-bg-2);
  border: var(--space-xxs) solid var(--border-color);
  border-radius: var(--radius-8px);
  padding: var(--space-lg);
  margin-bottom: var(--space-md-12);
}

body[data-layout="bibliotheque"] .tm-card-title {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--text-faint);
  margin-bottom: var(--space-md);
}

body[data-layout="bibliotheque"] .tm-progress-words {
  font-family: var(--font-serif);
  font-size: 30px;
  font-weight: 600;
  color: var(--text-main);
  line-height: 1;
  letter-spacing: -0.01em;
  font-variant-numeric: tabular-nums;
  margin-bottom: var(--space-xs);
}

body[data-layout="bibliotheque"] .tm-progress-words-label {
  font-size: 13px;
  color: var(--text-muted);
  margin-bottom: var(--space-md-10);
}

body[data-layout="bibliotheque"] .tm-progress-bar-wrap {
  background: var(--border-color);
  border-radius: var(--radius-2px);
  height: 4px;
  overflow: hidden;
  margin-top: var(--space-md-12);
  margin-bottom: var(--space-sm-6);
}

body[data-layout="bibliotheque"] .tm-progress-bar-fill {
  height: 100%;
  background: var(--accent);
  border-radius: var(--radius-2px);
  transition: width 0.5s ease;
}

body[data-layout="bibliotheque"] .tm-progress-pages {
  font-size: 12.var(--space-sm-5);
  color: var(--text-muted);
  font-family: var(--font-sans);
  font-variant-numeric: tabular-nums;
  margin-top: var(--space-sm);
}

body[data-layout="bibliotheque"] .tm-progress-note {
  font-size: 11.var(--space-sm-5);
  color: var(--text-muted);
  font-style: italic;
  margin-top: var(--space-md);
}

body[data-layout="bibliotheque"] .tm-tool-link {
  display: flex;
  align-items: center;
  gap: var(--space-md-9);
  padding: var(--space-md) var(--space-md-10);
  /*font-size: 13.var(--space-sm-5);*/
  color: var(--text-main);
  text-decoration: none !important;
  border-radius: var(--radius-5px);
  margin-bottom: var(--space-xs);
  transition: color 0.1s, background 0.1s;
}

body[data-layout="bibliotheque"] .tm-tool-link:hover {
  color: var(--accent) !important;
  text-decoration: none !important;
  background: rgba(30, 42, 74, 0.05) !important;
}

body[data-layout="bibliotheque"] .tm-tool-link i {
  width: 16px;
  text-align: center;
  opacity: 0.55;
  font-size: 12px;
}

/* ════════════════════════════════════════════════
   SAVE STATUS
   ════════════════════════════════════════════════ */
body[data-layout="bibliotheque"] #saveStatus {
  background: var(--accent);
  color: #fff;
}

/* ════════════════════════════════════════════════
   SIDEBAR — Pages internes
   ════════════════════════════════════════════════ */

body[data-layout="bibliotheque"] .pro-nav-divider {
  background: var(--border-color) !important;
  opacity: 1 !important;
}

body[data-layout="bibliotheque"] .pro-nav-project-title {
  font-family: var(--font-serif) !important;
  font-style: italic !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--text-main) !important;
}

body[data-layout="bibliotheque"] .pro-nav-item {
  font-family: var(--font-sans) !important;
  font-size: 13px !important;
  color: var(--text-muted) !important;
  border-radius: var(--radius-5px) !important;
  padding: var(--space-sm-5) var(--space-md-10) !important;
}

body[data-layout="bibliotheque"] .pro-nav-item:hover {
  background: rgba(30, 42, 74, 0.06) !important;
  color: var(--text-main) !important;
}

body[data-layout="bibliotheque"] .pro-nav-item.is-active {
  background: var(--accent-bg) !important;
  color: var(--accent) !important;
  font-weight: 600 !important;
}

body[data-layout="bibliotheque"] .pro-nav-item i {
  color: var(--text-faint) !important;
  font-size: 12px !important;
}

body[data-layout="bibliotheque"] .pro-nav-item.is-active i {
  color: var(--accent) !important;
}

body[data-layout="bibliotheque"] .pro-nav-section-label {
  font-size: 10px !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: var(--text-faint) !important;
  font-family: var(--font-sans) !important;
}

/* ════════════════════════════════════════════════
   ANTI-PRO — neutraliser les surcharges Pro
   ════════════════════════════════════════════════ */

body[data-layout="bibliotheque"] .pro-content-inner a {
  color: var(--accent);
  text-decoration: none !important;
}

body[data-layout="bibliotheque"] .pro-content-inner a:hover {
  text-decoration: underline;
}

body[data-layout="bibliotheque"] a.project-card-link:hover {
  background-color: var(--button-bg) !important;
}

body[data-layout="bibliotheque"] .pro-content-inner h1,
body[data-layout="bibliotheque"] .pro-content-inner h2,
body[data-layout="bibliotheque"] .pro-content-inner h3 {
  font-family: var(--font-serif) !important;
  color: var(--text-main) !important;
}

/* ════════════════════════════════════════════════
   PAGES INTERNES — Edit header
   ════════════════════════════════════════════════ */

body[data-layout="bibliotheque"] .edit-header {
  /*
  background: #fff;
  border-bottom: var(--space-xxs) solid var(--border-color);
  padding: var(--space-lg) var(--space-xl);
  */
  margin-bottom: var(--space-lg);
  display: flex;
  justify-content: space-between;
  align-items: center;
}

body[data-layout="bibliotheque"] .edit-header h1 {
  font-family: var(--font-serif) !important;
  font-style: italic !important;
  font-size: 22px !important;
  font-weight: 600 !important;
  color: var(--text-main) !important;
}

body[data-layout="bibliotheque"] .edit-card {
  background: #fff !important;
  border: var(--space-xxs) solid var(--border-color) !important;
  border-radius: var(--radius-md) !important;
  padding: var(--space-xl) !important;
  margin-bottom: var(--space-lg) !important;
}

body[data-layout="bibliotheque"] .edit-actions {
  display: flex !important;
  justify-content: flex-end !important;
  gap: var(--space-md) !important;
}

body[data-layout="bibliotheque"] .editor-top-bar {
  background: #fff !important;
  border-bottom: var(--space-xxs) solid var(--border-color) !important;
  padding: var(--space-md) var(--space-lg) !important;
}

body[data-layout="bibliotheque"] .pro-card {
  background: #fff !important;
  border: var(--space-xxs) solid var(--border-color) !important;
  border-radius: var(--radius-md) !important;
}

body[data-layout="bibliotheque"] .pro-card-header {
  background: var(--body-bg) !important;
  border-bottom: var(--space-xxs) solid var(--border-color) !important;
}

body[data-layout="bibliotheque"] .pro-card-header h2 {
  font-family: var(--font-serif) !important;
  font-style: italic !important;
  font-size: 16px !important;
  color: var(--text-main) !important;
}

/* ════════════════════════════════════════════════
   PAGES INTERNES — Formulaires
   ════════════════════════════════════════════════ */

body[data-layout="bibliotheque"] .form-control,
body[data-layout="bibliotheque"] input[type="text"],
body[data-layout="bibliotheque"] input[type="email"],
body[data-layout="bibliotheque"] input[type="password"],
body[data-layout="bibliotheque"] input[type="number"],
body[data-layout="bibliotheque"] select,
body[data-layout="bibliotheque"] textarea {
  background: #fff !important;
  border: var(--space-xxs) solid var(--border-color) !important;
  border-radius: var(--radius-md) !important;
  color: var(--text-main) !important;
  font-family: var(--font-sans) !important;
  /*font-size: 13.var(--space-sm-5) !important;*/
  padding: var(--space-md) var(--space-md-12) !important;
}

body[data-layout="bibliotheque"] .form-control:focus,
body[data-layout="bibliotheque"] input[type="text"]:focus,
body[data-layout="bibliotheque"] input[type="email"]:focus,
body[data-layout="bibliotheque"] input[type="password"]:focus,
body[data-layout="bibliotheque"] input[type="number"]:focus,
body[data-layout="bibliotheque"] select:focus,
body[data-layout="bibliotheque"] textarea:focus {
  border-color: var(--accent) !important;
  outline: none !important;
  box-shadow: 0 0 0 var(--space-xs) rgba(30, 42, 74, 0.12) !important;
}

body[data-layout="bibliotheque"] label,
body[data-layout="bibliotheque"] .form-label {
  font-family: var(--font-sans) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: var(--text-muted) !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
}

body[data-layout="bibliotheque"] .title-input {
  font-family: var(--font-serif) !important;
  font-size: 22px !important;
  font-style: italic !important;
  font-weight: 600 !important;
  color: var(--text-main) !important;
  background: transparent !important;
  border: none !important;
  border-bottom: var(--space-xxs) solid var(--border-color) !important;
  border-radius: 0 !important;
  padding: var(--space-sm-6) 0 !important;
}

body[data-layout="bibliotheque"] .title-input:focus {
  border-bottom-color: var(--accent) !important;
  box-shadow: none !important;
  outline: none !important;
}

/* ════════════════════════════════════════════════
   PAGES INTERNES — Boutons globaux
   ════════════════════════════════════════════════ */

body[data-layout="bibliotheque"] .button,
body[data-layout="bibliotheque"] .button.secondary {
  font-family: var(--font-sans) !important;
  font-size: 13px !important;
  border-radius: var(--radius-md) !important;
  border: var(--space-xxs) solid var(--border-color) !important;
  background: var(--button-bg) !important;
  color: var(--button-text) !important;
  padding: var(--space-sm-7) var(--space-md-14) !important;
  transition: background 0.1s, border-color 0.1s, color 0.1s !important;
}

body[data-layout="bibliotheque"] .button:hover,
body[data-layout="bibliotheque"] .button.secondary:hover {
  background: var(--text-main) !important;
  color: #fff !important;
  border-color: var(--text-main) !important;
}

body[data-layout="bibliotheque"] .button.primary,
body[data-layout="bibliotheque"] .button[type="submit"]:not(.secondary) {
  background: var(--accent) !important;
  color: #fff !important;
  border-color: var(--accent) !important;
  font-weight: 500 !important;
}

body[data-layout="bibliotheque"] .button.primary:hover,
body[data-layout="bibliotheque"] .button[type="submit"]:not(.secondary):hover {
  background: #162038 !important;
  border-color: #162038 !important;
  color: #fff !important;
}

body[data-layout="bibliotheque"] .button.danger {
  color: #c00 !important;
  border-color: #ffc0c0 !important;
  background: #fff8f8 !important;
}

body[data-layout="bibliotheque"] .button.danger:hover {
  background: #c00 !important;
  color: #fff !important;
  border-color: #c00 !important;
}

/* ════════════════════════════════════════════════
   PAGES INTERNES — Typographie
   ════════════════════════════════════════════════ */

body[data-layout="bibliotheque"] .pro-content-inner p {
  font-family: var(--font-sans);
  font-size: 14px;
  line-height: 1.6;
  color: var(--text-main);
}

body[data-layout="bibliotheque"] .pro-content-inner h1 {
  font-size: 26px !important;
}

body[data-layout="bibliotheque"] .pro-content-inner h2 {
  font-size: 20px !important;
}

body[data-layout="bibliotheque"] .pro-content-inner h3 {
  font-size: 16px !important;
}

/* Dashboard — neutraliser les règles typographiques génériques */
body[data-layout="bibliotheque"] .pro-dash-title {
  font-family: var(--font-sans) !important;
  font-style: normal !important;
  font-size: 18px !important;
}

body[data-layout="bibliotheque"] .dashboard-header h2 {
  font-family: var(--font-sans) !important;
  font-style: normal !important;
}

body[data-layout="bibliotheque"] .section-title {
  font-family: var(--font-serif) !important;
  font-style: italic !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  color: var(--text-main) !important;
}

body[data-layout="bibliotheque"] .text-muted,
body[data-layout="bibliotheque"] .text-muted-para {
  color: var(--text-muted) !important;
  font-size: 13px !important;
}

body[data-layout="bibliotheque"] .badge,
body[data-layout="bibliotheque"] .tag {
  font-family: var(--font-sans) !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  background: var(--accent-bg) !important;
  color: var(--accent) !important;
  border: var(--space-xxs) solid rgba(30, 42, 74, 0.15) !important;
  border-radius: var(--radius-4px) !important;
  padding: var(--space-xs) var(--space-sm-6) !important;
}

body[data-layout="bibliotheque"] .form-alert,
body[data-layout="bibliotheque"] .notification-banner {
  font-family: var(--font-sans) !important;
  font-size: 13px !important;
  border-radius: var(--radius-md) !important;
}

body[data-layout="bibliotheque"] .form-alert.success,
body[data-layout="bibliotheque"] .notification-banner.success {
  background: #f0faf4 !important;
  border-color: #a3d9b1 !important;
  color: #0a6e3a !important;
}

body[data-layout="bibliotheque"] .form-alert.error,
body[data-layout="bibliotheque"] .notification-banner.error {
  background: #fff5f5 !important;
  border-color: #ffa0a0 !important;
  color: #b30000 !important;
}

/* ════════════════════════════════════════════════
   ÉDITEUR QUILL
   ════════════════════════════════════════════════ */

body[data-layout="bibliotheque"] .ql-toolbar.ql-snow {
  background: #fff !important;
  border: var(--space-xxs) solid var(--border-color) !important;
  border-radius: var(--radius-md) var(--radius-md) 0 0 !important;
}

body[data-layout="bibliotheque"] .ql-container.ql-snow {
  background: #fff !important;
  border: var(--space-xxs) solid var(--border-color) !important;
  border-top: none !important;
  border-radius: 0 0 var(--radius-md) var(--radius-md) !important;
}

body[data-layout="bibliotheque"] .ql-editor {
  font-family: var(--font-serif) !important;
  font-size: 16px !important;
  line-height: 1.75 !important;
  color: var(--text-main) !important;
  padding: var(--space-xl) var(--space-lg-28) !important;
}

body[data-layout="bibliotheque"] .ql-editor p {
  margin-bottom: 0;
}

body[data-layout="bibliotheque"] .ql-toolbar .ql-stroke {
  stroke: var(--text-muted) !important;
}

body[data-layout="bibliotheque"] .ql-toolbar .ql-fill {
  fill: var(--text-muted) !important;
}

body[data-layout="bibliotheque"] .ql-toolbar button:hover .ql-stroke,
body[data-layout="bibliotheque"] .ql-toolbar button.ql-active .ql-stroke {
  stroke: var(--accent) !important;
}

body[data-layout="bibliotheque"] .ql-toolbar button:hover .ql-fill,
body[data-layout="bibliotheque"] .ql-toolbar button.ql-active .ql-fill {
  fill: var(--accent) !important;
}

/* ════════════════════════════════════════════════
   TABLEAUX
   ════════════════════════════════════════════════ */

body[data-layout="bibliotheque"] .pro-table-wrap {
  background: #fff !important;
  border: var(--space-xxs) solid var(--border-color) !important;
  border-radius: var(--radius-md) !important;
  overflow: hidden !important;
}

body[data-layout="bibliotheque"] .pro-table,
body[data-layout="bibliotheque"] .pro-table-wrap table,
body[data-layout="bibliotheque"] .table {
  width: 100% !important;
  border-collapse: collapse !important;
  background: transparent !important;
}

body[data-layout="bibliotheque"] .pro-table th,
body[data-layout="bibliotheque"] .pro-table-wrap table th,
body[data-layout="bibliotheque"] .table th {
  font-family: var(--font-sans) !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: var(--text-faint) !important;
  background: var(--body-bg) !important;
  padding: var(--space-md-10) var(--space-md-14) !important;
  border-bottom: var(--space-xxs) solid var(--border-color) !important;
}

body[data-layout="bibliotheque"] .pro-table td,
body[data-layout="bibliotheque"] .pro-table-wrap table td,
body[data-layout="bibliotheque"] .table td {
  font-family: var(--font-sans) !important;
  /*font-size: 13.var(--space-sm-5) !important;*/
  color: var(--text-main) !important;
  padding: var(--space-md-10) var(--space-md-14) !important;
  border-bottom: var(--space-xxs) solid var(--border-light) !important;
}

body[data-layout="bibliotheque"] .pro-table tbody tr:hover td,
body[data-layout="bibliotheque"] .pro-table-wrap table tbody tr:hover td {
  background: rgba(30, 42, 74, 0.03) !important;
}

body[data-layout="bibliotheque"] .pro-table tbody tr:last-child td {
  border-bottom: none !important;
}

/* ════════════════════════════════════════════════
   MODALES
   ════════════════════════════════════════════════ */

body[data-layout="bibliotheque"] .modal-overlay {
  background: rgba(15, 23, 42, 0.5) !important;
  backdrop-filter: blur(var(--space-xs)) !important;
}

body[data-layout="bibliotheque"] .modal-content {
  background: #fff !important;
  border: var(--space-xxs) solid var(--border-color) !important;
  border-radius: var(--radius-10px) !important;
  box-shadow: 0 var(--space-md-12) 40px rgba(15, 23, 42, 0.18) !important;
  color: var(--text-main) !important;
}

body[data-layout="bibliotheque"] .modal-header {
  background: var(--body-bg) !important;
  border-bottom: var(--space-xxs) solid var(--border-color) !important;
  padding: var(--space-lg) var(--space-lg-20) !important;
  border-radius: var(--radius-10px) var(--radius-10px) 0 0 !important;
}

body[data-layout="bibliotheque"] .modal-header h3 {
  font-family: var(--font-serif) !important;
  font-style: italic !important;
  font-size: 17px !important;
  font-weight: 600 !important;
  color: var(--text-main) !important;
  margin: 0 !important;
}

body[data-layout="bibliotheque"] .modal-body {
  padding: var(--space-lg-20) !important;
}

body[data-layout="bibliotheque"] .modal-close {
  color: var(--text-muted) !important;
  font-size: 20px !important;
  background: transparent !important;
  border: none !important;
}

body[data-layout="bibliotheque"] .modal-close:hover {
  color: var(--text-main) !important;
}

/* ════════════════════════════════════════════════
   ONGLETS — .pro-tabs / .pro-tab
   ════════════════════════════════════════════════ */

body[data-layout="bibliotheque"] .pro-tabs {
  display: flex;
  gap: var(--space-xs);
  border-bottom: var(--space-xxs) solid var(--border-color) !important;
  margin-bottom: var(--space-lg-20);
}

body[data-layout="bibliotheque"] .pro-tab {
  font-family: var(--font-sans) !important;
  font-size: 13px !important;
  color: var(--text-muted) !important;
  padding: var(--space-sm-7) var(--space-md-14) !important;
  border-radius: var(--radius-5px) var(--radius-5px) 0 0 !important;
  border: none !important;
  background: transparent !important;
  cursor: pointer;
  text-decoration: none !important;
  transition: color 0.1s, background 0.1s;
}

body[data-layout="bibliotheque"] .pro-tab:hover {
  color: var(--text-main) !important;
  background: rgba(30, 42, 74, 0.05) !important;
  text-decoration: none !important;
}

body[data-layout="bibliotheque"] .pro-tab.is-active {
  color: var(--accent) !important;
  font-weight: 600 !important;
  background: var(--accent-bg) !important;
}

body[data-layout="bibliotheque"] .ai-provider-tab {
  font-family: var(--font-sans) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: var(--text-muted) !important;
  border-bottom: var(--space-xs) solid transparent !important;
  padding: var(--space-sm-7) var(--space-md-14) !important;
  background: transparent !important;
  border-top: none !important;
  border-left: none !important;
  border-right: none !important;
}

body[data-layout="bibliotheque"] .ai-provider-tab:hover {
  color: var(--text-main) !important;
}

body[data-layout="bibliotheque"] .ai-provider-tab.is-active {
  color: var(--accent) !important;
  border-bottom-color: var(--accent) !important;
  font-weight: 600 !important;
}

/* ════════════════════════════════════════════════
   INTERFACE IA
   ════════════════════════════════════════════════ */

body[data-layout="bibliotheque"] .ai-modal {
  background: #fff !important;
  border: var(--space-xxs) solid var(--border-color) !important;
  border-radius: var(--radius-md) !important;
  box-shadow: 0 var(--space-md) var(--space-2xl) rgba(15, 23, 42, 0.14) !important;
  color: var(--text-main) !important;
}

body[data-layout="bibliotheque"] .ai-modal h3 {
  font-family: var(--font-serif) !important;
  font-size: 17px !important;
  font-weight: 600 !important;
  font-style: italic !important;
  color: var(--accent) !important;
  margin: 0 0 var(--space-md-14) !important;
}

body[data-layout="bibliotheque"] .ai-modal-textarea {
  background: var(--body-bg) !important;
  border: var(--space-xxs) solid var(--border-color) !important;
  border-radius: var(--radius-md) !important;
  color: var(--text-main) !important;
  font-family: var(--font-sans) !important;
  /*font-size: 13.var(--space-sm-5) !important;*/
  line-height: 1.6 !important;
  padding: var(--space-md-10) var(--space-md-12) !important;
}

body[data-layout="bibliotheque"] .ai-modal-textarea:focus {
  border-color: var(--accent) !important;
  outline: none !important;
  box-shadow: 0 0 0 var(--space-xs) rgba(30, 42, 74, 0.12) !important;
}

body[data-layout="bibliotheque"] .ai-box {
  background: rgba(30, 42, 74, 0.04) !important;
  border: var(--space-xxs) solid rgba(30, 42, 74, 0.15) !important;
  border-radius: var(--radius-md) !important;
  color: var(--text-main) !important;
  font-family: var(--font-sans) !important;
  /*font-size: 13.var(--space-sm-5) !important;*/
  line-height: 1.65 !important;
  padding: var(--space-md-14) var(--space-lg) !important;
}

body[data-layout="bibliotheque"] .ai-config-card {
  background: #fff !important;
  border: var(--space-xxs) solid var(--border-color) !important;
  border-radius: var(--radius-md) !important;
}

body[data-layout="bibliotheque"] .ai-config-header {
  background: var(--body-bg) !important;
  border-bottom: var(--space-xxs) solid var(--border-color) !important;
  padding: var(--space-md-12) var(--space-lg-18) !important;
}

body[data-layout="bibliotheque"] .ai-config-header h2 {
  font-family: var(--font-serif) !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  font-style: italic !important;
  color: var(--accent) !important;
  margin: 0 !important;
}

body[data-layout="bibliotheque"] .ai-config-header p {
  font-family: var(--font-sans) !important;
  font-size: 12px !important;
  color: var(--text-muted) !important;
  margin: var(--space-xs) 0 0 !important;
}