/*
  IBA 8.8.6 CSS MODULE SPLIT
  This file is a module-specific override layer.
  style.css and css/mobile.css remain as legacy/shared base for now.
  Future UI fixes should go here instead of adding more mixed rules to the base files.
*/

@media (max-width: 768px) {
    #inventory-view,
    body.inventory-mode {
        --module-accent: #4d0000;
        --module-accent-deep: #2b0000;
        --module-accent-mid: #7a1111;
    }
    #inventory-view .wd-mobile-header,
    #inventory-view .mobile-page-header,
    #inventory-view .wd-page-hero,
    #inventory-view .inventory-hero,
    body.inventory-mode .wd-page-hero,
    body.inventory-mode .inventory-request-review-head {
        background:
            radial-gradient(circle at 96% 0%, rgba(255,255,255,0.16), transparent 30%),
            linear-gradient(135deg, #2b0000, #4d0000 60%, #7a1111) !important;
        color: #ffffff !important;
        border-radius: 20px !important;
        border: 1px solid rgba(255,241,241,0.24) !important;
    }
    #inventory-view .wd-page-hero h1,
    #inventory-view .inventory-hero h1,
    body.inventory-mode .wd-page-hero h1,
    body.inventory-mode .inventory-request-review-head h1 {
        color: #ffffff !important;
        -webkit-text-fill-color: #ffffff !important;
    }
    #ms-transfer-btn,
    #ms-restock-btn,
    #ms-usage-btn {
        background: linear-gradient(135deg, #4d0000, #7a1111) !important;
        color: #ffffff !important;
        -webkit-text-fill-color: #ffffff !important;
        border: 1px solid rgba(255,241,241,0.34) !important;
        border-radius: 14px !important;
        opacity: 1 !important;
    }
    #ms-transfer-btn:disabled,
    #ms-restock-btn:disabled,
    #ms-usage-btn:disabled,
    #ms-transfer-btn.disabled,
    #ms-restock-btn.disabled,
    #ms-usage-btn.disabled {
        background: #fff1f1 !important;
        color: #4d0000 !important;
        -webkit-text-fill-color: #4d0000 !important;
        border: 1px solid rgba(77,0,0,0.24) !important;
        opacity: 1 !important;
    }
    #inventory-view table thead th,
    body.inventory-mode table thead th,
    #ms-table thead th {
        background: #4d0000 !important;
        color: #ffffff !important;
        -webkit-text-fill-color: #ffffff !important;
    }
    #inventory-view table,
    body.inventory-mode table,
    #ms-table {
        border-collapse: separate !important;
        border-spacing: 0 !important;
        border-radius: 14px !important;
        overflow: hidden !important;
    }
    .inventory-themed-modal .modal-header,
    #ms-report-modal .modal-header,
    #ms-requestlist-modal .modal-header,
    #ms-new-material-modal .modal-header,
    #ms-photo-browser-modal .modal-header,
    #ms-add-stock-modal .modal-header,
    #transfer-job-modal .modal-header,
    #transfer-approval-modal .modal-header {
        background: linear-gradient(135deg, #2b0000, #4d0000 60%, #7a1111) !important;
        color: #ffffff !important;
    }
    .inventory-themed-modal .modal-header *,
    #transfer-job-modal .modal-header *,
    #transfer-approval-modal .modal-header * {
        color: #ffffff !important;
        -webkit-text-fill-color: #ffffff !important;
    }
    #inventory-job-records-stage-switch .inv-stage-btn.active,
    body.inventory-mode #wd-activetask #active-task-filters.report-tabs button.active {
        background: linear-gradient(135deg, #4d0000, #7a1111) !important;
        color: #ffffff !important;
        -webkit-text-fill-color: #ffffff !important;
    }
}

/* =========================================================
   8.8.6 INVENTORY MAROON DEEP SYNC — MOBILE TABS + ROW DETAILS
   ========================================================= */
@media (max-width: 768px) {
    body.inventory-mode #wd-reporting #report-tabs.report-tabs,
    body.inventory-mode #report-tabs.report-tabs,
    body.inventory-mode #wd-activetask #active-task-filters.report-tabs,
    body.inventory-mode #active-task-filters.report-tabs,
    #ms-category-tabs.report-tabs,
    #ms-category-tabs.ms-premium-tabs {
        background: rgba(255, 248, 248, 0.96) !important;
        border: 1px solid rgba(77, 0, 0, 0.16) !important;
        border-bottom: 1px solid rgba(77, 0, 0, 0.16) !important;
        border-radius: 18px !important;
        padding: 8px !important;
        gap: 8px !important;
        box-shadow: 0 8px 20px rgba(43, 0, 0, 0.06) !important;
    }

    body.inventory-mode #wd-reporting #report-tabs.report-tabs button,
    body.inventory-mode #report-tabs.report-tabs button,
    body.inventory-mode #wd-activetask #active-task-filters.report-tabs button,
    body.inventory-mode #active-task-filters.report-tabs button,
    #ms-category-tabs .ms-family-chip,
    #ms-category-tabs.report-tabs button {
        --tab-color: #4d0000 !important;
        --tab-text: #4d0000 !important;
        background: #fffafa !important;
        color: #4d0000 !important;
        -webkit-text-fill-color: #4d0000 !important;
        border: 1px solid rgba(77, 0, 0, 0.22) !important;
        border-radius: 14px !important;
        box-shadow: none !important;
        text-shadow: none !important;
        font-weight: 900 !important;
        min-height: 40px !important;
    }

    body.inventory-mode #wd-reporting #report-tabs.report-tabs button.active,
    body.inventory-mode #report-tabs.report-tabs button.active,
    body.inventory-mode #wd-activetask #active-task-filters.report-tabs button.active,
    body.inventory-mode #active-task-filters.report-tabs button.active,
    #ms-category-tabs .ms-family-chip.active,
    #ms-category-tabs.report-tabs button.active {
        --tab-color: #4d0000 !important;
        --tab-text: #ffffff !important;
        background: linear-gradient(135deg, #2b0000 0%, #4d0000 62%, #7a1111 100%) !important;
        color: #ffffff !important;
        -webkit-text-fill-color: #ffffff !important;
        border-color: rgba(77, 0, 0, 0.48) !important;
        box-shadow: 0 10px 22px rgba(43, 0, 0, 0.18) !important;
    }
    body.inventory-mode #wd-reporting #report-tabs.report-tabs button.active *,
    body.inventory-mode #report-tabs.report-tabs button.active *,
    body.inventory-mode #wd-activetask #active-task-filters.report-tabs button.active *,
    body.inventory-mode #active-task-filters.report-tabs button.active *,
    #ms-category-tabs .ms-family-chip.active *,
    #ms-category-tabs.report-tabs button.active * {
        color: #ffffff !important;
        -webkit-text-fill-color: #ffffff !important;
    }

    #ms-table tbody tr:hover {
        background: #fffafa !important;
        box-shadow: inset 4px 0 0 #4d0000 !important;
    }
    #ms-table .ms-product-code,
    #ms-table .ms-family-badge {
        background: #fff1f1 !important;
        color: #4d0000 !important;
        -webkit-text-fill-color: #4d0000 !important;
        border: 1px solid rgba(77,0,0,0.20) !important;
        border-radius: 999px !important;
        font-weight: 900 !important;
    }
    #ms-table .ms-stock-pill {
        background: linear-gradient(135deg, #4d0000 0%, #7a1111 100%) !important;
        color: #ffffff !important;
        -webkit-text-fill-color: #ffffff !important;
        border-radius: 999px !important;
        font-weight: 900 !important;
    }
    #ms-table .ms-expand-btn,
    #ms-table .ms-row-action-btn,
    #ms-table .ms-add-to-required-btn,
    #ms-table .ms-edit-stock-btn {
        background: #fff8f8 !important;
        color: #4d0000 !important;
        -webkit-text-fill-color: #4d0000 !important;
        border: 1px solid rgba(77,0,0,0.24) !important;
        border-radius: 12px !important;
        font-weight: 900 !important;
    }
    #ms-table .ms-delete-btn,
    #ms-table .delete-btn {
        background: linear-gradient(135deg, #7f1d1d 0%, #b91c1c 100%) !important;
        color: #ffffff !important;
        -webkit-text-fill-color: #ffffff !important;
        border-radius: 12px !important;
        font-weight: 900 !important;
    }
}


/* =========================================================
   8.9.5 INVENTORY MOBILE ITEM FINDER SEARCH INPUT CLEANUP
   Removes the browser/default gray rectangle inside the search field.
   ========================================================= */
@media (max-width: 768px) {
    body.inventory-mode .inv-mobile-finder-search {
        align-items: center !important;
    }

    body.inventory-mode .inv-mobile-search-box {
        background: #ffffff !important;
        border: 1px solid rgba(77, 0, 0, 0.18) !important;
        border-radius: 18px !important;
        box-shadow: 0 10px 22px rgba(43, 0, 0, 0.08) !important;
        overflow: hidden !important;
    }

    body.inventory-mode .inv-mobile-search-box:focus-within {
        border-color: rgba(77, 0, 0, 0.45) !important;
        box-shadow: 0 12px 26px rgba(43, 0, 0, 0.14) !important;
    }

    body.inventory-mode .inv-mobile-search-box i,
    body.inventory-mode .inv-mobile-search-box .fa,
    body.inventory-mode .inv-mobile-search-box .fas {
        color: #4d0000 !important;
        -webkit-text-fill-color: #4d0000 !important;
        flex: 0 0 auto !important;
    }

    body.inventory-mode .inv-mobile-search-box input,
    body.inventory-mode .inv-mobile-search-box input[type="text"],
    body.inventory-mode .inv-mobile-search-box input[type="search"],
    body.inventory-mode #inv-mobile-material-search,
    body.inventory-mode #inv-mobile-material-search-input {
        -webkit-appearance: none !important;
        appearance: none !important;
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        flex: 1 1 auto !important;
        min-width: 0 !important;
        height: 30px !important;
        min-height: 30px !important;
        line-height: 30px !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        outline: 0 !important;
        box-shadow: none !important;
        background: transparent !important;
        background-color: transparent !important;
        border-radius: 0 !important;
        color: #111827 !important;
        -webkit-text-fill-color: #111827 !important;
        font-size: 13px !important;
        font-weight: 700 !important;
    }

    body.inventory-mode .inv-mobile-search-box input::placeholder,
    body.inventory-mode #inv-mobile-material-search::placeholder,
    body.inventory-mode #inv-mobile-material-search-input::placeholder {
        color: #6b7280 !important;
        -webkit-text-fill-color: #6b7280 !important;
        opacity: 1 !important;
    }

    body.inventory-mode .inv-mobile-search-box input::-webkit-search-decoration,
    body.inventory-mode .inv-mobile-search-box input::-webkit-search-cancel-button,
    body.inventory-mode .inv-mobile-search-box input::-webkit-search-results-button,
    body.inventory-mode .inv-mobile-search-box input::-webkit-search-results-decoration {
        -webkit-appearance: none !important;
        appearance: none !important;
        display: none !important;
    }

    body.inventory-mode .inv-mobile-scan-btn {
        background: linear-gradient(135deg, #4d0000, #7a1111) !important;
        color: #ffffff !important;
        -webkit-text-fill-color: #ffffff !important;
        border: 1px solid rgba(77, 0, 0, 0.34) !important;
        border-radius: 14px !important;
        box-shadow: 0 10px 20px rgba(43, 0, 0, 0.16) !important;
    }

    body.inventory-mode #inv-mobile-material-search-clear {
        background: #fff8f8 !important;
        color: #7f1d1d !important;
        -webkit-text-fill-color: #7f1d1d !important;
        border: 1px solid rgba(185, 28, 28, 0.24) !important;
        box-shadow: none !important;
    }
}


/* =========================================================
   8.9.7 INVENTORY MOBILE ACTIVE TASK MAROON CLEANUP
   Desktop is untouched. This only fixes Inventory mobile Active Task
   refresh/header, filter tabs, empty state, task cards and action buttons.
   ========================================================= */
@media (max-width: 768px) {
    body.inventory-mode #wd-activetask #active-task-mobile-header,
    body.inventory-mode #active-task-mobile-header {
        background: linear-gradient(135deg, #2b0000 0%, #4d0000 62%, #7a1111 100%) !important;
        color: #ffffff !important;
        border: 1px solid rgba(255, 241, 241, 0.22) !important;
        border-radius: 18px !important;
        margin: 8px 0 12px 0 !important;
        padding: 10px 12px !important;
        box-shadow: 0 12px 26px rgba(43, 0, 0, 0.16) !important;
    }

    body.inventory-mode #active-task-mobile-header h1 {
        color: #ffffff !important;
        -webkit-text-fill-color: #ffffff !important;
        font-size: 1.05rem !important;
        font-weight: 950 !important;
        letter-spacing: -0.02em !important;
    }

    body.inventory-mode #mobile-activetask-refresh-btn,
    body.inventory-mode #active-task-mobile-header .mobile-header-icon {
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
        border-radius: 14px !important;
        background: rgba(255, 255, 255, 0.96) !important;
        color: #4d0000 !important;
        -webkit-text-fill-color: #4d0000 !important;
        border: 1px solid rgba(255, 241, 241, 0.42) !important;
        box-shadow: 0 10px 18px rgba(43, 0, 0, 0.18) !important;
        opacity: 1 !important;
    }

    body.inventory-mode #mobile-activetask-refresh-btn i,
    body.inventory-mode #active-task-mobile-header .mobile-header-icon i {
        color: #4d0000 !important;
        -webkit-text-fill-color: #4d0000 !important;
    }

    body.inventory-mode #wd-activetask .wd-premium-searchbar,
    body.inventory-mode #wd-activetask .search-and-filter-group {
        border: 1px solid rgba(77, 0, 0, 0.14) !important;
        box-shadow: 0 10px 22px rgba(43, 0, 0, 0.06) !important;
    }

    body.inventory-mode #wd-activetask .wd-search-field:focus-within,
    body.inventory-mode #wd-activetask .search-bar-local:focus-within {
        border-color: rgba(77, 0, 0, 0.44) !important;
        box-shadow: 0 10px 22px rgba(43, 0, 0, 0.12) !important;
    }

    body.inventory-mode #wd-activetask .wd-search-field i,
    body.inventory-mode #wd-activetask .search-bar-local i {
        color: #4d0000 !important;
        -webkit-text-fill-color: #4d0000 !important;
    }

    body.inventory-mode #wd-activetask #active-task-clear-button {
        background: #fff8f8 !important;
        color: #4d0000 !important;
        -webkit-text-fill-color: #4d0000 !important;
        border: 1px solid rgba(77, 0, 0, 0.22) !important;
        border-radius: 14px !important;
        font-weight: 900 !important;
        opacity: 1 !important;
    }

    body.inventory-mode #wd-activetask #active-task-filters.report-tabs,
    body.inventory-mode #active-task-filters.report-tabs {
        background: #fffafa !important;
        border: 1px solid rgba(77, 0, 0, 0.16) !important;
        border-bottom: 1px solid rgba(77, 0, 0, 0.16) !important;
        border-radius: 18px !important;
        padding: 8px !important;
        margin: 10px 0 14px 0 !important;
        gap: 8px !important;
        box-shadow: 0 8px 20px rgba(43, 0, 0, 0.06) !important;
    }

    body.inventory-mode #wd-activetask #active-task-filters.report-tabs button,
    body.inventory-mode #active-task-filters.report-tabs button,
    body.inventory-mode #active-task-filters.report-tabs button[disabled] {
        --tab-color: #fff1f1 !important;
        --tab-text: #4d0000 !important;
        background: #fff1f1 !important;
        color: #4d0000 !important;
        -webkit-text-fill-color: #4d0000 !important;
        border: 1px solid rgba(77, 0, 0, 0.24) !important;
        border-radius: 14px !important;
        clip-path: none !important;
        margin: 0 !important;
        padding: 10px 14px !important;
        font-weight: 950 !important;
        opacity: 1 !important;
        box-shadow: none !important;
        text-shadow: none !important;
    }

    body.inventory-mode #wd-activetask #active-task-filters.report-tabs button.active,
    body.inventory-mode #active-task-filters.report-tabs button.active,
    body.inventory-mode #active-task-filters.report-tabs button.blink-tab {
        --tab-color: #4d0000 !important;
        --tab-text: #ffffff !important;
        background: linear-gradient(135deg, #2b0000 0%, #4d0000 62%, #7a1111 100%) !important;
        color: #ffffff !important;
        -webkit-text-fill-color: #ffffff !important;
        border-color: rgba(77, 0, 0, 0.48) !important;
        box-shadow: 0 10px 22px rgba(43, 0, 0, 0.18) !important;
    }

    body.inventory-mode #active-task-filters.report-tabs button .notification-badge {
        background: #ffffff !important;
        color: #4d0000 !important;
        -webkit-text-fill-color: #4d0000 !important;
        border: 1px solid rgba(77, 0, 0, 0.20) !important;
    }

    body.inventory-mode #active-task-mobile-view {
        padding-bottom: 130px !important;
    }

    body.inventory-mode #active-task-mobile-view .mobile-task-card,
    body.inventory-mode #active-task-mobile-view .wd-task-card {
        border: 1px solid rgba(77, 0, 0, 0.16) !important;
        border-radius: 20px !important;
        box-shadow: 0 14px 30px rgba(43, 0, 0, 0.10) !important;
        overflow: hidden !important;
        background: #ffffff !important;
    }

    body.inventory-mode #active-task-mobile-view .mobile-card-header,
    body.inventory-mode #active-task-mobile-view .wd-task-card-header,
    body.inventory-mode #active-task-mobile-view .m-card-header {
        background: linear-gradient(135deg, #2b0000 0%, #4d0000 62%, #7a1111 100%) !important;
        color: #ffffff !important;
        border-left: 0 !important;
    }

    body.inventory-mode #active-task-mobile-view .mobile-card-header *,
    body.inventory-mode #active-task-mobile-view .wd-task-card-header *,
    body.inventory-mode #active-task-mobile-view .m-card-header * {
        color: #ffffff !important;
        -webkit-text-fill-color: #ffffff !important;
    }

    body.inventory-mode #active-task-mobile-view .mobile-card-header h3,
    body.inventory-mode #active-task-mobile-view .m-card-main h3 {
        color: #ffffff !important;
        -webkit-text-fill-color: #ffffff !important;
    }

    body.inventory-mode #active-task-mobile-view .m-card-amount {
        background: rgba(255, 255, 255, 0.16) !important;
        border: 1px solid rgba(255, 255, 255, 0.22) !important;
        color: #ffffff !important;
    }

    body.inventory-mode #active-task-mobile-view .mobile-card-body,
    body.inventory-mode #active-task-mobile-view .wd-task-card-body {
        background: #fffafa !important;
        border-top: 1px solid rgba(77, 0, 0, 0.12) !important;
    }

    body.inventory-mode #active-task-mobile-view .m-pdf-btn,
    body.inventory-mode #active-task-mobile-view .m-btn-approve,
    body.inventory-mode #active-task-mobile-view .m-btn-reject,
    body.inventory-mode #active-task-mobile-view .modify-btn,
    body.inventory-mode #active-task-mobile-view .srv-done-btn,
    body.inventory-mode #active-task-mobile-view button:not(.delete-btn):not(.reject-btn) {
        background: linear-gradient(135deg, #4d0000, #7a1111) !important;
        color: #ffffff !important;
        -webkit-text-fill-color: #ffffff !important;
        border: 1px solid rgba(77, 0, 0, 0.32) !important;
        border-radius: 14px !important;
        font-weight: 950 !important;
        box-shadow: 0 10px 20px rgba(43, 0, 0, 0.14) !important;
    }

    body.inventory-mode #active-task-mobile-view .wd-modern-empty-row,
    body.inventory-mode #wd-activetask .wd-modern-empty-row {
        background: #fffafa !important;
        border: 1px dashed rgba(77, 0, 0, 0.28) !important;
        color: #4d0000 !important;
    }

    body.inventory-mode #active-task-mobile-view .wd-modern-empty-row i,
    body.inventory-mode #wd-activetask .wd-modern-empty-row i {
        background: #fff1f1 !important;
        color: #4d0000 !important;
        -webkit-text-fill-color: #4d0000 !important;
    }
}


/* =========================================================
   8.9.8 INVENTORY MOBILE ACTIVE TASK ALIGNMENT
   Goal: follow the clean Invoice / Task mobile style, not heavy maroon cards.
   Desktop untouched. This overrides the too-strong 8.9.7 mobile styling.
   ========================================================= */
@media (max-width: 900px) {
    /* Keep the Inventory Active Task top area light/clean like Invoice / Task */
    body.inventory-mode #wd-activetask #active-task-mobile-header,
    body.inventory-mode #active-task-mobile-header,
    #inventory-view #wd-activetask #active-task-mobile-header,
    #inventory-view #active-task-mobile-header {
        background: transparent !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        margin: 4px 0 10px !important;
        padding: 0 4px !important;
        color: #4d0000 !important;
        min-height: auto !important;
    }

    body.inventory-mode #active-task-mobile-header h1,
    #inventory-view #active-task-mobile-header h1 {
        color: #4d0000 !important;
        -webkit-text-fill-color: #4d0000 !important;
        font-size: 1rem !important;
        font-weight: 950 !important;
        text-shadow: none !important;
        margin: 0 !important;
    }

    /* Refresh should be a readable light button with maroon accent, not hidden in a dark card */
    body.inventory-mode #mobile-activetask-refresh-btn,
    body.inventory-mode #active-task-mobile-header .mobile-header-icon,
    #inventory-view #mobile-activetask-refresh-btn,
    #inventory-view #active-task-mobile-header .mobile-header-icon {
        width: auto !important;
        min-width: 42px !important;
        height: 40px !important;
        padding: 0 12px !important;
        border-radius: 14px !important;
        background: #fffafa !important;
        color: #4d0000 !important;
        -webkit-text-fill-color: #4d0000 !important;
        border: 1px solid rgba(77, 0, 0, 0.20) !important;
        box-shadow: 0 8px 18px rgba(43, 0, 0, 0.08) !important;
        opacity: 1 !important;
    }

    body.inventory-mode #mobile-activetask-refresh-btn i,
    body.inventory-mode #active-task-mobile-header .mobile-header-icon i,
    #inventory-view #mobile-activetask-refresh-btn i,
    #inventory-view #active-task-mobile-header .mobile-header-icon i {
        color: #4d0000 !important;
        -webkit-text-fill-color: #4d0000 !important;
        opacity: 1 !important;
    }

    /* Active Task tab strip: remove the remaining blue panel */
    body.inventory-mode #wd-activetask #active-task-filters,
    body.inventory-mode #wd-activetask #active-task-filters.report-tabs,
    body.inventory-mode #active-task-filters,
    body.inventory-mode #active-task-filters.report-tabs,
    #inventory-view #wd-activetask #active-task-filters,
    #inventory-view #wd-activetask #active-task-filters.report-tabs,
    #inventory-view #active-task-filters,
    #inventory-view #active-task-filters.report-tabs {
        background: #fffafa !important;
        border: 1px solid rgba(77, 0, 0, 0.16) !important;
        border-bottom: 1px solid rgba(77, 0, 0, 0.16) !important;
        border-radius: 16px !important;
        padding: 7px !important;
        gap: 7px !important;
        box-shadow: 0 8px 18px rgba(43, 0, 0, 0.05) !important;
        overflow-x: auto !important;
    }

    body.inventory-mode #wd-activetask #active-task-filters button,
    body.inventory-mode #active-task-filters button,
    #inventory-view #wd-activetask #active-task-filters button,
    #inventory-view #active-task-filters button,
    body.inventory-mode #active-task-filters .filter-tab,
    #inventory-view #active-task-filters .filter-tab {
        background: #ffffff !important;
        color: #4d0000 !important;
        -webkit-text-fill-color: #4d0000 !important;
        border: 1px solid rgba(77, 0, 0, 0.20) !important;
        border-radius: 13px !important;
        padding: 10px 14px !important;
        font-weight: 950 !important;
        opacity: 1 !important;
        box-shadow: none !important;
        text-shadow: none !important;
        clip-path: none !important;
    }

    body.inventory-mode #wd-activetask #active-task-filters button.active,
    body.inventory-mode #active-task-filters button.active,
    body.inventory-mode #active-task-filters button.blink-tab,
    #inventory-view #wd-activetask #active-task-filters button.active,
    #inventory-view #active-task-filters button.active,
    #inventory-view #active-task-filters button.blink-tab,
    body.inventory-mode #active-task-filters .filter-tab.active,
    #inventory-view #active-task-filters .filter-tab.active {
        background: #4d0000 !important;
        color: #ffffff !important;
        -webkit-text-fill-color: #ffffff !important;
        border-color: #4d0000 !important;
        box-shadow: 0 8px 18px rgba(43, 0, 0, 0.14) !important;
    }

    body.inventory-mode #active-task-filters button.active *,
    body.inventory-mode #active-task-filters button.blink-tab *,
    #inventory-view #active-task-filters button.active *,
    #inventory-view #active-task-filters button.blink-tab * {
        color: #ffffff !important;
        -webkit-text-fill-color: #ffffff !important;
    }

    body.inventory-mode #active-task-filters .notification-badge,
    #inventory-view #active-task-filters .notification-badge {
        background: #fffafa !important;
        color: #4d0000 !important;
        -webkit-text-fill-color: #4d0000 !important;
        border: 1px solid rgba(77, 0, 0, 0.20) !important;
    }

    /* Empty/no-task state: remove blue bar/pill and keep it clean maroon themed */
    body.inventory-mode #wd-activetask .wd-modern-empty-row,
    body.inventory-mode #active-task-mobile-view .wd-modern-empty-row,
    body.inventory-mode #active-task-mobile-view .no-task,
    body.inventory-mode #active-task-mobile-view .empty-state,
    #inventory-view #wd-activetask .wd-modern-empty-row,
    #inventory-view #active-task-mobile-view .wd-modern-empty-row,
    #inventory-view #active-task-mobile-view .no-task,
    #inventory-view #active-task-mobile-view .empty-state {
        background: #fffafa !important;
        color: #4d0000 !important;
        -webkit-text-fill-color: #4d0000 !important;
        border: 1px dashed rgba(77, 0, 0, 0.24) !important;
        border-radius: 16px !important;
        box-shadow: none !important;
    }

    body.inventory-mode #wd-activetask .wd-modern-empty-row i,
    body.inventory-mode #active-task-mobile-view .wd-modern-empty-row i,
    #inventory-view #wd-activetask .wd-modern-empty-row i,
    #inventory-view #active-task-mobile-view .wd-modern-empty-row i {
        background: #fff1f1 !important;
        color: #4d0000 !important;
        -webkit-text-fill-color: #4d0000 !important;
    }

    /* Keep task cards close to the existing mobile task layout; only recolor accents */
    body.inventory-mode #active-task-mobile-view .mobile-task-card,
    body.inventory-mode #active-task-mobile-view .wd-task-card,
    #inventory-view #active-task-mobile-view .mobile-task-card,
    #inventory-view #active-task-mobile-view .wd-task-card {
        background: #ffffff !important;
        border: 1px solid rgba(77, 0, 0, 0.14) !important;
        border-left: 4px solid #4d0000 !important;
        border-radius: 18px !important;
        box-shadow: 0 10px 24px rgba(43, 0, 0, 0.08) !important;
        overflow: hidden !important;
    }

    body.inventory-mode #active-task-mobile-view .mobile-card-header,
    body.inventory-mode #active-task-mobile-view .wd-task-card-header,
    body.inventory-mode #active-task-mobile-view .m-card-header,
    #inventory-view #active-task-mobile-view .mobile-card-header,
    #inventory-view #active-task-mobile-view .wd-task-card-header,
    #inventory-view #active-task-mobile-view .m-card-header {
        background: #fffafa !important;
        color: #4d0000 !important;
        -webkit-text-fill-color: #4d0000 !important;
        border-bottom: 1px solid rgba(77, 0, 0, 0.10) !important;
    }

    body.inventory-mode #active-task-mobile-view .mobile-card-header *,
    body.inventory-mode #active-task-mobile-view .wd-task-card-header *,
    body.inventory-mode #active-task-mobile-view .m-card-header *,
    #inventory-view #active-task-mobile-view .mobile-card-header *,
    #inventory-view #active-task-mobile-view .wd-task-card-header *,
    #inventory-view #active-task-mobile-view .m-card-header * {
        color: #4d0000 !important;
        -webkit-text-fill-color: #4d0000 !important;
        text-shadow: none !important;
    }

    body.inventory-mode #active-task-mobile-view .mobile-card-body,
    body.inventory-mode #active-task-mobile-view .wd-task-card-body,
    #inventory-view #active-task-mobile-view .mobile-card-body,
    #inventory-view #active-task-mobile-view .wd-task-card-body {
        background: #ffffff !important;
        border-top: 0 !important;
    }

    body.inventory-mode #active-task-mobile-view .m-pdf-btn,
    body.inventory-mode #active-task-mobile-view .m-btn-approve,
    body.inventory-mode #active-task-mobile-view .modify-btn,
    body.inventory-mode #active-task-mobile-view .srv-done-btn,
    #inventory-view #active-task-mobile-view .m-pdf-btn,
    #inventory-view #active-task-mobile-view .m-btn-approve,
    #inventory-view #active-task-mobile-view .modify-btn,
    #inventory-view #active-task-mobile-view .srv-done-btn {
        background: #4d0000 !important;
        color: #ffffff !important;
        -webkit-text-fill-color: #ffffff !important;
        border: 1px solid #4d0000 !important;
        border-radius: 13px !important;
        box-shadow: 0 8px 16px rgba(43, 0, 0, 0.12) !important;
    }
}


/* =================================================================================================
   8.9.9 INVENTORY MOBILE ACTIVE TASK TAB FINAL COLOR FIX
   Keep the clean Invoice / Task mobile layout. Only correct the remaining blue task tab/pill.
   ================================================================================================= */
@media (max-width: 768px) {
    body.inventory-mode #active-task-filters.report-tabs button,
    body.inventory-mode #active-task-filters.report-tabs button[disabled],
    body.inventory-mode #wd-activetask #active-task-filters.report-tabs button,
    body.inventory-mode #wd-activetask #active-task-filters.report-tabs button[disabled],
    body.inventory-mobile-theme-active #active-task-filters.report-tabs button,
    body.inventory-mobile-theme-active #active-task-filters.report-tabs button[disabled],
    body.inventory-mobile-theme-active #wd-activetask #active-task-filters.report-tabs button,
    body.inventory-mobile-theme-active #wd-activetask #active-task-filters.report-tabs button[disabled],
    body.inventory-request-review-active #active-task-filters.report-tabs button,
    body.inventory-request-review-active #active-task-filters.report-tabs button[disabled] {
        background: #fffafa !important;
        color: #4d0000 !important;
        -webkit-text-fill-color: #4d0000 !important;
        border: 1px solid rgba(77, 0, 0, 0.22) !important;
        border-radius: 13px !important;
        box-shadow: none !important;
        text-shadow: none !important;
        opacity: 1 !important;
    }

    body.inventory-mode #active-task-filters.report-tabs button.active,
    body.inventory-mode #active-task-filters.report-tabs button.active[disabled],
    body.inventory-mode #active-task-filters.report-tabs button.blink-tab,
    body.inventory-mobile-theme-active #active-task-filters.report-tabs button.active,
    body.inventory-mobile-theme-active #active-task-filters.report-tabs button.active[disabled],
    body.inventory-mobile-theme-active #active-task-filters.report-tabs button.blink-tab,
    body.inventory-request-review-active #active-task-filters.report-tabs button.active,
    body.inventory-request-review-active #active-task-filters.report-tabs button.active[disabled],
    body.inventory-request-review-active #active-task-filters.report-tabs button.blink-tab,
    body.inventory-mode #wd-activetask #active-task-filters.report-tabs button.active,
    body.inventory-mode #wd-activetask #active-task-filters.report-tabs button.active[disabled],
    body.inventory-mobile-theme-active #wd-activetask #active-task-filters.report-tabs button.active,
    body.inventory-mobile-theme-active #wd-activetask #active-task-filters.report-tabs button.active[disabled] {
        background: #4d0000 !important;
        color: #ffffff !important;
        -webkit-text-fill-color: #ffffff !important;
        border-color: #4d0000 !important;
        box-shadow: 0 8px 18px rgba(43, 0, 0, 0.16) !important;
        text-shadow: none !important;
        opacity: 1 !important;
    }

    body.inventory-mode #active-task-filters.report-tabs button.active *,
    body.inventory-mode #active-task-filters.report-tabs button.active[disabled] *,
    body.inventory-mobile-theme-active #active-task-filters.report-tabs button.active *,
    body.inventory-mobile-theme-active #active-task-filters.report-tabs button.active[disabled] *,
    body.inventory-request-review-active #active-task-filters.report-tabs button.active *,
    body.inventory-request-review-active #active-task-filters.report-tabs button.active[disabled] * {
        color: #ffffff !important;
        -webkit-text-fill-color: #ffffff !important;
        text-shadow: none !important;
    }
}

/* =================================================================================================
   9.0.0 INVENTORY MOBILE ACTIVE TASK TAB HARD FIX
   The shared Active Task view sometimes does not keep body.inventory-mode while the mobile module
   dropdown is set to Inventory. This class is applied directly by app.js to the filter strip, so the
   No Tasks tab can no longer fall back to the old WorkDesk blue.
   ================================================================================================= */
@media (max-width: 768px) {
    #active-task-filters.inventory-task-filters-maroon,
    #wd-activetask #active-task-filters.inventory-task-filters-maroon {
        background: #fffafa !important;
        border: 1px solid rgba(77, 0, 0, 0.16) !important;
        border-radius: 16px !important;
        box-shadow: 0 8px 18px rgba(43, 0, 0, 0.05) !important;
    }

    #active-task-filters.inventory-task-filters-maroon > button,
    #active-task-filters.inventory-task-filters-maroon button,
    #wd-activetask #active-task-filters.inventory-task-filters-maroon > button,
    #wd-activetask #active-task-filters.inventory-task-filters-maroon button,
    #active-task-filters.inventory-task-filters-maroon button[disabled],
    #wd-activetask #active-task-filters.inventory-task-filters-maroon button[disabled] {
        background: #fffafa !important;
        background-image: none !important;
        color: #4d0000 !important;
        -webkit-text-fill-color: #4d0000 !important;
        border: 1px solid rgba(77, 0, 0, 0.24) !important;
        border-radius: 13px !important;
        box-shadow: none !important;
        text-shadow: none !important;
        opacity: 1 !important;
        filter: none !important;
    }

    #active-task-filters.inventory-task-filters-maroon > button.active,
    #active-task-filters.inventory-task-filters-maroon button.active,
    #active-task-filters.inventory-task-filters-maroon > button[disabled],
    #active-task-filters.inventory-task-filters-maroon button[disabled],
    #wd-activetask #active-task-filters.inventory-task-filters-maroon > button.active,
    #wd-activetask #active-task-filters.inventory-task-filters-maroon button.active,
    #wd-activetask #active-task-filters.inventory-task-filters-maroon > button[disabled],
    #wd-activetask #active-task-filters.inventory-task-filters-maroon button[disabled] {
        background: #4d0000 !important;
        background-image: linear-gradient(135deg, #2b0000 0%, #4d0000 65%, #7a1111 100%) !important;
        color: #ffffff !important;
        -webkit-text-fill-color: #ffffff !important;
        border-color: #4d0000 !important;
        box-shadow: 0 8px 18px rgba(43, 0, 0, 0.16) !important;
        text-shadow: none !important;
    }

    #active-task-filters.inventory-task-filters-maroon button *,
    #wd-activetask #active-task-filters.inventory-task-filters-maroon button * {
        color: inherit !important;
        -webkit-text-fill-color: inherit !important;
        text-shadow: none !important;
    }
}


/* =================================================================================================
   9.0.1 INVENTORY MOBILE ITEM FINDER INPUT FOCUS RECTANGLE FIX
   The Item Finder search input is rendered inside a custom rounded search bar. Some mobile browsers
   still paint the native input field/focus rectangle. Reset the real input directly, without relying
   on body.inventory-mode, so only the outer rounded search bar remains visible.
   ================================================================================================= */
@media (max-width: 768px) {
    #wd-inv-mobile-material-finder .inv-mobile-search-box,
    .inventory-mobile-finder-active #wd-inv-mobile-material-finder .inv-mobile-search-box {
        overflow: hidden !important;
        background: #ffffff !important;
        border: 1px solid rgba(77, 0, 0, 0.22) !important;
        border-radius: 18px !important;
        box-shadow: 0 10px 22px rgba(43, 0, 0, 0.08) !important;
    }

    #wd-inv-mobile-material-finder .inv-mobile-search-box:focus-within,
    .inventory-mobile-finder-active #wd-inv-mobile-material-finder .inv-mobile-search-box:focus-within {
        border-color: rgba(77, 0, 0, 0.45) !important;
        box-shadow: 0 12px 26px rgba(43, 0, 0, 0.13) !important;
    }

    #wd-inv-mobile-material-finder #inv-mobile-material-search-input,
    #wd-inv-mobile-material-finder #inv-mobile-material-search-input:focus,
    #wd-inv-mobile-material-finder #inv-mobile-material-search-input:active,
    #wd-inv-mobile-material-finder .inv-mobile-search-box input,
    #wd-inv-mobile-material-finder .inv-mobile-search-box input:focus,
    #wd-inv-mobile-material-finder .inv-mobile-search-box input:active,
    .inventory-mobile-finder-active #wd-inv-mobile-material-finder #inv-mobile-material-search-input,
    .inventory-mobile-finder-active #wd-inv-mobile-material-finder #inv-mobile-material-search-input:focus,
    .inventory-mobile-finder-active #wd-inv-mobile-material-finder #inv-mobile-material-search-input:active {
        all: unset !important;
        -webkit-appearance: none !important;
        appearance: none !important;
        box-sizing: border-box !important;
        display: block !important;
        flex: 1 1 auto !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: 32px !important;
        min-height: 32px !important;
        line-height: 32px !important;
        margin: 0 !important;
        padding: 0 !important;
        border: none !important;
        outline: none !important;
        box-shadow: none !important;
        background: transparent !important;
        background-color: transparent !important;
        background-image: none !important;
        border-radius: 0 !important;
        color: #111827 !important;
        -webkit-text-fill-color: #111827 !important;
        caret-color: #4d0000 !important;
        font-family: inherit !important;
        font-size: 13px !important;
        font-weight: 700 !important;
        text-shadow: none !important;
        filter: none !important;
    }

    #wd-inv-mobile-material-finder #inv-mobile-material-search-input::placeholder,
    #wd-inv-mobile-material-finder .inv-mobile-search-box input::placeholder {
        color: #6b7280 !important;
        -webkit-text-fill-color: #6b7280 !important;
        opacity: 1 !important;
        text-shadow: none !important;
    }

    #wd-inv-mobile-material-finder #inv-mobile-material-search-input::-webkit-search-decoration,
    #wd-inv-mobile-material-finder #inv-mobile-material-search-input::-webkit-search-cancel-button,
    #wd-inv-mobile-material-finder #inv-mobile-material-search-input::-webkit-search-results-button,
    #wd-inv-mobile-material-finder #inv-mobile-material-search-input::-webkit-search-results-decoration,
    #wd-inv-mobile-material-finder .inv-mobile-search-box input::-webkit-search-decoration,
    #wd-inv-mobile-material-finder .inv-mobile-search-box input::-webkit-search-cancel-button,
    #wd-inv-mobile-material-finder .inv-mobile-search-box input::-webkit-search-results-button,
    #wd-inv-mobile-material-finder .inv-mobile-search-box input::-webkit-search-results-decoration {
        -webkit-appearance: none !important;
        appearance: none !important;
        display: none !important;
    }
}

/* =========================================================
   10.0.2 — Inventory mobile approver readability + bulk UI polish
   Scoped only to Inventory mobile Active Task / Transfer Approval.
   Keeps WorkDesk and Invoice mobile views untouched.
   ========================================================= */
@media (max-width: 900px) {
    body.inventory-mode #active-task-mobile-view .mobile-card-body,
    body.inventory-mode #active-task-mobile-view .mobile-card-body *,
    #inventory-view #active-task-mobile-view .mobile-card-body,
    #inventory-view #active-task-mobile-view .mobile-card-body * {
        color: #2f1414 !important;
        -webkit-text-fill-color: #2f1414 !important;
        text-shadow: none !important;
    }

    body.inventory-mode #active-task-mobile-view .inventory-mobile-task-details,
    #inventory-view #active-task-mobile-view .inventory-mobile-task-details {
        background: #fffafa !important;
        border: 1px solid rgba(77, 0, 0, 0.12) !important;
        border-radius: 14px !important;
        padding: 10px 12px !important;
        box-shadow: none !important;
    }

    body.inventory-mode #active-task-mobile-view .inventory-mobile-task-details p,
    #inventory-view #active-task-mobile-view .inventory-mobile-task-details p {
        margin: 0 0 6px !important;
        color: #2f1414 !important;
        -webkit-text-fill-color: #2f1414 !important;
        font-size: 0.9rem !important;
        line-height: 1.35 !important;
    }

    body.inventory-mode #active-task-mobile-view .inventory-mobile-task-details p:last-child,
    #inventory-view #active-task-mobile-view .inventory-mobile-task-details p:last-child {
        margin-bottom: 0 !important;
    }

    body.inventory-mode #active-task-mobile-view .inventory-mobile-task-details strong,
    #inventory-view #active-task-mobile-view .inventory-mobile-task-details strong {
        color: #4d0000 !important;
        -webkit-text-fill-color: #4d0000 !important;
        font-weight: 800 !important;
    }

    body.inventory-mode #active-task-mobile-view .inventory-mobile-status-text,
    #inventory-view #active-task-mobile-view .inventory-mobile-status-text {
        color: #b42318 !important;
        -webkit-text-fill-color: #b42318 !important;
        font-weight: 800 !important;
    }

    body.inventory-mode #active-task-mobile-view .mobile-bulk-approve-btn,
    #inventory-view #active-task-mobile-view .mobile-bulk-approve-btn {
        min-height: 44px !important;
        letter-spacing: 0.01em !important;
    }

    body.inventory-mode #active-task-mobile-view .mobile-transfer-select:disabled,
    #inventory-view #active-task-mobile-view .mobile-transfer-select:disabled {
        opacity: 0.55 !important;
    }

    body.inventory-mode #transfer-approval-modal #transfer-modal-details,
    body.inventory-mode #transfer-approval-modal #transfer-modal-details *,
    #inventory-view #transfer-approval-modal #transfer-modal-details,
    #inventory-view #transfer-approval-modal #transfer-modal-details * {
        color: #2f1414 !important;
        -webkit-text-fill-color: #2f1414 !important;
        text-shadow: none !important;
    }

    body.inventory-mode #transfer-approval-modal #transfer-modal-details,
    #inventory-view #transfer-approval-modal #transfer-modal-details {
        background: #fffafa !important;
        border: 1px solid rgba(77, 0, 0, 0.14) !important;
        border-radius: 14px !important;
        box-shadow: none !important;
    }

    body.inventory-mode #transfer-approval-modal #transfer-modal-details strong,
    #inventory-view #transfer-approval-modal #transfer-modal-details strong {
        color: #4d0000 !important;
        -webkit-text-fill-color: #4d0000 !important;
    }
}


/* =========================================================
   10.0.3 — Inventory mobile approver header contrast + action icon colors
   Scoped only to Inventory transfer approval cards in mobile Active Task.
   Fixes white item names on light cards and black approve/reject icons.
   ========================================================= */
@media (max-width: 900px) {
    #active-task-mobile-view .inventory-transfer-mobile-header,
    body.inventory-mode #active-task-mobile-view .inventory-transfer-mobile-header,
    #inventory-view #active-task-mobile-view .inventory-transfer-mobile-header {
        background: #fffafa !important;
        color: #2f1414 !important;
        -webkit-text-fill-color: #2f1414 !important;
        text-shadow: none !important;
    }

    #active-task-mobile-view .inventory-transfer-mobile-header .m-card-main,
    #active-task-mobile-view .inventory-transfer-mobile-header .m-card-main *,
    body.inventory-mode #active-task-mobile-view .inventory-transfer-mobile-header .m-card-main,
    body.inventory-mode #active-task-mobile-view .inventory-transfer-mobile-header .m-card-main *,
    #inventory-view #active-task-mobile-view .inventory-transfer-mobile-header .m-card-main,
    #inventory-view #active-task-mobile-view .inventory-transfer-mobile-header .m-card-main * {
        color: #2f1414 !important;
        -webkit-text-fill-color: #2f1414 !important;
        text-shadow: none !important;
    }

    #active-task-mobile-view .inventory-transfer-mobile-header .m-card-main h3,
    body.inventory-mode #active-task-mobile-view .inventory-transfer-mobile-header .m-card-main h3,
    #inventory-view #active-task-mobile-view .inventory-transfer-mobile-header .m-card-main h3 {
        color: #3a0707 !important;
        -webkit-text-fill-color: #3a0707 !important;
        font-weight: 900 !important;
        opacity: 1 !important;
        text-shadow: none !important;
    }

    #active-task-mobile-view .inventory-transfer-mobile-header .m-card-sub,
    body.inventory-mode #active-task-mobile-view .inventory-transfer-mobile-header .m-card-sub,
    #inventory-view #active-task-mobile-view .inventory-transfer-mobile-header .m-card-sub {
        color: #5a1f1f !important;
        -webkit-text-fill-color: #5a1f1f !important;
        opacity: 1 !important;
    }

    #active-task-mobile-view .inventory-transfer-mobile-header .m-card-sub span:first-child,
    body.inventory-mode #active-task-mobile-view .inventory-transfer-mobile-header .m-card-sub span:first-child,
    #inventory-view #active-task-mobile-view .inventory-transfer-mobile-header .m-card-sub span:first-child {
        color: #00748c !important;
        -webkit-text-fill-color: #00748c !important;
    }

    #active-task-mobile-view .inventory-transfer-mobile-header .m-card-amount .m-card-val,
    body.inventory-mode #active-task-mobile-view .inventory-transfer-mobile-header .m-card-amount .m-card-val,
    #inventory-view #active-task-mobile-view .inventory-transfer-mobile-header .m-card-amount .m-card-val {
        color: #6b0000 !important;
        -webkit-text-fill-color: #6b0000 !important;
        font-weight: 900 !important;
    }

    #active-task-mobile-view .inventory-transfer-mobile-header .m-card-amount .m-card-ref,
    body.inventory-mode #active-task-mobile-view .inventory-transfer-mobile-header .m-card-amount .m-card-ref,
    #inventory-view #active-task-mobile-view .inventory-transfer-mobile-header .m-card-amount .m-card-ref {
        color: #7f1d1d !important;
        -webkit-text-fill-color: #7f1d1d !important;
        opacity: 1 !important;
    }

    #active-task-mobile-view .inventory-transfer-approve-btn i,
    #active-task-mobile-view .inventory-transfer-approve-btn .fa,
    #active-task-mobile-view .inventory-transfer-approve-btn .fas,
    #active-task-mobile-view .inventory-transfer-approve-icon,
    body.inventory-mode #active-task-mobile-view .inventory-transfer-approve-btn i,
    #inventory-view #active-task-mobile-view .inventory-transfer-approve-btn i {
        color: #22c55e !important;
        -webkit-text-fill-color: #22c55e !important;
        fill: #22c55e !important;
        text-shadow: 0 1px 1px rgba(0,0,0,0.22) !important;
    }

    #active-task-mobile-view .inventory-transfer-reject-btn i,
    #active-task-mobile-view .inventory-transfer-reject-btn .fa,
    #active-task-mobile-view .inventory-transfer-reject-btn .fas,
    #active-task-mobile-view .inventory-transfer-reject-icon,
    body.inventory-mode #active-task-mobile-view .inventory-transfer-reject-btn i,
    #inventory-view #active-task-mobile-view .inventory-transfer-reject-btn i {
        color: #facc15 !important;
        -webkit-text-fill-color: #facc15 !important;
        fill: #facc15 !important;
        text-shadow: 0 1px 1px rgba(0,0,0,0.30) !important;
    }
}


/* =========================================================
   10.0.6 INVENTORY MOBILE ACTIVE TASK STRICT SCOPE
   Inventory task UI is active only when JS marks the visible mobile task module as inventory.
   This prevents maroon inventory tabs/cards from bleeding into Invoice / Task mobile active task.
   ========================================================= */
@media (max-width: 768px) {
    body.inventory-mobile-task-active #wd-activetask #active-task-filters.report-tabs,
    #wd-activetask.inventory-mobile-active-task #active-task-filters.report-tabs,
    #active-task-filters.inventory-mobile-active-task.report-tabs {
        background: rgba(255, 248, 248, 0.96) !important;
        border: 1px solid rgba(77, 0, 0, 0.16) !important;
        border-radius: 18px !important;
        padding: 8px !important;
        gap: 8px !important;
        box-shadow: 0 8px 20px rgba(43, 0, 0, 0.06) !important;
    }

    body.inventory-mobile-task-active #wd-activetask #active-task-filters.report-tabs button,
    #wd-activetask.inventory-mobile-active-task #active-task-filters.report-tabs button,
    #active-task-filters.inventory-mobile-active-task.report-tabs button {
        background: #fffafa !important;
        background-image: none !important;
        color: #4d0000 !important;
        -webkit-text-fill-color: #4d0000 !important;
        border: 1px solid rgba(77, 0, 0, 0.22) !important;
        border-radius: 14px !important;
        box-shadow: none !important;
        text-shadow: none !important;
        font-weight: 900 !important;
        min-height: 40px !important;
        opacity: 1 !important;
    }

    body.inventory-mobile-task-active #wd-activetask #active-task-filters.report-tabs button.active,
    body.inventory-mobile-task-active #wd-activetask #active-task-filters.report-tabs button.blink-tab,
    #wd-activetask.inventory-mobile-active-task #active-task-filters.report-tabs button.active,
    #wd-activetask.inventory-mobile-active-task #active-task-filters.report-tabs button.blink-tab,
    #active-task-filters.inventory-mobile-active-task.report-tabs button.active,
    #active-task-filters.inventory-mobile-active-task.report-tabs button.blink-tab {
        background: linear-gradient(135deg, #2b0000 0%, #4d0000 62%, #7a1111 100%) !important;
        background-image: linear-gradient(135deg, #2b0000 0%, #4d0000 62%, #7a1111 100%) !important;
        color: #ffffff !important;
        -webkit-text-fill-color: #ffffff !important;
        border-color: rgba(77, 0, 0, 0.48) !important;
        box-shadow: 0 10px 22px rgba(43, 0, 0, 0.18) !important;
    }

    body.inventory-mobile-task-active #active-task-mobile-view.inventory-mobile-active-task .mobile-task-card,
    #active-task-mobile-view.inventory-mobile-active-task .mobile-task-card,
    #active-task-mobile-view .inventory-mobile-task-card {
        background: #fffafa !important;
        border: 1px solid rgba(77, 0, 0, 0.20) !important;
        border-left: 5px solid #4d0000 !important;
        border-radius: 18px !important;
        box-shadow: 0 14px 28px rgba(43, 0, 0, 0.10) !important;
        overflow: hidden !important;
    }

    body.inventory-mobile-task-active #active-task-mobile-view.inventory-mobile-active-task .inventory-transfer-mobile-header,
    #active-task-mobile-view.inventory-mobile-active-task .inventory-transfer-mobile-header,
    #active-task-mobile-view .inventory-mobile-task-card .inventory-transfer-mobile-header {
        background: #fffafa !important;
        color: #4d0000 !important;
        -webkit-text-fill-color: #4d0000 !important;
        border-left: 5px solid #4d0000 !important;
    }

    body.inventory-mobile-task-active #active-task-mobile-view.inventory-mobile-active-task .inventory-transfer-mobile-header h3,
    body.inventory-mobile-task-active #active-task-mobile-view.inventory-mobile-active-task .m-card-main h3,
    #active-task-mobile-view .inventory-mobile-task-card .m-card-main h3 {
        color: #4d0000 !important;
        -webkit-text-fill-color: #4d0000 !important;
        text-shadow: none !important;
        font-weight: 950 !important;
    }

    body.inventory-mobile-task-active #active-task-mobile-view.inventory-mobile-active-task .inventory-mobile-task-details,
    body.inventory-mobile-task-active #active-task-mobile-view.inventory-mobile-active-task .inventory-mobile-task-details *,
    #active-task-mobile-view .inventory-mobile-task-card .inventory-mobile-task-details,
    #active-task-mobile-view .inventory-mobile-task-card .inventory-mobile-task-details * {
        color: #3b0a0a !important;
        -webkit-text-fill-color: #3b0a0a !important;
        text-shadow: none !important;
    }

    body.inventory-mobile-task-active #active-task-mobile-view.inventory-mobile-active-task .inventory-transfer-approve-icon,
    #active-task-mobile-view .inventory-mobile-task-card .inventory-transfer-approve-icon {
        color: #22c55e !important;
        -webkit-text-fill-color: #22c55e !important;
    }

    body.inventory-mobile-task-active #active-task-mobile-view.inventory-mobile-active-task .inventory-transfer-reject-icon,
    #active-task-mobile-view .inventory-mobile-task-card .inventory-transfer-reject-icon {
        color: #facc15 !important;
        -webkit-text-fill-color: #facc15 !important;
    }

    /* Hard reset: when invoice module is active, inventory active-task tabs/cards are not allowed to repaint it. */
    body.invoice-mobile-task-active #wd-activetask #active-task-filters.inventory-task-filters-maroon {
        background: #eff8ff !important;
        border-color: rgba(14, 116, 144, 0.18) !important;
    }
}