/* Bilpopup — frontend */
.bilpop, .bilpop * { box-sizing: border-box; font-family: Vazirmatn, -apple-system, "Segoe UI", Tahoma, sans-serif; }

.bilpop { --bp: #2563eb; direction: rtl; }

/* The popup boxes themselves must be fixed to the viewport (this was missing,
   so the box rendered at the bottom of the page under the overlay). */
.bilpop-modal, .bilpop-slidein, .bilpop-bar {
	position: fixed; z-index: 2147482001;
	color: #111827; text-align: right;
}

/* Overlay (modal) */
.bilpop-overlay {
	position: fixed; inset: 0;
	background: rgba(17, 24, 39, .55);
	z-index: 2147482000;
	animation: bilpop-fade .2s ease;
}

/* Close button */
.bilpop-close {
	position: absolute; top: 8px; left: 10px;
	width: 30px; height: 30px; line-height: 28px; text-align: center;
	border: none; border-radius: 50%; background: rgba(0,0,0,.06);
	color: #374151; font-size: 20px; cursor: pointer;
}
.bilpop-close:hover { background: rgba(0,0,0,.12); }

/* Body content (rendered blocks) */
.bilpop-inner { padding: 26px 22px 22px; }
.bilpop-inner img { max-width: 100%; height: auto; }
.bilpop-inner > :first-child { margin-top: 0; }
.bilpop-inner > :last-child { margin-bottom: 0; }

/* CTA + form */
.bilpop-cta {
	display: inline-block; margin-top: 14px; padding: 11px 22px;
	background: var(--bp); color: #fff; text-decoration: none;
	border-radius: 10px; font-weight: 700; font-size: 15px; border: none; cursor: pointer;
}
.bilpop-cta:hover { filter: brightness(.94); }
.bilpop-form { margin-top: 14px; display: flex; flex-direction: column; gap: 8px; }
.bilpop-form input {
	width: 100%; padding: 11px 12px; border: 1px solid #d1d5db;
	border-radius: 10px; font-size: 14px;
}
.bilpop-form input:focus { outline: none; border-color: var(--bp); }
.bilpop-form button {
	padding: 11px; border: none; border-radius: 10px; background: var(--bp);
	color: #fff; font-weight: 700; font-size: 15px; cursor: pointer;
}
.bilpop-thanks { margin-top: 12px; color: #15803d; font-weight: 700; }

/* MODAL */
.bilpop-modal {
	top: 50%; left: 50%; transform: translate(-50%, -50%);
	width: 440px; max-width: calc(100vw - 32px); max-height: calc(100vh - 48px);
	overflow: auto; background: #fff; border-radius: 16px;
	box-shadow: 0 24px 60px rgba(0,0,0,.3);
	animation: bilpop-pop .22s cubic-bezier(.2,.9,.3,1.1);
}

/* SLIDE-IN */
.bilpop-slidein {
	bottom: 20px; width: 360px; max-width: calc(100vw - 32px);
	background: #fff; border-radius: 14px; box-shadow: 0 16px 44px rgba(0,0,0,.22);
	animation: bilpop-slide .28s ease;
}
.bilpop-slidein.br { right: 20px; }
.bilpop-slidein.bl { left: 20px; }

/* BAR */
.bilpop-bar {
	left: 0; right: 0; width: 100%;
	background: var(--bp); color: #fff;
	box-shadow: 0 2px 12px rgba(0,0,0,.15);
	animation: bilpop-fade .2s ease;
}
.bilpop-bar.top { top: 0; }
.bilpop-bar.bottom { bottom: 0; }
.bilpop-bar .bilpop-inner {
	padding: 12px 50px; display: flex; align-items: center; justify-content: center;
	gap: 14px; flex-wrap: wrap; text-align: center;
}
.bilpop-bar .bilpop-inner * { color: #fff; }
.bilpop-bar .bilpop-cta { background: #fff; color: var(--bp); margin-top: 0; padding: 8px 18px; }
.bilpop-bar .bilpop-close { color: #fff; background: rgba(255,255,255,.18); top: 50%; transform: translateY(-50%); }
.bilpop-bar .bilpop-form { flex-direction: row; margin-top: 0; }
.bilpop-bar .bilpop-form input { width: 200px; }

@keyframes bilpop-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes bilpop-pop { from { opacity: 0; transform: translate(-50%, -46%) scale(.96); } to { opacity: 1; transform: translate(-50%, -50%) scale(1); } }
@keyframes bilpop-slide { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }

@media (max-width: 480px) {
	.bilpop-slidein { left: 12px; right: 12px; width: auto; }
	.bilpop-bar .bilpop-form input { width: 150px; }
}