@charset "UTF-8";

.tags {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    .tags__item {
        border: $c-gray 0.15em solid;
        border-radius: 0.8em;
        padding: 0.8em 0.55em;
        background-color: $c-white;
        display: flex;
        justify-content: center;
        align-items: center;
        &-md {
            width: 30%;
            margin-right: 5%;
            &:nth-child(3n) {
                margin-right: 0;
            }
        }
        &-lg {
            width: 100%;
        }
        label {
            margin-bottom: 0;
        }
        p {
            text-align: center;
            font-size: 1.4em;
            margin-bottom: 0;
            color: $c-gray;
            font-weight: 400;
        }
        &.checked {
            border: $c-blue 0.15em solid;
            background-color: $c-blue-active;
            p {
                color: $c-blue;
            }
        }
    }
}
