/* =========================================================
   Cultural Group — group leader registration
   Builds on cg-rules.css (page band) and cg-form.css (fields)
   ========================================================= */
.rg-wrap{max-width:860px; padding-top:24px; padding-bottom:40px}

/* Process strip: rules → register → login → application */
.rg-journey{display:flex; list-style:none; margin:0 0 16px; padding:0; gap:6px; counter-reset:none}
.rg-journey li{flex:1 1 0; min-width:0; display:grid; grid-template-columns:auto 1fr; column-gap:8px; align-items:center; background:#fff; border:1px solid var(--h-border); border-radius:10px; padding:8px 10px; font-size:.82rem; line-height:1.25; color:var(--h-muted)}
.rg-journey li span{grid-row:span 2; width:26px; height:26px; display:grid; place-items:center; border-radius:50%; background:var(--gray-100); color:var(--gray-700); font-weight:700; font-size:.8rem}
.rg-journey li b{font-weight:600; color:inherit}
.rg-journey li small{font-size:.72rem}
.rg-journey li.is-done{color:var(--h-text)}
.rg-journey li.is-done span{background:var(--success); color:#fff}
.rg-journey li.is-current{border-color:var(--orange-500); box-shadow:0 0 0 3px var(--orange-100); color:var(--navy-900)}
.rg-journey li.is-current span{background:var(--orange-700); color:#fff}

.rg-card{background:#fff; border:1px solid var(--h-border); border-radius:12px; padding:24px 28px}
.rg-card section{outline:0}
.rg-head{display:flex; flex-wrap:wrap; align-items:baseline; gap:6px 16px; margin-bottom:6px}
.rg-head h2{font-size:1.3rem; font-weight:700; margin:0}
.rg-card h2 small{font-size:.9rem; font-weight:500; color:var(--h-muted)}

/* +91 prefix on mobile */
.rg-prefix{display:flex}
.rg-prefix span{display:grid; place-items:center; padding:0 10px; border:1px solid var(--gray-200); border-right:0; border-radius:8px 0 0 8px; background:var(--gray-50); color:var(--gray-700); font-weight:600; font-size:.9rem}
.rg-prefix .form-control{border-radius:0 8px 8px 0}
.rg-prefix + .cg-fb, .rg-pwd + .cg-fb{margin-top:4px}

/* Password with show / hide */
.rg-pwd{position:relative}
.rg-pwd .form-control{padding-right:2.6rem}
.rg-eye{position:absolute; right:4px; top:50%; transform:translateY(-50%); width:34px; height:34px; border:0; background:none; color:var(--gray-500); border-radius:6px}
.rg-eye:hover{color:var(--sky-700); background:var(--sky-50)}
.rg-rules{display:flex; flex-wrap:wrap; gap:6px 14px; list-style:none; margin:0; padding:0; font-size:.8rem; color:var(--h-muted)}
.rg-rules li{display:flex; align-items:center; gap:5px}
.rg-rules li::before{content:"\f28a"; font-family:bootstrap-icons; font-size:.85rem; color:var(--gray-500)}
.rg-rules li.is-ok{color:var(--success)}
.rg-rules li.is-ok::before{content:"\f26a"; color:var(--success)}

.rg-consent{margin-top:18px; padding:10px 14px; border-radius:10px; background:var(--success-bg); color:#14532d; font-size:.875rem}
.rg-consent a{color:#14532d; text-decoration:underline}
#rg-consent{margin-top:18px}

.rg-actions{display:flex; flex-wrap:wrap; align-items:center; gap:12px 20px; margin-top:22px; padding-top:18px; border-top:1px solid var(--h-border); font-size:.9rem}
.rg-actions .btn{padding:9px 22px; font-weight:600}
.rg-actions a{font-weight:600; color:var(--sky-700)}

/* ---------- OTP panel ---------- */
#rg-otp{max-width:460px; margin:0 auto}
.rg-otp-icon{width:56px; height:56px; margin:0 auto 10px; display:grid; place-items:center; border-radius:50%; background:var(--sky-50); color:var(--sky-700); font-size:1.6rem}
#rg-otp h2{font-size:1.3rem; font-weight:700; margin:0 0 6px}
.rg-otp-sub{font-size:.9rem; margin-bottom:14px}
.rg-otp-sub span{color:var(--h-muted); font-size:.85rem}

.rg-mock-msg{display:flex; align-items:center; gap:10px; background:var(--gray-50); border:1px dashed var(--sky-300); border-radius:12px; padding:10px 12px; margin-bottom:16px; font-size:.85rem; position:relative}
.rg-mock-msg em{flex:0 0 34px; height:34px; display:grid; place-items:center; border-radius:50%; background:var(--success); color:#fff; font-style:normal}
.rg-mock-msg strong{display:block; font-size:.8rem}
.rg-mock-msg small{color:var(--gray-700)}
.rg-mock-msg b{color:var(--navy-900); letter-spacing:.08em}
.rg-mock-tag{position:absolute; top:-9px; right:10px; background:var(--orange-100); color:var(--orange-800); font-size:.65rem; font-weight:700; border-radius:4px; padding:1px 6px; text-transform:uppercase; letter-spacing:.04em}

.rg-otp-note{display:block; margin:16px 0 0; padding:10px 14px; border-radius:10px; background:var(--sky-50); border:1px solid var(--sky-200); font-size:.85rem; color:var(--gray-700)}
.rg-otp-note > i{color:var(--sky-700); font-size:1rem; margin-right:6px}
.rg-otp-note span{display:block; margin-top:2px; color:var(--h-muted)}
#rg-mock-list{display:flex; flex-direction:column; gap:12px; margin-bottom:6px}
#rg-mock-list .rg-mock-msg{margin-bottom:0}
.rg-otp-group{margin-top:14px}
.rg-otp-label{display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:4px 6px; margin:0 0 8px; font-size:.875rem; font-weight:600; color:var(--navy-900)}
.rg-otp-label > i{color:var(--sky-700)}
.rg-otp-label span{font-weight:400; color:var(--h-muted)}
.rg-otp-label strong{font-weight:600; color:var(--gray-700)}
.rg-otp-boxes{display:flex; justify-content:center; gap:8px}
.rg-otp-box{width:46px; height:52px; text-align:center; font-size:1.35rem; font-weight:700; border:1.5px solid var(--gray-200); border-radius:10px; background:#fff; color:var(--navy-900)}
.rg-otp-box:focus{border-color:var(--sky-500); box-shadow:0 0 0 .22rem rgba(14,165,233,.18); outline:0}
.rg-otp-box.filled{border-color:var(--sky-600); background:var(--sky-50)}
.rg-otp-box.is-invalid{border-color:var(--danger)}
.rg-otp-row{display:flex; justify-content:space-between; align-items:center; gap:10px; margin:14px 0; font-size:.85rem; color:var(--h-muted)}
.rg-link-btn{border:0; background:none; padding:0; color:var(--sky-700); font-weight:600; font-size:.875rem}
.rg-link-btn:disabled{color:var(--gray-500); cursor:not-allowed}
.rg-link-btn:not(:disabled):hover{text-decoration:underline}
#rg-otp .cg-block-msg{margin-top:12px}
#rg-verify{padding:10px; font-weight:600}
#rg-verify:disabled{background:var(--gray-200); border-color:var(--gray-200); color:var(--gray-500)}

@media (max-width: 767.98px){
  .rg-card{padding:18px 16px}
  .rg-journey li{grid-template-columns:1fr; justify-items:center; text-align:center; padding:8px 4px}
  .rg-journey li span{grid-row:auto; margin-bottom:4px}
  .rg-journey li small{display:none}
  .rg-otp-box{width:40px; height:48px}
}