/* Editorial badges are siblings of product/lightbox links, never nested links. */
.editorial-pictograms {
    position: absolute;
    right: 5px;
    bottom: 10px;
    z-index: 3;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 5px;
    width: 112px;
    pointer-events: none;
}
.editorial-pictograms .editorial-pictogram {
    display: block;
    width: 100%;
    height: auto;
    line-height: normal;
    pointer-events: auto;
}
.editorial-pictograms .editorial-pictogram img {
    display: block;
    width: auto;
    max-width: 100%;
    height: auto;
    max-height: none;
}
.editorial-pictograms .editorial-pictogram:focus {
    outline: 2px solid #b4008d;
    outline-offset: 3px;
}
.products_wrapper .products__blocks .single_product .product_img .editorial-pictograms {
    width: 80px;
}
.products_wrapper .products__blocks .single_product .product_img .editorial-pictogram {
    width: 100%;
    height: auto;
    line-height: normal;
}
.products_wrapper .products__blocks .single_product .product_img .editorial-pictogram img {
    display: block;
    width: auto;
    max-width: 100%;
    max-height: none;
    height: auto;
}
/* Let multiple full-size badges contribute their intrinsic height. A single
   badge keeps the original absolute position and the original media height. */
.products_wrapper .products__blocks .single_product .product_img.editorial-pictogram-media--multiple {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr);
    height: auto;
    min-height: 290px;
}
.products_wrapper .products__blocks .single_product .product_img.editorial-pictogram-media--multiple > a,
.products_wrapper .products__blocks .single_product .product_img.editorial-pictogram-media--multiple > .lazyload {
    grid-area: 1 / 1;
    min-width: 0;
    min-height: 0;
    align-self: center;
    line-height: normal;
}
.products_wrapper .products__blocks .single_product .product_img.editorial-pictogram-media--multiple > a,
.products_wrapper .products__blocks .single_product .product_img.editorial-pictogram-media--multiple > .lazyload > a {
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: normal;
}
.products_wrapper .products__blocks .single_product .product_img.editorial-pictogram-media--multiple > a img {
    max-height: 290px;
}
#product__single .image_wrapper.editorial-pictogram-media--multiple {
    max-height: none;
}
#product__single .big_image.editorial-pictogram-media--multiple {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto minmax(0, 1fr);
}
#product__single .big_image.editorial-pictogram-media--multiple > a,
#product__single .big_image.editorial-pictogram-media--multiple > img {
    grid-area: 1 / 1 / 3 / 2;
    min-width: 0;
    align-self: center;
    justify-self: center;
}
.editorial-pictogram-media--multiple > .editorial-pictograms {
    grid-area: 1 / 1;
    position: relative;
    right: auto;
    bottom: auto;
    align-self: end;
    justify-self: end;
    margin: 10px 5px 10px 0;
}
#product__single .big_image.editorial-pictogram-media--multiple > .editorial-pictograms {
    grid-area: 2 / 1;
}
#product__single .big_image.editorial-pictogram-media--multiple > .hitra-odprema {
    position: static;
    grid-area: 1 / 1;
    align-self: start;
    justify-self: end;
    margin-bottom: 5px;
}
/* The badge stack may need more room, but must never enlarge the product.
   The original desktop gallery caps the media at 400px. Grid removed the
   percentage-height containing block, so keep that cap explicit on the image. */
@media (min-width: 993px) {
    #product__single .big_image.editorial-pictogram-media--multiple > img,
    #product__single .big_image.editorial-pictogram-media--multiple > a > img {
        max-height: 400px;
        width: auto;
        height: auto;
        object-fit: contain;
    }
}
.editorial-active-filters {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 16px;
    margin: 12px 0;
    font-size: 14px;
}
.editorial-active-filters a { text-decoration: underline; }
.editorial-active-filters a:focus { outline: 2px solid #b4008d; outline-offset: 3px; }
@media (max-width: 576px) {
    .products_wrapper .products__blocks .single_product .product_img.editorial-pictogram-media--multiple { min-height: 210px; }
    .products_wrapper .products__blocks .single_product .product_img.editorial-pictogram-media--multiple > a img { max-height: 210px; }
}
