// LLM UI Alert Components
// Provides consistent alert styling across all projects

.llm-alert {
  position: relative;
  padding: $spacing-md;
  margin-bottom: $spacing-md;
  border: 1px solid transparent;
  border-radius: $border-radius;
  font-family: $font-family;
  font-size: $font-size-base;
  line-height: $line-height;
  
  // Alert variants
  &.llm-alert--info {
    color: $info-dark;
    background-color: $info-light;
    border-color: $info-color;
    
    .llm-alert__icon {
      color: $info-color;
    }
  }
  
  &.llm-alert--success {
    color: $success-dark;
    background-color: $success-light;
    border-color: $success-color;
    
    .llm-alert__icon {
      color: $success-color;
    }
  }
  
  &.llm-alert--warning {
    color: $warning-dark;
    background-color: $warning-light;
    border-color: $warning-color;
    
    .llm-alert__icon {
      color: $warning-color;
    }
  }
  
  &.llm-alert--error {
    color: $error-dark;
    background-color: $error-light;
    border-color: $error-color;
    
    .llm-alert__icon {
      color: $error-color;
    }
  }
  
  // Alert with icon
  &.llm-alert--with-icon {
    padding-left: $spacing-lg + $spacing-md;
    
    .llm-alert__icon {
      position: absolute;
      left: $spacing-md;
      top: $spacing-md;
      font-size: $font-size-lg;
    }
  }
  
  // Dismissible alert
  &.llm-alert--dismissible {
    padding-right: $spacing-lg + $spacing-md;
    
    .llm-alert__close {
      position: absolute;
      right: $spacing-md;
      top: $spacing-md;
      background: none;
      border: none;
      font-size: $font-size-lg;
      cursor: pointer;
      opacity: 0.7;
      transition: $transition-base;
      
      &:hover {
        opacity: 1;
      }
    }
  }
}

// Alert header
.llm-alert__header {
  font-weight: $font-weight-semibold;
  margin-bottom: $spacing-xs;
}

// Alert content
.llm-alert__content {
  margin-bottom: $spacing-sm;
  
  &:last-child {
    margin-bottom: 0;
  }
}

// Alert actions
.llm-alert__actions {
  margin-top: $spacing-sm;
  display: flex;
  gap: $spacing-sm;
  align-items: center;
  
  .llm-btn {
    font-size: $font-size-sm;
    padding: $spacing-xs $spacing-sm;
  }
}

// Alert list
.llm-alert__list {
  margin: $spacing-sm 0 0 0;
  padding-left: $spacing-lg;
  
  li {
    margin-bottom: $spacing-xs;
    
    &:last-child {
      margin-bottom: 0;
    }
  }
}

// Alert group
.llm-alert-group {
  .llm-alert {
    margin-bottom: $spacing-sm;
    
    &:last-child {
      margin-bottom: 0;
    }
  }
}

// Alert utilities
.llm-alert--compact {
  padding: $spacing-sm;
  font-size: $font-size-sm;
}

.llm-alert--large {
  padding: $spacing-lg;
  font-size: $font-size-lg;
}

.llm-alert--bordered {
  border-width: 2px;
}

.llm-alert--rounded {
  border-radius: $border-radius-lg;
}

// Alert animations
.llm-alert--fade-in {
  animation: llm-alert-fade-in 0.3s ease-in-out;
}

.llm-alert--slide-in {
  animation: llm-alert-slide-in 0.3s ease-out;
}

@keyframes llm-alert-fade-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes llm-alert-slide-in {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
} 