.footer {
    background-color: var(--bg-secondary);
    border-top: var(--border-width) solid var(--border-color);
    padding: var(--spacing-md) 0;
    margin-top: var(--spacing-xl);
}

.footer-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--spacing-md);
    max-width: 100%; /* 1400px; */
    margin: 0 auto;
    padding: 0 4px;
}

.footer-logo {
    font-family: var(--font-heading);
    font-size: var(--font-size-h2);
    color: var(--text-primary);
    text-decoration: none;
}

.footer-logo span {
    color: var(--primary-color);
}

.social-links {
    display: flex;
    gap: var(--spacing-md);
}

.social-link {
    color: var(--text-secondary);
    transition: color var(--transition-fast);
}

.social-link:hover {
    color: var(--primary-color);
}

.social-icon {
    font-size: var(--font-size-h3);
}

.footer-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--spacing-lg);
    padding: 0 var(--spacing-md);
}

.footer-text {
    color: var(--text-secondary);
    text-align: center;
    margin: 0;
}

.theme-toggle-wrapper {
    position: relative;
    display: inline-block;
    width: 32px;
    height: 16px;
    margin-top: var(--spacing-sm);
}

.theme-toggle-input {
    opacity: 0;
    width: 0;
    height: 0;
}

.footer-links {
    display: flex;
    flex-direction: row;
    gap: var(--spacing-md);
}

.footer-links a {
    color: var(--primary-color);
    font-weight: bold;
    font-size: var(--font-size-h5);
    transition: color var(--transition-fast);
}

.footer-links a:hover {
    color: var(--primary-hover);
}

.mini-menu {
    width: 100%;
    display: none;
}

/* Medium screens (Tablets: 992px and below) */
@media (width <= 992px) {
    /* .footer-container {
        display: none;
    } */

    .mini-menu {
        width: 100%;
        height: 10vh;
        background-color: var(--bg-secondary);
        border-top: var(--border-width) solid var(--border-color);
        padding: var(--spacing-md) 0;
        margin-top: auto;
        display: flex;
        flex-direction: row;
        justify-content: center;
        position: fixed;
        bottom: 0;
        left: 0;
        z-index: 1000;
    }

}

/* Small screens (Mobile: 768px and below) */
@media (width <= 768px) {
    /* .footer-container {
        display: none;
    } */

    .mini-menu {
        width: 100%;
        height: 10vh;
        background-color: var(--bg-secondary);
        border-top: var(--border-width) solid var(--border-color);
        padding: var(--spacing-md) 0;
        margin-top: auto;
        display: flex;
        flex-direction: row;
        justify-content: center;
        position: fixed;
        bottom: 0;
        left: 0;
        z-index: 1000;
    }

}

/* Extra-small screens (Phones: 480px and below) */
@media (width <= 480px) {
    /* .footer-container {
        display: none;
    } */

    .mini-menu {
        width: 100%;
        height: 5vh;
        background-color: var(--bg-secondary);
        border-top: var(--border-width) solid var(--border-color);
        padding: var(--spacing-md) 0;
        margin-top: auto;
        display: flex;
        flex-direction: row;
        justify-content: center;
        position: fixed;
        bottom: 0;
        left: 0;
        z-index: 1000;
    }

}