@charset "utf-8";
@font-face{font-family:Fraunces;src:url(fraunces-latin.woff2) format("woff2");font-weight:100 900;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Fraunces;src:url(fraunces-latin-ext.woff2) format("woff2");font-weight:100 900;font-display:swap;unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
/* Tlačová verzia receptu – spoločná šablóna pre všetky weby.
   Farby a písmo webu sa nastavujú cez premenné na .rt (napr. --rt-brand). */
@page { size: A4; margin: 11mm 13mm 13mm; }

.rt {
  --rt-brand: #c8102e;
  --rt-brand-soft: #fdecec;
  --rt-ink: #1f1f1f;
  --rt-muted: #6b6b6b;
  --rt-line: #e6e3df;
  --rt-box: #f5f4f2;
  --rt-head: Georgia, "Times New Roman", serif;
  --rt-body: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  color: var(--rt-ink);
  font: 10pt/1.5 var(--rt-body);
  max-width: 184mm;
  margin: 0 auto;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}
.rt * { box-sizing: border-box; }
.rt h1, .rt h2, .rt h3, .rt p, .rt ul, .rt ol { margin: 0; padding: 0; }
.rt ul, .rt ol { list-style: none; }

/* Hlavička */
.rt-top { display: flex; align-items: center; justify-content: space-between; gap: 6mm;
  padding-bottom: 3mm; border-bottom: 1.4pt solid var(--rt-brand); }
.rt-logo img { height: 13mm; width: auto; display: block; }
.rt-online { display: flex; align-items: center; gap: 4mm; text-align: right; }
.rt-online b { display: block; color: var(--rt-brand); font-size: 7.5pt; letter-spacing: .14em; }
.rt-online .rt-url { display: block; font-size: 8.5pt; max-width: 92mm; margin-left: auto; overflow-wrap: anywhere; line-height: 1.3; margin: .6mm 0 .6mm auto; }
.rt-online small { display: block; color: var(--rt-muted); font-size: 7pt; }
.rt-qr svg { width: 22mm; height: 22mm; display: block; }

/* Úvod */
.rt-intro { display: flex; gap: 6mm; margin-top: 4mm; align-items: flex-start; }
.rt-intro-text { flex: 1; }
.rt-cat { color: var(--rt-brand); font-size: 7.5pt; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.rt h1 { font: 600 19pt/1.2 var(--rt-head); margin: 2mm 0 2.5mm; }
.rt-lead { font-size: 10pt; color: #333; }
.rt-photo { width: 62mm; flex: 0 0 62mm; }
.rt-photo img { width: 100%; height: 38mm; object-fit: cover; border-radius: 3mm; display: block; }

/* Údaje */
.rt-facts { display: flex; margin-top: 4mm; background: var(--rt-box); border-radius: 2.5mm; padding: 2.4mm 0; }
.rt-fact { flex: 1 1 auto; padding: 0 3.5mm; border-left: .6pt solid #d6d2cc; }
.rt-fact:first-child { border-left: 0; }
.rt-fact span { display: flex; align-items: center; gap: 1.2mm; color: var(--rt-muted); font-size: 6.6pt; letter-spacing: .1em; text-transform: uppercase; }
.rt-fact span svg { width: 3mm; height: 3mm; stroke: var(--rt-brand); flex: none; }
.rt-fact b { display: block; font-size: 9.5pt; margin-top: .4mm; }

/* Dva stĺpce */
.rt-cols { display: flex; gap: 7mm; margin-top: 4mm; align-items: flex-start; }
.rt-left { width: 64mm; flex: 0 0 64mm; }
.rt-ing { background: var(--rt-box); border-radius: 3mm; padding: 4mm 4.5mm 3mm; }
.rt-steps { flex: 1; min-width: 0; }
.rt h2 { font: 600 13pt/1.2 var(--rt-head); display: flex; align-items: center; gap: 2mm; }
.rt h2 svg { width: 4.2mm; height: 4.2mm; stroke: var(--rt-brand); }
.rt-ing-head { display: flex; justify-content: space-between; align-items: baseline; padding-bottom: 2mm; border-bottom: .6pt solid #dcd8d2; }
.rt-ing-head small { color: var(--rt-muted); font-size: 8pt; }
.rt-group { color: var(--rt-brand); font-size: 7pt; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; margin: 3mm 0 .5mm; }
.rt-ing li { display: flex; justify-content: space-between; gap: 3mm; padding: 1.1mm 0; border-bottom: .5pt solid #e7e3dd; font-size: 9pt; line-height: 1.35; break-inside: avoid; }
.rt-ing li:last-child { border-bottom: 0; }
.rt-ing li em { font-style: normal; color: var(--rt-muted); }
.rt-ing li b { white-space: nowrap; text-align: right; }

.rt-steps-head { padding-bottom: 2mm; border-bottom: 1pt solid var(--rt-brand); margin-bottom: 1mm; }
.rt-steps ol { counter-reset: rt; }
.rt-steps li { position: relative; padding: 1.3mm 0 .4mm 9mm; counter-increment: rt; break-inside: avoid; font-size: 9.3pt; line-height: 1.45; }
.rt-steps li::before { content: counter(rt); position: absolute; left: 0; top: 1.9mm; width: 5.4mm; height: 5.4mm; border-radius: 50%;
  background: var(--rt-brand); color: #fff; font: 700 7.5pt/5.4mm var(--rt-body); text-align: center; }
.rt-steps li .rt-st { font: 600 10pt/1.35 var(--rt-head); margin-bottom: .4mm; }
.rt-steps li img { display: none; }

.rt-tip { margin-top: 2.5mm; background: var(--rt-brand-soft); border-left: 1.2mm solid var(--rt-brand); border-radius: 0 2.5mm 2.5mm 0;
  padding: 2.2mm 3.5mm; font-size: 8.6pt; line-height: 1.4; }
.rt-tip b { color: var(--rt-brand); }
.rt-tip + .rt-tip { margin-top: 2mm; }

.rt-nutri { margin-top: 4mm; padding: 0 1mm; break-inside: avoid; }
.rt-nutri h3 { font: 600 10pt var(--rt-head); }
.rt-nutri h3 small { display: block; font: 400 7.5pt var(--rt-body); color: var(--rt-muted); margin-top: .3mm; }
.rt-pills { display: flex; flex-wrap: wrap; gap: 1.6mm; margin-top: 2mm; }
.rt-pills span { white-space: nowrap; background: var(--rt-box); border-radius: 9mm; padding: .9mm 2.6mm; font-size: 7.5pt; color: var(--rt-muted); }
.rt-pills b { color: var(--rt-ink); font-size: 8.5pt; margin-left: 1mm; }

/* Päta */
.rt-foot { display: flex; justify-content: space-between; align-items: flex-end; margin-top: 5mm; padding-top: 2.5mm; border-top: .6pt solid var(--rt-line); break-inside: avoid; font-size: 7.5pt; color: var(--rt-muted); }
.rt-foot .rt-qr svg { width: 12mm; height: 12mm; }

/* Obrazovka: náhľad strany s tlačidlom */
@media screen {
  body.rt-page { background: #ebe9e6; margin: 0; padding: 18px 12px 40px; }
  body.rt-page .rt { background: #fff; padding: 12mm 13mm; box-shadow: 0 2px 14px rgba(0,0,0,.12); max-width: 210mm; }
  .rt-bar { max-width: 210mm; margin: 0 auto 12px; display: flex; gap: 10px; justify-content: flex-end; font: 14px var(--rt-body, sans-serif); }
  .rt-bar a, .rt-bar button { padding: 9px 16px; border-radius: 6px; border: 1px solid #bbb; background: #fff; color: #222; text-decoration: none; cursor: pointer; font: inherit; }
  .rt-bar button { background: var(--rt-brand, #c8102e); border-color: transparent; color: #fff; font-weight: 600; }
}
@media print {
  .rt-bar { display: none !important; }
  body.rt-page { margin: 0; background: #fff; }
}

/* Tip s ikonou a zoznamom */
.rt-tip { display: flex; gap: 2.5mm; }
.rt-tip .rt-tip-i { width: 4mm; height: 4mm; stroke: var(--rt-brand); flex: none; margin-top: .4mm; }
.rt-tip ul { margin-top: .8mm; }
.rt-tip li { break-inside: avoid; position: relative; padding: 0 0 0 3mm; margin-top: .5mm; font-size: 8.6pt; line-height: 1.4; }
.rt-tip li::before { content: ""; position: absolute; left: 0; top: 2.1mm; width: 1.2mm; height: 1.2mm; border-radius: 50%; background: var(--rt-brand); }
.rt-steps .rt-group { margin-top: 2.5mm; }
.rt-steps li p { margin: 0; }

/* Textové logo (recepto.sk) */
.rt-textlogo { font: 700 22pt/1 var(--rt-head); letter-spacing: -.02em; color: #2b2118; }
.rt-textlogo i { font-style: normal; display: inline-block; background: var(--rt-brand); color: #fff; border-radius: .24em; width: 1.08em; text-align: center; margin-right: .06em; }
.rt-textlogo span { color: var(--rt-brand); }
.rt-textlogo-s { font-size: 10pt; }
.rt-group { break-after: avoid; }

.rt{--rt-brand:#C2410C;--rt-brand-soft:#FBEDE4;--rt-head:Fraunces,Georgia,serif}
@page{@bottom-left{content:"recepto.sk";font:7.5pt Georgia,serif;color:#6b6b6b}@bottom-right{content:"Strana " counter(page) " z " counter(pages);font:7.5pt -apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:#6b6b6b}}