@import "../../../styles/modules/importAll";

.ConfigMenu {

    ul,
    ol {
        list-style: none;
    }
    
    .visualisationTypePicker {
        .typeButton {
            padding: 2rem 1rem;
            background-color: rgba(white, 1);
            color: rgba($black, 0.6);
            transition: all 0.1s ease;
            margin: 0.25rem;
            background-repeat: no-repeat;
            background-size: auto 75%;
            background-position: 95% center;
            text-transform: capitalize;
            transition: background-color 0.5s ease;

            &:hover {
                background-color: rgba($black, 0.05);
                opacity: 1;
                color: $black;
            }
        }
    }

    .helpText {
        border: 0.1rem solid $warnYellow;

        @include border-radius(3px);

        .helpTextContainer {
            padding: 0.5rem 0.25rem;
        }
    }

    .aggregationHelpText {
        border: 0.1rem solid transparent;
        transition: border-color 0.5s ease, height 0.5s ease;
        transition-delay: 0.75s;
        overflow: hidden;
    }

    .aggregationInputContainer {
        cursor: pointer;
    }

    .aggregationInputContainer .aggregationHelpText {
        opacity: 1;
        border: 0.1rem solid $warnYellow;
    }

    .alert {
        height: 1rem;
        width: 1rem;
        background-color: $warnYellow;
        color: white;
        display: inline-block;

        @include border-radius(100%);

        text-align: center;
        margin-right: 0.5rem;
    }
}