/**
 * Lucent Login Page Styles
 * CSS-only overrides for Frappe's default login page
 */

/* ============================================
   CSS Variables
   ============================================ */
:root {
	--lucent-bg: #faf8f4;
	--lucent-card-bg: #fff;
	--lucent-border: #e8e4dc;
	--lucent-text: #333;
	--lucent-text-muted: #888;
	--lucent-primary: #1a1a1a;
	--lucent-input-bg: #fafafa;
}

/* ============================================
   Login Page Background
   ============================================ */
#page-login {
	background-color: var(--lucent-bg) !important;
	background-image: none !important;
	min-height: 100vh;
}

/* ============================================
   Hide Navbar on Login
   ============================================ */
#page-login ~ nav {
	display: none !important;
}

[frappe-session-status='logged-out'] nav {
	display: none !important;
}

[frappe-session-status='logged-out'] .navbar {
	display: none !important;
}

/* ============================================
   Hide Footer on Login
   ============================================ */
[frappe-session-status='logged-out'] .web-footer {
	display: none !important;
}

[frappe-session-status='logged-out'] footer {
	display: none !important;
}

/* Hide powered by */
.footer-powered {
	display: none !important;
}

/* ============================================
   Login Card Styling
   ============================================ */
.page-card {
	background-color: var(--lucent-card-bg) !important;
	border: none !important;
	border-radius: 8px !important;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
	max-width: 420px !important;
	padding: 40px !important;
}

.page-card-body {
	padding: 0 !important;
}

/* ============================================
   Logo/Title Area - Replace Frappe branding
   ============================================ */
.page-card-head {
	text-align: center !important;
	margin-bottom: 32px !important;
	padding: 0 !important;
}

/* Hide the Frappe logo */
.page-card-head .app-logo {
	display: none !important;
}

/* Hide original "Login to Frappe" title */
.page-card-head h4 {
	display: none !important;
}

/* Add Lucent branding using ::before on the card head */
.page-card-head::before {
	content: 'Lucént' !important;
	font-family: 'Playfair Display', Georgia, serif !important;
	font-size: 40px !important;
	font-weight: 400 !important;
	color: #000 !important;
	display: block !important;
	margin-bottom: 8px !important;
}

.page-card-head::after {
	content: 'Sign in to your account' !important;
	font-family:
		'Inter',
		-apple-system,
		BlinkMacSystemFont,
		sans-serif !important;
	font-size: 14px !important;
	font-weight: 400 !important;
	color: var(--lucent-text-muted) !important;
	display: block !important;
}

/* ============================================
   Form Labels
   ============================================ */
.page-card label,
.login-content label,
#page-login label {
	font-family:
		'Inter',
		-apple-system,
		BlinkMacSystemFont,
		sans-serif !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	color: #000 !important;
	margin-bottom: 8px !important;
}

/* ============================================
   Form Inputs
   ============================================ */
.page-card .form-control,
.login-content .form-control,
#page-login .form-control,
#page-login input[type='email'],
#page-login input[type='password'],
#page-login input[type='text'] {
	font-family:
		'Inter',
		-apple-system,
		BlinkMacSystemFont,
		sans-serif !important;
	font-size: 14px !important;
	padding: 14px 16px !important;
	border: 1px solid var(--lucent-border) !important;
	border-radius: 6px !important;
	background-color: var(--lucent-input-bg) !important;
	color: var(--lucent-text) !important;
	height: auto !important;
	box-shadow: none !important;
	transition: border-color 0.2s !important;
}

.page-card .form-control:focus,
#page-login .form-control:focus,
#page-login input:focus {
	border-color: #999 !important;
	outline: none !important;
	box-shadow: none !important;
	background-color: #fff !important;
}

/* Style input fields with icons */
#page-login .email-field,
#page-login .password-field,
.page-card .email-field,
.page-card .password-field {
	display: flex !important;
	align-items: center !important;
	gap: 12px !important;
	position: relative !important;
}

/* Style field icons */
#page-login .field-icon,
.page-card .field-icon {
	flex-shrink: 0 !important;
	width: 16px !important;
	height: 16px !important;
	color: #666 !important;
}

/* Ensure input takes remaining space */
#page-login .email-field .form-control,
#page-login .password-field .form-control,
.page-card .email-field .form-control,
.page-card .password-field .form-control {
	flex: 1 !important;
	border-radius: 6px !important;
}

/* Style show password button */
#page-login .toggle-password,
.page-card .toggle-password {
	font-family:
		'Inter',
		-apple-system,
		BlinkMacSystemFont,
		sans-serif !important;
	font-size: 12px !important;
	color: #666 !important;
	cursor: pointer !important;
	margin-left: auto !important;
	padding-left: 8px !important;
	flex-shrink: 0 !important;
}

/* ============================================
   Form Groups
   ============================================ */
#page-login .form-group,
.page-card .form-group {
	margin-bottom: 20px !important;
}

/* ============================================
   Primary Button (Login)
   ============================================ */
#page-login .btn-primary,
.page-card .btn-primary,
.login-content .btn-primary {
	font-family:
		'Inter',
		-apple-system,
		BlinkMacSystemFont,
		sans-serif !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	padding: 14px 24px !important;
	background-color: var(--lucent-primary) !important;
	color: #fff !important;
	border: none !important;
	border-radius: 6px !important;
	width: 100% !important;
	cursor: pointer !important;
	transition: background-color 0.2s !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	margin-top: 8px !important;
}

#page-login .btn-primary:hover,
#page-login .btn-primary:active,
#page-login .btn-primary:focus,
.page-card .btn-primary:hover {
	background-color: #333 !important;
	color: #fff !important;
	box-shadow: none !important;
}

/* ============================================
   Secondary/Outline Buttons
   ============================================ */
#page-login .btn-default,
#page-login .btn-secondary,
.page-card .btn-default {
	font-family:
		'Inter',
		-apple-system,
		BlinkMacSystemFont,
		sans-serif !important;
	font-size: 14px !important;
	padding: 14px 24px !important;
	background-color: transparent !important;
	color: var(--lucent-text) !important;
	border: 1px solid var(--lucent-border) !important;
	border-radius: 6px !important;
	width: 100% !important;
}

#page-login .btn-default:hover,
.page-card .btn-default:hover {
	background-color: #f5f3ef !important;
	border-color: #ddd !important;
}

/* ============================================
   Forgot Password Link
   ============================================ */
#page-login .forgot-password-link,
#page-login a.text-muted,
.page-card a.text-muted {
	font-family:
		'Inter',
		-apple-system,
		BlinkMacSystemFont,
		sans-serif !important;
	font-size: 13px !important;
	color: #666 !important;
	text-decoration: none !important;
}

#page-login .forgot-password-link:hover,
#page-login a.text-muted:hover {
	color: #333 !important;
	text-decoration: underline !important;
}

/* ============================================
   Hide Extra Elements
   ============================================ */
/* Hide "or" divider and email link button */
#page-login .or-section,
#page-login .divider,
.page-card .or-section,
.for-email-link {
	display: none !important;
}

/* Hide signup section */
.for-signup,
#page-login .for-signup {
	display: none !important;
}

/* Hide forgot password form (keep the link) */
.for-forgot-password {
	display: none !important;
}

/* ============================================
   Sign Up Link (if visible)
   ============================================ */
.sign-up-message > a {
	color: var(--lucent-primary) !important;
}

/* ============================================
   Error Messages
   ============================================ */
#page-login .alert,
.page-card .alert {
	font-family:
		'Inter',
		-apple-system,
		BlinkMacSystemFont,
		sans-serif !important;
	font-size: 14px !important;
	border-radius: 6px !important;
	padding: 12px 16px !important;
	margin-bottom: 20px !important;
}

#page-login .alert-danger,
.page-card .alert-danger {
	background-color: #fef2f2 !important;
	border: 1px solid #fecaca !important;
	color: #b91c1c !important;
}

/* ============================================
   Main Section Centering
   ============================================ */
#page-login .main-section,
[frappe-session-status='logged-out'] .main-section {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	min-height: 100vh !important;
	padding: 40px 20px !important;
	background-color: var(--lucent-bg) !important;
}

/* ============================================
   Container Reset
   ============================================ */
#page-login .container,
#page-login .web-container {
	max-width: none !important;
	padding: 0 !important;
}