/* global-responsive-pages.css
 * Version: v1.0.0-full-width
 * Purpose: make AppGini pages use the full available screen width
 */

html, body {
  overflow-x: hidden;
}

body.appgini-full-width-page .container,
body.appgini-full-width-page .container-fluid {
  width: calc(100vw - 28px) !important;
  max-width: none !important;
  padding-left: 14px !important;
  padding-right: 14px !important;
}

@media (min-width: 768px) {
  body.appgini-full-width-page .container,
  body.appgini-full-width-page .container-fluid {
    width: calc(100vw - 36px) !important;
    padding-left: 18px !important;
    padding-right: 18px !important;
  }
}

@media (min-width: 1200px) {
  body.appgini-full-width-page .container,
  body.appgini-full-width-page .container-fluid {
    width: calc(100vw - 44px) !important;
    padding-left: 22px !important;
    padding-right: 22px !important;
  }
}

body.appgini-full-width-page .page-header,
body.appgini-full-width-page .panel,
body.appgini-full-width-page .table-responsive,
body.appgini-full-width-page .row {
  max-width: none !important;
}

body.appgini-full-width-page .table-responsive {
  overflow-x: auto;
}

body.appgini-full-width-page .table-responsive > .table,
body.appgini-full-width-page table.table {
  width: 100% !important;
}

body.appgini-full-width-page .panel-body,
body.appgini-full-width-page .panel-heading,
body.appgini-full-width-page .panel-footer {
  padding-left: 16px;
  padding-right: 16px;
}

body.appgini-full-width-page .page-header {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

body.appgini-full-width-page .btn-toolbar,
body.appgini-full-width-page .panel-title,
body.appgini-full-width-page .navbar,
body.appgini-full-width-page .breadcrumb {
  max-width: none !important;
}
