/* PER-PAGE BUNDLE (iter6): Product Detail Page (PIP)
   - traffic_webc: carrusel principal #product-main-carousel, thumbs #product-thumbnails-carousel, cards crossselling (itemInfo-compact)
   - inspirationsTags_webc: seccion related_inspirations (inspirationList, tags)
   Solo lo necesita el PIP; el resto de paginas siguen usando style-extras.css completo. */
.wc-carousel .card-header > a {
    font-size: 24px;
}

/* Traffic and Searcher: 
  web_src/Views/products/_default/parts/itemInfo_Template-compact.html.twig //   web_src/Views/products/_default/parts/itemInfo_Template-mini.html.twig
*/
.card-body .itemInfo-compact {
    margin-top: 0.25rem;
}
.card-body .itemInfo-compact .itemName-link:hover .itemTitle,
.card-body .itemInfo-compact .itemName-link.focus-visible .itemTitle {
    text-decoration: underline;
    color: #111111;
}
.card-body .itemInfo-compact a:hover, .card-body .itemInfo-compact a.focus-visible {
    color: #484848;
}
.card-body .product-title {
    margin-top: 0.25rem;
}
.card-body .product-title .itemLink.itemName-link {
    text-decoration: none;
}
.card-body .product-title .itemLink.itemName-link:hover .itemName, .card-body .product-title .itemLink.itemName-link.focus-visible .itemName {
    text-decoration: underline;
    color: #111111;
}
.card-body .product-title .itemLink.itemName-link:hover .itemOldPrice, .card-body .product-title .itemLink.itemName-link.focus-visible .itemOldPrice {
    color: #484848;
}
.card-body .product-title .itemLink.itemName-link.focus-visible {
    box-shadow: none !important;
    outline: none !important;
    outline-offset: 0 !important;
    transition: none !important;
}
.card-body .product-title:has(.itemLink.itemName-link.focus-visible) {
    outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-7, 17, 17, 17))) !important;
    outline-offset: 2px !important;
    transition: outline 200ms ease-out, box-shadow 200ms ease-out !important;
}

/* web_src/Views/products/_default/parts/itemInfo_Template-compact.html.twig */
.second-slider.swiper-container .itemName:hover .itemTitle, .second-slider.swiper-container .itemName.focus-visible .itemTitle {
    text-decoration: underline;
    color: #111111;
}
.second-slider.swiper-container .itemName:hover .itemTitle .icon, .second-slider.swiper-container .itemName.focus-visible .itemTitle .icon {
    text-decoration: none;
}
.second-slider.swiper-container .itemName:hover .itemOldPrice, .second-slider.swiper-container .itemName.focus-visible .itemOldPrice {
    color: #484848;
}

/*PAGE RANGE NAVIGATION*/
/*Views/products/_default/parts/page_range_navigation.html.twig*/
#collections > div.swiper-container, #collections > div.swiper-container > div.swiper {
    overflow: visible;
}

/*TRAFFIC BLOCK*/
/*web_src/Views/index/conjurer/trafficBlock.html.twig*/
.traffic .wc-tabs .productList.trafficList_js.trafficList-not-vendor.swiper-container .swiper {
    overflow: visible;
}

.panel.sk-active-panel.focus-visible:focus {
    outline: block;
}

/*Presentation tabs*/
/*web_src/Views/products/_default/parts/page_range_navigation.html.twig*/
#presentationTabs .swiper-container.full-width-xs, #presentationTabs .swiper-container.full-width-xs .swiper {
    overflow: visible;
}

#product-main-carousel.wc-carousel {
    --skapa-carousel-overflow-start: 0;
    --skapa-carousel-overflow-end: 0;
}
#product-main-carousel.wc-carousel .swiper-slide {
    flex-shrink: 0;
    max-width: 100%;
    width: 100%;
    height: 100%;
    max-height: 500px;
    position: relative;
}
@media (max-width: 575.98px) {
    #product-main-carousel.wc-carousel.page-edge {
        --skapa-carousel-overflow-start: 20px;
        --skapa-carousel-overflow-end: 20px;
        --carousel-container-vertical-padding: 0;
    }
    #product-main-carousel.wc-carousel.page-edge .swiper-slide {
        max-width: calc(100% - (var(--skapa-carousel-overflow-start) + var(--skapa-carousel-overflow-end)));
    }
}

#product-thumbnails-carousel {
    --skapa-carousel-item-gap: 5px;
}
#product-thumbnails-carousel .active .borderContainer {
    border: 1px solid #111111;
    width: 100%;
}
@media (min-width: 576px) {
    #product-thumbnails-carousel::exportparts(control-button) {
        display: block;
    }
    #product-thumbnails-carousel::part(control-button) {
        display: block;
    }
    #product-thumbnails-carousel::part(container) {
        padding-left: var(--carousel-container-vertical-padding);
        padding-right: var(--carousel-container-vertical-padding);
    }
}

.template_detail .productList .swiper .slick-list.draggable:has(.card.slick-slide.focus-visible) {
    box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-neutral-1, 255, 255, 255))) !important;
    outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-7, 17, 17, 17))) !important;
    outline-offset: 2px !important;
    transition: outline 200ms ease-out, box-shadow 200ms ease-out !important;
}
.template_detail .productList .swiper .swiper_link.focus-visible {
    box-shadow: none !important;
    outline: 0 !important;
}
.template_detail .productList .swiper .swiper_link.focus-visible .texto-encima {
    box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-neutral-1, 255, 255, 255))) !important;
    outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-7, 17, 17, 17))) !important;
    outline-offset: 2px !important;
    transition: outline 200ms ease-out, box-shadow 200ms ease-out !important;
}

.inspirations-container .inspirationList:has(.wc-pill),
.presentationContainer .inspirationList:has(.wc-pill) {
    overflow: visible;
}
.inspirations-container #inspirationContainer .tags-container,
.presentationContainer #inspirationContainer .tags-container {
    -moz-column-gap: 0.5rem;
         column-gap: 0.5rem;
    margin-top: 1rem;
    font-size: 12px;
}

#tagContainer.tag_wrapper:has(.wc-pill) {
    overflow: visible;
}
#tagContainer.tag_wrapper:has(.wc-pill) .btn-ellipsis--inspiration {
    display: block;
    min-width: -moz-fit-content;
    min-width: -webkit-fit-content;
    min-width: fit-content;
}

.tagContainer {
    box-sizing: border-box;
    width: auto;
    flex-wrap: nowrap;
    align-items: center;
}
.tagContainer.wrap, .tagContainer.wrapFirstSelected {
    flex-wrap: wrap !important;
    width: 100%;
}
.tagContainer sk-pill {
    flex-shrink: 0;
}
.tagContainer sk-pill > span {
    font-weight: 400;
}
.tagContainer sk-pill > span.counter {
    margin-left: 0.5rem;
    padding-left: 0.5rem;
    border-left: 1px solid rgba(17, 17, 27, 0.5);
    line-height: 1.3;
}
.tagContainer .btn-outline-dark.active span.counter, .tagContainer .btn-outline-dark:hover span.counter {
    border-color: #fff;
}
