/**
 * Mishtam — mobile & tablet responsive polish
 */

/* ===== TABLET (768px – 1024px) ===== */
@media (max-width: 1024px) and (min-width: 768px) {
	.ms-showcase__scroll {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: var(--space-4);
		overflow: visible;
	}

	.ms-showcase__card {
		flex: none;
		scroll-snap-align: none;
	}

	.ms-showcase__head {
		align-items: flex-end;
	}

	/* Home hero — more height + air so the glass card isn't cramped */
	.ms-hero--banner,
	.ms-hero--slider {
		min-height: clamp(480px, 52vh, 560px);
	}

	.ms-hero__content {
		padding: var(--space-7) 0;
	}

	.ms-hero__glass {
		max-width: 480px;
		padding: var(--space-5) var(--space-5);
	}

	.ms-hero--banner .ms-hero__title {
		font-size: clamp(1.75rem, 3.4vw, 2.35rem);
		margin-bottom: var(--space-3);
	}

	.ms-hero--banner .ms-hero__subtitle {
		font-size: 1rem;
		line-height: 1.6;
		margin-bottom: var(--space-4);
	}

	.ms-hero__actions {
		gap: var(--space-3);
	}

	.ms-cat-nav__wrap {
		gap: 0;
	}

	.ms-cat-nav__wrap.is-scrollable .ms-cat-nav__arrow {
		position: absolute;
		top: 38px;
		z-index: 6;
		width: 34px;
		height: 34px;
		min-width: 34px;
		max-width: 34px;
		min-height: 34px;
	}

	.ms-cat-nav__arrow--prev {
		left: 0;
	}

	.ms-cat-nav__arrow--next {
		right: 0;
	}

	.ms-cat-nav__grid {
		gap: var(--space-4);
	}

	.ms-promo-duo,
	.ms-promo-cards {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 900px) and (min-width: 768px) {
	.ms-showcase__scroll {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* ===== MOBILE (≤767px) ===== */
@media (max-width: 767px) {
	/* Hero */
	.ms-hero--banner,
	.ms-hero--slider {
		min-height: min(72vh, 520px);
	}

	.ms-hero--banner .ms-hero__title {
		font-size: clamp(1.5rem, 6.5vw, 2rem);
		line-height: 1.2;
	}

	.ms-hero--banner .ms-hero__subtitle {
		font-size: 0.9375rem;
		line-height: 1.55;
		margin-bottom: var(--space-3);
	}

	.ms-hero--banner .ms-hero__eyebrow {
		font-size: 10px;
		margin-bottom: var(--space-2);
	}

	.ms-hero__actions {
		gap: var(--space-2);
	}

	.ms-hero__actions .ms-btn {
		min-height: 44px;
		font-size: 0.875rem;
		padding: 10px 16px;
	}

	/* Category nav */
	.ms-cat-nav {
		padding: var(--space-3) 0;
	}

	/* Showcase sections */
	.ms-showcase {
		padding: var(--ms-section-y) 0;
	}

	.ms-showcase__head {
		display: grid;
		grid-template-columns: 1fr auto;
		align-items: center;
		gap: var(--space-1) var(--space-3);
		margin-bottom: var(--space-3);
	}

	.ms-showcase__titles {
		display: contents;
	}

	.ms-showcase__title {
		grid-column: 1;
		font-size: clamp(1.375rem, 5.5vw, 1.75rem);
	}

	.ms-showcase__view-all {
		grid-column: 2;
		grid-row: 1;
		align-self: center;
		font-size: 13px;
	}

	.ms-showcase__subtitle {
		grid-column: 1 / -1;
		margin-top: 0;
		font-size: 0.9375rem;
	}

	.ms-showcase__chips {
		display: flex;
		flex-wrap: nowrap;
		overflow-x: auto;
		gap: var(--space-2);
		margin-bottom: var(--space-3);
		padding-bottom: var(--space-1);
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}

	.ms-showcase__chips::-webkit-scrollbar {
		display: none;
	}

	.ms-showcase__chip {
		flex-shrink: 0;
		font-size: 12px;
		padding: 6px 12px;
	}

	.ms-showcase__scroll {
		display: flex;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		gap: var(--space-3);
		margin-inline: calc(-1 * var(--ms-container-x));
		padding-inline: var(--ms-container-x);
		padding-bottom: var(--space-2);
		scroll-padding-inline: var(--ms-container-x);
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}

	.ms-showcase__scroll::-webkit-scrollbar {
		display: none;
	}

	.ms-showcase__card {
		flex: 0 0 min(200px, 76vw);
		scroll-snap-align: start;
	}

	.ms-showcase__card-body {
		padding: 8px 10px 10px;
	}

	.ms-showcase__card-title {
		font-size: 0.875rem;
	}

	.ms-showcase__card-price {
		font-size: 0.9375rem;
	}

	/* Bestsellers header */
	.ms-bestsellers__head {
		display: grid;
		grid-template-columns: 1fr auto;
		align-items: center;
		gap: var(--space-1) var(--space-3);
		margin-bottom: var(--space-4);
	}

	.ms-bestsellers__titles {
		display: contents;
	}

	.ms-bestsellers__eyebrow {
		grid-column: 1 / -1;
		margin-bottom: 0;
	}

	.ms-bestsellers__title {
		grid-column: 1;
		font-size: clamp(1.375rem, 5.5vw, 1.75rem);
		margin-bottom: 0;
	}

	.ms-bestsellers__view-all {
		grid-column: 2;
		grid-row: 2;
		align-self: center;
		padding-bottom: 0;
		font-size: 13px;
	}

	.ms-bestsellers__intro {
		grid-column: 1 / -1;
		font-size: 0.9375rem;
		max-width: none;
		margin-top: var(--space-1);
	}

	/* Occasions */
	.ms-occasions__grid {
		gap: var(--space-2);
	}

	.ms-occasions__card {
		padding: var(--space-3) var(--space-2);
	}

	.ms-occasions__emoji {
		font-size: 24px;
	}

	.ms-occasions__label {
		font-size: 12px;
	}

	/* Promo zones */
	.ms-promo-zone {
		padding: var(--space-3) 0 var(--space-4);
	}

	/* Category nav arrows — compact overlay circles */
	.ms-cat-nav__wrap {
		gap: 0;
	}

	.ms-cat-nav__wrap.is-scrollable .ms-cat-nav__arrow {
		position: absolute;
		top: 34px;
		z-index: 6;
		display: inline-flex;
		width: 30px;
		height: 30px;
		min-width: 30px;
		max-width: 30px;
		min-height: 30px;
		box-shadow: 0 2px 10px rgba(15, 23, 42, 0.14);
	}

	.ms-cat-nav__arrow--prev {
		left: 0;
	}

	.ms-cat-nav__arrow--next {
		right: 0;
	}

	.ms-cat-nav__arrow svg {
		width: 14px;
		height: 14px;
	}

	/* Topbar */
	.ms-topbar__msg {
		font-size: 10px;
		line-height: 1.4;
	}
}

/* ===== SMALL MOBILE (≤480px) ===== */
@media (max-width: 480px) {
	.ms-header__actions {
		gap: 6px;
	}

	.ms-header__icon-btn {
		width: 40px;
		height: 40px;
	}

	.ms-header__logo-img,
	.ms-header__logo .ms-brand-logo {
		height: 42px;
		max-width: min(180px, 52vw);
	}

	.mishtam-theme.woocommerce .ms-header__logo .ms-brand-logo,
	.mishtam-theme.woocommerce-page .ms-header__logo .ms-brand-logo {
		height: 42px !important;
		max-width: min(180px, 52vw) !important;
	}

	.ms-showcase__card {
		flex: 0 0 min(180px, 82vw);
	}

	.ms-hero--banner,
	.ms-hero--slider {
		min-height: min(68vh, 480px);
	}

	.ms-cat-nav__item {
		flex: 0 0 72px;
		width: 72px;
	}

	.ms-cat-nav__thumb {
		width: 68px;
		height: 68px;
	}
}

/* ===== TOUCH — disable hover lift on coarse pointers ===== */
@media (hover: none) and (pointer: coarse) {
	.ms-showcase__card:hover,
	.ms-bestseller-card:hover,
	.ms-occasions__card:hover,
	.ms-cat-nav__item:hover .ms-cat-nav__thumb {
		transform: none;
		box-shadow: var(--ms-shadow-card);
	}
}
