/**
 * core/utilities.css — 레이아웃 헬퍼 및 공통 유틸리티 클래스
 */

/* ── 그리드 ──────────────────────────────────────── */
.grid-3-col {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
}

.grid-4-col {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
}

/* ── 텍스트 정렬 ─────────────────────────────────── */
.text-center { text-align: center; }
.text-right  { text-align: right; }

/* ── 너비 ────────────────────────────────────────── */
.w-full { width: 100%; }

/* ── 마진 ────────────────────────────────────────── */
.m-0    { margin: 0; }
.m-b-4  { margin-bottom: 4px; }
.m-b-10 { margin-bottom: 10px; }
.m-b-20 { margin-bottom: 20px; }
.m-b-24 { margin-bottom: 24px; }
.m-t-10 { margin-top: 10px; }
.m-r-10 { margin-right: 10px; }

/* ── 폰트 ────────────────────────────────────────── */
.font-14   { font-size: 14px; }
.font-16   { font-size: 16px; }
.font-24   { font-size: 24px; }
.font-bold { font-weight: bold; }

/* ── 플렉스 유틸 ─────────────────────────────────── */
.flex-1        { flex: 1; }
.flex-v-center { display: flex; align-items: center; }
.line-height-14 { line-height: 1.4; }

/* ── 로딩 텍스트 ─────────────────────────────────── */
.loading-text {
    text-align: center;
    color: var(--text-muted);
    font-size: 12px;
    padding: 10px;
}

.loading-text--muted {
    text-align: center;
    color: #ccc;
    font-size: 12px;
    padding: 20px 0;
}