/* -------------------------------------------
	Header
		-Header
		-Welcome-msg
		-Header Search
		-Other 
			- Login
			- Call
			- Wishlist
		-Sticky Header
		-Other Options
---------------------------------------------- */

// Variables
@include set-default(
	(
		header: (
			letter-spacing: -.025em,
			font-size: 14px,
			text-transform: uppercase,
			background-color: #fff,
			_link-active-color: var(--rio-primary-color, #27c),

			search: (
				width: 50rem,

				// Toggle Search
				toggle: (
					padding: 1rem 0,
				),
				// Expanded Search
				expanded: (
					height: false
				),
				// Simple Search
				simple: (
					height: false
				)
			),

			cart: (
				toggle: (
					padding: .6rem 0,
					color: var(--rio-primary-color, #27c),
				),
				label: (
					price: (
						color: false,
					)
				),
				icon: (
					display: inline-block,
					hover: (
						border-color: false
					)
				),
				count: (
					font-family: false,
					font-size: 1.3rem,
					font-weight: 600,
					line-height: 25px,
					hover: (
						color: #fff
					)
				)
			),
		)
	)
);

// Header
.header {
	background-color: var(--rio-header-bg-color);
	background-image: var(--rio-header-bg-image);
	background-repeat: var(--rio-header-bg-repeat);
	background-position: var(--rio-header-bg-position);
	background-size: var(--rio-header-bg-size);
	background-attachment: var(--rio-header-bg-attachment);
	font-family: var(--rio-header-font-family, var(--rio-body-font-family)), sans-serif;
	font-weight: var(--rio-header-font-weight, var(--rio-body-font-weight));
	font-size: var(--rio-header-font-size, var(--rio-body-font-size));
	line-height: var(--rio-header-line-height, var(--rio-body-line-height));
	letter-spacing: var(--rio-header-letter-spacing, var(--rio-body-letter-spacing));
	text-transform: var(--rio-header-text-transform, var(--rio-body-text-transform));
	color: var(--rio-header-color, var(--rio-body-color));

	a:hover, a:focus,
	.search-wrapper.hs-toggle:hover,
	.dropdown:hover > a {
		color: var(--rio-header-link-active-color, var(--rio-primary-color, #27c));
	}

	p {
		font-size: inherit;
	}

	a:hover, a:focus {
		color: var(--rio-header-link-active-color, var(--rio-primary-color, #27c));
	}
}

.logo {
	display: block;
	width: 153px;

	img {
		display: block;
	}
}

// Header Search
.live-search-list {
	position: absolute;
	margin-top: 3px;
	left: 0;
	top: 100%;
	right: 0;
	box-shadow: 0 2px 35px rgba(0,0,0,0.1);
	font-size: font-size(13px);
	background: #fff;
	z-index: 1040;

	.autocomplete-suggestions {
		max-height: 272px;
		margin: .5rem 2rem;
		overflow-y: scroll;

		&::-webkit-scrollbar {
			width: 6px;
		}
		&::-webkit-scrollbar-thumb {
			background: rgba(#c2c2c2, 0.3);
			border-radius: 6px;
		}
	}

	.autocomplete-suggestion {
		position: relative;
		display: flex;
		align-items: center;
		padding: 1.5rem 0;
		border-bottom: 1px solid #ebebeb;
		cursor: pointer;

		&:last-child {
			border-bottom: none;
		}
	}

	.search-name {
		color: #666;
		line-height: 1.3;
		word-break: break-word;
		text-transform: none;
		font-weight: 400;
	}

	.search-info:hover .search-name {
		color: var(--rio-primary-color, #27c);
	}

	.search-price {
		display: block;
		margin-top: 5px;
		color: #222;

		del {
			margin-#{$left}: 5px;
			color: #999;
		}

		ins {
			text-decoration: none;
		}
	}

	img {
		max-width: 60px;
		margin-#{$right}: 10px;
	}

	.search-wrapper & .d-loading {
		position: static;
		min-height: 80px;
		background: #fff;
	}

	.autocomplete-suggestion {
		transition: padding-#{$left} .3s;
	}
	.autocomplete-selected {
		padding-#{$left}: 15px;
	}
	.autocomplete-selected .search-name {
		color: var(--rio-primary-color, #27c);
	}
	.autocomplete-selected storng {
		font-weight: 700;
	}
}

.search-wrapper {
	position: relative;

	.input-wrapper {
		display: flex;
		position: relative;
	}

	input.form-control {
		flex: 1;
		min-width: 40px;
		padding: 1.1rem 1.5rem;
		border: 0;
		background-color: #eee;
		font-size: font-size(12px);
		letter-spacing: inherit;
	}

	.btn-search {
		padding: 0;
		min-width: 40px;
		background-color: var(--rio-primary-color, #27c);
		border: 0;
		color: #fff;
		font-size: 1.4rem;

		i {
			display: block;
			margin: 0;
		}
	}

	.select-box {
		background-color: #f4f4f4;
		select {
			position: relative;
			max-width: 100%;
			width: 100%;
			padding: side-values(0 15px 0 20px);
			border: 0;
			font-weight: 600;
			z-index: 1;
		}
	}

	&.hs-toggle {
		.input-wrapper {
			position: absolute;
			#{$right}: -1.5rem;
			top: 100%;
			padding: 1.5rem;
			height: 8rem;
			background-color: #fff;
			box-shadow: 0 3px 35px rgba(0,0,0,0.1);
			visibility: hidden;
			opacity: 0;
			transform: translate3d(0, -10px, 0);
			z-index: 1002;
			transition: transform .4s .2s, visibility .4s .2s, opacity .4s .2s;
			min-width: 54rem;
		}
		.form-control {
			background: #f4f4f4;
			padding: 1.4rem 2rem;
			font-size: font-size(13px);
			color: #666;
		}
		.btn-search {
			background: #f4f4f4;
			min-width: 50px;
			font-size: font-size(1.8rem);
			color: #222;
		}
		.untouchable &:hover,
		&.show {
			.input-wrapper {
				transform: translate3d(0, 0, 0);
				visibility: visible;
				transition: transform .4s;
				opacity: 1;
			}
		}
		&:hover {
			color: var(--rio-primary-color, #27c);
		}
		.search-right + .input-wrapper {
			#{$right}: auto;
		}
	}

	.select-box {
		min-width: 15rem;
	}

	&.hs-expanded {
		width: 54rem;

		max-width: 100%;
		.input-wrapper {
			width: 100%;
			@include css( height, header, search, expanded, height );
			
		}
		.select-box {
			margin-#{$right}: 2px;
			color: #444;
			&,
			select {
				cursor: pointer;
			}
		}
		input.form-control {
			flex: 1;
			color: #ababab;
			background-color: #f4f4f4;
			margin-#{$right}: 2px;
		}
		.btn-search {
			padding-#{$right}: 5px;
			background-color: #f4f4f4;
			color: #444;
			font-size: 1.4rem;
			&:hover {
				color: var(--rio-primary-color, #27c) 
			}
		}
	}

	&.hs-simple {
		width: 54rem;

		max-width: 100%;
		.input-wrapper {
			@include css( height, header, search, simple, height );
		}
		input.form-control {
			padding: side-values(0 4rem 0 2rem);
			border: 1px solid #e1e1e1;
			font-family: inherit;
			background-color: #fff;
			color: #999;
		}
		.btn-search {
			position: absolute;
			background: transparent;
			color: #333;
			min-width: 43px;
			height: 100%;
			top: 0;
			#{$right}: 0;
			&:hover {
				color: var(--rio-primary-color, #27c);
			}
		}
	}

	&.hs-flat {
		input.form-control {
			border-width: 0 0 1px;
			padding-#{$left}: 1rem;
		}
		.btn-search {
			transform: translateX(5px);
		}
	}

	&.rounded {
		.select-box, input {
			border-radius: corner-values(30px 0 0 30px);
		}
		.select-box + input {
			border-radius: 0;
		}
		&.hs-simple input {
			border-radius: 30px;
		}
		button {
			border-radius: corner-values(0 30px 30px 0);
		}
	}

	&.hs-fullscreen {
		&.show {
			.search-form-overlay {
				opacity: 1;
				visibility: visible;
			}
		}
		&.dark-style {
			input.form-control {
				color: #ccc;
			}
			.select-box {
				color: #ccc;
				option {
					color: #222;
				}
				&::after {
					background-color: #666;
				}
			}
			.btn-search {
				color: #eee;
			}
			.search-container {
				background: #444;
				border-color: #333;
			}
			.search-form-wrapper {
				background-color: #444;
			}
			.search-image {
				background-color: #333;
			}
			.search-info {
				color: #ccc;
			}
			.search-price {
				color: #eee;
				del {
					color: #999;
				}
			}
			.search-product {
				&:hover {
					background-color: #444;
				}
			}
			.no-result {
				p {
					color: #ccc;
				}
				i {
					color: #222;
				}
			}
			.scrollable::-webkit-scrollbar {
				background: #333;
			}
			.scrollable::-webkit-scrollbar-thumb {
				background: #222;
			}
		}
		&.rounded {
			form.input-wrapper {
				border-radius: 30px;
			}
		}
		.search-form-wrapper {
			position: relative;
			padding: 40px 30px 0;
			background: #fff;
			border-radius: 5px;
			overflow: hidden;
		}
		.search-form-overlay {
			position: fixed;
			top: 0;
			left: 0;
			right: 0;
			bottom: 0;
			background: rgba(0,0,0,0.8);
			opacity: 0;
			z-index: 4000;
			visibility: hidden;
			transition: opacity .3s, visibility .3s;
		}
		.close-overlay {
			position: absolute;
			left: 0;
			top: 0;
			right: 0;
			bottom: 0;
		}
		.search-form-close {
			position: absolute;
			display: flex;
			#{$right}: 30px;
			top: 30px;
			font-size: 32px;
			cursor: pointer;
			color: #ccc;
			transition: transform .4s;
			&:hover {
				color: #fff;
				transform: rotateZ(180deg) scale(1.2);
			}
		}
		.search-form-overlay {
			padding: 70px 20px 0;
		}
		.input-wrapper {
			max-width: 800px;
			margin-left: auto;
			margin-right: auto;
		}
		input.form-control {
			padding: 15px 20px;
			border: none;
			font-family: inherit;
			font-size: 14px;
			color: #666;
			background: transparent;
		}
		.select-box {
			margin-#{$right}: 2px;
			max-width: 150px;
			border: none;
			font-size: 14px;
			background: transparent;

			&::after {
				content: '';
				position: absolute;
				#{$right}: -3px;
				top: 8px;
				bottom: 8px;
				width: 1px;
				background-color: #e1e1e1;
			}
		}
		.btn-search {
			min-width: 55px;
			font-size: 2rem;
			color: #222;
			background: transparent;
		}
		form.input-wrapper {
			border-radius: 5px;
			border: 2px solid var(--rio-primary-color, #26b);
		}
		.search-container {
			background: #fff;
			padding: 1.8rem 1rem;
			border: 1px solid #e1e1e1;
		}
		.scrollable {
			height: calc( 100vh - 300px );
			padding: 1.2rem 1.2rem 1.2rem 2rem;
			overflow: auto;
		}
		.search-image {
			width: 100%;
			background-color: #f4f4f4;
		}
		.search-info {
			padding: 1rem 0;
			color: #222;
		}
		.search-name {
			text-transform: capitalize;
		}
		.search-price {
			font-size: 16px;
			font-weight: 600;
			color: #222;
			del {
				color: #666;
				font-size: .9em;
				margin-#{$left}: .5rem;
			}
		}
		.search-product {
			margin-top: -1rem;
			margin-bottom: 2rem;
			padding-top: 1rem;
			transition: background-color .3s;
			&:hover {
				box-shadow: 0 0 0 1px var(--rio-primary-color, #26b);
			}
		}
		.d-loading {
			padding-top: 20px;
			flex: 0 0 100%;
			max-width: 100%;
			background: transparent;
			&:first-child {
				padding-top: 150px;
			}
		}
		.no-result {
			padding-top: 15vh;
			max-width: 100%;
			flex: 0 0 100%;
			text-align: center;
			p {
				text-transform: capitalize;
				color: #666;
				font-size: 16px;
			}
			i {
				display: inline-block;
				font-size: 150px;
				color: #ccc;
			}
		}
		.scrollable::-webkit-scrollbar {
			background: #f5f5f5;
			border-radius: 4px;
			width: 8px;
		}
		.scrollable::-webkit-scrollbar-thumb {
			background: #ccc;
		}
	}
}

	.search-toggle {
		position: relative;
		display: inline-block;
		vertical-align: middle;
		@include css( padding, header, search, toggle, padding );
		transition: color .3s;

		span {
			cursor: pointer;
			vertical-align: middle;
		}

		i {
			display: inline-block;
			font-size: 1.4rem;
			font-weight: 400;
			line-height: .9;
			vertical-align: middle;

			&::before {
				margin: 0;
			}
		}
	}

// Sticky Header
.header .sticky-content {
	&.fixed {
		position: fixed;
		top: 0;
		z-index: 1041;
		animation: fixedTop .4s;
		border-bottom: none;
	}
}

// Cart, Compare, Wishlist
.mini-basket-dropdown {
	> a::after {
		content: none;
	}
	.dropdown-box {
		padding: 3rem;
		width: 34rem;
		max-width: 95vw;
	}

	.mini-list {
		max-height: 20rem;
		overflow-x: hidden;
		margin: side-values(0 -5px 0 0);
		padding-#{$left}: 0;
		padding-#{$right}: 5px;
		list-style: none;
		text-transform: capitalize;

		+ .buttons {
			margin-top: 20px;
		}
	}

	.buttons {
		margin-bottom: 0;
		text-align: center;

		.btn {
			display: inline-block;
			letter-spacing: 0;
		}

		.btn-link {
			margin-bottom: 1rem;
			text-transform: capitalize;
			color: #222;
			border-bottom: 2px solid var(--rio-primary-color, #27c);
			line-height: 1.3;

			&:hover {
				color: var(--rio-primary-color, #27c);
			}
		}

		.btn-block {
			font-size: font-size(1.4rem);

			&:hover {
				color: #fff;
			}
		}
	}

	.empty-msg {
		margin: 0;
		line-height: 1;
		font-weight: 600;
		text-align: center;
		font-size: font-size(14px);
	}

	&.offcanvas-type {
		.popup-header {
			display: flex;
			justify-content: space-between;
			align-items: center;
			margin-bottom: 2rem;
			padding-bottom: 1.5rem;
			border-bottom: 1px solid #e1e1e1;
		}
		h3 {
			margin-bottom: 0;
			font-size: font-size(1.6rem);
			font-weight: 700;
			text-transform: uppercase;
		}
		.btn-close {
			font-size: 12px;
			font-weight: 600;
			color: #999;

			&:hover {
				color: var(--rio-primary-color, #27c);
			}
		}
		.dropdown-box {
			position: fixed;
			#{$right}: -34rem;
			height: 110vh;
			min-width: auto;
			opacity: 1;
			visibility: visible;
			transition: #{$right} .6s;
			transform: none;
		}
		div.dropdown-box {
			top: 0;
		}
		&:after {
			content: none;
		}
		.offcanvas-overlay {
			position: fixed;
			#{$left}: 0;
			width: 100vw;
			top: -10vh;
			height: 120vh;
			background: rgba(0,0,0,.3);
			z-index: 9998;
			opacity: 0;
			visibility: hidden;
			transition: opacity .6s, visibility .6s;
		}
		.mini-list {
			max-height: calc(100vh - 18.5rem);
		}
		.dropdown-box i {
			margin-bottom: 0;
		}
		.dropdown-box {
			z-index: 9999;
		}
		.btn-dark {
			color: #fff;
		}
	}
	&.opened {
		.dropdown-box {
			#{$right}: 0;
		}
		.offcanvas-overlay {
			opacity: 1;
			visibility: visible;
		}
	}

	.mini-item-meta a:hover {
		color: var(--rio-primary-color, #27c);
	}

	.mini-item-meta a {
		font-size: font-size(14px);
		color: inherit;
	}

	.d-loading.small i {
		top: calc(50% - 3px);
	}

	.mini-list .mini-item {
		font-size: font-size(13px);
		font-weight: 400;
	}

	.mini-item {
		display: flex;
		position: relative;
		font-size: font-size(14px);

		& + .mini-item {
			margin-top: 2rem;
		}

		&:last-child {
			margin-bottom: 0;
		}

		.mini-item-meta {
			flex: 1;
			margin: side-values(1rem 2.5rem .6rem 0);
			line-height: 1.3;

			a {
				margin-bottom: 1.5rem;
				font-weight: 600;
				letter-spacing: 0;

				@include text-block();
			}

			.variation {
				display: flex;
				align-items: center;
				flex-wrap: wrap;
				margin-top: -12px;
			}

			dt, dd, dd p {
				margin-bottom: 0;
				font-size: 11px;
				font-weight: 400;
				color: #999;
			}
			dd {
				margin-left: 5px;
				margin-right: 5px;
				&:not(:last-child)::after {
					content: ',';
				}
				p {
					display: inline-block;
				}
			}
		}

		.quantity {
			display: flex;
			align-items: center;
			color: #999;
			line-height: 1;
			font-size: font-size(1.4rem);
			height: auto;

			span {
				font-size: font-size(1.6rem);
			}

			.count {
				margin-#{$right}: 1rem;
			}
		}

		.count + .amount {
			margin-#{$left}: 1rem;
		}

		.amount {
			color: #222;
			font-weight: 600;

			&:first-child {
				margin-#{$right}: 5px;
			}

			& + .amount {
				margin-#{$left}: 5px;
			}
		}

		del .amount {
			color: #aaa;
			margin-#{$left}: 5px;
		}

		a {
			padding: 0;
		}

		> a:first-child {
			margin-#{$right}: 1.5rem;
			display: block;
			max-width: 8rem;
			flex: 0 0 8rem;
		}

		> img {
			margin-#{$right}: 1.5rem;
			display: block;
			max-width: 8rem;
			flex: 0 0 8rem;
		}
		img {
			width: 100%;
			object-fit: cover;
		}

		.remove {
			display: flex;
			align-items: center;
			justify-content: center;
			width: 22px;
			height: 22px;
			position: absolute;
			top: 9px;
			#{$right}: -4px;
			z-index: 3;
			background: #fff;
			color: #222;
			font-size: 12px;
			line-height: 12px;
			text-align: center;
			border-radius: 50%;
			border: 1px solid #ccc;
			transition: color .4s, border .4s;

			&:hover {
				color: var(--rio-primary-color, #27c);
				border-color: var(--rio-primary-color, #27c);
			}
		}
	}
}

.cart-offcanvas {
	.mini-item .mini-item-meta {
		margin: 0;
		> a:first-child {
			padding-#{$right}: 20px;
		}
	}
}

// Cart
.cart-dropdown {
	.cart-toggle {
		@include print_css( header, cart, toggle );
		&::after {
			content: none;
		}
	}
	.cart-label {
		display: block;
		cursor: pointer;
		@include print_css( header, cart, label );
		span {
			display: inline-block;
		}
	}
	.cart-name-delimiter {
		margin: side-values(0 5px 0 3px);
	}
	.cart-price {
		@include print_css( header, cart, label, price );
	}
	.cart-label + i,
	.cart-label + .cart-count-wrap {
		margin-#{$left}: 7px;
	}
	.inline-type .cart-name + .cart-price {
		margin-#{$left}: 7px;
	}
	.block-type .cart-name + .cart-price {
		margin-top: 5px;
	}
	.cart-label.block-type {
		display: flex;
		flex-direction: column;
	}
	&.block-type .block-type {
		align-items: center;
	}
	.cart-label.block-type + i {
		margin-bottom: 3px;
	}
	.header & .cart-toggle i {
		margin-top: 3px;
	}
	.minicart-icon {
		@include print_css( header, cart, icon );
	}
	.d-icon-bag {
		position: relative;
	}
	.cart-count {
		display: inline-block;
		@include print_css( header, cart, count );
	}

	.minicart-icon .cart-count {
		transition: color .4s;
	}

	&:hover {
		.minicart-icon {
			@include print_css( header, cart, icon, hover );

			background: var(--rio-primary-color, #27c);

			&::before {
				transform: rotateY(180deg);
			}
		}
		.minicart-icon .cart-count {
			@include print_css( header, cart, count, hover );
		}
	}

	&.badge-type {
		.cart-toggle > i {
			text-align: center;
		}

		.cart-toggle .fa {
			padding-#{$right}: 5px;
			font-size: 1.7em;
			font-family: inherit;

			&::before {
				font-family: var(--fa-style-family-classic,"Font Awesome 6 Free");
			}
		}

		&:hover {
			color: var(--rio-primary-color, #27c);
		}
	}

	&.label-type {
		.cart-count {
			color: inherit;
		}
	}

	.total {
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin-top: 2rem;
		margin-bottom: 2rem;
		border-top: 1px solid #edeef0;
		border-bottom: 1px solid #edeef0;
		font-size: font-size(1.4rem);
		line-height: 3;
		text-transform: capitalize;
		text-align: center;
		color: #222;

		strong {
			margin-#{$left}: 3px;
			font-weight: 400;
			color: #666;
		}

		.amount {
			font-size: font-size(1.6rem);
			font-weight: 700;
		}
	}

	&.block-type {
		.cart-toggle {
			display: flex;
			flex-direction: column-reverse;
		}

		.cart-toggle > i,
		.cart-count-wrap {
			margin-#{$left}: 0;
			margin-bottom: 5px;
		}
	}

	.total-count {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding-bottom: 1.3rem;
		border-bottom: 1px solid #edeef0;
		font-weight: 700;
		font-size: 1.4rem;
		letter-spacing: -.025em;
		line-height: 1;
		color: #222529;
	}

	.pull-right {
		padding: 0;
		color: inherit;

		&:hover,
		&:focus {
			color: inherit;
			text-decoration: underline;
		}
	}

	&.offcanvas-type .mini-list {
		max-height: calc(100vh - 29rem);
	}
}

@include mq(max, 360px) {
	.mini-basket-dropdown .dropdown-box {
		padding: 1.5rem;
		min-width: 28rem;
	}
}

// compare
.compare-dropdown {
	.compare-open::after {
		content: none;
	}
}

.account, .login, .wishlist, .compare-open {
	display: flex;
	align-items: center;
}

.account {
	.delimiter {
		color: #aaa;
		margin: 0 5px;
	}
}

.login,
.wishlist,
.compare-open {
	i + span {
		margin-#{$left}: 9px;
	}

	.badge-type {
		i + span {
			margin-#{$left}: 0;
			margin-top: 10px;
		}
	}

	i {
		position: relative;
	}
}

.login.block-type,
.wishlist.block-type,
.compare-open.block-type {
	flex-direction: column;

	span {
		margin: 0;
	}

	i + span {
		margin: 3px 0 0;
	}
}

.compare-open i {
	font-size: 24px;
}

.header .wish-count,
.header .compare-count,
.cart-dropdown.badge-type .cart-count {
	position: absolute;
	#{$left}: 100%;
	top: 3px;
	width: 1.72em;
	height: 1.72em;
	line-height: 1.63em;
	font-size: 1.1rem;
	border-radius: 50%;
	background-color: var(--rio-primary-color, #27c);
	color:  #fff;
	transform: if-ltr(translate(-50%, -50%), translate(50%, -50%));
	z-index: 1;
	text-align: center;
	white-space: nowrap;
}

.header {
	.account i,
	.wishlist i,
	.compare i,
	.cart-toggle .d-icon-bag {
		font-size: 1.7rem;
	}
}

// Mobile Menu Toggle
	.mobile-menu-toggle {
		.d-icon-bars2 {
			font-size: 2.5rem;
			line-height: 1;
		}
	}

// Welcome message animation.
@include mq(sm, max) {
	.welcome-msg {
		white-space: nowrap;
		transform: translateX(0);
		animation: 6s linear 2s 1 show_msg_first, 12s linear 8s infinite show_msg;
	}
}
@keyframes show_msg_first { 
	from { transform: translateX(0%); }
	to { transform: translateX(-100%); }
}
@keyframes show_msg { 
	from { transform: translateX(100%); }
	to { transform: translateX(-100%); }
}

// Language Switcher, Currency Switcher
.menu.switcher {
	a {
		white-space: nowrap;
	}

	i, img {
		margin-#{$right}: .7rem;
	}

	img {
		max-width: 14px;
		margin-top: -2px;
		vertical-align: middle;
	}

	li.active > a,
	li:hover > a {
		color: var(--rio-primary-color, #27c);
	}

	&:hover > a,
	> li.active > a,
	> li:hover > a {
		color: var(--rio-header-link-active-color, var(--rio-primary-color, #27c));
	}

	li a {
		padding: 6px 10px;
		line-height: 1.1;
	}

	> li > a {
		padding: 9px 0;

		&::after {
			margin-bottom: 1.5px;
		}
	}

	ul {
		#{$left}: auto;
		#{$right}: 0;
		min-width: 0;
		padding: 5px 0;

		li {
			padding: 0;
		}

		a {
			color: #666;
			font-weight: 400;
		}
	}
}
// Dropdown Account 
.account-dropdown {
	a {
		line-height: 1.2;
	}
	.menu {
		> ul > li > a {
			padding: 6px 10px;
			border: 0;
		}

		ul {
			padding: 0;
		}
	}
	.dropdown-box ul.menu {
		> li {
			padding: 0;
		}
		> li > a {
			padding: 6px 10px;
		}
	}
	a.block-type:after {
		display: none;
	}
}
.account-avatar {
	width: 40px;
	height: 40px;
	background: #ebebeb;
	border-radius: 50%;
	overflow: hidden;
	margin-#{$right}: 1rem;
}
// Absolute Header
.absolute-header {
	position: absolute;
	width: 100%;
	#{$left}: 0;
	top: 0;
	z-index: 1040;
}

/* Responsive */
@include mq(lg, max) {
	.header {
		.wishlist, .compare-open, .cart-dropdown .cart-toggle {
			> span {
				display: none;
			}
		}

		.wishlist, .compare-open {
			i {
				margin-bottom: 0;
			}
		}

		.cart-dropdown.block-type .cart-toggle i {
			margin-bottom: 0;
		}
	}

	.sticky-wrapper {
		height: auto !important;
	}

	body .dropdown.mobile-links {
		li {
			margin-#{$right}: 0;

			> a {
				display: block;
				padding: .6rem 1rem;
			}
		}

		.menu {
			display: block;
		}

		li:hover > a {
			color: var(--rio-primary-color, #27c);
		}
	}

	.d-show-desk {
		display: none !important;
	}

	.has-mob-center {
		.header-left,
		.header-right {
			flex: 1;
		}
	}

	.header .search-toggle {
		i {
			font-size: 2rem;
		}
	}
}

// Responsive Links Group
@include mq(lg) {
	.dropdown.mobile-links {
		&::after {
			content: none;
		}
		> a {
			display: none;
		}
		.dropdown-box {
			position: static;
			visibility: visible;
			opacity: 1;
			background-color: transparent;
			box-shadow: none;
			border: 0;
			padding: 9px 0;
			transform: none;
			color: inherit;

			> li {
				margin-#{$right}: 1.95rem;
				&:last-child {
					margin-#{$right}: 0;
				}
			}

			a {
				padding: 0;
			}
		}
	}

	.d-show-mob {
		display: none !important;
	}
}

@include mq(lg, max) {
	.dropdown.mobile-links {
		display: inline-block;
	}
	.mobile-links .dp-left {
		#{$left}: 0;
		#{$right}: auto;
	}
}

.custom-header {
	position: relative;
}

// Reading Progress Bar
.rpb-wrapper {
	position: fixed;
	#{$left}: 0;
	top: 0;
	width: 100vw;
	height: 5px;
	z-index: 99999;
	.rpb {
		position: absolute;
		#{$left}: 0;
		height: 5px;
		background: var(--rio-primary-color, #26b);
	}
}