/* ============================================================
   Earth Design System brand override for DefectDojo
   Source tokens: https://earth.anywhere.co/foundations/color.md
                  https://earth.anywhere.co/foundations/typography.md
   Loaded after tailwind-out.css — overrides DefectDojo's own
   --font-sans and --color-dd-primary-* theme variables in place.
   ============================================================ */

@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap");

:root {
  /* Typography: Inter, matching EDS heading/body typeface */
  --font-sans: "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

  /* Brand color: EDS decoration-brand / text-link (#1d90f6), scale
     mathematically derived to preserve DefectDojo's relative
     lightness spacing while anchoring the exact EDS hue/blue. */
  --color-dd-primary-50: #f1f8fe;
  --color-dd-primary-100: #daecfc;
  --color-dd-primary-200: #9eccf4;
  --color-dd-primary-300: #65aeee;
  --color-dd-primary-400: #3d9bee;
  --color-dd-primary-500: #1d90f6;
  --color-dd-primary-600: #0983ef;
  --color-dd-primary-700: #1275cc;
  --color-dd-primary-800: #085fac;
  --color-dd-primary-900: #035298;
}

body {
  font-family: var(--font-sans);
}

/* ============================================================
   Tag chip redesign (findings page legibility fix)
   Root cause: Tailwind v4 Preflight resets <a> to
   background-color:transparent / color:inherit inside a CSS
   cascade layer, which can outrank dojo.css's .tag-color rule
   depending on layer precedence — making white-on-#556270 tags
   render illegibly (transparent bg / inherited text color).
   Fixed here with explicit !important, and restyled as a soft
   EDS-toned chip (light primary-50 bg, dark primary-800 text)
   instead of the old dark slate, using EDS's pill radius
   (--radius-full: 9999px) and spacing scale (~4px/10px).
   ============================================================ */

.tag-label.tag-color,
.tag-label.tag-version,
a.tag-label {
  display: inline-block !important;
  white-space: nowrap !important;
  background-color: var(--color-dd-primary-50) !important;
  color: var(--color-dd-primary-800) !important;
  border: 1px solid var(--color-dd-primary-200) !important;
  border-radius: 9999px !important;
  padding: 4px 10px !important;
  margin: 2px 2px 2px 0 !important;
  font-weight: 500;
}

.tag-label.tag-color:link,
.tag-label.tag-color:visited,
.tag-label.tag-color:hover,
.tag-label.tag-color:active {
  color: var(--color-dd-primary-800) !important;
  background-color: var(--color-dd-primary-100) !important;
}

/* ============================================================
   Dashboard stat-card icon colors -> EDS semantic icon tokens
   DefectDojo defines generic --color-panel-* tokens specifically
   for this component; EDS has matching icon-* semantic colors.
   ============================================================ */
:root {
  --color-panel-blue: var(--color-dd-primary-600);   /* neutral/info -> brand blue */
  --color-panel-green: #198057;   /* EDS icon-positive */
  --color-panel-red: #c44c44;     /* EDS icon-critical */
  --color-panel-yellow: #e27e27;  /* EDS icon-caution */
}

/* ============================================================
   Sidebar: EDS is neutral-first (white/near-black surfaces,
   blue reserved for links/accents only) — not a navy fill.
   Recolored from --color-dd-primary-900 to EDS's bg-inverse
   (#111111) and inverse text/icon tokens.
   ============================================================ */
#dd-sidebar {
  background: #111111 !important; /* EDS bg-inverse */
}
#dd-sidebar a,
#dd-sidebar button {
  color: #f0f0f0 !important; /* EDS text-inverse */
}
#dd-sidebar a:hover,
#dd-sidebar button:hover {
  color: #ffffff !important;
  background: rgba(255,255,255,0.08) !important;
}
#dd-sidebar div[x-data] > div a {
  color: #dbdbdb !important; /* EDS text-inverse-secondary */
}
#dd-sidebar div[x-data] > div a:hover {
  color: #ffffff !important;
}
#dd-sidebar .dd-logo-bar {
  background: #000000 !important; /* deeper than sidebar for separation */
}
