/* ==UserStyle==
@name         Strava Dark Mode
@version      v0.1.0
@namespace    github.com/macx
@description  Dark Mode for Strava on Desktop
@author       macx
@license      MIT
@homepageURL  https://github.com/macx/strava-dark-mode
@supportURL   https://github.com/macx/strava-dark-mode/issues
@updateURL    https://raw.githubusercontent.com/macx/strava-dark-mode/main/strava-dark-mode.user.css

==/UserStyle== */

@-moz-document domain("strava.com") {
  /* strava.com*/

  :root {
    --clr-bg: #121b20;
    --clr-bg--content: #253640;
    --clr-bg--content2: #1c2830;
    --clr-primary: #fc5200;
    --clr-text: #f1f7fb;
    --clr-text--light: #94a3b8;
    --clr-text--medium: #64748b;
    --clr-navigation: #2e4450;

    --clr-border: rgba(255, 255, 255, 0.2);
  }

  body {
    background-color: var(--clr-bg);
    color: var(--clr-text);
  }

  /*
  ┌──────────────────────────────────┐
    HEADER
  └──────────────────────────────────┘
  */

  #global-header,
  ._3r8IlbmQT2zCJZ1LnVpdVH {
    background-color: var(--clr-bg--content);
    border-bottom: 0;
    margin-top: 0;
    box-shadow: 0 0 1.5rem rgba(0, 0, 0, 0.5);
  }

  #global-header .nav-group .drop-down-menu .selection {
    border-left: 0;
    border-right: 0;
  }

  #global-header .nav-bar .nav-link {
    color: var(--clr-text--light);
  }

  .drop-down-menu a,
  .drop-down-menu .clickable,
  .dropdown a,
  .dropdown .clickable,
  .ActivityEntryBody--activity-entry-container--iYy-k
    .ActivityEntryBody--achievements-summary--bsU2g
    li
    strong,
  #global-header .nav-group .drop-down-menu .selection,
  .drop-down-menu .opt-group.premium a:link,
  .drop-down-menu .opt-group.premium a:visited {
    color: var(--clr-text--light);
  }

  .drop-down-menu .opt-group,
  #global-header .nav-group .drop-down-menu:hover .nav-link,
  #global-header .nav-group .drop-down-menu.active .nav-link {
    border-color: var(--clr-border);
  }

  .LocationAndTime--subtitle-wrapper--6yH0n time,
  .LocationAndTime--subtitle-wrapper--6yH0n .LocationAndTime--location--Djc4K,
  .ActivityEntryBody--activity-entry-container--iYy-k
    .ActivityEntryBody--stats--G90hq
    .ActivityEntryBody--stat-label--47Ktd,
  .ActivityEntryBody--activity-entry-container--iYy-k
    .ActivityEntryBody--achievements-summary--bsU2g
    li
    a.ActivityEntryBody--achievements-link--CZvjJ,
  .ActivityEntryBody--activity-entry-container--iYy-k
    .ActivityEntryBody--achievements-summary--bsU2g,
  .ActivityEntryBody--activity-entry-container--iYy-k
    .ActivityEntryBody--stat-subtext--Vo0Ha,
  .KudosAndComments--kudos-and-comments--RTN8b
    .KudosAndComments--count-button--L2QfK,
  .CommentsThread--comment--ryaZV time {
    color: var(--clr-text--medium);
  }

  .CommentsThread--more-comments-button--MnE\+d {
    color: var(--clr-text) !important;
  }

  #global-header .nav-bar .selected .nav-link,
  .page a:not(.btn):link,
  .page a:not(.btn):visited,
  .page .btn.btn-link:link,
  .page .btn.btn-link:visited {
    color: var(--clr-text);
  }

  .branding {
    background-position: left top;
  }

  #global-search-bar .icon-search {
    background-position: left -46px;
  }

  #global-header .nav-group .drop-down-menu:hover,
  #global-header .nav-group .drop-down-menu.active,
  #global-header .nav-group .drop-down-menu:hover .nav-link,
  #global-header .nav-group .drop-down-menu.active .nav-link,
  .drop-down-menu > ul {
    background-color: var(--clr-navigation);
  }

  .drop-down-menu > ul {
    border-color: rgba(0, 0, 0, 0.5);
  }

  .drop-down-menu .opt-group.premium {
    background-color: var(--clr-content);
  }

  /* Remove upgrade button 😧 */
  .nav-item.upgrade {
    display: none !important;
  }

  /*
  ┌──────────────────────────────────┐
    CONTENT
  └──────────────────────────────────┘
  */

  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  .h1,
  .h2,
  .h3,
  .h4,
  .h5,
  .h6 {
    color: var(--clr-text);
  }

  .stat-subtext {
    color: var(--clr-text--light);
  }

  .ActivityEntryBody--activity-entry-container--iYy-k
    .ActivityEntryBody--activity-name--AGMA5
    a.ActivityEntryBody--activity-name--AGMA5,
  .Activity--card--GP9rq a:not(.Activity--btn--0fOye):link,
  .Activity--card--GP9rq a:not(.Activity--btn--0fOye):visited,
  .Activity--card--GP9rq .Activity--btn--0fOye.Activity--btn-link--JK2Iw:link,
  .Activity--card--GP9rq
    .Activity--btn--0fOye.Activity--btn-link--JK2Iw:visited {
    color: var(--clr-text);
  }

  .CollapsibleSection--subsection--S7K8c .CollapsibleSection--dark--RJ5au,
  .ActivityEntryBody--activity-entry-container--iYy-k
    .ActivityEntryBody--stats--G90hq,
  .Stat--stat--AaawC .Stat--stat-label--RZ\+S4 {
    color: var(--clr-text--light);
  }

  .AthleteJoinEntry--entry-header--O4VRu,
  .AthleteJoinEntry--entry-body--qn4Rv {
    color: var(--clr-text--light);
  }

  .CreatePost--input-wrapper--ZR739 label,
  .Post--author-name--6nfjJ,
  .Comment--author-name--EHv8e {
    color: var(--clr-text--medium);
  }

  .card,
  .Activity--card--GP9rq,
  .GroupActivity--card--oCRxr,
  .Card--card--8qT2W,
  .AthleteJoinEntry--card---CeVY {
    background-color: var(--clr-bg--content);
    background-image: linear-gradient(
      to bottom,
      var(--clr-bg--content),
      var(--clr-bg--content2)
    );
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.5);
  }

  /* Archivements */
  .MaharajAchievementCelebration--achievement-celebration--ouMf5 {
    background-color: rgba(0, 0, 0, 0.2);
    border: 1px solid rgba(0, 0, 0, 0.3);
    border-bottom-color: var(--clr-border);
  }

  /* Avatar */
  .EntryHeader--icon-container--f6C3J {
    background-color: transparent;
  }

  .Avatar--badge--dPtDC path:first-child {
    fill: var(--clr-bg);
  }

  .AvatarGroup--avatar--8ZPsx,
  .Facepile--avatar-img--rr1lE {
    border-color: var(--clr-bg);
  }

  /* Leaderboard */
  .Leaderboard--container--PJWVx .Leaderboard--privacy-section--PTdz2,
  div[data-reach-tab-list] {
    background-color: var(--clr-bg--content);
  }

  .CategoryTabs--container--KjQZu [data-reach-tab] {
    border-color: transparent;
  }

  .CategoryTabs--container--KjQZu [data-reach-tab][data-selected] {
    border-left-color: transparent !important;
    border-right-color: transparent !important;
    border-top-color: transparent !important;
  }

  /* Comments */
  .ActionsDropdown--more-icon--7I3zP:after {
    filter: invert(1);
  }

  .CreateComment--container--cE0tC textarea,
  .CreatePost--container--TnszW textarea {
    background-color: var(--clr-bg--content);
    border-color: var(--clr-border);
    color: var(--clr-text);
  }

  .CreatePost--container--TnszW textarea:focus,
  .CreateComment--container--cE0tC textarea:focus {
    background-color: var(--clr-bg--content);
  }

  /* Lines */
  .section,
  .card .card-footer,
  .card .card-section,
  .ActivityEntryBody--activity-entry-container--iYy-k
    .ActivityEntryBody--stats--G90hq
    > li,
  .KudosAndComments--kudos-and-comments--RTN8b.KudosAndComments--hairline--n9t8k,
  .AthleteJoinEntry--media--kEDKw,
  .Show--top-row--siFxa,
  .CollapsibleSection--line--Gjb6T {
    border-color: var(--clr-border);
  }

  /* Profile */
  #header-photos ul a,
  #header-photos ul a,
  .profile-heading .avatar img {
    border-color: var(--clr-border);
  }

  .avatar-athlete img,
  .avatar-athlete .avatar-img {
    background-color: var(--clr-bg--content);
  }

  /*
  ┌──────────────────────────────────┐
    TABLES
  └──────────────────────────────────┘
  */

  .LeaderboardsTable--table-container--JxwWf
    .LeaderboardsTable--table--zBtJE
    th,
  .LeaderboardsTable--table-container--JxwWf
    .LeaderboardsTable--table--zBtJE
    tr.LeaderboardsTable--leaderboard-entry--ydqYD {
    border-color: var(--clr-border);
  }

  .Leaderboard--container--PJWVx
    .Leaderboard--avatar-and-name-container--PqA52
    .Leaderboard--details--iggfk
    .Leaderboard--name--nNWT5
    a {
    color: var(--clr-text--light);
  }

  .LeaderboardsTable--table-container--JxwWf
    .LeaderboardsTable--table--zBtJE
    tr.LeaderboardsTable--leaderboard-entry--ydqYD {
    color: var(--clr-text--medium);
  }

  /*
  ┌──────────────────────────────────┐
    SIDEBAR / CHALLENGES
  └──────────────────────────────────┘
  */

  .media .participants {
    color: var(--clr-text--medium);
  }

  /*
  ┌──────────────────────────────────┐
    MAPS
  └──────────────────────────────────┘
  */

  .PhotosAndMapImage--entry-images--M264M
    .PhotosAndMapImage--entry-image-wrapper--LaoWz {
    filter: inverse(100%);
  }

  /*
  ┌──────────────────────────────────┐
    TABS
  └──────────────────────────────────┘
  */

  /* Menu Arrows*/
  .app-icon.icon-dark {
    background-position: 0 66.66666666%;
  }

  .app-icon.icon-elliptical,
  .app-icon.icon-run,
  .app-icon.icon-run-v2,
  .app-icon.icon-run-v3,
  .app-icon.icon-soccer,
  .app-icon.icon-stairstepper,
  .app-icon.icon-virtualrun,
  .app-icon.icon-swimming,
  .app-icon.icon-swim,
  .app-icon.icon-watersport,
  .app-icon.icon-nav-training {
    filter: invert(1);
  }

  [aria-selected='true'] .app-icon {
    filter: unset;
  }

  .tabbed-cards .tabs > li.selected .tab,
  .tabbed-cards .tabs > li[aria-selected='true'] .tab {
    background-color: var(--clr-navigation);
  }

  .tab-contents,
  .tab-contents > div {
    background-color: var(--clr-navigation);
  }

  /*
  ┌──────────────────────────────────┐
    ICONS
  └──────────────────────────────────┘
  */

  #global-header #notifications #notifications-button .icon-notification {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-bell'%3E%3Cpath d='M18 8A6 6 0 0 0 6 8c0 7-3 9-3 9h18s-3-2-3-9M13.73 21a2 2 0 0 1-3.46 0'/%3E%3C/svg%3E");
  }

  .app-icon.icon-yoga {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='%23ffffff' d='M13 2a2 2 0 1 0 0 4c1.11 0 2-.89 2-2a2 2 0 0 0-2-2M4 7v2h6v6l-5.07 5.07 1.41 1.43 6.72-6.73L17 17.13V21h2v-4.43c0-.36-.18-.68-.5-.86L15 13.6V9h6V7H4Z'/%3E%3C/svg%3E") !important;
  }

  .app-icon.icon-multi {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-activity'%3E%3Cpath d='M22 12h-4l-3 9L9 3l-3 9H2'/%3E%3C/svg%3E") !important;
  }

  .app-icon.icon-walk {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='%23ffffff' d='M14.12 10H19V8.2h-3.62l-2-3.33c-.3-.5-.84-.84-1.46-.84-.18 0-.34.03-.5.08L6 5.8V11h1.8V7.33l2.11-.66L6 22h1.8l2.87-8.11L13 17v5h1.8v-6.41l-2.49-4.54.73-2.87M14 3.8c1 0 1.8-.8 1.8-1.8S15 .2 14 .2 12.2 1 12.2 2 13 3.8 14 3.8Z'/%3E%3C/svg%3E") !important;
  }

  .app-icon.icon-bike {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='%23ffffff' d='M5 20.5A3.5 3.5 0 0 1 1.5 17 3.5 3.5 0 0 1 5 13.5 3.5 3.5 0 0 1 8.5 17 3.5 3.5 0 0 1 5 20.5M5 12a5 5 0 0 0-5 5 5 5 0 0 0 5 5 5 5 0 0 0 5-5 5 5 0 0 0-5-5m9.8-2H19V8.2h-3.2l-1.94-3.27c-.29-.5-.86-.83-1.46-.83-.47 0-.9.19-1.2.5L7.5 8.29C7.19 8.6 7 9 7 9.5c0 .63.33 1.16.85 1.47L11.2 13v5H13v-6.5l-2.25-1.65 2.32-2.35m5.93 13a3.5 3.5 0 0 1-3.5-3.5 3.5 3.5 0 0 1 3.5-3.5 3.5 3.5 0 0 1 3.5 3.5 3.5 3.5 0 0 1-3.5 3.5m0-8.5a5 5 0 0 0-5 5 5 5 0 0 0 5 5 5 5 0 0 0 5-5 5 5 0 0 0-5-5m-3-7.2c1 0 1.8-.8 1.8-1.8S17 1.2 16 1.2 14.2 2 14.2 3 15 4.8 16 4.8Z'/%3E%3C/svg%3E") !important;
  }

  .Button--icon--9v0SI {
    color: var(--clr-text--light);
  }

  .ActivityEntryBody--icon-wrapper--XZ50L {
    fill: #ffffff;
  }

  .media-body .app-icon-wrapper {
    margin-right: 0.5em;
    opacity: 0.5;
  }

  /*
  ┌──────────────────────────────────┐
    BUTTONS
  └──────────────────────────────────┘
  */

  .btn-white {
    border-color: var(--clr-text--medium);
    background-color: transparent;
    color: var(--clr-text--medium);
  }

  .sidebar-footer a,
  .sidebar-footer .dropdown .btn,
  .sidebar-footer .copyright {
    color: var(--clr-text--medium);
  }

  .drop-down-menu .selection:after {
    border-top-color: var(--clr-text--medium);
    right: 7px;
  }

  .drop-down-menu .selection {
    padding-right: 20px;
  }

  .KudosAndComments--kudos-and-comments--RTN8b
    .KudosAndComments--media-actions--x19nz
    .KudosAndComments--social-button--sbn-p {
    border-color: var(--clr-text--medium);
    background-color: transparent;
    color: var(--clr-text--medium);
  }

  .Button--primary--x47Uv {
    border-color: var(--clr-primary);
    background-color: var(--clr-primary);
    color: var(--clr-text);
  }

  .Button--primary-outline--ezOQK {
    border-color: var(--clr-primary);
    color: var(--clr-text);
  }

  /*
  ┌──────────────────────────────────┐
    FOOTER
  └──────────────────────────────────┘
  */

  footer {
    border-color: var(--clr-border);
  }

  .footer-promos {
    background-color: var(--clr-bg--content2);
  }

  .footer-global,
  .footer-global a,
  .footer-promos .promo a {
    color: var(--clr-text--light);
  }
}