/* ------------------------------------------------------------------------------
*
*  	# Colores
*	
*	AZUL 1
*  	RGBA (0,0,71,1)
*	HEX #123F70
*	
*	AZUL 2
*  	RGBA (10,55,180,1)
*	HEX #0B67A5
*	
*	AZUL 3
*  	RGBA (0,110,190,1)
*	HEX #0B67A5
*
* ---------------------------------------------------------------------------- */

/* Corrigue el error de por que el select2 no se valida con el JavaScrip para validar formularios 02/Jun/2020*/
.was-validated .custom-select:invalid+.select2 .select2-selection {
  border-color: #dc3545 !important;
}

.was-validated .custom-select:valid+.select2 .select2-selection {
  border-color: #28a745 !important;
}

*:focus {
  outline: 0px;
}

.select2-container--classic .select2-results__options .select2-results__option[aria-selected=true],
.select2-container--default .select2-results__options .select2-results__option[aria-selected=true] {
  background-color: #0B67A5 !important;
  color: #FFFFFF !important;
}

/* Paleta de EcoViajes: azul del logotipo y naranja de acento. */
:root {
  --brand-blue: #0b67a5;
  --brand-blue-dark: #123f70;
  --brand-orange: #f39a16;
  --brand-orange-dark: #d77d08;
}

a, .text-primary { color: var(--brand-blue); }
a:hover { color: var(--brand-blue-dark); }
.btn-primary, .bg-primary, .badge-primary,
.pagination .page-item.active .page-link {
  background-color: var(--brand-blue) !important;
  border-color: var(--brand-blue) !important;
}
.btn-primary:hover, .btn-primary:focus {
  background-color: var(--brand-blue-dark) !important;
  border-color: var(--brand-blue-dark) !important;
}
.btn-outline-primary { color: var(--brand-blue); border-color: var(--brand-blue); }
.btn-outline-primary:hover { background-color: var(--brand-blue); border-color: var(--brand-blue); }
.form-control:focus, .custom-select:focus { border-color: var(--brand-blue); }
.nav-link.active, .dropdown-item.active { color: var(--brand-blue); }


.hidden {
  display: none;
}

html body {
  height: 100%;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  /*background-color: rgba(255,255,255,1);*/
  direction: ltr;
}

html {
  scroll-behavior: smooth;
  cursor: default;
}

.custom-file-label::after {
  content: 'Buscar' !important;
}

.required-field::after {
  content: ' *';
  color: red;
}

.full-width-img {
  width: 100%;
}

/* QUITAR FLECHAS DE INPUT NUMBER Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/*  QUITAR FLECHAS DE INPUT NUMBER Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

.editable-cell:hover {
  background-color: rgba(0,0,0,0.07);
}

.editable-cell input {
  min-width: 160px;
}

.editable-cell select {
  min-width: 160px;
}

.table-hover tbody tr{
  transition: all ease 50ms;

}

.table-hover tbody tr:hover {
  background-color: rgba(0,0,0,0.05);
}


.table tbody tr{
  transition: all ease 50ms;

}

.table tbody tr:hover {
  background-color: rgba(0,0,0,0.05);
}

.card-vista-titulos {
  padding: 40px 20px;
  margin: 20px auto;
  background: url(../../almacenamiento/recursos/banners/banner-02.jpg);
  background-size: cover;
  background-position: top;
}

.contrato-variable {
  text-transform: uppercase;
  font-weight: bold;
}

@media print {
  .card-contrato {
      background-color: white;
      height: 100%;
      width: 100%;
      top: 0;
      left: 0;
      margin: 0;
      padding: 15px;
      font-size: 14px;
      line-height: 18px;
  }
}

/* Estilo para la fila editada */
.fila-editada {
  background-color: #2583c283; /* Cambia el color de fondo según tus preferencias */
  transition: background-color 0.0s ease; /* Agrega una transición suave */
}

.no-modificable {
  background-color: rgba(252, 0, 0, 0.396); /* Cambia el color de fondo según tus preferencias */
  /* transition: background-color 0.5s ease; Agrega una transición suave */
  animation: parpadeo 1.5s infinite; /* Duración de la animación: 1 segundo, repetir infinitamente */
}

@keyframes parpadeo {
  0%, 50%, 100% {
      opacity: 1;
  }
  25%, 75% {
      opacity: 0.2;
  }
}

.custom-button {
  background-color: #ffffff00; /* Color de fondo rojo */
  color: #000000; /* Color de texto blanco */
  /* Otros estilos que desees aplicar */
}

.card-agregar .card {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.card-agregar:hover .card {
    transform: scale(1.08);
    box-shadow: 0 10px 25px rgba(0,0,0,0.2);
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
}
.user-navigation{align-items:center}.user-navigation .dropdown-user-link{display:flex!important;align-items:center;gap:.65rem;padding:.55rem .85rem!important;border-radius:12px;transition:background-color .2s}.user-navigation .dropdown-user-link:hover,.user-navigation .dropdown-user.show .dropdown-user-link{background:#eef6fc}.user-navigation .dropdown-toggle:after{margin-left:.2rem;color:#78908a}.user-navigation__identity{align-items:flex-start;flex-direction:column;line-height:1.15}.user-navigation__identity .user-name{max-width:170px;overflow:hidden;color:#29433d;font-weight:700;text-overflow:ellipsis;white-space:nowrap}.user-navigation__identity small{margin-top:.2rem;color:#879792;font-size:.67rem}.user-navigation__menu{width:285px;margin-top:.65rem;padding:.65rem;border:0;border-radius:15px;box-shadow:0 14px 38px rgba(32,65,58,.2)}.user-navigation__header{display:flex;align-items:center;gap:.8rem;padding:.7rem}.user-navigation__header .avatar{flex:0 0 auto}.user-navigation__header strong,.user-navigation__header small{display:block}.user-navigation__header strong{max-width:180px;overflow:hidden;color:#263e38;text-overflow:ellipsis;white-space:nowrap}.user-navigation__header small{margin-top:.15rem;color:#84948f;font-size:.72rem}.user-navigation__menu .dropdown-item{display:flex;align-items:center;gap:.7rem;padding:.7rem .65rem;border-radius:9px;color:#354d47;white-space:normal}.user-navigation__menu .dropdown-item:hover{color:#0b67a5;background:#eef6fc}.user-navigation__menu .dropdown-item>span:last-child{font-weight:600}.user-navigation__menu .dropdown-item small{display:block;margin-top:.1rem;color:#98a4a1;font-size:.66rem;font-weight:400}.user-navigation__item-icon{display:grid;flex:0 0 auto;width:34px;height:34px;border-radius:9px;color:#0b67a5;background:#e6f2fb;place-items:center}.user-navigation__menu .user-navigation__logout{color:#aa4d52}.user-navigation__logout .user-navigation__item-icon{color:#ad4c52;background:#fae9ea}.user-navigation__menu-toggle{display:grid!important;margin-left:.2rem;border-radius:10px;place-items:center}.user-navigation__menu-toggle:hover{background:#f0f5f4}@media(max-width:767px){.user-navigation-mobile-trigger{display:flex!important;align-items:center;justify-content:center;width:52px;height:52px;margin:4px; padding:6px!important;border-radius:14px;touch-action:manipulation}.user-navigation-mobile-trigger .avatar{width:38px;height:38px}.user-navigation-mobile-trigger .avatar img{width:38px;height:38px;object-fit:cover}.user-navigation .dropdown-user-link{min-width:52px;min-height:52px;padding:.45rem!important;justify-content:center;touch-action:manipulation}.user-navigation__menu{position:fixed!important;z-index:1050;top:68px!important;right:10px!important;left:10px!important;width:auto;max-height:calc(100vh - 80px);margin:0;overflow-y:auto;transform:none!important}.user-navigation__menu .dropdown-item{min-height:52px;padding:.85rem .7rem}}

@media (max-width: 767px) {
  /* La navegación de perfil ya vive en el encabezado. El contenedor colapsable
     anterior queda vacío en móvil y el tema lo convertía en una capa superior. */
  .header-navbar.navbar-with-menu .navbar-container,
  #navbar-mobile {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
    pointer-events: none !important;
  }

  .dropdown-backdrop {
    display: none !important;
    pointer-events: none !important;
  }

  .user-navigation--mobile .dropdown-user-link {
    width: 56px;
    height: 56px;
    margin: 2px 4px;
    padding: 8px !important;
    justify-content: center;
    touch-action: manipulation;
  }

  .user-navigation--mobile .dropdown-user-link .avatar,
  .user-navigation--mobile .dropdown-user-link .avatar img {
    width: 38px;
    height: 38px;
  }

  .user-navigation--mobile .dropdown-user-link .avatar img {
    object-fit: cover;
  }

  .user-navigation--mobile .dropdown-toggle::after {
    display: none;
  }

  .user-navigation--mobile .user-navigation__menu {
    position: absolute !important;
    z-index: 1000;
    top: calc(100% + 4px) !important;
    right: auto !important;
    left: 4px !important;
    width: calc(100vw - 20px);
    max-height: calc(100vh - 80px);
    transform: none !important;
  }

  .user-navigation--mobile .dropdown-menu:not(.show) {
    display: none !important;
    visibility: hidden;
    pointer-events: none !important;
  }

  .user-navigation--mobile .dropdown-menu.show {
    visibility: visible;
    pointer-events: auto;
  }

}

/* Un espacio estable para logos de distintas proporciones, sin recortarlos. */
.header-navbar .navbar-brand.site-brand {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 200px;
  height: 4.57rem;
  margin: 0;
  padding: 6px 0;
  box-sizing: border-box;
  overflow: hidden;
}

.header-navbar .site-brand .site-brand__logo {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}

.card-header .card-title img[src*="logoEcoViajes.png"] {
  width: 100%;
  max-width: 350px;
  height: auto;
}

@media (max-width: 767px) {
  .header-navbar .navbar-brand.site-brand {
    width: min(160px, calc(100vw - 160px));
  }
}

.user-profile-mobile-button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  margin: 2px 4px;
  padding: 8px !important;
  border: 0;
  border-radius: 14px;
  color: inherit;
  background: transparent;
  cursor: pointer;
  touch-action: manipulation;
}

.user-profile-mobile-button .avatar,
.user-profile-mobile-button .avatar img {
  width: 38px;
  height: 38px;
}

.user-profile-mobile-button .avatar img {
  object-fit: cover;
}

@media (max-width: 767px) {
  .user-profile-mobile-modal {
    z-index: 1050;
  }

  .user-profile-mobile-modal .modal-dialog {
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    max-width: none;
    margin: 0;
  }

  .user-profile-mobile-modal .modal-content {
    max-height: calc(100vh - 24px);
    border: 0;
    border-radius: 20px 20px 0 0;
    box-shadow: 0 -12px 35px rgba(32, 65, 58, .22);
  }

  .user-profile-mobile-modal__header {
    align-items: center;
    padding: 18px;
    border-bottom: 1px solid #edf1f0;
  }

  .user-profile-mobile-modal__identity {
    display: flex;
    align-items: center;
    gap: 12px;
  }

  .user-profile-mobile-modal__identity strong,
  .user-profile-mobile-modal__identity small {
    display: block;
  }

  .user-profile-mobile-modal__identity small {
    margin-top: 3px;
    color: #84948f;
  }

  .user-profile-mobile-modal__body {
    padding: 10px 14px calc(14px + env(safe-area-inset-bottom));
    overflow-y: auto;
  }

  .user-profile-mobile-modal__item {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 58px;
    padding: 10px;
    border-radius: 10px;
    color: #354d47;
  }

  .user-profile-mobile-modal__item > span:last-child {
    font-weight: 600;
  }

  .user-profile-mobile-modal__item small {
    display: block;
    margin-top: 2px;
    color: #98a4a1;
    font-size: .72rem;
    font-weight: 400;
  }

  .user-profile-mobile-modal__logout {
    margin-top: 6px;
    color: #aa4d52;
    border-top: 1px solid #edf1f0;
  }
}
