/* Mieterselbstauskunft – Formular. Farbe über --imsa-accent anpassbar. */
.imsa {
	--imsa-accent: #1f5f8b;
	--imsa-error: #b42318;
	--imsa-border: rgba(127, 127, 127, .35);
	--imsa-soft: rgba(127, 127, 127, .07);
	--imsa-radius: 8px;
	max-width: 900px;
}
.imsa, .imsa *, .imsa *::before, .imsa *::after { box-sizing: border-box; }
.imsa-intro { margin-bottom: 24px; }

.imsa-section { border: 1px solid var(--imsa-border); border-radius: var(--imsa-radius); padding: 18px 20px 8px; margin: 0 0 22px; min-width: 0; }
.imsa-section > legend { font-weight: 700; font-size: 1.1em; padding: 0 8px; margin-left: -8px; }
.imsa-nr { display: inline-flex; align-items: center; justify-content: center; width: 1.7em; height: 1.7em; border-radius: 50%; background: var(--imsa-accent); color: #fff; font-size: .8em; margin-right: 4px; vertical-align: 1px; }

.imsa-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 0 16px; }
.imsa-grid[hidden] { display: none; }
.imsa-field { grid-column: span 12; margin-bottom: 14px; min-width: 0; }
.imsa-field[hidden] { display: none; }
@media (min-width: 640px) {
	.imsa-w-half { grid-column: span 6; }
	.imsa-w-third { grid-column: span 4; }
	.imsa-w-quarter { grid-column: span 3; }
	.imsa-w-sixth { grid-column: span 2; }
}
@media (min-width: 640px) and (max-width: 860px) {
	.imsa-w-quarter { grid-column: span 6; }
	.imsa-w-sixth { grid-column: span 4; }
}

.imsa-field > label, .imsa-yesno legend { display: block; font-weight: 600; font-size: .92em; margin-bottom: 5px; }
.imsa input[type=text], .imsa input[type=email], .imsa input[type=tel], .imsa input[type=date],
.imsa input[type=number], .imsa select, .imsa textarea {
	width: 100%; font: inherit; font-size: 1rem; padding: .6em .7em; line-height: 1.3;
	border: 1px solid var(--imsa-border); border-radius: 6px; background: #fff; color: #1e1e1e; min-height: 44px;
}
.imsa input:focus, .imsa select:focus, .imsa textarea:focus { outline: 2px solid var(--imsa-accent); outline-offset: 1px; border-color: var(--imsa-accent); }
.imsa-req { color: var(--imsa-error); }
.imsa-hint { font-size: .85em; opacity: .75; margin: 4px 0 0; }
.imsa-error { color: var(--imsa-error); font-size: .88em; font-weight: 600; margin: 4px 0 0; }
.imsa-has-error input, .imsa-has-error select, .imsa-has-error textarea { border-color: var(--imsa-error); }

.imsa-yesno { border: 0; padding: 0; margin: 0; }
.imsa-yesno legend { padding: 0; }
.imsa-yesno-opts { display: flex; gap: 10px; }
.imsa-yesno-opts label { display: inline-flex; align-items: center; gap: 8px; padding: .5em 1.1em; border: 1px solid var(--imsa-border); border-radius: 6px; cursor: pointer; min-height: 44px; }
.imsa-yesno-opts label:has(input:checked) { border-color: var(--imsa-accent); background: var(--imsa-soft); font-weight: 600; }
.imsa-has-error .imsa-yesno-opts label { border-color: var(--imsa-error); }

.imsa-check { display: flex; gap: 10px; align-items: flex-start; cursor: pointer; line-height: 1.45; }
.imsa-check input { width: 20px; height: 20px; margin: 2px 0 0; flex: 0 0 auto; accent-color: var(--imsa-accent); }
.imsa-toggle { margin-bottom: 16px; padding: 10px 12px; background: var(--imsa-soft); border-radius: 6px; }

.imsa-uploads { display: grid; gap: 14px; margin: 12px 0; }
@media (min-width: 640px) { .imsa-uploads { grid-template-columns: 1fr 1fr; } }
.imsa-upload { border: 1px dashed var(--imsa-border); border-radius: 6px; padding: 12px 14px; background: var(--imsa-soft); }
.imsa-upload.imsa-has-error { border-color: var(--imsa-error); }
.imsa-upload-label { display: block; margin-bottom: 8px; }
.imsa-upload-label strong { display: block; }
.imsa-upload input[type=file] { width: 100%; font-size: .9em; }
.imsa-filelist { list-style: none; margin: 8px 0 0; padding: 0; font-size: .85em; }
.imsa-filelist li { padding: 3px 0; display: flex; justify-content: space-between; gap: 8px; border-top: 1px solid var(--imsa-border); }
.imsa-filelist li.imsa-bad { color: var(--imsa-error); font-weight: 600; }
.imsa-total.imsa-bad { color: var(--imsa-error); opacity: 1; font-weight: 600; }

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

.imsa-submit { margin: 8px 0 30px; }
.imsa-btn { font: inherit; font-weight: 700; font-size: 1.05em; padding: .85em 1.8em; border-radius: 6px; border: 0; background: var(--imsa-accent); color: #fff; cursor: pointer; min-height: 48px; }
.imsa-btn:hover { filter: brightness(1.1); }
.imsa-btn[disabled] { opacity: .6; cursor: progress; }

.imsa-alert { border-left: 4px solid var(--imsa-error); background: #fef3f2; color: #7a271a; padding: 12px 16px; border-radius: 4px; margin-bottom: 20px; }
.imsa-alert p { margin: 4px 0; }
.imsa-success, .imsa-info { border-left: 4px solid #12805c; background: #ecfdf3; color: #054f31; padding: 18px 20px; border-radius: 4px; }
.imsa-info { border-left-color: var(--imsa-accent); background: var(--imsa-soft); color: inherit; }
.imsa-success h2 { margin-top: 0; }
.imsa-field > label.imsa-check { font-weight: 400; font-size: 1em; }
.imsa-yesno-opts { flex-wrap: wrap; }
.imsa.alignwide { margin-left: auto; margin-right: auto; }

/* Antwort-Portal */
.imsa-portal { max-width: 760px; }
.imsa-portal-head { padding: 12px 16px; background: var(--imsa-soft); border-radius: var(--imsa-radius); }
.imsa-conv { display: flex; flex-direction: column; gap: 12px; margin: 20px 0 24px; }
.imsa-cmsg { border: 1px solid var(--imsa-border); border-radius: 10px; padding: 12px 16px; max-width: 88%; }
.imsa-cout { align-self: flex-start; background: var(--imsa-soft); }
.imsa-cin { align-self: flex-end; border-color: var(--imsa-accent); }
.imsa-chead { font-size: .82em; opacity: .75; margin-bottom: 4px; }
.imsa-csubj { font-weight: 700; margin-bottom: 4px; }
.imsa-cbody { line-height: 1.55; word-wrap: break-word; }
.imsa-portal-form { border: 1px solid var(--imsa-border); border-radius: var(--imsa-radius); padding: 16px 18px; }
.imsa-portal-form input[type=file] { width: 100%; }
.imsa-portal .imsa-success { margin-bottom: 12px; }