/* ============================================
   Utilities - Helper Classes
   ============================================ */

/* Text Alignment */
.text-center { text-align: center; }

/* ===== MARGINS ===== */
.mt-0 { margin-top: 0 !important; }
.mt-1 { margin-top: 0.5rem; }
.mt-2 { margin-top: 1rem; }
.mt-3 { margin-top: 1.5rem; }
.mt-4 { margin-top: 2rem; }

.mb-0 { margin-bottom: 0 !important; }
.mb-1 { margin-bottom: 0.5rem; }
.mb-2 { margin-bottom: 1rem; }
.mb-3 { margin-bottom: 1.5rem; }
.mb-4 { margin-bottom: 2rem; }

/* Margin start (left) */
.ms-1 { margin-left: 0.25rem; }
.ms-2 { margin-left: 0.5rem; }
.ms-3 { margin-left: 1rem; }
.ms-4 { margin-left: 1.5rem; }

/* Margin end (right) */
.me-1 { margin-right: 0.25rem; }
.me-2 { margin-right: 0.5rem; }
.me-3 { margin-right: 1rem; }
.me-4 { margin-right: 1.5rem; }

/* ===== PADDING ===== */
.p-0 { padding: 0 !important; }
.p-1 { padding: 0.5rem; }
.p-2 { padding: 1rem; }
.p-3 { padding: 1.5rem; }
.p-4 { padding: 2rem; }

/* Padding Y axis */
.py-0 { padding-top: 0 !important; padding-bottom: 0 !important; }
.py-1 { padding-top: 0.25rem;  padding-bottom: 0.25rem; }
.py-2 { padding-top: 0.5rem;   padding-bottom: 0.5rem; }
.py-3 { padding-top: 1rem;     padding-bottom: 1rem; }
.py-4 { padding-top: 1.5rem;   padding-bottom: 1.5rem; }
.py-5 { padding-top: 2rem;     padding-bottom: 2rem; }

/* Padding X axis */
.px-0 { padding-left: 0 !important; padding-right: 0 !important; }
.px-1 { padding-left: 0.25rem;  padding-right: 0.25rem; }
.px-2 { padding-left: 0.5rem;   padding-right: 0.5rem; }
.px-3 { padding-left: 1rem;     padding-right: 1rem; }
.px-4 { padding-left: 1.5rem;   padding-right: 1.5rem; }

/* ===== DISPLAY ===== */
.d-none         { display: none !important; }
.d-inline       { display: inline; }
.d-inline-block { display: inline-block; }
.d-block        { display: block; }
.d-flex         { display: flex; }

/* ===== FLEX UTILITIES ===== */
.flex-wrap     { flex-wrap: wrap; }
.flex-nowrap   { flex-wrap: nowrap; }
.flex-column   { flex-direction: column; }
.flex-row      { flex-direction: row; }
.flex-fill     { flex: 1 1 auto; }
.flex-shrink-0 { flex-shrink: 0; }

/* Gap */
.gap-1 { gap: 0.25rem; }
.gap-2 { gap: 0.5rem; }
.gap-3 { gap: 1rem; }
.gap-4 { gap: 1.5rem; }
.gap-5 { gap: 2rem; }

/* Justify content */
.justify-content-start   { justify-content: flex-start; }
.justify-content-end     { justify-content: flex-end; }
.justify-content-center  { justify-content: center; }
.justify-content-between { justify-content: space-between; }
.justify-content-around  { justify-content: space-around; }

/* Align items */
.align-items-start   { align-items: flex-start; }
.align-items-center  { align-items: center; }
.align-items-end     { align-items: flex-end; }
.align-items-stretch { align-items: stretch; }
.align-self-center   { align-self: center; }

/* ===== SIZING ===== */
.w-100 { width: 100%; }
.h-100 { height: 100%; }

/* ===== TEXT ===== */
.text-nowrap  { white-space: nowrap; }
.text-xs      { font-size: .8rem; }
.text-muted   { color: var(--text-secondary); }
.small        { font-size: 0.875em; }

/* Font weight */
.fw-medium   { font-weight: var(--font-medium, 500); }
.fw-semibold { font-weight: var(--font-semibold, 600); }
.fw-bold     { font-weight: var(--font-bold, 700); }

