/* ============================================================
   ACERBO.ME — "Terminal" theme for Mastodon 4.3
   Brand: aligned with acerbo.me (near-black + terminal green)
   Applied via Admin > Appearance > Custom CSS (reversible).
   Previous theme backed up: /home/mastodon/custom_css_backup_20260810.css
   ============================================================ */

:root {
  /* --- Brand accent: terminal green --- */
  --acerbo: #7fff7f;
  --acerbo-bright: #a3ffa3;
  --acerbo-dim: #5ce65c;
  --acerbo-ink: #0a0f0a; /* text on green */
  --acerbo-glow-border: rgba(127, 255, 127, 0.35);

  /* --- Surfaces: near-black, neutral (no blue cast) --- */
  --background-color: #0a0a0c;
  --background-color-tint: rgba(10, 10, 12, 0.9);
  --background-border-color: #232329;
  --surface-background-color: #101014;
  --surface-variant-background-color: #16161b;
  --surface-variant-active-background-color: #1d1d23;
  --on-surface-color: rgba(22, 22, 27, 0.55);
  --dropdown-background-color: rgba(16, 16, 20, 0.94);
  --dropdown-border-color: #26262c;
  --modal-background-color: rgba(10, 10, 12, 0.72);
  --modal-background-variant-color: rgba(22, 22, 27, 0.72);
  --modal-border-color: #26262c;
  --media-outline-color: rgba(255, 255, 255, 0.12);
}

/* ============ ACCENT REPLACEMENTS (blurple -> green) ============ */

/* Text links */
a,
.link-button,
.status__content a,
.reply-indicator__content a,
.account__header__content a,
.reply-indicator__content p a,
.text-btn,
.load-more,
.announcements__item__content a,
.status__content__read-more-button,
.authorize-follow .account__header__content a {
  color: var(--acerbo);
}
a:hover,
a:focus,
a:active,
.status__content a:hover,
.status__content a .mention:hover {
  color: var(--acerbo-bright);
}

/* Active icon buttons (fav menu, boosts state, etc.) */
.icon-button.active,
.icon-button.inverted.active,
.icon-button.overlayed.active,
.icon-button:hover,
.icon-button:active,
.icon-button:focus,
.text-icon-button:hover,
.notification__filter-bar button.active,
.account__action-bar__tab.active,
.detailed-status__action-bar .icon-button:hover {
  color: var(--acerbo);
}

/* Nav / column links hover state */
.column-link:hover,
.column-link:focus,
.column-link:active,
.column-subheading:hover,
.getting-started__footer a:hover,
.navigation-bar__profile-edit:hover {
  color: var(--acerbo);
}

/* Checkboxes & radios */
input[type="checkbox"],
input[type="radio"] {
  accent-color: var(--acerbo);
}

/* Focus visibility (a11y) */
a:focus-visible,
button:focus-visible,
input:focus-visible,
[tabindex]:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline-color: var(--acerbo) !important;
}

/* Search / inputs focused border */
.search__input:focus,
.search__input:active,
.setting-text:focus,
.setting-text:active,
.compose-form__highlightable textarea:focus {
  border-color: var(--acerbo-glow-border) !important;
}

/* Poll bars & trend sparklines */
.poll__chart {
  background: var(--acerbo);
}
.poll__option input[type="radio"]:checked {
  border-color: var(--acerbo);
  background: var(--acerbo);
}
.trends__item__sparkline path {
  stroke: var(--acerbo) !important;
}
.trends__item__sparkline path:last-child {
  fill: rgba(127, 255, 127, 0.18) !important;
}

/* Progress / upload indicators */
.upload-progress__bar,
.loading-bar {
  background: var(--acerbo) !important;
}

/* Unread / new badge accents */
.column-header__badge,
.notification__filter-bar .active::before {
  color: var(--acerbo);
}

/* ============ PRIMARY BUTTONS: green bg, dark ink ============ */
.button,
.button-logo,
.compose-form__publish-button,
.block-modal__action-bar .button,
.confirmation-modal__action-bar .button,
.mute-modal__action-bar .button,
.report-modal__action-bar .button,
.sign-in-banner .button,
.follow-requests-banner .button,
.public-layout .button,
.landing-page__call-to-action .button,
.rules-list button:last-child {
  background-color: var(--acerbo) !important;
  color: var(--acerbo-ink) !important;
  border-color: transparent !important;
}
.button:hover,
.button:focus,
.button:active,
.compose-form__publish-button:hover,
.public-layout .button:hover {
  background-color: var(--acerbo-bright) !important;
  color: var(--acerbo-ink) !important;
}
.button:disabled {
  background-color: #2c2c33 !important;
  color: #71717a !important;
}

/* Secondary / tertiary buttons */
.button.button-secondary,
.button.button-tertiary {
  background: transparent !important;
  border-color: var(--acerbo-dim) !important;
  color: var(--acerbo) !important;
}
.button.button-secondary:hover,
.button.button-tertiary:hover {
  background: rgba(127, 255, 127, 0.1) !important;
  color: var(--acerbo-bright) !important;
}

/* ============ SURFACES & TEXT (de-purple the neutrals) ============ */
body,
.app-body,
.ui,
.ui__header,
.columns-area,
.tabs-bar__wrapper,
.column-header,
.column-back-button,
.scrollable,
.column-subheading,
.compose-panel,
.compose-form,
.navigation-panel,
.navigation-bar,
.search__input,
.search__popout,
.drawer__header,
.drawer__inner,
.drawer__inner__mastodon,
.reply-indicator,
.account__section-headline,
.account-timeline__header,
.notification__filter-bar,
.column-inline-form,
.error-column,
.regeneration-indicator,
.public-layout .header,
.public-layout .public-account-header,
.public-layout .footer,
.landing-page__information,
.account__header__bar,
.directory__card__bar {
  border-color: var(--background-border-color) !important;
}

/* Lavender-grays -> neutral grays */
.compose-form .autosuggest-textarea__textarea,
.search__input,
.spoiler-input__input,
.account__header__tabs__name h1 small,
.status__relative-time,
.detailed-status__meta,
.account__header__bio .account__header__fields dt,
.public-account-header__tabs__name small {
  color: #b6b6bd;
}
.muted,
.status__prepend,
.notification__message,
.account__header__tabs__buttons .icon-button,
.column-subheading,
.getting-started__footer,
.public-layout .footer .grid .column-2 h4 a {
  color: #8a8a92;
}

/* ============ BRAND WORDMARK (replace Mastodon svg with text) ============ */
.ui__header__logo svg,
.ui__header__logo img {
  display: none !important;
}
.ui__header__logo .logo::after,
.ui__header__logo a::after {
  content: "ACERBO.ME";
  font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  font-weight: 700;
  font-size: 15px;
  letter-spacing: 0.14em;
  color: #f5f5f5;
  white-space: nowrap;
}
.ui__header__logo .logo::after {
  /* green terminal cursor dot */
  border-right: 0.55em solid var(--acerbo);
  padding-right: 0.15em;
}
.navigation-bar .navigation-bar__profile-account,
.compose-form__publish-button .icon {
  letter-spacing: 0.02em;
}

/* Timestamps & handles: subtle terminal mono */
.status__relative-time,
.detailed-status__datetime,
.account__header__fields dd,
.poll__footer {
  font-variant-numeric: tabular-nums;
}

/* ============ PUBLIC PAGES (about / explore hero) ============ */
.public-layout .header .brand img {
  display: none;
}
.public-layout .header .brand::after {
  content: "ACERBO.ME";
  font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  font-weight: 700;
  letter-spacing: 0.14em;
  color: #f5f5f5;
}
.hero-widget__text h1,
.public-layout .public-account-header__title {
  letter-spacing: -0.01em;
}

/* Keep Mastodon attribution subtle, not removed */
.public-layout .footer {
  font-size: 13px;
}

/* ============ SIGN-IN BANNER / CTA polish ============ */
.sign-in-banner p strong,
.follow-requests-banner p strong {
  color: #f5f5f5;
}

/* ============================================================
   Media fill – simple & clean (kept from previous custom.css)
   ============================================================ */
.media-gallery__item,
.media-gallery__item-thumbnail,
.media-gallery__preview,
.attachment__image,
.video-player,
.audio-player {
  overflow: hidden !important;
}
.media-gallery__item img,
.media-gallery__item-thumbnail img,
.media-gallery__preview img,
.attachment__image img,
video {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}
.media-gallery__item {
  min-height: 180px !important;
}
/* ============ v1.1 fixes: wordmark (DOM: a.ui__header__logo is the anchor) ============ */
.ui__header__logo svg,
.ui__header__logo img {
  display: none !important;
}
.ui__header__logo::after,
.navigation-panel__logo > a::after,
.column-link--logo::after {
  content: "ACERBO.ME";
  font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  font-weight: 700;
  font-size: 15px;
  letter-spacing: 0.14em;
  color: #f5f5f5;
  white-space: nowrap;
  border-right: 0.55em solid var(--acerbo);
  padding-right: 0.15em;
}
.navigation-panel__logo svg {
  display: none !important;
}
.column-link--logo svg,
.column-link--logo i {
  display: none !important;
}

/* Secondary buttons: restore subtle dark fill (they were invisible on near-black) */
.button.button-secondary {
  background: #16161b !important;
  border-color: #2c2c33 !important;
}
.button.button-secondary:hover {
  border-color: var(--acerbo-dim) !important;
  background: rgba(127, 255, 127, 0.08) !important;
}

/* Primary buttons: bold for readability of dark ink on green */
.button,
.compose-form__publish-button,
.public-layout .button {
  font-weight: 700;
}