/* ==========================================================
   CLOUDX FLIC UI v1.7.9 - Footer-only spacing refinement
   - Chỉ tác động Footer.
   - Không thay đổi kích thước, khoảng cách hoặc bố cục Header.
   - Bỏ logo Footer và phân bố lại các cột cho cân đối hơn.
========================================================== */

:root {
  --cflic-footer-layout-max: 1824px;
  --cflic-footer-layout-gutter: 48px;
}

/* Khung Footer rộng, có lề an toàn hai bên gần bố cục Udemy. */
.cloudx-flic-ui-active .cflic-footer-v162 .cflic-footer-wide {
  width: min(
    var(--cflic-footer-layout-max),
    calc(100% - (var(--cflic-footer-layout-gutter) * 2))
  ) !important;
  max-width: var(--cflic-footer-layout-max) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.cloudx-flic-ui-active .cflic-footer-v162 .cflic-footer-main {
  padding-top: 48px !important;
  padding-bottom: 38px !important;
}

/* Logo Footer đã được bỏ khỏi HTML; quy tắc này là lớp bảo vệ khi cache cũ còn tồn tại. */
.cloudx-flic-ui-active .cflic-footer-v162 .cflic-footer-logo {
  display: none !important;
}

.cloudx-flic-ui-active .cflic-footer-v162 .cflic-footer-brand-col {
  padding-top: 0 !important;
}

.cloudx-flic-ui-active .cflic-footer-v162 .cflic-footer-desc {
  margin-top: 0 !important;
  max-width: 390px !important;
}

/* Desktop rộng: năm cột phủ đều chiều ngang, không dồn cụm vào giữa. */
@media (min-width: 1281px) {
  .cloudx-flic-ui-active .cflic-footer-v162 .cflic-footer-grid {
    grid-template-columns:
      minmax(0, 1.22fr)
      minmax(0, 1.16fr)
      minmax(0, .84fr)
      minmax(0, .90fr)
      minmax(0, 1fr) !important;
    gap: 0 !important;
  }

  .cloudx-flic-ui-active .cflic-footer-v162 .cflic-footer-brand-col {
    padding-left: 0 !important;
    padding-right: 38px !important;
  }

  .cloudx-flic-ui-active .cflic-footer-v162 .cflic-footer-col {
    min-height: 300px !important;
    padding-left: 30px !important;
    padding-right: 30px !important;
  }
}

/* Laptop: ba cột, khoảng cách đều và không tác động Header. */
@media (max-width: 1280px) and (min-width: 922px) {
  :root {
    --cflic-footer-layout-gutter: 28px;
  }

  .cloudx-flic-ui-active .cflic-footer-v162 .cflic-footer-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 34px 0 !important;
  }

  .cloudx-flic-ui-active .cflic-footer-v162 .cflic-footer-brand-col,
  .cloudx-flic-ui-active .cflic-footer-v162 .cflic-footer-col {
    grid-column: auto !important;
    min-height: auto !important;
    padding-left: 24px !important;
    padding-right: 24px !important;
  }

  .cloudx-flic-ui-active .cflic-footer-v162 .cflic-footer-brand-col {
    padding-left: 0 !important;
  }

  .cloudx-flic-ui-active .cflic-footer-v162 .cflic-footer-col:nth-child(4) {
    border-left: 0 !important;
    padding-left: 0 !important;
  }
}

@media (max-width: 921px) {
  :root {
    --cflic-footer-layout-gutter: 20px;
  }

  .cloudx-flic-ui-active .cflic-footer-v162 .cflic-footer-wide {
    width: calc(100% - (var(--cflic-footer-layout-gutter) * 2)) !important;
  }

  .cloudx-flic-ui-active .cflic-footer-v162 .cflic-footer-brand-col {
    grid-column: 1 / -1 !important;
  }
}

@media (max-width: 600px) {
  :root {
    --cflic-footer-layout-gutter: 16px;
  }

  .cloudx-flic-ui-active .cflic-footer-v162 .cflic-footer-main {
    padding-top: 30px !important;
    padding-bottom: 24px !important;
  }
}