/* Dark transparent backdrop (used for granite menu overlay) */
@mixin granite-overlay-dark-glass-backdrop {
  .granite-overlay-dark-glass-backdrop {
    background-color: var(--granite-color-overlay-modal);
  }
}

/* Make overlay pane fill entire viewport width and align contents at the bottom (used for granite menu overlay) */
@mixin granite-overlay-pane-fill-width-bottom {
  .cdk-overlay-pane.granite-overlay-pane-fill-width-bottom {
    flex-direction: column;
    flex: 1 0 100%;
    justify-content: flex-end;
  }
}

/* Make overlay pane fill entire viewport width and align contents at the bottom (used for granite menu overlay) */
@mixin granite-overlay-pane-center {
  .cdk-overlay-pane.granite-overlay-pane-center {
    flex-direction: row;
    flex: 1 0 100%;
    justify-content: center;
    align-self: center;
  }
}