/* Shared interaction geometry. Surface palettes and content layouts stay local. */
:root {
  --ui-radius-control: 12px;
  --ui-control-height: 48px;
  --ui-control-compact: 44px;
  --ui-control-padding: 20px;
  --ui-space-1: 8px;
  --ui-space-2: 12px;
  --ui-space-3: 16px;
  --ui-space-4: 24px;
  --ui-space-5: 32px;
  --ui-space-6: 48px;
  --ui-gutter: clamp(20px, 3.75vw, 64px);
  --ui-section: clamp(40px, 5vw, 72px);
  --ui-column: clamp(24px, 4vw, 64px);
}

/* Text actions share shape, baseline and touch area, regardless of surface. */
:root [data-ui-surface] :is(.button, .entry-button, .login-link,
  .workspace-links button, .receipt-actions button, .guide-topics button, .guide-suggestions button,
  .categories button, .category-nav button),
:root [data-ui-surface="workspace"] button:not(.tab):not(.rowbutton):not(.provider-option):not(nav button):not(.access-tabs button) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--ui-space-2);
  min-height: var(--ui-control-height);
  padding: 12px var(--ui-control-padding);
  border-radius: var(--ui-radius-control);
  font-size: 16px;
  font-weight: 500;
  line-height: 1.375;
  text-align: center;
  text-decoration: none;
  vertical-align: middle;
  white-space: normal;
  transition: background-color 150ms, border-color 150ms, color 150ms, opacity 150ms;
}

:root [data-ui-surface] :is(.compact, .login-link, .add,
  .receipt-actions button, .guide-topics button, .guide-suggestions button,
  .categories button, .category-nav button),
:root [data-ui-surface="workspace"] button.small {
  min-height: var(--ui-control-compact);
  padding: 10px 16px;
}
:root [data-ui-surface] :is(.close, .icon-button, .quantity button, .mobile-toggle) {
  width: var(--ui-control-compact);
  height: var(--ui-control-compact);
  min-width: var(--ui-control-compact);
  min-height: var(--ui-control-compact);
  padding: 0;
  border-radius: var(--ui-radius-control);
  align-items: center;
  justify-content: center;
}
:root [data-ui-surface] :is(.close, .icon-button, .quantity button) { display: inline-flex; }
:root [data-ui-surface] :is(.button, .entry-button, .login-link) svg { flex-shrink: 0; }
:root [data-ui-surface] :is(.close, .icon-button, .quantity button, .mobile-toggle):hover {
  background: var(--accent-soft, var(--surface, var(--paper)));
}
:root [data-ui-surface] :is(.button, .entry-button, .login-link, button):active:not(:disabled) {
  opacity: .8;
}
:root [data-ui-surface] :is(a, button, summary, input, select, textarea):focus-visible {
  outline: 3px solid var(--focus, var(--accent));
  outline-offset: 4px;
}
:root [data-ui-surface] button:disabled {
  cursor: not-allowed;
  opacity: .55;
}
:root [data-ui-surface] button:disabled:not(.table) { transform: none; }
:root [data-ui-surface] [aria-busy="true"] { cursor: progress; }
:root [data-ui-surface] :is(input, select, textarea):not([type="checkbox"]):not([type="radio"]) {
  border-radius: var(--ui-radius-control);
  min-height: var(--ui-control-height);
  padding: 12px 16px;
  font-size: 16px;
  line-height: 1.4;
}
:root [data-ui-surface] :is(input, select, textarea)[aria-invalid="true"] {
  border-color: var(--danger, var(--error, #9e3029));
  border-width: 2px;
}

/* Action rows use one gap; tabs remain navigation, not filled buttons. */
[data-ui-surface] :is(.hero-actions, .welcome-actions, .partner-actions,
  .receipt-actions, .row-actions, .garden-restaurant-actions, .guide-suggestions) {
  gap: var(--ui-space-2);
  align-items: center;
}
[data-ui-surface] :is(.guide-topics, .categories, .category-nav) { gap: var(--ui-space-1); }
[data-ui-surface] :is(.preview-tabs, .view-nav, .tabs) { gap: var(--ui-space-4); }
[data-ui-surface] :is(.preview-tabs button, .view-nav button, .tab) {
  border-radius: 0;
  min-height: var(--ui-control-height);
  line-height: 1.4;
}

/* Garden's public pages: repeat the same section rhythm and content axes. */
[data-ui-surface="site"] :is(.wrap, .shell) {
  width: min(1320px, calc(100% - 2 * var(--ui-gutter)));
}
[data-ui-surface="site"] :is(.story, .possibilities, .partner-feature,
  .partner-library, .partner-teaser, .partner-intro, .how-section,
  .connect-section, .product-hero, .product-callout, .legal, .login-layout) {
  padding-block: var(--ui-section);
}
[data-ui-surface="site"] :is(.story, .product-preview, .partner-feature,
  .partner-library, .partner-teaser, .faq-section, .pilot-layout,
  .product-hero-grid, .login-layout) { gap: var(--ui-column); }
[data-ui-surface="site"] .faq-section { padding-block: var(--ui-space-4) var(--ui-section); }
[data-ui-surface="site"] .product-detail { padding-block: var(--ui-space-4) var(--ui-section); }
[data-ui-surface="site"] :is(.section-heading, .preview-tabs) { margin-bottom: var(--ui-space-5); }
[data-ui-surface="site"] .eyebrow { margin-bottom: var(--ui-space-4); }
[data-ui-surface="site"] .partner-copy { gap: var(--ui-space-4); }
[data-ui-surface="site"] .partner-actions { margin-block: 0; }
[data-ui-surface="site"] .partner-teaser h2 { margin-block: var(--ui-space-4); }
[data-ui-surface="site"] .partner-teaser p:not(.eyebrow) { margin-bottom: var(--ui-space-4); }
[data-ui-surface="site"] .partner-teaser .text-link { margin-top: var(--ui-space-2); }
[data-ui-surface="site"] :is(.pilot-panel, .login-panel) { padding: var(--ui-space-5); }
[data-ui-surface="site"] .pilot-form fieldset { gap: var(--ui-space-4); }
[data-ui-surface="site"] :is(.guide-top, .guide-scroll) { padding: var(--ui-space-4); }
[data-ui-surface="site"] .guide-dialog form { gap: var(--ui-space-2); }
[data-ui-surface="site"] .guide-dialog form .button { min-width: 48px; padding: 12px; }
[data-ui-surface="site"] .guide-topics button { text-align: center; }
[data-ui-surface="site"] .guide-launcher { border-radius: var(--ui-radius-control); }

/* Agent: stable spacing around headings, actions, lists and empty states. */
[data-ui-surface="agent"] { --gutter: var(--ui-gutter); }
[data-ui-surface="agent"] .welcome { padding: var(--ui-section) var(--ui-gutter); gap: var(--ui-column); }
[data-ui-surface="agent"] .welcome-copy > p:not(.eyebrow) { margin-block: var(--ui-space-4); }
[data-ui-surface="agent"] .workspace { padding: var(--ui-space-5) var(--ui-gutter) var(--ui-section); }
[data-ui-surface="agent"] :is(.workspace-heading, .view-nav, .booking-heading) { margin-bottom: var(--ui-space-5); }
[data-ui-surface="agent"] :is(.workspace-heading, .booking-heading) { gap: var(--ui-space-4); align-items: center; }
[data-ui-surface="agent"] :is(.menu-layout, .booking-layout) { gap: var(--ui-column); }
[data-ui-surface="agent"] :is(.category-nav, .booking-controls) { margin-block: var(--ui-space-4); }
[data-ui-surface="agent"] .booking-controls { gap: var(--ui-space-3); }
[data-ui-surface="agent"] .basket { padding: var(--ui-space-4); }
[data-ui-surface="agent"] .basket-heading { margin-bottom: var(--ui-space-4); }
[data-ui-surface="agent"] .help-strip { padding: var(--ui-section) var(--ui-gutter); gap: var(--ui-column); }
[data-ui-surface="agent"] .help-strip p:not(.eyebrow) { margin-bottom: var(--ui-space-4); }
[data-ui-surface="agent"] .activity-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: var(--ui-section) var(--ui-space-4);
  border-block: 1px solid var(--line);
  margin-bottom: var(--ui-space-4);
}
[data-ui-surface="agent"] .activity-empty h3 { max-width: 32ch; margin: 0 0 var(--ui-space-3); }
[data-ui-surface="agent"] .activity-empty p { max-width: 52ch; }
[data-ui-surface="agent"] .activity-empty .button { margin-top: var(--ui-space-4); min-width: 180px; }
[data-ui-surface="agent"] #guide-form .button { width: 100%; margin-top: var(--ui-space-4); }
[data-ui-surface="agent"] .guide-suggestions { margin-top: var(--ui-space-4); }
[data-ui-surface="agent"] :is(.dish-detail-copy, dialog:not(#dish-dialog)) { padding: var(--ui-space-5); }

/* Partner catalogues keep their own colours and photography. */
[data-ui-surface="catalog"] { --gutter: var(--ui-gutter); }
[data-ui-surface="catalog"] .section { padding-block: var(--ui-section); }
[data-ui-surface="catalog"] :is(.section-head, .about, .handoff) { gap: var(--ui-column); }
[data-ui-surface="catalog"] .categories { margin-block: var(--ui-space-4) var(--ui-space-5); }
[data-ui-surface="catalog"] .detail-copy { padding: var(--ui-space-6) var(--ui-space-5) var(--ui-space-5); }
[data-ui-surface="catalog"] .empty .button { margin-top: var(--ui-space-4); }
[data-ui-surface="catalog"] .detail-copy #back-to-catalog { margin-top: var(--ui-space-4); }

[data-ui-surface="workspace"] { --radius-control: var(--ui-radius-control); }
[data-ui-surface="workspace"] .workspace-entry { gap: var(--ui-column); padding-block: var(--ui-section); }
[data-ui-surface="workspace"] .entry-button { justify-content: center; margin-top: var(--ui-space-4); }
[data-ui-surface="workspace"] .entry-action { padding: var(--ui-space-5); }
[data-ui-surface="workspace"] .garden-form { gap: var(--ui-space-4); padding: var(--ui-space-4); }

@media (max-width: 700px) {
  [data-ui-surface="agent"] .welcome-actions { display: grid; grid-template-columns: 1fr; }
  [data-ui-surface="agent"] .welcome-actions .button { width: 100%; }
  [data-ui-surface="agent"] .guide-suggestions button { width: 100%; }
  [data-ui-surface="agent"] .booking-heading > .button { margin-top: var(--ui-space-4); }
  [data-ui-surface="agent"] .activity-empty { padding-inline: 0; }
  [data-ui-surface="agent"] .activity-empty h3 { font-size: 24px; line-height: 1.2; }
  [data-ui-surface="agent"] :is(.dish-detail-copy, dialog:not(#dish-dialog)) { padding: var(--ui-space-4); }
  [data-ui-surface="agent"] .help-strip h2 { margin-bottom: var(--ui-space-4); }
  [data-ui-surface="catalog"] .detail-copy { padding: var(--ui-space-4); }
  [data-ui-surface="catalog"] .handoff .button { margin-top: var(--ui-space-4); }
}
@media (max-width: 600px) {
  :root [data-ui-surface="site"] .header-actions > .button { display: none; }
  [data-ui-surface="site"] .site-header { width: calc(100% - 32px); }
  [data-ui-surface="site"] .hero-actions { display: grid; grid-template-columns: 1fr; }
  [data-ui-surface="site"] .hero-actions > .button { width: 100%; }
  [data-ui-surface="site"] :is(.pilot-panel, .login-panel) { padding: var(--ui-space-4); }
  [data-ui-surface="site"] .partner-actions { align-items: stretch; flex-direction: column; }
  [data-ui-surface="site"] .product-callout .button { width: 100%; }
  [data-ui-surface="workspace"] .entry-action { padding: var(--ui-space-4) 0 0; }
}
@media (prefers-reduced-motion: reduce) {
  [data-ui-surface] *, [data-ui-surface] *::before, [data-ui-surface] *::after {
    transition: none !important;
    animation: none !important;
  }
  [data-ui-surface] :is(button, .button, .entry-button):not(.table):active { transform: none; }
}