/*
 * Mazufa Records P63 design tokens
 * Source: the established Mazufa homepage palette and /mazufa-logo.png identity.
 * Keep semantic tokens in components so the brand palette can evolve safely.
 */
:root {
  color-scheme: dark;

  /* Brand primitives */
  --mz-brand-royal-700: #173f7d;
  --mz-brand-royal-600: #1b4f9c;
  --mz-brand-royal-500: #2563b0;
  --mz-brand-cyan-500: #29abe2;
  --mz-brand-cyan-400: #5fc4ee;
  --mz-brand-amber-500: #fbb03b;
  --mz-brand-teal-500: #16a085;
  --mz-brand-red-500: #ff4a43;
  --mz-brand-ink-900: #1f242f;

  /* Neutral primitives */
  --mz-neutral-1000: #05080f;
  --mz-neutral-950: #08101d;
  --mz-neutral-900: #0d1728;
  --mz-neutral-850: #111e32;
  --mz-neutral-800: #18263b;
  --mz-neutral-400: #9facc0;
  --mz-neutral-300: #b8c3d4;
  --mz-neutral-100: #e9eef6;
  --mz-neutral-0: #ffffff;

  /* Semantic color tokens */
  --mz-color-canvas: var(--mz-neutral-1000);
  --mz-color-surface: var(--mz-neutral-900);
  --mz-color-surface-raised: var(--mz-neutral-850);
  --mz-color-surface-soft: color-mix(in srgb, var(--mz-brand-royal-600) 13%, var(--mz-neutral-900));
  --mz-color-text: #f7f9fd;
  --mz-color-text-muted: var(--mz-neutral-300);
  --mz-color-text-subtle: var(--mz-neutral-400);
  --mz-color-border: rgb(255 255 255 / 14%);
  --mz-color-border-strong: rgb(95 196 238 / 45%);
  --mz-color-action: var(--mz-brand-cyan-500);
  --mz-color-action-text: #04121c;
  --mz-color-focus: var(--mz-brand-amber-500);
  --mz-color-success: var(--mz-brand-teal-500);
  --mz-color-danger: var(--mz-brand-red-500);
  --mz-color-selection: rgb(41 171 226 / 32%);

  /* Gradients */
  --mz-gradient-brand: linear-gradient(120deg, var(--mz-brand-royal-600), var(--mz-brand-royal-500) 45%, var(--mz-brand-cyan-500));
  --mz-gradient-action: linear-gradient(110deg, var(--mz-brand-cyan-400), var(--mz-brand-cyan-500) 60%, var(--mz-brand-teal-500));
  --mz-gradient-ink: linear-gradient(155deg, var(--mz-neutral-850), var(--mz-neutral-1000));

  /* Type */
  --mz-font-display: "Space Grotesk", "Manrope", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --mz-font-body: "Manrope", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --mz-font-arabic: "Noto Sans Arabic", "Tahoma", "Arial", sans-serif;
  --mz-text-xs: clamp(0.75rem, 0.72rem + 0.08vw, 0.8rem);
  --mz-text-sm: clamp(0.875rem, 0.84rem + 0.1vw, 0.94rem);
  --mz-text-base: clamp(1rem, 0.96rem + 0.14vw, 1.08rem);
  --mz-text-lg: clamp(1.12rem, 1.04rem + 0.34vw, 1.35rem);
  --mz-text-xl: clamp(1.45rem, 1.2rem + 1vw, 2rem);
  --mz-text-hero: clamp(2.7rem, 1.75rem + 4.5vw, 6.3rem);
  --mz-leading-tight: 1.02;
  --mz-leading-body: 1.7;

  /* Layout */
  --mz-size-content: 76rem;
  --mz-space-1: 0.25rem;
  --mz-space-2: 0.5rem;
  --mz-space-3: 0.75rem;
  --mz-space-4: 1rem;
  --mz-space-5: 1.25rem;
  --mz-space-6: 1.5rem;
  --mz-space-8: 2rem;
  --mz-space-10: 2.5rem;
  --mz-space-12: 3rem;
  --mz-space-16: 4rem;
  --mz-space-20: 5rem;

  /* Shape and depth */
  --mz-radius-sm: 0.75rem;
  --mz-radius-md: 1rem;
  --mz-radius-lg: 1.5rem;
  --mz-radius-xl: 2rem;
  --mz-radius-pill: 999px;
  --mz-shadow-sm: 0 0.5rem 1.5rem rgb(0 0 0 / 20%);
  --mz-shadow-lg: 0 2.5rem 6rem -2.4rem rgb(0 0 0 / 78%);
  --mz-shadow-glow: 0 1.25rem 3.5rem -1.4rem rgb(41 171 226 / 62%);

  /* Motion */
  --mz-ease-out: cubic-bezier(0.22, 0.61, 0.36, 1);
  --mz-duration-fast: 160ms;
  --mz-duration-medium: 360ms;
  --mz-duration-slow: 900ms;
}

:lang(ar) {
  --mz-font-display: var(--mz-font-arabic);
  --mz-font-body: var(--mz-font-arabic);
  --mz-leading-tight: 1.18;
  --mz-leading-body: 1.85;
}

@media (forced-colors: active) {
  :root {
    color-scheme: light dark;
    --mz-color-canvas: Canvas;
    --mz-color-surface: Canvas;
    --mz-color-surface-raised: Canvas;
    --mz-color-surface-soft: Canvas;
    --mz-color-text: CanvasText;
    --mz-color-text-muted: CanvasText;
    --mz-color-text-subtle: CanvasText;
    --mz-color-border: ButtonBorder;
    --mz-color-border-strong: Highlight;
    --mz-color-action: ButtonFace;
    --mz-color-action-text: ButtonText;
    --mz-color-focus: Highlight;
  }
}