/* Styles specific to signup/login layout shown in screenshot */
:root{
  --brand-orange: #f29b0f;
  --muted: #6c757d;
}

body{font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial; background: #f5f6f7;}

.signup-hero{padding-top:40px;padding-bottom:60px}
.signup-hero h1{font-size:40px}

.image-card{background:transparent}
.image-left{width:100%;border-radius:12px;border:3px solid rgba(242,155,15,0.95);box-shadow:0 10px 30px rgba(0,0,0,0.08)}


.form-card{border-radius:10px;padding:20px}
.referred{background:linear-gradient(90deg, rgba(242,155,15,0.12), rgba(255,255,255,0.02));}
.referred .badge-label{background:var(--brand-orange);color:#fff;padding:8px 12px;border-radius:4px;font-weight:600;font-size:14px}
.referred .referred-name{padding-left:12px;color:var(--muted);background:transparent}

.form-control{height:44px;border-radius:6px;padding:.625rem .75rem}
.input-group-text{border-left:0;border-radius:0 6px 6px 0}

.form-card .form-check{margin-top:6px}
.invalid-feedback{display:none}
.form-control.is-invalid + .invalid-feedback{display:block}

.form-card .small{margin-top:6px}

.btn-register{background:var(--brand-orange);border:none;color:#fff;padding:12px 18px;font-weight:600;border-radius:6px}
.btn-register:hover{background:#e68c00}

.small a{color:var(--brand-orange);text-decoration:none}
.small a:hover{text-decoration:underline}

@media (max-width: 991px){
  .signup-hero h1{font-size:32px}
}

/* Style the Login link shown in the right-side CTA group */
.cta-group .login-link{
  display:inline-block;
  padding:.35rem .8rem;
  border:1px solid var(--brand-orange);
  color:var(--brand-orange);
  border-radius:6px;
  font-weight:600;
  text-decoration:none;
  transition:background .12s ease, color .12s ease, transform .08s ease;
}
.cta-group .login-link:hover,
.cta-group .login-link:focus{
  background:rgba(242,155,15,0.08);
  color: #bf7a05;
  text-decoration:none;
  transform:translateY(-1px);
}

/* Ensure the nav-link padding doesn't add extra vertical space */
.cta-group .login-link.nav-link{padding-left:.5rem;padding-right:.5rem}

/* CTA band actions: keep buttons inline on larger screens */
.cta-actions{display:flex;gap:.75rem;flex-wrap:nowrap;align-items:center}
.cta-actions .btn{white-space:nowrap}

@media (max-width:575.98px){
  .cta-actions{flex-wrap:wrap}
  .cta-actions .btn{width:100%;text-align:center}
}