fix1607

src/components/SearchHistoryDropdown.tsx

@@ -38,7 +38,7 @@ const SearchHistoryDropdown: React.FC<SearchHistoryDropdownProps> = ({
   };
 
   return (
-    <div className="absolute top-full left-0 right-0 bg-white border border-gray-200 rounded-lg shadow-lg mt-2 z-50 max-h-60 overflow-y-auto">
+    <div className="search-history-dropdown-custom">
       {loading ? (
         <div className="p-4 text-center text-gray-500">
           <div className="flex items-center justify-center">
@@ -51,32 +51,24 @@ const SearchHistoryDropdown: React.FC<SearchHistoryDropdownProps> = ({
         </div>
       ) : uniqueQueries.length > 0 ? (
         <>
-          <div className="p-3 border-b border-gray-100">
-            <h3 className="text-xs font-medium text-gray-500 uppercase tracking-wide">
-              Последние запросы
-            </h3>
-          </div>
           {uniqueQueries.map((item) => (
             <button
               key={item.id}
               onClick={() => onItemClick(item.searchQuery)}
-              className="w-full text-left p-3 hover:bg-gray-50 border-b border-gray-100 last:border-b-0 transition-colors cursor-pointer"
+              className="search-history-item-custom"
               style={{ cursor: 'pointer' }}
             >
-              <div className="flex items-center justify-between">
+              <div className="flex items-center gap-3">
-                <div className="flex-1 min-w-0">
+                <span className="search-history-icon-custom">
-                  <p className="text-sm font-medium text-gray-900 truncate">
+                  <svg width="18" height="18" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" viewBox="0 0 24 24">
-                    {item.searchQuery}
+                    <circle cx="12" cy="12" r="10" />
-                  </p>
+                    <path d="M12 8v4l3 3" />
-                  <p className="text-xs text-gray-500">
-                    {getSearchTypeLabel(item.searchType)}
-                  </p>
-                </div>
-                <div className="ml-2 flex-shrink-0">
-                  <svg className="w-4 h-4 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                    <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z" />
                   </svg>
-                </div>
+                </span>
+                <span className="search-history-inline">
+                  <span className="search-history-query-custom">{item.searchQuery}</span>
+                  <span className="search-history-type-custom">{getSearchTypeLabel(item.searchType)}</span>
+                </span>
               </div>
             </button>
           ))}
@@ -86,6 +78,91 @@ const SearchHistoryDropdown: React.FC<SearchHistoryDropdownProps> = ({
           <p className="text-sm">История поиска пуста</p>
         </div>
       )}
+      <style>{`
+        .search-history-dropdown-custom {
+          position: absolute;
+          top: 100%;
+          left: 0;
+          right: 0;
+          background: #fff;
+          border-radius: 16px;
+          box-shadow: 0 8px 32px rgba(44,62,80,0.10), 0 1.5px 4px rgba(44,62,80,0.08);
+          margin-top: 12px;
+          z-index: 50;
+          max-height: 260px;
+          overflow-y: auto;
+          border: 1px solid #f0f0f0;
+          padding: 6px 0;
+          scrollbar-width: none; /* Firefox */
+          -ms-overflow-style: none; /* IE и Edge */
+        }
+        .search-history-dropdown-custom::-webkit-scrollbar {
+          display: none; /* Chrome, Safari, Opera */
+        }
+        .search-history-item-custom {
+          width: 100%;
+          background: none;
+          border: none;
+          outline: none;
+          padding: 12px 20px;
+          border-radius: 0;
+          transition: background 0.18s;
+          display: block;
+        }
+        .search-history-item-custom:hover, .search-history-item-custom:focus {
+          background: #e5e7eb;
+        }
+        .search-history-item-custom .flex {
+          flex-direction: row-reverse;
+        }
+        .search-history-icon-custom {
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          width: 32px;
+          height: 32px;
+          border-radius: 50%;
+          background: #f3f4f6;
+          color: #222;
+          flex-shrink: 0;
+          margin-left: 12px;
+          margin-right: 0;
+        }
+        .search-history-item-custom:hover .search-history-icon-custom,
+        .search-history-item-custom:focus .search-history-icon-custom {
+          background: #ec1c24;
+          color: #fff;
+        }
+        .search-history-inline {
+          display: flex;
+          flex: 1 1 0%;
+          min-width: 0;
+          align-items: center;
+          gap: 8px;
+        }
+        .search-history-query-custom {
+          font-size: 15px;
+          font-weight: 500;
+          color: #222;
+          margin: 0;
+          line-height: 1.2;
+          letter-spacing: 0.01em;
+          white-space: nowrap;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          flex: 1 1 0%;
+          min-width: 0;
+        }
+        .search-history-type-custom {
+          font-size: 12px;
+          color: #8e9aac;
+          margin: 0 0 0 8px;
+          white-space: nowrap;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          flex-shrink: 0;
+        }
+      `}</style>
     </div>
   );
 };

src/components/index/CategoryNavSection.tsx

@@ -3,138 +3,69 @@ import { useQuery } from '@apollo/client';
 import { GET_PARTSINDEX_CATEGORIES } from '@/lib/graphql';
 import { useRouter } from 'next/router';
 
-interface PartsIndexCatalog {
+interface CategoryNavItem {
   id: string;
   name: string;
   image?: string;
-  groups?: PartsIndexGroup[];
 }
 
-interface PartsIndexGroup {
+const FALLBACK_CATEGORIES: CategoryNavItem[] = [
-  id: string;
+  { id: '1', name: 'Детали для ТО', image: '/images/catalog_item.png' },
-  name: string;
+  { id: '2', name: 'Шины', image: '/images/catalog_item2.png' },
-  image?: string;
+  { id: '3', name: 'Диски', image: '/images/catalog_item3.png' },
-  subgroups?: PartsIndexSubgroup[];
+  { id: '4', name: 'Масла и жидкости', image: '/images/catalog_item4.png' },
-  entityNames?: { id: string; name: string }[];
+  { id: '5', name: 'Инструменты', image: '/images/catalog_item5.png' },
-}
+  { id: '6', name: 'Автохимия', image: '/images/catalog_item6.png' },
-
+  { id: '7', name: 'Аксессуары', image: '/images/catalog_item7.png' },
-interface PartsIndexSubgroup {
+  { id: '8', name: 'Электрика', image: '/images/catalog_item8.png' },
-  id: string;
+  { id: '9', name: 'АКБ', image: '/images/catalog_item9.png' },
-  name: string;
+];
-  image?: string;
-  entityNames?: { id: string; name: string }[];
-}
 
 const CategoryNavSection: React.FC = () => {
   const router = useRouter();
-  
+
-  const { data, loading, error } = useQuery<{ partsIndexCategoriesWithGroups: PartsIndexCatalog[] }>(
+  const { data } = useQuery<{ partsIndexCategoriesWithGroups: CategoryNavItem[] }>(
     GET_PARTSINDEX_CATEGORIES,
     {
-      variables: { 
+      variables: { lang: 'ru' },
-        lang: 'ru'
-      },
       errorPolicy: 'all',
-      fetchPolicy: 'cache-first'
+      fetchPolicy: 'cache-first',
     }
   );
 
-  // Обработчик клика по категории для перехода в каталог с товарами
+  const categories = (data?.partsIndexCategoriesWithGroups && data.partsIndexCategoriesWithGroups.length > 0)
-  const handleCategoryClick = (catalog: PartsIndexCatalog) => {
+    ? data.partsIndexCategoriesWithGroups.slice(0, 9)
-    console.log('🔍 Клик по категории:', { catalogId: catalog.id, categoryName: catalog.name });
+    : FALLBACK_CATEGORIES;
-    
+
-    // Получаем первую группу для groupId (это правильный ID для partsIndexCategory)
+  const handleCategoryClick = (category: CategoryNavItem) => {
-    const firstGroup = catalog.groups?.[0];
-    const groupId = firstGroup?.id;
-    
-    console.log('🔍 Найденная группа:', { groupId, groupName: firstGroup?.name });
-    
-    // Переходим на страницу каталога с параметрами PartsIndex
     router.push({
       pathname: '/catalog',
       query: {
-        partsIndexCatalog: catalog.id,
+        categoryId: category.id,
-        categoryName: encodeURIComponent(catalog.name),
+        categoryName: encodeURIComponent(category.name)
-        ...(groupId && { partsIndexCategory: groupId })
       }
     });
   };
 
-  // Fallback данные на случай ошибки
-  const fallbackCategories = [
-    { id: '1', name: 'Двигатель', image: '/images/catalog_item.png' },
-    { id: '2', name: 'Трансмиссия', image: '/images/catalog_item2.png' },
-    { id: '3', name: 'Подвеска', image: '/images/catalog_item3.png' },
-    { id: '4', name: 'Тормоза', image: '/images/catalog_item4.png' },
-    { id: '5', name: 'Электрика', image: '/images/catalog_item5.png' },
-    { id: '6', name: 'Кузов', image: '/images/catalog_item6.png' },
-    { id: '7', name: 'Салон', image: '/images/catalog_item7.png' },
-    { id: '8', name: 'Климат', image: '/images/catalog_item8.png' },
-    { id: '9', name: 'Расходники', image: '/images/catalog_item9.png' }
-  ];
-
-  // Используем данные из API или fallback
-  const categories = data?.partsIndexCategoriesWithGroups || [];
-  const displayCategories = categories.length > 0 ? categories : fallbackCategories;
-
-  if (loading) {
-    return (
-      <div className="w-layout-blockcontainer container-2 w-container">
-        <div className="w-layout-hflex flex-block-6">
-          {Array.from({ length: 9 }).map((_, index) => (
-            <div key={index} className="w-layout-vflex flex-block-7">
-              <div className="animate-pulse bg-gray-200 h-6 w-20 rounded mb-2"></div>
-            </div>
-          ))}
-        </div>
-        <div className="w-layout-hflex flex-block-5">
-          {Array.from({ length: 9 }).map((_, index) => (
-            <div key={index} className="w-layout-vflex flex-block-8">
-              <div className="animate-pulse bg-gray-200 h-32 w-full rounded"></div>
-            </div>
-          ))}
-        </div>
-      </div>
-    );
-  }
-
   return (
-    <div className="w-layout-blockcontainer container-2 w-container">
+    <section className="catnav">
-      {/* Навигационная панель с названиями категорий */}
+      <div className="w-layout-blockcontainer batd w-container">
-      <div className="w-layout-hflex flex-block-6">
+        <div className="w-layout-hflex flex-block-108-copy">
-        {displayCategories.slice(0, 9).map((catalog) => (
+          {categories.map((category, idx) => (
-          <div key={catalog.id} className="w-layout-vflex flex-block-7">
+            <div
-            <div 
+              key={category.id}
-              className="text-block-10"
+              className={`ci${idx + 1}`}
-              onClick={() => handleCategoryClick(catalog)}
+              style={category.image ? { cursor: 'pointer', backgroundImage: `url('${category.image}')`, backgroundSize: 'cover', backgroundPosition: 'center' } : { cursor: 'pointer' }}
-              style={{ cursor: 'pointer' }}
+              onClick={() => handleCategoryClick(category)}
             >
-              {catalog.name}
+              <div className={idx === 0 ? 'text-block-54-copy' : 'text-block-54'} style={{ textAlign: 'center' }}>
+                {category.name}
+              </div>
             </div>
-          </div>
+          ))}
-        ))}
+        </div>
       </div>
-
+    </section>
-      {/* Блок с изображениями категорий */}
-      <div className="w-layout-hflex flex-block-5">
-        {displayCategories.slice(0, 9).map((catalog) => (
-          <div key={catalog.id} className="w-layout-vflex flex-block-8">
-            <img 
-              src={catalog.image || '/images/catalog_item.png'} 
-              loading="lazy" 
-              alt={catalog.name}
-              className="image-5"
-              onClick={() => handleCategoryClick(catalog)}
-              style={{ cursor: 'pointer' }}
-              onError={(e) => {
-                const target = e.target as HTMLImageElement;
-                target.src = '/images/catalog_item.png';
-              }}
-            />
-          </div>
-        ))}
-      </div>
-    </div>
   );
 };
 

src/components/index/ProductOfDayBanner.tsx

@@ -1,4 +1,4 @@
-import React, { useState, useEffect } from 'react';
+import React, { useState, useEffect, useRef } from 'react';
 import { useQuery } from '@apollo/client';
 import { GET_HERO_BANNERS } from '@/lib/graphql';
 import Link from 'next/link';
@@ -13,20 +13,94 @@ interface HeroBanner {
   sortOrder: number;
 }
 
+// Добавим CSS для стрелок
+const arrowStyles = `
+.pod-slider-arrow {
+  width: 40px;
+  height: 40px;
+  border: none;
+  background: none;
+  padding: 0;
+  position: absolute;
+  top: 50%;
+  transform: translateY(-50%);
+  z-index: 10;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  opacity: 1;
+  transition: opacity 0.2s;
+  cursor: pointer;
+}
+.pod-slider-arrow-left { left: 12px; }
+.pod-slider-arrow-right { right: 12px; }
+.pod-slider-arrow .arrow-circle {
+  width: 36px;
+  height: 36px;
+  border-radius: 50%;
+  background: rgba(255,255,255,0.85);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  transition: background 0.2s;
+}
+.pod-slider-arrow:hover .arrow-circle,
+.pod-slider-arrow:focus .arrow-circle {
+  background: #ec1c24;
+}
+.pod-slider-arrow .arrow-svg {
+  width: 20px;
+  height: 20px;
+  display: block;
+  transition: stroke 0.2s;
+  stroke: #222;
+}
+.pod-slider-arrow:hover .arrow-svg,
+.pod-slider-arrow:focus .arrow-svg {
+  stroke: #fff;
+}
+`;
+
+const slideStyles = `
+.pod-slider-slide {
+  position: absolute;
+  top: 0; left: 0; 
+  opacity: 0;
+  transform: translateX(40px) scale(0.98);
+  transition: opacity 0.5s cubic-bezier(.4,0,.2,1), transform 0.5s cubic-bezier(.4,0,.2,1);
+  pointer-events: none;
+  z-index: 1;
+}
+.pod-slider-slide.active {
+  opacity: 1;
+  transform: translateX(0) scale(1);
+  pointer-events: auto;
+  z-index: 2;
+}
+.pod-slider-slide.prev {
+  opacity: 0;
+  transform: translateX(-40px) scale(0.98);
+  z-index: 1;
+}
+.pod-slider-slide.next {
+  opacity: 0;
+  transform: translateX(40px) scale(0.98);
+  z-index: 1;
+}
+.mask.w-slider-mask { position: relative; }
+`;
+
 const ProductOfDayBanner: React.FC = () => {
   const [currentSlide, setCurrentSlide] = useState(0);
-  
+  const [showArrows, setShowArrows] = useState(false);
-  const { data, loading, error } = useQuery(GET_HERO_BANNERS, {
+  const sliderRef = useRef<HTMLDivElement>(null);
-    errorPolicy: 'all'
+  const { data } = useQuery(GET_HERO_BANNERS, { errorPolicy: 'all' });
-  });
 
-  // Фильтруем только активные баннеры и сортируем их
   const banners: HeroBanner[] = data?.heroBanners
     ?.filter((banner: HeroBanner) => banner.isActive)
     ?.slice()
     ?.sort((a: HeroBanner, b: HeroBanner) => a.sortOrder - b.sortOrder) || [];
 
-  // Если нет баннеров из админки, показываем дефолтный
   const allBanners = banners.length > 0 ? banners : [{
     id: 'default',
     title: 'ДОСТАВИМ БЫСТРО!',
@@ -37,18 +111,15 @@ const ProductOfDayBanner: React.FC = () => {
     sortOrder: 0
   }];
 
-  // Автопрокрутка слайдов
   useEffect(() => {
     if (allBanners.length > 1) {
       const interval = setInterval(() => {
         setCurrentSlide(prev => (prev + 1) % allBanners.length);
-      }, 5000); // Меняем слайд каждые 5 секунд
+      }, 5000);
-
       return () => clearInterval(interval);
     }
   }, [allBanners.length]);
 
-  // Сброс текущего слайда если он вне диапазона
   useEffect(() => {
     if (currentSlide >= allBanners.length) {
       setCurrentSlide(0);
@@ -67,141 +138,109 @@ const ProductOfDayBanner: React.FC = () => {
     setCurrentSlide(index);
   };
 
-  const currentBanner = allBanners[currentSlide];
+  // Показывать стрелки при наведении на слайдер или стрелки
-
+  const handleMouseEnter = () => setShowArrows(true);
-  const renderBannerContent = (banner: HeroBanner) => {
+  const handleMouseLeave = () => setShowArrows(false);
-    return (
-      <div className="div-block-128" style={{ 
-        backgroundImage: `url(${banner.imageUrl})`,
-        backgroundSize: 'cover',
-        backgroundPosition: 'center',
-        backgroundRepeat: 'no-repeat',
-        position: 'relative',
-        display: 'flex',
-        alignItems: 'center',
-        justifyContent: 'center',
-        minHeight: '200px',
-        width: '100%',
-        height: '100%',
-        borderRadius: '20px',
-        overflow: 'hidden'
-      }}>
-        {(banner.title || banner.subtitle) && (
-          <div style={{
-            position: 'absolute',
-            bottom: '20px',
-            left: '20px',
-            right: '20px',
-            color: 'white',
-            textShadow: '0 2px 4px rgba(0,0,0,0.5)'
-          }}>
-            {banner.title && (
-              <h3 style={{ margin: 0, fontSize: '18px', fontWeight: 'bold' }}>
-                {banner.title}
-              </h3>
-            )}
-            {banner.subtitle && (
-              <p style={{ margin: '5px 0 0 0', fontSize: '14px' }}>
-                {banner.subtitle}
-              </p>
-            )}
-          </div>
-        )}
-      </div>
-    );
-  };
-
-  const bannerContent = renderBannerContent(currentBanner);
-
-  const finalContent = currentBanner.linkUrl ? (
-    <Link href={currentBanner.linkUrl} style={{ cursor: 'pointer', display: 'block', width: '100%', height: '100%' }}>
-      {bannerContent}
-    </Link>
-  ) : bannerContent;
 
   return (
-    <div style={{ position: 'relative', width: '100%', height: '100%' }}>
+    <div
-      {finalContent}
+      className="slider w-slider"
-      
+      ref={sliderRef}
-      {/* Навигация стрелками (показываем только если баннеров больше 1) */}
+      onMouseEnter={handleMouseEnter}
-      {allBanners.length > 1 && (
+      onMouseLeave={handleMouseLeave}
-        <>
+      tabIndex={0}
-          <div 
+      style={{ position: 'relative' }}
-            onClick={handlePrevSlide}
+    >
-            style={{
+      {/* Вставляем стили для стрелок */}
-              position: 'absolute',
+      <style>{arrowStyles}{slideStyles}</style>
-              left: '10px',
+      <div className="mask w-slider-mask">
-              top: '50%',
+        {allBanners.map((banner, idx) => {
-              transform: 'translateY(-50%)',
+          let slideClass = 'pod-slider-slide';
-              background: 'rgba(0,0,0,0.5)',
+          if (idx === currentSlide) slideClass += ' active';
-              color: 'white',
+          else if (idx === (currentSlide === 0 ? allBanners.length - 1 : currentSlide - 1)) slideClass += ' prev';
-              border: 'none',
+          else if (idx === (currentSlide + 1) % allBanners.length) slideClass += ' next';
-              borderRadius: '50%',
+          const slideContent = (
-              width: '40px',
-              height: '40px',
-              display: 'flex',
-              alignItems: 'center',
-              justifyContent: 'center',
-              cursor: 'pointer',
-              zIndex: 10,
-              fontSize: '18px'
-            }}
-          >
-            ‹
-          </div>
-          <div 
-            onClick={handleNextSlide}
-            style={{
-              position: 'absolute',
-              right: '10px',
-              top: '50%',
-              transform: 'translateY(-50%)',
-              background: 'rgba(0,0,0,0.5)',
-              color: 'white',
-              border: 'none',
-              borderRadius: '50%',
-              width: '40px',
-              height: '40px',
-              display: 'flex',
-              alignItems: 'center',
-              justifyContent: 'center',
-              cursor: 'pointer',
-              zIndex: 10,
-              fontSize: '18px'
-            }}
-          >
-            ›
-          </div>
-        </>
-      )}
-
-      {/* Индикаторы слайдов (показываем только если баннеров больше 1) */}
-      {allBanners.length > 1 && (
-        <div style={{
-          position: 'absolute',
-          bottom: '10px',
-          left: '50%',
-          transform: 'translateX(-50%)',
-          display: 'flex',
-          gap: '8px',
-          zIndex: 10
-        }}>
-          {allBanners.map((_, index) => (
             <div
-              key={index}
+              className="div-block-128"
-              onClick={() => handleSlideIndicator(index)}
               style={{
-                width: '10px',
+                backgroundImage: `url(${banner.imageUrl})`,
-                height: '10px',
+                // backgroundSize: 'cover',
-                borderRadius: '50%',
+                // backgroundPosition: 'center',
-                background: index === currentSlide ? 'white' : 'rgba(255,255,255,0.5)',
+                // backgroundRepeat: 'no-repeat',
-                cursor: 'pointer',
-                transition: 'background 0.3s'
               }}
-            />
+            >
-          ))}
+              {/* Можно добавить текст поверх баннера, если нужно */}
-        </div>
+            </div>
-      )}
+          );
+          return (
+            <div
+              className={slideClass + ' slide w-slide'}
+              key={banner.id}
+              // style={{ display: idx === currentSlide ? 'block' : 'none', position: 'relative' }}
+              style={{ position: 'absolute', top: 0, left: 0, width: '100%', height: '100%' }}
+            >
+              {banner.linkUrl ? (
+                <Link href={banner.linkUrl} style={{ display: 'block', width: '100%', height: '100%' }}>{slideContent}</Link>
+              ) : slideContent}
+            </div>
+          );
+        })}
+      </div>
+      {/* SVG-стрелки как в Webflow, поверх баннера, с hover-эффектом */}
+      <button
+        className="pod-slider-arrow pod-slider-arrow-left"
+        onClick={handlePrevSlide}
+        onMouseEnter={handleMouseEnter}
+        onMouseLeave={handleMouseLeave}
+        style={{
+          opacity: showArrows ? 1 : 0,
+          pointerEvents: showArrows ? 'auto' : 'none',
+        }}
+        tabIndex={-1}
+        aria-label="Предыдущий баннер"
+      >
+        <span className="arrow-circle">
+          <svg className="arrow-svg" width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+            <path d="M16.6673 10H3.33398M3.33398 10L8.33398 5M3.33398 10L8.33398 15" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
+          </svg>
+        </span>
+      </button>
+      <button
+        className="pod-slider-arrow pod-slider-arrow-right"
+        onClick={handleNextSlide}
+        onMouseEnter={handleMouseEnter}
+        onMouseLeave={handleMouseLeave}
+        style={{
+          opacity: showArrows ? 1 : 0,
+          pointerEvents: showArrows ? 'auto' : 'none',
+        }}
+        tabIndex={-1}
+        aria-label="Следующий баннер"
+      >
+        <span className="arrow-circle">
+          <svg className="arrow-svg" width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+            <path d="M3.33398 10H16.6673M16.6673 10L11.6673 5M16.6673 10L11.6673 15" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
+          </svg>
+        </span>
+      </button>
+      <div className="slide-nav w-slider-nav w-slider-nav-invert w-round">
+        {allBanners.map((_, idx) => (
+          <div
+            key={idx}
+            className="w-slider-dot"
+            style={{
+              background: idx === currentSlide ? 'white' : 'rgba(255,255,255,0.5)',
+              borderRadius: '50%',
+              width: 10,
+              height: 10,
+              margin: 4,
+              display: 'inline-block',
+              cursor: 'pointer'
+            }}
+            onClick={() => handleSlideIndicator(idx)}
+          />
+        ))}
+      </div>
     </div>
   );
 };

src/components/profile/ProfileHistoryMain.tsx

@@ -284,7 +284,7 @@ const ProfileHistoryMain = () => {
 
   if (loading && historyItems.length === 0) {
     return (
-      <div className="flex flex-col justify-center text-base min-h-[526px] h-full">
+      <div className="flex flex-col flex-1 shrink justify-center basis-0 w-full max-md:max-w-full min-h-[526px] h-full">
         <div className="flex justify-center items-center h-40">
           <div className="text-gray-500">Загрузка истории поиска...</div>
         </div>
@@ -294,7 +294,7 @@ const ProfileHistoryMain = () => {
 
   if (error) {
     return (
-      <div className="flex flex-col justify-center text-base  min-h-[526px]">
+      <div className="flex flex-col flex-1 shrink justify-center basis-0 w-full max-md:max-w-full  min-h-[526px]">
         <div className="flex justify-center items-center h-40">
           <div className="text-red-500">Ошибка загрузки истории поиска</div>
         </div>
@@ -303,7 +303,7 @@ const ProfileHistoryMain = () => {
   }
 
   return (
-    <div className="flex flex-col min-h-[526px]">
+    <div className="flex flex-col flex-1 shrink justify-center basis-0 w-full max-md:max-w-full min-h-[526px]">
       <div className="flex gap-5 items-center px-8 py-3 w-full leading-snug text-gray-400 whitespace-nowrap bg-white rounded-lg max-md:px-5 max-md:max-w-full">
         <div className="flex-1 shrink self-stretch my-auto text-gray-400 basis-0 text-ellipsis max-md:max-w-full max-md:w-full">
           <SearchInput 

src/pages/profile-history.tsx

@@ -36,10 +36,10 @@ const ProfileHistoryPage = () => {
   return (
     <>
       <MetaTags {...metaData} />
-      <div className="page-wrapper h-full flex flex-col flex-1">
+      <div className="page-wrapper">
         <ProfileInfo />
-        <div className="flex flex-col pt-10 pb-16 max-md:px-5 h-full flex-1">
+        <div className="flex flex-col pt-10 pb-16 max-md:px-5">
-        <div className="flex relative gap-8 items-start self-stretch max-md:gap-5 max-sm:flex-col max-sm:gap-4 justify-center mx-auto min-h-[526px] max-w-[1580px] w-full h-full">
+        <div className="flex relative gap-8 items-start self-stretch max-md:gap-5 max-sm:flex-col max-sm:gap-4 justify-center mx-auto max-w-[1580px] w-full h-full">
             <LKMenu ref={menuRef} />
             <ProfileHistoryMain />
           </div>

src/pages/search-result.tsx

@@ -589,7 +589,7 @@ export default function SearchResult() {
       )}
       {/* Лучшие предложения */}
       {bestOffersData.length > 0 && (
-        <section className="section-6">
+        <section className="main">
           <div className="w-layout-blockcontainer container w-container">
             <div className="w-layout-vflex flex-block-36">
               {bestOffersData.map(({ offer, type }, index) => (

src/styles/my.css

@@ -499,7 +499,27 @@ input#VinSearchInput {
   white-space: nowrap;
 }
 
+.heading-9-copy {
+
+  text-align: right;
+  margin-left: auto;
+  display: block;
+}
+.pcs-search {
+  color: var(--_fonts---color--black);
+  font-size: var(--_fonts---font-size--core);
+  width: 200px;
+}
+
+
+
 @media (max-width: 767px) {
+  .heading-9-copy {
+    text-align: left;
+
+    display: block;
+  }
+
   .w-layout-hflex.flex-block-6 {
     flex-direction: column !important;
   }
@@ -1147,4 +1167,30 @@ a.link-block-2.w-inline-block  {
     justify-content: flex-start !important;
     align-items: flex-start !important;
   }
+}
+
+@media (max-width: 767px) {
+  .mask.w-slider-mask {
+    height: 100px !important;
+    min-height: 0 !important;
+  }
+}
+
+@media (max-width: 767px) {
+  .search-history-dropdown,
+  .search-results-dropdown,
+  .dropdown-search,
+  .dropdown-list-3.w--open {
+    position: fixed !important;
+    left: 0 !important;
+    right: 0 !important;
+    top: 72px !important; /* подберите под ваш header */
+    width: 100vw !important;
+    z-index: 9999 !important;
+    border-radius: 0 0 16px 16px !important;
+    margin: 0 !important;
+    max-width: 100vw !important;
+    background: white !important;
+    box-shadow: 0 8px 32px rgba(44,62,80,0.10), 0 1.5px 4px rgba(44,62,80,0.08) !important;
+  }
 }