/**
 * Rapidex UI Theme — Sobrescreve style.bundle.css
 * Para reverter: remover o <link> deste arquivo no index.html
 *
 * Paleta:
 *   Brand Blue   #022C87  — Primary, Header, Sidebar, Links, Títulos
 *   Brand Orange #F39828  — CTA, btn-primary
 *   Brand Red    #A50F30  — Erros / Danger
 *   Light Blue   #C9DAFF  — Fundos suaves
 *   Cream        #F5DCC1  — Superfícies especiais
 */

/* =============================================================
   1. CSS Variables — cobre text-primary, bg-primary,
      border-primary, badges, spinners, focus rings, links, etc.
   ============================================================= */
:root,
[data-bs-theme=light] {
  /* Primary = Brand Blue */
  --bs-primary: #022C87;
  --bs-primary-rgb: 2, 44, 135;
  --bs-primary-text-emphasis: #011654;
  --bs-primary-bg-subtle: #C9DAFF;
  --bs-primary-border-subtle: #7a9de0;

  /* Links */
  --bs-link-color: #022C87;
  --bs-link-color-rgb: 2, 44, 135;
  --bs-link-hover-color: #011654;
  --bs-link-hover-color-rgb: 1, 22, 84;

  /* Danger = Brand Red */
  --bs-danger: #A50F30;
  --bs-danger-rgb: 165, 15, 48;
  --bs-danger-text-emphasis: #60091c;
  --bs-danger-bg-subtle: #f7c6cf;
  --bs-danger-border-subtle: #e07a8b;
}

/* =============================================================
   2. btn-primary — Fundo laranja + texto azul
   ============================================================= */
[data-bs-theme=light] .btn.btn-primary,
[data-bs-theme=light] .btn-primary,
.btn.btn-primary,
.btn-primary {
  --bs-btn-color: #022C87;
  --bs-btn-bg: #F39828;
  --bs-btn-border-color: #F39828;
  --bs-btn-hover-color: #022C87;
  --bs-btn-hover-bg: #e08820;
  --bs-btn-hover-border-color: #d07d1e;
  --bs-btn-focus-shadow-rgb: 243, 152, 40;
  --bs-btn-active-color: #022C87;
  --bs-btn-active-bg: #d07d1e;
  --bs-btn-active-border-color: #c07418;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #022C87;
  --bs-btn-disabled-bg: #F39828;
  --bs-btn-disabled-border-color: #F39828;
  color: #022C87 !important;
  background-color: #F39828 !important;
  border-color: #F39828 !important;
}

.btn.btn-primary:hover,
.btn-primary:hover,
.btn.btn-primary:not(.btn-active):hover:not(.btn-active),
.btn-check:active+.btn.btn-primary,
.btn-check:checked+.btn.btn-primary,
.btn.btn-primary:active,
.btn-primary:active,
.btn.btn-primary.active,
.btn-primary.active,
.btn.btn-primary.show,
.show>.btn.btn-primary.dropdown-toggle {
  color: #022C87 !important;
  background-color: #e08820 !important;
  border-color: #d07d1e !important;
}

/* =============================================================
   3. btn-outline-primary — Contorno azul, hover laranja
   ============================================================= */
.btn.btn-outline-primary,
.btn-outline-primary {
  --bs-btn-color: #022C87;
  --bs-btn-border-color: #022C87;
  --bs-btn-hover-color: #022C87;
  --bs-btn-hover-bg: #F39828;
  --bs-btn-hover-border-color: #F39828;
  --bs-btn-focus-shadow-rgb: 2, 44, 135;
  --bs-btn-active-color: #022C87;
  --bs-btn-active-bg: #F39828;
  --bs-btn-active-border-color: #F39828;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #022C87;
  --bs-btn-disabled-bg: transparent;
  --bs-btn-disabled-border-color: #022C87;
}

/* =============================================================
   4. btn-secondary — Branco com borda azul
   ============================================================= */
.btn.btn-secondary,
.btn-secondary {
  --bs-btn-color: #022C87;
  --bs-btn-bg: #ffffff;
  --bs-btn-border-color: #022C87;
  --bs-btn-hover-color: #ffffff;
  --bs-btn-hover-bg: #022C87;
  --bs-btn-hover-border-color: #022C87;
  --bs-btn-focus-shadow-rgb: 2, 44, 135;
  --bs-btn-active-color: #ffffff;
  --bs-btn-active-bg: #011654;
  --bs-btn-active-border-color: #011654;
  --bs-btn-disabled-color: #022C87;
  --bs-btn-disabled-bg: #ffffff;
  --bs-btn-disabled-border-color: #022C87;
}

/* =============================================================
   5. Metronic btn-light-primary — fundo suave azul / hover laranja
   ============================================================= */
.btn.btn-light-primary {
  color: #022C87 !important;
  background-color: #C9DAFF !important;
  border-color: transparent;
}

.btn.btn-light-primary:hover,
.btn.btn-light-primary:focus,
.btn.btn-light-primary:not(.btn-active):hover:not(.btn-active),
.btn-check:active+.btn.btn-light-primary,
.btn-check:checked+.btn.btn-light-primary,
.btn.btn-light-primary:active,
.btn.btn-light-primary.active,
.btn.btn-light-primary.show {
  color: #022C87 !important;
  background-color: #F39828 !important;
  border-color: transparent;
}

/* =============================================================
   6. Focus ring — inputs, selects com brand blue
   ============================================================= */
.form-control:focus,
.form-select:focus,
.form-check-input:focus {
  border-color: #7a9de0;
  box-shadow: 0 0 0 0.25rem rgba(2, 44, 135, 0.2);
}

/* =============================================================
   7. Checkbox / Radio checked — brand blue
   ============================================================= */
.form-check-input:checked {
  background-color: #022C87;
  border-color: #022C87;
}

/* =============================================================
   8. Card titles — brand blue
   ============================================================= */
.card-title.fw-bold.text-gray-900,
.card-label.fw-bold.text-gray-900 {
  color: #022C87 !important;
}

/* =============================================================
   9. Card border
   ============================================================= */
.card {
  border-color: #c7c7ca !important;
}

/* =============================================================
   10. Gray scale — navy-tinted (H:222°, DNA do Brand Blue)
       Metronic usa H:225-228°; ajuste empurra para H:222°
       e aumenta levemente a saturação nos tons escuros.
   ============================================================= */
:root,
[data-bs-theme=light] {
  /* Escuros — mais saturação navy */
  --bs-gray-900: #061033;
  --bs-gray-dark: #061033;
  --bs-gray-800: #1d2c4e;
  --bs-gray-700: #465374;

  /* Médios — pequeno nudge de hue */
  --bs-gray-600: #75819b;
  --bs-gray-500: #97a0b5;

  /* Claros — praticamente inalterados */
  --bs-gray-400: #c2c8d8;
  --bs-gray-300: #d9dde9;
  --bs-gray-200: #f0f1f5;
  --bs-gray-100: #f8f9fb;

  /* text-muted / text-body-secondary → gray-600 navy-tinted */
  --bs-secondary-color: #75819b;
  --bs-secondary-color-rgb: 117, 129, 155;
}

/* =============================================================
   10b. border-gray-* — mesmos valores navy-tinted do gray scale
        Metronic usa hex hardcoded; override necessário para alinhar
        com os --bs-gray-* redefinidos na seção 10.
   ============================================================= */
.border-gray-900 {
  border-color: #061033 !important;
}

.border-gray-800 {
  border-color: #1d2c4e !important;
}

.border-gray-700 {
  border-color: #465374 !important;
}

.border-gray-600 {
  border-color: #75819b !important;
}

.border-gray-500 {
  border-color: #97a0b5 !important;
}

.border-gray-400 {
  border-color: #c2c8d8 !important;
}

.border-gray-300 {
  border-color: #d9dde9 !important;
}

.border-gray-200 {
  border-color: #f0f1f5 !important;
}

.border-gray-100 {
  border-color: #f8f9fb !important;
}

/* =============================================================
   11. Navbar items no header primário — bg-light → Light Blue
       Escopo restrito ao .app-header-primary para não afetar
       bg-light em outras partes do app.
   ============================================================= */
.app-header-primary .bg-light {
  background-color: #C9DAFF !important;
}

/* =============================================================
   12. Mega-menu — fundo de cada item → Light Blue #C9DAFF
   ============================================================= */
.menu-extended .menu-item .menu-link {
  background-color: #C9DAFF !important;
  border-radius: 0.475rem;
  min-height: 72px;
  align-items: center !important;
  padding: 0.85rem 0.75rem !important;
}

.menu-extended .menu-item .menu-link:hover {
  background-color: #b0c8f7 !important;
}

/* =============================================================
   13. Botão Dashboards (ativo/here) — gradiente Brand Red → Cream
   ============================================================= */
#kt_app_header_menu .menu-item.here>.menu-link,
#kt_app_header_menu .menu-item.here.show>.menu-link {
  background: linear-gradient(135deg, #F39828, #F5DCC1) !important;
  border-radius: 0.475rem;
}

#kt_app_header_menu .menu-item.here>.menu-link .menu-title,
#kt_app_header_menu .menu-item.here.show>.menu-link .menu-title {
  color: #ffffff !important;
}

/* =============================================================
   14. nav-pills-custom — todas as tabs: fundo laranja + texto azul
   ============================================================= */
.nav-pills-custom:not(.nav-stretch) .nav-link {
  background-color: #F39828 !important;
  border-color: #F39828 !important;
  color: #022C87 !important;
}

.nav-pills-custom:not(.nav-stretch) .nav-link .nav-text {
  color: #022C87 !important;
}

.nav-pills-custom:not(.nav-stretch) .nav-link .nav-icon i {
  color: #022C87 !important;
}

.nav-pills-custom:not(.nav-stretch) .nav-link .bullet-custom {
  background-color: #022C87 !important;
}

.nav-pills-custom:not(.nav-stretch) .nav-link.active {
  background-color: #e08820 !important;
  border-color: #e08820 !important;
}

.nav-pills-custom:not(.nav-stretch) .nav-link.active .bullet-custom {
  background-color: #022C87 !important;
}