/*
 * DataSense v1 visual identity
 * Centralized violet system loaded after all shared and page-specific styles.
 * Semantic success, warning, and danger colors intentionally remain unchanged.
 */
:root {
  --datasense-brand-950: #1f0a3d;
  --datasense-brand-900: #2e1065;
  --datasense-brand-800: #4c1d95;
  --datasense-brand-700: #6d28d9;
  --datasense-brand-600: #7c3aed;
  --datasense-brand-500: #8b5cf6;
  --datasense-brand-400: #a78bfa;
  --datasense-brand-300: #c4b5fd;
  --datasense-brand-200: #ddd6fe;
  --datasense-brand-100: #ede9fe;
  --datasense-brand-50: #f5f3ff;

  /* Re-map the legacy design tokens to the DataSense identity. */
  --navy-950: var(--datasense-brand-950);
  --navy-900: var(--datasense-brand-900);
  --navy-800: var(--datasense-brand-800);
  --blue-600: var(--datasense-brand-700);
  --teal-600: var(--datasense-brand-600);
  --teal-500: var(--datasense-brand-500);
  --sky-100: var(--datasense-brand-100);
  --surface-soft: #faf9ff;
  --border: #e5def3;
  --text: #241b2f;
  --muted: #6f657d;
  --shadow: 0 18px 45px rgba(76, 29, 149, 0.11);

  /* Dashboard-specific legacy aliases. */
  --bg: #faf9ff;
  --surface-muted: #f7f5ff;
  --navy: var(--datasense-brand-900);
  --navy-soft: var(--datasense-brand-800);
  --primary: var(--datasense-brand-600);
  --primary-soft: var(--datasense-brand-100);
  --teal: var(--datasense-brand-500);
}

::selection {
  background: var(--datasense-brand-200);
  color: var(--datasense-brand-950);
}

body,
.dashboard-main {
  background: var(--surface-soft);
  color: var(--text);
}

.public-nav,
.mobile-app-bar {
  border-color: var(--datasense-brand-200);
  box-shadow: 0 8px 28px rgba(76, 29, 149, 0.06);
}

.brand-link {
  color: var(--datasense-brand-900);
}

.brand-link span,
.auth-brand span {
  color: var(--datasense-brand-500);
}

.sidebar-brand strong,
.public-footer strong {
  background: linear-gradient(
    100deg,
    #ffffff 0%,
    #ffffff 30%,
    var(--datasense-brand-300) 62%,
    var(--datasense-brand-400) 100%
  );
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.app-sidebar,
.sidebar,
.auth-story,
.public-footer {
  background: linear-gradient(
    165deg,
    var(--datasense-brand-950) 0%,
    var(--datasense-brand-900) 52%,
    var(--datasense-brand-800) 100%
  );
}

.sidebar-brand span,
.sidebar-footer,
.brand p,
.public-footer {
  color: var(--datasense-brand-200);
}

.sidebar-nav a,
.sidebar-link-button,
.nav-link {
  color: #ded7ef;
}

.sidebar-nav a:hover,
.sidebar-nav a.active,
.sidebar-link-button:hover,
.sidebar-link-button:focus-visible,
.nav-link:hover,
.nav-link.active {
  background: rgba(196, 181, 253, 0.17);
  color: #ffffff;
}

.primary-button,
.chatbot-launcher,
.chatbot-send {
  border-color: transparent;
  background: linear-gradient(
    135deg,
    var(--datasense-brand-700),
    var(--datasense-brand-500)
  );
  color: #ffffff;
  box-shadow: 0 12px 28px rgba(124, 58, 237, 0.28);
}

.primary-button:hover,
.primary-button:focus-visible,
.chatbot-launcher:hover,
.chatbot-launcher:focus-visible,
.chatbot-send:hover,
.chatbot-send:focus-visible {
  transform: translateY(-1px);
  box-shadow: 0 16px 34px rgba(124, 58, 237, 0.34);
}

.secondary-button {
  border-color: var(--datasense-brand-200);
  background: #ffffff;
  color: var(--datasense-brand-800);
}

.secondary-button:hover,
.secondary-button:focus-visible {
  border-color: var(--datasense-brand-400);
  background: var(--datasense-brand-50);
}

.text-button,
.auth-footer a,
.chart-data-details summary,
.saved-analysis-button,
.public-links a:hover {
  color: var(--datasense-brand-700);
}

.page-header h1,
.page-header h2,
.section-heading h2,
.section-heading h3,
.feature-card h3,
.guide-card h3,
.guide-card h4,
.form-group label,
.filter-field label,
.auth-form-panel h2 {
  color: var(--datasense-brand-900);
}

.eyebrow,
.auth-eyebrow {
  color: var(--datasense-brand-600);
}

.panel,
.feature-card,
.auth-shell,
.chatbot-panel,
.upload-card,
.chart-data-summary {
  border-color: var(--datasense-brand-200);
  box-shadow: var(--shadow);
}

.guide-card {
  border-color: var(--datasense-brand-200);
  background: linear-gradient(
    135deg,
    var(--datasense-brand-50),
    #ffffff 58%,
    #f8f5ff 100%
  );
}

.guide-card i,
.feature-icon {
  color: var(--datasense-brand-700);
}

.feature-icon {
  background: var(--datasense-brand-100);
}

.step-number {
  background: linear-gradient(
    135deg,
    var(--datasense-brand-800),
    var(--datasense-brand-600)
  );
  box-shadow: 0 8px 18px rgba(124, 58, 237, 0.2);
}

.file-picker,
.file-control {
  border-color: var(--datasense-brand-300);
  background: var(--datasense-brand-50);
}

input,
select,
textarea,
.chatbot-controls input {
  border-color: #d9d0e8;
}

input:focus,
select:focus,
textarea:focus,
.chatbot-controls input:focus {
  border-color: var(--datasense-brand-600);
  outline: 3px solid rgba(124, 58, 237, 0.15);
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible {
  outline-color: rgba(124, 58, 237, 0.48);
}

th {
  background: var(--datasense-brand-50);
  color: #665975;
}

.message:not(.error-message):not(.success-message):not(.warning-message),
.alert:not(.error-message):not(.success-message):not(.warning-message) {
  border-color: var(--datasense-brand-200);
  background: var(--datasense-brand-50);
  color: var(--datasense-brand-900);
}

.auth-page {
  background:
    radial-gradient(circle at 12% 8%, rgba(167, 139, 250, 0.32), transparent 34%),
    radial-gradient(circle at 92% 92%, rgba(124, 58, 237, 0.12), transparent 32%),
    linear-gradient(135deg, #f7f4ff, #fcfbff);
}

.auth-story p,
.auth-benefit {
  color: #e6e0f4;
}

.auth-eyebrow {
  color: var(--datasense-brand-300);
}

.hero {
  background:
    radial-gradient(circle at 82% 18%, rgba(139, 92, 246, 0.24), transparent 30%),
    radial-gradient(circle at 12% 84%, rgba(196, 181, 253, 0.2), transparent 28%),
    linear-gradient(180deg, #ffffff, var(--datasense-brand-50));
}

.hero-preview {
  background: var(--datasense-brand-950);
  box-shadow: 0 28px 60px rgba(46, 16, 101, 0.32);
}

.preview-card {
  border-color: #5f3b8f;
  background: #35165f;
}

.preview-card span,
.preview-bar span {
  color: var(--datasense-brand-300);
}

.preview-bar span {
  background: var(--datasense-brand-400);
}

.score-pill:not(.warning-pill):not(.danger-pill) {
  border: 1px solid #b8ead6;
}

.nav-toggle {
  border-color: var(--datasense-brand-200);
  color: var(--datasense-brand-900);
}

.nav-toggle:hover,
.nav-toggle:focus-visible {
  background: var(--datasense-brand-50);
  border-color: var(--datasense-brand-400);
}

.public-menu,
.pagination,
.chart-data-details,
.chatbot-controls {
  border-color: var(--datasense-brand-200);
}

.nav-overlay {
  background: rgba(31, 10, 61, 0.64);
}

.chatbot-header {
  background: linear-gradient(
    135deg,
    var(--datasense-brand-950),
    var(--datasense-brand-800)
  );
}

.chatbot-header small {
  color: var(--datasense-brand-200);
}

.chatbot-messages {
  background: #faf9ff;
}

.chatbot-message.user {
  background: linear-gradient(
    135deg,
    var(--datasense-brand-700),
    var(--datasense-brand-500)
  );
}

.chatbot-message.bot {
  border-color: var(--datasense-brand-200);
  color: var(--text);
}

.chatbot-reset {
  background: var(--datasense-brand-50);
  color: var(--datasense-brand-800);
}

.chart-frame,
.chart-wrap {
  accent-color: var(--datasense-brand-600);
}

@media (forced-colors: active) {
  .sidebar-brand strong,
  .public-footer strong {
    background: none;
    color: CanvasText;
  }

  .brand-link span,
  .auth-brand span,
  .eyebrow,
  .text-button,
  .chart-data-details summary {
    color: LinkText;
  }
}