/* NebulOps Wiki - Thème inspiré de Zensical */

/* Mode sombre - Teinte personnalisée */
[data-md-color-scheme="slate"] {
  --md-hue: 220;
}

/* Header transparent sur homepage */
body.is-homepage .md-header {
  background: rgba(0, 0, 0, 0.2) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
}

/* Search bar transparente sur homepage */
body.is-homepage .md-search__input {
  background: rgba(255, 255, 255, 0.05) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}


/* ── Scrollbar ──────────────────────────────────────────────────────── */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
::-webkit-scrollbar-track {
  background: transparent;
}
::-webkit-scrollbar-thumb {
  background: rgba(0, 212, 255, 0.28);
  border-radius: 3px;
  transition: background 0.2s ease;
}
::-webkit-scrollbar-thumb:hover {
  background: rgba(0, 212, 255, 0.6);
}
::-webkit-scrollbar-corner {
  background: transparent;
}
/* Light mode */
[data-md-color-scheme="default"] ::-webkit-scrollbar-thumb {
  background: rgba(0, 140, 170, 0.25);
}
[data-md-color-scheme="default"] ::-webkit-scrollbar-thumb:hover {
  background: rgba(0, 140, 170, 0.55);
}

/* Styles pour les diagrammes Mermaid */
.mermaid {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  margin: 2rem auto !important;
  padding: 1.5rem !important;
  background: rgba(30, 30, 30, 0.5) !important;
  border-radius: 8px !important;
  border: 1px solid rgba(130, 170, 255, 0.2) !important;
  max-width: 100% !important;
  overflow-x: auto !important;
}

/* Texte blanc pour tous les éléments Mermaid */
.mermaid svg {
  max-width: 100% !important;
  height: auto !important;
  display: block !important;
  margin: 0 auto !important;
}

.mermaid text,
.mermaid .label,
.mermaid .nodeLabel,
.mermaid .edgeLabel,
.mermaid .labelText,
.mermaid foreignObject,
.mermaid .cluster-label,
.mermaid .actor,
.mermaid .messageText {
  fill: #FFFFFF !important;
  color: #FFFFFF !important;
  font-size: 14px !important;
  font-weight: 500 !important;
}

/* Arrière-plan des labels */
.mermaid .labelBox,
.mermaid .label-container,
.mermaid rect.label-container {
  fill: rgba(45, 45, 45, 0.9) !important;
  stroke: rgba(130, 170, 255, 0.5) !important;
}

/* Noeuds et boxes */
.mermaid .node rect,
.mermaid .node circle,
.mermaid .node polygon,
.mermaid .node path {
  stroke-width: 2px !important;
}

/* Titres de cluster */
.mermaid .cluster rect {
  fill: rgba(45, 45, 45, 0.3) !important;
  stroke: rgba(130, 170, 255, 0.5) !important;
}

/* Liens et flèches */
.mermaid .edgePath .path,
.mermaid line.actor-line {
  stroke: rgba(195, 232, 141, 0.8) !important;
  stroke-width: 2px !important;
}

.mermaid marker {
  fill: rgba(195, 232, 141, 0.8) !important;
  stroke: rgba(195, 232, 141, 0.8) !important;
}

/* Centrage du contenu */
.md-content__inner > .mermaid:first-of-type {
  margin-top: 2rem !important;
}


/* ============================================================
   Footer — Identité NebulOps Wiki
   ============================================================ */

/* Séparateur cyan en haut du footer */
.md-footer {
  border-top: 1px solid transparent;
  border-image: linear-gradient(
    90deg,
    transparent 0%,
    rgba(0, 212, 255, 0.25) 20%,
    rgba(0, 212, 255, 0.6) 50%,
    rgba(0, 212, 255, 0.25) 80%,
    transparent 100%
  ) 1;
}

/* Barre méta du footer */
.md-footer-meta {
  background: rgba(0, 0, 0, 0.35);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

/* Texte copyright */
.md-copyright {
  color: rgba(255, 255, 255, 0.4);
  font-size: 0.7rem;
  letter-spacing: 0.04em;
}

.md-copyright__highlight {
  color: rgba(255, 255, 255, 0.65);
  font-weight: 500;
}

/* Lien dans le copyright */
.md-copyright a {
  color: #00D4FF !important;
  text-decoration: none;
  transition: opacity 0.2s ease;
}

.md-copyright a:hover {
  opacity: 0.75;
}

/* Icônes sociales */
.md-social__link {
  color: rgba(255, 255, 255, 0.35) !important;
  transition: color 0.2s ease, filter 0.2s ease;
}

.md-social__link:hover {
  color: #00D4FF !important;
  filter: drop-shadow(0 0 6px rgba(0, 212, 255, 0.55));
}

/* Navigation prev/next dans le footer */
.md-footer__link {
  transition: background 0.2s ease;
}

.md-footer__link:hover {
  background: rgba(0, 212, 255, 0.05);
}

.md-footer__link:hover .md-footer__direction {
  color: #00D4FF;
}

.md-footer__button.md-icon {
  color: rgba(0, 212, 255, 0.7);
}