/* ================================================== *
 * MARK: 1. Container
 * -------------------------------------------------- */
.kp--login-ctn {
	max-width: calc(320px + 2 * var(--cvh-space-m));
	padding: var(--cvh-space-m);
	margin-inline: auto;
	background-color: var(--base-ultra-light);
	border-radius: var(--cvh-border-radius-m);
}


/* ================================================== *
 * MARK: 2. Formular
 * -------------------------------------------------- */
.kp--login-ctn form input:is([type="text"], [type="password"]) {
	width: 100%;
	padding: calc(var(--cvh-space-xs) / 3) var(--cvh-space-xs);
}


/* ================================================== *
 * MARK: 3. Button
 * -------------------------------------------------- */
.kp--login-ctn form input[type="submit"] {
	padding: calc(var(--cvh-space-xs) / 2) var(--cvh-space-xs);
}


/* ══════════════════════════════════════════════════ *
 * MARK: 4. Combined Login
 * ────────────────────────────────────────────────── */
.cvh--combined-login__root {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	justify-content: center;
	gap: var(--cvh-space-m);
}

button[data-login-form-element="toggle"] {
	border: none;
	background-color: transparent;
	color: var(--cvh-color-primary);
	cursor: pointer;
	box-shadow: unset;
}

#resetpassform {
	display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: stretch;
    justify-content: flex-start;
    gap: 15px;
}


/* ══════════════════════════════════════════════════ *
 * MARK: 5. WordPress Styles
 * ────────────────────────────────────────────────── */
.description.indicator-hint {
	font-size: var(--text-s);
}

.notice.notice-error {
	--notice-accent-color: #E2003B
}

.notice.notice-warning {
	--notice-accent-color: #d63638;
}

.notice.notice-info {
	--notice-accent-color: #72aee6;
}

.notice.notice-success {
	--notice-accent-color: #51b134;
}

.message, .notice {
    border-left: 4px solid var(--notice-accent-color, #72aee6);
    padding: 12px;
    margin-left: 0;
    margin-bottom: 20px;
    background-color: color-mix(in srgb, var(--notice-accent-color, #72aee6) 15%, rgb(255, 255, 255));
    box-shadow: 0 1px 1px 0 rgba(0,0,0,.1);
    word-wrap: break-word;
	font-size: var(--text-s);
}