/* Vendly shared finishing layer. Keeps the public site and seller workspace
   aligned without changing page-specific layouts or business behavior. */
:root {
  --v-focus-ring: 0 0 0 3px rgba(255, 214, 0, .34);
  --v-control-radius: 12px;
}

html { scroll-padding-top: 104px; }
body { text-rendering: optimizeLegibility; }

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 2px solid var(--v-accent, #FFD600);
  outline-offset: 3px;
}

:where(input:not([type="checkbox"]):not([type="radio"]), select, textarea) {
  accent-color: var(--v-accent, #FFD600);
}

:where(.vp-site, body) ::selection {
  color: var(--v-text-inverse, #fff);
  background: var(--v-accent, #FFD600);
}

.vp-site .vp-button,
.vp-site .vs-seller-action,
.vh-header .vh-profile {
  transition: background-color .16s ease, border-color .16s ease,
    color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.vp-site .vp-button:active,
.vh-header .vh-profile:active { transform: translateY(1px); }

.vp-site :where(.vp-section, section, article, [id]) {
  scroll-margin-top: 104px;
}

@media (max-width: 700px) {
  html { scroll-padding-top: 78px; }
  .vp-site .vp-section,
  .vp-site section[id] { scroll-margin-top: 78px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}