/* Mietpreisrechner – bewusst zurückhaltend, damit das Template-Design greift */
.mietpreisrechner {
  --mpr-accent: var(--cassiopeia-color-primary, var(--bs-primary, #1f5e8a));
  --mpr-border: rgba(0, 0, 0, .15);
  --mpr-soft: rgba(0, 0, 0, .04);
}

.mietpreisrechner .mpr-form { margin-bottom: 1rem; }
.mietpreisrechner .mpr-dates { display: flex; flex-wrap: wrap; gap: 1rem; }
.mietpreisrechner .mpr-field { display: flex; flex-direction: column; flex: 1 1 11rem; margin-bottom: .75rem; }
.mietpreisrechner .mpr-field label { font-weight: 600; margin-bottom: .25rem; }
.mietpreisrechner .mpr-category-fixed { font-weight: 600; }

.mietpreisrechner .mpr-quote,
.mietpreisrechner .mpr-table { width: 100%; border-collapse: collapse; margin-bottom: .5rem; }
.mietpreisrechner caption { caption-side: top; text-align: left; font-weight: 600; padding: .25rem 0 .5rem; color: inherit; }
.mietpreisrechner th,
.mietpreisrechner td { padding: .4rem .5rem; border-bottom: 1px solid var(--mpr-border); text-align: left; vertical-align: top; }
.mietpreisrechner .mpr-num { text-align: right; white-space: nowrap; }
.mietpreisrechner .mpr-quote tfoot th,
.mietpreisrechner .mpr-quote tfoot td { font-weight: 700; font-size: 1.15em; border-top: 2px solid var(--mpr-accent); border-bottom: 0; }
.mietpreisrechner .mpr-vat,
.mietpreisrechner .mpr-table-note { font-size: .875em; opacity: .8; }
.mietpreisrechner .mpr-message { padding: .5rem .75rem; border-left: 3px solid var(--mpr-accent); background: var(--mpr-soft); }

.mietpreisrechner .mpr-table-wrap { overflow-x: auto; margin-top: 1.5rem; }
.mietpreisrechner .mpr-ranges { display: block; font-weight: 400; font-size: .85em; opacity: .8; }
.mietpreisrechner .mpr-table tr.mpr-active { background: var(--mpr-soft); }
.mietpreisrechner .mpr-table tr.mpr-active th { box-shadow: inset 3px 0 0 var(--mpr-accent); }

.mietpreisrechner .mpr-notes { margin-top: 1.5rem; font-size: .95em; }