/* ============================================================
   SUPPLIER INTELLIGENCE DASHBOARD — COLOR PALETTE
   ============================================================ */

:root,
[data-bs-theme="light"] {

  /* Bootstrap 5.3 bridge: use existing app.css tokens */
  --bs-primary: var(--color-accent);
  --bs-primary-rgb: 79, 70, 229;
  --bs-secondary: var(--color-text-secondary);
  --bs-secondary-rgb: 82, 82, 91;
  --bs-success: #639922;
  --bs-success-rgb: 99, 153, 34;
  --bs-info: #3730a3;
  --bs-info-rgb: 55, 48, 163;
  --bs-warning: #ef9f27;
  --bs-warning-rgb: 239, 159, 39;
  --bs-danger: #e24b4a;
  --bs-danger-rgb: 226, 75, 74;
  --bs-light: var(--color-background-primary);
  --bs-light-rgb: 255, 255, 255;
  --bs-dark: var(--color-sidebar-bg);
  --bs-dark-rgb: 9, 9, 11;

  --bs-body-color: var(--color-text-primary);
  --bs-body-color-rgb: 9, 9, 11;
  --bs-body-bg: var(--color-background-secondary);
  --bs-body-bg-rgb: 244, 244, 245;
  --bs-body-emphasis-color: var(--color-text-primary);
  --bs-secondary-color: var(--color-text-secondary);
  --bs-secondary-color-rgb: 82, 82, 91;
  --bs-tertiary-color: var(--color-text-tertiary);
  --bs-tertiary-color-rgb: 161, 161, 170;
  --bs-secondary-bg: var(--color-background-primary);
  --bs-secondary-bg-rgb: 255, 255, 255;
  --bs-tertiary-bg: var(--color-background-tertiary);
  --bs-tertiary-bg-rgb: 228, 228, 231;

  --bs-link-color: var(--color-accent);
  --bs-link-hover-color: var(--color-accent-hover);

  --bs-primary-text-emphasis: var(--color-accent-hover);
  --bs-secondary-text-emphasis: var(--color-text-primary);
  --bs-success-text-emphasis: var(--risk-green-text);
  --bs-info-text-emphasis: var(--badge-info-text);
  --bs-warning-text-emphasis: var(--risk-amber-text);
  --bs-danger-text-emphasis: var(--risk-red-text);
  --bs-light-text-emphasis: var(--color-text-primary);
  --bs-dark-text-emphasis: var(--color-background-primary);

  --bs-primary-bg-subtle: var(--color-accent-light);
  --bs-secondary-bg-subtle: var(--color-background-tertiary);
  --bs-success-bg-subtle: var(--risk-green-bg);
  --bs-info-bg-subtle: var(--badge-info-bg);
  --bs-warning-bg-subtle: var(--risk-amber-bg);
  --bs-danger-bg-subtle: var(--risk-red-bg);
  --bs-light-bg-subtle: #ffffff;
  --bs-dark-bg-subtle: #18181b;

  --bs-primary-border-subtle: #c7d2fe;
  --bs-secondary-border-subtle: var(--color-border-secondary);
  --bs-success-border-subtle: var(--green-100);
  --bs-info-border-subtle: #c7d2fe;
  --bs-warning-border-subtle: var(--amber-100);
  --bs-danger-border-subtle: var(--red-100);
  --bs-light-border-subtle: var(--color-border-tertiary);
  --bs-dark-border-subtle: #27272a;

  /* ----------------------------------------------------------
     RISK STATUS — hardcoded, never use CSS variables for these
     These are the only hex values allowed in the project.
     ---------------------------------------------------------- */

  /* Green — low risk, good, score ≥ 70 */
  --risk-green-bg:    #EAF3DE;
  --risk-green-text:  #27500A;
  --risk-green:       #639922;

  /* Amber — medium risk, warning, score 40–69 */
  --risk-amber-bg:    #FAEEDA;
  --risk-amber-text:  #633806;
  --risk-amber:       #EF9F27;

  /* Red — high risk, critical, score < 40 */
  --risk-red-bg:      #FCEBEB;
  --risk-red-text:    #791F1F;
  --risk-red:         #E24B4A;

  /* Info — neutral tags, industry badges, links */
  --badge-info-bg:    #eef2ff;
  --badge-info-text:  #3730a3;

  /* ----------------------------------------------------------
     SCORE BAR — full ramps for animated fills
     ---------------------------------------------------------- */

  --green-50:   #EAF3DE;
  --green-100:  #C0DD97;
  --green-200:  #97C459;
  --green-400:  #639922;
  --green-600:  #3B6D11;
  --green-800:  #27500A;
  --green-900:  #173404;

  --amber-50:   #FAEEDA;
  --amber-100:  #FAC775;
  --amber-200:  #EF9F27;
  --amber-400:  #BA7517;
  --amber-600:  #854F0B;
  --amber-800:  #633806;
  --amber-900:  #412402;

  --red-50:     #FCEBEB;
  --red-100:    #F7C1C1;
  --red-200:    #F09595;
  --red-400:    #E24B4A;
  --red-600:    #A32D2D;
  --red-800:    #791F1F;
  --red-900:    #501313;

}

/* ----------------------------------------------------------
   RISK BADGES
   ---------------------------------------------------------- */
.badge-low    { background: var(--risk-green-bg); color: var(--risk-green-text); }
.badge-medium { background: var(--risk-amber-bg); color: var(--risk-amber-text); }
.badge-high   { background: var(--risk-red-bg);   color: var(--risk-red-text);   }
.badge-info   { background: var(--badge-info-bg); color: var(--badge-info-text); }

.badge {
  display: inline-block;
  font-size: 11px;
  font-weight: 500;
  padding: 3px 10px;
  border-radius: 20px;
}

/* ----------------------------------------------------------
   FLAG DOTS
   ---------------------------------------------------------- */
.flag-dot   { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; margin-top: 5px; }
.dot-green  { background: var(--risk-green); }
.dot-amber  { background: var(--risk-amber); }
.dot-red    { background: var(--risk-red);   }

/* ----------------------------------------------------------
   SCORE BAR
   ---------------------------------------------------------- */
.bar-track {
  height: 6px;
  background: var(--color-background-tertiary);
  border-radius: 3px;
  overflow: hidden;
}

.bar-fill {
  height: 100%;
  border-radius: 3px;
  transition: width 0.6s ease;
}

.bar-fill-green { background: var(--green-400); }
.bar-fill-amber { background: var(--amber-200); }
.bar-fill-red   { background: var(--red-400);   }

/* ----------------------------------------------------------
   SCORE TEXT COLORS
   ---------------------------------------------------------- */
.text-good   { color: var(--risk-green); }
.text-warn   { color: var(--risk-amber); }
.text-danger { color: var(--risk-red);   }