/* Protech mobile floating actions UX fix — 2026-10-06 */
@media (max-width: 940px) {
  /* Keep all three conversion paths, but turn the tall right-side stack into
     one compact bottom toolbar so it does not cover article/form/card content. */
  .dock {
    right: 12px !important;
    bottom: max(12px, env(safe-area-inset-bottom)) !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 7px !important;
    padding: 6px !important;
    border-radius: 999px !important;
    background: rgba(15, 24, 34, .88) !important;
    border: 1px solid rgba(255, 255, 255, .12) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .28) !important;
    backdrop-filter: blur(14px) !important;
    -webkit-backdrop-filter: blur(14px) !important;
    transition: opacity .22s ease, transform .22s ease, visibility .22s ease !important;
  }

  .dock .dock-req,
  .dock .dock-wa,
  .dock .dock-chat {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 0 !important;
    margin: 0 !important;
    border-radius: 50% !important;
    display: grid !important;
    place-items: center !important;
  }

  .dock .dock-req span,
  .dock .dock-wa span,
  .dock .dock-tip {
    display: none !important;
  }

  .dock .dock-req svg,
  .dock .dock-wa svg,
  .dock .dock-chat svg {
    width: 20px !important;
    height: 20px !important;
  }

  /* The old animated halo adds visual noise on a small screen. */
  .dock .dock-chat::after {
    display: none !important;
  }

  /* Never float actions over the full-screen mobile navigation, a form's
     submit button, or the fields someone is typing in. */
  .dock.mobile-menu-open,
  .dock.mobile-dock-away {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translateY(10px) !important;
  }

  /* Keep the chat panel above the compact toolbar. */
  .chat {
    bottom: calc(76px + env(safe-area-inset-bottom)) !important;
  }
}

@media (max-width: 380px) {
  .dock {
    right: 8px !important;
    bottom: max(8px, env(safe-area-inset-bottom)) !important;
    gap: 5px !important;
    padding: 5px !important;
  }

  .dock .dock-req,
  .dock .dock-wa,
  .dock .dock-chat {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .dock {
    transition: none !important;
  }
}
