body {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    background-color: #fff;
    font: 11pt "Open Sans", Arial, sans-serif;
}

* {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    margin: 0;
    padding: 0;
}

/* A4 strana */
.page {
    width: 210mm;
    min-height: auto;
    height: auto;
    margin: 0 auto;
    background: #ffffff;
    position: relative;
    display: flex;
    flex-direction: column;
}

/* vnútro strany */
 .subpage {
    /* padding: 1cm; */
    /* border: 5px red solid; */
    height: 297mm;
    /* outline: 2cm #FFEAEA solid; */
    position:relative;	
    overflow: hidden;	
}

/* header obrázky */
.w100 {
    width: 90%;
}

h2 { font-size:50px; margin:50px 0; }

/* pásik kategórie v spodnej lište úvodnej strany */
.categoria { width:100%; color: #FFFFFF; font-size: 20px;text-align: left;padding: 10px; margin: 0 0 6px; border-radius: 5px; position:relative; }
.categoria img { position:absolute; right:10px; top:0px; width:auto; height:44px; }

/* ---------- PRODUKTY ---------- */

.produkt {
    float: left;
    width: 50%;
    height: 205px;                 /* stále 2 × 5 kusov na A4 */
    padding: 10px 12px;
    position: relative;
}

/* kartička v pozadí */
.produkt::before {
    content: "";
    position: absolute;
    inset: 4px 6px;
    border-radius: 0px;
    background: #f7f8fb;
    box-shadow: 0 0 0 1px #e2e4ec;
    z-index: 0;
}

/* obrázok produktu – vpravo, centrovaný */
.produkt img {
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    height: 80%;
    width: auto;
    max-width: 45%;
    object-fit: contain;
    z-index: 1;
}

/* text vľavo */
.popis {
    position: absolute;
    top: 16px;
    left: 18px;
    text-align: left;
    font-size: 9pt;
    max-width: 46%;
    line-height: 1.25;
    z-index: 1;
}

.popis h3 {
    font-size: 10pt;
    font-weight: 700;
    margin-bottom: 4px;
}

/* kód produktu – farebný „štítok“ podľa kategórie */
.code {
    display: inline-block;
    margin: 4px 0 6px;
    padding: 3px 10px;
    color: #FFFFFF;
    min-width: 48px;
    border-radius: 0px;
    font-weight: 700;
    font-size: 8.5pt;
    text-align: center;
}

/* technické info (balenie, kartón...) */
.tmodra {
    color: #3a4cd9;
    font-size: 8.5pt;
}

/* ---------- horný riadok stránky s ikonou kategórie ---------- */

.toprow { position:relative; width:100%; height:45px; margin-bottom:35px; }
.top { position:absolute; right:0; top:10px; color:#FFFFFF; font-size:20px; font-weight:bold; padding:10px 20px 10px 20px; min-width:40%; }
.toprow img { position:absolute; left:25px; top:10px; }

.footer { position:absolute; bottom:0; width:100%; color:#000; text-align:center; background:#c4c8cf; padding: 10px; font-weight: bold; font-size: 14px; } /* 03a9f1 */
.footer a {  color:#03a9f1; text-decoration:none; }

/* farby */
.zelena_bcg  { background: rgb(122,177,37); }
.modra_bcg   { background: rgb(0,177,235); }
.cervena_bcg { background: rgb(230,47,40); }
.ruzova_bcg  { background: rgb(230,119,169); }
.oranzova_bcg{ background: rgb(224,131,48); }

.zelena  { color: rgb(122,177,37); }
.modra   { color: rgb(0,177,235); }
.cervena { color: rgb(230,47,40); }
.ruzova  { color: rgb(230,119,169); }
.oranzova{ color: rgb(224,131,48); }

/* malý helper pre text */
.tmodra { color: #3a4cd9; }

/* A4 nastavenia */
@page {
    size: A4;
    margin: 10mm;
}

@media print {
    html, body {
        width: 210mm;
        height: 297mm;
        margin: 0;
        padding: 0;
    }

    .page {
        page-break-after: auto;
    }
}