/* ========================================================================== 🟣 AMICI CART DRAWER — TRUE FINAL OVERRIDE ========================================================================== */ html body div#bp-dw.bp-dw.is-open { position: fixed !important; inset: 0 !important; width: 100vw !important; height: 100dvh !important; z-index: 2147482500 !important; display: grid !important; place-items: center !important; padding: 24px !important; margin: 0 !important; overflow: hidden !important; box-sizing: border-box !important; opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; transform: none !important; translate: none !important; } html body div#bp-dw.bp-dw:not(.is-open) { display: none !important; opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; } html body div#bp-dw.bp-dw.is-open > .bp-dw__ov { position: fixed !important; inset: 0 !important; z-index: 1 !important; width: 100vw !important; height: 100dvh !important; background: rgba(0, 0, 0, 0.76) !important; backdrop-filter: blur(14px) saturate(1.08) !important; -webkit-backdrop-filter: blur(14px) saturate(1.08) !important; } html body div#bp-dw.bp-dw.is-open > .bp-dw__panel { position: relative !important; z-index: 2 !important; top: auto !important; right: auto !important; bottom: auto !important; left: auto !important; width: min(460px, calc(100vw - 48px)) !important; max-width: min(460px, calc(100vw - 48px)) !important; height: auto !important; max-height: calc(100dvh - 48px) !important; min-height: 0 !important; margin: 0 auto !important; padding: 0 !important; display: flex !important; flex-direction: column !important; overflow: hidden !important; box-sizing: border-box !important; transform: none !important; translate: none !important; border-radius: 28px !important; border: 1px solid rgba(192, 72, 48, 0.30) !important; background: radial-gradient(circle at 18% 8%, rgba(245, 174, 92, 0.16), transparent 32%), radial-gradient(circle at 88% 18%, rgba(122, 22, 44, 0.22), transparent 34%), radial-gradient(circle at 70% 86%, rgba(192, 72, 48, 0.18), transparent 38%), linear-gradient(180deg, #221015 0%, #170a0f 46%, #10070b 100%) !important; box-shadow: 0 34px 90px rgba(10, 0, 5, 0.78), 0 18px 44px rgba(192, 72, 48, 0.18), inset 0 1px 0 rgba(255, 235, 210, 0.08) !important; } html body div#bp-dw.bp-dw.is-open > .bp-dw__panel > .bp-dw__h, html body div#bp-dw.bp-dw.is-open > .bp-dw__panel > .bp-dw__f { flex: 0 0 auto !important; position: relative !important; z-index: 2 !important; } html body div#bp-dw.bp-dw.is-open > .bp-dw__panel > .bp-dw__b { flex: 1 1 auto !important; min-height: 0 !important; overflow-y: auto !important; overflow-x: hidden !important; -webkit-overflow-scrolling: touch !important; position: relative !important; z-index: 2 !important; } /* Mobile bottom sheet. */ @media (max-width: 680px) { html body div#bp-dw.bp-dw.is-open { place-items: end center !important; padding: 10px !important; padding-bottom: max(10px, env(safe-area-inset-bottom, 0px)) !important; } html body div#bp-dw.bp-dw.is-open > .bp-dw__panel { width: 100% !important; max-width: 100% !important; max-height: calc(100dvh - 20px) !important; border-radius: 26px 26px 18px 18px !important; } } /* ========================================================================== 🟣 LANDMARK: AMICI CART DRAWER — ABSOLUTE FINAL LOCK FIX Заключва количката в центъра и не позволява да избяга нагоре. ========================================================================== */ html body #bp-dw, html body #bp-root #bp-dw, #bp-dw, #bp-root #bp-dw { position: fixed !important; inset: 0 !important; width: 100vw !important; height: 100vh !important; height: 100dvh !important; max-width: 100vw !important; max-height: 100dvh !important; z-index: 2147482500 !important; display: none !important; place-items: center !important; padding: 24px !important; margin: 0 !important; overflow: hidden !important; box-sizing: border-box !important; transform: none !important; translate: none !important; opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; } html body #bp-dw.is-open, html body #bp-root #bp-dw.is-open, #bp-dw.is-open, #bp-root #bp-dw.is-open { display: grid !important; opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; } /* Overlay. */ html body #bp-dw .bp-dw__ov, html body #bp-root #bp-dw .bp-dw__ov, #bp-dw .bp-dw__ov, #bp-root #bp-dw .bp-dw__ov { position: fixed !important; inset: 0 !important; z-index: 1 !important; width: 100vw !important; height: 100vh !important; height: 100dvh !important; background: rgba(0, 0, 0, 0.76) !important; backdrop-filter: blur(14px) saturate(1.08) !important; -webkit-backdrop-filter: blur(14px) saturate(1.08) !important; transform: none !important; translate: none !important; } /* Самият панел. */ html body #bp-dw .bp-dw__panel, html body #bp-root #bp-dw .bp-dw__panel, #bp-dw .bp-dw__panel, #bp-root #bp-dw .bp-dw__panel { position: relative !important; top: auto !important; right: auto !important; bottom: auto !important; left: auto !important; z-index: 2 !important; width: min(460px, calc(100vw - 48px)) !important; max-width: min(460px, calc(100vw - 48px)) !important; height: auto !important; min-height: 420px !important; max-height: calc(100dvh - 48px) !important; margin: auto !important; padding: 0 !important; display: flex !important; flex-direction: column !important; overflow: hidden !important; box-sizing: border-box !important; transform: none !important; translate: none !important; opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; border-radius: 28px !important; border: 1px solid rgba(192, 72, 48, 0.30) !important; background: radial-gradient(circle at 18% 8%, rgba(245, 174, 92, 0.16), transparent 32%), radial-gradient(circle at 88% 18%, rgba(122, 22, 44, 0.22), transparent 34%), radial-gradient(circle at 70% 86%, rgba(192, 72, 48, 0.18), transparent 38%), linear-gradient(180deg, #221015 0%, #170a0f 46%, #10070b 100%) !important; box-shadow: 0 34px 90px rgba(10, 0, 5, 0.78), 0 18px 44px rgba(192, 72, 48, 0.18), inset 0 1px 0 rgba(255, 235, 210, 0.08) !important; } /* Вътрешният scroll да е вътре в панела, не да бута целия drawer нагоре. */ html body #bp-dw .bp-dw__h, html body #bp-dw .bp-dw__f, #bp-dw .bp-dw__h, #bp-dw .bp-dw__f { flex: 0 0 auto !important; position: relative !important; z-index: 2 !important; } html body #bp-dw .bp-dw__b, #bp-dw .bp-dw__b { flex: 1 1 auto !important; min-height: 0 !important; overflow-y: auto !important; overflow-x: hidden !important; -webkit-overflow-scrolling: touch !important; position: relative !important; z-index: 2 !important; } /* Footer да не става fixed и да не избутва панела. */ html body #bp-dw .bp-dw__f, #bp-dw .bp-dw__f { bottom: auto !important; top: auto !important; transform: none !important; translate: none !important; } /* Mobile: bottom sheet. */ @media (max-width: 680px) { html body #bp-dw, html body #bp-root #bp-dw, #bp-dw, #bp-root #bp-dw { place-items: end center !important; padding: 10px !important; padding-bottom: max(10px, env(safe-area-inset-bottom, 0px)) !important; } html body #bp-dw .bp-dw__panel, html body #bp-root #bp-dw .bp-dw__panel, #bp-dw .bp-dw__panel, #bp-root #bp-dw .bp-dw__panel { width: 100% !important; max-width: 100% !important; min-height: 0 !important; max-height: calc(100dvh - 20px) !important; margin: 0 auto !important; border-radius: 26px 26px 18px 18px !important; } } /* ========================================================================== 🟣 LANDMARK: AMICI PRODUCT CARDS — ONE SIZE + TWO ACTIONS ========================================================================== */ /* Скриваме старите 2 размера и старите BroPizza plus бутони, ако някъде останат. */ #bp-root .bp-add2.is-family, #bp-root .bp-plus-btn.is-family-plus, #bp-root .bp-fav-split--family { display: none !important; } /* Новият action holder. */ #bp-root .bp-amici-actions { display: grid !important; grid-template-columns: 1fr !important; gap: 10px !important; width: 100% !important; margin-top: 14px !important; } /* Основен Amici бутон. */ #bp-root .bp-amici-order-btn { width: 100% !important; min-height: 68px !important; display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; align-items: center !important; gap: 14px !important; padding: 14px 16px !important; border-radius: 20px !important; border: 1px solid rgba(224, 188, 122, 0.28) !important; background: radial-gradient(circle at 12% 0%, rgba(224, 188, 122, 0.14), transparent 38%), linear-gradient(135deg, rgba(44, 22, 18, 0.98), rgba(98, 36, 28, 0.92) 52%, rgba(36, 16, 18, 0.98)) !important; box-shadow: 0 14px 32px rgba(10, 0, 5, 0.34), inset 0 1px 0 rgba(255, 235, 210, 0.10) !important; cursor: pointer !important; text-align: left !important; transition: transform 0.18s ease, filter 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease !important; } #bp-root .bp-amici-order-btn:hover { transform: translateY(-2px) !important; filter: brightness(1.05) !important; border-color: rgba(224, 188, 122, 0.46) !important; box-shadow: 0 18px 42px rgba(10, 0, 5, 0.42), 0 0 0 1px rgba(224, 188, 122, 0.12), inset 0 1px 0 rgba(255, 235, 210, 0.14) !important; } #bp-root .bp-amici-order-btn__left { min-width: 0 !important; } #bp-root .bp-amici-order-btn__label { font-family: "Oswald", "Nunito", system-ui, sans-serif !important; font-size: 17px !important; font-weight: 800 !important; line-height: 1.05 !important; letter-spacing: 0.08em !important; text-transform: uppercase !important; color: #F5EAD8 !important; } #bp-root .bp-amici-order-btn__sub { margin-top: 6px !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 12px !important; font-weight: 800 !important; line-height: 1.2 !important; color: rgba(245, 234, 216, 0.56) !important; } #bp-root .bp-amici-order-btn__price { min-width: 88px !important; padding-left: 14px !important; border-left: 1px solid rgba(245, 234, 216, 0.12) !important; text-align: right !important; } #bp-root .bp-amici-order-btn__price span { display: block !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 25px !important; font-style: italic !important; font-weight: 600 !important; line-height: 1 !important; color: #E0BC7A !important; } #bp-root .bp-amici-order-btn__price small { display: block !important; margin-top: 7px !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 12px !important; font-weight: 900 !important; line-height: 1 !important; color: rgba(245, 234, 216, 0.56) !important; } /* Вторият бутон — добавки. */ #bp-root .bp-amici-order-btn--plus { background: radial-gradient(circle at 12% 0%, rgba(224, 188, 122, 0.18), transparent 38%), linear-gradient(135deg, rgba(82, 45, 22, 0.98), rgba(128, 76, 30, 0.92) 52%, rgba(38, 20, 15, 0.98)) !important; } #bp-root .bp-amici-order-btn__plus { width: 42px !important; height: 42px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; border-radius: 999px !important; background: radial-gradient(circle at 30% 20%, rgba(255,255,255,0.34), transparent 42%), linear-gradient(135deg, #F5A800, #E0BC7A) !important; color: #180B13 !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 25px !important; font-weight: 950 !important; line-height: 1 !important; box-shadow: 0 12px 26px rgba(224, 188, 122, 0.22), inset 0 1px 0 rgba(255,255,255,0.32) !important; } /* Disabled. */ #bp-root .bp-amici-order-btn.is-disabled, #bp-root .bp-amici-order-btn:disabled { opacity: 0.46 !important; cursor: not-allowed !important; filter: grayscale(0.2) brightness(0.78) !important; transform: none !important; } /* Ако старият bp-adds остане на някои карти, поне да не показва фамилен размер. */ #bp-root .bp-adds { grid-template-columns: 1fr !important; } #bp-root .bp-add2.is-classic { width: 100% !important; } /* Mobile. */ @media (max-width: 680px) { #bp-root .bp-amici-actions { gap: 9px !important; margin-top: 12px !important; } #bp-root .bp-amici-order-btn { min-height: 62px !important; padding: 12px 13px !important; border-radius: 18px !important; } #bp-root .bp-amici-order-btn__label { font-size: 14px !important; } #bp-root .bp-amici-order-btn__sub { font-size: 11px !important; } #bp-root .bp-amici-order-btn__price { min-width: 76px !important; padding-left: 10px !important; } #bp-root .bp-amici-order-btn__price span { font-size: 21px !important; } #bp-root .bp-amici-order-btn__plus { width: 38px !important; height: 38px !important; font-size: 23px !important; } } /* ========================================================================== 🟣 LANDMARK: AMICI CATEGORY ICONS — RESTORE OLD ICON CARD STYLE Връща старите големи икони над текста. Скрива новите emoji span и ползва ::before иконите както беше. ========================================================================== */ #bp-root .bp-cats, #bp-root #bp-types { display: flex !important; align-items: stretch !important; justify-content: flex-start !important; gap: 14px !important; width: 100% !important; max-width: 100% !important; margin: 22px 0 26px !important; padding: 4px 2px 12px !important; overflow-x: auto !important; overflow-y: visible !important; scroll-snap-type: x proximity !important; -webkit-overflow-scrolling: touch !important; background: transparent !important; border: 0 !important; box-shadow: none !important; border-radius: 0 !important; } #bp-root .bp-cats::-webkit-scrollbar, #bp-root #bp-types::-webkit-scrollbar { height: 6px !important; } #bp-root .bp-cats::-webkit-scrollbar-track, #bp-root #bp-types::-webkit-scrollbar-track { background: rgba(245, 234, 216, 0.05) !important; border-radius: 999px !important; } #bp-root .bp-cats::-webkit-scrollbar-thumb, #bp-root #bp-types::-webkit-scrollbar-thumb { background: linear-gradient(90deg, #8A2E18, #C04830, #E0BC7A) !important; border-radius: 999px !important; } /* Самите категории като стари free icon cards. */ #bp-root .bp-cat[data-type] { flex: 0 0 auto !important; scroll-snap-align: start !important; width: 132px !important; min-width: 132px !important; min-height: 122px !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; gap: 10px !important; padding: 14px 12px !important; border-radius: 28px !important; border: 1px solid rgba(245, 234, 216, 0.10) !important; background: radial-gradient(circle at 50% 12%, rgba(207, 160, 96, 0.10), transparent 42%), linear-gradient(180deg, rgba(245, 220, 190, 0.045), rgba(245, 200, 170, 0.015)), rgba(192, 72, 48, 0.035) !important; box-shadow: 0 14px 34px rgba(10, 0, 5, 0.26), inset 0 1px 0 rgba(255, 255, 255, 0.045) !important; color: rgba(245, 234, 216, 0.82) !important; font-family: "Oswald", "Nunito", system-ui, sans-serif !important; font-size: 14px !important; font-weight: 800 !important; line-height: 1.08 !important; letter-spacing: 0.10em !important; text-transform: uppercase !important; text-align: center !important; cursor: pointer !important; touch-action: manipulation !important; transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease, color 0.18s ease !important; } /* Скриваме новите emoji span и оставяме старите ::before икони. */ #bp-root .bp-cat__icon { display: none !important; } #bp-root .bp-cat__text { display: block !important; line-height: 1.08 !important; } /* Големите стари икони над текста. */ #bp-root .bp-cat[data-type]::before { content: "" !important; display: flex !important; align-items: center !important; justify-content: center !important; width: 58px !important; height: 58px !important; min-width: 58px !important; min-height: 58px !important; margin: 0 !important; font-size: 38px !important; line-height: 1 !important; border-radius: 22px !important; background: radial-gradient(circle at 35% 25%, rgba(255, 255, 255, 0.22), transparent 44%), linear-gradient(145deg, rgba(192, 72, 48, 0.22), rgba(207, 160, 96, 0.12)) !important; border: 1px solid rgba(207, 160, 96, 0.18) !important; box-shadow: 0 10px 24px rgba(10, 0, 5, 0.24), 0 0 22px rgba(192, 72, 48, 0.10) !important; transform: translateZ(0) !important; } /* Конкретни стари икони. */ #bp-root .bp-cat[data-type="Оферти"]::before { content: "🔥" !important; } #bp-root .bp-cat[data-type="Пици"]::before { content: "" !important; background-image: radial-gradient(circle at 34% 24%, rgba(255,255,255,0.28), transparent 46%), url("https://amicipizza.bg/wp-content/uploads/2026/05/ChatGPT-Image-May-10-2026-12_25_31-AM-Edited.png") !important; background-size: cover, 98% auto !important; background-position: center, center !important; background-repeat: no-repeat, no-repeat !important; background-color: transparent !important; } #bp-root .bp-cat[data-type="Паста"]::before { content: "🍝" !important; } #bp-root .bp-cat[data-type="Салати"]::before { content: "🥗" !important; } #bp-root .bp-cat[data-type="Напитки"]::before { content: "🥤" !important; } #bp-root .bp-cat[data-type="Десерти"]::before { content: "🍮" !important; } /* Hover. */ #bp-root .bp-cat[data-type]:hover { transform: translateY(-3px) !important; color: #F5EAD8 !important; border-color: rgba(207, 160, 96, 0.28) !important; background: radial-gradient(circle at 50% 18%, rgba(207, 160, 96, 0.16), transparent 44%), linear-gradient(180deg, rgba(245, 220, 190, 0.075), rgba(245, 200, 170, 0.026)), rgba(192, 72, 48, 0.06) !important; box-shadow: 0 18px 42px rgba(10, 0, 5, 0.32), 0 0 0 1px rgba(192, 72, 48, 0.10), inset 0 1px 0 rgba(255, 255, 255, 0.06) !important; } /* Active. */ #bp-root .bp-cat[data-type].is-active { transform: translateY(-2px) !important; color: #180B13 !important; border-color: rgba(245, 188, 82, 0.52) !important; background: radial-gradient(circle at 40% 18%, rgba(255, 255, 255, 0.32), transparent 38%), linear-gradient(135deg, #F5A800 0%, #FFD15C 52%, #E0BC7A 100%) !important; box-shadow: 0 20px 48px rgba(245, 168, 0, 0.26), 0 12px 28px rgba(10, 0, 5, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.28) !important; } #bp-root .bp-cat[data-type].is-active::before { transform: translateY(-1px) scale(1.08) !important; border-color: rgba(24, 11, 19, 0.12) !important; box-shadow: 0 12px 28px rgba(10, 0, 5, 0.20), 0 0 28px rgba(255, 255, 255, 0.14) !important; } /* Mobile. */ @media (max-width: 680px) { #bp-root .bp-cats, #bp-root #bp-types { gap: 12px !important; margin: 18px 0 22px !important; padding: 4px 2px 10px !important; } #bp-root .bp-cat[data-type] { width: 104px !important; min-width: 104px !important; min-height: 108px !important; padding: 12px 10px !important; border-radius: 24px !important; font-size: 11px !important; letter-spacing: 0.09em !important; } #bp-root .bp-cat[data-type]::before { width: 54px !important; height: 54px !important; min-width: 54px !important; min-height: 54px !important; font-size: 34px !important; border-radius: 20px !important; } } /* Small mobile. */ @media (max-width: 400px) { #bp-root .bp-cat[data-type] { width: 92px !important; min-width: 92px !important; min-height: 96px !important; font-size: 10.5px !important; } #bp-root .bp-cat[data-type]::before { width: 50px !important; height: 50px !important; min-width: 50px !important; min-height: 50px !important; font-size: 32px !important; } } /* ========================================================================== 🟣 LANDMARK: AMICI MENU — HORIZONTAL PRODUCT SLIDER RESTORE Цел: - продуктите/пиците да се разглеждат настрани; - НЕ връщаме BroPizza card layout; - пазим актуалната Amici визия; - работи за всички категории. ========================================================================== */ #bp-root #bp-menu { overflow: visible !important; } #bp-root #bp-grid { display: flex !important; grid-template-columns: none !important; grid-auto-flow: unset !important; width: 100% !important; max-width: 100% !important; gap: 16px !important; overflow-x: auto !important; overflow-y: visible !important; padding: 8px 4px 22px !important; scroll-snap-type: x mandatory !important; scroll-padding-left: 4px !important; -webkit-overflow-scrolling: touch !important; scrollbar-width: thin !important; } /* WebKit scrollbar. */ #bp-root #bp-grid::-webkit-scrollbar { height: 8px !important; } #bp-root #bp-grid::-webkit-scrollbar-track { background: rgba(245, 234, 216, 0.06) !important; border-radius: 999px !important; } #bp-root #bp-grid::-webkit-scrollbar-thumb { background: linear-gradient(90deg, #8A2E18, #C04830, #E0BC7A) !important; border-radius: 999px !important; } /* Product cards като хоризонтални слайд карти. */ #bp-root #bp-grid > .bp-p { flex: 0 0 min(360px, 84vw) !important; width: min(360px, 84vw) !important; max-width: min(360px, 84vw) !important; scroll-snap-align: start !important; scroll-snap-stop: always !important; margin: 0 !important; } /* Оферти може да са малко по-широки. */ #bp-root #bp-grid > .bp-p:has([data-open-offer]) { flex-basis: min(440px, 88vw) !important; width: min(440px, 88vw) !important; max-width: min(440px, 88vw) !important; } /* Напитки и малки продукти да не стават прекалено големи. */ #bp-root #bp-grid.bp-grid--drinks > .bp-p { flex-basis: min(300px, 78vw) !important; width: min(300px, 78vw) !important; max-width: min(300px, 78vw) !important; } /* Mobile — по-естествен swipe. */ @media (max-width: 680px) { #bp-root #bp-grid { gap: 14px !important; padding: 6px 2px 20px !important; } #bp-root #bp-grid > .bp-p { flex-basis: 86vw !important; width: 86vw !important; max-width: 86vw !important; } #bp-root #bp-grid > .bp-p:has([data-open-offer]) { flex-basis: 88vw !important; width: 88vw !important; max-width: 88vw !important; } #bp-root #bp-grid.bp-grid--drinks > .bp-p { flex-basis: 78vw !important; width: 78vw !important; max-width: 78vw !important; } } /* Small mobile. */ @media (max-width: 400px) { #bp-root #bp-grid > .bp-p { flex-basis: 88vw !important; width: 88vw !important; max-width: 88vw !important; } #bp-root #bp-grid.bp-grid--drinks > .bp-p { flex-basis: 80vw !important; width: 80vw !important; max-width: 80vw !important; } } /* ========================================================================== 🟣 LANDMARK: AMICI CART DRAWER — FINAL CENTERED VIEWPORT FIX 2026 Fix: - количката вече не стои горе вдясно; - панелът е центриран на desktop; - на mobile става чист bottom sheet; - работи дори когато #bp-dw е извън #bp-root; - пази стария Amici wine/sunset стил. ========================================================================== */ html body #bp-dw, html body #bp-root #bp-dw, #bp-dw, #bp-root #bp-dw { position: fixed !important; inset: 0 !important; z-index: 2147482500 !important; width: 100vw !important; height: 100vh !important; height: 100dvh !important; max-width: 100vw !important; max-height: 100dvh !important; display: none !important; align-items: center !important; justify-content: center !important; padding: 24px !important; margin: 0 !important; box-sizing: border-box !important; overflow: hidden !important; opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; transform: none !important; translate: none !important; } html body #bp-dw.is-open, html body #bp-root #bp-dw.is-open, #bp-dw.is-open, #bp-root #bp-dw.is-open { display: flex !important; opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; } /* Overlay. */ html body #bp-dw .bp-dw__ov, html body #bp-root #bp-dw .bp-dw__ov, #bp-dw .bp-dw__ov, #bp-root #bp-dw .bp-dw__ov { position: fixed !important; inset: 0 !important; z-index: 1 !important; width: 100vw !important; height: 100vh !important; height: 100dvh !important; opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; background: rgba(0, 0, 0, 0.74) !important; backdrop-filter: blur(14px) saturate(1.08) !important; -webkit-backdrop-filter: blur(14px) saturate(1.08) !important; } /* Main panel — desktop centered modal. */ html body #bp-dw .bp-dw__panel, html body #bp-root #bp-dw .bp-dw__panel, #bp-dw .bp-dw__panel, #bp-root #bp-dw .bp-dw__panel { position: relative !important; top: auto !important; right: auto !important; bottom: auto !important; left: auto !important; z-index: 2 !important; width: min(460px, calc(100vw - 48px)) !important; max-width: min(460px, calc(100vw - 48px)) !important; height: auto !important; min-height: 0 !important; max-height: calc(100dvh - 48px) !important; display: flex !important; flex-direction: column !important; margin: 0 auto !important; padding: 0 !important; overflow: hidden !important; transform: none !important; translate: none !important; opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; border-radius: 28px !important; border: 1px solid rgba(192, 72, 48, 0.30) !important; background: radial-gradient(circle at 18% 8%, rgba(245, 174, 92, 0.16), transparent 32%), radial-gradient(circle at 88% 18%, rgba(122, 22, 44, 0.22), transparent 34%), radial-gradient(circle at 70% 86%, rgba(192, 72, 48, 0.18), transparent 38%), linear-gradient(180deg, #221015 0%, #170a0f 46%, #10070b 100%) !important; box-shadow: 0 34px 90px rgba(10, 0, 5, 0.78), 0 18px 44px rgba(192, 72, 48, 0.18), inset 0 1px 0 rgba(255, 235, 210, 0.08) !important; } /* Decorative inner glow. */ html body #bp-dw .bp-dw__panel::before, html body #bp-root #bp-dw .bp-dw__panel::before, #bp-dw .bp-dw__panel::before, #bp-root #bp-dw .bp-dw__panel::before { content: "" !important; position: absolute !important; inset: 0 !important; z-index: 0 !important; pointer-events: none !important; background: linear-gradient(135deg, rgba(255, 235, 210, 0.08), transparent 34%), radial-gradient(circle at 50% 0%, rgba(224, 188, 122, 0.10), transparent 46%) !important; opacity: 0.78 !important; } /* Header/body/footer над декоративния слой. */ html body #bp-dw .bp-dw__h, html body #bp-dw .bp-dw__b, html body #bp-dw .bp-dw__f, #bp-dw .bp-dw__h, #bp-dw .bp-dw__b, #bp-dw .bp-dw__f { position: relative !important; z-index: 1 !important; } html body #bp-dw .bp-dw__h, #bp-dw .bp-dw__h { flex: 0 0 auto !important; } html body #bp-dw .bp-dw__b, #bp-dw .bp-dw__b { flex: 1 1 auto !important; min-height: 0 !important; overflow-y: auto !important; overflow-x: hidden !important; -webkit-overflow-scrolling: touch !important; } html body #bp-dw .bp-dw__f, #bp-dw .bp-dw__f { flex: 0 0 auto !important; position: relative !important; bottom: auto !important; } /* Desktop: ако съдържанието е малко, пак да изглежда като premium modal. */ @media (min-width: 681px) { html body #bp-dw .bp-dw__panel, html body #bp-root #bp-dw .bp-dw__panel, #bp-dw .bp-dw__panel, #bp-root #bp-dw .bp-dw__panel { min-height: 420px !important; } } /* Mobile: clean bottom sheet. */ @media (max-width: 680px) { html body #bp-dw, html body #bp-root #bp-dw, #bp-dw, #bp-root #bp-dw { align-items: flex-end !important; justify-content: center !important; padding: 10px !important; padding-bottom: max(10px, env(safe-area-inset-bottom, 0px)) !important; } html body #bp-dw .bp-dw__panel, html body #bp-root #bp-dw .bp-dw__panel, #bp-dw .bp-dw__panel, #bp-root #bp-dw .bp-dw__panel { width: 100% !important; max-width: 100% !important; height: auto !important; max-height: calc(100dvh - 20px) !important; border-radius: 26px 26px 18px 18px !important; transform: none !important; translate: none !important; } } /* Small mobile. */ @media (max-width: 400px) { html body #bp-dw, html body #bp-root #bp-dw, #bp-dw, #bp-root #bp-dw { padding: 8px !important; padding-bottom: max(8px, env(safe-area-inset-bottom, 0px)) !important; } html body #bp-dw .bp-dw__panel, html body #bp-root #bp-dw .bp-dw__panel, #bp-dw .bp-dw__panel, #bp-root #bp-dw .bp-dw__panel { max-height: calc(100dvh - 16px) !important; border-radius: 22px 22px 16px 16px !important; } } /* ========================================================================== 🟣 LANDMARK: AMICI FLOATING CART — FINAL 2026 RESTORE / BODY-SAFE Цел: - количката да се вижда винаги; - да работи, когато JS я премести в document.body; - да не зависи само от #bp-root; - да стои долу вдясно, професионално и стабилно; - да не бъде скрита от Elementor, drawer, modals или стар CSS. ========================================================================== */ /* 1) Глобална защита — бутонът може да е извън #bp-root. */ #bp-floating-cart, body #bp-floating-cart, html body #bp-floating-cart, .bp-floating-cart, body .bp-floating-cart, html body .bp-floating-cart, #bp-root .bp-floating-cart, body #bp-root .bp-floating-cart, html body #bp-root .bp-floating-cart { position: fixed !important; right: 18px !important; bottom: calc(74px + env(safe-area-inset-bottom, 0px)) !important; left: auto !important; top: auto !important; z-index: 2147483000 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 66px !important; height: 66px !important; min-width: 66px !important; min-height: 66px !important; max-width: 66px !important; max-height: 66px !important; padding: 0 !important; margin: 0 !important; opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; transform: none !important; translate: none !important; isolation: isolate !important; user-select: none !important; -webkit-tap-highlight-color: transparent !important; cursor: pointer !important; outline: none !important; color: var(--bp-cart-icon-color, #F5EAD8) !important; border: 1px solid var(--bp-cart-border, rgba(192, 72, 48, 0.42)) !important; border-radius: 999px !important; background: radial-gradient(circle at 28% 20%, rgba(255, 230, 200, 0.24), transparent 36%), linear-gradient( 135deg, var(--bp-cart-grad-a, #8A2E18) 0%, var(--bp-cart-grad-b, #C04830) 48%, var(--bp-cart-grad-c, #D06858) 100% ) !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.22), 0 20px 46px rgba(10, 0, 5, 0.58), 0 14px 34px rgba(192, 72, 48, 0.36), 0 0 0 1px rgba(245, 234, 216, 0.08) !important; filter: none !important; transition: transform 0.18s ease, box-shadow 0.22s ease, filter 0.22s ease, background 0.28s ease, border-color 0.28s ease !important; } /* 2) Hover / active. */ #bp-floating-cart:hover, body #bp-floating-cart:hover, html body #bp-floating-cart:hover, .bp-floating-cart:hover, body .bp-floating-cart:hover, html body .bp-floating-cart:hover, #bp-root .bp-floating-cart:hover { transform: translateY(-2px) scale(1.03) !important; filter: brightness(1.06) !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.26), 0 26px 58px rgba(10, 0, 5, 0.66), 0 18px 42px rgba(192, 72, 48, 0.46), 0 0 0 1px rgba(245, 234, 216, 0.12) !important; } #bp-floating-cart:active, body #bp-floating-cart:active, html body #bp-floating-cart:active, .bp-floating-cart:active, body .bp-floating-cart:active, html body .bp-floating-cart:active, #bp-root .bp-floating-cart:active { transform: translateY(0) scale(0.98) !important; } /* 3) Shine layer. */ #bp-floating-cart::before, body #bp-floating-cart::before, html body #bp-floating-cart::before, .bp-floating-cart::before, body .bp-floating-cart::before, html body .bp-floating-cart::before, #bp-root .bp-floating-cart::before { content: "" !important; position: absolute !important; inset: 0 !important; z-index: 1 !important; pointer-events: none !important; border-radius: inherit !important; background: radial-gradient( 52px 52px at 30% 28%, var(--bp-cart-shine, rgba(255, 230, 200, 0.30)), transparent 62% ), linear-gradient(180deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0)) !important; } /* 4) Glow layer. */ #bp-floating-cart::after, body #bp-floating-cart::after, html body #bp-floating-cart::after, .bp-floating-cart::after, body .bp-floating-cart::after, html body .bp-floating-cart::after, #bp-root .bp-floating-cart::after { content: "" !important; position: absolute !important; inset: -10px !important; z-index: -1 !important; pointer-events: none !important; opacity: 0.62 !important; filter: blur(14px) !important; border-radius: inherit !important; background: radial-gradient( circle, rgba(192, 72, 48, 0.28) 0%, rgba(192, 72, 48, 0.14) 38%, transparent 74% ) !important; } /* 5) Icon. */ #bp-floating-cart .bp-floating-cart__icon, body #bp-floating-cart .bp-floating-cart__icon, html body #bp-floating-cart .bp-floating-cart__icon, .bp-floating-cart .bp-floating-cart__icon, body .bp-floating-cart .bp-floating-cart__icon, html body .bp-floating-cart .bp-floating-cart__icon, #bp-root .bp-floating-cart .bp-floating-cart__icon { position: relative !important; z-index: 2 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 34px !important; height: 34px !important; color: var(--bp-cart-icon-color, #F5EAD8) !important; transform: translateY(1px) !important; opacity: 1 !important; visibility: visible !important; } #bp-floating-cart .bp-floating-cart__icon svg, body #bp-floating-cart .bp-floating-cart__icon svg, html body #bp-floating-cart .bp-floating-cart__icon svg, .bp-floating-cart .bp-floating-cart__icon svg, body .bp-floating-cart .bp-floating-cart__icon svg, html body .bp-floating-cart .bp-floating-cart__icon svg, #bp-root .bp-floating-cart .bp-floating-cart__icon svg { display: block !important; width: 34px !important; height: 34px !important; color: currentColor !important; fill: none !important; stroke: currentColor !important; } /* 6) Count badge. */ #bp-floating-cart .bp-floating-cart__count, body #bp-floating-cart .bp-floating-cart__count, html body #bp-floating-cart .bp-floating-cart__count, .bp-floating-cart .bp-floating-cart__count, body .bp-floating-cart .bp-floating-cart__count, html body .bp-floating-cart .bp-floating-cart__count, #bp-root .bp-floating-cart .bp-floating-cart__count { position: absolute !important; top: -3px !important; right: -2px !important; z-index: 3 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; min-width: 24px !important; height: 24px !important; padding: 0 7px !important; color: var(--bp-cart-badge-color, #180B13) !important; font-family: "Oswald", "Nunito", system-ui, sans-serif !important; font-size: 12px !important; font-weight: 900 !important; line-height: 1 !important; border-radius: 999px !important; background: linear-gradient( 135deg, var(--bp-cart-badge-a, #F5EAD8), var(--bp-cart-badge-b, #FFFFFF) ) !important; box-shadow: 0 10px 24px rgba(0, 0, 0, 0.28), 0 0 0 4px rgba(245, 234, 216, 0.10) !important; } /* 7) Empty cart — пак да се вижда, но малко по-спокойно. */ #bp-floating-cart.is-empty, body #bp-floating-cart.is-empty, html body #bp-floating-cart.is-empty, .bp-floating-cart.is-empty, body .bp-floating-cart.is-empty, html body .bp-floating-cart.is-empty, #bp-root .bp-floating-cart.is-empty { opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; filter: saturate(0.92) brightness(0.96) !important; } /* 8) Когато drawer/modals са отворени, количката да не изчезва зад тях. */ body:has(#bp-dw.is-open) #bp-floating-cart, body:has(#bp-modal.is-open) #bp-floating-cart, body:has(#bp-auth.is-open) #bp-floating-cart, body:has(#bp-plus-modal.is-open) #bp-floating-cart, body:has(#bp-combo-modal.is-open) #bp-floating-cart, body:has(#bp-quick-offer-modal.is-open) #bp-floating-cart, body:has(#bp-delivery-map-modal.is-open) #bp-floating-cart { z-index: 2147483000 !important; } /* 9) Mobile position. */ @media (max-width: 680px) { #bp-floating-cart, body #bp-floating-cart, html body #bp-floating-cart, .bp-floating-cart, body .bp-floating-cart, html body .bp-floating-cart, #bp-root .bp-floating-cart, body #bp-root .bp-floating-cart, html body #bp-root .bp-floating-cart { right: 14px !important; bottom: calc(72px + env(safe-area-inset-bottom, 0px)) !important; width: 60px !important; height: 60px !important; min-width: 60px !important; min-height: 60px !important; max-width: 60px !important; max-height: 60px !important; } #bp-floating-cart .bp-floating-cart__icon, #bp-floating-cart .bp-floating-cart__icon svg, .bp-floating-cart .bp-floating-cart__icon, .bp-floating-cart .bp-floating-cart__icon svg, #bp-root .bp-floating-cart .bp-floating-cart__icon, #bp-root .bp-floating-cart .bp-floating-cart__icon svg { width: 32px !important; height: 32px !important; } #bp-floating-cart .bp-floating-cart__count, .bp-floating-cart .bp-floating-cart__count, #bp-root .bp-floating-cart .bp-floating-cart__count { top: -2px !important; right: -1px !important; min-width: 22px !important; height: 22px !important; font-size: 11px !important; } } /* 10) Small mobile. */ @media (max-width: 400px) { #bp-floating-cart, body #bp-floating-cart, html body #bp-floating-cart, .bp-floating-cart, body .bp-floating-cart, html body .bp-floating-cart, #bp-root .bp-floating-cart, body #bp-root .bp-floating-cart, html body #bp-root .bp-floating-cart { right: 12px !important; bottom: calc(70px + env(safe-area-inset-bottom, 0px)) !important; width: 56px !important; height: 56px !important; min-width: 56px !important; min-height: 56px !important; max-width: 56px !important; max-height: 56px !important; } #bp-floating-cart .bp-floating-cart__icon, #bp-floating-cart .bp-floating-cart__icon svg, .bp-floating-cart .bp-floating-cart__icon, .bp-floating-cart .bp-floating-cart__icon svg, #bp-root .bp-floating-cart .bp-floating-cart__icon, #bp-root .bp-floating-cart .bp-floating-cart__icon svg { width: 30px !important; height: 30px !important; } } /* 11) Ultra safety: ако някой wrapper има overflow/transform, бутонът пак да стои fixed. */ html body > #bp-floating-cart, html body > .bp-floating-cart { position: fixed !important; contain: none !important; } /* 12) Защита от Elementor/WordPress display overrides. */ .elementor-widget-container #bp-floating-cart, .elementor-widget-container .bp-floating-cart, .entry-content #bp-floating-cart, .entry-content .bp-floating-cart, .site-content #bp-floating-cart, .site-content .bp-floating-cart { display: inline-flex !important; opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; } /* ========================================================================== 🟣 LANDMARK: AMICI FLOATING CART — FINAL POSITION FIX Фикс: количката беше много нагоре и надясно след връщане на стар CSS. ========================================================================== */ #bp-floating-cart, body #bp-floating-cart, html body #bp-floating-cart, #bp-root .bp-floating-cart, body #bp-root .bp-floating-cart, html body #bp-root .bp-floating-cart { position: fixed !important; right: max(16px, env(safe-area-inset-right, 0px)) !important; bottom: max(22px, env(safe-area-inset-bottom, 0px)) !important; left: auto !important; top: auto !important; width: 64px !important; height: 64px !important; min-width: 64px !important; min-height: 64px !important; max-width: 64px !important; max-height: 64px !important; transform: none !important; translate: none !important; z-index: 2147482600 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; border-radius: 999px !important; } #bp-floating-cart .bp-floating-cart__icon, #bp-floating-cart .bp-floating-cart__icon svg, #bp-root .bp-floating-cart .bp-floating-cart__icon, #bp-root .bp-floating-cart .bp-floating-cart__icon svg { width: 34px !important; height: 34px !important; } #bp-floating-cart .bp-floating-cart__count, #bp-root .bp-floating-cart .bp-floating-cart__count { top: -3px !important; right: -3px !important; min-width: 24px !important; height: 24px !important; font-size: 12px !important; } /* Mobile: малко по-нагоре, за да не опира в долния ръб/browser bar. */ @media (max-width: 680px) { #bp-floating-cart, body #bp-floating-cart, html body #bp-floating-cart, #bp-root .bp-floating-cart, body #bp-root .bp-floating-cart, html body #bp-root .bp-floating-cart { right: max(14px, env(safe-area-inset-right, 0px)) !important; bottom: calc(24px + env(safe-area-inset-bottom, 0px)) !important; width: 60px !important; height: 60px !important; min-width: 60px !important; min-height: 60px !important; max-width: 60px !important; max-height: 60px !important; } } @media (max-width: 400px) { #bp-floating-cart, body #bp-floating-cart, html body #bp-floating-cart, #bp-root .bp-floating-cart, body #bp-root .bp-floating-cart, html body #bp-root .bp-floating-cart { right: max(12px, env(safe-area-inset-right, 0px)) !important; bottom: calc(22px + env(safe-area-inset-bottom, 0px)) !important; width: 58px !important; height: 58px !important; min-width: 58px !important; min-height: 58px !important; max-width: 58px !important; max-height: 58px !important; } } /* СТАР CSS за вертикално разглеждане и видима количка */ .amici-main-container { display: flex; flex-direction: row; align-items: flex-start; justify-content: center; width: 100vw; min-height: 100vh; background: #f7f7f7; } .amici-menu { flex: 2; max-width: 700px; margin: 32px 16px 32px 0; background: #fff; border-radius: 8px; box-shadow: 0 2px 8px rgba(0,0,0,0.08); padding: 24px 32px; min-width: 320px; } .amici-cart { flex: 1; min-width: 320px; max-width: 400px; margin: 32px 0 32px 16px; background: #fff; border-radius: 8px; box-shadow: 0 2px 8px rgba(0,0,0,0.08); padding: 24px 24px; position: sticky; top: 32px; height: fit-content; z-index: 10; } .amici-cart-title { font-size: 1.3rem; font-weight: 700; margin-bottom: 1rem; color: #222; } .amici-cart-list { list-style: none; padding: 0; margin: 0 0 1rem 0; } .amici-cart-item { display: flex; justify-content: space-between; align-items: center; padding: 0.5rem 0; border-bottom: 1px solid #eee; } .amici-cart-item:last-child { border-bottom: none; } .amici-cart-item-name { font-size: 1rem; color: #333; } .amici-cart-item-qty { font-size: 1rem; color: #888; margin: 0 0.5rem; } .amici-cart-item-price { font-size: 1rem; color: #222; font-weight: 500; } .amici-cart-total { font-size: 1.1rem; font-weight: 700; margin-top: 1rem; text-align: right; color: #222; } .amici-cart-actions { display: flex; justify-content: flex-end; gap: 0.75rem; margin-top: 1.5rem; } .amici-cart-actions button { padding: 0.5rem 1.5rem; border-radius: 6px; border: none; background: #e74c3c; color: #fff; font-weight: 600; cursor: pointer; transition: background 0.15s; } .amici-cart-actions button:hover { background: #c0392b; } /* END СТАР CSS */ #bp-root .bp-delivery-map-modal.is-open{ display:block; } #bp-root .bp-delivery-map-modal__ov{ position:absolute; inset:0; background:rgba(0,0,0,.72); backdrop-filter:blur(10px); } #bp-root .bp-delivery-map-modal__card{ position:absolute; left:50%; top:50%; width:min(920px, calc(100vw - 28px)); max-height:calc(100vh - 28px); transform:translate(-50%, -50%); display:grid; gap:14px; padding:18px; border-radius:28px; border:1px solid rgba(224,188,122,.22); background: radial-gradient(circle at 10% 0%, rgba(224,188,122,.12), transparent 34%), linear-gradient(145deg, rgba(42,20,32,.98), rgba(18,8,14,.98)); box-shadow: 0 30px 90px rgba(0,0,0,.70), inset 0 1px 0 rgba(255,255,255,.06); } #bp-root .bp-delivery-map-modal__top{ display:flex; justify-content:space-between; gap:14px; align-items:flex-start; } #bp-root .bp-delivery-map-modal__title{ font-family:Georgia,'Times New Roman',serif; font-size:26px; font-weight:600; font-style:italic; color:#f5ead8; } #bp-root .bp-delivery-map-modal__sub, #bp-root .bp-delivery-map-modal__hint{ font-family:'Nunito',system-ui,sans-serif; font-size:13px; font-weight:800; line-height:1.4; color:rgba(245,234,216,.68); } #bp-root .bp-delivery-map-modal__x{ width:42px; height:42px; border-radius:14px; border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.05); color:#fff; cursor:pointer; font-weight:900; } #bp-root .bp-delivery-map-canvas{ width:100%; height:min(56vh, 520px); min-height:360px; border-radius:22px; overflow:hidden; background:#151515; border:1px solid rgba(255,255,255,.10); } #bp-root .bp-delivery-map-modal__actions{ display:flex; justify-content:flex-end; gap:10px; flex-wrap:wrap; } @media (max-width:767px){ #bp-root .bp-delivery-map-modal__card{ width:calc(100vw - 18px); padding:14px; border-radius:22px; } #bp-root .bp-delivery-map-modal__title{ font-size:22px; } #bp-root .bp-delivery-map-canvas{ height:54vh; min-height:320px; } #bp-root .bp-delivery-map-modal__actions .btn{ width:100%; } } /* ========================================================================== BROPIZZA — MENU / HERO / CART / MODALS / DECOR Refactor goals: - full copy-paste ready - duplicate sections removed - consistent naming / spacing / ordering - amethyst visually aligned with ruby system ========================================================================== */ /* ========================================================================== 1) RESET ========================================================================== */ #bp-root *, #bp-root *::before, #bp-root *::after { box-sizing: border-box; } /* ========================================================================== 🟣 LANDMARK: AMICI HERO V3 — CLEAN MODERN PREMIUM ========================================================================== */ #bp-root .bp-hero.bp-hero-v3 { position: relative !important; width: min(100%, 1480px) !important; margin: 18px auto 42px !important; padding: clamp(18px, 2.5vw, 34px) !important; min-height: auto !important; overflow: hidden !important; border-radius: clamp(26px, 3vw, 42px) !important; border: 1px solid rgba(255, 224, 185, 0.13) !important; background: radial-gradient(circle at 78% 12%, rgba(255, 134, 76, 0.28), transparent 34%), radial-gradient(circle at 16% 82%, rgba(160, 44, 30, 0.28), transparent 38%), linear-gradient(135deg, #210913 0%, #12050b 46%, #070307 100%) !important; box-shadow: 0 34px 90px rgba(0, 0, 0, 0.50), inset 0 1px 0 rgba(255, 255, 255, 0.06) !important; } #bp-root .bp-hero.bp-hero-v3::before { content: "" !important; position: absolute !important; inset: 0 !important; pointer-events: none !important; background: linear-gradient(90deg, rgba(255,255,255,0.05), transparent 24%, transparent 72%, rgba(255,255,255,0.035)), radial-gradient(circle at 50% 0%, rgba(255, 220, 160, 0.10), transparent 45%) !important; opacity: 0.85 !important; } #bp-root .bp-hero-v3__in { position: relative !important; z-index: 2 !important; } #bp-root .bp-hero-v3__content { position: relative !important; display: grid !important; gap: 26px !important; } #bp-root .bp-hero-v3__topline { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 14px !important; } #bp-root .bp-hero-v3__brand-kicker { color: rgba(255, 214, 140, 0.88) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 11px !important; font-weight: 950 !important; letter-spacing: 0.18em !important; text-transform: uppercase !important; } #bp-root .bp-hero-v3__status { display: inline-flex !important; align-items: center !important; justify-content: center !important; min-height: 34px !important; padding: 0 14px !important; border-radius: 999px !important; color: #ffe0a0 !important; background: rgba(255, 186, 88, 0.12) !important; border: 1px solid rgba(255, 186, 88, 0.22) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 11px !important; font-weight: 950 !important; letter-spacing: 0.10em !important; text-transform: uppercase !important; white-space: nowrap !important; } #bp-root .bp-hero-v3__main { display: grid !important; grid-template-columns: minmax(0, 1.03fr) minmax(360px, 0.97fr) !important; gap: clamp(24px, 4vw, 58px) !important; align-items: center !important; } #bp-root .bp-hero-v3__copy { max-width: 650px !important; padding: clamp(8px, 1vw, 12px) 0 !important; } #bp-root .bp-hero-v3__label { display: inline-flex !important; margin-bottom: 14px !important; color: rgba(255, 248, 230, 0.74) !important; font-family: Georgia, "Times New Roman", serif !important; font-size: clamp(18px, 1.8vw, 26px) !important; font-style: italic !important; line-height: 1.15 !important; } #bp-root .bp-hero-v3__title { margin: 0 !important; color: #fff7ea !important; font-family: "Oswald", "Nunito", system-ui, sans-serif !important; font-size: clamp(42px, 6.2vw, 92px) !important; font-weight: 900 !important; line-height: 0.94 !important; letter-spacing: -0.055em !important; text-transform: uppercase !important; } #bp-root .bp-hero-v3__text { max-width: 58ch !important; margin: 20px 0 0 !important; color: rgba(255, 247, 234, 0.68) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: clamp(14px, 1.1vw, 17px) !important; font-weight: 750 !important; line-height: 1.58 !important; } #bp-root .bp-hero-v3__chips { display: flex !important; flex-wrap: wrap !important; gap: 9px !important; margin-top: 20px !important; } #bp-root .bp-hero-v3__chips span { display: inline-flex !important; align-items: center !important; min-height: 34px !important; padding: 0 12px !important; border-radius: 999px !important; color: rgba(255, 248, 230, 0.82) !important; background: rgba(255, 255, 255, 0.055) !important; border: 1px solid rgba(255, 255, 255, 0.08) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 12px !important; font-weight: 900 !important; } #bp-root .bp-hero-v3__actions { display: grid !important; grid-template-columns: minmax(190px, 1.2fr) repeat(3, minmax(132px, 0.82fr)) !important; gap: 10px !important; width: 100% !important; max-width: 760px !important; margin-top: 26px !important; padding: 0 !important; transform: none !important; } #bp-root .bp-hero-v3__actions .btn { min-height: 54px !important; border-radius: 18px !important; font-size: 12px !important; letter-spacing: 0.075em !important; white-space: nowrap !important; } #bp-root .bp-hero-v3__visual { position: relative !important; min-height: clamp(360px, 36vw, 560px) !important; border-radius: clamp(28px, 3vw, 44px) !important; overflow: hidden !important; background: radial-gradient(circle at 62% 30%, rgba(255, 135, 76, 0.26), transparent 34%), linear-gradient(145deg, rgba(255,255,255,0.075), rgba(255,255,255,0.015)) !important; border: 1px solid rgba(255, 224, 185, 0.12) !important; box-shadow: 0 28px 70px rgba(0,0,0,0.42), inset 0 1px 0 rgba(255,255,255,0.08) !important; } #bp-root .bp-hero-v3__photo { position: absolute !important; inset: 0 !important; background: linear-gradient(90deg, rgba(22, 6, 12, 0.12), rgba(22, 6, 12, 0.05)), var(--amici-hero-image, url("https://amicipizza.bg/wp-content/uploads/2026/05/89434A65-3922-44C6-9FDC-C0F0AAE8870A.webp")) !important; background-size: cover !important; background-position: center !important; transform: scale(1.03) !important; filter: saturate(1.08) contrast(1.04) !important; } #bp-root .bp-hero-v3__visual::after { content: "" !important; position: absolute !important; inset: 0 !important; pointer-events: none !important; background: linear-gradient(180deg, transparent 40%, rgba(16, 3, 8, 0.62) 100%), radial-gradient(circle at 15% 15%, rgba(255,255,255,0.12), transparent 24%) !important; } #bp-root .bp-hero-v3__floating-card { position: absolute !important; left: 22px !important; right: 22px !important; bottom: 22px !important; z-index: 3 !important; display: flex !important; align-items: center !important; gap: 14px !important; padding: 16px !important; border-radius: 24px !important; background: rgba(24, 7, 13, 0.72) !important; border: 1px solid rgba(255, 224, 185, 0.16) !important; box-shadow: 0 16px 40px rgba(0,0,0,0.32), inset 0 1px 0 rgba(255,255,255,0.08) !important; backdrop-filter: blur(14px) !important; -webkit-backdrop-filter: blur(14px) !important; } #bp-root .bp-hero-v3__floating-icon { width: 52px !important; height: 52px !important; flex: 0 0 52px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; border-radius: 18px !important; background: rgba(255, 186, 88, 0.14) !important; border: 1px solid rgba(255, 186, 88, 0.22) !important; font-size: 26px !important; } #bp-root .bp-hero-v3__floating-card strong { display: block !important; color: #fff7ea !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 16px !important; font-weight: 950 !important; line-height: 1.1 !important; } #bp-root .bp-hero-v3__floating-card span { display: block !important; margin-top: 4px !important; color: rgba(255, 247, 234, 0.66) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 13px !important; font-weight: 800 !important; } /* Скриваме стария тежък guide, ако остане от кеш/стар HTML. */ #bp-root .bp-hero-v3 .bp-hero-pickup-guide, #bp-root .bp-hero-v3 .pickup-guide { display: none !important; } /* ========================================================================== 🟣 HERO V3 — MOBILE ========================================================================== */ @media (max-width: 980px) { #bp-root .bp-hero.bp-hero-v3 { margin: 10px auto 30px !important; padding: 14px !important; border-radius: 30px !important; } #bp-root .bp-hero-v3__main { grid-template-columns: 1fr !important; gap: 20px !important; } #bp-root .bp-hero-v3__visual { min-height: 300px !important; order: -1 !important; } #bp-root .bp-hero-v3__copy { max-width: 100% !important; padding: 4px 2px 6px !important; } #bp-root .bp-hero-v3__title { font-size: clamp(38px, 12vw, 62px) !important; } #bp-root .bp-hero-v3__text { font-size: 14px !important; line-height: 1.48 !important; margin-top: 14px !important; } #bp-root .bp-hero-v3__actions { grid-template-columns: 1fr !important; max-width: 100% !important; margin-top: 18px !important; } #bp-root .bp-hero-v3__actions .btn { width: 100% !important; min-height: 52px !important; } } @media (max-width: 560px) { #bp-root .bp-hero-v3__topline { align-items: flex-start !important; } #bp-root .bp-hero-v3__brand-kicker { font-size: 10px !important; letter-spacing: 0.14em !important; } #bp-root .bp-hero-v3__status { min-height: 30px !important; padding: 0 10px !important; font-size: 10px !important; } #bp-root .bp-hero-v3__visual { min-height: 240px !important; border-radius: 24px !important; } #bp-root .bp-hero-v3__chips { gap: 7px !important; } #bp-root .bp-hero-v3__chips span { min-height: 30px !important; padding: 0 10px !important; font-size: 11px !important; } #bp-root .bp-hero-v3__floating-card { left: 12px !important; right: 12px !important; bottom: 12px !important; padding: 12px !important; border-radius: 18px !important; } #bp-root .bp-hero-v3__floating-icon { width: 44px !important; height: 44px !important; flex-basis: 44px !important; font-size: 22px !important; } } /* ========================================================================== 🟣 LANDMARK: AUTH MODAL — CLEAN LOGIN MODE ========================================================================== */ #bp-root #bp-auth .bp-auth__subactions { justify-content: flex-end; } #bp-root #bp-auth .bp-auth__link { opacity: .82; } #bp-root #bp-auth .bp-auth__link:hover { opacity: 1; } /* ========================================================================== 🟣 LANDMARK: CART CLEANUP — махане на излишни редове в количката ========================================================================== */ /* 1) Махаме реда "Бележката се изпраща..." */ #bp-root .bp-note-hint{ display: none !important; } /* 2) Махаме реда "Ориентировъчно време: около 45 мин." */ #bp-root .bp-order-eta, #bp-root .bp-order-eta--scheduled{ display: none !important; } /* 3) Полето "Бележка към поръчката" да изглежда като едноредово */ #bp-root #bp-cart-note, #bp-root .bp-note textarea{ min-height: 52px !important; height: 52px !important; max-height: 52px !important; resize: none !important; overflow: hidden !important; padding-top: 14px !important; padding-bottom: 14px !important; line-height: 1.2 !important; } /* 4) Леко стягаме разстоянията */ #bp-root .bp-note{ margin-top: 10px !important; } #bp-root .bp-note label{ margin-bottom: 8px !important; } /* ========================================================================== 🟣 LANDMARK: SAVED DELIVERY ADDRESSES — COLLAPSED UX ========================================================================== */ #bp-root .bp-saved-addresses.is-collapsed { gap: 8px; } #bp-root .bp-saved-addresses__list { display: grid; gap: 8px; animation: bpAddressBookOpen .18s ease both; } #bp-root .bp-saved-address--selected { border-color: rgba(245, 168, 0, 0.42) !important; background: linear-gradient(135deg, rgba(138, 46, 24, 0.56), rgba(245, 168, 0, 0.13)) !important; } #bp-root .bp-saved-address--selected .bp-saved-address__badge { background: rgba(245,168,0,.18); border-color: rgba(245,168,0,.34); color: #ffd98b; } @keyframes bpAddressBookOpen { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: translateY(0); } } /* ========================================================================== 🟣 LANDMARK: SAVED DELIVERY ADDRESSES ========================================================================== */ #bp-root .bp-saved-addresses { display: grid; gap: 9px; } #bp-root .bp-saved-addresses__title { color: rgba(255,255,255,0.72); font: 900 11px/1 "Nunito", system-ui, sans-serif; letter-spacing: .08em; text-transform: uppercase; } #bp-root .bp-saved-address { position: relative; width: 100%; min-height: 64px; display: grid; gap: 5px; padding: 12px 14px; padding-right: 92px; border-radius: 15px; border: 1px solid rgba(255,255,255,0.10); background: rgba(255,255,255,0.035); color: #fff7ea; text-align: left; cursor: pointer; } #bp-root .bp-saved-address.is-active { border-color: rgba(245, 168, 0, 0.48); background: linear-gradient(135deg, rgba(138, 46, 24, 0.58), rgba(245, 168, 0, 0.14)); box-shadow: 0 0 0 1px rgba(245,168,0,.10), 0 12px 26px rgba(0,0,0,.20); } #bp-root .bp-saved-address__main { font: 900 13px/1.25 "Nunito", system-ui, sans-serif; color: #fff7ea; } #bp-root .bp-saved-address__note { font: 800 11px/1.25 "Nunito", system-ui, sans-serif; color: rgba(255,255,255,0.56); } #bp-root .bp-saved-address__badge { position: absolute; top: 10px; right: 10px; padding: 6px 8px; border-radius: 999px; background: rgba(245,168,0,.14); border: 1px solid rgba(245,168,0,.24); color: #ffd98b; font: 900 10px/1 "Nunito", system-ui, sans-serif; } #bp-root .bp-delivery-new-address-btn { width: 100%; min-height: 42px; border-radius: 13px; border: 1px solid rgba(245,168,0,.24); background: rgba(245,168,0,.10); color: #ffd98b; font: 900 12px/1 "Nunito", system-ui, sans-serif; cursor: pointer; } #bp-root .bp-delivery-new-address-btn.is-muted { border-color: rgba(255,255,255,.10); background: rgba(255,255,255,.035); color: rgba(255,255,255,.70); } /* ========================================================================== 🟣 LANDMARK: CART HANDOFF / DELIVERY UI ========================================================================== */ #bp-root .bp-cart-handoff { margin: 10px 0 12px; padding: 12px; border-radius: 18px; border: 1px solid rgba(245, 188, 110, 0.16); background: radial-gradient(circle at 12% 0%, rgba(245, 168, 0, 0.12), transparent 38%), linear-gradient(180deg, rgba(255,255,255,0.055), rgba(255,255,255,0.022)); box-shadow: inset 0 1px 0 rgba(255,255,255,0.06); } #bp-root .bp-cart-handoff__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 10px; } #bp-root .bp-cart-handoff__kicker { font: 900 10px/1 "Nunito", system-ui, sans-serif; text-transform: uppercase; letter-spacing: .12em; color: rgba(245, 188, 110, .82); } #bp-root .bp-cart-handoff__title { margin-top: 4px; font: 900 15px/1.15 "Nunito", system-ui, sans-serif; color: #fff7ea; } #bp-root .bp-cart-handoff__fee { padding: 7px 9px; border-radius: 999px; background: rgba(245, 168, 0, 0.12); border: 1px solid rgba(245, 168, 0, 0.22); color: #ffd98b; font: 900 12px/1 "Nunito", system-ui, sans-serif; white-space: nowrap; } #bp-root .bp-cart-handoff__tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; } #bp-root .bp-cart-handoff__tab { min-height: 62px; padding: 10px; border-radius: 15px; border: 1px solid rgba(255,255,255,0.09); background: rgba(255,255,255,0.035); color: rgba(255,255,255,0.72); text-align: left; cursor: pointer; } #bp-root .bp-cart-handoff__tab strong { display: block; margin-bottom: 5px; color: #fff7ea; font: 900 13px/1.1 "Nunito", system-ui, sans-serif; } #bp-root .bp-cart-handoff__tab span { display: block; font: 800 11px/1.25 "Nunito", system-ui, sans-serif; color: rgba(255,255,255,0.54); } #bp-root .bp-cart-handoff__tab.is-active { border-color: rgba(245, 168, 0, 0.44); background: linear-gradient(135deg, rgba(138, 46, 24, 0.58), rgba(245, 168, 0, 0.16)); box-shadow: 0 0 0 1px rgba(245,168,0,.10), 0 12px 26px rgba(0,0,0,.20); } #bp-root .bp-cart-delivery-fields { display: grid; gap: 9px; margin-top: 10px; } #bp-root .bp-cart-field { display: grid; gap: 6px; } #bp-root .bp-cart-field span { font: 900 11px/1 "Nunito", system-ui, sans-serif; color: rgba(255,255,255,0.70); } #bp-root .bp-cart-field input { width: 100%; min-height: 44px; padding: 0 12px; border-radius: 13px; border: 1px solid rgba(255,255,255,0.10); background: rgba(0,0,0,0.30); color: #fff7ea; outline: none; font: 800 13px/1 "Nunito", system-ui, sans-serif; box-sizing: border-box; } #bp-root .bp-cart-field input:focus { border-color: rgba(245, 168, 0, 0.48); box-shadow: 0 0 0 3px rgba(245, 168, 0, 0.10); } #bp-root .bp-cart-delivery-note { padding: 9px 10px; border-radius: 13px; background: rgba(90, 180, 110, 0.10); border: 1px solid rgba(90, 180, 110, 0.20); color: rgba(225, 255, 231, 0.88); font: 850 12px/1.35 "Nunito", system-ui, sans-serif; } #bp-root img { display: block; max-width: 100%; } #bp-root a { color: inherit; text-decoration: none; } #bp-root button { font-family: "Oswald", "Nunito", system-ui; } html, body { max-width: 100%; overflow-x: hidden; } body { margin: 0; } /* ========================================================================== 2) ROOT TOKENS ========================================================================== */ #bp-root { --bro-black: #080808; --bro-black-2: #0d0d0e; --bro-dark: #141415; --bro-dark-2: #1a1a1b; --bro-dark-3: #202022; --bro-orange: #f5a800; --bro-orange2: #ffcc33; --bro-gold-d: #c98600; --bro-gold-soft: #ffd36a; --bro-red: #b51d1d; --bro-red-deep: #7f0e0e; --bro-white: #ffffff; --bro-muted: #a7a7aa; --bro-text: #ece8df; --bro-text-soft: rgba(255, 255, 255, 0.72); --bro-text-dim: rgba(255, 255, 255, 0.54); --card: linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.015)), linear-gradient(145deg, #171718, #0f0f10 56%, #191717 100%); --card-2: linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.02)), linear-gradient(145deg, #1c1c1d, #111112 60%, #1a1717 100%); --card-border: rgba(245, 168, 0, 0.15); --card-border-strong: rgba(245, 168, 0, 0.24); --glass-stroke: rgba(255, 255, 255, 0.08); --shadow-soft: 0 18px 50px rgba(0, 0, 0, 0.68); --shadow-float: 0 28px 70px rgba(0, 0, 0, 0.82); --shadow-lux: 0 30px 90px rgba(0, 0, 0, 0.78); --shadow-gold: 0 12px 34px rgba(245, 168, 0, 0.16); --radius-xl: 30px; --radius-lg: 22px; --radius-md: 16px; --radius-sm: 12px; --radius-xs: 10px; --max: 1180px; --bp-logo-heat-glow: 0; --bp-logo-heat-scan: 0; --bp-logo-heat-speed: 8s; --bp-strip-parallax-x: 0px; --bp-strip-parallax-y: 0px; --bp-strip-parallax-rotate: 0deg; --bp-strip-opacity: 1; --bp-strip-speed: 40s; font-family: "Nunito", system-ui, -apple-system, sans-serif; color: var(--bro-text); line-height: 1.6; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; position: relative; width: 100%; overflow-x: clip; padding-bottom: 40px; background: radial-gradient(circle at 16% 18%, rgba(245, 168, 0, 0.07), transparent 18%), radial-gradient(circle at 84% 76%, rgba(181, 29, 29, 0.09), transparent 20%), linear-gradient(180deg, #070707 0%, #0c0c0d 48%, #090909 100%); } #bp-root::before { content: ""; position: fixed; inset: 0; z-index: 0; pointer-events: none; opacity: 0.045; mix-blend-mode: soft-light; background-image: radial-gradient(rgba(255, 255, 255, 0.18) 0.55px, transparent 0.7px); background-size: 8px 8px; } /* ========================================================================== 3) LAYOUT WRAPPERS ========================================================================== */ .bp-wrap { position: relative; z-index: 1; width: 100%; max-width: var(--max); margin: 0 auto; padding: 24px 14px 0; } .bp-section { margin-top: 28px; } /* ========================================================================== 4) HERO ========================================================================== */ .bp-hero { position: relative; isolation: isolate; overflow: hidden; border: 1px solid rgba(255, 255, 255, 0.07); border-radius: var(--radius-xl); box-shadow: var(--shadow-lux); background: linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.015)), linear-gradient(145deg, #171718 0%, #0d0d0e 56%, #161313 100%); } .bp-hero::before { content: ""; position: absolute; top: -80px; left: -80px; z-index: 0; width: 360px; height: 360px; pointer-events: none; filter: blur(2px); background: radial-gradient(circle, rgba(245, 168, 0, 0.16) 0%, transparent 70%); } .bp-hero::after { content: ""; position: absolute; right: -90px; bottom: -90px; z-index: 0; width: 340px; height: 340px; pointer-events: none; filter: blur(2px); background: radial-gradient(circle, rgba(181, 29, 29, 0.16) 0%, transparent 72%); } .bp-hero__in { position: relative; z-index: 1; padding: 0; } .bp-hero__in::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: 0.75; mix-blend-mode: screen; background: linear-gradient(115deg, rgba(255, 255, 255, 0.06), transparent 24%, transparent 70%, rgba(255, 255, 255, 0.03)), linear-gradient(180deg, rgba(255, 204, 51, 0.08), transparent 14%); } .bp-hero__in::after { content: ""; position: absolute; inset: 1px; pointer-events: none; border: 1px solid rgba(245, 168, 0, 0.08); border-radius: calc(var(--radius-xl) - 1px); } .bp-hero__lux { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(0, 1.16fr) minmax(320px, 0.84fr); gap: 26px; min-height: 620px; padding: 30px; } .bp-hero__left { display: flex; flex-direction: column; justify-content: center; min-width: 0; } .bp-hero__right { position: relative; display: flex; align-items: center; justify-content: center; min-width: 0; padding: 10px 4px 10px 10px; } .bp-hero__right::before { content: ""; position: absolute; inset: 0; pointer-events: none; border: 1px solid rgba(255, 255, 255, 0.06); border-radius: 24px; background: radial-gradient(circle at 30% 30%, rgba(245, 168, 0, 0.1), transparent 28%), radial-gradient(circle at 75% 75%, rgba(160, 20, 20, 0.12), transparent 26%), linear-gradient(180deg, rgba(255, 255, 255, 0.02), rgba(255, 255, 255, 0.01)); } .bp-hero__top { position: relative; z-index: 2; display: flex; align-items: center; justify-content: flex-start; gap: 16px; margin-bottom: 22px; } .bp-logo-area { display: flex; flex: 1 1 auto; align-items: center; gap: 12px; min-width: 0; } .bp-logo-slot { display: flex; align-items: center; gap: 12px; max-width: 100%; padding: 12px 15px; border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 18px; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 14px 34px rgba(0, 0, 0, 0.22); backdrop-filter: blur(8px); background: linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.02)), rgba(255, 255, 255, 0.02); } .bp-logo-slot img { width: auto; height: 44px; object-fit: contain; } .bp-logo-text { font-family: "Oswald", sans-serif; font-size: 30px; font-weight: 800; line-height: 1; letter-spacing: 2px; text-transform: uppercase; text-shadow: 0 0 26px rgba(245, 168, 0, 0.12); background: linear-gradient(135deg, #b97700 0%, #f5a800 42%, #ffe19a 70%, #c98600 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; } .bp-logo-sub { margin-top: 4px; color: rgba(255, 215, 135, 0.56); font-family: "Oswald", sans-serif; font-size: 10px; letter-spacing: 3px; text-transform: uppercase; } .bp-hero-badge { display: inline-flex; flex-shrink: 0; align-items: center; align-self: flex-start; gap: 8px; max-width: 100%; padding: 11px 14px; white-space: nowrap; color: rgba(255, 255, 255, 0.84); font-family: "Oswald", sans-serif; font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 999px; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 14px 24px rgba(0, 0, 0, 0.25); backdrop-filter: blur(8px); background: linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.02)); } .bp-hero-badge__label { color: rgba(255, 255, 255, 0.76); } .bp-hero-badge__status { color: #ffffff; transition: color 0.18s ease; } .bp-hero-badge__lamp { flex: 0 0 auto; width: 9px; height: 9px; border-radius: 50%; background: var(--bro-orange); box-shadow: 0 0 0 4px rgba(245, 168, 0, 0.14), 0 0 14px rgba(245, 168, 0, 0.38); transition: background 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease; } .bp-hero-badge.is-open .bp-hero-badge__status { color: #7dffb1; } .bp-hero-badge.is-open .bp-hero-badge__lamp { background: #35d07f; box-shadow: 0 0 0 4px rgba(53, 208, 127, 0.14), 0 0 14px rgba(53, 208, 127, 0.4); } .bp-hero-badge.is-closed .bp-hero-badge__status { color: #ff8e8e; } .bp-hero-badge.is-closed .bp-hero-badge__lamp { background: #ff4d4d; box-shadow: 0 0 0 4px rgba(255, 77, 77, 0.14), 0 0 14px rgba(255, 77, 77, 0.42); } .bp-pill { position: relative; z-index: 2; display: inline-flex; align-self: flex-start; align-items: center; gap: 10px; max-width: 100%; padding: 10px 18px; color: var(--bro-orange2); font-family: "Oswald", sans-serif; font-size: 12px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; border: 1px solid rgba(245, 168, 0, 0.26); border-radius: 999px; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 10px 24px rgba(0, 0, 0, 0.18); background: linear-gradient(180deg, rgba(245, 168, 0, 0.16), rgba(245, 168, 0, 0.08)); } .bp-dot { flex-shrink: 0; width: 8px; height: 8px; border-radius: 999px; background: var(--bro-orange); box-shadow: 0 0 0 5px rgba(245, 168, 0, 0.16), 0 0 20px rgba(245, 168, 0, 0.22); } .bp-h1 { position: relative; z-index: 2; max-width: 8.6ch; margin: 18px 0 14px; overflow-wrap: break-word; color: #ffffff; font-family: "Oswald", sans-serif; font-size: clamp(40px, 4.9vw, 72px); font-weight: 800; line-height: 1.06; letter-spacing: 0.01em; text-transform: uppercase; } .bp-gold { color: var(--bro-orange); text-shadow: 0 0 30px rgba(245, 168, 0, 0.22); } .bp-lead { position: relative; z-index: 2; max-width: 60ch; margin: 0 0 18px; color: rgba(255, 255, 255, 0.74); font-family: "Nunito", sans-serif; font-size: 15px; font-weight: 700; line-height: 1.75; } .bp-cta { position: relative; z-index: 2; display: flex; flex-wrap: wrap; gap: 10px; } .bp-hero-glass { position: relative; z-index: 2; width: 100%; max-width: 620px; margin-top: 26px; padding: 18px 18px 16px; border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 22px; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 20px 40px rgba(0, 0, 0, 0.25); backdrop-filter: blur(10px); background: linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.02)); } .bp-hero-glass__label { margin-bottom: 8px; color: #ffc95d; font-family: "Oswald", sans-serif; font-size: 11px; font-weight: 800; letter-spacing: 0.2em; text-transform: uppercase; } .bp-hero-glass__text { color: rgba(255, 255, 255, 0.76); font-size: 14px; font-weight: 700; line-height: 1.65; } .bp-hero-showcase { position: relative; display: flex; align-items: center; justify-content: center; isolation: isolate; width: min(430px, 100%); aspect-ratio: 1 / 1.07; overflow: visible; border-radius: 30px; } .bp-hero-showcase::before, .bp-hero-showcase::after { content: none !important; display: none !important; } .bp-hero-showcase__ring { position: absolute; pointer-events: none; border: 1px solid rgba(245, 168, 0, 0.14); border-radius: 50%; } .bp-hero-showcase__ring--1 { inset: 18px; box-shadow: 0 0 28px rgba(245, 168, 0, 0.05); } .bp-hero-showcase__ring--2 { inset: 42px; border-color: rgba(255, 255, 255, 0.08); } .bp-hero-card { position: relative; overflow: hidden; border: 1px solid rgba(255, 255, 255, 0.12); border-radius: 28px; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07), inset 0 -1px 0 rgba(255, 255, 255, 0.02), 0 30px 70px rgba(0, 0, 0, 0.48); backdrop-filter: blur(14px); background: linear-gradient(180deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.03)), linear-gradient(145deg, #232325 0%, #121214 52%, #0c0c0d 100%); } .bp-hero-card--main { position: relative; z-index: 3; width: 72%; min-height: 310px; padding: 28px 24px 24px; transform: rotate(-4deg) translateY(4px); } .bp-hero-card__shine { position: absolute; inset: 0; pointer-events: none; transform: translateX(-120%); background: linear-gradient(120deg, transparent 16%, rgba(255, 255, 255, 0.12) 32%, transparent 48%); animation: bpLuxShine 5.5s linear infinite; } .bp-hero-card__kicker { color: #ffc75a; font-family: "Oswald", sans-serif; font-size: 11px; font-weight: 800; letter-spacing: 0.22em; text-transform: uppercase; opacity: 0.95; } .bp-hero-card__title { max-width: 6ch; margin-top: 18px; color: #faf6ef; font-family: "Oswald", sans-serif; font-size: 42px; font-weight: 800; line-height: 0.96; text-transform: uppercase; } .bp-hero-card__text { max-width: 28ch; margin-top: 16px; color: rgba(255, 255, 255, 0.7); font-size: 14px; font-weight: 700; line-height: 1.7; } .bp-hero-mini { position: absolute; z-index: 5; min-width: 150px; padding: 14px 16px 13px; border-radius: 18px; box-shadow: 0 16px 36px rgba(0, 0, 0, 0.28); backdrop-filter: blur(12px); } .bp-hero-mini--gold { top: 100px; right: 0; border: 1px solid rgba(245, 168, 0, 0.24); background: linear-gradient(180deg, rgba(245, 168, 0, 0.16), rgba(245, 168, 0, 0.05)); } .bp-hero-mini--dark { bottom: 2px; left: -2px; border: 1px solid rgba(255, 255, 255, 0.11); background: linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.025)), linear-gradient(145deg, #232325, #111214); } .bp-hero-mini__label { color: rgba(255, 255, 255, 0.62); font-family: "Oswald", sans-serif; font-size: 10px; font-weight: 800; letter-spacing: 0.2em; text-transform: uppercase; } .bp-hero-mini__value { margin-top: 8px; color: #fff6de; font-family: "Oswald", sans-serif; font-size: 24px; font-weight: 800; line-height: 1; text-transform: uppercase; } /* ========================================================================== 5) LOGO HEAT ========================================================================== */ .bp-heat-logo { position: relative; display: inline-block; isolation: isolate; will-change: transform, filter, text-shadow; transition: filter 0.35s ease, text-shadow 0.35s ease; } .bp-heat-logo::before, .bp-heat-logo::after { content: ""; position: absolute; inset: -10% -6%; pointer-events: none; border-radius: 14px; opacity: 0; } .bp-heat-logo::before { z-index: -1; opacity: calc(0.1 + var(--bp-logo-heat-glow) * 0.3); filter: blur(calc(8px + var(--bp-logo-heat-glow) * 7px)); background: radial-gradient( circle at 50% 50%, rgba(245, 168, 0, calc(0.06 + var(--bp-logo-heat-glow) * 0.12)) 0%, rgba(245, 168, 0, calc(0.03 + var(--bp-logo-heat-glow) * 0.08)) 34%, rgba(245, 168, 0, 0) 74% ); } .bp-heat-logo::after { opacity: calc(var(--bp-logo-heat-scan) * 0.95); filter: blur(calc(3px + var(--bp-logo-heat-glow) * 2px)); mix-blend-mode: screen; background: linear-gradient( 110deg, rgba(255, 255, 255, 0) 0%, rgba(255, 215, 140, calc(var(--bp-logo-heat-scan) * 0.32)) 28%, rgba(255, 245, 215, calc(var(--bp-logo-heat-scan) * 0.72)) 50%, rgba(255, 215, 140, calc(var(--bp-logo-heat-scan) * 0.32)) 72%, rgba(255, 255, 255, 0) 100% ); animation: bpLogoHeatSweep var(--bp-logo-heat-speed) linear infinite; } .bp-heat-logo[data-heat="0"] { animation: none; filter: none; text-shadow: none; } .bp-heat-logo[data-heat="1"] { animation: bpLogoHeatWobble1 5.8s ease-in-out infinite; filter: drop-shadow(0 0 6px rgba(245, 168, 0, 0.12)) saturate(1.03); text-shadow: 0 0 10px rgba(245, 168, 0, 0.1), 0 0 16px rgba(245, 168, 0, 0.05); } .bp-heat-logo[data-heat="2"] { animation: bpLogoHeatWobble2 3.9s ease-in-out infinite; filter: drop-shadow(0 0 8px rgba(245, 168, 0, 0.18)) drop-shadow(0 0 18px rgba(245, 168, 0, 0.08)) saturate(1.06); text-shadow: 0 0 12px rgba(245, 168, 0, 0.16), 0 0 20px rgba(245, 168, 0, 0.1), 0 0 30px rgba(245, 168, 0, 0.06); } .bp-heat-logo[data-heat="3"] { animation: bpLogoHeatWobble3 2.45s ease-in-out infinite; filter: drop-shadow(0 0 10px rgba(245, 168, 0, 0.24)) drop-shadow(0 0 22px rgba(245, 168, 0, 0.14)) saturate(1.11); text-shadow: 0 0 14px rgba(245, 168, 0, 0.22), 0 0 24px rgba(245, 168, 0, 0.16), 0 0 36px rgba(245, 168, 0, 0.1); } .bp-heat-logo[data-heat="4"] { animation: bpLogoHeatWobble4 1.55s ease-in-out infinite, bpLogoHeatBreath 2.2s ease-in-out infinite; filter: drop-shadow(0 0 12px rgba(245, 168, 0, 0.3)) drop-shadow(0 0 24px rgba(245, 168, 0, 0.2)) drop-shadow(0 0 42px rgba(245, 168, 0, 0.12)) saturate(1.18) contrast(1.03); text-shadow: 0 0 16px rgba(245, 168, 0, 0.28), 0 0 28px rgba(245, 168, 0, 0.2), 0 0 44px rgba(245, 168, 0, 0.12); } /* ========================================================================== 6) BUTTONS ========================================================================== */ #bp-root .btn, #bp-root .bp-check { position: relative; display: inline-flex !important; align-items: center; justify-content: center; gap: 8px; min-width: 136px; max-width: 100%; height: 46px; padding: 11px 22px; overflow: hidden; border: none; border-radius: 999px; outline: none; cursor: pointer; user-select: none; -webkit-tap-highlight-color: transparent; font-family: "Oswald", sans-serif; font-size: 13px; font-weight: 800; letter-spacing: 0.09em; text-transform: uppercase; text-decoration: none !important; transition: transform 0.18s ease, box-shadow 0.18s ease, filter 0.18s ease, background 0.18s ease; } #bp-root .ivh-btn-primary { color: #1a0e00 !important; border: none !important; background: linear-gradient(135deg, #b97800 0%, #f5a800 42%, #ffe093 100%) !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.26), 0 10px 28px rgba(245, 168, 0, 0.26), 0 0 0 1px rgba(245, 168, 0, 0.22) !important; } #bp-root .ivh-btn-primary:hover { transform: translateY(-2px) !important; filter: brightness(1.05) !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3), 0 14px 34px rgba(245, 168, 0, 0.34), 0 0 0 1px rgba(245, 168, 0, 0.3) !important; } #bp-root .ivh-btn-primary::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: 0; border-radius: inherit; background: radial-gradient(58px 58px at var(--mx, 50%) var(--my, 50%), rgba(255, 255, 255, 0.36), transparent 62%); transition: opacity 0.12s ease; } #bp-root .ivh-btn-primary:hover::before { opacity: 1; } #bp-root .ivh-btn-secondary { color: rgba(255, 255, 255, 0.88) !important; border: 1px solid rgba(255, 255, 255, 0.1) !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 12px 24px rgba(0, 0, 0, 0.16); background: linear-gradient(180deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.02)), rgba(255, 255, 255, 0.03) !important; } #bp-root .ivh-btn-secondary:hover { background: linear-gradient(180deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.03)), rgba(255, 255, 255, 0.04) !important; } #bp-root .is-off { color: rgba(255, 255, 255, 0.68) !important; border: 1px solid rgba(255, 255, 255, 0.1) !important; background: linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.02)), rgba(255, 255, 255, 0.02) !important; } .bp-count { display: none; align-items: center; justify-content: center; min-width: 22px; height: 20px; padding: 0 5px; color: #1a0e00; font-family: "Oswald", sans-serif; font-size: 11px; font-weight: 800; border-radius: 999px; background: var(--bro-orange); box-shadow: 0 0 0 4px rgba(245, 168, 0, 0.14); } /* ========================================================================== 7) SECTION HEADS / CATEGORY TABS ========================================================================== */ .bp-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; margin-bottom: 14px; } .bp-h2 { margin: 0; color: #ffffff; font-family: "Oswald", sans-serif; font-size: 30px; font-weight: 800; letter-spacing: 0.02em; text-transform: uppercase; } .bp-slabel { margin-bottom: 6px; color: var(--bro-orange); font-family: "Oswald", sans-serif; font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; } .bp-sub { margin: 4px 0 0; color: rgba(255, 255, 255, 0.56); font-family: "Nunito", sans-serif; font-size: 14px; font-weight: 700; } .bp-cats { display: flex; gap: 8px; overflow: auto; padding: 14px; scrollbar-width: none; border: 1px solid rgba(255, 255, 255, 0.07); border-radius: 20px; box-shadow: var(--shadow-soft); backdrop-filter: blur(10px); background: linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.015)), rgba(0, 0, 0, 0.34); } .bp-cats::-webkit-scrollbar { display: none; } .bp-cat { flex: 0 0 auto; padding: 9px 16px; color: rgba(255, 255, 255, 0.82); font-family: "Oswald", sans-serif; font-size: 12px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 999px; background: linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.02)); cursor: pointer; transition: transform 0.15s ease, background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease; } .bp-cat:hover { transform: translateY(-1px); border-color: rgba(245, 168, 0, 0.18); background: rgba(245, 168, 0, 0.08); } #bp-root .bp-cat.is-active { color: #1a0e00 !important; border-color: transparent !important; background: linear-gradient(135deg, #b97800 0%, #f5a800 42%, #ffe093 100%) !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.26), 0 10px 28px rgba(245, 168, 0, 0.26), 0 0 0 1px rgba(245, 168, 0, 0.22) !important; } #bp-root .bp-cat.is-active:hover, #bp-root .bp-cat.is-active:focus-visible { filter: brightness(1.05) !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3), 0 14px 34px rgba(245, 168, 0, 0.34), 0 0 0 1px rgba(245, 168, 0, 0.3) !important; } /* ========================================================================== 8) PRODUCT GRID ========================================================================== */ .bp-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 16px; } .bp-p { position: relative; display: flex; flex-direction: column; min-width: 0; overflow: hidden; isolation: isolate; border: 1px solid rgba(255, 255, 255, 0.07); border-radius: 24px; box-shadow: var(--shadow-soft); background: var(--card); transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease; } .bp-p::before { content: ""; position: absolute; top: -36px; right: -36px; z-index: 0; width: 150px; height: 150px; pointer-events: none; background: radial-gradient(circle, rgba(245, 168, 0, 0.1) 0%, transparent 70%); } .bp-p::after { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none; mix-blend-mode: screen; background: linear-gradient(130deg, rgba(255, 255, 255, 0.05), transparent 22%, transparent 72%, rgba(255, 255, 255, 0.025)); } .bp-p:hover { transform: translateY(-5px); border-color: rgba(245, 168, 0, 0.16); box-shadow: var(--shadow-float), 0 0 0 1px rgba(245, 168, 0, 0.16); } .bp-p img { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; object-position: center; background: #0f0f10; filter: saturate(1.05) contrast(1.02); transition: transform 0.5s ease; padding: 0; } .bp-p:hover img { transform: scale(1.035); } .bp-p .b { position: relative; z-index: 1; display: flex; flex: 1; flex-direction: column; min-width: 0; padding: 16px 16px 18px; } .bp-p h4 { margin: 0; color: var(--bro-orange2); font-family: "Oswald", sans-serif; font-size: 17px; font-weight: 800; line-height: 1.12; letter-spacing: 0.03em; text-transform: uppercase; overflow-wrap: break-word; } .bp-p p { flex: 1; min-height: 34px; margin: 8px 0 12px; color: rgba(232, 232, 232, 0.82); font-family: "Nunito", sans-serif; font-size: 13px; font-weight: 700; line-height: 1.6; } .bp-p__notice { margin: 0 0 12px; padding: 11px 13px; color: rgba(255, 245, 220, 0.92); font-family: "Nunito", sans-serif; font-size: 12px; font-weight: 800; line-height: 1.45; border: 1px solid rgba(245, 168, 0, 0.16); border-radius: 14px; background: linear-gradient(180deg, rgba(245, 168, 0, 0.08), rgba(245, 168, 0, 0.04)); } .bp-p__notice b { color: var(--bro-orange2); font-family: "Oswald", sans-serif; letter-spacing: 0.04em; text-transform: uppercase; } .bp-ph { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; width: 100%; aspect-ratio: 16 / 10; color: rgba(255, 255, 255, 0.82); border-bottom: 1px solid rgba(255, 255, 255, 0.06); background: radial-gradient(circle at 50% 30%, rgba(245, 168, 0, 0.1), transparent 45%), linear-gradient(145deg, #141415, #1d1b1b); } .bp-ph__brand { color: var(--bro-orange); font-family: "Oswald", sans-serif; font-size: 22px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; } .bp-ph__soon { color: rgba(255, 255, 255, 0.58); font-family: "Nunito", sans-serif; font-size: 13px; font-weight: 800; } .bp-flavor { margin: 0 0 12px; color: rgba(245, 168, 0, 0.74); font-family: "Nunito", sans-serif; font-size: 12px; font-weight: 700; line-height: 1.45; letter-spacing: 0.3px; font-style: italic; } .bp-row2 { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: flex-end; gap: 10px; width: 100%; margin-top: auto; } /* ========================================================================== 9) DRINK CARDS ========================================================================== */ .bp-p.bp-p--drink img { padding: 10px; object-fit: contain !important; background: radial-gradient(circle at center, rgba(255, 255, 255, 0.03) 0%, rgba(255, 255, 255, 0) 70%), linear-gradient(145deg, #141414, #1d1b1b); } .bp-p.bp-p--drink:hover img { transform: scale(1.02); } .bp-p.bp-p--drink .b { padding-top: 12px; } .bp-p.bp-p--drink h4 { font-size: 15px; line-height: 1.16; } .bp-p.bp-p--drink p { min-height: 0; margin: 6px 0 10px; } .bp-p.bp-p--drink .bp-flavor { display: none; } .bp-drink-qty { margin: 0 0 12px; color: rgba(140, 210, 255, 0.88); font-family: "Nunito", sans-serif; font-size: 12px; font-weight: 800; line-height: 1.35; letter-spacing: 0.02em; } .bp-drink-qty::before { content: "🥤 "; } /* ========================================================================== 10) ADD BUTTONS ========================================================================== */ .bp-adds { display: flex; align-items: stretch; justify-content: flex-end; gap: 8px; width: 100%; } .bp-adds--burger { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; width: 100%; } .bp-add2 { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; min-width: 132px; min-height: 62px; padding: 10px 12px 10px 14px; overflow: hidden; text-align: left; user-select: none; -webkit-tap-highlight-color: transparent; border: none; border-radius: 14px; cursor: pointer; font-family: "Oswald", sans-serif; transition: transform 0.15s ease, filter 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease; } .bp-add2:hover { transform: translateY(-1px); filter: brightness(1.08); } .bp-add2__left { display: flex; flex: 1 1 auto; flex-direction: column; align-items: flex-start; justify-content: center; min-width: 0; padding-right: 4px; } .bp-add2__right { display: flex; flex: 0 0 auto; flex-direction: column; align-items: flex-end; justify-content: center; min-width: 60px; text-align: right; } .bp-add2__tag { font-size: 12px; font-weight: 800; line-height: 1.05; letter-spacing: 0.05em; text-transform: uppercase; } .bp-add2__size-note { margin-top: 4px; font-family: "Nunito", sans-serif; font-size: 10px; font-weight: 800; line-height: 1.05; letter-spacing: 0.03em; opacity: 0.8; } .bp-add2__eur { margin-top: 0; font-size: 18px; font-weight: 800; line-height: 1; white-space: nowrap; } .bp-add2__bgn { margin-top: 4px; font-family: "Nunito", sans-serif; font-size: 11px; font-weight: 800; line-height: 1; white-space: nowrap; } .bp-add2__ok { position: absolute; top: 7px; left: 7px; z-index: 2; display: flex; align-items: center; justify-content: center; width: 22px; height: 22px; color: #ffffff; font-size: 13px; font-weight: 800; line-height: 1; opacity: 0; pointer-events: none; transform: scale(0.72); border-radius: 999px; box-shadow: 0 6px 18px rgba(32, 180, 90, 0.4), inset 0 0 0 1px rgba(255, 255, 255, 0.22); background: linear-gradient(135deg, #20b45a, #41d97b); transition: opacity 0.18s ease, transform 0.18s ease; } .bp-add2.is-added .bp-add2__ok { opacity: 1; transform: scale(1); } .bp-add2.is-classic, .bp-add2.is-drink { color: var(--bro-orange2); border: 1px solid rgba(245, 168, 0, 0.3); box-shadow: 0 10px 22px rgba(245, 168, 0, 0.12); background: linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.015)), linear-gradient(135deg, rgba(212, 140, 0, 0.42), rgba(245, 168, 0, 0.22)); } .bp-add2.is-classic .bp-add2__bgn, .bp-add2.is-drink .bp-add2__bgn { color: rgba(255, 204, 51, 0.88); } .bp-add2.is-classic .bp-add2__size-note, .bp-add2.is-drink .bp-add2__size-note { color: rgba(255, 240, 190, 0.82); } .bp-add2.is-family { color: rgba(255, 210, 210, 1); border: 1px solid rgba(255, 95, 95, 0.24); box-shadow: 0 10px 22px rgba(204, 27, 27, 0.12); background: linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.015)), linear-gradient(135deg, rgba(204, 27, 27, 0.34), rgba(245, 100, 0, 0.18)); } .bp-add2.is-family .bp-add2__bgn { color: rgba(255, 210, 210, 0.92); } .bp-add2.is-family .bp-add2__size-note { color: rgba(255, 228, 228, 0.78); } .bp-add2::after { content: ""; position: absolute; inset: 0; pointer-events: none; border-radius: inherit; transform: translateX(-120%) skewX(-20deg); background: linear-gradient( 105deg, transparent 20%, rgba(255, 255, 255, 0) 35%, rgba(255, 255, 255, 0.75) 50%, rgba(255, 255, 255, 0) 65%, transparent 80% ); } .bp-add2:active::after, .bp-add2.is-added::after { animation: bpBlitz 0.38s ease forwards; } .bp-add2.is-added { animation: bpPulse 0.35s ease; } /* 🟣 LANDMARK: FAVORITE PIZZA SPLIT BUTTONS */ .bp-fav-split{ position:relative; display:block; width:100%; padding:0; overflow:hidden; border:none; border-radius:18px; cursor:pointer; text-align:left; box-shadow: 0 16px 34px rgba(0,0,0,.28), inset 0 0 0 1px rgba(255,255,255,.08); background: linear-gradient(135deg, rgba(24,122,222,.96), rgba(31,112,216,.96) 55%, rgba(46,138,255,.94) 100%); transition:transform .16s ease, filter .18s ease, box-shadow .18s ease; } .bp-fav-split:hover{ transform:translateY(-1px); filter:brightness(1.04); } .bp-fav-split.is-disabled{ cursor:not-allowed; opacity:.62; filter:grayscale(.08); } .bp-fav-split--family{ background: linear-gradient(135deg, rgba(158,172,26,.96), rgba(209,154,0,.94) 55%, rgba(238,171,18,.94) 100%); } .bp-fav-split__head{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding:14px 16px 12px; border-bottom:1px solid rgba(255,255,255,.10); } .bp-fav-split__title{ color:#fff; font-family:"Oswald",sans-serif; font-size:17px; font-weight:800; line-height:1.05; letter-spacing:.03em; text-transform:uppercase; } .bp-fav-split__price{ flex:0 0 auto; color:#fff7d6; font-family:"Oswald",sans-serif; font-size:18px; font-weight:800; line-height:1; white-space:nowrap; } .bp-fav-split__body{ display:grid; grid-template-columns:1fr 1fr; min-width:0; } .bp-fav-split__zone{ position:relative; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; min-height:88px; padding:14px 16px; min-width:0; } .bp-fav-split__zone + .bp-fav-split__zone{ border-left:1px solid rgba(255,255,255,.12); } .bp-fav-split__zone--left{ background:rgba(255,255,255,.05); } .bp-fav-split__zone--right{ background:rgba(255,255,255,.09); } .bp-fav-split__label{ color:#ffffff; font-family:"Oswald",sans-serif; font-size:15px; font-weight:800; line-height:1.05; letter-spacing:.04em; text-transform:uppercase; } .bp-fav-split__sub{ margin-top:6px; color:rgba(255,255,255,.86); font-family:"Nunito",sans-serif; font-size:12px; font-weight:800; line-height:1.3; } .bp-fav-split__zone::after{ content:"+"; position:absolute; top:50%; right:14px; transform:translateY(-50%); display:flex; align-items:center; justify-content:center; width:34px; height:34px; border-radius:999px; color:#ffffff; font-family:"Oswald",sans-serif; font-size:20px; font-weight:800; line-height:1; background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.16); box-shadow:0 8px 20px rgba(0,0,0,.18); } .bp-fav-split__zone--right::after{ content:"◐"; font-size:18px; } @media (max-width: 680px){ .bp-fav-split__head{ padding:12px 14px 10px; } .bp-fav-split__title{ font-size:15px; } .bp-fav-split__price{ font-size:16px; } .bp-fav-split__zone{ min-height:78px; padding:12px 14px; } .bp-fav-split__label{ font-size:14px; } .bp-fav-split__sub{ font-size:11px; } .bp-fav-split__zone::after{ width:30px; height:30px; right:10px; font-size:18px; } } .bp-order-eta--scheduled{ background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02)), rgba(255,205,80,.08); border: 1px solid rgba(255,205,80,.24); box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 12px 26px rgba(0,0,0,.18); } .bp-order-eta--scheduled .bp-order-eta__label{ color: rgba(255,205,80,.96); } .bp-order-eta--scheduled .bp-order-eta__time{ color: #fff3cf; } .bp-order-eta--scheduled .bp-order-eta__sub{ color: rgba(255,255,255,.58); } .bp-order-eta--scheduled .bp-order-eta__remain{ color: var(--bro-orange2); text-shadow: 0 0 12px rgba(245,168,0,.14); } .bp-order-eta--scheduled .bp-order-eta__hint{ color: rgba(255,255,255,.50); } @media (max-width: 480px){ .bp-fav-split__body{ grid-template-columns:1fr; } .bp-fav-split__zone + .bp-fav-split__zone{ border-left:none; border-top:1px solid rgba(255,255,255,.12); } } /* ========================================================================== 11) PLUS BUTTONS + PLUS MODAL ========================================================================== */ .bp-plus-row { width: 100%; margin-top: 10px; } .bp-plus-duo { display: grid; grid-template-columns: 1fr 1fr; gap: 0; width: 100%; overflow: hidden; border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 16px; box-shadow: 0 14px 30px rgba(0, 0, 0, 0.28), inset 0 0 0 1px rgba(255, 255, 255, 0.02); background: rgba(255, 255, 255, 0.02); } .bp-plus-btn { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 56px; padding: 12px 14px; overflow: hidden; appearance: none; color: #fff; text-align: left; border: none; cursor: pointer; font-family: "Oswald", sans-serif; font-size: 13px; font-weight: 800; letter-spacing: 0.04em; text-transform: uppercase; transition: transform 0.16s ease, filter 0.18s ease, box-shadow 0.18s ease; } .bp-plus-btn:hover { filter: brightness(1.05); } .bp-plus-btn:active { transform: translateY(1px) scale(0.995); } .bp-plus-btn + .bp-plus-btn { border-left: 1px solid rgba(255, 255, 255, 0.08); } .bp-plus-btn.is-classic-plus { box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.06); background: linear-gradient(135deg, rgba(26, 120, 58, 0.95), rgba(33, 168, 92, 0.95) 55%, rgba(108, 221, 148, 0.92) 100%); } .bp-plus-btn.is-family-plus { box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.06); background: linear-gradient(135deg, rgba(22, 124, 70, 0.96), rgba(214, 143, 0, 0.92) 55%, rgba(255, 195, 67, 0.92) 100%); } .bp-plus-btn::before { content: ""; position: absolute; inset: 0; pointer-events: none; transform: translateX(-125%) skewX(-18deg); background: linear-gradient( 110deg, transparent 15%, rgba(255, 255, 255, 0) 36%, rgba(255, 255, 255, 0.32) 50%, rgba(255, 255, 255, 0) 64%, transparent 85% ); } .bp-plus-btn:hover::before { animation: bpPlusSweep 0.55s ease forwards; } .bp-plus-btn__left { display: flex; flex: 1 1 auto; flex-direction: column; align-items: flex-start; justify-content: center; min-width: 0; } .bp-plus-btn__tag { font-size: 13px; line-height: 1; } .bp-plus-btn__sub { margin-top: 4px; color: rgba(255, 255, 255, 0.82); font-family: "Nunito", sans-serif; font-size: 10px; font-weight: 800; letter-spacing: 0.03em; text-transform: none; white-space: nowrap; } .bp-plus-btn__plus { display: flex; flex: 0 0 auto; align-items: center; justify-content: center; width: 28px; height: 28px; color: #fff; font-size: 16px; font-weight: 800; line-height: 1; border: 1px solid rgba(255, 255, 255, 0.18); border-radius: 999px; box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2); background: rgba(255, 255, 255, 0.14); } .bp-plus-modal { position: fixed; inset: 0; z-index: 1000002; display: none; } .bp-plus-modal.is-open { display: block; } .bp-plus-modal__ov { position: absolute; inset: 0; background: rgba(0, 0, 0, 0.76); backdrop-filter: blur(10px); } .bp-plus-modal__card { position: absolute; top: 50%; left: 50%; width: min(560px, 94vw); max-height: min(88vh, 900px); padding: 22px; overflow: auto; transform: translate(-50%, -50%); border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 24px; box-shadow: 0 30px 90px rgba(0, 0, 0, 0.78); background: linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.015)), linear-gradient(145deg, #171718, #0f0f10 58%, #181515); } .bp-plus-modal__top { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; } .bp-plus-modal__title { color: #fff; font-family: "Oswald", sans-serif; font-size: 24px; font-weight: 800; line-height: 1.05; letter-spacing: 0.03em; text-transform: uppercase; } .bp-plus-modal__meta { margin-top: 6px; color: rgba(255, 255, 255, 0.62); font-family: "Nunito", sans-serif; font-size: 13px; font-weight: 700; } .bp-plus-modal__x { display: flex; flex-shrink: 0; align-items: center; justify-content: center; width: 42px; height: 42px; color: var(--bro-orange); font-size: 19px; border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 12px; background: rgba(255, 255, 255, 0.04); cursor: pointer; } .bp-plus-modal__body { display: grid; gap: 14px; margin-top: 16px; } .bp-plus-modal__hero { display: grid; grid-template-columns: 108px 1fr; gap: 14px; align-items: center; padding: 12px; border: 1px solid rgba(255, 255, 255, 0.06); border-radius: 18px; background: rgba(255, 255, 255, 0.03); } .bp-plus-modal__hero img { width: 108px; height: 82px; object-fit: cover; border-radius: 12px; } .bp-plus-modal__hero-name { color: var(--bro-orange); font-family: "Oswald", sans-serif; font-size: 21px; font-weight: 800; line-height: 1.05; text-transform: uppercase; } .bp-plus-modal__hero-desc { margin-top: 6px; color: rgba(255, 255, 255, 0.72); font-family: "Nunito", sans-serif; font-size: 13px; font-weight: 700; line-height: 1.45; } .bp-plus-chip { display: inline-flex; align-items: center; gap: 8px; padding: 7px 12px; color: var(--bro-orange2); font-family: "Oswald", sans-serif; font-size: 11px; font-weight: 800; letter-spacing: 0.07em; text-transform: uppercase; border: 1px solid rgba(245, 168, 0, 0.2); border-radius: 999px; background: rgba(245, 168, 0, 0.08); } .bp-plus-block { padding: 14px; border: 1px solid rgba(255, 255, 255, 0.06); border-radius: 18px; background: rgba(255, 255, 255, 0.03); } .bp-plus-block__title { margin-bottom: 10px; color: var(--bro-orange); font-family: "Oswald", sans-serif; font-size: 14px; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; } .bp-plus-mods { display: grid; gap: 8px; } .bp-plus-mod { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px; border: 1px solid rgba(255, 255, 255, 0.06); border-radius: 12px; cursor: pointer; background: rgba(255, 255, 255, 0.03); transition: border-color 0.16s ease, background 0.16s ease, transform 0.16s ease; } .bp-plus-mod:hover { transform: translateY(-1px); border-color: rgba(245, 168, 0, 0.18); background: rgba(255, 255, 255, 0.045); } .bp-plus-mod.is-on { border-color: rgba(245, 168, 0, 0.32); background: rgba(245, 168, 0, 0.09); } .bp-plus-mod__left { display: flex; align-items: center; gap: 10px; min-width: 0; } .bp-plus-check { display: flex; flex-shrink: 0; align-items: center; justify-content: center; width: 20px; height: 20px; color: transparent; font-size: 12px; font-weight: 900; border: 1.5px solid rgba(255, 255, 255, 0.24); border-radius: 6px; background: rgba(0, 0, 0, 0.35); } .bp-plus-mod.is-on .bp-plus-check { color: #1a0e00; border-color: transparent; background: linear-gradient(135deg, #d48c00, #f5a800); } .bp-plus-mod__name { color: #fff; font-family: "Nunito", sans-serif; font-size: 14px; font-weight: 800; } .bp-plus-group{ display:grid; gap:8px; } .bp-plus-group + .bp-plus-group{ margin-top:12px; } .bp-plus-group__title{ padding:0 2px; color:var(--bro-orange2); font-family:"Oswald",sans-serif; font-size:12px; font-weight:800; letter-spacing:.10em; text-transform:uppercase; } .bp-plus-group__list{ display:grid; gap:8px; } .bp-plus-mod{ display:flex; align-items:center; justify-content:space-between; gap:14px; padding:12px; border:1px solid rgba(255,255,255,.06); border-radius:12px; background:rgba(255,255,255,.03); } .bp-plus-mod__left{ min-width:0; flex:1 1 auto; display:grid; gap:5px; } .bp-plus-mod__name{ color:#fff; font-family:"Nunito",sans-serif; font-size:14px; font-weight:800; line-height:1.25; } .bp-plus-mod__meta{ display:flex; flex-wrap:wrap; gap:8px 10px; align-items:center; font-family:"Nunito",sans-serif; font-size:11px; font-weight:800; line-height:1.2; } .bp-plus-mod__eur-strong{ color:var(--bro-orange2); font-family:"Oswald",sans-serif; font-size:15px; font-weight:800; letter-spacing:.02em; } .bp-plus-mod__bgn-soft{ color:rgba(255,255,255,.58); font-size:11px; font-weight:800; } .bp-plus-qtypick{ display:flex; gap:8px; flex:0 0 auto; } .bp-plus-qtybtn{ min-width:48px; height:38px; padding:0 12px; border:none; border-radius:10px; cursor:pointer; font-family:"Oswald",sans-serif; font-size:13px; font-weight:800; letter-spacing:.04em; color:rgba(255,255,255,.86); background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.08); transition:transform .14s ease, background .16s ease, border-color .16s ease, color .16s ease, box-shadow .16s ease; } .bp-plus-qtybtn:hover{ transform:translateY(-1px); border-color:rgba(245,168,0,.20); } .bp-plus-qtybtn.is-active, .bp-plus-qtybtn.is-on{ color:#ffffff; border-color:rgba(37,99,235,.42); background:linear-gradient(135deg,#1d4ed8,#2563eb,#60a5fa); box-shadow:0 8px 20px rgba(37,99,235,.28); } .bp-plus-mod__price-wrap { display: flex; flex-direction: column; align-items: flex-end; justify-content: center; gap: 3px; } .bp-plus-mod__price { color: var(--bro-orange2); font-family: "Oswald", sans-serif; font-size: 16px; font-weight: 800; line-height: 1; white-space: nowrap; } .bp-plus-mod__price-bgn { color: rgba(255, 255, 255, 0.62); font-family: "Nunito", sans-serif; font-size: 11px; font-weight: 800; line-height: 1; white-space: nowrap; } .bp-plus-empty { padding: 12px 0 2px; color: rgba(255, 255, 255, 0.52); font-family: "Nunito", sans-serif; font-size: 13px; font-weight: 700; } .bp-plus-summary { display: grid; gap: 8px; } .bp-plus-summary__row { display: flex; align-items: center; justify-content: space-between; gap: 12px; color: rgba(255, 255, 255, 0.78); font-family: "Nunito", sans-serif; font-size: 14px; font-weight: 800; } .bp-plus-summary__prices { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; } .bp-plus-summary__eur { color: #fff; font-family: "Oswald", sans-serif; font-size: 18px; font-weight: 800; line-height: 1; } .bp-plus-summary__bgn { color: rgba(255, 255, 255, 0.62); font-family: "Nunito", sans-serif; font-size: 11px; font-weight: 800; line-height: 1; } .bp-plus-summary__row.is-total { margin-top: 2px; padding-top: 10px; border-top: 1px solid rgba(255, 255, 255, 0.08); } .bp-plus-summary__eur.is-total { color: var(--bro-orange2); font-size: 22px; } .bp-plus-summary__bgn.is-total { color: rgba(255, 255, 255, 0.72); font-size: 12px; } .bp-plus-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; } .bp-plus-btn-secondary { min-width: 132px; } .bp-line__mods { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; } .bp-line__mods span { display: inline-flex; align-items: center; gap: 6px; padding: 4px 8px; color: rgba(255, 220, 150, 0.88); font-family: "Nunito", sans-serif; font-size: 11px; font-weight: 800; line-height: 1; border: 1px solid rgba(245, 168, 0, 0.14); border-radius: 999px; background: rgba(245, 168, 0, 0.08); } .bp-plus-tabs{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:12px; } .bp-plus-tab{ padding:8px 12px; border:none; border-radius:999px; cursor:pointer; font-family:"Oswald",sans-serif; font-size:12px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; color:rgba(255,255,255,.82); background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.08); } .bp-plus-tab.is-active{ color:#1a0e00; background:linear-gradient(135deg,#d48c00,#f5a800); border-color:transparent; } .bp-plus-mods-list{ display:grid; gap:8px; } .bp-plus-mod__meta{ margin-top:4px; color:rgba(255,255,255,.60); font-family:"Nunito",sans-serif; font-size:11px; font-weight:800; line-height:1.2; } /* ========================================================================== 12) RUBY / JACKPOT DECOR ========================================================================== */ .bp-ruby-stage { display: flex; align-items: center; justify-content: center; min-height: 136px; margin: 28px 0 8px; } .bp-rubywrap { position: relative; display: flex; flex-shrink: 0; align-items: center; justify-content: center; gap: 0; isolation: isolate; } .bp-ruby-orbit, .bp-ruby-orbit2 { position: absolute; pointer-events: none; border-radius: 50%; } .bp-ruby-orbit { inset: -14px; border: 1px solid rgba(245, 168, 0, 0.18); animation: bpOrbit 8s linear infinite; } .bp-ruby-orbit::before { content: ""; position: absolute; top: -3px; left: 50%; width: 6px; height: 6px; transform: translateX(-50%); border-radius: 50%; background: var(--bro-orange); box-shadow: 0 0 8px rgba(245, 168, 0, 0.8), 0 0 20px rgba(245, 168, 0, 0.4); } .bp-ruby-orbit2 { inset: -22px; border: 1px solid rgba(245, 168, 0, 0.08); animation: bpOrbit 14s linear infinite reverse; } .bp-ruby-orbit2::before { content: ""; position: absolute; right: 20%; bottom: -2px; width: 4px; height: 4px; border-radius: 50%; background: rgba(255, 70, 120, 0.85); box-shadow: 0 0 6px rgba(255, 70, 120, 0.7); } .bp-ruby { --rubyHeat: 0; --rubySize: 78px; --rubyRadius: 24px; position: relative; display: grid; flex-shrink: 0; place-items: center; width: var(--rubySize); height: var(--rubySize); overflow: visible; border: 1.5px solid rgba(245, 168, 0, 0.2); border-radius: var(--rubyRadius); box-shadow: 0 10px 30px rgba(0, 0, 0, 0.45), 0 0 calc(8px + var(--rubyHeat) * 40px) rgba(255, 35, 85, calc(0.12 + var(--rubyHeat) * 0.5)); background: rgba(245, 168, 0, 0.06); transition: box-shadow 0.25s ease, transform 0.25s ease; } .bp-ruby::before { content: ""; position: absolute; inset: -45%; pointer-events: none; opacity: calc(0.08 + var(--rubyHeat) * 0.8); filter: blur(12px); border-radius: inherit; background: radial-gradient(38% 38% at 28% 28%, rgba(255, 255, 255, 0.5), transparent 62%), radial-gradient(44% 44% at 74% 78%, rgba(255, 110, 150, 0.35), transparent 65%), radial-gradient(60% 60% at 50% 60%, rgba(255, 40, 90, 0.25), transparent 70%); } .bp-ruby__ring { position: absolute; inset: 10px; pointer-events: none; opacity: calc(0.4 + var(--rubyHeat) * 0.35); border: 1px solid rgba(245, 168, 0, calc(0.15 + var(--rubyHeat) * 0.25)); border-radius: calc(var(--rubyRadius) - 10px); } .bp-ruby__gem { position: relative; z-index: 1; width: 52px; height: 52px; border-radius: 0; box-shadow: 0 8px 18px rgba(0, 0, 0, 0.38), 0 0 calc(8px + var(--rubyHeat) * 18px) rgba(245, 168, 0, calc(0.08 + var(--rubyHeat) * 0.2)); filter: saturate(1.03) contrast(1.02); transform: none; clip-path: none; background: url("https://bropizza.bg/wp-content/uploads/2026/03/d45e2fb2-846d-4574-bb70-d38277fb999c.png") center/contain no-repeat; } .bp-ruby__spark { position: absolute; top: -25%; left: -25%; width: 150%; height: 150%; pointer-events: none; opacity: calc(0.05 + var(--rubyHeat) * 0.18); mix-blend-mode: screen; animation: bpRubySpin 10s linear infinite; background: conic-gradient(from 0deg, transparent 0 300deg, rgba(245, 168, 0, 0.3) 320deg 340deg, transparent 360deg); } .bp-ruby.is-jackpot { animation: bpRubyJackpot 1.02s ease-in-out infinite; border-color: rgba(245, 168, 0, 0.4); } .bp-rubyburst { position: fixed; inset: 0; z-index: 1000001; display: none; pointer-events: none; } .bp-rubyburst.is-on { display: block; } .bp-rubyburst__toast { position: absolute; top: 18px; left: 50%; padding: 10px 16px; color: #fff; font-family: "Oswald", sans-serif; font-size: 13px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; transform: translateX(-50%); border: 1.5px solid rgba(245, 168, 0, 0.35); border-radius: 999px; box-shadow: 0 20px 50px rgba(0, 0, 0, 0.8); background: #111; } .bp-rubyburst__toast b { color: var(--bro-orange2); } .bp-rubyburst__spark { position: absolute; top: 72px; left: 50%; width: 12px; height: 12px; transform: translateX(-50%); border-radius: 999px; box-shadow: 0 0 0 8px rgba(255, 70, 120, 0.14), 0 0 38px rgba(255, 70, 120, 0.6); background: rgba(255, 70, 120, 0.95); } .bp-rubyburst__spark::before, .bp-rubyburst__spark::after { content: ""; position: absolute; opacity: 0; animation: bpBurst 1.05s ease forwards; background: radial-gradient(circle at 22% 30%, rgba(255, 255, 255, 0.26), transparent 28%), radial-gradient(circle at 70% 22%, rgba(245, 168, 0, 0.22), transparent 26%), radial-gradient(circle at 65% 75%, rgba(255, 90, 140, 0.2), transparent 30%), radial-gradient(circle at 30% 80%, rgba(255, 204, 51, 0.14), transparent 28%); } .bp-rubyburst__spark::before { inset: -140px; filter: blur(1px); } .bp-rubyburst__spark::after { inset: -190px; filter: blur(2px); animation-delay: 0.05s; } /* ========================================================================== 13) AMETHYST DECOR — VISUALLY MATCHED TO RUBY ========================================================================== */ .bp-amethyst-sec { max-width: var(--max); margin: 24px auto 0; padding: 0 14px; background: transparent; box-shadow: none; } .bp-amethyst-shell { position: relative; overflow: visible; border: none; border-radius: 0; box-shadow: none !important; transform: none !important; filter: none !important; background: transparent; } .bp-amethyst-shell::before, .bp-amethyst-shell::after { content: none !important; display: none !important; } .bp-amethyst-stage { position: relative; display: flex; align-items: center; justify-content: center; min-height: 146px; margin: 0; padding: 0; background: transparent; box-shadow: none; } .bp-amethyst-wrap { position: relative; display: flex; align-items: center; justify-content: center; gap: 0; isolation: isolate; flex-shrink: 0; } .bp-amethyst-orbit, .bp-amethyst-orbit2 { position: absolute; pointer-events: none; border-radius: 50%; } .bp-amethyst-orbit { inset: -14px; z-index: 1; border: 1px solid rgba(195, 155, 211, 0.2); animation: bpOrbit 8s linear infinite; } .bp-amethyst-orbit::before { content: ""; position: absolute; top: -3px; left: 50%; width: 6px; height: 6px; transform: translateX(-50%); border-radius: 50%; background: #cfa8ff; box-shadow: 0 0 8px rgba(207, 168, 255, 0.9), 0 0 20px rgba(207, 168, 255, 0.45); } .bp-amethyst-orbit2 { inset: -22px; z-index: 1; border: 1px solid rgba(195, 155, 211, 0.1); animation: bpOrbit 14s linear infinite reverse; } .bp-amethyst-orbit2::before { content: ""; position: absolute; right: 20%; bottom: -2px; width: 4px; height: 4px; border-radius: 50%; background: rgba(226, 170, 255, 0.92); box-shadow: 0 0 6px rgba(226, 170, 255, 0.75); } .bp-amethyst { --amethystHeat: 0; --amethystSize: 78px; --amethystRadius: 24px; position: relative; display: grid; z-index: 3; flex-shrink: 0; place-items: center; width: var(--amethystSize); height: var(--amethystSize); overflow: visible; border: 1.5px solid rgba(195, 155, 211, 0.2); border-radius: var(--amethystRadius); box-shadow: 0 10px 30px rgba(0, 0, 0, 0.45), 0 0 calc(8px + var(--amethystHeat) * 40px) rgba(178, 122, 255, calc(0.12 + var(--amethystHeat) * 0.5)); background: rgba(195, 155, 211, 0.06); transition: box-shadow 0.25s ease, transform 0.25s ease; } .bp-amethyst::before { content: ""; position: absolute; inset: -45%; pointer-events: none; opacity: calc(0.08 + var(--amethystHeat) * 0.8); filter: blur(12px); border-radius: inherit; background: radial-gradient(38% 38% at 28% 28%, rgba(255, 255, 255, 0.5), transparent 62%), radial-gradient(44% 44% at 74% 78%, rgba(216, 183, 255, 0.35), transparent 65%), radial-gradient(60% 60% at 50% 60%, rgba(178, 122, 255, 0.25), transparent 70%); } .bp-amethyst__ring { position: absolute; inset: 10px; pointer-events: none; opacity: calc(0.4 + var(--amethystHeat) * 0.35); border: 1px solid rgba(216, 183, 255, calc(0.15 + var(--amethystHeat) * 0.25)); border-radius: calc(var(--amethystRadius) - 10px); } .bp-amethyst__gem { position: relative; z-index: 3; width: 52px; height: 52px; border-radius: 0; box-shadow: 0 8px 18px rgba(0, 0, 0, 0.38), 0 0 calc(8px + var(--amethystHeat) * 18px) rgba(178, 122, 255, calc(0.08 + var(--amethystHeat) * 0.2)); filter: saturate(1.03) contrast(1.02); transform: none; clip-path: none; background: url("https://bropizza.bg/wp-content/uploads/2026/03/f7cd521b-91c6-400c-bd87-3f6b50984d8c.png") center/contain no-repeat; } .bp-amethyst__spark { position: absolute; top: -25%; left: -25%; width: 150%; height: 150%; pointer-events: none; opacity: calc(0.05 + var(--amethystHeat) * 0.18); mix-blend-mode: screen; animation: bpRubySpin 10s linear infinite; background: conic-gradient(from 0deg, transparent 0 300deg, rgba(216, 183, 255, 0.3) 320deg 340deg, transparent 360deg); } .bp-amethyst.is-jackpot { animation: bpRubyJackpot 1.02s ease-in-out infinite; border-color: rgba(95, 255, 155, 0.52); box-shadow: 0 10px 30px rgba(0, 0, 0, 0.45), 0 0 26px rgba(60, 255, 140, 0.42), 0 0 62px rgba(60, 255, 140, 0.24); } .bp-amethyst.is-pulsing { animation: bpRubyJackpot 1.02s ease-in-out infinite !important; } .bp-amethyst-orbit-line { position: absolute; top: 50%; left: 50%; z-index: 1; pointer-events: none; transform: translate(-50%, -50%); border: 1px solid rgba(195, 155, 211, 0.18); border-radius: 50%; box-shadow: 0 0 18px rgba(178, 122, 255, 0.06); } .bp-amethyst-orbit-line::before { content: ""; position: absolute; inset: -1px; pointer-events: none; border: 1px solid rgba(255, 255, 255, 0.03); border-radius: 50%; } .bp-amethyst-particle { position: absolute; top: 50%; left: 50%; z-index: 2; pointer-events: none; opacity: 0.98; will-change: transform; border-radius: 999px; background: var(--c, #d8b7ff); box-shadow: 0 0 calc(6px + var(--glow, 0) * 18px) color-mix(in srgb, var(--c, #d8b7ff) 75%, white 25%), 0 0 calc(12px + var(--glow, 0) * 28px) color-mix(in srgb, var(--c, #d8b7ff) 45%, transparent 55%); animation-name: bpAmethystParticleOrbit; animation-timing-function: linear; animation-iteration-count: infinite; } /* ========================================================================== 14) MARQUEE STRIP ========================================================================== */ .bp-strip { position: relative; isolation: isolate; overflow: hidden; margin: 42px 0 0; padding: 22px 0; border-top: 1px solid rgba(245, 168, 0, 0.22); border-bottom: 1px solid rgba(245, 168, 0, 0.22); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04), inset 0 -1px 0 rgba(255, 255, 255, 0.04), 0 10px 26px rgba(0, 0, 0, 0.18); will-change: transform; background: radial-gradient(circle at 20% 50%, rgba(245, 168, 0, 0.08), transparent 24%), radial-gradient(circle at 80% 50%, rgba(181, 29, 29, 0.07), transparent 26%), linear-gradient(180deg, rgba(245, 168, 0, 0.07), rgba(245, 168, 0, 0.025)); } .bp-strip::before { content: ""; position: absolute; inset: 0; z-index: 2; pointer-events: none; background: linear-gradient(90deg, #090909 0%, rgba(9, 9, 9, 0) 9%, rgba(9, 9, 9, 0) 91%, #090909 100%); } .bp-strip::after { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; mix-blend-mode: screen; background: linear-gradient(180deg, rgba(255, 220, 140, 0.03), transparent 22%, transparent 78%, rgba(255, 80, 80, 0.03)); } .bp-strip-inner { position: relative; z-index: 0; display: inline-flex; align-items: center; white-space: nowrap; opacity: var(--bp-strip-opacity); color: rgba(245, 168, 0, 0.28); font-family: "Oswald", sans-serif; font-size: clamp(32px, 7vw, 80px); font-weight: 800; letter-spacing: 0.45em; text-transform: uppercase; text-shadow: 0 0 1px rgba(255, 204, 51, 0.2), 0 0 10px rgba(245, 168, 0, 0.08), 0 0 28px rgba(245, 168, 0, 0.05); will-change: transform; filter: saturate(1.04) contrast(1.04); transform: translate3d(var(--bp-strip-parallax-x), var(--bp-strip-parallax-y), 0) rotate(var(--bp-strip-parallax-rotate)); animation: bpStrip var(--bp-strip-speed) linear infinite; } .bp-strip-inner span { position: relative; margin-right: 4rem; } .bp-strip-inner span::after { content: ""; position: absolute; inset: 18% 0 16% 0; pointer-events: none; mix-blend-mode: screen; background: linear-gradient(90deg, transparent 0%, rgba(255, 220, 150, 0.03) 50%, transparent 100%); } /* ========================================================================== 15) MAP ========================================================================== */ .bp-map-sec { max-width: var(--max); margin: 0 auto; padding: 14px 14px 0; } .bp-map-head { margin-bottom: 16px; text-align: center; } .bp-map-title { margin: 4px 0 8px; color: #fff; font-family: "Oswald", sans-serif; font-size: 28px; font-weight: 800; letter-spacing: 0.02em; text-transform: uppercase; } .bp-map-sub { max-width: 580px; margin: 0 auto; color: rgba(255, 255, 255, 0.6); font-family: "Nunito", sans-serif; font-size: 14px; font-weight: 700; } .bp-map-card { overflow: hidden; border: 1px solid rgba(255, 255, 255, 0.07); border-radius: 24px; box-shadow: var(--shadow-soft); background: var(--card-2); transition: transform 0.22s ease, box-shadow 0.22s ease; } .bp-map-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-float); } .bp-map-iframe { display: block; width: 100%; height: 300px; border: 0; filter: grayscale(0.05) contrast(0.94) brightness(0.88) sepia(0.08) hue-rotate(5deg); } /* ========================================================================== 16) REVIEWS ========================================================================== */ .bp-rev-sec { max-width: var(--max); margin: 34px auto 0; padding: 0 14px; } .bp-rev-head { margin-bottom: 20px; text-align: center; } .bp-rev-title { margin: 4px 0 8px; color: #fff; font-family: "Oswald", sans-serif; font-size: 28px; font-weight: 800; letter-spacing: 0.02em; text-transform: uppercase; } .bp-rev-sub { max-width: 580px; margin: 0 auto; color: rgba(255, 255, 255, 0.6); font-family: "Nunito", sans-serif; font-size: 14px; font-weight: 700; line-height: 1.6; } .bp-rev-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-top: 16px; } .bp-rev-card { position: relative; overflow: hidden; padding: 18px 18px 16px; color: rgba(232, 232, 232, 0.95); font-family: "Nunito", sans-serif; font-size: 13px; line-height: 1.7; border: 1px solid rgba(255, 255, 255, 0.07); border-radius: 22px; box-shadow: var(--shadow-soft); background: var(--card); transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease; } .bp-rev-card::before { content: ""; position: absolute; top: -20px; right: -20px; width: 80px; height: 80px; pointer-events: none; background: radial-gradient(circle, rgba(245, 168, 0, 0.08) 0%, transparent 70%); } .bp-rev-card:hover { transform: translateY(-4px); border-color: rgba(245, 168, 0, 0.14); box-shadow: var(--shadow-float); } .bp-rev-stars { margin-bottom: 6px; color: var(--bro-orange); font-size: 17px; } .bp-rev-meta { margin-bottom: 6px; color: rgba(245, 168, 0, 0.8); font-family: "Oswald", sans-serif; font-size: 12px; font-weight: 700; letter-spacing: 0.3px; text-transform: uppercase; } .bp-rev-text { color: rgba(232, 232, 232, 0.86); font-size: 13px; font-weight: 700; line-height: 1.68; } .bp-rev-live { margin-top: 18px; padding: 18px; border: 1px solid rgba(255, 255, 255, 0.07); border-radius: 24px; box-shadow: var(--shadow-soft); background: linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.015)), rgba(245, 168, 0, 0.03); } .bp-rev-live__top { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 12px; } .bp-rev-live__title { color: var(--bro-orange); font-family: "Oswald", sans-serif; font-size: 18px; font-weight: 800; letter-spacing: 0.05em; text-transform: uppercase; } .bp-rev-live__sub { max-width: 72ch; margin-top: 3px; color: rgba(255, 255, 255, 0.6); font-family: "Nunito", sans-serif; font-size: 13px; font-weight: 700; } .bp-rev-form { display: grid; gap: 10px; margin-top: 12px; } .bp-rev-stars-pick { display: flex; flex-wrap: wrap; gap: 8px; } .bp-star-btn { display: flex; align-items: center; justify-content: center; width: 44px; height: 40px; color: var(--bro-orange); font-size: 18px; border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 999px; background: rgba(255, 255, 255, 0.03); cursor: pointer; transition: transform 0.16s ease, background 0.16s ease, border-color 0.16s ease; } .bp-star-btn:hover { transform: translateY(-1px); border-color: rgba(245, 168, 0, 0.22); background: rgba(245, 168, 0, 0.14); } .bp-star-btn.is-on { border-color: rgba(245, 168, 0, 0.34); background: rgba(245, 168, 0, 0.18); } .bp-rev-inp, .bp-rev-txt { width: 100%; padding: 12px 14px; color: #fff; outline: none; font-family: "Nunito", sans-serif; font-size: 14px; font-weight: 700; border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 14px; background: rgba(0, 0, 0, 0.36); } .bp-rev-txt { min-height: 110px; resize: vertical; line-height: 1.55; } .bp-rev-inp:focus, .bp-rev-txt:focus { border-color: rgba(245, 168, 0, 0.34); box-shadow: 0 0 0 4px rgba(245, 168, 0, 0.08); } .bp-rev-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 10px; } .bp-rev-hint { color: rgba(255, 255, 255, 0.55); font-family: "Nunito", sans-serif; font-size: 12px; } .bp-rev-err, .bp-auth__err, .bp-otp__err, .bp-forgot__err { display: none; margin-top: 10px; padding: 10px 12px; color: rgba(255, 210, 210, 0.98); font-family: "Nunito", sans-serif; font-weight: 700; border: 1px solid rgba(204, 27, 27, 0.3); border-radius: 12px; background: rgba(204, 27, 27, 0.14); } .bp-rev-err.is-on, .bp-auth__err.is-on, .bp-otp__err.is-on, .bp-forgot__err.is-on { display: block; } .bp-rev-ok, #bp-forgot-ok { display: none; padding: 10px 12px; color: rgba(255, 220, 120, 0.98); font-family: "Oswald", sans-serif; font-weight: 800; letter-spacing: 0.3px; border: 1px solid rgba(245, 168, 0, 0.28); border-radius: 12px; background: rgba(245, 168, 0, 0.12); } .bp-rev-ok.is-on, #bp-forgot-ok.is-on { display: block; } .bp-rev-dyn { margin-top: 16px; } /* ========================================================================== 17) FOOTER ========================================================================== */ .bp-ft { max-width: 1280px; margin: 44px auto 0; padding: 0 16px 32px; color: var(--bro-text); font-family: "Nunito", sans-serif; } .bp-ft-shell { position: relative; overflow: hidden; border: 1px solid rgba(255, 255, 255, 0.07); border-radius: 28px; box-shadow: 0 30px 80px rgba(0, 0, 0, 0.72); background: linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.015)), linear-gradient(145deg, #171718, #111112 60%, #191616); } .bp-ft-shell::before { content: ""; position: absolute; top: -60px; left: -60px; width: 300px; height: 300px; pointer-events: none; background: radial-gradient(circle, rgba(245, 168, 0, 0.1) 0%, transparent 65%); } .bp-ft-shell::after { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 2px; background: linear-gradient(90deg, transparent, #f5a800, #ffcc33, #f5a800, transparent); } .bp-ft-inner { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1.2fr); gap: 32px; align-items: flex-start; padding: 34px 36px 24px; border-radius: 22px 22px 0 0; } .bp-ft-col-title { margin-bottom: 18px; color: var(--bro-orange); font-family: "Oswald", sans-serif; font-size: 13px; font-weight: 700; letter-spacing: 0.22em; text-transform: uppercase; } .bp-ft-list { display: flex; flex-direction: column; gap: 18px; } .bp-ft-item { padding: 16px; border: 1px solid rgba(255, 255, 255, 0.06); border-radius: 18px; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.26); background: rgba(255, 255, 255, 0.03); } .bp-ft-item-name { margin-bottom: 4px; color: var(--bro-orange); font-family: "Oswald", sans-serif; font-size: 16px; font-weight: 800; letter-spacing: 0.3px; text-transform: uppercase; } .bp-ft-item-addr { margin-bottom: 4px; color: var(--bro-muted); font-family: "Nunito", sans-serif; font-size: 13px; font-weight: 700; } .bp-ft-item-meta { color: #cccccc; font-family: "Nunito", sans-serif; font-size: 12px; font-weight: 700; } .bp-ft-item-meta::before { content: "● "; color: var(--bro-orange); font-weight: 700; } .bp-ft-contacts { display: flex; flex-direction: column; gap: 18px; min-width: 0; } .bp-ft-clabel { margin-bottom: 4px; color: var(--bro-orange); font-family: "Oswald", sans-serif; font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; } .bp-ft-ctitle { margin-bottom: 6px; font-family: "Oswald", sans-serif; font-size: 18px; font-weight: 800; letter-spacing: 0.5px; text-transform: uppercase; } .bp-ft-ctext { margin-bottom: 10px; color: #cccccc; font-family: "Nunito", sans-serif; font-size: 13px; font-weight: 700; line-height: 1.65; } .bp-ft-clink { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 4px; color: var(--bro-orange); font-family: "Oswald", sans-serif; font-size: 15px; font-weight: 800; letter-spacing: 0.3px; overflow-wrap: anywhere; } .bp-ft a[href^="tel:"], .bp-ft-clink[href^="tel:"] { display: none !important; } .bp-ft-pill { display: inline-flex; align-items: center; gap: 8px; max-width: 100%; margin-top: 10px; padding: 8px 14px; color: var(--bro-orange); font-family: "Oswald", sans-serif; font-size: 11px; font-weight: 700; letter-spacing: 0.3px; text-transform: uppercase; border: 1px solid rgba(245, 168, 0, 0.2); border-radius: 999px; background: rgba(245, 168, 0, 0.08); } .bp-ft-pill-dot { width: 8px; height: 8px; border-radius: 999px; box-shadow: 0 0 10px rgba(245, 168, 0, 0.8); background: var(--bro-orange); } .bp-ft-bottom { position: relative; z-index: 2; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px; padding: 14px 26px 16px; color: var(--bro-muted); font-size: 12px; border-top: 1px solid rgba(255, 255, 255, 0.06); border-radius: 0 0 22px 22px; background: rgba(0, 0, 0, 0.4); } .bp-ft-bottom-l{ display:flex; flex-wrap:wrap; align-items:center; gap:10px 18px; font-family:"Nunito",sans-serif; font-weight:700; } .bp-ft-bottom-r{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; } .bp-footer-policy-badge{ display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:9px 14px; border-radius:999px; text-decoration:none; font-family:'Nunito',sans-serif; font-size:12px; font-weight:900; letter-spacing:.03em; line-height:1; color:#fff8e8; background: linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.04)), linear-gradient(135deg, rgba(245,168,0,.22), rgba(255,211,106,.10) 52%, rgba(255,255,255,.03) 100%); border:1px solid rgba(245,168,0,.34); box-shadow: 0 10px 28px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.10); transition:.18s ease; } .bp-footer-policy-badge:hover{ transform:translateY(-1px); color:#ffffff; border-color:rgba(255,211,106,.58); background: linear-gradient(180deg, rgba(255,255,255,.13), rgba(255,255,255,.05)), linear-gradient(135deg, rgba(245,168,0,.30), rgba(255,211,106,.16) 52%, rgba(255,255,255,.04) 100%); box-shadow: 0 14px 30px rgba(0,0,0,.22), 0 0 18px rgba(245,168,0,.14), inset 0 1px 0 rgba(255,255,255,.12); } .bp-footer-policy-badge__icon{ color:#f5a800; font-size:11px; line-height:1; text-shadow:0 0 12px rgba(245,168,0,.50); } .bp-footer-policy-badge__text{ line-height:1; } .bp-ft-epill--lux{ display:inline-flex; align-items:center; justify-content:center; padding:10px 16px; border-radius:999px; text-decoration:none; font-family:'Nunito',sans-serif; font-size:12px; font-weight:900; letter-spacing:.02em; color:#fffdf8; background: linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,.05)), linear-gradient(135deg, rgba(255,219,130,.18), rgba(215,221,230,.16) 48%, rgba(255,255,255,.05) 100%); border:1px solid rgba(255,230,170,.26); box-shadow: 0 12px 30px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.16); transition:.18s ease; } .bp-ft-epill--lux:hover{ transform:translateY(-1px); color:#ffffff; border-color:rgba(255,226,150,.44); background: linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.06)), linear-gradient(135deg, rgba(255,219,130,.24), rgba(224,230,238,.20) 48%, rgba(255,255,255,.06) 100%); box-shadow: 0 16px 34px rgba(0,0,0,.22), 0 0 18px rgba(255,211,106,.10), inset 0 1px 0 rgba(255,255,255,.18); } .bp-ft-accent { color: var(--bro-orange); font-family: "Oswald", sans-serif; font-weight: 800; } .bp-ft-bottom-r { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; } .bp-ft-epill { display: inline-flex; align-items: center; justify-content: center; max-width: 100%; padding: 6px 18px; color: var(--bro-orange); font-family: "Oswald", sans-serif; font-size: 12px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; border: 1px solid rgba(245, 168, 0, 0.2); border-radius: 999px; background: rgba(245, 168, 0, 0.1); transition: transform 0.18s ease; } .bp-ft-epill:hover { transform: translateY(-2px); background: rgba(245, 168, 0, 0.18); } /* ========================================================================== 18) DRAWER / CART ========================================================================== */ .bp-dw { position: fixed; inset: 0; z-index: 999999; pointer-events: none; visibility: hidden; opacity: 0; transition: opacity 0.16s ease; } .bp-dw.is-open { pointer-events: auto; visibility: visible; opacity: 1; } .bp-dw__ov { position: absolute; inset: 0; opacity: 0; backdrop-filter: blur(10px); background: rgba(0, 0, 0, 0.7); transition: opacity 0.18s ease; } .bp-dw.is-open .bp-dw__ov { opacity: 1; } .bp-dw__panel { position: fixed; top: 0; right: 0; bottom: 0; display: flex !important; flex-direction: column !important; width: min(430px, 92vw); max-width: 100%; height: 100vh; height: 100dvh; max-height: 100dvh; transform: translateX(110%) !important; will-change: transform; border-left: 1px solid rgba(255, 255, 255, 0.08); box-shadow: -20px 0 60px rgba(0, 0, 0, 0.64); background: linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.015)), linear-gradient(170deg, #171718 0%, #101011 100%); transition: transform 0.22s ease; } .bp-dw.is-open .bp-dw__panel { transform: translateX(0) !important; } .bp-dw__h { display: flex; align-items: center; justify-content: space-between; padding: 20px 20px 16px; border-bottom: 1px solid rgba(255, 255, 255, 0.06); } .bp-dw__h b { color: var(--bro-orange); font-family: "Oswald", sans-serif; font-size: 20px; font-weight: 800; letter-spacing: 1px; text-transform: uppercase; } .bp-dw__x { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; color: var(--bro-orange); font-size: 18px; border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 12px; background: rgba(255, 255, 255, 0.04); cursor: pointer; } .bp-dw__b { flex: 1 1 auto !important; min-height: 0; padding: 14px 16px; overflow: auto !important; -webkit-overflow-scrolling: touch; } .bp-dw__pickup { display: flex; align-items: center; gap: 8px; margin: 0 0 12px; padding: 10px 14px; color: rgba(255, 255, 255, 0.75); font-family: "Nunito", sans-serif; font-size: 12px; font-weight: 700; border: 1px solid rgba(245, 168, 0, 0.18); border-radius: 14px; background: rgba(245, 168, 0, 0.07); } .bp-dw__pickup strong { color: var(--bro-orange); font-family: "Oswald", sans-serif; font-size: 12px; letter-spacing: 0.5px; text-transform: uppercase; } .bp-dw__pickup--burger { margin: -2px 0 12px; padding: 10px 14px; color: rgba(255, 235, 220, 0.86); font-family: "Nunito", sans-serif; font-size: 12px; font-weight: 800; line-height: 1.45; border: 1px solid rgba(255, 120, 40, 0.22); border-radius: 14px; background: rgba(255, 120, 40, 0.08); } .bp-dw__pickup--burger strong { color: #ffcc99; font-family: "Oswald", sans-serif; letter-spacing: 0.04em; text-transform: uppercase; } .bp-line { display: grid; grid-template-columns: 62px minmax(0, 1fr) auto; gap: 10px; min-width: 0; margin-bottom: 10px; padding: 12px; border: 1px solid rgba(255, 255, 255, 0.06); border-radius: 16px; background: rgba(255, 255, 255, 0.03); } .bp-line img { width: 62px; height: 52px; object-fit: cover; border-radius: 12px; } .bp-ln { color: var(--bro-orange); font-family: "Oswald", sans-serif; font-size: 14px; font-weight: 800; letter-spacing: 0.3px; text-transform: uppercase; overflow-wrap: break-word; } .bp-lu { margin-top: 2px; color: rgba(255, 255, 255, 0.55); font-family: "Nunito", sans-serif; font-size: 12px; font-weight: 700; } .bp-qr { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; } .bp-qty { display: flex; align-items: center; gap: 8px; } .bp-qb { display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; color: var(--bro-orange); font-size: 16px; border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 10px; background: rgba(255, 255, 255, 0.04); cursor: pointer; } .bp-qv { min-width: 18px; color: #ffffff; font-family: "Oswald", sans-serif; font-size: 15px; font-weight: 800; text-align: center; } .bp-sum { color: var(--bro-orange); font-family: "Oswald", sans-serif; font-size: 15px; font-weight: 800; } .bp-rm { color: rgba(255, 255, 255, 0.45); font-family: "Nunito", sans-serif; font-size: 12px; text-decoration: underline; border: none; background: transparent; cursor: pointer; } .bp-dw__f { position: sticky !important; bottom: 0 !important; z-index: 2 !important; padding: 14px 16px calc(16px + env(safe-area-inset-bottom, 0px)) !important; border-top: 1px solid rgba(255, 255, 255, 0.06); background: #101011 !important; } .bp-note { margin: 4px 0 10px; } .bp-note label { display: block; margin: 0 0 6px; color: var(--bro-orange); font-family: "Oswald", sans-serif; font-size: 11px; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; } .bp-note textarea { width: 100%; min-height: 74px; padding: 12px 12px; resize: vertical; color: #fff; outline: none; font-family: "Nunito", sans-serif; font-size: 13px; font-weight: 700; line-height: 1.45; border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 12px; background: rgba(0, 0, 0, 0.42); } .bp-note textarea:focus { border-color: rgba(245, 168, 0, 0.28); box-shadow: 0 0 0 4px rgba(245, 168, 0, 0.08); } .bp-note-hint { margin-top: 6px; color: rgba(255, 255, 255, 0.5); font-family: "Nunito", sans-serif; font-size: 12px; line-height: 1.35; } .bp-t { display: flex; justify-content: space-between; gap: 12px; padding: 5px 0; color: rgba(255, 255, 255, 0.82); font-family: "Nunito", sans-serif; font-weight: 700; } .bp-t b { color: var(--bro-orange); font-family: "Oswald", sans-serif; font-size: 16px; font-weight: 800; white-space: nowrap; } .bp-t.m { color: rgba(255, 255, 255, 0.5); font-size: 13px; } .bp-t.m b { color: rgba(245, 168, 0, 0.75); font-size: 14px; } .bp-check { width: 100% !important; margin-top: 12px; color: #1a0e00 !important; font-family: "Oswald", sans-serif !important; font-size: 15px !important; font-weight: 800 !important; letter-spacing: 1px !important; text-transform: uppercase !important; border: none !important; border-radius: 999px !important; cursor: pointer; box-shadow: 0 8px 24px rgba(245, 168, 0, 0.28) !important; background: linear-gradient(135deg, #b97800, #f5a800, #ffcc33) !important; } .bp-check:hover { transform: translateY(-1px) !important; filter: brightness(1.05); } .bp-jackpot-banner { margin: 12px 0 0; padding: 12px 14px; border: 1px solid rgba(245, 168, 0, 0.2); border-radius: 18px; box-shadow: 0 10px 26px rgba(0, 0, 0, 0.2); background: linear-gradient(135deg, rgba(255, 70, 120, 0.12), rgba(245, 168, 0, 0.1)); } .bp-jackpot-banner[hidden] { display: none !important; } .bp-jackpot-banner__badge { display: inline-flex; align-items: center; gap: 8px; padding: 6px 10px; color: var(--bro-orange2); font-family: "Oswald", sans-serif; font-size: 11px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; border: 1px solid rgba(245, 168, 0, 0.2); border-radius: 999px; background: rgba(255, 255, 255, 0.06); } .bp-jackpot-banner__title { margin-top: 8px; color: #fff; font-family: "Oswald", sans-serif; font-size: 18px; font-weight: 800; line-height: 1.05; letter-spacing: 0.02em; text-transform: uppercase; } .bp-jackpot-banner__sub { margin-top: 6px; color: rgba(255, 255, 255, 0.8); font-family: "Nunito", sans-serif; font-size: 13px; font-weight: 700; line-height: 1.45; } .bp-jackpot-banner__prices { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 10px; } .bp-jackpot-banner__box { flex: 1 1 120px; min-width: 0; padding: 10px 12px; border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 12px; background: rgba(0, 0, 0, 0.22); } .bp-jackpot-banner__k { color: rgba(255, 255, 255, 0.6); font-family: "Oswald", sans-serif; font-size: 11px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; } .bp-jackpot-banner__v { margin-top: 4px; color: #fff; font-family: "Oswald", sans-serif; font-size: 20px; font-weight: 800; line-height: 1; } .bp-jackpot-banner__v.is-old { color: rgba(255, 255, 255, 0.55); text-decoration: line-through; } .bp-jackpot-banner__v.is-new { color: var(--bro-orange2); text-shadow: 0 0 18px rgba(245, 168, 0, 0.18); } /* ========================================================================== 19) FLOATING CART ========================================================================== */ .bp-floating-cart { position: fixed; right: 18px; bottom: calc(74px + env(safe-area-inset-bottom, 0px)); z-index: 999998; display: inline-flex; align-items: center; justify-content: center; width: 66px; height: 66px; isolation: isolate; user-select: none; -webkit-tap-highlight-color: transparent; color: var(--bp-cart-icon-color, #1a0e00); outline: none; cursor: pointer; border: 1px solid var(--bp-cart-border, rgba(245, 168, 0, 0.24)); border-radius: 999px; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.28), 0 18px 40px rgba(0, 0, 0, 0.44), 0 12px 28px rgba(var(--bp-cart-glow-rgb, 245, 168, 0), 0.24), 0 0 0 1px var(--bp-cart-border, rgba(245, 168, 0, 0.24)); background: linear-gradient(135deg, var(--bp-cart-grad-a, #b97800) 0%, var(--bp-cart-grad-b, #f5a800) 42%, var(--bp-cart-grad-c, #ffe093) 100%); transition: transform 0.18s ease, box-shadow 0.18s ease, filter 0.18s ease, opacity 0.18s ease; } .bp-floating-cart:hover { transform: translateY(-2px) scale(1.03); filter: brightness(1.04); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3), 0 24px 50px rgba(0, 0, 0, 0.52), 0 14px 34px rgba(var(--bp-cart-glow-rgb, 245, 168, 0), 0.32), 0 0 0 1px var(--bp-cart-border, rgba(245, 168, 0, 0.3)); } .bp-floating-cart:active { transform: translateY(0) scale(0.99); } .bp-floating-cart::before { content: ""; position: absolute; inset: 0; pointer-events: none; border-radius: inherit; background: radial-gradient(52px 52px at 30% 28%, var(--bp-cart-shine, rgba(255, 255, 255, 0.28)), transparent 62%), linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0)); } .bp-floating-cart::after { content: ""; position: absolute; inset: -8px; z-index: -1; pointer-events: none; opacity: 0.55; filter: blur(12px); border-radius: inherit; background: radial-gradient(circle, rgba(var(--bp-cart-glow-rgb, 245, 168, 0), 0.2) 0%, rgba(var(--bp-cart-glow-rgb, 245, 168, 0), 0.1) 38%, transparent 72%); } .bp-floating-cart.is-empty { opacity: 0.86; } .bp-floating-cart__icon { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; font-size: 26px; font-weight: 800; line-height: 1; transform: translateY(1px); text-shadow: 0 1px 0 rgba(255, 255, 255, 0.18); } .bp-floating-cart__count { position: absolute; top: -3px; right: -2px; display: inline-flex; align-items: center; justify-content: center; min-width: 24px; height: 24px; padding: 0 7px; color: var(--bp-cart-badge-color, #111111); font-family: "Oswald", sans-serif; font-size: 12px; font-weight: 800; line-height: 1; border-radius: 999px; box-shadow: 0 10px 24px rgba(0, 0, 0, 0.28), 0 0 0 4px rgba(255, 255, 255, 0.08); background: linear-gradient(135deg, var(--bp-cart-badge-a, #fff6d6), var(--bp-cart-badge-b, #ffffff)); } /* ========================================================================== 20) GLOBAL MODALS / AUTH / OTP / FORGOT ========================================================================== */ .bp-modal, .bp-auth, .bp-otp, .bp-forgot { position: fixed; inset: 0; z-index: 1000000; display: none; } .bp-modal.is-open, .bp-auth.is-open, .bp-otp.is-open, .bp-forgot.is-open { display: block; } .bp-modal__ov, .bp-auth__ov, .bp-otp__ov, .bp-forgot__ov { position: absolute; inset: 0; backdrop-filter: blur(10px); background: rgba(0, 0, 0, 0.76); } .bp-modal__card, .bp-auth__card, .bp-otp__card, .bp-forgot__card { position: absolute; top: 50%; left: 50%; width: min(520px, 92vw); max-width: calc(100vw - 20px); max-height: calc(100dvh - 20px); padding: 24px; overflow: auto; transform: translate(-50%, -50%); border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 24px; box-shadow: var(--shadow-soft), 0 0 0 1px rgba(245, 168, 0, 0.06); background: linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.015)), linear-gradient(145deg, #171718, #111112 62%, #191515); } .bp-auth__card { width: min(540px, 92vw); } .bp-modal__top { display: flex; align-items: center; gap: 14px; } .bp-ok { display: flex; flex-shrink: 0; align-items: center; justify-content: center; width: 46px; height: 46px; color: var(--bro-orange); font-size: 22px; font-weight: 800; border: 1px solid rgba(245, 168, 0, 0.28); border-radius: 14px; background: rgba(245, 168, 0, 0.18); } .bp-modal__t { color: var(--bro-orange); font-family: "Oswald", sans-serif; font-size: 20px; font-weight: 800; letter-spacing: 0.5px; text-transform: uppercase; } .bp-modal__s { margin-top: 3px; color: rgba(255, 255, 255, 0.65); font-family: "Nunito", sans-serif; font-size: 14px; font-weight: 700; } .bp-modal__id { margin-top: 10px; color: rgba(255, 255, 255, 0.5); font-family: "Nunito", sans-serif; font-size: 12px; } .bp-modal__btns { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; margin-top: 16px; } .bp-modal__pickup { display: flex; align-items: center; gap: 8px; margin-top: 12px; padding: 10px 14px; color: rgba(255, 255, 255, 0.8); font-family: "Nunito", sans-serif; font-size: 13px; font-weight: 700; border: 1px solid rgba(245, 168, 0, 0.2); border-radius: 14px; background: rgba(245, 168, 0, 0.08); } .bp-modal__pickup strong { color: var(--bro-orange); } .bp-modal__burger { margin-top: 10px; padding: 10px 14px; color: rgba(255, 235, 220, 0.9); font-family: "Nunito", sans-serif; font-size: 13px; font-weight: 800; line-height: 1.45; border: 1px solid rgba(255, 120, 40, 0.22); border-radius: 14px; background: rgba(255, 120, 40, 0.08); } .bp-modal__burger strong { color: #ffcc99; font-family: "Oswald", sans-serif; letter-spacing: 0.04em; text-transform: uppercase; } .bp-auth__top, .bp-otp__top, .bp-forgot__top { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; } .bp-auth__top b, .bp-otp__top b, .bp-forgot__top b { color: var(--bro-orange); font-family: "Oswald", sans-serif; font-size: 20px; font-weight: 800; letter-spacing: 0.5px; text-transform: uppercase; } .bp-auth__x, .bp-otp__x, .bp-forgot__x { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; color: var(--bro-orange); font-size: 18px; border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 12px; background: rgba(255, 255, 255, 0.04); cursor: pointer; } .bp-auth__tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; } .bp-auth__tab { padding: 8px 16px; color: rgba(255, 255, 255, 0.75); font-family: "Oswald", sans-serif; font-size: 13px; font-weight: 700; letter-spacing: 0.3px; text-transform: uppercase; border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 999px; background: rgba(255, 255, 255, 0.03); cursor: pointer; } .bp-auth__tab.is-active { color: #1a0e00; border-color: transparent; background: linear-gradient(135deg, #d48c00, #f5a800); } .bp-auth__form { display: grid; gap: 12px; margin-top: 14px; } .bp-field { display: flex; flex-direction: column; gap: 6px; } .bp-field label { color: var(--bro-orange); font-family: "Oswald", sans-serif; font-size: 11px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; } .bp-field input { width: 100%; padding: 12px 14px; color: #ffffff; outline: none; font-family: "Nunito", sans-serif; font-size: 14px; font-weight: 700; border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 12px; background: rgba(0, 0, 0, 0.42); } .bp-field select { width: 100%; padding: 12px 14px; color: #ffffff; outline: none; font-family: "Nunito", sans-serif; font-size: 14px; font-weight: 700; border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 12px; background: rgba(0, 0, 0, 0.42); appearance: none; -webkit-appearance: none; -moz-appearance: none; } .bp-field select:focus { border-color: rgba(245, 168, 0, 0.3); box-shadow: 0 0 0 4px rgba(245, 168, 0, 0.08); } .bp-field input:focus { border-color: rgba(245, 168, 0, 0.3); box-shadow: 0 0 0 4px rgba(245, 168, 0, 0.08); } .bp-auth__hint, .bp-otp__hint, .bp-forgot__hint { color: rgba(255, 255, 255, 0.6); font-family: "Nunito", sans-serif; font-size: 13px; font-weight: 700; line-height: 1.45; } .bp-auth__actions, .bp-otp__actions, .bp-forgot__actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; margin-top: 12px; } .bp-auth__subactions { display: flex; justify-content: flex-end; margin-top: -2px; } .bp-auth__link { padding: 0; color: var(--bro-orange2); font-family: "Nunito", sans-serif; font-size: 13px; font-weight: 800; text-decoration: underline; border: none; background: transparent; cursor: pointer; } /* ========================================================================== 21) PICKUP GUIDE ========================================================================== */ .pickup-guide { color: #fff; } .pickup-title { margin-bottom: 20px; font-size: 18px; font-weight: 700; letter-spacing: 0.5px; } .pickup-title span { color: #f5a623; } .pickup-title small { display: block; margin-top: 4px; font-size: 11px; opacity: 0.6; } .pickup-steps { display: flex; flex-direction: column; gap: 14px; } .step { display: flex; align-items: flex-start; gap: 12px; } .step-number { display: flex; align-items: center; justify-content: center; min-width: 26px; height: 26px; color: #000; font-size: 13px; font-weight: 700; border-radius: 50%; background: #f5a623; } .step-icon { font-size: 16px; line-height: 26px; } .step-title { font-size: 14px; font-weight: 600; } .step-desc { margin-top: 3px; font-size: 12px; line-height: 1.45; opacity: 0.7; } .pickup-footer { display: flex; flex-direction: column; gap: 6px; margin-top: 18px; font-size: 12px; opacity: 0.75; } .pickup-guide--scheduled{ margin-top:18px; } .pickup-guide--scheduled .pickup-title span{ color: var(--bro-orange2); } .pickup-guide--scheduled .step-number{ background: linear-gradient(135deg, #b97800, #f5a800, #ffd36a); box-shadow: 0 8px 18px rgba(245,168,0,.22), 0 0 0 4px rgba(245,168,0,.10); } .pickup-guide--scheduled .step{ padding: 12px 12px; border: 1px solid rgba(255,255,255,.06); border-radius: 16px; background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015)), rgba(255,255,255,.02); box-shadow: 0 8px 22px rgba(0,0,0,.18); } .pickup-guide--scheduled .step-title{ color:#fff; font-family:"Oswald",sans-serif; font-size:14px; font-weight:800; letter-spacing:.02em; text-transform:uppercase; } .pickup-guide--scheduled .step-desc{ color:rgba(255,255,255,.72); font-size:12px; font-weight:700; line-height:1.5; } .pickup-guide--scheduled .pickup-footer{ margin-top:16px; padding:14px 16px; border:1px solid rgba(245,168,0,.16); border-radius:16px; background:rgba(245,168,0,.06); color:rgba(255,245,220,.84); font-size:12px; font-weight:700; line-height:1.5; } /* ========================================================================== 22) KEYFRAMES ========================================================================== */ @keyframes bpLuxShine { 0% { transform: translateX(-120%); } 100% { transform: translateX(160%); } } @keyframes bpLogoHeatSweep { 0% { transform: translateX(-28%) skewX(-10deg); } 100% { transform: translateX(28%) skewX(-10deg); } } @keyframes bpLogoHeatWobble1 { 0%, 100% { transform: translate3d(0, 0, 0) skewX(0deg); } 22% { transform: translate3d(0.18px, -0.08px, 0) skewX(0.2deg); } 50% { transform: translate3d(-0.24px, 0.12px, 0) skewX(-0.22deg); } 78% { transform: translate3d(0.12px, 0.04px, 0) skewX(0.12deg); } } @keyframes bpLogoHeatWobble2 { 0%, 100% { transform: translate3d(0, 0, 0) skewX(0deg) scaleY(1); } 18% { transform: translate3d(0.45px, -0.18px, 0) skewX(0.42deg) scaleY(1.002); } 48% { transform: translate3d(-0.52px, 0.22px, 0) skewX(-0.46deg) scaleY(0.998); } 80% { transform: translate3d(0.24px, 0.06px, 0) skewX(0.18deg) scaleY(1.001); } } @keyframes bpLogoHeatWobble3 { 0%, 100% { transform: translate3d(0, 0, 0) skewX(0deg) scaleY(1); } 15% { transform: translate3d(0.72px, -0.28px, 0) skewX(0.66deg) scaleY(1.004); } 34% { transform: translate3d(-0.95px, 0.34px, 0) skewX(-0.78deg) scaleY(0.996); } 56% { transform: translate3d(0.74px, 0.12px, 0) skewX(0.44deg) scaleY(1.003); } 82% { transform: translate3d(-0.56px, -0.18px, 0) skewX(-0.32deg) scaleY(0.998); } } @keyframes bpLogoHeatWobble4 { 0%, 100% { transform: translate3d(0, 0, 0) skewX(0deg) scaleY(1); } 14% { transform: translate3d(1px, -0.42px, 0) skewX(0.82deg) scaleY(1.007); } 33% { transform: translate3d(-1.18px, 0.4px, 0) skewX(-0.92deg) scaleY(0.993); } 52% { transform: translate3d(0.82px, 0.16px, 0) skewX(0.58deg) scaleY(1.005); } 78% { transform: translate3d(-0.92px, -0.28px, 0) skewX(-0.54deg) scaleY(0.996); } } @keyframes bpLogoHeatBreath { 0%, 100% { opacity: 1; } 50% { opacity: 0.985; } } @keyframes bpBlitz { 0% { opacity: 1; transform: translateX(-120%) skewX(-20deg); } 60% { opacity: 1; transform: translateX(20%) skewX(-20deg); } 100% { opacity: 0; transform: translateX(140%) skewX(-20deg); } } @keyframes bpPulse { 0%, 100% { transform: translateY(0) scale(1); } 45% { transform: translateY(-1px) scale(1.02); } } @keyframes bpPlusSweep { 0% { opacity: 1; transform: translateX(-125%) skewX(-18deg); } 100% { opacity: 0; transform: translateX(140%) skewX(-18deg); } } @keyframes bpOrbit { to { transform: rotate(360deg); } } @keyframes bpRubySpin { to { transform: rotate(360deg); } } @keyframes bpRubyJackpot { 0%, 100% { transform: translateY(0) scale(1); } 50% { transform: translateY(-2px) scale(1.02); } } @keyframes bpBurst { 0% { opacity: 0; transform: scale(0.72); } 20% { opacity: 1; } 100% { opacity: 0; transform: scale(1.15); } } @keyframes bpAmethystParticleOrbit { from { transform: translate(-50%, -50%) rotate(var(--start-angle, 0deg)) translateX(var(--orbit-radius, 40px)); } to { transform: translate(-50%, -50%) rotate(calc(var(--start-angle, 0deg) + var(--turn, 360deg))) translateX(var(--orbit-radius, 40px)); } } @keyframes bpStrip { 0% { transform: translate3d(calc(0% + var(--bp-strip-parallax-x)), var(--bp-strip-parallax-y), 0) rotate(var(--bp-strip-parallax-rotate)); } 100% { transform: translate3d(calc(-50% + var(--bp-strip-parallax-x)), var(--bp-strip-parallax-y), 0) rotate(var(--bp-strip-parallax-rotate)); } } /* ========================================================================== 23) RESPONSIVE ========================================================================== */ @media (min-width: 1081px) { .bp-hero { border-radius: 34px !important; } .bp-hero__in, .bp-hero__in::after { border-radius: 34px !important; } .bp-hero__lux { display: grid !important; grid-template-columns: minmax(0, 1.08fr) minmax(480px, 0.92fr) !important; grid-template-areas: "left right" !important; align-items: center !important; gap: 34px !important; min-height: 590px !important; padding: 34px !important; } .bp-hero__left { grid-area: left !important; display: flex !important; flex-direction: column !important; align-items: flex-start !important; justify-content: center !important; min-width: 0 !important; max-width: 100% !important; padding: 4px 0 !important; } .bp-hero__right { grid-area: right !important; display: flex !important; align-items: center !important; justify-content: center !important; min-width: 0 !important; min-height: 100% !important; padding: 12px !important; overflow: visible !important; } .bp-hero__right::before { inset: 0 !important; border: 1px solid rgba(255, 255, 255, 0.07) !important; border-radius: 30px !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 20px 40px rgba(0, 0, 0, 0.2) !important; background: radial-gradient(circle at 24% 22%, rgba(245, 168, 0, 0.12), transparent 30%), radial-gradient(circle at 78% 78%, rgba(181, 29, 29, 0.14), transparent 28%), linear-gradient(180deg, rgba(255, 255, 255, 0.03), rgba(255, 255, 255, 0.012)) !important; } .bp-hero__top { display: flex !important; flex-wrap: nowrap !important; align-items: center !important; justify-content: space-between !important; gap: 18px !important; width: 100% !important; margin-bottom: 22px !important; } .bp-logo-slot { padding: 14px 18px !important; border-radius: 20px !important; } .bp-hero-badge { flex: 0 0 auto !important; margin-left: auto !important; white-space: nowrap !important; } .bp-pill { margin-bottom: 16px !important; } .bp-h1 { max-width: 9.3ch !important; margin: 8px 0 20px !important; font-size: clamp(56px, 5.8vw, 92px) !important; line-height: 1.04 !important; } .bp-lead { max-width: 58ch !important; margin: 0 0 22px !important; font-size: 17px !important; line-height: 1.72 !important; } .bp-hero-glass { width: 100% !important; max-width: 640px !important; margin-top: 24px !important; padding: 18px 20px 18px !important; border-radius: 24px !important; } .bp-hero-showcase { width: 100% !important; max-width: 640px !important; min-height: 560px !important; height: 100% !important; aspect-ratio: auto !important; overflow: visible !important; border-radius: 32px !important; isolation: isolate !important; } .bp-hero-showcase__ring--1 { inset: 26px !important; } .bp-hero-showcase__ring--2 { inset: 58px !important; } .bp-hero-card--main { width: 68% !important; min-height: 340px !important; padding: 30px 26px 26px !important; transform: rotate(-4deg) translateY(8px) !important; } .bp-hero-card__title { max-width: 6.1ch !important; font-size: 56px !important; line-height: 0.94 !important; } .bp-hero-card__text { max-width: 24ch !important; margin-top: 18px !important; font-size: 15px !important; line-height: 1.72 !important; } .bp-hero-mini { min-width: 172px !important; padding: 16px 18px 15px !important; border-radius: 20px !important; } .bp-hero-mini--gold { top: 64px !important; right: -18px !important; } .bp-hero-mini--dark { bottom: 42px !important; left: -22px !important; } .bp-hero-mini__value { font-size: 30px !important; } } @media (max-width: 1080px) { .bp-hero__lux { grid-template-columns: 1fr; min-height: auto; } .bp-hero__right { min-height: 420px; padding: 6px 0 10px; } .bp-h1 { max-width: none; } .bp-hero-card--main { width: 76%; min-height: 300px; } .bp-hero-mini { min-width: 154px; } .bp-hero-mini--gold { top: 118px; right: -2px; } .bp-hero-mini--dark { bottom: 8px; left: -4px; } } @media (max-width: 980px) { .bp-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (max-width: 820px) { .bp-rev-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (max-width: 680px) { .bp-wrap { padding: max(12px, env(safe-area-inset-top, 0px)) 10px 0; } .bp-grid { grid-template-columns: 1fr; } .bp-grid.bp-grid--drinks { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; } .bp-grid.bp-grid--drinks .bp-p .b { padding: 10px 10px 12px; } .bp-grid.bp-grid--drinks .bp-p h4 { font-size: 13px; line-height: 1.14; } .bp-grid.bp-grid--drinks .bp-p p { margin: 5px 0 8px; font-size: 11px; line-height: 1.3; } .bp-grid.bp-grid--drinks .bp-p img { padding: 0; aspect-ratio: 1 / 1; object-fit: cover !important; } .bp-grid.bp-grid--drinks .bp-row2 { flex-direction: column; align-items: stretch; gap: 8px; } .bp-add2 { flex: 1 1 0; min-width: 0; min-height: 58px; padding: 10px 12px; } .bp-add2__tag { font-size: 11px; } .bp-add2__eur { font-size: 17px; } .bp-adds { width: 100%; } .bp-adds--burger { grid-template-columns: 1fr; } .bp-row2 { flex-direction: column; align-items: stretch; } .bp-rev-grid { grid-template-columns: 1fr; } .bp-ft-inner { grid-template-columns: 1fr; gap: 24px; padding: 26px 22px 20px; } .bp-ft-bottom { flex-direction: column; align-items: flex-start; } .bp-hero__lux { gap: 16px; padding: 16px; } .bp-hero__top { flex-wrap: wrap; align-items: flex-start; margin-bottom: 18px; } .bp-logo-slot { padding: 9px 12px; border-radius: 16px; } .bp-logo-text { font-size: 22px; } .bp-hero-badge { flex-wrap: wrap; max-width: 100%; row-gap: 4px; } .bp-pill { max-width: 100%; line-height: 1.35; white-space: normal; } .bp-hero__right { min-height: 360px; } .bp-hero-card--main { width: 82%; min-height: 250px; padding: 22px 18px 20px; transform: rotate(-4deg) translateY(0); } .bp-hero-card__title { font-size: 34px; } .bp-hero-mini { min-width: 128px; padding: 12px 13px; border-radius: 16px; } .bp-hero-mini__label { font-size: 9px; letter-spacing: 0.16em; } .bp-hero-mini__value { font-size: 20px; } .bp-hero-mini--gold { top: 78px; right: -2px; } .bp-hero-mini--dark { bottom: 12px; left: -2px; } .bp-ruby { --rubySize: 62px; --rubyRadius: 18px; } .bp-h1 { max-width: none; font-size: clamp(32px, 10vw, 48px); line-height: 1.02; word-break: break-word; } .bp-lead { font-size: 14px; } .bp-cta { gap: 8px; } .bp-cta .btn { flex: 1 1 calc(50% - 4px); min-width: 0; height: 42px; padding: 10px 12px; font-size: 12px; } .bp-h2 { font-size: 24px; } .bp-cats { gap: 6px; padding: 10px 10px; border-radius: 16px; } .bp-cat { padding: 7px 12px; font-size: 12px; } .bp-ruby-stage { min-height: 118px; margin: 20px 0 2px; } .bp-amethyst-sec { margin: 18px auto 0; padding: 0 10px; } .bp-amethyst-stage { min-height: 126px; } .bp-amethyst { --amethystSize: 60px; --amethystRadius: 18px; } .bp-jackpot-banner__prices { flex-direction: column; } .bp-dw__panel { width: 100vw !important; } .bp-plus-modal__card { width: min(560px, calc(100vw - 12px)); max-height: calc(100dvh - 12px); padding: 18px; } .bp-plus-modal__hero { grid-template-columns: 1fr; } .bp-plus-modal__hero img { width: 100%; height: 180px; } .bp-strip { padding: 18px 0; } .bp-strip-inner { color: rgba(245, 168, 0, 0.24); font-size: clamp(24px, 8vw, 46px); letter-spacing: 0.24em; } .bp-strip-inner span { margin-right: 2.4rem; } .bp-floating-cart { right: 14px; bottom: calc(14px + env(safe-area-inset-bottom, 0px)); width: 60px; height: 60px; } .bp-floating-cart__icon { font-size: 24px; } .bp-floating-cart__count { top: -2px; right: -1px; min-width: 22px; height: 22px; font-size: 11px; } .bp-modal__card, .bp-auth__card, .bp-otp__card, .bp-forgot__card { width: min(540px, calc(100vw - 16px)); max-height: calc(100dvh - 16px); padding: 18px; } .bp-auth__card, .bp-otp__card, .bp-forgot__card { left: 8px; right: 8px; width: auto; max-width: none; transform: translateY(-50%); } .bp-line { grid-template-columns: 56px minmax(0, 1fr) auto; } .bp-line img { width: 56px; height: 48px; } } @media (max-width: 480px) { .bp-hero { border-radius: 22px; } .bp-hero__in::after { border-radius: 21px; } .bp-hero__lux { padding: 14px; } .bp-hero__top { gap: 12px; } .bp-logo-text { font-size: 20px; letter-spacing: 1px; } .bp-logo-sub { font-size: 9px; letter-spacing: 2.2px; } .bp-hero-badge { padding: 10px 12px; font-size: 11px; letter-spacing: 0.06em; } .bp-pill { padding: 9px 14px; font-size: 11px; letter-spacing: 0.1em; } .bp-h1 { margin: 14px 0 12px; font-size: clamp(30px, 9.2vw, 42px); line-height: 1.03; } .bp-lead { font-size: 13px; line-height: 1.62; } .bp-hero-glass { padding: 15px 14px 14px; border-radius: 18px; } .bp-cta .btn { flex: 1 1 100%; } .bp-hero-card--main { width: 86%; } .bp-hero-mini { min-width: 118px; padding: 10px 11px; } .bp-hero-mini__value { font-size: 18px; } .bp-hero-mini--gold { top: 72px; right: 0; } .bp-hero-mini--dark { bottom: 10px; left: 0; } .bp-plus-actions, .bp-modal__btns, .bp-auth__actions, .bp-otp__actions, .bp-forgot__actions, .bp-rev-actions { flex-direction: column; align-items: stretch; } .bp-plus-actions .btn, .bp-modal__btns .btn, .bp-auth__actions .btn, .bp-otp__actions .btn, .bp-forgot__actions .btn, .bp-rev-actions .btn { width: 100%; } .bp-ft { padding: 0 10px 24px; } .bp-ft-inner { padding: 22px 16px 18px; } .bp-ft-bottom { padding: 12px 16px 14px; } } @media (max-width: 400px) { .bp-logo-text { font-size: 19px; letter-spacing: 1px; } .bp-ruby { --rubySize: 54px; --rubyRadius: 16px; } .bp-ruby__gem { width: 32px; height: 32px; } .bp-ruby-stage { min-height: 106px; } .bp-amethyst-stage { min-height: 112px; } .bp-amethyst { --amethystSize: 54px; --amethystRadius: 16px; } .bp-amethyst__gem { width: 32px; height: 32px; } .bp-grid.bp-grid--drinks { gap: 8px; } .bp-grid.bp-grid--drinks .bp-p h4 { font-size: 12px; } .bp-grid.bp-grid--drinks .bp-p p { font-size: 10px; } .bp-grid.bp-grid--drinks .bp-add2__eur { font-size: 14px; } .bp-strip { padding: 16px 0; } .bp-strip-inner { color: rgba(245, 168, 0, 0.22); font-size: clamp(22px, 8.4vw, 36px); letter-spacing: 0.18em; } .bp-strip-inner span { margin-right: 1.8rem; } .bp-floating-cart { right: 12px; bottom: calc(12px + env(safe-area-inset-bottom, 0px)); width: 56px; height: 56px; } .bp-floating-cart__icon { font-size: 22px; } .bp-line { grid-template-columns: 1fr; } .bp-qr { align-items: stretch; } .bp-qty { justify-content: flex-start; } .bp-sum { text-align: left; } } @media (prefers-reduced-motion: reduce) { .bp-strip-inner, .bp-heat-logo::after, .bp-hero-card__shine, .bp-ruby__spark, .bp-ruby-orbit, .bp-ruby-orbit2, .bp-amethyst__spark, .bp-amethyst-orbit, .bp-amethyst-orbit2, .bp-amethyst-particle, .bp-add2::after, .bp-plus-btn::before { animation: none !important; } .bp-p, .bp-add2, .bp-plus-btn, .bp-floating-cart, .bp-map-card, .bp-rev-card, .bp-ft-epill, .bp-hero-card, .bp-heat-logo { transition: none !important; } } html, body { margin: 0 !important; padding: 0 !important; background: #000 !important; } #bp-root { display: block; margin: 0 !important; margin-bottom: 0 !important; padding-bottom: 12px !important; background-color: #000 !important; } .bp-ft { margin-bottom: 0 !important; padding-bottom: 0 !important; } .bp-ft-shell { margin-bottom: 0 !important; } .elementor-widget-html, .elementor-widget-container { margin-bottom: 0 !important; padding-bottom: 0 !important; } /* 🟣 LANDMARK: FOOTER FINAL FIX */ .bp-ft-bottom-l{ display:flex !important; flex-wrap:wrap !important; align-items:center !important; gap:10px 18px !important; font-family:"Nunito",sans-serif !important; font-weight:700 !important; } .bp-ft-bottom-r{ display:flex !important; align-items:center !important; gap:10px !important; flex-wrap:wrap !important; } .bp-footer-policy-badge{ display:inline-flex !important; align-items:center !important; justify-content:center !important; gap:8px !important; padding:9px 14px !important; border-radius:999px !important; text-decoration:none !important; font-family:"Nunito",sans-serif !important; font-size:12px !important; font-weight:900 !important; letter-spacing:.03em !important; line-height:1 !important; color:#fff8e8 !important; background: linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.04)), linear-gradient(135deg, rgba(245,168,0,.22), rgba(255,211,106,.10) 52%, rgba(255,255,255,.03) 100%) !important; border:1px solid rgba(245,168,0,.34) !important; box-shadow: 0 10px 28px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.10) !important; transition:.18s ease !important; } .bp-footer-policy-badge:hover{ transform:translateY(-1px) !important; color:#ffffff !important; border-color:rgba(255,211,106,.58) !important; background: linear-gradient(180deg, rgba(255,255,255,.13), rgba(255,255,255,.05)), linear-gradient(135deg, rgba(245,168,0,.30), rgba(255,211,106,.16) 52%, rgba(255,255,255,.04) 100%) !important; box-shadow: 0 14px 30px rgba(0,0,0,.22), 0 0 18px rgba(245,168,0,.14), inset 0 1px 0 rgba(255,255,255,.12) !important; } .bp-footer-policy-badge__icon{ color:#f5a800 !important; font-size:11px !important; line-height:1 !important; text-shadow:0 0 12px rgba(245,168,0,.50) !important; } .bp-footer-policy-badge__text{ line-height:1 !important; } .bp-ft-epill.bp-ft-epill--lux{ display:inline-flex !important; align-items:center !important; justify-content:center !important; padding:10px 16px !important; border-radius:999px !important; text-decoration:none !important; font-family:"Nunito",sans-serif !important; font-size:12px !important; font-weight:900 !important; letter-spacing:.02em !important; text-transform:none !important; color:#fffdf8 !important; background: linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,.05)), linear-gradient(135deg, rgba(255,219,130,.18), rgba(215,221,230,.16) 48%, rgba(255,255,255,.05) 100%) !important; border:1px solid rgba(255,230,170,.26) !important; box-shadow: 0 12px 30px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.16) !important; transition:.18s ease !important; } .bp-ft-epill.bp-ft-epill--lux:hover{ transform:translateY(-1px) !important; color:#ffffff !important; border-color:rgba(255,226,150,.44) !important; background: linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.06)), linear-gradient(135deg, rgba(255,219,130,.24), rgba(224,230,238,.20) 48%, rgba(255,255,255,.06) 100%) !important; box-shadow: 0 16px 34px rgba(0,0,0,.22), 0 0 18px rgba(255,211,106,.10), inset 0 1px 0 rgba(255,255,255,.18) !important; } /* 🟣 LANDMARK: FLOATING CART — FIXED ALWAYS VISIBLE */ #bp-root .bp-floating-cart { position: fixed !important; right: 18px !important; bottom: calc(24px + env(safe-area-inset-bottom, 0px)) !important; z-index: 1000004 !important; width: 66px !important; height: 66px !important; opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; transform: none !important; } #bp-root .bp-floating-cart:hover { transform: translateY(-2px) scale(1.03) !important; } @media (max-width: 680px) { #bp-root .bp-floating-cart { right: 14px !important; bottom: calc(22px + env(safe-area-inset-bottom, 0px)) !important; width: 60px !important; height: 60px !important; } } @media (max-width: 400px) { #bp-root .bp-floating-cart { right: 12px !important; bottom: calc(20px + env(safe-area-inset-bottom, 0px)) !important; width: 56px !important; height: 56px !important; } } /* 🟣 LANDMARK — repeat reward card */ .bp-repeat-card{ margin:18px 0; border-radius:24px; overflow:hidden; border:1px solid rgba(255,255,255,.08); background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015)), radial-gradient(circle at top right, rgba(245,168,0,.14), transparent 32%); box-shadow:0 14px 40px rgba(0,0,0,.18); } .bp-repeat-card__in{ display:grid; grid-template-columns:220px 1fr; gap:0; } .bp-repeat-card__media{ min-height:220px; background:rgba(255,255,255,.02); border-right:1px solid rgba(255,255,255,.06); } .bp-repeat-card__media img{ width:100%; height:100%; object-fit:cover; display:block; } .bp-repeat-card__content{ padding:20px; } .bp-repeat-card__top{ display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-top:6px; } .bp-repeat-card__title{ font-weight:900; font-size:24px; line-height:1.1; } .bp-repeat-card__sub{ margin-top:8px; font-size:14px; line-height:1.5; opacity:.84; max-width:760px; } .bp-repeat-card__badge{ flex-shrink:0; padding:10px 14px; border-radius:999px; border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.04); font-weight:900; font-size:13px; line-height:1; } .bp-repeat-card__badge.is-mid{ background:rgba(245,168,0,.10); border-color:rgba(245,168,0,.24); } .bp-repeat-card__badge.is-ready{ background:rgba(80,180,120,.12); border-color:rgba(80,180,120,.28); } .bp-repeat-card__badge.is-done{ background:rgba(120,160,255,.12); border-color:rgba(120,160,255,.26); } .bp-repeat-progress{ margin-top:18px; } .bp-repeat-progress__track{ width:100%; height:14px; border-radius:999px; overflow:hidden; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.07); } .bp-repeat-progress__fill{ height:100%; border-radius:999px; background:linear-gradient(90deg, #f5a800 0%, #ffcf4a 100%); box-shadow:0 0 18px rgba(245,168,0,.32); } .bp-repeat-progress__labels{ display:flex; justify-content:space-between; gap:12px; margin-top:8px; font-size:12px; opacity:.84; } .bp-repeat-card__meta{ display:flex; flex-wrap:wrap; gap:10px; margin-top:16px; } .bp-repeat-chip{ padding:8px 12px; border-radius:999px; border:1px solid rgba(255,255,255,.08); background:rgba(255,255,255,.03); font-size:12px; font-weight:800; opacity:.72; } .bp-repeat-chip.is-on{ background:rgba(245,168,0,.12); border-color:rgba(245,168,0,.28); opacity:1; } .bp-repeat-card__note{ margin-top:14px; font-size:12px; line-height:1.55; opacity:.78; } @media (max-width: 900px){ .bp-repeat-card__in{ grid-template-columns:1fr; } .bp-repeat-card__media{ min-height:180px; border-right:none; border-bottom:1px solid rgba(255,255,255,.06); } .bp-repeat-card__top{ flex-direction:column; align-items:flex-start; } .bp-repeat-card__title{ font-size:21px; } } /* ========================================================================== 24) SCHEDULED ORDER MODAL ========================================================================== */ /* ========================================================================== 24) SCHEDULED ORDER MODAL — iPhone Safari tap fix ========================================================================== */ .bp-scheduled { position: fixed; inset: 0; z-index: 1000000; display: none; } .bp-scheduled.is-open { display: block; } .bp-scheduled__ov { position: absolute; inset: 0; backdrop-filter: blur(10px); background: rgba(0, 0, 0, 0.76); } .bp-scheduled__card { position: absolute; top: 50%; left: 50%; width: min(560px, 92vw); max-width: calc(100vw - 20px); max-height: calc(100dvh - 20px); padding: 24px 24px calc(24px + env(safe-area-inset-bottom, 0px)); overflow: auto; -webkit-overflow-scrolling: touch; transform: translate(-50%, -50%); border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 24px; box-shadow: var(--shadow-soft), 0 0 0 1px rgba(245, 168, 0, 0.06); background: linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.015)), linear-gradient(145deg, #171718, #111112 62%, #191515); } .bp-scheduled__top { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; } .bp-scheduled__top b { color: var(--bro-orange); font-family: "Oswald", sans-serif; font-size: 20px; font-weight: 800; letter-spacing: 0.5px; text-transform: uppercase; } .bp-scheduled__x { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; color: var(--bro-orange); font-size: 18px; border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 12px; background: rgba(255, 255, 255, 0.04); cursor: pointer; } .bp-scheduled__form { display: grid; gap: 12px; margin-top: 14px; } .bp-scheduled__hint { color: rgba(255, 255, 255, 0.6); font-family: "Nunito", sans-serif; font-size: 13px; font-weight: 700; line-height: 1.45; } .bp-scheduled__actions { position: static !important; z-index: 5 !important; display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 10px !important; margin-top: 16px !important; margin-left: 0 !important; margin-right: 0 !important; margin-bottom: 0 !important; padding: 0 !important; background: transparent !important; border-top: 0 !important; backdrop-filter: none !important; } .bp-scheduled__actions .btn, .bp-scheduled__actions button { position: relative; z-index: 6; pointer-events: auto; touch-action: manipulation; } .bp-scheduled__err { display: none; margin-top: 10px; padding: 10px 12px; color: rgba(255, 210, 210, 0.98); font-family: "Nunito", sans-serif; font-weight: 700; border: 1px solid rgba(204, 27, 27, 0.3); border-radius: 12px; background: rgba(204, 27, 27, 0.14); } .bp-scheduled__err.is-on { display: block; } @media (max-width: 680px) { .bp-scheduled__card { width: min(560px, calc(100vw - 16px)); max-height: calc(100svh - 16px); padding: 18px; padding-bottom: calc(18px + env(safe-area-inset-bottom, 0px)); } .bp-scheduled__actions { display: grid !important; grid-template-columns: 1fr !important; gap: 10px !important; margin: 16px 0 0 0 !important; padding: 0 !important; } .bp-scheduled__actions .btn, .bp-scheduled__actions button { width: 100% !important; min-height: 48px !important; } } @media (max-width: 480px) { .bp-scheduled__actions { flex-direction: column; align-items: stretch; } .bp-scheduled__actions .btn { width: 100%; min-height: 48px; } } /* 🟣 LANDMARK: FAVORITE PIZZA — 2 SMART BUTTONS */ .bp-fav-split{ width:100%; padding:0; border:none; border-radius:18px; overflow:hidden; cursor:default; text-align:left; background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.015)), linear-gradient(135deg, rgba(24,140,74,.92), rgba(41,184,102,.90) 55%, rgba(108,221,148,.88) 100%); box-shadow: 0 16px 34px rgba(0,0,0,.28), inset 0 0 0 1px rgba(255,255,255,.08); } .bp-fav-split--family{ background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.015)), linear-gradient(135deg, rgba(145,118,0,.94), rgba(214,143,0,.92) 55%, rgba(255,195,67,.90) 100%); } .bp-fav-split.is-disabled{ opacity:.58; filter:grayscale(.08); pointer-events:none; } .bp-fav-split__head{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 16px 10px; } .bp-fav-split__title{ color:#fff; font-family:"Oswald",sans-serif; font-size:18px; font-weight:800; line-height:1; letter-spacing:.04em; text-transform:uppercase; } .bp-fav-split__price{ color:#fffef6; font-family:"Oswald",sans-serif; font-size:18px; font-weight:800; line-height:1; white-space:nowrap; } .bp-fav-split__body{ display:grid; grid-template-columns:1fr 1fr; border-top:1px solid rgba(255,255,255,.10); } .bp-fav-split__zone{ min-width:0; padding:13px 14px 14px; cursor:pointer; transition:background .16s ease, transform .16s ease; } .bp-fav-split__zone:hover{ background:rgba(255,255,255,.08); } .bp-fav-split__zone:active{ transform:scale(.995); } .bp-fav-split__zone + .bp-fav-split__zone{ border-left:1px solid rgba(255,255,255,.10); } .bp-fav-split__label{ color:#ffffff; font-family:"Oswald",sans-serif; font-size:14px; font-weight:800; line-height:1; letter-spacing:.05em; text-transform:uppercase; } .bp-fav-split__sub{ margin-top:6px; color:rgba(255,255,255,.88); font-family:"Nunito",sans-serif; font-size:11px; font-weight:800; line-height:1.3; } @media (max-width: 680px){ .bp-fav-split__title{ font-size:16px; } .bp-fav-split__price{ font-size:16px; } .bp-fav-split__label{ font-size:13px; } .bp-fav-split__sub{ font-size:10px; } } /* 🟣 LANDMARK: FAVORITE PIZZA — DESKTOP LIKE MOBILE */ .bp-fav-split, .bp-fav-split:visited, .bp-fav-split:hover, .bp-fav-split:active{ width:100% !important; display:block !important; padding:0 !important; overflow:hidden !important; border:1px solid rgba(245,168,0,.16) !important; border-radius:18px !important; background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02)), linear-gradient(145deg, #171718, #111112 60%, #191616) !important; box-shadow:0 16px 36px rgba(0,0,0,.28) !important; color:#fff !important; text-align:left !important; appearance:none !important; -webkit-appearance:none !important; } .bp-fav-split.is-disabled{ opacity:.58 !important; cursor:not-allowed !important; } .bp-fav-split--family{ border-color:rgba(255,190,80,.20) !important; background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02)), linear-gradient(145deg, #1a1711, #131110 60%, #1c1712) !important; } .bp-fav-split__head{ display:flex !important; align-items:center !important; justify-content:space-between !important; gap:12px !important; padding:12px 16px !important; border-bottom:1px solid rgba(255,255,255,.06) !important; background:rgba(255,255,255,.03) !important; } .bp-fav-split__title{ color:#fff !important; font-family:"Oswald",sans-serif !important; font-size:22px !important; font-weight:800 !important; line-height:1 !important; letter-spacing:.02em !important; text-transform:uppercase !important; } .bp-fav-split__price{ flex:0 0 auto !important; color:var(--bro-orange2) !important; font-family:"Oswald",sans-serif !important; font-size:24px !important; font-weight:800 !important; line-height:1 !important; white-space:nowrap !important; } .bp-fav-split__body{ display:grid !important; grid-template-columns:1fr 1fr !important; gap:0 !important; width:100% !important; } .bp-fav-split__zone{ min-width:0 !important; display:flex !important; align-items:center !important; justify-content:space-between !important; gap:12px !important; padding:14px 16px !important; min-height:116px !important; transition:filter .18s ease, transform .18s ease !important; } .bp-fav-split__zone + .bp-fav-split__zone{ border-left:1px solid rgba(255,255,255,.08) !important; } .bp-fav-split__zone--left{ background:linear-gradient(135deg, rgba(22,150,78,.96), rgba(44,177,100,.90)) !important; } .bp-fav-split__zone--right{ background:linear-gradient(135deg, rgba(185,125,0,.96), rgba(245,168,0,.90)) !important; } .bp-fav-split__zone:hover{ filter:brightness(1.04) !important; } .bp-fav-split__zone > div:first-child{ min-width:0 !important; flex:1 1 auto !important; } .bp-fav-split__label{ color:#fff !important; font-family:"Oswald",sans-serif !important; font-size:18px !important; font-weight:800 !important; line-height:1 !important; letter-spacing:.02em !important; text-transform:uppercase !important; } .bp-fav-split__sub{ margin-top:6px !important; color:rgba(255,255,255,.94) !important; font-family:"Nunito",sans-serif !important; font-size:13px !important; font-weight:800 !important; line-height:1.34 !important; } .bp-fav-split .bp-plus-btn__plus, .bp-fav-split .bp-plus-btn__combo, .bp-fav-split__zone::after{ flex:0 0 auto !important; display:flex !important; align-items:center !important; justify-content:center !important; width:42px !important; height:42px !important; border-radius:999px !important; border:1px solid rgba(255,255,255,.18) !important; background:rgba(255,255,255,.14) !important; color:#fff !important; font-family:"Oswald",sans-serif !important; font-size:22px !important; font-weight:800 !important; line-height:1 !important; box-shadow:0 8px 20px rgba(0,0,0,.18) !important; } .bp-fav-split__zone--left::after{ content:"+" !important; } .bp-fav-split__zone--right::after{ content:"◐" !important; } @media (min-width: 1025px){ .bp-fav-split{ max-width:100% !important; } .bp-fav-split__title{ font-size:20px !important; } .bp-fav-split__price{ font-size:22px !important; } .bp-fav-split__zone{ min-height:104px !important; padding:12px 14px !important; } .bp-fav-split__label{ font-size:16px !important; } .bp-fav-split__sub{ font-size:12px !important; line-height:1.28 !important; } } @media (max-width: 680px){ .bp-fav-split__title{ font-size:18px !important; } .bp-fav-split__price{ font-size:20px !important; } .bp-fav-split__zone{ min-height:92px !important; padding:12px !important; } .bp-fav-split__label{ font-size:15px !important; } .bp-fav-split__sub{ font-size:11px !important; line-height:1.22 !important; } } /* 🟣 LANDMARK: FAVORITE PIZZA — SMALLER VERSION */ .bp-fav-split{ border-radius:16px !important; } .bp-fav-split__head{ padding:10px 12px !important; } .bp-fav-split__title{ font-size:16px !important; } .bp-fav-split__price{ font-size:18px !important; } .bp-fav-split__zone{ min-height:64px !important; padding:10px 12px !important; gap:10px !important; } .bp-fav-split__label{ font-size:14px !important; } .bp-fav-split__sub{ margin-top:4px !important; font-size:11px !important; line-height:1.18 !important; max-width:26ch !important; } .bp-fav-split__zone::after{ width:32px !important; height:32px !important; font-size:16px !important; } .bp-fav-split__zone--right::after{ font-size:15px !important; } @media (min-width: 1025px){ .bp-fav-split__title{ font-size:15px !important; } .bp-fav-split__price{ font-size:17px !important; } .bp-fav-split__zone{ min-height:58px !important; padding:9px 11px !important; } .bp-fav-split__label{ font-size:13px !important; } .bp-fav-split__sub{ font-size:10px !important; line-height:1.14 !important; } .bp-fav-split__zone::after{ width:28px !important; height:28px !important; font-size:14px !important; } } /* 🟣 LANDMARK: SCHEDULED BUTTON ACTIVE STATE — BIGGER DATE / TIME */ #bp-open-scheduled-order{ min-height: 52px !important; padding: 12px 18px !important; line-height: 1.15 !important; } #bp-open-scheduled-order.is-active{ min-height: 64px !important; padding: 14px 20px !important; border-radius: 18px !important; color: #fff8e8 !important; background: linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,.04)), linear-gradient(135deg, rgba(185,125,0,.96), rgba(245,168,0,.92) 55%, rgba(255,210,110,.92) 100%) !important; box-shadow: 0 16px 34px rgba(0,0,0,.26), 0 10px 26px rgba(245,168,0,.24), inset 0 1px 0 rgba(255,255,255,.18) !important; } #bp-open-scheduled-order.is-active:hover{ transform: translateY(-1px) !important; filter: brightness(1.03) !important; } #bp-open-scheduled-order.is-active{ font-family: "Oswald", sans-serif !important; font-size: 18px !important; font-weight: 800 !important; letter-spacing: .02em !important; text-transform: none !important; } @media (min-width: 1025px){ #bp-open-scheduled-order.is-active{ min-width: 300px !important; min-height: 72px !important; padding: 16px 22px !important; font-size: 22px !important; border-radius: 20px !important; } } @media (max-width: 680px){ #bp-open-scheduled-order{ width: 100% !important; } #bp-open-scheduled-order.is-active{ min-height: 60px !important; padding: 12px 16px !important; font-size: 16px !important; line-height: 1.2 !important; } } /* 🟣 LANDMARK: IOS SAFARI CART / BUTTON WIDTH FIX */ html, body { overflow-x: hidden !important; } .bp-wrap, .bp-dw__panel, .bp-dw__b, .bp-dw__f, .bp-line, .bp-line > div, .bp-note, .bp-note textarea, .bp-t, .bp-jackpot-banner, .bp-jackpot-banner__prices, .bp-jackpot-banner__box { min-width: 0 !important; max-width: 100% !important; } .bp-dw__panel { width: 100vw !important; max-width: 100vw !important; right: 0 !important; left: auto !important; top: 0 !important; bottom: 0 !important; height: 100vh !important; height: 100dvh !important; max-height: 100dvh !important; padding-right: env(safe-area-inset-right) !important; } .bp-dw__b { overflow-x: hidden !important; padding-left: 14px !important; padding-right: 14px !important; } .bp-dw__f { padding-left: 14px !important; padding-right: calc(14px + env(safe-area-inset-right)) !important; padding-bottom: calc(16px + env(safe-area-inset-bottom)) !important; } .bp-line { grid-template-columns: 56px minmax(0, 1fr) auto !important; } .bp-ln, .bp-lu, .bp-line__mods, .bp-line__mods span { min-width: 0 !important; overflow-wrap: anywhere !important; word-break: break-word !important; } .bp-check, #bp-root .btn, #bp-root .bp-check { min-width: 0 !important; max-width: 100% !important; } @media (max-width: 680px) { .bp-dw__panel { width: 100vw !important; max-width: 100vw !important; } .bp-dw__f { position: sticky !important; bottom: 0 !important; } .bp-dw__f .bp-check, .bp-dw__f .btn, .bp-note textarea { width: 100% !important; max-width: 100% !important; } .bp-t { align-items: flex-start !important; min-width: 0 !important; } .bp-t > * { min-width: 0 !important; } } /* 🟣 LANDMARK: IOS SAFARI SCHEDULED MODAL TAP LAYER FIX */ .bp-scheduled{ position: fixed !important; inset: 0 !important; z-index: 1000003 !important; } .bp-scheduled__ov{ position: absolute !important; inset: 0 !important; z-index: 1 !important; pointer-events: auto !important; } .bp-scheduled__card{ position: absolute !important; z-index: 2 !important; pointer-events: auto !important; } .bp-scheduled__form, .bp-scheduled__actions{ position: relative !important; z-index: 3 !important; pointer-events: auto !important; } .bp-scheduled__actions .btn, .bp-scheduled__actions button, #bp-scheduled-confirm, #bp-scheduled-cancel{ position: relative !important; z-index: 4 !important; pointer-events: auto !important; touch-action: manipulation !important; appearance: none !important; -webkit-appearance: none !important; } /* 🟣 LANDMARK: IOS SAFARI SCHEDULED MODAL FINAL HEIGHT FIX */ .bp-scheduled__card{ top: 50% !important; left: 50% !important; transform: translate(-50%, -50%) !important; width: min(560px, 92vw) !important; max-width: calc(100vw - 16px) !important; max-height: calc(100svh - 24px) !important; overflow-y: auto !important; overflow-x: hidden !important; padding-bottom: calc(18px + env(safe-area-inset-bottom, 0px)) !important; -webkit-overflow-scrolling: touch !important; } .bp-scheduled__form{ padding-bottom: 6px !important; } .bp-scheduled__actions .btn, .bp-scheduled__actions button{ width: 100% !important; min-width: 0 !important; } @media (max-width: 680px){ .bp-scheduled__card{ width: calc(100vw - 12px) !important; max-width: calc(100vw - 12px) !important; max-height: calc(100svh - 12px) !important; padding: 16px !important; padding-bottom: calc(16px + env(safe-area-inset-bottom, 0px)) !important; } .bp-scheduled__actions{ grid-template-columns: 1fr !important; } }/* 🟣 LANDMARK: REAL SCHEDULED MODAL FIX — MATCHES ACTUAL HTML */ #bp-scheduled{ position: fixed !important; inset: 0 !important; z-index: 1000003 !important; } #bp-scheduled .bp-modal__ov{ position: absolute !important; inset: 0 !important; z-index: 1 !important; pointer-events: auto !important; } #bp-scheduled .bp-modal__card{ position: absolute !important; top: 50% !important; left: 50% !important; transform: translate(-50%, -50%) !important; z-index: 2 !important; pointer-events: auto !important; width: min(560px, 92vw) !important; max-width: calc(100vw - 16px) !important; max-height: calc(100svh - 24px) !important; overflow-y: auto !important; overflow-x: hidden !important; -webkit-overflow-scrolling: touch !important; } #bp-scheduled .bp-auth__form, #bp-scheduled .bp-auth__actions, #bp-scheduled .bp-auth__actions .btn, #bp-scheduled .bp-auth__actions button, #bp-scheduled #bp-scheduled-confirm, #bp-scheduled #bp-scheduled-cancel, #bp-scheduled #bp-scheduled-x, #bp-scheduled input, #bp-scheduled select, #bp-scheduled button{ pointer-events: auto !important; position: relative !important; } #bp-scheduled .bp-auth__actions{ z-index: 20 !important; display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 10px !important; } #bp-scheduled .bp-auth__actions .btn, #bp-scheduled .bp-auth__actions button{ z-index: 21 !important; width: 100% !important; min-height: 48px !important; touch-action: manipulation !important; appearance: none !important; -webkit-appearance: none !important; } @media (max-width: 680px){ #bp-scheduled .bp-modal__card{ width: calc(100vw - 12px) !important; max-width: calc(100vw - 12px) !important; max-height: calc(100svh - 12px) !important; } #bp-scheduled .bp-auth__actions{ grid-template-columns: 1fr !important; } } /* 🟣 LANDMARK: ORDER SUCCESS MODAL BUTTONS POSITION FIX */ #bp-modal .bp-modal__card{ position: absolute !important; } #bp-modal .bp-modal__btns{ position: static !important; display: flex !important; flex-wrap: wrap !important; justify-content: flex-end !important; gap: 10px !important; margin-top: 16px !important; } #bp-modal .bp-modal__btns .btn, #bp-modal .bp-modal__btns a{ position: static !important; } @media (max-width: 480px){ #bp-modal .bp-modal__btns{ flex-direction: column !important; align-items: stretch !important; } #bp-modal .bp-modal__btns .btn, #bp-modal .bp-modal__btns a{ width: 100% !important; } } /* 🟣 LANDMARK: QUICK OFFER SELECT TEXT VERTICAL FIX */ #bp-quick-offer-modal select[data-qo-whole-select], #bp-quick-offer-modal select[data-qo-combo-a], #bp-quick-offer-modal select[data-qo-combo-b]{ min-height: 54px !important; height: 54px !important; padding: 14px 44px 14px 14px !important; line-height: 1.25 !important; font-size: 15px !important; font-weight: 800 !important; display: block !important; box-sizing: border-box !important; } #bp-quick-offer-modal select[data-qo-whole-select] option, #bp-quick-offer-modal select[data-qo-combo-a] option, #bp-quick-offer-modal select[data-qo-combo-b] option{ font-size: 15px !important; } /* 🟣 SAFARI SAFE AREA FIX — QUICK OFFER ACTIONS */ #bp-quick-offer-modal .bp-plus-modal__card{ max-height: min(92vh, calc(100dvh - 16px)) !important; display: flex !important; flex-direction: column !important; } #bp-quick-offer-modal .bp-plus-modal__body{ overflow: auto !important; -webkit-overflow-scrolling: touch !important; padding-bottom: calc(20px + env(safe-area-inset-bottom, 0px)) !important; } #bp-quick-offer-modal .bp-plus-actions{ position: sticky !important; bottom: 0 !important; z-index: 60 !important; background: linear-gradient(180deg, rgba(10,10,10,.10), rgba(10,10,10,.92)) !important; backdrop-filter: blur(10px) !important; -webkit-backdrop-filter: blur(10px) !important; padding: 12px 0 calc(12px + env(safe-area-inset-bottom, 0px)) 0 !important; margin-top: 12px !important; } #bp-quick-offer-confirm, #bp-quick-offer-cancel{ min-height: 56px !important; } #bp-quick-offer-modal{ padding-bottom: env(safe-area-inset-bottom, 0px) !important; } .bp-p img { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; object-position: center; } .bp-img-burger-full { object-fit: contain !important; object-position: center !important; background: #0f0f10; } /* 🟣 LANDMARK: AMICI FINAL WIDTH FIX — NO DEBUG / NO 100VW BREAKOUT */ html, body { width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; overflow-x: hidden !important; background: #000 !important; } body.elementor-page, .elementor, .elementor-section, .elementor-container, .elementor-column, .elementor-element, .elementor-widget, .elementor-widget-container, .elementor-widget-html { max-width: 100% !important; min-width: 0 !important; overflow-x: hidden !important; } #amici-menu-mount { display: block !important; position: relative !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; overflow-x: hidden !important; background: #000 !important; } #bp-root { display: block !important; position: relative !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 !important; padding-bottom: 12px !important; overflow-x: hidden !important; background: #000 !important; } #bp-root .bp-wrap { width: 100% !important; max-width: var(--max) !important; min-width: 0 !important; margin-left: auto !important; margin-right: auto !important; padding-left: clamp(10px, 3vw, 18px) !important; padding-right: clamp(10px, 3vw, 18px) !important; overflow-x: hidden !important; } #bp-root *, #bp-root *::before, #bp-root *::after { box-sizing: border-box !important; } #bp-root .bp-hero, #bp-root .bp-hero__in, #bp-root .bp-hero__lux, #bp-root .bp-hero__left, #bp-root .bp-hero__right, #bp-root .bp-grid, #bp-root .bp-p, #bp-root .bp-section { max-width: 100% !important; min-width: 0 !important; } @media (max-width: 680px) { #bp-root .bp-wrap { padding-left: 8px !important; padding-right: 8px !important; } #bp-root .bp-hero__lux { grid-template-columns: minmax(0, 1fr) !important; padding: 14px !important; } #bp-root .bp-grid { grid-template-columns: minmax(0, 1fr) !important; } #bp-root .bp-h1, #bp-root .bp-lead, #bp-root .bp-p h4, #bp-root .bp-p p { max-width: 100% !important; overflow-wrap: anywhere !important; } } /* ========================================================================== 🟣 LANDMARK: AUTH MODAL — MOBILE CENTER + SCROLL FIX Purpose: - Фиксира модала "Вход / Регистрация" на мобилна версия. - Модалът се появява видимо в екрана. - Позволява скрол вътре в модала, ако съдържанието е високо. - Не пипа HTML, ID-та, JS hooks или unrelated UI. ========================================================================== */ @media (max-width: 680px) { #bp-auth { position: fixed !important; inset: 0 !important; z-index: 1000005 !important; overflow: hidden !important; } #bp-auth.is-open { display: block !important; } #bp-auth .bp-auth__ov { position: absolute !important; inset: 0 !important; z-index: 1 !important; pointer-events: auto !important; } #bp-auth .bp-auth__card { position: absolute !important; z-index: 2 !important; top: 50% !important; left: 50% !important; right: auto !important; width: calc(100vw - 16px) !important; max-width: 540px !important; max-height: calc(100svh - 16px) !important; transform: translate(-50%, -50%) !important; overflow-y: auto !important; overflow-x: hidden !important; -webkit-overflow-scrolling: touch !important; padding: 18px !important; padding-bottom: calc(18px + env(safe-area-inset-bottom, 0px)) !important; pointer-events: auto !important; } #bp-auth .bp-auth__form, #bp-auth .bp-auth__tabs, #bp-auth input, #bp-auth button { position: relative !important; pointer-events: auto !important; } #bp-auth .bp-auth__actions { display: grid !important; grid-template-columns: 1fr !important; gap: 10px !important; } #bp-auth .bp-auth__actions .btn, #bp-auth #bp-auth-submit { width: 100% !important; min-height: 48px !important; touch-action: manipulation !important; } } @media (max-width: 400px) { #bp-auth .bp-auth__card { width: calc(100vw - 12px) !important; max-height: calc(100svh - 12px) !important; padding: 16px !important; padding-bottom: calc(16px + env(safe-area-inset-bottom, 0px)) !important; } } /* ========================================================================== 🟣 LANDMARK: FLOATING CART — FIXED + SUN PALETTE VARIABLES Вграждане: постави най-долу в MenuAmici.css. Засяга само плаващата количка. ========================================================================== */ #bp-root .bp-floating-cart, body #bp-root .bp-floating-cart, html body #bp-root .bp-floating-cart { position: fixed !important; right: 18px !important; bottom: calc(74px + env(safe-area-inset-bottom, 0px)) !important; z-index: 10000040 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 66px !important; height: 66px !important; min-width: 66px !important; min-height: 66px !important; max-width: 66px !important; max-height: 66px !important; opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; transform: none !important; color: var(--bp-cart-icon-color, #1a0e00) !important; border: 1px solid var(--bp-cart-border, rgba(245, 168, 0, 0.24)) !important; border-radius: 999px !important; background: linear-gradient( 135deg, var(--bp-cart-grad-a, #b97800) 0%, var(--bp-cart-grad-b, #f5a800) 42%, var(--bp-cart-grad-c, #ffe093) 100% ) !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.28), 0 18px 40px rgba(0, 0, 0, 0.44), 0 12px 28px rgba(var(--bp-cart-glow-rgb, 245, 168, 0), 0.24), 0 0 0 1px var(--bp-cart-border, rgba(245, 168, 0, 0.24)) !important; transition: box-shadow 0.25s ease, filter 0.25s ease, background 0.35s ease, border-color 0.35s ease, color 0.35s ease !important; } #bp-root .bp-floating-cart:hover, body #bp-root .bp-floating-cart:hover, html body #bp-root .bp-floating-cart:hover { transform: translateY(-2px) scale(1.03) !important; filter: brightness(1.04) !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.30), 0 24px 50px rgba(0, 0, 0, 0.52), 0 14px 34px rgba(var(--bp-cart-glow-rgb, 245, 168, 0), 0.32), 0 0 0 1px var(--bp-cart-border, rgba(245, 168, 0, 0.30)) !important; } #bp-root .bp-floating-cart:active, body #bp-root .bp-floating-cart:active, html body #bp-root .bp-floating-cart:active { transform: translateY(0) scale(0.99) !important; } #bp-root .bp-floating-cart::before { content: "" !important; position: absolute !important; inset: 0 !important; pointer-events: none !important; border-radius: inherit !important; background: radial-gradient( 52px 52px at 30% 28%, var(--bp-cart-shine, rgba(255, 255, 255, 0.28)), transparent 62% ), linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0)) !important; } #bp-root .bp-floating-cart::after { content: "" !important; position: absolute !important; inset: -8px !important; z-index: -1 !important; pointer-events: none !important; opacity: 0.55 !important; filter: blur(12px) !important; border-radius: inherit !important; background: radial-gradient( circle, rgba(var(--bp-cart-glow-rgb, 245, 168, 0), 0.20) 0%, rgba(var(--bp-cart-glow-rgb, 245, 168, 0), 0.10) 38%, transparent 72% ) !important; } #bp-root .bp-floating-cart__icon { position: relative !important; z-index: 2 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 34px !important; height: 34px !important; color: var(--bp-cart-icon-color, #1a0e00) !important; transform: translateY(1px) !important; } #bp-root .bp-floating-cart__icon svg { display: block !important; width: 34px !important; height: 34px !important; color: currentColor !important; } #bp-root .bp-floating-cart__count { position: absolute !important; top: -3px !important; right: -2px !important; z-index: 3 !important; align-items: center !important; justify-content: center !important; min-width: 24px !important; height: 24px !important; padding: 0 7px !important; color: var(--bp-cart-badge-color, #111111) !important; font-family: "Oswald", "Nunito", system-ui, sans-serif !important; font-size: 12px !important; font-weight: 800 !important; line-height: 1 !important; border-radius: 999px !important; background: linear-gradient( 135deg, var(--bp-cart-badge-a, #fff6d6), var(--bp-cart-badge-b, #ffffff) ) !important; box-shadow: 0 10px 24px rgba(0, 0, 0, 0.28), 0 0 0 4px rgba(255, 255, 255, 0.08) !important; } /* ========================================================================== 🟣 LANDMARK: FLOATING CART — MOBILE POSITION Един неин размер над дъното. ========================================================================== */ @media (max-width: 680px) { #bp-root .bp-floating-cart, body #bp-root .bp-floating-cart, html body #bp-root .bp-floating-cart { right: 14px !important; bottom: calc(72px + env(safe-area-inset-bottom, 0px)) !important; width: 60px !important; height: 60px !important; min-width: 60px !important; min-height: 60px !important; max-width: 60px !important; max-height: 60px !important; } #bp-root .bp-floating-cart__icon, #bp-root .bp-floating-cart__icon svg { width: 32px !important; height: 32px !important; } #bp-root .bp-floating-cart__count { top: -2px !important; right: -1px !important; min-width: 22px !important; height: 22px !important; font-size: 11px !important; } } @media (max-width: 400px) { #bp-root .bp-floating-cart, body #bp-root .bp-floating-cart, html body #bp-root .bp-floating-cart { right: 12px !important; bottom: calc(70px + env(safe-area-inset-bottom, 0px)) !important; width: 56px !important; height: 56px !important; min-width: 56px !important; min-height: 56px !important; max-width: 56px !important; max-height: 56px !important; } #bp-root .bp-floating-cart__icon, #bp-root .bp-floating-cart__icon svg { width: 30px !important; height: 30px !important; } } /* 🟣 LANDMARK: CART DRAWER — REAL FIXED FULLSCREEN VIEWPORT */ #bp-dw { position: fixed !important; inset: 0 !important; z-index: 2147482500 !important; width: 100vw !important; height: 100vh !important; height: 100dvh !important; max-width: 100vw !important; max-height: 100dvh !important; overflow: hidden !important; } #bp-dw.is-open { pointer-events: auto !important; visibility: visible !important; opacity: 1 !important; } #bp-dw .bp-dw__ov { position: fixed !important; inset: 0 !important; z-index: 1 !important; } #bp-dw .bp-dw__panel { position: fixed !important; top: 0 !important; right: 0 !important; bottom: auto !important; left: auto !important; z-index: 2 !important; width: min(430px, 100vw) !important; max-width: 100vw !important; height: 100vh !important; height: 100dvh !important; max-height: 100dvh !important; display: flex !important; flex-direction: column !important; transform: translateX(110%) !important; overflow: hidden !important; } #bp-dw.is-open .bp-dw__panel { transform: translateX(0) !important; } #bp-dw .bp-dw__h { flex: 0 0 auto !important; } #bp-dw .bp-dw__b { flex: 1 1 auto !important; min-height: 0 !important; overflow-y: auto !important; overflow-x: hidden !important; -webkit-overflow-scrolling: touch !important; } #bp-dw .bp-dw__f { flex: 0 0 auto !important; position: relative !important; bottom: auto !important; z-index: 3 !important; } @media (max-width: 680px) { #bp-dw .bp-dw__panel { left: 0 !important; right: 0 !important; width: 100vw !important; max-width: 100vw !important; } } /* 🟣 LANDMARK: AMICI FLOATING CART — SUNSET ITALY STYLE RESTORE */ .bp-floating-cart.amici-floating-cart-hoisted, #bp-floating-cart.amici-floating-cart-hoisted { color: var(--bp-cart-icon-color, #F5EAD8) !important; border: 1px solid var(--bp-cart-border, rgba(192, 72, 48, 0.36)) !important; background: linear-gradient( 135deg, var(--bp-cart-grad-a, #8A2E18) 0%, var(--bp-cart-grad-b, #C04830) 46%, var(--bp-cart-grad-c, #D06858) 100% ) !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.18), 0 18px 40px rgba(10, 0, 5, 0.48), 0 12px 28px rgba(var(--bp-cart-glow-rgb, 192, 72, 48), 0.30), 0 0 0 1px var(--bp-cart-border, rgba(192, 72, 48, 0.36)) !important; } .bp-floating-cart.amici-floating-cart-hoisted:hover, #bp-floating-cart.amici-floating-cart-hoisted:hover { filter: brightness(1.05) !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.22), 0 24px 50px rgba(10, 0, 5, 0.58), 0 14px 34px rgba(var(--bp-cart-glow-rgb, 192, 72, 48), 0.40), 0 0 0 1px var(--bp-cart-border, rgba(192, 72, 48, 0.42)) !important; } .bp-floating-cart.amici-floating-cart-hoisted::before, #bp-floating-cart.amici-floating-cart-hoisted::before { background: radial-gradient( 52px 52px at 30% 28%, var(--bp-cart-shine, rgba(255, 230, 200, 0.28)), transparent 62% ), linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0)) !important; } .bp-floating-cart.amici-floating-cart-hoisted::after, #bp-floating-cart.amici-floating-cart-hoisted::after { background: radial-gradient( circle, rgba(var(--bp-cart-glow-rgb, 192, 72, 48), 0.25) 0%, rgba(var(--bp-cart-glow-rgb, 192, 72, 48), 0.12) 38%, transparent 72% ) !important; } .bp-floating-cart.amici-floating-cart-hoisted .bp-floating-cart__icon, #bp-floating-cart.amici-floating-cart-hoisted .bp-floating-cart__icon { color: var(--bp-cart-icon-color, #F5EAD8) !important; } .bp-floating-cart.amici-floating-cart-hoisted .bp-floating-cart__count, #bp-floating-cart.amici-floating-cart-hoisted .bp-floating-cart__count { color: var(--bp-cart-badge-color, #180B13) !important; background: linear-gradient( 135deg, var(--bp-cart-badge-a, #F5EAD8), var(--bp-cart-badge-b, #FFFFFF) ) !important; box-shadow: 0 10px 24px rgba(0, 0, 0, 0.28), 0 0 0 4px rgba(245, 234, 216, 0.10) !important; } /* ========================================================================== 🟣 LANDMARK: AMICI CART DRAWER — ITALIAN SUNSET WINE STYLE Purpose: - Променя само модала/панела на количката. - Amici стил: италиански залез, вино, теракота, крем, топъл glow. - Не пипа логика, JS, поръчки, Supabase или cart state. ========================================================================== */ #bp-dw .bp-dw__panel, #bp-dw.amici-cart-drawer-viewport .bp-dw__panel { border-left: 1px solid rgba(192, 72, 48, 0.26) !important; box-shadow: -24px 0 70px rgba(10, 0, 5, 0.72), -10px 0 34px rgba(192, 72, 48, 0.14), inset 1px 0 0 rgba(255, 235, 210, 0.06) !important; background: radial-gradient(circle at 18% 8%, rgba(245, 174, 92, 0.16), transparent 32%), radial-gradient(circle at 88% 18%, rgba(122, 22, 44, 0.22), transparent 34%), radial-gradient(circle at 70% 86%, rgba(192, 72, 48, 0.18), transparent 38%), linear-gradient(180deg, #221015 0%, #170a0f 46%, #10070b 100%) !important; } #bp-dw .bp-dw__panel::before, #bp-dw.amici-cart-drawer-viewport .bp-dw__panel::before { content: "" !important; position: absolute !important; inset: 0 !important; z-index: 0 !important; pointer-events: none !important; opacity: 0.55 !important; background: linear-gradient(115deg, rgba(255, 236, 204, 0.07), transparent 24%, transparent 68%, rgba(192, 72, 48, 0.06)), linear-gradient(180deg, rgba(255, 177, 88, 0.08), transparent 18%, rgba(122, 22, 44, 0.08) 100%) !important; } #bp-dw .bp-dw__h, #bp-dw.amici-cart-drawer-viewport .bp-dw__h { position: relative !important; z-index: 1 !important; border-bottom: 1px solid rgba(245, 234, 216, 0.08) !important; background: linear-gradient(180deg, rgba(255, 235, 210, 0.08), rgba(255, 235, 210, 0.025)), linear-gradient(135deg, rgba(138, 46, 24, 0.34), rgba(122, 22, 44, 0.22)) !important; } #bp-dw .bp-dw__h b, #bp-dw.amici-cart-drawer-viewport .bp-dw__h b { color: #f5ead8 !important; text-shadow: 0 0 18px rgba(192, 72, 48, 0.34), 0 0 28px rgba(245, 174, 92, 0.16) !important; } #bp-dw .bp-dw__x, #bp-dw.amici-cart-drawer-viewport .bp-dw__x { color: #f5ead8 !important; border: 1px solid rgba(245, 234, 216, 0.12) !important; background: linear-gradient(180deg, rgba(255, 235, 210, 0.08), rgba(255, 235, 210, 0.025)), rgba(122, 22, 44, 0.18) !important; } #bp-dw .bp-dw__b, #bp-dw.amici-cart-drawer-viewport .bp-dw__b { position: relative !important; z-index: 1 !important; background: transparent !important; } #bp-dw .bp-dw__pickup, #bp-dw.amici-cart-drawer-viewport .bp-dw__pickup { color: rgba(245, 234, 216, 0.88) !important; border: 1px solid rgba(245, 174, 92, 0.22) !important; background: linear-gradient(180deg, rgba(245, 174, 92, 0.11), rgba(192, 72, 48, 0.07)) !important; } #bp-dw .bp-dw__pickup strong, #bp-dw.amici-cart-drawer-viewport .bp-dw__pickup strong { color: #ffd6a3 !important; } #bp-dw .bp-line, #bp-dw.amici-cart-drawer-viewport .bp-line { border: 1px solid rgba(245, 234, 216, 0.075) !important; box-shadow: 0 12px 28px rgba(0, 0, 0, 0.24), inset 0 1px 0 rgba(255, 235, 210, 0.04) !important; background: linear-gradient(180deg, rgba(255, 235, 210, 0.055), rgba(255, 235, 210, 0.018)), rgba(42, 15, 20, 0.58) !important; } #bp-dw .bp-line img, #bp-dw.amici-cart-drawer-viewport .bp-line img { border: 1px solid rgba(245, 234, 216, 0.08) !important; box-shadow: 0 8px 18px rgba(0, 0, 0, 0.24) !important; } #bp-dw .bp-ln, #bp-dw.amici-cart-drawer-viewport .bp-ln { color: #ffd6a3 !important; } #bp-dw .bp-lu, #bp-dw.amici-cart-drawer-viewport .bp-lu { color: rgba(245, 234, 216, 0.58) !important; } #bp-dw .bp-qb, #bp-dw.amici-cart-drawer-viewport .bp-qb { color: #f5ead8 !important; border: 1px solid rgba(245, 234, 216, 0.12) !important; background: linear-gradient(180deg, rgba(255, 235, 210, 0.07), rgba(255, 235, 210, 0.025)), rgba(122, 22, 44, 0.18) !important; } #bp-dw .bp-qb:hover, #bp-dw.amici-cart-drawer-viewport .bp-qb:hover { border-color: rgba(245, 174, 92, 0.30) !important; background: linear-gradient(180deg, rgba(245, 174, 92, 0.13), rgba(192, 72, 48, 0.08)) !important; } #bp-dw .bp-sum, #bp-dw.amici-cart-drawer-viewport .bp-sum { color: #ffd6a3 !important; } #bp-dw .bp-rm, #bp-dw.amici-cart-drawer-viewport .bp-rm { color: rgba(245, 234, 216, 0.48) !important; } #bp-dw .bp-note label, #bp-dw.amici-cart-drawer-viewport .bp-note label { color: #ffd6a3 !important; } #bp-dw .bp-note textarea, #bp-dw.amici-cart-drawer-viewport .bp-note textarea { color: #f5ead8 !important; border: 1px solid rgba(245, 234, 216, 0.10) !important; background: linear-gradient(180deg, rgba(255, 235, 210, 0.045), rgba(255, 235, 210, 0.015)), rgba(9, 3, 6, 0.52) !important; } #bp-dw .bp-note textarea:focus, #bp-dw.amici-cart-drawer-viewport .bp-note textarea:focus { border-color: rgba(245, 174, 92, 0.36) !important; box-shadow: 0 0 0 4px rgba(192, 72, 48, 0.13) !important; } #bp-dw .bp-dw__f, #bp-dw.amici-cart-drawer-viewport .bp-dw__f { position: relative !important; z-index: 2 !important; border-top: 1px solid rgba(245, 234, 216, 0.085) !important; background: linear-gradient(180deg, rgba(34, 16, 21, 0.86), rgba(13, 5, 8, 0.98)), radial-gradient(circle at 80% 0%, rgba(192, 72, 48, 0.16), transparent 42%) !important; box-shadow: 0 -18px 40px rgba(0, 0, 0, 0.38), inset 0 1px 0 rgba(255, 235, 210, 0.04) !important; } #bp-dw .bp-t, #bp-dw.amici-cart-drawer-viewport .bp-t { color: rgba(245, 234, 216, 0.82) !important; } #bp-dw .bp-t b, #bp-dw.amici-cart-drawer-viewport .bp-t b { color: #ffd6a3 !important; } #bp-dw .bp-t.m, #bp-dw.amici-cart-drawer-viewport .bp-t.m { color: rgba(245, 234, 216, 0.50) !important; } #bp-dw .bp-t.m b, #bp-dw.amici-cart-drawer-viewport .bp-t.m b { color: rgba(255, 214, 163, 0.76) !important; } #bp-dw .bp-check, #bp-dw.amici-cart-drawer-viewport .bp-check { color: #180b13 !important; background: linear-gradient(135deg, #f5ead8 0%, #ffd6a3 38%, #d06858 100%) !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.34), 0 12px 28px rgba(192, 72, 48, 0.28), 0 0 0 1px rgba(245, 174, 92, 0.20) !important; } #bp-dw .bp-check:hover, #bp-dw.amici-cart-drawer-viewport .bp-check:hover { filter: brightness(1.04) !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.40), 0 16px 34px rgba(192, 72, 48, 0.36), 0 0 18px rgba(245, 174, 92, 0.12), 0 0 0 1px rgba(245, 174, 92, 0.28) !important; } @media (max-width: 680px) { #bp-dw.amici-cart-drawer-viewport .bp-dw__panel { border: 1px solid rgba(192, 72, 48, 0.24) !important; border-bottom: none !important; } } /* 🟣 LANDMARK: CART DRAWER ORDER BUTTON — ITALIAN SUNSET ONLY */ #bp-dw #bp-check.bp-check, #bp-dw .bp-dw__f #bp-check.bp-check { min-height: 54px !important; height: 54px !important; padding: 13px 22px !important; color: #F5EAD8 !important; border: 1px solid rgba(192, 72, 48, 0.42) !important; background: linear-gradient( 135deg, #8A2E18 0%, #C04830 46%, #D06858 100% ) !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.18), 0 14px 32px rgba(10, 0, 5, 0.42), 0 10px 24px rgba(192, 72, 48, 0.28), 0 0 0 1px rgba(192, 72, 48, 0.26) !important; text-shadow: 0 1px 0 rgba(0, 0, 0, 0.22) !important; } #bp-dw #bp-check.bp-check:hover, #bp-dw .bp-dw__f #bp-check.bp-check:hover { filter: brightness(1.06) !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.22), 0 18px 38px rgba(10, 0, 5, 0.50), 0 12px 30px rgba(192, 72, 48, 0.36), 0 0 0 1px rgba(192, 72, 48, 0.34) !important; } #bp-dw #bp-check.bp-check:disabled, #bp-dw .bp-dw__f #bp-check.bp-check:disabled { opacity: 0.62 !important; cursor: not-allowed !important; filter: grayscale(0.12) brightness(0.92) !important; } /* 🟣 LANDMARK: OTP ONLY — CENTER VERIFICATION MODAL WITHOUT TOUCHING OTHER MODALS */ #bp-otp.is-open { position: fixed !important; inset: 0 !important; z-index: 2147483000 !important; display: flex !important; align-items: center !important; justify-content: center !important; padding: 16px !important; overflow: hidden !important; } #bp-otp.is-open > div:not(#bp-otp-ov) { position: relative !important; z-index: 2 !important; width: min(440px, calc(100vw - 32px)) !important; max-height: calc(100dvh - 32px) !important; overflow-y: auto !important; margin: 0 !important; transform: none !important; } #bp-otp.is-open #bp-otp-ov { position: fixed !important; inset: 0 !important; } /* ========================================================================== 🟣 LANDMARK: GOLD CURSOR — ALWAYS VISIBLE ON DESKTOP Purpose: - Курсорът да се вижда при движение на мишката навсякъде в сайта. - Не пипа модали, количка, бутони, checkout, auth или layout. ========================================================================== */ #bp-gold-cursor { position: fixed !important; left: 0 !important; top: 0 !important; width: 22px !important; height: 22px !important; border-radius: 999px !important; pointer-events: none !important; z-index: 2147483647 !important; opacity: 0 !important; visibility: hidden !important; border: 1px solid rgba(245, 174, 92, 0.72) !important; background: radial-gradient( circle at 35% 35%, rgba(255, 234, 190, 0.95), rgba(245, 174, 92, 0.42) 38%, rgba(192, 72, 48, 0.14) 70%, transparent 72% ) !important; box-shadow: 0 0 12px rgba(245, 174, 92, 0.42), 0 0 28px rgba(192, 72, 48, 0.26), 0 0 44px rgba(245, 234, 216, 0.10) !important; transform: translate3d(-120px, -120px, 0) !important; transition: opacity 0.14s ease, visibility 0.14s ease, width 0.14s ease, height 0.14s ease, box-shadow 0.14s ease, border-color 0.14s ease !important; will-change: transform, opacity !important; } #bp-gold-cursor.is-on { opacity: 1 !important; visibility: visible !important; } #bp-gold-cursor.is-pressed { width: 16px !important; height: 16px !important; border-color: rgba(255, 214, 163, 0.88) !important; box-shadow: 0 0 8px rgba(245, 174, 92, 0.50), 0 0 18px rgba(192, 72, 48, 0.30), 0 0 34px rgba(245, 234, 216, 0.12) !important; } @media (max-width: 1023px), (hover: none), (pointer: coarse) { #bp-gold-cursor { display: none !important; } } /* 🟣 LANDMARK: FORCE STANDARD CURSOR EVERYWHERE */ html, body, body *, #bp-root, #bp-root *, #amici-menu-mount, #amici-menu-mount * { cursor: default !important; } /* ========================================================================== 🟣 LANDMARK: AUTH MODAL — INPUT CLIPPING FINAL FIX Диагноза: - #bp-auth е извън #bp-root. - Inputs са width:100% + padding при box-sizing:content-box. - Реалната ширина става по-голяма от формата и се реже от overflow:hidden. - Фиксът засяга само вход/регистрация модала. ========================================================================== */ #bp-auth, #bp-auth *, #bp-auth *::before, #bp-auth *::after { box-sizing: border-box !important; } #bp-auth .bp-auth__card { overflow-x: visible !important; } #bp-auth .bp-auth__form, #bp-auth .bp-field, #bp-auth .bp-field input, #bp-auth .bp-auth__tabs, #bp-auth .bp-auth__actions { width: 100% !important; max-width: 100% !important; min-width: 0 !important; } #bp-auth .bp-field { overflow: visible !important; } #bp-auth .bp-field input { display: block !important; box-sizing: border-box !important; padding-left: 15px !important; padding-right: 15px !important; } /* ========================================================================== Embedded theme-v4.css ========================================================================== */ /* ========================================================================== THEME V4 — SUNSET ITALY Типография, background детайли и финални override-и. Наслагвай след tokens-v4.css. ========================================================================== */ /* ========================================================================== 1) ТИПОГРАФИЯ — Georgia serif за заглавия ========================================================================== */ /* Главни заглавия — от Oswald на Georgia serif */ #bp-root .bp-h1, #bp-root .bp-h2 { font-family: Georgia, 'Times New Roman', serif !important; font-style: italic !important; letter-spacing: 0 !important; text-transform: none !important; font-weight: 400 !important; } /* Лого текст — запазва характер, но по-елегантно */ #bp-root .bp-logo-text { font-family: Georgia, 'Times New Roman', serif !important; font-style: italic !important; font-size: 26px !important; letter-spacing: 1px !important; text-transform: none !important; background: linear-gradient(135deg, #906030 0%, #CFA060 42%, #EDD0A0 70%, #A07030 100%) !important; -webkit-background-clip: text !important; -webkit-text-fill-color: transparent !important; background-clip: text !important; text-shadow: none !important; } #bp-root .bp-logo-sub { font-family: 'Nunito', system-ui, sans-serif !important; color: rgba(224, 188, 122, 0.50) !important; letter-spacing: 3px !important; } /* Section labels */ #bp-root .bp-slabel { font-family: 'Nunito', system-ui, sans-serif !important; color: var(--bro-orange) !important; letter-spacing: 0.20em !important; } /* Hero card заглавие */ #bp-root .bp-hero-card__title { font-family: Georgia, 'Times New Roman', serif !important; font-style: italic !important; font-weight: 400 !important; text-transform: none !important; letter-spacing: -0.5px !important; } /* Kicker текстове */ #bp-root .bp-hero-card__kicker { font-family: 'Nunito', system-ui, sans-serif !important; font-weight: 700 !important; letter-spacing: 0.18em !important; color: #E0BC7A !important; } /* Pill / badge */ #bp-root .bp-pill { font-family: 'Nunito', system-ui, sans-serif !important; color: #E0BC7A !important; border-color: rgba(192, 72, 48, 0.28) !important; background: linear-gradient(180deg, rgba(192, 72, 48, 0.14), rgba(192, 72, 48, 0.07)) !important; } #bp-root .bp-dot { background: var(--bro-orange) !important; box-shadow: 0 0 0 5px rgba(192, 72, 48, 0.16), 0 0 20px rgba(192, 72, 48, 0.22) !important; } /* Product имена */ #bp-root .bp-p h4 { font-family: Georgia, 'Times New Roman', serif !important; font-style: italic !important; font-weight: 400 !important; text-transform: none !important; color: #E0BC7A !important; letter-spacing: 0 !important; font-size: 16px !important; } /* Drawer заглавие */ #bp-root .bp-dw__h b { font-family: Georgia, 'Times New Roman', serif !important; font-style: italic !important; font-weight: 400 !important; text-transform: none !important; letter-spacing: 0 !important; color: var(--bro-orange) !important; } /* Footer заглавия */ #bp-root .bp-ft-col-title { font-family: 'Nunito', system-ui, sans-serif !important; letter-spacing: 0.18em !important; } #bp-root .bp-ft-ctitle { font-family: Georgia, 'Times New Roman', serif !important; font-style: italic !important; font-weight: 400 !important; text-transform: none !important; letter-spacing: 0 !important; } #bp-root .bp-map-title, #bp-root .bp-rev-title { font-family: Georgia, 'Times New Roman', serif !important; font-style: italic !important; font-weight: 400 !important; text-transform: none !important; letter-spacing: 0 !important; } /* Бутон текстове — запазваме Oswald за бутони (по-добра четимост) */ #bp-root .btn, #bp-root .bp-check, #bp-root .bp-cat, #bp-root .bp-add2, #bp-root .bp-plus-btn { font-family: 'Nunito', system-ui, sans-serif !important; letter-spacing: 0.06em !important; } /* ========================================================================== 2) ЗАКРЪГЛЕНИ ФОРМИ — по-меки от Apple ========================================================================== */ /* Hero */ #bp-root .bp-hero { border-radius: var(--radius-xl) !important; } /* Продуктови карти */ #bp-root .bp-p { border-radius: var(--radius-lg) !important; } #bp-root .bp-p img { border-radius: var(--radius-lg) var(--radius-lg) 0 0 !important; } /* Категории */ #bp-root .bp-cats { border-radius: var(--radius-lg) !important; } #bp-root .bp-cat { border-radius: 999px !important; } /* Бутони */ #bp-root .btn, #bp-root .bp-check { border-radius: 999px !important; } /* Add бутони */ #bp-root .bp-add2 { border-radius: var(--radius-sm) !important; } #bp-root .bp-plus-duo { border-radius: var(--radius-md) !important; } /* Map карта */ #bp-root .bp-map-card { border-radius: var(--radius-lg) !important; } /* Ревю карти */ #bp-root .bp-rev-card { border-radius: var(--radius-lg) !important; } /* Footer shell */ #bp-root .bp-ft-shell { border-radius: var(--radius-xl) !important; } /* Drawer панел */ #bp-root .bp-dw__panel { border-radius: var(--radius-xl) var(--radius-xl) 0 0 !important; } /* Модали */ #bp-root .bp-modal__card, #bp-root .bp-auth__card, #bp-root .bp-otp__card, #bp-root .bp-forgot__card, #bp-root .bp-plus-modal__card { border-radius: var(--radius-xl) !important; } /* Inputs */ #bp-root .bp-rev-inp, #bp-root .bp-rev-txt, #bp-root .bp-field input, #bp-root .bp-field select, #bp-root .bp-note textarea { border-radius: var(--radius-sm) !important; } /* Line items в количката */ #bp-root .bp-line { border-radius: var(--radius-md) !important; } /* Notice / info boxes */ #bp-root .bp-p__notice { border-radius: var(--radius-sm) !important; background: linear-gradient(180deg, rgba(192, 72, 48, 0.08), rgba(192, 72, 48, 0.04)) !important; border-color: rgba(192, 72, 48, 0.18) !important; } /* ========================================================================== 3) HERO BACKGROUND — нощен залез ========================================================================== */ #bp-root .bp-hero__right::before { background: radial-gradient(circle at 28% 28%, rgba(192, 72, 48, 0.10), transparent 30%), radial-gradient(circle at 75% 75%, rgba(207, 160, 96, 0.09), transparent 28%), linear-gradient(180deg, rgba(245, 220, 190, 0.02), rgba(245, 200, 170, 0.01)) !important; border-color: rgba(245, 234, 216, 0.06) !important; } /* ========================================================================== 4) STARS — звездички в ревюта — терракота/злато ========================================================================== */ #bp-root .bp-rev-stars { color: #CFA060 !important; } #bp-root .bp-star-btn { color: #CFA060 !important; } #bp-root .bp-star-btn.is-on { border-color: rgba(192, 72, 48, 0.36) !important; background: rgba(192, 72, 48, 0.16) !important; } /* ========================================================================== 5) QTY БУТОНИ В КОЛИЧКАТА ========================================================================== */ #bp-root .bp-qb { color: var(--bro-orange) !important; border-color: rgba(245, 234, 216, 0.09) !important; background: rgba(245, 220, 190, 0.04) !important; } #bp-root .bp-ok { border-color: rgba(192, 72, 48, 0.30) !important; background: rgba(192, 72, 48, 0.18) !important; color: var(--bro-orange) !important; } /* ========================================================================== 6) CHIP / PILL елементи ========================================================================== */ #bp-root .bp-plus-chip, #bp-root .bp-jackpot-banner__badge { color: #E0BC7A !important; border-color: rgba(192, 72, 48, 0.22) !important; background: rgba(192, 72, 48, 0.09) !important; } #bp-root .bp-line__mods span { color: rgba(224, 188, 122, 0.88) !important; border-color: rgba(192, 72, 48, 0.16) !important; background: rgba(192, 72, 48, 0.09) !important; } /* ========================================================================== 7) HERO BADGE (отворено/затворено) ========================================================================== */ #bp-root .bp-hero-badge { background: linear-gradient(180deg, rgba(245, 220, 190, 0.05), rgba(245, 200, 170, 0.02)) !important; border-color: rgba(245, 234, 216, 0.10) !important; } #bp-root .bp-hero-badge__lamp { background: var(--bro-orange) !important; box-shadow: 0 0 0 4px rgba(192, 72, 48, 0.16), 0 0 14px rgba(192, 72, 48, 0.40) !important; } /* ========================================================================== 8) FOOTER PILL / BADGE BUTTONS — запазват се, но с топла гама ========================================================================== */ #bp-root .bp-footer-policy-badge { background: linear-gradient(180deg, rgba(245, 220, 190, 0.10), rgba(245, 200, 170, 0.04)), linear-gradient(135deg, rgba(192, 72, 48, 0.22), rgba(207, 160, 96, 0.10) 52%, rgba(245, 234, 216, 0.03) 100%) !important; border-color: rgba(192, 72, 48, 0.36) !important; color: #F5EAD8 !important; } #bp-root .bp-footer-policy-badge__icon { color: #CFA060 !important; text-shadow: 0 0 12px rgba(192, 72, 48, 0.50) !important; } #bp-root .bp-ft-epill { color: var(--bro-orange) !important; border-color: rgba(192, 72, 48, 0.22) !important; background: rgba(192, 72, 48, 0.10) !important; } /* ========================================================================== 9) PLUS MODAL — топли тонове ========================================================================== */ #bp-root .bp-plus-block { background: rgba(245, 220, 190, 0.03) !important; border-color: rgba(245, 234, 216, 0.06) !important; } #bp-root .bp-plus-block__title { color: var(--bro-orange) !important; } #bp-root .bp-plus-mod { background: rgba(245, 220, 190, 0.03) !important; border-color: rgba(245, 234, 216, 0.06) !important; } #bp-root .bp-plus-mod:hover { border-color: rgba(192, 72, 48, 0.20) !important; background: rgba(245, 220, 190, 0.05) !important; } /* ========================================================================== 10) FLAVOR TEXT — курсив, топла роза ========================================================================== */ #bp-root .bp-flavor { color: rgba(192, 72, 48, 0.72) !important; } /* ========================================================================== 11) SCHEDULED BUTTON активно състояние ========================================================================== */ #bp-root #bp-open-scheduled-order.is-active { color: #F5EAD8 !important; background: linear-gradient(180deg, rgba(245, 220, 190, 0.12), rgba(245, 200, 170, 0.04)), linear-gradient(135deg, rgba(140, 55, 20, 0.96), rgba(192, 72, 48, 0.92) 55%, rgba(208, 104, 88, 0.92) 100%) !important; box-shadow: 0 16px 34px rgba(10, 0, 5, 0.28), 0 10px 26px rgba(192, 72, 48, 0.26), inset 0 1px 0 rgba(255, 255, 255, 0.14) !important; } /* ========================================================================== 12) MAP IFRAME — топъл филтър ========================================================================== */ #bp-root .bp-map-iframe { filter: grayscale(0.06) contrast(0.92) brightness(0.84) sepia(0.14) hue-rotate(320deg) !important; } /* ========================================================================== 13) LIVE REVIEW СЕКЦИЯ ========================================================================== */ #bp-root .bp-rev-live { background: linear-gradient(180deg, rgba(245, 220, 190, 0.04), rgba(245, 200, 170, 0.015)), rgba(192, 72, 48, 0.03) !important; border-color: rgba(245, 234, 216, 0.07) !important; } /* ========================================================================== 14) ФИНА ДЕТАЙЛНОСТ — hover glow на продукти ========================================================================== */ #bp-root .bp-p:hover img { filter: saturate(1.08) contrast(1.02) brightness(1.02) !important; } /* Subtle warm grain overlay override */ #bp-root::before { background-image: radial-gradient(rgba(245, 210, 170, 0.20) 0.55px, transparent 0.7px) !important; } #bp-root .bp-v4-stats { display: flex; gap: 8px; margin: 16px 0 0; } #bp-root .bp-v4-stat { flex: 1; background: var(--bro-dark); border-radius: var(--radius-md); padding: 12px 8px; text-align: center; border: 1px solid var(--card-border); } #bp-root .bp-v4-stat__val { font-family: Georgia, serif; font-size: 20px; font-weight: 600; color: var(--bro-orange); line-height: 1; } #bp-root .bp-v4-stat__lbl { font-size: 9px; color: var(--bro-muted); margin-top: 4px; letter-spacing: 0.5px; } /* ── Stats Row ─────────────────────────────────────────── */ #bp-root .bp-v4-stats { display: flex; gap: 8px; margin: 16px 0 0; } #bp-root .bp-v4-stat { flex: 1; background: var(--bro-dark-2); border-radius: var(--radius-md); padding: 12px 8px; text-align: center; border: 1px solid var(--card-border); } #bp-root .bp-v4-stat__val { font-family: Georgia, 'Times New Roman', serif; font-size: 20px; font-weight: 600; color: var(--bro-orange); line-height: 1; } #bp-root .bp-v4-stat__lbl { font-size: 9px; color: var(--bro-muted); margin-top: 4px; letter-spacing: 0.5px; font-family: 'Nunito', sans-serif; } /* ── Категории с емотикони (без JS) ────────────────────── */ #bp-root .bp-cat[data-type] { display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; gap: 4px !important; text-align: center !important; line-height: 1.1 !important; padding-top: 8px !important; padding-bottom: 8px !important; } #bp-root .bp-cat[data-type]::before { display: block; font-size: 20px; line-height: 1; } #bp-root .bp-cat[data-type="Оферти"]::before { content: "🔥"; } #bp-root .bp-cat[data-type="Пици"]::before { content: "🍕"; } #bp-root .bp-cat[data-type="Паста"]::before { content: "🍝"; } #bp-root .bp-cat[data-type="Напитки"]::before { content: "🥤"; } #bp-root .bp-cat[data-type="Десерти"]::before { content: "🍮"; } /* ========================================================================== HARD FIX — AUTH / OTP INPUTS NOT CUT ON RIGHT SIDE Оправя само полетата вътре в модалите, без да мести модала. ========================================================================== */ #bp-root #bp-auth .bp-auth__card, #bp-root #bp-otp .bp-otp__card, #bp-root #bp-forgot .bp-forgot__card { overflow: hidden !important; } #bp-root #bp-auth .bp-field, #bp-root #bp-otp .bp-field, #bp-root #bp-forgot .bp-field { width: 100% !important; max-width: 100% !important; min-width: 0 !important; box-sizing: border-box !important; overflow: hidden !important; } #bp-root #bp-auth .bp-field input, #bp-root #bp-otp .bp-field input, #bp-root #bp-forgot .bp-field input { display: block !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; box-sizing: border-box !important; margin-left: 0 !important; margin-right: 0 !important; padding-left: 22px !important; padding-right: 22px !important; border-left-width: 1px !important; border-right-width: 1px !important; overflow: hidden !important; } /* За iPhone — малко по-компактни полета */ @media (max-width: 430px) { #bp-root #bp-auth .bp-field input, #bp-root #bp-otp .bp-field input, #bp-root #bp-forgot .bp-field input { padding-left: 18px !important; padding-right: 18px !important; } }/* ========================================================================== 🟣 LANDMARK: AMICI SUCCESS MODAL — DESKTOP CENTERING FINAL FIX ========================================================================== */ #bp-root #bp-modal.bp-modal, #bp-modal.bp-modal { position: fixed !important; inset: 0 !important; top: 0 !important; right: 0 !important; bottom: 0 !important; left: 0 !important; width: 100vw !important; height: 100vh !important; height: 100dvh !important; z-index: 2147483646 !important; display: none !important; align-items: center !important; justify-content: center !important; padding: 24px !important; box-sizing: border-box !important; opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; transform: none !important; } #bp-root #bp-modal.bp-modal.is-open, #bp-modal.bp-modal.is-open { display: flex !important; opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; } #bp-root #bp-modal .bp-modal__ov, #bp-modal .bp-modal__ov { position: absolute !important; inset: 0 !important; z-index: 1 !important; background: rgba(5, 0, 8, 0.78) !important; backdrop-filter: blur(14px) !important; -webkit-backdrop-filter: blur(14px) !important; } #bp-root #bp-modal .bp-modal__card, #bp-modal .bp-modal__card { position: relative !important; top: auto !important; right: auto !important; bottom: auto !important; left: auto !important; z-index: 2 !important; transform: none !important; translate: none !important; margin: 0 auto !important; width: min(560px, calc(100vw - 48px)) !important; max-width: 560px !important; max-height: calc(100dvh - 48px) !important; overflow-y: auto !important; box-sizing: border-box !important; padding: 26px !important; border-radius: 30px !important; background: radial-gradient(circle at 50% 0%, rgba(207, 160, 96, 0.18), transparent 38%), linear-gradient(145deg, #2A1420 0%, #16080d 68%, #241018 100%) !important; border: 1px solid rgba(245, 234, 216, 0.14) !important; box-shadow: 0 34px 90px rgba(0, 0, 0, 0.68), inset 0 1px 0 rgba(255, 255, 255, 0.06) !important; color: #F5EAD8 !important; pointer-events: auto !important; } body:has(#bp-modal.is-open) #bp-root .bp-float-cart, body:has(#bp-modal.is-open) #bp-root .bp-cart-float, body:has(#bp-modal.is-open) #bp-root #bp-cart-float, body:has(#bp-modal.is-open) #bp-root .bp-floating-cart, body:has(#bp-modal.is-open) .bp-floating-cart, body:has(#bp-modal.is-open) #bp-floating-cart { opacity: 0 !important; pointer-events: none !important; visibility: hidden !important; } html.bp-scroll-locked #bp-root .bp-float-cart, html.bp-scroll-locked #bp-root .bp-cart-float, html.bp-scroll-locked #bp-root #bp-cart-float, html.bp-scroll-locked #bp-root .bp-floating-cart, html.bp-scroll-locked .bp-floating-cart, html.bp-scroll-locked #bp-floating-cart, body.bp-scroll-locked #bp-root .bp-float-cart, body.bp-scroll-locked #bp-root .bp-cart-float, body.bp-scroll-locked #bp-root #bp-cart-float, body.bp-scroll-locked #bp-root .bp-floating-cart, body.bp-scroll-locked .bp-floating-cart, body.bp-scroll-locked #bp-floating-cart { opacity: 0 !important; pointer-events: none !important; visibility: hidden !important; } #bp-root #bp-modal .bp-modal__btns, #bp-modal .bp-modal__btns { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 10px !important; margin-top: 18px !important; } #bp-root #bp-modal .bp-modal__btns .btn, #bp-root #bp-modal .bp-modal__btns a, #bp-modal .bp-modal__btns .btn, #bp-modal .bp-modal__btns a { width: 100% !important; min-height: 52px !important; border-radius: 999px !important; } @media (max-width: 680px) { #bp-root #bp-modal.bp-modal, #bp-modal.bp-modal { padding: 16px !important; } #bp-root #bp-modal .bp-modal__card, #bp-modal .bp-modal__card { width: min(100%, calc(100vw - 32px)) !important; max-width: calc(100vw - 32px) !important; max-height: calc(100dvh - 32px) !important; } #bp-root #bp-modal .bp-modal__btns, #bp-modal .bp-modal__btns { grid-template-columns: 1fr !important; } } /* ========================================================================== 🟣 LANDMARK: AMICI GEM REPLACEMENT — RUBY + AMETHYST IMAGE Сменя стария рубин и стария аметист с новото Amici изображение. ========================================================================== */ #bp-root .bp-ruby__gem, #bp-root .bp-amethyst__gem { width: 58px !important; height: 58px !important; border-radius: 0 !important; clip-path: none !important; transform: none !important; background-image: url("https://amicipizza.bg/wp-content/uploads/2026/05/ChatGPT-Image-May-22-2026-12_02_31-AM-Edited.png") !important; background-size: contain !important; background-position: center !important; background-repeat: no-repeat !important; filter: saturate(1.08) contrast(1.04) drop-shadow(0 0 14px rgba(207, 160, 96, 0.30)) !important; } /* Малко по-голям holder, за да не изглежда дребно. */ #bp-root .bp-ruby, #bp-root .bp-amethyst { --rubySize: 86px; --rubyRadius: 26px; --amethystSize: 86px; --amethystRadius: 26px; } /* Mobile. */ @media (max-width: 680px) { #bp-root .bp-ruby__gem, #bp-root .bp-amethyst__gem { width: 54px !important; height: 54px !important; } #bp-root .bp-ruby, #bp-root .bp-amethyst { --rubySize: 80px; --rubyRadius: 24px; --amethystSize: 80px; --amethystRadius: 24px; } } /* Small mobile. */ @media (max-width: 400px) { #bp-root .bp-ruby__gem, #bp-root .bp-amethyst__gem { width: 46px !important; height: 46px !important; } #bp-root .bp-ruby, #bp-root .bp-amethyst { --rubySize: 66px; --rubyRadius: 20px; --amethystSize: 66px; --amethystRadius: 20px; } }/* ========================================================================== 🟣 LANDMARK: AMICI GEM — MUCH BIGGER FINAL SIZE Увеличава новото изображение на мястото на рубина и аметиста. ========================================================================== */ #bp-root .bp-ruby, #bp-root .bp-amethyst { --rubySize: 150px !important; --rubyRadius: 42px !important; --amethystSize: 150px !important; --amethystRadius: 42px !important; } #bp-root .bp-ruby__gem, #bp-root .bp-amethyst__gem { width: 118px !important; height: 118px !important; background-image: url("https://amicipizza.bg/wp-content/uploads/2026/05/ChatGPT-Image-May-22-2026-12_02_31-AM-Edited.png") !important; background-size: contain !important; background-position: center !important; background-repeat: no-repeat !important; filter: saturate(1.08) contrast(1.04) drop-shadow(0 0 22px rgba(207, 160, 96, 0.36)) !important; } /* Mobile */ @media (max-width: 680px) { #bp-root .bp-ruby, #bp-root .bp-amethyst { --rubySize: 128px !important; --rubyRadius: 36px !important; --amethystSize: 128px !important; --amethystRadius: 36px !important; } #bp-root .bp-ruby__gem, #bp-root .bp-amethyst__gem { width: 102px !important; height: 102px !important; } } /* Small mobile */ @media (max-width: 400px) { #bp-root .bp-ruby, #bp-root .bp-amethyst { --rubySize: 112px !important; --rubyRadius: 32px !important; --amethystSize: 112px !important; --amethystRadius: 32px !important; } #bp-root .bp-ruby__gem, #bp-root .bp-amethyst__gem { width: 90px !important; height: 90px !important; } } /* ========================================================================== 🟣 LANDMARK: AMICI GEM / CTA ICON — BIG IMAGE, TIGHT SQUARE, NO ORBITS ========================================================================== */ /* -------------------------------------------------- 1) Главен контейнер -------------------------------------------------- */ #bp-root .bp-ruby, #bp-root .bp-amethyst { display: flex !important; align-items: center !important; justify-content: center !important; width: 260px !important; height: 260px !important; min-width: 260px !important; min-height: 260px !important; margin: 0 auto !important; position: relative !important; } /* -------------------------------------------------- 2) Stage / квадратът около изображението -------------------------------------------------- */ #bp-root .bp-ruby-stage, #bp-root .bp-amethyst-sec, #bp-root .bp-ruby__stage, #bp-root .bp-amethyst__stage { display: flex !important; align-items: center !important; justify-content: center !important; width: 176px !important; height: 176px !important; min-width: 176px !important; min-height: 176px !important; margin: 0 auto !important; padding: 0 !important; border-radius: 38px !important; background: linear-gradient(180deg, rgba(255, 220, 190, 0.06), rgba(255, 220, 190, 0.02)), rgba(255, 255, 255, 0.025) !important; border: 1px solid rgba(245, 234, 216, 0.10) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,0.06), 0 18px 42px rgba(10,0,5,0.28) !important; position: relative !important; overflow: hidden !important; } /* -------------------------------------------------- 3) Самото изображение — по-голямо -------------------------------------------------- */ #bp-root .bp-ruby__gem, #bp-root .bp-amethyst__gem { width: 148px !important; height: 148px !important; min-width: 148px !important; min-height: 148px !important; background-image: url("https://amicipizza.bg/wp-content/uploads/2026/05/ChatGPT-Image-May-22-2026-12_02_31-AM-Edited.png") !important; background-repeat: no-repeat !important; background-position: center !important; background-size: contain !important; border-radius: 30px !important; box-shadow: 0 0 24px rgba(255, 120, 40, 0.22) !important; position: relative !important; z-index: 3 !important; } /* -------------------------------------------------- 4) Премахване на въртящите се обекти / орбити / точки -------------------------------------------------- */ #bp-root .bp-ruby__orbit, #bp-root .bp-amethyst__orbit, #bp-root .bp-ruby__ring, #bp-root .bp-amethyst__ring, #bp-root .bp-ruby__particle, #bp-root .bp-amethyst__particle, #bp-root .bp-ruby__dot, #bp-root .bp-amethyst__dot, #bp-root .bp-ruby__glow-dot, #bp-root .bp-amethyst__glow-dot, #bp-root .bp-ruby .orbit, #bp-root .bp-amethyst .orbit, #bp-root .bp-ruby .particle, #bp-root .bp-amethyst .particle, #bp-root .bp-ruby .dot, #bp-root .bp-amethyst .dot { display: none !important; opacity: 0 !important; visibility: hidden !important; animation: none !important; } /* Ако има псевдо-елементи за кръгове/орбити */ #bp-root .bp-ruby::before, #bp-root .bp-ruby::after, #bp-root .bp-amethyst::before, #bp-root .bp-amethyst::after, #bp-root .bp-ruby-stage::before, #bp-root .bp-ruby-stage::after, #bp-root .bp-amethyst-sec::before, #bp-root .bp-amethyst-sec::after, #bp-root .bp-ruby__stage::before, #bp-root .bp-ruby__stage::after, #bp-root .bp-amethyst__stage::before, #bp-root .bp-amethyst__stage::after { display: none !important; content: none !important; animation: none !important; } /* Ако някъде е зададена ротация/анимация */ #bp-root .bp-ruby *, #bp-root .bp-amethyst * { animation-play-state: paused !important; } #bp-root .bp-ruby__gem, #bp-root .bp-amethyst__gem { animation: none !important; transform: none !important; } /* -------------------------------------------------- 5) Mobile -------------------------------------------------- */ @media (max-width: 680px) { #bp-root .bp-ruby, #bp-root .bp-amethyst { width: 220px !important; height: 220px !important; min-width: 220px !important; min-height: 220px !important; } #bp-root .bp-ruby-stage, #bp-root .bp-amethyst-sec, #bp-root .bp-ruby__stage, #bp-root .bp-amethyst__stage { width: 154px !important; height: 154px !important; min-width: 154px !important; min-height: 154px !important; border-radius: 32px !important; } #bp-root .bp-ruby__gem, #bp-root .bp-amethyst__gem { width: 132px !important; height: 132px !important; min-width: 132px !important; min-height: 132px !important; border-radius: 26px !important; } } @media (max-width: 400px) { #bp-root .bp-ruby, #bp-root .bp-amethyst { width: 196px !important; height: 196px !important; min-width: 196px !important; min-height: 196px !important; } #bp-root .bp-ruby-stage, #bp-root .bp-amethyst-sec, #bp-root .bp-ruby__stage, #bp-root .bp-amethyst__stage { width: 142px !important; height: 142px !important; min-width: 142px !important; min-height: 142px !important; border-radius: 28px !important; } #bp-root .bp-ruby__gem, #bp-root .bp-amethyst__gem { width: 122px !important; height: 122px !important; min-width: 122px !important; min-height: 122px !important; border-radius: 24px !important; } } /* ========================================================================== 🟣 LANDMARK: AMICI GEM — IMAGE ONLY / NO HOLDER / NO ORBITS Оставя само самото изображение, голямо, без квадрат, без рамка, без въртящи елементи. ========================================================================== */ /* Главният контейнер само центрира изображението. */ #bp-root .bp-ruby, #bp-root .bp-amethyst { width: 240px !important; height: 240px !important; min-width: 240px !important; min-height: 240px !important; display: flex !important; align-items: center !important; justify-content: center !important; margin: 0 auto !important; padding: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important; overflow: visible !important; } /* Махаме holder-а около изображението. */ #bp-root .bp-ruby-stage, #bp-root .bp-amethyst-sec, #bp-root .bp-ruby__stage, #bp-root .bp-amethyst__stage { width: 240px !important; height: 240px !important; min-width: 240px !important; min-height: 240px !important; display: flex !important; align-items: center !important; justify-content: center !important; margin: 0 auto !important; padding: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important; border-radius: 0 !important; overflow: visible !important; } /* Самото изображение — голямо. */ #bp-root .bp-ruby__gem, #bp-root .bp-amethyst__gem { width: 190px !important; height: 190px !important; min-width: 190px !important; min-height: 190px !important; background-image: url("https://amicipizza.bg/wp-content/uploads/2026/05/ChatGPT-Image-May-22-2026-12_02_31-AM-Edited.png") !important; background-size: contain !important; background-position: center !important; background-repeat: no-repeat !important; background-color: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; filter: none !important; clip-path: none !important; transform: none !important; animation: none !important; position: relative !important; z-index: 3 !important; } /* Махаме абсолютно всички външни кръгове, орбити, точки, glow и псевдо-елементи. */ #bp-root .bp-ruby::before, #bp-root .bp-ruby::after, #bp-root .bp-amethyst::before, #bp-root .bp-amethyst::after, #bp-root .bp-ruby-stage::before, #bp-root .bp-ruby-stage::after, #bp-root .bp-amethyst-sec::before, #bp-root .bp-amethyst-sec::after, #bp-root .bp-ruby__stage::before, #bp-root .bp-ruby__stage::after, #bp-root .bp-amethyst__stage::before, #bp-root .bp-amethyst__stage::after, #bp-root .bp-ruby__orbit, #bp-root .bp-amethyst__orbit, #bp-root .bp-ruby__ring, #bp-root .bp-amethyst__ring, #bp-root .bp-ruby__particle, #bp-root .bp-amethyst__particle, #bp-root .bp-ruby__dot, #bp-root .bp-amethyst__dot, #bp-root .bp-ruby__glow, #bp-root .bp-amethyst__glow, #bp-root .bp-ruby__glow-dot, #bp-root .bp-amethyst__glow-dot { display: none !important; content: none !important; opacity: 0 !important; visibility: hidden !important; animation: none !important; background: transparent !important; border: 0 !important; box-shadow: none !important; } /* Mobile */ @media (max-width: 680px) { #bp-root .bp-ruby, #bp-root .bp-amethyst, #bp-root .bp-ruby-stage, #bp-root .bp-amethyst-sec, #bp-root .bp-ruby__stage, #bp-root .bp-amethyst__stage { width: 210px !important; height: 210px !important; min-width: 210px !important; min-height: 210px !important; } #bp-root .bp-ruby__gem, #bp-root .bp-amethyst__gem { width: 170px !important; height: 170px !important; min-width: 170px !important; min-height: 170px !important; } } /* Small mobile */ @media (max-width: 400px) { #bp-root .bp-ruby, #bp-root .bp-amethyst, #bp-root .bp-ruby-stage, #bp-root .bp-amethyst-sec, #bp-root .bp-ruby__stage, #bp-root .bp-amethyst__stage { width: 190px !important; height: 190px !important; min-width: 190px !important; min-height: 190px !important; } #bp-root .bp-ruby__gem, #bp-root .bp-amethyst__gem { width: 155px !important; height: 155px !important; min-width: 155px !important; min-height: 155px !important; } }/* ========================================================================== 🟣 LANDMARK: AMICI GEM — ONLY IMAGE / NO HOLDER / NO ORBITS / NO RINGS Оставя само самото изображение. ========================================================================== */ /* 1) Външните контейнери — без квадрат, без фон, без рамка */ #bp-root .bp-ruby, #bp-root .bp-amethyst, #bp-root .bp-ruby-stage, #bp-root .bp-amethyst-sec, #bp-root .bp-ruby__stage, #bp-root .bp-amethyst__stage { display: flex !important; align-items: center !important; justify-content: center !important; width: auto !important; height: auto !important; min-width: 0 !important; min-height: 0 !important; margin: 0 auto !important; padding: 0 !important; background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; overflow: visible !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; } /* 2) Псевдо елементи — махаме всички декоративни кръгове/holder-и */ #bp-root .bp-ruby::before, #bp-root .bp-ruby::after, #bp-root .bp-amethyst::before, #bp-root .bp-amethyst::after, #bp-root .bp-ruby-stage::before, #bp-root .bp-ruby-stage::after, #bp-root .bp-amethyst-sec::before, #bp-root .bp-amethyst-sec::after, #bp-root .bp-ruby__stage::before, #bp-root .bp-ruby__stage::after, #bp-root .bp-amethyst__stage::before, #bp-root .bp-amethyst__stage::after, #bp-root .bp-ruby__gem::before, #bp-root .bp-ruby__gem::after, #bp-root .bp-amethyst__gem::before, #bp-root .bp-amethyst__gem::after { display: none !important; content: none !important; background: transparent !important; border: 0 !important; box-shadow: none !important; } /* 3) Всички orbit / ring / particle елементи — скриваме ги */ #bp-root .bp-ruby__orbit, #bp-root .bp-amethyst__orbit, #bp-root .bp-ruby__ring, #bp-root .bp-amethyst__ring, #bp-root .bp-ruby__particle, #bp-root .bp-amethyst__particle, #bp-root .bp-ruby__dot, #bp-root .bp-amethyst__dot, #bp-root .bp-ruby__glow, #bp-root .bp-amethyst__glow, #bp-root .bp-ruby__halo, #bp-root .bp-amethyst__halo, #bp-root .bp-ruby__spark, #bp-root .bp-amethyst__spark, #bp-root .bp-ruby__orbiter, #bp-root .bp-amethyst__orbiter { display: none !important; opacity: 0 !important; visibility: hidden !important; animation: none !important; transform: none !important; } /* 4) Самото изображение — оставяме само него */ #bp-root .bp-ruby__gem, #bp-root .bp-amethyst__gem { display: block !important; width: 220px !important; height: 220px !important; min-width: 220px !important; min-height: 220px !important; margin: 0 auto !important; padding: 0 !important; background-image: url("https://amicipizza.bg/wp-content/uploads/2026/05/ChatGPT-Image-May-22-2026-12_02_31-AM-Edited.png") !important; background-size: contain !important; background-position: center !important; background-repeat: no-repeat !important; background-color: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; filter: none !important; animation: none !important; transform: none !important; } /* Ако е сложено с , а не с background */ #bp-root .bp-ruby__gem img, #bp-root .bp-amethyst__gem img, #bp-root .bp-ruby img, #bp-root .bp-amethyst img { display: block !important; width: 220px !important; height: 220px !important; object-fit: contain !important; margin: 0 auto !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; background: transparent !important; } /* Mobile */ @media (max-width: 680px) { #bp-root .bp-ruby__gem, #bp-root .bp-amethyst__gem, #bp-root .bp-ruby__gem img, #bp-root .bp-amethyst__gem img, #bp-root .bp-ruby img, #bp-root .bp-amethyst img { width: 185px !important; height: 185px !important; min-width: 185px !important; min-height: 185px !important; } }/* ========================================================================== 🟣 LANDMARK: AMICI CTA GEM — ONLY IMAGE FINAL CLEAN FIX Маха wrapper квадратите, орбитите, окръжностите, точките и оставя само изображението. ========================================================================== */ /* 1) Главните секции остават само като позициониращ контейнер. */ #bp-root .bp-ruby-stage, #bp-root .bp-amethyst-sec { display: flex !important; align-items: center !important; justify-content: center !important; width: 100% !important; min-height: 230px !important; margin: 26px auto 34px !important; padding: 0 !important; background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; overflow: visible !important; } /* 2) Всички wrapper-и около изображението стават прозрачни и без размерна рамка. */ #bp-root .bp-rubywrap, #bp-root .bp-amethyst-shell, #bp-root .bp-amethyst-stage, #bp-root .bp-amethyst-wrap { display: flex !important; align-items: center !important; justify-content: center !important; width: auto !important; height: auto !important; min-width: 0 !important; min-height: 0 !important; margin: 0 auto !important; padding: 0 !important; background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; overflow: visible !important; transform: none !important; animation: none !important; } /* 3) Самите ruby/amethyst контейнери — само държат изображението. */ #bp-root .bp-ruby, #bp-root .bp-amethyst { display: flex !important; align-items: center !important; justify-content: center !important; width: 230px !important; height: 230px !important; min-width: 230px !important; min-height: 230px !important; margin: 0 auto !important; padding: 0 !important; background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; overflow: visible !important; transform: none !important; animation: none !important; } /* 4) Самото изображение — голямо и чисто. */ #bp-root .bp-ruby__gem, #bp-root .bp-amethyst__gem { display: block !important; width: 230px !important; height: 230px !important; min-width: 230px !important; min-height: 230px !important; margin: 0 auto !important; padding: 0 !important; background-image: url("https://amicipizza.bg/wp-content/uploads/2026/05/ChatGPT-Image-May-22-2026-12_02_31-AM-Edited.png") !important; background-size: contain !important; background-position: center !important; background-repeat: no-repeat !important; background-color: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; filter: none !important; clip-path: none !important; transform: none !important; animation: none !important; position: relative !important; z-index: 5 !important; } /* 5) Махаме реалните orbit/ring/spark елементи от HTML-а. */ #bp-root .bp-ruby-orbit, #bp-root .bp-ruby-orbit2, #bp-root .bp-ruby__spark, #bp-root .bp-ruby__ring, #bp-root .bp-amethyst-orbit, #bp-root .bp-amethyst-orbit2, #bp-root .bp-amethyst__spark, #bp-root .bp-amethyst__ring { display: none !important; opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; width: 0 !important; height: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important; transform: none !important; animation: none !important; } /* 6) Махаме всички псевдо-елементи, които рисуват квадрати/кръгове. */ #bp-root .bp-ruby-stage::before, #bp-root .bp-ruby-stage::after, #bp-root .bp-rubywrap::before, #bp-root .bp-rubywrap::after, #bp-root .bp-ruby::before, #bp-root .bp-ruby::after, #bp-root .bp-ruby__gem::before, #bp-root .bp-ruby__gem::after, #bp-root .bp-amethyst-sec::before, #bp-root .bp-amethyst-sec::after, #bp-root .bp-amethyst-shell::before, #bp-root .bp-amethyst-shell::after, #bp-root .bp-amethyst-stage::before, #bp-root .bp-amethyst-stage::after, #bp-root .bp-amethyst-wrap::before, #bp-root .bp-amethyst-wrap::after, #bp-root .bp-amethyst::before, #bp-root .bp-amethyst::after, #bp-root .bp-amethyst__gem::before, #bp-root .bp-amethyst__gem::after { display: none !important; content: none !important; opacity: 0 !important; visibility: hidden !important; background: transparent !important; border: 0 !important; box-shadow: none !important; transform: none !important; animation: none !important; } /* 7) Mobile размер. */ @media (max-width: 680px) { #bp-root .bp-ruby-stage, #bp-root .bp-amethyst-sec { min-height: 200px !important; margin: 22px auto 28px !important; } #bp-root .bp-ruby, #bp-root .bp-amethyst, #bp-root .bp-ruby__gem, #bp-root .bp-amethyst__gem { width: 190px !important; height: 190px !important; min-width: 190px !important; min-height: 190px !important; } } @media (max-width: 400px) { #bp-root .bp-ruby-stage, #bp-root .bp-amethyst-sec { min-height: 180px !important; } #bp-root .bp-ruby, #bp-root .bp-amethyst, #bp-root .bp-ruby__gem, #bp-root .bp-amethyst__gem { width: 170px !important; height: 170px !important; min-width: 170px !important; min-height: 170px !important; } } /* ========================================================================== 🟣 LANDMARK: AMICI TOP RUBY — MATCH BOTTOM CTA IMAGE Прави горния елемент 1:1 като долния: само изображение, без квадрат и орбити. ========================================================================== */ #bp-root .bp-ruby-stage { display: flex !important; align-items: center !important; justify-content: center !important; width: 100% !important; min-height: 300px !important; margin: 48px auto 52px !important; padding: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important; overflow: visible !important; } #bp-root .bp-rubywrap, #bp-root .bp-ruby { display: flex !important; align-items: center !important; justify-content: center !important; width: 300px !important; height: 300px !important; min-width: 300px !important; min-height: 300px !important; margin: 0 auto !important; padding: 0 !important; background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; overflow: visible !important; transform: none !important; animation: none !important; } #bp-root .bp-ruby__gem { display: block !important; width: 300px !important; height: 300px !important; min-width: 300px !important; min-height: 300px !important; margin: 0 auto !important; padding: 0 !important; background-image: url("https://amicipizza.bg/wp-content/uploads/2026/05/ChatGPT-Image-May-22-2026-12_02_31-AM-Edited.png") !important; background-size: 170% auto !important; background-position: center center !important; background-repeat: no-repeat !important; background-color: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; filter: none !important; clip-path: none !important; transform: none !important; animation: none !important; position: relative !important; z-index: 5 !important; } /* Махаме всички останали декорации около горния елемент. */ #bp-root .bp-ruby-orbit, #bp-root .bp-ruby-orbit2, #bp-root .bp-ruby__spark, #bp-root .bp-ruby__ring, #bp-root .bp-ruby-stage::before, #bp-root .bp-ruby-stage::after, #bp-root .bp-rubywrap::before, #bp-root .bp-rubywrap::after, #bp-root .bp-ruby::before, #bp-root .bp-ruby::after, #bp-root .bp-ruby__gem::before, #bp-root .bp-ruby__gem::after { display: none !important; content: none !important; opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; background: transparent !important; border: 0 !important; box-shadow: none !important; transform: none !important; animation: none !important; } @media (max-width: 680px) { #bp-root .bp-ruby-stage { min-height: 250px !important; margin: 34px auto 38px !important; } #bp-root .bp-rubywrap, #bp-root .bp-ruby, #bp-root .bp-ruby__gem { width: 240px !important; height: 240px !important; min-width: 240px !important; min-height: 240px !important; } } /* ========================================================================== LANDMARK: AMICI JACKPOT IMAGE — BIGGER ========================================================================== */ #bp-root .bp-ruby-stage { display: flex !important; align-items: center !important; justify-content: center !important; width: 100% !important; min-height: 520px !important; margin: 36px auto 48px !important; padding: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important; overflow: visible !important; } #bp-root .bp-rubywrap, #bp-root .bp-ruby { display: flex !important; align-items: center !important; justify-content: center !important; width: 460px !important; height: 460px !important; min-width: 460px !important; min-height: 460px !important; margin: 0 auto !important; padding: 0 !important; background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; overflow: visible !important; transform: none !important; animation: none !important; } #bp-root .bp-ruby__gem { display: block !important; width: 460px !important; height: 460px !important; min-width: 460px !important; min-height: 460px !important; margin: 0 auto !important; padding: 0 !important; background-image: url("https://amicipizza.bg/wp-content/uploads/2026/05/ChatGPT-Image-May-22-2026-12_02_31-AM-Edited.png") !important; background-size: contain !important; background-position: center center !important; background-repeat: no-repeat !important; background-color: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; filter: none !important; clip-path: none !important; transform: none !important; animation: none !important; position: relative !important; z-index: 5 !important; } /* Махаме всичко около него */ #bp-root .bp-ruby-orbit, #bp-root .bp-ruby-orbit2, #bp-root .bp-ruby__spark, #bp-root .bp-ruby__ring, #bp-root .bp-ruby-stage::before, #bp-root .bp-ruby-stage::after, #bp-root .bp-rubywrap::before, #bp-root .bp-rubywrap::after, #bp-root .bp-ruby::before, #bp-root .bp-ruby::after, #bp-root .bp-ruby__gem::before, #bp-root .bp-ruby__gem::after { display: none !important; content: none !important; opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; background: transparent !important; border: 0 !important; box-shadow: none !important; transform: none !important; animation: none !important; } @media (max-width: 680px) { #bp-root .bp-ruby-stage { min-height: 320px !important; margin: 24px auto 32px !important; } #bp-root .bp-rubywrap, #bp-root .bp-ruby, #bp-root .bp-ruby__gem { width: 280px !important; height: 280px !important; min-width: 280px !important; min-height: 280px !important; } }/* ========================================================================== 🟣 LANDMARK: AMICI REMOVE TOP JACKPOT IMAGE Скрива горния ruby/jackpot елемент и оставя само долния. ========================================================================== */ #bp-root .bp-ruby-stage { display: none !important; opacity: 0 !important; visibility: hidden !important; height: 0 !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; } /* 🟣 LANDMARK: HERO CTA BUTTONS — GOLD STANDARD */ #bp-root .bp-hero .bp-cta { margin-top: 18px !important; margin-left: 50% !important; margin-right: 0 !important; transform: translateX(-50%) !important; display: grid !important; grid-template-columns: 1fr !important; gap: 10px !important; padding: 0 !important; box-sizing: border-box !important; } #bp-root .bp-hero .bp-cta .btn { width: 100% !important; max-width: 100% !important; min-width: 0 !important; min-height: 50px !important; padding: 0 18px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; border-radius: 18px !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 12px !important; font-weight: 900 !important; line-height: 1 !important; letter-spacing: 0.085em !important; text-transform: uppercase !important; text-align: center !important; box-sizing: border-box !important; transition: transform 0.18s ease, box-shadow 0.18s ease, filter 0.18s ease, background 0.18s ease, border-color 0.18s ease !important; } /* 🟡 GOLD STANDARD — основният бутон */ #bp-root .bp-hero .bp-cta .ivh-btn-primary { color: #fff8ee !important; border: 1px solid rgba(255, 214, 140, 0.36) !important; background: linear-gradient( 135deg, #a94318 0%, #d85a28 22%, #f28b42 50%, #f7b85b 72%, #ffd98b 100% ) !important; box-shadow: inset 0 1px 0 rgba(255, 248, 230, 0.34), inset 0 -1px 0 rgba(120, 46, 10, 0.20), 0 10px 24px rgba(210, 92, 38, 0.26), 0 0 0 1px rgba(255, 214, 140, 0.18), 0 0 22px rgba(245, 168, 0, 0.18) !important; } #bp-root .bp-hero .bp-cta .ivh-btn-primary:hover { transform: translateY(-2px) !important; filter: brightness(1.04) saturate(1.04) !important; box-shadow: inset 0 1px 0 rgba(255, 250, 235, 0.40), inset 0 -1px 0 rgba(120, 46, 10, 0.22), 0 14px 30px rgba(210, 92, 38, 0.34), 0 0 0 1px rgba(255, 214, 140, 0.24), 0 0 28px rgba(245, 168, 0, 0.24) !important; } #bp-root .bp-hero .bp-cta .ivh-btn-primary:active { transform: translateY(0) scale(0.99) !important; } /* ⚪ Secondary premium buttons */ #bp-root .bp-hero .bp-cta .ivh-btn-secondary { color: rgba(247, 238, 224, 0.92) !important; border: 1px solid rgba(255, 236, 215, 0.12) !important; background: linear-gradient( 180deg, rgba(255, 255, 255, 0.06) 0%, rgba(255, 255, 255, 0.02) 100% ), linear-gradient( 135deg, rgba(48, 23, 28, 0.86) 0%, rgba(64, 28, 34, 0.82) 100% ) !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 8px 18px rgba(0, 0, 0, 0.18) !important; backdrop-filter: blur(10px) !important; -webkit-backdrop-filter: blur(10px) !important; } #bp-root .bp-hero .bp-cta .ivh-btn-secondary:hover { transform: translateY(-2px) !important; border-color: rgba(255, 236, 215, 0.18) !important; background: linear-gradient( 180deg, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0.03) 100% ), linear-gradient( 135deg, rgba(56, 26, 33, 0.90) 0%, rgba(74, 34, 40, 0.86) 100% ) !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 12px 24px rgba(0, 0, 0, 0.22) !important; } #bp-root .bp-hero .bp-cta .ivh-btn-secondary:active { transform: translateY(0) scale(0.99) !important; } /* броячът в бутона количка */ #bp-root .bp-hero .bp-cta .bp-count { min-width: 20px !important; height: 20px !important; margin-left: 7px !important; padding: 0 6px !important; border-radius: 999px !important; background: rgba(32, 12, 8, 0.72) !important; color: #ffd98b !important; font-size: 10px !important; font-weight: 900 !important; line-height: 20px !important; } /* ========================================================================== 🟣 LANDMARK: AMICI DESKTOP PICKUP GUIDE — 4 STEPS IN 2 ROWS Desktop: 4 стъпки = 2 колони × 2 реда ========================================================================== */ @media (min-width: 901px) { /* Целият блок да е центриран и подреден */ #bp-root .bp-hero-pickup-guide, #bp-root .bp-pickup-guide, #bp-root .pickup-guide { width: min(100%, 980px) !important; max-width: 980px !important; margin: 28px auto 0 !important; padding: 36px !important; box-sizing: border-box !important; border-radius: 34px !important; } /* Заглавната част */ #bp-root .pickup-title { margin: 0 0 22px !important; max-width: 100% !important; } /* 4 карти = 2 колони */ #bp-root .pickup-steps { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 18px !important; width: 100% !important; max-width: 100% !important; align-items: stretch !important; } /* Всяка карта */ #bp-root .pickup-steps .step { width: 100% !important; min-height: 138px !important; margin: 0 !important; box-sizing: border-box !important; display: grid !important; grid-template-columns: 64px 84px minmax(0, 1fr) !important; align-items: center !important; gap: 16px !important; padding: 20px 22px !important; border-radius: 26px !important; } /* Маха старо поведение някоя стъпка да заема цял ред */ #bp-root .pickup-steps .step:nth-child(3), #bp-root .pickup-steps .step:nth-child(4) { grid-column: auto !important; min-height: 138px !important; } /* Номерчето */ #bp-root .pickup-steps .step-num, #bp-root .pickup-steps .step-index, #bp-root .pickup-steps .num { width: 60px !important; height: 60px !important; font-size: 30px !important; display: flex !important; align-items: center !important; justify-content: center !important; } /* Иконката */ #bp-root .pickup-steps .step-icon, #bp-root .pickup-steps .icon { width: 84px !important; height: 84px !important; border-radius: 22px !important; display: flex !important; align-items: center !important; justify-content: center !important; overflow: hidden !important; } #bp-root .pickup-steps .step-icon img, #bp-root .pickup-steps .icon img { max-width: 72px !important; max-height: 72px !important; width: auto !important; height: auto !important; } /* Текстовете */ #bp-root .pickup-steps .step-title { font-size: 21px !important; line-height: 1.15 !important; margin: 0 0 6px !important; } #bp-root .pickup-steps .step-desc { font-size: 14px !important; line-height: 1.4 !important; margin: 0 !important; max-width: 100% !important; } } /* ========================================================================== 🟣 LANDMARK: AMICI HOW IT WORKS V3 — PICKUP + DELIVERY ========================================================================== */ #bp-root .bp-how-v3 { width: min(100%, 1320px) !important; margin: 0 auto 42px !important; padding: 0 clamp(10px, 2vw, 18px) !important; } #bp-root .bp-how-v3__shell { position: relative !important; overflow: hidden !important; padding: clamp(22px, 3vw, 38px) !important; border-radius: clamp(26px, 3vw, 38px) !important; background: radial-gradient(circle at 12% 8%, rgba(245, 168, 0, 0.13), transparent 34%), radial-gradient(circle at 92% 82%, rgba(192, 72, 48, 0.17), transparent 38%), linear-gradient(145deg, rgba(255,255,255,0.065), rgba(255,255,255,0.018)) !important; border: 1px solid rgba(255, 224, 185, 0.12) !important; box-shadow: 0 24px 70px rgba(0,0,0,0.34), inset 0 1px 0 rgba(255,255,255,0.06) !important; } #bp-root .bp-how-v3__shell::before { content: "" !important; position: absolute !important; inset: 0 !important; pointer-events: none !important; background: linear-gradient(90deg, rgba(255,255,255,0.04), transparent 26%, transparent 72%, rgba(255,255,255,0.025)), radial-gradient(circle at 50% 0%, rgba(255, 226, 170, 0.08), transparent 48%) !important; opacity: .9 !important; } #bp-root .bp-how-v3__head, #bp-root .bp-how-v3__grid, #bp-root .bp-how-v3__footer { position: relative !important; z-index: 2 !important; } #bp-root .bp-how-v3__head { display: flex !important; align-items: flex-start !important; justify-content: space-between !important; gap: 22px !important; margin-bottom: 24px !important; } #bp-root .bp-how-v3__kicker { margin-bottom: 8px !important; color: rgba(224, 188, 122, .95) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 11px !important; font-weight: 950 !important; letter-spacing: .18em !important; text-transform: uppercase !important; } #bp-root .bp-how-v3__title { margin: 0 !important; color: #fff7ea !important; font-family: "Oswald", "Nunito", system-ui, sans-serif !important; font-size: clamp(28px, 3.2vw, 52px) !important; font-weight: 900 !important; line-height: .98 !important; letter-spacing: -.035em !important; text-transform: uppercase !important; } #bp-root .bp-how-v3__meta { display: flex !important; flex-wrap: wrap !important; justify-content: flex-end !important; gap: 8px !important; max-width: 420px !important; } #bp-root .bp-how-v3__meta span { display: inline-flex !important; align-items: center !important; min-height: 34px !important; padding: 0 12px !important; border-radius: 999px !important; background: rgba(255,255,255,.055) !important; border: 1px solid rgba(255,255,255,.08) !important; color: rgba(255, 247, 234, .78) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 12px !important; font-weight: 900 !important; } #bp-root .bp-how-v3__grid { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 14px !important; } #bp-root .bp-how-v3__card { position: relative !important; min-height: 220px !important; display: grid !important; grid-template-rows: auto auto 1fr !important; gap: 12px !important; padding: 18px !important; border-radius: 24px !important; border: 1px solid rgba(255, 224, 185, 0.11) !important; background: radial-gradient(circle at 22% 0%, rgba(245, 168, 0, 0.12), transparent 35%), linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.025)) !important; box-shadow: 0 14px 34px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.055) !important; } #bp-root .bp-how-v3__num { width: 36px !important; height: 36px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; border-radius: 999px !important; background: linear-gradient(135deg, #f5d28b, #d99a43) !important; color: #1b080f !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 15px !important; font-weight: 950 !important; } #bp-root .bp-how-v3__icon { width: 58px !important; height: 58px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; border-radius: 20px !important; background: rgba(255, 255, 255, 0.06) !important; border: 1px solid rgba(255, 255, 255, 0.08) !important; font-size: 28px !important; } #bp-root .bp-how-v3__card h3 { margin: 0 0 8px !important; color: #fff7ea !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: clamp(16px, 1.2vw, 20px) !important; font-weight: 950 !important; line-height: 1.15 !important; } #bp-root .bp-how-v3__card p { margin: 0 !important; color: rgba(255, 247, 234, .62) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 13px !important; font-weight: 750 !important; line-height: 1.45 !important; } #bp-root .bp-how-v3__footer { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 16px !important; margin-top: 18px !important; } #bp-root .bp-how-v3__notice { flex: 1 !important; padding: 14px 16px !important; border-radius: 18px !important; background: rgba(90, 180, 110, 0.09) !important; border: 1px solid rgba(90, 180, 110, 0.18) !important; color: rgba(225, 255, 231, 0.84) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 13px !important; font-weight: 800 !important; line-height: 1.42 !important; } #bp-root .bp-how-v3__notice strong { color: #dfffe8 !important; } #bp-root .bp-how-v3__cta { min-height: 48px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; padding: 0 22px !important; border-radius: 16px !important; text-decoration: none !important; background: linear-gradient(135deg, #f5d28b, #d99a43) !important; color: #18070f !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 12px !important; font-weight: 950 !important; letter-spacing: .09em !important; text-transform: uppercase !important; box-shadow: 0 14px 32px rgba(217,154,67,.22), inset 0 1px 0 rgba(255,255,255,.35) !important; } /* ========================================================================== 🟣 AMICI HOW IT WORKS V3 — RESPONSIVE ========================================================================== */ @media (max-width: 1180px) { #bp-root .bp-how-v3__grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } #bp-root .bp-how-v3__card { min-height: 190px !important; } } @media (max-width: 760px) { #bp-root .bp-how-v3 { margin-bottom: 30px !important; } #bp-root .bp-how-v3__shell { padding: 18px !important; border-radius: 26px !important; } #bp-root .bp-how-v3__head { display: grid !important; gap: 14px !important; margin-bottom: 18px !important; } #bp-root .bp-how-v3__meta { justify-content: flex-start !important; max-width: 100% !important; } #bp-root .bp-how-v3__grid { grid-template-columns: 1fr !important; gap: 10px !important; } #bp-root .bp-how-v3__card { min-height: auto !important; grid-template-columns: 38px 52px minmax(0, 1fr) !important; grid-template-rows: auto !important; align-items: center !important; gap: 12px !important; padding: 14px !important; border-radius: 20px !important; } #bp-root .bp-how-v3__num { width: 34px !important; height: 34px !important; } #bp-root .bp-how-v3__icon { width: 48px !important; height: 48px !important; border-radius: 16px !important; font-size: 23px !important; } #bp-root .bp-how-v3__card h3 { font-size: 15px !important; margin-bottom: 5px !important; } #bp-root .bp-how-v3__card p { font-size: 12px !important; line-height: 1.35 !important; } #bp-root .bp-how-v3__footer { display: grid !important; gap: 10px !important; } #bp-root .bp-how-v3__cta { width: 100% !important; } } /* 🟣 LANDMARK: HIDE OLD PICKUP-ONLY GUIDE */ #bp-root .bp-hero-pickup-guide, #bp-root .pickup-guide { display: none !important; } /* ========================================================================== 🟣 LANDMARK: AMICI HOW IT WORKS V3 — COLLAPSIBLE MODE ========================================================================== */ #bp-root .bp-how-v3__summary { position: relative !important; z-index: 2 !important; width: 100% !important; display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 22px !important; padding: 0 !important; border: 0 !important; background: transparent !important; color: inherit !important; text-align: left !important; cursor: pointer !important; } #bp-root .bp-how-v3__summary-left { min-width: 0 !important; flex: 1 !important; } #bp-root .bp-how-v3__summary-right { display: grid !important; justify-items: end !important; gap: 12px !important; flex: 0 0 auto !important; } #bp-root .bp-how-v3__short { max-width: 62ch !important; margin: 12px 0 0 !important; color: rgba(255, 247, 234, .62) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 14px !important; font-weight: 750 !important; line-height: 1.45 !important; } #bp-root .bp-how-v3__toggle { min-height: 44px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 10px !important; padding: 0 14px !important; border-radius: 999px !important; background: rgba(245, 168, 0, 0.12) !important; border: 1px solid rgba(245, 168, 0, 0.26) !important; color: #ffd98b !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 12px !important; font-weight: 950 !important; letter-spacing: .07em !important; text-transform: uppercase !important; } #bp-root .bp-how-v3__toggle i { width: 24px !important; height: 24px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; border-radius: 999px !important; background: rgba(255,255,255,.10) !important; font-style: normal !important; font-size: 17px !important; line-height: 1 !important; } #bp-root .bp-how-v3__body { position: relative !important; z-index: 2 !important; margin-top: 24px !important; animation: bpHowOpen .18s ease both !important; } #bp-root .bp-how-v3.is-collapsed .bp-how-v3__shell { padding-top: clamp(20px, 2.5vw, 30px) !important; padding-bottom: clamp(20px, 2.5vw, 30px) !important; } #bp-root .bp-how-v3.is-collapsed { margin-bottom: 30px !important; } #bp-root .bp-how-v3.is-open { margin-bottom: 42px !important; } @keyframes bpHowOpen { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: translateY(0); } } /* Mobile */ @media (max-width: 760px) { #bp-root .bp-how-v3__summary { display: grid !important; gap: 16px !important; } #bp-root .bp-how-v3__summary-right { justify-items: stretch !important; width: 100% !important; } #bp-root .bp-how-v3__meta { justify-content: flex-start !important; } #bp-root .bp-how-v3__toggle { width: 100% !important; } #bp-root .bp-how-v3__short { font-size: 13px !important; line-height: 1.4 !important; } } /* ========================================================================== 🟣 LANDMARK: HERO ORDER BADGE — OPEN / CLOSED / LOADING ========================================================================== */ #bp-root #bp-hero-order-badge.is-loading { color: rgba(255, 247, 234, 0.72) !important; background: rgba(255, 255, 255, 0.07) !important; border-color: rgba(255, 255, 255, 0.12) !important; } #bp-root #bp-hero-order-badge.is-open { color: #dfffe8 !important; background: rgba(72, 190, 110, 0.14) !important; border-color: rgba(72, 190, 110, 0.30) !important; } #bp-root #bp-hero-order-badge.is-closed { color: #ffd3c7 !important; background: rgba(220, 70, 45, 0.14) !important; border-color: rgba(220, 70, 45, 0.30) !important; } /* ========================================================================== 🟣 LANDMARK: AMICI HERO COPY — PLAYFUL LUXURY PALETTE ========================================================================== */ #bp-root .amici-hero-copy { max-width: 720px !important; } #bp-root .amici-hero-kicker { display: inline-flex !important; align-items: center !important; margin-bottom: 16px !important; padding: 9px 13px !important; border-radius: 999px !important; border: 1px solid rgba(224, 188, 122, 0.22) !important; background: linear-gradient(135deg, rgba(224,188,122,.13), rgba(192,72,48,.08)) !important; color: #E0BC7A !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 11px !important; font-weight: 950 !important; letter-spacing: 0.18em !important; text-transform: uppercase !important; box-shadow: 0 10px 24px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.07) !important; } #bp-root .amici-hero-title { margin: 0 !important; color: #F5EAD8 !important; font-family: "Oswald", "Nunito", system-ui, sans-serif !important; font-size: clamp(48px, 6.5vw, 96px) !important; font-weight: 950 !important; line-height: 0.92 !important; letter-spacing: -0.055em !important; text-transform: uppercase !important; text-shadow: 0 7px 28px rgba(0,0,0,.34), 0 0 30px rgba(224,188,122,.045) !important; } #bp-root .amici-hero-title span { background: linear-gradient( 135deg, #FFE8B8 0%, #E0BC7A 32%, #F6A65C 58%, #C04830 100% ) !important; -webkit-background-clip: text !important; background-clip: text !important; -webkit-text-fill-color: transparent !important; filter: drop-shadow(0 8px 20px rgba(192,72,48,.14)) !important; } #bp-root .amici-hero-title em { font-style: normal !important; background: linear-gradient( 135deg, #F5EAD8 0%, #FFDFA6 38%, #E0BC7A 74%, #A86A32 100% ) !important; -webkit-background-clip: text !important; background-clip: text !important; -webkit-text-fill-color: transparent !important; } #bp-root .amici-hero-text { max-width: 58ch !important; margin: 22px 0 0 !important; color: rgba(245, 234, 216, 0.76) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: clamp(15px, 1.15vw, 18px) !important; font-weight: 780 !important; line-height: 1.56 !important; text-shadow: 0 5px 20px rgba(0,0,0,.24) !important; } #bp-root .amici-hero-text b { color: #FFD28A !important; font-weight: 950 !important; white-space: nowrap !important; } #bp-root .amici-hero-mini-flow { display: flex !important; flex-wrap: wrap !important; gap: 9px !important; margin-top: 20px !important; } #bp-root .amici-hero-mini-flow span { display: inline-flex !important; align-items: center !important; min-height: 36px !important; padding: 0 13px !important; border-radius: 999px !important; border: 1px solid rgba(255, 255, 255, 0.085) !important; background: linear-gradient(135deg, rgba(255,255,255,.075), rgba(255,255,255,.025)) !important; color: rgba(255, 247, 234, 0.84) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 12px !important; font-weight: 920 !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.06) !important; } #bp-root .amici-route-marquee { position: relative !important; width: 100% !important; overflow: hidden !important; isolation: isolate !important; min-height: 96px !important; margin: 42px 0 0 !important; padding: 12px 0 !important; border-radius: 28px !important; border: 1px solid rgba(245, 234, 216, .09) !important; background: linear-gradient(135deg, rgba(255,255,255,.055), rgba(255,255,255,.016)), linear-gradient(145deg, rgba(34,12,20,.96), rgba(7,3,6,.98)) !important; box-shadow: 0 30px 86px rgba(0,0,0,.62), 0 0 0 1px rgba(192,72,48,.10), inset 0 1px 0 rgba(255,255,255,.065) !important; } #bp-root .amici-route-marquee::after { content: ""; position: absolute !important; inset: 0 !important; z-index: 2 !important; pointer-events: none !important; background: linear-gradient(90deg, #070306 0%, rgba(7,3,6,.92) 7%, transparent 18%, transparent 82%, rgba(7,3,6,.92) 93%, #070306 100%), linear-gradient(0deg, rgba(255,255,255,.025), transparent 40%, transparent 60%, rgba(255,255,255,.018)) !important; } #bp-root .amici-route-marquee__top-line, #bp-root .amici-route-marquee__bottom-line { position: absolute !important; left: 0 !important; right: 0 !important; z-index: 1 !important; height: 3px !important; pointer-events: none !important; background: linear-gradient( 90deg, transparent 0%, rgba(192,72,48,.24) 16%, rgba(224,188,122,.72) 42%, rgba(125,187,255,.52) 68%, rgba(120,217,138,.48) 84%, transparent 100% ) !important; box-shadow: 0 0 20px rgba(224,188,122,.18), 0 0 36px rgba(192,72,48,.10) !important; } #bp-root .amici-route-marquee__top-line { top: 12px !important; } #bp-root .amici-route-marquee__bottom-line { bottom: 12px !important; } #bp-root .amici-route-marquee__rail { position: relative !important; z-index: 3 !important; display: flex !important; width: max-content !important; animation: amiciRouteMarqueeMove 28s linear infinite !important; will-change: transform !important; } #bp-root .amici-route-marquee:hover .amici-route-marquee__rail { animation-play-state: paused !important; } #bp-root .amici-route-marquee__group { display: flex !important; align-items: center !important; gap: 18px !important; padding-right: 18px !important; } #bp-root .amici-route-step { position: relative !important; display: inline-flex !important; align-items: center !important; gap: 11px !important; min-height: 68px !important; padding: 10px 16px 10px 11px !important; border-radius: 22px !important; border: 1px solid rgba(245,234,216,.09) !important; background: radial-gradient(circle at 18% 0%, rgba(224,188,122,.11), transparent 32%), linear-gradient(180deg, rgba(255,220,190,.052), rgba(255,200,170,.016)), rgba(255,255,255,.026) !important; box-shadow: 0 14px 34px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.06) !important; white-space: nowrap !important; } #bp-root .amici-route-step::before { content: ""; position: absolute !important; left: -10px !important; top: 50% !important; width: 10px !important; height: 10px !important; transform: translateY(-50%) !important; border-radius: 999px !important; background: var(--step-color, #e0bc7a) !important; box-shadow: 0 0 16px var(--step-glow, rgba(224,188,122,.46)) !important; } #bp-root .amici-route-step.is-choice { --step-color: #e0bc7a; --step-glow: rgba(224,188,122,.48); } #bp-root .amici-route-step.is-kitchen { --step-color: #ff744f; --step-glow: rgba(255,116,79,.44); } #bp-root .amici-route-step.is-ready { --step-color: #7dbbff; --step-glow: rgba(125,187,255,.42); } #bp-root .amici-route-step.is-delivery { --step-color: #78d98a; --step-glow: rgba(120,217,138,.42); } #bp-root .amici-route-step__icon { width: 44px !important; height: 44px !important; display: grid !important; place-items: center !important; flex: 0 0 auto !important; border-radius: 16px !important; border: 1px solid rgba(245,234,216,.11) !important; background: radial-gradient(circle at 34% 20%, rgba(255,255,255,.24), transparent 48%), linear-gradient(145deg, rgba(255,255,255,.070), rgba(255,255,255,.020)), rgba(10,0,5,.44) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.075), 0 10px 24px rgba(0,0,0,.22) !important; font-size: 21px !important; } #bp-root .amici-route-step__text { display: grid !important; gap: 4px !important; min-width: 0 !important; } #bp-root .amici-route-step__name { color: #f5ead8 !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 18px !important; font-style: italic !important; font-weight: 500 !important; line-height: 1 !important; } #bp-root .amici-route-step__sub { color: rgba(245,234,216,.62) !important; font-size: 11px !important; font-weight: 850 !important; line-height: 1.2 !important; letter-spacing: .04em !important; } #bp-root .amici-route-arrow { position: relative !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 54px !important; height: 2px !important; flex: 0 0 auto !important; background: linear-gradient(90deg, rgba(224,188,122,.20), rgba(224,188,122,.75), rgba(224,188,122,.20)) !important; box-shadow: 0 0 20px rgba(224,188,122,.22) !important; } #bp-root .amici-route-arrow::after { content: ""; position: absolute !important; right: -1px !important; top: 50% !important; width: 9px !important; height: 9px !important; transform: translateY(-50%) rotate(45deg) !important; border-top: 2px solid rgba(224,188,122,.78) !important; border-right: 2px solid rgba(224,188,122,.78) !important; } #bp-root .amici-route-marquee__comet { position: absolute !important; z-index: 4 !important; top: 14px !important; left: -32px !important; width: 18px !important; height: 18px !important; border-radius: 999px !important; background: radial-gradient(circle at 35% 30%, #ffffff, #e0bc7a 38%, rgba(224,188,122,.24) 68%, transparent 72%) !important; box-shadow: 0 0 18px rgba(224,188,122,.82), 0 0 42px rgba(192,72,48,.36) !important; pointer-events: none !important; animation: amiciRouteCometTop 4.8s ease-in-out infinite !important; } #bp-root .amici-route-marquee__comet::after { content: ""; position: absolute !important; right: 10px !important; top: 50% !important; width: 88px !important; height: 2px !important; transform: translateY(-50%) !important; background: linear-gradient(90deg, transparent, rgba(224,188,122,.60)) !important; filter: blur(.4px) !important; } #bp-root .amici-route-marquee__badge { position: absolute !important; right: 14px !important; top: 10px !important; z-index: 7 !important; display: inline-flex !important; align-items: center !important; gap: 7px !important; padding: 7px 10px !important; border-radius: 999px !important; color: rgba(245,234,216,.84) !important; border: 1px solid rgba(120,217,138,.18) !important; background: rgba(120,217,138,.060) !important; font-size: 10px !important; font-weight: 950 !important; letter-spacing: .12em !important; text-transform: uppercase !important; } #bp-root .amici-route-marquee__badge-dot { width: 7px !important; height: 7px !important; border-radius: 999px !important; background: #78d98a !important; box-shadow: 0 0 14px rgba(120,217,138,.60) !important; animation: amiciBadgePulse 1.8s ease-in-out infinite !important; } @keyframes amiciRouteMarqueeMove { from { transform: translate3d(0,0,0); } to { transform: translate3d(-50%,0,0); } } @keyframes amiciRouteCometTop { 0% { left: -32px; opacity: 0; } 12% { opacity: 1; } 82% { opacity: 1; } 100% { left: calc(100% + 32px); opacity: 0; } } @keyframes amiciBadgePulse { 0% { transform: scale(.88); box-shadow: 0 0 0 0 rgba(120,217,138,.34), 0 0 14px rgba(120,217,138,.60); } 70% { transform: scale(1); box-shadow: 0 0 0 8px rgba(120,217,138,0), 0 0 14px rgba(120,217,138,.60); } 100% { transform: scale(.88); box-shadow: 0 0 0 0 rgba(120,217,138,0), 0 0 14px rgba(120,217,138,.60); } } /* Mobile refinement */ @media (max-width: 680px) { #bp-root .amici-hero-kicker { margin-bottom: 13px !important; padding: 8px 11px !important; font-size: 10px !important; letter-spacing: 0.14em !important; } #bp-root .amici-hero-title { font-size: clamp(40px, 12vw, 62px) !important; line-height: 0.94 !important; letter-spacing: -0.045em !important; } #bp-root .amici-hero-text { margin-top: 16px !important; font-size: 14px !important; line-height: 1.45 !important; } #bp-root .amici-hero-mini-flow { margin-top: 15px !important; gap: 7px !important; } #bp-root .amici-hero-mini-flow span { min-height: 32px !important; padding: 0 10px !important; font-size: 11px !important; } #bp-root .amici-route-marquee { min-height: 86px !important; margin-top: 32px !important; border-radius: 22px !important; padding: 10px 0 !important; } #bp-root .amici-route-marquee__top-line { top: 10px !important; } #bp-root .amici-route-marquee__bottom-line { bottom: 10px !important; } #bp-root .amici-route-marquee__rail { animation-duration: 24s !important; } #bp-root .amici-route-marquee__group { gap: 14px !important; padding-right: 14px !important; } #bp-root .amici-route-step { min-height: 60px !important; padding: 9px 13px 9px 10px !important; border-radius: 19px !important; } #bp-root .amici-route-step__icon { width: 38px !important; height: 38px !important; border-radius: 14px !important; font-size: 18px !important; } #bp-root .amici-route-step__name { font-size: 15.5px !important; } #bp-root .amici-route-step__sub { font-size: 9px !important; } #bp-root .amici-route-arrow { width: 38px !important; } #bp-root .amici-route-marquee__badge { display: none !important; } } /* ========================================================================== 🟣 LANDMARK: AMICI HERO TITLE — SIZE REFINEMENT По-малък шрифт, без преплитане на буквите. ========================================================================== */ #bp-root .amici-hero-title { font-size: clamp(38px, 5.15vw, 76px) !important; line-height: 0.98 !important; letter-spacing: -0.038em !important; } #bp-root .amici-hero-title span, #bp-root .amici-hero-title em { letter-spacing: -0.035em !important; } /* Desktop refinement */ @media (min-width: 1024px) { #bp-root .amici-hero-title { font-size: clamp(52px, 5.4vw, 82px) !important; line-height: 0.97 !important; } } /* Tablet */ @media (max-width: 980px) { #bp-root .amici-hero-title { font-size: clamp(40px, 8.2vw, 64px) !important; line-height: 1 !important; letter-spacing: -0.032em !important; } } /* Mobile */ @media (max-width: 680px) { #bp-root .amici-hero-title { font-size: clamp(34px, 9.4vw, 48px) !important; line-height: 1.02 !important; letter-spacing: -0.025em !important; } } /* ========================================================================== 🟣 LANDMARK: SUCCESS MODAL — DELIVERY ADDRESS TEXT ========================================================================== */ #bp-root .bp-modal__delivery-address { display: inline-block; margin-top: 7px; color: rgba(245, 234, 216, 0.72); font-weight: 800; line-height: 1.35; } /* ========================================================================== 🟣 LANDMARK: MENU CATEGORIES — ICON RESTORE ========================================================================== */ #bp-root .bp-cat { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; } #bp-root .bp-cat__icon { display: inline-flex !important; align-items: center !important; justify-content: center !important; font-size: 20px !important; line-height: 1 !important; filter: drop-shadow(0 4px 8px rgba(0,0,0,.22)) !important; } #bp-root .bp-cat__text { display: inline-flex !important; align-items: center !important; line-height: 1 !important; } /* За активната категория иконата да изпъква малко повече */ #bp-root .bp-cat.is-active .bp-cat__icon { transform: translateY(-1px) scale(1.08) !important; } /* ========================================================================== 🟣 LANDMARK: CATEGORY TABS — HIDE SMALL DUPLICATE ICONS Остават само големите икони + надписите. ========================================================================== */ #bp-root .bp-cat__icon { display: none !important; } #bp-root .bp-cat__text { display: block !important; } /* ========================================================================== 🟣 LANDMARK: PLUS MODAL — FIXED LIKE CART, ALWAYS VISIBLE ========================================================================== */ #bp-root #bp-plus-modal.bp-plus-modal, #bp-root #bp-combo-modal.bp-plus-modal, #bp-root #bp-quick-offer-modal.bp-plus-modal { position: fixed !important; inset: 0 !important; z-index: 999999 !important; display: none !important; width: 100vw !important; height: 100dvh !important; min-height: 100vh !important; overflow: hidden !important; } #bp-root #bp-plus-modal.bp-plus-modal.is-open, #bp-root #bp-combo-modal.bp-plus-modal.is-open, #bp-root #bp-quick-offer-modal.bp-plus-modal.is-open { display: block !important; } #bp-root #bp-plus-modal .bp-plus-modal__ov, #bp-root #bp-combo-modal .bp-plus-modal__ov, #bp-root #bp-quick-offer-modal .bp-plus-modal__ov { position: fixed !important; inset: 0 !important; z-index: 1 !important; background: rgba(5, 0, 4, 0.78) !important; backdrop-filter: blur(12px) saturate(1.08) !important; -webkit-backdrop-filter: blur(12px) saturate(1.08) !important; } /* Desktop — centered fixed modal */ #bp-root #bp-plus-modal .bp-plus-modal__card, #bp-root #bp-combo-modal .bp-plus-modal__card, #bp-root #bp-quick-offer-modal .bp-plus-modal__card { position: fixed !important; z-index: 2 !important; top: 50% !important; left: 50% !important; right: auto !important; bottom: auto !important; width: min(640px, calc(100vw - 32px)) !important; max-height: calc(100dvh - 42px) !important; transform: translate(-50%, -50%) !important; overflow-y: auto !important; overflow-x: hidden !important; -webkit-overflow-scrolling: touch !important; border-radius: 28px !important; overscroll-behavior: contain !important; } /* Make plus modal header always reachable */ #bp-root #bp-plus-modal .bp-plus-modal__top, #bp-root #bp-combo-modal .bp-plus-modal__top, #bp-root #bp-quick-offer-modal .bp-plus-modal__top { position: sticky !important; top: 0 !important; z-index: 6 !important; margin: -22px -22px 14px !important; padding: 18px 22px 14px !important; background: linear-gradient(180deg, rgba(42, 18, 28, 0.98), rgba(28, 10, 17, 0.92)) !important; border-bottom: 1px solid rgba(245, 188, 110, 0.13) !important; backdrop-filter: blur(14px) !important; -webkit-backdrop-filter: blur(14px) !important; } /* Summary/action area should stay visible while choosing additions */ #bp-root #bp-plus-modal .bp-plus-actions, #bp-root #bp-combo-modal .bp-plus-actions, #bp-root #bp-quick-offer-modal .bp-plus-actions { position: sticky !important; bottom: -22px !important; z-index: 7 !important; margin: 14px -22px -22px !important; padding: 14px 22px calc(14px + env(safe-area-inset-bottom)) !important; background: linear-gradient(180deg, rgba(28, 10, 17, 0.84), rgba(16, 4, 9, 0.98)) !important; border-top: 1px solid rgba(245, 188, 110, 0.13) !important; backdrop-filter: blur(14px) !important; -webkit-backdrop-filter: blur(14px) !important; } /* ========================================================================== 🟣 LANDMARK: PLUS MODAL — MOBILE BOTTOM SHEET LIKE CART ========================================================================== */ @media (max-width: 760px) { #bp-root #bp-plus-modal .bp-plus-modal__card, #bp-root #bp-combo-modal .bp-plus-modal__card, #bp-root #bp-quick-offer-modal .bp-plus-modal__card { top: auto !important; left: 0 !important; right: 0 !important; bottom: 0 !important; width: 100vw !important; max-width: 100vw !important; height: min(92dvh, 760px) !important; max-height: 92dvh !important; padding: 18px !important; padding-bottom: calc(18px + env(safe-area-inset-bottom)) !important; transform: none !important; border-radius: 28px 28px 0 0 !important; animation: bpPlusSheetIn .20s cubic-bezier(.2,.8,.2,1) both !important; } #bp-root #bp-plus-modal .bp-plus-modal__top, #bp-root #bp-combo-modal .bp-plus-modal__top, #bp-root #bp-quick-offer-modal .bp-plus-modal__top { margin: -18px -18px 12px !important; padding: 16px 18px 12px !important; border-radius: 28px 28px 0 0 !important; } #bp-root #bp-plus-modal .bp-plus-actions, #bp-root #bp-combo-modal .bp-plus-actions, #bp-root #bp-quick-offer-modal .bp-plus-actions { margin: 12px -18px -18px !important; padding: 12px 18px calc(12px + env(safe-area-inset-bottom)) !important; } #bp-root #bp-plus-modal .bp-plus-modal__hero { grid-template-columns: 82px minmax(0, 1fr) !important; gap: 10px !important; padding: 10px !important; } #bp-root #bp-plus-modal .bp-plus-modal__hero img { width: 82px !important; height: 68px !important; } #bp-root #bp-plus-modal .bp-plus-modal__title, #bp-root #bp-combo-modal .bp-plus-modal__title, #bp-root #bp-quick-offer-modal .bp-plus-modal__title { font-size: 20px !important; } #bp-root #bp-plus-modal .bp-plus-modal__meta, #bp-root #bp-combo-modal .bp-plus-modal__meta, #bp-root #bp-quick-offer-modal .bp-plus-modal__meta { font-size: 12px !important; } } @keyframes bpPlusSheetIn { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: translateY(0); } } /* ========================================================================== 🟣 LANDMARK: PLUS MODAL — BODY FIXED OVERLAY FINAL Работи извън #bp-root, защото modal-ът се мести директно в document.body. ========================================================================== */ body > #bp-plus-modal.bp-plus-modal, body > #bp-combo-modal.bp-plus-modal, body > #bp-quick-offer-modal.bp-plus-modal { position: fixed !important; inset: 0 !important; z-index: 2147483000 !important; display: none !important; width: 100vw !important; height: 100dvh !important; min-height: 100vh !important; overflow: hidden !important; visibility: hidden !important; opacity: 0 !important; pointer-events: none !important; } body > #bp-plus-modal.bp-plus-modal.is-open, body > #bp-combo-modal.bp-plus-modal.is-open, body > #bp-quick-offer-modal.bp-plus-modal.is-open { display: block !important; visibility: visible !important; opacity: 1 !important; pointer-events: auto !important; } body > #bp-plus-modal .bp-plus-modal__ov, body > #bp-combo-modal .bp-plus-modal__ov, body > #bp-quick-offer-modal .bp-plus-modal__ov { position: fixed !important; inset: 0 !important; z-index: 1 !important; background: rgba(5, 0, 4, 0.78) !important; backdrop-filter: blur(12px) saturate(1.08) !important; -webkit-backdrop-filter: blur(12px) saturate(1.08) !important; } /* Desktop — центриран fixed modal */ body > #bp-plus-modal .bp-plus-modal__card, body > #bp-combo-modal .bp-plus-modal__card, body > #bp-quick-offer-modal .bp-plus-modal__card { position: fixed !important; z-index: 2 !important; top: 50% !important; left: 50% !important; right: auto !important; bottom: auto !important; width: min(640px, calc(100vw - 32px)) !important; max-height: calc(100dvh - 42px) !important; padding: 22px !important; overflow-y: auto !important; overflow-x: hidden !important; -webkit-overflow-scrolling: touch !important; transform: translate(-50%, -50%) !important; border-radius: 28px !important; border: 1px solid rgba(255, 224, 185, 0.12) !important; background: linear-gradient(180deg, rgba(255,255,255,0.06), rgba(255,255,255,0.018)), linear-gradient(145deg, #2a121c 0%, #12060d 58%, #1b0b12 100%) !important; box-shadow: 0 34px 90px rgba(0,0,0,.72), inset 0 1px 0 rgba(255,255,255,.07) !important; overscroll-behavior: contain !important; } /* Header винаги видим */ body > #bp-plus-modal .bp-plus-modal__top, body > #bp-combo-modal .bp-plus-modal__top, body > #bp-quick-offer-modal .bp-plus-modal__top { position: sticky !important; top: 0 !important; z-index: 6 !important; margin: -22px -22px 14px !important; padding: 18px 22px 14px !important; background: linear-gradient(180deg, rgba(42,18,28,.98), rgba(28,10,17,.92)) !important; border-bottom: 1px solid rgba(245,188,110,.13) !important; backdrop-filter: blur(14px) !important; -webkit-backdrop-filter: blur(14px) !important; } /* Долният бутон остава достижим */ body > #bp-plus-modal .bp-plus-actions, body > #bp-combo-modal .bp-plus-actions, body > #bp-quick-offer-modal .bp-plus-actions { position: sticky !important; bottom: -22px !important; z-index: 7 !important; margin: 14px -22px -22px !important; padding: 14px 22px calc(14px + env(safe-area-inset-bottom)) !important; background: linear-gradient(180deg, rgba(28,10,17,.84), rgba(16,4,9,.98)) !important; border-top: 1px solid rgba(245,188,110,.13) !important; backdrop-filter: blur(14px) !important; -webkit-backdrop-filter: blur(14px) !important; } /* Mobile — като количката, долен sheet */ @media (max-width: 760px) { body > #bp-plus-modal .bp-plus-modal__card, body > #bp-combo-modal .bp-plus-modal__card, body > #bp-quick-offer-modal .bp-plus-modal__card { top: auto !important; left: 0 !important; right: 0 !important; bottom: 0 !important; width: 100vw !important; max-width: 100vw !important; height: min(92dvh, 760px) !important; max-height: 92dvh !important; padding: 18px !important; padding-bottom: calc(18px + env(safe-area-inset-bottom)) !important; transform: none !important; border-radius: 28px 28px 0 0 !important; animation: bpPlusSheetIn .20s cubic-bezier(.2,.8,.2,1) both !important; } body > #bp-plus-modal .bp-plus-modal__top, body > #bp-combo-modal .bp-plus-modal__top, body > #bp-quick-offer-modal .bp-plus-modal__top { margin: -18px -18px 12px !important; padding: 16px 18px 12px !important; border-radius: 28px 28px 0 0 !important; } body > #bp-plus-modal .bp-plus-actions, body > #bp-combo-modal .bp-plus-actions, body > #bp-quick-offer-modal .bp-plus-actions { margin: 12px -18px -18px !important; padding: 12px 18px calc(12px + env(safe-area-inset-bottom)) !important; } } @keyframes bpPlusSheetIn { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: translateY(0); } } /* ========================================================================== 🟣 LANDMARK: PLUS MODAL — FINAL VISUAL POLISH Центриране, вътрешен въздух, бели текстове и по-премиум бутони. ========================================================================== */ /* 1) Модалът да има повече въздух отляво/отдясно и да не лепи в стената. */ body > #bp-plus-modal .bp-plus-modal__card { width: min(680px, calc(100vw - 36px)) !important; padding-left: 24px !important; padding-right: 24px !important; } /* Mobile — долният sheet да не е залепен визуално вляво. */ @media (max-width: 760px) { body > #bp-plus-modal .bp-plus-modal__card { left: 10px !important; right: 10px !important; bottom: 10px !important; width: auto !important; max-width: none !important; padding-left: 18px !important; padding-right: 18px !important; border-radius: 28px !important; } } /* 2) Всички основни текстове вътре да са светли. */ body > #bp-plus-modal, body > #bp-plus-modal * { color: rgba(255, 247, 234, 0.92); } body > #bp-plus-modal .bp-plus-modal__title, body > #bp-plus-modal .bp-plus-modal__hero-name, body > #bp-plus-modal .bp-plus-block__title, body > #bp-plus-modal .bp-plus-summary, body > #bp-plus-modal .bp-plus-summary strong { color: #fff7ea !important; } body > #bp-plus-modal .bp-plus-modal__meta, body > #bp-plus-modal .bp-plus-modal__hero-desc, body > #bp-plus-modal .bp-plus-mod__sub, body > #bp-plus-modal .bp-plus-summary span { color: rgba(255, 247, 234, 0.66) !important; } /* 3) Добавките да изглеждат като премиум cards, не като сурови бутони. */ body > #bp-plus-modal .bp-plus-mod { border-radius: 18px !important; border: 1px solid rgba(255, 224, 185, 0.11) !important; background: radial-gradient(circle at 12% 0%, rgba(224, 188, 122, 0.10), transparent 38%), linear-gradient(180deg, rgba(255,255,255,0.055), rgba(255,255,255,0.018)) !important; box-shadow: 0 12px 28px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.055) !important; } body > #bp-plus-modal .bp-plus-mod:hover { border-color: rgba(224, 188, 122, 0.28) !important; background: radial-gradient(circle at 12% 0%, rgba(224, 188, 122, 0.15), transparent 38%), linear-gradient(180deg, rgba(255,255,255,0.075), rgba(255,255,255,0.026)) !important; } /* 4) Имената на добавките — бели и четими. */ body > #bp-plus-modal .bp-plus-mod__name, body > #bp-plus-modal .bp-plus-mod b, body > #bp-plus-modal .bp-plus-mod strong { color: #fff7ea !important; font-weight: 950 !important; } /* 5) Цените — златисти, но не тъмни. */ body > #bp-plus-modal .bp-plus-mod__price, body > #bp-plus-modal .bp-plus-mod__eur, body > #bp-plus-modal .bp-plus-price { color: #ffd98b !important; font-weight: 950 !important; } /* 6) Бутоните 1x / 2x да не са с тъмни букви. */ body > #bp-plus-modal .bp-plus-mod button, body > #bp-plus-modal [data-plus-qty], body > #bp-plus-modal [data-plus-tab], body > #bp-plus-modal [data-plus-mode] { color: #fff7ea !important; border: 1px solid rgba(255, 224, 185, 0.13) !important; background: linear-gradient(180deg, rgba(255,255,255,0.07), rgba(255,255,255,0.025)) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 8px 18px rgba(0,0,0,.18) !important; } /* Активен/избран бутон. */ body > #bp-plus-modal .is-active, body > #bp-plus-modal [data-plus-qty].is-active, body > #bp-plus-modal [data-plus-tab].is-active, body > #bp-plus-modal [data-plus-mode].is-active { color: #1b080f !important; border-color: rgba(255, 224, 185, 0.28) !important; background: linear-gradient(135deg, #f5d28b 0%, #e0bc7a 42%, #cfa060 100%) !important; box-shadow: 0 12px 26px rgba(224,188,122,.22), inset 0 1px 0 rgba(255,255,255,.34) !important; } /* 7) Затварящият бутон да е центриран и видим. */ body > #bp-plus-modal .bp-plus-modal__x { color: #fff7ea !important; background: rgba(255,255,255,0.08) !important; border: 1px solid rgba(255,255,255,0.12) !important; } /* 8) Долният action bar да не изглежда залепен. */ body > #bp-plus-modal .bp-plus-actions { gap: 10px !important; padding-left: 24px !important; padding-right: 24px !important; } @media (max-width: 760px) { body > #bp-plus-modal .bp-plus-actions { padding-left: 18px !important; padding-right: 18px !important; } } /* ========================================================================== 🟣 LANDMARK: PLUS MODAL — CONTRAST RESTORE / PREMIUM FINAL Прави модала по-контрастен, не блед, и оправя долните бутони. ========================================================================== */ /* Целият sheet да е по-дълбок и контрастен */ body > #bp-plus-modal .bp-plus-modal__card { background: radial-gradient(circle at 20% 0%, rgba(192, 72, 48, 0.18), transparent 36%), radial-gradient(circle at 88% 72%, rgba(224, 188, 122, 0.10), transparent 34%), linear-gradient(145deg, #2b101c 0%, #160711 52%, #220b15 100%) !important; border-color: rgba(224, 188, 122, 0.22) !important; box-shadow: 0 34px 90px rgba(0,0,0,.82), 0 0 0 1px rgba(192,72,48,.16), inset 0 1px 0 rgba(255,255,255,.08) !important; } /* Header по-тъмен и ясен */ body > #bp-plus-modal .bp-plus-modal__top { background: linear-gradient(180deg, rgba(52, 18, 31, 0.98), rgba(25, 7, 15, 0.96)) !important; border-bottom: 1px solid rgba(224,188,122,.20) !important; } /* Заглавие и подзаглавие */ body > #bp-plus-modal .bp-plus-modal__title { color: #fff4df !important; text-shadow: 0 4px 18px rgba(0,0,0,.42) !important; } body > #bp-plus-modal .bp-plus-modal__meta { color: rgba(245, 234, 216, 0.70) !important; } /* Hero картата с пицата да не изглежда измита */ body > #bp-plus-modal .bp-plus-modal__hero { background: radial-gradient(circle at 18% 0%, rgba(224,188,122,.12), transparent 42%), linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.018)) !important; border: 1px solid rgba(224,188,122,.14) !important; box-shadow: 0 16px 36px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.06) !important; } body > #bp-plus-modal .bp-plus-modal__hero img { filter: saturate(1.08) contrast(1.06) brightness(1.02) !important; } /* Блокът Добавки да е по-четим */ body > #bp-plus-modal .bp-plus-block { background: linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.016)) !important; border: 1px solid rgba(224,188,122,.13) !important; box-shadow: 0 14px 34px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.045) !important; } body > #bp-plus-modal .bp-plus-block__title { color: #fff1d2 !important; letter-spacing: .14em !important; } /* Табовете: предпочитани, сирена, колбаси... */ body > #bp-plus-modal [data-plus-tab] { color: rgba(255,247,234,.90) !important; background: linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.026)) !important; border: 1px solid rgba(255,224,185,.16) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 8px 18px rgba(0,0,0,.22) !important; } body > #bp-plus-modal [data-plus-tab].is-active { color: #1a0710 !important; background: linear-gradient(135deg, #ffe6ad 0%, #e7bd70 42%, #c8893e 100%) !important; border-color: rgba(255,230,173,.42) !important; box-shadow: 0 12px 28px rgba(224,188,122,.28), inset 0 1px 0 rgba(255,255,255,.46) !important; } /* Добавката като card */ body > #bp-plus-modal .bp-plus-mod { background: radial-gradient(circle at 14% 0%, rgba(224,188,122,.10), transparent 42%), linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.022)) !important; border: 1px solid rgba(255,224,185,.14) !important; box-shadow: 0 12px 28px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.055) !important; } /* Имената на добавките */ body > #bp-plus-modal .bp-plus-mod__name, body > #bp-plus-modal .bp-plus-mod b, body > #bp-plus-modal .bp-plus-mod strong { color: #fff8eb !important; font-weight: 950 !important; } /* Описанието и грамажите */ body > #bp-plus-modal .bp-plus-mod__sub, body > #bp-plus-modal .bp-plus-mod small { color: rgba(255,247,234,.68) !important; } /* Цените */ body > #bp-plus-modal .bp-plus-mod__price, body > #bp-plus-modal .bp-plus-price { color: #ffd98b !important; font-weight: 950 !important; } /* Checkbox квадратчето да е по-видимо */ body > #bp-plus-modal .bp-plus-mod input[type="checkbox"], body > #bp-plus-modal .bp-plus-check { border-color: rgba(255,224,185,.34) !important; background: rgba(255,255,255,.06) !important; } /* 1x / 2x бутони */ body > #bp-plus-modal [data-plus-qty] { color: #fff7ea !important; background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.028)) !important; border: 1px solid rgba(255,224,185,.18) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 8px 18px rgba(0,0,0,.24) !important; } body > #bp-plus-modal [data-plus-qty].is-active { color: #1a0710 !important; background: linear-gradient(135deg, #ffe6ad 0%, #e0bc7a 46%, #c8893e 100%) !important; border-color: rgba(255,230,173,.42) !important; } /* Долният action bar — да не е блед */ body > #bp-plus-modal .bp-plus-actions { background: linear-gradient(180deg, rgba(31, 10, 18, 0.92), rgba(12, 2, 7, 0.98)) !important; border-top: 1px solid rgba(224,188,122,.20) !important; } /* Бутон Отказ — тъмен, не бял */ body > #bp-plus-modal #bp-plus-cancel, body > #bp-plus-modal .bp-plus-actions .ivh-btn-secondary { color: #fff7ea !important; background: linear-gradient(180deg, rgba(255,255,255,.085), rgba(255,255,255,.028)), rgba(28, 10, 17, 0.94) !important; border: 1px solid rgba(255,224,185,.18) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 12px 26px rgba(0,0,0,.26) !important; } /* Бутон Добави в количката — силен златен стандарт */ body > #bp-plus-modal #bp-plus-confirm, body > #bp-plus-modal .bp-plus-actions .ivh-btn-primary { color: #1b0710 !important; background: linear-gradient(135deg, #ffe6ad 0%, #e0bc7a 36%, #c8893e 72%, #9f5b25 100%) !important; border: 1px solid rgba(255,230,173,.42) !important; box-shadow: 0 16px 34px rgba(224,188,122,.28), 0 8px 22px rgba(192,72,48,.18), inset 0 1px 0 rgba(255,255,255,.48) !important; } /* Ако бутонът е disabled, пак да не става бял и невидим */ body > #bp-plus-modal #bp-plus-confirm:disabled, body > #bp-plus-modal .bp-plus-actions .ivh-btn-primary:disabled { opacity: .55 !important; color: rgba(27,7,16,.82) !important; filter: grayscale(.12) brightness(.92) !important; } /* Mobile — още малко въздух отстрани */ @media (max-width: 760px) { body > #bp-plus-modal .bp-plus-modal__card { left: 12px !important; right: 12px !important; bottom: 12px !important; width: auto !important; } body > #bp-plus-modal .bp-plus-actions { padding-top: 14px !important; } } /* ========================================================================== 🟣 LANDMARK: PLUS MODAL — BIG GOLD STANDARD ACTION BUTTONS Големи бутони за мобилно и десктоп. ========================================================================== */ body > #bp-plus-modal .bp-plus-actions { display: grid !important; grid-template-columns: 0.85fr 1.15fr !important; gap: 12px !important; padding: 18px 24px calc(18px + env(safe-area-inset-bottom)) !important; background: linear-gradient(180deg, rgba(34, 10, 18, 0.92), rgba(10, 2, 7, 0.99)) !important; border-top: 1px solid rgba(224, 188, 122, 0.22) !important; } /* Общ размер на двата бутона */ body > #bp-plus-modal .bp-plus-actions .btn, body > #bp-plus-modal .bp-plus-actions button, body > #bp-plus-modal #bp-plus-cancel, body > #bp-plus-modal #bp-plus-confirm { width: 100% !important; min-width: 0 !important; min-height: 62px !important; height: 62px !important; padding: 0 18px !important; border-radius: 22px !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 15px !important; font-weight: 1000 !important; letter-spacing: 0.09em !important; text-transform: uppercase !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; cursor: pointer !important; -webkit-tap-highlight-color: transparent !important; } /* Отказ — тъмен премиум бутон */ body > #bp-plus-modal #bp-plus-cancel, body > #bp-plus-modal .bp-plus-actions .ivh-btn-secondary { color: rgba(255, 247, 234, 0.92) !important; background: linear-gradient(180deg, rgba(255,255,255,.09), rgba(255,255,255,.028)), linear-gradient(135deg, rgba(50, 24, 34, 0.98), rgba(24, 8, 15, 0.98)) !important; border: 1px solid rgba(255, 224, 185, 0.18) !important; box-shadow: 0 14px 30px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.08) !important; } /* Добави в количката — ЗЛАТЕН СТАНДАРТ */ body > #bp-plus-modal #bp-plus-confirm, body > #bp-plus-modal .bp-plus-actions .ivh-btn-primary { color: #1a0710 !important; background: linear-gradient(135deg, #fff1bd 0%, #f3d486 24%, #d9a84e 52%, #a85f25 78%, #f2c76f 100% ) !important; border: 1px solid rgba(255, 238, 184, 0.58) !important; box-shadow: 0 18px 42px rgba(224,188,122,.34), 0 10px 26px rgba(192,72,48,.22), inset 0 1px 0 rgba(255,255,255,.58), inset 0 -1px 0 rgba(88, 42, 12, .18) !important; text-shadow: 0 1px 0 rgba(255,255,255,.25) !important; } /* Hover / active усещане */ body > #bp-plus-modal #bp-plus-confirm:hover, body > #bp-plus-modal .bp-plus-actions .ivh-btn-primary:hover { transform: translateY(-1px) !important; filter: brightness(1.04) saturate(1.06) !important; box-shadow: 0 22px 50px rgba(224,188,122,.42), 0 12px 30px rgba(192,72,48,.26), inset 0 1px 0 rgba(255,255,255,.64) !important; } body > #bp-plus-modal #bp-plus-cancel:hover, body > #bp-plus-modal .bp-plus-actions .ivh-btn-secondary:hover { transform: translateY(-1px) !important; filter: brightness(1.06) !important; } /* Disabled, но пак четим */ body > #bp-plus-modal #bp-plus-confirm:disabled, body > #bp-plus-modal .bp-plus-actions .ivh-btn-primary:disabled { opacity: 0.62 !important; filter: grayscale(.12) brightness(.92) !important; cursor: not-allowed !important; } /* Mobile — бутоните един под друг, още по-големи */ @media (max-width: 760px) { body > #bp-plus-modal .bp-plus-actions { grid-template-columns: 1fr !important; gap: 10px !important; padding: 14px 18px calc(16px + env(safe-area-inset-bottom)) !important; } body > #bp-plus-modal .bp-plus-actions .btn, body > #bp-plus-modal .bp-plus-actions button, body > #bp-plus-modal #bp-plus-cancel, body > #bp-plus-modal #bp-plus-confirm { min-height: 58px !important; height: 58px !important; border-radius: 20px !important; font-size: 14px !important; letter-spacing: 0.08em !important; } /* На мобилно първо да е златният action бутон */ body > #bp-plus-modal #bp-plus-confirm { order: 1 !important; } body > #bp-plus-modal #bp-plus-cancel { order: 2 !important; } } /* ========================================================================== 🟣 LANDMARK: SUCCESS MODAL — PROFESSIONAL HANDOFF CARD ========================================================================== */ #bp-root .bp-modal__pickup { padding: 0 !important; border: 0 !important; background: transparent !important; } #bp-root .bp-success-handoff { display: grid !important; grid-template-columns: 54px minmax(0, 1fr) !important; gap: 16px !important; align-items: flex-start !important; width: 100% !important; padding: 20px 22px !important; border-radius: 24px !important; border: 1px solid rgba(224, 188, 122, 0.30) !important; background: radial-gradient(circle at 10% 0%, rgba(224, 188, 122, 0.11), transparent 36%), linear-gradient(135deg, rgba(120, 45, 26, 0.38), rgba(32, 8, 14, 0.72)) !important; box-shadow: 0 14px 34px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.055) !important; } #bp-root .bp-success-handoff__icon { width: 54px !important; height: 54px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; border-radius: 18px !important; background: linear-gradient(180deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.025)) !important; border: 1px solid rgba(255, 224, 185, 0.13) !important; font-size: 26px !important; line-height: 1 !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 10px 24px rgba(0, 0, 0, 0.20) !important; } #bp-root .bp-success-handoff__content { min-width: 0 !important; display: grid !important; gap: 7px !important; } #bp-root .bp-success-handoff__title { color: #e0bc7a !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: clamp(18px, 2vw, 24px) !important; font-weight: 950 !important; line-height: 1.15 !important; } #bp-root .bp-success-handoff__desc { color: rgba(255, 247, 234, 0.88) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: clamp(16px, 1.7vw, 22px) !important; font-weight: 850 !important; line-height: 1.35 !important; } #bp-root .bp-success-handoff__address { margin-top: 6px !important; padding: 12px 14px !important; display: grid !important; gap: 4px !important; border-radius: 16px !important; border: 1px solid rgba(224, 188, 122, 0.20) !important; background: linear-gradient(180deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.018)) !important; } #bp-root .bp-success-handoff__address span { color: rgba(224, 188, 122, 0.92) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 12px !important; font-weight: 950 !important; letter-spacing: 0.10em !important; text-transform: uppercase !important; line-height: 1 !important; } #bp-root .bp-success-handoff__address strong { color: #fff7ea !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: clamp(15px, 1.5vw, 19px) !important; font-weight: 900 !important; line-height: 1.28 !important; word-break: break-word !important; } /* Mobile refinement */ @media (max-width: 680px) { #bp-root .bp-success-handoff { grid-template-columns: 42px minmax(0, 1fr) !important; gap: 12px !important; padding: 16px !important; border-radius: 20px !important; } #bp-root .bp-success-handoff__icon { width: 42px !important; height: 42px !important; border-radius: 14px !important; font-size: 22px !important; } #bp-root .bp-success-handoff__title { font-size: 18px !important; } #bp-root .bp-success-handoff__desc { font-size: 15px !important; line-height: 1.34 !important; } #bp-root .bp-success-handoff__address { padding: 10px 12px !important; border-radius: 14px !important; } #bp-root .bp-success-handoff__address strong { font-size: 14px !important; } } /* ========================================================================== 🟣 LANDMARK: DELIVERY ADDRESS BOOK — DELETE BUTTON ========================================================================== */ #bp-root .bp-saved-address-row { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 38px; gap: 8px; align-items: stretch; } #bp-root .bp-saved-address-row .bp-saved-address { min-width: 0; padding-right: 76px; } #bp-root .bp-saved-address-delete { width: 38px; min-width: 38px; height: auto; min-height: 64px; display: inline-flex; align-items: center; justify-content: center; border-radius: 15px; border: 1px solid rgba(255, 120, 100, 0.22); background: linear-gradient(180deg, rgba(255, 120, 100, 0.12), rgba(255, 120, 100, 0.045)); color: #ffd3c7; font-family: "Nunito", system-ui, sans-serif; font-size: 24px; font-weight: 950; line-height: 1; cursor: pointer; box-shadow: 0 10px 22px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.055); } #bp-root .bp-saved-address-delete:hover { color: #fff7ea; border-color: rgba(255, 120, 100, 0.42); background: linear-gradient(180deg, rgba(210, 62, 45, 0.34), rgba(120, 28, 24, 0.22)); } #bp-root .bp-saved-address-row--selected .bp-saved-address-delete { border-color: rgba(255, 120, 100, 0.28); } /* Mobile */ @media (max-width: 680px) { #bp-root .bp-saved-address-row { grid-template-columns: minmax(0, 1fr) 36px; gap: 7px; } #bp-root .bp-saved-address-delete { width: 36px; min-width: 36px; min-height: 62px; font-size: 22px; border-radius: 14px; } } /* 🟣 LANDMARK: CART DELIVERY ETA — HIDE */ #bp-root .bp-cart-delivery-note { display: none !important; } /* ========================================================================== LANDMARK: AMICI CATEGORIES - SHOW ONLY SELECTED CATEGORIES VISUALLY Показваме: Пици + Паста. Скриваме: Оферти, Десерти, Напитки. ========================================================================== */ #bp-root #bp-types .bp-cat[data-type], #bp-root .bp-cats .bp-cat[data-type] { display: none !important; } #bp-root #bp-types .bp-cat[data-type="Пици"], #bp-root #bp-types .bp-cat[data-type="Паста"], #bp-root .bp-cats .bp-cat[data-type="Пици"], #bp-root .bp-cats .bp-cat[data-type="Паста"] { display: flex !important; } #bp-root #bp-types, #bp-root .bp-cats { justify-content: center !important; } /* ========================================================================== 🟣 LANDMARK: AMICI FINAL MOBILE HERO + FULL BLEED ROUTE BAR FIX ========================================================================== */ /* 1) Стара движеща се лента — изключена напълно. */ #bp-root .bp-strip, #bp-root .bp-strip--parallax, #bp-root .bp-strip-inner { display: none !important; height: 0 !important; min-height: 0 !important; max-height: 0 !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; } /* 2) Защита от хоризонтално излизане. */ html, body { max-width: 100% !important; overflow-x: hidden !important; } #bp-root { width: 100% !important; max-width: 100vw !important; overflow-x: hidden !important; } /* 3) Hero mobile centering fix. */ @media (max-width: 680px) { #bp-root .bp-wrap { width: 100% !important; max-width: 100vw !important; margin: 0 auto !important; padding: 16px 12px 0 !important; overflow: hidden !important; box-sizing: border-box !important; } #bp-root .bp-hero { width: 100% !important; max-width: 100% !important; margin-left: auto !important; margin-right: auto !important; overflow: hidden !important; box-sizing: border-box !important; border-radius: 26px !important; transform: none !important; translate: none !important; } #bp-root .bp-hero__in { width: 100% !important; max-width: 100% !important; margin: 0 auto !important; overflow: hidden !important; box-sizing: border-box !important; } #bp-root .bp-hero__lux { width: 100% !important; max-width: 100% !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; grid-template-columns: 1fr !important; gap: 18px !important; min-height: auto !important; margin: 0 auto !important; padding: 22px 16px 26px !important; overflow: hidden !important; box-sizing: border-box !important; text-align: center !important; transform: none !important; translate: none !important; } #bp-root .bp-hero__left { width: 100% !important; max-width: 100% !important; display: flex !important; flex-direction: column !important; align-items: center !important; margin: 0 auto !important; text-align: center !important; box-sizing: border-box !important; } #bp-root .bp-hero__top { width: 100% !important; max-width: 100% !important; display: flex !important; align-items: center !important; justify-content: center !important; flex-wrap: wrap !important; gap: 10px !important; margin-left: auto !important; margin-right: auto !important; text-align: center !important; } #bp-root .bp-logo-area { flex: 0 1 auto !important; justify-content: center !important; width: auto !important; max-width: 100% !important; } #bp-root .bp-logo-slot { max-width: 100% !important; justify-content: center !important; text-align: center !important; } #bp-root .bp-hero-badge { margin-left: auto !important; margin-right: auto !important; align-self: center !important; } #bp-root .bp-pill { margin-left: auto !important; margin-right: auto !important; } #bp-root .bp-h1 { width: 100% !important; max-width: 100% !important; margin-left: auto !important; margin-right: auto !important; text-align: center !important; font-size: clamp(36px, 12vw, 52px) !important; line-height: 1.04 !important; overflow-wrap: normal !important; word-break: normal !important; } #bp-root .bp-lead { max-width: 34ch !important; margin-left: auto !important; margin-right: auto !important; text-align: center !important; } #bp-root .bp-cta { width: 100% !important; justify-content: center !important; align-items: center !important; } #bp-root .bp-cta .btn { flex: 1 1 100% !important; width: 100% !important; max-width: 320px !important; } #bp-root .bp-v4-stats { width: 100% !important; justify-content: center !important; margin-left: auto !important; margin-right: auto !important; } #bp-root .bp-ruby-stage, #bp-root .bp-amethyst-sec { max-width: 100vw !important; overflow: hidden !important; } } /* 4) Долна route лента — по-голяма, full-bleed, без заоблени краища. */ #bp-root .amici-route-marquee { position: relative !important; isolation: isolate !important; width: 100vw !important; max-width: 100vw !important; margin-left: calc(50% - 50vw) !important; margin-right: calc(50% - 50vw) !important; margin-top: 36px !important; margin-bottom: 34px !important; min-height: 122px !important; padding: 20px 0 !important; border-left: 0 !important; border-right: 0 !important; border-radius: 0 !important; overflow: hidden !important; box-sizing: border-box !important; background: radial-gradient(circle at 18% 0%, rgba(224, 188, 122, 0.12), transparent 34%), radial-gradient(circle at 82% 100%, rgba(192, 72, 48, 0.14), transparent 36%), linear-gradient(145deg, rgba(34, 12, 20, 0.98), rgba(7, 3, 6, 0.99)) !important; border-top: 1px solid rgba(224, 188, 122, 0.20) !important; border-bottom: 1px solid rgba(224, 188, 122, 0.20) !important; box-shadow: 0 26px 80px rgba(0, 0, 0, 0.52), inset 0 1px 0 rgba(255, 255, 255, 0.055), inset 0 -1px 0 rgba(255, 255, 255, 0.035) !important; } /* Без fade, който прави усещане за капсула/обли краища. */ #bp-root .amici-route-marquee::after { display: none !important; } /* Линиите горе и долу остават, но са full-width. */ #bp-root .amici-route-marquee__top-line, #bp-root .amici-route-marquee__bottom-line { left: 0 !important; right: 0 !important; height: 3px !important; border-radius: 0 !important; } #bp-root .amici-route-marquee__top-line { top: 12px !important; } #bp-root .amici-route-marquee__bottom-line { bottom: 12px !important; } /* Самите движещи се карти — по-едри. */ #bp-root .amici-route-marquee__rail { position: relative !important; z-index: 3 !important; display: flex !important; width: max-content !important; animation: amiciRouteMarqueeMove 30s linear infinite !important; will-change: transform !important; } #bp-root .amici-route-marquee:hover .amici-route-marquee__rail { animation-play-state: paused !important; } #bp-root .amici-route-marquee__group { display: flex !important; align-items: center !important; gap: 22px !important; padding-right: 22px !important; } #bp-root .amici-route-step { min-height: 78px !important; padding: 13px 20px 13px 13px !important; border-radius: 24px !important; border: 1px solid rgba(245, 234, 216, 0.10) !important; background: radial-gradient(circle at 18% 0%, rgba(224, 188, 122, 0.13), transparent 34%), linear-gradient(180deg, rgba(255, 220, 190, 0.060), rgba(255, 200, 170, 0.018)), rgba(255, 255, 255, 0.030) !important; box-shadow: 0 16px 38px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.065) !important; } #bp-root .amici-route-step__icon { width: 50px !important; height: 50px !important; border-radius: 18px !important; font-size: 24px !important; } #bp-root .amici-route-step__name { font-size: 20px !important; } #bp-root .amici-route-step__sub { font-size: 12px !important; line-height: 1.22 !important; letter-spacing: 0.025em !important; text-transform: none !important; } #bp-root .amici-route-arrow { width: 62px !important; } #bp-root .amici-route-marquee__badge { top: 14px !important; right: 18px !important; } /* Mobile за долната лента. */ @media (max-width: 680px) { #bp-root .amici-route-marquee { width: 100vw !important; max-width: 100vw !important; margin-left: calc(50% - 50vw) !important; margin-right: calc(50% - 50vw) !important; min-height: 108px !important; padding: 18px 0 !important; border-radius: 0 !important; } #bp-root .amici-route-marquee__rail { animation-duration: 24s !important; } #bp-root .amici-route-marquee__group { gap: 16px !important; padding-right: 16px !important; } #bp-root .amici-route-step { min-height: 70px !important; padding: 11px 16px 11px 11px !important; border-radius: 20px !important; } #bp-root .amici-route-step__icon { width: 44px !important; height: 44px !important; border-radius: 16px !important; font-size: 21px !important; } #bp-root .amici-route-step__name { font-size: 17px !important; } #bp-root .amici-route-step__sub { font-size: 10.5px !important; line-height: 1.18 !important; } #bp-root .amici-route-arrow { width: 42px !important; } #bp-root .amici-route-marquee__badge { display: none !important; } } /* ========================================================================== 🟣 LANDMARK: AMICI HERO CTA — RIGHT EDGE AIR FIX Цел: - бутоните да не залепват вдясно за панела. - на mobile да са центрирани и с въздух. - да не излизат извън екрана. ========================================================================== */ #bp-root .bp-hero .bp-cta, #bp-root .bp-hero .bp-hero-v3__actions { width: 100% !important; max-width: 100% !important; display: flex !important; align-items: center !important; justify-content: flex-start !important; flex-wrap: wrap !important; grid-template-columns: none !important; gap: 12px !important; margin-left: 0 !important; margin-right: 0 !important; padding-right: 18px !important; box-sizing: border-box !important; transform: none !important; translate: none !important; } #bp-root .bp-hero .bp-cta .btn, #bp-root .bp-hero .bp-hero-v3__actions .btn { box-sizing: border-box !important; } /* Desktop / tablet: оставяме ги вляво, но с въздух отдясно. */ @media (min-width: 681px) { #bp-root .bp-hero__left, #bp-root .bp-hero-v3__copy { padding-right: 24px !important; box-sizing: border-box !important; } #bp-root .bp-hero .bp-cta, #bp-root .bp-hero .bp-hero-v3__actions { padding-right: 24px !important; } } /* Mobile: центриране + никакво лепене в десния край. */ @media (max-width: 680px) { #bp-root .bp-hero__left, #bp-root .bp-hero-v3__copy { width: 100% !important; max-width: 100% !important; padding-left: 8px !important; padding-right: 8px !important; margin-left: auto !important; margin-right: auto !important; box-sizing: border-box !important; } #bp-root .bp-hero .bp-cta, #bp-root .bp-hero .bp-hero-v3__actions { width: 100% !important; max-width: 100% !important; display: flex !important; justify-content: center !important; align-items: center !important; grid-template-columns: none !important; padding-left: 8px !important; padding-right: 8px !important; margin-left: auto !important; margin-right: auto !important; box-sizing: border-box !important; transform: none !important; translate: none !important; } #bp-root .bp-hero .bp-cta .btn, #bp-root .bp-hero .bp-hero-v3__actions .btn { width: 100% !important; max-width: 320px !important; margin-left: auto !important; margin-right: auto !important; justify-content: center !important; text-align: center !important; box-sizing: border-box !important; } } /* Small mobile: още малко по-прибрано. */ @media (max-width: 400px) { #bp-root .bp-hero__left, #bp-root .bp-hero-v3__copy { padding-left: 6px !important; padding-right: 6px !important; } #bp-root .bp-hero .bp-cta, #bp-root .bp-hero .bp-hero-v3__actions { padding-left: 6px !important; padding-right: 6px !important; } #bp-root .bp-hero .bp-cta .btn, #bp-root .bp-hero .bp-hero-v3__actions .btn { max-width: 300px !important; } } /* ========================================================================== 🟣 LANDMARK: AMICI HOME MOBILE OVERFLOW — FINAL PATCH 2026 Fix: - спира хоризонталното излизане вдясно; - оправя отрязания badge "ОТВОРЕНО"; - прибира hero секцията в екрана; - стабилизира floating cart на мобилен. ========================================================================== */ /* 1) Глобално заключване срещу mobile overflow. */ html, body { width: 100% !important; max-width: 100% !important; overflow-x: hidden !important; } #bp-root, #bp-root .bp-wrap, #bp-root .bp-section, #bp-root .bp-hero, #bp-root .bp-hero *, #bp-root .bp-hero-v3, #bp-root .bp-hero-v3 * { box-sizing: border-box !important; } /* 2) Root и wrapper да не създават 100vw overflow. */ #bp-root { width: 100% !important; max-width: 100% !important; overflow-x: clip !important; } #bp-root .bp-wrap { width: 100% !important; max-width: 1180px !important; overflow: visible !important; } /* 3) Hero да не излиза вдясно. */ #bp-root .bp-hero, #bp-root .bp-hero.bp-hero-v3 { width: 100% !important; max-width: 100% !important; margin-left: auto !important; margin-right: auto !important; overflow: hidden !important; } /* 4) Topline: brand + "ОТВОРЕНО" badge да се събират правилно. */ #bp-root .bp-hero-v3__topline { width: 100% !important; max-width: 100% !important; min-width: 0 !important; display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 8px !important; overflow: visible !important; } #bp-root .bp-hero-v3__brand-kicker { min-width: 0 !important; max-width: calc(100% - 96px) !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; } /* 5) Badge "ОТВОРЕНО" — да не се реже вдясно. */ #bp-root .bp-hero-v3__status, #bp-root .bp-hero-top-badges, #bp-root .bp-hero-badge { flex: 0 0 auto !important; max-width: 118px !important; transform: none !important; translate: none !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; } /* 6) Отменяме стария агресивен mobile margin-top:-100px за badge-а. */ #bp-root .bp-hero-top-badges { margin-top: 0 !important; } /* 7) Floating cart — стабилно долу вдясно, без да бута страницата. */ #bp-floating-cart, body #bp-floating-cart, html body #bp-floating-cart, .bp-floating-cart, body .bp-floating-cart, html body .bp-floating-cart, #bp-root .bp-floating-cart, body #bp-root .bp-floating-cart, html body #bp-root .bp-floating-cart { position: fixed !important; right: max(14px, env(safe-area-inset-right, 0px)) !important; bottom: calc(24px + env(safe-area-inset-bottom, 0px)) !important; left: auto !important; top: auto !important; z-index: 2147482600 !important; transform: none !important; translate: none !important; } /* 8) Mobile финален фикс. */ @media (max-width: 680px) { #bp-root .bp-wrap { padding-left: 10px !important; padding-right: 10px !important; } #bp-root .bp-hero, #bp-root .bp-hero.bp-hero-v3 { width: 100% !important; max-width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; border-radius: 28px !important; } #bp-root .bp-hero.bp-hero-v3 { padding: 12px !important; } #bp-root .bp-hero-v3__content, #bp-root .bp-hero-v3__main, #bp-root .bp-hero-v3__copy, #bp-root .bp-hero-v3__visual { width: 100% !important; max-width: 100% !important; min-width: 0 !important; } #bp-root .bp-hero-v3__topline { padding: 0 !important; } #bp-root .bp-hero-v3__brand-kicker { max-width: calc(100vw - 150px) !important; font-size: 9.5px !important; letter-spacing: 0.12em !important; } #bp-root .bp-hero-v3__status, #bp-root .bp-hero-badge { max-width: 104px !important; min-height: 30px !important; padding: 0 9px !important; font-size: 9.5px !important; letter-spacing: 0.08em !important; } #bp-root .bp-hero-top-badges { margin-top: 0 !important; margin-right: 0 !important; right: auto !important; transform: none !important; } #bp-root .bp-hero-v3__visual { min-height: 238px !important; } #bp-floating-cart, body #bp-floating-cart, html body #bp-floating-cart, .bp-floating-cart, body .bp-floating-cart, html body .bp-floating-cart, #bp-root .bp-floating-cart, body #bp-root .bp-floating-cart, html body #bp-root .bp-floating-cart { right: max(12px, env(safe-area-inset-right, 0px)) !important; bottom: calc(22px + env(safe-area-inset-bottom, 0px)) !important; width: 58px !important; height: 58px !important; min-width: 58px !important; min-height: 58px !important; max-width: 58px !important; max-height: 58px !important; } } /* 9) Small iPhone. */ @media (max-width: 400px) { #bp-root .bp-wrap { padding-left: 8px !important; padding-right: 8px !important; } #bp-root .bp-hero.bp-hero-v3 { padding: 10px !important; border-radius: 24px !important; } #bp-root .bp-hero-v3__brand-kicker { max-width: calc(100vw - 132px) !important; font-size: 9px !important; letter-spacing: 0.10em !important; } #bp-root .bp-hero-v3__status, #bp-root .bp-hero-badge { max-width: 96px !important; min-height: 28px !important; padding: 0 8px !important; font-size: 9px !important; } #bp-root .bp-hero-v3__visual { min-height: 225px !important; } } /* ========================================================================== 🟣 LANDMARK: AMICI PASTA — FOOD TILE GRID ========================================================================== */ #bp-root #bp-grid.am-food-grid { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; grid-auto-flow: row !important; gap: 12px !important; align-items: start !important; overflow-x: visible !important; overflow-y: visible !important; padding: 8px 0 22px !important; scroll-snap-type: none !important; scroll-padding-left: 0 !important; } #bp-root #bp-grid.am-food-grid > .am-food-tile { position: relative !important; flex: none !important; width: auto !important; max-width: none !important; min-width: 0 !important; min-height: 265px !important; margin: 0 !important; padding: 10px !important; display: flex !important; flex-direction: column !important; border-radius: 22px !important; border: 1px solid rgba(220, 156, 104, 0.28) !important; background: linear-gradient(180deg, rgba(92, 12, 18, 0.96) 0%, rgba(36, 7, 12, 0.98) 100%) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,0.04), 0 10px 24px rgba(0,0,0,0.28) !important; overflow: hidden !important; scroll-snap-align: none !important; scroll-snap-stop: normal !important; transform-origin: center center !important; will-change: transform, filter, box-shadow !important; transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease !important; } #bp-root #bp-grid.am-food-grid > .am-food-tile:hover { transform: translateY(-4px) !important; border-color: rgba(245, 168, 0, 0.32) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,0.06), 0 16px 34px rgba(0,0,0,0.34) !important; } #bp-root #bp-grid.am-food-grid > .am-food-tile.is-unavailable { opacity: 0.82 !important; } #bp-root #bp-grid.am-food-grid .am-food-tile__image-wrap { height: 118px !important; margin-bottom: 10px !important; border-radius: 18px !important; overflow: hidden !important; background: rgba(255,255,255,0.03) !important; } #bp-root #bp-grid.am-food-grid .am-food-tile__image { width: 100% !important; height: 100% !important; aspect-ratio: auto !important; object-fit: cover !important; object-position: center !important; display: block !important; padding: 0 !important; background: transparent !important; } #bp-root #bp-grid.am-food-grid .am-food-tile__body { flex: 1 1 auto !important; min-height: 78px !important; } #bp-root #bp-grid.am-food-grid .am-food-tile__title { margin: 0 0 6px !important; min-height: 38px !important; color: #f6ddb0 !important; font-size: 18px !important; line-height: 1.08 !important; font-weight: 800 !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; } #bp-root #bp-grid.am-food-grid .am-food-tile__desc { margin: 0 !important; min-height: 30px !important; color: rgba(255,255,255,0.82) !important; font-size: 12px !important; line-height: 1.24 !important; font-weight: 700 !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; } #bp-root #bp-grid.am-food-grid .am-food-tile__cta { width: 100% !important; margin-top: 10px !important; padding: 10px 12px !important; border: 0 !important; border-radius: 18px !important; display: grid !important; grid-template-columns: 1fr auto !important; align-items: center !important; gap: 10px !important; background: linear-gradient(90deg, #b94f2b 0%, #82311f 100%) !important; color: #fff !important; cursor: pointer !important; transition: transform 0.14s ease, box-shadow 0.14s ease, filter 0.14s ease !important; } #bp-root #bp-grid.am-food-grid .am-food-tile__cta-left { display: flex !important; flex-direction: column !important; align-items: flex-start !important; min-width: 0 !important; } #bp-root #bp-grid.am-food-grid .am-food-tile__cta-left strong { font-size: 15px !important; line-height: 1 !important; text-transform: uppercase !important; letter-spacing: 0.04em !important; } #bp-root #bp-grid.am-food-grid .am-food-tile__cta-left small { margin-top: 4px !important; font-size: 11px !important; color: rgba(255,255,255,0.78) !important; } #bp-root #bp-grid.am-food-grid .am-food-tile__cta-right { display: flex !important; flex-direction: column !important; align-items: flex-end !important; } #bp-root #bp-grid.am-food-grid .am-food-tile__cta-right strong { font-size: 24px !important; line-height: 1 !important; color: #ffd37f !important; font-weight: 900 !important; } #bp-root #bp-grid.am-food-grid .am-food-tile__cta-right small { margin-top: 4px !important; font-size: 11px !important; color: rgba(255,255,255,0.78) !important; } #bp-root #bp-grid.am-food-grid .am-food-tile__cta:active, #bp-root #bp-grid.am-food-grid .am-food-tile__cta.is-in-cart { transform: scale(0.985) !important; box-shadow: inset 0 0 0 2px rgba(255, 224, 154, 0.18) !important; } #bp-root #bp-grid.am-food-grid .am-food-tile__cta.is-disabled, #bp-root #bp-grid.am-food-grid .am-food-tile__cta:disabled { opacity: 0.56 !important; cursor: not-allowed !important; filter: grayscale(0.16) brightness(0.88) !important; } /* ========================================================================== 🟣 LANDMARK: AMICI PASTA — ADDED FEEDBACK ========================================================================== */ #bp-root #bp-grid.am-food-grid > .am-food-tile.is-added { animation: amiciDrinkAddedPulse 0.72s cubic-bezier(.2,.9,.2,1) both !important; border-color: rgba(245, 168, 0, 0.72) !important; box-shadow: 0 0 0 1px rgba(245, 168, 0, 0.28), 0 0 34px rgba(245, 168, 0, 0.42), 0 18px 42px rgba(10, 0, 5, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.16) !important; filter: brightness(1.16) saturate(1.12) !important; } #bp-root #bp-grid.am-food-grid > .am-food-tile::after { content: "Добавено" !important; position: absolute !important; left: 50% !important; bottom: 9px !important; z-index: 8 !important; transform: translateX(-50%) translateY(10px) scale(0.92) !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; min-height: 24px !important; padding: 0 9px !important; border-radius: 999px !important; color: #180B13 !important; background: linear-gradient(135deg, #F5A800, #FFE0A0) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 10px !important; font-weight: 950 !important; line-height: 1 !important; letter-spacing: 0.04em !important; text-transform: uppercase !important; opacity: 0 !important; pointer-events: none !important; box-shadow: 0 10px 24px rgba(245, 168, 0, 0.26), inset 0 1px 0 rgba(255, 255, 255, 0.32) !important; } #bp-root #bp-grid.am-food-grid > .am-food-tile.is-added::after { animation: amiciDrinkAddedBadge 0.72s cubic-bezier(.2,.9,.2,1) both !important; } #bp-root #bp-grid.am-food-grid > .am-food-tile.is-added .am-food-tile__image-wrap { animation: amiciDrinkImagePop 0.72s cubic-bezier(.2,.9,.2,1) both !important; box-shadow: 0 0 26px rgba(245, 168, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.14) !important; } @keyframes amiciDrinkAddedPulse { 0% { transform: scale(1) rotate(0deg); } 12% { transform: scale(1.045) rotate(-1.3deg); } 24% { transform: scale(0.985) rotate(1.25deg); } 36% { transform: scale(1.03) rotate(-0.9deg); } 50% { transform: scale(1.01) rotate(0.7deg); } 72% { transform: scale(1.018) rotate(0deg); } 100% { transform: scale(1) rotate(0deg); } } @keyframes amiciDrinkAddedBadge { 0% { opacity: 0; transform: translateX(-50%) translateY(12px) scale(0.88); } 18% { opacity: 1; transform: translateX(-50%) translateY(0) scale(1.04); } 68% { opacity: 1; transform: translateX(-50%) translateY(0) scale(1); } 100% { opacity: 0; transform: translateX(-50%) translateY(-8px) scale(0.96); } } @keyframes amiciDrinkImagePop { 0% { transform: scale(1); } 22% { transform: scale(1.08); } 48% { transform: scale(0.98); } 100% { transform: scale(1); } } @media (max-width: 680px) { #bp-root #bp-grid.am-food-grid { gap: 10px !important; padding: 6px 0 18px !important; } } @media (max-width: 380px) { #bp-root #bp-grid.am-food-grid { gap: 10px !important; } #bp-root #bp-grid.am-food-grid > .am-food-tile { min-height: 252px !important; padding: 9px !important; } #bp-root #bp-grid.am-food-grid .am-food-tile__image-wrap { height: 108px !important; } #bp-root #bp-grid.am-food-grid .am-food-tile__title { font-size: 17px !important; } #bp-root #bp-grid.am-food-grid .am-food-tile__cta-right strong { font-size: 22px !important; } } @media (prefers-reduced-motion: reduce) { #bp-root #bp-grid.am-food-grid > .am-food-tile.is-added, #bp-root #bp-grid.am-food-grid > .am-food-tile.is-added::after, #bp-root #bp-grid.am-food-grid > .am-food-tile.is-added .am-food-tile__image-wrap { animation-duration: 0.18s !important; } } /* ========================================================================== 🟣 LANDMARK: AMICI PASTA — DESKTOP FULL IMAGE OVERRIDE ========================================================================== */ @media (min-width: 1024px) { #bp-root #bp-grid.am-food-grid .am-food-tile__image-wrap { height: 220px !important; display: flex !important; align-items: center !important; justify-content: center !important; overflow: hidden !important; padding: 8px !important; background: transparent !important; } #bp-root #bp-grid.am-food-grid .am-food-tile__image { width: 100% !important; height: 100% !important; object-fit: contain !important; object-position: center !important; display: block !important; } } /* ========================================================================== 🟣 LANDMARK: AMICI PIZZAS + PASTA — COMPACT FOOD APP TILES FINAL Цел: - пиците да са като пастите; - 2 колони на desktop/tablet/mobile; - 4 продукта да се виждат по-практично; - снимка, име, състав, добави, цена; - без огромни празни карти и без хоризонтален slider. ========================================================================== */ /* Grid за храна — пици и паста */ html body #bp-root #bp-grid:not(.bp-grid--drinks) { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 14px !important; width: 100% !important; max-width: 100% !important; overflow-x: visible !important; overflow-y: visible !important; padding: 8px 2px 22px !important; scroll-snap-type: none !important; scroll-padding-left: 0 !important; } /* Самата карта — компактна food tile */ html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p { position: relative !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; flex: unset !important; flex-basis: auto !important; min-height: 372px !important; height: auto !important; max-height: none !important; display: flex !important; flex-direction: column !important; margin: 0 !important; padding: 12px !important; border-radius: 26px !important; overflow: hidden !important; scroll-snap-align: unset !important; scroll-snap-stop: normal !important; border: 1px solid rgba(224, 188, 122, 0.22) !important; background: radial-gradient(circle at 50% 0%, rgba(192, 72, 48, 0.20), transparent 42%), linear-gradient(180deg, rgba(86, 10, 18, 0.96), rgba(35, 7, 13, 0.98)) !important; box-shadow: 0 14px 34px rgba(10, 0, 5, 0.34), inset 0 1px 0 rgba(255, 235, 210, 0.07) !important; } /* Снимка — цяла, без рязане, като food icon/card */ html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p > img, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-img, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-product-img, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-img-burger-full, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-offer-img { width: 100% !important; height: 150px !important; min-height: 150px !important; max-height: 150px !important; display: block !important; object-fit: contain !important; object-position: center center !important; padding: 4px !important; margin: 0 0 10px !important; transform: none !important; border-radius: 20px !important; background: radial-gradient(circle at 50% 45%, rgba(224, 188, 122, 0.10), transparent 48%), linear-gradient(145deg, rgba(90, 5, 20, 0.92), rgba(34, 5, 12, 0.96)) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,0.06), 0 10px 24px rgba(0,0,0,0.22) !important; } /* Съдържание */ html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .b { flex: 1 1 auto !important; display: flex !important; flex-direction: column !important; min-height: 0 !important; padding: 0 !important; } /* Име */ html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p h4 { margin: 0 0 7px !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: clamp(18px, 2vw, 24px) !important; font-style: normal !important; font-weight: 950 !important; line-height: 1.08 !important; letter-spacing: -0.015em !important; color: #FFE0A0 !important; text-shadow: none !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; min-height: 39px !important; } /* Състав */ html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p p { margin: 0 !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 13px !important; font-weight: 850 !important; line-height: 1.28 !important; color: rgba(245, 234, 216, 0.74) !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; min-height: 34px !important; } /* Махаме раздуващи допълнителни текстове */ html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-flavor { display: none !important; } /* Бутоните долу */ html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-row2, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-amici-actions { margin-top: auto !important; padding-top: 12px !important; border-top: 1px solid rgba(245, 234, 216, 0.07) !important; } /* Само основният бутон да изглежда като практичен food tile бутон */ html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-amici-order-btn, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-add2 { width: 100% !important; min-height: 62px !important; display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; align-items: center !important; gap: 10px !important; padding: 11px 13px !important; border-radius: 18px !important; border: 1px solid rgba(224, 188, 122, 0.22) !important; background: linear-gradient(90deg, rgba(186, 75, 39, 0.96), rgba(126, 45, 28, 0.98)) !important; box-shadow: 0 10px 24px rgba(10, 0, 5, 0.26), inset 0 1px 0 rgba(255,255,255,0.10) !important; text-align: left !important; } /* Ако пиците имат втори бутон за добавки — скриваме го за compact режима */ html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-amici-order-btn--plus, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-plus-btn { display: none !important; } /* Скриваме фамилен размер */ html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-add2.is-family, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-plus-btn.is-family-plus, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-fav-split--family { display: none !important; } /* Текст в бутона */ html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-amici-order-btn__label, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-add2__tag { font-family: "Nunito", system-ui, sans-serif !important; font-size: 15px !important; font-weight: 950 !important; line-height: 1 !important; letter-spacing: 0.055em !important; text-transform: uppercase !important; color: #FFFFFF !important; } html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-amici-order-btn__sub, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-add2__size-note { margin-top: 5px !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 11px !important; font-weight: 800 !important; line-height: 1.1 !important; color: rgba(255,255,255,0.76) !important; } /* Цена */ html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-amici-order-btn__price span, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-add2__eur { font-family: "Nunito", system-ui, sans-serif !important; font-size: 25px !important; font-style: normal !important; font-weight: 950 !important; line-height: 1 !important; color: #FFE08A !important; } html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-amici-order-btn__price small, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-add2__bgn { margin-top: 5px !important; font-size: 11px !important; font-weight: 850 !important; color: rgba(255,255,255,0.72) !important; } /* Desktop — малко по-широки и снимките цели */ @media (min-width: 1024px) { html body #bp-root #bp-grid:not(.bp-grid--drinks) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 16px !important; } html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p { min-height: 385px !important; padding: 14px !important; } html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p > img, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-img, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-product-img, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-img-burger-full, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-offer-img { height: 170px !important; min-height: 170px !important; max-height: 170px !important; object-fit: contain !important; } } /* Mobile — 2 колони, 4 продукта да се виждат практично */ @media (max-width: 680px) { html body #bp-root #bp-grid:not(.bp-grid--drinks) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px !important; padding: 6px 0 18px !important; } html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p { min-height: 292px !important; padding: 9px !important; border-radius: 21px !important; } html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p > img, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-img, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-product-img, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-img-burger-full, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-offer-img { height: 104px !important; min-height: 104px !important; max-height: 104px !important; border-radius: 16px !important; padding: 2px !important; margin-bottom: 8px !important; object-fit: contain !important; transform: none !important; } html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p h4 { font-size: 14.5px !important; line-height: 1.08 !important; min-height: 32px !important; margin-bottom: 5px !important; } html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p p { font-size: 10.8px !important; line-height: 1.22 !important; min-height: 27px !important; -webkit-line-clamp: 2 !important; line-clamp: 2 !important; } html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-row2, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-amici-actions { padding-top: 8px !important; } html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-amici-order-btn, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-add2 { min-height: 54px !important; padding: 9px 10px !important; border-radius: 15px !important; } html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-amici-order-btn__label, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-add2__tag { font-size: 12px !important; } html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-amici-order-btn__sub, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-add2__size-note { font-size: 9.5px !important; } html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-amici-order-btn__price { min-width: 54px !important; padding-left: 8px !important; } html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-amici-order-btn__price span, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-add2__eur { font-size: 18px !important; } html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-amici-order-btn__price small, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-add2__bgn { font-size: 9px !important; } } /* Много малки телефони */ @media (max-width: 380px) { html body #bp-root #bp-grid:not(.bp-grid--drinks) { gap: 9px !important; } html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p { min-height: 282px !important; padding: 8px !important; } html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p > img, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-img, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-product-img, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-img-burger-full, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-offer-img { height: 96px !important; min-height: 96px !important; max-height: 96px !important; } } /* ========================================================================== 🟣 LANDMARK: AMICI FOOD TILES — BIGGER IMAGES FOR PIZZA + PASTA Цел: - пиците и пастите остават 2 на ред; - снимките стават по-големи; - desktop снимките се виждат цели; - mobile остава compact, но с по-апетитна голяма снимка. ========================================================================== */ /* BASE — всички food карти без напитките */ html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p > img, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-img, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-product-img, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-img-burger-full, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-offer-img { height: 190px !important; min-height: 190px !important; max-height: 190px !important; object-fit: contain !important; object-position: center center !important; padding: 4px !important; margin-bottom: 12px !important; } /* Картата леко по-висока, за да не се смачква текстът */ html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p { min-height: 410px !important; } /* Desktop — още по-големи и цели снимки */ @media (min-width: 1024px) { html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p { min-height: 435px !important; } html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p > img, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-img, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-product-img, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-img-burger-full, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-offer-img { height: 230px !important; min-height: 230px !important; max-height: 230px !important; object-fit: contain !important; object-position: center center !important; } } /* Mobile — запазваме 2 на ред, но снимките стават по-големи */ @media (max-width: 680px) { html body #bp-root #bp-grid:not(.bp-grid--drinks) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px !important; } html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p { min-height: 325px !important; padding: 9px !important; } html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p > img, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-img, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-product-img, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-img-burger-full, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-offer-img { height: 135px !important; min-height: 135px !important; max-height: 135px !important; object-fit: contain !important; object-position: center center !important; padding: 2px !important; margin-bottom: 9px !important; border-radius: 16px !important; } } /* Малки телефони — пак 2 на ред, но да не избухва височината */ @media (max-width: 380px) { html body #bp-root #bp-grid:not(.bp-grid--drinks) { gap: 9px !important; } html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p { min-height: 312px !important; padding: 8px !important; } html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p > img, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-img, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-product-img, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-img-burger-full, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-offer-img { height: 124px !important; min-height: 124px !important; max-height: 124px !important; } } /* ========================================================================== 🟣 LANDMARK: AMICI FOOD TILES — RESTORE ADDONS BUTTON Цел: - връща бутона за добавки при пици/паста; - запазва compact food layout; - пиците и пастите остават 2 на ред на мобилно. ========================================================================== */ html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-amici-order-btn--plus, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-plus-btn { display: grid !important; } /* Двата бутона да стоят един под друг компактно */ html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-amici-actions, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-adds, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-plus-duo { display: grid !important; grid-template-columns: 1fr !important; gap: 8px !important; width: 100% !important; } /* Бутонът за добавки да е малко по-нисък, за да не раздува картата прекалено */ html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-amici-order-btn--plus { min-height: 54px !important; opacity: 0.96 !important; } /* Вътрешното плюс кръгче */ html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-amici-order-btn__plus { width: 34px !important; height: 34px !important; font-size: 21px !important; } /* Mobile — добавките се връщат, но остават компактни */ @media (max-width: 680px) { html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p { min-height: 365px !important; } html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-amici-actions, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-adds, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-plus-duo { gap: 6px !important; } html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-amici-order-btn--plus { min-height: 48px !important; padding: 8px 10px !important; } html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p .bp-amici-order-btn__plus { width: 30px !important; height: 30px !important; font-size: 19px !important; } } @media (max-width: 380px) { html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p { min-height: 352px !important; } } /* ========================================================================== 🟣 LANDMARK: AMICI UNIVERSAL CARD ADDED REACTION Цел: - пици, паста, десерти и напитки да реагират еднакво; - .bp-p.is-added = food cards; - .bp-drink-icon-card.is-added = drinks; ========================================================================== */ html body #bp-root .bp-p, html body #bp-root .am-food-tile, html body #bp-root .bp-drink-icon-card { position: relative !important; transform-origin: center center !important; will-change: transform, filter, box-shadow !important; } /* Общ pulse/glow за всички карти */ html body #bp-root .bp-p.is-added, html body #bp-root .am-food-tile.is-added, html body #bp-root .bp-drink-icon-card.is-added { animation: amiciUniversalAddedPulse 0.72s cubic-bezier(.2,.9,.2,1) both !important; border-color: rgba(245, 168, 0, 0.72) !important; box-shadow: 0 0 0 1px rgba(245, 168, 0, 0.28), 0 0 34px rgba(245, 168, 0, 0.42), 0 18px 42px rgba(10, 0, 5, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.16) !important; filter: brightness(1.14) saturate(1.12) !important; } /* Badge "Добавено" за пици/паста/десерти/напитки */ html body #bp-root .bp-p::after, html body #bp-root .am-food-tile::after, html body #bp-root .bp-drink-icon-card::after { content: "Добавено" !important; position: absolute !important; left: 50% !important; bottom: 10px !important; z-index: 30 !important; transform: translateX(-50%) translateY(10px) scale(0.92) !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; min-height: 24px !important; padding: 0 10px !important; border-radius: 999px !important; color: #180B13 !important; background: linear-gradient(135deg, #F5A800, #FFE0A0) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 10px !important; font-weight: 950 !important; line-height: 1 !important; letter-spacing: 0.04em !important; text-transform: uppercase !important; opacity: 0 !important; pointer-events: none !important; box-shadow: 0 10px 24px rgba(245, 168, 0, 0.26), inset 0 1px 0 rgba(255, 255, 255, 0.32) !important; } html body #bp-root .bp-p.is-added::after, html body #bp-root .am-food-tile.is-added::after, html body #bp-root .bp-drink-icon-card.is-added::after { animation: amiciUniversalAddedBadge 0.72s cubic-bezier(.2,.9,.2,1) both !important; } /* Image pop за пици/паста/десерти/напитки */ html body #bp-root .bp-p.is-added > img, html body #bp-root .bp-p.is-added .bp-img, html body #bp-root .bp-p.is-added .bp-product-img, html body #bp-root .bp-p.is-added .bp-img-burger-full, html body #bp-root .bp-p.is-added .bp-offer-img, html body #bp-root .bp-p.is-added > .bp-ph, html body #bp-root .am-food-tile.is-added .am-food-tile__image-wrap, html body #bp-root .bp-drink-icon-card.is-added .bp-drink-icon-card__imgwrap { animation: amiciUniversalImagePop 0.72s cubic-bezier(.2,.9,.2,1) both !important; box-shadow: 0 0 26px rgba(245, 168, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.14) !important; } /* Активният бутон леко светва */ html body #bp-root .bp-p.is-added .bp-amici-order-btn:not(.bp-amici-order-btn--plus), html body #bp-root .bp-p.is-added .bp-add2, html body #bp-root .am-food-tile.is-added .am-food-tile__cta { filter: brightness(1.08) saturate(1.06) !important; } /* Keyframes */ @keyframes amiciUniversalAddedPulse { 0% { transform: scale(1); } 24% { transform: scale(0.982); } 52% { transform: scale(1.018); } 100% { transform: scale(1); } } @keyframes amiciUniversalAddedBadge { 0% { opacity: 0; transform: translateX(-50%) translateY(10px) scale(0.92); } 22% { opacity: 1; transform: translateX(-50%) translateY(0) scale(1.04); } 72% { opacity: 1; transform: translateX(-50%) translateY(0) scale(1); } 100% { opacity: 0; transform: translateX(-50%) translateY(-6px) scale(0.96); } } @keyframes amiciUniversalImagePop { 0% { transform: scale(1); } 36% { transform: scale(1.035); } 100% { transform: scale(1); } } /* Mobile — badge да не пречи на бутона */ @media (max-width: 680px) { html body #bp-root .bp-p::after, html body #bp-root .am-food-tile::after, html body #bp-root .bp-drink-icon-card::after { bottom: 8px !important; min-height: 21px !important; padding: 0 8px !important; font-size: 9px !important; } } @media (prefers-reduced-motion: reduce) { html body #bp-root .bp-p.is-added, html body #bp-root .am-food-tile.is-added, html body #bp-root .bp-drink-icon-card.is-added, html body #bp-root .bp-p.is-added::after, html body #bp-root .am-food-tile.is-added::after, html body #bp-root .bp-drink-icon-card.is-added::after, html body #bp-root .bp-p.is-added > img, html body #bp-root .bp-p.is-added .bp-img, html body #bp-root .bp-p.is-added .bp-product-img, html body #bp-root .bp-p.is-added .bp-img-burger-full, html body #bp-root .bp-p.is-added .bp-offer-img, html body #bp-root .bp-p.is-added > .bp-ph, html body #bp-root .am-food-tile.is-added .am-food-tile__image-wrap, html body #bp-root .bp-drink-icon-card.is-added .bp-drink-icon-card__imgwrap { animation-duration: 0.18s !important; } } /* ========================================================================== 🟣 LANDMARK: AMICI TEMP HIDE DRINKS CATEGORY ========================================================================== */ html body #bp-root #bp-types .bp-cat[data-type="Напитки"], html body #bp-root .bp-cats .bp-cat[data-type="Напитки"] { display: none !important; } /* ========================================================================== 🟣 LANDMARK: AMICI CART — RESTORE DELIVERY UI FINAL Връща видимостта на доставката в количката. ========================================================================== */ html body #bp-dw [data-cart-handoff="delivery"], html body #bp-root #bp-dw [data-cart-handoff="delivery"] { display: flex !important; visibility: visible !important; opacity: 1 !important; pointer-events: auto !important; } html body #bp-dw .bp-delivery-zone-box, html body #bp-root #bp-dw .bp-delivery-zone-box { display: block !important; visibility: visible !important; opacity: 1 !important; height: auto !important; max-height: none !important; min-height: 0 !important; padding: 9px 10px !important; margin: 0 0 8px !important; overflow: visible !important; pointer-events: auto !important; } html body #bp-dw .bp-delivery-zone-options, html body #bp-root #bp-dw .bp-delivery-zone-options { display: grid !important; visibility: visible !important; opacity: 1 !important; height: auto !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; pointer-events: auto !important; } html body #bp-dw .bp-cart-delivery-fields, html body #bp-root #bp-dw .bp-cart-delivery-fields, html body #bp-dw .bp-delivery-fields, html body #bp-root #bp-dw .bp-delivery-fields { display: block !important; visibility: visible !important; opacity: 1 !important; height: auto !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; pointer-events: auto !important; } html body #bp-dw .bp-saved-addresses, html body #bp-root #bp-dw .bp-saved-addresses, html body #bp-dw .bp-saved-address-row, html body #bp-root #bp-dw .bp-saved-address-row { display: block !important; visibility: visible !important; opacity: 1 !important; height: auto !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; pointer-events: auto !important; } /* Картата може да остане скрита, ако не я искаш. */ html body #bp-dw .bp-delivery-map-box, html body #bp-root #bp-dw .bp-delivery-map-box, html body #bp-dw .bp-map-compact-card, html body #bp-root #bp-dw .bp-map-compact-card { display: none !important; } /* ========================================================================== 🟣 LANDMARK: AMICI DRINK PRODUCTS — 3 PER ROW COMPACT Напитките използват същия product holder като пици/паста, но са по 3 на ред и по-ниски. ========================================================================== */ #bp-root #bp-grid.bp-grid--drink-products { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 14px !important; overflow-x: visible !important; overflow-y: visible !important; padding: 6px 2px 20px !important; scroll-snap-type: none !important; } /* Самата карта */ #bp-root #bp-grid.bp-grid--drink-products > .bp-p { width: 100% !important; max-width: 100% !important; min-width: 0 !important; flex: none !important; min-height: 0 !important; height: auto !important; padding: 10px !important; border-radius: 22px !important; scroll-snap-align: unset !important; } /* Снимката по-ниска */ #bp-root #bp-grid.bp-grid--drink-products > .bp-p > img, #bp-root #bp-grid.bp-grid--drink-products > .bp-p > .bp-ph { height: 115px !important; min-height: 115px !important; max-height: 115px !important; object-fit: contain !important; object-position: center !important; padding: 8px !important; border-radius: 18px !important; } /* Заглавието да не раздува картата */ #bp-root #bp-grid.bp-grid--drink-products .bp-p__name, #bp-root #bp-grid.bp-grid--drink-products .bp-p h3, #bp-root #bp-grid.bp-grid--drink-products .bp-p h4 { font-size: 14px !important; line-height: 1.12 !important; min-height: 34px !important; max-height: 34px !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; } /* Описание/състав при напитките да не заема място */ #bp-root #bp-grid.bp-grid--drink-products .bp-p__desc, #bp-root #bp-grid.bp-grid--drink-products .bp-p__meta, #bp-root #bp-grid.bp-grid--drink-products .bp-desc { display: none !important; } /* Бутонът по-компактен, но със същия стил */ #bp-root #bp-grid.bp-grid--drink-products .bp-amici-actions { margin-top: 10px !important; gap: 8px !important; } #bp-root #bp-grid.bp-grid--drink-products .bp-amici-order-btn { min-height: 54px !important; padding: 10px 11px !important; border-radius: 17px !important; gap: 8px !important; } #bp-root #bp-grid.bp-grid--drink-products .bp-amici-order-btn__label { font-size: 12px !important; letter-spacing: 0.06em !important; } #bp-root #bp-grid.bp-grid--drink-products .bp-amici-order-btn__sub { display: none !important; } #bp-root #bp-grid.bp-grid--drink-products .bp-amici-order-btn__price { min-width: 58px !important; padding-left: 8px !important; } #bp-root #bp-grid.bp-grid--drink-products .bp-amici-order-btn__price span { font-size: 18px !important; } #bp-root #bp-grid.bp-grid--drink-products .bp-amici-order-btn__price small { display: none !important; } /* Tablet */ @media (max-width: 780px) { #bp-root #bp-grid.bp-grid--drink-products { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 10px !important; } #bp-root #bp-grid.bp-grid--drink-products > .bp-p { padding: 8px !important; border-radius: 20px !important; } #bp-root #bp-grid.bp-grid--drink-products > .bp-p > img, #bp-root #bp-grid.bp-grid--drink-products > .bp-p > .bp-ph { height: 98px !important; min-height: 98px !important; max-height: 98px !important; } #bp-root #bp-grid.bp-grid--drink-products .bp-amici-order-btn { min-height: 50px !important; padding: 9px 8px !important; } #bp-root #bp-grid.bp-grid--drink-products .bp-amici-order-btn__label { font-size: 10.5px !important; } #bp-root #bp-grid.bp-grid--drink-products .bp-amici-order-btn__price { min-width: 48px !important; padding-left: 6px !important; } #bp-root #bp-grid.bp-grid--drink-products .bp-amici-order-btn__price span { font-size: 15px !important; } } /* Много малки телефони */ @media (max-width: 390px) { #bp-root #bp-grid.bp-grid--drink-products { gap: 8px !important; } #bp-root #bp-grid.bp-grid--drink-products > .bp-p > img, #bp-root #bp-grid.bp-grid--drink-products > .bp-p > .bp-ph { height: 88px !important; min-height: 88px !important; max-height: 88px !important; } #bp-root #bp-grid.bp-grid--drink-products .bp-p__name, #bp-root #bp-grid.bp-grid--drink-products .bp-p h3, #bp-root #bp-grid.bp-grid--drink-products .bp-p h4 { font-size: 12px !important; min-height: 30px !important; max-height: 30px !important; } #bp-root #bp-grid.bp-grid--drink-products .bp-amici-order-btn { min-height: 46px !important; } #bp-root #bp-grid.bp-grid--drink-products .bp-amici-order-btn__label { font-size: 9.5px !important; } #bp-root #bp-grid.bp-grid--drink-products .bp-amici-order-btn__price span { font-size: 14px !important; } } /* ========================================================================== 🟣 LANDMARK: AMICI DRINKS — SAME ACTION STYLE AS PIZZA / PASTA FINAL ========================================================================== */ /* Drink grid/card размер — да има място за снимка, име и истински бутон */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card, html body #bp-root .bp-drink-icon-card { display: grid !important; grid-template-rows: 112px minmax(38px, auto) 64px !important; align-items: stretch !important; gap: 9px !important; min-height: 248px !important; height: auto !important; padding: 10px 8px 11px !important; overflow: hidden !important; } /* Снимката да остане силна, но да не изяжда мястото на бутона */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__imgwrap, html body #bp-root .bp-drink-icon-card__imgwrap { width: 100% !important; height: 112px !important; min-height: 112px !important; max-height: 112px !important; margin: 0 !important; border-radius: 22px !important; } /* Напитката вътре да се побира независимо дали е кен, 500 мл или 2 л */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__imgwrap img, html body #bp-root .bp-drink-icon-card__imgwrap img { width: auto !important; height: 96px !important; max-width: 92px !important; object-fit: contain !important; object-position: center !important; padding: 0 !important; transform: none !important; } /* Големи бутилки */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card.bp-drink-large .bp-drink-icon-card__imgwrap img, html body #bp-root .bp-drink-icon-card.bp-drink-large .bp-drink-icon-card__imgwrap img { height: 100px !important; max-width: 72px !important; } /* 500 мл */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card.bp-drink-small .bp-drink-icon-card__imgwrap img, html body #bp-root .bp-drink-icon-card.bp-drink-small .bp-drink-icon-card__imgwrap img { height: 98px !important; max-width: 72px !important; } /* Кенове */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card.bp-drink-can .bp-drink-icon-card__imgwrap img, html body #bp-root .bp-drink-icon-card.bp-drink-can .bp-drink-icon-card__imgwrap img { height: 88px !important; max-width: 84px !important; } /* Име — максимум 2 реда, без да бута бутона */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__body, html body #bp-root .bp-drink-icon-card__body { min-height: 38px !important; max-height: 42px !important; display: flex !important; align-items: center !important; justify-content: center !important; overflow: hidden !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__name, html body #bp-root .bp-drink-icon-card__name { display: -webkit-box !important; -webkit-line-clamp: 2 !important; line-clamp: 2 !important; -webkit-box-orient: vertical !important; max-height: 34px !important; overflow: hidden !important; color: #F5EAD8 !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 11.5px !important; font-weight: 950 !important; line-height: 1.12 !important; text-align: center !important; } /* Старият отделен meta ред се маха */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__meta, html body #bp-root .bp-drink-icon-card__meta { display: none !important; } /* Долният action блок — визуално като бутона на пици/паста */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price, html body #bp-root .bp-drink-icon-card__price { width: 100% !important; max-width: 100% !important; min-width: 0 !important; height: 64px !important; min-height: 64px !important; display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; align-items: center !important; gap: 10px !important; padding: 11px 12px !important; margin: 0 !important; border-radius: 19px !important; border: 1px solid rgba(224, 188, 122, 0.28) !important; background: radial-gradient(circle at 12% 0%, rgba(224, 188, 122, 0.14), transparent 38%), linear-gradient(135deg, rgba(44, 22, 18, 0.98), rgba(98, 36, 28, 0.92) 52%, rgba(36, 16, 18, 0.98)) !important; box-shadow: 0 14px 32px rgba(10, 0, 5, 0.34), inset 0 1px 0 rgba(255, 235, 210, 0.10) !important; color: #F5EAD8 !important; text-align: left !important; overflow: hidden !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price::before, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price::after, html body #bp-root .bp-drink-icon-card__price::before, html body #bp-root .bp-drink-icon-card__price::after { content: none !important; display: none !important; } /* Лява част */ html body #bp-root .bp-drink-action__left { min-width: 0 !important; display: grid !important; gap: 5px !important; } html body #bp-root .bp-drink-action__label { display: block !important; color: #F5EAD8 !important; font-family: "Oswald", "Nunito", system-ui, sans-serif !important; font-size: 14px !important; font-weight: 850 !important; line-height: 1 !important; letter-spacing: 0.08em !important; text-transform: uppercase !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; } html body #bp-root .bp-drink-action__sub { display: block !important; color: rgba(245, 234, 216, 0.58) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 11px !important; font-weight: 850 !important; line-height: 1 !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; } /* Цена вдясно — като при пици */ html body #bp-root .bp-drink-action__price { min-width: 72px !important; max-width: 86px !important; padding-left: 10px !important; border-left: 1px solid rgba(245, 234, 216, 0.12) !important; display: flex !important; align-items: center !important; justify-content: flex-end !important; text-align: right !important; } html body #bp-root .bp-drink-action__price span, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price-value { display: block !important; color: #E0BC7A !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 19px !important; font-style: italic !important; font-weight: 700 !important; line-height: 1 !important; white-space: nowrap !important; } /* Hover като food бутоните */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card:hover .bp-drink-icon-card__price, html body #bp-root .bp-drink-icon-card:hover .bp-drink-icon-card__price { filter: brightness(1.05) !important; border-color: rgba(224, 188, 122, 0.46) !important; box-shadow: 0 18px 42px rgba(10, 0, 5, 0.42), 0 0 0 1px rgba(224, 188, 122, 0.12), inset 0 1px 0 rgba(255, 235, 210, 0.14) !important; } /* Disabled */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card.is-disabled .bp-drink-icon-card__price, html body #bp-root .bp-drink-icon-card.is-disabled .bp-drink-icon-card__price { opacity: 0.55 !important; filter: grayscale(0.2) brightness(0.78) !important; } /* Mobile — по-компактно, за да не реже нищо */ @media (max-width: 680px) { html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card, html body #bp-root .bp-drink-icon-card { grid-template-rows: 104px minmax(36px, auto) 60px !important; min-height: 234px !important; padding: 9px 7px 10px !important; gap: 8px !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__imgwrap, html body #bp-root .bp-drink-icon-card__imgwrap { height: 104px !important; min-height: 104px !important; max-height: 104px !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__imgwrap img, html body #bp-root .bp-drink-icon-card__imgwrap img { height: 90px !important; max-width: 86px !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card.bp-drink-large .bp-drink-icon-card__imgwrap img, html body #bp-root .bp-drink-icon-card.bp-drink-large .bp-drink-icon-card__imgwrap img { height: 94px !important; max-width: 66px !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price, html body #bp-root .bp-drink-icon-card__price { height: 60px !important; min-height: 60px !important; padding: 10px 10px !important; border-radius: 18px !important; gap: 8px !important; } html body #bp-root .bp-drink-action__label { font-size: 12.5px !important; } html body #bp-root .bp-drink-action__sub { font-size: 10.5px !important; } html body #bp-root .bp-drink-action__price { min-width: 62px !important; max-width: 74px !important; padding-left: 8px !important; } html body #bp-root .bp-drink-action__price span { font-size: 17px !important; } } /* ========================================================================== 🟣 LANDMARK: AMICI HERO — HIDE SLIDESHOW PRODUCT LABEL ========================================================================== */ #bp-root .bp-hero-v3__floating-card { display: none !important; } /* ========================================================================== 🟣 LANDMARK: AMICI HERO — DB PIZZA SLIDESHOW VISUAL FINAL ========================================================================== */ #bp-root .bp-hero-v3__photo { position: absolute !important; inset: 0 !important; overflow: hidden !important; background: #12050b !important; } #bp-root .bp-hero-v3__photo .bp-hero-db-slide { position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; display: block !important; object-fit: cover !important; object-position: center !important; opacity: 0 !important; transform: scale(1.08) !important; filter: saturate(1.08) contrast(1.04) brightness(0.98) !important; transition: opacity 0.85s ease, transform 5.2s ease !important; pointer-events: none !important; user-select: none !important; } #bp-root .bp-hero-v3__photo .bp-hero-db-slide.is-active { opacity: 1 !important; transform: scale(1.025) !important; z-index: 2 !important; } #bp-root .bp-hero.is-hero-slideshow-running .bp-hero-v3__visual { animation: amiciHeroVisualBreath 7s ease-in-out infinite; } @keyframes amiciHeroVisualBreath { 0%, 100% { transform: translateY(0) scale(1); } 50% { transform: translateY(-2px) scale(1.006); } } @media (prefers-reduced-motion: reduce) { #bp-root .bp-hero-v3__photo .bp-hero-db-slide, #bp-root .bp-hero.is-hero-slideshow-running .bp-hero-v3__visual { transition: none !important; animation: none !important; } } /* ========================================================================== 🟣 LANDMARK: AMICI DRINKS — ORANGE BUTTONS ONLY Цел: - без JS промени; - само прави бутоните на напитките оранжеви; - маха жълтия вид; - запазва текущия layout. ========================================================================== */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__cta, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price { background: radial-gradient(circle at 18% 0%, rgba(255, 235, 190, 0.22), transparent 42%), linear-gradient( 135deg, #B82A12 0%, #D94A22 42%, #F06A32 68%, #8A2418 100% ) !important; border: 1px solid rgba(255, 210, 160, 0.26) !important; color: #FFF3E2 !important; box-shadow: 0 10px 24px rgba(192, 72, 48, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.18) !important; } /* Текстът вътре — дали е ДОБАВИ или цена, да е четим върху оранжевото */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__cta, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__cta *, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__cta-price, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price *, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price-value { color: #FFF3E2 !important; text-shadow: 0 1px 8px rgba(0, 0, 0, 0.24) !important; } /* Hover / active */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card:hover .bp-drink-icon-card__cta, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card:hover .bp-drink-icon-card__price { background: radial-gradient(circle at 18% 0%, rgba(255, 238, 200, 0.28), transparent 42%), linear-gradient( 135deg, #C73518 0%, #E65328 45%, #FF7540 70%, #962719 100% ) !important; box-shadow: 0 13px 28px rgba(192, 72, 48, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.22) !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card:active .bp-drink-icon-card__cta, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card:active .bp-drink-icon-card__price { filter: brightness(0.96) saturate(1.08) !important; } /* ========================================================================== 🟣 LANDMARK: AMICI DRINKS — REAL CTA STRUCTURE FINAL Работи с JS структура: .bp-drink-icon-card__cta .bp-drink-icon-card__cta-label .bp-drink-icon-card__cta-price ========================================================================== */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card { min-height: 206px !important; grid-template-rows: 94px 42px 42px !important; gap: 7px !important; } /* Стария price елемент, ако остане някъде, го неутрализираме */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price { display: none !important; } /* Новият CTA бутон */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__cta { width: 100% !important; min-width: 0 !important; max-width: 100% !important; height: 42px !important; min-height: 42px !important; display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; align-items: center !important; gap: 8px !important; padding: 0 12px !important; margin: 0 !important; border-radius: 17px !important; border: 1px solid rgba(255, 210, 160, 0.22) !important; background: radial-gradient(circle at 14% 0%, rgba(255, 230, 170, 0.16), transparent 38%), linear-gradient( 135deg, rgba(184, 42, 18, 0.98) 0%, rgba(214, 72, 34, 0.96) 48%, rgba(128, 34, 24, 0.98) 100% ) !important; box-shadow: 0 10px 22px rgba(192, 72, 48, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.15) !important; overflow: hidden !important; box-sizing: border-box !important; } /* ДОБАВИ */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__cta-label { display: block !important; min-width: 0 !important; color: #FFF4E6 !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 11px !important; font-weight: 1000 !important; line-height: 1 !important; letter-spacing: 0.09em !important; text-transform: uppercase !important; text-align: left !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; } /* Цена */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__cta-price { display: block !important; color: #FFD98E !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 20px !important; font-weight: 900 !important; font-style: italic !important; line-height: 1 !important; letter-spacing: -0.02em !important; text-align: right !important; white-space: nowrap !important; } /* Махаме generated текстове от самата drink карта */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card::before, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card::after, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__cta::before, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__cta::after { content: none !important; display: none !important; } /* Small mobile */ @media (max-width: 390px) { html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card { min-height: 198px !important; grid-template-rows: 88px 40px 40px !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__cta { height: 40px !important; min-height: 40px !important; padding: 0 10px !important; border-radius: 16px !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__cta-label { font-size: 10px !important; letter-spacing: 0.075em !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__cta-price { font-size: 18px !important; } } /* ========================================================================== 🟣 LANDMARK: AMICI DRINKS — CTA LIKE PASTA BUTTON FINAL Цел: - маха жълтия бутон при напитките; - прави го като пастата: червено/оранжев premium бутон; - показва "ДОБАВИ" + цена; - запазва compact drink cards. ========================================================================== */ /* Drink card остава компактна */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card { min-height: 206px !important; grid-template-rows: 94px 42px 42px !important; gap: 7px !important; } /* Бутонът при напитките — като пастата */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price { position: relative !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; height: 42px !important; min-height: 42px !important; display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; align-items: center !important; justify-content: stretch !important; gap: 8px !important; padding: 0 12px !important; margin: 0 !important; border-radius: 17px !important; border: 1px solid rgba(255, 210, 160, 0.20) !important; background: radial-gradient(circle at 14% 0%, rgba(255, 230, 170, 0.16), transparent 38%), linear-gradient( 135deg, rgba(184, 42, 18, 0.96) 0%, rgba(212, 70, 34, 0.94) 48%, rgba(137, 38, 25, 0.96) 100% ) !important; box-shadow: 0 10px 22px rgba(192, 72, 48, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.15) !important; color: #FFF4E6 !important; font-family: "Nunito", system-ui, sans-serif !important; font-style: normal !important; line-height: 1 !important; overflow: hidden !important; white-space: nowrap !important; } /* Текстът "ДОБАВИ" */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price::before { content: "ДОБАВИ" !important; display: block !important; min-width: 0 !important; color: #FFF4E6 !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 11px !important; font-weight: 1000 !important; line-height: 1 !important; letter-spacing: 0.09em !important; text-transform: uppercase !important; text-align: left !important; overflow: hidden !important; text-overflow: ellipsis !important; opacity: 1 !important; visibility: visible !important; } /* Цената */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price-value { text-transform: none !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price-value { display: inline-block !important; color: #FFD98E !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 20px !important; font-weight: 900 !important; font-style: italic !important; line-height: 1 !important; letter-spacing: -0.02em !important; text-align: right !important; white-space: nowrap !important; opacity: 1 !important; visibility: visible !important; } /* Ако цената е директен текст в .bp-drink-icon-card__price, пак да изглежда правилно */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price:not(:has(.bp-drink-icon-card__price-value)) { color: #FFD98E !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 19px !important; font-weight: 900 !important; font-style: italic !important; } /* Махаме всякакъв стар жълт фон/стар generated текст */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price::after { content: none !important; display: none !important; } /* Small mobile */ @media (max-width: 390px) { html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card { min-height: 198px !important; grid-template-rows: 88px 40px 40px !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price { height: 40px !important; min-height: 40px !important; padding: 0 10px !important; border-radius: 16px !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price::before { font-size: 10px !important; letter-spacing: 0.075em !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price-value { font-size: 18px !important; } } /* ========================================================================== 🟣 LANDMARK: AMICI DRINKS — FINAL BUTTON PRICE ONLY Цел: - напитките остават button за JS add логиката; - визуално показват само цената; - маха "ДОБАВИ" от жълтия бутон; - стяга картите. ========================================================================== */ html body #bp-root #bp-grid.bp-grid--drinks { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 10px !important; padding: 8px 7px 24px !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card { position: relative !important; min-height: 204px !important; height: auto !important; display: grid !important; grid-template-rows: 94px 42px 36px !important; gap: 7px !important; padding: 8px 7px 10px !important; border-radius: 22px !important; overflow: hidden !important; text-align: center !important; } /* Белият панел */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__imgwrap { width: 100% !important; height: 94px !important; min-height: 94px !important; max-height: 94px !important; margin: 0 !important; padding: 4px !important; border-radius: 18px !important; display: flex !important; align-items: center !important; justify-content: center !important; background: radial-gradient(circle at 50% 42%, rgba(0,0,0,0.08), transparent 58%), linear-gradient(180deg, #ffffff 0%, #f8f4ee 100%) !important; box-shadow: 0 12px 24px rgba(10, 0, 5, 0.24), inset 0 1px 0 rgba(255,255,255,0.88), inset 0 -1px 0 rgba(0,0,0,0.05) !important; overflow: hidden !important; } /* Самата напитка вътре */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__imgwrap img { width: 100% !important; height: 100% !important; object-fit: contain !important; object-position: center !important; padding: 0 !important; margin: 0 !important; background: transparent !important; transform: scale(1.12) !important; } /* Име */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__body { width: 100% !important; min-width: 0 !important; display: flex !important; align-items: flex-start !important; justify-content: center !important; padding: 0 2px !important; margin: 0 !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__name { width: 100% !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; text-overflow: ellipsis !important; color: #F5EAD8 !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 10.9px !important; font-weight: 950 !important; line-height: 1.08 !important; text-align: center !important; min-height: 36px !important; max-height: 40px !important; } /* Махаме повторения блед размер */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__meta { display: none !important; } /* Жълтото хапче — само цена */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price { position: relative !important; min-width: 92px !important; height: 36px !important; min-height: 36px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; align-self: end !important; justify-self: center !important; padding: 0 15px !important; margin: 0 auto !important; border-radius: 999px !important; color: #180B13 !important; background: linear-gradient(135deg, #F5A800 0%, #FFD15C 55%, #E0BC7A 100%) !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 17px !important; font-weight: 900 !important; font-style: italic !important; line-height: 1 !important; text-align: center !important; letter-spacing: 0 !important; text-transform: none !important; white-space: nowrap !important; overflow: hidden !important; box-shadow: 0 10px 22px rgba(245, 168, 0, 0.24), inset 0 1px 0 rgba(255,255,255,0.34) !important; } /* Скриваме всякакъв стар generated текст */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price::before, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price::after, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card::before, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card::after { content: none !important; display: none !important; } /* Показваме само стойността */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price-value { display: inline-block !important; color: #180B13 !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 17px !important; font-weight: 900 !important; font-style: italic !important; line-height: 1 !important; text-transform: none !important; letter-spacing: 0 !important; white-space: nowrap !important; } /* Малки телефони */ @media (max-width: 390px) { html body #bp-root #bp-grid.bp-grid--drinks { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 8px !important; padding-left: 6px !important; padding-right: 6px !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card { min-height: 196px !important; grid-template-rows: 88px 40px 34px !important; padding: 8px 6px 10px !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__imgwrap { height: 88px !important; min-height: 88px !important; max-height: 88px !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__name { font-size: 10.3px !important; min-height: 34px !important; max-height: 38px !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price-value { font-size: 15px !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price { min-width: 86px !important; height: 34px !important; min-height: 34px !important; padding: 0 13px !important; } } /* ========================================================================== 🟣 LANDMARK: AMICI DRINKS — PRICE BUTTON FIX / REMOVE "ДОБАВИ" Цел: - маха текста "ДОБАВИ" от бутона при напитките; - оставя само цената; - центрира цената в жълтото хапче; - стяга още малко картите. ========================================================================== */ /* Самият бутон при напитките */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price, html body #bp-root .bp-drink-icon-card__price { position: relative !important; min-width: 92px !important; width: auto !important; height: 36px !important; min-height: 36px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; padding: 0 16px !important; margin: 0 auto !important; overflow: hidden !important; border-radius: 999px !important; color: #180B13 !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 17px !important; font-weight: 900 !important; font-style: italic !important; line-height: 1 !important; text-align: center !important; letter-spacing: 0 !important; text-transform: none !important; white-space: nowrap !important; } /* Ако вътре има span/small/label с "добави" — скриваме всичко */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price span, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price small, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price .bp-add-label, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price .bp-add2__tag, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price .bp-add2__left, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price .bp-add2__ok, html body #bp-root .bp-drink-icon-card__price span, html body #bp-root .bp-drink-icon-card__price small, html body #bp-root .bp-drink-icon-card__price .bp-add-label, html body #bp-root .bp-drink-icon-card__price .bp-add2__tag, html body #bp-root .bp-drink-icon-card__price .bp-add2__left, html body #bp-root .bp-drink-icon-card__price .bp-add2__ok { display: none !important; } /* Ако "ДОБАВИ" идва от ::before/::after */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price::before, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price::after, html body #bp-root .bp-drink-icon-card__price::before, html body #bp-root .bp-drink-icon-card__price::after { content: none !important; display: none !important; } /* Ако реалният бутон е стар .bp-add2 вътре в напитките */ html body #bp-root #bp-grid.bp-grid--drinks .bp-add2 { position: relative !important; min-width: 92px !important; height: 36px !important; min-height: 36px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; padding: 0 16px !important; border-radius: 999px !important; color: #180B13 !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 17px !important; font-weight: 900 !important; font-style: italic !important; line-height: 1 !important; text-align: center !important; letter-spacing: 0 !important; text-transform: none !important; overflow: hidden !important; white-space: nowrap !important; } /* Скриваме текстовите части на стария бутон */ html body #bp-root #bp-grid.bp-grid--drinks .bp-add2 .bp-add2__tag, html body #bp-root #bp-grid.bp-grid--drinks .bp-add2 .bp-add2__left, html body #bp-root #bp-grid.bp-grid--drinks .bp-add2 .bp-add2__ok { display: none !important; } /* Ако цената е в отделен елемент вътре — показваме само нея */ html body #bp-root #bp-grid.bp-grid--drinks .bp-add2 .bp-add2__price, html body #bp-root #bp-grid.bp-grid--drinks .bp-add2 strong, html body #bp-root #bp-grid.bp-grid--drinks .bp-add2 b { display: inline !important; color: #180B13 !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 17px !important; font-weight: 900 !important; font-style: italic !important; line-height: 1 !important; } /* Още малко стягане на drink картите */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card, html body #bp-root .bp-drink-icon-card { min-height: 202px !important; grid-template-rows: 92px 42px 36px !important; gap: 6px !important; } /* Белият панел малко по-нисък, но снимката остава голяма */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__imgwrap, html body #bp-root .bp-drink-icon-card__imgwrap { height: 92px !important; min-height: 92px !important; max-height: 92px !important; } /* Снимката вътре */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__imgwrap img, html body #bp-root .bp-drink-icon-card__imgwrap img { transform: scale(1.14) !important; } /* Име */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__name, html body #bp-root .bp-drink-icon-card__name { font-size: 10.8px !important; line-height: 1.08 !important; min-height: 36px !important; max-height: 40px !important; } /* Mobile small */ @media (max-width: 390px) { html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card, html body #bp-root .bp-drink-icon-card { min-height: 196px !important; grid-template-rows: 88px 40px 34px !important; gap: 6px !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__imgwrap, html body #bp-root .bp-drink-icon-card__imgwrap { height: 88px !important; min-height: 88px !important; max-height: 88px !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price, html body #bp-root .bp-drink-icon-card__price, html body #bp-root #bp-grid.bp-grid--drinks .bp-add2 { min-width: 86px !important; height: 34px !important; min-height: 34px !important; font-size: 15px !important; padding: 0 13px !important; } } /* ========================================================================== 🟣 LANDMARK: AMICI DRINKS — SAME BUTTON STYLE AS PIZZA / PASTA Цел: - бутоните на напитките да са като пици/паста; - маха жълтото price-pill хапче; - бутонът става тъмен premium Amici бутон; - запазва компактната drink card структура. ========================================================================== */ /* Картата получава малко повече място за големия бутон */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card, html body #bp-root .bp-drink-icon-card { grid-template-rows: 108px 46px 58px !important; min-height: 242px !important; gap: 9px !important; padding: 9px 7px 11px !important; } /* Белият image panel */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__imgwrap, html body #bp-root .bp-drink-icon-card__imgwrap { height: 108px !important; min-height: 108px !important; max-height: 108px !important; } /* Име */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__body, html body #bp-root .bp-drink-icon-card__body { height: 46px !important; min-height: 46px !important; max-height: 46px !important; } /* Махаме повторения размер, ако още се появява */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__meta, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__body small, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__body p, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__body [class*="meta"], html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__body [class*="size"], html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__body [class*="volume"] { display: none !important; } /* Самият бутон на напитката — като пица/паста */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price, html body #bp-root .bp-drink-icon-card__price { grid-row: 3 !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; height: 56px !important; min-height: 56px !important; display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; align-items: center !important; gap: 8px !important; padding: 10px 11px !important; margin: 0 !important; border-radius: 18px !important; border: 1px solid rgba(224, 188, 122, 0.28) !important; background: radial-gradient(circle at 12% 0%, rgba(224, 188, 122, 0.14), transparent 38%), linear-gradient(135deg, rgba(44, 22, 18, 0.98), rgba(98, 36, 28, 0.92) 52%, rgba(36, 16, 18, 0.98)) !important; box-shadow: 0 14px 32px rgba(10, 0, 5, 0.34), inset 0 1px 0 rgba(255, 235, 210, 0.10) !important; color: #F5EAD8 !important; font-family: "Nunito", system-ui, sans-serif !important; font-style: normal !important; font-size: 0 !important; font-weight: 900 !important; line-height: 1 !important; cursor: pointer !important; align-self: end !important; justify-self: center !important; transition: transform 0.18s ease, filter 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease !important; } /* Ляв текст в бутона */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price::before, html body #bp-root .bp-drink-icon-card__price::before { content: "ДОБАВИ" !important; min-width: 0 !important; display: block !important; color: #F5EAD8 !important; font-family: "Oswald", "Nunito", system-ui, sans-serif !important; font-size: 12px !important; font-weight: 900 !important; line-height: 1.05 !important; letter-spacing: 0.08em !important; text-transform: uppercase !important; text-align: left !important; } /* Цената вдясно — взима реалния текст от бутона */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price { color: #E0BC7A !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 20px !important; font-weight: 700 !important; font-style: italic !important; text-align: right !important; } /* Разделител пред цената */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price::after, html body #bp-root .bp-drink-icon-card__price::after { content: "" !important; position: absolute !important; top: 12px !important; bottom: 12px !important; right: 68px !important; width: 1px !important; background: rgba(245, 234, 216, 0.12) !important; } /* Нужно за ::after позицията */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price, html body #bp-root .bp-drink-icon-card__price { position: relative !important; } /* Hover като при другите */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price:hover, html body #bp-root .bp-drink-icon-card__price:hover { transform: translateY(-2px) !important; filter: brightness(1.05) !important; border-color: rgba(224, 188, 122, 0.46) !important; box-shadow: 0 18px 42px rgba(10, 0, 5, 0.42), 0 0 0 1px rgba(224, 188, 122, 0.12), inset 0 1px 0 rgba(255, 235, 210, 0.14) !important; } /* Mobile fine tune */ @media (max-width: 390px) { html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card, html body #bp-root .bp-drink-icon-card { grid-template-rows: 100px 44px 54px !important; min-height: 228px !important; gap: 8px !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__imgwrap, html body #bp-root .bp-drink-icon-card__imgwrap { height: 100px !important; min-height: 100px !important; max-height: 100px !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price, html body #bp-root .bp-drink-icon-card__price { height: 54px !important; min-height: 54px !important; padding: 9px 10px !important; border-radius: 17px !important; font-size: 18px !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price::before, html body #bp-root .bp-drink-icon-card__price::before { font-size: 11px !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price::after, html body #bp-root .bp-drink-icon-card__price::after { right: 62px !important; } } /* ========================================================================== 🟣 LANDMARK: AMICI DRINKS — COMPACT TUNE - свива картите - маха повторения блед надпис - запазва 3 на ред на мобилно ========================================================================== */ html body #bp-root #bp-grid.bp-grid--drinks { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 10px !important; padding: 8px 7px 24px !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card, html body #bp-root .bp-drink-icon-card { min-height: 214px !important; height: auto !important; display: grid !important; grid-template-rows: 96px 44px 38px !important; gap: 7px !important; padding: 8px 7px 10px !important; border-radius: 22px !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__imgwrap, html body #bp-root .bp-drink-icon-card__imgwrap { width: 100% !important; height: 96px !important; min-height: 96px !important; max-height: 96px !important; border-radius: 18px !important; padding: 4px !important; display: flex !important; align-items: center !important; justify-content: center !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__imgwrap img, html body #bp-root .bp-drink-icon-card__imgwrap img { width: 100% !important; height: 100% !important; object-fit: contain !important; object-position: center center !important; transform: scale(1.12) !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__body, html body #bp-root .bp-drink-icon-card__body { width: 100% !important; min-width: 0 !important; display: flex !important; align-items: flex-start !important; justify-content: center !important; padding: 0 2px !important; margin: 0 !important; min-height: 44px !important; } /* Име */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__name, html body #bp-root .bp-drink-icon-card__name { width: 100% !important; margin: 0 !important; display: -webkit-box !important; -webkit-box-orient: vertical !important; -webkit-line-clamp: 2 !important; line-clamp: 2 !important; overflow: hidden !important; text-overflow: ellipsis !important; text-align: center !important; font-size: 11px !important; line-height: 1.1 !important; font-weight: 950 !important; min-height: 38px !important; max-height: 42px !important; } /* Махаме бледия повторен текст */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__meta, html body #bp-root .bp-drink-icon-card__meta { display: none !important; } /* Цена */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price, html body #bp-root .bp-drink-icon-card__price { min-width: 96px !important; height: 36px !important; min-height: 36px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; padding: 0 14px !important; margin: 0 !important; border-radius: 999px !important; font-size: 15px !important; line-height: 1 !important; align-self: end !important; justify-self: center !important; } /* Малки телефони */ @media (max-width: 390px) { html body #bp-root #bp-grid.bp-grid--drinks { gap: 8px !important; padding-left: 6px !important; padding-right: 6px !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card, html body #bp-root .bp-drink-icon-card { min-height: 206px !important; grid-template-rows: 92px 42px 36px !important; padding: 8px 6px 10px !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__imgwrap, html body #bp-root .bp-drink-icon-card__imgwrap { height: 92px !important; min-height: 92px !important; max-height: 92px !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__name, html body #bp-root .bp-drink-icon-card__name { font-size: 10.6px !important; min-height: 36px !important; max-height: 40px !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price, html body #bp-root .bp-drink-icon-card__price { min-width: 90px !important; height: 34px !important; min-height: 34px !important; font-size: 14px !important; } } /* ========================================================================== 🟣 LANDMARK: AMICI DRINKS — TRUE FIX FOR bp-drink-icon-card Цел: - фиксира реалната drink структура от JS: .bp-drink-icon-card; - белият панел остава красив; - напитките са по-големи вътре; - текстът НЕ влиза върху снимката; - цена/име/размер не се застъпват; - запазва 3 напитки на ред на мобилно. ========================================================================== */ html body #bp-root #bp-grid.bp-grid--drinks { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 10px !important; width: 100% !important; max-width: 100% !important; overflow: visible !important; padding: 8px 7px 28px !important; scroll-snap-type: none !important; } /* Реалната drink карта */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card, html body #bp-root .bp-drink-icon-card { position: relative !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; min-height: 252px !important; height: auto !important; display: grid !important; grid-template-rows: 112px 58px 40px !important; align-items: start !important; justify-items: center !important; gap: 8px !important; padding: 9px 7px 11px !important; border-radius: 22px !important; overflow: hidden !important; box-sizing: border-box !important; } /* Белият панел */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__imgwrap, html body #bp-root .bp-drink-icon-card__imgwrap { width: 100% !important; height: 112px !important; min-height: 112px !important; max-height: 112px !important; display: flex !important; align-items: center !important; justify-content: center !important; padding: 3px !important; margin: 0 !important; border-radius: 18px !important; background: radial-gradient(circle at 50% 48%, rgba(0, 0, 0, 0.10), transparent 58%), linear-gradient(180deg, #ffffff 0%, #f8f4ee 100%) !important; box-shadow: 0 12px 24px rgba(10, 0, 5, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.88), inset 0 -1px 0 rgba(0, 0, 0, 0.05) !important; overflow: hidden !important; box-sizing: border-box !important; } /* Самата снимка — по-голяма спрямо белия панел */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__imgwrap img, html body #bp-root .bp-drink-icon-card__imgwrap img { display: block !important; width: 100% !important; height: 100% !important; object-fit: contain !important; object-position: center center !important; padding: 0 !important; margin: 0 !important; background: transparent !important; border-radius: 14px !important; transform: scale(1.08) !important; } /* Body: име + размер */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__body, html body #bp-root .bp-drink-icon-card__body { width: 100% !important; min-width: 0 !important; max-width: 100% !important; display: grid !important; grid-template-rows: 34px 18px !important; align-items: start !important; justify-items: center !important; gap: 4px !important; padding: 0 1px !important; margin: 0 !important; overflow: hidden !important; box-sizing: border-box !important; } /* Име */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__name, html body #bp-root .bp-drink-icon-card__name { width: 100% !important; max-width: 100% !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; text-overflow: ellipsis !important; color: #F5EAD8 !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 11.2px !important; font-weight: 950 !important; line-height: 1.05 !important; letter-spacing: 0.005em !important; text-align: center !important; min-height: 30px !important; max-height: 34px !important; position: relative !important; z-index: 2 !important; } /* Размер */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__meta, html body #bp-root .bp-drink-icon-card__meta { width: 100% !important; max-width: 100% !important; display: block !important; color: rgba(245, 234, 216, 0.62) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 11px !important; font-weight: 900 !important; line-height: 1.05 !important; text-align: center !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; min-height: 15px !important; max-height: 17px !important; position: relative !important; z-index: 2 !important; } /* Цена */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price, html body #bp-root .bp-drink-icon-card__price { align-self: end !important; justify-self: center !important; min-width: 76px !important; height: 36px !important; min-height: 36px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; padding: 0 13px !important; margin: 0 !important; border-radius: 999px !important; color: #180B13 !important; background: linear-gradient(135deg, #F5A800 0%, #FFD15C 55%, #E0BC7A 100%) !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 16px !important; font-weight: 900 !important; font-style: italic !important; line-height: 1 !important; box-shadow: 0 10px 22px rgba(245, 168, 0, 0.24), inset 0 1px 0 rgba(255,255,255,0.34) !important; position: relative !important; z-index: 2 !important; } /* Премахваме стария badge "Добавено", ако още съществува */ html body #bp-root .bp-drink-icon-card::after, html body #bp-root .bp-drink-icon-card.is-added::after { content: none !important; display: none !important; } /* По-големи екрани */ @media (min-width: 681px) { html body #bp-root #bp-grid.bp-grid--drinks { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 14px !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card, html body #bp-root .bp-drink-icon-card { min-height: 270px !important; grid-template-rows: 126px 58px 40px !important; padding: 10px 8px 12px !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__imgwrap, html body #bp-root .bp-drink-icon-card__imgwrap { height: 126px !important; min-height: 126px !important; max-height: 126px !important; } } /* Малки телефони */ @media (max-width: 390px) { html body #bp-root #bp-grid.bp-grid--drinks { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 8px !important; padding-left: 6px !important; padding-right: 6px !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card, html body #bp-root .bp-drink-icon-card { min-height: 240px !important; grid-template-rows: 104px 56px 38px !important; padding: 8px 6px 10px !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__imgwrap, html body #bp-root .bp-drink-icon-card__imgwrap { height: 104px !important; min-height: 104px !important; max-height: 104px !important; border-radius: 17px !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__imgwrap img, html body #bp-root .bp-drink-icon-card__imgwrap img { transform: scale(1.08) !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__name, html body #bp-root .bp-drink-icon-card__name { font-size: 10.4px !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__meta, html body #bp-root .bp-drink-icon-card__meta { font-size: 10.4px !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price, html body #bp-root .bp-drink-icon-card__price { min-width: 70px !important; height: 34px !important; min-height: 34px !important; font-size: 15px !important; } } /* ========================================================================== 🟣 LANDMARK: AMICI DRINKS — FIX IMAGE PANEL / TEXT FLOW / BIGGER PRODUCT IMAGE Цел: - снимките стоят вътре в белия панел; - самите напитки са по-големи спрямо квадрата; - името вече НЕ влиза върху снимката; - размерът и цената не се застъпват; - запазваме 3 на ред на мобилно. ========================================================================== */ /* Drinks grid */ html body #bp-root #bp-grid.bp-grid--drinks { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 10px !important; overflow: visible !important; padding: 8px 8px 28px !important; } /* Самата карта */ html body #bp-root #bp-grid.bp-grid--drinks > .bp-p, html body #bp-root .bp-drink-icon-card { position: relative !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; height: auto !important; min-height: 288px !important; display: flex !important; flex-direction: column !important; align-items: center !important; padding: 10px 8px 12px !important; gap: 0 !important; border-radius: 24px !important; overflow: hidden !important; box-sizing: border-box !important; } /* Връщаме body-то да НЕ се разпада с display: contents */ html body #bp-root #bp-grid.bp-grid--drinks > .bp-p .b, html body #bp-root #bp-grid.bp-grid--drinks > .bp-p .bp-adds, html body #bp-root .bp-drink-icon-card .b, html body #bp-root .bp-drink-icon-card__body { width: 100% !important; min-width: 0 !important; display: flex !important; flex-direction: column !important; align-items: center !important; flex: 1 1 auto !important; padding: 0 !important; margin: 0 !important; } /* Белият панел */ html body #bp-root #bp-grid.bp-grid--drinks > .bp-p > img, html body #bp-root #bp-grid.bp-grid--drinks > .bp-p .bp-img, html body #bp-root #bp-grid.bp-grid--drinks > .bp-p .bp-product-img, html body #bp-root .bp-drink-icon-card__imgwrap { width: 100% !important; height: 116px !important; min-height: 116px !important; max-height: 116px !important; display: flex !important; align-items: center !important; justify-content: center !important; margin: 0 0 10px !important; padding: 4px !important; border-radius: 18px !important; background: radial-gradient(circle at 50% 48%, rgba(0,0,0,0.10), transparent 58%), linear-gradient(180deg, #ffffff 0%, #f8f4ee 100%) !important; box-shadow: 0 12px 24px rgba(10, 0, 5, 0.24), inset 0 1px 0 rgba(255,255,255,0.88), inset 0 -1px 0 rgba(0,0,0,0.05) !important; transform: none !important; } html body #bp-root #bp-grid.bp-grid--drinks > .bp-p > img, html body #bp-root #bp-grid.bp-grid--drinks > .bp-p .bp-img, html body #bp-root #bp-grid.bp-grid--drinks > .bp-p .bp-product-img img, html body #bp-root .bp-drink-icon-card__imgwrap img { width: auto !important; height: 100% !important; max-width: 100% !important; object-fit: contain !important; object-position: center center !important; display: block !important; transform: none !important; } /* Името вече стои под панела, не върху него */ html body #bp-root #bp-grid.bp-grid--drinks > .bp-p h4, html body #bp-root .bp-drink-icon-card__name { width: 100% !important; margin: 0 0 6px !important; padding: 0 2px !important; min-height: 34px !important; max-height: 36px !important; color: #F5EAD8 !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 12.5px !important; font-weight: 950 !important; line-height: 1.08 !important; letter-spacing: 0.01em !important; text-align: center !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; text-overflow: ellipsis !important; position: relative !important; z-index: 2 !important; } /* Размер */ html body #bp-root #bp-grid.bp-grid--drinks > .bp-p p, html body #bp-root .bp-drink-icon-card__meta { width: 100% !important; margin: 0 0 12px !important; padding: 0 !important; min-height: 18px !important; max-height: 20px !important; color: rgba(245, 234, 216, 0.62) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 12px !important; font-weight: 900 !important; line-height: 1.1 !important; text-align: center !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; position: relative !important; z-index: 2 !important; } /* Долният ред с цена да стои стабилно долу */ html body #bp-root #bp-grid.bp-grid--drinks > .bp-p .bp-row2, html body #bp-root #bp-grid.bp-grid--drinks > .bp-p .bp-adds, html body #bp-root .bp-drink-icon-card__price { width: 100% !important; margin-top: auto !important; display: flex !important; align-items: center !important; justify-content: center !important; } /* Жълтото хапче цена */ html body #bp-root #bp-grid.bp-grid--drinks > .bp-p .bp-add2, html body #bp-root .bp-drink-icon-card__price { min-width: 82px !important; height: 38px !important; min-height: 38px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; padding: 0 13px !important; border-radius: 999px !important; border: 0 !important; background: linear-gradient(135deg, #F5A800 0%, #FFD15C 55%, #E0BC7A 100%) !important; color: #180B13 !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 18px !important; font-weight: 900 !important; font-style: italic !important; line-height: 1 !important; box-shadow: 0 10px 22px rgba(245, 168, 0, 0.24), inset 0 1px 0 rgba(255,255,255,0.34) !important; } /* Скриваме излишни описания, ако ги има */ html body #bp-root #bp-grid.bp-grid--drinks > .bp-p .bp-flavor { display: none !important; } /* Mobile */ @media (max-width: 680px) { html body #bp-root #bp-grid.bp-grid--drinks { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 9px !important; padding: 8px 7px 28px !important; } html body #bp-root #bp-grid.bp-grid--drinks > .bp-p, html body #bp-root .bp-drink-icon-card { min-height: 274px !important; padding: 9px 7px 11px !important; border-radius: 22px !important; } html body #bp-root #bp-grid.bp-grid--drinks > .bp-p > img, html body #bp-root #bp-grid.bp-grid--drinks > .bp-p .bp-img, html body #bp-root #bp-grid.bp-grid--drinks > .bp-p .bp-product-img, html body #bp-root .bp-drink-icon-card__imgwrap { height: 112px !important; min-height: 112px !important; max-height: 112px !important; padding: 3px !important; margin-bottom: 9px !important; border-radius: 17px !important; } html body #bp-root #bp-grid.bp-grid--drinks > .bp-p h4, html body #bp-root .bp-drink-icon-card__name { font-size: 11.6px !important; line-height: 1.06 !important; min-height: 32px !important; max-height: 34px !important; margin-bottom: 5px !important; } html body #bp-root #bp-grid.bp-grid--drinks > .bp-p p, html body #bp-root .bp-drink-icon-card__meta { font-size: 11px !important; min-height: 17px !important; max-height: 18px !important; margin-bottom: 11px !important; } html body #bp-root #bp-grid.bp-grid--drinks > .bp-p .bp-add2, html body #bp-root .bp-drink-icon-card__price { min-width: 76px !important; height: 36px !important; min-height: 36px !important; font-size: 16px !important; } } /* Малки телефони */ @media (max-width: 390px) { html body #bp-root #bp-grid.bp-grid--drinks { gap: 8px !important; padding-left: 6px !important; padding-right: 6px !important; } html body #bp-root #bp-grid.bp-grid--drinks > .bp-p, html body #bp-root .bp-drink-icon-card { min-height: 260px !important; padding: 8px 6px 10px !important; } html body #bp-root #bp-grid.bp-grid--drinks > .bp-p > img, html body #bp-root #bp-grid.bp-grid--drinks > .bp-p .bp-img, html body #bp-root #bp-grid.bp-grid--drinks > .bp-p .bp-product-img, html body #bp-root .bp-drink-icon-card__imgwrap { height: 104px !important; min-height: 104px !important; max-height: 104px !important; padding: 3px !important; } html body #bp-root #bp-grid.bp-grid--drinks > .bp-p h4, html body #bp-root .bp-drink-icon-card__name { font-size: 10.8px !important; } html body #bp-root #bp-grid.bp-grid--drinks > .bp-p .bp-add2, html body #bp-root .bp-drink-icon-card__price { min-width: 70px !important; height: 34px !important; min-height: 34px !important; font-size: 15px !important; } } /* ========================================================================== 🟣 LANDMARK: AMICI DRINKS GRID — CLEAN IMAGE BOX + NO TEXT OVERLAP FINAL Цел: - напитките да са стегнати и подредени; - белият image box да е еднакъв навсякъде; - снимките да стоят красиво вътре; - текстове и цени да не се застъпват; - 3 на ред на мобилно. ========================================================================== */ /* Grid за напитки */ html body #bp-root #bp-grid.bp-grid--drinks { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 12px !important; overflow: visible !important; padding: 8px 8px 24px !important; } /* Card */ html body #bp-root #bp-grid.bp-grid--drinks > .bp-p, html body #bp-root .bp-drink-icon-card { width: 100% !important; max-width: 100% !important; min-width: 0 !important; min-height: 268px !important; height: auto !important; display: grid !important; grid-template-rows: 116px 42px 22px 44px !important; align-items: start !important; justify-items: center !important; gap: 7px !important; padding: 10px 8px 12px !important; border-radius: 24px !important; overflow: hidden !important; box-sizing: border-box !important; } /* Ако JS рендерира вътрешен body/content */ html body #bp-root #bp-grid.bp-grid--drinks > .bp-p .b, html body #bp-root .bp-drink-icon-card .b, html body #bp-root .bp-drink-icon-card__body { width: 100% !important; min-width: 0 !important; display: contents !important; } /* Белият квадрат / image box */ html body #bp-root #bp-grid.bp-grid--drinks > .bp-p > img, html body #bp-root #bp-grid.bp-grid--drinks > .bp-p .bp-img, html body #bp-root #bp-grid.bp-grid--drinks > .bp-p .bp-product-img, html body #bp-root .bp-drink-icon-card__imgwrap { grid-row: 1 !important; width: 100% !important; height: 116px !important; min-height: 116px !important; max-height: 116px !important; display: flex !important; align-items: center !important; justify-content: center !important; padding: 10px !important; border-radius: 18px !important; background: radial-gradient(circle at 50% 42%, rgba(0,0,0,0.08), transparent 58%), linear-gradient(180deg, #ffffff 0%, #f7f4ef 100%) !important; box-shadow: 0 12px 24px rgba(10, 0, 5, 0.24), inset 0 1px 0 rgba(255,255,255,0.80), inset 0 -1px 0 rgba(0,0,0,0.05) !important; transform: none !important; } html body #bp-root #bp-grid.bp-grid--drinks > .bp-p > img, html body #bp-root #bp-grid.bp-grid--drinks > .bp-p .bp-img, html body #bp-root #bp-grid.bp-grid--drinks > .bp-p .bp-product-img img, html body #bp-root .bp-drink-icon-card__imgwrap img { width: auto !important; height: 100% !important; max-width: 100% !important; object-fit: contain !important; object-position: center center !important; display: block !important; transform: none !important; } /* Име на напитката */ html body #bp-root #bp-grid.bp-grid--drinks > .bp-p h4, html body #bp-root .bp-drink-icon-card h4, html body #bp-root .bp-drink-icon-card__name { grid-row: 2 !important; width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 0 2px !important; color: #F5EAD8 !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 13px !important; font-weight: 950 !important; line-height: 1.08 !important; letter-spacing: 0.01em !important; text-align: center !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; text-overflow: ellipsis !important; min-height: 30px !important; max-height: 34px !important; position: relative !important; z-index: 2 !important; } /* Размер: 330 мл / 500 мл / 1.75 л */ html body #bp-root #bp-grid.bp-grid--drinks > .bp-p p, html body #bp-root .bp-drink-icon-card p, html body #bp-root .bp-drink-icon-card__meta, html body #bp-root .bp-drink-icon-card__size { grid-row: 3 !important; width: 100% !important; margin: 0 !important; padding: 0 !important; color: rgba(245, 234, 216, 0.62) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 12px !important; font-weight: 900 !important; line-height: 1.1 !important; text-align: center !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; min-height: 16px !important; max-height: 18px !important; position: relative !important; z-index: 2 !important; } /* Цена / бутон */ html body #bp-root #bp-grid.bp-grid--drinks > .bp-p .bp-row2, html body #bp-root #bp-grid.bp-grid--drinks > .bp-p .bp-adds, html body #bp-root #bp-grid.bp-grid--drinks > .bp-p .bp-add2, html body #bp-root .bp-drink-icon-card__price, html body #bp-root .bp-drink-icon-card__cta { grid-row: 4 !important; align-self: end !important; justify-self: center !important; } /* Цена като жълто хапче */ html body #bp-root #bp-grid.bp-grid--drinks > .bp-p .bp-add2, html body #bp-root .bp-drink-icon-card__price, html body #bp-root .bp-drink-icon-card__cta { min-width: 82px !important; height: 38px !important; min-height: 38px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; padding: 0 13px !important; border-radius: 999px !important; border: 0 !important; background: linear-gradient(135deg, #F5A800 0%, #FFD15C 55%, #E0BC7A 100%) !important; color: #180B13 !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 18px !important; font-weight: 900 !important; font-style: italic !important; line-height: 1 !important; box-shadow: 0 10px 22px rgba(245, 168, 0, 0.24), inset 0 1px 0 rgba(255,255,255,0.34) !important; } /* Скриваме излишни стари текстове, ако се дублират */ html body #bp-root #bp-grid.bp-grid--drinks > .bp-p .bp-flavor { display: none !important; } /* Mobile tuning */ @media (max-width: 680px) { html body #bp-root #bp-grid.bp-grid--drinks { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 10px !important; padding: 8px 8px 24px !important; } html body #bp-root #bp-grid.bp-grid--drinks > .bp-p, html body #bp-root .bp-drink-icon-card { min-height: 252px !important; grid-template-rows: 108px 40px 20px 40px !important; gap: 6px !important; padding: 9px 7px 11px !important; border-radius: 22px !important; } html body #bp-root #bp-grid.bp-grid--drinks > .bp-p > img, html body #bp-root #bp-grid.bp-grid--drinks > .bp-p .bp-img, html body #bp-root #bp-grid.bp-grid--drinks > .bp-p .bp-product-img, html body #bp-root .bp-drink-icon-card__imgwrap { height: 108px !important; min-height: 108px !important; max-height: 108px !important; padding: 9px !important; border-radius: 17px !important; } html body #bp-root #bp-grid.bp-grid--drinks > .bp-p h4, html body #bp-root .bp-drink-icon-card h4, html body #bp-root .bp-drink-icon-card__name { font-size: 12px !important; line-height: 1.05 !important; min-height: 28px !important; max-height: 32px !important; } html body #bp-root #bp-grid.bp-grid--drinks > .bp-p p, html body #bp-root .bp-drink-icon-card p, html body #bp-root .bp-drink-icon-card__meta, html body #bp-root .bp-drink-icon-card__size { font-size: 11px !important; min-height: 15px !important; max-height: 16px !important; } html body #bp-root #bp-grid.bp-grid--drinks > .bp-p .bp-add2, html body #bp-root .bp-drink-icon-card__price, html body #bp-root .bp-drink-icon-card__cta { min-width: 76px !important; height: 36px !important; min-height: 36px !important; font-size: 16px !important; } } /* Small phones */ @media (max-width: 390px) { html body #bp-root #bp-grid.bp-grid--drinks { gap: 8px !important; padding-left: 6px !important; padding-right: 6px !important; } html body #bp-root #bp-grid.bp-grid--drinks > .bp-p, html body #bp-root .bp-drink-icon-card { min-height: 240px !important; grid-template-rows: 100px 38px 18px 38px !important; padding: 8px 6px 10px !important; } html body #bp-root #bp-grid.bp-grid--drinks > .bp-p > img, html body #bp-root #bp-grid.bp-grid--drinks > .bp-p .bp-img, html body #bp-root #bp-grid.bp-grid--drinks > .bp-p .bp-product-img, html body #bp-root .bp-drink-icon-card__imgwrap { height: 100px !important; min-height: 100px !important; max-height: 100px !important; padding: 8px !important; } html body #bp-root #bp-grid.bp-grid--drinks > .bp-p h4, html body #bp-root .bp-drink-icon-card h4, html body #bp-root .bp-drink-icon-card__name { font-size: 11px !important; } html body #bp-root #bp-grid.bp-grid--drinks > .bp-p .bp-add2, html body #bp-root .bp-drink-icon-card__price, html body #bp-root .bp-drink-icon-card__cta { min-width: 70px !important; height: 34px !important; min-height: 34px !important; font-size: 15px !important; } } /* ========================================================================== 🟣 LANDMARK: AMICI DRINKS — REMOVE DUPLICATED SIZE LABEL FINAL Цел: - маха долния повтарящ се блед надпис: 1.75 л / 500 мл / 330 мл; - оставя само името и цената; - свива картата след махането на надписа. ========================================================================== */ /* Скриваме всички secondary/meta/size елементи вътре в drink card */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__meta, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__size, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__volume, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__sub, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card small, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card p, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__body small, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__body p, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__body .meta, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__body .size, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__body [class*="meta"], html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__body [class*="size"], html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__body [class*="volume"] { display: none !important; visibility: hidden !important; opacity: 0 !important; height: 0 !important; min-height: 0 !important; max-height: 0 !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; } /* Ако размерът е направен с pseudo element */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__meta::before, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__meta::after, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__size::before, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__size::after, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__volume::before, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__volume::after { content: none !important; display: none !important; } /* Body вече съдържа само името */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__body, html body #bp-root .bp-drink-icon-card__body { display: flex !important; align-items: center !important; justify-content: center !important; width: 100% !important; min-height: 34px !important; max-height: 38px !important; padding: 0 2px !important; margin: 0 !important; overflow: hidden !important; } /* Името остава видимо */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__name, html body #bp-root .bp-drink-icon-card__name { display: -webkit-box !important; visibility: visible !important; opacity: 1 !important; width: 100% !important; -webkit-line-clamp: 2 !important; line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; text-overflow: ellipsis !important; text-align: center !important; font-size: 11.2px !important; line-height: 1.08 !important; font-weight: 950 !important; min-height: 30px !important; max-height: 36px !important; color: #F5EAD8 !important; } /* Свиваме картата, защото вече няма втори ред */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card, html body #bp-root .bp-drink-icon-card { min-height: 198px !important; grid-template-rows: 96px 38px 36px !important; gap: 7px !important; padding: 8px 7px 10px !important; } /* Цена стабилно долу */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price, html body #bp-root .bp-drink-icon-card__price { align-self: end !important; justify-self: center !important; margin: 0 !important; } /* Малки телефони */ @media (max-width: 390px) { html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card, html body #bp-root .bp-drink-icon-card { min-height: 190px !important; grid-template-rows: 92px 36px 34px !important; gap: 6px !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__name, html body #bp-root .bp-drink-icon-card__name { font-size: 10.6px !important; min-height: 28px !important; max-height: 34px !important; } } /* ========================================================================== 🟣 LANDMARK: AMICI DRINKS — NAME POSITION FINAL FIX Цел: - името да слезе под белия image panel; - да не стои върху снимката; - маха повторения размер; - картата остава компактна. ========================================================================== */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card, html body #bp-root .bp-drink-icon-card { display: grid !important; grid-template-rows: 112px 48px 40px !important; gap: 10px !important; min-height: 230px !important; height: auto !important; padding: 9px 7px 12px !important; align-items: start !important; justify-items: center !important; overflow: hidden !important; } /* Белият панел със снимката — само той е горе */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__imgwrap, html body #bp-root .bp-drink-icon-card__imgwrap { grid-row: 1 !important; position: relative !important; z-index: 1 !important; width: 100% !important; height: 112px !important; min-height: 112px !important; max-height: 112px !important; margin: 0 !important; padding: 4px !important; border-radius: 18px !important; overflow: hidden !important; } /* Снимката вътре */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__imgwrap img, html body #bp-root .bp-drink-icon-card__imgwrap img { width: 100% !important; height: 100% !important; object-fit: contain !important; object-position: center center !important; transform: scale(1.08) !important; position: relative !important; z-index: 1 !important; } /* Body-то с името — задължително под снимката */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__body, html body #bp-root .bp-drink-icon-card__body { grid-row: 2 !important; position: relative !important; z-index: 3 !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; height: 48px !important; min-height: 48px !important; max-height: 48px !important; display: flex !important; align-items: center !important; justify-content: center !important; padding: 0 3px !important; margin: 0 !important; transform: none !important; translate: none !important; inset: auto !important; overflow: hidden !important; } /* Самото име */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__name, html body #bp-root .bp-drink-icon-card__name { position: relative !important; z-index: 4 !important; display: -webkit-box !important; -webkit-box-orient: vertical !important; -webkit-line-clamp: 2 !important; line-clamp: 2 !important; width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; color: #F5EAD8 !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 11.4px !important; font-weight: 950 !important; line-height: 1.08 !important; text-align: center !important; overflow: hidden !important; text-overflow: ellipsis !important; min-height: 30px !important; max-height: 38px !important; transform: none !important; translate: none !important; inset: auto !important; } /* Махаме повторения долен размер */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__meta, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__size, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__body small, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__body p, html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__body [class*="meta"], html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__body [class*="size"], html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__body [class*="volume"] { display: none !important; } /* Цената — винаги долу */ html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__price, html body #bp-root .bp-drink-icon-card__price { grid-row: 3 !important; position: relative !important; z-index: 3 !important; align-self: end !important; justify-self: center !important; min-width: 94px !important; height: 36px !important; min-height: 36px !important; margin: 0 !important; } /* Small phones */ @media (max-width: 390px) { html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card, html body #bp-root .bp-drink-icon-card { grid-template-rows: 104px 46px 36px !important; min-height: 218px !important; gap: 8px !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__imgwrap, html body #bp-root .bp-drink-icon-card__imgwrap { height: 104px !important; min-height: 104px !important; max-height: 104px !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__body, html body #bp-root .bp-drink-icon-card__body { height: 46px !important; min-height: 46px !important; max-height: 46px !important; } html body #bp-root #bp-grid.bp-grid--drinks .bp-drink-icon-card__name, html body #bp-root .bp-drink-icon-card__name { font-size: 10.6px !important; } } /* ========================================================================== 🟣 LANDMARK: AMICI ADD EFFECT — NO BADGE + AGGRESSIVE SHAKE FINAL Цел: - маха жълтия правоъгълник "Добавено"; - запазва оранжевото светване по ръбовете; - прави сътресението по-агресивно; - важи за пици, паста, десерти и напитки. ========================================================================== */ /* 1) Премахваме badge "Добавено" навсякъде */ html body #bp-root .bp-p::after, html body #bp-root .am-food-tile::after, html body #bp-root .bp-drink-icon-card::after, html body #bp-root .bp-p.is-added::after, html body #bp-root .am-food-tile.is-added::after, html body #bp-root .bp-drink-icon-card.is-added::after { content: none !important; display: none !important; opacity: 0 !important; visibility: hidden !important; animation: none !important; } /* 2) Агресивно сътресение + оранжево edge glow */ html body #bp-root .bp-p.is-added, html body #bp-root .am-food-tile.is-added, html body #bp-root .bp-drink-icon-card.is-added { animation: amiciAggressiveAddShake 0.62s cubic-bezier(.18,.92,.22,1) both !important; border-color: rgba(245, 168, 0, 0.88) !important; box-shadow: 0 0 0 2px rgba(245, 168, 0, 0.36), 0 0 20px rgba(245, 168, 0, 0.52), 0 0 44px rgba(245, 112, 32, 0.44), 0 18px 44px rgba(10, 0, 5, 0.50), inset 0 1px 0 rgba(255, 255, 255, 0.16) !important; filter: brightness(1.18) saturate(1.16) !important; } /* 3) Вътрешно оранжево светване по ръбовете */ html body #bp-root .bp-p::before, html body #bp-root .am-food-tile::before, html body #bp-root .bp-drink-icon-card::before { content: "" !important; position: absolute !important; inset: 0 !important; z-index: 6 !important; pointer-events: none !important; border-radius: inherit !important; opacity: 0 !important; background: radial-gradient(circle at 50% 0%, rgba(255, 196, 92, 0.30), transparent 38%), linear-gradient( 135deg, rgba(245, 168, 0, 0.24), transparent 28%, transparent 72%, rgba(245, 112, 32, 0.28) ) !important; box-shadow: inset 0 0 0 1px rgba(245, 168, 0, 0.52), inset 0 0 34px rgba(245, 112, 32, 0.28) !important; } html body #bp-root .bp-p.is-added::before, html body #bp-root .am-food-tile.is-added::before, html body #bp-root .bp-drink-icon-card.is-added::before { animation: amiciAggressiveOrangeGlow 0.62s cubic-bezier(.18,.92,.22,1) both !important; } /* 4) Снимката също да удари по-силно */ html body #bp-root .bp-p.is-added > img, html body #bp-root .bp-p.is-added .bp-img, html body #bp-root .bp-p.is-added .bp-product-img, html body #bp-root .bp-p.is-added .bp-img-burger-full, html body #bp-root .bp-p.is-added .bp-offer-img, html body #bp-root .bp-p.is-added > .bp-ph, html body #bp-root .am-food-tile.is-added .am-food-tile__image-wrap, html body #bp-root .bp-drink-icon-card.is-added .bp-drink-icon-card__imgwrap { animation: amiciAggressiveImagePunch 0.62s cubic-bezier(.18,.92,.22,1) both !important; box-shadow: 0 0 30px rgba(245, 168, 0, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.16) !important; } /* 5) Бутонът да светне, но без badge */ html body #bp-root .bp-p.is-added .bp-amici-order-btn:not(.bp-amici-order-btn--plus), html body #bp-root .bp-p.is-added .bp-add2, html body #bp-root .am-food-tile.is-added .am-food-tile__cta { filter: brightness(1.14) saturate(1.12) !important; box-shadow: 0 0 0 1px rgba(245, 168, 0, 0.24), 0 0 24px rgba(245, 112, 32, 0.30), inset 0 1px 0 rgba(255, 255, 255, 0.18) !important; } /* 6) Агресивно сътресение */ @keyframes amiciAggressiveAddShake { 0% { transform: translateX(0) translateY(0) rotate(0deg) scale(1); } 9% { transform: translateX(-5px) translateY(1px) rotate(-1.2deg) scale(0.972); } 18% { transform: translateX(5px) translateY(-1px) rotate(1.2deg) scale(0.984); } 28% { transform: translateX(-4px) translateY(0) rotate(-0.9deg) scale(1.026); } 40% { transform: translateX(4px) translateY(1px) rotate(0.9deg) scale(1.034); } 52% { transform: translateX(-3px) translateY(-1px) rotate(-0.6deg) scale(1.018); } 66% { transform: translateX(3px) translateY(0) rotate(0.5deg) scale(1.008); } 82% { transform: translateX(-1px) translateY(0) rotate(-0.2deg) scale(1.002); } 100% { transform: translateX(0) translateY(0) rotate(0deg) scale(1); } } @keyframes amiciAggressiveOrangeGlow { 0% { opacity: 0; } 12% { opacity: 1; } 58% { opacity: 0.95; } 100% { opacity: 0; } } @keyframes amiciAggressiveImagePunch { 0% { transform: scale(1); } 22% { transform: scale(1.07); } 48% { transform: scale(0.99); } 100% { transform: scale(1); } } /* ========================================================================== 🟣 LANDMARK: AMICI DRINK CARDS — PREMIUM IMAGE SHOWCASE FINAL Цел: - drink cards да имат чиста бяла „витрина“ зад продукта; - размерът да се адаптира за 2 л / 500 мл / 330 мл кен; - работи с реалния standalone markup (.bp-drink-icon-card). ========================================================================== */ html body #bp-root .bp-drink-card { overflow: hidden !important; } html body #bp-root .bp-drink-card .bp-product-img { width: 98px !important; height: 98px !important; margin: 14px auto 12px !important; padding: 8px !important; position: relative !important; display: flex !important; align-items: center !important; justify-content: center !important; border-radius: 18px !important; background: radial-gradient(circle at 50% 32%, #ffffff 0%, #fbfaf7 46%, #efe8df 100%) !important; box-shadow: 0 18px 36px rgba(0, 0, 0, 0.38), 0 0 0 1px rgba(255, 255, 255, 0.20), inset 0 1px 0 rgba(255,255,255,0.95) !important; transition: transform 0.22s ease, box-shadow 0.22s ease !important; } html body #bp-root .bp-drink-card .bp-product-img::before { content: "" !important; position: absolute !important; inset: 10px !important; border-radius: 14px !important; background: radial-gradient(circle, rgba(255,255,255,0.95), rgba(255,255,255,0) 70%) !important; opacity: 0.9 !important; pointer-events: none !important; } html body #bp-root .bp-drink-card .bp-product-img::after { content: "" !important; position: absolute !important; left: 22% !important; right: 22% !important; bottom: 8px !important; height: 10px !important; border-radius: 999px !important; background: rgba(0,0,0,0.18) !important; filter: blur(7px) !important; } html body #bp-root .bp-drink-card .bp-product-img img { position: relative !important; z-index: 2 !important; width: auto !important; height: 86px !important; max-width: 86px !important; object-fit: contain !important; filter: drop-shadow(0 9px 9px rgba(0,0,0,0.30)) saturate(1.12) contrast(1.05) !important; transition: transform 0.22s ease, filter 0.22s ease !important; } /* 1.75 л / 2 л бутилки */ html body #bp-root .bp-drink-card.bp-drink-large .bp-product-img img { height: 90px !important; max-width: 74px !important; } /* 500 мл бутилки */ html body #bp-root .bp-drink-card.bp-drink-small .bp-product-img img { height: 88px !important; max-width: 72px !important; } /* 330 мл кен */ html body #bp-root .bp-drink-card.bp-drink-can .bp-product-img img { height: 82px !important; max-width: 84px !important; } /* Hover — леко “жадно” движение */ html body #bp-root .bp-drink-card:hover .bp-product-img { transform: translateY(-3px) !important; box-shadow: 0 22px 42px rgba(0, 0, 0, 0.45), 0 0 0 1px rgba(255, 255, 255, 0.24), inset 0 1px 0 rgba(255,255,255,1) !important; } html body #bp-root .bp-drink-card:hover .bp-product-img img { transform: scale(1.045) !important; filter: drop-shadow(0 12px 12px rgba(0,0,0,0.34)) saturate(1.18) contrast(1.08) !important; } /* ========================================================================== 🟣 LANDMARK: AMICI PIZZA SAME ORANGE EDGE GLOW AS PASTA Цел: - пиците да светват по ръбовете 1:1 като пастата при добавяне; - ефектът важи за всички .bp-p карти, не само за паста; - не пипа напитките. ========================================================================== */ html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p.is-added { border-color: rgba(245, 168, 0, 0.78) !important; box-shadow: 0 0 0 1px rgba(245, 168, 0, 0.34), 0 0 18px rgba(245, 168, 0, 0.42), 0 0 38px rgba(245, 112, 32, 0.34), 0 16px 38px rgba(10, 0, 5, 0.44), inset 0 1px 0 rgba(255, 255, 255, 0.14) !important; filter: brightness(1.12) saturate(1.10) !important; animation: amiciFoodOrangeEdgePulse 0.72s cubic-bezier(.2,.9,.2,1) both !important; } /* Оранжев вътрешен glow слой по ръбовете */ html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p::before { content: "" !important; position: absolute !important; inset: 0 !important; z-index: 4 !important; pointer-events: none !important; border-radius: inherit !important; opacity: 0 !important; background: radial-gradient(circle at 50% 0%, rgba(255, 196, 92, 0.24), transparent 38%), linear-gradient( 135deg, rgba(245, 168, 0, 0.20), transparent 28%, transparent 72%, rgba(245, 112, 32, 0.22) ) !important; box-shadow: inset 0 0 0 1px rgba(245, 168, 0, 0.42), inset 0 0 28px rgba(245, 112, 32, 0.22) !important; } html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p.is-added::before { animation: amiciFoodOrangeEdgeGlow 0.72s cubic-bezier(.2,.9,.2,1) both !important; } /* Снимката леко да “подскочи”, както при пастата */ html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p.is-added > img, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p.is-added .bp-img, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p.is-added .bp-product-img, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p.is-added .bp-img-burger-full, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p.is-added .bp-offer-img { animation: amiciFoodImagePopSameAsPasta 0.72s cubic-bezier(.2,.9,.2,1) both !important; } /* Бутонът също леко светва */ html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p.is-added .bp-amici-order-btn:not(.bp-amici-order-btn--plus), html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p.is-added .bp-add2 { border-color: rgba(255, 208, 116, 0.48) !important; box-shadow: 0 0 0 1px rgba(245, 168, 0, 0.20), 0 0 22px rgba(245, 112, 32, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.16) !important; filter: brightness(1.10) saturate(1.08) !important; } @keyframes amiciFoodOrangeEdgePulse { 0% { transform: scale(1); } 24% { transform: scale(0.985); } 52% { transform: scale(1.014); } 100% { transform: scale(1); } } @keyframes amiciFoodOrangeEdgeGlow { 0% { opacity: 0; } 18% { opacity: 1; } 68% { opacity: 0.86; } 100% { opacity: 0; } } @keyframes amiciFoodImagePopSameAsPasta { 0% { transform: scale(1); } 36% { transform: scale(1.035); } 100% { transform: scale(1); } } /* ========================================================================== 🟣 LANDMARK: AMICI FOOD CARDS — SAME SHAKE AS PASTA FOR PIZZAS Цел: - пиците да имат същото леко сътресение при добавяне като пастата; - важи за всички food cards: пици, паста, десерти; - не пипа напитките. ========================================================================== */ html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p.is-added { animation: amiciFoodAddShakeSameAsPasta 0.72s cubic-bezier(.2,.9,.2,1) both !important; border-color: rgba(245, 168, 0, 0.78) !important; box-shadow: 0 0 0 1px rgba(245, 168, 0, 0.34), 0 0 18px rgba(245, 168, 0, 0.42), 0 0 38px rgba(245, 112, 32, 0.34), 0 16px 38px rgba(10, 0, 5, 0.44), inset 0 1px 0 rgba(255, 255, 255, 0.14) !important; filter: brightness(1.12) saturate(1.10) !important; } /* Същинското сътресение */ @keyframes amiciFoodAddShakeSameAsPasta { 0% { transform: translateX(0) scale(1); } 10% { transform: translateX(-2px) scale(0.985); } 20% { transform: translateX(2px) scale(0.99); } 32% { transform: translateX(-1.5px) scale(1.012); } 44% { transform: translateX(1.5px) scale(1.018); } 58% { transform: translateX(-1px) scale(1.01); } 72% { transform: translateX(1px) scale(1.004); } 100% { transform: translateX(0) scale(1); } } /* Снимката също леко да реагира */ html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p.is-added > img, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p.is-added .bp-img, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p.is-added .bp-product-img, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p.is-added .bp-img-burger-full, html body #bp-root #bp-grid:not(.bp-grid--drinks) > .bp-p.is-added .bp-offer-img { animation: amiciFoodImageBumpSameAsPasta 0.72s cubic-bezier(.2,.9,.2,1) both !important; } @keyframes amiciFoodImageBumpSameAsPasta { 0% { transform: scale(1); } 35% { transform: scale(1.045); } 100% { transform: scale(1); } } /* ========================================================================== 🟣 LANDMARK: AMICI FINAL 1:1 ADD EFFECT — PASTA EFFECT EVERYWHERE Цел: - пици, паста, десерти и напитки да имат 100% един и същ ефект; - използваме точните pasta/drink keyframes: amiciDrinkAddedPulse, amiciDrinkAddedBadge, amiciDrinkImagePop; - изключваме различните стари shake/orange/universal override-и чрез по-късен CSS. ========================================================================== */ html body #bp-root .bp-p, html body #bp-root .am-food-tile, html body #bp-root .bp-drink-icon-card { position: relative !important; transform-origin: center center !important; will-change: transform, filter, box-shadow !important; } /* 1:1 същото сътресение / pulse като при пастата */ html body #bp-root .bp-p.is-added, html body #bp-root .am-food-tile.is-added, html body #bp-root .bp-drink-icon-card.is-added { animation: amiciDrinkAddedPulse 0.72s cubic-bezier(.2,.9,.2,1) both !important; border-color: rgba(245, 168, 0, 0.72) !important; box-shadow: 0 0 0 1px rgba(245, 168, 0, 0.28), 0 0 34px rgba(245, 168, 0, 0.42), 0 18px 42px rgba(10, 0, 5, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.16) !important; filter: brightness(1.16) saturate(1.12) !important; } /* Badge "Добавено" — 1:1 */ html body #bp-root .bp-p::after, html body #bp-root .am-food-tile::after, html body #bp-root .bp-drink-icon-card::after { content: "Добавено" !important; position: absolute !important; left: 50% !important; bottom: 9px !important; z-index: 80 !important; transform: translateX(-50%) translateY(10px) scale(0.92) !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; min-height: 24px !important; padding: 0 9px !important; border-radius: 999px !important; color: #180B13 !important; background: linear-gradient(135deg, #F5A800, #FFE0A0) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 10px !important; font-weight: 950 !important; line-height: 1 !important; letter-spacing: 0.04em !important; text-transform: uppercase !important; opacity: 0 !important; pointer-events: none !important; box-shadow: 0 10px 24px rgba(245, 168, 0, 0.26), inset 0 1px 0 rgba(255, 255, 255, 0.32) !important; } html body #bp-root .bp-p.is-added::after, html body #bp-root .am-food-tile.is-added::after, html body #bp-root .bp-drink-icon-card.is-added::after { animation: amiciDrinkAddedBadge 0.72s cubic-bezier(.2,.9,.2,1) both !important; } /* Image pop — 1:1 */ html body #bp-root .bp-p.is-added > img, html body #bp-root .bp-p.is-added .bp-img, html body #bp-root .bp-p.is-added .bp-product-img, html body #bp-root .bp-p.is-added .bp-img-burger-full, html body #bp-root .bp-p.is-added .bp-offer-img, html body #bp-root .bp-p.is-added > .bp-ph, html body #bp-root .am-food-tile.is-added .am-food-tile__image-wrap, html body #bp-root .bp-drink-icon-card.is-added .bp-drink-icon-card__imgwrap { animation: amiciDrinkImagePop 0.72s cubic-bezier(.2,.9,.2,1) both !important; box-shadow: 0 0 26px rgba(245, 168, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.14) !important; } /* Бутонът леко светва, но без отделен различен ефект */ html body #bp-root .bp-p.is-added .bp-amici-order-btn:not(.bp-amici-order-btn--plus), html body #bp-root .bp-p.is-added .bp-add2, html body #bp-root .am-food-tile.is-added .am-food-tile__cta { filter: brightness(1.08) saturate(1.06) !important; } /* Спираме старите зелени ✓ ефекти върху самия бутон, за да не се различава от пастата */ html body #bp-root .bp-amici-order-btn::before { display: none !important; } html body #bp-root .bp-amici-order-btn.is-added { animation: none !important; } /* Ако някой стар listener сложи is-added на бутона, да не пречи */ html body #bp-root .bp-amici-order-btn.is-added::after, html body #bp-root .bp-add2.is-added::after { animation: none !important; } /* Mobile */ @media (max-width: 680px) { html body #bp-root .bp-p::after, html body #bp-root .am-food-tile::after, html body #bp-root .bp-drink-icon-card::after { bottom: 8px !important; min-height: 21px !important; padding: 0 8px !important; font-size: 9px !important; } } /* Reduced motion */ @media (prefers-reduced-motion: reduce) { html body #bp-root .bp-p.is-added, html body #bp-root .am-food-tile.is-added, html body #bp-root .bp-drink-icon-card.is-added, html body #bp-root .bp-p.is-added::after, html body #bp-root .am-food-tile.is-added::after, html body #bp-root .bp-drink-icon-card.is-added::after, html body #bp-root .bp-p.is-added > img, html body #bp-root .am-food-tile.is-added .am-food-tile__image-wrap, html body #bp-root .bp-drink-icon-card.is-added .bp-drink-icon-card__imgwrap { animation-duration: 0.18s !important; } } /* ========================================================================== 🟣 LANDMARK: AMICI TEMP HIDE DRINKS CATEGORY ========================================================================== */ html body #bp-root #bp-types .bp-cat[data-type="Напитки"], html body #bp-root .bp-cats .bp-cat[data-type="Напитки"] { display: none !important; } /* ========================================================================== /* ========================================================================== 🟣 LANDMARK: AMICI CART — VISUAL 1:1 MODE FINAL Това НЕ е patch върху стария cart. Това е нов визуален слой. ========================================================================== */ /* ========================================================================== DRAWER SHELL ========================================================================== */ html body #bp-dw.amici-v11-cart, html body #bp-root #bp-dw.amici-v11-cart { padding: 18px !important; background: rgba(0,0,0,.78) !important; } html body #bp-dw.amici-v11-cart .bp-dw__panel, html body #bp-root #bp-dw.amici-v11-cart .bp-dw__panel { width: min(990px, calc(100vw - 36px)) !important; max-width: min(990px, calc(100vw - 36px)) !important; min-height: 0 !important; max-height: calc(100dvh - 36px) !important; border-radius: 20px !important; border: 1px solid rgba(224,188,122,.20) !important; background: radial-gradient(circle at 12% 0%, rgba(224,188,122,.10), transparent 34%), radial-gradient(circle at 100% 0%, rgba(166,46,42,.16), transparent 34%), linear-gradient(145deg, #16070c 0%, #0b0306 58%, #070204 100%) !important; box-shadow: 0 32px 90px rgba(0,0,0,.78), inset 0 1px 0 rgba(255,235,210,.07) !important; overflow: hidden !important; } html body #bp-dw.amici-v11-cart .bp-dw__h { min-height: 100px !important; padding: 32px 44px 24px !important; display: flex !important; align-items: center !important; justify-content: space-between !important; border-bottom: 1px solid rgba(224,188,122,.11) !important; } html body #bp-dw.amici-v11-cart .bp-dw__h b { display: inline-flex !important; align-items: center !important; gap: 18px !important; color: #F5EAD8 !important; font-family: "Oswald", "Nunito", system-ui, sans-serif !important; font-size: 38px !important; font-weight: 900 !important; line-height: 1 !important; letter-spacing: .05em !important; text-transform: uppercase !important; } html body #bp-dw.amici-v11-cart .amici-v11-count-badge { min-height: 36px !important; padding: 0 18px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; border-radius: 999px !important; border: 1px solid rgba(224,188,122,.26) !important; background: radial-gradient(circle at 24% 0%, rgba(255,235,190,.16), transparent 42%), linear-gradient(135deg, rgba(111,63,28,.70), rgba(34,13,18,.92)) !important; color: #FFE0A0 !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 16px !important; font-weight: 900 !important; text-transform: none !important; letter-spacing: 0 !important; } html body #bp-dw.amici-v11-cart .bp-dw__x { width: 60px !important; height: 60px !important; border-radius: 999px !important; border: 1px solid rgba(255,140,140,.32) !important; background: radial-gradient(circle at 30% 20%, rgba(255,255,255,.16), transparent 42%), linear-gradient(145deg, rgba(125,37,43,.86), rgba(49,16,22,.96)) !important; color: #FFD8D0 !important; font-size: 34px !important; font-weight: 950 !important; box-shadow: 0 14px 30px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.10) !important; } html body #bp-dw.amici-v11-cart .bp-dw__b { padding: 34px 44px 22px !important; } /* Крием продуктните редове, защото визуализацията показва само badge + total, не редовете. */ html body #bp-dw.amici-v11-cart #bp-lines > .bp-line { display: none !important; } /* ========================================================================== HANDOFF ========================================================================== */ html body #bp-dw.amici-v11-cart .bp-cart-handoff { margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; } html body #bp-dw.amici-v11-cart .bp-cart-handoff__head { margin: 0 0 24px !important; } html body #bp-dw.amici-v11-cart .bp-cart-handoff__kicker { color: rgba(224,188,122,.88) !important; font-family: "Oswald", "Nunito", system-ui, sans-serif !important; font-size: 22px !important; font-weight: 900 !important; line-height: 1 !important; letter-spacing: .22em !important; text-transform: uppercase !important; } html body #bp-dw.amici-v11-cart .bp-cart-handoff__title { margin: 14px 0 0 !important; color: #FFF5E7 !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 36px !important; font-weight: 950 !important; line-height: 1.06 !important; letter-spacing: -.035em !important; } html body #bp-dw.amici-v11-cart .bp-cart-handoff__fee, html body #bp-dw.amici-v11-cart .bp-cart-handoff__tab > span:not(.amici-v11-handoff-icon):not(.amici-v11-handoff-copy) { display: none !important; } html body #bp-dw.amici-v11-cart .bp-cart-handoff__tabs { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 18px !important; margin: 0 0 24px !important; } html body #bp-dw.amici-v11-cart .bp-cart-handoff__tab { min-height: 150px !important; padding: 26px 34px !important; display: grid !important; grid-template-columns: 76px minmax(0, 1fr) !important; align-items: center !important; gap: 22px !important; border-radius: 24px !important; border: 1px solid rgba(255,235,210,.13) !important; background: radial-gradient(circle at 18% 0%, rgba(255,235,210,.05), transparent 36%), linear-gradient(145deg, rgba(42,26,28,.74), rgba(16,8,11,.92)) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.045), 0 14px 34px rgba(0,0,0,.18) !important; text-align: left !important; } html body #bp-dw.amici-v11-cart .bp-cart-handoff__tab.is-active { border-color: rgba(255,170,60,.74) !important; background: radial-gradient(circle at 18% 0%, rgba(255,220,150,.10), transparent 36%), linear-gradient(135deg, rgba(120,30,24,.96), rgba(103,37,23,.98), rgba(45,14,17,.98)) !important; box-shadow: 0 0 0 1px rgba(255,170,60,.14), 0 18px 42px rgba(160,42,28,.22), inset 0 1px 0 rgba(255,255,255,.07) !important; } html body #bp-dw.amici-v11-cart .amici-v11-handoff-icon { width: 72px !important; height: 72px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; color: #E0BC7A !important; font-size: 42px !important; line-height: 1 !important; } html body #bp-dw.amici-v11-cart .amici-v11-handoff-copy { display: grid !important; gap: 9px !important; } html body #bp-dw.amici-v11-cart .amici-v11-handoff-copy strong { color: #FFF5E7 !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 32px !important; font-weight: 950 !important; line-height: 1 !important; letter-spacing: -.03em !important; } html body #bp-dw.amici-v11-cart .amici-v11-handoff-copy small { color: rgba(245,234,216,.58) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 22px !important; font-weight: 850 !important; line-height: 1.1 !important; } /* ========================================================================== DELIVERY ZONES ========================================================================== */ html body #bp-dw.amici-v11-cart .amici-v11-delivery-fields { display: grid !important; gap: 34px !important; } html body #bp-dw.amici-v11-cart .bp-delivery-zone-box { display: grid !important; gap: 18px !important; padding: 24px !important; border-radius: 24px !important; border: 1px solid rgba(255,235,210,.12) !important; background: radial-gradient(circle at 14% 0%, rgba(224,188,122,.07), transparent 38%), linear-gradient(145deg, rgba(18,7,13,.88), rgba(8,3,6,.96)) !important; box-shadow: 0 16px 38px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.04) !important; } html body #bp-dw.amici-v11-cart .bp-delivery-zone-box__top { display: block !important; margin: 0 !important; } html body #bp-dw.amici-v11-cart .bp-delivery-zone-box__kicker { color: rgba(224,188,122,.88) !important; font-family: "Oswald", "Nunito", system-ui, sans-serif !important; font-size: 18px !important; font-weight: 900 !important; line-height: 1 !important; letter-spacing: .20em !important; text-transform: uppercase !important; } html body #bp-dw.amici-v11-cart .bp-delivery-zone-box__title, html body #bp-dw.amici-v11-cart .bp-delivery-zone-box__price { display: none !important; } html body #bp-dw.amici-v11-cart .bp-delivery-zone-options { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 20px !important; } html body #bp-dw.amici-v11-cart .bp-delivery-zone-btn { position: relative !important; min-height: 188px !important; padding: 34px 18px 26px !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; border-radius: 22px !important; border: 1px solid rgba(255,235,210,.12) !important; background: radial-gradient(circle at 50% 12%, rgba(255,255,255,.045), transparent 32%), linear-gradient(145deg, rgba(37,25,28,.72), rgba(18,10,13,.92)) !important; text-align: center !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 12px 28px rgba(0,0,0,.16) !important; } html body #bp-dw.amici-v11-cart .bp-delivery-zone-btn::before { content: "📍" !important; margin-bottom: 18px !important; display: block !important; font-size: 42px !important; line-height: 1 !important; filter: grayscale(.45) brightness(.82) !important; opacity: .82 !important; } html body #bp-dw.amici-v11-cart .bp-delivery-zone-btn.is-active { border-color: rgba(255,160,62,.88) !important; background: radial-gradient(circle at 50% 0%, rgba(255,220,150,.12), transparent 34%), linear-gradient(145deg, rgba(194,68,42,.95), rgba(118,31,26,.96)) !important; box-shadow: 0 0 0 1px rgba(255,160,62,.18), 0 18px 38px rgba(194,68,42,.18), inset 0 1px 0 rgba(255,255,255,.08) !important; } html body #bp-dw.amici-v11-cart .bp-delivery-zone-btn.is-active::before { filter: none !important; opacity: 1 !important; } html body #bp-dw.amici-v11-cart .bp-delivery-zone-btn.is-active::after { content: "✓" !important; position: absolute !important; top: -12px !important; right: -10px !important; width: 46px !important; height: 46px !important; display: flex !important; align-items: center !important; justify-content: center !important; border-radius: 999px !important; background: radial-gradient(circle at 30% 20%, rgba(255,255,255,.28), transparent 42%), linear-gradient(135deg, #FFD06A, #E3A437) !important; color: #15070a !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 26px !important; font-weight: 950 !important; } html body #bp-dw.amici-v11-cart .bp-delivery-zone-btn__name { color: #FFF5E7 !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 27px !important; font-weight: 950 !important; line-height: 1.05 !important; letter-spacing: -.02em !important; } html body #bp-dw.amici-v11-cart .bp-delivery-zone-btn__fee { margin-top: 12px !important; color: #FFE0A0 !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 23px !important; font-weight: 950 !important; line-height: 1 !important; } /* ========================================================================== ADDRESS SECTION ========================================================================== */ html body #bp-dw.amici-v11-cart .amici-v11-address-section { display: grid !important; gap: 16px !important; } html body #bp-dw.amici-v11-cart .amici-v11-address-title { color: rgba(245,234,216,.86) !important; font-family: "Oswald", "Nunito", system-ui, sans-serif !important; font-size: 22px !important; font-weight: 900 !important; line-height: 1 !important; letter-spacing: .22em !important; text-transform: uppercase !important; } html body #bp-dw.amici-v11-cart .amici-v11-address-card { display: grid !important; gap: 14px !important; padding: 24px !important; border-radius: 24px !important; border: 1px solid rgba(255,235,210,.12) !important; background: radial-gradient(circle at 12% 0%, rgba(224,188,122,.06), transparent 36%), linear-gradient(145deg, rgba(30,18,20,.82), rgba(13,6,9,.94)) !important; box-shadow: 0 16px 38px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.04) !important; } html body #bp-dw.amici-v11-cart .amici-v11-address-subtitle { color: rgba(245,234,216,.76) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 18px !important; font-weight: 850 !important; line-height: 1.2 !important; } html body #bp-dw.amici-v11-cart .amici-v11-address-list { display: grid !important; gap: 12px !important; } html body #bp-dw.amici-v11-cart .amici-v11-address-row { display: grid !important; grid-template-columns: minmax(0, 1fr) 74px !important; gap: 0 !important; border-radius: 18px !important; border: 1px solid rgba(255,235,210,.10) !important; background: radial-gradient(circle at 12% 0%, rgba(255,255,255,.035), transparent 32%), linear-gradient(145deg, rgba(33,24,27,.78), rgba(19,11,14,.92)) !important; overflow: hidden !important; } html body #bp-dw.amici-v11-cart .amici-v11-address-row.is-active { border-color: rgba(255,160,62,.36) !important; background: radial-gradient(circle at 12% 0%, rgba(255,160,62,.07), transparent 34%), linear-gradient(145deg, rgba(42,30,28,.84), rgba(20,12,14,.94)) !important; } html body #bp-dw.amici-v11-cart .amici-v11-address-pick { min-height: 142px !important; display: grid !important; grid-template-columns: 58px minmax(0, 1fr) auto !important; align-items: center !important; gap: 18px !important; width: 100% !important; padding: 24px 18px 24px 22px !important; border: 0 !important; background: transparent !important; text-align: left !important; cursor: pointer !important; } html body #bp-dw.amici-v11-cart .amici-v11-address-radio { width: 38px !important; height: 38px !important; border-radius: 999px !important; border: 2px solid rgba(245,234,216,.28) !important; background: rgba(0,0,0,.12) !important; } html body #bp-dw.amici-v11-cart .amici-v11-address-row.is-active .amici-v11-address-radio { border-color: rgba(255,160,62,.94) !important; background: radial-gradient(circle, #FFD06A 0 38%, transparent 40%), rgba(255,160,62,.14) !important; box-shadow: 0 0 0 5px rgba(255,160,62,.08) !important; } html body #bp-dw.amici-v11-cart .amici-v11-address-copy { display: grid !important; gap: 8px !important; min-width: 0 !important; } html body #bp-dw.amici-v11-cart .amici-v11-address-main { color: #FFF5E7 !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 26px !important; font-weight: 950 !important; line-height: 1.18 !important; letter-spacing: -.02em !important; } html body #bp-dw.amici-v11-cart .amici-v11-address-note { color: rgba(245,234,216,.56) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 20px !important; font-weight: 800 !important; line-height: 1.28 !important; } html body #bp-dw.amici-v11-cart .amici-v11-address-badge { min-height: 42px !important; padding: 0 16px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; border-radius: 999px !important; border: 1px solid rgba(224,188,122,.28) !important; background: rgba(224,188,122,.10) !important; color: #FFE0A0 !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 14px !important; font-weight: 950 !important; } html body #bp-dw.amici-v11-cart .amici-v11-address-delete { width: 74px !important; min-width: 74px !important; display: flex !important; align-items: center !important; justify-content: center !important; border: 0 !important; border-left: 1px solid rgba(255,235,210,.11) !important; background: transparent !important; color: rgba(255,115,115,.82) !important; font-size: 25px !important; cursor: pointer !important; } html body #bp-dw.amici-v11-cart .amici-v11-new-address { min-height: 70px !important; display: flex !important; align-items: center !important; justify-content: center !important; border-radius: 16px !important; border: 1px dashed rgba(255,160,62,.62) !important; background: linear-gradient(145deg, rgba(255,160,62,.045), rgba(255,160,62,.015)) !important; color: #FFE0A0 !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 24px !important; font-weight: 950 !important; letter-spacing: .02em !important; cursor: pointer !important; } /* Manual address inputs */ html body #bp-dw.amici-v11-cart .amici-v11-field { display: grid !important; gap: 10px !important; } html body #bp-dw.amici-v11-cart .amici-v11-field span { color: rgba(245,234,216,.78) !important; font-family: "Oswald", "Nunito", system-ui, sans-serif !important; font-size: 17px !important; font-weight: 900 !important; letter-spacing: .16em !important; text-transform: uppercase !important; } html body #bp-dw.amici-v11-cart .amici-v11-field input { min-height: 68px !important; padding: 0 22px !important; border-radius: 18px !important; border: 1px solid rgba(255,235,210,.12) !important; background: rgba(0,0,0,.24) !important; color: #FFF5E7 !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 22px !important; font-weight: 850 !important; } /* ========================================================================== REMOVE NOISE ========================================================================== */ html body #bp-dw.amici-v11-cart .bp-delivery-map-box, html body #bp-dw.amici-v11-cart .bp-map-compact-card, html body #bp-dw.amici-v11-cart .bp-cart-delivery-note, html body #bp-dw.amici-v11-cart .bp-note, html body #bp-dw.amici-v11-cart .bp-t.m { display: none !important; } /* ========================================================================== FOOTER ========================================================================== */ html body #bp-dw.amici-v11-cart .bp-dw__f { padding: 26px 44px 34px !important; display: grid !important; gap: 18px !important; border-top: 1px solid rgba(224,188,122,.11) !important; background: linear-gradient(180deg, rgba(255,255,255,.015), rgba(0,0,0,.16)) !important; } html body #bp-dw.amici-v11-cart .bp-t:not(.m) { display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; align-items: end !important; gap: 18px !important; margin: 0 !important; padding: 0 !important; } html body #bp-dw.amici-v11-cart .bp-t:not(.m) span { color: #FFF5E7 !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 27px !important; font-weight: 950 !important; line-height: 1 !important; } html body #bp-dw.amici-v11-cart .bp-t:not(.m) span::after { content: "Вкл. ДДС" !important; display: block !important; margin-top: 9px !important; color: rgba(245,234,216,.54) !important; font-size: 16px !important; font-weight: 800 !important; } html body #bp-dw.amici-v11-cart .bp-t:not(.m) b { color: #FFF5E7 !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 42px !important; font-weight: 950 !important; line-height: 1 !important; letter-spacing: -.04em !important; } html body #bp-dw.amici-v11-cart .bp-check { min-height: 78px !important; margin: 0 !important; border-radius: 18px !important; border: 0 !important; background: radial-gradient(circle at 20% 0%, rgba(255,255,255,.12), transparent 38%), linear-gradient(135deg, #C94735, #9A2F2B 56%, #6C1B22) !important; color: #FFF5E7 !important; font-family: "Oswald", "Nunito", system-ui, sans-serif !important; font-size: 26px !important; font-weight: 900 !important; letter-spacing: .09em !important; text-transform: uppercase !important; box-shadow: 0 18px 42px rgba(160,42,28,.26), inset 0 1px 0 rgba(255,255,255,.12) !important; } html body #bp-dw.amici-v11-cart .bp-check::after { content: "→" !important; margin-left: 22px !important; font-size: 42px !important; line-height: 0 !important; } html body #bp-dw.amici-v11-cart .bp-dw__f::after { content: "🔒 Сигурна поръчка и защита на данните" !important; display: block !important; text-align: center !important; color: rgba(245,234,216,.46) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 18px !important; font-weight: 800 !important; } /* ========================================================================== MOBILE SCALE ========================================================================== */ @media (max-width: 680px) { html body #bp-dw.amici-v11-cart { padding: 8px !important; } html body #bp-dw.amici-v11-cart .bp-dw__panel { width: 100% !important; max-width: 100% !important; border-radius: 22px !important; } html body #bp-dw.amici-v11-cart .bp-dw__h { min-height: 74px !important; padding: 20px 18px 18px !important; } html body #bp-dw.amici-v11-cart .bp-dw__h b { gap: 10px !important; font-size: 28px !important; } html body #bp-dw.amici-v11-cart .amici-v11-count-badge { min-height: 30px !important; padding: 0 12px !important; font-size: 13px !important; } html body #bp-dw.amici-v11-cart .bp-dw__x { width: 48px !important; height: 48px !important; font-size: 27px !important; } html body #bp-dw.amici-v11-cart .bp-dw__b { padding: 24px 16px 18px !important; } html body #bp-dw.amici-v11-cart .bp-cart-handoff__kicker { font-size: 14px !important; letter-spacing: .18em !important; } html body #bp-dw.amici-v11-cart .bp-cart-handoff__title { font-size: 25px !important; } html body #bp-dw.amici-v11-cart .bp-cart-handoff__tabs { gap: 12px !important; } html body #bp-dw.amici-v11-cart .bp-cart-handoff__tab { min-height: 112px !important; padding: 18px 12px !important; grid-template-columns: 1fr !important; justify-items: center !important; gap: 10px !important; text-align: center !important; border-radius: 22px !important; } html body #bp-dw.amici-v11-cart .amici-v11-handoff-icon { width: 38px !important; height: 38px !important; font-size: 30px !important; } html body #bp-dw.amici-v11-cart .amici-v11-handoff-copy strong { font-size: 22px !important; } html body #bp-dw.amici-v11-cart .amici-v11-handoff-copy small { font-size: 14px !important; } html body #bp-dw.amici-v11-cart .bp-delivery-zone-box { padding: 18px !important; border-radius: 22px !important; } html body #bp-dw.amici-v11-cart .bp-delivery-zone-box__kicker { font-size: 13px !important; letter-spacing: .17em !important; } html body #bp-dw.amici-v11-cart .bp-delivery-zone-options { gap: 12px !important; } html body #bp-dw.amici-v11-cart .bp-delivery-zone-btn { min-height: 124px !important; padding: 22px 8px 18px !important; border-radius: 18px !important; } html body #bp-dw.amici-v11-cart .bp-delivery-zone-btn::before { margin-bottom: 12px !important; font-size: 30px !important; } html body #bp-dw.amici-v11-cart .bp-delivery-zone-btn.is-active::after { width: 36px !important; height: 36px !important; top: -9px !important; right: -8px !important; font-size: 21px !important; } html body #bp-dw.amici-v11-cart .bp-delivery-zone-btn__name { font-size: 16px !important; } html body #bp-dw.amici-v11-cart .bp-delivery-zone-btn__fee { margin-top: 8px !important; font-size: 14px !important; } html body #bp-dw.amici-v11-cart .amici-v11-address-title { font-size: 15px !important; letter-spacing: .19em !important; } html body #bp-dw.amici-v11-cart .amici-v11-address-card { padding: 16px !important; border-radius: 22px !important; } html body #bp-dw.amici-v11-cart .amici-v11-address-subtitle { font-size: 15px !important; } html body #bp-dw.amici-v11-cart .amici-v11-address-row { grid-template-columns: minmax(0, 1fr) 54px !important; } html body #bp-dw.amici-v11-cart .amici-v11-address-pick { min-height: 112px !important; grid-template-columns: 42px minmax(0, 1fr) auto !important; gap: 12px !important; padding: 18px 12px 18px 14px !important; } html body #bp-dw.amici-v11-cart .amici-v11-address-radio { width: 30px !important; height: 30px !important; } html body #bp-dw.amici-v11-cart .amici-v11-address-main { font-size: 17px !important; } html body #bp-dw.amici-v11-cart .amici-v11-address-note { font-size: 14px !important; } html body #bp-dw.amici-v11-cart .amici-v11-address-badge { min-height: 32px !important; padding: 0 10px !important; font-size: 11px !important; } html body #bp-dw.amici-v11-cart .amici-v11-address-delete { width: 54px !important; min-width: 54px !important; font-size: 22px !important; } html body #bp-dw.amici-v11-cart .amici-v11-new-address { min-height: 58px !important; font-size: 18px !important; border-radius: 15px !important; } html body #bp-dw.amici-v11-cart .bp-dw__f { padding: 20px 16px 26px !important; } html body #bp-dw.amici-v11-cart .bp-t:not(.m) span { font-size: 22px !important; } html body #bp-dw.amici-v11-cart .bp-t:not(.m) b { font-size: 34px !important; } html body #bp-dw.amici-v11-cart .bp-check { min-height: 66px !important; font-size: 21px !important; } html body #bp-dw.amici-v11-cart .bp-dw__f::after { font-size: 13px !important; } } @media (max-width: 420px) { html body #bp-dw.amici-v11-cart .amici-v11-handoff-copy strong { font-size: 19px !important; } html body #bp-dw.amici-v11-cart .bp-delivery-zone-options { gap: 9px !important; } html body #bp-dw.amici-v11-cart .bp-delivery-zone-btn__name { font-size: 14px !important; } html body #bp-dw.amici-v11-cart .amici-v11-address-pick { grid-template-columns: 34px minmax(0, 1fr) !important; } html body #bp-dw.amici-v11-cart .amici-v11-address-badge { grid-column: 2 !important; justify-self: start !important; } } /* ========================================================================== 🟣 AMICI CART CLEAN CSS — SINGLE FILE FINAL Сложи този блок най-долу в MenuAmici.css. Не зареждай втори CSS файл. ========================================================================== */ /* ========================================================================== 0) HARD RESET ONLY INSIDE CART ========================================================================== */ html body #bp-dw.amv-cart, html body #bp-root #bp-dw.amv-cart { --amv-bg-0: #070204; --amv-bg-1: #12060b; --amv-bg-2: #1d0b10; --amv-card: rgba(24, 10, 14, 0.92); --amv-card-2: rgba(39, 23, 26, 0.76); --amv-border: rgba(245, 234, 216, 0.12); --amv-border-gold: rgba(224, 188, 122, 0.24); --amv-gold: #e0bc7a; --amv-gold-2: #ffe0a0; --amv-text: #fff5e7; --amv-muted: rgba(245, 234, 216, 0.58); --amv-red: #c94735; --amv-red-dark: #6c1b22; position: fixed !important; inset: 0 !important; z-index: 2147482500 !important; width: 100vw !important; height: 100dvh !important; max-height: 100dvh !important; padding: 14px !important; overflow: hidden !important; background: rgba(0, 0, 0, 0.82) !important; box-sizing: border-box !important; } html body #bp-dw.amv-cart *, html body #bp-root #bp-dw.amv-cart * { box-sizing: border-box !important; min-width: 0 !important; } html body #bp-dw.amv-cart svg, html body #bp-root #bp-dw.amv-cart svg { display: block !important; } /* ========================================================================== 1) PANEL — HEADER / SCROLL BODY / FOOTER ========================================================================== */ html body #bp-dw.amv-cart .bp-dw__panel, html body #bp-root #bp-dw.amv-cart .bp-dw__panel { position: relative !important; width: min(990px, calc(100vw - 28px)) !important; max-width: min(990px, calc(100vw - 28px)) !important; height: calc(100dvh - 28px) !important; max-height: calc(100dvh - 28px) !important; min-height: 0 !important; margin: 0 auto !important; display: grid !important; grid-template-rows: auto minmax(0, 1fr) auto !important; overflow: hidden !important; border-radius: 26px !important; border: 1px solid rgba(224, 188, 122, 0.20) !important; background: radial-gradient(circle at 12% 0%, rgba(224, 188, 122, 0.10), transparent 34%), radial-gradient(circle at 100% 0%, rgba(166, 46, 42, 0.16), transparent 36%), linear-gradient(145deg, var(--amv-bg-2) 0%, var(--amv-bg-1) 56%, var(--amv-bg-0) 100%) !important; box-shadow: 0 30px 90px rgba(0, 0, 0, 0.78), inset 0 1px 0 rgba(255, 235, 210, 0.07) !important; } /* Header */ html body #bp-dw.amv-cart .bp-dw__h, html body #bp-root #bp-dw.amv-cart .bp-dw__h { grid-row: 1 !important; position: relative !important; inset: auto !important; min-height: 96px !important; padding: 28px 40px 23px !important; display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 18px !important; border-bottom: 1px solid rgba(224, 188, 122, 0.11) !important; background: linear-gradient(180deg, rgba(255, 255, 255, 0.035), rgba(255, 255, 255, 0)) !important; } html body #bp-dw.amv-cart .bp-dw__h b, html body #bp-root #bp-dw.amv-cart .bp-dw__h b { display: inline-flex !important; align-items: center !important; gap: 18px !important; margin: 0 !important; color: #f5ead8 !important; font-family: "Oswald", "Nunito", system-ui, sans-serif !important; font-size: 38px !important; font-style: normal !important; font-weight: 900 !important; line-height: 1 !important; letter-spacing: 0.05em !important; text-transform: uppercase !important; } html body #bp-dw.amv-cart .amv-count-badge, html body #bp-root #bp-dw.amv-cart .amv-count-badge { min-height: 36px !important; padding: 0 18px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; border-radius: 999px !important; border: 1px solid rgba(224, 188, 122, 0.28) !important; background: radial-gradient(circle at 24% 0%, rgba(255, 235, 190, 0.18), transparent 42%), linear-gradient(135deg, rgba(112, 64, 29, 0.72), rgba(34, 13, 18, 0.94)) !important; color: var(--amv-gold-2) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 16px !important; font-weight: 950 !important; line-height: 1 !important; text-transform: none !important; letter-spacing: 0 !important; white-space: nowrap !important; } html body #bp-dw.amv-cart .bp-dw__x, html body #bp-root #bp-dw.amv-cart .bp-dw__x { width: 60px !important; height: 60px !important; min-width: 60px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; border-radius: 999px !important; border: 1px solid rgba(255, 140, 140, 0.32) !important; background: radial-gradient(circle at 30% 20%, rgba(255, 255, 255, 0.16), transparent 42%), linear-gradient(145deg, rgba(125, 37, 43, 0.86), rgba(49, 16, 22, 0.96)) !important; color: #ffd8d0 !important; font-size: 34px !important; font-weight: 950 !important; line-height: 1 !important; box-shadow: 0 14px 30px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.10) !important; } /* Body */ html body #bp-dw.amv-cart .bp-dw__b, html body #bp-root #bp-dw.amv-cart .bp-dw__b { grid-row: 2 !important; position: relative !important; inset: auto !important; min-height: 0 !important; height: auto !important; max-height: none !important; overflow-y: auto !important; overflow-x: hidden !important; -webkit-overflow-scrolling: touch !important; overscroll-behavior: contain !important; padding: 34px 40px 30px !important; } /* ========================================================================== 🟣 AMICI CART — VISIBLE PRODUCT LINES Показва добавените продукти в количката, компактно и без да чупи layout-а. ========================================================================== */ html body #bp-dw.amv-cart #bp-lines, html body #bp-root #bp-dw.amv-cart #bp-lines { display: grid !important; gap: 18px !important; } /* Продуктите в количката */ html body #bp-dw.amv-cart #bp-lines > .bp-line, html body #bp-root #bp-dw.amv-cart #bp-lines > .bp-line { display: grid !important; grid-template-columns: 74px minmax(0, 1fr) auto !important; align-items: center !important; gap: 14px !important; width: 100% !important; padding: 12px !important; border-radius: 18px !important; border: 1px solid rgba(255, 235, 210, 0.10) !important; background: radial-gradient(circle at 12% 0%, rgba(255,255,255,0.04), transparent 34%), linear-gradient(145deg, rgba(33, 24, 27, 0.76), rgba(16, 8, 11, 0.92)) !important; box-shadow: 0 12px 26px rgba(0,0,0,0.18), inset 0 1px 0 rgba(255,255,255,0.04) !important; } /* Снимка */ html body #bp-dw.amv-cart #bp-lines > .bp-line img, html body #bp-root #bp-dw.amv-cart #bp-lines > .bp-line img { width: 74px !important; height: 74px !important; object-fit: cover !important; object-position: center !important; border-radius: 15px !important; border: 1px solid rgba(255,235,210,0.10) !important; background: rgba(0,0,0,0.18) !important; } /* Текстова част */ html body #bp-dw.amv-cart #bp-lines > .bp-line .b, html body #bp-root #bp-dw.amv-cart #bp-lines > .bp-line .b { display: grid !important; gap: 5px !important; min-width: 0 !important; } /* Име на продукта */ html body #bp-dw.amv-cart #bp-lines > .bp-line h4, html body #bp-root #bp-dw.amv-cart #bp-lines > .bp-line h4 { margin: 0 !important; color: #fff5e7 !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 17px !important; font-weight: 950 !important; line-height: 1.16 !important; white-space: normal !important; overflow-wrap: anywhere !important; } /* Детайли под продукта */ html body #bp-dw.amv-cart #bp-lines > .bp-line p, html body #bp-root #bp-dw.amv-cart #bp-lines > .bp-line p { margin: 0 !important; color: rgba(245,234,216,0.58) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 12.5px !important; font-weight: 800 !important; line-height: 1.28 !important; } /* Цена/количество зона */ html body #bp-dw.amv-cart #bp-lines > .bp-line .r, html body #bp-root #bp-dw.amv-cart #bp-lines > .bp-line .r { display: grid !important; justify-items: end !important; gap: 8px !important; } /* Цена */ html body #bp-dw.amv-cart #bp-lines > .bp-line .r b, html body #bp-root #bp-dw.amv-cart #bp-lines > .bp-line .r b { color: #ffe0a0 !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 18px !important; font-weight: 950 !important; line-height: 1 !important; white-space: nowrap !important; } /* Qty controls */ html body #bp-dw.amv-cart #bp-lines > .bp-line .q, html body #bp-root #bp-dw.amv-cart #bp-lines > .bp-line .q { display: inline-flex !important; align-items: center !important; gap: 7px !important; padding: 5px !important; border-radius: 999px !important; border: 1px solid rgba(255,235,210,0.12) !important; background: rgba(0,0,0,0.22) !important; } html body #bp-dw.amv-cart #bp-lines > .bp-line .q button, html body #bp-root #bp-dw.amv-cart #bp-lines > .bp-line .q button { width: 28px !important; height: 28px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; border: 0 !important; border-radius: 999px !important; background: rgba(224,188,122,0.14) !important; color: #ffe0a0 !important; font-size: 18px !important; font-weight: 950 !important; line-height: 1 !important; } html body #bp-dw.amv-cart #bp-lines > .bp-line .q span, html body #bp-root #bp-dw.amv-cart #bp-lines > .bp-line .q span { min-width: 22px !important; color: #fff5e7 !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 14px !important; font-weight: 950 !important; text-align: center !important; } /* Разстояние между продуктите и delivery секцията */ html body #bp-dw.amv-cart #bp-lines > .bp-line + .amv-handoff, html body #bp-root #bp-dw.amv-cart #bp-lines > .bp-line + .amv-handoff, html body #bp-dw.amv-cart #bp-lines > .amv-handoff, html body #bp-root #bp-dw.amv-cart #bp-lines > .amv-handoff { margin-top: 8px !important; } /* Mobile */ @media (max-width: 680px) { html body #bp-dw.amv-cart #bp-lines, html body #bp-root #bp-dw.amv-cart #bp-lines { gap: 14px !important; } html body #bp-dw.amv-cart #bp-lines > .bp-line, html body #bp-root #bp-dw.amv-cart #bp-lines > .bp-line { grid-template-columns: 58px minmax(0, 1fr) auto !important; gap: 10px !important; padding: 10px !important; border-radius: 16px !important; } html body #bp-dw.amv-cart #bp-lines > .bp-line img, html body #bp-root #bp-dw.amv-cart #bp-lines > .bp-line img { width: 58px !important; height: 58px !important; border-radius: 13px !important; } html body #bp-dw.amv-cart #bp-lines > .bp-line h4, html body #bp-root #bp-dw.amv-cart #bp-lines > .bp-line h4 { font-size: 14px !important; } html body #bp-dw.amv-cart #bp-lines > .bp-line p, html body #bp-root #bp-dw.amv-cart #bp-lines > .bp-line p { font-size: 11px !important; } html body #bp-dw.amv-cart #bp-lines > .bp-line .r b, html body #bp-root #bp-dw.amv-cart #bp-lines > .bp-line .r b { font-size: 15px !important; } html body #bp-dw.amv-cart #bp-lines > .bp-line .q { gap: 5px !important; padding: 4px !important; } html body #bp-dw.amv-cart #bp-lines > .bp-line .q button { width: 24px !important; height: 24px !important; font-size: 15px !important; } html body #bp-dw.amv-cart #bp-lines > .bp-line .q span { min-width: 18px !important; font-size: 12px !important; } } /* Footer */ html body #bp-dw.amv-cart .bp-dw__f, html body #bp-root #bp-dw.amv-cart .bp-dw__f { grid-row: 3 !important; position: relative !important; inset: auto !important; transform: none !important; min-height: 0 !important; padding: 24px 40px calc(30px + env(safe-area-inset-bottom)) !important; display: grid !important; gap: 18px !important; border-top: 1px solid rgba(224, 188, 122, 0.11) !important; background: linear-gradient(180deg, rgba(255, 255, 255, 0.015), rgba(0, 0, 0, 0.16)), rgba(8, 2, 5, 0.98) !important; z-index: 5 !important; } /* Забрана стар CSS да прави footer children absolute/fixed */ html body #bp-dw.amv-cart .bp-dw__f *, html body #bp-root #bp-dw.amv-cart .bp-dw__f * { position: relative !important; } /* ========================================================================== 2) HANDOFF BLOCK ========================================================================== */ html body #bp-dw.amv-cart .amv-handoff, html body #bp-root #bp-dw.amv-cart .amv-handoff { width: 100% !important; display: grid !important; gap: 24px !important; } html body #bp-dw.amv-cart .amv-handoff__head, html body #bp-root #bp-dw.amv-cart .amv-handoff__head { display: grid !important; gap: 12px !important; } html body #bp-dw.amv-cart .amv-kicker, html body #bp-root #bp-dw.amv-cart .amv-kicker { color: rgba(224, 188, 122, 0.88) !important; font-family: "Oswald", "Nunito", system-ui, sans-serif !important; font-size: 22px !important; font-weight: 900 !important; line-height: 1 !important; letter-spacing: 0.22em !important; text-transform: uppercase !important; } html body #bp-dw.amv-cart .amv-handoff__title, html body #bp-root #bp-dw.amv-cart .amv-handoff__title { color: var(--amv-text) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 36px !important; font-weight: 950 !important; line-height: 1.06 !important; letter-spacing: -0.035em !important; } html body #bp-dw.amv-cart .amv-handoff__tabs, html body #bp-root #bp-dw.amv-cart .amv-handoff__tabs { width: 100% !important; display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 18px !important; } html body #bp-dw.amv-cart .amv-handoff-tab, html body #bp-root #bp-dw.amv-cart .amv-handoff-tab { width: 100% !important; min-width: 0 !important; min-height: 150px !important; padding: 26px 34px !important; display: grid !important; grid-template-columns: 76px minmax(0, 1fr) !important; align-items: center !important; gap: 22px !important; border-radius: 24px !important; border: 1px solid rgba(255, 235, 210, 0.13) !important; background: radial-gradient(circle at 18% 0%, rgba(255, 235, 210, 0.05), transparent 36%), linear-gradient(145deg, rgba(42, 26, 28, 0.74), rgba(16, 8, 11, 0.92)) !important; color: rgba(245, 234, 216, 0.70) !important; text-align: left !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.045), 0 14px 34px rgba(0, 0, 0, 0.18) !important; cursor: pointer !important; } html body #bp-dw.amv-cart .amv-handoff-tab.is-active, html body #bp-root #bp-dw.amv-cart .amv-handoff-tab.is-active { border-color: rgba(255, 170, 60, 0.74) !important; background: radial-gradient(circle at 18% 0%, rgba(255, 220, 150, 0.10), transparent 36%), linear-gradient(135deg, rgba(120, 30, 24, 0.96), rgba(103, 37, 23, 0.98), rgba(45, 14, 17, 0.98)) !important; box-shadow: 0 0 0 1px rgba(255, 170, 60, 0.14), 0 18px 42px rgba(160, 42, 28, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.07) !important; } html body #bp-dw.amv-cart .amv-handoff-tab__icon, html body #bp-root #bp-dw.amv-cart .amv-handoff-tab__icon { width: 72px !important; height: 72px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; color: var(--amv-gold) !important; } html body #bp-dw.amv-cart .amv-handoff-tab__copy, html body #bp-root #bp-dw.amv-cart .amv-handoff-tab__copy { display: grid !important; gap: 9px !important; } html body #bp-dw.amv-cart .amv-handoff-tab__copy strong, html body #bp-root #bp-dw.amv-cart .amv-handoff-tab__copy strong { color: var(--amv-text) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 32px !important; font-weight: 950 !important; line-height: 1 !important; letter-spacing: -0.03em !important; } html body #bp-dw.amv-cart .amv-handoff-tab__copy small, html body #bp-root #bp-dw.amv-cart .amv-handoff-tab__copy small { color: var(--amv-muted) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 22px !important; font-weight: 850 !important; line-height: 1.1 !important; } /* ========================================================================== 3) DELIVERY ZONES ========================================================================== */ html body #bp-dw.amv-cart .amv-delivery, html body #bp-root #bp-dw.amv-cart .amv-delivery { display: grid !important; gap: 34px !important; } html body #bp-dw.amv-cart .amv-zone, html body #bp-root #bp-dw.amv-cart .amv-zone { width: 100% !important; display: grid !important; gap: 18px !important; padding: 24px !important; border-radius: 24px !important; border: 1px solid rgba(255, 235, 210, 0.12) !important; background: radial-gradient(circle at 14% 0%, rgba(224, 188, 122, 0.07), transparent 38%), linear-gradient(145deg, rgba(18, 7, 13, 0.88), rgba(8, 3, 6, 0.96)) !important; box-shadow: 0 16px 38px rgba(0, 0, 0, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.04) !important; } html body #bp-dw.amv-cart .amv-zone__label, html body #bp-root #bp-dw.amv-cart .amv-zone__label { color: rgba(224, 188, 122, 0.88) !important; font-family: "Oswald", "Nunito", system-ui, sans-serif !important; font-size: 18px !important; font-weight: 900 !important; line-height: 1 !important; letter-spacing: 0.20em !important; text-transform: uppercase !important; } html body #bp-dw.amv-cart .amv-zone__grid, html body #bp-root #bp-dw.amv-cart .amv-zone__grid { width: 100% !important; display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 20px !important; } html body #bp-dw.amv-cart .amv-zone-btn, html body #bp-root #bp-dw.amv-cart .amv-zone-btn { position: relative !important; width: 100% !important; min-width: 0 !important; min-height: 188px !important; padding: 32px 18px 26px !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; border-radius: 22px !important; border: 1px solid rgba(255, 235, 210, 0.12) !important; background: radial-gradient(circle at 50% 12%, rgba(255, 255, 255, 0.045), transparent 32%), linear-gradient(145deg, rgba(37, 25, 28, 0.72), rgba(18, 10, 13, 0.92)) !important; color: rgba(245, 234, 216, 0.70) !important; text-align: center !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04), 0 12px 28px rgba(0, 0, 0, 0.16) !important; cursor: pointer !important; } html body #bp-dw.amv-cart .amv-zone-btn.is-active, html body #bp-root #bp-dw.amv-cart .amv-zone-btn.is-active { border-color: rgba(255, 160, 62, 0.88) !important; background: radial-gradient(circle at 50% 0%, rgba(255, 220, 150, 0.12), transparent 34%), linear-gradient(145deg, rgba(194, 68, 42, 0.95), rgba(118, 31, 26, 0.96)) !important; box-shadow: 0 0 0 1px rgba(255, 160, 62, 0.18), 0 18px 38px rgba(194, 68, 42, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important; } html body #bp-dw.amv-cart .amv-zone-btn__mark, html body #bp-root #bp-dw.amv-cart .amv-zone-btn__mark { position: absolute !important; top: -12px !important; right: -10px !important; width: 46px !important; height: 46px !important; display: none !important; align-items: center !important; justify-content: center !important; border-radius: 999px !important; background: radial-gradient(circle at 30% 20%, rgba(255, 255, 255, 0.28), transparent 42%), linear-gradient(135deg, #ffd06a, #e3a437) !important; color: #15070a !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 26px !important; font-weight: 950 !important; line-height: 1 !important; box-shadow: 0 10px 22px rgba(0, 0, 0, 0.26), inset 0 1px 0 rgba(255, 255, 255, 0.22) !important; } html body #bp-dw.amv-cart .amv-zone-btn.is-active .amv-zone-btn__mark, html body #bp-root #bp-dw.amv-cart .amv-zone-btn.is-active .amv-zone-btn__mark { display: flex !important; } html body #bp-dw.amv-cart .amv-zone-btn__icon, html body #bp-root #bp-dw.amv-cart .amv-zone-btn__icon { width: 46px !important; height: 46px !important; margin-bottom: 18px !important; display: inline-flex !important; color: rgba(245, 234, 216, 0.48) !important; } html body #bp-dw.amv-cart .amv-zone-btn.is-active .amv-zone-btn__icon, html body #bp-root #bp-dw.amv-cart .amv-zone-btn.is-active .amv-zone-btn__icon { color: var(--amv-gold-2) !important; } html body #bp-dw.amv-cart .amv-zone-btn__name, html body #bp-root #bp-dw.amv-cart .amv-zone-btn__name { color: var(--amv-text) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 27px !important; font-weight: 950 !important; line-height: 1.05 !important; letter-spacing: -0.02em !important; } html body #bp-dw.amv-cart .amv-zone-btn__fee, html body #bp-root #bp-dw.amv-cart .amv-zone-btn__fee { margin-top: 12px !important; color: var(--amv-gold-2) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 23px !important; font-weight: 950 !important; line-height: 1 !important; } /* ========================================================================== 4) ADDRESS SECTION ========================================================================== */ html body #bp-dw.amv-cart .amv-address, html body #bp-root #bp-dw.amv-cart .amv-address { display: grid !important; gap: 16px !important; padding-bottom: 2px !important; } html body #bp-dw.amv-cart .amv-address__title, html body #bp-root #bp-dw.amv-cart .amv-address__title { color: rgba(245, 234, 216, 0.86) !important; font-family: "Oswald", "Nunito", system-ui, sans-serif !important; font-size: 22px !important; font-weight: 900 !important; line-height: 1 !important; letter-spacing: 0.22em !important; text-transform: uppercase !important; } html body #bp-dw.amv-cart .amv-address__box, html body #bp-root #bp-dw.amv-cart .amv-address__box { display: grid !important; gap: 14px !important; padding: 24px !important; border-radius: 24px !important; border: 1px solid rgba(255, 235, 210, 0.12) !important; background: radial-gradient(circle at 12% 0%, rgba(224, 188, 122, 0.06), transparent 36%), linear-gradient(145deg, rgba(30, 18, 20, 0.82), rgba(13, 6, 9, 0.94)) !important; box-shadow: 0 16px 38px rgba(0, 0, 0, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.04) !important; } html body #bp-dw.amv-cart .amv-address__subtitle, html body #bp-root #bp-dw.amv-cart .amv-address__subtitle { color: rgba(245, 234, 216, 0.76) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 18px !important; font-weight: 850 !important; line-height: 1.2 !important; } html body #bp-dw.amv-cart .amv-address__list, html body #bp-root #bp-dw.amv-cart .amv-address__list { display: grid !important; gap: 12px !important; } /* Saved address rows */ html body #bp-dw.amv-cart .amv-address-row, html body #bp-root #bp-dw.amv-cart .amv-address-row { display: grid !important; grid-template-columns: minmax(0, 1fr) 74px !important; gap: 0 !important; border-radius: 18px !important; border: 1px solid rgba(255, 235, 210, 0.10) !important; background: radial-gradient(circle at 12% 0%, rgba(255, 255, 255, 0.035), transparent 32%), linear-gradient(145deg, rgba(33, 24, 27, 0.78), rgba(19, 11, 14, 0.92)) !important; overflow: hidden !important; } html body #bp-dw.amv-cart .amv-address-row.is-active, html body #bp-root #bp-dw.amv-cart .amv-address-row.is-active { border-color: rgba(255, 160, 62, 0.36) !important; background: radial-gradient(circle at 12% 0%, rgba(255, 160, 62, 0.07), transparent 34%), linear-gradient(145deg, rgba(42, 30, 28, 0.84), rgba(20, 12, 14, 0.94)) !important; } html body #bp-dw.amv-cart .amv-address-pick, html body #bp-root #bp-dw.amv-cart .amv-address-pick { min-height: 142px !important; display: grid !important; grid-template-columns: 58px minmax(0, 1fr) auto !important; align-items: center !important; gap: 18px !important; width: 100% !important; padding: 24px 18px 24px 22px !important; border: 0 !important; background: transparent !important; text-align: left !important; cursor: pointer !important; } html body #bp-dw.amv-cart .amv-address-radio, html body #bp-root #bp-dw.amv-cart .amv-address-radio { width: 38px !important; height: 38px !important; border-radius: 999px !important; border: 2px solid rgba(245, 234, 216, 0.28) !important; background: rgba(0, 0, 0, 0.12) !important; } html body #bp-dw.amv-cart .amv-address-row.is-active .amv-address-radio, html body #bp-root #bp-dw.amv-cart .amv-address-row.is-active .amv-address-radio { border-color: rgba(255, 160, 62, 0.94) !important; background: radial-gradient(circle, #ffd06a 0 38%, transparent 40%), rgba(255, 160, 62, 0.14) !important; box-shadow: 0 0 0 5px rgba(255, 160, 62, 0.08) !important; } html body #bp-dw.amv-cart .amv-address-copy, html body #bp-root #bp-dw.amv-cart .amv-address-copy { display: grid !important; gap: 8px !important; } html body #bp-dw.amv-cart .amv-address-main, html body #bp-root #bp-dw.amv-cart .amv-address-main { color: var(--amv-text) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 26px !important; font-weight: 950 !important; line-height: 1.18 !important; letter-spacing: -0.02em !important; } html body #bp-dw.amv-cart .amv-address-note, html body #bp-root #bp-dw.amv-cart .amv-address-note { color: rgba(245, 234, 216, 0.56) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 20px !important; font-weight: 800 !important; line-height: 1.28 !important; } html body #bp-dw.amv-cart .amv-address-badge, html body #bp-root #bp-dw.amv-cart .amv-address-badge { min-height: 42px !important; padding: 0 16px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; border-radius: 999px !important; border: 1px solid rgba(224, 188, 122, 0.28) !important; background: rgba(224, 188, 122, 0.10) !important; color: var(--amv-gold-2) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 14px !important; font-weight: 950 !important; } html body #bp-dw.amv-cart .amv-address-delete, html body #bp-root #bp-dw.amv-cart .amv-address-delete { width: 74px !important; min-width: 74px !important; display: flex !important; align-items: center !important; justify-content: center !important; border: 0 !important; border-left: 1px solid rgba(255, 235, 210, 0.11) !important; background: transparent !important; color: rgba(255, 115, 115, 0.82) !important; cursor: pointer !important; } html body #bp-dw.amv-cart .amv-address-delete svg, html body #bp-root #bp-dw.amv-cart .amv-address-delete svg { width: 30px !important; height: 30px !important; } /* Manual address fields */ html body #bp-dw.amv-cart .amv-field, html body #bp-root #bp-dw.amv-cart .amv-field { display: grid !important; gap: 10px !important; } html body #bp-dw.amv-cart .amv-field span, html body #bp-root #bp-dw.amv-cart .amv-field span { color: rgba(245, 234, 216, 0.78) !important; font-family: "Oswald", "Nunito", system-ui, sans-serif !important; font-size: 17px !important; font-weight: 900 !important; line-height: 1 !important; letter-spacing: 0.16em !important; text-transform: uppercase !important; } html body #bp-dw.amv-cart .amv-field input, html body #bp-root #bp-dw.amv-cart .amv-field input { width: 100% !important; min-height: 68px !important; padding: 0 22px !important; border-radius: 18px !important; border: 1px solid rgba(255, 235, 210, 0.12) !important; background: rgba(0, 0, 0, 0.24) !important; color: var(--amv-text) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 22px !important; font-weight: 850 !important; } html body #bp-dw.amv-cart .amv-new-address, html body #bp-root #bp-dw.amv-cart .amv-new-address { width: 100% !important; min-height: 70px !important; display: flex !important; align-items: center !important; justify-content: center !important; border-radius: 16px !important; border: 1px dashed rgba(255, 160, 62, 0.62) !important; background: linear-gradient(145deg, rgba(255, 160, 62, 0.045), rgba(255, 160, 62, 0.015)) !important; color: var(--amv-gold-2) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 24px !important; font-weight: 950 !important; letter-spacing: 0.02em !important; cursor: pointer !important; } html body #bp-dw.amv-cart .amv-new-address.is-muted, html body #bp-root #bp-dw.amv-cart .amv-new-address.is-muted { border-style: solid !important; border-color: rgba(255, 235, 210, 0.12) !important; background: rgba(255,255,255,0.035) !important; color: rgba(245,234,216,0.72) !important; } /* Pickup note */ html body #bp-dw.amv-cart .amv-pickup-note, html body #bp-root #bp-dw.amv-cart .amv-pickup-note { padding: 18px 20px !important; border-radius: 20px !important; border: 1px solid rgba(224, 188, 122, 0.16) !important; background: linear-gradient(145deg, rgba(30, 18, 20, 0.82), rgba(13, 6, 9, 0.94)) !important; display: grid !important; gap: 5px !important; } html body #bp-dw.amv-cart .amv-pickup-note strong, html body #bp-root #bp-dw.amv-cart .amv-pickup-note strong { color: var(--amv-text) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 18px !important; font-weight: 950 !important; } html body #bp-dw.amv-cart .amv-pickup-note span, html body #bp-root #bp-dw.amv-cart .amv-pickup-note span { color: rgba(245, 234, 216, 0.60) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 14px !important; font-weight: 800 !important; } /* Hide old/noisy fragments — NOTE MUST STAY VISIBLE */ html body #bp-dw.amv-cart .bp-delivery-map-box, html body #bp-dw.amv-cart .bp-map-compact-card, html body #bp-dw.amv-cart .bp-cart-delivery-note, html body #bp-dw.amv-cart .bp-t.m, html body #bp-root #bp-dw.amv-cart .bp-delivery-map-box, html body #bp-root #bp-dw.amv-cart .bp-map-compact-card, html body #bp-root #bp-dw.amv-cart .bp-cart-delivery-note, html body #bp-root #bp-dw.amv-cart .bp-t.m { display: none !important; } /* ========================================================================== 5) FOOTER / TOTAL / CHECKOUT ========================================================================== */ html body #bp-dw.amv-cart .bp-t:not(.m), html body #bp-root #bp-dw.amv-cart .bp-t:not(.m) { display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; align-items: end !important; gap: 18px !important; margin: 0 !important; padding: 0 !important; } html body #bp-dw.amv-cart .bp-t:not(.m) span, html body #bp-root #bp-dw.amv-cart .bp-t:not(.m) span { color: var(--amv-text) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 27px !important; font-weight: 950 !important; line-height: 1 !important; } html body #bp-dw.amv-cart .bp-t:not(.m) span::after, html body #bp-root #bp-dw.amv-cart .bp-t:not(.m) span::after { content: "Вкл. ДДС" !important; display: block !important; margin-top: 9px !important; color: rgba(245, 234, 216, 0.54) !important; font-size: 16px !important; font-weight: 800 !important; } html body #bp-dw.amv-cart .bp-t:not(.m) b, html body #bp-root #bp-dw.amv-cart .bp-t:not(.m) b { color: var(--amv-text) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 42px !important; font-weight: 950 !important; line-height: 1 !important; letter-spacing: -0.04em !important; } html body #bp-dw.amv-cart .bp-check, html body #bp-root #bp-dw.amv-cart .bp-check { width: 100% !important; min-height: 78px !important; margin: 0 !important; display: flex !important; align-items: center !important; justify-content: center !important; border-radius: 18px !important; border: 0 !important; background: radial-gradient(circle at 20% 0%, rgba(255, 255, 255, 0.12), transparent 38%), linear-gradient(135deg, #c94735, #9a2f2b 56%, #6c1b22) !important; color: var(--amv-text) !important; font-family: "Oswald", "Nunito", system-ui, sans-serif !important; font-size: 26px !important; font-weight: 900 !important; letter-spacing: 0.09em !important; text-transform: uppercase !important; box-shadow: 0 18px 42px rgba(160, 42, 28, 0.26), inset 0 1px 0 rgba(255, 255, 255, 0.12) !important; } html body #bp-dw.amv-cart .bp-check::after, html body #bp-root #bp-dw.amv-cart .bp-check::after { content: "→" !important; margin-left: 22px !important; font-size: 42px !important; line-height: 0 !important; } html body #bp-dw.amv-cart .bp-dw__f::after, html body #bp-root #bp-dw.amv-cart .bp-dw__f::after { content: "🔒 Сигурна поръчка и защита на данните" !important; display: block !important; text-align: center !important; color: rgba(245, 234, 216, 0.46) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 18px !important; font-weight: 800 !important; } /* Hide floating cart button while drawer is open */ html body #bp-dw.amv-cart.is-open ~ #bp-floating-cart, html body #bp-root #bp-dw.amv-cart.is-open ~ #bp-floating-cart, html body #bp-dw.amv-cart.is-open .bp-floating-cart, html body #bp-root #bp-dw.amv-cart.is-open .bp-floating-cart { display: none !important; } /* ========================================================================== 6) MOBILE — IPHONE FIRST ========================================================================== */ @media (max-width: 680px) { html body #bp-dw.amv-cart, html body #bp-root #bp-dw.amv-cart { padding: 8px !important; } html body #bp-dw.amv-cart .bp-dw__panel, html body #bp-root #bp-dw.amv-cart .bp-dw__panel { width: 100% !important; max-width: 100% !important; height: calc(100dvh - 16px) !important; max-height: calc(100dvh - 16px) !important; border-radius: 22px !important; } html body #bp-dw.amv-cart .bp-dw__h, html body #bp-root #bp-dw.amv-cart .bp-dw__h { min-height: 74px !important; padding: 18px 18px 15px !important; } html body #bp-dw.amv-cart .bp-dw__h b, html body #bp-root #bp-dw.amv-cart .bp-dw__h b { gap: 10px !important; font-size: 27px !important; letter-spacing: 0.045em !important; } html body #bp-dw.amv-cart .amv-count-badge, html body #bp-root #bp-dw.amv-cart .amv-count-badge { min-height: 28px !important; padding: 0 11px !important; font-size: 12px !important; } html body #bp-dw.amv-cart .bp-dw__x, html body #bp-root #bp-dw.amv-cart .bp-dw__x { width: 46px !important; height: 46px !important; min-width: 46px !important; font-size: 26px !important; } html body #bp-dw.amv-cart .bp-dw__b, html body #bp-root #bp-dw.amv-cart .bp-dw__b { padding: 22px 16px 22px !important; } html body #bp-dw.amv-cart .amv-handoff, html body #bp-root #bp-dw.amv-cart .amv-handoff { gap: 18px !important; } html body #bp-dw.amv-cart .amv-kicker, html body #bp-root #bp-dw.amv-cart .amv-kicker { font-size: 13px !important; letter-spacing: 0.17em !important; } html body #bp-dw.amv-cart .amv-handoff__title, html body #bp-root #bp-dw.amv-cart .amv-handoff__title { font-size: 25px !important; line-height: 1.05 !important; } html body #bp-dw.amv-cart .amv-handoff__tabs, html body #bp-root #bp-dw.amv-cart .amv-handoff__tabs { gap: 10px !important; } html body #bp-dw.amv-cart .amv-handoff-tab, html body #bp-root #bp-dw.amv-cart .amv-handoff-tab { min-height: 104px !important; padding: 14px 10px !important; grid-template-columns: 1fr !important; justify-items: center !important; gap: 9px !important; text-align: center !important; border-radius: 20px !important; } html body #bp-dw.amv-cart .amv-handoff-tab__icon, html body #bp-root #bp-dw.amv-cart .amv-handoff-tab__icon { width: 34px !important; height: 34px !important; } html body #bp-dw.amv-cart .amv-handoff-tab__copy, html body #bp-root #bp-dw.amv-cart .amv-handoff-tab__copy { gap: 5px !important; justify-items: center !important; } html body #bp-dw.amv-cart .amv-handoff-tab__copy strong, html body #bp-root #bp-dw.amv-cart .amv-handoff-tab__copy strong { font-size: 20px !important; } html body #bp-dw.amv-cart .amv-handoff-tab__copy small, html body #bp-root #bp-dw.amv-cart .amv-handoff-tab__copy small { font-size: 13px !important; } html body #bp-dw.amv-cart .amv-delivery, html body #bp-root #bp-dw.amv-cart .amv-delivery { gap: 20px !important; } html body #bp-dw.amv-cart .amv-zone, html body #bp-root #bp-dw.amv-cart .amv-zone { padding: 14px !important; border-radius: 20px !important; gap: 13px !important; } html body #bp-dw.amv-cart .amv-zone__label, html body #bp-root #bp-dw.amv-cart .amv-zone__label { font-size: 12px !important; letter-spacing: 0.16em !important; } html body #bp-dw.amv-cart .amv-zone__grid, html body #bp-root #bp-dw.amv-cart .amv-zone__grid { gap: 8px !important; } html body #bp-dw.amv-cart .amv-zone-btn, html body #bp-root #bp-dw.amv-cart .amv-zone-btn { min-height: 98px !important; padding: 16px 6px 13px !important; border-radius: 16px !important; } html body #bp-dw.amv-cart .amv-zone-btn__mark, html body #bp-root #bp-dw.amv-cart .amv-zone-btn__mark { width: 31px !important; height: 31px !important; top: -8px !important; right: -6px !important; font-size: 19px !important; } html body #bp-dw.amv-cart .amv-zone-btn__icon, html body #bp-root #bp-dw.amv-cart .amv-zone-btn__icon { width: 25px !important; height: 25px !important; margin-bottom: 8px !important; } html body #bp-dw.amv-cart .amv-zone-btn__name, html body #bp-root #bp-dw.amv-cart .amv-zone-btn__name { font-size: 13px !important; line-height: 1.05 !important; } html body #bp-dw.amv-cart .amv-zone-btn__fee, html body #bp-root #bp-dw.amv-cart .amv-zone-btn__fee { margin-top: 6px !important; font-size: 12px !important; } html body #bp-dw.amv-cart .amv-address, html body #bp-root #bp-dw.amv-cart .amv-address { gap: 12px !important; } html body #bp-dw.amv-cart .amv-address__title, html body #bp-root #bp-dw.amv-cart .amv-address__title { font-size: 14px !important; letter-spacing: 0.18em !important; } html body #bp-dw.amv-cart .amv-address__box, html body #bp-root #bp-dw.amv-cart .amv-address__box { padding: 14px !important; border-radius: 20px !important; } html body #bp-dw.amv-cart .amv-address__subtitle, html body #bp-root #bp-dw.amv-cart .amv-address__subtitle { font-size: 15px !important; } html body #bp-dw.amv-cart .amv-address-row, html body #bp-root #bp-dw.amv-cart .amv-address-row { grid-template-columns: minmax(0, 1fr) 50px !important; } html body #bp-dw.amv-cart .amv-address-pick, html body #bp-root #bp-dw.amv-cart .amv-address-pick { min-height: 88px !important; padding: 13px 10px !important; grid-template-columns: 30px minmax(0, 1fr) !important; gap: 10px !important; } html body #bp-dw.amv-cart .amv-address-radio, html body #bp-root #bp-dw.amv-cart .amv-address-radio { width: 26px !important; height: 26px !important; } html body #bp-dw.amv-cart .amv-address-main, html body #bp-root #bp-dw.amv-cart .amv-address-main { font-size: 15px !important; } html body #bp-dw.amv-cart .amv-address-note, html body #bp-root #bp-dw.amv-cart .amv-address-note { font-size: 12.5px !important; } html body #bp-dw.amv-cart .amv-address-badge, html body #bp-root #bp-dw.amv-cart .amv-address-badge { grid-column: 2 !important; justify-self: start !important; min-height: 28px !important; padding: 0 9px !important; font-size: 10px !important; } html body #bp-dw.amv-cart .amv-address-delete, html body #bp-root #bp-dw.amv-cart .amv-address-delete { width: 50px !important; min-width: 50px !important; } html body #bp-dw.amv-cart .amv-address-delete svg, html body #bp-root #bp-dw.amv-cart .amv-address-delete svg { width: 23px !important; height: 23px !important; } html body #bp-dw.amv-cart .amv-field span, html body #bp-root #bp-dw.amv-cart .amv-field span { font-size: 12px !important; letter-spacing: 0.14em !important; } html body #bp-dw.amv-cart .amv-field input, html body #bp-root #bp-dw.amv-cart .amv-field input { min-height: 48px !important; padding: 0 14px !important; border-radius: 15px !important; font-size: 14px !important; } html body #bp-dw.amv-cart .amv-new-address, html body #bp-root #bp-dw.amv-cart .amv-new-address { min-height: 50px !important; font-size: 15px !important; border-radius: 15px !important; } html body #bp-dw.amv-cart .bp-dw__f, html body #bp-root #bp-dw.amv-cart .bp-dw__f { padding: 16px 16px calc(18px + env(safe-area-inset-bottom)) !important; gap: 12px !important; } html body #bp-dw.amv-cart .bp-t:not(.m) span, html body #bp-root #bp-dw.amv-cart .bp-t:not(.m) span { font-size: 20px !important; } html body #bp-dw.amv-cart .bp-t:not(.m) span::after, html body #bp-root #bp-dw.amv-cart .bp-t:not(.m) span::after { font-size: 12.5px !important; margin-top: 7px !important; } html body #bp-dw.amv-cart .bp-t:not(.m) b, html body #bp-root #bp-dw.amv-cart .bp-t:not(.m) b { font-size: 31px !important; } html body #bp-dw.amv-cart .bp-check, html body #bp-root #bp-dw.amv-cart .bp-check { min-height: 58px !important; border-radius: 17px !important; font-size: 19px !important; letter-spacing: 0.08em !important; } html body #bp-dw.amv-cart .bp-check::after, html body #bp-root #bp-dw.amv-cart .bp-check::after { margin-left: 16px !important; font-size: 34px !important; } html body #bp-dw.amv-cart .bp-dw__f::after, html body #bp-root #bp-dw.amv-cart .bp-dw__f::after { font-size: 12px !important; } } @media (max-width: 390px) { html body #bp-dw.amv-cart .bp-dw__h b, html body #bp-root #bp-dw.amv-cart .bp-dw__h b { font-size: 25px !important; } html body #bp-dw.amv-cart .amv-handoff__title, html body #bp-root #bp-dw.amv-cart .amv-handoff__title { font-size: 23px !important; } html body #bp-dw.amv-cart .amv-handoff-tab__copy strong, html body #bp-root #bp-dw.amv-cart .amv-handoff-tab__copy strong { font-size: 18px !important; } html body #bp-dw.amv-cart .amv-zone__grid, html body #bp-root #bp-dw.amv-cart .amv-zone__grid { gap: 7px !important; } html body #bp-dw.amv-cart .amv-zone-btn__name, html body #bp-root #bp-dw.amv-cart .amv-zone-btn__name { font-size: 12.5px !important; } html body #bp-dw.amv-cart .amv-address-main, html body #bp-root #bp-dw.amv-cart .amv-address-main { font-size: 14px !important; } html body #bp-dw.amv-cart .amv-new-address, html body #bp-root #bp-dw.amv-cart .amv-new-address { font-size: 14px !important; } } /* ========================================================================== 🟣 AMICI CART — FORCE SHOW REAL PRODUCT LINES FINAL Поправя скритите продукти в количката. Работи и ако е останал старият class amici-v11-cart. ========================================================================== */ /* 1) Пребиваме старото display:none */ html body #bp-dw.amv-cart #bp-lines > .bp-line, html body #bp-root #bp-dw.amv-cart #bp-lines > .bp-line, html body #bp-dw.amici-v11-cart #bp-lines > .bp-line, html body #bp-root #bp-dw.amici-v11-cart #bp-lines > .bp-line { display: grid !important; visibility: visible !important; opacity: 1 !important; grid-template-columns: 66px minmax(0, 1fr) auto !important; align-items: center !important; gap: 12px !important; width: 100% !important; min-height: 86px !important; padding: 10px !important; margin: 0 !important; border-radius: 18px !important; border: 1px solid rgba(255, 235, 210, 0.10) !important; background: radial-gradient(circle at 12% 0%, rgba(255,255,255,0.045), transparent 34%), linear-gradient(145deg, rgba(33, 24, 27, 0.78), rgba(16, 8, 11, 0.94)) !important; box-shadow: 0 12px 26px rgba(0,0,0,0.18), inset 0 1px 0 rgba(255,255,255,0.04) !important; } /* 2) Контейнерът на редовете */ html body #bp-dw.amv-cart #bp-lines, html body #bp-root #bp-dw.amv-cart #bp-lines, html body #bp-dw.amici-v11-cart #bp-lines, html body #bp-root #bp-dw.amici-v11-cart #bp-lines { display: grid !important; gap: 14px !important; } /* 3) Снимка */ html body #bp-dw.amv-cart #bp-lines > .bp-line > img, html body #bp-root #bp-dw.amv-cart #bp-lines > .bp-line > img, html body #bp-dw.amici-v11-cart #bp-lines > .bp-line > img, html body #bp-root #bp-dw.amici-v11-cart #bp-lines > .bp-line > img { display: block !important; width: 66px !important; height: 66px !important; min-width: 66px !important; object-fit: cover !important; object-position: center !important; border-radius: 15px !important; border: 1px solid rgba(255,235,210,0.10) !important; background: rgba(0,0,0,0.18) !important; } /* 4) Текстова част */ html body #bp-dw.amv-cart .bp-line .bp-ln, html body #bp-root #bp-dw.amv-cart .bp-line .bp-ln, html body #bp-dw.amici-v11-cart .bp-line .bp-ln, html body #bp-root #bp-dw.amici-v11-cart .bp-line .bp-ln { margin: 0 !important; color: #fff5e7 !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 15px !important; font-weight: 950 !important; line-height: 1.14 !important; white-space: normal !important; overflow-wrap: anywhere !important; } html body #bp-dw.amv-cart .bp-line .bp-lu, html body #bp-root #bp-dw.amv-cart .bp-line .bp-lu, html body #bp-dw.amici-v11-cart .bp-line .bp-lu, html body #bp-root #bp-dw.amici-v11-cart .bp-line .bp-lu { margin-top: 4px !important; color: rgba(245,234,216,0.58) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 12px !important; font-weight: 850 !important; line-height: 1.2 !important; } /* 5) Добавки / комбо части */ html body #bp-dw.amv-cart .bp-line .bp-line__mods, html body #bp-root #bp-dw.amv-cart .bp-line .bp-line__mods, html body #bp-dw.amici-v11-cart .bp-line .bp-line__mods, html body #bp-root #bp-dw.amici-v11-cart .bp-line .bp-line__mods { display: flex !important; flex-wrap: wrap !important; gap: 4px !important; margin-top: 6px !important; } html body #bp-dw.amv-cart .bp-line .bp-line__mods span, html body #bp-root #bp-dw.amv-cart .bp-line .bp-line__mods span, html body #bp-dw.amici-v11-cart .bp-line .bp-line__mods span, html body #bp-root #bp-dw.amici-v11-cart .bp-line .bp-line__mods span { display: inline-flex !important; padding: 4px 7px !important; border-radius: 999px !important; border: 1px solid rgba(224,188,122,0.14) !important; background: rgba(224,188,122,0.07) !important; color: rgba(245,234,216,0.68) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 10px !important; font-weight: 850 !important; line-height: 1 !important; } /* 6) Дясна част — количество, сума, премахни */ html body #bp-dw.amv-cart .bp-line .bp-qr, html body #bp-root #bp-dw.amv-cart .bp-line .bp-qr, html body #bp-dw.amici-v11-cart .bp-line .bp-qr, html body #bp-root #bp-dw.amici-v11-cart .bp-line .bp-qr { display: grid !important; justify-items: end !important; gap: 7px !important; } html body #bp-dw.amv-cart .bp-line .bp-sum, html body #bp-root #bp-dw.amv-cart .bp-line .bp-sum, html body #bp-dw.amici-v11-cart .bp-line .bp-sum, html body #bp-root #bp-dw.amici-v11-cart .bp-line .bp-sum { color: #ffe0a0 !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 16px !important; font-weight: 950 !important; line-height: 1 !important; white-space: nowrap !important; } /* 7) Quantity */ html body #bp-dw.amv-cart .bp-line .bp-qty, html body #bp-root #bp-dw.amv-cart .bp-line .bp-qty, html body #bp-dw.amici-v11-cart .bp-line .bp-qty, html body #bp-root #bp-dw.amici-v11-cart .bp-line .bp-qty { display: inline-flex !important; align-items: center !important; gap: 5px !important; padding: 4px !important; border-radius: 999px !important; border: 1px solid rgba(255,235,210,0.12) !important; background: rgba(0,0,0,0.22) !important; } html body #bp-dw.amv-cart .bp-line .bp-qb, html body #bp-root #bp-dw.amv-cart .bp-line .bp-qb, html body #bp-dw.amici-v11-cart .bp-line .bp-qb, html body #bp-root #bp-dw.amici-v11-cart .bp-line .bp-qb { width: 24px !important; height: 24px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; border: 0 !important; border-radius: 999px !important; background: rgba(224,188,122,0.14) !important; color: #ffe0a0 !important; font-size: 15px !important; font-weight: 950 !important; line-height: 1 !important; } html body #bp-dw.amv-cart .bp-line .bp-qv, html body #bp-root #bp-dw.amv-cart .bp-line .bp-qv, html body #bp-dw.amici-v11-cart .bp-line .bp-qv, html body #bp-root #bp-dw.amici-v11-cart .bp-line .bp-qv { min-width: 18px !important; color: #fff5e7 !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 12px !important; font-weight: 950 !important; text-align: center !important; } /* 8) Премахни */ html body #bp-dw.amv-cart .bp-line .bp-rm, html body #bp-root #bp-dw.amv-cart .bp-line .bp-rm, html body #bp-dw.amici-v11-cart .bp-line .bp-rm, html body #bp-root #bp-dw.amici-v11-cart .bp-line .bp-rm { padding: 0 !important; margin: 0 !important; border: 0 !important; background: transparent !important; color: rgba(255,115,115,0.78) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 10px !important; font-weight: 900 !important; line-height: 1 !important; text-transform: uppercase !important; cursor: pointer !important; } /* 9) Mobile */ @media (max-width: 680px) { html body #bp-dw.amv-cart #bp-lines > .bp-line, html body #bp-root #bp-dw.amv-cart #bp-lines > .bp-line, html body #bp-dw.amici-v11-cart #bp-lines > .bp-line, html body #bp-root #bp-dw.amici-v11-cart #bp-lines > .bp-line { grid-template-columns: 56px minmax(0, 1fr) auto !important; gap: 9px !important; min-height: 76px !important; padding: 9px !important; border-radius: 16px !important; } html body #bp-dw.amv-cart #bp-lines > .bp-line > img, html body #bp-root #bp-dw.amv-cart #bp-lines > .bp-line > img, html body #bp-dw.amici-v11-cart #bp-lines > .bp-line > img, html body #bp-root #bp-dw.amici-v11-cart #bp-lines > .bp-line > img { width: 56px !important; height: 56px !important; min-width: 56px !important; border-radius: 13px !important; } html body #bp-dw.amv-cart .bp-line .bp-ln, html body #bp-root #bp-dw.amv-cart .bp-line .bp-ln, html body #bp-dw.amici-v11-cart .bp-line .bp-ln, html body #bp-root #bp-dw.amici-v11-cart .bp-line .bp-ln { font-size: 13px !important; } html body #bp-dw.amv-cart .bp-line .bp-lu, html body #bp-root #bp-dw.amv-cart .bp-line .bp-lu, html body #bp-dw.amici-v11-cart .bp-line .bp-lu, html body #bp-root #bp-dw.amici-v11-cart .bp-line .bp-lu { font-size: 10.5px !important; } html body #bp-dw.amv-cart .bp-line .bp-sum, html body #bp-root #bp-dw.amv-cart .bp-line .bp-sum, html body #bp-dw.amici-v11-cart .bp-line .bp-sum, html body #bp-root #bp-dw.amici-v11-cart .bp-line .bp-sum { font-size: 14px !important; } html body #bp-dw.amv-cart .bp-line .bp-qb, html body #bp-root #bp-dw.amv-cart .bp-line .bp-qb, html body #bp-dw.amici-v11-cart .bp-line .bp-qb, html body #bp-root #bp-dw.amici-v11-cart .bp-line .bp-qb { width: 22px !important; height: 22px !important; font-size: 14px !important; } } /* 🟣 LANDMARK: AMICI CART — KITCHEN NOTE FIELD ONLY */ html body #bp-root #bp-lines .bp-note--kitchen { display: block !important; width: 100% !important; margin: 14px 0 !important; padding: 14px !important; box-sizing: border-box !important; border-radius: 18px !important; border: 1px solid rgba(245, 168, 0, 0.22) !important; background: linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.018)), rgba(20, 8, 12, 0.72) !important; } html body #bp-root #bp-lines .bp-note--kitchen label { display: block !important; margin-bottom: 8px !important; color: #E0BC7A !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 13px !important; font-weight: 950 !important; } html body #bp-root #bp-lines .bp-note--kitchen textarea { display: block !important; width: 100% !important; min-height: 86px !important; resize: vertical !important; box-sizing: border-box !important; padding: 12px 13px !important; border-radius: 14px !important; border: 1px solid rgba(245, 168, 0, 0.18) !important; background: rgba(0, 0, 0, 0.32) !important; color: #fff !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 14px !important; font-weight: 750 !important; line-height: 1.35 !important; outline: none !important; } html body #bp-root #bp-lines .bp-note--kitchen textarea::placeholder { color: rgba(255, 255, 255, 0.38) !important; } html body #bp-root #bp-lines .bp-note--kitchen .bp-note-hint { display: block !important; margin-top: 7px !important; color: rgba(245, 234, 216, 0.58) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 11.5px !important; font-weight: 750 !important; line-height: 1.35 !important; } /* ====================================================================== 🟣 LANDMARK: AMICI CART — KITCHEN NOTE RESTORE ONLY Връща бележката към кухнята в количката. НЕ пипа доставка, адреси, карта, handoff бутони или checkout. ====================================================================== */ html body #bp-dw.amv-cart .bp-dw__f > .bp-note, html body #bp-root #bp-dw.amv-cart .bp-dw__f > .bp-note, html body #bp-dw .bp-dw__f > .bp-note.bp-note--kitchen, html body #bp-root #bp-dw .bp-dw__f > .bp-note.bp-note--kitchen { display: grid !important; gap: 8px !important; width: 100% !important; max-width: 100% !important; margin: 12px 0 14px !important; padding: 13px 14px !important; box-sizing: border-box !important; border-radius: 18px !important; border: 1px solid rgba(224, 188, 122, 0.20) !important; background: radial-gradient(circle at 12% 0%, rgba(224, 188, 122, 0.10), transparent 34%), linear-gradient(145deg, rgba(42, 20, 32, 0.88), rgba(18, 7, 13, 0.96)) !important; box-shadow: 0 12px 26px rgba(10, 0, 5, 0.22), inset 0 1px 0 rgba(255, 235, 210, 0.06) !important; } html body #bp-dw.amv-cart .bp-dw__f > .bp-note label, html body #bp-root #bp-dw.amv-cart .bp-dw__f > .bp-note label, html body #bp-dw .bp-note--kitchen label, html body #bp-root #bp-dw .bp-dw__f > .bp-note.bp-note--kitchen label { display: block !important; margin: 0 !important; color: #E0BC7A !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 12px !important; font-weight: 950 !important; line-height: 1.15 !important; letter-spacing: 0.065em !important; text-transform: uppercase !important; } html body #bp-dw.amv-cart #bp-cart-note, html body #bp-root #bp-dw.amv-cart #bp-cart-note, html body #bp-dw .bp-note--kitchen #bp-cart-note, html body #bp-root #bp-dw .bp-note--kitchen #bp-cart-note { display: block !important; width: 100% !important; max-width: 100% !important; min-height: 74px !important; height: 74px !important; max-height: 120px !important; padding: 12px 13px !important; resize: vertical !important; overflow: auto !important; box-sizing: border-box !important; border-radius: 14px !important; border: 1px solid rgba(224, 188, 122, 0.18) !important; background: rgba(0, 0, 0, 0.28) !important; color: #F5EAD8 !important; outline: none !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 13px !important; font-weight: 800 !important; line-height: 1.35 !important; } html body #bp-dw.amv-cart #bp-cart-note:focus, html body #bp-root #bp-dw.amv-cart #bp-cart-note:focus, html body #bp-dw .bp-note--kitchen #bp-cart-note:focus, html body #bp-root #bp-dw .bp-note--kitchen #bp-cart-note:focus { border-color: rgba(224, 188, 122, 0.44) !important; box-shadow: 0 0 0 3px rgba(224, 188, 122, 0.10) !important; } html body #bp-dw.amv-cart #bp-cart-note::placeholder, html body #bp-root #bp-dw.amv-cart #bp-cart-note::placeholder, html body #bp-dw .bp-note--kitchen #bp-cart-note::placeholder, html body #bp-root #bp-dw .bp-note--kitchen #bp-cart-note::placeholder { color: rgba(245, 234, 216, 0.38) !important; } html body #bp-dw.amv-cart .bp-dw__f > .bp-note .bp-note-hint, html body #bp-root #bp-dw.amv-cart .bp-dw__f > .bp-note .bp-note-hint, html body #bp-dw .bp-note--kitchen .bp-note-hint, html body #bp-root #bp-dw .bp-note--kitchen .bp-note-hint { display: block !important; margin: 0 !important; color: rgba(245, 234, 216, 0.52) !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 11px !important; font-weight: 800 !important; line-height: 1.25 !important; } /* ========================================================================== 🟣 LANDMARK: AMICI CART — SHOW KITCHEN NOTE ONLY Само показва вече съществуващата бележка. Не пипа доставка. ========================================================================== */ html body #bp-dw.amv-cart .bp-dw__f .bp-note, html body #bp-root #bp-dw.amv-cart .bp-dw__f .bp-note { display: grid !important; gap: 8px !important; margin: 14px 0 !important; } html body #bp-dw.amv-cart #bp-cart-note, html body #bp-root #bp-dw.amv-cart #bp-cart-note { display: block !important; width: 100% !important; min-height: 72px !important; height: 72px !important; max-height: 120px !important; resize: vertical !important; overflow: auto !important; } /* ========================================================================== 🟣 AMICI CART — DESKTOP COMPACT LAYOUT V2 Само desktop. Mobile остава непроменен. ========================================================================== */ @media (min-width: 681px) { /* Малко по-широк desktop панел. */ html body div#bp-dw.bp-dw.amv-cart .bp-dw__panel { width: min(700px, calc(100vw - 64px)) !important; max-width: min(700px, calc(100vw - 64px)) !important; max-height: calc(100dvh - 32px) !important; } /* По-компактен header. */ html body div#bp-dw.bp-dw.amv-cart .bp-dw__h { min-height: 78px !important; padding: 14px 22px !important; gap: 12px !important; } html body div#bp-dw.bp-dw.amv-cart .bp-dw__h > b { min-width: 0 !important; font-size: 28px !important; line-height: 1 !important; white-space: nowrap !important; } html body div#bp-dw.bp-dw.amv-cart .amv-count-badge { margin-left: 8px !important; padding: 6px 10px !important; font-size: 12px !important; line-height: 1 !important; white-space: nowrap !important; } html body div#bp-dw.bp-dw.amv-cart .bp-dw__x { width: 48px !important; height: 48px !important; min-width: 48px !important; font-size: 24px !important; } /* Основната scroll зона. */ html body div#bp-dw.bp-dw.amv-cart .bp-dw__b, html body div#bp-dw.bp-dw.amv-cart #bp-lines { padding: 20px 22px !important; padding-bottom: 24px !important; } /* Заглавието на начина на получаване. */ html body div#bp-dw.bp-dw.amv-cart .amv-handoff__head { margin-bottom: 14px !important; } html body div#bp-dw.bp-dw.amv-cart .amv-kicker { margin-bottom: 7px !important; font-size: 13px !important; line-height: 1.1 !important; letter-spacing: 0.16em !important; } html body div#bp-dw.bp-dw.amv-cart .amv-handoff__title { font-size: 25px !important; line-height: 1.08 !important; } /* Вземане / доставка. */ html body div#bp-dw.bp-dw.amv-cart .amv-handoff__tabs { width: 100% !important; display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 12px !important; } html body div#bp-dw.bp-dw.amv-cart .amv-handoff-tab { width: 100% !important; min-width: 0 !important; min-height: 92px !important; padding: 13px 16px !important; display: grid !important; grid-template-columns: 44px minmax(0, 1fr) !important; align-items: center !important; justify-content: stretch !important; gap: 12px !important; text-align: left !important; } html body div#bp-dw.bp-dw.amv-cart .amv-handoff-tab__icon { width: 44px !important; height: 44px !important; min-width: 44px !important; } html body div#bp-dw.bp-dw.amv-cart .amv-handoff-tab__copy { min-width: 0 !important; display: flex !important; flex-direction: column !important; align-items: flex-start !important; gap: 3px !important; } html body div#bp-dw.bp-dw.amv-cart .amv-handoff-tab__copy strong { max-width: 100% !important; font-size: 18px !important; line-height: 1.08 !important; white-space: normal !important; overflow-wrap: normal !important; } html body div#bp-dw.bp-dw.amv-cart .amv-handoff-tab__copy small { max-width: 100% !important; font-size: 13px !important; line-height: 1.2 !important; white-space: normal !important; } /* Delivery зоната става по-компактна. */ html body div#bp-dw.bp-dw.amv-cart .amv-delivery { margin-top: 14px !important; } html body div#bp-dw.bp-dw.amv-cart .amv-zone { padding: 15px !important; } html body div#bp-dw.bp-dw.amv-cart .amv-zone__label { margin-bottom: 12px !important; font-size: 13px !important; line-height: 1.1 !important; letter-spacing: 0.14em !important; } html body div#bp-dw.bp-dw.amv-cart .amv-zone__grid { width: 100% !important; display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 10px !important; } html body div#bp-dw.bp-dw.amv-cart .amv-zone-btn { width: 100% !important; min-width: 0 !important; min-height: 104px !important; padding: 11px 8px !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; gap: 5px !important; text-align: center !important; } html body div#bp-dw.bp-dw.amv-cart .amv-zone-btn__mark { width: 30px !important; height: 30px !important; font-size: 18px !important; } html body div#bp-dw.bp-dw.amv-cart .amv-zone-btn__icon { width: 32px !important; height: 32px !important; min-height: 32px !important; } html body div#bp-dw.bp-dw.amv-cart .amv-zone-btn__name { width: 100% !important; min-width: 0 !important; font-size: 15px !important; line-height: 1.05 !important; white-space: normal !important; overflow-wrap: normal !important; word-break: normal !important; } html body div#bp-dw.bp-dw.amv-cart .amv-zone-btn__fee { font-size: 16px !important; line-height: 1 !important; white-space: nowrap !important; } /* Footer. */ html body div#bp-dw.bp-dw.amv-cart .bp-dw__f { padding-left: 22px !important; padding-right: 22px !important; } } /* ========================================================================== 🟣 AMICI CATEGORY — SHOW OFFERS FINAL ========================================================================== */ html body #bp-root #bp-types .bp-cat[data-type="Оферти"], html body #bp-root .bp-cats .bp-cat[data-type="Оферти"] { display: flex !important; } /* ========================================================================== 🟣 AMICI DELIVERY BONUS MODAL — UI FIX ========================================================================== */ #bp-plus-modal .bp-plus-modal__panel, .bp-plus-modal .bp-plus-modal__panel { background: radial-gradient(circle at top right, rgba(183,106,24,.18), transparent 28%), linear-gradient(180deg, rgba(36,10,20,.98), rgba(18,8,14,.98)) !important; color: #F5EAD8 !important; } #bp-plus-modal .bp-plus-modal__head, .bp-plus-modal .bp-plus-modal__head { background: linear-gradient(180deg, rgba(82,13,30,.92), rgba(48,10,22,.92)) !important; border-bottom: 1px solid rgba(245, 176, 44, .18) !important; } #bp-plus-modal .bp-plus-modal__title, .bp-plus-modal .bp-plus-modal__title, #bp-plus-modal .bp-plus-modal__meta, .bp-plus-modal .bp-plus-modal__meta { color: #F5EAD8 !important; } #bp-plus-modal .bp-plus-modal__body, .bp-plus-modal .bp-plus-modal__body { background: transparent !important; } #bp-plus-modal .bp-plus-modal__section, .bp-plus-modal .bp-plus-modal__section, .bp-qo-slot-card, .bp-qo-summary-card, .bp-qo-drinks-box { background: rgba(255,255,255,.04) !important; border: 1px solid rgba(245, 176, 44, .16) !important; border-radius: 24px !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.03) !important; } .bp-qo-count-row { display: flex; flex-wrap: wrap; gap: 10px; } .bp-qo-count-btn { width: 54px; height: 54px; border-radius: 999px; border: 1px solid rgba(255,255,255,.14); background: rgba(255,255,255,.06); color: #F5EAD8; font-weight: 800; cursor: pointer; } .bp-qo-count-btn.is-active { background: linear-gradient(180deg, #F5B42C, #D49112); color: #1a0c08; border-color: rgba(245,180,44,.85); } .bp-qo-slot-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; } .bp-qo-slot-title, .bp-qo-slot-price { color: #F5EAD8; font-weight: 800; } .bp-qo-clear-btn { border: 1px solid rgba(255,255,255,.14); background: rgba(255,255,255,.08); color: #F5EAD8; border-radius: 999px; padding: 10px 18px; font-weight: 700; cursor: pointer; } .bp-qo-cat-tabs { display: flex; gap: 10px; margin: 14px 0 14px; } .bp-qo-cat-btn { border: 1px solid rgba(255,255,255,.14); background: rgba(255,255,255,.06); color: #F5EAD8; border-radius: 999px; padding: 12px 18px; font-weight: 800; cursor: pointer; } .bp-qo-cat-btn.is-active { background: linear-gradient(180deg, #F5B42C, #D49112); color: #1b0d08; border-color: rgba(245,180,44,.9); } .bp-qo-select-wrap { position: relative; } .bp-qo-select { width: 100%; appearance: none; -webkit-appearance: none; border: 1px solid rgba(245,180,44,.26); background: rgba(19,10,15,.92); color: #F5EAD8; border-radius: 20px; padding: 18px 56px 18px 18px; font-size: 18px; font-weight: 700; outline: none; } .bp-qo-select:focus { border-color: rgba(245,180,44,.85); box-shadow: 0 0 0 3px rgba(245,180,44,.12); } .bp-qo-select-caret { position: absolute; right: 18px; top: 50%; transform: translateY(-50%); color: #F5B42C; font-size: 22px; pointer-events: none; } .bp-qo-drinks-list { display: grid; gap: 12px; } .bp-qo-drink-card { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 14px 16px; border-radius: 18px; background: rgba(255,255,255,.05); border: 1px solid rgba(245,180,44,.14); } .bp-qo-drink-name { color: #F5EAD8; font-weight: 800; } .bp-qo-drink-sub { color: rgba(245,234,216,.72); font-size: 14px; } .bp-qo-drink-controls { display: flex; align-items: center; gap: 10px; } .bp-qo-step-btn { width: 38px; height: 38px; border-radius: 999px; border: 1px solid rgba(245,180,44,.34); background: rgba(255,255,255,.08); color: #F5EAD8; font-size: 20px; font-weight: 900; cursor: pointer; } .bp-qo-drink-qty { min-width: 22px; text-align: center; color: #F5EAD8; font-weight: 800; } .bp-qo-empty-note { padding: 18px; border-radius: 18px; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.08); color: rgba(245,234,216,.8); } @media (max-width: 680px) { .bp-qo-select { font-size: 16px; padding: 16px 52px 16px 16px; } .bp-qo-count-btn { width: 48px; height: 48px; } .bp-qo-drink-card { flex-direction: column; align-items: stretch; } .bp-qo-drink-controls { justify-content: flex-end; } } /* ========================================================================== 🟣 AMICI DELIVERY BONUS — DRINK PRODUCT CARDS WITH IMAGES ========================================================================== */ #bp-quick-offer-modal .bp-qo-drink-card { display: grid !important; grid-template-columns: 78px minmax(0, 1fr) auto !important; align-items: center !important; gap: 14px !important; min-height: 104px !important; padding: 12px 14px !important; border-radius: 20px !important; border: 1px solid rgba(224, 188, 122, 0.18) !important; background: radial-gradient(circle at 8% 10%, rgba(224,188,122,.11), transparent 34%), linear-gradient(145deg, rgba(54,25,34,.96), rgba(25,10,17,.98)) !important; box-shadow: 0 14px 30px rgba(8,0,4,.28), inset 0 1px 0 rgba(255,255,255,.045) !important; } #bp-quick-offer-modal .bp-qo-drink-card.is-selected { border-color: rgba(245, 168, 0, 0.56) !important; background: radial-gradient(circle at 8% 10%, rgba(245,168,0,.18), transparent 36%), linear-gradient(145deg, rgba(88,39,28,.98), rgba(38,13,21,.98)) !important; box-shadow: 0 16px 34px rgba(8,0,4,.34), 0 0 0 1px rgba(245,168,0,.10), inset 0 1px 0 rgba(255,255,255,.06) !important; } #bp-quick-offer-modal .bp-qo-drink-image { width: 78px !important; height: 78px !important; display: flex !important; align-items: center !important; justify-content: center !important; padding: 6px !important; border-radius: 17px !important; overflow: hidden !important; background: radial-gradient(circle at 50% 40%, rgba(0,0,0,.06), transparent 60%), linear-gradient(180deg, #ffffff, #f2eee8) !important; box-shadow: 0 10px 22px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.86) !important; } #bp-quick-offer-modal .bp-qo-drink-image img { display: block !important; width: 100% !important; height: 100% !important; object-fit: contain !important; object-position: center !important; transform: none !important; } #bp-quick-offer-modal .bp-qo-drink-main { min-width: 0 !important; } #bp-quick-offer-modal .bp-qo-drink-name { color: #F5EAD8 !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 15px !important; font-weight: 950 !important; line-height: 1.2 !important; } #bp-quick-offer-modal .bp-qo-drink-sub { margin-top: 5px !important; color: rgba(245,234,216,.64) !important; font-size: 12px !important; font-weight: 800 !important; } #bp-quick-offer-modal .bp-qo-drink-bonus-label { display: inline-flex !important; margin-top: 8px !important; padding: 5px 8px !important; border-radius: 999px !important; border: 1px solid rgba(245,168,0,.24) !important; background: rgba(245,168,0,.10) !important; color: #FFD47A !important; font-size: 10px !important; font-weight: 950 !important; letter-spacing: .06em !important; text-transform: uppercase !important; } #bp-quick-offer-modal .bp-qo-step-btn:disabled { opacity: .30 !important; cursor: not-allowed !important; filter: grayscale(.4) !important; } @media (max-width: 680px) { #bp-quick-offer-modal .bp-qo-drink-card { grid-template-columns: 68px minmax(0, 1fr) !important; gap: 11px !important; } #bp-quick-offer-modal .bp-qo-drink-image { width: 68px !important; height: 68px !important; } #bp-quick-offer-modal .bp-qo-drink-controls { grid-column: 1 / -1 !important; justify-content: flex-end !important; } } /* ========================================================================== 🟣 AMICI DELIVERY BONUS MODAL — POLISHED LUXURY V3 Стяга layout-а, оправя цветовете, контраста и footer бутоните. ========================================================================== */ #bp-quick-offer-modal, #bp-quick-offer-modal * { box-sizing: border-box; } #bp-quick-offer-modal .bp-plus-modal__panel { width: min(940px, calc(100vw - 32px)) !important; max-width: min(940px, calc(100vw - 32px)) !important; max-height: calc(100dvh - 24px) !important; border-radius: 30px !important; overflow: hidden !important; background: radial-gradient(circle at top right, rgba(245,180,44,.14), transparent 22%), radial-gradient(circle at left center, rgba(145,26,55,.18), transparent 30%), linear-gradient(180deg, rgba(42,10,22,.985), rgba(20,8,14,.99)) !important; border: 1px solid rgba(224,188,122,.14) !important; box-shadow: 0 30px 80px rgba(0,0,0,.46), 0 6px 18px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,255,255,.05) !important; } /* HEADER */ #bp-quick-offer-modal .bp-plus-modal__head { padding: 22px 24px 18px !important; background: linear-gradient(180deg, rgba(84,12,32,.86), rgba(54,10,24,.72)) !important; border-bottom: 1px solid rgba(224,188,122,.14) !important; } #bp-quick-offer-modal .bp-plus-modal__title { margin: 0 !important; color: #F7EEDF !important; font-size: clamp(24px, 3vw, 34px) !important; line-height: 1.02 !important; font-weight: 950 !important; letter-spacing: .01em !important; text-transform: uppercase !important; } #bp-quick-offer-modal .bp-plus-modal__meta { margin-top: 10px !important; color: rgba(247,238,223,.90) !important; font-size: 14px !important; line-height: 1.35 !important; font-weight: 700 !important; } /* CLOSE BUTTON */ #bp-quick-offer-modal .bp-plus-modal__x, #bp-quick-offer-modal .bp-plus-modal__close, #bp-quick-offer-modal [data-close-quick-offer] { width: 60px !important; height: 60px !important; min-width: 60px !important; border-radius: 18px !important; border: 1px solid rgba(224,188,122,.14) !important; background: linear-gradient(180deg, rgba(54,18,29,.92), rgba(34,12,20,.96)) !important; color: #F5EAD8 !important; box-shadow: 0 10px 24px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,255,255,.04) !important; } /* BODY */ #bp-quick-offer-modal .bp-plus-modal__body { padding: 16px 18px 22px !important; background: transparent !important; overflow: auto !important; } /* SECTIONS */ #bp-quick-offer-modal .bp-plus-modal__section, #bp-quick-offer-modal .bp-qo-drinks-box, #bp-quick-offer-modal .bp-qo-summary-card { border-radius: 28px !important; padding: 18px 18px 20px !important; background: linear-gradient(180deg, rgba(255,255,255,.040), rgba(255,255,255,.025)) !important; border: 1px solid rgba(224,188,122,.12) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.03), 0 10px 28px rgba(0,0,0,.10) !important; } #bp-quick-offer-modal .bp-plus-modal__section + .bp-plus-modal__section, #bp-quick-offer-modal .bp-plus-modal__section + .bp-qo-drinks-box, #bp-quick-offer-modal .bp-qo-drinks-box + .bp-qo-summary-card { margin-top: 16px !important; } /* GENERAL TEXT COLORS — маха черните букви */ #bp-quick-offer-modal h1, #bp-quick-offer-modal h2, #bp-quick-offer-modal h3, #bp-quick-offer-modal h4, #bp-quick-offer-modal h5, #bp-quick-offer-modal strong, #bp-quick-offer-modal b, #bp-quick-offer-modal label, #bp-quick-offer-modal p, #bp-quick-offer-modal span, #bp-quick-offer-modal div { color: inherit; } #bp-quick-offer-modal .bp-plus-modal__section-title, #bp-quick-offer-modal .bp-qo-summary-title, #bp-quick-offer-modal .bp-qo-drinks-title { color: #E7BC72 !important; font-size: 13px !important; font-weight: 950 !important; line-height: 1.1 !important; letter-spacing: .18em !important; text-transform: uppercase !important; } /* COUNT 1-8 */ #bp-quick-offer-modal .bp-qo-count-row { display: flex !important; flex-wrap: wrap !important; gap: 12px !important; margin-top: 14px !important; margin-bottom: 8px !important; } #bp-quick-offer-modal .bp-qo-count-btn { width: 74px !important; height: 74px !important; border-radius: 999px !important; border: 1px solid rgba(255,255,255,.16) !important; background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03)) !important; color: #F5EAD8 !important; font-size: 24px !important; font-weight: 950 !important; line-height: 1 !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.03) !important; } #bp-quick-offer-modal .bp-qo-count-btn.is-active { border-color: rgba(245,180,44,.90) !important; background: linear-gradient(180deg, #F5B42C, #D79010) !important; color: #2b1408 !important; box-shadow: 0 10px 22px rgba(245,180,44,.14), inset 0 1px 0 rgba(255,255,255,.22) !important; } /* SLOT CARDS */ #bp-quick-offer-modal .bp-qo-slot-card { border-radius: 26px !important; padding: 16px 16px 18px !important; margin-top: 14px !important; background: linear-gradient(180deg, rgba(255,255,255,.036), rgba(255,255,255,.022)) !important; border: 1px solid rgba(224,188,122,.12) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.026), 0 10px 24px rgba(0,0,0,.08) !important; } #bp-quick-offer-modal .bp-qo-slot-head { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 12px !important; margin-bottom: 12px !important; } #bp-quick-offer-modal .bp-qo-slot-title { color: #F7EEDF !important; font-size: 22px !important; font-weight: 950 !important; line-height: 1.1 !important; } #bp-quick-offer-modal .bp-qo-slot-price { color: #F7EEDF !important; font-size: 20px !important; font-weight: 950 !important; line-height: 1 !important; white-space: nowrap !important; } /* CLEAR */ #bp-quick-offer-modal .bp-qo-clear-btn { min-height: 46px !important; padding: 10px 18px !important; border-radius: 999px !important; border: 1px solid rgba(255,255,255,.12) !important; background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.04)) !important; color: #F5EAD8 !important; font-size: 14px !important; font-weight: 850 !important; } /* PIZZA / PASTA */ #bp-quick-offer-modal .bp-qo-cat-tabs { display: flex !important; gap: 10px !important; margin: 14px 0 14px !important; } #bp-quick-offer-modal .bp-qo-cat-btn { min-height: 50px !important; min-width: 116px !important; padding: 12px 18px !important; border-radius: 999px !important; border: 1px solid rgba(255,255,255,.14) !important; background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03)) !important; color: #F5EAD8 !important; font-size: 16px !important; font-weight: 900 !important; } #bp-quick-offer-modal .bp-qo-cat-btn.is-active { border-color: rgba(245,180,44,.88) !important; background: linear-gradient(180deg, #F5B42C, #D79010) !important; color: #241107 !important; } /* SELECT */ #bp-quick-offer-modal .bp-qo-select-wrap { position: relative !important; } #bp-quick-offer-modal .bp-qo-select { width: 100% !important; min-height: 84px !important; padding: 20px 66px 20px 22px !important; border-radius: 26px !important; border: 1px solid rgba(224,188,122,.28) !important; background: linear-gradient(180deg, rgba(18,6,12,.96), rgba(10,4,8,.98)) !important; color: #F7EEDF !important; font-size: 24px !important; font-weight: 900 !important; line-height: 1.15 !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.02), 0 8px 20px rgba(0,0,0,.10) !important; } #bp-quick-offer-modal .bp-qo-select:focus { outline: none !important; border-color: rgba(245,180,44,.85) !important; box-shadow: 0 0 0 3px rgba(245,180,44,.10), inset 0 1px 0 rgba(255,255,255,.02) !important; } #bp-quick-offer-modal .bp-qo-select option { background: #1e0d13 !important; color: #F5EAD8 !important; } #bp-quick-offer-modal .bp-qo-select-caret { position: absolute !important; top: 50% !important; right: 20px !important; transform: translateY(-50%) !important; color: #F5B42C !important; font-size: 26px !important; font-weight: 900 !important; pointer-events: none !important; } /* DRINKS / SUMMARY TEXT */ #bp-quick-offer-modal .bp-qo-summary-card, #bp-quick-offer-modal .bp-qo-drinks-box, #bp-quick-offer-modal .bp-qo-empty-note { color: #F5EAD8 !important; } #bp-quick-offer-modal .bp-qo-empty-note { border-radius: 18px !important; padding: 16px 18px !important; background: rgba(255,255,255,.04) !important; border: 1px solid rgba(255,255,255,.08) !important; color: rgba(245,234,216,.84) !important; font-size: 14px !important; font-weight: 700 !important; } /* FOOTER */ #bp-quick-offer-modal .bp-plus-modal__foot, #bp-quick-offer-modal .bp-plus-modal__footer { display: flex !important; align-items: center !important; justify-content: flex-end !important; gap: 14px !important; padding: 18px 24px 22px !important; border-top: 1px solid rgba(224,188,122,.10) !important; background: linear-gradient(180deg, rgba(30,10,18,.10), rgba(18,8,14,.38)) !important; } #bp-quick-offer-modal .bp-plus-modal__foot button, #bp-quick-offer-modal .bp-plus-modal__footer button { min-height: 62px !important; padding: 0 26px !important; border-radius: 20px !important; font-size: 20px !important; font-weight: 900 !important; letter-spacing: .01em !important; transition: transform .16s ease, box-shadow .16s ease, opacity .16s ease !important; } #bp-quick-offer-modal .bp-plus-modal__foot button:first-child, #bp-quick-offer-modal .bp-plus-modal__footer button:first-child { border: 1px solid rgba(255,255,255,.12) !important; background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.05)) !important; color: #F5EAD8 !important; } #bp-quick-offer-modal .bp-plus-modal__foot button:last-child, #bp-quick-offer-modal .bp-plus-modal__footer button:last-child { border: 1px solid rgba(245,180,44,.92) !important; background: linear-gradient(180deg, #F5B42C, #D79010) !important; color: #231006 !important; box-shadow: 0 16px 30px rgba(245,180,44,.16), inset 0 1px 0 rgba(255,255,255,.26) !important; } #bp-quick-offer-modal .bp-plus-modal__foot button:hover, #bp-quick-offer-modal .bp-plus-modal__footer button:hover { transform: translateY(-1px) !important; } #bp-quick-offer-modal .bp-plus-modal__foot button:last-child:hover, #bp-quick-offer-modal .bp-plus-modal__footer button:last-child:hover { box-shadow: 0 18px 34px rgba(245,180,44,.22), inset 0 1px 0 rgba(255,255,255,.26) !important; } /* MOBILE */ @media (max-width: 680px) { #bp-quick-offer-modal .bp-plus-modal__panel { width: min(100vw - 12px, 100%) !important; max-width: min(100vw - 12px, 100%) !important; max-height: calc(100dvh - 8px) !important; border-radius: 24px !important; } #bp-quick-offer-modal .bp-plus-modal__head { padding: 18px 16px 14px !important; } #bp-quick-offer-modal .bp-plus-modal__title { font-size: 18px !important; line-height: 1.08 !important; } #bp-quick-offer-modal .bp-plus-modal__meta { font-size: 13px !important; } #bp-quick-offer-modal .bp-plus-modal__body { padding: 12px 12px 16px !important; } #bp-quick-offer-modal .bp-plus-modal__section, #bp-quick-offer-modal .bp-qo-drinks-box, #bp-quick-offer-modal .bp-qo-summary-card { padding: 14px 14px 16px !important; border-radius: 22px !important; } #bp-quick-offer-modal .bp-qo-count-row { gap: 8px !important; } #bp-quick-offer-modal .bp-qo-count-btn { width: 52px !important; height: 52px !important; font-size: 18px !important; } #bp-quick-offer-modal .bp-qo-slot-card { padding: 14px !important; border-radius: 20px !important; } #bp-quick-offer-modal .bp-qo-slot-head { gap: 8px !important; margin-bottom: 10px !important; } #bp-quick-offer-modal .bp-qo-slot-title { font-size: 16px !important; } #bp-quick-offer-modal .bp-qo-slot-price { font-size: 16px !important; } #bp-quick-offer-modal .bp-qo-cat-btn { min-width: 0 !important; flex: 1 1 0 !important; font-size: 14px !important; min-height: 44px !important; padding: 10px 14px !important; } #bp-quick-offer-modal .bp-qo-select { min-height: 60px !important; padding: 14px 48px 14px 16px !important; font-size: 16px !important; border-radius: 18px !important; } #bp-quick-offer-modal .bp-qo-select-caret { right: 16px !important; font-size: 20px !important; } #bp-quick-offer-modal .bp-plus-modal__foot, #bp-quick-offer-modal .bp-plus-modal__footer { padding: 14px 16px 16px !important; gap: 10px !important; } #bp-quick-offer-modal .bp-plus-modal__foot button, #bp-quick-offer-modal .bp-plus-modal__footer button { min-height: 50px !important; font-size: 16px !important; padding: 0 18px !important; border-radius: 16px !important; } } /* ========================================================================== 🟣 AMICI DELIVERY BONUS MODAL — REAL DOM FINAL POLISH Работи с реалните класове: card / top / body / block / actions. ========================================================================== */ #bp-quick-offer-modal, #bp-quick-offer-modal * { box-sizing: border-box !important; } #bp-quick-offer-modal { color: #f7eedf !important; } /* Реалната modal карта. */ #bp-quick-offer-modal .bp-plus-modal__card { width: min(980px, calc(100vw - 28px)) !important; max-width: min(980px, calc(100vw - 28px)) !important; height: auto !important; max-height: calc(100dvh - 24px) !important; display: flex !important; flex-direction: column !important; padding: 0 !important; overflow: hidden !important; border-radius: 30px !important; border: 1px solid rgba(224, 188, 122, 0.20) !important; background: radial-gradient(circle at 86% 4%, rgba(245, 168, 0, 0.12), transparent 25%), radial-gradient(circle at 6% 44%, rgba(138, 46, 24, 0.17), transparent 30%), linear-gradient(155deg, #351522 0%, #211019 48%, #13080e 100%) !important; box-shadow: 0 38px 100px rgba(5, 0, 3, 0.76), 0 14px 34px rgba(138, 46, 24, 0.20), inset 0 1px 0 rgba(255, 255, 255, 0.055) !important; } /* Реалният header. */ #bp-quick-offer-modal .bp-plus-modal__top { position: relative !important; top: auto !important; z-index: 10 !important; flex: 0 0 auto !important; display: flex !important; align-items: flex-start !important; justify-content: space-between !important; gap: 18px !important; margin: 0 !important; padding: 22px 24px 18px !important; border-bottom: 1px solid rgba(224, 188, 122, 0.16) !important; background: radial-gradient(circle at 80% 0%, rgba(245, 168, 0, 0.10), transparent 36%), linear-gradient(180deg, rgba(74, 19, 38, 0.98), rgba(43, 12, 25, 0.96)) !important; box-shadow: 0 10px 28px rgba(4, 0, 2, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.045) !important; } #bp-quick-offer-modal .bp-plus-modal__title { margin: 0 !important; color: #fff4df !important; font-family: "Oswald", "Nunito", system-ui, sans-serif !important; font-size: clamp(25px, 3vw, 36px) !important; font-weight: 900 !important; line-height: 1.02 !important; letter-spacing: 0.015em !important; text-transform: uppercase !important; } #bp-quick-offer-modal .bp-plus-modal__meta { max-width: 680px !important; margin-top: 9px !important; color: rgba(247, 238, 223, 0.78) !important; font-size: 14px !important; font-weight: 800 !important; line-height: 1.4 !important; } /* Close button — без черен символ. */ #bp-quick-offer-modal #bp-quick-offer-close { flex: 0 0 52px !important; width: 52px !important; height: 52px !important; min-width: 52px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; padding: 0 !important; border-radius: 17px !important; border: 1px solid rgba(224, 188, 122, 0.22) !important; background: linear-gradient(145deg, rgba(92, 34, 43, 0.88), rgba(38, 13, 23, 0.96)) !important; color: #f4c96f !important; font-size: 23px !important; font-weight: 900 !important; box-shadow: 0 10px 24px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.055) !important; } /* Само body-то скролва. */ #bp-quick-offer-modal .bp-plus-modal__body { flex: 1 1 auto !important; min-height: 0 !important; padding: 16px 18px 18px !important; overflow-y: auto !important; overflow-x: hidden !important; -webkit-overflow-scrolling: touch !important; color: #f7eedf !important; background: transparent !important; } #bp-quick-offer-modal #bp-quick-offer-body > div { gap: 14px !important; } /* Реалните секции. */ #bp-quick-offer-modal .bp-plus-block { min-width: 0 !important; padding: 17px !important; border-radius: 24px !important; border: 1px solid rgba(224, 188, 122, 0.13) !important; background: radial-gradient(circle at 10% 0%, rgba(224, 188, 122, 0.075), transparent 35%), linear-gradient(180deg, rgba(255, 255, 255, 0.042), rgba(255, 255, 255, 0.022)) !important; color: #f7eedf !important; box-shadow: 0 12px 28px rgba(5, 0, 3, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.035) !important; } #bp-quick-offer-modal .bp-plus-block__title { margin-bottom: 13px !important; color: #e8bd72 !important; font-family: "Oswald", "Nunito", system-ui, sans-serif !important; font-size: 13px !important; font-weight: 900 !important; line-height: 1.1 !important; letter-spacing: 0.16em !important; text-transform: uppercase !important; } /* Брой 1–8 — реалните бутони са data-qo-food-count. */ #bp-quick-offer-modal .bp-plus-tabs:has([data-qo-food-count]) { display: grid !important; grid-template-columns: repeat(8, minmax(46px, 1fr)) !important; gap: 9px !important; width: 100% !important; } #bp-quick-offer-modal [data-qo-food-count] { width: 100% !important; min-width: 0 !important; height: auto !important; min-height: 52px !important; padding: 0 !important; border-radius: 17px !important; border: 1px solid rgba(247, 238, 223, 0.14) !important; background: linear-gradient(180deg, rgba(255, 255, 255, 0.065), rgba(255, 255, 255, 0.032)) !important; color: #f7eedf !important; font-size: 16px !important; font-weight: 900 !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035) !important; } #bp-quick-offer-modal [data-qo-food-count].is-active { border-color: rgba(245, 168, 0, 0.88) !important; background: linear-gradient(145deg, #ffd162 0%, #f5a800 56%, #d68a0a 100%) !important; color: #321607 !important; box-shadow: 0 10px 24px rgba(245, 168, 0, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.30) !important; } /* Slot карта. */ #bp-quick-offer-modal .bp-qo-slot-card { position: relative !important; min-width: 0 !important; margin-top: 11px !important; padding: 15px !important; border-radius: 22px !important; border: 1px solid rgba(224, 188, 122, 0.15) !important; background: linear-gradient(145deg, rgba(66, 35, 44, 0.82), rgba(35, 17, 26, 0.94)) !important; color: #f7eedf !important; box-shadow: 0 10px 24px rgba(4, 0, 2, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.032) !important; } #bp-quick-offer-modal .bp-qo-slot-head { display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; align-items: center !important; gap: 12px !important; margin-bottom: 10px !important; } #bp-quick-offer-modal .bp-qo-slot-title { min-width: 0 !important; color: #fff4df !important; font-size: 18px !important; font-weight: 950 !important; line-height: 1.1 !important; } #bp-quick-offer-modal .bp-qo-slot-price { color: #f2c56d !important; font-size: 18px !important; font-weight: 950 !important; white-space: nowrap !important; } #bp-quick-offer-modal .bp-qo-clear-btn { min-height: 38px !important; padding: 8px 15px !important; border-radius: 13px !important; border: 1px solid rgba(247, 238, 223, 0.14) !important; background: rgba(255, 255, 255, 0.055) !important; color: rgba(247, 238, 223, 0.82) !important; font-size: 12px !important; font-weight: 900 !important; } /* Пица / Паста. */ #bp-quick-offer-modal .bp-qo-cat-tabs { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 9px !important; margin: 12px 0 !important; } #bp-quick-offer-modal .bp-qo-cat-btn { min-width: 0 !important; min-height: 44px !important; padding: 10px 14px !important; border-radius: 15px !important; border: 1px solid rgba(247, 238, 223, 0.14) !important; background: rgba(255, 255, 255, 0.05) !important; color: #f7eedf !important; font-size: 14px !important; font-weight: 900 !important; } #bp-quick-offer-modal .bp-qo-cat-btn.is-active { border-color: rgba(245, 168, 0, 0.86) !important; background: linear-gradient(145deg, #ffd162, #f5a800 58%, #d68a0a) !important; color: #321607 !important; } /* Dropdown. */ #bp-quick-offer-modal .bp-qo-select-wrap { width: 100% !important; min-width: 0 !important; } #bp-quick-offer-modal .bp-qo-select { width: 100% !important; max-width: 100% !important; min-height: 58px !important; padding: 13px 48px 13px 16px !important; border-radius: 17px !important; border: 1px solid rgba(224, 188, 122, 0.28) !important; background: linear-gradient(180deg, #241017, #16090f) !important; color: #fff4df !important; font-size: 16px !important; font-weight: 850 !important; line-height: 1.25 !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.025), 0 8px 18px rgba(0, 0, 0, 0.13) !important; } #bp-quick-offer-modal .bp-qo-select option { background: #241017 !important; color: #fff4df !important; } /* Обобщение — реалният клас е bp-plus-summary. */ #bp-quick-offer-modal .bp-plus-summary { color: #f7eedf !important; border-color: rgba(224, 188, 122, 0.14) !important; background: rgba(255, 255, 255, 0.025) !important; } #bp-quick-offer-modal .bp-plus-summary__row, #bp-quick-offer-modal .bp-plus-summary__row span { color: rgba(247, 238, 223, 0.86) !important; } #bp-quick-offer-modal .bp-plus-summary__row.is-total, #bp-quick-offer-modal .bp-plus-summary__row.is-total span { color: #fff4df !important; } /* Реалният footer е bp-plus-actions. */ #bp-quick-offer-modal .bp-plus-actions { position: sticky !important; bottom: -18px !important; z-index: 20 !important; display: grid !important; grid-template-columns: minmax(130px, 0.618fr) minmax(210px, 1fr) !important; gap: 11px !important; margin: 14px -18px -18px !important; padding: 14px 18px calc(14px + env(safe-area-inset-bottom, 0px)) !important; border-top: 1px solid rgba(224, 188, 122, 0.14) !important; background: linear-gradient(180deg, rgba(37, 13, 23, 0.90), rgba(17, 6, 11, 0.985)) !important; backdrop-filter: blur(16px) !important; -webkit-backdrop-filter: blur(16px) !important; } #bp-quick-offer-modal #bp-quick-offer-cancel, #bp-quick-offer-modal #bp-quick-offer-confirm { width: 100% !important; min-width: 0 !important; min-height: 54px !important; padding: 0 18px !important; border-radius: 17px !important; font-size: 15px !important; font-weight: 950 !important; line-height: 1 !important; } #bp-quick-offer-modal #bp-quick-offer-cancel { border: 1px solid rgba(247, 238, 223, 0.16) !important; background: linear-gradient(180deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.038)) !important; color: #f7eedf !important; } #bp-quick-offer-modal #bp-quick-offer-confirm { border: 1px solid rgba(255, 209, 98, 0.88) !important; background: linear-gradient(145deg, #ffd162 0%, #f5a800 56%, #d68a0a 100%) !important; color: #321607 !important; box-shadow: 0 14px 30px rgba(245, 168, 0, 0.19), inset 0 1px 0 rgba(255, 255, 255, 0.30) !important; } @media (max-width: 680px) { #bp-quick-offer-modal .bp-plus-modal__card { width: calc(100vw - 10px) !important; max-width: calc(100vw - 10px) !important; max-height: calc(100dvh - 8px) !important; border-radius: 24px 24px 10px 10px !important; } #bp-quick-offer-modal .bp-plus-modal__top { padding: 17px 15px 14px !important; gap: 10px !important; } #bp-quick-offer-modal .bp-plus-modal__title { font-size: 20px !important; } #bp-quick-offer-modal .bp-plus-modal__meta { font-size: 12px !important; } #bp-quick-offer-modal #bp-quick-offer-close { flex-basis: 44px !important; width: 44px !important; height: 44px !important; min-width: 44px !important; } #bp-quick-offer-modal .bp-plus-modal__body { padding: 11px !important; } #bp-quick-offer-modal .bp-plus-block { padding: 12px !important; border-radius: 19px !important; } #bp-quick-offer-modal .bp-plus-tabs:has([data-qo-food-count]) { grid-template-columns: repeat(4, 1fr) !important; gap: 7px !important; } #bp-quick-offer-modal [data-qo-food-count] { min-height: 44px !important; border-radius: 14px !important; font-size: 14px !important; } #bp-quick-offer-modal .bp-qo-slot-card { padding: 12px !important; border-radius: 18px !important; } #bp-quick-offer-modal .bp-qo-select { min-height: 52px !important; padding: 12px 44px 12px 13px !important; font-size: 14px !important; border-radius: 15px !important; } #bp-quick-offer-modal .bp-plus-actions { bottom: -11px !important; grid-template-columns: minmax(92px, 0.618fr) minmax(0, 1fr) !important; margin: 12px -11px -11px !important; padding: 11px 11px calc(11px + env(safe-area-inset-bottom, 0px)) !important; } #bp-quick-offer-modal #bp-quick-offer-cancel, #bp-quick-offer-modal #bp-quick-offer-confirm { min-height: 48px !important; padding: 0 11px !important; font-size: 13px !important; border-radius: 14px !important; } } /* ========================================================================== AMICI DELIVERY BONUS - COMPACT ROUND FOOD COUNT Desktop: 8 кръгли бутона на един ред. Mobile: 4 + 4. ========================================================================== */ #bp-quick-offer-modal .bp-qo-food-count-grid { display: grid !important; grid-template-columns: repeat(8, minmax(52px, 1fr)) !important; align-items: center !important; justify-items: center !important; width: 100% !important; gap: 10px !important; margin: 2px 0 8px !important; padding: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important; } /* Кръглите бутони 1-8. */ #bp-quick-offer-modal .bp-qo-food-count-grid [data-qo-food-count] { width: 56px !important; height: 56px !important; min-width: 56px !important; min-height: 56px !important; max-width: 56px !important; max-height: 56px !important; aspect-ratio: 1 / 1 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; margin: 0 !important; padding: 0 !important; border-radius: 999px !important; border: 1px solid rgba(247, 238, 223, 0.17) !important; background: radial-gradient( circle at 35% 22%, rgba(255, 255, 255, 0.08), transparent 42% ), linear-gradient( 145deg, rgba(82, 51, 60, 0.74), rgba(43, 25, 34, 0.92) ) !important; color: #fff4df !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 16px !important; font-weight: 950 !important; line-height: 1 !important; cursor: pointer !important; box-shadow: 0 8px 18px rgba(4, 0, 2, 0.15), inset 0 1px 0 rgba(255, 255, 255, 0.045) !important; transition: transform 0.16s ease, border-color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease !important; } #bp-quick-offer-modal .bp-qo-food-count-grid [data-qo-food-count]:hover { transform: translateY(-2px) !important; border-color: rgba(245, 168, 0, 0.44) !important; box-shadow: 0 12px 24px rgba(4, 0, 2, 0.20), 0 0 0 1px rgba(245, 168, 0, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.06) !important; } #bp-quick-offer-modal .bp-qo-food-count-grid [data-qo-food-count].is-active { transform: translateY(-1px) !important; border-color: rgba(255, 209, 98, 0.92) !important; background: radial-gradient( circle at 32% 20%, rgba(255, 255, 255, 0.38), transparent 40% ), linear-gradient( 145deg, #ffd162 0%, #f5a800 58%, #d98c09 100% ) !important; color: #3a1808 !important; box-shadow: 0 13px 28px rgba(245, 168, 0, 0.22), 0 0 0 1px rgba(245, 168, 0, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.34) !important; } /* Tablet. */ @media (max-width: 820px) { #bp-quick-offer-modal .bp-qo-food-count-grid { grid-template-columns: repeat(4, 1fr) !important; gap: 10px 8px !important; } } /* Mobile. */ @media (max-width: 680px) { #bp-quick-offer-modal .bp-qo-food-count-grid { grid-template-columns: repeat(4, 1fr) !important; gap: 9px 6px !important; margin-bottom: 5px !important; } #bp-quick-offer-modal .bp-qo-food-count-grid [data-qo-food-count] { width: 50px !important; height: 50px !important; min-width: 50px !important; min-height: 50px !important; max-width: 50px !important; max-height: 50px !important; font-size: 15px !important; } } /* Малки телефони. */ @media (max-width: 390px) { #bp-quick-offer-modal .bp-qo-food-count-grid { gap: 8px 4px !important; } #bp-quick-offer-modal .bp-qo-food-count-grid [data-qo-food-count] { width: 46px !important; height: 46px !important; min-width: 46px !important; min-height: 46px !important; max-width: 46px !important; max-height: 46px !important; } } /* ========================================================================== 🟣 AMICI DELIVERY BONUS — COMPACT SLOT LAYOUT Намалява височината на slot картите и вдига Пица / Паста нагоре. ========================================================================== */ #bp-quick-offer-modal .bp-qo-slot-card { display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; grid-template-areas: "head head" "tabs clear" "select select" !important; gap: 10px 12px !important; margin-top: 10px !important; padding: 14px 14px 14px !important; border-radius: 20px !important; min-width: 0 !important; } /* Заглавие + цена */ #bp-quick-offer-modal .bp-qo-slot-head { grid-area: head !important; display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; align-items: center !important; gap: 10px !important; margin: 0 !important; } #bp-quick-offer-modal .bp-qo-slot-title { font-size: 16px !important; line-height: 1.1 !important; margin: 0 !important; } #bp-quick-offer-modal .bp-qo-slot-price { font-size: 16px !important; line-height: 1 !important; margin: 0 !important; } /* Пица / Паста — вдигнати нагоре */ #bp-quick-offer-modal .bp-qo-cat-tabs { grid-area: tabs !important; display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 8px !important; margin: 0 !important; align-self: center !important; } #bp-quick-offer-modal .bp-qo-cat-btn { min-height: 42px !important; height: 42px !important; padding: 0 14px !important; border-radius: 14px !important; font-size: 14px !important; font-weight: 900 !important; line-height: 1 !important; } /* Изчисти — на същия ред вдясно */ #bp-quick-offer-modal .bp-qo-slot-actions { grid-area: clear !important; display: flex !important; align-items: center !important; justify-content: flex-end !important; margin: 0 !important; } #bp-quick-offer-modal .bp-qo-clear-btn { min-height: 42px !important; height: 42px !important; padding: 0 16px !important; border-radius: 14px !important; font-size: 13px !important; font-weight: 900 !important; line-height: 1 !important; white-space: nowrap !important; } /* Dropdown под тях */ #bp-quick-offer-modal .bp-qo-select-wrap { grid-area: select !important; margin: 0 !important; } #bp-quick-offer-modal .bp-qo-select { min-height: 54px !important; height: 54px !important; padding: 12px 46px 12px 16px !important; border-radius: 16px !important; font-size: 15px !important; font-weight: 850 !important; line-height: 1.2 !important; } #bp-quick-offer-modal .bp-qo-select-caret { right: 16px !important; font-size: 20px !important; } /* Ако label-ът в select е дълъг */ #bp-quick-offer-modal .bp-qo-select, #bp-quick-offer-modal .bp-qo-slot-title, #bp-quick-offer-modal .bp-qo-slot-price { overflow: hidden !important; text-overflow: ellipsis !important; } /* Mobile — подреждаме компактно, но не натъпкано */ @media (max-width: 680px) { #bp-quick-offer-modal .bp-qo-slot-card { grid-template-columns: 1fr !important; grid-template-areas: "head" "tabs" "clear" "select" !important; gap: 9px !important; padding: 12px !important; border-radius: 18px !important; } #bp-quick-offer-modal .bp-qo-slot-title, #bp-quick-offer-modal .bp-qo-slot-price { font-size: 15px !important; } #bp-quick-offer-modal .bp-qo-cat-btn { min-height: 40px !important; height: 40px !important; font-size: 13px !important; border-radius: 13px !important; } #bp-quick-offer-modal .bp-qo-slot-actions { justify-content: flex-start !important; } #bp-quick-offer-modal .bp-qo-clear-btn { min-height: 38px !important; height: 38px !important; padding: 0 14px !important; font-size: 12px !important; border-radius: 12px !important; } #bp-quick-offer-modal .bp-qo-select { min-height: 50px !important; height: 50px !important; padding: 11px 42px 11px 14px !important; font-size: 14px !important; border-radius: 15px !important; } } /* ========================================================================== 🟣 AMICI DELIVERY BONUS — REMOVE CLEAR ACTION / COMPACT SLOT FINAL ========================================================================== */ #bp-quick-offer-modal .bp-qo-slot-actions, #bp-quick-offer-modal .bp-qo-clear-btn { display: none !important; } /* Премахва празната колона, останала след бутона „Изчисти“. */ #bp-quick-offer-modal .bp-qo-slot-card { grid-template-columns: minmax(0, 1fr) !important; grid-template-areas: "head" "tabs" "select" !important; gap: 9px !important; padding: 13px !important; } /* Пица / Паста използват цялата ширина. */ #bp-quick-offer-modal .bp-qo-cat-tabs { width: 100% !important; margin: 2px 0 !important; } /* Още малко намаляване на общата височина. */ #bp-quick-offer-modal .bp-qo-slot-head { margin: 0 !important; } #bp-quick-offer-modal .bp-qo-select-wrap { margin-top: 1px !important; } @media (max-width: 680px) { #bp-quick-offer-modal .bp-qo-slot-card { grid-template-areas: "head" "tabs" "select" !important; gap: 8px !important; padding: 11px !important; } } /* ========================================================================== 🟣 AMICI AUTH MODAL — BODY SAFE DESKTOP + MOBILE FINAL Реални DOM класове. Работи и след hoist извън #bp-root. ========================================================================== */ html body #bp-auth, html body #bp-auth *, html body #bp-auth *::before, html body #bp-auth *::after { box-sizing: border-box !important; } /* Главният fullscreen слой. */ html body #bp-auth { position: fixed !important; inset: 0 !important; z-index: 2147483600 !important; width: 100vw !important; height: 100vh !important; height: 100dvh !important; display: none !important; align-items: center !important; justify-content: center !important; padding: 18px !important; margin: 0 !important; overflow: hidden !important; opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; color: #fff4df !important; font-family: "Nunito", system-ui, sans-serif !important; transform: none !important; translate: none !important; } html body #bp-auth.is-open { display: flex !important; opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; } /* Overlay. */ html body #bp-auth .bp-auth__ov { position: fixed !important; inset: 0 !important; z-index: 1 !important; width: 100vw !important; height: 100vh !important; height: 100dvh !important; background: rgba(6, 1, 4, 0.78) !important; backdrop-filter: blur(15px) saturate(1.08) !important; -webkit-backdrop-filter: blur(15px) saturate(1.08) !important; pointer-events: auto !important; } /* Реалната card структура. */ html body #bp-auth .bp-auth__card { position: relative !important; top: auto !important; right: auto !important; bottom: auto !important; left: auto !important; z-index: 2 !important; width: min(620px, calc(100vw - 36px)) !important; max-width: min(620px, calc(100vw - 36px)) !important; min-width: 0 !important; height: auto !important; max-height: calc(100dvh - 36px) !important; display: flex !important; flex-direction: column !important; margin: 0 !important; padding: 24px !important; overflow-y: auto !important; overflow-x: hidden !important; -webkit-overflow-scrolling: touch !important; overscroll-behavior: contain !important; transform: none !important; translate: none !important; border-radius: 30px !important; border: 1px solid rgba(224, 188, 122, 0.22) !important; background: radial-gradient( circle at 88% 4%, rgba(245, 168, 0, 0.13), transparent 28% ), radial-gradient( circle at 4% 70%, rgba(138, 46, 24, 0.18), transparent 34% ), linear-gradient( 155deg, #351522 0%, #211019 50%, #12070d 100% ) !important; box-shadow: 0 38px 100px rgba(5, 0, 3, 0.78), 0 15px 38px rgba(138, 46, 24, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.055) !important; color: #fff4df !important; pointer-events: auto !important; } /* Header. */ html body #bp-auth .bp-auth__top { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 16px !important; margin: 0 0 18px !important; } html body #bp-auth .bp-auth__top b { color: #fff4df !important; font-family: "Oswald", "Nunito", system-ui, sans-serif !important; font-size: clamp(24px, 3vw, 34px) !important; font-weight: 900 !important; line-height: 1 !important; letter-spacing: 0.015em !important; text-transform: uppercase !important; } /* Close. */ html body #bp-auth .bp-auth__x { flex: 0 0 50px !important; width: 50px !important; height: 50px !important; min-width: 50px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; padding: 0 !important; border-radius: 16px !important; border: 1px solid rgba(224, 188, 122, 0.22) !important; background: linear-gradient( 145deg, rgba(92, 34, 43, 0.88), rgba(38, 13, 23, 0.96) ) !important; color: #f4c96f !important; font-size: 22px !important; font-weight: 900 !important; cursor: pointer !important; box-shadow: 0 10px 24px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.055) !important; } /* Tabs. */ html body #bp-auth .bp-auth__tabs { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 10px !important; width: 100% !important; margin: 0 0 18px !important; } html body #bp-auth .bp-auth__tab { width: 100% !important; min-width: 0 !important; min-height: 50px !important; padding: 10px 14px !important; border-radius: 16px !important; border: 1px solid rgba(247, 238, 223, 0.14) !important; background: linear-gradient( 180deg, rgba(255, 255, 255, 0.065), rgba(255, 255, 255, 0.03) ) !important; color: #f7eedf !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 13px !important; font-weight: 950 !important; line-height: 1.15 !important; text-align: center !important; text-transform: uppercase !important; cursor: pointer !important; } html body #bp-auth .bp-auth__tab.is-active { border-color: rgba(255, 209, 98, 0.88) !important; background: linear-gradient( 145deg, #ffd162 0%, #f5a800 58%, #d68a0a 100% ) !important; color: #321607 !important; box-shadow: 0 12px 26px rgba(245, 168, 0, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.30) !important; } /* Form. */ html body #bp-auth .bp-auth__form { display: grid !important; gap: 13px !important; width: 100% !important; min-width: 0 !important; margin: 0 !important; } html body #bp-auth .bp-field { display: flex !important; flex-direction: column !important; gap: 7px !important; width: 100% !important; min-width: 0 !important; margin: 0 !important; } html body #bp-auth .bp-field label { color: #e8bd72 !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 11px !important; font-weight: 950 !important; line-height: 1 !important; letter-spacing: 0.14em !important; text-transform: uppercase !important; } /* Inputs. */ html body #bp-auth .bp-field input { display: block !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; min-height: 56px !important; padding: 13px 15px !important; border-radius: 17px !important; border: 1px solid rgba(224, 188, 122, 0.24) !important; background: linear-gradient( 180deg, #241017, #16090f ) !important; color: #fff4df !important; -webkit-text-fill-color: #fff4df !important; caret-color: #f5a800 !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 16px !important; font-weight: 850 !important; line-height: 1.2 !important; outline: none !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.025), 0 8px 18px rgba(0, 0, 0, 0.13) !important; } html body #bp-auth .bp-field input::placeholder { color: rgba(247, 238, 223, 0.52) !important; -webkit-text-fill-color: rgba(247, 238, 223, 0.52) !important; opacity: 1 !important; } html body #bp-auth .bp-field input:focus { border-color: rgba(245, 168, 0, 0.88) !important; box-shadow: 0 0 0 3px rgba(245, 168, 0, 0.11), inset 0 1px 0 rgba(255, 255, 255, 0.03) !important; } /* Forgot password. */ html body #bp-auth .bp-auth__subactions { display: flex !important; justify-content: flex-end !important; margin: -2px 0 0 !important; } html body #bp-auth .bp-auth__link { padding: 4px 0 !important; border: 0 !important; background: transparent !important; color: #e8bd72 !important; font-size: 13px !important; font-weight: 900 !important; text-decoration: underline !important; text-underline-offset: 3px !important; cursor: pointer !important; } /* Hint. */ html body #bp-auth .bp-auth__hint { margin: 0 !important; padding: 12px 14px !important; border-radius: 15px !important; border: 1px solid rgba(224, 188, 122, 0.12) !important; background: rgba(255, 255, 255, 0.035) !important; color: rgba(247, 238, 223, 0.78) !important; font-size: 13px !important; font-weight: 800 !important; line-height: 1.4 !important; } html body #bp-auth .bp-auth__hint b { color: #ffd162 !important; } /* Submit. */ html body #bp-auth .bp-auth__actions { display: grid !important; grid-template-columns: 1fr !important; gap: 10px !important; width: 100% !important; margin-top: 2px !important; } html body #bp-auth #bp-auth-submit { width: 100% !important; min-width: 0 !important; min-height: 56px !important; padding: 0 20px !important; border-radius: 17px !important; border: 1px solid rgba(255, 209, 98, 0.90) !important; background: linear-gradient( 145deg, #ffd162 0%, #f5a800 58%, #d68a0a 100% ) !important; color: #321607 !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 16px !important; font-weight: 950 !important; line-height: 1 !important; letter-spacing: 0.02em !important; cursor: pointer !important; box-shadow: 0 14px 30px rgba(245, 168, 0, 0.19), inset 0 1px 0 rgba(255, 255, 255, 0.30) !important; appearance: none !important; -webkit-appearance: none !important; } html body #bp-auth #bp-auth-submit:disabled { opacity: 0.55 !important; cursor: wait !important; } /* Errors. */ html body #bp-auth .bp-auth__err { display: none !important; padding: 11px 13px !important; border-radius: 14px !important; border: 1px solid rgba(255, 108, 108, 0.24) !important; background: rgba(128, 22, 35, 0.20) !important; color: #ffd7d7 !important; font-size: 13px !important; font-weight: 850 !important; line-height: 1.35 !important; } html body #bp-auth .bp-auth__err.is-on { display: block !important; } /* ========================================================================== MOBILE — bottom sheet, винаги във viewport. ========================================================================== */ @media (max-width: 680px) { html body #bp-auth { align-items: flex-end !important; justify-content: center !important; padding: 6px !important; padding-bottom: max( 6px, env(safe-area-inset-bottom, 0px) ) !important; } html body #bp-auth .bp-auth__card { width: 100% !important; max-width: 100% !important; max-height: calc(100dvh - 8px) !important; margin: 0 !important; padding: 17px 14px calc(17px + env(safe-area-inset-bottom, 0px)) !important; border-radius: 24px 24px 12px 12px !important; } html body #bp-auth .bp-auth__top { margin-bottom: 14px !important; } html body #bp-auth .bp-auth__top b { font-size: 21px !important; } html body #bp-auth .bp-auth__x { flex-basis: 44px !important; width: 44px !important; height: 44px !important; min-width: 44px !important; } html body #bp-auth .bp-auth__tabs { gap: 8px !important; margin-bottom: 14px !important; } html body #bp-auth .bp-auth__tab { min-height: 48px !important; padding: 9px 10px !important; font-size: 11.5px !important; } html body #bp-auth .bp-field input { min-height: 52px !important; /* 16px предотвратява автоматичния zoom в iOS Safari. */ font-size: 16px !important; } html body #bp-auth #bp-auth-submit { min-height: 52px !important; font-size: 15px !important; } } /* Много тесни телефони. */ @media (max-width: 390px) { html body #bp-auth .bp-auth__tabs { grid-template-columns: 1fr !important; } html body #bp-auth .bp-auth__card { padding-left: 12px !important; padding-right: 12px !important; } } /* ========================================================================== 🟣 AMICI OTP + FORGOT MODALS — BODY SAFE FINAL Desktop centered / Mobile bottom sheet. ========================================================================== */ html body #bp-otp, html body #bp-forgot, html body #bp-otp *, html body #bp-forgot * { box-sizing: border-box !important; } /* Full viewport layer. */ html body #bp-otp, html body #bp-forgot { position: fixed !important; inset: 0 !important; z-index: 2147483700 !important; width: 100vw !important; height: 100vh !important; height: 100dvh !important; display: none !important; align-items: center !important; justify-content: center !important; padding: 18px !important; margin: 0 !important; overflow: hidden !important; opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; transform: none !important; translate: none !important; color: #fff4df !important; font-family: "Nunito", system-ui, sans-serif !important; } html body #bp-otp.is-open, html body #bp-forgot.is-open { display: flex !important; opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; } /* Overlay. */ html body #bp-otp .bp-otp__ov, html body #bp-forgot .bp-forgot__ov { position: fixed !important; inset: 0 !important; z-index: 1 !important; width: 100vw !important; height: 100vh !important; height: 100dvh !important; background: rgba(6, 1, 4, 0.80) !important; backdrop-filter: blur(15px) saturate(1.08) !important; -webkit-backdrop-filter: blur(15px) saturate(1.08) !important; pointer-events: auto !important; } /* Cards. */ html body #bp-otp .bp-otp__card, html body #bp-forgot .bp-forgot__card { position: relative !important; top: auto !important; right: auto !important; bottom: auto !important; left: auto !important; z-index: 2 !important; width: min(560px, calc(100vw - 36px)) !important; max-width: min(560px, calc(100vw - 36px)) !important; min-width: 0 !important; height: auto !important; max-height: calc(100dvh - 36px) !important; display: flex !important; flex-direction: column !important; margin: 0 !important; padding: 22px !important; overflow-y: auto !important; overflow-x: hidden !important; -webkit-overflow-scrolling: touch !important; overscroll-behavior: contain !important; transform: none !important; translate: none !important; border-radius: 28px !important; border: 1px solid rgba(224, 188, 122, 0.22) !important; background: radial-gradient( circle at 88% 5%, rgba(245, 168, 0, 0.13), transparent 28% ), radial-gradient( circle at 4% 72%, rgba(138, 46, 24, 0.18), transparent 34% ), linear-gradient( 155deg, #351522 0%, #211019 50%, #12070d 100% ) !important; color: #fff4df !important; box-shadow: 0 38px 100px rgba(5, 0, 3, 0.78), 0 15px 38px rgba(138, 46, 24, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.055) !important; pointer-events: auto !important; } /* Header. */ html body #bp-otp .bp-otp__top, html body #bp-forgot .bp-forgot__top { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 14px !important; margin: 0 0 17px !important; } html body #bp-otp .bp-otp__top b, html body #bp-forgot .bp-forgot__top b { color: #fff4df !important; font-family: "Oswald", "Nunito", system-ui, sans-serif !important; font-size: 25px !important; font-weight: 900 !important; line-height: 1 !important; letter-spacing: 0.02em !important; text-transform: uppercase !important; } /* Close buttons. */ html body #bp-otp .bp-otp__x, html body #bp-forgot .bp-forgot__x { flex: 0 0 48px !important; width: 48px !important; height: 48px !important; min-width: 48px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; padding: 0 !important; border-radius: 16px !important; border: 1px solid rgba(224, 188, 122, 0.22) !important; background: linear-gradient( 145deg, rgba(92, 34, 43, 0.88), rgba(38, 13, 23, 0.96) ) !important; color: #f4c96f !important; font-size: 21px !important; font-weight: 900 !important; cursor: pointer !important; } /* Forms. */ html body #bp-otp .bp-auth__form, html body #bp-forgot .bp-auth__form { display: grid !important; gap: 13px !important; width: 100% !important; min-width: 0 !important; margin: 0 !important; } html body #bp-otp .bp-field, html body #bp-forgot .bp-field { display: flex !important; flex-direction: column !important; gap: 7px !important; width: 100% !important; min-width: 0 !important; } html body #bp-otp .bp-field label, html body #bp-forgot .bp-field label { color: #e8bd72 !important; font-size: 11px !important; font-weight: 950 !important; line-height: 1 !important; letter-spacing: 0.13em !important; text-transform: uppercase !important; } html body #bp-otp .bp-field input, html body #bp-forgot .bp-field input { display: block !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; min-height: 54px !important; padding: 13px 15px !important; border-radius: 17px !important; border: 1px solid rgba(224, 188, 122, 0.24) !important; background: linear-gradient( 180deg, #241017, #16090f ) !important; color: #fff4df !important; -webkit-text-fill-color: #fff4df !important; caret-color: #f5a800 !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 16px !important; font-weight: 850 !important; outline: none !important; } html body #bp-otp .bp-field input::placeholder, html body #bp-forgot .bp-field input::placeholder { color: rgba(247, 238, 223, 0.50) !important; -webkit-text-fill-color: rgba(247, 238, 223, 0.50) !important; opacity: 1 !important; } html body #bp-otp .bp-field input:focus, html body #bp-forgot .bp-field input:focus { border-color: rgba(245, 168, 0, 0.88) !important; box-shadow: 0 0 0 3px rgba(245, 168, 0, 0.11) !important; } /* Hint. */ html body #bp-otp .bp-otp__hint, html body #bp-forgot .bp-forgot__hint { padding: 11px 13px !important; border-radius: 14px !important; border: 1px solid rgba(224, 188, 122, 0.12) !important; background: rgba(255, 255, 255, 0.035) !important; color: rgba(247, 238, 223, 0.78) !important; font-size: 13px !important; font-weight: 800 !important; line-height: 1.4 !important; } /* Actions. */ html body #bp-otp .bp-otp__actions, html body #bp-forgot .bp-forgot__actions { display: grid !important; grid-template-columns: 0.72fr 1fr !important; gap: 10px !important; width: 100% !important; margin-top: 3px !important; } html body #bp-forgot #bp-forgot-actions-step1 { grid-template-columns: 1fr !important; } html body #bp-otp .bp-otp__actions button, html body #bp-forgot .bp-forgot__actions button { width: 100% !important; min-width: 0 !important; min-height: 52px !important; padding: 0 16px !important; border-radius: 16px !important; font-size: 14px !important; font-weight: 950 !important; } /* Secondary buttons. */ html body #bp-otp #bp-otp-resend, html body #bp-forgot #bp-forgot-resend { border: 1px solid rgba(247, 238, 223, 0.15) !important; background: linear-gradient( 180deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.038) ) !important; color: #f7eedf !important; } /* Primary buttons. */ html body #bp-otp #bp-otp-confirm, html body #bp-forgot #bp-forgot-send, html body #bp-forgot #bp-forgot-confirm { border: 1px solid rgba(255, 209, 98, 0.90) !important; background: linear-gradient( 145deg, #ffd162 0%, #f5a800 58%, #d68a0a 100% ) !important; color: #321607 !important; box-shadow: 0 14px 30px rgba(245, 168, 0, 0.19), inset 0 1px 0 rgba(255, 255, 255, 0.30) !important; } /* Messages. */ html body #bp-otp .bp-otp__err, html body #bp-forgot .bp-forgot__err, html body #bp-forgot #bp-forgot-ok { width: 100% !important; padding: 11px 13px !important; border-radius: 14px !important; font-size: 13px !important; font-weight: 850 !important; line-height: 1.35 !important; } /* ========================================================================== MOBILE ========================================================================== */ @media (max-width: 680px) { html body #bp-otp, html body #bp-forgot { align-items: flex-end !important; justify-content: center !important; padding: 6px !important; padding-bottom: max( 6px, env(safe-area-inset-bottom, 0px) ) !important; } html body #bp-otp .bp-otp__card, html body #bp-forgot .bp-forgot__card { width: 100% !important; max-width: 100% !important; max-height: calc(100dvh - 8px) !important; padding: 17px 14px calc(17px + env(safe-area-inset-bottom, 0px)) !important; border-radius: 24px 24px 12px 12px !important; } html body #bp-otp .bp-otp__top b, html body #bp-forgot .bp-forgot__top b { font-size: 20px !important; } html body #bp-otp .bp-otp__x, html body #bp-forgot .bp-forgot__x { flex-basis: 43px !important; width: 43px !important; height: 43px !important; min-width: 43px !important; } html body #bp-otp .bp-otp__actions, html body #bp-forgot .bp-forgot__actions { grid-template-columns: 1fr !important; } html body #bp-otp .bp-field input, html body #bp-forgot .bp-field input { min-height: 52px !important; font-size: 16px !important; } } /* ========================================================================== 🟣 AMICI QUICK OFFER — DIRECT DELIVERY + MOBILE ACTION FIX ========================================================================== */ #bp-quick-offer-modal #bp-quick-offer-confirm, html body #bp-check { pointer-events: auto !important; touch-action: manipulation !important; -webkit-tap-highlight-color: transparent !important; } #bp-quick-offer-modal .bp-qo-direct-delivery { display: grid !important; gap: 12px !important; } #bp-quick-offer-modal .bp-qo-direct-zones { display: grid !important; grid-template-columns: repeat(3, 1fr) !important; gap: 8px !important; } #bp-quick-offer-modal .bp-qo-direct-zone { min-width: 0 !important; min-height: 52px !important; display: grid !important; justify-items: center !important; align-content: center !important; gap: 4px !important; padding: 8px !important; border-radius: 15px !important; border: 1px solid rgba(247,238,223,.14) !important; background: rgba(255,255,255,.045) !important; color: #f7eedf !important; font-size: 12px !important; font-weight: 900 !important; cursor: pointer !important; touch-action: manipulation !important; } #bp-quick-offer-modal .bp-qo-direct-zone strong { color: #e8bd72 !important; font-size: 12px !important; } #bp-quick-offer-modal .bp-qo-direct-zone.is-active { border-color: rgba(255,209,98,.88) !important; background: linear-gradient( 145deg, #ffd162, #f5a800 58%, #d68a0a ) !important; color: #321607 !important; } #bp-quick-offer-modal .bp-qo-direct-zone.is-active strong { color: #321607 !important; } #bp-quick-offer-modal .bp-qo-direct-field { display: grid !important; gap: 7px !important; } #bp-quick-offer-modal .bp-qo-direct-field > span { color: #e8bd72 !important; font-size: 11px !important; font-weight: 950 !important; letter-spacing: .10em !important; text-transform: uppercase !important; } #bp-quick-offer-modal .bp-qo-direct-field input { width: 100% !important; min-height: 52px !important; padding: 12px 14px !important; border-radius: 16px !important; border: 1px solid rgba(224,188,122,.24) !important; background: linear-gradient(180deg, #241017, #16090f) !important; color: #fff4df !important; -webkit-text-fill-color: #fff4df !important; caret-color: #f5a800 !important; font-size: 16px !important; font-weight: 800 !important; outline: none !important; } #bp-quick-offer-modal .bp-qo-direct-field input:focus { border-color: rgba(245,168,0,.88) !important; box-shadow: 0 0 0 3px rgba(245,168,0,.11) !important; } @media (max-width: 560px) { #bp-quick-offer-modal .bp-qo-direct-zones { grid-template-columns: 1fr !important; } #bp-quick-offer-modal .bp-qo-direct-zone { grid-template-columns: 1fr auto !important; justify-items: stretch !important; text-align: left !important; } } /* ========================================================================== 🟣 AMICI ORDER SUCCESS MODAL — BODY SAFE PREMIUM FINAL Работи след hoist на #bp-modal директно в document.body. ========================================================================== */ html body #bp-modal, html body #bp-modal *, html body #bp-modal *::before, html body #bp-modal *::after { box-sizing: border-box !important; } /* Fullscreen modal layer */ html body #bp-modal { position: fixed !important; inset: 0 !important; z-index: 2147483800 !important; width: 100vw !important; height: 100vh !important; height: 100dvh !important; display: none !important; align-items: center !important; justify-content: center !important; padding: 20px !important; margin: 0 !important; overflow: hidden !important; opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; transform: none !important; translate: none !important; color: #fff4df !important; font-family: "Nunito", system-ui, sans-serif !important; } html body #bp-modal.is-open { display: flex !important; opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; } /* Background overlay */ html body #bp-modal .bp-modal__ov { position: fixed !important; inset: 0 !important; z-index: 1 !important; width: 100vw !important; height: 100vh !important; height: 100dvh !important; background: radial-gradient( circle at 50% 18%, rgba(138, 46, 24, 0.18), transparent 42% ), rgba(5, 1, 4, 0.82) !important; backdrop-filter: blur(16px) saturate(1.08) !important; -webkit-backdrop-filter: blur(16px) saturate(1.08) !important; pointer-events: auto !important; } /* Main card */ html body #bp-modal .bp-modal__card { position: relative !important; top: auto !important; right: auto !important; bottom: auto !important; left: auto !important; z-index: 2 !important; width: min(720px, calc(100vw - 40px)) !important; max-width: min(720px, calc(100vw - 40px)) !important; min-width: 0 !important; height: auto !important; max-height: calc(100dvh - 40px) !important; display: flex !important; flex-direction: column !important; gap: 20px !important; margin: 0 !important; padding: 30px !important; overflow-y: auto !important; overflow-x: hidden !important; transform: none !important; translate: none !important; border-radius: 30px !important; border: 1px solid rgba(224, 188, 122, 0.22) !important; background: radial-gradient( circle at 88% 4%, rgba(245, 168, 0, 0.13), transparent 27% ), radial-gradient( circle at 5% 75%, rgba(138, 46, 24, 0.20), transparent 34% ), linear-gradient( 150deg, #351522 0%, #241019 50%, #12070d 100% ) !important; color: #fff4df !important; box-shadow: 0 42px 110px rgba(4, 0, 2, 0.78), 0 16px 42px rgba(138, 46, 24, 0.20), inset 0 1px 0 rgba(255, 255, 255, 0.055) !important; pointer-events: auto !important; -webkit-overflow-scrolling: touch !important; } /* Decorative gold line */ html body #bp-modal .bp-modal__card::before { content: "" !important; position: absolute !important; top: 0 !important; left: 30px !important; right: 30px !important; height: 1px !important; background: linear-gradient( 90deg, transparent, rgba(255, 209, 98, 0.70), transparent ) !important; pointer-events: none !important; } /* Header */ html body #bp-modal .bp-modal__top { display: grid !important; grid-template-columns: 72px minmax(0, 1fr) !important; align-items: center !important; gap: 18px !important; margin: 0 !important; padding: 0 !important; } /* Success check icon */ html body #bp-modal .bp-ok { width: 72px !important; height: 72px !important; min-width: 72px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; margin: 0 !important; padding: 0 !important; border-radius: 22px !important; border: 1px solid rgba(255, 209, 98, 0.42) !important; background: radial-gradient( circle at 30% 20%, rgba(255, 255, 255, 0.18), transparent 40% ), linear-gradient( 145deg, rgba(113, 57, 30, 0.96), rgba(69, 27, 25, 0.98) ) !important; color: #fff4df !important; font-size: 40px !important; font-weight: 950 !important; line-height: 1 !important; box-shadow: 0 14px 30px rgba(5, 0, 3, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.10) !important; } html body #bp-modal .bp-modal__t { margin: 0 !important; color: #fff4df !important; font-family: "Oswald", "Nunito", system-ui, sans-serif !important; font-size: clamp(27px, 4vw, 38px) !important; font-weight: 900 !important; line-height: 1.02 !important; letter-spacing: 0.015em !important; text-transform: uppercase !important; } html body #bp-modal .bp-modal__s { margin-top: 8px !important; color: rgba(247, 238, 223, 0.72) !important; font-size: 15px !important; font-weight: 800 !important; line-height: 1.4 !important; } html body #bp-modal .bp-modal__s b { color: #ffd162 !important; } /* Delivery / pickup information card */ html body #bp-modal .bp-modal__pickup { width: 100% !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; color: #f7eedf !important; } html body #bp-modal .bp-success-handoff { display: grid !important; grid-template-columns: 58px minmax(0, 1fr) !important; align-items: center !important; gap: 16px !important; width: 100% !important; min-width: 0 !important; padding: 18px !important; border-radius: 22px !important; border: 1px solid rgba(224, 188, 122, 0.18) !important; background: radial-gradient( circle at 6% 10%, rgba(245, 168, 0, 0.10), transparent 34% ), linear-gradient( 145deg, rgba(74, 35, 38, 0.76), rgba(35, 15, 24, 0.94) ) !important; box-shadow: 0 12px 28px rgba(5, 0, 3, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.035) !important; } html body #bp-modal .bp-success-handoff__icon { width: 58px !important; height: 58px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; border-radius: 18px !important; border: 1px solid rgba(255, 209, 98, 0.24) !important; background: rgba(245, 168, 0, 0.10) !important; font-size: 27px !important; line-height: 1 !important; } html body #bp-modal .bp-success-handoff__content { min-width: 0 !important; } html body #bp-modal .bp-success-handoff__title { color: #fff4df !important; font-size: 17px !important; font-weight: 950 !important; line-height: 1.2 !important; } html body #bp-modal .bp-success-handoff__desc { margin-top: 5px !important; color: rgba(247, 238, 223, 0.68) !important; font-size: 13px !important; font-weight: 800 !important; line-height: 1.4 !important; } html body #bp-modal .bp-success-handoff__address { display: flex !important; flex-wrap: wrap !important; gap: 5px !important; margin-top: 9px !important; padding-top: 9px !important; border-top: 1px solid rgba(247, 238, 223, 0.10) !important; font-size: 13px !important; line-height: 1.35 !important; } html body #bp-modal .bp-success-handoff__address span { color: rgba(247, 238, 223, 0.58) !important; font-weight: 800 !important; } html body #bp-modal .bp-success-handoff__address strong { color: #ffd162 !important; font-weight: 950 !important; } /* Optional information blocks */ html body #bp-modal .bp-modal__burger, html body #bp-modal .bp-modal__split { margin: 0 !important; padding: 13px 15px !important; border-radius: 16px !important; border: 1px solid rgba(224, 188, 122, 0.12) !important; background: rgba(255, 255, 255, 0.035) !important; color: rgba(247, 238, 223, 0.76) !important; font-size: 13px !important; font-weight: 800 !important; line-height: 1.4 !important; } /* Empty order-id element must not create height */ html body #bp-modal .bp-modal__id:empty { display: none !important; } /* Jackpot */ html body #bp-modal .bp-jackpot-banner[hidden] { display: none !important; } /* Action buttons */ html body #bp-modal .bp-modal__btns { position: static !important; display: grid !important; grid-template-columns: minmax(140px, 0.618fr) minmax(220px, 1fr) !important; align-items: stretch !important; gap: 12px !important; width: 100% !important; margin: 0 !important; padding: 0 !important; } html body #bp-modal #bp-modal-close, html body #bp-modal #bp-modal-open-profile { position: static !important; width: 100% !important; min-width: 0 !important; min-height: 56px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; margin: 0 !important; padding: 0 20px !important; border-radius: 17px !important; font-family: "Nunito", system-ui, sans-serif !important; font-size: 15px !important; font-weight: 950 !important; line-height: 1 !important; letter-spacing: 0.02em !important; text-align: center !important; text-decoration: none !important; cursor: pointer !important; touch-action: manipulation !important; transition: transform 0.16s ease, box-shadow 0.16s ease, filter 0.16s ease !important; } /* Secondary close button */ html body #bp-modal #bp-modal-close { border: 1px solid rgba(247, 238, 223, 0.16) !important; background: linear-gradient( 180deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.038) ) !important; color: #f7eedf !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04) !important; appearance: none !important; -webkit-appearance: none !important; } /* Main status button */ html body #bp-modal #bp-modal-open-profile { border: 1px solid rgba(255, 209, 98, 0.92) !important; background: radial-gradient( circle at 25% 10%, rgba(255, 255, 255, 0.28), transparent 36% ), linear-gradient( 145deg, #ffd162 0%, #f5a800 58%, #d68a0a 100% ) !important; color: #321607 !important; box-shadow: 0 15px 32px rgba(245, 168, 0, 0.20), inset 0 1px 0 rgba(255, 255, 255, 0.34) !important; } html body #bp-modal #bp-modal-close:hover, html body #bp-modal #bp-modal-open-profile:hover { transform: translateY(-1px) !important; filter: brightness(1.04) !important; } html body #bp-modal #bp-modal-close:active, html body #bp-modal #bp-modal-open-profile:active { transform: translateY(0) scale(0.985) !important; } /* ========================================================================== MOBILE ========================================================================== */ @media (max-width: 680px) { html body #bp-modal { align-items: flex-end !important; justify-content: center !important; padding: 6px !important; padding-bottom: max( 6px, env(safe-area-inset-bottom, 0px) ) !important; } html body #bp-modal .bp-modal__card { width: 100% !important; max-width: 100% !important; max-height: calc(100dvh - 8px) !important; gap: 16px !important; padding: 22px 16px calc(18px + env(safe-area-inset-bottom, 0px)) !important; border-radius: 26px 26px 12px 12px !important; } html body #bp-modal .bp-modal__card::before { left: 20px !important; right: 20px !important; } html body #bp-modal .bp-modal__top { grid-template-columns: 58px minmax(0, 1fr) !important; gap: 13px !important; } html body #bp-modal .bp-ok { width: 58px !important; height: 58px !important; min-width: 58px !important; border-radius: 18px !important; font-size: 32px !important; } html body #bp-modal .bp-modal__t { font-size: 23px !important; } html body #bp-modal .bp-modal__s { margin-top: 6px !important; font-size: 13px !important; } html body #bp-modal .bp-success-handoff { grid-template-columns: 48px minmax(0, 1fr) !important; gap: 12px !important; padding: 14px !important; border-radius: 19px !important; } html body #bp-modal .bp-success-handoff__icon { width: 48px !important; height: 48px !important; border-radius: 15px !important; font-size: 23px !important; } html body #bp-modal .bp-success-handoff__title { font-size: 15px !important; } html body #bp-modal .bp-success-handoff__desc, html body #bp-modal .bp-success-handoff__address { font-size: 12px !important; } html body #bp-modal .bp-modal__btns { grid-template-columns: 1fr !important; gap: 9px !important; } /* Main action first on mobile */ html body #bp-modal #bp-modal-open-profile { order: 1 !important; } html body #bp-modal #bp-modal-close { order: 2 !important; } html body #bp-modal #bp-modal-close, html body #bp-modal #bp-modal-open-profile { min-height: 52px !important; border-radius: 15px !important; font-size: 14px !important; } } /* Very small phones */ @media (max-width: 390px) { html body #bp-modal .bp-modal__card { padding-left: 13px !important; padding-right: 13px !important; } html body #bp-modal .bp-modal__top { grid-template-columns: 50px minmax(0, 1fr) !important; } html body #bp-modal .bp-ok { width: 50px !important; height: 50px !important; min-width: 50px !important; font-size: 28px !important; } html body #bp-modal .bp-modal__t { font-size: 20px !important; } }