/* Container trim */
.content-section{
  overflow:hidden;
  position:relative;
  background:#fff;
  box-sizing:border-box;
}

/* Hiệu ứng mờ đáy: dùng pseudo, không còn div overlay nên không thể "biến mất" */
.content-section.is-trimmed::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:0;
  height:75px;
  background:linear-gradient(to bottom, rgba(255,255,255,0), rgba(255,255,255,.62), rgba(255,255,255,1));
  pointer-events:none;
  z-index:1;
}

/* TOC/accordion ẩn tab không ảnh hưởng đo */
.tab-panels .panel:not(.active){ height:0 !important; visibility:hidden; }

/* Buttons: đặt BÊN NGOÀI container (sibling) */
.devvn_readmore,
.devvn_readless{
  text-align:center;
  margin-top:10px;
}

.devvn_readmore button,
.devvn_readless button{
  color:var(--primary-color,#0073aa);
  font-weight:500;
  max-width:200px;
  margin:10px auto;
  font-size:15px;
  border:1px solid var(--primary-color,#0073aa);
  padding:6px 16px;
  border-radius:4px;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  background:#fff;
}

.devvn_readmore button::after{
  content:'';
  border-top:4px solid var(--primary-color,#0073aa);
  border-left:4px solid transparent;
  border-right:4px solid transparent;
  display:inline-block;
  vertical-align:middle;
  margin:-2px 0 0 6px;
}
.devvn_readless button{
  background:transparent;
}
.devvn_readless button::after{
  content:'';
  border-bottom:4px solid var(--primary-color,#0073aa);
  border-left:4px solid transparent;
  border-right:4px solid transparent;
  display:inline-block;
  vertical-align:middle;
  margin:-2px 0 0 6px;
}

/* Responsive */
@media (max-width:768px){
  .content-section.is-trimmed::after{ height:50px; }
  .devvn_readmore button,
  .devvn_readless button{
    max-width:150px; font-size:14px; padding:4px 10px;
  }
}

/* Accessibility */
.devvn_readmore button:focus,
.devvn_readless button:focus{
  outline:2px solid var(--primary-color,#0073aa);
  outline-offset:2px;
}