/* Archivo: public/print.css (NUEVO) */

/* @media print define estilos que SOLO se aplican al imprimir */
@media print {
  
  /* 1. Ocultar todo por defecto */
  body * {
    visibility: hidden;
    background: #fff !important; /* Forzar fondo blanco */
    color: #000 !important; /* Forzar texto negro */
    box-shadow: none !important;
    text-shadow: none !important;
  }

  /* 2. Mostrar SOLAMENTE el contenedor del reporte y su contenido */
  #app-content,
  #app-content * {
    visibility: visible;
  }

  /* 3. Ocultar elementos específicos de la UI */
  #sidebar-container,
  #report-content button, /* Oculta el botón "Print Report" */
  .modal,
  .modal-backdrop {
    display: none !important;
    visibility: hidden !important;
  }

  /* 4. Asegurar que el contenido del reporte ocupe toda la página */
  #app-content {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    margin: 0 !important;
    padding: 0.5in !important; /* Añadir un margen de impresión */
    border: none !important;
  }
  
  #report-content {
    display: block !important;
  }

  /* 5. Forzar la impresión de fondos (badges, etc.) */
  .card, .card-header, .badge, .progress-bar {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }
  
  .card {
    border: 1px solid #ddd !important;
    page-break-inside: avoid; /* Evitar que las tarjetas se corten */
  }
  
  .card-header {
      background-color: #f8f9fa !important; /* Fondo gris claro */
      border-bottom: 1px solid #ddd !important;
  }
  
  /* Ocultar el spinner (por si acaso) */
  #report-spinner {
    display: none !important;
  }
}