/* =================================================================
   DB LINE üst kısım v2 (2026-11-06 gece; kullanıcı "header çok eksik"):
   siyah bilgi şeridi · ana satır (logo, geniş arama, Favoriler, Hesabım, Sepetim) · menü satırı.
   Telefonda: kayan duyuru · menü, logo, arama, sepet · kaydırılabilir renk çipleri. imza.css'ten sonra yüklenir.
   ================================================================= */
.ust { position: sticky; top: 0; z-index: 60; background: #fff; transition: box-shadow .3s; }
.ust.is-kaydi { box-shadow: 0 14px 30px -24px rgba(20, 16, 17, .6); }

/* Siyah bilgi şeridi (masaüstü) */
.ust__bilgi { background: var(--ink); color: #fff; font-size: .86rem; font-weight: 700; }
.ust__bilgi-ic { display: flex; align-items: center; justify-content: space-between; gap: 20px; height: 40px; }
.ust__vaat, .ust__hizli { display: flex; align-items: center; gap: 24px; margin: 0; padding: 0; list-style: none; }
.ust__vaat li, .ust__hizli a { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
.ust__vaat .icon { width: 17px; height: 17px; color: var(--pink); }
.ust__hizli a { color: rgba(255, 255, 255, .82); text-decoration: none; }
.ust__hizli a:hover { color: #fff; }
.ust__hizli .icon { width: 17px; height: 17px; }
.ust__hizli li + li { padding-left: 24px; border-left: 1px solid rgba(255, 255, 255, .18); }
@media (max-width: 1240px) { .ust__vaat li:nth-child(3) { display: none; } }

/* Ana satır */
.ust__satir { display: grid; grid-template-columns: 44px 1fr auto; align-items: center; gap: 8px; min-height: 66px; }
.ust .logo { justify-self: center; display: block; flex: none; color: var(--pink); line-height: 0; }
.ust .logo svg, .ust .logo__svg { display: block; width: 96px; max-width: none; height: auto; }
.ust__sag { display: flex; align-items: center; justify-content: flex-end; gap: 6px; }
.ust__ikon { position: relative; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; background: none; color: var(--ink); cursor: pointer; }
.ust__ikon:hover { background: var(--paper); }
.ust__ikon .icon { width: 24px; height: 24px; }
.ust__burger { display: grid; gap: 6px; width: 24px; }
.ust__burger i { display: block; height: 3px; border-radius: 2px; background: var(--ink); }
.ust__burger i:last-child { width: 68%; background: var(--pink); }
.ust__online { position: absolute; right: -1px; top: -1px; width: 10px; height: 10px; border-radius: 50%; background: #1f9d6b; box-shadow: 0 0 0 2px #fff; }
.ust__sepet { position: relative; display: inline-flex; align-items: center; gap: 10px; height: 46px; padding: 0 11px; border-radius: 999px; background: var(--ink); color: #fff; font-weight: 800; text-decoration: none; transition: background .2s; }
.ust__sepet:hover { background: var(--pink); color: #fff; }
.ust__sepet-ikon { position: relative; display: grid; place-items: center; }
.ust__sepet .icon { width: 23px; height: 23px; }
.ust__sepet-yazi { display: none; }
.ust .count-badge { position: absolute; top: -10px; right: -12px; min-width: 20px; height: 20px; padding: 0 5px; border-radius: 10px; background: var(--pink); color: #fff; font-size: .72rem; font-weight: 800; line-height: 20px; text-align: center; box-shadow: 0 0 0 2px #fff; }
.ust__sepet .count-badge { box-shadow: 0 0 0 2px var(--ink); }
.ust .count-badge:empty, .ust .count-badge[data-count="0"] { display: none; }
.ust__ara { padding: 2px 0 12px; border-top: 1px solid var(--line); }
.ust__ara[hidden] { display: none; }
.imza .searchbar { height: 52px; border-radius: 999px; background: var(--paper); border: 1.5px solid transparent; box-shadow: none; transition: border-color .2s, background .2s; }
.imza .searchbar:focus-within { background: #fff; border-color: var(--ink); }
.imza .searchbar input { font-weight: 600; }

/* Telefonda renk çipleri */
.ust__cipler { border-top: 1px solid var(--line); }
.ust__cipler ul { display: flex; gap: 8px; overflow-x: auto; margin: 0 calc(var(--gutter) * -1); padding: 10px var(--gutter); list-style: none; scrollbar-width: none; }
.ust__cipler ul::-webkit-scrollbar { display: none; }
.ust__cipler a { display: inline-flex; align-items: center; gap: 7px; height: 38px; padding: 0 14px 0 8px; border-radius: 999px; background: var(--paper); color: var(--ink); font-size: .92rem; font-weight: 800; white-space: nowrap; text-decoration: none; }
.ust__cipler a .icon { width: 18px; height: 18px; color: var(--pink); }
.ust__cipler a:has(.icon) { padding-left: 12px; }
.ust__cipler i { width: 22px; height: 22px; border-radius: 50%; background: var(--sw); box-shadow: inset 0 0 0 1.5px rgba(0, 0, 0, .12); }
.ust__cipler a.is-current { background: var(--ink); color: #fff; }
.ust__cipler .ust__cip-sicak { background: var(--pink); color: #fff; }
.ust__cipler .ust__cip-sicak .icon { color: #fff; }

/* Ödeme sayfası */
.ust--odeme { border-bottom: 1.5px solid var(--line); }
.ust--odeme .ust__satir { grid-template-columns: 44px 1fr auto; }
.ust__guvenli { display: inline-flex; align-items: center; gap: 6px; margin: 0; font-weight: 800; font-size: .9rem; }
.ust__guvenli .icon { width: 18px; height: 18px; color: #1f9d6b; }

@media (min-width: 1024px) {
	.ust__satir { grid-template-columns: auto minmax(280px, 640px) auto; justify-content: space-between; gap: 32px; min-height: 92px; }
	.ust__menu { display: none; }
	.ust .logo { justify-self: start; }
	.ust .logo svg, .ust .logo__svg { width: 132px; }
	.ust__arama { width: 100%; }
	.ust__arama .searchbar { height: 54px; }
	.ust__sag { gap: 22px; }
	.ust__eylem { display: inline-flex; align-items: center; gap: 10px; color: var(--ink); text-decoration: none; }
	.ust__eylem-ikon { position: relative; display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; background: var(--paper); transition: background .2s; }
	.ust__eylem:hover .ust__eylem-ikon { background: var(--pink-soft); }
	.ust__eylem-ikon .icon { width: 22px; height: 22px; }
	.ust__eylem-yazi { display: grid; line-height: 1.15; }
	.ust__eylem-yazi small { color: var(--muted); font-size: .76rem; font-weight: 700; }
	.ust__eylem-yazi b { font-size: 1rem; font-weight: 800; }
	.ust__eylem .count-badge { top: -4px; right: -4px; }
	.ust__sepet { height: 52px; padding: 0 22px 0 18px; }
	.ust__sepet-yazi { display: inline; font-size: 1rem; }
	.ust__sepet .count-badge { top: -9px; right: -11px; }

	/* Menü satırı */
	.ust__menu-satir { border-top: 1px solid var(--line); border-bottom: 1.5px solid var(--line); }
	.ust .catnav { position: static; display: block; border: 0; }
	.ust .catnav .container { position: static; }
	.ust .catnav__row { position: static; display: flex; align-items: center; justify-content: space-between; gap: 8px; height: 56px; }
	.ust .catnav__list { display: flex; align-items: center; gap: 2px; margin: 0; padding: 0; list-style: none; }
	.ust .catnav__item { position: static; }
	.ust .catnav__item--renk { display: list-item; list-style: none; }
	.ust .catnav__link { position: relative; display: inline-flex; align-items: center; gap: 8px; height: 56px; padding: 0 14px; color: var(--ink); font-size: 1rem; font-weight: 800; text-decoration: none; white-space: nowrap; }
	.ust .catnav__link .icon { width: 19px; height: 19px; }
	.ust .catnav__link::after { content: ""; position: absolute; left: 14px; right: 14px; bottom: 9px; height: 9px; background: linear-gradient(var(--pink) 0 0) 0 0 / 100% 3px no-repeat, linear-gradient(var(--pink) 0 0) 0 100% / 100% 3px no-repeat; transform: scaleX(0); transform-origin: left; transition: transform .3s cubic-bezier(.2, .8, .2, 1); }
	.ust .catnav__link:hover::after, .ust .catnav__link.is-current::after { transform: scaleX(1); }
	.ust .catnav__link--all { margin-right: 6px; padding: 0 18px; border-radius: 999px; height: 40px; background: var(--ink); color: #fff; }
	.ust .catnav__link--all::after { display: none; }
	.ust .catnav__link--all:hover, .ust .catnav__item--mega.is-open .catnav__link--all { background: var(--pink); color: #fff; }
	.ust .catnav__link--hot { color: var(--pink); }
	.catnav__nokta { width: 16px; height: 16px; border-radius: 50%; background: var(--sw); box-shadow: inset 0 0 0 1.5px rgba(0, 0, 0, .14); }
	.ust .mega { top: 100%; border-top: 1.5px solid var(--line); box-shadow: 0 40px 60px -40px rgba(20, 16, 17, .45); }
	.ust .mega__img { border-radius: 16px; overflow: hidden; }
	.ust .mega__picks { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.ust .mega__col--picks { flex: 1 1 auto; }
	.ust .mega__styles a { display: grid; grid-template-columns: 1fr; gap: 1px; padding: 9px 12px; border-radius: 14px; }
	.ust .mega__styles a:hover { background: var(--paper); }
	.ust .mega__styles a > span { display: inline-flex; align-items: center; font-size: 1.05rem; font-weight: 800; }
	.ust .mega__styles small { padding-left: 22px; color: var(--muted); font-size: .84rem; font-weight: 600; }
	.ust .mega__styles .icon { width: 16px; height: 16px; margin-right: 6px; color: var(--pink); }
	.mega__dot { width: 16px !important; height: 16px !important; margin-right: 6px !important; }
	.ust .mega__promo { background: var(--ink); color: #fff; border-radius: var(--radius-l); }
}
@media (min-width: 1024px) and (max-width: 1280px) {
	.ust .catnav__link { padding: 0 9px; font-size: .94rem; }
	.ust__eylem-yazi small { display: none; }
	.ust .catnav__list--end .catnav__item:last-child { display: none; }
}
