/* Ruyapanel - Blog başlık, kategori ve sıralama alanı final düzeltme
   Sadece blog/kategori liste üst alanlarını hedefler. Ağır JS yoktur. */
:root{
  --rp-blog-primary: var(--c-chat, var(--ss-neon-primary, #FF3D71));
  --rp-blog-secondary: var(--c-system, var(--ss-neon-secondary, #00C9A7));
  --rp-blog-warn: var(--c-register, var(--ss-neon-warn, #FF9F43));
  --rp-blog-bg: var(--ink, var(--ss-neon-bg, #0D0D0D));
  --rp-blog-paper: var(--paper, var(--ss-neon-paper, #141414));
  --rp-blog-surface: var(--surface, var(--ss-neon-surface, #1A1A1A));
  --rp-blog-text: var(--bright, #FFFFFF);
  --rp-blog-muted: rgba(255,255,255,.58);
  --rp-blog-line: rgba(255,255,255,.08);
}

.blog-wrap,
.cat-wrap{
  width:100%!important;
  max-width:1340px!important;
  margin:0 auto 72px!important;
  padding:0 28px!important;
  box-sizing:border-box!important;
}

.blog-wrap a,
.cat-wrap a{text-decoration:none!important;}

/* Üst başlık kutusu: Blog Yazıları / Kategori başlığı */
.blog-hero-head,
.cat-hero-head{
  position:relative!important;
  display:block!important;
  width:100%!important;
  margin:0 0 22px!important;
  padding:0!important;
  border-radius:24px!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 8% 0%, color-mix(in srgb,var(--rp-blog-primary) 16%, transparent), transparent 36%),
    linear-gradient(135deg, rgba(255,255,255,.045), rgba(255,255,255,.018) 42%, rgba(255,61,113,.045))!important;
  border:1px solid color-mix(in srgb,var(--rp-blog-primary) 22%, rgba(255,255,255,.06))!important;
  box-shadow:0 18px 55px rgba(0,0,0,.26)!important;
}
.blog-hero-head::before,
.cat-hero-head::before{
  content:''!important;
  position:absolute!important;
  inset:0!important;
  background:linear-gradient(90deg, color-mix(in srgb,var(--rp-blog-primary) 7%, transparent), transparent 34%, color-mix(in srgb,var(--rp-blog-secondary) 5%, transparent))!important;
  pointer-events:none!important;
}
.blog-hero-head::after,
.cat-hero-head::after{
  content:''!important;
  position:absolute!important;
  left:0!important;
  top:0!important;
  width:100%!important;
  height:2px!important;
  background:linear-gradient(90deg, transparent, var(--rp-blog-primary), var(--rp-blog-secondary), transparent)!important;
  opacity:.85!important;
}
.blog-head-inner,
.cat-head-inner{
  position:relative!important;
  z-index:1!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:18px!important;
  padding:28px 30px!important;
}
.blog-head-left,
.cat-head-left{
  display:flex!important;
  align-items:center!important;
  gap:18px!important;
  min-width:0!important;
}
.blog-head-icon,
.cat-head-icon{
  width:62px!important;
  height:62px!important;
  min-width:62px!important;
  border-radius:18px!important;
  display:grid!important;
  place-items:center!important;
  color:#fff!important;
  font-size:25px!important;
  background:
    radial-gradient(circle at 30% 25%, rgba(255,255,255,.25), transparent 32%),
    linear-gradient(135deg, var(--rp-blog-primary), color-mix(in srgb,var(--rp-blog-primary) 55%, #7c3aed), var(--rp-blog-secondary))!important;
  box-shadow:0 0 30px color-mix(in srgb,var(--rp-blog-primary) 28%, transparent)!important;
  transform:rotate(-7deg)!important;
}
.blog-head-title,
.cat-head-title{
  display:block!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  color:#fff!important;
  font-family:'Syne', 'DM Sans', sans-serif!important;
  font-size:42px!important;
  line-height:1.02!important;
  font-weight:950!important;
  letter-spacing:-.055em!important;
  text-shadow:0 10px 34px rgba(0,0,0,.36)!important;
}
.blog-head-sub,
.cat-head-sub{
  display:block!important;
  margin:8px 0 0!important;
  color:color-mix(in srgb,var(--rp-blog-primary) 50%, rgba(255,255,255,.55))!important;
  font-size:12px!important;
  line-height:1.2!important;
  font-weight:900!important;
  letter-spacing:.22em!important;
  text-transform:uppercase!important;
}
.blog-head-stats,
.cat-head-stats{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  flex-wrap:wrap!important;
  gap:10px!important;
}
.blog-stat-pill,
.cat-stat-pill{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  min-height:40px!important;
  padding:0 16px!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.04)!important;
  border:1px solid color-mix(in srgb,var(--rp-blog-primary) 22%, rgba(255,255,255,.08))!important;
  color:#fff!important;
  font-size:12px!important;
  font-weight:900!important;
  white-space:nowrap!important;
}
.blog-stat-pill i,
.cat-stat-pill i{color:var(--rp-blog-primary)!important;}

/* Filtre / kategori / sıralama alanı */
.blog-controls,
.cat-controls{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:16px!important;
  flex-wrap:wrap!important;
  width:100%!important;
  margin:0 0 22px!important;
  padding:0!important;
}
.blog-filter-list{
  display:flex!important;
  align-items:center!important;
  flex-wrap:wrap!important;
  gap:9px!important;
  min-width:0!important;
  flex:1 1 auto!important;
}
.blog-filter-btn,
.cat-sort-btn{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  min-height:38px!important;
  padding:0 14px!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.035)!important;
  border:1px solid rgba(255,255,255,.075)!important;
  color:rgba(255,255,255,.68)!important;
  font-family:'DM Sans', sans-serif!important;
  font-size:12px!important;
  line-height:1!important;
  font-weight:900!important;
  white-space:nowrap!important;
  box-shadow:none!important;
  transition:background .18s ease, color .18s ease, border-color .18s ease, transform .18s ease, box-shadow .18s ease!important;
}
.blog-filter-btn:hover,
.blog-filter-btn.active,
.cat-sort-btn:hover,
.cat-sort-btn.active{
  color:#fff!important;
  background:linear-gradient(135deg, var(--rp-blog-primary), color-mix(in srgb,var(--rp-blog-primary) 62%, #7c3aed))!important;
  border-color:color-mix(in srgb,var(--rp-blog-primary) 55%, transparent)!important;
  box-shadow:0 12px 30px color-mix(in srgb,var(--rp-blog-primary) 20%, transparent)!important;
  transform:translateY(-1px)!important;
}
.blog-filter-btn i,
.cat-sort-btn i{font-size:12px!important;}
.blog-filter-btn .bs-count,
.blog-filter-btn span,
.cat-sort-btn .bs-count{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:22px!important;
  height:22px!important;
  padding:0 7px!important;
  border-radius:999px!important;
  margin-left:2px!important;
  background:color-mix(in srgb,var(--rp-blog-primary) 18%, rgba(255,255,255,.06))!important;
  color:#fff!important;
  font-size:11px!important;
  font-weight:950!important;
}
.blog-filter-btn:hover .bs-count,
.blog-filter-btn.active .bs-count,
.blog-filter-btn:hover span,
.blog-filter-btn.active span{
  background:rgba(255,255,255,.20)!important;
  color:#fff!important;
}
.cat-view-toggle{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  margin-left:auto!important;
  flex:0 0 auto!important;
}

/* Blog grid ve kartların üst alanla birlikte düzgün oturması */
.blog-card-grid,
.cat-grid{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:22px!important;
  width:100%!important;
  align-items:stretch!important;
}
.cat-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;}
.blog-card,
.cat-card{
  min-width:0!important;
  overflow:hidden!important;
}
.bc-title,
.cc-title,
.cat-title{
  word-break:normal!important;
  overflow-wrap:anywhere!important;
}

.rp-pagination{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex-wrap:wrap!important;
  gap:8px!important;
  margin:26px 0 0!important;
}
.rp-page-btn{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:40px!important;
  height:40px!important;
  border-radius:13px!important;
  background:rgba(255,255,255,.04)!important;
  border:1px solid rgba(255,255,255,.08)!important;
  color:#fff!important;
  font-size:13px!important;
  font-weight:950!important;
}
.rp-page-btn:hover,
.rp-page-btn.active{
  background:var(--rp-blog-primary)!important;
  border-color:var(--rp-blog-primary)!important;
  box-shadow:0 12px 28px color-mix(in srgb,var(--rp-blog-primary) 25%, transparent)!important;
}

/* Makale altındaki yorum formu için en son güvenli dokunuş: yalnızca rp-comment-card içi */
.rp-comment-card input,
.rp-comment-card textarea,
.rp-comment-card button{
  font-family:'DM Sans',sans-serif!important;
}

@media(max-width:1100px){
  .blog-head-inner,.cat-head-inner{align-items:flex-start!important;flex-direction:column!important;padding:24px!important;}
  .blog-head-stats,.cat-head-stats{justify-content:flex-start!important;}
  .cat-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}
@media(max-width:760px){
  .blog-wrap,.cat-wrap{padding:0 16px!important;margin-bottom:44px!important;}
  .blog-head-title,.cat-head-title{font-size:32px!important;}
  .blog-head-icon,.cat-head-icon{width:54px!important;height:54px!important;min-width:54px!important;font-size:22px!important;}
  .blog-controls,.cat-controls{align-items:flex-start!important;flex-direction:column!important;}
  .cat-view-toggle{margin-left:0!important;width:100%!important;}
  .cat-sort-btn{flex:1!important;}
  .blog-card-grid,.cat-grid{grid-template-columns:1fr!important;gap:18px!important;}
  .blog-filter-list{gap:7px!important;}
  .blog-filter-btn{min-height:36px!important;padding:0 12px!important;font-size:11px!important;}
}