$title-line-height-medium: var(--wds-card-gallery-item-title-font-line-height-medium, var(--wds-font-line-height-body-medium, 24px));
$action-button-size: var(--wds-card-gallery-item-action-button-size, var(--wds-space-950, 38px));
$action-button-border-radius: var(--wds-card-gallery-item-action-button-border-radius, var(--wds-border-radius-400, 8px));
$action-button-padding-vertical: var(--wds-card-gallery-item-action-button-padding-vertical, var(--wds-space-200, 8px));
$action-button-padding-horizontal: var(--wds-card-gallery-item-action-button-padding-horizontal, var(--wds-space-500, 20px));
$action-button-font-size: var(--wds-card-gallery-item-action-button-font-size, var(--wds-font-size-body-small, 14px));
$action-button-line-height: var(--wds-card-gallery-item-action-button-line-height, var(--wds-font-line-height-body-small, 20px));
$padding-vertical-medium: var(--wds-card-gallery-item-padding-vertical-medium, var(--wds-space-475, 18px));
$padding-vertical-small: var(--wds-card-gallery-item-padding-vertical-small, var(--wds-space-400, 16px));
$padding-right-medium: var(--wds-card-gallery-item-padding-right-medium, var(--wds-space-600, 24px));
$padding-right-small: var(--wds-card-gallery-item-padding-right-small, var(--wds-space-475, 18px));
$padding-left-medium: var(--wds-card-gallery-item-padding-left-medium, var(--wds-space-475, 18px));
$padding-left-small: var(--wds-card-gallery-item-padding-left-small, var(--wds-space-300, 12px));

.card-gallery-item {
  &#{&}--show-actions &__action-button {
    height: $action-button-size;
    border-radius: $action-button-border-radius;
    padding: $action-button-padding-vertical $action-button-padding-horizontal;
    font-size: $action-button-font-size;
    line-height: $action-button-line-height;
  }

  & &__bottom-actions {
    padding: 0 $padding-right-medium $padding-right-medium;
  }

  &:not(&--with-footer) &__bottom-actions {
    padding-top: $padding-right-medium;
  }

  &#{&}--size-small &__bottom-actions {
    padding: 0 $padding-right-small $padding-right-small;
  }

  &#{&}--size-small:not(&--with-footer) &__bottom-actions {
    padding-top: $padding-right-small;
  }

  & &__footer {
    padding: $padding-vertical-medium $padding-right-medium;
  }

  &#{&}--size-medium#{&}--draggable &__footer {
    padding: $padding-vertical-medium $padding-right-medium $padding-vertical-medium $padding-left-medium;
  }

  &#{&}--size-small &__footer {
    padding: $padding-vertical-small $padding-right-small;
  }

  &#{&}--size-small#{&}--draggable &__footer {
    padding: $padding-vertical-small $padding-right-small $padding-vertical-small $padding-left-small;
  }

  &#{&}--size-medium &__title-heading#{&}__title-heading {
    line-height: $title-line-height-medium;
  }

  &#{&}--size-medium &__title-text#{&}__title-text {
    line-height: $title-line-height-medium;
  }
}