/* BEGIN CUSTOM CSS */

select-table-button.active {
  background-color: #91daf7;
}
.container {
  -ms-overflow-style: none; /* Internet Explorer 10+ */
  scrollbar-width: none; /* Firefox */
}
.container::-webkit-scrollbar {
  display: none; /* Safari and Chrome */
}

.more-rounded {
  border-radius: 40px !important;
}

.custom-rounded {
  border-radius: 20px;
}

.color-welcs {
  color: var(--bgk-primary-owner) !important;
}

.color-welcs-h {
  color: var(--bgk-primary-owner) !important;
}

.color-welcs-h:hover {
  color: var(--bgk-primary-owner-alternate) !important;
}

.blur-overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 30px;
  background: linear-gradient(
    to right,
    rgba(255, 255, 255, 1),
    rgba(255, 255, 255, 0)
  );
  pointer-events: none; /* No interferir con la funcionalidad de los botones */
}
.blur-overlay.right {
  right: 0;
  transform: scaleX(-1); /* Reflejar el gradiente para el lado derecho */
}
.blur-overlay.left {
  left: 0;
}

.custom-cancel-button {
  background-color: #e6e6e6 !important;
  border-color: #e6e6e6 !important;
  color: black !important;
}

.custom-cancel-button:hover {
  background-color: #d3d3d3 !important;
  border-color: #d3d3d3 !important;
}

.swal2-backdrop-show {
  background-color: transparent !important; /* Hace el fondo transparente */
  backdrop-filter: blur(8px); /* Aplica un efecto de desenfoque */
}

.swal2-icon.swal2-success .swal2-success-circular-line-left,
.swal2-icon.swal2-success .swal2-success-circular-line-right,
.swal2-icon.swal2-success .swal2-success-fix,
.swal2-icon.swal2-success [class^="swal2-success-line"] {
  border-color: white !important; /* Color de fondo para 'warning' */
}

.swal2-icon.swal2-success {
  border-color: white !important;
}

.container-first-grid {
  order: -1;
}

/* END CUSTOM CSS */

body {
  font-family: "Manrope", var(--body-font-family) !important;
  font-weight: 400;
}
:root {
  --bgk-primary-owner: #6DCFF6;
  --bgk-primary-owner-alternate: #6DCFF68a;
  --bkg-primary-owner-disabled: #aee2f7;
  --bgk-primary-owner-alpha: #6DCFF634;
  --bgk-grey-owner: #7a7a9c;
  --color-black-navbar: #333;
  --hover-click: #6DCFF68a;
  --color-black-navbar-alpha: #33333378;
  --color-white: #fbfbfb;
}

.bg-dark {
  background-color: #1f1f1f !important;
}

.status-indicator-container {
  --indicator-size: 0.3125rem;
  --indicator-gap: 0.125rem;
  position: relative;
}

.status-indicator-container img {
  -webkit-mask-image: radial-gradient(
    circle at calc(100% - var(--indicator-size))
      calc(100% - var(--indicator-size)),
    rgba(0, 0, 0, 0) calc(var(--indicator-size) + var(--indicator-gap)),
    #000 0
  );
}
.status-indicator {
  position: absolute;
  right: 0;
  bottom: 0;
  padding: var(--indicator-size);
  border-radius: var(--border-radius-pill);
}

.owner .ph-list {
  color: var(--color-black-navbar) !important;
}

.owner.sidebar-main {
  background-color: var(--bgk-primary-owner);
}

.owner.navbar.navbar-static {
  background-color: var(--bgk-primary-owner);
}

.owner h5 {
  color: var(--color-black-navbar);
}

.owner button {
  color: var(--color-black-navbar);
  background-color: #fbfbfb;
}

.owner i {
  color: var(--color-black-navbar);
}

.border-top-sb-owner {
  border-top: 1px solid var(--color-black-navbar-alpha);
}
.owner.sidebar-main span {
  color: var(--color-black-navbar) !important;
}

.owner .nav-sidebar .nav-link.mainNavBar.active {
  background-color: #fbfbfb;
}

.owner .border-top {
  border-color: var(--color-black-navbar-alpha) !important;
}
.owner #profile_username {
  color: var(--color-black-navbar);
}

.form-check-input {
  border-color: var(--bgk-primary-owner);
}

.form-check-input:checked {
  background-color: var(--bgk-primary-owner);
}

.custom-input-primary {
  border-color: var(--primary);
}

.custom-input-primary:checked {
  background-color: var(--primary);
}

.custom-input-warning {
  border-color: var(--warning);
}

.custom-input-warning:checked {
  background-color: var(--warning);
}

.custom-input-success {
  border-color: var(--success);
}

.custom-input-success:checked {
  background-color: var(--success);
}

.custom-input-danger {
  border-color: var(--danger);
}

.custom-input-danger:checked {
  background-color: var(--danger);
}

.custom-input-dark {
  border-color: var(--dark);
}

.custom-input-dark:checked {
  background-color: var(--dark);
}

.custom-input-purple {
  border-color: var(--purple);
}

.custom-input-purple:checked {
  background-color: var(--purple);
}

.btn-warning {
  --btn-bg: var(--bgk-primary-owner);
  --btn-color: var(--color-white);
  --btn-border-color: var(--bgk-primary-owner);
  --btn-hover-border-color: var(--bgk-primary-owner-alternate);
  --btn-hover-bg: var(--bgk-primary-owner-alternate);
  --btn-active-color: var(--color-white);
  --btn-active-bg: var(--bgk-primary-owner-alternate);
  --btn-active-border-color: var(--bgk-primary-owner-alternate);
  --btn-disabled-bg: var(--bkg-primary-owner-disabled);
  --btn-disabled-border-color: var(--bkg-primary-owner-disabled);
}

@media (max-width: 768px) {
  .content-inner {
    min-width: 88vw;
  }
}

.content-inner .nav-sidebar .nav-link.active {
  background-color: var(--bgk-primary-owner-alpha) !important;
  color: #000 !important;
}

.owner .nav-link.active {
  background-color: var(--color-white) !important;
}

.bg-main {
  position: relative;
  background: url("../images/mo/background/Multiopticas.webp");
}

.bg-main::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: inherit;
  filter: blur(5px);
  background-repeat: no-repeat;
  background-size: cover;
}

.login-form {
  width: 30rem;
}

.circle-inputs {
  border-radius: 50px;
  text-align: center;
}

.bg-welcs {
  background-color: var(--bgk-primary-owner) !important;
  border-radius: 45%;
}

/* .bg-welcs:hover{
    background-color: var(--bgk-primary-owner-alternate) !important;
} */

.sized-font {
  font-size: 1.1rem;
}

.center-icon {
  display: flex;
  justify-content: center;
  align-items: center;
}

/* a:hover i{
    color: var(--bgk-primary-owner) !important;
} */

.dropdown-popup-center {
  transform: translate3d(2vw, -7vh, 2.5em) !important;
  z-index: 9999 !important;
}

.dropdown-menu a:hover {
  font-weight: bold;
}

table.dataTable tbody tr.odd,
table.dataTable.display tbody tr.odd {
  background-color: rgba(#e6e6e6, 0.1) !important;
}

.menu-items:hover {
  background-color: var(--bgk-primary-owner) !important;
  color: #fbfbfb !important;
}

.menu-items.active {
  background-color: var(--bgk-primary-owner) !important;
  color: #fbfbfb !important;
}

#tooltip {
  position: absolute;
  z-index: 1000;
  width: 511px;
  background-color: #f9f9f9 !important;
  border: 1px solid #d3d3d3 !important;
  border-radius: 5%;
  padding: 35px !important;
  color: black;
  font-size: 14px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  display: none; /* Inicialmente oculto */
}

.event-form {
  display: flex;
  flex-direction: column;
}

.event-title {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
}

.event-form > * {
  margin-bottom: 10px;
}

.title-input {
  font-size: 18px;
  padding: 10px;
  border: 1px solid #ccc;
  border-radius: 20px;
  width: 90%;
  background: #f6f6f6;
}

.tags {
  display: flex;
  align-items: center;
}

.tag-input {
  font-size: 18px;
  padding: 10px;
  border: 1px solid #ccc;
  border-radius: 20px;
  width: 85%;
  background: #f6f6f6;
}

.description {
  display: flex;
  flex-direction: column;
}

.description-input {
  font-size: 18px;
  padding: 10px;
  border: 1px solid #ccc;
  border-radius: 20px;
  width: 85%;
  background: #f6f6f6;
  resize: vertical;
}

.event-buttons {
  display: flex;
  justify-content: flex-end;
  margin-right: 40px;
  margin-top: 20px;
  gap: 1.1rem;
}

.save-button {
  top: 361px;
  left: 326px;
  padding: 9px 30px 9px 30px;
  gap: 7px;
  border-radius: 20%;
  opacity: 0px;
  background: var(--Color, #6DCFF6);
  border: 1px solid var(--Color, #6DCFF6);
  box-shadow: 0px 0px 24px 0px #10182826;
}

.save-button:hover {
  background-color: #ad9746;
}

.edit-button {
  top: 361px;
  left: 326px;
  padding: 9px 30px 9px 30px;
  gap: 7px;
  border-radius: 20%;
  opacity: 0px;
  background: var(--Color, #6DCFF6);
  border: 1px solid var(--Color, #6DCFF6);
  box-shadow: 0px 0px 24px 0px #10182826;
}

.edit-button:hover {
  background-color: #a8dff5;
}

.close-button {
  font-size: 16px;
  color: #666;
  cursor: pointer;
}

.close-button:hover {
  color: #333;
}

.accordion-expanded {
  background-color: #eec52b1a !important;
}

.dt-responsive-list {
  min-height: 45vh;
}

.swal2-modal {
  border-radius: 20px;
}

.swal2-confirm.btn.btn-primary,
.swal2-cancel.btn.btn-light,
.swal2-deny.btn.btn-light {
  border-radius: 20px;
  color: #000 !important;
}

.swal2-confirm.btn.btn-primary {
  background-color: var(--bgk-primary-owner) !important;
  border-color: var(--bgk-primary-owner) !important;
  width: 85%;
}
.swal2-confirm.btn.btn-primary:hover {
  background-color: var(--bgk-primary-owner-alternate) !important;
  border-color: var(--bgk-primary-owner-alternate) !important;
}

/* Estilo para el fondo del ícono */
.swal2-icon {
  background-color: var(--bgk-primary-owner) !important;
}

/* Estilo para cambiar el color del ícono */
.swal2-icon-content {
  color: white !important;
}

/* Ajustar el borde del ícono (opcional) */
.swal2-icon::before,
.swal2-icon::after {
  background-color: var(--bgk-primary-owner) !important;
}

.swal2-icon.swal2-warning,
.swal2-icon.swal2-error,
.swal2-icon.swal2-question,
.swal2-icon.swal2-info,
.swal2-icon.swal2-success {
  border-color: var(--bgk-primary-owner) !important;
}

/* Estilo para el botón de confirmación */
.swal2-confirm.btn.btn-primary,
.swal2-confirm {
  background-color: var(--bgk-primary-owner) !important;
  border-color: var(--bgk-primary-owner) !important;
  color: #000 !important;
}

.swal2-confirm.btn.btn-primary:hover,
.swal2-confirm:hover {
  background-color: var(--bgk-primary-owner-alternate) !important;
  border-color: var(--bgk-primary-owner-alternate) !important;
}

/* Estilo para el botón de cancelación */
.swal2-cancel.btn.btn-light,
.swal2-cancel {
  background-color: var(--bgk-primary-owner) !important;
  border-color: var(--bgk-primary-owner) !important;
  color: #000 !important;
}

.swal2-cancel.btn.btn-light:hover,
.swal2-cancel:hover {
  background-color: var(--bgk-primary-owner-alternate) !important;
  border-color: var(--bgk-primary-owner-alternate) !important;
}

/* Estilo para el botón de denegación */
.swal2-deny.btn.btn-light,
.swal2-deny {
  background-color: var(--bgk-primary-owner) !important;
  border-color: var(--bgk-primary-owner) !important;
  color: #000 !important;
}

.swal2-deny.btn.btn-light:hover,
.swal2-deny:hover {
  background-color: var(--bgk-primary-owner-alternate) !important;
  border-color: var(--bgk-primary-owner-alternate) !important;
}

/* Estilo para el fondo del ícono */
.swal2-icon {
  background-color: var(--bgk-primary-owner) !important;
}

/* Estilo para cambiar el color del ícono */
.swal2-icon-content {
  color: white !important;
}
/* .swal2-icon *:not(.swal2-x-mark) {
  background-color: white !important;
} */
/* Ajustar el borde del ícono (opcional) */
.swal2-icon::before,
.swal2-icon::after {
  background-color: var(--bgk-primary-owner) !important;
}

.swal2-icon.swal2-warning,
.swal2-icon.swal2-error,
.swal2-icon.swal2-question,
.swal2-icon.swal2-info,
.swal2-icon.swal2-success {
  border-color: var(--bgk-primary-owner) !important;
}

.bg-welcs-main {
  background-color: var(--bgk-primary-owner) !important;
}

.no-border-top {
  border-top: none !important;
}

.nav-item-dropdown-lg > .dropdown-menu {
  right: 0 !important;
}

.small-text {
  font-size: 0.75rem;
}

.smaller-text {
  font-size: 0.63rem;
}

tr.odd {
  background-color: inherit;
}

.swal2-x-mark-line-left,
.swal2-x-mark-line-right {
  background-color: white !important;
}

.chks-custom:checked {
  background-color: green !important;
}

.chks-custom {
  background-color: #f00 !important;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e") !important;
}

.accordion {
  --accordion-border-width: 0px !important;
}

#comment_textfield:focus {
  border: 1px solid #ccc;
}

.transition {
  transition: all 0.3s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.btn-to-top-visible button{
  background: var(--bgk-primary-owner) !important;
  border-color: var(--bgk-primary-owner) !important;
}

.btn-to-top-visible button:hover{
  background: var(--bgk-primary-owner-alternate) !important;
  border-color: var(--bgk-primary-owner-alternate) !important;
}

.table-permissions>thead>*>* {
  border-bottom: none !important;
}

.table-permissions>thead>tr>th {
  border-left: none !important;
  border-right: none !important;
}

.table-permissions>tbody>tr:first-child>td {
  border-top: none !important;
}

.table-permissions>tbody>tr:first-child>td:first-child {
  border-radius: 20px 0 0 0 !important;
  border-top: none !important;
}

.table-permissions>tbody>tr:first-child>td:last-child {
  border-radius: 0 20px 0 0 !important;
  border-top: none !important;
}

.table-permissions>tbody>tr:last-child>td:first-child {
  border-radius: 0 0 0 20px !important;
  border-bottom: none !important;
}

.table-permissions>tbody>tr:last-child>td:last-child {
  border-radius: 0 0 20px 0 !important;
  border-bottom: none !important;
}

.table-permissions>tbody>tr:last-child>td {
  border-bottom: none !important;
}

.table-permissions>tbody>tr>* {
  border-left: none !important;
  border-right: none !important;
}

.table-permissions>tbody {
  background: white !important;
}

.table-permissions>tbody>tr>* {
  border-bottom: 0.5px solid #E6E6E6 !important;
}

.spinner-border {
  transition: opacity 0.5s ease-in-out;
}

.spinner-success {
  display: none;
  opacity: 0;
  transition: opacity 0.5s ease-in-out;
}

.spinner-success.show {
  display: inline-block;
  opacity: 1;
}

.spinner-success.hide {
  opacity: 0;
}

@media (max-width: 767.98px) {
  #spinner {
      left: 25%;
      transform: translate(-25%, -50%);
  }
}

@media (min-width: 768px) {
  #spinner {
      left: 50%;
      transform: translate(-50%, -50%);
  }
}

.grid-directories-list{
  user-select: none;
}

.modal .spinner-border {
  width: 3rem;
  height: 3rem;
}
.modal .modal-title {
  font-size: 1.25rem;
}
.modal .modal-body p {
  font-size: 1rem;
}


.dropdown button {
  border: 0;
}

.accordion-row{
  border: 0 transparent !important;
}

.booking-btn.active {
  background-color: var(--bgk-primary-owner) !important;
}

.custom-button{
  background-color: var(--bgk-primary-owner) !important;
  border-color: var(--bgk-primary-owner) !important;
}

.custom-button:hover{
  background-color: var(--bgk-primary-owner-alternate) !important;
  border-color: var(--bgk-primary-owner-alternate) !important;
}

.highlight-row{
  background-color: #f5e7b294 !important;
}


.wizard>.steps>ul>li.done .number{
  background-color: var(--bgk-primary-owner) !important;
  border-color: var(--bgk-primary-owner) !important;
}

/* .wizard>.steps>ul>li.done:before {
  background-color: var(--bgk-primary-owner) !important;
}

.wizard>.steps>ul>li.done:after{
  background-color: var(--bgk-primary-owner) !important;
}

.wizard>.steps>ul>li.current:before {
  background-color: var(--bgk-primary-owner) !important;
} */

.wizard>.steps>ul>li.current .number{
  color: var(--bgk-primary-owner) !important;
  border-color: var(--bgk-primary-owner) !important;
}


.wizard>.steps>ul>li:after, .wizard>.steps>ul>li:before {
  background-color: var(--bgk-primary-owner);
}

.loader-bar-container {
  width: 80%;
  margin: 20px auto 0;
  height: 10px;
  background-color: #e0e0e0;
  border-radius: 5px;
  overflow: hidden;
}

.loader-bar {
  height: 100%;
  width: 0;
  background-color: var(--bgk-primary-owner);
  animation: loading 2s linear forwards;
}

@keyframes loading {
  0% { width: 0; }
  100% { width: 100%; }
}


.wizard .form-check-input:checked[type=checkbox] {
  background-image: none !important;
  position: relative;
}

.wizard .form-check-input:checked[type=checkbox]::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%; /* Ajusta el tamaño del halo según sea necesario */
  height: 100%; /* Ajusta el tamaño del halo según sea necesario */
  border: 3px solid white; /* Aumenta el grosor del borde para hacer el halo más grueso */
  border-radius: 50%;
}

.iPlaceholder-color::placeholder {
  color: var(--bgk-primary-owner); /* Cambia el color del placeholder a amarillo */
}

.wizard .form-check-input-warning {
  --focus-ring-box-shadow: 0 0 0 0.125rem rgba(var(--bgk-primary-owner), 0.25);
  --component-active-bg: var(--bgk-primary-owner);
}

@media (max-width: 770px) {
  .wizard > .steps > ul{
    display: flex;
    justify-content: center;
  }
}

@media (max-width: 767.98px) {
  .wizard>.steps>ul>li:last-child:after {
      background-color: var(--bgk-primary-owner);
  }
}

@media (max-width: 575.98px) {
  .wizard>.steps>ul>li.current:after {
      background-color: var(--bgk-primary-owner);
  }
}

.fade {
  transition: opacity linear;
}

.modal-backdrop {
  background-color: #b3b3b3a1; /* Para un fondo semitransparente */
  backdrop-filter: blur(2px); /* Aplica un desenfoque de 10px */
}

.modal-backdrop.show {
  opacity: 1; /* Asegúrate de que la opacidad esté activada */
}

.text-wrap {
  word-wrap: break-word;
  overflow-wrap: break-word;
  white-space: normal;
}

.accomodation-wizard_page .bg-custom {
  background-color: #F1F1F1 !important;
}

.accomodation-wizard_page .bg-custom input {
  font-weight: 700;
}

.accomodation-wizard_page textarea {
  font-weight: 700;
}

.select2-container--default .select2-selection--single {
  border: none;
}

.accordion-button[aria-expanded="true"] {
  color: var(--bgk-primary-owner) !important;
  font-weight: bold !important;
}

.accordion-button[aria-expanded="true"]:last-of-type {
  border-bottom-left-radius: 0px !important;
  border-bottom-right-radius: 0px !important;
  transition: .15s cubic-bezier(.17,.67,.85,.35);
}

.bg-soft-success {
  background-color: #d4edda !important;
}

.bg-soft-danger {
  background-color: #f8d7da !important; 
}

.bg-soft-warning {
  background-color: #fff3cd !important;
}

/* Asegúrate de que los botones se alineen correctamente en móviles */
.button-container {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); /* Mínimo 150px por columna */
  gap: 10px;
}

/* Para pantallas más grandes (como tabletas o escritorios), usa flexbox si es necesario */
@media (min-width: 576px) {
  .button-container {
      display: flex;
      flex-wrap: wrap;
      justify-content: flex-start;
  }
}

@media (min-width: 1200px) {
  .fixed-width-large {
      width: 200px !important; 
  }
}

.analytics_card{
  display: table !important;
}

.star {
  display: inline-block;
  transition: transform 0.2s;
}
.star:hover {
  transform: scale(1.1);
}


/* Contenedor Principal */
.star-rating-container {
  display: flex;
  align-items: center;
  justify-content: space-between; /* Espaciado uniforme */
  flex-wrap: nowrap; /* Evita que las estrellas bajen de línea */
  max-width: 100%; /* Limita el ancho al espacio disponible */
  overflow: auto; /* Evita desbordamientos */
  gap: 4px; /* Espaciado entre estrellas */
  padding: 5px 0; /* Espaciado interno vertical */
}

/* Contenedor de cada estrella */
.star-wrapper {
  flex: 1 0 calc((100% - (4px * 9)) / 10); /* Ancho proporcional para 10 estrellas con espaciado */
  max-width: calc((100% - (4px * 9)) / 10); /* Ajusta el ancho máximo para que todas las estrellas quepan */
  aspect-ratio: 1; /* Mantén proporción cuadrada */
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Estrellas */
.star-icon {
  width: 100%; /* Asegura que las imágenes no desborden */
  height: 100%; /* Ajusta la altura máxima */
  object-fit: contain; /* Escala dentro del contenedor */
  transition: transform 0.2s ease, opacity 0.2s ease;
  cursor: pointer; /* Añade interactividad */
}

/* Hover y Active */
.star-wrapper:hover .star-icon {
  transform: scale(1.1); /* Aumenta ligeramente el tamaño al pasar el mouse */
  opacity: 0.9; /* Efecto de opacidad */
}

.star-icon:active {
  transform: scale(1.05); /* Retroalimentación al hacer clic */
  opacity: 0.85;
}

.autoComplete_wrapper{
  width: 100% !important;
}

/* Ocultar el feedback icon del multiselect */
.form-control-feedback-icon {
  display: none; /* Oculta el icono de la flecha */
}

.accomodation_update_page .bg-custom {
  background-color: #F1F1F1 !important;
}

.accomodation_update_page #create_description_form-t-0{
  display: none;
  justify-content: center;
}

.accomodation_update_page .wizard>.steps>ul>li.current:after{
  display: none !important;
}

.accomodation_update_page .wizard>.steps>ul>li.current::before{
  display: none !important;
}

/* Aplica 100% de ancho al <li> visible */
.accomodation_update_page .actions ul li:not(.d-none) {
  margin: 0;
  width: 100%;
}

/* Aplica 100% de ancho al <a> dentro del <li> visible */
.accomodation_update_page .actions ul li:not(.d-none) a {
  width: 100%;
  font-size: 2.3em;
  font-weight: bolder;
  text-transform: uppercase;
}

.accomodation_update_page .actions ul li:not(.d-none) i {
  font-size: 1.5em;
  font-weight: bolder;
}