/* Meetder listing form palette. All colors stay within this form. */
.listing-form {
  --listing-mint:#edf8f1;
  --listing-cream:#fff8e8;
  --listing-peach:#fff1e9;
  --listing-lilac:#f3f0fa;
  --listing-line:#c9dfd2;
  --listing-accent:#28765a;
  --listing-selected:#d9efe2;
  --listing-heading:#244d3e;
}
.listing-form :is(.property-picker,.listing-room-arrangement,.listing-additional-section,.listing-form-finances,.upload-field) {
  padding:22px;border:1px solid var(--listing-line);border-radius:20px;
}
.listing-form .property-picker {background:var(--listing-cream);border-color:color-mix(in srgb,var(--listing-cream),#c99c48 28%)}
.listing-form .listing-room-arrangement {background:var(--listing-mint)}
.listing-form .listing-additional-section {background:var(--listing-lilac);border-color:color-mix(in srgb,var(--listing-lilac),#9684b8 28%)}
.listing-form .listing-form-finances {background:var(--listing-peach);border-color:color-mix(in srgb,var(--listing-peach),#bf896d 28%)}
.listing-form .upload-field {background:var(--listing-cream);border-style:dashed;border-width:2px}
.listing-form :is(.property-picker,.listing-room-arrangement,.listing-additional-section) > h3 {
  color:var(--listing-heading);border-inline-start:4px solid var(--listing-accent);padding-inline-start:12px;line-height:1.5;
}
.listing-form .property-picker > h3 {border-color:#c3943a}
.listing-form .listing-additional-section > h3 {border-color:#9180ae}
.listing-form :is(input:not([type=checkbox]):not([type=radio]):not([type=file]),select,textarea,.roommate-gender-dropdown > summary) {
  background:var(--white);border-color:var(--listing-line);border-radius:12px;
  transition:border-color .15s,box-shadow .15s;
}
.listing-form :is(input:not([type=checkbox]):not([type=radio]):not([type=file]),select,textarea):focus {
  outline:2px solid var(--listing-accent);outline-offset:2px;box-shadow:0 0 0 5px color-mix(in srgb,var(--listing-mint),transparent 20%);
}
.listing-form .roommate-gender-dropdown[open] > summary {border-color:var(--listing-accent);background:var(--listing-mint)}
.listing-form :is(.roommate-gender-options,.room-feature-options,.check-options) label:has(input:checked) {
  background:var(--listing-selected);border-radius:9px;color:var(--listing-heading);
}
.listing-form :is(input[type=checkbox],input[type=radio]) {accent-color:var(--listing-accent)}
.listing-form .room-feature-count {background:var(--listing-selected);color:var(--listing-heading);font-weight:650}
.listing-form .utility-charge {background:var(--listing-mint);border-color:var(--listing-line)}
.listing-form .utility-charge:nth-child(2) {background:var(--listing-cream)}
.listing-form .utility-charge legend {color:var(--listing-heading);font-weight:650}
.listing-form .property-result {background:var(--white);border-color:var(--listing-line)}
.listing-form .property-result[aria-pressed=true] {background:var(--listing-selected);outline-color:var(--listing-accent)}
.listing-form .listing-additional-row > .button-outline {background:var(--listing-mint);border-color:var(--listing-line);color:var(--listing-heading)}
.listing-form input[type=file]::file-selector-button {background:var(--listing-selected);color:var(--listing-heading);border:0;border-radius:9px;padding:10px 14px;font:inherit;cursor:pointer}
.listing-form .form-actions {padding-top:20px;border-top:1px solid var(--listing-line)}
.listing-form .form-actions > .button:not(.button-outline) {background:#28765a;color:#fff;border-color:#28765a;box-shadow:0 4px 12px #28765a22}
.listing-form .form-actions > .button:not(.button-outline):hover {background:#205e48}
html[data-theme=dark] .listing-form {
  --listing-mint:#203e32;--listing-cream:#3b3524;--listing-peach:#3c2e28;--listing-lilac:#302e40;
  --listing-line:#536b5e;--listing-accent:#9bd5b8;--listing-selected:#345d48;--listing-heading:#e1f0e7;
}
@media(max-width:700px){
  .listing-form :is(.property-picker,.listing-room-arrangement,.listing-additional-section,.listing-form-finances,.upload-field) {padding:16px 14px;border-radius:16px}
}
@media(prefers-reduced-motion:reduce){.listing-form :is(input,select,textarea,summary){transition:none}}
