:root{
    --color-primario: #E20E18;
    --color-secundario: #0ee2d8;
    --color-terciario: #1B1B1B;

    --bg-primario: #E20E18;
    --bg-secundario: #0ee2d8;
    --bg-terciario: #1B1B1B;
}


#preloader.fade-out {
    opacity: 0;
    transition: opacity 0.5s ease;
    pointer-events: none;
}

.scroll-hide {
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none;  /* IE 10+ */
  }
  
  .scroll-hide::-webkit-scrollbar {
    display: none; /* Chrome, Safari, Opera */
  }
  

  .btn-option {
    border: 1px solid #ccc;
    padding: 0.5rem 1rem;
    border-radius: 0.5rem;
    background: white;
    cursor: pointer;
  }
  .btn-option.selected {
    background: #0284c7;
    color: white;
    border-color: #0284c7;
  }

  .marker-logo-wrapper {
    text-align: center;
    position: relative;
    transform: translateY(-10px);
}
.marker-logo {
    width: 40px;
    height: 40px;
    object-fit: cover;
}
.marker-triangle {
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 10px solid #555;
    margin: 0 auto;
    margin-top: -2px;
}

.itemRecomended{
  border: 1px solid #10B981;
  border-radius: 1rem;
}

.itemCompatible{
  border: 1px solid #A1BAC7;
  border-radius: 1rem;
}

#divUmap{
  height: 60vh;
}


  .custom-marker .marker-logo-wrapper{
    transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
  }
  /* Estado seleccionado: más grande + ring */
  .custom-marker.is-selected .marker-logo-wrapper{
    transform: scale(1.12);
    box-shadow: 0 0 0 3px rgba(2,132,199,.75); /* sky-600 */
    filter: saturate(1.2);
    border-radius: 10px;
  }
  .custom-marker .marker-triangle{
    width: 0; height: 0;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-top: 10px solid #1f2937; /* gris base */
    margin: -2px auto 0;
  }
  .custom-marker.is-selected .marker-triangle{
    border-top-color: #0284c7; /* sky-600 seleccionado */
  }