/* ============================================================
   AllVideo — CSS Variables
   AllPixel Technologies | allvideo.in
   ============================================================ */

:root {
  /* ── Brand Colors ────────────────────────────────────── */
  --primary:        #0EA5E9;
  --primary-dark:   #0369A1;
  --primary-light:  #E0F2FE;
  --primary-hover:  #0284C7;

  /* ── Status Colors ───────────────────────────────────── */
  --success:   #22C55E;
  --danger:    #EF4444;
  --warning:   #F59E0B;
  --info:      #3B82F6;
  --live:      #EF4444;

  /* ── Neutral ─────────────────────────────────────────── */
  --white:  #FFFFFF;
  --black:  #000000;

  /* ── Light Theme (default) ───────────────────────────── */
  --bg:            #FFFFFF;
  --bg-secondary:  #F9FAFB;
  --bg-tertiary:   #F3F4F6;
  --surface:       #FFFFFF;
  --surface-raised:#F9FAFB;
  --border:        #E5E7EB;
  --border-light:  #F3F4F6;

  --text:          #111827;
  --text-secondary:#6B7280;
  --text-tertiary: #9CA3AF;
  --text-inverse:  #FFFFFF;

  --link:          #0EA5E9;
  --link-hover:    #0369A1;

  /* ── Sidebar ─────────────────────────────────────────── */
  --sidebar-w:        240px;
  --sidebar-w-mini:   72px;
  --header-h:         56px;
  --bottom-nav-h:     64px;

  /* ── Shadows ─────────────────────────────────────────── */
  --shadow-sm:  0 1px 3px rgba(0,0,0,.08);
  --shadow-md:  0 4px 12px rgba(0,0,0,.10);
  --shadow-lg:  0 10px 30px rgba(0,0,0,.14);

  /* ── Border Radius ───────────────────────────────────── */
  --radius-sm:  4px;
  --radius:     8px;
  --radius-md:  12px;
  --radius-lg:  16px;
  --radius-xl:  24px;
  --radius-full:9999px;

  /* ── Typography ──────────────────────────────────────── */
  --font:       'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono:  'Fira Code', 'Courier New', monospace;

  /* ── Transitions ─────────────────────────────────────── */
  --transition: 150ms ease;
  --transition-slow: 300ms ease;

  /* ── Z-index ─────────────────────────────────────────── */
  --z-dropdown: 100;
  --z-sidebar:  200;
  --z-header:   300;
  --z-modal:    400;
  --z-toast:    500;
}

/* ── Dark Theme ───────────────────────────────────────── */
[data-theme="dark"] {
  --bg:            #0F0F0F;
  --bg-secondary:  #161616;
  --bg-tertiary:   #1F1F1F;
  --surface:       #212121;
  --surface-raised:#282828;
  --border:        #2F2F2F;
  --border-light:  #3F3F3F;

  --text:          #F1F1F1;
  --text-secondary:#AAAAAA;
  --text-tertiary: #717171;
  --text-inverse:  #0F0F0F;

  --link:          #3EA6FF;
  --link-hover:    #65B9FF;

  --primary-light: rgba(14,165,233,.15);

  --shadow-sm:  0 1px 3px rgba(0,0,0,.3);
  --shadow-md:  0 4px 12px rgba(0,0,0,.4);
  --shadow-lg:  0 10px 30px rgba(0,0,0,.5);
}