/* ============================================================
   utilities.css — 単機能ユーティリティ
   ※ margin 系は Bootstrap(.mt-1..5) と衝突しないよう px サフィックス。
   ============================================================ */

/* -------- Text align -------- */
.text-center { text-align: center; }
.text-left   { text-align: left; }
.text-right  { text-align: right; }

/* -------- Text color -------- */
.da-u-text-muted   { color: var(--da-text-muted); }
.da-u-text-strong  { color: var(--da-text-strong); }
.da-u-text-primary { color: var(--da-primary-600); }
.da-u-text-invert  { color: var(--da-text-invert); }

/* -------- Margin top -------- */
.mt-0  { margin-top: 0; }
.mt-8  { margin-top: var(--da-space-8); }
.mt-16 { margin-top: var(--da-space-16); }
.mt-24 { margin-top: var(--da-space-24); }
.mt-32 { margin-top: var(--da-space-32); }
.mt-48 { margin-top: var(--da-space-48); }
.mt-64 { margin-top: var(--da-space-64); }

/* -------- Margin bottom -------- */
.mb-0  { margin-bottom: 0; }
.mb-8  { margin-bottom: var(--da-space-8); }
.mb-16 { margin-bottom: var(--da-space-16); }
.mb-24 { margin-bottom: var(--da-space-24); }
.mb-32 { margin-bottom: var(--da-space-32); }
.mb-48 { margin-bottom: var(--da-space-48); }
.mb-64 { margin-bottom: var(--da-space-64); }

/* -------- Centering / width -------- */
.mx-auto     { margin-inline: auto; }
.da-u-w-full { width: 100%; }
.da-u-maxw-narrow { max-width: var(--da-container-narrow); margin-inline: auto; }

/* -------- Display -------- */
.da-u-block        { display: block; }
.da-u-inline-block { display: inline-block; }
.hidden            { display: none !important; }

/* 端末別の表示切替（自己完結の media query） */
@media (max-width: 767px) {
	.hidden-mobile { display: none !important; }   /* モバイルで隠す */
}
@media (min-width: 1024px) {
	.hidden-desktop { display: none !important; }  /* デスクトップで隠す */
}

/* -------- Accessibility: 視覚的に隠す（SR には読ませる） -------- */
.da-u-visually-hidden {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}
