/**
 * Formularstile. Bewusst eigenstaendig, damit das Formular auch unter
 * einem anderen Theme brauchbar aussieht. Farben kommen aus dem Theme,
 * wo es welche gibt, sonst greifen die Rueckfallwerte.
 */

.rsk {
	--rsk-ink: var(--rs-ink, #1c2226);
	--rsk-muted: var(--rs-ink-muted, #56626a);
	--rsk-line: var(--rs-line-strong, #c3cdcb);
	--rsk-accent: var(--rs-teal, #0f5b55);
	--rsk-accent-dark: var(--rs-teal-dark, #0a423e);
	--rsk-error: #a4262c;
	--rsk-ok-bg: #e7efee;
	--rsk-error-bg: #fbeceb;

	max-width: 100%;
}

.rsk-form { margin: 0; }

.rsk-field { margin: 0 0 1.25rem; }

.rsk-field label {
	display: block;
	font-weight: 600;
	margin-bottom: .35rem;
	color: var(--rsk-ink);
}

.rsk-field input[type="text"],
.rsk-field input[type="email"],
.rsk-field select,
.rsk-field textarea {
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	font: inherit;
	color: var(--rsk-ink);
	background: #fff;
	border: 1px solid var(--rsk-line);
	border-radius: 4px;
	padding: .7rem .85rem;
}

.rsk-field textarea { min-height: 11rem; resize: vertical; }

.rsk-field input:focus,
.rsk-field select:focus,
.rsk-field textarea:focus { border-color: var(--rsk-accent); }

.rsk-field [aria-invalid="true"] { border-color: var(--rsk-error); }

.rsk-field--check label {
	display: flex;
	align-items: flex-start;
	gap: .6rem;
	font-weight: 400;
	line-height: 1.5;
}
.rsk-field--check input { margin-top: .25rem; flex: 0 0 auto; }

.rsk-req { color: var(--rsk-accent); }

.rsk-error {
	display: block;
	margin-top: .35rem;
	color: var(--rsk-error);
	font-size: .92rem;
	font-weight: 600;
}

.rsk-hint {
	display: block;
	margin-top: .6rem;
	color: var(--rsk-muted);
	font-size: .9rem;
}

.rsk-actions { margin: 1.5rem 0 0; }

.rsk-submit {
	font: inherit;
	font-weight: 600;
	background: var(--rsk-accent);
	color: #fff;
	border: 2px solid var(--rsk-accent);
	border-radius: 4px;
	padding: .8rem 1.5rem;
	cursor: pointer;
}
.rsk-submit:hover { background: var(--rsk-accent-dark); border-color: var(--rsk-accent-dark); }
.rsk-submit[disabled] { opacity: .6; cursor: progress; }

.rsk-message {
	padding: 1.1rem 1.35rem;
	margin: 0 0 1.75rem;
	border-left: 4px solid var(--rsk-accent);
	background: var(--rsk-ok-bg);
}
.rsk-message > *:last-child { margin-bottom: 0; }
.rsk-message > *:first-child { margin-top: 0; }

.rsk-message--error {
	border-left-color: var(--rsk-error);
	background: var(--rsk-error-bg);
}
.rsk-message--error a { color: var(--rsk-error); }
.rsk-message--error ul { margin: .5rem 0 0; padding-left: 1.2rem; }

.rsk-message--info { border-left-color: var(--rsk-muted); background: #f2f4f4; }

.rsk-message:focus-visible { outline: 3px solid var(--rsk-accent); outline-offset: 3px; }

/* Der Koeder gegen automatisierte Sendungen: fuer Menschen nicht
   sichtbar, fuer Bildschirmleser ausgeblendet, nicht per Tabulator
   erreichbar — aber im Quelltext vorhanden. */
.rsk-trap {
	position: absolute !important;
	left: -9999px !important;
	top: auto;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* Editor-Karte */
.rsk-editor-card {
	border: 1px dashed #c3cdcb;
	border-radius: 4px;
	padding: 1.25rem 1.5rem;
	background: #f7f9f9;
	color: #1c2226;
}
.rsk-editor-card p { margin: .4rem 0 0; }
.rsk-editor-card__hint { color: #56626a; font-size: .9em; }