/** ------------------------------------------------------ **/
/** ///////////////////// BORDERS ///////////////////// **/
/** ------------------------------------------------------ **/

/* Root values are handled in the tokens.css file */

  /** ------------------------------------------------------- **/
  /** /////////////////////// CLASSES /////////////////////// **/
  /** ------------------------------------------------------- **/

  /* Borders  .................................... */
  /* These classes use a single border color. May need to reconfigure so that color can be changed for a particualr use case. */

  .border-none {
    border-width: var(--borders__stroke__none);
    border-color: var(--color__primary__color2);
    border-style: solid;
  }
  .border-sm {
    border-width: var(--borders__stroke__S);
    border-color: var(--color__primary__color2);
    border-style: solid;
  }
  .border-md {
    border-width: var(--borders__stroke__M);
    border-color: var(--color__primary__color2);
    border-style: solid;
  }
  .border-lg {
    border-width: var(--borders__stroke__L);
    border-color: var(--color__primary__color2);
    border-style: solid;
  }
  .border-xl {
    border-width: var(--borders__stroke__XL);
    border-color: var(--color__primary__color2);
    border-style: solid;
  }

/* border color */
.border-color1 {
	border-color: var(--color__primary__color1);
}
.border-color2 {
	border-color: var(--color__primary__color2);
}
.border-color3 {
	border-color: var(--color__primary__color3);
}
.border-grey900 {
	border-color: var(--color__functional__grey900);
}
.border-grey500 {
	border-color: var(--color__functional__grey500);
}
.border-grey300 {
	border-color: var(--color__functional__grey300);
}
.border-grey100 {
	border-color: var(--color__functional__grey100);
}
.border-white {
	border-color: var(--color__functional__white);
}