/* Sign in button on left side */

.button--text-blue {
	color: var(--Light-text-accent, #2767E3);
	font-size: 14px;
	font-style: normal;
	font-weight: 550;
	line-height: 18px;
	letter-spacing: -0.056px;
	border-bottom: 1px dashed rgba(85, 149, 208, 0.80);
	border-radius: 0;
	padding: 0;
	margin-left: 8px;
}

.button--text-blue:hover {
	color: var(--Light-text-subtle, #45474D);
}

.button--text-blue-noline {
	border-bottom: none;
	color: var(--Light-text-accent, #2767E3);
	font-size: 14px;
	font-style: normal;
	font-weight: 550;
	line-height: 18px;
	letter-spacing: -0.056px;
	border-radius: 0;
	padding: 0;
	margin-left: 8px;
}

.sign-in__link p {
	display: inline;
	margin: 0;
}

.button {
	display: inline;
}

.button--text-blue:hover {
	color: var(--Light-text-subtle, #45474D);
}

.button--text-blue-noline {
	border-bottom: none;
	color: var(--Light-text-accent, #2767E3);
	font-size: 14px;
	font-style: normal;
	font-weight: 550;
	line-height: 18px;
	letter-spacing: -0.056px;
	border-radius: 0;
	padding: 0;
	margin-left: 8px;
}

.sign-in__form-title {
	color: var(--Light-text-strong, #1C1E21);
	font-size: 33px;
	font-style: var(--button-font-style);
	font-weight: var(--button-font-weight);
	line-height: 40px;
	letter-spacing: -0.792px;
	margin-bottom: 32px;
}

.sign-in__sso {
	border-radius: var(--button-radius, 4px);
	background: var(--Light-bg-button-default, #EBECEE);
	display: flex;
	padding: 12px 16px;
	justify-content: center;
	align-items: center;
	gap: 10px;
	align-self: stretch;
	color: var(--Light-text-default, #292A2F);
	cursor: pointer;
	width: 400px;
}

.sso-or-container {
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 30px 0;

}

.line-before,
.line-after {
	background-color: #EBECEE;
	height: 1px;
	flex-grow: 1;
}



.or-text {
	padding: 0 10px;
	white-space: nowrap;
	color: var(--Light-text-soft, #676A6F);
	font-size: 14px;
	font-style: var(--button-font-style);
	font-weight: 550;
	line-height: 18px;
	letter-spacing: -0.056px;
}

.custom-checkbox {
	display: flex;
	align-items: center;
	cursor: pointer;
	margin-bottom: 20px;

}

.custom-checkbox input[type="checkbox"] {
	margin-right: 12px;
}

.checkbox-label {
	color: var(--Light-text-default, #292A2F);
	font-size: 15px;
	font-style: normal;
	font-weight: 550;
	line-height: 20px;
	letter-spacing: -0.06px;
}

/* INLINE STYLES*/

/* Dashboard 1 */

#section-inner {
	max-width: 560px;
}

.section-container {
	min-height: calc(100vh - (68px + 72px)); 
	margin-bottom: 140px;
}

.mx-auto-custom {
	min-height: calc(100vh - (68px + 72px));
	max-width: 560px;
}

.badge-initials {
	text-shadow: 0px 1px 2px rgba(0 0 0 / 16%);
}

/* Dashboard 2*/

.mx-auto-920 {
	max-width: 920px;
}

.img-wrapper pl-half user-select-none lg-screen-only {
	width: 20px;
	height: 20px
}

/* Create Accunt page*/
.sandbox-access__form--create-inner {
	margin-bottom: 36px;

}

/* partials*/

#company-header__name-inner, #employeename-inner  {
	width: 20px;
	height: 20px
}

#select-company-chevron {
	margin-top: 9px;
	margin-left: 4px;
}

.sandbox-access__btn--submit {
	text-align: center;
}

/* APPEARANCE on login pages */

#appearance_flyout:checked ~ .sandbox-settings--profile-appearance {
    display: block; 
	position: relative;
}


.sandbox-localize__btn {
	cursor: pointer;
}

.parent-of-trigger,
sandbox-access__header--left {
	position: relative;
}

.sandbox-localize__btn {
	cursor: pointer;
}

.sandbox-localize {
	position: relative;
}

#appearance_flyout:checked~.sandbox-settings--profile-appearance {
	display: block;
	position: absolute;
	top: 100%;
	z-index: 10;
	margin-left: -3px;
	border-radius: 6px;
}

.parent-of-trigger {
	position: relative;
	margin-right: -20px;
}

.sandbox-flyout__top-wrapper {
	background: linear-gradient(136deg, rgba(177, 21, 255, 0.20) 1.71%, rgba(246, 190, 123, 0.12) 26.73%, rgba(255, 255, 255, 0.00) 62.12%);
	border-radius: 6px 6px 0 0;
	padding-top: 16px;
}

#svg-purple path,
#svg-purple rect,
#svg-purple circle {
	fill: #7629FA;
}

#svg-blue path,
#svg-blue rect,
#svg-blue circle {
	fill: #2767E3;
}

/* Access SVG verificartion*/

#verify {
	margin-top: -260px;
}

/*VERIFY PAGE*/

.svg-light {
	display: block;
}

.svg-dark {
	display: none;
}

#dark:checked~.body .sandbox-access .sandbox-access__banner .sandbox-access__form--verify .svg-container-verify .svg-dark {
	display: block;
}

#dark:checked~.body .sandbox-access .sandbox-access__banner .sandbox-access__form--verify .svg-container-verify .svg-light {
	display: none;
}


@media (max-width: 600px) {

	#verify {
		margin-top: 0;
	}

	.sandbox-dashboard__menu-slider {
		margin-left: -50px;
	}

	.sandbox-flyout__top-wrapper {
		border-radius: 0;
	}
}

/*Recent codes part, not implemented in this app entirely, thats why commented out*/
.recently-logged-in-codes {
  display: flex;
  gap: 18px;
  flex-wrap: wrap;
  margin-bottom: 24px;
}
/*
.active {
  background: linear-gradient(135deg, #2767e3, #1b4dab);
  animation: pulse 2s infinite;
}*/

.client-code-box {
  width: 56px;
  height: 56px;
  background-color: #2767e3;
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  border-radius: 8px;
  font-size: 16px;
  font-weight: 600;
}