@import '~@/uni_modules/lime-style/index.scss';

/* #ifdef  uniVersion >= 4.75 */ 
$use-css-var: true;
/* #endif */

$badge-size: create-var(badge-size , $spacer);
$badge-color: create-var(badge-color , white);
// $badge-padding: create-var(badge-padding, 0 4px);
$badge-padding-x: create-var(badge-padding-x, $spacer-tn); // 水平方向（左右）
$badge-padding-y: create-var(badge-padding-y, 0);    // 垂直方向（上下）

$badge-font-size: create-var(badge-font-size, $font-size-sm);
$badge-font-weight: create-var(badge-font-weight, bold);
$badge-border-width: create-var(badge-border-width, 1rpx);
$badge-border-color: create-var(badge-border-color, white);
$badge-bg-color: create-var(badge-bg-color, $error-color);
$badge-dot-color: create-var(badge-dot-color, $error-color);
$badge-dot-size: create-var(badge-dot-size, 8px);
$badge-font: create-var(badge-font, -apple-system-font, helvetica neue, arial, sans-serif);
$badge-border-radius: create-var(badge-border-radius, $border-radius-hg);



.l-badge {
  /* #ifndef UNI-APP-X */
  display: inline-block;
  /* #endif */ 

  /* #ifndef APP-ANDROID || APP-IOS || APP-HARMONY */
  min-width: $badge-size;
  /* #endif */ 
  box-sizing: border-box;
	
  // padding: $badge-padding;
  @include padding($badge-padding-y $badge-padding-x);
  // box-sizing: content-box;
  color: $badge-color;
  font-weight: $badge-font-weight;
  font-size: $badge-font-size;
  font-family: $badge-font;
  line-height: 1.2;
  white-space: nowrap;
  text-align: center;
  background-color: $badge-bg-color;
  // border: $badge-border-width solid $badge-border-color;
  border-width: $badge-border-width;
  border-style: solid;
  border-color: $badge-border-color;
  // border-radius: $badge-border-radius;
  @include border-radius($badge-border-radius);
  overflow: visible;
  
 
  &--fixed {
    position: absolute;
    transform-origin: 100%;
	z-index: 1
  }
  &--offscreen {
	  position: fixed !important;
	  opacity: 0;
  }	
  
  &--top-left {
    top: 0;
    left: 0;
    transform: translate(-50%, -50%);
  }

  &--top-right {
    top: 0;
    right: 0;
    transform: translate(50%, -50%);
  }

  &--bottom-left {
    bottom: 0;
    left: 0;
    transform: translate(-50%, 50%);
  }

  &--bottom-right {
    bottom: 0;
    right: 0;
    transform: translate(50%, 50%);
  }

  &--dot {
    width: $badge-dot-size;
    min-width: 0;
    height: $badge-dot-size;
    background: $badge-dot-color;
    border-radius: 99px;
    // border: none;
	border-width: 0;
    padding: 0;
	overflow: visible;
  }

  &__wrapper {
    position: relative;
	overflow: visible;
	
	/* #ifndef UNI-APP-X */
	display: inline-block;
	/* #endif */
	/* #ifdef UNI-APP-X */
	// align-self: flex-start;
	/* #endif */
  }
}