body {
  /* THIS is not a good way to handle this, and a proper refactoring needs to be performed
    This allows bigger images of media on listings for large screens
    It would be great to adapt to other sizes, but this requires a good refaftoring
     */

  @media screen and (min-width: 2200px) {
      --default-item-width: 342px !important;
      --default-max-item-width: 342px !important;
      --default-item-margin-right-width: 17px !important;
      --default-item-margin-bottom-width: 27px !important;
  }
}

/* ---- D4Sec brand: override MediaCMS theme variables (defined on body).
   This recolors everything that uses var(--theme-color/--default-theme-color)
   -- buttons, links, accents -- from green (#009933) to brand blue (#0600EB),
   and raises the logo height (also a variable). ---- */
body {
  --default-theme-color: #0600EB !important;
  --default-brand-color: #0600EB !important;
  --default-logo-height: 40px !important;
}

/* D4Sec branding: the Digital4Security logo has a wordmark + tagline stacked,
   so it needs more height than the default MediaCMS wordmark. */
.page-header .logo,
.page-header .logo a,
.page-header .logo a span {
  display: inline-flex;
  align-items: center;
  height: 100%;
}

.page-header .logo a span img,
.logo a span img {
  max-height: 40px !important;
  height: 40px !important;
  width: auto !important;
  max-width: none !important;
}

/* ---- D4Sec brand accent: replace the default MediaCMS green (#009933)
   with Digital4Security blue (#0600EB) on buttons and accent links. ---- */

/* Solid/primary buttons (green background -> brand blue) */
.button-link {
  background-color: #0600EB !important;
  border-color: #0600EB !important;
}
.button-link:hover,
.button-link:focus {
  background-color: #0400B8 !important;
  border-color: #0400B8 !important;
}

/* Transparent text-style buttons (Sign in / Register) keep no fill, blue text */
.button-link.sign-in,
.button-link.register-link {
  background-color: transparent !important;
  color: #0600EB !important;
}
.button-link.sign-in:hover,
.button-link.register-link:hover {
  background-color: transparent !important;
  color: #0400B8 !important;
}
