/*
Theme Name: JJCosmetics Theme
Theme URI: https://oceanwp.org/
Description: JJ Cosmetics Theme
Author: Adam
Author URI: https://oceanwp.org/
Template: oceanwp
Version: 1.0
*/

.woocommerce ul.products {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 20px;
    align-items: stretch;
    margin: 0;
    padding: 0;
    list-style: none;
}

@media (max-width: 1200px) {
    .woocommerce ul.products { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 900px) {
    .woocommerce ul.products { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 640px) {
    .woocommerce ul.products { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 420px) {
    .woocommerce ul.products { grid-template-columns: 1fr; }
}


.woocommerce ul.products li.product {
    width: auto !important;
    float: none !important;
    margin: 0 !important;
}


.woocommerce ul.products li.product .product-inner.clr {
    display: flex;
    flex-direction: column;
    height: 100%;
    background: #fff;
    border: 1px solid #eee;
    border-radius: 14px;
    overflow: hidden;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
    will-change: transform, box-shadow;
}
.woocommerce ul.products li.product .product-inner.clr:hover {
    transform: translateY(-4px);

    border-color: #eaeaea;
}


.woocommerce ul.products li.product .product-inner.clr > .woo-entry-image:first-child {
    display: none;
}


.woocommerce ul.products li.product .woo-entry-inner.clr {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 0;
    margin: 0;
    list-style: none;
    height: 100%;
}


.woocommerce ul.products li.product .woo-entry-inner.clr > li {
    margin: 0;
    padding: 0;
    list-style: none;
}


.woocommerce ul.products li.product .woo-entry-inner .image-wrap .woo-entry-image:before {
    display: none !important;
}


.woocommerce ul.products li.product .woo-entry-inner .image-wrap {
    position: relative;
}


.woocommerce ul.products li.product .woo-entry-inner .image-wrap a.woocommerce-LoopProduct-link {
    display: block;
    position: relative;
    aspect-ratio: 1 / 1;
    background: #f7f7f8;
    overflow: hidden;
    border-bottom: 0;
}


.woocommerce ul.products li.product .woo-entry-inner .image-wrap img.woo-entry-image-main {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1);
    transition: transform .35s ease;
}


.woocommerce ul.products li.product .product-inner.clr:hover
.woo-entry-inner .image-wrap img.woo-entry-image-main {
    transform: scale(1.06);
}


.woocommerce ul.products li.product .woo-entry-inner .image-wrap a.woocommerce-LoopProduct-link::after {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(transparent 60%, rgba(0,0,0,.05));
    opacity: 0;
    transition: opacity .25s ease;
}
.woocommerce ul.products li.product .product-inner.clr:hover
.woo-entry-inner .image-wrap a.woocommerce-LoopProduct-link::after {
    opacity: 1;
}


.woocommerce ul.products li.product .woo-entry-inner .title {
    padding: 0 14px;
    margin-top: 6px;
}
.woocommerce ul.products li.product .woo-entry-inner .title h2,
.woocommerce ul.products li.product .woo-entry-inner .title .product-title {
    font-size: 15px;
    line-height: 1.3;
    margin: 0 0 2px 0;
    font-weight: 600;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 2.6em;
    text-transform: uppercase;
}
.woocommerce ul.products li.product .woo-entry-inner .title a {
    color: #111;
    text-decoration: none;
    transition: color .2s ease;
}
.woocommerce ul.products li.product .woo-entry-inner .title a:hover {
    color: #e91e63;
}


.woocommerce ul.products li.product .woo-entry-inner .price-wrap {
    padding: 0 14px;
}
.woocommerce ul.products li.product .woo-entry-inner .price-wrap .price,
.woocommerce ul.products li.product .woo-entry-inner .price-wrap .woocommerce-Price-amount {
    font-weight: 600;
    font-size: 1.2em;
}

.woocommerce ul.products li.product .woo-entry-inner .btn-wrap {
    padding: 0 14px!important;
    margin-top: auto!important;
}


.woocommerce ul.products li.product .woo-entry-inner .btn-wrap .button.add_to_cart_button,
.woocommerce ul.products li.product .woo-entry-inner .btn-wrap .button.ajax_add_to_cart,
.woocommerce ul.products li.product .woo-entry-inner .btn-wrap .button {
    width: 100%;
    border: none;
    border-radius: 10px;
    padding: 12px 14px;
    background: #e91e63;
    color: #fff;
    font-weight: 700;
    font-size: 13px;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    text-align: center;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    transition: background .2s ease, box-shadow .2s ease, transform .1s ease;
}
.woocommerce ul.products li.product .woo-entry-inner .btn-wrap .button:hover {
    background: #d81b60;
}
.woocommerce ul.products li.product .woo-entry-inner .btn-wrap .button:active {
    transform: translateY(0);
}


.woocommerce ul.products li.product .woo-entry-inner .btn-wrap .button.add_to_cart_button::before,
.woocommerce ul.products li.product .woo-entry-inner .btn-wrap .button.ajax_add_to_cart::before,
.woocommerce ul.products li.product .woo-entry-inner .btn-wrap .button.product_type_simple::before {
    content: "";
    width: 16px;
    height: 16px;
    display: inline-block;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 16px 16px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 6h15l-1.5 9h-12zM6 6l-2-3H1'/%3E%3Ccircle cx='9' cy='21' r='1.5'/%3E%3Ccircle cx='18' cy='21' r='1.5'/%3E%3C/svg%3E");
    margin-right: 4px;
}


.woocommerce ul.products li.product .woo-entry-inner .btn-wrap .button.added {
    background: #16a34a;
}
.woocommerce ul.products li.product .woo-entry-inner .btn-wrap .button.added::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E");
}


.woocommerce .added_to_cart {
    display: inline-block;
    margin-left: 8px;
    padding: 8px 10px;
    border-radius: 10px;
    background: #f1f5f9;
    color: #111;
    font-weight: 600;
    transition: background .2s ease;
}
.woocommerce .added_to_cart:hover {
    background: #e2e8f0;
}


.woocommerce ul.products li.product .onsale {
    position: absolute;
    top: 10px;
    left: 10px;
    background: #ef4444;
    color: #fff;
    border-radius: 999px;
    padding: 4px 8px;
    font-size: 12px;
    line-height: 1;
    font-weight: 700;
    z-index: 2;
}


.woocommerce ul.products li.product .woo-entry-inner .category,
.woocommerce ul.products li.product .woo-entry-inner .rating {
    display: none;
}

#site-header.medium-header #site-navigation-wrap{
    background:none;
}

#site-header.medium-header .dgwt-wcas-search-wrapp {
    max-width: 100%!important;
}

#site-header.medium-header #medium-searchform input:focus {
    outline: 2px solid transparent;
    outline-offset: 2px;
}


#site-header.medium-header #medium-searchform input:focus {
     --tw-border-opacity: 1;
     border-color: rgb(236 72 153 / var(--tw-border-opacity, 1));
 }

 .dgwt-wcas-search-input:focus {
     border-color: #e91e63;
     box-shadow: 0 0 0 3px rgba(233, 30, 99, 0.1);
 }

#site-header.medium-header #medium-searchform input {
    border-radius: 25px;
}

.iworks-omnibus, .iworks-omnibus * {
    color: #9d9d9d !important;
    font-weight: 300;
    margin-top: 1em;
}

#mainPagePromo{
    background-image: linear-gradient(to bottom right, #fff7ed, #fef2f2);
    border-radius: 1em;
}
#news-products{
    border-radius: 1em;
}

#site-header #site-logo #site-logo-inner a img, #site-header.center-header #site-navigation-wrap .middle-site-logo a img {
    max-height: 60px!important;
}

#main #content-wrap.container{
    padding-top:0!important;
}

@media only screen and (max-width: 959px) {
   html #main #content-wrap.container {
       padding-top:0!important;
    }
}

a:focus {
    outline: none !important;
}

.single-category a:hover {
    background: none!important;
}

.elementor-heading-title {
}

.promotion-text,.promotion-text .elementor-heading-title {
    font-size: 3rem!important;
    font-weight: 700!important;
    text-align: center!important;
    margin-bottom: 1rem!important;
    background: linear-gradient(to right, #ec4899, #f43f5e, #ef4444)!important;
    -webkit-background-clip: text!important;
    background-clip: text!important;
    color: transparent!important;
}


#mega-menu-wrap-main_menu #mega-menu-main_menu > li.mega-menu-megamenu > ul.mega-sub-menu li.mega-menu-column-standard > a.mega-menu-link, #mega-menu-wrap-main_menu #mega-menu-main_menu > li.mega-menu-megamenu > ul.mega-sub-menu li.mega-menu-column > ul.mega-sub-menu > li.mega-menu-item > a.mega-menu-link {
    margin: 0 0 5px 0!important;
 
}

#mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-row.mega-company-menu .mega-menu-column .mega-menu-link {
margin:0!important;
}

#mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-row.mega-company-menu .mega-menu-column > ul.mega-sub-menu > li.mega-menu-item {
    padding: 5px!important;
}

#mega-menu-wrap-main_menu #mega-menu-main_menu > li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-item ul.mega-sub-menu li.mega-menu-item ul.mega-sub-menu {
    margin-left: 1.5em;
}

#mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-row.mega-simple-menu .mega-menu-column > ul.mega-sub-menu > li.mega-menu-item {
    padding: 5px!important;
}

html .mega-simple-menu.simple-menu > ul.mega-sub-menu > li.mega-menu-item{
padding: 5px!important;
}


