/* ==UserStyle==
@name           Pinterest Dark Theme
@version        1.0.0
@author         Hussein Esmail
@description    `A dark theme template for Pinterest`
@namespace      https://github.com/hussein-esmail7/userstyles
@homepageURL    https://github.com/hussein-esmail7/userstyles
@supportURL     https://github.com/hussein-esmail7/userstyles/issues
@updateURL      https://raw.githubusercontent.com/hussein-esmail7/userstyles/main/src/dark_pinterest.user.css
==/UserStyle== */

@-moz-document domain("pinterest.com") {

    :root {
        --color-bg: #141414;            /* Default background color */
        --color-fg: #f8f8f8;            /* Default text color */
        --color-fg-secondary: #eeeeee;
        --color-fg-button: black;
        --color-bg-table: #31363a;
        --table-hover-color: #222222;
        --color-bg-search: grey;
        color-scheme: dark;                 /* Used to get dark scroll bars */
    }

    html, p, li, /* Default stuff */
    div.Jea.XiG.i1W.imm.zI7.iyn.Hsu, /* Container for main image */
    div.KS5.b8T.hs0.ujU.un8.C9i.TB_, /* Comments collapsible container */
    div[data-test-id='closeup-body-sticky-content'],
    div[data-test-id='header-background'],
    nav#VerticalNavContent,
    .imm,
    div[aria-label='Dropdown'],
    h1.FAo.dyH.c51.X8m.V2L.G1E, /* h1 when image hyperlinked to URL */
	div[data-test-id='more-description-container'] div.S9z.eEj.CCY.e8F.BG7, /* "More" button for long descriptions */
	div[data-test-id='less-description-container'] div.S9z.eEj.CCY.e8F.BG7 /* "Less" button for long descriptions */
    {
        /* Background color */
        background-color: var(--color-bg) !important;
    }

    h1, h2, h3, h4, h5, h6, a, strong, label, .detDesc, div, div#sortby, .comment, #comments, #detailsouterframe *, .comment, #details *, dl *,
    nav#VerticalNavContent,
    div[aria-label='Dropdown'] *,
    div[aria-label='Currently in'] *,
    div[aria-label='Your accounts'] *,
    div#SuggestionsMenu > *
	{

        /* Text color */
        color: var(--color-fg) !important;
    }

    input,
    div#searchBoxContainer div,
    div#searchBoxContainer div div div input
    {
        /* Text inputs */
        color: var(--color-fg-button) !important;
        background-color: var(--color-bg-search);
    }


    div[data-test-id='creator-card-profile'], /* Author container */
    div[data-test-id='inline-comment-composer-container'], /* Comment composer container */
    div[data-test-id='closeup-action-items'], /* Heart/Share buttons */
    div[data-test-id='closeup-body-image-container'] div.zI7.iyn.Hsu div[data-test-id='closeup-image-overlay-layer-flashlight-button'], /* Image overlay buttons (Zoom in, Related) */
    div[data-test-id='closeup-body-image-container'] div.zI7.iyn.Hsu div[data-test-id='closeup-image-overlay-layer-media-viewer-button'], /* Image overlay buttons (Zoom in, Related) */
    div[data-test-id='closeup-body-image-container'] div.zI7.iyn.Hsu div[data-test-id='closeup-image-overlay-layer-domain-link-button'], /* Image overlay buttons (Zoom in, Related) */
    div[data-test-id='footer'], /* Footer */
    div[data-test-id='closeup-data-loaded'], /* Back button to left of image */
    div.Jea.KS5.jzS.zI7.iyn.Hsu >:nth-child(4), /* Sidebar "Create" button */
    div.Jea.KS5.jzS.zI7.iyn.Hsu >:nth-child(5), /* Sidebar "Notifications" button */
    div.Jea.KS5.jzS.zI7.iyn.Hsu >:nth-child(6) /* Sidebar "Messages" button */
	{
		display: none;
	}

	svg.Uvi.gUZ.U9O.kVc /* Sidebar icons */
	{
		color: white;
	}

	button.oeK.DUt.Fuc.CCY.Tbt.L4E.e8F.BG7:hover /* When you hover over dropdown buttons */
	{
		background-color: grey !important;
	}

	div.zI7.iyn.Hsu
	{
		border-radius: 0 !important;
	}

	a[aria-label='  pin page']
	{
		target: "_blank";

	}

	a.nrl._74.NtY.S9z.CCY._O1.mQ8.KS5.xuB.qrE.a_A /* "Visit Site" button on some image pages */
	{
		background-color: red;
	}

	div[data-test-id='more-description-container'] div.MIw.zI7.iyn.Hsu
	{
		background: linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, black 100%) !important;
		right: 100%;
		height: 100%;
		width: 48px;
	}
}