/* Responsive mobile-first rules */
@media (max-width: 1199px) {
	.sj-grid-6,
	ul.products.columns-6 {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
	.sj-category-tiles-track {
		grid-template-columns: repeat(6, minmax(0, 1fr));
	}
	.sj-hero-title {
		font-size: 36px;
	}
}

@media (max-width: 991px) {
	body {
		padding-bottom: calc(68px + env(safe-area-inset-bottom, 0px));
	}

	/* Hide desktop-only navigation bar and permanently expanded homepage category sidebar on mobile */
	.sj-top-trust-strip,
	.sj-header-navbar,
	.sj-home-sidebar-col,
	.sj-action-support,
	.sj-action-account,
	.sj-action-wishlist,
	.sj-cat-scroll-next,
	.sj-hide-on-mobile,
	.sj-cat-tile-desktop-only,
	.sj-hero-mini-badges,
	.sj-countdown-label,
	.sj-trust-title-desktop,
	.sj-trust-subtitle,
	.sj-action-cart .sj-action-label {
		display: none !important;
	}

	/* Mobile Header Layout matching Reference Screenshot:
	 * Row 1: Hamburger Menu (left) | Centered Brand Logo & Tagline | Cart with Red Badge (right)
	 * Row 2: Full-width Product Search Bar with Red Search Button
	 */
	.sj-header-main {
		padding: 10px 0 12px;
	}

	.sj-header-main-inner {
		display: grid !important;
		grid-template-columns: 42px minmax(0, 1fr) 44px;
		grid-template-areas:
			"menu logo cart"
			"search search search";
		gap: 10px 8px;
		align-items: center;
	}

	.sj-mobile-menu-toggle {
		display: inline-flex !important;
		align-items: center;
		justify-content: center;
		grid-area: menu;
		width: 40px;
		height: 40px;
		padding: 0;
		color: var(--sj-navy);
	}

	.sj-site-branding {
		grid-area: logo;
		display: flex;
		justify-content: center;
		align-items: center;
		min-width: 0;
	}

	.sj-logo-img,
	.sj-site-branding img.custom-logo {
		height: 40px !important;
		max-height: 40px !important;
		width: auto !important;
		max-width: 195px !important;
		object-fit: contain;
	}

	.sj-header-actions {
		grid-area: cart;
		display: flex;
		justify-content: flex-end;
		align-items: center;
		gap: 0;
	}

	.sj-action-cart {
		padding: 6px;
	}

	.sj-header-search-wrap {
		grid-area: search;
		max-width: 100% !important;
		width: 100% !important;
		flex: none;
	}

	.sj-product-search-form {
		height: 42px;
		border-radius: 8px;
	}

	.sj-search-field {
		padding: 8px 12px;
		font-size: 13.5px;
	}

	.sj-search-submit-btn {
		width: 46px;
		height: 42px;
	}

	/* Top Fold becomes single column on mobile */
	.sj-homepage-main {
		padding-top: 10px;
	}

	.sj-home-top-fold {
		grid-template-columns: 1fr !important;
		gap: 12px;
		margin-bottom: 16px;
	}

	/* Mobile Hero Banner matching Reference Screenshot */
	.sj-hero-carousel {
		min-height: 190px;
		border-radius: 14px;
	}

	.sj-hero-slide.is-active {
		grid-template-columns: 53% 47% !important;
		padding: 16px 14px 26px !important;
		min-height: 190px;
		gap: 6px;
	}

	.sj-hero-kicker {
		font-size: 14.5px;
		margin-bottom: 1px;
	}

	.sj-hero-title {
		font-size: 23px;
		line-height: 1.1;
		margin-bottom: 4px;
	}

	.sj-hero-subtitle {
		font-size: 11.5px;
		margin-bottom: 10px;
		line-height: 1.3;
	}

	.sj-hero-cta-btn {
		font-size: 11.5px;
		padding: 7px 13px;
	}

	.sj-hero-collage-img {
		max-height: 140px;
	}

	.sj-hero-dots {
		left: 50%;
		bottom: 8px;
	}

	/* Mobile 4-Column Trust Highlights Row matching Reference Screenshot */
	.sj-trust-grid {
		grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
		gap: 8px;
	}

	.sj-trust-card {
		flex-direction: column;
		justify-content: center;
		text-align: center;
		padding: 10px 4px;
		gap: 6px;
	}

	.sj-trust-icon-circle {
		width: 34px;
		height: 34px;
	}

	.sj-trust-icon-circle svg {
		width: 18px;
		height: 18px;
	}

	.sj-trust-title-mobile {
		display: block !important;
		font-size: 11px;
		font-weight: 700;
		color: var(--sj-navy);
		line-height: 1.2;
		white-space: normal;
	}

	/* Mobile 2x4 Category Tiles Grid (7 categories + "আরও" tile) */
	.sj-cat-tile-mobile-more {
		display: flex !important;
	}

	.sj-category-tiles-track {
		grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
		gap: 12px 8px;
	}

	.sj-cat-tile-circle {
		width: 64px;
		height: 64px;
		padding: 5px;
	}

	.sj-cat-more-circle {
		background-color: #EEF2F8;
		color: var(--sj-navy);
		font-size: 18px;
		font-weight: 900;
	}

	.sj-cat-tile-label {
		font-size: 11.5px;
	}

	
	/* Hide desktop-only 3 Promo Banners on mobile viewports so Flash Sale appears directly below Circular Category Tiles matching Reference Mobile Design */
	.sj-promo-banners-section {
		display: none !important;
	}

	/* Promo Banners stack cleanly if enabled */
	.sj-promo-banners-grid {
		grid-template-columns: 1fr !important;
		gap: 12px;
	}

	.sj-promo-banner-card {
		padding: 14px 16px;
		min-height: 126px;
	}

	.sj-promo-card-title {
		font-size: 18px;
	}

	.sj-promo-card-media {
		width: 130px;
	}

	.sj-promo-card-media img {
		max-height: 100px;
	}

	/* Flash Sale Header on Mobile */
	.sj-section-header {
		flex-wrap: wrap;
		gap: 8px;
		margin-bottom: 12px;
	}

	.sj-section-title {
		font-size: 18px;
	}

	.sj-flash-header-right {
		gap: 8px;
	}

	.sj-cd-box {
		min-width: 26px;
		height: 24px;
		font-size: 12px;
		padding: 0 4px;
	}

	.sj-view-all-pill {
		font-size: 12px;
		padding: 4px 10px;
	}

	/* 2 Product Cards per Row on Mobile (320px - 768px) */
	.sj-grid-6,
	.sj-grid-4,
	ul.products,
	ul.products.columns-6,
	ul.products.columns-4 {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
		gap: 10px !important;
	}

	.sj-product-card {
		padding: 10px;
	}

	.sj-product-card-title {
		font-size: 12.5px;
		min-height: 34px;
	}

	.sj-price-current {
		font-size: 15px;
	}

	.sj-price-old {
		font-size: 11px;
	}

	.sj-add-to-cart-btn {
		font-size: 12px;
		padding: 8px 6px;
	}

	/* Shop & Single Product Stack on Mobile */
	.sj-shop-layout,
	.sj-single-product-layout,
	.sj-contact-grid,
	.sj-footer-grid {
		grid-template-columns: 1fr !important;
		gap: 16px;
	}

	.sj-newsletter-banner {
		padding: 20px 16px;
	}

	.sj-newsletter-form {
		flex-direction: column;
		width: 100%;
	}

	/* Fixed Mobile Bottom Navigation Bar */
	.sj-mobile-bottom-nav {
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		height: calc(62px + env(safe-area-inset-bottom, 0px));
		padding-bottom: env(safe-area-inset-bottom, 0px);
		background-color: #FFFFFF;
		border-top: 1px solid var(--sj-border);
		box-shadow: 0 -4px 16px rgba(11, 34, 76, 0.08);
		display: grid !important;
		grid-template-columns: repeat(5, 1fr);
		align-items: center;
		z-index: 1800;
	}

	.sj-mob-nav-item {
		background: transparent;
		border: none;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 3px;
		color: #475569;
		font-family: var(--sj-font-sans);
		font-size: 11px;
		font-weight: 600;
		padding: 6px 2px;
		cursor: pointer;
		text-decoration: none;
	}

	.sj-mob-nav-item.is-active,
	.sj-mob-nav-item:hover {
		color: var(--sj-navy);
	}

	.sj-mob-nav-icon {
		position: relative;
		display: inline-flex;
	}
}

/* Smallest Mobile Viewports (320px - 375px) */
@media (max-width: 375px) {
	.sj-container {
		padding-left: 10px;
		padding-right: 10px;
	}

	.sj-logo-img,
	.sj-site-branding img.custom-logo {
		height: 36px !important;
		max-height: 36px !important;
		max-width: 165px !important;
	}

	.sj-hero-slide.is-active {
		grid-template-columns: 55% 45% !important;
		padding: 12px 10px 24px !important;
	}

	.sj-hero-title {
		font-size: 19px;
	}

	.sj-hero-subtitle {
		font-size: 10.5px;
	}

	.sj-cat-tile-circle {
		width: 54px;
		height: 54px;
	}

	.sj-cat-tile-label {
		font-size: 10.5px;
	}

	.sj-product-card {
		padding: 8px;
	}

	.sj-price-current {
		font-size: 14px;
	}

	.sj-add-to-cart-btn {
		font-size: 11.5px;
		padding: 7px 4px;
	}
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}
