.message.me {
    background-color: #0d6efd;
    color: #fff;
    border-radius: 1rem 1rem 0.2rem 1rem;
    align-self: end;
}

.message.other {
    background-color: #e9ecef;
    border-radius: 1rem 1rem 1rem 0.2rem;
    align-self: start;
}

.settings-scrollable {
    overflow-y: auto;
    max-height: 1000px;
}

.scroll-x {
    display: flex;
    overflow-x: hidden;
    padding-bottom: 0.5rem;
    gap: 1rem;
}

.bg-soft {
    background-color: var(--app-primary-soft) !important;
}


.navbar-toggler {
    position: relative;
}

.notification-dot-burger {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 10px;
    height: 10px;
    background-color: #dc3545;
    border: 2px solid white;
    border-radius: 50%;
}

.material-icons-baseline {
    transform: translateY(0.2em)
}

/* Form submit spinner animation */
@keyframes spinner-spin {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

.spinner-icon {
    display: inline-block;
    animation: spinner-spin 1s linear infinite;
    margin-right: 0.5rem;
    vertical-align: middle;
}

.btn-spinner-active {
    pointer-events: none;
}