/* ==========================================================
   Thème personnalisé — palette « tableur sombre »
   Fond anthracite, accent corail, cellules brun-rosé.
   Chargé après built/screen.css (voir default.hbs).
   ========================================================== */

html:root {
    --c-bg: #1c1c1e;          /* fond principal */
    --c-bg-deep: #111112;     /* bandeau / pied de page */
    --c-surface: #242426;     /* cartes, lignes de total */
    --c-surface-2: #2c2c2f;
    --c-cell: #33292a;        /* cellules brun-rosé */
    --c-chip: #3a3b3f;        /* étiquette grise (« Essentiels ») */
    --c-border: #3a3a3d;
    --c-rule: #4a4a4e;        /* filets pointillés */
    --c-text: #f2f2f2;
    --c-text-soft: #c9c9cc;
    --c-muted: #9a9a9f;
    --c-coral: #f07a6a;       /* accent : « Sam me doit », Valeur nette */
    --c-coral-strong: #d4574a;/* pastille pleine (SAM) */
    --c-pink: #f6c4b8;        /* texte rosé des cellules */
    --c-green: #4fd18b;

    --ghost-accent-color: var(--c-coral);
    --color-darkmode: var(--c-bg);
    --color-darkgrey: var(--c-bg-deep);
    --color-secondary-text: var(--c-muted);
    --color-border: var(--c-border);
    --color-wash: var(--c-surface-2);
    --color-green: var(--c-green);
    --color-red: var(--c-coral);

    --font-sans: "Noto Sans", "Segoe UI", -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", sans-serif;
}

html.dark-mode body {
    background: var(--c-bg);
    color: var(--c-text-soft);
    font-family: var(--font-sans);
}

::selection {
    background: var(--c-coral-strong);
    color: #fff;
}

/* ---------- En-tête & navigation ---------- */

html.dark-mode body .gh-head,
html.dark-mode body:not(.has-cover) .gh-head {
    background: var(--c-bg-deep);
    color: var(--c-text);
    border-bottom: 1px solid var(--c-rule);
}

.gh-head-menu a,
.gh-head-link {
    color: var(--c-text-soft);
}

.gh-head-menu a:hover,
.gh-head-link:hover,
.gh-head-menu .nav-current a {
    color: var(--c-coral);
    opacity: 1;
}

.gh-head-button,
.gh-button,
.footer-cta-button span,
.gh-content .kg-button-card a.kg-btn {
    background: var(--c-coral-strong);
    color: #fff;
}

.gh-head-button:hover,
.gh-button:hover {
    background: var(--c-coral);
    opacity: 1;
}

/* ---------- Bannière du site ---------- */

html.dark-mode .site-header-content,
.site-title {
    color: var(--c-text);
    font-weight: 500;
    letter-spacing: -0.01em;
}

.site-description {
    color: var(--c-muted);
}

/* ---------- Fil d'articles ---------- */

.post-card {
    border-bottom: 1px dotted var(--c-rule);
}

html.dark-mode .post-card-title {
    color: var(--c-text);
    font-weight: 600;
}

.post-card-content-link:hover .post-card-title {
    color: var(--c-coral);
}

html.dark-mode .post-card-excerpt {
    color: var(--c-muted);
}

.post-card-primary-tag,
.post-card-tags,
.article-tag a {
    color: var(--c-coral) !important;
    text-transform: none;
    letter-spacing: 0;
    font-weight: 500;
}

html.dark-mode .post-card-image,
html.dark-mode .post-full-image {
    background: var(--c-surface);
}

html.dark-mode img {
    opacity: 1;
}

.post-card-featured {
    color: var(--c-coral) !important;
}

/* ---------- Article ---------- */

html.dark-mode .article-title,
html.dark-mode .gh-content > [id] {
    color: var(--c-text);
}

html.dark-mode .article-excerpt,
html.dark-mode .byline-meta-content,
html.dark-mode figcaption {
    color: var(--c-muted);
}

html.dark-mode .gh-content {
    color: var(--c-text-soft);
}

:where(html.dark-mode) .gh-content a,
html.dark-mode .article-byline-meta .author-name a {
    color: var(--c-coral);
    text-decoration-color: rgba(240, 122, 106, 0.4);
}

:where(html.dark-mode) .gh-content a:hover {
    color: var(--c-pink);
}

html.dark-mode .gh-content blockquote:not([class]) {
    border-left-color: var(--c-coral);
    background: var(--c-cell);
    color: var(--c-pink);
    padding: 0.8em 1.2em;
}

html.dark-mode .gh-content :not(pre) > code {
    background: var(--c-cell);
    border-color: var(--c-border);
    color: var(--c-pink);
}

html.dark-mode .gh-content pre,
html.dark-mode .gh-content pre code {
    background: var(--c-bg-deep);
    color: var(--c-text-soft);
}

html.dark-mode .gh-content pre {
    border: 1px solid var(--c-border);
}

html.dark-mode mark {
    background-color: var(--c-cell);
    color: var(--c-pink);
}

html.dark-mode hr {
    border-top: 1px dotted var(--c-rule);
}

html.dark-mode .gh-content hr:after {
    background: var(--c-rule);
    box-shadow: var(--c-bg) 0 0 0 5px;
}

/* Tableaux façon tableur */
html.dark-mode .gh-content table:not(.gist table) {
    font-variant-numeric: tabular-nums;
    border-top: 2px solid var(--c-coral);
}

html.dark-mode .gh-content table:not(.gist table) th {
    background: var(--c-bg);
    color: var(--c-muted);
    font-weight: 500;
    text-transform: none;
    letter-spacing: 0;
    border: 0;
    border-bottom: 1px solid var(--c-rule);
}

html.dark-mode .gh-content table:not(.gist table) td {
    border: 0;
    border-bottom: 1px dotted var(--c-rule);
    color: var(--c-text);
}

html.dark-mode .gh-content table:not(.gist table) td:first-child,
html.dark-mode .gh-content table:not(.gist table) td:last-child {
    background-image: none;
}

html.dark-mode .gh-content table:not(.gist table) tr:last-child td {
    background: var(--c-surface);
    border-top: 1px solid var(--c-text-soft);
    font-weight: 600;
}

/* ---------- Cartes de contenu Ghost ---------- */

html.dark-mode .kg-callout-card,
html.dark-mode .kg-toggle-card,
html.dark-mode .kg-bookmark-container,
html.dark-mode .kg-product-card-container {
    background: var(--c-surface) !important;
    border-color: var(--c-border) !important;
    color: var(--c-text-soft);
}

html.dark-mode .kg-callout-card-accent {
    background: var(--c-coral-strong) !important;
}

/* ---------- Auteurs ---------- */

html.dark-mode .author-avatar {
    border-color: var(--c-bg);
    background-color: var(--c-surface);
}

/* ---------- Pagination ---------- */

html.dark-mode .pagination a {
    color: var(--c-text);
    text-decoration: underline;
    text-underline-offset: 3px;
}

html.dark-mode .pagination a:hover {
    color: var(--c-coral);
}

/* ---------- Appel à l'abonnement ---------- */

.footer-cta {
    background: var(--c-bg);
}

.footer-cta-title {
    color: var(--c-text);
}

.footer-cta-button {
    background: var(--c-surface);
    border: 1px solid var(--c-border);
    color: var(--c-muted);
}

.footer-cta-button:hover {
    border-color: var(--c-coral);
}

/* ---------- Pied de page ---------- */

.site-footer {
    background: var(--c-bg-deep);
    color: var(--c-muted);
    border-top: 1px solid var(--c-rule);
}

.site-footer a,
.site-footer .site-footer-nav a {
    color: var(--c-text-soft);
}

.site-footer a:hover {
    color: var(--c-coral);
}

/* ---------- Divers ---------- */

html.dark-mode kbd {
    background: var(--c-chip);
    border-color: var(--c-border);
    color: var(--c-text);
}

.read-more-wrap .post-card-title {
    color: var(--c-text);
}

/* Classes utilitaires réutilisables dans le contenu (bloc HTML) */
.is-positive { color: var(--c-green); }
.is-negative { color: var(--c-coral); }
.chip {
    display: inline-block;
    padding: 0.1em 0.6em;
    background: var(--c-chip);
    color: var(--c-text);
}
.chip--accent {
    background: var(--c-coral-strong);
    color: #fff;
}
.cell-highlight {
    background: var(--c-cell);
    color: var(--c-pink);
}