/**
 * ARK-SMS Design Tokens
 * Official brand system — Premium • Minimal • Calm • Controlled
 * Version: 1.0
 */

:root {
  /* ===== Colors ===== */
  --arksms-navy: #0A1A2F;
  --arksms-teal: #2AB7CA;
  --arksms-charcoal: #1F2A44;
  --arksms-slate: #334155;
  --arksms-light-gray: #F5F7FA;
  --arksms-white: #FFFFFF;
  --arksms-gold: #D4A017;

  /* Semantic aliases */
  --arksms-primary: var(--arksms-navy);
  --arksms-accent: var(--arksms-teal);
  --arksms-bg: var(--arksms-light-gray);
  --arksms-text: var(--arksms-charcoal);
  --arksms-text-muted: #6B7280;

  /* ===== Typography ===== */
  --arksms-font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --arksms-font-weight-headline: 700;
  --arksms-font-weight-medium: 500;
  --arksms-font-weight-body: 400;
  --arksms-font-weight-light: 300;
  --arksms-line-height-body: 1.5;
  --arksms-letter-spacing-tagline: 0.02em;

  /* ===== Spacing ===== */
  --arksms-space-xs: 0.25rem;
  --arksms-space-sm: 0.5rem;
  --arksms-space-md: 1rem;
  --arksms-space-lg: 1.5rem;
  --arksms-space-xl: 2rem;

  /* ===== Radii ===== */
  --arksms-radius-sm: 4px;
  --arksms-radius-md: 6px;
  --arksms-radius-lg: 8px;

  /* ===== Shadows ===== */
  --arksms-shadow-sm: 0 1px 2px rgba(10, 26, 47, 0.05);
  --arksms-shadow-md: 0 4px 6px rgba(10, 26, 47, 0.07);
  --arksms-shadow-lg: 0 10px 15px rgba(10, 26, 47, 0.1);

  /* ===== Financial / tabular grid (ARK Grid System) ===== */
  --ark-col-price: 90px;
  --ark-col-qty: 70px;
  --ark-col-subtotal: 100px;
  --ark-col-tax: 72px;
  --ark-col-shop-fee: 72px;
  --ark-col-line-total: 92px;
  --ark-col-actions: 80px;

  --ark-grid-gap: 12px;
  --ark-grid-gap-tight: 10px;

  --ark-row-height: 34px;
  --ark-font-sm: 12px;
  --ark-font-md: 13px;
  --ark-font-lg: 14px;

  --ark-border-subtle: #f1f5f9;
  --ark-text-muted: #6b7280;

  /* ===== Spacing & density (compact rhythm; use everywhere) ===== */
  --ark-space-xxs: 2px;
  --ark-space-xs: 4px;
  --ark-space-sm: 6px;
  --ark-space-md: 8px;
  --ark-space-lg: 12px;
  --ark-space-xl: 16px;

  --ark-section-gap: 12px;
  --ark-card-padding: 12px;
  --ark-card-padding-tight: 8px;

  --ark-control-height: 34px;
  --ark-control-height-sm: 30px;

  /* UI kit radii for dense screens (tabs/cards use --ark-ui-radius-* in ark-ui.css) */
  --ark-radius-sm: 6px;
  --ark-radius-md: 8px;
}

/* Dark mode tokens */
[data-theme="arksms-dark"],
.arksms-dark {
  --arksms-bg: var(--arksms-navy);
  --arksms-text: var(--arksms-white);
  --arksms-text-muted: #94A3B8;
  --arksms-primary: var(--arksms-white);
  --arksms-accent: var(--arksms-teal);
}