:root {
	--ma-brand-primary: #0b1535;
	--ma-brand-secondary: #12265a;
	--ma-brand-accent: #2388ff;
	--ma-brand-soft: #eef4ff;
	--ma-brand-logo: url("/assets/magroups/images/ma-groups-logo.svg");
	--ma-brand-mark: url("/assets/magroups/images/ma-groups-mark.svg");
}

:root[data-ma-brand="losos"] {
	--ma-brand-primary: #a51857;
	--ma-brand-secondary: #74113f;
	--ma-brand-accent: #dfa52f;
	--ma-brand-soft: #fff5f9;
	--ma-brand-logo: url("/assets/magroups/images/losos-logo.png");
	--ma-brand-mark: url("/assets/magroups/images/losos-logo.png");
}

html[data-ma-brand] body,
html[data-ma-brand] input,
html[data-ma-brand] button,
html[data-ma-brand] textarea,
html[data-ma-brand] select {
	font-family: "Vazirmatn", "Inter", Tahoma, Arial, sans-serif !important;
}

html[data-ma-brand] .btn-primary,
html[data-ma-brand] .btn.btn-primary {
	background: linear-gradient(135deg, var(--ma-brand-primary), var(--ma-brand-secondary)) !important;
	border-color: var(--ma-brand-primary) !important;
	box-shadow: 0 12px 26px color-mix(in srgb, var(--ma-brand-primary) 20%, transparent) !important;
}

html[data-ma-brand] .btn-primary:hover,
html[data-ma-brand] .btn.btn-primary:hover {
	filter: brightness(1.08);
}

html[data-ma-brand] .form-control:focus,
html[data-ma-brand] .input-with-feedback:focus {
	border-color: var(--ma-brand-accent) !important;
	box-shadow: 0 0 0 4px color-mix(in srgb, var(--ma-brand-accent) 14%, transparent) !important;
}

html[data-ma-brand] .navbar-home img,
html[data-ma-brand] .navbar-brand img,
html[data-ma-brand] .app-logo img {
	content: var(--ma-brand-mark) !important;
	object-fit: contain !important;
}

html[data-ma-brand="losos"] .navbar-home img,
html[data-ma-brand="losos"] .navbar-brand img,
html[data-ma-brand="losos"] .app-logo img {
	width: 68px !important;
	max-width: 68px !important;
	height: 38px !important;
	max-height: 38px !important;
}

html[data-ma-brand] #startup img,
html[data-ma-brand] .splash img,
html[data-ma-brand] .splash-screen img,
html[data-ma-brand] .app-loading img,
html[data-ma-brand] .frappe-loader img,
html[data-ma-brand] .page-card-head img {
	content: var(--ma-brand-logo) !important;
	object-fit: contain !important;
}

html[data-ma-brand="losos"] body,
html[data-ma-brand="losos"] .for-login,
html[data-ma-brand="losos"] .for-forgot,
html[data-ma-brand="losos"] .for-signup {
	background:
		radial-gradient(circle at 12% 10%, rgb(223 165 47 / 16%), transparent 32%),
		radial-gradient(circle at 88% 86%, rgb(26 148 151 / 14%), transparent 32%),
		linear-gradient(145deg, #fffafd 0%, #f9f4f7 100%) !important;
}

html[data-ma-brand="losos"] .page-card-head img {
	width: min(330px, 78vw) !important;
	height: 150px !important;
	max-width: 330px !important;
	max-height: 150px !important;
	margin: 0 auto 18px !important;
}

html[data-ma-brand="losos"] .page-card-head::before {
	content: "Welcome to LOSOS" !important;
	color: var(--ma-brand-primary) !important;
}

html[data-ma-brand="losos"] .page-card-head::after {
	content: "Secure access to LOSOS Trading Group" !important;
	color: #665b62 !important;
}

html[data-ma-brand="magroups"] .page-card-head::before {
	content: "Welcome to MA Groups" !important;
}

html[data-ma-brand="magroups"] .page-card-head::after {
	content: "Secure access to your business workspace" !important;
}

html[data-ma-brand="losos"] .page-card,
html[data-ma-brand="losos"] .login-content .page-card {
	border: 1px solid rgb(165 24 87 / 10%) !important;
	box-shadow: 0 28px 72px rgb(81 16 47 / 16%) !important;
}

html[data-ma-brand="losos"] a {
	color: var(--ma-brand-primary) !important;
}

@media (max-width: 768px) {
	html[data-ma-brand="losos"] .page-card-head img {
		height: 112px !important;
		max-height: 112px !important;
	}
}