.intent-directive {
  width: 100%;
  box-sizing: border-box;

  padding-top: calc(0px + env(safe-area-inset-top, 0));
  padding-left: calc(0px + env(safe-area-inset-left, 0));
  padding-right: calc(0px + env(safe-area-inset-right, 0));
  z-index: 79;
  background-color: rgba(var(--background-content));
  color: rgba(var(--font-color));

  flex-direction: row;
  align-items: center;

  min-height: 64px;

  display: none;
  opacity: 0;
}

.intent-directive.elevate {
  position: fixed;
  left: 0;
  right: 0;

  min-height: var(--navbar-top-height);
  box-shadow: 0 8px 16px 0 rgba(var(--shadow-color));
}

.intent-directive.is-visible {
  display: flex;
  opacity: 1;
}

.intent-directive .md-button.md-icon-button {
  margin: 0;
}

.intent-directive md-icon {
  color: rgba(var(--font-color));
}

.intent-directive .intent-directive-icon {
  margin: 8px 8px 8px 0;
  width: 48px;
  height: 48px;
}

.dark-mode .intent-directive .intent-directive-icon, .intent-directive .intent-directive-icon.intent-directive-icon-dark-mode {
  display: none;
}

.dark-mode .intent-directive .intent-directive-icon.intent-directive-icon-dark-mode {
  display: block;
}

.intent-directive .intent-directive-content {
  display: flex;
  flex-direction: column;
  justify-content: center;

  flex: 1;
  overflow: hidden;
}

.intent-directive .intent-directive-content .intent-directive-content-title {
  font-size: 10pt;
  font-weight: bold;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.intent-directive .intent-directive-content .intent-directive-content-subtitle {
  font-size: 10pt;
  font-weight: 300;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.intent-directive .intent-directive-actions {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.intent-directive .intent-directive-actions .button-group .open-store-action {
  border-left: 2px solid rgba(var(--background-content));
  min-width: 36px;
}

.intent-directive .intent-directive-actions .button-group button {
  min-width: auto;
  border: none;
}

.intent-directive .intent-directive-actions .button-group button:first-child {
  padding-right: 6px;
}

.intent-directive .intent-directive-actions .button-group button:last-child {
  padding-left: 6px;
}