/* ==========================================================
   Blocksy Child – Registration Styles (Match Login)
   Datei: /wp-content/themes/blocksy-child/css/registration-form.css
   ========================================================== */

/* Container */
.srp-form { max-width: 520px; margin: 1.2rem 0 3rem; }
.srp-form p { margin: 0 0 16px; }

/* ---------- Floating Labels ---------- */
.srp-form .form-group.floating-label { position: relative; margin-bottom: 18px; }

.srp-form .form-group.floating-label input {
  width: 100%;
  padding: 14px 14px;
  border: 1px solid #ddd;
  border-radius: 12px;
  background: #fff;
  font-size: 1rem;
  transition: border-color .2s, box-shadow .2s, background .2s;
}
.srp-form .form-group.floating-label label {
  position: absolute;
  top: 50%; left: 14px; transform: translateY(-50%);
  color: #ff8c00;
  font-size: 0.95rem;
  pointer-events: none;
  transition: all .2s ease;
}
.srp-form .form-group.floating-label input::placeholder { color: transparent; }
.srp-form .form-group.floating-label input:focus + label,
.srp-form .form-group.floating-label input:not(:placeholder-shown) + label {
  top: -14px; left: 12px; font-size: .75rem; color: #d7401a;
  background: #fff; padding: 0 4px; border-radius: 4px; transform: none;
}
.srp-form .form-group.floating-label input:focus {
  outline: none; border-color: #ff7332;
  box-shadow: 0 0 0 3px rgba(239, 56, 0, 0.252);
}

/* ---------- Checkbox (EXAKT wie Login) ---------- */
/* hohe Spezifität + !important, damit Theme nicht drüber geht */
.srp-form .srp-terms { display:flex; align-items:center; gap:8px; margin:12px 0 20px; }

.srp-form input[type="checkbox"]#srp_terms {
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  width: 20px; height: 20px;
  border: 2px solid #f6873381 !important;
  border-radius: 50% !important;
  background: #fff !important;
  cursor: pointer;
  transition: all .25s ease;
  flex: 0 0 auto;
  position: relative;
}
.srp-form input[type="checkbox"]#srp_terms:hover {
  border-color: #ff6421 !important;
  box-shadow: 0 0 0 4px rgba(193,87,168,.15) !important;
}
.srp-form input[type="checkbox"]#srp_terms:checked {
  background: #e27718 !important;
  border-color: #e33c00 !important;
  box-shadow: 0 0 0 4px rgba(221, 79, 13, 0.25) !important;
}
.srp-form .srp-terms-label { font-size: .95rem; color:#444; cursor: pointer; }

/* ---------- Submit-Button (EXAKT wie „Einloggen“) ---------- */
/* deckt sowohl <button> als auch <input type=submit> ab */
.srp-form button[type="submit"],
.srp-form input[type="submit"],
.srp-form .elementor-button[type="submit"] {
  display:inline-block;
  padding: 12px 18px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background-image: linear-gradient(180deg, #ff9900, #ff7300) !important;
  background-color: transparent !important;
  color: #fff !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  cursor: pointer;
  text-decoration: none !important;
  box-shadow: 0 6px 16px rgba(255, 72, 0, 0.65) !important;
  transition: transform .05s ease, box-shadow .2s ease, filter .2s ease;
}
.srp-form button[type="submit"]:hover,
.srp-form input[type="submit"]:hover,
.srp-form .elementor-button[type="submit"]:hover {
  box-shadow: 0 8px 20px rgba(255, 64, 0, 0.35) !important;
  filter: brightness(1.08);
}
.srp-form button[type="submit"]:active,
.srp-form input[type="submit"]:active,
.srp-form .elementor-button[type="submit"]:active {
  transform: translateY(1px);
}

/* ---------- Meldungen ---------- */
.srp-errors {
  background:#fff6f8; border:1px solid #f3c0cf; color:#7a243d;
  padding:.9rem 1rem; border-radius:12px; margin:0 0 14px;
}
.srp-errors ul { margin:0; padding-left:18px; }
.srp-success {
  background:#eef7ee; border:1px solid #b7e1b7; color:#275c27;
  padding:.9rem 1rem; border-radius:12px; margin:0 0 14px;
}

/* ---------- Responsive ---------- */
@media (max-width:480px){ .srp-form { margin-bottom:2rem; } }

/* Pflichtfeld-Markierung mit Sternchen */
.srp-form .form-group.floating-label input[required] + label::after,
.srp-form .srp-terms-label::after {
  content: " *";
  color: #ff6a00;
  font-weight: bold;
  margin-left: 4px;
}