/* Papycha Dark Mode — frontend */

html {
    transition: background-color 160ms ease;
}

html.papycha-dark {
    color-scheme: dark;
    background-color: var(--pdm-bg);
}

html.papycha-dark body,
html.papycha-dark #page,
html.papycha-dark .site,
html.papycha-dark .site-content,
html.papycha-dark #content,
html.papycha-dark #primary,
html.papycha-dark .content-area,
html.papycha-dark #main,
html.papycha-dark .site-main {
    background-color: var(--pdm-bg) !important;
    color: var(--pdm-text) !important;
}

html.papycha-dark :where(
    .entry-content,
    .entry-summary,
    .page-content,
    article,
    .widget,
    .sidebar,
    .widget-area
) {
    color: var(--pdm-text);
}

html.papycha-dark :where(
    h1, h2, h3, h4, h5, h6,
    p, li, dt, dd, figcaption,
    label, legend
) {
    color: inherit;
}

html.papycha-dark :where(a) {
    color: var(--pdm-accent);
}

html.papycha-dark :where(a:hover, a:focus) {
    color: var(--pdm-accent-hover);
}

html.papycha-dark :where(
    input:not([type="button"]):not([type="submit"]):not([type="reset"]),
    textarea,
    select
) {
    background-color: var(--pdm-input) !important;
    color: var(--pdm-text) !important;
    border-color: var(--pdm-border) !important;
}

html.papycha-dark :where(
    input::placeholder,
    textarea::placeholder
) {
    color: var(--pdm-muted) !important;
    opacity: .82;
}

html.papycha-dark :where(
    table,
    th,
    td,
    .wp-block-table table
) {
    border-color: var(--pdm-border) !important;
}

html.papycha-dark :where(
    thead,
    tfoot
) {
    background-color: var(--pdm-surface-alt) !important;
}

html.papycha-dark :where(
    blockquote,
    pre,
    code,
    .wp-block-code,
    .wp-block-preformatted
) {
    border-color: var(--pdm-border) !important;
}

html.papycha-dark :where(pre, .wp-block-code, .wp-block-preformatted) {
    background-color: var(--pdm-surface-alt) !important;
    color: var(--pdm-text) !important;
}

/* Surfaces converties automatiquement par JS */
html.papycha-dark .pdm-auto-surface {
    background-color: var(--pdm-surface) !important;
    color: var(--pdm-text) !important;
    border-color: var(--pdm-border) !important;
}

html.papycha-dark .pdm-auto-surface.pdm-auto-surface--alt {
    background-color: var(--pdm-surface-alt) !important;
}

/* Ne jamais filtrer les médias */
html.papycha-dark :where(img, picture, video, canvas, svg, iframe) {
    filter: none !important;
}

/* Les images de fond restent intactes */
html.papycha-dark :where(
    .site-header,
    .custom-header,
    .header-image,
    [style*="background-image"]
) {
    background-image: revert;
}

/* Bouton flottant injecté via wp_footer */
.papycha-dark-toggle {
    position: fixed;
    z-index: 999999;
    min-width: 44px;
    height: 38px;
    padding: 0 12px;
    border: 1px solid rgba(0, 0, 0, .15);
    border-radius: 999px;
    background: #f7f7f5;
    color: #4b5047;
    box-shadow: 0 4px 16px rgba(0, 0, 0, .17);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font: 600 12px/1 Arial, Helvetica, sans-serif;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition:
        background-color 150ms ease,
        color 150ms ease,
        border-color 150ms ease,
        transform 120ms ease,
        box-shadow 150ms ease;
}

.papycha-dark-toggle:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 19px rgba(0, 0, 0, .20);
}

.papycha-dark-toggle:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--pdm-accent) 45%, transparent);
    outline-offset: 3px;
}

html.papycha-dark .papycha-dark-toggle {
    background: var(--pdm-toggle-bg);
    color: var(--pdm-toggle-fg);
    border-color: var(--pdm-border);
}

.pdm-toggle-icon {
    width: 17px;
    height: 17px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.pdm-toggle-icon svg {
    width: 17px;
    height: 17px;
}

.pdm-toggle-icon--moon svg {
    fill: currentColor;
}

.pdm-toggle-icon--sun {
    display: none;
}

.pdm-toggle-icon--sun svg {
    fill: currentColor;
}

.pdm-toggle-icon--sun svg path {
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
}

html.papycha-dark .pdm-toggle-icon--moon {
    display: none;
}

html.papycha-dark .pdm-toggle-icon--sun {
    display: inline-flex;
}

.papycha-dark-toggle--round,
.papycha-dark-toggle--icon-only {
    width: 40px;
    min-width: 40px !important;
    padding: 0 !important;
}

.papycha-dark-toggle--icon-only .pdm-toggle-label {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

@media (max-width: 600px) {
    .papycha-dark-toggle {
        height: 36px;
        padding-inline: 10px;
        font-size: 11px;
    }

    .papycha-dark-toggle--pill:not(.papycha-dark-toggle--icon-only) .pdm-toggle-label {
        max-width: 84px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}

@media (prefers-reduced-motion: reduce) {
    html,
    .papycha-dark-toggle {
        transition: none !important;
    }
}


/* Intégration dans le footer / widget Stargazer */
.papycha-dark-toggle--embedded {
    position: relative !important;
    inset: auto !important;
    margin: 0;
    vertical-align: middle;
}

.papycha-dark-toggle--floating {
    position: fixed;
}

/* Stargazer et wrappers WordPress courants */
html.papycha-dark :where(
    #container,
    #main,
    #main-container,
    #content,
    #content > .wrap,
    #sidebar-primary,
    #sidebar-subsidiary,
    #sidebar-footer,
    #footer,
    #footer .wrap,
    .wrap,
    .layout-1c,
    .layout-2c-l,
    .layout-2c-r,
    .singular,
    .home
) {
    color: var(--pdm-text);
}

/* Le footer sombre reste cohérent sans toucher aux images de fond du thème */
html.papycha-dark :where(#footer, #footer .wrap, .site-footer) {
    border-color: var(--pdm-border) !important;
}

/* Classes appliquées par le scanner JS à tout bloc réellement clair */
html.papycha-dark .pdm-auto-text {
    color: var(--pdm-text) !important;
}


/* =========================================================
   Papycha Dark Mode 1.2
   Corrections renforcées Stargazer + contenus Papycha
   ========================================================= */

/* 1) TABLEAUX
   Les anciens tableaux Papycha ont souvent leur propre fond blanc.
   On les force donc explicitement en mode sombre. */
html.papycha-dark :where(
    table,
    table tbody,
    table thead,
    table tfoot,
    table tr,
    table th,
    table td,
    .wp-block-table,
    .wp-block-table table,
    .wp-block-table tbody,
    .wp-block-table tr,
    .wp-block-table th,
    .wp-block-table td
) {
    background-color: var(--pdm-surface) !important;
    color: var(--pdm-text) !important;
    border-color: var(--pdm-border) !important;
}

html.papycha-dark :where(
    table thead,
    table tfoot,
    table th
) {
    background-color: var(--pdm-surface-alt) !important;
}

/* Liens contenus dans les tableaux */
html.papycha-dark :where(table a, .wp-block-table a) {
    color: var(--pdm-accent) !important;
}

/* 2) SURFACES CLAIRES DÉTECTÉES PAR JS */
html.papycha-dark .pdm-auto-surface {
    background-color: var(--pdm-surface) !important;
    color: var(--pdm-text) !important;
    border-color: var(--pdm-border) !important;
}

html.papycha-dark .pdm-auto-surface--alt {
    background-color: var(--pdm-surface-alt) !important;
}

/* Les encarts Papycha utilisent parfois un background: linear-gradient(...) */
html.papycha-dark .pdm-auto-gradient {
    background-image: linear-gradient(
        90deg,
        var(--pdm-surface-alt) 0%,
        var(--pdm-surface) 58%,
        var(--pdm-surface-alt) 100%
    ) !important;
    background-color: var(--pdm-surface) !important;
    color: var(--pdm-text) !important;
    border-color: var(--pdm-border) !important;
}

/* Texte explicitement noir/gris foncé dans une zone convertie */
html.papycha-dark .pdm-auto-text {
    color: var(--pdm-text) !important;
}

/* 3) CARTES / FICHES / BLOCS DE RÉSULTATS
   Les sélecteurs restent volontairement génériques pour couvrir
   les fiches donjons, monstres, résultats et composants historiques. */
html.papycha-dark :where(
    .card,
    [class*="card"],
    [class*="fiche"],
    [class*="result"],
    [class*="item"],
    [class*="panel"],
    [class*="box"]
).pdm-auto-surface {
    box-shadow: none;
}

/* Boutons et contrôles clairs détectés automatiquement */
html.papycha-dark :where(
    button.pdm-auto-surface,
    a.pdm-auto-surface,
    input.pdm-auto-surface,
    select.pdm-auto-surface
) {
    background-color: var(--pdm-surface-alt) !important;
    color: var(--pdm-text) !important;
    border-color: var(--pdm-border) !important;
}

/* 4) FOOTER STARGAZER
   Stargazer et les anciennes zones de widgets n'utilisent pas toujours
   .site-footer. On couvre donc les identifiants historiques. */
html.papycha-dark :where(
    footer,
    #footer,
    .footer,
    .site-footer,
    #footer-content,
    .footer-content,
    #sidebar-footer,
    #sidebar-subsidiary,
    .footer-widgets,
    .footer-widget-area,
    .site-info,
    #menu-subsidiary,
    .menu-subsidiary
) {
    background-color: var(--pdm-bg) !important;
    color: var(--pdm-text) !important;
    border-color: var(--pdm-border) !important;
}

/* Certains footers Papycha ont un décor en background-image.
   On conserve ce décor mais on évite sa grande zone blanche. */
html.papycha-dark :where(
    footer,
    #footer,
    .footer,
    .site-footer,
    #footer-content,
    .footer-content,
    #sidebar-footer,
    #sidebar-subsidiary
)[style*="background"],
html.papycha-dark :where(
    footer,
    #footer,
    .footer,
    .site-footer,
    #footer-content,
    .footer-content,
    #sidebar-footer,
    #sidebar-subsidiary
) {
    background-blend-mode: multiply !important;
}

/* Les wrappers internes du footer sont souvent blancs dans Stargazer */
html.papycha-dark :where(
    footer .wrap,
    #footer .wrap,
    .footer .wrap,
    .site-footer .wrap,
    #sidebar-footer .wrap,
    #sidebar-subsidiary .wrap,
    footer .widget,
    #footer .widget,
    .site-footer .widget
) {
    background-color: transparent !important;
    color: var(--pdm-text) !important;
    border-color: var(--pdm-border) !important;
}

/* 5) Navigation de fin de page / "Retour à l'accueil"
   Selon les templates Stargazer cette zone peut vivre juste avant #footer. */
html.papycha-dark :where(
    .loop-nav,
    .navigation,
    .post-navigation,
    .posts-navigation,
    .entry-footer,
    .page-footer,
    .singular-footer,
    [class*="return"],
    [class*="back-home"]
).pdm-auto-surface {
    background-color: var(--pdm-surface) !important;
}

/* 6) Formulaires et filtres */
html.papycha-dark :where(
    input:not([type="checkbox"]):not([type="radio"]),
    textarea,
    select,
    option
) {
    background-color: var(--pdm-input) !important;
    color: var(--pdm-text) !important;
    border-color: var(--pdm-border) !important;
}

/* 7) Les médias restent strictement inchangés */
html.papycha-dark :where(
    img,
    picture,
    video,
    canvas,
    iframe
) {
    filter: none !important;
    opacity: 1;
}

/* Les SVG de contenu ne sont pas recolorés globalement.
   Le bouton du plugin garde ses propres règles. */