feat: theming support

Author: eshankvaish

src/Shared/Components/BulkOperations/BulkOperationsResultModal.tsx

@@ -98,7 +98,7 @@ const BulkOperationsResultModal = ({
             parentClassName="h-100"
         >
             <dialog
-                className="bcn-0 h-100 cn-9 w-100 flexbox-col dc__overflow-hidden p-0 bulk-operation__results-modal"
+                className="bg__primary h-100 cn-9 w-100 flexbox-col dc__overflow-hidden p-0 bulk-operation__results-modal"
                 onClick={stopPropagation}
             >
                 <header className="px-20 py-12 lh-24 flexbox dc__content-space dc__align-items-center dc__border-bottom">
@@ -123,7 +123,7 @@ const BulkOperationsResultModal = ({
                     />
                 </header>
                 <div className="flexbox-col dc__gap-16 dc__overflow-hidden pt-20 flex-grow-1 bulk-operations__results-modal__content">
-                    <div className="bulk-operations__results-modal__bar-chart br-8 flexbox-col dc__align-start dc__align-self-stretch dc__border bcn-0 ml-20 mr-20">
+                    <div className="bulk-operations__results-modal__bar-chart br-8 flexbox-col dc__align-start dc__align-self-stretch dc__border bg__primary ml-20 mr-20">
                         <SegmentedBarChart
                             entities={resultsStore.getBarChartEntities()}
                             rootClassName="p-16 fs-13 dc__border-bottom-n1"

src/Shared/Components/Security/SecurityDetailsCards/SecurityCard.tsx

@@ -55,7 +55,7 @@ const SecurityCard = ({ category, subCategory, severityCount = {}, handleCardCli
 
     return (
         <div
-            className={`w-100 bcn-0 p-20 flexbox-col dc__gap-16 br-8 dc__border security-card security-card${hasThreats ? '--threat' : '--secure'}`}
+            className={`w-100 bg__primary p-20 flexbox-col dc__gap-16 br-8 dc__border security-card security-card${hasThreats ? '--threat' : '--secure'}`}
             role="button"
             tabIndex={0}
             onClick={handleCardClick}

src/Shared/Components/VirtualizedList/VirtualizedList.component.tsx

@@ -49,7 +49,7 @@ export const VirtualizedList = <ListKeys extends string | number, ExtendedType e
         nodeInfo,
         style,
     }) => (
-        <div key={node.id} className="bcn-0" style={style}>
+        <div key={node.id} className="bg__primary" style={style}>
             {renderItem({ node, nodeInfo })}
         </div>
     )