/* Digit identity layer.
   Scope after the 2026-06 consolidation: this file owns ONLY what the other
   Digit CSS files do not:
     1. The Frappe v16 login surface.
     2. Check-field restoration (keep checkboxes from inheriting input styles).
     3. A few brand typography accents.
   Desk theme  -> digit_desk.css
   Forms theme -> digit_forms.css
   Tokens/fonts/Frappe-variable bridge -> digit_tokens.css
   Do not re-add Desk/sidebar/card/workspace rules here; that caused the prior
   conflicting-layer problem. */

/* =========================================================================
   1. Brand typography accents (not covered by tokens/desk/forms)
   ========================================================================= */
.amount,
.currency,
.number-widget-box .widget-content .number,
.dt-cell--col[data-col-index] {
	font-variant-numeric: tabular-nums;
}

.breadcrumb .active,
.breadcrumb a:hover {
	color: var(--digit-brand) !important;
}

/* =========================================================================
   2. Check fields — do not let checkboxes inherit text-input styling.
   ========================================================================= */
input[type="checkbox"],
.checkbox input[type="checkbox"],
.frappe-control[data-fieldtype="Check"] input[type="checkbox"],
.grid-static-col input[type="checkbox"],
.dt-cell__content input[type="checkbox"] {
	width: 16px !important;
	height: 16px !important;
	min-width: 16px !important;
	min-height: 16px !important;
	padding: 0 !important;
	border: 1px solid rgba(6, 78, 59, 0.32) !important;
	border-radius: 4px !important;
	background-color: var(--digit-card) !important;
	accent-color: var(--digit-brand);
	box-shadow: none !important;
	appearance: auto;
	vertical-align: middle;
}

input[type="checkbox"]:focus {
	outline: 2px solid rgba(52, 211, 153, 0.32);
	outline-offset: 2px;
}

/* =========================================================================
   3. Frappe v16 login surface.
   View routing depends on body classes set by digit_identity.js:
   digit-login + digit-login-view-(login|forgot|email-link|signup).
   ========================================================================= */
body.digit-login,
body[data-path="login"] {
	min-height: 100vh !important;
	background:
		linear-gradient(180deg, rgba(250, 250, 246, 0.96), rgba(244, 243, 238, 0.98)),
		var(--digit-paper) !important;
	color: var(--digit-ink) !important;
	font-family: var(--digit-font-arabic) !important;
}

body.digit-login .navbar,
body.digit-login .web-footer,
body.digit-login .page-breadcrumbs,
body.digit-login .page-header-wrapper {
	display: none !important;
}

body.digit-login #page-login,
body.digit-login .page-content-wrapper {
	min-height: 100vh !important;
	background: transparent !important;
}

body.digit-login main.container {
	width: 100% !important;
	max-width: 1180px !important;
	min-height: 100vh !important;
	display: grid !important;
	align-items: center !important;
	padding: 48px 24px !important;
}

body.digit-login .page_content {
	width: 100% !important;
}

/* One auth section visible at a time. Hide all, then show the active view. */
body.digit-login .for-login,
body.digit-login .for-forgot,
body.digit-login .for-login-with-email-link,
body.digit-login .for-signup {
	box-sizing: border-box !important;
	width: min(100%, 460px) !important;
	max-width: 460px !important;
	margin: 0 auto !important;
	display: none !important;
	gap: 18px !important;
}

body.digit-login.digit-login-view-login .for-login,
body.digit-login.digit-login-view-forgot .for-forgot,
body.digit-login.digit-login-view-email-link .for-login-with-email-link,
body.digit-login.digit-login-view-signup .for-signup:not(.signup-disabled) {
	display: grid !important;
}

body.digit-login .page-card-head {
	display: grid !important;
	justify-items: center !important;
	gap: 14px !important;
	margin: 0 !important;
	padding: 0 !important;
	text-align: center !important;
}

body.digit-login .page-card-head .app-logo {
	width: 172px !important;
	height: auto !important;
	max-height: 72px !important;
	object-fit: contain !important;
	margin: 0 auto !important;
}

body.digit-login .page-card-head h4 {
	margin: 0 !important;
	color: var(--digit-ink) !important;
	font-family: var(--digit-font-latin) !important;
	font-size: 22px !important;
	font-weight: 800 !important;
	line-height: 1.25 !important;
	letter-spacing: 0 !important;
}

body.digit-login .login-content.page-card {
	box-sizing: border-box !important;
	width: 100% !important;
	max-width: 100% !important;
	margin: 0 !important;
	padding: 28px !important;
	border: 1px solid var(--digit-border) !important;
	border-radius: var(--digit-radius-lg) !important;
	background: var(--digit-card) !important;
	box-shadow: 0 16px 42px rgba(6, 78, 59, 0.08) !important;
}

body.digit-login .login-content.page-card *,
body.digit-login .form-control,
body.digit-login .btn {
	box-sizing: border-box !important;
	max-width: 100% !important;
}

body.digit-login .page-card-body,
body.digit-login .page-card-actions {
	padding: 0 !important;
	margin: 0 !important;
}

body.digit-login .form-group {
	margin: 0 0 14px !important;
}

/* Frappe v16 ships some labels visually-hidden; restore them in the card. */
body.digit-login .form-label,
body.digit-login label {
	display: block !important;
	position: static !important;
	width: auto !important;
	height: auto !important;
	margin: 0 0 7px !important;
	clip: auto !important;
	clip-path: none !important;
	overflow: visible !important;
	color: rgba(11, 31, 23, 0.78) !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	line-height: 1.35 !important;
}

body.digit-login .email-field,
body.digit-login .password-field {
	position: relative !important;
	width: 100% !important;
}

body.digit-login .form-control {
	width: 100% !important;
	height: 46px !important;
	min-height: 46px !important;
	padding: 0 42px 0 14px !important;
	border: 1px solid rgba(6, 78, 59, 0.18) !important;
	border-radius: var(--digit-radius-md) !important;
	background: var(--digit-card) !important;
	color: var(--digit-ink) !important;
	font-family: var(--digit-font-latin) !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	line-height: 46px !important;
	box-shadow: none !important;
}

body.digit-login .form-control:focus {
	border-color: var(--digit-brand) !important;
	box-shadow: var(--digit-focus) !important;
	outline: 0 !important;
}

body.digit-login .field-icon {
	position: absolute !important;
	top: 50% !important;
	right: 14px !important;
	left: auto !important;
	width: 16px !important;
	height: 16px !important;
	transform: translateY(-50%) !important;
	color: rgba(6, 78, 59, 0.55) !important;
	pointer-events: none !important;
}

body.digit-login .password-field .form-control {
	padding-right: 42px !important;
	padding-left: 76px !important;
}

body.digit-login .toggle-password {
	position: absolute !important;
	top: 50% !important;
	left: 14px !important;
	right: auto !important;
	transform: translateY(-50%) !important;
	color: var(--digit-brand) !important;
	font-size: 12px !important;
	font-weight: 700 !important;
	line-height: 1 !important;
	cursor: pointer !important;
}

body.digit-login .forgot-password-message {
	margin: 2px 0 18px !important;
	font-size: 13px !important;
}

body.digit-login a {
	color: var(--digit-brand) !important;
	font-weight: 700 !important;
	text-underline-offset: 3px !important;
}

body.digit-login .btn {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	min-height: 42px !important;
	padding: 0 18px !important;
	border-radius: var(--digit-radius-md) !important;
	font-size: 14px !important;
	font-weight: 800 !important;
	line-height: 1 !important;
	box-shadow: none !important;
}

body.digit-login .btn-primary,
body.digit-login .btn-login {
	width: 100% !important;
	background: var(--digit-brand-deep) !important;
	border-color: var(--digit-brand-deep) !important;
	color: #ffffff !important;
}

body.digit-login .btn-primary:hover,
body.digit-login .btn-login:hover {
	background: var(--digit-brand) !important;
	border-color: var(--digit-brand) !important;
}

body.digit-login .login-divider {
	display: grid !important;
	grid-template-columns: 1fr auto 1fr !important;
	align-items: center !important;
	gap: 10px !important;
	margin: 0 0 14px !important;
	color: rgba(11, 31, 23, 0.56) !important;
	font-size: 12px !important;
	font-weight: 600 !important;
}

body.digit-login .login-divider::before,
body.digit-login .login-divider::after {
	content: "" !important;
	height: 1px !important;
	background: rgba(6, 78, 59, 0.10) !important;
}

body.digit-login .btn-login-option {
	width: 100% !important;
	background: rgba(10, 135, 84, 0.07) !important;
	border: 1px solid var(--digit-border) !important;
	color: var(--digit-brand-deep) !important;
}

body.digit-login .social-logins {
	margin-top: 18px !important;
	text-align: center !important;
}

@media (max-width: 560px) {
	body.digit-login main.container {
		padding: 28px 16px !important;
	}
	body.digit-login .login-content.page-card {
		padding: 22px !important;
	}
	body.digit-login .page-card-head .app-logo {
		width: 148px !important;
	}
}
