master-components-react-ts 2.1.2 → 2.1.3

package/dist/assets/components/Checkbox/Checkbox.module-_XqqEodq.css

@@ -0,0 +1,82 @@
+@font-face {
+  font-family: "Inter-Regular";
+  src: url("/assets/Inter_24pt-Regular-C7SEt4-L.woff2") format("woff2"), url("../../assets/fonts/Inter_24pt-Regular.woff") format("woff");
+}
+@font-face {
+  font-family: "Inter-SemiBold";
+  src: url("/assets/Inter_24pt-SemiBold-DIQUEucn.woff2") format("woff2"), url("../../assets/fonts/Inter_24pt-SemiBold.woff") format("woff");
+}
+@font-face {
+  font-family: "Inter-Medium";
+  src: url("/assets/Inter_24pt-Medium-C1cYvkz2.woff2") format("woff2"), url("../../assets/fonts/Inter_24pt-Medium.woff") format("woff");
+}
+.Checkbox-module__checkboxWrapper {
+  overflow: hidden;
+  border: 2px solid #c1c2c7;
+  background: #ffffff;
+  position: relative;
+  padding: 5px 4px;
+  border-radius: 3px;
+  cursor: pointer;
+  transition: 0.2;
+  display: grid;
+  place-items: center;
+  width: 18px;
+  height: 18px;
+  user-select: none;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+}
+.Checkbox-module__checkboxWrapper .Checkbox-module__checkMark {
+  display: grid;
+  place-items: center;
+}
+.Checkbox-module__checkboxWrapper .Checkbox-module__checkMark svg {
+  width: 0.625rem;
+  user-select: none;
+  pointer-events: none;
+}
+.Checkbox-module__checkboxWrapper.Checkbox-module__error {
+  border-color: #e3292f;
+}
+.Checkbox-module__checkboxWrapper.Checkbox-module__error.Checkbox-module__checked {
+  background: #e3292f;
+  border: none;
+}
+.Checkbox-module__checkboxWrapper.Checkbox-module__checked {
+  background: #0058ff;
+  border: none;
+}
+.Checkbox-module__checkboxWrapper.Checkbox-module__checked.Checkbox-module__disabled {
+  background: #95969c;
+}
+.Checkbox-module__checkboxWrapper.Checkbox-module__disabled {
+  cursor: not-allowed;
+  border-color: #c1c2c7 !important;
+}
+
+.Checkbox-module__Namespace_Hr.Checkbox-module__checkboxWrapper.Checkbox-module__checked {
+  background: #32b45f;
+  border: 0.0625rem solid #32b45f;
+}
+.Checkbox-module__Namespace_Hr.Checkbox-module__checkboxWrapper.Checkbox-module__checked:hover {
+  background: #24994d;
+  border: 0.0625rem solid #24994d;
+}
+
+.Checkbox-module__dark {
+  background: #373a41;
+  border: unset;
+}
+.Checkbox-module__dark.Checkbox-module__checked {
+  background: #0158ff;
+  border: 0.0625rem solid #0158ff;
+}
+.Checkbox-module__dark.Checkbox-module__checked.Checkbox-module__disabled svg path {
+  stroke: #d5d7da;
+}
+.Checkbox-module__dark.Checkbox-module__disabled {
+  background: #8d8d8d !important;
+  border: 0.0625rem solid #373a41 !important;
+}

package/dist/assets/components/DatePicker/Calendar.module-D3fcZWFD.css

@@ -0,0 +1,316 @@
+@font-face {
+  font-family: "Inter-Regular";
+  src: url("/assets/Inter_24pt-Regular-C7SEt4-L.woff2") format("woff2"), url("../../assets/fonts/Inter_24pt-Regular.woff") format("woff");
+}
+@font-face {
+  font-family: "Inter-SemiBold";
+  src: url("/assets/Inter_24pt-SemiBold-DIQUEucn.woff2") format("woff2"), url("../../assets/fonts/Inter_24pt-SemiBold.woff") format("woff");
+}
+@font-face {
+  font-family: "Inter-Medium";
+  src: url("/assets/Inter_24pt-Medium-C1cYvkz2.woff2") format("woff2"), url("../../assets/fonts/Inter_24pt-Medium.woff") format("woff");
+}
+.Calendar-module__datePicker {
+  z-index: 150;
+  position: absolute;
+  left: 0;
+  top: calc(100% + 8px);
+  display: flex;
+  border-radius: 0.75rem;
+  border: 1px solid #e9eaeb;
+  background: #fff;
+  box-shadow: 0px 20px 24px -4px rgba(10, 13, 18, 0.08), 0px 8px 8px -4px rgba(10, 13, 18, 0.03), 0px 3px 3px -1.5px rgba(10, 13, 18, 0.04);
+  width: 279px;
+}
+.Calendar-module__datePicker.Calendar-module__dualCalendar, .Calendar-module__datePicker.Calendar-module__dualCalendarWithQuick {
+  padding: 1rem;
+}
+.Calendar-module__datePicker.Calendar-module__dualCalendar .Calendar-module__border, .Calendar-module__datePicker.Calendar-module__dualCalendarWithQuick .Calendar-module__border {
+  width: 0.0625rem;
+  background-color: #e9eaeb;
+  margin: 0 8px;
+}
+.Calendar-module__datePicker.Calendar-module__dualCalendar .Calendar-module__calendarWrapper, .Calendar-module__datePicker.Calendar-module__dualCalendarWithQuick .Calendar-module__calendarWrapper {
+  width: 100%;
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+}
+.Calendar-module__datePicker.Calendar-module__dualCalendar .Calendar-module__quickPick, .Calendar-module__datePicker.Calendar-module__dualCalendarWithQuick .Calendar-module__quickPick {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  gap: 0.25rem;
+  min-width: 160px;
+}
+.Calendar-module__datePicker.Calendar-module__dualCalendar .Calendar-module__quickPick li, .Calendar-module__datePicker.Calendar-module__dualCalendarWithQuick .Calendar-module__quickPick li {
+  width: 100%;
+  padding: 8px;
+  color: #414651;
+  font-family: "Inter-Regular", sans-serif;
+  font-size: 0.875rem;
+  font-style: normal;
+  font-weight: 500;
+  line-height: 1.25rem; /* 142.857% */
+  border-radius: 0.375rem;
+}
+.Calendar-module__datePicker.Calendar-module__dualCalendar .Calendar-module__quickPick li:hover, .Calendar-module__datePicker.Calendar-module__dualCalendarWithQuick .Calendar-module__quickPick li:hover {
+  background: #fafafa;
+  text-decoration: unset;
+}
+.Calendar-module__datePicker.Calendar-module__dualCalendar {
+  width: 656px;
+}
+.Calendar-module__datePicker.Calendar-module__dualCalendarWithQuick {
+  width: 848px;
+}
+.Calendar-module__datePicker .Calendar-module__datePickerHeader {
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  padding: 8px;
+}
+.Calendar-module__datePicker .Calendar-module__datePickerHeader span {
+  color: #414651;
+  text-align: center;
+  font-size: 1rem;
+  font-style: normal;
+  font-weight: 600;
+  line-height: 1.5rem; /* 150% */
+}
+.Calendar-module__datePicker .Calendar-module__div {
+  width: 100%;
+}
+.Calendar-module__datePicker .Calendar-module__div span {
+  font-family: "Inter-Regular", sans-serif;
+}
+.Calendar-module__datePicker .Calendar-module__currentDateHeader {
+  overflow: hidden;
+  color: #131314;
+  text-align: center;
+  font-feature-settings: "liga" off, "clig" off;
+  text-overflow: ellipsis;
+  /* UI/14 semi medium */
+  font-family: "Inter-Regular", sans-serif;
+  font-size: 14px;
+  font-style: normal;
+  font-weight: 450;
+  line-height: 24px; /* 171.429% */
+  letter-spacing: 0.1px;
+  padding: 6px 16px;
+  border-radius: 6px;
+  border: 1px solid #e6e6e6;
+  background: #fff;
+  cursor: pointer;
+}
+.Calendar-module__datePicker .Calendar-module__left,
+.Calendar-module__datePicker .Calendar-module__right {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  cursor: pointer;
+}
+.Calendar-module__datePicker .Calendar-module__left .Calendar-module__singleIcon,
+.Calendar-module__datePicker .Calendar-module__left .Calendar-module__doubleIcon,
+.Calendar-module__datePicker .Calendar-module__right .Calendar-module__singleIcon,
+.Calendar-module__datePicker .Calendar-module__right .Calendar-module__doubleIcon {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+.Calendar-module__datePicker .Calendar-module__left .Calendar-module__singleIcon:hover,
+.Calendar-module__datePicker .Calendar-module__left .Calendar-module__doubleIcon:hover,
+.Calendar-module__datePicker .Calendar-module__right .Calendar-module__singleIcon:hover,
+.Calendar-module__datePicker .Calendar-module__right .Calendar-module__doubleIcon:hover {
+  opacity: 0.6;
+}
+.Calendar-module__datePicker .Calendar-module__left .Calendar-module__doubleIcon svg:first-of-type,
+.Calendar-module__datePicker .Calendar-module__right .Calendar-module__doubleIcon svg:first-of-type {
+  margin-right: -15px;
+}
+.Calendar-module__datePicker .Calendar-module__left span,
+.Calendar-module__datePicker .Calendar-module__right span {
+  position: relative;
+}
+.Calendar-module__datePicker .Calendar-module__left span::after,
+.Calendar-module__datePicker .Calendar-module__right span::after {
+  position: absolute;
+  top: 4px;
+  inset-inline-start: 4px;
+  display: inline-block;
+  width: 7px;
+  height: 7px;
+  border: 0 solid currentcolor;
+  border-block-start-width: 1.5px;
+  border-block-end-width: 0;
+  border-inline-start-width: 1.5px;
+  border-inline-end-width: 0;
+  color: #a4a7ae;
+  content: "";
+}
+.Calendar-module__datePicker .Calendar-module__left span::before,
+.Calendar-module__datePicker .Calendar-module__right span::before {
+  position: absolute;
+  top: 0;
+  inset-inline-start: 0;
+  display: inline-block;
+  width: 7px;
+  height: 7px;
+  border: 0 solid currentcolor;
+  border-block-start-width: 1.5px;
+  border-block-end-width: 0;
+  border-inline-start-width: 1.5px;
+  border-inline-end-width: 0;
+  color: #a4a7ae;
+  content: "";
+}
+.Calendar-module__datePicker .Calendar-module__calendarWrapper {
+  padding: 0 8px;
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+}
+.Calendar-module__datePicker table {
+  border-collapse: collapse;
+  border-spacing: 0 0; /* vertical spacing */
+}
+.Calendar-module__datePicker table thead {
+  border-bottom: 2px solid #e6e6e6;
+}
+.Calendar-module__datePicker table thead tr th {
+  color: #7a7b80;
+}
+.Calendar-module__datePicker table tbody {
+  margin-top: 12px;
+}
+.Calendar-module__datePicker table .Calendar-module__spacerRow td {
+  height: 4px;
+  border: none;
+  padding: 0;
+}
+.Calendar-module__datePicker table th,
+.Calendar-module__datePicker table td:not(.Calendar-module__spacerRow td) {
+  text-align: center;
+  font-family: "Inter-Regular", sans-serif;
+  color: #131314;
+  font-family: "Inter-Regular", sans-serif;
+  font-size: 14px;
+  font-style: normal;
+  font-weight: 450;
+  line-height: 24px; /* 171.429% */
+  letter-spacing: 0.1px;
+  width: 36px;
+  height: 36px;
+  padding: 6px;
+  border-radius: 6px;
+  background: #fff;
+}
+.Calendar-module__datePicker table td.Calendar-module__day {
+  cursor: pointer;
+  border-radius: 6px;
+  font-size: 0.875rem;
+  line-height: 1.25rem;
+  box-sizing: border-box !important;
+}
+.Calendar-module__datePicker table td.Calendar-module__day:hover {
+  background: #fafafa;
+}
+.Calendar-module__datePicker table td.Calendar-module__day.Calendar-module__today {
+  position: relative;
+}
+.Calendar-module__datePicker table td.Calendar-module__day.Calendar-module__today::before {
+  content: "";
+  position: absolute;
+  bottom: 4px;
+  left: 50%;
+  transform: translate(-50%, 0);
+  background-color: #0158ff;
+  width: 5px;
+  height: 5px;
+  border-radius: 50%;
+  z-index: 1;
+}
+.Calendar-module__datePicker table td.Calendar-module__day.Calendar-module__inRange {
+  background: #f2f2f2;
+}
+.Calendar-module__datePicker table td.Calendar-module__day.Calendar-module__selected, .Calendar-module__datePicker table td.Calendar-module__day.Calendar-module__startDate, .Calendar-module__datePicker table td.Calendar-module__day.Calendar-module__endDate {
+  background-color: #0158ff;
+  color: #fff;
+  position: relative;
+}
+.Calendar-module__datePicker table td.Calendar-module__day.Calendar-module__disabled {
+  color: #a4a7ae;
+  pointer-events: none;
+  opacity: 0.4;
+}
+.Calendar-module__datePicker table td.Calendar-module__day.Calendar-module__endDate::before {
+  background-color: #fafafa;
+  width: 20px;
+  height: 40px;
+  position: absolute;
+  top: 0;
+  inset-inline-start: 0;
+  inset-inline-end: 0;
+  z-index: -1;
+  content: "";
+}
+.Calendar-module__datePicker table td.Calendar-module__day.Calendar-module__startDate::before {
+  background-color: #fafafa;
+  width: 20px;
+  height: 40px;
+  position: absolute;
+  top: 0;
+  right: 0;
+  z-index: -1;
+  content: "";
+}
+.Calendar-module__datePicker table td.Calendar-module__day.Calendar-module__endDate.Calendar-module__startDate::before {
+  content: none;
+}
+.Calendar-module__datePicker table td.Calendar-module__day.Calendar-module__otherMonth {
+  color: #95969c;
+  font-family: "Inter-Regular", sans-serif;
+  font-size: 14px;
+  font-style: normal;
+  font-weight: 450;
+  line-height: 24px; /* 171.429% */
+  letter-spacing: 0.1px;
+}
+.Calendar-module__datePicker table td.Calendar-module__day.Calendar-module__otherMonth.Calendar-module__startDate, .Calendar-module__datePicker table td.Calendar-module__day.Calendar-module__otherMonth.Calendar-module__endDate {
+  color: #fff;
+}
+.Calendar-module__datePicker ul.Calendar-module__monthsWrapper {
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+  height: 257px;
+  overflow: auto;
+}
+.Calendar-module__datePicker ul.Calendar-module__monthsWrapper li.Calendar-module__month {
+  width: 100%;
+  border-radius: 4px;
+  background: #fff;
+  padding: 6px 10px;
+  cursor: pointer;
+  color: #131314;
+  font-feature-settings: "liga" off, "clig" off;
+  text-overflow: ellipsis;
+  font-family: "Inter-Regular", sans-serif;
+  font-size: 14px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: 24px; /* 171.429% */
+  letter-spacing: 0.1px;
+}
+.Calendar-module__datePicker ul.Calendar-module__monthsWrapper li.Calendar-module__month.Calendar-module__pickedMonth {
+  background: #ECF3FF;
+  color: #0158ff;
+}
+.Calendar-module__datePicker .Calendar-module__buttonWrapper {
+  margin-top: 8px;
+  padding: 8px;
+  border-top: 1px solid #e6e6e6;
+}

package/dist/assets/components/DatePicker/Datepicker.module-BxWRyQpP.css

@@ -0,0 +1,39 @@
+@font-face {
+  font-family: "Inter-Regular";
+  src: url("/assets/Inter_24pt-Regular-C7SEt4-L.woff2") format("woff2"), url("../../assets/fonts/Inter_24pt-Regular.woff") format("woff");
+}
+@font-face {
+  font-family: "Inter-SemiBold";
+  src: url("/assets/Inter_24pt-SemiBold-DIQUEucn.woff2") format("woff2"), url("../../assets/fonts/Inter_24pt-SemiBold.woff") format("woff");
+}
+@font-face {
+  font-family: "Inter-Medium";
+  src: url("/assets/Inter_24pt-Medium-C1cYvkz2.woff2") format("woff2"), url("../../assets/fonts/Inter_24pt-Medium.woff") format("woff");
+}
+.Datepicker-module__datepickerContainer {
+  width: 100%;
+  user-select: none;
+  scroll-behavior: smooth;
+}
+.Datepicker-module__datepickerContainer::-webkit-scrollbar {
+  display: block !important;
+  width: 0;
+}
+.Datepicker-module__datepickerContainer::-webkit-scrollbar-thumb {
+  opacity: 0;
+}
+.Datepicker-module__datepickerContainer .Datepicker-module__datepickerInputWrapper {
+  width: 100%;
+  cursor: pointer;
+}
+.Datepicker-module__datepickerContainer .Datepicker-module__datepickerInputWrapper .Datepicker-module__datepickerLeftIcon {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.Datepicker-module__datepickerContainer .Datepicker-module__datepickerInputWrapper .Datepicker-module__datepickerRightIcon {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+}

package/dist/assets/components/Dropdown/Dropdown.module-DgjqziBo.css

@@ -0,0 +1,242 @@
+@font-face {
+  font-family: "Inter-Regular";
+  src: url("/assets/Inter_24pt-Regular-C7SEt4-L.woff2") format("woff2"), url("../../assets/fonts/Inter_24pt-Regular.woff") format("woff");
+}
+@font-face {
+  font-family: "Inter-SemiBold";
+  src: url("/assets/Inter_24pt-SemiBold-DIQUEucn.woff2") format("woff2"), url("../../assets/fonts/Inter_24pt-SemiBold.woff") format("woff");
+}
+@font-face {
+  font-family: "Inter-Medium";
+  src: url("/assets/Inter_24pt-Medium-C1cYvkz2.woff2") format("woff2"), url("../../assets/fonts/Inter_24pt-Medium.woff") format("woff");
+}
+.Dropdown-module__dropdownWrapper {
+  user-select: none;
+  width: 100%;
+}
+.Dropdown-module__dropdownWrapper .Dropdown-module__dropdownInputWrapper {
+  width: 100%;
+  cursor: pointer;
+}
+.Dropdown-module__dropdownWrapper .Dropdown-module__dropdownInputWrapper .Dropdown-module__dropdownInputSlot {
+  display: flex;
+  align-items: center;
+  gap: 2px;
+  border-right: 1px solid #e6e6e6;
+}
+.Dropdown-module__dropdownWrapper .Dropdown-module__dropdownInputWrapper .Dropdown-module__dropdownInputSlot p {
+  overflow: hidden;
+  color: #717680;
+  font-feature-settings: "liga" off, "clig" off;
+  text-overflow: ellipsis;
+  font-family: "Inter-Regular";
+  font-size: 16px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: 24px; /* 171.429% */
+  letter-spacing: 0.1px;
+}
+.Dropdown-module__dropdownWrapper .Dropdown-module__dropdownInputWrapper .Dropdown-module__dropdownInputSlot img {
+  width: 30px;
+  height: 30px;
+  object-fit: contain;
+}
+.Dropdown-module__dropdownWrapper .Dropdown-module__dropdownInputWrapper .Dropdown-module__dropdownInputSlot .Dropdown-module__dropdownRightIconArrow {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  transition: transform 0.2s ease-in-out;
+  width: 29px;
+  height: 24px;
+}
+.Dropdown-module__dropdownWrapper .Dropdown-module__dropdownInputWrapper .Dropdown-module__dropdownInputSlot .Dropdown-module__dropdownRightIconArrow.Dropdown-module__focused {
+  transform: rotate(180deg);
+}
+.Dropdown-module__dropdownWrapper .Dropdown-module__dropdownInputWrapper ul.Dropdown-module__dropdownInputSlot {
+  overflow: hidden;
+  width: 100%;
+  display: flex;
+  align-items: center;
+  gap: 6px;
+}
+.Dropdown-module__dropdownWrapper .Dropdown-module__dropdownInputWrapper ul.Dropdown-module__dropdownInputSlot li.Dropdown-module__dropdownInputSlotItem {
+  border-radius: 999px;
+  background: #f2f2f2;
+  min-width: 80px;
+  max-width: 100px;
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  padding: 6px 12px;
+  cursor: default;
+}
+.Dropdown-module__dropdownWrapper .Dropdown-module__dropdownInputWrapper ul.Dropdown-module__dropdownInputSlot li.Dropdown-module__dropdownInputSlotItem .Dropdown-module__dropdownInputSlotItemLabel {
+  width: 100%;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  color: #131314;
+  font-family: "Inter-Regular";
+  font-size: 12px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: 16px; /* 133.333% */
+  letter-spacing: 0.1px;
+}
+.Dropdown-module__dropdownWrapper .Dropdown-module__dropdownInputWrapper ul.Dropdown-module__dropdownInputSlot li.Dropdown-module__dropdownInputSlotItem .Dropdown-module__dropdownInputSlotItemClose {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  cursor: pointer;
+}
+.Dropdown-module__dropdownWrapper .Dropdown-module__dropdownInputWrapper ul.Dropdown-module__dropdownInputSlot li.Dropdown-module__dropdownInputSlotItem.Dropdown-module__dropdownInputSlotItemMore {
+  justify-content: center;
+  min-width: 44px;
+}
+.Dropdown-module__dropdownWrapper .Dropdown-module__dropdownInputWrapper .Dropdown-module__dropdownRightIcon {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  margin: 8px;
+}
+.Dropdown-module__dropdownWrapper .Dropdown-module__dropdownInputWrapper .Dropdown-module__dropdownRightIcon .Dropdown-module__dropdownRightIconClose {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+}
+.Dropdown-module__dropdownWrapper .Dropdown-module__dropdownInputWrapper .Dropdown-module__dropdownRightIcon .Dropdown-module__dropdownRightIconArrow {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  transition: transform 0.2s ease-in-out;
+}
+.Dropdown-module__dropdownWrapper .Dropdown-module__dropdownInputWrapper .Dropdown-module__dropdownRightIcon.Dropdown-module__focused .Dropdown-module__dropdownRightIconArrow {
+  transform: rotate(180deg);
+}
+.Dropdown-module__dropdownWrapper .Dropdown-module__dropdownListContainer {
+  width: 100%;
+  padding: 8px;
+  border-radius: 12px;
+  border: 1px solid #e6e6e6;
+  background: #fff;
+  box-shadow: 0px 2px 4px 0px rgba(19, 19, 20, 0.04);
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+.Dropdown-module__dropdownWrapper .Dropdown-module__dropdownListContainer ul.Dropdown-module__dropdownList {
+  width: 100%;
+  max-height: 320px;
+  overflow-y: auto;
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  gap: 2px;
+  align-self: stretch;
+}
+.Dropdown-module__dropdownWrapper .Dropdown-module__dropdownListContainer ul.Dropdown-module__dropdownList li.Dropdown-module__dropdownItem {
+  width: 100%;
+  border-radius: 4px;
+  background: #fff;
+  display: flex;
+  padding: 6px 16px 6px 6px;
+  align-items: center;
+  gap: 8px;
+}
+.Dropdown-module__dropdownWrapper .Dropdown-module__dropdownListContainer ul.Dropdown-module__dropdownList li.Dropdown-module__dropdownItem.Dropdown-module__selected {
+  width: 100%;
+  border-radius: 4px;
+  background: #ecf3ff;
+}
+.Dropdown-module__dropdownWrapper .Dropdown-module__dropdownListContainer ul.Dropdown-module__dropdownList li.Dropdown-module__dropdownItem.Dropdown-module__selected .Dropdown-module__dropdownItemLabel {
+  width: 100%;
+}
+.Dropdown-module__dropdownWrapper .Dropdown-module__dropdownListContainer ul.Dropdown-module__dropdownList li.Dropdown-module__dropdownItem.Dropdown-module__selected .Dropdown-module__dropdownItemLabel p {
+  width: 100%;
+  overflow: hidden;
+  color: #0058ff !important;
+  text-overflow: ellipsis;
+  font-family: "Inter-Regular";
+  font-size: 14px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: 24px; /* 171.429% */
+  letter-spacing: 0.1px;
+}
+.Dropdown-module__dropdownWrapper .Dropdown-module__dropdownListContainer ul.Dropdown-module__dropdownList li.Dropdown-module__dropdownItem.Dropdown-module__hovered {
+  cursor: pointer;
+}
+.Dropdown-module__dropdownWrapper .Dropdown-module__dropdownListContainer ul.Dropdown-module__dropdownList li.Dropdown-module__dropdownItem.Dropdown-module__hovered:hover {
+  background: #f2f2f2;
+}
+.Dropdown-module__dropdownWrapper .Dropdown-module__dropdownListContainer ul.Dropdown-module__dropdownList li.Dropdown-module__dropdownItem.Dropdown-module__disabled p:first-of-type {
+  color: #95969c !important;
+}
+.Dropdown-module__dropdownWrapper .Dropdown-module__dropdownListContainer ul.Dropdown-module__dropdownList li.Dropdown-module__dropdownItem .Dropdown-module__itemCheckbox {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+.Dropdown-module__dropdownWrapper .Dropdown-module__dropdownListContainer ul.Dropdown-module__dropdownList li.Dropdown-module__dropdownItem .Dropdown-module__dropdownItemLabel {
+  width: calc(100% - 20px);
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+.Dropdown-module__dropdownWrapper .Dropdown-module__dropdownListContainer ul.Dropdown-module__dropdownList li.Dropdown-module__dropdownItem .Dropdown-module__dropdownItemLabel .Dropdown-module__dropdownItemLabelInput {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+.Dropdown-module__dropdownWrapper .Dropdown-module__dropdownListContainer ul.Dropdown-module__dropdownList li.Dropdown-module__dropdownItem .Dropdown-module__dropdownItemLabel .Dropdown-module__dropdownItemLabelInput .Dropdown-module__countryName {
+  overflow: hidden;
+  color: #131314;
+  font-feature-settings: "liga" off, "clig" off;
+  text-overflow: ellipsis;
+  font-family: "Inter-Regular";
+  font-size: 14px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: 24px; /* 171.429% */
+  letter-spacing: 0.1px;
+}
+.Dropdown-module__dropdownWrapper .Dropdown-module__dropdownListContainer ul.Dropdown-module__dropdownList li.Dropdown-module__dropdownItem .Dropdown-module__dropdownItemLabel .Dropdown-module__dropdownItemLabelInput .Dropdown-module__countryDialCode {
+  overflow: hidden;
+  color: #646569;
+  font-feature-settings: "liga" off, "clig" off;
+  text-overflow: ellipsis;
+  font-family: "Inter-Regular";
+  font-size: 14px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: 24px; /* 171.429% */
+  letter-spacing: 0.1px;
+}
+.Dropdown-module__dropdownWrapper .Dropdown-module__dropdownListContainer ul.Dropdown-module__dropdownList li.Dropdown-module__dropdownItem .Dropdown-module__dropdownItemLabel p:first-of-type:not(.Dropdown-module__selectAll) {
+  width: 100%;
+}
+.Dropdown-module__dropdownWrapper .Dropdown-module__dropdownListContainer ul.Dropdown-module__dropdownList li.Dropdown-module__dropdownItem .Dropdown-module__dropdownItemLabel p:first-of-type {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  color: #131314;
+  font-family: "Inter-Regular";
+  font-size: 14px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: 24px; /* 171.429% */
+  letter-spacing: 0.1px;
+}
+.Dropdown-module__dropdownWrapper .Dropdown-module__dropdownListContainer ul.Dropdown-module__dropdownList li.Dropdown-module__dropdownItem .Dropdown-module__dropdownItemLabel p:last-of-type {
+  overflow: hidden;
+  color: #131314;
+  font-family: "Inter-Regular";
+  font-size: 14px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: 24px; /* 171.429% */
+  letter-spacing: 0.1px;
+}