/* =====================================================
   buttons.css  -  one glossy button design for the whole application

   Loaded LAST (after site.css, theme.css and layout.css), so it is the
   single place that decides how a button LOOKS. It changes the skin only
   (gradient, gloss, border, shadow, colour, hover / focus / pressed /
   disabled states). Size, padding, radius, layout, icons and every
   button's action are left exactly as the page defines them.

   How it works
     1. Each button class is mapped to a "tone" below by setting a few
        --gb-* custom properties (solid tones, neutral, outline tones).
     2. ONE rule per state (rest / hover / pressed / focus / disabled)
        paints every button from those properties.
   The skin properties carry !important on purpose: the older style
   sheets contain many competing, partly !important button rules
   (.v2-shell .btn-primary:hover { background: ... !important }, ...).

   Themes: Light, Dark and Smart (system) are supported; Smart follows
   prefers-color-scheme exactly like theme.css does.

   Accessibility
     * Button text keeps >= 4.5:1 contrast on every part of the gradient,
       including the lightest edge of the gloss (checked by script).
     * Visible 1px border on every button; solid, neutral and outline tones
       differ by more than colour (gradient direction, border, text).
     * 3px focus ring that does not depend on colour hue alone.
     * prefers-reduced-motion and forced-colors (Windows high contrast)
       are honoured.

   Excluded on purpose: .btn-close (an icon glyph, not a labelled button)
   and .mfa-switch-button (an inline text link that only looks like text).
   ===================================================== */


/* ---------- 1. theme tokens ---------- */

body:is(.v2-shell, .gb-standalone) {
    --gb-n-top: #ffffff;
    --gb-n-bot: #e4e9f1;
    --gb-n-bd: #8493a8;
    --gb-n-fg: var(--v2-text, #111827);
    --gb-n-gloss: 0;
    --gb-n-hi: .9;
    --gb-o-top: #ffffff;
    --gb-o-p-bot: #e1eafd;
    --gb-o-p-bd: #5b82e6;
    --gb-o-p-fg: #1d4ed8;
    --gb-o-d-bot: #fbe2e2;
    --gb-o-d-bd: #dc5757;
    --gb-o-d-fg: #b91c1c;
    --gb-o-s-bot: #dbf2e3;
    --gb-o-s-bd: #3f9a62;
    --gb-o-s-fg: #146c35;
    --gb-o-w-bot: #fdeed3;
    --gb-o-w-bd: #b8730a;
    --gb-o-w-fg: #92400e;
    --gb-o-i-bot: #d9f0f6;
    --gb-o-i-bd: #3a9bb5;
    --gb-o-i-fg: #0e6379;
    --gb-o-t-bot: #d9f2ef;
    --gb-o-t-bd: #3a9a92;
    --gb-o-t-fg: #0b5f58;
    --gb-edge: rgba(0, 0, 0, .30);
    --gb-warning-edge: #b45309;
    --gb-gloss: .18;
    --gb-hi: .38;
    --gb-shadow: rgba(15, 23, 42, .22);
    --gb-text-shadow: 0 1px 0 rgba(0, 0, 0, .28);
    --gb-n-text-shadow: 0 1px 0 rgba(255, 255, 255, .7);
    --gb-focus: var(--v2-focus, #2563eb);
}

body.v2-theme-dark {
    --gb-n-top: #3a4659;
    --gb-n-bot: #232c3b;
    --gb-n-bd: #64748b;
    --gb-n-fg: var(--v2-text, #f8fafc);
    --gb-n-gloss: .10;
    --gb-n-hi: .16;
    --gb-o-top: #2a3649;
    --gb-o-p-bot: #1b2a4a;
    --gb-o-p-bd: #5b84e6;
    --gb-o-p-fg: #9db9ff;
    --gb-o-d-bot: #3a1d27;
    --gb-o-d-bd: #e06a6a;
    --gb-o-d-fg: #fca5a5;
    --gb-o-s-bot: #16342a;
    --gb-o-s-bd: #3fae6c;
    --gb-o-s-fg: #86efac;
    --gb-o-w-bot: #3a2e14;
    --gb-o-w-bd: #cf9526;
    --gb-o-w-fg: #fcd34d;
    --gb-o-i-bot: #12323d;
    --gb-o-i-bd: #34a6c2;
    --gb-o-i-fg: #67e8f9;
    --gb-o-t-bot: #12342f;
    --gb-o-t-bd: #34aaa0;
    --gb-o-t-fg: #5eead4;
    --gb-edge: rgba(255, 255, 255, .34);
    --gb-warning-edge: #fde68a;
    --gb-gloss: .16;
    --gb-hi: .30;
    --gb-shadow: rgba(0, 0, 0, .55);
    --gb-text-shadow: 0 1px 0 rgba(0, 0, 0, .35);
    --gb-n-text-shadow: none;
    --gb-focus: var(--v2-focus, #60a5fa);
}

@media (prefers-color-scheme: dark) {

    body.v2-theme-smart {
        --gb-n-top: #3a4659;
        --gb-n-bot: #232c3b;
        --gb-n-bd: #64748b;
        --gb-n-fg: var(--v2-text, #f8fafc);
        --gb-n-gloss: .10;
        --gb-n-hi: .16;
        --gb-o-top: #2a3649;
        --gb-o-p-bot: #1b2a4a;
        --gb-o-p-bd: #5b84e6;
        --gb-o-p-fg: #9db9ff;
        --gb-o-d-bot: #3a1d27;
        --gb-o-d-bd: #e06a6a;
        --gb-o-d-fg: #fca5a5;
        --gb-o-s-bot: #16342a;
        --gb-o-s-bd: #3fae6c;
        --gb-o-s-fg: #86efac;
        --gb-o-w-bot: #3a2e14;
        --gb-o-w-bd: #cf9526;
        --gb-o-w-fg: #fcd34d;
        --gb-o-i-bot: #12323d;
        --gb-o-i-bd: #34a6c2;
        --gb-o-i-fg: #67e8f9;
        --gb-o-t-bot: #12342f;
        --gb-o-t-bd: #34aaa0;
        --gb-o-t-fg: #5eead4;
        --gb-edge: rgba(255, 255, 255, .34);
        --gb-warning-edge: #fde68a;
        --gb-gloss: .16;
        --gb-hi: .30;
        --gb-shadow: rgba(0, 0, 0, .55);
        --gb-text-shadow: 0 1px 0 rgba(0, 0, 0, .35);
        --gb-n-text-shadow: none;
        --gb-focus: var(--v2-focus, #60a5fa);
    }
}


/* ---------- 2. tones ---------- */

/* neutral (default for anything listed below that has no other tone) */
body:is(.v2-shell, .gb-standalone):is(.v2-shell, .gb-standalone) :is(
        .btn-secondary,
        .btn-outline-secondary,
        .v2-btn-secondary,
        .v2-btn-print,
        .v2-customer-btn-secondary,
        .v2-transaction-btn-secondary,
        .v2-user-secondary-button,
        .audit-btn-secondary,
        .v2-secondary-action,
        .exchange-create-v2-back,
        .exchange-edit-v2-back,
        .back-button,
        .v2-page-button,
        .exchange-page-button,
        .v2-icon-btn,
        .v2-mobile-menu-button,
        .v2-sidebar-close,
        .mfa-back-link
) {
    --gb-top: var(--gb-n-top);
    --gb-bot: var(--gb-n-bot);
    --gb-bd: var(--gb-n-bd);
    --gb-fg: var(--gb-n-fg);
    --gb-glow: transparent;
    --gb-gloss-a: var(--gb-n-gloss);
    --gb-hi-a: var(--gb-n-hi);
    --gb-ts: var(--gb-n-text-shadow);
}

/* outline: p */
body:is(.v2-shell, .gb-standalone):is(.v2-shell, .gb-standalone) :is(
        .btn-outline-primary,
        .v2-btn-outline
) {
    --gb-top: var(--gb-o-top);
    --gb-bot: var(--gb-o-p-bot);
    --gb-bd: var(--gb-o-p-bd);
    --gb-fg: var(--gb-o-p-fg);
    --gb-glow: transparent;
    --gb-gloss-a: var(--gb-n-gloss);
    --gb-hi-a: var(--gb-n-hi);
    --gb-ts: var(--gb-n-text-shadow);
}

/* outline: d */
body:is(.v2-shell, .gb-standalone):is(.v2-shell, .gb-standalone) :is(
        .btn-outline-danger,
        .v2-logout-button
) {
    --gb-top: var(--gb-o-top);
    --gb-bot: var(--gb-o-d-bot);
    --gb-bd: var(--gb-o-d-bd);
    --gb-fg: var(--gb-o-d-fg);
    --gb-glow: transparent;
    --gb-gloss-a: var(--gb-n-gloss);
    --gb-hi-a: var(--gb-n-hi);
    --gb-ts: var(--gb-n-text-shadow);
}

/* outline: s */
body:is(.v2-shell, .gb-standalone):is(.v2-shell, .gb-standalone) :is(
        .btn-outline-success,
        .v2-btn-whatsapp
) {
    --gb-top: var(--gb-o-top);
    --gb-bot: var(--gb-o-s-bot);
    --gb-bd: var(--gb-o-s-bd);
    --gb-fg: var(--gb-o-s-fg);
    --gb-glow: transparent;
    --gb-gloss-a: var(--gb-n-gloss);
    --gb-hi-a: var(--gb-n-hi);
    --gb-ts: var(--gb-n-text-shadow);
}

/* outline: w */
body:is(.v2-shell, .gb-standalone):is(.v2-shell, .gb-standalone) :is(
        .btn-outline-warning
) {
    --gb-top: var(--gb-o-top);
    --gb-bot: var(--gb-o-w-bot);
    --gb-bd: var(--gb-o-w-bd);
    --gb-fg: var(--gb-o-w-fg);
    --gb-glow: transparent;
    --gb-gloss-a: var(--gb-n-gloss);
    --gb-hi-a: var(--gb-n-hi);
    --gb-ts: var(--gb-n-text-shadow);
}

/* outline: i */
body:is(.v2-shell, .gb-standalone):is(.v2-shell, .gb-standalone) :is(
        .btn-outline-info
) {
    --gb-top: var(--gb-o-top);
    --gb-bot: var(--gb-o-i-bot);
    --gb-bd: var(--gb-o-i-bd);
    --gb-fg: var(--gb-o-i-fg);
    --gb-glow: transparent;
    --gb-gloss-a: var(--gb-n-gloss);
    --gb-hi-a: var(--gb-n-hi);
    --gb-ts: var(--gb-n-text-shadow);
}

/* outline: t */
body:is(.v2-shell, .gb-standalone):is(.v2-shell, .gb-standalone) :is(
        .v2-btn-sent
) {
    --gb-top: var(--gb-o-top);
    --gb-bot: var(--gb-o-t-bot);
    --gb-bd: var(--gb-o-t-bd);
    --gb-fg: var(--gb-o-t-fg);
    --gb-glow: transparent;
    --gb-gloss-a: var(--gb-n-gloss);
    --gb-hi-a: var(--gb-n-hi);
    --gb-ts: var(--gb-n-text-shadow);
}

/* solid: primary */
body:is(.v2-shell, .gb-standalone):is(.v2-shell, .gb-standalone) :is(
        .btn-primary,
        .v2-btn-primary,
        .v2-btn-create,
        .v2-customer-btn-primary,
        .v2-transaction-btn-primary,
        .v2-user-primary-button,
        .audit-btn-primary,
        .v2-primary-action,
        .mfa-primary-button,
        .exchange-create-v2-save,
        .exchange-edit-v2-save,
        .v2-page-button.active,
        .v2-page-button.v2-page-current,
        .exchange-page-button.active
) {
    --gb-top: #1d4fd0;
    --gb-bot: #173caa;
    --gb-bd: var(--gb-edge);
    --gb-fg: #ffffff;
    --gb-glow: rgba(29, 79, 208, .55);
    --gb-gloss-a: var(--gb-gloss);
    --gb-hi-a: var(--gb-hi);
    --gb-ts: var(--gb-text-shadow);
}

/* solid: success */
body:is(.v2-shell, .gb-standalone):is(.v2-shell, .gb-standalone) :is(
        .btn-success,
        .v2-btn-success,
        .v2-success-action,
        .print-button
) {
    --gb-top: #137236;
    --gb-bot: #0c5a2a;
    --gb-bd: var(--gb-edge);
    --gb-fg: #ffffff;
    --gb-glow: rgba(19, 114, 54, .55);
    --gb-gloss-a: var(--gb-gloss);
    --gb-hi-a: var(--gb-hi);
    --gb-ts: var(--gb-text-shadow);
}

/* solid: danger */
body:is(.v2-shell, .gb-standalone):is(.v2-shell, .gb-standalone) :is(
        .btn-danger,
        .v2-btn-danger
) {
    --gb-top: #c42828;
    --gb-bot: #a31c1c;
    --gb-bd: var(--gb-edge);
    --gb-fg: #ffffff;
    --gb-glow: rgba(196, 40, 40, .55);
    --gb-gloss-a: var(--gb-gloss);
    --gb-hi-a: var(--gb-hi);
    --gb-ts: var(--gb-text-shadow);
}

/* solid: warning */
body:is(.v2-shell, .gb-standalone):is(.v2-shell, .gb-standalone) :is(
        .btn-warning,
        .v2-btn-warning
) {
    --gb-top: #fbbf24;
    --gb-bot: #f59e0b;
    --gb-bd: var(--gb-warning-edge);
    --gb-fg: #1c1203;
    --gb-glow: rgba(217, 119, 6, .50);
    --gb-gloss-a: var(--gb-gloss);
    --gb-hi-a: var(--gb-hi);
    --gb-ts: none;
}

/* solid: info */
body:is(.v2-shell, .gb-standalone):is(.v2-shell, .gb-standalone) :is(
        .btn-info,
        .v2-btn-info
) {
    --gb-top: #0b6781;
    --gb-bot: #084c63;
    --gb-bd: var(--gb-edge);
    --gb-fg: #ffffff;
    --gb-glow: rgba(11, 103, 129, .55);
    --gb-gloss-a: var(--gb-gloss);
    --gb-hi-a: var(--gb-hi);
    --gb-ts: var(--gb-text-shadow);
}

/* solid: indigo */
body:is(.v2-shell, .gb-standalone):is(.v2-shell, .gb-standalone) :is(
        .v2-btn-indigo
) {
    --gb-top: #4338ca;
    --gb-bot: #3730a3;
    --gb-bd: var(--gb-edge);
    --gb-fg: #ffffff;
    --gb-glow: rgba(67, 56, 202, .55);
    --gb-gloss-a: var(--gb-gloss);
    --gb-hi-a: var(--gb-hi);
    --gb-ts: var(--gb-text-shadow);
}

/* solid: purple */
body:is(.v2-shell, .gb-standalone):is(.v2-shell, .gb-standalone) :is(
        .v2-btn-purple
) {
    --gb-top: #7e22ce;
    --gb-bot: #6b21a8;
    --gb-bd: var(--gb-edge);
    --gb-fg: #ffffff;
    --gb-glow: rgba(126, 34, 206, .55);
    --gb-gloss-a: var(--gb-gloss);
    --gb-hi-a: var(--gb-hi);
    --gb-ts: var(--gb-text-shadow);
}

/* icon buttons: neutral at rest, tinted like their action when hovered */
body:is(.v2-shell, .gb-standalone):is(.v2-shell, .gb-standalone) .v2-icon-btn-edit:is(:hover, :focus-visible) {
    --gb-top: var(--gb-o-top);
    --gb-bot: var(--gb-o-p-bot);
    --gb-bd: var(--gb-o-p-bd);
    --gb-fg: var(--gb-o-p-fg);
}
body:is(.v2-shell, .gb-standalone):is(.v2-shell, .gb-standalone) .v2-icon-btn-password:is(:hover, :focus-visible) {
    --gb-top: var(--gb-o-top);
    --gb-bot: var(--gb-o-w-bot);
    --gb-bd: var(--gb-o-w-bd);
    --gb-fg: var(--gb-o-w-fg);
}
body:is(.v2-shell, .gb-standalone):is(.v2-shell, .gb-standalone) .v2-icon-btn-delete:is(:hover, :focus-visible) {
    --gb-top: var(--gb-o-top);
    --gb-bot: var(--gb-o-d-bot);
    --gb-bd: var(--gb-o-d-bd);
    --gb-fg: var(--gb-o-d-fg);
}
body:is(.v2-shell, .gb-standalone):is(.v2-shell, .gb-standalone) .v2-icon-btn-unlock:is(:hover, :focus-visible) {
    --gb-top: var(--gb-o-top);
    --gb-bot: var(--gb-o-s-bot);
    --gb-bd: var(--gb-o-s-bd);
    --gb-fg: var(--gb-o-s-fg);
}


/* ---------- 3. skin (every button) ---------- */

body:is(.v2-shell, .gb-standalone):is(.v2-shell, .gb-standalone) :is(
        .btn-secondary,
        .btn-outline-secondary,
        .v2-btn-secondary,
        .v2-btn-print,
        .v2-customer-btn-secondary,
        .v2-transaction-btn-secondary,
        .v2-user-secondary-button,
        .audit-btn-secondary,
        .v2-secondary-action,
        .exchange-create-v2-back,
        .exchange-edit-v2-back,
        .back-button,
        .v2-page-button,
        .exchange-page-button,
        .v2-icon-btn,
        .v2-mobile-menu-button,
        .v2-sidebar-close,
        .mfa-back-link,
        .btn-outline-primary,
        .v2-btn-outline,
        .btn-outline-danger,
        .v2-logout-button,
        .btn-outline-success,
        .v2-btn-whatsapp,
        .btn-outline-warning,
        .btn-outline-info,
        .v2-btn-sent,
        .btn-primary,
        .v2-btn-primary,
        .v2-btn-create,
        .v2-customer-btn-primary,
        .v2-transaction-btn-primary,
        .v2-user-primary-button,
        .audit-btn-primary,
        .v2-primary-action,
        .mfa-primary-button,
        .exchange-create-v2-save,
        .exchange-edit-v2-save,
        .btn-success,
        .v2-btn-success,
        .v2-success-action,
        .print-button,
        .btn-danger,
        .v2-btn-danger,
        .btn-warning,
        .v2-btn-warning,
        .btn-info,
        .v2-btn-info,
        .v2-btn-indigo,
        .v2-btn-purple
) {
    background-color: var(--gb-bot) !important;
    background-image:
        linear-gradient(180deg,
            rgba(255, 255, 255, var(--gb-gloss-a)) 0%,
            rgba(255, 255, 255, calc(var(--gb-gloss-a) * .28)) 48%,
            rgba(255, 255, 255, 0) 50%,
            rgba(255, 255, 255, 0) 100%),
        linear-gradient(180deg, var(--gb-top) 0%, var(--gb-bot) 100%) !important;
    border-style: solid !important;
    border-width: 1px !important;
    border-color: var(--gb-bd) !important;
    color: var(--gb-fg) !important;
    text-shadow: var(--gb-ts);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, var(--gb-hi-a)),
        0 1px 2px var(--gb-shadow),
        0 6px 14px -8px var(--gb-glow) !important;
    text-decoration: none;
    transition:
        filter .18s ease,
        transform .18s ease,
        box-shadow .18s ease,
        border-color .18s ease;
}


/* ---------- 4. states ---------- */

/* hover: brighter, lifted, larger soft shadow */
body:is(.v2-shell, .gb-standalone):is(.v2-shell, .gb-standalone) :is(
        .btn-secondary,
        .btn-outline-secondary,
        .v2-btn-secondary,
        .v2-btn-print,
        .v2-customer-btn-secondary,
        .v2-transaction-btn-secondary,
        .v2-user-secondary-button,
        .audit-btn-secondary,
        .v2-secondary-action,
        .exchange-create-v2-back,
        .exchange-edit-v2-back,
        .back-button,
        .v2-page-button,
        .exchange-page-button,
        .v2-icon-btn,
        .v2-mobile-menu-button,
        .v2-sidebar-close,
        .mfa-back-link,
        .btn-outline-primary,
        .v2-btn-outline,
        .btn-outline-danger,
        .v2-logout-button,
        .btn-outline-success,
        .v2-btn-whatsapp,
        .btn-outline-warning,
        .btn-outline-info,
        .v2-btn-sent,
        .btn-primary,
        .v2-btn-primary,
        .v2-btn-create,
        .v2-customer-btn-primary,
        .v2-transaction-btn-primary,
        .v2-user-primary-button,
        .audit-btn-primary,
        .v2-primary-action,
        .mfa-primary-button,
        .exchange-create-v2-save,
        .exchange-edit-v2-save,
        .btn-success,
        .v2-btn-success,
        .v2-success-action,
        .print-button,
        .btn-danger,
        .v2-btn-danger,
        .btn-warning,
        .v2-btn-warning,
        .btn-info,
        .v2-btn-info,
        .v2-btn-indigo,
        .v2-btn-purple
):hover {
    filter: brightness(1.07);
    transform: translateY(-1px);
    border-color: var(--gb-bd) !important;
    color: var(--gb-fg) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, var(--gb-hi-a)),
        0 2px 4px var(--gb-shadow),
        0 10px 20px -8px var(--gb-glow) !important;
}

/* neutral and outline buttons also point at the theme focus colour on hover */
body:is(.v2-shell, .gb-standalone):is(.v2-shell, .gb-standalone) :is(
        .btn-secondary,
        .btn-outline-secondary,
        .v2-btn-secondary,
        .v2-btn-print,
        .v2-customer-btn-secondary,
        .v2-transaction-btn-secondary,
        .v2-user-secondary-button,
        .audit-btn-secondary,
        .v2-secondary-action,
        .exchange-create-v2-back,
        .exchange-edit-v2-back,
        .back-button,
        .v2-page-button,
        .exchange-page-button,
        .v2-icon-btn,
        .v2-mobile-menu-button,
        .v2-sidebar-close,
        .mfa-back-link,
        .btn-outline-primary,
        .v2-btn-outline,
        .btn-outline-danger,
        .v2-logout-button,
        .btn-outline-success,
        .v2-btn-whatsapp,
        .btn-outline-warning,
        .btn-outline-info,
        .v2-btn-sent
):hover {
    border-color: var(--gb-focus) !important;
}

/* pressed */
body:is(.v2-shell, .gb-standalone):is(.v2-shell, .gb-standalone) :is(
        .btn-secondary,
        .btn-outline-secondary,
        .v2-btn-secondary,
        .v2-btn-print,
        .v2-customer-btn-secondary,
        .v2-transaction-btn-secondary,
        .v2-user-secondary-button,
        .audit-btn-secondary,
        .v2-secondary-action,
        .exchange-create-v2-back,
        .exchange-edit-v2-back,
        .back-button,
        .v2-page-button,
        .exchange-page-button,
        .v2-icon-btn,
        .v2-mobile-menu-button,
        .v2-sidebar-close,
        .mfa-back-link,
        .btn-outline-primary,
        .v2-btn-outline,
        .btn-outline-danger,
        .v2-logout-button,
        .btn-outline-success,
        .v2-btn-whatsapp,
        .btn-outline-warning,
        .btn-outline-info,
        .v2-btn-sent,
        .btn-primary,
        .v2-btn-primary,
        .v2-btn-create,
        .v2-customer-btn-primary,
        .v2-transaction-btn-primary,
        .v2-user-primary-button,
        .audit-btn-primary,
        .v2-primary-action,
        .mfa-primary-button,
        .exchange-create-v2-save,
        .exchange-edit-v2-save,
        .btn-success,
        .v2-btn-success,
        .v2-success-action,
        .print-button,
        .btn-danger,
        .v2-btn-danger,
        .btn-warning,
        .v2-btn-warning,
        .btn-info,
        .v2-btn-info,
        .v2-btn-indigo,
        .v2-btn-purple
):active {
    filter: brightness(.93);
    transform: translateY(0);
    box-shadow:
        inset 0 2px 4px rgba(0, 0, 0, .28),
        0 1px 1px var(--gb-shadow) !important;
}

/* keyboard focus: a ring that never depends on the button colour */
body:is(.v2-shell, .gb-standalone):is(.v2-shell, .gb-standalone) :is(
        .btn-secondary,
        .btn-outline-secondary,
        .v2-btn-secondary,
        .v2-btn-print,
        .v2-customer-btn-secondary,
        .v2-transaction-btn-secondary,
        .v2-user-secondary-button,
        .audit-btn-secondary,
        .v2-secondary-action,
        .exchange-create-v2-back,
        .exchange-edit-v2-back,
        .back-button,
        .v2-page-button,
        .exchange-page-button,
        .v2-icon-btn,
        .v2-mobile-menu-button,
        .v2-sidebar-close,
        .mfa-back-link,
        .btn-outline-primary,
        .v2-btn-outline,
        .btn-outline-danger,
        .v2-logout-button,
        .btn-outline-success,
        .v2-btn-whatsapp,
        .btn-outline-warning,
        .btn-outline-info,
        .v2-btn-sent,
        .btn-primary,
        .v2-btn-primary,
        .v2-btn-create,
        .v2-customer-btn-primary,
        .v2-transaction-btn-primary,
        .v2-user-primary-button,
        .audit-btn-primary,
        .v2-primary-action,
        .mfa-primary-button,
        .exchange-create-v2-save,
        .exchange-edit-v2-save,
        .btn-success,
        .v2-btn-success,
        .v2-success-action,
        .print-button,
        .btn-danger,
        .v2-btn-danger,
        .btn-warning,
        .v2-btn-warning,
        .btn-info,
        .v2-btn-info,
        .v2-btn-indigo,
        .v2-btn-purple
):focus-visible {
    outline: 3px solid var(--gb-focus) !important;
    outline-offset: 2px !important;
}
.mfa-switch-button:focus-visible {
    outline: 3px solid var(--v2-focus, #2563eb);
    outline-offset: 2px;
    border-radius: 6px;
}

/* disabled */
body:is(.v2-shell, .gb-standalone):is(.v2-shell, .gb-standalone) :is(
        .btn-secondary,
        .btn-outline-secondary,
        .v2-btn-secondary,
        .v2-btn-print,
        .v2-customer-btn-secondary,
        .v2-transaction-btn-secondary,
        .v2-user-secondary-button,
        .audit-btn-secondary,
        .v2-secondary-action,
        .exchange-create-v2-back,
        .exchange-edit-v2-back,
        .back-button,
        .v2-page-button,
        .exchange-page-button,
        .v2-icon-btn,
        .v2-mobile-menu-button,
        .v2-sidebar-close,
        .mfa-back-link,
        .btn-outline-primary,
        .v2-btn-outline,
        .btn-outline-danger,
        .v2-logout-button,
        .btn-outline-success,
        .v2-btn-whatsapp,
        .btn-outline-warning,
        .btn-outline-info,
        .v2-btn-sent,
        .btn-primary,
        .v2-btn-primary,
        .v2-btn-create,
        .v2-customer-btn-primary,
        .v2-transaction-btn-primary,
        .v2-user-primary-button,
        .audit-btn-primary,
        .v2-primary-action,
        .mfa-primary-button,
        .exchange-create-v2-save,
        .exchange-edit-v2-save,
        .btn-success,
        .v2-btn-success,
        .v2-success-action,
        .print-button,
        .btn-danger,
        .v2-btn-danger,
        .btn-warning,
        .v2-btn-warning,
        .btn-info,
        .v2-btn-info,
        .v2-btn-indigo,
        .v2-btn-purple
):is(:disabled, [disabled], .disabled, [aria-disabled="true"], .v2-btn-disabled) {
    opacity: .55;
    filter: grayscale(.35);
    transform: none !important;
    cursor: not-allowed;
    box-shadow: none !important;
    text-shadow: none;
}
body:is(.v2-shell, .gb-standalone):is(.v2-shell, .gb-standalone) :is(.v2-page-button, .exchange-page-button):disabled {
    cursor: default;
}


/* ---------- 5. motion / contrast preferences ---------- */

@media (prefers-reduced-motion: reduce) {

    body:is(.v2-shell, .gb-standalone):is(.v2-shell, .gb-standalone) :is(
            .btn-secondary,
            .btn-outline-secondary,
            .v2-btn-secondary,
            .v2-btn-print,
            .v2-customer-btn-secondary,
            .v2-transaction-btn-secondary,
            .v2-user-secondary-button,
            .audit-btn-secondary,
            .v2-secondary-action,
            .exchange-create-v2-back,
            .exchange-edit-v2-back,
            .back-button,
            .v2-page-button,
            .exchange-page-button,
            .v2-icon-btn,
            .v2-mobile-menu-button,
            .v2-sidebar-close,
            .mfa-back-link,
            .btn-outline-primary,
            .v2-btn-outline,
            .btn-outline-danger,
            .v2-logout-button,
            .btn-outline-success,
            .v2-btn-whatsapp,
            .btn-outline-warning,
            .btn-outline-info,
            .v2-btn-sent,
            .btn-primary,
            .v2-btn-primary,
            .v2-btn-create,
            .v2-customer-btn-primary,
            .v2-transaction-btn-primary,
            .v2-user-primary-button,
            .audit-btn-primary,
            .v2-primary-action,
            .mfa-primary-button,
            .exchange-create-v2-save,
            .exchange-edit-v2-save,
            .btn-success,
            .v2-btn-success,
            .v2-success-action,
            .print-button,
            .btn-danger,
            .v2-btn-danger,
            .btn-warning,
            .v2-btn-warning,
            .btn-info,
            .v2-btn-info,
            .v2-btn-indigo,
            .v2-btn-purple
    ) {
        transition: none !important;
        transform: none !important;
    }
}

@media (forced-colors: active) {

    body:is(.v2-shell, .gb-standalone):is(.v2-shell, .gb-standalone) :is(
            .btn-secondary,
            .btn-outline-secondary,
            .v2-btn-secondary,
            .v2-btn-print,
            .v2-customer-btn-secondary,
            .v2-transaction-btn-secondary,
            .v2-user-secondary-button,
            .audit-btn-secondary,
            .v2-secondary-action,
            .exchange-create-v2-back,
            .exchange-edit-v2-back,
            .back-button,
            .v2-page-button,
            .exchange-page-button,
            .v2-icon-btn,
            .v2-mobile-menu-button,
            .v2-sidebar-close,
            .mfa-back-link,
            .btn-outline-primary,
            .v2-btn-outline,
            .btn-outline-danger,
            .v2-logout-button,
            .btn-outline-success,
            .v2-btn-whatsapp,
            .btn-outline-warning,
            .btn-outline-info,
            .v2-btn-sent,
            .btn-primary,
            .v2-btn-primary,
            .v2-btn-create,
            .v2-customer-btn-primary,
            .v2-transaction-btn-primary,
            .v2-user-primary-button,
            .audit-btn-primary,
            .v2-primary-action,
            .mfa-primary-button,
            .exchange-create-v2-save,
            .exchange-edit-v2-save,
            .btn-success,
            .v2-btn-success,
            .v2-success-action,
            .print-button,
            .btn-danger,
            .v2-btn-danger,
            .btn-warning,
            .v2-btn-warning,
            .btn-info,
            .v2-btn-info,
            .v2-btn-indigo,
            .v2-btn-purple
    ) {
        background-image: none !important;
        box-shadow: none !important;
        text-shadow: none;
        border-color: ButtonText !important;
        color: ButtonText !important;
        filter: none !important;
    }
}