/* Charcoal and gold color theme for the best-seller block. Card layout, typography, red prices and compact buy buttons use the existing shared styles. */
#ja-extra #Mod522.kvt-best-sellers {
    border: 1.5px solid transparent;
    background:
        radial-gradient(90% 120% at 0% 0%, #3a2d14 0%, rgba(58, 45, 20, 0) 60%) padding-box,
        linear-gradient(160deg, #1d1b18 0%, #111 100%) padding-box,
        linear-gradient(135deg, #f6d77a 0%, #6e5520 30%, #f3c95a 55%, #5c4718 80%, #e9c062 100%) border-box !important;
    box-shadow: 0 20px 40px -22px #000000b3;
}
#ja-extra #Mod522.kvt-best-sellers .workshome-title {
    border-bottom-color: #ffffff17;
    background: transparent !important;
}
#ja-extra #Mod522.kvt-best-sellers .workshome-title h2,
#ja-extra #Mod522.kvt-best-sellers .workshome-title h2 span {
    color: #f3c95a !important;
    background: none;
}
#ja-extra #Mod522.kvt-best-sellers .workshome-title h2 span { letter-spacing: .4px; }
@keyframes kvt-best-sellers-sheen {
    0%, 70% { background-position: 120% 0; }
    100% { background-position: -20% 0; }
}
@supports ((-webkit-background-clip: text) or (background-clip: text)) {
    #ja-extra #Mod522.kvt-best-sellers .workshome-title h2 span {
        background: linear-gradient(100deg, #c99329 0%, #f3c95a 35%, #fff7d6 48%, #f3c95a 60%, #c99329 100%);
        background-size: 250% 100%;
        background-position: 120% 0;
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent !important;
        animation: kvt-best-sellers-sheen 4.5s ease-in-out infinite;
    }
}
@media (prefers-reduced-motion: reduce) {
    #ja-extra #Mod522.kvt-best-sellers .workshome-title h2 span { animation: none; }
}
#ja-extra #Mod522.kvt-best-sellers .workshome-content {
    background: transparent !important;
}
#ja-extra #Mod522.kvt-best-sellers .kvt-sales-status {
    color: #bcaa80;
}
#ja-extra #Mod522.kvt-best-sellers .kvt-sales-more {
    background: linear-gradient(180deg, #ffe48a, #f2c23c);
    color: #1a1a1a !important;
    box-shadow: inset 0 1px 0 #fff5cc, 0 4px 14px -4px #f2c23c80;
}
#ja-extra #Mod522.kvt-best-sellers .kvt-sales-more::after {
    content: none;
}
#ja-extra #Mod522.kvt-best-sellers .kvt-sales-more:focus-visible {
    outline-color: #f3c95a;
}
#ja-extra #Mod522.kvt-best-sellers .blocksp .spacer {
    box-shadow: 0 1px 0 #ffffff0d, 0 10px 24px -14px #000;
}

/* Rank labels appear only after best-sellers.js has ordered every card by sold count. */
#ja-extra #Mod522.kvt-best-sellers .kvt-sales-ranked { counter-reset: kvt-sales-rank; }
#ja-extra #Mod522.kvt-best-sellers .kvt-sales-ranked > .blocksp { counter-increment: kvt-sales-rank; }
#ja-extra #Mod522.kvt-best-sellers .kvt-sales-ranked > .blocksp > .spacer::before {
    content: "TOP " counter(kvt-sales-rank);
    position: absolute;
    z-index: 4;
    top: -1px;
    right: -1px;
    padding: 4px 10px 4px 12px;
    border-radius: 0 12px 0 12px;
    background: #1d1b18;
    color: #f3c95a;
    font: 800 11px/16px Arial, sans-serif;
    letter-spacing: .6px;
    white-space: nowrap;
    pointer-events: none;
}
#ja-extra #Mod522.kvt-best-sellers .kvt-sales-ranked > .blocksp:nth-child(1) > .spacer::before {
    background: linear-gradient(180deg, #fff1b8, #f3c95a 55%, #c99329);
    color: #3b2a06;
    box-shadow: inset 0 1px 0 #fff8d8, 0 2px 6px #0000002e;
}
#ja-extra #Mod522.kvt-best-sellers .kvt-sales-ranked > .blocksp:nth-child(2) > .spacer::before {
    background: linear-gradient(180deg, #fff, #d5dae0 55%, #9da5ae);
    color: #2b3036;
    box-shadow: inset 0 1px 0 #fff, 0 2px 6px #0000002e;
}
#ja-extra #Mod522.kvt-best-sellers .kvt-sales-ranked > .blocksp:nth-child(3) > .spacer::before {
    background: linear-gradient(180deg, #ffe0c2, #dc9d63 55%, #a7642b);
    color: #3a1d06;
    box-shadow: inset 0 1px 0 #fff0e0, 0 2px 6px #0000002e;
}
#ja-extra #Mod522.kvt-best-sellers .kvt-sales-ranked > .blocksp:nth-child(1) > .spacer {
    box-shadow: 0 0 0 2px #f3c95a, 0 10px 28px -10px #f3c95a73;
}
@media (max-width: 600px) {
    #ja-extra #Mod522.kvt-best-sellers .kvt-sales-ranked > .blocksp > .spacer::before {
        padding: 3px 7px 3px 9px;
        font-size: 10px;
        line-height: 14px;
    }
}
