/* Barra fixa do mobile (js/modulos/barra-mobile.js): só abaixo de 768 px. Vidro com raio 16px 0 em volta do .fbtn
   laranja "Aproveitar a Black", quase na largura toda, acima da safe-area do celular. Sem contador. */

.barra-mobile {
  display: none;
}

@media (max-width: 767.98px) {
  .barra-mobile {
    position: fixed;
    left: 10px;
    right: 10px;
    bottom: calc(10px + env(safe-area-inset-bottom, 0px));
    z-index: 60;
    display: block;
    padding: 8px;
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 16px 0;
    background: rgba(12, 9, 8, .55);
    -webkit-backdrop-filter: blur(14px) saturate(1.2);
    backdrop-filter: blur(14px) saturate(1.2);
    box-shadow: 0 18px 40px -12px rgba(0, 0, 0, .85), inset 0 1px 0 rgba(255, 255, 255, .06);
    transform: translateY(calc(100% + 30px + env(safe-area-inset-bottom, 0px)));
    visibility: hidden;
    transition: transform var(--dur-3) var(--curva), visibility 0s var(--dur-3);
  }

  .barra-mobile.is-visivel {
    transform: none;
    visibility: visible;
    transition: transform var(--dur-3) var(--curva);
  }

  .barra-mobile .fbtn {
    width: 100%;
  }
}