/* Sneat client area: "account" page family (account details, contacts, users and permissions, account security/SSO,
   email history, user profile/password/security, switch account, verify email, account deletion, affiliates,
   2FA backup code, viewemail.php). Every template of the family wraps its markup in .sn-acc, so all rules below are
   scoped to these pages. Generic components (buttons, forms, tables, badges, alerts, cards, pills, modals) come from
   sneat-base.css; this file only lays the pages out and draws the family's own pieces.
   Prefix inside the content:  body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc  (beats the base). */

/* ============================================================== layout */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc { --sn-acc-gap: 1.5rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc > form { margin: 0; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc h5.card-header { margin: 0; font-size: 1.125rem !important; line-height: 1.375 !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .card-header .card-subtitle,
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-subtitle { display: block; margin: .25rem 0 0; color: var(--snb-body) !important; font-size: .9375rem !important; font-weight: 400 !important; line-height: 1.375; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .card-header.sn-acc-head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: .75rem 1rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-head__title { min-inline-size: 0; flex: 1 1 16rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-head__title > :is(h5, .h5) { margin: 0; font-size: 1.125rem !important; line-height: 1.375 !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-head__aside { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .form-group { margin-bottom: 0; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .form-label { display: block; }
/* WHMCS shows/hides with .w-hidden; the base's .btn display must not reveal it (jQuery's inline display still wins) */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .w-hidden { display: none; }
/* an alert with a leading icon (the base draws .alert as a block) */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-alert-row { display: flex; align-items: flex-start; gap: .625rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-alert-row > .icon-base { flex: 0 0 auto; margin-top: .0625rem; --bs-icon-size: 1.25rem; }
/* buttons joined to inputs carry no shadow, so they are as tall as the input */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .input-group > .btn { box-shadow: none !important; }
/* tables inside cards line up with the card padding (Sneat: first and last cells 1.5rem) */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .card .table > :not(caption) > tr > :is(th, td):first-child { padding-inline-start: 1.5rem !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .card .table > :not(caption) > tr > :is(th, td):last-child { padding-inline-end: 1.5rem !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .card .table > :not(caption) > tr > :is(th, td):not(.text-center):not(.text-end) { text-align: start !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .card-header:has(+ form > .table-responsive) { padding-bottom: 1.5rem !important; }

/* Save / Cancel at the end of a card (Sneat: mt-6, primary + secondary) */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1rem; margin-top: 1.5rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-actions > .sn-acc-actions__end { margin-inline-start: auto; }
@media (max-width: 575.98px) {
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-actions > .sn-acc-actions__end { margin-inline-start: 0; }
}

/* WHMCS custom fields (inputs printed by WHMCS: plain text/select/textarea/checkbox) */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-native-field :is(input[type="text"], input[type="email"], input[type="tel"], input[type="number"], input[type="password"], select, textarea):not(.form-control):not(.form-select) {
    display: block; inline-size: 100%; padding: .543rem .9375rem; border: 1px solid var(--snb-input-border); border-radius: var(--snb-radius);
    background: transparent; color: var(--snb-heading); font-size: .9375rem;
}

/* ============================================================== phone input (intl-tel-input, separate dial code) */
/* the base's .form-control padding hides the flag/dial-code segment; draw it as Sneat's input-group prefix */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .intl-tel-input { display: block; inline-size: 100%; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .intl-tel-input.separate-dial-code { --sn-iti: 4.875rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .intl-tel-input.separate-dial-code.iti-sdc-2 { --sn-iti: 4.375rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .intl-tel-input.separate-dial-code.iti-sdc-4 { --sn-iti: 5.375rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .intl-tel-input.separate-dial-code.iti-sdc-5 { --sn-iti: 5.875rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .intl-tel-input.separate-dial-code input.form-control { padding-inline-start: calc(var(--sn-iti) + .9375rem) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .intl-tel-input .flag-container { inset-inline-start: 0; inset-inline-end: auto; padding: 1px; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .intl-tel-input.separate-dial-code .selected-flag {
    display: flex; align-items: center; gap: .375rem; inline-size: var(--sn-iti) !important; padding: 0 .5rem 0 .9375rem;
    border-inline-end: 1px solid var(--snb-input-border); border-radius: var(--snb-radius) 0 0 var(--snb-radius);
    background: transparent !important;
}
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .intl-tel-input.separate-dial-code .selected-dial-code { display: block; padding: 0; color: var(--snb-heading); font-size: .9375rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .intl-tel-input .selected-flag .iti-flag { position: static; flex: 0 0 auto; margin: 0; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .intl-tel-input .iti-arrow { position: static; margin: 0 0 0 auto; border-top-color: var(--snb-muted); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .intl-tel-input .iti-arrow.up { border-bottom-color: var(--snb-muted); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .intl-tel-input input:disabled ~ .flag-container .selected-flag,
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .intl-tel-input:has(input:disabled) .selected-flag { opacity: .6; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .intl-tel-input .country-list {
    z-index: 20; max-block-size: 16rem; margin-top: .125rem; padding: .5rem 0; border: 0; border-radius: var(--snb-radius);
    background: var(--snb-paper); color: var(--snb-heading); box-shadow: var(--snb-shadow-lg);
}
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .intl-tel-input .country-list .country { padding: .4rem 1rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .intl-tel-input .country-list .country.highlight { background: var(--snb-hover); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .intl-tel-input .country-list .dial-code { color: var(--snb-muted); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .intl-tel-input .country-list .divider { border-color: var(--snb-border); }

/* ============================================================== bootstrap-switch (WHMCS .toggle-switch-success) as a Sneat switch */
/* The plugin still runs (the SSO toggle posts on its switchChange event); its label covers the switch and toggles
   it on click, the handles are hidden and the wrapper draws Sneat's track and knob. */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .bootstrap-switch {
    position: relative; display: inline-block; flex: 0 0 auto; inline-size: 2.5rem !important; block-size: 1.5rem; margin: 0; padding: 0;
    overflow: hidden; vertical-align: middle; border: 0 !important; border-radius: 2rem !important;
    background-color: rgba(var(--snb-base-rgb), .12) !important; box-shadow: 0 0 .25rem 0 rgba(34, 48, 62, .16) inset !important;
    cursor: pointer; transition: background-color .15s ease-in-out;
}
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .bootstrap-switch::after {
    content: ""; position: absolute; inset-block-start: .1875rem; inset-inline-start: .1875rem; inline-size: 1.125rem; block-size: 1.125rem;
    border-radius: 50%; background: #fff; box-shadow: 0 .0625rem .1875rem rgba(34, 48, 62, .25); transition: transform .15s ease-in-out; pointer-events: none;
}
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .bootstrap-switch.bootstrap-switch-on { background-color: var(--snb-primary) !important; box-shadow: 0 .125rem .25rem 0 rgba(var(--snb-primary-rgb), .4) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .bootstrap-switch.bootstrap-switch-on::after { transform: translateX(1rem); }
html[dir="rtl"] body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .bootstrap-switch.bootstrap-switch-on::after { transform: translateX(-1rem); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .bootstrap-switch.bootstrap-switch-focused { outline: 0; box-shadow: 0 0 0 .1875rem rgba(var(--snb-primary-rgb), .16) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .bootstrap-switch.bootstrap-switch-disabled { opacity: .45; cursor: default; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .bootstrap-switch .bootstrap-switch-container { position: static !important; display: block; inline-size: 100% !important; block-size: 100%; margin: 0 !important; transform: none !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .bootstrap-switch :is(.bootstrap-switch-handle-on, .bootstrap-switch-handle-off) { display: none !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .bootstrap-switch .bootstrap-switch-label {
    position: absolute !important; inset: 0; z-index: 1; display: block; inline-size: auto !important; margin: 0 !important; padding: 0 !important;
    border: 0 !important; background: transparent !important; color: transparent !important; font-size: 0 !important; opacity: 0;
}
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .bootstrap-switch input { position: absolute !important; opacity: 0 !important; pointer-events: none; }
/* before the plugin runs (or without it) the checkbox is a plain Sneat switch */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-switch > input.toggle-switch-success {
    inline-size: 2.5rem !important; block-size: 1.5rem !important; margin: 0; border: 0 !important; border-radius: 2rem !important;
    background-color: rgba(var(--snb-base-rgb), .12) !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e") !important;
    background-position: left center !important; background-size: contain !important;
}
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-switch > input.toggle-switch-success:checked { background-color: var(--snb-primary) !important; background-position: right center !important; }

/* a setting with text on the left and the switch on the right */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-switch-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem 1.5rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-switch-row--separated { margin-top: 1.5rem; padding-top: 1.5rem; border-top: 1px solid var(--snb-border); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-switch-row__text { min-inline-size: 0; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-switch-row__text h6 { font-size: .9375rem !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-switch-row__text p { color: var(--snb-body); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-switch { display: flex; align-items: center; gap: .75rem; flex: 0 0 auto; }

/* ============================================================== shared small pieces */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-muted { color: var(--snb-muted) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-section-title { margin: 0 0 1rem; color: var(--snb-heading) !important; font-size: .9375rem !important; font-weight: 500 !important; }
/* the main site's style.css gives .avatar a border and a drop shadow; Sneat avatars have neither */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .avatar { border: 0 !important; box-shadow: none !important; cursor: default; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .avatar .avatar-initial .icon-base { --bs-icon-size: 1.375rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .avatar-sm .avatar-initial { font-size: .8125rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .avatar-sm .avatar-initial .icon-base { --bs-icon-size: 1rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .avatar-xl .avatar-initial .icon-base { --bs-icon-size: 2rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .badge .icon-base { --bs-icon-size: .875rem; vertical-align: -.125em; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .btn .icon-base { --bs-icon-size: 1.125rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .btn-sm .icon-base { --bs-icon-size: 1rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .btn .sn-acc-btn-text { margin-inline-start: .375rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .card > .table-responsive:last-child .table > tbody > tr:last-child > :is(td, th) { border-bottom: 0 !important; }
/* icon + text setting row (SSO, 2FA) */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-setting { display: flex; align-items: center; gap: 1rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-setting--top { align-items: flex-start; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-setting__text { flex: 1 1 auto; min-inline-size: 0; display: flex; flex-direction: column; gap: .25rem; color: var(--snb-body); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-setting--top .sn-acc-setting__text { display: block; padding-top: .5rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-setting__title { color: var(--snb-heading); font-weight: 500; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-status { color: var(--snb-body) !important; font-size: .9375rem; font-weight: 400 !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-state { display: inline-flex; align-items: center; gap: .375rem; font-size: .8125rem; font-weight: 500; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-state::before { content: ""; flex: 0 0 auto; inline-size: .5rem; block-size: .5rem; border-radius: 50%; background: currentColor; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-state--on { color: var(--snb-success) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-state--off { color: var(--snb-secondary) !important; }
/* empty state */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-empty { display: flex; flex-direction: column; align-items: center; gap: .5rem; padding: 1.5rem 0; text-align: center; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-empty h6 { margin: .5rem 0 0; font-size: 1rem !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-empty p { max-inline-size: 32rem; margin: 0 0 .75rem; color: var(--snb-body); }
/* centred result card (verify email, 2FA backup code) */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-status-card { max-inline-size: 36rem; margin-inline: auto; text-align: center; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-status-card .card-body { display: flex; flex-direction: column; align-items: center; padding: 2.5rem 2rem !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-status-card .avatar { margin-bottom: 1.25rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-status-card h4 { margin: 0 0 .5rem; font-size: 1.375rem !important; line-height: 1.4 !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-status-card p { margin: 0 0 1.25rem; color: var(--snb-body); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-status-card > .card-body > .btn:last-child { margin-top: .5rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-code {
    margin: 0 0 1.25rem; padding: .75rem 1.5rem; border-radius: var(--snb-radius); background: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-warning));
    color: var(--snb-heading); font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace !important; font-size: 1.375rem; font-weight: 600; letter-spacing: .12em; word-break: normal; overflow-wrap: anywhere;
}
@media (max-width: 575.98px) {
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-code { padding: .75rem 1rem; font-size: 1.125rem; letter-spacing: .06em; }
}

/* ============================================================== contacts chooser */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-chooser { margin: 0; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-chooser .input-group > .form-select { flex: 1 1 auto; inline-size: 1%; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-chooser .input-group > .btn { flex: 0 0 auto; }

/* ============================================================== users table + invite */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-identity { display: flex; align-items: center; gap: .75rem; min-inline-size: 0; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-identity__text { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem .5rem; min-inline-size: 0; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-identity__name { color: var(--snb-heading); font-weight: 500; overflow-wrap: anywhere; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-identity__badges { display: inline-flex; flex-wrap: wrap; align-items: center; gap: .375rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-identity__badges .badge:has(.icon-base) { padding: .3em .45em !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-row-actions { display: inline-flex; flex-wrap: nowrap; justify-content: flex-end; gap: .5rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-row-actions form { margin: 0; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-row-actions .btn.disabled { opacity: .45; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-user-table td:first-child { min-inline-size: 16rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .table > tbody.sn-acc-invites > tr.sn-acc-section-row > th {
    padding-top: .75rem !important; padding-bottom: .75rem !important; border-top: 1px solid var(--snb-border) !important;
    background: var(--snb-hover) !important; color: var(--snb-heading) !important; font-size: .8125rem !important; font-weight: 500 !important; letter-spacing: .2px; text-transform: uppercase;
}
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-radios { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; padding-top: .25rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-radios .form-check-inline { margin-inline-end: 0; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-perm-picker { margin: 1.5rem 0 0 !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-perm-picker .form-check-label,
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-perm-label { display: flex; flex-direction: column; gap: .125rem; margin: 0; cursor: pointer; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-perm-title { color: var(--snb-heading); font-size: .9375rem; font-weight: 500; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-perm-desc { color: var(--snb-body); font-size: .8125rem; line-height: 1.4; }

/* permissions table (Sneat notification settings) */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-perm-table .sn-acc-perm-col { inline-size: 7rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-perm-table tbody tr:hover > td { background: var(--snb-hover) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-perm-table .form-check-input { margin: 0; }

/* ============================================================== profile */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-profile-head { display: flex; align-items: center; gap: 1.5rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-profile-head .avatar-xl .avatar-initial { font-size: 1.75rem; font-weight: 500; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-profile-head__text { min-inline-size: 0; overflow-wrap: anywhere; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-profile-head__text h5 { font-size: 1.125rem !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-profile-head { padding-bottom: 1.5rem; margin-bottom: 1.5rem; border-bottom: 1px solid var(--snb-border); }

/* ============================================================== password: strength meter + tips (pwstrength.tpl) */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-pwstrength > br { display: none; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-pwstrength #passwordStrengthBar { block-size: .375rem !important; margin: 0 0 1rem !important; border-radius: 1rem; background: var(--snb-track) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-pwstrength #passwordStrengthBar .progress-bar { border-radius: 1rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-pwstrength > .alert { --snb-c: var(--snb-secondary); --snb-c-text: var(--snb-body); margin: 0; padding: 1rem 1.25rem !important; border: 0 !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-pwstrength > .alert small { display: block; color: var(--snb-body); font-size: .8125rem; line-height: 1.7; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-pwstrength > .alert :is(strong, b) { color: var(--snb-heading); font-weight: 500; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-pwstrength > .alert .fa { color: var(--snb-primary-text); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc.sn-acc-password .input-group > .generate-password { flex: 0 0 auto; white-space: nowrap; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc #inputNewPassword2Msg .form-text { margin: .3rem 0 0; color: var(--snb-danger) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .form-control.is-warning { border-color: var(--snb-warning) !important; }

/* ============================================================== switch account */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-account-list { max-inline-size: none; margin: 0 !important; padding: 0 !important; border-top: 1px solid var(--snb-border) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-account-list > a { margin: 0 !important; border-width: 0 0 1px !important; border-style: solid !important; border-color: var(--snb-border) !important; border-radius: 0 !important; text-decoration: none !important; background: transparent; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-account-list > a:last-child { border-bottom: 0 !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-account-list > a:hover { background: var(--snb-hover) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .card-header + .sn-acc-account-list { margin-top: 1.5rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-account { display: flex !important; align-items: center; gap: .875rem; padding: .875rem 1.5rem !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-account:last-child { border-bottom-left-radius: var(--snb-radius) !important; border-bottom-right-radius: var(--snb-radius) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-account__name { flex: 1 1 auto; min-inline-size: 0; color: var(--snb-heading); font-weight: 500; overflow-wrap: anywhere; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-account__badges { display: inline-flex; flex-wrap: wrap; gap: .375rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-account__chevron { color: var(--snb-muted); --bs-icon-size: 1.25rem; }
html[dir="rtl"] body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-account__chevron { transform: scaleX(-1); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-account.disabled { opacity: .55; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-forced { display: flex; align-items: center; gap: 1rem; padding: 1rem 1.25rem; border: 1px solid var(--snb-border); border-radius: var(--snb-radius); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-forced__text { display: flex; flex-direction: column; min-inline-size: 0; overflow-wrap: anywhere; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-forced__name { color: var(--snb-heading); font-weight: 500; }

/* ============================================================== email history (DataTable in a card) */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-table-card { overflow: hidden; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-table-card .table-container { margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-table-card .dataTables_wrapper .listtable { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0 1rem; margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-table-card .dataTables_wrapper .dataTables_filter { order: 2; float: none !important; margin: 1.25rem 1.5rem 1.25rem 0 !important; padding: 0 !important; text-align: end; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-table-card .dataTables_wrapper .dataTables_info { order: 1; float: none !important; margin: 1.25rem 0 1.25rem 1.5rem !important; padding: 0 !important; color: var(--snb-body) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-table-card .dataTables_wrapper .listtable > table,
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-table-card .dataTables_wrapper .listtable > .table { order: 3; flex: 0 0 100%; inline-size: 100% !important; margin: 0 !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-table-card .dataTables_wrapper .dataTables_filter label { position: relative; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-table-card .dataTables_wrapper .dataTables_filter input { min-inline-size: 14rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-table-card .dataTables_wrapper .dataTables_paginate { float: none !important; display: flex; justify-content: flex-end; margin: 0 !important; padding: 1.25rem 1.5rem !important; border-top: 1px solid var(--snb-border); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-table-card .dataTables_wrapper .dataTables_paginate .pagination { margin: 0 !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-table-card .dataTables_wrapper .dataTables_length { float: none !important; margin: -4.25rem 0 0 1.5rem !important; padding: 0 0 1.25rem !important; inline-size: max-content; position: relative; }
/* md and up: "show N entries" and the pager share one footer row, vertically centred (no negative-margin overlap) */
@media (min-width: 768px) {
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-table-card .dataTables_wrapper { display: flex; flex-wrap: wrap; align-items: center; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-table-card .dataTables_wrapper > .listtable { flex: 0 0 100%; border-bottom: 1px solid var(--snb-border) !important; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-table-card .dataTables_wrapper > .dataTables_length { order: 2; margin: 0 0 0 1.5rem !important; padding: 0 !important; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-table-card .dataTables_wrapper > .dataTables_paginate { order: 3; flex: 1 1 auto; border-top: 0 !important; }
}
/* the DataTables "no records" cell is an empty state: centred, muted */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .card .table > tbody > tr > td.dataTables_empty:not(.text-start):not(.text-end) { padding-block: 1.5rem !important; color: var(--snb-body) !important; text-align: center !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-table-card .sn-acc-loading { padding: 1.5rem; color: var(--snb-body); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-table-card table.dataTable { border-collapse: collapse !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-table-card table.dataTable > thead > tr > th { border-bottom: 1px solid var(--snb-border) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-table-card .card-header + .table-container { margin-top: 0 !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-subject { min-inline-size: 14rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-subject__text { color: var(--snb-heading); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-attach { margin-inline-start: .25rem; color: var(--snb-muted); --bs-icon-size: 1rem; vertical-align: -.15em; }

/* ============================================================== account deletion */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-deletion-notes { margin: 0; padding-inline-start: 1.25rem; color: var(--snb-body); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-deletion-notes li + li { margin-top: .5rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-deletion-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem 1.5rem; border-top: 1px solid var(--snb-border) !important; padding-top: 1.25rem !important; padding-bottom: 1.25rem !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-deletion-foot a.small { display: inline-flex; align-items: center; }

/* ============================================================== affiliates */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-stat .card-body { display: flex; align-items: center; gap: 1rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-stat .avatar { inline-size: 2.75rem; block-size: 2.75rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-stat__text { display: flex; flex-direction: column; min-inline-size: 0; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-stat__label { color: var(--snb-body); font-size: .9375rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-stat__value { margin: .125rem 0 0; font-size: 1.375rem !important; line-height: 1.4 !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-kv { display: flex; flex-direction: column; gap: 1rem; margin: 0; padding: 0; list-style: none; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-kv > li { display: flex; align-items: center; gap: .75rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-kv__label { flex: 1 1 auto; min-inline-size: 0; color: var(--snb-body); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-kv__value { color: var(--snb-heading); font-weight: 500; white-space: nowrap; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-kv__value--accent { color: var(--snb-success); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-aff-link { font-family: inherit; }
/* the hg_affiliate_info hook block ("how it works") inside the referral card / signup card */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .hg-affinfo { margin: 1.5rem 0 0 !important; padding: 1.5rem 0 0 !important; border: 0 !important; border-top: 1px solid var(--snb-border) !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .hg-affinfo__head { display: flex; align-items: center; gap: .5rem; margin: 0 0 1rem !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .hg-affinfo__head i { color: var(--snb-primary-text) !important; font-size: 1rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .hg-affinfo__head h3 { margin: 0 !important; color: var(--snb-heading) !important; font-size: .9375rem !important; font-weight: 500 !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .hg-affinfo__grid { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem 1.5rem !important; }
@media (max-width: 575.98px) { body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .hg-affinfo__grid { grid-template-columns: minmax(0, 1fr); } }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .hg-affinfo__item { display: flex; align-items: flex-start; gap: .75rem; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .hg-affinfo__ico { flex: 0 0 2.25rem; inline-size: 2.25rem; block-size: 2.25rem; display: inline-flex; align-items: center; justify-content: center; border-radius: var(--snb-radius) !important; background: var(--snb-primary-label) !important; color: var(--snb-primary-text) !important; font-size: .875rem !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .hg-affinfo__txt { display: flex; flex-direction: column; gap: .125rem; min-inline-size: 0; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .hg-affinfo__txt strong { color: var(--snb-heading) !important; font-size: .9375rem !important; font-weight: 500 !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .hg-affinfo__txt span { color: var(--snb-body) !important; font-size: .8125rem !important; line-height: 1.45 !important; }
/* affiliate signup card */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-affsignup__head { display: flex; align-items: center; gap: 1.25rem; margin-bottom: 1.5rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-affsignup__head h4 { font-size: 1.375rem !important; line-height: 1.4 !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-affsignup__head p { color: var(--snb-body); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-checklist { display: flex; flex-direction: column; gap: .75rem; margin: 0; padding: 0; list-style: none; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-checklist li { display: flex; align-items: flex-start; gap: .625rem; color: var(--snb-body); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-checklist .sn-acc-check { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; inline-size: 1.375rem; block-size: 1.375rem; margin-top: .0625rem; border-radius: 50%; background-color: var(--snb-primary-label); color: var(--snb-primary-text); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-checklist .sn-acc-check .icon-base { --bs-icon-size: 1rem; }


/* ============================================================== mobile */
@media (max-width: 767.98px) {
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .btn-sm .sn-acc-btn-text { display: none; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-perm-table .sn-acc-perm-col { inline-size: 3.5rem; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-user-table td:first-child { min-inline-size: 13rem; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-subject { min-inline-size: 11rem; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-table-card .dataTables_wrapper .dataTables_filter { flex: 1 1 100%; order: 0; margin: 1.25rem 1.25rem 0 !important; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-table-card .dataTables_wrapper .dataTables_filter label,
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-table-card .dataTables_wrapper .dataTables_filter input { inline-size: 100%; min-inline-size: 0; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-table-card .dataTables_wrapper .dataTables_info { margin: .75rem 1.25rem 1rem !important; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-table-card .dataTables_wrapper .listtable > table { display: block; overflow-x: auto; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-table-card .dataTables_wrapper .dataTables_paginate { justify-content: center; padding: 1rem !important; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-table-card .dataTables_wrapper .dataTables_length { margin: 0 auto !important; padding: 0 1rem 1.25rem !important; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-profile-head { gap: 1rem; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-switch-row { align-items: flex-start; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc.sn-acc-password .generate-password .sn-acc-btn-text { display: none; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-status-card .card-body { padding: 2rem 1.25rem !important; }
}

/* ============================================================== viewemail.php (standalone popup document) */
html:has(> body.sn-acc-email-doc), body.sn-acc-email-doc { margin: 0; background: #f5f5f9 !important; }
html[data-bs-theme="dark"]:has(> body.sn-acc-email-doc), html[data-bs-theme="dark"] body.sn-acc-email-doc { background: #232333 !important; }
body.sn-acc-email-doc .sn-acc-email { box-sizing: border-box; min-block-size: 100vh; padding: 1.5rem; background: transparent; }
body.sn-acc-email-doc .sn-acc-email :is(h1, h2, h3, h4, h5, h6, p, span, div, button, a, strong, small) { font-family: "Public Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Oxygen, Ubuntu, Cantarell, "Fira Sans", "Helvetica Neue", sans-serif !important; }
body.sn-acc-email-doc .sn-acc-email .btn-primary { border-color: #761098 !important; background: #761098 !important; color: #fff !important; box-shadow: 0 .125rem .25rem 0 rgba(118, 16, 152, .4) !important; }
body.sn-acc-email-doc .sn-acc-email .btn-primary:hover { border-color: #6a0e89 !important; background: #6a0e89 !important; }
body.sn-acc-email-doc .sn-acc-email > .card { max-inline-size: 60rem; margin: 0 auto; border: 0; border-radius: .375rem; box-shadow: 0 .1875rem .5rem 0 rgba(34, 48, 62, .1); }
body.sn-acc-email-doc .sn-acc-email__head { display: flex; align-items: flex-start; gap: 1rem; padding: 1.5rem 1.5rem 1rem; border: 0; background: transparent; }
body.sn-acc-email-doc .sn-acc-email__title { flex: 1 1 auto; min-inline-size: 0; overflow-wrap: anywhere; }
body.sn-acc-email-doc .sn-acc-email__title h5 { color: var(--bs-heading-color); font-size: 1.125rem; font-weight: 500; line-height: 1.4; }
body.sn-acc-email-doc .sn-acc-email__label { display: block; margin-bottom: .125rem; color: var(--bs-secondary-color); font-size: .8125rem; }
body.sn-acc-email-doc .sn-acc-email__files { display: flex; flex-wrap: wrap; gap: .375rem; margin-top: .625rem; }
body.sn-acc-email-doc .sn-acc-email__files .badge { font-weight: 500; }
body.sn-acc-email-doc .sn-acc-email__body { padding: 0 1.5rem; }
body.sn-acc-email-doc .sn-acc-email__body iframe { display: block; inline-size: 100%; block-size: calc(100vh - 15rem); min-block-size: 20rem; border: 1px solid var(--bs-border-color); border-radius: .375rem; background: #fff; }
body.sn-acc-email-doc .sn-acc-email > .card > .sn-acc-email__foot { display: flex; justify-content: flex-end; padding: 1.25rem 1.5rem 1.5rem; border: 0; background: transparent; }
body.sn-acc-email-doc .sn-acc-email .avatar { border: 0; box-shadow: none; }
body.sn-acc-email-doc .sn-acc-email .avatar .icon-base { --bs-icon-size: 1.375rem; }
@media (max-width: 575.98px) {
    body.sn-acc-email-doc .sn-acc-email { padding: .75rem; }
    body.sn-acc-email-doc .sn-acc-email__head { padding: 1.25rem 1.25rem .75rem; }
    body.sn-acc-email-doc .sn-acc-email__head > .avatar { display: none; }
    body.sn-acc-email-doc .sn-acc-email__body { padding: 0 1.25rem; }
    body.sn-acc-email-doc .sn-acc-email > .card > .sn-acc-email__foot { padding: 1rem 1.25rem 1.25rem; }
}

/* ============================================================== shell alerts above the account pages */
/* the email-verification / validate-user banners sit right above the content: keep Sneat's 1.5rem gap */
.sn-root .sn-content:has(#main-body .sn-acc) > :is(.verification-banner, .validation-banner, .alert) { margin-bottom: 1.5rem !important; }

/* ============================================================== mobile lists (below md): Sneat list rows instead of the site's stacked "cards" */
@media (max-width: 767.98px) {
    /* the main site turns DataTables into bordered cards with uppercase labels; on account pages each row is a list row */
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-table-card .table-list.dataTable { display: table !important; overflow: visible !important; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-table-card .table-list.dataTable > thead { position: absolute !important; inline-size: 1px; block-size: 1px; overflow: hidden; clip: rect(0 0 0 0); }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-table-card .table-list.dataTable > tbody > tr {
        display: grid !important; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: .25rem 1rem;
        margin: 0 !important; padding: .875rem 1.25rem !important; border: 0 !important; border-top: 1px solid var(--snb-border) !important; border-radius: 0 !important; background: transparent !important;
    }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-table-card .table-list.dataTable > tbody > tr > td {
        display: block !important; grid-column: 1; inline-size: auto !important; min-inline-size: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; text-align: start !important;
    }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-table-card .table-list.dataTable > tbody > tr > td::before { content: none !important; display: none !important; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-table-card .table-list.dataTable > tbody > tr > td.dataTables_empty { grid-column: 1 / -1; text-align: center !important; }
    /* emails: date (small) and subject on the left, the view button on the right */
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc.sn-acc-emails #tableEmailsList > tbody > tr > td:first-child { font-size: .8125rem; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc.sn-acc-emails #tableEmailsList > tbody > tr > td:last-child { grid-column: 2; grid-row: 1 / span 2; }
    /* affiliates: date + product left, amounts and status stacked */
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc.sn-acc-affiliates #tableAffiliatesList > tbody > tr > td:nth-child(n+3) { grid-column: 2; text-align: end !important; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc.sn-acc-affiliates #tableAffiliatesList > tbody > tr > td:nth-child(3) { grid-row: 1; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc.sn-acc-affiliates #tableAffiliatesList > tbody > tr > td:nth-child(4) { grid-row: 2; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc.sn-acc-affiliates #tableAffiliatesList > tbody > tr > td:nth-child(5) { grid-row: 3; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-table-card .dataTables_wrapper .listtable > table { overflow: visible; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-table-card { overflow: hidden !important; }

    /* users: identity on the first line, last login and the actions below */
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-user-table { display: block; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-user-table > thead { display: none; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-user-table > tbody { display: block; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-user-table > tbody > tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: .5rem 1rem; padding: 1rem 1.25rem; border-top: 1px solid var(--snb-border); }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-user-table > tbody > tr > :is(td, th) { display: block; min-inline-size: 0 !important; padding: 0 !important; border: 0 !important; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-user-table > tbody > tr > td:first-child { grid-column: 1 / -1; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-user-table > tbody > tr > td:nth-child(2) { padding-inline-start: 2.75rem !important; font-size: .8125rem; white-space: normal; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-user-table > tbody > tr.sn-acc-section-row { display: block; padding: 0; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-user-table > tbody > tr.sn-acc-section-row > th { padding: .75rem 1.25rem !important; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .sn-acc-user-table .sn-acc-identity__name { overflow-wrap: anywhere; word-break: normal; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-acc .card > .table-responsive:has(.sn-acc-user-table) { overflow: visible; }
}

/* ============================================================== oauth/*.tpl (standalone OAuth screens, own layout) */
html:has(> body.sn-oauth-doc), body.sn-oauth-doc { margin: 0; background: #f5f5f9 !important; }
html[data-bs-theme="dark"]:has(> body.sn-oauth-doc), html[data-bs-theme="dark"] body.sn-oauth-doc { background: #232333 !important; }
body.sn-oauth-doc .sn-oauth { background: transparent; }
body.sn-oauth-doc .sn-oauth :is(h1, h2, h3, h4, h5, h6, p, span, div, li, label, input, select, button, a, strong, small) { font-family: "Public Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Oxygen, Ubuntu, Cantarell, "Fira Sans", "Helvetica Neue", sans-serif; }
body.sn-oauth-doc .sn-oauth .w-hidden { display: none; }
body.sn-oauth-doc .sn-oauth .authentication-wrapper { padding-inline: 1rem; }
body.sn-oauth-doc .sn-oauth .app-brand { display: flex; }
body.sn-oauth-doc .sn-oauth .app-brand .app-brand-img { display: block; inline-size: auto; block-size: 38px; }
body.sn-oauth-doc .sn-oauth .app-brand .app-brand-img--dark { display: none; }
html[data-bs-theme="dark"] body.sn-oauth-doc .sn-oauth .app-brand .app-brand-img--light { display: none; }
html[data-bs-theme="dark"] body.sn-oauth-doc .sn-oauth .app-brand .app-brand-img--dark { display: block; }
/* session bar: "logged in as … Not you?" and "Return to <app>" above the logo */
body.sn-oauth-doc .sn-oauth .sn-oauth-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem 1rem; margin: -.5rem 0 1.5rem; padding-bottom: 1rem; border-bottom: 1px solid var(--bs-border-color); color: var(--bs-secondary-color); font-size: .8125rem; }
body.sn-oauth-doc .sn-oauth .sn-oauth-bar form { margin: 0; }
body.sn-oauth-doc .sn-oauth .sn-oauth-bar__app { margin-inline-start: auto !important; }
body.sn-oauth-doc .sn-oauth .sn-oauth-bar .btn { padding-inline: .5rem; }
body.sn-oauth-doc .sn-oauth .sn-oauth-applogo { display: flex; justify-content: center; margin-bottom: 1rem; }
body.sn-oauth-doc .sn-oauth .sn-oauth-applogo img { max-block-size: 3.5rem; max-inline-size: 12rem; }
body.sn-oauth-doc .sn-oauth .sn-oauth-content h4 { color: var(--bs-heading-color); font-size: 1.125rem; line-height: 1.5; }
body.sn-oauth-doc .sn-oauth .sn-oauth-form { margin-top: 1.5rem; }
body.sn-oauth-doc .sn-oauth .sn-oauth-form .alert { margin-bottom: 1.5rem; }
body.sn-oauth-doc .sn-oauth .sn-oauth-grants { margin: 1.5rem 0; padding: 1rem 1.25rem; border-radius: .375rem; background: rgba(var(--bs-primary-rgb), .08); }
body.sn-oauth-doc .sn-oauth .sn-oauth-grants li { display: flex; align-items: flex-start; gap: .5rem; color: var(--bs-heading-color); }
body.sn-oauth-doc .sn-oauth .sn-oauth-grants li + li { margin-top: .5rem; }
body.sn-oauth-doc .sn-oauth .sn-oauth-grants li .icon-base { flex: 0 0 auto; margin-top: .125rem; color: var(--bs-primary); --bs-icon-size: 1.125rem; }
body.sn-oauth-doc .sn-oauth .sn-oauth-note { color: var(--bs-secondary-color); font-size: .8125rem; }
body.sn-oauth-doc .sn-oauth .sn-oauth-challenge :is(input[type="text"], input[type="tel"], input[type="number"]) { text-align: center; letter-spacing: .25em; }
body.sn-oauth-doc .sn-oauth .alert .icon-base { --bs-icon-size: 1.25rem; }
body.sn-oauth-doc .sn-oauth .sn-oauth-copy { margin: 1.5rem 0 0; color: var(--bs-secondary-color); font-size: .8125rem; text-align: center; }
html[data-bs-theme="dark"] body.sn-oauth-doc .sn-oauth .sn-oauth-grants li .icon-base { color: #d9a6ec; }
body.sn-oauth-doc .sn-oauth .btn-block { display: block; inline-size: 100%; }
body.sn-oauth-doc .sn-oauth .sn-oauth-challenge > * + *, body.sn-oauth-doc .sn-oauth .sn-oauth-challenge .margin-bottom { margin-bottom: 1rem; }
html[data-bs-theme="dark"] body.sn-oauth-doc .sn-oauth a:not(.btn) { color: #d9a6ec; }