/* ============================================================
   Frontida Pflegedienst – Gemeinsames Kontaktformular-Stylesheet
   Referenz: index.html ("Nachricht senden").
   Wird auf den Lead-Form-Seiten (kostenlose-pflegeberatung +
   alle Standorte) NACH dem Seiten-CSS geladen.
   Button-Stile bewusst auf .form-actions begrenzt, damit
   Hero-/CTA-Buttons der Seiten unveraendert bleiben.
   ============================================================ */
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.form-group { margin-bottom:1rem; }
.form-group label { display:block; font-size:0.76rem; font-weight:700; letter-spacing:0.05em; text-transform:uppercase; color:var(--text-mid, #454C4D); margin-bottom:0.4rem; }
.form-group input,.form-group textarea,.form-group select { width:100%; background:white; border:1.5px solid var(--border, #DDE2E9); border-radius:8px; padding:0.72rem 1rem; font-family:'Open Sans',sans-serif; font-size:0.9rem; color:var(--text, #454C4D); outline:none; appearance:none; }
.form-group input:focus,.form-group textarea:focus,.form-group select:focus { border-color:var(--blue, #2165AE); }
.form-group input:not([type="checkbox"]), .form-group textarea, .form-group select { transition: border-color 0.35s ease, box-shadow 0.35s ease, background-color 0.35s ease; }
.form-group input:not([type="checkbox"]):hover, .form-group textarea:hover, .form-group select:hover { border-color: var(--blue-light, #6096C4); }
.form-group input:not([type="checkbox"]):focus, .form-group textarea:focus, .form-group select:focus { box-shadow: 0 0 0 3px rgba(33,101,174,0.18); }
.form-group input[type="checkbox"]:focus { outline:2px solid var(--blue, #2165AE); outline-offset:2px; }
.form-group textarea { resize:none; min-height:100px; }
.form-actions { display:flex; flex-wrap:wrap; gap:0.8rem; margin-top:1.5rem; }
.form-actions .btn { flex:1; min-width:0; justify-content:center; padding:0.9rem 1rem; border-radius:8px; }
.form-actions .btn-blue { display:inline-flex; align-items:center; gap:0.4rem; background:var(--blue, #2165AE); color:#fff; text-decoration:none; font-weight:700; font-size:0.9rem; transition:background 0.2s,transform 0.15s; border:none; cursor:pointer; font-family:inherit; }
.form-actions .btn-blue:hover { background:var(--blue-mid, #3F6EA0); transform:translateY(-1px); }
.form-actions .btn-white { display:inline-flex; align-items:center; gap:0.4rem; background:white; color:var(--blue, #2165AE); text-decoration:none; font-weight:700; font-size:0.9rem; transition:all 0.2s; cursor:pointer; font-family:inherit; }
.form-actions .btn-white:hover { background:var(--gray-light, #EDF0F4); transform:translateY(-1px); }

/* Custom Dropdown (Ihr Anliegen) – smooth open wie index.html */
.custom-select{position:relative;width:100%;}
.custom-select-trigger{width:100%;background:#fff;border:1.5px solid var(--border, #DDE2E9);border-radius:8px;padding:0.72rem 1rem;font-family:'Open Sans',sans-serif;font-size:0.9rem;color:var(--text, #454C4D);cursor:pointer;display:flex;align-items:center;justify-content:space-between;transition:border-color 0.2s;}
.custom-select-trigger:hover{border-color:var(--blue, #2165AE);}
.custom-select.open .custom-select-trigger{border-color:var(--blue, #2165AE);border-radius:8px 8px 0 0;}
.custom-select-trigger .arrow{transition:transform 0.35s ease;font-size:0.7rem;color:var(--text-light, #767676);}
.custom-select.open .custom-select-trigger .arrow{transform:rotate(180deg);}
.custom-select-options{position:absolute;top:100%;left:0;right:0;z-index:50;background:#fff;border:1.5px solid var(--blue, #2165AE);border-top:none;border-radius:0 0 8px 8px;overflow:hidden;max-height:0;opacity:0;transition:max-height 0.35s ease,opacity 0.25s ease;box-shadow:0 8px 20px rgba(0,0,0,0.08);}
.custom-select.open .custom-select-options{max-height:300px;opacity:1;}
.custom-select-option{padding:0.65rem 1rem;font-family:'Open Sans',sans-serif;font-size:0.88rem;color:var(--text, #454C4D);cursor:pointer;transition:background 0.15s,padding-left 0.2s;}
.custom-select-option:hover{background:var(--gray-bg, #F5F7FA);padding-left:1.3rem;}
.custom-select-option.selected{color:var(--blue, #2165AE);font-weight:600;}
.custom-select-option:last-child{border-radius:0 0 6px 6px;}

/* Fix DSGVO checkbox visibility (overrides .form-group input { appearance:none; width:100% } ) */
.form-group.dsgvo-consent { display: flex !important; align-items: flex-start !important; gap: 0.6rem !important; margin: 0.6rem 0 1rem; }
.form-group.dsgvo-consent input[type="checkbox"] {
  appearance: auto !important;
  -webkit-appearance: auto !important;
  -moz-appearance: auto !important;
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  max-width: 18px !important;
  margin: 0.2rem 0 0 0 !important;
  padding: 0 !important;
  border: 1.5px solid #454C4D !important;
  border-radius: 3px !important;
  background: #fff !important;
  cursor: pointer !important;
  flex-shrink: 0 !important;
  accent-color: #F47522;
}
.form-group.dsgvo-consent label {
  display: inline !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  font-size: 0.8rem !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  margin-bottom: 0 !important;
  color: #454C4D !important;
  cursor: pointer !important;
}

@media (max-width: 768px) {
  .form-row { grid-template-columns:1fr; }
}

/* ===== Icons in den Eingabefeldern (Variante 4, User-Wahl 12.06.2026 — gilt auf ALLEN Breiten) ===== */
#kontakt-vorname, #kontakt-nachname, #kontakt-telefon, #kontakt-email {
  padding-left: 2.35rem;
  background-repeat: no-repeat;
  background-position: 12px center;
  background-size: 16px 16px;
}
#kontakt-vorname, #kontakt-nachname { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236096C4' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3C/svg%3E"); }
#kontakt-telefon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236096C4' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z'/%3E%3C/svg%3E"); }
#kontakt-email { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236096C4' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='4' width='20' height='16' rx='2'/%3E%3Cpath d='m22 7-10 5L2 7'/%3E%3C/svg%3E"); }
@media (max-width: 768px) {
  .form-group input:not([type="checkbox"]), .form-group select, .form-group textarea, .custom-select-trigger { border-radius: 10px; }
}
