/* ============================================================
   print.css — Estilos de impresión · Historia Clínica Digital
   Objetivo: TODO en UNA SOLA HOJA carta/A4
   ============================================================ */

/* Estilos globales de impresión (solo se aplican al imprimir) */
@media print {
  * {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
    box-sizing: border-box;
  }

  body > *:not(#print-view) { display: none !important; }
  body { margin: 0; padding: 0; background: white; }

  @page {
    size: letter portrait;
    margin: 0.25cm 0.3cm;
  }

  #print-view {
    display: block !important;
  }
}

/* Estilos de estructura y diseño del documento (activos en impresión y en pantalla para html2canvas) */
#print-view {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 6.8pt; /* Cambiado dinámicamente por JS si es necesario */
  line-height: 1.13;
  color: #111;
  width: 100%;
  background: white;
}

  /* ── Utilities ─────────────────────────────────────────── */
  .p-bold   { font-weight: bold; }
  .p-italic { font-style: italic; }
  .p-gold   { color: #8b6a20; }
  .p-gray   { color: #555; }
  .p-center { text-align: center; }
  .p-right  { text-align: right; }
  .p-upper  { text-transform: uppercase; }
  .p-small  { font-size: 0.85em; }
  .p-tiny   { font-size: 0.76em; }

  /* ── Header ────────────────────────────────────────────── */
  .p-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 0.44em;
    border-bottom: 0.22em solid #111;
    margin-bottom: 0.51em;
  }
  .p-logo { height: 5em; width: auto; }
  .p-title-block { text-align: left; }
  .p-title {
    font-size: 1.54em;
    font-weight: bold;
    letter-spacing: 0.04em;
    text-transform: uppercase;
  }
  .p-subtitle { font-size: 0.95em; color: #555; margin-top: 0.15em; }
  .p-id-block { text-align: right; font-size: 0.95em; }
  .p-id-block strong { font-size: 1.1em; }
  .p-id-line {
    display: inline-block;
    min-width: 8.8em;
    border-bottom: 0.11em solid #777;
    margin-left: 0.44em;
    vertical-align: bottom;
  }

  /* ── Section titles ────────────────────────────────────── */
  .p-section-title {
    font-size: 0.95em;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: #333;
    background: #efefef;
    padding: 0.22em 0.58em;
    margin: 0.44em 0 0.3em;
    border-left: 0.36em solid #8b6a20;
  }

  /* ── Field rows ────────────────────────────────────────── */
  .p-row {
    display: flex;
    gap: 0.88em;
    margin-bottom: 0.3em;
    align-items: flex-end;
  }
  .p-col    { flex: 1; min-width: 0; }
  .p-col-2  { flex: 2; min-width: 0; }
  .p-col-3  { flex: 3; min-width: 0; }
  .p-col-05 { flex: 0.5; min-width: 0; }

  .p-field {
    display: flex;
    align-items: flex-end;
    gap: 0.3em;
    width: 100%;
  }
  .p-label {
    font-size: 0.81em;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #444;
    white-space: nowrap;
    flex-shrink: 0;
  }
  .p-value {
    flex: 1;
    border-bottom: 0.07em solid #999;
    min-height: 1.18em;
    padding-bottom: 0.07em;
    font-size: 1em;
    color: #111;
    word-break: break-word;
    min-width: 0;
  }
  .p-value.p-block {
    border-bottom: none;
    border: 0.07em solid #ccc;
    padding: 0.22em 0.3em;
    min-height: 1.76em;
    border-radius: 0.15em;
  }

  /* ── Two-column ────────────────────────────────────────── */
  .p-two-col {
    display: flex;
    gap: 0.88em;
    margin-bottom: 0.3em;
  }
  .p-left-col  { flex: 1.2; min-width: 0; }
  .p-right-col { flex: 1; min-width: 0; }
  .p-col-sep {
    width: 0.07em;
    background: #ddd;
    flex-shrink: 0;
  }

  /* ── Vitals ────────────────────────────────────────────── */
  .p-vitals-row {
    display: flex;
    gap: 0.58em;
    background: #f8f8f8;
    border: 0.07em solid #ddd;
    border-radius: 0.22em;
    padding: 0.3em 0.6em;
    margin-bottom: 0.3em;
  }
  .p-vital { display: flex; flex-direction: column; align-items: center; flex: 1; }
  .p-vital-label {
    font-size: 0.73em;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #666;
  }
  .p-vital-value {
    font-size: 1.1em;
    font-weight: bold;
    color: #111;
    border-bottom: 0.07em solid #999;
    min-width: 4.4em;
    text-align: center;
    padding-bottom: 0.07em;
  }
  .p-vital-sep { width: 0.07em; background: #ddd; margin: 0 0.3em; }

  /* ── Disease table ─────────────────────────────────────── */
  .p-disease-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.91em;
    margin-bottom: 0.3em;
  }
  .p-disease-table thead tr { background: #efefef; }
  .p-disease-table thead th {
    padding: 0.22em 0.44em;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    border: 0.07em solid #ccc;
    font-size: 0.81em;
    color: #333;
  }
  .p-disease-table tbody td {
    padding: 0.15em 0.44em;
    border: 0.07em solid #e8e8e8;
    vertical-align: middle;
    transition: background-color 0.2s;
  }
  .p-disease-table tbody tr:nth-child(even) td { background: #fafafa; }
  .p-disease-check { font-size: 0.95em; font-weight: bold; }
  .p-disease-name  { color: #333; }
  .p-disease-time  { color: #555; font-style: italic; }
  .p-disease-sep   { border-left: 0.15em solid #ccc !important; }

  /* Checked/Unchecked visual treatments */
  .p-disease-name.unchecked {
    color: #777;
    font-weight: normal;
  }
  .p-disease-name.checked {
    color: #000;
    font-weight: bold;
    background-color: #eef8ff !important;
  }
  .p-disease-time.checked {
    color: #000;
    font-weight: bold;
    background-color: #eef8ff !important;
  }
  .p-disease-time.unchecked {
    color: #999;
  }
  .p-marker {
    font-family: Courier, monospace;
    font-weight: bold;
    font-size: 1em;
    margin-right: 0.3em;
    letter-spacing: -0.5px;
  }
  .checked .p-marker {
    color: #0056b3;
  }
  .unchecked .p-marker {
    color: #888;
  }

  /* ── Generic table ─────────────────────────────────────── */
  .p-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.91em;
    margin-bottom: 0.3em;
  }
  .p-table thead th {
    background: #efefef;
    padding: 0.22em 0.44em;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    border: 0.07em solid #ccc;
    font-size: 0.81em;
    color: #333;
  }
  .p-table tbody td {
    padding: 0.22em 0.44em;
    border: 0.07em solid #e8e8e8;
    color: #222;
    vertical-align: middle;
  }
  .p-table tbody td.p-td-label {
    font-weight: bold;
    color: #333;
    background: #fafafa;
    width: 35%;
  }
  .p-table tbody tr:nth-child(even) td { background: #f7f7f7; }
  .p-table tbody tr:nth-child(even) td.p-td-label { background: #f2f2f2; }

  /* Active/Inactive states for Family History table */
  .p-fam-inactive td {
    color: #777;
  }
  .p-fam-inactive td.p-td-label {
    color: #777;
    font-weight: normal !important;
  }
  .p-fam-inactive td.p-fam-value {
    color: #999;
    font-style: italic;
  }
  .p-fam-active td {
    color: #000;
    background-color: #eef8ff !important;
  }
  .p-fam-active td.p-td-label {
    color: #000;
    font-weight: bold;
  }
  .p-fam-active td.p-fam-value {
    color: #000;
    font-weight: bold;
  }

  /* ── Risk questions ────────────────────────────────────── */
  .p-risk-question {
    display: flex;
    align-items: flex-start;
    gap: 0.44em;
    margin-bottom: 0.22em;
    font-size: 0.95em;
    padding: 0.22em 0.44em;
    border: 0.07em solid #ddd;
    border-radius: 0.15em;
  }
  .p-risk-q { flex: 1; }
  .p-risk-a { font-weight: bold; color: #111; min-width: 2.65em; text-align: right; }

  /* Yes/No Risk Question States */
  .p-risk-question.checked {
    background-color: #fff3f3 !important;
    border-color: #ffcccc;
    color: #b30000;
  }
  .p-risk-question.checked .p-risk-a {
    color: #b30000;
  }
  .p-risk-question.unchecked {
    color: #777;
    border-color: #eee;
  }
  .p-risk-question.unchecked .p-risk-a {
    color: #777;
    font-weight: normal;
  }
  .p-risk-especifique {
    font-size: 0.88em;
    color: #444;
    font-style: italic;
    border-bottom: 0.07em solid #bbb;
    margin: 0.07em 0 0.22em 1.18em;
    padding-bottom: 0.07em;
  }

  /* ── Observations ──────────────────────────────────────── */
  .p-obs-lines { margin-bottom: 0.22em; }
  .p-obs-line {
    border-bottom: 0.07em solid #bbb;
    height: 1.25em;
    margin-bottom: 0.15em;
  }

  /* ── Footer / Signature ────────────────────────────────── */
  .p-footer {
    margin-top: 0.58em;
    padding-top: 0.44em;
    border-top: 0.11em solid #888;
  }
  .p-consent-text {
    font-size: 0.88em;
    color: #333;
    font-style: italic;
    text-align: center;
    margin-bottom: 0.73em;
    line-height: 1.3;
    font-weight: bold;
  }
  .p-signature-area {
    display: flex;
    justify-content: center;
    margin-bottom: 0.44em;
  }
  .p-signature-box { text-align: center; width: 55em; }
  .p-signature-line {
    border-bottom: 0.15em solid #111;
    height: 2.65em;
    margin-bottom: 0.3em;
    width: 100%;
  }
  .p-signature-label { font-size: 1.03em; color: #333; font-weight: bold; }
  .p-legal {
    text-align: center;
    font-size: 0.73em;
    color: #888;
    line-height: 1.35;
    border-top: 0.07em solid #ddd;
    padding-top: 0.3em;
    margin-top: 0.3em;
  }

  /* ── Page control ──────────────────────────────────────── */
  .p-no-break  { page-break-inside: avoid; }
  .p-page-break { page-break-before: always; }