/* ==========================================================================
   Armas - Menü ve header iyileştirmeleri
   Tema dosyalarının (style.css / responsive.css) üzerine en son yüklenir.
   ========================================================================== */

:root{
	--armas-navy: #001c51;
	--armas-navy-dark: #00133a;
	--armas-blue: #0082c9;
	--armas-sky: #3abaff;
	--armas-soft: #f3f5f9;
	--armas-tint: #eaf5fc;
	--armas-text: #1d2b4a;
	--armas-radius: 10px;
	--armas-shadow: 0 18px 40px -12px rgba(0, 28, 81, .28), 0 4px 12px -4px rgba(0, 28, 81, .12);
	--armas-ease: cubic-bezier(.22, .61, .36, 1);
}

@keyframes armasDrop{
	from{ opacity: 0; transform: translateY(8px); }
	to  { opacity: 1; transform: translateY(0); }
}

/* --------------------------------------------------------------------------
   Dil seçici
   -------------------------------------------------------------------------- */
.header-top-two .change-location .location > a{
	border-radius: 20px;
	border-color: #c9d1de;
	color: #5b6b86 !important;
	padding-left: 14px;
	padding-right: 14px;
	transition: border-color 200ms ease, color 200ms ease, background-color 200ms ease;
}

.header-top-two .change-location .location > a:hover,
.header-top-two .change-location .location.show > a{
	border-color: var(--armas-blue);
	color: var(--armas-blue) !important;
	background-color: #fff;
}

.header-top-two .change-location .location > a:focus{
	box-shadow: 0 0 0 3px rgba(0, 130, 201, .15);
}

.header-top-two .change-location .location > a .fa-angle-down{
	transition: transform 200ms var(--armas-ease);
}

.header-top-two .change-location .location.show > a .fa-angle-down{
	transform: rotate(180deg);
}

.header-top-two .change-location .location .dropdown-menu{
	margin-top: 6px;
	padding: 6px;
	width: 120px !important;
	border: none;
	border-radius: var(--armas-radius);
	background-color: #fff;
	box-shadow: var(--armas-shadow);
	z-index: 1001;
}

.header-top-two .change-location .location .dropdown-menu.show{
	animation: armasDrop 220ms var(--armas-ease);
}

.header-top-two .change-location .location .dropdown-menu > li{
	border-bottom: none;
}

.header-top-two .change-location .location .dropdown-menu > li > a{
	padding: 7px 12px !important;
	border-radius: 6px;
	color: var(--armas-text);
	font-size: 14px;
	font-weight: 500;
	letter-spacing: .5px;
	transition: background-color 150ms ease, color 150ms ease;
}

.header-top-two .change-location .location .dropdown-menu > li > a:hover{
	color: var(--armas-blue);
	background: var(--armas-tint);
}

/* --------------------------------------------------------------------------
   Masaüstü menü
   -------------------------------------------------------------------------- */
@media only screen and (min-width: 768px){

	/* Ayırıcılar ve alt menüsü olan başlıklarda ok */
	.header-style-two .header-lower .main-menu .navigation > li{
		border-right-style: solid;
		border-right-color: rgba(255, 255, 255, .08);
	}

	.main-menu .navigation > li.dropdown > a::after{
		content: "\f107";
		font-family: "Font Awesome 5 Free";
		font-weight: 900;
		display: inline-block;
		margin-left: 8px;
		font-size: 13px;
		opacity: .6;
		transition: transform 250ms var(--armas-ease), opacity 250ms ease;
	}

	.main-menu .navigation > li.dropdown:hover > a::after{
		transform: rotate(180deg);
		opacity: 1;
	}

	/* Açılır menü : yumuşak açılma, köşeler, gölge */
	.main-menu .navigation > li > ul{
		padding: 8px;
		border-radius: 0 0 var(--armas-radius) var(--armas-radius);
		border-top: 3px solid var(--armas-blue);
		box-shadow: var(--armas-shadow);
		transform: translateY(12px);
		transition: opacity 250ms var(--armas-ease), transform 250ms var(--armas-ease), visibility 250ms;
	}

	.main-menu .navigation > li.dropdown:hover > ul{
		transform: translateY(0);
	}

	.main-menu .navigation > li:not(.megadrop) > ul > li{
		border-bottom: none;
	}

	.main-menu .navigation > li:not(.megadrop) > ul > li > a{
		padding: 10px 16px 10px 16px;
		border-radius: 6px;
		color: var(--armas-text);
		transition: background-color 200ms ease, color 200ms ease, padding 200ms var(--armas-ease);
	}

	.main-menu .navigation > li:not(.megadrop) > ul > li > a::before{
		content: "\f105";
		font-family: "Font Awesome 5 Free";
		font-weight: 900;
		position: absolute;
		left: 14px;
		top: 50%;
		transform: translate(-6px, -50%);
		opacity: 0;
		color: var(--armas-blue);
		transition: opacity 200ms ease, transform 200ms var(--armas-ease);
	}

	.main-menu .navigation > li:not(.megadrop) > ul > li:hover > a{
		padding-left: 30px;
		color: var(--armas-blue);
		background-color: var(--armas-tint);
	}

	.main-menu .navigation > li:not(.megadrop) > ul > li:hover > a::before{
		opacity: 1;
		transform: translate(0, -50%);
	}

	/* Ürünler mega menü : menü çubuğu genişliğinde, ürün kartları yan yana */
	.header-style-two .header-lower .main-menu,
	.header-style-two .header-lower .main-menu .navigation,
	.header-style-two .header-lower .main-menu .navigation > li.megadrop,
	.sticky-header .pull-right,
	.sticky-header .main-menu,
	.sticky-header .main-menu .navigation,
	.sticky-header .main-menu .navigation > li.megadrop{
		position: static;
	}

	.sticky-header .auto-container{
		position: relative;
	}

	.main-menu .navigation > li.megadrop > ul,
	.main-menu .navigation > li.megadrop > ul.onepro,
	.sticky-header.animated.slideInDown .megadrop ul{
		left: 0 !important;
		right: 0 !important;
		width: auto !important;
		margin-left: 0 !important;
		padding: 24px;
		display: grid !important;
		grid-template-columns: repeat(auto-fit, minmax(220px, 320px));
		justify-content: center;
		gap: 20px;
	}

	.sticky-header .main-menu .navigation > li.megadrop > ul{
		left: 15px !important;
		right: 15px !important;
	}

	.main-menu .navigation > li.megadrop > ul > li,
	.main-menu .navigation > li.megadrop > ul.onepro > li{
		width: auto !important;
		float: none;
		border: 1px solid #e6ebf2 !important;
		border-radius: var(--armas-radius);
		overflow: hidden;
		background: #fff;
		transition: transform 300ms var(--armas-ease), box-shadow 300ms var(--armas-ease), border-color 300ms ease;
	}

	.main-menu .navigation > li.megadrop > ul > li:hover{
		transform: translateY(-4px);
		border-color: transparent !important;
		box-shadow: 0 14px 28px -10px rgba(0, 28, 81, .3);
	}

	.main-menu .navigation > li.megadrop > ul > li > a{
		padding: 0;
		background: transparent !important;
	}

	.main-menu .navigation > li.megadrop > ul > li > a.primg{
		display: flex;
		align-items: center;
		justify-content: center;
		height: 170px;
		padding: 14px;
		background: var(--armas-soft) !important;
		overflow: hidden;
	}

	.main-menu .navigation > li.megadrop > ul > li > a.primg img{
		width: 100% !important;
		height: 100% !important;
		object-fit: contain;
		mix-blend-mode: multiply;
		transition: transform 400ms var(--armas-ease);
	}

	.main-menu .navigation > li.megadrop > ul > li:hover > a.primg img{
		transform: scale(1.06);
	}

	.main-menu .navigation > li.megadrop > ul > li > a.aurl{
		position: relative;
		padding: 14px 40px 14px 16px !important;
		text-align: left !important;
		font-size: 15px;
		font-weight: 600;
		line-height: 22px;
		color: var(--armas-text);
		border-top: 1px solid #eef1f6;
		transition: color 200ms ease;
	}

	.main-menu .navigation > li.megadrop > ul > li > a.aurl::after{
		content: "\f061";
		font-family: "Font Awesome 5 Free";
		font-weight: 900;
		position: absolute;
		right: 16px;
		top: 50%;
		font-size: 12px;
		color: var(--armas-blue);
		transform: translate(-6px, -50%);
		opacity: 0;
		transition: opacity 250ms ease, transform 250ms var(--armas-ease);
	}

	.main-menu .navigation > li.megadrop > ul > li:hover > a.aurl{
		color: var(--armas-blue) !important;
	}

	.main-menu .navigation > li.megadrop > ul > li:hover > a.aurl::after{
		opacity: 1;
		transform: translate(0, -50%);
	}

	/* İletişim butonu */
	.header-style-two .outer-box .btn-box .theme-btn{
		transition: background-color 250ms ease;
	}
}

/* İletişim butonu 1024px altında gizlendiği için menüde ayrı bağlantı olarak gösterilir */
.main-menu .navigation > li.nav-contact{
	display: none;
}

@media only screen and (max-width: 1023px){
	.header-lower .main-menu .navigation > li.nav-contact{
		display: block;
	}
}

/* --------------------------------------------------------------------------
   Mobil menü
   -------------------------------------------------------------------------- */
@media only screen and (max-width: 767px){

	.main-menu .navbar-collapse > .navigation{
		margin-bottom: 16px;
		border-radius: var(--armas-radius);
		overflow: hidden;
		background: var(--armas-navy-dark);
	}

	.main-menu .navbar-collapse > .navigation > li,
	.main-menu .navbar-collapse > .navigation > li > ul > li{
		border-bottom: 1px solid rgba(255, 255, 255, .07) !important;
	}

	.main-menu .navbar-collapse > .navigation > li > ul{
		border-top: 1px solid rgba(255, 255, 255, .07) !important;
	}

	.main-menu .navbar-collapse > .navigation > li > a,
	.main-menu .navbar-collapse > .navigation > li > ul > li > a{
		padding: 14px 20px !important;
		background: transparent !important;
		letter-spacing: .3px;
		transition: background-color 200ms ease, color 200ms ease;
	}

	.main-menu .navbar-collapse > .navigation > li.current > a{
		color: var(--armas-sky) !important;
		box-shadow: inset 3px 0 0 var(--armas-sky);
	}

	.main-menu .navbar-collapse > .navigation > li > ul,
	.main-menu .navbar-collapse > .navigation > li > ul > li > a{
		background: rgba(0, 0, 0, .18) !important;
	}

	.main-menu .navbar-collapse > .navigation > li > ul > li > a{
		padding-left: 36px !important;
		font-weight: 500;
		color: rgba(255, 255, 255, .85);
	}

	.main-menu .navbar-collapse > .navigation > li > ul > li:hover > a{
		color: var(--armas-sky) !important;
	}

	.main-menu .navbar-collapse > .navigation li.dropdown .dropdown-btn{
		top: 7px;
		right: 8px;
		width: 36px;
		height: 36px;
		border: none;
		border-radius: 50%;
		line-height: 36px;
		background: rgba(255, 255, 255, .08);
		transition: background-color 200ms ease, transform 300ms var(--armas-ease);
	}

	.main-menu .navbar-collapse > .navigation li.dropdown .dropdown-btn.open{
		transform: rotate(180deg);
		background: var(--armas-blue);
	}

	/* Hamburger buton */
	.header-style-two .navbar-toggler{
		border-radius: 8px;
		transition: background-color 200ms ease;
	}

	.header-style-two .navbar-toggler:focus{
		outline: none;
		background: rgba(255, 255, 255, .08);
	}
}

/* --------------------------------------------------------------------------
   Mobil header : iletişim kutuları gizli, küçük logo solda, menü butonu sağda tek satır
   -------------------------------------------------------------------------- */
@media only screen and (max-width: 767px){

	.main-header.header-style-two{
		background: #fff;
	}

	.header-style-two .header-upper{
		display: flow-root; /* logonun float'u alttaki menü satırını itmesin */
		position: relative;
		z-index: 2;
		border-bottom: 1px solid #e9edf3;
	}

	.header-style-two .header-upper .info-outer{
		display: none;
	}

	.header-style-two .header-upper .logo-outer{
		width: auto;
		float: left;
		text-align: left;
		padding: 0;
	}

	.header-style-two .header-upper .logo-outer .logo{
		padding: 14px 0;
	}

	.header-style-two .header-upper .logo-outer .logo img{
		display: block;
		height: 38px;
		width: auto;
	}

	/* Menü çubuğu logonun satırına taşınır; sadece buton ve açılan menü tıklanabilir */
	.header-style-two .header-lower{
		margin-top: -67px;
		z-index: 3;
		pointer-events: none;
	}

	.header-style-two .header-lower .outer-container,
	.header-style-two .header-lower .nav-outer{
		background: transparent !important;
		padding-left: 0;
		padding-right: 0;
	}

	.header-style-two .header-lower .navbar-toggler,
	.header-style-two .header-lower .navbar-collapse{
		pointer-events: auto;
	}

	.header-style-two .header-lower .main-menu .navbar-header{
		padding: 13px 0;
	}

	.header-style-two .header-lower .navbar-toggler{
		width: 42px;
		height: 42px;
		padding: 0;
		border-radius: 10px;
		background: var(--armas-navy);
		box-shadow: 0 6px 14px -6px rgba(0, 28, 81, .5);
	}

	.header-style-two .header-lower .navbar-toggler .icon{
		font-size: 20px;
		line-height: 42px;
		color: #fff;
	}

	.header-style-two .header-lower .navbar-toggler[aria-expanded="true"]{
		background: var(--armas-blue);
	}

	.header-style-two .header-lower .main-menu .collapse,
	.header-style-two .header-lower .main-menu .collapsing{
		padding-top: 10px;
	}
}

@media (prefers-reduced-motion: reduce){
	.main-menu .navigation > li > ul,
	.main-menu .navigation > li.megadrop > ul > li,
	.main-menu .navigation > li.megadrop > ul > li > a.primg img,
	.header-top-two .change-location .location .dropdown-menu.show{
		transition: none !important;
		animation: none !important;
	}
}
