/**
 * DadaStyle Operations Manager — shared design tokens.
 *
 * This file is intentionally additive. Existing module styles continue to use
 * their current variables until each component is migrated and validated.
 * New shared components should consume the canonical --dom-* tokens below.
 */
:root {
  /* Brand and semantic colors. */
  --dom-color-accent: var(--dom-site-accent, var(--dom-woo-accent, #db2777));
  --dom-color-accent-soft: var(--dom-woo-soft, #fff1f6);
  --dom-color-accent-border: var(--dom-woo-border, #f3bfd2);
  --dom-color-accent-text: var(--dom-woo-text, #9d174d);

  --dom-color-smartbill: var(--dom-sb-accent, #38bdf8);
  --dom-color-smartbill-soft: var(--dom-sb-soft, #f0f9ff);
  --dom-color-smartbill-border: var(--dom-sb-border, #bae6fd);
  --dom-color-smartbill-text: var(--dom-sb-text, #0369a1);

  --dom-color-success: var(--dom-success, #2e7d32);
  --dom-color-warning: var(--dom-warning, #f59e0b);
  --dom-color-danger: var(--dom-danger, #dc2626);

  /* Surfaces and text. */
  --dom-color-page-bg: #f3f8fa;
  --dom-color-surface: var(--dom-card-bg, #ffffff);
  --dom-color-surface-subtle: #f8fafc;
  --dom-color-surface-muted: #f1f5f9;
  --dom-color-text: var(--dom-text, #1f2937);
  --dom-color-text-strong: #0f172a;
  --dom-color-text-muted: #64748b;
  --dom-color-heading: #42130d;
  --dom-color-border: #e2e8f0;
  --dom-color-border-strong: #cbd5e1;

  /* Spacing scale. */
  --dom-space-1: 4px;
  --dom-space-2: 8px;
  --dom-space-3: 12px;
  --dom-space-4: 16px;
  --dom-space-5: 20px;
  --dom-space-6: 24px;
  --dom-space-7: 32px;
  --dom-space-8: 40px;

  /* Shape and sizing. */
  --dom-radius-sm: 8px;
  --dom-radius-md: 12px;
  --dom-radius-lg: 16px;
  --dom-radius-xl: 22px;
  --dom-radius-pill: 999px;

  --dom-control-height: 44px;
  --dom-control-height-mobile: 48px;
  --dom-icon-button-size: 42px;
  --dom-touch-target: 44px;

  /* Elevation and motion. */
  --dom-shadow-card: 0 1px 2px rgba(15, 23, 42, 0.04);
  --dom-shadow-floating: 0 8px 24px rgba(15, 23, 42, 0.08);
  --dom-transition-fast: 150ms ease;
  --dom-transition-normal: 220ms ease;

  /* Layout defaults. */
  --dom-page-inline-padding: 24px;
  --dom-page-inline-padding-mobile: 16px;
  --dom-section-gap: 24px;
  --dom-section-gap-mobile: 20px;
  --dom-content-max-width: none;

  /* Shared application layering contract. Branch 41.2 consolidates modal and
   * confirmation ownership so modules never invent large local z-index values. */
  --dom-layer-workspace-popover: 14;
  --dom-layer-workspace-tabs: 15;
  --dom-layer-modal: 100100;
  --dom-layer-confirmation: 100140;
  --dom-layer-toast: 100200;
  --dom-layer-critical: 100500;

  /* Shared Box & Section contract — sourced from validated Returns surfaces. */
  --dom-box-bg: var(--dom-color-surface);
  --dom-box-border: 1px solid var(--dom-color-border);
  --dom-box-radius: var(--dom-radius-lg);
  --dom-box-shadow: var(--dom-shadow-card);
  --dom-box-padding: var(--dom-space-5);
  --dom-box-padding-mobile: var(--dom-space-4);
  --dom-box-padding-compact: var(--dom-space-4);
  --dom-box-header-gap: var(--dom-space-4);
  --dom-box-content-gap: var(--dom-space-4);
  --dom-box-list-gap: var(--dom-space-3);
  --dom-box-list-gap-mobile: var(--dom-space-2);
  --dom-box-section-gap: var(--dom-section-gap);
  --dom-box-section-gap-mobile: var(--dom-section-gap-mobile);
}