/**
 * Oreneta Design Tokens
 * ─────────────────────
 * Single source of truth for all visual constants across
 * every Oreneta plugin. Other stylesheets declare
 * `oreneta-core-tokens` as a dependency and use these
 * custom properties.
 *
 * Handle: oreneta-core-tokens
 * Version: 1.0.0
 */

:root {

  /* ─── Brand ─── */
  --oreneta-color-primary:          #3643ba;
  --oreneta-color-primary-hover:    #2d38a0;
  --oreneta-color-primary-active:   #242e88;
  --oreneta-color-primary-light:    #ecedf8;
  --oreneta-color-primary-contrast: #ffffff;

  /* ─── Text ─── */
  --oreneta-color-text:             #101010;
  --oreneta-color-text-secondary:   #444444;
  --oreneta-color-text-muted:       #666666;
  --oreneta-color-text-soft:        #6b7280;
  --oreneta-color-text-struck:      #616161;
  --oreneta-color-text-inverse:     #ffffff;

  /* ─── Backgrounds ─── */
  --oreneta-color-bg:               #ffffff;
  --oreneta-color-bg-subtle:        #f5f5f5;
  --oreneta-color-bg-subtle-alt:    #f2f2f2;
  --oreneta-color-bg-muted:         #ebebeb;
  --oreneta-color-bg-overlay:       rgba(0, 0, 0, 0.45);

  /* ─── Borders ─── */
  --oreneta-color-border:           #e2e2e2;
  --oreneta-color-border-soft:      #dedede;
  --oreneta-color-border-strong:    #808080;
  --oreneta-color-border-focus:     var(--oreneta-color-primary);

  /* ─── Commerce / catalog ─── */
  --oreneta-color-accent-soft:      #b3bce6;
  --oreneta-color-highlight:        #ffd666;
  --oreneta-price-chip-bg:          #ffcd4f;
  --oreneta-price-chip-text-color:  var(--oreneta-color-text);
  --oreneta-price-sale-bg:          #d70321;
  --oreneta-price-sale-text-color:  var(--oreneta-color-text-inverse);

  /* ─── Semantic states ─── */
  --oreneta-color-success:          #1a8a4a;
  --oreneta-color-success-light:    #e8f5ee;
  --oreneta-color-warning:          #d4890a;
  --oreneta-color-warning-light:    #fef6e8;
  --oreneta-color-error:            #c9303e;
  --oreneta-color-error-light:      #fce8ea;
  --oreneta-color-info:             #2680eb;
  --oreneta-color-info-light:       #e8f0fd;

  /* ─── Typography ─── */
  --oreneta-font-family:            'Inter', system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --oreneta-font-family-mono:       ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --oreneta-font-size-2xs:          11px;
  --oreneta-font-size-xs:           12px;
  --oreneta-font-size-sm:           14px;
  --oreneta-font-size-md:           16px;
  --oreneta-font-size-lg:           20px;
  --oreneta-font-size-xl:           24px;
  --oreneta-font-size-2xl:          32px;
  --oreneta-font-size-3xl:          40px;
  --oreneta-font-weight-normal:     400;
  --oreneta-font-weight-medium:     500;
  --oreneta-font-weight-semibold:   600;
  --oreneta-font-weight-bold:       700;
  --oreneta-line-height-tight:      1.2;
  --oreneta-line-height-normal:     1.5;
  --oreneta-line-height-relaxed:    1.75;

  /* ─── Spacing scale ─── */
  --oreneta-space-2xs:              2px;
  --oreneta-space-xs:               4px;
  --oreneta-space-sm:               8px;
  --oreneta-space-md:               16px;
  --oreneta-space-lg:               24px;
  --oreneta-space-xl:               32px;
  --oreneta-space-2xl:              48px;
  --oreneta-space-3xl:              64px;

  /* ─── Border radius ─── */
  --oreneta-radius-sm:              4px;
  --oreneta-radius-md:              8px;
  --oreneta-radius-lg:              16px;
  --oreneta-radius-pill:            999px;
  --oreneta-radius-circle:          50%;

  /* ─── Shadows ─── */
  --oreneta-shadow-sm:              0 1px 2px rgba(0, 0, 0, 0.06);
  --oreneta-shadow-md:              0 4px 12px rgba(0, 0, 0, 0.08);
  --oreneta-shadow-lg:              0 8px 24px rgba(0, 0, 0, 0.12);
  --oreneta-shadow-xl:              0 16px 48px rgba(0, 0, 0, 0.16);

  /* ─── Transitions ─── */
  --oreneta-transition-fast:        0.15s ease;
  --oreneta-transition-normal:      0.25s cubic-bezier(0.4, 0, 0.2, 1);
  --oreneta-transition-slow:        0.4s ease;
  --oreneta-transition-panel:      0.35s cubic-bezier(0.32, 0.72, 0, 1);

  /* ─── Controls ─── */
  --oreneta-control-height-sm:      40px;
  --oreneta-control-height:         48px;
  --oreneta-control-height-lg:      56px;

  /* ─── Z-index layers ─── */
  --oreneta-z-dropdown:             100;
  --oreneta-z-sticky:               200;
  --oreneta-z-header:               500;
  --oreneta-z-panel:               900;
  --oreneta-z-overlay:              998;
  --oreneta-z-lightbox:             999;
  --oreneta-z-toast:                1000;

  /* ─── Breakpoints (for reference, use in @media) ─── */
  /* Mobile:  < 768px  */
  /* Tablet:  768–1024px */
  /* Desktop: > 1024px */
}
