/* ============================================
   UTILITIES.CSS - PUNKROCK GADGETS
   ============================================ */

/* ==== FONT ==== */
.font-mono {
    font-family: var(--font-mono);
    color: var(--text-muted);
    font-size: 1rem;
    line-height: 1.4;
    text-align: left;
}

/* ==== TEXT COLORS ==== */
.text-primary {
    color: var(--text-primary);
}

/* pink */
.accent-1 {
    color: var(--accent-primary);
}

/* green */
.accent-2 {
    color: var(--accent-secondary);
}

/* yellow */
.accent-3 {
    color: var(--accent-tertiary);
}

/* orange */
.accent-4 {
    color: var(--accent-quaternary);
}

/* cyan */
.accent-5 {
    color: var(--accent-quinary);
}


/* ==== BG COLORS ==== */
.bg-primary {
    background: var(--bg-primary);
}

.bg-secondary {
    background: var(--bg-secondary);
}

.bg-tertiary {
    background: var(--bg-tertiary);
}

/* ==== ALIGNMENTS ==== */
.left {
    text-align: left;
}

/* ==== PADDING ==== */
.pt-xl {
    padding-top: 2rem;
}

.pt-xxl {
    padding-top: 3rem;
}

/* ==== MARGIN ==== */
.mt-xl {
    margin-top: 2rem;
}

.mt-xxl {
    margin-top: 3rem;
}