/* =========================================================
   LIVBEN • Listing Post v2.1 — PRO (SCOPED + ÖLÇÜ FIX)
   ✅ Site geneline dokunmaz (NO :root / NO global .alert)
   ✅ 1400px ölçü sabit
   ✅ Kategori kutuları/pro görünüm + scrollbar
   ✅ Uploader önizleme daha büyük + daha az kırpma
========================================================= */

/* ---------- Tokens (SADECE bu sayfa) ---------- */
.lb-post{
  --lb-bg:#f8fafc;
  --lb-surface:#ffffff;
  --lb-text:#0f172a;
  --lb-muted:#475569;
  --lb-border:#e2e8f0;
  --lb-accent:#0ea5e9;
  --lb-success:#10b981;
  --lb-warn:#f59e0b;
  --lb-danger:#ef4444;
  --lb-shadow: rgba(15,23,42,.06);
  --lb-shadow-strong: rgba(15,23,42,.10);
  --lb-radius:16px;
  --lb-radius-sm:12px;
  --lb-radius-xs:10px;

  background: var(--lb-bg);
  color: var(--lb-text);
  padding: 18px 0 36px;
}

/* Scope reset (sayfa içi) */
.lb-post, .lb-post *{ box-sizing:border-box; }
.lb-post img{ max-width:100%; height:auto; display:block; }
.lb-post a{ color:inherit; text-decoration:none; }
.lb-post .lb-muted{ color: var(--lb-muted); }

/* Focus (sayfa içi) */
.lb-post :where(a,button,input,select,textarea,summary):focus-visible{
  outline:none;
  box-shadow: 0 0 0 4px rgba(14,165,233,.18);
  border-radius: 12px;
}

/* ---------- 1400px WIDE CONTAINER ---------- */
.lb-post .lb-container--wide{
  max-width: 1400px;
  width: 100%;
  margin: 0 auto;
  padding: 0 16px;
}
@media (max-width: 576px){
  .lb-post .lb-container--wide{ padding: 0 12px; }
}

/* ---------- Head (page header) ---------- */
.lb-post .lb-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  padding: 14px 4px 10px;
}
@media (max-width: 992px){
  .lb-post .lb-head{ flex-direction:column; }
  .lb-post .lb-head__right{ width:100%; display:flex; gap:10px; flex-wrap:wrap; }
}

.lb-post .lb-badges{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.lb-post .lb-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 7px 10px;
  border-radius:999px;
  font-weight:800;
  font-size:12px;
  letter-spacing:.2px;
  border:1px solid rgba(148,163,184,.25);
  background: rgba(255,255,255,.8);
}
.lb-post .lb-badge--green{
  color:#065f46;
  background: rgba(16,185,129,.12);
  border-color: rgba(16,185,129,.22);
}
.lb-post .lb-title{
  margin: 10px 0 4px;
  font-weight: 900;
  letter-spacing: -0.3px;
  font-size: 28px;
  line-height: 1.15;
}
.lb-post .lb-sub{
  color: var(--lb-muted);
  font-size: 13px;
}

/* ---------- Card shell ---------- */
.lb-post .lb-card{
  margin-top: 14px;
  border-radius: calc(var(--lb-radius) + 6px);
  background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(255,255,255,.96) 100%);
  border: 1px solid rgba(148,163,184,.28);
  box-shadow: 0 18px 50px var(--lb-shadow);
  overflow: hidden;
}
.lb-post .lb-form{ padding: 16px; }
@media (max-width: 992px){
  .lb-post .lb-form{ padding: 12px; }
}

/* ---------- Sections ---------- */
.lb-post .lb-section{
  border:1px solid rgba(148,163,184,.22);
  background: rgba(248,250,252,.55);
  border-radius: var(--lb-radius);
  padding: 14px;
  margin-bottom: 14px;
}
.lb-post .lb-section__title{
  font-weight: 900;
  letter-spacing: -0.2px;
  font-size: 15px;
  margin-bottom: 4px;
}
.lb-post .lb-section__desc{
  color: var(--lb-muted);
  font-size: 12.5px;
  margin-bottom: 10px;
}

/* ---------- Footer bar ---------- */
.lb-post .lb-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding: 14px;
  border-radius: var(--lb-radius);
  border:1px solid rgba(148,163,184,.22);
  background: #fff;
  box-shadow: 0 10px 30px var(--lb-shadow);
}
@media (max-width: 992px){
  .lb-post .lb-footer{ flex-direction:column; align-items:stretch; }
  .lb-post .lb-footer__right{ display:flex; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
}

/* ---------- Alerts (SADECE bu sayfa) ---------- */
.lb-post .alert{ border-radius: 14px; }

/* =========================================================
   Category PRO — 3 kutu (zengin)
========================================================= */
.lb-post .lb-catWrap{
  display:grid;
  grid-template-columns: 1fr 1fr 0.9fr;
  gap:12px;
}
@media (max-width: 992px){
  .lb-post .lb-catWrap{ grid-template-columns:1fr; }
}

.lb-post .lb-catBox{
  border:1px solid rgba(148,163,184,.30);
  border-radius: var(--lb-radius);
  background: #fff;
  box-shadow: 0 10px 28px var(--lb-shadow);
  overflow:hidden;
  min-height: 380px;
  display:flex;
  flex-direction:column;
}

.lb-post .lb-catBox__head{
  padding: 12px 12px 10px;
  background: linear-gradient(180deg, rgba(248,250,252,.95) 0%, rgba(255,255,255,1) 100%);
  border-bottom:1px solid rgba(148,163,184,.22);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.lb-post .lb-catBox__title{
  font-weight: 900;
  color: var(--lb-text);
  letter-spacing: -0.2px;
  font-size: 13.5px;
}
.lb-post .lb-catBox__meta{
  font-size:12px;
  color: var(--lb-muted);
  white-space:nowrap;
}

/* search row */
.lb-post .lb-catSearch{ padding: 10px 12px 0; }
.lb-post .lb-catSearch .form-control{
  border-radius: 12px;
  border:1px solid rgba(148,163,184,.28);
  box-shadow: 0 8px 18px rgba(15,23,42,.04);
}

/* list with scrollbar (flex ile kutuyu doldursun) */
.lb-post .lb-catList{
  padding:10px 12px 12px;
  flex: 1 1 auto;
  min-height: 260px;
  overflow:auto;
  scrollbar-gutter: stable;
}

/* nicer scrollbar (webkit) */
.lb-post .lb-catList::-webkit-scrollbar{ width: 10px; }
.lb-post .lb-catList::-webkit-scrollbar-track{ background: rgba(148,163,184,.10); border-radius: 999px; }
.lb-post .lb-catList::-webkit-scrollbar-thumb{
  background: rgba(148,163,184,.38);
  border-radius: 999px;
  border: 2px solid rgba(248,250,252,1);
}
.lb-post .lb-catList::-webkit-scrollbar-thumb:hover{ background: rgba(148,163,184,.55); }

.lb-post .lb-catHint{
  padding:10px 12px 12px;
  font-size:12px;
  color: var(--lb-muted);
  border-top:1px solid rgba(148,163,184,.18);
  background: rgba(248,250,252,.6);
}

/* item */
.lb-post .lb-catItem{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding: 10px 10px;
  border:1px solid rgba(148,163,184,.22);
  border-radius: 14px;
  background:#fff;
  cursor:pointer;
  user-select:none;
  margin-bottom:10px;
  transition:transform .10s ease, border-color .10s ease, box-shadow .10s ease, background .10s ease;
}
.lb-post .lb-catItem:hover{
  transform: translateY(-1px);
  border-color: rgba(14,165,233,.55);
  box-shadow: 0 10px 22px rgba(14,165,233,.10);
  background: rgba(14,165,233,.03);
}
.lb-post .lb-catItem.is-active{
  border-color: rgba(14,165,233,.95);
  box-shadow: 0 14px 30px rgba(14,165,233,.12);
}

.lb-post .lb-catLeft{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}
.lb-post .lb-catNum{
  width:28px;
  height:28px;
  border-radius: 10px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight: 900;
  font-size:12px;
  background: rgba(148,163,184,.16);
  color: var(--lb-text);
  flex:0 0 auto;
}
.lb-post .lb-catName{
  font-weight:700;
  color: var(--lb-text);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.lb-post .lb-catArrow{
  font-size:18px;
  color:#94a3b8;
  flex:0 0 auto;
}

/* status box */
.lb-post .lb-catBox--status{ min-height:380px; }
.lb-post .lb-catStatus{ padding: 12px; }

.lb-post .lb-statusBadge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding: 8px 10px;
  border-radius:999px;
  font-weight:900;
  font-size:12px;
  background: rgba(148,163,184,.16);
  color: var(--lb-text);
  margin-bottom:12px;
  border:1px solid rgba(148,163,184,.22);
}
.lb-post .lb-statusBadge.is-ok{
  background: rgba(16,185,129,.12);
  border-color: rgba(16,185,129,.22);
  color:#065f46;
}
.lb-post .lb-statusRow{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
  padding: 10px 0;
  border-top:1px dashed rgba(148,163,184,.30);
}
.lb-post .lb-statusKey{ color: var(--lb-muted); font-size:12px; }
.lb-post .lb-statusVal{ color: var(--lb-text); font-weight: 900; text-align:right; }

.lb-post .lb-statusDone{
  margin-top:12px;
  padding:10px 12px;
  border-radius: 14px;
  background: rgba(16,185,129,.10);
  border: 1px solid rgba(16,185,129,.20);
  color:#065f46;
  font-weight: 900;
  display:none;
}
.lb-post .lb-statusDone.is-show{ display:block; }

/* =========================================================
   Fiyat uyarısı
========================================================= */
.lb-post .lb-priceWarn{
  margin-top:8px;
  font-size:12px;
  color:#92400e;
  background: rgba(245,158,11,.12);
  border:1px solid rgba(245,158,11,.22);
  border-radius: 12px;
  padding: 9px 10px;
  display:none;
}
.lb-post .lb-priceWarn.is-show{ display:block; }

/* =========================================================
   Uploader (dış iskelet + grid)
   ✅ Önizleme büyütüldü + daha az kırpma
========================================================= */
.lb-post .lb-uploader{
  border:1px solid rgba(148,163,184,.22);
  border-radius: var(--lb-radius);
  background:#fff;
  box-shadow: 0 10px 28px var(--lb-shadow);
  overflow:hidden;
}

.lb-post .lb-uploader__top{
  display:grid;
  grid-template-columns: 1.25fr 1fr;
  gap:12px;
  padding:12px;
  background: rgba(248,250,252,.7);
  border-bottom:1px solid rgba(148,163,184,.18);
}
@media (max-width: 992px){
  .lb-post .lb-uploader__top{ grid-template-columns:1fr; }
}

.lb-post .lb-uploader__drop{
  border: 2px dashed rgba(148,163,184,.35);
  border-radius: var(--lb-radius);
  padding: 16px;
  background: rgba(255,255,255,.9);
  cursor:pointer;
  box-shadow: 0 10px 26px rgba(15,23,42,.05);
}
.lb-post .lb-uploader__drop:hover{
  border-color: rgba(14,165,233,.55);
  box-shadow: 0 16px 34px rgba(14,165,233,.10);
}

.lb-post .lb-uploader__dropTitle{
  font-weight: 900;
  font-size: 14px;
  margin-bottom: 4px;
}
.lb-post .lb-uploader__dropDesc{
  color: var(--lb-muted);
  font-size: 12.5px;
}

.lb-post .lb-uploader__actions .form-control{ border-radius: 12px; }

.lb-post .lb-uploader__meta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-top: 8px;
}
.lb-post .lb-uploader__count{
  font-weight: 900;
  color: var(--lb-text);
  font-size: 12px;
  padding: 6px 10px;
  border-radius: 999px;
  border:1px solid rgba(148,163,184,.22);
  background: rgba(255,255,255,.85);
}
.lb-post .lb-uploader__hint{
  color: var(--lb-muted);
  font-size: 12px;
}

/* grid (auto-fit ile kartlar ezilmesin) */
.lb-post .lb-uploader__grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap:10px;
  padding:12px;
}

/* thumb */
.lb-post .lb-thumb{
  border:1px solid rgba(148,163,184,.22);
  border-radius: var(--lb-radius);
  overflow:hidden;
  background:#fff;
  position:relative;
  box-shadow: 0 10px 22px rgba(15,23,42,.05);
  cursor:pointer; /* kapak seçimi için */
}
.lb-post .lb-thumb.is-cover{
  border-color: rgba(14,165,233,.95);
  box-shadow: 0 16px 34px rgba(14,165,233,.12);
}

/* ✅ daha büyük + daha doğru görünüm:
   - aspect-ratio ile görüntü oranı sabit
   - object-fit: cover (kırpma azalsın diye 4/3)
*/
.lb-post .lb-thumb__img{
  width:100%;
  aspect-ratio: 4 / 3;
  height: auto;
  object-fit: cover;
  object-position: center;
  display:block;
  background:#f1f5f9;
}

.lb-post .lb-badgeCover{
  position:absolute;
  left:10px;
  top:10px;
  background: rgba(14,165,233,.95);
  color:#fff;
  font-weight: 900;
  font-size:11px;
  padding:6px 8px;
  border-radius:999px;
  box-shadow: 0 10px 20px rgba(14,165,233,.20);
}

.lb-post .lb-remove{
  position:absolute;
  right:8px;
  top:8px;
  width:30px;
  height:30px;
  border-radius:999px;
  border:1px solid rgba(148,163,184,.30);
  background:#fff;
  font-weight: 900;
  line-height:1;
  cursor:pointer;
  box-shadow: 0 10px 18px rgba(15,23,42,.08);
}
.lb-post .lb-remove:hover{ border-color: rgba(239,68,68,.55); }

/* Videos block */
.lb-post .lb-videos{
  margin-top: 14px;
  border:1px solid rgba(148,163,184,.22);
  border-radius: var(--lb-radius);
  background:#fff;
  box-shadow: 0 10px 28px var(--lb-shadow);
  padding: 12px;
}

.lb-post .lb-videos__top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}
@media (max-width: 992px){
  .lb-post .lb-videos__top{ flex-direction:column; }
}

/* Input-group spacing (SADECE bu sayfa) */
.lb-post .input-group .form-control{ border-radius: 12px 0 0 12px; }
.lb-post .input-group .btn{ border-radius: 0 12px 12px 0; }
/* ✅ FIX: Kategori / Alt Kategori listeleri kutu içinde 10 satır + scroll */
.lb-post .lb-catBox{
  min-height: 560px;          /* kutu sabit/pro */
}

.lb-post .lb-catList{
  height: 430px;              /* ~10 item görünür */
  max-height: 430px;
  overflow: auto;
  padding: 10px 12px 12px;
}

/* item’ları biraz sıklaştır (10 satır daha rahat sığsın) */
.lb-post .lb-catItem{
  padding: 8px 10px;
  margin-bottom: 8px;
  border-radius: 14px;
}

.lb-post .lb-catNum{
  width: 26px;
  height: 26px;
  border-radius: 9px;
}

/* mobilde daha kısa olsun */
@media (max-width: 992px){
  .lb-post .lb-catBox{ min-height: 520px; }
  .lb-post .lb-catList{ height: 360px; max-height: 360px; }
}