/* ===== Botón flotante "RESERVA AHORA" ===== */
.fab-reserva{
  position: fixed;
  bottom: 22px;           /* separación del borde inferior */
  right: 22px;            /* separación del borde derecho  */
  display: inline-flex;
  align-items: center;
  gap: 10px;              /* espacio entre icono y texto   */

  /* Apariencia “pastilla” */
  background: #0A66FF;    /* azul intenso */
  color: #fff;
  padding: 12px 22px;     /* alto y ancho del botón */
  border-radius: 999px;   /* ovalado total           */
  border: 2px solid #fff; /* borde blanco como en la foto */

  /* Tipografía */
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 800;
  font-size: 15.5px;
  letter-spacing: .6px;
  text-transform: uppercase;
  text-decoration: none;

  /* Sombra marcada */
  box-shadow: 0 10px 22px rgba(0,0,0,.22), 0 2px 6px rgba(0,0,0,.18);

  /* Interacción */
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
  z-index: 9999;
}

/* Icono (el SVG que inserta fab.js) */
.fab-reserva svg{
  width: 22px;
  height: 22px;
  stroke: #fff;           /* trazo blanco */
  stroke-width: 2;
  display: block;
  flex-shrink: 0;
}

/* Texto */
.fab-reserva .fab-label{
  line-height: 1;
  white-space: nowrap;
}

/* Hover / Active */
.fab-reserva:hover{
  background: #0957d8;    /* un toque más oscuro al pasar el mouse */
  transform: translateY(-1px);
  box-shadow: 0 12px 26px rgba(0,0,0,.26), 0 3px 8px rgba(0,0,0,.18);
}
.fab-reserva:active{
  transform: translateY(0);
  box-shadow: 0 8px 18px rgba(0,0,0,.2), 0 2px 6px rgba(0,0,0,.16);
}

/* Accesibilidad: enfoque con teclado */
.fab-reserva:focus{
  outline: none;
  box-shadow:
    0 0 0 4px rgba(10,102,255,.25),      /* halo azul */
    0 10px 22px rgba(0,0,0,.22),
    0 2px 6px rgba(0,0,0,.18);
}

/* Evitar que tape contenido en pantallas pequeñas */
@media (max-width: 480px){
  .fab-reserva{
    bottom: 18px;
    right: 16px;
    font-size: 14.5px;
    padding: 11px 18px;
    gap: 8px;
  }
  .fab-reserva svg{
    width: 20px;
    height: 20px;
  }
}

/* Opcional: “anclaje” respetando área segura en móviles con notch */
@supports (padding: max(0px)){
  .fab-reserva{
    right: max(22px, env(safe-area-inset-right));
    bottom: max(22px, env(safe-area-inset-bottom));
  }
}