/* weight */
.font-medium{
    font-weight: var(--font-weight-medium);
}

.font-bold{
    font-weight: var(--font-weight-bold);
    font-family: sans-serif;
}
.font-mono {
    font-family: var(--font-mono);
}

/* Text color */
.text-green-600{
    color: var(--color-green-600);
}

.text-red-500{
    color: var(--color-red-500);
}

.text-white{
    color: var(--white);
}

.text-gray-400{
    color: var(--color-gray-400);
}

.text-gray-600{
    color: var(--color-gray-600);
}

.text-gray-800{
    color: var(--color-gray-800);
}

.text-gray-900{
    color: var(--color-gray-900);
}

.text-white{
    color: var(--white);
}

.text-black {
    color: black;
}

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

/* Bg color */
.bg-gray-50{
    background-color: var(--color-gray-50);
}

.bg-gray-100{
    background-color: var(--color-gray-100);
}

.bg-gray-400{
    background-color: var(--color-gray-400);
}

.bg-gray-800{
    background-color: var(--color-gray-800);
}

.bg-green-100{
    background-color: var(--color-green-100);
}

.bg-green-500{
    background-color: var(--color-green-500);
}

.bg-green-600{
    background-color: var(--color-green-600);
}

.bg-blue-600{
    background-color: var(--color-blue-600);
}

.bg-red-500{
    background-color: var(--color-red-500);
}

.bg-red-100{
    background-color: var(--color-red-100);
}

.bg-zinc-800 {
    background-color: var(--color-zinc-800);
}

.bg-white\/30{
    background-color: rgba(255, 255, 255, 0.3);
}

.bg-transparent{
    background-color: transparent;
}

/* font size */
.text-xs{
    font-size: var(--text-xs);
    line-height: var(--text-xs--line-height);
}

.text-xl {
    font-size: calc(var(--spacing) * 5);
}

.text-2xl{
    font-size: var(--text-2xl);
}

.text-sm{
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
}

.text-font{
    font-family: sans-serif;
}

.font-mono{
    font-family: var(--font-mono);
}

.overflow-hidden{
    overflow: hidden;
}

.overflow-y-auto{
    overflow-y: auto;
}

/* blur */
.backdrop-blur-sm{
    --tw-backdrop-blur: blur(var(--blur-sm));
    backdrop-filter: var(--tw-backdrop-blur);
}