@use 'var' as var;
@use 'mixin' as mixin;

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

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

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

@mixin shadow-16 {
  border-radius: var.use-var(border-radius-m);
  background-color: var.use-rgb(n-10);
  box-shadow: 0 4px 16px 0 var.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: var.$table-cell-padding-v var.$table-cell-padding-h;
    min-height: var.$table-row-min-height + 2px;
    background-color: var.use-rgb(n-10);
    border: solid 1px var.use-rgb(n-8);
    border-radius: var.use-var(border-radius-l);
    // fixed placeholder to avoid horizontal scrolling
    position: sticky;
    left: 0;
    @include mixin.text-set(m, placeholder);

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

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