Dark Shopify Admin by still34

/* ==UserStyle==
@author       Still Hsu (https://stillu.cc)
@description  When you hate Shopify's default theme.
@license      MIT
@name         Dark Shopify Admin
@namespace    url(https?://.*\\.myshopify.com/admin.*)
@namespace    github.com/openstyles/stylus
@homepageURL  https://github.com/Still34/azura-styles
@version      1.0.6
==/UserStyle== */
@-moz-document regexp("https?://.*\\.myshopify.com/admin.*") {
    :root,
    #app * {
        --theme-color: hsl(240, 6%, 10%);
        --theme-color-alt: hsl(240, 6%, 5%);
        --notice-attention: hsl(35, 60%, 30%);
        --notice-critical: hsl(9, 89%, 55%);
        --theme-black: hsl(0, 0%, 0%);
        --p-background: var(--theme-color);
        --p-background-hovered: hsl(210, 8%, 5%);
        --p-background-pressed: hsl(210, 6%, 7%);
        --p-background-selected: hsl(210, 6%, 7%);
        --p-surface: var(--theme-color-alt);
        --p-surface-neutral: hsl(220, 6%, 10%);
        --p-surface-neutral-hovered: hsl(210, 6%, 13%);
        --p-surface-neutral-pressed: hsl(214, 7%, 20%);
        --p-surface-neutral-disabled: hsl(210, 8%, 5%);
        --p-surface-neutral-subdued: var(--theme-color);
        --p-surface-subdued: hsl(180, 11%, 2%);
        --p-surface-disabled: hsl(180, 11%, 2%);
        --p-surface-hovered: var(--theme-color);
        --p-surface-pressed: hsl(210, 8%, 5%);
        --p-surface-depressed: hsl(210, 6%, 7%);
        --p-surface-search-field: hsl(210, 8%, 5%);
        --p-backdrop: hsla(0, 0%, 0%, 0.5);
        --p-overlay: hsla(0, 0%, 0%, 0.5);
        --p-shadow-from-dim-light: hsla(0, 0%, 100%, 0.2);
        --p-shadow-from-ambient-light: hsla(180, 2%, 91%, 0.05);
        --p-shadow-from-direct-light: hsla(0, 0%, 100%, 0.15);
        --p-hint-from-direct-light: hsla(0, 0%, 100%, 0.15);
        --p-border: hsl(210, 5%, 43%);
        --p-border-neutral-subdued: hsl(207, 7%, 25%);
        --p-border-hovered: hsl(213, 6%, 38%);
        --p-border-disabled: hsl(210, 7%, 16%);
        --p-border-subdued: hsl(210, 6%, 20%);
        --p-border-depressed: hsl(180, 1%, 65%);
        --p-border-shadow: hsl(207, 7%, 30%);
        --p-border-shadow-subdued: hsl(210, 8%, 25%);
        --p-divider: hsl(210, 7%, 11%);
        --p-icon: hsl(210, 3%, 63%);
        --p-icon-hovered: hsl(200, 5%, 89%);
        --p-icon-pressed: hsl(210, 4%, 72%);
        --p-icon-disabled: hsl(213, 7%, 25%);
        --p-icon-subdued: hsl(210, 5%, 43%);
        --p-text: hsl(200, 4%, 87%);
        --p-text-disabled: hsl(210, 5%, 43%);
        --p-text-subdued: hsl(210, 4%, 56%);
        --p-surface-warning: hsl(36, 100%, 19%);
        --p-surface-warning-subdued: hsl(31, 100%, 4%);
        --p-surface-warning-subdued-hovered: hsl(33, 100%, 6%);
        --p-surface-warning-subdued-pressed: hsl(33, 100%, 9%);
        --p-text-warning: hsl(44, 100%, 72%);
        --p-border-highlight: hsl(186, 42%, 54%);
        --p-border-highlight-subdued: hsl(188, 35%, 30%);
        --p-icon-highlight: hsl(184, 100%, 66%);
        --p-surface-highlight: hsl(188, 75%, 20%);
        --p-surface-highlight-subdued: hsl(191, 74%, 5%);
        --p-surface-highlight-subdued-hovered: hsl(188, 69%, 6%);
        --p-surface-highlight-subdued-pressed: hsl(189, 71%, 10%);
        --p-text-highlight: hsl(186, 43%, 64%);
        --p-border-success: hsl(165, 100%, 68%);
        --p-border-success-subdued: hsl(156, 32%, 31%);
        --p-icon-success: hsl(165, 100%, 15%);
        --p-surface-success: hsl(156, 57%, 20%);
        --p-surface-success-subdued: hsl(154, 33%, 4%);
        --p-surface-success-subdued-hovered: hsl(150, 36%, 5%);
        --p-surface-success-subdued-pressed: hsl(152, 35%, 8%);
        --p-text-success: hsl(165, 100%, 75%);
        --p-decorative-one-icon: hsl(41, 100%, 75%);
        --p-decorative-one-surface: hsl(38, 100%, 29%);
        --p-decorative-one-text: hsl(39, 100%, 88%);
        --p-decorative-two-icon: hsl(343, 62%, 58%);
        --p-decorative-two-surface: hsl(15, 100%, 15%);
        --p-decorative-two-text: hsl(344, 74%, 84%);
        --p-decorative-three-icon: hsl(156, 100%, 79%);
        --p-decorative-three-surface: hsl(145, 63%, 26%);
        --p-decorative-three-text: hsl(152, 100%, 91%);
        --p-decorative-four-icon: hsl(179, 100%, 79%);
        --p-decorative-four-surface: hsl(172, 56%, 28%);
        --p-decorative-four-text: hsl(180, 100%, 91%);
        --p-decorative-five-icon: hsl(345, 60%, 57%);
        --p-decorative-five-surface: hsl(352, 93%, 11%);
        --p-decorative-five-text: hsl(344, 70%, 82%);
        --p-interactive: hsl(215, 64%, 52%);
        --p-interactive-disabled: hsl(224, 13%, 23%);
        --p-interactive-hovered: hsl(215, 66%, 64%);
        --p-interactive-pressed: hsl(215, 72%, 78%);
        --p-focused: hsl(216, 100%, 36%);
        --p-surface-selected: hsl(215, 86%, 3%);
        --p-surface-selected-hovered: hsl(215, 89%, 4%);
        --p-surface-selected-pressed: hsl(215, 86%, 5%);
        --p-icon-on-interactive: var(--theme-black);
        --p-text-on-interactive: var(--theme-black);
        --p-action-secondary: var(--theme-black);
        --p-action-secondary-disabled: var(--theme-black);
        --p-action-secondary-hovered: hsl(240, 6%, 3%);
        --p-action-secondary-pressed: hsl(210, 8%, 5%);
        --p-action-secondary-depressed: hsl(210, 4%, 56%);
        --p-action-primary: hsl(165, 100%, 25%);
        --p-action-primary-disabled: hsl(0, 0%, 5%);
        --p-action-primary-hovered: hsl(165, 100%, 22%);
        --p-action-primary-pressed: hsl(165, 100%, 18%);
        --p-action-primary-depressed: hsl(163, 100%, 12%);
        --p-icon-on-primary: var(--theme-black);
        --p-text-on-primary: var(--theme-black);
        --p-text-primary: hsl(165, 100%, 76%);
        --p-text-primary-hovered: hsl(164, 100%, 79%);
        --p-text-primary-pressed: hsl(164, 100%, 82%);
        --p-surface-primary-selected: hsl(154, 33%, 4%);
        --p-surface-primary-selected-hovered: hsl(153, 24%, 24%);
        --p-surface-primary-selected-pressed: hsl(152, 16%, 31%);
        --p-border-critical: hsl(5, 98%, 36%);
        --p-border-critical-subdued: hsl(1, 43%, 21%);
        --p-border-critical-disabled: hsl(3, 100%, 18%);
        --p-icon-critical: var(--notice-critical);
        --p-surface-critical: hsl(3, 96%, 9%);
        --p-surface-critical-subdued: hsl(0, 100%, 2%);
        --p-surface-critical-subdued-hovered: hsl(0, 100%, 3%);
        --p-surface-critical-subdued-pressed: hsl(3, 100%, 5%);
        --p-surface-critical-subdued-depressed: hsl(3, 97%, 14%);
        --p-text-critical: var(--notice-critical);
        --p-action-critical: var(--notice-critical);
        --p-action-critical-disabled: hsl(0, 0%, 5%);
        --p-action-critical-hovered: hsl(11, 100%, 63%);
        --p-action-critical-pressed: hsl(10, 100%, 68%);
        --p-action-critical-depressed: hsl(8, 100%, 79%);
        --p-icon-on-critical: var(--theme-black);
        --p-text-on-critical: var(--theme-black);
        --p-interactive-critical: hsl(345, 69%, 49%);
        --p-interactive-critical-disabled: hsl(3, 97%, 23%);
        --p-interactive-critical-hovered: hsl(9, 89%, 57%);
        --p-interactive-critical-pressed: hsl(7, 94%, 79%);
        --p-border-warning: hsl(44, 100%, 64%);
        --p-border-warning-subdued: hsl(37, 64%, 32%);
        --p-icon-warning: hsl(44, 100%, 64%);
        color: hsl(200, 4%, 87%);
    }
    a[data-polaris-unstyled="true"]:hover > *,
    a[data-polaris-unstyled="true"]:hover,
    .highcharts-background,
    .idc0_332 body {
        background-color: var(--theme-color) !important;
    }
    [class*="Polaris-Card"] tr:nth-of-type(2n),
    ._3BbkR,
    ._3wT1P {
        background-color: var(--theme-color);
    }
    .LFiTW {
        background-color: var(--p-surface-selected);
    }
    ._3xlLI,
    .wApuC {
        background: var(--theme-color) !important;
    }
    [class*="Polaris-Card"] th,
    [class*="Polaris-Card"] tr,
    [class*="Polaris-Stack"] button,
    .osewa,
    ._1IHAv,
    ._2G9Mb,
    ._3yZyD {
        background-color: var(--theme-color-alt);
    }
    ._1xTlC {
        background-color: var(--notice-critical) !important;
    }

    [class*="statusAttention"] {
        background-color: var(--notice-attention);
    }
}