/*==========================================================
  Clunky Design System (CDS) v1.0
  utilities.css
  Status: Evolving
==========================================================*/


/*==========================================================
SECTION 01
Spacing
==========================================================*/

.mt-0{margin-top:0;}
.mt-1{margin-top:var(--space-1);}
.mt-2{margin-top:var(--space-2);}
.mt-4{margin-top:var(--space-4);}
.mt-6{margin-top:var(--space-6);}
.mt-8{margin-top:var(--space-8);}

.mb-0{margin-bottom:0;}
.mb-2{margin-bottom:var(--space-2);}
.mb-4{margin-bottom:var(--space-4);}
.mb-6{margin-bottom:var(--space-6);}
.mb-8{margin-bottom:var(--space-8);}


/*==========================================================
SECTION 02
Text Alignment
==========================================================*/

.text-left{text-align:left;}
.text-center{text-align:center;}
.text-right{text-align:right;}


/*==========================================================
SECTION 03
Font Weight
==========================================================*/

.fw-normal{font-weight:var(--fw-normal);}
.fw-medium{font-weight:var(--fw-medium);}
.fw-semibold{font-weight:var(--fw-semibold);}
.fw-bold{font-weight:var(--fw-bold);}


/*==========================================================
SECTION 04
Colors
==========================================================*/

.text-primary{color:var(--color-primary);}
.text-muted{color:var(--color-text-muted);}
.text-success{color:var(--color-success);}
.text-warning{color:var(--color-warning);}
.text-danger{color:var(--color-danger);}


/*==========================================================
SECTION 05
Backgrounds
==========================================================*/

.bg-surface{background:var(--color-surface);}
.bg-alt{background:var(--color-bg-alt);}


/*==========================================================
SECTION 06
Display
==========================================================*/

.hidden{display:none;}

.block{display:block;}

.inline{display:inline;}

.inline-block{display:inline-block;}


/*==========================================================
SECTION 07
Width
==========================================================*/

.w-100{
width:100%;
}


/*==========================================================
SECTION 08
Border Radius
==========================================================*/

.rounded{
border-radius:var(--radius-md);
}

.rounded-lg{
border-radius:var(--radius-lg);
}


/*==========================================================
SECTION 09
Shadow
==========================================================*/

.shadow-sm{
box-shadow:var(--shadow-sm);
}

.shadow{
box-shadow:var(--shadow-md);
}

.shadow-lg{
box-shadow:var(--shadow-lg);
}


/*==========================================================
SECTION 10
Future additions start here
==========================================================*/