@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
  :root {
    --background: 0 0% 100%;
    --foreground: 222.2 84% 4.9%;

    --card: 0 0% 100%;
    --card-foreground: 222.2 84% 4.9%;

    --popover: 0 0% 100%;
    --popover-foreground: 222.2 84% 4.9%;

    --primary: 222.2 47.4% 11.2%;
    --primary-foreground: 210 40% 98%;

    --secondary: 210 40% 96.1%;
    --secondary-foreground: 222.2 47.4% 11.2%;

    --muted: 210 40% 96.1%;
    --muted-foreground: 215.4 16.3% 46.9%;

    --accent: 210 40% 96.1%;
    --accent-foreground: 222.2 47.4% 11.2%;

    --destructive: 0 84.2% 60.2%;
    --destructive-foreground: 210 40% 98%;

    --border: 214.3 31.8% 91.4%;
    --input: 214.3 31.8% 91.4%;
    --ring: 222.2 84% 4.9%;

    --radius: 0.5rem;
  }

  .dark {
    --background: 240 10% 3.9%;
    --foreground: 0 0% 98%;

    --card: 240 10% 6%;
    --card-foreground: 0 0% 98%;

    --popover: 240 10% 6%;
    --popover-foreground: 0 0% 98%;

    --primary: 84 81% 44%;
    --primary-foreground: 240 5.9% 10%;

    --secondary: 240 3.7% 15.9%;
    --secondary-foreground: 0 0% 98%;

    --muted: 240 3.7% 15.9%;
    --muted-foreground: 240 5% 64.9%;

    --accent: 84 81% 44%;
    --accent-foreground: 0 0% 98%;

    --destructive: 0 62.8% 30.6%;
    --destructive-foreground: 0 0% 98%;

    --border: 240 3.7% 15.9%;
    --input: 240 3.7% 15.9%;
    --ring: 84 81% 44%;
  }

  /* --- PREDEFINED THEMES --- */

  [data-theme='purple'] {
    --primary: 262 83% 58%;
    --accent: 262 83% 58%;
    --ring: 262 83% 58%;
    --background: 270 30% 6%;
    --card: 270 25% 9% / 0.9;
    --popover: 270 25% 9% / 0.95;
    --secondary: 270 15% 18%;
    --muted: 270 15% 16%;
    --muted-foreground: 270 20% 60%;
    --border: 270 20% 18%;
  }

  [data-theme='blue'] {
    --primary: 217 91% 60%;
    --accent: 217 91% 60%;
    --ring: 217 91% 60%;
    --background: 222 40% 5%;
    --card: 222 35% 8% / 0.9;
    --popover: 222 35% 8% / 0.95;
    --secondary: 222 20% 17%;
    --muted: 222 20% 15%;
    --muted-foreground: 220 20% 58%;
    --border: 222 20% 17%;
  }

  [data-theme='orange'] {
    --primary: 25 95% 53%;
    --accent: 25 95% 53%;
    --ring: 25 95% 53%;
    --background: 20 30% 5%;
    --card: 20 25% 8% / 0.9;
    --popover: 20 25% 8% / 0.95;
    --secondary: 20 18% 16%;
    --muted: 20 18% 14%;
    --muted-foreground: 25 18% 56%;
    --border: 20 18% 16%;
  }

  [data-theme='red'] {
    --primary: 0 72% 51%;
    --accent: 0 72% 51%;
    --ring: 0 72% 51%;
    --background: 0 30% 5%;
    --card: 0 20% 8% / 0.9;
    --popover: 0 20% 8% / 0.95;
    --secondary: 0 12% 16%;
    --muted: 0 12% 14%;
    --muted-foreground: 0 15% 55%;
    --border: 0 12% 16%;
  }

  [data-theme='pink'] {
    --primary: 330 81% 60%;
    --accent: 330 81% 60%;
    --ring: 330 81% 60%;
    --background: 335 30% 5%;
    --card: 335 25% 8% / 0.9;
    --popover: 335 25% 8% / 0.95;
    --secondary: 335 15% 16%;
    --muted: 335 15% 14%;
    --muted-foreground: 335 18% 56%;
    --border: 335 14% 16%;
  }

  [data-theme='autumn-harvest'] {
    --primary: 36 100% 50%;
    --primary-foreground: 30 40% 8%;
    --accent: 20 90% 48%;
    --accent-foreground: 0 0% 100%;
    --ring: 36 100% 50%;
    --foreground: 35 20% 92%;
    --card-foreground: 35 20% 92%;
    --popover-foreground: 35 20% 92%;
    --muted-foreground: 30 18% 58%;
    --background: 25 35% 6%;
    --card: 25 30% 9% / 0.85;
    --popover: 25 30% 9% / 0.92;
    --secondary: 25 20% 15%;
    --muted: 25 20% 13%;
    --border: 30 25% 16%;
    --bg-image: radial-gradient(ellipse at 20% 80%, rgba(180, 83, 9, 0.15) 0%, transparent 50%),
      radial-gradient(ellipse at 80% 20%, rgba(234, 88, 12, 0.1) 0%, transparent 50%),
      linear-gradient(170deg, #1c1208 0%, #0f0a04 100%);
  }

  [data-theme='arctic-aurora'] {
    --primary: 174 72% 56%;
    --primary-foreground: 180 30% 6%;
    --accent: 200 80% 62%;
    --accent-foreground: 0 0% 100%;
    --ring: 174 72% 56%;
    --foreground: 180 15% 92%;
    --card-foreground: 180 15% 92%;
    --popover-foreground: 180 15% 92%;
    --muted-foreground: 185 15% 58%;
    --background: 200 35% 5%;
    --card: 200 30% 8% / 0.85;
    --popover: 200 30% 8% / 0.92;
    --secondary: 200 20% 14%;
    --muted: 200 20% 12%;
    --border: 195 22% 15%;
    --bg-image: radial-gradient(ellipse at 50% 0%, rgba(45, 212, 191, 0.12) 0%, transparent 50%),
      radial-gradient(ellipse at 20% 60%, rgba(56, 189, 248, 0.08) 0%, transparent 40%),
      linear-gradient(180deg, #050d14 0%, #0a1520 100%);
  }

  /* --- SPECIAL THEMES --- */
  [data-theme='frutiger-aero'] {
    --primary: 200 95% 45%;
    --primary-foreground: 0 0% 100%;
    --accent: 150 80% 50%;
    --ring: 195 100% 50%;

    --foreground: 220 50% 10%;
    --card-foreground: 220 50% 10%;
    --popover-foreground: 220 50% 10%;

    --muted: 210 40% 96.1%;
    --muted-foreground: 215 25% 40%;

    --background: 195 60% 90%;
    --card: 195 100% 95% / 0.7;
    --popover: 195 100% 98% / 0.9;

    --border: 0 0% 100% / 0.8;

    /* Frutiger Aero Gradient */
    --bg-image: linear-gradient(180deg,
        #0ea5e9 0%,
        /* Bright Sky Blue */
        #e0f2fe 50%,
        /* Soft Horizon White */
        #22c55e 100%
        /* Vibrant Grass Green */
      );
  }

  [data-theme='angelcore-racing'] {
    --primary: 0 0% 100%;
    --primary-foreground: 0 0% 0%;

    --accent: 0 0% 80%;
    --accent-foreground: 0 0% 0%;

    --ring: 0 0% 100%;

    --foreground: 0 0% 98%;
    --card-foreground: 0 0% 100%;
    --popover-foreground: 0 0% 100%;
    --muted-foreground: 0 0% 70%;

    --background: 0 0% 0%;
    --card: 0 0% 10% / 0.5;
    --popover: 0 0% 8% / 0.9;

    --border: 0 0% 100% / 0.4;

    /* Racing Gradient */
    --bg-image: radial-gradient(circle at top,
        #262626 0%,
        /* Dark Carbon */
        #000000 70%
        /* Deep Void */
      );
  }

  [data-theme='cyberpunk'] {
    --primary: 320 100% 50%;
    /* Neon Pink */
    --primary-foreground: 0 0% 100%;

    --accent: 180 100% 50%;
    /* Cyan */
    --accent-foreground: 0 0% 0%;

    --ring: 320 100% 50%;

    --foreground: 180 100% 90%;
    /* Light Cyan Text */
    --card-foreground: 180 100% 90%;
    --popover-foreground: 180 100% 90%;
    --muted-foreground: 180 50% 60%;

    --background: 280 60% 5%;
    /* Deep Purple/Black */
    --card: 280 60% 8% / 0.8;
    --popover: 280 60% 8% / 0.9;

    --border: 320 100% 50% / 0.5;
    /* Pink Borders */

    --bg-image: repeating-linear-gradient(0deg,
        transparent,
        transparent 19px,
        rgba(255, 0, 255, 0.1) 20px), linear-gradient(180deg,
        #050014 0%,
        #1a0b2e 100%);
  }

  [data-theme='retro-terminal'] {
    --primary: 120 100% 50%;
    /* Pure Green */
    --primary-foreground: 0 0% 0%;

    --accent: 120 100% 50%;
    --accent-foreground: 0 0% 0%;

    --ring: 120 100% 50%;

    --foreground: 120 100% 50%;
    --card-foreground: 120 100% 50%;
    --popover-foreground: 120 100% 50%;
    --muted-foreground: 120 70% 30%;

    --background: 0 0% 0%;
    --card: 0 0% 5%;
    --popover: 0 0% 5%;

    --border: 120 100% 50% / 0.6;
    --radius: 0;
    /* Blocky edges */

    --bg-image: none;
  }

  [data-theme='midnight-synth'] {
    --primary: 45 100% 50%;
    /* Gold */
    --primary-foreground: 0 0% 0%;

    --accent: 260 100% 60%;
    /* Deep Purple */
    --accent-foreground: 0 0% 100%;

    --ring: 45 100% 50%;

    --foreground: 260 20% 90%;
    --card-foreground: 260 20% 90%;
    --popover-foreground: 260 20% 90%;
    --muted-foreground: 260 30% 60%;

    --background: 260 50% 5%;
    /* Very Dark Indigo */
    --card: 260 50% 8% / 0.8;
    --popover: 260 50% 8% / 0.9;

    --border: 45 100% 50% / 0.3;
    /* Gold subtle */

    --bg-image: linear-gradient(135deg,
        #0f0524 0%,
        #1a0b3e 50%,
        #2d1b4e 100%);
  }

  [data-theme='paperback'] {
    --primary: 25 76% 31%;
    /* Leather Brown */
    --primary-foreground: 35 30% 90%;

    --accent: 35 30% 80%;
    /* Beige */
    --accent-foreground: 25 76% 31%;

    --ring: 25 76% 31%;

    --foreground: 25 10% 20%;
    /* Ink Black/Brown */
    --card-foreground: 25 10% 20%;
    --popover-foreground: 25 10% 20%;
    --muted-foreground: 25 10% 40%;

    --background: 40 50% 94%;
    /* Parchment */
    --card: 40 30% 90%;
    --popover: 40 30% 92%;

    --border: 25 20% 70%;

    --bg-image: url("data:image/svg+xml,%3Csvg width='100' height='100' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100' height='100' filter='url(%23noise)' opacity='0.08'/%3E%3C/svg%3E"), linear-gradient(to bottom, #fdfbf7, #f5f1e8);
  }

  [data-theme='synthwave-84'] {
    --primary: 320 100% 60%;
    /* Hot Pink */
    --primary-foreground: 0 0% 100%;

    --accent: 260 100% 60%;
    /* Deep Purple */
    --accent-foreground: 0 0% 100%;

    --ring: 320 100% 60%;

    --foreground: 280 40% 95%;
    --card-foreground: 280 40% 95%;
    --popover-foreground: 280 40% 95%;
    --muted-foreground: 280 40% 70%;

    --background: 270 50% 10%;
    /* Deep Purple Space */
    --card: 270 50% 15% / 0.8;
    --popover: 270 50% 15% / 0.9;

    --border: 320 100% 60% / 0.4;
    --radius: 0.25rem;

    --bg-image: repeating-linear-gradient(0deg,
        transparent,
        transparent 19px,
        rgba(255, 0, 255, 0.05) 20px), linear-gradient(180deg,
        #240046 0%,
        /* Deep Indigo */
        #3c096c 50%,
        /* Purple */
        #5a189a 100%
        /* Vivid Purple */
      );
  }

  [data-theme='glacier'] {
    --primary: 190 90% 50%;
    /* Ice Blue */
    --primary-foreground: 220 50% 10%;

    --accent: 200 80% 90%;
    /* Frost White */
    --accent-foreground: 220 50% 10%;

    --ring: 190 90% 50%;

    --foreground: 220 30% 20%;
    --card-foreground: 220 30% 20%;
    --popover-foreground: 220 30% 20%;
    --muted-foreground: 220 20% 50%;

    --background: 195 50% 96%;
    /* Very Light Blue */
    --card: 200 60% 98% / 0.7;
    --popover: 200 60% 98% / 0.9;

    --border: 190 50% 80%;
    --radius: 1rem;

    --muted: 210 30% 90%;
    /* Light Blue-Grey for bot bubbles */

    --bg-image: linear-gradient(135deg,
        #e0f7fa 0%,
        #b2ebf2 50%,
        #80deea 100%);
  }

  [data-theme='coffee-shop'] {
    --primary: 25 40% 35%;
    /* Espresso */
    --primary-foreground: 35 20% 90%;

    --accent: 30 50% 60%;
    /* Caramel */
    --accent-foreground: 25 40% 20%;

    --ring: 25 40% 35%;

    --foreground: 25 30% 25%;
    --card-foreground: 25 30% 25%;
    --popover-foreground: 25 30% 25%;
    --muted-foreground: 25 20% 50%;

    --background: 35 30% 92%;
    /* Cream */
    --card: 35 30% 96% / 0.9;
    --popover: 35 30% 98% / 0.95;

    --border: 30 30% 80%;
    --radius: 0.75rem;

    --muted: 35 30% 88%;
    /* Light Cream for bot bubbles */

    --bg-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23a1887f' fill-opacity='0.1' fill-rule='evenodd'%3E%3Ccircle cx='3' cy='3' r='3'/%3E%3Ccircle cx='13' cy='13' r='3'/%3E%3C/g%3E%3C/svg%3E"), linear-gradient(to bottom, #d7ccc8, #efebe9);
  }

  /* Override User Bubble for Coffee Shop to match theme */
  [data-theme='coffee-shop'] .bg-zinc-800 {
    background-color: hsl(25, 40%, 35%);
    /* Espresso */
    color: white;
    /* Ensure text is white against dark espresso */
  }

  /* ═══════════════════════════════════════════════════════════════════════
     FULL OS THEMES — transform the entire UI, not just colors
     ═══════════════════════════════════════════════════════════════════════ */

  [data-theme='windows-7'] {
    --primary: 210 78% 50%;
    --primary-foreground: 0 0% 100%;
    --accent: 210 60% 70%;
    --accent-foreground: 210 50% 15%;
    --ring: 210 78% 50%;
    /* White text for desktop background, dark for inside glass panels */
    --foreground: 0 0% 100%;
    --card-foreground: 210 30% 15%;
    --popover-foreground: 210 30% 15%;
    --muted-foreground: 210 30% 80%;
    --background: 213 58% 38%;
    --card: 200 60% 95% / 0.55;
    --popover: 200 40% 97% / 0.82;
    --secondary: 210 30% 85%;
    --muted: 210 25% 88%;
    --border: 0 0% 100% / 0.45;
    --input: 210 15% 96%;
    --radius: 0.4rem;
    --bg-image:
      radial-gradient(ellipse at 50% 100%, rgba(0, 40, 110, 0.7) 0%, transparent 55%),
      radial-gradient(ellipse at 50% -10%, rgba(100, 180, 255, 0.5) 0%, transparent 40%),
      linear-gradient(180deg, #3a8fd4 0%, #2672b8 25%, #1b5a9e 55%, #0e3d75 100%);
  }

  [data-theme='windows-95'] {
    --primary: 0 0% 50%;
    --primary-foreground: 0 0% 100%;
    --accent: 0 0% 75%;
    --accent-foreground: 0 0% 0%;
    --ring: 240 100% 25%;
    --foreground: 0 0% 0%;
    --card-foreground: 0 0% 0%;
    --popover-foreground: 0 0% 0%;
    --muted-foreground: 0 0% 35%;
    --background: 0 0% 75%;
    --card: 0 0% 75%;
    --popover: 0 0% 75%;
    --secondary: 0 0% 83%;
    --muted: 0 0% 83%;
    --border: 0 0% 50%;
    --input: 0 0% 100%;
    --radius: 0px;
    --bg-image: none;
  }

  [data-theme='evangelion'] {
    --primary: 24 100% 50%;
    /* NERV Orange */
    --primary-foreground: 0 0% 100%;
    --accent: 270 60% 50%;
    /* EVA-01 Purple */
    --accent-foreground: 0 0% 100%;
    --ring: 24 100% 50%;
    --foreground: 24 100% 85%;
    --card-foreground: 24 80% 90%;
    --popover-foreground: 24 80% 90%;
    --muted-foreground: 24 40% 55%;
    --background: 240 20% 6%;
    --card: 240 15% 10% / 0.85;
    --popover: 240 15% 10% / 0.92;
    --secondary: 240 15% 14%;
    --muted: 240 12% 13%;
    --border: 24 100% 50% / 0.35;
    --input: 240 15% 14%;
    --radius: 0.15rem;
    --bg-image:
      repeating-linear-gradient(0deg, transparent, transparent 39px, rgba(255, 102, 0, 0.04) 40px),
      repeating-linear-gradient(90deg, transparent, transparent 39px, rgba(255, 102, 0, 0.04) 40px),
      radial-gradient(ellipse at 50% 50%, rgba(100, 0, 180, 0.12) 0%, transparent 60%),
      linear-gradient(180deg, #0a0a14 0%, #0d0818 50%, #0a0612 100%);
  }

  [data-theme='ghibli-garden'] {
    --primary: 142 40% 42%;
    /* Sage Green */
    --primary-foreground: 0 0% 100%;
    --accent: 80 35% 55%;
    /* Grass Green */
    --accent-foreground: 80 50% 15%;
    --ring: 142 40% 42%;
    --foreground: 30 25% 22%;
    --card-foreground: 30 25% 22%;
    --popover-foreground: 30 25% 22%;
    --muted-foreground: 30 15% 48%;
    --background: 38 50% 95%;
    /* Warm Cream */
    --card: 38 40% 98%;
    --popover: 38 40% 99%;
    --secondary: 38 30% 92%;
    --muted: 38 25% 91%;
    --border: 30 20% 82%;
    --input: 38 30% 96%;
    --radius: 1rem;
    --bg-image:
      url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%2388a070' fill-opacity='0.06' fill-rule='evenodd'%3E%3Ccircle cx='10' cy='10' r='2'/%3E%3Ccircle cx='30' cy='30' r='2'/%3E%3C/g%3E%3C/svg%3E"),
      linear-gradient(180deg, #fdf8f0 0%, #f5efe4 40%, #eee8d8 100%);
  }

  [data-theme='noir-dossier'] {
    --primary: 38 82% 56%;
    --primary-foreground: 24 18% 10%;
    --accent: 2 66% 52%;
    --accent-foreground: 0 0% 100%;
    --ring: 38 82% 56%;

    --foreground: 42 24% 88%;
    --card-foreground: 42 24% 88%;
    --popover-foreground: 42 24% 88%;
    --muted-foreground: 38 16% 62%;

    --background: 30 12% 8%;
    --card: 30 12% 11% / 0.84;
    --popover: 30 12% 10% / 0.94;
    --secondary: 28 12% 14%;
    --muted: 28 10% 16%;
    --border: 38 46% 35% / 0.34;
    --input: 28 10% 14%;
    --radius: 0.35rem;

    --bg-image:
      linear-gradient(90deg, rgba(255, 255, 255, 0.025) 1px, transparent 1px),
      linear-gradient(180deg, rgba(255, 255, 255, 0.018) 1px, transparent 1px),
      radial-gradient(circle at 18% 18%, rgba(180, 83, 9, 0.18) 0%, transparent 32%),
      linear-gradient(145deg, #0e0c0a 0%, #191512 46%, #100d0b 100%);
    background-size: 24px 24px, 24px 24px, auto, auto;
  }

  [data-theme='solar-flare'] {
    --primary: 14 92% 54%;
    --primary-foreground: 0 0% 100%;
    --accent: 45 96% 54%;
    --accent-foreground: 24 80% 16%;
    --ring: 14 92% 54%;

    --foreground: 24 46% 18%;
    --card-foreground: 24 46% 18%;
    --popover-foreground: 24 46% 18%;
    --muted-foreground: 22 28% 42%;

    --background: 42 100% 97%;
    --card: 0 0% 100% / 0.76;
    --popover: 0 0% 100% / 0.9;
    --secondary: 35 100% 91%;
    --muted: 35 92% 93%;
    --border: 20 88% 78%;
    --input: 35 100% 96%;
    --radius: 0.9rem;

    --bg-image:
      radial-gradient(circle at 18% 20%, rgba(250, 204, 21, 0.58) 0%, transparent 30%),
      radial-gradient(circle at 78% 10%, rgba(251, 113, 133, 0.42) 0%, transparent 34%),
      linear-gradient(150deg, #fffbeb 0%, #fed7aa 48%, #fecdd3 100%);
  }

  [data-theme='circuit-board'] {
    --primary: 84 86% 56%;
    --primary-foreground: 150 40% 8%;
    --accent: 166 84% 48%;
    --accent-foreground: 150 40% 8%;
    --ring: 84 86% 56%;

    --foreground: 142 48% 91%;
    --card-foreground: 142 48% 91%;
    --popover-foreground: 142 48% 91%;
    --muted-foreground: 142 22% 64%;

    --background: 160 36% 8%;
    --card: 160 34% 11% / 0.78;
    --popover: 160 34% 10% / 0.94;
    --secondary: 158 28% 15%;
    --muted: 158 24% 16%;
    --border: 84 70% 45% / 0.28;
    --input: 158 24% 14%;
    --radius: 0.45rem;

    --bg-image:
      linear-gradient(90deg, rgba(163, 230, 53, 0.08) 1px, transparent 1px),
      linear-gradient(180deg, rgba(45, 212, 191, 0.06) 1px, transparent 1px),
      radial-gradient(circle at 80% 20%, rgba(45, 212, 191, 0.16) 0%, transparent 30%),
      linear-gradient(160deg, #06110f 0%, #06231d 55%, #0b2a16 100%);
    background-size: 34px 34px, 34px 34px, auto, auto;
  }

  [data-theme='prism-desk'] {
    --primary: 190 86% 42%;
    --primary-foreground: 0 0% 100%;
    --accent: 319 72% 62%;
    --accent-foreground: 0 0% 100%;
    --ring: 190 86% 42%;

    --foreground: 230 24% 18%;
    --card-foreground: 230 24% 18%;
    --popover-foreground: 230 24% 18%;
    --muted-foreground: 230 14% 46%;

    --background: 210 100% 98%;
    --card: 0 0% 100% / 0.72;
    --popover: 0 0% 100% / 0.92;
    --secondary: 190 72% 93%;
    --muted: 260 54% 95%;
    --border: 200 56% 82%;
    --input: 0 0% 100%;
    --radius: 0.75rem;

    --bg-image:
      radial-gradient(circle at 16% 18%, rgba(34, 211, 238, 0.32) 0%, transparent 28%),
      radial-gradient(circle at 82% 16%, rgba(217, 70, 239, 0.24) 0%, transparent 30%),
      radial-gradient(circle at 60% 82%, rgba(129, 140, 248, 0.22) 0%, transparent 32%),
      linear-gradient(145deg, #f8fbff 0%, #ecfeff 48%, #fdf4ff 100%);
  }
}

@layer base {
  * {
    @apply border-border;
  }

  body {
    @apply bg-background text-foreground;
    background-size: cover;
    background-attachment: fixed;
    background-position: center;
    background-image: var(--bg-image, none);
  }

  /* Glassmorphism utility for special themes */
  [data-theme='frutiger-aero'] .bg-card,
  [data-theme='frutiger-aero'] .bg-popover,
  [data-theme='frutiger-aero'] aside {
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
  }

  [data-theme='angelcore-racing'] .bg-card,
  [data-theme='angelcore-racing'] .bg-popover,
  [data-theme='angelcore-racing'] aside {
    backdrop-filter: blur(4px);
    /* Sharper blur for stark contrast */
    -webkit-backdrop-filter: blur(4px);
    border-color: rgba(255, 255, 255, 0.1);
  }

  [data-theme='cyberpunk'] .bg-card,
  [data-theme='cyberpunk'] .bg-popover,
  [data-theme='cyberpunk'] aside {
    backdrop-filter: blur(8px);
    box-shadow: 0 0 10px rgba(255, 0, 255, 0.2), inset 0 0 20px rgba(0, 255, 255, 0.05);
  }

  [data-theme='retro-terminal'] * {
    font-family: 'Courier New', Courier, monospace;
    text-shadow: 0 0 5px rgba(51, 255, 0, 0.5);
  }

  [data-theme='retro-terminal'] ::selection {
    background: #33ff00;
    color: black;
  }

  [data-theme='midnight-synth'] .bg-card,
  [data-theme='midnight-synth'] .bg-popover,
  [data-theme='midnight-synth'] aside {
    backdrop-filter: blur(12px);
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.5), inset 0 0 0 1px rgba(255, 215, 0, 0.1);
    border-radius: 4px;
    /* Slightly more angular */
  }

  [data-theme='paperback'] * {
    font-family: 'Georgia', 'Times New Roman', serif;
  }

  [data-theme='paperback'] .bg-card,
  [data-theme='paperback'] .bg-popover,
  [data-theme='paperback'] aside {
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.05), inset 0 0 40px rgba(139, 69, 19, 0.05);
    /* Paper texture shadow */
    border-radius: 2px;
  }

  /* --- NEW THEME STYLES --- */

  [data-theme='synthwave-84'] * {
    text-shadow: 0 0 2px rgba(255, 0, 255, 0.3);
  }

  [data-theme='synthwave-84'] .bg-card,
  [data-theme='synthwave-84'] .bg-popover,
  [data-theme='synthwave-84'] aside {
    backdrop-filter: blur(8px);
    box-shadow: 0 0 15px rgba(138, 43, 226, 0.3), inset 0 0 20px rgba(255, 0, 255, 0.05);
    border: 1px solid rgba(255, 0, 255, 0.3);
  }

  [data-theme='glacier'] .bg-card,
  [data-theme='glacier'] .bg-popover,
  [data-theme='glacier'] aside {
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15);
    border: 1px solid rgba(255, 255, 255, 0.4);
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.4) 0%, rgba(255, 255, 255, 0.1) 100%);
  }

  /* Override User Bubble for Glacier to match theme */
  [data-theme='glacier'] .bg-zinc-800 {
    background-color: hsl(200, 90%, 35%);
    /* Deep Glacier Blue */
    color: white;
  }

  [data-theme='coffee-shop'] * {
    font-family: 'Verdana', sans-serif;
  }

  [data-theme='coffee-shop'] .bg-card,
  [data-theme='coffee-shop'] .bg-popover,
  [data-theme='coffee-shop'] aside {
    box-shadow: 4px 4px 10px rgba(62, 39, 35, 0.15);
    border: 1px solid rgba(121, 85, 72, 0.2);
  }

  [data-theme='noir-dossier'] .bg-card,
  [data-theme='noir-dossier'] .bg-popover,
  [data-theme='noir-dossier'] aside {
    backdrop-filter: blur(9px);
    -webkit-backdrop-filter: blur(9px);
    box-shadow: 0 14px 32px rgba(0, 0, 0, 0.5), inset 0 0 0 1px rgba(245, 158, 11, 0.12);
    border: 1px solid rgba(245, 158, 11, 0.18);
    background: linear-gradient(145deg, rgba(33, 28, 23, 0.82), rgba(18, 15, 13, 0.88));
  }

  [data-theme='noir-dossier'] .bg-zinc-800 {
    background: linear-gradient(120deg, hsl(38, 82%, 42%), hsl(2, 66%, 38%));
    color: white;
  }

  [data-theme='solar-flare'] .bg-card,
  [data-theme='solar-flare'] .bg-popover,
  [data-theme='solar-flare'] aside {
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 12px 30px rgba(251, 146, 60, 0.22), inset 0 0 0 1px rgba(255, 255, 255, 0.38);
    border: 1px solid rgba(251, 146, 60, 0.28);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.75), rgba(255, 247, 237, 0.66));
  }

  [data-theme='solar-flare'] .bg-zinc-800 {
    background: linear-gradient(120deg, hsl(14, 92%, 54%), hsl(45, 96%, 54%));
    color: white;
  }

  [data-theme='circuit-board'] .bg-card,
  [data-theme='circuit-board'] .bg-popover,
  [data-theme='circuit-board'] aside {
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 12px 30px rgba(2, 44, 34, 0.48), inset 0 0 0 1px rgba(163, 230, 53, 0.12);
    border: 1px solid rgba(163, 230, 53, 0.18);
    background:
      linear-gradient(90deg, rgba(163, 230, 53, 0.045) 1px, transparent 1px),
      linear-gradient(180deg, rgba(45, 212, 191, 0.035) 1px, transparent 1px),
      linear-gradient(145deg, rgba(6, 35, 29, 0.82), rgba(5, 22, 19, 0.9));
    background-size: 18px 18px, 18px 18px, auto;
  }

  [data-theme='circuit-board'] .bg-zinc-800 {
    background: linear-gradient(120deg, hsl(84, 86%, 38%), hsl(166, 84%, 34%));
    color: white;
  }

  [data-theme='circuit-board'] a {
    color: hsl(84, 86%, 68%) !important;
    text-decoration-color: hsla(84, 86%, 68%, 0.5) !important;
  }

  [data-theme='prism-desk'] .bg-card,
  [data-theme='prism-desk'] .bg-popover,
  [data-theme='prism-desk'] aside {
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    box-shadow: 0 16px 36px rgba(15, 23, 42, 0.1), inset 0 0 0 1px rgba(255, 255, 255, 0.5);
    border: 1px solid rgba(14, 165, 233, 0.2);
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.78), rgba(236, 254, 255, 0.62));
  }

  [data-theme='prism-desk'] .bg-zinc-800 {
    background: linear-gradient(120deg, hsl(190, 86%, 42%), hsl(319, 72%, 62%));
    color: white;
  }

  [data-theme='prism-desk'] a {
    color: hsl(190, 86%, 36%) !important;
    text-decoration-color: hsla(319, 72%, 62%, 0.45) !important;
  }

  /* Sakura Theme */
  [data-theme='sakura'] {
    --primary: 330 100% 70%;
    /* Soft Pink */
    --primary-foreground: 330 100% 20%;

    --accent: 330 100% 85%;
    /* Pale Pink */
    --accent-foreground: 330 100% 20%;

    --ring: 330 100% 70%;

    --foreground: 330 40% 30%;
    /* Dark Purple-Pink text */
    --card-foreground: 330 40% 30%;
    --popover-foreground: 330 40% 30%;
    --muted-foreground: 330 20% 60%;

    --background: 330 30% 98%;
    /* Near White Pink */
    --card: 330 40% 99% / 0.8;
    --popover: 330 40% 99% / 0.9;

    --border: 330 30% 90%;
    --radius: 1rem;

    --muted: 330 30% 95%;
    /* Light Pink for bot bubbles */

    --bg-image: url("data:image/svg+xml,%3Csvg width='50' height='50' viewBox='0 0 50 50' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23fbcfe8' fill-opacity='0.4' fill-rule='evenodd'%3E%3Cpath d='M25 25c-5 0-8-5-8-10s5-5 10-5 8 5 8 10-5 5-10 5z'/%3E%3C/g%3E%3C/svg%3E"), linear-gradient(135deg, #fff1f2 0%, #fce7f3 100%);
  }

  [data-theme='sunset-mirage'] {
    --primary: 18 92% 58%;
    --primary-foreground: 0 0% 100%;

    --accent: 334 90% 62%;
    --accent-foreground: 0 0% 100%;

    --ring: 18 92% 58%;

    --foreground: 320 28% 16%;
    --card-foreground: 320 28% 16%;
    --popover-foreground: 320 28% 16%;
    --muted-foreground: 325 16% 38%;

    --background: 18 100% 98%;
    --card: 0 0% 100% / 0.74;
    --popover: 0 0% 100% / 0.86;

    --border: 334 80% 86%;
    --radius: 1rem;
    --muted: 24 100% 95%;

    --bg-image: radial-gradient(circle at 15% 18%, rgba(255, 208, 146, 0.85) 0%, rgba(255, 208, 146, 0) 40%),
      radial-gradient(circle at 82% 12%, rgba(253, 164, 175, 0.8) 0%, rgba(253, 164, 175, 0) 38%),
      linear-gradient(145deg, #fff7ed 0%, #ffe4e6 42%, #fdf2f8 100%);
  }

  [data-theme='emerald-depths'] {
    --primary: 158 72% 42%;
    --primary-foreground: 0 0% 100%;

    --accent: 188 85% 44%;
    --accent-foreground: 0 0% 100%;

    --ring: 158 72% 42%;

    --foreground: 170 38% 92%;
    --card-foreground: 170 38% 92%;
    --popover-foreground: 170 38% 92%;
    --muted-foreground: 170 20% 68%;

    --background: 180 30% 10%;
    --card: 176 34% 14% / 0.7;
    --popover: 176 34% 12% / 0.88;

    --border: 168 45% 34%;
    --radius: 0.85rem;
    --muted: 174 26% 20%;

    --bg-image: radial-gradient(circle at 18% 16%, rgba(16, 185, 129, 0.24) 0%, rgba(16, 185, 129, 0) 36%),
      radial-gradient(circle at 82% 72%, rgba(6, 182, 212, 0.2) 0%, rgba(6, 182, 212, 0) 35%),
      linear-gradient(170deg, #0b1f1c 0%, #08322e 48%, #062a34 100%);
  }

  [data-theme='sakura'] .bg-card,
  [data-theme='sakura'] .bg-popover,
  [data-theme='sakura'] aside {
    backdrop-filter: blur(8px);
    box-shadow: 0 4px 20px rgba(251, 207, 232, 0.4), inset 0 0 40px rgba(255, 255, 255, 0.5);
    border: 1px solid rgba(251, 207, 232, 0.6);
    background: rgba(255, 255, 255, 0.7);
  }

  [data-theme='sunset-mirage'] .bg-card,
  [data-theme='sunset-mirage'] .bg-popover,
  [data-theme='sunset-mirage'] aside {
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 10px 28px rgba(251, 113, 133, 0.2), inset 0 0 0 1px rgba(255, 255, 255, 0.3);
    border: 1px solid rgba(251, 113, 133, 0.25);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.72), rgba(255, 255, 255, 0.62));
  }

  [data-theme='sunset-mirage'] .bg-zinc-800 {
    background: linear-gradient(120deg, hsl(18, 92%, 58%), hsl(334, 90%, 62%));
    color: white;
  }

  [data-theme='emerald-depths'] .bg-card,
  [data-theme='emerald-depths'] .bg-popover,
  [data-theme='emerald-depths'] aside {
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow: 0 12px 30px rgba(3, 13, 12, 0.45), inset 0 0 0 1px rgba(45, 212, 191, 0.14);
    border: 1px solid rgba(45, 212, 191, 0.16);
    background: linear-gradient(145deg, rgba(15, 42, 39, 0.76), rgba(8, 32, 30, 0.82));
  }

  [data-theme='emerald-depths'] .bg-zinc-800 {
    background: linear-gradient(120deg, hsl(158, 72%, 42%), hsl(188, 85%, 44%));
    color: white;
  }

  /* Emerald Depths — make links pop against the dark green background */
  [data-theme='emerald-depths'] a {
    color: hsl(188, 90%, 62%) !important;
    text-decoration-color: hsla(188, 90%, 62%, 0.5) !important;
  }
  [data-theme='emerald-depths'] a:hover {
    color: hsl(188, 95%, 72%) !important;
    text-decoration-color: hsl(188, 95%, 72%) !important;
  }

  /* Override User Bubble for Sakura to match theme */
  [data-theme='sakura'] .bg-zinc-800 {
    background-color: hsl(330, 80%, 60%);
    color: white;
  }

  /* Override hardcoded dark elements for Sakura theme readability */
  [data-theme='sakura'] .bg-zinc-950\/50,
  [data-theme='sakura'] .bg-black\/20 {
    background-color: hsla(330, 30%, 90%, 0.5);
    border-color: hsla(330, 100%, 70%, 0.2);
  }

  [data-theme='sakura'] .text-slate-300,
  [data-theme='sakura'] .text-zinc-400,
  [data-theme='sakura'] .text-zinc-500 {
    color: hsl(330, 40%, 30%);
  }

  [data-theme='autumn-harvest'] .bg-card,
  [data-theme='autumn-harvest'] .bg-popover,
  [data-theme='autumn-harvest'] aside {
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 8px 24px rgba(15, 10, 4, 0.5), inset 0 0 0 1px rgba(245, 158, 11, 0.08);
    border: 1px solid rgba(245, 158, 11, 0.1);
  }

  [data-theme='arctic-aurora'] .bg-card,
  [data-theme='arctic-aurora'] .bg-popover,
  [data-theme='arctic-aurora'] aside {
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow: 0 8px 24px rgba(5, 13, 20, 0.5), inset 0 0 0 1px rgba(45, 212, 191, 0.08);
    border: 1px solid rgba(45, 212, 191, 0.1);
  }

  /* Custom Theme Glassmorphism */
  [data-custom-theme='true'] .bg-card,
  [data-custom-theme='true'] .bg-popover,
  [data-custom-theme='true'] aside {
    backdrop-filter: blur(8px);
    background: rgba(var(--card), 0.8);
    /* Fallback */
  }

  /* ═══════════════════════════════════════════════════════════════════════
     FULL OS THEMES — UI Overrides
     ═══════════════════════════════════════════════════════════════════════ */

  /* ─── WINDOWS 7 AERO ─────────────────────────────────────────────────── */

  [data-theme='windows-7'] * {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  }

  [data-theme='windows-7'] .bg-card,
  [data-theme='windows-7'] .bg-popover,
  [data-theme='windows-7'] aside {
    backdrop-filter: blur(20px) saturate(1.6);
    -webkit-backdrop-filter: blur(20px) saturate(1.6);
    background: linear-gradient(180deg,
        rgba(220, 235, 255, 0.88) 0%,
        rgba(205, 225, 250, 0.82) 40%,
        rgba(195, 218, 248, 0.85) 100%);
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.9),
      inset 0 0 0 1px rgba(255, 255, 255, 0.25),
      inset 0 -1px 0 rgba(0, 0, 0, 0.06),
      0 6px 24px rgba(0, 20, 60, 0.35),
      0 0 0 1px rgba(120, 170, 230, 0.4);
    border: 1px solid rgba(255, 255, 255, 0.6);
    color: #1a1a1a;
  }

  /* Win7 glass reflection bar at top of cards */
  [data-theme='windows-7'] .bg-card::before,
  [data-theme='windows-7'] .bg-popover::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 40%;
    background: linear-gradient(180deg,
        rgba(255, 255, 255, 0.35) 0%,
        rgba(255, 255, 255, 0.08) 100%);
    pointer-events: none;
    border-radius: inherit;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
  }

  /* Cards need position:relative for the ::before */
  [data-theme='windows-7'] .bg-card,
  [data-theme='windows-7'] .bg-popover {
    position: relative;
    overflow: hidden;
  }

  /* Win7 sidebar — translucent blue glass */
  [data-theme='windows-7'] aside {
    background: linear-gradient(180deg,
        rgba(130, 175, 235, 0.72) 0%,
        rgba(90, 145, 215, 0.60) 50%,
        rgba(70, 125, 200, 0.65) 100%) !important;
    border-right: 1px solid rgba(255, 255, 255, 0.3) !important;
  }

  /* Make ALL text inside cards near-black for readability */
  [data-theme='windows-7'] .bg-card *,
  [data-theme='windows-7'] .bg-popover * {
    color: #111 !important;
  }

  /* Muted/description text: strong dark gray */
  [data-theme='windows-7'] .bg-card .text-muted-foreground,
  [data-theme='windows-7'] .bg-popover .text-muted-foreground {
    color: #444 !important;
  }

 
  [data-theme='windows-7'] .font-mono.bg-\[\#111111\] *,
  [data-theme='windows-7'] .font-mono.bg-\[\#111111\] {
    color: unset !important;
  }
  [data-theme='windows-7'] .font-mono.bg-\[\#111111\] .text-zinc-200 { color: #e4e4e7 !important; }
  [data-theme='windows-7'] .font-mono.bg-\[\#111111\] .text-zinc-400 { color: #a1a1aa !important; }
  [data-theme='windows-7'] .font-mono.bg-\[\#111111\] .text-zinc-500 { color: #71717a !important; }
  [data-theme='windows-7'] .font-mono.bg-\[\#111111\] .text-muted-foreground { color: #a1a1aa !important; }
  [data-theme='windows-7'] .font-mono.bg-\[\#111111\] .text-blue-500 { color: #3b82f6 !important; }
  [data-theme='windows-7'] .font-mono.bg-\[\#111111\] .text-yellow-500 { color: #eab308 !important; }
  [data-theme='windows-7'] .font-mono.bg-\[\#111111\] .text-red-500 { color: #ef4444 !important; }

  /* Input placeholder text */
  [data-theme='windows-7'] .bg-card input::placeholder,
  [data-theme='windows-7'] .bg-popover input::placeholder,
  [data-theme='windows-7'] .bg-card textarea::placeholder,
  [data-theme='windows-7'] .bg-popover textarea::placeholder {
    color: #888 !important;
  }

  /* Sidebar text should stay white/light */
  [data-theme='windows-7'] aside * {
    color: white !important;
  }

  [data-theme='windows-7'] aside .text-muted-foreground {
    color: rgba(255, 255, 255, 0.7) !important;
  }

  /* Win7 buttons */
  [data-theme='windows-7'] button:not([class*="rounded-full"]) {
    border: 1px solid rgba(0, 0, 0, 0.2);
    background: linear-gradient(180deg, #f0f0f0 0%, #e1e1e1 45%, #cfcfcf 50%, #dcdcdc 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
    color: #222;
  }

  [data-theme='windows-7'] button[class*="bg-primary"] {
    background: linear-gradient(180deg,
        #4fade4 0%, #2b89d6 45%, #1a6ebe 50%, #2884d0 100%);
    border: 1px solid rgba(0, 40, 100, 0.5);
    color: white;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.35),
      0 1px 3px rgba(0, 30, 80, 0.25);
  }

  /* Win7 inputs */
  [data-theme='windows-7'] input,
  [data-theme='windows-7'] textarea,
  [data-theme='windows-7'] select {
    background: white !important;
    border: 1px solid #abadb3 !important;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.12) !important;
    color: #222 !important;
  }

  /* Win7 user bubble */
  [data-theme='windows-7'] .bg-zinc-800 {
    background: linear-gradient(180deg, #4fade4 0%, #1a6ebe 100%);
    color: white;
    border: 1px solid rgba(0, 40, 100, 0.3);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3);
  }

  /* Win7 scrollbar */
  [data-theme='windows-7'] ::-webkit-scrollbar {
    width: 14px;
  }

  [data-theme='windows-7'] ::-webkit-scrollbar-track {
    background: #d0dff0;
  }

  [data-theme='windows-7'] ::-webkit-scrollbar-thumb {
    background: linear-gradient(90deg, #c0cfe0 0%, #a8bdd4 50%, #c0cfe0 100%);
    border: 1px solid #8ea8c4;
    border-radius: 3px;
  }

  [data-theme='windows-7'] ::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(90deg, #a8bdd4 0%, #90abd0 50%, #a8bdd4 100%);
  }

  /* ─── WINDOWS 95 ─────────────────────────────────────────────────────── */

  [data-theme='windows-95'] * {
    font-family: 'MS Sans Serif', 'Microsoft Sans Serif', 'Segoe UI', Tahoma, sans-serif;
    text-shadow: none;
    border-radius: 0 !important;
  }

  [data-theme='windows-95'] .bg-card,
  [data-theme='windows-95'] .bg-popover {
    background: #c0c0c0;
    border: 2px outset #fff;
    box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #ffffff;
  }

  /* Win95 sidebar */
  [data-theme='windows-95'] aside {
    background: #c0c0c0 !important;
    border-right: 2px groove #888 !important;
    box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #ffffff;
  }

  /* Win95 buttons */
  [data-theme='windows-95'] button {
    background: #c0c0c0 !important;
    border: 2px outset #fff !important;
    box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #dfdfdf;
    color: black !important;
    text-shadow: none;
    padding: 2px 8px;
    font-size: 12px;
  }

  [data-theme='windows-95'] button:active {
    border-style: inset !important;
    box-shadow: inset 1px 1px 0 #808080, inset -1px -1px 0 #dfdfdf;
  }

  [data-theme='windows-95'] button[class*="bg-primary"] {
    background: #000080 !important;
    color: white !important;
    border: 2px outset #0000b0 !important;
  }

  /* Win95 inputs */
  [data-theme='windows-95'] input,
  [data-theme='windows-95'] textarea,
  [data-theme='windows-95'] select {
    background: white !important;
    border: 2px inset #808080 !important;
    box-shadow: inset 1px 1px 0 #404040, inset -1px -1px 0 #dfdfdf;
    color: black !important;
  }

  /* Win95 user bubble */
  [data-theme='windows-95'] .bg-zinc-800 {
    background: #000080;
    color: white;
    border: 2px outset #0000b0;
  }

  /* Win95 scrollbar */
  [data-theme='windows-95'] ::-webkit-scrollbar {
    width: 16px;
  }

  [data-theme='windows-95'] ::-webkit-scrollbar-track {
    background: repeating-conic-gradient(#c0c0c0 0% 25%, #a0a0a0 0% 50%) 50% / 2px 2px;
  }

  [data-theme='windows-95'] ::-webkit-scrollbar-thumb {
    background: #c0c0c0;
    border: 2px outset #fff;
    box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #dfdfdf;
  }

  [data-theme='windows-95'] ::-webkit-scrollbar-button {
    background: #c0c0c0;
    border: 2px outset #fff;
    display: block;
    height: 16px;
  }

  /* Win95: Let theme color swatches keep their actual colors */
  [data-theme='windows-95'] button.rounded-full {
    background: unset !important;
    border: 2px outset #fff !important;
    box-shadow: none;
  }

  /* Win95 title bar accent for cards */
  [data-theme='windows-95'] .flex.flex-col.space-y-1\.5.p-6::before,
  [data-theme='windows-95'] .p-5.pb-4::before {
    content: '';
    display: block;
    height: 18px;
    margin: -6px -6px 8px -6px;
    background: linear-gradient(90deg, #000080 0%, #1084d0 100%);
  }

  /* ─── EVANGELION / NERV HUD ──────────────────────────────────────────── */

  [data-theme='evangelion'] * {
    font-family: 'Consolas', 'Courier New', 'Fira Mono', monospace;
  }

  /* Scanline overlay on body */
  [data-theme='evangelion'] body::after {
    content: '';
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 9999;
    background: repeating-linear-gradient(0deg,
        transparent,
        transparent 2px,
        rgba(0, 0, 0, 0.08) 2px,
        rgba(0, 0, 0, 0.08) 4px);
  }

  [data-theme='evangelion'] .bg-card,
  [data-theme='evangelion'] .bg-popover {
    background: rgba(10, 10, 24, 0.88);
    border: 1px solid rgba(255, 102, 0, 0.35);
    box-shadow:
      inset 0 0 20px rgba(255, 102, 0, 0.06),
      0 0 12px rgba(255, 102, 0, 0.1),
      0 4px 20px rgba(0, 0, 0, 0.5);
  }

  /* NERV warning stripes on card headers */
  [data-theme='evangelion'] .bg-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: repeating-linear-gradient(90deg,
        #ff6600 0px,
        #ff6600 8px,
        transparent 8px,
        transparent 12px);
    z-index: 1;
  }

  [data-theme='evangelion'] .bg-card {
    position: relative;
    overflow: hidden;
  }

  /* Sidebar — NERV dark panel */
  [data-theme='evangelion'] aside {
    background: rgba(8, 6, 18, 0.95) !important;
    border-right: 1px solid rgba(255, 102, 0, 0.3) !important;
    box-shadow: inset -8px 0 20px rgba(255, 102, 0, 0.04);
  }

  /* Buttons — orange HUD style */
  [data-theme='evangelion'] button:not([class*="rounded-full"]) {
    border: 1px solid rgba(255, 102, 0, 0.4);
    background: rgba(255, 102, 0, 0.08);
    color: #ff8833;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 11px;
    font-weight: 700;
  }

  [data-theme='evangelion'] button:not([class*="rounded-full"]):hover {
    background: rgba(255, 102, 0, 0.18);
    box-shadow: 0 0 8px rgba(255, 102, 0, 0.25);
  }

  [data-theme='evangelion'] button[class*="bg-primary"] {
    background: rgba(255, 102, 0, 0.85) !important;
    border: 1px solid rgba(255, 102, 0, 0.9);
    color: white !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
    box-shadow: 0 0 12px rgba(255, 102, 0, 0.35);
  }

  /* Inputs — dark inset with orange focus */
  [data-theme='evangelion'] input,
  [data-theme='evangelion'] textarea,
  [data-theme='evangelion'] select {
    background: rgba(5, 5, 15, 0.8) !important;
    border: 1px solid rgba(255, 102, 0, 0.25) !important;
    color: #ffaa66 !important;
    font-family: 'Consolas', monospace;
  }

  [data-theme='evangelion'] input:focus,
  [data-theme='evangelion'] textarea:focus {
    border-color: rgba(255, 102, 0, 0.6) !important;
    box-shadow: 0 0 8px rgba(255, 102, 0, 0.2) !important;
  }

  /* User bubble — EVA-01 purple */
  [data-theme='evangelion'] .bg-zinc-800 {
    background: linear-gradient(135deg, rgba(100, 0, 180, 0.8), rgba(60, 0, 120, 0.9));
    color: #e8c0ff;
    border: 1px solid rgba(150, 50, 255, 0.4);
    box-shadow: 0 0 10px rgba(100, 0, 180, 0.3);
  }

  /* Scrollbar — NERV orange */
  [data-theme='evangelion'] ::-webkit-scrollbar {
    width: 6px;
  }

  [data-theme='evangelion'] ::-webkit-scrollbar-track {
    background: rgba(10, 10, 20, 0.5);
  }

  [data-theme='evangelion'] ::-webkit-scrollbar-thumb {
    background: rgba(255, 102, 0, 0.4);
    border-radius: 0;
  }

  [data-theme='evangelion'] ::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 102, 0, 0.65);
  }

  /* ─── GHIBLI GARDEN ──────────────────────────────────────────────────── */

  [data-theme='ghibli-garden'] * {
    font-family: 'Georgia', 'Palatino Linotype', 'Book Antiqua', serif;
  }

  [data-theme='ghibli-garden'] .bg-card,
  [data-theme='ghibli-garden'] .bg-popover {
    background: #fefcf7;
    border: 1px solid rgba(90, 120, 70, 0.18);
    box-shadow:
      0 2px 12px rgba(120, 100, 60, 0.1),
      0 6px 24px rgba(120, 100, 60, 0.06),
      inset 0 0 40px rgba(200, 180, 140, 0.08);
    border-radius: 1rem;
  }

  /* Sidebar — warm wood panel */
  [data-theme='ghibli-garden'] aside {
    background: linear-gradient(180deg, #f5efe4 0%, #ede5d6 50%, #e8dece 100%) !important;
    border-right: 1px solid rgba(140, 120, 80, 0.2) !important;
    box-shadow: 2px 0 10px rgba(120, 100, 60, 0.08);
  }

  [data-theme='ghibli-garden'] aside * {
    color: hsl(30, 25%, 28%) !important;
  }

  [data-theme='ghibli-garden'] aside .text-muted-foreground {
    color: hsl(30, 15%, 50%) !important;
  }

  /* Buttons — soft sage green */
  [data-theme='ghibli-garden'] button:not([class*="rounded-full"]) {
    background: #f0ebe2;
    border: 1px solid rgba(120, 140, 90, 0.25);
    color: hsl(30, 25%, 28%);
    border-radius: 0.75rem;
    font-weight: 500;
  }

  [data-theme='ghibli-garden'] button:not([class*="rounded-full"]):hover {
    background: #e8e0d4;
    border-color: rgba(100, 130, 70, 0.4);
  }

  [data-theme='ghibli-garden'] button[class*="bg-primary"] {
    background: hsl(142, 40%, 42%) !important;
    border: 1px solid hsl(142, 40%, 35%);
    color: white !important;
    border-radius: 0.75rem;
    box-shadow: 0 2px 8px rgba(80, 120, 60, 0.2);
  }

  /* Inputs — cream with warm border */
  [data-theme='ghibli-garden'] input,
  [data-theme='ghibli-garden'] textarea,
  [data-theme='ghibli-garden'] select {
    background: #fffdf8 !important;
    border: 1px solid rgba(160, 140, 100, 0.3) !important;
    color: hsl(30, 25%, 22%) !important;
    border-radius: 0.75rem;
  }

  /* User bubble — sage green */
  [data-theme='ghibli-garden'] .bg-zinc-800 {
    background: hsl(142, 35%, 45%);
    color: white;
    border: 1px solid hsl(142, 35%, 38%);
    border-radius: 1rem;
    box-shadow: 0 2px 8px rgba(80, 120, 60, 0.15);
  }

  /* Scrollbar — warm organic */
  [data-theme='ghibli-garden'] ::-webkit-scrollbar {
    width: 8px;
  }

  [data-theme='ghibli-garden'] ::-webkit-scrollbar-track {
    background: #f5efe4;
  }

  [data-theme='ghibli-garden'] ::-webkit-scrollbar-thumb {
    background: rgba(160, 140, 100, 0.35);
    border-radius: 4px;
  }

  [data-theme='ghibli-garden'] ::-webkit-scrollbar-thumb:hover {
    background: rgba(140, 120, 80, 0.5);
  }

  /* Override dark elements for light theme readability */
  [data-theme='ghibli-garden'] .bg-zinc-950\/50,
  [data-theme='ghibli-garden'] .bg-black\/20 {
    background-color: rgba(200, 180, 140, 0.15);
    border-color: rgba(140, 120, 80, 0.15);
  }
}

@keyframes lime-avatar-pulse {
  0% {
    box-shadow: 0 0 0 0 hsl(var(--primary) / 0.35);
  }

  70% {
    box-shadow: 0 0 0 10px hsl(var(--primary) / 0);
  }

  100% {
    box-shadow: 0 0 0 0 hsl(var(--primary) / 0);
  }
}

.lime-avatar-pulse {
  border-radius: 999px;
  animation: lime-avatar-pulse 1.6s ease-out infinite;
}

.lime-activity-ribbon {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: hsl(var(--primary) / 0.08);
  border: 1px solid hsl(var(--primary) / 0.18);
  border-radius: 999px;
  padding: 4px 8px;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: rgba(148, 163, 184, 0.9);
}

.lime-activity-ribbon .lime-step {
  padding: 2px 6px;
  border-radius: 999px;
  background: transparent;
  transition: all 200ms ease;
}

.lime-activity-ribbon .lime-step.is-active {
  color: hsl(var(--primary-foreground));
  background: hsl(var(--primary) / 0.65);
  box-shadow: 0 0 8px hsl(var(--primary) / 0.5);
}

/* Chat grouping tweaks */
.chat-group-spacer {
  height: 6px;
}

/* Typing indicator — three-dot bounce */
@keyframes typing-dot {
  0%, 60%, 100% {
    transform: translateY(0);
    opacity: 0.4;
  }
  30% {
    transform: translateY(-5px);
    opacity: 1;
  }
}
