/* Color Palette */
:root {
  --dropdown-selected-bg-color: #dff0db;
  --tab-active: #498e2b;
  --primary-active: #498e2b;
  --tab-hovered: #dfe2e6;
  --border-light-color: #e4e4e4;
  --light-backdrop-bg-color: rgba(0, 0, 0, 0.5);
  --close-icon-light: #888;
  --joy-ride--body: #333;
  --dot-bg-color: #e0e0e0;
  --dot-active-bg-color: #4caf50;
  --back-button-color: #bdbdbd;
  --green-color-4: #3f7b25;
  --message-success-stroke-color: #a5d192;
  --toast-border-error: #f1b5b7;
  --light-theme-text-color: #4a4a4a;
  --dark-theme-text-color: #ffffffde;
  --unapproved-lane-bg: var(--color-orange-100, #fffcf8);
  --navbar-active-border-color: #5cb335;
  ---box-shadow-color: #00000029;
  --grey-50: #727272;
  --navbar-divider-color-all: #727272;
  --input-grey-disabled: #cccccc;
  --kpi-success: #498e2b;
  --badge-success: 73, 142, 43;
  --kpi-error: #cb282e;
  --grey-background: #f7f7f7;
  --grey-background-light: #f7f7f7;
  --grey-background-dark: #3a3838;
  --error-cell-border-color: #e02525;
  --orange-cell-border-color: #b86a0f;
  --purple-cell-border-color: #632494;
  --light-theme-bg: #ffffff;
  --dark-theme-bg: #1f1f21;
  --link-txt-color: #0369a3;
  --toast-dark-border-yellow: #f9d250;
  --kpi-light-box-shadow: #00000029;
  --kpi-dark-box-shadow: transparent;
  --dark-input-placeholder-color: rgba(255, 255, 255, 0.6);
  --light-input-placeholder-color: #8a93a2;
  --dark-input-bg-color: #3a3838;
  --light-input-bg-color: #ffffff;
  --dark-menu-list-bg-color: #2d2c2c;
  --dark-menu-list-setting-bg-color: #242527;
  --light-menu-list-setting-bg-color: #f7fff3;
  --light-options-bg-color: #dff0db;
  --light-options-bg-color-selected: #8dca7e;
  --dark-options-bg-color: #4a4a4a;
  --dark-input-border: 1px solid #4a4a4a;
  --light-input-border: 1px solid #cccccc;
  --input-active-color: #8dca7e;
  --input-active-bg-color: #498e2b;
  --warning-status-text: #b86a0f;
  --input-active-bg-color: #498e2b;
  --menu-hover-text-color: #498e2b;
  --sub-label-color: #929292;
  --light-sub-menu-hover-color: #dff0db;
  --dark-sub-menu-hover-color: #242527;
  --light-menu-shadow: #00000040;
  --dark-menu-shadow: #ffffff40;
  --light-menu-bg-color: #fff;
  --dark-menu-bg-color: #1c1d1f;
  --dark-menu-list-bg-color: #000;
  --light-menu-list-bg-color: #f7fff3;
  --dark-icon-button-text-color: #f1f1f1;
  --light-icon-button-text-color: #4a4a4a;
  --light-icon-color: #727272;
  --dark-icon-color: #f1f1f1;
  --light-accordion-bg-color-landed-cost: #fff;
  --dark-accordion-bg-color-landed-cost: rgba(255, 255, 255, 0.0509803922);
  --message-background: rgb(9 9 11);
  --input-error: #ffd8d8;
  --textarea: #1c1c1c;
  --hts-purple: #632494;
  --cell-border: #babfc7;
  --scenario-amount: #181818;
  --toast-border-background-error: #ffebed;
  --toast-dark-background-yellow: #fec;
  --header-divider: #ccc;
  --color-ag-data-color: #181d1f;
  --Charts-Purple-100: #ede3f4;
  --gen-ai-border-color: #cccccc;
}

.light-theme {
  --dropdown-selected-bg-color: #dff0db;
  --user-message-bg-color: var(--grey-background-light);
  --theme-text-color: var(--light-theme-text-color);
  --scenario-summary-amount: var(--scenario-amount);
  --active-color: var(--input-active-color);
  --active-bg-color: var(--input-active-bg-color);
  --kpi-card-bg: var(--light-theme-bg);
  --input-placeholder-color: var(--light-input-placeholder-color);
  --input-bg-color: var(--light-input-bg-color);
  --input-menu-list-bg-color: var(--light-input-bg-color);
  --input-options-bg-color: var(--light-options-bg-color);
  --input-options-bg-color-selected: var(--light-options-bg-color-selected);
  --input-text-color: var(--dark-input-bg-color);
  --input-border: var(--light-input-border);
  --kpi-box-shadow: 0px 0px 4px 0px var(--kpi-light-box-shadow);
  --menu-list-bg-color: var(--light-menu-list-bg-color);
  --menu-list-setting-bg-color: var(--light-menu-list-bg-color);
  --menu-shadow: var(--light-menu-shadow);
  --menu-bg-color: var(--light-menu-bg-color);
  --menu-hover-color: var(--menu-hover-text-color);
  --sub-menu-hover-color: var(--light-sub-menu-hover-color);
  --cui-success-rgb: var(--badge-success);
  --icon-button-text-color: var(--light-icon-button-text-color);
  --unapproved-lane-bg: var(--color-orange-100, #fffcf8);
  --icon-color: var(--light-icon-color);
  --accordion-bg-color: var(--light-accordion-bg-color-landed-cost);
  --navbar-item-color-border-selected: var(--navbar-active-border-color);
}

.dark-theme {
  --dropdown-selected-bg-color: #dff0db;
  --user-message-bg-color: var(--grey-background-dark);
  --theme-text-color: var(--dark-theme-text-color);
  --scenario-summary-amount: var(--dark-theme-text-color);
  --kpi-box-shadow: 0px 0px 4px 0px var(--kpi-dark-box-shadow);
  --active-color: var(--input-active-color);
  --active-bg-color: var(--input-active-bg-color);
  --input-border: var(--dark-input-border);
  --kpi-card-bg: var(--dark-theme-bg);
  --input-bg-color: var(--dark-input-bg-color);
  --input-options-bg-color-selected: var(--light-options-bg-color-selected);
  --input-text-color: var(--light-input-bg-color);
  --input-placeholder-color: var(--dark-input-placeholder-color);
  --input-menu-list-bg-color: var(--dark-input-bg-color);
  --input-options-bg-color: var(--dark-options-bg-color);
  --menu-shadow: var(--dark-menu-shadow);
  --menu-bg-color: var(--dark-menu-bg-color);
  --menu-list-bg-color: var(--dark-menu-list-bg-color);
  --menu-list-setting-bg-color: var(--dark-menu-list-setting-bg-color);
  --menu-hover-color: var(--menu-hover-text-color);
  --sub-menu-hover-color: var(--dark-sub-menu-hover-color);
  --cui-success-rgb: var(--badge-success);
  --icon-button-text-color: var(--dark-icon-button-text-color);
  --unapproved-lane-bg: rgb(31, 31, 33);
  --icon-color: var(--dark-icon-color);
  --accordion-bg-color: var(--dark-accordion-bg-color-landed-cost) !important;
  --navbar-item-color-border-selected: var(--navbar-active-border-color);
}

.switch {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.switch .switch__label {
  width: 2.125rem;
  height: 1.25rem;
  position: relative;
  display: block;
  border-radius: 12.5rem;
  background-color: #878787;
  cursor: pointer;
  transition: 0.2s;
}
.switch .switch__label:after {
  content: "";
  width: 0.938rem;
  height: 0.938rem;
  position: absolute;
  top: 0.188rem;
  left: 0.188rem;
  background: #ffffff;
  border-radius: 11.25rem;
  box-shadow: 0rem 0.313rem 0.625rem rgba(0, 0, 0, 0.2);
  transition: 0.2s;
}
.switch .switch__label--disabled {
  width: 2.125rem;
  height: 1.25rem;
  position: relative;
  display: block;
  border-radius: 12.5rem;
  background-color: #878787;
  cursor: not-allowed;
  transition: 0.2s;
  opacity: 0.6;
}
.switch .switch__label--disabled:after {
  content: "";
  width: 0.938rem;
  height: 0.938rem;
  position: absolute;
  top: 0.188rem;
  left: 0.188rem;
  background: #ffffff;
  border-radius: 11.25rem;
  box-shadow: 0rem 0.313rem 0.625rem rgba(0, 0, 0, 0.2);
  transition: 0.2s;
}
.switch .switch__input {
  width: 0;
  height: 0;
  visibility: hidden;
}
.switch .switch__input--disabled {
  width: 0;
  height: 0;
  visibility: hidden;
}
.switch .switch__input:checked + .switch__label {
  background: #498e2b;
}
.switch .switch__input:checked + .switch__label:after {
  left: 1rem;
  background: #ffffff;
}
.switch .switch__input--disabled:checked + .switch__label--disabled {
  background: #878787;
}
.switch .switch__input--disabled:checked + .switch__label--disabled:after {
  left: 1rem;
  background: #ffffff;
}

.radio-section {
  margin-right: 0.75em;
  display: flex;
  align-items: center;
}
.radio-section .radio-input {
  width: 1rem;
  height: 1rem;
  margin: 0 0.5rem 0 0;
  accent-color: #498e2b;
  cursor: pointer;
}

.radio__button {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  cursor: pointer;
}
.radio__button .radio__input {
  width: 1rem;
  height: 1rem;
  margin: 0 0.25em;
  accent-color: #498e2b;
}
.radio__button .radio__input.radio__color__light--custom-table, .radio__button .radio__input.radio__color__dark--custom-table {
  color: #181d1f;
  accent-color: #181d1f;
}
.radio__button .radio__input.radio__color__light--disabled, .radio__button .radio__input.radio__color__dark--disabled {
  color: #a3a3a3;
  accent-color: #a3a3a3;
}
.radio__button .radio__input.radio__color__light--text-secondary, .radio__button .radio__input.radio__color__dark--text-secondary {
  color: #28292c;
  accent-color: #28292c;
}
.radio__button .radio__input.radio__color__light--light, .radio__button .radio__input.radio__color__dark--light {
  color: rgba(255, 255, 255, 0.8705882353);
  accent-color: rgba(255, 255, 255, 0.8705882353);
}
.radio__button .radio__input.radio__color__light--dark, .radio__button .radio__input.radio__color__dark--dark {
  color: #4a4a4a;
  accent-color: #4a4a4a;
}
.radio__button .radio__input.radio__color__light--primary, .radio__button .radio__input.radio__color__dark--primary {
  color: #498e2b;
  accent-color: #498e2b;
}
.radio__button .radio__input.radio__color__light--genAi, .radio__button .radio__input.radio__color__dark--genAi {
  color: #632494;
  accent-color: #632494;
}
.radio__button .radio__input.radio__color__light--black, .radio__button .radio__input.radio__color__dark--black {
  color: #28292c;
  accent-color: #28292c;
}
.radio__button .radio__input.radio__color__light--white, .radio__button .radio__input.radio__color__dark--white {
  color: #f1f1f1;
  accent-color: #f1f1f1;
}
.radio__button .radio__input.radio__color__light--orange, .radio__button .radio__input.radio__color__dark--orange {
  color: #b86a0f;
  accent-color: #b86a0f;
}
.radio__button .radio__input.radio__color__light--dark-1, .radio__button .radio__input.radio__color__dark--dark-1 {
  color: #8c8d8f;
  accent-color: #8c8d8f;
}
.radio__button .radio__input.radio__color__light--gray, .radio__button .radio__input.radio__color__dark--gray {
  color: #b3b3b3;
  accent-color: #b3b3b3;
}
.radio__button .radio__input.radio__color__light--link, .radio__button .radio__input.radio__color__dark--link {
  color: #0369a3;
  accent-color: #0369a3;
  text-decoration: underline;
  cursor: pointer;
}
.radio__button .radio__input.radio__color__light--link:hover, .radio__button .radio__input.radio__color__dark--link:hover {
  color: #024870;
  accent-color: #024870;
}
.radio__button .radio__input.radio__color__light--error, .radio__button .radio__input.radio__color__dark--error {
  color: #bf494e;
  accent-color: #bf494e;
}
.radio__button .radio__input.radio__color__light--warning, .radio__button .radio__input.radio__color__dark--warning {
  color: #b86a0f;
  accent-color: #b86a0f;
}
.radio__button .radio__input.radio__color__light--grey, .radio__button .radio__input.radio__color__dark--grey {
  color: #878787;
  accent-color: #878787;
}
.radio__button .radio__input.radio__color__light--grey-30, .radio__button .radio__input.radio__color__dark--grey-30 {
  color: #cccccc;
  accent-color: #cccccc;
}
.radio__button .radio__input.radio__color__light--grey-50, .radio__button .radio__input.radio__color__dark--grey-50 {
  color: #4a4a4a;
  accent-color: #4a4a4a;
}
.radio__button .radio__input.radio__color__light--information, .radio__button .radio__input.radio__color__dark--information {
  color: #0696a6;
  accent-color: #0696a6;
}
.radio__button .radio__input.radio__color__light--grey-text, .radio__button .radio__input.radio__color__dark--grey-text {
  color: #727272;
  accent-color: #727272;
}
.radio__button .radio__input.radio__color__light--primary-hover, .radio__button .radio__input.radio__color__dark--primary-hover {
  color: #3f7b25;
  accent-color: #3f7b25;
}
.radio__button .radio__input.radio__color__light--green-1, .radio__button .radio__input.radio__color__dark--green-1 {
  color: #498e2b;
  accent-color: #498e2b;
}
.radio__button .radio__input.radio__color__light--green-color-2, .radio__button .radio__input.radio__color__dark--green-color-2 {
  color: #8dca7e;
  accent-color: #8dca7e;
}
.radio__button .radio__input.radio__color__light--green-color-4, .radio__button .radio__input.radio__color__dark--green-color-4 {
  color: #3f7b25;
  accent-color: #3f7b25;
}
.radio__button .radio__input.radio__color__light--info-action, .radio__button .radio__input.radio__color__dark--info-action {
  color: #0369a3;
  accent-color: #0369a3;
}
.radio__button .radio__input.radio__color__light--info-action-clickable, .radio__button .radio__input.radio__color__dark--info-action-clickable {
  color: #0369a3;
  accent-color: #0369a3;
  cursor: pointer;
}
.radio__button .radio__input.radio__color__light--green-checked, .radio__button .radio__input.radio__color__dark--green-checked {
  color: #3f702a;
  accent-color: #3f702a;
}
.radio__button .radio__input.radio__color__light--website, .radio__button .radio__input.radio__color__dark--website {
  color: #0369a3;
  accent-color: #0369a3;
}
.radio__button .radio__input.radio__color__light--disabled-tab, .radio__button .radio__input.radio__color__dark--disabled-tab {
  color: #b2b2b2;
  accent-color: #b2b2b2;
}
.radio__button .radio__input.radio__color__light--text-ques, .radio__button .radio__input.radio__color__dark--text-ques {
  color: #28292c;
  accent-color: #28292c;
}
.radio__button .radio__input.radio__color__light--text-ques-none, .radio__button .radio__input.radio__color__dark--text-ques-none {
  color: #b2b2b2;
  accent-color: #b2b2b2;
}
.radio__button .radio__input.radio__color__light--underline, .radio__button .radio__input.radio__color__dark--underline {
  text-decoration-line: underline;
  text-decoration-style: solid;
  text-decoration-skip-ink: auto;
  text-decoration-thickness: auto;
  text-underline-offset: auto;
  text-underline-position: from-font;
}
.radio__button .radio__input.radio__color__light--info-text-light, .radio__button .radio__input.radio__color__dark--info-text-light {
  color: #3b4648;
}
.radio__button .radio__input.radio__color__dark--grey-text {
  color: #f1f1f1;
}
.radio__button .radio__input.radio__color__dark--text-ques {
  color: #ffffff;
}
.radio__button .radio__input.radio__color__dark--text-secondary {
  color: #f1f1f1;
}
.radio__button .radio__input.radio__color__dark--text-ques-none {
  color: #878787;
}
.radio__button .radio__input.radio__color__dark--information {
  color: #6fd4e2;
}
.radio__button .radio__input.radio__color__dark--dark {
  color: rgba(255, 255, 255, 0.8705882353);
}

.checkbox .checkbox__wrapper {
  display: flex;
  align-items: center;
}
.checkbox .checkbox__input {
  margin-right: 0.375rem;
  accent-color: #498e2b;
  width: 1rem;
  height: 1rem;
  cursor: pointer;
}

.multi_action_button {
  width: fit-content;
  display: flex;
  flex-direction: column;
}

.multi_action_button-default {
  display: flex;
  align-items: center;
  border: 0.063rem solid #498e2b;
  border-radius: 0.125rem;
  cursor: pointer;
}

.multi_action_button-feature {
  width: 100%;
  padding: 0.375rem 0.563rem;
  font-weight: 500;
  color: #498e2b;
  background-color: #ffffff;
  border: 0;
  border-right: 0.063rem solid #498e2b;
}

.clicked {
  color: #ffffff;
  background-color: #498e2b;
}

.multi_action_button-icon {
  padding: 0.375rem 0.563rem;
  border: 0;
  background-color: transparent;
}

.multi_action_button-arrow {
  width: 0.625rem;
  height: 0.375rem;
}

.multi_action_button-dropdown {
  display: none;
  border: 0.063rem solid #cccccc;
  cursor: pointer;
  border-collapse: collapse;
}

.multi_action_button-option {
  width: min-content;
  min-width: 100%;
  padding: 0.25rem 0.563rem;
  border-top: 0.063rem solid #cccccc;
  font-size: 0.938rem;
  overflow-wrap: break-word;
}

.multi_action_button-option:hover {
  background-color: #dff0db;
}

.show-dropdown {
  display: block;
}

.hide-dropdown {
  display: none;
}