/* ============================================================
   Dekuple Insight — Colours
   From the Dekuple Insight brand palette (a Dekuple Group solution).
   Core: Black, Violet, Insight yellow, two brand greys, White.
   Signature accent is Insight yellow #FFD700.
   ============================================================ */
:root {
  /* --- Core brand palette --- */
  --dk-black:        #000000;   /* Black */
  --dk-violet:       #462880;   /* Violet */
  --dk-yellow:       #FFD700;   /* Dekuple Insight — signature accent / monogram */
  --dk-grey-light:   #DFE1E6;   /* Grey Light & Blue */
  --dk-grey-mid:     #BCC1C9;   /* Grey Mid & Blue */
  --dk-white:        #FFFFFF;   /* White */

  /* --- Violet tints/shades (derived for UI depth, harmonised in oklch) --- */
  --dk-violet-900:   #24143f;
  --dk-violet-700:   #341d5f;
  --dk-violet-600:   #462880;   /* = brand violet */
  --dk-violet-400:   #6b4bad;
  --dk-violet-200:   #b3a3d6;
  --dk-violet-50:    #ece7f5;

  /* --- Insight yellow tints/shades --- */
  --dk-yellow-700:   #7a6600;   /* deep yellow for text-on-white contrast */
  --dk-yellow-600:   #a58a00;   /* darker yellow for accents on white */
  --dk-yellow-500:   #FFD700;   /* = brand yellow */
  --dk-yellow-200:   #ffe97a;
  --dk-yellow-50:    #fffae0;

  /* --- Legacy aliases: the accent slot was cyan then green; keep both
         name families resolving to Insight yellow so older references
         (--dk-cyan*, --dk-green*) keep working unchanged. --- */
  --dk-green:        var(--dk-yellow);
  --dk-green-700:    var(--dk-yellow-700);
  --dk-green-600:    var(--dk-yellow-600);
  --dk-green-500:    var(--dk-yellow-500);
  --dk-green-200:    var(--dk-yellow-200);
  --dk-green-50:     var(--dk-yellow-50);
  --dk-cyan:         var(--dk-yellow);
  --dk-cyan-600:     var(--dk-yellow-600);
  --dk-cyan-500:     var(--dk-yellow-500);
  --dk-cyan-200:     var(--dk-yellow-200);
  --dk-cyan-50:      var(--dk-yellow-50);

  /* --- Neutral grey ramp (built around the two brand greys) --- */
  --dk-grey-950:     #0a0b0d;
  --dk-grey-800:     #2b2f36;
  --dk-grey-600:     #5a616b;
  --dk-grey-400:     #8b929c;
  --dk-grey-300:     #BCC1C9;   /* = grey mid */
  --dk-grey-200:     #DFE1E6;   /* = grey light */
  --dk-grey-100:     #eef0f3;
  --dk-grey-50:      #f7f8fa;

  /* --- Sibling solution accents (Dekuple Boost Factory) --- */
  --bf-okube:        #009699;
  --bf-reech:        #5E52FF;   /* Reech SocialVox */
  --bf-coupdepoing:  #F18E00;   /* Coup de Poing */
  --bf-loyalty:      #FF329A;   /* Loyalty & Subscription */
  --bf-storeflow:    #FF6400;   /* Store Flow */
  --bf-rocketlinks:  #4266F0;
  --bf-insight:      #FFD700;   /* Dekuple Insight */
  --bf-platform:     #BAE500;   /* Boost Platform */

  /* ============================================================
     Semantic aliases — light surface (default)
     ============================================================ */
  --color-bg:            var(--dk-white);
  --color-surface:       var(--dk-white);
  --color-surface-2:     var(--dk-grey-50);
  --color-surface-3:     var(--dk-grey-100);
  --color-border:        var(--dk-grey-200);
  --color-border-strong: var(--dk-grey-300);

  --color-text:          var(--dk-black);
  --color-text-muted:    var(--dk-grey-600);
  --color-text-subtle:   var(--dk-grey-400);
  --color-text-invert:   var(--dk-white);

  --color-primary:       var(--dk-violet);
  --color-primary-hover: var(--dk-violet-700);
  --color-primary-press: var(--dk-violet-900);
  --color-on-primary:    var(--dk-white);

  --color-accent:        var(--dk-yellow);
  --color-accent-strong: var(--dk-yellow-600);
  --color-on-accent:     var(--dk-black);

  --color-focus-ring:    var(--dk-yellow-600);

  /* Status — derived from the sanctioned palette + solution accents */
  --color-success:       var(--bf-okube);
  --color-warning:       var(--bf-coupdepoing);
  --color-danger:        var(--bf-loyalty);
  --color-info:          var(--dk-violet);

  /* ============================================================
     Signature gradients (Dekuple Insight · Graphic Territory)
     Dark: black → violet → yellow.  Clear: white → yellow → violet.
     ============================================================ */
  --gradient-dark:  radial-gradient(120% 120% at 100% 100%, var(--dk-yellow) 0%, var(--dk-violet) 34%, var(--dk-black) 68%);
  --gradient-clear: radial-gradient(120% 120% at 100% 100%, var(--dk-violet) 0%, var(--dk-yellow) 30%, var(--dk-white) 62%);
  --gradient-line:  linear-gradient(90deg, var(--dk-violet) 0%, var(--dk-yellow) 100%);
}

/* ============================================================
   Dark surface scope — apply .dk-dark on any container
   (or set data-theme="dark") for the brand's black canvas.
   ============================================================ */
.dk-dark,
[data-theme="dark"] {
  --color-bg:            var(--dk-black);
  --color-surface:       #0d0e11;
  --color-surface-2:     #15171c;
  --color-surface-3:     #1e2128;
  --color-border:        #2b2f36;
  --color-border-strong: #3a3f48;

  --color-text:          var(--dk-white);
  --color-text-muted:    var(--dk-grey-300);
  --color-text-subtle:   var(--dk-grey-400);
  --color-text-invert:   var(--dk-black);

  --color-primary:       var(--dk-yellow);
  --color-primary-hover: var(--dk-yellow-200);
  --color-primary-press: var(--dk-yellow-600);
  --color-on-primary:    var(--dk-black);

  --color-accent:        var(--dk-yellow);
  --color-accent-strong: var(--dk-yellow-200);
  --color-on-accent:     var(--dk-black);
}