/**
 * Colores personalizados para GPS
 * Color principal: #005670
 * RGB: 0, 86, 112
 */

:root {
  /* Color primary principal */
  --bs-primary: #005670;
  --bs-primary-rgb: 0, 86, 112;
  
  /* Variantes de primary para textos y fondos */
  --bs-primary-text-emphasis: #2d2525;
  --bs-primary-bg-subtle: #ebe9e9;
  --bs-primary-border-subtle: #cec7c7;
  
  /* Sobrescribir el color purple que usaba Vuexy */
  --bs-purple: #005670;
}

/* Botones primary - con !important para forzar el estilo */
.btn-primary,
.btn.btn-primary,
button.btn-primary,
a.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: #005670;
  --bs-btn-border-color: #005670;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #534646;
  --bs-btn-hover-border-color: #463d3d;
  --bs-btn-focus-shadow-rgb: 0, 86, 112;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #463d3d;
  --bs-btn-active-border-color: #3d3535;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(34, 41, 47, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #005670;
  --bs-btn-disabled-border-color: #005670;
  
  color: #fff !important;
  background-color: #005670 !important;
  border-color: #005670 !important;
}

.btn-primary:hover,
.btn.btn-primary:hover,
button.btn-primary:hover,
a.btn-primary:hover {
  color: #fff !important;
  background-color: #534646 !important;
  border-color: #463d3d !important;
}

.btn-primary:focus,
.btn-primary:active,
.btn.btn-primary:focus,
.btn.btn-primary:active {
  color: #fff !important;
  background-color: #463d3d !important;
  border-color: #3d3535 !important;
  box-shadow: 0 0 0 0.25rem rgba(0, 86, 112, 0.5) !important;
}

/* Botones outline primary */
.btn-outline-primary,
.btn.btn-outline-primary,
button.btn-outline-primary,
a.btn-outline-primary {
  --bs-btn-color: #005670;
  --bs-btn-border-color: #005670;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #005670;
  --bs-btn-hover-border-color: #005670;
  --bs-btn-focus-shadow-rgb: 0, 86, 112;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #005670;
  --bs-btn-active-border-color: #005670;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(34, 41, 47, 0.125);
  --bs-btn-disabled-color: #005670;
  --bs-btn-disabled-bg: transparent;
  --bs-btn-disabled-border-color: #005670;
  --bs-gradient: none;
  
  color: #005670 !important;
  background-color: transparent !important;
  border-color: #005670 !important;
}

.btn-outline-primary:hover,
.btn.btn-outline-primary:hover,
button.btn-outline-primary:hover,
a.btn-outline-primary:hover {
  color: #fff !important;
  background-color: #005670 !important;
  border-color: #005670 !important;
}

.btn-outline-primary:focus,
.btn-outline-primary:active,
.btn.btn-outline-primary:focus,
.btn.btn-outline-primary:active {
  color: #fff !important;
  background-color: #005670 !important;
  border-color: #005670 !important;
  box-shadow: 0 0 0 0.25rem rgba(0, 86, 112, 0.5) !important;
}

/* Botones label primary (con fondo suave) */
.btn-label-primary {
  color: #005670 !important;
  background-color: rgba(0, 86, 112, 0.08) !important;
  border-color: transparent !important;
}

.btn-label-primary:hover {
  color: #fff !important;
  background-color: #005670 !important;
  border-color: #005670 !important;
}

/* Badges primary */
.badge.bg-primary {
  background-color: #005670 !important;
}

.badge.bg-label-primary {
  background-color: rgba(0, 86, 112, 0.08) !important;
  color: #005670 !important;
}

/* Avatares con bg-label-primary */
.avatar .avatar-initial.bg-label-primary,
.avatar-initial.bg-label-primary {
  background-color: rgba(0, 86, 112, 0.08) !important;
  color: #005670 !important;
}

/* Texto primary */
.text-primary {
  color: #005670 !important;
}

/* Fondo primary */
.bg-primary {
  background-color: #005670 !important;
}

/* Bordes primary */
.border-primary {
  border-color: #005670 !important;
}

/* Links primary */
a.text-primary:hover,
a.text-primary:focus {
  color: #534646 !important;
}

/* Alertas primary */
.alert-primary {
  --bs-alert-color: #2d2525;
  --bs-alert-bg: #ebe9e9;
  --bs-alert-border-color: #cec7c7;
}

/* Progress bar primary */
.progress-bar {
  background-color: #005670;
}

/* Forms - focus primary */
.form-control:focus,
.form-select:focus {
  border-color: rgba(0, 86, 112, 0.5);
  box-shadow: 0 0 0 0.25rem rgba(0, 86, 112, 0.25);
}

/* Checkbox y radio primary */
.form-check-input:checked {
  background-color: #005670;
  border-color: #005670;
}

/* Switches primary */
.form-switch .form-check-input:checked {
  background-color: #005670;
  border-color: #005670;
}

/* Tabs y Nav primary */
.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
  background-color: #005670;
}

/* Dropdown active primary */
.dropdown-item.active,
.dropdown-item:active {
  background-color: #005670;
}

/* Pagination primary */
.page-link {
  color: #005670;
}

.page-item.active .page-link {
  background-color: #005670;
  border-color: #005670;
}

/* Spinners primary */
.spinner-border.text-primary,
.spinner-grow.text-primary {
  color: #005670;
}

/* List group primary */
.list-group-item-primary {
  color: #2d2525;
  background-color: #ebe9e9;
}

.list-group-item-primary.list-group-item-action:hover,
.list-group-item-primary.list-group-item-action:focus {
  color: #2d2525;
  background-color: #cec7c7;
}

/* Toast primary */
.toast-header.bg-primary {
  background-color: #005670;
  color: #fff;
}

/* Accordion primary */
.accordion-button:not(.collapsed) {
  background-color: rgba(0, 86, 112, 0.08);
  color: #005670;
}

/* Offcanvas primary */
.offcanvas.offcanvas-primary {
  background-color: #005670;
}

/* Iconos - Asegurarse de que se muestren correctamente */
.menu-icon,
.tf-icons,
i[class*="ti-"],
i[class*="fa-"] {
  display: inline-block !important;
  font-style: normal !important;
}

/* ========================================
   SOBRESCRITURA ESPECÍFICA PARA EL MENÚ
   ======================================== */

/* Elementos de menú activos - forzar color personalizado */
.menu-item.active > .menu-link,
.menu-item.current > .menu-link,
.menu-item.open > .menu-link {
  background: linear-gradient(72.47deg, #005670 22.16%, rgba(0, 86, 112, 0.7) 76.47%) !important;
  color: #fff !important;
  box-shadow: 0 2px 6px 0 rgba(0, 86, 112, 0.48) !important;
}

/* Iconos en elementos activos */
.menu-item.active > .menu-link .menu-icon,
.menu-item.current > .menu-link .menu-icon,
.menu-item.open > .menu-link .menu-icon {
  color: #fff !important;
}

/* Texto de menú normal (no activo) - color oscuro visible */
.menu-item .menu-link {
  color: #435971 !important;
}

.menu-item .menu-link .menu-icon {
  color: rgba(0, 86, 112, 0.8) !important;
}

/* Hover en elementos de menú */
.menu-item .menu-link:hover {
  background-color: rgba(0, 86, 112, 0.04) !important;
  color: #435971 !important;
}

/* Submenús - indicador activo */
.menu-sub .menu-item.active .menu-link::before,
.menu-sub .menu-item.current .menu-link::before {
  background-color: #fff !important;
}

/* Badges primary en el menú */
.menu-link .badge.bg-primary {
  background-color: #005670 !important;
}

/* Links con clase text-primary */
a.text-primary,
.text-primary {
  color: #005670 !important;
}

/* Cualquier background primary */
[class*="bg-primary"],
.bg-primary {
  background-color: #005670 !important;
}

/* Cualquier borde primary */
[class*="border-primary"],
.border-primary {
  border-color: #005670 !important;
}

/* Gradientes que usen primary */
[style*="7367f0"],
[style*="7367F0"] {
  background: linear-gradient(72.47deg, #005670 22.16%, rgba(0, 86, 112, 0.7) 76.47%) !important;
}

/* ========================================
   CARD HEADERS CON COLOR PERSONALIZADO
   ======================================== */

/* Card header con color corporativo sólido y texto blanco */
.card-header {
  background-color: #00567083 !important;
  border-bottom: 1px solid #534646 !important;
  color: #fff !important;
}

.card-header h5,
.card-header .h5,
.card-header h1, .card-header h2, .card-header h3, .card-header h4, .card-header h6 {
  color: #fff !important;
  font-weight: 600;
}

/* Iconos en card-header */
.card-header i,
.card-header .ti {
  color: #fff !important;
}

/* ========================================
   NAV TABS (PESTAÑAS)
   ======================================== */

/* Estilos para tabs - color corporativo */
.nav-tabs .nav-link {
  color: #6c757d !important;
  border: none;
  border-bottom: 2px solid transparent !important;
}

.nav-tabs .nav-link:hover {
  color: #005670 !important;
  border-bottom-color: rgba(0, 86, 112, 0.3) !important;
}

.nav-tabs .nav-link.active,
.nav-tabs .nav-link.active:hover,
.nav-tabs .nav-link.active:focus,
.nav-tabs .nav-link[aria-selected="true"],
.nav-tabs .nav-link[aria-selected="true"]:hover,
.nav-tabs .nav-link[aria-selected="true"]:focus {
  color: #005670 !important;
  background-color: transparent !important;
  border-top: none !important;
  border-left: none !important;
  border-right: none !important;
  border-bottom: 2px solid #005670 !important;
  box-shadow: 0 -2px 0 #005670 inset !important;
}

/* Para tabs con diferentes alineaciones */
.nav-align-bottom .nav-tabs .nav-link.active,
.nav-align-bottom .nav-tabs .nav-link.active:hover,
.nav-align-bottom .nav-tabs .nav-link.active:focus {
  box-shadow: 0 2px 0 #005670 inset !important;
}

.nav-align-left .nav-tabs .nav-link.active,
.nav-align-left .nav-tabs .nav-link.active:hover,
.nav-align-left .nav-tabs .nav-link.active:focus {
  box-shadow: 2px 0 0 #005670 inset !important;
}

.nav-align-right .nav-tabs .nav-link.active,
.nav-align-right .nav-tabs .nav-link.active:hover,
.nav-align-right .nav-tabs .nav-link.active:focus {
  box-shadow: -2px 0 0 #005670 inset !important;
}