@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

:root {
    --bg-body: #09090b;
    --bg-card: #18181b;
    --bg-input: #27272a;
    --border-color: #27272a;
    --border-hover: #3f3f46;
    
    --text-primary: #f4f4f5;
    --text-muted: #a1a1aa;
    
    --accent-primary: #6366f1;
    --accent-hover: #4f46e5;
    
    --status-danger: #ef4444;
    --status-warning: #f59e0b;
    --status-success: #10b981;
}

body {
    background-color: var(--bg-body);
    color: var(--text-primary);
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    min-height: 100vh;
}

/* Navbar Elegante e Discreta */
.navbar {
    background-color: #121215 !important;
    border-bottom: 1px solid var(--border-color);
}

.navbar-brand {
    font-weight: 700;
    letter-spacing: -0.5px;
    color: #ffffff !important;
}

.navbar-brand span {
    color: var(--accent-primary);
}

/* Cards e Bloco de Dados */
.card {
    background-color: var(--bg-card) !important;
    border: 1px solid var(--border-color) !important;
    border-radius: 12px !important;
    color: var(--text-primary) !important;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.3), 0 2px 4px -2px rgba(0, 0, 0, 0.3);
    transition: border-color 0.2s ease, transform 0.2s ease;
}

a.card {
    text-decoration: none !important;
}

a.card:hover {
    border-color: var(--border-color) !important;
    transform: none !important;
}


.card-header {
    background-color: transparent !important;
    border-bottom: 1px solid var(--border-color) !important;
}

.card-footer {
    background-color: transparent !important;
    border-top: 1px solid var(--border-color) !important;
}

/* Tabelas e Listagens */
.table {
    color: var(--text-primary) !important;
    --bs-table-bg: transparent;
    --bs-table-border-color: var(--border-color);
}

.table thead th {
    background-color: #121215 !important;
    color: var(--text-muted);
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 600;
    border-bottom: 1px solid var(--border-color) !important;
}

.table tbody tr {
    border-bottom: 1px solid var(--border-color);
}

.table-hover tbody tr:hover {
    background-color: transparent !important;
}

/* Indicadores de Vencimento Otimizados para Dark Mode */
tr.table-danger,
tr.table-danger > td {
    --bs-table-bg: rgba(239, 68, 68, 0.15) !important;
    --bs-table-color: #ffffff !important;
    background-color: rgba(239, 68, 68, 0.15) !important;
    color: #ffffff !important;
}

tr.table-warning,
tr.table-warning > td {
    --bs-table-bg: rgba(245, 158, 11, 0.15) !important;
    --bs-table-color: #ffffff !important;
    background-color: rgba(245, 158, 11, 0.15) !important;
    color: #ffffff !important;
}

/* Destaque sutil ao passar o mouse */
.table-hover tbody tr.table-warning:hover,
.table-hover tbody tr.table-warning:hover > td {
    background-color: rgba(245, 158, 11, 0.15) !important;
}

.table-hover tbody tr.table-danger:hover,
.table-hover tbody tr.table-danger:hover > td {
    background-color: rgba(239, 68, 68, 0.15) !important;
}

/* Campos de Formulário e Filtros */
.form-control, .form-select {
    background-color: var(--bg-input) !important;
    border: 1px solid var(--border-color) !important;
    color: var(--text-primary) !important;
    border-radius: 8px !important;
}

.form-control:focus, .form-select:focus {
    border-color: var(--accent-primary) !important;
    box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.25) !important;
    color: #ffffff !important;
}

.form-control::placeholder {
    color: #71717a !important;
}

.form-select option {
    background-color: #18181b;
    color: #ffffff;
}

/* Botões */
.btn-primary {
    background-color: var(--accent-primary) !important;
    border-color: var(--accent-primary) !important;
    color: #ffffff !important;
    font-weight: 500;
    border-radius: 8px;
    transition: background-color 0.2s ease;
}

.btn-primary:hover {
    background-color: var(--accent-hover) !important;
    border-color: var(--accent-hover) !important;
}

.btn-warning {
    background-color: #d97706 !important;
    border-color: #d97706 !important;
    color: #ffffff !important;
    font-weight: 500;
    border-radius: 8px;
}

.btn-outline-primary {
    border-color: var(--border-hover) !important;
    color: var(--text-primary) !important;
    border-radius: 8px;
}

.btn-outline-primary:hover {
    background-color: #27272a !important;
    color: #ffffff !important;
}

.btn-outline-danger {
    border-color: rgba(239, 68, 68, 0.4) !important;
    color: #fca5a5 !important;
    border-radius: 8px;
}

.btn-outline-danger:hover {
    background-color: var(--status-danger) !important;
    color: #ffffff !important;
}

/* Tags de Status (Badges) */
.badge.text-bg-danger {
    background-color: rgba(239, 68, 68, 0.15) !important;
    color: #fca5a5 !important;
    border: 1px solid rgba(239, 68, 68, 0.3);
}

.badge.text-bg-warning {
    background-color: rgba(245, 158, 11, 0.15) !important;
    color: #fcd34d !important;
    border: 1px solid rgba(245, 158, 11, 0.3);
}

.badge.text-bg-success {
    background-color: rgba(16, 185, 129, 0.15) !important;
    color: #6ee7b7 !important;
    border: 1px solid rgba(16, 185, 129, 0.3);
}

.text-body-secondary {
    color: var(--text-muted) !important;
}
/* Otimização de Tabela Compacta */
.table td, .table th {
    padding: 0.6rem 0.75rem !important;
}

.table .btn-sm {
    padding: 0.2rem 0.55rem;
    font-size: 0.75rem;
}

.badge {
    font-weight: 500;
    letter-spacing: 0.2px;
}
/* Força o texto de todas as tabelas e células para branco puro */
.table, 
.table td, 
.table th, 
.table td div,
.table td .fw-semibold {
    color: #ffffff !important;
}

/* Corrige o texto escuro padrão do Bootstrap nas linhas de alerta (vencidos e próximos) */
tr.table-danger, 
tr.table-danger td, 
tr.table-danger td div,
tr.table-warning, 
tr.table-warning td,
tr.table-warning td div {
    color: #ffffff !important;
}

/* Mantém os detalhes secundários (lote e temperatura) em um cinza claro bem legível */
.table td .text-body-secondary {
    color: #cbd5e1 !important;
}
/* Estilização do Rodapé */
footer {
    border-top-color: var(--border-color) !important;
    background-color: var(--bg-body);
}

footer p {
    color: var(--text-muted) !important;
}

footer strong {
    color: var(--text-primary) !important;
}