/* VetChip UI Foundation — shared components. */
.vc-app{font-family:var(--vc-font-sans);color:var(--vc-color-text);background:var(--vc-color-canvas)}
.vc-app :where(button,input,select,textarea,a){font:inherit}
.vc-app :where(button,input,select,textarea){min-height:var(--vc-control-min-height)}
.vc-app :where(button,a,input,select,textarea):focus-visible{outline:0;box-shadow:var(--vc-focus-ring)}
.vc-app :where(button,input,select,textarea):disabled{opacity:.55;cursor:not-allowed}
.vc-app :where(button):disabled:hover{filter:none}

.vc-button,.vc-button--primary,.vc-button--secondary,.vc-button--quiet,.vc-button--danger{
  min-height:var(--vc-control-min-height);display:inline-flex;align-items:center;justify-content:center;gap:var(--vc-space-2);
  padding:10px 16px;border-radius:var(--vc-radius-sm);border:1px solid transparent;font-weight:700;cursor:pointer;
  transition:background var(--vc-motion-fast),border-color var(--vc-motion-fast),box-shadow var(--vc-motion-fast),transform var(--vc-motion-fast)
}
.vc-button--primary{background:var(--vc-color-action);color:var(--vc-color-on-action);border-color:var(--vc-color-action)}
.vc-button--primary:hover:not(:disabled){background:var(--vc-color-action-hover);border-color:var(--vc-color-action-hover)}
.vc-button--secondary{background:var(--vc-color-surface);color:var(--vc-color-brand);border-color:var(--vc-color-border)}
.vc-button--secondary:hover:not(:disabled){background:var(--vc-color-surface-muted)}
.vc-button--quiet{background:transparent;color:var(--vc-color-brand);border-color:transparent}
.vc-button--quiet:hover:not(:disabled){background:var(--vc-color-surface-muted)}
.vc-button--danger{background:var(--vc-color-danger);color:var(--vc-color-on-brand);border-color:var(--vc-color-danger)}

.vc-field{display:grid;gap:var(--vc-space-2)}
.vc-field>label,.vc-field-label{font-size:var(--vc-font-size-sm);font-weight:700;color:var(--vc-color-text)}
.vc-input,.vc-select,.vc-textarea{
  width:100%;min-height:var(--vc-control-min-height);box-sizing:border-box;border:1px solid var(--vc-color-border);
  border-radius:var(--vc-radius-sm);background:var(--vc-color-surface);color:var(--vc-color-text);padding:10px 12px
}
.vc-textarea{min-height:96px;resize:vertical}
.vc-card{background:var(--vc-color-surface);border:1px solid var(--vc-color-border);border-radius:var(--vc-radius-lg);box-shadow:var(--vc-shadow-sm);padding:var(--vc-space-4)}
.vc-status--success,.vc-status--warning,.vc-status--danger,.vc-status--info{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;font-size:var(--vc-font-size-sm);font-weight:700}
.vc-status--success{color:var(--vc-color-success);background:var(--vc-color-success-soft)}
.vc-status--warning{color:var(--vc-color-warning);background:var(--vc-color-warning-soft)}
.vc-status--danger{color:var(--vc-color-danger);background:var(--vc-color-danger-soft)}
.vc-status--info{color:var(--vc-color-info);background:var(--vc-color-info-soft)}
.vc-notice{border:1px solid var(--vc-color-border);border-radius:var(--vc-radius-md);padding:var(--vc-space-3) var(--vc-space-4);background:var(--vc-color-surface)}
.vc-empty-state,.vc-loading-state{display:grid;place-items:center;min-height:120px;text-align:center;padding:var(--vc-space-6);border:1px dashed var(--vc-color-border);border-radius:var(--vc-radius-md);background:var(--vc-color-surface-muted);color:var(--vc-color-text-muted)}
.vc-page-header{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--vc-space-4);margin-bottom:var(--vc-space-6)}
.vc-page-header h1,.vc-page-header h2{margin:0;color:var(--vc-color-brand)}
.vc-page-header p{margin:6px 0 0;color:var(--vc-color-text-muted)}
.vc-filter-bar{display:flex;align-items:end;gap:var(--vc-space-3);flex-wrap:wrap;padding:var(--vc-space-3);background:var(--vc-color-surface);border:1px solid var(--vc-color-border);border-radius:var(--vc-radius-md)}
.vc-dialog{border:0;border-radius:var(--vc-radius-lg);background:var(--vc-color-surface);color:var(--vc-color-text);box-shadow:var(--vc-shadow-lg);max-width:min(680px,94vw)}
.vc-dialog::backdrop{background:var(--vc-color-backdrop)}

@media(max-width:700px){.vc-app :where(input,select,textarea){font-size:16px}.vc-page-header{align-items:stretch;flex-direction:column}}
@media(prefers-reduced-motion:reduce){.vc-app *{scroll-behavior:auto}.vc-button,.vc-button--primary,.vc-button--secondary,.vc-button--quiet,.vc-button--danger{transition:none}}