.elementor-808 .elementor-element.elementor-element-576efa4{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-808 .elementor-element.elementor-element-576efa4.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-808 .elementor-element.elementor-element-4a507d4{--display:flex;}.elementor-808 .elementor-element.elementor-element-9d6732e .woocommerce-breadcrumb{color:#C0C0C0;font-size:14px;font-weight:400;}.elementor-808 .elementor-element.elementor-element-9d6732e .woocommerce-breadcrumb > a{color:#AFAFAF;}.elementor-808 .elementor-element.elementor-element-00b208c{--display:flex;}.elementor-808 .elementor-element.elementor-element-764b444{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;border-style:solid;--border-style:solid;border-width:4px 0px 0px 0px;--border-top-width:4px;--border-right-width:0px;--border-bottom-width:0px;--border-left-width:0px;border-color:#02DD46;--border-color:#02DD46;--border-radius:1% 1% 2% 2%;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-808 .elementor-element.elementor-element-764b444:not(.elementor-motion-effects-element-type-background), .elementor-808 .elementor-element.elementor-element-764b444 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-808 .elementor-element.elementor-element-764b444.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-808 .elementor-element.elementor-element-a473728{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--margin-top:49px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-808 .elementor-element.elementor-element-e41568b{--display:flex;--min-height:196px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.woocommerce .elementor-808 .elementor-element.elementor-element-6941a70 .woocommerce-product-gallery__trigger + .woocommerce-product-gallery__wrapper, .woocommerce .elementor-808 .elementor-element.elementor-element-6941a70 .flex-viewport, .woocommerce .elementor-808 .elementor-element.elementor-element-6941a70 .flex-control-thumbs img{border-style:none;}.woocommerce .elementor-808 .elementor-element.elementor-element-6941a70 .woocommerce-product-gallery__trigger + .woocommerce-product-gallery__wrapper, .woocommerce .elementor-808 .elementor-element.elementor-element-6941a70 .flex-viewport{border-radius:22px 22px 22px 22px;}.woocommerce .elementor-808 .elementor-element.elementor-element-6941a70 .flex-viewport:not(:last-child){margin-bottom:10px;}.woocommerce .elementor-808 .elementor-element.elementor-element-6941a70 .flex-control-thumbs img{border-style:solid;border-color:#57D008;border-radius:17px 17px 17px 17px;}.woocommerce .elementor-808 .elementor-element.elementor-element-6941a70 .flex-control-thumbs li{padding-right:calc(0px / 2);padding-left:calc(0px / 2);padding-bottom:0px;}.woocommerce .elementor-808 .elementor-element.elementor-element-6941a70 .flex-control-thumbs{margin-right:calc(-0px / 2);margin-left:calc(-0px / 2);}.elementor-808 .elementor-element.elementor-element-03deaa1{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-808 .elementor-element.elementor-element-c963944{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-widget-woocommerce-product-title .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-808 .elementor-element.elementor-element-b4370f4 .elementor-heading-title{font-family:"Balsamiq Sans", Sans-serif;font-size:40px;font-weight:700;color:#000000;}.elementor-808 .elementor-element.elementor-element-b4370f4 .elementor-heading-title a:hover, .elementor-808 .elementor-element.elementor-element-b4370f4 .elementor-heading-title a:focus{color:#000000;}.elementor-808 .elementor-element.elementor-element-3918465{--display:flex;--margin-top:-28px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-808 .elementor-element.elementor-element-3918465.e-con{--flex-grow:0;--flex-shrink:0;}.woocommerce .elementor-808 .elementor-element.elementor-element-c2a814c .woocommerce-product-details__short-description{color:#747474;font-family:"Balsamiq Sans", Sans-serif;font-size:18px;line-height:22px;}.elementor-808 .elementor-element.elementor-element-0685a47{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-808 .elementor-element.elementor-element-c940449{font-family:"Balsamiq Sans", Sans-serif;font-size:14px;font-weight:400;color:#000000;}.elementor-808 .elementor-element.elementor-element-f314017{font-family:"Balsamiq Sans", Sans-serif;font-weight:400;color:#000000;}.elementor-808 .elementor-element.elementor-element-50e1258{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-808 .elementor-element.elementor-element-7b36518{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.woocommerce .elementor-widget-woocommerce-product-price .price{color:var( --e-global-color-primary );font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.woocommerce .elementor-808 .elementor-element.elementor-element-bdd289a .price{color:#000000;font-family:"Balsamiq Sans", Sans-serif;font-size:32px;font-weight:700;}.elementor-808 .elementor-element.elementor-element-37cc046{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-widget-woocommerce-product-add-to-cart .added_to_cart{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-808 .elementor-element.elementor-element-7e7008d .cart button, .elementor-808 .elementor-element.elementor-element-7e7008d .cart .button{transition:all 0.2s;}.elementor-808 .elementor-element.elementor-element-7e7008d{--view-cart-spacing:0px;--button-spacing:21px;}.elementor-808 .elementor-element.elementor-element-7e7008d .quantity .qty{transition:all 0.2s;}.elementor-808 .elementor-element.elementor-element-3c02591{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-808 .elementor-element.elementor-element-9913981{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-808 .elementor-element.elementor-element-f985dd9{--display:flex;--margin-top:-24px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-808 .elementor-element.elementor-element-52ca4f1 .elementor-heading-title{font-family:"Balsamiq Sans", Sans-serif;font-size:23px;font-weight:700;color:#000000;}.elementor-808 .elementor-element.elementor-element-724dced{--display:flex;}.elementor-808 .elementor-element.elementor-element-1697e2f{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-808 .elementor-element.elementor-element-b739179{--display:flex;}.elementor-808 .elementor-element.elementor-element-844f5c4 .elementor-heading-title{font-family:"Balsamiq Sans", Sans-serif;font-size:23px;font-weight:700;color:#000000;}.elementor-808 .elementor-element.elementor-element-d9724fd{--display:flex;}.elementor-widget-woocommerce-product-related.elementor-wc-products ul.products li.product .woocommerce-loop-product__title{color:var( --e-global-color-primary );}.elementor-widget-woocommerce-product-related.elementor-wc-products ul.products li.product .woocommerce-loop-category__title{color:var( --e-global-color-primary );}.elementor-widget-woocommerce-product-related.elementor-wc-products ul.products li.product .woocommerce-loop-product__title, .elementor-widget-woocommerce-product-related.elementor-wc-products ul.products li.product .woocommerce-loop-category__title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.woocommerce .elementor-widget-woocommerce-product-related.elementor-wc-products .products > h2{color:var( --e-global-color-primary );font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-woocommerce-product-related.elementor-wc-products ul.products li.product .price{color:var( --e-global-color-primary );font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-woocommerce-product-related.elementor-wc-products ul.products li.product .price ins{color:var( --e-global-color-primary );}.elementor-widget-woocommerce-product-related.elementor-wc-products ul.products li.product .price ins .amount{color:var( --e-global-color-primary );}.elementor-widget-woocommerce-product-related.elementor-wc-products ul.products li.product .price del{color:var( --e-global-color-primary );}.elementor-widget-woocommerce-product-related.elementor-wc-products ul.products li.product .price del .amount{color:var( --e-global-color-primary );}.elementor-widget-woocommerce-product-related.elementor-wc-products ul.products li.product .price del {font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-woocommerce-product-related.elementor-wc-products ul.products li.product .button{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-woocommerce-product-related.elementor-wc-products .added_to_cart{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-808 .elementor-element.elementor-element-dc9b85d.elementor-wc-products ul.products{grid-column-gap:18px;grid-row-gap:42px;}.elementor-808 .elementor-element.elementor-element-dc9b85d.elementor-wc-products ul.products li.product .woocommerce-loop-product__title{color:#000000;}.elementor-808 .elementor-element.elementor-element-dc9b85d.elementor-wc-products ul.products li.product .woocommerce-loop-category__title{color:#000000;}.elementor-808 .elementor-element.elementor-element-dc9b85d.elementor-wc-products ul.products li.product span.onsale{display:block;}.elementor-808 .elementor-element.elementor-element-7fd6ddd{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-808 .elementor-element.elementor-element-06fa3f7{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}@media(max-width:1024px){.elementor-808 .elementor-element.elementor-element-724dced{--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-808 .elementor-element.elementor-element-dc9b85d.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}}@media(max-width:767px){.elementor-808 .elementor-element.elementor-element-576efa4{--width:100%;}.elementor-808 .elementor-element.elementor-element-764b444{--width:100%;}.woocommerce .elementor-808 .elementor-element.elementor-element-bdd289a .price{font-size:25px;}.elementor-808 .elementor-element.elementor-element-f985dd9{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-808 .elementor-element.elementor-element-dc9b85d.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}}@media(min-width:768px){.elementor-808 .elementor-element.elementor-element-4a507d4{--content-width:1400px;}.elementor-808 .elementor-element.elementor-element-00b208c{--content-width:1400px;}.elementor-808 .elementor-element.elementor-element-a473728{--content-width:1150px;}.elementor-808 .elementor-element.elementor-element-e41568b{--content-width:658px;}.elementor-808 .elementor-element.elementor-element-03deaa1{--content-width:552px;}.elementor-808 .elementor-element.elementor-element-3918465{--width:98.23%;}.elementor-808 .elementor-element.elementor-element-3c02591{--content-width:1212px;}.elementor-808 .elementor-element.elementor-element-f985dd9{--content-width:1212px;}.elementor-808 .elementor-element.elementor-element-724dced{--content-width:1212px;}.elementor-808 .elementor-element.elementor-element-1697e2f{--content-width:1140px;}.elementor-808 .elementor-element.elementor-element-b739179{--content-width:1212px;}.elementor-808 .elementor-element.elementor-element-d9724fd{--width:1212px;}}/* Start custom CSS for html, class: .elementor-element-1d916e7 */#zalij-sam-selected { font-size: 1.1rem; color: #111; margin-bottom: 8px; }/* End custom CSS */ /* Start custom CSS for woocommerce-product-add-to-cart, class: .elementor-element-7e7008d *//* ===== КОНТЕЙНЕР ЛІЧИЛЬНИКА + КНОПКА ===== */ form.cart { display: flex !important; align-items: center !important; /* Центрує все по осі */ gap: 24px; /* Відстань між лічильником і кнопкою */ margin: 0 auto !important; justify-content: flex-start; } /* ====== КОНТЕЙНЕР ЛІЧИЛЬНИКА ====== */ .quantity.buttons_added { width: 107px; height: 40px; background: #FAFAFA; border: 1px solid #EFEFEF; border-radius: 32px; display: flex !important; align-items: center; justify-content: center; gap: 10px; box-sizing: border-box; margin: 0 !important; padding: 0 !important; } /* ====== КНОПКА "-" ====== */ .quantity .minus, .quantity .plus { width: 27px !important; height: 27px !important; background: #9ACB34 !important; border: 1px solid #181818 !important; border-radius: 50% !important; color: #181818 !important; display: flex !important; align-items: center; justify-content: center; font-size: 24px !important; font-weight: 700 !important; cursor: pointer; margin: 0 !important; padding: 0 !important; box-shadow: none !important; transition: background 0.2s, color 0.2s, border 0.2s; line-height: 1 !important; text-decoration: none !important; text-align: center; } /* ====== ХОВЕР ====== */ .quantity .minus:hover, .quantity .plus:hover { background: #85b52d !important; color: #000 !important; } /* ====== ЦИФРА ====== */ .quantity input.qty { font-family: 'Balsamiq Sans', sans-serif !important; font-size: 24px !important; color: #181818 !important; border: none !important; background: transparent !important; text-align: center !important; width: 24px !important; min-width: 24px !important; max-width: 24px !important; padding: 0 !important; box-shadow: none !important; appearance: textfield !important; height: 100% !important; margin: 0 !important; line-height: 1 !important; } /* Прибрати стрілки input[type=number] */ .quantity input.qty::-webkit-outer-spin-button, .quantity input.qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } .quantity input.qty[type=number] { -moz-appearance: textfield; } /* ====== КНОПКА "ДОДАТИ У КОШИК" ====== */ .single_add_to_cart_button { background: #9ACB34 !important; color: #181818 !important; border-radius: 24px !important; border: 2px solid #181818 !important; font-family: 'Balsamiq Sans', sans-serif !important; font-size: 18px !important; font-weight: 700 !important; padding: 7px 36px !important; min-width: 207px !important; min-height: 56px !important; display: flex !important; align-items: center !important; justify-content: center !important; cursor: pointer !important; box-shadow: none !important; transition: background 0.2s, color 0.2s, border 0.2s !important; margin: 0 !important; letter-spacing: 2px !important; line-height: 1.1 !important; } /* Ховер для кнопки */ .single_add_to_cart_button:hover { background: #85b52d !important; color: #000 !important; } /* ====== МОБІЛЬНА АДАПТАЦІЯ ====== */ @media (max-width: 600px) { form.cart { gap: 16px; align-items: center !important; } .quantity.buttons_added { width: 100px !important; height: 36px !important; border-radius: 32px !important; gap: 4px !important; } .quantity .minus, .quantity .plus { width: 24px !important; height: 24px !important; font-size: 18px !important; border-width: 2px !important; border-radius:32px; } .quantity input.qty { font-size: 18px !important; width: 18px !important; min-width: 18px !important; max-width: 18px !important; } .single_add_to_cart_button { font-size: 18px !important; min-width: 140px !important; min-height: 44px !important; border-radius: 16px !important; padding: 4px 16px !important; } .single_add_to_cart_button { background: #9ACB34 !important; color: #181818 !important; border-radius: 24px !important; border: 2px solid #181818 !important; font-family: 'Balsamiq Sans', sans-serif !important; font-size: 18px !important; font-weight: 700 !important; min-width: 200px !important; min-height: 48px !important; display: flex !important; align-items: center !important; justify-content: center !important; cursor: pointer !important; box-shadow: none !important; transition: background 0.2s, color 0.2s, border 0.2s !important; margin: 0 !important; letter-spacing: 2px !important; line-height: 1.1 !important; } }/* End custom CSS */ /* Start custom CSS for html, class: .elementor-element-e26f180 *//* ===== Стилі для карток "Залий сам" (v_final_consolidated) ===== */ /* 1. Список карток */ .zalij-sam-list { display: grid; grid-template-columns: repeat(3, 1fr); /* 3 колонки */ gap: 20px; padding: 10px; justify-items: center; } /* 2. Сама картка */ .zalij-sam-card { width: 374px; height: 152px; border-radius: 24px; border: 1px solid #E0E0E0; /* Товщина рамки з ваших даних */ padding: 16px; /* Ваш відступ */ display: flex; align-items: center; background: #fff; box-sizing: border-box; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06); gap: 16px; /* Відступ між фото та правим блоком */ } /* 3. Фото */ .zalij-sam-card img { width: 120px; height: 120px; border-radius: 16px; /* Ваше заокруглення */ object-fit: cover; flex-shrink: 0; } /* 4. Правий блок (Інфо + Дії) - потрібен для вертикального розташування */ .zalij-sam-content-action-wrapper { flex-grow: 1; display: flex; flex-direction: column; min-width: 0; height: 100%; /* Розтягуємо на всю висоту */ } /* 4а. Текстовий блок (Назва, Вага, Ціна) */ .zalij-sam-info { display: flex; flex-direction: column; gap: 6px; flex-grow: 1; /* Займає місце, штовхаючи дії вниз */ } /* 4. Текстовий блок (Інфо) */ /* 5. Назва соусу (в один рядок) */ .zalij-sam-title { font-family: 'Balsamiq Sans', sans-serif; font-weight: 700; font-size: 18px; line-height: 1.15; letter-spacing: 0.04em; color: #111; /* --- Стилі для одного рядка --- */ white-space: nowrap; /* Забороняємо перенос рядків */ overflow: hidden; /* Ховаємо текст, що не вміщується */ text-overflow: ellipsis; /* Додаємо три крапки (...) */ /* --- Видаляємо непотрібні правила переносу --- */ /* overflow-wrap: break-word; */ /* word-break: break-word; */ } /* 6. Вага */ .zalij-sam-weight { display: flex; align-items: center; gap: 4px; font-size: 14px; color: #555; font-family: 'Balsamiq Sans', sans-serif; } .zalij-sam-weight svg { width: 18px; height: 19px; fill: #555; } /* 7. Ціна */ .zalij-sam-price { font-family: 'Balsamiq Sans', sans-serif; font-weight: 700; font-size: 20px; line-height: 1; letter-spacing: 0.04em; color: #000000; } /* 8. Блок дій (розташовується під Інфо) */ .zalij-sam-action { display: flex; align-items: center; justify-content: flex-end; /* Притискаємо до правого краю */ margin-top: auto; /* Притискаємо до низу */ padding-top: 8px; /* Відступ від ціни/ваги */ width: 100%; } /* 9. Обгортка для кнопок +/- */ .zalij-sam-qty-wrap { width: 107px; height: 40px; border-radius: 32px; border: 1px solid #B0B0B0; /* Ваша товщина рамки */ padding: 8px; /* Ваш відступ */ gap: 10px; /* Ваш відступ */ display: flex; align-items: center; justify-content: space-between; box-sizing: border-box; background-color: #f7f7f7; } /* Приховуємо блок +/- за замовчуванням */ .zalij-sam-action.qty-hidden .zalij-sam-qty-wrap { display: none; } /* Показуємо, коли клас знято */ .zalij-sam-action:not(.qty-hidden) .zalij-sam-qty-wrap { display: flex; } /* 10. Кнопки +/- */ .zalij-sam-qty-btn { width: 26px; /* (40px - 2*8px padding) = 24px, трохи збільшимо */ height: 26px; border-radius: 50%; background-color: #9ACB34; /* Ваш колір */ border: 1.5px solid #000; color: #000; font-size: 18px; font-weight: bold; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center; padding: 0; flex-shrink: 0; transition: background-color 0.15s; } .zalij-sam-qty-btn:active { background-color: #BDF13C; } /* 11. Поле з кількістю */ .zalij-sam-qty { font-size: 16px; font-weight: 700; color: #111; text-align: center; flex-grow: 1; } /* 12. Кнопка "Хочу!" */ .zalij-sam-add { width: 79px; height: 40px; border-radius: 32px; border: 2px solid #000; /* Ваша товщина рамки */ background: #9ACB34; /* Ваш фон */ padding: 9px 16px; /* Ваші відступи */ color: #111; font-size: 16px; font-weight: 700; font-family: 'Balsamiq Sans', sans-serif; cursor: pointer; white-space: nowrap; display: flex; align-items: center; justify-content: center; box-sizing: border-box; transition: background-color 0.15s; } .zalij-sam-add:disabled { cursor: default; opacity: 0.7; } .zalij-sam-add:active:not(:disabled) { background: #BDF13C; } /* Ховаємо кнопку "Хочу!", коли +/- видимі */ .zalij-sam-action:not(.qty-hidden) .zalij-sam-add { display: none !important; } /* Показуємо кнопку "Хочу!", коли +/- приховані (початковий стан) */ .zalij-sam-action.qty-hidden .zalij-sam-add { display: flex !important; } /* ===== Адаптив ===== */ /* Планшет: ~2 колонки */ @media (max-width: 1220px) { .zalij-sam-list { grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); /* Дозволяємо адаптуватись */ gap: 15px; } .zalij-sam-card { width: 100%; /* Розтягуємо */ max-width: 390px; /* Обмежуємо */ margin-left: auto; margin-right: auto; } } /* Мобільний: 1 колонка */ @media (max-width: 480px) { /* Змінив точку на 480px */ .zalij-sam-list { grid-template-columns: 1fr; padding: 10px; gap: 12px; } .zalij-sam-card { max-width: 100%; height: auto; /* Авто висота */ padding: 10px; gap: 10px; } .zalij-sam-card img { width: 80px; /* Менше фото */ height: 80px; } .zalij-sam-content-action-wrapper { gap: 4px; /* Менший gap між інфо та діями */ } .zalij-sam-info { gap: 2px; } .zalij-sam-title { font-size: 18px; } .zalij-sam-weight { font-size: 12px; } .zalij-sam-weight svg { width: 14px; height: 15px; } .zalij-sam-price { font-size: 16px; } .zalij-sam-action { padding-top: 4px; gap: 6px; } /* Зменшуємо кнопки */ .zalij-sam-qty-wrap { width: 90px; height: 34px; padding: 5px; gap: 6px; } .zalij-sam-qty-btn { width: 24px; height: 24px; font-size: 16px; border-width: 1px; } .zalij-sam-qty { font-size: 14px; } .zalij-sam-add { width: 70px; height: 34px; padding: 6px 14px; font-size: 14px; border-width: 1.5px; } section.related.products ul.products > li.product { position: relative !important; } /* Якщо серце має клас .product-heart */ section.related.products ul.products > li.product .product-heart { position: absolute !important; left: 8px !important; bottom: 8px !important; top: auto !important; right: auto !important; width: 18px !important; height: 16px !important; z-index: 3 !important; } /* Якщо серце — це іконка-кнопка у вигляді