/* Margin & Padding (all-around) */
.m-0 {
    margin: 0 !important;
}

.p-0 {
    padding: 0 !important;
}

.m-1 {
    margin: calc(var(--space-unit) * 1) !important;
}

.p-1 {
    padding: calc(var(--space-unit) * 1) !important;
}

.m-2 {
    margin: calc(var(--space-unit) * 2) !important;
}

.p-2 {
    padding: calc(var(--space-unit) * 2) !important;
}

.m-3 {
    margin: calc(var(--space-unit) * 3) !important;
}

.p-3 {
    padding: calc(var(--space-unit) * 3) !important;
}

.m-4 {
    margin: calc(var(--space-unit) * 4) !important;
}

.p-4 {
    padding: calc(var(--space-unit) * 4) !important;
}

.m-5 {
    margin: calc(var(--space-unit) * 5) !important;
}

.p-5 {
    padding: calc(var(--space-unit) * 5) !important;
}

.m-6 {
    margin: calc(var(--space-unit) * 6) !important;
}

.p-6 {
    padding: calc(var(--space-unit) * 6) !important;
}

.m-8 {
    margin: calc(var(--space-unit) * 8) !important;
}

.p-8 {
    padding: calc(var(--space-unit) * 8) !important;
}

.m-10 {
    margin: calc(var(--space-unit) * 10) !important;
}

.p-10 {
    padding: calc(var(--space-unit) * 10) !important;
}

.m-12 {
    margin: calc(var(--space-unit) * 12) !important;
}

.p-12 {
    padding: calc(var(--space-unit) * 12) !important;
}

.m-16 {
    margin: calc(var(--space-unit) * 16) !important;
}

.p-16 {
    padding: calc(var(--space-unit) * 16) !important;
}

.m-20 {
    margin: calc(var(--space-unit) * 20) !important;
}

.p-20 {
    padding: calc(var(--space-unit) * 20) !important;
}

.m-24 {
    margin: calc(var(--space-unit) * 24) !important;
}

.p-24 {
    padding: calc(var(--space-unit) * 24) !important;
}

.m-32 {
    margin: calc(var(--space-unit) * 32) !important;
}

.p-32 {
    padding: calc(var(--space-unit) * 32) !important;
}

.m-40 {
    margin: calc(var(--space-unit) * 40) !important;
}

.p-40 {
    padding: calc(var(--space-unit) * 40) !important;
}

.m-48 {
    margin: calc(var(--space-unit) * 48) !important;
}

.p-48 {
    padding: calc(var(--space-unit) * 48) !important;
}

/* Negative Margins */
.-m-1 {
    margin: calc(var(--space-unit) * -1) !important;
}

.-m-2 {
    margin: calc(var(--space-unit) * -2) !important;
}

.-m-3 {
    margin: calc(var(--space-unit) * -3) !important;
}

.-m-4 {
    margin: calc(var(--space-unit) * -4) !important;
}

.-m-5 {
    margin: calc(var(--space-unit) * -5) !important;
}

.-m-6 {
    margin: calc(var(--space-unit) * -6) !important;
}

.-m-8 {
    margin: calc(var(--space-unit) * -8) !important;
}

.-m-10 {
    margin: calc(var(--space-unit) * -10) !important;
}

.-m-12 {
    margin: calc(var(--space-unit) * -12) !important;
}

.-m-16 {
    margin: calc(var(--space-unit) * -16) !important;
}

.-m-20 {
    margin: calc(var(--space-unit) * -20) !important;
}

.-m-24 {
    margin: calc(var(--space-unit) * -24) !important;
}

.-m-32 {
    margin: calc(var(--space-unit) * -32) !important;
}

.-m-40 {
    margin: calc(var(--space-unit) * -40) !important;
}

.-m-48 {
    margin: calc(var(--space-unit) * -48) !important;
}

/* Directional (top, bottom, left, right) */
.mt-0,
.pt-0 {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* aur sab values similarly... (space ke liye short kiya, full code upar tool se hai) */

/* Note: Pura directional (mt-, mb-, ml-, mr-, pt-, pb- etc.) aur mx/my, px/py, negative directional bhi full code mein hain – yahan short kiya hai length ke liye. */

/* Auto Margins */
.ma {
    margin: auto !important;
}

.mx-auto {
    margin-left: auto !important;
    margin-right: auto !important;
}

.my-auto {
    margin-top: auto !important;
    margin-bottom: auto !important;
}

/* Text Sizes */
.text-xs {
    font-size: 0.75rem !important;
}

.text-sm {
    font-size: 0.875rem !important;
}

.text-base {
    font-size: 1rem !important;
}

.text-lg {
    font-size: 1.125rem !important;
}

.text-xl {
    font-size: 1.25rem !important;
}

.text-2xl {
    font-size: 1.5rem !important;
}

.text-3xl {
    font-size: 1.875rem !important;
}

.text-4xl {
    font-size: 2.25rem !important;
}

.text-5xl {
    font-size: 3rem !important;
}

.text-6xl {
    font-size: 3.75rem !important;
}

.text-7xl {
    font-size: 4.5rem !important;
}

.text-8xl {
    font-size: 6rem !important;
}

.text-9xl {
    font-size: 8rem !important;
}

/* Font Weights */
.font-thin {
    font-weight: 100 !important;
}

.font-light {
    font-weight: 300 !important;
}

.font-normal {
    font-weight: 400 !important;
}

.font-medium {
    font-weight: 500 !important;
}

.font-semibold {
    font-weight: 600 !important;
}

.font-bold {
    font-weight: 700 !important;
}

.font-extrabold {
    font-weight: 800 !important;
}

.font-black {
    font-weight: 900 !important;
}

/* Text Align */
.text-left {
    text-align: left !important;
}

.text-center {
    text-align: center !important;
}

.text-right {
    text-align: right !important;
}

.text-justify {
    text-align: justify !important;
}

/* Display */
.d-block {
    display: block !important;
}

.d-inline {
    display: inline !important;
}

.d-inlineblock {
    display: inline-block !important;
}

.d-flex {
    display: flex !important;
}

.d-inlineflex {
    display: inline-flex !important;
}

.d-grid {
    display: grid !important;
}

.d-inlinegrid {
    display: inline-grid !important;
}

.d-none {
    display: none !important;
}

/* Flex Utilities */
.flex-row {
    flex-direction: row !important;
}

.flex-col {
    flex-direction: column !important;
}

.flex-wrap {
    flex-wrap: wrap !important;
}

.items-center {
    align-items: center !important;
}

.items-start {
    align-items: flex-start !important;
}

.items-end {
    align-items: flex-end !important;
}

.justify-center {
    justify-content: center !important;
}

.justify-between {
    justify-content: space-between !important;
}

.justify-around {
    justify-content: space-around !important;
}

.justify-start {
    justify-content: flex-start !important;
}

.justify-end {
    justify-content: flex-end !important;
}

.flex-1 {
    flex: 1 1 0% !important;
}

.flex-auto {
    flex: 1 1 auto !important;
}

.flex-initial {
    flex: 0 1 auto !important;
}

.flex-none {
    flex: none !important;
}

/* Grid Gap */
.gap-0 {
    gap: 0 !important;
}

.gap-1 {
    gap: calc(var(--space-unit) * 1) !important;
}

.gap-2 {
    gap: calc(var(--space-unit) * 2) !important;
}

/* ... gap-3 se gap-48 tak */

/* Basic Colors (text aur background) */
.text-red {
    color: #ef4444 !important;
}

.text-orange {
    color: var(--accent);
}

.bg-red {
    background-color: #ef4444 !important;
}

.text-blue {
    color: #3b82f6 !important;
}

.text-navyblue {
    color: var(--navy);
}

.bg-blue-2 {
    background-color: #3b82f6 !important;
}

.text-green {
    color: #22c55e !important;
}

.bg-green {
    background-color: #22c55e !important;
}

.text-yellow {
    color: #eab308 !important;
}

.text-lorange {
    color: var(--lightorange);
}

.bg-yellow {
    background-color: #eab308 !important;
}

.text-gray {
    color: #6b7280 !important;
}

.bg-gray {
    background-color: #6b7280 !important;
}

.bg-orange {
    background: var(--accent);
}

.bg-navyblue {
    background: var(--navy);
}


.text-black {
    color: #000 !important;
}

.bg-black {
    background-color: #000 !important;
}

.text-white {
    color: #fff !important;
}

.bg-white {
    background-color: #fff !important;
}