/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
@layer properties;
rui-alert {
  display: block;
}
@layer components {
  .rui-alert {
    position: relative;
    display: block;
    border-radius: var(--radius-container, var(--radius-container));
    font-size: var(--text-sm, var(--text-sm));
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    --tw-shadow: var(--shadow-control);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .rui-alert--inline {
    display: flex;
    align-items: center;
    gap: var(--spacing-inline, var(--space-inline));
    padding-inline: var(--spacing-control-x, var(--space-control-x));
    padding-block: var(--spacing-control-y, var(--space-control-y));
  }
  .rui-alert--inline.rui-alert--dismissible {
    padding-right: calc(var(--spacing, 0.25rem) * 2.5);
  }
  .rui-alert__icon {
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
  }
  .rui-alert--banner {
    display: flex;
    flex-direction: column;
    padding-block: var(--spacing-control-y, var(--space-control-y));
    padding-right: var(--spacing-control-x, var(--space-control-x));
    padding-left: var(--spacing-6, var(--space-6));
    &::before {
      content: '';
      position: absolute;
      top: var(--spacing-2, var(--space-2));
      bottom: var(--spacing-2, var(--space-2));
      left: var(--spacing-2, var(--space-2));
      width: var(--spacing-1, var(--space-1));
      border-radius: var(--radius-full, var(--border-radius-full));
      background-color: currentcolor;
      opacity: 50%;
    }
  }
  .rui-alert--banner.rui-alert--dismissible {
    padding-right: calc(var(--spacing, 0.25rem) * 11);
  }
  .rui-alert__close {
    display: inline-flex;
    width: calc(var(--spacing, 0.25rem) * 7);
    height: calc(var(--spacing, 0.25rem) * 7);
    flex-shrink: 0;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-control, var(--radius-control));
    color: currentcolor;
    opacity: 65%;
    transition-property: opacity;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    &:hover {
      @media (hover: hover) {
        opacity: 100%;
      }
    }
    &:focus-visible {
      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
    &:focus-visible {
      --tw-ring-color: currentcolor;
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, currentcolor 35%, transparent);
      }
    }
    &:focus-visible {
      --tw-outline-style: none;
      outline-style: none;
    }
  }
  .rui-alert--inline .rui-alert__close {
    margin-left: auto;
  }
  .rui-alert--banner .rui-alert__close {
    position: absolute;
    top: calc(var(--spacing, 0.25rem) * 2.5);
    right: calc(var(--spacing, 0.25rem) * 2.5);
  }
  .rui-alert__title {
    margin-bottom: 0px;
    --tw-font-weight: var(--font-weight-bold, 700);
    font-weight: var(--font-weight-bold, 700);
  }
  .rui-alert__description p {
    margin-block: var(--spacing-1, var(--space-1));
  }
  .rui-alert--info {
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-info, var(--info));
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-info, var(--info)) 30%, transparent);
    }
    background-color: var(--color-info-container, var(--info-container));
    color: var(--color-on-info-container, var(--on-info-container));
  }
  .rui-alert--info.rui-alert--banner::before {
    background-color: var(--color-info, var(--info));
    opacity: 100%;
  }
  .rui-alert--success {
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-success, var(--success));
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-success, var(--success)) 30%, transparent);
    }
    background-color: var(--color-success-container, var(--success-container));
    color: var(--color-on-success-container, var(--on-success-container));
  }
  .rui-alert--success.rui-alert--banner::before {
    background-color: var(--color-success, var(--success));
    opacity: 100%;
  }
  .rui-alert--warning {
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-warning, var(--warning));
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-warning, var(--warning)) 30%, transparent);
    }
    background-color: var(--color-warning-container, var(--warning-container));
    color: var(--color-on-warning-container, var(--on-warning-container));
  }
  .rui-alert--warning.rui-alert--banner::before {
    background-color: var(--color-warning, var(--warning));
    opacity: 100%;
  }
  .rui-alert--error {
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-error, var(--error));
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-error, var(--error)) 30%, transparent);
    }
    background-color: var(--color-error-container, var(--error-container));
    color: var(--color-on-error-container, var(--on-error-container));
  }
  .rui-alert--error.rui-alert--banner::before {
    background-color: var(--color-error, var(--error));
    opacity: 100%;
  }
}
@property --tw-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-inset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-inset-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-ring-color {
  syntax: "*";
  inherits: false;
}
@property --tw-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-ring-color {
  syntax: "*";
  inherits: false;
}
@property --tw-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-ring-inset {
  syntax: "*";
  inherits: false;
}
@property --tw-ring-offset-width {
  syntax: "<length>";
  inherits: false;
  initial-value: 0px;
}
@property --tw-ring-offset-color {
  syntax: "*";
  inherits: false;
  initial-value: #fff;
}
@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-font-weight {
  syntax: "*";
  inherits: false;
}
@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@layer properties {
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
    *, ::before, ::after, ::backdrop {
      --tw-shadow: 0 0 #0000;
      --tw-shadow-color: initial;
      --tw-shadow-alpha: 100%;
      --tw-inset-shadow: 0 0 #0000;
      --tw-inset-shadow-color: initial;
      --tw-inset-shadow-alpha: 100%;
      --tw-ring-color: initial;
      --tw-ring-shadow: 0 0 #0000;
      --tw-inset-ring-color: initial;
      --tw-inset-ring-shadow: 0 0 #0000;
      --tw-ring-inset: initial;
      --tw-ring-offset-width: 0px;
      --tw-ring-offset-color: #fff;
      --tw-ring-offset-shadow: 0 0 #0000;
      --tw-font-weight: initial;
      --tw-border-style: solid;
    }
  }
}