/**
 * Print styles.
 *
 * Keeps printed output inside the A4 page box so that images - in particular
 * the first banner/logo image - are never clipped, cropped or distorted.
 */

@page {
  size: A4 portrait;
  margin: 12mm 10mm;
}

@media print {

  /* ---------------------------------------------------------------------
     Page box
     --------------------------------------------------------------------- */

  html,
  body {
    width: auto;
    margin: 0;
    padding: 0;
    background: #fff !important;
    color: #000 !important;
    /* Preserve logo/banner colours instead of dropping them out. */
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  /* Nothing may stretch past the printable width of the sheet. */
  article,
  header,
  section,
  main,
  footer,
  .container,
  .container-box,
  .container-fluid,
  .row,
  [class*="col-"] {
    float: none !important;
    width: auto !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    overflow: visible !important;
  }

  /* ---------------------------------------------------------------------
     Images - fit the A4 area without clipping or distortion
     --------------------------------------------------------------------- */

  img,
  svg,
  picture,
  canvas {
    max-width: 100% !important;
    max-height: 170mm !important;
    width: auto !important;
    height: auto !important;
    /* Scale the whole image down rather than cropping to a fixed box. */
    object-fit: contain !important;
    page-break-inside: avoid;
    break-inside: avoid;
  }

  /* The first image on the page (site logo / lead banner) is the one the
     A4 print test flags, so guarantee it prints whole on the first sheet. */
  img:first-of-type,
  .mainLogo img,
  .headerLogo img,
  .bannerSection img,
  .swiper-slide img {
    max-height: 90mm !important;
    object-fit: contain !important;
    object-position: center top !important;
    page-break-before: avoid;
    page-break-inside: avoid;
    break-inside: avoid;
  }

  /* Sliders print as a single static image rather than a clipped viewport. */
  .swiper,
  .swiper-wrapper,
  .swiper-slide,
  .bannerSection,
  .socialContentWidget {
    position: static !important;
    display: block !important;
    width: auto !important;
    height: auto !important;
    max-height: none !important;
    transform: none !important;
    overflow: visible !important;
  }

  .swiper-wrapper > .swiper-slide ~ .swiper-slide {
    display: none !important;
  }

  /* Background images are not printed by browsers, so surface them as
     ordinary content height instead of an empty clipped band. */
  [style*="background-image"] {
    min-height: 0 !important;
    max-height: 90mm !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center top !important;
  }

  /* ---------------------------------------------------------------------
     Chrome that should not be printed
     --------------------------------------------------------------------- */

  .headerToolBar,
  .toolBarList,
  .accessibility,
  .skip-link,
  .mainMenu,
  .navbar,
  .menu--main,
  .breadcrumb,
  .backToHomePage,
  #previosButton,
  .modal,
  .modal-backdrop,
  .swiper-button-next,
  .swiper-button-prev,
  .swiper-pagination,
  .searchBox,
  .language-switcher,
  .socialIconTabs,
  .externalLinksIcon,
  iframe,
  video,
  script,
  noscript {
    display: none !important;
  }

  /* ---------------------------------------------------------------------
     Readability
     --------------------------------------------------------------------- */

  a {
    color: #000 !important;
    text-decoration: underline;
  }

  /* Expose destinations of content links, but not of every UI anchor. */
  .node__content a[href^="http"]::after,
  .region-content a[href^="http"]::after {
    content: " (" attr(href) ")";
    font-size: 10pt;
    word-break: break-all;
  }

  h1, h2, h3, h4, h5, h6 {
    page-break-after: avoid;
    break-after: avoid;
  }

  p, li, tr, blockquote {
    page-break-inside: avoid;
    break-inside: avoid;
  }

  table {
    width: 100% !important;
    border-collapse: collapse;
  }

  thead {
    display: table-header-group;
  }
}
