/* =======================================================
   MOBILE BOTTOM BAR — Milas Taksi
   Konum Gönder (WhatsApp) + Hemen Ara
======================================================= */

/* ── Checker Strip ── */
.checker-strip {
  width: 100%;
  height: 14px;
  flex-shrink: 0;
  background-image: repeating-linear-gradient(
    90deg,
    #000000 0px,
    #000000 28px,
    #F2A900 28px,
    #F2A900 56px
  );
}

/* ── Mobile Bottom Bar ── */
.mobile-bottom-bar {
  /* Hidden on desktop */
  display: none;
}

@media (max-width: 768px) {
  .mobile-bottom-bar {
    display: flex;
    align-items: stretch;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 9999;

    /* Safe area (iPhone notch) */
    padding-bottom: env(safe-area-inset-bottom, 0px);

    background: #0B1220;
    border-top: 1px solid rgba(255, 255, 255, 0.10);
    box-shadow: 0 -8px 40px rgba(0, 0, 0, 0.6),
                0 -2px 8px  rgba(0, 0, 0, 0.4);

    /* Prevent content jumping when bar is visible */
    min-height: 72px;
  }

  /* Push page content above bar */
  body {
    padding-bottom: calc(72px + env(safe-area-inset-bottom, 0px));
  }

  /* ── Shared button styles ── */
  .mbb-btn {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 12px 8px;
    border: none;
    cursor: pointer;
    font-family: 'Inter', system-ui, sans-serif;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-decoration: none;
    transition: background 0.2s, transform 0.15s;
    -webkit-tap-highlight-color: transparent;
    user-select: none;
    position: relative;
  }

  .mbb-btn svg {
    width: 26px;
    height: 26px;
    flex-shrink: 0;
  }

  .mbb-btn span {
    font-size: 10.5px;
    line-height: 1;
    white-space: nowrap;
  }

  .mbb-btn:active {
    transform: scale(0.96);
  }

  /* Divider between buttons */
  .mbb-btn + .mbb-btn::before {
    content: '';
    position: absolute;
    left: 0; top: 16%; bottom: 16%;
    width: 1px;
    background: rgba(255, 255, 255, 0.12);
  }

  /* ── WhatsApp / Location button ── */
  .mbb-location {
    background: #128C7E;
    color: #ffffff;
  }

  .mbb-location:hover,
  .mbb-location:focus {
    background: #0D7266;
    outline: none;
  }

  .mbb-location:active {
    background: #0A5C52;
  }

  /* Green pulse ring on icon */
  .mbb-location svg {
    filter: drop-shadow(0 0 6px rgba(18, 140, 126, 0.8));
  }

  /* ── Call button ── */
  .mbb-call {
    background: linear-gradient(135deg, #F2A900 0%, #D4920A 100%);
    color: #000000;
  }

  .mbb-call:hover,
  .mbb-call:focus {
    background: linear-gradient(135deg, #D4920A 0%, #B87D09 100%);
    outline: none;
  }

  .mbb-call:active {
    background: #B87D09;
  }

  /* Yellow glow on call button icon */
  .mbb-call svg {
    filter: drop-shadow(0 0 4px rgba(242, 169, 0, 0.6));
  }

  /* ── Loading state ── */
  .mbb-location.loading {
    opacity: 0.75;
    cursor: not-allowed;
    pointer-events: none;
  }
  .mbb-location.loading::after {
    content: '';
    position: absolute;
    width: 18px; height: 18px;
    border: 2px solid rgba(255,255,255,0.3);
    border-top-color: #fff;
    border-radius: 50%;
    animation: mbb-spin 0.7s linear infinite;
    top: 14px; left: calc(50% - 9px);
  }
  @keyframes mbb-spin {
    to { transform: rotate(360deg); }
  }
}