/* =====================================================================
   Toggle dark mode — bouton générique [cdf_dark_toggle]
   ===================================================================== */

.cdm-toggle {
    --cdm-tg-size: 1.6rem;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: .4em;
    width: 2.4rem;
    height: 2.4rem;
    padding: 0 !important;
    border: 1px solid currentColor;
    border-radius: 999px;
    background: transparent !important;
    background-color: transparent !important;
    color: inherit;
    cursor: pointer;
    line-height: 1;
    font: inherit;
    transition: background-color .2s ease, color .2s ease, border-color .2s ease, transform .15s ease;
}
.cdm-toggle:hover            { transform: scale(1.05); }
.cdm-toggle:focus-visible    { outline: 2px solid currentColor; outline-offset: 2px; }
.cdm-toggle:active           { transform: scale(0.97); }

.cdm-toggle .cdm-icon {
    width: var(--cdm-tg-size);
    height: var(--cdm-tg-size);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.cdm-toggle .cdm-icon svg {
    width: 100%;
    height: 100%;
}

/* Par défaut : lune visible, soleil caché (= mode clair, on propose de passer en sombre) */
.cdm-toggle .cdm-icon-moon { display: inline-flex; }
.cdm-toggle .cdm-icon-sun  { display: none; }
/* Quand le thème courant est dark : on inverse (= on propose de revenir en clair) */
html[data-theme="dark"]                 .cdm-toggle .cdm-icon-moon,
.cdm-toggle[data-cdm-theme="dark"]      .cdm-icon-moon { display: none; }
html[data-theme="dark"]                 .cdm-toggle .cdm-icon-sun,
.cdm-toggle[data-cdm-theme="dark"]      .cdm-icon-sun  { display: inline-flex; }

.cdm-toggle--label {
    width: auto !important;
    padding: .4em 1em !important;
    border-radius: 999px;
}
.cdm-toggle--label .cdm-label { font-size: .9em; }
/* Par défaut : libellé "passer en sombre", masqué quand on est déjà en sombre */
.cdm-toggle .cdm-label-light { display: none; }
.cdm-toggle .cdm-label-dark  { display: inline; }
html[data-theme="dark"]            .cdm-toggle .cdm-label-dark,
.cdm-toggle[data-cdm-theme="dark"] .cdm-label-dark  { display: none; }
html[data-theme="dark"]            .cdm-toggle .cdm-label-light,
.cdm-toggle[data-cdm-theme="dark"] .cdm-label-light { display: inline; }

/* Variante intégrée à un menu Elementor : transparent, hérite du contexte */
.cdm-toggle--ghost {
    border-color: transparent;
}
.cdm-toggle--ghost:hover {
    border-color: currentColor;
}