

            #photoUrlList_03fed688a6144186a5ea340da352cd47 .lead_swiper_container{
                --swiper_wrapperWidth: 100%;
                --swiper_main_ratio: 1 / 1;
                --swiper_main_width: 100%;
                --swiper_thumb_align: start;
                --swiper_thumb_gap: 20px;
                --swiper_thumb_space: 20px;
                --swiper_thumb_ratio: 1 / 1;
                --swiper_video_icon_size: 30px;
                --swiper_slidesPerView: 5;
                --swiper_thumbsWidth: 100%;
                --swiper_thumbsSlideHeight: 80px;
                --swiper_swiperSlideSpaceBetween:10px;
                --swiper_waterfall_num: 2;
                --swiper_waterfall_space: 20px;
                --swiper_icon_space: 10px;
                --swiper-icon-size: 20px;
            }
    
            @media (max-width: 768px) {
                div #photoUrlList_03fed688a6144186a5ea340da352cd47 .lead_swiper_container{
                --swiper_wrapperHeight: auto;
                --swiper_thumbsSlideHeight: auto;
              }
            }
        

        .prodName{
            font-size:22px;
        }
    

        :root {
            /* Theme CSS Variables aligned with Kaidi brand design standards */
            --kd-bg-primary: #ffffff;
            --kd-bg-secondary: #f8fafc;
            --kd-text-primary: #0f172a;
            --kd-text-secondary: #475569;
            --kd-border-primary: #e2e8f0;
            --kd-border-secondary: #cbd5e1;
            
            /* Monochromatic Blue Gradient Palette */
            --kd-blue-sapphire: #0f2d59; /* Deep sapphire dark */
            --kd-blue-corporate: #2563eb; /* Corporate blue */
            --kd-blue-light: #eff6ff; /* Soft tint fill */
            --kd-blue-border: #bfdbfe; /* Accent border */
            --kd-blue-ink: #1e40af; /* Contrasting text ink */
        }

        /* Support Dark Mode theme standard */
        @media (prefers-color-scheme: dark) {
            :root {
                --kd-bg-primary: #0f172a;
                --kd-bg-secondary: #1e293b;
                --kd-text-primary: #f8fafc;
                --kd-text-secondary: #94a3b8;
                --kd-border-primary: #334155;
                --kd-border-secondary: #475569;
                
                --kd-blue-sapphire: #38bdf8;
                --kd-blue-corporate: #60a5fa;
                --kd-blue-light: #172554;
                --kd-blue-border: #1e3a8a;
                --kd-blue-ink: #dbeafe;
            }
        }

        * {
            box-sizing: border-box;
            margin: 0;
            padding: 0;
        }

        body {
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
            background-color: var(--kd-bg-secondary);
            color: var(--kd-text-primary);
            line-height: 1.5;
            padding: 40px 20px;
            display: flex;
            justify-content: center;
            align-items: center;
            min-height: 100vh;
        }

        .kaidi-explorer-container {
            width: 100%;
            max-width: 680px;
            background-color: var(--kd-bg-primary);
            border: 1px solid var(--kd-border-primary);
            border-radius: 12px;
            overflow: hidden;
            box-shadow: 0 4px 20px -2px rgba(15, 23, 42, 0.08);
        }

        .kaidi-explorer-header {
            padding: 20px 24px;
            border-bottom: 1px solid var(--kd-border-primary);
            background-color: var(--kd-bg-secondary);
        }

        .kaidi-explorer-title {
            font-size: 14px;
            font-weight: 500;
            color: var(--kd-text-primary);
            margin-bottom: 4px;
            text-transform: capitalize;
            letter-spacing: -0.01em;
        }

        .kaidi-explorer-subtitle {
            font-size: 13px;
            color: var(--kd-text-secondary);
            font-weight: 400;
        }

        .kaidi-image-panel {
            position: relative;
            width: 100%;
            aspect-ratio: 1 / 1;
            background-color: #ffffff;
            overflow: hidden;
        }

        .kaidi-product-image {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
        }

        /* Pulsing technical hotspots */
        .kaidi-hotspot {
            position: absolute;
            width: 24px;
            height: 24px;
            transform: translate(-50%, -50%);
            cursor: pointer;
            z-index: 10;
        }

        .kaidi-hotspot-inner {
            position: absolute;
            width: 100%;
            height: 100%;
            background-color: var(--kd-blue-corporate);
            border: 2.5px solid var(--kd-bg-primary);
            border-radius: 50%;
            color: #ffffff;
            font-size: 11px;
            font-weight: 500;
            display: flex;
            align-items: center;
            justify-content: center;
            box-shadow: 0 2px 8px rgba(15, 23, 42, 0.25);
            transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
        }

        .kaidi-hotspot:hover .kaidi-hotspot-inner,
        .kaidi-hotspot.active .kaidi-hotspot-inner {
            background-color: var(--kd-blue-ink);
            transform: scale(1.15);
            box-shadow: 0 4px 12px rgba(15, 23, 42, 0.4);
        }

        .kaidi-hotspot::after {
            content: '';
            position: absolute;
            top: -6px;
            left: -6px;
            right: -6px;
            bottom: -6px;
            border: 1.5px solid var(--kd-blue-corporate);
            border-radius: 50%;
            opacity: 0.8;
            animation: kaidi-pulse 2.2s infinite cubic-bezier(0.25, 0, 0, 1);
            pointer-events: none;
        }

        .kaidi-hotspot.active::after {
            border-color: var(--kd-blue-ink);
        }

        @keyframes kaidi-pulse {
            0% {
                transform: scale(0.6);
                opacity: 1;
            }
            100% {
                transform: scale(1.5);
                opacity: 0;
            }
        }

        .kaidi-details-panel {
            padding: 24px;
            background-color: var(--kd-bg-primary);
        }

        .kaidi-grid {
            display: grid;
            grid-template-columns: 1fr;
            gap: 20px;
        }

        @media (min-width: 520px) {
            .kaidi-grid {
                grid-template-columns: 1.15fr 1.85fr;
            }
        }

        .kaidi-comp-list {
            display: flex;
            flex-direction: column;
            gap: 6px;
            max-height: 280px;
            overflow-y: auto;
            padding-right: 6px;
        }

        .kaidi-comp-list::-webkit-scrollbar {
            width: 4px;
        }
        .kaidi-comp-list::-webkit-scrollbar-track {
            background: transparent;
        }
        .kaidi-comp-list::-webkit-scrollbar-thumb {
            background: var(--kd-border-primary);
            border-radius: 2px;
        }

        .kaidi-list-item {
            display: flex;
            align-items: center;
            gap: 10px;
            padding: 8px 12px;
            border-radius: 6px;
            background-color: var(--kd-bg-secondary);
            border: 1px solid var(--kd-border-primary);
            cursor: pointer;
            transition: all 0.2s ease;
            font-size: 13px;
            font-weight: 400;
            color: var(--kd-text-secondary);
        }

        .kaidi-list-item:hover {
            background-color: var(--kd-blue-light);
            border-color: var(--kd-blue-border);
            color: var(--kd-blue-ink);
        }

        .kaidi-list-item.active {
            background-color: var(--kd-blue-light);
            border-color: var(--kd-blue-corporate);
            color: var(--kd-blue-ink);
            font-weight: 500;
        }

        .kaidi-list-badge {
            display: flex;
            align-items: center;
            justify-content: center;
            min-width: 18px;
            height: 18px;
            border-radius: 50%;
            font-size: 10px;
            font-weight: 500;
            background-color: var(--kd-border-secondary);
            color: var(--kd-text-secondary);
            transition: all 0.2s ease;
        }

        .kaidi-list-item.active .kaidi-list-badge {
            background-color: var(--kd-blue-corporate);
            color: #ffffff;
        }

        /* Detail Card standard single-hue triplet design */
        .kaidi-detail-card {
            border-radius: 8px;
            padding: 18px;
            background-color: var(--kd-blue-light);
            border: 1px solid var(--kd-blue-border);
            color: var(--kd-blue-ink);
            min-height: 200px;
            display: flex;
            flex-direction: column;
            transition: all 0.25s ease;
        }

        .kaidi-detail-num {
            font-size: 11px;
            text-transform: uppercase;
            font-weight: 500;
            color: var(--kd-blue-corporate);
            margin-bottom: 2px;
            letter-spacing: 0.05em;
        }

        .kaidi-detail-title {
            font-size: 14px;
            font-weight: 500;
            margin-bottom: 8px;
            color: var(--kd-blue-ink);
        }

        .kaidi-detail-meta {
            display: grid;
            grid-template-columns: auto 1fr;
            gap: 10px 14px;
            font-size: 13px;
            margin-top: auto;
            border-top: 1px dashed var(--kd-blue-border);
            padding-top: 12px;
        }

        .kaidi-meta-label {
            font-weight: 500;
            opacity: 0.8;
        }

        .kaidi-meta-val {
            opacity: 0.95;
            font-weight: 400;
        }
    

        .emptyNodeData {
            display:none;
        }
   

    #productDetail_28412_03fed688a6144186a5ea340da352cd47_leftColumn{
        width:40%;
        max-width:100%;
        flex: 1 1 40%;
    }
    #productDetail_28412_03fed688a6144186a5ea340da352cd47_rightColumn{
        width:60%;
        max-width:100%;
        flex: 1 1 60%;
    }

    #productDetail_28412_03fed688a6144186a5ea340da352cd47_rowContainer_ip5413{
        padding: 0px;
    }

    #productDetail_28412_03fed688a6144186a5ea340da352cd47_column_iojrko{
        padding: 5px 15px 5px 0px;
    }
