/* ==UserStyle==
@name           nuevocities
@version        0.9.0
@description    cutomizable neocities theme (layout tweaks, color picker, metrics toggle)
@namespace      https://ribo.zone/free/snippets/userstyles
@author         loren ribozone
@license        CC BY-NC

@var color bg "Background Color" #f7f1e8
@var color accent "Accent Color" #fbf7f0

@var range radius "Border radius" [5, 0, 20, 1, "px"]

@var select metrics "Metrics" {
    "Show": "block",
    "Hide": "none"
}

@var select followers "New followers" {
    "Show": "auto",
    "Minimize": "4.1rem",
    "Hide": "none"
}

@var select comments "Global activity comments" {
    "Show": "block",
    "Hide": "none"
}

==/UserStyle== */

@-moz-document url-prefix("https://neocities.org") {

    .page,
    .content-Base {
        background: var(--bg);
    }
    
    .content.misc-page {
        background: var(--accent);
    }

    .news-item > .title {
        background: var(--accent);
        border: 1px solid color-mix(in oklab, var(--accent), black 5%);
        border-radius: var(--radius);
        min-height: 51px;
        align-items: center;
    }

    .news-item.follow .icon,
    .news-item.update .icon,
    .news-item.comment .icon {
        background: unset;
    }
    
    .news-item .avatar {
        border-radius: var(--radius);
    }

    .news-item > .title .text {
        margin-top: unset;
    }

    .news-item .date {
        margin: 0 12px 0 0;
    }

    .news-item .comments {
        background: unset;
        border: unset;
    }

    .news-item.update .files {
        grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    }

    .news-item.update .html-thumbnail {
        border: 1px solid color-mix(in oklab, var(--accent), black 5%);
        border-radius: var(--radius);
        max-width: 700px;
    }

    .news-item.update .html-thumbnail.html img {
        border-bottom: 1px solid color-mix(in oklab, var(--accent), black 5%);
        max-height: 75vh;
    }

    .interior .header-Outro.with-columns .col-66 {
        border-right: unset;
    }

    .files.list-view .list .file:nth-child(2n) {
        background: #fbf7f0;
    }

    .news-site-info .stats .col-50:nth-child(2),
    .profile-info > .stats,
    .site-info > .site-stats,
    .col-33 .stats a {
        display: var(--metrics);
    }

    .profile-info .site-url {
        margin-bottom: 12px;
    }

    .news-item.follow {
        display: var(--followers);
    }
    
    .news-item.follow .content {
        max-height: var(--followers);
        overflow-Y: auto;
        scrollbar-width: none;
    }
    
    .website-Gallery.int-Gall li,
    .btn-Action {
        border-radius: var(--radius);
    }
    
    .tagcloud {
        max-height: 40vh;
        overflow: auto;
        background: var(--accent);
        border: 1px solid color-mix(in oklab, var(--accent), black 5%);
        border-radius: var(--radius);
        padding: 0.5rem 0.5rem 0.5rem 1rem;
    }

    @media (max-device-width: 480px),
    screen and (max-width: 800px) {

        .news-item.update .files {
            grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
        }

        .news-item > .title {
            grid-template-rows: 1fr 1fr;
            padding: 4px;
        }

        .news-item.follow > .title .text {
            grid-row: span 2;
        }
    }
}

@-moz-document url-prefix("https://neocities.org/activity") {

    .news-item.comment {
        display: var(--comments);
    }
}