/* ====================================================
   GOLDEN TAJ COMMERCE SUITE - FINAL QA PASSED CSS
   ==================================================== */

.gtcs-app-wrapper, .gtcs-archive-child-scroller { width: 100%; box-sizing: border-box; font-family: inherit; margin: 20px 0; }
.gtcs-archive-child-scroller { margin-bottom: 25px; border-bottom: 1px solid #eaeaea; padding-bottom: 15px; }

.gtcs-parent-scroll, .gtcs-product-scroll { display: flex; flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; gap: 15px; padding: 10px 5px; scrollbar-width: none; }
.gtcs-parent-scroll::-webkit-scrollbar, .gtcs-product-scroll::-webkit-scrollbar { display: none; }

.gtcs-cat-card { flex: 0 0 auto; width: calc(var(--gtcs-parent-img-size, var(--gtcs-child-img-size, 85px)) + 10px); text-align: center; text-decoration: none; display: flex; flex-direction: column; align-items: center; transition: transform 0.2s ease; }
.gtcs-cat-img { width: var(--gtcs-parent-img-size, var(--gtcs-child-img-size, 85px)); height: var(--gtcs-parent-img-size, var(--gtcs-child-img-size, 85px)); border-radius: var(--gtcs-parent-radius, var(--gtcs-child-radius, 12px)); overflow: hidden; border: 1px solid #eaeaea; background: #fff; margin-bottom: 8px; box-shadow: 0 4px 6px rgba(0,0,0,0.05); display: flex; align-items: center; justify-content: center; }
.gtcs-cat-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gtcs-cat-title { font-size: var(--gtcs-parent-font-size, var(--gtcs-child-font-size, 12px)); font-weight: 700; color: #333; line-height: 1.2; text-transform: uppercase; white-space: normal; }

.gtcs-product-card { flex: 0 0 auto; width: calc(var(--gtcs-prod-img-size, 100px) + 20px); text-decoration: none; display: flex; flex-direction: column; transition: transform 0.2s ease; }
.gtcs-product-img { width: var(--gtcs-prod-img-size, 100px); height: var(--gtcs-prod-img-size, 100px); border-radius: var(--gtcs-prod-radius, 12px); overflow: hidden; border: 1px solid #eaeaea; background: #fff; margin-bottom: 10px; box-shadow: 0 4px 6px rgba(0,0,0,0.05); position: relative; }
.gtcs-product-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gtcs-product-info { text-align: var(--gtcs-prod-align, left); padding: 0 5px; }
.gtcs-product-title { font-size: var(--gtcs-prod-font-size, 13px); font-weight: 600; color: #111; line-height: 1.3; margin-bottom: 5px; white-space: normal; }
.gtcs-product-price { font-size: var(--gtcs-prod-font-size, 13px); font-weight: 700; color: #d2232a; white-space: normal; }

/* Astra Category Scroller Overrides */
.woocommerce ul.products li.product-category a img { border-radius: var(--gtcs-child-radius, 12px) !important; margin-bottom: 8px !important; box-shadow: 0 4px 6px rgba(0,0,0,0.05) !important; display: block !important; }
.woocommerce ul.products li.product-category a .woocommerce-loop-category__title, .woocommerce ul.products li.product-category a h2 { position: static !important; background: transparent !important; padding: 0 !important; margin: 5px 0 0 0 !important; transform: none !important; color: #333 !important; font-size: 13px !important; font-weight: 700 !important; text-align: center !important; width: 100% !important; }
.woocommerce ul.products li.product-category a h2 mark, .woocommerce ul.products li.product-category a h2 .count { display: none !important; }

/* Carousel */
.gtcs-auto-carousel-wrapper { width: 100%; height: var(--car-height, 200px); max-height: var(--car-height, 200px); margin: 15px 0; position: relative; overflow: hidden; border-radius: 12px; box-shadow: 0 4px 10px rgba(0,0,0,0.08); display: block; background-color: #f4f4f4; }
.gtcs-auto-carousel-track { display: flex; width: 100%; height: 100%; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.gtcs-carousel-slide { flex: 0 0 100%; width: 100%; height: 100%; position: relative; scroll-snap-align: start; display: block; overflow: hidden; }
.gtcs-carousel-bg { position: absolute; top: -10%; left: -10%; width: 120%; height: 120%; background-size: cover; background-position: center; filter: blur(15px); opacity: 0.6; z-index: 0; transform: translateZ(0); will-change: transform, filter; }
.gtcs-has-blur .gtcs-carousel-slide img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: contain; margin: 0; padding: 10px 10px 40px 10px; box-sizing: border-box; z-index: 1; }
.gtcs-no-blur .gtcs-carousel-slide img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; margin: 0; padding: 0; box-sizing: border-box; z-index: 1; }
.gtcs-carousel-overlay { position: absolute; bottom: 0; left: 0; width: 100%; background: linear-gradient(to top, rgba(0,0,0,0.85), transparent); padding: 30px 15px 12px; box-sizing: border-box; z-index: 2; }
.gtcs-car-title { color: #fff; font-size: 16px; font-weight: 700; display: block; text-shadow: 0 2px 4px rgba(0,0,0,0.5); text-align: left; }

/* ====================================================
   --- 5. ASTRA MOBILE KILLER - GLOBAL SCROLLER FIX ---
   ==================================================== */
/* 1. Scroll ki boundary set karna zaroori hai taaki andar ka content slide ho sake */
.gtcs-container { 
    width: 100% !important; 
    max-width: 100vw !important; 
    overflow: hidden !important; 
}

/* 2. 100% Native Flex Scroll (Saare touch restrictions hata diye gaye hain) */
.gtcs-parent-scroll, .gtcs-child-scroll, .gtcs-product-scroll { 
    display: flex !important; 
    flex-wrap: nowrap !important; 
    overflow-x: auto !important; 
    overflow-y: hidden !important; 
    -webkit-overflow-scrolling: touch !important; 
    width: 100% !important; 
    touch-action: auto !important; /* ZERO TOUCH RESTRICTIONS */
    padding-bottom: 15px !important; /* Bottom cutoff se bachne ke liye gap */
    scrollbar-width: none !important; /* Firefox me scrollbar hide karne ke liye */
}

/* 3. Chrome/Safari me scrollbar hide karne ke liye */
.gtcs-parent-scroll::-webkit-scrollbar, 
.gtcs-child-scroll::-webkit-scrollbar, 
.gtcs-product-scroll::-webkit-scrollbar { 
    display: none !important; 
}

/* 4. Cards ko flex boundary ke andar shrink hone se rokna */
.gtcs-child-card, .gtcs-product-card { 
    flex: 0 0 auto !important; 
    max-width: none !important; 
    min-width: min-content !important; 
}

/* 5. Image aur Typography Fixes */
.gtcs-child-img, .gtcs-product-img { max-width: none !important; margin-left: auto !important; margin-right: auto !important; }
.gtcs-child-img img, .gtcs-product-img img { width: 100% !important; height: 100% !important; max-width: none !important; object-fit: cover !important; display: block !important; }
.gtcs-product-title, .gtcs-product-price, .gtcs-child-title { word-break: normal !important; white-space: normal !important; }
/* ====================================================
   --- 6. RESTORE HOVER EFFECTS & CURSOR ---
   ==================================================== */
.gtcs-cat-card, .gtcs-child-card, .gtcs-product-card {
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
}

/* Hover par card thoda upar aayega */
.gtcs-cat-card:hover, .gtcs-child-card:hover, .gtcs-product-card:hover {
    transform: translateY(-4px) !important;
}

/* Laptop par cursor ko 'Haath' (Grab) ka nishan banana */
.gtcs-parent-scroll, .gtcs-child-scroll, .gtcs-product-scroll {
    cursor: grab;
}
.gtcs-parent-scroll:active, .gtcs-child-scroll:active, .gtcs-product-scroll:active {
    cursor: grabbing;
}