/* assets/css/dark.css */
/* ======================================================= */
/* ============= TEMA ESCURO (CONTROLADO POR CLASSE) ============= */
/* ======================================================= */
body.dark-mode .theme-icon-sun { display: block; }
body.dark-mode .theme-icon-moon { display: none; }
/* Estilo do botão de tema no modo escuro */
body.dark-mode .theme-toggle-btn {
    border-color: #1A1A1A !important;
    color: var(--text-dark);
}
body.dark-mode .theme-toggle-btn:hover {
    background-color: #2a2a2a;
}
/* Redefinindo a paleta de cores principal com as variáveis */
body.dark-mode:root {
    --text-dark: #FFFFFF;
    --text-secondary: #FFFFFF;
    --text-tertiary: #a0a0a0;
    --border-color: #1A1A1A;
    --border-color-light: #536471;
    --accent-color: #FFFFFF;
    --accent-color-light: #2c2149;
    --background-light-gray: #2c2c2c;
    --accent-color-dark: #1A1A1A;
}
/* Ajustando os fundos principais e a cor base da fonte */
body.dark-mode,
body.dark-mode html {
    background-color: #121212;
    color: var(--text-dark);
}
body.dark-mode .sidebar {
    background-color: #1a1a1a;
    border-right: 1px solid #1A1A1A !important;
}
body.dark-mode .dashboard-header {
    background-color: #1f1f1f;
    border-bottom: 1px solid #1A1A1A !important;
}
body.dark-mode .mobile-nav {
    background-color: #1f1f1f;
    border-top: 1px solid #1A1A1A !important;
}
body.dark-mode .version-text {
    border-top: 1px solid #121212 !important;
}
/* Ajustando componentes (cards, botões, inputs) */
body.dark-mode .card,
body.dark-mode .dropdown-menu,
body.dark-mode .form-group input {
    background-color: #1e1e1e;
    border-color: #1A1A1A !important;
    color: var(--text-dark);
}
body.dark-mode .form-group input:focus {
    border-color: var(--text-dark) !important;
}
/* Bordas de erro e sucesso para o modo escuro */
body.dark-mode .form-group input.input-error,
body.dark-mode .form-group input.input-error:focus {
    border-color: #ff5c5c !important; /* Vermelho mais vivo */
}
body.dark-mode .form-group input.input-success,
body.dark-mode .form-group input.input-success:focus {
    border-color: #33d47b !important; /* Verde mais vivo */
}
body.dark-mode .form-group input::placeholder {
    color: #464646;
}
body.dark-mode .btn {
    background-color: #1e1e1e;
    color: var(--text-dark);
    border-color: #1A1A1A !important;
}
body.dark-mode .btn:hover {
    background-color: #2a2a2a;
}
body.dark-mode .btn-dark {
    background-color: #f0f0f0;
    color: #121212;
    border-color: #f0f0f0 !important;
}
body.dark-mode .btn-dark:hover {
    background-color: #ffffff;
}
body.dark-mode .btn-dark .spinner {
    border-top-color: #121212;
}
/* Ajuste do dropdown e icone CHEVRON */
body.dark-mode .dropdown-item {
    color: var(--text-dark);
}
body.dark-mode .dropdown-item:hover {
    background-color: #2f2f2f;
}
body.dark-mode .dashboard-user-button,
body.dark-mode .dashboard-user-button span {
    color: var(--text-dark) !important;
}
body.dark-mode .login-dropdown-button:hover,
body.dark-mode .login-dropdown-button.open,
body.dark-mode .dashboard-user-button:hover,
body.dark-mode .dashboard-user-button.open {
    background-color: #2a2a2a;
}
body.dark-mode .chevron-icon {
    stroke: #FFFFFF;
}
/* Ajustes na sidebar (Versão Web) */
body.dark-mode .logo,
body.dark-mode .dashboard-title {
    color: var(--text-dark);
}
body.dark-mode .sidebar .nav-item {
    color: var(--text-dark);
}
body.dark-mode .sidebar .nav-item:not(.active) .nav-icon {
    color: var(--text-dark);
}
body.dark-mode .sidebar .nav-item:not(.active):hover {
    background-color: #2F2F2F;
}
body.dark-mode .sidebar .nav-item.active,
body.dark-mode .sidebar .nav-item.active .nav-icon,
body.dark-mode .sidebar .nav-item.active::after {
    color: #000000;
}
body.dark-mode .version-text {
    background-color: #1a1a1a;
    color: var(--text-dark);
}
/* Ajustes na navegação (Versão Mobile) */
body.dark-mode .mobile-nav .nav-item span {
    color: #FFFFFF;
}
body.dark-mode .mobile-nav .nav-item .nav-icon {
    color: #FFFFFF;
}
body.dark-mode .mobile-nav .nav-item:not(.active):hover .nav-icon-wrapper {
    background-color: #2F2F2F;
}
body.dark-mode .mobile-nav .nav-item.active .nav-icon {
    color: #000000;
}
/* Ajustes no snackbar/toast */
body.dark-mode .snackbar {
    background-color: #f0f0f0;
    color: #121212;
}
/* Ajuste na animação do loader */
body.dark-mode @keyframes pulse-shadow {
    0% { box-shadow: 0 0 0 0 var(--loader-color, inherit); }
    33% { box-shadow: 0 0 0 0 var(--loader-color, inherit); }
    66% { box-shadow: 0 0 0 14px rgba(255,255,255,0); }
    100% { box-shadow: 0 0 0 0 rgba(255,255,255,0); }
}

/* ====== AJUSTES FORÇADOS PARA A PÁGINA DE LOGIN ====== */
body.dark-mode .login-pane .title,
body.dark-mode .login-pane .input-icon,
body.dark-mode .login-pane .password-toggle-btn,
body.dark-mode .login-pane .forgot-password,
body.dark-mode .login-pane .signup-link,
body.dark-mode .login-pane .signup-link a,
body.dark-mode .login-pane .footer,
body.dark-mode .login-pane .footer a,
body.dark-mode .login-pane .dropdown-button-secondary-text,
body.dark-mode .login-pane .dropdown-button-label {
    color: #FFFFFF !important;
}
body.dark-mode .login-pane {
    background-color: #121212;
}
body.dark-mode .login-dropdown-button {
    color: #FFFFFF !important;
}
body.dark-mode .branding-pane {
    background-color: #000000;
}
/* = FORÇAR REMOÇÃO DA COR DE AUTOCOMPLETE (MODO ESCURO) = */
body.dark-mode input:-webkit-autofill,
body.dark-mode input:-webkit-autofill:hover,
body.dark-mode input:-webkit-autofill:focus,
body.dark-mode input:-webkit-autofill:active {
    -webkit-text-fill-color: var(--text-dark) !important;
    box-shadow: 0 0 0 30px #1e1e1e inset !important;
}

/* Ajustes para ícones na dashboard-content no dark mode */
body.dark-mode .dashboard-content .card h2 .fa-light {
    color: #FFFFFF !important;
}
body.dark-mode .email-item .fa-envelope.icon-list {
    color: #FFFFFF;
}

/* ==================================================================== */
/* =========== INÍCIO: ESTILOS DE BOTÕES PERSONALIZADOS ============ */
/* ==================================================================== */
body.dark-mode .btn-action:not(.btn-danger) {
    background-color: #F2F2F2;
    border-color: #FFFFFF;
    color: #000000;
}
body.dark-mode .btn-action:not(.btn-danger):hover {
    background-color: #f0f0f0;
    border-color: #f0f0f0;
    color: #000000;
}
body.dark-mode .btn-danger {
    background-color: #fbebec;
    border-color: #f7d3d4;
    color: #dc3545;
}
body.dark-mode .btn-danger:hover {
    background-color: #f8d7da;
    border-color: #f8d7da;
    color: #dc3545;
}

/* --- Regra para trocar o logo no modo escuro --- */
body.dark-mode .logo .logo-light {
    display: none; /* Esconde o logo claro */
}

body.dark-mode .logo .logo-dark {
    display: block; /* Mostra o logo escuro */
}
/* ==================================================================== */
/* ============= FIM: ESTILOS DE BOTÕES PERSONALIZADOS ============== */
/* ==================================================================== */


/* ==================================================================== */
/* =================== INÍCIO: AJUSTES PARA MODAIS DARK =================== */
/* ==================================================================== */

/* Fundo e borda do conteúdo do modal */
body.dark-mode .app-modal-content {
    background-color: #2a2a2a;
    border-color: #1A1A1A;
}

/* Borda do cabeçalho e rodapé do modal */
body.dark-mode .app-modal-header,
body.dark-mode .app-modal-footer {
    border-color: #1A1A1A;
}

/* Cor do texto geral e títulos dentro do modal */
body.dark-mode .app-modal-title,
body.dark-mode .app-modal-body,
body.dark-mode .app-modal-body p,
body.dark-mode .app-modal-body span,
body.dark-mode .app-modal-body label {
    color: var(--text-dark);
}

/* Inputs e placeholders dentro do modal */
body.dark-mode .app-modal .input-clear {
    background-color: #1e1e1e;
    border-color: #1A1A1A;
    color: var(--text-dark);
}
body.dark-mode .app-modal .input-clear::placeholder {
    color: #6c757d;
}
body.dark-mode .app-modal .input-clear:focus {
    border-color: #f0f0f0;
}

/* Feedback de validação para inputs no modal dark */
body.dark-mode .app-modal .input-clear.input-error {
    border-color: #ff5c5c !important;
}
body.dark-mode .app-modal .input-clear.input-success {
    border-color: #33d47b !important;
}

/* Ícones de olho (mostrar/ocultar senha) e de requisitos */
body.dark-mode .password-toggle-icon,
body.dark-mode .password-reqs,
body.dark-mode .password-reqs i {
    color: #a0a0a0;
}
body.dark-mode .password-reqs li.valid,
body.dark-mode .password-reqs li.valid i {
    color: #33d47b;
}

/* Caixa de confirmação estilo iOS */
body.dark-mode .ios-confirm-box {
    background-color: rgba(58, 58, 60, 0.95);
}
body.dark-mode .ios-confirm-title,
body.dark-mode .ios-confirm-message {
    color: #fff;
}
body.dark-mode .ios-confirm-buttons {
    border-top-color: rgba(255, 255, 255, 0.25);
}
body.dark-mode .ios-confirm-button {
    color: #0a84ff;
}
body.dark-mode .ios-confirm-button:first-child {
    border-right-color: rgba(255, 255, 255, 0.25);
}
body.dark-mode .ios-confirm-button:active {
    background-color: rgba(255, 255, 255, 0.1);
}

/* ==================================================================== */
/* ==================== FIM: AJUSTES PARA MODAIS DARK =================== */
/* ==================================================================== */

/* ======================================================= */
/* ====== ESTILOS DO BOTÃO DE LIMITE PARA MODO ESCURO ==== */
/* ======================================================= */

body.dark-mode .btn-dark-outline {
	background-color: #F2F2F2;
    border-color: #7c4dff; /* Borda roxa (sua cor de destaque) */
    color: #191919;      /* Texto roxo */
    transition: background-color 0.2s ease, color 0.2s ease;
}

body.dark-mode .btn-dark-outline:hover {
    background-color: #D7D7D7; /* Fundo roxo ao passar o mouse */
    color: #191919;          /* Texto branco para melhor contraste */
}


/* ==================================================================== */
/* ============ INÍCIO: ESTILOS DARK PARA O FILE MANAGER ============ */
/* ==================================================================== */

/* Cabeçalho e breadcrumbs */
body.dark-mode .fm-header .fm-breadcrumbs {
    color: #a0a0a0;
}
body.dark-mode .fm-header .fm-breadcrumbs a {
    color: var(--accent-hover);
}
body.dark-mode .mobile-nav .nav-item[data-section="gerenciador"] span {
    color: #FFFFFF;
}

/* Tabela de arquivos */
body.dark-mode .fm-list-header {
    color: #a0a0a0;
    border-bottom-color: #3a3a3a;
}
body.dark-mode .fm-list-row {
    border-bottom-color: #2a2a2a;
}
body.dark-mode .fm-list-row:not(:has(.fa-level-up-alt)):hover {
    background-color: #2a2a2a;
}
body.dark-mode .fm-list-row.selected {
    background-color: var(--accent-color-light) !important;
}

/* Células, texto e ícones da tabela */
body.dark-mode .fm-cell {
    color: var(--text-dark);
}
body.dark-mode .fm-icon {
    color: #a0a0a0;
}
body.dark-mode .fm-cell-size,
body.dark-mode .fm-cell-date {
    color: #a0a0a0;
}
body.dark-mode .actions-btn {
    color: #a0a0a0;
}
body.dark-mode .actions-btn:hover, body.dark-mode .actions-btn.active {
    background-color: rgba(255, 255, 255, 0.1);
}

/* Menu de contexto (dropdown de ações) */
body.dark-mode .fm-context-menu {
    background-color: #3a3a3a;
    border-color: #1a1a1a;
}
body.dark-mode .fm-context-menu button {
    color: var(--text-dark);
}
body.dark-mode .fm-context-menu button:hover {
    background-color: #4a4a4a;
}
body.dark-mode .fm-context-menu button.danger {
    color: #ff8a8a;
}

/* Checkbox customizado */
body.dark-mode .custom-checkbox .checkmark {
    background-color: #1e1e1e;
    border-color: #536471;
}
body.dark-mode .custom-checkbox:hover input ~ .checkmark {
    border-color: var(--accent-hover);
}
body.dark-mode .custom-checkbox input:checked ~ .checkmark {
    background-color: var(--accent-hover);
    border-color: var(--accent-hover);
}

/* Zona de Upload (Drop Zone) */
body.dark-mode .drop-zone {
    border-color: #536471;
    color: #a0a0a0;
}
body.dark-mode .drop-zone.drag-over {
    border-color: var(--accent-hover);
    background-color: rgba(124, 77, 255, 0.1);
}
body.dark-mode .progress-bar-container {
    background-color: #1e1e1e;
}

/* ==================================================================== */
/* ============== FIM: ESTILOS DARK PARA O FILE MANAGER ============= */
/* ==================================================================== */