/**
 * QualiVerse - Design System & Theme Tokens
 * Strictly adhering to AdobeColor Palette:
 * - #00537B (Deep Petrol Teal)
 * - #0E3D9E (Deep Royal Blue - Pure blue, zero purple)
 * - #DCDEE0 (Platinum Slate)
 * - #C4C3C6 (Silver Neutral Border)
 * - #081C26 (Dark Navy / Deep Charcoal Petrol)
 * ABSOLUTELY ZERO PURPLE, ZERO NEON.
 */

:root {
  /* Core Palette Tokens */
  --qv-platinum: #DCDEE0;
  --qv-platinum-light: #F4F6F8;
  --qv-platinum-subtle: #EBEEF1;
  --qv-royal-blue: #0E3D9E;
  --qv-royal-blue-hover: #0A2E7A;
  --qv-royal-blue-soft: rgba(14, 61, 158, 0.08);
  --qv-royal-blue-glow: rgba(14, 61, 158, 0.2);
  --qv-silver: #C4C3C6;
  --qv-silver-light: #E5E7EB;
  --qv-silver-border: rgba(196, 195, 198, 0.55);
  --qv-petrol-teal: #00537B;
  --qv-petrol-teal-hover: #003E5C;
  --qv-petrol-teal-soft: rgba(0, 83, 123, 0.08);

  /* Deep Darks (Midnight Navy / Deep Petrol - Zero Purple) */
  --qv-dark-navy: #081C26;
  --qv-dark-navy-soft: rgba(8, 28, 38, 0.05);
  --qv-dark-navy-surface: #0E2430;
  --qv-dark-navy-deep: #05131A;
  
  /* Semantic Light Surfaces */
  --bg-primary: #FFFFFF;
  --bg-secondary: #F7F9FA;
  --bg-tertiary: #EEF2F5;
  --bg-surface: #FFFFFF;
  --bg-card: rgba(255, 255, 255, 0.92);
  --bg-glass: rgba(255, 255, 255, 0.85);
  --bg-glass-nav: rgba(255, 255, 255, 0.92);

  /* Typography Colors */
  --text-primary: #081C26;
  --text-secondary: #334155;
  --text-muted: #5F6D7E;
  --text-on-dark: #FFFFFF;
  --text-on-royal: #FFFFFF;
  --text-petrol: #00537B;

  /* Borders & Dividers */
  --border-subtle: rgba(196, 195, 198, 0.4);
  --border-medium: rgba(196, 195, 198, 0.7);
  --border-strong: #C4C3C6;
  --border-accent: rgba(14, 61, 158, 0.25);
  --border-teal: rgba(0, 83, 123, 0.25);

  /* Status Colors */
  --status-success: #0E7048;
  --status-success-bg: rgba(14, 112, 72, 0.08);
  --status-warning: #B45309;
  --status-warning-bg: rgba(180, 83, 9, 0.08);
  --status-info: #00537B;
  --status-info-bg: rgba(0, 83, 123, 0.08);

  /* Shadows & Depth */
  --shadow-xs: 0 1px 2px rgba(8, 28, 38, 0.04);
  --shadow-sm: 0 2px 8px rgba(8, 28, 38, 0.06);
  --shadow-md: 0 6px 20px rgba(8, 28, 38, 0.08);
  --shadow-lg: 0 12px 36px rgba(8, 28, 38, 0.12);
  --shadow-xl: 0 24px 60px rgba(8, 28, 38, 0.15);
  --shadow-royal: 0 10px 30px rgba(14, 61, 158, 0.22);
  --shadow-teal: 0 10px 30px rgba(0, 83, 123, 0.2);

  /* Radii */
  --radius-xs: 4px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 22px;
  --radius-2xl: 28px;
  --radius-full: 9999px;

  /* Transitions */
  --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-normal: 250ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-smooth: 350ms cubic-bezier(0.16, 1, 0.3, 1);
  --transition-bounce: 500ms cubic-bezier(0.34, 1.56, 0.64, 1);

  /* Fonts */
  --font-arabic: 'Cairo', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-english: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-family: var(--font-arabic);
}

/* RTL / LTR Configuration */
html[dir="rtl"] {
  --font-family: var(--font-arabic);
  direction: rtl;
  text-align: right;
}

html[dir="ltr"] {
  --font-family: var(--font-english);
  direction: ltr;
  text-align: left;
}

/* Base resets */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  scroll-behavior: smooth;
  font-size: 16px;
  -webkit-text-size-adjust: 100%;
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
}

body {
  font-family: var(--font-family);
  background-color: var(--bg-secondary);
  color: var(--text-primary);
  line-height: 1.6;
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
  position: relative;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 9px;
}

::-webkit-scrollbar-track {
  background: var(--bg-secondary);
}

::-webkit-scrollbar-thumb {
  background: var(--border-medium);
  border-radius: var(--radius-full);
  border: 2px solid var(--bg-secondary);
}

::-webkit-scrollbar-thumb:hover {
  background: var(--qv-petrol-teal);
}

/* Selection */
::selection {
  background-color: var(--qv-royal-blue);
  color: #FFFFFF;
}