/* GENERAL CSS: */

.white-background {
  background-color: white;
}

.hover-c-red:hover {
  color: #dc3545;
  transition: all 0.3s ease;
}

.b-1 {
  border: solid 1px black;
}

.w-fit {
  width: fit-content;
}

.fw-500 {
  font-weight: 500;
}

.fw-600 {
  font-weight: 600;
}

.fw-400 {
  font-weight: 400;
}

.fz-12 {
  font-size: 12px;
}

.fz-14 {
  font-size: 14px;
}

.fz-16 {
  font-size: 16px;
}

.fz-18 {
  font-size: 18px;
}

.fz-20 {
  font-size: 20px;
}

.fz-24 {
  font-size: 24px;
}


.c-black {
  color: #000000;
}

.border-1 {
  border: 1px solid black;
}

.borderr-4 {
  border-radius: 4px;
}

.borderr-8 {
  border-radius: 8px;
}

.pad-0 {
  padding: 0 !important;
}

.pad-y-0 {
  padding: 0 !important;
}

.pad-4 {
  padding: 4px;
}

.pad-24 {
  padding: 24px;
}

.pad-t-24 {
  padding-top: 24px;
}

.pad-b-24 {
  padding-bottom: 24px;
}

.g-16 {
  gap: 16px;
}

.g-26 {
  gap: 26px;
}

.g-30 {
  gap: 30px;
}


.button-view-detail {
  padding: 10px 16px;
  border-radius: 100px;
  color: #64747C;
  background-color: #64747C0D;
  width: fit-content;
}

.button-view-detail:hover {
  background-color: #e21b1b;
  color: white;
  transition: all 0.3s ease;
}



.limit-2-lines {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  /* Số dòng bạn muốn giới hạn */
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  /* Thêm dấu ... ở cuối */
}

.limit-5-lines {
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.limit-3-lines {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.lh-140 {
  line-height: 140%;
}

.font-400-16-140 {
  font-weight: 400;
  font-size: 16px;
  line-height: 140%;
}

.font-600-24-140 {
  font-weight: 600;
  font-size: 24px;
  line-height: 140%;
  color: #000000;
}

.font-600-32-140 {
  font-weight: 600;
  font-size: 32px;
  line-height: 140%;
}

.font-600-32-140 p {
  font-weight: 600;
  font-size: 32px;
  line-height: 140%;
}

.font-600-16-140 {
  font-weight: 600;
  font-size: 16px;
  line-height: 140%;
  color: #000000;
}

.font-400-14-140 {
  font-weight: 400;
  font-size: 14px;
  line-height: 140%;
}

.font-600-16-140 a {
  font-weight: 600;
  font-size: 16px;
  line-height: 140%;
  color: #000000;
}

.font-400-14-140.color-gray {
  color: gray;
}

.text-underline {
  text-decoration: underline;
  offset: 0%;

  color: #64747C;
}


/* CSS FOR HEADER & BREADCRUMB OF LIST PAGE: */
#block-website-breadcrumbs .breadcrumb li:nth-child(2):before {
  content: "";
}

#block-website-breadcrumbs .breadcrumb li:nth-child(2) {
  font-weight: 400;
  font-size: 12px;
  line-height: 100%;
  color: #CF0E05;
  text-align: center;
}

#block-website-breadcrumbs .breadcrumb {
  align-items: center;
  justify-content: center;
}

div#block-website-breadcrumbs .breadcrumb ol>li:first-child a {
  color: black;
  font-weight: 400;
  font-size: 12px;
  line-height: 100%;
  text-align: center;
}

div#block-website-breadcrumbs .breadcrumb ol>li:first-child a:hover {
  color: #CF0E05;
  transition: all 0.3s ease;
}

div#block-website-tieudetrang-2 h1 {
  text-align: center;
  font-weight: 600;
  font-size: 32px;
  line-height: 100%;
  padding-top: 50px;
  padding-bottom: 16px;
}

/*SOSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSS*/
@media (min-width:768px) {
  .path-danh-sach-su-kien .contenttop-wrapper #block-website-tieudetrang-2 {
    position: absolute;
    z-index: 10;
    text-align: center;
    width: 100%;
  }

  .path-danh-sach-su-kien .contenttop-wrapper #block-website-tieudetrang-2 .page-title {
    color: #FFFFFF;
  }

  .path-danh-sach-su-kien .contenttop-wrapper #block-website-breadcrumbs {
    position: absolute;
    z-index: 10;
    top: 205px;
    width: 100%;
  }

  .path-danh-sach-su-kien .contenttop-wrapper #block-website-breadcrumbs .breadcrumb ol>li:first-child a,
  .path-danh-sach-su-kien .contenttop-wrapper #block-website-breadcrumbs .breadcrumb ol>li:first-child:after {
    color: #FFFFFF;
  }

  .path-danh-sach-su-kien .contenttop-wrapper #block-website-breadcrumbs .breadcrumb li:nth-child(2) {
    color: #2EC5B6;
  }
}

@media(min-width:992px) {
  .path-danh-sach-su-kien .contenttop-wrapper #block-website-breadcrumbs {
    top: 235px;
  }
}

@media(min-width:1037px) {
  .path-danh-sach-su-kien .contenttop-wrapper #block-website-breadcrumbs {
    top: 210px;
  }
}



/*ENDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDD*/

#register-event-area iframe {
  width: 100%;
}

/* --- Tổng thể block --- */
.event-block-container {
  display: flex;
  align-items: flex-start;
  gap: 30px;
  min-height: 380px;
}

#edit-group-event-hotro .fieldset-wrapper {
  display: flex;
  gap: 24px;
}

/* --- Phần danh sách sự kiện --- */
.event-list {
  position: relative;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.event-list {

  touch-action: pan-y;
  /* cho phép swipe trái phải */
}

/* --- Nav dot --- */
.event-nav {
  position: absolute;
  left: -25px;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.event-dot {
  width: 10px;
  height: 10px;
  background: #ccc;
  border-radius: 50%;
  cursor: pointer;
  transition: all 0.3s;
}

.event-dot.active {
  background: #e21b1b;
}

/* --- Item sự kiện --- */
.event-item {
  display: flex;
  align-items: center;
  padding: 4px;
  background: #fdfffc;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.3s;
  box-shadow: none;
  gap: 16px;
  flex: 1 1 130px;
  min-height: 100%;
}

.event-item:hover {
  background: #f9f9f9;
}



/* --- Khi được chọn --- */
.event-item.active {
  background: #ffffff;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

.event-date-day {
  font-family: 'Noto Sans', sans-serif;
  font-weight: 600;
  font-size: 36px;
  line-height: 100%;
  opacity: 80%;
}

.event-date-month-year {
  font-family: 'Noto Sans', sans-serif;
  font-weight: 400;
  font-size: 12px;
  white-space: nowrap;
  color: #FFFFFF;
}

/* --- Ô ngày tháng --- */
.event-date-section {
  /* width: 80px; */
  height: 100%;
  background: #000;
  color: #fff;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  /* margin-right: 15px; */
  padding: 16px;
  gap: 4px;
  transition: all 0.3s;
  width: 57%;
  flex: 0 0 30%;
}

/* --- Khi được chọn chỉ đổi màu của date-section --- */
.event-item.active .event-date-section {
  background: #CF0E05;
}

/* --- Nội dung sự kiện --- */
.event-info-title a {
  font-size: 16px;
  font-weight: 600;
  text-decoration: none;
  line-height: 140%;
  color: #222;
}

.event-info-title a:hover {
  color: #e21b1b;
}

.event-info-date,
.event-info-location {
  font-size: 13px;
  color: #666;
}

.event-info-location-format {
  display: flex;
  align-items: center;
}

.event-info-location.event-location-gap {
  padding-right: 10px;
}

.event-info-format.event-format-offline {
  background-color: orange;
  height: fit-content;
}

.event-info-format.event-format-online {
  background-color: rgb(35, 130, 145);
  height: fit-content;
}

.event-info-format {
  color: #FFFFFF;
  padding: 0.5px 3px;
  border-radius: 6px;
  font-size: 13px;
}

/* --- Hình bên phải --- */
.event-detail-image img {
  width: 100%;
  border-radius: 12px;
  display: block;
  height: 314px;
  overflow: hidden;
  object-fit: cover;
}

.event-detail-image {
  overflow: hidden;
  flex: 0 0 50%;
}

@media (min-width: 1200px) {
  .event-detail-image {
    flex: 0 0 55%;
  }

}


.icon-location {
  color: #CF0E05;
}

.event-readmore {
  display: flex;
  gap: 8px;
  justify-content: center;
  padding-right: calc(var(--bs-gutter-x) * .5);
  padding-left: calc(var(--bs-gutter-x) * .5);
  --bs-gutter-x: 1.5rem;
  padding-top: 10px;
}

.event-readmore p {
  font-size: 14px;
  font-weight: 400;
  line-height: 100%;
}

span.event-number {
  color: #CF0E05;
  font-weight: 600;
  font-size: 18px;
}

.event-readmore .event-readmore-link a,
.event-readmore .event-readmore-link a i {
  font-weight: 600;
  font-size: 14px;
  color: #CF0E05;
}

.event-readmore .event-readmore-link a:hover,
.event-readmore .event-readmore-link a i:hover {
  color: #9f0508;
}



.event-list-scroll {
  position: relative;
  height: 314px;
  /* hoặc tuỳ theo số item muốn hiển thị */
  overflow-y: auto;
  padding-right: 10px;
}

.event-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  box-sizing: content-box;
  flex-wrap: nowrap;
}


.event-block-container.container {
  display: block;
}

/*css scroll bar:*/
.event-list-scroll::-webkit-scrollbar {
  width: 8px;
}

.event-list-scroll::-webkit-scrollbar-thumb {
  background-color: #888;
  border-radius: 4px;
}

.event-list-scroll::-webkit-scrollbar-thumb:hover {
  background-color: #555;
}

.event-list-scroll::-webkit-scrollbar-track {
  background: #f1f1f1;
  border-radius: 4px;
}

.event-block-container {
  flex-direction: column;
}

.event-info-section {
  gap: 8px;
  display: flex;
  flex-direction: column;
}

@media (min-width: 992px) {
  .event-block-container {
    flex-direction: row;
  }
}

/* when the block is on small screen: */
@media (max-width: 992px) {

  .event-list-scroll {
    order: 2;
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    /* smooth momentum on iOS */
    touch-action: pan-x;
    /* CHO PHÉP vuốt ngang bằng 1 ngón */
    overscroll-behavior-x: contain;
    /* tránh parent chộp gesture */
    white-space: nowrap;
    padding-bottom: 15px;
    height: fit-content;
  }

  .event-list-scroll::-webkit-scrollbar {
    height: 5px;
  }

  .event-list {
    display: inline-flex;
    flex-direction: row;
    gap: 12px;
    white-space: nowrap;
    /* đảm bảo không có touch-action khác ghi đè */
    touch-action: pan-x;
  }

  .event-item {
    flex: 0 0 220px;
    width: 220px;
    min-width: 220px;
    max-width: 220px;
    padding: 5px;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    white-space: normal;
  }

  .event-date-section {
    width: 100%;
  }

  .event-detail-image {
    order: 1;
    width: 100%;
  }
}

.event-info-title a {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  /* số dòng muốn hiển thị */
  -webkit-box-orient: vertical;
  overflow: hidden;
}


.region-footer {
  padding-block: 0px !important;
}


/* CSS FOR FOOTER HEREEEEEEEEEEEEEEEEEEEEEEEEEE: */
/*Form emal notification register: */

div#edit-mail-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
}

input#edit-mail-0-value {
  outline: none;
  box-shadow: none;
}

.footer-outer {
  background-color: black;
  padding: 50px 0;
}

.footer-top-blocks {
  display: flex;
  justify-content: space-between;
  gap: 10px;
}

.footer-menu {
  display: flex;
  justify-content: space-between;
  width: 100%;
  /* color: white; */
  padding-top: 15px;
}

.footer-block.footer-thongtin {
  display: flex;
  width: 50%;
}

.footer-menu-item a {
  color: #64747C;
  font-size: 16px;
  font-weight: 600;
  /* font-family: 'Noto Sans'; */
}

.footer-menu-item a:hover {
  color: #CF0E05;
  transition: all 0.3s ease;
}

.footer-block.footer-truso {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  width: 100%;
}

.footer-block.footer-truso>.footer-truso-item {
  box-sizing: border-box;
}



@media (max-width: 992px) {
  .footer-block.footer-truso {
    grid-template-columns: 1fr;
    /* 1 cột trên màn hình nhỏ */
  }


  .footer-top-blocks {
    flex-wrap: wrap;
  }

  .footer-block.footer-thongtin {

    width: 100%;
  }



}

.truso-diachi,
.truso-fax,
.truso-website,
.truso-email {
  font-size: 14px;
  font-weight: 400;
  color: #64747C;
}

.footer-truso-item {
  gap: 5px;
  display: flex;
  flex-direction: column;
}

.truso-name {
  font-weight: 600;
  font-size: 24px;
  padding: 10px 0;
}


/* CSS FOR NEWSLETTER: */
/* .footer-newsletter-container {
    border: solid;
    border-radius: 20px;
    overflow: hidden;
    background-color: white;
    width: 30%;
} */
.footer-newsletter-title {
  font-size: 24px;
  font-weight: 600;
  padding-bottom: 10px;
}

.footer-menu-item {
  display: flex;
  flex-direction: column;
  justify-content: end;
}

.footer-inner.container {
  display: flex;
  flex-direction: column;
  gap: 53px;
}






.footer-block.footer-chinhsach {
  flex-wrap: wrap;
  gap: 20px;
  display: flex;
}

@media (min-width: 720px) {

  .footer-block.footer-chinhsach {
    display: flex;
    gap: 30px;
    justify-content: space-between;
  }
}

.footer-chinhsach-links {
  display: flex;
  gap: 24px;
  padding: 6px 0;
}

.footer-chinhsach-links .link-item {
  display: flex;
  flex-direction: column;
  justify-content: end;
}

.footer-chinhsach-social {
  display: flex;
  justify-content: start;
  gap: 24px;
}

.footer-chinhsach-logo {
  background-color: white;
  width: fit-content;
  height: fit-content;
}

.footer-chinhsach-social,
.footer-chinhsach-links .link-item a {
  color: #64747C;
  font-weight: 600;
  font-size: 16px;
}

.footer-chinhsach-links .link-item a:hover {
  color: #CF0E05;
}

.footer-chinhsach-social div,
.social-icon {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* Copy right */
.text-center.copyright {
  font-size: 12px;
  font-weight: 400;
  color: #FFFFFF;
  color: rgba(255, 255, 255, 0.6);
}

span.footer-company-name {
  /* opacity: 100%; */
  color: rgba(255, 255, 255, 1);
}

#block-socialmedialinks h2 {
  display: none;
}

a[class*='social-media-link-icon'] {
  color: white;
}

.social-media-links--platforms li a[class*='social-media-link-icon'] .fab {
  font-size: 100%;
}

/* Or we can use:
.social-media-links--platforms li a {
    color: white;
}*/


/* Footer but registered*/
/* div#block-simplenewssubscription-2 > form {
    max-height: 40px;
    padding: 10px 0;
    background-color:black;
} */
input#edit-submit--2.is-disabled {
  display: none;
}

/* --- TRƯỜNG HỢP 1: CHƯA ĐĂNG KÝ (Hiển thị Border + Radius) --- */
/* Logic: Tìm wrapper nào CÓ chứa ô nhập email */
.newsletter-wrapper:has(input[name="mail[0][value]"]) {
  background-color: white;
  border-radius: 50px;
  overflow: hidden;
}

/* div#edit-mail-wrapper {
  width: 65%;
} */

.newsletter-wrapper:has(input[type="submit"]:disabled) div[id*='edit-actions'] {
  display: none;
}

/* --- TRƯỜNG HỢP 2: ĐÃ ĐĂNG KÝ (Nền đen + Disable nút) --- */
/* Logic: Tìm wrapper nào CÓ chứa nút submit bị disabled HOẶC có thông báo message */
.newsletter-wrapper:has(input[type="submit"]:disabled),
.newsletter-wrapper:has(#edit-message) {
  background-color: #000000;
  /* Nền đen toàn bộ */
  color: #ffffff;
  /* Chuyển chữ sang màu trắng để dễ đọc */
}

/* Tùy chỉnh nút Submit khi ở trạng thái Disabled (để trông nó "chìm" đi) */
.newsletter-wrapper input[type="submit"]:disabled {
  background-color: #333333 !important;
  color: #888888 !important;
  border: 1px solid #555 !important;
  cursor: not-allowed;
  /* Hiện con trỏ cấm khi di chuột vào */
  opacity: 0.7;
}

/* Ẩn các field thừa nếu cần khi đã đăng ký (Drupal thường tự ẩn, nhưng thêm cho chắc) */
.newsletter-wrapper:has(#edit-message) .field--type-email {
  display: none;
}

/* 1. Định hình khung bao ngoài (Form) thành hình viên thuốc */



#edit-mail-wrapper {
  flex-grow: 1;
  margin: 0 !important;
  width: auto !important;
}

input#edit-mail-0-value {
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  outline: none !important;

  height: 45px;
  padding-left: 20px;
  width: 100%;

  font-size: 15px;
  color: #333;
}

input#edit-mail-0-value::placeholder {
  color: #999;
}

#edit-actions {
  margin: 0 !important;
  padding: 0 !important;
}

#edit-submit {
  background-color: #cc0000 !important;
  color: #fff !important;
  border: none !important;
  border-radius: 50px !important;

  padding: 10px 25px !important;
  height: 45px;

  font-weight: bold;
  cursor: pointer;
  transition: background 0.3s;

  white-space: nowrap;
}

#edit-submit:hover {
  background-color: #a30000 !important;
}



input#edit-submit.is-disabled {
  display: none !important;
}

/* Ẩn cả khung form nếu không có ô nhập email (trường hợp thông báo thành công) */
#block-simplenewssubscription-2 form:has(.form-item-message) {
  background: transparent;
  box-shadow: none;
  padding: 0;
  display: block !important;
  /* Trả về block để hiện thông báo */
}


/* CUSTOM FOR DETAIL EVENT PAGE: */
.block-event-diemnoibat-grid {
  display: grid;
  /* grid-template-columns: 1fr 1fr 1fr; */
}

.block-event-detail-wrapper {
  display: flex;
  gap: 30px;
}

.event-detail-item-img img {
  border-radius: 8px;
}

.event-detail-item-wrapper {
  display: flex;
  flex-direction: column;
  gap: 16px;
  border-radius: 8px;
  padding: 4px;

  background-color: white;
}

.event-detail-item-infor {
  padding: 0 16px 16px 16px;
  gap: 16px;
  display: flex;
  flex-direction: column;
}

.event-detail-item-title {
  font-weight: 600;
  font-size: 18px;
  color: #000000;
  line-height: 140%;
}

.event-detail-item-time {
  font-weight: 400;
  font-size: 14px;
  line-height: 140%;
  color: #64747C;
}

img.block-event-diemnoibat-icon {
  width: 32px;
}

.view-id-block_chi_tiet_su_kien.view-display-id-block_7 {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.event-detail-item-diadiem-hinhthuc {
  display: flex;
  gap: 8px;
  align-items: center;
}

.event-detail-item-support-title {
  font-weight: 600;
  font-size: 18px;
  line-height: 140%;
}

.block-event-diemnoibat-text {
  font-weight: 400;
  font-size: 16px;
  line-height: 140%;
  color: #64747C;
}

.block-event-diemnoibat-item {
  padding: 16px !important;
  display: flex;
  flex-direction: column;
  gap: 16px;
  border-radius: 8px;
  background-color: #FFFFFF;
  height: 100%;
}

.block-event-diemnoibat-col {
  display: flex;
  padding-top: 10px;
  padding-bottom: 10px;
}

.views-field.views-field-field-event-diemnoibat .field-content {
  height: 100%;
}

a.event-detail-item-button:hover {
  color: #FFFFFF;
  background-color: red;
}

.view-display-id-block_3 ul,
ol {
  padding-left: 0;
}

.block-event-title {
  font-weight: 400;
  font-size: 30px;
  line-height: 100%;
}

h2.chitietsukien-title {
  color: #000000;
  font-weight: 600;
  font-size: 32px;
  line-height: 140%;
}

.block-event-wrapper {
  gap: 24px;
  display: flex;
  flex-direction: column;
}

.view-block-chi-tiet-su-kien.view-id-block_chi_tiet_su_kien.view-display-id-block_4 {
  gap: 24px;
  display: flex;
  flex-direction: column;
}

.view-block-chi-tiet-su-kien.view-id-block_chi_tiet_su_kien.view-display-id-block_4 .view-content {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.block-event-diengia-wrapper {
  display: flex;
  border-radius: 8px;
  border: 1px solid #DEDEDE;
  padding: 16px;
  gap: 16px;
  align-items: center;
}

.block-event-diengia-ten-chucvu {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.block-event-diengia-chucvu p {
  margin-bottom: 0;
}

.views-field.views-field-field-event-chitiet ol,
ul {
  padding-left: 0;
}

.view-id-block_chi_tiet_su_kien.view-display-id-block_5 {
  margin-top: -6px;
}

.view-display-id-block_5 .views-field-field-event-chitiet ul,
li {
  padding-left: 0;
}

.block-event-phi-wrapper {
  border-radius: 8px;
  gap: 24px;
  padding: 16px;
  background-color: #E2F6E3;
  font-weight: 400;
  font-size: 24px;
  line-height: 100%;
  align-items: center;
  display: flex;
  justify-content: center;
}

span.block-event-phi {
  font-weight: 600;
  font-size: 24px;
  color: #2EC5B6;
}

.block-event-phi-wrapper {
  border-radius: 8px;
  gap: 24px;
  padding: 16px;
  background-color: #E2F6E3;
  font-weight: 400;
  font-size: 24px;
  line-height: 100%;
  align-items: center;
  display: flex;
  justify-content: center;
  color: #000000;
}

/* div#block-website-content article {
  display: none;
} */

.chitietsukien-thoi-diem-wrapper {
  display: flex;
  background-color: #000000;
  color: white;
  border-radius: 8px;
  flex-direction: column;
  padding: 12px;
  gap: 10px;

  @media(min-width: 768px) {
    flex-direction: row;
    padding: 0;
    gap: 0;
  }
}

/* CSS MEDIA */
@media(max-width:768px) {
  .chitietsukien-thoidiem-icon {
    flex: 0 0 8%;
    max-width: 8%;
    display: flex;
    justify-content: flex-start;
  }
}

@media(max-width: 577px) {
  .chitietsukien-thoidiem {
    padding-left: 0 !important;
  }

  .chitietsukien-thoidiem-icon {
    flex: 0 0 5%;
    max-width: 5%;
  }
}

@media(max-width:385px) {
  .chitietsukien-thoidiem-icon {
    display: none;
  }
}

.chitietsukien-thoidiem-thongtin {
  display: flex;
  gap: 20px;

  @media(min-width: 768px) {
    display: block;
  }
}

.chitietsukien-thoidiem-title {
  font-weight: 400;
  font-size: 16px;
  line-height: 36px;
  align-items: center;
}

.chitietsukien-thoidiem-chitiet {
  font-weight: 500;
  font-size: 15px;

  @media(min-width: 992px) {
    font-size: 20px;
  }

  line-height: 36px;
  align-items: center;
}

ul.event-detail-item-support-item {
  margin: 0 0;
  color: #64747C;
}

.block-event-diengia-ten a:hover {
  font-weight: 700;
  color: inherit;
  transition: all 0.3s linear;
}

.block-event-thamgia-doanhnghiep img {
  width: 100%;
  object-fit: contain;
  height: fit-content;
}

.chitietsukien-thoidiem {
  border-left: 4px;
  display: flex;
  align-items: center;
  gap: 20px;
  padding-left: 24px;



  @media(min-width:768px) {
    padding: 16px 24px;
    gap: 24px;
    align-items: center;
    flex-shrink: 1;
    width: 50%;
  }

}

.center-split {
  background-color: gray;
  width: 1px;
  margin: 20px 0;
  opacity: 60%;

  @media(max-width: 768px) {
    display: none;
  }
}

h2.chitietsukien-title {
  font-weight: 600;
  font-size: 32px;
  line-height: 140%;
  color: #000000;
}

.block-event-wrapper {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.block-event-detail-wrapper-content {
  display: flex;
  flex-direction: column;
  gap: 30px;

  @media(min-width: 992px) {
    padding-right: 30px;
  }
}

.view-id-block_chi_tiet_su_kien.view-display-id-block_5 .views-row {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

div#register-event-area iframe {
  max-height: 600px;
  overflow: scroll;
}



/* CSS FOR LIST EVENTS: */
.list-event-item {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 4px;
  border-radius: 8px;
}

.list-event-infor {
  padding: 0 16px 16px 16px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  height: 100%;
}

.list-event-infor-title {
  font-weight: 600;
  font-size: 16px;
  line-height: 140%;
  color: #000000;
}

.list-event-infor-title:hover {
  color: #CF0E05;
  transition: all 0.2s ease;
}


.list-event-infor-time {
  font-weight: 400;
  font-size: 14px;
  line-height: 140%;
  color: #64747C;
}

.list-event-infor-diadiem-hinhthuc {
  display: flex;
  gap: 8px;
  align-items: center;
}

#views-bootstrap-danh-sach-su-kien-page-2 .row>* {
  margin-top: 12px;
}

.list-event-infor-diadiem {
  font-weight: 400;
  font-size: 14px;
  line-height: 140%;
  color: #000000;
}

.list-event-wrapper {
  background-color: white;
  border-radius: 8px;
  gap: 16px;
  display: flex;
  flex-direction: column;
  padding: 4px;
  height: 406px;
}



.list-event-infor-hinhthuc {
  border-radius: 6px;
  padding: 4px 8px;
  gap: 10px;
  display: flex;
  font-weight: 500;
  font-size: 12px;
  line-height: 140%;
  color: #FDFFFC;
}

.list-event-infor-hinhthuc-color-14 {
  background-color: #FE9F1F;
}

.list-event-infor-hinhthuc-color-15 {
  background-color: #2EC5B6;
}

img.list-event-infor-diadiem-icon {
  width: 12.7px;
  height: 16px;
}

.view-id-danh_sach_su_kien.view-display-id-block_1 .row {
  --bs-gutter-x: 30px !important;
  --bs-gutter-y: 30px !important;
}

.block-event-diemnoibat-grid div {
  --bs-gutter-x: 12px;
}

.list-event-image img {
  height: 244.96px;
  object-fit: cover;
  border-radius: 8px;
  width: 100%;
}



.list-event-vip-background {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  width: 100vw;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  height: fit-content;
  z-index: 2;
  width: 100%;
}

.list-event-vip-background .container {
  z-index: 2;
}


.overlay {
  background-color: rgba(0, 0, 0, 0.75);
}

.list-event-vip-wrapper {
  z-index: 2;
  background-color: #FDFFFC;
  padding: 4px;
  display: flex;
  flex-direction: column;
  width: 100%;
}

.list-event-vip-img {
  display: block;
  width: 100%;
}

.list-event-vip-img {
  display: block;
  width: 100%;
}

.list-event-vip-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.list-event-vip-content {
  padding: 24px 16px;
  gap: 16px;
  display: flex;
  width: 100%;
  flex-direction: column;
}

a.event-detail-item-button {
  padding: 10px 42px;
  border-radius: 100px;
  gap: 16px;
  background-color: #CF0E05;
  height: 60px;
  width: 100%;
  font-weight: 600;
  font-size: 18px;
  line-height: 100%;
  color: #FFFFFF;
  align-items: center;
  justify-content: center;
  display: flex;
  text-align: center;
  transition: all 0.3s ease;
  margin-right: auto;
  margin-left: auto;
}



@media(min-width:768px) {
  .list-event-vip-wrapper {
    flex-direction: row !important;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    gap: 16px;
    height: fit-content;
  }

  .list-event-vip-img {
    display: flex;
    width: 50%;
  }

  .list-event-vip-content {
    width: 50%;
  }

  /* a.event-detail-item-button {
    margin-right: unset;
    margin-left: unset;
  } */

  .list-event-vip-background {
    height: 848px;
    z-index: unset;
    margin-bottom: -200px;
  }
}

@media(min-width: 1200px) {
  .list-event-vip-background {
    margin-bottom: -300px;
  }

}



.list-event-vip-diadiem-hinhthuc-wrapper {
  display: flex;
  gap: 8px;
  align-items: center;
}

.list-event-vip-title:hover {
  color: #CF0E05;
  transition: all 0.2s ease;
}



.path-danh-sach-su-kien .box-all-content {
  background-color: #f5f7f8;
  border-top-right-radius: 130px;
  z-index: 1;
  /* position: absolute; BACK */
  position: relative;
  width: 100%;
}

#views-exposed-form-danh-sach-su-kien-page-2 .js-form-item.form-item {
  padding: 0;
  margin: 0;
  width: 100%;
}

#views-exposed-form-danh-sach-su-kien-page-2 .js-form-item.form-item .form-text,
.form-select {
  margin: 0;
}

#views-exposed-form-danh-sach-su-kien-page-2 .js-form-wrapper .js-form-item legend {
  display: none;
}

#views-exposed-form-danh-sach-su-kien-page-2 .form-actions.js-form-wrapper {
  margin: 0;
  height: 100%;
}

#views-exposed-form-danh-sach-su-kien-page-2 .form-actions.js-form-wrapper .button {
  height: 100%;
  background-color: #cf0e05;
}

#views-exposed-form-danh-sach-su-kien-page-2 .form-actions.js-form-wrapper .button:hover {
  background-color: #950a03;
}

/* CSS LOADMORE BUTTON */
.view-id-danh_sach_su_kien.view-display-id-page_2 .js-pager__items .button,
.view-id-danh_sach_diem_nhan.view-display-id-page_1 .js-pager__items .button,
.view-id-danh_sach_cong_cu_va_nen_tang.view-display-id-page_1 .js-pager__items .button,
.view-id-danh_sach_du_an.view-display-id-page_1 .js-pager__items .button,
.view-id-danh_sach_dich_vu .js-pager__items .button {
  background-color: #F2F2F2;
  color: #000000;
  margin-top: 20px;
}

.view-id-danh_sach_su_kien.view-display-id-page_2 .js-pager__items .button:hover,
.view-id-danh_sach_diem_nhan.view-display-id-page_1 .js-pager__items .button:hover,
.view-id-danh_sach_cong_cu_va_nen_tang.view-display-id-page_1 .js-pager__items .button:hover,
.view-id-danh_sach_du_an.view-display-id-page_1 .js-pager__items .button:hover,
.view-id-danh_sach_dich_vu .js-pager__items .button:hover {
  background-color: #000000;
  color: #F2F2F2;
}

#views-exposed-form-danh-sach-su-kien-page-2 .js-form-item.form-item.js-form-wrapper.form-wrapper .fieldset-wrapper {
  gap: 10px;
}

#views-exposed-form-danh-sach-su-kien-page-2 .form--inline.clearfix {
  align-items: center;
  gap: 10px;
  width: 100%;
  display: grid;
}

#views-exposed-form-danh-sach-su-kien-page-2 .form--inline.clearfix .form-text {
  background-image: url(https://kisstartup.vtranet.com/sites/default/files/styles/thumbnail/public/2025-12/Icon.png?itok=cBYLfafE);
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-color: #FFFFFF;
  /* height: 100%; */
  outline: none;
  box-shadow: none;
  border-color: white;
}

#views-exposed-form-danh-sach-du-an-page-1 .form-text {
  min-height: unset;
  margin: 0;
  background-image: url(https://kisstartup.vtranet.com/sites/default/files/styles/thumbnail/public/2025-12/Icon.png?itok=cBYLfafE);
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-color: #FFFFFF;
  padding: 8px;
  border-radius: 8px;
}

#views-exposed-form-danh-sach-dich-vu-page-1 .form--inline.clearfix .form-text {
  background-image: url(https://kisstartup.vtranet.com/sites/default/files/styles/thumbnail/public/2025-12/Icon.png?itok=cBYLfafE);
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-color: #FFFFFF;
  /* height: 100%; */
  padding: 10px;
  outline: none;
  box-shadow: none;
  border-color: white;
}

#views-exposed-form-danh-sach-diem-nhan-page-1 .js-form-item.js-form-type-textfield .form-text {
  background-image: url(https://kisstartup.vtranet.com/sites/default/files/styles/thumbnail/public/2025-12/Icon.png?itok=cBYLfafE);
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-color: #FFFFFF;
  padding: 10px;
  outline: none;
  box-shadow: none;
  border-color: white;
}

.js-form-item-field-event-hinhthuc-target-id select.form-select {
  background-image: url(https://kisstartup.vtranet.com/sites/default/files/styles/thumbnail/public/2025-12/Filter.png?itok=lOCYip9d);
  background-size: 22.5px 25px;
  outline: none;
  box-shadow: none;
  border-color: white;
}


.js-form-item-field-event-thoigianbatdau-value-max input.bef-datepicker {
  background-image: url(https://kisstartup.vtranet.com/sites/default/files/styles/thumbnail/public/2025-12/Calendar.png?itok=6X-tXRHK);
  background-repeat: no-repeat;
  background-position: right 10px center;
  cursor: pointer;
  outline: none;
  box-shadow: none;
  border-color: white;
}

.js-form-item-field-event-thoigianbatdau-value-min input.bef-datepicker {
  background-image: url(https://kisstartup.vtranet.com/sites/default/files/styles/thumbnail/public/2025-12/Calendar.png?itok=6X-tXRHK);
  background-repeat: no-repeat;
  background-position: right 10px center;
  cursor: pointer;
  outline: none;
  box-shadow: none;
  border-color: white;
}

/* this is the general css for filter area: 
We can reuse it*/
.js-form-item-field-event-thoigianbatdau-value input.form-date.form-control {
  background-image: url(https://kisstartup.vtranet.com/sites/default/files/styles/thumbnail/public/2025-12/Calendar.png?itok=6X-tXRHK);
  background-repeat: no-repeat;
  background-position: right 10px center;
  cursor: pointer;
  padding: 10px;
  outline: none;
  box-shadow: none;
  border-color: white;
}

.js-form-item-field-event-thoigianbatdau-value-1 input.form-date.form-control {
  background-image: url(https://kisstartup.vtranet.com/sites/default/files/styles/thumbnail/public/2025-12/Calendar.png?itok=6X-tXRHK);
  background-repeat: no-repeat;
  background-position: right 10px center;
  cursor: pointer;
  outline: none;
  box-shadow: none;
  border-color: white;
  padding: 10px;
}


@media(min-width: 768px) {
  #views-exposed-form-danh-sach-su-kien-page-2 .js-form-item.form-item {
    width: 100%;
  }

  #views-exposed-form-danh-sach-su-kien-page-2 .form--inline.clearfix {
    justify-content: space-between;
    display: flex;
    width: fit-content;
    height: fit-content;
  }
}

@media(min-width: 992px) {
  #views-exposed-form-danh-sach-su-kien-page-2 .form--inline.clearfix {
    flex-wrap: nowrap;
    width: 100%;
  }

  #views-exposed-form-danh-sach-su-kien-page-2 .form--inline.clearfix .form-text {
    min-width: unset;
  }

  #views-exposed-form-danh-sach-su-kien-page-2 .form--inline.clearfix .form-date {
    min-width: unset;
  }

  #views-exposed-form-danh-sach-su-kien-page-2 .form--inline.clearfix .button.js-form-submit {
    flex: 1;
  }

  #views-exposed-form-danh-sach-su-kien-page-2 .form--inline.clearfix .js-form-item.form-item.js-form-type-select.form-type-select.js-form-item-field-event-hinhthuc-target-id.form-item-field-event-hinhthuc-target-id {
    flex: 1;
  }

  #views-exposed-form-danh-sach-su-kien-page-2 .js-form-item.form-item.js-form-type-textfield.form-type-textfield.js-form-item-title.form-item-title {
    flex: 2;
  }

  #views-exposed-form-danh-sach-su-kien-page-2 div[id^="edit-field-event-thoigianbatdau-value-wrapper"] {
    flex: 4;
  }
}

.view-danh-sach-su-kien.view-id-danh_sach_su_kien.view-display-id-page_2>div {
  width: 100%;
}

.view-danh-sach-su-kien.view-id-danh_sach_su_kien.view-display-id-page_2 .view-content {
  padding-top: 0px;
}


.path-danh-sach-su-kien.not-frontpage .page-content {
  padding-top: 30px;
}

@media (min-width: 768px) {
  .view-danh-sach-su-kien.view-id-danh_sach_su_kien.view-display-id-page_2 {
    margin-top: unset;
  }
}


@media(max-width:1201px) {

  .path-danh-sach-su-kien .box-all-content {
    border-top-right-radius: unset;
  }
}

.list-event-title {
  padding-top: 20px;
}

@media(min-width:1200px) {
  .path-danh-sach-su-kien.not-frontpage .page-content {
    padding-top: 95px;
  }

  .view-danh-sach-su-kien.view-id-danh_sach_su_kien.view-display-id-page_2 .view-header {
    width: 20%;
    align-items: center;
    justify-content: start;
    display: flex;
  }

  .list-event-title {
    padding-top: 0;
  }

  .view-danh-sach-su-kien.view-id-danh_sach_su_kien.view-display-id-page_2 .view-content {
    padding-top: 30px;
  }

  .view-danh-sach-su-kien.view-id-danh_sach_su_kien.view-display-id-page_2 .view-filters {
    width: 80%;
  }

  .view-danh-sach-su-kien.view-id-danh_sach_su_kien.view-display-id-page_2 {
    display: flex;
    flex-wrap: wrap;
  }
}

.view-danh-sach-su-kien.view-id-danh_sach_su_kien.view-display-id-page_2 .view-filters {
  border: unset;
  border-radius: unset;
  padding: 0;
  background-color: unset;
  box-shadow: unset;
  max-width: unset;
  margin: 20px auto;
}

#edit-field-event-special-wrapper .form-type-checkbox {
  padding-left: 0;
}

.ds-congcu-logo img {
  width: 170px;
  height: auto;
}

.ds-congcu-wrapper {
  height: 254px;
  transition: all 0.3s ease;
}

#views-bootstrap-danh-sach-cong-cu-va-nen-tang-page-1 .row {
  --bs-gutter-x: 2rem;
  --bs-gutter-y: 2rem;
}

a.ds-congcu-button {
  background-color: var(--main-color);
  color: white;
  border: 2px solid var(--main-color);
  transition: all 0.4s ease-in-out;
  text-decoration: none;
  opacity: 1;
  max-height: 100px;
  margin-top: 10px;
}

a.ds-congcu-button:hover {
  color: red;
  background-color: white;
  border: 2px solid red;
  cursor: pointer;
}

@media (min-width: 992px) {
  .ds-congcu-wrapper a.ds-congcu-button {
    max-height: 0;
    opacity: 0;
    margin-top: 0;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    overflow: hidden;
    border: 0;
  }

  .ds-congcu-wrapper:hover a.ds-congcu-button {
    max-height: 100px;
    opacity: 1;
    margin-top: 10px;
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
  }

  a.ds-congcu-button:hover {
    border: 2px solid red;
  }
}

.ds-congcu-motangan {
  font-weight: 500;
  font-size: 14px;
}

.ds-congcu-title {
  text-align: center;
  font-weight: 600;
  font-size: 32px;
  line-height: 100%;
  padding-bottom: 50px;
}



/* LIST SERVICES: */
.list-service-item-img img {
  width: 100%;
  border-radius: 8px;
}

.list-service-item-normal .list-service-item-img img {
  height: 217px;
  object-fit: cover;
}

.list-service-item-normal {
  height: 100%;
}

#views-bootstrap-danh-sach-dich-vu-page-1 .views-field.views-field-nothing {
  height: 100%;
}

.block_dsdichvu_dau_trai .list-service-item-img img {
  aspect-ratio: 856 / 515;
  object-fit: cover;
}

#block-website-views-block-danh-sach-dich-vu-block-1 .view-id-danh_sach_dich_vu.view-display-id-block_1 .view-content {
  width: 100%;
}

#views-bootstrap-danh-sach-dich-vu-page-1 .row {
  --bs-gutter-y: 1.5rem;
}



.list-service--item-infor {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 0 16px 16px 16px;
  justify-content: space-between;
  height: 100%;
}

.list-service-item-time-link {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
}

.list-service-item-time {
  display: flex;
  gap: 8px;
  align-items: center;
}

.list-service-item-time img {
  height: fit-content;
}

.img-link-hover:hover {
  filter: sepia(100%) saturate(2000%) hue-rotate(-45deg) brightness(1.2);
}

.list-service-item-wrapper {
  border: 1px solid #F2F2F2E5;
  padding: 4px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  background-color: #FFFFFF;
  height: 100%;
}




.block_dsdichvu_dau_phai {
  flex: 2.3;
}

.block_dsdichvu_dau_trai {
  flex: 7.3;
  padding-bottom: 1rem;
}

.block_dsdichvu_dau_wrapper {
  gap: 30px;
}

.view-danh-sach-dich-vu.view-id-danh_sach_dich_vu {
  display: flex;
  flex-wrap: wrap;
}

.view-danh-sach-dich-vu.view-id-danh_sach_dich_vu .view-header {
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.view-danh-sach-dich-vu.view-id-danh_sach_dich_vu .view-filters {
  border: unset;
  width: 100%;
  border-radius: unset;
  padding: 0;
  background-color: unset;
  box-shadow: unset;
  max-width: unset;
}


@media (min-width: 1200px) {
  .view-danh-sach-dich-vu.view-id-danh_sach_dich_vu .view-header {
    width: 20%;
  }

  .view-danh-sach-dich-vu.view-id-danh_sach_dich_vu .view-filters {
    width: 80%;
  }

  .list-service--item-infor {
    min-height: unset;
  }

  .view-display-id-block_2 .list-service--item-infor {
    min-height: 131px;
  }
}

.view-id-danh_sach_dich_vu.view-display-id-block_2 .view-content {
  width: 100%;
  display: flex;
  justify-content: space-between;
  gap: 10px;
}

.view-id-danh_sach_dich_vu.view-display-id-block_2 .views-row .views-field {
  height: 100%;
}

.view-danh-sach-dich-vu.view-id-danh_sach_dich_vu .form-item {
  padding: 0;
  margin: 0;
}

.view-danh-sach-dich-vu.view-id-danh_sach_dich_vu .form-text {
  margin: 0;
  /* height: 100%; */
}

#views-exposed-form-danh-sach-dich-vu-page-1 .form-actions {
  margin: 0;
  margin-left: auto;
}

#views-exposed-form-danh-sach-dich-vu-page-1 .form-date {
  height: 100%;
}

#views-exposed-form-danh-sach-dich-vu-page-1 .form--inline.clearfix {
  gap: 20px;
  justify-content: space-between;
}

#views-exposed-form-danh-sach-dich-vu-page-1 .js-form-item-title.form-item-title {
  width: 100%;
}

.path-danh-sach-dich-vu .page-content {
  padding-top: 30px;
}

@media (min-width: 992px) {
  /* #views-exposed-form-danh-sach-dich-vu-page-1 .js-form-item-title.form-item-title {
    width: auto;
  } */

  #views-exposed-form-danh-sach-dich-vu-page-1 .form--inline.clearfix {
    flex-wrap: nowrap;
  }

  .view-id-danh_sach_dich_vu.view-display-id-block_2 .view-content {
    flex-direction: column;
    height: 100%;
  }

  #block-website-views-block-danh-sach-dich-vu-block-2 {
    height: 100%;
  }

  #block-website-views-block-danh-sach-dich-vu-block-2>div {
    height: 100%;
  }

  #block-website-views-block-danh-sach-dich-vu-block-2 .view-display-id-block_2 {
    height: 100%;
  }

  .block_dsdichvu_dau_trai {
    padding: 0;
  }

  .block-views-blockdanh-sach-dich-vu-block-1 .list-service--item-infor {
    min-height: 131px;
  }

  .path-danh-sach-dich-vu .page-content {
    padding-top: 65px;
  }
}

#views-exposed-form-danh-sach-dich-vu-page-1 .form-actions .button {
  background-color: #cf0e05;
  margin: 0;
}

#views-exposed-form-danh-sach-dich-vu-page-1 .form-actions .button:hover {
  background-color: #950a03;
}

#views-exposed-form-danh-sach-dich-vu-page-1 #edit-actions {
  display: none;
}

#views-exposed-form-danh-sach-dich-vu-page-1 .clearfix::after {
  display: none;
}



.list-spotlight-wrapper .list-spotlight-image img {
  width: 100%;
  object-fit: cover;
  height: 200px;
  border-radius: 4px;
}

.list-spotlight-wrapper {
  border-radius: 8px;
  padding: 4px;
  gap: 12px;
  background-color: #FFFFFF;
}

.view-danh-sach-diem-nhan.view-display-id-page_1 .view-content>div {
  display: flex;
  flex-direction: column;
  gap: 30px;
}

.list-spotlight-descrip {
  font-weight: 400;
  font-size: 14px;
  line-height: 160%;
  text-align: justify;
}

.list-spotlight-infor {
  padding: 4px 16px 16px 16px;
  gap: 8px;
}

.list-spotlight-time {
  gap: 8px;
  align-items: center;
}



#views-exposed-form-danh-sach-diem-nhan-page-1 .form-item {
  /* margin-bottom: 0; */
  width: 100%;
  margin: 0;
}

#views-exposed-form-danh-sach-diem-nhan-page-1 .form-item .form-text {
  margin: 0;
}


#views-exposed-form-danh-sach-diem-nhan-page-1 .form--inline {
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 4px;
}

#views-exposed-form-danh-sach-diem-nhan-page-1 .form--inline::after {
  display: none;
}

#views-exposed-form-danh-sach-diem-nhan-page-1 .form--inline #edit-actions {
  display: none;
}

#views-exposed-form-danh-sach-diem-nhan-page-1 .form--inline .form-actions {
  margin: 0;
}

.view-id-danh_sach_diem_nhan.view-display-id-page_1 {
  display: flex;
  flex-wrap: wrap;
}

.view-id-danh_sach_diem_nhan.view-display-id-page_1 .view-filters {
  border: unset;
  border-radius: unset;
  padding: 0;
  background: unset;
  box-shadow: unset;
  max-width: unset;
}

.view-id-danh_sach_diem_nhan.view-display-id-page_1 .view-header {
  align-items: center;
  display: flex;
}

.view-id-danh_sach_diem_nhan.view-display-id-page_1 .view-content {
  padding-top: 10px;
  width: 100%;
}

@media (min-width: 768px) {
  .list-spotlight-image {
    width: 30%;
  }

  .list-spotlight-infor {
    width: 68%;
  }

  .list-spotlight-infor {
    padding-top: 16px;
    gap: 16px;
  }

  .list-spotlight-wrapper {
    gap: 24px;
  }


  .list-spotlight-wrapper .list-spotlight-image img {
    height: 232px;
  }

  #views-exposed-form-danh-sach-diem-nhan-page-1 .form--inline .js-form-type-textfield {
    width: 100%;
  }

  #views-exposed-form-danh-sach-diem-nhan-page-1 .form--inline .js-form-item-field-event-thoigianbatdau-value,
  #views-exposed-form-danh-sach-diem-nhan-page-1 .form--inline .js-form-item-field-event-thoigianbatdau-value-1 {
    width: 49%;
  }

}

@media (min-width: 992px) {

  #views-exposed-form-danh-sach-diem-nhan-page-1 .form--inline .js-form-item-field-event-thoigianbatdau-value,
  #views-exposed-form-danh-sach-diem-nhan-page-1 .form--inline .js-form-item-field-event-thoigianbatdau-value-1,
  #views-exposed-form-danh-sach-diem-nhan-page-1 .form--inline .js-form-type-textfield {
    width: unset;
  }

  #views-exposed-form-danh-sach-diem-nhan-page-1 .form--inline {
    flex-wrap: nowrap;
  }

  .view-id-danh_sach_diem_nhan.view-display-id-page_1 .view-filters {
    margin: 0;
    width: 100%;
  }

  .view-id-danh_sach_diem_nhan.view-display-id-page_1 .view-content {
    padding-top: 40px;
  }

  .view-id-danh_sach_diem_nhan.view-display-id-page_1 .view-header {
    padding-bottom: 20px;
  }
}

@media (min-width: 1200px) {
  .view-id-danh_sach_diem_nhan.view-display-id-page_1 .view-filters {
    width: unset;
  }

  .view-id-danh_sach_diem_nhan.view-display-id-page_1 .view-filters {
    margin: unset;
    margin-left: auto;
    margin-right: 0;
  }
}

.btn-toggle {
  display: flex;
  transition: align-items 0.3s ease;
}

.btn-toggle.collapsed {
  align-items: center;
}

.btn-toggle:not(.collapsed) {
  align-items: flex-start;
}

.btn-toggle .icon-minus {
  display: none;
}

.btn-toggle .icon-plus {
  display: inline-block;
}

.btn-toggle:not(.collapsed) .icon-minus {
  display: inline-block;
  color: #dc3545;
}

.btn-toggle:not(.collapsed) .icon-plus {
  display: none;
}

.btn-toggle:not(.collapsed) .title-text {
  color: #dc3545 !important;
}


.body-content {
  color: #333;
  margin-bottom: 0;
  line-height: 1.5;
}

.preview-collapse.collapse:not(.show) {
  display: block !important;

  height: 1.5em;
  min-height: 1.5em;

  overflow: hidden;
}

.preview-collapse.collapse:not(.show) .body-content {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.preview-collapse.collapsing {
  min-height: 1.5em !important;

  overflow: hidden;
}

.preview-collapse.collapsing .body-content,
.preview-collapse.collapse.show .body-content {
  display: block;
  -webkit-line-clamp: unset;
}

.spotlight-detail-title .double-field-first,
.spotlight-detail-title {
  font-weight: 400;
  font-size: 30px;
  line-height: 100%;
  /* padding: 12px 0; */
}

/* .spotlight-detail-descrip .double-field-second {
  padding: 12px 0;
} */

.view-trang-chi-tiet-spotlight.view-id-trang_chi_tiet_spotlight,
.view-trang-chi-tiet-spotlight.view-id-trang_chi_tiet_spotlight .view-header {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.views-field-field-spotlight-topic {
  padding-bottom: 24px;
}



.spotlight-detail-services-title-link {
  padding: 4px 16px 16px 16px;
}

.spotlight-detail-services-img img {
  border-radius: 8px;
  height: 179px;
  object-fit: cover;
  width: 100%;
}

.spotlight-detail-articles-wrapper {
  background-color: #F2F2F2E5;
  gap: 16px;
  padding: 24px;
  height: 100%;
  justify-content: space-between;
}

div#views-bootstrap-trang-chi-tiet-spotlight-block-4 .row .views-field.views-field-nothing {
  height: 100%;
}


.spotlight-detail-project-img img {
  width: 100%;
  aspect-ratio: 814/440;
  object-fit: cover;
  height: unset;
}

.spotlight-detail-project-infor,
.spotlight-detail-project-img {
  width: 100%;
}

.spotlight-detail-diengia-infor-link a {
  color: black;
}

.spotlight-detail-diengia-infor-link a:hover {
  color: #e21b1b;
  transition: all 0.3s ease;
}

.spotlight-detail-diengia-infor p {
  margin: 0 !important;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.spotlight-detail-diengia-img img {
  height: 76px;
  width: auto;
  border-radius: 8px;
}

.spotlight-detail-diengia-img {
  min-width: 91px;
  align-items: center;
  justify-content: center;
  display: flex;
  height: fit-content;
}

.spotlight-detail-row {
  padding: 12px;
}

@media(min-width:992px) {
  .spotlight-detail-project-infor {
    width: 30%;
  }

  .spotlight-detail-project-img {
    width: 70%;
  }

  .spotlight-detail-row {
    padding: 24px;
  }
}











/* CSS FOR SPOTLIGHT DETAIL PAGE: */
.view-id-trang_chi_tiet_spotlight.view-display-id-block_7 .view-content {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;

  overflow-x: auto !important;
  overflow-y: hidden !important;


  width: 100% !important;
  max-width: 100% !important;

  gap: 0 !important;
  padding-bottom: 15px !important;

  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;

}

.view-id-trang_chi_tiet_spotlight.view-display-id-block_7 .view-content::-webkit-scrollbar {
  display: none;
}

.view-id-trang_chi_tiet_spotlight.view-display-id-block_7 .view-content .views-row {
  display: block !important;
  height: 400px !important;
  margin: 0 !important;
  box-sizing: border-box !important;

  flex-shrink: 0 !important;
  flex-grow: 0 !important;
  flex-basis: 90vw !important;
  width: 100%;
  /* min-width: 90vw !important; */
  min-width: 100%;
  max-width: 100%;

  scroll-snap-align: start;
  scroll-snap-stop: always;
}

@media (min-width: 576px) {

  /* Container Desktop */
  .view-id-trang_chi_tiet_spotlight.view-display-id-block_7 .view-content {
    gap: 20px !important;

    /* Hiện lại thanh cuộn trên Desktop */
    scrollbar-width: auto !important;
  }

  .view-id-trang_chi_tiet_spotlight.view-display-id-block_7 .view-content::-webkit-scrollbar {
    display: block !important;
    height: 10px;
  }

  .view-id-trang_chi_tiet_spotlight.view-display-id-block_7 .view-content::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 5px;
  }

  .view-id-trang_chi_tiet_spotlight.view-display-id-block_7 .view-content::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 5px;
  }

  .view-id-trang_chi_tiet_spotlight.view-display-id-block_7 .view-content::-webkit-scrollbar-thumb:hover {
    background: #555;
  }

  /* Item Desktop: 70% */
  .view-id-trang_chi_tiet_spotlight.view-display-id-block_7 .view-content .views-row {
    flex-basis: 70% !important;
    width: 70% !important;
    min-width: 70% !important;
    max-width: 70% !important;
  }
}

.view-id-trang_chi_tiet_spotlight.view-display-id-block_7 .view-content .views-row>div,
.view-id-trang_chi_tiet_spotlight.view-display-id-block_7 .view-content .views-row span.field-content {
  display: block !important;
  height: 100% !important;
  width: 100% !important;
}

.spotlight-detail-article-wrapper {
  position: relative;
  width: 100% !important;
  height: 100% !important;
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

.spotlight-detail-article-img,
.spotlight-detail-article-img img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
}

.spotlight-detail-article-inner {
  position: absolute;
  z-index: 10;
  top: 22%;
  left: 20px;
  right: 20px;
  background: #F2F2F2E5;
  padding: 24px;
  border-radius: 8px;
  width: 50%;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.spotlight-detail-header {
  text-align: center;
  font-weight: 700;
  font-size: 40px;
  line-height: 140%;
  padding-bottom: 60px;
}

.spotlight-detail-all-block-wrapper>div {
  padding: 50px 0;
}

.service-detail-article-ref-wrapper {
  border: 1px solid #F2F2F2E5;
  background-color: #FFFFFF;
}

.service-detail-article-ref-title a {
  font-weight: 500;
  font-size: 16px;
  line-height: 140%;
  color: black;
}

.service-detail-article-ref-title a:hover {
  color: #dc3545;
  transition: all 0.2s ease;
}

.service-detail-article-ref-img img {
  min-width: 140px;
  height: 84px;
  border-radius: 4px;
  max-width: 140px;
  object-fit: cover;
}

.service-detail-author-wrapper {
  border-radius: 24px;
  padding: 16px;
  gap: 30px;
  background-color: #FFFFFF;
  box-shadow: 0px 8px 16px 0px #00000003;
}

.service-detail-author-img img {
  width: 56px;
  height: 56px;
  border-radius: 56px;
}

.service-detail-title {
  text-align: center;
  font-weight: 600;
  font-size: 32px;
  line-height: 140%;
}

.view-id-trang_chi_tiet_dich_vu.view-display-id-block_1 .view-content {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.page-node-type-dichvu .node--type-dichvu {
  background-color: unset;
}

#block-website-content .node--type-dichvu .node__content,
#block-website-content .node--type-dichvu .layout__region--content,
.view-id-trang_chi_tiet_dich_vu.view-display-id-block_2 {
  display: flex;
  flex-direction: column;
  gap: 30px;
}

div#views-bootstrap-trang-chi-tiet-dich-vu-block-2 .row {
  --bs-gutter-x: 30px;
  --bs-gutter-y: 30px;
}

/* .block-field-blocknodedichvufield-tags .field--name-field-tags {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}

.block-field-blocknodedichvufield-tags .field--name-field-tags .field__label {
  font-weight: 600;
  font-size: 18px;
  line-height: 140%;
}

.block-field-blocknodedichvufield-tags .field--name-field-tags .field__items {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.block-field-blocknodedichvufield-tags .field--name-field-tags .field__items .field__item {
  border-radius: 100px;
  padding: 8px 16px;
  background-color: #FFFFFF;
}

.block-field-blocknodedichvufield-tags .field--name-field-tags .field__items .field__item a {
  color: #64747C;
  font-weight: 400;
  font-size: 18px;
  line-height: 140%;
}

.block-field-blocknodedichvufield-tags .field--name-field-tags .field__items .field__item a:hover {
  color: #dc3545;
} */

/*CSS ALL FIELD--NAME-FIELD-TAGS HERE: */
.field--name-field-tags .field__label:after {
  content: ":";
}

.field--name-field-tags {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}

.field--name-field-tags .field__label {
  font-weight: 600;
  font-size: 18px;
  line-height: 140%;
}

.field--name-field-tags .field__items {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.field--name-field-tags .field__items .field__item {
  border-radius: 100px;
  padding: 8px 16px;
  background-color: #FFFFFF;
}

.field--name-field-tags .field__items .field__item a {
  color: #64747C;
  font-weight: 400;
  font-size: 18px;
  line-height: 140%;
}

.field--name-field-tags .field__items .field__item a:hover {
  color: #dc3545;
}

/*ENDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDD*/

/* CSS FOR SUBMIT BUTTON: */
#block-simplenewssubscription-2 .button--primary {
  border-radius: 100px !important;
  background: #CF0E05;
  padding: 10px 16px;
}

#block-simplenewssubscription-2 .form-actions {
  border: unset;
}

#block-simplenewssubscription-2 form {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  padding: 4px;
  background-color: #fff;
  width: 100%;
  max-width: 500px;
}

#block-simplenewssubscription-2 .form-email {
  color: #64747C;
}

#block-socialmedialinks ul {
  margin: 0;
  padding: 0;
}

.service-detail-article-ref-title a {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

div#block-website-page-title .page-title .field--name-title.field--type-string.field--label-hidden {
  text-align: center;
  font-weight: 600;
  font-size: 32px;
  line-height: 140%;
  width: 100%;
  justify-content: center;
  display: flex;
  align-items: center;
}

.list-nhansu-item-wrapper {
  gap: 24px;
  padding: 16px;
  border-radius: 8px;
  background-color: #FFFFFF;
}

.list-nhansu-item-ten a {
  font-weight: 500;
  font-size: 16px;
  line-height: 140%;
  color: black;
  font-style: italic;
}

.list-nhansu-item-ten a:hover {
  color: #dc3545;
  transition: all 0.3s ease;
}

.list-nhansu-item-chucvu {
  font-weight: 500;
  font-size: 14px;
  line-height: 140%;
  letter-spacing: 1px;
}

.list-nhansu-item-thongtin {
  gap: 8px;
  padding: 0 16px 24px 16px;
}

.team-group-header {
  display: flex;
  gap: 24px;
  padding: 24px;
  flex-direction: column;
  background-color: #FFFFFF;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}

.team-group-header .team-group-header-descrip p {
  margin: 0;
}

.list-nhansu-item-img img {
  width: 226px;
  aspect-ratio: 226 / 218;
}

.list-nhansu-item-img {
  width: 100%;
  text-align: center;
}


.view.view-cac-danh-sach-trang-gioi-thieu.view-id-cac_danh_sach_trang_gioi_thieu.view-display-id-block_1 .row {
  --bs-gutter-x: 30px;
  padding: 0 24px;
}

.view.view-cac-danh-sach-trang-gioi-thieu.view-id-cac_danh_sach_trang_gioi_thieu.view-display-id-block_1 .row .col-6.col-sm-6.col-md-4.col-lg-4.col-xl-3.col-xxl-3 {
  padding: 0;
}

.view-id-cac_danh_sach_trang_gioi_thieu.view-display-id-block_1 h3 {
  padding: 0;
  margin: 0;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}

div[id^="views-bootstrap-cac-danh-sach-trang-gioi-thieu-block-1"] {
  border-bottom-right-radius: 8px;
  border-bottom-left-radius: 8px;
  margin-bottom: 24px;
  background-color: white;
}

img.object-item-icon {
  width: 40px;
  height: 35px;
  top: 2.66px;
}

.object-item-wrapper {
  box-shadow: 0px 4px 16px 0px #0000000A;
  background-color: #FFFFFF;
}

.object-item-wrapper {
  box-shadow: 0px 4px 16px 0px #0000000A;
  background-color: #ffffff;
  margin-bottom: 30px;
  height: 210px;
}

div[id^='views-bootstrap-danh-sach-muc-tieu-theo-duoi-block-1'] .row {
  --bs-gutter-x: 30px;
}

.intro-desc-img img {
  width: 100%;
  height: auto;
}

/* CSS FOR LIST PROJECTS */
div#block-website-views-block-danh-sach-du-an-block-2 {
  flex: 276;
}

div#block-website-views-block-danh-sach-du-an-block-1 {
  flex: 864;
}

.list-project-item-wrapper .list-project-item-img img {
  width: 100%;
  border-radius: 8px;
}

.list-project-item-wrapper {
  border: 1px solid #F2F2F2E5;
  background-color: #FFFFFF;
  height: 100%;
}

#views-bootstrap-danh-sach-du-an-page-1 .views-field {
  height: 100%;
}

div[id*='views-bootstrap-danh-sach-du-an-page-1'] .list-project-item-img img {
  height: 230px;
  object-fit: cover;
}


#block-website-views-block-danh-sach-du-an-block-1>div,
#block-website-views-block-danh-sach-du-an-block-2>div,
.view-id-danh_sach_du_an.view-display-id-block_1,
.view-id-danh_sach_du_an.view-display-id-block_2,
.view-display-id-block_1 .view-content,
.view-display-id-block_1 .views-row,
/* 
 .views-field,
.view-id-danh_sach_du_an.view-display-id-block_2,

.view-display-id-block_2 .views-row, */
.view-id-danh_sach_du_an.view-display-id-block_1 .views-field {
  height: 100%;
}

.list-project-item-infor a:hover {
  color: #dc3545;
  transition: all 0.3s ease;
}

.view-id-danh_sach_du_an.view-display-id-block_2 .view-content {
  display: flex;
  flex-direction: column;
  gap: 15px;
  height: 100%;
  justify-content: space-between;
}

.list-project-item-infor {
  min-height: 50px;
  padding: 0 16px 16px 16px;
}

.view-id-danh_sach_du_an.view-display-id-page_1 .view-filters {
  border: 0;
  border-radius: 0;
  padding: 0;
  background-color: unset;
  box-shadow: unset;
  max-width: unset;
  margin: 0;
  width: 100%;
}

@media(min-width:576px) {
  .view-id-danh_sach_du_an.view-display-id-page_1 .view-filters {
    width: fit-content;
  }
}

#views-exposed-form-danh-sach-du-an-page-1 .js-form-item.form-item {
  margin: 0;
}

#views-exposed-form-danh-sach-du-an-page-1 .form-text {
  min-height: unset;
  margin: 0;
  padding-left: 20px;
  outline: none;
  box-shadow: none;
  border-color: white;
}

.view-id-danh_sach_du_an.view-display-id-page_1 {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
  justify-content: space-between;
}

.list-block-projects-wrapper {
  margin-bottom: 30px;
}

div[id*='views-bootstrap-danh-sach-cong-cu-va-nen-tang-block-1'] .row {
  flex-wrap: nowrap;
  overflow: hidden;
}

#block-website-views-block-danh-sach-cong-cu-va-nen-tang-block-1 .more-link {
  text-align: center;
}

#block-website-views-block-danh-sach-cong-cu-va-nen-tang-block-1 .more-link {
  text-align: center;
  /* border-radius: 100px; */
  padding: 8px;
  display: flex;
  gap: 8px;
  justify-content: center;
  align-items: center;
  /* width: fit-content; */
}

#block-website-views-block-danh-sach-cong-cu-va-nen-tang-block-1 .more-link a {
  font-weight: 600;
  font-size: 14px;
  color: #CF0E05;
  align-items: center;
  justify-content: center;
  display: flex;
}

#block-website-views-block-danh-sach-cong-cu-va-nen-tang-block-1 .more-link a:hover {
  color: red;
  transition: all 0.3s ease;
}

.block-congcu-wrapper {
  padding: 0 16px;
}

div#views-bootstrap-danh-sach-cong-cu-va-nen-tang-block-1 {
  padding-bottom: 24px;
}

div#block-website-breadcrumbs .breadcrumb ol>li:first-child:after {
  color: currentColor;
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  border-right: 2px solid currentColor;
  border-top: 2px solid currentColor;
  transform: rotate(45deg);
  margin: 0 8px;
}

div#block-website-breadcrumbs .breadcrumb ol li:first-child:hover {
  color: red;
}

.more-link a::after {
  content: "";
  display: inline-block;
  width: 22px;
  height: 12px;
  margin-left: 10px;
  background-color: currentColor;

  -webkit-mask: url("data:image/svg+xml;utf8,\
  <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 12'>\
    <path d='M0 6h16' stroke='black' stroke-width='2'/>\
    <path d='M12 1l6 5-6 5' fill='none' stroke='black' stroke-width='2'/>\
    </svg>") no-repeat center / contain;

  mask: url("data:image/svg+xml;utf8,\
    <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 12'>\
    <path d='M0 6h16' stroke='black' stroke-width='2'/>\
    <path d='M12 1l6 5-6 5' fill='none' stroke='black' stroke-width='2'/>\
    </svg>") no-repeat center / contain;
}

#views-bootstrap-danh-sach-du-an-block-3 .row {
  --bs-gutter-y: 1.5rem;
}

.page-node-type-du_an.path-node #block-website-content .node {
  background-color: unset;
}