/*
Theme Name: Lodek Custom Theme
Theme URI: https://lodekbilgoraj.pl
Description: Custom WooCommerce theme dla sklepu z lodami
Version: 1.1
Text Domain: my-custom-theme
*/

/* =========================================================
   CENA PROMOCYJNA — karta produktu (listing, sklep, slidery)
   ========================================================= */
.product-price del,
.product-price .price-regular {
    display: inline-block !important;
    color: #999 !important;
    text-decoration: line-through !important;
    text-decoration-color: #e63946 !important;
    font-size: 0.85em !important;
    margin-right: 8px !important;
    font-weight: 400 !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.product-price ins,
.product-price .price-sale {
    display: inline-block !important;
    color: #e63946 !important;
    text-decoration: none !important;
    font-weight: 700 !important;
}

.product-price.is-on-sale {
    display: flex !important;
    align-items: baseline;
    gap: 6px;
    flex-wrap: wrap;
}

/* =========================================================
   ETYKIETA -XX% NA KARCIE PRODUKTU (lewa strona)
   ========================================================= */
.product-sale-badge {
    position: absolute;
    top: 10px;
    left: 10px;
    background: #e63946;
    color: #fff;
    font-weight: 700;
    font-size: 12px;
    padding: 4px 10px;
    border-radius: 6px;
    z-index: 3;
    box-shadow: 0 2px 6px rgba(230, 57, 70, 0.25);
    letter-spacing: 0.3px;
}

/* Kategoria — przeniesiona na prawą stronę, żeby nie kolidowała z badge'em promocji */
.product-image .product-badge {
    /* Pozycjonowanie nadrzędne nie jest zmieniane (jest w zewnętrznym CSS) — ten zapis
       to bezpiecznik, gdyby nadrzędny CSS używał lewej strony. */
    right: 10px !important;
    left: auto !important;
}

/* =========================================================
   CENA PROMOCYJNA — STRONA PRODUKTU (single product)
   ========================================================= */
.price-section.is-on-sale {
    display: flex !important;
    align-items: baseline;
    gap: 10px;
    flex-wrap: wrap;
}

.product-price-old {
    text-decoration: line-through !important;
    text-decoration-color: #e63946 !important;
    color: #999 !important;
    font-size: 0.75em !important;
    font-weight: 400 !important;
    opacity: 0.9;
}

.product-price-sale {
    color: #e63946 !important;
    font-weight: 700 !important;
}

.product-price-badge {
    background: #e63946;
    color: #fff;
    font-size: 0.7em;
    font-weight: 700;
    padding: 3px 8px;
    border-radius: 6px;
    align-self: center;
    letter-spacing: 0.3px;
}

/* Duża etykieta -XX% na zdjęciu produktu (single product) — lewa góra */
.product-sale-badge-big {
    position: absolute;
    top: 20px;
    left: 20px;
    background: #e63946;
    color: #fff;
    font-weight: 700;
    font-size: 18px;
    padding: 8px 14px;
    border-radius: 8px;
    z-index: 3;
    box-shadow: 0 2px 8px rgba(230, 57, 70, 0.3);
    letter-spacing: 0.5px;
}

/* =========================================================
   ANIMACJA ETYKIETY PROMOCJI (delikatny puls)
   ========================================================= */
@keyframes loodek-sale-pulse {
    0%, 100% { transform: scale(1); }
    50%      { transform: scale(1.05); }
}

.product-sale-badge,
.product-sale-badge-big {
    animation: loodek-sale-pulse 2.4s ease-in-out infinite;
}

/* =========================================================
   RESPONSYWNOŚĆ
   ========================================================= */
@media (max-width: 600px) {
    .product-sale-badge {
        font-size: 11px;
        padding: 3px 8px;
        top: 8px;
        left: 8px;
    }
    .product-sale-badge-big {
        font-size: 15px;
        padding: 6px 11px;
        top: 14px;
        left: 14px;
    }
}

/* =========================================================
   OWL CAROUSEL — strzałki nawigacji
   Problem: strzałka ">" nakłada się na ikonę "Dodaj do koszyka"
   w prawym dolnym rogu karty produktu (sekcja "Nasze bestsellery").
   Rozwiązanie: na mobile przesuwamy strzałki pionowo WYŻEJ (z 50% na ~25%),
   żeby były na poziomie środka zdjęcia, a nie kolidowały z ikoną koszyka.
   Na desktopie przesuwamy strzałki poza karty na boki kontenera.
   ========================================================= */

/* Desktop — strzałki na zewnątrz kart */
#products-carousel.owl-carousel .owl-nav button.owl-prev,
#reviews-carousel.owl-carousel .owl-nav button.owl-prev {
    left: -20px !important;
}

#products-carousel.owl-carousel .owl-nav button.owl-next,
#reviews-carousel.owl-carousel .owl-nav button.owl-next {
    right: -20px !important;
}

/* Mobile/tablet — przesuwamy strzałki pionowo wyżej, żeby były na zdjęciu
   produktu, a nie na ikonie "Dodaj do koszyka" w prawym dolnym rogu karty */
@media (max-width: 1024px) {
    #products-carousel.owl-carousel .owl-nav button.owl-prev,
    #products-carousel.owl-carousel .owl-nav button.owl-next,
    #reviews-carousel.owl-carousel .owl-nav button.owl-prev,
    #reviews-carousel.owl-carousel .owl-nav button.owl-next {
        top: 25% !important;
        transform: translateY(-50%) !important;
    }
}