/**
 * PowerBI Color Theme
 * Paleta de cores baseada no PowerBI
 */

:root {
    /* Cores principais */
    --powerbi-green-primary: #19AB40;
    --powerbi-green-secondary: #9FDC37;
    --powerbi-green-tertiary: #63D43C;

    /* Cinzas */
    --powerbi-gray: #808080;
    --powerbi-gray-light: #C8C8CA;
    --powerbi-gray-lighter: #B6B6BA;

    /* Fundos */
    --powerbi-bg-white: #FFFFFF;
    --powerbi-bg-light-1: #FEFEFE;
    --powerbi-bg-light-2: #FCFCFC;
    --powerbi-bg-light-3: #FDFDFD;
    --powerbi-bg-light-4: #F9F9F9;
    --powerbi-bg-light-5: #F0F0F0;
    --powerbi-bg-light-6: #E6E6E6;
    --powerbi-bg-light-7: #E5E5E5;
    --powerbi-bg-light-8: #E4E4E4;
    --powerbi-bg-light-9: #E3E3E3;
    --powerbi-bg-light-10: #E2E2E2;
    --powerbi-bg-light-11: #E1E1E1;
    --powerbi-bg-light-12: #DFDFDF;
    --powerbi-bg-light-13: #D9D9D9;
}

/* Botões primários */
.btn-primary,
.btn-outline-primary.active,
.btn-outline-primary:active,
.btn-outline-primary:hover {
    background-color: var(--powerbi-green-primary) !important;
    border-color: var(--powerbi-green-primary) !important;
    color: #fff !important;
}

.btn-outline-primary {
    color: var(--powerbi-green-primary) !important;
    border-color: var(--powerbi-green-primary) !important;
}

/* Botões de sucesso */
.btn-success {
    background-color: var(--powerbi-green-primary) !important;
    border-color: var(--powerbi-green-primary) !important;
}

/* Badges */
.badge-primary {
    background-color: var(--powerbi-green-primary) !important;
}

.badge-success {
    background-color: var(--powerbi-green-primary) !important;
}

/* Textos coloridos */
.text-primary {
    color: var(--powerbi-green-primary) !important;
}

.text-success {
    color: var(--powerbi-green-primary) !important;
}

.text-info {
    color: var(--powerbi-green-tertiary) !important;
}

.text-warning {
    color: var(--powerbi-green-secondary) !important;
}

.text-secondary {
    color: var(--powerbi-gray) !important;
}

/* Backgrounds */
.bg-primary {
    background-color: var(--powerbi-green-primary) !important;
}

.bg-success {
    background-color: var(--powerbi-green-primary) !important;
}

.bg-light {
    background-color: var(--powerbi-bg-light-4) !important;
}

/* Borders */
.border-primary {
    border-color: var(--powerbi-green-primary) !important;
}

.border-success {
    border-color: var(--powerbi-green-primary) !important;
}

/* Links */
a {
    color: var(--powerbi-green-primary);
}

a:hover {
    color: var(--powerbi-green-tertiary);
}

/* Progress bars */
.progress-bar {
    background-color: var(--powerbi-green-primary) !important;
}

/* Alerts */
.alert-success {
    background-color: rgba(25, 171, 64, 0.1) !important;
    border-color: var(--powerbi-green-primary) !important;
    color: var(--powerbi-green-primary) !important;
}

/* Forms */
.form-control:focus {
    border-color: var(--powerbi-green-primary) !important;
    box-shadow: 0 0 0 0.2rem rgba(25, 171, 64, 0.25) !important;
}

.form-check-input:checked {
    background-color: var(--powerbi-green-primary) !important;
    border-color: var(--powerbi-green-primary) !important;
}

/* Tables */
.table-hover tbody tr:hover {
    background-color: var(--powerbi-bg-light-4) !important;
}

/* Table Headers - cinza claro (1 tom mais claro) - SEM quebra de linha */
table thead th,
table thead td,
.table thead th,
.table thead td {
    background-color: #6c757d !important;
    background-image: linear-gradient(195deg, #7d8a96, #6c757d) !important;
    color: #ffffff !important;
    border-color: #5a6268 !important;
    white-space: nowrap !important;
    word-wrap: normal !important;
    overflow-wrap: normal !important;
}

/* Table headers variações - maior especificidade */
table thead,
thead {
    background-color: #6c757d !important;
    color: #ffffff !important;
}

table thead th,
table thead td,
thead th,
thead td {
    background-color: #6c757d !important;
    background-image: linear-gradient(195deg, #7d8a96, #6c757d) !important;
    color: #ffffff !important;
    border-color: #5a6268 !important;
    white-space: nowrap !important;
    word-wrap: normal !important;
    overflow-wrap: normal !important;
}

/* Tabelas com classe específica */
.table-dark thead th,
.table-dark thead td,
table.table-dark thead th,
table.table-dark thead td {
    background-color: #6c757d !important;
    background-image: linear-gradient(195deg, #7d8a96, #6c757d) !important;
    color: #ffffff !important;
    white-space: nowrap !important;
    word-wrap: normal !important;
    overflow-wrap: normal !important;
}

/* Forçar em todos os th e td dentro de thead */
thead > tr > th,
thead > tr > td,
table thead > tr > th,
table thead > tr > td {
    white-space: nowrap !important;
    word-wrap: normal !important;
    overflow-wrap: normal !important;
}

/* Bordas das células */
.table th,
.table td {
    border-color: var(--powerbi-bg-light-6) !important;
}

/* Linhas zebradas */
.table-striped > tbody > tr:nth-of-type(odd) > * {
    background-color: var(--powerbi-bg-light-4) !important;
}

/* Nav tabs e pills */
.nav-pills .nav-link {
    color: #6c757d !important;
    font-weight: 600 !important;
}

.nav-pills .nav-link.active {
    background-color: #5a6268 !important;
    color: #ffffff !important;
}

.nav-tabs .nav-link {
    color: #6c757d !important;
    font-weight: 600 !important;
    white-space: nowrap !important;
}

.nav-tabs .nav-link.active {
    color: #343a40 !important;
    font-weight: 700 !important;
    border-bottom-color: #343a40 !important;
    border-bottom-width: 3px !important;
}

.nav-tabs .nav-link:hover {
    color: #495057 !important;
}

/* Cards - Efeito flutuante */
.card {
    background-color: var(--powerbi-bg-white);
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important;
    transition: box-shadow 0.3s ease, transform 0.3s ease;
}

/* Hover apenas em cards que não contém dropdowns abertos ou modais */
.card:hover:not(:has(.dropdown.show)):not(:has(.dropdown-menu.show)):not(:has(.modal)) {
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important;
    transform: translateY(-2px);
}

/* Desabilitar hover em cards com elementos interativos ativos */
.card:has(.dropdown-menu.show),
.card:has(.modal.show) {
    pointer-events: none;
}

/* Mas manter pointer events nos elementos internos */
.card:has(.dropdown-menu.show) *,
.card:has(.modal.show) * {
    pointer-events: auto;
}

/* Estilos específicos para modais - evitar conflitos */
.modal {
    pointer-events: auto !important;
}

.modal-content {
    pointer-events: auto !important;
}

.modal-dialog {
    pointer-events: auto !important;
}

/* Desabilitar hover em modais */
.modal:hover,
.modal-content:hover,
.modal-dialog:hover {
    transform: none !important;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important;
}

/* Garantir que modais não sejam afetados por transições de cards */
.modal,
.modal-content,
.modal-dialog,
.modal-backdrop {
    transition: none !important;
    transform: none !important;
}

/* Estabilizar posicionamento do modal */
.modal-dialog {
    margin: 1.75rem auto !important;
    position: relative !important;
}

/* Estilos específicos para modal de exportação */
#exportModal {
    z-index: 1055 !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
}

#exportModal .modal-dialog {
    margin: 1.75rem auto !important;
    max-width: 800px !important;
    width: 90% !important;
    position: relative !important;
    transform: none !important;
    transition: none !important;
}

#exportModal .modal-content {
    border: none !important;
    border-radius: 0.5rem !important;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
    position: relative !important;
    transform: none !important;
    transition: none !important;
}

/* Prevenir flickering em elementos do modal */
#exportModal * {
    transition: none !important;
    transform: none !important;
}

#exportModal .form-control,
#exportModal .form-select {
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out !important;
}

/* Estabilizar backdrop */
#exportModal .modal-backdrop {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    z-index: 1050 !important;
    width: 100vw !important;
    height: 100vh !important;
    background-color: rgba(0, 0, 0, 0.5) !important;
}

/* Prevenir hover em elementos do modal */
#exportModal:hover,
#exportModal .modal-dialog:hover,
#exportModal .modal-content:hover,
#exportModal .modal-body:hover,
#exportModal .modal-header:hover,
#exportModal .modal-footer:hover {
    transform: none !important;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
}

/* Isolar modal de outros elementos */
#exportModal {
    pointer-events: auto !important;
}

#exportModal .modal-dialog {
    pointer-events: auto !important;
}

#exportModal .modal-content {
    pointer-events: auto !important;
}

/* Prevenir interferência de cards */
body:has(#exportModal.show) .card {
    pointer-events: none !important;
}

body:has(#exportModal.show) .card * {
    pointer-events: none !important;
}

/* Manter interatividade apenas no modal */
body:has(#exportModal.show) #exportModal,
body:has(#exportModal.show) #exportModal * {
    pointer-events: auto !important;
}

.card-header {
    background-color: var(--powerbi-bg-light-4);
    border-bottom-color: var(--powerbi-bg-light-6);
}

/* Dropdowns */
.dropdown-item:hover,
.dropdown-item:focus {
    background-color: var(--powerbi-bg-light-4);
    color: var(--powerbi-green-primary);
}

.dropdown-item.active {
    background-color: var(--powerbi-green-primary);
}

/* Pagination */
.page-link {
    color: var(--powerbi-green-primary);
}

.page-link:hover {
    color: var(--powerbi-green-tertiary);
    background-color: var(--powerbi-bg-light-4);
}

.page-item.active .page-link {
    background-color: var(--powerbi-green-primary);
    border-color: var(--powerbi-green-primary);
}

/* Spinners */
.spinner-border {
    color: var(--powerbi-green-primary) !important;
}

/* Icons */
.fa-primary,
.text-primary i {
    color: var(--powerbi-green-primary) !important;
}

/* Chart.js overrides */
canvas {
    /* As cores dos gráficos serão aplicadas via JavaScript */
}

/* Marketplace filter buttons - Cinza */
.marketplace-filter-group .btn-outline-primary {
    border-color: #6c757d !important;
    color: #6c757d !important;
}

.marketplace-filter-group .btn-outline-primary:hover {
    background-color: rgba(108, 117, 125, 0.1) !important;
    border-color: #5a6268 !important;
    color: #5a6268 !important;
}

.marketplace-filter-group .btn-outline-primary.active {
    background-color: #6c757d !important;
    border-color: #6c757d !important;
    color: white !important;
}

/* Ajuste específico para botões de filtro no dashboard - Cinza */
.btn-outline-primary {
    border-color: #6c757d !important;
    color: #6c757d !important;
}

.btn-outline-primary:hover {
    background-color: rgba(108, 117, 125, 0.1) !important;
    border-color: #5a6268 !important;
    color: #5a6268 !important;
}

.btn-outline-primary.active,
.btn-outline-primary:active {
    background-color: #6c757d !important;
    border-color: #6c757d !important;
    color: white !important;
}

/* Sidebar */
.sidenav .nav-link.active {
    background-color: rgba(25, 171, 64, 0.1);
    color: var(--powerbi-green-primary) !important;
}

.sidenav .nav-link.active i {
    color: var(--powerbi-green-primary) !important;
}

.sidenav .nav-link:hover {
    background-color: rgba(25, 171, 64, 0.05);
}

/* Gradientes */
.bg-gradient-primary {
    background: linear-gradient(310deg, var(--powerbi-green-primary), var(--powerbi-green-tertiary)) !important;
}

.bg-gradient-success {
    background: linear-gradient(310deg, var(--powerbi-green-primary), var(--powerbi-green-tertiary)) !important;
}

/* ============================================
   NAVBAR SUPERIOR (TOP NAV BAR)
   ============================================ */

/* Navbar principal - fundo cinza médio (1 tom mais claro) */
#topnavMain.navbar-dark {
    background-color: #5a6268 !important;
    background-image: linear-gradient(195deg, #6c757d, #5a6268) !important;
}

#topnavMain.bg-dark {
    background-color: #5a6268 !important;
    background-image: linear-gradient(195deg, #6c757d, #5a6268) !important;
}

/* Links da navbar */
#topnavMain .nav-link {
    color: rgba(255, 255, 255, 0.85) !important;
    transition: all 0.15s ease-in;
}

#topnavMain .nav-link:hover,
#topnavMain .nav-link:focus {
    color: #ffffff !important;
    background-color: rgba(255, 255, 255, 0.1);
}

#topnavMain .nav-link.active {
    color: #ffffff !important;
    background-color: rgba(255, 255, 255, 0.15);
}

/* Dropdown toggle na navbar */
#topnavMain .dropdown-toggle {
    color: rgba(255, 255, 255, 0.85) !important;
}

#topnavMain .dropdown-toggle:hover {
    color: #ffffff !important;
}

/* Logo e brand */
#topnavMain .navbar-brand {
    color: #ffffff !important;
}

/* Navbar toggler (mobile) */
#topnavMain .navbar-toggler {
    border-color: rgba(255, 255, 255, 0.3);
}

#topnavMain .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.85%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

/* Dropdown menu da navbar */
#topnavMain .dropdown-menu {
    background-color: #ffffff;
    border: 1px solid var(--powerbi-bg-light-6);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

#topnavMain .dropdown-item {
    color: #344767;
}

#topnavMain .dropdown-item:hover,
#topnavMain .dropdown-item:focus {
    background-color: var(--powerbi-bg-light-4);
    color: var(--powerbi-green-primary);
}

#topnavMain .dropdown-item.active {
    background-color: var(--powerbi-green-primary);
    color: #ffffff;
}

/* Badges na navbar */
#topnavMain .badge {
    background-color: var(--powerbi-green-primary) !important;
}

/* User avatar/icon na navbar */
#topnavMain .avatar {
    border: 2px solid rgba(255, 255, 255, 0.3);
}

/* Notificações */
#topnavMain .notification-badge {
    background-color: var(--powerbi-green-primary) !important;
    color: #ffffff;
}

/* Submenu */
#topnavMain .dropdown-submenu > a::after {
    border-left-color: rgba(0, 0, 0, 0.5);
}

#topnavMain .dropdown-submenu:hover > a::after {
    border-left-color: var(--powerbi-green-primary);
}

/* ============================================
   HEADER/HERO SECTION
   ============================================ */

/* Hero section - cinza ainda mais claro (2 tons mais claro que o original) */
.bg-dark-blue {
    background-color: #8a96a3 !important;
    background-image: linear-gradient(195deg, #97a3b0, #8a96a3) !important;
}

/* Variações de hero */
.bg-gradient-dark {
    background: linear-gradient(195deg, #97a3b0, #8a96a3) !important;
}

/* Overlay escuro para imagens de hero */
.bg-dark-blue::before {
    background: linear-gradient(195deg, rgba(138, 150, 163, 0.9), rgba(125, 138, 150, 0.9));
}

/* ============================================
   MODAIS
   ============================================ */

/* Modal Header */
.modal-header {
    background-color: #7d8a96 !important;
    background-image: linear-gradient(195deg, #8a96a3, #7d8a96) !important;
    color: #ffffff !important;
    border-bottom: 1px solid #6c757d !important;
}

.modal-title {
    color: #ffffff !important;
}

.modal-header .btn-close {
    filter: brightness(0) invert(1);
    opacity: 0.8;
}

.modal-header .btn-close:hover {
    opacity: 1;
}

/* Modal Content */
.modal-content {
    border: 1px solid var(--powerbi-bg-light-6);
    border-radius: 0.5rem;
}

/* Modal Footer */
.modal-footer {
    border-top: 1px solid var(--powerbi-bg-light-6);
}

/* Botões dentro do modal */
.modal .btn-primary {
    background-color: var(--powerbi-green-primary) !important;
    border-color: var(--powerbi-green-primary) !important;
}

.modal .btn-secondary,
.modal .btn-outline-secondary {
    background-color: #6c757d !important;
    border-color: #6c757d !important;
    color: #ffffff !important;
}

.modal .btn-secondary:hover,
.modal .btn-outline-secondary:hover {
    background-color: #5a6268 !important;
    border-color: #5a6268 !important;
}

/* Botão Limpar/Cancelar - Branco */
.btn-outline-secondary,
button[class*="Limpar"],
button[class*="Cancelar"],
button[type="button"][class*="limpar" i] {
    background-color: #ffffff !important;
    border-color: #dee2e6 !important;
    color: #6c757d !important;
}

.btn-outline-secondary:hover,
button[class*="Limpar"]:hover,
button[class*="Cancelar"]:hover,
button[type="button"][class*="limpar" i]:hover {
    background-color: #f8f9fa !important;
    border-color: #6c757d !important;
    color: #495057 !important;
}

/* Texto informativo de período - Cinza escuro/Preto com fundo branco */
.text-success small,
small.text-success,
.period-info,
.filter-info {
    color: #212529 !important;
    background-color: #ffffff !important;
    padding: 4px 10px !important;
    border-radius: 6px !important;
    font-weight: 600 !important;
    border: 1px solid #dee2e6 !important;
    display: inline-block !important;
}

/* Especificamente para o indicador de período do dashboard na navbar */
#topnavMain small.text-success {
    color: #212529 !important;
    background-color: #ffffff !important;
    padding: 4px 10px !important;
    border-radius: 6px !important;
    font-weight: 600 !important;
    border: 1px solid #dee2e6 !important;
}

/* Indicador de período na página de pedidos */
.text-dark small,
small.text-dark {
    color: #212529 !important;
    background-color: #ffffff !important;
    padding: 4px 10px !important;
    border-radius: 6px !important;
    font-weight: 600 !important;
    border: 1px solid #dee2e6 !important;
    display: inline-block !important;
}

/* Swal2 (SweetAlert) Modals */
.swal2-popup {
    border: 1px solid var(--powerbi-bg-light-6);
}

.swal2-title {
    color: #344767 !important;
}

.swal2-confirm {
    background-color: var(--powerbi-green-primary) !important;
    border-color: var(--powerbi-green-primary) !important;
}

.swal2-cancel {
    background-color: #6c757d !important;
    border-color: #6c757d !important;
}

.swal2-cancel:hover {
    background-color: #5a6268 !important;
}