.sandbox-bottom-toolbar-host {
  position: fixed;
  z-index: 1028;
  right: 0;
  bottom: calc(var(--sandbox-bottom-toolbar-offset, 0px) + env(safe-area-inset-bottom, 0px));
  left: 0;
  pointer-events: none;
}

.sandbox-bottom-toolbar-host[hidden] {
  display: none !important;
}

.sandbox-bottom-toolbar-host__shell {
  width: 100%;
  margin: 0;
  padding: 0.4rem 0.85rem;
  border: 0;
  border-top: 1px solid color-mix(in srgb, var(--sandbox-border, var(--bs-border-color, rgba(148, 163, 184, 0.28))) 78%, transparent);
  border-radius: 0;
  background:
    linear-gradient(180deg,
      color-mix(in srgb, var(--sandbox-surface, var(--bs-body-bg, #fff)) 88%, transparent),
      color-mix(in srgb, var(--sandbox-bg, var(--bs-body-bg, #fff)) 94%, var(--sandbox-surface, var(--bs-body-bg, #fff)) 6%)
    );
  color: var(--sandbox-text, var(--bs-body-color, inherit));
  box-shadow: 0 -0.75rem 1.75rem color-mix(in srgb, var(--sandbox-bg, #0f172a) 32%, transparent);
  backdrop-filter: blur(14px);
  pointer-events: auto;
}

.sandbox-bottom-toolbar-host__content {
  min-width: 0;
}

.sandbox-bottom-toolbar-host :where(.text-muted, .small.text-muted) {
  color: var(--sandbox-muted, var(--bs-secondary-color, #66717c)) !important;
}

body.has-sandbox-bottom-toolbar {
  padding-bottom: var(--sandbox-bottom-toolbar-height, 0px);
}

body.has-sandbox-bottom-toolbar-footer-hidden [data-app-footer="1"] {
  display: none !important;
}

@media (max-width: 575.98px) {
  .sandbox-bottom-toolbar-host__shell {
    padding: 0.35rem 0.5rem;
  }
}
