/* C01: local desktop surface colours sampled from XD preview boards 10/19/26/39.
   These are preview estimates, not official Inspect values. No root tokens,
   geometry, mobile rules, validation/status colours or interaction changes. */
@media (min-width: 992px) {
    :is(.deposit-page-wrap, .profile-page-wrap, .history-page-wrap, .referral-page-wrap, .rebate-page-wrap) .content-card,
    :is(.deposit-page-wrap, .profile-page-wrap, .history-page-wrap, .referral-page-wrap, .rebate-page-wrap) .top-vip-bar__card,
    :is(.deposit-page-wrap, .referral-page-wrap) .attention-accordion,
    .history-page-wrap .pending-page-card,
    #info-pages.desktop-info .info-pages-tabs,
    #info-pages.desktop-info .tnc-accordion {
        background-color: #262523;
    }

    :is(.desktop-deposit, .desktop-withdrawal, .banking-details-page, .profile-form__fields, .history-filter-group) .ff-input,
    :is(.desktop-deposit, .desktop-withdrawal, .banking-details-page, .history-filter-group) .ff-custom-select-toggle,
    :is(.desktop-deposit, .desktop-withdrawal, .banking-details-page, .history-filter-group) .ff-custom-select-menu,
    :is(.desktop-deposit, .desktop-withdrawal) .deposit-copy-field,
    .profile-form__fields .ff-select,
    .profile-form__fields .ff-select option,
    :is(.history-page-wrap, .referral-page-wrap) .history-date-input,
    .referral-page-wrap .referral-reports-section__dropdown-btn,
    .referral-page-wrap .referral-code-section__input,
    .referral-page-wrap .referral-link-section__input,
    .history-page-wrap .pending-transaction-card,
    #info-pages.desktop-info :is(.customer-service-card, .social-media-card, .contact-details-card),
    .history-page-wrap #pending-transaction :is(.customer-service-card, .social-media-card, .contact-details-card) {
        background-color: #373330;
    }

    /* Account/currency variants have legacy important backgrounds. */
    :is(.desktop-deposit, .desktop-withdrawal, .banking-details-page, .history-filter-group) .ff-custom-select-toggle,
    :is(.desktop-deposit, .desktop-withdrawal, .banking-details-page, .history-filter-group) .ff-custom-select-menu,
    #addBankModal .ff-custom-select-toggle,
    #addBankModal .ff-custom-select-menu {
        background-color: #373330 !important;
    }

    /* Do not replace select arrow images or hover/selected option backgrounds. */
    #ubo33-modal :is(#addBankModal, #modalUpdateAvatar, #modalChangePassword) .account-form-modal__content {
        background-color: #181713 !important;
    }
    .am-modal-overlay__dialog--inbox,
    #info-pages.desktop-info .tnc-accordion-header:not(:hover) {
        background-color: #181713;
    }
    #addBankModal .ff-input,
    #addBankModal .ff-custom-select-toggle,
    #addBankModal .ff-custom-select-menu,
    #modalChangePassword .am-input,
    #addBankModal .add-bank-modal__tab:not(.active):not(:hover) {
        background-color: #373330;
    }

    /* XD active account tab uses white text and a muted gold edge, not orange. */
    #addBankModal .add-bank-modal__tab.active {
        background-image: linear-gradient(180deg, #373330 0%, #181713 100%);
        border-color: #eccf97;
        color: #ffffff;
    }

    /* Gold highlights belong to these actions only; disabled/validation states
       keep their existing styling. Inset stroke does not alter box dimensions. */
    #addBankModal .deposit-submit-btn:not(:disabled),
    #modalUpdateAvatar .avatar-confirm-btn:not(:disabled),
    #modalChangePassword .am-btn-submit:not(:disabled),
    .desktop-deposit .ff-action-button:not(:disabled):not(.ff-action-button--disabled),
    .desktop-withdrawal .ff-action-button:not(:disabled):not(.ff-action-button--disabled),
    .profile-page-wrap .profile-form__change-pw-btn:not(:disabled),
    .success-feedback-modal__button:not(:disabled),
    #depositCooldownModal .deposit-cooldown-modal__btn:not(:disabled) {
        background-image: linear-gradient(30deg, #b38a5a 0%, #ffdb9d 45%, #ffdb9d 55%, #b38a5a 100%);
        box-shadow: inset 0 0 0 1px #eccf97;
    }
}