/* ============================================== */
/* Mannito Cloud Color Utility Classes           */
/* ============================================== */
/* 
 * This file provides utility classes for using the Mannito color scheme
 * throughout the application without hardcoding color values.
 */

/* ========================================== */
/* Background Colors                          */
/* ========================================== */
.bg-primary-custom {
    background-color: var(--mannito-primary-color) !important;
}

.bg-primary-hover {
    background-color: var(--mannito-primary-hover) !important;
}

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

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

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

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

.bg-tertiary-custom {
    background-color: var(--mannito-tertiary-color) !important;
}

.bg-tertiary-hover {
    background-color: var(--mannito-tertiary-hover) !important;
}

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

/* ========================================== */
/* Text Colors                                */
/* ========================================== */
.text-primary-custom {
    color: var(--mannito-primary-color) !important;
}

.text-primary-hover {
    color: var(--mannito-primary-hover) !important;
}

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

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

.text-tertiary-custom {
    color: var(--mannito-tertiary-color) !important;
}

.text-tertiary-hover {
    color: var(--mannito-tertiary-hover) !important;
}

/* ========================================== */
/* Border Colors                              */
/* ========================================== */
.border-primary-custom {
    border-color: var(--mannito-primary-color) !important;
}

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

.border-tertiary-custom {
    border-color: var(--mannito-tertiary-color) !important;
}

/* ========================================== */
/* Button Variants                            */
/* ========================================== */
.btn-secondary-custom {
    color: #fff;
    background-color: var(--mannito-secondary-color);
    border-color: var(--mannito-secondary-color);
}

.btn-secondary-custom:hover {
    color: #fff;
    background-color: var(--mannito-secondary-hover);
    border-color: var(--mannito-secondary-hover);
}

.btn-secondary-custom:focus,
.btn-secondary-custom:active {
    color: #fff;
    background-color: var(--mannito-secondary-active);
    border-color: var(--mannito-secondary-active);
}

.btn-tertiary-custom {
    color: #fff;
    background-color: var(--mannito-tertiary-color);
    border-color: var(--mannito-tertiary-color);
}

.btn-tertiary-custom:hover {
    color: #fff;
    background-color: var(--mannito-tertiary-hover);
    border-color: var(--mannito-tertiary-hover);
}

.btn-tertiary-custom:focus,
.btn-tertiary-custom:active {
    color: #fff;
    background-color: var(--mannito-tertiary-active);
    border-color: var(--mannito-tertiary-active);
}

/* ========================================== */
/* Link Styles                                */
/* ========================================== */
.link-primary-custom {
    color: var(--mannito-primary-color);
    text-decoration: none;
}

.link-primary-custom:hover {
    color: var(--mannito-primary-hover);
    text-decoration: underline;
}

.link-secondary-custom {
    color: var(--mannito-secondary-color);
    text-decoration: none;
}

.link-secondary-custom:hover {
    color: var(--mannito-secondary-hover);
    text-decoration: underline;
}

.link-tertiary-custom {
    color: var(--mannito-tertiary-color);
    text-decoration: none;
}

.link-tertiary-custom:hover {
    color: var(--mannito-tertiary-hover);
    text-decoration: underline;
}

/* ========================================== */
/* Badge Variants                             */
/* ========================================== */
.badge-primary-custom {
    color: #fff;
    background-color: var(--mannito-primary-color);
}

.badge-secondary-custom {
    color: #fff;
    background-color: var(--mannito-secondary-color);
}

.badge-tertiary-custom {
    color: #fff;
    background-color: var(--mannito-tertiary-color);
}

/* ========================================== */
/* Alert Variants                             */
/* ========================================== */
.alert-primary-custom {
    color: var(--mannito-primary-active);
    background-color: var(--mannito-primary-light);
    border-color: var(--mannito-primary-border);
}

.alert-secondary-custom {
    color: var(--mannito-secondary-active);
    background-color: var(--mannito-secondary-light);
    border-color: var(--mannito-secondary-color);
}

.alert-tertiary-custom {
    color: var(--mannito-tertiary-active);
    background-color: var(--mannito-tertiary-light);
    border-color: var(--mannito-tertiary-color);
}