/* iv.org dark compatible Mastodon CSS
   Goal: keep Mastodon light or dark surfaces, but use iv green and monospace.
   Affects web UI visitors and logged-in users on this instance.
*/

:root {
  --iv-green: rgb(32, 146, 4);
  --iv-green-soft: rgba(32, 146, 4, 0.75);
}

/* Global monospace everywhere */
html, body, .app-body, .layout, .ui,
input, textarea, select, button {
  font-family: "Courier New", Courier, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace !important;
}

/* Links */
a, a:visited, .link-button, .status__content a {
  color: var(--iv-green) !important;
  text-decoration: underline !important;
}
a:hover, .link-button:hover, .status__content a:hover {
  text-decoration: none !important;
}

/* Borders and dividers, without changing panel backgrounds */
.column, .drawer, .box, .detailed-status, .status, .notification,
.account__section-headline, .tabs-bar, .server-banner, .landing-page__panel {
  border-color: rgba(32, 146, 4, 0.55) !important;
}

hr, .divider, .column-divider, .status__separator {
  border-color: rgba(32, 146, 4, 0.55) !important;
}

/* Inputs, keep background but brand the border and text */
input, textarea, select, .react-select__control, .search__input, .compose-form__textarea {
  border: 1px solid rgba(32, 146, 4, 0.65) !important;
  box-shadow: none !important;
  color: var(--iv-green) !important;
}

/* Buttons, keep background but brand border and text, invert on hover */
button, .button, .button.button-secondary, .button.alternative,
.compose-form__publish-button-wrapper .button, .icon-button,
.tabs-bar__link, .pillbar__link {
  border: 1px solid rgba(32, 146, 4, 0.85) !important;
  color: var(--iv-green) !important;
  box-shadow: none !important;
}

button:hover, .button:hover, .icon-button:hover, .tabs-bar__link:hover, .pillbar__link:hover {
  background: var(--iv-green) !important;
  border-color: var(--iv-green) !important;
  color: #ffffff !important;
}

/* Focus states */
button:focus, .button:focus, a:focus, input:focus, textarea:focus, select:focus {
  outline: 2px solid var(--iv-green) !important;
  outline-offset: 2px !important;
}

/* Muted text, keep readable but brand tinted */
.muted, .status__relative-time, .display-name__account, .empty-column-indicator,
.status__prepend, .status__info, .about__meta, .announcements__item__date {
  color: var(--iv-green-soft) !important;
}

/* Code blocks */
pre, code, .formatted-content code, .formatted-content pre {
  font-family: "Courier New", Courier, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace !important;
  border: 1px solid rgba(32, 146, 4, 0.55) !important;
  color: var(--iv-green) !important;
}

/* Icons follow text color */
svg, .icon, .icon-button > svg {
  fill: currentColor !important;
}