@use "../../../variables/index" as *;

@use "../../mixins/vendor-prefixes";


/**
 * c8y role card - Component styles
 *
 * Note: Uses $size-* tokens for spacing where applicable.
 *
 * Intentionally hardcoded values:
 * - Component-specific dimensions: Fixed sizes for component layout
 * - Off-grid spacing: Component-specific positioning
 * - Border widths (1px, 2px, 3px): Standard borders
 * - Font-sizes: Typography
 * - Percentages: Layout
 */
.role-card {
  position: relative;
  padding-bottom: $size-40;

  @include vendor-prefixes.transition(all 0.25s ease-in-out);
  &:hover {
    z-index: 1;
    box-shadow: 0 $size-20 15px rgba(0, 0, 0, 0.1);
    transform: scale(1.05);
  }
  h4 {
    margin: 0;
    letter-spacing: -0.03em;
    font-weight: 200;
  }
  .card-actions {
    position: absolute;
    top: 0;
    right: 0;
  }
  // Removed unused positioning utility - verified 0 usages: .bottom-right-info
}

.card-row-add-remove {
  position: relative;
  margin-right: 80px;
  margin-bottom: 1px;
  padding: $size-10 $component-padding;
  min-height: 54px;
  background-color: $component-background-default;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  label {
    margin-bottom: 0;
  }
  .add-remove-btns {
    position: absolute;
    top: 0;
    left: 100%;
    min-width: 80px;
  }
  // Removed unused button selectors - verified 0 usages: .btn-add, .btn-remove
  @media (min-width: $grid-float-breakpoint) {
    .form-group + .form-group {
      margin-left: $size-10;
    }
    .add-remove-btns {
      top: $size-10;
      display: flex;
    }
  }
}
