/* =========================================
   VULTREX TRACKING — BLACK & GOLD
   Visual styling only
   No background-image or JS changes
========================================= */

:root {
    --gold: #f4c95d;
    --gold2: #ffe29a;
    --gold3: #b88625;
    --primary: #e8b84c;
    --accent: #f4d17b;
    --info: #e8b84c;
    --goldline: rgba(232, 184, 76, .38);

    --vx-green: #e8b84c;
    --vx-mint: #f7d991;
    --vx-gold: #f4c95d;
    --vx-white: #f8fafc;
    --vx-panel: rgba(18, 17, 15, .96);
}

/* ================= HEADER ================= */

.brand-kicker {
    color: #f8fafc !important;
    border-color: rgba(232, 184, 76, .65) !important;
    background: rgba(18, 17, 15, .90) !important;
    box-shadow: 0 0 22px rgba(232, 184, 76, .12) !important;
}

.brand-kicker::before {
    background: #e8b84c !important;
    box-shadow: 0 0 13px #e8b84c !important;
}

/* Remove the large green logo box */

.logo-shell {
    width: 350px !important;
    height: 235px !important;
    max-width: 90vw !important;
    padding: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;

    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.logo-shell::before,
.logo-shell::after {
    display: none !important;
}

.logo-shell .logo-img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    padding: 0 !important;
    margin: 0 auto !important;

    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;

    object-fit: contain !important;
    object-position: center !important;
    filter: drop-shadow(0 8px 18px rgba(0, 0, 0, .55)) !important;
}

/* VULTREX wordmark */

.logo-text {
    background: linear-gradient(110deg,
            #ffffff 0%,
            #e2e8f0 24%,
            #f9dfaa 46%,
            #e8b84c 72%,
            #f4c95d 100%) !important;

    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;

    filter:
        drop-shadow(0 4px 2px rgba(0, 0, 0, .75)) drop-shadow(0 0 15px rgba(232, 184, 76, .20)) !important;
}

.header::after,
.logo-text::after {
    background: linear-gradient(90deg,
            transparent,
            #e8b84c,
            #f4c95d,
            #e8b84c,
            transparent) !important;
    box-shadow: 0 0 16px rgba(232, 184, 76, .22) !important;
}

.brand-subtitle {
    background: rgba(19, 17, 13, .90) !important;
    border-color: rgba(232, 184, 76, .55) !important;
    box-shadow: 0 0 22px rgba(232, 184, 76, .10) !important;
}

.brand-subtitle-main {
    color: #f8fafc !important;
    -webkit-text-fill-color: #f8fafc !important;
}

.brand-subtitle-accent {
    background: none !important;
    color: #f4c95d !important;
    -webkit-text-fill-color: #f4c95d !important;
}

/* ================= MAIN PANELS ================= */

.tracking-card,
.stat-box,
.screenshot-card,
.buyer-info-card,
.completion-info-panel,
.completion-review {
    background:
        radial-gradient(circle at top left,
            rgba(232, 184, 76, .13),
            transparent 45%),
        linear-gradient(145deg,
            rgba(23, 21, 18, .97),
            rgba(12, 12, 13, .98)) !important;

    border-color: rgba(232, 184, 76, .48) !important;

    box-shadow:
        0 18px 45px rgba(0, 0, 0, .42),
        0 0 22px rgba(232, 184, 76, .08),
        inset 0 1px 0 rgba(255, 255, 255, .05) !important;
}

.card::before,
.buyer-info-card::before,
.stat-box::before {
    background: linear-gradient(90deg,
            transparent,
            #bd8b29,
            #f4d17b,
            #f4c95d,
            #e8b84c,
            transparent) !important;
    box-shadow: 0 0 15px rgba(232, 184, 76, .20) !important;
}

/* ================= CUSTOMER INFO ================= */

.buyer-info-grid {
    background: rgba(17, 16, 14, .78) !important;
    border-color: rgba(232, 184, 76, .28) !important;
}

.buyer-info-item {
    border-color: rgba(232, 184, 76, .22) !important;
}

.buyer-info-item:hover {
    background: rgba(232, 184, 76, .08) !important;
}

.buyer-info-item-icon {
    background: linear-gradient(145deg,
            rgba(232, 184, 76, .28),
            rgba(65, 48, 21, .65)) !important;

    border-color: rgba(247, 217, 145, .75) !important;
    color: #f9dfaa !important;

    box-shadow: 0 0 15px rgba(232, 184, 76, .23) !important;
}

.buyer-info-item-icon svg {
    color: #f9dfaa !important;
    stroke: #f9dfaa !important;
}

.buyer-info-label {
    color: #ffe0a0 !important;
    -webkit-text-fill-color: #ffe0a0 !important;
}

.buyer-info-value {
    color: #f8fafc !important;
    -webkit-text-fill-color: #f8fafc !important;
}

/* ================= ORDER STATUS ================= */

.status-badge,
.status-badge.active-status {
    color: #fff0cc !important;
    -webkit-text-fill-color: #fff0cc !important;

    background: linear-gradient(120deg,
            rgba(69, 50, 20, .95),
            rgba(93, 67, 24, .60)) !important;

    border-color: rgba(244, 209, 123, .75) !important;

    box-shadow:
        0 0 22px rgba(232, 184, 76, .18),
        inset 0 1px 0 rgba(255, 255, 255, .10) !important;
}

.status-badge::before {
    background: linear-gradient(145deg,
            #ffe0a0,
            #bd8b29) !important;
    border-color: #f9dfaa !important;
    box-shadow: 0 0 14px rgba(232, 184, 76, .40) !important;
}

/* Warning and payment-pending colors */

.status-badge.warning-status,
.status-badge.daily-limit-alert {
    color: #ffe29a !important;
    -webkit-text-fill-color: #ffe29a !important;

    background: linear-gradient(120deg,
            rgba(91, 62, 8, .90),
            rgba(41, 39, 12, .90)) !important;

    border-color: rgba(245, 190, 58, .80) !important;
    box-shadow: 0 0 24px rgba(245, 190, 58, .19) !important;
}

.status-badge.warning-status::before,
.status-badge.daily-limit-alert::before {
    background: linear-gradient(145deg,
            #ffe29a,
            #d69e22) !important;
    border-color: #ffe29a !important;
    box-shadow: 0 0 15px rgba(245, 190, 58, .35) !important;
}

/* Keep danger visibly red */

.status-badge.danger-status {
    color: #fecaca !important;
    -webkit-text-fill-color: #fecaca !important;
    background: rgba(100, 20, 25, .85) !important;
    border-color: rgba(248, 113, 113, .65) !important;
}

/* ================= PROGRESS RING ================= */

.progress-circle {
    background: conic-gradient(from -90deg,
            #e8b84c 0deg,
            #f4d17b var(--progress-angle),
            rgba(45, 36, 23, .85) var(--progress-angle),
            rgba(45, 36, 23, .85) 360deg) !important;

    border-color: rgba(244, 209, 123, .65) !important;

    box-shadow:
        0 0 0 1px rgba(232, 184, 76, .38),
        0 0 26px rgba(232, 184, 76, .23) !important;
}

.progress-circle::before,
.progress-circle::after {
    border-color: rgba(244, 209, 123, .40) !important;
    box-shadow: 0 0 16px rgba(232, 184, 76, .18) !important;
}

.progress-circle-inner {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    background: rgba(17, 16, 14, .98) !important;
    border-color: rgba(244, 209, 123, .48) !important;
    overflow: hidden !important;
}

.progress-circle-inner img {
    display: block !important;
    width: 85% !important;
    height: 85% !important;
    max-width: 85% !important;
    max-height: 85% !important;
    object-fit: contain !important;
    object-position: center !important;
    margin: auto !important;
    border-radius: 0 !important;
}

.progress-label {
    color: #f4c95d !important;
    -webkit-text-fill-color: #f4c95d !important;
}

.percent-text {
    color: #fff0cc !important;
    -webkit-text-fill-color: #fff0cc !important;
    text-shadow: 0 0 16px rgba(232, 184, 76, .24) !important;
}

.bar-fill {
    background: linear-gradient(90deg,
            #95681f,
            #e8b84c,
            #ffe0a0) !important;
}

/* ================= STATUS MESSAGE ================= */

.msg-box.unified-status-card,
.msg-box.unified-status-card.info {
    background: linear-gradient(135deg,
            rgba(23, 21, 18, .97),
            rgba(13, 13, 14, .98)) !important;
    border-color: rgba(232, 184, 76, .46) !important;
    color: #e2e8f0 !important;
}

.msg-box.unified-status-card>strong:first-child {
    color: #ffe0a0 !important;
    -webkit-text-fill-color: #ffe0a0 !important;
}

.msg-box.unified-status-card.warning {
    background: linear-gradient(135deg,
            rgba(65, 47, 11, .90),
            rgba(24, 25, 18, .97)) !important;
    border-color: rgba(245, 190, 58, .55) !important;
}

.msg-box.unified-status-card.warning>strong:first-child {
    color: #ffe29a !important;
    -webkit-text-fill-color: #ffe29a !important;
}

.msg-box.unified-status-card.success {
    border-color: rgba(232, 184, 76, .65) !important;
}

.msg-box.unified-status-card.danger {
    border-color: rgba(248, 113, 113, .65) !important;
}

/* ================= STATS ================= */

.stats-grid-top .stat-box,
.stats-grid-bottom .stat-box {
    background: linear-gradient(145deg,
            rgba(26, 22, 17, .96),
            rgba(14, 14, 15, .98)) !important;

    border-color: rgba(232, 184, 76, .45) !important;
}

.stats-grid-top .stat-icon,
.stats-grid-bottom .stat-icon {
    background: linear-gradient(145deg,
            rgba(232, 184, 76, .34),
            rgba(65, 48, 21, .80)) !important;

    border-color: rgba(247, 217, 145, .65) !important;
    box-shadow: 0 0 14px rgba(232, 184, 76, .23) !important;
}

.stats-grid-top .stat-icon svg,
.stats-grid-bottom .stat-icon svg {
    color: #f9dfaa !important;
    stroke: #f9dfaa !important;
}

.stats-grid-top .stat-title,
.stats-grid-bottom .stat-title {
    color: #f8fafc !important;
    -webkit-text-fill-color: #f8fafc !important;
}

.stats-grid-top .stat-val,
.stats-grid-bottom .stat-val {
    color: #ffe0a0 !important;
    -webkit-text-fill-color: #ffe0a0 !important;
    text-shadow: 0 0 12px rgba(232, 184, 76, .16) !important;
}

/* ================= SUPPORTING PANELS ================= */

.completion-info-icon,
.status-panel-icon,
.security-panel-icon {
    color: #f9dfaa !important;
    border-color: rgba(232, 184, 76, .50) !important;
    background: rgba(232, 184, 76, .12) !important;
}

.fifa-account-form {
    background: linear-gradient(145deg,
            rgba(25, 22, 18, .97),
            rgba(13, 13, 14, .98)) !important;
    border-color: rgba(232, 184, 76, .50) !important;
}

.fifa-form-kicker,
.fifa-field>span {
    color: #ffe0a0 !important;
}

.fifa-account-form .fifa-field input:focus {
    border-color: #f4d17b !important;
    box-shadow: 0 0 0 3px rgba(232, 184, 76, .14) !important;
}

/* ================= MOBILE ================= */

@media (max-width: 720px) {
    .logo-shell {
        width: 220px !important;
        height: 150px !important;
        max-width: 85vw !important;
        padding: 0 !important;
        border-radius: 0 !important;
    }

    .logo-shell .logo-img {
        width: 100% !important;
        height: 100% !important;
        border-radius: 0 !important;
    }

    .progress-circle-inner img {
        width: 80% !important;
        height: 80% !important;
        max-width: 80% !important;
        max-height: 80% !important;
    }
}


/* =========================================================
   VULTREX BLACK & GOLD V3 — OPTION 2 FINISHING
   Scoped visual overrides, preserving existing functionality
========================================================= */

/* Gold payment-style default; explicit danger/success states
   remain handled by existing status classes. */
#statusBadge:not(.danger-status):not(.active-status):not(.daily-limit-alert) {
    color: #fff4ce !important;
    -webkit-text-fill-color: #fff4ce !important;
    background: linear-gradient(110deg, rgba(85, 63, 13, .92), rgba(35, 29, 20, .96)) !important;
    border: 1px solid rgba(250, 203, 77, .86) !important;
    box-shadow: 0 0 21px rgba(245, 190, 58, .23), inset 0 1px 0 rgba(255, 255, 255, .13) !important;
}

#statusBadge:not(.danger-status):not(.active-status):not(.daily-limit-alert)::before {
    background: linear-gradient(145deg, #ffe79b, #eab638) !important;
    border-color: #ffe79b !important;
    box-shadow: 0 0 15px rgba(245, 190, 58, .48) !important;
}

/* Stats: remove every remaining purple accent, including
   the spinning icon pseudo-element from the original page. */
#statsGrid .stat-val,
.stats-grid .stat-val,
.stats-grid-top .stat-val,
.stats-grid-bottom .stat-val {
    color: #f4d27a !important;
    -webkit-text-fill-color: #f4d27a !important;
    text-shadow: 0 0 14px rgba(244, 210, 122, .20) !important;
}

.stats-grid-top .stat-icon,
.stats-grid-bottom .stat-icon,
.stats-grid .stat-icon {
    color: #eafff7 !important;
    border-color: rgba(244, 209, 123, .75) !important;
    background: linear-gradient(145deg, #352814, #15120d) !important;
    box-shadow: 0 0 15px rgba(232, 184, 76, .23), inset 0 1px 0 rgba(255, 255, 255, .10) !important;
}

.stats-grid-top .stat-icon::before,
.stats-grid-bottom .stat-icon::before,
.stats-grid .stat-icon::before {
    background: conic-gradient(from 210deg,
            rgba(255, 255, 255, .10), #95681f, #e8b84c, #ffe0a0, rgba(255, 255, 255, .10)) !important;
}

.stats-grid-top .stat-icon::after,
.stats-grid-bottom .stat-icon::after,
.stats-grid .stat-icon::after {
    background: linear-gradient(145deg, #332713, #17130e) !important;
}

.stats-grid-top .stat-icon svg,
.stats-grid-bottom .stat-icon svg,
.stats-grid .stat-icon svg {
    stroke: #fff0cc !important;
    color: #fff0cc !important;
    filter: drop-shadow(0 0 5px rgba(232, 184, 76, .3)) !important;
}

.stats-grid-top .stat-box:nth-child(n) .stat-icon {
    box-shadow: 0 0 17px rgba(232, 184, 76, .26), inset 0 1px 0 rgba(255, 255, 255, .10) !important;
}

/* Rebuild the ring with a cleaner emerald + gold look.
   Keep --progress-angle controlled by existing JS. */
#progressCircle {
    isolation: isolate;
    background: conic-gradient(from -90deg,
            #f4c95d 0deg,
            #e8b84c var(--progress-angle),
            rgba(55, 43, 24, .98) var(--progress-angle),
            rgba(24, 20, 14, .98) 360deg) !important;
    border: 2px solid rgba(247, 217, 145, .48) !important;
    box-shadow: 0 0 0 5px rgba(232, 184, 76, .06),
        0 0 26px rgba(232, 184, 76, .22),
        0 0 32px rgba(244, 201, 93, .09) !important;
}

#progressCircle::before {
    background: radial-gradient(circle at 35% 25%, rgba(232, 184, 76, .12), transparent 48%),
        linear-gradient(145deg, #2b2113, #11100e) !important;
    border: 1px solid rgba(244, 201, 93, .46) !important;
    box-shadow: inset 0 0 20px rgba(0, 0, 0, .55) !important;
}

#progressCircle .progress-circle-inner {
    background: radial-gradient(circle at 50% 35%, #302514, #100e0c 80%) !important;
    border: 1px solid rgba(255, 224, 160, .72) !important;
    box-shadow: 0 0 0 3px rgba(232, 184, 76, .08),
        inset 0 0 16px rgba(0, 0, 0, .34) !important;
    overflow: hidden !important;
}

#progressCircle .progress-circle-inner img {
    width: 88% !important;
    height: 88% !important;
    max-width: 88% !important;
    max-height: 88% !important;
    object-fit: contain !important;
    filter: drop-shadow(0 2px 7px rgba(232, 184, 76, .24)) !important;
}


/* ==========================================================
   VULTREX TRACK — FINAL BLACK & GOLD OVERRIDES
   Keeps status logic, progress JS and responsive layout intact
========================================================== */
:root {
    --primary: #e8b84c;
    --accent: #f4d17b;
    --info: #e8b84c;
    --goldline: rgba(232, 184, 76, .46);
    --vx-green: #e8b84c;
    --vx-mint: #ffe0a0;
    --vx-panel: rgba(15, 14, 13, .96);
}

html,
body {
    min-height: 100%;
}

body {
    background-color: #090807 !important;
    background-image: linear-gradient(180deg, rgba(4, 4, 5, .64), rgba(5, 5, 6, .80)), url('../images/trackingBackgroundGold.png') !important;
    background-size: cover !important;
    background-position: center top !important;
    background-repeat: no-repeat !important;
    background-attachment: fixed !important;
    color: #f8f4e9 !important;
}

.header,
.header::before,
.tracking-container,
.main-container {
    border-color: rgba(232, 184, 76, .28) !important;
}

.tracking-card,
.card,
.stat-box,
.screenshot-card,
.buyer-info-card,
.completion-info-panel,
.completion-review,
.fifa-account-form,
.msg-box.unified-status-card,
.buyer-info-grid {
    background: linear-gradient(145deg, rgba(23, 21, 19, .97), rgba(8, 8, 9, .96)) !important;
    border-color: rgba(232, 184, 76, .46) !important;
    box-shadow: 0 16px 42px rgba(0, 0, 0, .45), 0 0 18px rgba(232, 184, 76, .06) !important;
}

.card::before,
.buyer-info-card::before,
.stat-box::before,
.header::after,
.logo-text::after {
    background: linear-gradient(90deg, transparent, #9b7025, #f4d17b, #e8b84c, transparent) !important;
    box-shadow: 0 0 12px rgba(232, 184, 76, .18) !important;
}

.brand-kicker,
.brand-subtitle {
    background: rgba(13, 12, 11, .91) !important;
    border-color: rgba(232, 184, 76, .52) !important;
}

.brand-kicker::before {
    background: #e8b84c !important;
    box-shadow: 0 0 12px rgba(232, 184, 76, .55) !important;
}

.logo-shell {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

.logo-shell::before,
.logo-shell::after {
    display: none !important;
}

.logo-text {
    background: linear-gradient(110deg, #fff 0%, #f9e6bb 34%, #f4c95d 72%, #c48d2a 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

.buyer-info-item {
    border-color: rgba(232, 184, 76, .24) !important;
}

.buyer-info-item:hover {
    background: rgba(232, 184, 76, .07) !important;
}

.buyer-info-item-icon,
.completion-info-icon,
.status-panel-icon,
.security-panel-icon {
    background: linear-gradient(145deg, rgba(232, 184, 76, .18), rgba(36, 27, 14, .72)) !important;
    color: #f4d17b !important;
    border-color: rgba(232, 184, 76, .58) !important;
}

.buyer-info-item-icon svg,
.completion-info-icon svg,
.status-panel-icon svg,
.security-panel-icon svg {
    color: #f4d17b !important;
    stroke: #f4d17b !important;
}

.buyer-info-label,
.fifa-form-kicker,
.fifa-field>span {
    color: #e8bc60 !important;
    -webkit-text-fill-color: #e8bc60 !important;
}

.stats-grid-top .stat-icon,
.stats-grid-bottom .stat-icon,
.stats-grid .stat-icon {
    background: linear-gradient(145deg, #493519, #17130d) !important;
    border-color: rgba(232, 184, 76, .65) !important;
}

.stats-grid-top .stat-icon::before,
.stats-grid-bottom .stat-icon::before,
.stats-grid .stat-icon::before {
    background: conic-gradient(from 210deg, #473516, #e8b84c, #ffe0a0, #473516) !important;
}

.stats-grid-top .stat-icon::after,
.stats-grid-bottom .stat-icon::after,
.stats-grid .stat-icon::after {
    background: linear-gradient(145deg, #3a2b17, #15120e) !important;
}

.stats-grid-top .stat-icon svg,
.stats-grid-bottom .stat-icon svg,
.stats-grid .stat-icon svg {
    color: #f9dfaa !important;
    stroke: #f9dfaa !important;
}

#progressCircle,
.progress-circle {
    background: conic-gradient(from -90deg, #f4d17b 0deg, #d5a13a var(--progress-angle), rgba(56, 44, 25, .95) var(--progress-angle), rgba(29, 25, 19, .98) 360deg) !important;
    border-color: rgba(232, 184, 76, .66) !important;
    box-shadow: 0 0 0 5px rgba(232, 184, 76, .05), 0 0 26px rgba(232, 184, 76, .18) !important;
}

#progressCircle::before {
    background: linear-gradient(145deg, #282116, #11100e) !important;
    border-color: rgba(232, 184, 76, .42) !important;
}

#progressCircle .progress-circle-inner,
.progress-circle-inner {
    background: radial-gradient(circle at 50% 30%, #302514, #0d0d0e 80%) !important;
    border-color: rgba(232, 184, 76, .56) !important;
}

.percent-text {
    color: #fff0cc !important;
    -webkit-text-fill-color: #fff0cc !important;
    text-shadow: 0 0 12px rgba(232, 184, 76, .2) !important;
}

.bar-fill {
    background: linear-gradient(90deg, #95681f, #e8b84c, #ffe0a0) !important;
}

/* Preserve semantic warning, error and success states. */
.status-badge:not(.danger-status):not(.warning-status):not(.daily-limit-alert) {
    background: linear-gradient(120deg, rgba(69, 49, 18, .92), rgba(28, 24, 17, .96)) !important;
    border-color: rgba(232, 184, 76, .75) !important;
    color: #fff0cc !important;
    -webkit-text-fill-color: #fff0cc !important;
}

.status-badge.danger-status {
    color: #fecaca !important;
    -webkit-text-fill-color: #fecaca !important;
    background: rgba(100, 20, 25, .85) !important;
    border-color: rgba(248, 113, 113, .65) !important;
}

.msg-box.unified-status-card.danger {
    border-color: rgba(248, 113, 113, .65) !important;
}

.msg-box.unified-status-card.warning {
    background: linear-gradient(135deg, rgba(65, 47, 11, .90), rgba(24, 25, 18, .97)) !important;
    border-color: rgba(245, 190, 58, .55) !important;
}

.fifa-account-form .fifa-field input:focus {
    border-color: #e8b84c !important;
    box-shadow: 0 0 0 3px rgba(232, 184, 76, .15) !important;
}

@media(max-width:720px) {
    body {
        background-attachment: scroll !important;
    }
}

/* Stronger selectors for legacy inline status / ring rules */
html body#top .brand-kicker {
    border-color: rgba(232, 184, 76, .7) !important;
    background: #100e0b !important;
}

html body#top .buyer-info-card,
html body#top .tracking-card,
html body#top .stat-box,
html body#top .msg-box.unified-status-card {
    background: linear-gradient(145deg, #17130e, #080809) !important;
    border-color: rgba(232, 184, 76, .55) !important;
}

html body#top .buyer-info-grid {
    background: #100f0d !important;
    border-color: rgba(232, 184, 76, .34) !important;
}

html body#top .status-badge:not(.danger-status):not(.warning-status) {
    background: linear-gradient(120deg, #4b3516, #19150e) !important;
    border-color: #c79a3c !important;
    color: #ffe7a9 !important;
    -webkit-text-fill-color: #ffe7a9 !important;
}

html body#top #progressCircle,
html body#top .progress-circle {
    background: conic-gradient(from -90deg, #ffe09a 0deg, #d4a53f var(--progress-angle), #302719 var(--progress-angle), #302719 360deg) !important;
    border-color: #c99c43 !important;
    box-shadow: 0 0 0 5px rgba(222, 174, 70, .08), 0 0 22px rgba(222, 174, 70, .22) !important;
}

html body#top #progressCircle::before,
html body#top #progressCircle::after {
    border-color: rgba(232, 184, 76, .5) !important;
    box-shadow: 0 0 14px rgba(232, 184, 76, .15) !important;
}

html body#top #progressCircle .progress-circle-inner {
    background: radial-gradient(circle, #2a2113, #090909 85%) !important;
    border-color: #c99c43 !important;
}

html body#top .percent-text {
    color: #ffe8b6 !important;
    -webkit-text-fill-color: #ffe8b6 !important;
}

html body#top .buyer-info-label,
html body#top .msg-box.unified-status-card>strong:first-child {
    color: #e8bd64 !important;
    -webkit-text-fill-color: #e8bd64 !important;
}

html body#top .stats-grid .stat-icon,
html body#top .stats-grid-top .stat-icon,
html body#top .stats-grid-bottom .stat-icon {
    border-color: #c99c43 !important;
    background: linear-gradient(145deg, #493519, #17130d) !important;
}

html body#top .stats-grid .stat-icon::before,
html body#top .stats-grid-top .stat-icon::before,
html body#top .stats-grid-bottom .stat-icon::before {
    background: conic-gradient(from 210deg, #483515, #e8b84c, #ffe0a0, #483515) !important;
}

html body#top .stats-grid .stat-icon::after,
html body#top .stats-grid-top .stat-icon::after,
html body#top .stats-grid-bottom .stat-icon::after {
    background: linear-gradient(145deg, #3a2b17, #15120e) !important;
}

html body#top .stats-grid .stat-icon svg,
html body#top .stats-grid-top .stat-icon svg,
html body#top .stats-grid-bottom .stat-icon svg {
    color: #ffe0a0 !important;
    stroke: #ffe0a0 !important;
}


/* ===== VULTREX GOLD: ALL TRACKING STATES ===== */
:root {
    color-scheme: dark;
}

.fifa-account-form,
.action-panel.fifa-account-form {
    border: 1px solid rgba(216, 171, 67, .65) !important;
    border-left: 3px solid #e3b84f !important;
    background: linear-gradient(145deg, rgba(24, 20, 14, .98), rgba(8, 9, 12, .99)) !important;
    box-shadow: 0 20px 48px rgba(0, 0, 0, .5), 0 0 22px rgba(216, 171, 67, .08) !important;
}

.fifa-account-form::before {
    background: linear-gradient(90deg, transparent, #a97724, #f3d37b, #a97724, transparent) !important;
    box-shadow: 0 0 12px rgba(216, 171, 67, .25) !important;
}

.fifa-account-form::after {
    background: radial-gradient(circle, rgba(210, 156, 48, .10), transparent 70%) !important;
}

.fifa-account-form .panel-header-icon,
.fifa-account-form .panel-icon,
.fifa-account-form .heading-icon {
    background: linear-gradient(135deg, #f4d47d, #aa7524) !important;
    color: #19140a !important;
    border-color: rgba(248, 211, 113, .7) !important;
    box-shadow: 0 0 18px rgba(212, 166, 56, .18) !important;
}

.fifa-account-form .fifa-field input {
    background: #0c0d11 !important;
    border: 1px solid rgba(212, 166, 56, .36) !important;
    color: #fff8e9 !important;
}

.fifa-account-form .fifa-field input:focus {
    border-color: #e8bd5d !important;
    box-shadow: 0 0 0 3px rgba(232, 189, 93, .14) !important;
}

.fifa-account-form .fifa-field input::placeholder {
    color: #9c9486 !important;
}

.fifa-account-form .fifa-field>span,
.fifa-account-form .fifa-form-kicker {
    color: #f1c967 !important;
}

.fifa-submit-btn,
.fifa-account-form .btn-action {
    background: linear-gradient(100deg, #a67525, #f2cd71, #bb892f) !important;
    color: #17120b !important;
    border: 1px solid #f4d783 !important;
    box-shadow: 0 8px 22px rgba(201, 145, 41, .20) !important;
}

.fifa-submit-btn:hover,
.fifa-account-form .btn-action:hover {
    filter: brightness(1.08) !important;
    box-shadow: 0 12px 28px rgba(201, 145, 41, .27) !important;
}

.fifa-submit-btn::after {
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .3), transparent) !important;
}

.fifa-account-form .secure-note,
.fifa-account-form .security-note {
    border-color: rgba(218, 173, 72, .36) !important;
    background: rgba(218, 173, 72, .06) !important;
    color: #f0dfb8 !important;
}

/* Legacy pseudo-elements and decorative progress glows */
#progressCircle::after,
.progress-circle::after {
    border-color: rgba(231, 183, 75, .38) !important;
    box-shadow: 0 0 12px rgba(231, 183, 75, .16) !important;
}

.status-badge:not(.danger-status):not(.success-status)::before {
    box-shadow: 0 0 12px rgba(231, 183, 75, .22) !important;
}

/* Preserve semantic red errors and green success indicators. */
.status-badge.danger-status,
.msg-box.danger {
    border-color: rgba(245, 93, 93, .65) !important;
}