
/* wrappers */
.ucler-katalog-wrap,.ucler-vitrin-wrap{max-width:1100px;margin:0 auto;padding:22px 16px}
.ucler-katalog-header{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.ucler-katalog-header h2,.ucler-vitrin-header h2{margin:0;font-size:32px;line-height:1.1}
.ucler-katalog-sub{color:rgba(0,0,0,.65)}

/* grids */
.ucler-cols-1{grid-template-columns:1fr}
.ucler-cols-2{grid-template-columns:repeat(2,1fr)}
.ucler-cols-3{grid-template-columns:repeat(3,1fr)}
.ucler-cols-4{grid-template-columns:repeat(4,1fr)}
@media (max-width: 900px){.ucler-cols-3,.ucler-cols-4{grid-template-columns:repeat(2,1fr)}}
@media (max-width: 560px){.ucler-cols-2,.ucler-cols-3,.ucler-cols-4{grid-template-columns:1fr}}

/* category cards */
.ucler-cat-grid{display:grid;gap:16px}
.ucler-cat-card{display:block;border:1px solid rgba(0,0,0,.08);border-radius:16px;overflow:hidden;text-decoration:none;background:#fff;transition:transform .15s ease, box-shadow .15s ease;color:inherit}
.ucler-cat-card:hover{transform:translateY(-2px);box-shadow:0 10px 22px rgba(0,0,0,.08)}
.ucler-cat-thumb{width:100%;height:220px;object-fit:cover;display:block;background:#f5f5f5}
.ucler-cat-body{padding:14px 14px 16px}
.ucler-cat-title{font-size:18px;font-weight:800;margin:0 0 8px}
.ucler-cat-desc{font-size:14px;color:rgba(0,0,0,.7);margin:0 0 10px}
.ucler-cat-more{font-size:13px;font-weight:800;opacity:.85}

/* product cards */
.ucler-urun-grid{display:grid;gap:16px;margin:16px 0}
.ucler-urun-card{display:block;border:1px solid rgba(0,0,0,.08);border-radius:16px;overflow:hidden;text-decoration:none;background:#fff;transition:transform .15s ease, box-shadow .15s ease;color:inherit}
.ucler-urun-card:hover{transform:translateY(-2px);box-shadow:0 10px 22px rgba(0,0,0,.08)}
.ucler-urun-thumb{width:100%;height:160px;object-fit:cover;display:block;background:#f5f5f5}
.ucler-urun-body{padding:12px 14px 14px}
.ucler-urun-title{font-size:16px;font-weight:800;margin:0 0 8px}
.ucler-urun-short{font-size:13px;color:rgba(0,0,0,.7);margin:0 0 10px}
.ucler-urun-more{font-size:13px;font-weight:800;opacity:.85}

/* placeholder */
.ucler-thumb-placeholder{display:flex;align-items:center;justify-content:center;color:rgba(0,0,0,.55);font-size:13px;font-weight:700}
.ucler-thumb-placeholder span{padding:6px 10px;border-radius:999px;border:1px dashed rgba(0,0,0,.25);background:rgba(255,255,255,.7)}

/* pagination */
.ucler-pagination{margin:18px 0}
.ucler-pagination .page-numbers{display:inline-block;margin-right:6px;padding:8px 10px;border:1px solid rgba(0,0,0,.12);border-radius:12px;text-decoration:none}
.ucler-pagination .current{font-weight:900}

/* ====== Manşet ====== */
.ucler-manset{position:relative;height:var(--ucler-manset-h,460px);border-radius:22px;overflow:hidden;border:1px solid rgba(0,0,0,.08);margin:18px auto;max-width:1100px}
.ucler-manset-track{display:flex;height:100%;transition:transform .6s ease}
.ucler-manset-slide{min-width:100%;position:relative;height:100%}
.ucler-manset-bg{position:absolute;inset:0;background-size:cover;background-position:center;transform:scale(1.05);animation:uclerKenBurns 12s ease-in-out infinite alternate}
@keyframes uclerKenBurns{from{transform:scale(1.03)} to{transform:scale(1.10)}}
.ucler-manset-overlay{position:absolute;inset:0;background:linear-gradient(90deg, rgba(0,0,0,.66) 0%, rgba(0,0,0,.22) 55%, rgba(0,0,0,0) 100%)}
.ucler-manset-inner{position:relative;height:100%;display:flex;align-items:center;padding:28px}
.ucler-manset-copy{max-width:620px;color:#fff}
.ucler-manset-copy h2{margin:0 0 10px;font-size:42px;line-height:1.05}
.ucler-manset-copy p{margin:0 0 16px;font-size:16px;line-height:1.55;opacity:.95}

.ucler-manset-actions{display:flex;gap:10px;flex-wrap:wrap}
.ucler-btn{display:inline-block;text-decoration:none;font-weight:900;padding:10px 14px;border-radius:14px;border:1px solid rgba(255,255,255,.25)}
.ucler-primary{background:rgba(255,255,255,.95);color:#111;border-color:rgba(255,255,255,.0)}
.ucler-ghost{background:rgba(0,0,0,.25);color:#fff}

.ucler-manset-nav{position:absolute;top:50%;transform:translateY(-50%);background:rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.25);color:#fff;width:44px;height:44px;border-radius:999px;cursor:pointer;font-size:28px;line-height:42px}
.ucler-manset-nav:hover{background:rgba(0,0,0,.48)}
.ucler-prev{left:14px}
.ucler-next{right:14px}
.ucler-manset-dots{position:absolute;left:50%;transform:translateX(-50%);bottom:14px;display:flex;gap:8px}
.ucler-manset-dot{width:10px;height:10px;border-radius:999px;background:rgba(255,255,255,.45);border:1px solid rgba(0,0,0,.2);cursor:pointer}
.ucler-manset-dot.is-active{background:#fff}

/* scroll down indicator */
.ucler-scroll-down{position:absolute;left:50%;transform:translateX(-50%);bottom:54px;background:rgba(0,0,0,.28);border:1px solid rgba(255,255,255,.25);border-radius:999px;cursor:pointer;display:flex;align-items:center;gap:10px;padding:10px 14px;color:#fff}
.ucler-scroll-pill{font-weight:900;font-size:13px;opacity:.95}
.ucler-scroll-dot{width:8px;height:8px;border-radius:999px;background:#fff;animation:uclerBounce 1.2s ease-in-out infinite}
@keyframes uclerBounce{0%,100%{transform:translateY(0);opacity:.9}50%{transform:translateY(6px);opacity:1}}

/* responsive */
@media (max-width: 680px){
  .ucler-manset{border-radius:18px}
  .ucler-manset-copy h2{font-size:30px}
  .ucler-manset-inner{padding:18px}
  .ucler-manset-overlay{background:linear-gradient(180deg, rgba(0,0,0,.72) 0%, rgba(0,0,0,.30) 58%, rgba(0,0,0,.08) 100%)}
  .ucler-scroll-down{bottom:46px}
}

/* ===== Lightbox ===== */
.ucler-lightbox{position:fixed;inset:0;z-index:999999;display:none;align-items:center;justify-content:center;background:rgba(0,0,0,.78);padding:24px}
.ucler-lightbox.is-open{display:flex}
.ucler-lightbox img{max-width:92vw;max-height:86vh;border-radius:14px;box-shadow:0 18px 44px rgba(0,0,0,.35);background:#111}
.ucler-lightbox .ucler-close{position:absolute;top:14px;right:14px;background:rgba(0,0,0,.45);border:1px solid rgba(255,255,255,.25);color:#fff;border-radius:999px;padding:10px 12px;font-weight:900;cursor:pointer}
.ucler-lightbox .ucler-close:hover{background:rgba(0,0,0,.6)}
body.ucler-noscroll{overflow:hidden}

/* === Teknik Bilgi okunurluk düzeltmesi === */
.ucler-katalog-wrap aside{
  background:#ffffff !important;
}
.ucler-katalog-wrap aside,
.ucler-katalog-wrap aside *{
  color:#1f2937 !important;
}
.ucler-katalog-wrap aside pre{
  background:#f3f4f6 !important;
  color:#111827 !important;
  border:1px solid #e5e7eb;
}
