www.crealitycloud.com by Lloir

/* ==UserStyle==
@name         www.crealitycloud.com
@version      20250122.21.52
@namespace    https://userstyles.world/user/Lloir
@description  Crealitycloud dark mode
@author       Lloir
@license      No License
==/UserStyle== */

/* Creality Cloud Dark Mode - Stylus */

/* ==UserStyle==
@name       Creality Cloud Dark Mode
@version    20250122.07.24
@namespace  ?
==/UserStyle== */

@-moz-document domain("crealitycloud.com") {
/* General background and text adjustments */
    body {
        background-color: #121212 !important;
        color: #e0e0e0 !important;
    }

    /* Header adjustments */
    header, .header {
        background-color: #1e1e1e !important;
        color: #ffffff !important;
    }

    /* Links */
    a {
        color: #90caf9 !important;
    }
    a:hover {
        color: #64b5f6 !important;
    }

    /* Buttons */
    button, .btn {
        background-color: #333333 !important;
        color: #ffffff !important;
        border: 1px solid #555555 !important;
    }
    button:hover, .btn:hover {
        background-color: #444444 !important;
    }

    /* Inputs and forms */
    input, textarea, select {
        background-color: #1e1e1e !important;
        color: #ffffff !important;
        border: 1px solid #555555 !important;
    }
    input::placeholder, textarea::placeholder {
        color: #888888 !important;
    }

    /* Tables */
    table {
        background-color: #1e1e1e !important;
        color: #e0e0e0 !important;
    }
    th, td {
        border: 1px solid #333333 !important;
    }

    /* Cards and sections */
    .card, .section {
        background-color: #1e1e1e !important;
        color: #ffffff !important;
        border: 1px solid #333333 !important;
    }

    /* Footer */
    footer {
        background-color: #1e1e1e !important;
        color: #888888 !important;
    }

    /* Specific overrides for elements that don't adapt well */
    .highlight {
        background-color: #424242 !important;
        color: #ffffff !important;
    }

    /* Remove or adjust bright elements */
    img, video {
        filter: brightness(0.8) contrast(1.2) !important;
    }

    /* Any element-specific adjustments */
    .specific-class {
        background-color: #212121 !important;
        color: #ffffff !important;
    }

    /* Darken the main application container */
    #__nuxt {
        background-color: #1e1e1e !important;
        color: #ffffff !important;
    }

    /* Darken the home layout */
    .home_layout {
        background-color: #1e1e1e !important;
        color: #ffffff !important;
    }

    /* Darken the content flex-between-center */
    .content.flex-between-center {
        background-color: #1e1e1e !important;
        color: #ffffff !important;
    }

    /* Style for nav-item */
    .nav-item {
        background-color: #1e1e1e !important; /* A neutral dark background */
        color: #ffffff !important;
    }
    .nav-item:hover {
        background-color: #2a2a2a !important; /* Slightly lighter neutral background for hover effect */
    }

    /* Style adjustments for type-sidebar */
    .type-sidebar {
        background-color: #1e1e1e !important;
        color: #ffffff !important;
    }

    /* Style adjustments for device-item-box */
    .device-item-box {
        background-color: #1e1e1e !important;
        color: #ffffff !important;
    }

    /* Style adjustments for print-manage-top */
    .print-manage-top {
        background-color: #1e1e1e !important;
        color: #ffffff !important;
    }

    /* Style adjustments for print-device_comp-new */
    .print-device_comp-new {
        background-color: #1e1e1e !important;
        color: #ffffff !important;
    }

    /* Style adjustments for loading_comp */
    .loading_comp {
        background-color: #1e1e1e !important;
        color: #ffffff !important;
    }

    /* Style adjustments for my-print-layout */
    .my-print-layout {
        background-color: #1e1e1e !important;
        color: #ffffff !important;
    }

    /* Style adjustments for print-device-name-label */
    .print-deivce-name-label {
        color: #ffffff !important;
    }

    /* Additional customizations for Creality Cloud */
    @media screen {
        html {
            --color-inverted: #000;
            --background-color-base: #000;
            --border-color-inverted: #000;
            --background-color-neutral-subtle: #000;
            --background-color-interactive-subtle: #000;
        }
    }
}