/* 商品评论系统样式 - SEO优化版 */

/* 评论简介 - 标题下方 */
.reviewShortCut {
    padding: 10px 0;
    margin: 10px 0;
    border-bottom: 1px solid #eee;
    font-size: 14px;
}

.star-rating {
    color: #FFB800;
    font-size: 16px;
    margin: 0 5px;
}

.review_cnt {
    color: #009688;
    text-decoration: none;
}

.review_cnt:hover {
    text-decoration: underline;
}

/* 评论统计区 */
.reviews-summary {
    display: flex;
    gap: 40px;
    padding: 20px;
    background: #f9f9f9;
    border-radius: 8px;
    margin-bottom: 20px;
}

.summary-score {
    text-align: center;
    min-width: 150px;
}

.score-number {
    font-size: 48px;
    font-weight: bold;
    color: #333;
}

.score-stars {
    color: #FFB800;
    font-size: 20px;
    margin: 10px 0;
}

.score-count {
    color: #666;
    font-size: 14px;
}

.summary-bars {
    flex: 1;
}

.bar-item {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
}

.bar-label {
    width: 60px;
    font-size: 13px;
    color: #666;
}

.bar-progress {
    flex: 1;
    height: 20px;
    background: #e0e0e0;
    border-radius: 10px;
    overflow: hidden;
}

.bar-fill {
    height: 100%;
    background: #FFB800;
    transition: width 0.3s;
}

.bar-count {
    width: 40px;
    text-align: right;
    font-size: 13px;
    color: #666;
}

/* 评论列表 */
.review-item {
    padding: 20px;
    border-bottom: 1px solid #eee;
}

.review-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
}

.review-user {
    font-weight: bold;
    color: #333;
}

.review-date {
    font-size: 12px;
    color: #999;
}

.review-rating {
    color: #FFB800;
    margin: 5px 0;
}

.review-content {
    line-height: 1.6;
    color: #333;
    margin: 10px 0;
}

.review-images {
    display: flex;
    gap: 10px;
    margin-top: 10px;
    flex-wrap: wrap;
}

.review-images img {
    width: 80px;
    height: 80px;
    object-fit: cover;
    border-radius: 4px;
    cursor: pointer;
    transition: transform 0.2s;
}

.review-images img:hover {
    transform: scale(1.05);
}

/* 加载更多按钮 */
#load-more-reviews {
    text-align: center;
    margin: 20px 0;
    display: none; /* 默认隐藏，由JS控制显示 */
}

#reviews-loading {
    text-align: center;
    padding: 20px;
    color: #999;
    display: none; /* 默认隐藏，加载时显示 */
}

#reviews-empty {
    text-align: center;
    padding: 40px;
    color: #999;
    display: none; /* 默认隐藏，无评论时显示 */
}

/* 响应式设计 */
@media (max-width: 768px) {
    .reviews-summary {
        flex-direction: column;
        gap: 20px;
    }
    
    .summary-score {
        min-width: auto;
    }
    
    .review-images img {
        width: 60px;
        height: 60px;
    }
}

/* ========== 商品详情页：仅样式增强，文案与结构仍为站点原有 ========== */



.goods-page-detail .goods-img {
    border-radius: 12px;
    overflow:      hidden;
    background:    #f5f5f5;
    border:        1px solid #eee;
}

.goods-page-detail .goods-img img {
    display: block;
}

.goods-page-title {
    font-size:      clamp(1.15rem, 2vw, 1.55rem);
    font-weight:    700;
    line-height:    1.4;
    color:          #111;
    letter-spacing: 0.02em;
    margin:         0 0 12px;
    padding-bottom: 10px;
    border-bottom:  1px solid #eee;
}

.reviewShortCut {
    border-radius: 10px;
    background:    rgba(255, 245, 230, 0.65);
    border:        1px solid rgba(255, 183, 77, 0.28);
    padding:       10px 14px;
    margin:        0 0 14px;
    font-size:     13px;
}

/* 価格：非 ul、各行ブロック独占（下に番号+人気の横並び） */
.goods-page-detail .goods-price-block {
    margin:  0;
    padding: 0;
}

.goods-page-detail .goods-price-block .goods-price-row {
    float:         none;
    width:         100%;
    margin:        0;
    padding-right: 0;
    box-sizing:    border-box;
    font-size:     14px;
    line-height:   1.65;
    color:         #010101;
}

.goods-page-detail .goods-price-block .goods-price-row + .goods-price-row {
    margin-top: 8px;
}

/* 価格数字の強調（沿用 dis-one） */
.goods-page-detail .discount .dis-one .price-t {
    font-size:   1.25em;
    font-weight: 800;
}

.goods-page-detail .discount .dis-one .price-o {
    font-size:   1.15em;
    font-weight: 700;
}

.goods-page-detail .discount .discount-ul2 .dis-th3 {
    font-size:     13px;
    color:         #444;
}

/* 商品番号 + 人気（1 行・下に点線） */
.goods-page-detail .goods-meta-strip {
    display:         flex;
    flex-wrap:       wrap;
    align-items:     baseline;
    justify-content: space-between;
    gap:             12px 24px;
    margin-top:      16px;
    padding-bottom:  12px;
    border-bottom:   1px dotted #c5c5c5;
    font-size:       14px;
    line-height:     1.5;
    color:           #333;
}

.goods-page-detail .goods-meta-strip__k {
    color:       #555;
    font-weight: 500;
}

.goods-page-detail .goods-meta-strip__v {
    font-weight: 600;
    color:       #111;
}

.goods-page-detail .goods-meta-strip__item--hot .goods-meta-strip__v--num {
    color:       #b71c1c;
    font-weight: 800;
    margin-left: 2px;
}

.goods-page-detail .goods-meta-strip__hint {
    margin-left: 6px;
    font-size:   13px;
    font-weight: 500;
    color:       #444;
}

.goods-page-detail .goods-meta-cat-row {
    margin:      12px 0 0;
    font-size:   14px;
    line-height: 1.6;
    color:       #010101;
}

.goods-page-detail .goods-meta-taxonomy .goods-meta-cat-row--follow {
    margin-top: 6px;
}

.goods-meta-cat a,
.goods-page-detail .goods-meta-cat-link {
    color:           #0d6b5c;
    text-decoration: none;
    font-weight:     600;
    border-bottom:   1px solid rgba(13, 107, 92, 0.3);
}

.goods-meta-cat a:hover,
.goods-page-detail .goods-meta-cat-link:hover {
    color:               #c62828;
    border-bottom-color: rgba(198, 40, 40, 0.4);
}

/* オプション：dl + label + select（SEO / アクセシビリティ） */
.goods-page-detail .goods-options {
    margin:                18px 0 0;
    padding:               0;
    display:               grid;
    grid-template-columns: minmax(5.5em, 100px) minmax(0, 1fr);
    gap:                   12px 14px;
    align-items:           center;
}

.goods-page-detail .goods-options dt,
.goods-page-detail .goods-options dd {
    margin: 0;
}

.goods-page-detail .goods-option-label {
    display:     block;
    font-size:   14px;
    color:       #333;
    font-weight: 500;
    cursor:      pointer;
}

.goods-page-detail .goods-order-panel .goods-select {
    width:              100%;
    max-width:          320px;
    box-sizing:         border-box;
    min-height:         42px;
    padding:            10px 36px 10px 12px;
    font-size:          14px;
    line-height:        1.35;
    color:              #222;
    background-color:   #fff;
    background-image:   url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23333' d='M2.5 4.5L6 8l3.5-3.5'/%3E%3C/svg%3E");
    background-repeat:  no-repeat;
    background-position: right 12px center;
    border:             1px solid #cfcfcf;
    border-radius:      10px;
    appearance:         none;
    -webkit-appearance: none;
    cursor:             pointer;
}

.goods-page-detail .goods-order-panel .goods-select:hover {
    border-color: #a8a8a8;
}

.goods-page-detail .goods-order-panel .goods-select:focus {
    outline:      none;
    border-color: #0d6b5c;
    box-shadow:   0 0 0 3px rgba(13, 107, 92, 0.15);
}

/* Layui form.render(select) 展开列表：替换默认 #010101 选中底（仅商品详情） */
.goods-page-detail .layui-form-select dl {
    border:        1px solid #d4dcd9;
    border-radius: 10px;
    box-shadow:    0 12px 32px rgba(0, 0, 0, 0.1);
    padding:       6px 0;
}

.goods-page-detail .layui-form-select dl dd {
    margin:    2px 8px;
    padding:   0 12px;
    line-height: 38px;
    border-radius: 8px;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.goods-page-detail .layui-form-select dl dd:hover {
    background-color: #f0f7f5;
}

.goods-page-detail .layui-form-select dl dd.layui-this {
    background:    linear-gradient(135deg, #e8f4f1 0%, #dff0ec 100%);
    color:         #0a4d45;
    font-weight:   600;
}

.goods-page-detail .layui-form-select dl dd.layui-this:hover {
    background: linear-gradient(135deg, #dff0ec 0%, #d4ebe6 100%);
    color:      #083d37;
}

.goods-page-detail .layui-form-select dl dd.layui-select-tips.layui-this {
    color:         #5a6d69;
    font-weight:   500;
    box-shadow:    none;
    background:    #f4fbfb;
}

.goods-btn-row {
    margin-top:      20px !important;
    display:         flex;
    flex-wrap:       wrap;
    gap:             12px;
    justify-content: center;
}

.goods-btn-row .goods-btn--primary {
    flex:          1 1 160px;
    min-height:    44px;
    border-radius: 999px;
    box-shadow:    0 6px 18px rgba(216, 18, 18, 0.22);
    transition:    transform 0.15s ease, box-shadow 0.15s ease;
}

.goods-btn-row .goods-btn--primary:hover {
    transform:  translateY(-2px);
    box-shadow: 0 8px 22px rgba(216, 18, 18, 0.28);
}

.goods-page-detail .delivery {
    clear:         both;
    width:         100%;
    max-width:     100%;
    box-sizing:    border-box;
    border-radius: 12px;
    border-color:  #e8e8e8;
    padding:       16px 18px;
    margin-top:    24px;
    background:    #fafafa;
}

.goods-page-detail .goods-amet .layui-tab-title li {
    font-weight: 600;
}

.goods-page-detail .goods-detail {
    padding:     8px 4px 20px;
    font-size:   15px;
    line-height: 1.75;
    color:       #222;
}

.goods-related-popular {
    color:       #c62828 !important;
    font-weight: 700;
    font-size:   12px !important;
}

/* おすすめ：详情主区域下方独立区块，与全站 container 同宽 + home-rank-grid */
.related.goods-page-related.related--below-main {
    margin-top:    0;
    margin-bottom: 28px;
    width:         100%;
    box-sizing:    border-box;
    padding-top:   28px;
    border-top:    1px solid #ebebeb;
    background:    #fff;
}

.related.goods-page-related.related--below-main .page-related-grid.home-section.home-rank {
    margin-top: 14px;
}

@media (max-width: 768px) {
    .goods-page-detail.goods-wrap {
        padding:       16px;
        border-radius: 12px;
    }

    .goods-page-detail .goods-meta-strip {
        flex-direction: column;
        align-items:    flex-start;
        gap:            8px;
    }

    .goods-page-detail .goods-order-panel .goods-select {
        max-width: 100%;
    }
}