/* Checklist PDP - Estilos de impresión */
/* Optimizado para legibilidad en papel con fondos blancos y texto oscuro */

@media print {

  /* ============================================
     Reset para impresión
     ============================================ */
  *,
  *::before,
  *::after {
    background: transparent !important;
    color: #1F1F1F !important;
    box-shadow: none !important;
    text-shadow: none !important;
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }

  html {
    font-size: 12pt;
  }

  body {
    background: #fff !important;
    color: #1F1F1F !important;
    font-family: 'DM Sans', 'Helvetica Neue', Arial, sans-serif;
    line-height: 1.5;
    margin: 0;
    padding: 0;
  }

  /* ============================================
     Layout para impresión
     ============================================ */
  .app-container {
    max-width: 100%;
    padding: 0;
    margin: 0;
  }

  .page-content {
    padding: 0;
  }

  /* ============================================
     Encabezado — Mostrar info de empresa
     ============================================ */
  .app-header {
    text-align: left;
    border-bottom: 2px solid #1F1F1F !important;
    padding-bottom: 0.5rem;
    margin-bottom: 1rem;
  }

  .app-header__title {
    font-size: 16pt;
    font-weight: 700;
  }

  .app-header__title span {
    color: #1F1F1F !important;
  }

  .app-header__subtitle {
    font-size: 10pt;
    color: #555 !important;
  }

  /* ============================================
     Ocultar elementos interactivos
     ============================================ */
  /* Botones */
  .btn,
  .btn--primary,
  .btn--secondary,
  .btn--success,
  .btn--danger,
  .btn--sm,
  .btn--block {
    display: none !important;
  }

  /* Navegación entre páginas */
  .nav-buttons {
    display: none !important;
  }

  /* Stepper / indicador de progreso */
  .stepper {
    display: none !important;
  }

  /* Spinner / loading */
  .spinner {
    display: none !important;
  }

  /* Elementos de login */
  .login-card,
  .login-card__icon,
  .login-card__heading,
  .login-card__subtext,
  .code-input,
  .resend-link {
    display: none !important;
  }

  /* Formularios interactivos */
  .form-input,
  .form-textarea {
    border: none !important;
    padding: 0 !important;
    background: transparent !important;
  }

  /* Radio buttons interactivos */
  .maturity-option input[type="radio"],
  .maturity-option__label {
    display: none !important;
  }

  /* Acciones de resultados (enviar email, imprimir, limpiar) */
  .results-actions {
    display: none !important;
  }

  /* Mensajes de error/éxito transitorios */
  .message--error,
  .message--warning,
  .field-error {
    display: none !important;
  }

  /* ============================================
     Tarjetas y secciones — Fondo blanco
     ============================================ */
  .card {
    background: #fff !important;
    border: 1px solid #ddd !important;
    border-radius: 0 !important;
    padding: 0.75rem;
    margin-bottom: 0.75rem;
    page-break-inside: avoid;
  }

  .card__title {
    font-size: 13pt;
    font-weight: 600;
    border-bottom: 1px solid #ccc !important;
    padding-bottom: 0.25rem;
    margin-bottom: 0.5rem;
  }

  .card__description {
    font-size: 10pt;
    color: #555 !important;
  }

  /* ============================================
     Encabezados de sección
     ============================================ */
  .section-header {
    border-bottom: 2px solid #333 !important;
    margin-bottom: 0.75rem;
    padding-bottom: 0.25rem;
    page-break-after: avoid;
  }

  .section-header__title {
    font-size: 14pt;
    font-weight: 700;
  }

  .section-header__count {
    font-size: 9pt;
    color: #666 !important;
  }

  /* ============================================
     Ítems de cumplimiento — Visibles con etiquetas
     ============================================ */
  .compliance-item {
    background: #fff !important;
    border: 1px solid #ddd !important;
    border-radius: 0 !important;
    padding: 0.5rem 0.75rem;
    margin-bottom: 0.5rem;
    page-break-inside: avoid;
  }

  .compliance-item__number {
    background: transparent !important;
    border: 1px solid #333 !important;
    color: #333 !important;
    font-size: 9pt;
    padding: 0.1rem 0.3rem;
  }

  .compliance-item__title {
    font-size: 11pt;
    font-weight: 600;
  }

  .compliance-item__article {
    font-size: 9pt;
    color: #666 !important;
  }

  .compliance-item__description {
    font-size: 10pt;
    color: #444 !important;
    margin-bottom: 0.5rem;
  }

  .compliance-item--pending {
    border-color: #ddd !important;
  }

  /* ============================================
     Niveles de madurez — Texto visible con etiquetas
     ============================================ */
  .maturity-options {
    margin-bottom: 0.25rem;
  }

  /* Mostrar el nivel seleccionado como texto */
  .maturity-option input[type="radio"]:checked + .maturity-option__label {
    display: inline-block !important;
    border: 1px solid #333 !important;
    padding: 0.1rem 0.4rem;
    font-size: 9pt;
    font-weight: 600;
  }

  .maturity-option input[type="radio"]:checked + .maturity-option__label--cumple {
    border-color: #333 !important;
    color: #1F1F1F !important;
  }

  .maturity-option input[type="radio"]:checked + .maturity-option__label--cumple::before {
    content: "✓ ";
  }

  .maturity-option input[type="radio"]:checked + .maturity-option__label--parcial {
    border-color: #333 !important;
    color: #1F1F1F !important;
  }

  .maturity-option input[type="radio"]:checked + .maturity-option__label--parcial::before {
    content: "◐ ";
  }

  .maturity-option input[type="radio"]:checked + .maturity-option__label--no-cumple {
    border-color: #333 !important;
    color: #1F1F1F !important;
  }

  .maturity-option input[type="radio"]:checked + .maturity-option__label--no-cumple::before {
    content: "✗ ";
  }

  /* Texto de madurez */
  .maturity-text {
    background: #f9f9f9 !important;
    border-left: 3px solid #333 !important;
    padding: 0.4rem 0.6rem;
    font-size: 10pt;
    margin-top: 0.25rem;
  }

  .maturity-text--empty {
    display: none !important;
  }

  .maturity-text--cumple {
    border-left-color: #333 !important;
  }

  .maturity-text--parcial {
    border-left-color: #666 !important;
  }

  .maturity-text--no-cumple {
    border-left-color: #999 !important;
  }

  /* ============================================
     Resultados — Encabezado de empresa
     ============================================ */
  .results-header {
    background: #fff !important;
    border: 1px solid #ddd !important;
    border-radius: 0 !important;
    padding: 0.75rem;
    margin-bottom: 0.75rem;
    page-break-inside: avoid;
  }

  .results-header__title {
    font-size: 13pt;
    font-weight: 700;
    border-bottom: 1px solid #ccc !important;
    padding-bottom: 0.25rem;
    margin-bottom: 0.5rem;
  }

  .results-header__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.25rem 1rem;
  }

  .results-header__label {
    font-size: 8pt;
    color: #666 !important;
    text-transform: uppercase;
    letter-spacing: 0.03em;
  }

  .results-header__value {
    font-size: 10pt;
    font-weight: 500;
  }

  /* ============================================
     Resúmenes de cumplimiento
     ============================================ */
  .summary-section {
    background: #fff !important;
    border: 1px solid #ddd !important;
    border-radius: 0 !important;
    padding: 0.75rem;
    margin-bottom: 0.75rem;
    page-break-inside: avoid;
  }

  .summary-section__title {
    font-size: 12pt;
    font-weight: 700;
    border-bottom: 1px solid #ccc !important;
    padding-bottom: 0.25rem;
    margin-bottom: 0.5rem;
  }

  .summary-section__badge {
    border: 1px solid #333 !important;
    background: transparent !important;
    color: #1F1F1F !important;
    font-size: 8pt;
  }

  .summary-section__text {
    font-size: 10pt;
    line-height: 1.6;
  }

  /* ============================================
     Mensajes informativos (mantener visibles)
     ============================================ */
  .message--success,
  .message--info {
    border: 1px solid #ccc !important;
    padding: 0.4rem;
    font-size: 9pt;
  }

  /* ============================================
     Control de saltos de página
     ============================================ */
  h1, h2, h3, h4 {
    page-break-after: avoid;
  }

  .section-header,
  .card__title,
  .summary-section__title,
  .results-header__title {
    page-break-after: avoid;
  }

  .compliance-item,
  .card,
  .summary-section,
  .results-header {
    page-break-inside: avoid;
  }

  /* Forzar salto de página antes de cada sección principal */
  .summary-section:first-of-type {
    page-break-before: auto;
  }

  /* ============================================
     Links — Mostrar URL en impresión
     ============================================ */
  a[href]::after {
    content: " (" attr(href) ")";
    font-size: 8pt;
    color: #666 !important;
  }

  a[href^="#"]::after,
  a[href^="javascript"]::after {
    content: "";
  }

  /* ============================================
     Utilidades de impresión
     ============================================ */
  .hidden {
    display: none !important;
  }

  /* Márgenes de página */
  @page {
    margin: 1.5cm;
    size: A4;
  }

  @page :first {
    margin-top: 2cm;
  }
}


/* ============================================
   PDF Export Mode (applied via body.pdf-export)
   ============================================ */
body.pdf-export {
  background: #FFFFFF !important;
  color: #1F1F1F !important;
}

body.pdf-export .app-container {
  background: #FFFFFF !important;
}

body.pdf-export .results-header,
body.pdf-export .results-section {
  background: #FFFFFF !important;
  color: #1F1F1F !important;
  border: 1px solid #ddd !important;
  border-radius: 8px !important;
  padding: 16px !important;
  margin-bottom: 12px !important;
}

body.pdf-export .section-header__title {
  color: #157FF8 !important;
}

body.pdf-export .results-section__summary {
  color: #333 !important;
  line-height: 1.6 !important;
}

body.pdf-export .results-header__label {
  color: #666 !important;
}

body.pdf-export .results-header__value {
  color: #1F1F1F !important;
}

body.pdf-export .stepper,
body.pdf-export .nav-buttons,
body.pdf-export #results-message {
  display: none !important;
}

body.pdf-export .app-header {
  border-bottom: 2px solid #157FF8 !important;
  padding-bottom: 8px !important;
  margin-bottom: 16px !important;
}

body.pdf-export .app-header__title {
  color: #1F1F1F !important;
}

body.pdf-export .app-header__title span {
  color: #157FF8 !important;
}

body.pdf-export .app-header__subtitle {
  color: #666 !important;
}
