/* ==========================================================================
   Footer Bar (Mobile Fixed Bottom Bar)
   ADVANCE v2 Theme

   Sticky bottom bar shown on smartphones with phone/CTA buttons.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Footer Bar Base
   -------------------------------------------------------------------------- */
.l-footer-bar {
  display: none; /* Hidden on desktop */
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  z-index: 999;
  background-color: var(--color-bg);
  box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
  padding: 0;
}

.l-footer-bar__inner {
  display: flex;
  align-items: stretch;
  height: 56px;
}

/* --------------------------------------------------------------------------
   Footer Bar Items
   -------------------------------------------------------------------------- */
.l-footer-bar__item {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  font-size: 0.8rem;
  font-weight: 700;
  text-decoration: none;
  color: #ffffff;
  transition: opacity var(--transition-fast);
}

.l-footer-bar__item:hover {
  opacity: 0.85;
}

/* Phone button */
.l-footer-bar__item--phone {
  background-color: var(--color-primary);
}

/* CTA / Contact button */
.l-footer-bar__item--cta {
  background-color: var(--color-accent);
}

/* Icon */
.l-footer-bar__icon {
  font-size: 1.2em;
  line-height: 1;
}

/* --------------------------------------------------------------------------
   Body padding when footer bar is active (prevent content hiding)
   -------------------------------------------------------------------------- */
@media (max-width: 767px) {
  .l-footer-bar {
    display: block;
  }

  body.has-footer-bar {
    padding-bottom: 56px;
  }
}