/*
 * CryptoExplor — styles du contenu éditorial (the_content).
 * Chargé sur le site ET dans l'éditeur de blocs (add_editor_style).
 * Le préfixe :is(.entry-content, .is-root-container) cible le contenu publié et,
 * dans l'éditeur, le conteneur racine des blocs ; il garde la spécificité d'une classe.
 *
 * Sommaire : 1. Port maquette · 2. Blocs Gutenberg courants · 3. Blocs de l'extension
 * éditoriale (.ce-update, .ce-sources, modèle « Incident ») · 4. Palette ↔ mode sombre.
 */

/* ==========================================================================
   1. Port de la maquette (typographie, encadrés, journal, sources)
   ========================================================================== */
:is(.entry-content, .is-root-container) { font-size: 17.5px; line-height: 1.7; color: var(--text-2); }
:is(.entry-content, .is-root-container) > * + * { margin-top: 1.2em; }
:is(.entry-content, .is-root-container) h2 { margin-top: 2em; font-size: 26px; line-height: 1.2; scroll-margin-top: calc(var(--header-h) + 24px); }
:is(.entry-content, .is-root-container) h2 + * { margin-top: .7em; }
:is(.entry-content, .is-root-container) strong { color: var(--text); }
:is(.entry-content, .is-root-container) a { color: var(--accent); text-decoration: underline; }
:is(.entry-content, .is-root-container) .mono { font-size: .88em; padding: 1px 5px; border-radius: 4px; background: var(--surface-2); }

.box { padding: 20px; border-radius: var(--radius); font-size: 16px; line-height: 1.6; }
.box__title { margin-bottom: 14px; font: 700 13px/1.3 var(--font-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--text); }
.box__title::before { content: '// '; color: var(--accent); }

.facts { display: grid; gap: 0; padding: 0; overflow: hidden; background: var(--surface); border: 1px solid var(--border); }
.facts__col { padding: 20px; }
.facts__col + .facts__col { border-top: 1px solid var(--border); background: var(--surface-2); }
.facts__col h3 { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; font: 700 13px/1.3 var(--font-mono); letter-spacing: .07em; text-transform: uppercase; }
.facts__col--known h3 { color: var(--status-confirmed); }
.facts__col--unknown h3 { color: var(--status-pending); }
.facts ul { list-style: none; display: grid; gap: 10px; }
.facts li { position: relative; padding-left: 22px; }
.facts__col--known li::before { content: '✓'; position: absolute; left: 0; color: var(--status-confirmed); font-weight: 700; }
.facts__col--unknown li::before { content: '?'; position: absolute; left: 2px; color: var(--status-pending); font: 700 15px var(--font-mono); }
@media (min-width: 768px) {
  .facts { grid-template-columns: 1fr 1fr; }
  .facts__col + .facts__col { border-top: 0; border-left: 1px solid var(--border); }
}

.todo { background: var(--accent-soft); border: 1px solid color-mix(in srgb, var(--accent) 35%, transparent); border-left: 4px solid var(--accent); }
.todo ol { list-style: none; counter-reset: todo; display: grid; gap: 14px; }
.todo li { position: relative; padding-left: 36px; counter-increment: todo; color: var(--text); }
.todo li::before {
  content: counter(todo);
  position: absolute; left: 0; top: 1px;
  display: grid; place-items: center;
  width: 24px; height: 24px;
  border-radius: 50%;
  background: var(--accent);
  color: var(--on-accent);
  font: 700 12px/1 var(--font-mono);
}
.todo .src { display: block; margin-top: 2px; color: var(--muted); font: 500 12px/1.5 var(--font-mono); }
.todo .src a { color: var(--accent); }

.update-log { list-style: none; border-left: 2px solid var(--border); margin-left: 6px; }
.update-log li { position: relative; display: grid; gap: 2px; padding: 0 0 18px 22px; font-size: 16px; }
.update-log li::before { content: ''; position: absolute; left: -7px; top: 6px; width: 12px; height: 12px; border-radius: 50%; background: var(--surface); border: 2px solid var(--border-strong); }
.update-log li:first-child::before { background: var(--accent-deco); border-color: var(--accent-deco); }
.update-log time { color: var(--text); font: 700 14px/1.4 var(--font-mono); }
.update-log .who { color: var(--muted); font: 500 12.5px var(--font-mono); }

.x-embed-fallback { max-width: 560px; }

.sources { list-style: none; display: grid; gap: 12px; counter-reset: src; }
.sources li { counter-increment: src; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 2px 12px; padding: 14px 16px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); font-size: 15.5px; }
.sources li::before { content: '[' counter(src) ']'; grid-row: 1 / span 3; color: var(--accent); font: 700 13px/1.7 var(--font-mono); }
.sources .src-type { color: var(--muted); font: 600 11px/1.6 var(--font-mono); letter-spacing: .07em; text-transform: uppercase; }
.sources a { color: var(--text); font-weight: 600; }
.sources a:hover { color: var(--accent); }
.sources .src-note { color: var(--muted); font-size: 14px; line-height: 1.5; }
.sources .src-note time { color: var(--text-2); font-family: var(--font-mono); font-size: 12.5px; }

/* ==========================================================================
   2. Blocs Gutenberg courants
   ========================================================================== */
:is(.entry-content, .is-root-container) h3 { margin-top: 1.8em; font-size: 21px; line-height: 1.3; scroll-margin-top: calc(var(--header-h) + 24px); }
:is(.entry-content, .is-root-container) h4 { margin-top: 1.6em; font-size: 18px; line-height: 1.35; }
:is(.entry-content, .is-root-container) h3 + *, :is(.entry-content, .is-root-container) h4 + * { margin-top: .6em; }

/* Listes (la base remet padding à 0). Ciblage limité aux listes « de texte » :
   enfants directs du contenu, des groupes et colonnes, et listes imbriquées ;
   les listes des encadrés de la maquette (.facts, .todo…) gardent leur rendu. */
:is(.entry-content, .is-root-container) > :is(ul, ol),
:is(.entry-content, .is-root-container) :is(.wp-block-group, .wp-block-column, blockquote) > :is(ul, ol),
:is(.entry-content, .is-root-container) li > :is(ul, ol) { padding-left: 1.4em; }
:is(.entry-content, .is-root-container) .wp-block-list li + li,
:is(.entry-content, .is-root-container) > :is(ul, ol) li + li { margin-top: .4em; }
:is(.entry-content, .is-root-container) .wp-block-list > li::marker { color: var(--accent); }
:is(.entry-content, .is-root-container) ol.wp-block-list > li::marker { font-family: var(--font-mono); font-weight: 700; font-size: .9em; }
:is(.entry-content, .is-root-container) li > :is(ul, ol) { margin-top: .4em; }

/* Citations */
:is(.entry-content, .is-root-container) blockquote:not(.twitter-tweet) {
  margin-inline: 0;
  padding: 4px 0 4px 20px;
  border-left: 3px solid var(--accent-deco);
  color: var(--text);
  font-size: 1.05em;
}
:is(.entry-content, .is-root-container) blockquote > * + * { margin-top: .7em; }
:is(.entry-content, .is-root-container) blockquote cite,
:is(.entry-content, .is-root-container) .wp-block-pullquote cite {
  display: block; margin-top: 10px;
  color: var(--muted); font: 500 12.5px/1.5 var(--font-mono); font-style: normal;
}
:is(.entry-content, .is-root-container) .wp-block-pullquote {
  padding: 24px 0;
  border-block: 1px solid var(--border);
  text-align: left;
}
:is(.entry-content, .is-root-container) .wp-block-pullquote blockquote { border: 0; padding: 0; font: 600 clamp(21px, 3vw, 26px)/1.35 var(--font-display); }

/* Tableaux */
:is(.entry-content, .is-root-container) .wp-block-table { overflow-x: auto; margin-inline: 0; }
:is(.entry-content, .is-root-container) table { width: 100%; border-collapse: collapse; font-size: 15px; line-height: 1.5; font-variant-numeric: tabular-nums; }
:is(.entry-content, .is-root-container) th,
:is(.entry-content, .is-root-container) td { padding: 10px 12px; border: 0; border-bottom: 1px solid var(--border); text-align: left; vertical-align: top; }
:is(.entry-content, .is-root-container) thead th { border-bottom: 2px solid var(--border-strong); color: var(--text); font: 700 12px/1.3 var(--font-mono); letter-spacing: .06em; text-transform: uppercase; }
:is(.entry-content, .is-root-container) .wp-block-table.is-style-stripes tbody tr:nth-child(odd) { background: var(--surface-2); }
:is(.entry-content, .is-root-container) .wp-block-table.is-style-stripes { border-bottom: 0; }
:is(.entry-content, .is-root-container) table caption,
:is(.entry-content, .is-root-container) .wp-block-table figcaption { margin-top: 8px; color: var(--muted); font-size: 13.5px; text-align: left; }

/* Images, figures, légendes */
:is(.entry-content, .is-root-container) figure { margin-inline: 0; }
:is(.entry-content, .is-root-container) img { height: auto; }
:is(.entry-content, .is-root-container) .wp-block-image img { border-radius: var(--radius-sm); }
:is(.entry-content, .is-root-container) figcaption,
:is(.entry-content, .is-root-container) .wp-element-caption { margin-top: 8px; color: var(--muted); font-size: 13.5px; line-height: 1.5; text-align: left; }

/* Alignements */
:is(.entry-content, .is-root-container) .aligncenter { margin-inline: auto; text-align: center; }
:is(.entry-content, .is-root-container) .aligncenter figcaption { text-align: center; }
@media (min-width: 640px) {
  :is(.entry-content, .is-root-container) .alignleft { float: left; max-width: 50%; margin: .3em 1.4em .8em 0; }
  :is(.entry-content, .is-root-container) .alignright { float: right; max-width: 50%; margin: .3em 0 .8em 1.4em; }
  :is(.entry-content, .is-root-container) :is(.alignleft, .alignright) + * { margin-top: 0; }
}
.entry-content::after { content: ''; display: table; clear: both; }
.entry-content > :is(.alignwide, .alignfull) { max-width: none; width: 100%; margin-inline: 0; }
@media (max-width: 1023px) {
  /* Mobile/tablette : le conteneur est centré et pleine largeur, on peut déborder jusqu'aux bords */
  .entry-content > .alignfull { width: 100vw; margin-inline: calc(50% - 50vw); }
  .entry-content > .alignfull img { border-radius: 0; }
}

/* Embeds : responsive (add_theme_support responsive-embeds) + réserve contre le CLS */
:is(.entry-content, .is-root-container) .wp-block-embed { margin-inline: 0; }
:is(.entry-content, .is-root-container) .wp-block-embed__wrapper iframe { max-width: 100%; border-radius: var(--radius-sm); }
:is(.entry-content, .is-root-container) .wp-block-embed-x .wp-block-embed__wrapper,
:is(.entry-content, .is-root-container) .wp-block-embed-twitter .wp-block-embed__wrapper { min-height: 220px; max-width: 560px; }
:is(.entry-content, .is-root-container) .twitter-tweet { margin-inline: 0 !important; }

/* Code */
:is(.entry-content, .is-root-container) code,
:is(.entry-content, .is-root-container) kbd { padding: 1px 5px; border-radius: 4px; background: var(--surface-2); font: 500 .86em/1.5 var(--font-mono); }
:is(.entry-content, .is-root-container) pre,
:is(.entry-content, .is-root-container) .wp-block-code {
  overflow-x: auto;
  padding: 16px 18px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--surface-2);
  color: var(--text);
  font: 500 14px/1.6 var(--font-mono);
}
:is(.entry-content, .is-root-container) pre code { padding: 0; background: none; font-size: inherit; }

/* Séparateur, boutons, détails, groupes */
:is(.entry-content, .is-root-container) hr,
:is(.entry-content, .is-root-container) .wp-block-separator { margin-block: 2em; border: 0; border-top: 1px solid var(--border-strong); opacity: 1; }
:is(.entry-content, .is-root-container) .wp-block-button__link {
  display: inline-flex; align-items: center; min-height: 46px; padding: 0 20px;
  border-radius: var(--radius-sm); background: var(--accent); color: var(--on-accent);
  font: 700 15px/1 var(--font-sans); text-decoration: none;
}
:is(.entry-content, .is-root-container) .is-style-outline .wp-block-button__link { background: transparent; border: 1px solid var(--accent); color: var(--accent); }
:is(.entry-content, .is-root-container) details { padding: 14px 16px; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface); }
:is(.entry-content, .is-root-container) summary { cursor: pointer; color: var(--text); font-weight: 600; }
:is(.entry-content, .is-root-container) details[open] summary { margin-bottom: .6em; }
:is(.entry-content, .is-root-container) .wp-block-group.has-background { padding: 20px; border-radius: var(--radius); }
:is(.entry-content, .is-root-container) .wp-block-columns { gap: 24px; }
:is(.entry-content, .is-root-container) .wp-block-gallery { gap: 8px; }
:is(.entry-content, .is-root-container) mark { padding: 0 .15em; border-radius: 3px; background: var(--sev-important-bg); color: var(--text); }

/* ==========================================================================
   3. Blocs de l'extension « cryptoexplor-editorial »
   Le HTML est produit par l'extension ; le thème ne fait que le styliser.
   Classes stables (contrat) : .ce-update, .ce-sources-block / .ce-sources,
   sections du modèle « Incident » : .ce-facts, .ce-facts__known, .ce-facts__unknown, .ce-todo.
   ========================================================================== */

/* Bloc « Mise à jour » : <aside.ce-update><p.ce-update__meta><strong/> <time/> · auteur</p><div.ce-update__content/></aside> */
.ce-update {
  display: grid; gap: 6px;
  padding: 14px 18px 16px 20px;
  background: var(--accent-soft);
  border: 1px solid color-mix(in srgb, var(--accent) 30%, transparent);
  border-left: 4px solid var(--accent-deco);
  border-radius: var(--radius);
  color: var(--text);
  font-size: 16px; line-height: 1.6;
}
.ce-update > * { margin: 0; }
.ce-update__meta { color: var(--muted); font: 500 12.5px/1.5 var(--font-mono); }
.ce-update__meta strong { margin-right: 6px; color: var(--accent); font-weight: 700; letter-spacing: .07em; text-transform: uppercase; }
.ce-update__meta strong::before { content: '↻ '; }
.ce-update__meta time { color: var(--text); font-weight: 700; }
.ce-update__content > * + * { margin-top: .6em; }
.ce-update__content a { color: var(--accent); }

/* Bloc « Sources » : même rendu que la liste .sources de la maquette */
.ce-sources-block { display: grid; gap: 14px; }
.ce-sources-block > .ce-sources__title { margin: 0; scroll-margin-top: calc(var(--header-h) + 24px); }
.entry-content > .ce-sources-block { margin-top: 2em; }
:is(.entry-content, .is-root-container) ol.ce-sources { list-style: none; padding: 0; display: grid; gap: 12px; counter-reset: src; }
.ce-sources__item {
  counter-increment: src;
  display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 2px 12px;
  margin: 0 !important;
  padding: 14px 16px;
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius);
  font-size: 15.5px; line-height: 1.5;
}
.ce-sources__item::before { content: '[' counter(src) ']'; grid-row: 1 / span 3; color: var(--accent); font: 700 13px/1.7 var(--font-mono); }
.ce-sources__item > * { grid-column: 2; }
:is(.entry-content, .is-root-container) .ce-sources__link { color: var(--text); font-weight: 600; overflow-wrap: anywhere; }
:is(.entry-content, .is-root-container) .ce-sources__link:hover { color: var(--accent); }
.ce-sources__note { color: var(--muted); font-size: 14px; line-height: 1.5; }
.ce-sources__date { color: var(--muted); font: 500 12.5px/1.5 var(--font-mono); }
.ce-sources__date time { color: var(--text-2); }

/* Modèle « Incident » (groupes natifs avec classes) — rendu des encadrés .facts / .todo de la maquette */
.ce-facts { padding: 0; overflow: hidden; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); font-size: 16px; line-height: 1.6; }
.ce-facts > .wp-block-columns, .ce-facts.wp-block-columns { gap: 0 !important; margin: 0; }
.ce-facts .wp-block-column { margin: 0 !important; }
.ce-facts__known, .ce-facts__unknown { padding: 20px; }
.ce-facts__unknown { background: var(--surface-2); }
.ce-facts .wp-block-column + .wp-block-column .ce-facts__unknown,
.ce-facts__known + .ce-facts__unknown { border-top: 1px solid var(--border); }
@media (min-width: 782px) {
  .ce-facts .wp-block-column + .wp-block-column .ce-facts__unknown,
  .ce-facts .wp-block-column + .ce-facts__unknown.wp-block-column { border-top: 0; border-left: 1px solid var(--border); height: 100%; }
}
.ce-facts > :is(h2, h3):first-child { padding: 16px 20px 0; }
:is(.ce-facts__known, .ce-facts__unknown) > :is(h2, h3, h4) { display: flex; align-items: center; gap: 8px; margin: 0 0 12px; font: 700 13px/1.3 var(--font-mono); letter-spacing: .07em; text-transform: uppercase; }
.ce-facts__known > :is(h2, h3, h4) { color: var(--status-confirmed); }
.ce-facts__unknown > :is(h2, h3, h4) { color: var(--status-pending); }
:is(.entry-content, .is-root-container) :is(.ce-facts__known, .ce-facts__unknown) :is(ul, ol) { list-style: none; padding: 0; display: grid; gap: 10px; margin: 0; }
:is(.ce-facts__known, .ce-facts__unknown) li { position: relative; margin: 0 !important; padding-left: 22px; }
.ce-facts__known li::before { content: '✓'; position: absolute; left: 0; color: var(--status-confirmed); font-weight: 700; }
.ce-facts__unknown li::before { content: '?'; position: absolute; left: 2px; color: var(--status-pending); font: 700 15px var(--font-mono); }

.ce-todo { padding: 20px; border-radius: var(--radius); background: var(--accent-soft); border: 1px solid color-mix(in srgb, var(--accent) 35%, transparent); border-left: 4px solid var(--accent); color: var(--text); font-size: 16px; line-height: 1.6; }
.ce-todo > * { margin-top: 0; }
.ce-todo > :is(h2, h3, h4):first-child { margin: 0 0 14px; font: 700 13px/1.3 var(--font-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--text); }
.ce-todo > :is(h2, h3, h4):first-child::before { content: '// '; color: var(--accent); }
:is(.entry-content, .is-root-container) .ce-todo ol { list-style: none; padding: 0; counter-reset: todo; display: grid; gap: 14px; }
.ce-todo ol > li { position: relative; margin: 0 !important; padding-left: 36px; counter-increment: todo; }
.ce-todo ol > li::before {
  content: counter(todo);
  position: absolute; left: 0; top: 1px;
  display: grid; place-items: center;
  width: 24px; height: 24px; border-radius: 50%;
  background: var(--accent); color: var(--on-accent);
  font: 700 12px/1 var(--font-mono);
}
.ce-todo ul { padding-left: 1.2em; }

/* ==========================================================================
   4. Couleurs de la palette (theme.json) : suivent le mode sombre
   WordPress génère .has-{slug}-color avec des valeurs fixes ; on les relie aux jetons.
   ========================================================================== */
.has-bg-color { color: var(--bg) !important; }
.has-surface-color { color: var(--surface) !important; }
.has-surface-2-color { color: var(--surface-2) !important; }
.has-ink-color { color: var(--text) !important; }
.has-ink-2-color { color: var(--text-2) !important; }
.has-muted-color { color: var(--muted) !important; }
.has-accent-color { color: var(--accent) !important; }
.has-accent-soft-color { color: var(--accent-soft) !important; }
.has-critical-color { color: var(--sev-critical) !important; }
.has-important-color { color: var(--sev-important) !important; }
.has-info-color { color: var(--sev-info) !important; }
.has-band-color { color: var(--band-bg) !important; }
.has-band-text-color { color: var(--band-text) !important; }
.has-bg-background-color { background-color: var(--bg) !important; }
.has-surface-background-color { background-color: var(--surface) !important; }
.has-surface-2-background-color { background-color: var(--surface-2) !important; }
.has-ink-background-color { background-color: var(--text) !important; }
.has-accent-background-color { background-color: var(--accent) !important; }
.has-accent-soft-background-color { background-color: var(--accent-soft) !important; }
.has-critical-bg-background-color { background-color: var(--sev-critical-bg) !important; }
.has-important-bg-background-color { background-color: var(--sev-important-bg) !important; }
.has-info-bg-background-color { background-color: var(--sev-info-bg) !important; }
.has-band-background-color { background-color: var(--band-bg) !important; }
.has-border-border-color { border-color: var(--border) !important; }
.has-accent-border-color { border-color: var(--accent) !important; }