@import "../_colors";
@import "../_queries";

body .ui-sidebar {
    padding: 20px;

    & h1 {
        border-bottom: 1px solid $default-primary-color;
        padding-bottom: 15px;
        margin-bottom: 20px;
    }

    & .ui-sidebar-close {
        color: $secondary-dark-text-color;
    }
}

body .ui-sidebar-right,
body .ui-sidebar-left {
    min-width: 25%;
}

body .ui-sidebar-full {
    width: calc(100% - 40px);
    height: calc(100% - 40px);
    top: 20px;
    left: 20px;
    border-radius: 4px;
}

body .ui-sidebar .ui-scrollpanel .ui-scrollpanel-content {
    height: 100%;
}

@media #{$sm-devices} {
    body .ui-sidebar-full {
        width: calc(100% - 20px);
        height: calc(100% - 20px);
        top: 10px;
        left: 10px;
    }
}