/* Core variables */
:root {
  /* Background colors */
  --background-color: #202025 !important;
  --background-color-tint: rgba(32, 32, 37, 0.9) !important;
  --surface-background-color: #2A2A30 !important;
  --surface-variant-background-color: #333338 !important;
  --surface-variant-active-background-color: #3F3F45 !important;
  --modal-background-color: rgba(32, 32, 37, 0.7) !important;
  --modal-background-variant-color: rgba(42, 42, 48, 0.7) !important;
  --dropdown-background-color: rgba(32, 32, 37, 0.9) !important;
  --on-surface-color: rgba(42, 42, 48, 0.5) !important;
  
  /* Border colors */
  --background-border-color: #3F3F45 !important;
  --dropdown-border-color: #3F3F45 !important;
  --modal-border-color: #3F3F45 !important;
  
  /* Accent colors from palette */
  --accent-primary-color: #D63054 !important;
  --accent-button-color: #F15039 !important;
  --accent-success-color: #F1DB00 !important;
  --accent-warning-color: #F1DB00 !important;
  --accent-error-color: #84238F !important;
  --error-background-color: #84238F !important;
  --error-active-background-color: #9A2AA6 !important;
  --on-error-color: #fff !important;
  
  /* Text colors remain white as requested */
  --text-primary-color: #fff !important;
  --text-secondary-color: #ddd9e8 !important;
  --text-tertiary-color: #9c9cc9 !important;
  --text-muted-color: #606085 !important;
}

/* Core elements styling */
body {
  background-color: #202025 !important;
  color: #fff !important;
}

/* Main layout components */
.app-holder, 
.app-holder > div, 
.columns-area, 
.ui {
  background-color: #202025 !important;
}

/* Navigation and header */
.ui__header {
  background: #202025 !important;
  border-bottom-color: #3F3F45 !important;
}

.ui__header__logo .logo {
  color: #D63054 !important;
}

.tabs-bar__wrapper {
  background: #202025 !important;
}

/* Columns and scrollable areas */
.column, 
.drawer {
  background: #202025 !important;
}

.scrollable {
  background: #202025 !important;
  border-color: #3F3F45 !important;
}

/* Status posts styling */
.status, 
.detailed-status, 
.notification-group, 
.notification-ungrouped,
.conversation {
  background: #2A2A30 !important;
  border-bottom: 1px solid #3F3F45 !important;
}

.status__wrapper, 
.status__wrapper-direct {
  border-bottom-color: #3F3F45 !important;
}

/* Status content */
.status__content, 
.reply-indicator__content,
.edit-indicator__content,
.detailed-status__content {
  color: #fff !important;
}

/* Hyperlinks - CHANGED TO BLUE for better readability */
.status__content a, 
.reply-indicator__content a, 
.edit-indicator__content a,
.detailed-status__content a,
a.mention,
a.unhandled-link {
  color: #4f77ff !important; /* Blue color for better readability */
}

/* Hashtags styling - CHANGED TO YELLOW */
.status__content .hashtag,
a.hashtag,
a[href*="hashtag"],
a[href*="tag"] {
  color: #F1DB00 !important;
}

/* Navigation sidebar */
.column-link {
  color: #fff !important;
}

.column-link:hover, 
.column-link:focus {
  background: #2A2A30 !important;
}

.column-link.active {
  color: #D63054 !important;
}

.column-link__icon, 
.column-header__icon {
  color: #D63054 !important;
}

/* Column headers */
.column-header {
  background: #202025 !important;
  border-color: #3F3F45 !important;
}

.column-header__button {
  background: transparent !important;
  color: #fff !important;
}

.column-header__button.active {
  color: #D63054 !important;
}

.column-header__collapsible {
  background: #2A2A30 !important;
  border-color: #3F3F45 !important;
}

/* POST BUTTON - TARGET SPECIFICALLY by class name */
.compose-form__submit button,
button.post-status-button,
.compose-form__publish-button-wrapper button {
  background-color: #84238F !important;
  color: #fff !important;
}

.compose-form__submit button:hover,
button.post-status-button:hover,
.compose-form__publish-button-wrapper button:hover {
  background-color: #9A2AA6 !important;
}

/* Keep the original toolbar buttons (compose-form__buttons) untouched */
.compose-form__buttons .icon-button,
.emoji-picker-dropdown button,
.compose-form__buttons button:not(.dropdown-button) {
  background: transparent !important;
  border: none !important;
}

/* Target ONLY the Public and English buttons by their dropdown-button class */
.dropdown-button,
button.dropdown-button,
.compose-form__buttons .dropdown-button {
  background-color: #202025 !important;
  color: #F1DB00 !important;
  border: 1px solid #F1DB00 !important;
}

.dropdown-button:hover,
button.dropdown-button:hover,
.compose-form__buttons .dropdown-button:hover {
  background-color: #2A2A30 !important;
}

/* Character counter styling to keep original */
.character-counter {
  color: #9c9cc9 !important;
}

.character-counter.character-counter--over {
  color: #df405a !important;
}

/* Secondary button styling */
.button.button-secondary {
  border-color: #F15039 !important;
  color: #F15039 !important;
}

.button.button-secondary:hover {
  border-color: #D63054 !important;
  color: #D63054 !important;
}

/* Toggle switches styling */
.react-toggle-track {
  background-color: #3F3F45 !important;
}

.react-toggle--checked .react-toggle-track {
  background-color: #D63054 !important;
}

.react-toggle:hover:not(.react-toggle--disabled) .react-toggle-track {
  background-color: #4a4a52 !important;
}

.react-toggle.react-toggle--checked:hover:not(.react-toggle--disabled) .react-toggle-track {
  background-color: #F15039 !important;
}

.react-toggle-thumb {
  background-color: #fff !important;
  border-color: #3F3F45 !important;
}

.react-toggle--checked .react-toggle-thumb {
  border-color: #D63054 !important;
}

/* Interactive icons */
.icon-button {
  color: #9c9cc9 !important;
}

.icon-button:hover {
  color: #ddd9e8 !important;
}

.icon-button.active {
  color: #D63054 !important;
}

.icon-button.star-icon.active {
  color: #F1DB00 !important;
}

.icon-button.bookmark-icon.active {
  color: #84238F !important;
}

/* Status interactions */
.status__action-bar button, 
.detailed-status__action-bar button {
  color: #9c9cc9 !important;
}

.status__action-bar button:hover, 
.detailed-status__action-bar button:hover {
  color: #D63054 !important;
}

/* Status timestamps */
.status__relative-time, 
.detailed-status__datetime,
.notification__relative_time {
  color: #9c9cc9 !important;
}

/* Compose form */
.compose-form {
  background: #202025 !important;
}

.compose-form__highlightable {
  background: #2A2A30 !important;
  border-color: #3F3F45 !important;
}

.compose-form__highlightable.active {
  border-color: #D63054 !important;
}

.compose-form__actions .icon-button {
  color: #D63054 !important;
}

.autosuggest-textarea__textarea, 
.spoiler-input__input {
  background: #2A2A30 !important;
  color: #fff !important;
}

/* Dropdowns */
.dropdown-menu {
  background: #2A2A30 !important;
  border-color: #3F3F45 !important;
}

.dropdown-menu__item a:hover, 
.dropdown-menu__item button:hover {
  background: #3F3F45 !important;
}

/* Cards */
.status-card, 
.card__bar {
  background: #2A2A30 !important;
  border-color: #3F3F45 !important;
}

/* Profile cards */
.account-card {
  background: #2A2A30 !important;
  border-color: #3F3F45 !important;
}

/* Media attachments */
.media-gallery, 
.audio-player, 
.video-player {
  background: #2A2A30 !important;
  border-color: #3F3F45 !important;
}

/* Poll styling */
.poll__chart {
  background: #F15039 !important;
}

.poll__chart.leading {
  background: #D63054 !important;
}

/* Form elements */
input[type=text], 
input[type=password], 
input[type=email], 
input[type=url], 
input[type=number], 
textarea, 
select {
  background: #2A2A30 !important;
  border-color: #3F3F45 !important;
  color: #fff !important;
}

/* Search elements */
.search__input {
  background: #2A2A30 !important;
  border-color: #3F3F45 !important;
  color: #fff !important;
}

.search__icon .icon {
  color: #D63054 !important;
}

/* Focus states */
.focusable:focus {
  background: rgba(214, 48, 84, 0.1) !important;
}

/* Notifications */
.notification-group--follow .notification-group__icon, 
.notification-group--follow-request .notification-group__icon {
  color: #D63054 !important;
}

.notification-group--favourite .notification-group__icon {
  color: #F1DB00 !important;
}

.notification-group--reblog .notification-group__icon {
  color: #F15039 !important;
}

/* Status actions dropdown */
.status__action-bar__dropdown {
  color: #9c9cc9 !important;
}

.status__action-bar__dropdown:hover {
  color: #D63054 !important;
}

/* Boosted status */
.status__prepend {
  color: #9c9cc9 !important;
}

.status__prepend__icon {
  color: #F15039 !important;
}

/* Navigation "Home" icon */
a[href="/"] .icon, 
a[aria-current="page"] .icon, 
.active .icon {
  color: #D63054 !important;
}

/* Right sidebar icons - targeting more specifically */
.navigation-panel .icon,
.ui__header__links .icon, 
.icon-with-badge__badge,
.column-link .icon {
  color: #D63054 !important;
}

/* Right sidebar navigation elements */
.navigation-panel__menu a,
.column-links a,
.ui__header__links a {
  color: #fff !important;
}

.navigation-panel__menu a:hover,
.column-links a:hover,
.ui__header__links a:hover {
  color: #D63054 !important;
}

/* Footer areas and links */
.link-footer,
.ui__footer,
footer {
  background: #202025 !important;
  color: #9c9cc9 !important;
}

/* Footer links styling */
.link-footer a, 
.link-footer a:visited,
.ui__footer a, 
.ui__footer a:visited,
footer a,
footer a:visited {
  color: #D63054 !important;
}

/* Specific footer links at bottom of page */
.about a, 
.invite-people a, 
.profiles-directory a, 
.privacy-policy a,
.keyboard-shortcuts a,
.view-source-code a,
.get-the-app a {
  color: #D63054 !important;
}

/* Additional footer selectors to ensure coverage */
.ohcool\\.cool a,
.picshool\\.cool a,
.mastodon a,
.directory a,
.about-link a,
.keyboard-shortcuts a,
a[href*="picshool.cool"],
a[href*="about"],
a[href*="invite"],
a[href*="profiles"],
a[href*="privacy"],
a[href*="keyboard"],
a[href*="source-code"],
a[href*="app"] {
  color: #D63054 !important;
}

/* Modals */
.modal-root__overlay {
  background: rgba(32, 32, 37, 0.7) !important;
}

.modal-root__modal {
  background: #2A2A30 !important;
  border-color: #3F3F45 !important;
}

/* Drawer elements */
.drawer__inner, 
.drawer__pager {
  background: #202025 !important;
}

/* Getting started section */
.getting-started, 
.getting-started__trends {
  background: #2A2A30 !important;
  border-color: #3F3F45 !important;
}

/* Tables and separators */
table td, 
table th {
  background: #2A2A30 !important;
  border-bottom-color: #3F3F45 !important;
}

hr {
  border-color: #3F3F45 !important;
}

/* Progress trackers and indicators */
.progress-tracker .active .circle {
  border-color: #D63054 !important;
}

.progress-tracker .completed .circle {
  background: #D63054 !important;
  border-color: #D63054 !important;
}

.progress-tracker .completed .separator {
  background: #D63054 !important;
}

/* Roles and statuses */
.account-role {
  border-color: #D63054 !important;
  color: #D63054 !important;
}

/* Hints and indicators */
.positive-hint {
  color: #F1DB00 !important;
}

.negative-hint {
  color: #84238F !important;
}

/* Special status elements */
.content-warning {
  background: rgba(214, 48, 84, 0.1) !important;
  border-color: rgba(214, 48, 84, 0.3) !important;
}

/* Emoji reactions */
.reactions-bar__item {
  background: #3F3F45 !important;
}

.reactions-bar__item.active {
  background-color: rgba(214, 48, 84, 0.3) !important;
}

/* Direct messages styling */
.notification-group--direct, 
.notification-ungrouped--direct, 
.status__wrapper-direct {
  background: rgba(214, 48, 84, 0.05) !important;
}

/* Verification indicators */
.verified-badge {
  color: #F1DB00 !important;
}

/* Time indicators */
time, .time {
  color: #9c9cc9 !important;
}

/* Specific brand elements */
.mastodon-logo, 
.logo {
  color: #D63054 !important;
}

/* Settings and preferences icons */
.icon-cog,
.preferences-icon,
.settings-icon,
.settings-panel .icon {
  color: #D63054 !important;
}

/* Post header columns */
.columns-area__panels__main {
  background: #202025 !important;
}

/* Home header and tab selectors */
h4.column-header__title {
  color: #fff !important;
}