/* ---------------- INTERFACE MASTODON ---------------- */

/* 🎨 Colors */
.app-body {
  background-color: #232629 !important; /* color-bg */
  background-border-color: #ffffff !important; /* color-lines */
  modal-background-color: #121212 !important; /* color-content-bg */
}

/* Assure que le bouton de menu suivi des profils ne disparaît pas sur les colonnes minces */
.button.logo-button.button--destructive.button--with-bell {
  min-width: 0 !important;
}

/* Largeur minimale par colonne, permet de remplir la largeur de l'écran */
/* La classe « .column » va cibler la colonne de gauche « le formulaire de pouet » */
/* La classe « .drawer » va cibler les autres colonnes EX: « Accueil, Notifications... » */
/* La propirété « flex: 1 1 auto; » ou « flex-grow:1 » permet d'étirer les colonnes en fonction de l'écran */
.column, .drawer {
  flex: 1 1 auto;
  /* flex-grow:1; */
  max-width: none;
  min-width: 20em;
}

/* ---------------- BORDURE MULTIMÉDIA ---------------- */
/* Révèle s'il n'y a pas de texte "ALT" dans les médias */
.media-gallery__item-thumbnail img:not([alt]),
.audio-player__canvas:not([title]),
.video-player video:not([title]),
.media-gallery__gifv video:not([title]),
.media-gallery__item-thumbnail img[alt=""],
.audio-player__canvas[title=""],
.video-player video[title=""],
.media-gallery__gifv video[title=""]
{
  box-sizing: border-box;
  border: 3px solid pink;
  border-image: repeating-linear-gradient(
    -55deg,
    #000,
    #000 20px,
    #ffb101 20px,
    #ffb101 40px
  ) 10;
}

/* ---------------- MENU NAVIGATION ---------------- */
/* Modifie la navigation dans les colonnes selon la couleur choisi, ajoute du gras pour l'élément actif et couleur au survol. */
.column-link.active {
  color: #e95a4e;
  font-weight: bold;
}

.column-link:focus, .column-link:hover {
  color: #e95a4e;
}

/* ---------------- BOUTON DE PUBLICATION ---------------- */
/* Nous sommes jfmblinux ou « jfmblinux », nous ne postons pas, nous Pouetons */
.compose-form__actions .button {
  color: rgba(255,255,255,0);
}
.compose-form__actions .button::before {
  content: " OK ";
  position: absolute;
  top: 50%;
  left: 50%;
  color: rgba(255,255,255,1);
  transform: translate3d(-50%, -50%, 0);
}

/* ---------------- HYPERLIENS ---------------- */
/* Souligner les hyperliens pour qu'ils soient facilement repérables */
a.status-link:not(.mention) {text-decoration: underline;}


/* ---------------- FORMULAIRES ---------------- */
/* Bouttons à l'exterieur de "Composer un pouet" */
.compose-form__highlightable {
  border: 0;
  background: 0;
}

.compose-form .autosuggest-textarea__textarea,
.compose-form .spoiler-input__input {
  border: 1px solid var(--background-border-color);
  border-radius: 4px;
}

.autosuggest-textarea__textarea {
  background: transparent;
  min-height: 160px;
  padding-bottom: 0;
  resize: none;
  scrollbar-color: initial;
}

.compose-form__footer {
  display: grid;
  grid-template-areas:
  "buttons buttons"
  "dropdowns submit";
  padding: 0;
}

.compose-form__buttons {
  grid-area: buttons;
}

.compose-form__dropdowns {
  grid-area: dropdowns;
}

.compose-form__submit {
  grid-area: submit;
}

.compose-form__actions {
  display: contents;
}

.compose-form__uploads {
  padding: 0;
}

.compose-form .spoiler-input__input {
  border-radius: 4px 4px 0 0;
}

.compose-form .spoiler-input + .autosuggest-textarea .autosuggest-textarea__textarea {
  border-radius: 0 0 4px 4px;
  border-top: 0;
}

.compose-form .spoiler-input .autosuggest-input {
  border-bottom: 0;
}

.compose-form__poll .poll__option {
  padding: 0;
}

.emoji-picker-dropdown__menu {
  margin-left: 5px;
}


/* ---------------- MASQUE L'ÉTIQUETTE CONFIDENTIALITÉ ---------------- */
/* Hides the “post privacy” label */
.compose-form__footer [title$="privacy"] span {
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}


/* ---------------- INTERFACE DE MODÉRATION ---------------- */
/* Moderation Interface */
.report-card__summary__item__reported-by::before {
content: "Rapporté par : ";
}
.report-card__summary__item__assigned, .report-card__summary__item__assigned .username, .report-card__summary__item__reported-by, .report-card__summary__item__reported-by .username {
white-space: normal;
}
.one-line::before {
content: "Message ajouté : ";
}