/* =========================================================
   Starline Shop Responsive Styles
========================================================= */

/* =========================================================
   Shared header spacing
   Top strip → main header: 10px
   Main header/search → navigation: 8px
========================================================= */

.header-main-wrap {
	padding: 0 !important;
	margin: 0 !important;
}

.header-main {
	min-height: 0 !important;
	padding-top: 10px !important;
	padding-bottom: 8px !important;
	margin-top: 0 !important;
	margin-bottom: 0 !important;
}

.header-search,
.header-search form,
.header-search .woocommerce-product-search,
.header-search .search-form {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
	margin-top: 0 !important;
	margin-bottom: 0 !important;
}

.main-navigation-wrap,
.header-navigation {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
	margin-top: 0 !important;
	margin-bottom: 0 !important;
}

.site-header {
	padding-bottom: 0 !important;
	margin-bottom: 0 !important;
}

/* Remove header-to-hero gap only on the homepage. */
body.home #content,
body.home .site-content,
body.home #primary,
body.home main,
body.home .site-main,
body.home .front-page-main,
body.home .elementor-page-content,
body.home .starline-elementor-page .site-main {
	padding-top: 0 !important;
	margin-top: 0 !important;
}

body.home .elementor > .elementor-element:first-child,
body.home .elementor-section-wrap > .elementor-element:first-child,
body.home .elementor > .e-con:first-child,
body.home .elementor-widget-starline-home-hero,
body.home
	.elementor-widget-starline-home-hero
	> .elementor-widget-container,
body.home .starline-home-hero {
	padding-top: 0 !important;
	margin-top: 0 !important;
}

/* =========================================================
   Large tablet and small desktop
========================================================= */

@media (max-width: 1100px) {

	.starline-top-strip-inner {
		grid-template-columns: 240px minmax(0, 1fr);
	}

	.starline-hotline {
		font-size: 18px;
	}

	.header-main {
		grid-template-columns: 180px minmax(250px, 1fr) auto;
		column-gap: 20px;
		row-gap: 0;
	}

	.site-branding img,
	.site-branding .custom-logo {
		max-width: 170px;
	}

	.header-navigation {
		grid-template-columns: 245px minmax(0, 1fr) auto;
	}

	.category-dropdown {
		width: 245px;
	}

	.primary-menu > li > a {
		padding-right: 13px;
		padding-left: 13px;
	}

	.woocommerce ul.products {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

/* =========================================================
   Tablet
========================================================= */

@media (max-width: 991px) {

	.header-main {
		grid-template-columns: minmax(0, 1fr) auto;
		column-gap: 15px;
		row-gap: 8px;
		padding-top: 10px !important;
		padding-bottom: 8px !important;
	}

	.site-branding {
		grid-column: 1;
		grid-row: 1;
	}

	.header-actions {
		grid-column: 2;
		grid-row: 1;
	}

	.header-search {
		grid-column: 1 / -1;
		grid-row: 2;
	}

	.site-branding,
	.header-actions,
	.header-search {
		padding-top: 0;
		padding-bottom: 0;
		margin-top: 0;
		margin-bottom: 0;
	}

	.header-navigation {
		grid-template-columns: 235px minmax(0, 1fr);
	}

	.header-login-link {
		display: none;
	}

	.primary-menu > li > a {
		padding-right: 10px;
		padding-left: 10px;
		font-size: 13px;
	}

	.hero-inner {
		grid-template-columns: 1fr;
		gap: 35px;
	}

	.hero-placeholder {
		min-height: 320px;
	}

	.posts-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.footer-widgets {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.woocommerce ul.products {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

/* =========================================================
   Android and iPhone
========================================================= */

@media (max-width: 767px) {

	.starline-top-strip-inner {
		display: block;
		width: 100%;
	}

	.starline-hotline {
		display: none;
	}


	.header-main-wrap {
		padding: 0 !important;
		margin: 0 !important;
	}

	.header-main {
		grid-template-columns: minmax(0, 1fr) auto;
		column-gap: 12px;
		row-gap: 8px;
		min-height: 0 !important;
		padding-top: 10px !important;
		padding-bottom: 8px !important;
		margin: 0 auto !important;
	}

	.site-branding {
		grid-column: 1;
		grid-row: 1;
		padding: 0;
		margin: 0;
	}

	.site-branding img,
	.site-branding .custom-logo {
		max-width: 145px;
		max-height: 48px;
	}

	.site-title {
		font-size: 23px;
	}

	.header-actions {
		grid-column: 2;
		grid-row: 1;
		gap: 12px;
		padding: 0;
		margin: 0;
	}

	.header-track-order {
		display: none;
	}

	.menu-toggle {
		display: block;
	}

	.header-search {
		grid-column: 1 / -1;
		grid-row: 2;
		padding: 0 !important;
		margin: 0 !important;
	}

	.header-search form,
	.header-search .woocommerce-product-search,
	.header-search .search-form {
		padding: 0 !important;
		margin: 0 !important;
	}

	.header-search input[type="search"] {
		height: 40px;
		padding-right: 54px;
		font-size: 13px;
	}

	.header-search button,
	.header-search input[type="submit"] {
		width: 50px;
		height: 40px;
		padding: 0;
	}

	.main-navigation-wrap {
		position: relative;
		min-height: 46px;
		padding: 0 !important;
		margin: 0 !important;
		background: var(--starline-header-blue);
		box-shadow: none;
	}

	.header-navigation {
		position: relative;
		display: flex;
		align-items: stretch;
		width: 100%;
		min-height: 46px;
		padding: 0 !important;
		margin: 0 !important;
	}

	.header-category-menu {
		width: 100%;
		max-width: 245px;
	}

	.category-menu-button {
		height: 46px;
		padding: 0 14px;
		font-size: 13px;
	}

	/*
	 * The category drawer and its accordion are styled in main.css.
	 * Do not force every subcategory to remain visible here.
	 */
	.primary-navigation {
		position: absolute;
		z-index: 1300;
		top: 100%;
		right: 0;
		left: 0;
		display: none;
		padding: 0;
		background: #ffffff;
		border: 1px solid #e5e7eb;
		box-shadow: 0 15px 35px rgba(17, 24, 39, 0.16);
	}

	.primary-navigation.is-open {
		display: block;
	}

	.primary-menu {
		display: block;
		width: 100%;
		padding: 8px 0;
	}

	.primary-menu > li {
		display: block;
	}

	.primary-menu > li > a {
		display: block;
		padding: 11px 18px;
		color: #303030;
		border-bottom: 1px solid #f1f1f1;
		font-size: 14px;
	}

	.primary-menu > li > a:hover,
	.primary-menu > li.current-menu-item > a,
	.primary-menu > li.current-menu-ancestor > a {
		color: var(--starline-header-blue);
		background: #f4f7fc;
	}

	.primary-menu .sub-menu {
		position: static;
		display: block;
		min-width: 100%;
		padding: 0 0 0 15px;
		background: transparent;
		border: 0;
		box-shadow: none;
		opacity: 1;
		visibility: visible;
		transform: none;
	}

	.primary-menu .sub-menu a {
		padding: 9px 18px;
		font-size: 13px;
	}

	.header-login-link {
		display: none;
	}

	/*
	 * Keep normal inner pages at 40px.
	 * Homepage is reset to zero below.
	 */
	body:not(.woocommerce-checkout) .site-main {
		padding-top: 40px;
		padding-bottom: 40px;
	}

	body.home .site-main,
	body.home #primary,
	body.home #content,
	body.home .front-page-main,
	body.home .elementor-page-content {
		padding-top: 0 !important;
		margin-top: 0 !important;
	}

	.default-hero {
		padding: 55px 0;
	}

	.hero-content h1 {
		font-size: 38px;
	}

	.hero-content p {
		font-size: 16px;
	}

	.homepage-section {
		padding: 55px 0;
	}

	.posts-grid,
	.footer-widgets {
		grid-template-columns: 1fr;
	}

	.footer-widgets {
		gap: 25px;
	}

	.footer-bottom-inner {
		display: block;
		text-align: center;
	}

	.footer-bottom-inner p + p {
		margin-top: 5px;
	}

	.woocommerce ul.products {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 14px;
	}

	.woocommerce ul.products li.product .woocommerce-loop-product__title,
	.woocommerce ul.products li.product .price,
	.woocommerce ul.products li.product .button {
		margin-right: 12px;
		margin-left: 12px;
	}

	.woocommerce ul.products li.product .woocommerce-loop-product__title {
		font-size: 15px;
	}

	.woocommerce ul.products li.product .button {
		padding-right: 10px;
		padding-left: 10px;
		font-size: 13px;
	}

}

/* =========================================================
   Small Android and iPhone
========================================================= */

@media (max-width: 420px) {

	.starline-container {
		width: min(100% - 20px, 1200px);
	}

	.header-main {
		column-gap: 10px;
		row-gap: 8px;
		padding-top: 10px !important;
		padding-right: 10px;
		padding-bottom: 8px !important;
		padding-left: 10px;
	}

	.site-branding img,
	.site-branding .custom-logo {
		max-width: 125px;
	}

	.site-title {
		font-size: 20px;
	}

	.header-cart-link svg {
		width: 24px;
		height: 24px;
	}

	.category-menu-button {
		font-size: 12px;
	}

	.woocommerce ul.products {
		gap: 10px;
	}

	.hero-placeholder {
		min-height: 240px;
	}
}
/* =========================================================
   Compact Desktop / Laptop Header
========================================================= */

@media (min-width: 992px) {

	/* Remove extra white space around header */
	body .header-main-wrap {
		padding: 0 !important;
		margin: 0 !important;
	}

	body .header-main {
		min-height: 58px !important;
		height: auto !important;
		padding-top: 4px !important;
		padding-bottom: 4px !important;
		margin-top: 0 !important;
		margin-bottom: 0 !important;
		column-gap: 22px !important;
		row-gap: 0 !important;
	}

	/* Make logo slightly smaller */
	body .site-branding,
	body .site-branding .custom-logo-link {
		height: auto !important;
		padding: 0 !important;
		margin: 0 !important;
	}

	body .site-branding img,
	body .site-branding .custom-logo {
		width: auto !important;
		max-width: 165px !important;
		max-height: 46px !important;
		margin: 0 !important;
		object-fit: contain;
	}

	/* Compact search box */
	body .header-search,
	body .header-search form,
	body .header-search .woocommerce-product-search,
	body .header-search .search-form {
		padding: 0 !important;
		margin: 0 !important;
	}

	body .header-search input[type="search"] {
		height: 40px !important;
	}

	body .header-search button,
	body .header-search input[type="submit"] {
		height: 40px !important;
	}

	/* Remove action area extra spacing */
	body .header-actions {
		min-height: 40px !important;
		padding: 0 !important;
		margin: 0 !important;
	}

	body .header-track-order,
	body .header-cart-link {
		padding-top: 0 !important;
		padding-bottom: 0 !important;
		margin-top: 0 !important;
		margin-bottom: 0 !important;
		line-height: 1.2 !important;
	}

	/* Slightly reduce navigation height */
	body .header-navigation {
		min-height: 46px !important;
	}

	body .category-menu-button {
		height: 46px !important;
	}

	body .primary-menu > li > a,
	body .header-login-link {
		min-height: 46px !important;
	}
}
/* =========================================================
   Mobile Category Section Title
========================================================= */

@media (max-width: 767px) {

	.category-home-section .section-heading {
		margin-bottom: 14px !important;
	}

	.category-home-section .section-heading h2 {
		font-size: 22px !important;
		line-height: 1.25 !important;
	}
}

@media (max-width: 420px) {

	.category-home-section .section-heading h2 {
		font-size: 19px !important;
		line-height: 1.3 !important;
	}
}
/* =========================================================
   Mobile Category Drawer Above Marquee
========================================================= */

@media (max-width: 767px) {

	/*
	 * Category drawer open হলে marquee-কে নিচের layer-এ রাখবে
	 */
	body.starline-category-menu-open .starline-top-strip {
		z-index: 9990 !important;
	}

	/*
	 * Drawer-এর parent header-কে marquee-এর উপরে আনবে
	 */
	body.starline-category-menu-open .site-header {
		z-index: 100000 !important;
	}

	body.starline-category-menu-open .header-category-menu {
		z-index: 100001 !important;
	}

	/*
	 * Dark overlay
	 */
	body.starline-category-menu-open
	.header-category-menu[open]::before {
		z-index: 100001 !important;
	}

	/*
	 * White category drawer
	 */
	body.starline-category-menu-open
	.header-category-menu[open]
	> .category-dropdown {
		z-index: 100002 !important;
		top: 0 !important;
		padding-top: 60px !important;
	}

	/*
	 * Drawer title
	 */
	body.starline-category-menu-open
	.header-category-menu
	> .category-dropdown::before {
		z-index: 2 !important;
	}

	/*
	 * Close cross button
	 */
	body.starline-category-menu-open
	.header-category-menu[open]
	> .category-menu-button {
		z-index: 100003 !important;
		top: 8px !important;
	}
}
@media (max-width: 767px){

	.header-category-menu > .category-dropdown {
		background: #ffffff !important;
		opacity: 1;
	}


	.header-category-menu[open] > .category-dropdown {
		background: #ffffff !important;
		z-index: 99999;
	}


	.header-category-menu .category-menu-list {
		background: #ffffff;
	}


	.header-category-menu .category-menu-list li {
		background: #ffffff;
	}


	.header-category-menu .category-menu-list a {
		background: #ffffff;
		color: #202938;
	}

}
/*
|--------------------------------------------------------------------------
| Premium Shop Responsive Conflict Fix
|--------------------------------------------------------------------------
*/

/*
 * responsive.css loads after woocommerce.css.
 * These rules ensure that general WooCommerce styles do not override
 * the custom premium shop archive design.
 */

@media (max-width: 767px) {

	/*
	 * Preserve the shop archive spacing defined in woocommerce.css.
	 */
	body.post-type-archive-product .woocommerce-main,
	body.tax-product_cat .woocommerce-main,
	body.tax-product_tag .woocommerce-main,
	body.tax-product_attribute .woocommerce-main {
		padding-top: 24px !important;
		padding-bottom: 50px !important;
	}

	/*
	 * Remove the general 12px product-content margins.
	 */
	body.post-type-archive-product
	.starline-shop-products
	ul.products
	li.product
	.woocommerce-loop-product__title,

	body.tax-product_cat
	.starline-shop-products
	ul.products
	li.product
	.woocommerce-loop-product__title,

	body.tax-product_tag
	.starline-shop-products
	ul.products
	li.product
	.woocommerce-loop-product__title,

	body.tax-product_attribute
	.starline-shop-products
	ul.products
	li.product
	.woocommerce-loop-product__title,

	body.post-type-archive-product
	.starline-shop-products
	ul.products
	li.product
	.price,

	body.tax-product_cat
	.starline-shop-products
	ul.products
	li.product
	.price,

	body.tax-product_tag
	.starline-shop-products
	ul.products
	li.product
	.price,

	body.tax-product_attribute
	.starline-shop-products
	ul.products
	li.product
	.price {
		margin-right: 0;
		margin-left: 0;
	}

	/*
	 * Keep the compact mobile product-title size.
	 */
	body.post-type-archive-product
	.starline-shop-products
	ul.products
	li.product
	.woocommerce-loop-product__title,

	body.tax-product_cat
	.starline-shop-products
	ul.products
	li.product
	.woocommerce-loop-product__title,

	body.tax-product_tag
	.starline-shop-products
	ul.products
	li.product
	.woocommerce-loop-product__title,

	body.tax-product_attribute
	.starline-shop-products
	ul.products
	li.product
	.woocommerce-loop-product__title {
		min-height: 40px;
		font-size: 13px;
		line-height: 1.45;
	}

	/*
	 * Preserve the premium full-width button.
	 */
	body.post-type-archive-product
	.starline-shop-products
	ul.products
	li.product
	.button,

	body.tax-product_cat
	.starline-shop-products
	ul.products
	li.product
	.button,

	body.tax-product_tag
	.starline-shop-products
	ul.products
	li.product
	.button,

	body.tax-product_attribute
	.starline-shop-products
	ul.products
	li.product
	.button {
		width: 100%;
		margin-right: 0 !important;
		margin-left: 0 !important;
		padding: 9px 8px;
		font-size: 12px;
	}

}


@media (max-width: 420px) {

	/*
	 * One product per row on very small screens.
	 */
	body.post-type-archive-product
	.starline-shop-products
	ul.products,

	body.tax-product_cat
	.starline-shop-products
	ul.products,

	body.tax-product_tag
	.starline-shop-products
	ul.products,

	body.tax-product_attribute
	.starline-shop-products
	ul.products {
		grid-template-columns: 1fr !important;
		gap: 14px;
	}

}
/* =========================================================
   Header Controller Responsive Support
   Existing responsive rules above remain unchanged.
========================================================= */
@media (min-width: 992px) {
	.header-account-mobile {
		display: none;
	}
}

@media (min-width: 768px) and (max-width: 991px) {
	.header-account-desktop {
		display: none !important;
	}
}

@media (max-width: 767px) {
	.header-account-desktop {
		display: none !important;
	}

	.header-account-mobile {
		align-items: center;
		justify-content: center;
		min-width: 36px;
		min-height: 36px;
	}
}