.tab-content { /* Paints over the tab-content div to create a frame*/
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    padding: 10px;
}

#selectDetailsPaid {
    pointer-events: none;
}

#nav_logo {
    width: 150px;
    height: 50px;
    margin-right: 10px;
}

.navbar-brand {
    font-weight: bold;
}

.nav-link.dropdown-toggle {
    color: black;
}

#cogBtn {
    color:#A5A5A5;
    vertical-align:text-bottom;
    padding-bottom:0.75em;
    font-size:0.40em;
}

#timeline-description { /* timeline description field */
    height: 150px;
}

/* POS BUTTONS */

.posBtn {
    min-height: 150px;
}


a[disabled] {
   pointer-events: none;
   cursor: default;
   opacity: 0.5;
}

/*Estilos nav*/

/* Corta el menu del header conforme se reduce*/
.navbar-nav{
    flex-wrap:wrap;
}

/*Ajusta el tamaño de los iconos tanto del nav como de los submenus*/
.nav-link>i, .dropdown-item>i {
    display: inline-block;
    width: 25px;
    text-align: center;
}


/* Ajusta mas centrado el icono del logout */
a:has(> i.fa-person-through-window), li:has(> a > i.fa-person-through-window) {
    display:flex;
    align-items: center;
}

/* Estilos tablas*/

/*Para que la lista de tabs no sobresalga*/
div:has(> #tab){
    overflow-x: auto;
    overflow-y: hidden;
}

#tab {
    flex-wrap: nowrap;
    white-space: nowrap;
}
/*Para que las tabla no sobresalgan*/
.tab-content, .table-container{
    overflow:auto;
    margin-bottom:10px;
}
/*Para deshabilitar el overflow en algunos tab-content*/
.not-overflow{
    overflow:visible;
}

/*Para que no sobresalgan las tablas cuyo width no esta definido por ejemplo las que estan dentro de un td*/
.table-container-width{
    overflow:auto;
    max-width: 95vw;
}
/*Para que los inputs con span los muestren en fila*/
.input-group {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
}
/*Para que el span y input tengan la misma altura*/
.input-group span, .input-group input {
    padding: 11px;
}
/*Si el td tiene un span le da min width para que el input no sea demasiado pequeño en movil*/
td:has(.input-group span) {
    min-width: 100px;
}

/*Si el td contiene el icono de la papelera le da tamaño. Tiene la ruta exacta para no pillar la table de offersDetails que esta dentro de otra table*/
td:has(> div > a > i.fa-trash-can) {
  width: 10px;
}

/* Estilos form*/

/*Para que las filas dentro de un form como las de CheckOutForm se ajusten bien*/
form > .row{
    max-width:100%;
}

/*Para que el texto numero en el input numerico no sobresalga*/
.form-label, .form-floating label{
    max-width: 100%;
}

/*Estilos botones*/

/*Controla que los botones se muestren bien al reducir el ancho del dispositivo*/
.button-container {
    display: flex;
    overflow-x: auto;
    white-space: nowrap;
    gap: 10px;
    padding-bottom: 0.5rem;
}

@media (max-width: 768px) {
    /*En tablet convierte una row en col*/
    .col-tablet{
        flex-direction: column;
        align-items:center;
    }
    /*En tablet reduce el tamaño del texto*/
    .btn-product{
        font-size:1rem;
    }

}

@media (max-width: 425px) {
    /*En movil convierte una row en col*/
    .col-mobile{
        display: flex;
        flex-direction: column;
    }
}

.print.disabled, .disabledWhenDirty.disabled{
    pointer-events: all !important;
    cursor: not-allowed;
}


/* Suggestions (desplegable para autocompletar - usado en HotelGuestDetails para desplegar ciudades) */

.town-suggestions-container{
    display:flex;
    justify-content:center;
}

#town_suggestions {
    width: auto;
    max-width:90vw;
    background-color: white;
    max-height: 200px;
    overflow-y: auto;
    border: 1px solid #ccc;
    border-radius: 4px;
    z-index: 1000;
    box-shadow: 0px 4px 6px rgba(0,0,0,0.1);

    border: 1px solid black;

}

.suggestion-item {
    padding: 10px;
    cursor: pointer;
    border-bottom: 1px solid #ddd;
    transition: background-color 0.2s ease-in-out;
}

.suggestion-item:hover {
    background-color: #f8f9fa;
    color: #007bff;
}

.show {
    opacity: 1;
}


/* Imágenes botonera demo menú */

.img_menu {
  aspect-ratio: 4 / 2;
  object-fit: cover;
  width: 100%;
  height: auto;
  transition: transform 0.3s ease;
}

.img_menu_contained {
   object-fit: contain;
}

.menu_card {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.menu_card:hover {
  transform: scale(1.05);
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15);
  cursor: pointer;
}


.menu_card_title {
  font-size: clamp(1.1rem, 2vw, 1.5rem);
}


/* Carta Online */

.navbar .nav-pills .menu_navbar_item.active {
  background-color: #a4d7f2;
}

.menu_category_title {
  scroll-margin-top: 70px;
}

.navbar_scroll_wrapper {
  scroll-behavior: smooth;
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none; /* Internet Explorer 10+ */
  overflow-x: auto;
  white-space: nowrap;
}

.navbar_scroll_wrapper::-webkit-scrollbar {
  display: none; /* Chrome, Safari, Opera */
}

@media (max-width: 768px) {
  .menu_main_container .item_title {
    font-size: 0.90rem;
  }
  .menu_main_container .item_description {
    font-size: 0.75rem;
  }
}

.navbar-fixed-padding {
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
  padding-left: calc(var(--bs-gutter-x, 1.5rem) * 0.5);
  padding-right: calc(var(--bs-gutter-x, 1.5rem) * 0.5);
}




/* TypeSense - Categories in searchbar */
.aa-SourceHeader {
    font-family: 'Open Sans', sans-serif !important;
    font-size: 1.1rem;
    font-weight: 600;
}

/* TypeSense - Highlighting style */
.ts-highlight {
    background: #fff3c4;
    font-weight: 600;
    padding: 0 2px;
    border-radius: 3px;
}

/*
.ts-hightlight {
    font-weight: 600;
}
*/