/* ══════════════════════════════════════════════════════════════
   HEADER — modern / premium görünüm (yalnızca stil)
   views/v1/header.php'deki HTML ve özellikler değişmedi; bu dosya
   eski stillerin üzerine yazar. Eski görünüme dönmek için header.php'deki
   "header-premium.css" satırını silmek yeterli.
   ══════════════════════════════════════════════════════════════ */

:root {
	--hp-gece: #1d0018;
	--hp-mor: #36002c;
	--hp-mor2: #5e1c52;
	--hp-vurgu: #ff0061;
	--hp-yazi: #2a0a24;
	--hp-soluk: #8c7a87;
	--hp-cizgi: #eee3ea;
	--hp-zemin: #f8f4f7;
}

/* ─── Üst şerit ─── */
header .header-top.bg-1 {
	/* Üst şeridin açılır panelleri ve fare köprüsü alttaki menü şeridinin (z-index 50) üstünde kalsın */
	position: relative; z-index: 60;
	background: linear-gradient(100deg, var(--hp-gece) 0%, var(--hp-mor) 55%, #4a0a3d 100%);
	border-bottom: 1px solid rgba(255,255,255,.06);
}
header .header-top > .container > .row { display: flex; align-items: center; min-height: 56px; }
header .header-top > .container > .row > [class*="col-"] { float: none; }
header .header-top > .container > .row > .col-md-7 { margin-left: auto; }

header .header-top-menu { margin: 0; }
header .header-top-menu ul { margin: 0; padding: 0; }
header .header-top-menu ul li { margin: 0; }
header .header-top-menu ul li a {
	display: inline-flex; align-items: center; gap: 8px;
	font-size: 13px; font-weight: 500; letter-spacing: .1px;
	color: #d9c3d2; text-transform: none; cursor: default;
}
header .header-top-menu ul li a:hover { color: #d9c3d2; text-decoration: none; }
header .header-top-menu ul li a i { color: var(--hp-vurgu); font-size: 15px; }

header .header-top-right.text-right { margin: 0; }
header .header-top-right > ul { display: flex; align-items: center; justify-content: flex-end; gap: 6px; margin: 0; padding: 0; }
header .header-top-right > ul > li { margin: 0 !important; display: flex; align-items: center; }

/* Simge düğmeleri */
header .header-top-right > ul > li > a {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	min-width: 38px; height: 38px; padding: 0 10px;
	border-radius: 11px; color: #f3e6ef; text-decoration: none;
	transition: background .18s ease, color .18s ease;
}
header .header-top-right > ul > li > a i {
	color: #cdb3c5; font-size: 16px; line-height: 1; transition: color .18s ease;
}
header .header-top-right > ul > li:hover > a,
header .header-top-right > ul > li > a:focus-visible { background: rgba(255,255,255,.09); }
header .header-top-right > ul > li:hover > a i { color: #fff; }
header .header-top-right > ul > li > a:focus-visible { outline: 2px solid var(--hp-vurgu); outline-offset: 1px; }
header .header-top-right > ul > li > a span.hidden-xs { color: #f3e6ef !important; font-weight: 600 !important; font-size: 13px; }

/* Sayı rozetleri */
header .header-top-right ul li a span.number,
header .header-top-right ul li a span.label-warning {
	top: 2px; right: 0; width: auto; min-width: 18px; height: 18px; padding: 0 5px;
	border: 2px solid var(--hp-mor); border-radius: 10px;
	background: var(--hp-vurgu); color: #fff;
	font-size: 10px; font-weight: 800; line-height: 14px; text-align: center;
}
header .header-top-right ul li.ilkk { margin-right: 0 !important; }

/* Profil: avatar + ad + bakiye */
header .header-top-right > ul > li > a .header-foto {
	width: 30px; height: 30px; margin: 0; border-radius: 50%; object-fit: cover;
	box-shadow: 0 0 0 2px rgba(255,255,255,.18);
}
header .header-top-right > ul > li > a[href$="profile"] {
	padding: 0 6px 0 4px; gap: 9px; font-size: 13.5px; font-weight: 700; color: #fff;
	background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1);
}
header .header-top-right > ul > li > a[href$="profile"] > span {
	display: inline-flex; align-items: center; gap: 4px;
	padding: 3px 9px; border-radius: 8px;
	background: rgba(255,0,97,.16); color: #ff7fae; font-size: 12.5px; font-weight: 800;
}
header .header-top-right > ul > li > a[href$="profile"] > span i { color: #ff7fae; font-size: 11px; }
header .header-top-right > ul > li > i.fa-angle-down { color: #b896ad; margin-left: 6px; font-size: 15px; }

/* Giriş yapmamış: Giriş / Kayıt düğmeleri */
header .header-top-right > ul > li > a[href$="login"],
header .header-top-right > ul > li > a[href$="register"] {
	height: 36px; padding: 0 14px; font-size: 13px; font-weight: 700;
}
header .header-top-right > ul > li > a[href$="login"] { border: 1px solid rgba(255,255,255,.22); color: #fff; }
header .header-top-right > ul > li > a[href$="register"] { background: var(--hp-vurgu); color: #fff; }
header .header-top-right > ul > li > a[href$="register"]:hover,
header .header-top-right > ul > li:hover > a[href$="register"] { background: #d90052; }
header .header-top-right > ul > li > a[href$="login"] i,
header .header-top-right > ul > li > a[href$="register"] i { color: #fff; font-size: 14px; }

/* ─── Açılır paneller (sepet, mesajlar, bildirimler, profil) ─── */
header .header-top-right ul li > ul {
	top: calc(100% + 18px);
	border: 1px solid var(--hp-cizgi);
	border-radius: 16px;
	box-shadow: 0 22px 50px -12px rgba(29,0,24,.32);
	transition: opacity .18s ease, top .18s ease, visibility .18s;
}
header .header-top-right ul li:hover > ul { top: calc(100% + 10px); }
header .header-top-right ul li > ul.profile { margin-top: 0 !important; }
header .header-top-right ul li > ul::after { display: none; }
/* Paneller ile düğme arasındaki boşlukta fare kaçmasın */
header .header-top-right > ul > li:hover::after {
	content: ""; position: absolute; left: -10px; right: -10px; top: 100%; height: 22px;
}
/* Profil menüsü tüm satırları sığdırır, kaydırma çubuğu çıkmaz */
header .header-top-right ul li > ul.profile { max-height: none !important; overflow: visible !important; }
header .header-top-right ul li > ul.cart { padding: 8px 0 0; width: 300px; }
header .header-top-right ul li > ul.cart li { padding: 10px 16px; border-color: #f4edf2; }
header .header-top-right ul li > ul.cart li .item-content.cat-content { margin-left: 0; }
header .header-top-right ul li > ul.cart li .item-content a { font-size: 13.5px; color: var(--hp-yazi); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
header .header-top-right ul li > ul.cart li .item-content.cat-content p { margin: 2px 0 0; font-weight: 700; font-size: 13px; }
header .header-top-right ul li > ul.cart li:last-child { padding: 12px 16px 14px; background: var(--hp-zemin); }
header .header-top-right ul li > ul.cart li button {
	height: 42px; line-height: 38px; margin: 10px 0 0; border-radius: 10px; border: 0;
	background: var(--hp-vurgu); font-size: 13.5px;
}
header .header-top-right ul li > ul.cart li button:hover { background: var(--hp-mor); }

/* ─── Alt şerit: logo + ana menü ─── */
header .header-bottom {
	background: #fff;
	border-bottom: 1px solid var(--hp-cizgi);
	box-shadow: 0 8px 24px -18px rgba(54,0,44,.35);
	position: relative; z-index: 50;
}
header .header-bottom > .container > .row { display: flex; align-items: center; min-height: 76px; }
header .header-bottom > .container > .row > [class*="col-"] { float: none; }
header .header-bottom .logo { padding: 10px 0; }
header .header-bottom .logo img { height: auto; max-height: 50px; width: auto; }

header .mainmenu nav > ul#navigation { display: flex; justify-content: flex-end; align-items: center; gap: 2px; margin: 0; padding: 0; }
header #navigation > li { display: block; }
header #navigation > li > a {
	display: inline-flex; align-items: center; gap: 7px;
	padding: 10px 13px; border-radius: 11px;
	font-family: inherit; font-size: 14.5px; font-weight: 700; letter-spacing: -.1px;
	text-transform: none; color: var(--hp-yazi);
	transition: background .16s ease, color .16s ease;
}
header #navigation > li:last-child > a { padding-right: 13px; }
header #navigation > li > a i { color: #c9a9bf; font-size: 13px; transition: color .16s ease; }
header #navigation > li.active > a { color: var(--hp-yazi); }
header #navigation > li:hover > a,
header #navigation > li > a:focus-visible { background: var(--hp-zemin); color: var(--hp-mor); }
header #navigation > li:hover > a i { color: var(--hp-vurgu); }
header #navigation > li > a:focus-visible { outline: 2px solid var(--hp-vurgu); outline-offset: 1px; }
/* "Tanıtım Yazısı" ana ürün: hafif vurgu + açılır ok */
header #navigation > li.bc-mega-li > a { background: var(--hp-zemin); color: var(--hp-mor); }
header #navigation > li.bc-mega-li > a:after {
	content: "\f107"; font-family: FontAwesome; font-weight: normal; font-size: 14px; color: var(--hp-soluk); margin-left: 2px;
}
header #navigation > li.bc-mega-li > a i { color: var(--hp-vurgu); }

/* Açılır menü: üçgen yerine yumuşak açılış */
header .mainmenu ul li > ul { top: calc(100% + 16px); }
header .mainmenu ul li:hover > ul { top: calc(100% + 6px); }
header .mainmenu ul li > ul::before,
header .mainmenu ul li > ul::after { display: none; }
header #navigation > li.bc-mega-li:hover::after {
	content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 12px;
}

/* ─── Mobil menü düğmesi ─── */
header .responsive-menu-wrap .slicknav_btn {
	display: inline-flex; align-items: center; justify-content: center;
	width: 44px; height: 44px; padding: 0; margin: 0;
	border-radius: 12px; background: var(--hp-zemin);
}
header .responsive-menu-wrap .slicknav_menu .slicknav_icon { display: flex; flex-direction: column; gap: 5px; width: auto; height: auto; }
header .responsive-menu-wrap .slicknav_menu .slicknav_icon-bar { width: 20px; height: 2px; margin: 0 !important; border-radius: 2px; background: var(--hp-mor); }
header .responsive-menu-wrap.floatright { display: flex; justify-content: flex-end; }
header .responsive-menu-wrap .slicknav_menu { position: static; }
header .responsive-menu-wrap .slicknav_nav { top: calc(100% + 4px); }

/* Mobil yapışkan mini şerit: marka rengine */
.bc-mini { background: linear-gradient(100deg, var(--hp-gece) 0%, var(--hp-mor) 100%) !important; }
.bc-mini__btn { border-radius: 10px !important; }
.bc-mini__btn--cta { background: var(--hp-vurgu) !important; }

/* ─── Arama katmanı ─── */
body #headersearch {
	background: rgba(29,0,24,.86);
	-webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
	transform: translateY(-12px); visibility: hidden;
	transition: opacity .2s ease, transform .2s ease, visibility .2s;
}
body #headersearch.open { transform: none; visibility: visible; }
body #headersearch #formheader {
	position: absolute; top: 28vh; left: 50%; transform: translateX(-50%);
	width: min(720px, calc(100% - 32px));
	display: flex; gap: 10px; padding: 10px;
	background: #fff; border-radius: 20px; box-shadow: 0 30px 70px -20px rgba(0,0,0,.6);
}
body #headersearch #formheader input[type="search"] {
	position: static; flex: 1; min-width: 0; margin: 0; height: 56px;
	padding: 0 18px; border-radius: 14px; background: var(--hp-zemin);
	color: var(--hp-yazi); font-size: 17px; font-weight: 500; text-align: left;
}
body #headersearch #formheader input[type="search"]::placeholder { color: #a8949f; }
body #headersearch #formheader input[type="search"]:focus { box-shadow: inset 0 0 0 2px var(--hp-vurgu); }
body #headersearch #formheader .btn {
	position: static; margin: 0; height: 56px; padding: 0 24px; border: 0; border-radius: 14px;
	background: var(--hp-vurgu); font-size: 15px; font-weight: 700;
}
body #headersearch #formheader .btn:hover { background: #d90052; }
body #headersearch .close {
	top: 22px; right: 22px; width: 46px; height: 46px; padding: 0; border: 0; border-radius: 50%;
	background: rgba(255,255,255,.12); color: #fff; font-size: 26px; line-height: 46px; text-shadow: none;
}
body #headersearch .close:hover { background: var(--hp-vurgu); }

/* ─── Duyarlı ─── */
@media (max-width: 1199px) {
	header #navigation > li > a { padding: 9px 9px; font-size: 13.5px; gap: 6px; }
	header #navigation > li > a i { display: none; }
}
@media (max-width: 991px) {
	header .header-bottom > .container > .row { min-height: 68px; }
}
@media (max-width: 767px) {
	header .header-top > .container > .row { min-height: 52px; }
	header .header-top > .container > .row > .col-md-7 { width: 100%; }
	header .header-top-right > ul { gap: 2px; justify-content: space-between; }
	header .header-top-right > ul > li > a { min-width: 36px; height: 36px; padding: 0 8px; }
	header .header-top-right > ul > li > a[href$="profile"] { font-size: 12.5px; }
	header .header-top-right > ul > li > a .header-foto { width: 26px; height: 26px; }
	header .header-bottom .logo img { max-height: 42px; }
	body #headersearch #formheader { top: 18vh; flex-direction: column; }
	body #headersearch #formheader .btn { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
	header *, body #headersearch { transition: none !important; }
}