/* ==========================================================================
   PRO PACIENTY — /pacienti/
   Stojí na assets/css/vyuka.css (papír, karty, autor v záhlaví, předpona v-).
   Tady je jen to, co výuka nemá: kalkulačky, záznamník tlaku, kontrolní seznam,
   tlačítka karty a tisk na jednu A4 s QR kódem. Předpona p-.
   ========================================================================== */

/* Vyvážené řádky: bez osamoceného posledního slova („… na 7 / dní“). */
.p-hero h1, .v-card h3 { text-wrap: balance; }
.p-hero .v-eyebrow a { color: inherit; text-decoration: none; }
.p-hero .v-eyebrow a:hover { color: var(--v-ink); }
.p-uvod { margin-bottom: 8px; }

/* ---------- Kalkulačky (jen rozcestník) ---------- */
.p-kalkulacky { margin-top: 72px; padding-top: 44px; border-top: 1px solid var(--v-line); }
.p-kalkulacky > h2 { font: 400 clamp(30px, 4vw, 40px)/1.12 var(--font-display); color: var(--v-ink); margin: 0 0 10px; }
.p-kalkulacky__uvod { font: 400 15px/1.6 var(--font-body); color: var(--v-ink-3); margin: 0; max-width: var(--v-measure); }

.p-tool-nav { display: flex; flex-wrap: wrap; gap: 8px; margin: 22px 0 26px; }
.p-tool-nav a {
  font: 500 13px/1 var(--font-body); color: var(--v-ink-2); text-decoration: none;
  padding: 9px 14px; border: 1px solid var(--v-line); border-radius: 999px; background: var(--v-paper);
  transition: border-color 150ms, color 150ms;
}
.p-tool-nav a:hover { border-color: var(--v-gold-line); color: var(--v-gold); }

.p-tool {
  display: grid; grid-template-columns: minmax(220px, .85fr) minmax(0, 1.35fr); gap: clamp(20px, 4vw, 52px);
  padding: clamp(20px, 3.5vw, 36px); scroll-margin-top: 88px;
  background: var(--v-paper-2); border: 1px solid var(--v-line); border-radius: var(--radius-md);
}
.p-tool + .p-tool { margin-top: 18px; }
.p-tool__intro { display: flex; align-items: flex-start; gap: 14px; }
.p-tool__mark { flex: none; margin: 8px 0 0; font: 500 12px/1 var(--font-mono); letter-spacing: .14em; color: var(--v-gold); }
.p-tool h3 { font: 400 clamp(24px, 2.6vw, 30px)/1.2 var(--font-display); color: var(--v-ink); margin: 0; }
.p-tool__intro p:last-child { margin: 10px 0 0; font: 400 15px/1.6 var(--font-body); color: var(--v-ink-2); }

.p-calc { min-width: 0; }
.p-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.p-fields--tri { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.p-field-wide { grid-column: span 2; }
.p-calc label { display: grid; gap: 6px; font: 500 13.5px/1.3 var(--font-body); color: var(--v-ink); }
.p-calc label span { font-weight: 400; font-size: 12px; color: var(--v-ink-3); }
.p-calc input[type="number"], .p-calc select {
  width: 100%; min-height: 44px; padding: 9px 12px; box-sizing: border-box;
  font: 500 15px/1.2 var(--font-mono); font-variant-numeric: tabular-nums; color: var(--v-ink);
  background: var(--v-paper); border: 1px solid var(--v-line); border-radius: var(--radius-sm);
}
.p-calc select { font-family: var(--font-body); font-weight: 400; }
.p-calc input[type="number"]:focus, .p-calc select:focus { outline: none; border-color: var(--v-gold); background: #fff; }

.p-checks {
  display: flex; flex-wrap: wrap; gap: 10px 18px; margin: 16px 0; padding: 14px 16px;
  border: 1px dashed var(--v-gold-line); border-radius: var(--radius-sm); background: var(--v-gold-soft);
}
.p-checks legend { padding: 0 6px; font: 500 11px/1 var(--font-body); letter-spacing: .14em; text-transform: uppercase; color: var(--v-gold); }
.p-checks label { display: flex; align-items: center; gap: 8px; font-weight: 400; font-size: 14.5px; color: var(--v-ink-2); }
.p-checks input { width: 18px; height: 18px; margin: 0; accent-color: var(--v-gold); }
.p-checks--sloupce { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }

.p-calc button, .p-tlacitko {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px;
  padding: 10px 20px; margin-top: 4px; box-sizing: border-box;
  font: 500 14px/1.2 var(--font-body); letter-spacing: .02em; text-decoration: none; cursor: pointer;
  color: var(--v-paper); background: var(--v-ink); border: 1px solid var(--v-ink); border-radius: var(--radius-sm);
  transition: background 150ms, border-color 150ms, color 150ms;
}
.p-calc button:hover, .p-tlacitko:hover { background: var(--v-gold); border-color: var(--v-gold); color: #fff; }
.p-tlacitko--obrys { color: var(--v-ink); background: transparent; }

.p-calc .result {
  display: none; margin-top: 16px; padding: 16px 20px;
  font: 400 15.5px/1.6 var(--font-body); color: var(--v-ink);
  background: var(--v-teal-soft); border: 1px solid var(--v-teal-line); border-left: 3px solid var(--v-teal);
  border-radius: var(--radius-sm);
}
.p-calc .result[data-visible="true"] { display: block; }
.p-calc .result strong { color: var(--v-teal); font-weight: 600; font-size: 1.08em; }
.p-calc .result--plan dl { display: grid; grid-template-columns: max-content 1fr; gap: 6px 16px; margin: 0; }
.p-calc .result--plan dt { font-weight: 600; color: var(--v-teal); }
.p-calc .result--plan dd { margin: 0; color: var(--v-ink-2); }
.p-calc .result--plan ul { margin: 12px 0 0; padding-left: 1.2em; }

/* ---------- Karta ---------- */
.p-akce { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; margin-top: 2.2em; }
.p-zpet { font: 500 14px/1.2 var(--font-body); color: var(--v-gold); text-underline-offset: 3px; }
.p-upozorneni { font: 400 14px/1.6 var(--font-body); color: var(--v-ink-3); }

.p-checklist { list-style: none; padding-left: 0 !important; }
.p-checklist li + li { margin-top: .6em; }
.p-checklist label { display: flex; align-items: flex-start; gap: 12px; cursor: pointer; }
.p-checklist input { flex: none; width: 20px; height: 20px; margin: 4px 0 0; accent-color: var(--v-teal); }

.p-zaznamnik { width: 100%; border-collapse: collapse; font-size: 14px; }
.v-prose .p-zaznamnik th, .v-prose .p-zaznamnik td { border: 1px solid var(--v-line); padding: 8px 10px; }
.v-prose .p-zaznamnik thead th { background: var(--v-paper-2); font: 500 12px/1.3 var(--font-body); color: var(--v-ink-2); }
.p-zaznamnik td { height: 40px; }
.p-zaznamnik td:first-child { width: 14%; font-weight: 500; color: var(--v-ink-2); }
.p-zaznamnik td:last-child { width: 22%; }

.p-tisk-pata { display: none; }

@media (max-width: 760px) {
  .p-tool { grid-template-columns: 1fr; }
  .p-fields, .p-fields--tri, .p-checks--sloupce { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 480px) {
  .p-fields, .p-fields--tri, .p-checks--sloupce { grid-template-columns: 1fr; }
  .p-field-wide { grid-column: auto; }
}

/* ---------- Tisk: karta na jednu A4 ---------- */
@page { size: A4; margin: 13mm 14mm 12mm; }
@media print {
  /* style.css dává html i body tmavé pozadí webu; s tiskem pozadí by prosáklo na papír. */
  html, body.pacienti { background: #fff !important; min-height: 0; }
  body.pacienti main { max-width: none; padding: 0; }
  body.pacienti .topnav, body.pacienti footer, .p-akce, .p-kalkulacky, .v-source, .v-state { display: none !important; }

  .p-hero { padding: 0 0 8pt; margin-bottom: 10pt; }
  .p-hero .v-eyebrow { margin-bottom: 6pt; font-size: 7.5pt; }
  .p-hero h1 { font-size: 22pt; margin-bottom: 6pt; }
  .p-hero .v-lede { display: none; }
  .v-byline { margin-top: 8pt; }
  .v-byline__foto { width: 26px; height: 26px; }
  .v-byline__text { font-size: 8.5pt; }
  .v-meta { margin-top: 6pt; font-size: 8pt; }

  .p-prose { max-width: none; font-size: 9.8pt; line-height: 1.36; }
  .p-prose > * + * { margin-top: .55em; }
  .p-prose h2 { font-size: 14pt; margin-top: 8pt; padding-top: 0; border-top: 0; break-after: avoid; }
  .p-prose li + li { margin-top: .25em; }
  .p-prose table { font-size: 9.5pt; }
  .p-prose th, .p-prose td { padding: 4pt 6pt; }
  .v-box { padding: 7pt 10pt; break-inside: avoid; }
  .v-box, .v-box p { font-size: 9.5pt; line-height: 1.4; }
  .p-zaznamnik { break-inside: avoid; }
  .p-zaznamnik td { height: 9mm; }
  .p-upozorneni { font-size: 8pt; margin-top: 10pt; }

  /* QR jako štítek v pravém horním rohu první (jediné) strany. */
  .p-karta { position: relative; }
  .p-karta .p-hero { padding-right: 46mm; }
  .p-tisk-pata {
    display: block; position: absolute; top: 0; right: 0; width: 40mm; text-align: center;
    font: 400 7.5pt/1.35 var(--font-body); color: var(--v-ink-2);
  }
  .p-tisk-pata p { margin: 3pt 0 0; }
  .p-qr { display: block; width: 24mm; height: 24mm; margin: 0 auto; }
}