/**
 * Visibility utils are derived from bootstrap 3, they should do not
 * have a conflict with bootstrap 4 utils.
 *
 * They are essential, so they are extracted from responsive-grid.css
 * and declared here.
 */

.visible-xs,
.visible-sm,
.visible-md,
.visible-lg {
  display: none !important;
}

@media (width <= 767px) {
  .visible-xs {
    display: block !important;
  }

  table.visible-xs {
    display: table;
  }

  tr.visible-xs {
    display: table-row !important;
  }

  th.visible-xs,
  td.visible-xs {
    display: table-cell !important;
  }
}

@media (768px <= width <= 991px) {
  .visible-sm {
    display: block !important;
  }

  table.visible-sm {
    display: table;
  }

  tr.visible-sm {
    display: table-row !important;
  }

  th.visible-sm,
  td.visible-sm {
    display: table-cell !important;
  }
}

@media (992px <= width <= 1199px) {
  .visible-md {
    display: block !important;
  }

  table.visible-md {
    display: table;
  }

  tr.visible-md {
    display: table-row !important;
  }

  th.visible-md,
  td.visible-md {
    display: table-cell !important;
  }
}

@media (width >= 1200px) {
  .visible-lg {
    display: block !important;
  }

  table.visible-lg {
    display: table;
  }

  tr.visible-lg {
    display: table-row !important;
  }

  th.visible-lg,
  td.visible-lg {
    display: table-cell !important;
  }
}

@media (width <= 767px) {
  .hidden-xs {
    display: none !important;
  }
}

@media (768px <= width <= 991px) {
  .hidden-sm {
    display: none !important;
  }
}

@media (992px <= width <= 1199px) {
  .hidden-md {
    display: none !important;
  }
}

@media (width >= 1200px) {
  .hidden-lg {
    display: none !important;
  }
}

.visible-print {
  display: none !important;
}

@media print {
  .visible-print {
    display: block !important;
  }

  table.visible-print {
    display: table;
  }

  tr.visible-print {
    display: table-row !important;
  }

  th.visible-print,
  td.visible-print {
    display: table-cell !important;
  }
}

@media print {
  .hidden-print {
    display: none !important;
  }
}

.jenkins-hidden {
  display: none !important;
}

/// Hide an element visually, but have it available for screen readers
.jenkins-visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;

  // If margin is set to a negative value it can cause text to be announced in
  // the wrong order in VoiceOver for OSX
  margin: 0;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  border: 0;

  // For long content, line feeds are not interpreted as spaces and small width
  // causes content to wrap 1 word per line:
  // https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe
  white-space: nowrap;
}

.jenkins-mobile-show {
  @media (width >= 767px) {
    display: none !important;
  }
}

.jenkins-mobile-hide {
  @media (width <= 767px) {
    display: none !important;
  }
}
