/* ClueRally Shared Nav/Footer Styles
 * Loaded on every page that uses /includes/nav.php and /includes/footer.php
 * Site-nav styles live in style.css (already loaded everywhere).
 * This file only contains footer-links + contact-toast which originated in home.css.
 */

/* FOOTER LINKS */
.footer-links { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--spacing-sm) var(--spacing-lg); padding: var(--spacing-lg); color: var(--text-muted); font-size: 0.875rem; }
.footer-links a { white-space: nowrap; }

/* CONTACT TOAST */
.contact-toast-wrapper { position: relative; display: inline-block; }
.contact-toast { position: absolute; bottom: calc(100% + 12px); right: 0; transform: translateY(8px); background: var(--bg-card); border: 1px solid var(--border-light); border-radius: var(--radius-lg); box-shadow: var(--shadow-lg), 0 0 40px rgba(0,0,0,0.4); padding: var(--spacing-md); min-width: 220px; opacity: 0; visibility: hidden; transition: opacity var(--transition-normal), transform var(--transition-normal), visibility var(--transition-normal); z-index: 100; }
.contact-toast.active { opacity: 1; visibility: visible; transform: translateY(0); }
.contact-toast::after { content: ''; position: absolute; top: 100%; right: 20px; transform: none; border: 8px solid transparent; border-top-color: var(--border-light); }
.contact-toast::before { content: ''; position: absolute; top: 100%; right: 21px; transform: none; border: 7px solid transparent; border-top-color: var(--bg-card); z-index: 1; }
.contact-toast-btn { display: flex; align-items: center; gap: var(--spacing-sm); width: 100%; padding: var(--spacing-md); background: transparent; border: none; border-radius: var(--radius-md); color: var(--text-primary); font-size: 0.9rem; font-weight: 500; cursor: pointer; transition: background var(--transition-fast); font-family: var(--font-family); white-space: nowrap; }
.contact-toast-btn:hover { background: var(--bg-secondary); }
.contact-toast-btn svg { width: 18px; height: 18px; flex-shrink: 0; }
.contact-toast-divider { height: 1px; background: var(--border-color); margin: var(--spacing-xs) 0; }
.contact-toast-btn.copied { color: var(--success-light); pointer-events: none; }