/* Couleurs personnalisées Shotto */

/* Mode sombre (slate) */
[data-md-color-scheme="slate"] {
  --md-primary-fg-color: #1a1a2e;
  --md-primary-fg-color--light: #2d2d44;
  --md-primary-fg-color--dark: #0f0f1a;
  --md-accent-fg-color: #4db6ac;
  --md-default-bg-color: #1a1a2e;
  --md-default-bg-color--light: #2d2d44;
}

/* Mode clair (default) */
[data-md-color-scheme="default"] {
  --md-primary-fg-color: #1a1a2e;
  --md-primary-fg-color--light: #2d2d44;
  --md-primary-fg-color--dark: #0f0f1a;
  --md-accent-fg-color: #4db6ac;
}

/* Header */
.md-header {
  background-color: var(--md-primary-fg-color);
}

/* Cacher le titre du site dans le header (logo suffit) */
.md-header__topic:first-child {
  display: none;
}

.md-header__button.md-logo img {
  height: 2rem;
  width: auto;
}

/* Navigation tabs */
.md-tabs {
  background-color: var(--md-primary-fg-color--light);
}

.md-tabs__link {
  font-weight: 500;
  opacity: 0.8;
}

.md-tabs__link--active,
.md-tabs__link:hover {
  opacity: 1;
}

/* Contenu des pages centré */
.md-content {
  max-width: 900px;
  margin: 0 auto;
}

.md-main__inner {
  max-width: 100%;
}

/* Cards sur les pages de contenu */
.md-typeset .grid.cards > ul > li {
  border: 1px solid var(--md-default-fg-color--lightest);
  border-radius: 8px;
  transition: transform 0.2s, box-shadow 0.2s;
}

.md-typeset .grid.cards > ul > li:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

/* Boutons */
.md-typeset .md-button {
  border-radius: 6px;
  font-weight: 500;
  transition: all 0.2s;
}

.md-typeset .md-button--primary {
  background-color: var(--md-accent-fg-color);
  border-color: var(--md-accent-fg-color);
}

.md-typeset .md-button--primary:hover {
  background-color: #26a69a;
  border-color: #26a69a;
}

/* Footer */
.md-footer {
  background-color: var(--md-primary-fg-color);
}

/* Fix toggle theme scroll issue */
[data-md-component="palette"] {
  scroll-behavior: auto;
}

label[for^="__palette"] {
  scroll-behavior: auto;
}