/**
 * ESTILOS DE IMPRESIÓN PARA INFORMES CLÍNICOS
 * Compatible con: Historiales, Notas SOAP, Evoluciones, Reportes Administrativos
 * Contexto: Modales multi-página con Tailwind CSS
 */

@media print {
  /* ========================================
     RESETS CRÍTICOS PARA MODALES
     ======================================== */
  
  html, body {
    height: 100% !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    background: white !important;
  }

  /* Forzar visibilidad de contenido en modales */
  .modal,
  .modal-content,
  .modal-body,
  [role="dialog"],
  [class*="modal"],
  [class*="Modal"] {
    position: static !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
    z-index: 1 !important;
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
    border: none !important;
  }

  /* Ocultar overlays y backdrops */
  .modal-backdrop,
  .overlay,
  [class*="backdrop"],
  [class*="Backdrop"] {
    display: none !important;
  }

  /* ========================================
     OCULTAR ELEMENTOS NO IMPRIMIBLES
     ======================================== */
  
  /* Navegación y controles UI */
  nav,
  header,
  footer,
  .sidebar,
  .navbar,
  .menu,
  button:not(.print-signature),
  [role="navigation"],
  [class*="Navigation"],
  [class*="Sidebar"] {
    display: none !important;
  }

  /* Botones de acción (excepto firmas) */
  .btn:not(.print-signature),
  .button:not(.print-signature),
  [class*="Button"]:not(.print-signature) {
    display: none !important;
  }

  /* Controles de modal */
  .modal-close,
  .close-button,
  [aria-label*="close"],
  [aria-label*="cerrar"] {
    display: none !important;
  }

  /* Tabs y paginación */
  .tabs,
  .pagination,
  [role="tablist"],
  [class*="Tabs"],
  [class*="Pagination"] {
    display: none !important;
  }

  /* ========================================
     FORMATO CLÍNICO PROFESIONAL
     ======================================== */
  
  /* Márgenes estándar médicos */
  @page {
    size: letter;
    margin: 1cm 1.5cm;
  }

  /* Tipografía legible */
  body {
    font-family: 'Arial', 'Helvetica', sans-serif !important;
    font-size: 12pt !important;
    line-height: 1.5 !important;
    color: #000 !important;
  }

  /* Encabezados clínicos */
  h1 { font-size: 16pt !important; font-weight: bold !important; margin-bottom: 0.5cm !important; }
  h2 { font-size: 14pt !important; font-weight: bold !important; margin-bottom: 0.4cm !important; }
  h3 { font-size: 13pt !important; font-weight: bold !important; margin-bottom: 0.3cm !important; }
  h4 { font-size: 12pt !important; font-weight: bold !important; margin-bottom: 0.2cm !important; }

  /* Párrafos y listas */
  p {
    margin-bottom: 0.3cm !important;
    orphans: 3;
    widows: 3;
  }

  ul, ol {
    margin-left: 0.5cm !important;
  }

  /* ========================================
     TABLAS CLÍNICAS (MULTI-PÁGINA)
     ======================================== */
  
  table {
    width: 100% !important;
    border-collapse: collapse !important;
    page-break-inside: auto !important;
    font-size: 11pt !important;
  }

  thead {
    display: table-header-group !important;
    font-weight: bold !important;
  }

  tbody {
    display: table-row-group !important;
  }

  tr {
    page-break-inside: avoid !important;
    page-break-after: auto !important;
  }

  th, td {
    border: 1px solid #333 !important;
    padding: 0.2cm !important;
    text-align: left !important;
  }

  th {
    background-color: #f0f0f0 !important;
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }

  /* ========================================
     SECCIONES CLÍNICAS ESPECÍFICAS
     ======================================== */
  
  /* Notas SOAP */
  .soap-section {
    page-break-inside: avoid !important;
    margin-bottom: 0.5cm !important;
    border-left: 3px solid #333 !important;
    padding-left: 0.3cm !important;
  }

  /* Códigos CIE-10 */
  .cie10-code,
  .diagnosis-code {
    font-family: 'Courier New', monospace !important;
    font-weight: bold !important;
    background-color: #f5f5f5 !important;
    padding: 0.1cm 0.2cm !important;
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }

  /* Timestamps y metadata */
  .timestamp,
  .metadata,
  .clinical-date {
    font-size: 10pt !important;
    color: #666 !important;
    font-style: italic !important;
  }

  /* Firmas digitales */
  .signature,
  .digital-signature,
  .print-signature {
    display: block !important;
    page-break-inside: avoid !important;
    margin-top: 1cm !important;
    padding-top: 0.5cm !important;
    border-top: 2px solid #333 !important;
  }

  .signature-name {
    font-weight: bold !important;
    font-size: 12pt !important;
  }

  .signature-credentials {
    font-size: 10pt !important;
    color: #666 !important;
  }

  /* ========================================
     EVOLUCIONES CLÍNICAS
     ======================================== */
  
  .evolution-entry {
    page-break-inside: avoid !important;
    margin-bottom: 0.5cm !important;
    padding: 0.3cm !important;
    border: 1px solid #ccc !important;
  }

  .evolution-date {
    font-weight: bold !important;
    margin-bottom: 0.2cm !important;
  }

  /* ========================================
     HISTORIAL DE PACIENTE
     ======================================== */
  
  .patient-header {
    page-break-after: avoid !important;
    margin-bottom: 0.5cm !important;
    padding-bottom: 0.3cm !important;
    border-bottom: 2px solid #333 !important;
  }

  .patient-info {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 0.3cm !important;
  }

  /* ========================================
     RICH TEXT EDITOR (TIPTAP)
     ======================================== */
  
  .ProseMirror,
  .tiptap {
    border: none !important;
    padding: 0 !important;
    min-height: auto !important;
  }

  /* Preservar formato de texto enriquecido */
  strong, b { font-weight: bold !important; }
  em, i { font-style: italic !important; }
  u { text-decoration: underline !important; }

  /* ========================================
     UTILIDADES DE PAGE-BREAK
     ======================================== */
  
  .page-break-before {
    page-break-before: always !important;
  }

  .page-break-after {
    page-break-after: always !important;
  }

  .page-break-avoid {
    page-break-inside: avoid !important;
  }

  .keep-together {
    page-break-inside: avoid !important;
  }

  /* ========================================
     REPORTES ADMINISTRATIVOS
     ======================================== */
  
  .report-summary {
    background-color: #f9f9f9 !important;
    padding: 0.3cm !important;
    margin-bottom: 0.5cm !important;
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }

  .report-totals {
    font-weight: bold !important;
    font-size: 13pt !important;
    margin-top: 0.5cm !important;
    padding-top: 0.3cm !important;
    border-top: 2px solid #333 !important;
  }

  /* ========================================
     IMÁGENES Y GRÁFICOS
     ======================================== */
  
  img {
    max-width: 100% !important;
    page-break-inside: avoid !important;
  }

  /* Ocultar gráficos interactivos, mostrar solo datos */
  canvas {
    display: none !important;
  }

  /* ========================================
     LINKS Y REFERENCIAS
     ======================================== */
  
  a {
    color: #000 !important;
    text-decoration: none !important;
  }

  a[href]:after {
    content: " (" attr(href) ")" !important;
    font-size: 9pt !important;
    color: #666 !important;
  }

  /* No mostrar URLs para links internos */
  a[href^="#"]:after,
  a[href^="/"]:after {
    content: "" !important;
  }

  /* ========================================
     CLASES AUXILIARES
     ======================================== */
  
  .print-only {
    display: block !important;
  }

  .no-print {
    display: none !important;
  }

  .print-visible {
    visibility: visible !important;
    opacity: 1 !important;
  }

  /* ========================================
     TAILWIND OVERRIDES
     ======================================== */
  
  /* Forzar visibilidad sobre clases Tailwind */
  .hidden,
  .invisible,
  .opacity-0 {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  /* Resetear transforms de Tailwind */
  .translate-x-full,
  .translate-y-full,
  .-translate-x-full,
  .-translate-y-full,
  .scale-0,
  .scale-95 {
    transform: none !important;
  }

  /* Resetear overflow de Tailwind */
  .overflow-hidden,
  .overflow-auto,
  .overflow-scroll {
    overflow: visible !important;
  }

  /* Resetear max-height de Tailwind */
  .max-h-0,
  .max-h-screen,
  [class*="max-h-"] {
    max-height: none !important;
  }

  /* ========================================
     RECETAS MEDICAS (.print-receta)
     ======================================== */

  .print-receta {
    font-family: 'Segoe UI', Arial, sans-serif !important;
    font-size: 12pt !important;
    line-height: 1.4 !important;
    color: #333 !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }

  .print-receta .prescription-header {
    text-align: center;
    border-bottom: 2px solid #333;
    padding-bottom: 15px;
    margin-bottom: 20px;
  }

  .print-receta .prescription-header h1 {
    margin: 0 0 5px 0;
    font-size: 18pt;
    color: #1a365d;
  }

  .print-receta .prescription-header .subtitle {
    font-size: 10pt;
    color: #666;
  }

  .print-receta .info-section {
    display: flex;
    justify-content: space-between;
    margin-bottom: 15px;
    padding: 10px;
    background: #f8f9fa;
    border-radius: 5px;
  }

  .print-receta .info-section .column {
    flex: 1;
  }

  .print-receta .info-section .label {
    font-weight: bold;
    font-size: 9pt;
    color: #666;
    text-transform: uppercase;
  }

  .print-receta .info-section .value {
    font-size: 11pt;
    margin-top: 2px;
  }

  .print-receta .status-badge {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 8pt;
    font-weight: bold;
    text-transform: uppercase;
    margin-top: 5px;
  }

  .print-receta .status-original {
    background: #e6fffa;
    color: #234e52;
    border: 1px solid #b2f5ea;
  }

  .print-receta .status-duplicate {
    background: #fffaf0;
    color: #744210;
    border: 1px solid #fbd38d;
  }

  .print-receta .diagnosis-section {
    margin-bottom: 15px;
    padding: 10px;
    background: #e8f4fd;
    border-left: 4px solid #3182ce;
    border-radius: 0 5px 5px 0;
  }

  .print-receta .diagnosis-section h3 {
    margin: 0 0 5px 0;
    font-size: 10pt;
    color: #2c5282;
    text-transform: uppercase;
  }

  .print-receta .medications-section {
    margin-bottom: 20px;
  }

  .print-receta .medications-section h3 {
    font-size: 12pt;
    color: #1a365d;
    border-bottom: 1px solid #ccc;
    padding-bottom: 5px;
    margin-bottom: 10px;
  }

  .print-receta .medication-item {
    padding: 12px;
    margin-bottom: 10px;
    border: 1px solid #ddd;
    border-radius: 5px;
    background: #fff;
    page-break-inside: avoid;
  }

  .print-receta .medication-item .med-name {
    font-weight: bold;
    font-size: 12pt;
    color: #1a365d;
  }

  .print-receta .medication-item .med-details {
    font-size: 10pt;
    color: #555;
    margin-top: 5px;
  }

  .print-receta .medication-item .med-instructions {
    font-size: 10pt;
    font-style: italic;
    color: #666;
    margin-top: 5px;
    padding-top: 5px;
    border-top: 1px dashed #ddd;
  }

  .print-receta .instructions-section {
    margin-bottom: 20px;
    padding: 10px;
    background: #fff8e6;
    border-left: 4px solid #d69e2e;
    border-radius: 0 5px 5px 0;
  }

  .print-receta .instructions-section h3 {
    margin: 0 0 5px 0;
    font-size: 10pt;
    color: #744210;
    text-transform: uppercase;
  }

  .print-receta .signature-section {
    margin-top: 60px;
    text-align: center;
    padding-top: 20px;
    page-break-inside: avoid;
  }

  .print-receta .signature-line {
    width: 250px;
    border-top: 1px solid #333;
    margin: 0 auto 5px auto;
    padding-top: 5px;
  }

  .print-receta .doctor-name {
    font-weight: bold;
    font-size: 11pt;
  }

  .print-receta .doctor-cedula {
    font-size: 9pt;
    color: #444;
    margin-top: 2px;
  }

  .print-receta .doctor-credentials {
    font-size: 9pt;
    color: #666;
    margin-top: 2px;
  }

  .print-receta .footer {
    margin-top: 30px;
    text-align: center;
    font-size: 8pt;
    color: #999;
    border-top: 1px solid #eee;
    padding-top: 10px;
  }
}

/* ========================================
   ESTILOS DE PANTALLA (NO AFECTAN PRINT)
   ======================================== */

/* Botón de impresión visible en pantalla */
@media screen {
  .print-button {
    position: fixed;
    bottom: 2rem;
    right: 2rem;
    z-index: 1000;
    background-color: #3b82f6;
    color: white;
    padding: 0.75rem 1.5rem;
    border-radius: 0.5rem;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    cursor: pointer;
    transition: all 0.2s;
  }

  .print-button:hover {
    background-color: #2563eb;
    box-shadow: 0 6px 8px rgba(0, 0, 0, 0.15);
  }
}