/*产品页面css开始*/
.product-body{
    margin-top: 20px;
    display: flex;

}
/*右边*/
.product-body-right {
    width: 40%;
}

.product-preview {
    width: 90%;
    margin: auto;
}

.product-preview img {
    width: 300px;
    height: 300px;
    object-fit: contain;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}
/*nth-child(2)*/
.product-preview p {
    line-height: 10px;
    text-align: center;
    margin-top: 30px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 20px;
    color: #3a8fc7;
    font-weight: bold;
}


/* 图片模态框样式 */
.img_modal {
    display: none;
    position: fixed;
    z-index: 1;
    /* 让模态框在页面中居中 */
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-width: 500px;
    width: 90%; /* 防止在小屏幕下模态框过宽 */
    height: 500px;
    overflow: auto;
    background-color: white;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    border-radius: 3px;
}

.img_modal-content {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 300px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
#imgModal p{
    color: #3a8fc7;
    margin: auto;
    width: 80% !important;
    border-bottom: 1px solid #cac6c6;
    text-align: center;
}

.product-body-left{
    width: 60%;
}
.product-sku{
    margin-top: 7px;
    display: flex;
    justify-content: space-between;
    font-size: 20px;
    color: black;
}
.text-product{
    color: #3a8fc7;
    font-weight: bold;
}
.product-short-description{
    margin-top: 10px;
    font-size: 18px;
}

/*规格价格*/
.product-left-price{
    width: 95%;
    margin-top: 20px;

    /*background-color:#0dcaf0;*/
}
.product-left-price table{
    width: 100%;
    color: black;
    border-collapse: separate;
    border-spacing: 0;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    overflow: hidden;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);

}

.product-left-price th,
.product-left-price td {
    border: 1px solid #ddd;
    padding: 10px;
    text-align: center;
}
.product-left-price th {
    background-color: #E99122;
    color: white;
}
.product-left-price tr{
    background-color: #3a8fc7;
}
.product-left-price tr:nth-child(even) {
    background-color: #eff5f7;
}

.product-left-price td {
    color: black;
    font-weight: bold;
}

.buttom_div{
    margin-top: 30px;
    padding-left: 20px;
}
.contact_online{
    background-color:#E99122 ;
    width: 30%;
    height: 50px;
    color: white;
    font-size: 20px;
    font-weight: bold;
    border-radius: 2px;
}
.contact_online span{
    margin-left: 20px;
}








.product-info{
    margin-top:80px;
}

.product-info-title span{
    font-size: 25px;
    padding: 10px;
    /*background-color: #3a8fc7;*/
    color: black;
    font-weight: bold;
}
.product-introduce{
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    border-radius: 1%;
    padding:30px;
}
.product-introduce-title{
    font-size: 20px;
    color: #3a8fc7;
    margin-bottom: 10px;
    margin-top: 15px;
}
.details_info_tbl{
    /*margin: auto;*/
    width: 100%;
    font-size: 20px;
    color: #0a0a0a;
    line-height:30px ;
    /*border-collapse: separate;*/
    /*border-spacing: 0 20px;*/
    border: 1px solid #ece5e5;

}
.details_info_tbl th{
    width: 20%;
    padding: 10px;
    text-align: center;
    border: 1px solid #ece5e5;
    background-color:#eff5f7 ;
}
.details_info_tbl td{
    border: 1px solid #ece5e5;
    font-size: 18px;
    color: black !important;
    font-weight: 700;
    padding-left: 20px;
}
.details_info_th{
    font-size: 15px;
}



/*导航条css start*/

.container{
    padding: 10px;
}
.breadcrumb-link,.breadcrumb-link span{
    color: #3a8fc7 !important;
}
.breadcrumb-link:hover{
    color:#E99122 !important;
}
.breadcrumb_arrows{
    margin-left: 20px;
    font-weight: bold;
}
.breadcrumb-text{
    color: black !important;
}
/*导航条css end*/

/*分类css start*/
.horizontal-line{
    height: 2px;
    color: #3a8fc7;
}
.catalog_info{
    width: 90%;
    margin: auto;
    margin-top: 10px;
}
.catalog_name{
    color: #3a8fc7;
}
.catalog_description{
    margin-top: 30px;
    text-indent: 2em;
    font-size: 18px;
}
.catalog_relate{
    margin-top: 80px;
    color: #3a8fc7;
}

.catalog-table .row catalog-item{
    text-align: center;
    margin-top: 10px;
    font-size: 15px;
    font-weight: bold;
    height: 30px;
}
.catalog-table .row catalog-item:hover{
    /*color: #f5e70e;*/
    background-color: #f5e70e;
}
/*分类css end*/

/*分类 产品card  start*/
.pro_card {
    position: relative;
    padding-bottom: 10px;
    background: #eef0f2;
    padding-left:10%;
    padding-right:10%;
    border-radius: 5%;
    margin-top: 5px;
    margin-bottom: 15px;
}
.pro_card:hover {
    transform: rotate(360deg); /* 鼠标悬停时旋转 360 度 */
}
.pro_card > .products-thumb {
    /*background-color: #eef0f2;*/
    text-align: center;
    vertical-align: middle;
    margin-bottom: 12px;
    height: 210px;
}
.pro_card > .products-thumb a {
    width: 100%;
    height: 100%;
    display: inline-block;
    position: relative;
}
.pro_card > .products-thumb a img {
    display: inline-block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-width: 80%;
}
.pro_card > .products-id {
    overflow: hidden;
    line-height: 30px;
    margin: 0;
}

.pro_card > .products-id > a {
    display: inline-block;
    max-width: 100px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    font-size: 18px;
    font-weight: bold;
}
.pro_card > .products-id > span {
    font-weight: bold;
    font-size: 18px;
    float: right;
    font-weight: bold;
    color: #3a8fc7;
    max-width: 80px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
.pro_card a {
    color: #3E3A39;
    text-decoration: none;
}
.pro_card > h3.products-name a {
    display: inline-block;
    max-width: 100%;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    font-size: 14px;
}
.pro_card > .products-price {
    padding: 0;
    min-height: 1.6em;
    line-height: 20px;
    margin-bottom: 6px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    font-size: 14px!important;
    color: #E99122;
}
.link-container {
    width: 200px; /* 可根据需要调整容器宽度 */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* 查询页面*/
.search-box{
    width: 90%;
    margin: auto;
    padding-top: 35px;
    padding-bottom: 25px;
    /*margin-bottom: 10px;*/
    min-height: 100px;
}

.search-query{
    margin-top: 15px;
    display: inline-block;
    word-break: break-all;
    width: 100%;
}

.search-tips{
    margin-top: 10px;
}


.search-head-img,.search-product-img{
    width: 20%;
    text-align: center;
}
.search-head-info{
    width: 40%;
    text-align: center;
}
.search-head-price{
    width: 30%;
    text-align: center;
}

.search-product-card{
    /*background-color: #eef0f2;*/
    margin-top: 10px;
    border-radius: 1.5%;
    display: flex;
    font-size: 18px;
}
.search-product-img{
    /*background-color: #eef0f2;*/
    aspect-ratio: 1 / 1;
}
.search-product-info{
    width: 30%;
    padding: 10px;
}
.search-product-info ul{
    list-style: none;
    padding-left: 0;
    display: flex;
    flex-direction: column;
    height: 100%;
}
.search-product-info-item {
    line-height: 1.6;
    font-size: 15px;
    display: flex;
    margin-bottom: 8px;
}

.product-name-item a {
    flex: 1;
    min-width: 0;
}

.product-name-item a span {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.search-product-info-label {
    margin-right: 5px;
    font-weight: bold;
    color: #333;
}
.search-product-price{
    width: 50%;
    /*background-color:#0dcaf0;*/
}
.search-product-price table{
    width: 100%;
    color: black;
    border-collapse: collapse;
    font-family: Arial, sans-serif;
}


.search-product-price th,
.search-product-price td {
    border: 1px solid #ddd;
    padding: 10px;
    text-align: center;
}
.search-product-price th {
    background-color: #f2f2f2;
    color: #333;
}

.search-product-price tr:nth-child(even) {
    background-color: #f9f9f9;
}


.search-product-price td {
    color: #555;
}

.search-bottom{
    width: 100%;
    /*background-color: #0dcaf0;*/
}


.pagination{
    display: flex;
    justify-content: center;
}

.products-head-befor{
    display: flex;
    align-items: center;
    background-color:rgb(239,245,247) ;
    color: #3a8fc7;
    padding: 10px;
}
.products-head-befor h3{
    width: 25%;
    color: #3a8fc7;
}
.products-head-befor span{
    font-size: 20px;
    letter-spacing: 2px;
}

/* 分页与搜索结果通用样式 */
.search-bottom {
    width: 100%;
    text-align: center;
}
.search-bottom-navigation {
    display: inline-block;
}
nav ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
}
nav ul li {
    display: inline-block;
    margin: 0 5px;
}
nav ul li a {
    text-decoration: none;
    color: #333;
    padding: 5px 10px;
    border: 1px solid #ccc;
    border-radius: 3px;
}
nav ul li.active a,nav ul li a:hover{
    background-color: #3a8fc7;
    color: white;
}
nav ul li span {
    font-weight: 700;
    color: black;
}
nav ul li a span {
    display: block;
}
.search-tips, .search-result-tips {
    color: #666;
    margin-bottom: 10px;
}
.no-result {
    text-align: center;
    margin-top: 50px;
}
.no-result i {
    font-size: 64px;
    color: #ccc;
    margin-bottom: 20px;
}
.no-result h3 {
    color: #333;
    margin-bottom: 10px;
}
.no-result p {
    color: #666;
}