/* Loaded only with the Halloween appearance. All rules stay within its body class. */
body.kc-appearance-halloween {
    --kc-hw-orange: #ff922e;
    --kc-hw-light: #ffc084;
    --kc-hw-surface: #1d1524;
    --kc-hw-border: #56344e;
    background-color: #120e18 !important;
    background-image: radial-gradient(ellipse at 5% 0, #5b291f55, transparent 40%),
        radial-gradient(ellipse at 95% 0, #53277b55, transparent 40%);
    background-repeat: no-repeat;
}

body.kc-appearance-halloween .site-content,
body.kc-appearance-halloween .module,
body.kc-appearance-halloween .content,
body.kc-appearance-halloween .content-cat,
body.kc-appearance-halloween .blog-list-items,
body.kc-appearance-halloween .entry {
    background: var(--kc-hw-surface) !important;
}

body.kc-appearance-halloween #masthead .header {
    background: url("halloween-web.svg") no-repeat right top / 120px 120px,
        linear-gradient(115deg, #30202e, #211426 60%, #291b34);
    box-shadow: 0 12px 40px #08050e55;
}

body.kc-appearance-halloween .site-branding {
    background: transparent !important;
}

body.kc-appearance-halloween .site-branding .logo img {
    filter: drop-shadow(0 0 10px #ff74152e);
}

body.kc-appearance-halloween #site-navigation ul {
    background: #100b16 !important;
}

body.kc-appearance-halloween #site-navigation > ul > li > a:hover,
body.kc-appearance-halloween #site-navigation > ul > li.current-menu-item > a {
    background: #ff922e14;
    color: var(--kc-hw-light);
    border-bottom-color: var(--kc-hw-orange) !important;
}

body.kc-appearance-halloween .header-search input[type="text"] {
    background: #120d1a !important;
    border-color: var(--kc-hw-border) !important;
    color: #f7edf8 !important;
}

/* Keep the search icon from the original theme; change only its background color. */
body.kc-appearance-halloween .header-search #searchsubmit {
    background-color: var(--kc-hw-orange) !important;
}

body.kc-appearance-halloween .kc-home-shortcuts a,
body.kc-appearance-halloween .kc-patreon-panel {
    background: #291b31;
    border-color: var(--kc-hw-border);
}

body.kc-appearance-halloween .kc-home-shortcuts a:hover {
    background: #3b2340;
    border-color: var(--kc-hw-orange);
    color: var(--kc-hw-light);
}

body.kc-appearance-halloween .kc-home-shortcuts span {
    color: var(--kc-hw-orange);
}

body.kc-appearance-halloween .kc-patreon-panel {
    border-left-color: var(--kc-hw-orange);
}

body.kc-appearance-halloween .button,
body.kc-appearance-halloween .kc-patreon-actions .kc-patreon-join,
body.kc-appearance-halloween .pagination ul li a.current,
body.kc-appearance-halloween .pagination ul li a:hover {
    background-color: var(--kc-hw-orange) !important;
    border-color: var(--kc-hw-orange);
    color: #1b0d12 !important;
}

body.kc-appearance-halloween .button:hover,
body.kc-appearance-halloween .kc-patreon-actions .kc-patreon-join:hover {
    background-color: #ffaf65 !important;
}

body.kc-appearance-halloween .archive-aside h3 {
    background: linear-gradient(110deg, #ff922e, #ed7634);
    color: #1b0d12;
}

body.kc-appearance-halloween .archive-aside .aside-tags a,
body.kc-appearance-halloween .archive-aside .allCategories {
    background: #302039 !important;
}

body.kc-appearance-halloween .archive-aside .menuCategories a:hover,
body.kc-appearance-halloween .archive-aside .allCategories:hover {
    background: #56314d !important;
    color: #fff3e9 !important;
}

body.kc-appearance-halloween .information {
    background: #100b17;
    box-shadow: inset 0 -2px #9c4d2b;
}

body.kc-appearance-halloween .information a:hover,
body.kc-appearance-halloween .footer-menu-container a:hover {
    color: var(--kc-hw-light);
}

body.kc-appearance-halloween .kc-home-date-badge {
    background: #1b1023ee;
    border-color: #d6844e99;
    color: #ffe4c8;
}

body.kc-appearance-halloween .kc-home-feed-heading,
body.kc-appearance-halloween .page-header .widget-title {
    color: #ffe4c8 !important;
}

body.kc-appearance-halloween .site-footer {
    border-top: 1px solid var(--kc-hw-border);
}

body.kc-appearance-halloween :is(a, button, input, summary):focus-visible {
    outline: 2px solid var(--kc-hw-light);
    outline-offset: 3px;
}

/* Only the bats: faint silhouettes, with no outlines, glow or wing animation. */
body.kc-appearance-halloween #halloween-bg-layer {
    position: fixed;
    inset: 0;
    z-index: 50;
    overflow: hidden;
    pointer-events: none !important;
    contain: strict;
}

body.kc-appearance-halloween .halloween-bat {
    --kc-bat-start: 15vh;
    --kc-bat-middle: 8vh;
    --kc-bat-end: 22vh;
    --kc-bat-scale: .32;
    --kc-bat-opacity: .28;
    position: fixed;
    left: 0;
    top: 0;
    width: 80px;
    height: auto;
    color: #aa91bc;
    opacity: 0;
    animation: kc-hw-bat-fly-across 24s linear -7s infinite;
}

body.kc-appearance-halloween .halloween-bat svg {
    display: block;
    width: 100%;
    height: auto;
    overflow: visible;
    fill: currentColor;
    stroke: none;
}

body.kc-appearance-halloween .halloween-bat:nth-child(2) {
    --kc-bat-start: 38vh;
    --kc-bat-middle: 46vh;
    --kc-bat-end: 32vh;
    --kc-bat-scale: .26;
    width: 90px;
    animation-duration: 32s;
    animation-delay: -17s;
    animation-direction: reverse;
}

body.kc-appearance-halloween .halloween-bat:nth-child(3) {
    --kc-bat-start: 64vh;
    --kc-bat-middle: 76vh;
    --kc-bat-end: 68vh;
    --kc-bat-scale: .38;
    width: 76px;
    animation-duration: 38s;
    animation-delay: -16s;
}

body.kc-appearance-halloween .halloween-bat:nth-child(4) {
    --kc-bat-start: 27vh;
    --kc-bat-middle: 20vh;
    --kc-bat-end: 35vh;
    --kc-bat-scale: .3;
    width: 90px;
    animation-duration: 29s;
    animation-delay: -23s;
    animation-direction: reverse;
}

body.kc-appearance-halloween .halloween-bat:nth-child(5) {
    --kc-bat-start: 84vh;
    --kc-bat-middle: 70vh;
    --kc-bat-end: 88vh;
    --kc-bat-scale: .3;
    width: 72px;
    animation-duration: 43s;
    animation-delay: -7s;
}

body.kc-appearance-halloween .halloween-bat:nth-child(6) {
    --kc-bat-start: 50vh;
    --kc-bat-middle: 40vh;
    --kc-bat-end: 56vh;
    --kc-bat-scale: .34;
    width: 96px;
    animation-duration: 36s;
    animation-delay: -29s;
    animation-direction: reverse;
}

@keyframes kc-hw-bat-fly-across {
    0% {
        transform: translate3d(-12vw, var(--kc-bat-start), 0) scale(var(--kc-bat-scale));
        opacity: 0;
    }
    10% { opacity: var(--kc-bat-opacity); }
    50% {
        transform: translate3d(50vw, var(--kc-bat-middle), 0) scale(var(--kc-bat-scale));
    }
    90% { opacity: var(--kc-bat-opacity); }
    100% {
        transform: translate3d(112vw, var(--kc-bat-end), 0) scale(var(--kc-bat-scale));
        opacity: 0;
    }
}

@media (max-width: 767px) {
    body.kc-appearance-halloween .halloween-bat:nth-child(-n + 3) {
        --kc-bat-scale: .4;
        --kc-bat-opacity: .5;
        width: 68px;
    }

    body.kc-appearance-halloween .halloween-bat:nth-child(n + 4) {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce), print {
    body.kc-appearance-halloween #halloween-bg-layer {
        display: none;
    }
}

@media (max-width: 991.98px) {
    body.kc-appearance-halloween #masthead .header {
        background-size: 80px 80px, auto;
    }

    body.kc-appearance-halloween #site-navigation {
        background: linear-gradient(145deg, #38213c, #1d1228);
        border-color: var(--kc-hw-border);
    }

    body.kc-appearance-halloween #site-navigation ul {
        background: transparent !important;
    }

    body.kc-appearance-halloween #menu-toggle,
    body.kc-appearance-halloween .header-search-mobile {
        background-color: #302039;
        border-color: var(--kc-hw-border);
        color: var(--kc-hw-light);
    }
}