/* CENI2 — Estilos personalizados */

/* ── Variables ───────────────────────────────────────────────── */
:root {
  --sidebar-width: 220px;
  --topbar-height: 56px;
}

/* ── Layout base ─────────────────────────────────────────────── */
body {
  font-size: 0.875rem;
  background: #f4f6f9;
}

/* ── Tarjetas estadísticas del dashboard ─────────────────────── */
.stat-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0,0,0,.12) !important;
  transition: all .2s ease;
}

.stat-num {
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1;
}

.stat-lbl {
  font-size: 0.75rem;
  color: #6c757d;
  margin-top: 3px;
}

/* ── Botones extra pequeños ──────────────────────────────────── */
.btn-xs {
  padding: 0.1rem 0.35rem;
  font-size: 0.75rem;
  border-radius: 0.2rem;
}

/* ── Tabla compacta ──────────────────────────────────────────── */
.table-sm td, .table-sm th {
  padding: 0.3rem 0.5rem;
}

/* ── Badges de estado de revisión ────────────────────────────── */
.badge {
  font-weight: 500;
}

/* ── Formularios ─────────────────────────────────────────────── */
.form-label {
  color: #495057;
}

.card-header.bg-primary    { background-color: #0d6efd !important; }
.card-header.bg-success    { background-color: #198754 !important; }
.card-header.bg-info       { background-color: #0dcaf0 !important; }
.card-header.bg-warning    { background-color: #ffc107 !important; }
.card-header.bg-danger     { background-color: #dc3545 !important; }
.card-header.bg-secondary  { background-color: #6c757d !important; }

/* ── Navbar ──────────────────────────────────────────────────── */
.navbar-brand {
  font-size: 1.1rem;
  letter-spacing: 0.03em;
}

/* ── Font monospace para números de contrato ─────────────────── */
.font-monospace {
  font-family: 'Courier New', Courier, monospace;
  font-size: 0.82rem;
}

/* ── Animación de carga para filas ───────────────────────────── */
tbody tr {
  transition: background-color 0.15s ease;
}

/* ── Card de detalle (view.php) ──────────────────────────────── */
.card .row.py-1 {
  font-size: 0.82rem;
}

/* ── Alert badge en navbar (revisiones pendientes) ────────────── */
.nav-badge {
  font-size: 0.65rem;
  padding: 0.15em 0.4em;
  border-radius: 50%;
  vertical-align: top;
  margin-left: 2px;
}

/* ── Paginación ──────────────────────────────────────────────── */
.page-link {
  font-size: 0.8rem;
  padding: 0.25rem 0.6rem;
}

/* ── Breadcrumb ──────────────────────────────────────────────── */
.breadcrumb {
  font-size: 0.78rem;
  background: none;
  padding: 0;
}

/* ── Tabla hover más suave ────────────────────────────────────── */
.table-hover tbody tr:hover {
  background-color: rgba(13, 110, 253, 0.04);
}

/* ── Footer ──────────────────────────────────────────────────── */
footer {
  font-size: 0.78rem;
}

/* ── Login page ──────────────────────────────────────────────── */
.card-header h3 {
  font-size: 1.3rem;
}

/* ── Input group icono ───────────────────────────────────────── */
.input-group-text {
  font-size: 0.82rem;
}

/* ── Responsive: ocultar columnas en móvil ───────────────────── */
@media (max-width: 768px) {
  .d-md-none-mobile {
    display: none !important;
  }
  .stat-num {
    font-size: 1.4rem;
  }
}

/* ── Modo oscuro (preparado pero no activado por defecto) ────── */
/* @media (prefers-color-scheme: dark) { ... } */