/**
 * Utility classes — minimal, not a full framework.
 */

/* ── Display ── */
.zt-hidden { display: none !important; }
.zt-block  { display: block; }
.zt-flex   { display: flex; }
.zt-grid   { display: grid; }
.zt-inline { display: inline; }

/* ── Flexbox ── */
.zt-flex-center     { display: flex; align-items: center; justify-content: center; }
.zt-flex-between    { display: flex; align-items: center; justify-content: space-between; }
.zt-flex-col        { flex-direction: column; }
.zt-flex-wrap       { flex-wrap: wrap; }
.zt-items-center    { align-items: center; }
.zt-items-start     { align-items: flex-start; }
.zt-justify-center  { justify-content: center; }
.zt-justify-between { justify-content: space-between; }

/* ── Spacing ── */
.zt-mt-0  { margin-top: 0; }
.zt-mt-sm { margin-top: var(--zb-space-sm); }
.zt-mt-md { margin-top: var(--zb-space-md); }
.zt-mt-lg { margin-top: var(--zb-space-lg); }
.zt-mt-xl { margin-top: var(--zb-space-xl); }

.zt-mb-0  { margin-bottom: 0; }
.zt-mb-sm { margin-bottom: var(--zb-space-sm); }
.zt-mb-md { margin-bottom: var(--zb-space-md); }
.zt-mb-lg { margin-bottom: var(--zb-space-lg); }
.zt-mb-xl { margin-bottom: var(--zb-space-xl); }

.zt-py-sm { padding-block: var(--zb-space-sm); }
.zt-py-md { padding-block: var(--zb-space-md); }
.zt-py-lg { padding-block: var(--zb-space-lg); }
.zt-py-xl { padding-block: var(--zb-space-xl); }

.zt-px-sm { padding-inline: var(--zb-space-sm); }
.zt-px-md { padding-inline: var(--zb-space-md); }
.zt-px-lg { padding-inline: var(--zb-space-lg); }

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

.zt-text-sm   { font-size: 0.875rem; }
.zt-text-base { font-size: 1rem; }
.zt-text-lg   { font-size: 1.125rem; }
.zt-text-xl   { font-size: 1.25rem; }
.zt-text-2xl  { font-size: 1.5rem; }

.zt-font-normal { font-weight: 400; }
.zt-font-medium { font-weight: 500; }
.zt-font-bold   { font-weight: 700; }

.zt-text-muted { color: var(--zb-text-light); }

.zt-uppercase {
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

/* ── Colors ── */
.zt-text-primary   { color: var(--zb-primary); }
.zt-text-secondary { color: var(--zb-secondary); }
.zt-text-accent    { color: var(--zb-accent); }

.zt-bg-alt       { background-color: var(--zb-bg-alt); }
.zt-bg-primary   { background-color: var(--zb-primary); color: #fff; }
.zt-bg-secondary { background-color: var(--zb-secondary); color: #fff; }
.zt-bg-dark      { background-color: var(--zb-heading); color: #fff; }

/* ── Width ── */
.zt-w-full { width: 100%; }
.zt-max-w-narrow { max-width: 640px; }
.zt-max-w-medium { max-width: 800px; }

/* ── Border ── */
.zt-border     { border: 1px solid var(--zb-border); }
.zt-border-top { border-top: 1px solid var(--zb-border); }
.zt-rounded    { border-radius: 8px; }
.zt-rounded-sm { border-radius: 4px; }

/* ── Shadow ── */
.zt-shadow-sm { box-shadow: var(--zb-shadow-sm); }
.zt-shadow-md { box-shadow: var(--zb-shadow-md); }
.zt-shadow-lg { box-shadow: var(--zb-shadow-lg); }

/* ── Gap ── */
.zt-gap-sm { gap: var(--zb-space-sm); }
.zt-gap-md { gap: var(--zb-space-md); }
.zt-gap-lg { gap: var(--zb-space-lg); }
.zt-gap-xl { gap: var(--zb-space-xl); }

/* ── Responsive Visibility ── */
@media (max-width: 767px) {
  .zt-hide-mobile { display: none !important; }
}

@media (min-width: 768px) and (max-width: 1023px) {
  .zt-hide-tablet { display: none !important; }
}

@media (min-width: 1024px) {
  .zt-hide-desktop { display: none !important; }
}