/* ==========================================================================
   YAZHI — UTILITIES
   ========================================================================== */

.mt-0 { margin-top: 0; } .mb-0 { margin-bottom: 0; }
.mt-xs { margin-top: var(--space-xs); } .mb-xs { margin-bottom: var(--space-xs); }
.mt-sm { margin-top: var(--space-sm); } .mb-sm { margin-bottom: var(--space-sm); }
.mt-md { margin-top: var(--space-md); } .mb-md { margin-bottom: var(--space-md); }
.mt-lg { margin-top: var(--space-lg); } .mb-lg { margin-bottom: var(--space-lg); }

.text-center { text-align: center; }
.text-left { text-align: left; }
.hidden { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

.visually-hide-until-md { display: none; }
@media (min-width: 768px) { .visually-hide-until-md { display: block; } }
.hide-from-md { display: block; }
@media (min-width: 768px) { .hide-from-md { display: none; } }

.rounded { border-radius: var(--radius-md); }
.shadow { box-shadow: var(--shadow-md); }

.demo-flag {
    display: inline-block;
    font-size: 0.62rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    background: var(--yazhi-light-gold);
    color: var(--yazhi-deep-burgundy);
    padding: 0.15em 0.55em;
    border-radius: var(--radius-pill);
    font-weight: 700;
    vertical-align: middle;
}

.pagination { display: flex; flex-wrap: wrap; gap: 0.4em; justify-content: center; margin-top: var(--space-lg); }
.pagination a, .pagination span {
    min-width: 40px; height: 40px;
    display: inline-flex; align-items: center; justify-content: center;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    text-decoration: none;
    color: var(--color-text);
    font-size: var(--fs-sm);
    padding-inline: 0.6em;
}
.pagination a:hover { border-color: var(--yazhi-burgundy); color: var(--yazhi-burgundy); }
.pagination .current { background: var(--yazhi-burgundy); border-color: var(--yazhi-burgundy); color: var(--yazhi-ivory); }
