input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

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

.input_small {
	padding-inline: 7px !important;
	/*min-height:30px;*/
	max-height: 20px;
	padding-block: 3px !important;
}

.hidden {
	display: none;
}

.show {
	display: unset;
}


/*	scrollbar */
::-webkit-scrollbar {
	width: 5px !important;
}

::-webkit-scrollbar-thumb {
	background-color: #CCD6ED !important;
	border-radius: 0px 0px 30px 30px !important;
}

::-webkit-scrollbar-track {
	background-color: #ECECEC !important;
}


/*	headline utilities	*/
.single-line-text-ellipsis {
	white-space: nowrap; /* Ensures the text stays on one line */
	overflow: hidden; /* Prevents text from spilling out */
	text-overflow: ellipsis; /* Adds the ellipsis for overflow text */
	max-width: 100%;
}

.underline {
	text-decoration: underline;
}

.text-link {
	cursor: pointer;
}

.text_underline_spaced {
	display: inline;
	background-image: linear-gradient(to bottom, currentColor 100%, transparent 0);
	background-repeat: no-repeat;
	background-position: 0 100%; /* Position the line at the bottom of the text */
	background-size: 100% 2px; /* Width and thickness of the line */
	padding-bottom: 4px;
}

.scroll {
	overflow-y: auto !important;
	scrollbar-width: thin !important;
	scrollbar-color: #CCD6ED #ECECEC !important;
}

:root {
	/*
        Blue

    */
	--blue: rgba(0, 148, 255, 1);
	--blue_intense: rgba(207, 221, 255, 1);
	--blue_light: rgba(0, 148, 255, 0.1);
	--blue_main: rgba(6, 1, 255, 1);
	--blue_softer: rgba(0, 148, 255, 0.23);
	--blue_pastel:rgba(142, 168, 233, 1);
	--blue_pastel_softer: rgba(142, 168, 233, 0.6);
	--blue_pastel_dark:#497bf7;
	/*
        Baby blue

    */
	--baby_blue: rgba(232, 236, 246, 1);
	--baby_blue_light: rgba(241, 244, 250, 1);
	/*
        Green

    */
	--green: rgba(15, 141, 88, 1);
	--green_light: rgba(15, 141, 88, 0.1);
	--full_green: rgba(0, 89, 51, 1);
	--green_softer: rgba(15, 141, 88, 0.23);
	/*
        Dark Green
    */
	--dark_green: rgba(27, 97, 109, 1);
	--dark_green_light: rgba(27, 97, 109, 0.15);
	/*
        Black

    */
	--black_main: rgba(0, 0, 0, 1);
	--black: rgba(47, 47, 47, 1);
	--black_light: rgba(180, 195, 226, 0.31);
	--Eerie_black: rgba(38, 38, 38, 1);
	/*
        Red

    */
	--red: rgba(233, 0, 0, 1);
	--red_light: rgba(245, 232, 230, 1);
	--red_softer: rgba(233, 0, 0, 0.23);
	--red_tile: rgba(109, 27, 27, 1);

	/*
        White

    */
	--white: rgba(255, 255, 255, 1);
	--white_light: rgba(255, 255, 255, 0.4);
	/*
        Grey

    */
	--grey_full_dark: rgba(118, 132, 161, 1);
	--grey_dark: rgba(166, 166, 166, 1);
	--grey: rgba(239, 239, 239, 1);
	--grey_medium: rgba(207, 207, 207, 1);
	--grey_d_popup: rgba(133, 133, 133, 1);
	--grey_light: rgba(245, 245, 245, 1);
	/*
        Yellow

    */
	--yellow: rgba(221, 163, 1, 1);
	--chocolate_light: rgba(197, 67, 6, 0.1);
	--chocolate_full_light: rgba(255, 210, 164, 0.2);

	/*
        Purple
    */
	--purple: rgba(164, 1, 241, 1);
	--purple_softer: rgba(164, 1, 241, 0.23);
	/*
        Orange
    */
	--orange: rgba(241, 124, 1, 1);
	--orange_light: rgba(241, 124, 1, 0.10);
	--orange_soft: rgba(255, 210, 164, 0.19);
	--orange_softer: rgba(255, 210, 164, 0.23);
	--orange_red: rgba(251, 109, 6, 1);

	/*
        Gold
    */
	--gold: #D0BA7C;
	/*
		Pink
	*/
	--pink_main: rgba(216, 9, 234, 1);
}

.hover_icons {
	box-shadow: 0px 0px 9px 0px rgba(0, 0, 0, 0.20);
}

:root {
	--letter-spacing: 0.5px;
}


/*	weight	*/
.light {
	font-weight: 300 !important;
}

.medium {
	font-weight: 500 !important;
}

.semiBold {
	font-weight: 600 !important;
}

.bold {
	font-weight: 700 !important;
}

.underline {
	text-decoration: underline;
}

.text-link {
	cursor: pointer !important;
}

.text_underline_spaced {
	display: inline;
	background-image: linear-gradient(to bottom, currentColor 100%, transparent 0);
	background-repeat: no-repeat;
	background-position: 0 100%; /* Position the line at the bottom of the text */
	background-size: 100% 2px; /* Width and thickness of the line */
	padding-bottom: 4px;
}

.block_large {
	height: 45px;
}


.start_value_large > *:first-child {
	padding-left: 20px;
}

.start_value_large > *:last-child {
	padding-right: 10px;
}


@media only screen and (max-width: 1750px) {
	.block_large {
		height: 40px;
	}
}

.copy_icon_large {
	width: 30px;
	margin-left: 0.4rem;
	border-radius: 6px;
}

.rightIcon_large {
	flex: 0.5;
}

@media only screen and (min-width: 1025px) and (max-width: 1800px) {
	.rightIcon_large {
		flex: 0.5;
	}
}

@media only screen and (max-width: 1024px) and (orientation: portrait) {
	.rightIcon_large {
		flex: 0.5;
	}
}

/******* Medium ***********/
.block_medium {
	height: 30px;
}


.start_value_medium > *:first-child {
	padding-left: 10px;
}

.start_value_medium > *:last-child {
	padding-right: 10px;
}

.copy_icon_medium {
	width: 25px;
	margin-left: 0.3rem;
	border-radius: 6px;
}

.rightIcon_medium {
	flex: 0.4;
	display: flex;
}

@media only screen and (min-width: 1025px) and (max-width: 1800px) {
}

.block_small {
	height: 25px;
	border-radius: 2px !important;
}

.start_value_small > *:first-child {
	padding-left: 8px;
}

.start_value_small > *:last-child {
	padding-right: 8px;
}

.copy_icon_small {
	width: 20px;
	margin-left: 0.3rem;
	border-radius: 2px;
}

.rightIcon_small {
}


@media only screen and (max-width: 1024px) and (orientation: portrait) {
	.block_small {
		height: 40px !important;
	}

	.block_small input,
	.block_small label {
		font-size: clamp(12px, 14px, 18px) !important;
	}
}

@media only screen and (min-width: 1025px) and (max-width: 1800px) {
	.rightIcon_small {
		flex: 0.7;
	}

	.block_small {
		height: 20px !important;
	}
}

@media only screen and (max-width: 1024px) and (orientation: portrait){
	.copy_icon {
		width: 30px;
	}

	.block_small input,
	.block_small label {
		font-weight: 400 !important;
	}
}


@media only screen  and (max-width: 1024px) and (min-width: 641px) and (orientation: portrait) {

	.block_small {
		height: 40px !important;
	}
}




.input_block {
	display: flex;
	flex-direction: column;
	width: 100%;
}

.inp_BlockInfo {
	display: flex;
	width: 100%;
	flex-direction: row;
	align-items: center;
	gap: 10px;
	border-radius: 3px;
	background-color: var(--white);
	box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.25);
	cursor: text;
	border: 1px solid var(--white);
	position: relative;
}

.inp_BlockInfo .leftIcon {
	padding-left: 16px;
}

.inp_BlockInfo:is(:hover) {
	border: 1px solid var(--black_light);
}

.inp_BlockInfo:focus-within {
	border: 1px solid var(--black_light);
}

.inp_BlockInfo_read_only, .inp_BlockInfo_read_only input {
	cursor: default;
}


.inp_BlockInfo_disabled * {
	cursor: not-allowed;
}

.inp_BlockInfo_disabled {
	cursor: not-allowed;
	background-color: var(--grey_light);
}

.inp_error {
	color: var(--red) !important;
}

.error {
	border: 1.5px solid var(--red) !important;
}

.input {
	border: 0;
	outline-width: 0;
	outline: none;
	width: 100%;
	background-color: transparent;
	cursor: text;
}

.input::-webkit-outer-spin-button,
.input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.input::placeholder {
	color: var(--grey_medium);
}

.input-medium::placeholder {
	font-size: 0.75rem;
	font-weight: 500;
}

.error_block {
	display: flex;
}

.label_small {
	color: var(--grey_dark);
}


.icon {
	display: flex;
}

.input_leftIcon, .input_rightIcon {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0.5;
}

.input_rightIcon {
	gap: 5px;
}

.input_text_align_end {
	text-align: end;
}

.copied_message_box {
	position: absolute;
	padding-inline: 0.5rem;
	padding-block: 0.2rem;
	border-radius: 0.5rem;
	width: 7rem;
	top: -2rem;
	right: 0;
	z-index: 1;
	background-color: var(--grey);
	display: none;
	white-space: nowrap;
}

.fade_copied_message {
	opacity: 1;
	transition: opacity 2s ease;
}

.input_block_with_copy {
	display: flex;
}


.rightIcon {
	display: flex;
	align-items: center;
	justify-content: center;
}

.copy_icon {
	display: flex;
	justify-content: center;
	padding-inline: 0.1rem;
	background-color: var(--grey_light);
	cursor: pointer;
	height: 100%;
	align-items: center;
	position: relative;
	padding-right: 0 !important;
}

.copy_icon_large {
	width: 30px;
}

.copy_icon_medium {
	width: 25px;
}


.copy_icon_small {
	width: 18px;
}

@media only screen and (max-width: 1024px) and (orientation: portrait) {
	.copy_icon {
		align-items: center !important;
	}

	.copy_icon_small {
		width: 21px !important;
	}
}





:root {
	--zIndex-clipboard: 10000; /* 4 zeros */
}
