/* ==========================================================================
   INDIGO HARVEST — UTILITIES
   Atomic helper classes that map to design tokens.
   ========================================================================== */

/* ===== Spacing (margin / padding) ===== */
.ds-m-0  { margin: 0 !important; }
.ds-m-1  { margin: var(--sp-1) !important; }
.ds-m-2  { margin: var(--sp-2) !important; }
.ds-m-3  { margin: var(--sp-3) !important; }
.ds-m-4  { margin: var(--sp-4) !important; }
.ds-m-5  { margin: var(--sp-5) !important; }
.ds-m-6  { margin: var(--sp-6) !important; }

.ds-p-0  { padding: 0 !important; }
.ds-p-1  { padding: var(--sp-1) !important; }
.ds-p-2  { padding: var(--sp-2) !important; }
.ds-p-3  { padding: var(--sp-3) !important; }
.ds-p-4  { padding: var(--sp-4) !important; }
.ds-p-5  { padding: var(--sp-5) !important; }
.ds-p-6  { padding: var(--sp-6) !important; }

.ds-mt-1{margin-top:var(--sp-1)!important}.ds-mt-2{margin-top:var(--sp-2)!important}.ds-mt-3{margin-top:var(--sp-3)!important}.ds-mt-4{margin-top:var(--sp-4)!important}.ds-mt-5{margin-top:var(--sp-5)!important}.ds-mt-6{margin-top:var(--sp-6)!important}
.ds-mb-1{margin-bottom:var(--sp-1)!important}.ds-mb-2{margin-bottom:var(--sp-2)!important}.ds-mb-3{margin-bottom:var(--sp-3)!important}.ds-mb-4{margin-bottom:var(--sp-4)!important}.ds-mb-5{margin-bottom:var(--sp-5)!important}.ds-mb-6{margin-bottom:var(--sp-6)!important}
.ds-ml-1{margin-left:var(--sp-1)!important}.ds-ml-2{margin-left:var(--sp-2)!important}.ds-ml-3{margin-left:var(--sp-3)!important}.ds-ml-4{margin-left:var(--sp-4)!important}
.ds-mr-1{margin-right:var(--sp-1)!important}.ds-mr-2{margin-right:var(--sp-2)!important}.ds-mr-3{margin-right:var(--sp-3)!important}.ds-mr-4{margin-right:var(--sp-4)!important}

.ds-pt-1{padding-top:var(--sp-1)!important}.ds-pt-2{padding-top:var(--sp-2)!important}.ds-pt-3{padding-top:var(--sp-3)!important}.ds-pt-4{padding-top:var(--sp-4)!important}.ds-pt-5{padding-top:var(--sp-5)!important}.ds-pt-6{padding-top:var(--sp-6)!important}
.ds-pb-1{padding-bottom:var(--sp-1)!important}.ds-pb-2{padding-bottom:var(--sp-2)!important}.ds-pb-3{padding-bottom:var(--sp-3)!important}.ds-pb-4{padding-bottom:var(--sp-4)!important}.ds-pb-5{padding-bottom:var(--sp-5)!important}.ds-pb-6{padding-bottom:var(--sp-6)!important}

.ds-gap-1{gap:var(--sp-1)!important}.ds-gap-2{gap:var(--sp-2)!important}.ds-gap-3{gap:var(--sp-3)!important}.ds-gap-4{gap:var(--sp-4)!important}.ds-gap-5{gap:var(--sp-5)!important}.ds-gap-6{gap:var(--sp-6)!important}

/* ===== Display & Flex ===== */
.ds-flex{display:flex!important}
.ds-inline-flex{display:inline-flex!important}
.ds-grid{display:grid!important}
.ds-block{display:block!important}
.ds-hidden{display:none!important}

.ds-items-center{align-items:center!important}
.ds-items-start{align-items:flex-start!important}
.ds-items-end{align-items:flex-end!important}
.ds-justify-center{justify-content:center!important}
.ds-justify-between{justify-content:space-between!important}
.ds-justify-end{justify-content:flex-end!important}
.ds-flex-col{flex-direction:column!important}
.ds-flex-wrap{flex-wrap:wrap!important}
.ds-flex-1{flex:1 1 0%!important}

/* ===== Text ===== */
.ds-text-display{font-family:var(--font-display)!important;font-size:var(--fs-display)!important;line-height:var(--lh-tight)!important}
.ds-text-h1{font-family:var(--font-display)!important;font-size:var(--fs-h1)!important;line-height:var(--lh-tight)!important}
.ds-text-h2{font-size:var(--fs-h2)!important;font-weight:var(--fw-semibold)!important}
.ds-text-h3{font-size:var(--fs-h3)!important;font-weight:var(--fw-semibold)!important}
.ds-text-h4{font-size:var(--fs-h4)!important;font-weight:var(--fw-semibold)!important}
.ds-text-body-lg{font-size:var(--fs-body-lg)!important}
.ds-text-body{font-size:var(--fs-body)!important}
.ds-text-body-sm{font-size:var(--fs-body-sm)!important}
.ds-text-caption{font-size:var(--fs-caption)!important}
.ds-text-overline{font-size:var(--fs-overline)!important;text-transform:uppercase!important;letter-spacing:var(--ls-wider)!important;font-weight:var(--fw-semibold)!important}
.ds-text-mono{font-family:var(--font-mono)!important;font-feature-settings:'tnum' 1,'lnum' 1}

.ds-fw-light{font-weight:var(--fw-light)!important}
.ds-fw-regular{font-weight:var(--fw-regular)!important}
.ds-fw-medium{font-weight:var(--fw-medium)!important}
.ds-fw-semibold{font-weight:var(--fw-semibold)!important}
.ds-fw-bold{font-weight:var(--fw-bold)!important}

.ds-text-left{text-align:left!important}
.ds-text-center{text-align:center!important}
.ds-text-right{text-align:right!important}
.ds-text-uppercase{text-transform:uppercase!important}
.ds-text-truncate{overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}

/* ===== Color text ===== */
.ds-text-ink{color:var(--ink-1)!important}
.ds-text-ink-2{color:var(--ink-2)!important}
.ds-text-ink-3{color:var(--ink-3)!important}
.ds-text-ink-4{color:var(--ink-4)!important}
.ds-text-brand{color:var(--ih-indigo)!important}
.ds-text-success{color:var(--ih-success)!important}
.ds-text-warning{color:var(--ih-warning)!important}
.ds-text-error{color:var(--ih-error)!important}
.ds-text-on-brand{color:var(--ink-on-brand)!important}

/* ===== Color background ===== */
.ds-bg-surface{background:var(--bg-surface)!important}
.ds-bg-surface-2{background:var(--bg-surface-2)!important}
.ds-bg-canvas{background:var(--bg-canvas)!important}
.ds-bg-brand{background:var(--ih-indigo)!important;color:var(--ink-on-brand)!important}
.ds-bg-success-tint{background:var(--ih-success-tint)!important}
.ds-bg-warning-tint{background:var(--ih-warning-tint)!important}
.ds-bg-error-tint{background:var(--ih-error-tint)!important}
.ds-bg-info-tint{background:var(--ih-info-tint)!important}
.ds-bg-lavender{background:var(--ih-lavender)!important}

/* ===== Border ===== */
.ds-border{border:1px solid var(--line-1)!important}
.ds-border-2{border:1px solid var(--line-2)!important}
.ds-border-brand{border:1px solid var(--ih-indigo)!important}
.ds-border-top{border-top:1px solid var(--line-1)!important}
.ds-border-bottom{border-bottom:1px solid var(--line-1)!important}
.ds-no-border{border:none!important}

/* ===== Radius ===== */
.ds-r-none{border-radius:0!important}
.ds-r-xs{border-radius:var(--r-xs)!important}
.ds-r-sm{border-radius:var(--r-sm)!important}
.ds-r-md{border-radius:var(--r-md)!important}
.ds-r-lg{border-radius:var(--r-lg)!important}
.ds-r-xl{border-radius:var(--r-xl)!important}
.ds-r-2xl{border-radius:var(--r-2xl)!important}
.ds-r-pill{border-radius:var(--r-pill)!important}
.ds-r-full{border-radius:50%!important}

/* ===== Elevation ===== */
.ds-el-0{box-shadow:none!important}
.ds-el-1{box-shadow:var(--el-1)!important}
.ds-el-2{box-shadow:var(--el-2)!important}
.ds-el-3{box-shadow:var(--el-3)!important}
.ds-el-4{box-shadow:var(--el-4)!important}
.ds-el-5{box-shadow:var(--el-5)!important}
.ds-el-brand{box-shadow:var(--el-brand)!important}

/* ===== Position ===== */
.ds-relative{position:relative!important}
.ds-absolute{position:absolute!important}
.ds-fixed{position:fixed!important}
.ds-sticky{position:sticky!important}

/* ===== Width / Height ===== */
.ds-w-full{width:100%!important}
.ds-w-auto{width:auto!important}
.ds-h-full{height:100%!important}
.ds-h-auto{height:auto!important}
.ds-min-h-screen{min-height:100vh!important}

/* ===== Overflow ===== */
.ds-overflow-hidden{overflow:hidden!important}
.ds-overflow-auto{overflow:auto!important}
.ds-overflow-x-auto{overflow-x:auto!important}
.ds-overflow-y-auto{overflow-y:auto!important}

/* ===== Cursor ===== */
.ds-cursor-pointer{cursor:pointer!important}
.ds-cursor-not-allowed{cursor:not-allowed!important}

/* ===== Visually hidden (a11y) ===== */
.ds-sr-only,.sr-only{
    position:absolute!important;width:1px!important;height:1px!important;
    padding:0!important;margin:-1px!important;overflow:hidden!important;
    clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;
}

/* ===== Touch target enforcement (a11y) ===== */
.ds-touch-target{min-width:var(--touch-min)!important;min-height:var(--touch-min)!important}

/* ===== Aspect ratios for media ===== */
.ds-aspect-1\/1{aspect-ratio:1/1!important}
.ds-aspect-4\/3{aspect-ratio:4/3!important}
.ds-aspect-16\/9{aspect-ratio:16/9!important}
.ds-aspect-3\/2{aspect-ratio:3/2!important}

/* ===== Container max-widths ===== */
.ds-container{width:100%;margin-left:auto;margin-right:auto;padding:0 var(--sp-4)}
.ds-container-sm{max-width:var(--container-sm)}
.ds-container-md{max-width:var(--container-md)}
.ds-container-lg{max-width:var(--container-lg)}
.ds-container-xl{max-width:var(--container-xl)}
.ds-container-2xl{max-width:var(--container-2xl)}

/* ===== Stack helpers (vertical rhythm) ===== */
.ds-stack > * + * { margin-top: var(--sp-3); }
.ds-stack-sm > * + * { margin-top: var(--sp-2); }
.ds-stack-lg > * + * { margin-top: var(--sp-5); }

/* ===== Cluster (horizontal rhythm) ===== */
.ds-cluster { display: flex; flex-wrap: wrap; gap: var(--sp-2); align-items: center; }
.ds-cluster-lg { display: flex; flex-wrap: wrap; gap: var(--sp-4); align-items: center; }