/* Layout Fixes (static)
   theme_custom.css'den sonra yüklenir. Böylece tema dosyası güncellense bile
   kritik yerleşim düzeltmeleri kalıcı kalır.
*/

/* 1) Ürün kart görselleri: küçük/büyük dengesizliğini bitir */
.product-card .thumb{
  aspect-ratio: 5 / 4;          /* 4/3 ile kare arası */
  width: 100%;
  display: block;
  object-fit: cover !important; /* theme_custom'taki contain/cover tartışmasını bitir */
  object-position: center;
  background: #fff;
}

/* Mobilde çok kareye yaklaşmasın */
@media (max-width: 720px){
  .product-card .thumb{ aspect-ratio: 4 / 3; }
}

/* 2) En Çok Satanlar: eski “blur + contain” tekniği varsa tamamen iptal et */
.carousel[data-carousel="bestsellers"] .imgwrap.imgblur::before{
  content: none !important;
  display: none !important;
}
.carousel[data-carousel="bestsellers"] .imgwrap.imgblur{
  aspect-ratio: auto !important;
  overflow: hidden;
}
.carousel[data-carousel="bestsellers"] .product-card .thumb{
  padding: 0 !important;
  height: auto !important;
  object-fit: cover !important;
}

/* 3) En Çok Satanlar: geniş ekranda 5 kart aynı anda görünsün */
@media (min-width: 1200px){
  .carousel[data-carousel="bestsellers"] .carousel-item{
    flex: 0 0 calc((100% - (14px * 4)) / 5);
  }
}

/* 4) Grid listelerde geniş ekranda 5 ürün */
@media (min-width: 1220px){
  .grid{ grid-template-columns: repeat(5, 1fr); }
}


/* 5) Mobil header / menü / sepet (tam mobil uyum) */
.hact-search{display:none;}

/* Off-canvas panel ve arama overlay üstte kalsın */
.cat-panel{z-index:70;}
.msearch{z-index:80;}
.mobile-bar{z-index:55;}

/* Tablet + mobil: üst nav'ı gizle, arama ikonunu aç */
@media (max-width: 920px){
  .nav-wrap{display:none !important;}
  .hact-search{display:flex;}
  .top-links{display:none;}
}

/* Telefon: header'ı kompakt yap + alt mobil bar */
@media (max-width: 720px){
  .top-strip{display:none;}
  .header-main{padding:10px 0;gap:10px;}
  .logo-img{height:34px;}

  .header-actions{gap:8px;}
  .header-actions .hact{
    width:44px;height:44px;
    padding:0;
    justify-content:center;
  }
  .header-actions .hact span:not(.hicon){
    position:absolute !important;
    width:1px;height:1px;overflow:hidden;
    clip:rect(1px,1px,1px,1px);
    white-space:nowrap;
  }

  body{padding-bottom:78px;}
}

/* Cat panel quick links */
.cat-quick{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}
.catq{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:14px;border:1px solid rgba(17,24,39,.12);background:rgba(255,255,255,.82);color:rgba(17,24,39,.86);text-decoration:none}
.catq i{width:18px;text-align:center}
.cat-links{display:flex;flex-direction:column;gap:8px;margin:8px 0 10px}
.catl{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:14px;border:1px dashed rgba(17,24,39,.18);background:rgba(17,24,39,.03);color:rgba(17,24,39,.84);text-decoration:none}
.catl:hover{background:rgba(245,158,11,.12);border-color:rgba(245,158,11,.28)}
.cat-sep{height:1px;background:rgba(17,24,39,.12);margin:12px 0}


/* Mobil arama overlay */
.msearch{position:fixed;inset:0;display:none}
.msearch.open{display:block}
.msearch-backdrop{position:absolute;inset:0;background:rgba(17,24,39,.35);backdrop-filter:blur(2px)}
.msearch-card{position:relative;margin:14vh auto 0;max-width:720px;padding:12px}
.msearch-form{display:flex;gap:10px;align-items:center;background:rgba(255,255,255,.96);border:1px solid rgba(17,24,39,.14);border-radius:18px;box-shadow:0 18px 50px rgba(0,0,0,.18);padding:12px}
.msearch-form input{flex:1;min-width:0;padding:12px 14px;border:1px solid rgba(17,24,39,.14);border-radius:14px;outline:none;background:#fff}

@media (max-width: 720px){
  .msearch-card{margin:10vh 10px 0;}
  .msearch-form{flex-direction:column;align-items:stretch}
  .msearch-form .btn{width:100%}
}


/* Alt mobil bar */
.mobile-bar{
  --mb-home:#3b82f6;   /* mavi */
  --mb-menu:#a855f7;   /* mor */
  --mb-search:#f59e0b; /* turuncu */
  --mb-cart:#22c55e;   /* yeşil */
  --mb-account:#ec4899;/* pembe */
  position:fixed;left:0;right:0;bottom:0;display:none;gap:6px;align-items:stretch;justify-content:space-around;
  padding:10px 10px calc(10px + env(safe-area-inset-bottom));
  background:
    linear-gradient(90deg,
      rgba(59,130,246,.16),
      rgba(168,85,247,.16),
      rgba(245,158,11,.16),
      rgba(34,197,94,.16),
      rgba(236,72,153,.16)
    ),
    rgba(255,255,255,.90);
  border-top:1px solid rgba(17,24,39,.10);
  backdrop-filter:blur(10px)
}
.mobile-bar .mbtn{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:10px 8px;border-radius:18px;border:1px solid transparent;background:transparent;color:rgba(17,24,39,.82);text-decoration:none;position:relative;cursor:pointer}
.mobile-bar .mbtn i{font-size:18px}
.mobile-bar .mbtn span{font-size:11.5px;font-weight:800;letter-spacing:.2px}
.mobile-bar .mbtn:hover,.mobile-bar .mbtn:active{background:rgba(17,24,39,.06);border-color:rgba(17,24,39,.10)}

/* İkonları renkli yap (sıralama: Ana / Menü / Ara / Sepet / Hesap) */
.mobile-bar .mbtn:nth-child(1) i{color:var(--mb-home)}
.mobile-bar .mbtn:nth-child(2) i{color:var(--mb-menu)}
.mobile-bar .mbtn:nth-child(3) i{color:var(--mb-search)}
.mobile-bar .mbtn:nth-child(4) i{color:var(--mb-cart)}
.mobile-bar .mbtn:nth-child(5) i{color:var(--mb-account)}

/* Hover efektleri de buton rengine göre */
.mobile-bar .mbtn:nth-child(1):hover,.mobile-bar .mbtn:nth-child(1):active{background:rgba(59,130,246,.14);border-color:rgba(59,130,246,.22)}
.mobile-bar .mbtn:nth-child(2):hover,.mobile-bar .mbtn:nth-child(2):active{background:rgba(168,85,247,.14);border-color:rgba(168,85,247,.22)}
.mobile-bar .mbtn:nth-child(3):hover,.mobile-bar .mbtn:nth-child(3):active{background:rgba(245,158,11,.14);border-color:rgba(245,158,11,.22)}
.mobile-bar .mbtn:nth-child(4):hover,.mobile-bar .mbtn:nth-child(4):active{background:rgba(34,197,94,.14);border-color:rgba(34,197,94,.22)}
.mobile-bar .mbtn:nth-child(5):hover,.mobile-bar .mbtn:nth-child(5):active{background:rgba(236,72,153,.14);border-color:rgba(236,72,153,.22)}

/* Sepet badge'i yeşil */
.mobile-bar .mbadge{position:absolute;top:6px;right:18px;background:rgba(34,197,94,.95);color:#fff;border:1px solid rgba(34,197,94,.25);border-radius:999px;padding:2px 7px;font-size:11px;font-weight:900}

@media (max-width: 720px){
  .mobile-bar{display:flex;}
}



/* 6) Hesabım (dashboard) derli toplu görünüm */
.account-shell{display:grid;grid-template-columns:260px 1fr;gap:16px;align-items:start}
.account-nav{position:sticky;top:90px;display:flex;flex-direction:column;gap:10px}
.account-nav a{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:16px;border:1px solid rgba(17,24,39,.12);background:rgba(255,255,255,.86);text-decoration:none;color:rgba(17,24,39,.86);font-weight:900}
.account-nav a:hover{background:rgba(245,158,11,.12);border-color:rgba(245,158,11,.22)}
.account-nav a.active{background:rgba(34,197,94,.12);border-color:rgba(34,197,94,.22)}
.account-nav a .ai{width:22px;text-align:center}

.account-topcard{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-bottom:14px}
.account-usercard{display:flex;align-items:center;gap:12px}
.account-avatar{width:54px;height:54px;border-radius:18px;border:1px solid var(--line);background:#fff;overflow:hidden;display:grid;place-items:center}
.account-avatar img{width:100%;height:100%;object-fit:cover}
.account-quick{display:flex;gap:10px;flex-wrap:wrap}
.account-quick .qbtn{display:inline-flex;align-items:center;gap:8px;padding:10px 12px;border-radius:16px;border:1px solid rgba(17,24,39,.12);background:rgba(255,255,255,.86);text-decoration:none;color:rgba(17,24,39,.86);font-weight:900}
.account-quick .qbtn:hover{background:rgba(245,158,11,.12);border-color:rgba(245,158,11,.22)}

.account-panel{display:none}
.account-panel.active{display:block}

@media (max-width: 980px){
  .account-shell{grid-template-columns:1fr}
  .account-nav{position:relative;top:auto;flex-direction:row;flex-wrap:wrap}
  .account-nav a{flex:1;min-width:140px;justify-content:center}
}

/* 7) Checkout adres alanı: aç/kapa (details) */
.addr-details{border:1px solid rgba(17,24,39,.12);border-radius:18px;background:rgba(255,255,255,.86);overflow:hidden}
.addr-details summary{list-style:none;cursor:pointer;padding:12px 14px;font-weight:900;display:flex;align-items:center;justify-content:space-between;gap:10px}
.addr-details summary::-webkit-details-marker{display:none}
.addr-details summary .muted{font-weight:700}
.addr-details[open] summary{background:rgba(245,158,11,.10);border-bottom:1px dashed rgba(17,24,39,.14)}
.addr-body{padding:12px 14px}
.addr-tools{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:10px}
.addr-tools .btn{padding:10px 12px}