/* Medpoint rendipäringu vorm */
.mri-wrap {
	--mri-brand: #3d3c6c;
	--mri-brand-soft: #ececf4;
	--mri-border: #e2e4ea;
	--mri-text: #1f2433;
	--mri-muted: #6b7280;
	margin: 22px 0;
	font-family: inherit;
}

/* [hidden] peab võitma allpool olevad display-reeglid (nt .mri-btn-loading),
   muidu jääb "Saadan…" nähtavale kohe lehe avamisel. */
.mri-wrap [hidden] {
	display: none !important;
}

.mri-form {
	border: 1px solid var(--mri-border);
	border-radius: 14px;
	background: #fff;
	overflow: hidden;
	box-shadow: 0 1px 2px rgba(16, 24, 40, .04);
}

.mri-head {
	background: var(--mri-brand);
	padding: 16px 20px;
}

.mri-title {
	margin: 0;
	font-size: 17px;
	line-height: 1.3;
	font-weight: 600;
	color: #fff;
}

.mri-sub {
	margin: 4px 0 0;
	font-size: 13px;
	line-height: 1.45;
	color: rgba(255, 255, 255, .82);
}

.mri-body {
	padding: 18px 20px 20px;
}

.mri-body--done > *:not(.mri-msg) {
	display: none;
}

.mri-row {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
}

.mri-row > .mri-field {
	flex: 1 1 190px;
	min-width: 0;
}

.mri-field {
	margin: 0 0 14px;
}

.mri-field > label,
.mri-fieldset > legend {
	display: block;
	margin: 0 0 6px;
	padding: 0;
	font-size: 13px;
	font-weight: 600;
	color: var(--mri-text);
}

.mri-req {
	color: #d92d20;
}

.mri-field input[type="text"],
.mri-field input[type="email"],
.mri-field input[type="date"],
.mri-field textarea {
	width: 100%;
	box-sizing: border-box;
	padding: 10px 12px;
	border: 1px solid var(--mri-border);
	border-radius: 8px;
	background: #fff;
	font-size: 15px;
	line-height: 1.4;
	color: var(--mri-text);
	transition: border-color .15s, box-shadow .15s;
	-webkit-appearance: none;
	appearance: none;
	min-height: 42px;
}

.mri-field textarea {
	resize: vertical;
	min-height: 72px;
}

.mri-field input:focus,
.mri-field textarea:focus {
	outline: none;
	border-color: var(--mri-brand);
	box-shadow: 0 0 0 3px rgba(61, 60, 108, .12);
}

.mri-fieldset {
	border: 0;
	padding: 0;
	margin: 0 0 14px;
}

.mri-days {
	margin: -4px 0 14px;
	font-size: 13px;
	font-weight: 600;
	color: var(--mri-brand);
}

.mri-radios,
.mri-checks {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.mri-checks {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
	gap: 6px 12px;
}

.mri-radio,
.mri-check {
	display: flex;
	align-items: flex-start;
	gap: 9px;
	padding: 8px 10px;
	border: 1px solid var(--mri-border);
	border-radius: 8px;
	font-size: 14px;
	line-height: 1.4;
	color: var(--mri-text);
	cursor: pointer;
	transition: border-color .15s, background .15s;
	margin: 0;
}

.mri-radio:hover,
.mri-check:hover {
	border-color: var(--mri-brand);
}

.mri-radio input,
.mri-check input {
	margin: 2px 0 0;
	flex: 0 0 auto;
	accent-color: var(--mri-brand);
}

.mri-radio:has(input:checked),
.mri-check:has(input:checked) {
	border-color: var(--mri-brand);
	background: var(--mri-brand-soft);
}

.mri-consent {
	display: flex;
	align-items: flex-start;
	gap: 9px;
	margin: 4px 0 16px;
	font-size: 13px;
	line-height: 1.5;
	color: var(--mri-muted);
	cursor: pointer;
}

.mri-consent input {
	margin: 2px 0 0;
	flex: 0 0 auto;
	accent-color: var(--mri-brand);
}

.mri-consent a {
	color: var(--mri-brand);
	text-decoration: underline;
}

.mri-hp {
	position: absolute !important;
	left: -9999px !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.mri-submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	padding: 13px 22px;
	border: 0;
	border-radius: 8px;
	background: var(--mri-brand);
	color: #fff;
	font-size: 15px;
	font-weight: 600;
	line-height: 1;
	cursor: pointer;
	transition: opacity .15s, transform .05s;
}

.mri-submit:hover:not(:disabled) {
	opacity: .9;
}

.mri-submit:active:not(:disabled) {
	transform: translateY(1px);
}

.mri-submit:disabled {
	opacity: .6;
	cursor: default;
}

.mri-btn-loading {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.mri-note {
	margin: 10px 0 0;
	font-size: 12px;
	line-height: 1.5;
	color: var(--mri-muted);
	text-align: center;
}

.mri-msg {
	margin: 14px 0 0;
	padding: 12px 14px;
	border-radius: 8px;
	font-size: 14px;
	line-height: 1.5;
}

.mri-msg--success {
	background: #ecfdf3;
	border: 1px solid #abefc6;
	color: #067647;
}

.mri-msg--error {
	background: #fef3f2;
	border: 1px solid #fecdca;
	color: #b42318;
}

.mri-body--done .mri-msg {
	margin-top: 0;
}

@media (max-width: 480px) {
	.mri-row > .mri-field {
		flex: 1 1 100%;
	}

	.mri-checks {
		grid-template-columns: 1fr;
	}
}