/* Top Review Tool — Footer (loaded site-wide by plugin) */

/* ===== Footer nền trắng ===== */
#footer,
#footer.ct-footer,
.ct-footer,
footer#footer,
footer.ct-footer {
  background: #ffffff !important;
  background-color: #ffffff !important;
  color: #4A5568 !important;
  border-top: 1px solid #E2E8F0 !important;
}

#footer .ct-footer,
#footer [data-row],
#footer .ct-container,
#footer .ct-container-full,
.ct-footer [data-row],
.ct-footer .ct-container {
  background: transparent !important;
}

#footer .widget-title,
#footer .ct-widget-title,
#footer h1, #footer h2, #footer h3, #footer h4, #footer h5, #footer h6,
.ct-footer .widget-title,
.ct-footer h1, .ct-footer h2, .ct-footer h3, .ct-footer h4, .ct-footer h5, .ct-footer h6 {
  color: #1A202C !important;
}

#footer, #footer p, #footer li, #footer span,
#footer .ct-footer-copyright,
.ct-footer, .ct-footer p, .ct-footer li, .ct-footer span,
.ct-footer-copyright {
  color: #4A5568 !important;
}

#footer a, .ct-footer a, .ct-footer-copyright a {
  color: #3182CE !important;
  text-decoration: none !important;
}

#footer a:hover, .ct-footer a:hover, .ct-footer-copyright a:hover {
  color: #2B6CB0 !important;
}

#footer .ct-footer-copyright,
.ct-footer-copyright {
  border-top: 1px solid #E2E8F0 !important;
  background: #ffffff !important;
}

.ct-back-to-top {
  background: #3182CE !important;
  color: #fff !important;
  border: none !important;
}

.ct-back-to-top:hover {
  background: #2B6CB0 !important;
  color: #fff !important;
}

#footer [data-column] .ct-widget,
#footer .ct-widget:has(.trt-ft),
.ct-footer .ct-widget:has(.trt-ft) {
  width: 100% !important;
  max-width: 100% !important;
}

/* Ẩn footer widget demo Blocksy (Important / Useful Links…) — tránh link sai */
#footer [data-column^="widget-area"],
.ct-footer [data-column^="widget-area"],
#footer .widget_text:not(:has(.trt-ft)),
#footer .widget_nav_menu,
#footer .widget_block:not(:has(.trt-ft)) {
  display: none !important;
}

/* Cột chứa footer mới: full width */
#footer [data-column]:has(.trt-ft),
.ct-footer [data-column]:has(.trt-ft),
#footer .trt-ft {
  width: 100% !important;
  max-width: 1120px !important;
}

/* Footer shortcode inyect trước row — căn giữa */
#footer > .trt-ft,
.ct-footer > .trt-ft,
#footer .ct-container > .trt-ft {
  display: grid !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* ===== 4 cột đều ===== */
.trt-ft {
  display: grid !important;
  grid-template-columns: 1fr 1fr 1fr 1fr !important;
  column-gap: 32px !important;
  row-gap: 24px !important;
  align-items: start !important;
  justify-items: stretch !important;
  width: 100% !important;
  max-width: 1120px !important;
  margin: 0 auto !important;
  padding: 12px 0 20px !important;
  box-sizing: border-box !important;
  border: 0 !important;
}

.trt-ft > *:not(.trt-ft-col) {
  display: none !important;
}

.trt-ft > .trt-ft-col {
  grid-column: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  float: none !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  display: block !important;
  box-sizing: border-box !important;
}

.trt-ft br {
  display: none !important;
}

.trt-ft-logo {
  display: inline-block !important;
  margin: 0 0 14px !important;
  text-decoration: none !important;
}

.trt-ft-logo img {
  display: block !important;
  max-width: 150px !important;
  height: auto !important;
  border: 0 !important;
}

.trt-ft-tagline {
  margin: 0 0 8px !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  color: #1A202C !important;
  line-height: 1.35 !important;
}

.trt-ft-desc {
  margin: 0 !important;
  font-size: 0.875rem !important;
  color: #718096 !important;
  line-height: 1.55 !important;
  word-break: break-word !important;
}

.trt-ft-title {
  margin: 0 0 14px !important;
  padding: 0 !important;
  font-size: 0.95rem !important;
  font-weight: 700 !important;
  color: #1A202C !important;
  line-height: 1.3 !important;
}

.trt-ft-list {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.trt-ft-list li {
  margin: 0 0 10px !important;
  padding: 0 !important;
  font-size: 0.9rem !important;
  line-height: 1.4 !important;
  color: #4A5568 !important;
  word-break: break-word !important;
}

.trt-ft-list a {
  color: #3182CE !important;
  text-decoration: none !important;
}

.trt-ft-list a:hover {
  color: #2B6CB0 !important;
}

/* Social icons — Blocksy Social Network Accounts */
.trt-ft-social {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin: 10px 0 14px !important;
  line-height: 0 !important;
}

.trt-ft-social-link {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 40px !important;
  height: 40px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 1px solid #BEE3F8 !important;
  border-radius: 50% !important;
  background: #F0F7FF !important;
  color: #3182CE !important;
  line-height: 0 !important;
  text-decoration: none !important;
  box-sizing: border-box !important;
  flex-shrink: 0 !important;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease, transform 0.15s ease !important;
}

.trt-ft-social-link:hover,
.trt-ft-social-link:focus {
  background: #3182CE !important;
  border-color: #3182CE !important;
  color: #ffffff !important;
  transform: translateY(-1px) !important;
}

.trt-ft-social-link svg,
.trt-ft-social-icon {
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  flex-shrink: 0 !important;
  overflow: visible !important;
}

.trt-ft-legal {
  margin-top: 4px !important;
  padding-top: 12px !important;
  border-top: 1px solid #E2E8F0 !important;
}

.trt-ft-legal li {
  display: inline-block !important;
  margin: 0 12px 0 0 !important;
  font-size: 0.8rem !important;
}

@media (max-width: 768px) {
  .trt-ft {
    grid-template-columns: 1fr 1fr !important;
    column-gap: 24px !important;
  }
  .trt-ft > .trt-ft-brand {
    grid-column: 1 / -1 !important;
  }
}

@media (max-width: 480px) {
  .trt-ft {
    grid-template-columns: 1fr !important;
  }
  .trt-ft > .trt-ft-brand {
    grid-column: auto !important;
  }
}