/* ============================================================
   4IFM Portal.css — Brand Guidelines v2.0 (August 2026)
   Loaded on every page of this portal, after the skin CSS.
   Carries brand tokens into module content and editor output,
   and aligns DNN 10 platform CSS variables with the brand.
   ============================================================ */

:root {
  /* Brand tokens */
  --4ifm-navy: #242861;      --4ifm-navy-900: #1A1D47;
  --4ifm-indigo: #49477A;    --4ifm-mist: #D9D7E3;
  --4ifm-green: #8BC540;     --4ifm-green-dark: #446B19;
  --4ifm-green-tint: #EEF7E2;
  --4ifm-ink: #23232B;       --4ifm-charcoal: #4C4C57;
  --4ifm-slate: #6B7280;     --4ifm-silver: #D8DBE0;
  --4ifm-cloud: #F5F6F8;     --4ifm-white: #FFFFFF;
  --4ifm-amber: #FFCB47;     --4ifm-coral: #E25555;
  --4ifm-font-display: 'Space Grotesk', 'Segoe UI', system-ui, sans-serif;
  --4ifm-font-body: 'Inter', 'Segoe UI', system-ui, sans-serif;
  --4ifm-radius: 14px;       --4ifm-radius-sm: 8px;
  --4ifm-gradient: linear-gradient(90deg, #242861, #8BC540);

  /* DNN 10 platform variables aligned to brand
     (mirror these in Site Settings > Appearance so admin UI regenerates to match) */
  --dnn-color-primary: #242861;
  --dnn-color-primary-light: #49477A;
  --dnn-color-primary-dark: #1A1D47;
  --dnn-color-primary-contrast: #FFFFFF;
  --dnn-color-secondary: #8BC540;
  --dnn-color-secondary-light: #EEF7E2;
  --dnn-color-secondary-dark: #446B19;
  --dnn-color-secondary-contrast: #242861;
  --dnn-color-neutral: #D8DBE0;
  --dnn-color-neutral-light: #F5F6F8;
  --dnn-color-neutral-dark: #6B7280;
  --dnn-color-neutral-contrast: #23232B;
  --dnn-color-background: #FFFFFF;
  --dnn-color-background-light: #F5F6F8;
  --dnn-color-foreground: #23232B;
  --dnn-color-foreground-light: #4C4C57;
  --dnn-color-danger: #E25555;
  --dnn-color-warning: #FFCB47;
  --dnn-controls-radius: 8px;
  --dnn-base-font-size: 16px;
}

/* ---------- Editor / module content defaults ---------- */
.DnnModule { font-family: var(--4ifm-font-body); color: var(--4ifm-charcoal); }
.DnnModule h1, .DnnModule h2, .DnnModule h3,
.DnnModule h4, .DnnModule h5, .DnnModule h6 {
  font-family: var(--4ifm-font-display);
  color: var(--4ifm-navy);
  font-weight: 700;
  line-height: 1.15;
}
.DnnModule a { color: var(--4ifm-green-dark); }
.DnnModule a:hover { color: var(--4ifm-navy); }
.DnnModule blockquote {
  border-left: 4px solid var(--4ifm-green);
  background: var(--4ifm-cloud);
  border-radius: 0 var(--4ifm-radius-sm) var(--4ifm-radius-sm) 0;
  margin: 1.2em 0; padding: 14px 20px;
  color: var(--4ifm-ink);
}
.DnnModule table { border-collapse: collapse; }
.DnnModule table th {
  background: var(--4ifm-navy); color: #fff;
  font-family: var(--4ifm-font-display); font-weight: 500;
  padding: 10px 14px;
}
.DnnModule table td { border-bottom: 1px solid var(--4ifm-silver); padding: 10px 14px; }
.DnnModule hr { border: 0; height: 3px; background: var(--4ifm-gradient); border-radius: 2px; opacity: 1; }

/* Utility classes for editors */
.text-navy { color: var(--4ifm-navy) !important; }
.text-green { color: var(--4ifm-green-dark) !important; }
.bg-cloud { background: var(--4ifm-cloud) !important; }
.bg-navy { background: var(--4ifm-navy) !important; color: #fff; }
.bg-green-tint { background: var(--4ifm-green-tint) !important; }
.accent { color: var(--4ifm-green); }