/* ==========================================================
   FOOTER STYLES
   For Alba Wildlife Cruises Prototype
   ========================================================== */

/* ----- Base footer wrapper ----- */
.site-footer {
    background: var(--panel);
    border-top: 1px solid rgba(148,163,184,.15);
    color: var(--ink-2);
    padding: 2rem 1rem;
    font-size: 0.95rem;
}

    /* ----- Layout ----- */
    .site-footer .container {
        display: flex;
        flex-direction: row;
        align-items: flex-end; /* right align all contents */
        text-align: right;
    }

    /* ----- Legal navigation ----- */
    .site-footer .legal-nav {
        margin-bottom: 0.75rem;
        width: 100%;
    }

        .site-footer .legal-nav ul {
            list-style-type: none;
            margin: 0;
            padding: 0;
            display: flex;
            flex-direction: row; /* side by side */
            justify-content: flex-end; /* right-align inside full width */
            gap: 1.5rem; /* space between links */
            width: 100%; /* make it span footer width */
        }

        .site-footer .legal-nav li {
            margin: 0;
            padding: 0;
        }

        .site-footer .legal-nav a {
            color: var(--ink);
            font-weight: 600;
            text-decoration: none;
            transition: color 0.2s ease;
        }

            .site-footer .legal-nav a:hover,
            .site-footer .legal-nav a:focus {
                color: var(--brand-2);
                outline: none;
            }

    /* ----- Copyright text ----- */
    .site-footer p {
        font-size: 0.85rem;
        color: var(--muted);
        margin: 0;
    }

/* ----- Responsive tweak ----- */
@media (max-width: 700px) {
    .site-footer .container {
        align-items: center; /* center on smaller screens */
        text-align: center;
    }

    .site-footer .legal-nav ul {
        align-items: center; /* center links */
    }
}

/* ----- Footer logo ----- */
footer {
    position: relative;
}

.site-footer .container {
    position: relative; /* allows absolute logo positioning inside */
    display: flex;
    flex-direction: column;
    align-items: flex-end; /* keep text and links right-aligned */
    text-align: right;
    padding-bottom: 0rem; /* space for logo */
}

/* Place logo bottom-left inside container */
.footer-logo {
    position: absolute;
    bottom: 0;
    left: 0;
}

    .footer-logo img {
        width: 130px; /* adjust to taste */
        height: auto;
        opacity: 0.9;
    }

/* Responsive: center everything on small screens */
@media (max-width: 700px) {
    .site-footer .container {
        align-items: center;
        text-align: center;
    }

    .footer-logo {
        position: static; /* make it flow under text */
        margin-top: 1rem;
    }
}

/* ----- Social Icons in Footer ----- */
.social-icons {
    display: flex;
    gap: 0.6rem;
    margin-top: 1rem;
    justify-content: flex-end; /* align right, adjust as needed */
}

    .social-icons a img {
        width: 26px;
        height: 26px;
        opacity: 0.85;
        transition: opacity 0.3s ease, transform 0.3s ease;
    }

    .social-icons a:hover img,
    .social-icons a:focus img {
        opacity: 1;
        transform: scale(1.1);
    }

/* ----- Bottom centered text ----- */
.bottom-text {
    text-align: center; /* centers inline content like text */
    padding: 1.5rem 0; /* optional: adds some breathing room */
}

    .bottom-text p {
        margin: 0 auto; /* removes default top/bottom spacing */
        max-width: 700px; /* optional: keeps text readable */
        color: var(--muted); /* optional: match your existing theme */
    }

/* ----- Footer disclaimer ----- */
.footer-disclaimer {
    text-align: center !important; /* override existing right-alignment */
    width: 100%;
    margin: 0 auto;
    max-width: 800px;
    display: block;
    color: var(--muted);
    padding: 1rem 0;
    font-size: 0.8rem; /* <— change this value */
}

/* Responsive: adjust font size on small screens */
@media (max-width: 600px) {
    .footer-disclaimer {
        font-size: 0.85rem;
    }
}