/* ===== BLACK-LINER QUOTE FORM – kompakt, sauber, dark-mode ready ===== */

#bl-quote-form{
  --field-width: 94%;
  --field-pad: 5px 6px;
  max-width: 820px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px 10px;                  /* dichter zusammen */
  font-family: "Inter", Arial, sans-serif;
  font-size: 12px !important;
}
#bl-quote-form *{ font-size: 12px !important; }

/* Fieldsets neutralisieren */
#bl-quote-form > .form-section,
#bl-quote-form > fieldset{
  display: contents !important;
  border:0!important;
  margin:0!important;
  padding:0!important;
}

/* Label (Grundfarbe; Feintuning in custom.css) */
#bl-quote-form .form-label{
  display:block!important;
  margin:0 0 1px!important;
  color:#bfbfbf!important;
}

/* Eingabefelder kompakter */
#bl-quote-form input[type="text"],
#bl-quote-form input[type="number"],
#bl-quote-form input[type="email"],
#bl-quote-form input[type="datetime"],
#bl-quote-form input[type="date"],
#bl-quote-form textarea,
#bl-quote-form select{
  width:var(--field-width)!important;
  padding:var(--field-pad)!important;
  border:1px solid #333!important;
  border-radius:3px!important;
  background:#121212!important;
  color:#e8e8e8!important;
  font-weight:500!important;
  line-height:1.3!important;
  margin-bottom:2px!important;
}
#bl-quote-form input:focus,
#bl-quote-form select:focus,
#bl-quote-form textarea:focus{
  outline:none!important;
  border-color:#666!important;
  background:#1b1b1b!important;
}

/* gleiche Höhe: Anmerkung = Routing */
#bl-quote-form textarea{ min-height:120px !important; }

/* Dropzone-Feld (Behälter) */
#bl-quote-form .form-field.file{
  background:#111 !important;
  border:1px dashed #444 !important;
  border-radius:4px !important;
  padding:10px !important;
  height:120px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}
#bl-quote-form .form-field.file:hover{
  border-color:#666!important;
  background:#181818!important;
}

/* ALLE Dropzone-Elemente neutralisieren (egal ob Theme/Inline-Styles) */
#bl-quote-form .dropzone,
#bl-quote-form .dz-default,
#bl-quote-form .dz-clickable,
#bl-quote-form .dz-message,
#bl-quote-form .dz-message *,
#bl-quote-form .dz-button,
#bl-quote-form .dz-preview,
#bl-quote-form .dz-preview *{
  background: transparent !important;
  border: none !important;
  color: #cfcfcf !important;
  box-shadow: none !important;
}

/* Falls irgendwo eine Farbe hart gesetzt wurde (inline) */
#bl-quote-form .form-field.file [style*="background"],
#bl-quote-form .form-field.file [style*="background-color"]{
  background: transparent !important;
}

/* Nachricht mittig, ohne Boxoptik */
#bl-quote-form .dz-message{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:0 !important;
  text-align:center !important;
  line-height:1.35 !important;
  color:#cfcfcf !important;
}
#bl-quote-form .dz-message:hover{ color:#fff !important; }

/* File Inputs komplett verstecken (wir nutzen Dropzone-Bereich) */
#bl-quote-form input[type=file],
#bl-quote-form .form-input input[type=file],
#bl-quote-form .form-input label{
  display:none!important;
}

/* Vorschau/Entfernen */
#bl-quote-form .dz-preview{ margin:4px auto!important; }
#bl-quote-form .dz-remove{ color:#a7a7a7!important; }
#bl-quote-form .dz-remove:hover{ color:#fff!important; }

/* Submit */
#bl-quote-form input[type=submit],
#bl-quote-form button[type=submit],
#bl-quote-form .form-actions .button{
  display:inline-block!important;
  width:100%!important;
  padding:8px 10px!important;
  background:#2b2b2b!important;
  color:#fff!important;
  border:0!important;
  border-radius:3px!important;
  font-weight:600!important;
  letter-spacing:.2px!important;
  cursor:pointer!important;
  transition:background .15s, box-shadow .15s!important;
}
#bl-quote-form input[type=submit]:hover,
#bl-quote-form button[type=submit]:hover,
#bl-quote-form .form-actions .button:hover{
  background:#404040!important;
  box-shadow:0 0 6px rgba(255,102,0,.3)!important;  /* dezenter Orange-Glow */
}

/* Fehlermeldungen */
#bl-quote-form .form-errors{
  grid-column:1/-1!important;
  margin:4px 0 0!important;
  color:#ff6b6b!important;
  font-size:11px!important;
}

/* Mobile */
@media (max-width:760px){
  #bl-quote-form{
    grid-template-columns:1fr!important;
    gap:5px!important;
  }
  #bl-quote-form input,
  #bl-quote-form textarea,
  #bl-quote-form select,
  #bl-quote-form .form-field.file{ width:100%!important; }
}

/* === Einheitliches Dark-Liner Styling für Date-Felder === */
#bl-quote-form input[type="date"] {
  appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  background-color: #121212 !important;  /* gleich wie Textfelder */
  color: #e6e6e6 !important;
  border: 1px solid #333 !important;
  font-size: 0.85rem !important;
  padding-right: 28px !important;
  height: 29px !important;
  box-shadow: inset 0 0 4px rgba(255,255,255,0.05);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
#bl-quote-form input[type="date"]:focus {
  outline: none !important;
  border-color: #ff6600 !important;
  box-shadow: 0 0 6px rgba(255,102,0,0.5);
}
/* Helles Kalender-Icon (weiß → orange bei Hover) */
#bl-quote-form input[type="date"]::-webkit-calendar-picker-indicator {
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 24 24'><path d='M7 2v2H5a2 2 0 00-2 2v14a2 2 0 002 2h14a2 2 0 002-2V6a2 2 0 00-2-2h-2V2h-2v2H9V2H7zm12 8H5v10h14V10zM5 8V6h14v2H5z'/></svg>") no-repeat center;
  background-size: 16px;
  opacity: .8;
  cursor: pointer;
  filter: drop-shadow(0 0 2px rgba(255,255,255,0.4));
  transition: filter .2s, opacity .2s;
}
#bl-quote-form input[type="date"]::-webkit-calendar-picker-indicator:hover {
  opacity: 1;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' fill='%23ff6600' viewBox='0 0 24 24'><path d='M7 2v2H5a2 2 0 00-2 2v14a2 2 0 002 2h14a2 2 0 002-2V6a2 2 0 00-2-2h-2V2h-2v2H9V2H7zm12 8H5v10h14V10zM5 8V6h14v2H5z'/></svg>") no-repeat center;
  background-size: 16px;
  filter: drop-shadow(0 0 6px rgba(255,102,0,0.9));
}

/* =========================
   DSGVO-Checkbox – bündig, Glow, Stern
   ========================= */

/* 1) Generelle Basis für Checkbox */
#bl-quote-form input[type="checkbox"] {
  accent-color: #ff6600;
  margin-right: 8px;
  vertical-align: top;
  transform: scale(.95);
  transition: box-shadow .15s ease, outline-color .15s ease;
}

/* Hover & Focus: dezenter Orange-Glow */
#bl-quote-form input[type="checkbox"]:hover,
#bl-quote-form input[type="checkbox"]:focus-visible {
  box-shadow: 0 0 6px rgba(255,102,0,.6);
  outline: 1px solid #ff6600;
  outline-offset: 1px;
}

/* 2) Label robust greifen (egal ob Grav <span> nutzt oder plain text) */
#bl-quote-form .form-field label.checkbox,
#bl-quote-form .form-field input[type="checkbox"] + label {
  display: inline-block;
  line-height: 1.45;
  text-align: left;
  vertical-align: top;
  max-width: 92%;
  position: relative;
  top: -1px;                  /* leicht optisch zentrieren */
  color: #d9d9d9;
  font-size: 0.85rem;
}

/* 3) Mehrzeilige Ausrichtung: ab 2. Zeile bündig */
#bl-quote-form .form-field label.checkbox,
#bl-quote-form .form-field label.checkbox > span,
#bl-quote-form .form-field input[type="checkbox"] + label,
#bl-quote-form .form-field input[type="checkbox"] + label > span {
  text-indent: -1.35em;       /* erste Zeile nach links */
  padding-left: 1.35em;       /* alle folgenden Zeilen nach rechts */
  display: inline-block;
}

/* 4) Sternchen einfärben */
#bl-quote-form .required,
#bl-quote-form label.checkbox .required,
#bl-quote-form label span[aria-hidden="true"],
#bl-quote-form .form-field input[type="checkbox"] + label .required {
  color: #ff6600 !important;
  font-weight: 600;
}