/* Fix image gallery styles */
/* Left image */
.media-gallery__item[style^="inset: auto 2px auto auto"] {
    margin-right: 2px;
}
/* Top left image */
.media-gallery__item[style^="inset: auto 2px 2px auto"] {
    margin-bottom: 2px;
    margin-right: 2px;
}
/* Bottom left image */
.media-gallery__item[style^="inset: 2px 2px auto auto"] {
    margin-top: 2px;
    margin-right: 2px;
}
/* Right image */
.media-gallery__item[style^="inset: auto auto auto 2px"] {
    margin-left: 2px;
}
/* Top right image */
.media-gallery__item[style^="inset: auto auto 2px 2px"] {
    margin-bottom: 2px;
    margin-left: 2px;
}
/* Bottom right image */
.media-gallery__item[style^="inset: 2px auto auto 2px"] {
    margin-top: 2px;
    margin-left: 2px;
}
/* Reset for full height items (2-up, 3-up left) */
.media-gallery__item[style$="width: 50%; height: 100%;"] {
    inset: 0 !important;
    width: calc(50% - 2px) !important;
}
/* Reset for half height items (3-up right, 4-up) */
.media-gallery__item[style$="width: 50%; height: 50%;"] {
    inset: 0 !important;
    width: calc(50% - 2px) !important;
    height: calc(50% - 2px) !important;
}
/* Add red border-bottom to media without description */
.media-gallery__gifv:has(> video:not([title]), > video[title=""]),
.media-gallery__item-thumbnail:has(> img:not([alt]), > img[alt=""]),
.video-player:has(> video:not([title]), > video[title=""]),
.audio-player:has(> .audio-player__canvas:not([title]), > .audio-player__canvas[title=""]) {
    border-bottom: 8px solid red;
    box-sizing: border-box;
}

/* Increase line height for detailed status */
.detailed-status .status__content {
  line-height: 1.4 !important;
}

/* Improve CW button and relationship tag */
.relationship-tag {
  padding: 4px 10px;
}
.app-body.theme-default .relationship-tag {
  margin-top: 2px;
  filter: drop-shadow(0 0 2px #ccc);
}
.relationship-tag,
.status__content__spoiler-link {
  border-radius: 5px;
}
.relationship-tag > span,
.status__content__spoiler-link > span {
  position: relative;
  top: 0.5px;
}

/* Make column background a bit darker */
.app-body.theme-default .scrollable {
  background-color: #20232c;
}
.app-body.theme-default ::webkit-scrollbar-thumb {
  background-color: #313543;
}
.app-body.theme-default ::webkit-scrollbar-track {
  background-color: #272a35;
}

/* Give hashtag links etc the same color as normal links */
.app-body.theme-default .status__content a.status-link.unhandled-link,
.app-body.theme-default .status__content a.status-link.hashtag:hover,
.app-body.theme-default .status__content a.status-link.mention:hover {
  color: #8c8dff;
}

/* Reduce vertical margin of paragraphs in statuses */
.reply-indicator__content p, .status__content p {
    margin-bottom: 8px;
}

/* Improve layout of number of toots/follower counts, profile header */
/*
.account__header__extra__links {
    display: flex;
    justify-content: center;
    gap: 15px;
    margin: 0 -20px;
}
.account__header__extra__links > a {
    padding: 0;
}
*/

/* Notifications: Tighten vertical space, remove avatar and user name */
:is(.notification-favourite, .notification-reblog) .status__info {
    margin-bottom: 2px;
}
:is(.notification-favourite, .notification-reblog) .attachment-list.compact {
    margin-top: 2px;
}
:is(.notification-favourite, .notification-reblog) .status__avatar {
    display: none;
}
:is(.notification-favourite, .notification-reblog) .display-name__html {
    display: none;
}
:is(.notification-favourite, .notification-reblog) .status__relative-time {
    height: auto;
}
.status__content--with-action.status__content--with-spoiler > p {
    margin-bottom: 8px;
}
.status {
  padding: 16px 16px 8px;
}
.status__action-bar {
  margin-top: 10px;
}

/* Give direct messages a slight blue tint */
.status-direct,
.detailed-status-direct,
.detailed-status__wrapper:has(.detailed-status-direct) .detailed-status__action-bar,
.notification:has(.status-direct) .notification__message,
.notification:has(.detailed-status-direct) .notification__message {
  background: rgba(99, 100, 246, 0.1);
}

/* Hide blurred registration form when logged in/instance closed */
.simple_form__overlay-area__blurred form {
  opacity: 0;
}
.simple_form__overlay-area__overlay {
  background: rgba(40,44,55,0.9);
}

/* Make text bigger in admin tables */
.batch-table__body {
  font-size: 16px;
  line-height: 1.6;
}
.batch-table__row__content {
  padding-top: 15px;
  padding-bottom: 15px;
}

/* Some improved styles for the about page/rules */
/* (might be outdated, not sure) */
.table-of-contents li a {
  white-space: initial;
  overflow: initial;
  line-height: 1.5;
}
.table-of-contents li li a {
  font-weight: 400;
  padding-right: 25px;
}
h2#unavailable-content ~ table tr {
  border: none;
  line-height: 1;
}
h2#unavailable-content ~ table thead,
h2#unavailable-content ~ table tr td:nth-child(2) {
  display: none;
}
h2#unavailable-content ~ table tr td:nth-child(1) span {
  white-space: initial;
  overflow: initial;
  text-overflow: initial;
}
.contact-widget > a {
  display: block;
}

.user-role-1 {
  --user-role-accent: #14e136;
  --user-role-background: #14e13619;
  --user-role-border: #14e13680;
}

.user-role-2 {
  --user-role-accent: #ff8800;
  --user-role-background: #ff880019;
  --user-role-border: #ff880080;
}