/* ═══════════════ Fuente ═══════════════ */
*, body { font-family: 'Inter', system-ui, -apple-system, sans-serif; }

/* ═══════════════ Variables de tema ═══════════════ */
:root {
  --bg:              #f1f5f9;
  --text:            #0f172a;
  --text-secondary:  #64748b;
  --card:            #ffffff;
  --border:          #e2e8f0;
  --muted:           #94a3b8;
  --subnav-bg:       #ffffff;
  --modulo-nav-bg:   #1e293b;
  --table-hover:     #f8fafc;
  --shadow-sm:       0 1px 3px rgba(0,0,0,.06), 0 1px 2px rgba(0,0,0,.04);
  --shadow-md:       0 4px 16px rgba(0,0,0,.07), 0 1px 3px rgba(0,0,0,.04);

  /* Paleta suave */
  --green:     #10b981;
  --green-bg:  #ecfdf5;
  --green-text:#065f46;
  --red:       #ef4444;
  --red-bg:    #fef2f2;
  --red-text:  #991b1b;
  --blue:      #3b82f6;
  --blue-bg:   #eff6ff;
  --blue-text: #1e40af;
  --amber:     #f59e0b;
  --amber-bg:  #fffbeb;
  --amber-text:#92400e;
  --gray-bg:   #f8fafc;
  --gray-text: #475569;
}

[data-bs-theme="dark"] {
  --bg:              #0f172a;
  --text:            #e2e8f0;
  --text-secondary:  #94a3b8;
  --card:            #1e293b;
  --border:          #334155;
  --muted:           #64748b;
  --subnav-bg:       #1e293b;
  --modulo-nav-bg:   #0b1220;
  --table-hover:     #263348;
  --green-bg:  #022c22;  --green-text:#6ee7b7;
  --red-bg:    #2d0a0a;  --red-text:  #fca5a5;
  --blue-bg:   #0c1a3a;  --blue-text: #93c5fd;
  --amber-bg:  #261a00;  --amber-text:#fcd34d;
  --gray-bg:   #1e293b;  --gray-text: #94a3b8;
}

/* ═══════════════ Base ═══════════════ */
body { background: var(--bg); color: var(--text); font-size: .9rem; }

/* ═══════════════ Cards ═══════════════ */
.card {
  border-radius: 12px !important;
  border: 1px solid var(--border) !important;
  background-color: var(--card);
  color: var(--text);
  box-shadow: var(--shadow-sm);
}
.card.shadow-sm { box-shadow: var(--shadow-md) !important; }
.card-header {
  border-bottom: 1px solid var(--border) !important;
  font-size: .875rem;
  font-weight: 600;
}

/* ═══════════════ Tablas ═══════════════ */
.table {
  --bs-table-border-color: var(--border);
  font-size: .85rem;
}
.table td, .table th {
  border-left: none !important;
  border-right: none !important;
  border-color: var(--border) !important;
  padding: .55rem .75rem;
  vertical-align: middle;
}
.table thead th {
  font-size: .75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--text-secondary);
  background: var(--gray-bg);
  border-bottom: 1px solid var(--border) !important;
}
.table-hover tbody tr:hover {
  background: var(--table-hover) !important;
  cursor: pointer;
}
.table-bordered, .table-bordered td, .table-bordered th { border: none !important; }

/* ═══════════════ Badges de estado (pill, suave) ═══════════════ */
.badge-emitida  { background: var(--green-bg) !important; color: var(--green-text) !important; border: 1px solid #a7f3d0; }
.badge-error    { background: var(--red-bg)   !important; color: var(--red-text)   !important; border: 1px solid #fecaca; }
.badge-borrador { background: var(--gray-bg)  !important; color: var(--gray-text)  !important; border: 1px solid var(--border); }
.badge-emitida, .badge-error, .badge-borrador {
  font-size: .72rem !important;
  font-weight: 600 !important;
  padding: .25em .65em !important;
  border-radius: 20px !important;
}

/* Colores monetarios suaves */
.text-success { color: var(--green) !important; }
.text-danger  { color: var(--red)   !important; }

/* ═══════════════ Navegación módulos ═══════════════ */
.navbar-brand { font-weight: 700; letter-spacing: .5px; font-size: 1rem; }
.modulo-nav { background: var(--modulo-nav-bg); }
.modulo-nav .nav-link {
  color: #94a3b8; font-weight: 500;
  padding: .5rem 1rem; border-radius: 8px; margin: 0 2px;
  font-size: .85rem; transition: all .15s;
}
.modulo-nav .nav-link:hover  { color: #fff; background: rgba(255,255,255,.1); }
.modulo-nav .nav-link.active { color: #fff; background: #3b82f6; }
.modulo-nav .nav-link i { font-size: .95rem; }

/* ═══════════════ Sub-nav ═══════════════ */
.sub-nav-bar { background: var(--subnav-bg); border-bottom: 1px solid var(--border); }
.sub-nav-bar .nav-link {
  color: var(--text-secondary); padding: .5rem 1rem;
  font-size: .85rem; font-weight: 500;
  border-bottom: 2px solid transparent; transition: all .15s;
}
.sub-nav-bar .nav-link:hover  { color: var(--text); }
.sub-nav-bar .nav-link.active { color: #3b82f6; border-bottom-color: #3b82f6; }

/* ═══════════════ Botones de acción en tablas ═══════════════ */
.btn-outline-primary, .btn-outline-secondary, .btn-outline-danger,
.btn-outline-success, .btn-outline-warning, .btn-outline-info {
  border-radius: 8px !important;
}
.btn-xs { font-size: .75rem; padding: .15rem .4rem; }
.table .btn-sm { padding: .2rem .45rem; font-size: .78rem; }
.table .btn { border-radius: 8px !important; }

/* ═══════════════ Formularios ═══════════════ */
.form-control, .form-select {
  border-color: var(--border);
  border-radius: 8px !important;
  font-size: .875rem;
  transition: border-color .15s, box-shadow .15s;
}
.form-control:focus, .form-select:focus {
  border-color: #3b82f6;
  box-shadow: 0 0 0 3px rgba(59,130,246,.15);
}
.input-group-text { border-radius: 8px !important; font-size: .875rem; }
.form-label { font-size: .8rem; font-weight: 600; color: var(--text-secondary); margin-bottom: .3rem; }

/* ═══════════════ Modales ═══════════════ */
.modal-content { border-radius: 14px !important; border: none !important; box-shadow: 0 20px 60px rgba(0,0,0,.15); }
.modal-header  { border-bottom: 1px solid var(--border); padding: 1rem 1.25rem; }
.modal-footer  { border-top:    1px solid var(--border); padding: .75rem 1.25rem; }

/* ═══════════════ Drop zone ═══════════════ */
.drop-zone {
  border: 2px dashed #3b82f6; border-radius: 12px;
  padding: 40px; text-align: center; color: #3b82f6; cursor: pointer;
  transition: background .2s, border-color .2s;
}
.drop-zone.dragover { background: #eff6ff; border-color: #1d4ed8; }

/* ═══════════════ Toast ═══════════════ */
#toast-container { position: fixed; bottom: 1rem; right: 1rem; z-index: 9999; }

/* ═══════════════ Badges categoría / montos ═══════════════ */
.badge-categoria { font-size: .72rem; }

/* ═══════════════ Shortcuts ═══════════════ */
.shortcut-list kbd { background: #1e293b; color: #e2e8f0; border-radius: 4px; padding: .1rem .45rem; font-size: .78rem; }

/* ═══════════════ KPI Cards — bordes de color ═══════════════ */
.border-success { border-color: var(--green) !important; }
.border-danger  { border-color: var(--red)   !important; }
.border-primary { border-color: var(--blue)  !important; }

/* ═══════════════ Dark mode overrides ═══════════════ */
[data-bs-theme="dark"] .bg-white,
[data-bs-theme="dark"] .card-header.bg-white,
[data-bs-theme="dark"] .card-footer.bg-white { background-color: var(--card) !important; color: var(--text) !important; }
[data-bs-theme="dark"] .bg-light,
[data-bs-theme="dark"] .card.bg-light { background-color: var(--card) !important; color: var(--text) !important; }
[data-bs-theme="dark"] .table { --bs-table-bg: var(--card); --bs-table-color: var(--text); color: var(--text); }
[data-bs-theme="dark"] .table-light, [data-bs-theme="dark"] thead.table-light,
[data-bs-theme="dark"] .table > :not(caption) > * > * { background-color: var(--card) !important; color: var(--text) !important; }
[data-bs-theme="dark"] .table thead th { background: #0f172a; color: var(--muted); }
[data-bs-theme="dark"] .table-hover tbody tr:hover { background: var(--table-hover) !important; }
[data-bs-theme="dark"] .form-control, [data-bs-theme="dark"] .form-select {
  background-color: #0f172a; color: var(--text); border-color: var(--border);
}
[data-bs-theme="dark"] .form-control::placeholder { color: var(--muted); }
[data-bs-theme="dark"] .input-group-text { background-color: #1e293b; color: var(--text); border-color: var(--border); }
[data-bs-theme="dark"] .modal-content { background-color: var(--card); color: var(--text); }
[data-bs-theme="dark"] .modal-header, [data-bs-theme="dark"] .modal-footer { border-color: var(--border); }
[data-bs-theme="dark"] .list-group-item { background-color: var(--card); color: var(--text); border-color: var(--border); }
[data-bs-theme="dark"] .dropdown-menu { background-color: var(--card); border-color: var(--border); }
[data-bs-theme="dark"] .dropdown-item { color: var(--text); }
[data-bs-theme="dark"] .dropdown-item:hover { background-color: var(--table-hover); }
[data-bs-theme="dark"] .sub-nav-bar { background: var(--subnav-bg) !important; border-bottom-color: var(--border); }
[data-bs-theme="dark"] .sub-nav-bar .nav-link { color: var(--muted); }
[data-bs-theme="dark"] .sub-nav-bar .nav-link.active { color: #60a5fa; border-bottom-color: #60a5fa; }
[data-bs-theme="dark"] .text-muted, [data-bs-theme="dark"] .text-secondary { color: var(--muted) !important; }
[data-bs-theme="dark"] .text-dark { color: var(--text) !important; }
[data-bs-theme="dark"] .border, [data-bs-theme="dark"] .border-top, [data-bs-theme="dark"] .border-bottom,
[data-bs-theme="dark"] .border-start, [data-bs-theme="dark"] .border-end { border-color: var(--border) !important; }
[data-bs-theme="dark"] .popover { background-color: var(--card); border-color: var(--border); }
[data-bs-theme="dark"] .popover-body, [data-bs-theme="dark"] .popover-header { color: var(--text); background-color: var(--card); }
[data-bs-theme="dark"] .nav-tabs .nav-link { color: var(--muted); }
[data-bs-theme="dark"] .nav-tabs .nav-link.active { background-color: var(--card); color: var(--text); border-color: var(--border) var(--border) var(--card); }
[data-bs-theme="dark"] .page-link { background-color: var(--card); color: var(--text); border-color: var(--border); }
[data-bs-theme="dark"] .page-item.disabled .page-link { background-color: var(--card); color: var(--muted); }
[data-bs-theme="dark"] .accordion-item, [data-bs-theme="dark"] .accordion-button { background-color: var(--card); color: var(--text); }
[data-bs-theme="dark"] .alert-light { background-color: var(--card); color: var(--text); border-color: var(--border); }
[data-bs-theme="dark"] .shortcut-list kbd { background: #475569; }
[data-bs-theme="dark"] .badge-emitida  { background: var(--green-bg) !important; color: var(--green-text) !important; border-color: #065f46 !important; }
[data-bs-theme="dark"] .badge-error    { background: var(--red-bg)   !important; color: var(--red-text)   !important; border-color: #991b1b !important; }
[data-bs-theme="dark"] .badge-borrador { background: var(--gray-bg)  !important; color: var(--gray-text)  !important; border-color: #334155 !important; }