@import "../vendor/bootstrap/less/variables.less";
@import "../vendor/bootstrap/less/mixins/buttons.less";
@import "bootstrap/variables.less";


@media (max-width: @screen-sm-max) {
    .container {
        width: auto;
    }
}

@media (min-width: @screen-lg-min) {
    .hide-large { display: none; }
    .show-large { display: block; }
}

@media (min-width: @screen-md-min) and (max-width: @screen-md-max) {
    .hide-desktop { display: none; }
    .show-desktop { display: block; }
}

@media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) {
    .hide-tablet { display: none; }
    .show-tablet { display: block; }
}

@media (max-width: @screen-xs-max) {
    .hide-phone { display: none; }
    .show-phone { display: block; }

    .overlay-sidebar {
        width: 80% !important;
    }

    .btn-large-phone {
        display: block;
        .button-size(@padding-large-vertical; @padding-large-horizontal; @font-size-large; @line-height-large; @border-radius-large);
    }

    #toast-container {
        left: 0;
        top: 0;
        width: 100%;

        &>.toast {
            width: 100%;
            border-radius: 0;
        }
    }
}
