$top-panel-gutter: 10px;

.top-panel {
	padding-top: 15px;
	padding-bottom: 15px;

	@include media-breakpoint-up(md) {
		padding-top: 6px;
		padding-bottom: 6px;
	}

	&__container {
		@include grid-indent($top-panel-gutter);

		display: flex;
		align-items: center;
		justify-content: center;
		flex-flow: column nowrap;

		@include media-breakpoint-up(md) {
			flex-flow: row wrap;
			justify-content: space-between;
		}

		> * + * {
			margin-top: 10px;

			@include media-breakpoint-up(md) {
				margin-top: 0;
			}
		}
	}

	&__wrap-items {
		&:only-child {
			flex-grow: 1;
		}
	}
	&__part {
		display: flex;
		flex-direction: row;
		align-items: center;
		flex-wrap: nowrap;
	}

	&__menus {
		display: flex;
		flex-flow: row wrap;
		align-items: center;
		justify-content: center;
		@include grid-indent($top-panel-gutter);
	}

	&__message {
		padding-top: 5px;
		padding-bottom: 5px;
		text-align: center;

		@include media-breakpoint-up(md) {
			text-align: left;
		}

		& + .contact-block {
			@include media-breakpoint-up(md) {
				order: 5;
				width: 100%;
			}
		}
	}

	.contact-block__text,
	.contact-block__label,
	.cherry-popups-login-link,
	.cherry-popups-logout-link,
	.cherry-popups-signup-link {
		font-size: .7875rem;
		line-height: 1.6 ;
		font-weight: 400;
		text-transform: uppercase;
		padding-right: 3px;
	}
	.contact-block__text,
	.contact-block__label {
		text-transform: none;
	}
	.woocommerce-currency-switcher-form {
		height: auto;
		max-width: 100%;
		margin-right: 10px;
		.dd-desc {
			display: none;
		}

		.dd-container .dd-options a.dd-option {
			cursor: pointer;
			input, label {
				cursor: pointer;
			}
		}

		.dd-container .dd-selected {
			padding: 0;
			font-size: 11px;
			line-height: 20px;
			font-weight: 400;

			&-text {
				transition: all .3s ease;
			}

			label {
				cursor: pointer;
				font-weight: 300;
			}
		}

		.dd-container {
			.mobile-panel & {
				width: 45px !important;
			}

			.widget-area & {
				border: 1px solid $color__border-input;
				background-color: $color__background-input;

				.dd-selected {
					padding: 15px;
				}

				.dd-pointer-down {
					right: 2px;
				}

				.dd-options {
					width: 100% !important;
				}
			}

			.dd-select {
				background: transparent !important;
				border: none;
				border-radius: 0;
				cursor: pointer;
				font-size: 14px;
				line-height: 20px;


				.mobile-panel & {
					width: 45px !important;
				}
			}

			.dd-pointer {
				position: absolute;
				right: 5px;
				top: 50%;
				margin-top: 0;
				@include transform(translate(0, -50%));
				border: none !important;
				width: 15px;
				height: 15px;

				.mobile-panel & {
					display: none;
				}

				&:after {
					content: "\e93a";
					position: absolute;
					transition: all .3s ease;
					@include linear-icon();
					font-size: 8px;
					line-height: 15px;
					@include transform(rotate(0deg));
				}

				&.dd-pointer-up {
					&:after {
						@include transform(rotate(-180deg));
					}
				}
			}

			.dd-options {
				width: 150px !important;
				border: none;
				box-shadow: none;
				padding: 10px 20px;
				right: 0;

				a.dd-option {
					background: transparent;
					border: none;
					font-weight: 300;
					padding: 0;

					.dd-option-text {
						font-size: 14px;
					}

					.dd-desc {
						font-size: 12px;
					}
				}
			}
		}
	}
}