/* ========================================================= Site Toolkit — Global buttons v1.4.0 --------------------------------------------------------- Strategy vs Elementor Kit: • Свої токени --ltk-* (не залежать від Elementor Site Settings) • Дублювання класу .loco-btn.loco-btn для (0,3,0) специфічності — бʼє Elementor Kit .elementor-kit-N .elementor-button (0,2,0/1) • !important на критичному (color/background/hover) — бо Elementor Kit :hover теж з !important на деяких проектах • Ловимо ОБИДВА режими: a.loco-btn (пряма розмітка) .loco-btn .elementor-button (клас на wrapper Elementor) ========================================================= */ /* ================================================================ FALLBACK токени. Реальні значення інжектяться модулем Tokens в через :root — вони перебивають цей блок. Тому тут — ЛИШЕ на випадок якщо інжект зламався. ================================================================ */ :root { --ltk-blue-500: #1F65E9; --ltk-blue-600: #1E56C3; --ltk-blue-300: #6683B6; --ltk-blue-100: #AFC5EB; --ltk-neutral-900: #1E1E1E; --ltk-neutral-600: #415170; --ltk-neutral-200: #DCE7F8; --ltk-neutral-100: #EAF3FF; --ltk-neutral-050: #F5F9FE; --ltk-white: #FFFFFF; --ltk-radius-pill: 999px; --ltk-radius-card: 16px; --ltk-radius-sm: 12px; --ltk-font: "Gilroy", "Inter", system-ui, -apple-system, sans-serif; --ltk-transition: 250ms ease; } /* ================================================================ WRAPPER MODE reset: якщо .loco-btn стоїть на .elementor-widget-button ================================================================ */ .elementor-widget-button.loco-btn.loco-btn, .elementor-element.loco-btn.loco-btn { background: transparent !important; padding: 0 !important; border: 0 !important; outline: none !important; box-shadow: none !important; height: auto !important; display: inline-block !important; width: auto !important; border-radius: 0 !important; } .loco-btn.loco-btn > .elementor-widget-container, .loco-btn.loco-btn .elementor-button-wrapper { background: transparent !important; padding: 0 !important; margin: 0 !important; border: 0 !important; display: inline-block; } /* ================================================================ BASE — застосовується до: A) прямо: a.loco-btn.loco-btn, button.loco-btn.loco-btn B) wrapper: .loco-btn.loco-btn .elementor-button Специфічність (0,3,0) — бʼє Elementor Kit (0,2,0) навіть без !important. !important лишаємо на критичному щоб hover з !important не зʼїв нас. ================================================================ */ a.loco-btn.loco-btn, button.loco-btn.loco-btn, .loco-btn.loco-btn .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 7px !important; height: 56px !important; padding: 12px 24px !important; border-radius: var(--ltk-radius-card, 16px) !important; border: 0 !important; font-family: var(--ltk-font) !important; font-weight: 700 !important; font-size: 16px !important; line-height: 1 !important; letter-spacing: 0 !important; text-decoration: none !important; cursor: pointer; white-space: nowrap; box-sizing: border-box !important; user-select: none; text-shadow: none !important; box-shadow: none !important; min-height: 0 !important; min-width: 0 !important; transition: background var(--ltk-transition, 250ms ease), background-color var(--ltk-transition, 250ms ease), color var(--ltk-transition, 250ms ease), outline var(--ltk-transition, 250ms ease), outline-offset var(--ltk-transition, 250ms ease), box-shadow var(--ltk-transition, 250ms ease), opacity var(--ltk-transition, 250ms ease), transform 200ms ease !important; } /* Elementor обгортає текст */ .loco-btn.loco-btn .elementor-button-text, .loco-btn.loco-btn .elementor-button-content-wrapper { color: inherit !important; font: inherit !important; line-height: 1 !important; background: transparent !important; } /* SVG */ a.loco-btn.loco-btn > svg, button.loco-btn.loco-btn > svg, .loco-btn.loco-btn .elementor-button-icon svg, .loco-btn.loco-btn .elementor-button > svg { width: 18px !important; height: 18px !important; flex: 0 0 auto; display: block; } /* Focus */ .loco-btn.loco-btn:focus, .loco-btn.loco-btn .elementor-button:focus { outline: none !important; } .loco-btn.loco-btn:focus-visible, .loco-btn.loco-btn .elementor-button:focus-visible { outline: 2px solid var(--ltk-blue-500, #1F65E9) !important; outline-offset: -2px !important; } /* ================================================================ 1) PRIMARY (blue gradient) ================================================================ */ a.loco-btn.loco-btn--primary, button.loco-btn.loco-btn--primary, .loco-btn.loco-btn--primary .elementor-button { color: var(--ltk-white, #ffffff) !important; background: linear-gradient(90deg, #034DCF 0%, #3074F9 100%) !important; } a.loco-btn.loco-btn--primary:hover, button.loco-btn.loco-btn--primary:hover, .loco-btn.loco-btn--primary:hover .elementor-button, .loco-btn.loco-btn--primary .elementor-button:hover { background: linear-gradient(90deg, #0039BB 0%, #1C60E5 100%) !important; color: var(--ltk-white, #ffffff) !important; } a.loco-btn.loco-btn--primary:active, button.loco-btn.loco-btn--primary:active, .loco-btn.loco-btn--primary .elementor-button:active { background: #0039BB !important; } a.loco-btn.loco-btn--primary:focus-visible, button.loco-btn.loco-btn--primary:focus-visible, .loco-btn.loco-btn--primary .elementor-button:focus-visible { background: linear-gradient(90deg, #0039BB 0%, #1C60E5 100%) !important; outline: 1px solid var(--ltk-white, #ffffff) !important; outline-offset: -1px !important; } a.loco-btn.loco-btn--primary[disabled], a.loco-btn.loco-btn--primary.is-disabled, .loco-btn.loco-btn--primary.is-disabled .elementor-button { background: #E0E0E1 !important; color: var(--ltk-white, #ffffff) !important; cursor: not-allowed; pointer-events: none; } /* ================================================================ 2) SECONDARY / DARK (чорна pill) ================================================================ */ a.loco-btn.loco-btn--secondary, a.loco-btn.loco-btn--dark, button.loco-btn.loco-btn--secondary, button.loco-btn.loco-btn--dark, .loco-btn.loco-btn--secondary .elementor-button, .loco-btn.loco-btn--dark .elementor-button { color: var(--ltk-white, #ffffff) !important; background: var(--ltk-neutral-900, #1E1E1E) !important; } a.loco-btn.loco-btn--secondary:hover, a.loco-btn.loco-btn--dark:hover, button.loco-btn.loco-btn--secondary:hover, button.loco-btn.loco-btn--dark:hover, .loco-btn.loco-btn--secondary:hover .elementor-button, .loco-btn.loco-btn--dark:hover .elementor-button, .loco-btn.loco-btn--secondary .elementor-button:hover, .loco-btn.loco-btn--dark .elementor-button:hover { background: #2E2E2E !important; color: var(--ltk-white, #ffffff) !important; } a.loco-btn.loco-btn--secondary:active, a.loco-btn.loco-btn--dark:active, button.loco-btn.loco-btn--secondary:active, button.loco-btn.loco-btn--dark:active, .loco-btn.loco-btn--secondary .elementor-button:active, .loco-btn.loco-btn--dark .elementor-button:active { background: #000000 !important; } a.loco-btn.loco-btn--secondary:focus-visible, a.loco-btn.loco-btn--dark:focus-visible, button.loco-btn.loco-btn--secondary:focus-visible, button.loco-btn.loco-btn--dark:focus-visible, .loco-btn.loco-btn--secondary .elementor-button:focus-visible, .loco-btn.loco-btn--dark .elementor-button:focus-visible { background: #2E2E2E !important; outline: 2px solid var(--ltk-blue-500, #1F65E9) !important; outline-offset: -2px !important; } a.loco-btn.loco-btn--secondary[disabled], a.loco-btn.loco-btn--secondary.is-disabled, a.loco-btn.loco-btn--dark[disabled], a.loco-btn.loco-btn--dark.is-disabled, .loco-btn.loco-btn--secondary.is-disabled .elementor-button, .loco-btn.loco-btn--dark.is-disabled .elementor-button { background: rgba(30, 30, 30, .25) !important; cursor: not-allowed; pointer-events: none; } /* ================================================================ 3) OUTLINED ================================================================ */ a.loco-btn.loco-btn--outlined, button.loco-btn.loco-btn--outlined, .loco-btn.loco-btn--outlined .elementor-button { color: #303030 !important; background: transparent !important; outline: 1px solid var(--ltk-blue-500, #1F65E9) !important; outline-offset: -1px !important; gap: 16px !important; } a.loco-btn.loco-btn--outlined:hover, button.loco-btn.loco-btn--outlined:hover, .loco-btn.loco-btn--outlined:hover .elementor-button, .loco-btn.loco-btn--outlined .elementor-button:hover { background: radial-gradient(ellipse 50% 50% at 50% 50%, #FEFDFF 0%, #E8F2FD 100%) !important; color: #303030 !important; } a.loco-btn.loco-btn--outlined:active, button.loco-btn.loco-btn--outlined:active, .loco-btn.loco-btn--outlined .elementor-button:active { background: radial-gradient(ellipse 50% 50% at 50% 50%, #FEFDFF 0%, #D3E4F7 100%) !important; } a.loco-btn.loco-btn--outlined:focus-visible, button.loco-btn.loco-btn--outlined:focus-visible, .loco-btn.loco-btn--outlined .elementor-button:focus-visible { background: radial-gradient(ellipse 50% 50% at 50% 50%, #FEFDFF 0%, #E8F2FD 100%) !important; outline: 2px solid var(--ltk-blue-500, #1F65E9) !important; outline-offset: -2px !important; } a.loco-btn.loco-btn--outlined[disabled], a.loco-btn.loco-btn--outlined.is-disabled, .loco-btn.loco-btn--outlined.is-disabled .elementor-button { color: #BEBEBE !important; outline: 1px solid #BEBEBE !important; background: transparent !important; cursor: not-allowed; pointer-events: none; } .loco-btn.loco-btn--outlined svg [fill]:not([fill="none"]) { fill: var(--ltk-blue-500, #1F65E9); } .loco-btn.loco-btn--outlined svg [stroke]:not([stroke="none"]) { stroke: var(--ltk-blue-500, #1F65E9); } .loco-btn.loco-btn--outlined[disabled] svg [fill]:not([fill="none"]), .loco-btn.loco-btn--outlined.is-disabled svg [fill]:not([fill="none"]) { fill: #BEBEBE; } .loco-btn.loco-btn--outlined[disabled] svg [stroke]:not([stroke="none"]), .loco-btn.loco-btn--outlined.is-disabled svg [stroke]:not([stroke="none"]) { stroke: #BEBEBE; } /* ================================================================ 4) TEXT (transparent pill, для темних меню) Default: без outline Hover: outline 1px + текст #EAF3FF Pressed: outline 1px білий + білий текст ================================================================ */ a.loco-btn.loco-btn--text, button.loco-btn.loco-btn--text, .loco-btn.loco-btn--text .elementor-button { color: var(--ltk-white, #ffffff) !important; background: transparent !important; height: auto !important; padding: 12px 16px !important; border-radius: 56px !important; font-weight: 400 !important; gap: 4px !important; outline: 1px solid transparent !important; outline-offset: -1px !important; } a.loco-btn.loco-btn--text:hover, button.loco-btn.loco-btn--text:hover, .loco-btn.loco-btn--text:hover .elementor-button, .loco-btn.loco-btn--text .elementor-button:hover { color: var(--ltk-neutral-100, #EAF3FF) !important; outline: 1px solid var(--ltk-neutral-100, #EAF3FF) !important; outline-offset: -1px !important; background: transparent !important; } a.loco-btn.loco-btn--text:active, button.loco-btn.loco-btn--text:active, .loco-btn.loco-btn--text .elementor-button:active { color: var(--ltk-white, #ffffff) !important; outline: 1px solid var(--ltk-white, #ffffff) !important; outline-offset: -1px !important; background: transparent !important; } a.loco-btn.loco-btn--text:focus-visible, button.loco-btn.loco-btn--text:focus-visible, .loco-btn.loco-btn--text .elementor-button:focus-visible { color: var(--ltk-white, #ffffff) !important; outline: 2px solid var(--ltk-white, #ffffff) !important; outline-offset: -2px !important; background: transparent !important; } a.loco-btn.loco-btn--text[disabled], a.loco-btn.loco-btn--text.is-disabled, .loco-btn.loco-btn--text.is-disabled .elementor-button { color: rgba(255, 255, 255, .4) !important; outline: 1px solid transparent !important; cursor: not-allowed; pointer-events: none; } /* ================================================================ 5) ICON-WHITE (56×56, radial-glow, синя іконка) ================================================================ */ a.loco-btn.loco-btn--icon-white, button.loco-btn.loco-btn--icon-white, .loco-btn.loco-btn--icon-white .elementor-button { width: 56px !important; height: 56px !important; padding: 12px 24px !important; background: radial-gradient(ellipse 136.09% 115.59% at 5.16% 2.40%, #E8F2FD 0%, #FEFDFF 100%) !important; outline: 1px solid var(--ltk-blue-500, #1F65E9) !important; outline-offset: -1px !important; color: var(--ltk-blue-600, #1E56C3) !important; gap: 0 !important; } a.loco-btn.loco-btn--icon-white:hover, a.loco-btn.loco-btn--icon-white:active, button.loco-btn.loco-btn--icon-white:hover, button.loco-btn.loco-btn--icon-white:active, .loco-btn.loco-btn--icon-white:hover .elementor-button, .loco-btn.loco-btn--icon-white .elementor-button:hover, .loco-btn.loco-btn--icon-white .elementor-button:active { background: radial-gradient(ellipse 50% 50% at 50% 50%, #FEFDFF 0%, #D3E4F7 100%), radial-gradient(ellipse 136.09% 115.59% at 5.16% 2.40%, #E8F2FD 0%, #FEFDFF 100%) !important; } a.loco-btn.loco-btn--icon-white:focus-visible, button.loco-btn.loco-btn--icon-white:focus-visible, .loco-btn.loco-btn--icon-white .elementor-button:focus-visible { background: radial-gradient(ellipse 50% 50% at 50% 50%, #FEFDFF 0%, #D3E4F7 100%), radial-gradient(ellipse 136.09% 115.59% at 5.16% 2.40%, #E8F2FD 0%, #FEFDFF 100%) !important; outline: 2px solid var(--ltk-blue-500, #1F65E9) !important; outline-offset: -2px !important; } a.loco-btn.loco-btn--icon-white[disabled], a.loco-btn.loco-btn--icon-white.is-disabled, .loco-btn.loco-btn--icon-white.is-disabled .elementor-button { background: transparent !important; outline: 1px solid var(--ltk-neutral-100, #EAF3FF) !important; color: #BEBEBE !important; cursor: not-allowed; pointer-events: none; } .loco-btn.loco-btn--icon-white svg, .loco-btn.loco-btn--icon-white .elementor-button-icon svg { width: 32px !important; height: 32px !important; } .loco-btn.loco-btn--icon-white svg [fill]:not([fill="none"]) { fill: var(--ltk-blue-600, #1E56C3); } .loco-btn.loco-btn--icon-white svg [stroke]:not([stroke="none"]) { stroke: var(--ltk-blue-600, #1E56C3); } /* ================================================================ 6) ICON-DARK / SECONDARY-ICON (56×56 чорна) ================================================================ */ a.loco-btn.loco-btn--secondary-icon, a.loco-btn.loco-btn--icon-dark, button.loco-btn.loco-btn--secondary-icon, button.loco-btn.loco-btn--icon-dark, .loco-btn.loco-btn--secondary-icon .elementor-button, .loco-btn.loco-btn--icon-dark .elementor-button { width: 56px !important; height: 56px !important; padding: 12px 24px !important; background: var(--ltk-neutral-900, #1E1E1E) !important; color: var(--ltk-white, #ffffff) !important; gap: 0 !important; } a.loco-btn.loco-btn--secondary-icon:hover, a.loco-btn.loco-btn--icon-dark:hover, button.loco-btn.loco-btn--secondary-icon:hover, button.loco-btn.loco-btn--icon-dark:hover, .loco-btn.loco-btn--secondary-icon:hover .elementor-button, .loco-btn.loco-btn--icon-dark:hover .elementor-button, .loco-btn.loco-btn--secondary-icon .elementor-button:hover, .loco-btn.loco-btn--icon-dark .elementor-button:hover { background: #2E2E2E !important; } a.loco-btn.loco-btn--secondary-icon:active, a.loco-btn.loco-btn--icon-dark:active, button.loco-btn.loco-btn--secondary-icon:active, button.loco-btn.loco-btn--icon-dark:active, .loco-btn.loco-btn--secondary-icon .elementor-button:active, .loco-btn.loco-btn--icon-dark .elementor-button:active { background: #000000 !important; } a.loco-btn.loco-btn--secondary-icon:focus-visible, a.loco-btn.loco-btn--icon-dark:focus-visible, button.loco-btn.loco-btn--secondary-icon:focus-visible, button.loco-btn.loco-btn--icon-dark:focus-visible, .loco-btn.loco-btn--secondary-icon .elementor-button:focus-visible, .loco-btn.loco-btn--icon-dark .elementor-button:focus-visible { background: #2E2E2E !important; outline: 2px solid var(--ltk-blue-500, #1F65E9) !important; outline-offset: -2px !important; } a.loco-btn.loco-btn--secondary-icon[disabled], a.loco-btn.loco-btn--secondary-icon.is-disabled, a.loco-btn.loco-btn--icon-dark[disabled], a.loco-btn.loco-btn--icon-dark.is-disabled, .loco-btn.loco-btn--secondary-icon.is-disabled .elementor-button, .loco-btn.loco-btn--icon-dark.is-disabled .elementor-button { background: rgba(30, 30, 30, .25) !important; cursor: not-allowed; pointer-events: none; } .loco-btn.loco-btn--secondary-icon svg, .loco-btn.loco-btn--icon-dark svg, .loco-btn.loco-btn--secondary-icon .elementor-button-icon svg, .loco-btn.loco-btn--icon-dark .elementor-button-icon svg { width: 32px !important; height: 32px !important; } .loco-btn.loco-btn--secondary-icon svg [stroke]:not([stroke="none"]), .loco-btn.loco-btn--icon-dark svg [stroke]:not([stroke="none"]) { stroke: var(--ltk-white, #ffffff); } .loco-btn.loco-btn--secondary-icon svg [fill]:not([fill="none"]), .loco-btn.loco-btn--icon-dark svg [fill]:not([fill="none"]) { fill: var(--ltk-white, #ffffff); } /* ================================================================ 7) CHEVRON / OUTLINED-ICON (56×56 outline blue зі стрілкою) ================================================================ */ a.loco-btn.loco-btn--chevron, a.loco-btn.loco-btn--outlined-icon, button.loco-btn.loco-btn--chevron, button.loco-btn.loco-btn--outlined-icon, .loco-btn.loco-btn--chevron .elementor-button, .loco-btn.loco-btn--outlined-icon .elementor-button { width: 56px !important; height: 56px !important; padding: 12px 24px !important; background: transparent !important; outline: 1px solid var(--ltk-blue-500, #1F65E9) !important; outline-offset: -1px !important; color: var(--ltk-blue-600, #1E56C3) !important; gap: 0 !important; } a.loco-btn.loco-btn--chevron:hover, a.loco-btn.loco-btn--outlined-icon:hover, button.loco-btn.loco-btn--chevron:hover, button.loco-btn.loco-btn--outlined-icon:hover, .loco-btn.loco-btn--chevron:hover .elementor-button, .loco-btn.loco-btn--outlined-icon:hover .elementor-button, .loco-btn.loco-btn--chevron .elementor-button:hover, .loco-btn.loco-btn--outlined-icon .elementor-button:hover { background: radial-gradient(ellipse 136.09% 115.59% at 5.16% 2.40%, #E8F2FD 0%, #FEFDFF 100%) !important; } a.loco-btn.loco-btn--chevron:active, a.loco-btn.loco-btn--outlined-icon:active, button.loco-btn.loco-btn--chevron:active, button.loco-btn.loco-btn--outlined-icon:active, .loco-btn.loco-btn--chevron .elementor-button:active, .loco-btn.loco-btn--outlined-icon .elementor-button:active { background: radial-gradient(ellipse 50% 50% at 50% 50%, #FEFDFF 0%, #D3E4F7 100%), radial-gradient(ellipse 136.09% 115.59% at 5.16% 2.40%, #E8F2FD 0%, #FEFDFF 100%) !important; } a.loco-btn.loco-btn--chevron:focus-visible, a.loco-btn.loco-btn--outlined-icon:focus-visible, button.loco-btn.loco-btn--chevron:focus-visible, button.loco-btn.loco-btn--outlined-icon:focus-visible, .loco-btn.loco-btn--chevron .elementor-button:focus-visible, .loco-btn.loco-btn--outlined-icon .elementor-button:focus-visible { background: radial-gradient(ellipse 136.09% 115.59% at 5.16% 2.40%, #E8F2FD 0%, #FEFDFF 100%) !important; outline: 2px solid var(--ltk-blue-500, #1F65E9) !important; outline-offset: -2px !important; } a.loco-btn.loco-btn--chevron[disabled], a.loco-btn.loco-btn--chevron.is-disabled, a.loco-btn.loco-btn--outlined-icon[disabled], a.loco-btn.loco-btn--outlined-icon.is-disabled, .loco-btn.loco-btn--chevron.is-disabled .elementor-button, .loco-btn.loco-btn--outlined-icon.is-disabled .elementor-button { outline: 1px solid #BEBEBE !important; background: transparent !important; color: #BEBEBE !important; cursor: not-allowed; pointer-events: none; } .loco-btn.loco-btn--chevron svg, .loco-btn.loco-btn--outlined-icon svg, .loco-btn.loco-btn--chevron .elementor-button-icon svg, .loco-btn.loco-btn--outlined-icon .elementor-button-icon svg { width: 32px !important; height: 32px !important; } .loco-btn.loco-btn--chevron svg [stroke]:not([stroke="none"]), .loco-btn.loco-btn--outlined-icon svg [stroke]:not([stroke="none"]) { stroke: var(--ltk-blue-600, #1E56C3); } .loco-btn.loco-btn--chevron[disabled] svg [stroke]:not([stroke="none"]), .loco-btn.loco-btn--outlined-icon[disabled] svg [stroke]:not([stroke="none"]) { stroke: #BEBEBE; } /* ================================================================ LEGACY: --outlined-white / --icon-ghost ================================================================ */ a.loco-btn.loco-btn--outlined-white, button.loco-btn.loco-btn--outlined-white, .loco-btn.loco-btn--outlined-white .elementor-button { background: var(--ltk-white, #ffffff) !important; color: var(--ltk-neutral-900, #1E1E1E) !important; } a.loco-btn.loco-btn--outlined-white:hover, button.loco-btn.loco-btn--outlined-white:hover, .loco-btn.loco-btn--outlined-white:hover .elementor-button, .loco-btn.loco-btn--outlined-white .elementor-button:hover { background: var(--ltk-neutral-050, #F5F9FE) !important; transform: translateY(-1px); } a.loco-btn.loco-btn--outlined-white:active, button.loco-btn.loco-btn--outlined-white:active, .loco-btn.loco-btn--outlined-white .elementor-button:active { background: var(--ltk-neutral-100, #EAF3FF) !important; transform: translateY(0); } a.loco-btn.loco-btn--outlined-white:focus-visible, button.loco-btn.loco-btn--outlined-white:focus-visible, .loco-btn.loco-btn--outlined-white .elementor-button:focus-visible { background: var(--ltk-neutral-050, #F5F9FE) !important; outline: 2px solid var(--ltk-blue-500, #1F65E9) !important; outline-offset: -2px !important; } a.loco-btn.loco-btn--icon-ghost, button.loco-btn.loco-btn--icon-ghost, .loco-btn.loco-btn--icon-ghost .elementor-button { width: 48px !important; height: 48px !important; padding: 0 !important; background: transparent !important; color: currentColor !important; gap: 0 !important; } a.loco-btn.loco-btn--icon-ghost:hover, button.loco-btn.loco-btn--icon-ghost:hover, .loco-btn.loco-btn--icon-ghost .elementor-button:hover { background: rgba(255, 255, 255, .12) !important; } .loco-btn.loco-btn--icon-ghost svg { width: 24px !important; height: 24px !important; } /* ================================================================ Size variants ================================================================ */ a.loco-btn.loco-btn--sm, button.loco-btn.loco-btn--sm, .loco-btn.loco-btn--sm .elementor-button { height: 44px !important; padding: 10px 18px !important; font-size: 14px !important; border-radius: var(--ltk-radius-sm, 12px) !important; } .loco-btn.loco-btn--sm svg, .loco-btn.loco-btn--sm .elementor-button-icon svg { width: 16px !important; height: 16px !important; } a.loco-btn.loco-btn--lg, button.loco-btn.loco-btn--lg, .loco-btn.loco-btn--lg .elementor-button { height: 64px !important; padding: 16px 32px !important; font-size: 18px !important; } .loco-btn.loco-btn--lg svg, .loco-btn.loco-btn--lg .elementor-button-icon svg { width: 20px !important; height: 20px !important; }