/* registro-lp.css */
.custom-form-container {
  background: #fbfbfb;
  border: 5px solid #f2c17d;
  border-radius: 20px;
  padding: 30px 40px;
  max-width: 520px;
  width: 90%;
  box-sizing: border-box;
  color: #333;
  margin: 0 auto; /* Centrado */
  position: relative;
  box-shadow: 0 6px 20px rgba(0,0,0,0.2);
  font-family: 'Segoe UI', sans-serif;
}

.custom-form-container label {
  display: block;
  margin-bottom: 5px;
  margin-top: 15px;
  font-size: 16px;
  color: #333;
  font-weight: 600;
}

.custom-form-container input[type="email"],
.custom-form-container input[type="password"] {
  background: #f0f0f0;
  color: #333;
  border: 2px solid #ccc;
  width: 100%;
  padding: 10px;
  font-size: 16px;
  border-radius: 6px;
  box-sizing: border-box;
}

.password-hint {
  font-size: 13px;
  color: #666;
  margin-top: 4px;
  font-style: italic;
}

.custom-form-container button {
  background: #f7c471;
  color: #fff;
  font-size: 18px;
  padding: 10px 20px;
  margin-top: 25px;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  box-shadow: 4px 4px 0 #e0a951;
  transition: all .25s ease;
  width: 100%;
  font-weight: bold;
  position: relative;
}

.custom-form-container button:hover {
  background: #f4b64e;
  transform: scale(1.02);
}
.custom-form-container button:disabled {
  background: #ccc;
  box-shadow: none;
  cursor: not-allowed;
  transform: none;
}

.spinner { width: 16px; height: 16px; border: 2px solid #fff; border-top: 2px solid #f2c17d; border-radius: 50%; animation: spin .8s linear infinite; position: absolute; right: 15px; top: 50%; transform: translateY(-50%); display: none; }
@keyframes spin { 0% { transform: translateY(-50%) rotate(0); } 100% { transform: translateY(-50%) rotate(360deg); } }

.form-error {
  color: #c71b1b;
  background: #ffecec;
  border: 1px solid #ffb3b3;
  padding: 10px;
  border-radius: 6px;
  margin-top: 15px;
  display: none;
  text-align: center;
}

@media (max-width:480px){
  .custom-form-container{padding:20px; margin: 50px 20px 30px;}
  .custom-form-container input{font-size:14px}
  .custom-form-container label{font-size:14px}
}