/* ==========================================================
   /modules/kategori/css/02-base.css  (FULL PRO / SAFE SCOPE)
   - Sadece .kategori-page scope (site geneli BOZULMAZ)
   - Typography + container + overflow/CLS önlemleri
   - Magaza’daki “tatlı grimsi” hissi: container arkaplan + border + shadow
   ========================================================== */

/* ✅ Kategori alanı: temel font/renk + arkaplan (SADECE container içinde) */
.container.kategori-page{
  width: 100%;
  max-width: var(--container-max, var(--container, 1140px));
  margin: 0 auto;
  padding: 18px 12px 28px;
  min-width: 0;

  font: var(--w-regular, 400) 16px/1.55 var(--font, system-ui);
  color: var(--text, #0f172a);

  /* ✅ Magaza gibi tatlı arkaplan hissi */
  background:
    radial-gradient(1200px 600px at 10% -10%, rgba(37,99,235,.06), transparent 55%),
    radial-gradient(900px 500px at 110% 10%, rgba(15,23,42,.04), transparent 55%),
    var(--bg, #f6f7fb);

  border-radius: var(--r-2xl, 20px);
  border: 1px solid rgba(15,23,42,.06);
  box-shadow: 0 14px 30px rgba(15,23,42,.08);

  /* CLS/taşma güvenliği */
  overflow-x: clip;
}
@supports not (overflow: clip){
  .container.kategori-page{ overflow-x:hidden; }
}

/* ✅ GLOBAL body/html’e DOKUNMA (kategori header zıplamasını tetikleyebilir) */

/* Box sizing sadece kategori scope */
.container.kategori-page,
.container.kategori-page *{
  box-sizing: border-box;
}

/* Media reset */
.container.kategori-page :is(img,svg,video,canvas){
  display:block;
  max-width:100%;
  height:auto;
}

/* Linkler sadece kategori içinde */
.container.kategori-page a{
  color: inherit;
  text-decoration: none;
}

/* Form normalize */
.container.kategori-page :is(button,input,select,textarea){
  font: inherit;
  color: inherit;
  letter-spacing: inherit;
}

/* iOS zoom fix */
@media (max-width: 920px){
  .container.kategori-page :is(input,select,textarea){ font-size: 16px; }
}

/* Taşma önlemleri */
.container.kategori-page :is(.layout,.sidebar,.content,.filter-body,.f-group,.grid3,.head){
  min-width: 0;
}
.container.kategori-page :is(.page-title,.count,.title,.badge,label){
  overflow-wrap:anywhere;
  word-break: break-word;
}

/* ----------------------------------------------------------
   Head / Title (magaza ile aynı his)
   ---------------------------------------------------------- */
.kategori-page .head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: var(--s3, 12px);
  min-width:0;
}

.kategori-page .head.page-head{
  margin: 0 0 var(--s3, 12px);
  padding: 0;
}

.kategori-page .page-title{
  margin:0;
  font-size: 1.35rem;
  font-weight: var(--w-black, 900);
  letter-spacing: -0.01em;
  line-height: 1.15;
}

/* Genel metin ölçüleri (kategori alanı içinde) */
.kategori-page :where(h1,h2,h3){
  line-height: 1.2;
  letter-spacing: -0.01em;
  color: var(--text, #0f172a);
}

.kategori-page :where(p){
  margin: 0 0 var(--s3, 12px);
  color: var(--muted, #64748b);
}

/* Focus ring (sadece kategori scope) */
.container.kategori-page :is(a,button,input,select,textarea):focus{ outline:none; }
.container.kategori-page :is(a,button,input,select,textarea):focus-visible{
  box-shadow: var(--focus, 0 0 0 3px rgba(37,99,235,.14));
  border-color: rgba(37,99,235,.55);
}

/* Selection rengi (sadece kategori scope) */
.container.kategori-page ::selection{
  background: rgba(37,99,235,.18);
}