/* =========================================================
   IBM Carbon Design Overrides for MkDocs Material
   ========================================================= */

/* Use IBM Plex Sans everywhere */
:root {
  --md-text-font: "IBM Plex Sans", -apple-system, BlinkMacSystemFont,
    "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --md-code-font: "IBM Plex Mono", SFMono-Regular, Menlo, Monaco, Consolas,
    "Liberation Mono", "Courier New", monospace;
}

/* =========================================================
   LIGHT MODE (Carbon Gray 10)
   ========================================================= */
[data-md-color-scheme="default"] {
  --md-primary-fg-color: #0f62fe;   /* Carbon Blue 60 */
  --md-primary-bg-color: #ffffff;

  --md-accent-fg-color: #4589ff;   /* Carbon Blue 50 */

  --md-default-bg-color: #f4f4f4;  /* Carbon Gray 10 */
  --md-default-fg-color: #161616;  /* Carbon Gray 100 */

  --md-typeset-color: #161616;
}

/* =========================================================
   DARK MODE (Carbon Gray 90 / 100)
   ========================================================= */
[data-md-color-scheme="slate"] {
  --md-primary-fg-color: #78a9ff;   /* Carbon Blue 40 */
  --md-primary-bg-color: #161616;  /* Carbon Gray 100 */

  --md-accent-fg-color: #4589ff;

  --md-default-bg-color: #161616;  /* Carbon Gray 100 */
  --md-default-fg-color: #f4f4f4;  /* Carbon Gray 10 */

  --md-typeset-color: #e0e0e0;     /* Carbon Gray 30 */
}

/* =========================================================
   HEADER & NAVIGATION
   ========================================================= */
.md-header {
  background-color: var(--md-primary-fg-color);
}

.md-tabs {
  background-color: var(--md-primary-fg-color);
}

.md-nav__title {
  display: none;
}

/* =========================================================
   CONTENT
   ========================================================= */

.md-typeset h1,
.md-typeset h2 {
  font-weight: 400;
}

/* =========================================================
   RESPONSIVE LAYOUT - FIXED LEFT NAV, EXPANDING CONTENT
   ========================================================= */

/* On large screens, control the grid layout */
@media screen and (min-width: 76.25em) {
  .md-grid {
    max-width: none;
    margin-left: 0;
    margin-right: 0;
  }
  
  /* Fixed width left sidebar */
  .md-sidebar--primary {
    width: 15rem;
    flex-shrink: 0;
  }
  
  /* Main content expands to fill available space */
  .md-content {
    max-width: none;
    flex-grow: 1;
    margin-left: 1rem;
    margin-right: 1rem;
  }
  
  /* Right sidebar (TOC) gets smaller fixed width */
  .md-sidebar--secondary {
    width: 12rem;
    flex-shrink: 0;
  }
}

/* =========================================================
   LINKS
   ========================================================= */
.md-typeset a {
  color: var(--md-accent-fg-color);
}

.md-typeset a:hover {
  text-decoration: underline;
}

/* =========================================================
   CODE BLOCKS
   ========================================================= */
.md-typeset code {
  border-radius: 4px;
  padding: 0.15em 0.35em;
}

.md-typeset pre code {
  padding: 1em;
  border-radius: 6px;
}

/* =========================================================
   ADMONITIONS (INFO, WARNING, TIP)
   ========================================================= */
.md-typeset .admonition,
.md-typeset details {
  border-left: 4px solid var(--md-primary-fg-color);
  border-radius: 4px;
}

/* =========================================================
   TABLES
   ========================================================= */
.md-typeset table:not([class]) {
  border-radius: 6px;
  overflow: hidden;
}

/* =========================================================
   FOOTER
   ========================================================= */
.md-footer {
  background-color: var(--md-primary-bg-color);
}