/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Oct 22 2026 | 08:49:07 */
/* ==================================================
   OPPIO – produktová stránka: dizajnový systém
   Verzia 1.0 – 26. 8. 2026

   Krok 1 z prestavby podľa konceptu.
   Nemení štruktúru stránky, iba typografiu, rozostupy,
   farby a tvary. Vypnutím snippetu je všetko ako predtým.

   Poznámka: web používa Poppins bez kurzívy, preto sú
   nadpisy 700 bez kurzívy, nie 800 kurzívou ako v koncepte.
   ================================================== */


/* ==================================================
   1. FARBY ZNAČKY
   ================================================== */

body.single-product {
    --opp-green:  #123F32;
    --opp-deep:   #092A21;
    --opp-ink:    #111111;
    --opp-soft:   #4A544E;
    --opp-faint:  #9A9384;
    --opp-line:   #E3DCCE;
    --opp-rule:   #D7CDB9;
}


/* ==================================================
   2. OSTRÉ HRANY
   Značka má ostré alebo minimálne zaoblenie.
   Zaoblené "appkové" karty sa rušia.
   ================================================== */

body.single-product .pdl-hero,
body.single-product .pdl-mobile-slider,
body.single-product .pdl-swiper-desktop .swiper-slide,
body.single-product .quantity-controls,
body.single-product .qty-input,
body.single-product .custom-add-to-cart-btn {
    border-radius: 2px !important;
}


/* ==================================================
   3. NÁZOV PRODUKTU A ANGLICKÝ NÁZOV
   Anglický názov ide pod názov ako tichý štítok.
   Zelené podčiarknutie sa ruší.
   ================================================== */

body.single-product .product-detail__title {
    display: block !important;
    margin: 0 0 20px !important;
}

body.single-product .product-detail__title::after {
    display: none !important;
}

body.single-product .product-detail__title > span:first-child {
    display: block !important;
    margin: 0 !important;
    font-size: clamp(30px, 3.2vw, 44px) !important;
    font-weight: 700 !important;
    line-height: 1.05 !important;
    letter-spacing: -0.035em !important;
    color: var(--opp-ink) !important;
}

body.single-product .product-detail__title > span:last-child {
    display: block !important;
    margin: 8px 0 0 !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    letter-spacing: 0.16em !important;
    text-transform: uppercase !important;
    color: var(--opp-faint) !important;
}


/* ==================================================
   4. CHUŤOVÝ OPIS A ŠKÁLY
   Pole Produkt claim. Text sa zväčší a upokojí.
   ================================================== */

body.single-product #product-info-side .elementor-widget-text-editor p {
    max-width: 46ch;
    margin-bottom: 0;
    color: #2C3833;
    font-size: 16.5px;
    line-height: 1.55;
}


/* ==================================================
   5. CENA
   Číslice sa zarovnajú pod seba.
   ================================================== */

body.single-product .sin-custom-price {
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}


/* ==================================================
   6. MNOŽSTVO A TLAČIDLO DO KOŠÍKA
   ================================================== */

body.single-product .quantity-controls {
    border: 1px solid var(--opp-ink) !important;
    background: transparent !important;
}

body.single-product .qty-btn {
    color: var(--opp-ink) !important;
    background: transparent !important;
}

body.single-product .qty-input {
    border: 0 !important;
    background: transparent !important;
    font-weight: 600 !important;
    font-variant-numeric: tabular-nums;
}

body.single-product .custom-add-to-cart-btn {
    padding: 18px 24px !important;
    background: var(--opp-green) !important;
    border: 1px solid var(--opp-green) !important;
    color: #FFFFFF !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    letter-spacing: 0.09em !important;
    text-transform: uppercase !important;
    transition: background .18s ease, border-color .18s ease !important;
}

body.single-product .custom-add-to-cart-btn:hover,
body.single-product .custom-add-to-cart-btn:focus-visible {
    background: var(--opp-deep) !important;
    border-color: var(--opp-deep) !important;
}

body.single-product .custom-add-to-cart-btn.not-allowed {
    background: var(--opp-faint) !important;
    border-color: var(--opp-faint) !important;
}


/* ==================================================
   7. GALÉRIA
   Kompaktnejšie rozostupy, tlmené ovládanie.
   ================================================== */

body.single-product .pdl-top {
    gap: 8px !important;
    margin-bottom: 8px !important;
}

body.single-product .pdl-bottom {
    padding-bottom: 34px !important;
}

body.single-product .pdl-desk-next,
body.single-product .pdl-desk-prev,
body.single-product .pdl-mob-next,
body.single-product .pdl-mob-prev {
    color: var(--opp-green) !important;
}

body.single-product .pdl-desk-dots .swiper-pagination-bullet-active,
body.single-product .pdl-mob-dots .swiper-pagination-bullet-active {
    background: var(--opp-green) !important;
}


/* ==================================================
   8. PRÍSTUPNOSŤ
   Viditeľné ohraničenie pri ovládaní klávesnicou.
   ================================================== */

body.single-product #product-info-side :focus-visible,
body.single-product .pdl-wrapper :focus-visible {
    outline: 2px solid var(--opp-green) !important;
    outline-offset: 3px !important;
}


/* ==================================================
   9. MOBIL
   ================================================== */

@media (max-width: 767px) {

    body.single-product .product-detail__title > span:first-child {
        font-size: 30px !important;
    }

    body.single-product .custom-add-to-cart-btn {
        padding: 16px 20px !important;
        font-size: 12px !important;
    }
}


/* ==================================================
   10. OBMEDZENÝ POHYB
   ================================================== */

@media (prefers-reduced-motion: reduce) {

    body.single-product .custom-add-to-cart-btn {
        transition: none !important;
    }
}