@import url('https://fonts.googleapis.com/css2?family=Public+Sans:ital,wght@0,100..900;1,100..900&display=swap');

body{
	background: linear-gradient(180deg, #02F 0%, #6579FF 100%);
	font-family: "Public Sans", sans-serif;
	height: 100vh;
	display: flex;
}

a{
	text-decoration: none;
}

.fs_8px{
	font-size: 8px !important;
}

.fs_10px{
	font-size: 10px !important;
}

.fs_12px{
	font-size: 12px !important;
}

.fs_14px{
	font-size: 14px !important;
}

.fs_16px{
	font-size: 16px !important;
}

.fs_18px{
	font-size: 18px !important;
}

.fs_20px{
	font-size: 20px !important;
}

.fs_22px{
	font-size: 22px !important;
}

.fs_24px{
	font-size: 24px !important;
}

.fs_26px{
	font-size: 26px !important;
}

.fs_28px{
	font-size: 28px !important;
}

.fs_32px{
	font-size: 32px !important;
} 

.fs_40px{
	font-size: 40px !important;
}

.fs_42px{
	font-size: 42px !important;
}

.fs_48px{
	font-size: 48px !important;
}

.fs_54px{
	font-size: 54px !important;
}

.fs_66px{
	font-size: 66px !important;
}

.fw_300{
	font-weight: 300;
}

.fw_400{
	font-weight: 400;
}

.fw_500{
	font-weight: 500;
}

.fw_600{
	font-weight: 600;
}

.fw_700{
	font-weight: 700;
}

.fw_800{
	font-weight: 800;
}

.lh_12px{
	line-height: 12px;
}

.lh_14px{
	line-height: 14px;
}

.lh_16px{
	line-height: 16px;
}

.lh_18px{
	line-height: 18px;
}

.lh_26px{
	line-height: 26px;
}

.lh_28px{
	line-height: 28px;
}

.lh_34px{
	line-height: 34px;
}

.lh_50px{
	line-height: 50px;
}

.lh_60px{
	line-height: 60px;
}

.text_primary
{
	color: #02F;
}

.text_black
{
	color: #1B1B25;
}

.text_white
{
	color: #fff;
}

.text_gray
{
	color: rgba(255, 255, 255, 0.60);
}

.text_paragraph
{
	color: #9B9DB3;
}

.text_success
{
	color: #34C759;
}

.text_danger
{
	color: #F24E51;
}

.text_pending
{
	color: #FFAE00;
}

.text_light_gray
{
	color: #EEEFF8;
}

.text_linear_black_blue
{
	background: linear-gradient(94deg, #00020D 4.63%, #02F 92.6%);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

.paragraph_link
{
	color: #9B9DB3;
}

.paragraph_link:hover, .paragraph_link:active, .paragraph_link:focus
{
	color: #02F;
}

.opacity_50
{
	opacity: 0.5;
}

.btn_primary
{
	border-radius: 10px;
	background: #02F;
	color: #FFF;
}

.btn_primary:focus, .btn_primary:hover, .btn_primary:active
{
	background: #2c48ff !important;
	color: #FFF !important;
}

.btn_white
{
	border-radius: 10px;
	background: #FFF;
	color: #02F;
}

.btn_white:focus, .btn_white:hover, .btn_white:active
{
	background: #e6f1ff !important;
	color: #02F !important;
}

.btn_gray
{
	border-radius: 10px;
	background: #9B9DB3;
	color: #FFF;
}

.btn_gray:focus, .btn_gray:hover, .btn_gray:active
{
	background: #abadc5 !important;
	color: #FFF !important;
}

.btn_light_gray
{
	border-radius: 10px;
	background: #EEEFF8;
	color: #9B9DB3;
}

.btn_light_gray:focus, .btn_light_gray:hover, .btn_light_gray:active
{
	background: #f0f1f3 !important;
	color: #9B9DB3 !important;
}

.btn_danger
{
	border-radius: 10px;
	background: #F24E51;
	color: #FFF;
}

.btn_danger:focus, .btn_danger:hover, .btn_danger:active
{
	background: #ed2428 !important;
	color: #FFF !important;
}

.btn_white_outline
{
	border: 1px solid rgba(255, 255, 255, 1);
}

.btn_white_outline:focus, .btn_white_outline:active, .btn_white_outline:hover
{
	border: 1px solid rgba(255, 255, 255, 0.8);
}

.btn_gray_outline
{
	border: 1px solid rgba(155, 157, 179, 0.5);
}

.btn_gray_outline:focus, .btn_gray_outline:active, .btn_gray_outline:hover
{
	border: 1px solid rgba(155, 157, 179, 0.8);
}

.btn_rounded
{
	border-radius: 50px;
}

.btn_circle
{
	border-radius: 100%;
}

.btn_glassy
{
	border-radius: 8px;
	border: 1px solid rgba(255, 255, 255, 0.28);
	background: rgba(255, 255, 255, 0.20);
	backdrop-filter: blur(3.45px);
}

.btn_gray_outline_group
{
	display: flex;
	align-items: center;
	border: 1px solid rgba(238, 239, 248, 0.30);
	border-radius: 36px;
	width: fit-content;
}

.btn_gray_outline_group .btn
{
	color: rgba(255, 255, 255, 0.5);
	border: 0px;
}

.btn_gray_outline_group .btn.active, .btn_gray_outline_group .btn:active, .btn_gray_outline_group .btn:hover, .btn_gray_outline_group .btn:focus
{
	border-radius: 36px;
	background: rgba(255, 255, 255, 0.08);
	color: #fff;
	border: 0px;
}

.btn_white_group
{
	display: flex;
	align-items: center;
	border: 1px solid #FFF;
	background: #FFF;
	border-radius: 36px;
	width: fit-content;
}

.btn_white_group .btn
{
	color: #9B9DB3;
	border: 0px;
	padding: 15px 15px;
}

.btn_white_group .btn.active, .btn_white_group .btn:active, .btn_white_group .btn:hover, .btn_white_group .btn:focus
{
	border-radius: 36px;
	background: #02F;
	color: #fff;
	border: 0px;
}

.btn_primary_group
{
	display: flex;
	align-items: center;
	border: 1px solid #EEEFF8;
	background: transparent;
	border-radius: 36px;
	width: fit-content;
}

.btn_primary_group .btn
{
	color: #9B9DB3;
	border: 0px;
}

.btn_primary_group .btn.active, .btn_primary_group .btn:active, .btn_primary_group .btn:hover, .btn_primary_group .btn:focus
{
	border-radius: 36px;
	background: rgba(0, 34, 255, 0.10);
	color: #02F;
	border: 0px;
}

.btn_payment_type
{
	border-radius: 28px;
	border: 1px solid #EEEFF8;
	display: flex;
	align-items: center;
}

.btn_payment_type:hover, .btn_payment_type:active, .btn_payment_type:focus
{
	border: 1px solid rgba(0, 34, 255, 0.50);
	background: linear-gradient(0deg, rgba(0, 34, 255, 0.08) 0%, rgba(0, 34, 255, 0.08) 100%), #F8F9FC;
}

.btn_payment_type .payment_icon
{
	width: 60px;
	margin-right: 5px;
}

.btn_payment_type .payment_type
{
	color: #9B9DB3;
}

.btn_payment_type.active
{
	border-radius: 28px;
	border: 1px solid rgba(0, 34, 255, 0.50);
	background: linear-gradient(0deg, rgba(0, 34, 255, 0.08) 0%, rgba(0, 34, 255, 0.08) 100%), #F8F9FC;
}

.btn_payment_type.active .payment_type
{
	color: #1B1B25;
}

.btn_payment_type.withdraw_btn
{
	width: 200px;
}

.btn_payment_type .withdraw_icon
{
	width: 40px;
	margin-right: 5px;
}

.btn_primary_outline
{
	border-radius: 28px;
	border: 1px solid #EEEFF8;
	display: flex;
	align-items: center;
	color: #9B9DB3;
}

.btn_primary_outline:hover, .btn_primary_outline:active, .btn_primary_outline:focus, .btn_primary_outline.active
{
	border: 1px solid rgba(0, 34, 255, 0.50);
	background: linear-gradient(0deg, rgba(0, 34, 255, 0.08) 0%, rgba(0, 34, 255, 0.08) 100%), #F8F9FC;
	color: #02F;
}

.btn_blue_outline
{
	border-radius: 12px;
	border: 1px solid #02F;
	display: flex;
	align-items: center;
	color: #02F;
}

.btn_blue_outline:hover, .btn_blue_outline:active, .btn_blue_outline:focus, .btn_blue_outline.active
{
	border: 1px solid #02F;
	background: linear-gradient(0deg, rgba(0, 34, 255, 0.08) 0%, rgba(0, 34, 255, 0.08) 100%), #F8F9FC;
	color: #02F;
}

.btn_danger_outline
{
	border-radius: 12px;
	border: 1px solid #F24E51;
	display: flex;
	align-items: center;
	color: #F24E51;
}

.btn_danger_outline:hover, .btn_danger_outline:active, .btn_danger_outline:focus, .btn_danger_outline.active
{
	border: 1px solid #F24E51;
	background: linear-gradient(0deg, rgba(255, 183, 184, 0.08) 0%, rgba(255, 183, 184, 0.08) 100%), rgba(255, 183, 184, 0.08);
	color: #F24E51;
}

.normal_div
{
	background: #fff;
	border-radius: 28px;
}

.rounded_div
{
	border-radius: 50px !important; 
}

.border_gray_div
{
	border: 1px solid #EEEFF8;
	border-radius: 12px;
}

.gray_bg
{
	background: #F8F9FC;
}

.dark_gray_bg
{
	background: #EEEFF8 !important;
}

.white_bg
{
	background: #FFF;
}

.border_radius_div
{
	border-radius: 12px;
}

.border_right
{
	border-right: 1px solid #EEEFF8;
}

.border_bottom
{
	border-bottom: 1px solid #EEEFF8;
}

.border_top
{
	border-top: 1px solid #EEEFF8;
}

.blue_pill
{
	border-radius: 36px;
	background: rgba(63, 109, 237, 0.14);
	color: #02F;
	width: fit-content;
}

.gray_pill
{
	border-radius: 36px;
	border: 1px solid #9B9DB3;
	background: #F8F9FC;
	color: #9B9DB3;
	width: fit-content;
}

.pending_pill
{
	border-radius: 101px;
	border: 0.6px solid rgba(255, 174, 0, 0.60);
	background: rgba(255, 174, 0, 0.10);
	color: #FFAE00;
	display: flex;
	align-items: center;
	width: fit-content;
	padding: 5px 10px;
}

.progress_pill
{
	border-radius: 101px;
	border: 0.6px solid rgba(0, 136, 255, 0.60);
	background: rgba(0, 136, 255, 0.10);
	color: #08F;
	display: flex;
	align-items: center;
	width: fit-content;
	padding: 5px 10px;
}

.success_pill
{
	border-radius: 101px;
	border: 0.6px solid rgba(52, 199, 89, 0.60);
	background: rgba(52, 199, 89, 0.10);
	color: #34C759;
	display: flex;
	align-items: center;
	width: fit-content;
	padding: 5px 10px;
}

.rejected_pill
{
	border-radius: 101px;
	border: 0.6px solid rgba(242, 78, 81, 0.60);
	background: rgba(242, 78, 81, 0.10);
	color: #F24E51;
	display: flex;
	align-items: center;
	width: fit-content;
	padding: 5px 10px;
}

.pending_box
{
	border-radius: 8px;
	background: rgba(255, 174, 0, 0.10);
	color: #FFAE00;
	display: flex;
	align-items: center;
	width: fit-content;
	padding: 5px 10px;
}

.progress_box
{
	border-radius: 8px;
	background: rgba(0, 136, 255, 0.10);
	color: #08F;
	display: flex;
	align-items: center;
	width: fit-content;
	padding: 5px 10px;
}

.success_box
{
	border-radius: 8px;
	background: rgba(52, 199, 89, 0.10);
	color: #34C759;
	display: flex;
	align-items: center;
	width: fit-content;
	padding: 5px 10px;
}

.rejected_box
{
	border-radius: 8px;
	background: rgba(242, 78, 81, 0.10);
	color: #F24E51;
	display: flex;
	align-items: center;
	width: fit-content;
	padding: 5px 10px;
}

.yellow_pill
{
	border-radius: 27px;
	background: rgba(255, 174, 0, 0.08);
	color: #FFAE00;
	width: fit-content;
}

.gray_pill
{
	border-radius: 27px;
	background: #EEEFF8;
	color: #9B9DB3;
	width: fit-content;
}

.success_badge
{
	border-radius: 8px;
	background: rgba(52, 199, 89, 0.10);
	color: #34C759;
}

.primary_badge
{
	border-radius: 4px;
	background: rgba(0, 34, 255, 0.10);
	color: #02F;
}

.h_stretch
{
	height: stretch;
}

.mh_0
{
	min-height: 0;
}

.w_stretch
{
	width: stretch;
}

.w_fit_content
{
	width: fit-content;
}

.submit_modal_div
{
	border: 4px solid #FFF;
	background: linear-gradient(180deg, rgba(0, 34, 255, 0.20) -6.62%, rgba(0, 34, 255, 0.00) 40.63%), #FFF;
	border-radius: 20px;
}

.danger_modal_div
{
	border: 4px solid #FFF;
	background: linear-gradient(180deg, rgba(255, 0, 0, 0.15) -6.62%, rgba(255, 0, 0, 0.00) 40.63%), #FFF;
	border-radius: 20px;
}

.gray_bg.invisible_input_div
{
	border: 1px solid #F8F9FC;
}

.invisible_input_div input
{
	background: transparent;
	border: 0px;
}

.invisible_input_div input:focus, .invisible_input_div input:active, .invisible_input_div input:hover
{
	box-shadow: none;
	background: transparent;
}

.invisible_input_div input:disabled, .invisible_input_div input:read-only
{
	color: #9B9DB3;
}

.invisible_input_div:focus-within{
    border-color: #02F;
}

.invisible_input_div select
{
	background-color: transparent;
	border: 0px;
}

.invisible_input_div select:focus, .invisible_input_div select:active, .invisible_input_div select:hover
{
	box-shadow: none;
	background-color: transparent;
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

textarea.gray_bg
{
	border: 1px solid #EEEFF8;
}

textarea::-webkit-input-placeholder.gray_bg
{
	color: #999CAC;
}

textarea:focus.gray_bg, textarea:focus-visible.gray_bg
{
	border-color: #cfcfd7;
	outline: none;
}

input::-webkit-input-placeholder
{
	color: #999CAC;
}

.datepicker.datepicker-dropdown {
  background: #fff;
  border-radius: 0.0625rem;
  border: 0.0625rem solid #EEEEEE; }
.datepicker.datepicker-dropdown td.day, .datepicker.datepicker-dropdown th.next, .datepicker.datepicker-dropdown th.prev {
    height: 1.875rem;
    width: 1.875rem !important;
    padding: 8px 10px;
    text-align: center;
    font-weight: 500;
    border-radius: 0.625rem; }
.datepicker.datepicker-dropdown td.day:hover, .datepicker.datepicker-dropdown th.next:hover, .datepicker.datepicker-dropdown th.prev:hover {
      box-shadow: unset;
      color: #2A353A;
      background-color: linear-gradient(132deg, #02F -4.87%, #6579FF 97.98%); 
}
.datepicker.datepicker-dropdown th.datepicker-switch, .datepicker.datepicker-dropdown th.next, .datepicker.datepicker-dropdown th.prev {
    font-weight: 600;
    color: #333; }
.datepicker.datepicker-dropdown th.dow {
    font-weight: 600; }

.datepicker table tr td.selected, .datepicker table tr td.active.active {
  background-color: linear-gradient(132deg, #02F -4.87%, #6579FF 97.98%);
  border-radius: 0.625rem;
  border: 0;
  color: #fff;
  background-image: none;
  position: relative; }

.datepicker table tr td.today {
  border-radius: 0.625rem;
  color: #fff; }
  .datepicker table tr td.today:hover {
    background-color: linear-gradient(132deg, #02F -4.87%, #6579FF 97.98%);
    box-shadow: 0rem 0rem 1.875rem 0.3125rem rgba(243, 30, 122, 0.3);
    color: #ffffff; }

.datepicker table tr td.today.disabled {
  box-shadow: 0rem 0rem 1.875rem 0.3125rem rgba(243, 30, 122, 0.3);
  color: #ffffff; }
  .datepicker table tr td.today.disabled:hover {
    box-shadow: 0rem 0rem 1.875rem 0.3125rem rgba(243, 30, 122, 0.3);
    color: #ffffff; }

.datepicker table thead tr:first-child th:hover {
  background: linear-gradient(132deg, #02F -4.87%, #6579FF 97.98%); }

.datepicker table thead tr th:hover {
  background: linear-gradient(132deg, #02F -4.87%, #6579FF 97.98%); }

.datepicker table td.day:hover {
  background: linear-gradient(132deg, #02F -4.87%, #6579FF 97.98%);
  border-radius: 0.625rem; }

input.input-daterange-datepicker
{
	background: transparent;
	border: 0px;
}

input:focus.input-daterange-datepicker, input:active.input-daterange-datepicker, input:hover.input-daterange-datepicker
{
	box-shadow: none;
	background: transparent;
}

.input-daterange-datepicker
{
	width: 100px;
}

select.form-select
{
	border: 0px;
}

select:focus.form-select, select:active.form-select, select:hover.form-select
{
	box-shadow: none;
	outline: none;
}
/* Sidebar */
.sidebar_div
{
	width: 20vw;
	padding: 3vh 0px 3vh 1vw;
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.sidebar_logo
{
	width: 170px;
}

.sidebar_list_div
{
	padding: 15px 15px;
	display: flex;
	margin-bottom: 5px;
}

.sidebar_below_div
{
	border-top: 1px solid rgba(255, 255, 255, 0.25);
}

.sidebar_icon
{
	width: 25px;
}

.sidebar_list_div.active
{
	border-radius: 12px;
	background: rgba(248, 249, 252, 0.12);
}

.sidebar_list_div:hover, .sidebar_list_div:active, .sidebar_list_div:focus
{
	border-radius: 12px;
	background: rgba(248, 249, 252, 0.12);
}
/* End of Sidebar */

/* Header */
.header_avatar
{
	width: 45px;
	border-radius: 100%;
	border: 1px solid #FFF;
}

.header_flag_icon
{
	width: 30px;
}

.header_dropdown_flag_icon
{
	width: 25px;
}

.header_language_btn
{
	height: 45px;
}

.header_language_btn.dropdown-toggle::after
{
	display: none;
}

.header_setting_btn.dropdown-toggle::after
{
	display: none;
}

.header_setting_icon
{
	width: 25px;
}

.header_setting_btn
{
	padding: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 45px;
	height: 45px;
}
/* End of Header */

/* Content */
.content
{
	border-radius: 40px;
	background: #EEEFF8;
	padding: 20px 20px;
	width: 100%;
	margin: 30px;	
  height: -webkit-fill-available;
  display: flex;
  justify-content: space-between;
  flex-direction: column;
}

.content > .row {
  flex: 1;
  min-height: 0; /* IMPORTANT: allows children to shrink */
}
/* End of Content */

/* Table */
.table_thead td:first-child
{
	border-top-left-radius: 12px;
	border-bottom-left-radius: 12px;
}

.table_thead td:last-child
{
	border-top-right-radius: 12px;
	border-bottom-right-radius: 12px;
}

.table_thead_td
{
	background: #F8F9FC;
}
/* End of Table */

/* Modal */
.modal_center_img
{
	width: 10vw;
	position: relative;
  margin-top: -5vh;
}
/* End of Modal */

@media (max-width: 980px) {
	/* Sidebar */
	.sidebar_div{
		display: none;
	}
	/* End of Sidebar */

	/* Content */
	.content
	{
		overflow-y: auto;
	}
	/* End of Content */
}

@media (max-width: 767px) {
	body{
		background: #EEEFF8;
	}

	.mobile_header_div
	{
		border-radius: 55px;
		background: #FFF;
	}

	.mobile_header_icon
	{
		width: 26px;
	}
}