/**
 * Badilk Brand Color Palette v1.0
 * Source of truth shared across Content Planner, Badilk Go, and marketing assets.
 */

:root {
  /* ── Primary ── */
  --badilk-blue: #0057FF;
  --badilk-blue-deep: #0039B8;
  --badilk-blue-dark: #00257A;
  --badilk-blue-hover: #1A68FF;
  --badilk-blue-mid: #0040CC;
  --badilk-blue-soft-light: #E8F0FF;
  --badilk-blue-mid-light: #B8D0FF;
  --badilk-blue-tint: #8BB6FF;

  /* ── Semantic ── */
  --badilk-green: #22C55E;
  --badilk-green-light: #16A34A;
  --badilk-amber: #F59E0B;
  --badilk-amber-light: #D97706;
  --badilk-red: #EF4444;
  --badilk-red-light: #DC2626;
  --badilk-purple: #8B5CF6;
  --badilk-purple-tint: #C4B5FD;
  --badilk-pink: #EC4899;
  --badilk-pink-alt: #DD2A7B;
  --badilk-pink-tint: #F9A8D4;
  --badilk-cyan: #0EA5E9;
  --badilk-facebook: #1877F2;
  --badilk-facebook-tint: #5B9EFF;

  /* ── Alpha overlays ── */
  --badilk-blue-soft: rgba(0, 87, 255, 0.11);
  --badilk-blue-border: rgba(0, 87, 255, 0.28);
  --badilk-selection: rgba(0, 87, 255, 0.28);

  /* ── Light theme (default for print & landing) ── */
  --badilk-bg: #F3F5FA;
  --badilk-s1: #FFFFFF;
  --badilk-s2: #F0F3F9;
  --badilk-s3: #E3E8F2;
  --badilk-paper-2: #F5F8FF;
  --badilk-ink: #0F1222;
  --badilk-text-2: #45506B;
  --badilk-text-3: #8A93AB;
  --badilk-border: rgba(15, 23, 42, 0.09);
  --badilk-border-2: rgba(15, 23, 42, 0.16);
  --badilk-blue-soft: rgba(0, 87, 255, 0.08);
  --badilk-blue-border: rgba(0, 87, 255, 0.22);
  --badilk-green-soft: rgba(22, 163, 74, 0.12);
  --badilk-red-soft: rgba(220, 38, 38, 0.1);
  --badilk-shadow: 0 18px 50px rgba(15, 23, 42, 0.08);
}

[data-theme="dark"] {
  --badilk-bg: #07070F;
  --badilk-s1: #0F0F1C;
  --badilk-s2: #151525;
  --badilk-s3: #1C1C30;
  --badilk-ink: #FFFFFF;
  --badilk-text-2: #A0A0BE;
  --badilk-text-3: #52526A;
  --badilk-border: rgba(255, 255, 255, 0.07);
  --badilk-border-2: rgba(255, 255, 255, 0.14);
  --badilk-blue-soft: rgba(0, 87, 255, 0.16);
  --badilk-blue-border: rgba(0, 87, 255, 0.38);
  --badilk-green: #22C55E;
  --badilk-green-soft: rgba(34, 197, 94, 0.14);
  --badilk-red: #EF4444;
  --badilk-red-soft: rgba(239, 68, 68, 0.14);
  --badilk-amber: #F59E0B;
  --badilk-shadow: 0 22px 60px rgba(0, 0, 0, 0.35);
}

/* ── Gradients ── */
.badilk-gradient-primary {
  background: linear-gradient(160deg, #0057FF 0%, #0039B8 100%);
}

.badilk-gradient-hero {
  background: linear-gradient(145deg, #0057FF 0%, #0039B8 55%, #00257A 100%);
}

.badilk-gradient-badge {
  background: linear-gradient(135deg, #0057FF, #0040CC);
}

.badilk-gradient-progress {
  background: linear-gradient(90deg, #0057FF, #22C55E);
}

.badilk-gradient-rainbow {
  background: linear-gradient(90deg, #F59E0B 0%, #22C55E 40%, #0057FF 100%);
}