/* Every colour change belongs to this class; hiding Halloween restores the shop. */
@media screen {
    html.joe-halloween-theme {
        background: #141210;
        color-scheme: dark;
    }

    html.joe-halloween-theme body {
        --jh-bg: #141210;
        --jh-surface: #201c18;
        --jh-raised: #2a241e;
        --jh-border: #514539;
        --jh-text: #d7cbbd;
        --jh-heading: #fff3df;
        --jh-orange: #ffad50;
        --site-bg-color: var(--jh-bg);
        --site-text-color: var(--jh-text);
        --site-heading-color: var(--jh-heading);
        --site-accent-color: var(--jh-orange);
        --site-border-color: var(--jh-border);
        --site-link-color: var(--jh-heading);
        --site-link-hover-color: var(--jh-orange);
        --site-wc-price: var(--jh-heading);
        --site-wc-price-old: #b6a899;
        --site-primary-button-color: #23170d;
        --site-primary-button-bg: var(--jh-orange);
        --site-secondary-button-color: var(--jh-heading);
        --site-secondary-button-bg: var(--jh-raised);
        --site-header-bg-color: var(--jh-surface);
        --site-header-text-color: var(--jh-heading);
        --site-header-accent-color: var(--jh-orange);
        --site-header-border-color: var(--jh-border);
        --site-main-menu-bg-color: var(--jh-surface);
        --site-main-menu-text-color: var(--jh-heading);
        --site-main-menu-accent-color: var(--jh-orange);
        --site-main-menu-border-color: var(--jh-border);
        --mobile-header-bg-color: var(--jh-surface);
        --mobile-header-text-color: var(--jh-heading);
        --page-header-bg-color: var(--jh-bg);
        --page-header-text-color: var(--jh-text);
        --page-header-heading-color: var(--jh-heading);
        --dropdown-bg-color: var(--jh-surface);
        --dropdown-text-color: var(--jh-text);
        --dropdown-accent-color: var(--jh-orange);
        --dropdown-secondary-color: #c1b2a2;
        --dropdown-grey-color: #b6a899;
        --dropdown-border-color: var(--jh-border);
        --btn-accented-bgcolor: var(--jh-orange);
        --e-global-color-primary: var(--jh-heading);
        --e-global-color-secondary: var(--jh-heading);
        --e-global-color-text: var(--jh-text);
        --e-global-color-accent: var(--jh-orange);
        --e-global-color-756b8a8: var(--jh-raised);
        --bs-body-color: var(--jh-text);
        --bs-body-bg: var(--jh-bg);
        --bs-border-color: var(--jh-border);
        --bs-card-color: var(--jh-text);
        --bs-card-bg: var(--jh-surface);
        background: var(--jh-bg) !important;
        color: var(--jh-text);
        accent-color: var(--jh-orange);
    }

    html.joe-halloween-theme body .kitify {
        --kitify-primary-color: var(--jh-orange);
        --kitify-secondary-color: var(--jh-heading);
        --kitify-body-color: var(--jh-text);
        --kitify-border-color: var(--jh-border);
    }

    html.joe-halloween-theme :is(.site-wrapper, .site-content-wrapper, .site-content, .site-main, .page-header, .page-header-wrapper) {
        background-color: var(--jh-bg) !important;
        color: var(--jh-text);
    }

    /* Recolour layout panels without changing their images or layout. */
    html.joe-halloween-theme .elementor .elementor-element.e-con,
    html.joe-halloween-theme .elementor-section {
        background-color: transparent !important;
    }

    html.joe-halloween-theme :is(.elementor-location-header, .site-header, .elementor-location-footer, .site-footer),
    html.joe-halloween-theme :is(.elementor-location-header, .elementor-location-footer) .elementor-element.e-con {
        background-color: var(--jh-surface) !important;
        border-color: var(--jh-border) !important;
    }

    html.joe-halloween-theme .elementor-location-header {
        box-shadow: 0 1px 0 #ffad502b;
    }

    html.joe-halloween-theme :is(.kitify-logo-default, .site-header .custom-logo, .site-header .site-logo img) {
        filter: brightness(0) invert(1);
    }

    /* Client logos keep their brand colours on a small, neutral backing. */
    html.joe-halloween-theme .joe-client-logo__link {
        background: #fff;
        border-radius: 5px;
        padding: 5px 7px;
    }

    html.joe-halloween-theme .kitify-nova-cart__icon {
        color: var(--jh-heading);
    }

    html.joe-halloween-theme .kitify-nova-cart__icon svg [stroke]:not([stroke="none"]) {
        stroke: currentColor !important;
    }

    /* These shortcut illustrations include a white canvas: use dark type on it. */
    html.joe-halloween-theme .kitify-banner.kitify-effect-pop-card-5 .kitify-banner__title {
        color: #241910 !important;
        text-shadow: none;
    }

    html.joe-halloween-theme .kitify-banner.kitify-effect-pop-card-5 .kitify-banner__text {
        color: #514539 !important;
    }

    /* The channel icons mix black and white strokes; both need a mid-tone stage. */
    html.joe-halloween-theme .joe-category-card .joe-category-card__image {
        background-color: #6b6256;
        border-radius: 8px;
        object-fit: contain;
    }

    html.joe-halloween-theme .joe-category-card .card-title {
        color: var(--jh-heading);
    }

    html.joe-halloween-theme .joe-category-card .card-text {
        color: var(--jh-text);
    }

    html.joe-halloween-theme .joe-category-card:not(.joe-portal-disabled) .btn {
        background-color: var(--jh-orange) !important;
        border-color: var(--jh-orange) !important;
        color: #23170d !important;
    }

    html.joe-halloween-theme .joe-category-card:not(.joe-portal-disabled) .joe-category-card__link:hover .btn {
        background-color: #ffc47e !important;
        border-color: #ffc47e !important;
    }

    html.joe-halloween-theme .joe-category-card.joe-portal-disabled .btn {
        background-color: #514539 !important;
        border: 1px solid #89745e;
        color: var(--jh-heading) !important;
    }

    html.joe-halloween-theme :is(h1, h2, h3, h4, h5, h6, .elementor-heading-title, .entry-title, .product_title, .woocommerce-loop-product__title) {
        color: var(--jh-heading);
    }

    html.joe-halloween-theme :is(.elementor-location-header, .elementor-location-footer) :is(a, .elementor-icon-list-text, .elementor-heading-title),
    html.joe-halloween-theme .header-primary-nav a,
    html.joe-halloween-theme .kitify-nova-menu__mobile-trigger a {
        color: var(--jh-heading) !important;
    }

    html.joe-halloween-theme :is(.elementor-location-header, .elementor-location-footer) a:hover,
    html.joe-halloween-theme .header-primary-nav a:hover {
        color: var(--jh-orange) !important;
    }

    html.joe-halloween-theme :is(.kitify-menu-account__icon, .kitify-search__popup-trigger-icon, .header-cart-icon, .elementor-widget-icon .elementor-icon) {
        color: var(--jh-heading) !important;
        fill: currentColor !important;
    }

    html.joe-halloween-theme :is(.off-canvas, .nova-offcanvas, .reveal, .select2-dropdown, .select2-results, .styling__quickview, .widget_shopping_cart_content, .search-modal, #headerSearchModal, .sub-menu, .dropdown-menu) {
        background-color: var(--jh-surface) !important;
        color: var(--jh-text);
        border-color: var(--jh-border) !important;
    }

    html.joe-halloween-theme :is(.off-canvas, .nova-offcanvas, .reveal, .sub-menu) a:not(.button):not(.elementor-button) {
        color: var(--jh-heading);
    }

    html.joe-halloween-theme :is(.card, .cart_totals, .woocommerce-MyAccount-content .joe-account-link, .woocommerce-Address, .woocommerce form.login, .woocommerce form.register, #payment, .wc-block-components-sidebar, .wc-block-components-order-summary) {
        background-color: var(--jh-surface) !important;
        color: var(--jh-text);
        border-color: var(--jh-border) !important;
    }

    html.joe-halloween-theme .woocommerce-MyAccount-content .joe-account-link:hover {
        background-color: var(--jh-raised) !important;
        border-color: var(--jh-orange) !important;
    }

    /* Product tabs use Foundation panels with their own white backgrounds. */
    html.joe-halloween-theme .nova-woocommerce-tabs :is(.tabs, .tabs-content, .accordion, .accordion-content),
    html.joe-halloween-theme .woocommerce-tabs :is(.wc-tabs, .woocommerce-Tabs-panel) {
        background-color: var(--jh-surface) !important;
        color: var(--jh-text) !important;
        border-color: var(--jh-border) !important;
    }

    html.joe-halloween-theme .nova-woocommerce-tabs :is(.tabs-panel, .tabs-title > a, .accordion-title),
    html.joe-halloween-theme .woocommerce-tabs .wc-tabs li {
        background-color: transparent !important;
        color: var(--jh-heading) !important;
        border-color: var(--jh-border) !important;
    }

    html.joe-halloween-theme .nova-woocommerce-tabs :is(.tabs-title.is-active > a, .tabs-title > a:hover, .accordion-item.is-active > .accordion-title),
    html.joe-halloween-theme .woocommerce-tabs .wc-tabs li.active a {
        color: var(--jh-orange) !important;
    }

    html.joe-halloween-theme .nova-woocommerce-tabs .tabs-title > a::after {
        background-color: var(--jh-orange) !important;
    }

    html.joe-halloween-theme :is(.joe-new-orders-search, .joe-new-order-card, .joe-mm-dialog, .joe-mm-upload-dialog, .joe-mm-header, .joe-mm-actions, .joe-mm-brand-bar, .joe-mm-toolbar, .joe-mm-footer, .joe-mm-pager, .joe-cpo-file-drop__zone) {
        background-color: var(--jh-surface) !important;
        color: var(--jh-text);
        border-color: var(--jh-border);
    }

    html.joe-halloween-theme .joe-new-order-card__header {
        background-color: var(--jh-raised);
    }

    html.joe-halloween-theme .joe-new-order-card--attention {
        border-color: #f09b90;
    }

    html.joe-halloween-theme :is(.joe-new-orders-search label, .joe-new-order-card__meta-item strong, .joe-new-order-card__activity-name, .joe-new-order-card__activity-name strong, .joe-mm-header h4) {
        color: var(--jh-heading);
    }

    html.joe-halloween-theme :is(.joe-new-order-card__meta-item > span, .joe-new-order-card__meta-item small, .joe-new-order-card__activity-name span, .joe-new-order-item__details, .joe-new-order-item__reference, .joe-mm-brand-bar strong, .joe-mm-toolbar strong) {
        color: var(--jh-text);
    }

    html.joe-halloween-theme :is(.joe-new-order-link, .joe-new-order-item__title) {
        color: var(--jh-orange);
    }

    html.joe-halloween-theme :is(.joe-new-order-button, .joe-new-order-side-button, .joe-mm-pill:not(.active)) {
        background-color: var(--jh-raised);
        color: var(--jh-heading);
        border-color: #89745e;
    }

    html.joe-halloween-theme .joe-new-order-button--primary,
    html.joe-halloween-theme :is(#joeMMOpenUpload, #joeMMApply, #joeMMUploadBtn) {
        background-color: var(--jh-orange) !important;
        border-color: var(--jh-orange) !important;
        color: #23170d !important;
    }

    html.joe-halloween-theme :is(.joe-new-order-button, .joe-new-order-side-button, .joe-mm-pill):hover {
        border-color: var(--jh-orange);
    }

    html.joe-halloween-theme :is(#joeMMClose, #joeMMUploadClose, #joeMMToggleFacets, #joeMMReload, #joeMMPrev, #joeMMNext) {
        background-color: var(--jh-raised) !important;
        color: var(--jh-heading) !important;
        border-color: #89745e !important;
    }

    html.joe-halloween-theme .joe-cpo-file-drop__zone.is-invalid {
        border-color: #f09b90;
    }

    html.joe-halloween-theme .joe-cpo-file-drop__zone:is(:hover, :focus-within, .is-dragover) {
        border-color: var(--jh-orange);
    }

    html.joe-halloween-theme .woocommerce-MyAccount-navigation a::before,
    html.joe-halloween-theme .joe-account-link__icon img {
        filter: brightness(0) invert(.9);
    }

    html.joe-halloween-theme :is(table, th, td, fieldset, hr, .woocommerce-MyAccount-navigation li) {
        border-color: var(--jh-border) !important;
    }

    html.joe-halloween-theme table {
        background-color: transparent;
        color: var(--jh-text);
    }

    /* YITH defines wishlist cell colours separately from the WooCommerce theme. */
    html.joe-halloween-theme :is(.yith-wcwl-form, .wishlist_table) {
        --color-wishlist-table-background: var(--jh-surface);
        --color-wishlist-table-text: var(--jh-text);
        --color-wishlist-table-border: var(--jh-border);
        --color-headers-background: var(--jh-raised);
        --color-add-to-cart-background: var(--jh-orange);
        --color-add-to-cart-text: #23170d;
        --color-add-to-cart-border: var(--jh-orange);
        --color-add-to-cart-background-hover: #ffc47e;
        --color-add-to-cart-text-hover: #23170d;
        --color-add-to-cart-border-hover: #ffc47e;
    }

    html.joe-halloween-theme .wishlist_table,
    html.joe-halloween-theme .wishlist_table :is(thead, tbody, tfoot, tr, th, td, .item-details),
    html.joe-halloween-theme .wishlist_table.modern_grid .item-details::before {
        background-color: var(--jh-surface) !important;
        color: var(--jh-text);
        border-color: var(--jh-border) !important;
    }

    html.joe-halloween-theme .wishlist_table :is(.product-name a, .product-price, .product-price .amount, .wishlist-empty) {
        color: var(--jh-heading) !important;
    }

    html.joe-halloween-theme body .wishlist_table .product-add-to-cart :is(a.add_to_cart, a.add_to_cart_button, a.product_type_variable, a.product_type_grouped, a.product_type_external) {
        background: transparent !important;
        color: var(--jh-orange) !important;
        border-color: transparent !important;
    }

    html.joe-halloween-theme body .wishlist_table .product-add-to-cart a:hover {
        color: #ffc47e !important;
    }

    html.joe-halloween-theme .wishlist_table .product-remove a.remove {
        background: transparent !important;
        color: var(--jh-text) !important;
    }

    html.joe-halloween-theme .wishlist_table .product-remove a.remove:hover {
        background: #3a241e !important;
        color: #f09b90 !important;
    }

    html.joe-halloween-theme .wishlist_table .wishlist-in-stock {
        color: #b3d39c;
    }

    html.joe-halloween-theme .wishlist_table .wishlist-out-of-stock {
        color: #f09b90;
    }

    html.joe-halloween-theme :is(thead, tfoot),
    html.joe-halloween-theme .woocommerce table tbody tr:nth-child(even) {
        background-color: #201c1870;
    }

    html.joe-halloween-theme :is(th, .woocommerce-MyAccount-navigation a, .woocommerce-MyAccount-content .joe-account-link__label, .woocommerce form label, .woocommerce .price) {
        color: var(--jh-heading);
    }

    html.joe-halloween-theme :is(input:not([type="submit"]):not([type="button"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="image"]):not([type="color"]), textarea, select, .select2-container--default .select2-selection--single, .select2-container--default .select2-selection--multiple) {
        background-color: var(--jh-raised) !important;
        color: var(--jh-heading) !important;
        border-color: #89745e !important;
        color-scheme: dark;
    }

    html.joe-halloween-theme :is(input, textarea)::placeholder {
        color: #c1b2a2;
        opacity: 1;
    }

    html.joe-halloween-theme .select2-container--default .select2-selection__rendered {
        color: var(--jh-heading);
    }

    html.joe-halloween-theme .select2-results__option[aria-selected="true"],
    html.joe-halloween-theme .select2-results__option--highlighted {
        background-color: var(--jh-raised) !important;
        color: var(--jh-heading) !important;
    }

    html.joe-halloween-theme body :is(.button, .elementor-button, .single_add_to_cart_button, .wc-block-components-button:not(.is-link), button[type="submit"], input[type="submit"], .button-1, .video-modal-btn) {
        background-color: var(--jh-orange) !important;
        color: #23170d !important;
        border-color: var(--jh-orange) !important;
        box-shadow: 0 0 18px #ffad5014;
    }

    html.joe-halloween-theme body :is(.button, .elementor-button, .single_add_to_cart_button, button[type="submit"], input[type="submit"], .video-modal-btn):hover {
        background-color: #ffc47e !important;
        border-color: #ffc47e !important;
        color: #23170d !important;
    }

    html.joe-halloween-theme :is(a, button, input, textarea, select):focus-visible {
        outline: 2px solid var(--jh-orange) !important;
        outline-offset: 3px;
    }

    html.joe-halloween-theme :is(.woocommerce-info, .woocommerce-message, .woocommerce-error) {
        background: var(--jh-surface) !important;
        color: var(--jh-heading) !important;
    }

    html.joe-halloween-theme .woocommerce-info { border-top-color: var(--jh-orange); }
    html.joe-halloween-theme .woocommerce-error { border-top-color: #f09b90; }
    html.joe-halloween-theme .woocommerce-message { border-top-color: #a9c792; }

    /* Keep the classic checkout's column gutter outside the coloured panels. */
    html.joe-halloween-theme body.woocommerce-checkout .woocommerce form.checkout .woocommerce-checkout-review-order {
        background: transparent !important;
    }

    html.joe-halloween-theme body.woocommerce-checkout .woocommerce table.woocommerce-checkout-review-order-table {
        width: 100%;
        margin: 0 0 20px;
        border: 1px solid var(--jh-border);
        border-collapse: collapse;
        background: var(--jh-surface) !important;
        color: var(--jh-text);
    }

    html.joe-halloween-theme body.woocommerce-checkout .woocommerce table.woocommerce-checkout-review-order-table :is(thead, tbody, tfoot, tr, th, td) {
        background: transparent !important;
        color: var(--jh-text);
    }

    html.joe-halloween-theme body.woocommerce-checkout .woocommerce table.woocommerce-checkout-review-order-table :is(th, td) {
        padding: 16px 20px !important;
        font-size: 14px !important;
        line-height: 1.5;
        vertical-align: top;
    }

    html.joe-halloween-theme body.woocommerce-checkout .woocommerce table.woocommerce-checkout-review-order-table thead th,
    html.joe-halloween-theme body.woocommerce-checkout .woocommerce table.woocommerce-checkout-review-order-table .order-total :is(th, td) {
        background: var(--jh-raised) !important;
        color: var(--jh-heading);
        font-weight: 600;
    }

    html.joe-halloween-theme body.woocommerce-checkout .woocommerce table.woocommerce-checkout-review-order-table tfoot :is(th, td) {
        border-top: 1px solid var(--jh-border);
    }

    html.joe-halloween-theme body.woocommerce-checkout .woocommerce table.woocommerce-checkout-review-order-table :is(.product-total, tfoot td) {
        text-align: right;
        white-space: nowrap;
    }

    html.joe-halloween-theme body.woocommerce-checkout .woocommerce table.woocommerce-checkout-review-order-table .order-total td,
    html.joe-halloween-theme body.woocommerce-checkout .woocommerce table.woocommerce-checkout-review-order-table .order-total bdi {
        color: var(--jh-orange);
        font-size: 16px !important;
    }

    html.joe-halloween-theme body.woocommerce-checkout .woocommerce :is(.woocommerce-activity-name-field, #payment) {
        box-sizing: border-box;
        padding: 20px;
        margin: 0 0 20px;
        border: 1px solid var(--jh-border);
        background: var(--jh-surface) !important;
        color: var(--jh-text);
    }

    html.joe-halloween-theme body.woocommerce-checkout .woocommerce-activity-name-field .form-row {
        padding: 0;
        margin: 0;
    }

    html.joe-halloween-theme body.woocommerce-checkout .joe-activity-name-description {
        color: #c1b2a2 !important;
    }

    html.joe-halloween-theme body.woocommerce-checkout .woocommerce #payment .payment_methods {
        padding: 0;
        margin: 0;
    }

    html.joe-halloween-theme body.woocommerce-checkout .woocommerce #payment .wc_payment_method {
        padding: 0 0 20px;
        margin: 0 0 20px;
    }

    html.joe-halloween-theme body.woocommerce-checkout .woocommerce #payment .wc_payment_method:last-child {
        padding-bottom: 0;
        margin-bottom: 0;
    }

    html.joe-halloween-theme body.woocommerce-checkout .woocommerce #payment .payment_box {
        padding: 12px 0 0;
        margin: 0;
        background: transparent !important;
        color: var(--jh-text);
    }

    html.joe-halloween-theme body.woocommerce-checkout .woocommerce #payment .payment_box .form-row {
        padding: 0;
        margin: 0 0 16px;
    }

    html.joe-halloween-theme body.woocommerce-checkout .woocommerce #payment .place-order {
        padding: 20px 0 0;
        margin: 20px 0 0;
        border-top: 1px solid var(--jh-border);
    }

    html.joe-halloween-theme body.woocommerce-checkout .woocommerce #payment .woocommerce-privacy-policy-text {
        padding-right: 0;
    }

    html.joe-halloween-theme body.woocommerce-checkout #place_order {
        box-sizing: border-box;
        width: 100%;
        margin: 0 !important;
    }

    @media (max-width: 767px) {
        html.joe-halloween-theme body.woocommerce-checkout .woocommerce table.woocommerce-checkout-review-order-table :is(th, td) {
            padding: 12px !important;
        }

        html.joe-halloween-theme body.woocommerce-checkout .woocommerce :is(.woocommerce-activity-name-field, #payment) {
            padding: 16px;
        }
    }

    /* Light marketing images get a scrim; product and customer artwork stay untouched. */
    html.joe-halloween-theme .kitify-bannerlist__image::after {
        background: #141210 !important;
        opacity: .68 !important;
    }

    html.joe-halloween-theme .kitify-bannerlist__title,
    html.joe-halloween-theme .kitify-bannerlist__desc {
        color: var(--jh-heading) !important;
    }

    html.joe-halloween-theme .elementor .elementor-element.e-con.joe-halloween-image-panel {
        background-color: #66513e !important;
        background-blend-mode: multiply;
    }

    html.joe-halloween-theme .joe-halloween-image-panel .elementor-heading-title {
        color: var(--jh-heading) !important;
        text-shadow: 0 2px 12px #141210b3;
    }

    html.joe-halloween-theme .kitify-carousel .kitify-arrow {
        background-color: var(--jh-raised) !important;
        color: var(--jh-heading) !important;
    }

    html.joe-halloween-theme .joe-halloween-seasonal-note {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 12px;
        min-height: 36px;
        padding: 8px 20px;
        background: #292017;
        border-bottom: 1px solid #ffad502b;
        color: #ffc47e;
        font-size: 12px;
        font-weight: 500;
        line-height: 1.5;
        letter-spacing: .08em;
        text-align: center;
    }

    .joe-halloween-seasonal-note::before,
    .joe-halloween-seasonal-note::after {
        content: "";
        width: 22px;
        height: 1px;
        background: currentColor;
        opacity: .5;
    }

    html.joe-halloween-theme .joe-halloween-pumpkins {
        filter: drop-shadow(0 0 14px #fb953a40);
    }

    html.joe-halloween-theme #joe-halloween-hide {
        background: #2a2119;
        border-color: #77634f;
        color: #ffe5bf;
    }

    html.joe-halloween-theme #joe-halloween-hide:hover {
        background: #3a2b1d;
        border-color: var(--jh-orange);
    }

    .joe-halloween-cobweb {
        position: absolute;
        top: 0;
        left: 0;
        width: clamp(55px, 9vw, 130px);
        opacity: .3;
    }

    .joe-halloween-cobweb--right {
        right: 0;
        left: auto;
        transform: scaleX(-1);
    }

    .joe-halloween-cobweb img,
    .joe-halloween-night-sky img {
        width: 100%;
        height: auto;
    }

    .joe-halloween-night-sky {
        position: absolute;
        top: 120px;
        right: 8px;
        width: clamp(85px, 10vw, 155px);
        opacity: .7;
    }

    @media (max-width: 767px) {
        .joe-halloween-night-sky { top: 95px; width: 78px; right: -6px; opacity: .45; }
        html.joe-halloween-theme .joe-halloween-seasonal-note { min-height: 32px; font-size: 10px; }
    }
}

@media print {
    .joe-halloween-seasonal-note { display: none !important; }
}