/* Base & Reset */
* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: 'Inter', sans-serif; color: #333; line-height: 1.6; overflow-x: hidden; }
a { text-decoration: none; color: inherit; transition: color 0.3s; }
a:hover, a:focus { color: #61605a; text-decoration: none; }
ul { list-style: none; padding: 0; margin: 0; }
hr { border: 1px solid #e0e0e0 !important; }

/* --- Utility & Animation --- */
@keyframes fadeInUp { 
    from { opacity: 0; transform: translateY(30px); } 
    to { opacity: 1; transform: translateY(0); }
}

@keyframes fadeIn { 
    from { opacity: 0; } 
    to { opacity: 1; }
}

@keyframes fadeInModal { 
    from { opacity: 0; } 
    to { opacity: 1; }
}

@keyframes slideDown {
    from { transform: translateY(-50px); opacity: 0; } 
    to { transform: translateY(0); opacity: 1; }
}

.fade-in-up { animation: fadeInUp 0.6s ease-out; }
.stagger-animation > * { opacity: 0; animation: fadeInUp 0.6s ease-out forwards; }
.stagger-animation > :nth-child(1) { animation-delay: 0.1s; }
.stagger-animation > :nth-child(2) { animation-delay: 0.2s; }
.stagger-animation > :nth-child(3) { animation-delay: 0.3s; }
.stagger-animation > :nth-child(4) { animation-delay: 0.4s; }
.scroll-animate { opacity: 0; transform: translateY(30px); transition: all 0.6s ease-out; }
.scroll-animate.active { opacity: 1; transform: translateY(0); }

/* --- Global Components --- */
.section-title { font-family: 'Open Sans'; font-size: 40px; font-weight: 700; text-align: center; margin: 20px 0 50px; color: #00005A; position: relative; animation: fadeInUp 0.6s ease-out; letter-spacing: 0px; }
.cta-button { background: #fff; color: #1a237e; font-weight: 700; padding: 12px 28px; border: none; border-radius: 50px; cursor: pointer; transition: all 0.3s; }
.cta-button:hover { background: #e74c3c; color: #fff; transform: translateY(-2px); }

/* Primary Custom Button (Hero) */
.btn-primary-custom { background: #ffffffe6; color: #667eea; padding: 12px 35px; border-radius: 50px; border: none; font-weight: 600; transition: all 0.3s ease; animation: fadeInUp 1.2s ease-out; max-width: fit-content; }
.btn-primary-custom:hover { background: #fff; transform: translateY(-3px); box-shadow: 0 10px 20px #0000004d; }

/* --- Navigation & Header --- */
.top-banner { background-color: #1a237e; color: #fff; text-align: center; padding: 8px 15px; font-size: 12px; font-weight: 700; text-transform: uppercase !important; }
.navbar { background: #fff; box-shadow: 0 2px 10px #0000001a; padding: 1rem 0; position: sticky; top: 0; z-index: 1000; transition: all 0.3s ease; }
.navbar.scrolled { padding: 0.5rem 0; box-shadow: 0 4px 20px #00000026; }
.main-nav { background: #fff; box-shadow: 0 2px 8px #0000000d; position: sticky; top: 0; z-index: 996 !important; padding: 12px 0; display: block; }
.navbar-brand { font-weight: 700; color: #e91e63 !important; font-size: 1.5rem; }
.logo-container { /*display: flex; align-items: center;*/ width: 200px; /*flex-grow: 1;*/ /* For mobile centering */ }
.kotak-logo { margin-right: 8px; }
.brand-store-logo { font-weight: 700; color: #1a237e; font-size: 0.95em; border-left: 1px solid #ddd; padding-left: 10px; }

/* Desktop Nav */
.nav-desktop { display: flex; align-items: center; }
.nav-links { display: flex; gap: 24px; margin: 0 20px 0 0; }
.nav-links li a { font-size: 16px; font-weight: 500; color: #444; transition: color 0.3s; 
	font-family: Source Sans Pro; font-weight: 400; font-style: Regular; font-size: 18px; leading-trim: NONE; line-height: 100%; letter-spacing: 1%; }
.nav-links li a:hover { color: #1a237e; }
.nav-link { color: #333 !important; margin: 0 1rem; transition: color 0.3s ease; position: relative; }
.nav-link::after { content: ''; position: absolute; bottom: -5px; left: 0; width: 0; height: 2px; background: #e91e63; transition: width 0.3s ease; }
.nav-link:hover::after { width: 100%; }
.nav-utility { display: flex; align-items: center; gap: 15px; }
.icon-link { margin-left: 20px; color: #555; display: flex; align-items: center; transition: color 0.3s, transform 0.2s; }
.icon-link:hover { color: #e74c3c; }
.icon-link .material-icons { font-size: 24px; }
.search-bar { display: flex; align-items: center; background: #f3f3f3; border-radius: 25px; padding: 6px 12px; transition: all 0.3s; }
.search-bar:focus-within { background: #fff; box-shadow: 0 0 0 2px #e74c3c33; }
.search-bar input { border: none; background: transparent; outline: none; padding: 5px; font-size: 0.95em; width: 140px; font-size: 16px; width: 140px; font-weight: 600;}
.search-bar .material-icons { color: #888; margin-right: 5px; }

.dropdown-menu{font-size: 1em;}
.dropdown-item{ padding: 5px 15px }
.dropdown-item:focus, .dropdown-item:hover { color: #1a237e; background-color: #ffffff00; }

/* Cart/Wishlist Count */
.cart-icon { position: relative; }
.cart-icon .cart-count,
.cart-icon .wish-count { position: absolute; top: -0.9rem; left: 1.5rem; min-width: 1.4rem; height: auto; width: auto; padding: 2px; border-radius: 50%; background-color: #ff4052; color: #fff; font-size: 1rem; font-weight: 400; line-height: 1.3; text-align: center; }

/* Mega Menu */
.mega-menu-item { position: relative; }
.mega-menu-dropdown { display: none; position: absolute; top: 100%; left: -250px; width: 850px; background: #fff; border-radius: 10px; box-shadow: 0 10px 25px #0000001a; padding: 25px 20px; animation: fadeIn 0.25s ease-in-out; }
.mega-menu-item:hover .mega-menu-dropdown { display: flex; flex-wrap: wrap; }
.mega-menu-column { flex: 1; min-width: 150px; padding: 0 10px; }
.mega-menu-column h3 { font-size: 1em; color: #1a237e; margin-bottom: 10px; font-weight: 700; }
.mega-menu-column a { display: block; font-size: 0.9em; color: #555; padding: 4px 0; transition: color 0.3s; }
.mega-menu-column a:hover { color: #e74c3c; }
.promo-column img { width: 100%; border-radius: 6px; margin-bottom: 8px; }
.view-all-btn { background: #e74c3c; color: #fff !important; padding: 8px 14px; border-radius: 6px; display: inline-block; font-size: 0.85em; font-weight: 700; }
.view-all-btn:hover { background: #c0392b; }

/* --- Mobile Navigation --- */
.nav-mobile { display: none; /* Controlled by media queries */ align-items: center; }
.nav-utility-mobile { display: flex; margin-right: 15px; }
.nav-utility-mobile .icon-link { margin-left: 15px; }
.hamburger-menu { background: none; border: none; cursor: pointer; font-size: 28px; color: #333; padding: 5px; }
.mobile-nav-drawer { position: fixed; top: 0; right: -100%; width: 80%; max-width: 300px; height: 100%; background-color: #fff; box-shadow: -2px 0 10px #0003; transition: right 0.3s ease-in-out; z-index: 1001; display: flex; flex-direction: column; padding: 20px; }
.mobile-nav-drawer.open, .mobile-nav-drawer.active { right: 0; transform: translateX(0); }

.close-menu { align-self: flex-end; background: none; border: none; font-size: 28px; cursor: pointer; color: #333; margin-bottom: 10px; }

.drawer-links { list-style: none; padding: 0; margin: 0; margin-bottom: 30px; }
.drawer-links li { border-bottom: 1px solid #eee; }
.drawer-links li:last-child { border-bottom: none; }
.drawer-links a { display: flex; justify-content: space-between; align-items: center; padding: 14px 10px; color: #333; font-weight: 500; transition: background 0.3s; }
.drawer-links a:hover { background: #f5f5f5; color: #1a237e; }
.arrow-icon { transition: transform 0.3s; }

.mega-menu-dropdown1 { display: none; padding: 10px 15px; }
.mega-menu-dropdown1.active { display: block; animation: fadeIn 0.3s ease; }
.mega-menu-dropdown1 .mega-menu-column { background: #fff; padding: 12px; transition: all 0.3s ease; }
.mega-menu-dropdown1 .mega-menu-column h3 { margin: 0; font-size: 18px; font-weight: 400; cursor: pointer; display: flex; justify-content: space-between; align-items: center; }
.mega-menu-dropdown1 .mega-menu-column h3::after { content: '+'; font-size: 20px; transition: transform 0.2s; }
.mega-menu-dropdown1 .mega-menu-column h3.active::after { content: '−'; }

.sub-category-list { display: none; padding-left: 15px; /* Added for hierarchy in mobile menu */ }
.sub-category-list li { font-size: 14px; cursor: pointer; transition: color 0.2s; align-items: center; padding: 14px 10px; color: #333; font-weight: 400; border-bottom: none; /* Override parent li border */ }
.sub-category-list li:hover { color: #007bff; }

.drawer-utility { margin-top: 15px; display: flex; flex-direction: column; gap: 8px; border-top: 1px solid #eee; padding-top: 10px; margin-top: auto; }
.drawer-utility .icon-link { display: flex; align-items: center; gap: 8px; color: #555; font-weight: 500; }
.drawer-utility .icon-link:hover { color: #1a237e; }

.search-bar.mobile-search { margin-top: 20px; width: 100%; }
.search-bar.mobile-search input { width: calc(100% - 40px); }

/* Search Modal */
.search-modal { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: #00000080; z-index: 2000; animation: fadeInModal 0.3s ease; }
.search-modal.active { display: flex; justify-content: center; align-items: flex-start; padding-top: 80px; }
.search-modal-content { background: #fff; border-radius: 16px; width: 90%; max-width: 500px; box-shadow: 0 10px 40px #0003; animation: slideDown 0.3s ease; }
.search-header { padding: 20px; border-bottom: 1px solid #f0f0f0; }
.search-input-wrapper { position: relative; display: flex; align-items: center; }
.search-input-wrapper input { width: 100%; padding: 12px 45px 12px 15px; border: 2px solid #e0e0e0; border-radius: 8px; font-size: 16px; outline: none; transition: border-color 0.3s; }
.search-input-wrapper input:focus { border-color: #1a237e; }
.search-input-wrapper .search-icon { position: absolute; right: 15px; color: #888; font-size: 20px; }
.search-results { max-height: 400px; overflow-y: auto; }
.search-section-title { padding: 10px 20px; font-size: 12px; color: #888; text-transform: uppercase; font-weight: 600; }
.search-item { display: flex; align-items: center; justify-content: space-between; padding: 12px 20px; cursor: pointer; transition: background 0.2s; }
.search-item:hover { background: #f5f5f5; }
.search-item-left { display: flex; align-items: center; gap: 12px; }
.search-item-icon { color: #666; font-size: 18px; }
.search-item-text { color: #333; font-size: 15px; }
.search-item-delete { color: #999; font-size: 18px; cursor: pointer; transition: color 0.2s; }
.search-item-delete:hover { color: #e74c3c; }

/* --- Category Cards --- */
.category-card { border-radius: 20px; overflow: hidden; transition: all 0.4s ease; cursor: pointer; width: 100%; aspect-ratio: 1 / 0.5; /*min-height: 250px;*/ position: relative; }
.category-card:hover { transform: translateY(-10px); box-shadow: 0 15px 35px #0003; }
.category-apparels { background: linear-gradient(135deg, #ffeef8 0%, #ffe5f2 100%); }
.category-limited { background: linear-gradient(135deg, #e3f2fd 0%, #bbdefb 100%); }
.category-essentials { background: linear-gradient(135deg, #fff8e1 0%, #ffecb3 100%); }
.category-eco { background: linear-gradient(135deg, #e8f5e9 0%, #c8e6c9 100%); }
.category-content { padding: 30px; height: 100%; display: flex; flex-direction: column-reverse; justify-content: space-between; }
.category-title { font-size: 1.8rem; font-weight: 700; color: #1a237e; margin-bottom: 10px; }
.category-desc { color: #555; margin-bottom: 15px; }
.shop-now-link { color: #e91e63; font-weight: 600; display: inline-flex; align-items: center; transition: all 0.3s ease; }
.shop-now-link:hover { transform: translateX(5px); }
.shop-now-link i { margin-left: 5px; }

/* --- Features Section --- */
.features { padding: 40px 0; background: #fff; }
.feature-card { text-align: center; padding: 40px 20px; border-radius: 15px; background: #fff; transition: all 0.3s ease; height: 100%; }
.feature-card:hover { transform: translateY(-10px); box-shadow: 0 10px 30px #0000001a; }
.feature-icon { width: 80px; height: 80px; margin: 0 auto; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 2rem; }
.icons-delivery { background: #ffebee; }
.icons-shipping { background: #e3f2fd; }
.icons-payment { background: #e8f5e9; }
.icons-support { background: #fff8e1; }

/* --- Product Cards & Slider --- */
.slider-container { position: relative; margin: 0 auto; }
.slider-controls { display: flex; gap: 10px; justify-content: flex-end; margin-bottom: 20px; position: absolute; top: -85px; right: 0; }
.slider-btn { position: static; transform: none; background: #fff; border: none; width: 45px; height: 45px; border-radius: 50%; display: flex; align-items: center; justify-content: center; cursor: pointer; box-shadow: 0 2px 10px #00000026; transition: all 0.3s ease; z-index: 10; }
.slider-btn:hover { background: #1a1a4d; color: #fff; box-shadow: 0 4px 15px #00000040; }
.slider-btn:disabled { opacity: 0.3; cursor: not-allowed; background: #fff; color: #000; }

.products-wrapper { overflow: hidden; padding: 20px 0; }
.products-track { display: flex; gap: 20px; transition: transform 0.4s ease; }
.product-card { min-width: calc(25% - 15px); padding: 0; position: relative; }
.products-track .product-card { width: calc(25% - 15px); padding: 0; position: relative; }
.product-image-wrapper { position: relative; background: #f5f5f5; border-radius: 15px; margin-bottom: 15px; display: flex; align-items: center; justify-content: center; overflow: hidden; aspect-ratio: 1; /* Ensures square container */ }
.product-image-wrapper a {width: 100%;}
.product-image { width: 100%; height: 100%; object-fit: contain; transition: transform 0.3s ease; /*max-width: 360px; max-height: 360px;*/ }
.product-card:hover .product-image { transform: scale(1.1); }
.sale-badge { position: absolute; bottom: 10px; left: 10px; display: flex; flex-direction: column; align-items: flex-start; z-index: 1; }
.sale-badge-1 { background: #ff2d55; color: #fff; padding: 2px 10px; border-radius: 20px; font-weight: 600; margin-bottom: 5px; }

.action-icons { position: absolute; top: 10px; right: 10px; display: flex; gap: 8px; z-index: 2; }
.action-icons button { background: #fff; border: none; width: 42px; height: 42px; border-radius: 14px; display: flex; align-items: center; justify-content: center; cursor: pointer; box-shadow: 0 2px 6px #0000001a; transition: .2s ease; }
.action-icons i { font-size: 20px; color: #333; }

.wishlist-btn { position: absolute; top: 10px; right: 10px; background: #fff; border: none; width: 45px; height: 45px; border-radius: 15%; display: flex; align-items: center; justify-content: center; cursor: pointer; box-shadow: 0 2px 6px #0000001a; transition: all 0.2s ease; z-index: 1; }
.wishlist-btn i { font-size: 20px; color: #333; /* Default icon color */ }
.wishlist-btn:hover i, .wishlist-btn.active i { color: #ff2d55; }


.product-image-wrapper { position: relative; overflow: hidden; }
/* Hidden by default */
.action-icons { position: absolute; top: 10px; right: 10px; display: flex; gap: 8px; opacity: 0; visibility: hidden; transition: opacity .3s ease, visibility .3s ease; z-index: 2; }
/* Show on hover */
.product-image-wrapper:hover .action-icons { opacity: 1; visibility: visible; }
/* Common button styles */
.action-icons a, .action-icons button { background: #fff; border: none; width: 42px; height: 42px; border-radius: 14px; display: flex; align-items: center; justify-content: center; cursor: pointer; box-shadow: 0 2px 6px #0000001a; transition: .2s ease; }
.action-icons i { font-size: 20px; color: #333; }
/* Icon hover effects */
.wishlist1-btn:hover i, .wishlist1-btn.active i { color: #ff2d55; }
.view-btn:hover i { color: #00005A; }


.wireless-icon { position: absolute; bottom: 10px; left: 10px; color: #666; }
.color-options { display: flex; gap: 6px; margin-bottom: 10px; }
.color-dot { width: 20px; height: 20px; border-radius: 50%; border: 2px solid transparent; cursor: pointer; transition: border-color 0.2s; }
.color-dot:hover { border-color: #666; }
.color-dot.active { border-color: #1a1a4d; border-width: 3px; }

/* Color Palette Dots */
.color-brown { background: #8b6f47; }
.color-green { background: #2d7a4f; }
.color-gray { background: #7d7d7d; }
.color-yellow { background: #f4d35e; }
.color-mint { background: #5fb49c; }
.color-coral { background: #ff6b6b; }
.color-orange { background: #ff8c42; }
.color-blue { background: #4a5f7f; }
.color-red { background: #c41e3a; }

.product-title { font-family: 'Source Serif Pro', serif !important; font-weight: 400; font-size: 24px; /*line-height: 1.2; color: #1a1a4d;*/ margin-bottom: 5px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; white-space: normal; /* Allow title to wrap before truncating */ }
.product-category { font-family: 'Source Sans Pro', sans-serif !important; font-weight: 400; font-size: 14px; line-height: 1; text-transform: uppercase; color: #999; letter-spacing: 0.5px; margin-bottom: 10px; }
.product-price { font-family: 'Source Serif Pro' !important; font-weight: 700; font-size: 20px; line-height: 1.5; display: flex; align-items: flex-end; gap: 10px; margin-top: 15px; }
.current-price { font-family: 'Source Serif Pro' !important; font-weight: 700; color: #1a1a4d; font-size: 15px; /* Adjusted for consistency in product card */ }
.original-price { font-family: 'Source Serif Pro' !important; color: #999; text-decoration: line-through; }

/* --- Product Detail Page (PDP) --- */
.layout { display: flex; align-items: flex-start; }
.sticky { position: sticky; top: 80px; height: fit-content; z-index: 1; }
.content { flex: 1; }
.image-gallery { position: relative; }
.main-image-container { position: relative; overflow: hidden; border: 1px solid #ddd; border-radius: 8px; height: auto; background: #f8f9fa; cursor: crosshair; }
.main-image { width: 100%; height: 100%; object-fit: contain; transition: opacity 0.3s ease; max-height: 600px; }

/* Zoom Functionality */
.zoom-lens { position: absolute; border: 3px solid #ff3f6ccc; box-shadow: 0 0 0 2000px #0000004d; width: 180px; height: 180px; display: none; pointer-events: none; background: #ffffff1a; backdrop-filter: blur(2px); z-index: 10; }
.zoom-result { position: absolute; top: 0; right: calc(-100% - 30px); width: 100%; height: calc(100% - 95px); border: 2px solid #ddd; border-radius: 8px; background: #fff; display: none; overflow: hidden; z-index: 1000; box-shadow: 0 8px 30px #0003; }
.zoom-result img { position: absolute; max-width: none; }

.thumbnail-container { display: flex; gap: 10px; margin-top: 15px; flex-wrap: wrap; }
.thumbnail { width: 80px; height: 80px; border: 2px solid #ddd; border-radius: 5px; cursor: pointer; object-fit: cover; transition: all 0.3s ease; }
.thumbnail:hover, .thumbnail.active { border-color: #FA1432; transform: scale(1.05); }

.product-container .brand-name { color: #878787; font-size: 14px; text-transform: uppercase; letter-spacing: 1px; }
.product-container .product-title { font-family: Source Serif Pro;
font-weight: 400;
font-style: Regular;
font-size: 40px;
line-height: 110.00000000000001%;
letter-spacing: 0%;
color: #000;
/*color: #28323C;*/

/*font-size: 24px; font-weight: 600; color: #282c3f; margin: 10px 0; white-space: normal;*/ }

.rating { display: flex; align-items: center; gap: 10px; margin: 10px 0; }
.rating-badge { padding: 4px 10px; border-radius: 50px; font-size: 14px; border: 1px solid #ddd; }
.rating-count { color: #878787; font-size: 14px; }

.product-container .price-section { display: flex; align-items: center; gap: 15px; margin: 20px 0; }
.product-container .current-price { font-size: 28px; font-weight: 700; color: #282c3f; }
.product-container .original-price { font-size: 20px; color: #878787; text-decoration: line-through; }

.discount-badge { background: #FA1432; color: #fff; padding: 5px 10px; border-radius: 50px; font-weight: 600; }
.color-option { width: 40px; height: 40px; border-radius: 50%; border: 2px solid #ddd; cursor: pointer; transition: all 0.3s ease; }

.color-option:hover,
.color-option.active { border-color: #FA1432; transform: scale(1.1); box-shadow: 0 2px 8px #0003; }

.color-option.yellow { background: #ffc107; }
.color-option.green { background: #26a69a; }
.color-option.red { background: #ef5350; }
.color-option.black { background: #000; }

.size-options { display: flex; gap: 10px; margin: 20px 0; flex-wrap: wrap; }
.size-option { padding: 10px 20px; border: 1px solid #ddd; border-radius: 50px; cursor: pointer; transition: all 0.3s ease; font-weight: 500; }

.size-option:hover, .size-option.active { border-color: #FA1432; color: #FA1432; }

.size-guide-link { color: #FA1432; text-decoration: none; font-size: 14px; margin-left: 10px; }

.btn-add-cart { background: #FA1432; color: #fff; padding: 15px 40px; border: none; border-radius: 50px; font-size: 16px; font-weight: 600; cursor: pointer; transition: all 0.3s ease; }
.btn-add-cart:hover { transform: translateY(-2px); box-shadow: 0 4px 12px #ff3f6c4d; }

.btn-wishlist, .btn-share { padding: 15px 20px; border: 1px solid #ddd; background: #fff; border-radius: 50px; cursor: pointer; transition: all 0.3s ease; }
.btn-wishlist:hover, .btn-share:hover { border-color: #FA1432; color: #FA1432; }

.write-review-btn { color: #FA1432; font-weight: 600; cursor: pointer; }

.share-dropdown { position: absolute; background: #fff; border: 1px solid #ddd; border-radius: 8px; padding: 15px; box-shadow: 0 4px 12px #00000026; display: none; right: 0; }
.share-dropdown.show { display: block; }
.share-option { display: flex; align-items: center; gap: 10px; padding: 10px; border-radius: 5px; cursor: pointer; transition: background 0.3s ease; color: #282c3f; }

.share-option:hover { background: #f8f9fa; }
.share-option i { font-size: 20px; width: 30px; }

/* Social Icons */
.fa-facebook { color: #1877f2; }
.fa-twitter { color: #1da1f2; }
.fa-whatsapp { color: #25d366; }
.fa-pinterest { color: #e60023; }
.fa-link { color: #666; }

.star-rating { display: flex; gap: 5px; font-size: 30px; margin: 20px 0; }
.star-rating i { color: #ddd; cursor: pointer; transition: color 0.2s ease; }
.star-rating i.active, .star-rating i:hover { color: #ffc107; }

/* Accordion */
.accordion-item { border-bottom: 1px solid #e0e0e0; }
.accordion-item:last-child { border-bottom: none; }
.accordion-header { display: flex; justify-content: space-between; align-items: center; padding: 20px 24px; cursor: pointer; background: #fff; transition: background-color 0.2s; user-select: none; }
.accordion-header:hover { background-color: #fafafa; }
.accordion-title { font-size: 16px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; color: #1a1a1a; }
.accordion-icon { font-size: 20px; transition: transform 0.3s ease; color: #666; }
.accordion-content { max-height: 0; overflow: hidden; transition: max-height 0.3s ease; }
.accordion-body { padding: 0 24px 24px; color: #666; font-size: 15px; }

/* Reviews */
.review-card { background: #DCF5FF; padding: 20px; border-radius: 8px; margin-bottom: 16px; }
.review-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 12px; flex-wrap: wrap; gap: 10px; }
.reviewer-name { font-weight: 600; color: #1a1a1a; }
.review-date { color: #999; font-size: 14px; }
.review-stars { color: #f44; font-size: 16px; margin-bottom: 8px; }
.review-text { color: #666; line-height: 1.7; font-size: 14px; }
.view-more { color: #666; text-decoration: underline; font-size: 14px; cursor: pointer; display: inline-block; margin-top: 10px; }

/* --- Product Listing Page (PLP) / Catalog --- */
.breadcrumb { padding: 30px 0 0; background: transparent; font-size: 14px; color: #666; gap: 5px; display: flex; }
.breadcrumb a { color: #666; }
.breadcrumb a:hover { color: #1a1a4d; }

.header { padding: 20px 0; background: #fff; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 15px; }
.header-actions { display: flex; gap: 15px; align-items: center; }
.desk-filters-btn, .mobile-filters-btn, .sort-btn { padding: 8px 0; border: 0 solid #ddd; background: #fff; cursor: pointer; border-radius: 4px; font-size: 14px; display: flex; align-items: center; gap: 8px; }
.mobile-filters-btn { display: none; /* Controlled by media queries */ }
.container1 { display: flex; }

/* Sidebar & Filters */
.sidebar { width: 360px; background: #f9f9f9; padding: 20px; border-radius: 20px; height: fit-content; position: sticky; top: 70px; margin: 0 20px 20px 0; /*display: none;*/ /* Controlled by media queries */ }
.filter-section { margin-bottom: 15px; }
.filter-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px; cursor: pointer; user-select: none; }
.filter-title { font-size: 20px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; }
.filter-toggle { font-size: 18px; color: #666; }
.filter-options { display: flex; flex-direction: column; gap: 5px; }
.checkbox-label { display: flex; align-items: center; gap: 10px; cursor: pointer; font-size: 18px; color: #000; }
.checkbox-label input[type="checkbox"] { width: 18px; height: 18px; cursor: pointer; }

/* Color Filters */
.color-circle { width: 30px; height: 30px; border-radius: 50%; cursor: pointer; border: 2px solid transparent; transition: all 0.2s; }

.color-circle:hover { transform: scale(1.1); }

.color-circle.selected { border-color: #1a1a4d; box-shadow: 0 0 0 2px white, 0 0 0 4px #1a1a4d; }

.color-orange { background-color: #FFB347; }
.color-green { background-color: #4CAF50; }
.color-red { background-color: #FF6B6B; }

/* Size Filters */
.size-btn { padding: 8px 16px; border: 1px solid #ddd; background: #fff; cursor: pointer; border-radius: 20px; font-size: 14px; transition: all 0.2s; }
.size-btn:hover { border-color: #1a1a4d; }
.size-btn.selected { background: #1a1a4d; color: #fff; border-color: #1a1a4d; }

/* Products Grid */
.products-section { flex: 1; }
.product-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 20px; margin-bottom: 40px; }

/* Mobile Filter Panel */
.mobile-filter-overlay { display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: #00000080; z-index: 998; }
.mobile-filter-panel { display: none; position: fixed; top: 0; left: -100%; bottom: 0; width: 300px; max-width: 85%; background: #fff; z-index: 999; overflow-y: auto; transition: left 0.3s; padding: 20px; }
.mobile-filter-panel.open { left: 0; }
.mobile-filter-overlay.active { display: block; }
.mobile-filter-panel { display: block; }
.filter-panel-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; padding-bottom: 15px; border-bottom: 1px solid #e0e0e0; }
.filter-panel-header h3 { font-size: 18px; font-weight: 600; }
.close-filter { background: none; border: none; font-size: 24px; cursor: pointer; color: #666; }
.filter-actions { display: flex; gap: 10px; margin-top: 20px; padding-top: 20px; border-top: 1px solid #e0e0e0; }
.clear-btn { flex: 1; padding: 12px; border: 1px solid #ddd; background: #fff; cursor: pointer; border-radius: 50px; font-size: 14px; font-weight: 600; }
.apply-btn { flex: 1; padding: 12px; border: none; background: #ff3838; color: #fff; cursor: pointer; border-radius: 50px; font-size: 14px; font-weight: 600; }

/* Pagination */
.pagination { display: flex; justify-content: center; align-items: center; gap: 10px; margin: 40px 0 20px; padding: 20px 0; }
.page-btn { padding: 10px 16px; border: 1px solid #ddd; background: #fff; cursor: pointer; border-radius: 4px; font-size: 14px; transition: all 0.2s; min-width: 40px; text-align: center; }
.page-btn:hover { border-color: #1a1a4d; background: #f5f5f5; }
.page-btn.active { background: #1a1a4d; color: #fff; border-color: #1a1a4d; }
.page-btn:disabled { opacity: 0.4; cursor: not-allowed; }

/* --- Footer --- */
footer { background: #00005A; color: #fff; padding: 60px 0 0; margin-top: auto; }
.footer-logo { display: flex; align-items: center; gap: 0; margin-bottom: 25px; }
.footer-description { color: #fffc; line-height: 1.7; max-width: 400px; }
.footer-section-title { font-weight: 700; letter-spacing: 1px; text-transform: uppercase; margin-bottom: 25px; color: #fff; font-size: 15px; }
.footer-links { list-style: none; padding: 0; margin: 0; }
.footer-links li { margin-bottom: 12px; }
.footer-links a { color: #fffc; transition: all 0.3s ease; display: inline-block; }
.footer-links a:hover { color: #fff; transform: translateX(5px); }
.footer-bottom { background: #0003; padding: 15px 0; margin-top: 30px; }
.copyright-text { color: #ffffffb3; margin: 0; }
.copyright-text a { color: #fff; font-weight: 600; }
.certification-badges { display: flex; gap: 5px; flex-wrap: nowrap; flex-direction: row; align-items: center; justify-content: center; }
.cert-badge { display: flex; padding: 5px; }
.cert-badge img { width: 60px; }
.cert-icon { color: #fffc; font-size: 2rem; }

/* --- Media Queries --- */
@media screen and (min-width: 1280px) {
    .container { max-width: 100%; padding: 0 10%; }
}

@media (max-width: 1399px) {
    .product-grid { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
}

@media (max-width: 1199px) {
    .product-grid { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
}

@media (max-width: 992px) {
    .nav-desktop { display: none !important; }
    .nav-mobile { display: flex; align-items: center; gap: 5px; justify-content: flex-end; flex-grow: 1; }
    .nav-mobile .icon-link { margin-left: 5px; }
    .nav-links li { margin-right: 15px; }
    .nav-utility .icon-link { margin-left: 15px; }
    .search-bar input { width: 100px; }
    .mega-menu-dropdown { left: 0; width: 100%; }
    .product-card { min-width: calc(33.333% - 14px); }
    .search-modal.active { padding-top: 20px; }
    .search-modal-content { width: 95%; }
    .sub-category-list li { font-size: 16px; padding: 0px 10px; }
    .mega-menu-dropdown1 .mega-menu-column { padding: 0px; }
}

@media (max-width: 768px) {
    .section-title { font-size: 34px; }

    /* Navigation */
    .logo-container { flex-grow: 1; }
    .brand-store-logo { font-size: 0.8em; }
    .nav-mobile { display: flex; align-items: center; width: 100%; flex-direction: row; justify-content: flex-end; }
    .hamburger-menu { font-size: 0; /* Hide icon when using separate mobile menu */ }

    /* PDP */
    .layout { flex-direction: column; }
    .sticky { position: static; }
    .zoom-result { display: none !important; }

    /* PLP */
    .product-grid { grid-template-columns: repeat(2, 1fr); }
    .sidebar { display: none; }
    .mobile-filters-btn { display: block; }
    .desk-filters-btn { display: none; }
    .header-actions { justify-content: space-between; width: 100%; }

    /* Slider */
    .product-card { min-width: calc(50% - 10px); }
    .slider-controls { justify-content: center; margin-top: 20px; margin-bottom: 0; position: absolute; top: auto; bottom: -49px; width: 100%; }

    /* Footer */
    footer { padding: 40px 0 0; }
    .footer-section-title { margin-top: 30px; margin-bottom: 15px; }
    .footer-logo { justify-content: center; }
    .footer-description { max-width: 100%; text-align: center; margin: 0 auto 30px; }
    .footer-bottom { padding: 25px 0; margin-top: 30px; }
    .copyright-text { text-align: center; margin-bottom: 20px; }
    .certification-badges { justify-content: center; }
    .cert-badge img { width: 50px; }

	.product-title { font-size: 24px; line-height: 1.2; margin-bottom: 5px; }
	.product-category { font-size: 14px; line-height: 1; letter-spacing: 0.5px; margin-bottom: 10px; }
	.product-price { font-size: 20px; line-height: 1.5; gap: 10px; margin-top: 10px; }
}

@media (max-width: 640px) {
    .product-detail-action { flex-direction: column; }
    .product-info { padding: 12px; }
    .product-name { font-size: 14px; }
    .price-current { font-size: 16px; }
    .pagination { gap: 5px; }
    .page-btn { padding: 8px 12px; font-size: 13px; min-width: 35px; }
}

@media (max-width: 576px) {
    .mega-menu-dropdown1 .mega-menu-column { padding: 0px; }

    .product-grid { gap: 10px; }
    .section-title { font-size: 1.75rem;  margin: 20px 0 20px;  font-size: 32px;}
    .top-banner { font-size: 0.7em; padding: 5px 10px; }
    .cta-button { padding: 12px 25px; font-size: 1em; }
    .feature-card { padding: 10px; }
    .feature-icon { width: 35px; height: 60px; }
    .feature-card h3 { font-size: 1.5rem; margin-bottom: 1rem; }
    .feature-card p { font-size: 12px; }


    .products-wrapper { padding: 0; }
    /* Product Card */
    /*.product-title { font-size: 14px; }
    .product-category { font-size: 12px; }
    .current-price { font-size: 1.4rem; }
    .original-price { font-size: 1.1rem; }*/
	.product-title { font-size: 18px; line-height: 1.2; margin-bottom: 5px; }
	.product-category { font-size: 14px; line-height: 1; letter-spacing: 0.5px; margin-bottom: 10px; }
	.product-price { font-size: 20px; line-height: 1.5; gap: 10px; margin-top: 10px; }
	.original-price { font-size: 15px; }

    .sale-badge-1 { font-size: 0.95rem; }

    .wishlist-btn { width: 35px; height: 35px; }
    .wishlist-btn i { font-size: 16px; }
    .slider-btn { width: 35px; height: 35px; }

    .product-container .content { padding: 0 }
    .color-option { width: 30px; height: 30px; }

    /* PDP */
    .product-container .product-title { font-size: 24px; }
    .product-container .price-section { gap: 5px; margin: 10px 0; }
    .product-container .current-price { font-size: 20px; }
    .product-container .original-price { font-size: 15px; }
    .discount-badge { padding: 5px 10px; font-size: 12px; }
    .size-option { padding: 5px 16px; }
    .btn-add-cart { width: 100%; }

    /* Accordion */
    .accordion-header { padding: 16px; }
    .accordion-body { padding: 0 16px 16px; }
    .accordion-title { font-size: 14px; }
    .review-card { padding: 16px; }


    /*category section*/
    .category-content { padding: 10px; }
    .category-content .btn-primary-custom { padding: 5px 20px; font-size: 12px;  margin-left: 10px;}
}


.home-slide, .slide-bg { overflow: hidden ! important; }
.shop-now-btn { font-family: Source Sans Pro; font-weight: 700; font-style: Bold; font-size: 14px; leading-trim: NONE; line-height: 100%; letter-spacing: 8%; text-transform: uppercase; color: #00005A; padding: 15px 25px; }
.shop-now-btn:hover, .shop-now-btn:focus { color: #00005A; }



/********** home page banner start ****************/
.banner-swiper { width: 100%; height: 100%; position: relative; }
.banner-slide { display: flex; justify-content: space-between; align-items: center; height: 100%; min-height: 80vh; position: relative; overflow: hidden; }

/* Background & Overlay */
.banner-background, .bg-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.banner-background { z-index: 1; }
.banner-background img { width: 100%; height: 100%; object-fit: cover; }
.bg-overlay { background: rgb(255 255 255 / 29%); z-index: 2; }

/* When banner-container is hidden, remove overlay */
.banner-slide:has(.banner-container.d-none) .bg-overlay,
.banner-slide:has(.banner-container:empty) .bg-overlay { display: none; }

/* Content Container */
.banner-container { position: absolute; z-index: 10; display: flex; justify-content: space-around; align-items: flex-end; width: 100%; height: 100%; margin: 0 auto; padding: 0 80px 0; }
.banner-container.d-none { display: none !important; }

.banner-content { flex:  35%; /*max-width: 550px;*/ align-self: center; }
.banner-image { flex:  65%; align-self: flex-end; }

/* Text Content */
.banner-content h1 { font-family: 'Source Sans Pro'; font-size: 5em; font-weight: 700; line-height: 1.1; margin-bottom: 24px; }
.banner-content h1 .red-text { color: #ff003c; display: block; }
.banner-content h1 .blue-text { color: #0b1a46; display: block; }
.banner-content p { font-family: Source Serif Pro; font-style: Regular; margin: 24px 0 36px; font-size: 1.5em; color: #00005A; line-height: 1.6; }

.banner-btn { background: #ff003c; color: #fff; padding: 18px 48px; display: inline-block; border-radius: 50px; font-size: 15px; font-weight: 700; text-decoration: none; text-transform: uppercase; letter-spacing: 0.5px; transition: all 0.3s ease; box-shadow: 0 4px 15px rgba(255, 0, 60, 0.3); }
.banner-btn:hover { background: #d90033; transform: translateY(-2px); box-shadow: 0 6px 20px rgba(255, 0, 60, 0.4); }

/* Character Image */
.banner-image { display: flex; justify-content: flex-end; /*align-items: flex-end;*/ height: 100%; position: relative; }
.banner-image img { max-width: 100%; height: auto; max-height: 90vh; object-fit: contain; object-position: bottom; }

/* Swiper Controls */
.swiper-pagination { bottom: 30px !important; z-index: 20; }
.swiper-pagination-bullet { width: 12px; height: 12px; background: #333; opacity: 0.5; transition: all 0.3s ease; }
.swiper-pagination-bullet-active { opacity: 1; background: #ff003c; width: 35px; border-radius: 6px; }

.swiper-button-next, .swiper-button-prev { color: #fff; background: #ff003c; width: 50px; height: 50px; border-radius: 50%; transition: all 0.3s ease; z-index: 20; }
.swiper-button-next:after, .swiper-button-prev:after { font-size: 18px; font-weight: 900; }
.swiper-button-next:hover, .swiper-button-prev:hover { background: #0b1a46; transform: scale(1.1); }

/* Tablet */
@media (max-width: 1024px) {
    .banner-container { padding: 0 40px; }
    .banner-content h1 { font-size: 3.2rem; }
    .banner-content p { font-size: 1.05rem; }
}

@media (max-width: 996px) {
    .banner-container { flex-direction: column; justify-content: flex-end; align-items: center; padding: 60px 30px 0; }
    .banner-content, .banner-image { flex: 0 0 auto; width: 100%; max-width: none; }
    .banner-content { align-self: center; margin-bottom: 30px; }
    .banner-image { align-self: flex-end; }
    .banner-content h1 { font-size: 3.5em; margin-bottom: 20px; }
    .banner-content p { font-size: 1.5em; margin: 20px 0 28px; }
    .banner-image { justify-content: center; height: auto; }
}

/* Mobile */
@media (max-width: 768px) {
    .banner-slide { align-items: flex-end; height: 100%; }
    .banner-container { flex-direction: column; justify-content: flex-end; align-items: center; padding: 60px 30px 0; }
    .bg-overlay { background: rgba(255, 255, 255, 0.92); }
    .banner-content { text-align: center; }
    .banner-btn { padding: 15px 40px; font-size: 14px; }
    .banner-image { justify-content: center; height: auto; }
    .banner-image img { max-height: 60vh; }
    .swiper-button-next, .swiper-button-prev { width: 40px; height: 40px; }
    .swiper-button-next:after, .swiper-button-prev:after { font-size: 16px; }
}

@media (max-width: 480px) {
    .banner-container { padding: 40px 20px 0; }
    .banner-content h1 { font-size: 2.5em; }
    .banner-content p { font-size: 1.1em; margin: 16px 0 24px; }
    .banner-btn { padding: 13px 35px; font-size: 13px; }
    .banner-image img { max-height: 50vh; }
}

/********** home page banner end ****************/



/************ Dashbord ***************/
.dashbord .profile-card { background: white; border-radius: 12px; padding: 2rem; margin-bottom: 2rem; box-shadow: 0 2px 8px rgba(0,0,0,0.08); }
.dashbord .profile-avatar { width: 120px; height: 120px; background: #e9ecef; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 3em; color: #6c757d; overflow: hidden; }
.dashbord .edit-btn { background-color: #dc3545; color: white; border: none; padding: 0.5em 1.5em; border-radius: 8px; font-weight: 500; transition: background-color 0.3s; display: flex;  gap: 10px; }
.dashbord .edit-btn:hover { background-color: #c82333; color: white; }

 /* Mobile and Tablet layout */
@media (max-width: 991px) {
    .dashbord .mobile-view { display: flex; flex-direction: column; align-items: center; text-align: center; }
}
.dashbord .menu-card { background: white; border-radius: 12px; padding: 1.5em; box-shadow: 0 2px 8px rgba(0,0,0,0.08); transition: transform 0.2s, box-shadow 0.2s; cursor: pointer; text-decoration: none; color: inherit; display: block; height: 100%; display: flex; flex-direction: row; align-items: center; justify-content: flex-start; gap: 15px; }
.dashbord .menu-card:hover { transform: translateY(-4px); box-shadow: 0 4px 16px rgba(0,0,0,0.12); text-decoration: none; color: inherit; }
.dashbord .menu-icon { width: 50px; height: 50px; background: #f8f9fa; border-radius: 10px; display: flex; align-items: center; justify-content: center; font-size: 1.5em; color: #495057; }
.dashbord .menu-title { font-size: 1.25em; font-weight: 600; margin-bottom: 0.5em; color: #212529; }
.dashbord .menu-subtitle { color: #6c757d; font-size: 0.95em; margin: 0; }
/************ Dashbord ***************/