/**
 * Creative Sandbox auth skin (login + register + recovery).
 * Zero-Scrolling adaptive layout with optimal sizing for all viewports (PC & Mobile).
 */

/* Viewport Zero-Scrolling enforcement */
html:has(.sb-auth-wrap),
body:has(.sb-auth-wrap) {
	overflow: hidden !important;
	height: 100vh !important;
	max-height: 100vh !important;
}

#base-content:has(.sb-auth-wrap) {
	overflow: hidden !important;
	flex: 1 !important;
	min-height: 0 !important;
	height: calc(100vh - 4.75rem - 2.5rem) !important;
	max-height: calc(100vh - 4.75rem - 2.5rem) !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	padding: clamp(0.2rem, 0.5vh, 0.4rem) 0 !important;
	box-sizing: border-box !important;
}

.sb-auth-wrap,
.sb-auth-wrap.nms-registry,
.registration-wrapper.nms-registry-sandbox {
	--sb-auth-teal: #008C99;
	--sb-auth-dark: #0f172a;
	--sb-auth-slate: #1e293b;
	--sb-auth-border: #e2e8f0;
	--sb-auth-muted: #64748b;
	--sb-auth-focus: rgba(0, 140, 153, 0.18);
	font-family: 'Montserrat', 'Plus Jakarta Sans', system-ui, sans-serif;
	max-width: 26rem;
	width: 100%;
	height: auto !important;
	max-height: 100% !important;
	min-height: 0 !important;
	margin: 0 auto !important;
	padding: clamp(0.2rem, 0.5vh, 0.45rem) clamp(0.6rem, 1.5vw, 1.25rem) !important;
	box-sizing: border-box !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	overflow: hidden !important;
	background: transparent !important;
}

/* Register: wider, proportional 2-column grid */
.sb-auth-wrap--register,
.registration-wrapper.nms-registry-sandbox {
	max-width: clamp(34rem, 58vw, 48rem) !important;
}

.sb-auth-card {
	position: relative;
	background: #ffffff;
	border-radius: clamp(10px, 1.5vh, 14px);
	border: 1px solid var(--sb-auth-border);
	padding: clamp(0.6rem, 1.4vh, 1.05rem) clamp(0.9rem, 2.1vw, 1.7rem);
	box-shadow: 0 6px 24px rgba(15, 23, 42, 0.06);
	text-align: center;
	box-sizing: border-box;
	width: 100%;
	max-width: 26rem;
	max-height: 100%;
	overflow: hidden;
}

.sb-auth-wrap--register .sb-auth-card,
.sb-auth-wrap.nms-registry #fnc-registration {
	max-width: 100%;
	flex: none;
	margin: 0;
	width: 100%;
	padding: clamp(0.55rem, 1.3vh, 1rem) clamp(0.9rem, 2.1vw, 1.75rem);
}

/* Back Arrow Button (Institutional Green/Teal) */
.sb-auth-back-btn {
	position: absolute;
	top: clamp(0.5rem, 1.2vh, 0.9rem);
	left: clamp(0.5rem, 1.2vw, 0.95rem);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: clamp(1.9rem, 3.8vh, 2.25rem);
	height: clamp(1.9rem, 3.8vh, 2.25rem);
	border-radius: 50%;
	color: #008C99;
	background: rgba(0, 140, 153, 0.08);
	text-decoration: none;
	transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
	z-index: 10;
}

.sb-auth-back-btn:hover {
	color: #ffffff;
	background: #008C99;
	transform: translateX(-2px);
	box-shadow: 0 4px 12px rgba(0, 140, 153, 0.25);
}

.sb-auth-back-btn svg {
	display: block;
	width: clamp(15px, 2vh, 18px);
	height: clamp(15px, 2vh, 18px);
}

.sb-auth-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.35rem;
	align-self: center;
	width: auto;
	max-width: max-content;
	margin: 0 auto;
	background: #fef2f2;
	color: #dc2626;
	border: 1px solid #fecaca;
	padding: 2px clamp(8px, 1.2vw, 12px);
	border-radius: 20px;
	font-weight: 800;
	font-size: clamp(0.62rem, 1.05vh, 0.72rem);
	text-transform: uppercase;
	letter-spacing: 0.04em;
	line-height: 1.15;
	box-sizing: border-box;
}

.sb-auth-card h2,
.sb-auth-title {
	margin: clamp(0.15rem, 0.35vh, 0.28rem) 0 0.06rem;
	font-family: 'Montserrat', sans-serif;
	color: #008C99;
	font-size: clamp(1.18rem, 2.3vh, 1.48rem);
	font-weight: 900;
	letter-spacing: -0.5px;
	line-height: 1.18;
}

.sb-auth-subtitle {
	color: var(--sb-auth-muted);
	font-size: clamp(0.74rem, 1.25vh, 0.84rem);
	margin: 0 0 clamp(0.22rem, 0.5vh, 0.38rem);
	line-height: 1.22;
}

.sb-auth-card .box-row.alter {
	margin-bottom: 0.35rem;
}

.sb-auth-card form {
	display: block !important;
	gap: 0 !important;
	margin: 0 !important;
	text-align: left;
}

.sb-auth-card .box-row {
	text-align: left;
	margin: 0 !important;
	padding: 0 !important;
}

.sb-auth-card .box-row:empty {
	display: none !important;
	margin: 0 !important;
	padding: 0 !important;
}

/* Form groups and inputs */
.sb-auth-card .form-group {
	position: relative;
	margin-bottom: 0;
	display: block;
}

.sb-auth-card .form-group > label {
	position: static !important;
	display: none !important;
	transform: none !important;
	left: auto !important;
	top: auto !important;
	pointer-events: none;
}

.sb-auth-card .form-group input[type="text"],
.sb-auth-card .form-group input[type="email"],
.sb-auth-card .form-group input[type="password"],
.sb-auth-card .form-group input[type="tel"],
.sb-auth-card .form-group select {
	width: 100%;
	display: block;
	padding: clamp(0.35rem, 0.75vh, 0.5rem) clamp(0.55rem, 0.9vw, 0.8rem);
	border: 1px solid var(--sb-auth-border);
	border-radius: clamp(6px, 1vh, 8px);
	margin: 0;
	font-family: inherit;
	font-size: clamp(0.82rem, 1.4vh, 0.9rem);
	line-height: 1.28;
	color: var(--sb-auth-dark);
	box-sizing: border-box;
	background: #fff;
	box-shadow: none;
	min-height: clamp(2.05rem, 4vh, 2.45rem);
}

.sb-auth-card .form-group input::placeholder {
	color: #94a3b8;
	opacity: 1;
	font-size: clamp(0.8rem, 1.35vh, 0.88rem);
}

.sb-auth-card .form-group input:focus,
.sb-auth-card .form-group select:focus {
	outline: none;
	border-color: var(--sb-auth-teal);
	box-shadow: 0 0 0 3px var(--sb-auth-focus);
}

.sb-auth-card .error,
.sb-auth-card [class*="-error"] {
	display: block;
	font-size: clamp(0.65rem, 1vh, 0.74rem);
	color: #dc2626;
	margin-top: 0.05rem;
	min-height: 0;
	line-height: 1.1;
}

.sb-auth-card .msg-warning,
.sb-auth-card .msg-error,
.sb-auth-card .msg-success {
	padding: clamp(0.3rem, 0.65vh, 0.45rem) clamp(0.55rem, 1vw, 0.8rem);
	border-radius: 6px;
	margin-bottom: 0.25rem;
	font-size: clamp(0.74rem, 1.2vh, 0.82rem);
	text-align: left;
}

.sb-auth-card .msg-success {
	background: #ecfdf5;
	color: #065f46;
	border: 1px solid #a7f3d0;
}

.sb-auth-card .msg-warning {
	background: #fef3c7;
	color: #92400e;
}

.sb-auth-card .msg-error {
	background: #fee2e2;
	color: #991b1b;
}

.sb-auth-card input[type="submit"],
.sb-auth-card button[type="submit"],
.sb-auth-card .submit input {
	width: 100%;
	background: var(--sb-auth-teal);
	color: #ffffff;
	border: none;
	padding: clamp(0.38rem, 0.75vh, 0.55rem) clamp(0.75rem, 1.5vw, 1.25rem);
	border-radius: clamp(6px, 1vh, 8px);
	font-weight: 800;
	font-family: inherit;
	cursor: pointer;
	font-size: clamp(0.8rem, 1.35vh, 0.92rem);
	line-height: 1.25;
	letter-spacing: -0.01em;
	min-height: clamp(2.15rem, 4.2vh, 2.55rem);
}

.sb-auth-card input[type="submit"]:hover,
.sb-auth-card button[type="submit"]:hover {
	filter: brightness(0.95);
}

.sb-auth-card .nms-registry-submit input,
.sb-auth-card .nms-registry-submit button {
	background: var(--sb-auth-slate);
	margin-top: 0 !important;
}

/* ====================================================
   Standardized Legal Acknowledgements Container
   (Identical to Service Funnels & Contact Form)
   ==================================================== */
.sb-auth-card .fnc-compliance-group {
	grid-column: 1 / -1;
	margin: clamp(0.2rem, 0.45vh, 0.36rem) 0 clamp(0.2rem, 0.45vh, 0.36rem) !important;
	padding: clamp(0.4rem, 0.9vh, 0.65rem) clamp(0.7rem, 1.5vw, 1rem) clamp(0.32rem, 0.7vh, 0.52rem) !important;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	background: #f8fafc;
	text-align: left;
	width: 100%;
	box-sizing: border-box;
}

.sb-auth-card .fnc-funnel-legal-title {
	font-weight: 800;
	color: #1e293b;
	margin: 0 0 clamp(0.14rem, 0.3vh, 0.25rem) 0 !important;
	font-size: clamp(0.8rem, 1.35vh, 0.88rem);
	line-height: 1.22;
}

.sb-auth-card .fnc-funnel-check {
	display: grid !important;
	grid-template-columns: 14px minmax(0, 1fr) !important;
	gap: clamp(4px, 0.7vw, 7px) !important;
	align-items: start !important;
	margin-bottom: clamp(2px, 0.35vh, 3.5px) !important;
	font-size: clamp(0.72rem, 1.2vh, 0.8rem) !important;
	color: #475569 !important;
	line-height: 1.28 !important;
	cursor: pointer !important;
	text-align: left !important;
	width: 100% !important;
	user-select: none !important;
}

.sb-auth-card .fnc-funnel-check input[type="checkbox"] {
	margin: 2px 0 0 0 !important;
	width: 13px !important;
	height: 13px !important;
	min-height: 13px !important;
	accent-color: #008C99 !important;
	grid-column: 1 !important;
	cursor: pointer !important;
}

.sb-auth-card .fnc-funnel-check span {
	display: block !important;
	grid-column: 2 !important;
}

.sb-auth-card .fnc-funnel-check a {
	color: #008C99 !important;
	text-decoration: underline !important;
	font-weight: 700 !important;
}

.sb-auth-card .fnc-funnel-check a:hover {
	color: #00737e !important;
}

.sb-auth-card .fnc-funnel-check--accept-all {
	margin-top: clamp(2px, 0.35vh, 4px) !important;
	padding-top: clamp(2px, 0.35vh, 4px) !important;
	border-top: 1px solid #cbd5e1 !important;
	font-weight: 800 !important;
	color: #0f172a !important;
	margin-bottom: 0 !important;
}

.sb-auth-footer-links {
	margin-top: clamp(0.25rem, 0.6vh, 0.45rem);
	text-align: center;
	font-size: clamp(0.74rem, 1.2vh, 0.82rem);
}

.sb-auth-footer-links a {
	color: var(--sb-auth-teal);
	font-weight: 700;
	text-decoration: none;
}

.sb-auth-footer-links a:hover {
	text-decoration: underline;
}

.sb-auth-divider {
	border: 0;
	border-top: 1px solid var(--sb-auth-border);
	margin: clamp(0.35rem, 0.75vh, 0.65rem) 0;
}

.sb-auth-register-cta {
	text-align: center;
	font-size: clamp(0.74rem, 1.2vh, 0.82rem);
	margin: 0;
}

.sb-auth-register-cta a {
	color: var(--sb-auth-teal);
	font-weight: 700;
	text-decoration: none;
}

.sb-auth-card .checkbox-group,
.sb-auth-card .radio-group {
	font-size: clamp(0.74rem, 1.2vh, 0.82rem);
	margin-bottom: 0.25rem;
	padding: clamp(0.25rem, 0.5vh, 0.35rem) clamp(0.45rem, 0.8vw, 0.65rem);
	border: 1px solid var(--sb-auth-border);
	border-radius: 6px;
	background: #f8fafc;
}

.sb-auth-card .checkbox-group label {
	display: flex;
	align-items: center;
	gap: 0.4rem;
	margin: 0;
	cursor: pointer;
	font-weight: 600;
	color: var(--sb-auth-slate);
}

/* Register 2-column field grid */
.sb-auth-fields-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(0.22rem, 0.5vh, 0.38rem) clamp(0.45rem, 1.2vw, 0.85rem) !important;
	align-items: start;
	margin-top: clamp(0.18rem, 0.4vh, 0.32rem) !important;
}

.sb-auth-fields-grid > .form-group,
.sb-auth-fields-grid > .checkbox-group,
.sb-auth-fields-grid > .radio-group {
	margin-bottom: 0;
}

.sb-auth-fields-grid > .form-group--full,
.sb-auth-fields-grid > .checkbox-group,
.sb-auth-fields-grid > .radio-group,
.sb-auth-fields-grid > .nms-registry-submit,
.sb-auth-fields-grid > [data-fnc-register="captcha"],
.sb-auth-fields-grid > .sb-auth-captcha-wrap {
	grid-column: 1 / -1;
}

/* Embedded inside sandbox workbench guest gate */
#fnc-sandbox-wrapper .sb-auth-wrap {
	margin: 0 auto;
	max-width: 100%;
	padding: 0;
}

#fnc-sandbox-wrapper .sb-auth-card {
	box-shadow: none;
	border: none;
	padding: 0;
}

/* Flex ordering to ensure CTA is always at the bottom */
.sb-auth-card {
	display: flex;
	flex-direction: column;
}

.sb-auth-card .sb-auth-divider {
	order: 998 !important;
}

.sb-auth-card .sb-auth-register-cta {
	order: 999 !important;
}

/* Dual Auth Switcher inside Sandbox Auth Card */
.sb-auth-card .authplus-login-switch {
	margin-bottom: clamp(0.45rem, 1vh, 0.75rem);
	padding: 0.18rem;
	border-radius: clamp(6px, 1vh, 8px);
	background: #f1f5f9;
	border: 1px solid var(--sb-auth-border);
}

.sb-auth-card .authplus-login-switch::before {
	top: 0.18rem;
	bottom: 0.18rem;
	left: 0.18rem;
	width: calc(50% - 0.18rem);
	background: var(--sb-auth-teal);
	border-radius: clamp(4px, 0.8vh, 6px);
}

.sb-auth-card .authplus-login-switch__btn {
	padding: clamp(0.35rem, 0.7vh, 0.5rem) 0.6rem !important;
	font-size: clamp(0.78rem, 1.3vh, 0.88rem) !important;
	font-weight: 700 !important;
}

.sb-auth-card .authplus-email-login-form .form-group {
	margin-bottom: clamp(0.35rem, 0.8vh, 0.6rem);
}

.sb-auth-card .authplus-email-login-form input[type="email"] {
	min-height: clamp(2.05rem, 4vh, 2.45rem);
	padding: clamp(0.35rem, 0.75vh, 0.52rem) clamp(0.65rem, 1.2vw, 0.85rem);
	font-size: clamp(0.82rem, 1.35vh, 0.92rem);
	border: 1px solid var(--sb-auth-border);
	border-radius: clamp(6px, 1vh, 8px);
}

.sb-auth-card .authplus-email-login-form__submit {
	width: 100%;
	background: var(--sb-auth-teal) !important;
	color: #ffffff !important;
	border: none !important;
	padding: clamp(0.38rem, 0.75vh, 0.55rem) 1rem !important;
	border-radius: clamp(6px, 1vh, 8px) !important;
	font-weight: 800 !important;
	font-size: clamp(0.8rem, 1.35vh, 0.92rem) !important;
	min-height: clamp(2.15rem, 4.2vh, 2.55rem) !important;
	cursor: pointer;
}