@import '../mixins.scss';

.tui-fieldset {
    border: 6px white double;
    padding: 12px;
    background-color: inherit;
    margin-bottom: 6px;

    &.no-legend {
        margin-top: 6px;
    }
}
.tui-input-fieldset {
    border-top: 6px white double;
    border-bottom: 6px white double;
    border-left: 2px white solid;
    border-right: 2px white solid;
    padding: 5px;
    background-color: inherit;
}
.tui-input-fieldset legend {
    color: white;
}
.tui-input-fieldset:hover {
    border-color: yellow;
}
.tui-input-fieldset:hover legend {
    color: yellow;
}
.tui-fieldset-button {
    position: absolute;
    top: 0px;
    right: 16px;
    color: white;
    background-color: inherit;
    z-index: 2;
    border: none;
    cursor: pointer;
    outline:0;
    padding: 2px;
    @include disable-select;
    
    &.left {
        right: initial;
        left: 16px !important;
    }
    &.bottom {
        bottom: 0px;
        top: initial;
    }
}
.tui-fieldset-text {
    position: absolute;
    bottom: 0px;
    left: 16px;
    color: white;
    background-color: inherit;
    z-index: 2;
    padding: 2px;

    &.right {
        left: initial;
        right: 16px;
    }
    &.top {
        top: 0px;
        bottom: initial;
    }
}
.tui-fieldset-button::before {
    content: "[";
}
.tui-fieldset-button::after {
    content: "]";
}
.tui-fieldset-button:active {
    color: rgb(0, 255, 255)!important;
}