/*
 * dark-shell.css — Neon Civic shared shell styles
 * Applied to all inner pages. Works alongside styles.css (which is kept for
 * existing component styles). This file overrides the light-mode defaults.
 */

/* ── Base ──────────────────────────────────────────────────────────── */
html, body {
  background: #08080C !important;
  color: #F4F4F6 !important;
  font-family: 'DM Sans', system-ui, sans-serif !important;
}

/* Force dark regardless of data-theme */
[data-theme] html,
[data-theme] body {
  background: #08080C !important;
  color: #F4F4F6 !important;
}

/* ── Scrollbar ─────────────────────────────────────────────────────── */
::-webkit-scrollbar { width: 5px; }
::-webkit-scrollbar-track { background: #08080C; }
::-webkit-scrollbar-thumb { background: rgba(62,201,107,0.18); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: rgba(62,201,107,0.35); }

/* ── Nav animations ────────────────────────────────────────────────── */
.rc-nav-link {
  position: relative;
  transition: color 0.18s ease;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  min-height: 44px;
}
.rc-nav-link::after {
  content: '';
  position: absolute;
  inset-x: 0; bottom: -1px;
  height: 1px;
  background: #3EC96B;
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 0.22s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.rc-nav-link:hover::after  { transform: scaleX(1); }
.rc-nav-link.active { color: #3EC96B !important; }
.rc-nav-link.active::after { transform: scaleX(1); }

/* Mobile menu toggle */
#rc-mobile-menu { display: none; }
#rc-mobile-menu.open { display: flex; }

/* CTA button */
.rc-cta-btn,
.cta-lime {
  transition: box-shadow 0.2s ease, transform 0.2s cubic-bezier(0.34,1.56,0.64,1), opacity 0.15s ease;
  text-decoration: none;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}
.rc-cta-btn:hover {
  box-shadow: 0 0 28px rgba(62,201,107,0.35), 0 2px 8px rgba(0,0,0,0.4);
  transform: translateY(-1px);
}
.rc-cta-btn:active { transform: translateY(0); }

/* Ghost button */
.rc-ghost-btn {
  transition: all 0.18s ease;
  text-decoration: none;
}
.rc-ghost-btn:hover {
  color: #F4F4F6 !important;
  border-color: rgba(244,244,246,0.28) !important;
  background: rgba(244,244,246,0.04) !important;
}

/* ── Page hero ─────────────────────────────────────────────────────── */
.rc-page-hero h1 { color: #F4F4F6 !important; }
.rc-page-hero p  { color: rgba(244,244,246,0.50) !important; }

/* ── Typography overrides ──────────────────────────────────────────── */
h1, h2, h3, h4, h5 { color: #F4F4F6 !important; }
p { color: rgba(244,244,246,0.60); margin-bottom: 0; }

/* ── Shared links ──────────────────────────────────────────────────── */
a { color: rgba(62,201,107,0.80); }
a:hover { color: #3EC96B; }

/* ── Containers ────────────────────────────────────────────────────── */
.container { background: transparent !important; }

/* ── Hide old elements ─────────────────────────────────────────────── */
.identity-strip   { display: none !important; }
.site-header      { display: none !important; }
.site-footer      { display: none !important; }
.theme-toggle     { display: none !important; }
.header-return    { display: none !important; }
.back-to-top { background: #161621 !important; color: #3EC96B !important; border-color: rgba(62,201,107,0.2) !important; }

/* ── Inputs & selects ──────────────────────────────────────────────── */
input, select, textarea, button {
  font-family: 'DM Sans', system-ui, sans-serif !important;
}
.search-input,
.filter-select,
.week-select,
.week-reset {
  background: #161621 !important;
  color: #F4F4F6 !important;
  border-color: rgba(244,244,246,0.07) !important;
}
.search-input::placeholder { color: rgba(244,244,246,0.30) !important; }
.filter-select option,
.week-select option { background: #161621; color: #F4F4F6; }

/* ── Updates page ──────────────────────────────────────────────────── */
.updates-hero { background: transparent !important; border: none !important; }
.updates-hero-title { color: #F4F4F6 !important; }
.updates-hero-subtitle { color: rgba(244,244,246,0.50) !important; }
.updates-last-updated-text { color: rgba(244,244,246,0.30) !important; }
.updates-toolbar {
  background: #0F0F16 !important;
  border-bottom-color: rgba(244,244,246,0.07) !important;
  position: sticky !important;
  top: 56px !important;
}
.toolbar-inner { border-color: rgba(244,244,246,0.07) !important; }
.weeks-selector { background: transparent !important; border-color: rgba(244,244,246,0.07) !important; }
.weeks-selector-label { color: rgba(244,244,246,0.40) !important; }
.weeks-selector-feedback { color: rgba(244,244,246,0.30) !important; }
.week-reset {
  background: #161621 !important;
  color: rgba(244,244,246,0.50) !important;
  border-color: rgba(244,244,246,0.07) !important;
}
.week-reset:hover { color: #3EC96B !important; border-color: rgba(62,201,107,0.2) !important; }
.updates-content { background: transparent !important; }
.updates-container { background: transparent !important; }
/* Update items rendered by updates.js */
.update-week { background: transparent !important; }
.update-week-heading { color: rgba(244,244,246,0.30) !important; border-color: rgba(244,244,246,0.07) !important; }
.update-item,
.update-card {
  background: #0F0F16 !important;
  border-color: rgba(244,244,246,0.07) !important;
}
.update-item:hover,
.update-card:hover { border-color: rgba(62,201,107,0.15) !important; background: #161621 !important; }
.update-item-title,
.update-card-title { color: #F4F4F6 !important; }
.update-item-body,
.update-card-body,
.update-item-content { color: rgba(244,244,246,0.60) !important; }
.update-meta,
.update-item-meta { color: rgba(244,244,246,0.30) !important; }
.update-department-badge,
.badge,
.tag {
  background: rgba(62,201,107,0.10) !important;
  color: #3EC96B !important;
  border-color: rgba(62,201,107,0.15) !important;
}
.updates-loading p,
.updates-empty p { color: rgba(244,244,246,0.40) !important; }
.updates-empty h2 { color: #F4F4F6 !important; }
.loading-spinner {
  border-color: rgba(244,244,246,0.07) !important;
  border-top-color: #3EC96B !important;
}

/* ── Members page ──────────────────────────────────────────────────── */
.members-grid-section { background: transparent !important; }
.section-heading { color: #F4F4F6 !important; }
.members-summary { color: rgba(244,244,246,0.50) !important; }
.members-loading p { color: rgba(244,244,246,0.40) !important; }
/* Filter bar — styles.css has a bug: its [data-theme="dark"] rule still sets color-white */
.members-filter-bar {
  background: #0F0F16 !important;
  border-top-color: rgba(244,244,246,0.07) !important;
  border-bottom-color: rgba(244,244,246,0.07) !important;
}
.members-filter-btn {
  border-color: rgba(244,244,246,0.10) !important;
  color: rgba(244,244,246,0.45) !important;
  background: transparent !important;
}
.members-filter-btn:hover {
  border-color: rgba(62,201,107,0.30) !important;
  color: #3EC96B !important;
}
.members-filter-btn--active {
  background: rgba(62,201,107,0.12) !important;
  border-color: rgba(62,201,107,0.25) !important;
  color: #3EC96B !important;
}
.members-filter-btn[data-filter="all"].members-filter-btn--active {
  background: rgba(62,201,107,0.12) !important;
  border-color: rgba(62,201,107,0.25) !important;
}
/* Member cards rendered by members.js */
.members-grid { gap: 16px !important; }
.member-card {
  background: #0F0F16 !important;
  border-color: rgba(244,244,246,0.07) !important;
}
.member-card:hover { border-color: rgba(62,201,107,0.15) !important; box-shadow: none !important; transform: none !important; }
/* Member photo circle */
.member-photo {
  background: #161621 !important;
  border-color: rgba(244,244,246,0.05) !important;
  box-shadow: 0 0 0 3px rgba(244,244,246,0.06) !important;
}
.member-name,
.member-card-name { color: #F4F4F6 !important; }
.member-role,
.member-card-role,
.member-position { color: #3EC96B !important; }
.member-bio,
.member-card-bio,
.member-card-pronouns { color: rgba(244,244,246,0.50) !important; }
.member-contact a { color: rgba(62,201,107,0.70) !important; }
.member-photo-placeholder {
  background: #161621 !important;
  border-color: rgba(244,244,246,0.07) !important;
}

/* ── Resource cards (shared: resources.html + support-hub.html) ──── */
.resources-hero,
.resources-hero .container { background: transparent !important; }
.resources-hero-title { color: #F4F4F6 !important; }
.resources-hero-subtitle { color: rgba(244,244,246,0.50) !important; }
.resource-eyebrow { color: #3EC96B !important; font-size: 11px; font-weight: 700; letter-spacing: 0.1em; }
.resource-anchor-nav { gap: 8px !important; }
.resource-pill {
  background: rgba(62,201,107,0.08) !important;
  color: #3EC96B !important;
  border: 1px solid rgba(62,201,107,0.15) !important;
  text-decoration: none;
}
.resource-pill:hover {
  background: rgba(62,201,107,0.15) !important;
  color: #3EC96B !important;
}
.resource-feedback { color: rgba(244,244,246,0.35) !important; }
.resource-feedback a { color: rgba(62,201,107,0.70) !important; }
.resources-section { background: transparent !important; }
.resource-category { background: transparent !important; border-color: rgba(244,244,246,0.07) !important; }
.resource-category-header { border-color: rgba(244,244,246,0.07) !important; }
.resource-category-description { color: rgba(244,244,246,0.50) !important; }
.resource-subsection { border-color: rgba(244,244,246,0.07) !important; }
.resource-subsection h4 { color: rgba(244,244,246,0.60) !important; }
.resource-card-grid { gap: 12px !important; }
.resource-card {
  background: #0F0F16 !important;
  border-color: rgba(244,244,246,0.07) !important;
}
.resource-card:hover { border-color: rgba(62,201,107,0.15) !important; }
.resource-card h4, .resource-card-body h4 { color: #F4F4F6 !important; }
.resource-card p, .resource-card-body p { color: rgba(244,244,246,0.55) !important; }
.resource-meta { color: rgba(244,244,246,0.35) !important; }
.resource-meta li { color: rgba(244,244,246,0.35) !important; }
.resources-hero-alert {
  background: rgba(62,201,107,0.06) !important;
  border-color: rgba(62,201,107,0.15) !important;
  color: rgba(244,244,246,0.70) !important;
}
.resources-hero-alert strong { color: #3EC96B !important; }
/* Primary cta-button: override light-theme blue with lime */
.cta-button:not(.secondary) {
  background: #3EC96B !important;
  color: #08080C !important;
  box-shadow: 0 2px 16px rgba(62,201,107,0.15) !important;
}
.cta-button:not(.secondary):hover {
  background: #5AD98A !important;
  box-shadow: 0 2px 24px rgba(62,201,107,0.30) !important;
}
.cta-button.secondary {
  background: rgba(244,244,246,0.04) !important;
  color: rgba(244,244,246,0.60) !important;
  border-color: rgba(244,244,246,0.10) !important;
}
.cta-button.secondary:hover {
  background: rgba(62,201,107,0.08) !important;
  color: #3EC96B !important;
  border-color: rgba(62,201,107,0.20) !important;
}

/* ── Analytics page ────────────────────────────────────────────────── */
.analytics-hero,
.analytics-header { background: transparent !important; }
.analytics-section,
.analytics-content { background: transparent !important; }
/* Upload + ingest forms */
.upload-area,
.ingest-area,
.dropzone {
  background: #0F0F16 !important;
  border-color: rgba(244,244,246,0.07) !important;
  color: rgba(244,244,246,0.50) !important;
}
.upload-area:hover, .dropzone:hover {
  border-color: rgba(62,201,107,0.20) !important;
}
/* Stat cards */
.stat-card,
.metric-card,
.analytics-card {
  background: #0F0F16 !important;
  border-color: rgba(244,244,246,0.07) !important;
}
.stat-card:hover, .metric-card:hover { border-color: rgba(62,201,107,0.15) !important; }
.stat-value,
.metric-value { color: #3EC96B !important; }
.stat-label,
.metric-label { color: rgba(244,244,246,0.40) !important; }
/* Tables */
table { border-color: rgba(244,244,246,0.07) !important; }
thead tr { background: #161621 !important; }
th { color: rgba(244,244,246,0.50) !important; border-color: rgba(244,244,246,0.07) !important; }
td { color: rgba(244,244,246,0.70) !important; border-color: rgba(244,244,246,0.05) !important; }
tr:hover td { background: rgba(62,201,107,0.03) !important; }
/* Buttons */
.btn, .button { background: #161621 !important; color: rgba(244,244,246,0.70) !important; border-color: rgba(244,244,246,0.07) !important; }
.btn:hover, .button:hover { border-color: rgba(62,201,107,0.20) !important; color: #3EC96B !important; }
.btn-primary { background: #3EC96B !important; color: #08080C !important; border-color: transparent !important; }
/* Chart containers */
.chart-container,
.chart-wrapper { background: #0F0F16 !important; border-color: rgba(244,244,246,0.07) !important; }
/* Select/input in analytics */
.analytics-select,
.analytics-input { background: #161621 !important; color: #F4F4F6 !important; border-color: rgba(244,244,246,0.07) !important; }

/* ── Changelog page ────────────────────────────────────────────────── */
.changelog-timeline::before { background: rgba(244,244,246,0.12) !important; }
.changelog-entry { background: transparent !important; }
.changelog-entry:hover { background: rgba(62,201,107,0.02) !important; }
.entry-dot { background: #161621 !important; border-color: rgba(244,244,246,0.15) !important; }
.changelog-entry:hover .entry-dot { border-color: rgba(62,201,107,0.35) !important; background: rgba(62,201,107,0.10) !important; }
.entry-repo { color: rgba(244,244,246,0.55) !important; background: rgba(244,244,246,0.07) !important; }
.entry-type { font-size: 10px !important; font-weight: 700 !important; letter-spacing: 0.08em !important; padding: 2px 7px !important; border-radius: 3px !important; }
.entry-type--feature { background: rgba(62,201,107,0.10) !important; color: #3EC96B !important; }
.entry-type--fix     { background: rgba(96,165,250,0.10) !important; color: rgba(96,165,250,0.90) !important; }
.entry-type--chore   { background: rgba(244,244,246,0.07) !important; color: rgba(244,244,246,0.55) !important; }
.entry-type--release { background: rgba(251,191,36,0.10) !important; color: rgba(251,191,36,0.85) !important; }
.entry-type--update  { background: rgba(167,139,250,0.10) !important; color: rgba(167,139,250,0.85) !important; }
.entry-title { color: #F4F4F6 !important; font-weight: 600 !important; }
.entry-summary { color: rgba(244,244,246,0.65) !important; }
.entry-content { color: rgba(244,244,246,0.65) !important; }
.entry-bullets li { color: rgba(244,244,246,0.65) !important; }
.entry-details summary { color: rgba(244,244,246,0.60) !important; }
.entry-details summary:hover { color: rgba(62,201,107,0.80) !important; }
/* Footer nav links — expand touch target without changing visual size */
.site-footer-link { color: rgba(62,201,107,0.5); text-decoration: none; display: inline-flex; align-items: center; min-height: 44px; padding: 0 2px; }
.site-footer-link:hover { color: rgba(62,201,107,0.85); }
.entry-footer-link { color: rgba(62,201,107,0.70) !important; }
.entry-footer-link:hover { color: #3EC96B !important; }
.entry-meta-divider { color: rgba(244,244,246,0.15) !important; }
.entry-authors { color: rgba(244,244,246,0.55) !important; }
.changelog-end-message { color: rgba(244,244,246,0.45) !important; }
/* View toggle */
.view-toggle-button { background: #161621 !important; color: rgba(244,244,246,0.60) !important; border-color: rgba(244,244,246,0.07) !important; }
.view-toggle-button:hover { color: #F4F4F6 !important; border-color: rgba(244,244,246,0.15) !important; }
.view-toggle-button.active { background: rgba(62,201,107,0.10) !important; color: #3EC96B !important; border-color: rgba(62,201,107,0.20) !important; }
/* Filter inputs */
.filter-input { background: #161621 !important; color: #F4F4F6 !important; border-color: rgba(244,244,246,0.07) !important; }
.filter-label { color: rgba(244,244,246,0.55) !important; }
.filter-button { background: #161621 !important; color: rgba(244,244,246,0.60) !important; border-color: rgba(244,244,246,0.07) !important; }
.filter-button:hover { color: #3EC96B !important; border-color: rgba(62,201,107,0.20) !important; }
/* Calendar view */
.changelog-calendar-month-title { color: rgba(244,244,246,0.60) !important; }
.changelog-calendar-day-header { color: rgba(244,244,246,0.45) !important; }
/* Error state */
.updates-error h2 { color: #F4F4F6 !important; }
.updates-error p { color: rgba(244,244,246,0.60) !important; }

/* ── Modals (styles.css uses background:white, no dark-mode override) ─ */
.modal-overlay { background: rgba(0,0,0,0.75) !important; }
.modal-content {
  background: #0F0F16 !important;
  border: 1px solid rgba(244,244,246,0.10) !important;
  box-shadow: 0 20px 40px rgba(0,0,0,0.6) !important;
}
.modal-content h2 { color: #F4F4F6 !important; }
.modal-content p { color: rgba(244,244,246,0.60) !important; }
.modal-content p.muted { color: rgba(244,244,246,0.35) !important; }
.modal-content strong { color: #F4F4F6 !important; }
.modal-actions .btn {
  background: #161621 !important;
  color: rgba(244,244,246,0.65) !important;
  border-color: rgba(244,244,246,0.10) !important;
}
.modal-actions .btn:hover {
  background: rgba(62,201,107,0.08) !important;
  color: #3EC96B !important;
  border-color: rgba(62,201,107,0.20) !important;
}
.modal-actions .btn:disabled {
  background: #0F0F16 !important;
  color: rgba(244,244,246,0.20) !important;
  border-color: rgba(244,244,246,0.07) !important;
}

/* ── Modals (styles.css uses background:white, no dark-mode override) ─ */
.modal-overlay { background: rgba(0,0,0,0.75) !important; }
.modal-content {
  background: #0F0F16 !important;
  border: 1px solid rgba(244,244,246,0.10) !important;
  box-shadow: 0 20px 40px rgba(0,0,0,0.6) !important;
}
.modal-content h2 { color: #F4F4F6 !important; }
.modal-content p { color: rgba(244,244,246,0.60) !important; }
.modal-content p.muted { color: rgba(244,244,246,0.35) !important; }
.modal-content strong { color: #F4F4F6 !important; }
.modal-actions .btn {
  background: #161621 !important;
  color: rgba(244,244,246,0.65) !important;
  border-color: rgba(244,244,246,0.10) !important;
}
.modal-actions .btn:hover {
  background: rgba(62,201,107,0.08) !important;
  color: #3EC96B !important;
  border-color: rgba(62,201,107,0.20) !important;
}
.modal-actions .btn:disabled {
  background: #0F0F16 !important;
  color: rgba(244,244,246,0.20) !important;
  border-color: rgba(244,244,246,0.07) !important;
}

/* ── Confidentiality clause ────────────────────────────────────────── */
.confidentiality-clause { border-top: 1px solid rgba(244,244,246,0.07) !important; padding-top: 12px !important; }
.confidentiality-toggle { background: none !important; border: none !important; color: rgba(244,244,246,0.25) !important; cursor: pointer; font-size: 11px; font-weight: 500; letter-spacing: 0.06em; padding: 0; display: flex; align-items: center; gap: 6px; }
.confidentiality-toggle:hover { color: rgba(244,244,246,0.50) !important; }
.confidentiality-content { color: rgba(244,244,246,0.35) !important; font-size: 11px; line-height: 1.7; margin-top: 10px; }
.confidentiality-title { color: rgba(244,244,246,0.50) !important; font-weight: 600; margin-bottom: 6px; }
.confidentiality-text { color: rgba(244,244,246,0.35) !important; }
/* show/hide via aria-hidden */
.confidentiality-content[aria-hidden="true"] { display: none; }
.confidentiality-content[aria-hidden="false"] { display: block; }