/* ===========================================================
   SGS Master — Gelişmiş header (topStrip + arama + sepet çekmecesi)
   "sgs-master-urunler" mockup'ından birebir uyarlandı.
   dse ikon fontu tema style.css'inde tanımlı (font-family:dse).
   =========================================================== */

#hamb { display: none !important; }
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; appearance: none; display: none; }
#cartPanel { scrollbar-width: none; -ms-overflow-style: none; }
#cartPanel::-webkit-scrollbar { width: 0; height: 0; display: none; }

@keyframes drawerIn { from { transform: translateX(100%); } to { transform: translateX(0); } }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes navmPanel { from { transform: translateX(120%); } to { transform: translateX(0); } }
@keyframes navmBg { from { transform: translateX(101%); } to { transform: translateX(0); } }
@keyframes navmLink { from { transform: translateY(140%) rotate(8deg); opacity: 0; } to { transform: translateY(0) rotate(0); opacity: 1; } }
@keyframes navmFade { from { opacity: 0; transform: translateY(40%); } to { opacity: 1; transform: translateY(0); } }

/* Logo daralma geçişleri (viewBox JS ile tween'lenir, gruplar CSS ile) */
#brandLogo { transition: width .55s cubic-bezier(.65,.05,0,1), height .55s cubic-bezier(.65,.05,0,1); }
#brandLogo #DEEP_SEA_ELECTRONICS,
#brandLogo #Vertical_Line_Delimiter,
#brandLogo #POWER_CONTROL_SOLUTIONS,
#brandLogo #DSE-LOGO,
#brandLogo #SGS_MASTER {
	transition: transform .55s cubic-bezier(.65,.05,0,1), opacity .55s cubic-bezier(.65,.05,0,1);
	transform-box: view-box;
}
#brandLogo #DEEP_SEA_ELECTRONICS { transform-origin: left center; }
#brandLogo #Vertical_Line_Delimiter { transform-origin: 482px 72px; }
#brandLogo #POWER_CONTROL_SOLUTIONS { transform-origin: center top; }
#brandLogo #SGS_MASTER { transform-origin: 515px 57px; }
[data-logo="collapsed"] #DEEP_SEA_ELECTRONICS { transform: translateX(-260px); opacity: 0; }
[data-logo="collapsed"] #Vertical_Line_Delimiter { transform: scaleY(0); opacity: 0; }
[data-logo="collapsed"] #POWER_CONTROL_SOLUTIONS { transform: translateY(40px); opacity: 0; }
[data-logo="collapsed"] #DSE-LOGO { transform: translateX(197.5px); }
[data-logo="collapsed"] #SGS_MASTER { transform: translate(-197.5px,12px) scale(1.4); }

/* Katalog grid'leri (ürün dizilimi) */
[data-grid="fam"] { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
/* Ürün grid'i: masaüstünde sabit 4 sütun (az ürün varsa kartlar büyümez, sola hizalı). */
[data-grid="prod"] { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1080px) { [data-grid="prod"] { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 760px)  { [data-grid="prod"] { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 480px)  { [data-grid="prod"] { grid-template-columns: minmax(0, 1fr); } }

/* Mega menü (Ürünler) — caret dönüşü + masaüstü-only */
#megaTrigger svg { transition: transform .4s cubic-bezier(.65,.05,0,1); }
#megaTrigger[data-open="1"] svg { transform: rotate(180deg); }
#megaPanel .sgs-dse-glyph { font-family: "dse"; font-style: normal; line-height: 1; display: inline-block; }
@media (max-width: 1080px) { #megaPanel { display: none !important; } }

/* ---------- Responsive ---------- */
@media (max-width: 1080px) {
	#navList { display: none !important; }
	#hamb { display: inline-flex !important; }
	#brandLink svg { height: 38px !important; width: 220px !important; }
	#headBar { padding: 0 20px !important; gap: 14px !important; }
}
@media (max-width: 860px) {
	#footGrid { grid-template-columns: 1fr 1fr !important; gap: 28px !important; }
}
@media (max-width: 820px) {
	#loginBtn span { display: none !important; }
	#loginBtn { padding: 11px 13px !important; }
}
@media (max-width: 680px) {
	[data-grid="fam"] { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)) !important; }
	#brandLink svg { height: 30px !important; width: 186px !important; }
	#headBar { padding: 0 16px !important; gap: 10px !important; height: 66px !important; }
	#loginBtn { padding: 11px 13px !important; }
	#cartBtn { padding: 11px 14px !important; font-size: .86rem !important; }
	#topStrip { display: none !important; }
}
@media (max-width: 560px) {
	#footGrid { grid-template-columns: 1fr !important; }
	#searchWrap { min-width: 0 !important; }
	#searchRow { flex-direction: column !important; align-items: stretch !important; }
	[data-cartword] { display: none !important; }
	#loginBtn { display: none !important; }
	#cartBtn { padding: 11px 13px !important; gap: 6px !important; }
}
@media (max-width: 420px) {
	#brandLink svg { height: 24px !important; width: 138px !important; }
	#cartBtn span { padding: 2px 6px !important; }
}