/* ═══════════════════════════════════════════════════════════
   SettlementRadar Icon System
   Task #1144356 — Unified SVG icon set
   ═══════════════════════════════════════════════════════════ */

/* ── Icon Size Tokens ───────────────────────────────────── */
:root {
  --icon-sm:  16px;
  --icon-md:  20px;
  --icon-lg:  24px;
  --icon-xl:  32px;
  --icon-2xl: 48px;
}

/* ── Base Icon Styles ───────────────────────────────────── */
.sr-icon {
  display: inline-block;
  flex-shrink: 0;
  width: var(--icon-lg);
  height: var(--icon-lg);
  vertical-align: middle;
}
.sr-icon svg,
.sr-icon img {
  width: 100%;
  height: 100%;
}

/* Size variants */
.sr-icon-sm  { width: var(--icon-sm);  height: var(--icon-sm); }
.sr-icon-md  { width: var(--icon-md);  height: var(--icon-md); }
.sr-icon-lg  { width: var(--icon-lg);  height: var(--icon-lg); }
.sr-icon-xl  { width: var(--icon-xl);  height: var(--icon-xl); }
.sr-icon-2xl { width: var(--icon-2xl); height: var(--icon-2xl); }

/* ── Icon Color Variants ────────────────────────────────── */
.sr-icon-primary  { color: #2563eb; }
.sr-icon-success  { color: #16a34a; }
.sr-icon-warning  { color: #d97706; }
.sr-icon-danger   { color: #dc2626; }
.sr-icon-muted    { color: #6b7280; }
.sr-icon-white    { color: #ffffff; }
.sr-icon-current  { color: currentColor; }

/* ── Category Icon Chip ─────────────────────────────────── */
.sr-cat-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 10px;
  flex-shrink: 0;
  background: var(--cat-icon-bg, #eff6ff);
  color: var(--cat-icon-color, #2563eb);
}
.sr-cat-icon svg {
  width: 22px;
  height: 22px;
}

/* Large variant for hero/card contexts */
.sr-cat-icon-lg {
  width: 52px;
  height: 52px;
  border-radius: 14px;
}
.sr-cat-icon-lg svg {
  width: 28px;
  height: 28px;
}

/* ── Category Color Tokens ──────────────────────────────── */
.sr-cat--consumer          { --cat-icon-bg: #eff6ff; --cat-icon-color: #2563eb; }
.sr-cat--healthcare        { --cat-icon-bg: #fdf2f8; --cat-icon-color: #db2777; }
.sr-cat--data-privacy      { --cat-icon-bg: #f0f9ff; --cat-icon-color: #0284c7; }
.sr-cat--financial         { --cat-icon-bg: #f0fdf4; --cat-icon-color: #15803d; }
.sr-cat--employment        { --cat-icon-bg: #fefce8; --cat-icon-color: #a16207; }
.sr-cat--environmental     { --cat-icon-bg: #f0fdf4; --cat-icon-color: #16a34a; }
.sr-cat--product-liability { --cat-icon-bg: #fff7ed; --cat-icon-color: #c2410c; }
.sr-cat--automotive        { --cat-icon-bg: #f1f5f9; --cat-icon-color: #475569; }
.sr-cat--technology        { --cat-icon-bg: #faf5ff; --cat-icon-color: #7c3aed; }
.sr-cat--telecommunications{ --cat-icon-bg: #ecfeff; --cat-icon-color: #0e7490; }
.sr-cat--insurance         { --cat-icon-bg: #eff6ff; --cat-icon-color: #1d4ed8; }
.sr-cat--government        { --cat-icon-bg: #f8fafc; --cat-icon-color: #334155; }
.sr-cat--food-beverage     { --cat-icon-bg: #fff7ed; --cat-icon-color: #ea580c; }

/* ── Icon in Buttons ────────────────────────────────────── */
.btn-icon {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}
.btn-icon svg,
.btn-icon .sr-icon {
  width: var(--icon-md);
  height: var(--icon-md);
  flex-shrink: 0;
}

/* ── Inline Icon (flow text) ────────────────────────────── */
.icon-inline {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  vertical-align: middle;
}

/* ── Status Icons ───────────────────────────────────────── */
.sr-status-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  flex-shrink: 0;
}
.sr-status-icon-success { background: #dcfce7; color: #16a34a; }
.sr-status-icon-warning { background: #fef9c3; color: #a16207; }
.sr-status-icon-danger  { background: #fee2e2; color: #dc2626; }
.sr-status-icon-info    { background: #dbeafe; color: #2563eb; }

/* ── Illustrations ──────────────────────────────────────── */
.sr-illustration {
  display: block;
  margin: 0 auto;
}
.sr-illustration-sm  { width: 120px; height: auto; }
.sr-illustration-md  { width: 180px; height: auto; }
.sr-illustration-lg  { width: 240px; height: auto; }

/* Empty state wrapper */
.sr-empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 3rem 1.5rem;
  gap: 1rem;
}
.sr-empty-state__title {
  font-size: 1rem;
  font-weight: 700;
  color: #374151;
  margin: 0;
}
.sr-empty-state__body {
  font-size: 0.88rem;
  color: #6b7280;
  margin: 0;
  max-width: 300px;
  line-height: 1.6;
}

/* ── Loading Radar ──────────────────────────────────────── */
.sr-loading-radar {
  display: block;
  margin: 0 auto;
  width: 80px;
  height: 80px;
}

/* ── Hero Accent ────────────────────────────────────────── */
.sr-hero-accent {
  position: absolute;
  pointer-events: none;
  user-select: none;
  opacity: 0.6;
}

/* ── Radar Sweep Animation ──────────────────────────────── */
@keyframes sr-radar-sweep {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}
@keyframes sr-radar-ping {
  0%, 100% { opacity: 0; transform: scale(0.8); }
  50%       { opacity: 1; transform: scale(1.2); }
}
.sr-radar-sweep-anim {
  animation: sr-radar-sweep 2s linear infinite;
  transform-origin: center;
}

/* ── Responsive ─────────────────────────────────────────── */
@media (max-width: 480px) {
  .sr-illustration-lg { width: 160px; }
  .sr-illustration-md { width: 130px; }
  .sr-cat-icon-lg     { width: 44px; height: 44px; }
}