/* DELOS Lighting — Product Detail Page Brand Style
   Inspired by the technical spec-sheet layout: clean, professional, industrial.
   Primary hue: DELOS corporate blue. Neutral surfaces for a technical datasheet feel. */

:root {
  /* Brand primary — DELOS corporate blue */
  --delos-primary: #0b4f9e;
  --delos-primary-foreground: #ffffff;
  --delos-primary-tint: #e8f1fb;
  --delos-primary-strong: #083d7a;

  /* Accent — technical gold for CTA (from current site) */
  --delos-accent: #c8a04a;
  --delos-accent-foreground: #1a1a1a;

  /* Neutral surfaces — datasheet white/gray rhythm */
  --delos-background: #ffffff;
  --delos-foreground: #1a1f2c;
  --delos-card: #f7f8fa;
  --delos-card-foreground: #1a1f2c;
  --delos-popover: #ffffff;
  --delos-popover-foreground: #1a1f2c;

  /* Muted — secondary text, table zebra, dividers */
  --delos-muted: #eef1f5;
  --delos-muted-foreground: #5b6473;

  /* Border / input / ring */
  --delos-border: #e3e7ee;
  --delos-input: #e3e7ee;
  --delos-ring: #0b4f9e;

  /* Semantic states */
  --delos-state-success: #1f9d63;
  --delos-state-warning: #d98a00;
  --delos-state-error: #d23b3b;
  --delos-state-info: #0b4f9e;

  /* Radius scale — technical, slightly tighter */
  --delos-radius-sm: 4px;
  --delos-radius-md: 8px;
  --delos-radius-lg: 14px;

  /* Typography — industrial sans, strong hierarchy */
  --delos-font-sans: "Inter", "PingFang SC", "Microsoft YaHei", "Hiragino Sans GB", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --delos-font-mono: "JetBrains Mono", "SF Mono", "Cascadia Code", "Consolas", monospace;

  /* Heading scale */
  --delos-h1: 2.75rem;
  --delos-h2: 1.75rem;
  --delos-h3: 1.25rem;
  --delos-body: 1rem;
  --delos-small: 0.875rem;

  /* Shadow — minimal, technical */
  --delos-shadow-sm: 0 1px 2px rgba(16, 24, 40, 0.04);
  --delos-shadow-md: 0 4px 12px rgba(16, 24, 40, 0.05);
}

html {
  font-family: var(--delos-font-sans);
  color: var(--delos-foreground);
  background: var(--delos-background);
}

body {
  margin: 0;
  font-family: var(--delos-font-sans);
  color: var(--delos-foreground);
  background: var(--delos-background);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
