/* --- Global Highlight Variable --- */
/* Used by newer Mastodon versions for active states and focus rings */
:root {
  --ui-highlight-color: #1a71b0; /* Kalob Blue */
}

/* --- Text Links and Active Icons --- */
a, 
.status-link, 
.column-link,
.text-icon-button.active,
.icon-button.active,
.navigation-bar__profile-edit,
.account__header__tabs__buttons .active {
  color: #1a71b0;
}

/* --- Primary Buttons --- */
/* The 'Publish', 'Follow', and 'Save' buttons */
.button {
  background-color: #1a71b0;
}

/* Button Hover and Active States (Slightly darker blue) */
.button:active, 
.button:focus, 
.button:hover {
  background-color: #115383; 
}

/* --- Custom Compose Box Logo --- */
/* Replaces the default Mastodon image with your uploaded Kalob logo */
.drawer__inner__mastodon {
  background-image: url("kalob_logo_min.png"); 
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center bottom;
}

/* Hides the default Mastodon elephant image */
.drawer__inner__mastodon img {
  display: none;
}

/* --- Compose Box Dropdowns (Privacy & Language) --- */
/* Targets the text and icons inside the dropdown buttons */
.dropdown-button,
.dropdown-button .icon,
.dropdown-button__label {
  color: #1a71b0;
}

/* --- Compose Box Action Icons (Media, Poll, CW, Emoji) --- */
/* Targets the interactive buttons below the text area */
.compose-form__buttons .icon-button.inverted,
.compose-form__buttons .icon-button {
  color: #1a71b0;
}

/* --- Hover and Active States for Compose Elements --- */
/* Slightly darker blue when clicking or hovering over the icons */
.compose-form__buttons .icon-button:hover,
.compose-form__buttons .icon-button:active,
.compose-form__buttons .icon-button:focus,
.compose-form__buttons .icon-button.active,
.dropdown-button:hover,
.dropdown-button:active,
.dropdown-button:focus {
  color: #115383;
}

/* --- Navigation Panel Active Links --- */
/* Targets the active/selected page in the right-hand navigation sidebar */
.getting-started__nav__item.active,
.navigation-panel a.active,
.column-link.active {
  color: #1a71b0;
  border-color: #1a71b0; /* Catches the left-hand border highlight if present */
}

/* Ensure the icon inside the active nav link also changes color */
.getting-started__nav__item.active .icon,
.navigation-panel a.active .icon,
.column-link.active .icon {
  color: #1a71b0;
}

/* --- Secondary Buttons (e.g., Edit Profile) --- */
.button.button-secondary {
  color: #1a71b0;
  border-color: #1a71b0;
}

.button.button-secondary:hover,
.button.button-secondary:active,
.button.button-secondary:focus {
  color: #115383;
  border-color: #115383;
}

/* --- Profile Tabs (Activity, Media, Featured) --- */
._comp_tab_list__tab.active {
  color: #1a71b0;
  border-bottom-color: #1a71b0;
}

._comp_tab_list__tab:hover,
._comp_tab_list__tab:focus {
  color: #115383;
}

/* --- Column Back Button --- */
.column-back-button {
  color: #1a71b0;
}

.column-back-button:hover,
.column-back-button:active,
.column-back-button:focus {
  color: #115383;
}

/* --- Force Override: Profile Tabs --- */
._comp_tab_list__tab.active {
  color: #1a71b0 !important;
  border-bottom-color: #1a71b0 !important;
}

._comp_tab_list__tab.active:hover,
._comp_tab_list__tab.active:focus {
  color: #115383 !important;
  border-bottom-color: #115383 !important;
}

/* --- Force Override: Compose Form Dropdown Borders --- */
.compose-form__dropdowns .dropdown-button {
  border-color: #1a71b0 !important;
}

.compose-form__dropdowns .dropdown-button:hover,
.compose-form__dropdowns .dropdown-button:active,
.compose-form__dropdowns .dropdown-button:focus {
  border-color: #115383 !important;
}

/* --- About Page Collapsible Headers --- */
.about__section__title {
  /* Uses your brand blue with 15% opacity for the background */
  background-color: rgba(26, 113, 176, 0.15) !important;
  color: #1a71b0 !important;
}

.about__section__title:hover,
.about__section__title:active,
.about__section__title:focus {
  /* Slightly darker background and text on hover */
  background-color: rgba(26, 113, 176, 0.25) !important;
  color: #115383 !important;
}

/* Ensures the chevron icon inherits the correct color */
.about__section__title .icon {
  color: inherit !important;
}