/* NCFN Admin Panel — Login flow (centered card, matches design screens) */
:root {
	--ncfn-purple: #3B0764;
	--ncfn-orange: #F2600C;
	--ncfn-orange-dark: #D9500A;
	--ncfn-text: #1F2937;
	--ncfn-muted: #6B7280;
	--ncfn-border: #E5E7EB;
	--ncfn-danger: #B3261E;
	--ncfn-success: #16A34A;
}

html, body { margin: 0; }

#ncfn-admin-login-app {
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	color: var(--ncfn-text);
	position: fixed;
	inset: 0;
	z-index: 999999;
	overflow-y: auto;
	background: #fff;
}
#ncfn-admin-login-app * { box-sizing: border-box; }

.ncfn-al-page {
	min-height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 48px 20px;
	background:
		linear-gradient(0deg, rgba(59,7,100,.035), rgba(59,7,100,.035)),
		repeating-linear-gradient(0deg, transparent 0 78px, rgba(59,7,100,.05) 78px 79px),
		repeating-linear-gradient(90deg, transparent 0 78px, rgba(59,7,100,.05) 78px 79px);
}

.ncfn-al-col { display: flex; flex-direction: column; align-items: center; width: 100%; max-width: 460px; }

.ncfn-al-brand { text-align: center; margin-bottom: 26px; }
.ncfn-al-brand img { height: 44px; width: auto; }
.ncfn-al-brand .ncfn-al-wordmark { font-size: 20px; font-weight: 800; color: var(--ncfn-purple); }

.ncfn-al-card {
	background: #fff;
	border: 1px solid var(--ncfn-border);
	border-radius: 16px;
	box-shadow: 0 12px 34px rgba(30, 16, 48, .10);
	padding: 32px 30px;
	width: 100%;
}

.ncfn-al-card h2 { font-size: 21px; font-weight: 700; margin: 0 0 6px; text-align: center; color: var(--ncfn-text); }
.ncfn-al-card .ncfn-al-sub { font-size: 13px; color: var(--ncfn-muted); text-align: center; margin: 0 0 26px; line-height: 1.5; }

.ncfn-al-field { margin-bottom: 16px; }
.ncfn-al-field label {
	display: block; font-size: 12.5px; font-weight: 600; color: var(--ncfn-text); margin-bottom: 6px;
}
.ncfn-al-field .ncfn-al-input-wrap { position: relative; }
.ncfn-al-field input[type="text"],
.ncfn-al-field input[type="email"],
.ncfn-al-field input[type="password"] {
	width: 100%;
	border: 1px solid var(--ncfn-border);
	border-radius: 10px;
	padding: 13px 14px;
	font-size: 14.5px;
	font-family: inherit;
	color: var(--ncfn-text);
	background: #fff;
	transition: border-color .15s ease, box-shadow .15s ease;
}
.ncfn-al-field input::placeholder { color: #9CA3AF; }
.ncfn-al-field input:focus {
	outline: none;
	border-color: var(--ncfn-orange);
	box-shadow: 0 0 0 3px rgba(242, 96, 12, .12);
}
.ncfn-al-field input.has-toggle { padding-right: 52px; }

.ncfn-al-toggle {
	position: absolute; right: 4px; top: 50%; transform: translateY(-50%);
	background: none; border: none; cursor: pointer; color: var(--ncfn-muted);
	display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; border-radius: 10px;
}
.ncfn-al-toggle:focus-visible { outline: 2px solid #5B21B6; outline-offset: 0; }
.ncfn-al-toggle:hover { color: var(--ncfn-text); }

.ncfn-al-row {
	display: flex; align-items: center; justify-content: space-between;
	margin-bottom: 20px; font-size: 13px;
}
.ncfn-al-remember { display: flex; align-items: center; gap: 7px; color: var(--ncfn-muted); cursor: pointer; user-select: none; }
.ncfn-al-remember input { width: 15px; height: 15px; accent-color: var(--ncfn-purple); cursor: pointer; }
.ncfn-al-forgot { color: var(--ncfn-orange); font-weight: 600; text-decoration: none; font-size: 13px; }
.ncfn-al-forgot:hover { text-decoration: underline; }

.ncfn-al-btn {
	display: block; width: 100%; text-align: center; text-decoration: none;
	border: none; border-radius: 10px; padding: 14px; font-size: 15px; font-weight: 700;
	cursor: pointer; font-family: inherit; background: var(--ncfn-orange); color: #fff;
	box-shadow: 0 4px 12px rgba(242, 96, 12, .28); transition: background .15s ease;
}
.ncfn-al-btn:hover { background: var(--ncfn-orange-dark); }
.ncfn-al-btn:disabled { opacity: .65; cursor: default; box-shadow: none; }

.ncfn-al-btn-ghost {
	display: block; width: 100%; text-align: center; background: none; border: none;
	color: var(--ncfn-orange); font-weight: 600; font-size: 13.5px; padding: 12px; cursor: pointer;
	font-family: inherit; text-decoration: none;
}
.ncfn-al-btn-ghost:hover { text-decoration: underline; }

.ncfn-al-error {
	background: #FDECEA; border: 1px solid #F5C6C0; color: var(--ncfn-danger);
	border-radius: 10px; padding: 11px 14px; font-size: 13px; margin-bottom: 16px;
}
.ncfn-al-success {
	background: #EAFBEF; border: 1px solid #BBEFCB; color: var(--ncfn-success);
	border-radius: 10px; padding: 11px 14px; font-size: 13px; margin-bottom: 16px;
}

.ncfn-al-otp-input {
	letter-spacing: 6px;
	font-weight: 700;
	font-size: 18px !important;
	text-align: center;
}

.ncfn-al-otp-row {
	display: flex; align-items: center; justify-content: space-between;
	margin-top: 14px; font-size: 12.5px; color: var(--ncfn-muted);
}
.ncfn-al-otp-row strong { color: var(--ncfn-orange); }
.ncfn-al-resend {
	background: #fff; border: 1px solid var(--ncfn-orange); color: var(--ncfn-orange);
	border-radius: 8px; padding: 7px 14px; font-size: 12px; font-weight: 600; cursor: pointer;
	font-family: inherit;
}
.ncfn-al-resend:hover { background: #FFF4EC; }
.ncfn-al-resend:disabled { opacity: .5; cursor: default; }

.ncfn-loading { text-align: center; padding: 60px 20px; color: var(--ncfn-muted); }

@media (max-width: 480px) {
	.ncfn-al-card { padding: 26px 20px; }
}

/* ==== NCFN UI REFINEMENT LAYER (v1.31) ====
/* Primary button */
#ncfn-admin-login-app :is(.ncfn-al-btn) { background-color: #F2600C; color: #fff; border-color: transparent; text-decoration: none; box-shadow: 0 4px 12px rgba(242,96,12,.28); }
#ncfn-admin-login-app :is(.ncfn-al-btn):hover { background-color: #D9500A; color: #fff; border-color: transparent; text-decoration: none; box-shadow: 0 6px 16px rgba(242,96,12,.34); }
#ncfn-admin-login-app :is(.ncfn-al-btn):active { transform: translateY(1px); }
#ncfn-admin-login-app :is(.ncfn-al-btn):disabled, #ncfn-admin-login-app :is(.ncfn-al-btn):disabled:hover { background-color: #F2600C; color: #fff; border-color: transparent; opacity: .6; cursor: not-allowed; transform: none; box-shadow: none; }

/* Ghost button */
#ncfn-admin-login-app :is(.ncfn-al-btn-ghost) { background-color: transparent; color: #F2600C; text-decoration: none; }
#ncfn-admin-login-app :is(.ncfn-al-btn-ghost):hover { background-color: transparent; color: #D9500A; text-decoration: underline; }
#ncfn-admin-login-app :is(.ncfn-al-btn-ghost):disabled, #ncfn-admin-login-app :is(.ncfn-al-btn-ghost):disabled:hover { background-color: transparent; color: #F2600C; opacity: .6; cursor: not-allowed; transform: none; box-shadow: none; }

/* Show/hide password */
#ncfn-admin-login-app :is(.ncfn-al-toggle) { background-color: transparent; color: #6B7280; }
#ncfn-admin-login-app :is(.ncfn-al-toggle):hover { background-color: transparent; color: #1F2937; }
#ncfn-admin-login-app :is(.ncfn-al-toggle):disabled, #ncfn-admin-login-app :is(.ncfn-al-toggle):disabled:hover { background-color: transparent; color: #6B7280; opacity: .6; cursor: not-allowed; transform: none; box-shadow: none; }

/* Forgot password link */
#ncfn-admin-login-app :is(.ncfn-al-forgot) { background-color: transparent; color: #F2600C; text-decoration: none; }
#ncfn-admin-login-app :is(.ncfn-al-forgot):hover { background-color: transparent; color: #D9500A; text-decoration: underline; }
#ncfn-admin-login-app :is(.ncfn-al-forgot):disabled, #ncfn-admin-login-app :is(.ncfn-al-forgot):disabled:hover { background-color: transparent; color: #F2600C; opacity: .6; cursor: not-allowed; transform: none; box-shadow: none; }

/* Resend code */
#ncfn-admin-login-app :is(.ncfn-al-resend) { background-color: #fff; color: #F2600C; border-color: #F2600C; }
#ncfn-admin-login-app :is(.ncfn-al-resend):hover { background-color: #FFF4EC; color: #D9500A; border-color: #D9500A; }
#ncfn-admin-login-app :is(.ncfn-al-resend):disabled, #ncfn-admin-login-app :is(.ncfn-al-resend):disabled:hover { background-color: #fff; color: #F2600C; border-color: #F2600C; opacity: .6; cursor: not-allowed; transform: none; box-shadow: none; }

#ncfn-admin-login-app input:not([type="checkbox"]):not([type="radio"]) { color: #1F2937; }
#ncfn-admin-login-app input:not([type="checkbox"]):not([type="radio"]):focus { outline: none; border-color: #F2600C; box-shadow: 0 0 0 3px rgba(242, 96, 12, .14); }
