/* ============================================================
   ADS-TEC IIT corporate identity for mkdocs-material
   Source of truth: https://www.ads-tec-iit.com/
   Derived from the live site's :root CSS variables.
   See ads-tec-iit-styleguide.md for the full extraction notes.
   ============================================================ */

:root {
  /* IIT brand palette — names mirror the corporate site's tokens */
  --adstec-blue:        #064d90;
  --adstec-royal-blue:  #005091;
  --adstec-dark-blue:   #00345e;
  --adstec-light-blue:  #00b8ff;
  --adstec-cyan:        #00b4d8;
  --adstec-red:         #EA332B;
  --adstec-red-light:   #f7b0b0;
  --adstec-yellow:      #fef7e4;
  --adstec-mausgrau:    #eee2d8;
  --adstec-gray-light:  #f5f5f5;
  --adstec-gray-mid:    #b0b0b0;
  --adstec-gray-dark:   #999999;

  /* Typography — Akkurat Pro (proprietary) → Inter (free) → system */
  --md-text-font:
    "Akkurat Pro",
    "Inter",
    -apple-system, BlinkMacSystemFont,
    "Segoe UI", Helvetica, Arial,
    sans-serif;
  --md-code-font:
    "Roboto Mono",
    "SFMono-Regular", Consolas, "Liberation Mono", Menlo,
    monospace;
}

/* ---------- Material primary / accent tokens (light) ---------- */

[data-md-color-scheme="default"] {
  --md-primary-fg-color:           var(--adstec-blue);
  --md-primary-fg-color--light:    var(--adstec-royal-blue);
  --md-primary-fg-color--dark:     var(--adstec-dark-blue);
  --md-primary-bg-color:           #ffffff;
  --md-primary-bg-color--light:    #ffffff;

  --md-accent-fg-color:            var(--adstec-light-blue);
  --md-accent-fg-color--transparent: rgba(0, 184, 255, 0.10);
  --md-accent-bg-color:            #ffffff;
  --md-accent-bg-color--light:     #ffffff;

  --md-typeset-a-color:            var(--adstec-blue);
  --md-code-bg-color:              var(--adstec-gray-light);
  --md-footer-bg-color:            #000000;
  --md-footer-bg-color--dark:      #000000;
}

/* ---------- Material primary / accent tokens (dark / slate) ---------- */

[data-md-color-scheme="slate"] {
  --md-primary-fg-color:           var(--adstec-blue);
  --md-primary-fg-color--light:    var(--adstec-light-blue);
  --md-primary-fg-color--dark:     var(--adstec-dark-blue);

  --md-accent-fg-color:            var(--adstec-light-blue);
  --md-accent-fg-color--transparent: rgba(0, 184, 255, 0.15);

  --md-typeset-a-color:            var(--adstec-light-blue);
  --md-footer-bg-color:            #000000;
  --md-footer-bg-color--dark:      #000000;
}

/* ---------- Headings ---------- */
/* Corporate house rule: headings are weight 400, not bold.
   Brand blue (#064d90) is reserved for H2/H3 to match the live site. */

.md-typeset h1,
.md-typeset h2,
.md-typeset h3,
.md-typeset h4 {
  font-weight: 400;
  letter-spacing: 0;
}

.md-typeset h1 {
  color: var(--md-default-fg-color);
  font-size: 2.0rem;
  line-height: 1.26;
}

.md-typeset h2 {
  color: var(--adstec-blue);
  font-size: 1.6rem;
  line-height: 1.26;
  border-bottom: 1px solid var(--adstec-gray-light);
  padding-bottom: 0.25rem;
}

.md-typeset h3 {
  color: var(--adstec-blue);
  font-size: 1.3rem;
  line-height: 1.30;
}

[data-md-color-scheme="slate"] .md-typeset h2,
[data-md-color-scheme="slate"] .md-typeset h3 {
  color: var(--adstec-light-blue);
  border-bottom-color: rgba(255, 255, 255, 0.07);
}

/* ---------- Links ---------- */

.md-typeset a {
  text-decoration: underline;
  text-underline-offset: 0.15em;
}
.md-typeset a:hover { color: var(--adstec-royal-blue); }

[data-md-color-scheme="slate"] .md-typeset a:hover {
  color: var(--adstec-cyan);
}

/* ---------- Header & tabs ---------- */

.md-header,
.md-tabs {
  background: var(--adstec-blue);
}

.md-header[data-md-state="shadow"] {
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
}

/* ---------- Buttons (md-button on landing pages) ---------- */

.md-typeset .md-button {
  background: var(--adstec-blue);
  color: #ffffff;
  border: 1px solid var(--adstec-blue);
  border-radius: 10px;
  padding: 6px 18px;
  font-weight: 400;
  text-transform: none;
  transition: background 120ms ease, border-color 120ms ease, color 120ms ease;
}
.md-typeset .md-button:focus,
.md-typeset .md-button:hover {
  background: var(--adstec-royal-blue);
  border-color: var(--adstec-royal-blue);
  color: #ffffff;
}

.md-typeset .md-button--primary {            /* outline variant */
  background: transparent;
  color: var(--adstec-blue);
}
.md-typeset .md-button--primary:focus,
.md-typeset .md-button--primary:hover {
  background: var(--adstec-blue);
  color: #ffffff;
}

[data-md-color-scheme="slate"] .md-typeset .md-button--primary {
  color: var(--adstec-light-blue);
  border-color: var(--adstec-light-blue);
}
[data-md-color-scheme="slate"] .md-typeset .md-button--primary:hover {
  background: var(--adstec-light-blue);
  color: var(--adstec-dark-blue);
}

/* ---------- Admonitions ---------- */
/* DOCX-style header bars, recoloured to the IIT palette.
   Square corners on the left rail to match the corporate site. */

.md-typeset .admonition,
.md-typeset details {
  border-radius: 4px;
  border-left-width: 4px;
}

/* danger / warning → IIT red */
.md-typeset .admonition.danger,
.md-typeset .admonition.warning,
.md-typeset details.danger,
.md-typeset details.warning {
  border-left-color: var(--adstec-red);
}
.md-typeset .danger > .admonition-title,
.md-typeset .warning > .admonition-title,
.md-typeset .danger > summary,
.md-typeset .warning > summary {
  background: rgba(234, 51, 43, 0.12);
}
.md-typeset .danger > .admonition-title::before,
.md-typeset .warning > .admonition-title::before,
.md-typeset .danger > summary::before,
.md-typeset .warning > summary::before {
  background-color: var(--adstec-red);
}

/* attention / caution → orange (kept; standard semantic) */
.md-typeset .admonition.attention,
.md-typeset .admonition.caution,
.md-typeset details.attention,
.md-typeset details.caution {
  border-left-color: #FF9800;
}
.md-typeset .attention > .admonition-title,
.md-typeset .caution  > .admonition-title,
.md-typeset .attention > summary,
.md-typeset .caution  > summary {
  background: rgba(255, 152, 0, 0.12);
}
.md-typeset .attention > .admonition-title::before,
.md-typeset .caution  > .admonition-title::before,
.md-typeset .attention > summary::before,
.md-typeset .caution  > summary::before {
  background-color: #FF9800;
}

/* info / note / tip → IIT blue */
.md-typeset .admonition.info,
.md-typeset .admonition.note,
.md-typeset .admonition.tip,
.md-typeset details.info,
.md-typeset details.note,
.md-typeset details.tip {
  border-left-color: var(--adstec-blue);
}
.md-typeset .info > .admonition-title,
.md-typeset .note > .admonition-title,
.md-typeset .tip  > .admonition-title,
.md-typeset .info > summary,
.md-typeset .note > summary,
.md-typeset .tip  > summary {
  background: rgba(6, 77, 144, 0.10);
}
.md-typeset .info > .admonition-title::before,
.md-typeset .note > .admonition-title::before,
.md-typeset .tip  > .admonition-title::before,
.md-typeset .info > summary::before,
.md-typeset .note > summary::before,
.md-typeset .tip  > summary::before {
  background-color: var(--adstec-blue);
}

/* ---------- Tables ---------- */

.md-typeset table:not([class]) {
  border: 1px solid var(--adstec-gray-light);
  border-radius: 4px;
  overflow: hidden;
}
.md-typeset table:not([class]) th {
  background: var(--adstec-gray-light);
  color: #000000;
  font-weight: 600;
  border-bottom: 2px solid var(--adstec-blue);
}
[data-md-color-scheme="slate"] .md-typeset table:not([class]) th {
  background: rgba(255, 255, 255, 0.04);
  color: var(--md-default-fg-color);
  border-bottom-color: var(--adstec-light-blue);
}
.md-typeset table:not([class]) tr:nth-child(even) td {
  background: rgba(245, 245, 245, 0.5);
}
[data-md-color-scheme="slate"] .md-typeset table:not([class]) tr:nth-child(even) td {
  background: rgba(255, 255, 255, 0.025);
}

/* ---------- Sidebar navigation ---------- */

.md-nav__title { font-weight: 600; }
.md-nav__link--active,
.md-nav__item .md-nav__link--active {
  color: var(--adstec-blue);
  font-weight: 600;
}
[data-md-color-scheme="slate"] .md-nav__link--active,
[data-md-color-scheme="slate"] .md-nav__item .md-nav__link--active {
  color: var(--adstec-light-blue);
}

/* ---------- Search ---------- */

.md-search__input {
  border-radius: 10px;
}

/* ---------- Footer ---------- */

.md-footer,
.md-footer-meta {
  background: #000000;
  color: #ffffff;
}
.md-footer a,
.md-footer-meta a {
  color: var(--adstec-light-blue);
}

/* ---------- Optional landing-page section bands ----------
   Use with: <div class="adstec-band adstec-band--mausgrau" markdown>...</div>
   Mirrors the alternating band pattern from ads-tec-iit.com. */

.adstec-band {
  margin: 2rem -1rem;
  padding: 2rem 1rem;
  border-radius: 4px;
}
.adstec-band--mausgrau { background: var(--adstec-mausgrau); color: #000; }
.adstec-band--gray     { background: var(--adstec-gray-light); color: #000; }
.adstec-band--blue     { background: var(--adstec-blue); color: #fff; }
.adstec-band--blue a   { color: var(--adstec-light-blue); }

/* ---------- Language switcher ----------
   Replace Material's "translate" glyph (文A — contains a CJK character) with a
   plain "EN/DE" label. Targeted structurally via .md-select (the language
   selector) so it applies to both the EN and DE builds; the button's aria-label
   is localized, so it is not used as a hook. */
.md-header__option .md-select > .md-header__button.md-icon svg {
  display: none;
}
.md-header__option .md-select > .md-header__button.md-icon {
  width: auto;
  padding: 0 0.35rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  line-height: 1;
}
.md-header__option .md-select > .md-header__button.md-icon::after {
  content: "EN/DE";
}