/* TeknoİLAN — Acil İstekler */
.ai-page{
  --a:#050505;
  --a2:#1c1e21;
  --brand:#007287;
  --brand-ink:#005a6b;
  --as:rgba(0,114,135,.14);
  --as-dark:rgba(17,17,17,.06);
  --ag:rgba(17,17,17,.12);
  --pbg:#f0f2f5;
  --psrf:#ffffff;
  --psrf2:#f0f2f5;
  --pbr:rgba(0,0,0,.08);
  --pbr2:#ccd0d5;
  --pt:#050505;
  --pt2:#65676b;
  --pt3:#8a8d91;
  --pr:14px;
  --psh:0 0 0 1px rgba(0,0,0,.08),0 1px 2px rgba(0,0,0,.05);
  --psh2:0 4px 16px rgba(0,114,135,.08),0 2px 8px rgba(0,0,0,.06);

  font-family:var(--font, 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif);
  background:#f0f4f6;
  padding:20px 0 72px;
  min-height:60vh;
  color:var(--pt);
  -webkit-font-smoothing:antialiased;
}

/* Grid */
.ai-grid{display:grid;grid-template-columns:1fr 292px;gap:24px;align-items:start}

/* ─── FEED COL ─── */
.ai-feed-col{display:flex;flex-direction:column;gap:16px;}

/* Compose card — “Start a post” benzeri */
.ai-compose-card{
  position:relative;
  background:var(--psrf);
  border-radius:8px;
  border:1px solid var(--pbr);
  box-shadow:var(--psh);
  overflow:visible;
  margin-bottom:0;
}
.ai-compose-card::before{
  content:'';
  position:absolute;
  left:0;right:0;top:0;
  height:3px;
  border-radius:8px 8px 0 0;
  background:linear-gradient(90deg,#007287,#38a8bd);
}
.ai-compose-top{
  display:flex;align-items:flex-start;gap:12px;
  padding:16px 16px 12px;
}
.ai-compose-ava{
  width:48px;height:48px;border-radius:50%;
  object-fit:cover;flex-shrink:0;
  border:1px solid var(--pbr);
  box-shadow:none;
}
.ai-compose-r{flex:1;min-width:0;position:relative;}
.ai-ed{
  width:100%;min-height:52px;max-height:220px;
  overflow-y:auto;
  border:1px solid var(--pbr2);
  border-radius:24px;
  padding:12px 16px;
  font-size:14px;line-height:1.6;
  font-family:inherit;
  color:var(--pt);
  background:var(--pbg);
  outline:none;
  word-break:break-word;
  transition:border-color .2s,box-shadow .2s,min-height .25s ease,background .2s;
}
.ai-ed:focus{
  border-color:var(--brand);
  box-shadow:0 0 0 1px var(--brand);
  background:var(--psrf);
  min-height:96px;
}
.ai-ed:empty::before{
  content:attr(data-ph);
  color:var(--pt3);
  font-style:normal;
  font-size:14px;
  font-weight:400;
  pointer-events:none;
}
.ai-hl{color:var(--brand);font-weight:700;}
a.acil-hashtag{color:#007287;font-weight:600;text-decoration:none;}
a.acil-hashtag:hover{text-decoration:underline;}

/* Tag dropdown */
.ai-drop{
  position:absolute;top:calc(100% + 6px);left:0;
  background:var(--psrf);
  border:1px solid var(--pbr);
  border-radius:12px;
  box-shadow:0 8px 32px rgba(0,0,0,.13);
  z-index:300;min-width:180px;overflow:hidden;display:none;
}
.ai-drop-item{
  padding:9px 14px;font-size:13px;font-weight:600;
  color:var(--a);cursor:pointer;transition:background .1s;
}
.ai-drop-item:hover{background:var(--as);}

/* Chips */
.ai-chips{display:flex;flex-wrap:wrap;gap:5px;padding:4px 18px 0;}
.ai-chip{padding:2px 10px;border-radius:999px;background:var(--as);color:var(--a);font-size:11px;font-weight:700;}
.ai-chip-warn{font-size:11px;font-weight:700;color:#111111;display:flex;align-items:center;gap:4px;}

/* Img preview */
.ai-imgrow{display:flex;gap:8px;flex-wrap:wrap;padding:4px 18px 0;}

/* Divider */
.ai-cdiv{height:1px;background:rgba(0,0,0,.06);margin:10px 0 0;}

/* Toolbar */
.ai-toolbar{
  display:flex;align-items:center;justify-content:space-between;
  padding:10px 18px 14px;gap:8px;
}
.ai-toolbar-l{display:flex;align-items:center;gap:6px;}
.ai-toolbar-r{display:flex;align-items:center;gap:8px;}

/* Cat btn */
.ai-catwrap{position:relative;}
.ai-catbtn{
  display:inline-flex;align-items:center;gap:6px;
  padding:7px 14px;border-radius:999px;
  border:2.5px solid var(--pbr);
  background:var(--psrf);color:var(--pt2);
  font-size:12px;font-weight:600;cursor:pointer;font-family:inherit;
  transition:.15s;white-space:nowrap;
}
.ai-catbtn:hover{border-color:var(--brand);color:var(--brand);}
.ai-catbtn.sel{border-color:var(--brand);color:var(--brand-ink);background:var(--as);}
.ai-catbtn.warn{border-color:#DC2626!important;color:#DC2626!important;animation:ashake .4s;}
@keyframes ashake{0%,100%{transform:translateX(0)}20%{transform:translateX(-5px)}40%{transform:translateX(5px)}60%{transform:translateX(-4px)}80%{transform:translateX(4px)}}

/* Cat tooltip balloon */
.ai-cattip{
  position:absolute;top:calc(100% + 10px);left:50%;
  transform:translateX(-50%) scale(.85);
  background:#DC2626;color:#fff;
  font-size:12px;font-weight:700;
  padding:7px 14px;border-radius:10px;
  white-space:nowrap;pointer-events:none;
  opacity:0;transition:.22s;z-index:400;
  box-shadow:0 4px 16px rgba(220,38,38,.3);
}
.ai-cattip::after{content:'';position:absolute;bottom:100%;left:50%;transform:translateX(-50%);border:6px solid transparent;border-bottom-color:#DC2626;}
.ai-cattip.show{opacity:1;transform:translateX(-50%) scale(1);}

/* Cat menu */
.ai-catmenu{
  position:absolute;top:calc(100% + 6px);left:0;
  background:var(--psrf);border:1px solid var(--pbr);
  border-radius:14px;box-shadow:0 8px 32px rgba(0,0,0,.13);
  z-index:350;min-width:210px;max-height:250px;overflow-y:auto;
  padding:6px 0;display:none;
}
.ai-catopt{
  padding:10px 16px;font-size:13px;font-weight:500;
  color:var(--pt);cursor:pointer;transition:background .1s;
}
.ai-catopt:hover{background:var(--psrf2);}
.ai-catopt.on{color:var(--brand);font-weight:700;}

/* Tool */
.ai-tool{
  width:34px;height:34px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  color:var(--pt3);cursor:pointer;border:none;background:transparent;
  transition:.15s;
}
.ai-tool:hover{background:var(--as);color:var(--brand);}

/* Counter */
.ai-ring{position:relative;width:28px;height:28px;display:none;align-items:center;justify-content:center;}
.ai-ring svg{position:absolute;}
.ai-ring-n{font-size:9px;font-weight:700;color:var(--pt3);position:relative;z-index:1;}

/* Post btn */
.ai-postbtn{
  display:inline-flex;align-items:center;gap:6px;
  padding:8px 20px;
  background:var(--brand);
  color:#fff;border:none;border-radius:24px;
  font-size:14px;font-weight:600;cursor:pointer;font-family:inherit;
  box-shadow:0 1px 2px rgba(0,0,0,.12);
  transition:transform .15s,box-shadow .15s,filter .15s,background .15s;white-space:nowrap;
}
.ai-postbtn:hover:not(:disabled){transform:none;box-shadow:0 2px 12px rgba(0,114,135,.45);filter:brightness(1.03);}
.ai-postbtn:disabled{opacity:.4;cursor:not-allowed;box-shadow:none;transform:none;filter:none;}

/* Notice */
.ai-compose-notice{
  display:flex;align-items:center;gap:6px;
  padding:10px 16px 8px;
  font-size:12px;color:var(--pt2);
  font-weight:500;
  background:rgba(0,0,0,.03);
  border-top:1px solid rgba(0,0,0,.06);
}
.ai-compose-info{
  display:flex;align-items:flex-start;gap:6px;
  margin:0;
  padding:7px 16px 10px;
  font-size:11px;line-height:1.45;font-weight:500;
  color:#0369a1;
  background:#f0f9ff;
  border-top:1px solid #e0f2fe;
  border-radius:0 0 8px 8px;
}
.ai-compose-info svg{flex-shrink:0;margin-top:1px;color:#0284c7;opacity:.9}

/* Login prompt */
.ai-login-prompt{
  background:var(--psrf);border-radius:8px;border:1px solid var(--pbr);
  box-shadow:var(--psh);padding:20px 18px;
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  flex-wrap:wrap;margin-bottom:0;
}
.ai-login-prompt strong{font-size:15px;color:var(--pt);display:block;margin-bottom:4px;font-weight:600;}
.ai-login-prompt span{font-size:13px;color:var(--pt2);}
.ai-login-btn{
  padding:10px 22px;background:var(--brand);
  color:#fff;border-radius:24px;text-decoration:none;
  font-size:14px;font-weight:600;transition:.15s;
  box-shadow:0 1px 2px rgba(0,0,0,.1);white-space:nowrap;border:none;
}
.ai-login-btn:hover{filter:brightness(1.06);box-shadow:0 2px 12px rgba(0,114,135,.4);}

/* Feed header (gezinme yan menüde; başlık kullanılmıyor) */
.ai-feed-brand{display:flex;align-items:center;gap:10px;margin-bottom:14px;}
.ai-feed-ico{
  width:36px;height:36px;border-radius:10px;
  background:linear-gradient(145deg,#007287,#005a6b);
  display:flex;align-items:center;justify-content:center;
  font-size:16px;flex-shrink:0;
  box-shadow:0 2px 8px rgba(0,114,135,.35);
}
.ai-feed-title{font-size:19px;font-weight:800;letter-spacing:-.4px;color:var(--pt);}
.ai-feed-title::after{
  content:'CANLI';
  margin-left:8px;
  font-size:10px;
  font-weight:800;
  letter-spacing:.3px;
  color:#fff;
  background:linear-gradient(135deg,#007287,#005a6b);
  padding:2px 7px;
  border-radius:999px;
}
.ai-status-notice{
  margin:10px 18px 14px;
  padding:10px 12px;
  border:1px solid #111111;
  background:#fff;
  color:#111111;
  border-radius:10px;
  font-size:12px;
  font-weight:700;
  display:none;
}

/* Tabs */
.ai-tabs{display:flex;overflow-x:auto;scrollbar-width:none;gap:0;}

/* Kategori kart grid */
.ai-cat-grid{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:20px;}
.ai-cat-card{display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px 14px;background:var(--psrf);border:1px solid var(--pbr);border-radius:8px;text-decoration:none;color:var(--pt2);font-size:12px;font-weight:600;transition:all .18s;cursor:pointer;min-width:88px;box-shadow:var(--psh);}
.ai-cat-card:hover{border-color:rgba(0,114,135,.5);color:var(--brand);background:var(--as);transform:translateY(-1px);box-shadow:var(--psh2);}
.ai-cat-card.on{border-color:var(--brand);background:var(--as);color:var(--brand-ink);}
.ai-cat-ico{font-size:26px;line-height:1;}
.ai-cat-lbl{text-align:center;line-height:1.3;}
.ai-tabs::-webkit-scrollbar{display:none;}
.ai-tab{
  padding:11px 17px;font-size:12px;font-weight:600;
  color:var(--pt3);text-decoration:none;white-space:nowrap;
  border-bottom:2.5px solid transparent;margin-bottom:-1px;
  transition:color .15s,border-color .15s;
}
.ai-tab:hover{color:var(--pt2);}
.ai-tab.on{color:var(--brand);border-bottom-color:var(--brand);font-weight:700;}

/* Kompakt kategori pill */
.ai-cpill{
  display:inline-flex;align-items:center;gap:4px;
  padding:6px 12px;border-radius:24px;
  border:1px solid var(--pbr);
  background:var(--psrf);color:var(--pt2);
  font-size:12px;font-weight:600;cursor:pointer;
  text-decoration:none;white-space:nowrap;
  transition:.15s;flex-shrink:0;
}
.ai-cpill:hover{border-color:rgba(0,0,0,.15);color:var(--pt);}
.ai-cpill.on{border-color:var(--brand);color:var(--brand-ink);background:var(--as);}

/* Tag banner */
.ai-tagbanner{
  display:flex;align-items:center;gap:8px;
  margin-top:0;
  border-radius:8px;
  padding:10px 14px;background:var(--psrf);
  border:1px solid var(--pbr);
  box-shadow:var(--psh);
  font-size:13px;font-weight:600;color:var(--pt2);
}
.ai-tagbanner a{margin-left:auto;color:var(--pt3);text-decoration:none;font-size:18px;line-height:1;}
.ai-tagbanner a:hover{color:var(--brand);}

/* Feed list container — kartlar arası boşluk */
.ai-feed-list{
  background:transparent;
  border:none;
  border-radius:0;
  overflow:visible;
  box-shadow:none;
  margin-top:0;
  display:flex;
  flex-direction:column;
  gap:12px;
}

/* ─── POST CARD — Soft oval gölgeli tasarım ─── */
.ai-card{
  padding:16px 16px 12px;
  border:none;
  border-radius:16px;
  background:#fff;
  transition:all .25s cubic-bezier(.4,0,.2,1);
  cursor:default;
  position:relative;
  box-shadow:
    0 1px 3px rgba(0,0,0,.08),
    0 4px 12px rgba(0,0,0,.05),
    inset 0 1px 0 rgba(255,255,255,.8);
}
.ai-card:hover{
  transform:translateY(-3px);
  box-shadow:
    0 8px 24px rgba(0,0,0,.1),
    0 2px 8px rgba(0,0,0,.06);
}
.ai-card.new{animation:aCardIn .45s cubic-bezier(.22,1,.36,1) both;}
@keyframes aCardIn{from{opacity:0;transform:translateY(-16px)}to{opacity:1;transform:none}}

/* Card header */
.ai-card-head{display:flex;align-items:flex-start;gap:12px;margin-bottom:10px;}
.ai-card-ava{
  width:48px;height:48px;border-radius:50%;
  object-fit:cover;flex-shrink:0;
  border:1px solid var(--pbr);
  transition:border-color .15s,opacity .15s;
}
.ai-card-ava:hover{border-color:rgba(0,0,0,.15);opacity:.92;}
.ai-card-meta{flex:1;min-width:0;}
.ai-meta-row{display:flex;align-items:center;gap:5px;flex-wrap:wrap;margin-bottom:2px;}
.ai-name{font-size:14px;font-weight:600;color:var(--pt);text-decoration:none;white-space:nowrap;}
.ai-name:hover{text-decoration:underline;color:var(--brand);}
.ai-handle{font-size:12px;color:var(--pt3);white-space:nowrap;}
.ai-sep{color:var(--pbr2);font-size:11px;}
.ai-time{font-size:12px;color:var(--pt3);white-space:nowrap;}
.ai-catpill{
  padding:2px 8px;border-radius:4px;
  font-size:11px;font-weight:600;
  background:var(--as);color:var(--brand-ink);
}
.ai-badge-p{font-size:10px;font-weight:600;padding:2px 8px;border-radius:999px;background:#FEF3C7;color:#92400E;}
.ai-badge-a{font-size:10px;font-weight:600;padding:2px 8px;border-radius:999px;background:#ECFDF5;color:#065F46;}

/* Action buttons on card header */
.ai-msgbtn{
  display:inline-flex;align-items:center;gap:5px;
  padding:6px 14px;border-radius:24px;
  border:1px solid var(--brand);background:transparent;
  color:var(--brand);font-size:13px;font-weight:600;
  text-decoration:none;transition:.15s;
  white-space:nowrap;flex-shrink:0;margin-left:auto;
}
.ai-msgbtn:hover{background:var(--as);color:var(--brand-ink);}
.ai-delbtn{
  width:30px;height:30px;border-radius:50%;border:none;
  background:transparent;color:var(--pt3);cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  transition:.15s;flex-shrink:0;margin-left:auto;
}
.ai-delbtn:hover{background:rgba(220,38,38,.1);color:#DC2626;}

/* Card body */
.ai-card-body{
  font-size:14px;line-height:1.65;color:var(--pt);
  margin:0 0 10px 60px;word-break:break-word;
}
.ai-htag{color:var(--brand);font-weight:600;text-decoration:none;transition:.1s;}
.ai-htag:hover{text-decoration:underline;opacity:.85;}

/* Post images */
.ai-pimgs{
  display:grid;grid-template-columns:1fr 1fr;
  gap:4px;border-radius:8px;overflow:hidden;
  border:1px solid var(--pbr);margin:8px 0 12px 60px;
  max-width:380px;
}
.ai-pimgs.one{grid-template-columns:1fr;max-width:260px;}
.ai-pimgs img{width:100%;height:150px;object-fit:cover;cursor:zoom-in;transition:opacity .15s;display:block;border-radius:0;}
.ai-pimgs.one img{height:190px;}
.ai-pimgs img:hover{opacity:.85;}

/* Actions bar — LinkedIn tarzı ikon şeridi */
.ai-card-actions{
  display:flex;align-items:center;gap:2px;
  padding-top:4px;border-top:1px solid rgba(0,0,0,.08);
  margin-left:60px;
  justify-content:space-between;
}
.ai-actbtn{
  display:inline-flex;align-items:center;gap:6px;
  padding:10px 8px;border-radius:4px;
  border:none;background:transparent;
  color:var(--pt3);font-size:12px;font-weight:600;
  cursor:pointer;font-family:inherit;transition:.12s;
  flex:1;justify-content:center;
}
.ai-actbtn svg{width:18px;height:18px;flex-shrink:0;transition:transform .15s;}
.ai-actbtn:hover{color:var(--pt2);background:rgba(0,0,0,.06);}
.ai-actbtn:hover svg{transform:none;}
.ai-actbtn.liked{color:#b91c1c;background:transparent;}
.ai-actbtn.liked:hover{background:rgba(220,38,38,.08);color:#991b1b;}
.ai-nc,.ai-nl{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;border-radius:4px;background:rgba(0,0,0,.06);color:var(--pt2);font-size:11px;font-weight:600;line-height:1;}

/* Comments */
.ai-cmts-wrap{
  margin:10px 0 0 60px;
  border-top:1px solid rgba(0,0,0,.08);
  padding-top:10px;
}
.ai-cmt{
  display:flex;gap:10px;margin-bottom:10px;
  padding:8px 10px;background:var(--pbg);border-radius:8px;
}
.ai-cmt-ava{width:28px;height:28px;border-radius:50%;object-fit:cover;flex-shrink:0;}
.ai-cmt-user{font-size:12px;font-weight:700;color:var(--pt);}
.ai-cmt-text{font-size:13px;color:var(--pt2);line-height:1.5;}
.ai-cmt-time{font-size:10px;color:var(--pt3);margin-top:2px;}
.ai-cmt-compose{display:flex;align-items:center;gap:8px;margin-top:8px;}
.ai-cmt-input{
  flex:1;padding:7px 14px;border:1.5px solid var(--pbr);
  border-radius:999px;font-size:13px;outline:none;
  background:var(--psrf2);color:var(--pt);
  transition:border-color .15s;font-family:inherit;
}
.ai-cmt-input:focus{border-color:var(--brand);}

/* Empty */
.ai-feed-list > .ai-empty{
  padding:48px 24px;
  text-align:center;
  border:none;
  border-top:2px solid #050505;
  border-bottom:2px solid #050505;
  border-left:4px solid var(--brand);
  border-right:4px solid var(--brand);
  border-radius:8px;
  background:var(--psrf);
  box-shadow:var(--psh);
}
.ai-empty{text-align:center;}
.ai-empty-ico{font-size:52px;margin-bottom:14px;}
.ai-empty-title{font-size:21px;font-weight:800;color:var(--pt);margin-bottom:6px;letter-spacing:-.4px;}
.ai-empty-sub{font-size:14px;color:var(--pt2);}

/* ─── SIDEBAR — LinkedIn sağ/sol kartları ─── */
.ai-sidebar{display:flex;flex-direction:column;gap:12px;position:sticky;top:calc(var(--site-header-h, 122px) + 12px);}
.ai-search-box{
  display:flex;align-items:center;gap:10px;
  padding:10px 14px;background:var(--psrf);
  border:1px solid var(--pbr);border-radius:6px;
  box-shadow:var(--psh);transition:.2s;
}
.ai-search-box:focus-within{border-color:var(--brand);box-shadow:0 0 0 1px var(--brand);}
.ai-search-box input{
  flex:1;border:none;outline:none;background:transparent;
  font-size:14px;color:var(--pt);font-family:inherit;
}
.ai-search-box input::placeholder{color:var(--pt3);}
.ai-sbox{
  background:var(--psrf);border:1px solid var(--pbr);
  border-radius:8px;overflow:hidden;box-shadow:var(--psh);
}
.ai-sbox-head{
  display:flex;align-items:center;gap:10px;
  padding:12px 14px 10px;border-bottom:1px solid rgba(0,0,0,.06);
}
.ai-sbox-head h3{font-size:15px;font-weight:600;color:var(--pt);letter-spacing:-.2px;}
.ai-sbox-empty{padding:14px 18px;font-size:13px;color:var(--pt3);}
.ai-sitem{
  display:flex;align-items:center;justify-content:space-between;
  padding:11px 18px;border-bottom:1px solid var(--pbr);
  text-decoration:none;color:inherit;transition:background .12s;cursor:pointer;
}
.ai-sitem:last-child{border-bottom:none;}
.ai-sitem:hover,.ai-sitem.on{background:var(--pbg);}
.ai-sitem.on .ai-sitem-tag{color:var(--brand);}
.ai-sitem-l{display:flex;align-items:center;gap:11px;}
.ai-sitem-num{
  width:22px;height:22px;border-radius:50%;
  background:var(--psrf2);border:1px solid var(--pbr);
  display:flex;align-items:center;justify-content:center;
  font-size:10px;font-weight:700;color:var(--pt3);flex-shrink:0;
}
.ai-sitem-tag{font-size:13px;font-weight:700;color:var(--pt);}
.ai-sitem-cnt{font-size:11px;color:var(--pt3);margin-top:1px;}
.ai-top-like-thumb{
  width:44px;height:44px;border-radius:10px;object-fit:cover;
  flex-shrink:0;border:1px solid var(--pbr);background:var(--psrf2);
}
.ai-top-like-thumb--empty{background:linear-gradient(135deg,var(--psrf2),var(--pbr));opacity:.6;}

/* Yan menü — Acil gezinme (kategori + sekmeler) */
.ai-sbox.ai-sbox-acil-nav .ai-sbox-head{
  flex-wrap:wrap;
  gap:8px 12px;
  align-items:center;
}
.ai-sbox-acil-nav-title{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}
.ai-sbox-acil-clear{
  margin-left:auto;
  font-size:12px;
  font-weight:700;
  color:var(--a);
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  gap:4px;
  white-space:nowrap;
}
.ai-sbox-acil-clear:hover{opacity:.85;}

/* Kategori açılır buton (mobil / tablet) */
.ai-cat-toggle{
  display:none;
  width:100%;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  margin:0;
  border:none;
  border-radius:10px;
  background:var(--psrf2);
  color:var(--pt);
  font-family:inherit;
  cursor:pointer;
  text-align:left;
  transition:background .15s, box-shadow .15s;
}
.ai-cat-toggle:hover{background:var(--pbg);}
.ai-cat-toggle.is-open{
  background:var(--as);
  box-shadow:inset 0 0 0 1px rgba(0,114,135,.2);
}
.ai-cat-toggle-ico{font-size:18px;line-height:1;flex-shrink:0;}
.ai-cat-toggle-text{
  flex:1;
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:2px;
}
.ai-cat-toggle-title{
  font-size:14px;
  font-weight:700;
  color:var(--pt);
}
.ai-cat-toggle-sub{
  font-size:12px;
  font-weight:600;
  color:var(--brand);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.ai-cat-toggle-chevron{
  flex-shrink:0;
  color:var(--pt3);
  transition:transform .2s ease;
}
.ai-cat-toggle.is-open .ai-cat-toggle-chevron{transform:rotate(180deg);}
.ai-cat-panel{display:block;}
.ai-cat-pills-row--sidebar{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  padding:0 14px 10px;
}
.ai-tabs--sidebar{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  padding:12px 14px 14px;
  margin:0;
  border-top:1px solid var(--pbr);
}
.ai-tabs--sidebar .ai-tab{
  margin-bottom:0;
  border-bottom:none;
  border-radius:10px;
  padding:8px 14px;
  background:var(--psrf2);
  border:1px solid var(--pbr);
  font-size:12px;
}
.ai-tabs--sidebar .ai-tab:hover{background:var(--psrf);}
.ai-tabs--sidebar .ai-tab.on{
  border-color:var(--brand);
  background:var(--as);
  color:var(--brand-ink);
}

/* Responsive */
@media(max-width:600px){
  .ai-page{padding:16px 0 60px;}
  .ai-card{padding:14px;}
  .ai-card-body,.ai-pimgs,.ai-card-actions,.ai-cmts-wrap{margin-left:0;}
  .ai-compose-top{padding:14px 14px 10px;}
  .ai-toolbar{padding:8px 14px 12px;}
}

/* ==========================================================
   Layout: sol sidebar + orta akış + sağ sidebar (üçlü grid)
   ========================================================== */
.ai-grid{
  grid-template-columns:260px 1fr 260px !important;
  gap:20px !important;
  max-width:1280px;
  margin:0 auto;
  align-items:start;
}
.ai-sidebar-left{
  position:sticky;
  top:calc(var(--site-header-h, 122px) + 12px);
  display:flex;
  flex-direction:column;
  gap:12px;
}
.ai-sidebar-right{
  position:sticky;
  top:calc(var(--site-header-h, 122px) + 12px);
  display:flex;
  flex-direction:column;
  gap:12px;
}
.ai-feed-col{
  max-width:100%;
  width:100%;
  min-width:0;
}
.ai-sbox-acil-clear{
  color:var(--brand);
}

/* ═══ Filtre Butonları (İsteklerim / En Çok Beğenilen) - Turuncu Alt Alta ═══ */
.ai-filter-tabs{
  display:flex;
  flex-direction:column;
  gap:8px;
  padding:14px 14px 16px;
  margin:0;
  border-top:1px solid var(--pbr);
  background:#fff;
}
.ai-filter-tab{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:12px 18px;
  border-radius:12px;
  font-size:13px;
  font-weight:600;
  text-decoration:none;
  white-space:nowrap;
  transition:all .2s ease;
  cursor:pointer;
  border:2px solid transparent;
  justify-content:flex-start;
  min-width:0;
  box-shadow:0 2px 4px rgba(0,114,135,.1);
}
.ai-filter-tab:not(.on){
  background:#fff;
  color:#007287;
  border-color:#cce5eb;
}
.ai-filter-tab:not(.on):hover{
  background:#e8f4f6;
  border-color:#007287;
  color:#007287;
  transform:translateY(-2px);
  box-shadow:0 4px 12px rgba(0,114,135,.15);
}
.ai-filter-tab.on{
  background:linear-gradient(135deg, #007287 0%, #005a6b 100%);
  color:#fff;
  border-color:#007287;
  box-shadow:0 4px 16px rgba(0,114,135,.35);
}
.ai-filter-tab.on:hover{
  background:linear-gradient(135deg, #007287 0%, #007287 100%);
  transform:translateY(-2px);
  box-shadow:0 6px 20px rgba(0,114,135,.45);
}
.ai-filter-tab svg{
  flex-shrink:0;
  width:18px;
  height:18px;
}
.ai-filter-tab.on svg{
  fill:currentColor;
  stroke-width:2.5;
}
.ai-photo-label{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:7px 12px;
  border-radius:999px;
  border:1.5px dashed var(--pbr);
  color:var(--pt2);
  font-size:12px;
  font-weight:600;
  cursor:pointer;
  transition:.15s;
  font-family:inherit;
  white-space:nowrap;
  max-width:100%;
}
.ai-photo-label:hover{
  border-color:var(--brand);
  color:var(--brand);
}

@media (max-width: 1100px) {
  .ai-grid{
    grid-template-columns:1fr !important;
    gap:14px !important;
    max-width:100%;
  }
  .ai-sidebar-left{
    position:sticky;
    top:calc(var(--site-header-h, 122px) - 1px);
    z-index:30;
    margin:0 -4px;
    padding-bottom:4px;
    background:linear-gradient(180deg,#f0f4f6 70%,transparent);
  }
  .ai-sidebar-right{
    position:static;
  }
  .ai-sbox-acil-nav .ai-sbox-head{
    padding:10px 14px 8px;
  }
  .ai-sbox-acil-nav-title{
    display:none;
  }
  .ai-cat-toggle{
    display:flex;
  }
  .ai-cat-panel{
    display:none;
    overflow:hidden;
  }
  .ai-cat-panel.is-open{
    display:block;
    animation:aiCatPanelIn .2s ease;
  }
  @keyframes aiCatPanelIn{
    from{opacity:0;transform:translateY(-4px);}
    to{opacity:1;transform:none;}
  }
  .ai-cat-pills-row--sidebar{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px 6px;
    overflow:visible;
    flex-wrap:unset;
    padding:0 14px 12px;
  }
  .ai-cat-pills-row--sidebar .ai-cpill{
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:4px;
    width:100%;
    min-height:56px;
    padding:8px 4px;
    font-size:10px;
    line-height:1.2;
    text-align:center;
    white-space:normal;
    border-radius:10px;
  }
  .ai-filter-tabs{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px;
    overflow:visible;
    flex-wrap:unset;
    border-top:1px solid var(--pbr);
    padding:10px 14px 12px;
    scrollbar-width:none;
  }
  .ai-filter-tabs::-webkit-scrollbar{display:none;}
  .ai-filter-tab{
    flex:unset;
    width:100%;
    justify-content:center;
    padding:10px 12px;
    box-shadow:none;
    text-align:center;
  }
  .ai-card-body,.ai-pimgs,.ai-card-actions,.ai-cmts-wrap{margin-left:0;}
  .ai-pimgs{max-width:100%;}
  .ai-card-head{align-items:center;}
  .ai-meta-row{row-gap:4px;}
  .ai-msgbtn{
    margin-left:auto;
    padding:5px 10px;
    font-size:12px;
  }
  .ai-toolbar{
    flex-direction:column;
    align-items:stretch;
    gap:10px;
  }
  .ai-toolbar-l,.ai-toolbar-r{
    width:100%;
    justify-content:space-between;
    flex-wrap:wrap;
  }
  .ai-postbtn{flex:1;justify-content:center;}
}

@media (max-width: 768px) {
  :root {
    --site-header-h: 178px;
  }
  .ai-page {
    padding: 10px 0 calc(76px + env(safe-area-inset-bottom, 0));
  }
  .ai-page > .container {
    padding-left: 12px;
    padding-right: 12px;
    max-width: 100%;
  }
  .ai-grid {
    padding-left: 0;
    padding-right: 0;
    gap: 12px !important;
  }
  .ai-sidebar-left {
    top: calc(var(--site-header-h) - 1px);
    margin: 0;
    padding-bottom: 6px;
    background: linear-gradient(180deg, #f0f4f6 85%, transparent);
  }
  .ai-sbox.ai-sbox-acil-nav {
    border-radius: 12px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
  }
  .ai-sbox-acil-nav-title h3 {
    font-size: 14px;
  }
  .ai-sbox-head--nav {
    padding: 8px 12px !important;
  }
  .ai-filter-tabs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    overflow: visible;
    padding: 0 12px 12px;
  }
  .ai-filter-tab {
    flex: unset;
    width: 100%;
    justify-content: center;
    padding: 10px 12px;
    font-size: 12px;
    text-align: center;
    box-shadow: none;
  }
  .ai-compose-card,
  .ai-card,
  .ai-login-prompt,
  .ai-tagbanner {
    border-radius: 12px;
  }
  .ai-compose-top {
    padding: 12px 12px 10px;
    gap: 10px;
  }
  .ai-compose-ava {
    width: 40px;
    height: 40px;
  }
  .ai-ed {
    min-height: 48px;
    font-size: 16px;
    padding: 11px 14px;
    border-radius: 20px;
  }
  .ai-ed:focus {
    min-height: 88px;
  }
  .ai-toolbar {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    padding: 10px 12px 12px;
  }
  .ai-toolbar-l {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 8px;
    width: 100%;
  }
  .ai-catbtn {
    width: 100%;
    justify-content: center;
    min-height: 44px;
    font-size: 13px;
  }
  .ai-photo-label {
    min-height: 44px;
    justify-content: center;
    padding: 0 12px;
  }
  .ai-toolbar-r {
    display: flex;
    width: 100%;
    gap: 8px;
  }
  .ai-postbtn {
    flex: 1;
    min-height: 44px;
    justify-content: center;
    font-size: 15px;
  }
  .ai-compose-notice,
  .ai-compose-info {
    padding-left: 12px;
    padding-right: 12px;
    font-size: 11px;
  }
  .ai-tagbanner {
    flex-wrap: wrap;
    gap: 6px;
    padding: 10px 12px;
    font-size: 12px;
  }
  .ai-tagbanner span {
    width: 100%;
    font-size: 11px !important;
  }
  .ai-card {
    padding: 12px;
  }
  .ai-card-head {
    flex-wrap: wrap;
    gap: 8px;
  }
  .ai-card-meta {
    flex: 1 1 calc(100% - 52px);
    min-width: 0;
  }
  .ai-meta-row {
    row-gap: 3px;
  }
  .ai-name,
  .ai-handle,
  .ai-time {
    font-size: 12px;
  }
  .ai-card-body,
  .ai-pimgs,
  .ai-card-actions,
  .ai-cmts-wrap {
    margin-left: 0;
  }
  .ai-card-body {
    font-size: 15px;
    line-height: 1.55;
    margin-bottom: 12px;
  }
  .ai-pimgs {
    max-width: 100%;
    margin-bottom: 10px;
  }
  .ai-pimgs img {
    height: 130px;
  }
  .ai-pimgs.one img {
    height: 170px;
  }
  .ai-msgbtn {
    width: 100%;
    margin: 4px 0 0;
    justify-content: center;
    min-height: 40px;
    order: 10;
  }
  .ai-delbtn {
    margin-left: auto;
  }
  .ai-card-actions {
    flex-wrap: nowrap;
    gap: 0;
    margin-left: 0;
    padding-top: 8px;
  }
  .ai-actbtn {
    flex: 1;
    min-width: 0;
    padding: 10px 4px;
    font-size: 11px;
    min-height: 44px;
  }
  .ai-actbtn svg {
    width: 18px;
    height: 18px;
  }
  .ai-nc,
  .ai-nl {
    font-size: 10px;
    min-width: 16px;
    height: 16px;
  }
  .ai-cmt-input {
    font-size: 16px;
    min-height: 40px;
  }
  .ai-sidebar-right {
    order: 3;
  }
  .ai-feed-col {
    order: 2;
  }
  .ai-sidebar-left {
    order: 1;
  }
  .ai-sbox-head {
    padding: 10px 12px 8px;
  }
  .ai-empty {
    padding: 32px 16px;
  }
  .ai-empty-title {
    font-size: 18px;
  }
  .ai-cat-pills-row--toolbar {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 6px;
    overflow: visible;
    padding-bottom: 0;
  }
  .ai-cat-pill {
    flex-shrink: unset;
    width: 100%;
    justify-content: center;
    text-align: center;
    font-size: 10px;
    padding: 8px 4px;
    min-height: 52px;
  }
  .ai-catmenu {
    position: fixed;
    left: 12px;
    right: 12px;
    bottom: calc(12px + env(safe-area-inset-bottom, 0));
    top: auto;
    min-width: 0;
    max-height: min(52vh, 340px);
    border-radius: 16px;
    z-index: 2100;
    box-shadow: 0 -4px 32px rgba(0, 0, 0, 0.18);
  }
  .ai-cattip {
    left: 50%;
    bottom: calc(100% + 8px);
    transform: translateX(-50%) scale(0.95);
    white-space: nowrap;
  }
  .ai-cattip.show {
    transform: translateX(-50%) scale(1);
  }
  .ai-sidebar-right .ai-sbox {
    border-radius: 12px;
  }
  .ai-sidebar-right .ai-sitem {
    padding: 12px 14px;
  }
  .ai-card:hover {
    transform: none;
    box-shadow:
      0 1px 3px rgba(0, 0, 0, 0.08),
      0 4px 12px rgba(0, 0, 0, 0.05),
      inset 0 1px 0 rgba(255, 255, 255, 0.8);
  }
  .ai-lightbox img {
    max-width: calc(100vw - 24px);
    max-height: calc(100vh - 80px);
  }
  .ai-status-notice {
    margin: 8px 12px 12px;
    font-size: 11px;
  }
  .ai-chips,
  .ai-imgrow {
    padding-left: 12px;
    padding-right: 12px;
  }
  .ai-cmts-wrap {
    padding-top: 8px;
  }
}

@media (max-width: 640px) {
  .ai-page {
    padding: 10px 0 calc(72px + env(safe-area-inset-bottom, 0));
  }
  .ai-compose-top {
    padding: 12px;
  }
  .ai-card {
    padding: 12px;
  }
  .ai-card-ava {
    width: 40px;
    height: 40px;
  }
  .ai-login-prompt {
    flex-direction: column;
    text-align: center;
    align-items: stretch;
  }
  .ai-login-btn {
    width: 100%;
    text-align: center;
  }
  .ai-photo-label-txt {
    display: none;
  }
  .ai-photo-label {
    padding: 8px 10px;
  }
  .ai-cat-pills-row--sidebar .ai-cpill {
    min-height: 54px;
    font-size: 9px;
  }
}