/* Spacing */
.hds-padding-right-1 {
    padding-right: var(--hds-spacing-1);
}

.hds-padding-bottom-1 {
    padding-bottom: var(--hds-spacing-1);
}

.hds-padding-bottom-2 {
    padding-bottom: var(--hds-spacing-2);
}

.hds-padding-right-2 {
    padding-right: var(--hds-spacing-2);
}

.hds-padding-right-3 {
    padding-right: var(--hds-spacing-3);
}

.hds-padding-bottom-3 {
    padding-bottom: var(--hds-spacing-3);
}

.hds-padding-bottom-4 {
    padding-bottom: var(--hds-spacing-4);
}

.hds-padding-top-3 {
    padding-top: var(--hds-spacing-3);
}

.hds-padding-x-3 {
    padding-left: var(--hds-spacing-3);
    padding-right: var(--hds-spacing-3);
}

.hds-padding-y-3 {
    padding-top: var(--hds-spacing-3);
    padding-bottom: var(--hds-spacing-3);
}

.hds-padding-y-6 {
    padding-top: var(--hds-spacing-6);
    padding-bottom: var(--hds-spacing-6);
}

.hds-padding-2 {
    padding: var(--hds-spacing-2);
}

.hds-padding-4 {
    padding: var(--hds-spacing-4);
}

.hds-margin-top-2 {
    margin-top: var(--hds-spacing-2);
}

.hds-margin-right-2 {
    margin-right: var(--hds-spacing-2);
}

.hds-margin-right-6 {
    margin-right: var(--hds-spacing-6);
}

.hds-margin-bottom-1 {
    margin-bottom: var(--hds-spacing-1);
}

.hds-margin-bottom-2 {
    margin-bottom: var(--hds-spacing-2);
}

.hds-margin-left-1 {
    margin-left: var(--hds-spacing-1);
}

.hds-gap-1 {
    gap: var(--hds-spacing-1);
}

.hds-gap-2 {
    gap: var(--hds-spacing-2);
}

.hds-max-width-widescreen {
    max-width: var(--hds-breakpoint-widescreen);
}

/* Color Utilities */
.hds-bg-primary {
    background-color: var(--hds-color-primary);
}

.hds-bg-secondary {
    background-color: var(--hds-color-secondary);
}

.hds-bg-base-darkest {
    background-color: var(--hds-color-base-darkest);
}

.hds-bg-base-lighter {
    background-color: var(--hds-color-carbon-05);
}

.hds-bg-base-lightest {
    background-color: var(--hds-color-base-lightest);
}

.hds-text-base-lightest {
    color: var(--hds-color-base-lightest);
}

.hds-text-base-mid-lighter {
    color: var(--hds-color-carbon-30);
}

.hds-text-base-lighter {
    color: var(--hds-color-carbon-05);
}

.hds-text-mid-light {
    color: var(--hds-color-mid-light);
}

.hds-fill-base-lightest {
    fill: var(--hds-color-base-lightest);
}