// Empty state blocker with blokk font-family replacement

// Import redacted-style "blokk" font for empty states
// Needs to be outside of the namespace for valid CSS output (particularly important for Internet Explorer)
@font-face {
  font-family: 'BLOKK';
  src: asset-url('admin/blokk/BLOKKNeue-Regular.eot');
  src: asset-url('admin/blokk/BLOKKNeue-Regular.eot?#iefix') format('embedded-opentype'),
       asset-url('admin/blokk/BLOKKNeue-Regular.woff2') format('woff2'),
       asset-url('admin/blokk/BLOKKNeue-Regular.woff') format('woff'),
       asset-url('admin/blokk/BLOKKNeue-Regular.otf') format('opentype'),
       asset-url('admin/blokk/BLOKKNeue-Regular.ttf') format('truetype'),
       asset-url('admin/blokk/BLOKKNeue-Regular.svg#BLOKKRegular') format('svg');
  font-weight: normal;
  font-style: normal;
}
@media screen and (-webkit-min-device-pixel-ratio:0) {
  @font-face {
    font-family: 'BLOKK';
    src: asset-url('admin/blokk/BLOKKNeue-Regular.svg') format('svg');
  }
}

$redacted-font-family: "BLOKK";

// Overlay styles
.redacted-text {
  font-family: $redacted-font-family !important;
  letter-spacing: -3px;
  word-spacing: -3px;
  .card-img-overlay { background: none; }
}
.overlay-white {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 30;
  font-family: $font-family-base;
  letter-spacing: 0;
  word-spacing: 0;
  background-color: rgba(255,255,255,0.9);
}
.overlay-blur {
  transition: $transition-base;
  filter: blur(0);
  &.in { filter: blur(4px); }
}