:root {
  /* Primary Colors */
  --color-clean: #10b981;
  --color-clean-dark: #047857;
  --color-clean-light: #dcfce7; /* Added for 'compact-clean' background */
  --color-infected: #ef4444;
  --color-infected-dark: #b91c1c;
  --color-error: #f59e0b;
  --color-error-dark: #92400e;
  --color-notscanned: #666666;
  --color-notscanned-dark: #444444;

  /* Grayscale & UI */
  --color-bg: #f9fafb;
  --color-card: #ffffff;
  --color-border: #e5e7eb;
  --color-heading: #1f2937;
  --color-subtext: #6b7280;

  /* Shadows, Spacing, and Radii */
  --box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
  --spacing-sm: 8px;
  --spacing-md: 16px;
  --spacing-lg: 24px;
  --radius-md: 8px;

  /* Fonts */
  --font-size-sm: 12px;
  --font-size-base: 14px;
  --font-size-lg: 20px;

  /* Link color (optional) */
  --color-link: #007bff;
}

/* Scan Box */
.scan-dash-card {
  background-color: var(--color-card);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  box-shadow: var(--box-shadow);
  margin-bottom: var(--spacing-md);
  padding: 12px; /* Could be var(--spacing-md) if you want strict spacing consistency */
  overflow: hidden;
}

/* Scan Badge */
.scan-result-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 12px;
  border-radius: 6px;
  font-family: inherit;
  font-size: 13px; /* Could be var(--font-size-sm) or var(--font-size-base) for consistency */
  font-weight: 500;
  line-height: 1;
}

/* Green Clean Badge */
.compact-clean {
  background-color: var(--color-clean-light);
  color: var(--color-clean-dark);
}

/* Checkmark Icon within the badge */
.scan-result-badge svg {
  width: 14px;
  height: 14px;
  fill: currentColor; /* Matches text color */
}

/* "Powered by" text */
.vt-powered-by {
  font-size: var(--font-size-sm);
  color: var(--color-notscanned);
  margin-top: 5px; /* Could be var(--spacing-sm) if desired */
  text-align: left;
}

/* Link to VirusTotal */
.vt-powered-by a {
  color: var(--color-link);
  text-decoration: none;
  font-weight: bold;
}

.vt-powered-by a:hover {
  text-decoration: underline;
}