/* =============================================================================
   Site Footer Component
   Shared footer styling for all pages (visual styles only)
   Grid positioning handled in /static/css/04-layouts/_universal_grid.css
   ============================================================================= */

/* Footer Base Styling */
.site-footer {
    background-color: var(--color-gray-100);
    border-top: var(--border-width-1) solid var(--color-gray-200);
    padding: var(--spacing-6) var(--spacing-4);
    margin-top: var(--spacing-8);
}

/* Footer Content Container */
.site-footer .footer-content {
    text-align: center;
}

/* Legal Links Section */
.footer-legal {
    margin-bottom: var(--spacing-4);
}

.footer-legal a {
    color: var(--color-text-secondary);
    text-decoration: none;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-normal);
}

.footer-legal a:hover,
.footer-legal a:focus {
    color: var(--color-accent);
    text-decoration: underline;
}

/* Separator between links */
.footer-legal .separator {
    margin: 0 var(--spacing-3);
    color: var(--color-text-muted);
    font-weight: var(--font-weight-light);
}

/* Copyright/Info Section */
.footer-info {
    color: var(--color-text-muted);
    font-size: var(--font-size-xs);
}

.footer-info small {
    font-size: inherit;
}

/* Responsive: Stack footer elements on mobile */
@media (max-width: 768px) {
    .site-footer {
        padding: var(--spacing-5) var(--spacing-3);
        margin-top: var(--spacing-6);
    }

    .footer-legal {
        margin-bottom: var(--spacing-3);
    }

    .footer-legal a {
        font-size: var(--font-size-xs);
    }

    .footer-legal .separator {
        margin: 0 var(--spacing-2);
    }
}