/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */

:root {
    --plyr-color-main: var(--bs-primary);
}

#single-product .products-heading:after,
#filter-products .products-heading:after {
    background-color: var(--bs-primary);
    bottom: 0;
    content: '';
    height: 3px;
    left: 0;
    position: absolute;
    width: 200px;
}

#single-product .cycle-slideshow {
    height: 100%;
    max-height: 350px;
    z-index: 9;
}

#single-product .cycle-slideshow img {
    max-height: 100%;
    padding: 20px;
    left: 50% !important;
    top: 50% !important;
    transform: translateX(-50%) translateY(-50%);
    width: auto;
}

#single-product #single-product-pager a>img {
    max-height: 80%;
}

#filter-products .product-result img {
    max-height: 300px;
	width: auto;
}

#single-product .row-ingredients img {
    max-height: 200px;
}

#single-product #product-tabs [data-bs-toggle="collapse"] {
    background-color: var(--bs-light);
    border-color: var(--bs-secondary);
    color: var(--bs-secondary);
}

#single-product #product-tabs [data-bs-toggle="collapse"][aria-expanded="true"] {
    background-color: var(--bs-primary);
    border-color: var(--bs-primary);
    color: var(--bs-white);
}

#single-product div[id^="videoModal"] button[data-bs-dismiss="modal"] {
    right: -20px;
    top: -20px;
    z-index: 99;
}

#single-product .related-products img {
    max-height: 240px;
    width: auto;
}

#products-filter>a[data-bs-toggle="collapse"] {
    background-color: rgba(79, 139, 49, .15);
    padding-right: 40px;
}

#products-filter>a[data-bs-toggle="collapse"]:after {
    content: "\f107";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    position: absolute;
    right: 15px;
    top: 7px;
    transition: transform .5s;
}

#products-filter>a[data-bs-toggle="collapse"][aria-expanded="true"]:after {
    transform: rotate(180deg);
}

#filter-products .navigation.pagination {
    display: block;
}

#filter-products .navigation.pagination .nav-links {
    align-items: center;
    display: flex;
    justify-content: center;
}

#filter-products .search-pagination .page-numbers,
#filter-products .navigation.pagination .page-numbers {
    border: 2px solid var(--bs-white);
    color: var(--bs-secondary);
    margin: 0 5px;
    padding: 2px 0;
    text-align: center;
    text-decoration: none;
    width: 35px;
}

#filter-products .search-pagination .page-numbers.current,
#filter-products .navigation.pagination .page-numbers.current {
    border-color: var(--bs-primary);
    color: var(--bs-primary);
}

#filter-products .search-pagination .page-numbers.prev,
#filter-products .navigation.pagination .page-numbers.prev {
    width: auto;
}

#filter-products .search-pagination .page-numbers.next,
#filter-products .navigation.pagination .page-numbers.next {
    width: auto;
}