@import "~@dnnsoftware/dnn-react-common/styles/index";

.collapsible-logitemdetail {
    display: table;
    width: 100%;

    &.false {
        border-top: 2px solid @curiousBlue !important;
        border-bottom: 2px solid @curiousBlue !important;
        position: relative;
        top: -1px;
    }

    &:not(:last-child) {
        border-bottom: 1px solid #ddd;
    }

    .logitem-collapsible {
        float: left;
        width: 100%;

        >div {
            float: left;
            padding-bottom: 25px;
            width: 100%;
        }
    }

    div.collapsible-logitemdetail-header {
        width: 100%;
        float: left;
        position: relative;
        padding: 15px;
        box-sizing: border-box;

        .term-header {
            cursor: pointer;

            .term-label {
                float: left;
            }

            .term-label-wrapper {
                padding: 0 5px 0 5px;
                word-wrap: break-word;
            }
        }

        .edit-icon {
            margin-left: 5px;
            float: right;
            cursor: pointer;

            svg {
                width: 18px;
                float: left;
                height: 18px;
            }

            &.false {
                svg {
                    fill: @curiousBlue;
                }

                svg:hover {
                    fill: @thunder;
                }
            }
        }

    }

    span.active {
        color: green;
        font-weight: 900;
    }

    span.inactive {
        color: red;
        font-weight: 900;
    }

    .buttons-box {
        width: 100%;
        text-align: center;
        float: left;
        margin: 15px 0;

        .dnn-ui-common-button {
            margin: 5px;
        }

        .edit-icon {
            margin: 0px 10px 20px 10px;
            float: right;

            svg {
                width: 16px;
                float: left;
                height: 16px;
            }
        }
    }
}