/* ==========================================================================
   Shondalai Template - Utility Classes
   ========================================================================== */

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

/* ── Flex ── */
.sh-flex-row    { flex-direction: row; }
.sh-flex-col    { flex-direction: column; }
.sh-flex-wrap   { flex-wrap: wrap; }
.sh-flex-1      { flex: 1 1 0%; }
.sh-flex-auto   { flex: 1 1 auto; }
.sh-flex-none   { flex: none; }
.sh-flex-shrink-0 { flex-shrink: 0; }

/* ── Alignment ── */
.sh-items-start   { align-items: flex-start; }
.sh-items-center  { align-items: center; }
.sh-items-end     { align-items: flex-end; }
.sh-items-stretch { align-items: stretch; }

.sh-justify-start   { justify-content: flex-start; }
.sh-justify-center  { justify-content: center; }
.sh-justify-end     { justify-content: flex-end; }
.sh-justify-between { justify-content: space-between; }

.sh-self-start  { align-self: flex-start; }
.sh-self-center { align-self: center; }
.sh-self-end    { align-self: flex-end; }

/* ── Gap ── */
.sh-gap-0   { gap: 0; }
.sh-gap-1   { gap: var(--sh-space-1); }
.sh-gap-2   { gap: var(--sh-space-2); }
.sh-gap-3   { gap: var(--sh-space-3); }
.sh-gap-4   { gap: var(--sh-space-4); }
.sh-gap-6   { gap: var(--sh-space-6); }
.sh-gap-8   { gap: var(--sh-space-8); }

/* ── Margin ── */
.sh-m-0  { margin: 0; }
.sh-mt-0 { margin-top: 0; }
.sh-mb-0 { margin-bottom: 0; }
.sh-mt-2 { margin-top: var(--sh-space-2); }
.sh-mt-4 { margin-top: var(--sh-space-4); }
.sh-mt-6 { margin-top: var(--sh-space-6); }
.sh-mt-8 { margin-top: var(--sh-space-8); }
.sh-mb-2 { margin-bottom: var(--sh-space-2); }
.sh-mb-4 { margin-bottom: var(--sh-space-4); }
.sh-mb-6 { margin-bottom: var(--sh-space-6); }
.sh-mb-8 { margin-bottom: var(--sh-space-8); }
.sh-mx-auto { margin-inline: auto; }

/* ── Padding ── */
.sh-p-0  { padding: 0; }
.sh-p-2  { padding: var(--sh-space-2); }
.sh-p-4  { padding: var(--sh-space-4); }
.sh-p-6  { padding: var(--sh-space-6); }
.sh-p-8  { padding: var(--sh-space-8); }
.sh-px-4 { padding-inline: var(--sh-space-4); }
.sh-px-6 { padding-inline: var(--sh-space-6); }
.sh-py-4 { padding-block: var(--sh-space-4); }
.sh-py-6 { padding-block: var(--sh-space-6); }
.sh-py-8 { padding-block: var(--sh-space-8); }
.sh-py-10 { padding-block: var(--sh-space-10); }

/* ── Width ── */
.sh-w-full  { width: 100%; }
.sh-w-auto  { width: auto; }
.sh-min-w-0 { min-width: 0; }
.sh-max-w-sm  { max-width: 24rem; }
.sh-max-w-md  { max-width: 28rem; }
.sh-max-w-lg  { max-width: 32rem; }
.sh-max-w-xl  { max-width: 36rem; }

/* ── Height ── */
.sh-h-full   { height: 100%; }
.sh-min-h-0  { min-height: 0; }

/* ── Typography ── */
.sh-text-xs   { font-size: var(--sh-font-size-xs); }
.sh-text-sm   { font-size: var(--sh-font-size-sm); }
.sh-text-base { font-size: var(--sh-font-size-base); }
.sh-text-lg   { font-size: var(--sh-font-size-lg); }
.sh-text-xl   { font-size: var(--sh-font-size-xl); }
.sh-text-2xl  { font-size: var(--sh-font-size-2xl); }
.sh-text-3xl  { font-size: var(--sh-font-size-3xl); }
.sh-text-4xl  { font-size: var(--sh-font-size-4xl); }

.sh-font-normal    { font-weight: var(--sh-font-weight-normal); }
.sh-font-medium    { font-weight: var(--sh-font-weight-medium); }
.sh-font-semibold  { font-weight: var(--sh-font-weight-semibold); }
.sh-font-bold      { font-weight: var(--sh-font-weight-bold); }

.sh-text-left   { text-align: left; }
.sh-text-center { text-align: center; }
.sh-text-right  { text-align: right; }

.sh-leading-tight  { line-height: var(--sh-line-height-tight); }
.sh-leading-normal { line-height: var(--sh-line-height-normal); }
.sh-leading-loose  { line-height: var(--sh-line-height-loose); }

.sh-tracking-tight { letter-spacing: -0.025em; }
.sh-tracking-wide  { letter-spacing: 0.05em; }
.sh-uppercase      { text-transform: uppercase; }
.sh-truncate       { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sh-no-underline   { text-decoration: none; }

/* ── Colors ── */
.sh-text-primary   { color: var(--sh-text); }
.sh-text-secondary { color: var(--sh-text-secondary); }
.sh-text-muted     { color: var(--sh-text-muted); }
.sh-text-accent    { color: var(--sh-color-accent); }
.sh-text-danger    { color: var(--sh-color-danger); }
.sh-text-success   { color: var(--sh-color-success); }

.sh-bg-base    { background-color: var(--sh-bg); }
.sh-bg-subtle  { background-color: var(--sh-bg-subtle); }
.sh-bg-muted   { background-color: var(--sh-bg-muted); }
.sh-bg-raised  { background-color: var(--sh-bg-raised); }

/* ── Border ── */
.sh-border     { border: 1px solid var(--sh-border); }
.sh-border-t   { border-top: 1px solid var(--sh-border); }
.sh-border-b   { border-bottom: 1px solid var(--sh-border); }
.sh-border-0   { border: 0; }
.sh-rounded    { border-radius: var(--sh-radius); }
.sh-rounded-lg { border-radius: var(--sh-radius-lg); }
.sh-rounded-xl { border-radius: var(--sh-radius-xl); }
.sh-rounded-full { border-radius: var(--sh-radius-full); }

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

/* ── Overflow ── */
.sh-overflow-hidden  { overflow: hidden; }
.sh-overflow-auto    { overflow: auto; }
.sh-overflow-y-auto  { overflow-y: auto; }

/* ── Position ── */
.sh-relative { position: relative; }
.sh-absolute { position: absolute; }
.sh-sticky   { position: sticky; }

/* ── Cursor ── */
.sh-cursor-pointer { cursor: pointer; }
.sh-cursor-default { cursor: default; }

/* ── Opacity ── */
.sh-opacity-0   { opacity: 0; }
.sh-opacity-50  { opacity: 0.5; }
.sh-opacity-100 { opacity: 1; }

/* ── Transition ── */
.sh-transition { transition: all var(--sh-transition-normal); }
.sh-transition-fast { transition: all var(--sh-transition-fast); }

/* ── List Reset ── */
.sh-list-none {
    list-style: none;
    margin: 0;
    padding: 0;
}