/* ============================================================
   PapilioHost - create account (register.css, rg v1, 2026-09-15)
   Loaded only on templatefile == clientregister, after auth.css.
   Same family as the login card: glass body, masked gradient edge,
   Clash type, bright sky submit with a sheen. Built to fit one
   laptop screen: a rail tag per group + a 4-column field grid.
   ============================================================ */

body[data-tpl="clientregister"] .cfa-wrap{
  --rg-field:#0f1927;
  --rg-field-hi:#132033;
  --rg-edge:#223247;
  --rg-edge-hi:#2f4560;
  --rg-label:#b9c7d6;
  --rg-ph:#56687d;
  --rg-mute:#8a9bb0;
  --rg-sky:#38bdf8;
  --rg-ice:#bfeeff;
  --rg-ok:#34d399;
  --rg-warn:#fbbf24;
  --rg-bad:#fb7185;
  --rg-ease:cubic-bezier(.22,1,.36,1);
}

/* ---------- the pane: give the form the room, keep the brand panel ---------- */
body[data-tpl="clientregister"] .cfa-brand{flex:0 0 31%}
body[data-tpl="clientregister"] .cfa-brand-in h2{font-size:clamp(26px,2.1vw,38px)}
body[data-tpl="clientregister"] .cfa-brand-in p{font-size:clamp(14px,.9vw,16px)}
body[data-tpl="clientregister"] .cfa-mark{right:-26%;height:60%;opacity:.5}
body[data-tpl="clientregister"] .cfa-strip{gap:10px 18px;left:48px;right:40px}
body[data-tpl="clientregister"] .cfa-strip span{white-space:nowrap}
body[data-tpl="clientregister"] .cfa-brand{padding-left:48px;padding-right:40px}
body[data-tpl="clientregister"] .cfa-scroll{padding:70px 40px 28px;justify-content:safe center}
body[data-tpl="clientregister"] .cfa-scroll>#rgWrap{max-width:none !important;width:100%}

/* ---------- wrapper ---------- */
.rg{width:100%;max-width:980px;margin:0 auto;color:var(--txt);color-scheme:dark}
.rg *,.rg *::before,.rg *::after{box-sizing:border-box}
.rg a{text-decoration:none}

/* ---------- card: the login glass, one size up ---------- */
.rg .rg-card{
  position:relative;margin:0;padding:26px 30px 24px;border-radius:20px;
  background:linear-gradient(180deg,rgba(22,36,58,.64) 0%,rgba(11,18,32,.74) 58%,rgba(9,15,26,.8) 100%);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  box-shadow:0 34px 80px -40px rgba(0,0,0,.95),0 0 0 1px rgba(56,189,248,.05),inset 0 1px 0 rgba(255,255,255,.06);
}
.rg .rg-card::before{
  content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;pointer-events:none;
  background:linear-gradient(152deg,rgba(56,189,248,.6) 0%,rgba(129,160,248,.26) 24%,rgba(255,255,255,.05) 50%,rgba(56,189,248,.22) 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
          mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
}
.rg .rg-card::after{
  content:"";position:absolute;left:8%;right:8%;top:0;height:1px;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(191,238,255,.75),transparent);
  box-shadow:0 0 18px 1px rgba(56,189,248,.35);
}
.rg .rg-card>*{position:relative;z-index:1}

/* ---------- head ---------- */
.rg .rg-head{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin:0 0 18px}
.rg .rg-eyebrow{display:flex;align-items:center;gap:10px;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--rg-mute);margin:0 0 8px}
.rg .rg-eyebrow::before{content:"";width:18px;height:1px;background:linear-gradient(90deg,var(--rg-sky),transparent)}
.rg .rg-head h1{margin:0;font-family:var(--display);font-weight:600;font-size:clamp(24px,1.9vw,30px);line-height:1.08;letter-spacing:-.022em;color:#f2f8fe}
.rg .rg-head h1 b{font-weight:600;background:linear-gradient(96deg,#e0f6ff 0%,#7dd3fc 45%,#38bdf8 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.rg .rg-signin{display:inline-flex;align-items:center;gap:10px;flex:none;height:40px;padding:0 6px 0 16px;border-radius:999px;
  border:1px solid rgba(125,211,252,.18);background:rgba(56,189,248,.05);font-size:13px;color:var(--rg-mute);
  transition:border-color .2s,background .2s}
.rg .rg-signin b{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 12px;border-radius:999px;background:rgba(56,189,248,.14);color:#dff5ff;font-weight:500}
.rg .rg-signin svg{width:14px;height:14px;transition:transform .25s var(--rg-ease)}
.rg .rg-signin:hover{border-color:rgba(125,211,252,.4);background:rgba(56,189,248,.09)}
.rg .rg-signin:hover svg{transform:translateX(3px)}

/* ---------- groups: rail on the left, 4-column grid on the right ---------- */
.rg .rg-contents{display:contents}
.rg .rg-group{display:grid;grid-template-columns:132px minmax(0,1fr);gap:0 26px;padding:16px 0;position:relative}
.rg .rg-group+.rg-group,.rg .rg-contents+.rg-contents .rg-group,.rg #containerNewUserSecurity .rg-group{border-top:0}
.rg .rg-group::before{
  content:"";position:absolute;left:0;right:0;top:0;height:1px;pointer-events:none;
  background:linear-gradient(90deg,transparent 0%,rgba(125,211,252,.16) 12%,rgba(125,211,252,.16) 88%,transparent 100%);
}
.rg #containerNewUserSignup>.rg-group:first-child::before{display:none}
.rg .rg-rail{display:flex;flex-direction:column;gap:3px;padding-top:2px}
.rg .rg-num{position:relative;width:30px;height:30px;border-radius:9px;display:grid;place-items:center;margin-bottom:8px;
  background:linear-gradient(160deg,rgba(125,211,252,.18),rgba(56,189,248,.05));box-shadow:inset 0 0 0 1px rgba(125,211,252,.22);
  transition:background .35s var(--rg-ease),box-shadow .35s var(--rg-ease)}
.rg .rg-num i{font-style:normal;font-family:var(--mono,'JetBrains Mono',monospace);font-size:11.5px;color:#9fdcf7;letter-spacing:.02em;transition:opacity .25s,transform .35s var(--rg-ease)}
.rg .rg-num svg{position:absolute;width:15px;height:15px;color:#04141f;opacity:0;transform:scale(.4) rotate(-20deg);transition:opacity .25s,transform .45s var(--rg-ease)}
.rg .rg-group.is-done .rg-num{background:linear-gradient(145deg,#bfeeff,#38bdf8);box-shadow:0 8px 20px -10px rgba(56,189,248,.9),inset 0 0 0 1px rgba(255,255,255,.35)}
.rg .rg-group.is-done .rg-num i{opacity:0;transform:scale(.6)}
.rg .rg-group.is-done .rg-num svg{opacity:1;transform:none}
.rg .rg-name{font-family:var(--display);font-size:15px;font-weight:600;letter-spacing:-.01em;color:#eef6fd;line-height:1.2}
.rg .rg-cap{font-size:12px;line-height:1.4;color:var(--rg-mute)}

.rg .rg-fields{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px 12px;align-content:start}
.rg .rg-f{display:flex;flex-direction:column;min-width:0;position:relative}
.rg .rg-f.s2{grid-column:span 2}
.rg .s4{grid-column:1 / -1}

/* ---------- labels + inputs ---------- */
.rg .rg-f>label{display:flex;align-items:center;gap:8px;margin:0 0 6px;font-size:13px;font-weight:400;color:var(--rg-label);line-height:1.2;letter-spacing:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rg .rg-f>label em{font-style:normal;font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:#6f84a0;padding:2px 6px;border-radius:5px;border:1px solid rgba(125,211,252,.14)}
.rg .rg-in,
.rg .rg-f input[type=text],.rg .rg-f input[type=email],.rg .rg-f input[type=tel],.rg .rg-f input[type=password],.rg .rg-f select{
  width:100%;height:44px;margin:0;padding:0 14px;font-family:var(--ui);font-size:15px;font-weight:400;color:var(--txt) !important;
  background:var(--rg-field) !important;border:1px solid var(--rg-edge) !important;border-radius:10px !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.02) !important;outline:none;
  transition:border-color .18s,box-shadow .25s var(--rg-ease),background .2s;
}
.rg .rg-in::placeholder,.rg .rg-f input::placeholder{color:var(--rg-ph);opacity:1}
.rg .rg-in:hover,.rg .rg-f input:hover,.rg .rg-f select:hover{border-color:var(--rg-edge-hi) !important}
.rg .rg-in:focus,.rg .rg-f input:focus,.rg .rg-f select:focus{
  border-color:rgba(56,189,248,.85) !important;background:var(--rg-field-hi) !important;
  box-shadow:0 0 0 3px rgba(56,189,248,.14),0 10px 26px -18px rgba(56,189,248,.8) !important;
}
.rg .rg-f:focus-within>label{color:#e3f4ff}
/* browser autofill stays dark */
.rg input:-webkit-autofill,.rg input:-webkit-autofill:hover,.rg input:-webkit-autofill:focus{
  -webkit-text-fill-color:var(--txt) !important;caret-color:#fff;
  -webkit-box-shadow:0 0 0 1000px var(--rg-field-hi) inset !important;box-shadow:0 0 0 1000px var(--rg-field-hi) inset !important;
  transition:background-color 9999s ease 0s}

/* selects: own caret, dark list */
.rg .rg-sel{position:relative}
.rg .rg-sel::after,.rg .rg-state:has(select)::after{
  content:"";position:absolute;right:14px;bottom:18px;width:8px;height:8px;pointer-events:none;
  border-right:1.6px solid #7f93aa;border-bottom:1.6px solid #7f93aa;transform:rotate(45deg)}
.rg .rg-f select{appearance:none;-webkit-appearance:none;padding-right:34px;cursor:pointer;text-overflow:ellipsis}
.rg select option{background:#0d1522;color:#eaf1f8}
/* StatesDropdown.js swaps #state for #stateinput + #stateselect */
.rg .rg-state #stateselect{margin-top:0}

/* phone: intl-tel-input */
.rg .rg-phone .intl-tel-input,.rg .rg-phone .iti{display:block;width:100%}
.rg .rg-phone .intl-tel-input input,.rg .rg-phone .iti input{padding-left:92px !important}
.rg .rg-phone .flag-container{padding:0 !important}
.rg .rg-phone .selected-flag{background:transparent !important;border-radius:10px 0 0 10px;padding:0 10px 0 14px !important;
  border-right:1px solid var(--rg-edge);height:100%;display:flex;align-items:center;gap:8px}
.rg .rg-phone .selected-dial-code{color:#cfe0ef !important;font-size:14.5px}
.rg .rg-phone .iti-arrow{border-top-color:#7f93aa !important}
.rg .intl-tel-input .country-list,.cfa-wrap .intl-tel-input .country-list,body > .intl-tel-input .country-list,.iti-container .country-list{
  background:#0c1422 !important;border:1px solid #243246 !important;border-radius:12px !important;color:#e6f0fa !important;
  box-shadow:0 24px 60px -24px rgba(0,0,0,.9) !important;max-height:260px;scrollbar-color:#2a3a50 transparent}
.rg .intl-tel-input .country-list .country.highlight,.iti-container .country-list .country.highlight{background:rgba(56,189,248,.14) !important}
.rg .intl-tel-input .country-list .divider{border-color:#223247 !important}
.rg .intl-tel-input .country-list .dial-code{color:#7f93aa !important}

/* ---------- passwords ---------- */
.rg .rg-pw{position:relative;display:block;width:100%}
.rg .rg-pw .pw-input{padding-right:50px !important}
.rg .rg-eye{position:absolute;top:5px;right:5px;bottom:5px;width:38px;display:grid;place-items:center;cursor:pointer;
  border:0 !important;border-radius:8px !important;background:transparent !important;color:#7f93aa !important;box-shadow:none !important;
  transition:background .18s,color .18s}
.rg .rg-eye:hover{background:rgba(56,189,248,.10) !important;color:#dff5ff !important}
.rg .rg-eye svg{width:19px;height:19px}
.rg .rg-eye .ic-off{display:none}
.rg .rg-eye.is-on .ic-on{display:none}
.rg .rg-eye.is-on .ic-off{display:block;color:var(--rg-sky)}
.rg .rg-match{display:inline-flex;align-items:center;gap:4px;margin-left:auto;font-size:11.5px;color:var(--rg-ok);
  opacity:0;transform:translateY(3px);transition:opacity .25s,transform .35s var(--rg-ease)}
.rg .rg-match svg{width:12px;height:12px}
.rg .rg-confirm>label{overflow:visible}
.rg .rg-confirm.is-match .rg-match{opacity:1;transform:none}
.rg .rg-confirm.is-match .pw-input{border-color:rgba(52,211,153,.55) !important}

/* ---------- strength meter: fills itself, glows, never sits still ---------- */
.rg .rg-strength{justify-content:flex-end;align-self:end}
.rg .rg-lblrow{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 6px;min-height:16px}
.rg .rg-lblrow>label{margin:0;font-size:13px;font-weight:400;color:var(--rg-label);line-height:1.2}
.rg .rg-f:focus-within .rg-lblrow>label{color:#e3f4ff}
.rg .rg-lblrow .rg-gen{height:22px;padding:0 9px;font-size:12px;margin:-4px 0}
.rg .rg-rules{display:inline-flex;gap:5px;flex:none}
.rg .rg-rules i{font-style:normal;font-family:var(--mono,'JetBrains Mono',monospace);font-size:10.5px;line-height:1;padding:4px 6px;border-radius:6px;
  color:#5f7289;border:1px solid rgba(125,211,252,.12);background:rgba(15,25,39,.6);transition:color .25s,border-color .25s,background .25s,transform .35s var(--rg-ease)}
.rg .rg-rules i.on{color:#04141f;border-color:transparent;background:linear-gradient(145deg,#bfeeff,#38bdf8);transform:translateY(-1px);box-shadow:0 6px 14px -8px rgba(56,189,248,.9)}
.rg .rg-meter-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 9px}
.rg #passwordStrengthTextLabel{margin:0;font-family:var(--ui);font-size:12.5px;letter-spacing:0;color:var(--rg-mute);text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rg[data-pw="weak"] #passwordStrengthTextLabel{color:#fda4b4}
.rg[data-pw="moderate"] #passwordStrengthTextLabel{color:#fcd68a}
.rg[data-pw="strong"] #passwordStrengthTextLabel{color:#8ef0c6}
.rg .rg-meter{margin:0}
.rg .rg-meter .progress{position:relative;height:10px;margin:0;border-radius:999px;overflow:hidden;
  background:
    repeating-linear-gradient(90deg,transparent 0 calc(25% - 2px),rgba(7,12,22,.9) calc(25% - 2px) 25%),
    linear-gradient(180deg,#0c1522,#111c2b) !important;
  box-shadow:inset 0 0 0 1px rgba(125,211,252,.12),inset 0 2px 4px rgba(0,0,0,.35)}
.rg #passwordStrengthMeterBar{
  position:relative;height:100%;width:0;border-radius:999px;overflow:hidden;
  background:linear-gradient(90deg,#fb7185,#fda4af) !important;
  box-shadow:0 0 14px -2px rgba(251,113,133,.7);
  transition:width .7s var(--rg-ease),background .4s,box-shadow .4s}
.rg #passwordStrengthMeterBar.bg-warning{background:linear-gradient(90deg,#f59e0b,#fbbf24,#fde68a) !important;box-shadow:0 0 16px -2px rgba(251,191,36,.7)}
.rg #passwordStrengthMeterBar.bg-success{background:linear-gradient(90deg,#10b981,#34d399 45%,#7dd3fc 100%) !important;box-shadow:0 0 18px -2px rgba(52,211,153,.75)}
.rg #passwordStrengthMeterBar::before{
  content:"";position:absolute;inset:0;
  background:repeating-linear-gradient(115deg,rgba(255,255,255,.22) 0 6px,transparent 6px 14px);
  background-size:28px 100%;animation:rgFlow 1.1s linear infinite;opacity:.7}
.rg #passwordStrengthMeterBar::after{
  content:"";position:absolute;top:0;bottom:0;width:40%;left:-45%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.8),transparent);
  animation:rgSweep 2.4s var(--rg-ease) infinite}
@keyframes rgFlow{to{background-position:28px 0}}
@keyframes rgSweep{0%{left:-45%}60%,100%{left:110%}}

.rg .rg-gen{display:inline-flex;align-items:center;gap:6px;flex:none;height:28px;padding:0 11px;border-radius:999px;cursor:pointer;
  font-family:var(--ui);font-size:12.5px;color:#cfeaff !important;background:rgba(56,189,248,.08) !important;
  border:1px solid rgba(125,211,252,.24) !important;box-shadow:none !important;transition:background .2s,border-color .2s,color .2s}
.rg .rg-gen svg{width:14px;height:14px}
.rg .rg-gen:hover{background:rgba(56,189,248,.16) !important;border-color:rgba(125,211,252,.5) !important;color:#fff !important}

/* ---------- mailing list: a real switch ---------- */
.rg .rg-switch{flex-direction:row;align-items:center;gap:14px;margin:0;padding:10px 14px;cursor:pointer;align-self:end;min-height:58px;
  border-radius:12px;border:1px solid rgba(125,211,252,.12);background:linear-gradient(180deg,rgba(15,25,39,.7),rgba(10,17,28,.7));
  transition:border-color .25s,background .25s}
.rg .rg-switch:hover{border-color:rgba(125,211,252,.28)}
.rg .rg-switch input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.rg .rg-track{position:relative;flex:none;width:48px;height:28px;border-radius:999px;background:#1a2638;
  box-shadow:inset 0 0 0 1px #2a3a50,inset 0 2px 5px rgba(0,0,0,.4);transition:background .35s var(--rg-ease),box-shadow .35s}
.rg .rg-knob{position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;
  background:radial-gradient(circle at 35% 30%,#ffffff,#c9d6e3);box-shadow:0 3px 8px rgba(0,0,0,.45);
  transition:transform .45s var(--rg-ease),background .3s}
.rg .rg-switch input:checked+.rg-track{background:linear-gradient(135deg,#0ea5e9,#38bdf8 55%,#7dd3fc);box-shadow:inset 0 0 0 1px rgba(255,255,255,.18),0 0 18px -4px rgba(56,189,248,.8)}
.rg .rg-switch input:checked+.rg-track .rg-knob{transform:translateX(20px);background:radial-gradient(circle at 35% 30%,#ffffff,#e6f7ff)}
.rg .rg-switch input:focus-visible+.rg-track{outline:2px solid rgba(56,189,248,.6);outline-offset:3px}
.rg .rg-switch-t{display:flex;flex-direction:column;gap:2px;min-width:0}
.rg .rg-switch-t b{font-weight:500;font-size:14px;color:#e8f3fc}
.rg .rg-switch-t span{font-size:12px;color:var(--rg-mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ---------- foot: captcha on the left, the button on the right ---------- */
.rg .rg-foot{display:grid;grid-template-columns:146px repeat(4,minmax(0,1fr));gap:0 12px;align-items:end;padding:18px 0 0;position:relative}
.rg .rg-foot::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;
  background:linear-gradient(90deg,transparent 0%,rgba(125,211,252,.16) 12%,rgba(125,211,252,.16) 88%,transparent 100%)}
.rg .rg-captcha{grid-column:2 / 4;display:flex;flex-direction:column;min-width:0;margin:0;padding:0;text-align:left}
/* the theme gives #default-captcha-domainchecker margin 15px 0 -25px (an id rule): cancel it */
.rg #default-captcha-domainchecker.rg-captcha{margin:0 !important;padding:0 !important;text-align:left !important}
.rg .rg-captcha>label{display:flex;align-items:baseline;gap:8px;margin:0 0 6px;font-size:13px;color:var(--rg-label);font-weight:400}
.rg .rg-captcha>label span{font-size:11.5px;color:#6f84a0}
.rg .rg-captcha-row{display:flex;align-items:stretch;gap:10px}
.rg .rg-captcha-img{position:relative;flex:none;display:flex;align-items:center;height:48px;padding:0 44px 0 6px;border-radius:10px;
  background:linear-gradient(180deg,#0d1624,#0a121e);box-shadow:inset 0 0 0 1px var(--rg-edge)}
.rg .rg-captcha-img::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(100deg,transparent 30%,rgba(191,238,255,.10) 50%,transparent 70%);background-size:220% 100%;animation:rgGlint 4.5s ease-in-out infinite}
@keyframes rgGlint{0%,100%{background-position:120% 0}50%{background-position:-20% 0}}
.rg #inputCaptchaImage{height:36px !important;width:auto !important;display:block;border:0 !important;border-radius:7px !important;cursor:pointer;
  filter:invert(.93) hue-rotate(185deg) saturate(1.6) contrast(1.08) !important}
.rg .pl-captcha-refresh{position:absolute;right:6px;top:6px;bottom:6px;width:34px;display:grid;place-items:center;cursor:pointer;
  border:0;border-radius:8px;background:rgba(56,189,248,.08);color:#9fdcf7;transition:background .2s,color .2s}
.rg .pl-captcha-refresh svg{width:16px;height:16px;transition:transform .5s var(--rg-ease)}
.rg .pl-captcha-refresh:hover{background:rgba(56,189,248,.18);color:#fff}
.rg .pl-captcha-refresh:hover svg{transform:rotate(180deg)}
.rg .rg-code{flex:1;min-width:0;height:48px !important;font-family:var(--mono,'JetBrains Mono',monospace) !important;
  font-size:17px !important;letter-spacing:.34em;text-transform:uppercase;text-align:center;padding:0 10px !important;float:none !important}
.rg .rg-code::placeholder{letter-spacing:.34em;color:#3e4f63}
.rg .rg-captcha.is-recaptcha{align-items:flex-start}
.rg .rg-captcha.is-recaptcha .recaptcha-container{margin:0}

.rg .rg-submit{grid-column:4 / 6;display:flex;flex-direction:column;gap:9px;min-width:0}
.rg .rg-foot:not(:has(.rg-captcha)) .rg-submit{grid-column:4 / 6}

/* the button: bright sky, inner glow, sheen, a soft pool of light beneath */
.rg .rg-go{position:relative;display:block;isolation:isolate}
.rg .rg-go::before{
  content:"";position:absolute;left:10%;right:10%;bottom:-14px;height:26px;z-index:-1;border-radius:50%;pointer-events:none;
  background:radial-gradient(closest-side,rgba(56,189,248,.55),rgba(56,189,248,0));filter:blur(8px);opacity:.75;
  transition:opacity .35s,transform .45s var(--rg-ease)}
.rg .rg-go::after{content:none}
@keyframes rgBtnSheen{0%{background-position:-160% 0,0 0,0 0}38%,100%{background-position:260% 0,0 0,0 0}}
.rg .rg-btn{
  position:relative;z-index:1;display:block;width:100%;height:50px;margin:0;border:0 !important;border-radius:12px !important;cursor:pointer;
  font-family:var(--ui);font-size:16px;font-weight:600;letter-spacing:.01em;
  color:#03121d !important;-webkit-text-fill-color:#03121d !important;
  background:
    linear-gradient(105deg,transparent 42%,rgba(255,255,255,.62) 50%,transparent 58%) no-repeat,
    radial-gradient(120% 140% at 50% -40%,rgba(255,255,255,.55),transparent 55%),
    linear-gradient(118deg,#bfeeff 0%,#7dd3fc 32%,#38bdf8 68%,#0ea5e9 100%) !important;
  background-size:60% 100%,100% 100%,100% 100% !important;
  background-position:-160% 0,0 0,0 0;
  animation:rgBtnSheen 3.8s cubic-bezier(.22,1,.36,1) 1.2s infinite;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7),inset 0 -8px 18px -10px rgba(2,132,199,.9),0 18px 40px -20px rgba(56,189,248,.95),0 0 0 1px rgba(125,211,252,.35) !important;
  transition:transform .25s var(--rg-ease),box-shadow .3s,filter .25s}
.rg .rg-go:hover::before{opacity:1;transform:scaleX(1.08)}
.rg .rg-btn:hover{filter:brightness(1.06) saturate(1.05);transform:translateY(-1px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8),inset 0 -8px 18px -10px rgba(2,132,199,.9),0 22px 48px -18px rgba(56,189,248,1),0 0 0 1px rgba(191,238,255,.5) !important}
.rg .rg-btn:active{transform:translateY(1px)}
.rg .rg-btn:focus-visible{outline:2px solid #bfeeff;outline-offset:3px}
.rg .rg-go.is-busy .rg-btn{color:transparent !important;-webkit-text-fill-color:transparent !important;pointer-events:none}
.rg .rg-go.is-busy::after{content:"";position:absolute;z-index:2;left:50%;top:50%;width:20px;height:20px;margin:-10px 0 0 -10px;border-radius:50%;
  border:2px solid rgba(3,18,29,.3);border-top-color:#03121d;animation:rgSpin .7s linear infinite;pointer-events:none}
@keyframes rgSpin{to{transform:rotate(360deg)}}
.rg .rg-legal{margin:2px 0 0;font-size:12px;color:#6f84a0;text-align:center}

.rg .rg-tos{display:flex;align-items:center;gap:10px;margin:0 0 2px;font-size:13px;color:var(--rg-label);cursor:pointer}
.rg .rg-tos input{position:absolute;opacity:0;width:1px;height:1px}
.rg .rg-check{flex:none;width:18px;height:18px;border-radius:5px;display:grid;place-items:center;border:1.5px solid var(--rg-edge-hi);background:var(--rg-field);transition:background .2s,border-color .2s}
.rg .rg-check svg{width:12px;height:12px;color:#04141f;stroke-dasharray:20;stroke-dashoffset:20;transition:stroke-dashoffset .25s}
.rg .rg-tos input:checked+.rg-check{background:var(--rg-sky);border-color:var(--rg-sky)}
.rg .rg-tos input:checked+.rg-check svg{stroke-dashoffset:0}
.rg .rg-tos a{color:#7dd3fc}

/* ---------- alerts ---------- */
.rg .rg-alert{display:flex;gap:12px;align-items:flex-start;margin:0 0 14px;padding:12px 16px;border-radius:14px;font-size:13.5px;line-height:1.5;
  background:linear-gradient(180deg,rgba(40,14,24,.75),rgba(24,10,18,.8));border:1px solid rgba(251,113,133,.35);color:#ffe4ea}
.rg .rg-alert svg{flex:none;width:18px;height:18px;margin-top:1px;color:var(--rg-bad)}
.rg .rg-alert ul{margin:0;padding-left:18px}
.rg .rg-alert li+li{margin-top:2px}
.rg .rg-alert a{color:#fecdd3;text-decoration:underline}
.rg .rg-alert.is-info{background:rgba(56,189,248,.08);border-color:rgba(125,211,252,.3);color:#dff5ff}
.rg .w-hidden{display:none !important}

/* ---------- links under the card ---------- */
.rg .rg-links{display:flex;align-items:center;justify-content:center;gap:12px;margin:16px 0 0;font-size:12.5px}
.rg .rg-links a{color:#7d90a6;transition:color .2s}
.rg .rg-links a:hover{color:#dff5ff}
.rg .rg-links i{width:3px;height:3px;border-radius:50%;background:#34465c}

/* ---------- the generate-password modal was a white Bootstrap box ---------- */
body[data-tpl="clientregister"] #modalGeneratePassword .modal-content{background:linear-gradient(180deg,#0f1a2a,#0a121e) !important;border:1px solid #243246 !important;border-radius:16px !important;color:#e6f0fa !important;box-shadow:0 40px 90px -30px rgba(0,0,0,.95) !important;overflow:hidden}
body[data-tpl="clientregister"] #modalGeneratePassword .modal-header{background:linear-gradient(118deg,rgba(56,189,248,.16),rgba(56,189,248,.04)) !important;border-bottom:1px solid #1e2c3e !important;color:#f2f8fe !important;padding:16px 20px}
body[data-tpl="clientregister"] #modalGeneratePassword .modal-title{font-family:"Clash Display",var(--ui);font-weight:600;font-size:17px;color:#f2f8fe}
body[data-tpl="clientregister"] #modalGeneratePassword .close{color:#8a9bb0 !important;text-shadow:none;opacity:1}
body[data-tpl="clientregister"] #modalGeneratePassword .modal-body{padding:18px 20px}
body[data-tpl="clientregister"] #modalGeneratePassword label{color:#b9c7d6;font-size:13px}
body[data-tpl="clientregister"] #modalGeneratePassword .form-control{height:42px;background:#0f1927 !important;border:1px solid #223247 !important;border-radius:10px !important;color:#eaf1f8 !important;font-family:"JetBrains Mono",monospace}
body[data-tpl="clientregister"] #modalGeneratePassword .modal-footer{border-top:1px solid #1e2c3e !important;padding:14px 20px}
body[data-tpl="clientregister"] #modalGeneratePassword .btn-default{background:rgba(56,189,248,.08) !important;border:1px solid rgba(125,211,252,.24) !important;color:#cfeaff !important;border-radius:9px !important}
body[data-tpl="clientregister"] #modalGeneratePassword .btn-primary{background:linear-gradient(118deg,#7dd3fc,#38bdf8) !important;border:0 !important;color:#03121d !important;font-weight:600;border-radius:9px !important}
body[data-tpl="clientregister"] #modalGeneratePassword .btn img{filter:invert(1);opacity:.8}
body[data-tpl="clientregister"] .modal-backdrop.show{opacity:.72;background:#02060d}

/* ============================================================
   responsive
   ============================================================ */
/* laptops with less height: tighten the rhythm, keep one screen */
@media (max-height:899px) and (min-width:1051px){
  body[data-tpl="clientregister"] .cfa-scroll{padding-top:66px;padding-bottom:20px}
  .rg .rg-card{padding:22px 28px 20px}
  .rg .rg-head{margin-bottom:12px}
  .rg .rg-group{padding:12px 0}
  .rg .rg-fields{gap:10px 12px}
  .rg .rg-in,.rg .rg-f input[type=text],.rg .rg-f input[type=email],.rg .rg-f input[type=tel],.rg .rg-f input[type=password],.rg .rg-f select{height:40px}
  .rg .rg-foot{padding-top:14px}
  .rg .rg-cap{display:none}
  .rg .rg-links{margin-top:10px}
}
/* short laptop screens (1366x768, 1280x720): one more notch so the form still fits */
@media (max-height:800px) and (min-width:1051px){
  body[data-tpl="clientregister"] .cfa-scroll{padding-top:62px;padding-bottom:12px}
  .rg .rg-card{padding:18px 26px 16px}
  .rg .rg-eyebrow{display:none}
  .rg .rg-head{margin-bottom:6px}
  .rg .rg-head h1{font-size:24px}
  .rg .rg-signin{height:36px}
  .rg .rg-signin b{height:26px}
  .rg .rg-group{padding:8px 0}
  .rg .rg-fields{gap:8px 12px}
  .rg .rg-f>label,.rg .rg-lblrow{margin-bottom:4px}
  .rg .rg-in,.rg .rg-f input[type=text],.rg .rg-f input[type=email],.rg .rg-f input[type=tel],.rg .rg-f input[type=password],.rg .rg-f select{height:38px;font-size:14.5px}
  .rg .rg-num{width:26px;height:26px;margin-bottom:5px}
  .rg .rg-switch{min-height:50px;padding:7px 12px}
  .rg .rg-foot{padding-top:10px}
  .rg .rg-captcha-img,.rg .rg-code{height:42px !important}
  .rg #inputCaptchaImage{height:32px !important}
  .rg .rg-btn{height:44px}
  .rg .rg-legal{display:none}
  .rg .rg-links{margin-top:6px}
}
@media (max-width:1280px) and (min-width:1051px){
  body[data-tpl="clientregister"] .cfa-brand{flex-basis:28%}
  .rg .rg-group{grid-template-columns:104px minmax(0,1fr);gap:0 18px}
  .rg .rg-foot{grid-template-columns:110px repeat(4,minmax(0,1fr))}
  .rg .rg-cap{font-size:11.5px}
}
/* the brand panel leaves at 1050 (auth.css): the form has the full width */
@media (max-width:1050px){
  body[data-tpl="clientregister"] .cfa-scroll{padding:84px 22px 34px}
}
@media (max-width:760px){
  .rg .rg-card{padding:20px 18px 18px;border-radius:18px}
  .rg .rg-head{flex-direction:column;align-items:stretch;gap:12px;margin-bottom:10px}
  .rg .rg-head h1{font-size:24px}
  .rg .rg-signin{justify-content:space-between}
  .rg .rg-group{grid-template-columns:1fr;gap:12px;padding:16px 0 14px}
  .rg .rg-rail{flex-direction:row;align-items:center;gap:10px;padding:0}
  .rg .rg-num{margin:0;width:26px;height:26px;border-radius:8px}
  .rg .rg-name{font-size:14.5px}
  .rg .rg-cap{margin-left:auto;font-size:11.5px;text-align:right}
  .rg .rg-fields{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 10px}
  .rg .rg-f.s2{grid-column:1 / -1}
  .rg .rg-in,.rg .rg-f input[type=text],.rg .rg-f input[type=email],.rg .rg-f input[type=tel],.rg .rg-f input[type=password],.rg .rg-f select{height:46px;font-size:16px}
  .rg .rg-foot{display:flex;flex-direction:column;align-items:stretch;gap:18px;padding-top:16px}
  .rg .rg-captcha-img{padding-right:44px}
  .rg .rg-btn{height:52px}
}
@media (max-width:420px){
  body[data-tpl="clientregister"] .cfa-scroll{padding:70px 12px 26px}
  .rg .rg-card{padding:18px 14px 16px}
  .rg .rg-cap{display:none}
  .rg .rg-f>label{font-size:12.5px}
  .rg .rg-captcha-row{flex-wrap:nowrap}
  .rg .rg-captcha-img{padding-left:4px}
  .rg #inputCaptchaImage{height:32px !important}
  .rg .rg-code{font-size:15px !important;letter-spacing:.24em}
  .rg .rg-switch-t span{white-space:normal}
}
@media (prefers-reduced-motion:reduce){
  .rg .rg-btn{animation-duration:7s}
  .rg #passwordStrengthMeterBar::before{animation-duration:3s}
  .rg #passwordStrengthMeterBar::after,.rg .rg-go::after{animation-duration:7s}
  .rg .rg-captcha-img::before{animation:none}
}