/* ============================================================
   YUKI — Mobile Fixes v5
   Complete mobile overhaul — 1 column layout on phones
   ============================================================ */

html, body { overflow-x: hidden; max-width: 100vw; }

/* ── Banner ── */
.yk-banner-slide img { width:100%;height:auto;display:block; }
@media(max-width:767px) {
	.yk-banner-slide img { min-height:160px;max-height:240px;object-fit:cover; }
	.yk-banner-caption { max-width:85%;padding:0 10px; }
	.yk-banner-caption .yk-subtitle { font-size:10px;letter-spacing:1px;margin-bottom:3px; }
	.yk-banner-caption .yk-title { font-size:18px;line-height:1.2;margin:0 0 5px; }
	.yk-banner-caption .yk-desc { font-size:11px !important;line-height:1.4;margin-bottom:8px; }
	.yk-banner-btn { padding:6px 14px;font-size:12px; }
	.yk-banner-nav { width:28px;height:28px;font-size:12px; }
	.yk-banner-prev { left:6px; }
	.yk-banner-next { right:6px; }
	.yk-cap-left,.yk-cap-right { left:50%!important;right:auto!important;transform:translate(-50%,-50%)!important;text-align:center!important; }
}

/* ── Container ── */
@media(max-width:575px) {
	.container,.container-fluid { padding-left:14px!important;padding-right:14px!important; }
}

/* ── Mobile contact strip ── */
.yk-mob-contact {
	background:#f4eefb;
	border-bottom:1px solid #e8e0f5;
	padding:7px 0;
	display:block;
}
.yk-mob-contact-inner {
	display:flex;
	justify-content:center;
	align-items:center;
	gap:16px;
	flex-wrap:wrap;
}
.yk-mob-contact-item {
	display:flex;align-items:center;gap:5px;
	font-size:12px;color:#4b4560;text-decoration:none;
}
.yk-mob-contact-item i { color:#794ABA;font-size:11px; }

/* ── Mobile header ── */
.mobile-header-area {
	background:#fff !important;
	box-shadow:0 2px 10px rgba(56,38,92,.08) !important;
	position:sticky !important;
	top:0 !important;
	z-index:1050 !important;
	padding:0 !important;
}
.mobile-header-area .container { padding:0 14px !important; }
.mobile-header-area .menu-wrap {
	display:flex !important;
	align-items:center !important;
	justify-content:space-between !important;
	padding:10px 0 !important;
	gap:8px;
}
.mobile-header-area .header-left {
	flex:1 1 auto;
	min-width:0;
	max-width:calc(100% - 140px);
}
.mobile-header-area .brand-image {
	max-height:42px !important;
	width:auto !important;
	object-fit:contain;
	display:block;
}
.mobile-header-area .header-right {
	display:flex !important;
	align-items:center !important;
	gap:4px !important;
	flex-shrink:0;
}
.mobile-header-area .header-btn {
	display:inline-flex !important;
	align-items:center !important;
	justify-content:center !important;
	width:40px !important;
	height:40px !important;
	border-radius:50% !important;
	position:relative !important;
	background:transparent !important;
	color:#1a1a2e !important;
	transition:background .15s;
	border:none;
	padding:0;
}
.mobile-header-area .header-btn:hover { background:#f4eefb !important; }
.mobile-header-area .btn-icon,
.mobile-header-area .header-btn i { font-size:20px !important;color:#1a1a2e !important; }
.mobile-header-area .wishlist-btn .btn-icon,
.mobile-header-area .wishlist-btn i.fas.fa-heart { color:#e63946 !important; }
.mobile-header-area .count,
.mobile-header-area .counts {
	position:absolute;top:-3px;right:-3px;
	background:#794ABA !important;color:#fff !important;
	font-size:9px !important;font-weight:700;
	min-width:15px;height:15px;line-height:15px;
	border-radius:50%;text-align:center;padding:0 3px;
}
.menu-bar {
	background:none !important;border:none !important;
	font-size:22px !important;color:#1a1a2e !important;
	cursor:pointer;width:40px;height:40px;
	display:inline-flex;align-items:center;justify-content:center;
	border-radius:50%;transition:background .15s;padding:0;
}
.menu-bar:hover { background:#f4eefb !important; }

/* ── Mobile offcanvas menu ── */
.menu-offcanvas { max-width:280px !important; }
.menu-offcanvas .offcanvas-header {
	background:#f4eefb;
	border-bottom:1px solid #e8e0f5;
	padding:14px 16px;
	display:flex;
	align-items:center;
	justify-content:space-between;
}
.menu-offcanvas .offcanvas-header .brand-image { max-height:38px;width:auto; }
.menu-offcanvas .menu-search-form {
	padding:12px 14px;
	border-bottom:1px solid #f0eaf8;
}
.menu-offcanvas .menu-search-form input.form-control {
	border:1.5px solid #e8e0f5 !important;
	border-radius:8px !important;
	font-size:13px;
	padding:9px 12px !important;
	background:#fff !important;
}
.menu-offcanvas .menu-search-form input.form-control:focus {
	border-color:#794ABA !important;
	box-shadow:0 0 0 3px rgba(121,74,186,.1) !important;
	outline:none !important;
}
.menu-offcanvas .menu-search-form .search-btn,
.menu-offcanvas .menu-search-form button {
	background:#794ABA !important;
	color:#fff !important;
	border:none !important;
	border-radius:0 8px 8px 0 !important;
	padding:0 14px !important;
	font-size:14px;
}
.menu-offcanvas .menu-search-form .form-select {
	border:1.5px solid #e8e0f5 !important;
	border-radius:8px !important;
	font-size:12px;
	margin-bottom:8px;
	padding:8px 10px !important;
}
/* Hide the category dropdown in mobile menu - saves space */
.menu-offcanvas .menu-search-form .form-select { display:none; }

.mobile-menu-area .menu-list {
	list-style:none;
	padding:0;margin:0;
}
.mobile-menu-area .menu-item {
	border-bottom:1px solid #f4eefb;
}
.mobile-menu-area .menu-link {
	display:flex !important;
	align-items:center !important;
	justify-content:space-between !important;
	padding:14px 16px !important;
	font-size:14px !important;
	font-weight:600 !important;
	color:#1a1a2e !important;
	text-decoration:none !important;
	transition:background .15s,color .15s;
}
.mobile-menu-area .menu-link:hover { background:#f4eefb;color:#794ABA !important; }
.mobile-menu-area .sub-menu {
	list-style:none;padding:0;margin:0;
	background:#faf8ff;
	display:none;
}
.mobile-menu-area .sub-menu-item { border-top:1px solid #f0eaf8; }
.mobile-menu-area .sub-menu-link {
	display:block;
	padding:11px 28px;
	font-size:13px;
	color:#4b4560 !important;
	text-decoration:none !important;
}
.mobile-menu-area .sub-menu-link:hover { color:#794ABA !important; }

/* ── ALL SECTIONS: 1 column on mobile ── */
@media(max-width:575px) {

	/* Product grid */
	.product-list .row > [class*="col-"],
	.yk-home-grid > [class*="col-"],
	.row.g-3 > .col-6,
	.row.g-3 > .col-sm-6,
	.row.g-3 > .col-md-4,
	.row.g-3 > .col-lg-3 {
		flex: 0 0 100% !important;
		max-width: 100% !important;
		width: 100% !important;
	}

	/* But keep 2-col for products on phones 375px+ */
	@media(min-width:375px) {
		.product-list .row > .col-6,
		.row.g-3 > .col-6 {
			flex: 0 0 50% !important;
			max-width: 50% !important;
		}
	}

	/* Categories — ALWAYS 1 column on mobile */
	.yk-cat-grid,
	#ykCatGrid {
		grid-template-columns: 1fr !important;
		gap: 12px !important;
	}

	/* Featured/trending products — 1 column */
	.yk-prod-grid {
		grid-template-columns: 1fr !important;
		gap: 14px !important;
	}

	/* Home sections */
	.yk-why-grid,
	.yk-trust-bar { 
		grid-template-columns: 1fr !important;
		flex-direction: column !important;
	}

	/* Testimonials — 1 column */
	.yk-tslide {
		flex: 0 0 100% !important;
		max-width: 100% !important;
	}

	/* Section padding */
	.yk-categories-section,
	section,
	.yk-home-section { padding: 32px 0 !important; }

	/* Section headings */
	.yk-cat-title,
	.yk-section-title,
	.yk-hdr-title { font-size: 22px !important; }

	/* Category card heights */
	.yk-cat-overlap { height: 180px !important; }
	.yk-cat-badge .yk-ci { height: 160px !important; }
	.yk-cat-side { height: 100px !important; }

	/* Single product card */
	.single-grid-product { padding: 0 !important; }
	.product-info { padding: 10px 12px 12px !important; }
	.product-name { font-size: 13px !important; min-height: 34px !important; }
	.product-price .price { font-size: 15px !important; }
	.add-cart { font-size: 11px !important; }

	/* Cart page table scroll */
	#mycartTable { font-size: 13px; }
	#mycartTable td { padding: 10px 8px !important; }

	/* Checkout */
	.checkout .cart-summary { margin-top: 24px; }

	/* Footer */
	.yk-footer { padding: 36px 0 0 !important; margin-top: 40px !important; }
	.yk-footer .row > [class*="col-"] { margin-bottom: 24px; }

	/* Pagination */
	.yk-pagination-wrap ul { gap: 4px !important; }
	.yk-pagination-wrap a { min-width: 34px !important; height: 34px !important; font-size: 13px !important; }
}

/* ── Desktop: hide mobile header ── */
@media(min-width:992px) {
	.mobile-header-area { display:none !important; }
	.yk-mob-contact { display:none !important; }
}

/* ── Mobile: hide desktop header ── */
@media(max-width:991px) {
	.header-area.d-none.d-lg-block { display:none !important; }
}

/* ── Wishlist heart desktop ── */
.header-area .wishlist-btn .btn-icon,
.header-area .wishlist-btn i.fas.fa-heart { color:#e63946 !important;font-size:22px !important; }