/* ═══════════════════════════════════════════════════════════════
   Souq Aarsal v4.3.2 — Bacola-style grocery polish (RTL-first)
   ═══════════════════════════════════════════════════════════════ */

:root {
	--sa-emerald: #10b981;
	--sa-emerald-dark: #059669;
	--sa-emerald-deep: #047857;
	--sa-emerald-light: #d1fae5;
	--sa-emerald-glow: rgba(16, 185, 129, 0.35);
	--sa-gold: #fbbf24;
	--sa-sale: #ef4444;
	--sa-sale-soft: #fef2f2;
	--sa-bg: #eef2f7;
	--sa-bg-warm: #faf8f5;
	--sa-surface: #ffffff;
	--sa-text: #0f172a;
	--sa-muted: #64748b;
	--sa-border: rgba(15, 23, 42, 0.08);
	--sa-radius: 16px;
	--sa-radius-sm: 10px;
	--sa-shadow-card: 0 4px 20px rgba(15, 23, 42, 0.07);
	--sa-shadow-hover: 0 16px 40px rgba(15, 23, 42, 0.12);
}

body {
	background: var(--sa-bg);
	font-size: 14px;
}

/* ── Global search (header + shop) ── */
.souq-search {
	width: 100%;
	min-width: 0;
}
.souq-search-form {
	display: flex !important;
	align-items: stretch;
	width: 100%;
	flex-direction: row;
	background: var(--sa-bg);
	border: 1.5px solid var(--sa-border);
	border-radius: 12px;
	overflow: hidden;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.souq-search-form:focus-within {
	border-color: var(--sa-emerald);
	box-shadow: 0 0 0 3px var(--sa-emerald-glow);
}
.souq-search-field {
	flex: 1 1 auto;
	min-width: 0;
	width: 100%;
	border: none;
	background: transparent;
	padding: 0.72rem 1rem;
	font-family: inherit;
	font-size: 0.9rem;
	outline: none;
}
.souq-search-submit {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--sa-emerald);
	color: #fff;
	border: none;
	padding: 0 1rem;
	cursor: pointer;
}
.souq-search-submit:hover {
	background: var(--sa-emerald-dark);
}

/* ── Compact header ── */
.sa-header__top {
	font-size: 0.72rem;
}
.sa-header__top-inner {
	padding: 0.35rem 0;
}
.sa-header__main {
	padding: 0.65rem 0;
}
.sa-header__main-inner {
	grid-template-columns: minmax(120px, 180px) 1fr auto;
	gap: 1rem;
}
.site-title {
	font-size: 1.35rem;
}
/* Logo sizing handled in modern-2026.css */
.sa-header__top {
	display: block;
}
@media (max-width: 768px) {
	.sa-header__top {
		display: none;
	}
	.sa-header__main-inner {
		display: grid;
		grid-template-columns: 1fr auto;
		grid-template-areas:
			"brand actions"
			"search search";
		gap: 0.65rem 0.75rem;
		align-items: center;
	}
	.site-branding {
		grid-area: brand;
	}
	.sa-header__search {
		grid-area: search;
		display: block !important;
		width: 100%;
	}
	.sa-header__actions {
		grid-area: actions;
		gap: 0.45rem;
	}
	.sa-header__wa {
		width: 38px;
		height: 38px;
	}

	/* Desktop menu hidden — burger only */
	.sa-header__nav-area {
		display: none;
	}

	.sa-header__burger {
		display: flex;
	}
}

/* Nav tabs — roomy spacing */
.sa-nav {
	border-block-end: none;
}

.sa-nav .container {
	padding-block: 0.5rem;
}

.primary-menu {
	gap: 0.5rem;
	padding: 0.75rem 0;
	border-bottom: none;
}

.primary-menu a {
	border-radius: 10px;
	padding: 0.85rem 1.75rem;
	font-size: 0.92rem;
	border-bottom: none;
	margin-bottom: 0;
	background: transparent;
	letter-spacing: 0.01em;
}

.primary-menu a:hover,
.primary-menu .current-menu-item > a,
.primary-menu .current_page_item > a {
	color: var(--sa-emerald);
	background: rgba(16, 185, 129, 0.08);
	border-bottom-color: transparent;
}

.sa-header__nav-area {
	padding-block: 0.15rem;
}

/* Category chips — colorful */
.souq-cat-strip {
	background: linear-gradient(180deg, var(--sa-bg-warm), var(--sa-surface));
}
.souq-cat-strip__item:hover {
	background: var(--sa-emerald);
	color: #fff;
	border-color: var(--sa-emerald);
	transform: translateY(-2px);
	box-shadow: 0 6px 18px var(--sa-emerald-glow);
}

/* ── Trust bar color ── */
.souq-trust {
	padding: 0.65rem 0;
}
.souq-trust__item {
	padding: 0.55rem 0.65rem;
	background: var(--sa-surface);
	border: 1px solid var(--sa-border);
}

/* ── Sections ── */
.souq-section {
	padding: 2rem 0;
}
.souq-section:nth-child(even) {
	background: var(--sa-surface);
}

/* ── Category cards — colorful vertical cards ── */
.souq-category-grid {
	grid-template-columns: repeat(3, 1fr);
	gap: 1rem;
}
.souq-category-card {
	padding: 1.25rem 1rem;
	border-radius: var(--sa-radius);
	box-shadow: var(--sa-shadow-card);
	flex-direction: column;
	text-align: center;
	align-items: center;
	gap: 0.65rem;
	border: 1px solid var(--sa-border);
}
.souq-category-card__visual {
	width: 72px;
	height: 72px;
	min-width: 72px;
	border-radius: 50%;
	background: linear-gradient(135deg, var(--cat-accent, var(--sa-emerald)), transparent 130%);
}
.souq-category-card__emoji {
	font-size: 2rem;
}
.souq-category-card__name {
	font-size: 0.88rem;
	font-weight: 700;
}
.souq-category-card__cta {
	margin-inline-start: 0;
	font-size: 0.75rem;
	color: var(--sa-emerald);
}
.souq-category-card:hover {
	transform: translateY(-6px);
	box-shadow: var(--sa-shadow-hover);
	border-color: var(--sa-emerald);
}

/* Mobile category rail */
@media (max-width: 768px) {
	.souq-category-grid {
		display: flex;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		gap: 0.65rem;
		padding-bottom: 0.35rem;
		scrollbar-width: none;
	}
	.souq-category-grid::-webkit-scrollbar {
		display: none;
	}
	.souq-category-card {
		flex: 0 0 72%;
		max-width: 280px;
		scroll-snap-align: start;
		flex-direction: column;
		text-align: center;
	}
	.souq-category-card__cta {
		margin-inline-start: 0;
	}
}

/* ── Product cards — classic grocery (centered, one price) ── */
.souq-product-grid,
.woocommerce ul.products {
	gap: 1.15rem;
}
.souq-product-card__inner {
	border-radius: var(--sa-radius);
	border: 1px solid var(--sa-border);
	box-shadow: var(--sa-shadow-card);
	overflow: hidden;
}
.souq-product-card__inner:hover {
	border-color: rgba(16, 185, 129, 0.35);
	box-shadow: var(--sa-shadow-hover);
}
.souq-product-card__media {
	padding: 1rem;
	background: linear-gradient(180deg, #f8fafc, #fff);
	height: 168px;
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
}
.souq-product-card__image-link img,
.souq-product-card__image-link .souq-product-card__fallback-img,
.souq-product-card__image-link .souq-placeholder-thumb {
	max-height: 140px;
	width: auto;
	height: auto;
	margin: 0 auto;
	object-fit: contain;
}
.souq-product-card__body {
	padding: 0.85rem 1rem 1.1rem;
	text-align: center;
}
.souq-product-card__title {
	font-size: 0.88rem;
	font-weight: 600;
	min-height: 2.6em;
	line-height: 1.5;
}
.souq-product-card__stock {
	font-size: 0.68rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	background: transparent;
	padding: 0;
	color: var(--sa-emerald);
}
.souq-product-card__stock--out {
	color: var(--sa-sale);
}
.souq-product-card__price {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 0.15rem;
	margin: 0.45rem 0 0.75rem;
	font-size: 1rem;
	line-height: 1.3;
}
.souq-price-current {
	font-weight: 800;
	color: var(--sa-emerald-deep);
	font-size: 1.05rem;
}
.souq-price-current .woocommerce-Price-currencySymbol {
	font-size: 0.78em;
}
.souq-price-was {
	font-size: 0.78rem;
	font-weight: 500;
	color: var(--sa-muted);
	text-decoration: line-through;
}
.souq-product-card__price .amount {
	color: inherit;
	font-weight: inherit;
}
.souq-product-card__actions {
	display: block;
	margin-top: auto;
}
.souq-product-card__actions .souq-qty-wrap {
	display: none !important;
}
.btn--cart {
	width: 100%;
	padding: 0.65rem 0.85rem;
	font-size: 0.85rem;
	border-radius: 999px;
}

/* ── Shop page ── */
.souq-shop-main {
	padding: 1rem 0 2.5rem;
}
.souq-shop-header {
	padding: 1rem 1.15rem;
	border-radius: var(--sa-radius);
	margin-bottom: 1rem;
	border-top: 3px solid var(--sa-emerald);
	background: linear-gradient(180deg, #fff, var(--sa-bg-warm));
}
.souq-shop-header__top {
	margin-bottom: 0.85rem;
	padding-bottom: 0.75rem;
}
.souq-shop-title {
	font-size: 1.45rem;
	margin-bottom: 0.15rem;
}
.souq-shop-meta {
	font-size: 0.8rem;
}
.souq-shop-controls {
	margin-bottom: 0.85rem;
}
.souq-shop-controls__search {
	min-width: 0;
	width: 100%;
}
.souq-shop-results {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 0.5rem;
}
.woocommerce-result-count {
	font-size: 0.82rem;
	color: var(--sa-muted);
}

/* Filter chips desktop */
.souq-shop-filters {
	margin-top: 0.25rem;
}
.souq-filter-pill {
	background: var(--sa-surface);
	border-color: var(--sa-border);
	color: var(--sa-text);
	box-shadow: var(--sa-shadow-card);
}
.souq-filter-pill.is-active {
	background: linear-gradient(135deg, var(--sa-emerald), var(--sa-emerald-dark));
	border-color: var(--sa-emerald);
	color: #fff;
	box-shadow: 0 4px 14px var(--sa-emerald-glow);
}

/* Mobile filter bottom sheet */
@media (max-width: 900px) {
	.souq-filter-toggle {
		display: inline-flex;
		margin-bottom: 0.5rem;
	}
	.souq-filter-panel {
		position: fixed;
		inset: 0;
		z-index: 600;
		background: rgba(15, 23, 42, 0.45);
		display: none;
		align-items: flex-end;
		justify-content: center;
		padding: 0;
	}
	.souq-filter-panel.is-open {
		display: flex;
	}
	.souq-filter-sheet {
		width: 100%;
		max-height: 78vh;
		background: var(--sa-surface);
		border-radius: 18px 18px 0 0;
		display: flex;
		flex-direction: column;
		overflow: hidden;
		box-shadow: 0 -8px 40px rgba(15, 23, 42, 0.15);
	}
	.souq-filter-panel__head {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 1rem 1.15rem;
		border-bottom: 1px solid var(--sa-border);
		flex-shrink: 0;
	}
	.souq-filter-pills {
		position: static;
		flex: 1 1 auto;
		overflow-y: auto;
		padding: 0.85rem 1rem 1.25rem;
		flex-direction: column;
		align-items: stretch;
		gap: 0.45rem;
		max-height: none;
		border-radius: 0;
		background: transparent;
	}
	.souq-filter-pill {
		justify-content: flex-start;
		width: 100%;
		padding: 0.8rem 1rem;
		border-radius: 12px;
	}
}

@media (min-width: 901px) {
	.souq-filter-panel {
		display: block !important;
	}
	.souq-filter-sheet {
		display: contents;
	}
}

/* WooCommerce ordering Arabic styling */
.woocommerce-ordering select {
	font-family: inherit;
	color: var(--sa-text);
}

/* Flash deals compact */
.sa-flash__inner {
	padding: 1.25rem 1.5rem;
	border-radius: var(--sa-radius);
}

/* Trust bar color */
.souq-trust__item {
	background: linear-gradient(135deg, var(--sa-surface), var(--sa-bg-warm));
	border: 1px solid var(--sa-border);
}

.souq-trust__item:hover {
	border-color: var(--sa-emerald);
}
