/* =========================================================
   Technotrement — theming for MkDocs Material
   Palette : ink #03030a · vio #8a05ff · mag #d64fff · ice #dde9f1
========================================================= */

/* ── FONTS ── */
@font-face {
  font-family: 'Chakra Petch'; font-style: normal; font-weight: 300; font-display: swap;
  src: url('../fonts/chakra-petch-300-latin.woff2') format('woff2');
}
@font-face {
  font-family: 'Chakra Petch'; font-style: normal; font-weight: 400; font-display: swap;
  src: url('../fonts/chakra-petch-400-latin.woff2') format('woff2');
}
@font-face {
  font-family: 'Chakra Petch'; font-style: normal; font-weight: 600; font-display: swap;
  src: url('../fonts/chakra-petch-600-latin.woff2') format('woff2');
}
@font-face {
  font-family: 'Chakra Petch'; font-style: normal; font-weight: 700; font-display: swap;
  src: url('../fonts/chakra-petch-700-latin.woff2') format('woff2');
}
@font-face {
  font-family: 'Faculty Glyphic'; font-style: normal; font-weight: 400; font-display: swap;
  src: url('../fonts/faculty-glyphic-400-latin.woff2') format('woff2');
}

/* ── Palette override (slate/dark) ── */
[data-md-color-scheme="slate"] {
  --tt-ink:    #03030a;
  --tt-ink2:   #08080f;
  --tt-vio:    #8a05ff;
  --tt-mag:    #d64fff;
  --tt-ice:    #dde9f1;
  --tt-dim:    rgba(221, 233, 241, .55);
  --tt-faint:  rgba(221, 233, 241, .09);

  --md-primary-fg-color:         var(--tt-ink);
  --md-primary-fg-color--light:  var(--tt-ink2);
  --md-primary-fg-color--dark:   var(--tt-ink);
  --md-primary-bg-color:         var(--tt-ice);
  --md-primary-bg-color--light:  var(--tt-ice);

  --md-accent-fg-color:          var(--tt-mag);
  --md-accent-fg-color--transparent: rgba(214, 79, 255, .1);
  --md-accent-bg-color:          var(--tt-ice);
  --md-accent-bg-color--light:   var(--tt-ice);

  --md-default-bg-color:         var(--tt-ink);
  --md-default-bg-color--light:  var(--tt-ink2);
  --md-default-fg-color:         var(--tt-ice);
  --md-default-fg-color--light:  var(--tt-ice);
  --md-default-fg-color--lighter: var(--tt-dim);
  --md-default-fg-color--lightest: var(--tt-faint);

  --md-typeset-color:            var(--tt-ice);
  --md-typeset-a-color:          var(--tt-mag);

  --md-code-bg-color:            var(--tt-ink2);
  --md-code-fg-color:            var(--tt-ice);
  --md-code-hl-color:            rgba(138, 5, 255, .25);

  --md-footer-bg-color:          var(--tt-ink2);
  --md-footer-bg-color--dark:    var(--tt-ink);
  --md-footer-fg-color:          var(--tt-ice);
  --md-footer-fg-color--light:   var(--tt-dim);
  --md-footer-fg-color--lighter: var(--tt-dim);
}

/* ── Typo ── */
body, .md-typeset {
  font-family: 'Chakra Petch', ui-monospace, monospace;
  font-weight: 400;
  letter-spacing: .005em;
}
.md-typeset h1, .md-typeset h2, .md-typeset h3, .md-typeset h4,
.md-header__title {
  font-family: 'Faculty Glyphic', 'Chakra Petch', serif;
  letter-spacing: .01em;
}
.md-typeset h1 {
  font-weight: 400; text-transform: uppercase;
  color: var(--tt-ice);
  border-bottom: 1px solid var(--tt-faint);
  padding-bottom: .4em;
}
.md-typeset h2 {
  font-weight: 400; text-transform: uppercase;
  color: var(--tt-ice); margin-top: 2.2em;
}
.md-typeset h2::before {
  content: ''; display: inline-block; width: 18px; height: 1px;
  background: linear-gradient(90deg, var(--tt-vio), var(--tt-mag));
  margin-right: 10px; vertical-align: middle;
}
.md-typeset h3 {
  font-weight: 600; text-transform: uppercase;
  font-size: .95em; letter-spacing: .04em;
  color: var(--tt-ice);
}

/* ── Header / topbar ── */
.md-header {
  background: rgba(3, 3, 10, .92) !important;
  backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--tt-faint);
  box-shadow: none;
}
.md-header__title {
  font-size: .85rem; font-weight: 600;
  letter-spacing: .1em; text-transform: uppercase;
}
.md-tabs {
  background: var(--tt-ink2) !important;
  border-bottom: 1px solid var(--tt-faint);
}
.md-tabs__link {
  font-size: .72rem; letter-spacing: .08em; text-transform: uppercase;
  color: var(--tt-dim); opacity: 1;
}
.md-tabs__link:hover, .md-tabs__link--active {
  color: var(--tt-mag);
}

.md-header__button.md-logo img {
  height: 32px; mix-blend-mode: screen;
}

/* ── Sidebar nav ── */
.md-nav {
  font-size: .78rem;
}
.md-nav__title {
  font-size: .7rem; font-weight: 600;
  letter-spacing: .1em; text-transform: uppercase;
  color: var(--tt-mag);
}
.md-nav__link {
  color: var(--tt-dim);
}
.md-nav__link:hover,
.md-nav__link:focus {
  color: var(--tt-mag);
}
.md-nav__link--active, .md-nav__item--active > .md-nav__link {
  color: var(--tt-ice) !important;
  font-weight: 600;
}

/* ── Links / accents ── */
.md-typeset a { color: var(--tt-mag); }
.md-typeset a:hover { color: var(--tt-ice); }

/* ── Inline code & blocks ── */
.md-typeset code {
  background: var(--tt-ink2);
  border: 1px solid var(--tt-faint);
  color: var(--tt-mag);
  padding: 2px 6px;
  font-size: .88em;
}
.md-typeset pre > code,
.md-typeset .highlight pre {
  background: var(--tt-ink2);
  border: 1px solid var(--tt-faint);
  border-left: 2px solid var(--tt-vio);
}

/* ── Tables ── */
.md-typeset table:not([class]) {
  border: 1px solid var(--tt-faint);
  background: var(--tt-ink2);
}
.md-typeset table:not([class]) th {
  background: var(--tt-ink);
  color: var(--tt-mag);
  font-weight: 600;
  text-transform: uppercase;
  font-size: .75rem;
  letter-spacing: .06em;
  border-bottom: 1px solid var(--tt-vio);
}
.md-typeset table:not([class]) td {
  border-top: 1px solid var(--tt-faint);
}

/* ── Admonitions ── */
.md-typeset .admonition,
.md-typeset details {
  border: 1px solid var(--tt-faint);
  border-radius: 0;
  background: rgba(221, 233, 241, .02);
  box-shadow: none;
  position: relative;
}
.md-typeset .admonition::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 1px;
  background: linear-gradient(90deg, var(--tt-vio), var(--tt-mag));
}
.md-typeset .admonition-title,
.md-typeset summary {
  background: transparent !important;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-size: .75rem;
  font-weight: 600;
}

/* ── Buttons (mkdocs .md-button) ── */
.md-typeset .md-button {
  font-family: 'Chakra Petch', monospace;
  font-size: .7rem; font-weight: 600;
  letter-spacing: .1em; text-transform: uppercase;
  background: var(--tt-vio); color: var(--tt-ice) !important;
  border: none; border-radius: 0;
  padding: 11px 24px;
  clip-path: polygon(8px 0%, 100% 0%, calc(100% - 8px) 100%, 0% 100%);
  transition: background .2s;
}
.md-typeset .md-button:hover {
  background: var(--tt-mag); color: var(--tt-ice) !important;
}

/* ── Search ── */
.md-search__form { background: var(--tt-ink2); border: 1px solid var(--tt-faint); }
.md-search__input::placeholder { color: var(--tt-dim); }
.md-search-result__meta { background: var(--tt-ink2); color: var(--tt-dim); }

/* ── Footer ── */
.md-footer-meta {
  background: var(--tt-ink) !important;
  border-top: 1px solid var(--tt-faint);
}
.md-footer-meta__inner { font-size: .75rem; }

/* ── Encryptcontent form (pages protégées) ── */
#mkdocs-content { padding-top: 1rem; }
input[name="password"] {
  font-family: 'Chakra Petch', monospace;
  background: var(--tt-ink2) !important;
  border: 1px solid var(--tt-faint) !important;
  color: var(--tt-ice) !important;
  padding: 10px 14px;
}
button[type="submit"],
button#mkdocs-decrypt-button {
  font-family: 'Chakra Petch', monospace;
  font-size: .75rem; font-weight: 600;
  letter-spacing: .1em; text-transform: uppercase;
  background: var(--tt-vio) !important; color: var(--tt-ice) !important;
  border: none !important; padding: 11px 24px !important;
  clip-path: polygon(8px 0%, 100% 0%, calc(100% - 8px) 100%, 0% 100%);
  cursor: pointer;
}
button[type="submit"]:hover,
button#mkdocs-decrypt-button:hover {
  background: var(--tt-mag) !important;
}

/* ── Separators / hr ── */
.md-typeset hr {
  border: none; height: 1px;
  background: linear-gradient(90deg, var(--tt-vio), var(--tt-mag));
  margin: 2.2em 0;
}

/* ── Content container ── */
.md-main__inner { margin-top: 1rem; }
.md-content { background: var(--tt-ink); }

/* Scroll bar subtil */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: var(--tt-ink); }
::-webkit-scrollbar-thumb { background: var(--tt-faint); }
::-webkit-scrollbar-thumb:hover { background: var(--tt-vio); }
