/* Dark theme */
body.dark-theme {
    --color-bg: #161616;
    --back: #2d2d2d;
    --color-text-primary: #c8c8c8;
    --titles: #679DF7;
    --lavend: #C6B9FF;
    --home-bg: #2a2a2a;
    --grid-image:
        linear-gradient(#292828 1px, transparent 1px),
        linear-gradient(90deg, #292828 1px, transparent 1px);
}

/* Backgrounds and text */
body.dark-theme,
body.dark-theme html {
    background-color: var(--color-bg);
    color: var(--color-text-primary);
}

body.dark-theme .site-header,
body.dark-theme .homepage-left-text,
body.dark-theme .home-showcase-right p { background: none; }

body.dark-theme .sidebar-nav.active { background: var(--color-bg); }

body.dark-theme .layout-root {
    min-height: 100vh;
    display: flex;
    flex-direction: column;

    background-color: var(--color-bg);
    background-image: var(--grid-image);
    background-size: 100px 100px;
}

body.dark-theme .homepage select {
    box-shadow: 6px 6px 0 0 var(--back);
}

body.dark-theme .arrow-icon:before,
body.dark-theme .arrow-icon:after {
    border-left: 8px solid var(--color-text-primary);
    border-bottom: 8px solid var(--color-text-primary);
    }

body.dark-theme .group-cover { border: 3px solid var(--color-bg); }

body.dark-theme .arrow-icon:after {
    border-left: 8px solid var(--color-text-primary);
    border-bottom: 8px solid var(--color-text-primary);
}

body.dark-theme .post-title,
body.dark-theme .post-title-cat { color: var(--titles); }

body.dark-theme .dog-card-link {
    box-shadow: 2px 4px 0 0 var(--back);
    background: var(--color-bg);
}

body.dark-theme .dog-card__title { color: var(--titles); }

body.dark-theme .dog-card__section { color: var(--color-text-primary); }
body.dark-theme .dog-card__group { color: var(--lavend); }

body.dark-theme .post-image, body.dark-theme .gallery-image {
    border: 1.5px solid var(--color-text-primary);
}

body.dark-theme .slider-range {
    border: 2.5px solid var(--color-bg);
    box-shadow: 1px 3px 0 var(--back);
    background:
        repeating-linear-gradient(-90deg,
        var(--color-text-primary) 0 1px,
        var(--back) 1px 3px);
 }

body.dark-theme .slider-range::-webkit-slider-thumb {
    border: 3px solid var(--color-bg);
    box-shadow: 6px 6px 0 var(--color-bg);
}

body.dark-theme .section-title,
body.dark-theme .group-row,
body.dark-theme .group-title,
body.dark-theme .post-navigation .nav-link,
body.dark-theme .group-title::after,
body.dark-theme .group-content ul {
    background: var(--back);
}
body.dark-theme .section-title {
    border: 1px solid var(--color-text-primary);
}

body.dark-theme .post-navigation .nav-link:hover{
    background: #C4A1FF;
    color: var(--color-bg);
}

body.dark-theme .param-card:hover,
body.dark-theme .breed-tag:hover { color: var(--titles); }

body.dark-theme .home-text-block {
    background: var(--home-bg);
}

body.dark-theme .home-text-block-title,
body.dark-theme .home-text-block-text {
    color: var(--color-text-primary);
}

body.dark-theme .homepage .slider-block { background: var(--home-bg); }

body.dark-theme .hero-wave { color: var(--home-bg); }

body.dark-theme .group-row::before,
body.dark-theme .post-navigation i,
body.dark-theme .btn-back i,
body.dark-theme #scroll-top-button {
    color: var(--back);
    border: 1px solid var(--back);
}

body.dark-theme .policy-container input[type="text"],
body.dark-theme .policy-container input[type="email"],
body.dark-theme .policy-container textarea { background: var(--back); }