/* Settings */
@use '@angular/material' as mat;
@use 'src/styles/variable' as var;
//@import 'src/styles/variable';

.banner {
    background-color: mat.get-color-from-palette(var.$md-custom-warn, 700);
    margin-bottom: 1rem;
    &.light {
        background-color: mat.get-color-from-palette(var.$md-custom-accent, 700);
        color: #555;
        button {
            color: #555;
            border-color: #555;
        }
    }
    .user-img {
        width: 84px;
        height: 84px;
        border-radius: 84px;
        margin-bottom: 0.75rem;
    }
    h4 {
        font-weight: 500;
        margin-bottom: 0.75rem;
    }
    p {
        margin: 0 auto .5rem;
        color: #aaaaaa;
        max-width: 450px;
        font-weight: 300;
    }
}
/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    appearance: none;
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
input[type=number] {
    appearance: textfield;
    -moz-appearance: textfield;
}