.tooltip-container {
	position: relative;
	cursor: pointer;
	background: #ffffff;
}

.tooltip-container.product {
	border-radius: 20px;
	font-size: 14px;
	color: #4a4aff;
}

.tooltip-content {
	display: flex;
	gap: 10px;
}

.tooltip-text {
	visibility: hidden;
	width: 385px;
	background: white;
	color: black;
	text-align: left;
	padding: 12px;
	border-radius: 10px;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
	position: absolute;
	bottom: 150%;
	left: 50%;
	transform: translateX(-50%);
	opacity: 0;
	transition: opacity 0.3s;
	border: 1px solid #ddd;
	z-index: 1000;
	display: flex;
	font-size: 13px;
	font-weight: normal;
}

.tooltip-container:not(.no-hover):hover .tooltip-text {
    visibility: visible;
    opacity: 1;
}


.tooltip-text::after {
	content: "";
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translateX(-50%);
	border-width: 10px;
	border-style: solid;
	border-color: white transparent transparent transparent;
}

/*  */

.custom-label {
	margin-top: 40px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	position: relative;
	display: block;
}

.custom-label:has(input.disabled) {
	pointer-events: none;
}

.custom-placeholder {
	padding-left: 15px;
	text-align: left;
	line-height: 46px;
	pointer-events: none;
	position: absolute;
	left: 0px;
	top: 0px;
	transition-property: all;
	transition-duration: 0.3s;
	transition-delay: 0s;
	transition-behavior: normal;
	transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
	opacity: 0.5;
}

input:focus + .custom-placeholder,
input:not(:placeholder-shown) + .custom-placeholder,
textarea:focus + .custom-placeholder,
textarea:not(:placeholder-shown) + .custom-placeholder {
	opacity: 1;
	transform: scale(0.75) translateY(-100%) translateX(-17%);
	color: rgb(12, 9, 201);
	width: 100%;
}

.custom-label:has(.custom-select):has(input:not([value=""]))
	.custom-placeholder,
.custom-label:has(.custom-select):has(input:not([value])) .custom-placeholder,
.custom-label:has(.custom-select):has(textarea:not([value=""]))
	.custom-placeholder,
.custom-label:has(.custom-select):has(textarea:not([value])) .custom-placeholder {
	opacity: 1;
	transform: scale(0.75) translateY(-100%) translateX(-17%);
	color: rgb(12, 9, 201);
	width: 100%;
}

.input-block:has(.custom-label) {
	margin-bottom: 0px;
}

input[type="button"] {
  outline: none;
}


input.highlight:not(:placeholder-shown),
textarea.highlight:not(:placeholder-shown) {
	outline-color: currentcolor;
	outline-style: none;
	outline-width: 0px;
	border-top-color: rgb(12, 9, 201);
	border-left-color: rgb(12, 9, 201);
	border-right-color: rgb(12, 9, 201);
	border-bottom-color: rgb(12, 9, 201);
}

input:hover + .custom-placeholder,
textarea:hover + .custom-placeholder {
	opacity: 1;
	color: rgb(12, 9, 201);
}

input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
textarea {
	height: 48px;
}

textarea.form-input {
	height: 130px;
}

/*  */

textarea:hover,
input[type="text"]:hover,
input[type="email"]:hover,
input[type="password"]:hover,
input[type="number"]:hover {
	border-top-color: rgb(12, 9, 201, 0.5);
	border-right-color: rgb(12, 9, 201, 0.5);
	border-bottom-color: rgb(12, 9, 201, 0.5);
	border-left-color: rgb(12, 9, 201, 0.5);
	outline-color: currentcolor;
	outline-style: none;
	outline-width: 0px;
}

textarea:focus,
input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="number"]:focus {
	border-top-color: rgb(12, 9, 201);
	border-right-color: rgb(12, 9, 201);
	border-bottom-color: rgb(12, 9, 201);
	border-left-color: rgb(12, 9, 201);
	outline-color: currentcolor;
	outline-style: none;
	outline-width: 0px;
	box-shadow: rgba(12, 9, 201, 0.42) 0px 0px 3px;
}

textarea.error:hover,
input.error:hover {
	border-color: #ff4744 !important;
}

textarea.error:focus,
input.error:focus {
	border-top-color: #ff4744 !important;
	border-right-color: #ff4744 !important;
	border-bottom-color: #ff4744 !important;
	border-left-color: #ff4744 !important;
	box-shadow: #ff474467 0px 0px 3px !important;
}

.form-input.error {
	border-color: #ff4744 !important;
	color: #ff4744 !important;
	background: rgb(255 12 8 / 12%) !important;
}

.form-input.error::placeholder {
	color: #ff4744 !important;
}

.form-input.disabled {
	background-color: rgba(197, 197, 197, 0.57);
	filter: grayscale(100%);
	pointer-events: none;
}

/* Custom select */

.custom-select {
	position: relative;
	width: 100%;
}

.select-selected {
	background-color: #ffffff;
	padding: 5px 10px;
	cursor: pointer;
	display: flex;
	align-items: center;
}

.select-selected:hover {
	border-top-color: rgb(12, 9, 201, 0.5);
	border-right-color: rgb(12, 9, 201, 0.5);
	border-bottom-color: rgb(12, 9, 201, 0.5);
	border-left-color: rgb(12, 9, 201, 0.5);
	color: rgb(12, 9, 201);
	outline-color: currentcolor;
	outline-style: none;
	outline-width: 0px;
}

.select-selected.active {
	border-top-color: rgb(12, 9, 201);
	border-right-color: rgb(12, 9, 201);
	border-bottom-color: rgb(12, 9, 201);
	border-left-color: rgb(12, 9, 201);
	color: rgb(12, 9, 201);
	outline-color: currentcolor;
	outline-style: none;
	outline-width: 0px;
	border-width: 1px;
	box-shadow: rgba(12, 9, 201, 0.42) 0px 0px 3px;
}

.custom-select-btn {
	margin-left: auto;
	margin-right: 10px;
	transform: rotateZ(0deg);
	transition-duration: 0.2s;
}

.select-selected:hover .custom-select-btn * {
	fill: rgb(12, 9, 201);
}

.select-selected.active .custom-select-btn * {
	fill: rgb(12, 9, 201);
}

.select-selected.active .custom-select-btn {
	transform: rotateZ(180deg);
	transition-duration: 0.2s;
}

/* Style the dropdown items */
.select-items {
	position: absolute;
	display: none;
	background-color: white;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
	border-radius: 4px;
	z-index: 1;
	width: 90%;
	max-height: 300px;
  	overflow-y: auto;
}

/* Style the dropdown items */
.select-items > div {
	padding: 10px;
	cursor: pointer;
	display: flex;
	text-align: left;
}

/* Style the dropdown items on hover */
.select-items > div:hover {
	background-color: #f7f7f7;
}

.select-item.hidden {
	display: none;
}

.select-item.disabled {
  color: #939393;
  cursor: not-allowed;
  pointer-events: none;
  background-color: #f0f0f0;
}


/* --------------------------------------------------- */

.beneficiariry-position {
	display: flex;
	row-gap: 3px;
	font-size: 10px;
	column-gap: 3px;
	align-items: center;
	padding-left: 10px;
	padding-right: 10px;
	padding-bottom: 2px;
	padding-top: 2px;
	border-top-color: currentcolor;
	border-top-style: none;
	border-top-width: medium;
	border-left-color: currentcolor;
	border-left-style: none;
	border-left-width: medium;
	border-image-slice: 100%;
	border-image-width: 1;
	border-right-color: currentcolor;
	border-right-style: none;
	border-right-width: medium;
	border-bottom-color: currentcolor;
	border-bottom-style: none;
	border-bottom-width: medium;
	border-image-outset: 0;
	border-image-repeat: stretch;
	border-image-source: none;
	text-decoration-line: none;
	text-decoration-color: currentcolor;
	text-decoration-style: solid;
	text-decoration-thickness: auto;
	font-weight: bold;
	border-radius: 7px;
	margin-left: 6px;
}

.beneficiariry-position.blue {
	color: rgb(12, 9, 201);
	background-color: rgb(231, 231, 246);
}

.beneficiariry-position.gray {
	color: rgba(70, 70, 70, 1);
	background-color: rgba(243, 243, 243, 1);
}

.beneficiariry-position.green {
	color: rgba(13, 110, 75, 1);
	background-color: rgba(216, 255, 240, 1);
}

.select-item-beneficiary{
	font-size: 14px;
	align-items: center;
	white-space: nowrap;
}

.positions-select-block{
	display: flex;
  	white-space: nowrap;
  	flex-wrap: wrap;
 	row-gap: 4px;
}

.beneficiary-select-name{
	white-space: nowrap;
}

/* Mobile number input styles  */

input:focus + .custom-placeholder.country-code{
  left:-85px !important;
}
input:not(:placeholder-shown) + .custom-placeholder.country-code{
  left:-85px !important;
}
.country-select-box{
  text-align:center;
  font-weight:700;
  border-top-color:rgba(12, 9, 201, 0.5);
  border-top-width:1px;
  border-left-color:rgba(12, 9, 201, 0.5);
  border-left-width:1px;
  border-right-color:rgba(12, 9, 201, 0.5);
  border-right-width:1px;
  border-bottom-color:rgba(12, 9, 201, 0.5);
  border-bottom-width:1px;
  border-top-right-radius:0px !important;
  border-bottom-right-radius:0px !important;
}
.country-select-box > div{
  width:100% !important;
}
.mobile-input-label > .form-input{
  border-top-left-radius:0px;
  border-bottom-left-radius:0px;
}
.mobile-custom-select-wrapper{
  width:100px;
  outline-color:currentcolor;
  outline-style:none;
  outline-width:0px;
  border-top-color:rgb(12, 9, 201);
  border-left-color:rgb(12, 9, 201);
  border-right-color:rgb(12, 9, 201);
  border-bottom-color:rgb(12, 9, 201);
}
.select-items{
  width:100%;
}
.mobile-number-block{
  display:flex;
  align-items:center;
}
.mobile-input-label{
  width:100%;
}
.country-select-box{
  height:48px;
  padding:0px !important
}

/* ---------------------------------------------- */

.spinner {
    border: 2px solid #f3f3f3;
    border-top: 2px solid #3498db;
    border-radius: 50%;
    width: 18px;
    height: 18px;
    animation: spin 0.8s linear infinite;
    display: inline-block;
    vertical-align: middle;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

@media (max-width: 992px) {
	.tooltip-text {
		visibility: hidden;
		width: 260px;
	}
}

/* ---------------------------------------------- */


.spinner_bars {
    width: 24px;
   height: 24px;
   display: grid;
   border-radius: 50%;
   -webkit-mask: radial-gradient(farthest-side,#0000 40%,#ffffff 41%);
   background: linear-gradient(0deg ,rgba(255,255,255,0.5) 50%,rgba(255,255,255,1) 0) center/1.9px 100%,
        linear-gradient(90deg,rgba(255,255,255,0.25) 50%,rgba(255,255,255,0.75) 0) center/100% 1.9px;
   background-repeat: no-repeat;
   animation: spinner_bars-d3o0rx 1s infinite steps(12);
   margin-left: auto;
   margin-right: auto;
}

.spinner_bars::before,
.spinner_bars::after {
   content: "";
   grid-area: 1/1;
   border-radius: 50%;
   background: inherit;
   opacity: 0.915;
   transform: rotate(30deg);
}

.spinner_bars::after {
   opacity: 0.83;
   transform: rotate(60deg);
}

@keyframes spinner_bars-d3o0rx {
   100% {
      transform: rotate(1turn);
   }
}