/* ===== Colores de marca (Okarik Perú · TICKETS) =====
   Paleta tomada del logo: rojo (#CF0707 / #E83030) y azul petróleo (#1F6584), más neutros.
   No se usan verdes, amarillos, naranjas, celestes ni morados: los estados se distinguen
   con tonos de rojo (urgente / alerta) y de azul (correcto / informativo).
   Se carga al final de cada página (después del tema) para prevalecer. */
:root {
    --m-rojo: #cf0707;  --m-rojo-osc: #ae1011; --m-rojo-900: #7d0a0b; --m-rojo-claro: #e8706f; --m-rojo-50: #fdecec;
    --m-azul: #1f6584;  --m-azul-osc: #174b63; --m-azul-claro: #5d8aa3; --m-azul-50: #e8f0f4;
    --m-tinta: #172b4c; --m-gris: #7d8798; --m-gris-claro: #e6e9ef; --m-fondo: #f3f4f7;
    /* Variables de Bootstrap 5 */
    --bs-primary: #cf0707; --bs-primary-rgb: 207, 7, 7;
    --bs-success: #1f6584; --bs-success-rgb: 31, 101, 132;
    --bs-info: #1f6584;    --bs-info-rgb: 31, 101, 132;
    --bs-warning: #e8706f; --bs-warning-rgb: 232, 112, 111;
    --bs-danger: #ae1011;  --bs-danger-rgb: 174, 16, 17;
    --bs-link-color: #1f6584;
}

/* ---------- Botones ---------- */
.btn-primary, .theme-primary .btn-primary, .btn-danger, .theme-primary .btn-danger {
    background-color: var(--m-rojo) !important; border-color: var(--m-rojo) !important; color: #fff !important;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active,
.btn-danger:hover, .btn-danger:focus, .btn-danger:active {
    background-color: var(--m-rojo-osc) !important; border-color: var(--m-rojo-osc) !important; color: #fff !important;
}
.btn-success, .btn-info, .theme-primary .btn-success, .theme-primary .btn-info {
    background-color: var(--m-azul) !important; border-color: var(--m-azul) !important; color: #fff !important;
}
.btn-success:hover, .btn-success:focus, .btn-success:active, .btn-info:hover, .btn-info:focus, .btn-info:active {
    background-color: var(--m-azul-osc) !important; border-color: var(--m-azul-osc) !important; color: #fff !important;
}
.btn-warning { background-color: var(--m-rojo-claro) !important; border-color: var(--m-rojo-claro) !important; color: #fff !important; }
.btn-secondary { background-color: var(--m-gris) !important; border-color: var(--m-gris) !important; color: #fff !important; }
.btn-primary-light, .btn-danger-light { background-color: var(--m-rojo-50) !important; border-color: transparent !important; color: var(--m-rojo) !important; }
.btn-primary-light:hover, .btn-danger-light:hover { background-color: var(--m-rojo) !important; color: #fff !important; }
.btn-info-light, .btn-success-light { background-color: var(--m-azul-50) !important; border-color: transparent !important; color: var(--m-azul) !important; }
.btn-info-light:hover, .btn-success-light:hover { background-color: var(--m-azul) !important; color: #fff !important; }
.btn-warning-light { background-color: var(--m-rojo-50) !important; border-color: transparent !important; color: var(--m-rojo-claro) !important; }
.btn-outline-primary, .btn-outline-danger { color: var(--m-rojo) !important; border-color: var(--m-rojo) !important; }
.btn-outline-primary:hover, .btn-outline-danger:hover { background-color: var(--m-rojo) !important; color: #fff !important; }
.btn-outline-success, .btn-outline-info { color: var(--m-azul) !important; border-color: var(--m-azul) !important; }
.btn-outline-success:hover, .btn-outline-info:hover { background-color: var(--m-azul) !important; color: #fff !important; }

/* ---------- Fondos, textos y bordes ---------- */
.bg-primary, .theme-primary .bg-primary { background-color: var(--m-rojo) !important; }
.bg-danger { background-color: var(--m-rojo-osc) !important; }
.bg-success, .bg-info { background-color: var(--m-azul) !important; }
.bg-warning { background-color: var(--m-rojo-claro) !important; }
.bg-primary-light, .bg-danger-light, .bg-warning-light { background-color: var(--m-rojo-50) !important; }
.bg-success-light, .bg-info-light { background-color: var(--m-azul-50) !important; }
.text-primary, .theme-primary .text-primary { color: var(--m-rojo) !important; }
.text-danger { color: var(--m-rojo-osc) !important; }
.text-success, .text-info { color: var(--m-azul) !important; }
.text-warning { color: var(--m-rojo-claro) !important; }
.border-primary, .border-danger { border-color: var(--m-rojo) !important; }
.border-success, .border-info { border-color: var(--m-azul) !important; }
.border-warning { border-color: var(--m-rojo-claro) !important; }

/* ---------- Etiquetas (badges / labels) ---------- */
.badge-primary, .label-primary, .badge.bg-primary { background-color: var(--m-rojo) !important; color: #fff !important; }
.badge-danger, .label-danger { background-color: var(--m-rojo-osc) !important; color: #fff !important; }
.badge-success, .label-success, .badge-info, .label-info { background-color: var(--m-azul) !important; color: #fff !important; }
.badge-warning, .label-warning { background-color: var(--m-rojo-claro) !important; color: #fff !important; }
.badge-secondary, .label-default { background-color: var(--m-gris) !important; color: #fff !important; }
/* Prioridad por urgencia (4 = crítico … 1 = bajo) */
.badge-prio-4 { background-color: var(--m-rojo-900) !important; color: #fff !important; }
.badge-prio-3 { background-color: var(--m-rojo) !important; color: #fff !important; }
.badge-prio-2 { background-color: var(--m-rojo-claro) !important; color: #fff !important; }
.badge-prio-1 { background-color: var(--m-azul) !important; color: #fff !important; }

/* ---------- Alertas ---------- */
.alert-primary, .alert-danger, .alert-warning {
    background-color: var(--m-rojo-50) !important; border-color: rgba(207, 7, 7, .25) !important; color: var(--m-rojo-900) !important;
}
.alert-success, .alert-info {
    background-color: var(--m-azul-50) !important; border-color: rgba(31, 101, 132, .25) !important; color: var(--m-azul-osc) !important;
}

/* ---------- Pestañas, paginación, progreso, formularios ---------- */
.nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link, .nav-pills .nav-link.active, .nav-pills .show > .nav-link,
.theme-primary .nav-pills > li > a.active {
    background-color: var(--m-rojo) !important; border-color: var(--m-rojo) !important; color: #fff !important;
}
.nav-tabs .nav-link:not(.active):hover { color: var(--m-rojo) !important; }
.page-item.active .page-link, .dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    background: var(--m-rojo) !important; border-color: var(--m-rojo) !important; color: #fff !important;
}
.page-link { color: var(--m-azul); }
.progress-bar { background-color: var(--m-rojo) !important; }
.progress-bar.bg-success, .progress-bar.bg-info { background-color: var(--m-azul) !important; }
.form-check-input:checked, .custom-control-input:checked ~ .custom-control-label::before {
    background-color: var(--m-rojo) !important; border-color: var(--m-rojo) !important;
}
[type="checkbox"]:checked + label:before { border-right-color: var(--m-rojo) !important; border-bottom-color: var(--m-rojo) !important; }
[type="checkbox"].filled-in:checked + label:after { background-color: var(--m-rojo) !important; border-color: var(--m-rojo) !important; }
[type="radio"]:checked + label:after, [type="radio"].with-gap:checked + label:after { background-color: var(--m-rojo) !important; border-color: var(--m-rojo) !important; }
[type="radio"]:checked + label:before, [type="radio"].with-gap:checked + label:before { border-color: var(--m-rojo) !important; }
.form-control:focus, .form-select:focus { border-color: var(--m-rojo) !important; box-shadow: 0 0 0 3px rgba(207, 7, 7, .12) !important; }
a { color: inherit; }
a.text-primary:hover, .hover-primary:hover { color: var(--m-rojo) !important; }

/* ---------- Librerías ---------- */
/* select2 */
.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted { background-color: var(--m-rojo) !important; color: #fff !important; }
.select2-container--default.select2-container--focus .select2-selection--multiple,
.select2-container--default.select2-container--open .select2-selection--single { border-color: var(--m-rojo) !important; }
.select2-container--default .select2-selection--multiple .select2-selection__choice { background-color: var(--m-rojo) !important; border-color: var(--m-rojo-osc) !important; color: #fff !important; }
/* DataTables */
.dt-buttons .btn, .dt-buttons .dt-button { background: var(--m-fondo) !important; color: var(--m-tinta) !important; border: 0 !important; }
.dt-buttons .btn:hover, .dt-buttons .dt-button:hover { background: var(--m-rojo-50) !important; color: var(--m-rojo) !important; }
table.dataTable tbody tr.selected, table.dataTable tbody tr.selected > * { background-color: var(--m-rojo-50) !important; box-shadow: none !important; color: var(--m-tinta) !important; }
/* SweetAlert2: botones e íconos */
.swal2-styled.swal2-confirm { background-color: var(--m-rojo) !important; }
.swal2-styled.swal2-deny, .swal2-styled.swal2-cancel { background-color: var(--m-gris) !important; }
.swal2-styled:focus { box-shadow: 0 0 0 3px rgba(207, 7, 7, .25) !important; }
.swal2-icon.swal2-success { border-color: var(--m-azul) !important; color: var(--m-azul) !important; }
.swal2-icon.swal2-success [class^="swal2-success-line"] { background-color: var(--m-azul) !important; }
.swal2-icon.swal2-success .swal2-success-ring { border-color: rgba(31, 101, 132, .3) !important; }
.swal2-icon.swal2-info, .swal2-icon.swal2-question { border-color: var(--m-azul) !important; color: var(--m-azul) !important; }
.swal2-icon.swal2-warning { border-color: var(--m-rojo-claro) !important; color: var(--m-rojo-claro) !important; }
.swal2-icon.swal2-error { border-color: var(--m-rojo) !important; color: var(--m-rojo) !important; }
.swal2-icon.swal2-error [class^="swal2-x-mark-line"] { background-color: var(--m-rojo) !important; }
.swal2-timer-progress-bar { background: rgba(207, 7, 7, .35) !important; }
.swal2-validation-message::before { background-color: var(--m-rojo) !important; }
/* Etiquetas (bootstrap-tagsinput) */
.bootstrap-tagsinput .tag, .bootstrap-tagsinput .label-info { background-color: var(--m-rojo) !important; color: #fff !important; }
/* CKEditor: botón activo */
.ck.ck-button.ck-on, a.ck.ck-button.ck-on { color: var(--m-rojo) !important; background: var(--m-rojo-50) !important; }
.ck.ck-editor__editable.ck-focused:not(.ck-editor__nested-editable) { border-color: var(--m-rojo) !important; box-shadow: none !important; }
/* Bordes de campos: gris neutro (el tema los traía celestes); rojo al enfocar o con error */
.form-control, .form-select, .input-group-text { border-color: #d5dae3 !important; }
body.dark-skin .form-control, body.dark-skin .form-select, body.dark-skin .input-group-text { border-color: #2a3b5c !important; }
.form-control.is-invalid, .form-select.is-invalid { border-color: var(--m-rojo-osc) !important; }

.form-control:focus, .form-select:focus { border-color: var(--m-rojo) !important; }

/* Estados del ticket (insignias): en todas las páginas, también para usuarios de área */
.badge-estado-abierto   { background-color: var(--m-azul-claro) !important; color: #fff !important; }
.badge-estado-proceso   { background-color: var(--m-rojo) !important; color: #fff !important; }
.badge-estado-pendiente { background-color: var(--m-rojo-claro) !important; color: #fff !important; }
.badge-estado-resuelto  { background-color: var(--m-azul) !important; color: #fff !important; }
.badge-estado-cerrado   { background-color: var(--m-gris) !important; color: #fff !important; }
.badge-estado-cancelado { background-color: var(--m-rojo-osc) !important; color: #fff !important; }
.tk-nota-cuerpo footer .badge { display: inline-block; }