/** * Home layout v2 (preview) — рельса виджетов + единое командное поле. * Активно только при html[data-b2b-home-layout="v2"]. * Несущие якоря (.main-grid / .left-col / .right-col / #catalog-*) не переименовываем. */ /* ——— Бренд: вариант лого Artifact (доступен и на v1) ——— */ html[data-logo-variant="artifact"] .logo-icon { width: 34px; height: 34px; object-fit: contain; filter: drop-shadow(0 0 6px rgba(212, 175, 95, 0.28)); } /* ——— Токены атмосферы (только v2) ——— */ html[data-b2b-home-layout="v2"] { --home-v2-rail-w: 72px; --home-v2-gold: #d4af5f; --home-v2-gold-soft: rgba(212, 175, 95, 0.22); --home-v2-gold-line: rgba(212, 175, 95, 0.35); --home-v2-surface: color-mix(in srgb, var(--card-bg, #141414) 92%, #000 8%); --home-v2-cmd-radius: 14px; --home-v2-rail-slot: 52px; } html[data-b2b-home-layout="v2"][data-theme="light"] { --home-v2-surface: color-mix(in srgb, var(--card-bg, #fff) 94%, #f5efe3 6%); --home-v2-gold-soft: rgba(168, 128, 48, 0.16); --home-v2-gold-line: rgba(168, 128, 48, 0.32); } /* ——— Desktop: рельса + каталог; ширина — только data-layout-width (layout.css) ——— Раньше здесь было max-width:100% безусловно → на Nova (home-layout=v2) компактный режим (1440px) не работал вообще. Wide уже задаёт layout.css. --b2b-sidebar-w на html (не только .main-grid): .header-logo в cards.css считает width от этой переменной, чтобы молния «Часто ищут» стояла над лупой при rail 72/148 и compact/wide. На v2 колонка грида не схлопывается в 0 при sidebar-collapsed (рельса уезжает transform’ом) — html тоже держит rail-w. */ @media (min-width: 921px) { html[data-b2b-home-layout="v2"] { --b2b-sidebar-w: var(--home-v2-rail-w); } html[data-b2b-home-layout="v2"] .main-grid { --b2b-sidebar-w: var(--home-v2-rail-w); } /* Рельса 72px при любом sidebar-motion (classic/premium) */ html[data-b2b-home-layout="v2"] .main-grid:not(.sidebar-collapsed) .left-col { width: var(--home-v2-rail-w); min-width: var(--home-v2-rail-w); max-width: var(--home-v2-rail-w); } html[data-b2b-home-layout="v2"][data-sidebar-motion="premium"] .main-grid.sidebar-collapsed .left-col { transform: translateX(calc(-1 * var(--home-v2-rail-w))); } html[data-b2b-home-layout="v2"] .main-grid { overflow: visible; } html[data-b2b-home-layout="v2"] .left-col { position: relative; display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 4px 0 8px; z-index: 5; overflow: visible !important; max-height: none !important; } html[data-b2b-home-layout="v2"] .left-col > .card { width: var(--home-v2-rail-slot); min-height: var(--home-v2-rail-slot); margin: 0; border-radius: 12px; border-color: var(--home-v2-gold-soft); background: var(--home-v2-surface); box-shadow: none; overflow: visible; transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease; } html[data-b2b-home-layout="v2"] .left-col > .card:hover { border-color: var(--home-v2-gold-line); } /* Компакт: только иконка */ html[data-b2b-home-layout="v2"] .left-col > .card:not(.home-v2-rail-open) .card-header { padding: 11px; justify-content: center; } html[data-b2b-home-layout="v2"] .left-col > .card:not(.home-v2-rail-open) .card-header-left { gap: 0; justify-content: center; } html[data-b2b-home-layout="v2"] .left-col > .card:not(.home-v2-rail-open) .card-header-left > :not(.icon-circle), html[data-b2b-home-layout="v2"] .left-col > .card:not(.home-v2-rail-open) .card-header > :not(.card-header-left), html[data-b2b-home-layout="v2"] .left-col > .card:not(.home-v2-rail-open) > :not(.card-header) { display: none !important; } html[data-b2b-home-layout="v2"] .left-col > .card:not(.home-v2-rail-open) .icon-circle { cursor: pointer; } /* Открытый слот — поповер справа от рельсы */ html[data-b2b-home-layout="v2"] .left-col > .card.home-v2-rail-open { position: absolute; left: calc(100% + 10px); top: var(--home-v2-rail-top, 0px); width: min(340px, calc(100vw - 120px)); z-index: 60; border-color: var(--home-v2-gold-line); box-shadow: 0 0 0 1px var(--home-v2-gold-soft), 0 16px 40px rgba(0, 0, 0, 0.35); overflow: hidden; } html[data-b2b-home-layout="v2"] .left-col > .card.home-v2-rail-open .card-header { padding: 11px 14px 9px; border-bottom: 1px solid var(--home-v2-gold-soft); } html[data-b2b-home-layout="v2"] .sidebar-divider { opacity: 0.85; } html[data-b2b-home-layout="v2"] .sidebar-toggle-btn { border-color: var(--home-v2-gold-soft); } html[data-b2b-home-layout="v2"] .sidebar-toggle-btn:hover { border-color: var(--home-v2-gold-line); color: var(--home-v2-gold); } /* Поиск + фильтры: как в Simple/Glass — без общей внешней рамки-«капсулы» */ html[data-b2b-home-layout="v2"]:not(.main-spec-draft-view) .right-col > #search-kind-hint[hidden], html[data-b2b-home-layout="v2"]:not(.guest-landing-active):not(.guest-landing-boot) .right-col > #guest-landing[hidden] { display: none !important; } html[data-b2b-home-layout="v2"]:not(.main-spec-draft-view) .right-col > #spec-draft-toolbar-title { display: none !important; } html[data-b2b-home-layout="v2"] .right-col > .catalog-search-dock { display: block; background: transparent; border: none; border-radius: 0; padding: 0; box-shadow: none; } html[data-b2b-home-layout="v2"] .right-col > #catalog-filter-bar { background: transparent; border: none; border-radius: 0; padding: 0; margin: 0; } /* Шапка: тонкий золотой акцент */ html[data-b2b-home-layout="v2"] .header { border-bottom: 1px solid var(--home-v2-gold-soft); } } /* ——— Mobile: без рельсы — только лёгкие акценты, sheet как был ——— */ @media (max-width: 920px) { html[data-b2b-home-layout="v2"] .left-col > .card.home-v2-rail-open { position: static; width: auto; box-shadow: var(--card-shadow); } html[data-b2b-home-layout="v2"] #mobile-tabbar { border-top-color: var(--home-v2-gold-soft); } } @media (prefers-reduced-motion: reduce) { html[data-b2b-home-layout="v2"] .left-col > .card { transition: none; } }