/* 产品详情页面手机端样式 - 只针对768px以下设备 */
@media (max-width: 768px) {
    /* 详情页面主容器 */
    .detail-page .detail_main .container {
        flex-direction: column;
        padding: 0 1.5rem;
    }

    /* 产品详情头部 */
    .detail-page .product_header {
        flex-direction: column;
        gap: 2rem;
        margin-bottom: 3rem;
    }

    /* 产品图片区域 */
    .detail-page .product_gallery {
        width: 100%;
        order: 1;
    }

    .detail-page .main_image {
        width: 100%;
        height: 30rem;
        background: #f8f9fa;
        border-radius: 1rem;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 1.5rem;
        overflow: hidden;
    }

    .detail-page .main_image img {
        max-width: 100%;
        max-height: 100%;
        object-fit: contain;
    }

    /* 缩略图 */
    .detail-page .thumbnail_list {
        display: flex;
        gap: 1rem;
        overflow-x: auto;
        padding-bottom: 1rem;
    }

    .detail-page .thumbnail_item {
        flex: 0 0 8rem;
        height: 8rem;
        background: #f8f9fa;
        border-radius: 0.8rem;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        transition: all 0.3s ease;
        border: 0.2rem solid transparent;
    }

    .detail-page .thumbnail_item:hover,
    .detail-page .thumbnail_item.active {
        border-color: #036FBE;
    }

    .detail-page .thumbnail_item img {
        max-width: 100%;
        max-height: 100%;
        object-fit: contain;
    }

    /* 产品信息区域 */
    .detail-page .product_info {
        width: 100%;
        order: 2;
    }

    .detail-page .product_title {
        font-size: 2.4rem;
        font-weight: 700;
        color: #333;
        margin-bottom: 1.5rem;
        line-height: 1.3;
    }

    .detail-page .product_subtitle {
        font-size: 1.6rem;
        color: #666;
        margin-bottom: 2rem;
        line-height: 1.4;
    }

    /* 产品参数表格 */
    .detail-page .product_specs_table {
        width: 100%;
        border-collapse: collapse;
        margin-bottom: 2rem;
        background: white;
        border-radius: 1rem;
        overflow: hidden;
        box-shadow: 0 0.2rem 1rem rgba(0, 0, 0, 0.08);
    }

    .detail-page .product_specs_table th,
    .detail-page .product_specs_table td {
        padding: 1.2rem;
        text-align: left;
        border-bottom: 0.1rem solid #f0f0f0;
        font-size: 1.4rem;
    }

    .detail-page .product_specs_table th {
        background: #f8f9fa;
        font-weight: 600;
        color: #333;
        width: 35%;
    }

    .detail-page .product_specs_table td {
        color: #666;
    }

    .detail-page .product_specs_table tr:last-child th,
    .detail-page .product_specs_table tr:last-child td {
        border-bottom: none;
    }

    /* 产品标签 */
    .detail-page .product_tags {
        display: flex;
        flex-wrap: wrap;
        gap: 0.8rem;
        margin-bottom: 2rem;
    }

    .detail-page .tag_item {
        background: #e3f2fd;
        color: #1976d2;
        padding: 0.6rem 1.2rem;
        border-radius: 0.5rem;
        font-size: 1.3rem;
        font-weight: 500;
    }

    /* 操作按钮 */
    .detail-page .product_actions {
        display: flex;
        flex-direction: column;
        gap: 1rem;
        margin-bottom: 3rem;
    }

    .detail-page .action_btn {
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 1.4rem 2rem;
        border-radius: 0.8rem;
        text-decoration: none;
        font-size: 1.6rem;
        font-weight: 600;
        transition: all 0.3s ease;
        gap: 0.8rem;
    }

    .detail-page .btn_primary {
        background: #036FBE;
        color: white;
    }

    .detail-page .btn_primary:hover {
        background: #025a9e;
        color: white;
    }

    .detail-page .btn_secondary {
        background: white;
        color: #036FBE;
        border: 0.2rem solid #036FBE;
    }

    .detail-page .btn_secondary:hover {
        background: #036FBE;
        color: white;
    }

    /* 产品描述 */
    .detail-page .product_description {
        background: white;
        border-radius: 1rem;
        padding: 2rem;
        margin-bottom: 3rem;
        box-shadow: 0 0.2rem 1rem rgba(0, 0, 0, 0.08);
    }

    .detail-page .description_title {
        font-size: 2rem;
        font-weight: 600;
        color: #333;
        margin-bottom: 1.5rem;
        padding-bottom: 1rem;
        border-bottom: 0.2rem solid #f0f0f0;
    }

    .detail-page .description_content {
        color: #666;
        font-size: 1.5rem;
        line-height: 1.6;
    }

    .detail-page .description_content p {
        margin-bottom: 1.5rem;
    }

    .detail-page .description_content ul,
    .detail-page .description_content ol {
        margin-bottom: 1.5rem;
        padding-left: 2rem;
    }

    .detail-page .description_content li {
        margin-bottom: 0.8rem;
    }

    /* 相关产品 */
    .detail-page .related_products {
        margin-top: 4rem;
    }

    .detail-page .related_title {
        font-size: 2.4rem;
        font-weight: 600;
        color: #333;
        margin-bottom: 2rem;
        text-align: center;
    }

    .detail-page .related_grid {
        display: grid;
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .detail-page .related_item {
        background: white;
        border-radius: 1rem;
        overflow: hidden;
        box-shadow: 0 0.2rem 1rem rgba(0, 0, 0, 0.08);
        transition: transform 0.3s ease, box-shadow 0.3s ease;
    }

    .detail-page .related_item:hover {
        transform: translateY(-0.2rem);
        box-shadow: 0 0.4rem 2rem rgba(0, 0, 0, 0.12);
    }

    .detail-page .related_image {
        height: 18rem;
        background: #f8f9fa;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 1.5rem;
    }

    .detail-page .related_image img {
        max-width: 100%;
        max-height: 100%;
        object-fit: contain;
    }

    .detail-page .related_info {
        padding: 1.5rem;
    }

    .detail-page .related_title_text {
        font-size: 1.6rem;
        font-weight: 600;
        color: #333;
        margin-bottom: 0.8rem;
        line-height: 1.4;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .detail-page .related_desc {
        color: #666;
        font-size: 1.4rem;
        line-height: 1.5;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    /* 面包屑导航 */
    .detail-page .site_breadcrumb {
        padding: 1.5rem 0;
        background: #f8f9fa;
    }

    .detail-page .breadcrumb_nav {
        display: flex;
        align-items: center;
        gap: 0.8rem;
        font-size: 1.3rem;
        flex-wrap: wrap;
    }

    .detail-page .breadcrumb_nav a {
        color: #666;
        text-decoration: none;
    }

    .detail-page .breadcrumb_nav a:hover {
        color: #036FBE;
    }

    .detail-page .breadcrumb_nav span {
        color: #999;
    }

    /* 返回按钮 */
    .detail-page .back_btn {
        display: inline-flex;
        align-items: center;
        gap: 0.8rem;
        padding: 1rem 2rem;
        background: #f8f9fa;
        color: #666;
        text-decoration: none;
        border-radius: 0.8rem;
        font-size: 1.4rem;
        margin-bottom: 2rem;
        transition: all 0.3s ease;
    }

    .detail-page .back_btn:hover {
        background: #036FBE;
        color: white;
    }

    /* 分享按钮 */
    .detail-page .share_buttons {
        display: flex;
        gap: 1rem;
        margin-top: 2rem;
        flex-wrap: wrap;
    }

    .detail-page .share_btn {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 4.5rem;
        height: 4.5rem;
        border-radius: 50%;
        text-decoration: none;
        font-size: 1.8rem;
        transition: all 0.3s ease;
    }

    .detail-page .share_btn.facebook {
        background: #1877f2;
        color: white;
    }

    .detail-page .share_btn.twitter {
        background: #1da1f2;
        color: white;
    }

    .detail-page .share_btn.linkedin {
        background: #0077b5;
        color: white;
    }

    .detail-page .share_btn.email {
        background: #666;
        color: white;
    }

    .detail-page .share_btn:hover {
        transform: scale(1.1);
    }
}
