/* When default server theme is set to dark, changes the entire background colour to make it lighter, and the background
colour of columns to make them lighter than the main body, to reduce stark contrast */

body.theme-default {
  --background-color: #1C1C28;
}

body.theme-default .column, body.theme-default .drawer {
    background: #252537;
}

/* Do the opposite for the light theme, turn down the bright whites */

body.theme-mastodon-light {
  --background-color: #FBF9FF;
}

body.theme-mastodon-light .column, body.theme-mastodon-light .drawer {
    background: #F7F6FF;
}

/* change Post to Toot! 🐘 */

.compose-form__actions .button {
    font-size: 0;
}

.compose-form__actions .button::before {
    content: "Toot! 🐘";
    font-size: 16px;
}

/* remove all-caps from profile field titles */

.account__header__bio .account__header__fields dt {
  text-transform: none;
}

/* slightly reduce vertical padding on side menu for more space */

.column-link {
  padding-top: 10px;
  padding-bottom: 10px;
}

/* red-dotted border around media with no alt-text */

.media-gallery__item-thumbnail img:not([alt]), 
.media-gallery__item-thumbnail img[alt|=""], 
.audio-player__canvas:not([title]), 
.audio-player__canvas[title|=""], 
.video-player video:not([title]), 
.video-player video[title|=""], 
.media-gallery__gifv video:not([title]), 
.media-gallery__gifv video[title|=""] {
    border: 3px dashed rgba(255, 0, 0, 0.75);
    box-sizing: border-box;
}

/* content warnings wear flannel */

.content-warning:not(.content-warning--filter):before,
.content-warning:not(.content-warning--filter):after,
.compose-form .spoiler-input__border {
  background: repeating-linear-gradient(transparent, transparent 2.5px, #1A8FE5 2.5px, #1A8FE5 3.75px, transparent 3.75px, transparent 5px, #1A8FE5 3.75px, #1A8FE5 10px, transparent 10px, transparent 11.25px, #1A8FE5 11.25px, #1A8FE5 12.5px, transparent 12.5px, transparent 20px), repeating-linear-gradient(90deg, transparent, transparent 2.5px, #1A8FE5 2.5px, #1A8FE5 3.75px, transparent 3.75px, transparent 5px, #1A8FE5 3.75px, #1A8FE5 10px, transparent 10px, transparent 11.25px, #1A8FE5 11.25px, #1A8FE5 12.5px, transparent 12.5px, transparent 20px), #ED8585;
  background-blend-mode: multiply;
  background-color: #ED8585;
}

.content-warning--filter:before,
.content-warning--filter:after {
	background:
		  radial-gradient(50% 50% at 100% 0,#3A3A3C 0%  5% ,#8c8dff 6%  15%,#3A3A3C 16% 25%,#8c8dff 26% 35%,#3A3A3C 36% 45%,
		   #8c8dff 46% 55%,#3A3A3C 56% 65%,#8c8dff 66% 75%,#3A3A3C 76% 85%,#8c8dff 86% 95%,
		   #0000 96%),
		  radial-gradient(50% 50% at 0 100%,#3A3A3C 0%  5% ,#8c8dff 6%  15%,#3A3A3C 16% 25%,#8c8dff 26% 35%,#3A3A3C 36% 45%,
		   #8c8dff 46% 55%,#3A3A3C 56% 65%,#8c8dff 66% 75%,#3A3A3C 76% 85%,#8c8dff 86% 95%,
		   #0000 96%),
		  radial-gradient(50% 50%,#3A3A3C 0%  5% ,#8c8dff 6%  15%,#3A3A3C 16% 25%,#8c8dff 26% 35%,#3A3A3C 36% 45%,
		   #8c8dff 46% 55%,#3A3A3C 56% 65%,#8c8dff 66% 75%,#3A3A3C 76% 85%,#8c8dff 86% 95%,
		   #0000 96%),
		  radial-gradient(50% 50%,#3A3A3C 0%  5% ,#8c8dff 6%  15%,#3A3A3C 16% 25%,#8c8dff 26% 35%,#3A3A3C 36% 45%,
		   #8c8dff 46% 55%,#3A3A3C 56% 65%,#8c8dff 66% 75%,#3A3A3C 76% 85%,#8c8dff 86% 95%,
		   #0000 96%) 12px 12px;
	background-size: 24px 24px;
	background-color: #3A3A3C;
}