/* Theme Name: Bricks Child Theme Theme URI: https://bricksbuilder.io/ Description: Use this child theme to extend Bricks. Author: Bricks Author URI: https://bricksbuilder.io/ Template: bricks Version: 1.1 Text Domain: bricks */ /* Bricks 2.x mobile nav regression fix (2026-04-16) После обновления Bricks 1.12.5 → 2.3.2 cascade layers поломали правило, которое схлопывало закрытые мобильные dropdown-submenu (Services, Process) в кастомном мобильном меню Rivo Agency (.dropdown-submenu-mobile). Без фикса Services-submenu оставался visibility:hidden, но занимал ~450px в потоке → огромные пустые промежутки между пунктами. */ @media (max-width: 991px) { li.brxe-dropdown:not(.open) > .mobile-submenu, li.brxe-dropdown:not(.open) > .brx-dropdown-content { display: none !important; } } /* Rivo Menu (ACF-driven) — стили после потери original Bricks settings (2026-04-17). После замены fhjblt (ul в nav-nested) на кастомный rivo-menu пропали: - typography (цвет/размер) родительского ul - position/shadow/radius у mega-menu card (задавались в Element settings). Восстанавливаем через child-theme. */ /* --- DESKTOP: top-level ul --- */ .rivo-menu-wrapper ul.rivo-menu--desktop { display: flex !important; flex-direction: row !important; align-items: center !important; gap: 20px !important; list-style: none !important; padding: 0 !important; margin: 0 !important; color: var(--ra-text-white) !important; font-size: 16px !important; line-height: 1 !important; } .rivo-menu-wrapper ul.rivo-menu--desktop > li { list-style: none !important; display: flex !important; align-items: center !important; } .rivo-menu-wrapper ul.rivo-menu--desktop a { color: var(--ra-text-white) !important; text-decoration: none !important; transition: color 0.2s ease; } .rivo-menu-wrapper ul.rivo-menu--desktop a:hover { color: var(--ra-header-hover, #b4d943) !important; } /* --- DESKTOP: dropdown toggle (Services/Process) --- */ .rivo-menu-wrapper ul.rivo-menu--desktop .brx-submenu-toggle { display: inline-flex; align-items: center; gap: 4px; cursor: pointer; color: var(--ra-text-white); } .rivo-menu-wrapper ul.rivo-menu--desktop .brx-submenu-toggle > span { color: var(--ra-text-white); } .rivo-menu-wrapper ul.rivo-menu--desktop .brx-submenu-toggle button { background: transparent; border: 0; padding: 0; cursor: pointer; color: inherit; display: inline-flex; } .rivo-menu-wrapper ul.rivo-menu--desktop .brx-submenu-toggle svg { width: 12px; height: 12px; } /* --- DESKTOP: mega-menu dropdown card (overlay) --- Воспроизводит оригинальные global classes eyeioe/webhnk/lemznx/wmnszr/xxikia/xwqrqk. Чтобы wrapper прижимался к viewport left, отменяем Bricks-дефолт position:relative у .brx-has-megamenu — тогда offsetParent = header (sticky, left:0). */ .rivo-menu-wrapper ul.rivo-menu--desktop li.brxe-dropdown.brx-has-megamenu { position: static !important; } .rivo-menu-wrapper .mega-menu--item--wrapper { position: absolute !important; top: 100% !important; left: 0 !important; display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 0 !important; column-gap: 0 !important; row-gap: 0 !important; width: 768px !important; min-width: 768px !important; max-width: 768px !important; padding: 0 !important; background: transparent !important; border-radius: 20px !important; box-shadow: 0 1px 20px 0 rgba(0, 0, 0, 0.012), 0 1px 32px 0 rgba(0, 0, 0, 0.02), 0 1px 36px 0 rgba(0, 0, 0, 0.02), 0 2px 60px 0 rgba(0, 0, 0, 0.08) !important; z-index: 1500 !important; overflow: hidden !important; } .rivo-menu-wrapper .services-mega-menu { grid-template-columns: 15fr 9fr !important; } .rivo-menu-wrapper .top-nav-menu--mm-section { display: flex !important; flex-direction: column !important; row-gap: 24px !important; padding: 20px !important; color: var(--ra-text-body) !important; min-width: 0 !important; } .rivo-menu-wrapper .top-nav-menu--mm-section.left { background: var(--ra-light); border: 1px solid var(--ra-gray-300); border-right: 0; border-radius: 20px 0 0 20px; } .rivo-menu-wrapper .top-nav-menu--mm-section.right { background: var(--ra-bg-surface); border: 1px solid var(--ra-gray-300); border-left: 0; border-radius: 0 20px 20px 0; } .rivo-menu-wrapper .top-nav-menu--mm-section--title { font-weight: 700 !important; font-size: 18px !important; color: var(--ra-text-body) !important; margin: 0 !important; } .rivo-menu-wrapper .dropdown-submenu-items-wrapper { display: flex !important; flex-direction: column !important; gap: 0.5rem !important; margin-left: 10px !important; height: 100% !important; } /* Services dropdown — items column-first, 5 слева + 3 справа (как в оригинале). grid-template-rows: repeat(5, auto) → первая колонка вмещает 5, остальные идут во вторую. */ .rivo-menu-wrapper .services-mega-menu .top-nav-menu--mm-section.left .dropdown-submenu-items-wrapper { display: grid !important; grid-template-columns: 1fr 1fr !important; grid-template-rows: repeat(5, auto) !important; grid-auto-flow: column !important; column-gap: 1.5rem !important; row-gap: 0.5rem !important; } /* Item links — специфично, чтобы перебить ul.rivo-menu--desktop a {color:white !important} */ .rivo-menu-wrapper ul.rivo-menu--desktop .mega-menu--item--wrapper a.mega-menu--item--link { display: block !important; padding: 2px 0 !important; text-decoration: none !important; color: var(--ra-text-body) !important; font-size: 16px !important; line-height: 1.4 !important; transition: color 0.15s ease; justify-content: left; } .rivo-menu-wrapper ul.rivo-menu--desktop .mega-menu--item--wrapper a.mega-menu--item--link:hover, .rivo-menu-wrapper ul.rivo-menu--desktop .mega-menu--item--wrapper a.mega-menu--item--link:focus { color: var(--ra-primary-l-2) !important; text-decoration: underline !important; } .rivo-menu-wrapper ul.rivo-menu--desktop a.megamenu-view-all-btn { margin-top: auto !important; align-self: flex-start !important; flex-direction: row !important; color: var(--ra-primary) !important; } .rivo-menu-wrapper ul.rivo-menu--desktop a.megamenu-view-all-btn:hover { color: var(--ra-light) !important; } /* --- MOBILE: offcanvas menu --- */ .rivo-menu-wrapper ul.rivo-menu--mobile { list-style: none !important; padding: 1rem 2rem !important; margin: 0 !important; display: flex; flex-direction: column; } .rivo-menu-wrapper ul.rivo-menu--mobile > li { list-style: none !important; border-bottom: 1px solid rgba(0, 0, 0, 0.06); } .rivo-menu-wrapper ul.rivo-menu--mobile a { display: block; padding: 1rem 1.25rem; color: #222; text-decoration: none; text-align: right; font-size: 1rem; } .rivo-menu-wrapper ul.rivo-menu--mobile .brx-submenu-toggle { display: flex; justify-content: flex-end; align-items: center; gap: 0.5rem; padding: 1rem 1.25rem; cursor: pointer; font-weight:bold; } .rivo-menu-wrapper ul.rivo-menu--mobile .brx-submenu-toggle button { background: transparent; border: 0; padding: 0; cursor: pointer; } .rivo-menu-wrapper ul.rivo-menu--mobile .mobile-submenu { list-style: none !important; padding: 0 0 1rem !important; margin: 0 !important; background: rgba(0, 0, 0, 0.02); } .rivo-menu-wrapper ul.rivo-menu--mobile .mobile-submenu li { border: 0; } .rivo-menu-wrapper ul.rivo-menu--mobile .mobile-submenu a { padding: 0.6rem 1.5rem; font-size: 0.95rem; color: #555; } /* --- MOBILE: replicate prod visual (2026-04-19) --- Фикс. px вместо rem (root font-size у Bricks 2.x = 10px → 1rem = 10px). Выравниваем offcanvas-меню staging под визуал deltadecks.com. Эталон замеров: baselines/mobile-menu-delta-375.json */ .rivo-menu-wrapper ul.rivo-menu--mobile > li { border-bottom: 1px solid rgba(128, 128, 128, 0.25) !important; } .rivo-menu-wrapper ul.rivo-menu--mobile > li.menu-item > a, .rivo-menu-wrapper ul.rivo-menu--mobile > li:not(.brxe-dropdown) > a { font-size: 16px !important; line-height: 16px !important; font-weight: 700 !important; padding: 20px 0 !important; color: rgb(54, 54, 54) !important; } .rivo-menu-wrapper ul.rivo-menu--mobile .brx-submenu-toggle { font-size: 16px !important; line-height: 24px !important; font-weight: 400 !important; padding: 20px 0 !important; color: rgb(54, 54, 54) !important; } .rivo-menu-wrapper ul.rivo-menu--mobile .mobile-submenu, .rivo-menu-wrapper ul.rivo-menu--mobile .brx-dropdown-content { padding: 0 0 16px !important; background: transparent !important; } .rivo-menu-wrapper ul.rivo-menu--mobile .mobile-submenu a, .rivo-menu-wrapper ul.rivo-menu--mobile .brx-dropdown-content a, .rivo-menu-wrapper ul.rivo-menu--mobile .brx-dropdown-content .mega-menu--item--link { padding: 10px 0 !important; font-size: 16px !important; line-height: 22.4px !important; font-weight: 400 !important; color: rgb(54, 59, 63) !important; } .rivo-menu-wrapper ul.rivo-menu--mobile .brx-submenu-toggle { font-weight: 700 !important; } /* --- MEGA-MENU: поддержка 3+ колонок (2026-04-20) --- Mega-menu был жёстко 2 колонки по 384px. С 3+ колонок третья уезжала на новую строку. Делаем авто-flow: column, ширина по количеству колонок. Services оставляет 2 колонки 15/9. */ .rivo-menu-wrapper .mega-menu--item--wrapper { grid-auto-flow: column !important; grid-auto-columns: 384px !important; grid-template-columns: none !important; width: fit-content !important; min-width: 768px !important; max-width: none !important; } .rivo-menu-wrapper .services-mega-menu { grid-auto-flow: row !important; grid-template-columns: 15fr 9fr !important; width: 768px !important; max-width: 768px !important; } .rivo-menu-wrapper .top-nav-menu--mm-section.right { border-radius: 0 !important; border-left: 0; } .rivo-menu-wrapper .top-nav-menu--mm-section.right:last-child { border-radius: 0 20px 20px 0 !important; } /* --- MOBILE dropdown: CTA-кнопка из ACF (2026-04-20) --- Стиль как у существующих footer-cta-btn в шаблоне (Deck Calculator / Request an Estimate). */ .rivo-menu-wrapper ul.rivo-menu--mobile .mobile-submenu li.mobile-cta { border-bottom: 0 !important; } .rivo-menu-wrapper ul.rivo-menu--mobile .mobile-submenu li.mobile-cta a.ra-btn { display: block !important; padding: 16px 24px !important; font-size: 16px !important; line-height: 20.8px !important; font-weight: 600 !important; color: #fff !important; background: rgb(0, 97, 32) !important; border: 1px solid rgb(0, 97, 32) !important; border-radius: 4px !important; text-align: center !important; margin: 12px 0 4px !important; } /* --- Portfolio template #2918: 2-col Materials/Challenges — schlop to 1fr when toggle=OFF (2026-04-23) --- R-col (mrcard) conditional on ACF toggle portfolio_has_right_column. Если не рендерится — grid 2fr превращается в 1fr чтобы L-col не висел половиной. Работает на tablet_portrait+. */ #brxe-mtwcol:not(:has(#brxe-mrcard)) { grid-template-columns: 1fr !important; } /* --- Portfolio template #2918 CTA — inline span переносится на новую строку (2026-04-23) --- heading рендерит '{acf_cta_heading} {acf_cta_subheading_inline}'. Без display:block subheading остаётся в одной строке с заголовком — как на компоненте gxqxol. */ #brxe-ctahead span { display: block; } /* --- Header ACF menu: desktop Deck Calculator alignment/icon (2026-04-23) Rivo Menu renders menu rows from ACF, so the calculator link lost the Bricks inline SVG and the last-item right alignment from the original header. */ @media (min-width: 992px) { .rivo-menu-wrapper ul.rivo-menu--desktop > li.menu-item:last-child > a[href*="deck-price-calculator"] { display: inline-flex !important; align-items: center !important; gap: 8px !important; min-height: 24px !important; } .rivo-menu-wrapper ul.rivo-menu--desktop > li.menu-item:last-child > a[href*="deck-price-calculator"]::before { content: "" !important; display: inline-block !important; width: 24px !important; height: 24px !important; flex: 0 0 24px !important; background-color: currentColor !important; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M16.5 6H7.5V10.5H16.5V6Z' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M19.5 20.25V3.75C19.5 3.336 19.164 3 18.75 3H5.25C4.836 3 4.5 3.336 4.5 3.75V20.25C4.5 20.664 4.836 21 5.25 21H18.75C19.164 21 19.5 20.664 19.5 20.25Z' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M8.25 15C8.871 15 9.375 14.496 9.375 13.875C9.375 13.254 8.871 12.75 8.25 12.75C7.629 12.75 7.125 13.254 7.125 13.875C7.125 14.496 7.629 15 8.25 15Z' fill='black'/%3E%3Cpath d='M8.25 18.75C8.871 18.75 9.375 18.246 9.375 17.625C9.375 17.004 8.871 16.5 8.25 16.5C7.629 16.5 7.125 17.004 7.125 17.625C7.125 18.246 7.629 18.75 8.25 18.75Z' fill='black'/%3E%3Cpath d='M12 15C12.621 15 13.125 14.496 13.125 13.875C13.125 13.254 12.621 12.75 12 12.75C11.379 12.75 10.875 13.254 10.875 13.875C10.875 14.496 11.379 15 12 15Z' fill='black'/%3E%3Cpath d='M12 18.75C12.621 18.75 13.125 18.246 13.125 17.625C13.125 17.004 12.621 16.5 12 16.5C11.379 16.5 10.875 17.004 10.875 17.625C10.875 18.246 11.379 18.75 12 18.75Z' fill='black'/%3E%3Cpath d='M15.75 15C16.371 15 16.875 14.496 16.875 13.875C16.875 13.254 16.371 12.75 15.75 12.75C15.129 12.75 14.625 13.254 14.625 13.875C14.625 14.496 15.129 15 15.75 15Z' fill='black'/%3E%3Cpath d='M15.75 18.75C16.371 18.75 16.875 18.246 16.875 17.625C16.875 17.004 16.371 16.5 15.75 16.5C15.129 16.5 14.625 17.004 14.625 17.625C14.625 18.246 15.129 18.75 15.75 18.75Z' fill='black'/%3E%3C/svg%3E") center / contain no-repeat !important; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M16.5 6H7.5V10.5H16.5V6Z' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M19.5 20.25V3.75C19.5 3.336 19.164 3 18.75 3H5.25C4.836 3 4.5 3.336 4.5 3.75V20.25C4.5 20.664 4.836 21 5.25 21H18.75C19.164 21 19.5 20.664 19.5 20.25Z' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M8.25 15C8.871 15 9.375 14.496 9.375 13.875C9.375 13.254 8.871 12.75 8.25 12.75C7.629 12.75 7.125 13.254 7.125 13.875C7.125 14.496 7.629 15 8.25 15Z' fill='black'/%3E%3Cpath d='M8.25 18.75C8.871 18.75 9.375 18.246 9.375 17.625C9.375 17.004 8.871 16.5 8.25 16.5C7.629 16.5 7.125 17.004 7.125 17.625C7.125 18.246 7.629 18.75 8.25 18.75Z' fill='black'/%3E%3Cpath d='M12 15C12.621 15 13.125 14.496 13.125 13.875C13.125 13.254 12.621 12.75 12 12.75C11.379 12.75 10.875 13.254 10.875 13.875C10.875 14.496 11.379 15 12 15Z' fill='black'/%3E%3Cpath d='M12 18.75C12.621 18.75 13.125 18.246 13.125 17.625C13.125 17.004 12.621 16.5 12 16.5C11.379 16.5 10.875 17.004 10.875 17.625C10.875 18.246 11.379 18.75 12 18.75Z' fill='black'/%3E%3Cpath d='M15.75 15C16.371 15 16.875 14.496 16.875 13.875C16.875 13.254 16.371 12.75 15.75 12.75C15.129 12.75 14.625 13.254 14.625 13.875C14.625 14.496 15.129 15 15.75 15Z' fill='black'/%3E%3Cpath d='M15.75 18.75C16.371 18.75 16.875 18.246 16.875 17.625C16.875 17.004 16.371 16.5 15.75 16.5C15.129 16.5 14.625 17.004 14.625 17.625C14.625 18.246 15.129 18.75 15.75 18.75Z' fill='black'/%3E%3C/svg%3E") center / contain no-repeat !important; } }