.contact-hub {
  --contact-toolbar-height: 0px;
  position: fixed;
  right: max(20px, env(safe-area-inset-right));
  bottom: calc(20px + var(--contact-toolbar-height) + env(safe-area-inset-bottom));
  z-index: 1030;
  font-family: inherit;
}
.contact-hub-trigger {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 12px 18px;
  border: 0;
  border-radius: 28px;
  background: var(--primary);
  color: var(--white);
  font-size: 14px;
  font-weight: 600;
  box-shadow: 0 4px 18px rgba(13, 61, 83, .18);
}
.contact-icon { display: block; width: 22px; height: 22px; flex-shrink: 0; }
.contact-hub-trigger:hover { background: var(--main); }
.contact-hub-trigger:focus-visible, .contact-hub-options a:focus-visible, .contact-hub-close:focus-visible {
  outline: 2px solid var(--primary);
  outline-offset: 4px;
}
.contact-hub-panel {
  position: absolute;
  right: 0;
  bottom: calc(100% + 12px);
  width: min(288px, calc(100vw - 32px));
  max-height: calc(100dvh - var(--contact-toolbar-height) - env(safe-area-inset-bottom) - 112px);
  overflow-y: auto;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--white);
  color: var(--main);
  box-shadow: 0 8px 32px rgba(0, 0, 0, .12);
  animation: contact-hub-expand .18s ease-out;
  transform-origin: bottom right;
}
.contact-hub-panel[hidden] { display: none; }
.contact-hub-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-left: 10px; font-weight: 600; }
.contact-hub-close { display: grid; place-items: center; width: 44px; height: 44px; border: 0; background: transparent; color: var(--text); border-radius: 50%; }
.contact-hub-close:hover { background: var(--bg-2, #f5f5f5); }
.contact-hub-close .contact-icon { width: 20px; height: 20px; }
.contact-hub-options { display: grid; gap: 4px; margin: 0; padding: 0; list-style: none; }
.contact-hub-options a { display: flex; align-items: center; gap: 12px; min-height: 52px; padding: 10px; border-radius: 10px; color: var(--main); font-size: 14px; }
.contact-hub-options a:hover { background: var(--bg-2, #f5f5f5); }
.contact-hub-options a[aria-busy="true"] { opacity: .6; }
.contact-hub-icon { display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; flex: 0 0 28px; color: var(--primary); }
.contact-hub-icon-whatsapp { color: #238c47; }
.contact-hub-arrow { display: grid; place-items: center; width: 24px; height: 24px; flex: 0 0 24px; margin-left: auto; border-radius: 50%; background: var(--bg-2, #f5f5f5); color: var(--text); }
.contact-hub-arrow .contact-icon { width: 16px; height: 16px; }
.contact-hub-options a:hover .contact-hub-arrow, .contact-hub-options a:focus-visible .contact-hub-arrow { background: var(--white); color: var(--primary); }
.tf-toolbar-bottom { padding-bottom: env(safe-area-inset-bottom); }
.tf-toolbar-bottom .toolbar-item { flex: 1 1 0; min-width: 0; }
.toolbar-count[hidden], .count-box[hidden] { display: none !important; }
@keyframes contact-hub-expand {
  from { opacity: 0; transform: translateY(8px) scale(.97); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@media (max-width: 1149px) {
  .contact-hub { right: max(16px, env(safe-area-inset-right)); bottom: calc(12px + var(--contact-toolbar-height)); }
}
@media (prefers-reduced-motion: reduce) {
  .contact-hub-panel { animation: none; }
}