/* ==UserStyle==
@name         Quick Tweak Mastodon
@namespace    github.com/openstyles/stylus
@version      0.16.0
@author       Clovis Gauzy
@license      BSD-4-Clause
@preprocessor less
@updateURL    https://dev.clov.fr/clov/UserStyles/raw/branch/monster/Mastodon/QuickTweak.css

@var          text    pouet   "Pouet, toot, whatever…"   Pouat !
==/UserStyle== */

@-moz-document regexp(".*") {
	
	html:has(#mastodon),
	body:has(#mastodon) {
		font-size: 150%;
	}
  
  #mastodon {
    font-size: 1rem;
    line-height: 1;
    margin: 0;
    padding: 0;
  
    .ui {
      overflow: auto;
      overflow-x: hidden;
    }
    .columns-area {
      display: flex;
      flex-flow: row nowrap;

    }
    .column,
    .drawer {
      padding: 0!important;
      width: auto;    
      margin: 0 1px;
    }
    .column {
      flex: 1;
      min-width: 22em;
    }
    .drawer {
      flex: .75;
      min-width: 18em;
      max-width: 22em;
    }

    .container-alt {
      width: 50em;
      margin: 3em auto 0;
    }

    .column-header__buttons {
      height: auto;
    }

    .notification__message,
    .status__prepend,
    .embed .status, .public-layout .status,
    .status {
      padding: .5em;
      min-height: 0;
    }


    .embed .account__avatar-overlay-base, .public-layout .account__avatar-overlay-base,
    .account__avatar-overlay-overlay {
      opacity: .6;
    }

    .muted .status__avatar {
      opacity: 1;
    }
    .account__section-headline a, .account__section-headline button, .notification__filter-bar a, .notification__filter-bar button {
      padding: .5em 0 .5em;
    }
    .reply-indicator__content, .status__content {
      font-size: .9rem;
      line-height: 1.25;
      padding-top: .5em;
    }
    .account__section-headline a.active::after, .account__section-headline a.active::before, .account__section-headline button.active::after, .account__section-headline button.active::before, .notification__filter-bar a.active::after, .notification__filter-bar a.active::before, .notification__filter-bar button.active::after, .notification__filter-bar button.active::before {
      border-width: 0 .4em .4em;
    }

    .media-gallery {
      min-height: 3em;
      height: auto!important;
      border-radius: .33em;
    }
    .media-gallery__item-gifv-thumbnail {
      top: 0;
      transform: none;
    }
    .media-spoiler {
      height: 6em!important;
    }

    .status__content__read-more-button {
      text-align: center;
      font-size: .9em;
      width: 100%;
    }

    .status__wrapper, .status__wrapper--filtered {
      font-size: 1em;
    }
    .status__wrapper--filtered {
      padding: .5em
    }

    .drawer__header,
    .search {
      font-size: .9em;
      margin-bottom: 0
    }
    .drawer__tab {
      padding: .25em;
    }

    .search__input {
      padding: .75em;
      padding-right: 2.5em;
      font-size: .9em;
    }
    .search__icon .fa {
      top: .5em;
      right: .5em;
      font-size: 1.2em;
      width: 1em;
      height: 1em;
    }

    .navigation-bar {
      padding: .5em;
    }

    .status__action-bar {
      justify-content: flex-end;
    }

    .column-back-button,
    .column-header {
      font-size: .9em;
    }
    .column-back-button,
    .column-header > button {
      padding: .5em;
    }
    .column-header__button {
      margin: 0;
      padding: .25em .5em;
    }

    .status-card {
      margin-top: 1.25em;
      border-radius: .33em;
    }
    .status-card.compact .status-card__image {
      flex-basis: 6em;
    }

    .reply-indicator__content, .status__content {
      display: inline;
      hyphens: auto;
    }
    .detailed-status, .detailed-status__action-bar {
      background-color: inherit;
      padding: .5em;
    }

    .reply-indicator__content .status__content__spoiler-link, .status__content .status__content__spoiler-link {
      float: right;
    }
    .status__info {
      margin-bottom: .5em;
    }
    .display-name__account {
      display: block;
      font-weight: 300;
      font-size: .85em;
      padding: .2em 0 .1em;
    }
    .reply-indicator__content p, .status__content p {
      margin-bottom: .75em;
    }

    .account__header__image {
      height: 12em
    }
    .account__header__fields dd, .account__header__fields dt {
      padding: .5em
    }

    .media-gallery {
      display: grid!important;
      grid-template: auto / auto auto;
    }

    .media-gallery__item {
      height: auto!important;
      width: 100%!important;
      min-height: 1em;
    }
    .media-gallery__item:only-of-type,
    .media-gallery__item:nth-child(2):last-child {
      grid-column: 1 / 3;

    }
    .poll__chart {
      margin: 0 -.5em;
      border-radius: 0 .33em .33em 0;
    }

    .public-layout .public-account-header__tabs__tabs .counter {
      border: none!important;
    }

    .column-back-button--slim-button {
      position: initial
    }

    .compose-form {
      padding: .25rem;
    }

    .compose-form .autosuggest-textarea__textarea {
      padding: .5em;
    }

    .compose-form .emoji-picker-dropdown {
      top: -2em;
    }
    .compose-form__warning {
      display: none;
    }

    .getting-started__footer {
      font-size: .9em;
      padding: 1em;
    }

    article, .drawer__pager, .notification-favourite, .notification-reblog, .status__wrapper-direct, .notification-follow, .notification-poll, .notification__filter-bar, .notification__filter-bar .active, .announcements, .column-header__collapsible-inner, .getting-started__footer, .search__input, .drawer__header, .drawer__header a:hover, .column-header, .load-more, [aria-label="Accueil"] .column-header {
      border: none;
      border-radius: 0!important;
    }
    
    .account__header__bio .account__header__fields dl {
      padding: 0;
    }

    .status .status__info abbr:before{
      content: "📝";
      padding-left: .5em;
    }
    
    .fa.fa-globe:before {
      content: "🌍";
    }
    .fa.fa-lock:before {
      content: "🔒";
    }
    .fa.fa-unlock:before {
      content: "🔓";
    }
		.status-card__content {
			padding: .75em .5em
			
		}
		.status-card__author, .status-card__host, .status-card__description {
			font-size: .7em;
		}
		.status-card__host {
			margin-bottom: .5em;
			font-style: italic;
		}
		
		.status-card__title {
			font-size: .9em;
			line-height: normal;
			font-weight: 600;
		}
		
		* {
			aspect-ratio: auto!important;
		}
    
		.spoiler-button__overlay span {
      display: inline;
			margin-left: .25em;
			padding: 0;
		}
		
		.media-gallery__gifv__label,
		.status__line {
		  display: none;
		}
		.spoiler-button {
			opacity: .5;
		}
		.media-gallery:hover .spoiler-button {
			display: inherit;
			opacity: 1;
		}
		
		.compose-form__highlightable.active {
			box-shadow: none;
		}
		
		.hashtag-bar {
	    font-size: .9em;	
		  font-weight: 100;
			
		  .link-button {
			  font-weight: inherit;
		  }
	  }

    .status--in-thread .attachment-list, 
    .status--in-thread .audio-player, 
    .status--in-thread .hashtag-bar, 
    .status--in-thread .media-gallery, 
    .status--in-thread .picture-in-picture-placeholder, 
    .status--in-thread .status-card, 
    .status--in-thread .status__action-bar, 
    .status--in-thread .status__content, 
    .status--in-thread .video-player {
      margin: 0;
      width: 100%;
    }

  }
  
  .emoji-mart-scroll {
    height: auto;
    max-height: calc(100vh - 30em);
  }
  
  
  button.button--block::after {
    content: var(--pouet);
  }
	
	.status__content {
		display: block!important;
		max-height: 21em;
		overflow-y: visible;
 		scrollbar-width: auto;
	} 
}