/* CSS */
@font-face {
    font-family: "Bell Centennial Std BoldListing";
    src: url(/system/Bell Centennial Std BoldListing.ttf) format("ttf");
}
.ui {
  font-family: Bell Centennial, monospace;
}
.status__content_text {
  font-size 14px;
}

/* Post printer friendly with replies */
@media print {.tabs-bar__wrapper,.columns-area__panels__pane {display: none;}.column-area__panels__main {max-width: 100% !important;}}

/* Menu on left 
 .columns-area__panels{
   flex-direction: row-reverse;
} ? */

/* Alt background */
@media screen and (min-width: 630.02px) {
    .column,
    .drawer {
        flex: initial;
        flex-basis: 100%;
        flex-direction: column;
        flex-grow: 4;
        flex-shrink: 1
    }
}

 .media-gallery__actions {
   opacity: 0.1;
}

 .video-player .media-gallery__actions.active {
   opacity: 0.1;
}
 .media-gallery__ item badges {
   opacity: 0.1;
}
/* Alt background2 */
.app-body {
    .media-gallery__alt__label,
    .media-gallery__gifv__label,
    .media-gallery__actions__pill {
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        background-color: rgba(0, 0, 0, .15);
    }
}
button.media-gallery__actions__pill {
    position:absolute;
    right:-12px !important;
    top: -12px !important;
    opacity: 0.6 !important;
 }
 button.media-gallery__alt__label{
    position:absolute;
    right:-12px !important;
    bottom: -12px !important;
    opacity: 0.1 !important;
 }  

/* no alt attribute 
img[alt=""],
img:not([alt]) {
    border: 5px dashed solid red; 
} */

/*
 * Copied from https://about.front-end.social/css/override.css on 2022-12-27
 * Check the original source for updates.
 */

/* show when images have alt text */
.media-gallery__item {
  --alt-crop-x: 6ch;
  --alt-crop-y: 2em;
  background: darkgreen;
  color: white;
}

/* only revealed by cutaway when alt is defined */
.media-gallery__item::after {
  content: "alt";
  display: grid;
  inset-block-end: 0;
  inset-inline-start: 0;
  min-height: var(--alt-crop-y);
  min-width: var(--alt-crop-x);
  place-content: center;
  position: absolute;
}

/* cut away to reveal badge */
.media-gallery__item img[alt] {
  clip-path: polygon(0 0, 100% 0, 100% 100%, var(--alt-crop-x) 100%, var(--alt-crop-x) calc(100% - var(--alt-crop-y)), 0 calc(100% - var(--alt-crop-y)));
}

/* Remove the clip path if we can do better with :has() */
.media-gallery__item:has(img) img[alt] {
  clip-path: none;
}

/* Apply better alt-text badge over top of image */
.media-gallery__item:has(img)::after {
  --alt-crop-x: initial;
  --alt-crop-y: initial;
  background: darkgreen;
  border: thin solid rgba(255, 255, 255, 0.4);
  border-radius: 3px;
  inset-block-end: 0.5em;
  inset-inline-start: 0.5em;
  padding: 0.25rem 0.5rem;
  position: absolute;
  pointer-events: none;
  opacity: 0.3;
  z-index: 2;
}

/* Change badge when no alt is defined */
.media-gallery__item:has(img:not([alt]))::after {
  background: maroon;
  content: "no alt";
  opacity: 0.4;
}