#compareSection {
            font-family: 'Roboto Flex', -apple-system, BlinkMacSystemFont, sans-serif !important;
            font-weight: 350 !important;
            letter-spacing: -0.01em !important;
            padding: 30px 0 !important;
            background: #fff !important; 
            min-height: calc(100vh - 76px) !important;
            box-sizing: border-box !important;
            margin-bottom: 30px;
        }
        
        #compareSection * {
            box-sizing: border-box !important;
        }
        
        #compareSection .container {
            max-width: 1400px !important;
            margin: 0 auto !important;
            padding: 0 15px !important;
        }
        
      
        #compareSection .breadcrumb-modern {
            background: transparent !important;
            padding: 0 !important;
            margin-bottom: 20px !important;
        }
        
        #compareSection .breadcrumb {
            display: flex !important;
            list-style: none !important;
            padding: 0 !important;
            margin: 0 !important;
            flex-wrap: wrap !important;
        }
        
        #compareSection .breadcrumb-item {
            font-size: 14px !important;
            font-weight: 400 !important;
        }
        
        #compareSection .breadcrumb-item a {
            color: #64748b !important;
            text-decoration: none !important;
            transition: color 0.2s !important;
        }
        
        #compareSection .breadcrumb-item a:hover {
            color: #3b82f6 !important;
        }
        
        #compareSection .breadcrumb-item.active {
            color: #1e293b !important;
            font-weight: 400 !important;
        }
        
        #compareSection .breadcrumb-item + .breadcrumb-item::before {
            content: "/" !important;
            padding: 0 8px !important;
            color: #cbd5e1 !important;
        }
        
     
        #compareSection .display-6 {
            font-size: 2rem !important;
            font-weight: 300 !important;
            color: #1e293b !important;
            margin: 0 0 8px 0 !important;
            line-height: 1.2 !important;
        }
        
        #compareSection .text-muted {
            color: #64748b !important;
            font-weight: 350 !important;
            margin: 0 !important;
        }
        
      
        #compareSection .compare-count-badge .badge {
            display: inline-flex !important;
            align-items: center !important;
            font-size: 16px !important;
            font-weight: 400 !important;
            padding: 8px 16px !important;
            border-radius: 50px !important;
            background: rgba(37, 99, 235, 0.1) !important;
            color: #2563eb !important;
            border: 1px solid rgba(37, 99, 235, 0.2) !important;
        }
        
       
        #compareSection .compare-controls {
            background: white !important;
            border-radius: 10px !important;
            border: 1px solid #e2e8f0 !important;
            box-shadow: 0 1px 3px rgba(0,0,0,0.05) !important;
            margin-bottom: 20px !important;
            overflow: hidden !important;
        }
        
        #compareSection .compare-controls .card-body {
            padding: 16px !important;
        }
        
      
        #compareSection .btn {
            display: inline-flex !important;
            align-items: center !important;
            justify-content: center !important;
            padding: 8px 16px !important;
            font-size: 14px !important;
            font-weight: 400 !important;
            border-radius: 8px !important;
            border: 1px solid !important;
            cursor: pointer !important;
            transition: all 0.2s !important;
            gap: 6px !important;
            text-decoration: none !important;
            background: white !important;
        }
        
        #compareSection .btn-sm {
            padding: 6px 12px !important;
            font-size: 13px !important;
        }
        
        #compareSection .btn-outline-danger {
            color: #dc3545 !important;
            border-color: #dc3545 !important;
        }
        
        #compareSection .btn-outline-danger:hover {
            background: #dc3545 !important;
            color: white !important;
        }
        
        #compareSection .btn-outline-secondary {
            color: #6c757d !important;
            border-color: #6c757d !important;
        }
        
        #compareSection .btn-outline-secondary:hover {
            background: #6c757d !important;
            color: white !important;
        }
        
        #compareSection .btn-outline-primary {
            color: #2563eb !important;
            border-color: #2563eb !important;
        }
        
        #compareSection .btn-outline-primary:hover {
            background: #2563eb !important;
            color: white !important;
        }
        
        #compareSection .btn-primary {
            background: #2563eb !important;
            color: white !important;
            border-color: #2563eb !important;
        }
        
        #compareSection .btn-primary:hover {
            background: #1d4ed8 !important;
            transform: translateY(-1px) !important;
            box-shadow: 0 4px 12px rgba(37, 99, 235, 0.15) !important;
        }
        
      
        #compareSection .table-scroll-wrapper {
            background: white !important;
            border-radius: 10px !important;
            border: 1px solid #e2e8f0 !important;
            overflow: hidden !important;
            margin-bottom: 20px !important;
            position: relative !important;
        }
        
        #compareSection .table-container {
            overflow-x: auto !important;
            -webkit-overflow-scrolling: touch !important;
            width: 100% !important;
        }
        
     
        #compareSection .table-container::-webkit-scrollbar {
            height: 4px !important;
        }
        
        #compareSection .table-container::-webkit-scrollbar-track {
            background: #f1f5f9 !important;
        }
        
        #compareSection .table-container::-webkit-scrollbar-thumb {
            background: #cbd5e1 !important;
            border-radius: 2px !important;
        }
        
       
        #compareSection .compare-table {
            width: 100% !important;
            border-collapse: separate !important;
            border-spacing: 0 !important;
            min-width: 800px !important;
        }
        
        #compareSection .compare-table th {
            border: none !important;
            font-weight: 400 !important;
            vertical-align: middle !important;
            background: white !important;
            position: relative !important;
        }
        
        #compareSection .compare-table td {
            border-bottom: 1px solid #f1f5f9 !important;
            padding: 16px !important;
            vertical-align: middle !important;
            white-space: nowrap !important;
        }
        
        #compareSection .compare-table tr:last-child td {
            border-bottom: none !important;
        }
       
        #compareSection .table-section-header {
            background: #f8fafc !important;
        }
        
        #compareSection .table-section-header td {
            border-top: 2px solid #e2e8f0 !important;
            border-bottom: 2px solid #e2e8f0 !important;
            font-weight: 400 !important;
            color: #1e293b !important;
            font-size: 15px !important;
            white-space: nowrap !important;
        }
        
      
        #compareSection .param-name {
            background: #f8fafc !important;
            font-weight: 400 !important;
            color: #475569 !important;
            min-width: 180px !important;
            width: 180px !important;
            border-right: 1px solid #e2e8f0 !important;
        }
        
        #compareSection .param-value {
            background: white !important;
            font-weight: 350 !important;
            min-width: 250px !important;
        }
        
      
        #compareSection .compare-object-header {
            position: relative !important;
            padding: 16px !important;
            text-align: center !important;
            min-width: 250px !important;
        }
        
        #compareSection .btn-remove-compare {
            position: absolute !important;
            top: 12px !important;
            right: 12px !important;
            width: 24px !important;
            height: 24px !important;
            border-radius: 50% !important;
            background: white !important;
            border: 1px solid #e2e8f0 !important;
            color: #94a3b8 !important;
            display: flex !important;
            align-items: center !important;
            justify-content: center !important;
            cursor: pointer !important;
            transition: all 0.2s !important;
            font-size: 12px !important;
            padding: 0 !important;
        }
        
        #compareSection .btn-remove-compare:hover {
            background: #ef4444 !important;
            color: white !important;
            border-color: #ef4444 !important;
        }
        
        #compareSection .compare-object-image {
            height: 140px !important;
            border-radius: 8px !important;
            overflow: hidden !important;
            margin-bottom: 12px !important;
            background: #f1f5f9 !important;
        }
        
        #compareSection .compare-object-image img {
            width: 100% !important;
            height: 100% !important;
            object-fit: cover !important;
        }
        
        #compareSection .object-title {
            font-size: 16px !important;
            font-weight: 400 !important;
            color: #1e293b !important;
            margin: 0 0 8px 0 !important;
            line-height: 1.4 !important;
            min-height: 44px !important;
            white-space: normal !important;
        }
        
        #compareSection .object-price {
            font-size: 20px !important;
            font-weight: 500 !important;
            color: #2563eb !important;
            margin: 0 0 12px 0 !important;
        }
        
      
        #compareSection .badge {
            display: inline-block !important;
            padding: 4px 12px !important;
            font-size: 12px !important;
            font-weight: 400 !important;
            border-radius: 50px !important;
            line-height: 1.5 !important;
            white-space: nowrap !important;
        }
        
        #compareSection .bg-secondary.bg-opacity-10 {
            background: rgba(107, 114, 128, 0.1) !important;
            color: #6b7280 !important;
        }
        
        #compareSection .bg-success.bg-opacity-10 {
            background: rgba(16, 185, 129, 0.1) !important;
            color: #10b981 !important;
        }
        
        #compareSection .bg-warning.bg-opacity-10 {
            background: rgba(245, 158, 11, 0.1) !important;
            color: #f59e0b !important;
        }
        
        #compareSection .bg-primary.bg-opacity-10 {
            background: rgba(37, 99, 235, 0.1) !important;
            color: #2563eb !important;
        }
        
      
        #compareSection .fas {
            font-family: "Font Awesome 6 Free" !important;
            font-weight: 900 !important;
        }
        
        #compareSection .fa-sm {
            font-size: 0.875em !important;
        }
        
       
        #compareSection .text-success {
            color: #10b981 !important;
        }
        
        #compareSection .text-purple {
            color: #8b5cf6 !important;
        }
        
       
        #compareSection .highlighted {
            background: rgba(253, 230, 138, 0.3) !important;
            position: relative !important;
        }
        
        #compareSection .highlighted::after {
            content: '' !important;
            position: absolute !important;
            top: 4px !important;
            right: 4px !important;
            width: 6px !important;
            height: 6px !important;
            background: #f59e0b !important;
            border-radius: 50% !important;
        }
        
       
        #compareSection .mobile-scroll-hint {
            display: none !important;
            text-align: center !important;
            padding: 8px !important;
            font-size: 12px !important;
            color: #64748b !important;
            background: #f8fafc !important;
            border-top: 1px solid #e2e8f0 !important;
        }
        
       
        #compareSection .mobile-object-indicator {
            display: none !important;
            position: sticky !important;
            top: 0 !important;
            left: 0 !important;
            right: 0 !important;
            background: rgba(255, 255, 255, 0.95) !important;
            backdrop-filter: blur(10px) !important;
            border-bottom: 1px solid #e2e8f0 !important;
            padding: 10px 12px !important;
            z-index: 1000 !important;
            font-size: 13px !important;
            font-weight: 500 !important;
            color: #1e293b !important;
            box-shadow: 0 2px 8px rgba(0,0,0,0.05) !important;
            text-align: center !important;
            white-space: nowrap !important;
            overflow: hidden !important;
            text-overflow: ellipsis !important;
        }
        
      
        #compareSection .alert {
            padding: 12px 16px !important;
            border: 1px solid #e2e8f0 !important;
            border-radius: 8px !important;
            background: #f8fafc !important;
            margin-top: 20px !important;
        }
        
        #compareSection .alert-light {
            background: #f8fafc !important;
            border-color: #e2e8f0 !important;
        }
        
       
        #compareSection .empty-compare-state {
            text-align: center !important;
            padding: 60px 20px !important;
        }
        
        #compareSection .icon-wrapper {
            width: 80px !important;
            height: 80px !important;
            background: #eff6ff !important;
            border-radius: 50% !important;
            display: flex !important;
            align-items: center !important;
            justify-content: center !important;
            margin: 0 auto 20px auto !important;
        }
        
        #compareSection .icon-wrapper i {
            font-size: 32px !important;
            color: #2563eb !important;
        }
        
      
        
        @media (max-width: 768px) {
            #compareSection {
                padding: 12px 0 !important;
                background: #fff !important;
            }
            
            #compareSection .container {
                padding: 0 10px !important;
            }
            
          
            #compareSection .mobile-object-indicator {
                display: flex !important;
                align-items: center !important;
                justify-content: center !important;
                gap: 6px !important;
                background: white !important;
                backdrop-filter: none !important;
            }
            
            #compareSection .mobile-object-indicator::before {
                content: "??";
                font-size: 14px;
            }
            
            #compareSection .mobile-scroll-hint {
                display: flex !important;
                align-items: center !important;
                justify-content: center !important;
                gap: 4px !important;
                position: sticky !important;
                bottom: 0 !important;
                left: 0 !important;
                right: 0 !important;
                z-index: 100 !important;
                background: #f1f5f9 !important;
                border-top: 1px solid #e2e8f0 !important;
            }
            
           
            #compareSection .display-6 {
                font-size: 1.25rem !important;
                margin-bottom: 4px !important;
            }
            
            #compareSection .text-muted {
                font-size: 13px !important;
                margin-bottom: 12px !important;
            }
            
         
            #compareSection .compare-count-badge .badge {
                font-size: 13px !important;
                padding: 5px 10px !important;
            }
            
           
            #compareSection .compare-controls {
                margin-bottom: 12px !important;
                border-radius: 6px !important;
            }
            
            #compareSection .compare-controls .card-body {
                padding: 10px !important;
            }
            
            #compareSection .compare-controls .d-flex {
                display: flex !important;
                flex-wrap: nowrap !important;
                overflow-x: auto !important;
                gap: 6px !important;
                padding-bottom: 2px !important;
                -webkit-overflow-scrolling: touch !important;
            }
            
            #compareSection .compare-controls .d-flex::-webkit-scrollbar {
                display: none !important;
            }
            
            #compareSection .btn-sm {
                padding: 6px 10px !important;
                font-size: 12px !important;
                white-space: nowrap !important;
                flex-shrink: 0 !important;
            }
            
           
            #compareSection .table-scroll-wrapper {
                border-radius: 6px !important;
                margin-bottom: 12px !important;
                position: relative !important;
                overflow: visible !important;
            }
            
            #compareSection .table-container {
                overflow-x: auto !important;
                overflow-y: hidden !important;
                padding-left: 0 !important;
                -webkit-overflow-scrolling: touch !important;
            }
            
            #compareSection .compare-table {
                min-width: 100% !important;
                border-spacing: 0 !important;
            }
            
          
            #compareSection .param-name {
                min-width: 100px !important;
                width: 100px !important;
                padding: 8px 6px !important;
                font-size: 12px !important;
                position: sticky !important;
                left: 0 !important;
                z-index: 30 !important;
                background: #f8fafc !important;
                border-right: 1px solid #e2e8f0 !important;
                box-shadow: 2px 0 4px rgba(0,0,0,0.08) !important;
                white-space: normal !important;
                line-height: 1.3 !important;
                transform: translateZ(0) !important; 
            }
            
           
            #compareSection .compare-table thead th.param-name {
                position: sticky !important;
                left: 0 !important;
                top: 0 !important;
                z-index: 40 !important; 
                background: white !important;
                box-shadow: 2px 0 4px rgba(0,0,0,0.08), 0 1px 0 #e2e8f0 !important;
            }
            
          
            #compareSection .compare-table thead th:not(.param-name) {
                position: sticky !important;
                top: 0 !important;
                z-index: 35 !important;
                background: white !important;
                box-shadow: 0 1px 0 #e2e8f0 !important;
            }
            
           
            #compareSection .active-column .compare-object-header {
                background: rgba(37, 99, 235, 0.02) !important;
                border-radius: 4px !important;
            }
            
        
            #compareSection .compare-object-header {
                padding: 8px 6px !important;
                min-width: 140px !important;
                background: white !important;
            }
            
            #compareSection .btn-remove-compare {
                top: 6px !important;
                right: 6px !important;
                width: 20px !important;
                height: 20px !important;
                font-size: 10px !important;
                z-index: 10 !important;
            }
            
            #compareSection .compare-object-image {
                height: 80px !important;
                margin-bottom: 6px !important;
                border-radius: 4px !important;
            }
            
            #compareSection .object-title {
                font-size: 12px !important;
                min-height: 30px !important;
                line-height: 1.3 !important;
                margin-bottom: 4px !important;
            }
            
            #compareSection .object-price {
                font-size: 14px !important;
                margin-bottom: 8px !important;
            }
            
            #compareSection .btn-primary {
                padding: 4px 8px !important;
                font-size: 11px !important;
            }
            
          
            #compareSection .param-value {
                min-width: 140px !important;
                padding: 8px 6px !important;
                font-size: 12px !important;
                background: white !important;
                position: relative !important;
            }
            
           
            #compareSection .compare-table td:not(.param-name) {
                border-left: 1px dashed #e2e8f0 !important;
            }
            
         
            #compareSection .table-section-header td {
                font-size: 12px !important;
                padding: 8px 6px !important;
                background: #f1f5f9 !important;
                position: sticky !important;
                left: 0 !important;
                z-index: 25 !important;
                box-shadow: 2px 0 4px rgba(0,0,0,0.05) !important;
            }
            
           
            #compareSection .badge {
                padding: 2px 6px !important;
                font-size: 10px !important;
            }
            
           
            #compareSection .mobile-scroll-hint {
                padding: 6px !important;
                font-size: 11px !important;
            }
            
         
            #compareSection .mobile-object-indicator {
                padding: 8px 10px !important;
                font-size: 12px !important;
            }
            
        
            #compareSection .mobile-object-indicator::after {
                content: attr(data-count);
                font-size: 10px;
                background: #2563eb;
                color: white;
                padding: 1px 6px;
                border-radius: 10px;
                margin-left: 6px;
                display: none; 
            }
            
            #compareSection .mobile-object-indicator[data-count]::after {
                display: inline-block; 
            }
            
        
            #compareSection .alert {
                padding: 10px 12px !important;
                margin-top: 16px !important;
                font-size: 12px !important;
            }
        }
        
       
        @media (max-width: 480px) {
           
            #compareSection .compare-object-header {
                min-width: 120px !important;
                padding: 6px 4px !important;
            }
            
            #compareSection .compare-object-image {
                height: 70px !important;
            }
            
            #compareSection .object-title {
                font-size: 11px !important;
                min-height: 26px !important;
            }
            
            #compareSection .object-price {
                font-size: 13px !important;
            }
            
            #compareSection .param-name {
                min-width: 90px !important;
                width: 90px !important;
                padding: 6px 4px !important;
                font-size: 11px !important;
            }
            
            #compareSection .param-value {
                min-width: 120px !important;
                padding: 6px 4px !important;
                font-size: 11px !important;
            }
            
          
            #compareSection .table-section-header td {
                padding: 6px 4px !important;
            }
            
           
            #compareSection .mobile-scroll-hint {
                font-size: 10px !important;
                padding: 5px !important;
            }
        }
        
  
        @media print {
            #compareSection .compare-controls,
            #compareSection .breadcrumb-modern,
            #compareSection .alert,
            #compareSection .btn-remove-compare,
            #compareSection .btn,
            #compareSection .mobile-scroll-hint,
            #compareSection .mobile-object-indicator {
                display: none !important;
            }
            
            #compareSection {
                padding: 0 !important;
                background: white !important;
            }
            
            #compareSection .table-scroll-wrapper {
                border: none !important;
                border-radius: 0 !important;
                overflow: visible !important;
            }
            
            #compareSection .table-container {
                overflow: visible !important;
            }
            
            #compareSection .compare-table {
                min-width: 100% !important;
            }
            
            #compareSection .param-value {
                font-weight: 400 !important;
            }
        }