/*
 * Switch-to-user action button — glossy tile driven by the org theme's
 * "Switch User" colors (Badges section of Org → Theme Settings):
 *   BadgeSwitchUser   → base color (light stop is derived automatically)
 *   BadgeSwitchUserFg → icon/text color
 * Add `btn-switch-user` to any switch/impersonate button for the look.
 */

.btn-switch-user {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.55), rgba(255, 255, 255, 0) 48%),
        linear-gradient(135deg,
            color-mix(in srgb, var(--bit-badge-switch-user, #fcd34d) 35%, white),
            var(--bit-badge-switch-user, #fcd34d)) !important;
    border: 1px solid rgba(255, 255, 255, 0.6) !important;
    color: var(--bit-badge-switch-user-fg, #111827) !important;
    box-shadow: 0 4px 10px color-mix(in srgb, var(--bit-badge-switch-user, #fcd34d) 45%, transparent),
                inset 0 1px 0 rgba(255, 255, 255, 0.6) !important;
}

.btn-switch-user i {
    color: var(--bit-badge-switch-user-fg, #111827) !important;
}

.btn-switch-user:hover,
.btn-switch-user:focus {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.65), rgba(255, 255, 255, 0) 48%),
        linear-gradient(135deg,
            color-mix(in srgb, var(--bit-badge-switch-user, #fcd34d) 20%, white),
            color-mix(in srgb, var(--bit-badge-switch-user, #fcd34d) 70%, white)) !important;
    color: var(--bit-badge-switch-user-fg, #111827) !important;
    box-shadow: 0 8px 18px color-mix(in srgb, var(--bit-badge-switch-user, #fcd34d) 55%, transparent),
                inset 0 1px 0 rgba(255, 255, 255, 0.6) !important;
}

/* preview chip in Org → Theme Settings → Badges grid */
.badge.bg-switch-user {
    background: var(--bit-badge-switch-user, #fcd34d) !important;
    color: var(--bit-badge-switch-user-fg, #111827) !important;
}