/**
 * Custom Footer Styles
 * All columns center-aligned for a clean, symmetrical footer layout.
 */

/* Dark background to match the design */
.footer {
  background-color: #1a1a1a;
}

/* Force all footer columns to center-align content */
.footer .footer-column {
  text-align: center;
}

/* Center-align widget titles (headings like QUICK LINKS, OUR BRANDS, FOLLOW US ON) */
.footer .footer-column .widget-title {
  text-align: center;
}

/* Center-align navigation menu lists within footer */
.footer .footer-column .widget_nav_menu ul {
  list-style: none;
  padding: 0;
  margin: 0;
  text-align: center;
}

.footer .footer-column .widget_nav_menu ul li {
  display: block;
  text-align: center;
  margin: 0;
  padding: 2px 0;
}

.footer .footer-column .widget_nav_menu ul li a {
  display: inline-block;
  text-align: center;
}

/* Center-align text widgets (used in central column with logo + address) */
.footer .footer-column .widget_text,
.footer .footer-column .textwidget {
  text-align: center;
}

/* Tighten vertical spacing in the central column for a more cohesive block */
.footer .footer-column .textwidget p {
  margin: 0.4em 0;
  text-align: center;
}

.footer .footer-column .textwidget img {
  display: block;
  margin: 0 auto 0.4em;
}

/* Center-align any custom HTML widget content */
.footer .footer-column .widget_custom_html {
  text-align: center;
}

/* Ensure paragraphs in footer are centered */
.footer .footer-column p {
  text-align: center;
}

/* Center any list-based widgets */
.footer .footer-column ul,
.footer .footer-column ol {
  list-style-position: inside;
  padding-left: 0;
  text-align: center;
}

/* Ensure the grid row uses equal column distribution */
.footer .hgrid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-start;
}

/* Keep footer columns aligned at top with equal distribution */
.footer .hgrid > [class*="hgrid-span-"] {
  float: none;
  text-align: center;
}

/* Responsive: stack columns and keep center alignment on mobile */
@media only screen and (max-width: 969px) {
  .footer .hgrid {
    flex-direction: column;
    align-items: center;
  }

  .footer .hgrid > [class*="hgrid-span-"] {
    width: 100%;
    text-align: center;
    margin-bottom: 1.5em;
  }
}
