/* =========================================================
   Nhận diện thương hiệu mới cho TRANG CON (áp dụng khi <body class="aas-brand">).
   Hiện áp dụng cho các trang dùng template "Giao diện sidebar" (xem header.php).
   Quy tắc giống các thay đổi đã làm ở trang chủ: font Bai Jamjuree, navy #203567 / #0f1d3d, lime #8cc63f.
   Muốn áp dụng cho loại trang khác: thêm class aas-brand vào <body> trong header.php.
   Ảnh (banner, ảnh bài viết, ảnh ACF) không chỉnh ở đây.
   ========================================================= */

/* ---------- Font + biến màu dùng chung ---------- */
body.aas-brand {
  --f-body: "Bai Jamjuree", "Segoe UI", Arial, sans-serif;
  font-family: var(--f-body);
  --text-logo: #203567;
  --text-title: #8cc63f;
  --pagination-bullet-active: #8cc63f;
  --luxury-green-radial-primary: radial-gradient(100% 100% at 50% 0%, #2d4b8e 5.73%, #172a52 64.06%);
  --luxury-green-radial-secondary: radial-gradient(96.67% 96.67% at 50% 3.33%, #203567 0%, #0f1d3d 59.38%);
  --fill-background: linear-gradient(270deg, #203567 0%, #0f1d3d 100%);
  --accessible-red: #8cc63f;
  --accessible-red-hover: #9bd24e;
  --general-fill-primary: linear-gradient(90deg, #8cc63f, #8cc63f);
  --general-label-primary: linear-gradient(90deg, #8cc63f, #8cc63f);
}
body.aas-brand .highcharts-container,
body.aas-brand .highcharts-container * {
  font-family: inherit !important;
}

/* ---------- Chữ: xanh lá cũ -> navy ---------- */
body.aas-brand .text-text-logo,
body.aas-brand .text-text-quaternary {
  color: #203567;
}
body.aas-brand .text-text-title,
body.aas-brand a.text-text-title {
  color: #8cc63f;
}

/* ---------- Banner đầu trang: lớp phủ navy ---------- */
body.aas-brand .first-banner::before {
  background: linear-gradient(90deg, #0f1d3d 20.36%, rgba(15, 29, 61, 0) 100%), linear-gradient(180deg, #0f1d3d 0%, rgba(15, 29, 61, 0) 100%);
}
body.aas-brand .link-white-yellow:hover,
body.aas-brand a.link-white-yellow:hover {
  color: #8cc63f;
}

/* ---------- Sidebar ---------- */
body.aas-brand .side-bar .main-sidebar .sub-bar .sub-bar-list .sub-row:hover,
body.aas-brand .side-bar .main-sidebar .sub-bar .sub-bar-list .sub-row.active {
  color: #203567;
}

/* ---------- Nút (đỏ viền vàng / xanh lá viền vàng) -> lime, chữ navy ---------- */
body.aas-brand .button-wrap.bg-red,
body.aas-brand .button-wrap.bg-red .inner,
body.aas-brand .button-wrap.bg-green,
body.aas-brand .button-wrap.bg-green .inner,
body.aas-brand .button-wrap.bg-green-second,
body.aas-brand .button-wrap.bg-green-second .inner {
  background: #8cc63f;
}
body.aas-brand .button-wrap.bg-red:hover .inner,
body.aas-brand .button-wrap.bg-green:hover .inner,
body.aas-brand .button-wrap.bg-green-second:hover .inner {
  background: #9bd24e;
}
body.aas-brand .button-wrap.bg-red .inner .text,
body.aas-brand .button-wrap.bg-green .inner .text,
body.aas-brand .button-wrap.bg-green-second .inner .text {
  background: none;
  -webkit-text-fill-color: #0f1d3d;
  color: #0f1d3d;
}
body.aas-brand .button-wrap.bg-red:before,
body.aas-brand .button-wrap.bg-green:before,
body.aas-brand .button-wrap.bg-green-second:before {
  background: linear-gradient(var(--angle), rgba(255, 255, 255, .7) 0%, rgba(255, 255, 255, 0) 30%, rgba(255, 255, 255, 0) 69%, rgba(255, 255, 255, .7) 100%);
}
body.aas-brand .button-wrap.bg-trans:hover .inner {
  background: #8cc63f;
}
body.aas-brand .button-wrap.bg-trans:hover .inner .text {
  background: none;
  -webkit-text-fill-color: #0f1d3d;
  color: #0f1d3d;
}

/* ---------- Link: vàng/cam -> lime ; xanh lá -> navy ---------- */
body.aas-brand .link-yellow,
body.aas-brand .dvck-item .content .show-more,
body.aas-brand .research-item .content .learn-more,
body.aas-brand .research-item .content .download {
  color: #8cc63f;
}
body.aas-brand .link-yellow svg path,
body.aas-brand .dvck-item .content .show-more svg path,
body.aas-brand .research-item .content .download svg path {
  fill: #8cc63f;
}
body.aas-brand .research-item .content .learn-more svg path {
  stroke: #8cc63f;
}
body.aas-brand .link-yellow:hover,
body.aas-brand .research-item:hover .content .download,
body.aas-brand .research-item:hover .content .learn-more {
  color: #4d7a26;
}
body.aas-brand .link-yellow:hover svg path,
body.aas-brand .research-item:hover .content .download svg path {
  fill: #4d7a26;
}
body.aas-brand .research-item:hover .content .learn-more svg path {
  stroke: #4d7a26;
}
body.aas-brand .link-green:hover {
  color: #4d7a26;
}
body.aas-brand .link-green:hover svg path {
  fill: #4d7a26;
}
body.aas-brand .bg-\[\#D28D3E\] {
  background-color: #8cc63f;
}
body.aas-brand .research-item:hover,
body.aas-brand .dvck-item:hover {
  border-color: #8cc63f;
}

/* ---------- Tab danh mục ---------- */
body.aas-brand .items-green.active,
body.aas-brand .items-green:hover {
  color: #203567;
}
body.aas-brand .items-green.active::before,
body.aas-brand .items-green:hover::before {
  background: linear-gradient(270deg, #fff 9.92%, #8cc63f 50.41%, #fff 90.19%);
}

/* ---------- Slider: mũi tên + chấm phân trang lime ---------- */
body.aas-brand .swiper-button-container .swiper-button-prev:after,
body.aas-brand .swiper-button-container .swiper-button-next:not(.disabled):after {
  background: #8cc63f;
  -webkit-mask: center / contain no-repeat;
  mask: center / contain no-repeat;
}
body.aas-brand .swiper-button-container .swiper-button-prev:after {
  -webkit-mask-image: url(../image/icon/arrow-left.svg);
  mask-image: url(../image/icon/arrow-left.svg);
}
body.aas-brand .swiper-button-container .swiper-button-next:not(.disabled):after {
  -webkit-mask-image: url(../image/icon/arrow-right.svg);
  mask-image: url(../image/icon/arrow-right.svg);
}

/* ---------- Icon nhỏ của theme (đổi màu bằng mask, giữ nguyên file) ---------- */
body.aas-brand figure:has(> img[src*="calendar-green.svg"]) {
  background: #203567;
  -webkit-mask: url(../image/icon/calendar-green.svg) center / contain no-repeat;
  mask: url(../image/icon/calendar-green.svg) center / contain no-repeat;
}
body.aas-brand figure:has(> img[src*="calendar-green.svg"]) img {
  visibility: hidden;
}
body.aas-brand figure:has(> img[src*="arrow-square-right.svg"]) {
  background: #8cc63f;
  -webkit-mask: url(../image/homepage/arrow-square-right.svg) center / contain no-repeat;
  mask: url(../image/homepage/arrow-square-right.svg) center / contain no-repeat;
}
body.aas-brand figure:has(> img[src*="arrow-square-right.svg"]) img {
  visibility: hidden;
}

/* ---------- Thẻ "Tiện ích giao dịch" (tigd): navy + lime ---------- */
body.aas-brand .tigd-wrap {
  background: linear-gradient(180deg, #8cc63f 0%, rgba(140, 198, 63, 0) 100%);
}
body.aas-brand .tigd-inner {
  background: linear-gradient(180deg, #203567 0%, #0f1d3d 70%);
}
body.aas-brand .tigd-inner .icon-wrap {
  background: linear-gradient(var(--angle), rgba(0, 0, 0, 0) 15%, #8cc63f 51%, rgba(0, 0, 0, 0) 89%);
}
body.aas-brand .tigd-inner .icon-inner {
  background: #172a52;
}
body.aas-brand .tigd-inner:hover .icon-inner {
  background: #0f1d3d;
}
/* Chữ trong thẻ: tiêu đề + mô tả màu trắng */
body.aas-brand .tigd-inner .title,
body.aas-brand .tigd-inner .desc,
body.aas-brand .tigd-inner .text-gradient {
  background: none;
  -webkit-text-fill-color: #fff;
  color: #fff;
}
body.aas-brand .text-gradient {
  background: none;
  -webkit-text-fill-color: #8cc63f;
  color: #8cc63f;
}

/* ---------- Khác ---------- */
body.aas-brand .bg-\[\#DFFFE6\] {
  background-color: #eef7dd;
}
body.aas-brand .bg-luxury-green-primary {
  background: var(--luxury-green-radial-primary);
}

/* ---------- Khối "Ưu đãi đặc biệt": link "Xem thêm" (a.download) ---------- */
body.aas-brand .special-offer-item .content .download {
  color: #8cc63f;
}
body.aas-brand .special-offer-item .content .download svg path {
  fill: #8cc63f;
}
body.aas-brand .special-offer-item .content .download:hover {
  color: #4d7a26;
}
body.aas-brand .special-offer-item .content .download:hover svg path {
  fill: #4d7a26;
}

/* ---------- Nội dung soạn thảo (ACF/WYSIWYG) còn style inline xanh lá cũ -> navy ----------
   Chỉ là lớp ghi đè khi hiển thị; nên sửa lại màu trong trình soạn thảo khi có thời gian. */
body.aas-brand [style*="color: #115231" i],
body.aas-brand [style*="color:#115231" i],
body.aas-brand [style*="color: #105031" i],
body.aas-brand [style*="color:#105031" i],
body.aas-brand [style*="color: #105000" i],
body.aas-brand [style*="color:#105000" i],
body.aas-brand [style*="color: #008000" i],
body.aas-brand [style*="color:#008000" i] {
  color: #203567 !important;
}
body.aas-brand [style*="background-color: #105031" i],
body.aas-brand [style*="background-color:#105031" i],
body.aas-brand [style*="background-color: #105000" i],
body.aas-brand [style*="background-color:#105000" i] {
  background-color: #203567 !important;
}

/* ---------- Mũi tên vàng trong nút -> navy (nút giờ có nền lime) ---------- */
body.aas-brand figure:has(> img[src*="arrow-right-gradient-yellow"]) {
  background: #0f1d3d;
  -webkit-mask: url(../image/icon/arrow-right-gradient-yellow-2.svg) center / contain no-repeat;
  mask: url(../image/icon/arrow-right-gradient-yellow-2.svg) center / contain no-repeat;
}
body.aas-brand figure:has(> img[src*="arrow-right-gradient-yellow"]) img {
  visibility: hidden;
}

/* ---------- Footer: nút "Gửi" của form bản tin giữ kiểu riêng (navy + chữ lime), không theo luật nút lime ở trên ---------- */
body.aas-brand .ft .footer-form .wpcf7-submit {
  background: #0f1d3d;
  color: #8cc63f;
}
body.aas-brand .ft .footer-form .wpcf7-submit:hover {
  background: #8cc63f;
  color: #0f1d3d;
}
body.aas-brand .ft .footer-form .wpcf7-submit .inner {
  background: none;
}
body.aas-brand .ft .footer-form .wpcf7-submit .inner .text {
  background: none;
  -webkit-text-fill-color: currentColor;
  color: inherit;
}

/* ---------- Bảng biểu phí: dòng tiêu đề ---------- */
body.aas-brand .table-bpgd-wrap .bpgd-table .head,
body.aas-brand .table-bpgd-wrap .bpgd-table .head .head-item {
  background-color: #203567;
}

/* ---------- Thanh gạch trang trí vàng (style inline) -> lime ---------- */
body.aas-brand [style*="#FFCE6F" i][style*="linear-gradient"] {
  background: linear-gradient(90deg, #8cc63f 0%, rgba(140, 198, 63, 0) 93.75%) !important;
}

/* ---------- Tiêu đề dùng class text-color-text (màu #115231 cứng trong cấu hình Tailwind) ---------- */
body.aas-brand .text-color-text {
  color: #203567;
}

/* ---------- Tiêu đề chữ gradient xanh lá cũ (text-gradient + bg-fill-background) -> navy ---------- */
body.aas-brand .text-gradient.bg-fill-background {
  -webkit-text-fill-color: #203567;
  color: #203567;
}

/* ---------- Chữ dùng token xanh lá của cấu hình Tailwind (text-158 = #15852B) ---------- */
body.aas-brand .text-text-158 {
  color: #203567;
}

/* ---------- Banner đầu trang (lớp phủ xanh lá cũ) cho mọi trang có .first-banner, kể cả trang không dùng template sidebar
   (danh mục tin, taxonomy…). Chỉ đổi banner, không đổi phần thân trang. ---------- */
.first-banner::before {
  background: linear-gradient(90deg, #0f1d3d 20.36%, rgba(15, 29, 61, 0) 100%), linear-gradient(180deg, #0f1d3d 0%, rgba(15, 29, 61, 0) 100%);
}

/* ---------- Ô lọc/tìm kiếm (.filter-faq): viền vàng -> lime, chữ xanh lá -> navy ---------- */
body.aas-brand .filter-faq .select-wrap::before,
body.aas-brand .filter-faq .input-wrap::before {
  background: linear-gradient(-90deg, #669f3f 0%, #8cc63f 50%, #669f3f 100%);
}
body.aas-brand .filter-faq .select-wrap .select-element {
  color: #203567;
}

/* ---------- Dải đệm 162px dưới header (trang không có banner) ---------- */
body.aas-brand section.h-\[162px\] {
  background: radial-gradient(140.12% 140.12% at 50% -40.12%, #2d4b8e 0%, #172a52 60%, #0f1d3d 100%);
}

/* ---------- Trang tin tuyển dụng: tab đang chọn + khung thông tin chung ---------- */
body.aas-brand .tab-item.active { color: #203567; border-color: #203567; }

/* ---------- Trang eKYC: link cam -> lime ---------- */
body.aas-brand .link-title { color: #8CC63F; }
body.aas-brand .link-title svg path { fill: #8CC63F; }
body.aas-brand .link-title:hover { color: #203567; }
body.aas-brand .link-title:hover svg path { fill: #203567; }

/* ---------- Trang landing Khách hàng cá nhân / tổ chức: token xanh lá còn lại ---------- */
body.aas-brand .text-text-button { color: #203567; }
body.aas-brand .bg-text-button { background-color: #203567; }
body.aas-brand .bg-text-158 { background-color: #203567; }
/* Lớp phủ gradient của banner đầu trang đặt bằng style inline (màu xanh rgba(2,84,54)) */
body.aas-brand [style*="rgba(2,84,54,0)"],
body.aas-brand [style*="rgba(2, 84, 54, 0)"] {
  background: linear-gradient(90deg, #0f1d3d 20.36%, rgba(15, 29, 61, 0) 100%), linear-gradient(180deg, #0f1d3d 0%, rgba(15, 29, 61, 0) 100%) !important;
}

/* ---------- Thẻ dịch vụ Khách hàng tổ chức: lớp phủ xanh lá -> navy ---------- */
body.aas-brand .khtc-wrap:after {
  background: linear-gradient(180deg, rgba(15, 29, 61, 0) 68.96%, rgba(32, 53, 103, 0.85) 92.52%);
}
body.aas-brand .khtc-wrap .context h2.text-gradient {
  -webkit-text-fill-color: #fff;
  color: #fff;
  background: none;
}

/* ---------- Bảng so sánh (.gdps-table), thẻ tvgd, dvck: dải/lớp phủ xanh lá cũ -> navy ---------- */
body.aas-brand .gdps-table th {
  background: linear-gradient(270deg, #203567 0%, #0f1d3d 100%);
}
body.aas-brand .tvgd-wrap .img:after {
  background: linear-gradient(180deg, rgba(15, 29, 61, 0) 0%, #0f1d3d 100%);
}
body.aas-brand .tvgd-wrap .context {
  background: radial-gradient(100% 100% at 50% 0%, #2D4B8E 5.73%, #172A52 64.06%);
}
body.aas-brand .user-stack-wrap .user-item.border-green {
  border-color: #203567;
}

/* ---------- Thẻ dịch vụ (Khách hàng cá nhân…) khi rê chuột: viền + lớp phủ ảnh xanh lá cũ -> màu mới (trang chủ và trang con) ---------- */
body.aas-home .dvck-item:hover,
body.aas-home .research-item:hover {
  border-color: #8cc63f;
}
body.aas-home .dvck-item:hover .images::before,
body.aas-brand .dvck-item:hover .images::before {
  background: linear-gradient(0deg, #203567 0%, rgba(32, 53, 103, 0) 100%);
}

/* ---------- Nút "Tìm kiếm" (.button-faq): nền navy, rê chuột -> lime ---------- */
body.aas-brand .filter-faq .button-faq {
  background: #203567;
  border-color: #203567;
  color: #fff;
  cursor: pointer;
  transition: background-color .25s, border-color .25s, color .25s;
}
body.aas-brand .filter-faq .button-faq:hover {
  background: #8cc63f;
  border-color: #8cc63f;
  color: #0f1d3d;
}

/* ---------- Chữ gradient bị đặt navy cố định -> khi thẻ đổi nền tối lúc rê chuột phải trắng (sptc-item, nhóm group-hover:bg-white) ---------- */
body.aas-brand .sptc-item:hover p,
body.aas-brand .group:hover .group-hover\:bg-white.text-gradient {
  -webkit-text-fill-color: #fff;
  color: #fff;
}

/* ---------- Mobile/tablet: sidebar thu gọn không được che nút mở sidebar (.nav-open-sidebar) ---------- */
@media (max-width: 1279px) {
  .side-bar.collapsed { pointer-events: none; }
  .side-bar.collapsed .collapse-sidebar { pointer-events: auto; }
}
/* Header mới cố định (z-index 999) che phần đầu sidebar khi mở trên mobile/tablet -> chừa chỗ cho header */
@media (max-width: 1279px) {
  .side-bar .side-container { padding-top: 100px; }
}

/* ---------- Dropdown <select> bị lệch vị trí (danh sách chọn nhảy sang chỗ khác) khi select hoặc vùng chứa có backdrop-filter ---------- */
select,
select.input-field,
.wpcf7 select,
.form-container,
.input-label,
.input-label select.input-field {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* ---------- Dropdown tự vẽ cho <select> trong form CF7 (assets/js/custom-select.js) ---------- */
.cs-wrap { position: relative; width: 100%; }
.cs-wrap .cs-native { position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: 0; pointer-events: none; }
.cs-btn {
  display: block; width: 100%; min-height: 50px; padding: 13px 44px 13px 15px; text-align: left; cursor: pointer;
  border: 1px solid #ccc; border-radius: 12px; font: inherit; font-size: 14px; color: #292929;
  background: #fff url("../image/icon/chev-down-24-1c.svg") no-repeat right 14px center / 20px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  transition: border-color .2s, box-shadow .2s;
}
.cs-btn:hover, .cs-btn:focus-visible, .cs-wrap.cs-open .cs-btn { border-color: #203567; outline: 0; }
.cs-wrap.cs-open .cs-btn { box-shadow: 0 0 0 3px rgba(32, 53, 103, .12); }
.cs-native.wpcf7-not-valid ~ .cs-btn { border-color: #dd2027; }
.cs-list {
  position: absolute; left: 0; right: 0; top: calc(100% + 6px); z-index: 60; max-height: 240px; overflow-y: auto;
  margin: 0; padding: 6px; list-style: none; background: #fff; border: 1px solid #e4e4e4; border-radius: 12px;
  box-shadow: 0 10px 28px rgba(15, 29, 61, .18);
}
.cs-list[hidden] { display: none; }
.cs-list li { padding: 10px 12px; border-radius: 8px; font-size: 14px; line-height: 1.4; color: #292929; cursor: pointer; }
.cs-list li:hover { background: #eef2fa; color: #203567; }
.cs-list li.cs-on { background: #203567; color: #fff; }

/* ---------- QA: chấm slider đang chọn ở trang chủ (aas-home) dùng biến cũ #15852B -> lime ---------- */
body.aas-home { --pagination-bullet-active: #8cc63f; }
body.aas-home .swiper-pagination-bullet-active { background: #8cc63f; }


/* QA: .shadow-2-bold bóng xanh lá cũ -> navy */
body.aas-brand .shadow-2-bold, body.aas-home .shadow-2-bold {
  -webkit-box-shadow: 0px 7.55px 9.09px 0px rgba(32, 53, 103, 0.1), 0px 3.09px 4.18px 0px rgba(32, 53, 103, 0.1);
          box-shadow: 0px 7.55px 9.09px 0px rgba(32, 53, 103, 0.1), 0px 3.09px 4.18px 0px rgba(32, 53, 103, 0.1);
}


/* ---------- Chữ trong nội dung bài có style inline xanh lá rừng #053725 -> navy ---------- */
body.aas-brand [style*="color: #053725" i],
body.aas-brand [style*="color:#053725" i] {
  color: #203567 !important;
}


/* ---------- #20 Uỷ thác đầu tư: subtitle inline xanh lá #025436 -> navy, nhẹ hơn tiêu đề (medium) ---------- */
body.aas-brand [style*="color: #025436" i],
body.aas-brand [style*="color:#025436" i] {
  color: #203567 !important;
}
body.aas-brand .col-left [style*="color: #025436" i],
body.aas-brand .col-left [style*="color:#025436" i],
body.aas-brand .col-left [style*="#025436" i] strong,
body.aas-brand .col-left strong[style*="#025436" i] {
  font-weight: 500 !important;
}


/* ---------- #36 FAQ: khối "Bạn thấy câu trả lời này hữu ích không?" gradient vàng gold nhạt -> lime nhạt ---------- */
body.aas-brand .favorite-zone {
  background: linear-gradient(90deg, rgba(140, 198, 63, .10) 6.25%, rgba(197, 229, 143, .14) 50%, rgba(140, 198, 63, .10) 93.75%);
}



/* ---------- #68 DV thị trường nợ (EN/VI): thẻ navy .s2-bg tuyệt đối (>=1280px) dài hơn ảnh, tràn xuống tiêu đề section kế -> thêm khoảng đệm ---------- */
@media (min-width: 1280px) {
  body.aas-brand section:has(> .container.relative > div.\32xl\:absolute .s2-bg) { padding-bottom: 4rem; }
}