/* GLOBAL STYLING - Updated for Mastodon 4.5.0 */

:root {
    --custom-bg-dark: #191B22;
    --custom-bg-medium: #282C37;
    --custom-bg-bright: #313543;
    --custom-bg-accent: #393F4F;
    
    --custom-fg-dark: #606885;
    --custom-fg-medium: #9CA6C9;
    --custom-fg-bright: #D9DCE8;
    
    /* Override Mastodon 4.5.0 variables */
    --color-background: var(--custom-bg-dark);
    --color-background-1: var(--custom-bg-dark);
    --color-background-2: var(--custom-bg-medium);
    --color-background-3: var(--custom-bg-bright);
    --color-background-4: var(--custom-bg-accent);
    --color-surface: var(--custom-bg-medium);
    --color-surface-1: var(--custom-bg-bright);
    --color-surface-2: var(--custom-bg-accent);
    --color-surface-3: var(--custom-bg-accent);
    --color-surface-4: var(--custom-bg-bright);
    --color-surface-variant: var(--custom-bg-bright);
    --color-primary-text: var(--custom-fg-bright);
    --color-secondary-text: var(--custom-fg-medium);
    --color-tertiary-text: var(--custom-fg-dark);
    --color-border: var(--custom-bg-accent);
    
    /* Legacy variables for compatibility */
    --background-color: var(--custom-bg-medium);
    --background-border-color: var(--custom-bg-accent);
    --on-surface-color: var(--custom-bg-bright);
    --dropdown-border-color: var(--custom-bg-accent);
    --dropdown-background-color: var(--custom-bg-medium);
}

/* Body and main wrapper */
body, 
.tabs-bar__wrapper,
.ui,
.ui__header {
    background: var(--custom-bg-dark) !important;
}

body {
    scrollbar-color: var(--custom-fg-dark) var(--custom-bg-accent);
}

/* Column layout and spacing - WORKING HORIZONTAL SCROLL FIX */
body.layout-multiple-columns .columns-area {
    display: flex;
    justify-content: flex-start; /* Start from left edge */
    gap: 10px;
    padding: 10px;
    background: var(--custom-bg-dark) !important;
    overflow-x: auto !important; /* Enable horizontal scrolling */
    overflow-y: hidden;
    min-width: 0; /* Firefox flexbox fix */
    width: 100%;
    box-sizing: border-box;
}

/* Main column styling - Fixed width for predictable scrolling */
body.layout-multiple-columns .columns-area .column,
body.layout-multiple-columns .columns-area .drawer {
    min-width: 350px !important;
    width: 350px !important;
    max-width: 350px !important;
    flex: 0 0 350px !important; /* No grow, no shrink, fixed basis */
    border: 1px solid var(--custom-bg-accent) !important;
    border-radius: 8px;
    background: var(--custom-bg-medium) !important;
    margin: 0;
    position: relative;
}

/* Fix for notifications column specifically */
body.layout-multiple-columns .columns-area .column-notifications {
    min-width: 350px !important;
    width: 350px !important;
    max-width: 350px !important;
    flex: 0 0 350px !important;
}

/* Ensure columns container can expand */
body.layout-multiple-columns .columns-area__panels {
    display: flex;
    flex-wrap: nowrap !important;
    min-width: min-content !important;
}

/* Firefox-specific fixes */
@-moz-document url-prefix() {
    body.layout-multiple-columns .columns-area {
        scrollbar-width: thin;
        scrollbar-color: var(--custom-fg-dark) var(--custom-bg-accent);
    }
}

/* Webkit browsers scrollbar styling */
body.layout-multiple-columns .columns-area::-webkit-scrollbar {
    height: 12px;
}

body.layout-multiple-columns .columns-area::-webkit-scrollbar-track {
    background: var(--custom-bg-accent);
}

body.layout-multiple-columns .columns-area::-webkit-scrollbar-thumb {
    background: var(--custom-fg-dark);
    border-radius: 6px;
}

/* Fix for notifications column specifically */
body.layout-multiple-columns .columns-area .column-notifications {
    min-width: 335px !important;
    width: 25vw !important;
    max-width: 400px !important;
    flex: 1 1 25vw !important;
}

/* Ensure scrollable areas work properly */
.scrollable {
    overflow-y: scroll !important; /* Explicitly set scroll */
    overflow-x: hidden !important;
    background: var(--custom-bg-medium) !important;
    border: none !important;
}

/* Column scrollable specific - ensure it can scroll */
.column > .scrollable {
    overflow-y: scroll !important; /* Force scrolling to work */
    overflow-x: hidden !important;
    background: var(--custom-bg-medium) !important;
    border: none !important;
    position: relative !important; /* Ensure proper positioning */
}

.column-header__collapsible,
.column-header__collapsible-inner {
    background: var(--custom-bg-medium) !important;
    border: none !important;
}

/* Ensure column headers fit within rounded borders */
.column-header {
    border-radius: 8px 8px 0 0 !important;
    border: none !important;
    position: relative !important;
    z-index: 2; /* Ensure header stays on top */
}

/* Notification filters */
.notification__filter-bar,
.column-header__notif-cleaning-buttons {
    background: var(--custom-bg-medium) !important;
    border-left: none !important;
    border-right: none !important;
}

/* Headers - Updated for 4.5.0 */
.column-header,
.column-header__wrapper,
.drawer__header,
.drawer__pager,
.drawer__inner,
.drawer__inner__mastodon,
.column-subheading,
.column-header__buttons,
.column-back-button,
.column-header__back-button {
    background: var(--custom-bg-bright) !important;
    border: none !important;
}

/* Status cards and toots */
.status,
.status__wrapper,
.detailed-status,
.detailed-status__wrapper,
.conversation,
.account-card,
.notification {
    background: var(--custom-bg-medium) !important;
}

/* Add subtle separation between posts */
.status,
.notification {
    border-bottom: 1px solid var(--custom-bg-accent) !important;
}

.status__content,
.reply-indicator__content,
.account__header__bio {
    color: var(--custom-fg-bright) !important;
}

/* Text fields and compose area */
.compose-form__highlightable,
.autosuggest-textarea__textarea,
.compose-form .spoiler-input__input,
.search__input,
.search__popout,
.autosuggest-textarea,
.autosuggest-input {
    background: var(--custom-bg-medium) !important;
    border: none !important;
    color: var(--custom-fg-bright) !important;
}

/* Search bar specific */
.search__input:focus,
.search__input {
    background: var(--custom-bg-medium) !important;
    color: var(--custom-fg-bright) !important;
}

/* Emoji search */
.emoji-mart-search input {
    background: var(--custom-bg-bright) !important;
    color: var(--custom-fg-medium) !important;
}

/* Hashtags */
.hashtag-bar a {
    background: var(--custom-bg-bright) !important;
}

.hashtag-bar a:hover {
    background: var(--custom-bg-accent) !important;
}

/* Text colors - Foreground dark */
.link-footer p,
.link-footer p a,
.trends__item__name,
.notification-ungrouped__header,
.notification-group__embedded-status__account,
.status__relative-time,
.status__display-name,
.icon-button,
.status__prepend,
.load-more,
.timeline-hint,
.detailed-status__meta,
.relative-timestamp {
    color: var(--custom-fg-dark) !important;
}

/* Text colors - Foreground medium */
.notification-group__main__header__label,
.notification-group__embedded-status__content,
.column-subheading,
.drawer__tab,
.column-header__button,
.account .account__display-name,
.notification-group__embedded-status__account bdi,
.getting-started__trends a,
.getting-started__trends h4 a,
.notification__filter-bar button:not(.active),
.hashtag-bar,
.status-card,
.search__input,
.character-counter,
.detailed-status__display-name,
.search__icon .icon,
.search__popout h4,
.search__popout__menu__item,
.search__popout .icon-button,
.emoji-mart-search input,
.emoji-mart-anchor,
.display-name__account {
    color: var(--custom-fg-medium) !important;
}

/* Text colors - Foreground bright */
.column-link,
.status__content a,
.content-warning,
.display-name__html,
.account__display-name strong {
    color: var(--custom-fg-bright) !important;
}

/* Links in content */
.status__content a,
.account__header__bio a {
    color: var(--custom-fg-bright) !important;
    text-decoration: underline;
}

/* De-annoyify content warnings */
.spoiler-input__border, 
.content-warning::before, 
.content-warning::after {
    display: none;
}

.content-warning {
    border: 1px solid var(--custom-bg-accent) !important;
    border-radius: 4px !important;
    background: var(--custom-bg-bright) !important;
}

.content-warning > .link-button > span {
    display: none;
}

.content-warning > .link-button::after {
    content: "Show post";
}

.content-warning:has(+ .status__content) > .link-button::after {
    content: "Hide post";
}

/* Toot box size */
.compose-form .autosuggest-textarea__textarea {
    min-height: 240px !important;
}

/* Compose form */
.compose-form__highlightable {
    border: 0;
    background: 0;
}

.compose-form .autosuggest-textarea__textarea,
.compose-form .spoiler-input__input {
    border: 1px solid var(--custom-bg-accent) !important;
    border-radius: 4px;
}

.compose-form__footer {
    display: grid;
    grid-template-areas:
        "buttons buttons"
        "dropdowns submit";
    padding: 0;
}

.compose-form__buttons {
    grid-area: buttons;
}

.compose-form__dropdowns {
    grid-area: dropdowns;
}

.compose-form__submit {
    grid-area: submit;
}

.compose-form__actions {
    display: contents;
}

.compose-form__uploads {
    padding: 0;
}

.compose-form .spoiler-input__input {
    border-radius: 4px 4px 0 0;
}

.compose-form .spoiler-input + .autosuggest-textarea .autosuggest-textarea__textarea {
    border-radius: 0 0 4px 4px;
    border-top: 0;
}

.compose-form .spoiler-input .autosuggest-input {
    border-bottom: 0;
}

.compose-form__poll .poll__option {
    padding: 0;
}

.emoji-picker-dropdown__menu {
    margin-left: 5px;
}

/* Compose button */
.compose-form__actions .button {
    font-size: 0;
}

.compose-form__actions .button::after {
    font-size: 14px;
    content: 'Chuff!';
}

/* Emoji sizing */
.emoji {
    font-size: 1.5em;
    width: auto;
    height: auto;
}

/* Trends and sidebar */
.getting-started__trends,
.search-results__section,
.account__section-headline {
    background: var(--custom-bg-medium) !important;
    border: none !important;
}

/* Column back button */
.column-back-button,
.column-header__back-button {
    background: var(--custom-bg-bright) !important;
    color: var(--custom-fg-medium) !important;
}
/* Make all active compose form buttons more visible */
.compose-form__buttons .icon-button.active,
.compose-form__buttons .icon-button.active .icon,
.icon-button.active,
.icon-button.active .icon {
    color: var(--custom-fg-bright) !important;
    background: var(--custom-bg-accent) !important;
}

.compose-form__buttons .icon-button.active svg,
.icon-button.active svg {
    fill: var(--custom-fg-bright) !important;
}
/* Action bar buttons - better contrast */
.detailed-status__action-bar .icon-button,
.status__action-bar .icon-button {
    color: var(--custom-fg-medium) !important;
}

.detailed-status__action-bar .icon-button:hover,
.status__action-bar .icon-button:hover {
    color: var(--custom-fg-bright) !important;
}

/* Reply button - Blue (brighter for better visibility) */
.detailed-status__action-bar .icon-button[aria-label*="eply"],
.status__action-bar .icon-button[aria-label*="eply"] {
    color: #5A7FA8 !important;
}

.detailed-status__action-bar .icon-button[aria-label*="eply"] svg,
.status__action-bar .icon-button[aria-label*="eply"] svg {
    fill: #5A7FA8 !important;
}

.detailed-status__action-bar .icon-button.active[aria-label*="eply"],
.status__action-bar .icon-button.active[aria-label*="eply"] {
    color: #4A9EFF !important;
}

.detailed-status__action-bar .icon-button.active[aria-label*="eply"] svg,
.status__action-bar .icon-button.active[aria-label*="eply"] svg {
    fill: #4A9EFF !important;
}
/* Bookmark button - More red to differentiate from timestamps */
.detailed-status__action-bar .icon-button[aria-label*="ookmark"],
.status__action-bar .icon-button[aria-label*="ookmark"] {
    color: #A85A4A !important;
}

.detailed-status__action-bar .icon-button[aria-label*="ookmark"] svg,
.status__action-bar .icon-button[aria-label*="ookmark"] svg {
    fill: #A85A4A !important;
}

.detailed-status__action-bar .icon-button.active[aria-label*="ookmark"],
.status__action-bar .icon-button.active[aria-label*="ookmark"] {
    color: #E67A5A !important;
}

.detailed-status__action-bar .icon-button.active[aria-label*="ookmark"] svg,
.status__action-bar .icon-button.active[aria-label*="ookmark"] svg {
    fill: #E67A5A !important;
}

/* Star/Favorite button - Dull yellow inactive, BRIGHT YELLOW when favorited */
.detailed-status__action-bar .icon-button.star-icon,
.status__action-bar .icon-button.star-icon,
.detailed-status__action-bar .icon-button[aria-label*="avorite"]:not(.active),
.status__action-bar .icon-button[aria-label*="avorite"]:not(.active) {
    color: #9A8B3A !important;
    background: transparent !important;
}

.detailed-status__action-bar .icon-button.star-icon svg,
.status__action-bar .icon-button.star-icon svg,
.detailed-status__action-bar .icon-button[aria-label*="avorite"]:not(.active) svg,
.status__action-bar .icon-button[aria-label*="avorite"]:not(.active) svg {
    fill: #9A8B3A !important;
    stroke: none !important;
}

/* BRIGHT YELLOW when active/favorited - NO BACKGROUND COLOR CHANGE */
.detailed-status__action-bar .icon-button.star-icon.active,
.status__action-bar .icon-button.star-icon.active,
.detailed-status__action-bar .icon-button.active[aria-label*="avorite"],
.status__action-bar .icon-button.active[aria-label*="avorite"],
.icon-button.star-icon.active,
.icon-button[aria-label*="avorite"].active {
    color: #FFD700 !important;
    background: transparent !important;
    background-color: transparent !important;
}

.detailed-status__action-bar .icon-button.star-icon.active:hover,
.status__action-bar .icon-button.star-icon.active:hover,
.detailed-status__action-bar .icon-button.active[aria-label*="avorite"]:hover,
.status__action-bar .icon-button.active[aria-label*="avorite"]:hover {
    background: transparent !important;
    background-color: transparent !important;
}

.detailed-status__action-bar .icon-button.star-icon.active svg,
.status__action-bar .icon-button.star-icon.active svg,
.detailed-status__action-bar .icon-button.active[aria-label*="avorite"] svg,
.status__action-bar .icon-button.active[aria-label*="avorite"] svg {
    fill: #FFD700 !important;
    stroke: none !important;
}

/* Force the star icon path to be filled, not stroked */
.icon-button.star-icon svg path,
.icon-button[aria-label*="avorite"] svg path {
    stroke: none !important;
}

.icon-button.star-icon.active svg path,
.icon-button.active[aria-label*="avorite"] svg path {
    fill: #FFD700 !important;
    stroke: none !important;
}
/* Boost button in action bar - bright green when YOU boost it - FORCE IT */
.status__action-bar .icon-button.active[aria-label*="oost"],
.detailed-status__action-bar .icon-button.active[aria-label*="oost"] {
    color: #17C37B !important;
}

.status__action-bar .icon-button.active[aria-label*="oost"] svg,
.detailed-status__action-bar .icon-button.active[aria-label*="oost"] svg {
    fill: #17C37B !important;
}

.status__action-bar .icon-button.active[aria-label*="oost"] svg path,
.detailed-status__action-bar .icon-button.active[aria-label*="oost"] svg path {
    fill: #17C37B !important;
}

/* Inactive boost button */
.status__action-bar .icon-button[aria-label*="oost"]:not(.active),
.detailed-status__action-bar .icon-button[aria-label*="oost"]:not(.active) {
    color: #5A7F5A !important;
}

.status__action-bar .icon-button[aria-label*="oost"]:not(.active) svg,
.detailed-status__action-bar .icon-button[aria-label*="oost"]:not(.active) svg {
    fill: #5A7F5A !important;
}

.status__action-bar .icon-button[aria-label*="oost"]:not(.active) svg path,
.detailed-status__action-bar .icon-button[aria-label*="oost"]:not(.active) svg path {
    fill: #5A7F5A !important;
}
/* Boosted notification styling */
.status__prepend,
.status__prepend .icon-button {
    color: #7AB8B8 !important;
}

.status__prepend .icon-button svg {
    fill: #7AB8B8 !important;
}

/* Boosted username - tamer orange to match theme */
.status__prepend a.status__display-name.muted bdi,
.status__prepend a.status__display-name.muted span {
    color: #B87A4A !important;
}
/* Change Mastodon's purple/blue accent colors to Classic Tiger Orange */
:root {
    --color-brand-500: #E67E22; /* Burnt orange */
    --color-brand-400: #F39C46; /* Lighter orange */
    --color-brand-600: #CA6D1F; /* Darker orange */
}
/* Chuff button and primary buttons - muted orange */
.button,
.button.button-secondary,
.compose-form__actions .button {
    background-color: #B87A4A !important;  /* Muted burnt sienna */
    border-color: #B87A4A !important;
}

.button:hover,
.compose-form__actions .button:hover {
    background-color: #D4916A !important;  /* Lighter on hover */
    border-color: #D4916A !important;
}

.button:active,
.compose-form__actions .button:active {
    background-color: #9A6A4A !important;  /* Darker when clicked */
}

/* Privacy and language dropdown buttons - INCLUDING BORDERS */
.dropdown-button,
.dropdown-button__label,
span.dropdown-button__label {
    color: #B87A4A !important;  /* Muted burnt sienna */
    border-color: #B87A4A !important;
}

.dropdown-button:hover,
.dropdown-button:hover .dropdown-button__label {
    color: #D4916A !important;  /* Slightly brighter on hover */
    border-color: #D4916A !important;
}
/* Home icon */
.column-link.active {
    color: var(--color-brand-500) !important;
}

.column-link.active .icon {
    color: var(--color-brand-500) !important;
}
/* Notification tabs - active underline with muted orange */
.notification__filter-bar button.active {
    border-bottom: 3px solid #B87A4A !important;  /* Same muted orange as dropdowns */
    color: var(--custom-fg-bright) !important;
}

.column-header__wrapper .notification__filter-bar button.active {
    border-bottom: 3px solid #B87A4A !important;
}

/* Override any pseudo-elements that might be creating the underline */
.notification__filter-bar button.active::after,
.notification__filter-bar button.active::before {
    background-color: #B87A4A !important;
    border-color: #B87A4A !important;
}
/* Show/Hide post links - muted orange to match theme */
.content-warning button.link-button,
.notification-group__embedded-status button.link-button,
.status__content button.link-button,
button.link-button {
    color: #B87A4A !important;  /* Same muted orange as dropdowns */
}

.content-warning button.link-button:hover,
.notification-group__embedded-status button.link-button:hover,
.status__content button.link-button:hover,
button.link-button:hover {
    color: #D4916A !important;  /* Slightly brighter on hover */
}
/* Trending sparkline graphs - tiger orange - ULTRA SPECIFIC */
.trends__item__sparkline svg path {
    stroke: var(--color-brand-500) !important;
}

.trends__item__sparkline path:first-child {
    fill: var(--color-brand-500) !important;
    fill-opacity: 0.25 !important;
}

.trends__item__sparkline path:last-child {
    stroke: var(--color-brand-500) !important;
    fill: none !important;
}
/* Username and post times - subtle off-white orange */
.display-name__account {
    color: #B8B0A8 !important; /* Lighter grey with subtle warmth */
}

.status__relative-time,
.detailed-status__datetime,
.notification__relative_time {
    color: #A8B2C9 !important; /* Light grey - visible but not distracting */
}

/* Fix login button text color */
.button.button-tertiary,
.button.button-secondary,
.landing .button,
.simple_form .button,
.landing-page__forms .button {
    color: white !important;
}

/* Ensure all button text stays white, not blue */
.button a,
.button span,
a.button,
a.button:visited {
    color: white !important;
}
/* Universal scrollbar styling for Webkit browsers (Chrome, Safari, Edge) */
::-webkit-scrollbar {
    width: 12px;  /* Vertical scrollbar */
    height: 12px; /* Horizontal scrollbar */
}

::-webkit-scrollbar-track {
    background: var(--custom-bg-accent);  /* Dark background */
}

::-webkit-scrollbar-thumb {
    background: #B87A4A;  /* Muted orange thumb */
    border-radius: 6px;
}

::-webkit-scrollbar-thumb:hover {
    background: #D4916A;  /* Lighter orange on hover */
}

/* Firefox scrollbar styling */
* {
    scrollbar-width: thin;
    scrollbar-color: #B87A4A var(--custom-bg-accent);
}

/* Firefox specific - ensure it applies everywhere */
body,
.scrollable,
.column,
body.layout-multiple-columns .columns-area {
    scrollbar-width: thin;
    scrollbar-color: #B87A4A var(--custom-bg-accent);
}

/* Column header button icons - burnt sienna */
.column-header__button,
.column-header__button svg,
.column-header__button .fa,
.column-header__icon,
.column-header__icon svg {
    color: #B87A4A !important;
    fill: #B87A4A !important;
}

.column-header__button:hover,
.column-header__button:hover svg {
    color: #D4916A !important;
    fill: #D4916A !important;
}

/* Keep column header text unchanged */
.column-header__button span,
.column-header__buttons .column-header__button span {
    color: var(--custom-fg-medium) !important;
}

/* Left drawer tab icons - burnt sienna */
.drawer__tab,
.drawer__tab .icon,
.drawer__tab svg,
.drawer__tab svg path {
    color: #B87A4A !important;
    fill: #B87A4A !important;
}

.drawer__tab:hover,
.drawer__tab:hover .icon,
.drawer__tab:hover svg {
    color: #D4916A !important;
    fill: #D4916A !important;
}

/* Active drawer tab */
.drawer__tab.active,
.drawer__tab.active .icon,
.drawer__tab.active svg {
    color: #D4916A !important;
    fill: #D4916A !important;
}
/* Navigation panel icons only - burnt sienna */
.navigation-panel .column-link .icon,
.navigation-panel .column-link svg,
.navigation-panel__menu .column-link .icon,
.navigation-panel__menu .column-link svg {
    color: #B87A4A !important;
    fill: #B87A4A !important;
}

.navigation-panel .column-link:hover .icon,
.navigation-panel .column-link:hover svg {
    color: #D4916A !important;
    fill: #D4916A !important;
}

/* Keep the text color unchanged */
.navigation-panel .column-link,
.navigation-panel .column-link span {
    color: var(--custom-fg-medium) !important;
}

/* Active link icon */
.navigation-panel .column-link.active .icon,
.navigation-panel .column-link.active svg {
    color: #D4916A !important;
    fill: #D4916A !important;
}
/* Force color on Mastodon elephant logo */
.navigation-panel__logo .logo {
    color: #D9DCE8 !important;
    fill: #D9DCE8 !important;
}

.navigation-panel__logo svg.logo {
    color: #D9DCE8 !important;
    fill: #D9DCE8 !important;
}
/* Profile page server badge - white text with orange background */
.account__domain-pill,
button.account__domain-pill {
    background: #B87A4A !important;
    color: white !important;
    border-color: #B87A4A !important;
}

.account__domain-pill.active,
button.account__domain-pill.active {
    background: #B87A4A !important;
    color: white !important;
}

.account__domain-pill:hover,
button.account__domain-pill:hover {
    background: #D4916A !important;
    border-color: #D4916A !important;
}

/* Profile notification bell and menu icons - burnt sienna */
.account__header__bar .icon-button,
.account__header__extra .icon-button {
    color: #B87A4A !important;
}

.account__header__bar .icon-button svg,
.account__header__extra .icon-button svg {
    fill: #B87A4A !important;
}

.account__header__bar .icon-button:hover,
.account__header__extra .icon-button:hover {
    color: #D4916A !important;
}

.account__header__bar .icon-button:hover svg,
.account__header__extra .icon-button:hover svg {
    fill: #D4916A !important;
}
/* Owner badge - match outline style like privacy dropdown */
.account-role,
.account__header__badges .account-role {
    background: transparent !important;
    border: 1px solid #B87A4A !important;
    color: #B87A4A !important;
}

.account-role__domain,
span.account-role__domain {
    color: #B87A4A !important;
}

.account-role:hover {
    background: transparent !important;
    border-color: #D4916A !important;
    color: #D4916A !important;
}

.account-role:hover .account-role__domain {
    color: #D4916A !important;
}
/* Profile fields table styling */
.account__header__fields,
.account__header__fields dl {
    border-color: #B87A4A !important;
}

.account__header__fields dt,
.account__header__fields dd {
    background: var(--custom-bg-medium) !important;
    border-color: #B87A4A !important;
    color: var(--custom-fg-medium) !important;
}

/* Field labels (JOINED, SPECIES, etc.) */
.account__header__fields dt {
    color: #B87A4A !important;
}

/* Field values */
.account__header__fields dd {
    color: var(--custom-fg-bright) !important;
}

/* Links in fields (like your Telegram link) */
.account__header__fields dd a {
    color: #B87A4A !important;
}

.account__header__fields dd a:hover {
    color: #D4916A !important;
    text-decoration: underline;
}
/* Profile page tabs - active underline burnt sienna - FORCE IT */
.account__section-headline a.active::before,
.account__section-headline button.active::before {
    border-bottom: 2px solid #B87A4A !important;
    background-color: #B87A4A !important;
}

/* Alternative - target the actual underline element */
.account__section-headline a.active,
.account__section-headline button.active {
    border-bottom: 2px solid #B87A4A !important;
}

/* Nuclear option - override any blue underlines */
.account__section-headline a[class*="active"]::before,
.account__section-headline a[class*="active"]::after {
    background: #B87A4A !important;
    border-color: #B87A4A !important;
}

