/* --- FORCED Etsy-Style CSS Overrides (Locally Scoped) --- */

@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap');

#etsy-custom-layout {
    font-family: 'Roboto', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
    color: #222 !important;
    background-color: #FAF8F5 !important;
    /* Unified Background Color */
    min-height: 100vh !important;
}

#etsy-custom-layout .content-product-left {
    padding-right: 30px !important;
}

/* Rounded Corners for Main Product Images */
#etsy-custom-layout .large-image {
    border-radius: 11px !important;
    overflow: hidden !important;
    text-align: center;
    max-height: 650px;
}

#etsy-custom-layout .large-image img {
    border-radius: 11px !important;
    overflow: hidden !important;
}

#etsy-custom-layout .thumb-vertical-outer .image-additional a.thumbnail {
    border-radius: 10px !important;
    overflow: hidden !important;
}

#etsy-custom-layout .thumb-vertical-outer .image-additional img {
    border-radius: 10px !important;
}

/* Social Proof */
.social-proof-etsy {
    margin-bottom: 12px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #a61a2e !important;
    background: transparent !important;
    padding: 0 !important;
    display: block !important;
}

.social-proof-etsy i {
    margin-right: 5px !important;
    font-size: 14px !important;
}

/* Price Styling */
#etsy-custom-layout .product_page_price {
    margin: 0 0 10px 0 !important;
    border: none !important;
    padding: 0 !important;
}

.price-etsy-wrapper {
    display: flex !important;
    align-items: baseline !important;
    gap: 10px !important;
}

#etsy-custom-layout .price-new {
    font-size: 28px !important;
    font-weight: 700 !important;
    color: #222 !important;
}

#etsy-custom-layout .price-etsy-wrapper .price-new {
    color: #d6610a !important;
}

#etsy-custom-layout .price-old {
    font-size: 16px !important;
    color: #595959 !important;
    text-decoration: line-through !important;
    font-weight: 400 !important;
}

.label-etsy-discount {
    background: #e1f3d8 !important;
    color: #187d22 !important;
    padding: 2px 8px !important;
    border-radius: 20px !important;
    font-size: 14px !important;
    font-weight: 700 !important;
}

.sale-timer-etsy {
    font-size: 13px !important;
    font-weight: 700 !important;
    margin-bottom: 20px !important;
    color: #187d22 !important;
}

/* Title Styling */
.title-product-etsy h1 {
    font-size: 18px !important;
    font-weight: 400 !important;
    color: #222 !important;
    line-height: 1.4 !important;
    margin: 0 0 10px 0 !important;
}

.modmu-recent-views {
    color: #6b7280 !important;
    font-size: 13px !important;
    line-height: 1.4 !important;
    margin: -2px 0 10px 0 !important;
}

.modmu-recent-views i {
    color: #8fc31f !important;
    margin-right: 6px !important;
}

/* Manufacturer / Seller */
.manufacturer-etsy {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin-bottom: 25px !important;
}

.manufacturer-etsy a {
    color: #222 !important;
    text-decoration: underline !important;
    font-weight: 700 !important;
    font-size: 14px !important;
}

.rating-box-etsy {
    color: #222 !important;
    font-size: 10px !important;
}

/* Trust Indicators */
.trust-indicators-etsy {
    border-top: none !important;
    margin-bottom: 25px !important;
}

.indicator-item {
    display: flex !important;
    gap: 12px !important;
    margin-bottom: 12px !important;
    font-size: 14px !important;
    line-height: 1.4 !important;
}

.indicator-item i {
    font-size: 16px !important;
    margin-top: 2px !important;
    color: #1d4ed8 !important;
}

.star-seller {
    background: #fdf6f7 !important;
    padding: 15px !important;
    border-radius: 12px !important;
    display: flex !important;
    align-items: flex-start !important;
    margin-top: 20px !important;
}

.star-seller-badge {
    color: #78107a !important;
    font-size: 24px !important;
    margin-right: 15px !important;
}

.star-seller-text {
    font-size: 13px !important;
    color: #595959 !important;
    line-height: 1.4 !important;
}

/* Options Dropdown */
.options-etsy .form-group {
    margin-bottom: 20px !important;
}

.options-etsy label {
    font-size: 14px !important;
    font-weight: 700 !important;
    margin-bottom: 8px !important;
    color: #222 !important;
}

.select-wrapper-etsy select {
    height: 48px !important;
    border-radius: 8px !important;
    border: 1px solid #e1e1e1 !important;
    font-size: 16px !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    padding: 0 40px 0 15px !important;
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") no-repeat calc(100% - 15px) center !important;
    width: 100% !important;
}

/* Cart Section */
.cart-section-etsy {
    margin-top: 30px !important;
}

.cart-section-etsy .box-info-product {
    display: flex !important;
    flex-direction: column !important;
    gap: 15px !important;
}

.cart-section-etsy .quantity-control {
    display: flex !important;
    width: 140px !important;
    border: 1px solid #e1e1e1 !important;
    border-radius: 24px !important;
    overflow: hidden !important;
    height: 48px !important;
    align-items: center !important;
    padding: 0 4px !important;
}

.cart-section-etsy .quantity-control span {
    background: transparent !important;
    border: none !important;
    color: #222 !important;
    cursor: pointer !important;
    width: 40px !important;
    height: 40px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 14px !important;
}

.cart-section-etsy .quantity-control span:hover {
    background: #f4f4f4 !important;
    border-radius: 50% !important;
}

.cart-section-etsy .quantity-control input {
    border: none !important;
    text-align: center !important;
    font-weight: 700 !important;
    box-shadow: none !important;
    flex-grow: 1 !important;
    width: 30px !important;
    padding: 0 !important;
    background: transparent !important;
    height: 100% !important;
    font-size: 16px !important;
}

.cart-section-etsy .cart {
    width: 100% !important;
}

#etsy-custom-layout .cart input.btn-mega {
    background-color: #222329 !important;
    color: #fff !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    padding: 16px 20px !important;
    border-radius: 30px !important;
    border: none !important;
    width: 100% !important;
    display: block !important;
    transition: background-color 0.2s !important;
    text-transform: none !important;
}

/* Highlights Section */
.highlights-etsy {
    margin-top: 30px !important;
}

.highlights-etsy h3 {
    font-size: 16px !important;
    font-weight: 700 !important;
    margin-bottom: 15px !important;
    color: #222 !important;
}

.highlights-etsy li {
    display: flex !important;
    gap: 12px !important;
    margin-bottom: 12px !important;
    font-size: 14px !important;
    color: #222 !important;
    align-items: center !important;
}

.highlights-etsy li i {
    font-size: 18px !important;
    color: #222 !important;
    width: 24px !important;
    text-align: center !important;
}

/* Item Details Accordion */
.item-details-etsy {
    margin-top: 30px !important;
    border-top: 1px solid #e2e8f0 !important;
    border-bottom: 1px solid #e2e8f0 !important;
}

/* Force override Bootstrap panel, panel-default, and panel-group */
.item-details-etsy .panel-group .panel,
.item-details-etsy .panel.panel-default {
    border: 0px solid transparent !important;
    box-shadow: none !important;
    background-color: transparent !important;
    margin-top: 0 !important;
    border-radius: 0 !important;

}

.item-details-etsy .panel-group .panel-heading {
    padding: 18px 0 !important;
    background-color: transparent !important;
    background-image: none !important;
    border: 0px solid transparent !important;
    border-bottom: none !important;
}

.item-details-etsy .panel-title a {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    color: #222 !important;
    text-decoration: none !important;
    letter-spacing: 0.3px !important;
    padding: 0px 20px;
}

.item-details-etsy .panel-title a:hover,
.item-details-etsy .panel-title a:focus {
    color: #000 !important;
    text-decoration: none !important;
}

.item-details-etsy .panel-title a i {
    font-size: 13px !important;
    color: #71717a !important;
    transition: transform 0.3s ease !important;
}

.item-details-etsy .panel-title a:not(.collapsed) i {
    transform: rotate(180deg) !important;
}

/* Override the border-top that bootstrap adds to panel-body when inside a collapse */
.item-details-etsy .panel-group .panel-heading+.panel-collapse>.panel-body,
.item-details-etsy .panel-group .panel-body {
    padding: 0 0 24px 0 !important;
    font-size: 14px !important;
    line-height: 1.7 !important;
    color: #4b5563 !important;
    border-top: 0px solid transparent !important;
    background-color: transparent !important;
}

/* Layout Restructuring (Grid) */
@media (min-width: 992px) {
    .container.product-detail {
        width: 100% !important;
        max-width: 1680px !important;
        /* Updated to 1680px */
        padding: 0 10px !important;
    }

    #etsy-custom-layout .product-view {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 520px !important;
        gap: 0 60px !important;
        align-items: start !important;
    }

    #etsy-custom-layout .content-product-mainheader,
    #etsy-custom-layout .content-product-mainheader>.row,
    #etsy-custom-layout .content-product-mainbody,
    #etsy-custom-layout .content-product-content,
    #etsy-custom-layout .content-product-midde {
        display: contents !important;
    }

    #etsy-custom-layout .content-product-left {
        grid-column: 1 / 2 !important;
        grid-row: 1 / 2 !important;
        width: 100% !important;
        padding-right: 0 !important;
    }

    #etsy-custom-layout .producttab {
        grid-column: 1 / 2 !important;
        grid-row: 2 / 3 !important;
        width: 100% !important;
        margin-top: 40px !important;
        border-top: 1px solid #e1e1e1 !important;
        padding-top: 30px !important;
    }

    #etsy-custom-layout .content-product-right {
        grid-column: 2 / 3 !important;
        grid-row: 1 / 3 !important;
        position: sticky !important;
        top: 20px !important;
        padding-left: 0 !important;
        width: 100% !important;
    }

    #etsy-custom-layout .content-product-bottom {
        grid-column: 1 / -1 !important;
        grid-row: 3 / 4 !important;
        width: 100% !important;
        margin-top: 40px !important;
    }
}

/* Mobile Adjustments */
@media (max-width: 991px) {
    #etsy-custom-layout .product-view {
        display: block !important;
    }

    #etsy-custom-layout .content-product-right {
        margin-top: 30px !important;
    }

    .price-new {
        font-size: 24px !important;
    }

    .cart-section-etsy .quantity-control {
        max-width: none !important;
    }
}

/* Etsy Tabs Styling */
#etsy-custom-layout .producttab .nav-tabs {
    border-bottom: 1px solid #e1e1e1 !important;
    margin-bottom: 25px !important;
}

#etsy-custom-layout .producttab .nav-tabs>li>a {
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #595959 !important;
    border: none !important;
    padding: 12px 20px !important;
    background: transparent !important;
}

#etsy-custom-layout .producttab .nav-tabs>li.active>a {
    color: rgb(141 194 21);
    border-bottom: 2px solid rgb(141 194 21) !important;
}

/* ========================================================================
   MODERN ZOOM OVERLAY - 1:1 CLONE OF ETSY DESIGN
   ======================================================================== */

.mfp-hide {
    display: none !important;
}

/* Background Overlay */
.mfp-stacked-gallery.mfp-bg {
    background: rgba(255, 255, 255, 0.98) !important;
    backdrop-filter: blur(15px) !important;
    -webkit-backdrop-filter: blur(15px) !important;
    opacity: 1 !important;
}

/* Centering Container */
.mfp-stacked-gallery .mfp-container {
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.mfp-stacked-gallery .mfp-content {
    width: 100% !important;
    max-width: 1400px !important;
    height: 100vh !important;
    margin: 0 auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative !important;
}

/* Layout Wrapper - ONLY active inside mfp-wrap */
.mfp-wrap .popup-layout-container {
    display: flex !important;
    width: auto !important;
    max-width: 95% !important;
    height: 92vh !important;
    gap: 40px !important;
    align-items: flex-start !important;
    justify-content: center !important;
    background: transparent !important;
    position: relative !important;
}

/* Left: 2-column Thumbnail Grid (100px each) */
.popup-sidebar {
    width: 210px !important;
    flex-shrink: 0 !important;
    display: grid !important;
    grid-template-columns: 100px 100px !important;
    grid-auto-rows: 100px !important;
    gap: 10px !important;
    overflow-y: auto !important;
    height: 100% !important;
    scrollbar-width: none !important;
}

.popup-sidebar::-webkit-scrollbar {
    display: none !important;
}

.popup-thumb {
    width: 100px !important;
    height: 100px !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    border: 2px solid transparent !important;
    transition: all 0.2s ease !important;
    cursor: pointer !important;
    background: #fff !important;
    padding: 2px !important;
    box-sizing: border-box !important;
}

.popup-thumb img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: 6px !important;
}

/* THE EXACT ACTIVE STYLE: Black border with inner white padding */
.popup-thumb.active {
    border-color: #222 !important;
    box-shadow: 0 0 0 1px #fff inset !important;
}

/* Right: Large Image Column (750px max-width) */
.popup-content {
    flex-grow: 0 !important;
    width: 750px !important;
    max-width: 100% !important;
    height: 100% !important;
    overflow-y: auto !important;
    display: block !important;
    text-align: center !important;
    scroll-behavior: smooth !important;
    background: transparent !important;
}

.popup-content::-webkit-scrollbar {
    display: none !important;
}

.popup-large-img {
    max-width: 100% !important;
    width: 100% !important;
    height: auto !important;
    margin-bottom: 25px !important;
    border-radius: 12px !important;
    /* LARGE ROUNDED CORNER */
    background: #fff !important;
    display: block !important;
}

/* Custom Close Button - Always visible fixed top right */
.mfp-close-custom {
    position: fixed !important;
    left: calc(50% + 505px) !important;
    /* Center + (TotalWidth/2) + 30px */
    top: 70px !important;
    width: 36px !important;
    height: 36px !important;
    background: #f4f4f4 !important;
    border: none !important;
    border-radius: 50% !important;
    color: #222 !important;
    font-size: 24px !important;
    line-height: 36px !important;
    text-align: center !important;
    cursor: pointer !important;
    z-index: 10000 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05) !important;
    transition: background 0.2s !important;
}

.mfp-close-custom:hover {
    background: #e1e1e1 !important;
    transform: scale(1.05);
}

/* Hide default mfp elements */
.mfp-stacked-gallery .mfp-close,
.mfp-stacked-gallery .mfp-arrow {
    display: none !important;
}

@media (max-width: 1100px) {
    .mfp-wrap .popup-layout-container {
        gap: 20px !important;
    }
}

@media (max-width: 991px) {
    .popup-content {
        width: 100% !important;
    }

    .popup-sidebar {
        display: none !important;
    }

    .mfp-wrap .popup-layout-container {
        padding: 40px 15px !important;
        gap: 20px !important;
    }

    .mfp-close-custom {
        left: auto !important;
        right: 20px !important;
        top: 20px !important;
    }
}

/* Etsy-style Product Card */
.etsy-style-card {
    border: none !important;
    border-radius: 8px;
    transition: box-shadow 0.2s ease-in-out, transform 0.2s ease-in-out;
    background: #fff;
    padding: 0 !important;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    margin-bottom: 30px;
}

.etsy-style-card:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
}

.etsy-style-card .left-block {
    position: relative;
    border-radius: 8px;
    overflow: hidden;
}

.etsy-style-card .product-image-container img {
    width: 100%;
    height: auto;
    object-fit: cover;
    aspect-ratio: 1 / 1;
    border-radius: 8px;
}

.etsy-style-card .right-block {
    padding: 8px 4px 12px 4px !important;
    text-align: left !important;
}

.etsy-style-card .product-title {
    margin: 0 0 4px 0 !important;
}

.etsy-style-card .product-title a {
    color: #222 !important;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.4;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
}

.etsy-style-card .rating-row {
    display: flex;
    align-items: center;
    margin-bottom: 4px;
    font-size: 13px;
    flex-wrap: wrap;
}

.etsy-style-card .rating {
    display: inline-block;
    color: #222;
    margin-right: 4px;
}

.etsy-style-card .rating i {
    font-size: 12px;
}

.etsy-style-card .review-count {
    color: #595959;
    margin-right: 6px;
}

.etsy-style-card .badge-star-seller {
    display: inline-flex;
    align-items: center;
    color: #8B3D88;
    font-weight: 600;
    font-size: 12px;
}

.etsy-style-card .badge-star-seller svg {
    width: 14px;
    height: 14px;
    margin-right: 3px;
}

.etsy-style-card .price-action-row {
    margin-bottom: 2px;
}

.etsy-style-card .price {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
}

.etsy-style-card .price-new {
    color: #222 !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    margin-right: 6px;
}

.etsy-style-card .price-old {
    color: #595959 !important;
    font-size: 12px !important;
    text-decoration: line-through;
    margin-right: 6px;
}

.etsy-style-card .price-discount {
    color: #2e8b57;
    font-size: 13px;
    font-weight: 500;
}

.etsy-style-card .seller-info {
    color: #595959;
    font-size: 12px;
    margin-bottom: 4px;
}

.etsy-style-card .stock-info {
    font-size: 12px;
    color: #c13a3a !important;
    margin-top: 4px;
}

/* Hide standard SO-theme hover buttons (cart, wishlist, compare) to match Etsy clean look */
.etsy-style-card .button-group {
    display: none !important;
}

.etsy-style-card .box-label {
    display: none !important;
}

/* Global Background Color */
body,
#wrapper,
.wrapper,
.common-home,
.so-page-builder {
    background-color: #FAF8F5 !important;
}

/* Revert footer background to black */
footer,
.footer-container,
.footer-container .so-page-builder,
.footer-container .page-builder-ltr,
.footer-container .footer-top,
.footer-container .footer-middle,
.footer-container .footer-bottom,
.footer-container .row {
    background-color: #111111 !important;
    /* 使用深黑/炭黑保持质感 */
}

.footer-container .newsletter-footer21 .newsletter {
    background-color: #111111 !important;
}

/* Product Details Page Background Overrides */
.product-view,
.product-view .content-product-right,
.product-view .content-product-left,
.product-view .box-info,
.product-view .short_description,
.producttab,
.producttab .tab-content,
.producttab .nav-tabs>li>a,
.producttab .nav-tabs>li.active>a,
.producttab .nav-tabs>li.active>a:hover,
.producttab .nav-tabs>li.active>a:focus,
.form-group.box-info-product,
.up-sell,
.related-products,
.box-info,
.thumbnail,
.thumbnails .image-additional a.thumbnail,
.nav-tabs,
.panel-default,
.panel-body,
.panel-heading,
.product-item-container.product-detail,
.module.related-products,
.module.up-sell {
    background-color: #FAF8F5 !important;
}

/* Ensure related products grid follows Etsy style background */
.related-products .product-item-container,
.up-sell .product-item-container {
    background-color: #fff !important;
    /* Keep related product cards white like Etsy */
}

/* Limit Product Detail Main Image Height */
.product-view .large-image img,
.product-view .product-image-container img#image,
.product-view .thumbnails>li:first-child a img,
.product-view .product-image img {
    max-height: 650px !important;
    width: auto !important;
    margin: 0 auto !important;
    object-fit: contain !important;
    display: block;
}

/* Header 34 Search Button Background Override */
.typeheader-34 #sosearchpro .search button {
    background-color: #FAF8F5 !important;
}

/* Footer 31 Policy Slider Padding Override */
.typefooter-31 .block-policy .contentslider {
    padding: 0px !important;
}

/* Custom Product Column Adjustment */
@media (min-width: 992px) {
    .content-product-mainheader>.row>.content-product-left.col-md-6 {
        width: calc(50% - 30px) !important;
    }

    .content-product-mainheader>.row>.content-product-right.col-md-6 {
        width: calc(50% + 30px) !important;
    }

    .content-product-mainheader>.row>.content-product-left.col-md-5 {
        width: calc(41.66666667% - 30px) !important;
    }

    .content-product-mainheader>.row>.content-product-right.col-md-7 {
        width: calc(58.33333333% + 30px) !important;
    }
}
