/* ============================================================
   Sartiq Brand Theme — Material for MkDocs Customization
   Brand colors: #005655 (teal), #dcfd78 (lime), #758984 (sage)
   ============================================================ */

/* ---------- Light palette ---------- */
[data-md-color-scheme="default"] {
  --md-primary-fg-color: #005655;
  --md-primary-fg-color--light: #007a78;
  --md-primary-fg-color--dark: #003d3c;
  --md-primary-bg-color: #ffffff;
  --md-primary-bg-color--light: #ffffffb3;

  --md-accent-fg-color: #007a78;
  --md-accent-fg-color--transparent: #007a781a;
  --md-accent-bg-color: #ffffff;

  --md-default-fg-color: #1a1a2e;
  --md-default-fg-color--light: #3a3a4a;
  --md-default-fg-color--lighter: #6b6b7b;
  --md-default-fg-color--lightest: #6b6b7b33;

  --md-default-bg-color: #fafbfc;
  --md-default-bg-color--light: #fafbfcb3;
  --md-default-bg-color--lighter: #fafbfc4d;
  --md-default-bg-color--lightest: #fafbfc1a;

  --md-code-bg-color: #f0f3f5;
  --md-code-fg-color: #1a1a2e;

  --md-typeset-a-color: #005655;

  --md-footer-bg-color: #0a1c1c;
  --md-footer-bg-color--dark: #061414;
  --md-footer-fg-color: #ffffffb3;
  --md-footer-fg-color--light: #ffffff73;
  --md-footer-fg-color--lighter: #ffffff42;
}

/* ---------- Dark palette ---------- */
[data-md-color-scheme="slate"] {
  --md-primary-fg-color: #005655;
  --md-primary-fg-color--light: #007a78;
  --md-primary-fg-color--dark: #003d3c;
  --md-primary-bg-color: #ffffff;
  --md-primary-bg-color--light: #ffffffb3;

  --md-accent-fg-color: #dcfd78;
  --md-accent-fg-color--transparent: #dcfd781a;

  --md-default-fg-color: #e4e7ea;
  --md-default-fg-color--light: #b0b8bf;
  --md-default-fg-color--lighter: #7a8590;
  --md-default-fg-color--lightest: #7a85901a;

  --md-default-bg-color: #0f1419;
  --md-default-bg-color--light: #0f1419b3;
  --md-default-bg-color--lighter: #0f14194d;
  --md-default-bg-color--lightest: #0f14191a;

  --md-code-bg-color: #161b22;
  --md-code-fg-color: #e4e7ea;

  --md-typeset-a-color: #4cc9c0;

  --md-footer-bg-color: #0a0e12;
  --md-footer-bg-color--dark: #060a0d;
  --md-footer-fg-color: #e4e7eab3;
  --md-footer-fg-color--light: #e4e7ea73;
  --md-footer-fg-color--lighter: #e4e7ea42;
}

/* ---------- Header / nav bar ---------- */
.md-header {
  background: var(--md-primary-fg-color);
  box-shadow: none;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

[data-md-color-scheme="slate"] .md-header {
  background: #0f1419;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

/* Tabs bar — subtle separator, not a colored band */
.md-tabs {
  background: var(--md-primary-fg-color);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

[data-md-color-scheme="slate"] .md-tabs {
  background: #0f1419;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

/* Active tab indicator — lime accent in dark mode */
[data-md-color-scheme="slate"] .md-tabs__link--active,
[data-md-color-scheme="slate"] .md-tabs__link:hover {
  color: #dcfd78;
}

/* ---------- Sidebar ---------- */
.md-sidebar {
  border-right: 1px solid var(--md-default-fg-color--lightest);
}

.md-nav__link--active {
  font-weight: 600;
}

[data-md-color-scheme="slate"] .md-nav__link--active {
  color: #4cc9c0;
}

/* ---------- Content area ---------- */
.md-content {
  max-width: 52rem;
}

/* ---------- Code blocks — modern look ---------- */
.md-typeset code {
  border-radius: 4px;
  font-size: 0.82em;
}

.md-typeset pre {
  border-radius: 8px;
  border: 1px solid var(--md-default-fg-color--lightest);
}

[data-md-color-scheme="slate"] .md-typeset pre {
  border: 1px solid rgba(255, 255, 255, 0.06);
}

/* Inline code — subtle tint */
.md-typeset :not(pre) > code {
  background: var(--md-code-bg-color);
  padding: 0.1em 0.35em;
  border-radius: 4px;
}

/* ---------- Tables — compact styling for better content fit ---------- */
.md-typeset table:not([class]),
.md-typeset .md-typeset__table table {
  border: 1px solid var(--md-default-fg-color--lightest);
  border-radius: 8px;
  overflow: hidden;
  font-size: 0.72rem;
  line-height: 1.4;
}

.md-typeset table:not([class]) th,
.md-typeset .md-typeset__table table th {
  background: var(--md-code-bg-color);
  font-weight: 600;
  text-transform: uppercase;
  font-size: 0.68rem;
  letter-spacing: 0.04em;
  padding: 0.5em 0.6em;
  white-space: nowrap;
}

.md-typeset table:not([class]) td,
.md-typeset .md-typeset__table table td {
  font-size: 0.72rem;
  padding: 0.4em 0.6em;
  vertical-align: top;
  word-break: break-word;
  overflow-wrap: break-word;
}

/* Code within tables */
.md-typeset table:not([class]) code,
.md-typeset .md-typeset__table table code {
  font-size: 0.65rem;
  padding: 0.1em 0.25em;
}

/* Reduce paragraph margins in tables */
.md-typeset table:not([class]) td p,
.md-typeset .md-typeset__table table td p {
  margin: 0;
}

/* ---------- Responsive table adjustments ---------- */
@media screen and (max-width: 1220px) {
  .md-typeset table:not([class]),
  .md-typeset .md-typeset__table table {
    font-size: 0.68rem;
  }

  .md-typeset table:not([class]) th,
  .md-typeset .md-typeset__table table th {
    font-size: 0.64rem;
    padding: 0.4em 0.5em;
  }

  .md-typeset table:not([class]) td,
  .md-typeset .md-typeset__table table td {
    font-size: 0.68rem;
    padding: 0.35em 0.5em;
  }

  .md-typeset table:not([class]) code,
  .md-typeset .md-typeset__table table code {
    font-size: 0.6rem;
  }
}

@media screen and (max-width: 960px) {
  .md-typeset table:not([class]),
  .md-typeset .md-typeset__table table {
    font-size: 0.64rem;
  }

  .md-typeset table:not([class]) th,
  .md-typeset .md-typeset__table table th {
    font-size: 0.6rem;
    padding: 0.35em 0.4em;
  }

  .md-typeset table:not([class]) td,
  .md-typeset .md-typeset__table table td {
    font-size: 0.64rem;
    padding: 0.3em 0.4em;
  }

  .md-typeset table:not([class]) code,
  .md-typeset .md-typeset__table table code {
    font-size: 0.56rem;
  }
}

/* ---------- Admonitions — softer look ---------- */
.md-typeset .admonition,
.md-typeset details {
  border-radius: 8px;
  border-width: 1px;
  border-left-width: 4px;
  box-shadow: none;
}

/* ---------- Search ---------- */
.md-search__form {
  border-radius: 8px;
}

/* ---------- Footer ---------- */
.md-footer {
  border-top: 1px solid var(--md-default-fg-color--lightest);
}

/* ---------- Scrollbar — thin modern style ---------- */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

::-webkit-scrollbar-thumb {
  background: var(--md-default-fg-color--lighter);
  border-radius: 3px;
}

::-webkit-scrollbar-track {
  background: transparent;
}

/* ---------- Typography refinements ---------- */
.md-typeset h1 {
  font-weight: 700;
  letter-spacing: -0.02em;
}

.md-typeset h2 {
  font-weight: 600;
  letter-spacing: -0.01em;
  padding-bottom: 0.3em;
  border-bottom: 1px solid var(--md-default-fg-color--lightest);
}

/* ---------- Smooth transitions ---------- */
.md-nav__link,
.md-tabs__link,
.md-typeset a {
  transition: color 0.15s ease, opacity 0.15s ease;
}
