/* Sticky mobile call bar (inc/mobile-call-bar.php). Phones and small tablets only. */
.dr-callbar {
  display: none;
}

@media (max-width: 900px) {
  .dr-callbar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 990;
    display: flex;
    gap: 8px;
    padding: 8px 12px calc(8px + env(safe-area-inset-bottom, 0px));
    background: rgba(10, 10, 10, 0.96);
    border-top: 1px solid var(--border, #2A2A2A);
    box-shadow: 0 -6px 20px rgba(0, 0, 0, 0.35);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
  }

  .dr-callbar__btn {
    flex: 1 1 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 48px;
    padding: 0 12px;
    border-radius: 8px;
    font-family: var(--font-heading, sans-serif);
    font-size: 1rem;
    font-weight: 600;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
  }

  .dr-callbar__btn--call {
    color: var(--white, #FFFFFF);
    background: var(--surface, #1A1A1A);
    border: 1px solid var(--muted, #6E6E6E);
  }

  .dr-callbar__btn--quote {
    color: var(--black, #0A0A0A);
    background: var(--copper, #C8884A);
    border: 1px solid var(--copper, #C8884A);
  }

  .dr-callbar__btn:active {
    transform: translateY(1px);
  }

  .dr-callbar__btn--call:focus-visible,
  .dr-callbar__btn--quote:focus-visible {
    outline: 2px solid var(--copper-light, #D9A06A);
    outline-offset: 2px;
  }

  /* Keep the bottom of the page (footer, forms) clear of the bar. */
  body.has-callbar {
    padding-bottom: calc(64px + env(safe-area-inset-bottom, 0px));
  }
}

@media (max-width: 900px) {
  .dr-callbar__btn {
    min-width: 0;
    overflow: hidden;
  }
}

@media (max-width: 400px) {
  .dr-callbar {
    gap: 6px;
    padding-left: 8px;
    padding-right: 8px;
  }
  .dr-callbar__btn {
    gap: 6px;
    padding: 0 8px;
    font-size: 0.9rem;
  }
  .dr-callbar__btn svg {
    flex: 0 0 auto;
  }
}

@media (max-width: 340px) {
  .dr-callbar__btn {
    font-size: 0.8rem;
  }
}