.category-discription.is-clamped {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: var(--rm-lines, 1);   /* kisi section me alag lines chahiye to --rm-lines override karo */
  line-clamp: var(--rm-lines, 1);
  overflow: hidden;
}

.rm-btn {
  display: inline-block;
  margin-top: 4px;
  padding: 6px 0;
  min-height: 32px;
  border: 0; background: none; box-shadow: none;
  color: var(--primary-color, #0f766e);
  font: inherit; font-weight: 600; font-size: .9rem;
  cursor: pointer; text-decoration: underline;
  -webkit-tap-highlight-color: transparent;
}
.rm-btn[hidden] { display: none; }   /* IMPORTANT: display:inline-block hidden ko override kar deta hai */
.rm-btn:hover { opacity: .8; }
.rm-btn:focus-visible { outline: 2px solid var(--primary-color, #0f766e); outline-offset: 2px; border-radius: 4px; }

.category-discription{
  margin:0;
  font-size:15px;
  line-height:1.6;
  color:var(--on-surface-secondary);
}

/* collapsed: sirf ek line, JS text kaat ke "… More" lagata hai */
.category-discription.rm-collapsed{
  white-space:nowrap;
  overflow:hidden;
}

/* inline More / Less */
.category-discription .rm-btn{
  all:unset;
  display:inline;
  cursor:pointer;
  font-family:"Poppins",sans-serif;
  font-size:.9em;
  font-weight:600;
  color:var(--button-primary-bg, var(--primary-color, #0f766e));
  text-decoration:underline;
  text-underline-offset:3px;
  white-space:nowrap;
}
.category-discription .rm-btn:hover{ opacity:.8; }
.category-discription .rm-btn:focus-visible{
  outline:2px solid currentColor;
  outline-offset:2px;
  border-radius:4px;
}

@media (max-width:768px){
  .category-discription{ font-size:14px; }
}