/* ========================================
   Product Badges
======================================== */

.product-badges{
    position:absolute;
    top:10px;
    right:10px;
    z-index:3;

    display:flex;
    flex-wrap:wrap;
    gap:6px;
    max-width:80%;
}

.product-badge{
    display:flex;
    align-items:center;
    justify-content:center;

    padding:4px 8px;
    border-radius:6px;

    font:.7rem "Yekan-Regular";
    color:#fff;
    white-space:nowrap;
}

.badge-sale{background:#FEB21A}
.badge-free{background:#9FC87E}
.badge-best-seller{background:#F05454}
.badge-low-stock{background:#8b5cf6}
.badge-out-of-stock{background:#374151}



/* ========================================
   WooCommerce Layout
======================================== */

.woocommerce-products-header{display:none}

ul.products{
    display:grid !important;
    grid-template-columns:repeat(auto-fill,minmax(240px,1fr));
    gap:20px !important;

    margin:0 !important;
    padding:0 !important;

    list-style:none;
}

.woocommerce ul.products::before,
.woocommerce ul.products::after{display:none !important}

ul.products li.product{
    display:flex;
    flex-direction:column;

    width:100% !important;
    margin:0 !important;
    padding:0 !important;

    float:none !important;
    box-sizing:border-box;
}



/* ========================================
   Product Card
======================================== */

.product-card-inner{
    display:flex;
    flex-direction:column;

    height:100%;
    padding:10px;

    background:#fff;
    border:2px dashed #9e9e9e;
    border-radius:12px;

    overflow:hidden;
    transition:.25s ease;
}

.product-card-inner:hover{
    border-color:#e3e3e3;
    box-shadow:0 10px 30px rgba(0,0,0,.05);
}

.product-card-image{
    position:relative;
    overflow:hidden;
    border-radius:14px;
}

.products a img{
    margin-bottom:0 !important;
    border-radius:12px;
    box-shadow:0 0 3px #2c3e50 !important;
}



/* ========================================
   Product Content
======================================== */

.product-card-content{
    display:flex;
    flex-direction:column;
    flex:1;

    padding-top:14px;
}

.product-card-title{
    min-height:48px;
    line-height:1.7;
    color:#6b7280;
}

.products .product-card-title a{
    font-family:"Yekan-black";
    font-size:1.3rem;
    color:#000 !important;
    text-decoration:underline !important;
}

.product-card-excerpt,
.product-card-description{
    font:1rem "Yekan-Regular";
}

.product-card-description{flex:1}

.product-card-actions{margin-top:auto}



/* ========================================
   Product Price
======================================== */

.product-card-price{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:6px;

    width:100%;
    min-height:32px;

    margin:12px 0 16px;
    font-family:"Yekan-Regular";
}

.product-card-price ins,
.product-card-price > span{
    font-size:.9rem;
    font-weight:800;
    color:#111827;
}

.product-card-price ins{text-decoration:none}

.product-card-price del{
    font-size:.82rem;
    color:#9ca3af;
    text-decoration:line-through;
}

.product-card-price .woocommerce-Price-currencySymbol{font-size:.85em}



/* ========================================
   Product Buttons actions
======================================== */

.product-card-buttons{
    position:absolute;
    left:12px;
    bottom:12px;
    z-index:5;

    display:flex;
    gap:8px;
}

.product-btn{
    display:flex;
    align-items:center;
    justify-content:center;
	width:2.5rem;
	height:2.5rem;
    background:rgba(255,255,255,.95);
    border:1px solid var(--border);
    border-radius:10px;
    cursor:pointer;
    backdrop-filter:blur(10px);
    box-shadow:0 4px 14px rgba(0,0,0,.08);
    transition:.25s ease;
}

.product-btn svg{
    width:18px;
    height:18px;
    stroke:var(--text);
}

.product-btn:hover{
    transform:translateY(-2px);
    background:#fff;
    border-color:#d1d5db;
}



/* ========================================
   WooCommerce Buttons
======================================== */

.woocommerce ul.products li.product .mytheme-add-to-cart,.mytheme-product-details{

	display:flex !important;
	align-items:center;
	justify-content:center;
	gap:8px;
	width:100%;
	margin:0 !important;
	padding:12px !important;
	border:none;
	border-radius:10px;
	font-family:"Yekan-Regular";
	font-size:.9rem;
	font-weight:500;
	color:#fff !important;
	box-sizing:border-box;
	transition:.2s ease;
	cursor:pointer;
}

.woocommerce ul.products li.product .mytheme-add-to-cart:hover,.mytheme-product-details:hover{

	opacity:.92;
	transform:translateY(-1px);

}

.woocommerce ul.products li.product .mytheme-add-to-cart{

	background:#e63946 !important;

}
.mytheme-product-details{
  	background:#222;

}
.woocommerce ul.products li.product .mytheme-add-to-cart:disabled{

	background:#1e293b !important;
	cursor:not-allowed;
	opacity:.7;

}

.woocommerce ul.products li.product.outofstock .button{

	background:#30475E !important;
	cursor:not-allowed;

}



/* ========================================
   Responsive
======================================== */

@media (max-width:1024px){

    ul.products{
        grid-template-columns:repeat(2,1fr) !important;
        gap:10px !important;
    }

}

@media (max-width:768px){

    .products .product-card-title a{font-size:1rem}

}



/* ========================================
   Shop Categories
======================================== */

.shop-categories{
    margin:40px auto 20px;
    max-width:900px;

    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(100px,1fr));
    gap:12px;

    text-align:center;
    font-family:"Yekan-Regular";
}

.shop-subcategories{
        display:none;
    grid-auto-flow:column;
    grid-auto-columns:minmax(90px,1fr);
    gap:12px;
    margin-top:12px;
}

.shop-category.open .shop-subcategories{display:grid}

.shop-category-card,
.shop-subcategory{
    position:relative;
    overflow:hidden;
    border-radius:12px;
    cursor:pointer;

    transition:.25s ease;
}

.shop-category-card{height:140px}
.shop-subcategory{height:100px}

.shop-category-card img,
.shop-subcategory img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.shop-category-card .cat-content,
.shop-subcategory .subcategory-content{
    position:absolute;
    bottom:0;
    right:0;
    left:0;

    padding:12px;

    background:linear-gradient(
        to top,
        rgba(0,0,0,.85),
        rgba(0,0,0,.4),
        transparent
    );
}

.shop-category-card h3,
.shop-subcategory h4{
    margin:0;
    color:#fff;
    font-size:.8rem;
    font-weight:700;
}

.shop-category-card p,
.shop-subcategory p{
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;

    overflow:hidden;

    font-size:.7rem;
    color:#eee;
    margin-top:4px;
}



/* hover */

.shop-category-card:hover,
.shop-subcategory:hover{
    transform:translateY(-4px) scale(1.03);
    box-shadow:0 8px 18px rgba(0,0,0,.25);
}

.shop-category-card:hover img,
.shop-subcategory:hover img{
    filter:brightness(.85);
}

.shop-category.open .shop-category-card,
.shop-subcategory.active{
    transform:scale(1.04);
    box-shadow:0 10px 22px rgba(0,0,0,.35);
}

.shop-category.open .shop-category-card::after,
.shop-subcategory.active::after{
    content:"";
    position:absolute;
    bottom:0;
    left:0;
    right:0;

    height:3px;
    background:#ff6a00;
}



/* ========================================
   Shop Products Header
======================================== */

.shop-products-header{
    display:flex;
    align-items:center;
    gap:20px;
    margin:50px 0 35px;
}

.shop-products-title h2{
    margin:0;
    font:800 1.1rem "Yekan-black";
    color:#222;
}

.shop-products-line{
    flex:1;
    height:2px;
    background:#eee;
}

.shop-products-tools select{
    height:40px;
    padding:0 14px;

    border:1px solid #e5e5e5;
    border-radius:8px;

    background:#fff;

    font-size:.9rem;
    cursor:pointer;
}

.shop-products-tools select:hover{border-color:#ff6a00}



/* ========================================
   Custom Select
======================================== */

.custom-select{
    position:relative;
    width:200px;
    font-size:14px;
}

.custom-select select{display:none}

.select-selected{
    padding:10px 36px 10px 12px;

    border:1px solid #ddd;
    border-radius:6px;

    background:#fff;
    cursor:pointer;
    position:relative;

    font-family:"Yekan-Regular";
}

.select-selected::after{
    content:"";
    position:absolute;

    left:10px;
    top:50%;

    width:14px;
    height:14px;

    transform:translateY(-50%);
    background:url('/wp-content/themes/mytheme/assets/icon/expand_arrow.svg') no-repeat center;
    background-size:14px;

    transition:.2s;
}

.select-selected.active::after{
    transform:translateY(-50%) rotate(180deg);
}

.select-items{
    position:absolute;
    top:100%;
    left:0;
    right:0;

    margin-top:4px;

    background:#fff;

    border:1px solid #ddd;
    border-radius:6px;

    box-shadow:0 6px 14px rgba(0,0,0,.08);

    display:none;
    z-index:20;

    font-family:"Yekan-Regular";
}

.select-items div{
    padding:10px;
    cursor:pointer;
}

.select-items div:hover{background:#f5f5f5}
.select-items.open{display:block}



/* ========================================
   Checkbox
======================================== */

input[type="checkbox"]{
    appearance:none;

    width:18px;
    height:18px;

    border:1.5px solid #cbd5e1;
    border-radius:5px;

    background:#fff;

    cursor:pointer;
    position:relative;

    transition:.2s;
}

input[type="checkbox"]:hover{border-color:#94a3b8}

input[type="checkbox"]:checked{
    background:#2563eb;
    border-color:#2563eb;
}

input[type="checkbox"]:checked::after{
    content:"";
    position:absolute;

    left:5px;
    top:2px;

    width:5px;
    height:9px;

    border:solid #fff;
    border-width:0 2px 2px 0;

    transform:rotate(45deg);
}

input[type="checkbox"]:focus{
    outline:none;
    box-shadow:0 0 0 3px rgba(37,99,235,.15);
}

input[type="checkbox"]:disabled{
    background:#f1f5f9;
    border-color:#e2e8f0;
    cursor:not-allowed;
}

label{
    display:flex;
    align-items:center;
    gap:8px;

    font-size:1rem;
    color:#374151;

    cursor:pointer;
    font-family:"Yekan-Regular";
}













/* ========================================
   pagination style
======================================== */

.woocommerce-pagination{
margin:60px 0 20px;
display:flex;
	justify-content:center;
}


.woocommerce nav.woocommerce-pagination ul{
display:flex;
gap:5px;
border:none;
padding:0;
margin:0;
}


.woocommerce nav.woocommerce-pagination ul li{
border:none;
}


.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span{
display:flex;
	align-items:center;
	justify-content:center;
width:33px;
height:33px;
border-radius:12px;
border:1px solid #eee;
background:#fff;
color:#444;
font-size:.95rem;
transition:.25s;
}


.woocommerce nav.woocommerce-pagination ul li a:hover{
border-color:#ff6a00;
color:#ff6a00;
}


.woocommerce nav.woocommerce-pagination ul li span.current{
background:#F05454;
color:#fff;
border:none;
font-weight:700;
}


.woocommerce nav.woocommerce-pagination ul li a.prev,
.woocommerce nav.woocommerce-pagination ul li a.next{
width:auto;
padding:0 14px;
}





















/* ========================================
   all system alart
======================================== */
/* warinig */
.no-products{
	font-size:1rem;
	font-family: "Yekan-Regular";
	border-style:dashed;
	border-width:4px;
	border-color:#c02942;
	background-color:#f05454;
	padding: 12px 20px !important;
	border-radius:12px;
	color:#ecf0f1;
	width:100vh;
}
