﻿/* BEGIN: common */

	.-wizard-header {
		background-image: url(/resources/images/wizard/head-banner.jpg);
		background-size: cover;
		height: 180px;
		display: flex;
		align-items: center;
		color: var(--text-comp);
		margin-bottom: 48px;

	}
	.-wizard-header .wizard-header-title {
		font-size: var(--font-size-xl);
		font-weight: bold;
	}

	.-wizard-viewport-restriction {
		display: none;
	}
	@media (max-width: 1023px) {

		.-wizard-viewport-restriction {
			display: block;
		}
		.-wizard {
			display: none;
		}
	}

	.actions-bottom {
		align-items: center;
		background-color: var(--white);
		border-top: 6px solid var(--first-base);
		display: flex;
		justify-content: center;
		margin-top: 48px;
		padding: 44px 12px;
		width: 100%;
	}
	/* Fallback for Safari */
	.actions-bottom > * + * { margin-left: 72px; }

	.actions-bottom button,
	.actions-bottom .btn {
		font-size: 120%;
	}

	.page-separator {
		border-top: 6px solid var(--first-base);
		width: 100%;
	}

/* END: common */

/* BEGIN: client-login */

	section.-client-login {
		min-height: 100vh;
	}
	section.-client-login .content {
		border: 1px solid var(--light-grey);
		border-top-right-radius: 32px;
		border-bottom-right-radius: 32px;
		box-shadow: var(--light-grey) 0 2px 5px;
		display: flex;
		flex-direction: column;
		margin-top: 64px;
		margin-bottom: 64px;
		min-height: 620px;
		width: 90%;
		padding: calc(var(--offset-stepsize) * 3) calc(var(--offset-stepsize) * 6);
	}
	@media (max-width: 1469px) {
		section.-client-login .content {
			padding: calc(var(--offset-stepsize) * 2) calc(var(--offset-stepsize) * 4);
		}
	}
	@media (max-width: 1279px) {
		section.-client-login .content {
			padding: calc(var(--offset-stepsize) * 1) calc(var(--offset-stepsize) * 2);
		}
	}

	section.-client-login .design-col {
		background-image: url(/resources/images/wizard/login-background.jpg);
		background-size: cover;
		background-position: bottom;

	}

	section.-client-login .logo {
		justify-self: flex-end;
		height: 80px;
		max-height: 80px;
	}
		section.-client-login .logo img {
			height: 100%;
		}

/* END: client-login */

/* BEGIN: client-register */

	section.-client-register {
		min-height: 100vh;
	}
	section.-client-register .content {
		border: 1px solid var(--light-grey);
		border-top-right-radius: 32px;
		border-bottom-right-radius: 32px;
		box-shadow: var(--light-grey) 0 2px 5px;
		display: flex;
		flex-direction: column;
		margin-top: 64px;
		margin-bottom: 64px;
		min-height: 620px;
		width: 90%;
		padding: calc(var(--offset-stepsize) * 3) calc(var(--offset-stepsize) * 6);
	}
	@media (max-width: 1469px) {
		section.-client-register .content {
			padding: calc(var(--offset-stepsize) * 2) calc(var(--offset-stepsize) * 4);
		}
	}
	@media (max-width: 1279px) {
		section.-client-register .content {
			padding: calc(var(--offset-stepsize) * 1) calc(var(--offset-stepsize) * 2);
		}
	}

	section.-client-register .pharmacies {
		border: 1px solid var(--light-grey);
		box-shadow: var(--light-grey) 0 2px 5px;
		border-radius: var(--border-radius-xl);
		height: 35vh;
		min-height: 240px;
		overflow-y: auto;
		padding: var(--offset-stepsize);
	}

	section.-client-register .title {
		text-align: center;
		font-size: 200%;
	}

	section.-client-register .design-col {
		background-image: url(/resources/images/root/head-banner-small.jpg);
		background-position-x: right;
		background-position-y: bottom;
		background-size: 250%;
	}

	section.-client-register .logo {
		height: 80px;
		max-height: 80px;
	}
		section.-client-register .logo img {
			height: 100%;
		}

	section.-client-register .view-title-box {
		color: var(--text-comp);
	}
		section.-client-register .view-title-box .view-title {
			font-size: 70px;
			font-weight: bold;
		}
		section.-client-register .view-title-box .view-subtitle {
			font-size: 50px;
		}

	@media (max-width: 1280px) {
		section.-client-register .view-title-box .view-title {
			font-size: 50px;
		}
		section.-client-register .view-title-box .view-subtitle {
			font-size: 30px;
		}
	}

	section.-client-register form.search,
	section.-client-register form.list,
	section.-client-register form.register {
		margin-left: auto;
		margin-right: auto;
		max-width: 700px;
		width: 100%;
	}

	section.-client-register .actions {
		display: flex;
		justify-content: flex-end;
		flex-direction: column;
	}

	section.-client-register .field .street-name {
		width: calc(100% - 88px);
	}
	section.-client-register .field .street-number {
		margin-left: 8px;
		width: 80px;
	}

	section.-client-register .field .postcode {
		margin-right: 8px;
		width: 120px;
	}
	section.-client-register .field .city {
		width: calc(100% - 128px);
	}

	section.-client-register .warning-existing {
		align-items: center;
		display: flex;
		flex-direction: column;
		font-size: var(--font-size-s);
		justify-content: center;
	}
		section.-client-register .warning-existing .icon {
			height: 24px;
			width: 24px;
		}

/* END: client-register */

/* BEGIN: wizard-bar */

	nav.wizard-bar {
		background-color: var(--white);
		border-top: 8px solid var(--first-base-color);
		box-shadow: 0 5px 5px var(--light-grey);
		color: var(--first-base-color);
		display: flex;
		height: 50px;
		justify-content: space-between;
		padding: 42px 20px;
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		z-index: 5000;
	}

		nav.wizard-bar .nav-items-left,
		nav.wizard-bar .nav-items-right {
			align-items: center;
			display: flex;
			flex-direction: row;
		}

		nav.wizard-bar .nav-item {
			color: var(--first-base-color);
			cursor: pointer;
			margin: 0 24px;
		}
		nav.wizard-bar .nav-item.user.dropdown .dropdown-menu {
			width: 100px;
			margin-left: -30px;
		}

/* END: wizard-bar */

/* BEGIN: wizard-content */

	.-wizard-content .step-image img {
		max-width: 400px;
	}

	.-wizard-content .actions-fixed {
		bottom: 0;
		padding: 32px;
	}
	.-wizard-content img {
		width: 200px;
	}
	.-wizard-content .info-container {
		flex-wrap: nowrap
	}
	@media (max-width: 1279px) {

		.-wizard-content .info-container {
			flex-wrap: wrap;
		}
	}

	.-wizard-content .process-info {
		max-width: 700px;
	}
	@media (max-width: 1279px) {

		.-wizard-content .process-info {
			max-width: 100%;
		}
		.-wizard-content .process-info img {
			display: none;
		}
	}

/* END: wizard-content */

/* BEGIN: wizard-contract */

	.-wizard-contract label {
		margin-bottom: 4px;
	}
	.-wizard-contract .field {
		margin-bottom: 24px;
	}
		.-wizard-contract .field input {
			width: 100%;
		}

	.-wizard-contract .summary .summary-separator {
		height: 2px;
		background-color: var(--light-grey);
	}

/* END: wizard-contract */

/* BEGIN: wizard-contract-success */

	.-wizard-contract-success {
		padding: 0!important;
	}
	.-wizard-contract-success .step-image img {
		max-width: 400px;
	}

	.-wizard-contract-success .summary {
		color: var(--contract-summary-comp-color);
		background-color: var(--contract-summary-base-color);
	}

	.-wizard-contract-success .actions-fixed {
		bottom: 0;
		padding: 32px;
	}

/* END: wizard-contract-success */

/* BEGIN: wizard-focus */

	.-wizard-focus .focus-images {
		height: 400px;
		overflow: auto;
		padding-right: 12px;
	}
		.-wizard-focus .focus-image.checked img {
			border: 4px solid var(--first-base-color);
		}
		.-wizard-focus .focus-image img {
			border: 4px solid var(--white);
			height: auto;
			width: 100%;
		}

	.-wizard-topics .bottom-bar {
		box-shadow: 0 -5px 5px var(--light-grey);
		padding: 12px;
	}

/* END: wizard-focus */

/* BEGIN: wizard-hosting */

	.-wizard-hosting .domain-feedback {
		float: right;
		height: 24px;
	}

	.-wizard-hosting .encryption,
	.-wizard-hosting .move-manual {
		font-size: 90%;
		margin-left: 35px;
	}

		.-wizard-hosting .encryption img {
			height: 88px;
		}

/* END: wizard-hosting */

/* BEGIN: wizard-intro */

	.-wizard-intro {
		border-bottom: 50px solid var(--first-base-color);
	}
	.-wizard-intro .apozini {
		width: 200px;
	}

	.-wizard-intro .video {
		border-radius: var(--border-radius-xl);
		width: 700px;
		height: 440px;
	}

	.-wizard-intro .apozini-profile-col {
		max-width: 700px;
	}
	.-wizard-intro .apozini-profile {
		padding: calc(var(--offset-stepsize) * 4);
		min-width: 600px;
		height: 100%;
	}
	/* Fallback for Safari */
	.-wizard-intro .apozini-profile > * + * { margin-left: 64px; }

	.-wizard-intro .apozini-profile-img {
		width: 200px;
		height: 200px;
		border: 1px solid var(--light-grey);
		border-radius: 50%;
	}

	@media (max-width: 1470px) {

		.-wizard-intro .apozini-profile-col {
			margin-top: 64px;
			max-width: 100%;
		}
	}
	/* Fallback for Safari */
	.-wizard-intro .welcome > * + * { margin-left: 64px; }

/* END: wizard-intro */

/* BEGIN: wizard-legals */

	.-wizard-legals .area {
		display: inline-block;
		min-width: 384px;
		vertical-align: top;
	}

/* END: wizard-legals */

/* BEGIN: wizard-product */

	.-wizard-product {
		border-bottom: 6px solid var(--first-base);
	}

	.-wizard-product .product-card-tabs {
		display: flex;
		justify-content: space-between;
		align-items: flex-end;
	}
	.-wizard-product .product-card-tabs .product-card-tab {
		flex-basis: 40%;
		padding: 24px 0;
		text-align: center;
		border-top-left-radius: var(--border-radius-xl);
		border-top-right-radius: var(--border-radius-xl);
	}
	.-wizard-product .product-card-tabs .product-card-tab.product-card-tab-primary {
		background-color: var(--first-base);
		color: var(--first-comp);
	}
	.-wizard-product .product-card-tabs .product-card-tab.product-card-tab-secondary {
		background-color: var(--second-base);
		color: var(--second-comp);
	}

	.-wizard-product .product-card-content {
		border: 1px solid var(--light-grey);
		border-bottom-left-radius: var(--border-radius-xl);
		border-bottom-right-radius: var(--border-radius-xl);
		box-shadow: var(--light-grey) 0 2px 5px;
	}
	.-wizard-product .product-card-feature-list {
		padding: 48px;
	}
	.-wizard-product .product-card-feature-list li {
		display: flex;
		align-items: center;
		margin-bottom: 32px;
	}
	.-wizard-product .product-card-feature-list .icon-check {
		margin-right: 20px;
	}
	.-wizard-product .product-card-actions {
		border-top: 1px solid var(--light-grey);
		display: flex;
		justify-content: center;
		padding: 32px;
	}

	.-wizard-product .sticker-list {
		align-items: center;
		display: flex;
		flex-grow: 1;
		justify-content: center;
	}
	/* Fallback for Safari */
	.-wizard-product .sticker-list > * + * { margin-left: calc(var(--offset-stepsize) * 2); }

		.-wizard-product .sticker-list .sticker {
			border-radius: 50%;
			box-shadow: var(--light-grey) 0px 3px 3px;
			height: 145px;
			width: 145px;
		}
		@media (max-width: 1279px) {

			.-wizard-product .sticker-list .sticker {
				margin-top: calc(var(--offset-stepsize) * 2);
			}
		}
		@media (max-width: 1023px) {

			.-wizard-product .sticker-list .sticker {
				height: 140px;
				width: 140px;
			}
		}
		@media (max-width: 799px) {

			.-wizard-product .sticker-list .sticker {
				height: 100px;
				width: 100px;
			}
		}

		.-wizard-product .link {
			border-bottom: 1px solid var(--grey);
			color: var(--grey);
		}

/* END: wizard-product */

/* BEGIN: wizard-questionnaire */

	.-wizard-questionnaire .questionnaire-header {
		background-image: url(/resources/images/wizard/head-banner.jpg);
		background-size: cover;
		height: 180px;
		display: flex;
		align-items: center;
		color: var(--text-comp);
		z-index: 10;
	}
	.-wizard-questionnaire .questionnaire-header-title {
		font-size: var(--font-size-xl);
		font-weight: bold;
	}

	.-wizard-questionnaire .step-content > .container {
		margin-top: 48px;
	}

	.-wizard-questionnaire .step-tabs {
		background-color: var(--light-grey);
		color: var(--text-base);
		width: 100%;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		z-index: 10;
		position: sticky;
		top: 106px;
	}
		.-wizard-questionnaire .step-tabs .step-tab {
			border-right: 1px solid #FFFFFF;
			cursor: pointer;
			padding: 12px;
			flex-grow: 1;
			text-align: center;
		}
		.-wizard-questionnaire .step-tabs .step-tab:last-child {
			border-right: none;
		}
		.-wizard-questionnaire .step-tabs .step-tab.answered {
			background-color: var(--third-base);
		}
		.-wizard-questionnaire .step-tabs .step-tab.active {
			background-color: var(--first-base);
			color: var(--first-comp);
		}

		.-wizard-questionnaire .step-tabs .step-tab .step-tab-title {
			font-weight: bold;
		}
		@media (max-width: 1279px) {

			.-wizard-questionnaire .step-tabs .step-tab .step-tab-subtitle {
				display: none;
			}
		}

		.-wizard-questionnaire .step-tabs .step-tab.loading-inline {
			position: relative;
		}
			.-wizard-questionnaire .step-tabs .step-tab.loading-inline i {
				left: calc(50% - 12px);
				position: absolute;
				top: calc(50% - 12px);
			}

			.-wizard-questionnaire .step-tabs .step-tab.loading-inline span {
				visibility: hidden;
			}

	.-wizard-questionnaire .question:not(:last-of-type) {
		border-bottom: 2px solid var(--light-grey);
		margin-bottom: 48px;
		padding-bottom: 20px;
	}

	.-wizard-questionnaire .question-value {
		color: var(--first-base-color);
		font-weight: bold;
		font-size: 140%;
		margin-bottom: 24px;
	}

	.-wizard-questionnaire .answer-group {
		width: 92%;
		margin: auto;
	}
		.-wizard-questionnaire .answer-group .answer-group-label {
			display: block;
			font-weight: 700;
			margin-bottom: 16px;
			text-align: center;
		}
		.-wizard-questionnaire .answer-group .answer-group-slide {
			height: 100px;
		}

	.-wizard-questionnaire .answer-single input[type="checkbox"],
	.-wizard-questionnaire .answer-multi input[type="checkbox"],
	.-wizard-questionnaire .answer-single input[type="radio"],
	.-wizard-questionnaire .answer-multi input[type="radio"] {
		display: none;
	}

	.-wizard-questionnaire .answer-single,
	.-wizard-questionnaire .answer-multi {
		margin: 0 24px 24px 0;
	}
		.-wizard-questionnaire .answer-single label,
		.-wizard-questionnaire .answer-multi label {
			min-width: 200px;
			display: flex;
			height: 44px;
			justify-content: center;
			align-items: center;
			padding: 4px 16px;
		}

	.-wizard-questionnaire .answer-text {
		flex-grow: 1;
	}
		.-wizard-questionnaire .answer-text input[type="text"] {
			display: block;
			margin: auto;
			width: 80%;
		}

/* END: wizard-questionnaire */

/* BEGIN: wizard-review */

	.-wizard-review .description ul {
		margin-bottom: 16px;
	}
		.-wizard-review .description ul li {
			margin: 0;
		}

	.-wizard-review .step-image img {
		max-width: 400px;
	}

/* END: wizard-review */

/* BEGIN: wizard-services */

	.-wizard-services .topic {
		display: inline-block;
		vertical-align: top;
		width: 33%;
	}

	.-wizard-services .topic .disabled {
		opacity: 0.6;
	}

/* END: wizard-services */

/* BEGIN: wizard-viewport-restriction */

	.-wizard-viewport-restriction .apozini-profile-img {
		width: 200px;
		height: 200px;
		border: 1px solid var(--light-grey);
		border-radius: 50%;
		margin-right: 32px;
	}

/* END: wizard-viewport-restriction */

/* BEGIN: system-on-error */

	section.-system-on-error .trace-lines {
		font-family: Consolas, 'Courier New', monospace;
		margin-top: 16px;
	}

	section.-system-on-error .trace-line {
		background-color: var(--white);
		margin-bottom: 8px;
		padding: 8px;
	}

		section.-system-on-error .trace-line .line {
			border-bottom: 1px solid var(--light-grey);
			margin-bottom: 4px;
		}

/* END: system-on-error */
