@import 'var';
@import 'mixin';

@mixin shadow-0 {
  border-radius: use-var(border-radius-m);
  background-color: use-rgb(n-10);
}

@mixin shadow-2 {
  border-radius: use-var(border-radius-m);
  background-color: use-rgb(n-10);
  box-shadow: 0 0 2px 0 use-rgba(origin-shadow, 0.24);
}

@mixin shadow-8 {
  border-radius: use-var(border-radius-m);
  background-color: use-rgb(n-10);
  box-shadow: 0 2px 8px 0 use-rgba(origin-shadow, 0.16);
}

@mixin shadow-16 {
  border-radius: use-var(border-radius-m);
  background-color: use-rgb(n-10);
  box-shadow: 0 4px 16px 0 use-rgba(origin-shadow, 0.16);
}

@mixin zh-form-label-width($parent) {
  #{$parent} .aui-form-item .aui-form-item__label-wrapper {
    width: 114px;
  }
}

@mixin en-form-label-width($parent) {
  #{$parent} .aui-form-item .aui-form-item__label-wrapper {
    width: 144px;
  }
}

@mixin table-placeholder($className) {
  #{$className} {
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: $table-cell-padding-v $table-cell-padding-h;
    min-height: $table-row-min-height + 2px;
    @include text-set(m, placeholder);

    background-color: use-rgb(n-10);
    border: solid 1px use-rgb(n-8);
    border-radius: use-var(border-radius-l);

    // fixed placeholder to avoid horizontal scrolling
    position: sticky;
    left: 0;

    > aui-icon:first-child {
      margin-right: use-var(spacing-m);
    }
  }

  .aui-table .aui-table__row + #{$className} {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
  }
}