/* Sneat client area: "guest" page family (login, register, password reset, 2FA, invite, banned, access denied,
   payment forward, error pages). Templates use Sneat markup (auth-*-basic cards, pages-misc-error); this file only adds
   what Sneat's page CSS would give them and the Hostragons specifics. Generic components come from sneat-base.css.
   Prefix inside the content: body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) (= $G below, written out). */

/* ------------------------------------------------------------------ auth card (blank mode) */
/* wide variant for the two-column forms (register, invite) */
.sn-root .authentication-wrapper.authentication-basic.sn-guest-auth--wide { --bs-auth-basic-inner-max-width: 880px; }
.sn-root .authentication-wrapper .app-brand .app-brand-link { display: inline-flex; }
/* one surface: the card body never paints its own background (dark mode showed a card inside a card) */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .authentication-wrapper .card > .card-body,
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-guest-card > .card-body,
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-guest-misc-card > .card-body { background: transparent !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .authentication-wrapper .card > .card-body { padding: 1.5rem !important; }
@media (min-width: 576px) {
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .authentication-wrapper .card > .card-body { padding: 3rem 1.5rem !important; }
}
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .authentication-wrapper h4 { font-size: 1.5rem !important; line-height: 1.37 !important; }

/* Sneat .input-group-merge (password eye): input and icon read as one field (sneat-base.css only joins BS4 groups) */
body.hg-sneat:is(.sn-tpl-login, .sn-tpl-clientregister, .sn-tpl-password-reset-container, .sn-tpl-user-invite-accept) #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .input-group-merge > .form-control:not(:last-child) { border-right: 0 !important; }
body.hg-sneat:is(.sn-tpl-login, .sn-tpl-clientregister, .sn-tpl-password-reset-container, .sn-tpl-user-invite-accept) #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .input-group-merge > .input-group-text:last-child { border-left: 0 !important; padding-left: .5rem !important; color: var(--bs-secondary-color) !important; }
body.hg-sneat:is(.sn-tpl-login, .sn-tpl-clientregister, .sn-tpl-password-reset-container, .sn-tpl-user-invite-accept) #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .input-group-merge:focus-within > .input-group-text { border-color: var(--bs-primary) !important; }
html[data-bs-theme="dark"] body.hg-sneat:is(.sn-tpl-login, .sn-tpl-clientregister, .sn-tpl-password-reset-container, .sn-tpl-user-invite-accept) #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .input-group-merge:focus-within > .input-group-text { border-color: #c98ae0 !important; }

/* Turnstile (injected right before the submit button): a quiet Sneat block, centred */
.sn-root .hg-turnstile-wrap { margin: 0 0 1rem !important; gap: .25rem !important; align-items: center; }
.sn-root .hg-turnstile-wrap .hg-turnstile-status { min-height: 0; font-size: .8125rem; color: var(--bs-secondary-color); }
.sn-root .hg-turnstile-wrap .hg-turnstile-status[data-state="error"] { color: var(--bs-danger); }
.sn-root .hg-turnstile-wrap .hg-turnstile-status[data-state="ok"] { color: var(--bs-success); }

/* submit block of the long forms: Turnstile above, the button keeps its size, centred */
.sn-root .sn-guest-submit { display: flex; flex-direction: column; align-items: center; }
.sn-root .sn-guest-submit > .btn { min-inline-size: 14rem; }
.sn-root .sn-guest-invite .sn-guest-submit { align-items: stretch; }
.sn-root .sn-guest-invite .sn-guest-submit > .btn { min-inline-size: 0; }

/* ------------------------------------------------------------------ register: form sections */
.sn-root .sn-guest-section-title { display: flex; align-items: center; gap: .75rem; margin-bottom: 1.5rem !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-guest-section-title { font-size: .9375rem !important; }
.sn-root .sn-guest-section-title .avatar-initial .icon-base { inline-size: 1.125rem; block-size: 1.125rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #registration hr,
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-guest-card hr { margin: 1.5rem 0 !important; }
.sn-root #registration .password-strength-meter { padding-top: .25rem; }
.sn-root #registration .sn-guest-optin-text { min-inline-size: 12rem; }
/* intl-tel-input (v12 markup: .intl-tel-input.separate-dial-code.iti-sdc-N) - room for flag + dial code */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #registration .intl-tel-input.separate-dial-code input.form-control { padding-left: 92px !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #registration .intl-tel-input.separate-dial-code.iti-sdc-2 input.form-control { padding-left: 84px !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #registration .intl-tel-input.separate-dial-code.iti-sdc-4 input.form-control { padding-left: 100px !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #registration .intl-tel-input.separate-dial-code.iti-sdc-5 input.form-control { padding-left: 108px !important; }
/* intl-tel-input wrapper takes the whole column */
.sn-root #registration .iti, .sn-root #registration .intl-tel-input { display: block; inline-size: 100%; }

/* the social sign-in block (includes/linkedaccounts.tpl) */
.sn-root .authentication-wrapper .social-signin-btns { display: flex; flex-wrap: wrap; justify-content: center; gap: .75rem; }
.sn-root .authentication-wrapper .sub-heading { position: relative; text-align: center; margin: 1.5rem 0; }
.sn-root .authentication-wrapper .sub-heading > span { position: relative; z-index: 1; padding: 0 1rem; background: var(--bs-paper-bg); color: var(--bs-secondary-color); }
.sn-root .authentication-wrapper .sub-heading::before { content: ""; position: absolute; inset-inline: 0; inset-block-start: 50%; border-top: 1px solid var(--bs-border-color); }

/* ------------------------------------------------------------------ password reset: new password step */
.sn-root .sn-guest-pwstrength > br { display: none; }
.sn-root .sn-guest-pwstrength #passwordStrengthBar { block-size: 6px; }

/* ------------------------------------------------------------------ two-factor challenge: the module's markup */
.sn-root .sn-guest-2fa #frmTwoFactorChallenge > div { text-align: start !important; }
.sn-root .sn-guest-2fa #frmTwoFactorChallenge br { display: none; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-guest-2fa #frmTwoFactorChallenge input[name="key"] {
    block-size: auto !important; padding: .625rem 1rem !important; margin-bottom: 1.5rem;
    font-size: 1.25rem !important; letter-spacing: .5em; text-align: center;
}
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-guest-2fa #frmTwoFactorChallenge [type="submit"] {
    display: block !important; inline-size: 100% !important; font-size: .9375rem !important; padding: .4812rem 1.25rem !important; block-size: auto !important;
}

/* ------------------------------------------------------------------ banned: key/value list */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-guest-kv .list-group-item { background: transparent !important; border-inline: 0 !important; border-radius: 0 !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-guest-kv .list-group-item:last-child { border-bottom: 0 !important; }

/* ------------------------------------------------------------------ access denied */
.sn-root .sn-guest-perms { max-inline-size: 26rem; }

/* ------------------------------------------------------------------ payment forward: the gateway's own button */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-guest-forward #frmPayment :is(input[type="submit"], button[type="submit"]):where(:not(.btn)) {
    display: inline-flex; align-items: center; justify-content: center; padding: .4812rem 1.25rem; border: 0; border-radius: .375rem;
    background: var(--bs-primary); color: #fff; font-size: .9375rem; font-weight: 500; cursor: pointer;
}
.sn-root .sn-guest-forward #frmPayment img { max-inline-size: 100%; block-size: auto; }

/* ------------------------------------------------------------------ error pages (pages-misc-error) */
.sn-root .misc-wrapper { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
html.sn-auth .sn-root .misc-wrapper { padding: 1.5rem 0; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-guest-misc-code {
    font-size: 6rem !important; line-height: 6rem !important; font-weight: 500 !important; color: var(--bs-heading-color) !important;
}
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-guest-misc h4 { font-size: 1.5rem !important; line-height: 1.37 !important; }
.sn-root .sn-guest-misc .alert { max-inline-size: 40rem; }
.sn-root .sn-guest-misc-img { inline-size: 500px; max-inline-size: 100%; block-size: auto; }
.sn-root .sn-guest-misc-card .sn-guest-misc-img { inline-size: 380px; }
html[data-bs-theme="dark"] .sn-root .sn-guest-misc-img { opacity: .85; }
@media (max-width: 575.98px) {
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-guest-misc-code { font-size: 4.5rem !important; line-height: 4.5rem !important; }
}

/* ------------------------------------------------------------------ homepage (WHMCS index) */
.sn-root a.sn-guest-action { color: inherit; text-decoration: none; transition: transform .15s ease, box-shadow .15s ease; }
.sn-root a.sn-guest-action:hover { transform: translateY(-2px); box-shadow: var(--bs-box-shadow-lg, 0 .25rem 1rem rgba(34, 48, 62, .16)); }
.sn-root a.sn-guest-action .card-body { display: block; }
.sn-root .sn-guest-domainsearch .tld-logos img { block-size: 20px; inline-size: auto; }
.sn-root .sn-guest-domainsearch .input-group > .btn { white-space: nowrap; }