:root {
  /* Sobrescribir Bootstrap */
  --bs-primary: #3688fc !important;
  --bs-primary-rgb: 54, 136, 252 !important;

  /* Sobrescribir variables personalizadas de app-modern */
  --ct-primary: #3688fc !important;
  --ct-primary-rgb: black !important;
  --color-acento: #ff8800;
  --color-icono-menu: #3688fc;
}

/* Asegurar que bg-primary use el azul */
.bg-primary {
  background-color: var(--bs-primary) !important;
}

/* Botones primary */
.btn-primary {
  background-color: var(--bs-primary) !important;
  border-color: var(--bs-primary) !important;
}

.btn-primary:hover {
  background-color: #2a78e0 !important;
  /* azul un poco más oscuro */
  border-color: #2a78e0 !important;
}

/* Texto primary */
.text-primary {
  color: var(--bs-primary) !important;
}



html, body {
  height: 100%;
  margin: 0;
}
#main, #mainLoader, #loginContainer {
  height: 100%;
}
iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: none;
}

.home-icono-opcion {
  text-align: center;
  color: var(--color-acento) /* #DA1A23 */;
}

.home-opcion-menu {
width: 170px; height: 143px;
border-radius: 5px;
margin: 3px;
align-content: center;
padding: 4px;
cursor: pointer;
}


.home-texto-opcion {
cursor: pointer;
text-align: center;
color: rgba(0, 0, 0, 0.70);
text-align: center;
font-family: 'Montserrat', sans-serif;
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: normal;
}



/*LOGIN*/
.login-container{
min-width: 350px;
max-width: 400px;
justify-self: center;
}
.custom-card-header{
/* background: linear-gradient(60deg, #052859, #e8363e) !important; */
background: linear-gradient(60deg, #0A2F6B, #F02B2B) !important;
}

.font-description-system{
color: var(--color-grey);
font-weight: 500;
}

.login-container .form-group {
width: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding: 10px;
}
.login-container .input-group {
width: 100%;
}
.login-container .form-control {
border: 2px solid #ced4da;
border-radius: 0;
padding: 12px;
height: 42px;
}
.login-container .input-group-icon {
background: #052859 !important;
color: var(--color-white);
border-radius: 0;
padding: 12px;
}
.text-forgot-password{
color: #052859 !important;
font-weight: 400;
}
.forgot-password {
text-align: right;
}
.icon-login{
max-height: 100px;
height: 100px;
}
.div-logo-center{
display: none;
}
.shared-login{
width: 400px;
}
.justify-self-center{
justify-self: center;
}

.icono-forms{
background-color: var(--color-grey-light); 
color: var(--color-primario);
opacity: 90%;
}

/* MainMenu */
.dropend .dropdown-toggle:empty::after {
margin-left: 5px;
}
.header {
background: var(--color-white) !important;
}

.texto-nombre-usuario {
padding: 0; margin: 0;
overflow: hidden;
text-align: end;
text-wrap: wrap;
}
.main-panel-menu {
border: 1px solid rgba(0, 0, 0, 0.10);
background: var(--color-white);
box-shadow: 2px 0px 2px 1px rgba(0, 0, 0, 0.10);
}

.barra-menu {
position: fixed;
background: #ffffff;         /* fondo blanco */
border: none !important;     /* elimina cualquier borde */
border-radius: 0.5rem;       /* esquinas redondeadas (8px) */
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15); /* opcional: leve sombra para que "flote" */
z-index: 501;
overflow: hidden;            /* evita que el contenido sobresalga de bordes redondeados */
}

.item-menu{
padding: 20px;
}

.texto-menu {
color: var(--color-grey);
text-align: center;
font-weight: 500;
line-height: normal;
text-decoration: none;
}


.item-menu:hover .texto-menu {
color: var(--ct-link-color);
}
.item-menu:hover {
color: var(--ct-link-color);
}
.icono-menu {
color:var(--color-grey);
opacity: 95%;
cursor: pointer;
text-align: center;
font-size: 20px;
}

.texto-menu .active {
color: var(--ct-link-color);
}
/* .icono-menu:hover {
color: var(--color-acento);
opacity: 65%;
} */
.icono-menu-nav {
color:var(--color-primario) !important;
opacity: 90%;
cursor: pointer;
width: 30px;
text-align: center;
}

.icono-menu-nav:hover {
color: var(--color-red-hover)
}


.divisor-menu {
color: var(--color-primario);
opacity: 90%;
margin-top: 10;
margin-bottom: 0;
}
.toggler-menu {
color: var(--color-grey);
opacity: 90%;
cursor: pointer;
width: 30px;
}

.toggler-menu:hover{
color: var(--color-red-hover)
}
.barra-opciones {
left: 0; bottom: 0;
position: fixed;
border: 1px solid rgba(0, 0, 0, 0.10);
background: var(--color-white);
box-shadow: 2px 0px 2px 1px rgba(0, 0, 0, 0.10);
z-index: 500;
}
.margen-inferior-opciones {
height: 80px;
}
.margen-inferior {
height: 80px;
}
.opcion-movil {
width: 60px;
margin-top: 10px;
margin-left: 5px;
margin-right: 5px;
text-align: center;
line-height: 20px;
}
.contenedor-icono-opcion-movil {
width: 70px;
}
.icono-opcion-movil {
color: var(--color-primario);
opacity: 90%;
}

.barra-migas{
font-family: 'Montserrat', sans-serif;
font-size: 14px;
}

.alert-secondary-select {
color: #41464b;
background-color: #EAEBF2 !important;
border-color: #F8C4C6; 
}



.seccion-image {
width: auto;
height: auto;
}

.seccion-sincontent {
display: flex;
align-items: center;
}

.seccion-container{
display: grid;
place-items: center;
margin: auto;
}

.icono-menu-home {
color: var(--color-acento) /* #DA1A23 */;
opacity: 65%;
cursor: pointer;
width: 50px;
text-align: center;
}
.item-menu-home {
font-size: 16px;
padding-top: 5px;
padding-bottom: 5px;
}
.home-notificacion {
width: 260px; height: 94px;
border-radius: 5px;
border: 1px solid rgba(0, 0, 0, 0.20);
background: var(--color-white);
box-shadow: 0px 3px 3px 0px rgba(0, 0, 0, 0.25);
margin: 20px;
padding: 20px;
cursor: pointer;
}
.home-icono-notificacion {
text-align: center;
color: var(--color-acento) /* #DA1A23 */;
opacity: 65%;
}
.home-texto-notificacion {
cursor: pointer;
text-align: center;
color: rgba(0, 0, 0, 0.70);
text-align: center;
font-family: 'Montserrat', sans-serif;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: normal;
}

/* Estilos secciones */
.seccion {
background-color: var(--color-white);
background-repeat: repeat;
padding-top: 30px;
padding-bottom: 30px;
padding-left: 50px; 
padding-right: 50px;
}
.titulo-seccion {
color: var(--color-primario);
text-align: center;
font-family: 'Montserrat', sans-serif;
font-size: 24px;
font-style: normal;
font-weight: 500;
line-height: normal;
border-bottom:3px solid var(--color-acento) /* rgba(235, 60, 70, 0.80) */;
padding-bottom: 4px;
}

.titulo-subseccion {
color: var(--color-primario) /* #28367B */ !important;
text-align: center;
font-family: 'Montserrat', sans-serif;
font-size: 14px;
font-weight: 550;
line-height: normal;
padding-bottom: 4px;
text-transform: uppercase;
}


/* ===== ALERTAS ===== */
.alert {
padding: 12px 16px;
border-radius: 5px;
margin-bottom: 15px;
font-size: 14px;
}

.alert-success {
background-color: var(--color-backgroundalerts-success);
border-left: 5px solid var(--color-success);
color: var(--color-secundario-texto);
}

.alert-error {
background-color: var(--color-backgroundalerts-error);
border-left: 5px solid var(--color-danger);
color: #a62127;
}

.alert-warning {
background-color: var(--color-backgrounalerts-waring);
border-left: 5px solid var(--color-warning);
color: var(--color-secundario-texto);
}


/* Otros estilos*/
.no-border{ border: none !important;}
.shadow-xs { box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);}
.shadow-sm { box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);}
.shadow-md { box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);}
.shadow-lg { box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2);}
.shadow-xl { box-shadow: 0 10px 20px rgba(0, 0, 0, 0.25);}  
.border-bottom-radius{
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
}
.h-100-p{height: 100%;}

.list-group-item{
color: var(--color-secundario-texto);
font-size: 12px !important;
white-space: normal !important;
word-break: break-word;
}

.nav-link{
color: var(--color-secundario-texto)
}

.accordion-button{
font-size: 12px !important;
}

.accordion-button span#titulo {
white-space: normal !important;
word-break: break-word;
}


.orange-custom {
background-color: #ff8800; /* naranja fuerte */
color: white;
}



html[data-topbar-color=dark] {
  --ct-topbar-bg: #0071BC;
  --ct-topbar-item-color: #FFFFFF;
  --ct-topbar-item-hover-color: #bccee4;
  --ct-topbar-search-bg: #1084D3;
  --ct-topbar-user-bg: #0B7DCB;
  --ct-topbar-user-border: #1084D3;
}

.btn-orange {
  background-color: #fd7e14;  /* naranja Bootstrap-ish */
  color: white;
  border-color: #fd7e14;
}

.btn-orange:hover {
  background-color: #e76f10;
  border-color: #e76f10;
  color: white;
}

.dropzone-custom {
  border: 2px dashed #ccc;
  border-radius: 10px;
  background-color: #fafafa;
  cursor: pointer;
  transition: background-color 0.3s;
}
.dropzone-custom:hover {
  background-color: #f0f8ff;
}

.btn-upload-file-custom {
  border-color: red !important;
  border-style: none !important;
  background-color: transparent !important;
}
.tabla-evidencia th {
  background-color: transparent !important;
  border: none !important;
  box-shadow: none;
  font-weight: normal;
  padding: 0.5rem;
}

.tabla-evidencia tbody tr {
  border: 1px solid #ccc;
  border-radius: 0.5rem;
  background-color: transparent;
  overflow: hidden;
  display: block;
  margin-bottom: 0.5rem; 
  width: 100%;
}

.tabla-evidencia tbody td {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
  padding: 0.5rem;
  border: none; /* Opcional: quita el borde de celdas */
  width: 100%;
}


.tabla-evidencia tbody td:first-child {
  width: 99%;
  text-align: left;
  padding: 0.5rem;
}

.tabla-evidencia tbody td:last-child {
  width: 1%;
  text-align: right;
  padding: 0.5rem;
}

html[data-topbar-color=dark] {
  --ct-topbar-bg: #414756;
  --ct-topbar-item-color: #ECECEC;
  --ct-topbar-item-hover-color: #bccee4;
  --ct-topbar-search-bg: #414756;
  --ct-topbar-user-bg: #FF9800;
  --ct-topbar-user-border: #414d5d;

}

.dropdown-menu {
  --ct-dropdown-font-size: 1rem;
  --ct-dropdown-link-hover-color: #ffffff;
  --ct-dropdown-link-hover-bg: #FF9800;
}

.bg-gray-500 {
  background-color: #a7acb6 !important; /* Gris medio estilo Tailwind */
}

.bg-gray-200 {
  background-color: #d0d9f0 !important; /* Gris medio estilo Tailwind */
}

.bg-azul-500 {
  background-color: #4A90E2 !important; /* Gris medio estilo Tailwind */
}

  /* Que se vea clickeable en toda el área */
  .dropzone-custom { cursor: pointer; user-select: none; }
  .dropzone-custom:focus { outline: 2px solid #4A90E2; outline-offset: 2px; }
  /* Opcional: efecto al arrastrar archivos encima */
  .dropzone-custom.is-dragover { background: rgba(0,0,0,0.04); }

  .ck-editor__editable {
    min-height: 100px; 
  }


    .badge-estado {
      font-size: smaller;
    }
  
    .table-tickets th:not(:first-child) {
      width: 150px;
      max-width: 150px;
      min-width: 150px;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }