/* Foco visible siempre, incluso si el navegador no lo resalta por defecto
   (accesibilidad: navegacion por teclado en el panel del DPD). */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.form-check-input:focus-visible {
  outline: 3px solid var(--bs-primary);
  outline-offset: 2px;
}

/* WCAG 2.5.8 (Target Size, AA): .btn-sm de Bootstrap renderiza ~31px de
   alto, por debajo del minimo de 44x44px -- son los botones de mayor uso
   del panel (Gestionar/Editar/Restablecer contrasena en filas de tabla).
   Solo se agranda en dispositivos tactiles: en desktop con mouse la
   densidad de las tablas es intencional, agrandar ahi solo por un
   viewport angosto (ventana redimensionada) desperdiciaria espacio sin
   necesidad real. */
@media (pointer: coarse) {
  .btn-sm {
    min-height: 44px;
    min-width: 44px;
    padding-top: .5rem;
    padding-bottom: .5rem;
  }
}

.ldpd-step { display: none; }
.ldpd-step.active { display: block; }

.ldpd-derecho-card {
  cursor: pointer;
  border: 2px solid var(--bs-border-color);
  transition: border-color .15s ease, background-color .15s ease;
  height: 100%;
}
.ldpd-derecho-card:hover { border-color: var(--bs-primary); }
.ldpd-derecho-card.selected {
  border-color: var(--bs-primary);
  background-color: var(--bs-primary-bg-subtle);
}

/* Bandeja del DPD: la fila de un expediente vencido debe distinguirse aun
   sin color (ej. modo alto contraste, daltonismo) -- ver tambien
   renderUmbralBadge() en app.js, que siempre agrega icono + texto. */
tr.ldpd-fila-vencida { font-weight: 600; }
tr.ldpd-fila-vencida td:first-child { border-left: 4px solid var(--bs-danger); }

.ldpd-kpi-card { border-left: 4px solid var(--bs-primary); }
.ldpd-kpi-card.ldpd-kpi-danger { border-left-color: var(--bs-danger); }
.ldpd-kpi-card .ldpd-kpi-valor { font-size: 2rem; font-weight: 700; }

/* Reporte de cumplimiento (Fase 6): "Imprimir / Guardar PDF" usa el dialogo
   nativo del navegador en vez de una libreria de generacion de PDF (no hay
   Composer en este entorno) -- este bloque oculta todo lo que no sea el
   resumen del reporte al imprimir. */
@media print {
  .navbar, .ldpd-no-imprimir { display: none !important; }
  main { padding: 0 !important; }
}

/* DataTables (CDN) fija color: #333 en sus controles -- no conoce el
     data-bs-theme de Bootstrap. En tema oscuro ese gris queda casi invisible
     sobre el fondo oscuro (confirmado: #333 contra #212529). --bs-body-color
     ya resuelve el color correcto por tema, solo faltaba que estos lo usaran. */
  .dataTables_wrapper .dataTables_length,
  .dataTables_wrapper .dataTables_filter,
  .dataTables_wrapper .dataTables_info,
  .dataTables_wrapper .dataTables_processing,
  .dataTables_wrapper .dataTables_paginate {
    color: var(--bs-body-color);
  }