/* Variáveis CSS para temas */
:root {
    --transition-duration: 0.3s;
}

/* Transições suaves para mudança de tema */
* {
    transition: background-color var(--transition-duration) ease, 
                color var(--transition-duration) ease, 
                border-color var(--transition-duration) ease;
}

/* Estilos para SVGs no tema claro */
.light svg.dark\:fill-white {
    display: none;
}

.light svg.dark\:fill-azul {
    display: block;
}

/* Estilos para SVGs no tema escuro */
.dark svg.dark\:fill-white {
    display: block;
}

.dark svg.dark\:fill-azul {
    display: none;
}

/* Estilos para o botão de tema */
[data-testid="switchTheme"] {
    cursor: pointer;
    padding: 8px;
    border-radius: 50%;
    border: none;
    background: transparent;
    transition: background-color var(--transition-duration) ease;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    min-height: 40px;
}

[data-testid="switchTheme"]:hover {
    background-color: rgba(0, 0, 0, 0.1);
}

.dark [data-testid="switchTheme"]:hover {
    background-color: rgba(255, 255, 255, 0.1);
}

.theme-icon {
    font-size: 18px;
    line-height: 1;
    transition: transform var(--transition-duration) ease;
}

[data-testid="switchTheme"]:hover .theme-icon {
    transform: scale(1.1);
}

/* Estilos específicos para elementos que mudam com o tema */
.light .t_dark {
    color: var(--color1) !important;
}

.dark .t_dark {
    color: var(--color) !important;
}

/* Melhorias para elementos de texto */
.light .t_sub_theme {
    color: var(--color1) !important;
}

.dark .t_sub_theme {
    color: var(--color) !important;
}

/* Estilos para elementos de fundo */
.light .background-color-\[var\(--colors-background-primary\)\] {
    background-color: #f4f2fc !important;
}

.dark .background-color-\[var\(--colors-background-primary\)\] {
    background-color: rgb(20 20 48) !important;
}

.light .background-color-\[var\(--colors-background-secondary\)\] {
    background-color: #f4f2fc !important;
}

.dark .background-color-\[var\(--colors-background-secondary\)\] {
    background-color: #1d1d40  !important;
}