/* Unisoft login / website branding */
@import url("https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,400;0,9..40,500;0,9..40,600;0,9..40,700&family=Fraunces:opsz,wght@9..144,600;9..144,700&display=swap");

:root {
	--unisoft-ink: #152820;
	--unisoft-slate: #1e3a32;
	--unisoft-teal: #3d8f7c;
	--unisoft-teal-deep: #2f7263;
	--unisoft-accent: #f06a3d;
}

body {
	font-family: "DM Sans", system-ui, sans-serif !important;
}

body[data-path="login"],
body[data-path="login/"] {
	background:
		radial-gradient(1200px 600px at 10% 10%, rgba(61, 143, 124, 0.38), transparent 55%),
		radial-gradient(900px 500px at 90% 80%, rgba(47, 114, 99, 0.28), transparent 50%),
		linear-gradient(145deg, var(--unisoft-ink) 0%, var(--unisoft-slate) 48%, #0f1c18 100%) !important;
	min-height: 100vh;
}

body[data-path="login"] .navbar,
body[data-path="login"] .web-footer {
	display: none !important;
}

body[data-path="login"] .page-content-wrapper {
	min-height: 100vh !important;
	padding: 0 !important;
	display: flex;
	align-items: center;
	justify-content: center;
}

/* Brand mark */
body[data-path="login"] .page-content-wrapper::before {
	content: "Mezan ERP";
	position: fixed;
	left: clamp(24px, 6vw, 72px);
	top: clamp(28px, 8vh, 80px);
	z-index: 0;
	font-family: "Fraunces", Georgia, serif;
	font-size: clamp(2.4rem, 5vw, 4rem);
	font-weight: 700;
	letter-spacing: -0.03em;
	line-height: 1.05;
	color: rgba(255, 255, 255, 0.92);
	pointer-events: none;
}

/* Tagline — sit clearly below the brand (brand top + brand size + gap) */
body[data-path="login"] .page-content-wrapper::after {
	content: "Business systems that stay clear and under your control.";
	position: fixed;
	left: clamp(24px, 6vw, 72px);
	top: calc(clamp(28px, 8vh, 80px) + clamp(2.4rem, 5vw, 4rem) + 1.75rem);
	z-index: 0;
	max-width: 340px;
	font-size: 1.05rem;
	line-height: 1.5;
	color: rgba(232, 242, 240, 0.78);
	pointer-events: none;
}

@media (max-width: 900px) {
	body[data-path="login"] .page-content-wrapper::before,
	body[data-path="login"] .page-content-wrapper::after {
		display: none;
	}
}

body[data-path="login"] .for-login,
body[data-path="login"] .for-forgot,
body[data-path="login"] .for-signup,
body[data-path="login"] .for-login-with-email-link,
body[data-path="login"] .for-email-login,
body[data-path="login"] .for-reset-password {
	position: relative;
	z-index: 1;
	width: 100%;
	display: flex;
	justify-content: flex-end;
	padding: clamp(20px, 4vw, 48px);
}

@media (max-width: 900px) {
	body[data-path="login"] .for-login,
	body[data-path="login"] .for-forgot,
	body[data-path="login"] .for-signup {
		justify-content: center;
		padding: 16px;
	}
}

body[data-path="login"] .page-card {
	background: rgba(255, 255, 255, 0.96) !important;
	border: 1px solid rgba(15, 28, 36, 0.08) !important;
	border-radius: 20px !important;
	box-shadow: 0 24px 60px rgba(0, 0, 0, 0.28) !important;
	max-width: 420px !important;
	padding: 36px 32px !important;
}

body[data-path="login"] .page-card-head-text h4 {
	font-family: "Fraunces", Georgia, serif !important;
	font-size: 1.85rem !important;
	font-weight: 700 !important;
	color: var(--unisoft-ink) !important;
}

body[data-path="login"] .form-control {
	border-radius: 12px !important;
	border: 1px solid rgba(15, 28, 36, 0.14) !important;
	background: #f7fbfa !important;
	min-height: 46px !important;
}

body[data-path="login"] .form-control:focus {
	border-color: var(--unisoft-teal) !important;
	box-shadow: 0 0 0 3px rgba(31, 138, 122, 0.18) !important;
}

body[data-path="login"] .es-button[data-variant="solid"],
body[data-path="login"] button[type="submit"] {
	background: linear-gradient(180deg, var(--unisoft-teal) 0%, var(--unisoft-teal-deep) 100%) !important;
	border: none !important;
	border-radius: 12px !important;
	min-height: 46px !important;
	color: #fff !important;
	box-shadow: 0 10px 24px rgba(20, 104, 92, 0.28) !important;
}

body[data-path="login"] a {
	color: var(--unisoft-teal-deep) !important;
}

/* ---------- Website pages (non-login) ---------- */
body:not([data-path="login"]):not([data-path="login/"]) {
	background: #f5f9f8 !important;
	color: var(--unisoft-ink);
}

body:not([data-path="login"]):not([data-path="login/"]) .navbar {
	background: linear-gradient(90deg, var(--unisoft-ink), var(--unisoft-slate)) !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.16) !important;
}

body:not([data-path="login"]) .navbar .nav-link,
body:not([data-path="login"]) .navbar .navbar-brand,
body:not([data-path="login"]) .navbar a {
	color: rgba(255, 255, 255, 0.92) !important;
}

body:not([data-path="login"]) .web-footer,
body:not([data-path="login"]) footer {
	background: var(--unisoft-ink) !important;
	color: rgba(232, 242, 240, 0.78) !important;
	border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
}

body:not([data-path="login"]) .web-footer a,
body:not([data-path="login"]) footer a {
	color: #7fd4c4 !important;
}

body:not([data-path="login"]) h1,
body:not([data-path="login"]) h2,
body:not([data-path="login"]) h3 {
	font-family: "Fraunces", Georgia, serif !important;
	color: var(--unisoft-ink) !important;
	letter-spacing: -0.02em;
}

body:not([data-path="login"]) .page-card,
body:not([data-path="login"]) .card,
body:not([data-path="login"]) .web-page-content .section,
body:not([data-path="login"]) .blog-card,
body:not([data-path="login"]) .website-list .col {
	background: #fff !important;
	border: 1px solid rgba(15, 28, 36, 0.08) !important;
	border-radius: 16px !important;
	box-shadow: 0 10px 28px rgba(15, 28, 36, 0.06) !important;
}

body:not([data-path="login"]) .btn-primary,
body:not([data-path="login"]) .btn.btn-primary {
	background: linear-gradient(180deg, var(--unisoft-teal), var(--unisoft-teal-deep)) !important;
	border: none !important;
	border-radius: 10px !important;
	color: #fff !important;
}

body:not([data-path="login"]) .form-control:focus {
	border-color: var(--unisoft-teal) !important;
	box-shadow: 0 0 0 3px rgba(31, 138, 122, 0.18) !important;
}

body:not([data-path="login"]) a {
	color: var(--unisoft-teal-deep);
}