/* ==========================================================================
   Cometa Diário — Dark Mode
   Transições globais e ajustes específicos para [data-theme="dark"]
   As cores são controladas pelas variáveis CSS em variables.css.
   Este arquivo contém apenas sobreposições que não são capturadas pelas variáveis.
   ========================================================================== */

/* Transição suave entre temas */
html[data-theme],
html[data-theme] *,
html[data-theme] *::before,
html[data-theme] *::after {
    transition:
        background-color 0.3s ease,
        border-color 0.3s ease,
        color 0.2s ease,
        box-shadow 0.3s ease;
}

/* Exceção: imagens e elementos visuais não devem "piscar" */
html[data-theme] img,
html[data-theme] video,
html[data-theme] svg {
    transition: none;
}

/* --- Ajustes de legibilidade em dark mode --- */
[data-theme="dark"] input,
[data-theme="dark"] textarea,
[data-theme="dark"] select {
    background-color: var(--color-surface);
    color: var(--color-text);
    border-color: var(--color-border);
}

[data-theme="dark"] input::placeholder,
[data-theme="dark"] textarea::placeholder {
    color: var(--color-text-muted);
}

/* Scrollbar (Webkit) */
[data-theme="dark"] ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

[data-theme="dark"] ::-webkit-scrollbar-track {
    background: var(--color-surface);
}

[data-theme="dark"] ::-webkit-scrollbar-thumb {
    background: var(--color-border);
    border-radius: 4px;
}

[data-theme="dark"] ::-webkit-scrollbar-thumb:hover {
    background: var(--color-text-muted);
}

/* Nav em dark mode */
[data-theme="dark"] .cd-header__bar {
    border-bottom-color: rgba(255, 255, 255, 0.06);
}

/* Imagens com placeholder em dark mode */
[data-theme="dark"] img[src*="data:image/svg"] {
    filter: brightness(0.7);
}

/* Código / pre em dark mode */
[data-theme="dark"] pre,
[data-theme="dark"] code {
    background: var(--color-surface-2);
    color: #c9d1d9;
}