/*
 * Callback popup ("Planning to Start a Business in UAE?").
 * Dark navy panel, white type and muted gold accents. Shown by assets/js/callback-popup.js.
 */

.sb-cb { position: fixed; inset: 0; z-index: 9999; display: flex; align-items: center; justify-content: center; padding: 1rem; }
.sb-cb[hidden] { display: none; }

.sb-cb__overlay { position: absolute; inset: 0; background: rgba(4, 14, 32, 0.66); opacity: 0; transition: opacity 0.22s ease; }

.sb-cb__dialog {
	position: relative;
	width: min(100%, 27.5rem);
	max-height: calc(100vh - 2rem);
	max-height: calc(100dvh - 2rem);
	overflow-y: auto;
	overscroll-behavior: contain;
	padding: 1.9rem 1.7rem 1.5rem;
	border: 1px solid rgba(213, 172, 98, 0.4);
	border-radius: 18px;
	background: radial-gradient(130% 90% at 100% 0%, #0f3470 0%, #082250 45%, #061a35 100%);
	box-shadow: 0 40px 80px -30px rgba(0, 0, 0, 0.75);
	color: #fff;
	opacity: 0;
	transform: translateY(10px) scale(0.96);
	transition: opacity 0.22s ease, transform 0.22s ease;
}

.sb-cb.is-open .sb-cb__overlay { opacity: 1; }
.sb-cb.is-open .sb-cb__dialog { opacity: 1; transform: none; }
.sb-cb__dialog:focus { outline: none; }

.sb-cb__close { position: absolute; top: 0.8rem; right: 0.8rem; display: grid; place-items: center; width: 2.4rem; height: 2.4rem; padding: 0; border: 1px solid rgba(255, 255, 255, 0.28); border-radius: 50%; background: rgba(255, 255, 255, 0.06); color: #fff; cursor: pointer; transition: background-color 0.2s ease, border-color 0.2s ease; }
.sb-cb__close:hover { background: rgba(255, 255, 255, 0.16); border-color: #d5ac62; }
.sb-cb__close:focus-visible, .sb-cb__submit:focus-visible, .sb-cb__privacy a:focus-visible { outline: 3px solid #d5ac62; outline-offset: 3px; }

.sb-cb__logo { display: inline-block; margin: 0 0 1.2rem; padding: 0.4rem 0.7rem; border-radius: 10px; background: #fff; line-height: 0; }
.sb-cb__logo img { display: block; width: 6.6rem; height: auto; }

.sb-cb__title { margin: 0 2rem 0.6rem 0; font-family: "Playfair Display", var(--sb-serif, serif); font-size: clamp(1.45rem, 5vw, 1.8rem); font-weight: 600; line-height: 1.2; color: #fff; }
.sb-cb__title::after { content: ""; display: block; width: 2.6rem; height: 2px; margin-top: 0.8rem; background: #d5ac62; }
.sb-cb__desc { margin: 0 0 1.3rem; color: rgba(255, 255, 255, 0.86); font-size: 0.98rem; line-height: 1.55; }

.sb-cb__field { margin: 0 0 0.9rem; }
.sb-cb__field label { display: block; margin: 0 0 0.35rem; color: rgba(255, 255, 255, 0.92); font-size: 0.85rem; font-weight: 500; }
.sb-cb__field label span { color: #d5ac62; }
.sb-cb__field input, .sb-cb__field select { width: 100%; min-height: 3rem; padding: 0 0.9rem; border: 1px solid transparent; border-radius: 9px; background: #fff; color: #071b40; font: 400 1rem/1.2 var(--sb-sans, sans-serif); }
.sb-cb__field input::placeholder { color: #8a97ad; }
.sb-cb__field input:focus, .sb-cb__field select:focus { outline: 3px solid #d5ac62; outline-offset: 1px; }
.sb-cb__field input:user-invalid:not(:focus) { border-color: #ff9f9f; }
.sb-cb__phone { display: flex; gap: 0.5rem; }
.sb-cb__phone select { flex: 0 0 7.4rem; width: 7.4rem; padding-right: 0.3rem; font-size: 0.9rem; text-overflow: ellipsis; }
.sb-cb__phone input { flex: 1 1 auto; min-width: 0; }

.sb-cb__trap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.sb-cb__status { min-height: 1.3rem; margin: 0 0 0.7rem; color: #cfe6d6; font-size: 0.9rem; line-height: 1.45; }
.sb-cb__status.is-error { color: #ffb4b4; }

.sb-cb__submit { display: inline-flex; align-items: center; justify-content: center; width: 100%; min-height: 3.2rem; padding: 0 1.4rem; border: 0; border-radius: 9px; background: linear-gradient(135deg, #cf9a3b 0%, #b8832c 52%, #9c6a23 100%); box-shadow: 0 14px 26px -14px rgba(184, 134, 53, 0.9), inset 0 1px 0 rgba(255, 255, 255, 0.28); color: #fff; font: 600 1rem/1 var(--sb-sans, sans-serif); cursor: pointer; transition: filter 0.2s ease; }
.sb-cb__submit:hover { filter: brightness(0.94); }
.sb-cb__submit[disabled] { opacity: 0.7; cursor: progress; }
.sb-cb__submit--ghost { margin-top: 1.1rem; background: transparent; border: 1.5px solid rgba(255, 255, 255, 0.5); box-shadow: none; }
.sb-cb__submit--ghost:hover { background: rgba(255, 255, 255, 0.1); filter: none; }

.sb-cb__privacy { margin: 0.9rem 0 0; color: rgba(255, 255, 255, 0.75); font-size: 0.82rem; line-height: 1.5; text-align: center; }
.sb-cb__privacy a { color: #d5ac62; text-decoration: underline; text-underline-offset: 2px; }

.sb-cb__done { padding: 0.5rem 0 0.2rem; color: rgba(255, 255, 255, 0.9); line-height: 1.6; }
.sb-cb__done[hidden] { display: none; }
.sb-cb__done-title { margin: 0 0 0.5rem; color: #d5ac62; font-family: "Playfair Display", var(--sb-serif, serif); font-size: 1.4rem; }

@media (max-width: 479px) {
	.sb-cb { padding: 0.6rem; }
	.sb-cb__dialog { padding: 1.5rem 1.15rem 1.2rem; max-height: calc(100vh - 1.2rem); max-height: calc(100dvh - 1.2rem); }
	.sb-cb__logo img { width: 5.8rem; }
	.sb-cb__phone select { flex-basis: 6.6rem; width: 6.6rem; }
}

@media (prefers-reduced-motion: reduce) {
	.sb-cb__overlay, .sb-cb__dialog { transition: none; transform: none; }
}
