/* [project]/node_modules/.pnpm/@payloadcms+ui@3.90.2_@types+react@19.3.0_monaco-editor@0.57.0_next@16.3.8_@babel+core@_579d5163583e452e6718d4ede00a9075/node_modules/@payloadcms/ui/dist/elements/Banner/index.scss.css [app-client] (css) */
@layer payload-default {
  .banner {
    vertical-align: middle;
    background: var(--theme-elevation-100);
    color: var(--theme-elevation-800);
    border: 0;
    border-radius: 4px;
    margin-bottom: 1.53846rem;
    padding: 10px;
    font-size: 1rem;
    line-height: 20px;
  }

  .banner--has-action {
    cursor: pointer;
    text-decoration: none;
  }

  .banner--has-icon {
    display: flex;
  }

  .banner--has-icon svg {
    display: block;
  }

  .banner--type-default.banner--has-action:active, .banner--type-default.banner--has-action:hover {
    color: var(--theme-elevation-0);
  }

  .banner--type-default.banner--has-action:hover {
    background: var(--theme-elevation-900);
  }

  .banner--type-default.banner--has-action:active {
    background: var(--theme-elevation-950);
  }

  .banner--type-error {
    background: var(--theme-error-100);
    color: var(--theme-error-600);
  }

  .banner--type-error svg .stroke {
    stroke: var(--theme-error-600);
    fill: none;
  }

  .banner--type-error svg .fill {
    fill: var(--theme-error-600);
  }

  .banner--type-error.banner--has-action:active, .banner--type-error.banner--has-action:hover {
    color: var(--theme-error-800);
  }

  .banner--type-error.banner--has-action:active svg .stroke, .banner--type-error.banner--has-action:hover svg .stroke {
    stroke: var(--theme-error-800);
    fill: none;
  }

  .banner--type-error.banner--has-action:active svg .fill, .banner--type-error.banner--has-action:hover svg .fill {
    fill: var(--theme-error-800);
  }

  .banner--type-error.banner--has-action:hover {
    background: var(--theme-error-200);
  }

  .banner--type-error.banner--has-action:active {
    background: var(--theme-error-300);
  }

  .banner--type-success {
    background: var(--theme-success-100);
    color: var(--theme-success-600);
  }

  .banner--type-success.banner--has-action:active, .banner--type-success.banner--has-action:hover {
    color: var(--theme-success-800);
  }

  .banner--type-success.banner--has-action:hover, .banner--type-success.banner--has-action:active {
    background: var(--theme-success-200);
  }

  .banner--type-warning {
    background: var(--theme-warning-150);
    color: var(--theme-warning-650);
  }

  .banner--type-warning svg .stroke {
    stroke: var(--theme-warning-650);
    fill: none;
  }

  .banner--type-warning svg .fill {
    fill: var(--theme-warning-650);
  }

  .banner--type-warning.banner--has-action:active, .banner--type-warning.banner--has-action:hover {
    color: var(--theme-warning-800);
  }

  .banner--type-warning.banner--has-action:active svg .stroke, .banner--type-warning.banner--has-action:hover svg .stroke {
    stroke: var(--theme-warning-800);
    fill: none;
  }

  .banner--type-warning.banner--has-action:active svg .fill, .banner--type-warning.banner--has-action:hover svg .fill {
    fill: var(--theme-warning-800);
  }

  .banner--type-warning.banner--has-action:hover {
    background: var(--theme-warning-250);
  }

  .banner--type-warning.banner--has-action:active {
    background: var(--theme-warning-300);
  }
}