/**
 * Product Detail Page - Professional Enhancements
 * Theme: Ecolife (theme_ecolife)
 *
 * APPROACH: Subtle, professional styling that enhances the existing layout
 * without breaking structure. Focus on typography, spacing, and polish.
 *
 * @version   2.0.0
 * @date      2025-12-26
 */

/* ==========================================================================
   CSS Variables
   ========================================================================== */
:root {
    --pe-primary: #253237;
    --pe-accent: #4caf50;
    --pe-price: #B12704;
    --pe-text: #0F1111;
    --pe-text-secondary: #565959;
    --pe-link: #007185;
    --pe-border: #DDD;
    --pe-bg-light: #F7F7F7;
    --pe-white: #fff;
    --pe-shadow-sm: 0 1px 3px rgba(0,0,0,0.08);
    --pe-shadow: 0 2px 8px rgba(0,0,0,0.1);
    --pe-radius: 8px;
    --pe-radius-sm: 4px;
}

/* ==========================================================================
   Product Title - Clean and Prominent
   ========================================================================== */
h1.namne_details,
.product-container h1.h1 {
    font-size: 1.5rem;
    font-weight: 400;
    color: var(--pe-text);
    line-height: 1.35;
    margin-bottom: 8px;
}

/* ==========================================================================
   Product Prices - Amazon Style
   ========================================================================== */
.product-prices {
    margin: 12px 0 15px;
    padding: 0;
}

.current-price-value,
.product-price .current-price-value {
    font-size: 1.75rem;
    font-weight: 400;
    color: var(--pe-price);
}

.product-discount .regular-price {
    font-size: 0.9rem;
    color: var(--pe-text-secondary);
    text-decoration: line-through;
}

.has-discount .discount {
    display: inline-block;
    padding: 3px 8px;
    margin-left: 8px;
    font-size: 0.85rem;
    font-weight: 500;
    background: #CC0C39;
    color: var(--pe-white);
    border-radius: var(--pe-radius-sm);
}

.tax-shipping-delivery-label {
    font-size: 0.85rem;
    color: var(--pe-text-secondary);
    margin-top: 5px;
}

/* ==========================================================================
   Product Description
   ========================================================================== */
.product-description,
#product-description-short {
    font-size: 0.9rem;
    line-height: 1.6;
    color: var(--pe-text);
    margin-bottom: 15px;
}

.product-description ul {
    padding-left: 20px;
    margin: 10px 0;
}

.product-description li {
    margin-bottom: 5px;
}

/* ==========================================================================
   Product Variants - Clean Selectors
   ========================================================================== */
.product-variants {
    margin: 15px 0;
    padding: 15px 0;
    border-top: none;
}

.product-variants > .clearfix,
.product-variants-item {
    margin-bottom: 15px;
}

.product-variants .control-label {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--pe-text);
    margin-bottom: 8px;
    display: block;
}

/* Color swatches */
.color {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    border: 2px solid var(--pe-border);
    cursor: pointer;
    transition: all 0.15s ease;
}

.color:hover,
.input-color:checked + .color {
    border-color: var(--pe-primary);
    box-shadow: 0 0 0 2px var(--pe-white), 0 0 0 4px var(--pe-primary);
}

/* Select dropdowns */
.product-variants select {
    padding: 8px 30px 8px 12px;
    border: 1px solid var(--pe-border);
    border-radius: var(--pe-radius-sm);
    font-size: 0.9rem;
    background-color: var(--pe-white);
    min-width: 100px;
    cursor: pointer;
}

.product-variants select:focus {
    border-color: var(--pe-link);
    outline: none;
    box-shadow: 0 0 0 3px rgba(0,113,133,0.15);
}

/* Radio/Size buttons */
.radio-label {
    padding: 6px 14px;
    border: 1px solid var(--pe-border);
    border-radius: var(--pe-radius-sm);
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.15s ease;
}

.radio-label:hover {
    border-color: var(--pe-primary);
}

.input-radio:checked + .radio-label {
    border-color: var(--pe-primary);
    background: rgba(37,50,55,0.05);
}

/* ==========================================================================
   Add to Cart Section - Clean and Prominent
   ========================================================================== */
.product-add-to-cart {
    padding: 15px;
    background: var(--pe-bg-light);
    border-radius: var(--pe-radius);
    margin: 15px 0;
    border: 1px solid var(--pe-border);
}

.product-quantity {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

/* Quantity input */
.product-quantity .qty {
    display: inline-flex;
    align-items: center;
    border: 1px solid var(--pe-border);
    border-radius: var(--pe-radius-sm);
    background: var(--pe-white);
}

.product-quantity #quantity_wanted {
    width: 45px;
    height: 38px;
    text-align: center;
    border: none;
    font-size: 0.9rem;
    -moz-appearance: textfield;
}

.product-quantity #quantity_wanted::-webkit-outer-spin-button,
.product-quantity #quantity_wanted::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Quantity buttons */
.product-quantity .input-group-btn-vertical .btn,
.product-quantity .btn-touchspin {
    border: none;
    background: transparent;
    padding: 6px 10px;
}

/* Add to Cart Button */
.btn.add-to-cart {
    padding: 10px 20px;
    font-size: 0.9rem;
    font-weight: 500;
    border-radius: var(--pe-radius);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-width: 140px;
    transition: all 0.15s ease;
}

.btn.add-to-cart:hover {
    opacity: 0.9;
}

/* Buy Now Button */
.btn.buy-now {
    padding: 10px 20px;
    font-size: 0.9rem;
    font-weight: 500;
    border-radius: var(--pe-radius);
    background: var(--pe-primary);
    border-color: var(--pe-primary);
    color: var(--pe-white);
}

.btn.buy-now:hover {
    background: #1a2327;
}

/* ==========================================================================
   Product Availability
   ========================================================================== */
#product-availability {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 0.9rem;
    margin-top: 10px;
}

#product-availability .material-icons {
    font-size: 1.1rem;
}

.product-available {
    color: #067D62;
}

.product-unavailable {
    color: var(--pe-price);
}

/* ==========================================================================
   Product Images
   ========================================================================== */
.product-cover {
    border: 1px solid var(--pe-border);
    border-radius: var(--pe-radius);
    overflow: hidden;
    background: var(--pe-white);
}

.product-cover img {
    width: 100%;
    height: auto;
}

/* Thumbnails */
.product-images {
    margin-top: 10px;
}

.js-thumb,
.thumb-container {
    border: 2px solid transparent;
    border-radius: var(--pe-radius-sm);
    overflow: hidden;
    cursor: pointer;
    transition: border-color 0.15s ease;
}

.js-thumb:hover,
.js-thumb.selected,
.thumb-container:hover,
.thumb-container.selected {
    border-color: var(--pe-primary);
}

/* Product flags */
.product-flag {
    padding: 4px 10px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    border-radius: var(--pe-radius-sm);
}

/* ==========================================================================
   Product Tabs - Clean Design
   ========================================================================== */
.tabs,
#accordion {
    margin-top: 25px;
    border: 1px solid var(--pe-border);
    border-radius: var(--pe-radius);
    overflow: hidden;
    background: var(--pe-white);
}

.tabs .nav-tabs {
    background: var(--pe-bg-light);
    border-bottom: 1px solid var(--pe-border);
    padding: 0;
    margin: 0;
}

.tabs .nav-tabs .nav-item {
    margin-bottom: -1px;
}

.tabs .nav-tabs .nav-link {
    padding: 12px 18px;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--pe-text-secondary);
    border: none;
    border-bottom: 3px solid transparent;
    background: transparent;
    transition: all 0.15s ease;
}

.tabs .nav-tabs .nav-link:hover {
    color: var(--pe-text);
}

.tabs .nav-tabs .nav-link.active {
    color: var(--pe-text);
    background: var(--pe-white);
    border-bottom-color: var(--pe-primary);
}

.tabs .tab-content {
    padding: 20px;
}

/* Data sheet */
.data-sheet dt {
    padding: 10px 12px;
    background: var(--pe-bg-light);
    font-weight: 600;
    margin: 0;
}

.data-sheet dd {
    padding: 10px 12px;
    border-bottom: 1px solid var(--pe-border);
    margin: 0;
}

/* Accordion */
.accordion .card {
    border: none;
    border-bottom: 1px solid var(--pe-border);
    border-radius: 0;
}

.accordion .card:last-child {
    border-bottom: none;
}

.accordion .card-header {
    padding: 0;
    background: none;
    border: none;
}

.accordion .card-header a {
    display: block;
    padding: 12px 15px;
    font-weight: 600;
    color: var(--pe-text);
}

.accordion .card-body {
    padding: 15px;
}

/* ==========================================================================
   Star Ratings
   ========================================================================== */
.star-content,
.star-on,
.star-off,
.star-full {
    color: #DE7921;
}

/* ==========================================================================
   Social Sharing
   ========================================================================== */
.social-sharing {
    margin-top: 0;
    padding-top: 0;
    border-top: none;
}

.social-sharing span {
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--pe-text);
    margin-right: 10px;
}

.social-sharing a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--pe-bg-light);
    color: var(--pe-text-secondary);
    margin-right: 5px;
    transition: all 0.15s ease;
}

.social-sharing a:hover {
    background: var(--pe-primary);
    color: var(--pe-white);
}

/* ==========================================================================
   Hide Customer Reassurance on Product Page (shows policy placeholders)
   ========================================================================== */
.product-container .block-reassurance,
#main[itemscope] .block-reassurance,
.blockreassurance_product,
.block-reassurance {
    display: none !important;
}

/* ==========================================================================
   Product Additional Sections (Two-Column Layout)
   ========================================================================== */
.product-additional-sections {
    margin-top: 30px;
    padding-top: 30px;
    border-top: none;
}

/* Documents Section */
.product-documents-section {
    margin-bottom: 25px;
}

.product-documents-section .kbpd-documents,
.product-documents-section .documents-block {
    background: var(--pe-white);
    border: 1px solid var(--pe-border);
    border-radius: var(--pe-radius);
    padding: 20px;
}

.product-documents-section .kbpd-title {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--pe-text);
    margin-bottom: 15px;
}

/* FBT Section */
.product-fbt-section {
    margin-bottom: 25px;
}

.product-fbt-section .kbfbt-block {
    background: var(--pe-white);
    border: 1px solid var(--pe-border);
    border-radius: var(--pe-radius);
    padding: 20px;
}

.product-fbt-section .kbfbt-title {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--pe-text);
    margin-bottom: 15px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--pe-primary);
    display: inline-block;
}

/* Action Buttons Section */
.product-action-buttons {
    margin-top: 15px;
    padding: 15px;
    background: var(--pe-bg-light);
    border-radius: var(--pe-radius);
    border: 1px solid var(--pe-border);
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
}

.product-action-buttons:empty {
    display: none;
}

/* Social Sharing Section */
.product-social-sharing {
    margin: 0;
    padding: 0;
    border: none;
}

/* Product Details Section */
.product-details-section {
    margin-top: 30px;
}

/* Customer Reviews Section (Amazon-style) */
.product-reviews-section {
    margin-top: 30px;
    padding: 25px 0;
    border-top: none;
}

.product-reviews-section .posproductcomments-reviews,
.product-reviews-section .reviews-block {
    background: var(--pe-white);
    border: 1px solid var(--pe-border);
    border-radius: var(--pe-radius);
    padding: 25px;
}

.product-reviews-section h2,
.product-reviews-section .reviews-title {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--pe-text);
    margin-bottom: 20px;
}

/* Star ratings in reviews */
.product-reviews-section .star-content {
    color: #DE7921;
}

/* Review summary bar (like Amazon) */
.product-reviews-section .review-summary {
    display: flex;
    gap: 30px;
    margin-bottom: 25px;
    padding-bottom: 25px;
    border-bottom: 1px solid var(--pe-border);
}

.product-reviews-section .review-summary-left {
    flex: 0 0 200px;
}

.product-reviews-section .review-summary-right {
    flex: 1;
}

/* Individual reviews */
.product-reviews-section .review-item {
    padding: 20px 0;
    border-bottom: 1px solid var(--pe-border);
}

.product-reviews-section .review-item:last-child {
    border-bottom: none;
}

.product-reviews-section .review-author {
    font-weight: 600;
    color: var(--pe-text);
    margin-bottom: 5px;
}

.product-reviews-section .review-date {
    font-size: 0.85rem;
    color: var(--pe-text-secondary);
}

.product-reviews-section .review-content {
    margin-top: 10px;
    line-height: 1.6;
}

/* Write review button */
.product-reviews-section .btn-write-review {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    background: var(--pe-primary);
    color: var(--pe-white);
    border: none;
    border-radius: var(--pe-radius);
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s ease;
}

.product-reviews-section .btn-write-review:hover {
    background: #1a2327;
}

/* ==========================================================================
   Footer Product Content - Related Products, Videos etc
   ========================================================================== */
.products-section-title,
.featured-products .section-title,
.section-title {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--pe-text);
    margin-bottom: 15px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--pe-primary);
    display: inline-block;
}

/* Product cards in carousels */
.product-miniature {
    border: 1px solid var(--pe-border);
    border-radius: var(--pe-radius);
    padding: 10px;
    background: var(--pe-white);
    transition: box-shadow 0.15s ease;
}

.product-miniature:hover {
    box-shadow: var(--pe-shadow);
}

.product-miniature .product-title a {
    font-size: 0.9rem;
    color: var(--pe-text);
    font-weight: 400;
}

.product-miniature .product-title a:hover {
    color: var(--pe-link);
}

.product-miniature .price {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--pe-price);
}

/* ==========================================================================
   KB Module Styling - FBT, Cross Selling, Video
   ========================================================================== */

/* KB Frequently Bought Together */
.kbfbt-block {
    background: var(--pe-bg-light);
    border-radius: var(--pe-radius);
    padding: 20px;
    margin: 20px 0;
    border: 1px solid var(--pe-border);
}

.kbfbt-title {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--pe-text);
    margin-bottom: 15px;
}

/* KB Cross Selling - Full Width Display (via displayFooterProduct hook) */
.kbcs-block {
    margin: 0 0 20px 0;
    padding: 30px 0;
    background: var(--pe-bg-light);
    border: none;
    border-top: 1px solid var(--pe-border);
    border-bottom: 1px solid var(--pe-border);
    border-radius: 0;
}

/* Constrain content width while keeping background full */
.kbcs-block .kbcs-block-header,
.kbcs-block .kbcs-block-content {
    max-width: 100%;
    padding: 0 15px;
}

.kbcs-block-title,
.kbcs-block-header h2 {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--pe-text);
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--pe-primary);
    display: inline-block;
}

.kbcs-block-header {
    margin-bottom: 15px;
}

/* Carousel styling */
.kbcs-carousel-wrapper {
    position: relative;
    padding: 0 50px;
}

.kbcs-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 40px;
    height: 40px;
    border: 1px solid var(--pe-border);
    border-radius: 50%;
    background: var(--pe-white);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
    transition: all 0.15s ease;
    box-shadow: var(--pe-shadow-sm);
}

.kbcs-nav:hover {
    background: var(--pe-primary);
    color: var(--pe-white);
    border-color: var(--pe-primary);
}

.kbcs-nav-prev {
    left: 5px;
}

.kbcs-nav-next {
    right: 5px;
}

.kbcs-carousel {
    overflow: hidden;
}

.kbcs-carousel-track {
    display: flex;
    gap: 12px;
    transition: transform 0.3s ease;
}

/* 5 products per row on desktop */
.kbcs-carousel-track .product-miniature {
    flex: 0 0 calc(20% - 10px);
    min-width: 180px;
}

@media (max-width: 1200px) {
    .kbcs-carousel-track .product-miniature {
        flex: 0 0 calc(25% - 9px);
    }
}

@media (max-width: 991px) {
    .kbcs-carousel-track .product-miniature {
        flex: 0 0 calc(33.333% - 8px);
    }
}

@media (max-width: 767px) {
    .kbcs-carousel-track .product-miniature {
        flex: 0 0 calc(50% - 6px);
    }

    .kbcs-carousel-wrapper {
        padding: 0 35px;
    }
}

/* Hide the reassurance block with placeholder text on product pages */
#main[itemscope] .block-reassurance,
.product-container .block-reassurance {
    display: none !important;
}

/* KB Product Videos */
.kbpv-product-videos {
    margin: 20px 0;
    background: var(--pe-white);
    border-radius: var(--pe-radius);
    padding: 20px;
    border: 1px solid var(--pe-border);
}

.kbpv-title {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--pe-text);
    margin-bottom: 15px;
}

.kbpv-video-container {
    border-radius: var(--pe-radius);
    overflow: hidden;
}

/* ==========================================================================
   Product Action Buttons (Compare, Price Alert, Shipping Calc, Ask)
   ========================================================================== */
.product-additional-info,
.js-product-additional-info {
    margin-top: 15px;
    padding-top: 15px;
    border-top: 1px solid var(--pe-border);
}

/* Style all action buttons consistently */
.product-additional-info > div,
.js-product-additional-info > div {
    margin-bottom: 10px;
}

/* KB Product Compare Button */
.kbpc-compare-button-container {
    display: inline-block;
    margin-right: 10px;
    margin-bottom: 8px;
}

.kbpc-compare-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    font-size: 0.85rem;
    border: 1px solid var(--pe-border);
    border-radius: var(--pe-radius-sm);
    background: var(--pe-white) !important;
    color: var(--pe-text) !important;
    cursor: pointer;
    transition: all 0.15s ease;
}

.kbpc-compare-btn:hover {
    border-color: var(--pe-primary);
    background: var(--pe-bg-light) !important;
}

.kbpc-compare-btn.kbpc-in-list {
    border-color: var(--pe-accent);
    background: rgba(76, 175, 80, 0.1) !important;
}

.kbpc-compare-btn .material-icons {
    font-size: 1.1rem;
}

/* KB Price Alert Button */
.kbpa-price-alert-block {
    display: inline-block;
    margin-right: 10px;
    margin-bottom: 8px;
}

.kbpa-trigger-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    font-size: 0.85rem;
    border: 1px solid var(--pe-border);
    border-radius: var(--pe-radius-sm);
    background: var(--pe-white);
    color: var(--pe-text);
    text-decoration: none;
    cursor: pointer;
    transition: all 0.15s ease;
}

.kbpa-trigger-link:hover {
    border-color: var(--pe-primary);
    background: var(--pe-bg-light);
    color: var(--pe-text);
    text-decoration: none;
}

.kbpa-trigger-link .material-icons {
    font-size: 1.1rem;
}

/* KB Shipping Calculator Button */
.kbsc-wrapper {
    display: inline-block;
    margin-right: 10px;
    margin-bottom: 8px;
}

.kbsc-estimate-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    font-size: 0.85rem;
    border: 1px solid var(--pe-border) !important;
    border-radius: var(--pe-radius-sm);
    background: var(--pe-white) !important;
    color: var(--pe-text) !important;
    cursor: pointer;
    transition: all 0.15s ease;
}

.kbsc-estimate-btn:hover {
    border-color: var(--pe-primary) !important;
    background: var(--pe-bg-light) !important;
}

.kbsc-estimate-btn .material-icons {
    font-size: 1.1rem;
}

/* KB Form Builder (Ask About Product) */
.kbfb-widget {
    display: inline-block;
    margin-right: 10px;
    margin-bottom: 8px;
}

.kbfb-widget .btn,
.kbfb-widget button {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    font-size: 0.85rem;
    border: 1px solid var(--pe-border);
    border-radius: var(--pe-radius-sm);
    background: var(--pe-white);
    color: var(--pe-text);
    cursor: pointer;
    transition: all 0.15s ease;
}

.kbfb-widget .btn:hover,
.kbfb-widget button:hover {
    border-color: var(--pe-primary);
    background: var(--pe-bg-light);
}

/* Group all action buttons in a flex container */
.product-additional-info {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0;
}

/* ==========================================================================
   Seller Info - Professional Box Design
   ========================================================================== */
#kbmp-seller-info {
    margin: 15px 0;
    padding: 15px;
    background: var(--pe-bg-light);
    border: 1px solid var(--pe-border);
    border-radius: var(--pe-radius);
}

/* Row styling */
#kbmp-seller-info .seller-info-row {
    font-size: 0.9rem;
    margin-bottom: 10px;
    line-height: 1.5;
}

#kbmp-seller-info .seller-info-row:last-child {
    margin-bottom: 0;
}

/* Sold By row */
#kbmp-seller-info .seller-name-row {
    font-size: 0.95rem;
}

#kbmp-seller-info .seller-label {
    color: var(--pe-text-secondary);
    font-weight: 500;
    margin-right: 5px;
}

#kbmp-seller-info .seller-link {
    color: var(--pe-link);
    text-decoration: none;
    font-weight: 600;
}

#kbmp-seller-info .seller-link:hover {
    text-decoration: underline;
    color: #C7511F;
}

/* Rating row */
#kbmp-seller-info .seller-rating-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

#kbmp-seller-info .seller-rating-link {
    display: inline-flex;
    align-items: center;
}

#kbmp-seller-info .vss_seller_ratings {
    font-size: 16px;
    position: relative;
    display: inline-block;
    color: #d3d3d3;
    line-height: 1;
}

#kbmp-seller-info .vss_rating_unfilled {
    color: #d3d3d3;
}

#kbmp-seller-info .vss_rating_filled {
    position: absolute;
    top: 0;
    left: 0;
    color: #e9ce18;
    overflow: hidden;
    white-space: nowrap;
}

#kbmp-seller-info .seller-review-links {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

#kbmp-seller-info .review-link {
    color: var(--pe-link);
    text-decoration: none;
    font-size: 0.85rem;
}

#kbmp-seller-info .review-link:hover {
    text-decoration: underline;
    color: #C7511F;
}

#kbmp-seller-info .separator {
    color: var(--pe-text-secondary);
}

/* View products row */
#kbmp-seller-info .view-products-link {
    color: var(--pe-link);
    text-decoration: none;
    font-size: 0.9rem;
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

#kbmp-seller-info .view-products-link:hover {
    text-decoration: underline;
    color: #C7511F;
}

#kbmp-seller-info .view-products-link .material-icons {
    font-size: 18px;
    color: var(--pe-text-secondary);
}

/* Favorite seller row */
#kbmp-seller-info .favorite-seller-link {
    color: var(--pe-link);
    text-decoration: none;
    font-size: 0.9rem;
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

#kbmp-seller-info .favorite-seller-link:hover {
    text-decoration: underline;
}

#kbmp-seller-info .shortlist_link {
    cursor: pointer;
    font-size: 18px;
}

/* ==========================================================================
   Payment Guarantee Box (posstaticblocks)
   ========================================================================== */
/* Style the payment guarantee box that appears via displayReassurance */
.product-information .pos-staticblock,
.product-information .payment-guarantee,
.product-information > div:has(img[src*="skrill"]),
.product-information > div:has(img[src*="paypal"]),
.product-information > div:has(img[src*="visa"]) {
    margin: 15px 0;
    padding: 15px;
    background: var(--pe-bg-light);
    border: 1px solid var(--pe-border);
    border-radius: var(--pe-radius);
    text-align: center;
}

/* Target payment icons container styling */
.product-information > div[style*="text-align: center"],
.product-information > div[style*="text-align:center"] {
    margin: 15px 0;
    padding: 15px;
    background: var(--pe-bg-light);
    border: 1px solid var(--pe-border);
    border-radius: var(--pe-radius);
}

/* Ensure payment icons are reasonably sized */
.product-information img[src*="skrill"],
.product-information img[src*="paypal"],
.product-information img[src*="visa"],
.product-information img[src*="mastercard"],
.product-information img[src*="bitcoin"] {
    max-height: 30px;
    width: auto;
    margin: 0 5px;
}

/* ==========================================================================
   Mobile Responsive
   ========================================================================== */
@media (max-width: 991px) {
    h1.namne_details,
    .product-container h1.h1 {
        font-size: 1.35rem;
        margin-top: 15px;
    }

    .current-price-value {
        font-size: 1.5rem;
    }

    .product-quantity {
        flex-direction: column;
        align-items: stretch;
    }

    .product-quantity .qty,
    .product-quantity .add,
    .product-quantity .buy {
        width: 100%;
    }

    .product-quantity .qty {
        justify-content: center;
        margin-bottom: 10px;
    }
}

@media (max-width: 767px) {
    h1.namne_details,
    .product-container h1.h1 {
        font-size: 1.2rem;
    }

    .current-price-value {
        font-size: 1.4rem;
    }

    .tabs .nav-tabs {
        overflow-x: auto;
        flex-wrap: nowrap;
        -webkit-overflow-scrolling: touch;
    }

    .tabs .nav-tabs .nav-link {
        white-space: nowrap;
        padding: 10px 14px;
    }

    .tabs .tab-content {
        padding: 15px;
    }

    .product-add-to-cart {
        padding: 12px;
    }
}

/* ==========================================================================
   Product Page Layout Fixes (2025-12-27)
   ========================================================================== */

/* 1. Reduce top space on product page */
#product .page-title-wrapper {
    padding: 15px 0 10px !important;
}

/* 2. Hide empty sections that have no visible content */
.product-videos-section:empty,
.product-reviews-section:empty,
.product-documents-section:empty,
.product-fbt-section:empty {
    display: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* 3. Hide empty gray boxes at bottom */
.product-crossselling-section:empty {
    display: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* 4. Remove all separator lines on product page for cleaner look */
#product .product-information > *,
#product .product-actions,
#product .product-add-to-cart,
#product .product-action-buttons,
#product .product-social-sharing,
#product .product-variants,
#product .social-sharing,
#product .product-additional-info,
#product .js-product-additional-info {
    border-top: none !important;
    border-bottom: none !important;
}

/* Remove horizontal lines from product description area - override theme.css */
#product .product-description,
#product #product-description-short,
#product .product-information .product-description,
.product-information .product-description,
.product-layout1 .product-information .product-description,
.product-container .product-information .product-description {
    border: none !important;
    border-bottom: none !important;
    margin-bottom: 10px !important;
}

/* Remove border from product-desc */
.product-information .product-desc {
    border: none !important;
}

/* ==========================================================================
   Social Sharing & Reassurance - Same line layout
   ========================================================================== */

/* Flex row container for social + reassurance */
.product-social-reassurance-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
    margin-top: 15px;
    padding-top: 15px;
    border-top: 1px solid var(--pe-border);
}

.product-social-reassurance-row .product-social-sharing {
    flex: 0 0 auto;
    margin: 0;
    padding: 0;
}

.product-social-reassurance-row .product-reassurance-inline {
    flex: 0 0 auto;
}

/* Mobile: Stack vertically */
@media (max-width: 767px) {
    .product-social-reassurance-row {
        flex-direction: column;
        align-items: flex-start;
    }

    .product-social-reassurance-row .product-reassurance-inline {
        width: 100%;
    }
}

/* ==========================================================================
   Blockreassurance - Single line inline layout
   ========================================================================== */

/* New inline layout */
.blockreassurance-inline {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin: 0;
    padding: 0;
}

.blockreassurance-inline .reassurance-item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    background: var(--pe-bg-light);
    border-radius: var(--pe-radius-sm);
    text-decoration: none;
    color: var(--pe-text);
    font-size: 0.85rem;
    font-weight: 500;
    transition: all 0.2s ease;
}

.blockreassurance-inline a.reassurance-item:hover {
    background: var(--pe-primary);
    color: var(--pe-white);
}

.blockreassurance-inline .reassurance-icon {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
}

.blockreassurance-inline .reassurance-text {
    white-space: nowrap;
}

/* Hide old blockreassurance structures */
#block-reassurance,
.blockreassurance_product {
    display: none !important;
}

/* ==========================================================================
   Seller Products Cross-Sell Section
   ========================================================================== */

/* Container styling - matches kbcs-block */
.kbmp-seller-crosssell {
    margin-bottom: 30px;
    background: var(--pe-white);
    border-radius: var(--pe-radius);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

/* Header with View All link */
.kbmp-seller-crosssell .kbcs-block-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 20px;
    border-bottom: 1px solid var(--pe-border);
    background: var(--pe-bg-light);
}

.kbmp-seller-crosssell .kbcs-block-title {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--pe-heading);
}

.kbmp-view-all-link {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: var(--pe-primary);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
    transition: all 0.2s ease;
}

.kbmp-view-all-link:hover {
    color: var(--pe-primary-dark, #004d26);
    text-decoration: none;
}

.kbmp-view-all-link .material-icons {
    font-size: 1rem;
    transition: transform 0.2s ease;
}

.kbmp-view-all-link:hover .material-icons {
    transform: translateX(3px);
}

/* Content area */
.kbmp-seller-crosssell .kbcs-block-content {
    padding: 20px;
}

/* Carousel navigation arrows */
.kbmp-seller-crosssell .kbcs-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 36px;
    height: 36px;
    background: var(--pe-white);
    border: 1px solid var(--pe-border);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 10;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.kbmp-seller-crosssell .kbcs-nav:hover {
    background: var(--pe-primary);
    border-color: var(--pe-primary);
    color: var(--pe-white);
}

.kbmp-seller-crosssell .kbcs-nav-prev {
    left: -18px;
}

.kbmp-seller-crosssell .kbcs-nav-next {
    right: -18px;
}

.kbmp-seller-crosssell .kbcs-nav .material-icons {
    font-size: 20px;
}

/* Carousel track */
.kbmp-seller-crosssell .kbcs-carousel-wrapper {
    position: relative;
    padding: 0 20px;
}

.kbmp-seller-crosssell .kbcs-carousel {
    overflow: hidden;
}

.kbmp-seller-crosssell .kbcs-carousel-track {
    display: flex;
    gap: 15px;
    transition: transform 0.3s ease;
}

/* Product items */
.kbmp-seller-crosssell .kbcs-product-item {
    flex: 0 0 calc(25% - 12px);
    min-width: 200px;
}

.kbmp-seller-crosssell .kbcs-product-miniature {
    background: var(--pe-white);
    border: 1px solid var(--pe-border);
    border-radius: var(--pe-radius);
    overflow: hidden;
    transition: all 0.2s ease;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.kbmp-seller-crosssell .kbcs-product-miniature:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
    transform: translateY(-2px);
}

/* Product thumbnail */
.kbmp-seller-crosssell .kbcs-product-thumbnail {
    position: relative;
    padding-top: 100%;
    overflow: hidden;
}

.kbmp-seller-crosssell .kbcs-product-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    transition: transform 0.3s ease;
}

.kbmp-seller-crosssell .kbcs-product-miniature:hover .kbcs-product-image {
    transform: scale(1.05);
}

/* Product info */
.kbmp-seller-crosssell .kbcs-product-info {
    padding: 12px;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

.kbmp-seller-crosssell .kbcs-product-title {
    margin: 0 0 8px 0;
    font-size: 0.9rem;
    line-height: 1.4;
}

.kbmp-seller-crosssell .kbcs-product-title a {
    color: var(--pe-heading);
    text-decoration: none;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.kbmp-seller-crosssell .kbcs-product-title a:hover {
    color: var(--pe-primary);
}

/* Price */
.kbmp-seller-crosssell .kbcs-product-price-wrapper {
    margin-top: auto;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.kbmp-seller-crosssell .kbcs-product-price {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--pe-primary);
}

.kbmp-seller-crosssell .kbcs-product-price-regular {
    font-size: 0.85rem;
    color: var(--pe-text-muted);
    text-decoration: line-through;
}

/* Discount badge */
.kbmp-seller-crosssell .kbcs-discount-badge {
    position: absolute;
    top: 10px;
    right: 10px;
    background: #dc3545;
    color: #fff;
    font-size: 0.75rem;
    font-weight: 700;
    padding: 3px 8px;
    border-radius: 3px;
    z-index: 5;
}

/* Product flags */
.kbmp-seller-crosssell .kbcs-product-flags {
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 5;
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.kbmp-seller-crosssell .kbcs-flag {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    padding: 2px 6px;
    border-radius: 3px;
    background: var(--pe-primary);
    color: #fff;
}

.kbmp-seller-crosssell .kbcs-flag-discount {
    background: #dc3545;
}

.kbmp-seller-crosssell .kbcs-flag-new {
    background: #28a745;
}

/* Product actions */
.kbmp-seller-crosssell .kbcs-product-actions {
    padding: 10px 12px;
    border-top: 1px solid var(--pe-border);
    display: flex;
    gap: 8px;
}

.kbmp-seller-crosssell .kbcs-btn {
    flex: 1;
    padding: 8px 12px;
    border: none;
    border-radius: var(--pe-radius-sm);
    font-size: 0.85rem;
    font-weight: 500;
    text-decoration: none;
    text-align: center;
    cursor: pointer;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.kbmp-seller-crosssell .kbcs-btn-view {
    background: var(--pe-primary);
    color: #fff;
}

.kbmp-seller-crosssell .kbcs-btn-view:hover {
    background: var(--pe-primary-dark, #004d26);
    color: #fff;
}

.kbmp-seller-crosssell .kbcs-btn-cart {
    flex: 0 0 auto;
    padding: 8px 10px;
    background: var(--pe-bg-light);
    color: var(--pe-text);
    border: 1px solid var(--pe-border);
}

.kbmp-seller-crosssell .kbcs-btn-cart:hover {
    background: var(--pe-primary);
    color: #fff;
    border-color: var(--pe-primary);
}

.kbmp-seller-crosssell .kbcs-btn-cart .material-icons {
    font-size: 1rem;
}

/* Responsive */
@media (max-width: 1199px) {
    .kbmp-seller-crosssell .kbcs-product-item {
        flex: 0 0 calc(33.333% - 10px);
    }
}

@media (max-width: 991px) {
    .kbmp-seller-crosssell .kbcs-product-item {
        flex: 0 0 calc(50% - 8px);
    }

    .kbmp-seller-crosssell .kbcs-nav {
        display: none;
    }

    .kbmp-seller-crosssell .kbcs-carousel-wrapper {
        padding: 0;
    }

    .kbmp-seller-crosssell .kbcs-carousel {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .kbmp-seller-crosssell .kbcs-carousel::-webkit-scrollbar {
        display: none;
    }
}

@media (max-width: 575px) {
    .kbmp-seller-crosssell .kbcs-product-item {
        flex: 0 0 calc(100% - 0px);
        min-width: 160px;
    }

    .kbmp-seller-crosssell .kbcs-block-header {
        flex-direction: column;
        gap: 10px;
        align-items: flex-start;
    }
}

/* ==========================================================================
   Seller Info in Product Listings
   ========================================================================== */

/* Seller info display in product grid/list */
.kb-product-seller-info {
    font-size: 12px !important;
    color: #666 !important;
    margin: 5px 0 10px !important;
    padding: 0 !important;
    display: block !important;
    line-height: 1.4;
    position: relative;
    z-index: 10;
}

.kb-product-seller-info span {
    color: #999;
}

.kb-product-seller-info a {
    color: #2fb5d2 !important;
    text-decoration: none !important;
    font-weight: 500;
}

.kb-product-seller-info a:hover {
    text-decoration: underline !important;
    color: #007185 !important;
}

/* Compact product cards - remove excess padding */
.js-product-miniature .inner_desc {
    padding-bottom: 10px !important;
}

/* Uniform card heights in grid */
.js-product-miniature {
    display: flex;
    flex-direction: column;
}

.js-product-miniature .thumbnail-container {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.js-product-miniature .inner_desc {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

/* Push price and buttons to bottom */
.js-product-miniature .product-price-and-shipping {
    margin-top: auto !important;
}

/* ==========================================================================
   Product sidebar polish (2026-04-22) — payment card, rating chip,
   action-button row, share/policy row
   ========================================================================== */

/* Spacing rhythm between blocks under the Buy Now button */
.product-information #kbmp-seller-info,
.product-information .payment-detail,
.product-information .kb-product-rating-summary,
.product-information .product-action-buttons,
.product-information .product-social-reassurance-row {
    margin: 14px 0 0;
}

/* -- Payment / Guarantee card (posstaticblocks payment-detail) ----------- */
.product-information .payment-detail {
    padding: 16px 18px;
    background: var(--pe-white);
    border: 1px solid var(--pe-border);
    border-radius: var(--pe-radius);
    text-align: center;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
}

.product-information .payment-detail img {
    max-height: 26px;
    width: auto;
    margin: 0 4px;
    vertical-align: middle;
    filter: saturate(0.95);
    opacity: 0.95;
}

.product-information .payment-detail p {
    margin: 10px 0 0;
    font-size: 0.8rem;
    font-weight: 500;
    color: var(--pe-text-secondary);
    letter-spacing: 0.2px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.product-information .payment-detail p::before {
    content: "\e32a"; /* material-icons "lock" */
    font-family: "Material Icons";
    font-size: 1rem;
    color: var(--pe-accent, #4CAF50);
}

/* -- Rating summary chip ------------------------------------------------- */
.product-information .kb-product-rating-summary {
    padding: 10px 14px;
    background: var(--pe-bg-light);
    border: 1px solid var(--pe-border);
    border-radius: var(--pe-radius-sm);
    display: inline-flex;
    width: auto;
}

.product-information .kb-product-rating-summary .kb-rating-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--pe-text);
    text-decoration: none;
    font-size: 0.9rem;
}

.product-information .kb-product-rating-summary .kb-rating-link:hover {
    color: var(--pe-primary);
}

.product-information .kb-product-rating-summary .kb-stars {
    display: inline-flex;
    gap: 1px;
    color: #f5a623;
}

.product-information .kb-product-rating-summary .kb-stars .material-icons {
    font-size: 1.1rem;
    line-height: 1;
}

.product-information .kb-product-rating-summary .kb-rating-text {
    color: var(--pe-text-secondary);
    font-weight: 500;
}

/* -- Action buttons row (Compare / Price Alert / Estimate Shipping) ------ */
.product-information .product-action-buttons {
    padding: 10px;
    background: var(--pe-white);
    border: 1px solid var(--pe-border);
    border-radius: var(--pe-radius);
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.product-information .product-action-buttons > * {
    flex: 1 1 0;
    margin: 0;
    min-width: 140px;
}

.product-information .product-action-buttons .kbpc-compare-btn,
.product-information .product-action-buttons .kbpa-trigger-link,
.product-information .product-action-buttons .kbsc-estimate-btn {
    width: 100%;
    justify-content: center;
    padding: 10px 12px;
    font-weight: 500;
    text-transform: none;
    letter-spacing: 0;
}

/* -- Share + policies row (bottom) --------------------------------------- */
.product-information .product-social-reassurance-row {
    padding: 12px 14px;
    background: var(--pe-bg-light);
    border: 1px solid var(--pe-border);
    border-radius: var(--pe-radius);
    border-top: 1px solid var(--pe-border);
}

/* Override the older border-top-only rule that lives above in this file */
.product-information .product-social-reassurance-row.product-social-reassurance-row {
    margin-top: 14px;
}

/* Tighten share icons so the row reads as one element */
.product-information .product-social-reassurance-row .social-sharing {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 0;
}

.product-information .product-social-reassurance-row .social-sharing span {
    margin-right: 6px;
}

.product-information .product-social-reassurance-row .social-sharing ul {
    display: inline-flex;
    gap: 4px;
    margin: 0;
    padding: 0;
    list-style: none;
}

@media (max-width: 767px) {
    .product-information .product-action-buttons > * {
        flex: 1 1 100%;
        min-width: 0;
    }
}