/**
 * Color variants
 */

.table-wrapper {
    &.-primary {
        --table--background: var(--table--primary--background, var(--color-primary));
        --table--hover--background: var(
            --table--primary--hover--background,
            var(--color-primary-shade-100)
        );
        --table--striped--background: var(
            --table--primary--striped--background,
            var(--color-primary-shade-50)
        );
        --table--border-color: var(--table--primary--border-color, var(--color-primary-shade-50));
        --table--color: var(--table--primary--color, var(--contrast-text-color-primary));
    }

    &.-secondary {
        --table--background: var(--table--secondary--background, var(--color-secondary));
        --table--hover--background: var(
            --table--secondary--hover--background,
            var(--color-secondary-shade-100)
        );
        --table--striped--background: var(
            --table--secondary--striped--background,
            var(--color-secondary-shade-50)
        );
        --table--border-color: var(
            --table--secondary--border-color,
            var(--color-secondary-shade-50)
        );
        --table--color: var(--table--secondary--color, var(--contrast-text-color-secondary));
    }

    &.-light {
        --table--background: var(--table--light--background, var(--color-white));
        --table--hover--background: var(--table--light--hover--background, var(--color-gray-100));
        --table--striped--background: var(
            --table--light--striped--background,
            var(--color-gray-50)
        );
        --table--border-color: var(--table--light--border-color, var(--color-gray-50));
        --table--color: var(--table--light--color, var(--contrast-text-color-light));
    }

    &.-dark {
        --table--background: var(--table--dark--background, var(--color-dark));
        --table--hover--background: var(
            --table--dark--hover--background,
            var(--color-dark-tint-100)
        );
        --table--striped--background: var(
            --table--dark--striped--background,
            var(--color-dark-tint-50)
        );
        --table--border-color: var(--table--dark--border-color, var(--color-dark-tint-50));
        --table--color: var(--table--dark--color, var(--contrast-text-color-dark));
    }

    &.-info {
        --table--background: var(--table--info--background, var(--color-info));
        --table--hover--background: var(
            --table--hover--info--background,
            var(--color-info-shade-100)
        );
        --table--striped--background: var(
            --table--info--striped--background,
            var(--color-info-shade-50)
        );
        --table--border-color: var(--table--info--border-color, var(--color-info-shade-50));
        --table--color: var(--table--info--color, var(--contrast-text-color-info));
    }

    &.-success {
        --table--background: var(--table--success--background, var(--color-success));
        --table--hover--background: var(
            --table--success--hover--background,
            var(--color-success-shade-100)
        );
        --table--striped--background: var(
            --table--success--striped--background,
            var(--color-success-shade-50)
        );
        --table--border-color: var(--table--success--border-color, var(--color-success-shade-50));
        --table--color: var(--table--success--color, var(--contrast-text-color-success));
    }

    &.-warning {
        --table--background: var(--table--warning--background, var(--color-warning));
        --table--hover--background: var(
            --table--warning--hover--background,
            var(--color-warning-shade-100)
        );
        --table--striped--background: var(
            --table--warning--striped--background,
            var(--color-warning-shade-50)
        );
        --table--border-color: var(--table--warning--border-color, var(--color-warning-shade-50));
        --table--color: var(--table--warning--color, var(--contrast-text-color-warning));
    }

    &.-danger {
        --table--background: var(--table--danger--background, var(--color-danger));
        --table--hover--background: var(
            --table--danger--hover--background,
            var(--color-danger-shade-100)
        );
        --table--striped--background: var(
            --table--danger--striped--background,
            var(--color-danger-shade-50)
        );
        --table--border-color: var(--table--danger--border-color, var(--color-danger-shade-50));
        --table--color: var(--table--danger--color, var(--contrast-text-color-danger));
    }
}