/* Raumfinder Filter Feinschliff
   - Inputfelder schwarzer Rand
   - Cards/Feldcontainer gleiche Hintergrundfarbe wie Seite
   - Filterbereich bündig mit oberer Suche
   Diese Datei ganz zuletzt laden.
*/

:root{
    --rf-bg:#fff6e9;
    --rf-white:#ffffff;
    --rf-black:#111111;
    --rf-yellow:#ffbd00;
    --rf-soft-orange:#fcc490;
    --rf-orange:#ff9c01;
}

/* 1) Inputs oben: schwarzer Rand */
#filtersForm .form-control,
#filtersForm .form-select,
#filtersForm input:not([type="checkbox"]):not([type="radio"]),
#filtersForm select,
#filtersForm textarea {
    background:var(--rf-white) !important;
    color:var(--rf-black) !important;
    border:3px solid var(--rf-black) !important;
    border-radius:18px !important;
    box-shadow:none !important;
}

#filtersForm .form-control:focus,
#filtersForm .form-select:focus,
#filtersForm input:not([type="checkbox"]):not([type="radio"]):focus,
#filtersForm select:focus,
#filtersForm textarea:focus {
    border-color:var(--rf-black) !important;
    box-shadow:0 0 0 .16rem rgba(255,156,1,.25) !important;
}

/* 2) Cards/Feldcontainer NICHT weiss */
#filtersForm,
#filtersForm .card,
#filtersForm .card-body,
#filtersForm .rounded-4,
#filtersForm .border,
#filtersForm .bg-white,
#filtersForm .bg-light,
#filtersForm [class*="card"],
#filtersForm [class*="filter"],
#filtersForm [class*="Filter"],
#filtersForm [class*="field"],
#filtersForm [class*="Field"] {
    background:var(--rf-bg) !important;
}

/* Nur die eigentlichen Tag-Buttons bleiben weiss, wenn inaktiv */
#filtersForm .btn-outline-primary,
#filtersForm .btn-outline-primary.rounded-pill,
#filtersForm button.btn-outline-primary,
#filtersForm button.btn-outline-primary.rounded-pill,
#filtersForm .filter-chip,
#filtersForm .tag-chip,
#filtersForm [data-field-filter],
#filtersForm .room-field-filter button,
#filtersForm .field-filter button {
    background:var(--rf-white) !important;
    color:var(--rf-black) !important;
    border:3px solid var(--rf-black) !important;
    border-radius:999px !important;
    box-shadow:none !important;
}

/* Aktive Tags orange */
#filtersForm .btn-check:checked + .btn-outline-primary,
#filtersForm .btn-outline-primary.active,
#filtersForm .btn-outline-primary:active,
#filtersForm button.btn-outline-primary.active,
#filtersForm .filter-chip.active,
#filtersForm .tag-chip.active,
#filtersForm [data-field-filter].active {
    background:linear-gradient(90deg,var(--rf-yellow),var(--rf-soft-orange),var(--rf-orange)) !important;
    color:var(--rf-black) !important;
    border-color:var(--rf-black) !important;
    box-shadow:none !important;
}

/* Der "Weitere Filter"-Button enthält Klassen mit "filter" im Namen;
   die inneren Spans sollen trotzdem keinen Flächenhintergrund bekommen. */
#filtersForm .public-filter-toggle {
    background:linear-gradient(90deg,var(--rf-yellow),var(--rf-soft-orange),var(--rf-orange)) !important;
}

#filtersForm .public-filter-toggle > *,
#filtersForm .public-filter-toggle > * > * {
    background:transparent !important;
    background-color:transparent !important;
    box-shadow:none !important;
}

/* 3) Filterbereich bündig mit Suche oben:
      Bootstrap-Padding/Margins im Filterformular entschärfen */
#filtersForm {
    padding-left:0 !important;
    padding-right:0 !important;
}

#filtersForm .p-3,
#filtersForm .p-4,
#filtersForm .p-md-4,
#filtersForm .px-3,
#filtersForm .px-4,
#filtersForm .px-md-4 {
    padding-left:0 !important;
    padding-right:0 !important;
}

/* Innenabstand der grossen Filterbox nur vertikal,
   damit linke Kante bündig mit Suchfeld ist */
#filtersForm .rounded-4.border,
#filtersForm .filter-card,
#filtersForm .card {
    padding-left:0 !important;
    padding-right:0 !important;
}

/* Wenn die Feldgruppen selbst eine Innenbox haben, auch bündig machen */
#filtersForm .row,
#filtersForm .g-3,
#filtersForm .g-4 {
    margin-left:0 !important;
    margin-right:0 !important;
}

/* Spalten sollen trotzdem Luft zwischen sich haben */
#filtersForm .row > * {
    padding-left:0 !important;
    padding-right:1rem !important;
}

#filtersForm .row > *:last-child {
    padding-right:0 !important;
}

/* Filter-Feldgruppen: Rand behalten, Hintergrund beige */
#filtersForm .border.rounded,
#filtersForm .border.rounded-4,
#filtersForm .rounded.border,
#filtersForm .rounded-4.border {
    background:var(--rf-bg) !important;
    border-color:rgba(17,17,17,.14) !important;
}

/* Checkbox-Zeile bündig */
#filtersForm .form-check {
    padding-left:1.6rem !important;
}

/* Filtern Button wie aktive Tags */
#filtersForm button[type="submit"],
#filtersForm .btn-primary {
    background:linear-gradient(90deg,var(--rf-yellow),var(--rf-soft-orange),var(--rf-orange)) !important;
    color:var(--rf-black) !important;
    border:3px solid var(--rf-black) !important;
    border-radius:999px !important;
    box-shadow:none !important;
    font-weight:700 !important;
    padding:.35rem .85rem !important;
}
