/**
 * Footer Styles - 3-Row Layout (优化左侧区域)
 * 
 * @package Milestrong
 * @since 2.0.0
 */

/* ========================================
   Footer Main Container
   ======================================== */

.milestrong-footer {
    background-color: #0a1628;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    color: #ffffff;
    padding: 80px 0 60px;
    position: relative;
    overflow: visible; /* 修复：改为 visible，防止PAD端内容被裁切 */
    /* 底部空白修复：确保自身不产生额外外边距 */
    margin-bottom: 0;
}

.milestrong-footer::before {
    display: none;
}

.milestrong-footer-container {
    max-width: 1200px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
}

/* ========================================
   Row Layout - 每行左右分栏
   ======================================== */

.milestrong-footer-row {
    display: grid;
    grid-template-columns: 380px 1fr;
    gap: 80px;
    margin-bottom: 40px;
}

.milestrong-footer-row:last-of-type {
    margin-bottom: 0;
}

.milestrong-footer-row-left {
    display: flex;
    flex-direction: column;
    gap: 20px;
    align-items: center;
}

.milestrong-footer-row-right {
    display: flex;
    align-items: flex-start;
    justify-content: flex-end;
}

/* ========================================
   Logo & Newsletter - 优化设计
   ======================================== */

.milestrong-footer-logo {
    margin-bottom: 0;
    text-align: center;
    width: 100%;
}

.milestrong-footer-logo img {
    max-width: 280px;
    height: auto;
    display: block;
    margin: 0 auto;
}

.milestrong-footer-newsletter {
    margin-bottom: 0;
    width: 100%;
    text-align: center;
}

.newsletter-title {
    font-weight: 600;
    color: #ffffff;
    margin: 0 0 16px 0;
    line-height: 1.4;
    font-size: 1.5rem;
}

.newsletter-form {
    margin: 0;
    display: flex;
    justify-content: center;
}

.newsletter-input-group {
    display: flex;
    gap: 0;
    background: rgba(255, 255, 255, 0.08);
    border-radius: 25px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.12);
    transition: all 0.3s ease;
    width: 100%;
    max-width: 380px;
}

.newsletter-input-group:focus-within {
    background: rgba(255, 255, 255, 0.12);
    border-color: #017FFF;
    box-shadow: 0 0 0 2px rgba(1, 127, 255, 0.1);
}

.newsletter-input-group input[type="email"] {
    flex: 1;
    padding: 12px 20px;
    background: transparent;
    border: none;
    color: #ffffff;
    font-size: 13px;
    outline: none;
}

.newsletter-input-group input[type="email"]::placeholder {
    color: rgba(255, 255, 255, 0.45);
}

.newsletter-submit {
    padding: 12px 28px;
    background: #017FFF;
    color: #ffffff;
    border: none;
    border-radius: 25px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    white-space: nowrap;
}

.newsletter-submit:hover {
    background: #0066CC;
}

/* ========================================
   Quick Links
   ======================================== */

.milestrong-footer-links-row {
    display: grid;
    grid-template-columns: 218px 202px 110px;
    gap: 0;
    width: 530px;
}

.footer-links-column:nth-child(1) {
    justify-self: start;
}

.footer-links-column:nth-child(2) {
    justify-self: start;
}

.footer-links-column:nth-child(3) {
    justify-self: end;
}

.footer-links-column {
    display: flex;
    flex-direction: column;
}

.links-title {
    font-weight: 700;
    color: #ffffff;
    margin: 0 0 14px 0;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    transition: color 0.3s ease;
}

.footer-links-column:hover .links-title {
    color: #017FFF;
}

.links-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.links-list li {
    margin: 0;
    padding: 0;
}

.links-list a {
    color: rgba(255, 255, 255, 0.7);
    text-decoration: none;
    font-size: 11px;
    line-height: 1.5;
    transition: all 0.3s ease;
    display: inline-block;
    position: relative;
    padding-bottom: 2px;
}

.links-list a::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 1px;
    background: #017FFF;
    transition: width 0.3s ease;
}

.links-list a:hover {
    color: #017FFF;
}

.links-list a:hover::after {
    width: 100%;
}

/* ========================================
   Company Info
   ======================================== */

.company-info-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    color: rgba(255, 255, 255, 0.75);
    font-size: 11px;
    line-height: 1.5;
}

.company-email-phone-row {
    display: flex;
    gap: 126px;
    flex-wrap: wrap;
}

.company-email-phone-row .company-info-item {
    flex: 0 1 auto;
}

.info-icon {
    flex-shrink: 0;
    width: 14px;
    height: 14px;
    margin-top: 2px;
    color: #0ea5e9;
}

.info-icon svg {
    width: 100%;
    height: 100%;
    display: block;
}

.info-text {
    flex: 1;
    color: rgba(255, 255, 255, 0.75);
    text-decoration: none;
    transition: color 0.3s ease;
}

.info-text:hover {
    color: #017FFF;
}

/* ========================================
   Social Icons
   ======================================== */

.milestrong-footer-social {
    width: 420px;
    display: flex;
    justify-content: flex-end;
    padding-right: 15px;
}



/* ========================================
   Copyright
   ======================================== */

.milestrong-footer-bottom {
    margin-top: 45px;
    padding-top: 28px;
    border-top: 2px solid rgba(255, 255, 255, 0.15);
}

.milestrong-footer-copyright {
    text-align: center;
}

.copyright-text {
    color: rgba(255, 255, 255, 0.5);
    font-size: 11px;
    line-height: 1.5;
    margin: 0;
}

/* ========================================
   Responsive Design
   ======================================== */

@media screen and (max-width: 1024px) {
    .milestrong-footer {
        padding: 70px 0 50px;
        overflow: visible; /* 确保不截断内容 */
    }
    
    .milestrong-footer-row {
        grid-template-columns: 340px 1fr;
        gap: 60px;
        margin-bottom: 35px;
    }
    
    .milestrong-footer-logo img {
        max-width: 240px;
    }
    
    .newsletter-input-group {
        max-width: 340px;
    }
    
    .milestrong-footer-links-row {
        grid-template-columns: 158px 122px 100px;
        width: 380px;
    }
    
    .milestrong-footer-social {
        width: 380px;
    }
}

@media screen and (max-width: 768px) {
    .milestrong-footer {
        padding: 50px 0 40px;
    }
    
    .milestrong-footer-row {
        grid-template-columns: 1fr;
        gap: 30px;
        margin-bottom: 25px;
        padding: 0px 40px;
    }
    
    .milestrong-footer-row-left {
        gap: 15px;
        align-items: center; /* 改为居中，这样默认就是居中的 */
    }
    
    .milestrong-footer-row-right {
        justify-content: flex-start;
    }
    
    .milestrong-footer-logo {
        text-align: left;
    }
    
    .milestrong-footer-logo img {
        max-width: 200px;
        margin: 0;
    }
    
    .milestrong-footer-newsletter {
        text-align: left;
    }
    
    .newsletter-form {
        justify-content: flex-start;
    }
    
    .newsletter-input-group {
        max-width: 100%;
    }
    
    .milestrong-footer-links-row {
        width: 100%;
        grid-template-columns: repeat(3, 1fr);
        gap: 25px 20px;
    }
    
    .footer-links-column:nth-child(1),
    .footer-links-column:nth-child(2),
    .footer-links-column:nth-child(3) {
        justify-self: start;
    }
    
    .milestrong-footer-social {
        width: 100%;
        justify-content: flex-start;
    }
    
    .social-icons {
        justify-content: flex-start;
        gap: 14px;
    }
    
    .links-title {
        margin-bottom: 12px;
    }
    
    .links-list {
        gap: 7px;
    }
    
    .links-list a {
        font-size: 12px;
    }
    
    .milestrong-footer-bottom {
        margin-top: 35px;
        padding-top: 22px;
    }
    
    .social-icon {
        width: 34px;
        height: 34px;
    }
    
    .social-icon svg {
        width: 17px;
        height: 17px;
    }
}

@media screen and (max-width: 480px) {
    .milestrong-footer {
        padding: 40px 0 30px;
    }
    
    .milestrong-footer-container {
        padding: 40px 20px;
    }
    
    .milestrong-footer-row {
        margin-bottom: 20px;
    }
    
    .milestrong-footer-links-row {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .company-info-item {
        font-size: 11px;
    }
    
    .company-email-phone-row {
        flex-direction: column;
        gap: 10px;
    }
}
/* ========================================
   Mobile Alignment Styles
   ======================================== */

/* 移动端对齐 - 仅在768px以下生效 */
@media screen and (max-width: 768px) {
    /* Logo 对齐 */
    .milestrong-footer .milestrong-footer-logo.mobile-align-left {
        text-align: left;
    }
    
    .milestrong-footer .milestrong-footer-logo.mobile-align-left img {
        margin: 0;
    }
    
    .milestrong-footer .milestrong-footer-logo.mobile-align-center {
        text-align: center;
    }
    
    .milestrong-footer .milestrong-footer-logo.mobile-align-center img {
        margin: 0 auto;
    }
    
    .milestrong-footer .milestrong-footer-logo.mobile-align-right {
        text-align: right;
    }
    
    .milestrong-footer .milestrong-footer-logo.mobile-align-right img {
        margin: 0 0 0 auto;
    }
    
    /* Newsletter 对齐 */
    .milestrong-footer .milestrong-footer-newsletter.mobile-align-left {
        text-align: left;
    }
    
    .milestrong-footer .milestrong-footer-newsletter.mobile-align-left .newsletter-form {
        justify-content: flex-start;
    }
    
    .milestrong-footer .milestrong-footer-newsletter.mobile-align-center {
        text-align: center;
    }
    
    .milestrong-footer .milestrong-footer-newsletter.mobile-align-center .newsletter-form {
        justify-content: center;
    }
    
    .milestrong-footer .milestrong-footer-newsletter.mobile-align-right {
        text-align: right;
    }
    
    .milestrong-footer .milestrong-footer-newsletter.mobile-align-right .newsletter-form {
        justify-content: flex-end;
    }
    
    /* Company Info 对齐 */
    .milestrong-footer .company-info-wrapper.mobile-align-left {
        text-align: left;
    }
    
    .milestrong-footer .company-info-wrapper.mobile-align-left .company-info-item {
        justify-content: flex-start;
    }
    
    .milestrong-footer .company-info-wrapper.mobile-align-left .company-email-phone-row {
        justify-content: flex-start;
    }
    
    .milestrong-footer .company-info-wrapper.mobile-align-center {
        text-align: center;
    }
    
    .milestrong-footer .company-info-wrapper.mobile-align-center .company-info-item {
        justify-content: center;
    }
    
    .milestrong-footer .company-info-wrapper.mobile-align-center .company-email-phone-row {
        justify-content: center;
    }
    
    .milestrong-footer .company-info-wrapper.mobile-align-right {
        text-align: right;
    }
    
    .milestrong-footer .company-info-wrapper.mobile-align-right .company-info-item {
        justify-content: flex-end;
    }
    
    .milestrong-footer .company-info-wrapper.mobile-align-right .company-email-phone-row {
        justify-content: flex-end;
    }
    
    /* Quick Links 对齐 */
    .milestrong-footer .milestrong-footer-links-row.mobile-align-left {
        text-align: left;
    }
    
    .milestrong-footer .milestrong-footer-links-row.mobile-align-left .footer-links-column {
        align-items: flex-start;
    }
    
    .milestrong-footer .milestrong-footer-links-row.mobile-align-center {
        text-align: center;
    }
    
    .milestrong-footer .milestrong-footer-links-row.mobile-align-center .footer-links-column {
        align-items: center;
    }
    
    .milestrong-footer .milestrong-footer-links-row.mobile-align-right {
        text-align: right;
    }
    
    .milestrong-footer .milestrong-footer-links-row.mobile-align-right .footer-links-column {
        align-items: flex-end;
    }
    
    /* Social Media 对齐 */
    .milestrong-footer .milestrong-footer-social.mobile-align-left {
        justify-content: flex-start;
    }
    
    .milestrong-footer .milestrong-footer-social.mobile-align-left .social-icons {
        justify-content: flex-start;
    }
    
    .milestrong-footer .milestrong-footer-social.mobile-align-center {
        justify-content: center;
    }
    
    .milestrong-footer .milestrong-footer-social.mobile-align-center .social-icons {
        justify-content: center;
    }
    
    .milestrong-footer .milestrong-footer-social.mobile-align-right {
        justify-content: flex-end;
    }
    
    .milestrong-footer .milestrong-footer-social.mobile-align-right .social-icons {
        justify-content: flex-end;
    }
    
    /* Copyright 对齐 */
    .milestrong-footer .milestrong-footer-copyright.mobile-align-left {
        text-align: left;
    }
    
    .milestrong-footer .milestrong-footer-copyright.mobile-align-center {
        text-align: center;
    }
    
    .milestrong-footer .milestrong-footer-copyright.mobile-align-right {
        text-align: right;
    }
}
/* ========================================
   Tablet Responsive Styles (769px - 1024px)
   ======================================== */

@media screen and (min-width: 769px) and (max-width: 1024px) {
    /* 平板端基础布局调整 */
    .milestrong-footer {
        padding: 60px 0 50px;
        overflow: visible; /* 防止内容被裁切 */
    }

    .milestrong-footer-container {
        padding: 0 24px 400px 24px; /* 稍微增加内边距避免贴边 */
        box-sizing: border-box;
        width: 100%;
        max-width: 100%;
    }

    .milestrong-footer-row {
        grid-template-columns: 280px 1fr; /* 左列缩窄，右列自适应 */
        gap: 40px;
        margin-bottom: 30px;
        width: 100%;
        box-sizing: border-box;
    }

    .milestrong-footer-row-left {
        min-width: 0;
        overflow: visible;
    }

    .milestrong-footer-row-right {
        min-width: 0; /* 关键：允许右列收缩，不撑破布局 */
        overflow: visible;
        justify-content: flex-start; /* 修复：改为左对齐，防止内容被推到视口外 */
    }

    /* Logo 尺寸调整 */
    .milestrong-footer-logo img {
        max-width: 200px;
    }

    /* Newsletter 输入框调整 */
    .newsletter-input-group {
        max-width: 280px;
    }

    /* 快速链接布局 — 修复溢出核心问题 */
    .milestrong-footer-links-row {
        display: grid;
        grid-template-columns: repeat(3, 1fr); /* 等分三列，随容器自适应 */
        gap: 20px;          /* 从90px缩小为20px，防止溢出 */
        width: 100%;         /* 占满右列全部宽度 */
        box-sizing: border-box;
        white-space: normal; /* 取消 nowrap，允许正常换行 */
    }

    .footer-links-column {
        min-width: 0; /* 防止内容撑破网格 */
        overflow: hidden;
    }

    .footer-links-column:nth-child(1),
    .footer-links-column:nth-child(2),
    .footer-links-column:nth-child(3) {
        justify-self: start;
    }

    /* 最后一列不强制右对齐，保持一致 */
    .footer-links-column:last-child {
        justify-self: start;
    }

    .links-title {
        font-size: 13px;
        margin-bottom: 12px;
        white-space: nowrap; /* 标题本身保持不换行 */
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .links-list a {
        font-size: 11px;
    }

    /* 公司信息 - 电话和邮箱在PAD端允许换行，避免溢出 */
    .company-email-phone-row {
        display: flex;
        flex-direction: row;
        gap: 20px;
        flex-wrap: wrap; /* PAD端允许换行，防止溢出 */
        align-items: flex-start;
    }

    .company-email-phone-row .company-info-item {
        flex: 0 1 auto;
        min-width: 0;
    }

    .company-info-item {
        font-size: 11px;
    }

    .info-text {
        font-size: 11px;
        word-break: break-all; /* 长邮箱/电话强制折行，不溢出 */
    }

    /* 社交图标 - 修复右对齐导致溢出的问题 */
    .milestrong-footer-social {
        width: 100%;
        justify-content: flex-start; /* 改为左对齐，与链接列对齐 */
        padding-right: 0;
    }

    .social-icons {
        gap: 16px;
    }

    .social-icon {
        width: 36px;
        height: 36px;
    }

    .social-icon svg {
        width: 18px;
        height: 18px;
    }

    /* Tablet Hide Classes */
    .tablet-hide {
        display: none !important;
    }

    /* Tablet Alignment - Logo */
    .milestrong-footer .milestrong-footer-logo.tablet-align-left {
        text-align: left;
    }

    .milestrong-footer .milestrong-footer-logo.tablet-align-left img {
        margin: 0;
    }

    .milestrong-footer .milestrong-footer-logo.tablet-align-center {
        text-align: center;
    }

    .milestrong-footer .milestrong-footer-logo.tablet-align-center img {
        margin: 0 auto;
    }

    .milestrong-footer .milestrong-footer-logo.tablet-align-right {
        text-align: right;
    }

    .milestrong-footer .milestrong-footer-logo.tablet-align-right img {
        margin: 0 0 0 auto;
    }

    /* Tablet Alignment - Newsletter */
    .milestrong-footer .milestrong-footer-newsletter.tablet-align-left {
        text-align: left;
    }

    .milestrong-footer .milestrong-footer-newsletter.tablet-align-left .newsletter-form {
        justify-content: flex-start;
    }

    .milestrong-footer .milestrong-footer-newsletter.tablet-align-center {
        text-align: center;
    }

    .milestrong-footer .milestrong-footer-newsletter.tablet-align-center .newsletter-form {
        justify-content: center;
    }

    .milestrong-footer .milestrong-footer-newsletter.tablet-align-right {
        text-align: right;
    }

    .milestrong-footer .milestrong-footer-newsletter.tablet-align-right .newsletter-form {
        justify-content: flex-end;
    }

    /* Tablet Alignment - Company Info */
    .milestrong-footer .company-info-wrapper.tablet-align-left {
        text-align: left;
    }

    .milestrong-footer .company-info-wrapper.tablet-align-left .company-info-item {
        justify-content: flex-start;
    }

    .milestrong-footer .company-info-wrapper.tablet-align-left .company-email-phone-row {
        justify-content: flex-start;
    }

    .milestrong-footer .company-info-wrapper.tablet-align-center {
        text-align: center;
    }

    .milestrong-footer .company-info-wrapper.tablet-align-center .company-info-item {
        justify-content: center;
    }

    .milestrong-footer .company-info-wrapper.tablet-align-center .company-email-phone-row {
        justify-content: center;
    }

    .milestrong-footer .company-info-wrapper.tablet-align-right {
        text-align: right;
    }

    .milestrong-footer .company-info-wrapper.tablet-align-right .company-info-item {
        justify-content: flex-end;
    }

    .milestrong-footer .company-info-wrapper.tablet-align-right .company-email-phone-row {
        justify-content: flex-end;
    }

    /* Tablet Alignment - Quick Links */
    .milestrong-footer .milestrong-footer-links-row.tablet-align-left {
        text-align: left;
    }

    .milestrong-footer .milestrong-footer-links-row.tablet-align-left .footer-links-column {
        align-items: flex-start;
    }

    .milestrong-footer .milestrong-footer-links-row.tablet-align-center {
        text-align: center;
    }

    .milestrong-footer .milestrong-footer-links-row.tablet-align-center .footer-links-column {
        align-items: center;
    }

    .milestrong-footer .milestrong-footer-links-row.tablet-align-right {
        text-align: right;
    }

    .milestrong-footer .milestrong-footer-links-row.tablet-align-right .footer-links-column {
        align-items: flex-end;
    }

    /* Tablet Alignment - Social Media */
    .milestrong-footer .milestrong-footer-social.tablet-align-left {
        justify-content: flex-start;
    }

    .milestrong-footer .milestrong-footer-social.tablet-align-left .social-icons {
        justify-content: flex-start;
    }

    .milestrong-footer .milestrong-footer-social.tablet-align-center {
        justify-content: center;
    }

    .milestrong-footer .milestrong-footer-social.tablet-align-center .social-icons {
        justify-content: center;
    }

    .milestrong-footer .milestrong-footer-social.tablet-align-right {
        justify-content: flex-end;
    }

    .milestrong-footer .milestrong-footer-social.tablet-align-right .social-icons {
        justify-content: flex-end;
    }

    /* Tablet Alignment - Copyright */
    .milestrong-footer .milestrong-footer-copyright.tablet-align-left {
        text-align: left;
    }

    .milestrong-footer .milestrong-footer-copyright.tablet-align-center {
        text-align: center;
    }

    .milestrong-footer .milestrong-footer-copyright.tablet-align-right {
        text-align: right;
    }
}
/* ========================================
   社交媒体图标 - 整张Sprite图片显示（缩小版）
   ======================================== */

/* 社交图标容器 */
.social-icons-sprite {
    position: relative;
    display: inline-block;
}

/* 显示整张sprite图片 - 缩小尺寸 */
.social-icons-sprite .sprite-image {
    display: block;
    height: 35px; /* 缩小到35px高度 */
    width: auto;
}

/* 透明链接覆盖层 */
.social-link {
    position: absolute;
    top: 0;
    height: 100%;
    cursor: pointer;
}

/* 各个社交图标的位置 - 按35px高度等比例调整 */
.social-link-facebook {
    left: 0;
    width: 35px;
}

.social-link-twitter {
    left: 60px;
    width: 35px;
}

.social-link-instagram {
    left: 120px;
    width: 35px;
}

.social-link-linkedin {
    left: 185px;
    width: 35px;
}

.social-link-youtube {
    left: 245px;
    width: 80px; /* YouTube图标约2倍宽 */
}

.social-link-tiktok {
    left: 350px;
    width: 35px;
}

/* 移动端响应式 */
@media (max-width: 768px) {
    .social-icons-sprite .sprite-image {
        height: 28px;
    }
    
    .social-link-facebook {
        width: 28px;
    }
    
    .social-link-twitter {
        left: 48px;
        width: 28px;
    }
    
    .social-link-instagram {
        left: 94px;
        width: 28px;
    }
    
    .social-link-linkedin {
        left: 147px;
        width: 28px;
    }
    
    .social-link-youtube {
        left: 194px;
        width: 64px;
    }
    
    .social-link-tiktok {
        left: 278px;
        width: 28px;
    }
}

/* 平板端响应式 */
@media (min-width: 769px) and (max-width: 1024px) {
    .social-icons-sprite .sprite-image {
        height: 32px;
    }
    
    .social-link-facebook {
        width: 32px;
    }
    
    .social-link-twitter {
        left: 56px;
        width: 32px;
    }
    
    .social-link-instagram {
        left: 110px;
        width: 32px;
    }
    
    .social-link-linkedin {
        left: 168px;
        width: 32px;
    }
    
    .social-link-youtube {
        left: 222px;
        width: 75px;
    }
    
    .social-link-tiktok {
        left: 322px;
        width: 32px;
    }
}

/* ========================================
   底部空白修复
   消除 footer 下方 #page、body、html 产生的多余空白
   ======================================== */

/* footer 自身紧贴底部，无外边距 */
#colophon.milestrong-footer {
    margin-bottom: 0;
    padding-bottom: 60px; /* 保留内部底部留白，视觉上舒适 */
}

/* #page 包裹层不产生额外底部空间 */
#page {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

/* 防止 body/html 的默认 margin 叠加 */
body {
    margin-bottom: 0;
}

/* 管理员工具栏不影响底部空白 */
body.admin-bar #colophon.milestrong-footer {
    margin-bottom: 0;
}

/* PAD端底部空白修复 */
@media screen and (min-width: 769px) and (max-width: 1024px) {
    #colophon.milestrong-footer {
                padding-bottom: 90px;
        margin-bottom: 50px !important;
    }

    #page {
        padding-bottom: 0 !important;
        margin-bottom: 0 !important;
    }
}

/* 手机端底部空白修复 */
@media screen and (max-width: 768px) {
    #colophon.milestrong-footer {
        padding-bottom: 40px;
        margin-bottom: 0;
    }

    #page {
        padding-bottom: 0 !important;
        margin-bottom: 0 !important;
    }
}
