.site-banner {
  position: sticky;
  left: 0;
  right: 0;
  z-index: var(--banner-z, 1050);
  background: var(--banner-bg, #111827);
  color: var(--banner-color, #fff);
  font-size: var(--banner-font-size, 14px);
  font-weight: var(--banner-font-weight, 500);
  line-height: var(--banner-line-height, 1.4);
  letter-spacing: var(--banner-letter-spacing, 0px);
  text-align: var(--banner-text-align, left);
  padding: var(--banner-padding-y, 10px) var(--banner-padding-x, 16px);
  border: var(--banner-border-width, 0px) solid var(--banner-border-color, transparent);
  border-radius: var(--banner-border-radius, 0px);
  box-shadow: var(--banner-shadow, none);
}

.site-banner--has-dismiss {
  padding-right: calc(var(--banner-padding-x, 16px) + 34px);
}

.site-banner--top { top: 0; }
.site-banner--bottom { bottom: 0; }

.site-banner__inner {
  display: flex;
  gap: var(--banner-gap, 12px);
  align-items: var(--banner-content-align, center);
  justify-content: var(--banner-content-justify, space-between);
  flex-wrap: wrap;
  max-width: var(--banner-content-max-width, 100%);
  margin: 0 auto;
}

.site-banner__message {
  flex: 1 1 auto;
  min-width: 220px;
}

.site-banner__message a {
  color: var(--banner-link-color, #93c5fd);
}

.site-banner__actions {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  flex-direction: var(--banner-actions-dir, row);
}

/* Quick layout presets */
.site-banner--actions-preset-right .site-banner__message { order: 1; }
.site-banner--actions-preset-right .site-banner__actions { order: 2; margin-left: auto; }

.site-banner--actions-preset-left .site-banner__message { order: 2; }
.site-banner--actions-preset-left .site-banner__actions { order: 1; margin-right: auto; }

.site-banner--actions-preset-top_center .site-banner__inner { flex-direction: column; align-items: stretch; }
.site-banner--actions-preset-top_center .site-banner__actions { order: 1; margin: 0 auto; align-self: center; }
.site-banner--actions-preset-top_center .site-banner__message { order: 2; width: 100%; }

.site-banner--actions-preset-bottom_center .site-banner__inner { flex-direction: column; align-items: stretch; }
.site-banner--actions-preset-bottom_center .site-banner__message { order: 1; width: 100%; }
.site-banner--actions-preset-bottom_center .site-banner__actions { order: 2; margin: 0 auto; align-self: center; }

/* Fine-grained custom positioning */
.site-banner--actions-preset-custom.site-banner--actions-h-left .site-banner__actions { margin-right: auto; margin-left: 0; }
.site-banner--actions-preset-custom.site-banner--actions-h-center .site-banner__actions { margin-left: auto; margin-right: auto; }
.site-banner--actions-preset-custom.site-banner--actions-h-right .site-banner__actions { margin-left: auto; }

.site-banner--actions-preset-custom.site-banner--actions-v-start .site-banner__actions { align-self: flex-start; }
.site-banner--actions-preset-custom.site-banner--actions-v-center .site-banner__actions { align-self: center; }
.site-banner--actions-preset-custom.site-banner--actions-v-end .site-banner__actions { align-self: flex-end; }

.site-banner__cta,
.site-banner__dismiss {
  border-radius: var(--banner-btn-radius, 4px);
  padding: var(--banner-btn-py, 6px) var(--banner-btn-px, 10px);
  text-decoration: none;
  cursor: pointer;
  font-weight: var(--banner-btn-font-weight, 600);
  border: var(--banner-btn-border-width, 1px) solid var(--banner-btn-border-color, #2563eb);
}

.site-banner__cta {
  background: var(--banner-btn-bg, #2563eb);
  color: var(--banner-btn-color, #fff);
}

.site-banner--btn-outline .site-banner__cta {
  background: transparent;
  color: var(--banner-btn-border-color, #2563eb);
}

.site-banner--btn-text .site-banner__cta {
  background: transparent;
  border-color: transparent;
  color: var(--banner-link-color, #93c5fd);
  padding-left: 0;
  padding-right: 0;
}

.site-banner__dismiss {
  position: absolute;
  right: max(6px, var(--banner-padding-x, 16px) * 0.3);
  top: 50%;
  transform: translateY(-50%);
  background: transparent;
  color: inherit;
  border: 0;
  font-size: 22px;
  line-height: 1;
  padding: 0 6px;
  font-weight: 700;
  z-index: calc(var(--banner-z, 1050) + 1);
}
