@use '../utils/box-shadow_variables';
@use '../utils/color_variables';
@use '../utils/font_variables';
@use '../utils/size_variables';
@use '../core/box.scss';
@use '../helper-classes/general.scss';
@use '../helper-classes/spacing.scss';

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: BUSL-1.1
 */

.list-item-row {
  @extend .box;
  @extend .is-sideless;
  @extend .is-marginless;
  padding-left: 0;
  padding-right: 0;

  .ember-basic-dropdown-trigger {
    display: inline-block;
  }

  .center-inside-row {
    width: 50%;
    margin-left: auto;
    font-size: size_variables.$size-8;
    font-weight: font_variables.$font-weight-semibold;
    color: color_variables.$ui-gray-500;
  }

  .center-display {
    width: 50%;
    margin-left: auto;
    margin-right: auto;
  }

  &.is-disabled {
    opacity: 0.5;
  }
}

a.list-item-row,
.linked-block.list-item-row {
  transition:
    box-shadow size_variables.$speed,
    margin size_variables.$speed,
    padding size_variables.$speed;
  will-change: box-shadow, margin, padding;

  &:hover,
  &:focus,
  &:active {
    margin-left: #{-(size_variables.$spacing-10)} !important;
    margin-right: #{-(size_variables.$spacing-10)} !important;
    padding-left: size_variables.$spacing-10;
    padding-right: size_variables.$spacing-10;
    position: relative;
    box-shadow:
      0 2px 0 -1px color_variables.$grey-light,
      0 -2px 0 -1px color_variables.$grey-light,
      box-shadow_variables.$box-link-hover-shadow,
      box-shadow_variables.$box-shadow-middle;
  }

  &.no-destination {
    cursor: default;
  }
}