/* Custom CSS - Removed social icons, reassurance blocks, and product details tab */
/* Applied by Claude Code on 2025-11-25 */

/* Hide social sharing section */
.social-sharing,
.social-icon,
.product-additional-info {
    display: none !important;
}

/* Hide reassurance blocks */
.displayReassurance,
[data-hook="displayReassurance"] {
    display: none !important;
}

/* Hide left sticky social icons */
.block-social.tv-footer-social-icon {
    display: none !important;
}

/* Hide empty tax-shipping-delivery-label if only return policy was there */
.tax-shipping-delivery-label:empty {
    display: none !important;
}

/* Remove return policy text */
.tax-shipping-delivery-label {
    font-size: 0;
}

.tax-shipping-delivery-label span {
    font-size: 14px;
}

/* Adjust spacing after removing elements */
.tvproduct-stock-social {
    margin-bottom: 15px;
}

.product-add-to-cart {
    margin-top: 20px;
}

/* Remove extra padding/margin from product info section */
.product-information {
    padding-bottom: 0;
}

/* Clean up product page layout after removing tabs */
.tvproduct-description-tab .nav-tabs {
    margin-bottom: 20px;
}

/* Improve spacing around product content */
.tvproduct-page-wrapper {
    padding-top: 20px;
}

/* ========================================
   PRODUCT IMAGE MODAL - LARGER SIZE (80%)
   ======================================== */

/* Enlarge product image modal to 80% of screen */
#product-modal .modal-dialog,
.js-product-images-modal .modal-dialog,
.modal.fade.js-product-images-modal .modal-dialog {
    max-width: 80% !important;
    width: 80% !important;
    margin: 2rem auto !important;
}

/* Ensure modal content scales properly */
#product-modal .modal-content,
.js-product-images-modal .modal-content {
    max-height: 90vh !important;
    overflow-y: auto !important;
}

/* Make the image larger within modal */
#product-modal .modal-body,
.js-product-images-modal .modal-body {
    padding: 20px !important;
    text-align: center !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
}

#product-modal .product-cover-modal,
.js-product-images-modal .product-cover-modal {
    max-width: 100% !important;
    width: auto !important;
    height: auto !important;
    max-height: 70vh !important;
    object-fit: contain !important;
    margin: 0 auto !important;
    display: block !important;
}

/* Adjust figure to center image */
#product-modal figure,
.js-product-images-modal figure {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 auto !important;
    width: 100% !important;
    text-align: center !important;
}

/* Responsive adjustments */
@media (max-width: 991px) {
    #product-modal .modal-dialog,
    .js-product-images-modal .modal-dialog {
        max-width: 95% !important;
        width: 95% !important;
        margin: 1rem auto !important;
    }
}

@media (max-width: 767px) {
    #product-modal .modal-dialog,
    .js-product-images-modal .modal-dialog {
        max-width: 98% !important;
        width: 98% !important;
        margin: 0.5rem auto !important;
    }

    #product-modal .product-cover-modal,
    .js-product-images-modal .product-cover-modal {
        max-height: 60vh !important;
    }
}

/* ========================================
   PRODUCT IMAGE ZOOM - ELEGANT OVERLAY
   ======================================== */

/* Container for product image */
.tvproduct-image-slider {
    position: relative !important;
    overflow: hidden !important;
}

/* Make entire image clickable */
.product-image-clickable {
    cursor: zoom-in !important;
    transition: transform 0.3s ease !important;
}

/* Zoom overlay - hidden by default */
.zoom-overlay {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background: rgba(0, 0, 0, 0) !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    opacity: 0 !important;
    transition: all 0.3s ease !important;
    cursor: zoom-in !important;
    z-index: 10 !important;
}

/* Hover effect on image container */
.tvproduct-image-slider:hover .product-image-clickable {
    transform: scale(1.02) !important;
}

/* Show overlay on hover */
.tvproduct-image-slider:hover .zoom-overlay {
    opacity: 1 !important;
    background: rgba(0, 0, 0, 0.4) !important;
}

/* Zoom icon styling */
.zoom-icon {
    font-size: 64px !important;
    color: #fff !important;
    text-shadow: 0 2px 8px rgba(0,0,0,0.5) !important;
    margin-bottom: 10px !important;
    animation: pulseZoom 2s ease-in-out infinite !important;
}

/* Zoom text */
.zoom-text {
    color: #fff !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    text-shadow: 0 2px 4px rgba(0,0,0,0.5) !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
}

/* Pulse animation for zoom icon */
@keyframes pulseZoom {
    0%, 100% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.1);
    }
}

/* Remove old layer styling if exists */
.layer:not(.zoom-overlay) {
    display: none !important;
}

/* Mobile adjustments */
@media (max-width: 767px) {
    .zoom-icon {
        font-size: 48px !important;
    }

    .zoom-text {
        font-size: 14px !important;
    }
}

/* ========================================
   FOOTER CATEGORIES - EXPANDABLE SUBCATEGORIES
   ======================================== */

/* Main category item with subcategories */
.tvfooter-category-item {
    position: relative !important;
    margin-bottom: 8px !important;
}

.tvfooter-category-item.has-subcategories {
    margin-bottom: 12px !important;
}

/* Category main container */
.tvfooter-category-main {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    position: relative !important;
}

.tvfooter-category-main a {
    flex: 1 !important;
}

/* Subcategory toggle button */
.tvfooter-subcategory-toggle {
    cursor: pointer !important;
    padding: 4px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.3s ease !important;
    border-radius: 4px !important;
    margin-left: auto !important;
}

.tvfooter-subcategory-toggle:hover {
    background: rgba(0, 0, 0, 0.1) !important;
}

.tvfooter-subcategory-toggle .toggle-icon {
    font-size: 20px !important;
    transition: transform 0.3s ease !important;
}

/* Subcategories list */
.tvfooter-subcategories {
    list-style: none !important;
    padding: 8px 0 0 24px !important;
    margin: 8px 0 0 0 !important;
    border-left: 2px solid rgba(0, 0, 0, 0.1) !important;
    animation: slideDown 0.3s ease-out !important;
}

.tvfooter-subcategory-item {
    margin-bottom: 6px !important;
    padding-left: 4px !important;
}

.tvfooter-subcategory-item a {
    font-size: 13px !important;
    opacity: 0.9 !important;
    transition: opacity 0.2s ease !important;
}

.tvfooter-subcategory-item a:hover {
    opacity: 1 !important;
    text-decoration: underline !important;
}

.tvfooter-subcategory-item .material-icons {
    font-size: 14px !important;
    opacity: 0.6 !important;
}

/* Slide down animation for subcategories */
@keyframes slideDown {
    from {
        opacity: 0;
        max-height: 0;
    }
    to {
        opacity: 1;
        max-height: 500px;
    }
}

/* Responsive adjustments for footer categories */
@media (max-width: 767px) {
    .tvfooter-subcategories {
        padding-left: 16px !important;
    }

    .tvfooter-subcategory-item a {
        font-size: 12px !important;
    }
}

/* PS9 staging fix: hide page loader overlay (fancybox missing breaks tvcms init) */
.tvcms-loading-overlay { display: none !important; visibility: hidden !important; opacity: 0 !important; }

/* PS9 fix bug 4: zoomContainer elevateZoom intercetta click sulla foto */
/* impedendo apertura modale Bootstrap zoom. Disabilito pointer-events */
.zoomContainer {
  pointer-events: none !important;
}
/* La foto sottostante riceve il click e attiva data-toggle="modal" */


/* Fix bug 5: pointer-events sui button frecce modale zoom
   .modal-navigation-arrows ha pointer-events:none → ripristino sui figli */
.modal-navigation-arrows .modal-nav-btn,
.modal-navigation-arrows .modal-prev,
.modal-navigation-arrows .modal-next {
  pointer-events: auto !important;
}
