@use "../config";
@use "../utils/fixes";
@use "../utils/generators";

.border {
  border-color: currentcolor;
  border-style: solid;
  border-width: 1px;
}

.border-t {
  @extend .border;
  border-bottom: none;
  border-left: none;
  border-right: none;
}

.border-b {
  @extend .border;
  border-top: none;
  border-left: none;
  border-right: none;
}

.border-l {
  @extend .border;
  border-bottom: none;
  border-top: none;
  border-right: none;
}

.border-r {
  @extend .border;
  border-bottom: none;
  border-top: none;
  border-left: none;
}

.border-x {
  @extend .border;
  border-bottom: none;
  border-top: none;
}

.border-y {
  @extend .border;
  border-left: none;
  border-right: none;
}

@include generators.utility-class-generator('border', 'border-width', config.$border-sizes, 'px', '');
@include generators.utility-class-generator('border', 'border-style', ('solid', 'dashed', 'dotted'), '', '', false, false);
@include generators.utility-class-generator('border-', 'border', (0), '', '', config.$orientations);

.round {
  border-radius: 50%;
  overflow: hidden;
}

[class*='rounded-'] {
  overflow: hidden;
}

.rounded-fix {
  @include fixes.rounded-container-fix; //FYI: rounded fix is for fixing images only, if enabled on rounded block with shadow it will disable the shadow.
}

@include generators.utility-class-generator('rounded', 'border-radius', config.$border-radiuses, 'px', '', false, false);

.rounded-tl-0 {
  border-top-left-radius: 0;
}

.rounded-tr-0 {
  border-top-right-radius: 0;
}

.rounded-t-0 {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

.rounded-r-0 {
  border-bottom-right-radius: 0;
  border-top-right-radius: 0;
}

.rounded-bl-0 {
  border-bottom-left-radius: 0;
}

.rounded-br-0 {
  border-bottom-right-radius: 0;
}

.rounded-b-0 {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.rounded-l-0 {
  border-bottom-left-radius: 0;
  border-top-left-radius: 0;
}
