src/components/buttons/SideBarChatButton/SideBarChatButton.module.css

@import "../../_variables.css";

.chatButton {
    width: 90%;
    margin: var(--spacing-sm);
    max-height: 3em;
    height: 3em;
    align-items: center;
    display: flex;
    justify-content: center;
    border-radius: var(--border-radius-sm);
    border: 1px solid var(--color-chat-button-hover);
    background-color: transparent;
    transition: all var(--transition-speed-default) var(--bezier-custom);
    cursor: pointer;
}


.inactive:hover {
    background-color: var(--color-chat-button-hover);
    transform: translateY(-2px);
}

.inactive:active {
    background-color: var(--color-primary-hover);
    transform: translateY(0px);
}

.active {
    background-color: var(--color-primary);
    cursor: default;
}