.elementor-kit-828{--e-global-color-primary:#4D57D0;--e-global-color-secondary:#DE9538;--e-global-color-text:#303241;--e-global-color-accent:#000546;--e-global-color-5e10747:#284139;--e-global-color-ecb635a:#390517;--e-global-color-767a878:#F8D79A;--e-global-color-e8c4d43:#152520;--e-global-color-9bcddef:#284139;--e-global-color-5185549:#390517;--e-global-color-f19cc36:#3C4341;--e-global-color-f8e6ff9:#5B6562;--e-global-color-04a6fce:#284139;--e-global-color-43bef8a:#446B5E;--e-global-color-0037ef7:#284139;--e-global-color-67a1dc6:#152520;--e-global-color-37b9bb7:#F8D79A;--e-global-color-4ecf48e:#F8D79A;--e-global-color-56e4538:#390517;--e-global-color-189f1db:#F8D79A;--e-global-color-21c9c2d:#21030D;--e-global-color-e83785a:#F8D79A;--e-global-color-e9eb273:#284139;--e-global-color-c98b11c:#F8D79A;--e-global-color-de31d7f:#152520;--e-global-color-7b7816d:#F8D79A;--e-global-color-ddf8a23:#284139;--e-global-color-d1c63e4:#152520;--e-global-color-dfafe2e:#738982;--e-global-color-05c88ba:#390517;--e-global-color-dc0587f:#C0D8D0;--e-global-color-835db3c:#81B1A2;--e-global-color-937bef9:#4E7E6F;--e-global-color-8126b68:#F8D79A;--e-global-color-0cb6c65:#FCF6EA;--e-global-color-1cb1ddf:#FFFFFF;--e-global-color-32a0d8c:#F4F3F1;--e-global-color-4372e8f:#D6D1C8;--e-global-color-4c8c968:#C0BCB4;--e-global-color-8a08ee9:#13201CD9;--e-global-color-dd79b00:#FFFFFF80;--e-global-color-ea739a6:#C0BCB4BF;--e-global-color-2cdf0e0:#A6A09666;--e-global-color-65eae7f:#284139;--e-global-color-a7059b6:#1D2F2A;--e-global-color-2648c2e:#284139;--e-global-color-0e20982:#F8D79A;--e-global-color-b5cff0d:#284139;--e-global-color-4e782da:#F8D79A;--e-global-color-282e412:#13201C;--e-global-color-f800653:#F8D79A;--e-global-color-0816117:#390517;--e-global-color-daada45:#F8D79A;--e-global-color-97ff528:#FFFFFF;--e-global-color-4b49480:#284139;--e-global-color-c786944:#284139;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;--e-global-typography-374f0eb-font-family:"Libre Baskerville";--e-global-typography-374f0eb-font-size:clamp(2.2rem, 1.7846rem + 1.8462vw, 4rem);--e-global-typography-374f0eb-font-weight:600;--e-global-typography-374f0eb-line-height:clamp(2.6rem, 2.1846rem + 1.8462vw, 4.4rem);--e-global-typography-9f48302-font-family:"Libre Baskerville";--e-global-typography-9f48302-font-size:clamp(1.8rem, 1.5692rem + 1.0256vw, 2.8rem);--e-global-typography-9f48302-font-weight:600;--e-global-typography-97dd587-font-family:"Libre Baskerville";--e-global-typography-97dd587-font-size:clamp(1.5rem, 1.3846rem + 0.5128vw, 2rem);--e-global-typography-97dd587-font-weight:600;--e-global-typography-470dd89-font-family:"Libre Baskerville";--e-global-typography-470dd89-font-size:clamp(1.3rem, 1.1846rem + 0.5128vw, 1.8rem);--e-global-typography-470dd89-font-weight:600;--e-global-typography-02ba73a-font-family:"Libre Baskerville";--e-global-typography-02ba73a-font-size:clamp(1.2rem, 1.1308rem + 0.3077vw, 1.5rem);--e-global-typography-02ba73a-font-weight:600;--e-global-typography-57ca902-font-family:"Libre Baskerville";--e-global-typography-57ca902-font-size:1.2rem;--e-global-typography-57ca902-font-weight:500;--e-global-typography-367b2b4-font-family:"Libre Baskerville";--e-global-typography-367b2b4-font-size:1.2rem;--e-global-typography-367b2b4-font-weight:600;--e-global-typography-0a0c92b-font-family:"Figtree";--e-global-typography-0a0c92b-font-size:1rem;--e-global-typography-0a0c92b-font-weight:400;--e-global-typography-128b229-font-family:"Figtree";--e-global-typography-128b229-font-size:1rem;--e-global-typography-128b229-font-weight:500;--e-global-typography-5a0d148-font-family:"Figtree";--e-global-typography-5a0d148-font-size:1.125rem;--e-global-typography-5a0d148-font-weight:400;--e-global-typography-e4f3455-font-family:"Figtree";--e-global-typography-e4f3455-font-size:1.125rem;--e-global-typography-e4f3455-font-weight:500;--e-global-typography-246cbf3-font-family:"Figtree";--e-global-typography-246cbf3-font-size:0.875rem;--e-global-typography-246cbf3-font-weight:300;--e-global-typography-6ece1ca-font-family:"Libre Baskerville";--e-global-typography-6ece1ca-font-size:1.125rem;--e-global-typography-6ece1ca-font-weight:500;--e-global-typography-582a680-font-family:"Libre Baskerville";--e-global-typography-582a680-font-size:1.125rem;--e-global-typography-582a680-font-weight:500;--e-global-typography-1b9f749-font-family:"Libre Baskerville";--e-global-typography-1b9f749-font-size:1.125rem;--e-global-typography-1b9f749-font-weight:600;--e-global-typography-dc37975-font-family:"Libre Baskerville";--e-global-typography-dc37975-font-size:0.875rem;--e-global-typography-dc37975-font-weight:500;--e-global-typography-b4c123a-font-family:"Libre Baskerville";--e-global-typography-b4c123a-font-size:1rem;--e-global-typography-b4c123a-font-weight:500;--e-global-typography-80ff541-font-family:"Libre Baskerville";--e-global-typography-80ff541-font-size:1rem;--e-global-typography-80ff541-font-weight:500;--e-global-typography-742100a-font-family:"Libre Baskerville";--e-global-typography-742100a-font-size:1.2rem;--e-global-typography-742100a-font-weight:500;background-color:var( --e-global-color-32a0d8c );}.elementor-kit-828 e-page-transition{background-color:var( --e-global-color-32a0d8c );}body.e-wc-error-notice .woocommerce-error, body.e-wc-error-notice .wc-block-components-notice-banner.is-error{background-color:#FFFFFF;border-style:solid;border-width:1px 1px 1px 1px;border-color:#AB1212;}.elementor-kit-828 img{border-radius:0px 0px 0px 0px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:100%;}.e-con{--container-max-width:100%;--container-default-padding-top:0px;--container-default-padding-right:0px;--container-default-padding-bottom:0px;--container-default-padding-left:0px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.elementor-lightbox{background-color:var( --e-global-color-8a08ee9 );}.e-wc-error-notice .woocommerce-error, .e-wc-error-notice .wc-block-components-notice-banner.is-error{--error-message-text-color:#AB1212;font-family:var( --e-global-typography-0a0c92b-font-family ), Sans-serif;font-size:var( --e-global-typography-0a0c92b-font-size );font-weight:var( --e-global-typography-0a0c92b-font-weight );--error-message-icon-color:#AB1212;--error-message-normal-links-color:#AB1212;--error-message-hover-links-color:#F49595;--error-box-border-radius:0px 0px 0px 0px;}body.e-wc-error-notice .woocommerce-error a.wc-backward, body.e-wc-error-notice .wc-block-components-notice-banner.is-error a.wc-backward{font-family:var( --e-global-typography-0a0c92b-font-family ), Sans-serif;font-size:var( --e-global-typography-0a0c92b-font-size );font-weight:var( --e-global-typography-0a0c92b-font-weight );}.e-wc-message-notice .woocommerce-message, .e-wc-message-notice .wc-block-components-notice-banner.is-success{font-family:var( --e-global-typography-128b229-font-family ), Sans-serif;font-size:var( --e-global-typography-128b229-font-size );font-weight:var( --e-global-typography-128b229-font-weight );--message-box-border-radius:0px 0px 0px 0px;--message-border-type:solid;--message-buttons-border-radius:0px 0px 0px 0px;--message-buttons-padding:6px 25px 6px 25px;}body.e-wc-message-notice .woocommerce-message .restore-item, body.e-wc-message-notice .wc-block-components-notice-banner.is-success .restore-item, body.e-wc-message-notice .woocommerce-message a:not([class]), body.e-wc-message-notice .wc-block-components-notice-banner.is-success a:not([class]){font-family:var( --e-global-typography-128b229-font-family ), Sans-serif;font-size:var( --e-global-typography-128b229-font-size );font-weight:var( --e-global-typography-128b229-font-weight );}body.e-wc-message-notice .woocommerce-message, body.e-wc-message-notice .wc-block-components-notice-banner.is-success{border-style:solid;border-width:1px 1px 1px 1px;}body.e-wc-message-notice .woocommerce-message .button, body.e-wc-message-notice .wc-block-components-notice-banner.is-success .button{font-family:var( --e-global-typography-0a0c92b-font-family ), Sans-serif;font-size:var( --e-global-typography-0a0c92b-font-size );font-weight:var( --e-global-typography-0a0c92b-font-weight );border-width:1px 1px 1px 1px;}.e-wc-info-notice .woocommerce-info, .e-wc-info-notice .wc-block-components-notice-banner.is-info{font-family:var( --e-global-typography-0a0c92b-font-family ), Sans-serif;font-size:var( --e-global-typography-0a0c92b-font-size );font-weight:var( --e-global-typography-0a0c92b-font-weight );--info-box-border-radius:0px 0px 0px 0px;--info-border-type:solid;--info-buttons-border-radius:0px 0px 0px 0px;--info-buttons-padding:6px 25px 6px 25px;}body.e-wc-info-notice .woocommerce-info, body.e-wc-info-notice .wc-block-components-notice-banner.is-info{border-style:solid;border-width:1px 1px 1px 1px;}body.e-wc-info-notice .woocommerce-info .button, body.e-wc-info-notice .wc-block-components-notice-banner.is-info .button{font-family:var( --e-global-typography-0a0c92b-font-family ), Sans-serif;font-size:var( --e-global-typography-0a0c92b-font-size );font-weight:var( --e-global-typography-0a0c92b-font-weight );border-width:1px 1px 1px 1px;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}.e-wc-error-notice .woocommerce-error, .e-wc-error-notice .wc-block-components-notice-banner.is-error{font-size:var( --e-global-typography-0a0c92b-font-size );}body.e-wc-error-notice .woocommerce-error a.wc-backward, body.e-wc-error-notice .wc-block-components-notice-banner.is-error a.wc-backward{font-size:var( --e-global-typography-0a0c92b-font-size );}.e-wc-message-notice .woocommerce-message, .e-wc-message-notice .wc-block-components-notice-banner.is-success{font-size:var( --e-global-typography-128b229-font-size );}body.e-wc-message-notice .woocommerce-message .restore-item, body.e-wc-message-notice .wc-block-components-notice-banner.is-success .restore-item, body.e-wc-message-notice .woocommerce-message a:not([class]), body.e-wc-message-notice .wc-block-components-notice-banner.is-success a:not([class]){font-size:var( --e-global-typography-128b229-font-size );}body.e-wc-message-notice .woocommerce-message .button, body.e-wc-message-notice .wc-block-components-notice-banner.is-success .button{font-size:var( --e-global-typography-0a0c92b-font-size );}.e-wc-info-notice .woocommerce-info, .e-wc-info-notice .wc-block-components-notice-banner.is-info{font-size:var( --e-global-typography-0a0c92b-font-size );}body.e-wc-info-notice .woocommerce-info .button, body.e-wc-info-notice .wc-block-components-notice-banner.is-info .button{font-size:var( --e-global-typography-0a0c92b-font-size );}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}.e-wc-error-notice .woocommerce-error, .e-wc-error-notice .wc-block-components-notice-banner.is-error{font-size:var( --e-global-typography-0a0c92b-font-size );}body.e-wc-error-notice .woocommerce-error a.wc-backward, body.e-wc-error-notice .wc-block-components-notice-banner.is-error a.wc-backward{font-size:var( --e-global-typography-0a0c92b-font-size );}.e-wc-message-notice .woocommerce-message, .e-wc-message-notice .wc-block-components-notice-banner.is-success{font-size:var( --e-global-typography-128b229-font-size );}body.e-wc-message-notice .woocommerce-message .restore-item, body.e-wc-message-notice .wc-block-components-notice-banner.is-success .restore-item, body.e-wc-message-notice .woocommerce-message a:not([class]), body.e-wc-message-notice .wc-block-components-notice-banner.is-success a:not([class]){font-size:var( --e-global-typography-128b229-font-size );}body.e-wc-message-notice .woocommerce-message .button, body.e-wc-message-notice .wc-block-components-notice-banner.is-success .button{font-size:var( --e-global-typography-0a0c92b-font-size );}.e-wc-info-notice .woocommerce-info, .e-wc-info-notice .wc-block-components-notice-banner.is-info{font-size:var( --e-global-typography-0a0c92b-font-size );}body.e-wc-info-notice .woocommerce-info .button, body.e-wc-info-notice .wc-block-components-notice-banner.is-info .button{font-size:var( --e-global-typography-0a0c92b-font-size );}} /* Start custom CSS *//* ============================ 1) TOKENS GLOBALES ============================ */ :root{ /* TOKENS DE BORDER-RADIUS */ --radius-0: 0; /* 0px - sin redondeo */ --radius-xs: 0rem; /* ~2px */ --radius-s: 0rem; /* ~4px */ --radius-m: 0rem; /* ~8px */ --radius-l: 0rem; /* ~12px */ --radius-xl: 0rem; /* ~16px */ --radius-pill: 9999px; /* completamente redondeado (pill) */ /* TOKENS DE BOX-SHADOW */ --shadow-l: 0 0 15px rgba(0, 0, 0, 0.15); --shadow-s: 0 0 10px rgba(0, 0, 0, 0.10); /* Botones (por defecto usan el token M para mantener tu aspecto actual) */ --btn-radius: var(--radius-m); /* 0 | tokens | 9999px (pill) */ --btn-border-width: 2px; /* grosor para botones lineales */ /* Tags (chips/etiquetas): radio por defecto */ --tag-radius: var(--radius-pill); /* cambia a 0 | xs | m | l | xl | pill */ /* (Opcional) Overrides tipográficos (por variante): --btn-primary-ff / -fs / -fw / -lh / -ls / -tt --btn-secondary-ff / ... --btn-checkout-ff / ... */ /* alias legacy (si lo usabas antes) */ --btn-primary-radius: var(--btn-radius); /* TOKEN FLEX (max-width del contenedor ancho) */ --flex-mw: 1805px; } /* ============================ 2) MAPEO A COLORES/TIPOGRAFÍA (Elementor Kit) Nota: los Global Colors/Typographies se definen en .elementor-kit-XXXX ============================ */ body[class*="elementor-kit-"]{ /* === PRIMARIO (relleno) === */ --btn-primary-bg: var(--e-global-color-0037ef7); --btn-primary-fg: var(--e-global-color-37b9bb7); --btn-primary-bg-hover: var(--e-global-color-67a1dc6); --btn-primary-fg-hover: var(--e-global-color-4ecf48e); /* === PRIMARIO (lineal) === */ --btn-primary-line-border: var(--e-global-color-0037ef7); --btn-primary-line-fg: var(--e-global-color-0037ef7); --btn-primary-line-bg: transparent; --btn-primary-line-bg-hover: var(--e-global-color-67a1dc6); --btn-primary-line-fg-hover: var(--e-global-color-4ecf48e); --btn-primary-line-border-hover: var(--e-global-color-67a1dc6); /* === SECUNDARIO (relleno) === */ --btn-secondary-bg: var(--e-global-color-56e4538); --btn-secondary-fg: var(--e-global-color-189f1db); --btn-secondary-bg-hover: var(--e-global-color-21c9c2d); --btn-secondary-fg-hover: var(--e-global-color-e83785a); /* === SECUNDARIO (lineal) === */ --btn-secondary-line-border: var(--e-global-color-56e4538); --btn-secondary-line-fg: var(--e-global-color-56e4538); --btn-secondary-line-bg: transparent; --btn-secondary-line-bg-hover: var(--e-global-color-21c9c2d); --btn-secondary-line-fg-hover: var(--e-global-color-e83785a); --btn-secondary-line-border-hover: var(--e-global-color-21c9c2d); /* === CHECKOUT (relleno) === */ --btn-checkout-bg: var(--e-global-color-e9eb273); --btn-checkout-fg: var(--e-global-color-c98b11c); --btn-checkout-bg-hover: var(--e-global-color-de31d7f); --btn-checkout-fg-hover: var(--e-global-color-7b7816d); /* === CHECKOUT (lineal) === */ --btn-checkout-line-border: var(--e-global-color-e9eb273); --btn-checkout-line-fg: var(--e-global-color-e9eb273); --btn-checkout-line-bg: transparent; --btn-checkout-line-bg-hover: var(--e-global-color-de31d7f); --btn-checkout-line-fg-hover: var(--e-global-color-7b7816d); --btn-checkout-line-border-hover: var(--e-global-color-de31d7f); } /* ============================ 3) APLICACIÓN A WIDGET BOTÓN (Incluye herencia completa de tipografía por variante) ============================ */ /* Helper tipográfico (no tocar estilos, solo agrupa) */ :root{ /* IDs de tipografías globales: Primario: 6ece1ca Secundario:582a680 Checkout: 1b9f749 */ } /* === PRIMARIO (relleno) → clase "btn-p" === */ .btn-p .elementor-button{ background-color: var(--btn-primary-bg, var(--e-global-color-0037ef7)); color: var(--btn-primary-fg, var(--e-global-color-37b9bb7)); border-radius: var(--btn-radius); border: var(--btn-border-width) solid var(--btn-primary-bg, var(--e-global-color-0037ef7)); padding: 12px 48px; /* Tipografía: hereda todo desde Elementor (con overrides opcionales) */ font-family: var(--btn-primary-ff, var(--e-global-typography-6ece1ca-font-family, inherit)); font-size: var(--btn-primary-fs, var(--e-global-typography-6ece1ca-font-size, inherit)); font-weight: var(--btn-primary-fw, var(--e-global-typography-6ece1ca-font-weight, inherit)); line-height: var(--btn-primary-lh, var(--e-global-typography-6ece1ca-line-height, normal)); letter-spacing: var(--btn-primary-ls, var(--e-global-typography-6ece1ca-letter-spacing, normal)); text-transform: var(--btn-primary-tt, var(--e-global-typography-6ece1ca-text-transform, none)); transition: background-color .2s ease, color .2s ease, border-color .2s ease; } .btn-p .elementor-button:hover, .btn-p .elementor-button:focus-visible{ background-color: var(--btn-primary-bg-hover, var(--e-global-color-67a1dc6)); color: var(--btn-primary-fg-hover, var(--e-global-color-4ecf48e)); border-color: var(--btn-primary-bg-hover, var(--e-global-color-67a1dc6)); outline: none; } /* === PRIMARIO (lineal) → clase "btn-pl" === */ .btn-pl .elementor-button{ background-color: var(--btn-primary-line-bg, transparent); color: var(--btn-primary-line-fg, var(--e-global-color-0037ef7)); border-radius: var(--btn-radius); border: var(--btn-border-width) solid var(--btn-primary-line-border, var(--e-global-color-0037ef7)); padding: 12px 48px; font-family: var(--btn-primary-ff, var(--e-global-typography-6ece1ca-font-family, inherit)); font-size: var(--btn-primary-fs, var(--e-global-typography-6ece1ca-font-size, inherit)); font-weight: var(--btn-primary-fw, var(--e-global-typography-6ece1ca-font-weight, inherit)); line-height: var(--btn-primary-lh, var(--e-global-typography-6ece1ca-line-height, normal)); letter-spacing: var(--btn-primary-ls, var(--e-global-typography-6ece1ca-letter-spacing, normal)); text-transform: var(--btn-primary-tt, var(--e-global-typography-6ece1ca-text-transform, none)); transition: background-color .2s ease, color .2s ease, border-color .2s ease; } .btn-pl .elementor-button:hover, .btn-pl .elementor-button:focus-visible{ background-color: var(--btn-primary-line-bg-hover, var(--e-global-color-67a1dc6)); color: var(--btn-primary-line-fg-hover, var(--e-global-color-4ecf48e)); border-color: var(--btn-primary-line-border-hover, var(--e-global-color-67a1dc6)); outline: none; } /* === SECUNDARIO (relleno) → clase "btn-s" === */ .btn-s .elementor-button{ background-color: var(--btn-secondary-bg, var(--e-global-color-56e4538)); color: var(--btn-secondary-fg, var(--e-global-color-189f1db)); border-radius: var(--btn-radius); border: var(--btn-border-width) solid var(--btn-secondary-bg, var(--e-global-color-56e4538)); padding: 12px 48px; font-family: var(--btn-secondary-ff, var(--e-global-typography-582a680-font-family, inherit)); font-size: var(--btn-secondary-fs, var(--e-global-typography-582a680-font-size, inherit)); font-weight: var(--btn-secondary-fw, var(--e-global-typography-582a680-font-weight, inherit)); line-height: var(--btn-secondary-lh, var(--e-global-typography-582a680-line-height, normal)); letter-spacing: var(--btn-secondary-ls, var(--e-global-typography-582a680-letter-spacing, normal)); text-transform: var(--btn-secondary-tt, var(--e-global-typography-582a680-text-transform, none)); transition: background-color .2s ease, color .2s ease, border-color .2s ease; } .btn-s .elementor-button:hover, .btn-s .elementor-button:focus-visible{ background-color: var(--btn-secondary-bg-hover, var(--e-global-color-21c9c2d)); color: var(--btn-secondary-fg-hover, var(--e-global-color-e83785a)); border-color: var(--btn-secondary-bg-hover, var(--e-global-color-21c9c2d)); outline: none; } /* === SECUNDARIO (lineal) → clase "btn-sl" === */ .btn-sl .elementor-button{ background-color: var(--btn-secondary-line-bg, transparent); color: var(--btn-secondary-line-fg, var(--e-global-color-56e4538)); border-radius: var(--btn-radius); border: var(--btn-border-width) solid var(--btn-secondary-line-border, var(--e-global-color-56e4538)); padding: 12px 48px; font-family: var(--btn-secondary-ff, var(--e-global-typography-582a680-font-family, inherit)); font-size: var(--btn-secondary-fs, var(--e-global-typography-582a680-font-size, inherit)); font-weight: var(--btn-secondary-fw, var(--e-global-typography-582a680-font-weight, inherit)); line-height: var(--btn-secondary-lh, var(--e-global-typography-582a680-line-height, normal)); letter-spacing: var(--btn-secondary-ls, var(--e-global-typography-582a680-letter-spacing, normal)); text-transform: var(--btn-secondary-tt, var(--e-global-typography-582a680-text-transform, none)); transition: background-color .2s ease, color .2s ease, border-color .2s ease; } .btn-sl .elementor-button:hover, .btn-sl .elementor-button:focus-visible{ background-color: var(--btn-secondary-line-bg-hover, var(--e-global-color-21c9c2d)); color: var(--btn-secondary-line-fg-hover, var(--e-global-color-e83785a)); border-color: var(--btn-secondary-line-border-hover, var(--e-global-color-21c9c2d)); outline: none; } /* === CHECKOUT (relleno FORZADO) → clase "btn-c" Afecta a: .elementor-button--checkout, .single_add_to_cart_button, .checkout-button.button.alt.wc-forward, #place_order, [name="woocommerce_checkout_place_order"] ====================================== */ .btn-c .elementor-button--checkout, .btn-c .single_add_to_cart_button, .btn-c .checkout-button.button.alt.wc-forward, .btn-c #place_order, .btn-c button#place_order, .btn-c [name="woocommerce_checkout_place_order"], .btn-c button[name="woocommerce_checkout_place_order"]{ background-color: var(--btn-checkout-bg, var(--e-global-color-e9eb273)) !important; color: var(--btn-checkout-fg, var(--e-global-color-c98b11c)) !important; border-radius: var(--btn-radius) !important; border: var(--btn-border-width) solid var(--btn-checkout-bg, var(--e-global-color-e9eb273)) !important; padding: 16px 48px !important; font-family: var(--btn-checkout-ff, var(--e-global-typography-1b9f749-font-family, inherit)) !important; font-size: var(--btn-checkout-fs, var(--e-global-typography-1b9f749-font-size, inherit)) !important; font-weight: var(--btn-checkout-fw, var(--e-global-typography-1b9f749-font-weight, inherit)) !important; line-height: var(--btn-checkout-lh, var(--e-global-typography-1b9f749-line-height, normal)) !important; letter-spacing: var(--btn-checkout-ls, var(--e-global-typography-1b9f749-letter-spacing, normal)) !important; text-transform: var(--btn-checkout-tt, var(--e-global-typography-1b9f749-text-transform, none)) !important; transition: background-color .2s ease, color .2s ease, border-color .2s ease !important; } .btn-c .elementor-button--checkout:hover, .btn-c .single_add_to_cart_button:hover, .btn-c .checkout-button.button.alt.wc-forward:hover, .btn-c #place_order:hover, .btn-c button#place_order:hover, .btn-c [name="woocommerce_checkout_place_order"]:hover, .btn-c button[name="woocommerce_checkout_place_order"]:hover, .btn-c .elementor-button--checkout:focus-visible, .btn-c .single_add_to_cart_button:focus-visible, .btn-c .checkout-button.button.alt.wc-forward:focus-visible, .btn-c #place_order:focus-visible, .btn-c button#place_order:focus-visible, .btn-c [name="woocommerce_checkout_place_order"]:focus-visible, .btn-c button[name="woocommerce_checkout_place_order"]:focus-visible{ background-color: var(--btn-checkout-bg-hover, var(--e-global-color-de31d7f)) !important; color: var(--btn-checkout-fg-hover, var(--e-global-color-7b7816d)) !important; border-color: var(--btn-checkout-bg-hover, var(--e-global-color-de31d7f)) !important; outline: none !important; } /* === CHECKOUT (lineal FORZADO) → clase "btn-cl" Afecta a: .elementor-button--view-cart, .button.e-apply-coupon ====================================== */ .btn-cl .elementor-button--view-cart, .btn-cl .button.e-apply-coupon{ background-color: transparent !important; color: var(--btn-checkout-line-fg, var(--e-global-color-e9eb273)) !important; border-radius: var(--btn-radius) !important; border: var(--btn-border-width) solid var(--btn-checkout-line-border, var(--e-global-color-e9eb273)) !important; padding: 16px 48px !important; font-family: var(--btn-checkout-ff, var(--e-global-typography-1b9f749-font-family, inherit)) !important; font-size: var(--btn-checkout-fs, var(--e-global-typography-1b9f749-font-size, inherit)) !important; font-weight: var(--btn-checkout-fw, var(--e-global-typography-1b9f749-font-weight, inherit)) !important; line-height: var(--btn-checkout-lh, var(--e-global-typography-1b9f749-line-height, normal)) !important; letter-spacing: var(--btn-checkout-ls, var(--e-global-typography-1b9f749-letter-spacing, normal)) !important; text-transform: var(--btn-checkout-tt, var(--e-global-typography-1b9f749-text-transform, none)) !important; transition: background-color .2s ease, color .2s ease, border-color .2s ease !important; } .btn-cl .elementor-button--view-cart:hover, .btn-cl .button.e-apply-coupon:hover, .btn-cl .elementor-button--view-cart:focus-visible, .btn-cl .button.e-apply-coupon:focus-visible{ background-color: var(--btn-checkout-line-bg-hover, var(--e-global-color-de31d7f)) !important; color: var(--btn-checkout-line-fg-hover, var(--e-global-color-7b7816d)) !important; border-color: var(--btn-checkout-line-border-hover, var(--e-global-color-de31d7f)) !important; outline: none !important; } /* ============================ 4) CONTENEDOR FLEX PRINCIPAL RESPONSIVE → clase "flex-pr" Descripción: ancho máx 100% y padding lateral responsive Uso: aplicar "flex-pr" (sin punto) al Container/Flexbox en Elementor ============================ */ .flex-pr{ max-width: 100%; box-sizing: border-box; /* evita overflow por padding */ padding-left: 3%; padding-right: 3%; } /* Tablet (<= 1024px) */ @media (max-width: 1024px){ .flex-pr{ padding-left: 20px; padding-right: 20px; } } /* Móvil (<= 767px) */ @media (max-width: 767px){ .flex-pr{ padding-left: 10px; padding-right: 10px; } } /* ----- FLEX (max-width fijo) → clase "flex-mw" Usa el token --flex-mw (definido en :root) para limitar el ancho. Colocado junto a flex-pr para localizarlo fácil. ------------------------------------------------ */ .flex-mw{ max-width: var(--flex-mw); } /* ============================ 5) UTILIDADES: BORDER-RADIUS (clases) Uso: añade la clase al widget/columna/sección: br-0 | br-xs | br-s | br-m | br-l | br-xl | br-pill ============================ */ .br-0 { border-radius: var(--radius-0); } .br-xs { border-radius: var(--radius-xs); } .br-s { border-radius: var(--radius-s); } .br-m { border-radius: var(--radius-m); } .br-l { border-radius: var(--radius-l); } .br-xl { border-radius: var(--radius-xl); } .br-pill{ border-radius: var(--radius-pill); } /* ============================ 6) UTILIDADES: BOX-SHADOW (clases) Uso: añade la clase al widget/columna/sección: bs-s | bs-l ============================ */ .bs-l{ box-shadow: var(--shadow-l); } .bs-s{ box-shadow: var(--shadow-s); } /* ============================ 7) TAGS (chips/etiquetas) → clase "tag-r" Descripción: aplica el token --tag-radius Uso: añade "tag-r" al widget/elemento de tag (a, span, li, etc.) ============================ */ .tag-r{ border-radius: var(--tag-radius); }/* End custom CSS */