/* stylelint-disable selector-class-pattern */
/* stylelint-disable color-function-notation */

:root {
    /* || Gradients */
    --gradient-special: 140deg, hsl(245deg, calc(var(--saturaton-factor, 1)*79%), 72%) 0%, hsl(287deg, calc(var(--saturaton-factor, 1)*80%), 70%) 100%;
    --gradient-blurple: 140deg, hsl(235deg, calc(var(--saturation-factor, 1)*85%), 72%) 0%, hsl(235deg, calc(var(--saturation-factor, 1)*85%), 60%) 100%;
    --gradient-green: 140deg, hsl(139deg, calc(var(--saturaton-factor, 1)*47%), 44%) 0%, hsl(139deg, calc(var(--saturaton-factor, 1)*66%), 24%) 100%;
    --gradient-yellow: 140deg, hsl(38deg, calc(var(--saturaton-factor, 1)*96%), 54%) 0%, hsl(38deg, calc(var(--saturaton-factor, 1)*82%), 41%) 100%;
    --gradient-red: 140deg, hsl(359deg, calc(var(--saturaton-factor, 1)*83%), 59%) 0%, hsl(359deg, calc(var(--saturaton-factor, 1)*54%), 37%) 100%;
    --gradient-grey: 140deg, hsl(214deg, calc(var(--saturaton-factor, 1)*10%), 50%) 0%, hsl(216deg, calc(var(--saturaton-factor, 1)*11%), 26%) 100%;

    /* || Transitions */
    --button-transition: 0.1s linear;
    --font-default: 500;
    --font-hover: 525;
    --fontsize-hover: 15px;
    --transform-normal: scale(1);
    --transform-hover: scale(1.15);
    --button-transform-hover: scale(1.04);
}

/* || Filled Buttons */
.lookFilled-yCfaCM {
    transform: var(--transform-normal);
    transition: var(--button-transition);
    background: var(--gradient);
}

.lookFilled-yCfaCM:hover {
    transform: var(--button-transform-hover);
}

.lookFilled-yCfaCM[disabled] {
    transform: none;
}

.lookFilled-yCfaCM.colorBrand-I6CyqQ {
    --gradient: linear-gradient(var(--gradient-blurple));
}

.lookFilled-yCfaCM.colorGreen-3y-Z79,
.lookFilled-yCfaCM.button_adcaac.buttonActive_adcaac {
    --gradient: linear-gradient(var(--gradient-green));
}

.lookFilled-yCfaCM.colorYellow-Pgtmch {
    --gradient: linear-gradient(var(--gradient-yellow));
}

.lookFilled-yCfaCM.colorRed-rQXKgM {
    --gradient: linear-gradient(var(--gradient-red));
}

.lookFilled-yCfaCM.colorPrimary-2AuQVo,
.lookFilled-yCfaCM.colorGrey-2iAG-B,
.lookFilled-yCfaCM.buttonColor_adcaac {
    --gradient: linear-gradient(var(--gradient-grey));
}

/* || Context Menus */
.menu_d90b3d .item-1OdjEX:not(.hideInteraction-2jPGL_) {
    font-weight: var(--font-default);
    transition: var(--button-transition);
}

.menu_d90b3d .item-1OdjEX:not(.hideInteraction-2jPGL_).focused-3qFvc8,
.menu_d90b3d .item-1OdjEX:not(.hideInteraction-2jPGL_):active {
    font-size: var(--fontsize-hover);
    font-weight: var(--font-hover);
    background: var(--gradient);
}

.menu_d90b3d .colorDefault-CDqZdO.focused-3qFvc8,
.menu_d90b3d .colorDefault-CDqZdO:active {
    --gradient: linear-gradient(var(--gradient-blurple));
}

.menu_d90b3d .colorDanger-3n-KnP.focused-3qFvc8,
.menu_d90b3d .colorDanger-3n-KnP:active,
.menu_d90b3d #status-picker-dnd.focused-3qFvc8,
.menu_d90b3d #status-picker-dnd:active {
    --gradient: linear-gradient(var(--gradient-red));
}

.menu_d90b3d .colorPremium-vwmYZQ.focused-3qFvc8,
.menu_d90b3d .colorPremium-vwmYZQ:active {
    --gradient: linear-gradient(var(--gradient-special));
}

.menu_d90b3d #status-picker-online.focused-3qFvc8,
.menu_d90b3d #status-picker-online:active {
    --gradient: linear-gradient(var(--gradient-green));
}

.menu_d90b3d #status-picker-idle.focused-3qFvc8,
.menu_d90b3d #status-picker-idle:active {
    --gradient: linear-gradient(var(--gradient-yellow));
}

.menu_d90b3d #status-picker-invisible.focused-3qFvc8,
.menu_d90b3d #status-picker-invisible:active {
    --gradient: linear-gradient(var(--gradient-grey));
}

/* || Message Actions */
.wrapper_f7e168 .button_f7e168 {
    background: var(--gradient);
}

.wrapper_f7e168 .button_f7e168 img,
.wrapper_f7e168 .button_f7e168 svg {
    transition: var(--button-transition);
    transform: var(--transform-normal);
}

.wrapper_f7e168 .button_f7e168:hover {
    --gradient: linear-gradient(var(--gradient-blurple));
}

.wrapper_f7e168 .button_f7e168:hover svg {
    transform: var(--transform-hover);
    color: white;
}

.wrapper_f7e168 .button_f7e168.dangerous_f7e168:hover {
    --gradient: linear-gradient(var(--gradient-red));
}
