@use '../../style/themes/default.scss' as *;
@use '../../style/util.scss' as *;
@use './css-var.scss' as *;

@include set-buttons-var($y);

/* 按钮容器 */
.y-buttons {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;

  &.is-nowrap {
    flex-wrap: nowrap;
  }

  &.is-gap {
    gap: yVar('buttons', 'gap');

    .y-buttons-item.y-buttons-btn {
      margin: 0;
    }
  }

  &.is-modal-footer {
    display: flex;
    justify-content: flex-end;
  }
}

/* 下拉箭头 */
.y-buttons-link .y-buttons-arrow {
  font-size: yVar('buttons', 'link-arrow-font-size');
  margin: yVar('buttons', 'link-arrow-margin');
  vertical-align: yVar('buttons', 'link-arrow-vertical-align');
}

.y-buttons-btn .y-buttons-arrow {
  font-size: yVar('buttons', 'btn-arrow-vertical-align');
  margin: yVar('buttons', 'btn-arrow-margin');
}

/* 带图标间距调整 */
.y-buttons-item {
  &.y-buttons-icon-link > .el-icon {
    font-size: yVar('buttons', 'link-icon-font-size');
    margin: yVar('buttons', 'link-icon-margin');
  }

  &.y-buttons-btn.y-buttons-icon-btn {
    padding-left: yVar('buttons', 'icon-btn-padding-left');
    padding-right: yVar('buttons', 'icon-btn-padding-right');

    & > .el-icon {
      margin: yVar('buttons', 'btn-icon-margin');
    }

    &.el-button--small {
      padding-left: yVar('buttons', 'icon-btn-sm-padding-left');
      padding-right: yVar('buttons', 'icon-btn-sm-padding-right');
    }

    &.el-button--large {
      padding-left: yVar('buttons', 'icon-btn-lg-padding-left');
      padding-right: yVar('buttons', 'icon-btn-lg-padding-right');
    }
  }
}