@use "variables-common";
@use "variables-color-common";

.main {
    padding: 0;

    @media screen and (max-width: 880px) {
        padding: variables-common.$navbar-height 0 0 0;
    }

    @media screen and (max-width: 650px) {
        padding: variables-common.$navbar-height * 2 0 0 0;
    }

    #feedback ul {
        margin: 12px;
    }

    .toolbar.nav-pills {
        margin: 0;
        padding: var(--tlp-medium-spacing) var(--tlp-medium-spacing) 0;
        border: 0;
        border-bottom: 1px solid var(--tlp-background-color-darker-05);
        background: var(--tlp-background-color);
        font-size: 13px;

        li > a {
            margin: 0 30px 15px 0;
            padding: 0;
            background: none;
            color: variables-color-common.$medium-grey;
            font-weight: normal;
        }

        li > a:hover,
        li > a:focus {
            background: none;
            color: variables-color-common.$dark-grey;
            font-weight: normal;
        }
    }

    .breadcrumb + .toolbar.nav-pills {
        padding: 0 var(--tlp-medium-spacing);
    }

    .content {
        padding: 12px 12px 150px;
    }
}

.full-width + .main {
    #feedback {
        margin-top: 60px;
    }
}
