/* کارت پیشنهاد فایل. گوشه‌ی چپ می‌نشیند تا با حباب گفتگو (راست) تصادف نکند. */
.nm-sug {
	position: fixed;
	left: 20px;
	bottom: 20px;
	z-index: 9980;
	width: 330px;
	max-width: calc(100vw - 32px);
	background: #fff;
	border: 1px solid var(--line, #D9E4E8);
	border-radius: 18px;
	box-shadow: 0 18px 44px -22px rgba(20, 35, 42, .5);
	font-family: inherit;
	direction: rtl;
	color: var(--ink, #14232A);
	overflow: hidden;
	opacity: 0;
	transform: translateY(14px);
	transition: opacity .25s ease, transform .25s ease;
}
.nm-sug.is-in { opacity: 1; transform: none; }

.nm-sug__head { display: flex; align-items: flex-start; gap: 10px; padding: 14px 16px 10px; border-bottom: 1px solid var(--line-2, #E7EEF1); }
.nm-sug__title { display: block; font-size: 15px; line-height: 1.6; }
.nm-sug__why { display: block; font-size: 12px; color: var(--muted, #51626A); line-height: 1.7; margin-top: 2px; }
.nm-sug__x { flex: none; margin-inline-start: auto; background: none; border: 0; font-size: 22px; line-height: 1; color: var(--muted, #51626A); cursor: pointer; padding: 0 2px; border-radius: 8px; }
.nm-sug__x:hover { color: var(--ink, #14232A); }

.nm-sug__list { list-style: none; margin: 0; padding: 6px; max-height: 46vh; overflow-y: auto; }
.nm-sug__list a { display: flex; gap: 10px; align-items: center; padding: 8px; border-radius: 12px; text-decoration: none; color: inherit; }
.nm-sug__list a:hover { background: var(--surface-2, #F7FAFB); }

.nm-sug__pic { flex: none; width: 56px; height: 56px; border-radius: 10px; overflow: hidden; background: var(--mint, #E1F1F4); display: block; }
.nm-sug__pic img { width: 100%; height: 100%; object-fit: cover; display: block; }

.nm-sug__body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.nm-sug__body strong { font-size: 13.5px; font-weight: 600; line-height: 1.6; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.nm-sug__meta { font-size: 11.5px; color: var(--muted, #51626A); }
.nm-sug__price { font-size: 12.5px; color: var(--accent, #C0561A); font-weight: 600; }

@media (max-width: 1180px) {
	/* روی موبایل نوار پایین سایت هست؛ بالاتر می‌نشیند. */
	.nm-sug { left: 14px; right: 14px; width: auto; bottom: calc(84px + env(safe-area-inset-bottom)); }
	.nm-sug__list { max-height: 40vh; }
}

/* حالت جمع‌شده روی گوشی: فقط یک نوار دو خطی، تا صفحهٔ نخست پشتش پیدا بماند. */
@media (max-width: 760px) {
	.nm-sug { left: 10px; right: 10px; }
	.nm-sug__head { padding: 10px 12px; border-bottom: 0; align-items: center; }
	.nm-sug__title { font-size: 14px; }
	.nm-sug__why { font-size: 11.5px; }
	.nm-sug__x { font-size: 24px; padding: 4px 8px; margin-top: -2px; }
	.nm-sug__list { border-top: 1px solid var(--line-2, #E7EEF1); max-height: 46vh; }
	.nm-sug.is-mini { cursor: pointer; }
	.nm-sug.is-mini .nm-sug__list { display: none; }
	.nm-sug.is-mini .nm-sug__why { display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
	.nm-sug__head::after {
		content: ''; flex: none; width: 9px; height: 9px; margin-inline-start: 2px;
		border-left: 2px solid var(--muted, #51626A); border-bottom: 2px solid var(--muted, #51626A);
		transform: rotate(135deg); transition: transform .2s;
	}
	.nm-sug.is-mini .nm-sug__head::after { transform: rotate(-45deg); }
	/* جمع‌شده کنار حباب گفتگو می‌نشیند؛ باز که شد، بالاتر از آن می‌رود. */
	.nm-sug.is-mini { left: 10px; right: 76px; }
	.nm-sug:not(.is-mini) { right: 10px; bottom: calc(150px + env(safe-area-inset-bottom)); }
}
@media (prefers-reduced-motion: reduce) {
	.nm-sug { transition: none; }
}

/* ثبت تقاضا — وقتی فایل مناسب پیدا نشد */
.nm-sug__dem { border-top: 1px solid rgba(10,40,70,.12); padding: 10px 12px 12px; }
.nm-sug__dem-open { width: 100%; text-align: start; background: #f4f7fb; border: 1px dashed rgba(13,63,74,.35); border-radius: 12px; padding: 10px 12px; font: inherit; font-size: 13.5px; color: #33475f; cursor: pointer; line-height: 1.7; }
.nm-sug__dem-open span { color: #0d3f4a; font-weight: 700; white-space: nowrap; }
.nm-sug__dem-open:hover { background: #eef3f9; }
.nm-sug__dem-form { display: grid; gap: 8px; }
.nm-sug__dem-hint { margin: 0; font-size: 13px; color: #0d3f4a; background: #f4f7fb; border-radius: 10px; padding: 8px 10px; line-height: 1.8; }
.nm-sug__dem-form label { display: grid; gap: 4px; font-size: 12.5px; color: #5b6c84; }
.nm-sug__dem-form input[type=text], .nm-sug__dem-form input[type=tel] { width: 100%; padding: 9px 11px; border: 1px solid rgba(10,40,70,.18); border-radius: 10px; font: inherit; font-size: 14px; background: #fff; }
.nm-sug__hp { position: absolute !important; left: -9999px !important; width: 1px !important; height: 1px !important; opacity: 0 !important; }
.nm-sug__dem-help { margin: 0; font-size: 11.5px; color: #8294ab; line-height: 1.8; }
.nm-sug__dem-send { background: #0d3f4a; color: #fff; border: 0; border-radius: 11px; padding: 10px 16px; font: inherit; font-weight: 700; cursor: pointer; }
.nm-sug__dem-send[disabled] { opacity: .6; cursor: default; }
.nm-sug__dem-msg { font-size: 12.5px; color: #5b6c84; }
.nm-sug__dem-msg.is-bad { color: #b4452f; }
.nm-sug__dem-done { margin: 0; font-size: 13.5px; color: #2f6f52; background: #eef7f1; border-radius: 10px; padding: 10px 12px; line-height: 1.9; }
