/**
 * scn-side — ảnh trái, chuyên mục + tiêu đề + tóm tắt bên PHẢI.
 *
 * Đây là kiểu duy nhất trong bộ đặt `display: flex` lên `.jacl-item__inner`;
 * các kiểu khác để `block` vì chữ xếp dưới ảnh.
 */

.scn-side .jacl-item__inner {
  display: flex;
  align-items: flex-start;
  gap: 16px;
}

/* Ảnh giữ bề ngang cố định để mọi thẻ trong danh sách thẳng hàng nhau; phần
   chữ co giãn chiếm nốt chỗ còn lại.
   `min-width: 0` là bắt buộc trên phần tử flex có chữ: không có nó, một tiêu đề
   dài sẽ nong thẻ rộng ra thay vì xuống dòng. */
.scn-side .jacl-item__media {
  flex: 0 0 38%;
  max-width: 38%;
  margin-bottom: 0;
  border-radius: 8px;
}

.scn-side .jacl-item__body {
  flex: 1 1 auto;
  min-width: 0;
  padding: 0;
}

/* Không có ảnh thì chữ dùng trọn bề ngang. */
.scn-side:not(.has-media) .jacl-item__inner {
  display: block;
}

/* Thẻ dẫn rộng hơn nên ảnh được phép nhỏ lại theo tỉ lệ, nhường chỗ cho chữ. */
.highlight-item .scn-side .jacl-item__media,
.scn-side.is-lead .jacl-item__media {
  flex-basis: 45%;
  max-width: 45%;
}

/* Màn hình hẹp: xếp dọc lại như thẻ tin thường. */
@media (max-width: 575px) {
  .scn-side .jacl-item__inner {
    display: block;
  }
  .scn-side .jacl-item__media {
    max-width: 100%;
    margin-bottom: 10px;
  }
}

/* ------------------------------------------------------------- chuyên mục */

.scn-side .jacl-item__cat {
  position: static;
  margin: 0 0 4px;
  padding-left: 0;
}

.scn-side .jacl-item__cat a {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: .04em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--scn-badge, #d32f2f);
  border: 0;
}

.scn-side .jacl-item__cat a:hover,
.scn-side .jacl-item__cat a:focus {
  color: var(--scn-badge-hover, #b71c1c);
  text-decoration: underline;
}

/* ----------------------------------------------------------------- chữ */

.scn-side .jacl-item__title {
  font-size: .98rem;
  line-height: 1.4;
  margin-bottom: 4px;
}

.highlight-item .scn-side .jacl-item__title,
.scn-side.is-lead .jacl-item__title {
  font-size: 1.35rem;
  line-height: 1.3;
}

.scn-side .jacl-item__title a {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.scn-side .jacl-item__introtext {
  margin: 0;
  font-size: .88rem;
  line-height: 1.5;
  opacity: .8;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.scn-side .jacl-item__introtext p {
  margin-bottom: 0;
}

.highlight-item .scn-side .jacl-item__introtext,
.scn-side.is-lead .jacl-item__introtext {
  -webkit-line-clamp: 4;
}

.scn-side .jacl-item__meta {
  margin-top: 6px;
  margin-bottom: 0;
}

.scn-side .jacl-item__meta ul {
  margin-bottom: 0;
  font-size: 11.5px;
  text-transform: uppercase;
  opacity: .75;
}