/* ============================== */
/* DARK THEME                     */
/* ============================== */

/* ============================== */
/* VARIÁVEIS / TEMA DARK          */
/* ============================== */
:root.dark-theme {
    --background-color: #101623;
    --white: #141b2d;

    --gray0: #f0f3f9;
    --gray1: #cdd5e0;
    --gray2: #8b95a7;
    --gray3: #5d6b82;
    --gray4: #26304a;
    --gray5: #1e283d;

    --primary: #0b877d;
    --dark-primary: #065c53;
    --light-primary: rgba(11, 135, 125, 0.15);
    --success: #20c997;
    --light-success: rgba(32, 201, 151, 0.15);
    --dark-warning: #ffa94d;
    --warning: #ffa94d;
    --light-warning: rgba(255, 169, 77, 0.15);
    --error: #ff6b6b;
    --light-error: rgba(255, 107, 107, 0.12);

    --border-color: #1e283d;
    --text-on-primary: #ffffff;
    --overlay: rgba(0, 0, 0, 0.6);
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.3);
    --scrollbar-thumb: #4a5568;
    --scrollbar-thumb-hover: #5d6b82;

    /* Cores para animações no tema dark */
    --pulse-bg: #243049;
    --pulse-shadow: rgba(11, 135, 125, 1);
    --dragging-bg: #243049;
}

/* ============================== */
/* RESET E CONFIGURAÇÕES GLOBAIS  */
/* ============================== */
.dark-theme body {
    background-color: var(--background-color);
    color: var(--gray0) !important;
}

.dark-theme .bg-white,
.dark-theme .modal-content,
.dark-theme .toast,
.dark-theme .dropdown-menu,
.dark-theme .card,
.dark-theme .list-group-item,
.dark-theme .shadow,
.dark-theme .input-group.rounded-pill,
.dark-theme .kanban-title,
.dark-theme .login-container,
.dark-theme .table,
.dark-theme .page-link,
.dark-theme .pagination .page-link,
.dark-theme .btn-light,
.dark-theme .kanban-card-actions .btn-action,
.dark-theme .bg-light {
    background-color: var(--white) !important;
    color: var(--gray0) !important;
    border-color: var(--border-color) !important;
}

.dark-theme .bg-primary,
.dark-theme .btn-primary,
.dark-theme .btn-success,
.dark-theme .btn-warning,
.dark-theme .btn-error,
.dark-theme .btn.bg-primary {
    border-color: transparent;
}

.dark-theme .btn-light,
.dark-theme .page-link,
.dark-theme .kanban-column .kanban-title,
.dark-theme .kanban-card-actions span.btn-action,
.dark-theme .rounded-pill .input-group-text,
.dark-theme .rounded-pill .form-control {
    background-color: var(--gray5) !important;
    border-color: var(--border-color) !important;
    color: var(--gray0) !important;
}

.dark-theme .btn-light:hover,
.dark-theme .page-link:hover,
.dark-theme .kanban-card-actions span.btn-action:hover {
    background-color: var(--gray4) !important;
}

.dark-theme .form-control,
.dark-theme .form-select,
.dark-theme textarea,
.dark-theme select,
.dark-theme option {
    background-color: var(--gray5) !important;
    color: var(--gray0) !important;
    border-color: var(--border-color) !important;
}

.dark-theme .form-control:focus,
.dark-theme .form-select:focus,
.dark-theme textarea:focus,
.dark-theme select:focus {
    border-color: var(--primary) !important;
    box-shadow: none !important;
}

.dark-theme .list-group-item,
.dark-theme .input-group-text,
.dark-theme .modal-header,
.dark-theme .modal-footer,
.dark-theme .modal-body,
.dark-theme .card-body,
.dark-theme .action-header,
.dark-theme .kanban-title,
.dark-theme .kanban-card,
.dark-theme table.table > tbody > tr > td,
.dark-theme .dropdown-menu,
.dark-theme .toast-body,
.dark-theme .status,
.dark-theme .pagination .page-link,
.dark-theme .page-item.disabled .page-link {
    border-color: var(--border-color) !important;
}

.dark-theme .page-item.active .page-link {
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
    color: #ffffff !important;
}

.dark-theme .pagination .page-item.disabled .page-link {
    background-color: var(--gray3) !important;
    color: var(--gray2) !important;
}

.dark-theme .list-group-item a,
.dark-theme a.btn-sair,
.dark-theme a,
.dark-theme .text-muted {
    color: var(--gray0);
}

.dark-theme .ui-state-default {
    color: var(--gray3) !important;
}

.dark-theme .table {
    --bs-table-bg: var(--white);
    --bs-table-striped-bg: var(--gray5);
    --bs-table-hover-bg: var(--gray3);
    color: var(--gray0) !important;
}

.dark-theme .table thead tr th {
    background-color: var(--gray5);
    color: var(--gray0) !important;
    border-color: var(--border-color);
}

.dark-theme .dropdown-item:hover {
    background-color: var(--gray5) !important;
}

.dark-theme .dropdown-item:active,
.dark-theme .dropdown-item:focus {
    color: var(--gray0) !important;
    background-color: var(--gray4) !important;
}

.dark-theme .modal-header .btn-close,
.dark-theme .toast .btn-close {
    filter: invert(1);
}

.dark-theme ::-webkit-scrollbar-track {
    background: var(--gray5);
}

.dark-theme ::-webkit-scrollbar-thumb {
    background-color: var(--scrollbar-thumb);
    border: 2px solid var(--gray5);
}

.dark-theme h1,
.dark-theme h2,
.dark-theme h3,
.dark-theme h4,
.dark-theme h5,
.dark-theme h6,
.dark-theme p,
.dark-theme label {
    color: var(--gray0);
}

/* ============================== */
/* MENU LATERAL (SIDENAV)         */
/* ============================== */
.dark-theme .sidenav {
    border-right: 1px solid var(--border-color);
    background: var(--white);
}

.dark-theme .menu-item:not(.menu-ativo):hover .menu-item-button {
    background-color: var(--gray4) !important;
}

.dark-theme .menu-item.menu-ativo .menu-item-button {
    background-color: var(--primary);
}

.dark-theme .menu-item.menu-ativo i {
    color: #ffffff !important;
}

.dark-theme .menu-item .menu-item-button i,
.dark-theme .menu-item .menu-item-title {
    color: var(--gray0);
}

/* ============================== */
/* MENU LATERAL RESPONSIVO - MOBILE */
/* ============================== */
.dark-theme .menu-toggle {
    color: var(--gray0);
}

/* ============================== */
/* OBRA PARADA */
/* ============================== */
.kanban-cards .kanban-card.obra-parada .card-financial-info {
    background: rgba(255, 107, 107, 0.05) !important;
}

/* ============================== */
/* MÓDULO DE OBRA - Álbuns        */
/* ============================== */
.dark-theme .album-nome {
    color: var(--gray0);
}

/* ============================== */
/* MÓDULO DE OBRA - QuillJS       */
/* ============================== */
.dark-theme .ql-editor {
    color: var(--gray0);
}

.dark-theme .ql-editor.ql-blank::before {
    color: var(--gray2);
}

.dark-theme .ql-toolbar {
    background-color: var(--gray5);
    border-color: var(--border-color);
}

.dark-theme .ql-container {
    background-color: var(--gray5);
    border-color: var(--border-color);
    color: var(--gray0);
}

.dark-theme .ql-toolbar .ql-stroke {
    stroke: var(--gray1);
}

.dark-theme .ql-toolbar .ql-fill {
    fill: var(--gray1);
}

.dark-theme .ql-toolbar .ql-picker-label {
    color: var(--gray1);
}

/* ============================== */
/* ASSINATURA / PLANOS            */
/* ============================== */
.dark-theme .plano-card.plano-atual {
    background: var(--gray4) !important;
}

/* ============================== */
/* RDO - CLIMA BOTÕES             */
/* ============================== */
.dark-theme .rdo-clima-btn {
    border-color: var(--gray3);
    background: var(--gray3);
    color: var(--text-100);
}

.dark-theme .rdo-clima-btn:hover {
    border-color: var(--gray3);
}

.dark-theme .rdo-clima-btn.active {
    background: var(--primary);
    border-color: var(--primary);
    color: #fff;
}

/* ============================== */
/* SWEETALERT2 - DARK THEME       */
/* ============================== */
.dark-theme .swal2-popup {
    background-color: var(--white) !important;
    color: var(--gray0) !important;
    border: 1px solid var(--border-color) !important;
}

.dark-theme .swal2-title {
    color: var(--gray0) !important;
}

.dark-theme .swal2-html-container,
.dark-theme .swal2-content {
    color: var(--gray1) !important;
}

.dark-theme .swal2-input,
.dark-theme .swal2-textarea,
.dark-theme .swal2-select {
    background-color: var(--gray5) !important;
    color: var(--gray0) !important;
    border-color: var(--border-color) !important;
}

.dark-theme .swal2-input:focus,
.dark-theme .swal2-textarea:focus,
.dark-theme .swal2-select:focus {
    border-color: var(--primary) !important;
    box-shadow: 0 0 0 0.1rem rgba(27, 184, 168, 0.25) !important;
}

.dark-theme .swal2-close {
    color: var(--gray0) !important;
}

.dark-theme .swal2-close:hover {
    color: var(--error) !important;
}

.dark-theme .swal2-icon.swal2-success [class^="swal2-success-line"] {
    background-color: var(--success) !important;
}

.dark-theme .swal2-icon.swal2-success .swal2-success-ring {
    border-color: rgba(25, 193, 118, 0.3) !important;
}

.dark-theme .swal2-icon.swal2-error [class^="swal2-x-mark-line"] {
    background-color: var(--error) !important;
}

.dark-theme .swal2-icon.swal2-warning {
    border-color: var(--warning) !important;
    color: var(--warning) !important;
}

.dark-theme .swal2-icon.swal2-info {
    border-color: var(--primary) !important;
    color: var(--primary) !important;
}

.dark-theme .swal2-icon.swal2-question {
    border-color: var(--gray2) !important;
    color: var(--gray2) !important;
}

.dark-theme .swal2-footer {
    border-color: var(--border-color) !important;
    color: var(--gray1) !important;
}

.dark-theme .swal2-validation-message {
    background-color: var(--gray5) !important;
    color: var(--error) !important;
}

.dark-theme .swal2-timer-progress-bar {
    background: var(--primary) !important;
}

/* === ApexCharts Dark Mode === */
.dark-theme .apexcharts-tooltip {
    background: var(--gray5) !important;
    color: var(--gray0) !important;
    border-color: var(--border-color) !important;
}

.dark-theme .apexcharts-tooltip .apexcharts-tooltip-title {
    background: var(--gray3) !important;
    color: var(--gray0) !important;
    border-color: var(--border-color) !important;
}

.dark-theme .apexcharts-tooltip .apexcharts-tooltip-text {
    color: var(--gray0) !important;
}

.dark-theme .apexcharts-legend-text {
    color: var(--gray1) !important;
}

.dark-theme .apexcharts-xaxis-label,
.dark-theme .apexcharts-yaxis-label {
    fill: var(--gray2) !important;
}

.dark-theme .apexcharts-gridline {
    stroke: var(--border-color);
}

.dark-theme .apexcharts-xaxis line,
.dark-theme .apexcharts-yaxis line {
    stroke: var(--border-color);
}