@import "../scss/vars";

.toggle-list {

    &__item {
        border: 1px $light-grey solid;
        border-left: none;
        width: 180px;
        height: 120px;
        display: inline-block;
        transition: box-shadow 0.2s ease-in-out;
        user-select: none;
        cursor: default;
    }

    &__selected {
        box-shadow: inset 0 2px 12px -5px rgba(0, 0, 0, 0.7);
    }

    &__first-item {
        border: 1px $light-grey solid;
        border-radius: 4px 0 0 4px;
    }

    &__last-item {
        border-radius: 0 4px 4px 0;
    }

    &_small {
        .toggle-list__item {
            height: 80px;
            width: 120px;
        }
    }
}
