:root {
    --product-mb: 1rem;
}

#blockcart-modal .btn-extra {
    font-size: medium;
}
#blockcart-modal .btn.btn-outline-primary {
    font-size: medium;
}

#blockcart-modal .abcweb-cart-promo {
    background-color: unset;
    padding: unset;
    box-shadow: unset;
    margin-bottom: unset;

    margin-top: 1rem;
    border-top: 1px solid var(--alfa-gold);
    padding-top: 1rem;
}

.product>div:first-of-type {
    padding-left: 0;
}

.product>div:last-of-type {
    padding-right: 0;
}

/* product: box */
.abc-product-data {
    margin-bottom: var(--product-mb, 1rem);
    padding: 2rem;
    border: 1px solid whitesmoke;
    border: 1px solid var(--alfa-grey, whitesmoke);
    /* border-radius: var(--alfa-border-radius, 15px); */
}

.top-80px {
    top: 80px !important;
}

/* product: badges */
.abc-product-data .product-flags {
    align-items: center;
    position: unset;
    margin-top: initial;
    margin-bottom: var(--product-mb, 1rem);
    padding: unset;
}
/* badge appearance (pill, outline, on-sale/new color+icon) comes from the
   shared body .badge rules in _partials/badges.css - no product-page-only
   override, so it matches the listing badges everywhere else */

/* Produkt bez zadnej etykiety: pusta lista zostawiala nad tytulem swoj
   margin-bottom, czyli dziure bez zawartosci.

   Na listingach ta rezerwacja jest celowa - karty stoja obok siebie i tytuly
   maja sie wyrownac niezaleznie od tego, ktora karta ma plakietke. Na stronie
   produktu nie ma z czym wyrownywac, wiec odstep nie ma czego trzymac.

   `display: none` zamiast usuniecia `<ul>` z szablonu: rdzen po zmianie
   kombinacji podmienia zawartosc `.js-product-flags` (selektor `flags`
   w `bottom-*.js`), wiec element musi zostac w DOM. Gdy kombinacja przyniesie
   plakietke, `:empty` przestaje pasowac i lista wraca sama. */
.abc-product-data .product-flags:empty {
    display: none;
}

/* product: title */
.product .abc-product-data .product__name {
    margin-top: inherit;
    margin-bottom: var(--product-mb, 1rem);
}

/* product: reference */
.abc-product-data .product_reference {
    margin-bottom: var(--product-mb, 1rem);
    /* padding: 2px 10px; */
    /*F*/
    font-size: 12px;
    font-size: 16px;
    font-size: 1rem;
    /*F*/
    /* border: 1px solid var(--alfa-black, black); */
    /* border-radius: var(--alfa-border-radius, 15px); */
    background-color: transparent;
    color: var(--alfa-black, black);
    width: fit-content;
}

/* separator */
.abc-product-data .separator {
    color: var(--alfa-grey, whitesmoke);
    opacity: 1;
}

/* product: prices */
.abc-product-data .product__prices {
    margin-bottom: var(--product-mb, 1rem);
}

#product .abc-product-data .product__current-price {
    font-size: 2rem;
    color: var(--alfa-gold, hsl(41, 42%, 50%));
}

.abc-product-data .product__discount .product__price-regular {
    font-size: 1.25rem;
    color: grey;
}

/* Customer-group struck-through "regular" price. Uses its own class so
   dynamicproduct does not overwrite it; replicates the look of the standard
   regular price (the line-through normally comes from the parent theme's
   .page-product .product__price-regular rule, which this class does not match). */
.abc-product-data .product__discount .product__price-regular-group {
    font-size: 1.25rem;
    color: grey;
    text-decoration: line-through;
    white-space: nowrap;
    min-width: 16ch;
}

.abc-product-data .product__discount-percentage {
    display: none;
}

/* Customer-group cooperation info shown under the prices (discounted groups only). */
.abc-product-data .product__group-info {
    margin-top: 0.25rem;
    margin-bottom: var(--product-mb, 1rem);
}
.abc-product-data .product__group-cooperation {
    font-weight: 500;
    color: var(--alfa-gold, hsl(41, 42%, 50%));
}

.abc-product-data .gm_omniprice,
.abc-product-data .gm_omniprice_lowest {
    margin: unset;
    padding: unset;
    color: inherit !important;
    background-color: unset !important;
    font-size: 0.85rem;
}

.abc-product-data .product__prices .prices__wrapper > .row, 
.product__sticky-cart-wrapper .product__sticky-info > .row 
{
    align-items: center;
}

/* product: images */
#product .product__images .carousel {
    border-radius: unset;
}

#product .thumbnails__container .thumbnail img {
    border-radius: unset;
    border: 2px solid var(--alfa-grey, lightgrey);
}

#product .thumbnails__container .thumbnail.active img {
    border: 2px solid var(--alfa-gold, hsl(41, 42%, 50%));
}

#product .thumbnails__swiper {
    position: relative;
    padding: 0 28px;
}

#product .thumbnails__swiper .thumbnails__list {
    list-style: none;
    margin: 0;
    padding: 0;
}

#product .thumbnails__swiper .thumbnail {
    cursor: pointer;
    height: auto;
}

#product .thumbnails__swiper:not(.swiper-initialized) .thumbnail img {
    max-width: calc(100% / 6 * 0.94);
}

#product .thumbnails__swiper .thumbnail img {
    width: 100%;
    height: auto;
    display: block;
}

#product .thumbnails__swiper .swiper-button-prev,
#product .thumbnails__swiper .swiper-button-next {
    width: 24px;
    height: 100%;
    margin: 0;
    top: 0;
    background: transparent;
    border: 0;
    color: var(--alfa-black, #000);
    --swiper-navigation-size: 18px;
    display: none;
}

#product .thumbnails__swiper .swiper-button-prev { left: 0; }
#product .thumbnails__swiper .swiper-button-next { right: 0; }

#product .thumbnails__swiper .swiper-button-disabled {
    opacity: 0.25;
    pointer-events: none;
}

@media screen and (min-width: 1025px) {

    #product .carousel .carousel-control-prev,
    #product .carousel .carousel-control-next {
        transition: 0.5s;
    }

    #product .carousel:not(:hover) .carousel-control-prev,
    #product .carousel:not(:hover) .carousel-control-next {
        transition: 0.5s;
        opacity: 0;
        pointer-events: none;
    }
}

#product .product-actions__quantity {
    display: none;
    pointer-events: none;
}


#product .btn {
    --bs-btn-padding-x: 2em;
    --bs-btn-padding-y: 1em;
    --bs-btn-font-size: 1.25rem;
    --bs-btn-font-weight: 500;
    --bs-btn-border-radius: 0px;

    text-transform: uppercase;
}

.product__sticky-cart-wrapper {
    background: white;
    padding: 0.5rem 0;
    box-shadow: 0 0 10px -8px black;
    z-index: 100;
}

#product .product__sticky-cart {
    display: flex;
    justify-content: start;
    align-items: center;
    gap: 1rem;
    padding-left: 0;
    padding-right: 0;
}

.product__sticky-cart img {
    max-width: 50px;
}

.product__sticky-info {
    display: flex;
    flex-direction: column;
}
.product__sticky-cart .product__sticky-info .product__name {
    margin-bottom: 0.5rem;
}
.product__sticky-info .product__current-price {
    color: var(--alfa-gold);
}

.product__sticky-cart button {
    margin-left: auto;
    margin-right: 0;
}
#product .product__sticky-cart .abc-add-to-cart {
    --bs-btn-padding-x: 1em;
    --bs-btn-padding-y: 0.5em;
}

.product__sticky-cart .delivery_free {
    display: none !important;
}


/* product: reassurence */
.product_reassurance {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 2rem;
    border: 1px solid var(--alfa-grey, whitesmoke);
}

.product_reassurance .product_reassurance__item,
.page-product .product_reassurance__item, 
.page-product .abcweb-pdm-widget .pdm-shipping-time > div
{
    display: flex;
    align-items: center;
    gap: 1rem;
}

.product_reassurance .product_reassurance__icon, 
.page-product .product_reassurance__icon,
.page-product .abcweb-pdm-widget .material-symbols-outlined
{
    font-size: 2rem;
    color: var(--alfa-gold, hsl(41, 42%, 50%));
}
.product_reassurance .alfaram.product_reassurance__icon {
    width: 2rem;
    height: 2rem;
    background: url('/themes/abcweb/assets/img/icons/logo.svg') no-repeat;
    background-size: 85%;
    background-position: center;
    /* -webkit-mask-image: url('/themes/abcweb/assets/img/icons/logo.svg');
    -webkit-mask-size: 1em 1em;
    -webkit-mask-repeat: no-repeat;
    mask-image: url('/themes/abcweb/assets/img/icons/logo.svg');
    mask-size: 1em 1em;
    mask-repeat: no-repeat;
    background: var(--alfa-gold); */
}
.product_reassurance .product_reassurance__item__title {
    color: var(--alfa-black, black);
}

.page-product .delivery_free i {
    color: var(--alfa-extra, darkseagreen);
}

/* galeria */
/* .product__images {
    display: grid;
    grid-template-columns: auto 1fr;
    column-gap: 1rem;
}
.product__images .thumbnails__list {
    flex-flow: column;
    overflow-y: auto;
    margin: 0;
}
.product__images .thumbnails__container {
    margin-top: 0;
    order: -1;
}
.product__images .thumbnails__list .thumbnail {
    margin-top: 0;
}
.product__images .thumbnail img {
    min-width: 100px;
    max-width: 100px;
}
@media (min-width: 1401px) {
    .product__images .thumbnails__list {
        max-height: 530px;
    }
}
@media (max-width: 1400px) {
    .product__images .thumbnails__list {
        max-height: 524px;
    }
}
@media (max-width: 1200px) {
    .product__images .thumbnails__list {
        max-height: 339px;
    }
}
@media (max-width: 992px) {
    .product__images .thumbnails__list {
        max-height: 579px;
    }
}
@media (max-width: 768px) {
    .product__images .thumbnails__list {
        max-height: 393px;
    }
}
@media (max-width: 576px) {
    .product__images {
        display: unset;
    }
    .product__images .thumbnails__list {
        max-height: unset;
        flex-flow: unset;
        margin-top: 1rem;
    }
    .product__images .thumbnail img {
        min-width: unset;
    }
} */
#product.page-product .product__images__modal-opener {
    all: unset;
}

/* product: add to cart */
#product.page-product .product__add-to-cart {
    margin-bottom: 0;
}
.page-product .product__minimal-quantity {
    margin-bottom: 0;
}
.page-product .product__add-to-cart button, 
.product__sticky-cart .abc-add-to-cart
{
    background: var(--alfa-extra, darkseagreen);
    border-color: var(--alfa-extra, darkseagreen);
}
.page-product .product__add-to-cart button:hover, 
.product__sticky-cart .abc-add-to-cart:hover, 
.product__sticky-cart .abc-add-to-cart:active 
{
    background: color-mix(in oklab,
        var(--alfa-extra, darkseagreen) 70%,
        white 30%
    );
    border-color: color-mix(in oklab,
        var(--alfa-extra, darkseagreen) 70%,
        white 30%
    );
}
.product__sticky-cart .abc-add-to-cart .text {
    font-size: 1.1rem;
    margin-right: 0.5rem;
}

.made-on-order, 
.payments 
{
    background: hsl(36, 38%, 95%);
    margin-top: 1rem;
    padding: 1em 1em;
    font-weight: 600;
}


.extra-info {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.product__description.abc-prod-desc {
    background-color: #f0f0f0;
    padding: 2rem 2rem;
    border-radius: 35px;
}


/* GPSR */
.abcweb.gpsr {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
}
@media screen and (max-width: 991.98px) {
    .abcweb.gpsr {
        grid-template-columns: repeat(1, 1fr);
    }
}


/* customization */
.product-customization {}
.product-customization .card {}
.product-customization .card .card-body {}
.product-customization .card .card-body .card-title {}
.product-customization .card .card-body .product-customization__item.card {}
#product .product-customization .card .card-body .btn.btn-primary {
    --bs-btn-padding-x: unset;
    --bs-btn-padding-y: unset;
    --bs-btn-font-size: unset;
    --bs-btn-font-weight: unset;
    --bs-btn-border-radius: unset;
    text-transform: none;
}

.product .abc-product-data:has(.widget_product_star) .product__prices {
    margin-top: var(--product-mb, 1rem);
}
@supports not selector(:has(*)) {
    .product .abc-product-data .widget_product_star + .product__prices {
        margin-top: var(--product-mb, 1rem);
    }
}


/* RESPONSIVE */

/* XXL larger desktops >= 1400 */
@media screen and (min-width: 1400px) { /* 1400 - inf */
}
/* XL large desktops >= 1200 */
@media screen and (max-width: 1399.98px) { /* 1201 - 1400 */
}
/* LG desktops >= 992 */
@media screen and (max-width: 1199.98px) { /* 993 - 1200 */
    #product .product__sticky-cart {
        padding-left: 1rem;
        padding-right: 1rem;
    }
}
/* MD tablets >= 768 */
@media screen and (max-width: 991.98px) { /* 769 - 992 */
    .product__sticky-cart .abc-add-to-cart .text {
        display: none;
    }
}
/* SM phones >= 576 */
@media screen and (max-width: 767.98px) { /* 577 - 768 */
}
/* XS small phones < 576 */
@media screen and (max-width: 575.98px) { /* 0 - 576 */
    .extra-info {
        grid-template-columns: 1fr;
    }
    @supports (gap: 1rem) {
        .abc-product-data .product__prices .prices__wrapper > .row {
            gap: 1rem;
        }
    }
    @supports not (gap: 1rem) {
        .abc-product-data .product__prices .prices__wrapper > .row > * {
            margin-bottom: 1rem;
        }
    }
}

/* Price and free delivery share one line, the struck-through price takes its
   own line under the price. When the delivery does not fit next to the price,
   the row wraps it to the next line instead of overflowing. Scoped to
   .abc-product-data, so the sticky cart clone of this row keeps its layout. */
.abc-product-data .product__prices .prices__wrapper > .prices__main {
    justify-content: space-between;
    row-gap: 0;
}

.abc-product-data .prices__main > .prices__main-discount {
    flex: 0 0 100%;
}

/* On the inner block, not the column - the column is also rendered empty
   for products without a discount. */
.abc-product-data .prices__main-discount .product__discount {
    margin-top: 0.4rem;
}

@media screen and (max-width: 575.98px) {
    /* Overrides the 1rem phone gap above - the bootstrap gutter already
       spaces the columns, and the compact delivery fits next to the price. */
    .abc-product-data .product__prices .prices__wrapper > .prices__main {
        gap: 0;
    }

    .abc-product-data .prices__main-delivery .product_reassurance__item {
        gap: 0.4rem;
    }

    .abc-product-data .prices__main-delivery .product_reassurance__icon {
        font-size: 1.5rem;
    }

    .abc-product-data .prices__main-delivery .product_reassurance__item__title {
        font-size: 0.9rem;
        line-height: 1.2;
    }
}

/* Very small phones: the delivery goes to the bottom, under the
   struck-through price. */
@media screen and (max-width: 359.98px) {
    .abc-product-data .prices__main > .prices__main-delivery {
        order: 1;
        flex-basis: 100%;
        margin-top: 0.25rem;
    }
}

/* =========================================================================
   Ocena produktu pod tytulem - hook displayAbcwebProductRating (abcweb_theme).
   Override pozycjonowania: kasuje odziedziczone lewe marginesy pluginu/hummingbird
   (.grade-stars margin-left:-.25rem, .star-content margin-left:5px, min-width:120px),
   wyrownuje gwiazdki flush do lewej (jak tytul/cena) i dodaje oddech od ceny.
   ========================================================================= */
.abc-product-rating {
    display: flex;
    flex-wrap: wrap; /* na waskich ekranach link moze zejsc pod gwiazdki */
    align-items: center;
    gap: 4px 8px;
    margin: 0.25rem 0 1.125rem; /* mniejszy odstep od tytulu, wiekszy od ceny */
}

.abc-product-rating .grade-stars {
    width: 92px;    /* 5 x 16px + 4 x 3px odstepu miedzy gwiazdkami */
    min-width: 0;   /* kasuje wymuszone 120px z modulu */
    height: 16px;
    margin: 0;      /* kasuje ujemny lewy margines z hummingbird */
    flex: 0 0 auto;
}

.abc-product-rating .grade-stars .star-content {
    margin: 0;      /* kasuje left:5px z modulu */
    top: 0;
}

.abc-product-rating .grade-stars .star-content > div:first-child {
    margin-left: 0; /* pierwsza gwiazdka rowno z lewa krawedzia */
}

/* rozmiar 16px samych gwiazdek (nadpisanie 20px z modulu i background-size
   z product-comments.css) jest w product-comments.css - sekcja recolor */

.abc-product-rating__avg {
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    color: var(--alfa-black, #000);
    font-variant-numeric: tabular-nums;
}

.abc-product-rating__dot {
    color: #cfcfcf;
    line-height: 1;
}

.abc-product-rating__link {
    color: var(--bs-gray-600, #6c757d);
    font-size: 13px;
    line-height: 1;
    text-decoration: none;
    border-bottom: 1px solid transparent;
    transition: color 0.15s ease, border-color 0.15s ease;
}

.abc-product-rating__link:hover {
    color: var(--alfa-gold, #b3924a);
    border-bottom-color: var(--alfa-gold, #b3924a);
}
/* product: availability - quiet line in place of the bootstrap alert box */
.product-availability__line {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin: 0;
    font-size: .8125rem;
    color: #4d4a43;
}

.product-availability__line svg {
    width: 15px;
    height: 15px;
    flex: none;
    fill: none;
    stroke: var(--alfa-gold, #b3924a);
    stroke-width: 1.6;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.product-availability__line--unavailable {
    color: #8a4b45;
}

.product-availability__line--unavailable svg {
    stroke: #a05248;
}

.product-availability__subline {
    margin: .25rem 0 0 1.4375rem;
    font-size: .75rem;
    color: #85806f;
}
