Linkedin Dark Breeze by kajika

/* ==UserStyle==
@name         Linkedin Dark Breeze
@version      20220122
@namespace    userstyles.world/user/kajika
@description  Dark theme for LinkedIn
@author       kajika
@license      CC BY-SA - Creative Commons Attribution-ShareAlike
==/UserStyle== */

@-moz-document domain("linkedin.com") {
:root
{
    --main-bg-color: hsl(213, 10%, 17%);
    --main-fg-color: #bbb;
    --light-bg-color: hsl(213, 10%, 23%);
    --light-fg-color: #ccc;
    --lighter-bg-color: hsl(213, 10%, 29%);
    --lighter-fg-color: #ddd;
    --highlight-bg-color: hsl(213, 10%, 35%);
    --highlight-fg-color: #eee;
    --dim-fg-color: #999;
    --disable-bg: hsl(210, 20%, 25%);
    --disable-fg: hsl(210, 20%, 55%);
    --border-color: #888;
    --primary-color: hsl(210, 78%, 46%);
    --tint-color: hsl(210, 30%, 25%);
    --tint-dim: hsl(210, 25%, 20%);

    --color-border: var(--border-color);
	--color-label: var(--main-fg-color);
	--color-label-hover: var(--lighter-fg-color);

	--color-background: var(--light-bg-color);
    --color-background-canvas: var(--main-bg-color);
    --color-background-container: var(--light-bg-color);
    --color-background-container-tint: var(--tint-color);
    --color-background-disabled: var(--disable-bg);
    --color-background-brand-accent-4: var(--tint-dim);
    --color-background-brand-accent-5: var(--lighter-bg-color);
    --voyager-color-background-comment: var(--lighter-bg-color);
	--voyager-color-background-comment-v2: var(--lighter-bg-color);
	--voyager-color-background-comment-v3: var(--lighter-bg-color);
    --voyager-color-background-container-tint-2: var(--tint-color);
    --voyager-color-background-input-search: var(--lighter-bg-color);
    --voyager-color-action-selected: var(--highlight-bg-color);

    --color-text: var(--main-fg-color);
    --color-text-disabled: var(--disable-fg);
    --color-text-low-emphasis: var(--lighter-fg-color);
    --color-text-low-emphasis-shift: var(--light-fg-color);
	--color-text-meta: var(--disable-fg);
	--color-text-on-dark-flip: var(--light-bg-color);

    --color-action: var(--primary-color);

    --color-icon: var(--main-fg-color);
    --color-icon-nav: var(--main-fg-color);
    --color-icon-nav-active: var(--highlight-fg-color);
    --color-icon-nav-selected: var(--lighter-fg-color);
    --color-icon-nav-selected-active: var(--highlight-fg-color);
    
    --messenger-color-background-input-message: var(--highlight-bg-color);
    
    --voyager-color-background-brand-accent-5-tint: var(--lighter-bg-color);
	/*--artdeco-reset-base-background-transparent: var(--light-bg-color);*/
}

body
{
    background: var(--main-bg-color);
    color: var(--main-fg-color);
}

hr
{
    border-color: var(--border-color);
}
    
.artdeco-loader__bars
{
    color: var(--main-fg-color);
}

.global-nav__branding-logo li-icon
{
    color: var(--primary-color);
}

.msg-s-event-listitem__attachment-type--pdf
{
    background: var(--main-bg-color);
}

.msg-s-event-listitem__attachment-type--pdf .attachment-filename,
.msg-s-event-listitem__attachment-type--pdf .attachment-filesize
{
    color: var(--main-fg-color);
}

.iph-widget__search-container,
.mercado-styling input.iph-widget__search-textbox
{
    background: var(--light-bg-color);
}

.iph-widget__main-content-article
{
    background: var(--light-bg-color);
}

.iph-widget__contextual-help-header
{
    color: var(--main-fg-color);
}

.msg-reactions__pill--viewer-reacted
{
    background-color: var(--tint-dim);
}

.msg-reactions__pill--viewer-reacted:hover
{
    background-color: var(--tint-color);
}

.msg-reactions__entry-point .artdeco-button__icon,
.msg-reactions__pill
{
    background-color: var(--tint-dim);
    border-color: var(--tint-color);
}

.msg-reactions__entry-point:hover .artdeco-button__icon
{
    background-color: var(--tint-color);
    border-color: var(--tint-color);
}

}

@-moz-document url-prefix("https://www.linkedin.com/psettings") {
label
{
     color: var(--main-fg-color);
}

#layout-header.minimal-nav #header-banner
{
    background: var(--light-bg-color) !important;
}

#layout-header.minimal-nav .minimal-util-nav-link
{
    color: var(--lighter-fg-color) !important;
}

.discovery-menu-categories-col .category-container .categories
{
    background: var(--light-bg-color);
}

.discovery-menu-categories-col .category-container .categories a.category,
.discovery-menu-categories-col .category-container .categories .expanded-category,
.discovery-menu-categories-col .category-container .categories a.subcategory-nav
{
    color: var(--main-fg-color);
}

.discovery-menu-categories-col .category-container .categories a.subcategory-nav.active
{
    background: var(--lighter-bg-color);
}

.discovery-menu-categories-col .category-container .categories a.category:hover
{
    background: var(--lighter-bg-color);
}

.discovery-menu-categories-col .category-container .categories a.subcategory-nav:focus
{
    color: var(--highlight-fg-color);
}

.list--levee
{
    background: var(--light-bg-color);
}

.list .subcategory h2,
.list > li .heading,
.data-log-entry-header .data-log-entry-expander
{
    color: var(--lighter-fg-color);
}

.list p, .list legend,
.list > li .sub-heading,
.list .expander .indicator,
.list .expander .state,
.data-log-entry-header .data-log-entry-expander .date
{
    color: var(--main-fg-color);
}

.pagination .pagination-control-link
{
    color: var(--main-fg-color) !important;
}

input[type="radio"] + label::before, input[type="checkbox"] + label::before
{
    box-shadow: 0 0 0 1px rgba(255,255,255,0.6) inset
}

select
{
    color: var(--main-fg-color);
    border-color: var(--border-color);
}

select:hover
{
    border-color: var(--light-fg-color);
}

}

@-moz-document url-prefix("https://www.linkedin.com/login"), url-prefix("https://www.linkedin.com/uas/login") {
#app__container
{
    background: var(--main-bg-color);
}

#app__container .footer__base__wrapper p.copyright,
.footer__base .footer__base__nav-list a,
.language-selector__button
{
    color: var(--main-fg-color);
}

li-icon[type="linkedin-logo"] svg
{
    filter: hue-rotate(180deg) invert(0.8);
}

.language-selector .language-selector__dropdown
{
    background: var(--main-bg-color);
    box-shadow: 0 0 0 1px var(--border-color);
}

.card-layout
{
    background: var(--light-bg-color);
}

.header__content .header__content__heading,
.header__content .header__content__subheading
{
    color: var(--main-fg-color);
}

.form__input--floating
{
    background: var(--light-bg-color);
}

.form__input--floating > input
{
    color: var(--main-fg-color);
}

.form__input--floating > label,
.form__input--floating > input:focus + label,
.form__input--floating > input:autofill + label,
.form__input--floating > input:valid + label,
.form__input--floating > input:active + label
{
    color: var(--dim-fg-color);
}

}