/* Bootstrap Color Overrides using bit-prefixed variables */

/* Background color utilities */
.bg-primary {
    background-color: var(--bit-primary) !important;
}

.bg-secondary {
    background-color: var(--bit-secondary) !important;
}

.bg-success {
    background-color: var(--bit-success) !important;
}

.bg-danger {
    background-color: var(--bit-danger) !important;
}

.bg-warning {
    background-color: var(--bit-warning) !important;
}

.bg-info {
    background-color: var(--bit-info) !important;
}

.bg-light {
    background-color: var(--bit-light) !important;
}

.bg-dark {
    background-color: var(--bit-dark) !important;
}

/* Subtle background utilities */
.bg-primary-subtle {
    background-color: color-mix(in srgb, var(--bit-primary) 10%, white) !important;
}

.bg-secondary-subtle {
    background-color: color-mix(in srgb, var(--bit-secondary) 10%, white) !important;
}

.bg-success-subtle {
    background-color: color-mix(in srgb, var(--bit-success) 10%, white) !important;
}

.bg-danger-subtle {
    background-color: color-mix(in srgb, var(--bit-danger) 10%, white) !important;
}

.bg-warning-subtle {
    background-color: color-mix(in srgb, var(--bit-warning) 10%, white) !important;
}

.bg-info-subtle {
    background-color: color-mix(in srgb, var(--bit-info) 10%, white) !important;
}

.bg-light-subtle {
    background-color: color-mix(in srgb, var(--bit-light) 10%, white) !important;
}

.bg-dark-subtle {
    background-color: color-mix(in srgb, var(--bit-dark) 10%, white) !important;
}

/* Text color utilities */
.text-primary {
    color: var(--bit-primary) !important;
}

.text-secondary {
    color: var(--bit-secondary) !important;
}

.text-success {
    color: var(--bit-success) !important;
}

.text-danger {
    color: var(--bit-danger) !important;
}

.text-warning {
    color: var(--bit-warning) !important;
}

.text-info {
    color: var(--bit-info) !important;
}

.text-light {
    color: var(--bit-light) !important;
}

.text-dark {
    color: var(--bit-dark) !important;
}

/* Text emphasis utilities */
.text-primary-emphasis {
    color: color-mix(in srgb, var(--bit-primary) 80%, black) !important;
}

.text-secondary-emphasis {
    color: color-mix(in srgb, var(--bit-secondary) 80%, black) !important;
}

.text-success-emphasis {
    color: color-mix(in srgb, var(--bit-success) 80%, black) !important;
}

.text-danger-emphasis {
    color: color-mix(in srgb, var(--bit-danger) 80%, black) !important;
}

.text-warning-emphasis {
    color: color-mix(in srgb, var(--bit-warning) 80%, black) !important;
}

.text-info-emphasis {
    color: color-mix(in srgb, var(--bit-info) 80%, black) !important;
}

/* Link color utilities */
.link-primary {
    color: var(--bit-primary) !important;
}

.link-secondary {
    color: var(--bit-secondary) !important;
}

.link-success {
    color: var(--bit-success) !important;
}

.link-danger {
    color: var(--bit-danger) !important;
}

.link-warning {
    color: var(--bit-warning) !important;
}

.link-info {
    color: var(--bit-info) !important;
}

.link-light {
    color: var(--bit-light) !important;
}

.link-dark {
    color: var(--bit-dark) !important;
}

/* Border color utilities */
.border-primary {
    border-color: var(--bit-primary) !important;
}

.border-secondary {
    border-color: var(--bit-secondary) !important;
}

.border-success {
    border-color: var(--bit-success) !important;
}

.border-danger {
    border-color: var(--bit-danger) !important;
}

.border-warning {
    border-color: var(--bit-warning) !important;
}

.border-info {
    border-color: var(--bit-info) !important;
}

.border-light {
    border-color: var(--bit-light) !important;
}

.border-dark {
    border-color: var(--bit-dark) !important;
}

/* Subtle border utilities */
.border-primary-subtle {
    border-color: color-mix(in srgb, var(--bit-primary) 25%, white) !important;
}

.border-secondary-subtle {
    border-color: color-mix(in srgb, var(--bit-secondary) 25%, white) !important;
}

.border-success-subtle {
    border-color: color-mix(in srgb, var(--bit-success) 25%, white) !important;
}

.border-danger-subtle {
    border-color: color-mix(in srgb, var(--bit-danger) 25%, white) !important;
}

.border-warning-subtle {
    border-color: color-mix(in srgb, var(--bit-warning) 25%, white) !important;
}

.border-info-subtle {
    border-color: color-mix(in srgb, var(--bit-info) 25%, white) !important;
}

/* Button color utilities are now defined in theme_buttons.css */

/* Outline button variants are now defined in theme_buttons.css */

/* Alert variants */
.alert-primary {
    background-color: color-mix(in srgb, var(--bit-primary) 15%, white) !important;
    border-color: color-mix(in srgb, var(--bit-primary) 30%, white) !important;
    color: color-mix(in srgb, var(--bit-primary) 80%, black) !important;
}

.alert-secondary {
    background-color: color-mix(in srgb, var(--bit-secondary) 15%, white) !important;
    border-color: color-mix(in srgb, var(--bit-secondary) 30%, white) !important;
    color: color-mix(in srgb, var(--bit-secondary) 80%, black) !important;
}

.alert-success {
    background-color: color-mix(in srgb, var(--bit-success) 15%, white) !important;
    border-color: color-mix(in srgb, var(--bit-success) 30%, white) !important;
    color: color-mix(in srgb, var(--bit-success) 80%, black) !important;
}

.alert-danger {
    background-color: color-mix(in srgb, var(--bit-danger) 15%, white) !important;
    border-color: color-mix(in srgb, var(--bit-danger) 30%, white) !important;
    color: color-mix(in srgb, var(--bit-danger) 80%, black) !important;
}

.alert-warning {
    background-color: color-mix(in srgb, var(--bit-warning) 15%, white) !important;
    border-color: color-mix(in srgb, var(--bit-warning) 30%, white) !important;
    color: color-mix(in srgb, var(--bit-warning) 80%, black) !important;
}

.alert-info {
    background-color: color-mix(in srgb, var(--bit-info) 15%, white) !important;
    border-color: color-mix(in srgb, var(--bit-info) 30%, white) !important;
    color: color-mix(in srgb, var(--bit-info) 80%, black) !important;
}

.alert-light {
    background-color: color-mix(in srgb, var(--bit-light) 15%, white) !important;
    border-color: color-mix(in srgb, var(--bit-light) 30%, white) !important;
    color: color-mix(in srgb, var(--bit-light) 80%, black) !important;
}

.alert-dark {
    background-color: color-mix(in srgb, var(--bit-dark) 15%, white) !important;
    border-color: color-mix(in srgb, var(--bit-dark) 30%, white) !important;
    color: color-mix(in srgb, var(--bit-dark) 80%, white) !important;
}

/* Badge variants - can be customized separately from buttons */
.badge.bg-primary,
.badge.text-bg-primary {
    background-color: var(--bit-badge-primary, var(--bit-primary)) !important;
    background-image: none !important;
}

.badge.bg-secondary,
.badge.text-bg-secondary {
    background-color: var(--bit-badge-secondary, var(--bit-secondary)) !important;
    background-image: none !important;
}

.badge.bg-success,
.badge.text-bg-success {
    background-color: var(--bit-badge-success, var(--bit-success)) !important;
    background-image: none !important;
}

.badge.bg-danger,
.badge.text-bg-danger {
    background-color: var(--bit-badge-danger, var(--bit-danger)) !important;
    background-image: none !important;
}

.badge.bg-warning,
.badge.text-bg-warning {
    background-color: var(--bit-badge-warning, var(--bit-warning)) !important;
    background-image: none !important;
    color: var(--bit-badge-warning-fg, var(--bit-warning-fg, white)) !important;
}

.badge.bg-info,
.badge.text-bg-info {
    background-color: var(--bit-badge-info, var(--bit-info)) !important;
    background-image: none !important;
    color: var(--bit-badge-info-fg, #000) !important;
}

.badge.bg-light,
.badge.text-bg-light {
    background-color: var(--bit-badge-light, var(--bit-light)) !important;
    background-image: none !important;
    color: var(--bit-badge-light-fg, #000) !important;
}

.badge.bg-dark,
.badge.text-bg-dark {
    background-color: var(--bit-badge-dark, var(--bit-dark)) !important;
    background-image: none !important;
}

/* Progress bar variants */
.progress-bar.bg-primary {
    background-color: var(--bit-primary) !important;
}

.progress-bar.bg-secondary {
    background-color: var(--bit-secondary) !important;
}

.progress-bar.bg-success {
    background-color: var(--bit-success) !important;
}

.progress-bar.bg-danger {
    background-color: var(--bit-danger) !important;
}

.progress-bar.bg-warning {
    background-color: var(--bit-warning) !important;
}

.progress-bar.bg-info {
    background-color: var(--bit-info) !important;
}

.progress-bar.bg-dark {
    background-color: var(--bit-dark) !important;
}

/* List group variants */
.list-group-item-primary {
    background-color: color-mix(in srgb, var(--bit-primary) 15%, white) !important;
    color: color-mix(in srgb, var(--bit-primary) 80%, black) !important;
}

.list-group-item-secondary {
    background-color: color-mix(in srgb, var(--bit-secondary) 15%, white) !important;
    color: color-mix(in srgb, var(--bit-secondary) 80%, black) !important;
}

.list-group-item-success {
    background-color: color-mix(in srgb, var(--bit-success) 15%, white) !important;
    color: color-mix(in srgb, var(--bit-success) 80%, black) !important;
}

.list-group-item-danger {
    background-color: color-mix(in srgb, var(--bit-danger) 15%, white) !important;
    color: color-mix(in srgb, var(--bit-danger) 80%, black) !important;
}

.list-group-item-warning {
    background-color: color-mix(in srgb, var(--bit-warning) 15%, white) !important;
    color: color-mix(in srgb, var(--bit-warning) 80%, black) !important;
}

.list-group-item-info {
    background-color: color-mix(in srgb, var(--bit-info) 15%, white) !important;
    color: color-mix(in srgb, var(--bit-info) 80%, black) !important;
}

.list-group-item-light {
    background-color: color-mix(in srgb, var(--bit-light) 15%, white) !important;
    color: color-mix(in srgb, var(--bit-light) 80%, black) !important;
}

.list-group-item-dark {
    background-color: color-mix(in srgb, var(--bit-dark) 15%, white) !important;
    color: color-mix(in srgb, var(--bit-dark) 80%, white) !important;
}

/* Table variants */
.table-primary {
    --bs-table-bg: color-mix(in srgb, var(--bit-primary) 15%, white) !important;
    --bs-table-color: color-mix(in srgb, var(--bit-primary) 80%, black) !important;
}

.table-secondary {
    --bs-table-bg: color-mix(in srgb, var(--bit-secondary) 15%, white) !important;
    --bs-table-color: color-mix(in srgb, var(--bit-secondary) 80%, black) !important;
}

.table-success {
    --bs-table-bg: color-mix(in srgb, var(--bit-success) 15%, white) !important;
    --bs-table-color: color-mix(in srgb, var(--bit-success) 80%, black) !important;
}

.table-danger {
    --bs-table-bg: color-mix(in srgb, var(--bit-danger) 15%, white) !important;
    --bs-table-color: color-mix(in srgb, var(--bit-danger) 80%, black) !important;
}

.table-warning {
    --bs-table-bg: color-mix(in srgb, var(--bit-warning) 15%, white) !important;
    --bs-table-color: color-mix(in srgb, var(--bit-warning) 80%, black) !important;
}

.table-info {
    --bs-table-bg: color-mix(in srgb, var(--bit-info) 15%, white) !important;
    --bs-table-color: color-mix(in srgb, var(--bit-info) 80%, black) !important;
}

.table-light {
    --bs-table-bg: var(--bit-light) !important;
    --bs-table-color: #000 !important;
}

.table-dark {
    --bs-table-bg: var(--bit-dark) !important;
    --bs-table-color: #fff !important;
}

/* Form Overrides for Compact Floating Labels */
.compact-floating .form-floating {
    margin-bottom: 0 !important;
}

/* Optional: Add some spacing back with gap utilities on row instead */
.compact-floating .row {
    row-gap: 0.75rem; /* Smaller than Bootstrap's default 1rem */
}