/* ============================================================
   CEON – Custom theme to match the landing page at w3id.org/CEON
   Bootstrap-inspired colour palette extracted from the landing page.
   ============================================================ */

/* --- Colour palette ---
   Primary (navbar/header): dark navy  #1e3a5f  (Bootstrap default navbar dark)
   Accent (links, highlights): teal-green  #2e8b6e
   Background: white #ffffff
   Text: #212529 (Bootstrap default body)
   ---------------------------------------------------------------- */

:root {
  /* Primary colour – used for navbar, header bar */
  --md-primary-fg-color:              #1e3a5f;
  --md-primary-fg-color--light:       #2a5080;
  --md-primary-fg-color--dark:        #122740;
  --md-primary-bg-color:              #ffffff;
  --md-primary-bg-color--light:       rgba(255, 255, 255, 0.7);

  /* Accent colour – used for links, buttons, highlights */
  --md-accent-fg-color:               #2e8b6e;
  --md-accent-fg-color--transparent:  rgba(46, 139, 110, 0.1);
  --md-accent-bg-color:               #ffffff;

  /* Typeset colours */
  --md-typeset-color:                 #212529;
  --md-typeset-a-color:               #2e8b6e;

  /* Code block colours */
  --md-code-fg-color:                 #212529;
  --md-code-bg-color:                 #f8f9fa;
}

/* --- Dark mode overrides --- */
[data-md-color-scheme="slate"] {
  --md-primary-fg-color:              #1e3a5f;
  --md-accent-fg-color:               #4caf8f;
  --md-typeset-a-color:               #4caf8f;
  --md-code-bg-color:                 #1e2530;
}

/* ============================================================
   NAV / HEADER
   ============================================================ */

/* Make the header match the landing page dark navy bar */
.md-header {
  background-color: #1e3a5f;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

.md-header__title {
  font-weight: 600;
  letter-spacing: 0.02em;
}

/* Navigation tabs (top-level) */
.md-tabs {
  background-color: #162f50;
}

.md-tabs__link {
  opacity: 0.8;
  font-size: 0.8rem;
  font-weight: 500;
  letter-spacing: 0.03em;
}

.md-tabs__link--active,
.md-tabs__link:hover {
  opacity: 1;
}

/* ============================================================
   SIDEBAR
   ============================================================ */

.md-nav__title {
  color: #1e3a5f;
  font-weight: 700;
}

.md-nav__link--active {
  color: #2e8b6e;
  font-weight: 600;
}

/* ============================================================
   CONTENT – links, headings
   ============================================================ */

.md-typeset a {
  color: #2e8b6e;
  text-decoration: none;
}

.md-typeset a:hover {
  color: #1e3a5f;
  text-decoration: underline;
}

.md-typeset h1,
.md-typeset h2,
.md-typeset h3 {
  color: #1e3a5f;
  font-weight: 700;
}

.md-typeset h2 {
  border-bottom: 2px solid #e9ecef;
  padding-bottom: 0.3em;
}

/* ============================================================
   TABLES – Bootstrap-inspired styling
   ============================================================ */

.md-typeset table:not([class]) {
  border: 1px solid #dee2e6;
  border-collapse: collapse;
  font-size: 0.9rem;
  width: 100%;
}

.md-typeset table:not([class]) th {
  background-color: #1e3a5f;
  color: #ffffff;
  font-weight: 600;
  padding: 0.6rem 0.9rem;
  border: 1px solid #1e3a5f;
}

.md-typeset table:not([class]) td {
  padding: 0.5rem 0.9rem;
  border: 1px solid #dee2e6;
  vertical-align: middle;
}

.md-typeset table:not([class]) tr:nth-child(even) {
  background-color: #f8f9fa;
}

.md-typeset table:not([class]) tr:hover {
  background-color: rgba(46, 139, 110, 0.06);
}

/* ============================================================
   CODE BLOCKS – SPARQL and Turtle highlighting
   ============================================================ */

.md-typeset pre > code {
  border-radius: 6px;
  font-size: 0.85rem;
}

/* Inline code */
.md-typeset code {
  background-color: #f0f4f8;
  color: #1e3a5f;
  border-radius: 3px;
  padding: 0.1em 0.3em;
  font-size: 0.88em;
}

/* ============================================================
   ADMONITION COLOURS
   ============================================================ */

/* CQ boxes – use "note" style in teal */
.md-typeset .admonition.note,
.md-typeset details.note {
  border-color: #2e8b6e;
}
.md-typeset .note > .admonition-title,
.md-typeset .note > summary {
  background-color: rgba(46, 139, 110, 0.15);
  color: #2e8b6e;
}
.md-typeset .note > .admonition-title::before,
.md-typeset .note > summary::before {
  color: #2e8b6e;
}

/* ============================================================
   FOOTER
   ============================================================ */

.md-footer {
  background-color: #1e3a5f;
}

.md-footer-meta {
  background-color: #122740;
}

/* ============================================================
   BUTTONS
   ============================================================ */

.md-typeset .md-button {
  border-color: #2e8b6e;
  color: #2e8b6e;
}

.md-typeset .md-button:hover,
.md-typeset .md-button--primary {
  background-color: #2e8b6e;
  border-color: #2e8b6e;
  color: #ffffff;
}

/* ============================================================
   LOGO sizing
   ============================================================ */

.md-header__button.md-logo img {
  height: 36px;
  width: auto;
}