/* Economics page — standalone layer that reuses the modular site styles */

/* ============ IMPORT MODULAR CSS ARCHITECTURE ============ */
/* Load in order: base → themes → components → layout → assistant */
@import url("styles/base.css");
@import url("styles/themes.css");
@import url("styles/components.css");
@import url("styles/layout.css");
@import url("styles/assistant.css");

/* ============ ECONOMICS PAGE SPECIFIC STYLES ============ */

/* Green gradient utility for the hero word "Economics" */
.gradient-green {
  color: transparent;
  background: linear-gradient(90deg, #22c55e, #86efac);
  -webkit-background-clip: text;
  background-clip: text;
}

/* Optional: make section titles slightly greener on this page only */
body:has(#econ-root) .section-title {
  background: linear-gradient(90deg, #22c55e, #86efac);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  opacity: 0.95;
}

/* Tighten accordion a touch for glossary */
#econGlossary .acc-item .acc-inner,
#econGlossaryLeft .acc-item .acc-inner,
#econGlossaryRight .acc-item .acc-inner {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}

#econGlossary .acc-item h4,
#econGlossaryLeft .acc-item h4,
#econGlossaryRight .acc-item h4 {
  margin: 0.25rem 0 0.25rem;
}

#econGlossary .term,
#econGlossaryLeft .term,
#econGlossaryRight .term {
  font-weight: 800;
  color: #0f172a;
}

body[data-theme="dark"] #econGlossary .term,
body[data-theme="dark"] #econGlossaryLeft .term,
body[data-theme="dark"] #econGlossaryRight .term {
  color: #e5e5e5;
}

/* Two-column layout for the glossary accordions */
#econGlossaryRow {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  align-items: start;
}

@media (max-width: 768px) {
  #econGlossaryRow {
    grid-template-columns: 1fr;
  }
}

/* Keep in-page anchor jumps comfy under the fixed navbar */
section {
  scroll-margin-top: 96px;
}