/**
 * Header top menu styles.
 *
 * Location: /assets/css/frontend/header/parts/top-menu.css
 * Purpose: Styles the header top-right WordPress menu and professional transparent black icon classes created by Demo Import.
 *
 * @package SunTechPortal
 */

.stp-header-top-menu,
.stp-header-top-menu__list {
	display: flex;
	align-items: center;
	gap: 12px;
	min-width: 0;
	margin: 0;
	padding: 0;
	list-style: none;
}

.stp-header-top-menu__list li {
	margin: 0;
	padding: 0;
}

.stp-header-top-menu a {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	min-height: 28px;
	padding: 3px 2px;
	color: #111827;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: -0.01em;
	text-decoration: none;
	transition: color 160ms ease, opacity 160ms ease, transform 160ms ease;
}

.stp-header-top-menu a:hover,
.stp-header-top-menu a:focus {
	color: #000000;
	background: transparent;
	text-decoration: none;
	transform: translateY(-1px);
}

.stp-header-top-menu--right .stp-header-top-menu__list {
	justify-content: flex-end;
}

.stp-header-top-menu__list .stp-menu-icon > a::before,
.stp-header-top-menu__list li[class*="stp-menu-icon-"] > a::before {
	content: "";
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 16px;
	height: 16px;
	border-radius: 0;
	background-color: transparent;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 16px 16px;
	box-shadow: none;
	flex: 0 0 16px;
	transition: opacity 160ms ease, transform 160ms ease;
}

.stp-header-top-menu__list .stp-menu-icon > a:hover::before,
.stp-header-top-menu__list li[class*="stp-menu-icon-"] > a:hover::before,
.stp-header-top-menu__list .stp-menu-icon > a:focus::before,
.stp-header-top-menu__list li[class*="stp-menu-icon-"] > a:focus::before {
	background-color: transparent;
	box-shadow: none;
	opacity: 0.78;
	transform: scale(1.04);
}

.stp-header-top-menu__list .stp-menu-icon-location > a::before {
	background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 21s7-5.1 7-11a7 7 0 1 0-14 0c0 5.9 7 11 7 11Z' stroke='%23111827' stroke-width='2' stroke-linejoin='round'/%3E%3Ccircle cx='12' cy='10' r='2.6' stroke='%23111827' stroke-width='2'/%3E%3C/svg%3E");
}

.stp-header-top-menu__list .stp-menu-icon-dealers > a::before {
	background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 10h16l-1.5-5h-13L4 10Z' stroke='%23111827' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='M6 10v9h12v-9M9 19v-5h6v5' stroke='%23111827' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M4 10c.4 1.4 1.5 2 2.7 2 1.2 0 2-.6 2.6-2 .6 1.4 1.5 2 2.7 2s2.1-.6 2.7-2c.6 1.4 1.4 2 2.6 2 1.2 0 2.3-.6 2.7-2' stroke='%23111827' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
}

.stp-header-top-menu__list .stp-menu-icon-help > a::before {
	background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.5 13.5v-2a7.5 7.5 0 0 1 15 0v2' stroke='%23111827' stroke-width='2' stroke-linecap='round'/%3E%3Cpath d='M7 13h2v5H7a2 2 0 0 1-2-2v-1a2 2 0 0 1 2-2ZM15 13h2a2 2 0 0 1 2 2v1a2 2 0 0 1-2 2h-2v-5Z' stroke='%23111827' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='M15 20h-3' stroke='%23111827' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
}

.stp-header-top-menu__list .stp-menu-icon-privacy > a::before {
	background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 3 5.5 5.5v5.4c0 4.3 2.7 7.9 6.5 9.1 3.8-1.2 6.5-4.8 6.5-9.1V5.5L12 3Z' stroke='%23111827' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='m9 12 2 2 4-4' stroke='%23111827' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

@media (max-width: 782px) {
	.stp-header-top-menu,
	.stp-header-top-menu__list {
		gap: 8px;
		flex-wrap: wrap;
	}

	.stp-header-top-menu a {
		font-size: 11px;
	}
}