/* AJO89 Ember Rose — color and motion layer only. */
:root {
    --ajo89-obsidian: #090202;
    --ajo89-ink: #120403;
    --ajo89-wine: #260705;
    --ajo89-burgundy: #5f100c;
    --ajo89-crimson: #9f1d14;
    --ajo89-scarlet: #d93a1e;
    --ajo89-ember: #f97316;
    --ajo89-gold: #ffc247;
    --ajo89-gold-soft: #ffe0a3;
    --ajo89-ivory: #fff4e5;
    --ajo89-muted: #d7b9a1;
    --ajo89-line: rgba(255, 194, 71, .32);
    --ajo89-glow: rgba(249, 115, 22, .24);
}

html {
    color-scheme: dark;
    background: var(--ajo89-obsidian);
}

body#items_show_body {
    color: var(--ajo89-ivory);
    background:
        radial-gradient(circle at 50% -12%, rgba(217, 58, 30, .28), transparent 35%),
        radial-gradient(circle at 8% 32%, rgba(159, 29, 20, .14), transparent 28%),
        radial-gradient(circle at 94% 70%, rgba(249, 115, 22, .10), transparent 30%),
        linear-gradient(180deg, #160504 0%, var(--ajo89-obsidian) 34%, #120403 100%) !important;
    background-size: 120% 120%, 130% 130%, 130% 130%, auto;
    animation: ajo89EmberDrift 18s ease-in-out infinite alternate;
}

body#items_show_body::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background:
        radial-gradient(circle at 20% 15%, rgba(255, 194, 71, .08) 0 1px, transparent 2px),
        radial-gradient(circle at 76% 42%, rgba(249, 115, 22, .08) 0 1px, transparent 2px);
    background-size: 82px 82px, 116px 116px;
    opacity: .65;
    animation: ajo89EmberField 14s ease-in-out infinite alternate;
}

/* Foundation surfaces */
#main_wrapper,
#content,
.item_listing_content_wrapper,
.item_listing_main,
.item_listing_basic_info,
.item_listing_item_description {
    color: var(--ajo89-ivory);
    background-color: transparent !important;
}

#header,
#floating_header,
.header_utilities,
.header_search,
.responsive_header_search {
    color: var(--ajo89-ivory) !important;
    background: linear-gradient(180deg, rgba(72, 12, 8, .98), rgba(18, 4, 3, .98)) !important;
    border-color: var(--ajo89-line) !important;
    box-shadow:
        0 1px 0 rgba(255, 224, 163, .08) inset,
        0 14px 38px rgba(0, 0, 0, .36),
        0 0 32px rgba(217, 58, 30, .08) !important;
}

.header_top_level_menu_item > a,
.header_top_level_button_item > a,
.header_utilities a,
.responsive_header_menu a {
    color: var(--ajo89-gold-soft) !important;
    text-shadow: 0 1px 12px rgba(249, 115, 22, .20);
}

.header_top_level_menu_item > a:hover,
.header_top_level_button_item > a:hover,
.header_utilities a:hover,
.responsive_header_menu a:hover {
    color: var(--ajo89-ivory) !important;
    background-color: rgba(249, 115, 22, .12) !important;
    text-shadow: 0 0 16px rgba(255, 194, 71, .42);
}

.header_subnav_menu,
.header_secondary_level_menu,
.responsive_header_menu,
.popup_container,
.new_email_form_container {
    color: var(--ajo89-ivory) !important;
    background: linear-gradient(145deg, rgba(38, 7, 5, .99), rgba(9, 2, 2, .99)) !important;
    border-color: var(--ajo89-line) !important;
    box-shadow: 0 22px 54px rgba(0, 0, 0, .62), 0 0 28px rgba(249, 115, 22, .10) !important;
}

.header_search_container input,
.responsive_header_search_form input,
input[type="text"],
input[type="email"],
textarea,
select {
    color: var(--ajo89-ivory) !important;
    caret-color: var(--ajo89-gold);
    background: rgba(9, 2, 2, .78) !important;
    border-color: rgba(255, 194, 71, .38) !important;
    box-shadow: 0 1px 0 rgba(255, 255, 255, .04) inset !important;
}

input::placeholder,
textarea::placeholder {
    color: rgba(215, 185, 161, .72) !important;
}

input:focus,
textarea:focus,
select:focus {
    border-color: var(--ajo89-gold) !important;
    outline-color: var(--ajo89-gold) !important;
    box-shadow: 0 0 0 3px rgba(255, 194, 71, .12), 0 0 20px rgba(249, 115, 22, .14) !important;
}

a,
a.bold {
    color: var(--ajo89-gold) !important;
}

a:hover,
a.bold:hover {
    color: var(--ajo89-gold-soft) !important;
    text-shadow: 0 0 14px rgba(249, 115, 22, .34);
}

button,
input[type="submit"],
.button,
.tabset_button,
.btn,
.btn-premium,
.ajo89-btn-info,
.description_toggle_link,
.header_subnav_menu_button,
.link_to_register_ajo89,
.support-name__detail a,
.header_search_container .search-btn {
    color: var(--ajo89-ivory) !important;
    background: linear-gradient(135deg, var(--ajo89-burgundy), var(--ajo89-scarlet) 52%, var(--ajo89-ember)) !important;
    border-color: rgba(255, 194, 71, .68) !important;
    box-shadow:
        0 8px 22px rgba(0, 0, 0, .34),
        0 0 18px rgba(249, 115, 22, .16),
        0 1px 0 rgba(255, 244, 229, .18) inset !important;
}

button:hover,
input[type="submit"]:hover,
.button:hover,
.tabset_button:hover,
.btn:hover,
.btn-premium:hover,
.ajo89-btn-info:hover,
.description_toggle_link:hover,
.header_subnav_menu_button:hover,
.link_to_register_ajo89:hover,
.support-name__detail a:hover,
.header_search_container .search-btn:hover {
    color: #fffaf1 !important;
    background: linear-gradient(135deg, var(--ajo89-crimson), var(--ajo89-ember) 58%, var(--ajo89-gold)) !important;
    border-color: var(--ajo89-gold) !important;
    box-shadow:
        0 10px 28px rgba(0, 0, 0, .42),
        0 0 24px rgba(249, 115, 22, .32),
        0 1px 0 rgba(255, 255, 255, .24) inset !important;
}

#breadcrumb,
.item_listing_breadcrumbs,
.item_listing_title_and_price,
.item_listing_images,
.item_listing_seller_details,
.item_listing_shipping_info,
.item_status_and_price_container {
    color: var(--ajo89-ivory) !important;
    background-color: rgba(18, 4, 3, .72) !important;
    border-color: var(--ajo89-line) !important;
}

.item_price,
.user_feedback_stars_container,
.fa-star,
.fa-star-o {
    color: var(--ajo89-gold) !important;
    text-shadow: 0 0 12px rgba(255, 194, 71, .28);
}

#footer,
.footer_top,
.footer_bottom {
    color: var(--ajo89-muted) !important;
    background: linear-gradient(180deg, rgba(31, 6, 4, .98), var(--ajo89-obsidian)) !important;
    border-color: var(--ajo89-line) !important;
}

#footer h1,
#footer h2,
#footer h3,
#footer h4,
#footer h5,
#footer h6 {
    color: var(--ajo89-gold-soft) !important;
}

/* Modal palette from the supplied artwork */
#popup-blue-electric {
    background: rgba(9, 2, 2, .91) !important;
}

#popup-blue-electric > div {
    background:
        radial-gradient(circle at 50% 0, rgba(249, 115, 22, .22), transparent 42%),
        linear-gradient(145deg, #120403, #260705 52%, #8f1d14) !important;
    border-color: rgba(255, 194, 71, .78) !important;
    box-shadow: 0 42px 94px rgba(0, 0, 0, .92), 0 0 52px rgba(249, 115, 22, .24) !important;
}

#popup-blue-electric img {
    border-color: rgba(255, 194, 71, .42) !important;
    filter: drop-shadow(0 12px 24px rgba(0, 0, 0, .52)) drop-shadow(0 0 16px rgba(249, 115, 22, .20));
}

#popup-blue-electric svg line {
    stroke: var(--ajo89-gold) !important;
}

/* Accessible focus and scrollbar */
:focus-visible {
    outline: 2px solid var(--ajo89-gold) !important;
    outline-offset: 3px;
}

* {
    scrollbar-color: var(--ajo89-crimson) var(--ajo89-obsidian);
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(15px) scale(.96);
        filter: saturate(.72) brightness(.76);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
        filter: saturate(1) brightness(1);
    }
}

@keyframes ajo89EmberDrift {
    0% { background-position: 50% 0, 0 28%, 100% 72%, 0 0; }
    100% { background-position: 46% 4%, 4% 34%, 96% 66%, 0 0; }
}

@keyframes ajo89EmberField {
    from { opacity: .38; transform: translate3d(0, 0, 0); }
    to { opacity: .72; transform: translate3d(0, -8px, 0); }
}

@media (prefers-reduced-motion: reduce) {
    body#items_show_body,
    body#items_show_body::before,
    #popup-blue-electric > div {
        animation: none !important;
    }
}
