/**
 * MINORI SPORT — Single Product Page Styles
 * Module: minori-single-product.css
 * Scope: .single-product only
 */

/* ══════════════════════════════════════════════════════════
   0. PRODUCT GALLERY — NỀN TRẮNG CHO ẢNH PNG TRONG SUỐT
   Magnific Popup (MFP) dùng .mfp-figure::after làm nền xám
══════════════════════════════════════════════════════════ */

.mfp-figure::after {
    background: #ffffff !important;
    box-shadow: none !important;
}

.single-product .woocommerce-product-gallery,
.single-product .woocommerce-product-gallery__wrapper,
.single-product .woocommerce-product-gallery__image,
.single-product .flex-viewport,
.single-product .flexslider,
.single-product .product-gallery {
    background-color: #ffffff !important;
    background: #ffffff !important;
}

/* ══════════════════════════════════════════════════════════
   1. CHIP CHỌN BIẾN THỂ (size, màu sắc, dung tích)
══════════════════════════════════════════════════════════ */

.single-product .variable-item:not(.color-variable-item),
.single-product .tawcvs-swatches .swatch-label,
.single-product .woo-variation-swatches .swatch-wrapper .swatch-label {
    border:        1.5px solid #d0e4f5 !important;
    border-radius: 8px !important;
    padding:       6px 14px !important;
    font-size:     12.5px !important;
    color:         #0d2340 !important;
    background:    #fff !important;
    cursor:        pointer !important;
    transition:    border-color 0.15s, color 0.15s !important;
    outline:       none !important;
}

/* Active state — chỉ đổi màu chữ, giữ nguyên viền */
.single-product .variable-item.selected:not(.color-variable-item),
.single-product .tawcvs-swatches .swatch-label.selected,
.single-product .woo-variation-swatches .swatch-wrapper.selected .swatch-label {
    border:       1.5px solid #d0e4f5 !important;
    color:        #F75E00 !important;
    font-weight:  600 !important;
    background:   #fff !important;
    outline:      none !important;
}

/* Xóa outline/box-shadow mặc định khi focus */
.single-product .variable-item:focus,
.single-product .variable-item:focus-visible,
.single-product .tawcvs-swatches .swatch-label:focus,
.single-product .tawcvs-swatches .swatch-label:focus-visible,
.single-product .woo-variation-swatches .swatch-wrapper .swatch-label:focus,
.single-product .woo-variation-swatches .swatch-wrapper .swatch-label:focus-visible,
.single-product .chip:focus,
.single-product .chip:focus-visible,
.single-product .chip.active:focus,
.single-product .chip.active:focus-visible {
    outline:    none !important;
    box-shadow: none !important;
}

/* Chip active (class .chip — Flatsome / plugin khác) */
.single-product .chip.active,
.single-product a.chip.active,
.single-product a.chip:visited.active {
    border:      1.5px solid #d0e4f5 !important;
    color:       #F75E00 !important;
    font-weight: 600 !important;
    box-shadow:  none !important;
    outline:     none !important;
}

.single-product .chip:not(.active),
.single-product a.chip:not(.active) {
    border:     1.5px solid #d0e4f5 !important;
    color:      #0d2340 !important;
    box-shadow: none !important;
    outline:    none !important;
}

/* Color & Image swatch — mặc định */
.single-product .variable-item.color-variable-item .variable-item-contents,
.single-product .variable-item.image-variable-item .variable-item-contents,
.single-product .tawcvs-swatches .swatch-color,
.single-product .woo-variation-swatches .swatch-wrapper .swatch-color {
    width:         36px !important;
    height:        36px !important;
    border-radius: 8px !important;
    border:        2px solid transparent !important;
    overflow:      hidden !important;
}

/* Image bên trong image swatch */
.single-product .variable-item.image-variable-item .variable-item-contents img {
    width:      100% !important;
    height:     100% !important;
    object-fit: cover !important;
    display:    block !important;
}

/* Fallback khi ảnh bị lỗi — hiện nền xám thay vì icon broken */
.single-product .variable-item.image-variable-item .variable-item-contents img[src=""],
.single-product .variable-item.image-variable-item .variable-item-contents img:not([src]) {
    display:    none !important;
}
.single-product .variable-item.image-variable-item .variable-item-contents:has(img:not([src])),
.single-product .variable-item.image-variable-item .variable-item-contents:has(img[src=""]) {
    background: #e5eef7 !important;
}

/* Color & Image swatch active */
.single-product .variable-item.color-variable-item.selected .variable-item-contents,
.single-product .variable-item.image-variable-item.selected .variable-item-contents,
.single-product .tawcvs-swatches .swatch-color.selected,
.single-product .woo-variation-swatches .swatch-wrapper.selected .swatch-color {
    border:         2px solid #fff !important;
    outline:        2px solid #F75E00 !important;
    outline-offset: 2px !important;
}

/* Image-variable-item wrapper (chip ngoài) — không áp padding như text chip */
.single-product .variable-item.image-variable-item {
    padding:    0 !important;
    background: transparent !important;
    border:     none !important;
}

/* ══════════════════════════════════════════════════════════
   2. BỎ KHUNG CAM TRÊN .woocommerce-variation-price
      (override inline footer style)
══════════════════════════════════════════════════════════ */
.single-product .woocommerce-variation-price {
    background:    transparent !important;
    border:        none !important;
    padding:       0 !important;
    margin:        0 !important;
    border-radius: 0 !important;
    animation:     none !important;
}

.single-product .woocommerce-variation-price .price {
    color:       inherit !important;
    font-size:   inherit !important;
    font-weight: inherit !important;
    display:     block !important;
    margin:      0 !important;
}

/* ══════════════════════════════════════════════════════════
   3. ĐƯỜNG KẺ PHÂN CÁCH
══════════════════════════════════════════════════════════ */
.single-product .minori-sp-price-divider {
    border:     none !important;
    border-top: 1px solid #e5eef7 !important;
    margin:     16px 0 !important;
}

/* ══════════════════════════════════════════════════════════
   4. BOX GIÁ MEMBER (xanh nhạt, không có khung cam ngoài)
══════════════════════════════════════════════════════════ */
.single-product .minori-sp-price-box {
    background:      #EBF2FA !important;
    border-radius:   10px !important;
    padding:         14px 16px !important;
    display:         flex !important;
    align-items:     center !important;
    justify-content: space-between !important;
    gap:             12px !important;
    border:          none !important;
    outline:         none !important;
    width:           100% !important;
    box-sizing:      border-box !important;
}

/* Cột trái */
.single-product .minori-sp-price-left {
    display:   block !important;
    width:     100% !important;
    min-width: 0 !important;
}

.single-product .minori-sp-member-badge {
    background:      #185FA5 !important;
    color:           #fff !important;
    font-size:       10px !important;
    font-weight:     600 !important;
    padding:         3px 10px !important;
    border-radius:   20px !important;
    letter-spacing:  0.04em !important;
    display:         inline-block !important;
    line-height:     1.6 !important;
    margin-bottom:   0 !important;
    vertical-align:  middle !important;
}

.single-product .minori-sp-member-price {
    font-size:    16px !important;
    font-weight:  700 !important;
    color:        #F75E00 !important;
    white-space:  nowrap !important;
    line-height:  1.2 !important;
    display:      inline !important;
    margin-left:  8px !important;
    margin-bottom: 0 !important;
}

.single-product .minori-sp-mixu-tag {
    background:    #fff !important;
    border:        1px solid #b8d4ed !important;
    color:         #185FA5 !important;
    font-size:     11px !important;
    font-weight:   500 !important;
    padding:       3px 10px !important;
    border-radius: 20px !important;
    display:       inline-block !important;
    line-height:   1.6 !important;
}

.single-product .minori-sp-retail-price {
    display:       block !important;
    font-size:     16px !important;
    font-weight:   700 !important;
    color:         #111 !important;
    margin-top:    0 !important;
    margin-bottom: 8px !important;
}

.single-product .minori-sp-retail-price .minori-sp-vat {
    font-size:   12px !important;
    font-weight: 400 !important;
    color:       #777 !important;
}

/* Cột phải */
.single-product .minori-sp-price-right {
    display:        flex !important;
    flex-direction: column !important;
    align-items:    flex-end !important;
    flex-shrink:    0 !important;
    text-align:     right !important;
    gap:            0 !important;
}

.single-product .minori-sp-original-price {
    font-size:       13px !important;
    color:           #999 !important;
    text-decoration: line-through !important;
    white-space:     nowrap !important;
    display:         block !important;
    margin-bottom:   4px !important;
}

.single-product .minori-sp-savings {
    font-size:   11px !important;
    color:       #F75E00 !important;
    font-weight: 600 !important;
    white-space: nowrap !important;
    display:     block !important;
}

/* ══════════════════════════════════════════════════════════
   5. THÔNG BÁO MIXU — chỉ phần này có màu cam
      (border-left cam, không bọc khung cam ngoài)
══════════════════════════════════════════════════════════ */
.single-product .minori-sp-mixu-notice {
    background:    #FFF3ED !important;
    border-left:   3px solid #F75E00 !important;
    border-radius: 0 8px 8px 0 !important;
    padding:       8px 12px !important;
    font-size:     12px !important;
    color:         #555 !important;
    margin:        10px 0 !important;
    line-height:   1.5 !important;
    border-top:    none !important;
    border-right:  none !important;
    border-bottom: none !important;
}

.single-product .minori-sp-mixu-highlight {
    color:       #F75E00 !important;
    font-weight: 600 !important;
}

/* ══════════════════════════════════════════════════════════
   6. KHU VỰC NÚT HÀNH ĐỘNG
══════════════════════════════════════════════════════════ */

/* Qty row */
.single-product .minori-qty-row {
    display:     flex !important;
    align-items: center !important;
    gap:         10px !important;
    margin-top:  16px !important;
}

.single-product .minori-qty-label {
    font-size:   13px !important;
    font-weight: 600 !important;
    color:       #0d2340 !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
}

/* Main buttons wrapper — desktop: dọc */
.single-product .minori-main-buttons {
    display:        flex !important;
    flex-direction: column !important;
    gap:            10px !important;
    margin-top:     10px !important;
    width:          100% !important;
    box-sizing:     border-box !important;
}

/* --- Thêm giỏ hàng --- */
.single-product .single_add_to_cart_button,
.single-product button.single_add_to_cart_button {
    background:    #F75E00 !important;
    color:         #fff !important;
    border:        none !important;
    border-radius: 8px !important;
    padding:       11px 16px !important;
    font-size:     14px !important;
    font-weight:   600 !important;
    width:         100% !important;
    margin:        0 !important;
    display:       flex !important;
    align-items:   center !important;
    justify-content: center !important;
    cursor:        pointer !important;
    box-sizing:    border-box !important;
    white-space:   nowrap !important;
    box-shadow:    0 3px 10px rgba(247,94,0,0.20) !important;
    transition:    background .15s !important;
}
.single-product .single_add_to_cart_button:hover,
.single-product button.single_add_to_cart_button:hover {
    background: #de5400 !important;
    color:      #fff !important;
}

/* --- Mua ngay --- */
.single-product .minori-buy-now-btn {
    background:    #0C447C !important;
    color:         #fff !important;
    border:        none !important;
    border-radius: 8px !important;
    padding:       11px 16px !important;
    font-size:     14px !important;
    font-weight:   600 !important;
    width:         100% !important;
    display:       flex !important;
    align-items:   center !important;
    justify-content: center !important;
    cursor:        pointer !important;
    box-sizing:    border-box !important;
    transition:    background .15s !important;
}
.single-product .minori-buy-now-btn:hover {
    background: #185FA5 !important;
    color:      #fff !important;
}

/* --- Yêu thích --- */
.single-product .minori-wishlist-wrapper {
    margin-top: 10px !important;
    display:    block !important;
    width:      100% !important;
}
.single-product .minori-wishlist-btn {
    background:    #EBF2FA !important;
    color:         #185FA5 !important;
    border:        0.5px solid #B5D4F4 !important;
    border-radius: 8px !important;
    padding:       11px 16px !important;
    font-size:     14px !important;
    font-weight:   600 !important;
    width:         100% !important;
    display:       flex !important;
    align-items:   center !important;
    justify-content: center !important;
    gap:           8px !important;
    cursor:        pointer !important;
    box-sizing:    border-box !important;
    white-space:   nowrap !important;
    transition:    background .15s, border-color .15s !important;
}
.single-product .minori-wishlist-btn:hover {
    background:   #d5e8f5 !important;
    border-color: #94c0e8 !important;
}
.single-product .minori-wishlist-btn.added {
    background:   #185FA5 !important;
    color:        #fff !important;
    border-color: #185FA5 !important;
}
.single-product .minori-wl-notice { display: none !important; }

/* --- So sánh --- */
.single-product .minori-compare-buttons-wrapper {
    display:     flex !important;
    gap:         0 !important;
    margin-top:  10px !important;
    align-items: stretch !important;
    flex-wrap:   nowrap !important;
    width:       100% !important;
    box-sizing:  border-box !important;
}
/* minori-shop.css đặt height:40px!important cho button bên trong wrapper,
   dùng html body để tăng specificity override hoàn toàn */
html body .single-product .minori-add-to-compare:not(.added) {
    background:    transparent !important;
    color:         #888 !important;
    border:        0.5px solid #ddd !important;
    border-radius: 8px !important;
    padding:       11px 16px !important;
    font-size:     14px !important;
    font-weight:   600 !important;
    height:        auto !important;
    flex:          1 1 100% !important;
    width:         100% !important;
    display:       flex !important;
    align-items:   center !important;
    justify-content: center !important;
    cursor:        pointer !important;
    box-sizing:    border-box !important;
    transition:    background .15s, border-color .15s !important;
}
html body .single-product .minori-add-to-compare:not(.added):hover {
    background:   #f5f5f5 !important;
    border-color: #ccc !important;
}
html body .single-product .minori-add-to-compare.added {
    background:    #185FA5 !important;
    color:         #fff !important;
    border:        none !important;
    border-radius: 8px !important;
    padding:       11px 16px !important;
    font-size:     13px !important;
    font-weight:   600 !important;
    height:        auto !important;
    flex:          1 !important;
    display:       flex !important;
    align-items:   center !important;
    justify-content: center !important;
    cursor:        pointer !important;
    box-sizing:    border-box !important;
}
.single-product .minori-view-compare { display: none !important; visibility: hidden !important; }
.single-product .minori-view-compare.xem-bang-active {
    display:       flex !important;
    visibility:    visible !important;
    flex:          1 !important;
    background:    #fff !important;
    border:        1.5px solid #185FA5 !important;
    border-radius: 8px !important;
    color:         #185FA5 !important;
    font-size:     13px !important;
    font-weight:   600 !important;
    height:        auto !important;
    padding:       11px 16px !important;
    align-items:   center !important;
    justify-content: center !important;
    text-decoration: none !important;
    cursor:        pointer !important;
    box-sizing:    border-box !important;
    margin-left:   8px !important;
}

/* --- Ẩn guest wishlist notice --- */
.single-product .minori-guest-wishlist-notice { display: none !important; }

/* Mobile: Thêm giỏ hàng + Mua ngay nằm ngang 50/50 */
@media (max-width: 768px) {
    .single-product .minori-main-buttons {
        display:              grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap:                  8px !important;
        flex-direction:       unset !important;
    }
    .single-product .single_add_to_cart_button,
    .single-product button.single_add_to_cart_button,
    .single-product .minori-buy-now-btn {
        padding:   10px 12px !important;
        font-size: 13px !important;
        width:     100% !important;
    }
    .single-product .minori-wishlist-btn {
        padding:   9px 10px !important;
        font-size: 12px !important;
    }
    html body .single-product .minori-add-to-compare:not(.added) {
        padding:   9px 10px !important;
        font-size: 12px !important;
        height:    auto !important;
    }
    html body .single-product .minori-add-to-compare.added,
    .single-product .minori-view-compare.xem-bang-active {
        padding:   9px 12px !important;
        font-size: 12px !important;
        height:    auto !important;
    }
}

/* ══════════════════════════════════════════════════════════
   7. ẨN MESSAGE TRÙNG CỦA PLUGIN
══════════════════════════════════════════════════════════ */
.single-product .wc_points_rewards_earn_points,
.single-product p.wc_points_rewards_earn_points,
.single-product .wc_points_rewards_product_message,
.single-product .woocommerce-message.wc_points_rewards_product_message {
    display: none !important;
}

/* ══════════════════════════════════════════════════════════
   8. FORM CART — reset width conflicts
══════════════════════════════════════════════════════════ */
.single-product form.cart {
    max-width:  100% !important;
    box-sizing: border-box !important;
}

/* ══════════════════════════════════════════════════════════
   9. MOBILE (≤ 600px)
══════════════════════════════════════════════════════════ */
@media (max-width: 600px) {
    /* Box giá */
    .single-product .minori-sp-price-box {
        flex-direction: column !important;
        align-items:    flex-start !important;
        gap:            6px !important;
    }

    .single-product .minori-sp-price-right {
        align-items: flex-start !important;
        text-align:  left !important;
    }

    .single-product .minori-sp-member-price {
        font-size: 20px !important;
    }

    /* Nút hành động dọc — thu nhỏ 1 chút */
    .single-product .minori-main-buttons {
        gap: 8px !important;
    }
}

/* ══════════════════════════════════════════════════════════
   SẢN PHẨM ĐÃ XEM (RECENTLY VIEWED PRODUCTS)
══════════════════════════════════════════════════════════ */

.minori-rv-section {
    padding: 36px 0 28px;
    background: #fff;
    border-top: 1px solid #eee;
    margin-top: 20px;
    clear: both;
}

/* Heading: duong xanh chi duoi chu, phan con lai trang */
.minori-rv-heading-wrap {
    border-bottom: 1px solid #fff;
    margin-bottom: 20px;
}
.minori-rv-heading {
    display: inline-block;
    font-size: 15px;
    font-weight: 700;
    text-transform: uppercase;
    color: #1A3D6B;
    letter-spacing: 0.5px;
    margin: 0 0 -1px;
    padding-bottom: 10px;
    border-bottom: 2.5px solid #1A3D6B;
}

.minori-rv-slider-wrap {
    display: flex;
    align-items: center;
    gap: 6px;
}

.minori-rv-track-outer {
    flex: 1;
    overflow: hidden;
    min-width: 0;
}

.minori-rv-track {
    display: flex;
    gap: 16px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    cursor: grab;
    -ms-overflow-style: none;
    scrollbar-width: none;
    padding-bottom: 8px;
    align-items: stretch;
}
.minori-rv-track:active { cursor: grabbing; }
.minori-rv-track::-webkit-scrollbar { display: none; }

/* Card trong RV track: dung class rieng .minori-rv-card de khong anh huong card khac */
.minori-rv-card {
    flex: 0 0 160px !important;
    width: 160px !important;
    max-width: 160px !important;
    padding: 0 !important;
    scroll-snap-align: start;
}
.minori-rv-card .col-inner {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
}
.minori-rv-card .product-small.box {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 !important;
}
.minori-rv-card .box-text {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 !important;
    padding: 8px !important;
}
.minori-rv-card .price-wrapper {
    margin-top: auto !important;
}
/* An gia gach (regular price) - chi hien gia sale */
.minori-rv-card .price del { display: none !important; }

/* Anh san pham: chieu cao co dinh, object-fit contain */
.minori-rv-card .box-image a {
    display: block !important;
}
.minori-rv-card .box-image img {
    width: 100% !important;
    height: 140px !important;
    object-fit: contain !important;
    display: block !important;
}

/* Nut dieu huong slider */
.minori-rv-nav {
    flex: 0 0 auto;
    background: #fff;
    border: 1.5px solid #ddd;
    border-radius: 50%;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 16px;
    color: #555;
    transition: border-color 0.2s, color 0.2s;
    padding: 0;
    line-height: 1;
}
.minori-rv-nav:hover {
    border-color: #F75E00;
    color: #F75E00;
    background: #fffcf9;
}
.minori-rv-nav.disabled {
    opacity: 0.25;
    cursor: default;
    pointer-events: none;
}

/* Responsive mobile */
@media (max-width: 767px) {
    .minori-rv-section { padding: 24px 0 18px; }
    .minori-rv-card { flex: 0 0 130px !important; width: 130px !important; max-width: 130px !important; }
    .minori-rv-card .box-image img { height: 110px !important; }
    .minori-rv-nav { display: none; }
}



