/**
 * WRPlus - Disaster accent theming
 * --------------------------------
 * The disaster-management admin module (flood / fire / storm / epidemic / war)
 * is a single set of components themed per type via CSS custom properties.
 * The active type's layout root sets --dz-accent etc. (see disasterAccentVars()
 * in js/components/disaster-config.js); these helper classes consume them so we
 * never rely on dynamically-built Tailwind color classes (the app ships a
 * pre-compiled css/output.css).
 *
 * Defaults below are flood-blue so anything that mounts before the vars are set
 * still looks sensible.
 */
:root {
  --dz-accent: #2563eb;
  --dz-accent-soft: rgba(37, 99, 235, .12);
  --dz-accent-dark: #1d4ed8;
  --dz-grad-from: #3b82f6;
  --dz-grad-to: #2563eb;
}

/* Text / icon accent */
.dz-accent { color: var(--dz-accent) !important; }

/* Solid accent fill (buttons, active pills, indicator dots) */
.dz-bg { background-color: var(--dz-accent) !important; color: #fff !important; }
.dz-bg:hover { background-color: var(--dz-accent-dark) !important; }
.dz-bg-plain { background-color: var(--dz-accent) !important; }

/* Soft tinted fill (active nav background, badges) */
.dz-bg-soft { background-color: var(--dz-accent-soft) !important; color: var(--dz-accent) !important; }

/* Accent border / ring */
.dz-border { border-color: var(--dz-accent) !important; }
.dz-ring:focus { outline: none; box-shadow: 0 0 0 3px var(--dz-accent-soft) !important; }

/* Gradient surface (sidebar header chip, hero icons) */
.dz-grad {
  background-image: linear-gradient(135deg, var(--dz-grad-from), var(--dz-grad-to)) !important;
  color: #fff !important;
}

/* Thin accent bar (summary-card bottom strip) */
.dz-bar { background-color: var(--dz-accent) !important; }

/* Left active-indicator bar used by the disaster sidebar nav */
.dz-nav-item { position: relative; }
.dz-nav-item.dz-active::before {
  content: '';
  position: absolute;
  left: 0; top: 50%;
  transform: translateY(-50%);
  width: 3px; height: 60%;
  border-radius: 0 3px 3px 0;
  background: var(--dz-accent);
}
