/* ==========================================================================
   1. RESET GLOBAL, TIPOGRAFÍA Y CUERPO
   ========================================================================== */
html {
  font-size: 12px;
}

body, 
button, 
input, 
select, 
textarea, 
.form-control {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif !important;
  -webkit-font-smoothing: antialiased;
}

body {
  background-color: #fdfdfd;
  /*background: url('../../images/fondo_web.jpg') no-repeat center center fixed;*/
  background-image: 
  radial-gradient(at 0% 0%, rgba(226, 232, 240, 0.6) 0px, transparent 50%),
    radial-gradient(at 100% 100%, rgba(203, 213, 225, 0.5) 0px, transparent 50%),
    radial-gradient(at 50% 50%, rgba(248, 250, 252, 0.4) 0px, transparent 50%) !important;
	min-height: 100vh;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;*/
}

/*body {
  background-color: #f8fafc !important;
  background-image: 
    radial-gradient(at 0% 0%, rgba(224, 231, 255, 0.7) 0px, transparent 50%),
    radial-gradient(at 100% 100%, rgba(219, 234, 254, 0.8) 0px, transparent 50%),
    radial-gradient(at 50% 50%, rgba(241, 245, 249, 0.5) 0px, transparent 50%) !important;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
}
*/
/* ==========================================================================
   2. ESTILOS LEGADOS Y UTILIDADES GENERALES
   ========================================================================== */
.centrado { 
  text-align: center !important; 
}

.popover {
  max-width: 470px;
  min-width: 300px;
}

.listadon,
.listado,
.menu {
  font-size: 1em; 
}

select.grande,
.formselect {
  border: 1px solid #ccc;
  margin-bottom: 3px;
  text-align: left;
  padding: 6px;
  min-width: 120px;
  font-size: 16px;
}

option.grande {
  padding: 3px;
  vertical-align: middle;
  font-size: 16px !important;
  line-height: 150%;
  background: #fff;
}

div.vertical {
  transform: rotate(-90deg);
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
}

/* Form controls personalizados */
.form-control1 {
  display: inline;
  height: 31px;
  padding: 6px 12px;
  margin: 4px;
  font-size: 11px;
  line-height: 1.428571429;
  color: #555555;
  vertical-align: middle;
  background-color: #ffffff;
  border: 1px solid #cccccc;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
  transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

.form-control1:focus {
  border-color: #66afe9;
  outline: 0;
  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6);
  box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6);
}

.form-control1[disabled],
.form-control1[readonly],
fieldset[disabled] .form-control1 {
  cursor: not-allowed;
  background-color: #eeeeee;
}

/* ==========================================================================
   3. TEMA SAAS MODERNO: ALERTAS, FONDOS SOFT Y ACENTOS
   ========================================================================== */
/* Alertas Soft */
.alert-soft-primary   { background-color: #eff6ff !important; color: #1e40af !important; }
.alert-soft-secondary { background-color: #f8fafc !important; color: #475569 !important; }
.alert-soft-success   { background-color: #f0fdf4 !important; color: #166534 !important; }
.alert-soft-danger    { background-color: #fef2f2 !important; color: #991b1b !important; }
.alert-soft-warning   { background-color: #fefce8 !important; color: #854d0e !important; }
.alert-soft-info      { background-color: #f0f9ff !important; color: #0369a1 !important; }
.alert-soft-dark      { background-color: #f1f5f9 !important; color: #0f172a !important; }

/* Fondos Suaves (bg-soft) */
.bg-soft-primary   { background-color: #f0f5ff !important; color: #1e3a8a !important; }
.bg-soft-secondary { background-color: #f8fafc !important; color: #475569 !important; }
.bg-soft-success   { background-color: #f2f7f4 !important; color: #14532d !important; }
.bg-soft-danger    { background-color: #fff1f2 !important; color: #881337 !important; }
.bg-soft-warning   { background-color: #fffdf5 !important; color: #78350f !important; }
.bg-soft-info      { background-color: #f0f9ff !important; color: #0c4a6e !important; }
.bg-soft-dark      { background-color: #f1f5f9 !important; color: #0f172a !important; }

/* Bordes de Acento Mate para Tarjetas */
.card-accent-primary   { border-top: 2px solid #b4c6e7 !important; }
.card-accent-secondary { border-top: 2px solid #cbd5e1 !important; }
.card-accent-success   { border-top: 2px solid #a3c9a8 !important; }
.card-accent-danger    { border-top: 2px solid #e6b8b8 !important; }
.card-accent-warning   { border-top: 2px solid #e2c98d !important; }
.card-accent-info      { border-top: 2px solid #9dcbe3 !important; }
.card-accent-dark      { border-top: 2px solid #64748b !important; }

/* ==========================================================================
   4. PESTAÑAS (NAV TABS)
   ========================================================================== */
.nav-tabs .nav-link {
  background-color: #e9ecef;
  color: #495057;
  border-color: #dee2e6;
}

.nav-tabs .nav-link:hover {
  background-color: #ced4da;
  color: #212529;
}

.nav-tabs .nav-link.active {
  background-color: #f0f5ff !important;
  color: #1e3a8a !important;
  border-color: #b4c6e7 !important;
}

/* ==========================================================================
   5. BOTONES SOFT
   ========================================================================== */
.btn-soft-primary {
  background-color: #f0f5ff !important;
  color: #1e3a8a !important;
  border: 1px solid #b4c6e7 !important;
}
.btn-soft-primary:hover,
.btn-soft-primary:focus,
.btn-soft-primary:active,
.btn-soft-primary.active {
  background-color: #dbeafe !important;
  color: #1e3a8a !important;
  border-color: #93c5fd !important;
  box-shadow: none !important;
}

.btn-soft-secondary {
  background-color: #f8fafc !important;
  color: #475569 !important;
  border: 1px solid #cbd5e1 !important;
}
.btn-soft-secondary:hover,
.btn-soft-secondary:focus,
.btn-soft-secondary:active,
.btn-soft-secondary.active {
  background-color: #f1f5f9 !important;
  color: #334155 !important;
  border-color: #94a3b8 !important;
  box-shadow: none !important;
}

.btn-soft-success {
  background-color: #f2f7f4 !important;
  color: #14532d !important;
  border: 1px solid #a3c9a8 !important;
}
.btn-soft-success:hover,
.btn-soft-success:focus,
.btn-soft-success:active,
.btn-soft-success.active {
  background-color: #e1ebd9 !important;
  color: #14532d !important;
  border-color: #a3c9a8 !important;
  box-shadow: none !important;
}

.btn-soft-danger {
  background-color: #fff1f2 !important;
  color: #881337 !important;
  border: 1px solid #e6b8b8 !important;
}
.btn-soft-danger:hover,
.btn-soft-danger:focus,
.btn-soft-danger:active,
.btn-soft-danger.active {
  background-color: #ffe4e6 !important;
  color: #881337 !important;
  border-color: #fca5a5 !important;
  box-shadow: none !important;
}

.btn-soft-warning {
  background-color: #fffdf5 !important;
  color: #78350f !important;
  border: 1px solid #e2c98d !important;
}
.btn-soft-warning:hover,
.btn-soft-warning:focus,
.btn-soft-warning:active,
.btn-soft-warning.active {
  background-color: #fef3c7 !important;
  color: #78350f !important;
  border-color: #fde047 !important;
  box-shadow: none !important;
}

.btn-soft-info {
  background-color: #f0f9ff !important;
  color: #0c4a6e !important;
  border: 1px solid #9dcbe3 !important;
}
.btn-soft-info:hover,
.btn-soft-info:focus,
.btn-soft-info:active,
.btn-soft-info.active {
  background-color: #e0f2fe !important;
  color: #0c4a6e !important;
  border-color: #7dd3fc !important;
  box-shadow: none !important;
}

.btn-soft-dark {
  background-color: #f1f5f9 !important;
  color: #0f172a !important;
  border: 1px solid #64748b !important;
}
.btn-soft-dark:hover,
.btn-soft-dark:focus,
.btn-soft-dark:active,
.btn-soft-dark.active {
  background-color: #e2e8f0 !important;
  color: #0f172a !important;
  border-color: #475569 !important;
  box-shadow: none !important;
}

/* ==========================================================================
   6. PAGINACIÓN
   ========================================================================== */
.pagination-soft-primary .page-link,
.pagination .page-link {
  background-color: #ffffff !important;
  color: #475569 !important;
  border: 1px solid #e2e8f0 !important;
  margin: 0 2px;
  border-radius: 6px !important;
  transition: all 0.15s ease-in-out;
}

.pagination-soft-primary .page-link:hover,
.pagination-soft-primary .page-link:focus,
.pagination .page-link:hover,
.pagination .page-link:focus {
  background-color: #f8fafc !important;
  color: #1e3a8a !important;
  border-color: #cbd5e1 !important;
  box-shadow: none !important;
}

.pagination-soft-primary .page-item.active .page-link,
.pagination .page-item.active .page-link {
  background-color: #f0f5ff !important;
  color: #1e3a8a !important;
  border: 1px solid #b4c6e7 !important;
  font-weight: 700;
}

.pagination-soft-primary .page-item.disabled .page-link,
.pagination .page-item.disabled .page-link {
  background-color: #ffffff !important;
  color: #cbd5e1 !important;
  border-color: #f1f5f9 !important;
  opacity: 0.7;
}

/* Paginación de DataTables */
.dataTables_wrapper .dataTables_paginate {
  padding-top: 0.5rem;
}

.dataTables_wrapper .dataTables_paginate .page-item .page-link {
  background-color: #ffffff !important;
  color: #475569 !important;
  border: 1px solid #e2e8f0 !important;
  margin: 0 2px;
  border-radius: 6px !important;
  transition: all 0.15s ease-in-out;
  box-shadow: none !important;
}

.dataTables_wrapper .dataTables_paginate .page-item:not(.active):not(.disabled) .page-link:hover,
.dataTables_wrapper .dataTables_paginate .page-item:not(.active):not(.disabled) .page-link:focus {
  background-color: #f8fafc !important;
  color: #1e3a8a !important;
  border-color: #cbd5e1 !important;
}

.dataTables_wrapper .dataTables_paginate .page-item.active .page-link {
  background-color: #f0f5ff !important;
  color: #1e3a8a !important;
  border: 1px solid #b4c6e7 !important;
  font-weight: 700 !important;
}

.dataTables_wrapper .dataTables_paginate .page-item.disabled .page-link {
  background-color: #ffffff !important;
  color: #cbd5e1 !important;
  border-color: #f1f5f9 !important;
  opacity: 0.7;
}

/* ==========================================================================
   7. BUSCADOR INTEGRADO Y TWEAKS DE ALTURA (31px)
   ========================================================================== */
.custom-search-group {
  display: flex !important;
  align-items: stretch !important;
  height: 31px !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
  border-radius: 6px;
  transition: all 0.15s ease-in-out;
}

.custom-search-group .input-group-prepend {
  display: flex;
  height: 31px !important;
}

.custom-search-group .input-group-text,
.custom-search-group .form-control {
  border-color: #cbd5e1 !important;
  color: #334155;
  height: 31px !important;
}

.custom-search-group .input-group-text {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0.375rem 0.75rem !important;
}

.custom-search-group .form-control {
  padding-top: 0.375rem !important;
  padding-bottom: 0.375rem !important;
  line-height: 1.5 !important;
}

.custom-search-group .form-control:focus {
  box-shadow: none !important;
  border-color: #93c5fd !important;
}

.custom-search-group:focus-within {
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1) !important;
}

.custom-search-group:focus-within .input-group-text {
  border-color: #93c5fd !important;
  color: #2563eb !important;
}

.custom-search-group .form-control::placeholder {
  color: #94a3b8;
  font-size: 0.875rem;
}

/* Soporte para librería Typeahead */
.custom-search-group .twitter-typeahead {
  flex: 1 1 auto !important;
  width: 1% !important;
  display: flex !important;
  align-items: stretch !important;
  height: 31px !important;
}

.custom-search-group .twitter-typeahead .tt-input,
.custom-search-group .twitter-typeahead .tt-hint {
  height: 31px !important;
  border-top-left-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
}

/* ==========================================================================
   8. CABECERA PRINCIPAL Y MEGAMENÚ
   ========================================================================== */
.main-header {
  position: relative !important;
  background-color: #ffffff !important;
  border-bottom: 1px solid #e2e8f0 !important;
}

.main-header .btn-sm {
  font-size: 0.925rem !important;
  padding: 0.45rem 0.85rem !important;
  font-weight: 500;
}

.header-logo-icon {
  width: 42px;
  height: 42px;
  font-size: 1.1rem;
  border: 1px solid #b4c6e7;
}

.header-title {
  font-size: 1.1rem;
  letter-spacing: -0.02em;
  color: #0f172a !important;
}

.header-subtitle {
  font-size: 0.75rem;
  color: #64748b !important;
}

.main-header .dropdown-menu {
  font-size: 1rem !important;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  font-size: 0.875rem;
}

/* Megamenú Ancho Completo */
.megamenu-li {
  position: static;
}

.main-header .megamenu {
  position: absolute;
  width: calc(100% - 3rem) !important;
  left: -1rem !important;
  right: 1.5rem !important;
  top: 100% !important;
  margin-top: -1rem !important;
  border-radius: 10px !important;
  border: 1px solid #cbd5e1 !important;
  padding: 1.25rem !important;
  box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.08), 0 8px 10px -6px rgba(0, 0, 0, 0.03) !important;
}

.main-header .megamenu h6 {
  font-size: 1.1rem !important;
  margin-bottom: 0.75rem !important;
}

.main-header .megamenu .dropdown-item {
  font-size: 1rem !important;
  padding: 0.45rem 0.75rem !important;
  line-height: 1.4;
  border-radius: 6px;
  color: #334155;
  white-space: normal;
  transition: all 0.15s ease-in-out;
}

.main-header .megamenu .dropdown-item:hover {
  background-color: #f0f5ff !important;
  color: #1e3a8a !important;
}

.main-header .megamenu .dropdown-item:hover i {
  color: #2563eb !important;
}

/* Contador de Sesión */
#lasesion code {
  color: inherit !important;
  background-color: transparent !important;
  font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-weight: 600;
  font-size: 0.9rem;
  padding: 0;
}

/* ==========================================================================
   COMPACTACIÓN VERTICAL DEL MEGAMENÚ (RESPETANDO TAMAÑO 1em)
   ========================================================================== */

/* 1. Contenedor principal: relleno interno general reducido */
.main-header .megamenu {
  padding: 0.75rem 1rem !important; /* De 1.25rem pasa a 0.75rem arriba y abajo */
}

/* 2. Títulos de sección (columnas) con margen reducido */
.main-header .megamenu h6 {
  margin-bottom: 0.35rem !important; /* Reduce el hueco entre el título y las opciones */
  line-height: 1.2 !important;
}

/* 3. Elementos del menú (.dropdown-item) compactos */
.main-header .megamenu .dropdown-item {
  font-size: 1em !important;          /* Respetando tu tamaño de fuente */
  padding: 0.2rem 0.5rem !important;  /* Reduce el relleno vertical (de 0.45rem a 0.2rem) */
  line-height: 1.25 !important;       /* Interlineado ajustado */
  margin-bottom: 0.1rem !important;   /* Separación mínima entre ítems */
}

/* 4. Limpieza de márgenes en listas internas */
.main-header .megamenu ul,
.main-header .megamenu .list-unstyled {
  margin-bottom: 0 !important;
}

/* ============================================ modificación de todos los componentes =========== */
/* ==========================================================================
   OVERRIDE GLOBAL: ESTÉTICA SOFT UI PARA CLASES NATIVAS DE BOOTSTRAP
   Afecta automáticamente a todos los elementos con clases btn-*, bg-*, etc.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. BOTONES SÓLIDOS TRADICIONALES (.btn-primary, .btn-success, etc.)
   -------------------------------------------------------------------------- */
.btn-primary {
  background-color: #f0f5ff !important;
  color: #1e3a8a !important;
  border: 1px solid #b4c6e7 !important;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active {
  background-color: #dbeafe !important;
  color: #1e3a8a !important;
  border-color: #93c5fd !important;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12) !important;
}

.btn-secondary {
  background-color: #f8fafc !important;
  color: #475569 !important;
  border: 1px solid #cbd5e1 !important;
}
.btn-secondary:hover, .btn-secondary:focus, .btn-secondary:active, .btn-secondary.active {
  background-color: #f1f5f9 !important;
  color: #334155 !important;
  border-color: #94a3b8 !important;
  box-shadow: 0 0 0 3px rgba(100, 116, 139, 0.12) !important;
}

.btn-success {
  background-color: #f2f7f4 !important;
  color: #14532d !important;
  border: 1px solid #a3c9a8 !important;
}
.btn-success:hover, .btn-success:focus, .btn-success:active, .btn-success.active {
  background-color: #e1ebd9 !important;
  color: #14532d !important;
  border-color: #a3c9a8 !important;
  box-shadow: 0 0 0 3px rgba(22, 101, 52, 0.12) !important;
}

.btn-danger {
  background-color: #fff1f2 !important;
  color: #881337 !important;
  border: 1px solid #e6b8b8 !important;
}
.btn-danger:hover, .btn-danger:focus, .btn-danger:active, .btn-danger.active {
  background-color: #ffe4e6 !important;
  color: #881337 !important;
  border-color: #fca5a5 !important;
  box-shadow: 0 0 0 3px rgba(225, 29, 72, 0.12) !important;
}

.btn-warning {
  background-color: #fffdf5 !important;
  color: #78350f !important;
  border: 1px solid #e2c98d !important;
}
.btn-warning:hover, .btn-warning:focus, .btn-warning:active, .btn-warning.active {
  background-color: #fef3c7 !important;
  color: #78350f !important;
  border-color: #fde047 !important;
  box-shadow: 0 0 0 3px rgba(217, 119, 6, 0.12) !important;
}

.btn-info {
  background-color: #f0f9ff !important;
  color: #0c4a6e !important;
  border: 1px solid #9dcbe3 !important;
}
.btn-info:hover, .btn-info:focus, .btn-info:active, .btn-info.active {
  background-color: #e0f2fe !important;
  color: #0c4a6e !important;
  border-color: #7dd3fc !important;
  box-shadow: 0 0 0 3px rgba(14, 165, 233, 0.12) !important;
}

.btn-dark {
  background-color: #f1f5f9 !important;
  color: #0f172a !important;
  border: 1px solid #64748b !important;
}
.btn-dark:hover, .btn-dark:focus, .btn-dark:active, .btn-dark.active {
  background-color: #e2e8f0 !important;
  color: #0f172a !important;
  border-color: #475569 !important;
  box-shadow: 0 0 0 3px rgba(15, 23, 42, 0.12) !important;
}

/* --------------------------------------------------------------------------
   2. BOTONES CON BORDE (.btn-outline-primary, .btn-outline-success, etc.)
   -------------------------------------------------------------------------- */
.btn-outline-primary {
  color: #1e3a8a !important;
  border-color: #b4c6e7 !important;
  background-color: transparent !important;
}
.btn-outline-primary:hover, .btn-outline-primary:active {
  background-color: #f0f5ff !important;
  color: #1e3a8a !important;
  border-color: #93c5fd !important;
}

.btn-outline-secondary {
  color: #475569 !important;
  border-color: #cbd5e1 !important;
  background-color: transparent !important;
}
.btn-outline-secondary:hover, .btn-outline-secondary:active {
  background-color: #f8fafc !important;
  color: #334155 !important;
  border-color: #94a3b8 !important;
}

.btn-outline-success {
  color: #14532d !important;
  border-color: #a3c9a8 !important;
  background-color: transparent !important;
}
.btn-outline-success:hover, .btn-outline-success:active {
  background-color: #f2f7f4 !important;
  color: #14532d !important;
}

.btn-outline-danger {
  color: #881337 !important;
  border-color: #e6b8b8 !important;
  background-color: transparent !important;
}
.btn-outline-danger:hover, .btn-outline-danger:active {
  background-color: #fff1f2 !important;
  color: #881337 !important;
}

.btn-outline-warning {
  color: #78350f !important;
  border-color: #e2c98d !important;
  background-color: transparent !important;
}
.btn-outline-warning:hover, .btn-outline-warning:active {
  background-color: #fffdf5 !important;
  color: #78350f !important;
}

.btn-outline-info {
  color: #0c4a6e !important;
  border-color: #9dcbe3 !important;
  background-color: transparent !important;
}
.btn-outline-info:hover, .btn-outline-info:active {
  background-color: #f0f9ff !important;
  color: #0c4a6e !important;
}

/* --------------------------------------------------------------------------
   3. FONDOS DE UTILIDAD (.bg-primary, .bg-success, etc.)
   -------------------------------------------------------------------------- */
.bg-primary   { background-color: #f0f5ff !important; color: #1e3a8a !important; }
.bg-secondary { background-color: #f8fafc !important; color: #475569 !important; }
.bg-success   { background-color: #f2f7f4 !important; color: #14532d !important; }
.bg-danger    { background-color: #fff1f2 !important; color: #881337 !important; }
.bg-warning   { background-color: #fffdf5 !important; color: #78350f !important; }
.bg-info      { background-color: #f0f9ff !important; color: #0c4a6e !important; }
.bg-light     { background-color: #f8fafc !important; color: #334155 !important; }
.bg-dark      { background-color: #f1f5f9 !important; color: #0f172a !important; }

/* --------------------------------------------------------------------------
   4. INSIGNIAS / BADGES (.badge-primary, .badge-success, etc.)
   -------------------------------------------------------------------------- */
.badge-primary   { background-color: #dbeafe !important; color: #1e3a8a !important; border: 1px solid #b4c6e7; }
.badge-secondary { background-color: #f1f5f9 !important; color: #475569 !important; border: 1px solid #cbd5e1; }
.badge-success   { background-color: #dcfce7 !important; color: #14532d !important; border: 1px solid #a3c9a8; }
.badge-danger    { background-color: #ffe4e6 !important; color: #881337 !important; border: 1px solid #e6b8b8; }
.badge-warning   { background-color: #fef3c7 !important; color: #78350f !important; border: 1px solid #e2c98d; }
.badge-info      { background-color: #e0f2fe !important; color: #0c4a6e !important; border: 1px solid #9dcbe3; }

/* --------------------------------------------------------------------------
   5. TARJETAS Y FORMULARIOS (Toque SaaS Moderno)
   -------------------------------------------------------------------------- */
.card {
  border: 1px solid #e2e8f0 !important;
  border-radius: 8px !important;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.05), 0 1px 2px 0 rgba(0, 0, 0, 0.03) !important;
}

.card-header {
  border-bottom: 1px solid #e2e8f0 !important;
}

.form-control, .custom-select {
  border-color: #cbd5e1 !important;
  border-radius: 6px !important;
  color: #334155 !important;
}

.form-control:focus, .custom-select:focus {
  border-color: #93c5fd !important;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12) !important;
}

/* ==========================================================================
   DIFERENCIACIÓN: BOTÓN PRINCIPAL (CTA) VS OUTLINE
   ========================================================================== */

/* ==========================================================================
   AJUSTE DE COLOR: AZUL MARINO SOBRIO / MATTE NAVY (ALTO CONTRASTE)
   ========================================================================== */

/* 1. BOTÓN PRINCIPAL: Fondo pastel mate + Texto azul marino muy oscuro */
.btn-primary {
  background-color: #dbeafe !important;  /* Fondo azul suave mate */
  color: #1e3a8a !important;             /* Azul marino profundo (elegante y cero chillón) */
  border: 1px solid #93c5fd !important;   /* Borde azul suave */
  font-weight: 600 !important;           /* Peso semi-negrita para destacar */
  box-shadow: 0 1px 3px rgba(15, 39, 82, 0.10), 0 1px 2px rgba(0, 0, 0, 0.04) !important;
  transition: all 0.15s ease-in-out !important;
}

.btn-primary:hover, 
.btn-primary:focus, 
.btn-primary:active, 
.btn-primary.active {
  background-color: #bfdbfe !important;
  color: #091a3a !important;             /* Azul marino aún más oscuro al interactuar */
  border-color: #60a5fa !important;
  box-shadow: 0 2px 5px rgba(15, 39, 82, 0.18) !important;
}

/* 2. BOTÓN OUTLINE: Texto pizarra/azul desaturado mate */
.btn-outline-primary {
  background-color: transparent !important;
  color: #1e3a8a !important;             /* Tono pizarra neutro oscuro */
  border: 1px solid #cbd5e1 !important;   /* Borde gris sutil */
  font-weight: 500 !important;
  box-shadow: none !important;
  transition: all 0.15s ease-in-out !important;
}

.btn-outline-primary:hover, 
.btn-outline-primary:active {
  background-color: #f0f5ff !important;
  color: #0f2752 !important;             /* Pasa al azul marino profundo al hacer hover */
  border-color: #93c5fd !important;
}

.card-body.borde-card {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
  border: none;  /* Opcional: si quieres quitar el borde anterior para que la sombra luzca más limpia */
}