/* VantageBot Showcase — theme tokens + custom styles */

:root {
  --color-primary: #1e3a5f;
  --color-primary-light: #2a5080;
  --color-primary-dark: #152a45;
  --color-accent: #f59e0b;
  --color-accent-light: #fbbf24;
  --color-success: #10b981;
  --color-danger: #ef4444;
  --color-warning: #f59e0b;
  --color-info: #3b82f6;
  --color-sidebar: #0f172a;
  --color-sidebar-hover: #1e293b;
  --color-card: #ffffff;
  --color-bg: #f1f5f9;
  --color-border: #e2e8f0;
  --color-text: #1e293b;
  --color-text-muted: #64748b;
  --color-subtle: #f3f4f6;       /* chat bot bubble, badges */
  --color-subtle-2: #f9fafb;     /* table thead, hovered rows */
  --color-subtle-soft: rgba(241,245,249,0.5);
  --color-input-bg: #f9fafb;
  --color-link: #1e3a5f;         /* SKU codes, IDs, links — switches in dark */
  --color-brightshop-text: #1e3a5f;
  --color-amazon: #ff9900;
  --color-ebay: #e53238;
  --color-fnac: #e1a400;
  --color-allegro: #ff5a00;
  --color-idealo: #1a3b6b;
  --color-brightshop: #1e3a5f;
}

.dark {
  --color-card: #1e293b;
  --color-bg: #0f172a;
  --color-border: #334155;
  --color-text: #e2e8f0;
  --color-text-muted: #94a3b8;
  --color-sidebar: #020617;
  --color-sidebar-hover: #0f172a;
  --color-subtle: #334155;
  --color-subtle-2: #0f172a;
  --color-subtle-soft: rgba(15,23,42,0.6);
  --color-input-bg: #0f172a;
  --color-link: #93c5fd;         /* much brighter blue for readability on dark */
  --color-brightshop-text: #93c5fd;
}

/* The .text-brightshop class also drives the BrightShop card title */
.dark .text-brightshop,
.dark .text-promotoner { color: var(--color-brightshop-text); }

* { scrollbar-width: thin; scrollbar-color: #cbd5e1 transparent; }

body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  background-color: var(--color-bg);
  color: var(--color-text);
  margin: 0;
}

.dark body { background-color: #0f172a; color: #e2e8f0; }

/* Tailwind-style class shims (so we can use familiar utility names without a build step) */
.bg-primary { background-color: var(--color-primary); }
.bg-primary-light { background-color: var(--color-primary-light); }
.hover\:bg-primary-light:hover { background-color: var(--color-primary-light); }
.bg-primary\/5  { background-color: rgba(30, 58, 95, 0.05); }
.bg-primary\/10 { background-color: rgba(30, 58, 95, 0.10); }
.bg-primary\/15 { background-color: rgba(30, 58, 95, 0.15); }
.text-primary { color: var(--color-primary); }
.border-primary { border-color: var(--color-primary); }

.bg-accent { background-color: var(--color-accent); }
.bg-accent\/5 { background-color: rgba(245, 158, 11, 0.05); }
.bg-accent\/10 { background-color: rgba(245, 158, 11, 0.10); }
.bg-accent\/15 { background-color: rgba(245, 158, 11, 0.15); }
.text-accent { color: var(--color-accent); }
.text-accent-light { color: var(--color-accent-light); }
.ring-accent\/50 { --tw-ring-color: rgba(245, 158, 11, 0.5); }

.bg-success { background-color: var(--color-success); }
.bg-success\/5 { background-color: rgba(16, 185, 129, 0.05); }
.bg-success\/10 { background-color: rgba(16, 185, 129, 0.10); }
.bg-success\/15 { background-color: rgba(16, 185, 129, 0.15); }
.text-success { color: var(--color-success); }
.border-success { border-color: var(--color-success); }

.bg-danger { background-color: var(--color-danger); }
.bg-danger\/5 { background-color: rgba(239, 68, 68, 0.05); }
.bg-danger\/10 { background-color: rgba(239, 68, 68, 0.10); }
.bg-danger\/15 { background-color: rgba(239, 68, 68, 0.15); }
.bg-danger\/20 { background-color: rgba(239, 68, 68, 0.20); }
.text-danger { color: var(--color-danger); }
.border-danger { border-color: var(--color-danger); }
.border-l-danger { border-left-color: var(--color-danger); }

.bg-warning { background-color: var(--color-warning); }
.bg-warning\/5 { background-color: rgba(245, 158, 11, 0.05); }
.bg-warning\/10 { background-color: rgba(245, 158, 11, 0.10); }
.bg-warning\/15 { background-color: rgba(245, 158, 11, 0.15); }
.text-warning { color: var(--color-warning); }

.bg-info { background-color: var(--color-info); }
.bg-info\/5 { background-color: rgba(59, 130, 246, 0.05); }
.bg-info\/10 { background-color: rgba(59, 130, 246, 0.10); }
.bg-info\/15 { background-color: rgba(59, 130, 246, 0.15); }
.bg-info\/20 { background-color: rgba(59, 130, 246, 0.20); }
.text-info { color: var(--color-info); }
.border-info { border-color: var(--color-info); }
.border-l-info { border-left-color: var(--color-info); }

.bg-sidebar { background-color: var(--color-sidebar); }
.bg-sidebar-hover { background-color: var(--color-sidebar-hover); }
.hover\:bg-sidebar-hover:hover { background-color: var(--color-sidebar-hover); }
.text-sidebar { color: var(--color-sidebar); }
.border-t-sidebar { border-top-color: var(--color-sidebar); }

.bg-card { background-color: var(--color-card); }
.bg-bg { background-color: var(--color-bg); }
.text-text { color: var(--color-text); }
.text-text-muted { color: var(--color-text-muted); }
.border-border { border-color: var(--color-border); }
.divide-border > * + * { border-color: var(--color-border); }

.text-amazon     { color: var(--color-amazon); }
.text-ebay       { color: var(--color-ebay); }
.text-fnac       { color: var(--color-fnac); }
.text-allegro    { color: var(--color-allegro); }
.text-idealo     { color: var(--color-idealo); }
.text-brightshop { color: var(--color-brightshop); }
.bg-amazon\/15     { background-color: rgba(255, 153, 0, 0.15); }
.bg-ebay\/15       { background-color: rgba(229, 50, 56, 0.15); }
.bg-fnac\/15       { background-color: rgba(225, 164, 0, 0.15); }
.bg-allegro\/15    { background-color: rgba(255, 90, 0, 0.15); }
.bg-idealo\/15     { background-color: rgba(26, 59, 107, 0.15); }
.bg-brightshop\/15 { background-color: rgba(30, 58, 95, 0.15); }

.border-l-brightshop { border-left-color: var(--color-brightshop); }
.text-brightshop { color: var(--color-brightshop); }

/* Dark mode overrides for Tailwind utilities */
.dark .bg-card     { background-color: #1e293b; }
.dark .bg-bg       { background-color: #0f172a; }
.dark .bg-gray-50  { background-color: #1e293b !important; }
.dark .bg-gray-100 { background-color: #334155 !important; }
.dark .bg-white    { background-color: #1e293b !important; }
.dark .border-border { border-color: #334155; }
.dark .text-text { color: #e2e8f0; }
.dark .text-text-muted { color: #94a3b8; }
.dark .hover\:bg-gray-50:hover  { background-color: #334155 !important; }
.dark .hover\:bg-gray-100:hover { background-color: #475569 !important; }
.dark .divide-border > * + * { border-color: #334155; }
.dark .bg-gray-50\/50 { background-color: rgba(30, 41, 59, 0.5) !important; }
.dark .bg-purple-50  { background-color: rgba(124, 58, 237, 0.10) !important; }
.dark .bg-orange-50  { background-color: rgba(249, 115, 22, 0.10) !important; }
.dark .bg-purple-100 { background-color: rgba(124, 58, 237, 0.18) !important; }
.dark .text-purple-500 { color: #a78bfa; }
.dark .text-purple-600 { color: #a78bfa; }
.dark .text-orange-500 { color: #fb923c; }

/* Animations */
@keyframes slideIn { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: translateY(0); } }
@keyframes pulseDot { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes bounce { 0%, 80%, 100% { transform: translateY(0); } 40% { transform: translateY(-4px); } }

.animate-slide-in { animation: slideIn 0.3s ease-out; }
.animate-pulse-dot { animation: pulseDot 2s ease-in-out infinite; }
.animate-spin { animation: spin 0.8s linear infinite; }
.animate-bounce-1 { animation: bounce 1.2s infinite ease-in-out; animation-delay: 0ms; }
.animate-bounce-2 { animation: bounce 1.2s infinite ease-in-out; animation-delay: 150ms; }
.animate-bounce-3 { animation: bounce 1.2s infinite ease-in-out; animation-delay: 300ms; }

/* Donut chart center label container */
.donut-wrap { position: relative; }
.donut-center {
  position: absolute; inset: 0; display: flex; flex-direction: column;
  align-items: center; justify-content: center; pointer-events: none;
}

/* Mini progress bar */
.bar-track { height: 4px; background: #f1f5f9; border-radius: 999px; overflow: hidden; }
.bar-fill  { height: 100%; border-radius: 999px; transition: width 0.4s ease; }
.dark .bar-track { background: #334155; }

/* Generic transitions */
.transition-colors { transition: background-color 0.15s, color 0.15s, border-color 0.15s; }
.transition-all    { transition: all 0.2s; }
.transition-opacity{ transition: opacity 0.2s; }
.transition-transform { transition: transform 0.2s; }

/* Sidebar slide */
@media (max-width: 1023px) {
  aside.sidebar.closed { transform: translateX(-100%); }
}

/* Hide chart legend default (Chart.js) — we render our own */
.chartjs-legend { display: none; }