/*------------------------------------------------------------------------------
* DÉFINITION DE LA PALETTE DE COULEURS
*
* Cette section définit les variables de couleur personnalisées pour un thème Mastodon.
*
* Palette :
* --text-color: Couleur de texte principale (orange/dorée)
* --background-color: Couleur d'arrière-plan principale (gris foncé)
* --accent-color-links: Couleur d'accent pour les liens (violet)
* --accent-color-buttons: Couleur d'accent pour les boutons (marron foncé)
* --panel-bg-color: Couleur d'arrière-plan des panneaux, cartes et formulaires (gris moyen)
------------------------------------------------------------------------------*/

:root {
  --text-color: rgb(255, 170, 60);
  --background-color: #1a1a1a;
  --accent-color-links: #A864FF;
  --accent-color-buttons: #4A3B33;
  --panel-bg-color: #333;
}

/*------------------------------------------------------------------------------
* APPLICATION DES COULEURS
*
* Ces règles CSS ciblent les éléments de l'interface Mastodon pour appliquer
* la palette de couleurs définie ci-dessus.
* Version 1
------------------------------------------------------------------------------*/

/* Arrière-plan de la page et couleur de texte de base */
body, .app-root {
  background-color: var(--background-color) !important;
  color: var(--text-color) !important;
}

/* Panneaux et colonnes */
.column-header, .column-header__wrapper, .column-back-button, .search-results__header,
.account-timeline, .status, .detailed-status, .compose-form, .modal-content, .drawer,
.getting-started {
  background-color: var(--panel-bg-color) !important;
  color: var(--text-color) !important;
}

/* Titre et texte */
h1, h2, h3, h4, h5, h6,
p, label, li, span, strong, dt, dd {
  color: var(--text-color) !important;
}

/* Couleurs des liens */
a {
  color: var(--accent-color-links) !important;
}

a:hover {
  color: var(--accent-color-links) !important;
}

/* Boutons */
.button, .icon-button, input[type="submit"] {
  background-color: var(--accent-color-buttons) !important;
  border-color: var(--accent-color-buttons) !important;
  color: var(--text-color) !important;
}

.button:hover, .icon-button:hover, input[type="submit"]:hover {
  background-color: var(--accent-color-buttons) !important;
  border-color: var(--accent-color-buttons) !important;
  opacity: 0.8 !important;
}

/* Champs de formulaire */
.search__input, .autosuggest-textarea__textarea, .spoiler-input__input {
  background-color: var(--panel-bg-color) !important;
  border-color: var(--accent-color-buttons) !important;
  color: var(--text-color) !important;
}

/* Correction des couleurs d'icônes spécifiques (ex: boosts et favoris) */
.fa-retweet {
  color: var(--accent-color-links) !important;
}

.star-icon {
  color: var(--accent-color-links) !important;
}

