/* ===== RAIBA-IMMO SUCHAUFTRAG-SKIN BUILD-MARKER: v6.26.0 ===== */
/**
 * Optik-Skin für das native WP-ImmoMakler-Suchauftragsformular
 * (Shortcode immomakler-searchagents-form, Container .immomakler-searchagent-form).
 *
 * WICHTIG: Es wird ausschliesslich das Aussehen angepasst. Die gesamte Logik
 * (Suchauftrag anlegen, Double-Opt-In-Bestaetigungsmail, Matching, automatische
 * Benachrichtigungen) bleibt unveraendert beim Plugin WP-ImmoMakler. Saemtliche
 * Selektoren sind unter .immomakler-searchagent-form gescoped, damit andere
 * Suchformulare/Bereiche unberuehrt bleiben.
 *
 * CASCADE-HINWEIS: immomakler.css (Parent) und immomakler-plus.css laden NACH
 * diesem Skin und stylen .immomakler-searchagent-form direkt (u. a.
 * .form-group{margin-bottom:0;padding:0 15px}, .form-group>label{margin-top:15px},
 * .bootstrap-select{float:left}, .form-check.has-error label{border:1px solid !important}).
 * Deshalb tragen die konfliktbehafteten Eigenschaften hier bewusst !important.
 */

.immomakler-searchagent-form {
	--sa-accent: #FF6600;
	--sa-accent-ink: #E65C00;
	--sa-accent-soft: #FFF0E6;
	--sa-ink: #1b2530;
	--sa-muted: #5E6976;
	--sa-line: #E6EAF1;
	--sa-soft: #F5F7FA;
	--sa-bg: #fff;
	--sa-err: #C0392B;

	background: var(--sa-bg);
	border: 1px solid var(--sa-line);
	border-radius: 20px;
	padding: 30px 32px;
	box-shadow: 0 1px 2px rgba(21, 33, 44, .04), 0 30px 70px -40px rgba(0, 45, 103, .4);
	color: var(--sa-ink);
}
@media (max-width: 576px) {
	.immomakler-searchagent-form { padding: 22px 18px; }
}

/* ---- Raster etwas enger, Zeilenabstaende ----
   immomakler-plus.css setzt .form-group{margin-bottom:0;padding:0 15px} -> !important. */
.immomakler-searchagent-form .form-row.row,
.immomakler-searchagent-form .row { margin-left: -7px !important; margin-right: -7px !important; }
.immomakler-searchagent-form [class*="col-"] { padding-left: 7px !important; padding-right: 7px !important; }
.immomakler-searchagent-form .form-group { margin-bottom: 16px !important; }

/* ---- Feld-Labels (Text-/Zahlenfelder) ----
   immomakler-plus.css setzt .immomakler .immomakler-searchagent-form .form-group>label{margin-top:15px} (0,3,1). */
.immomakler-searchagent-form .form-group > label[for] {
	display: block;
	margin: 0 0 6px !important;
	font-size: 12.5px;
	font-weight: 700;
	color: var(--sa-ink);
}

/* ---- Eingabefelder ----
   immomakler.css setzt .immomakler .form-control{border-radius:0;box-shadow:none;margin-bottom:10px}
   und :focus{border:1px solid}. */
.immomakler-searchagent-form .form-control,
.immomakler-searchagent-form select.selectpicker {
	height: auto !important;
	width: 100%;
	margin-bottom: 0 !important;
	padding: 12px 13px !important;
	font-size: 14.5px;
	line-height: 1.3;
	color: var(--sa-ink) !important;
	background-color: #fff !important;
	border: 1.5px solid var(--sa-line) !important;
	border-radius: 11px !important;
	box-shadow: none !important;
	transition: border-color .15s, box-shadow .15s;
}
.immomakler-searchagent-form .form-control:focus,
.immomakler-searchagent-form select.selectpicker:focus {
	border: 1.5px solid var(--sa-accent) !important;
	box-shadow: 0 0 0 3px rgba(255, 102, 0, .16) !important;
	outline: none !important;
}
/* Zahlen-Spinner ausblenden */
.immomakler-searchagent-form input[type=number]::-webkit-outer-spin-button,
.immomakler-searchagent-form input[type=number]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.immomakler-searchagent-form input[type=number] { -moz-appearance: textfield; appearance: textfield; }

/* Plain-Select-Fallback (falls selectpicker global deaktiviert) mit eigenem Pfeil */
.immomakler-searchagent-form select.selectpicker {
	appearance: none; -webkit-appearance: none; -moz-appearance: none;
	padding-right: 38px !important; cursor: pointer;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%235E6976' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important;
	background-repeat: no-repeat !important;
	background-position: right 14px center !important;
	background-size: 12px !important;
}

/* ---- Vermarktungsart -> Segment-Umschalter (Kauf/Miete) ----
   padding:0 neutralisiert das .form-group{padding:0 15px} des Plugins. */
.immomakler-searchagent-form .form-group:has(.radio-inline) {
	display: flex; gap: 8px;
	padding-left: 0 !important; padding-right: 0 !important;
}
.immomakler-searchagent-form .radio-inline {
	flex: 1;
	display: inline-flex; align-items: center; justify-content: center;
	margin: 0 !important; padding: 13px 14px;
	border: 1.5px solid var(--sa-line); border-radius: 11px;
	font-weight: 700; color: var(--sa-ink); text-align: center; cursor: pointer;
	transition: border-color .16s, background .16s, color .16s;
}
.immomakler-searchagent-form .radio-inline input[type=radio] {
	position: absolute; opacity: 0; width: 0; height: 0; margin: 0;
}
.immomakler-searchagent-form .radio-inline:has(input:checked) {
	border-color: var(--sa-accent); background: var(--sa-accent-soft); color: var(--sa-accent-ink);
}

/* ---- Select-Zeile: Nutzungsart / Objektart / Ort nebeneinander ----
   padding:0 neutralisiert .form-group{padding:0 15px}; die Kinder neutralisieren
   .immomakler-search-taxonomy{padding:0 5px !important} und .bootstrap-select{float:left}. */
.immomakler-searchagent-form .form-group:not([class*="col-"]):has(.selectpicker) {
	display: flex; gap: 12px; flex-wrap: wrap; align-items: flex-start;
	padding-left: 0 !important; padding-right: 0 !important;
}
.immomakler-searchagent-form .form-group:not([class*="col-"]):has(.selectpicker) > .selectpicker,
.immomakler-searchagent-form .form-group:not([class*="col-"]):has(.selectpicker) > .bootstrap-select {
	flex: 1 1 200px; min-width: 180px; width: auto !important; float: none !important;
	margin: 0 !important; padding-left: 0 !important; padding-right: 0 !important;
}

/* ---- bootstrap-select (aktiv): Button wie Eingabefeld, Menue sauber ---- */
.immomakler-searchagent-form .bootstrap-select { width: 100% !important; }
/* form-control-Klasse, die bootstrap-select auf den Wrapper kopiert, neutralisieren */
.immomakler-searchagent-form .bootstrap-select.form-control {
	border: 0 !important; padding: 0 !important; height: auto !important;
	background: transparent !important; box-shadow: none !important;
}
.immomakler-searchagent-form .bootstrap-select > .dropdown-toggle,
.immomakler-searchagent-form .bootstrap-select > button.btn {
	width: 100%; height: auto !important;
	margin: 0 !important;
	padding: 12px 30px 12px 13px !important;
	font-size: 14.5px; font-weight: 400; text-align: left;
	color: var(--sa-ink) !important; background-color: #fff !important;
	border: 1.5px solid var(--sa-line) !important; border-radius: 11px !important;
	box-shadow: none !important; outline: none !important;
}
.immomakler-searchagent-form .bootstrap-select.open > .dropdown-toggle,
.immomakler-searchagent-form .bootstrap-select > .dropdown-toggle:hover,
.immomakler-searchagent-form .bootstrap-select > .dropdown-toggle:focus {
	border-color: var(--sa-accent) !important;
	box-shadow: 0 0 0 3px rgba(255, 102, 0, .16) !important;
}
/* immomakler-plus.css setzt .immomakler .bootstrap-select .dropdown-toggle:focus
   {outline:thin dotted #333!important} (0,4,0). Der Toggle traegt immer .btn,
   also (0,5,0) -> nur der Accent-Ring bleibt sichtbar. */
.immomakler-searchagent-form .bootstrap-select > .dropdown-toggle.btn:focus,
.immomakler-searchagent-form .bootstrap-select > .dropdown-toggle.btn:active,
.immomakler-searchagent-form .bootstrap-select.open > .dropdown-toggle.btn { outline: 0 !important; }
.immomakler-searchagent-form .bootstrap-select .dropdown-toggle .filter-option-inner-inner,
.immomakler-searchagent-form .bootstrap-select .dropdown-toggle .filter-option { color: var(--sa-ink); }
.immomakler-searchagent-form .bootstrap-select .dropdown-toggle .caret {
	right: 13px; width: 8px; height: 8px; margin-top: -6px;
	border: 0; border-right: 2px solid var(--sa-muted); border-bottom: 2px solid var(--sa-muted);
	border-radius: 1px; transform: rotate(45deg);
}
.immomakler-searchagent-form .bootstrap-select .dropdown-menu {
	border: 1px solid var(--sa-line); border-radius: 12px; padding: 6px; margin-top: 6px;
	box-shadow: 0 16px 44px -18px rgba(0, 45, 103, .4);
}
.immomakler-searchagent-form .bootstrap-select .dropdown-menu li a,
.immomakler-searchagent-form .bootstrap-select .dropdown-menu li .dropdown-item {
	padding: 9px 11px !important; border-radius: 8px; color: var(--sa-ink) !important;
}
.immomakler-searchagent-form .bootstrap-select .dropdown-menu li a:hover,
.immomakler-searchagent-form .bootstrap-select .dropdown-menu li a:focus,
.immomakler-searchagent-form .bootstrap-select .dropdown-menu li.selected a,
.immomakler-searchagent-form .bootstrap-select .dropdown-menu li.active a,
.immomakler-searchagent-form .bootstrap-select .dropdown-menu li a.active {
	background: var(--sa-accent-soft) !important; color: var(--sa-accent-ink) !important;
}

/* ---- Einwilligungen ----
   padding:0 neutralisiert .form-group{padding:0 15px} des Plugins;
   label margin:0 neutralisiert .form-group>label{margin-top:15px}. */
.immomakler-searchagent-form .form-check {
	margin-bottom: 12px !important;
	padding-left: 0 !important; padding-right: 0 !important;
}
.immomakler-searchagent-form .form-check label {
	display: block; position: relative; padding-left: 32px; margin: 0 !important;
	font-size: 13.5px; font-weight: 400; line-height: 1.5; color: var(--sa-muted); cursor: pointer;
}
.immomakler-searchagent-form .form-check input[type=checkbox] {
	appearance: none; -webkit-appearance: none;
	position: absolute; left: 0; top: 1px;
	width: 20px; height: 20px; margin: 0;
	border: 1.5px solid var(--sa-line); border-radius: 6px; background: #fff; cursor: pointer;
	transition: background .15s, border-color .15s;
}
.immomakler-searchagent-form .form-check input[type=checkbox]:hover { border-color: var(--sa-accent); }
.immomakler-searchagent-form .form-check input[type=checkbox]:checked { background: var(--sa-accent); border-color: var(--sa-accent); }
.immomakler-searchagent-form .form-check input[type=checkbox]:checked::after {
	content: ""; position: absolute; left: 6px; top: 2px; width: 5px; height: 10px;
	border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg);
}
.immomakler-searchagent-form .form-check a { color: var(--sa-accent-ink); font-weight: 600; text-decoration: underline; }

/* Fehlerzustand (das Plugin-JS setzt .has-error).
   immomakler-plus.css setzt .form-check.has-error label{border:1px solid #a94442 !important} -> hier neutralisiert. */
.immomakler-searchagent-form .has-error .form-control,
.immomakler-searchagent-form .has-error select.selectpicker,
.immomakler-searchagent-form .has-error .bootstrap-select > .dropdown-toggle { border-color: var(--sa-err) !important; }
.immomakler-searchagent-form .form-check.has-error input[type=checkbox] { border-color: var(--sa-err) !important; }
/* (0,4,1): der Container traegt form-group UND form-check -> schlaegt die
   Plugin-Regel .immomakler-searchagent-form .form-check.has-error label
   {border:1px solid #a94442 !important} (0,3,1), die spaeter laedt. */
.immomakler-searchagent-form .form-group.form-check.has-error label { color: var(--sa-err) !important; border: 0 !important; }

/* ---- Button + Meldung: volle Breite, gestapelt ----
   immomakler-plus.css setzt #immomakler-searchagent-form-submit{margin-top:15px}. */
.immomakler-searchagent-form .row:has(#immomakler-searchagent-form-submit) > [class*="col-"] {
	width: 100% !important; float: none !important; padding: 0 !important;
}
.immomakler-searchagent-form .btn-primary,
.immomakler-searchagent-form #immomakler-searchagent-form-submit {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	width: auto; margin-top: 4px !important; padding: 13px 24px !important;
	border: 1px solid transparent !important; border-radius: 12px !important;
	background: var(--sa-accent) !important; color: #fff !important;
	font-weight: 800; font-size: 14px; box-shadow: none !important;
	transition: filter .16s, transform .16s;
}
.immomakler-searchagent-form .btn-primary:hover,
.immomakler-searchagent-form #immomakler-searchagent-form-submit:hover {
	filter: brightness(1.06); transform: translateY(-1px);
	background: var(--sa-accent) !important; color: #fff !important;
}
.immomakler-searchagent-form #immomakler-searchagent-form-submit[disabled] { opacity: .6; transform: none; cursor: default; }

.immomakler-searchagent-form #message { margin-top: 14px; }
.immomakler-searchagent-form .alert { border-radius: 11px; padding: 12px 14px; font-size: 14px; border: 1px solid; }
.immomakler-searchagent-form .alert-success { background: #EAF7EF; border-color: #B7E1C6; color: #1E7A43; }
.immomakler-searchagent-form .alert-danger { background: #FCEBEA; border-color: #F5C6C2; color: #B0342A; }
