:root {

	--primary-color: #3dadc4;

}

.extranet {

	display: grid;

	grid-template-columns: 40vmin 1fr;

	gap: 1rem;

}

.extranet:not(.search-mode) .--full-length,
.extranet:not(.search-mode) .--icon + .--item {

	grid-column: span 2;

}

.--table > .--icon,
.extranet:not(.search-mode) .--icon + .--item {

	color: var(--primary-color);

}

.extranet:not(.search-mode) .search,
.extranet:not(.search-mode) .reset-search {

	display: none;

}

.extranet.search-mode .return-button,
.extranet.search-mode .--research-content > span {

	display: none;

}

.extranet.loading .loader {

	opacity: 1;

}

.--bookmarks {

	display: flex;

	flex-direction: column;

	gap: .1rem;

	grid-row: 3;

}

.--bookmarks-title {

	grid-row: 2;

	align-self: center;

}

.--top-navigation {

	display: flex;

	align-items: center;

	grid-column: 2;

}

.--breadcrumb {

	margin-left: 1rem;

	color: var(--primary-color);

}

.--top-navigation ul {

	display: flex;

	gap: 1rem;

}

.--top-link-button {

	display: inline-flex;
	
	justify-content: center;
	align-items: center;
	
	padding: 0;

}

.--top-link-button > span {

	font-size: 2rem;

	transform: translateY(.1em);

}

.--top-navigation ul li {

	display: flex;

	margin: 0 !important;

	gap: 1rem;

}

.--research-content {

	position: relative;

	margin-left: auto;

	grid-column: 2;

}

.--research-content input {

	background-color: #078097;
	color: white;

	width: 100%;
	min-width: 320px;
	
	padding: 0.7rem;

	outline: none;

}

.--research-content input::placeholder {

	color: white;

}

.--research-content > span {

	position: absolute;
	
	right: 1rem;
	top: 50%;
	
	color: white;

	transform: translateY(-50%);

}

.--table {

	position: relative;

	display: grid;

	grid-template-columns: 	minmax(30px, 120px)
							minmax(150px, 1fr)
							minmax(150px, 1fr)
							minmax(100px, 150px);

}

.--table .loader {

	position: absolute;

	min-height: 50vh;

}

.--table .loader .loader--wrapper {

	align-items: start;

	padding-top: 8rem;

}

.--table .--header {

	border-top: 1px solid black;
	border-bottom: 1px solid black;

}

.--table > span.--header {

	padding: 1.5rem 0;

}

.--table > span:not(.--header) {

	padding: 1rem 0;

}

.--table > span:not(.--header) {

	cursor: pointer;

	transition: background-color .3s ease,
				color .3s ease;

}

.--table > span:not(.--header).hover {

	color: white !important;

	background-color: var(--primary-color);

}

.--table > span:not(.--header).hover .--ext {

	background-color: transparent !important;

}

.--table > .--icon .--ext {

	transition: background-color .3s ease;

}

.--table > span:first-child,
.--table > .--icon {

	display: flex;

	justify-content: center;

}

.--table > .--icon {

	position: relative;

	font-size: 2rem;

}

.--table > .--icon .--ext {

	position: absolute;

	font-size: .8rem;
	
	right: 29%;
	bottom: 12%;

	background-color: rgb(255 255 255 / 46%);

}

.--table > .--item {

	display: flex;

	align-items: center;
}

.--item.search ul {

	display: flex;

	align-items: center;

	gap: 1rem;
	
	color: var(--primary-color);

}

.--item.search.hover ul {

	color: white !important;

}

.--item.search ul li {

	display: flex;

	gap: 1rem;

	margin-bottom: 0 !important;

}

.--item.search ul li .icon-address {

	font-size: 1.5rem;

}

.arrow-order {

	position: relative;

	display: inline-block;
	
	width: .9rem;
	height: .7rem;

	cursor: pointer;

}

.arrow-down {

	background-color: #078097;

	clip-path: polygon(50% 100%, 0 0, 100% 0);

}

.arrow-up {

	clip-path: polygon(50% 0, 0% 100%, 100% 100%);

	background-color: #078097;

}

.arrow-up::after,
.arrow-down::after {

	position: absolute;

	content: "";

	width: 100%;
	height: 100%;

	top: 0;
	left: 0;

	background-color: white;

}

.extranet[data-order="date|asc"] span[data-set-order="date|asc"]::after,
.extranet[data-order="date|desc"] span[data-set-order="date|desc"]::after,
.extranet[data-order="name|asc"] span[data-set-order="name|asc"]::after,
.extranet[data-order="name|desc"] span[data-set-order="name|desc"]::after {

	display: none;

}

.extranet[data-order="date|asc"] span[data-set-order="date|asc"],
.extranet[data-order="date|desc"] span[data-set-order="date|desc"],
.extranet[data-order="name|asc"] span[data-set-order="name|asc"],
.extranet[data-order="name|desc"] span[data-set-order="name|desc"] {

	pointer-events: none;

}

.arrow-down::after {

	clip-path: polygon(50% 80%, 10% 10%, 90% 10%);

}

.arrow-up::after {

	clip-path: polygon(50% 20%, 10% 90%, 90% 90%);

}

.logout-form {

	display: flex;

	justify-content: end;

}

.logout-form button {

	width: fit-content;

}

.return-button {

	transform: rotateY(-180deg);

	margin-right: 1rem;

}

button:disabled {

	background-color: grey;
	pointer-events: none;

}

.external-link-widget {

	cursor: pointer;

}

.cross {

	position: relative;

	display: inline-block;

	width: 100%;
	height: 100%;

}

.cross::before {

	position: absolute;

	content: "";

	top: 50%;
	left: 50%;

	width: 80%;
	height: 1px;

	transform: translate(-50%, -50%);

	background-color: white;

}

.cross::after {

	position: absolute;

	content: "";

	top: 50%;
	left: 50%;

	width: 1px;
	height: 80%;

	transform: translate(-50%, -50%);

	background-color: white;

}

.reset-search {

	position: absolute;
	
	padding: 0;

	background: none;

	width: 2rem;
	height: 2rem;
	
	right: .5rem;
	top: 50%;
	
	transform: translateY(-50%) rotate(45deg);

}

.reset-search::after {

	display: none;

}

.external-link-widget a::before {

	font-size: 2rem;

}

#roles_allowed_access_page_meta_box {
	display: none;
}

/* - Login page */
.sct-extranet-login-form > div > div:last-child {

	overflow: hidden;
	position: relative;

}

.sct-extranet-login-form .error-msg {

	margin: 0;
	
	color: red;

}

.sct-extranet-login-form .toggle-area {

	margin-top: 2rem;

}

.sct-extranet-login-form .toggle-area a {

	color: #078097;

}

.sct-extranet-login-form .toggle-area a::after {

	background-color: #078097;

}

.sct-extranet-login-form > div > div:last-child > svg {

	width: 150%;
	position: absolute;
	top: 50%;
	height: 50%;
	right: 0;
	-webkit-transform: translateY(-50%);
		-moz-transform: translateY(-50%);
		-ms-transform: translateY(-50%);
			-o-transform: translateY(-50%);
			transform: translateY(-50%); 

}

.sct-extranet-login-form input {

	border: 1px solid #3dadc4;
	background-color: transparent;
	padding: 0.5rem;
	width: 100%;

}

.sct-extranet-login-form > div > div:last-child {

	background-color: #078097;

}

.sct-extranet-login-form > div > div:last-child > svg path {

	fill: white;

}

.password-recovery-msg {

	color: white;
	padding: 2rem !important;
	background-color: #078097;

}

.bot-field {

	position: absolute;
	z-index: -1;
	left: -9999px;

}

.form-column input:not(:first-child) {

	margin-top: 1rem;

}

.form-column button {

	margin-top: 1rem;
	width: fit-content !important;

}

.empty,
.message {

	grid-column-start: 1;
    grid-column-end: 6;

    justify-self: center;
	align-self: center;
	
	pointer-events: none;

	font-style: italic;

	color: #078097;
	
	padding-top: 2rem !important;

}

.--header.in-left-spacing-small,
.--item.in-left-spacing-small {

	padding-left: .5rem !important;

}

.--icon {

	grid-column: 1;

}

@media screen and (max-width: 42.5em) {

	.extranet:not(.search-mode) .--full-length,
	.extranet:not(.search-mode) .--icon + .--item {

		grid-column: 2;

	}
	
	.--table {

		grid-template-columns: auto 1fr;

	}

	.--hidden-mobile {

		display: none !important;

		visibility: hidden;

	}

	.--research-content {

		grid-column: span 2;
		margin: 0;

	}

	.--research-content input {

		min-width: unset !important;

	}

}

@media screen and (min-width: 42.5em) and (max-width: 98.125em) {

	.extranet:not(.search-mode) .--full-length,
	.extranet:not(.search-mode) .--icon + .--item {

		grid-column: span 2;

	}

}

@media screen and (max-width: 98.125em) {

	.--top-navigation {

		grid-column: span 2;

	}

	.--bookmarks-title {

		margin: 2rem 0;

		grid-row: 4;
		grid-column: span 2;

	}

	.--bookmarks {

		grid-row: 5;
		grid-column: span 2;

	}

	.--content {

		grid-row: 3;
		grid-column: span 2;

	}

}

/* Extranet new password */
.sct-extranet-new-password > div > div:last-child {

	position: relative;
	
	min-height: 80vh;
	
	overflow: hidden;

}

.sct-extranet-new-password > div > div:last-child > svg {

	position: absolute;
	
	width: 75%;
	height: 75%;
	
	top: 50%;
	left: 50%;
	
	transform: translate(-50%, -50%); 

}

.sct-extranet-new-password > div > div:last-child > svg path {

	fill: var(--primary-color);

}

.sct-extranet-new-password .user-new-password {

	display: block;

	width: auto;
	
	margin: 2rem 0;
	padding: 2rem;
	
	background-color: #fff;
	
	text-align: center;
	
	font-size: 2rem;

}