/*
 * HCKEditor — styles du CONTENU (articles).
 * À charger aussi sur les pages publiques : <div class="hck-content">{!! $article->contenu !!}</div>
 * La classe est doublée (.hck-content.hck-content) pour l'emporter sur les styles génériques du site hôte
 * (p, ul, table… de Bootstrap, Tailwind, thèmes) sans recourir à !important.
 */
.hck-content.hck-content {
  font-family: var(--hck-content-font, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif);
  font-size: var(--hck-content-size, 16px);
  line-height: 1.65;
  color: var(--hck-text, #0f172a);
  overflow-wrap: break-word;
  word-break: normal;
}
.hck-content.hck-content::after { content: ""; display: table; clear: both; }
/* Les éléments de l'article héritent de la typographie de l'article, pas des règles génériques du site. */
.hck-content.hck-content * { font-family: inherit; letter-spacing: inherit; text-transform: inherit; }

.hck-content.hck-content > :first-child { margin-top: 0; }
.hck-content.hck-content p { margin: 0 0 1em; padding: 0; font: inherit; color: inherit; }
.hck-content.hck-content h1,
.hck-content.hck-content h2,
.hck-content.hck-content h3,
.hck-content.hck-content h4,
.hck-content.hck-content h5,
.hck-content.hck-content h6 {
  margin: 1.4em 0 0.6em; padding: 0; font-family: inherit; font-weight: 700; line-height: 1.25;
  color: inherit; text-transform: none; letter-spacing: normal;
}
.hck-content.hck-content h1 { font-size: 2em; }
.hck-content.hck-content h2 { font-size: 1.6em; }
.hck-content.hck-content h3 { font-size: 1.3em; }
.hck-content.hck-content h4 { font-size: 1.1em; }
.hck-content.hck-content h5,
.hck-content.hck-content h6 { font-size: 1em; }

.hck-content.hck-content strong,
.hck-content.hck-content b { font-weight: 700; }
.hck-content.hck-content em,
.hck-content.hck-content i { font-style: italic; }
.hck-content.hck-content u { text-decoration: underline; }
.hck-content.hck-content s { text-decoration: line-through; }
.hck-content.hck-content a { color: var(--hck-link, #2563eb); text-decoration: underline; text-underline-offset: 2px; }
.hck-content.hck-content mark { padding: 0.05em 0.15em; border-radius: 3px; color: inherit; }

.hck-content.hck-content ul,
.hck-content.hck-content ol { margin: 0 0 1em; padding: 0 0 0 1.6em; }
.hck-content.hck-content ul { list-style: disc; }
.hck-content.hck-content ol { list-style: decimal; }
.hck-content.hck-content ul ul { list-style: circle; }
.hck-content.hck-content ul ul ul { list-style: square; }
.hck-content.hck-content ol ol { list-style: lower-alpha; }
.hck-content.hck-content li { display: list-item; margin: 0.25em 0; padding: 0; }
.hck-content.hck-content li > p { margin: 0; }
.hck-content.hck-content li > ul,
.hck-content.hck-content li > ol { margin: 0.25em 0; }

.hck-content.hck-content blockquote {
  margin: 1.2em 0; padding: 0.6em 1.2em; border: 0; border-left: 4px solid var(--hck-primary, #2563eb);
  background: var(--hck-surface, #f8fafc); color: inherit; font-style: italic;
}
.hck-content.hck-content blockquote p:last-child { margin-bottom: 0; }

.hck-content.hck-content code {
  padding: 0.15em 0.35em; border-radius: 4px; background: #f1f5f9; color: #be123c;
  font-family: var(--hck-mono, ui-monospace, Consolas, monospace); font-size: 0.9em;
}
.hck-content.hck-content pre {
  margin: 0 0 1em; padding: 0.9em 1.1em; border-radius: 8px; background: #0f172a; color: #e2e8f0;
  overflow-x: auto; white-space: pre; font-family: var(--hck-mono, ui-monospace, Consolas, monospace); font-size: 0.9em; line-height: 1.5;
}
.hck-content.hck-content pre code { padding: 0; background: none; color: inherit; font-size: inherit; }

.hck-content.hck-content hr { margin: 2em 0; border: 0; border-top: 2px solid var(--hck-border, #e2e8f0); height: 0; }

.hck-content.hck-content img { max-width: 100%; height: auto; border: 0; vertical-align: middle; }
.hck-content.hck-content img[data-align="center"] { display: block; margin-left: auto; margin-right: auto; }
.hck-content.hck-content img[data-align="left"] { float: left; margin: 0 1em 1em 0; }
.hck-content.hck-content img[data-align="right"] { float: right; margin: 0 0 1em 1em; }

.hck-content.hck-content table {
  width: 100%; margin: 0 0 1em; border-collapse: collapse; border-spacing: 0; table-layout: auto;
  border: 1px solid var(--hck-border, #e2e8f0); font-size: 0.95em;
}
.hck-content.hck-content th,
.hck-content.hck-content td {
  padding: 0.5em 0.75em; border: 1px solid var(--hck-border, #e2e8f0); vertical-align: top; text-align: left;
}
.hck-content.hck-content th { background: var(--hck-surface, #f8fafc); font-weight: 700; }
.hck-content.hck-content td > p,
.hck-content.hck-content th > p { margin: 0; }
/* Résiste aux « tableaux responsive » des sites hôtes (tr/td en blocs, thead masqué, étiquettes ::before). */
.hck-content.hck-content thead {
  position: static; width: auto; height: auto; margin: 0; padding: 0; overflow: visible; clip: auto; border: 0;
}
.hck-content.hck-content tr { display: table-row; margin: 0; border: 0; }
.hck-content.hck-content th,
.hck-content.hck-content td { display: table-cell; font-size: inherit; }
.hck-content.hck-content th::before,
.hck-content.hck-content td::before { content: none; }

.hck-content.hck-content sup { font-size: 0.75em; vertical-align: super; line-height: 0; }
.hck-content.hck-content sub { font-size: 0.75em; vertical-align: sub; line-height: 0; }

/* ── Styles (menu « Styles ») */
.hck-content.hck-content .hck-box { padding: 0.8em 1em; border-left: 4px solid; border-radius: 6px; }
.hck-content.hck-content .hck-box--info { background: #eff6ff; border-color: #2563eb; }
.hck-content.hck-content .hck-box--warning { background: #fffbeb; border-color: #d97706; }
.hck-content.hck-content .hck-box--success { background: #f0fdf4; border-color: #16a34a; }
.hck-content.hck-content .hck-lead { font-size: 1.2em; line-height: 1.5; color: #334155; }
.hck-content.hck-content .hck-small { font-size: 0.85em; color: #64748b; }
.hck-content.hck-content .hck-title-line { padding-bottom: 0.3em; border-bottom: 3px solid var(--hck-primary, #2563eb); }
.hck-content.hck-content blockquote.hck-pullquote {
  border: 0; background: none; padding: 0.5em 1.5em; text-align: center; font-size: 1.35em; color: #334155;
}
.hck-content.hck-content .hck-marker { background: #fef08a; padding: 0 0.1em; }
.hck-content.hck-content .hck-muted { color: #94a3b8; }
.hck-content.hck-content .hck-badge {
  display: inline-block; padding: 0.05em 0.5em; border-radius: 999px; background: var(--hck-primary, #2563eb);
  color: #fff; font-size: 0.8em; font-weight: 600; vertical-align: 0.1em;
}

/* ── Listes : multiniveau (1.1.1) et tâches */
.hck-content.hck-content ol.hck-multilevel,
.hck-content.hck-content ol.hck-multilevel ol { list-style: none; counter-reset: hck-ml; padding-left: 0.4em; }
.hck-content.hck-content ol.hck-multilevel ol { padding-left: 1.6em; }
.hck-content.hck-content ol.hck-multilevel li { counter-increment: hck-ml; }
.hck-content.hck-content ol.hck-multilevel li > p:first-child::before {
  content: counters(hck-ml, ".") ". "; font-weight: 600; margin-right: 0.15em;
}
.hck-content.hck-content ul[data-type="taskList"] { list-style: none; padding-left: 0.2em; }
.hck-content.hck-content ul[data-type="taskList"] li { display: flex; align-items: flex-start; gap: 0.5em; }
.hck-content.hck-content ul[data-type="taskList"] li > label { flex: none; margin-top: 0.25em; user-select: none; }
.hck-content.hck-content ul[data-type="taskList"] li > label input { width: 1em; height: 1em; margin: 0; accent-color: var(--hck-primary, #2563eb); }
.hck-content.hck-content ul[data-type="taskList"] li > div { flex: 1; min-width: 0; }
.hck-content.hck-content ul[data-type="taskList"] li[data-checked="true"] > div { color: #94a3b8; text-decoration: line-through; }

/* ── Liens vers fichiers */
.hck-content.hck-content a.hck-file::before { content: "📎 "; text-decoration: none; display: inline-block; }

/* ── Notes de bas de page */
.hck-content.hck-content sup.hck-fn-ref a { text-decoration: none; font-weight: 600; padding: 0 0.1em; }
.hck-content.hck-content sup.hck-fn-ref a::before { content: "["; }
.hck-content.hck-content sup.hck-fn-ref a::after { content: "]"; }
.hck-content.hck-content section.hck-footnotes { margin-top: 2em; padding-top: 0.8em; border-top: 1px solid var(--hck-border, #e2e8f0); font-size: 0.9em; }
.hck-content.hck-content section.hck-footnotes::before { content: var(--hck-footnotes-label, "Notes"); display: block; font-weight: 700; margin-bottom: 0.4em; }
.hck-content.hck-content section.hck-footnotes ol { list-style: decimal; margin: 0; }
.hck-content.hck-content section.hck-footnotes li > p { margin: 0; }

/* ── Table des matières */
.hck-content.hck-content nav.hck-toc {
  margin: 0 0 1.5em; padding: 1em 1.2em; border: 1px solid var(--hck-border, #e2e8f0); border-radius: 8px;
  background: var(--hck-surface, #f8fafc);
}
.hck-content.hck-content nav.hck-toc .hck-toc__title { margin: 0 0 0.5em; font-weight: 700; }
.hck-content.hck-content nav.hck-toc ul { list-style: none; margin: 0; padding: 0; }
.hck-content.hck-content nav.hck-toc li { margin: 0.2em 0; }
.hck-content.hck-content nav.hck-toc .hck-toc__l2 { padding-left: 1em; }
.hck-content.hck-content nav.hck-toc .hck-toc__l3 { padding-left: 2em; }
.hck-content.hck-content nav.hck-toc .hck-toc__l4,
.hck-content.hck-content nav.hck-toc .hck-toc__l5,
.hck-content.hck-content nav.hck-toc .hck-toc__l6 { padding-left: 3em; font-size: 0.95em; }
.hck-content.hck-content nav.hck-toc a { text-decoration: none; }

/* ── Vidéos (16:9, responsives) */
.hck-content.hck-content .hck-embed { position: relative; width: 100%; margin: 0 0 1em; padding-top: 56.25%; background: #000; border-radius: 6px; overflow: hidden; }
.hck-content.hck-content .hck-embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* ── Saut de page (invisible à l'écran, actif à l'impression) */
.hck-content.hck-content .hck-page-break { height: 0; margin: 0; border: 0; }
@media print {
  .hck-content.hck-content .hck-page-break { break-after: page; page-break-after: always; }
}

/* ── Signets : ancres invisibles */
.hck-content.hck-content a.hck-bookmark { display: inline; text-decoration: none; }

/* Sur petit écran, les images flottantes passent en pleine ligne (le style en ligne impose !important). */
@media (max-width: 640px) {
  .hck-content.hck-content img[data-align="left"],
  .hck-content.hck-content img[data-align="right"] { float: none !important; display: block !important; margin: 0 auto 1em !important; }
  .hck-content.hck-content table { display: block; overflow-x: auto; }
}
