/* Shared Hirkan Home palette for login and registration pages. */
.hh-auth-page {
	--hh-auth-green: #176b52;
	--hh-auth-green-dark: #104c3d;
	--hh-auth-green-soft: #edf6f1;
	--hh-auth-ink: #20342e;
	--hh-auth-muted: #71817b;
	min-height: 100vh;
	background: radial-gradient(ellipse at 12% 12%, rgba(167, 210, 184, .24), transparent 34%), radial-gradient(ellipse at 92% 88%, rgba(23, 107, 82, .08), transparent 32%), #f4f8f5 !important;
	color: var(--hh-auth-ink);
}

.hh-auth-page .authentication-wrapper {
	min-height: 100vh;
}

.hh-auth-page .authentication-inner > .card {
	border: 1px solid #e4eee8;
	border-radius: 18px;
	background: rgba(255, 255, 255, .97);
	box-shadow: 0 22px 65px rgba(23, 75, 57, .11);
}

.hh-auth-page .card-body {
	padding: 2.25rem;
}

.hh-auth-page .app-brand {
	margin-bottom: 1.5rem;
}

.hh-auth-page .app-brand-text {
	color: var(--hh-auth-green) !important;
	letter-spacing: -.4px;
}

.hh-auth-page .divider .divider-text {
	color: var(--hh-auth-ink);
	font-weight: 700;
}

.hh-auth-page .divider .divider-text::before,
.hh-auth-page .divider .divider-text::after {
	border-color: #e5eee8;
}

.hh-auth-page .form-label,
.hh-auth-page .form-check-label {
	color: #40544b;
}

.hh-auth-page .form-control,
.hh-auth-page .input-group-text {
	border-color: #dce8e0;
	background-color: #fbfdfb;
}

.hh-auth-page .form-control {
	min-height: 44px;
	color: var(--hh-auth-ink);
}

.hh-auth-page .form-control:focus {
	border-color: #5f9d7e;
	background-color: #fff;
	box-shadow: 0 0 0 .2rem rgba(23, 107, 82, .12);
}

.hh-auth-page .input-group-text {
	color: var(--hh-auth-green);
}

.hh-auth-page .btn-primary {
	--bs-btn-bg: var(--hh-auth-green);
	--bs-btn-border-color: var(--hh-auth-green);
	--bs-btn-hover-bg: var(--hh-auth-green-dark);
	--bs-btn-hover-border-color: var(--hh-auth-green-dark);
	--bs-btn-active-bg: var(--hh-auth-green-dark);
	--bs-btn-active-border-color: var(--hh-auth-green-dark);
	min-height: 46px;
	border-radius: 9px;
	font-weight: 700;
	box-shadow: 0 8px 18px rgba(23, 107, 82, .16);
}

.hh-auth-page a:not(.app-brand-link) {
	color: var(--hh-auth-green);
}

.hh-auth-page a:not(.app-brand-link):hover {
	color: var(--hh-auth-green-dark);
}

.hh-auth-page .form-check-input:checked {
	border-color: var(--hh-auth-green);
	background-color: var(--hh-auth-green);
}

.hh-auth-page .text-primary,
.hh-auth-page .text-info {
	color: var(--hh-auth-green) !important;
}

.hh-auth-page .alert {
	border-radius: 10px;
}

.hh-auth-page .hh-demo-accounts {
	margin: 1.25rem 0 1.4rem;
	padding: 15px;
	border: 1px solid #e3eee7;
	border-radius: 14px;
	background: linear-gradient(145deg, #f7fbf8, #fff);
}

.hh-auth-page .hh-demo-heading {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 12px;
}

.hh-auth-page .hh-demo-heading-icon,
.hh-auth-page .hh-demo-role-icon {
	display: grid;
	flex: 0 0 auto;
	place-items: center;
	width: 34px;
	height: 34px;
	border-radius: 11px;
	background: #e8f3ed;
	color: var(--hh-auth-green);
	font-size: 18px;
}

.hh-auth-page .hh-demo-heading h2 {
	margin: 0 0 2px;
	color: var(--hh-auth-ink);
	font-size: 13px;
	font-weight: 800;
}

.hh-auth-page .hh-demo-heading p {
	margin: 0;
	color: var(--hh-auth-muted);
	font-size: 10px;
	line-height: 1.7;
}

.hh-auth-page .hh-demo-account-list {
	display: grid;
	gap: 8px;
}

.hh-auth-page .hh-demo-account {
	padding: 10px 11px 8px;
	border: 1px solid #e8efea;
	border-radius: 11px;
	background: #fff;
}

.hh-auth-page .hh-demo-account-top {
	display: flex;
	align-items: center;
	gap: 8px;
}

.hh-auth-page .hh-demo-role-icon {
	width: 29px;
	height: 29px;
	border-radius: 9px;
	font-size: 16px;
}

.hh-auth-page .hh-demo-partner .hh-demo-role-icon { background: #eef1fb; color: #5d6fa8; }
.hh-auth-page .hh-demo-consultant .hh-demo-role-icon { background: #fff3e6; color: #bd7a2c; }

.hh-auth-page .hh-demo-account-top strong {
	flex: 1;
	color: #344b40;
	font-size: 11px;
	font-weight: 800;
}

.hh-auth-page .hh-demo-use {
	padding: 5px 8px;
	border: 0;
	border-radius: 7px;
	background: #edf6f1;
	color: var(--hh-auth-green);
	font-family: inherit;
	font-size: 9px;
	font-weight: 700;
	cursor: pointer;
}

.hh-auth-page .hh-demo-use:hover { background: #dceee3; }

.hh-auth-page .hh-demo-credentials {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 7px;
	margin-top: 8px;
}

.hh-auth-page .hh-demo-credentials > div {
	min-width: 0;
	display: flex;
	align-items: center;
	gap: 5px;
	padding: 5px 7px;
	border-radius: 7px;
	background: #f7faf8;
}

.hh-auth-page .hh-demo-credentials > div > span {
	color: #829189;
	font-size: 9px;
}

.hh-auth-page .hh-demo-credentials code {
	flex: 1;
	color: #30443a;
	font-family: Arial, sans-serif;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: .2px;
}

.hh-auth-page .hh-demo-copy {
	width: 21px;
	height: 21px;
	padding: 0;
	border: 0;
	border-radius: 5px;
	background: transparent;
	color: #819188;
	font-size: 14px;
	cursor: pointer;
}

.hh-auth-page .hh-demo-copy:hover,
.hh-auth-page .hh-demo-copy.is-copied { background: #e4f1e9; color: var(--hh-auth-green); }

.hh-auth-page .hh-demo-copy-status {
	display: block;
	min-height: 13px;
	margin-top: 4px;
	color: var(--hh-auth-green);
	font-size: 9px;
}

.hh-auth-page #formAuthentication > .text-primary {
	padding: 10px 12px;
	border: 1px solid #dcece2;
	border-radius: 9px;
	background: var(--hh-auth-green-soft);
}

@media (max-width: 575px) {
	.hh-auth-page .card-body {
		padding: 1.5rem;
	}
	.hh-auth-page .hh-demo-accounts { padding: 12px; }
}
