/* static/style.css */
:root {
  /* Paleta principal: Preto, Branco e Vermelho */
  --katinu-red: #e30613;        /* Vermelho principal */
  --katinu-black: #181818;      /* Preto principal */
  --katinu-white: #fff;         /* Branco */
  --katinu-gray-dark: #232323;  /* Cinza escuro */
  --katinu-gray: #444;          /* Cinza médio */
  --katinu-gray-light: #2a2a2a; /* Cinza claro */
  --katinu-border: #333;        /* Borda */
  
  /* Cores neutras para harmonizar */
  --neutral-50: #f8f9fa;        /* Cinza muito claro */
  --neutral-100: #f1f3f4;       /* Cinza claro */
  --neutral-200: #e9ecef;       /* Cinza médio claro */
  --neutral-300: #dee2e6;       /* Cinza médio */
  --neutral-400: #adb5bd;       /* Cinza médio escuro */
  --neutral-500: #6c757d;       /* Cinza */
  --neutral-600: #495057;       /* Cinza escuro */
  --neutral-700: #343a40;       /* Cinza muito escuro */
  --neutral-800: #212529;       /* Cinza quase preto */
  --neutral-900: #181818;       /* Preto */
  
  /* Cores específicas para tipos de documento (harmonizadas) */
  --nfe-color: #28a745;         /* Verde para NFe */
  --nfce-color: #007bff;        /* Azul para NFCe */
  --sat-color: #ffc107;         /* Amarelo para SAT */
  
  /* Variáveis de tema */
  --bg-primary: #ffffff;
  --bg-secondary: var(--neutral-50);
  --bg-tertiary: var(--neutral-100);
  --text-primary: var(--katinu-black);
  --text-secondary: var(--neutral-600);
  --border-color: var(--neutral-200);
  --card-bg: #ffffff;
  --navbar-bg: var(--katinu-black);
  --navbar-text: #ffffff;
  --input-bg: #ffffff;
  --input-border: var(--neutral-300);
  --input-text: var(--katinu-black);
  --shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}

/* Tema Escuro */
[data-theme="dark"] {
  --bg-primary: var(--katinu-black);
  --bg-secondary: var(--katinu-gray-dark);
  --bg-tertiary: var(--katinu-gray-light);
  --text-primary: #ffffff;
  --text-secondary: #adb5bd;
  --border-color: var(--katinu-border);
  --card-bg: var(--katinu-gray-dark);
  --navbar-bg: var(--katinu-black);
  --navbar-text: #ffffff;
  --input-bg: var(--katinu-gray-light);
  --input-border: var(--katinu-border);
  --input-text: #ffffff;
  --shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.5);
  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.3), 0 4px 6px -2px rgba(0, 0, 0, 0.2);
  
  /* Cores específicas para tipos de documento no tema escuro */
  --nfe-color: #4caf50;         /* Verde mais claro para NFe */
  --nfce-color: #42a5f5;        /* Azul mais claro para NFCe */
  --sat-color: #ff9800;         /* Amarelo mais claro para SAT */
}

body {
  background: var(--bg-primary);
  color: var(--text-primary);
  padding-top: 56px;
  transition: background-color 0.3s ease, color 0.3s ease;
}

/* Evita qualquer rolagem horizontal acidental no mobile */
html, body {
  max-width: 100%;
  overflow-x: hidden;
}

.navbar {
  background: var(--navbar-bg) !important;
  color: var(--navbar-text);
  border-bottom: 2px solid var(--katinu-red);
  transition: background-color 0.3s ease, color 0.3s ease;
  white-space: nowrap; /* evita quebra de linha na navbar */
}

.navbar .navbar-brand {
  color: var(--navbar-text) !important;
}

.navbar .navbar-brand:hover {
  color: var(--navbar-text) !important;
}

.navbar .nav-link {
  color: var(--navbar-text) !important;
}

.navbar .nav-link:hover {
  color: var(--katinu-red) !important;
}

.navbar .navbar-toggler {
  border-color: var(--border-color);
}

.navbar .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(255, 255, 255, 0.75)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='m4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

/* Garante boa visibilidade do ícone no tema claro (navbar escura) */
[data-theme="light"] .navbar .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(255, 255, 255, 0.85)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='m4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

.navbar .navbar-brand img {
  height: 44px;
  margin-right: 12px;
  margin-left: 14px;
}

/* Menu de usuário */
.user-menu {
  position: relative;
  display: inline-block;
}

/* Garante que o menu do usuário não quebre linha ao lado da marca */
.navbar .container-fluid {
  display: flex;
  align-items: center;
}

.navbar .user-menu {
  margin-left: auto;
  flex-shrink: 0;
}

.user-menu-toggle {
  background: none;
  border: none;
  color: var(--navbar-text);
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 8px;
  transition: background-color 0.3s ease;
  cursor: pointer;
}

.user-menu-toggle:hover {
  background: var(--bg-secondary);
  color: var(--text-primary);
}

.user-avatar {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--katinu-red);
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-weight: bold;
  font-size: 14px;
  flex-shrink: 0;
}

.user-menu-dropdown {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  background: var(--card-bg);
  border: 1px solid var(--border-color);
  border-radius: 8px;
  box-shadow: var(--shadow);
  min-width: 220px;
  z-index: 1000;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-10px);
  transition: all 0.3s ease;
}

.user-menu-dropdown.show {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.user-menu-header {
  padding: 12px 16px;
  border-bottom: 1px solid var(--border-color);
  background: var(--bg-secondary);
  border-radius: 8px 8px 0 0;
}

.user-menu-header .user-name {
  font-weight: 600;
  color: var(--text-primary);
  margin: 0;
  font-size: 14px;
}

.user-menu-header .user-email {
  font-size: 12px;
  color: var(--text-secondary);
  margin: 0;
  margin-top: 2px;
}

.user-menu-items {
  padding: 8px 0;
}

.user-menu-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  color: var(--text-primary);
  text-decoration: none;
  transition: background-color 0.3s ease;
  font-size: 14px;
  width: 100%;
  border: none;
  background: none;
  cursor: pointer;
}

.user-menu-item:hover {
  background: var(--bg-secondary);
  color: var(--text-primary);
  text-decoration: none;
}

.user-menu-item i {
  width: 16px;
  text-align: center;
  color: var(--text-secondary);
}

.user-menu-divider {
  height: 1px;
  background: var(--border-color);
  margin: 8px 0;
}

/* Botão de tema */
.theme-toggle {
  background: none;
  border: none;
  color: var(--text-primary);
  padding: 8px 16px;
  border-radius: 6px;
  transition: background-color 0.3s ease;
  cursor: pointer;
  width: 100%;
  text-align: left;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-family: inherit;
  text-decoration: none;
  outline: none;
}

.theme-toggle:hover {
  background: var(--bg-secondary);
  color: var(--text-primary);
  text-decoration: none;
}

.theme-toggle:focus {
  outline: none;
}

.theme-toggle i {
  font-size: 16px;
  width: 16px;
  text-align: center;
  color: var(--text-secondary);
}

.card, .form-control, .form-select {
  border-radius: 0.5rem;
  border: 1px solid var(--border-color);
  transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

.card {
  background: var(--card-bg);
  color: var(--text-primary);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.form-control, .form-select {
  background: var(--input-bg);
  color: var(--input-text);
  border: 1px solid var(--input-border);
}

.form-control:focus, .form-select:focus {
  border-color: var(--katinu-red);
  box-shadow: 0 0 0 2px var(--katinu-red)33;
  background: var(--input-bg);
  color: var(--input-text);
}

.btn-primary, .btn-danger {
  background: var(--katinu-red);
  border-color: var(--katinu-red);
  color: var(--katinu-white);
}

.btn-primary:hover, .btn-danger:hover {
  background: #b0050f;
  border-color: #b0050f;
}

.btn-outline-secondary {
  border-color: var(--border-color);
  color: var(--text-primary);
  background: transparent;
}

.btn-outline-secondary:hover {
  background: var(--bg-secondary);
  color: var(--text-primary);
}

.alert-success { background: #1e4620; color: #b6fcb6; border-color: #2e7d32; }
.alert-danger { background: #4a1a1a; color: #ffb3b3; border-color: #e30613; }
.alert-info { background: var(--bg-secondary); color: var(--text-primary); border-color: var(--border-color); }

.table, .table-striped, .table-hover {
  background: var(--card-bg);
  color: var(--text-primary);
}

.table th, .table td {
  border-color: var(--border-color);
}

input[type="checkbox"], input[type="radio"] {
  accent-color: var(--katinu-red);
  border: 2px solid #666666 !important;
  border-radius: 3px !important;
  width: 18px !important;
  height: 18px !important;
  cursor: pointer;
  transition: all 0.2s ease;
}

input[type="checkbox"]:checked, input[type="radio"]:checked {
  border-color: var(--katinu-red) !important;
  background-color: var(--katinu-red) !important;
}

input[type="checkbox"]:hover, input[type="radio"]:hover {
  border-color: var(--katinu-red) !important;
  transform: scale(1.1);
}

/* Estilos específicos para checkboxes de arquivos */
.file-checkbox {
  border: 2px solid #666666 !important;
  border-radius: 3px !important;
  width: 18px !important;
  height: 18px !important;
  cursor: pointer;
  transition: all 0.2s ease;
}

.file-checkbox:checked {
  border-color: var(--katinu-red) !important;
  background-color: var(--katinu-red) !important;
}

.file-checkbox:hover {
  border-color: var(--katinu-red) !important;
  transform: scale(1.1);
}

/* Estilos para checkboxes de seleção em grupo */
.select-all-children {
  border: 2px solid #666666 !important;
  border-radius: 3px !important;
  width: 18px !important;
  height: 18px !important;
  cursor: pointer;
  transition: all 0.2s ease;
}

.select-all-children:checked {
  border-color: var(--katinu-red) !important;
  background-color: var(--katinu-red) !important;
}

.select-all-children:hover {
  border-color: var(--katinu-red) !important;
  transform: scale(1.1);
}

::-webkit-scrollbar {
  width: 10px;
  background: var(--bg-primary);
}

::-webkit-scrollbar-thumb {
  background: var(--bg-tertiary);
  border-radius: 5px;
}

/* Customização para acordeão, cards, etc. */
.empresa-group, .tipo-group, .periodo-group {
  background: var(--card-bg);
  border: 1px solid var(--border-color);
  border-radius: 0.5rem;
  transition: background-color 0.3s ease, border-color 0.3s ease;
}

.empresa-group > summary, .tipo-group > summary, .periodo-group > summary {
  color: var(--text-primary);
}

/* Permite quebra de linha e layout fluido dos sumários no mobile */
.empresa-group > summary,
.tipo-group > summary,
.periodo-group > summary {
  flex-wrap: wrap;
  white-space: normal;
  word-break: break-word;
  gap: 0.5rem;
  align-items: flex-start;
}

.file-list li {
  color: var(--text-primary);
}

.download-link-single {
  color: var(--katinu-red);
}

.download-link-single:hover {
  color: var(--text-primary);
}

/* Rodapé */
.footer {
  background: var(--navbar-bg);
  color: var(--navbar-text);
  border-top: 2px solid var(--katinu-red);
  padding: 1rem 0;
  margin-top: 2rem;
}

/* Estilo para a estrutura de pastas "Acordeão" do Dashboard */
.empresa-group {
    background: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: 0.5rem;
    margin-bottom: 1rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.empresa-group > summary {
    font-size: 1.2rem;
    font-weight: 500;
    padding: 1rem 1.25rem;
    cursor: pointer;
    list-style: none; /* Remove a seta padrão */
    color: var(--text-primary);
    background: rgba(128, 128, 128, 0.08); /* Fundo cinza bem claro para destacar */
    border-radius: 0.5rem 0.5rem 0 0;
    transition: background-color 0.3s ease;
}

[data-theme="dark"] .empresa-group > summary {
    background: rgba(255, 255, 255, 0.05); /* Fundo mais claro para tema escuro */
}

.empresa-group > summary:hover {
    background: rgba(128, 128, 128, 0.12);
}

[data-theme="dark"] .empresa-group > summary:hover {
    background: rgba(255, 255, 255, 0.08);
}

.empresa-group > summary::-webkit-details-marker { display: none; }

/* Fundo cinza clarinho para destacar as empresas */
.empresa-group > div {
    background: rgba(128, 128, 128, 0.03);
    border-radius: 0 0 0.5rem 0.5rem;
}

[data-theme="dark"] .empresa-group > div {
    background: rgba(255, 255, 255, 0.02);
}

.tipo-group, .periodo-group {
    margin: 0.5rem 1.5rem;
    border-left: 2px solid var(--border-color);
    padding-left: 1rem;
}
.tipo-group > summary, .periodo-group > summary {
    font-size: 1rem;
    padding: 0.75rem 1rem;
    cursor: pointer;
    list-style: none;
    display: flex;
    align-items: center;
    color: var(--text-primary);
}
.total-emitido {
    margin-left: 0.75rem;
    font-weight: 600;
    color: var(--text-secondary);
    padding: 0.15rem 0.4rem;
    border: none !important;
    background: transparent;
}
.tipo-group[data-tipo="NFe"] > summary .total-emitido { color: var(--nfe-color) !important; }
.tipo-group[data-tipo="NFCe"] > summary .total-emitido { color: var(--nfce-color) !important; }
.tipo-group[data-tipo="SAT"] > summary .total-emitido { color: var(--sat-color) !important; }
.tipo-group > summary::-webkit-details-marker,
.periodo-group > summary::-webkit-details-marker { display: none; }

.file-list {
    list-style: none;
    padding: 0.5rem 1rem 0.5rem 1.5rem;
    margin: 0;
}
/* Estilo para alinhar os botões de download totalmente à direita */
.file-list li {
    padding: 0.5rem 0;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    color: var(--text-primary);
    justify-content: space-between; /* Distribui o espaço entre o conteúdo e os botões */
}

.file-list li .file-info {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex: 1; /* Ocupa o espaço disponível */
}

.file-list li .file-actions {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto; /* Empurra para a direita */
}

.download-link-single {
    margin-left: 0;
    color: var(--text-secondary);
    font-size: 1.1rem;
}

/* Garante que os botões fiquem imediatamente antes do texto, sem empurrar para a direita */
.file-list li a.download-link-single { margin-left: 0 !important; }
.download-link-single:hover {
    color: var(--katinu-red);
}

/* Estilo da Tela de Carregamento */
#loading-overlay {
    position: fixed; top: 0; left: 0; width: 100%; height: 100%;
    background-color: rgba(33, 37, 41, 0.85);
    z-index: 1056;
    display: none; justify-content: center; align-items: center;
    flex-direction: column; color: white;
}
.spinner {
    width: 3.5rem; height: 3.5rem;
    border: 0.4rem solid rgba(255, 255, 255, 0.2);
    border-top-color: #fff;
    border-radius: 50%;
    animation: spin 1s linear infinite;
}
@keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }

.main-content-area {
    padding: 1.5rem;
}

/* Evita overflow horizontal na área principal */
.main-content-area {
  overflow-x: hidden;
}

/* Em telas grandes, o menu lateral do admin é fixo */
@media (min-width: 768px) {
    .sidebar {
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        z-index: 100;
        padding: 56px 0 0;
        box-shadow: inset -1px 0 0 rgba(0, 0, 0, .1);
    }
}

.sidebar-heading {
    font-size: .75rem;
    font-weight: bold;
    color: var(--text-secondary);
    text-transform: uppercase;
    padding: 0.5rem 1rem;
}

.sidebar .nav-link {
    font-weight: 500;
    color: var(--text-primary);
}
.sidebar .nav-link .fa-fw {
    width: 20px;
    text-align: center;
    margin-right: 0.25rem;
}
.sidebar .nav-link:hover, .sidebar .nav-link.active {
    color: var(--katinu-red);
}

.col-12 {
  flex: 0 0 auto;
  width: 100%;
}

.dashboard-bg {
  background: linear-gradient(319deg, var(--bg-primary) 70%, #e3061330 100%) !important;
  min-height: 100vh;
}

.bg-white {
  --bs-bg-opacity: 1;
  background: linear-gradient(319deg, var(--bg-primary) 60%, #ff00003d 100%);
}

.dashboard-bg h2, .dashboard-bg .fw-bold, .dashboard-bg h2.fw-bold {
  color: var(--text-primary) !important;
  text-shadow: 1px 1px 8px #000a, 0 2px 8px #fff2;
  font-weight: 900;
}

.form-control, .form-select {
  background: var(--input-bg) !important;
  color: var(--input-text) !important;
  border: 1px solid #495057 !important;
}

.summary-card .fw-semibold, .summary-card .fs-2, .summary-card .fs-6 {
  color: var(--text-primary) !important;
  text-shadow: 1px 1px 6px #000a;
}

.btn-primary, .btn-danger {
  background: var(--katinu-red) !important;
  border-color: var(--katinu-red) !important;
  color: var(--katinu-white) !important;
}

.bg-katinu-dark {
  background: var(--bg-primary) !important;
  border: 1px solid var(--border-color) !important;
  box-shadow: var(--shadow);
}

.dashboard-bg .card, .dashboard-bg .summary-card, .dashboard-bg .rounded-4, .dashboard-bg .p-4 {
  border: none !important;
  outline: none !important;
  box-shadow: var(--shadow);
}

.dashboard-bg .row.g-4,
.dashboard-bg .row.mb-4,
.dashboard-bg .row {
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
}

.dashboard-bg * {
  outline: none !important;
  border-color: transparent !important;
}



.empresas-graficos {
    display: flex;
    flex-wrap: wrap;
    gap: 32px;
    justify-content: flex-start;
    align-items: stretch;
}

.empresa-card {
    background: var(--card-bg);
    border: 1px solid var(--border-color);
    transition: all 0.3s ease;
}

.empresa-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 4px 15px rgba(227, 6, 19, 0.2);
}

.empresa-card .card-title {
    color: var(--text-primary);
    font-size: 1.1rem;
    font-weight: 600;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid var(--katinu-red);
    padding-bottom: 0.5rem;
}

.legenda-metodos {
    font-size: 0.85rem;
    color: var(--text-primary);
    padding: 0.5rem;
    border-left: 1px solid var(--border-color);
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.legenda-metodos .metodo-item {
    display: flex;
    align-items: center;
    margin-bottom: 0.5rem;
}

.legenda-metodos .metodo-cor {
    width: 12px;
    height: 12px;
    border-radius: 2px;
    margin-right: 8px;
}

.grafico-container {
    position: relative;
    width: 100%;
    height: 200px;
}

/* Responsividade */
@media (max-width: 768px) {
    .empresa-card .row {
        flex-direction: column;
    }
    
    .legenda-metodos {
        border-left: none;
        border-top: 1px solid var(--border-color);
        margin-top: 1rem;
        padding-top: 1rem;
    }
}

.relatorio-header {
    display: flex;
    align-items: center;
    gap: 24px;
}

/* Estilos para páginas Admin */
.sidebar {
  background: var(--card-bg);
  border-right: 1px solid var(--border-color);
  transition: background-color 0.3s ease, border-color 0.3s ease;
}

@media (min-width: 768px) {
  .sidebar {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    z-index: 100;
    padding: 56px 0 0;
    box-shadow: inset -1px 0 0 var(--border-color);
  }
}

.sidebar-heading {
  font-size: 0.75rem;
  font-weight: bold;
  color: var(--text-secondary);
  text-transform: uppercase;
  padding: 0.5rem 1rem;
  margin-bottom: 0.5rem;
  border-bottom: 1px solid var(--border-color);
}

.sidebar .nav-link {
  font-weight: 500;
  color: var(--text-primary);
  padding: 0.75rem 1rem;
  border-radius: 0;
  transition: all 0.3s ease;
  border-left: 3px solid transparent;
}

.sidebar .nav-link:hover {
  background: var(--bg-secondary);
  color: var(--katinu-red);
  border-left-color: var(--katinu-red);
}

.sidebar .nav-link.active {
  background: var(--bg-secondary);
  color: var(--katinu-red);
  border-left-color: var(--katinu-red);
  font-weight: 600;
}

.sidebar .nav-link .fa-fw {
  width: 20px;
  text-align: center;
  margin-right: 0.5rem;
}

/* Cards e tabelas admin */
.admin-card {
  background: var(--card-bg);
  border: 1px solid var(--border-color);
  border-radius: 0.5rem;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  transition: all 0.3s ease;
}

.admin-card:hover {
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);
}

.admin-card .card-header {
  background: var(--bg-secondary);
  border-bottom: 1px solid var(--border-color);
  padding: 1rem 1.25rem;
  font-weight: 600;
  color: var(--text-primary);
}

.admin-card .card-body {
  padding: 1.25rem;
}

/* Tabelas admin */
.admin-table {
  background: var(--card-bg);
  border-radius: 0.5rem;
  overflow: hidden;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.admin-table .table {
  margin-bottom: 0;
}

.admin-table .table thead th {
  background: var(--bg-secondary);
  border-bottom: 2px solid var(--border-color);
  color: var(--text-primary);
  font-weight: 600;
  text-transform: uppercase;
  font-size: 0.875rem;
  letter-spacing: 0.5px;
  padding: 1rem 0.75rem;
}

.admin-table .table tbody td {
  padding: 1rem 0.75rem;
  vertical-align: middle;
  border-bottom: 1px solid var(--border-color);
  color: var(--text-primary);
}

.admin-table .table tbody tr:hover {
  background: var(--bg-secondary);
}

/* Botões admin */
.admin-btn {
  border-radius: 0.375rem;
  font-weight: 500;
  padding: 0.5rem 1rem;
  transition: all 0.3s ease;
  border: 1px solid transparent;
}

.admin-btn-primary {
  background: var(--katinu-red);
  border-color: var(--katinu-red);
  color: var(--katinu-white);
}

.admin-btn-primary:hover {
  background: #b0050f;
  border-color: #b0050f;
  color: var(--katinu-white);
  transform: translateY(-1px);
  box-shadow: 0 4px 8px rgba(227, 6, 19, 0.3);
}

.admin-btn-secondary {
  background: var(--bg-secondary);
  border-color: var(--border-color);
  color: var(--text-primary);
}

.admin-btn-secondary:hover {
  background: var(--bg-tertiary);
  border-color: var(--border-color);
  color: var(--text-primary);
}

.admin-btn-outline {
  background: transparent;
  border-color: var(--border-color);
  color: var(--text-primary);
}

.admin-btn-outline:hover {
  background: var(--bg-secondary);
  border-color: var(--border-color);
  color: var(--text-primary);
}

[data-theme="dark"] .admin-btn-outline {
  border-color: var(--text-secondary); /* Garante contraste no tema escuro */
}

[data-theme="dark"] .admin-btn-outline:hover {
  background: var(--bg-tertiary);
  border-color: var(--text-primary);
}

/* Formulários admin */
.admin-form {
  background: var(--card-bg);
  border: 1px solid var(--border-color);
  border-radius: 0.5rem;
  padding: 1.5rem;
  box-shadow: var(--shadow);
}

.admin-form .form-label {
  font-weight: 600;
  color: var(--text-primary);
  margin-bottom: 0.5rem;
}

.admin-form .form-control,
.admin-form .form-select {
  border: 1px solid var(--border-color);
  border-radius: 0.375rem;
  padding: 0.75rem;
  background: var(--input-bg);
  color: var(--input-text);
  transition: all 0.3s ease;
}

.admin-form .form-control:focus,
.admin-form .form-select:focus {
  border-color: var(--katinu-red);
  box-shadow: 0 0 0 0.2rem rgba(227, 6, 19, 0.25);
  background: var(--input-bg);
  color: var(--input-text);
}

/* Alertas admin */
.admin-alert {
  border-radius: 0.5rem;
  border: 1px solid transparent;
  padding: 1rem 1.25rem;
  margin-bottom: 1.5rem;
}

.admin-alert-success {
  background: rgba(40, 167, 69, 0.1);
  border-color: rgba(40, 167, 69, 0.2);
  color: #28a745;
}

[data-theme="dark"] .admin-alert-success {
  color: #7ddc82; /* Verde mais claro para tema escuro */
}

.admin-alert-danger {
  background: rgba(220, 53, 69, 0.1);
  border-color: rgba(220, 53, 69, 0.2);
  color: #dc3545;
}

[data-theme="dark"] .admin-alert-danger {
  color: #ff8a96; /* Vermelho mais claro para tema escuro */
}

.admin-alert-info {
  background: rgba(23, 162, 184, 0.1);
  border-color: rgba(23, 162, 184, 0.2);
  color: #17a2b8;
}

[data-theme="dark"] .admin-alert-info {
  color: #6ce1f4; /* Azul mais claro para tema escuro */
}


/* Badges admin */
.admin-badge {
  padding: 0.375rem 0.75rem;
  border-radius: 0.375rem;
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.admin-badge-primary {
  background: var(--katinu-red);
  color: var(--katinu-white);
}

.admin-badge-secondary {
  background: var(--bg-secondary);
  color: var(--text-secondary);
  border: 1px solid var(--border-color);
}

.admin-badge-warning {
  background: #ffc107;
  color: #212529;
}

/* Responsividade admin */
@media (max-width: 768px) {
  .admin-card {
    margin-bottom: 1rem;
  }
  
  .admin-table {
    font-size: 0.875rem;
  }
  
  .admin-table .table thead th,
  .admin-table .table tbody td {
    padding: 0.75rem 0.5rem;
  }
}

/* Garante que a classe .text-muted do Bootstrap se adapte ao tema */
[data-theme="dark"] .text-muted {
  color: var(--text-secondary) !important;
}

/* Nome da empresa na tabela de empresas (modo escuro) - especificamente na coluna Razão Social */
[data-theme="dark"] .admin-table tbody td .text-muted {
  color: #adb5bd !important; /* Cinza mais escuro para melhor visibilidade no modo escuro */
}

/* Nome da empresa no modal de status das máquinas (modo escuro) */
[data-theme="dark"] #machine-popup strong {
  color: #adb5bd !important; /* Cinza mais escuro para melhor visibilidade no modo escuro */
}

/* Estilos específicos para tipos de documento */
.tipo-group[data-tipo="NFe"] {
  border-left-color: var(--nfe-color) !important;
}

.tipo-group[data-tipo="NFe"] > summary {
  color: var(--nfe-color) !important;
  font-weight: 600;
}

.tipo-group[data-tipo="NFe"] > summary i {
  color: var(--nfe-color) !important;
}

.tipo-group[data-tipo="NFCe"] {
  border-left-color: var(--nfce-color) !important;
}

.tipo-group[data-tipo="NFCe"] > summary {
  color: var(--nfce-color) !important;
  font-weight: 600;
}

.tipo-group[data-tipo="NFCe"] > summary i {
  color: var(--nfce-color) !important;
}

.tipo-group[data-tipo="SAT"] {
  border-left-color: var(--sat-color) !important;
}

.tipo-group[data-tipo="SAT"] > summary {
  color: var(--sat-color) !important;
  font-weight: 600;
}

.tipo-group[data-tipo="SAT"] > summary i {
  color: var(--sat-color) !important;
}

/* Hover effects para os grupos de tipo */
.tipo-group[data-tipo="NFe"]:hover {
  background: rgba(46, 125, 50, 0.05);
}

.tipo-group[data-tipo="NFCe"]:hover {
  background: rgba(25, 118, 210, 0.05);
}

.tipo-group[data-tipo="SAT"]:hover {
  background: rgba(245, 124, 0, 0.05);
}

[data-theme="dark"] .tipo-group[data-tipo="NFe"]:hover {
  background: rgba(76, 175, 80, 0.1);
}

[data-theme="dark"] .tipo-group[data-tipo="NFCe"]:hover {
  background: rgba(66, 165, 245, 0.1);
}

[data-theme="dark"] .tipo-group[data-tipo="SAT"]:hover {
  background: rgba(255, 152, 0, 0.1);
}

/* Estilo para os ícones de arquivo baseado no tipo */
.file-checkbox[data-tipo="NFe"] + i {
  color: var(--nfe-color) !important;
}

.file-checkbox[data-tipo="NFCe"] + i {
  color: var(--nfce-color) !important;
}

.file-checkbox[data-tipo="SAT"] + i {
  color: var(--sat-color) !important;
}

/* Estilo para os totais mensais baseado no tipo de documento */
.tipo-group[data-tipo="NFe"] .periodo-group summary .text-muted {
  color: var(--nfe-color) !important;
  font-weight: 600;
}

.tipo-group[data-tipo="NFCe"] .periodo-group summary .text-muted {
  color: var(--nfce-color) !important;
  font-weight: 600;
}

.tipo-group[data-tipo="SAT"] .periodo-group summary .text-muted {
  color: var(--sat-color) !important;
  font-weight: 600;
}

/* Animação girando para o botão Filtrar */
@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* Garantir que o botão Filtrar tenha posicionamento relativo */
#btn-filtrar {
  position: relative !important;
  width: 90px;
  font-size: 0.875rem;
  height: 38px;
  padding: 0.375rem 0.75rem;
  line-height: 1.5;
  border-radius: 0.375rem;
}

.btn-filter-loading {
  position: relative;
  pointer-events: none;
  opacity: 0.8;
}

.btn-filter-loading .btn-text {
  opacity: 0;
  transition: opacity 0.3s ease;
}

.btn-filter-loading i {
  opacity: 0;
  transition: opacity 0.3s ease;
}

.btn-filter-loading .btn-spinner {
  position: absolute;
  top: 30%;
  left: 37%;
  transform: translate(-50%, -50%);
  width: 20px;
  height: 20px;
  border: 3px solid rgba(255, 255, 255, 0.3);
  border-top: 3px solid white;
  border-radius: 50%;
  animation: spin 1s linear infinite;
  opacity: 1;
  display: block !important;
  margin: 0;
  padding: 0;
  z-index: 10;
}
/* Botão Limpar Filtro com mesmo tamanho */
#limpar-filtro {
  width: 90px;
  font-size: 0.875rem;
  height: 38px;
  padding: 0.375rem 0.75rem;
  line-height: 1.5;
  border-radius: 0.375rem;
}

.btn-spinner {
  display: none;
}

/* Botões de ação com largura igual */
.btn-action {
  min-width: 162px !important;
  width: auto !important;
}

/* Estilo para botão de download quando está carregando */
.btn-action:disabled {
  background: linear-gradient(135deg, var(--neutral-300), var(--neutral-400)) !important;
  color: #000000 !important; /* Letra preta quando carregando */
  border-color: var(--neutral-400) !important;
  box-shadow: none !important;
  cursor: not-allowed !important;
  transform: none !important;
}

/* Estilo específico para o botão de download quando está carregando */
#download-button:disabled {
  background: linear-gradient(135deg, var(--neutral-300), var(--neutral-400)) !important;
  color: #000000 !important; /* Letra preta quando carregando */
  border-color: var(--neutral-400) !important;
  box-shadow: none !important;
  cursor: not-allowed !important;
  transform: none !important;
}

/* Estilo mais específico para botão success quando desabilitado */
.btn-success:disabled,
.btn-success.btn-action:disabled,
#download-button.btn-success:disabled {
  background: linear-gradient(135deg, var(--neutral-300), var(--neutral-400)) !important;
  color: #000000 !important; /* Letra preta quando carregando */
  border-color: var(--neutral-400) !important;
  box-shadow: none !important;
  cursor: not-allowed !important;
  transform: none !important;
}

/* Regra ainda mais específica para garantir que o texto seja preto */
button.btn-success:disabled,
button#download-button:disabled,
button.btn-success.btn-action:disabled {
  color: #000000 !important;
  background: linear-gradient(135deg, var(--neutral-300), var(--neutral-400)) !important;
}

/* Regra para qualquer botão desabilitado na área de download */
#download-actions button:disabled {
  color: #000000 !important;
  background: linear-gradient(135deg, var(--neutral-300), var(--neutral-400)) !important;
}

/* Regra específica para o botão de download quando está carregando */
#download-button:disabled,
#download-button.btn-success:disabled,
#download-button.btn-action:disabled {
  color: #000000 !important;
  background: linear-gradient(135deg, #e9ecef, #adb5bd) !important;
  border-color: #adb5bd !important;
}

/* Regra com máxima especificidade para sobrescrever Bootstrap */
button#download-button.btn-success.btn-action:disabled,
button#download-button.btn-success:disabled,
button#download-button:disabled {
  color: #000000 !important;
  background: linear-gradient(135deg, #e9ecef, #adb5bd) !important;
  border-color: #adb5bd !important;
}

/* Regra para qualquer elemento com ID download-button quando desabilitado */
[id="download-button"]:disabled {
  color: #000000 !important;
  background: linear-gradient(135deg, #e9ecef, #adb5bd) !important;
  border-color: #adb5bd !important;
}

/* Regras específicas para o botão de exportar Excel quando está carregando */
#export-excel-button:disabled,
#export-excel-button.btn-success:disabled,
#export-excel-button.btn-action:disabled {
  color: #000000 !important;
  background: linear-gradient(135deg, #e9ecef, #adb5bd) !important;
  border-color: #adb5bd !important;
}

/* Regra com máxima especificidade para sobrescrever Bootstrap - Excel */
button#export-excel-button.btn-success.btn-action:disabled,
button#export-excel-button.btn-success:disabled,
button#export-excel-button:disabled {
  color: #000000 !important;
  background: linear-gradient(135deg, #e9ecef, #adb5bd) !important;
  border-color: #adb5bd !important;
}

/* Regra para qualquer elemento com ID export-excel-button quando desabilitado */
[id="export-excel-button"]:disabled {
  color: #000000 !important;
  background: linear-gradient(135deg, #e9ecef, #adb5bd) !important;
  border-color: #adb5bd !important;
}

/* Barra de ações fixa e estados disabled */
#download-actions {
  position: sticky;
  top: 56px; /* altura da navbar */
  z-index: 1020;
}

#download-actions .btn:disabled,
#download-actions .btn.disabled {
  background: linear-gradient(135deg, var(--neutral-300), var(--neutral-400)) !important;
  color: #eaecef !important;
  box-shadow: none !important;
  cursor: not-allowed !important;
  transform: none !important;
}

/* Botões fixos na primeira tela */
.fixed-action-buttons {
  position: sticky;
  top: 70px;
  background: var(--card-bg);
  border: 1px solid var(--border-color);
  border-radius: 12px;
  padding: 1rem;
  margin-bottom: 1.5rem;
  box-shadow: var(--shadow-lg);
  z-index: 100;
  backdrop-filter: blur(10px);
  border-top: 3px solid var(--katinu-red);
}

.fixed-action-buttons .btn {
  border-radius: 8px;
  font-weight: 600;
  padding: 0.75rem 1.5rem;
  transition: all 0.3s ease;
  border: none;
  position: relative;
  overflow: hidden;
}

.fixed-action-buttons .btn::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
  transition: left 0.5s;
}

.fixed-action-buttons .btn:hover::before {
  left: 100%;
}

.fixed-action-buttons .btn-download {
  background: linear-gradient(135deg, var(--katinu-red), #b0050f);
  color: white;
  box-shadow: 0 4px 15px rgba(227, 6, 19, 0.3);
}

.fixed-action-buttons .btn-download:hover {
  background: linear-gradient(135deg, #b0050f, #900409);
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(227, 6, 19, 0.4);
}

.fixed-action-buttons .btn-export {
  background: linear-gradient(135deg, var(--katinu-black), var(--katinu-gray-dark));
  color: white;
  box-shadow: 0 4px 15px rgba(35, 35, 35, 0.3);
}

.fixed-action-buttons .btn-export:hover {
  background: linear-gradient(135deg, var(--katinu-gray-dark), var(--katinu-gray));
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(35, 35, 35, 0.4);
}

.fixed-action-buttons .btn-zip {
  background: linear-gradient(135deg, var(--neutral-600), var(--neutral-700));
  color: white;
  box-shadow: 0 4px 15px rgba(73, 80, 87, 0.3);
}

.fixed-action-buttons .btn-zip:hover {
  background: linear-gradient(135deg, var(--neutral-700), var(--neutral-800));
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(73, 80, 87, 0.4);
}

/* Modal melhorado */
.modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(24, 24, 24, 0.8);
  backdrop-filter: blur(8px);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9999;
  animation: fadeIn 0.3s ease;
}

.modal-content {
  background: var(--card-bg);
  border-radius: 16px;
  padding: 0;
  max-width: 500px;
  width: 90%;
  max-height: 80vh;
  overflow: hidden;
  box-shadow: var(--shadow-lg);
  border: 1px solid var(--border-color);
  animation: slideIn 0.3s ease;
}

.modal-header {
  background: linear-gradient(135deg, var(--katinu-red), #b0050f);
  color: white;
  padding: 1.5rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid var(--border-color);
}

.modal-header.modal-header-success {
  background: linear-gradient(135deg, #28a745, #20c997);
}

.modal-header h3 {
  margin: 0;
  font-size: 1.25rem;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.modal-close {
  background: none;
  border: none;
  color: white;
  font-size: 1.5rem;
  cursor: pointer;
  padding: 0.25rem;
  border-radius: 6px;
  transition: background-color 0.3s ease;
}

.modal-close:hover {
  background: rgba(255, 255, 255, 0.1);
}

.modal-body {
  padding: 1.5rem;
  color: var(--text-primary);
  line-height: 1.6;
}

.modal-body .file-info {
  background: var(--bg-secondary);
  border: 1px solid var(--border-color);
  border-radius: 8px;
  padding: 1rem;
  margin: 1rem 0;
  font-family: 'Courier New', monospace;
  font-size: 0.9rem;
  color: var(--text-secondary);
}

.modal-actions {
  display: flex;
  gap: 0.75rem;
  margin-top: 1.5rem;
}

.modal-btn {
  flex: 1;
  padding: 0.75rem 1rem;
  border: none;
  border-radius: 8px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.3s ease;
  text-decoration: none;
  text-align: center;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
}

.modal-btn-primary {
  background: linear-gradient(135deg, #26b15e);
  color: white;
}

.modal-btn-primary:hover {
  background: linear-gradient(135deg, #26b15e);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(43, 227, 6, 0.3);
}

.modal-btn-secondary {
  background: var(--bg-secondary);
  color: var(--text-primary);
  border: 1px solid var(--border-color);
}

.modal-btn-secondary:hover {
  background: var(--bg-tertiary);
  transform: translateY(-1px);
}

.modal-btn-copy {
  background: linear-gradient(135deg, var(--katinu-black), var(--katinu-gray-dark));
  color: white;
}

.modal-btn-copy:hover {
  background: linear-gradient(135deg, var(--katinu-gray-dark), var(--katinu-gray));
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(35, 35, 35, 0.3);
}

/* Animações */
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes slideIn {
  from { 
    opacity: 0;
    transform: translateY(-20px) scale(0.95);
  }
  to { 
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

/* Responsividade para botões fixos */
@media (max-width: 768px) {
  .fixed-action-buttons {
    position: relative;
    top: 0;
    margin-bottom: 1rem;
  }
  
  .fixed-action-buttons .btn {
    padding: 0.5rem 1rem;
    font-size: 0.875rem;
  }
  
  .modal-content {
    width: 95%;
    margin: 1rem;
  }
  
  .modal-actions {
    flex-direction: column;
  }
}

/* ===== Ajustes extras de responsividade ===== */
/* Melhor rolagem nas tabelas em mobile */
.table-responsive {
  -webkit-overflow-scrolling: touch;
}

/* Quebra segura de nomes longos de arquivos */
.file-list li .file-info {
  min-width: 0;
}

.file-list li .file-info span {
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* Scroll horizontal no mobile para manter linha completa */
@media (max-width: 576px) {
  .main-content-area {
    padding: 1rem;
  }

  .navbar .navbar-brand img {
    height: 32px;
  }

  /* Container com scroll horizontal para file-list no mobile */
  .file-list {
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch; /* Scroll suave no iOS */
    scrollbar-width: thin; /* Scrollbar fina no Firefox */
  }

  .file-list::-webkit-scrollbar {
    height: 6px;
  }

  .file-list::-webkit-scrollbar-thumb {
    background: var(--bg-tertiary);
    border-radius: 3px;
  }

  /* Manter linha horizontal completa no mobile */
  .file-list li {
    flex-direction: row; /* Mantém horizontal */
    align-items: center;
    min-width: max-content; /* Não comprime o conteúdo */
    width: max-content; /* Largura baseada no conteúdo */
  }

  .file-list li .file-info {
    white-space: nowrap; /* Não quebra o texto */
    min-width: 0;
    flex-shrink: 0; /* Não encolhe */
  }

  .file-list li .file-actions {
    margin-left: auto;
    margin-top: 0;
    flex-shrink: 0; /* Não encolhe */
  }

  .btn-action {
    min-width: auto !important;
    width: 100% !important;
  }

  .user-menu-dropdown {
    max-width: calc(100vw - 16px);
    width: 90vw;
  }

  /* Força ações do período a irem para a linha de baixo quando necessário */
  .periodo-group summary .ms-auto {
    width: 100%;
    margin-left: 0 !important;
    margin-top: 0.25rem;
    justify-content: flex-start;
  }
}

/* Permitir quebra dos botões do filtro quando necessário */
#filtro-arquivos-form .d-flex {
  flex-wrap: wrap;
}