/* Tixio design tokens → Material for MkDocs
   Source: tixio-web DESIGN.md / src/index.css / @fontsource-variable/inter */

/* ── Fonts (same stack as the product) ─────────────────────────────────── */

@font-face {
  font-family: "Inter Variable";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("../assets/fonts/inter-latin-ext-wght-normal.woff2") format("woff2-variations");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
    U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB,
    U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: "Inter Variable";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("../assets/fonts/inter-latin-wght-normal.woff2") format("woff2-variations");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
    U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215,
    U+FEFF, U+FFFD;
}

@font-face {
  font-family: "Inter Variable";
  font-style: italic;
  font-display: swap;
  font-weight: 100 900;
  src: url("../assets/fonts/inter-latin-ext-wght-italic.woff2") format("woff2-variations");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
    U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB,
    U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: "Inter Variable";
  font-style: italic;
  font-display: swap;
  font-weight: 100 900;
  src: url("../assets/fonts/inter-latin-wght-italic.woff2") format("woff2-variations");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
    U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215,
    U+FEFF, U+FFFD;
}

:root {
  --md-text-font: "Inter Variable", Inter, ui-sans-serif, system-ui, sans-serif;
  --md-code-font: "JetBrains Mono", "Fira Code", ui-monospace, monospace;

  --md-primary-fg-color: #6366f1;
  --md-primary-fg-color--light: #818cf8;
  --md-primary-fg-color--dark: #4f46e5;
  --md-primary-bg-color: #ffffff;
  --md-primary-bg-color--light: #ffffff;
  --md-accent-fg-color: #6366f1;
  --md-accent-fg-color--transparent: #6366f11a;
  --md-accent-bg-color: #ffffff;
  --md-accent-bg-color--light: #ffffff;
}

/* Match product root sizing + smoothing (tixio-web html { font-size: 106.25% }). */
html {
  font-size: 106.25%;
  font-family: var(--md-text-font);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Light — canvas #f8f8f9, surfaces, ink */
[data-md-color-scheme="default"] {
  --md-default-fg-color: #18181b;
  --md-default-fg-color--light: #52525b;
  --md-default-fg-color--lighter: #686872;
  --md-default-fg-color--lightest: #a1a1aa;

  --md-default-bg-color: #f8f8f9;
  --md-default-bg-color--light: #ffffff;
  --md-default-bg-color--lighter: #f0f0f2;
  --md-default-bg-color--lightest: #ffffff;

  --md-code-fg-color: #18181b;
  --md-code-bg-color: #f0f0f2;

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

  --md-footer-bg-color: #161618;
  --md-footer-bg-color--dark: #0d0d0e;
  --md-footer-fg-color: #f0f0f0;
  --md-footer-fg-color--light: #9b9ba4;
  --md-footer-fg-color--lighter: #5c5c66;
}

/* Dark — canvas #0d0d0e */
[data-md-color-scheme="slate"] {
  --md-primary-fg-color: #6366f1;
  --md-primary-fg-color--light: #818cf8;
  --md-primary-fg-color--dark: #4f46e5;
  --md-accent-fg-color: #818cf8;
  --md-accent-fg-color--transparent: #6366f133;

  --md-default-fg-color: #f0f0f0;
  --md-default-fg-color--light: #9b9ba4;
  --md-default-fg-color--lighter: #898993;
  --md-default-fg-color--lightest: #5c5c66;

  --md-default-bg-color: #0d0d0e;
  --md-default-bg-color--light: #161618;
  --md-default-bg-color--lighter: #1e1e21;
  --md-default-bg-color--lightest: #161618;

  --md-code-fg-color: #f0f0f0;
  --md-code-bg-color: #1e1e21;

  --md-typeset-a-color: #818cf8;

  --md-footer-bg-color: #0d0d0e;
  --md-footer-bg-color--dark: #0d0d0e;
  --md-footer-fg-color: #f0f0f0;
  --md-footer-fg-color--light: #9b9ba4;
  --md-footer-fg-color--lighter: #5c5c66;
}

/* ── Type scale (DESIGN.md: body / title / headline / label / mono) ─────── */

.md-typeset {
  font-size: 0.875rem;
  line-height: 1.5;
  font-weight: 400;
  letter-spacing: normal;
}

.md-typeset h1 {
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 600;
  letter-spacing: normal;
}

.md-typeset h2 {
  font-size: 1.125rem;
  line-height: 1.5rem;
  font-weight: 600;
  letter-spacing: normal;
}

.md-typeset h3,
.md-typeset h4 {
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 600;
  letter-spacing: normal;
}

.md-typeset h5,
.md-typeset h6 {
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 500;
  letter-spacing: normal;
  text-transform: none;
}

.md-typeset code,
.md-typeset kbd,
.md-typeset pre {
  font-family: var(--md-code-font);
  font-weight: 500;
  letter-spacing: normal;
}

.md-typeset code {
  font-size: 0.8125em;
}

.md-typeset pre > code {
  font-size: 0.8125rem;
  line-height: 1.5;
  font-weight: 400;
}

.md-nav__link,
.md-tabs__link,
.md-header__topic,
.md-footer,
.md-search__input {
  font-family: var(--md-text-font);
  letter-spacing: normal;
}

.md-nav__link,
.md-tabs__link {
  font-size: 0.75rem;
  font-weight: 500;
  line-height: 1rem;
}

.md-header__topic {
  font-weight: 600;
}

/* Admonitions aligned with success / warning / danger tokens */
.md-typeset .admonition.note,
.md-typeset details.note {
  border-color: #6366f1;
}
.md-typeset .note > .admonition-title,
.md-typeset .note > summary {
  background-color: #6366f11a;
}
.md-typeset .note > .admonition-title::before,
.md-typeset .note > summary::before {
  background-color: #6366f1;
}

.md-typeset .admonition.tip,
.md-typeset details.tip,
.md-typeset .admonition.success,
.md-typeset details.success {
  border-color: #16a34a;
}
.md-typeset .tip > .admonition-title,
.md-typeset .tip > summary,
.md-typeset .success > .admonition-title,
.md-typeset .success > summary {
  background-color: #16a34a1a;
}
.md-typeset .tip > .admonition-title::before,
.md-typeset .tip > summary::before,
.md-typeset .success > .admonition-title::before,
.md-typeset .success > summary::before {
  background-color: #16a34a;
}

.md-typeset .admonition.warning,
.md-typeset details.warning {
  border-color: #d97706;
}
.md-typeset .warning > .admonition-title,
.md-typeset .warning > summary {
  background-color: #d977061a;
}
.md-typeset .warning > .admonition-title::before,
.md-typeset .warning > summary::before {
  background-color: #d97706;
}

.md-typeset .admonition.danger,
.md-typeset details.danger,
.md-typeset .admonition.failure,
.md-typeset details.failure {
  border-color: #dc2626;
}
.md-typeset .danger > .admonition-title,
.md-typeset .danger > summary,
.md-typeset .failure > .admonition-title,
.md-typeset .failure > summary {
  background-color: #ef44441a;
}
.md-typeset .danger > .admonition-title::before,
.md-typeset .danger > summary::before,
.md-typeset .failure > .admonition-title::before,
.md-typeset .failure > summary::before {
  background-color: #dc2626;
}

/* Keep the product mark crisp in the header (no theme tint). */
.md-header__button.md-logo img,
.md-nav__title .md-nav__button.md-logo img {
  height: 1.5rem;
  width: 1.5rem;
  border-radius: 6px;
}

/* White / surface header so the indigo logo mark is visible (not indigo-on-indigo). */
[data-md-color-scheme="default"] .md-header {
  background-color: #ffffff;
  color: var(--md-default-fg-color);
  box-shadow: none;
  border-bottom: 1px solid #e4e4e7;
}

[data-md-color-scheme="default"] .md-header--shadow {
  box-shadow: 0 0.05rem 0.2rem rgba(0, 0, 0, 0.08);
}

[data-md-color-scheme="default"] .md-tabs {
  background-color: #ffffff;
  color: var(--md-default-fg-color);
  border-bottom: 1px solid #e4e4e7;
}

[data-md-color-scheme="default"] .md-header__button,
[data-md-color-scheme="default"] .md-header__topic,
[data-md-color-scheme="default"] .md-source__repository,
[data-md-color-scheme="default"] .md-source__icon {
  color: var(--md-default-fg-color--light);
}

[data-md-color-scheme="default"] .md-header__button:hover {
  opacity: 1;
  color: var(--md-default-fg-color);
}

[data-md-color-scheme="default"] .md-tabs__link {
  color: var(--md-default-fg-color);
  opacity: 0.7;
}

[data-md-color-scheme="default"] .md-tabs__link:hover,
[data-md-color-scheme="default"] .md-tabs__link:focus,
[data-md-color-scheme="default"] .md-tabs__link--active {
  color: var(--md-typeset-a-color);
  opacity: 1;
}

[data-md-color-scheme="default"] .md-search__form {
  background-color: #f0f0f2;
}

[data-md-color-scheme="default"] .md-search__input,
[data-md-color-scheme="default"] .md-search__input + .md-search__icon {
  color: var(--md-default-fg-color--light);
}

[data-md-color-scheme="default"] .md-search__input::placeholder {
  color: var(--md-default-fg-color--lightest);
}

[data-md-color-scheme="slate"] .md-header {
  background-color: #161618;
  color: var(--md-default-fg-color);
  box-shadow: none;
  border-bottom: 1px solid #27272a;
}

[data-md-color-scheme="slate"] .md-header--shadow {
  box-shadow: 0 0.05rem 0.2rem rgba(0, 0, 0, 0.4);
}

[data-md-color-scheme="slate"] .md-tabs {
  background-color: #161618;
  color: var(--md-default-fg-color);
  border-bottom: 1px solid #27272a;
}

[data-md-color-scheme="slate"] .md-header__button,
[data-md-color-scheme="slate"] .md-header__topic,
[data-md-color-scheme="slate"] .md-source__repository,
[data-md-color-scheme="slate"] .md-source__icon {
  color: var(--md-default-fg-color--light);
}

[data-md-color-scheme="slate"] .md-header__button:hover {
  opacity: 1;
  color: var(--md-default-fg-color);
}

[data-md-color-scheme="slate"] .md-tabs__link {
  color: var(--md-default-fg-color);
  opacity: 0.7;
}

[data-md-color-scheme="slate"] .md-tabs__link:hover,
[data-md-color-scheme="slate"] .md-tabs__link:focus,
[data-md-color-scheme="slate"] .md-tabs__link--active {
  color: var(--md-typeset-a-color);
  opacity: 1;
}

[data-md-color-scheme="slate"] .md-search__form {
  background-color: #1e1e21;
}

[data-md-color-scheme="slate"] .md-search__input,
[data-md-color-scheme="slate"] .md-search__input + .md-search__icon {
  color: var(--md-default-fg-color--light);
}

[data-md-color-scheme="slate"] .md-search__input::placeholder {
  color: var(--md-default-fg-color--lightest);
}
