/* =================================

    Variables   
================================= */
/*
    Table of Contents


    * Typography ====

    * Font famliy 
    * Font Weights 
    * Sizes 
    * Heading Sizes
    * Breakpoints
    * Spacing

*/
/*=============================================
=            Gradients            =
=============================================*/
/*=============================================
=            Shadows            =
=============================================*/
/*=============================================
 =            Radius            =
 =============================================*/
/*=============================================
 =            Typography            =
 =============================================*/
/* Font Family */
/*=============================================
 =            Breakpoints            =
 =============================================*/
/*=====  End of Breakpoins  ======*/
/*=============================================
=            Updated Variables            =
=============================================*/
/* numbers */
/*=====  End of Updated Variables  ======*/
/* Move to rem */
/*=============================================
 =            Colors            =
 =============================================*/
/*=============================================
=            Primary            =

    * Primary color pallete is used on the all interactive elements, like CTA's,
     links, active states, inputs...
=============================================*/
/*=============================================
=            Secondary Colors            =
=============================================*/
/*=============================================
=            Tertiary Colors            =
=============================================*/
/*=============================================
=            Neutral Colors            =
=============================================*/
/*=============================================
=            Success Colors            =
=============================================*/
/* Button Success */
/*=============================================
=            Warnings Colors           =
=============================================*/
/* Button Warning */
/*=============================================
=            Information Colors            =
=============================================*/
/*=============================================
=            Error Colors            =
=============================================*/
/*=============================================
=            Grey Colors            =

Grey colors are most often used. These colors 
are used mostly for backgrounds, text, inputs, etc.
=============================================*/
/*=============================================
=            Text Colors - On Light Mode            =
These colors are used for text on the light mode.
=============================================*/
/*=============================================
=            Text Colors - On Dark Mode            =
These colors are used for text on the dark mode.
=============================================*/
/*=====  End of updated colors  ======*/
/* Utilties */
.ab-error-500 {
  color: #F04438;
}

/*=============================================
=            SEMANTIC TOKENS            =

    * Component-level tokens from the new design token set.
    * Values are literal on purpose: they mirror the exported
      JSON exactly. Swap them for primitive references
      (e.g. $background-primary: $primary;) if you prefer.
=============================================*/
/*=============================================
=            Backgrounds & Surfaces            =
=============================================*/
/*=============================================
=            Text - Semantic            =
=============================================*/
/*=============================================
=            Disabled States            =
=============================================*/
/*=============================================
=            Borders            =
=============================================*/
/*=============================================
=            Buttons            =
=============================================*/
/*=============================================
=            Chips            =
=============================================*/
/*=============================================
=            Links            =
=============================================*/
/*=============================================
=            Icons            =
=============================================*/
/*=============================================
=            Tags            =
=============================================*/
/*=============================================
=            Forms & Fields            =
=============================================*/
/*=============================================
=            Date Cells            =
=============================================*/
/*=============================================
=            Controls            =
=============================================*/
/*=============================================
=            Tables            =
=============================================*/
/*=============================================
=            Steppers            =
=============================================*/
/*=============================================
=            Tooltips            =
=============================================*/
/*=============================================
=            Charts & Progress            =
=============================================*/
/*=============================================
=            Alpha / Transparency            =
=============================================*/
/* =================================

    Variables   
================================= */
/*
    Table of Contents


    * Typography ====

    * Font famliy 
    * Font Weights 
    * Sizes 
    * Heading Sizes
    * Breakpoints
    * Spacing

*/
/*=============================================
=            Gradients            =
=============================================*/
/*=============================================
=            Shadows            =
=============================================*/
/*=============================================
 =            Radius            =
 =============================================*/
/*=============================================
 =            Typography            =
 =============================================*/
/* Font Family */
/*=============================================
 =            Breakpoints            =
 =============================================*/
/*=====  End of Breakpoins  ======*/
/*=============================================
=            Updated Variables            =
=============================================*/
/* numbers */
/*=====  End of Updated Variables  ======*/
/* Move to rem */
/*=============================================
=            SCSS Mixins                      =
=============================================*/
/**
  * Media Query Mixins
  */
/* respond to different screen sizes by min width */
/* respond to different screen sizes by max width */
/* respond to different screen sizes by min width */
/* respond to different screen sizes by max width */
/* respond to different screen sizes by min and max width */
/**
  * Shadow Mixin Variatons
  */
.ab-divider {
  height: 0.125rem;
  background: var(--ab-neutral-300, #D2D6DB);
}
.ab-divider.sm {
  height: 0.0625rem;
  width: 100%;
}
.ab-divider.lg {
  height: 0.1875rem;
  width: 100%;
}
.ab-divider.xl {
  height: 0.25rem;
  width: 100%;
}
.ab-divider--inset {
  background: var(--ab-neutral-300, #D2D6DB);
  width: 0.0625rem;
  height: 0.75rem;
}
