/* Shared product components. Use these classes in HTML and generated UI;
   page styles own placement, never another copy of a button or field skin. */
:root{
  --pb-space-1:4px;--pb-space-2:8px;--pb-space-3:12px;
  --pb-space-4:16px;--pb-space-5:24px;--pb-space-6:32px;--pb-space-7:48px;
  --pb-radius-control:16px;--pb-radius-card:24px;--pb-radius-pill:999px;
  --pb-control-height:52px;--pb-control-small:44px;
  --pb-type-body:17px;--pb-type-label:15px;--pb-type-caption:14px;
  --pb-surface:#FFFFFF;--pb-surface-muted:#F1F3FA;--pb-border:#DCE1EE;
  --pb-action:var(--site-action,#FFCE55);--pb-action-hover:#FFD976;--pb-action-edge:var(--site-action-lip,#BE8D19);
  --pb-danger:#A52828;--pb-danger-soft:#FFF0EE;
  --pb-shadow-card:0 6px 24px #1216330a;
  --pb-focus:var(--site-accent,#FFCE55);
}
.pb-button{
  box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;gap:var(--pb-space-2);
  min-height:var(--pb-control-height);max-width:100%;padding:12px 24px;border:2px solid transparent;
  border-radius:var(--pb-radius-control);background:var(--pb-action);color:var(--pb-ink);
  box-shadow:0 4px 0 var(--pb-action-edge);font:800 var(--pb-type-body)/1.25 var(--pb-font);
  letter-spacing:-.01em;text-align:center;text-decoration:none;white-space:normal;overflow-wrap:anywhere;
  cursor:pointer;touch-action:manipulation;vertical-align:middle;
  transition:background .12s,box-shadow .12s,transform .09s;
}
.pb-button:hover:not(:disabled):not([aria-disabled=true]){background:var(--pb-action-hover);filter:none}
.pb-button:active:not(:disabled):not([aria-disabled=true]){transform:translateY(2px);box-shadow:0 2px 0 var(--pb-action-edge)}
.pb-button--secondary{background:transparent;color:inherit;border-color:currentColor;box-shadow:none}
.pb-button--secondary:hover:not(:disabled):not([aria-disabled=true]){background:color-mix(in srgb,currentColor 8%,transparent)}
.pb-button--secondary:active:not(:disabled){box-shadow:none}
.pb-button--quiet{background:transparent;color:inherit;box-shadow:none;text-decoration:underline;text-underline-offset:4px}
.pb-button--quiet:hover:not(:disabled){background:color-mix(in srgb,currentColor 8%,transparent)}
.pb-button--quiet:active:not(:disabled){box-shadow:none}
.pb-button--danger{background:var(--pb-danger);color:white;box-shadow:0 4px 0 #791C1C}
.pb-button--danger:hover:not(:disabled){background:#8B2020}
.pb-button--danger:active:not(:disabled){box-shadow:0 2px 0 #791C1C}
.pb-button--small{min-height:var(--pb-control-small);padding:9px 16px;font-size:var(--pb-type-label)}
.pb-button--block{width:100%}
.pb-button--icon{width:var(--pb-control-small);height:var(--pb-control-small);min-height:var(--pb-control-small);padding:8px;font-size:20px;line-height:1;flex:none}
.pb-button svg{width:20px;height:20px;flex:none}
.pb-button:is(:disabled,[aria-disabled=true]){opacity:.5;cursor:not-allowed;transform:none;filter:none}
.pb-button:focus-visible,.pb-input:focus-visible{outline:3px solid var(--pb-focus);outline-offset:4px}
.pb-button[aria-busy=true]::before{content:'';width:16px;height:16px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:pb-control-spin .8s linear infinite;flex:none}
@keyframes pb-control-spin{to{transform:rotate(1turn)}}
.pb-card{box-sizing:border-box;border:1px solid var(--pb-border);border-radius:var(--pb-radius-card);padding:var(--pb-card-padding,var(--pb-space-5));background:var(--pb-surface);color:var(--pb-ink);box-shadow:var(--pb-shadow-card);--pb-focus:var(--pb-blue)}
.pb-card--flush{--pb-card-padding:0}
.pb-field{display:grid;gap:var(--pb-space-2);min-width:0}
.pb-label{font-size:var(--pb-type-label);font-weight:800;line-height:1.4}
.pb-input{box-sizing:border-box;width:100%;min-width:0;min-height:var(--pb-control-height);padding:12px 16px;border:2px solid var(--pb-border);border-radius:var(--pb-radius-control);background:var(--pb-surface);color:var(--pb-ink);font:500 var(--pb-type-body)/1.4 var(--pb-font);--pb-focus:var(--pb-blue)}
textarea.pb-input{min-height:120px;resize:vertical}
.pb-input[aria-invalid=true]{border-color:var(--pb-danger)}
.pb-input:disabled{background:var(--pb-surface-muted);opacity:.65;cursor:not-allowed}
.pb-hint{margin:0;font-size:var(--pb-type-caption);line-height:1.5;color:var(--pb-ink-muted)}
.pb-error{margin:0;font-size:var(--pb-type-caption);line-height:1.5;color:var(--pb-danger)}
.pb-notice{padding:var(--pb-space-4);border:1px solid transparent;border-radius:var(--pb-radius-control);background:var(--pb-blue-soft);color:var(--pb-ink);font-size:var(--pb-type-body);line-height:1.5}
.pb-notice--error{background:var(--pb-danger-soft);color:var(--pb-danger)}
.pb-notice--warning{background:var(--pb-yellow-soft);color:#674C00}
.pb-notice--success{background:var(--pb-green-soft);color:var(--pb-green-text)}
.pb-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:var(--pb-radius-pill);background:var(--pb-surface-muted);color:var(--pb-ink);font-size:var(--pb-type-caption);font-weight:700;line-height:1.3}
.pb-badge--success{background:var(--pb-green-soft);color:var(--pb-green-text)}
.pb-badge--warning{background:var(--pb-yellow-soft);color:#674C00}
:is(dialog,.parts-panel,.journey-card,.payment-receipt){--pb-focus:var(--pb-blue)}
@media(prefers-reduced-motion:reduce){.pb-button{transition:none}.pb-button:active:not(:disabled){transform:none}.pb-button[aria-busy=true]::before{animation:none;border-right-color:currentColor}}
