/* Logo */
.column-link--logo:after {
    padding: 0;
    padding-inline-start: 0;
    content: 'Lein Social';
      color: var(--color-text-primary);
    Font-size: 2.3rem;
}
.logo {
 
    display: none;
}

/* improve contrast */
[data-color-scheme=dark], html:not([data-color-scheme]) {
--color-bg-primary: #00000022;
}

[data-color-scheme=light]  {
--color-bg-primary: #FFFFFFcc;
} 
[data-color-scheme=dark] ._comp_account_header__handleHelp {
background: var(--color-bg-primary);
    -webkit-backdrop-filter: blur(10px)saturate(180%)contrast(75%)brightness(70%);
    backdrop-filter: blur(10px) saturate(180%) contrast(75%) brightness(70%);
}

/* add labels to mobile nav bar */
.ui__navigation-bar__item:after {
content: attr(aria-label); 
 font-size: clamp(0.65rem, 1.3vw, 1rem);
    text-align: center;
    text-wrap: balance;
    word-wrap: break-word;
    line-height: 0.6rem;

}
.status__action-bar__button-wrapper button:after, .detailed-status__action-bar button:after
{
    content: attr(Title);
    font-size: clamp(0.5rem, 1vw, 1rem);
    text-align: center;
    text-wrap: balance;
    word-wrap: break-word;
    line-height: clamp(0.6rem, 1vw, 1rem);
}
/* Search popout */
.navigation-panel, .search__popout {
    background: var(--color-bg-primary);
    -webkit-backdrop-filter: blur(10px)saturate(180%)contrast(75%)brightness(70%);
    backdrop-filter: blur(10px) saturate(180%) contrast(75%) brightness(70%);
}

[data-color-scheme=dark] .search.active .search__popout, [data-color-scheme=dark] ._feat_account_timeline__filterOverlay
{ background-color: #000000FF;
}

[data-color-scheme=light] .search.active .search__popout, [data-color-scheme=light] ._feat_account_timeline__filterOverlay
{ background-color: #FFFFFFFF;
}


.privacy-dropdown__dropdown.bottom, .language-dropdown__dropdown.bottom, .visibility-dropdown__dropdown.bottom {
    background-color: #000000FF;
}


/* Advanced layout */
.drawer__tab:after {
content: attr(aria-label); 
 font-size: clamp(0.65rem, 1.3vw, 1rem);
    text-align: center;
    text-wrap: balance;
    word-wrap: break-word;
    line-height: 1rem;
    display: block;
}
.drawer__tab { display: block; 
}

.drawer__tab[aria-label="Live feed (local)"]:after {
    content: "Local";
}

.drawer__tab[aria-label="Live feed (public)"]:after {
    content: "Public";
}
.drawer__tab[aria-label="Preferences"]:after {
    content: "Prefs";
}



/* ==========================================================================
   Maroon accent theme for social.lein.us (written for Mastodon 4.7.4)
   Replaces Mastodon's purple/indigo accent with dark maroon (#a20026) for
   buttons, backgrounds and dark text, and #ff6b6b for light text on dark
   backgrounds. Paste at the END of the Custom CSS box, below existing rules.
   ========================================================================== */

/* 1. The indigo palette. Every accent token in light and dark mode (buttons,
      links, focus rings, tabs, toggles, badges, graphs, highlights) is built
      from these 11 values, so redefining them recolors the whole interface. */
html {
  --color-indigo-50:  #fff0f1;
  --color-indigo-100: #ffdfe2;
  --color-indigo-200: #ffbfc6;
  --color-indigo-300: #ff8f94;
  --color-indigo-400: #ff6b6b;
  --color-indigo-500: #e8344a;
  --color-indigo-600: #c4122f;
  --color-indigo-700: #a20026;   /* buttons, active states, light-mode links */
  --color-indigo-800: #82001e;   /* button hover */
  --color-indigo-900: #4d0012;
  --color-indigo-950: #2b000a;
}

/* 2. Pin the exact requested shades where the palette alone would land
      on a neighbouring step. */

/* Dark mode: light accent text on dark backgrounds */
[data-color-scheme=dark],
html:not([data-color-scheme]) {
  --color-text-brand: #ff6b6b;
  --color-text-brand-on-inverted: #a20026;   /* on light pop-ups */
}

/* Light mode: dark accent text; light text on dark pop-ups */
[data-color-scheme=light] {
  --color-text-brand: #a20026;
  --color-text-brand-on-inverted: #ff6b6b;
}

/* High-contrast setting: one step further from the background */
[data-color-scheme=dark][data-contrast=high],
[data-contrast=high] [data-color-scheme=dark],
html:not([data-color-scheme])[data-contrast=high],
[data-contrast=high] html:not([data-color-scheme]) {
  --color-text-brand: #ff8f94;
}

[data-color-scheme=light][data-contrast=high],
[data-contrast=high] [data-color-scheme=light] {
  --color-text-brand: #82001e;
}

/* 3. The year-end annual report uses hard-coded purple gradients rather than
      the palette. Same layout, maroon tones. */
._feat_annual_report_index__wrapper {
  background:
    radial-gradient(at 10% 27%, rgba(162, 0, 38, var(--gradient-strength)) 0, transparent 50%),
    radial-gradient(at 91% 10%, rgba(255, 107, 107, var(--gradient-strength)) 0, transparent 25%),
    radial-gradient(at 10% 91%, rgba(232, 52, 74, var(--gradient-strength)) 0, transparent 40%),
    radial-gradient(at 75% 87%, rgba(130, 0, 30, var(--gradient-strength)) 0, transparent 20%),
    radial-gradient(at 84% 60%, rgba(77, 0, 18, var(--gradient-strength)) 0, transparent 40%)
    var(--color-bg-primary);
}

._annual_report_announcement__wrapper {
  background:
    radial-gradient(at 40% 87%, #a2002699 0, transparent 50%),
    radial-gradient(at 19% 10%, #82001e99 0, transparent 50%),
    radial-gradient(at 90% 27%, #ff6b6b99 0, transparent 50%),
    radial-gradient(at 16% 95%, #e8344a99 0, transparent 50%)
    var(--color-bg-primary);
}

