/*!
 * imoGift Smart Search — header search box + enlarged dropdown card
 * @version 1.3.0
 * @author  Masi Darbandi
 */
.igs {
	/* closed box (Digikala style) */
	--igs-width: 100%;
	--igs-max-width: 600px;
	--igs-height: 44px;
	--igs-radius: 8px;
	--igs-font-size: 14px;
	--igs-font: inherit;
	--igs-bg: #F0F0F1;
	--igs-bg-focus: #FFFFFF;
	--igs-border: #F0F0F1;
	--igs-border-width: 1px;
	--igs-text: #3F4064;
	--igs-placeholder: #A1A3A8;
	--igs-icon: #767790;
	--igs-icon-size: 22px;
	--igs-accent: #5A91DB;
	/* open dropdown card */
	--igs-card-width: 520px;
	--igs-card-pad: 32px;
	--igs-card-radius: 8px;
	--igs-open-height: 58px;
	--igs-open-radius: 6px;
	--igs-open-border: #E3E6EB;
	--igs-panel-bg: #FFFFFF;
	--igs-chip-bg: #F5F6F8;
	--igs-hover: #F2F6FC;
	--igs-muted: #81858B;
	--igs-line: #ECEEF1;
	--igs-thumb: 44px;            /* image frame height */
	--igs-thumb-w: 70px;          /* image frame width (rectangle, ~card ratio) */
	--igs-thumb-fit: contain;     /* contain = whole image visible, never cropped */
	--igs-panel-max-h: 68vh;
	--igs-z: 9999;

	position: relative;
	width: var(--igs-width);
	max-width: var(--igs-max-width);
	min-height: var(--igs-height);
	font-family: var(--igs-font);
	font-size: var(--igs-font-size);
	color: var(--igs-text);
	direction: rtl;
	text-align: right;
	box-sizing: border-box;
}
.igs *, .igs *::before, .igs *::after { box-sizing: border-box; }
.igs svg { display: block; flex: none; }

/* ---------- Closed box ---------- */
.igs .igs__card { position: relative; }
.igs .igs__form {
	position: relative;
	display: flex !important;
	flex-direction: row;
	align-items: center;
	justify-content: flex-start;
	gap: 8px;
	width: 100%;
	height: var(--igs-height);
	margin: 0 !important;
	padding: 0 12px !important;
	background: var(--igs-bg);
	border: var(--igs-border-width) solid var(--igs-border);
	border-radius: var(--igs-radius);
	transition: background-color .15s, border-color .15s;
}
.igs .igs__icon { display: flex; order: 0; color: var(--igs-icon); }
.igs .igs__icon svg { width: var(--igs-icon-size); height: var(--igs-icon-size); }

/* Hardened against theme / Elementor-kit input & button styles */
.igs .igs__form .igs__input {
	order: 1;
	flex: 1 1 auto;
	width: auto !important;
	min-width: 0;
	height: 100% !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	outline: 0 !important;
	box-shadow: none !important;
	background: transparent !important;
	color: var(--igs-text) !important;
	font: inherit;
	font-size: var(--igs-font-size);
	line-height: normal;
	text-align: right !important;
	direction: rtl;
	-webkit-appearance: none;
	appearance: none;
}
.igs .igs__input::placeholder { color: var(--igs-placeholder) !important; opacity: 1; }
.igs .igs__input::-webkit-search-cancel-button,
.igs .igs__input::-webkit-search-decoration { -webkit-appearance: none; display: none; }

.igs .igs__form .igs__clear {
	order: 3;
	display: flex !important;
	align-items: center; justify-content: center;
	flex: none; width: 30px !important; height: 30px !important; min-height: 0 !important;
	margin: 0 !important; padding: 0 !important;
	background: transparent !important; border: 0 !important; border-radius: 50% !important; box-shadow: none !important;
	color: var(--igs-icon) !important; cursor: pointer; line-height: 1;
}
.igs .igs__form .igs__clear[hidden] { display: none !important; }
.igs .igs__form .igs__clear:hover { background: rgba(0, 0, 0, .05) !important; }

.igs .igs__spinner {
	order: 2; display: none; flex: none; width: 16px; height: 16px;
	border: 2px solid var(--igs-line); border-top-color: var(--igs-accent); border-radius: 50%;
	animation: igs-spin .7s linear infinite;
}
.igs.is-loading .igs__spinner { display: block; }
@keyframes igs-spin { to { transform: rotate(360deg); } }

/* ---------- Open: enlarged dropdown card ---------- */
.igs.is-open { z-index: var(--igs-z); }
.igs.is-open .igs__card {
	position: absolute;
	z-index: 2;
	top: calc((var(--igs-height) - var(--igs-open-height)) / 2 - var(--igs-card-pad));
	left: 50%;
	width: max(calc(100% + 2 * var(--igs-card-pad)), var(--igs-card-width));
	max-width: calc(100vw - 24px);
	transform: translateX(calc(-50% + var(--igs-shift, 0px)));
	padding: var(--igs-card-pad) var(--igs-card-pad) calc(var(--igs-card-pad) * .75);
	background: var(--igs-panel-bg);
	border-radius: var(--igs-card-radius);
	box-shadow: 0 18px 50px rgba(16, 24, 40, .18), 0 2px 8px rgba(16, 24, 40, .06);
	animation: igs-pop .16s ease-out;
}
@keyframes igs-pop { from { opacity: 0; margin-top: -6px; } }
.igs.is-open .igs__form {
	height: var(--igs-open-height);
	padding: 0 16px !important;
	background: var(--igs-bg-focus);
	border: 1px solid var(--igs-open-border);
	border-radius: var(--igs-open-radius);
}
.igs.is-open .igs__icon { color: var(--igs-accent); }

.igs .igs__panel {
	max-height: var(--igs-panel-max-h);
	overflow-y: auto;
	overscroll-behavior: contain;
	margin: 0 calc(-1 * var(--igs-card-pad));
	padding: 14px 0 0;
	background: transparent;
	scrollbar-width: thin;
}
.igs .igs__panel[hidden] { display: none; }

.igs__backdrop {
	display: none; position: fixed; inset: 0; z-index: 0;
	background: rgba(15, 23, 42, .32);
}
.igs--overlay.is-open .igs__backdrop { display: block; animation: igs-fade .15s ease-out; }
@keyframes igs-fade { from { opacity: 0; } }

/* ---------- Panel content ---------- */
.igs__section { padding: 4px 0; }
.igs__section + .igs__section:not(.igs__links):not(.igs__suggest-start) { margin-top: 6px; }
.igs__suggest-start { margin-top: 14px !important; padding-top: 18px; border-top: 1px solid var(--igs-line); }
.igs__head {
	display: flex; align-items: center; justify-content: space-between; gap: 8px;
	padding: 6px var(--igs-card-pad) 12px;
	font-size: 1.05em; font-weight: 700; color: var(--igs-text);
}
.igs .igs__head-action {
	margin: 0 !important; padding: 0 !important; border: 0 !important; background: none !important; box-shadow: none !important;
	color: var(--igs-muted) !important; font: inherit; font-size: .8em; font-weight: 400; cursor: pointer;
}
.igs .igs__head-action:hover { color: #D63B5A !important; }

/* Chips: popular (wrap) + previous searches (2-col grid) */
.igs__chips { display: flex; flex-wrap: wrap; gap: 10px; padding: 0 var(--igs-card-pad) 6px; }
.igs__recent { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; padding: 0 var(--igs-card-pad) 6px; }
.igs .igs__chip {
	display: inline-flex !important; align-items: center; justify-content: flex-start; gap: 8px;
	min-width: 0; min-height: 0 !important; margin: 0 !important;
	padding: 9px 16px !important;
	background: var(--igs-chip-bg) !important; border: 1px solid transparent !important; border-radius: 6px !important; box-shadow: none !important;
	color: var(--igs-text) !important; font: inherit; font-size: .95em; font-weight: 400; line-height: 1.5;
	text-decoration: none !important; text-align: right; cursor: pointer;
	transition: border-color .15s, background-color .15s;
}
.igs__chip-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.igs__chip-icon { display: flex; color: var(--igs-muted); }
.igs__chip-icon svg { width: 16px; height: 16px; }
.igs__chip small { color: var(--igs-muted); font-size: .85em; }
.igs .igs__chip:hover, .igs .igs__chip.is-active { border-color: var(--igs-accent) !important; background: var(--igs-hover) !important; }
.igs__recent .igs__chip { display: flex !important; width: 100%; }

/* Result rows */
.igs .igs__item {
	display: flex; align-items: center; gap: 14px;
	padding: 10px var(--igs-card-pad); color: var(--igs-text) !important; text-decoration: none !important;
	cursor: pointer; transition: background-color .12s;
}
.igs .igs__item:hover, .igs .igs__item.is-active { background: var(--igs-hover); }
.igs__thumb {
	flex: none; width: var(--igs-thumb-w); height: var(--igs-thumb);
	border-radius: 6px; background: var(--igs-chip-bg); overflow: hidden;
	display: flex; align-items: center; justify-content: center; color: var(--igs-muted);
}
.igs .igs__thumb img { width: 100% !important; height: 100% !important; max-width: none; object-fit: var(--igs-thumb-fit); object-position: center; display: block; border-radius: inherit; }
.igs__thumb svg { width: 20px; height: 20px; }
.igs__thumb--post { width: var(--igs-thumb-w); height: var(--igs-thumb); }
.igs__body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.igs__title { font-size: 1.05em; font-weight: 500; line-height: 1.6; color: var(--igs-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.igs__title mark { background: none; color: var(--igs-accent); font-weight: 700; padding: 0; }
.igs__meta { display: flex; align-items: center; gap: 6px; font-size: .82em; color: var(--igs-muted); line-height: 1.4; }
.igs__cat { color: var(--igs-accent); }
.igs__meta-sep { width: 3px; height: 3px; border-radius: 50%; background: currentColor; opacity: .6; }
.igs__price { color: var(--igs-text); font-weight: 600; }

.igs__note { padding: 2px var(--igs-card-pad) 8px; font-size: .9em; color: var(--igs-muted); }
.igs__note b { color: var(--igs-accent); }

/* "همه محصولات / مقالات مرتبط با ..." */
.igs__links { margin-top: 8px; }
.igs .igs__all {
	display: flex; align-items: center; gap: 14px;
	padding: 9px var(--igs-card-pad); color: var(--igs-text) !important; text-decoration: none !important;
	transition: background-color .12s;
}
.igs .igs__all:hover, .igs .igs__all.is-active { background: var(--igs-hover); }
.igs__all-icon {
	flex: none; width: 36px; height: 36px; border-radius: 50%; background: var(--igs-chip-bg);
	display: flex; align-items: center; justify-content: center; color: var(--igs-muted);
}
.igs__all-icon svg { width: 20px; height: 20px; }
.igs__all-text { flex: 1; min-width: 0; font-size: 1em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.igs__all-text b { font-weight: 700; }
.igs__all-text span { color: var(--igs-muted); }
.igs__all-arrow { flex: none; color: var(--igs-muted); }
.igs__all-arrow svg { width: 18px; height: 18px; }

.igs__empty { padding: 18px var(--igs-card-pad); text-align: center; color: var(--igs-muted); line-height: 1.8; }
.igs__empty svg { width: 40px; height: 40px; margin: 0 auto 8px; color: var(--igs-line); }
.igs__empty b { color: var(--igs-text); }

/* Loading skeleton */
.igs__sk { display: flex; align-items: center; gap: 14px; padding: 10px var(--igs-card-pad); }
.igs__sk i { display: block; border-radius: 6px; background: linear-gradient(90deg, #F0F1F3 25%, #F7F8F9 50%, #F0F1F3 75%); background-size: 200% 100%; animation: igs-sh 1.2s infinite; }
.igs__sk > i { width: var(--igs-thumb-w); height: var(--igs-thumb); border-radius: 6px; flex: none; }
.igs__sk span { flex: 1; display: flex; flex-direction: column; gap: 8px; }
.igs__sk span i:first-child { width: 60%; height: 12px; }
.igs__sk span i:last-child { width: 30%; height: 10px; }
@keyframes igs-sh { to { background-position: -200% 0; } }

/* ---------- Mobile: full-screen search ---------- */
@media (max-width: 767px) {
	.igs { --igs-card-pad: 16px; }
	.igs.is-open {
		position: fixed; inset: 0; z-index: 100000;
		width: auto; max-width: none; min-height: 0;
		background: var(--igs-panel-bg);
	}
	.igs.is-open .igs__card {
		position: static; transform: none; width: auto; max-width: none; height: 100%;
		display: flex; flex-direction: column;
		padding: 12px var(--igs-card-pad) 0; border-radius: 0; box-shadow: none; animation: none;
	}
	.igs.is-open .igs__form { flex: none; height: 50px; }
	.igs.is-open .igs__form .igs__clear[hidden] { display: flex !important; } /* × = close */
	.igs.is-open .igs__panel { flex: 1; max-height: none; }
	.igs.is-open .igs__backdrop { display: none !important; }
	.igs .igs__form .igs__input { font-size: max(16px, var(--igs-font-size)); } /* prevents iOS zoom */
	.igs__recent { grid-template-columns: minmax(0, 1fr); }
}
html.igs-lock, html.igs-lock body { overflow: hidden !important; }

@media (prefers-reduced-motion: reduce) {
	.igs *, .igs *::before, .igs *::after { animation: none !important; transition: none !important; }
}
