/* ==========================================================================
   OmniLedger — login / signup / forgot-password restyle ("Emerald Ledger").
   Loaded on web pages via Website Settings.head_html and scoped to
   body[data-path="login"] so it never bleeds into /omniledger or other pages.
   head_html renders before login.bundle.css, so selectors are scoped +
   high-specificity (and use !important on the few props the bundle also sets).
   Tokens mirror src/omniledger-web/src/styles.css (Direction A, light).
   ========================================================================== */
@import url("https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&display=swap");

body[data-path="login"] {
	--ol-bg: #ffffff;
	--ol-surface: #ffffff;
	--ol-ink: #111111;
	--ol-ink-muted: #555555;
	--ol-line: #e5e5e5;
	--ol-accent: #047857;
	--ol-accent-strong: #065f46;
	--ol-accent-soft: #ecfdf5;
	--ol-font: "Space Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

	background: var(--ol-bg) !important;
	color: var(--ol-ink);
	font-family: var(--ol-font) !important;
}

body[data-path="login"] #page-login,
body[data-path="login"] .for-login,
body[data-path="login"] .for-signup,
body[data-path="login"] .for-forgot,
body[data-path="login"] .for-email-login {
	font-family: var(--ol-font);
}

/* Card */
body[data-path="login"] .page-card {
	background: var(--ol-surface);
	border: 1px solid var(--ol-line) !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}

/* Logo + heading */
body[data-path="login"] .page-card-head .app-logo {
	width: auto;
	height: 34px;
	max-width: 230px;
	margin-bottom: 14px;
}

body[data-path="login"] .page-card-head h4 {
	font-family: var(--ol-font);
	font-weight: 600;
	letter-spacing: -0.01em;
	color: var(--ol-ink);
}

/* Inputs */
body[data-path="login"] .form-control {
	border: 1px solid var(--ol-line) !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	background: var(--ol-surface);
	color: var(--ol-ink);
	font-family: var(--ol-font);
}

body[data-path="login"] .form-control:focus {
	border-color: var(--ol-accent) !important;
	box-shadow: 0 0 0 1px var(--ol-accent) !important;
	outline: none;
}

/* Primary actions */
body[data-path="login"] .btn-primary,
body[data-path="login"] .btn-login,
body[data-path="login"] .btn-forgot {
	background: var(--ol-accent) !important;
	border: 1px solid var(--ol-accent) !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	color: #ffffff !important;
	font-family: var(--ol-font);
	font-weight: 600;
	letter-spacing: 0.01em;
}

body[data-path="login"] .btn-primary:hover,
body[data-path="login"] .btn-primary:focus,
body[data-path="login"] .btn-login:hover,
body[data-path="login"] .btn-login:focus,
body[data-path="login"] .btn-forgot:hover,
body[data-path="login"] .btn-forgot:focus {
	background: var(--ol-accent-strong) !important;
	border-color: var(--ol-accent-strong) !important;
	color: #ffffff !important;
}

/* Secondary / social / LDAP buttons */
body[data-path="login"] .btn-default,
body[data-path="login"] .btn-login-option {
	border: 1px solid var(--ol-line) !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	font-family: var(--ol-font);
	color: var(--ol-ink);
}

body[data-path="login"] .btn-default:hover,
body[data-path="login"] .btn-login-option:hover {
	background: var(--ol-accent-soft) !important;
	border-color: var(--ol-accent) !important;
	color: var(--ol-accent-strong) !important;
}

/* Links */
body[data-path="login"] .forgot-password-message a,
body[data-path="login"] .sign-up-message a,
body[data-path="login"] a[href="#login"],
body[data-path="login"] a[href="#signup"],
body[data-path="login"] a[href="#forgot"] {
	color: var(--ol-accent);
	font-weight: 600;
}

body[data-path="login"] .forgot-password-message a:hover,
body[data-path="login"] .sign-up-message a:hover,
body[data-path="login"] a[href="#login"]:hover,
body[data-path="login"] a[href="#signup"]:hover,
body[data-path="login"] a[href="#forgot"]:hover {
	color: var(--ol-accent-strong);
	text-decoration: underline;
}

/* Misc chrome */
body[data-path="login"] .login-divider,
body[data-path="login"] .toggle-password,
body[data-path="login"] .text-muted {
	color: var(--ol-ink-muted) !important;
}

body[data-path="login"] .indicator.gray {
	border-radius: 0;
}