/*--------------------------------------------------------------
PUTUSHART — WOOCOMMERCE SHOP
Desktop Shop Archive
--------------------------------------------------------------*/


/*--------------------------------------------------------------
1. SHOP PAGE
--------------------------------------------------------------*/

body.woocommerce-shop .site-main,
body.tax-product_cat .site-main,
body.tax-product_tag .site-main {
	width: 92%;
	max-width: 1320px;
	margin: 0 auto;
	padding: 35px 0 70px;
}


/*--------------------------------------------------------------
2. BREADCRUMB
--------------------------------------------------------------*/

.woocommerce .woocommerce-breadcrumb {
	margin: 0 0 24px;
	color: #8a8a8a;
	font-size: 13px;
	font-weight: 400;
	line-height: 1.6;
}

.woocommerce .woocommerce-breadcrumb a {
	color: #666666;
	text-decoration: none;
	transition: color 0.3s ease;
}

.woocommerce .woocommerce-breadcrumb a:hover,
.woocommerce .woocommerce-breadcrumb a:focus-visible {
	color: #a9854f;
}


/*--------------------------------------------------------------
3. SHOP TITLE
--------------------------------------------------------------*/

.woocommerce-products-header {
	margin-bottom: 24px;
}

.woocommerce-products-header__title.page-title {
	margin: 0;
	color: #111111;
	font-size: 52px;
	font-weight: 600;
	line-height: 1.12;
	letter-spacing: -1.2px;
}


/*--------------------------------------------------------------
SHOP INTRODUCTION
--------------------------------------------------------------*/

.putushart-shop-intro {
	max-width: 720px;
	margin-top: 22px;
}

.putushart-shop-intro__eyebrow {
	display: block;
	margin-bottom: 12px;
	color: #a9854f;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 2.5px;
	text-transform: uppercase;
}

.putushart-shop-intro__description {
	margin: 0;
	color: #666666;
	font-size: 16px;
	line-height: 1.75;
}


/*--------------------------------------------------------------
4. PREMIUM CATEGORY FILTER
--------------------------------------------------------------*/

.putushart-category-filter {
	clear: both;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
	width: 100%;
	margin: 30px 0 26px;
	padding: 0;
}

.putushart-category-filter__item {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 10px 21px;
	border: 1px solid #dddddd;
	border-radius: 50px;
	background: #ffffff;
	color: #444444;
	font-size: 14px;
	font-weight: 500;
	line-height: 1.4;
	text-decoration: none;
	white-space: nowrap;
	transition:
		background-color 0.3s ease,
		border-color 0.3s ease,
		color 0.3s ease,
		transform 0.3s ease,
		box-shadow 0.3s ease;
}

.putushart-category-filter__item:hover,
.putushart-category-filter__item:focus-visible {
	border-color: #a9854f;
	color: #a9854f;
	transform: translateY(-1px);
}

.putushart-category-filter__item:focus-visible {
	outline: none;
	box-shadow: 0 0 0 3px rgba(169, 133, 79, 0.14);
}

.putushart-category-filter__item.is-active {
	border-color: #a9854f;
	background: #a9854f;
	color: #ffffff;
	font-weight: 600;
}

.putushart-category-filter__item.is-active:hover,
.putushart-category-filter__item.is-active:focus-visible {
	border-color: #a9854f;
	background: #a9854f;
	color: #ffffff;
}


/*--------------------------------------------------------------
5. SHOP TOOLBAR
--------------------------------------------------------------*/

.woocommerce .woocommerce-result-count {
	margin: 0 0 24px;
	color: #777777;
	font-size: 14px;
	line-height: 48px;
}

.woocommerce .woocommerce-ordering {
	margin: 0 0 24px;
}

.woocommerce .woocommerce-ordering select {
	min-width: 210px;
	height: 48px;
	padding: 0 42px 0 18px;
	border: 1px solid #dddddd;
	border-radius: 24px;
	background-color: #ffffff;
	color: #333333;
	font-family: inherit;
	font-size: 14px;
	cursor: pointer;
	outline: none;
	transition:
		border-color 0.3s ease,
		box-shadow 0.3s ease;
}

.woocommerce .woocommerce-ordering select:hover {
	border-color: #aaaaaa;
}

.woocommerce .woocommerce-ordering select:focus {
	border-color: #a9854f;
	box-shadow: 0 0 0 2px rgba(169, 133, 79, 0.12);
}


/*--------------------------------------------------------------
6. PRODUCT GRID
--------------------------------------------------------------*/

.woocommerce ul.products {
	clear: both;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 60px 32px;
	width: 100%;
	margin: 0;
	padding: 0;
}

.woocommerce ul.products::before,
.woocommerce ul.products::after {
	display: none;
}

.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
	float: none;
	width: auto;
	margin: 0;
	padding: 0;
}


/*--------------------------------------------------------------
7. PRODUCT CARD
--------------------------------------------------------------*/

.woocommerce ul.products li.product {
	position: relative;
	display: flex;
	flex-direction: column;
	min-width: 0;
}

/* Wishlist button */

.woocommerce ul.products li.product .putushart-wishlist-button {
	position: absolute;
	top: 18px;
	right: 18px;
	z-index: 5;

	display: flex;
	align-items: center;
	justify-content: center;

	width: 42px;
	height: 42px;

	padding: 0;
	border: 1px solid #e7e7e7;
	border-radius: 50%;

	background: #ffffff;

	color: #222222;

	font-size: 24px;
	line-height: 1;

	cursor: pointer;

	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);

	transition:
		transform 0.25s ease,
		color 0.25s ease,
		border-color 0.25s ease,
		background 0.25s ease;
}

.woocommerce ul.products li.product .putushart-wishlist-button:hover {
	transform: translateY(-2px);
	border-color: #a9854f;
	color: #a9854f;
}

.woocommerce ul.products li.product .putushart-wishlist-button.is-active {
    background:#ffffff;
    border-color:#eeeeee;
    color:#e91d3f;
}

/* Product Wishlist Heart */

.woocommerce ul.products li.product .putushart-wishlist-heart{
    display:flex;
    align-items:center;
    justify-content:center;
}

.woocommerce ul.products li.product .putushart-wishlist-heart svg{
    display:block;
    width:26px;
    height:26px;
}

.woocommerce ul.products li.product .putushart-wishlist-heart path{
    fill:#b8b8b8 !important;
    stroke:#b8b8b8 !important;
    stroke-width:1.8;
    stroke-linecap:round;
    stroke-linejoin:round;
    transition:fill .2s ease, stroke .2s ease;
}

/* Selected / Added to Wishlist */

.woocommerce ul.products li.product
.putushart-wishlist-button.is-active
.putushart-wishlist-heart path{
    fill:#e91d3f !important;
    stroke:#e91d3f !important;
}

.woocommerce ul.products li.product .putushart-wishlist-button.is-loading {
	pointer-events: none;
	opacity: 0.6;
}


/*--------------------------------------------------------------
8. PRODUCT IMAGE
--------------------------------------------------------------*/

.woocommerce ul.products li.product a.woocommerce-LoopProduct-link {
	display: block;
	color: inherit;
	text-decoration: none;
}

.woocommerce ul.products li.product a img {
	width: 100%;
	height: 430px;
	margin: 0 0 26px;
	padding: 22px;
	display: block;
	object-fit: contain;
	background: #f5f3ef;
	border-radius: 20px;
	transition:
		transform 0.45s ease,
		box-shadow 0.45s ease;
}

.woocommerce ul.products li.product:hover a img {
	transform: translateY(-4px);
	box-shadow: 0 16px 35px rgba(17, 17, 17, 0.08);
}


/*--------------------------------------------------------------
9. PRODUCT TITLE
--------------------------------------------------------------*/

.woocommerce ul.products li.product .woocommerce-loop-product__title {
	margin: 0;
	padding: 0;
	min-height: 56px;
	color: #171717;
	font-size: 20px;
	font-weight: 600;
	line-height: 1.4;
	transition: color 0.3s ease;
}

.woocommerce ul.products li.product a:hover .woocommerce-loop-product__title {
	color: #a9854f;
}


/*--------------------------------------------------------------
10. PRODUCT PRICE
--------------------------------------------------------------*/

.woocommerce ul.products li.product .price {
	margin: 8px 0 0;
	color: #a9854f;
	font-size: 17px;
	font-weight: 600;
	line-height: 1.4;
}

.woocommerce ul.products li.product .price del {
	margin-right: 7px;
	color: #999999;
	font-size: 14px;
	font-weight: 400;
	opacity: 1;
}

.woocommerce ul.products li.product .price ins {
	color: #a9854f;
	font-weight: 600;
	text-decoration: none;
}


/*--------------------------------------------------------------
11. ADD TO CART
--------------------------------------------------------------*/

.woocommerce ul.products li.product .button {
	align-self: flex-start;
	margin-top: 22px;
	padding: 14px 26px;
	border: 1px solid #111111;
	border-radius: 50px;
	background: #111111;
	color: #ffffff;
	font-family: inherit;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.4;
	text-decoration: none;
	transition:
		background 0.3s ease,
		color 0.3s ease,
		transform 0.3s ease;
}

.woocommerce ul.products li.product .button:hover,
.woocommerce ul.products li.product .button:focus-visible {
	background: #ffffff;
	color: #111111;
	transform: translateY(-2px);
}

/* Hide WooCommerce automatic "View cart" link */
.woocommerce ul.products li.product
.added_to_cart.wc-forward{
	display:none !important;
}

/* Success tick after AJAX add to cart */
.woocommerce ul.products li.product
.button.added::after{
	content:"✓";

	display:inline-block;

	margin-left:8px;

	font-size:16px;
	font-weight:700;
	line-height:1;

	color:currentColor;
}


/*--------------------------------------------------------------
12. SALE BADGE
--------------------------------------------------------------*/

.woocommerce span.onsale {
	top: 18px;
	left: 18px;
	z-index: 2;
	min-width: auto;
	margin: 0;
	padding: 8px 13px;
	border-radius: 30px;
	background: #111111;
	color: #ffffff;
	font-size: 11px;
	font-weight: 600;
	line-height: 1;
	letter-spacing: 1px;
	text-transform: uppercase;
}


/*--------------------------------------------------------------
13. EMPTY SHOP
--------------------------------------------------------------*/

.woocommerce-info {
	margin: 30px 0 0;
	padding: 22px 26px 22px 54px;
	border-top: 2px solid #a9854f;
	background: #f7f5f1;
	color: #555555;
	font-size: 15px;
	line-height: 1.7;
}

.woocommerce-info::before {
	top: 22px;
	color: #a9854f;
}


/*--------------------------------------------------------------
14. PAGINATION
--------------------------------------------------------------*/

.woocommerce nav.woocommerce-pagination {
	margin-top: 70px;
	text-align: center;
}

.woocommerce nav.woocommerce-pagination ul {
	display: inline-flex;
	gap: 8px;
	margin: 0;
	border: 0;
}

.woocommerce nav.woocommerce-pagination ul li {
	border: 0;
}

.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	padding: 0;
	border: 1px solid #dddddd;
	border-radius: 50%;
	background: #ffffff;
	color: #333333;
	font-size: 14px;
	transition:
		background 0.3s ease,
		color 0.3s ease,
		border-color 0.3s ease;
}

.woocommerce nav.woocommerce-pagination ul li span.current,
.woocommerce nav.woocommerce-pagination ul li a:hover {
	border-color: #111111;
	background: #111111;
	color: #ffffff;
}

/* ==========================================================
   PUTUSHART PRODUCT BADGES
   ========================================================== */

/* Base Badge */

.putushart-badge {

    position: absolute;
    top: 16px;
    left: 16px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-width: 92px;
    height: 34px;

    padding: 0 18px;

    border-radius: 999px;

    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;

    color: #ffffff;

    z-index: 5;

    box-shadow: 0 8px 20px rgba(0,0,0,.12);

    -webkit-user-select: none; /* Safari / iOS */
	user-select: none;

}

/* Sale */

.putushart-badge--sale {

    background: #22C55E;

}

/* Sold Out */

.putushart-badge--soldout {

    background: #2F2F2F;

}

/* =========================================================
   PUTUSHART — Sold Out / Read More Button
   Shop + Related Products
========================================================= */

.woocommerce ul.products li.product a.button.putushart-read-more-button,
.related.products ul.products li.product a.button.putushart-read-more-button{
	background:#8b8177 !important;
	color:#ffffff !important;
	border-color:#8b8177 !important;
}

.woocommerce ul.products li.product a.button.putushart-read-more-button:hover,
.related.products ul.products li.product a.button.putushart-read-more-button:hover{
	background:#756b62 !important;
	color:#ffffff !important;
	border-color:#756b62 !important;
}