/* trans pride filter wrappers */

.content-warning--filter::before,
.content-warning--filter::after {
background: linear-gradient(to bottom, rgba(91,206,250,1) 0%, rgba(245,169,184,1) 28%, rgba(255,255,255,1) 50%, rgba(245,169,184,1) 72%, rgba(91,206,250,1) 100%);
}

/* make content wrappers gay again */

.content-warning:not(.content-warning--filter)::before,
.content-warning:not(.content-warning--filter)::after,
.compose-form .spoiler-input__border {
    background: linear-gradient(
        to bottom,
        rgba(255, 0, 0, 1) 0%,
        rgba(255, 154, 0, 1) 10%,
        rgba(208, 222, 33, 1) 20%,
rgba(79, 220, 74, 1) 30%,
rgba(63, 218, 216, 1) 40%,
rgba(47, 201, 226, 1) 50%,
rgba(28, 127, 238, 1) 60%,
        rgba(95, 21, 242, 1) 70%,
        rgba(186, 12, 248, 1) 80%,
        rgba(251, 7, 217, 1) 90%,
        rgba(255, 0, 0, 1) 100%
    );
}




/*
 * @name Pride Flag Button for Mastodon
 * @version 1.0+3.4
 * @description A small piece of code that changes the publish button to show pride in the LGBTQIAPN+ community
 * @author Dudu <vndmtrx@duck.com>, MagicLike <contact@magiclike.net> (https://magiclike.net)
 * @homepageURL https://github.com/vndmtrx/mastodon-pride-button
 * @license MIT
 * adapted for Mastodon 3.4 by @luka@sonomu.club <them@prin.lu>
 **/

.ui .ui__header .ui__header__links .button-secondary[href="/publish"],
.compose-form__actions .compose-form__submit .button { 
  background-color: #0000;

  background-image: 
    radial-gradient(circle at -1% 50%, #0000 5.5%, #6d2380 6% 8%, #0000 8.5%), /* Purple */
    conic-gradient(at 20% 50%, #0000 225deg, #fdd817 0 315deg, #0000 0), /* Gold */
    conic-gradient(at 27% 50%, #0000 225deg, #ffffff 0 315deg, #0000 0), /* White */
    conic-gradient(at 34% 50%, #0000 225deg, #f4aec8 0 315deg, #0000 0), /* Light Pink */
    conic-gradient(at 41% 50%, #0000 225deg, #7bcce5 0 315deg, #0000 0), /* Light Sky Blue */
    conic-gradient(at 48% 50%, #0000 225deg, #945516 0 315deg, #0000 0), /* Sandy Brown */
    conic-gradient(at 55% 50%, #0000 225deg, #000000 0 315deg, #0000 0), /* Black */
    linear-gradient(
      #e22016 0 calc((100% / 6)), /* Red */
      #f28917 0 calc((100% / 6) * 2), /* Orange */
      #efe524 0 calc((100% / 6) * 3), /* Yellow */
      #78b82a 0 calc((100% / 6) * 4), /* Green */
      #2c58a4 0 calc((100% / 6) * 5), /* Blue */
      #6d2380 0 calc((100% / 6) * 6) /* Indigo */
    );

  text-shadow: 
    #000a 1px 0px 1px,
    #000a -1px 0px 1px,
    #000a 0px 1px 1px,
    #000a 0px -1px 1px,
    #000a 1px 1px 1px,
    #000a -1px -1px 1px,
    #000a 1px -1px 1px,
    #000a -1px 1px 1px;

  transition: filter 100ms;
}

.ui .ui__header .ui__header__links .button-secondary[href="/publish"] {
  color:white;
}

.ui .ui__header .ui__header__links .button-secondary[href="/publish"]:hover,
.compose-form__actions .compose-form__submit .button:hover {
  filter: brightness(1.1);
}
.ui .ui__header .ui__header__links .button-secondary[href="/publish"]:disabled,
.compose-form__actions .compose-form__submit .button:disabled {
  filter: grayscale(0.9);
}
}





/* ***************************************************************
Underlined Links

@mentions and #HashTags are clear and visible as hyperlinks thanks to the symbols used, but regular links not so much. I like to underline hyperlinks so they are easily picked out.

via https://jaz.co.uk/projects/mastodon-4-3-custom-css/
*/

a.status-link:not(.mention) {text-decoration: underline;}


/* 
indicate media without a description

https://gist.github.com/FiXato/3de505b04efefd49a1e3568b70545234

initial code by Paul (https://linernotes.club/@balrogboogie), expanded upon by FiXato (https://contact.fixato.org)
related discussions: https://dragonscave.space/@Mayana/106443499687608116.
Feel free to reuse it; it's public domain (https://linernotes.club/@balrogboogie/106681622019395866) 
*/

.media-gallery__item-thumbnail img:not([alt]), 
.media-gallery__item-thumbnail img[alt|=""], 
.media-gallery__item-thumbnail img[alt^=" "],
.media-gallery__preview img:not([alt]),
.media-gallery__preview img[alt|=""],
.media-gallery__preview img[alt^=" "],
.audio-player__canvas:not([title]), 
.audio-player__canvas[title|=""], 
.audio-player__canvas[title^=" "], 
.video-player video:not([title]), 
.video-player video[title|=""], 
.video-player video[title^=" "],
.media-gallery__gifv video:not([title]), 
.media-gallery__gifv video[title|=""],
.media-gallery__gifv video[title^=" "] 
{
    border: 1px dashed red;
    box-sizing: border-box;
}