/* ═══════════════════════════════════════════════════════════════════
   UMG DASHBOARD — Alisha Refresh Layer
   Addresses Apr 20 feedback: emerald sidebar, no italic serifs,
   simplified cards, stronger section headers, cleaner overall tone.
   Loaded last — overrides dashboard.css and polish.css.
   ═══════════════════════════════════════════════════════════════════ */

/* ── 1. EMERALD SIDEBAR (dark mode) ────────────────────────────── */
.sidebar {
  background: linear-gradient(180deg, #0d2b22 0%, #071a14 100%) !important;
  border-right: 1px solid rgba(16,185,129,0.12) !important;
  box-shadow: 4px 0 24px rgba(0,0,0,0.35) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.sidebar-brand::after {
  background: linear-gradient(90deg, transparent, rgba(16,185,129,0.3), transparent) !important;
}

.sidebar a {
  color: rgba(209,250,229,0.55) !important;
}
.sidebar a:hover {
  color: #d1fae5 !important;
  background: rgba(16,185,129,0.1) !important;
}
.sidebar a.active {
  color: #6ee7b7 !important;
  background: linear-gradient(90deg, rgba(16,185,129,0.15) 0%, transparent 100%) !important;
  border-left: 3px solid #10b981 !important;
  animation: none !important;
  box-shadow: none !important;
}

.sidebar-section-label {
  color: rgba(209,250,229,0.25) !important;
}

.sidebar-brand h2 {
  background: linear-gradient(135deg, #6ee7b7, #34d399) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}
.sidebar-brand small {
  color: rgba(209,250,229,0.3) !important;
}

.sidebar-crescent {
  filter: drop-shadow(0 0 6px rgba(16,185,129,0.4)) !important;
}

.sidebar-footer {
  background: rgba(0,0,0,0.25) !important;
  border-top: 1px solid rgba(16,185,129,0.08) !important;
}
.sidebar-footer small,
.sidebar-footer a {
  color: rgba(209,250,229,0.3) !important;
}

.sidebar-action-pill {
  background: rgba(255,255,255,0.03) !important;
  border-color: rgba(16,185,129,0.1) !important;
  color: rgba(209,250,229,0.45) !important;
}
.sidebar-action-pill:hover {
  background: rgba(16,185,129,0.08) !important;
  border-color: rgba(16,185,129,0.2) !important;
  color: #d1fae5 !important;
}
.sidebar-action-pill.theme-toggle {
  color: rgba(209,250,229,0.45) !important;
}

.user-badge {
  border-bottom-color: rgba(16,185,129,0.08) !important;
}
.user-badge-avatar {
  background: rgba(16,185,129,0.15) !important;
  color: #6ee7b7 !important;
}
.user-badge-name { color: #d1fae5 !important; }
.user-badge-role { color: #6ee7b7 !important; }
.user-badge-chevron { color: rgba(209,250,229,0.35) !important; }

.user-menu {
  background: #0a2018 !important;
  border-color: rgba(16,185,129,0.15) !important;
}
.user-menu-header {
  background: rgba(16,185,129,0.06) !important;
  border-bottom-color: rgba(16,185,129,0.08) !important;
}
.user-menu-name { color: #d1fae5 !important; }
.user-menu-email { color: rgba(209,250,229,0.45) !important; }
.user-menu-divider { background: rgba(16,185,129,0.08) !important; }
.user-menu-item { color: rgba(209,250,229,0.55) !important; }
.user-menu-item:hover {
  background: rgba(16,185,129,0.1) !important;
  color: #d1fae5 !important;
}
.user-menu-signout { color: #fb7185 !important; }
.user-menu-signout:hover { background: rgba(251,113,133,0.1) !important; }

.sidebar-nav-scroll::-webkit-scrollbar-thumb {
  background: rgba(16,185,129,0.15) !important;
}

body.light-theme .sidebar {
  background: linear-gradient(180deg, #0d2b22 0%, #071a14 100%) !important;
  border-right-color: rgba(16,185,129,0.12) !important;
}

/* ── 2. NO ITALIC SERIFS ───────────────────────────────────────── */
.card-value,
.gauge-value,
.ramadan-days,
.goal-metric,
.attention-counter-num,
.csc-metric-value {
  font-family: 'DM Sans', 'Syne', system-ui, sans-serif !important;
  font-style: normal !important;
  font-weight: 800 !important;
}

.attention-source { font-style: normal !important; }
.detail-muted { font-style: normal !important; }
.exec-brief-greeting { font-style: normal !important; }
.brief-section-header h2 { font-style: normal !important; }

.font-italic,
em.metric,
.card-value em,
.gauge-value em {
  font-style: normal !important;
}

.exec-action-btn .action-icon {
  font-family: inherit !important;
  font-style: normal !important;
}

.brief-metrics .csc-metric-value,
.brief-metric-value {
  font-family: 'DM Sans', system-ui, sans-serif !important;
  font-style: normal !important;
}

/* ── 3. SIMPLIFIED CARDS ───────────────────────────────────────── */
.cards .card {
  animation: none !important;
  opacity: 1 !important;
  transform: none !important;
}

.card:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 20px rgba(0,0,0,0.25), 0 0 0 1px rgba(16,185,129,0.08) !important;
}

.card-label::before {
  display: none !important;
}
.card-label {
  letter-spacing: 0.8px !important;
  font-size: 0.7rem !important;
}

.card::after {
  opacity: 0.18 !important;
  height: 1px !important;
}
.card:hover::after {
  opacity: 0.45 !important;
  height: 1px !important;
}

.card:hover::before {
  animation: none !important;
  background: none !important;
}

/* ── 4. STRONGER SECTION HEADERS ───────────────────────────────── */
.section-header h2 {
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 1.4px !important;
  color: var(--text) !important;
  padding-bottom: 0 !important;
}

.section-header h2::after {
  display: none !important;
}
.section-header h2::before {
  content: '' !important;
  display: inline-block !important;
  width: 3px !important;
  height: 14px !important;
  background: #10b981 !important;
  border-radius: 2px !important;
  margin-right: 10px !important;
  vertical-align: middle !important;
}

.page-header h1 {
  background: none !important;
  -webkit-background-clip: unset !important;
  background-clip: unset !important;
  -webkit-text-fill-color: var(--text) !important;
  color: var(--text) !important;
  font-size: 1.4rem !important;
  font-weight: 700 !important;
  letter-spacing: -0.3px !important;
}
body.light-theme .page-header h1 {
  -webkit-text-fill-color: var(--text) !important;
  color: var(--text) !important;
}

/* ── 5. FOCUS RING: emerald ────────────────────────────────────── */
:focus-visible {
  outline-color: #10b981 !important;
}

/* ── 6. SCROLLBAR: emerald ─────────────────────────────────────── */
::-webkit-scrollbar-thumb {
  background: rgba(16,185,129,0.18) !important;
}
::-webkit-scrollbar-thumb:hover {
  background: rgba(16,185,129,0.32) !important;
}

/* ── 7. TABLE row accent ───────────────────────────────────────── */
tbody tr:hover td:first-child {
  box-shadow: inset 3px 0 0 #10b981 !important;
}

/* ── 8. MISSION ITEMS ──────────────────────────────────────────── */
.mission-item:hover {
  border-left-color: #10b981 !important;
}

/* ── 9. CAMPAIGN CARDS ─────────────────────────────────────────── */
.campaign-status-card:hover {
  border-left-color: #10b981 !important;
}

/* ── 10. ORG NODES ─────────────────────────────────────────────── */
.org-node:hover {
  border-top-color: #10b981 !important;
}

/* ── 11. GAUGE FILL ────────────────────────────────────────────── */
.gauge-fill {
  background: linear-gradient(90deg, #10b981, #34d399, #22d3ee) !important;
  box-shadow: 0 0 12px rgba(16,185,129,0.3) !important;
}

/* ── 12. PROP NOTE pinned accent ───────────────────────────────── */
.prop-note-pinned {
  border-left-color: #10b981 !important;
}

/* ── 13. LIGHT THEME calibration ───────────────────────────────── */
body.light-theme .sidebar a.active {
  color: #6ee7b7 !important;
  background: linear-gradient(90deg, rgba(16,185,129,0.15) 0%, transparent 100%) !important;
  border-left: 3px solid #10b981 !important;
}
body.light-theme .sidebar a:hover {
  color: #d1fae5 !important;
  background: rgba(16,185,129,0.1) !important;
}