OVK Mobile (Midnight) by sn0wgit

/* ==UserStyle==
@name           OVK Mobile (Midnight)
@namespace      github.com/sn0wgit/
@version        1.0.4.1
@description    Midnight color preset for OVK Mobile theme
@author         sn0wstyler
==/UserStyle== */
@-moz-document domain("ovk.to"), domain("vepurovk.xyz") {
    html{
        scrollbar-color: #3f365b #1d192b;
    }

    body.app_layer,
    div.app {
        background: #0e0b1a;
        color: #c6d2e8;
        color-scheme: dark;
    }

    body.app_layer a {
        color: #8fb9d8;
    }

    .bluebar,
    .app > .navigation {
        background: linear-gradient(#282435, #3c3949);
        border-color: #555555;
        @media screen and (max-width: 1023px) {
            width: 100%;
            margin-left: 0;
        }
    }
    
    .app > .navigation{
        margin-left: -1px;
    }

    body.app_layer input[type="search"] {
        background: #181826 !important;
        border-color: #2c2640 !important;
        border-radius: 0 !important;
    }

    .menuovk {
        background: #1e1a2b;
        min-height: calc(100% - 48px);
        @media screen and (min-width: 1024px) {
            position: fixed;
        }
    }

    .menunameava {
        background: unset;
        border-color: #2c2640;
    }

    :is(.menunameava, .menuovk>.content>.menu>.element.prmenu):hover {
        background: #353141;
    }

    .menunameava .pr_ovk_page .name {
        color: #8fb9d8;
    }

    .menunameava .pr_ovk_page .status {
        color: #8b9ab5;
    }

    .menuovk > .content > .menu > .element.prmenu > a {
        color: #d9e0ee;
        border-color: #2c2640;
    }

    .menuovk .space_menu {
        background: #2c2640;
        padding: 2px;
    }

    span.counter.urgent {
        background: #1e1a2b;
        color: #8fb9d8;
    }

    div#page_footer {
        color: #c6d2e8;
    }

    div#page_footer a {
        color: #8fb9d8;
    }

    .settings_body {
        background: #1e1a2b;
    }

    .main {
        border-color: #2c2640;
        height: calc(100% - 48px);
        @media screen and (min-width: 1024px) {
            border-top: unset;
            border-bottom: unset;
            min-height: calc(100% - 47px);
            height: auto;
        }
    }

    body.app_layer .container_gray {
        background: #1e1a2b;
    }

    body.app_layer input.button,
    body.app_layer div.messenger-app--input---messagebox>button,
    body.app_layer .button.cfa {
        background: #383052 !important;
        text-shadow: 0 1px 0 #686868;
        font-weight: 700;
    }
    
    body.app_layer .tab{
        display: inline-block;
    }
    
    body.app_layer .tabs > .tab{
        border-radius: 0 0 4px 4px;
    }

    body.app_layer .tabs > .tab > a {
        color: #8fb9d8;
    }

    body.app_layer .tabs > .tab:is(#activetabs, :hover) {
        background: #383052;
    }

    body.app_layer .tabs {
        border-top: 1px solid #2c2640;
        overflow-x: auto;
        margin-top: 0;
    }

    body.app_layer .settings_body > .tabs {
        width: calc(100% + 20px);
        margin-left: -10px;
        padding-left: 10px;
        padding-right: 10px;
    }

    body.app_layer .page_wrap > .tabs {
        margin: 20px 0 0;
        padding: 0 10px 11px;
        width: 100%;
    }

    body.app_layer form[action*="?act=privacy"] td {
        width: 50%;
    }

    body.app_layer form[action*="?act=privacy"] td select {
        width: 100% !important;
    }

    .contentWraplegend {
        background: url("/themepack/midnight/0.0.2.9/resource/header_purple.png") center / cover repeat-x;
        color: #c6d2e8;
        line-height: 1;
    }

    .contentWraplegend span a.float-right {
        color: #8fb9d8;
    }

    .contentWraplegend:has(span a.float-right) {
        color: white;
    }

    body.app_layer select {
        border-color: #2c2640 !important;
        background: #181826;
    }

    .alert {
        background: #231e33;
        border: unset;
        color: #c6d2e8;
    }

    body.app_layer h4,
    .alert > .head {
        color: #7c94c5;
    }

    body.app_layer div#write,
    .content_post_comments {
        background: #1e1a2b;
    }

    .content_post {
        background: unset;
    }

    body.app_layer form:is(
        [action*="/makePost"],
        [action*="/al_comments/create/posts"],
        [action*="/al_comments/create/photos"],
        [action*="/support"]
    ) textarea,
    body.app_layer .accent-box, 
    div.app .messenger-app--input---messagebox>textarea,
    body.app_layer div.mobile_repost>textarea{
        background-color: #181826;
        border-color: #2c2640;
    }

    .paginators{
        height: 26px;
    }
    
    #liked.button.bold.like,
    .paginators .active {
        background-color: #463e86;
    }

    .button.bold.like,
    .button.bold.commentbtn,
    .button.bold.sharebtn,
    .paginators a {
        background-color: #1e1a2b;
    }

    :is(.button.bold.like,
    .button.bold.commentbtn,
    .button.bold.sharebtn,
    .paginators a):hover {
        background-color: #353141;
    }

    .attachments_b .attachment .post {
        background: linear-gradient(90deg, #0000 0px, #0000 12px, #3f365b 12px, #3f365b 16px, #0000 16px);
    }

    .post > .actions {
        border-color: #2c2640;
    }

    .page_wrap {
        background: unset;
    }

    body.app_layer .container_gray .content {
        background: #120e1f;
        border-color: #2c2640;
    }

    .search_menu_box > form {
        margin: 0;
    }

    table.list_w_link:active {
        background: #ffffff1a;
    }

    body.app_layer h2 {
        color: #c6d2e8 !important;
        background: unset;
        width: fit-content;
        min-width: 100%;
    }

    .contentWrap > .legend {
        background: #231e33;
        color: #7c94c5;
    }

    .contentWrap > .content {
        background: #1e1a2b !important;
    }

    .contentWrap > .content li.element:hover {
        background: #ffffff1a;
    }

    .contentWrap > .content li.element > a {
        border-color: #2c2640;
    }

    .container.marged {
        background-color: #0e0b1a;
    }

    body.app_layer :is(
        [type="text"],
        [type="password"]
    ):is(
        input,
        textarea
    ),
    body.app_layer .sr_input {
        background: #181826;
        border-color: #2c2640;
    }

    .formInput > input {
        border-color: #2c2640;
    }

    input:is([type="checkbox"],
    [type=radio]) {
        accent-color: #6d5aa0;
    }

    .main > .tabs {
        padding: 0 10px 11px;
        margin-top: 6px !important;
    }

    .rating_st {
        background: unset;
        border-color: #2c2640;
    }

    .rating.prmenu a {
        background: #181826;
    }

    li.rating.prmenu:nth-last-child(1 of :has(a)) {
        border-bottom: 1px solid #2c2640;
    }

    .rating_st_icon {
        background: linear-gradient(45deg, #353141 10px, #35314100 10px);
        mask: linear-gradient(-45deg, #353141 10px, #35314100 10px);
    }

    .podrobnee:hover {
        background: #ffffff1a;
        color: #fff;
        cursor: pointer;
    }

    .podrobnee,
    .button.primary,
    body.app_layer #activetabs.tab {
        font-weight: 700;
        background: #383052 !important;
        text-shadow: 0 1px 0 #686868;
        border-radius: 3px;
        color: #fff;
    }

    :is(.podrobnee,
    .button.primary):hover {
        color: #e8e8e8;
    }

    body.app_layer .completeness-gauge,
    .poll-result-bar {
        background: #231e33;
        border: unset;
    }

    .completeness-gauge > div,
    .poll-result-bar-sub {
        background: #2c2640;
    }
    
    .poll {
        border-color: #2c2640;
    }

    span.poll-result-count {
        color: #8b9ab5;
    }

    .mesbody {
        background: unset;
    }
    
    .post > .body > p,
    body.app_layer .ugc-table tr > td:nth-of-type(2),
    .knowledgeBaseArticle,
    .container_gray10 tbody {
        color: #8b9ab5;
    }

    .container_gray10 {
        background: #0e0b1a;
    }

    div#faqhead {
        background: #231e33;
        border-color: #2c2640;
        color: #c6d2e8;
    }

    div#faqcontent {
        background-color: #1e1a2b;
        border-color: #2c2640;
        color: #c6d2e8;
    }
    
    .crp-entry{
        cursor: pointer;
    }

    .crp-entry:active {
        background: #ffffff1a;
    }
    
    div.app .messenger-app {
        background: #0e0b1a;
    }

    div.app .messenger-app--messages---message img.ava {
        aspect-ratio: 1/1;
    }

    div.app .messenger-app--input {
        background: #1e1a2b;
        border: unset;
    }
    
    body.app_layer div.mobile_repost {
        background: #1e1a2b;
        color: #CCC;
    }
    
    .album-photo img.album-photo--image {
        background: #231e33;
        border-color: #383052;
    }
    
    div.app .album-flex>.album-photo {
        width: calc(25% - 6px);
    }
    
    .photobody {
        background: #0000;
    }
    
    .lang_content{
        background: #1e1a2b;
    }
    
    div.app .messenger-app--input {
        box-sizing: border-box;
        min-width: 100%;
        width: 100vw;
        max-width: 100%;
    }

    div.app .messenger-app--input_fixed {
        background: #1e1a2b;
        padding: 10px;
        box-sizing: content-box;
        position: static;
        min-height: fit-content;
    }

    div.app .messenger-app--messages {
        margin-bottom: auto;
        position: relative;
    }

    div.app .messenger-app {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        display: flex;
        flex-direction: column;
        height: calc(100vh - 72px);
    }

    div.app .messenger-app--input_fixed>* {
        display: contents;
    }

    div.app .messenger-app--input---messagebox {
        display: contents;
    }

    div.app textarea[data-bind="value: messageContent, event: { keydown: onTextareaKeyPress }"][name="message"] {
        margin-top: 10px;
    }

    ._content {
        padd...