/* =============================================
   TEMA EXPOSITORES BUENO — LIGHT MODE COMPLETO
   Versão 2 — override das variáveis dark do app
   Carregado APÓS o <style> inline (antes de </head>)
   ============================================= */

/* OVERRIDE das variáveis dark do app */
:root {
  --bg:       #F0F4F8;
  --bg2:      #FFFFFF;
  --bg3:      #F0F4F8;
  --line:     #D8E3EE;
  --text:     #1C2E3F;
  --text2:    #2D3F4F;
  --text3:    #5A6F85;
  --orange:   #F5A623;
  --orange2:  #D4891A;
  --blue:     #1B4F8A;
  --blue2:    #2E7FC1;
  --green:    #1E8449;
  --red:      #C0392B;
  --purple:   #6B46C1;
  --yellow:   #B7791F;

  /* Variáveis extras do tema Bueno */
  --azul-escuro:      #1B4F8A;
  --azul-principal:   #2E7FC1;
  --azul-hover:       #2569A8;
  --azul-claro:       #E8F2FB;
  --azul-muito-claro: #F0F6FF;
  --laranja:          #F5A623;
  --cinza-fundo:      #F0F4F8;
  --cinza-claro:      #D8E3EE;
  --cinza-medio:      #A8B8CC;
  --texto:            #1C2E3F;
  --branco:           #FFFFFF;
  --verde:            #1E8449;
  --vermelho:         #C0392B;
  --sombra:           0 2px 8px rgba(27,79,138,0.10);
  --radius:           8px;
}

/* ─── FUNDO GERAL ─── */
html, body {
  background: var(--bg) !important;
  color: var(--text) !important;
  font-family: 'Segoe UI', system-ui, Arial, sans-serif !important;
}

/* ─── TOPBAR (header topo) ─── */
.topbar {
  background: #1B4F8A !important;
  border-bottom: 1px solid #153D6E !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.15) !important;
}

/* Logo e brand no topbar */
.nav-brand {
  color: white !important;
}
.nav-brand:hover {
  color: white !important;
  text-decoration: none !important;
}

/* Textos no topbar */
.topbar .nav-user,
.topbar .nav-user strong,
.topbar button,
.topbar a {
  color: rgba(255,255,255,0.9) !important;
}

/* Botões do topbar */
.topbar .notif-btn,
.topbar .btn-icon {
  background: rgba(255,255,255,0.1) !important;
  border-color: rgba(255,255,255,0.2) !important;
  color: white !important;
}
.topbar .notif-btn:hover,
.topbar .btn-icon:hover {
  background: rgba(255,255,255,0.2) !important;
}

/* ─── SIDEBAR ─── */
.sidebar {
  background: #1B4F8A !important;
  border-right: 1px solid #153D6E !important;
}

.sidebar-section {
  color: rgba(255,255,255,0.55) !important;
}

.sidebar a {
  color: rgba(255,255,255,0.85) !important;
  border-radius: 6px !important;
}

.sidebar a:hover {
  background: rgba(255,255,255,0.12) !important;
  color: white !important;
}

.sidebar a.active {
  background: rgba(245,166,35,0.25) !important;
  color: #F5A623 !important;
}

.sidebar a.active .nav-icon {
  color: #F5A623 !important;
}

.nav-icon {
  opacity: 0.8 !important;
}

/* ─── CONTEÚDO PRINCIPAL ─── */
.main-content {
  background: var(--bg) !important;
}

.app-shell {
  background: var(--bg) !important;
}

/* ─── SCROLLBAR ─── */
::-webkit-scrollbar-track {
  background: #E8EDF3 !important;
}
::-webkit-scrollbar-thumb {
  background: #A8B8CC !important;
}
::-webkit-scrollbar-thumb:hover {
  background: #2E7FC1 !important;
}

/* ─── CARDS / PANELS ─── */
.card, .panel, .box,
[class*="-card"] {
  background: #FFFFFF !important;
  border: 1px solid var(--line) !important;
  border-radius: 8px !important;
  box-shadow: 0 2px 8px rgba(27,79,138,0.08) !important;
  color: var(--text) !important;
}

.card-header, .panel-heading {
  background: #FFFFFF !important;
  color: #1B4F8A !important;
  border-bottom: 1px solid var(--line) !important;
}

/* ─── TABELAS ─── */
table, .table {
  background: #FFFFFF !important;
  color: var(--text) !important;
  border-collapse: collapse !important;
  width: 100% !important;
}

thead th, .table thead th,
table thead tr th {
  background: #1B4F8A !important;
  color: white !important;
  padding: 11px 14px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  border: none !important;
}

tbody tr {
  background: #FFFFFF !important;
}

tbody tr:nth-child(even) {
  background: #F5F8FC !important;
}

tbody tr:hover {
  background: #EBF3FB !important;
}

td, th {
  color: var(--text) !important;
  padding: 10px 14px !important;
  border: none !important;
  border-bottom: 1px solid var(--line) !important;
  vertical-align: middle !important;
}

/* ─── BOTÕES ─── */
.btn {
  border-radius: 6px !important;
  font-weight: 600 !important;
  transition: all 0.15s !important;
}

.btn-primary {
  background: #2E7FC1 !important;
  color: white !important;
  border: none !important;
}
.btn-primary:hover {
  background: #2569A8 !important;
}

.btn-success {
  background: #1E8449 !important;
  color: white !important;
  border: none !important;
}

.btn-danger {
  background: #C0392B !important;
  color: white !important;
  border: none !important;
}

.btn-warning {
  background: #F5A623 !important;
  color: white !important;
  border: none !important;
}

.btn-secondary, .btn-default {
  background: white !important;
  color: var(--text) !important;
  border: 1.5px solid var(--line) !important;
}

.btn-info {
  background: #2E7FC1 !important;
  color: white !important;
  border: none !important;
}

.btn-outline-primary {
  background: transparent !important;
  color: #2E7FC1 !important;
  border: 2px solid #2E7FC1 !important;
}

/* ─── INPUTS ─── */
input, select, textarea,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="date"],
input[type="search"] {
  background: white !important;
  color: var(--text) !important;
  border: 1.5px solid var(--line) !important;
  border-radius: 6px !important;
}

input:focus, select:focus, textarea:focus {
  border-color: #2E7FC1 !important;
  box-shadow: 0 0 0 3px rgba(46,127,193,0.15) !important;
  outline: none !important;
}

/* ─── MODAIS ─── */
.modal-content {
  background: white !important;
  color: var(--text) !important;
}

.modal-header {
  background: #1B4F8A !important;
  color: white !important;
  border: none !important;
}

.modal-header .modal-title,
.modal-header .close,
.modal-header button {
  color: white !important;
}

.modal-body {
  background: white !important;
  color: var(--text) !important;
}

.modal-footer {
  background: white !important;
  border-top: 1px solid var(--line) !important;
}

/* ─── DROPDOWN ─── */
.dropdown-menu {
  background: white !important;
  border: 1.5px solid var(--line) !important;
  box-shadow: 0 4px 20px rgba(27,79,138,0.15) !important;
}

.dropdown-item {
  color: var(--text) !important;
  background: transparent !important;
}
.dropdown-item:hover {
  background: #E8F2FB !important;
  color: #1B4F8A !important;
}

/* ─── BADGES ─── */
.badge {
  border-radius: 20px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
}

.badge-success, .badge.bg-success { background: #1E8449 !important; color: white !important; }
.badge-danger, .badge.bg-danger { background: #C0392B !important; color: white !important; }
.badge-warning, .badge.bg-warning { background: #F5A623 !important; color: white !important; }
.badge-primary, .badge.bg-primary { background: #2E7FC1 !important; color: white !important; }
.badge-info, .badge.bg-info { background: #E8F2FB !important; color: #1B4F8A !important; }

/* ─── ALERTAS ─── */
.alert-danger { background: #FADBD8 !important; color: #C0392B !important; border-color: #C0392B !important; }
.alert-success { background: #D5F5E3 !important; color: #1E8449 !important; border-color: #1E8449 !important; }
.alert-warning { background: #FEF9E7 !important; color: #856404 !important; border-color: #D4AC0D !important; }
.alert-info { background: #E8F2FB !important; color: #1B4F8A !important; border-color: #2E7FC1 !important; }

/* ─── LINKS ─── */
a {
  color: #2E7FC1 !important;
}
a:hover {
  color: #1B4F8A !important;
}

/* Links dentro de tabelas */
td a, tbody a {
  color: #2E7FC1 !important;
}

/* ─── TÍTULOS ─── */
h1, h2, h3, h4, h5, h6 {
  color: #1B4F8A !important;
}

/* ─── PAGINAÇÃO ─── */
.page-link {
  background: white !important;
  color: #2E7FC1 !important;
  border-color: var(--line) !important;
}
.page-item.active .page-link {
  background: #2E7FC1 !important;
  color: white !important;
  border-color: #2E7FC1 !important;
}

/* ─── BREADCRUMB ─── */
.breadcrumb {
  background: transparent !important;
}
.breadcrumb-item a {
  color: #2E7FC1 !important;
}

/* ─── COCKPIT / KANBAN ─── */
.cockpit-header {
  background: #1B4F8A !important;
  color: white !important;
}

/* ─── NOTIF BUTTON ─── */
.notif-btn {
  position: relative;
  background: rgba(255,255,255,0.12) !important;
  border: 1px solid rgba(255,255,255,0.2) !important;
  color: white !important;
  border-radius: 6px !important;
  padding: 6px 10px !important;
  cursor: pointer !important;
  font-size: 15px !important;
  transition: background 0.15s !important;
}
.notif-btn:hover {
  background: rgba(255,255,255,0.22) !important;
}

/* ─── RESPONSIVO ─── */
@media (max-width: 768px) {
  .sidebar {
    display: block !important;
    position: fixed !important;
    z-index: 999 !important;
    left: -260px !important;
    transition: left 0.28s ease !important;
    width: 250px !important;
  }
  .sidebar.show, .sidebar.open {
    left: 0 !important;
    box-shadow: 4px 0 24px rgba(0,0,0,0.45) !important;
  }
  td, th { padding: 7px 9px !important; font-size: 12px !important; }
}

@media (max-width: 480px) {
  .btn { padding: 8px 12px !important; font-size: 13px !important; }
}

/* ─── LOGIN PAGE ─── */
.login-box {
  background: white !important;
  border: 1px solid var(--line) !important;
  box-shadow: 0 8px 32px rgba(27,79,138,0.15) !important;
}

body:has(.login-box) {
  background: linear-gradient(135deg, #1B4F8A 0%, #2E7FC1 55%, #F5A623 100%) !important;
}