/* Dark Mode Styles for Sneat Template */

.dark-style {
    color-scheme: dark;
}

/* Background colors */
.dark-style {
    background-color: #1a1d2e !important;
    color: #d4d6e1 !important;
}

.dark-style .layout-wrapper {
    background-color: #1a1d2e !important;
}

.dark-style .layout-menu {
    background-color: #232639 !important;
    box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.5) !important;
}

.dark-style .menu-item .menu-link {
    color: #b4b7c9 !important;
}

.dark-style .menu-item.active .menu-link,
.dark-style .menu-item .menu-link:hover {
    color: #fff !important;
    background-color: rgba(95, 97, 230, 0.16) !important;
}

.dark-style .app-brand-text {
    color: #d4d6e1 !important;
}

/* Navbar */
.dark-style .navbar {
    background-color: #232639 !important;
    color: #d4d6e1 !important;
    box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.5) !important;
}

.dark-style .navbar .nav-link {
    color: #b4b7c9 !important;
}

.dark-style .navbar .nav-link:hover {
    color: #fff !important;
}

/* Cards */
.dark-style .card {
    background-color: #232639 !important;
    color: #d4d6e1 !important;
    border-color: #2f3349 !important;
    box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.4) !important;
}

.dark-style .card-header,
.dark-style .card-footer {
    background-color: #2a2d42 !important;
    border-color: #2f3349 !important;
}

.dark-style .card-title {
    color: #d4d6e1 !important;
}

/* Content */
.dark-style .content-wrapper {
    background-color: #1a1d2e !important;
}

/* Tables */
.dark-style .table {
    color: #d4d6e1 !important;
}

.dark-style .table thead th {
    background-color: #2a2d42 !important;
    color: #d4d6e1 !important;
    border-color: #2f3349 !important;
}

.dark-style .table tbody tr {
    background-color: #232639 !important;
    border-color: #2f3349 !important;
}

.dark-style .table tbody tr:hover {
    background-color: #2a2d42 !important;
}

/* Forms */
.dark-style .form-control,
.dark-style .form-select {
    background-color: #2a2d42 !important;
    color: #d4d6e1 !important;
    border-color: #2f3349 !important;
}

.dark-style .form-control:focus,
.dark-style .form-select:focus {
    background-color: #2a2d42 !important;
    color: #d4d6e1 !important;
    border-color: #5f61e6 !important;
}

.dark-style .form-label {
    color: #b4b7c9 !important;
}

/* Tag Inputs / Custom Selects (Recursos e Avaliações) - Custom TagInput Component */
.dark-style .tag-input-wrapper {
    background-color: #2a2d42 !important;
    border-color: #3a3f5c !important;
}

.dark-style .tag-input-wrapper input {
    background-color: transparent !important;
    color: #d4d6e1 !important;
}

.dark-style .tag-input-wrapper input::placeholder {
    color: #7e829a !important;
}

.dark-style .tag-item {
    background-color: #5f61e6 !important;
    color: #fff !important;
}

.dark-style .tag-item .remove {
    color: rgba(255, 255, 255, 0.8) !important;
}

.dark-style .tag-item .remove:hover {
    color: #ff4757 !important;
}

/* TagInput Dropdown - CRITICAL: Override inline styles */
.dark-style .tag-dropdown {
    background-color: #232639 !important;
    border-color: #3a3f5c !important;
}

.dark-style .tag-option {
    background-color: #232639 !important;
    color: #d4d6e1 !important;
}

.dark-style .tag-option:hover,
.dark-style .tag-option.highlight {
    background-color: #2a2d42 !important;
    color: #fff !important;
}

.dark-style .tag-option.create {
    color: #b4b7c9 !important;
    font-style: italic !important;
}

/* Select2 (if used) */
.dark-style .select2-container--default .select2-selection--single,
.dark-style .select2-container--default .select2-selection--multiple {
    background-color: #2a2d42 !important;
    border-color: #3a3f5c !important;
}

.dark-style .select2-container--default .select2-selection--single .select2-selection__rendered,
.dark-style .select2-container--default .select2-selection--multiple .select2-selection__rendered {
    color: #d4d6e1 !important;
}

.dark-style .select2-dropdown {
    background-color: #232639 !important;
    border-color: #3a3f5c !important;
}

.dark-style .select2-container--default .select2-results__option {
    background-color: #232639 !important;
    color: #d4d6e1 !important;
}

.dark-style .select2-container--default .select2-results__option--highlighted {
    background-color: #2a2d42 !important;
    color: #fff !important;
}

.dark-style .select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: #3a3f5c !important;
    border-color: #4a4f6c !important;
    color: #d4d6e1 !important;
}

.dark-style .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
    color: #b4b7c9 !important;
}

.dark-style .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
    color: #ff4757 !important;
}

/* Autocomplete dropdowns */
.dark-style .autocomplete-suggestions,
.dark-style .ui-autocomplete {
    background-color: #232639 !important;
    border-color: #3a3f5c !important;
}

.dark-style .autocomplete-suggestion,
.dark-style .ui-menu-item {
    background-color: #232639 !important;
    color: #d4d6e1 !important;
}

.dark-style .autocomplete-suggestion:hover,
.dark-style .ui-menu-item:hover,
.dark-style .ui-state-active {
    background-color: #2a2d42 !important;
    color: #fff !important;
}

/* TagInput Dropdown Lists - Comprehensive Coverage */
.dark-style .dropdown,
.dark-style .dropdown-menu,
.dark-style .list-group,
.dark-style .suggestions,
.dark-style .typeahead,
.dark-style .tt-menu,
.dark-style .tt-dropdown-menu {
    background-color: #232639 !important;
    border: 1px solid #3a3f5c !important;
    color: #d4d6e1 !important;
}

.dark-style .dropdown-item,
.dark-style .list-group-item,
.dark-style .suggestion,
.dark-style .tt-suggestion {
    background-color: #232639 !important;
    color: #d4d6e1 !important;
    border-color: #2f3349 !important;
}

.dark-style .dropdown-item:hover,
.dark-style .dropdown-item:focus,
.dark-style .list-group-item:hover,
.dark-style .suggestion:hover,
.dark-style .tt-suggestion:hover,
.dark-style .tt-cursor {
    background-color: #2a2d42 !important;
    color: #fff !important;
}

/* TagInput specific classes */
.dark-style [class*="tag-input"] .dropdown,
.dark-style [class*="tag-input"] .list,
.dark-style [class*="tag-input"] ul,
.dark-style [class*="tags-input"] .dropdown,
.dark-style [class*="tags-input"] .list,
.dark-style [class*="tags-input"] ul {
    background-color: #232639 !important;
    border: 1px solid #3a3f5c !important;
}

.dark-style [class*="tag-input"] li,
.dark-style [class*="tags-input"] li {
    background-color: #232639 !important;
    color: #d4d6e1 !important;
}

.dark-style [class*="tag-input"] li:hover,
.dark-style [class*="tags-input"] li:hover,
.dark-style [class*="tag-input"] li.active,
.dark-style [class*="tags-input"] li.active {
    background-color: #2a2d42 !important;
    color: #fff !important;
}

/* Additional coverage for custom implementations */
.dark-style .item-list,
.dark-style .results-list,
.dark-style .options-list {
    background-color: #232639 !important;
    border: 1px solid #3a3f5c !important;
}

.dark-style .item-list>*,
.dark-style .results-list>*,
.dark-style .options-list>* {
    background-color: #232639 !important;
    color: #d4d6e1 !important;
}

.dark-style .item-list>*:hover,
.dark-style .results-list>*:hover,
.dark-style .options-list>*:hover {
    background-color: #2a2d42 !important;
    color: #fff !important;
}

/* Custom Autocomplete Habilidades Component */
.dark-style .list-group-item {
    background-color: #232639 !important;
    color: #d4d6e1 !important;
    border-color: #2f3349 !important;
}

.dark-style .list-group-item-action {
    color: #d4d6e1 !important;
}

.dark-style .list-group-item-action:hover,
.dark-style .list-group-item-action:focus {
    background-color: #2a2d42 !important;
    color: #fff !important;
}

.dark-style .list-group-item-action.active {
    background-color: #5f61e6 !important;
    color: #fff !important;
    border-color: #5f61e6 !important;
}

/* Cards de habilidades selecionadas */
.dark-style .bd-callout {
    border-left-color: #5f61e6 !important;
}

.dark-style .bd-callout-info {
    background-color: rgba(95, 97, 230, 0.08) !important;
    border-left-color: #5f61e6 !important;
}

/* Modals */
.dark-style .modal-content {
    background-color: #232639 !important;
    color: #d4d6e1 !important;
    border-color: #2f3349 !important;
}

.dark-style .modal-header,
.dark-style .modal-footer {
    background-color: #2a2d42 !important;
    border-color: #2f3349 !important;
}

/* Accordions (Turmas) */
.dark-style .accordion-item {
    background-color: #232639 !important;
    color: #d4d6e1 !important;
    border-color: #2f3349 !important;
}

.dark-style .accordion-button {
    background-color: #2a2d42 !important;
    color: #d4d6e1 !important;
    border-color: #2f3349 !important;
}

.dark-style .accordion-button:not(.collapsed) {
    background-color: rgba(95, 97, 230, 0.16) !important;
    color: #8789ff !important;
    box-shadow: inset 0 -1px 0 #2f3349 !important;
}

.dark-style .accordion-button::after {
    filter: invert(1) brightness(2);
}

.dark-style .accordion-body {
    background-color: #232639 !important;
    color: #d4d6e1 !important;
}

.dark-style .accordion-header {
    border-color: #2f3349 !important;
}

/* Dropdowns */
.dark-style .dropdown-menu {
    background-color: #232639 !important;
    border-color: #2f3349 !important;
}

.dark-style .dropdown-item {
    color: #b4b7c9 !important;
}

.dark-style .dropdown-item:hover,
.dark-style .dropdown-item:focus {
    background-color: #2a2d42 !important;
    color: #fff !important;
}

/* Badges */
.dark-style .badge {
    background-color: #2a2d42 !important;
    color: #d4d6e1 !important;
}

.dark-style .badge.bg-success {
    background-color: #71dd37 !important;
    color: #fff !important;
}

.dark-style .badge.bg-danger {
    background-color: #ff3e1d !important;
    color: #fff !important;
}

.dark-style .bg-label-primary {
    background-color: rgba(95, 97, 230, 0.16) !important;
    color: #8789ff !important;
}

/* Text colors */
.dark-style .text-muted {
    color: #7e829a !important;
}

.dark-style h1,
.dark-style h2,
.dark-style h3,
.dark-style h4,
.dark-style h5,
.dark-style h6 {
    color: #d4d6e1 !important;
}

/* Footer */
.dark-style .footer {
    background-color: #232639 !important;
    color: #b4b7c9 !important;
}

/* Alerts */
.dark-style .alert {
    background-color: #2a2d42 !important;
    border-color: #2f3349 !important;
    color: #d4d6e1 !important;
}

.dark-style .alert-warning {
    background-color: rgba(255, 171, 0, 0.16) !important;
    border-color: rgba(255, 171, 0, 0.3) !important;
    color: #ffab00 !important;
}

/* Buttons - preserve original colors but adjust for dark background */
.dark-style .btn-primary {
    background-color: #5f61e6 !important;
    border-color: #5f61e6 !important;
}

.dark-style .btn-secondary {
    background-color: #6c757d !important;
    border-color: #6c757d !important;
}

.dark-style .btn-outline-secondary {
    color: #b4b7c9 !important;
    border-color: #2f3349 !important;
}

.dark-style .btn-outline-secondary:hover {
    background-color: #2a2d42 !important;
    color: #fff !important;
}

/* Action Toggle Buttons - Improved Contrast */
.dark-style .btn-icon,
.dark-style .btn-sm {
    background-color: #2a2d42 !important;
    border-color: #3a3f5c !important;
    color: #b4b7c9 !important;
}

.dark-style .btn-icon:hover,
.dark-style .btn-sm:hover {
    background-color: #3a3f5c !important;
    border-color: #4a4f6c !important;
    color: #fff !important;
}

.dark-style .btn-label-secondary {
    background-color: rgba(108, 117, 125, 0.16) !important;
    color: #b4b7c9 !important;
}

.dark-style .btn-label-secondary:hover {
    background-color: rgba(108, 117, 125, 0.3) !important;
    color: #fff !important;
}

/* Icon buttons in tables/cards */
.dark-style .btn-text-secondary,
.dark-style .btn-link {
    color: #b4b7c9 !important;
}

.dark-style .btn-text-secondary:hover,
.dark-style .btn-link:hover {
    color: #fff !important;
    background-color: rgba(255, 255, 255, 0.08) !important;
}

/* Dropdown toggle buttons */
.dark-style .dropdown-toggle::after {
    border-top-color: #b4b7c9 !important;
}

.dark-style .btn-group .btn {
    border-color: #3a3f5c !important;
}

.dark-style .btn-group .btn:hover {
    background-color: #3a3f5c !important;
}

/* DataTables */
.dark-style .dataTables_wrapper {
    color: #d4d6e1 !important;
}

.dark-style .dataTables_wrapper .dataTables_length,
.dark-style .dataTables_wrapper .dataTables_filter,
.dark-style .dataTables_wrapper .dataTables_info,
.dark-style .dataTables_wrapper .dataTables_paginate {
    color: #b4b7c9 !important;
}

/* DataTables - Improved table styling */
.dark-style table.dataTable {
    border-collapse: separate !important;
    border-spacing: 0 !important;
}

.dark-style table.dataTable thead th {
    background-color: #2a2d42 !important;
    color: #d4d6e1 !important;
    border-bottom: 2px solid #3a3f5c !important;
    font-weight: 600 !important;
}

.dark-style table.dataTable tbody td {
    border-top: 1px solid #2f3349 !important;
    border-bottom: 1px solid #2f3349 !important;
}

.dark-style table.dataTable tbody tr {
    background-color: #232639 !important;
}

.dark-style table.dataTable tbody tr:nth-child(even) {
    background-color: #1e2133 !important;
}

.dark-style table.dataTable tbody tr:hover {
    background-color: #2a2d42 !important;
}

/* DataTables pagination */
.dark-style .dataTables_wrapper .dataTables_paginate .paginate_button {
    color: #b4b7c9 !important;
    background-color: #232639 !important;
    border: 1px solid #2f3349 !important;
}

.dark-style .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    color: #fff !important;
    background-color: #2a2d42 !important;
    border: 1px solid #3a3f5c !important;
}

.dark-style .dataTables_wrapper .dataTables_paginate .paginate_button.current {
    color: #fff !important;
    background-color: #5f61e6 !important;
    border: 1px solid #5f61e6 !important;
}

/* DataTables search input */
.dark-style .dataTables_wrapper .dataTables_filter input {
    background-color: #2a2d42 !important;
    color: #d4d6e1 !important;
    border: 1px solid #2f3349 !important;
}

.dark-style .dataTables_wrapper .dataTables_filter input:focus {
    border-color: #5f61e6 !important;
    outline: none !important;
}

/* DataTables length select */
.dark-style .dataTables_wrapper .dataTables_length select {
    background-color: #2a2d42 !important;
    color: #d4d6e1 !important;
    border: 1px solid #2f3349 !important;
}

/* Scrollbar */
.dark-style ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

.dark-style ::-webkit-scrollbar-track {
    background: #1a1d2e;
}

.dark-style ::-webkit-scrollbar-thumb {
    background: #2f3349;
    border-radius: 4px;
}

.dark-style ::-webkit-scrollbar-thumb:hover {
    background: #3a3f5c;
}

/* Fix for preserving component colors */
.dark-style .preserve-color {
    background-color: inherit !important;
    /* Forces use of inline background-color if specified, but usually we just want to avoid the !important overrides */
}

/* Specific overrides for preserve-color class to counteract previous !important rules */
.dark-style .badge.preserve-color,
.dark-style .btn-icon.preserve-color,
.dark-style .btn.preserve-color {
    background-color: unset !important;
    /* Allows the inline style to take over */
}

/* Ensure white icons/text on preserve-color elements for better contrast */
.dark-style .preserve-color,
.dark-style .preserve-color i {
    color: #fff !important;
}

/* Dynamic Switch Color */
.form-check-input.preserve-color:checked {
    background-color: var(--switch-color, #696cff) !important;
    border-color: var(--switch-color, #696cff) !important;
}

.dark-style .form-check-input.preserve-color:checked {
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.4) !important;
}

/* ApexCharts Tooltips - Dark Mode */
.dark-style .apexcharts-tooltip {
    background: #2a2d42 !important;
    border: 1px solid #3a3f5c !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5) !important;
}

.dark-style .apexcharts-tooltip-title {
    background: #232639 !important;
    border-bottom: 1px solid #3a3f5c !important;
    color: #d4d6e1 !important;
}

.dark-style .apexcharts-tooltip-text,
.dark-style .apexcharts-tooltip-text-y-label,
.dark-style .apexcharts-tooltip-text-y-value,
.dark-style .apexcharts-tooltip-text-goals-label,
.dark-style .apexcharts-tooltip-text-goals-value,
.dark-style .apexcharts-tooltip-text-z-label,
.dark-style .apexcharts-tooltip-text-z-value {
    color: #d4d6e1 !important;
}

.dark-style .apexcharts-tooltip-series-group {
    background: transparent !important;
}

.dark-style .apexcharts-tooltip-marker {
    background-color: inherit !important;
}

/* ApexCharts Legend - Dark Mode */
.dark-style .apexcharts-legend-text {
    color: #d4d6e1 !important;
}

/* ApexCharts Data Labels - Dark Mode */
.dark-style .apexcharts-datalabel,
.dark-style .apexcharts-datalabel-label,
.dark-style .apexcharts-datalabel-value {
    fill: #d4d6e1 !important;
}