/*
 Theme Name:   Astra Child
 Theme URI:    https://wpastra.com/
 Description:  Astra Child Theme for Masala2 - Warm Cream & Orange (v1.2.0)
 Author:       Antigravity
 Author URI:   https://wpastra.com/
 Template:     astra
 Version:      1.2.0
*/

/* =====================================================
   GLOBAL HEADER — Sticky Navigation Fix
   ElementsKit header template (ID 12724) must always
   stay at the top. This replaces the CSS that was
   previously generated by Elementor (post-12724.css)
   and ensures it survives Elementor cache clears.
   ===================================================== */
.ekit-template-content-markup.ekit-template-content-header {
	position: sticky;
	top: 0;
	z-index: 9999;
	width: 100%;
}
/* Offset for WordPress admin bar (desktop: 32px, mobile: 46px) */
.admin-bar .ekit-template-content-markup.ekit-template-content-header {
	top: 32px;
}
@media screen and (max-width: 782px) {
	.admin-bar .ekit-template-content-markup.ekit-template-content-header {
		top: 46px;
	}
}

/* ── ELEMENTOR HEADER OVERLAPS FIX ──
   Reset negative margins on top sections of Elementor pages.
   These negative margins were previously used for transparent headers
   but now cause page banners to overlap and hide the custom header's topbar. */
.elementor-69 .elementor-element.elementor-element-d0e2b6e,
.elementor-7880 .elementor-element.elementor-element-e7f5625,
.elementor-7889 .elementor-element.elementor-element-4fdfb98,
.elementor-7906 .elementor-element.elementor-element-85a8ef0 {
	margin-top: 0 !important;
}

:root {
	--rakesh-accent: #f5a623;
	--rakesh-cream: #fdf6e8;
	--rakesh-border: #f2f2f2;
	--rakesh-text: #333333;
}

body {
	font-family: 'DM Sans', sans-serif !important;
}

/* Hide Shop Title and Breadcrumbs */
.woocommerce-products-header__title, .woocommerce-breadcrumb, .ast-breadcrumbs {
	display: none !important;
}

/* Expand Site Container */
.ast-container {
	max-width: 96% !important;
	padding: 0 40px !important;
}

/* ==========================================================================
   SIDEBAR & LAYOUT
   ========================================================================== */

#secondary .sidebar-main > *:not(.shop-sidebar-custom) { display: none !important; }
.shop-sidebar-custom { padding: 0 !important; margin-left: 0 !important; }

@media (min-width: 922px) {
	.archive.woocommerce #secondary { 
		width: 280px !important; 
		flex: 0 0 280px !important; 
		border: none !important;
	}
	.archive.woocommerce #primary {
		border: none !important;
	}
}
#secondary, #primary {
	border: none !important;
}

/* ===================== RAKESH FILTER SIDEBAR ===================== */
.rms-filter, .rms-filter *{box-sizing:border-box;margin:0;padding:0}
.rms-filter{
  font-family:"Poppins","Segoe UI",Arial,sans-serif;
  width:280px;
  color:#1c1c1c;
}

/* ---- card ---- */
.rms-card{
  background:#fff;
  border:1px solid #e6e6e6;
  border-radius:22px;
  overflow:hidden;
}

/* ---- All Categories header ---- */
.rms-allcat{
  display:flex;align-items:center;justify-content:space-between;
  padding:18px 20px;
  border-bottom:1px solid #ededed;
  cursor:pointer;
}
.rms-allcat-left{
  display:flex;align-items:center;gap:11px;
  font-size:16px;font-weight:600;color:#1c1c1c;
}
.rms-grid-ico{width:18px;height:18px;fill:#3a3a3a}
.rms-chev{width:15px;height:15px;fill:none;stroke:#555;stroke-width:1.8;
  stroke-linecap:round;stroke-linejoin:round;transition:transform .25s}

/* ---- category list ---- */
.rms-catlist{list-style:none}
.rms-cat{
  display:flex;align-items:center;justify-content:space-between;
  padding:13px 20px;
  border-bottom:1px solid #ededed;
  cursor:pointer;
  transition:background .15s;
}
.rms-cat:hover{background:#fafafa}
.rms-cat-left{
  display:flex;align-items:center;gap:12px;
  font-size:14.5px;font-weight:400;color:#2b2b2b;
}
.rms-cat.is-active .rms-cat-left{font-weight:500;color:#111}
.rms-leaf{display:inline-flex;width:20px;height:20px;color:#8a8a8a}
.rms-leaf svg{width:100%;height:100%}
.rms-arrow{width:14px;height:14px;fill:none;stroke:#444;stroke-width:1.8;
  stroke-linecap:round;stroke-linejoin:round}

/* Category links - make <a> fill the <li> and inherit design */
.rms-cat a.rms-cat-link {
  display:flex;align-items:center;justify-content:space-between;
  width:100%;text-decoration:none;color:inherit;
}
.rms-cat.is-active a.rms-cat-link .rms-cat-left { font-weight:500; color:#111; }

/* ---- section ---- */
.rms-sec{border-bottom:1px solid #ededed}
.rms-sec-last{border-bottom:none}
.rms-sec-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:18px 20px;
  cursor:pointer;user-select:none;
  font-size:16px;font-weight:600;color:#1c1c1c;
}
.rms-sec-head.rms-open .rms-chev{transform:rotate(180deg)}
.rms-sec-body{
  padding:0 20px;
  max-height:0;overflow:hidden;
  transition:max-height .3s ease,padding .3s ease;
}
.rms-sec-body.rms-show{
  max-height:600px;
  padding:0 20px 20px;
}

/* ---- price range ---- */
.rms-range{
  position:relative;height:5px;
  background:#e3e3e3;border-radius:3px;
  margin:14px 8px 0;
}
.rms-range-fill{
  position:absolute;height:5px;
  background:#e2241a;border-radius:3px;
}
.rms-range input[type=range]{
  -webkit-appearance:none;appearance:none;
  position:absolute;top:0;left:0;
  width:100%;height:5px;
  background:transparent;
  pointer-events:none;
  margin:0;
}
.rms-range input[type=range]::-webkit-slider-thumb{
  -webkit-appearance:none;appearance:none;
  width:18px;height:18px;border-radius:50%;
  background:#fff;border:2px solid #e2241a;
  box-shadow:0 1px 3px rgba(0,0,0,.3);
  cursor:pointer;pointer-events:all;
}
.rms-range input[type=range]::-moz-range-thumb{
  width:18px;height:18px;border-radius:50%;
  background:#fff;border:2px solid #e2241a;
  box-shadow:0 1px 3px rgba(0,0,0,.3);
  cursor:pointer;pointer-events:all;
}
.rms-price-val{
  text-align:right;
  font-size:14px;font-weight:500;color:#e2241a;
  margin-top:14px;
}

/* ---- checkboxes ---- */
.rms-chk{
  display:flex;align-items:center;gap:12px;
  padding:8px 0 8px 6px;
  font-size:14.5px;color:#2b2b2b;
  cursor:pointer;
}
.rms-chk input[type=checkbox]{
  -webkit-appearance:none;appearance:none;
  width:16px;height:16px;flex-shrink:0;
  border:1.5px solid #9a9a9a;border-radius:3px;
  background:#fff;cursor:pointer;
  position:relative;
  transition:background .15s,border-color .15s;
}
.rms-chk input[type=checkbox]:checked{
  background:#e2241a;border-color:#e2241a;
}
.rms-chk input[type=checkbox]:checked::after{
  content:"";
  position:absolute;left:4.5px;top:1.5px;
  width:4px;height:8px;
  border:solid #fff;border-width:0 2px 2px 0;
  transform:rotate(45deg);
}

/* ---- responsive ---- */
@media(max-width:768px){
  .rms-filter{width:100%}
}

/* ==========================================================================
   PRODUCT GRID
   ========================================================================== */

.woocommerce[class*="columns-"] ul.products,
.woocommerce-page[class*="columns-"] ul.products {
	display: grid !important;
	grid-template-columns: repeat(4, 1fr) !important;
	gap: 32px 28px !important; /* Vertical 32px, Horizontal 28px */
	padding: 20px 0 !important;
}

@media (max-width: 1200px) { .woocommerce[class*="columns-"] ul.products { grid-template-columns: repeat(3, 1fr) !important; } }
@media (max-width: 768px) { .woocommerce[class*="columns-"] ul.products { grid-template-columns: repeat(2, 1fr) !important; } }

/* ==========================================================================
   PRODUCT CARD (WARM CREAM DESIGN)
   ========================================================================== */

.woocommerce ul.products li.product {
	background: #ffffff !important;
	border: 1px solid #e6e6e6 !important; 
	border-radius: 12px !important;
	padding: 15px !important;
	transition: all 250ms ease !important; 
	display: grid !important;
	grid-template-rows: 250px auto 1fr auto !important;
	grid-template-columns: 1fr auto !important;
	height: 100% !important;
	margin: 0 !important;
	position: relative;
	overflow: hidden;
	gap: 0 !important;
	box-shadow: 0 4px 20px rgba(0,0,0,0.02) !important;
}

/* Hover State */
.woocommerce ul.products li.product:hover {
	background: #fdf6e8 !important;
	border-color: #f5a623 !important; 
	box-shadow: 0 8px 24px rgba(0,0,0,0.06) !important; 
}

/* ── Structural Contents ─────────────────────────────────────────────────
   The actual WooCommerce DOM wraps img + stars + title + price all inside
   the <a> link tag.  Every wrapper must be display:contents so the <li>
   grid sees img/stars/title/price as direct children.
   ──────────────────────────────────────────────────────────────────────── */
.woocommerce ul.products li.product .woocommerce-LoopProduct-link,
.woocommerce ul.products li.product .woocommerce-loop-product__link,
.woocommerce ul.products li.product .astra-shop-summary-wrap,
.woocommerce ul.products li.product .astra-shop-thumbnail-wrap {
	display: contents !important;
}

/* ── Suppress rogue grid items ───────────────────────────────────────────
   Astra injects its own icon button + a screen-reader span; without hiding
   them they land in the grid and collapse the image/title rows.
   ──────────────────────────────────────────────────────────────────────── */
.woocommerce ul.products li.product .ast-on-card-button,
.woocommerce ul.products li.product .screen-reader-text {
	display: none !important;
}

/* Icon Stack (Hover Only) */
.rakesh-card-icons {
	position: absolute;
	top: 0;
	right: 0;
	display: flex;
	flex-direction: column;
	gap: 6px;
	opacity: 0;
	transition: opacity 250ms ease;
	z-index: 10;
}

.woocommerce ul.products li.product:hover .rakesh-card-icons {
	opacity: 1;
}

.rakesh-icon {
	font-size: 14px;
	color: #666;
	cursor: pointer;
	line-height: 1;
	background: #fff;
	border: 1px solid #eee;
	border-radius: 4px;
	width: 26px;
	height: 26px;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.2s ease;
}
.rakesh-icon:hover { color: #f5a623; border-color: #f5a623; }

/* 1. Image Area — fills the 250px row, centred, matches mockup .thumb behaviour */
.woocommerce ul.products li.product img {
	grid-column: 1 / span 2;
	grid-row: 1;
	max-height: 230px;
	max-width: 100%;
	width: auto;
	height: auto;
	object-fit: contain;
	align-self: center;
	justify-self: center;
	margin: 0 0 10px 0 !important;
	padding: 0;
}

/* 2. Star Rating (Directly below image) */
.rakesh-stars {
	grid-column: 1 / span 2;
	grid-row: 2;
	color: #f5a623;
	font-size: 14px;
	margin-bottom: 6px;
	letter-spacing: 1px;
}
.rakesh-stars .review-count {
	color: #999;
	font-size: 11px;
	letter-spacing: 0;
	margin-left: 4px;
}
.woocommerce ul.products li.product .star-rating {
	display: none !important;
}

/* 3. Product Title */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
	grid-column: 1 / span 2;
	grid-row: 3;
	font-size: 15px !important;
	font-weight: 600 !important;
	color: #e2241a !important; /* Red Title */
	margin: 0 0 10px 0 !important;
	line-height: 1.3 !important;
	align-self: start;
}

/* 4. Price (Bottom Left) */
.woocommerce ul.products li.product .price {
	grid-column: 1;
	grid-row: 4;
	font-size: 16px !important;
	font-weight: 700 !important;
	color: #f5a623 !important; /* Gold Price */
	margin: 0 !important;
	align-self: center;
}

/* 5. Add to Cart Button (Bottom Right) */
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .added_to_cart {
	grid-column: 2;
	grid-row: 4;
	font-size: 11px !important;
	padding: 8px 16px !important;
	border: 1px solid #ddd !important;
	background: #fff !important;
	color: #333 !important;
	border-radius: 5px !important;
	text-transform: none !important;
	font-weight: 500 !important;
	margin: 0 0 0 auto !important;
	align-self: center;
	transition: all 250ms ease !important;
	line-height: 1.2 !important;
}
.woocommerce ul.products li.product .button::before { content: "Add to cart"; font-size: 11px !important; }
.woocommerce ul.products li.product .button { font-size: 0 !important; }

/* Turns gold when the card is hovered */
.woocommerce ul.products li.product:hover .button,
.woocommerce ul.products li.product:hover .added_to_cart {
	background: #f5a623 !important;
	color: #fff !important;
	border-color: #f5a623 !important;
}

/* Fallback button hover */
.woocommerce ul.products li.product .button:hover {
	background: #e0941d !important;
	color: #fff !important;
	border-color: #e0941d !important;
}

/* REMOVALS */
.woocommerce ul.products li.product .ast-woo-product-category,
.woocommerce ul.products li.product .onsale,
.woocommerce ul.products li.product .ast-on-card-button,
.woocommerce ul.products li.product del,
.woocommerce ul.products li.product .woocommerce-LoopProduct-link::after {
	display: none !important;
}

/* Center Pagination */
.woocommerce-pagination {
	text-align: center !important;
	width: 100% !important;
	margin: 60px 0 !important;
	display: block !important;
	clear: both !important;
}

.woocommerce-pagination ul {
	display: inline-flex !important;
	border: none !important;
}

.woocommerce-pagination ul li {
	border: none !important;
	margin: 0 5px !important;
}

.woocommerce-pagination ul li a, 
.woocommerce-pagination ul li span {
	border: 1px solid #ddd !important;
	border-radius: 4px !important;
	padding: 10px 15px !important;
	color: #333 !important;
	background: #fff !important;
}

.woocommerce-pagination ul li span.current {
	background: var(--rakesh-accent) !important;
	color: #fff !important;
	border-color: var(--rakesh-accent) !important;
}

/* ==========================================================================
   VIEW AS TOGGLE & LIST VIEW
   ========================================================================== */

/* --- SHOP HEADER & TOOLBAR --- */
.rakesh-shop-title {
	font-size: 24px !important;
	font-weight: 800 !important;
	color: #111 !important;
	margin: 0 0 20px 0 !important;
	padding-bottom: 20px !important;
	border-bottom: 1px solid #eee !important;
	text-transform: capitalize !important;
}

.rakesh-toolbar-wrapper {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 25px;
	width: 100%;
}
.ast-woocommerce-container .rakesh-toolbar-wrapper {
    margin-top: 0;
}

/* Toggle Container */
.rakesh-view-toggle {
	display: inline-flex;
	align-items: center;
	gap: 10px;
}
.rakesh-view-toggle .view-label {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 1px;
	color: #111;
	margin-right: 8px;
}
.rakesh-view-toggle .view-btn {
	background: none;
	border: none;
	padding: 0;
	cursor: pointer;
	color: #999;
	display: flex;
	align-items: center;
	justify-content: center;
}
.rakesh-view-toggle .view-btn.active,
.rakesh-view-toggle .view-btn:hover {
	color: #111;
}

/* Hide List Elements in Grid View */
.rakesh-list-desc, .rakesh-view-details-btn {
	display: none !important;
}

/* --- LIST VIEW OVERRIDES --- */
.woocommerce[class*="columns-"] ul.products.list-view {
	grid-template-columns: 1fr !important;
	gap: 20px !important;
}

.woocommerce[class*="columns-"] ul.products.list-view li.product {
	grid-template-columns: 220px 1fr 180px !important;
	grid-template-rows: auto auto auto auto !important;
	gap: 5px 30px !important;
	align-items: center !important;
	padding: 25px 30px !important;
}

.woocommerce[class*="columns-"] ul.products.list-view li.product img {
	grid-column: 1 !important;
	grid-row: 1 / span 4 !important;
	max-height: 220px !important;
	width: auto !important;
	margin: 0 auto !important;
}

.woocommerce[class*="columns-"] ul.products.list-view li.product .woocommerce-loop-product__title {
	grid-column: 2 !important;
	grid-row: 1 !important;
	font-size: 18px !important;
	font-weight: 600 !important;
	color: #e2241a !important; /* Red title */
	margin-bottom: 5px !important;
	align-self: end !important;
	min-height: auto !important;
}

.woocommerce[class*="columns-"] ul.products.list-view li.product .rakesh-stars {
	grid-column: 2 !important;
	grid-row: 2 !important;
	margin-bottom: 10px !important;
	text-align: left !important;
}

.woocommerce[class*="columns-"] ul.products.list-view li.product .rakesh-list-desc {
	grid-column: 2 !important;
	grid-row: 3 !important;
	display: block !important;
	font-size: 13px !important;
	color: #666 !important;
	margin-bottom: 15px !important;
	line-height: 1.5 !important;
}

.woocommerce[class*="columns-"] ul.products.list-view li.product .rakesh-list-weight {
	display: inline-block !important;
	margin-top: 10px !important;
	padding: 4px 10px !important;
	border: 1px solid #ddd !important;
	border-radius: 4px !important;
	font-size: 11px !important;
	color: #333 !important;
	font-weight: 500 !important;
}

.woocommerce[class*="columns-"] ul.products.list-view li.product .price {
	grid-column: 2 !important;
	grid-row: 4 !important;
	font-size: 18px !important;
	color: #f5a623 !important; /* Gold price */
	align-self: start !important;
}

/* Button & View Details align right */
.woocommerce[class*="columns-"] ul.products.list-view li.product .button,
.woocommerce[class*="columns-"] ul.products.list-view li.product .added_to_cart {
	grid-column: 3 !important;
	grid-row: 2 !important;
	width: 100% !important;
	text-align: center !important;
	margin: 0 0 10px 0 !important;
	background: #f5a623 !important; /* Yellow */
	color: #fff !important;
	border-color: #f5a623 !important;
	font-size: 0 !important;
	padding: 10px 15px !important;
	border-radius: 30px !important;
}
.woocommerce[class*="columns-"] ul.products.list-view li.product .button::before,
.woocommerce[class*="columns-"] ul.products.list-view li.product .added_to_cart::before {
	font-size: 12px !important;
	text-transform: uppercase !important;
}
.woocommerce[class*="columns-"] ul.products.list-view li.product .button:hover {
	background: #e0941d !important;
	border-color: #e0941d !important;
}

.woocommerce[class*="columns-"] ul.products.list-view li.product .rakesh-view-details-btn {
	grid-column: 3 !important;
	grid-row: 3 !important;
	display: block !important;
	width: 100% !important;
	text-align: center !important;
	padding: 9px 15px !important;
	border: 1.5px solid #333 !important;
	border-radius: 30px !important;
	color: #333 !important;
	font-size: 12px !important;
	font-weight: 600 !important;
	text-decoration: none !important;
	text-transform: uppercase !important;
	transition: all 0.2s ease !important;
}
.woocommerce[class*="columns-"] ul.products.list-view li.product .rakesh-view-details-btn:hover {
	background: #333 !important;
	color: #fff !important;
}

/* Float Icons adjust */
.woocommerce[class*="columns-"] ul.products.list-view li.product .rakesh-card-icons {
	top: 25px !important;
	right: 25px !important;
	flex-direction: row !important;
}

/* Structural Contents */
.woocommerce ul.products li.product .woocommerce-LoopProduct-link,
.woocommerce ul.products li.product .astra-shop-summary-wrap,
.woocommerce ul.products li.product .astra-shop-thumbnail-wrap {
	display: contents !important;
}
