/* ==================================================
   FOOTER CONTAINER
   ================================================== */

.site-footer {
  width: 100%;
}

/* ==================================================
   FOOTER MAIN SECTION
   ================================================== */

.site-footer__main {
  background-color: var(--footer-bg, var(--color-gray-800));
  color: var(--footer-color, var(--color-gray-100));
  border-bottom: var(--footer-border, 1px solid var(--color-gray-700));
}

.site-footer__main .site-footer__inner {
  max-width: var(--layout-width);
  margin-inline: auto;
  padding: var(--space-2xl) var(--gutter);
}

/* ==================================================
   FOOTER WIDGETS - AUTO COLUMNS
   ================================================== */

.footer-widgets {
  display: grid;
  gap: var(--space-2xl);
}

/* Auto-fit columns based on how many are active */
.footer-widgets--cols-1 {
  grid-template-columns: 1fr;
}

.footer-widgets--cols-2 {
  grid-template-columns: repeat(2, 1fr);
}

.footer-widgets--cols-3 {
  grid-template-columns: repeat(3, 1fr);
}

.footer-widgets--cols-4 {
  grid-template-columns: repeat(4, 1fr);
}

/* Widget areas */
.footer-widget-area {
  min-width: 0; /* Prevent grid blowout */
}

/* ==================================================
   FOOTER WIDGET TITLES
   ================================================== */

/* Target first heading as widget title */
.footer-widget-area > *:first-child h1:first-of-type,
.footer-widget-area > *:first-child h2:first-of-type,
.footer-widget-area > *:first-child h3:first-of-type,
.footer-widget-area > *:first-child h4:first-of-type,
.footer-widget-area > *:first-child h5:first-of-type,
.footer-widget-area > *:first-child h6:first-of-type {
  margin-top: 0;
  margin-bottom: var(--space-md);
  padding-bottom: var(--space-sm);
  border-bottom: var(--footer-widget-title-border, 2px solid var(--color-primary));
  font-weight: var(--footer-widget-title-weight, var(--font-weight-semibold));
  color: var(--footer-widget-title-color, var(--color-gray-50));
}

/* Widget content styling */
.footer-widget-area p {
  color: var(--color-gray-300);
  line-height: var(--line-height-relaxed);
}

.footer-widget-area a {
  color: var(--footer-link-color, var(--color-gray-200));
  text-decoration: none;
  transition: color var(--transition-fast);
}

.footer-widget-area a:hover {
  color: var(--footer-link-hover-color, var(--color-primary-light));
}

/* Lists in footer */
.footer-widget-area ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.footer-widget-area ul li {
  margin-bottom: var(--space-sm);
}








/* ==================================================
   FOOTER BOTTOM SECTION (INDEPENDENT)
   ================================================== */

.site-footer__bottom {
  width: 100%;
  background-color: var(--footer-bottom-bg, var(--color-gray-900));
  color: var(--footer-bottom-color, var(--color-gray-400));
  font-size: var(--footer-bottom-font-size, var(--font-size-sm));
  min-height: var(--footer-bottom-min-height, auto);
}

.site-footer__bottom .site-footer__inner {
  max-width: var(--layout-width);
  margin-inline: auto;
  padding: var(--space-sm) var(--gutter);
}

.footer-bottom-widgets {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-md);
  justify-content: space-between;
  align-items: center;
}

.footer-bottom-widget--left {
  flex: 1 1 auto;
}

.footer-bottom-widget--right {
  flex: 1 1 auto;
  text-align: right;
}

/* Footer bottom links */
.site-footer__bottom a {
  color: var(--footer-bottom-link-color, var(--color-gray-300));
  text-decoration: none;
  transition: color var(--transition-fast);
}

.site-footer__bottom a:hover {
  color: var(--footer-bottom-link-hover-color, var(--color-gray-100));
}

/* ==================================================
   FOOTER MENU (Horizontal Navigation)
   ================================================== */

.site-footer__bottom .menu,
.site-footer__bottom #footer-menu {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--footer-menu-gap, var(--space-md));
  justify-content: flex-end;
  align-items: center;
}

.site-footer__bottom .menu-item {
  margin: 0;
  padding: 0;
}

.site-footer__bottom .menu-item a {
  display: inline-block;
  padding: var(--footer-menu-link-padding, var(--space-xs) 0);
  font-size: var(--footer-menu-font-size, var(--font-size-sm));
  font-weight: var(--footer-menu-font-weight, var(--font-weight-normal));
  color: var(--footer-menu-link-color, var(--color-gray-300));
  text-decoration: none;
  transition: color var(--transition-fast);
  position: relative;
}

.site-footer__bottom .menu-item a:hover {
  color: var(--footer-menu-link-hover-color, var(--color-gray-100));
}

/* Optional separator between menu items */
.site-footer__bottom .menu-item:not(:last-child)::after {
  content: var(--footer-menu-separator, '•');
  margin-left: var(--footer-menu-gap, var(--space-md));
  color: var(--footer-menu-separator-color, var(--color-gray-600));
  font-weight: var(--font-weight-normal);
}

/* Current page indicator */
.site-footer__bottom .menu-item.current-menu-item a,
.site-footer__bottom .menu-item.current_page_item a {
  color: var(--footer-menu-link-active-color, var(--color-gray-100));
  font-weight: var(--footer-menu-active-font-weight, var(--font-weight-medium));
}





/* ==================================================
   FOOTER COPYRIGHT & CREDITS
   ================================================== */

.footer-bottom-widget--left {
  font-size: var(--footer-copyright-font-size, var(--font-size-sm));
  color: var(--footer-copyright-color, var(--color-gray-400));
  line-height: var(--line-height-normal);
}

/* Copyright text */
.footer-bottom-widget--left p {
  margin: 0;
  display: inline;
}

/* Separator between copyright and developer credit */
.footer-copyright-separator {
  margin: 0 var(--space-sm);
  color: var(--footer-copyright-separator-color, var(--color-gray-600));
}

/* Developer link */
.footer-developer-link {
  display: inline;
  color: var(--footer-developer-link-color, var(--color-gray-300));
  text-decoration: none;
  font-weight: var(--footer-developer-link-weight, var(--font-weight-medium));
  transition: color var(--transition-fast);
}

.footer-developer-link:hover {
  color: var(--footer-developer-link-hover-color, var(--color-primary-light));
  text-decoration: underline;
}

/* Made by / Developed by text */
.footer-developer-text {
  color: var(--footer-developer-text-color, var(--color-gray-500));
  font-weight: var(--font-weight-normal);
}





/* ==================================================
   RESPONSIVE
   ================================================== */

@media (max-width: 768px) {
  .site-footer__main .site-footer__inner {
    padding: var(--space-xl) var(--gutter);
  }
  
  .footer-widgets {
    gap: var(--space-xl);
  }
  
  /* Stack footer widgets on tablet */
  .footer-widgets--cols-3,
  .footer-widgets--cols-4 {
    grid-template-columns: repeat(2, 1fr);
  }
  
  /* Stack footer bottom on mobile */
  .footer-bottom-widgets {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-sm);
  }
  
  .footer-bottom-widget--right {
    text-align: left;
  }
  
  /* Footer menu left-aligned on mobile */
  .site-footer__bottom .menu,
  .site-footer__bottom #footer-menu {
    justify-content: flex-start;
  }
}

@media (max-width: 480px) {
  .site-footer__main .site-footer__inner {
    padding: var(--space-lg) var(--gutter);
  }
  
  /* Single column on mobile */
  .footer-widgets {
    grid-template-columns: 1fr !important;
  }
  
  /* Smaller menu spacing on mobile */
  .site-footer__bottom .menu,
  .site-footer__bottom #footer-menu {
    gap: var(--space-sm);
    font-size: var(--font-size-xs);
  }
  
  .site-footer__bottom .menu-item:not(:last-child)::after {
    margin-left: var(--space-sm);
  }
}