:root {
    /* === Colores base === */
    --bs-black: #000;
    --bs-white: #fff;
    --bs-yellow: #ff0;

    /* === Escala de grises === */
    --bs-gray-dark: #333;
    --bs-gray: #777;
    --bs-gray-light: #999;
    --bs-gray-lighter: #ddd;
    --bs-gray-lightest: #eee;
    --bs-gray-medium: #9a9a9a;
    --bs-gray-darker: #696969;
    --bs-gray-light-alt: #c8c8c8;
    --bs-gray-light-alt2: #c4c4c4;
    --bs-gray-ultra-light: #fafafa;
    --bs-gray-muted: #90a3ad;
    --bs-color-gray-dark: #4f4f4f;
    --bs-color-dark-gray: #444;
    --bs-color-dark-gray-full: #444444;
    --bs-color-gray-normal: #959595;
    --bs-color-gray-medium-dark: #656268;

    /* === Paleta Bootstrap extendida === */
    --bs-primary: #428bca;
    --bs-primary-hover: #3071a9;
    --bs-primary-link-hover: #2a6496;

    --bs-success: #3c763d;
    --bs-success-hover: #2b542c;
    --bs-success-bg: #dff0d8;
    --bs-success-bg-hover: #c1e2b3;

    --bs-info: #31708f;
    --bs-info-hover: #245269;
    --bs-info-bg: #d9edf7;
    --bs-info-bg-hover: #afd9ee;

    --bs-warning: #8a6d3b;
    --bs-warning-hover: #66512c;
    --bs-warning-bg: #fcf8e3;
    --bs-warning-bg-hover: #f7ecb5;

    --bs-danger: #a94442;
    --bs-danger-hover: #843534;
    --bs-danger-bg: #f2dede;
    --bs-danger-bg-hover: #e4b9b9;

    /* === Botones === */
    --bs-btn-default-color: #333;
    --bs-btn-default-bg: #fff;
    --bs-btn-default-border: #555;
    --bs-btn-default-hover-color: #333;
    --bs-btn-default-hover-bg: #e6e6e6;
    --bs-btn-default-hover-border: #333;

    --bs-btn-primary-color: #16344c;
    --bs-btn-primary-bg: #6bbaff;
    --bs-btn-primary-border: #6bbaff;
    --bs-btn-primary-hover-color: #fff;
    --bs-btn-primary-hover-bg: #3071a9;
    --bs-btn-primary-hover-border: #3071a9;

    --bs-btn-success-color: #fff;
    --bs-btn-success-bg: #5cb85c;
    --bs-btn-success-border: #4cae4c;
    --bs-btn-success-hover-color: #fff;
    --bs-btn-success-hover-bg: #449d44;
    --bs-btn-success-hover-border: #398439;

    --bs-btn-info-color: #fff;
    --bs-btn-info-bg: #5bc0de;
    --bs-btn-info-border: #46b8da;
    --bs-btn-info-hover-color: #fff;
    --bs-btn-info-hover-bg: #31b0d5;
    --bs-btn-info-hover-border: #269abc;

    --bs-btn-warning-color: #c09853;
    --bs-btn-warning-bg: #fcf8e3;
    --bs-btn-warning-border: #eea236;
    --bs-btn-warning-hover-color: #fff;
    --bs-btn-warning-hover-bg: #ec971f;
    --bs-btn-warning-hover-border: #d58512;

    --bs-btn-danger-color: #b94a48;
    --bs-btn-danger-bg: #d9534f;
    --bs-btn-danger-border: #d43f3a;
    --bs-btn-danger-hover-color: #fff;
    --bs-btn-danger-hover-bg: #c9302c;
    --bs-btn-danger-hover-border: #ac2925;

    --bs-btn-link-color: #428bca;
    --bs-btn-link-hover-color: #2a6496;

    /* === Layout === */
    --bs-topbar-bg: #f8f9fa;
    --bs-topbar-border: #a4b1ba;
    --bs-topbar-icon: #8697a3;
    --bs-topbar-hover: #e9ecef;
    --bs-topbar-shadow: rgba(0, 0, 0, 0.1);

    --bs-menu-bg: #2e6196;
    --bs-menu-hover: #295685;
    --bs-menu-shadow: #0b0e11;
    --bs-menu-text: #a8ceee;
    --bs-menu-text-hover: #fff;

    --bs-bg-light: #f5f5f5;
    --bs-bg-light-alt: #F9F9F9;
    --bs-bg-page: #eff3f6;
    --bs-bg-content: #fff;

    /* === Colores personalizados === */
    --bs-color-azul: #1657e8;
    --bs-color-amarillo: #febd40;
    --bs-color-rojo: #fd446c;
    --bs-color-verde: #00a65a;
    --bs-color-verde-light: #59e816;
    --bs-color-gris: #8697a3;
    --bs-color-success-custom: #30C227;

    /* === Estados y transparencias === */
    --bs-transparent: rgba(0, 0, 0, 0);
    --bs-bg-disabled: rgba(222, 228, 232, 0.68);
    --bs-bg-disabled-light: rgba(238, 238, 238, 0);
    --bs-bg-disabled-alt: #dfe4e7;

    /* === Extras agrupados por tono === */
    --bs-color-orange: #f7931e;
    --bs-color-orange-light: #fff3d1;
    --bs-color-orange-warning: #FFC107;
    --bs-color-orange-orange: #ec632b;
    --bs-color-orange-accent: #ff9c4b;
    --bs-color-orange-accent-alt: #e09c4b;

    --bs-color-indigo: #5f6dfd;
    --bs-color-indigo-light: #dadaff;
    --bs-color-indigo-very-light: #ececff;
    --bs-color-indigo-accent: #989cff;

    --bs-color-cyan-turquoise: #60c6cf;
    --bs-color-cyan-bright: #66cccc;
    --bs-color-teal: #55c69e;

    --bs-color-green-dark: #7aad68;
    --bs-color-green-darker: #598F26;
    --bs-color-green-success: #28a745;
    --bs-color-green-custom: #3bb055;
    --bs-color-green-dark-custom: #3bb05530;

    --bs-color-red-dark: #981a11;
    --bs-color-red-custom: #fe1010;
    --bs-color-red-frame: #e65647;
    --bs-color-red-danger: #F44336;
    --bs-color-red-accent: #f35958;
    --bs-bg-red-transparent: #ff11001a;

    /* === Sombras y bordes === */
    --bs-shadow-color: #0b0e11;
    --bs-border-light: #d7d4d4;
    --bs-border-light-alt: #cacdd0;
    --bs-border-light-blue: #84B1CA;
    --bs-border-light-gray: #d3d7d9;
    --bs-border-lighter-gray: #8998a4;
    --bs-border-light-gray-alt: #555;
    --bs-border-green: #7b9d00;
    --bs-border-green-bright: #7b9d00;
    --bs-border-red-dark: #981a11;
    --bs-border-content: #e1e4e8;
    --bs-border-default: #ccc;
    --bs-border-primary: #6bbaff;
    --bs-border-selected: #3071a9;
    --bs-border-muted: #777;

    /* === Iconos === */
    --bs-icon-color: #333;
    --bs-icon-color-hover: #428bca;
    --bs-icon-disabled-color: #999;

    /* === Textos === */
    --bs-text-primary: #16344c;
    --bs-text-secondary: #555;
    --bs-text-muted: #777;
    --bs-text-accent: #428bca;
    --bs-text-selected: #6bbaff;
    --bs-text-inverted: #fff;
    --bs-text-placeholder: #999;
    --bs-text-disabled: #999;

    /* === seleeccionados === */
    --bs-bg-selected: #3071a9;
    --bs-bg-selected-hover: #6bbaff;
    --bs-bg-selected-alt: #e6e6e6;
    --bs-bg-selected-alt-hover: #d4d4d4;

    /* === Fondos adicionales === */
    --bs-bg-light-gray: #e5e5e5;
    --bs-bg-light-gray-alt: #eef2f5;
    --bs-bg-light-gray-2: #f9f9f9;
    --bs-bg-light-gray-3: #e6e6e6;
    --bs-bg-very-light: #F3F3F3;
    --bs-bg-very-light-gray: #F2F5F9;
    --bs-bg-light-gray-extra: #D5D9DD;
    --bs-bg-blue-light: #c7e0ff;
    --bs-bg-green-light: #a5e1d3;
    --bs-bg-red-light: #FFABAB;
    --bs-bg-gray-very-light: #ddeeff;
    --bs-bg-cyan-transparent: #f0f8ff00;

    /* === Otros personalizados === */
    --bs-color-dark-text: #16344c;
    --bs-color-dark: #080808;
    --bs-color-orange-orange: #ec632b;
    --bs-color-dark-blue-custom: #333333;
    --bs-color-light-blue-bg: #b1e5e5;

    --bs-divider: #e2edf1;

    /* === Header profile y selects === */
    --bs-profile-menu-shadow: rgba(15, 23, 42, 0.35);
    --bs-profile-menu-text: #334155;
    --bs-profile-menu-icon: #5b972f;
    --bs-profile-menu-hover-bg: #e4f5d2;
    --bs-profile-menu-hover-text: #1f2937;
    --bs-profile-menu-divider: #e5e7eb;

    --bs-select-border: #cbd5e1;
    --bs-select-bg: #ffffff;
    --bs-select-shadow: rgba(15, 23, 42, 0.12);
    --bs-select-border-hover: #94a3b8;
    --bs-select-border-focus: #5b972f;
    --bs-select-focus-ring: rgba(91, 151, 47, 0.32);
    --bs-select-trigger-border: #e2e8f0;
    --bs-select-trigger-bg: #f8fafc;

    --bs-select-panel-border: #dbe3ec;
    --bs-select-panel-shadow: rgba(15, 23, 42, 0.35);
    --bs-select-panel-filter-bg: #f8fafc;
    --bs-select-panel-filter-border-bottom: #e2e8f0;
    --bs-select-panel-item-hover-bg: #eef6e7;
    --bs-select-panel-item-hover-text: #243b18;
}

/* Clases para sobrescribir Bootstrap sin editar el archivo original */
.text-primary {
    color: var(--bs-primary);
}

a.text-primary:hover,
a.text-primary:focus {
    color: var(--bs-primary-hover) !important;
}

.bg-primary {
    color: var(--bs-white);
    background-color: var(--bs-primary);
}

a.bg-primary:hover,
a.bg-primary:focus {
    background-color: var(--bs-primary-hover) !important;
}

.text-success {
    color: var(--bs-success);
}

a.text-success:hover,
a.text-success:focus {
    color: var(--bs-success-hover) !important;
}

.bg-success {
    background-color: var(--bs-success-bg);
}

a.bg-success:hover,
a.bg-success:focus {
    background-color: var(--bs-success-bg-hover) !important;
}

.text-info {
    color: var(--bs-info);
}

a.text-info:hover,
a.text-info:focus {
    color: var(--bs-info-hover) !important;
}

.bg-info {
    background-color: var(--bs-info-bg);
}

a.bg-info:hover,
a.bg-info:focus {
    background-color: var(--bs-info-bg-hover) !important;
}

.text-warning {
    color: var(--bs-warning);
}

a.text-warning:hover,
a.text-warning:focus {
    color: var(--bs-warning-hover) !important;
}

.bg-warning {
    background-color: var(--bs-warning-bg);
}

a.bg-warning:hover,
a.bg-warning:focus {
    background-color: var(--bs-warning-bg-hover) !important;
}

.text-danger {
    color: var(--bs-danger);
}

a.text-danger:hover,
a.text-danger:focus {
    color: var(--bs-danger-hover) !important;
}

.bg-danger {
    background-color: var(--bs-danger-bg);
}

a.bg-danger:hover,
a.bg-danger:focus {
    background-color: var(--bs-danger-bg-hover) !important;
}

.text-muted {
    color: var(--bs-gray);
}

mark,
.mark {
    background-color: var(--bs-warning-bg);
}

/* Clases para botones */
.btn-default {
    color: var(--bs-btn-default-color);
    background-color: var(--bs-btn-default-bg);
    border-color: var(--bs-btn-default-border);
}

.btn-default:hover,
.btn-default:focus,
.btn-default:active,
.btn-default.active,
.open>.dropdown-toggle.btn-default {
    color: var(--bs-btn-default-hover-color) !important;
    background-color: var(--bs-btn-default-hover-bg) !important;
    border-color: var(--bs-btn-default-hover-border) !important;
}

.btn-primary {
    color: var(--bs-btn-primary-color);
    background-color: var(--bs-btn-primary-bg);
    border-color: var(--bs-btn-primary-border);
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.open>.dropdown-toggle.btn-primary {
    color: var(--bs-btn-primary-hover-color) !important;
    background-color: var(--bs-btn-primary-hover-bg) !important;
    border-color: var(--bs-btn-primary-hover-border) !important;
}

.btn-success {
    color: var(--bs-btn-success-color);
    background-color: var(--bs-btn-success-bg);
    border-color: var(--bs-btn-success-border);
}

.btn-success:hover,
.btn-success:focus,
.btn-success:active,
.btn-success.active,
.open>.dropdown-toggle.btn-success {
    color: var(--bs-btn-success-hover-color) !important;
    background-color: var(--bs-btn-success-hover-bg) !important;
    border-color: var(--bs-btn-success-hover-border) !important;
}

.btn-info {
    color: var(--bs-btn-info-color);
    background-color: var(--bs-btn-info-bg);
    border-color: var(--bs-btn-info-border);
}

.btn-info:hover,
.btn-info:focus,
.btn-info:active,
.btn-info.active,
.open>.dropdown-toggle.btn-info {
    color: var(--bs-btn-info-hover-color) !important;
    background-color: var(--bs-btn-info-hover-bg) !important;
    border-color: var(--bs-btn-info-hover-border) !important;
}

.btn-warning {
    color: var(--bs-btn-warning-color);
    background-color: var(--bs-btn-warning-bg);
    border-color: var(--bs-btn-warning-border);
}

.btn-warning:hover,
.btn-warning:focus,
.btn-warning:active,
.btn-warning.active,
.open>.dropdown-toggle.btn-warning {
    color: var(--bs-btn-warning-hover-color) !important;
    background-color: var(--bs-btn-warning-hover-bg) !important;
    border-color: var(--bs-btn-warning-hover-border) !important;
}

.btn-danger {
    color: var(--bs-btn-danger-color);
    background-color: var(--bs-btn-danger-bg);
    border-color: var(--bs-btn-danger-border);
}

.btn-danger:hover,
.btn-danger:focus,
.btn-danger:active,
.btn-danger.active,
.open>.dropdown-toggle.btn-danger {
    color: var(--bs-btn-danger-hover-color) !important;
    background-color: var(--bs-btn-danger-hover-bg) !important;
    border-color: var(--bs-btn-danger-hover-border) !important;
}

.btn-link {
    color: var(--bs-btn-link-color);
    text-decoration: none;
    background-color: transparent;
    border-color: transparent;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.btn-link:hover,
.btn-link:focus {
    color: var(--bs-btn-link-hover-color) !important;
    text-decoration: underline !important;
    background-color: transparent !important;
}

/* Sobrescrituras adicionales de otros archivos CSS */
.btn.ui-state-default.btn-default,
.btn.ui-state-default.btn-grey,
.btn-grey {
    background-color: transparent;
    color: #000;
    border-radius: 4px;
}

.btn.ui-state-default.btn-default:hover,
.btn.ui-state-default.btn-grey:hover,
.btn-grey:hover {
    background-color: #fd416a !important;
    color: #fff !important;
}

.btn-danger.ui-state-hover {
    background-color: #f4543c;
}

.btn-danger {
    background-color: #e65647;
    border-color: #e65647;
    color: #fff;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.btn-call {
    background-color: #28a745;
    border-color: #28a745;
    color: #fff;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.red {
    color: red;
}

.green {
    color: green;
}