@import url('./lensFonts.css');
.lens-ui {
  --lens-component-dropdown-container-box-shadow: 0px 10px 24px 0px #161b2b29,
    0px 0px 2px 0px #161b2b1a;
  --lens-component-tooltip-box-shadow: 0px 0px 2px 0px #0000001A, 0px 8px 16px 0px #0000001A;

  /* colors */
  --lens-core-color-brand-primary-diligent-red: #ee312e;
  --lens-core-color-brand-primary-red-2: #d3222a;
  --lens-core-color-brand-primary-red-3: #af292e;
  --lens-core-color-brand-primary-red-4: #921a1d;
  --lens-core-color-brand-primary-red-5: #5f091d;
  --lens-core-color-brand-neutral-gray-1: #f3f3f3;
  --lens-core-color-brand-neutral-gray-2: #dadada;
  --lens-core-color-brand-neutral-gray-3: #a0a2a5;
  --lens-core-color-brand-neutral-gray-4: #6f7377;
  --lens-core-color-brand-neutral-gray-5: #282e37;
  --lens-semantic-color-action-primary-hover: #464e53;
  --lens-semantic-color-ui-focus-ring: #0b4cce;
  --lens-component-form-field-error-color: #921a1d;

  /* BUTTON */
  /* primary */
  --lens-component-button-primary-default-background: #282e37;
  --lens-component-button-primary-hover-background: #464e53;
  --lens-component-button-primary-active-background: #121a26;
  --lens-component-button-primary-disabled-background: #e6e6e6;
  --lens-component-button-primary-disabled-color: #a0a2a5;
  /* secondary */
  --lens-component-button-secondary-default-background: #ffffff;
  --lens-component-button-secondary-default-border-color: #282e37;
  --lens-component-button-secondary-hover-background: #f3f3f3;
  --lens-component-button-secondary-active-background: #e6e6e6;
  /* tertiary */
  --lens-component-button-tertiary-hover-background: #e6e6e6;
  --lens-component-button-tertiary-active-background: #dadada;
  /* destructive */
  --lens-component-button-destructive-primary-default-background: #921a1d;
  --lens-component-button-destructive-primary-hover-background: #d3222a;
  --lens-component-button-destructive-primary-active-background: #5f091d;
  --lens-component-button-destructive-primary-disabled-background: #921a1d80;

  /* data visualization colors */
  --lens-semantic-color-data-visualization-qualitative-blue-01: #00d3f3;
  --lens-semantic-color-data-visualization-qualitative-blue-02: #00aaf3;
  --lens-semantic-color-data-visualization-qualitative-blue-03: #0086fa;
  --lens-semantic-color-data-visualization-qualitative-blue-04: #0b4cce;
  --lens-semantic-color-data-visualization-qualitative-purple-04: #4d1dd5;
  --lens-semantic-color-data-visualization-qualitative-purple-03: #642fcf;
  --lens-semantic-color-data-visualization-qualitative-purple-02: #8b4bfa;
  --lens-semantic-color-data-visualization-qualitative-purple-01: #c247fa;
  --lens-semantic-color-data-visualization-qualitative-gray-01: #dadada;
  --lens-semantic-color-data-visualization-qualitative-gray-02: #a0a2a5;
  --lens-semantic-color-data-visualization-qualitative-gray-03: #6f7377;
  --lens-semantic-color-data-visualization-qualitative-gray-04: #282e37;
  --lens-semantic-color-data-visualization-sequential-positive-01: #9ef5ee;
  --lens-semantic-color-data-visualization-sequential-positive-02: #00e5d2;
  --lens-semantic-color-data-visualization-sequential-positive-03: #00ccbb;
  --lens-semantic-color-data-visualization-sequential-positive-04: #00a89a;
  --lens-semantic-color-data-visualization-sequential-positive-05: #04655d;
  --lens-semantic-color-data-visualization-sequential-negative-01: #ffcce1;
  --lens-semantic-color-data-visualization-sequential-negative-02: #ff99c4;
  --lens-semantic-color-data-visualization-sequential-negative-03: #ff66a3;
  --lens-semantic-color-data-visualization-sequential-negative-04: #e6005c;
  --lens-semantic-color-data-visualization-sequential-negative-05: #a30041;
  --lens-semantic-color-data-visualization-sequential-neutral-01: #fef9af;
  --lens-semantic-color-data-visualization-sequential-neutral-02: #f4eb75;
  --lens-semantic-color-data-visualization-sequential-neutral-03: #f5cc00;
  --lens-semantic-color-data-visualization-sequential-neutral-04: #e5a500;
  --lens-semantic-color-data-visualization-sequential-neutral-05: #9e6900;

  --lens-semantic-color-status-success-default: #8EE400;

  /* FONTS */
  --lens-semantic-font-title-h1-billboard-font-size: 1.875rem;
  --lens-semantic-font-title-h2-display-font-size: 1.625rem;
  --lens-semantic-font-title-h3-lg-font-size: 1.375rem;
  --lens-semantic-font-title-h4-md-font-size: 1.125rem;
  --lens-semantic-font-title-h5-sm-font-size: 1rem;
  --lens-semantic-font-title-h6-xs-font-size: 0.8rem;
  --lens-component-form-field-label-font-size: 0.75rem;
  --lens-component-table-header-font-size: 1rem;
  --lens-component-table-cell-font-size: 0.875rem;
  --lens-component-input-medium-input-font-size: 1rem;

  /* RADIUS */
  --lens-small-radius: 8px;
  --lens-mid-radius: 12px;

  /* override var */
  --input-padding-x: 11px;
  /* COLORS */
  --color--gray: #a9a9a9;
  --color--main: #337ab7;
  --color--f4: #f4f4f4;
  --color--primary: var(--lens-core-color-brand-neutral-gray-5);
  
  /* override end */

  /* FONTS */
  *{
    font-family: Plus Jakarta Sans Variable !important;
  }

  /* body background color white 
    TODO(lsekharbehera): discuss again and enable this 
  */
  background-color: #fff; 

  .MuiTypography-h6{
    font-size: var(--lens-semantic-font-title-h4-xs-font-size) !important;
    font-weight: 500 !important;
  }
  .MuiTypography-h3{
    margin: 24px 0px 12px 0px;
    font-size: var(--lens-semantic-font-title-h3-lg-font-size) !important;
    font-weight: 500 !important;
  }

  .MuiMenu-paper {
    border-radius: var(--lens-small-radius) !important;
    box-shadow: var(--lens-component-dropdown-container-box-shadow) !important;
  }
  .MuiMenu-list li:first-child {
    border-top-left-radius: 8px !important;
    border-top-right-radius: 8px !important;
  }
  .MuiMenu-list li:last-child {
    border-bottom-left-radius: 8px !important;
    border-bottom-right-radius: 8px !important;
  }
  .MuiMenu-paper .MuiListItem-root {
    padding: 8px 16px !important;
  }

  /* ToggleButton Group */
  .MuiToggleButtonGroup-root .MuiToggleButton-root {
    background-color: #fff !important;
    border: 1px solid var(--lens-core-color-brand-neutral-gray-5) !important;
    padding: 8px 12px !important;
  }
  .MuiToggleButtonGroup-root .MuiToggleButton-root:focus {
    outline: 2px solid var(--lens-semantic-color-ui-focus-ring) !important;
    outline-offset: 1px !important;
    z-index: 1 !important;
  }
  .MuiToggleButtonGroup-root .Mui-selected {
    background-color: var(--lens-core-color-brand-neutral-gray-5) !important;
    color: #fff !important;
  }
  .MuiToggleButtonGroup-root .Mui-selected img {
    filter: invert(100%) brightness(100%) !important;
  }

  /* Inputs */
  .lens-hidden-input-sibling {
    background-color: transparent !important;
    border: none !important;
  }
  .lens-form select,
  .lens-form textarea,
  .lens-form input:not([type='submit'], [type='button']),
  .lens-input,
  .lens-input-warper-div:has(textarea),
  .lens-input-warper-div:has(input) {
    background-color: #fff !important;
    border: 1px solid var(--lens-core-color-brand-neutral-gray-4) !important;
    border-radius: var(--lens-small-radius) !important;
  }
  .lens-form select,
  .lens-form textarea,
  .lens-form input:not([type='submit'], [type='button'])
  .lens-input,
  .lens-input-warper-div textarea,
  .lens-input-warper-div input {
    background-color: transparent !important;
    color: var(--lens-core-color-brand-neutral-gray-5);
    font-size: var(--lens-component-input-medium-input-font-size) !important;
  }
  .lens-form select:focus,
  .lens-form textarea:focus,
  .lens-form input:not([type='submit'], [type='button']):focus,
  .lens-input:focus,
  .lens-input-warper-div:has(textarea:focus),
  .lens-input-warper-div:has(input:focus) {
    outline: 2px solid var(--lens-semantic-color-ui-focus-ring) !important;
    outline-offset: 1px !important;
  }
  .lens-input-warper-div {
    .lens-input-warper-div:has(textarea),
    .lens-input-warper-div:has(input) {
      outline: none !important;
      border: none !important;
    }
  }

  .lens-form label,
  .lens-ee-label{
    font-size: var(--lens-component-form-field-label-font-size) !important;
    line-height: 1rem !important;
    padding-bottom: 8px;
    font-weight: 600;
    margin: 0px !important;
  }
  h6.lens-ee-label{
    margin: 0px !important;
  }

  /* Table/Grid */
  .grid-wrapper {
    overflow: hidden;
    color: var(--lens-core-color-brand-neutral-gray-5);
  }
  .grid-wrapper .react-grid-Header div {
    box-shadow: none !important;
  }
  .grid-wrapper .double-header div {
    background-color: transparent !important;
  }
  .grid-wrapper .react-grid-HeaderCell,
  .grid-wrapper .react-grid-Cell {
    border: none !important;
    border-right: 1px solid var(--lens-core-color-brand-neutral-gray-2) !important;
    border-bottom: 1px solid var(--lens-core-color-brand-neutral-gray-2) !important;
    background-color: #ffffff !important;
  }
  .react-grid-Header,
  .react-grid-Header .react-grid-HeaderCell {
    background-color: var(--lens-core-color-brand-neutral-gray-1) !important;
    font-size: var(--lens-component-table-header-font-size) !important;
  }
  .grid-wrapper .react-grid-Viewport div {
    color: var(--lens-core-color-brand-neutral-gray-5) !important;
    box-shadow: none !important;
  }
  .react-grid-Cell {
    background-color: #ffffff !important;
    font-size: var(--lens-component-table-cell-font-size) !important;
    line-height: 1.25rem !important;
  }
  .grid-wrapper .react-grid-HeaderRow {
    color: var(--lens-core-color-brand-neutral-gray-5) !important;
  }
  .double-header div:first-child {
    background-color: var(--lens-core-color-brand-neutral-gray-1) !important;
  }
  .react-grid-Row:not(:first-child) {
    margin: 1px !important;
  }
  .rdg-selected {
    border-color: var(--lens-semantic-color-ui-focus-ring) !important;
  }

  /* MUI table */
  .lens-react-table{
    border-top-left-radius: 12px !important;
    border-top-right-radius: 12px !important;
    overflow: hidden !important;
  }

  /* label */
  .lens-form-control {
    display: flex;
    flex-direction: column;
    align-items: start;
  }
  /* Lens Side Menu */
  .lens-side-drawer > div {
    color: #ffffff !important;
  }
  .lens-side-drawer-paper * {
    color: #ffffff !important;
  }
  .lens-side-drawer-paper {
    background-color: var(--lens-core-color-brand-neutral-gray-5) !important;
    color: #ffffff !important;
    padding: 12px !important;
  }
  .lens-menu-item {
    border-radius: var(--lens-mid-radius) !important;
    padding: 12px !important;
    width: 100% !important;
    margin-bottom: 12px;
  }
  .lens-menu-item:hover {
    background-color: var(--lens-semantic-color-action-primary-hover) !important;
  }
  .lens-menu-item-selected,
  .lens-menu-item-selected:hover {
    background-color: var(--lens-core-color-brand-primary-red-2) !important;
    color: #ffffff !important;
  }
  .lens-dividers {
    border-bottom: 1px solid var(--lens-core-color-brand-neutral-gray-3) !important;
  }
  /* Lens toolbar */
  .lens-appBar,
  .lens-firm-top-bar {
    background-color: var(--lens-core-color-brand-neutral-gray-5) !important;
  }

  /* Dashboard */
  .dashboard-block{
    border-radius: var(--lens-mid-radius) !important;
    background-color: #ffffff !important;
    box-shadow: var(--lens-component-dropdown-container-box-shadow) !important;
  }
  /* VIEW SECTION */
  .lens-content-section{
    padding-top: 72px !important;
  }

  /* Dialog */
  .lens-dialog-title{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    border-bottom: 1px solid var(--lens-core-color-brand-neutral-gray-2) !important;
    padding-right: 60px !important; /* exit modal and wizard are not consistence */
  }
  .lens-dialog-title-text{
    margin: 0px !important;
    color: #000 !important;
    font-size: var(--lens-semantic-font-title-h3-lg-font-size) !important;
    font-weight: bold !important;
    line-height: 1.6 !important;
  }
  .lens-modal-close-button{ /* exit modal and wizard are not consistence */
    position: absolute;
    right: 14px;
  }

  /* LOGIN FORM */
  .lens-login-form{
    background-color: #ffffff !important;
    border-radius: var(--lens-mid-radius) !important;
    box-shadow: var(--lens-component-dropdown-container-box-shadow) !important;
  }
  .lens-link-text{
    text-decoration: underline;
  }
  .lens-link-text,
  a{
    color: var(--lens-core-color-brand-neutral-gray-5) !important;
  }
  .lens-link-text:hover,
  a:hover{
    color: var(--lens-semantic-color-action-primary-hover) !important;
  }
  [class*='MuiBox-root']:has(form){
    width: 100% !important;
  }

  /* AUTOCOMPLETE LIST*/
  .lens-autocomplete-results{
    margin-left: 0px !important;
    margin-top: 1.85rem !important;
  }

  /* --------------------------------         INVEST : React.js          ---------------------------- */
  /* TODO(lsekharbehera): Need to remove above code and have to move some code to below in upcoming changes */

  /* OVERRIDE COLOR */
  .lens-bg-white {
    background-color: #ffffff !important;
  }
  .lens-text-black{
    color: black !important;
  }
  .lens-text-white{
    color: #fff !important;
  }

  .material-icons{
    font-family: 'Material Icons' !important;
  }

  /* HIDE ELEMENT */
  .lens-hide {
    display: none !important;
  }
  /* OVERRIDE TYPOGRAPHY */
  .lens-h-80vh{
    height: 80vh !important;
  }
  .lens-h1{
    font-size: var(--lens-semantic-font-title-h1-billboard-font-size) !important;
  }
  .lens-h2{
    font-size: var(--lens-semantic-font-title-h2-display-font-size) !important;
  }
  .lens-h3{
    font-size: var(--lens-semantic-font-title-h3-lg-font-size) !important;
    font-weight: 500 !important;
    line-height: 1.6 !important;
  }
  .lens-h4{
    font-size: var(--lens-semantic-font-title-h4-md-font-size) !important;
  }
  .lens-h5{
    font-size: var(--lens-semantic-font-title-h5-sm-font-size) !important;
  }
  .lens-h6{
    font-size: var(--lens-semantic-font-title-h6-xs-font-size) !important;
  }
  .lens-text-bold{
    font-weight: 500 !important;
  }
  .lens-m-0{
    margin: 0px !important;
  }
  .lens-p-0{
    padding: 0px !important;
  }
  .lens-pl-0{
    padding-left: 0px !important;
  }
  .lens-ml-0{
    margin-left: 0px !important;
  }
  .lens-mb-0,
  .lens-mb-0 .mb-2,
  .lens-mb-0 .mb-3 {
    margin-bottom: 0 !important;
  }
  .lens-mt-0{
    margin-top: 0px !important;
  }
  .lens-mb-2{
    margin-bottom: 0.75rem !important;
  }
  .lens-mt-2{
    margin-top: 0.75rem !important;
  }
  .lens-mb-3 {
    margin-bottom: 1rem !important;
  }
  .lens-ml-2{
    margin-left: 0.75rem !important;
  }
  .lens-w-full{
    width: 100%;
  }
  .lens-rounded-md{
    border-radius: 12px !important;
    overflow: hidden;
  }
  .lens-gap-2{
    gap: 0.75rem;
  }
  .lens-align-bottom {
    align-items: end;
  }
  .lens-align-start{
    align-items: flex-start !important;
  }

  /* TEXT FIELD */
  .lens-text-field-warper{
    display: flex;
    flex-direction: column;
    margin: 0px !important;
  }
  .lens-text-field-warper fieldset{
    border: none !important;
  }
  .lens-text-field-root{
    border-radius: var(--lens-mid-radius) !important;
    border: 1px solid var(--lens-core-color-brand-neutral-gray-4) !important;
    padding: 8px 12px !important;
    font-size: var(--lens-component-input-medium-input-font-size) !important;
  }
  .lens-text-field-root:has(textarea),
  .lens-text-field-root:has(input) {
    background-color: #fff !important;
    border: 1px solid var(--lens-core-color-brand-neutral-gray-4) !important;
    border-radius: var(--lens-small-radius) !important;
  }
  .lens-text-field-root textarea,
  .lens-text-field-root input {
    background-color: transparent !important;
    color: var(--lens-core-color-brand-neutral-gray-5);
    font-size: var(--lens-component-input-medium-input-font-size) !important;
    padding: 0px !important;
  }
  .lens-text-field-root:has(textarea:focus),
  .lens-text-field-root:has(input:focus) {
    outline: 2px solid var(--lens-semantic-color-ui-focus-ring) !important;
    outline-offset: 1px !important;
  }
  .lens-text-field-root::before,
  .lens-text-field-root::after{
    border: none !important;
  }
  .lens-text-field-root{
    .lens-text-field-root:has(textarea),
    .lens-text-field-root:has(input) {
      outline: none !important;
      border: none !important;
    }
  }
  .lens-input-warper{
    display: flex;
    flex-direction: column !important;
  }
  .lens-ee-label{
    font-size: var(--lens-component-form-field-label-font-size) !important;
    line-height: 1rem !important;
    padding-bottom: 8px;
    font-weight: 600;
  }
  .lens-section{
    border-radius: 12px;
  }

  /* HEADER */
  .lens-top-banner{
    background-color: var(--lens-core-color-brand-neutral-gray-5);
    color: #fff !important;
  }
  .lens-top-nav-bar{
    padding: 8px 0px !important;
  }
  .lens-nav-link{
    border-radius: var(--lens-small-radius);
    padding: 8px 12px !important;
    border: none !important;
    margin: 4px;
  }
  .lens-nav-link:hover:not(.active){
    background-color: var(--lens-core-color-brand-neutral-gray-1) !important;
  }
  .lens-nav-link.active{
    color: #fff !important;
    background-color: var(--lens-core-color-brand-neutral-gray-5);
  }

  /* TABLE */
  .lens-table table,
  .lens-table{
    border-radius: var(--lens-mid-radius);
    border: 1px solid var(--lens-core-color-brand-neutral-gray-1);
    border-collapse: separate;
    border-spacing: 0px;
  }
  .lens-table table th,
  .lens-table th{
    background-color: var(--lens-core-color-brand-neutral-gray-1) !important;
    font-size: var(--lens-component-table-header-font-size);
    white-space: nowrap;
    padding-right: 30px !important; /* 30px to manage the spacing for the sorting icon in the table header  */
    color: var(--lens-core-color-brand-neutral-gray-5) !important;
  }
  .lens-table table th > span,
  .lens-table th > span{
    color: var(--lens-core-color-brand-neutral-gray-5) !important;
  }
  .lens-table table td,
  .lens-table td{
    background-color: #fff;
    font-size: var(--lens-component-table-cell-font-size) !important;
    font-variant-numeric: tabular-nums;
  }
  .lens-table thead tr:first-child th:first-child{
    border-top-left-radius: 12px;
  }
  .lens-table thead tr:first-child th:last-child{
    border-top-right-radius: 12px;
  }
  .lens-table tbody tr:last-child td:first-child{
    border-bottom-left-radius: 12px;
  }
  .lens-table tbody tr:last-child td:last-child{
    border-bottom-right-radius: 12px;
  }
  .table-footer{
    padding: 0px 0px 12.080px 0px !important; /* 12.080px to manage the spacing in the table footer */
    border: 2px solid var(--lens-core-color-brand-neutral-gray-1) !important;
  }

  /* MODAL */
  .lens-modal-popup-title{
    font-size: var(--lens-semantic-font-title-h4-md-font-size) !important;
    font-weight: 500 !important;
  }
  /* Drawer */
  .lens-drawer{
    padding: 21px;
    min-width: 30rem;
    max-width: 35rem;
  }
  /* Date picker */
  [class*='MuiPickersDay-day'] {
    border-radius: var(--lens-mid-radius) !important;
  }
  [class*='MuiPickersDay-current'] {
    background-color: #fff !important;
    border: 1px solid var(--lens-core-color-brand-primary-red-2) !important;
    color: var(--lens-core-color-brand-neutral-gray-5);
  }
  [class*='MuiPickersDay-daySelected'] {
    background-color: var(--lens-core-color-brand-primary-red-2) !important;
    color: #fff !important;
  }
  [class*='MuiPickersToolbar-toolbar'] {
    background-color: #ffffff !important;
    color: var(--lens-core-color-brand-neutral-gray-5) !important;
    padding: 0px !important;
  }
  [class*='MuiPickersToolbar-toolbar'] [class*='MuiButton-label'] {
    outline: none !important;
  }
  [class*='MuiPickersToolbar-toolbar'] [class*='MuiButton-label'] h6,
  [class*='MuiPickersToolbar-toolbar'] [class*='MuiButton-label'] h4 {
    color: var(--lens-core-color-brand-neutral-gray-5) !important;
  }
  [class*='MuiPickersModal-dialog'] [class*='MuiPickersToolbar-toolbar']{
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
  }
  [class*='MuiPickersModal-dialog'] [class*='MuiPickersToolbar-toolbar'] button:last-child{
    width: 60%;
  }
  [class*='MuiPickersModal-dialog'] [class*='MuiPickersToolbar-toolbar'] button:last-child [class*='MuiTypography-root']{
    font-size: var(--lens-semantic-font-title-h3-lg-font-size) !important;
  }
  [class*='MuiPickersModal-dialog'] [class*='MuiPickersToolbar-toolbar'] button:first-child{
    width: 40%;
  }

  /* SCENARIOS PAGE */
  .lens-underline{
    color: var(--lens-semantic-color-data-visualization-qualitative-gray-04) !important;
  }
  .lens-scenarios-exit{
    top: 36px !important;
  }

  /* Dropdown select */
  .lens-select{
    background-color: white !important;
    padding: 8px 12px !important;
    border-radius: var(--lens-mid-radius) !important;
    font-size: var(--lens-component-input-medium-input-font-size) !important;
    border: 1px solid var(--lens-core-color-brand-neutral-gray-4) !important;
  }
  .lens-select div{
    padding-top: 0px;
    padding-bottom: 0px;
  }
  .lens-kpi-dropdown div{
    font-size: var(--lens-semantic-font-title-h2-display-font-size) !important;
    background-color: #fff;
  }
  /* KPI company status */
  .lens-kpi-status-warper{
    display: grid !important;
    grid-template-rows: auto auto !important;
    grid-template-columns: auto auto auto !important;
    justify-content: start;
  }
  .lens-all-funds{
    grid-row: 2 / 3;
    grid-column: 1 / 2;
  }
  .lens-all-sectors{
    grid-row: 2 / 3;
    grid-column: 3 / 4;
  }
  .lens-all-investments{
    grid-row: 2 / 3;
    grid-column: 5 / 6;
  }

    /* --------------------------------         INVEST : Django          ---------------------------- */
  .lens-nav-link.active a{
    color: #fff !important;
  }
  .lens-nav-link .nav-link{
    padding: 0px !important;
  }
  /* BUTTONS */
  button,
  .btn,
  .lens-btn{
    border-radius: var(--lens-mid-radius) !important;
  }
  .lens-btn{
    padding: 8px 12px !important;
    color: #fff !important;
    border: none !important;
  }
  .lens-btn:focus{
    outline: 2px solid var(--lens-semantic-color-ui-focus-ring) !important;
    outline-offset: 1px !important;
  }
  .lens-btn:disabled{
    background-color: var(--lens-component-button-primary-disabled-background) !important;
    color: var(--lens-component-button-primary-disabled-color) !important;
    border: none !important;
  }
  .prime-btn{
    background-color: var(--lens-component-button-primary-default-background) !important;
  }
  .prime-btn:hover{
    background-color: var(--lens-component-button-primary-hover-background) !important;
    color: #fff !important;
  }
  .prime-btn:active{
    background-color: var(--lens-component-button-primary-active-background);
  }
  .secondary-btn{
    color: var(--lens-core-color-brand-neutral-gray-5) !important;
    border: 1px solid var(--lens-component-button-secondary-default-border-color) !important;
    background-color: var(--lens-component-button-secondary-default-background) !important;
  }
  .secondary-btn:hover{
    border: 1px solid var(--lens-component-button-secondary-default-border-color) !important;
    background-color: var(--lens-component-button-secondary-hover-background) !important;
  }
  .secondary-btn:active{
    border: 1px solid var(--lens-component-button-secondary-default-border-color) !important;
    background-color: var(--lens-component-button-secondary-active-background) !important;
  }
  .tertiary-btn{
    background-color: #fff !important;
    color: var(--lens-core-color-brand-neutral-gray-5) !important;
  }
  .tertiary-btn:hover{
    background-color: var(--lens-component-button-tertiary-hover-background) !important;
  }
  .tertiary-btn:active{
    background-color: var(--lens-component-button-tertiary-active-background) !important;
  }
  .destructive-btn{
    background-color: var(--lens-component-button-destructive-primary-default-background) !important;
  }
  .destructive-btn:hover{
    background-color: var(--lens-component-button-destructive-primary-hover-background) !important;
  }
  .destructive-btn:active{
    background-color: var(--lens-component-button-destructive-primary-active-background) !important;
  }
  .destructive-btn:disabled{
    background-color: var(--lens-component-button-destructive-primary-disabled-background) !important;
  }

  /* FORM */
  .lens-form input[type="checkbox"]{
    accent-color: var(--lens-core-color-brand-neutral-gray-5) !important;
  }

  /* MODAL */
  .lens-modal-header{
    background-color: #fff !important;
    color: var(--lens-core-color-brand-neutral-gray-5) !important;
    border: none !important;
    margin: 16px 24px;
  }
  .lens-modal-header .close {
    color: var(--lens-core-color-brand-neutral-gray-5);
    font-size: 2rem;
  }
  .lens-modal-content{
    border-radius: var(--lens-mid-radius) !important;
    overflow: hidden;
  }
  .lens-body,
  .modal-body{
    padding-top: 0px;
    margin-top: 0px !important;
  }

  /* fa ICONS */
  .fa{
    font-family: 'Font Awesome 5 Free' !important;
  }
  
  /* DASHBOARD CARD */
  .lens-card{
    border-radius: var(--lens-mid-radius) !important;
    overflow: hidden;
    transition: all 0.25s ease-in-out;
  }
  .lens-card-top a{
    border-radius: var(--lens-mid-radius) !important;
    padding: 4px 8px !important;
    font-size: 0.7rem;
    color: var(--lens-core-color-brand-neutral-gray-5) !important;
    border: none !important;
    background-color: var(--lens-component-button-secondary-default-background) !important;
  }
  .lens-card-top a:hover{
    border: none !important;
    background-color: var(--lens-component-button-secondary-hover-background) !important;
    text-decoration: none !important;
  }
  .lens-card-top{
    background-color: #fff;
    color: var(--lens-core-color-brand-neutral-gray-5);
  }
  .lens-card:hover{
    box-shadow: none !important;
  }
  .lens-card:hover .lens-card-top{
    background-color: #fff;
  }
  .lens-card-values{
    font-size: 1rem;
  }

  /* Card Icons */
  .multiple{
    background: url('../images/new/lens-multiple.svg') no-repeat center;
  }
  .net-irr{
    background: url('../images/new/lens-net-irr.svg') no-repeat center;
  }
  .irr{
    background: url('../images/new/lens-irr.svg') no-repeat center;
  }

  /* AI SECTION */
  .lens-ai-section-warper{
    border-radius: var(--lens-mid-radius);
  }

  /* DROPDOWN MENU */
  .lens-dropdown-menu{
    background-color: #fff !important;
    border-radius: var(--lens-mid-radius) !important;
    box-shadow: var(--lens-component-dropdown-container-box-shadow) !important;
    padding: 0px !important;
    overflow: auto;
    border: none;
  }
  .lens-dropdown-list{
    padding: 8px 16px !important;
  }
  .lens-dropdown-list:hover{
    background-color: var(--lens-core-color-brand-neutral-gray-1) !important;
  }
  .lens-dropdown-menu-paper{
    margin: 0px !important;
  }

  /* TOOLTIP */
  .lens-tooltip-inner{
    background-color: #fff !important;
    box-shadow: var(--lens-component-tooltip-box-shadow) !important;
    color: var(--lens-core-color-brand-neutral-gray-5) !important;
    border-radius: var(--lens-small-radius) !important;
    text-align: left !important;
  }

  .lens-arrow::before {
    border-top-color: #fff !important;
    border-bottom-color: #fff !important;
  }
  
  /* Header dropdown */
  .lens-header-dropdown{
    color: #fff !important;
    padding: 0px !important;
    border-radius: var(--lens-mid-radius) !important;
    border: none !important;
    box-shadow: var(--lens-component-dropdown-container-box-shadow) !important;
    overflow: hidden;
    padding: 8px 0px !important;
  }
  .lens-header-dropdown:focus{
    outline: 2px solid var(--lens-semantic-color-ui-focus-ring) !important;
  }
  .lens-dropdown-icon{
    min-width: 30px;
    font-size: 1rem;
    margin: 0px !important;
    color: #999 !important; /* to match the React menu */
  }
  .lens-header-dropdown-item{
    padding: 8px 12px !important;
  }
  .lens-header-dropdown-item:active{
    background-color: var(--lens-core-color-brand-neutral-gray-1) !important;
  }

  /* ACCORDION and SETTING MODAL */
  .lens-according-summary{
    height: unset !important;
  }
  .lens-ee-checkbox-label{
    margin-bottom: 0px;
  }
  .lens-draggable{
    height: unset !important;
  }
  .lens-draggable-section{
   align-items: center; 
  }

  /* COMPANY PAGE STATUS ICON */
  .lens-company-title{
    justify-content: flex-end;
    flex-direction: row-reverse !important;
  }
  .info-active{
    margin-left: 5px;
    background-color: var(--lens-semantic-color-status-success-default);
  }
  
  /* SCENARIOS PAGE */
  .lens-width-250{
    width: 250px !important;
  }

  /* Loader */
  .lens-loader-warper{
    background-color: #fff !important;
  }
  .lens-loader{
    color: var(--lens-core-color-brand-neutral-gray-5) !important;
  }

  /* CHIP */
  .lens-chip-h{
    height: 1.6rem;
  }

  /* error message */
  .form-control.is-invalid{
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9IiM5MjFhMWQiIHZpZXdCb3g9Ii0yIC0yIDcgNyI+PHBhdGggc3Ryb2tlPSIjOTIxYTFkIiBkPSJNMCAwbDMgM20wLTNMMCAzIi8+PGNpcmNsZSByPSIuNSIvPjxjaXJjbGUgY3g9IjMiIHI9Ii41Ii8+PGNpcmNsZSBjeT0iMyIgcj0iLjUiLz48Y2lyY2xlIGN4PSIzIiBjeT0iMyIgcj0iLjUiLz48L3N2Zz4=");
  }
  .invalid-feedback,
  .Mui-error,
  .lens-error-msg{
    color: var(--lens-component-form-field-error-color) !important;
    font-size: 0.75rem;
    margin-left: 0px;
  }

  .select2-container .select2-selection--single {
    height: calc(2.25rem + 2px);
  }

  .select2-container--default .select2-selection--single {
    border-radius: var(--lens-small-radius) !important;
    border: 1px solid var(--lens-core-color-brand-neutral-gray-4);
  }

  .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: var(--lens-core-color-brand-neutral-gray-5) !important;
    line-height: calc(2.25rem);
  }

  .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: calc(2.25rem + 2px);
  }

  .select2-container--open .select2-dropdown--below {
    border-radius: var(--lens-small-radius) !important;
  }

  .select2-results__option {
    border-bottom: 1px solid var(--lens-semantic-color-data-visualization-qualitative-gray-01);
  }

  .select-error {
    gap: 4px;
    font-size: 0.75rem;
    line-height: 1rem;
    font-weight: 400;
    letter-spacing: 0.3px;
    padding-top: 8px;
    color: var(--lens-component-form-field-error-color);
  }

  .select-error .fa {
    color: var(--lens-component-form-field-error-color);
  }
}