.hidden {
    display: none;
}

/* --- Flexbox Basics --- */
.flex {
    display: flex;
}
.inline-flex {
    display: inline-flex;
}
.flex-col {
    flex-direction: column;
}
.flex-col-reverse {
    flex-direction: column-reverse;
}
.flex-row {
    flex-direction: row;
}
.flex-row-reverse {
    flex-direction: row-reverse;
}

/* --- Wrap & Grow --- */
.flex-wrap {
    flex-wrap: wrap;
}
.flex-nowrap {
    flex-wrap: nowrap;
}
.flex-1 {
    flex: 1 1 0%;
}
.flex-auto {
    flex: 1 1 auto;
}
.flex-none {
    flex: none;
}
.grow {
    flex-grow: 1;
}
.shrink {
    flex-shrink: 1;
}
.shrink-0 {
    flex-shrink: 0;
}

/* --- Alignment --- */
.justify-start {
    justify-content: flex-start;
}
.justify-center {
    justify-content: center;
}
.justify-end {
    justify-content: flex-end;
}
.justify-between {
    justify-content: space-between;
}
.justify-around {
    justify-content: space-around;
}

.items-start {
    align-items: flex-start;
}
.items-center {
    align-items: center;
}
.items-end {
    align-items: flex-end;
}
.items-baseline {
    align-items: baseline;
}
.items-stretch {
    align-items: stretch;
}

/* --- Gap --- */
.gap-x-30 {
    column-gap: 30px;
}
.gap-y-30 {
    row-gap: 30px;
}

/* --- Widths & Heights --- */
.w-full {
    width: 100%;
}
.w-auto {
    width: auto;
}
.w-screen {
    width: 100vw;
}
.w-min {
    width: min-content;
}
.w-max {
    width: max-content;
}
.w-fit {
    width: fit-content;
}
.h-full {
    height: 100%;
}
.h-screen {
    height: 100vh;
}
.h-min {
    height: min-content;
}
.min-w-0 {
    min-width: 0px;
}
.min-w-full {
    min-width: 100%;
}
.min-w-min {
    min-width: min-content;
}
.min-w-max {
    min-width: max-content;
}
.min-w-fit {
    min-width: fit-content;
}
.max-w-none {
    max-width: none;
}
.max-w-full {
    max-width: 100%;
}
.max-w-fit {
    max-width: fit-content;
}

/* --- Positions --- */
.static {
    position: static;
}
.fixed {
    position: fixed;
}
.absolute {
    position: absolute;
}
.relative {
    position: relative;
}
.sticky {
    position: sticky;
}

/* --- Typography --- */
.font-thin {
    font-weight: 100;
}
.font-extralight {
    font-weight: 200;
}
.font-light {
    font-weight: 300;
}
.font-normal {
    font-weight: 400;
}
.font-medium {
    font-weight: 500;
}
.font-semibold {
    font-weight: 600;
}
.font-bold {
    font-weight: 700;
}
.font-extrabold {
    font-weight: 800;
}
.font-black {
    font-weight: 900;
}

.uppercase {
    text-transform: uppercase;
}
.lowercase {
    text-transform: lowercase;
}
.capitalize {
    text-transform: capitalize;
}
.normal-case {
    text-transform: none;
}

.text-left {
    text-align: left;
}
.text-center {
    text-align: center;
}
.text-right {
    text-align: right;
}
.text-justify {
    text-align: justify;
}
.text-start {
    text-align: start;
}
.text-end {
    text-align: end;
}

/* --- Spacing --- */
.m-0 {
    margin: 0;
}