@import 'pattern-box'
@import 'flags'
@import 'text-box'
@import 'references'

#regex-create
    text-align: left
    margin: 10px

    .p-card
        margin-top: 10px
        margin-bottom: 10px

    .regex-header
        margin-bottom: 5rem

    .regex-box
        background-color: #001221
        display: flex
        // width: 850px
        width: 90%
        height: 500px
        margin-left: auto
        margin-right: auto
        margin-bottom: 5rem
        position: relative
        border-radius: 5px
        transition: all 0.25s linear

    // .regex-box:hover
    //     box-shadow: 0.4rem 1.4rem 1.4rem rgba(0, 0, 0, 0.2)
    //     transform: translateY(-10px)

    .main
        display: flex
        flex-direction: column
        // width: 550px
        width: 100%

    aside
        width: 300px
        padding: 1.5rem
        border-left: 1px solid #ffffff31
        overflow-y: scroll

    aside::-webkit-scrollbar
        background: #3f4545
        width: 10px !important

    aside::-webkit-scrollbar-track
        border-radius: 10px !important

    aside::-webkit-scrollbar-thumb
        border-radius: 10px !important
        -webkit-box-shadow: inset 0 0 6px rgba(54, 52, 52, 0.925) !important
        box-shadow: inset 0 0 6px rgba(54, 52, 52, 0.863) !important