/* ============================================================================
 * PRODUCT CATEGORY ARCHIVE  —  Khorraman
 * Brand system: deep green (#016644) + lime (#D8E41F) on a soft mint canvas.
 * Scoped under .khr-cat; works RTL (fa) and LTR (en/ru) via logical properties.
 * ========================================================================== */

.khr-cat{
  --khr-lime:#D8E41F;
  --khr-green:#099B55;
  --khr-green2:#13c06b;
  --khr-deep:#016644;
  --khr-forest:#015134;
  --khr-bg:#f6fbf8;
  --khr-card:#fff;
  --khr-border:#d7e4dd;
  --khr-text:#173325;
  --khr-muted:#5f6e66;
  --khr-shadow:0 14px 28px rgba(1,81,52,.10);
  color:var(--khr-text);
  box-sizing:border-box;
}
.khr-cat *{box-sizing:border-box}

/* ── Hero ────────────────────────────────────────────────────────────── */
.khr-cat__hero{
  position:relative;
  min-height:420px;
  display:flex;
  align-items:flex-end;
  background-size:cover;
  background-position:center;
  color:#fff;
  overflow:hidden;
}
.khr-cat__hero--plain{
  background:radial-gradient(120% 140% at 100% 0%, #099B55 0%, #016644 45%, #015134 100%);
}
.khr-cat__heroOverlay{
  position:absolute;inset:0;
  background:linear-gradient(180deg, rgba(1,81,52,.15) 0%, rgba(1,81,52,.55) 55%, rgba(1,60,39,.92) 100%);
}
/* subtle lime seam along the bottom */
.khr-cat__hero:after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:5px;
  background:linear-gradient(90deg,var(--khr-lime),var(--khr-green),var(--khr-lime));
}
.khr-cat__heroInner{
  position:relative;z-index:2;
  width:95%;max-width:1200px;margin:0 auto;
  padding:118px 0 46px; /* top clears the floating absolute header (~90px) */
}
.khr-cat__crumbs{display:flex;align-items:center;gap:10px;font-size:.86rem;margin-bottom:18px;opacity:.92}
.khr-cat__crumbs a{color:#eafff5;text-decoration:none;transition:color .2s}
.khr-cat__crumbs a:hover{color:var(--khr-lime)}
.khr-cat__crumbSep{opacity:.6}
.khr-cat__crumbCurrent{color:var(--khr-lime);font-weight:600}
.khr-cat__kicker{
  display:inline-block;font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--khr-lime);background:rgba(216,228,31,.14);border:1px solid rgba(216,228,31,.35);
  padding:6px 14px;border-radius:999px;margin-bottom:16px;
}
.khr-cat__title{
  margin:0;font-size:clamp(2rem,4vw,3.4rem);line-height:1.1;font-weight:800;letter-spacing:-.02em;
  text-shadow:0 2px 18px rgba(0,0,0,.25);
}
.khr-cat__desc{margin-top:14px;max-width:680px;line-height:1.75;font-size:1rem;color:#eafff5;opacity:.95}
.khr-cat__desc p{margin:0 0 8px}
.khr-cat__count{
  display:inline-flex;align-items:center;gap:9px;margin-top:22px;
  background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22);backdrop-filter:blur(4px);
  padding:9px 16px;border-radius:12px;font-size:.92rem;
}
.khr-cat__count strong{color:var(--khr-lime);font-size:1.05rem}
.khr-cat__count svg{width:18px;height:18px;fill:none;stroke:var(--khr-lime);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}

/* ── Wrap ────────────────────────────────────────────────────────────── */
.khr-cat__wrap{width:95%;max-width:1200px;margin:0 auto;padding:40px 0 90px}

/* ── Category chips ──────────────────────────────────────────────────── */
.khr-cat__chips{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:34px}
.khr-cat__chip{
  display:inline-block;padding:9px 18px;border-radius:999px;font-size:.9rem;font-weight:600;
  color:var(--khr-deep);background:var(--khr-card);border:1px solid var(--khr-border);
  text-decoration:none;transition:transform .2s,box-shadow .2s,background .2s,color .2s,border-color .2s;
}
.khr-cat__chip:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(1,81,52,.12);border-color:var(--khr-green);color:var(--khr-green)}
.khr-cat__chip--active{background:linear-gradient(135deg,var(--khr-deep),var(--khr-forest));color:#fff;border-color:transparent;cursor:default}
.khr-cat__chip--active:hover{transform:none;box-shadow:none;color:#fff}

/* ── Product grid ────────────────────────────────────────────────────── */
.khr-cat__grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(250px,1fr));
  gap:24px;
}
.khr-cat__card{
  position:relative;display:flex;flex-direction:column;
  background:linear-gradient(180deg,#fff,#fbfdfc);
  border:1px solid var(--khr-border);border-radius:20px;overflow:hidden;
  text-decoration:none;color:inherit;
  box-shadow:0 8px 24px rgba(1,81,52,.06);
  transition:transform .3s cubic-bezier(.25,.46,.45,.94),box-shadow .3s,border-color .3s;
}
.khr-cat__card:hover{transform:translateY(-6px);box-shadow:0 22px 42px rgba(1,81,52,.13);border-color:rgba(9,155,85,.5)}

.khr-cat__cardImg{
  position:relative;height:210px;padding:22px;
  display:flex;align-items:center;justify-content:center;
  background:radial-gradient(120% 120% at 50% 0%, #f8fcf9 0%, #eef6f1 100%);
  border-bottom:1px solid var(--khr-border);
}
.khr-cat__cardImg img{
  max-width:100%;max-height:100%;object-fit:contain;
  filter:drop-shadow(0 6px 14px rgba(1,81,52,.12));
  transition:transform .4s ease;
}
.khr-cat__card:hover .khr-cat__cardImg img{transform:scale(1.06)}
.khr-cat__cardNoImg{display:grid;place-items:center;width:70px;height:70px;opacity:.4}
.khr-cat__cardNoImg svg{width:100%;height:100%;fill:none;stroke:var(--khr-green);stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.khr-cat__cardBadge{
  position:absolute;top:12px;inset-inline-start:12px;
  background:linear-gradient(135deg,var(--khr-lime),#eef36a);color:var(--khr-forest);
  font-size:.7rem;font-weight:700;padding:4px 11px;border-radius:999px;
  box-shadow:0 4px 12px rgba(216,228,31,.3);
}

.khr-cat__cardBody{padding:20px;display:flex;flex-direction:column;gap:10px;flex:1}
.khr-cat__cardTitle{
  margin:0;font-size:1.06rem;font-weight:700;color:var(--khr-deep);line-height:1.4;letter-spacing:-.01em;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.khr-cat__cardText{
  margin:0;font-size:.88rem;line-height:1.6;color:var(--khr-muted);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.khr-cat__cardCta{
  margin-top:auto;display:inline-flex;align-items:center;gap:8px;
  color:var(--khr-green);font-weight:700;font-size:.92rem;padding-top:6px;
}
.khr-cat__cardCta svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .25s ease}
[dir="rtl"] .khr-cat__cardCta svg{transform:scaleX(-1)}
.khr-cat__card:hover .khr-cat__cardCta svg{transform:translateX(4px)}
[dir="rtl"] .khr-cat__card:hover .khr-cat__cardCta svg{transform:scaleX(-1) translateX(4px)}

/* ── Empty state ─────────────────────────────────────────────────────── */
.khr-cat__empty{
  text-align:center;padding:72px 24px;
  background:var(--khr-bg);border:2px dashed var(--khr-border);border-radius:20px;color:var(--khr-muted);
}
.khr-cat__empty svg{width:52px;height:52px;fill:none;stroke:var(--khr-green);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;opacity:.6;margin-bottom:14px}
.khr-cat__empty p{margin:0 0 20px;font-size:1.02rem}
.khr-cat__emptyBtn{
  display:inline-block;padding:12px 26px;border-radius:12px;text-decoration:none;font-weight:700;
  background:linear-gradient(135deg,var(--khr-green),var(--khr-green2));color:#fff;
  box-shadow:0 10px 20px rgba(9,155,85,.2);transition:transform .2s,box-shadow .25s;
}
.khr-cat__emptyBtn:hover{transform:translateY(-2px);box-shadow:0 16px 28px rgba(1,81,52,.22)}

/* ── Pagination ──────────────────────────────────────────────────────── */
.khr-cat__pagination{margin-top:48px;display:flex;justify-content:center}
.khr-cat__pagination .page-numbers{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0}
.khr-cat__pagination .page-numbers li{margin:0}
.khr-cat__pagination .page-numbers a,
.khr-cat__pagination .page-numbers span{
  display:grid;place-items:center;min-width:44px;height:44px;padding:0 12px;border-radius:12px;
  background:var(--khr-card);border:1px solid var(--khr-border);color:var(--khr-deep);
  text-decoration:none;font-weight:700;transition:transform .2s,box-shadow .2s,background .2s,color .2s;
}
.khr-cat__pagination .page-numbers a:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(1,81,52,.12);border-color:var(--khr-green);color:var(--khr-green)}
.khr-cat__pagination .page-numbers .current{background:linear-gradient(135deg,var(--khr-deep),var(--khr-forest));color:#fff;border-color:transparent}
.khr-cat__pagination .page-numbers .dots{background:transparent;border-color:transparent}

/* ── Responsive ──────────────────────────────────────────────────────── */
@media (max-width:768px){
  .khr-cat__hero{min-height:320px}
  .khr-cat__heroInner{padding:108px 0 30px}
  .khr-cat__grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:16px}
  .khr-cat__cardImg{height:160px;padding:16px}
  .khr-cat__cardBody{padding:16px}
}
@media (max-width:480px){
  .khr-cat__grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .khr-cat__cardText{display:none}
}
@media (prefers-reduced-motion:reduce){
  .khr-cat__card,.khr-cat__chip,.khr-cat__emptyBtn,.khr-cat__cardImg img,.khr-cat__cardCta svg{transition:none}
  .khr-cat__card:hover{transform:none}
}