/* source: */ /* COLORES DEL MENU DE CHECKOUT UI*/ @charset "UTF-8"; @font-face { font-family: 'HM-Slussen-Condensed-Regular'; src: url('../../../fonts/HM-Slussen-Condensed-Regular.woff2') format('woff2'); font-weight: normal; font-style: normal; } @font-face { font-family: 'HM-Slussen-Semibold'; src: url('../../../fonts/HM-Slussen-Semibold.woff2') format('woff2'); font-weight: normal; font-style: normal; } @font-face { font-family: 'HM-Slussen-Expanded-Bold'; src: url('../../../HM-Slussen-Expanded-Bold.woff2') format('woff2'); font-weight: normal; font-style: normal; } @font-face { font-family: 'HM-Slussen-regular'; src: url('../../../HM-Slussen-Regular.woff2') format('woff2'); font-weight: normal; font-style: normal; } :root { --Base: #FAF9F8; /*Background color */ --Success: #000000; /* Botones de envio */ --SuccessDarker: #494949; /* Hover Botones de envio */ --ActionPrimary: #191919; /* Color primario del formulario, incluyendo fuentes y precio. */ --ActionSecondary: #EFEFEF; /* Color secundario, enfocado al backgrond de envio, resumen de compra*/ --ActionPrimaryDark: #515151; /* Hover de botones primarios como añadir o volver al carrito*/ --Danger: #E50010; --HmSale: #E50010; /* Rojo de marca H&M para precios y montos con descuento (HMDCP-3411) */ --Warning: #E50010; /* Background de cupon de descuento no disponible */ --WarningFaded: #FFF6E0; --MutedOne: #323232; /* Color de fuente de los main-title e informacion al llenar los formularios*/ --MutedTwo: #676767; /* Color del texto en la seccion de cupones */ --MutedFour: #CBCBCB; /* Color de borde en resumen de compra y opciones de pago*/ --MutedFive: #F3F3F3; /* Background color de las opciones de compra.*/ --fontFamily: "HM-Slussen-regular", sans-serif; /* Fuente del formulario.*/ --maxWidth: 980px; /* Max width de la clase .container del checkout */ --width: calc(100% - 40px); /* Width de la clase .container del checkout */ --Hmblack: #000000; --Hmgray: #757575; } .checkEmailAuthConflict__modal, .checkEmailAuthConflict__modal--bg { position: fixed; width: 100%; height: 100%; top: 0; left: 0; z-index: 99999; } .checkEmailAuthConflict__modal--bg { background: #000; opacity: 0.4; } .checkEmailAuthConflict__modal--wrap { width: 400px; background: #fff; position: fixed; left: calc(50% - 200px); top: 50%; transform: translateY(-50%); z-index: 99999; padding: 30px; border-radius: 3px; box-sizing: border-box; color: #333333; background: #fff; box-shadow: 0 5px 0 #ddd; border-bottom: 1px solid #fff; border-radius: 4px; border: 2px solid #eee; } button.checkEmailAuthConflict__modal--button { background: var(--ActionPrimary); padding: 10px; display: inline-block; border: none; border-radius: 3px; color: #fff; } .checkEmailAuthConflict__modal--button.js-loading:after { border: 3px solid var(--MutedFive); /* Light grey */ border-top: 3px solid #9999; /* Blue */ border-radius: 50%; width: 10px; height: 10px; animation: spin 1s linear infinite; content: ''; display: inline-block; margin-left: 8px; vertical-align: middle; } h4.checkEmailAuthConflict__modal--title { font-size: 16px; font-weight: bold; color: #000; } p.checkEmailAuthConflict__modal--text { margin-bottom: 20px; } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } /* source: */ input, select, button { outline: none !important } #vtexIdContainer input, .table.cart-items tr.item-attachments-content input, .table.cart-items tr.item-attachments-content select, .table.cart-items tbody tr td .product-service select, .table.cart-items td.quantity input, .summary-template-holder .summary-coupon fieldset.coupon-fieldset input[type="text"], .summary-template-holder .summary-coupon fieldset.coupon-fieldset button[type="submit"], .cart-more-options .srp-container select, .cart-more-options .srp-container input[type=text]:not(.pac-target-input), .cart-more-options .srp-container .vtex-shipping-preview-0-x-addressFormPart1.vtex-shipping-preview-0-x-geolocation input, .orderform-template-holder #client-profile-data form.client-pre-email input[type=text]:not(.pac-target-input), .orderform-template-holder #client-profile-data form.client-pre-email input[type=tel]:not(.pac-target-input), .orderform-template-holder #client-profile-data form.client-pre-email input[type=email]:not(.pac-target-input), .orderform-template-holder #client-profile-data form.client-pre-email select:not(.pac-target-input), .orderform-template-holder #client-profile-data .step.client-profile-data input[type=text]:not(.pac-target-input), .orderform-template-holder #client-profile-data .step.client-profile-data input[type=tel]:not(.pac-target-input), .orderform-template-holder #client-profile-data .step.client-profile-data input[type=email]:not(.pac-target-input), .orderform-template-holder #client-profile-data .step.client-profile-data select:not(.pac-target-input), .orderform-template-holder #shipping-data input[type=text]:not(.pac-target-input), .orderform-template-holder #shipping-data input[type=tel]:not(.pac-target-input), .orderform-template-holder #shipping-data input[type=email]:not(.pac-target-input), .orderform-template-holder #shipping-data select:not(.pac-target-input), .orderform-template-holder #payment-data input[type=text]:not(.pac-target-input), .orderform-template-holder #payment-data input[type=tel]:not(.pac-target-input), .orderform-template-holder #payment-data input[type=email]:not(.pac-target-input), .orderform-template-holder #payment-data select:not(.pac-target-input), .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-addressFormPart1.vtex-omnishipping-1-x-geolocation input, .orderform-template .summary-note .note-textarea, #app-container input[type=text], #app-container input[type=tel], #app-container input[type=email], #app-container select, .vcustom--vtex-omnishipping-1-x-address input { height: 28px; line-height: 28px; max-height: initial; display: inline-block; padding: 0px 10px; border-radius: 3px; border: 1px solid #cbcbcb; outline: initial; font-family: "HM-Slussen-regular", sans-serif; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; } #vtexIdContainer input.error, .table.cart-items tr.item-attachments-content input.error, .table.cart-items tr.item-attachments-content select.error, .table.cart-items tbody tr td .product-service select.error, .table.cart-items td.quantity input.error, .summary-template-holder .summary-coupon fieldset.coupon-fieldset input.error[type="text"], .summary-template-holder .summary-coupon fieldset.coupon-fieldset button.error[type="submit"], .cart-more-options .srp-container select.error, .cart-more-options .srp-container input.error[type=text]:not(.pac-target-input), .cart-more-options .srp-container .vtex-shipping-preview-0-x-addressFormPart1.vtex-shipping-preview-0-x-geolocation input.error, .orderform-template-holder #client-profile-data form.client-pre-email input.error[type=text]:not(.pac-target-input), .orderform-template-holder #client-profile-data form.client-pre-email input.error[type=tel]:not(.pac-target-input), .orderform-template-holder #client-profile-data form.client-pre-email input.error[type=email]:not(.pac-target-input), .orderform-template-holder #client-profile-data form.client-pre-email select.error:not(.pac-target-input), .orderform-template-holder #client-profile-data .step.client-profile-data input.error[type=text]:not(.pac-target-input), .orderform-template-holder #client-profile-data .step.client-profile-data input.error[type=tel]:not(.pac-target-input), .orderform-template-holder #client-profile-data .step.client-profile-data input.error[type=email]:not(.pac-target-input), .orderform-template-holder #client-profile-data .step.client-profile-data select.error:not(.pac-target-input), .orderform-template-holder #shipping-data input.error[type=text]:not(.pac-target-input), .orderform-template-holder #shipping-data input.error[type=tel]:not(.pac-target-input), .orderform-template-holder #shipping-data input.error[type=email]:not(.pac-target-input), .orderform-template-holder #shipping-data select.error:not(.pac-target-input), .orderform-template-holder #payment-data input.error[type=text]:not(.pac-target-input), .orderform-template-holder #payment-data input.error[type=tel]:not(.pac-target-input), .orderform-template-holder #payment-data input.error[type=email]:not(.pac-target-input), .orderform-template-holder #payment-data select.error:not(.pac-target-input), .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-addressFormPart1.vtex-omnishipping-1-x-geolocation input.error, .orderform-template .summary-note .error.note-textarea, #app-container input.error[type=text], #app-container input.error[type=tel], #app-container input.error[type=email], #app-container select.error, .vcustom--vtex-omnishipping-1-x-address input.error { border-color: var(--Danger) } #vtexIdContainer input:focus, .table.cart-items tr.item-attachments-content input:focus, .table.cart-items tr.item-attachments-content select:focus, .table.cart-items tbody tr td .product-service select:focus, .table.cart-items td.quantity input:focus, .summary-template-holder .summary-coupon fieldset.coupon-fieldset input:focus[type="text"], .summary-template-holder .summary-coupon fieldset.coupon-fieldset button:focus[type="submit"], .cart-more-options .srp-container select:focus, .cart-more-options .srp-container input:focus[type=text]:not(.pac-target-input), .cart-more-options .srp-container .vtex-shipping-preview-0-x-addressFormPart1.vtex-shipping-preview-0-x-geolocation input:focus, .orderform-template-holder #client-profile-data form.client-pre-email input:focus[type=text]:not(.pac-target-input), .orderform-template-holder #client-profile-data form.client-pre-email input:focus[type=tel]:not(.pac-target-input), .orderform-template-holder #client-profile-data form.client-pre-email input:focus[type=email]:not(.pac-target-input), .orderform-template-holder #client-profile-data form.client-pre-email select:focus:not(.pac-target-input), .orderform-template-holder #client-profile-data .step.client-profile-data input:focus[type=text]:not(.pac-target-input), .orderform-template-holder #client-profile-data .step.client-profile-data input:focus[type=tel]:not(.pac-target-input), .orderform-template-holder #client-profile-data .step.client-profile-data input:focus[type=email]:not(.pac-target-input), .orderform-template-holder #client-profile-data .step.client-profile-data select:focus:not(.pac-target-input), .orderform-template-holder #shipping-data input:focus[type=text]:not(.pac-target-input), .orderform-template-holder #shipping-data input:focus[type=tel]:not(.pac-target-input), .orderform-template-holder #shipping-data input:focus[type=email]:not(.pac-target-input), .orderform-template-holder #shipping-data select:focus:not(.pac-target-input), .orderform-template-holder #payment-data input:focus[type=text]:not(.pac-target-input), .orderform-template-holder #payment-data input:focus[type=tel]:not(.pac-target-input), .orderform-template-holder #payment-data input:focus[type=email]:not(.pac-target-input), .orderform-template-holder #payment-data select:focus:not(.pac-target-input), .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-addressFormPart1.vtex-omnishipping-1-x-geolocation input:focus, .orderform-template .summary-note .note-textarea:focus, #app-container input:focus[type=text], #app-container input:focus[type=tel], #app-container input:focus[type=email], #app-container select:focus, .vcustom--vtex-omnishipping-1-x-address input:focus { box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(0, 0, 0, 0.4) } input#creditCardpayment-card-0Number, input#creditCardpayment-card-0Code, input#creditCardpayment-card-1Number, input#creditCardpayment-card-1Code { font-size: 18px } input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active { animation: input_background_autofill 0s forwards } @keyframes input_background_autofill { 100% { background-color: transparent } } .btn, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a, .orderform-template-holder #payment-data .payment-discounts-list table td.action a { font-family: var(--fontFamily); text-shadow: none; border-radius: 2px; outline: none !important; text-align: center; font-size: 14px; padding: 5px 12px; box-sizing: border-box; display: inline-block; background: none; box-shadow: none } .btn, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a, .orderform-template-holder #payment-data .payment-discounts-list table td.action a, .btn:hover, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a:hover, .orderform-template-holder #payment-data .payment-discounts-list table td.action a:hover, .btn:focus, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a:focus, .orderform-template-holder #payment-data .payment-discounts-list table td.action a:focus { transition: all ease 0.3s } .btn:hover, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a:hover, .orderform-template-holder #payment-data .payment-discounts-list table td.action a:hover, .btn:focus, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a:focus, .orderform-template-holder #payment-data .payment-discounts-list table td.action a:focus { background: none } .btn-large, .client-pre-email .client-email.input.text .btn-success { padding: 17px 19px } .btn-link, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a { color: var(--ActionPrimary); } .btn-link:hover, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a:hover, .btn-link:focus, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a:focus { color: var(--ActionPrimaryDark) } .btn-success { background: var(--Success); border: 1px solid var(--Success); font-size: 13px } .btn-success:hover, .btn-success:focus, .btn-success:active { background: var(--SuccessDarker); border: 1px solid var(--SuccessDarker); } .btn-success[disabled] { background: var(--Success); } .btn-primary { background: var(--ActionPrimary); border: 1px solid var(--ActionPrimary); color: var(--ActionSecondary); } .btn-primary:hover, .btn-primary:focus, .btn-primary:active { background: var(--ActionPrimaryDark); border: 1px solid var(--ActionPrimaryDark) } .btn-secondary, .table.cart-items tbody tr td.product-name .add-service.btn, .table.cart-items tbody tr td.product-name .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a.add-service, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .table.cart-items tbody tr td.product-name a.add-service, .table.cart-items tbody tr td.product-name .clone-item.btn, .table.cart-items tbody tr td.product-name .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a.clone-item, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .table.cart-items tbody tr td.product-name a.clone-item, .table.cart-items tbody tr td.product-name .add-item-attachment-container a, .table.cart-items tbody tr td .product-service input[type=submit], .summary-template-holder .summary-coupon fieldset.coupon-fieldset button[type="submit"], .cart-more-options .srp-container .vtex-shipping-preview-0-x-pc .btn, .cart-more-options .srp-container .vtex-shipping-preview-0-x-pc .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .cart-more-options .srp-container .vtex-shipping-preview-0-x-pc a, .orderform-template-holder #payment-data .payment-discounts-list table td.action a, .orderform-template-holder #payment-data #btn-add-gift-card { background: transparent; border: 1px solid var(--ActionPrimary); color: var(--ActionPrimary); } .btn-secondary:hover, .table.cart-items tbody tr td.product-name .add-service.btn:hover, .table.cart-items tbody tr td.product-name .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a.add-service:hover, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .table.cart-items tbody tr td.product-name a.add-service:hover, .table.cart-items tbody tr td.product-name .clone-item.btn:hover, .table.cart-items tbody tr td.product-name .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a.clone-item:hover, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .table.cart-items tbody tr td.product-name a.clone-item:hover, .table.cart-items tbody tr td.product-name .add-item-attachment-container a:hover, .table.cart-items tbody tr td .product-service input:hover[type=submit], .summary-template-holder .summary-coupon fieldset.coupon-fieldset button:hover[type="submit"], .cart-more-options .srp-container .vtex-shipping-preview-0-x-pc .btn:hover, .cart-more-options .srp-container .vtex-shipping-preview-0-x-pc .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a:hover, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .cart-more-options .srp-container .vtex-shipping-preview-0-x-pc a:hover, .orderform-template-holder #payment-data .payment-discounts-list table td.action a:hover, .orderform-template-holder #payment-data #btn-add-gift-card:hover, .btn-secondary:focus, .table.cart-items tbody tr td.product-name .add-service.btn:focus, .table.cart-items tbody tr td.product-name .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a.add-service:focus, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .table.cart-items tbody tr td.product-name a.add-service:focus, .table.cart-items tbody tr td.product-name .clone-item.btn:focus, .table.cart-items tbody tr td.product-name .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a.clone-item:focus, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .table.cart-items tbody tr td.product-name a.clone-item:focus, .table.cart-items tbody tr td.product-name .add-item-attachment-container a:focus, .table.cart-items tbody tr td .product-service input:focus[type=submit], .summary-template-holder .summary-coupon fieldset.coupon-fieldset button:focus[type="submit"], .cart-more-options .srp-container .vtex-shipping-preview-0-x-pc .btn:focus, .cart-more-options .srp-container .vtex-shipping-preview-0-x-pc .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a:focus, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .cart-more-options .srp-container .vtex-shipping-preview-0-x-pc a:focus, .orderform-template-holder #payment-data .payment-discounts-list table td.action a:focus, .orderform-template-holder #payment-data #btn-add-gift-card:focus, .btn-secondary:active, .table.cart-items tbody tr td.product-name .add-service.btn:active, .table.cart-items tbody tr td.product-name .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a.add-service:active, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .table.cart-items tbody tr td.product-name a.add-service:active, .table.cart-items tbody tr td.product-name .clone-item.btn:active, .table.cart-items tbody tr td.product-name .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a.clone-item:active, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .table.cart-items tbody tr td.product-name a.clone-item:active, .table.cart-items tbody tr td.product-name .add-item-attachment-container a:active, .table.cart-items tbody tr td .product-service input:active[type=submit], .summary-template-holder .summary-coupon fieldset.coupon-fieldset button:active[type="submit"], .cart-more-options .srp-container .vtex-shipping-preview-0-x-pc .btn:active, .cart-more-options .srp-container .vtex-shipping-preview-0-x-pc .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a:active, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .cart-more-options .srp-container .vtex-shipping-preview-0-x-pc a:active, .orderform-template-holder #payment-data .payment-discounts-list table td.action a:active, .orderform-template-holder #payment-data #btn-add-gift-card:active { background: var(--ActionSecondary); border: 1px solid var(--ActionPrimaryDark); color: var(--ActionPrimaryDark) } .btn-outlined { background: transparent; border: 1px solid var(--Success); color: var(--Success); } .btn-outlined:hover, .btn-outlined:focus, .btn-outlined:active { background: transparent; border: 1px solid var(--SuccessDarker); } .btn#payment-data-submit span, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a#payment-data-submit span, .orderform-template-holder #payment-data .payment-discounts-list table td.action a#payment-data-submit span { font-size: 14px; margin-left: 5px; font-weight: bold } .cart-more-options .srp-container .srp-main-title, .client-pre-email h3.client-pre-email-h span:after, .orderform-template-holder #client-profile-data form.client-pre-email .accordion-toggle, .orderform-template-holder #client-profile-data .step.client-profile-data .accordion-toggle, .orderform-template-holder #shipping-data .accordion-toggle, .orderform-template-holder #payment-data .accordion-toggle, .orderform-template .cart-template.mini-cart h2 { font-size: calc(12px + 2px); text-transform: uppercase; border-bottom: 1px solid #eee; font-weight: bold; margin-bottom: 15px; padding: 7px 0 !important; color: #999; color: var(--MutedOne); border: none; font-size: 20px; text-transform: initial; margin-bottom: 0px } .payment-data .gift-card-section, .payment-data .payment-discounts-alert { margin: 0; width: 100% !important; box-sizing: border-box } .input-append, .input-prepend { display: flex !important; align-items: stretch } .input-append .btn, .input-append .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .input-append a, .input-append .orderform-template-holder #payment-data .payment-discounts-list table td.action a, .orderform-template-holder #payment-data .payment-discounts-list table td.action .input-append a, .input-append .add-on, .input-prepend .btn, .input-prepend .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .input-prepend a, .input-prepend .orderform-template-holder #payment-data .payment-discounts-list table td.action a, .orderform-template-holder #payment-data .payment-discounts-list table td.action .input-prepend a, .input-prepend .add-on { height: 40px; line-height: 40px; box-sizing: border-box; padding: 0; width: 20px } .input-append .add-on, .input-prepend .add-on { height: initial !important } .input-append input, .input-prepend input { border-radius: 0 4px 4px 0 !important; width: 100% !important; max-width: 100px !important } .payment-discoints-table .number, .gift-card-provider-group .number, .payment-discoints-table .action, .gift-card-provider-group .action { text-align: right } @media (max-width: 1024px) { .orderform-template-holder .client-profile-data input[type="text"] { width: 100% !important } } @media (max-width: 1024px) { .item-quantity-change { display: inline-block } .item-quantity-change { float: left; padding: 3px 5px 3px 0px } .item-quantity-change-increment { padding-left: 5px; padding-right: 0 } .full-cart .cart-links-bottom .btn-success { width: 83%; display: block; margin-top: 10px } .full-cart .cart table { display: block; margin-top: 0 !important } .full-cart .cart table thead { display: none } .full-cart .cart table tbody tr+tr { border-top: 1px dashed #ddd } .full-cart .cart table tbody tr { display: block; margin-top: 10px; padding: 10px 0; position: relative } .full-cart .cart table tbody tr .product-name a, .full-cart .cart table tbody tr .product-name .seller { overflow: hidden } .full-cart .cart table tbody tr td { display: inline-block; padding: 4px 0 } .full-cart .cart table tbody tr td.product-name .seller { display: block; line-height: 120%; font-size: 80%; margin: 4px 0 } .full-cart .cart table tbody tr td.product-image, .full-cart .cart table tbody tr td.bundle-item-image { left: 0; position: absolute } .full-cart .cart table tbody tr td.product-name { display: block; margin-left: 60px; text-align: left; line-height: 140%; width: auto } .full-cart .cart table tbody tr td.product-name { padding: 0 0 10px !important } .full-cart .cart table tbody tr td.empty, .full-cart .cart table tbody tr td.shipping-date, .full-cart .cart table tbody tr td .brand { display: none } .full-cart .cart table tbody tr td.product-name a, .full-cart .cart table tbody tr td.bundle-item-name span { display: block; padding-right: 20px } .full-cart .cart table tbody tr td.quantity { width: 81px; padding: 0px; margin-left: 60px } .full-cart .cart table tbody tr td.quantity input { float: left; margin: 0; width: 25px } .full-cart .cart table tbody tr td.product-price { text-align: right; float: right; margin-right: 5px; padding: 0 } .full-cart .cart table tbody tr td.quantity-price { display: none } .full-cart .cart table tbody tr td.item-remove { position: absolute; top: 2px; right: 0; width: 24px } .cart-links-bottom { float: none; margin-top: 5px; margin-bottom: 40px; text-align: right } .more { margin-right: 0 } .full-cart .cart-links-bottom .btn-success { width: auto } .full-cart .cart table tbody tr.item-attachments-head { border: 0; margin: 0; padding: 0 } .full-cart .cart table tbody tr.item-attachments-head .item-attachments-header { top: auto } .full-cart .cart table tbody tr.item-attachments-head .item-attachments-header:after { content: none } .full-cart .cart table tbody tr.item-attachments-head .item-attachments-header strong { box-shadow: none } .full-cart .cart table tbody tr.item-attachments-content { margin: 0; border: 0; padding: 0 } .full-cart .cart table tbody tr.item-attachments-content .item-attachments-item-fields { margin-left: 5px; width: 95% } } .default-modal { border-radius: 4px; height: auto } .modal .btn, .modal .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .modal a, .modal .orderform-template-holder #payment-data .payment-discounts-list table td.action a, .orderform-template-holder #payment-data .payment-discounts-list table td.action .modal a { background: #FFF } .modal.guest-login-modal button.btn { width: auto } .modal.guest-login-modal, .modal.modal-email-template, .modal.modal-payment-template, .modal.modal-masked-info-template { background: var(--Success); } .payment-confirmation-message { width: 100% } #vtexIdContainer { position: fixed !important } .vtexIdUI { position: absolute; top: 50% !important; transform: translateY(-50%) !important } #vtexIdContainer { position: fixed } #vtexIdContainer a { color: var(--ActionPrimary); } #vtexIdContainer .vtexIdUI .modal-footer { background: none } #vtexIdContainer .vtexIdUI .btn, #vtexIdContainer .vtexIdUI .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data #vtexIdContainer .vtexIdUI a, #vtexIdContainer .vtexIdUI .orderform-template-holder #payment-data .payment-discounts-list table td.action a, .orderform-template-holder #payment-data .payment-discounts-list table td.action #vtexIdContainer .vtexIdUI a { border-radius: 30px; height: 40px; line-height: 40px; box-shadow: none !important; font-size: 12px; padding: 0 30px } #vtexIdContainer .vtexIdUI .btn.btn-success, #vtexIdContainer .vtexIdUI .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a.btn-success, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data #vtexIdContainer .vtexIdUI a.btn-success, #vtexIdContainer .vtexIdUI .orderform-template-holder #payment-data .payment-discounts-list table td.action a.btn-success, .orderform-template-holder #payment-data .payment-discounts-list table td.action #vtexIdContainer .vtexIdUI a.btn-success { background: var(--Success); border: 1px solid var(--Success); } #vtexIdContainer .vtexIdUI .btn.btn-success:hover, #vtexIdContainer .vtexIdUI .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a.btn-success:hover, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data #vtexIdContainer .vtexIdUI a.btn-success:hover, #vtexIdContainer .vtexIdUI .orderform-template-holder #payment-data .payment-discounts-list table td.action a.btn-success:hover, .orderform-template-holder #payment-data .payment-discounts-list table td.action #vtexIdContainer .vtexIdUI a.btn-success:hover, #vtexIdContainer .vtexIdUI .btn.btn-success:focus, #vtexIdContainer .vtexIdUI .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a.btn-success:focus, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data #vtexIdContainer .vtexIdUI a.btn-success:focus, #vtexIdContainer .vtexIdUI .orderform-template-holder #payment-data .payment-discounts-list table td.action a.btn-success:focus, .orderform-template-holder #payment-data .payment-discounts-list table td.action #vtexIdContainer .vtexIdUI a.btn-success:focus, #vtexIdContainer .vtexIdUI .btn.btn-success:active, #vtexIdContainer .vtexIdUI .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a.btn-success:active, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data #vtexIdContainer .vtexIdUI a.btn-success:active, #vtexIdContainer .vtexIdUI .orderform-template-holder #payment-data .payment-discounts-list table td.action a.btn-success:active, .orderform-template-holder #payment-data .payment-discounts-list table td.action #vtexIdContainer .vtexIdUI a.btn-success:active { background: var(--SuccessDarker); border: 1px solid var(--SuccessDarker); } #vtexIdContainer .vtexIdUI .btn#vtexIdUI-facebook, #vtexIdContainer .vtexIdUI .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a#vtexIdUI-facebook, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data #vtexIdContainer .vtexIdUI a#vtexIdUI-facebook, #vtexIdContainer .vtexIdUI .orderform-template-holder #payment-data .payment-discounts-list table td.action a#vtexIdUI-facebook, .orderform-template-holder #payment-data .payment-discounts-list table td.action #vtexIdContainer .vtexIdUI a#vtexIdUI-facebook { background: #4568ad !important } @media (max-width: 1024px) { #vtexIdContainer { position: fixed !important } #vtexIdContainer .vtexIdUI { overflow: auto; border-radius: 0; width: 100%; left: 0; margin: 0; top: 0; height: 100% !important; border: none } #vtexIdContainer .vtexIdUI .modal-header .close { top: 0; right: 0; margin: 0; padding: 4px 8px } } body { font-family: var(--fontFamily); min-width: initial !important; padding: 0; background: rgb(255, 255, 255) !important; padding-bottom: 40px !important; min-height: 93vh; position: relative; font-size: 14px; overflow-x: hidden } body a { color: var(--ActionPrimary); } body a:hover { color: var(--ActionPrimaryDark) } @media (max-width: 1024px) { body { padding-bottom: 0px !important } } body .cart-template.full-cart>* { opacity: 0; transition-delay: 1.2s; transition-property: opacity; -webkit-transition-duration: 0.5s } body.v-custom-loaded .cart-template.full-cart>* { opacity: initial } body.returningUser.v-custom-addressForm-on.v-custom-step-shipping .accordion-inner.shipping-container .vtex-omnishipping-1-x-addressFormPart1.vtex-omnishipping-1-x-geolocation { display: block } body.returningUser.v-custom-addressForm-on.v-custom-step-shipping .accordion-inner.shipping-container .vtex-omnishipping-1-x-deliveryGroup { display: block } body.returningUser.v-custom-addressForm-on.v-custom-step-shipping .accordion-inner.shipping-container .vtex-omnishipping-1-x-submitPaymentButton { display: block } .onda-v1 .br-pill, .step, .cart, .totalizers { border-radius: 4px } .loading.loading-bg .loading-img { display: none !important; } .loading.loading-bg { background: var(--Base) !important; opacity: 1 !important; position: fixed !important; top: 0 !important; left: 0 !important; width: 100vw !important; height: 100vh !important; z-index: 9999 !important; } .loading.loading-bg .loading-img { display: none !important; } .loading.loading-bg::after { content: ""; display: block; position: fixed !important; top: 50% !important; left: 50% !important; width: 30px; height: 30px; margin-top: -15px !important; margin-left: -15px !important; border: 4px solid transparent !important; border-top: 4px solid var(--Danger) !important; border-radius: 50%; animation: hm-spin 1s linear infinite; z-index: 10000 !important; } @keyframes hm-spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } .container { max-width: var(--maxWidth); width: var(--width); } .btn-delete-address-custom { pointer-events: auto !important; user-select: none !important; } .address-item::after, .address-item::before { z-index: 1 !important; pointer-events: none !important; } .address-item { position: relative !important; padding-right: 70px !important; } @media (max-width: 1024px) { .container { width: calc(100% - 20px) } } .checkout-container { overflow: initial !important; z-index: 2 } @media (max-width: 1024px) { .checkout-container { margin-bottom: 30px } } .checkout-container .orderform-template, .checkout-container .cart-template { display: flex; justify-content: space-between; align-items: flex-start; transition: position ease 0.8s, opacity ease 0.8s, margin ease 0.8s } .checkout-container .orderform-template.inactive, .checkout-container .cart-template.inactive { max-height: 50vh; overflow: hidden; top: 0; position: absolute } .checkout-container .full-cart.inactive { margin-left: -140% } .checkout-container .orderform-template.inactive { left: 140%; margin: 0; display: none !important } .container-cart h1, h1#orderform-title { font-size: 22px !important; font-weight: 400 !important; color: var(--MutedOne) !important } h1#orderform-title { display: none !important } .v-custom-assemblies { margin: 10px 0 3px 0; overflow: hidden; border-top: 1px solid var(--MutedFour); padding-top: 7px } @media (max-width: 1024px) { .v-custom-assemblies { width: 100%; left: 0; margin-bottom: 2px } } .v-custom-assemblies p { display: none } .v-custom-assemblies__values { list-style: none; padding: 0; margin: 0 } .v-custom-assemblies__values__item strong:after { content: ":" } .v-custom-assemblies__values__item span, .v-custom-assemblies__values__item strong { line-height: 14px } .client-pre-email h3.client-pre-email-h span:before, .client-profile-data .accordion-toggle>span:before, .shipping-data .accordion-toggle:before, .payment-data .accordion-toggle>span:not(.payment-edit-link):before { background: #FFF; border: 1px solid var(--MutedOne); color: var(--MutedOne); width: 26px; height: 26px; line-height: 26px; font-size: 15px } body.v-custom-step-profile .client-pre-email h3.client-pre-email-h span:before, body.v-custom-step-shipping .client-pre-email h3.client-pre-email-h span:before, body.v-custom-step-shipping .client-profile-data .accordion-toggle>span:before, body.v-custom-step-payment .client-pre-email h3.client-pre-email-h span:before, body.v-custom-step-payment .client-profile-data .accordion-toggle>span:before, body.v-custom-step-payment .shipping-data .accordion-toggle:before, body.v-custom-step-email .client-pre-email h3.client-pre-email-h span:before, body.v-custom-step-profile .client-profile-data .accordion-toggle>span:before, body.v-custom-step-shipping .shipping-data .accordion-toggle:before, body.v-custom-step-payment .payment-data .accordion-toggle>span:not(.payment-edit-link):before, body.js-vcustom-hideEmailStep .client-profile-data .accordion-toggle>span:before { background: var(--ActionPrimary); border-color: var(--ActionPrimary); color: #FFF } .client-pre-email h3.client-pre-email-h span:before, .client-profile-data .accordion-toggle>span:before, .shipping-data .accordion-toggle:before, .payment-data .accordion-toggle>span:not(.payment-edit-link):before { text-align: center; margin-right: 10px; border-radius: 100%; display: inline-block; font-weight: bold; vertical-align: middle; margin-top: -2px } .client-pre-email h3.client-pre-email-h span:before { content: "1" } .client-profile-data .accordion-toggle>span:before { content: "2" } .shipping-data .accordion-toggle:before { content: "3" } .payment-data .accordion-toggle>span:not(.payment-edit-link):before { content: "4" } @media (max-width: 1024px) { body:before { width: 0; height: 4px; background: var(--ActionPrimary); display: block; content: ""; position: fixed; top: 0; transition: all ease 0.3s; z-index: 999 } body.v-custom-step-email:before { width: 23% } body.v-custom-step-profile:before { width: 46% } body.v-custom-step-shipping:before { width: 69% } body.v-custom-step-payment:before { width: 92% } } body.v-custom-step-cart .checkout-steps_item_cart .text, body.v-custom-step-email .checkout-steps_item_cart .text, body.v-custom-step-email .checkout-steps_item_identification .text, body.v-custom-step-profile .checkout-steps_item_cart .text, body.v-custom-step-profile .checkout-steps_item_identification .text, body.v-custom-step-shipping .checkout-steps_item_cart .text, body.v-custom-step-shipping .checkout-steps_item_identification .text, body.v-custom-step-shipping .checkout-steps_item_shipping .text, body.v-custom-step-payment .checkout-steps_item_cart .text, body.v-custom-step-payment .checkout-steps_item_identification .text, body.v-custom-step-payment .checkout-steps_item_shipping .text, body.v-custom-step-payment .checkout-steps_item_payment .text { color: var(--MutedOne); font-weight: bold; pointer-events: initial } body.v-custom-step-cart .checkout-steps_item_cart { opacity: 1 } body.v-custom-step-cart .checkout-steps_item_cart .text { pointer-events: none } body.v-custom-step-cart .checkout-steps_item_cart:before { background: var(--ActionPrimary); border-color: var(--ActionPrimary); } body.v-custom-step-email .checkout-steps_bar_inner-active, body.v-custom-step-profile .checkout-steps_bar_inner-active { width: 20% } body.v-custom-step-email .checkout-steps_item_cart, body.v-custom-step-email .checkout-steps_item_identification, body.v-custom-step-profile .checkout-steps_item_cart, body.v-custom-step-profile .checkout-steps_item_identification { opacity: 1 } body.v-custom-step-email .checkout-steps_item_cart:before, body.v-custom-step-email .checkout-steps_item_identification:before, body.v-custom-step-profile .checkout-steps_item_cart:before, body.v-custom-step-profile .checkout-steps_item_identification:before { background: var(--ActionPrimary); border-color: var(--ActionPrimary); } body.v-custom-step-email .checkout-steps_item_identification .text, body.v-custom-step-profile .checkout-steps_item_identification .text { pointer-events: none } body.v-custom-step-shipping .checkout-steps_bar_inner-active { width: 40% } body.v-custom-step-shipping .checkout-steps_item_cart, body.v-custom-step-shipping .checkout-steps_item_identification, body.v-custom-step-shipping .checkout-steps_item_shipping { opacity: 1 } body.v-custom-step-shipping .checkout-steps_item_cart:before, body.v-custom-step-shipping .checkout-steps_item_identification:before, body.v-custom-step-shipping .checkout-steps_item_shipping:before { background: var(--ActionPrimary); border-color: var(--ActionPrimary); } body.v-custom-step-shipping .checkout-steps_item_shipping .text { pointer-events: none } body.v-custom-step-payment .checkout-steps_bar_inner-active { width: 60% } body.v-custom-step-payment .checkout-steps_item_cart, body.v-custom-step-payment .checkout-steps_item_identification, body.v-custom-step-payment .checkout-steps_item_shipping, body.v-custom-step-payment .checkout-steps_item_payment { opacity: 1 } body.v-custom-step-payment .checkout-steps_item_cart:before, body.v-custom-step-payment .checkout-steps_item_identification:before, body.v-custom-step-payment .checkout-steps_item_shipping:before, body.v-custom-step-payment .checkout-steps_item_payment:before { background: var(--ActionPrimary); border-color: var(--ActionPrimary); } body.v-custom-step-payment .checkout-steps_item_payment .text { pointer-events: none } .checkout-steps { display: none; position: relative; min-width: 470px; width: 100%; display: block } @media (max-width: 1024px) { .checkout-steps { display: none !important } } .checkout-steps_bar_inner-active { width: 0; background: var(--ActionPrimary); } .checkout-steps_items { display: flex; justify-content: space-between } .checkout-steps_item { position: relative; text-align: center; flex-grow: 1; display: flex; align-items: center; justify-content: flex-start; opacity: 0.6 } .checkout-steps_item:after { content: ""; height: 2px; background: var(--ActionPrimary); margin: 0px 5px; min-width: 10px } .checkout-steps_item .text { clear: both; display: flex; align-items: center; color: #999; font-weight: 500; cursor: pointer; pointer-events: none } .checkout-steps_item .text:before { content: ""; width: 7px; height: 7px; background: var(--ActionPrimary); border: 2px solid var(--ActionPrimary); display: inline-block; border-radius: 100%; margin-right: 7px; transition: all ease 0.3s } .checkout-steps_item_cart:after { width: calc(100% - 50px) } .checkout-steps_item_identification:after { width: calc(100% - 103px) } .checkout-steps_item_shipping:after { width: calc(100% - 77px) } .checkout-steps_item_payment:after { width: calc(100% - 77px) } .checkout-steps_item_confirmation:after { display: none } body .main-header { padding: 12px 0; text-align: center; border-bottom: 1px solid var(--MutedFour); position: relative; background-color: #FFF; margin-bottom: 40px } body .main-header, body .main-header>.container { display: flex; align-items: center } @media (max-width: 1024px) { body .main-header, body .main-header>.container { justify-content: center } } body .main-header>.container:before, body .main-header>.container:after { display: none } body .main-header .header-link { position: absolute; left: 0px; top: calc(100% + 18px); display: none } body .main-header .header-link a { height: 20px; font-size: 11px; line-height: 115%; padding-left: 0px; color: var(--MutedTwo); display: flex; align-items: center } body .main-header .header-link a:before { display: block; float: left; width: 10px; height: 10px; -webkit-mask: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pg0KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE5LjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPg0KPHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJDYXBhXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgNDQzLjUyIDQ0My41MiIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNDQzLjUyIDQ0My41MjsiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPGc+DQoJPGc+DQoJCTxwYXRoIGQ9Ik0xNDMuNDkyLDIyMS44NjNMMzM2LjIyNiwyOS4xMjljNi42NjMtNi42NjQsNi42NjMtMTcuNDY4LDAtMjQuMTMyYy02LjY2NS02LjY2Mi0xNy40NjgtNi42NjItMjQuMTMyLDBsLTIwNC44LDIwNC44DQoJCQljLTYuNjYyLDYuNjY0LTYuNjYyLDE3LjQ2OCwwLDI0LjEzMmwyMDQuOCwyMDQuOGM2Ljc4LDYuNTQ4LDE3LjU4NCw2LjM2LDI0LjEzMi0wLjQyYzYuMzg3LTYuNjE0LDYuMzg3LTE3LjA5OSwwLTIzLjcxMg0KCQkJTDE0My40OTIsMjIxLjg2M3oiLz4NCgk8L2c+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8L3N2Zz4NCg==) no-repeat 50% 50%; mask: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pg0KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE5LjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPg0KPHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJDYXBhXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgNDQzLjUyIDQ0My41MiIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNDQzLjUyIDQ0My41MjsiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPGc+DQoJPGc+DQoJCTxwYXRoIGQ9Ik0xNDMuNDkyLDIyMS44NjNMMzM2LjIyNiwyOS4xMjljNi42NjMtNi42NjQsNi42NjMtMTcuNDY4LDAtMjQuMTMyYy02LjY2NS02LjY2Mi0xNy40NjgtNi42NjItMjQuMTMyLDBsLTIwNC44LDIwNC44DQoJCQljLTYuNjYyLDYuNjY0LTYuNjYyLDE3LjQ2OCwwLDI0LjEzMmwyMDQuOCwyMDQuOGM2Ljc4LDYuNTQ4LDE3LjU4NCw2LjM2LDI0LjEzMi0wLjQyYzYuMzg3LTYuNjE0LDYuMzg3LTE3LjA5OSwwLTIzLjcxMg0KCQkJTDE0My40OTIsMjIxLjg2M3oiLz4NCgk8L2c+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8L3N2Zz4NCg==) no-repeat 50% 50%; -webkit-mask-size: cover; mask-size: cover; background-color: var(--MutedTwo); content: "" } body .main-header .header-link a.back-cart-link { display: none } @media (max-width: 1024px) { body .main-header .header-link { top: 50%; transform: translateY(-50%) } body .main-header .header-link a { max-width: 80px } body .main-header .header-link a:before { width: 17px; height: 17px } } body .main-header .logo { max-width: calc(100% - 180px) } body .main-header .logo svg.vtex-logo { height: 50px } body .main-header .logo, body .main-header .logo img { display: inline-block; font-size: 24px; border: none; line-height: 39px } body .main-header .checkout-steps { max-width: 540px; margin-left: auto; padding-right: 10px } @media (max-width: 1024px) { body:not(.body-cart) .main-header { padding: 4px 0; margin-bottom: 10px } body:not(.body-cart) .main-header .v-custom-mhide { display: none !important } body:not(.body-cart) .main-header, body:not(.body-cart) .main-header>.container { background: none; border: none; justify-content: center } body:not(.body-cart) .main-header .logo { cursor: default; pointer-events: none; font-weight: bold } body:not(.body-cart) .main-header .logo svg, body:not(.body-cart) .main-header .logo img { display: none !important } body:not(.body-cart) .main-header .logo:before { content: "checkout"; text-transform: uppercase } body:not(.body-cart) .main-header .logo, body:not(.body-cart) .main-header .logo:hover { color: var(--MutedOne); font-size: 14px } body:not(.body-cart) .main-header .header-link { display: block } body:not(.body-cart) .main-header a.buy-more-link { display: none } body:not(.body-cart) .main-header a.back-cart-link { display: block !important; font-size: 0 } body:not(.body-cart) .main-header a.back-cart-link:before { background: var(--MutedOne) } } .main-footer { clear: both; text-align: center; padding: 2px 0; border-top: 1px solid var(--MutedFour); position: absolute; bottom: 0; width: 100%; z-index: -1 } .main-footer .container { position: initial } @media (max-width: 1024px) { .main-footer { position: relative } } .main-footer a.credits-vtex { width: 100px; display: block; margin: 0 auto } .main-footer .vtex-logo { display: block; margin: 0 auto } .main-footer svg, .main-footer svg path { fill: #999 } .cart { border: none; padding: 0 } body.v-custom-step-cart .main-header .header-link { display: block } body.v-custom-cart-empty #cart-title, body.v-custom-cart-empty #shipping-preview-container, body.v-custom-cart-empty .summary-template-holder, body.v-custom-cart-empty .checkout-steps, body.v-custom-cart-empty .cart-more-options { display: none !important } body.v-custom-cart-empty .cart-template-holder { margin: 0 auto } .empty-cart-content { padding: 50px 0 } h1#cart-title { display: none !important } .cart-more-options, .cart-template-holder .cart { padding: 20px 30px; background: #fff; margin: 0; border-radius: 4px } @media (max-width: 1024px) { .cart-more-options, .cart-template-holder .cart { padding: 12px } } .cart-template-holder .cart { border: none; margin-bottom: 20px } .table.cart-items { display: block } .table.cart-items thead { width: 100%; display: block } .table.cart-items thead tr { display: flex; align-items: center } .table.cart-items thead tr th.product { width: calc(100% - 242px) !important } .table.cart-items thead tr th.product-price, .table.cart-items thead tr th.quantity-price { width: 90px !important } .table.cart-items thead tr th.item-remove, .table.cart-items thead tr th.quantity-price, .table.cart-items thead tr th.shipping-date { display: none } .table.cart-items thead tr th.quantity { min-width: 62px } .table.cart-items thead tr th.product-image { order: 1 } .table.cart-items thead tr th.product-name { order: 2 } .table.cart-items thead tr th.shipping-date { order: 3 } .table.cart-items thead tr th.quantity { order: 3 } .table.cart-items thead tr th.product-price, .table.cart-items thead tr th.quantity-price { order: 5 } .table.cart-items tr.item-attachments-head { border: none !important; justify-content: center } .table.cart-items tr.item-attachments-head .help-arrow { display: none } .table.cart-items td.shipping-date { display: none } .table.cart-items tbody { display: flex; flex-wrap: wrap; width: 100% } .table.cart-items tbody tr { width: 100%; display: flex; flex-wrap: wrap; border-top: 1px solid #eee } .table.cart-items tbody tr.hide { display: none } .table.cart-items tbody tr>.v-custom-bundles { width: 100% } @media (max-width: 1024px) { .table.cart-items tbody tr { margin-top: 0 !important } .table.cart-items tbody tr:first-child { border: none } } .table.cart-items tbody tr.item-attachments-head, .table.cart-items tbody tr.item-attachments-content { display: none } .table.cart-items tbody tr .v-custom-product-item-wrap { width: 100%; display: flex; align-items: center; position: relative; padding: 20px 0 } @media (max-width: 1024px) { .table.cart-items tbody tr .v-custom-product-item-wrap { display: block; padding: 10px 0 } .table.cart-items tbody tr .v-custom-product-item-wrap:after { content: ""; clear: both; display: block } } .table.cart-items tbody tr td { width: auto; border: none } .table.cart-items tbody tr td.product-name .add-service-container, .table.cart-items tbody tr td.product-name .clone-item.btn, .table.cart-items tbody tr td.product-name .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a.clone-item, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .table.cart-items tbody tr td.product-name a.clone-item, .table.cart-items tbody tr td.product-name .orderform-template-holder #payment-data .payment-discounts-list table td.action a.clone-item, .orderform-template-holder #payment-data .payment-discounts-list table td.action .table.cart-items tbody tr td.product-name a.clone-item, .table.cart-items tbody tr td.product-name .add-item-attachment-container { margin: 10px 0 } .table.cart-items tbody tr td.product-name .add-service-container+p, .table.cart-items tbody tr td.product-name .clone-item.btn+p, .table.cart-items tbody tr td.product-name .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a.clone-item+p, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .table.cart-items tbody tr td.product-name a.clone-item+p, .table.cart-items tbody tr td.product-name .orderform-template-holder #payment-data .payment-discounts-list table td.action a.clone-item+p, .orderform-template-holder #payment-data .payment-discounts-list table td.action .table.cart-items tbody tr td.product-name a.clone-item+p, .table.cart-items tbody tr td.product-name .add-item-attachment-container+p { display: none } @media (min-width: 1025px) { .table.cart-items tbody tr td.product-name { width: calc(100% - 355px) !important } } .table.cart-items tbody tr td.product-name .seller { display: block } .table.cart-items tbody tr td.product-price, .table.cart-items tbody tr td.quantity-price { width: 90px !important; white-space: nowrap; margin: 0 10px; line-height: 16px } .table.cart-items tbody tr td.product-price br, .table.cart-items tbody tr td.quantity-price br { display: none } @media (max-width: 1024px) { .table.cart-items tbody tr td.product-price, .table.cart-items tbody tr td.quantity-price { width: initial !important; text-align: right; float: right; margin: 0; padding: 0 } } .table.cart-items tbody tr td.product-price .new-product-price-label, .table.cart-items tbody tr td.product-price .old-product-price-label, .table.cart-items tbody tr td.quantity-price .new-product-price-label, .table.cart-items tbody tr td.quantity-price .old-product-price-label { display: none } .table.cart-items tbody tr td.product-price .list-price, .table.cart-items tbody tr td.quantity-price .list-price { font-size: 10px } .table.cart-items tbody tr td.product-price .total-selling-price, .table.cart-items tbody tr td.product-price .best-price, .table.cart-items tbody tr td.quantity-price .total-selling-price, .table.cart-items tbody tr td.quantity-price .best-price { font-weight: bold; position: relative } @media (max-width: 1024px) { .table.cart-items tbody tr td.product-price .total-selling-price, .table.cart-items tbody tr td.product-price .best-price, .table.cart-items tbody tr td.quantity-price .total-selling-price, .table.cart-items tbody tr td.quantity-price .best-price { display: flex; justify-content: flex-end; margin-top: 7px } .table.cart-items tbody tr td.product-price .total-selling-price .discount, .table.cart-items tbody tr td.product-price .best-price .discount, .table.cart-items tbody tr td.quantity-price .total-selling-price .discount, .table.cart-items tbody tr td.quantity-price .best-price .discount { margin-left: 5px; display: block } } .table.cart-items tbody tr td.product-price .new-product-real-price-per-unit, .table.cart-items tbody tr td.quantity-price .new-product-real-price-per-unit { display: inline-block } .table.cart-items tbody tr td.product-price .v-custom-quantity-price__best, .table.cart-items tbody tr td.quantity-price .v-custom-quantity-price__best { font-weight: bold; font-size: 12px } .table.cart-items tbody tr td.product-price .v-custom-quantity-price__list, .table.cart-items tbody tr td.quantity-price .v-custom-quantity-price__list { display: block; font-size: 10px } .table.cart-items tbody tr td.product-price .v-custom-quantity-price__list--list, .table.cart-items tbody tr td.product-price .v-custom-quantity-price__list--selling, .table.cart-items tbody tr td.quantity-price .v-custom-quantity-price__list--list, .table.cart-items tbody tr td.quantity-price .v-custom-quantity-price__list--selling { display: block } .table.cart-items tbody tr td.product-price .v-custom-quantity-price__list--list, .table.cart-items tbody tr td.quantity-price .v-custom-quantity-price__list--list { text-decoration: line-through; color: #999 } .table.cart-items tbody tr td.product-price .v-custom-quantity-price__list, .table.cart-items tbody tr td.product-price .v-custom-quantity-price__list--selling, .table.cart-items tbody tr td.quantity-price .v-custom-quantity-price__list, .table.cart-items tbody tr td.quantity-price .v-custom-quantity-price__list--selling { color: var(--MutedTwo); font-size: 10px; line-height: 11px } .table.cart-items tbody tr td.product-price .v-custom-quantity-price__list--selling, .table.cart-items tbody tr td.quantity-price .v-custom-quantity-price__list--selling { margin-bottom: 3px } .table.cart-items tbody tr td.product-price .v-custom-quantity-price__list--selling .discount, .table.cart-items tbody tr td.quantity-price .v-custom-quantity-price__list--selling .discount { display: none } .table.cart-items tbody tr td.product-price .v-custom-quantity-price__list--selling:after, .table.cart-items tbody tr td.quantity-price .v-custom-quantity-price__list--selling:after { content: ")" } .table.cart-items tbody tr td.product-price .v-custom-quantity-price__list--selling:before, .table.cart-items tbody tr td.quantity-price .v-custom-quantity-price__list--selling:before { content: "(" } .table.cart-items tbody tr td.product-price .v-custom-quantity-price__list--selling .best-price, .table.cart-items tbody tr td.quantity-price .v-custom-quantity-price__list--selling .best-price { font-weight: normal; display: inline-block } @media (max-width: 1024px) { .table.cart-items tbody tr td.product-price .v-custom-quantity-price__list>*:last-child, .table.cart-items tbody tr td.quantity-price .v-custom-quantity-price__list>*:last-child { margin-bottom: -7px } } .table.cart-items tbody tr td.product-price.v-custom-quantity-price-active>.list-price, .table.cart-items tbody tr td.quantity-price.v-custom-quantity-price-active>.list-price { display: none !important } .table.cart-items tbody tr td.product-price>span.list-price, .table.cart-items tbody tr td.product-price>span.best-price, .table.cart-items tbody tr td.quantity-price>span.list-price, .table.cart-items tbody tr td.quantity-price>span.best-price { display: block } .table.cart-items tbody tr td.product-price span.product-manualprice, .table.cart-items tbody tr td.product-price a.manualprice-link-remove, .table.cart-items tbody tr td.quantity-price span.product-manualprice, .table.cart-items tbody tr td.quantity-price a.manualprice-link-remove { z-index: 2 } .table.cart-items tbody tr td.product-price a.manualprice-link-remove, .table.cart-items tbody tr td.quantity-price a.manualprice-link-remove { position: absolute; top: -2px; left: -4px; background: #FFF } .table.cart-items tbody tr td.product-price a.manualprice-link-remove i.icon-remove:before, .table.cart-items tbody tr td.quantity-price a.manualprice-link-remove i.icon-remove:before { width: 10px !important; height: 10px !important } .table.cart-items tbody tr td.product-price span.product-manualprice, .table.cart-items tbody tr td.quantity-price span.product-manualprice { padding: 5px 5px 5px 31px; border: 1px solid #ccc; display: inline-block; background: #FFF; border-radius: 5px; box-shadow: 0 0 19px #777; position: absolute; top: 0; left: 0; transform: translate(-15%, -34%) } @media (max-width: 1024px) { .table.cart-items tbody tr td.product-price span.list-price:not(.hide)+br+span.best-price { margin-top: 0 } } .table.cart-items tbody tr td.item-remove { margin-left: auto; width: 20px !important } @media (max-width: 1024px) { .table.cart-items tbody tr td.item-remove { top: 0 !important } } .table.cart-items tbody tr td.product-image { order: 1 } .table.cart-items tbody tr td.product-name { order: 2; width: 60% } .table.cart-items tbody tr td.shipping-date { order: 3 } .table.cart-items tbody tr td.quantity { order: 3 } .table.cart-items tbody tr td.product-price, .table.cart-items tbody tr td.quantity-price { order: 5 } .table.cart-items tbody tr td.item-remove { order: 10 } .table.cart-items tbody tr td.quantity-price { display: none !important } .table.cart-items tbody tr td.product-price { display: block !important } .table.cart-items tbody tr td .field-help { background: var(--ActionPrimary); border-color: var(--ActionPrimary); } .table.cart-items tbody tr td i.icon-question-sign { color: var(--ActionPrimary); } .table.cart-items tbody tr td .add-item-attachment-container, .table.cart-items tbody tr td .clone-item, .table.cart-items tbody tr td p.clone-item-container { display: none !important } .table.cart-items tbody tr td hr.clone-item-sep { margin: 0; clear: both; border: none } .table.cart-items tbody tr td .product-service { height: calc(40px + 10px); margin-top: 10px; position: relative } @media (min-width: 1025px) { .table.cart-items tbody tr td .product-service fieldset { width: 100%; position: absolute; min-width: 250px } } .table.cart-items tbody tr td .product-service p { display: flex } .table.cart-items tbody tr td .product-service select { background: #FFF; width: 100%; margin-right: 10px } .table.cart-items tbody tr td.quantity input { line-height: inherit } .table.cart-items tbody tr .v-custom-assemblies { clear: both } .table.cart-items tbody tr.v-custom-bundles-in .product-service { display: none } .table.cart-items tbody tr.item-unavailable { margin: 10px 0; border-radius: 10px; border: none !important } @media (max-width: 1024px) { .table.cart-items tbody tr.item-unavailable { padding: 0; text-align: center } } .table.cart-items tbody tr.v-custom-indexedItems-in+tr.item-unavailable { display: none } .table.cart-items tbody tr.v-custom-indexed-item { border: none } .table.cart-items tbody tr.v-custom-indexed-item, .table.cart-items tbody tr.item-service { margin: 0 0 10px 0; padding: 0; border-top: none } .table.cart-items tbody tr.v-custom-indexed-item .v-custom-product-item-wrap, .table.cart-items tbody tr.v-custom-indexed-item .v-custom-trservice-wrap, .table.cart-items tbody tr.item-service .v-custom-product-item-wrap, .table.cart-items tbody tr.item-service .v-custom-trservice-wrap { background: var(--ActionSecondary); border: 1px dashed var(--MutedFour); border-radius: 4px; width: 100%; display: flex; align-items: center; box-sizing: border-box; padding: 5px 10px } .table.cart-items tbody tr.v-custom-indexed-item .v-custom-trservice-wrap, .table.cart-items tbody tr.item-service .v-custom-trservice-wrap { margin-bottom: 10px; margin-top: 10px } .table.cart-items tbody tr.v-custom-indexed-item td.quantity, .table.cart-items tbody tr.item-service td.quantity { background: #FFF; width: 25px; height: 20px; text-align: center; justify-content: center } .table.cart-items tbody tr.v-custom-indexed-item td.quantity p, .table.cart-items tbody tr.item-service td.quantity p { width: 100% } .table.cart-items tbody tr.v-custom-indexed-item td.product-price, .table.cart-items tbody tr.item-service td.product-price { display: none !important } .table.cart-items tbody tr.v-custom-indexed-item td.quantity-price, .table.cart-items tbody tr.item-service td.quantity-price { display: block !important } .table.cart-items tbody tr.v-custom-indexed-item .item-remove, .table.cart-items tbody tr.item-service .item-remove { margin-left: auto; position: initial; width: auto } .table.cart-items tbody tr.v-custom-indexed-item .item-remove i.icon.icon-remove.item-remove-ico:before, .table.cart-items tbody tr.item-service .item-remove i.icon.icon-remove.item-remove-ico:before { content: "-"; background: var(--Danger); color: #FFF; line-height: 9px; border-radius: 100%; width: 16px; height: 16px; font-size: 27px } @media (max-width: 1024px) { .table.cart-items tbody tr.v-custom-indexed-item, .table.cart-items tbody tr.item-service { border-top: none !important } .table.cart-items tbody tr.v-custom-indexed-item .product-price, .table.cart-items tbody tr.v-custom-indexed-item .quantity, .table.cart-items tbody tr.item-service .product-price, .table.cart-items tbody tr.item-service .quantity { margin: auto !important; width: auto !important; min-width: initial !important } } .table.cart-items tbody tr.v-custom-indexed-item:last-child { margin-bottom: 20px } .table.cart-items tbody tr.v-custom-indexed-item td.product-image { display: none } @media (max-width: 1024px) { .table.cart-items tbody tr.v-custom-indexed-item td.quantity { display: none } } .table.cart-items tbody tr.v-custom-indexed-item td.product-name { margin-left: 0 !important; padding: 0 !important; width: 100% !important; margin-right: 15px } .table.cart-items tbody tr.v-custom-indexed-item p { margin: 0; padding: 0 } .table.cart-items tbody tr:last-child { border-bottom: none } .table.cart-items tbody>tr.v-custom-indexed-item, .table.cart-items tbody>tr[data-parentitemindex] { display: none } .table.cart-items td.product-image a { overflow: hidden; border-radius: 4px } .table.cart-items td.product-image a { margin-right: 20px } .table.cart-items td.product-image a, .table.cart-items td.product-image img { width: 100px; display: block; max-width: initial; height: auto } @media (max-width: 1024px) { .table.cart-items td.product-image a, .table.cart-items td.product-image img { width: 70px } } .table.cart-items td.product-name a, .table.cart-items td.product-name a:hover { color: #333; font-weight: bold; text-decoration: none } .table.cart-items td.quantity { margin: 0 0 0 10px; display: flex; align-items: center; padding: 0; border-radius: 4px; border: 1px solid var(--MutedFour); float: left; min-width: 30px; text-align: center; justify-content: center } .table.cart-items td.quantity input { margin: 0; width: 30px !important; height: 30px !important; padding: 0; border: none; box-shadow: none } .table.cart-items td.quantity .item-quantity-change { position: initial; left: initial; top: initial; bottom: initial; height: initial; display: flex; align-items: center; justify-content: center; padding: 0 } .table.cart-items td.quantity .item-quantity-change i { background: none; line-height: 0; display: inline-block } .table.cart-items td.quantity .item-quantity-change i:before { font-weight: bold; font-size: 22px; width: 25px; height: 25px; line-height: 25px; color: #000; border-radius: 100% } .table.cart-items td.quantity .item-quantity-change>p { margin: 0 } @media (max-width: 1024px) { .table.cart-items td.quantity { width: 97px } .table.cart-items td.product-name, .table.cart-items td.quantity { margin-left: 90px !important } } .table.cart-items i.icon.icon-remove.item-remove-ico:before { content: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pg0KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE5LjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPg0KPHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJDYXBhXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgNTEyLjAwMSA1MTIuMDAxIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA1MTIuMDAxIDUxMi4wMDE7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxnPg0KCQk8cGF0aCBkPSJNMjg0LjI4NiwyNTYuMDAyTDUwNi4xNDMsMzQuMTQ0YzcuODExLTcuODExLDcuODExLTIwLjQ3NSwwLTI4LjI4NWMtNy44MTEtNy44MS0yMC40NzUtNy44MTEtMjguMjg1LDBMMjU2LDIyNy43MTcNCgkJCUwzNC4xNDMsNS44NTljLTcuODExLTcuODExLTIwLjQ3NS03LjgxMS0yOC4yODUsMGMtNy44MSw3LjgxMS03LjgxMSwyMC40NzUsMCwyOC4yODVsMjIxLjg1NywyMjEuODU3TDUuODU4LDQ3Ny44NTkNCgkJCWMtNy44MTEsNy44MTEtNy44MTEsMjAuNDc1LDAsMjguMjg1YzMuOTA1LDMuOTA1LDkuMDI0LDUuODU3LDE0LjE0Myw1Ljg1N2M1LjExOSwwLDEwLjIzNy0xLjk1MiwxNC4xNDMtNS44NTdMMjU2LDI4NC4yODcNCgkJCWwyMjEuODU3LDIyMS44NTdjMy45MDUsMy45MDUsOS4wMjQsNS44NTcsMTQuMTQzLDUuODU3czEwLjIzNy0xLjk1MiwxNC4xNDMtNS44NTdjNy44MTEtNy44MTEsNy44MTEtMjAuNDc1LDAtMjguMjg1DQoJCQlMMjg0LjI4NiwyNTYuMDAyeiIvPg0KCTwvZz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjwvc3ZnPg0K"); width: 15px; height: 15px } .summary-template-holder { background: #fff; padding: 20px; text-align: left; box-sizing: border-box; border-radius: 4px; position: sticky; top: 20px; border: none } .summary-template-holder .summary-totalizers, .summary-template-holder .summary-coupon-wrap { width: 100% !important } .summary-template-holder .cart-more-options { display: none !important } .summary-template-holder .summary-coupon { text-align: center; margin: 0 auto !important; min-width: initial } .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data { display: none !important } .summary-template-holder .summary-coupon fieldset.coupon-fieldset p { margin: 0; color: var(--MutedTwo) } .summary-template-holder .summary-coupon fieldset.coupon-fieldset p label { cursor: initial; font-size: 13px } .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data { margin: 0; width: 100% } .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a { width: 100%; text-decoration: underline } .summary-template-holder .summary-coupon fieldset.coupon-fieldset>div { display: flex; justify-content: space-between; align-items: center } .summary-template-holder .summary-coupon fieldset.coupon-fieldset>div[style*="none"] { display: block !important } .summary-template-holder .summary-coupon fieldset.coupon-fieldset>div[style*="flex"] p.coupon-label { display: none } .summary-template-holder .summary-coupon fieldset.coupon-fieldset>div[style*="flex"] p.coupon-fields { width: 100% } .summary-template-holder .summary-coupon p.coupon-fields span { display: flex; width: 100%; position: relative } .summary-template-holder .summary-coupon p.coupon-fields span.info { align-items: center; padding: 0; color: var(--MutedOne) } .summary-template-holder .summary-coupon p.coupon-fields span.info>span { text-align: left; margin-right: 10px; color: var(--ActionPrimary); } .summary-template-holder .summary-coupon p.coupon-fields span input { width: 100%; margin-right: 10px } .summary-template-holder .summary-coupon p.coupon-fields .delete { width: auto } .summary-template-holder .summary-coupon p.coupon-fields .delete #cart-coupon-remove { color: var(--Danger); font-size: 0; display: flex; align-items: center } .summary-template-holder .summary-coupon p.coupon-fields .delete #cart-coupon-remove:before { content: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pg0KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE5LjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPg0KPHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJDYXBhXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgNTEyLjAwMSA1MTIuMDAxIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA1MTIuMDAxIDUxMi4wMDE7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxnPg0KCQk8cGF0aCBkPSJNMjg0LjI4NiwyNTYuMDAyTDUwNi4xNDMsMzQuMTQ0YzcuODExLTcuODExLDcuODExLTIwLjQ3NSwwLTI4LjI4NWMtNy44MTEtNy44MS0yMC40NzUtNy44MTEtMjguMjg1LDBMMjU2LDIyNy43MTcNCgkJCUwzNC4xNDMsNS44NTljLTcuODExLTcuODExLTIwLjQ3NS03LjgxMS0yOC4yODUsMGMtNy44MSw3LjgxMS03LjgxMSwyMC40NzUsMCwyOC4yODVsMjIxLjg1NywyMjEuODU3TDUuODU4LDQ3Ny44NTkNCgkJCWMtNy44MTEsNy44MTEtNy44MTEsMjAuNDc1LDAsMjguMjg1YzMuOTA1LDMuOTA1LDkuMDI0LDUuODU3LDE0LjE0Myw1Ljg1N2M1LjExOSwwLDEwLjIzNy0xLjk1MiwxNC4xNDMtNS44NTdMMjU2LDI4NC4yODcNCgkJCWwyMjEuODU3LDIyMS44NTdjMy45MDUsMy45MDUsOS4wMjQsNS44NTcsMTQuMTQzLDUuODU3czEwLjIzNy0xLjk1MiwxNC4xNDMtNS44NTdjNy44MTEtNy44MTEsNy44MTEtMjAuNDc1LDAtMjguMjg1DQoJCQlMMjg0LjI4NiwyNTYuMDAyeiIvPg0KCTwvZz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjwvc3ZnPg0K"); width: 11px; height: 12px; display: block; line-height: 10px } .summary-template-holder .summary-coupon i.icon-spin.loading-coupon { border: 1px solid #666; border-top: none; border-radius: 100%; font-size: 0; width: 20px; height: 20px; padding: 0; line-height: 0; display: none; margin: 0; position: absolute; top: 25%; right: 10px; z-index: -1 } .summary-template-holder span.link-choose-more-products-wrapper { display: none } .summary-template-holder .cart-links-bottom { float: none; margin: 10px 0 0 0 } .summary-template-holder .cart-links-bottom .btn, .summary-template-holder .cart-links-bottom .summary-coupon fieldset.coupon-fieldset .coupon-data a, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .cart-links-bottom a, .summary-template-holder .cart-links-bottom .orderform-template-holder #payment-data .payment-discounts-list table td.action a, .orderform-template-holder #payment-data .payment-discounts-list table td.action .summary-template-holder .cart-links-bottom a { width: 100%; box-sizing: border-box } .summary-template-holder .cart-links-bottom .btn-success { font-weight: bold } @media (max-width: 1024px) { .summary-template-holder .cart-links-bottom { position: fixed; bottom: 0; width: 100%; left: 0; z-index: 10000 } .summary-template-holder .cart-links-bottom a { border-radius: 0 } } .summary-template-holder .summary-totalizers .table td.space, .summary-template-holder .summary-totalizers .table td.empty, .summary-template-holder .summary-totalizers tbody.shipping-calculate { display: none } .summary-template-holder .shipping-reset { display: none } .summary-template-holder tr:not(.Shipping) { display: flex !important; justify-content: space-between; border: none !important } .summary-template-holder tr:not(.Shipping).CustomTax:not(.CustomTax--total) { display: none !important } .summary-template-holder tbody { border-top: 1px solid var(--MutedFour); border-bottom: 1px solid var(--MutedFour); padding: 15px 0; display: block } .summary-template-holder tbody td { display: inline-block; text-align: left !important; width: auto; color: var(--MutedTwo); font-size: 13px; padding: 0 0 3px 0 !important } .summary-template-holder tbody td.monetary { text-align: right !important; margin-left: auto; float: right } .summary-template-holder tfoot tr td { padding: 14px 0 !important; color: var(--MutedOne); font-size: 14px; font-weight: bold } .summary-template-holder tfoot tr td.monetary { text-align: right !important; margin-left: auto; float: right; color: var(--ActionPrimary); } .summary-coupon { width: 100% !important } .cart-select-gift-placeholder { width: auto !important; display: none !important } .cart-more-options { width: 100% !important; margin: 0 !important; border: none; padding: 0; min-height: 0 !important; display: flex !important; flex-wrap: wrap } .cart-more-options .cart-select-gift-placeholder { display: block !important } .cart-more-options .vtex-shipping-preview-0-x-alert .shp-alert-content.vtex-shipping-preview-0-x-content { display: flex; align-items: center } .cart-more-options .srp-container { max-width: 100% !important } .cart-more-options .srp-container span.error { display: none } .cart-more-options .srp-container .srp-toggle__wrapper label { background: #FFF; padding: 10px 0; border-radius: 4px } .cart-more-options .srp-container .srp-delivery-info .b--light-gray { background: #FFF; border-radius: 4px } .cart-more-options .srp-container select, .cart-more-options .srp-container input[type=text]:not(.pac-target-input) { outline: initial } .cart-more-options .srp-container form.srp-postal-code__form.dib.relative { width: 100% } .cart-more-options .srp-container button.shp-open-options { border-color: var(--ActionPrimaryDark) } .cart-more-options .srp-container .onda-v1 .blue { color: var(--ActionPrimary); outline: none } .cart-more-options .srp-container .onda-v1 .b--blue { border-color: var(--ActionPrimary); outline: none } .cart-more-options .srp-container .onda-v1 .bg-blue { background: var(--ActionPrimary); outline: initial } .cart-more-options .srp-container .vtex-shipping-preview-0-x-pc .ship-country { width: 98% } .cart-more-options .srp-container .vtex-shipping-preview-0-x-pc .btn, .cart-more-options .srp-container .vtex-shipping-preview-0-x-pc .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .cart-more-options .srp-container .vtex-shipping-preview-0-x-pc a, .cart-more-options .srp-container .vtex-shipping-preview-0-x-pc .orderform-template-holder #payment-data .payment-discounts-list table td.action a, .orderform-template-holder #payment-data .payment-discounts-list table td.action .cart-more-options .srp-container .vtex-shipping-preview-0-x-pc a { height: 40px; outline: initial; border-radius: 4px } .cart-more-options .srp-container .ship-postalCode { width: auto !important; max-width: 190px } .cart-more-options .srp-container .ship-postalCode input#ship-postalCode { width: 100% } .cart-more-options .cart-select-gift-placeholder, .cart-more-options #shipping-preview-container { margin: 20px; width: 100% } @media (min-width: 1025px) { .cart-more-options .cart-select-gift-placeholder { margin-bottom: 0 } } .cart-more-options .cart-select-gift-placeholder:empty { display: none } .cart-more-options #shipping-preview-container { width: 100% !important } @media (max-width: 1024px) { .cart-more-options #shipping-preview-container { display: none !important } } .cart-more-options .vtex-pickup-points-modal-3-x-pickupViewMode .btn, .cart-more-options .vtex-pickup-points-modal-3-x-pickupViewMode .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .cart-more-options .vtex-pickup-points-modal-3-x-pickupViewMode a, .cart-more-options .vtex-pickup-points-modal-3-x-pickupViewMode .orderform-template-holder #payment-data .payment-discounts-list table td.action a, .orderform-template-holder #payment-data .payment-discounts-list table td.action .cart-more-options .vtex-pickup-points-modal-3-x-pickupViewMode a { padding: 13px 0 } .cart-select-gift-placeholder .available-gift-item.active { background: var(--ActionSecondary); } .cart-select-gift-placeholder .label-vertical-group:hover, .cart-select-gift-placeholder .icon-check-empty, .cart-select-gift-placeholder .icon-check-sign { color: var(--MutedTwo) } .cart-select-gift-placeholder .label-vertical-group:hover .icon-check-empty, .cart-select-gift-placeholder .icon-check-sign { color: var(--ActionPrimary); } .body-cart-vertical .cart-template-holder { width: calc(70% - 20px) } @media (max-width: 1024px) { .body-cart-vertical .cart-template-holder { width: 100% } } .body-cart-vertical .summary-template-holder { width: 30% } @media (max-width: 1024px) { .body-cart-vertical .summary-template-holder { width: 100%; margin-top: 20px } } .body-cart-vertical .cart-template.full-cart.active { display: flex; flex-flow: wrap; justify-content: space-between; align-items: flex-start } .body-cart-vertical .cart-template.full-cart.active .extensions-checkout-buttons-container { width: auto !important; margin: 0 } .body-cart-vertical .cart-template.full-cart.active .totalizers.summary-totalizers.cart-totalizers { width: 100%; padding: 0; margin: 0 } .client-pre-email { background: none; width: 100%; border-top: none; position: relative; text-align: left } .client-pre-email fieldset.pre-email { box-sizing: border-box } .client-pre-email label { margin: 0; line-height: 20px } .client-pre-email label small { font-size: 12px; padding: 0; margin: 0; color: var(--MutedOne); font-weight: 400; margin: 0; vertical-align: top; display: block; margin-bottom: 13px; margin-top: 20px } .client-pre-email .link-cart { display: none } .client-pre-email h3.client-pre-email-h { margin: 0 } .client-pre-email h3.client-pre-email-h span { display: block; position: relative; font-size: 0; padding: 7px 0 !important } .client-pre-email h3.client-pre-email-h span:after { content: "Email"; vertical-align: middle; display: inline-block; margin: 0 } .client-pre-email h3.client-pre-email-h span:after { padding: 0 !important } .client-pre-email h3.client-pre-email-h .link-box-edit { display: none } .client-pre-email a#orderform-to-cart { color: var(--ActionPrimary); } .client-pre-email .client-email.input.text { margin: 0; width: 100%; position: initial } .client-pre-email .client-email.input.text input[type="email"] { width: 100%; box-sizing: border-box } .client-pre-email .client-email.input.text .btn-success { width: 20%; margin: 0; height: initial; position: absolute; top: initial; bottom: 15px; right: initial; left: 50%; transform: translateX(-50%); min-width: 55% } @media (max-width: 1024px) { .client-pre-email .client-email.input.text .btn-success { width: calc(100% - 60px) } } .client-pre-email .client-email.input.text .loading-inline { position: absolute; color: #FFF; font-size: 16px; bottom: 35px; top: initial; right: 50% !important; margin-right: -10px } .client-pre-email .client-email.input.text .loading-inline[style=""]+#btn-client-pre-email { font-size: 0 } .client-pre-email .emailInfo { margin-top: 20px; width: 80%; box-sizing: border-box } .client-pre-email .emailInfo .icon-ok, .client-pre-email .emailInfo h3 { color: var(--ActionPrimary); } @media (max-width: 1024px) { .client-pre-email .emailInfo { width: 100% } } .client-pre-email .emailInfo .icon-lock { color: #eee } @media (max-width: 1024px) { .client-pre-email .link-cart { display: none !important } } .client-pre-email+.client-profile-data .accordion-body:before { content: "Waiting for more information"; display: block } .client-pre-email+.client-profile-data .accordion-body .accordion-inner { display: none } .client-pre-email+.client-profile-data.filled .accordion-body:before { display: none } .client-pre-email[style*="display: none"] { padding-bottom: 20px !important } .client-pre-email[style*="display: none"] .link-box-edit { display: block !important } .client-pre-email[style*="display: none"] label small { display: none !important } .client-pre-email[style*="display: none"] input#client-pre-email { padding: 0 !important; border: none !important; box-shadow: none !important; font-size: 12px; font-weight: 400; pointer-events: none; cursor: text; background: none !important; color: var(--MutedTwo) } .client-pre-email[style*="display: none"] .emailInfo, .client-pre-email[style*="display: none"] #btn-client-pre-email { display: none } .client-pre-email[style*="display: none"]+.client-profile-data .accordion-body:before { display: none } .client-pre-email[style*="display: none"]+.client-profile-data .accordion-inner { display: block } body:not(.v-custom-step-email) .client-pre-email span.help.error { display: none !important } .payment-group-item-cards .card-flag { width: 32px !important; background-size: auto 20px; min-width: auto; height: 20px } .payment-group-item-cards .card-flag.Visa { background-position: 0 0 } .payment-group-item-cards .card-flag.Mastercard { background-position: -32px 0 } .payment-group-item-cards .card-flag.Diners { background-position: -64px 0 } .payment-group-item-cards .card-flag.Amex, .payment-group-item-cards .card-flag.American { background-position: -96px 0 } .payment-group-item-cards .card-flag.Hipercard { background-position: -128px 0 } .payment-group-item-cards .card-flag.Discover { background-position: -160px 0 } .payment-group-item-cards .card-flag.Aura { background-position: -192px 0 } .payment-group-item-cards .card-flag.Banricompras { background-position: -224px 0 } .payment-group-item-cards .card-flag.Elo { background-position: -256px 0 } .payment-group-item-cards .card-flag.JCB { background-position: -288px 0 } .payment-group-item-cards .card-flag.Cabal { background-position: -320px 0 } .payment-group-item-cards .card-flag.Maestro { background-position: -352px 0 } .payment-group-item-cards .card-flag.Credz { background-position: -384px 0 } .orderform-template-holder .step .input.text label, .vcustom--vtex-omnishipping-1-x-address label { margin: 10px 0 5px 0; display: block; color: #999 } @keyframes placeHolderShimmer { 0% { background-position: -468px 0 } 100% { background-position: 468px 0 } } .orderform-template .cart-template.mini-cart .cart .cart-items:not(.v-loaded) li.item:after, .js-v-custom-is-loadAddress #shipping-data .accordion-group.shipping-data:after, .js-v-custom-is-loading .vcustom--vtex-omnishipping-1-x-address:before { animation-duration: 1.25s; animation-fill-mode: forwards; animation-iteration-count: infinite; animation-name: placeHolderShimmer; animation-timing-function: linear; background: darkgray; background: linear-gradient(to right, #eee 10%, #ddd 18%, #eee 33%); background-size: 800px 104px } svg.pickup-marker-blue, svg.pickup-marker-blue path, svg.pkpmodal-pickup-point-marker-image, svg.pkpmodal-pickup-point-marker-image path, svg.vtex-omnishipping-1-x-svg, svg.vtex-omnishipping-1-x-svg path, svg.pkpmodal-pickup-point-best-marker-image path:not([fill="white"]) { fill: var(--ActionPrimary); } @media (max-width: 1024px) { .container.container-main.container-order-form { width: calc(100% - 20px) } } .orderform-template-holder #client-profile-data { width: 100% } .orderform-template-holder #client-profile-data form.client-pre-email, .orderform-template-holder #client-profile-data .step.client-profile-data, .orderform-template-holder #shipping-data, .orderform-template-holder #payment-data { width: 100% !important; padding: 0; margin: 0; box-sizing: border-box; background: transparent; border-radius: 4px; margin-bottom: 20px !important; z-index: initial; border: none; padding: 30px } @media (max-width: 1024px) { .orderform-template-holder #client-profile-data form.client-pre-email, .orderform-template-holder #client-profile-data .step.client-profile-data, .orderform-template-holder #shipping-data, .orderform-template-holder #payment-data { padding: 20px } } .orderform-template-holder #client-profile-data form.client-pre-email.client-pre-email, .orderform-template-holder #client-profile-data .step.client-profile-data.client-pre-email, .orderform-template-holder #shipping-data.client-pre-email, .orderform-template-holder #payment-data.client-pre-email { display: block !important; padding-bottom: calc(40px + 14px + 30px) } .orderform-template-holder #client-profile-data form.client-pre-email .link-box-edit, .orderform-template-holder #client-profile-data .step.client-profile-data .link-box-edit, .orderform-template-holder #shipping-data .link-box-edit, .orderform-template-holder #payment-data .link-box-edit { background: none; box-shadow: none; border: none; color: var(--ActionPrimary); outline: none; position: absolute; right: 0; top: 50%; padding: 1px; font-size: 14px; transform: translateY(-50%); opacity: 0.7; transition: all ease 0.2s } .orderform-template-holder #client-profile-data form.client-pre-email .link-box-edit:hover, .orderform-template-holder #client-profile-data .step.client-profile-data .link-box-edit:hover, .orderform-template-holder #shipping-data .link-box-edit:hover, .orderform-template-holder #payment-data .link-box-edit:hover { opacity: 1 } .orderform-template-holder #client-profile-data form.client-pre-email .link-box-edit i.icon-spinner, .orderform-template-holder #client-profile-data .step.client-profile-data .link-box-edit i.icon-spinner, .orderform-template-holder #shipping-data .link-box-edit i.icon-spinner, .orderform-template-holder #payment-data .link-box-edit i.icon-spinner { font-size: 17px; position: absolute; right: 0; display: none; top: -7px } .orderform-template-holder #client-profile-data form.client-pre-email .link-box-edit.active i.icon-edit, .orderform-template-holder #client-profile-data .step.client-profile-data .link-box-edit.active i.icon-edit, .orderform-template-holder #shipping-data .link-box-edit.active i.icon-edit, .orderform-template-holder #payment-data .link-box-edit.active i.icon-edit { display: none } .orderform-template-holder #client-profile-data form.client-pre-email .link-box-edit.active i.icon-spinner, .orderform-template-holder #client-profile-data .step.client-profile-data .link-box-edit.active i.icon-spinner, .orderform-template-holder #shipping-data .link-box-edit.active i.icon-spinner, .orderform-template-holder #payment-data .link-box-edit.active i.icon-spinner { display: block } .orderform-template-holder #client-profile-data form.client-pre-email .accordion-toggle, .orderform-template-holder #client-profile-data .step.client-profile-data .accordion-toggle, .orderform-template-holder #shipping-data .accordion-toggle, .orderform-template-holder #payment-data .accordion-toggle { padding: 0 } .orderform-template-holder #client-profile-data form.client-pre-email .accordion-toggle>i, .orderform-template-holder #client-profile-data .step.client-profile-data .accordion-toggle>i, .orderform-template-holder #shipping-data .accordion-toggle>i, .orderform-template-holder #payment-data .accordion-toggle>i { display: none } .orderform-template-holder #client-profile-data form.client-pre-email .accordion-toggle>span, .orderform-template-holder #client-profile-data .step.client-profile-data .accordion-toggle>span, .orderform-template-holder #shipping-data .accordion-toggle>span, .orderform-template-holder #payment-data .accordion-toggle>span { line-height: 20px; display: block; vertical-align: middle; line-height: initial } .orderform-template-holder #client-profile-data form.client-pre-email .accordion-toggle, .orderform-template-holder #client-profile-data form.client-pre-email .accordion-inner, .orderform-template-holder #client-profile-data .step.client-profile-data .accordion-toggle, .orderform-template-holder #client-profile-data .step.client-profile-data .accordion-inner, .orderform-template-holder #shipping-data .accordion-toggle, .orderform-template-holder #shipping-data .accordion-inner, .orderform-template-holder #payment-data .accordion-toggle, .orderform-template-holder #payment-data .accordion-inner { padding: 0 } .orderform-template-holder #client-profile-data form.client-pre-email input[type=text]:not(.pac-target-input), .orderform-template-holder #client-profile-data form.client-pre-email input[type=tel]:not(.pac-target-input), .orderform-template-holder #client-profile-data form.client-pre-email input[type=email]:not(.pac-target-input), .orderform-template-holder #client-profile-data form.client-pre-email select:not(.pac-target-input), .orderform-template-holder #client-profile-data .step.client-profile-data input[type=text]:not(.pac-target-input), .orderform-template-holder #client-profile-data .step.client-profile-data input[type=tel]:not(.pac-target-input), .orderform-template-holder #client-profile-data .step.client-profile-data input[type=email]:not(.pac-target-input), .orderform-template-holder #client-profile-data .step.client-profile-data select:not(.pac-target-input), .orderform-template-holder #shipping-data input[type=text]:not(.pac-target-input), .orderform-template-holder #shipping-data input[type=tel]:not(.pac-target-input), .orderform-template-holder #shipping-data input[type=email]:not(.pac-target-input), .orderform-template-holder #shipping-data select:not(.pac-target-input), .orderform-template-holder #payment-data input[type=text]:not(.pac-target-input), .orderform-template-holder #payment-data input[type=tel]:not(.pac-target-input), .orderform-template-holder #payment-data input[type=email]:not(.pac-target-input), .orderform-template-holder #payment-data select:not(.pac-target-input) { width: 100%; max-width: 100%; outline: initial } .orderform-template-holder #payment-data p.link.link-gift-card, .orderform-template-holder #payment-data .payment-group-item { box-sizing: border-box; margin: 0 6px 10px 0; border-radius: 4px; border: 1px solid var(--MutedFour); opacity: 1; text-decoration: none; color: var(--MutedOne); transition: all ease 0.3s; padding: 11px; text-align: center; display: flex; align-items: center; justify-content: center; background: var(--MutedFive); float: left; width: 100% } .orderform-template-holder #payment-data p.link.link-gift-card.active, .orderform-template-holder #payment-data .payment-group-item.active { background: #FFF } .orderform-template-holder #payment-data p.link.link-gift-card.active span, .orderform-template-holder #payment-data .payment-group-item.active span { color: #000 } .orderform-template-holder #payment-data p.link.link-gift-card.active, .orderform-template-holder #payment-data p.link.link-gift-card:hover, .orderform-template-holder #payment-data .payment-group-item.active, .orderform-template-holder #payment-data .payment-group-item:hover { box-shadow: 0 0 6px var(--MutedFour); border: 1px solid var(--ActionPrimary); } .orderform-template-holder #payment-data p.link.link-gift-card, .orderform-template-holder #payment-data fieldset.payment-group { width: 100%; left: 0; display: block; background: none; position: relative; margin: 0 } .orderform-template-holder #payment-data #iframe-placeholder-creditCardPaymentGroup { padding-top: 32px } .orderform-template-holder #payment-data #iframe-placeholder-creditCardPaymentGroup>.payment-group-item-cards { display: block; overflow: hidden; position: absolute; right: 0; top: 0 } .orderform-template-holder #payment-data #iframe-placeholder-creditCardPaymentGroup>.payment-group-item-cards .card-flag { opacity: 1 } .orderform-template-holder #payment-data p.link.link-gift-card { margin-bottom: 10px; padding: 0 } .orderform-template-holder #payment-data p.link.link-gift-card a { padding: 10px 10px; display: block; text-align: left } .orderform-template-holder #payment-data .payment-group-list-btn { width: 100% } .orderform-template-holder #payment-data p.link.link-gift-card *, .orderform-template-holder #payment-data .payment-group-item * { font-size: 12px !important; font-weight: bold } .orderform-template-holder #payment-data .payment-group-item { position: relative; height: 40px } .orderform-template-holder #payment-data .payment-group-item span.payment-group-item-text { padding: 0; line-height: 17px; background: none !important } .orderform-template-holder #payment-data .payment-group-item:first-child:nth-last-child(n+3), .orderform-template-holder #payment-data .payment-group-item:first-child:nth-last-child(n+3)~.payment-group-item { width: calc(33.3% - 4px) } .orderform-template-holder #payment-data .payment-group-item:first-child:nth-last-child(n+4), .orderform-template-holder #payment-data .payment-group-item:first-child:nth-last-child(n+4)~.payment-group-item { width: calc(25% - 4.8px) } .orderform-template-holder #payment-data .payment-group-item:first-child:nth-last-child(n+5), .orderform-template-holder #payment-data .payment-group-item:first-child:nth-last-child(n+5)~.payment-group-item { width: 100%; margin-right: 0; height: auto } .orderform-template-holder #payment-data .payment-group-item:first-child:nth-last-child(n+5):after, .orderform-template-holder #payment-data .payment-group-item:first-child:nth-last-child(n+5):before, .orderform-template-holder #payment-data .payment-group-item:first-child:nth-last-child(n+5)~.payment-group-item:after, .orderform-template-holder #payment-data .payment-group-item:first-child:nth-last-child(n+5)~.payment-group-item:before { display: none } .orderform-template-holder #payment-data .payment-group-item:first-child:nth-last-child(n+5):hover, .orderform-template-holder #payment-data .payment-group-item:first-child:nth-last-child(n+5)~.payment-group-item:hover { top: 0 } .orderform-template-holder #payment-data .payment-group-item:last-child { margin-right: 0 } .orderform-template-holder #payment-data .payment-group-item:hover { position: relative; background: #FFF; top: -2px } .orderform-template-holder #payment-data .payment-group-item.active:after, .orderform-template-holder #payment-data .payment-group-item.active:before { content: ''; display: block; position: absolute; left: 50%; transform: translateX(-50%); top: 100%; width: 0; height: 0; border-style: solid } .orderform-template-holder #payment-data .payment-group-item.active:after { border-color: #FFF transparent transparent transparent; border-width: 6px } .orderform-template-holder #payment-data .payment-group-item.active:before { border-color: var(--ActionPrimary) transparent transparent transparent; border-width: 7px } .orderform-template-holder #payment-data .gift-card-section.form-step.box-default { padding: 0; margin: 0; width: 100% } .orderform-template-holder #payment-data .gift-card-section.form-step.box-default label { font-weight: bold; color: #000; font-size: 12px } .orderform-template-holder #payment-data p.payment-discounts-options, .orderform-template-holder #payment-data p.gift-card-provider-options { display: flex; align-items: center; padding-bottom: 10px } .orderform-template-holder #payment-data p.payment-discounts-options input, .orderform-template-holder #payment-data p.payment-discounts-options select, .orderform-template-holder #payment-data p.gift-card-provider-options input, .orderform-template-holder #payment-data p.gift-card-provider-options select { margin: 0 10px } .orderform-template-holder #payment-data p.payment-discounts-options label, .orderform-template-holder #payment-data p.gift-card-provider-options label { line-height: 12px; margin: 0 } .orderform-template-holder #payment-data .payment-discounts-list { margin-bottom: 10px } .orderform-template-holder #payment-data .payment-discounts-list .gift-card-provider-group-loyalty-program { border-bottom: 1px solid #eee } .orderform-template-holder #payment-data .payment-discounts-list table { width: 100% } .orderform-template-holder #payment-data .payment-discounts-list table td { padding: 0 } .orderform-template-holder #payment-data .payment-discounts-list table tbody, .orderform-template-holder #payment-data .payment-discounts-list table tr { display: flex; width: 100%; flex-wrap: wrap; align-items: center } .orderform-template-holder #payment-data .payment-discounts-list table td.code, .orderform-template-holder #payment-data .payment-discounts-list table td.number { margin-right: 20px; flex-grow: 1; padding: 0 } .orderform-template-holder #payment-data .payment-discounts-list table #remove-gift-card { text-decoration: underline; color: var(--Danger) } .orderform-template-holder #payment-data input#payment-discounts-code { width: 100% !important } .orderform-template-holder #payment-data #btn-add-gift-card { height: 40px; border-radius: 4px } .orderform-template-holder #payment-data .steps-view { width: 100% !important; padding: 0; min-height: initial } .orderform-template-holder #payment-data .steps-view iframe { margin: 0 } .orderform-template-holder #payment-data p.notification { font-weight: bold; font-weight: 400; color: var(--MutedOne) } .orderform-template-holder #payment-data p.notification:not([style="display: none;"])+.box-step { padding: 0; border: none } @media (min-width: 1025px) { .orderform-template-holder #payment-data:last-child { margin-bottom: 0px !important } } .orderform-template-holder #payment-data .v-custom-payment-item-wrap { box-sizing: border-box; border-radius: 4px; background: #FFF; border: 1px solid var(--MutedFour); color: var(--MutedOne); transition: all ease 0.3s; overflow: hidden; margin-bottom: 10px } .orderform-template-holder #payment-data .v-custom-payment-item-wrap.active, .orderform-template-holder #payment-data .v-custom-payment-item-wrap:hover { border-color: var(--ActionPrimary); box-shadow: 0 0 6px #ddd } .orderform-template-holder #payment-data .v-custom-payment-item-wrap #iframe-placeholder-creditCardPaymentGroup { padding-top: 0 } .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item { border: none; border-bottom: 1px solid transparent; box-shadow: none; margin: 0; width: 100% !important; height: auto; top: 0 } .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item-text { margin-right: auto; text-align: left; line-height: 27px !important; white-space: nowrap } .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item-text:before { content: ""; width: 20px; height: 20px; display: inline-block; border: 1px solid #999; border-radius: 100%; vertical-align: middle; margin: -3px 10px 0 0 } .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item-cards { display: flex; justify-content: flex-end; flex-wrap: wrap } .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item-cards .card-flag:last-child { margin: 0 } @media (max-width: 360px) { .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item-cards { display: none } } .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item.active { background: var(--ActionSecondary); border-bottom: 1px solid var(--ActionPrimary); } .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item.active .payment-group-item-text:before { background: var(--ActionPrimary); border-color: var(--ActionPrimary); box-shadow: inset 0 0 0 3px #FFF } .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item.active .payment-group-item-cards span { opacity: 1 } .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item:hover .payment-group-item-text:before { border-color: var(--ActionPrimary); } .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item:before, .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item:after { display: none } .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item#payment-group-payPalPaymentGroup { position: relative } .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item#payment-group-payPalPaymentGroup:after { content: ""; width: 50px; height: 20px; display: block; background: url("https://io.vtex.com.br/checkout-ui/v6.18.19/img/payment-paypal-landscape.png") center no-repeat; background-size: contain; position: absolute; top: 50%; transform: translateY(-50%); right: 12px; left: initial; border: none } .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item#payment-group-AffirmPaymentGroup:after { content: ""; width: 65px; height: 25px; display: block; background: url(https://cdn-assets.affirm.com/images/black_logo-transparent_bg.png) center no-repeat; background-size: contain; position: absolute; top: 49%; transform: translateY(-50%); right: 3px; left: initial; border: none } .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item.active+div, .orderform-template-holder #payment-data .v-custom-payment-item-wrap.active>div { padding: 20px; overflow: hidden; box-sizing: border-box } .orderform-template-holder #payment-data .v-custom-payment-item-wrap .SecurityEnvironmentIcon { display: none } .orderform-template-holder .step { border: none; padding: 0; background: none; margin-bottom: 0 } @media (max-width: 1024px) { .orderform-template-holder .step { width: 100% } } .orderform-template-holder .step .box-info { color: var(--MutedOne) } .orderform-template-holder .step .box-info[style*="display: block"] { margin-top: 10px } .orderform-template-holder .step .form-step fieldset { width: 100%; float: none } .orderform-template-holder .step .form-step fieldset p { position: relative } @media (max-width: 1024px) { .orderform-template-holder .step .form-step fieldset p { float: none !important } } .orderform-template-holder .step .form-step fieldset p.client-last-name, .orderform-template-holder .step .form-step fieldset p.client-first-name { width: calc(50% - 5px); position: relative } @media (max-width: 1024px) { .orderform-template-holder .step .form-step fieldset p.client-last-name, .orderform-template-holder .step .form-step fieldset p.client-first-name { width: 100% } .orderform-template-holder .step .form-step fieldset p.client-last-name input[type="text"], .orderform-template-holder .step .form-step fieldset p.client-first-name input[type="text"] { width: 100% !important } } .orderform-template-holder .step .form-step fieldset p span.help.error { position: absolute; font-size: 11px; margin-top: 0 } .orderform-template-holder .step .form-step fieldset.box-client-info-pj { padding-top: 15px } .orderform-template-holder .step .form-step fieldset.box-payment-option h3 { display: none } .orderform-template-holder .step .form-step #is-corporate-client { color: var(--ActionPrimary); } .orderform-template-holder .step.client-profile-data .client-notice.notice { margin: 0 0 10px 0 } .orderform-template-holder .step.client-profile-data .box-client-info { margin-bottom: 20px } .orderform-template-holder .step.client-profile-data .client-document, .orderform-template-holder .step.client-profile-data .client-phone { width: calc(50% - 5px) } @media (max-width: 1024px) { .orderform-template-holder .step.client-profile-data .client-document, .orderform-template-holder .step.client-profile-data .client-phone { width: 100% } } .orderform-template-holder .step.shipping-data .box-step { display: flex; flex-wrap: wrap } .orderform-template-holder .step.shipping-data .box-step>* { width: 100%; order: 1 } .orderform-template-holder .step.shipping-data .box-step>*.vtex-omnishipping-1-x-addressFormPart1 { order: 1 } .orderform-template-holder .step.shipping-data .box-step>*.vtex-omnishipping-1-x-addressForm { order: 2 } .orderform-template-holder .step.shipping-data .box-step>*.vtex-omnishipping-1-x-addressInfo { order: 3 } .orderform-template-holder .step.shipping-data .box-step>*.vtex-omnishipping-1-x-deliveryGroup { order: 4 } .orderform-template-holder .step.shipping-data .box-step>*.vtex-omnishipping-1-x-submitPaymentButton { order: 100 } .orderform-template-holder .step.shipping-data .box-step>*.btn-link.vtex-omnishipping-1-x-btnDelivery, .orderform-template-holder .step.shipping-data .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .box-step>a.vtex-omnishipping-1-x-btnDelivery, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .orderform-template-holder .step.shipping-data .box-step>a.vtex-omnishipping-1-x-btnDelivery { order: 5; margin-top: 20px; background: var(--ActionPrimary); } .orderform-template-holder .step.shipping-data .box-step>*#postalCode-finished-loading, .orderform-template-holder .step.shipping-data .box-step>*:last-child { margin: 0 } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-address { margin: 0 } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-addressSummaryActive .address-summary { background: url("data:image/svg+xml;utf8, ") no-repeat; background-position: 12px 9px; border: 1px solid var(--MutedFour) } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-content { align-items: center } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-deliveryChannelsOption { background: #FFF } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-pickupButton, .orderform-template-holder .step.shipping-data .vtex-pickup-points-modal-3-x-pickupViewOptionActive, .orderform-template-holder .step.shipping-data .vtex-pickup-points-modal-3-x-pickupViewOptionActive:hover, .orderform-template-holder .step.shipping-data .vtex-pickup-points-modal-3-x-pickupViewOptionActive:active, .orderform-template-holder .step.shipping-data .vtex-pickup-points-modal-3-x-pickupViewOptionActive:focus, .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-deliveryChannelsTogglePickup, .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-deliveryChannelsOption.vtex-omnishipping-1-x-deliveryOptionActive { background: var(--ActionPrimary); border-color: var(--ActionPrimary); border-radius: 4px } .orderform-template-holder .step.shipping-data .vtex-pickup-points-modal-3-x-pickupViewOptionInctive { color: var(--ActionPrimary); border-color: var(--ActionPrimary); border-radius: 4px } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-addressItemOption:hover, .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-active { background-color: var(--ActionSecondary); } .orderform-template-holder .step.shipping-data .shipping-method-toggle { border-color: var(--ActionPrimary); } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-alert { border-color: var(--Warning); display: flex; align-items: center } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-linkEdit { text-decoration: underline } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-deliveryChannelsWrapper, .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-deliveryChannelsToggle { border-radius: 4px } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-deliveryChannelsWrapper { border: 1px solid var(--MutedFour); width: 100%; overflow: hidden; margin: 0 0 20px 0 } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-summaryChange { background: var(--ActionSecondary); border-color: var(--MutedFour); color: var(--ActionPrimary); } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-leanShippingGroupList { border-color: #eee; margin: 0 } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-option:hover, .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-leanShippingOptionActive, .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-leanShippingOption { background: #FFF !important } .orderform-template-holder .step.shipping-data .vtex-pickup-points-modal-3-x-modalDetailsBackLnk svg path, .orderform-template-holder .step.shipping-data .vtex-pickup-points-modal-3-x-modalDetailsBackLnk { color: var(--MutedTwo); fill: var(--MutedTwo) } .orderform-template-holder .step.shipping-data .vtex-pickup-points-modal-3-x-primary { outline: none; background: var(--ActionPrimary); border-color: var(--ActionPrimary); } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-pickupPointChange { border-color: var(--ActionPrimary); } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-address p { clear: both; float: none; margin: 0 } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-address p.input.ship-checkboxNumberLabel.text { width: auto; align-self: flex-end; display: flex; align-items: center; margin-left: 10px !important; height: 40px } .orderform-template-holder .step.shipping-data input#ship-addressQuery { width: 100% } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-container.shp-pickup-receiver { display: block } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-container.shp-pickup-receiver svg.person-blue path { fill: var(--ActionPrimary); } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-container.shp-pickup-receiver .vtex-omnishipping-1-x-btn { color: var(--ActionPrimary); } @media (max-width: 490px) { .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-dateLink { width: 100% } } .orderform-template-holder .step .submit.btn.btn-success, .orderform-template-holder .step .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a.submit.btn-success, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .orderform-template-holder .step a.submit.btn-success, .orderform-template-holder .step #payment-data .payment-discounts-list table td.action a.submit.btn-success, .orderform-template-holder #payment-data .payment-discounts-list table td.action .step a.submit.btn-success { display: block; margin: 20px auto 0 auto; min-width: 55% } .orderform-template { display: flex !important; padding-top: 0px; min-height: 400px !important; align-items: flex-start } @media (max-width: 1024px) { .orderform-template { flex-wrap: wrap } } .orderform-template .orderform-template-holder { width: 100% } @media (min-width: 1025px) { .orderform-template .orderform-template-holder { width: 61% !important; padding-right: 20px; max-width: calc(100% - 271px); float: left; box-sizing: border-box } } @media (max-width: 1024px) { .orderform-template { width: 100%; padding-top: 0px } } .orderform-template .cart-template.mini-cart { width: 39%; min-width: 255px; position: -webkit-sticky; position: -moz-sticky; position: -o-sticky; position: -ms-sticky; position: sticky; bottom: 0px; top: 20px; right: 0; float: right; margin: 0 } @media (max-width: 1024px) { .orderform-template .cart-template.mini-cart { width: 100%; position: relative; top: 0 } } .orderform-template .cart-template.mini-cart .cart-items>.v-custom-indexed-item { display: none !important } .orderform-template .cart-template.mini-cart .cart-fixed { height: auto !important; position: relative !important; max-width: 100%; width: 100% !important; top: 0; min-height: initial } @media (min-width: 1025px) { .orderform-template .cart-template.mini-cart .cart-fixed.affix-top { position: relative !important } } .orderform-template .cart-template.mini-cart h2 { text-align: left; border-top: none; background: none !important; margin-bottom: 15px } .orderform-template .cart-template.mini-cart .quantity { min-width: 10px; width: auto; height: 10px; display: inline-block; background: var(--ActionSecondary); color: var(--ActionPrimary); } .orderform-template .cart-template.mini-cart .summary-template-holder { width: 100%; background: none; border: none; padding: 0 } .orderform-template .cart-template.mini-cart .summary-template-holder .accordion-inner { margin-top: 0px } .orderform-template .cart-template.mini-cart .summary-template-holder .summary>.summary-coupon-wrap, .orderform-template .cart-template.mini-cart .summary-template-holder .summary-coupon-wrap>.summary-coupon { display: block !important } .orderform-template .cart-template.mini-cart .summary-template-holder .summary-coupon p { margin: 0 } .orderform-template .cart-template.mini-cart .summary-template-holder .summary>.summary-coupon-wrap { border-top: 1px solid var(--MutedFour); padding: 8px 0 } .orderform-template .cart-template.mini-cart .summary-template-holder input[type=text], .orderform-template .cart-template.mini-cart .summary-template-holder button[type=submit], .orderform-template .cart-template.mini-cart .summary-template-holder p.coupon-fields span.info>span { line-height: 30px !important; height: 30px !important } .orderform-template .cart-template.mini-cart .item { padding: 10px 0; margin: 0; border: none; border-bottom: 1px solid #eee } .orderform-template .cart-template.mini-cart .item:last-child { border: none } .orderform-template .cart-template.mini-cart .item ul.service-list.unstyled { margin: 0; float: none; width: 100%; background: none; display: inline-block; clear: both } .orderform-template .cart-template.mini-cart .item .service-item, .orderform-template .cart-template.mini-cart .item.v-custom-indexed-item { background: var(--ActionSecondary); border: 1px dashed var(--MutedFour); border-radius: 4px; width: 100%; display: flex; align-items: center; justify-content: space-between; box-sizing: border-box; padding: 5px 10px; margin: 10px 0 0 0 } .orderform-template .cart-template.mini-cart .item .service-item .description, .orderform-template .cart-template.mini-cart .item.v-custom-indexed-item .description { margin-top: 0 } .orderform-template .cart-template.mini-cart .item .service-item>a, .orderform-template .cart-template.mini-cart .item .service-item .quantity, .orderform-template .cart-template.mini-cart .item .service-item .shipping-date, .orderform-template .cart-template.mini-cart .item .service-item .item-subscription, .orderform-template .cart-template.mini-cart .item.v-custom-indexed-item>a, .orderform-template .cart-template.mini-cart .item.v-custom-indexed-item .quantity, .orderform-template .cart-template.mini-cart .item.v-custom-indexed-item .shipping-date, .orderform-template .cart-template.mini-cart .item.v-custom-indexed-item .item-subscription { display: none } .orderform-template .cart-template.mini-cart .item .service-item .price, .orderform-template .cart-template.mini-cart .item.v-custom-indexed-item .price { margin: 0 } .orderform-template .cart-template.mini-cart .item .service-item:last-child, .orderform-template .cart-template.mini-cart .item.v-custom-indexed-item:last-child { margin-bottom: 0 } .orderform-template .cart-template.mini-cart .item.v-custom-indexed-item .item-unavailable { display: none } .orderform-template .cart-template.mini-cart .item .fn { width: calc(82% - 20px) } .orderform-template .cart-template.mini-cart .item .description { display: flex; justify-content: space-between } .orderform-template .cart-template.mini-cart .item .price, .orderform-template .cart-template.mini-cart .item span.shipping-date { white-space: nowrap } .orderform-template .cart-template.mini-cart .item .url { border-radius: 4px; overflow: hidden } .orderform-template .cart-template.mini-cart .summary-totalizers { margin-bottom: 0 } .orderform-template .cart-template.mini-cart #go-to-cart-button { position: absolute; top: -13px; right: 7px; color: var(--ActionPrimary); text-decoration: underline } .orderform-template .cart-template.mini-cart .summary-totalizers tbody { border-top: 1px solid var(--MutedFour); border-bottom: 1px solid var(--MutedFour); padding: 14px 0; display: block } .orderform-template .cart-template.mini-cart .summary-totalizers tbody tr.CustomTax:not(.CustomTax--total) { display: none !important } .orderform-template .cart-template.mini-cart .summary-totalizers tbody td { display: inline-block; text-align: left !important; width: auto; color: #666; font-size: 13px; padding: 0 0 3px 0 !important } .orderform-template .cart-template.mini-cart .summary-totalizers tbody td.monetary { text-align: right !important; margin-left: auto; float: right } .orderform-template .cart-template.mini-cart .summary-totalizers tbody+tbody { border-top: none } .orderform-template .cart-template.mini-cart .summary-totalizers tbody.shipping-reset, .orderform-template .cart-template.mini-cart .summary-totalizers tbody.shipping-calculate { display: none !important } .orderform-template .cart-template.mini-cart .summary-totalizers tfoot tr td { padding: 14px 0 !important; color: #000; font-size: 14px; font-weight: bold; text-align: left } .orderform-template .cart-template.mini-cart .summary-totalizers tfoot tr td.monetary { text-align: right !important; margin-left: auto; float: right; color: var(--ActionPrimary); } .orderform-template .cart-template.mini-cart .cart { margin-bottom: 0; max-height: calc(100vh - 355px); overflow: auto } .orderform-template .cart-template.mini-cart .cart::-webkit-scrollbar { width: 6px } .orderform-template .cart-template.mini-cart .cart::-webkit-scrollbar-track { background: transparent; border-radius: 4px } .orderform-template .cart-template.mini-cart .cart::-webkit-scrollbar-thumb { background: var(--MutedFour); border-radius: 30px } .orderform-template .cart-template.mini-cart .cart:hover::-webkit-scrollbar-thumb { background: #eee } .orderform-template .cart-template.mini-cart .cart .cart-items:not(.v-loaded) { max-height: 100px; overflow: hidden } .orderform-template .cart-template.mini-cart .cart .cart-items:not(.v-loaded) li.item { overflow: hidden; position: relative; border: none !important } .orderform-template .cart-template.mini-cart .cart .cart-items:not(.v-loaded) li.item>* { opacity: 0 } .orderform-template .cart-template.mini-cart .cart .cart-items:not(.v-loaded) li.item:after { content: ""; width: 100%; height: 100%; display: block; top: 0px; left: 0; position: absolute } .orderform-template .payment-confirmation-wrap { border: none; padding: 0 } .orderform-template .payment-confirmation-wrap .payment-submit-wrap { margin: 10px 0 0 0 } @media (max-width: 1024px) { .orderform-template .payment-confirmation-wrap .payment-submit-wrap { z-index: 9999; position: static; bottom: 0; width: 100%; left: 0; padding: 0; background: #FFF; margin: 0 !important } .orderform-template .payment-confirmation-wrap .payment-submit-wrap button { border-radius: 0 !important } } @media (max-width: 1024px) { .orderform-template .payment-confirmation-wrap { border: none !important } .orderform-template .payment-confirmation-wrap .payment-submit-wrap, .orderform-template .payment-confirmation-wrap button { margin: 0 !important } } .orderform-template .payment-confirmation-wrap #payment-data-submit:disabled span { display: none } .orderform-template .summary-note { display: none !important } .orderform-template .summary-note p.note-data { display: none !important } .orderform-template .summary-note>div { display: block !important } .orderform-template .summary-note .note-textarea { height: 50px; line-height: 20px; max-width: 100%; width: 100%; font-family: var(--fontFamily); max-height: 100px } .orderform-template .custom-cart-template-wrap { position: relative; background: #FFF; padding: 17px 20px; text-align: left; box-sizing: border-box; border-radius: 4px; border: none } .orderform-template .custom-cart-template-wrap .summary-cart-template-holder { height: auto !important } .orderform-template .custom-cart-template-wrap .summary-template-holder { margin-top: 0 } .step.client-profile-data.active .box-step .form-step[style*="display: block"], .step.shipping-data.active .accordion-inner.shipping-container, #payment-data .box-step form.form-step { display: flex; flex-direction: column; padding-top: 20px !important } .orderform-template-holder #shipping-data .shipping-summary-info, .orderform-template-holder .step .accordion-body p.notification, .client-pre-email+.client-profile-data .accordion-body:before { display: none } body.v-custom-step-shipping #shipping-data .shipping-summary-info, body.v-custom-step-payment #shipping-data .shipping-summary-info { display: block } .steps-view, .gift-card-section, .App.iframe-credit-card-payment-group { background: #FFF } #app-container { min-height: 100vh; background: #FFF } #app-container input[type=text], #app-container input[type=tel], #app-container input[type=email], #app-container select { width: 100% } #app-container span.help.error { margin: 0 !important; display: none } #app-container .SecurityEnvironmentIcon { margin-bottom: 20px; display: none } #app-container .CardForm>div { position: relative; clear: both } #app-container .CardForm .PaymentValue { display: none } #app-container .CardForm input#creditCardpayment-card-0Number[value=""] { background: #FFF; position: relative; z-index: 1 } #app-container .CardForm .SavedCardsList { width: calc(100% - 1px) } #app-container .CardForm .SavedCard .link-delete { right: 8px; top: 50%; margin-top: -10px; border: 1px solid #ccc; background: #FFF; width: 20px; height: 20px; line-height: 17px } #app-container .FormFieldLabel { line-height: 30px } #app-container .PaymentCardFlags { display: none !important; } #app-container .PaymentCardFlags .card-flag-label input { display: none } #app-container .PaymentCardFlags .card-flag-label { width: auto } #app-container .PaymentCardFlags .card-flag { opacity: 0.7; display: none } #app-container .PaymentCardFlags .card-flag.card-selected { opacity: 1; display: block } #app-container input#creditCardpayment-card-0Code, #app-container input#creditCardpayment-card-1Code { width: 100px !important } #app-container .label-vertical-group { padding: 9px } #app-container .label-vertical-group:hover { color: var(--ActionPrimary); } #app-container .label-vertical-group.active { color: var(--ActionPrimary); background: var(--ActionSecondary); } #app-container .label-vertical-group:not(.SavedCard) .card-flag { position: absolute; left: 5px; top: 8px } #app-container .label-vertical-group .icon-ok-circle, #app-container .label-vertical-group .icon-circle-blank { top: 9px } #app-container .label-vertical-group.UseAnotherCard { background-color: #eee; padding: 4px; font-size: 11px; text-decoration: underline } #app-container .label-vertical-group.UseAnotherCard #use-another-card { color: var(--MutedTwo) } #app-container .label-vertical-group.UseAnotherCard:hover #use-another-card { text-decoration: underline; color: #999 } #app-container label.FormFieldLabel { display: block; clear: both; width: auto; margin-right: 10px } #app-container .AddressForm { display: flex; flex-wrap: wrap } #app-container .AddressForm>* { width: 100%; order: 10 } #app-container .AddressForm input { max-width: 100% } #app-container .AddressForm .payment-billing-address-street { order: 1 } #app-container .AddressForm .payment-billing-address-complement { order: 2 } #app-container .AddressForm .payment-billing-address-city { order: 3 } #app-container .AddressForm .payment-billing-address-state { order: 4 } #app-container .AddressForm .PostalCode { order: 5 } .orderform-template .summary-note.js-active { display: block !important } body.js-vcustom-showNoteField .orderform-template .payment-confirmation-wrap { display: block !important } body.js-vcustom-showNoteField .orderform-template .payment-confirmation-wrap .payment-submit-wrap { display: none } body.js-vcustom-showNoteField .orderform-template .summary-note { display: block !important } body.js-vcustom-showNoteField.v-custom-step-payment .orderform-template .payment-confirmation-wrap .payment-submit-wrap { display: block !important } .summary-coupon fieldset.coupon-fieldset .vcustom-showCustomMsgCoupon { border: 1px dashed var(--Warning); padding: 1px; font-size: 11px; background: var(--WarningFaded); border-radius: 4px; margin-top: 4px !important; clear: both } .vcustom-customTax-tot { display: inline-block; position: relative; margin-left: 5px } .vcustom-customTax-tot>span { background: #eee; width: 15px; height: 15px; line-height: 15px; display: inline-block; border-radius: 100%; text-align: center; cursor: pointer } .vcustom-customTax-tot:hover .vcustom-customTax-resume { display: block } .vcustom-customTax-resume { position: absolute; left: calc(100% + 10px); width: 128px; background: #eee; top: 50%; font-size: 11px; padding: 10px; transform: translateY(-50%); display: none } .vcustom-customTax-resume__i { display: flex; justify-content: space-between; margin: 0 } .vcustom-customTax-resume:before { content: ""; display: block; position: absolute; left: -4px; top: calc(50% - 4px); width: 0; height: 0; border: 0 solid transparent; border-top-width: 4px; border-bottom-width: 4px; border-right: 4px solid #eee } .v-custom-addLabels-active-flag { background: #FFF; color: var(--MutedOne); padding: 1px 4px; border-radius: 4px; display: inline-block; align-items: center; font-size: 11px; border: 1px solid var(--MutedFour) } .v-custom-addLabels-active-flag:before { content: ""; display: inline-block; width: 14px; height: 14px; background: url("//io.vtex.com.br/front-libs/bootstrap/2.3.2/img/glyphicons-halflings.png"); background-repeat: no-repeat; background-position: 0 -48px; margin-right: 4px; opacity: 0.9; vertical-align: middle } .v-custom-assemblies { margin: 10px 0 3px 0; overflow: hidden; border-top: 1px solid var(--MutedFour); padding-top: 7px } @media (max-width: 1024px) { .v-custom-assemblies { width: 100%; left: 0; margin-bottom: 2px } } .v-custom-assemblies p { display: none } .v-custom-assemblies__values { list-style: none; padding: 0; margin: 0 } .v-custom-assemblies__values__item strong:after { content: ":" } .v-custom-assemblies__values__item span, .v-custom-assemblies__values__item strong { line-height: 14px } body.v-custom-paymentBuilder-accordion .steps-view { display: none } #shipping-data .accordion-group.shipping-data:after { opacity: 0; transition: all ease 0.3s } .js-v-custom-is-loadAddress .vtex-omnishipping-1-x-warning { display: none !important } .js-v-custom-is-loadAddress #shipping-data .accordion-group.shipping-data:after { content: ""; display: block; opacity: 1; left: 0; top: 0; width: 100%; height: 20px; z-index: 2; margin: 0 0 20px 0; border-radius: 3px } .js-v-custom-is-loadAddress #postalCode-finished-loading+.mb5 { display: none !important } .vcustom--vtex-omnishipping-1-x-address { display: none } body.v-custom-addressForm-on.v-custom-step-shipping .vcustom--vtex-omnishipping-1-x-address { display: block } body.v-custom-addressForm-on.v-custom-step-shipping .v-custom-ship-info { display: flex } body.v-custom-addressForm-on.v-custom-step-shipping .v-custom-ship-info .ship-number { margin-right: 10px } body.v-custom-addressForm-on.v-custom-step-shipping .vtex-omnishipping-1-x-addressForm, body.v-custom-addressForm-on.v-custom-step-shipping .vtex-omnishipping-1-x-deliveryGroup, body.v-custom-addressForm-on.v-custom-step-shipping .vtex-omnishipping-1-x-submitPaymentButton { display: none } .vtex-omnishipping-1-x-submitShippingStepButton { margin: 20px 0 0 0 } body.v-custom-googleForm-on .vtex-omnishipping-1-x-deliveryGroup, body.v-custom-googleForm-on .vtex-omnishipping-1-x-addressForm, body.v-custom-googleForm-on .vtex-omnishipping-1-x-submitPaymentButton, body.v-custom-googleForm-on .vtex-omnishipping-1-x-btnDelivery { display: none } body.v-custom-googleForm-on .alert-noStreet { display: none } .v-custom-googleFormScript-added.v-custom-googleForm-on .accordion-inner.shipping-container>* { display: none } body.v-custom-fnsCustomAddressForm .accordion-inner.shipping-container { padding-top: 0 !important } body.v-custom-fnsCustomAddressForm .accordion-inner.shipping-container { transition: all ease 0.3s } body.v-custom-fnsCustomAddressForm .vtex-omnishipping-1-x-selectDeliveryText+div { margin: 0 !important } body.v-custom-fnsCustomAddressForm .orderform-template-holder p.vtex-omnishipping-1-x-submitPaymentButton.btn-submit-wrapper.btn-go-to-payment-wrapper { margin-bottom: 0 !important } body.v-custom-fnsCustomAddressForm .vtex-omnishipping-1-x-addressFormPart1 .input.ship-country, body.v-custom-fnsCustomAddressForm .vtex-omnishipping-1-x-addressFormPart1 .input.ship-addressQuery, body.v-custom-fnsCustomAddressForm .vtex-omnishipping-1-x-addressFormPart1 .input.ship-postalCode { display: none } body.v-custom-fnsCustomAddressForm.returningUser .vtex-omnishipping-1-x-addressFormPart1 .input.ship-postalCode { display: block } body.v-custom-fnsCustomAddressForm .vtex-omnishipping-1-x-container.shp-pickup-receiver+.vtex-omnishipping-1-x-shippingSectionTitle+#back-to-address-list+.vtex-omnishipping-1-x-addressFormPart1 p.input.ship-postalCode, body.v-custom-fnsCustomAddressForm .vtex-omnishipping-1-x-container.shp-pickup-receiver+.vtex-omnishipping-1-x-shippingSectionTitle+.vtex-omnishipping-1-x-addressFormPart1 p.input.ship-postalCode { display: block } body.v-custom-fnsCustomAddressForm .orderform-template-holder .step.shipping-data .box-step .vtex-omnishipping-1-x-addressFormPart1 { order: 1 } body.v-custom-fnsCustomAddressForm .pac-logo[style*="none"] { border: 0 } body.v-custom-fnsCustomAddressForm .pac-logo[style*="none"]:after { display: none } body.v-custom-fnsCustomAddressForm #shipping-data .accordion-inner+.vcustom--vtex-omnishipping-1-x-address { display: none } body.v-custom-fnsCustomAddressForm div#shipping-data { display: flex; flex-wrap: wrap } body.v-custom-fnsCustomAddressForm div#shipping-data>* { width: 100% } body.v-custom-fnsCustomAddressForm div#shipping-data .step.accordion-group.shipping-data { order: 1 } body.v-custom-fnsCustomAddressForm div#shipping-data .vcustom--vtex-omnishipping-1-x-address { order: 3 } .js-v-custom-is-loading .accordion-inner.shipping-container, .js-v-custom-is-loading .vcustom--vtex-omnishipping-1-x-address { overflow: hidden } .js-v-custom-is-loading .vcustom--vtex-omnishipping-1-x-address { height: 120px; position: relative } .js-v-custom-is-loading .vcustom--vtex-omnishipping-1-x-address:before { content: ""; display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 2 } .js-v-custom-is-loading .accordion-inner.shipping-container>*, .js-v-custom-is-loading .vcustom--vtex-omnishipping-1-x-address>* { opacity: 0.5 } .vcustom--vtex-omnishipping-1-x-address { transition: all ease 0.3s } .vcustom--vtex-omnishipping-1-x-address p.input { float: none; width: 100%; margin: 0 } .vcustom--vtex-omnishipping-1-x-address span.help.error { display: none } .vcustom--vtex-omnishipping-1-x-address input { max-width: initial; width: 100% } .vcustom--vtex-omnishipping-1-x-address input.error+span.help.error, .vcustom--vtex-omnishipping-1-x-address select.error+span.help.error { display: block } .vcustom--vtex-omnishipping-1-x-address__state { display: flex; margin: 0 -5px } .vcustom--vtex-omnishipping-1-x-address__state p.input { margin: 0 5px } @media (max-width: 1024px) { .vcustom--vtex-omnishipping-1-x-address__state { flex-wrap: wrap; margin: 0 } .vcustom--vtex-omnishipping-1-x-address__state p.input.ship-state { margin: 0 } } .pac-container.pac-logo { border: 1px solid var(--MutedFour); border-radius: 4px } .pac-logo:after { background: #fbfbfb url(https://developers.google.com/maps/documentation/images/powered_by_google_on_white.png) no-repeat 10px center; padding: 14px; background-size: 110px } .address-list.vtex-omnishipping-1-x-addressList+p.input.ship-addressQuery.text { display: none } .alert-noStreet { margin: 30px auto 0 auto; text-align: center } body.js-vcustom-hideEmailStep .orderform-template-holder #client-profile-data form.client-pre-email.client-pre-email { display: none !important } body.js-vcustom-hideEmailStep .client-profile-data .accordion-toggle>span:before { content: "1" } body.js-vcustom-hideEmailStep .shipping-data .accordion-toggle:before { content: "2" } body.js-vcustom-hideEmailStep .payment-data .accordion-toggle>span:not(.payment-edit-link):before { content: "3" } body.js-vcustom-hideEmailStep .client-pre-email+.client-profile-data .accordion-body .accordion-inner { display: block } .RTL-checkout select { direction: rtl } .RTL-checkout .cart-template-holder { order: 2 } .RTL-checkout body .main-header .header-link { left: initial; right: 0 } .RTL-checkout body .main-header .checkout-steps { margin-left: initial; margin-right: auto } .RTL-checkout .main-header .logo { order: 2 } .RTL-checkout .summary-template-holder tr .info { order: 2; text-align: right !important } .RTL-checkout .orderform-template-holder #client-profile-data form.client-pre-email .link-box-edit, .RTL-checkout .orderform-template-holder #client-profile-data .step.client-profile-data .link-box-edit, .RTL-checkout .orderform-template-holder #shipping-data .link-box-edit, .RTL-checkout .orderform-template-holder #payment-data .link-box-edit { right: initial; left: 0 } .RTL-checkout .summary-template-holder tbody td.monetary, .RTL-checkout .summary-template-holder tfoot tr td.monetary { margin-right: auto; margin-left: initial !important; text-align: left !important } .RTL-checkout .summary-template-holder .summary-coupon p.coupon-fields span { flex-direction: row-reverse } .RTL-checkout .summary-template-holder .summary-coupon p.coupon-fields span input { margin: 0 0 0 10px } .RTL-checkout .table.cart-items tbody tr .v-custom-product-item-wrap, .RTL-checkout .table.cart-items tbody tr, .RTL-checkout .table.cart-items thead tr, .RTL-checkout .table.cart-items thead tr th.product { flex-direction: row-reverse; text-align: right } .RTL-checkout .table.cart-items tbody tr td.product-name { text-align: right } .RTL-checkout .orderform-template .orderform-template-holder { order: 2; padding: 0 0 0 20px } .RTL-checkout .orderform-template .cart-template.mini-cart .summary-totalizers tfoot tr td.monetary { text-align: left !important } .RTL-checkout br { width: 100%; height: 1px; content: " " !important; display: block !important; clear: both } .RTL-checkout .table.cart-items td.quantity { direction: rtl } .RTL-checkout .checkout-steps_items { direction: rtl } .RTL-checkout .checkout-steps_items .text:before { margin: 0 0 0 7px } .RTL-checkout .srp-toggle__wrapper { direction: rtl } .RTL-checkout .srp-toggle__wrapper .vtex-shipping-preview-0-x-framePickup { left: 0 } .RTL-checkout .srp-toggle__wrapper .vtex-shipping-preview-0-x-frameDelivery { left: 50% } .RTL-checkout .srp-delivery-header.mb3 { direction: rtl; display: flex } .RTL-checkout .srp-delivery-current-many .flex { direction: rtl; text-align: right } .RTL-checkout .step { direction: rtl } .RTL-checkout .step .accordion-toggle>span:before, .RTL-checkout .step .accordion-toggle:before { margin-right: 0 !important; margin-left: 10px !important } .RTL-checkout fieldset.box-client-info-pf { display: flex; flex-wrap: wrap } .RTL-checkout .orderform-template-holder .step .form-step fieldset p, .RTL-checkout .orderform-template-holder .step .form-step fieldset div { width: 100% } .RTL-checkout p.client-first-name, .RTL-checkout p.client-different-document, .RTL-checkout p.client-document, .RTL-checkout p.client-company-ie, .RTL-checkout p.client-company-postal-code, .RTL-checkout p.client-document-type, .RTL-checkout p.payment-card-due-date { margin-left: 10px; margin-right: 0 } .RTL-checkout p.client-document, .RTL-checkout p.client-phone, .RTL-checkout p.client-company-document, .RTL-checkout p.client-company-ie, .RTL-checkout p.client-company-postal-code, .RTL-checkout p.client-company-phone, .RTL-checkout p.payment-card-due-month, .RTL-checkout p.payment-card-lash, .RTL-checkout p.payment-card-due-year { float: right } .RTL-checkout input.success:not([invalid="true"]) { background-position: left top } .RTL-checkout .vtexIdUI .vtexIdUI-page { direction: rtl } .RTL-checkout .vtexIdUI .modal-header .close { left: -1px; right: initial } .RTL-checkout .vtexIdUI .pull-left { float: right } .RTL-checkout .orderform-template-holder .step .box-info p { display: flex; flex-wrap: wrap; width: 100% } .RTL-checkout .vtex-omnishipping-1-x-leanShippingIcon.shp-option-icon, .RTL-checkout .vtex-omnishipping-1-x-addressItemIcon { margin: 0 0 0 10px } .RTL-checkout .vtex-omnishipping-1-x-leanShippingText { padding-right: 10px } .RTL-checkout .address-summary { display: flex; flex-wrap: wrap } .RTL-checkout br.line1-delimiter { width: 100%; height: 1px; content: " " !important; display: block !important; clear: both } .RTL-checkout .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item#payment-group-AffirmPaymentGroup:after, .RTL-checkout .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item#payment-group-payPalPaymentGroup:after { right: initial; left: 10px } .RTL-checkout .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item-text { margin-left: auto; margin-right: inherit } .RTL-checkout .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item-text:before { margin-right: initial; margin-left: 10px } .RTL-checkout .orderform-template-holder #payment-data p.link.link-gift-card a { text-align: right } .RTL-checkout .orderform-template .custom-cart-template-wrap .summary-cart-template-holder { direction: rtl } .RTL-checkout .pull-right { float: left !important } .RTL-checkout .orderform-template .cart-template.mini-cart .item .price { margin-right: auto; direction: initial } .RTL-checkout .orderform-template .cart-template.mini-cart .item .url { float: right; margin: 0 0 0 6px } .RTL-checkout .orderform-template .cart-template.mini-cart .item .fn { text-align: right; float: right } .RTL-checkout .orderform-template .cart-template.mini-cart h2 { text-align: right } .RTL-checkout .orderform-template .cart-template.mini-cart #go-to-cart-button { left: 7px; right: initial } .RTL-checkout .vtex-omnishipping-1-x-SummaryItemInfo { border: none; border-left: 1px solid #eee; padding: 0 0 0 6px } .RTL-checkout .vtexIdUI .vtexIdUI-page { direction: rtl } .RTL-checkout .vtexIdUI .modal-header .close { left: -1px; right: initial } .RTL-checkout .vtexIdUI .pull-left { float: right } .RTL-checkout #app-container { direction: rtl } .RTL-checkout #app-container .PaymentCardDueDate.clearfix { display: flex } .RTL-checkout #app-container label.FormFieldLabel { margin: 0 0 0 10px } .RTL-checkout #app-container .PaymentCardCVV { display: flex } .RTL-checkout #app-container p.AddressToggle { display: flex } .RTL-checkout #app-container .AddressToggle input { margin: 3px 0 0 5px } @media (max-width: 1024px) { .RTL-checkout.body-cart-vertical .summary-template-holder { order: 2 } } @media (max-width: 1024px) { .RTL-checkout .orderform-template .cart-template.mini-cart { order: 2 } } @media (max-width: 1024px) { .RTL-checkout .table.cart-items td.product-image a { margin-right: 0; margin-left: 20px } .RTL-checkout .full-cart .cart table tbody tr td.product-image, .RTL-checkout .full-cart .cart table tbody tr td.bundle-item-image { left: initial; right: 0 } .RTL-checkout .table.cart-items td.product-name, .RTL-checkout .table.cart-items td.quantity { margin-left: 0 !important; margin-right: 90px !important } .RTL-checkout .table.cart-items td.quantity { float: right } .RTL-checkout .full-cart .cart table tbody tr td.product-name a, .RTL-checkout .full-cart .cart table tbody tr td.bundle-item-name span { padding: 0 0 0 20px } .RTL-checkout .full-cart .cart table tbody tr td.product-price { float: left } .RTL-checkout .full-cart .cart table tbody tr td.item-remove { left: 0; right: initial } } body.debug-on>*:not(.container-main):not(.main-header):not(.main-footer):not(#vtexIdContainer):not(.vtex-front-messages-placeholder):not(.pac-container) { display: none } [data-days] { font-size: 0px !important; } [data-days]::before { content: attr(data-days); font-weight: bold; font-size: 13px; } /* source: */ .hm-nc-breadcrum { text-transform: uppercase; } .hm-nc-breadcrum-base { font-family: 'HM-Slussen-Extended-Semibold'; color: var(--Hmgray) !important; font-weight: 600; } .hm-nc-breadcrum .hm-nc-breadcrum-base:hover { text-decoration: none; color: var(--ActionPrimaryDark) !important; } .hm-nc-social-media { display: none; } .hm-nc-footer { display: flex; flex-direction: column; gap: 50px; padding: 20px 15px; } .hm-nc-breadcrum-link { font-family: 'HM-Slussen-Extended-Regular'; font-weight: 400; color: var(--Hmblack); } .hm-nc-breadcrum-link:hover, .hm-nc-breadcrum-link:focus { color: var(--Hmblack); text-decoration: none; } .hm-nc-country-change { display: none !important; gap: 10px; } .hm-nc-country-change p, .hm-nc-country-change a { font-family: 'HM-Slussen-Extended-Regular'; color: var(--Hmblack); } .hm-nc-country-change a { font-family: 'HM-Slussen-Extended-Semibold'; font-weight: 600; } .hm-nc-social-media-image-container { width: 56px; display: flex; height: 56px; justify-content: center; align-items: center; } .hm-nc-last-container { display: flex; flex-direction: column; gap: 40px; } .hm-nc-legal-custom-copy { padding: 20px 24px; } .hm-nc-legal p, .hm-nc-legal-custom-copy p { font-size: 11px; margin-bottom: 0; } @media (min-width: 1260px) { .hm-nc-last-container { gap: 0px; flex-direction: row-reverse; align-items: center; } .hm-nc-footer { padding: 20px 24px; } .hm-nc-main-header .container { width: 100%; max-width: unset; } } .hm-nc-footerBlock-logo { display: none; } .footerBlock-container { padding: 20px 24px; background-color: white; display: flex; flex-direction: column; } .footerBlock-links-container { justify-content: space-between; width: 100%; display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-gap: 0; margin-bottom: 85px; } .footerBlock-logo-container { display: flex; justify-content: flex-start; width: 100%; margin-top: 2rem; margin-bottom: 25px; } .footerBlock-title { line-height: 1.3; font-size: 14px !important; font-weight: 600 !important; padding-bottom: 8px !important; color: black !important; } .footerBlock-region-selector-container { display: flex; justify-content: flex-start; width: 100%; margin-top: 1rem; gap: 1rem; align-items: center; margin-bottom: 43px; } .footerBlock-copyright p { font-size: 12px; font-family: 'HM-Slussen-Regular'; color: #171a1c; } #change-region-link { text-decoration: underline; cursor: pointer; } .footerBlock-logo { width: 60px; } .footerBlock-links li { list-style: none; margin-left: 0px; line-height: 1.3; font-size: 14px; text-decoration: none; font-weight: 400; text-transform: uppercase; color: #000; padding: 0; margin-bottom: 8px; } .footerBlock-links { margin-left: 0 !important; } @media (max-width: 1260px) { .footerBlock-column.active .footerBlock-links .img-pci-dss-footer { display: inline-block; margin-top: 8px; } .hm-nc-legal-custom-copy { padding: 16px; } .hm-nc-footer { padding: 20px 16px; } .hm-nc-legal-custom-copy { padding: 16px 16px; } .footerBlock-container { padding: 23px 16px; padding-bottom: 2px; } .footerBlock-links-container { flex-direction: column; display: flex !important; margin-bottom: 15px; } .footerBlock-column { margin-bottom: 0; } .footerBlock-links { padding-left: 0px !important; padding-right: 9px !important; } body .footerBlock-title { padding-left: 0px !important; padding-right: 9px; padding: 1rem; text-transform: uppercase !important; cursor: pointer; display: flex; justify-content: space-between; align-items: center; font-weight: 100 !important; } .footerBlock-title::after { font-size: 1.5rem; width: 16px; height: 16px; display: block; content: ""; background-repeat: no-repeat; background-position: 0 0; background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTciIHZpZXdCb3g9IjAgMCAxNiAxNyIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTguNzUgNy43NVYwLjVINy4yNVY3Ljc1SDBWOS4yNUg3LjI1VjE2LjVIOC43NVY5LjI1SDE2VjcuNzVIOC43NVoiIGZpbGw9ImJsYWNrIi8+Cjwvc3ZnPgo=); } .footerBlock-links { display: none; padding: 1rem; } .footerBlock-column.active .footerBlock-links { display: block; } .footerBlock-column.active .footerBlock-title { font-weight: 700 !important; } .footerBlock-column.active .footerBlock-title::after { width: 16px; height: 16px; display: block; content: ""; background-repeat: no-repeat; background-position: 0 0; background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTciIHZpZXdCb3g9IjAgMCAxNiAxNyIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0wIDcuNzVIMTZWOS4yNUgwVjcuNzVaIiBmaWxsPSIjNTU1NTU1Ii8+Cjwvc3ZnPgo=); } } .footerBlock-bottom-container { display: flex; justify-content: space-between; align-items: center; padding: 1rem 0; margin-bottom: 9px; } .footerBlock-social-media { display: flex; gap: 24px; } .footerBlock-social-media a img { width: 24px; height: 24px; } .hm-nc-legal, .hm-nc-footer-logo { display: none !important; } @media (max-width: 495px) { .footerBlock-bottom-container { display: flex; flex-direction: column-reverse; align-items: baseline; gap: 40px; margin-bottom: 0px; } } .libro-reclamaciones-link { position: relative; padding-left: 22px !important; } .libro-reclamaciones-link:before { content: ""; background-image: url(https://hmchile.vtexassets.com/assets/vtex/assets-builder/hmchile.store-template/0.7.211/images/libro-reclamaciones___f4ec4a5%E2%80%A6.svg); background-size: contain; background-repeat: no-repeat; width: 16px; height: 16px; display: inline-block; position: absolute; left: 0; top: 50%; transform: translateY(-50%); } .img-pci-dss-footer { font-size: 0 !important; line-height: 0; display: inline-block; width: 138px; height: 92px; position: relative; overflow: hidden; } .img-pci-dss-footer::after { content: ""; position: absolute; inset: 0; background-image: url(https://hmecuador.vtexassets.com/arquivos/securityPatch.png); background-size: contain; background-repeat: no-repeat; background-position: 50%; pointer-events: none; } /* header */ .main-header, .container.footer { display: none !important; } .hm-nc-main-header, .hm-nc-footer { display: block !important; } .hm-nc-main-header { height: 72px; } .hm-nc-main-header .container, .hm-nc-main-header-items { height: 100%; } .hm-nc-main-header-items .hm-nc-main-menu a { font-family: 'HM-Slussen-Extended-Semibold'; font-weight: 600; color: var(--Hmgray); font-size: 12px; } .hm-nc-main-header-items .hm-nc-main-menu a:hover { font-weight: bold; color: var(--Hmblack); text-decoration: none; } .hm-nc-main-header-items { position: relative; display: flex; justify-content: space-between; align-items: center; } .hm-nc-main-header-items .hm-nc-logo { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 0; } .hm-nc-main-header-items .hm-nc-main-menu { display: flex; gap: 30px; align-items: center; margin-left: auto; } .hm-nc-main-header #go-to-cart-button { position: static; display: inline-flex; width: auto; max-width: none; margin: 0; padding: 0 0 0 24px; background: transparent; text-align: left; z-index: 1; } .hm-nc-main-header #go-to-cart-button a, .hm-nc-main-header #go-to-cart-button a:hover, .hm-nc-main-header #go-to-cart-button a:focus { display: inline-flex; align-items: center; gap: 8px; color: #000; font-size: 14px; text-transform: uppercase; line-height: 1; outline: none !important; } .hm-nc-step-title { font-size: 32px; font-weight: bold; text-transform: uppercase; padding: 10px 15px; font-family: 'HM-Slussen-Expanded-Bold'; color: var(--Hmblack); } @media (max-width: 1024px) { .hm-nc-main-header #go-to-cart-button .go-to-cart-text { display: none; } .hm-nc-main-header #go-to-cart-button a { gap: 0; } } @media (min-width: 1025px) { .hm-nc-step-title { width: 100%; max-width: unset; box-sizing: border-box; padding: 0px 24px 10px; margin: 38px 0 0; font-size: 24px; } .hm-nc-main-header .container { width: 100%; max-width: unset; } .hm-nc-main-header-items { gap: 60px; justify-content: space-between; } } /* [HMDCP-3414] - Compact sticky nav-bar para el titulo Cart Mobile. */ .hm-nc-step-title { transition: font-size 200ms ease, padding 200ms ease; } .hm-nc-sticky-sentinel { height: 1px; width: 100%; pointer-events: none; visibility: hidden; } @media (max-width: 1024px) { body.v-custom-step-cart.is-sticky-compact .hm-nc-step-title { position: fixed; top: 0; left: 0; right: 0; z-index: 999; padding: 12px 16px; font-size: 16px; text-align: center; background: #fff; border-bottom: 1px solid #e5e5e5; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04); margin: 0; /* Ajuste manual: base es HM-Slussen-Expanded-Bold; compact usa Regular para legibilidad a 16px. */ font-family: "HM-Slussen-Extended-Regular"; font-weight: normal; } } /* COLORES DEL MENU DE CHECKOUT UI*/ /* HM-Slussen */ @font-face { font-family: 'HM-Slussen-Regular'; src: url('https://hmchile.vtexassets.com/arquivos/HM-Slussen-Regular.otf.css') format('opentype'); font-weight: normal; font-style: normal; } @font-face { font-family: 'HM-Slussen-Extended-Semibold'; src: url('https://hmchile.vtexassets.com/arquivos/HM-Slussen-Extended-Semibold.otf.css') format('opentype'); font-weight: normal; font-style: normal; } @font-face { font-family: 'HM-Slussen-Condensed-Regular'; src: url('https://hmchile.vtexassets.com/arquivos/HM-Slussen-Condensed-Regular.otf.css') format('opentype'); font-weight: normal; font-style: normal; } @font-face { font-family: 'HM-Slussen-Expanded-Bold'; src: url('https://hmchile.vtexassets.com/arquivos/HM-Slussen-Expanded-Bold.otf.css') format('opentype'); font-weight: bold; font-style: normal; } @font-face { font-family: 'HM-Slussen-Expanded-Headline-Bold'; src: url('https://hmchile.vtexassets.com/arquivos/HM-Slussen-Expanded-Headline-Bold.otf.css') format('opentype'); font-weight: bold; font-style: normal; } @font-face { font-family: 'HM-Slussen-Extended-Headline-Regular'; src: url('https://hmchile.vtexassets.com/arquivos/HM-Slussen-Extended-Headline-Regular.otf.css') format('opentype'); font-weight: normal; font-style: normal; } @font-face { font-family: 'HM-Slussen-Extended-Headline-Semibold'; src: url('https://hmchile.vtexassets.com/arquivos/HM-Slussen-Extended-Headline-Semibold.otf.css') format('opentype'); font-weight: 600; font-style: normal; } @font-face { font-family: 'HM-Slussen-Extended-Regular'; src: url('https://hmchile.vtexassets.com/arquivos/HM-Slussen-Extended-Regular.otf.css') format('opentype'); font-weight: normal; font-style: normal; } @font-face { font-family: 'HM-Slussen-Semibold'; src: url('https://hmchile.vtexassets.com/arquivos/HM-Slussen-Semibold.otf.css') format('opentype'); font-weight: 600; font-style: normal; } :root { --Base: #FAF9F8; /*Background color */ --Success: #000000; /* Botones de envio */ --SuccessDarker: #494949; /* Hover Botones de envio */ --ActionPrimary: #191919; /* Color primario del formulario, incluyendo fuentes y precio. */ --ActionSecondary: #EFEFEF; /* Color secundario, enfocado al backgrond de envio, resumen de compra*/ --ActionPrimaryDark: #515151; /* Hover de botones primarios como añadir o volver al carrito*/ --Danger: #E50010; --HmSale: #E50010; /* Rojo de marca H&M para precios y montos con descuento (HMDCP-3411) */ --Warning: #E50010; /* Background de cupon de descuento no disponible */ --WarningFaded: #F4422B; --MutedOne: #323232; /* Color de fuente de los main-title e informacion al llenar los formularios*/ --MutedTwo: #676767; /* Color del texto en la seccion de cupones */ --MutedFour: #CBCBCB; /* Color de borde en resumen de compra y opciones de pago*/ --MutedFive: #F3F3F3; /* Background color de las opciones de compra.*/ --fontFamily: "HM-Slussen-regular", sans-serif; /* Fuente del formulario.*/ --maxWidth: 980px; /* Max width de la clase .container del checkout */ --width: calc(100% - 40px); /* Width de la clase .container del checkout */ --Hmblack: #000000; --Hmgray: #757575; --base-text-disabled: #666666; --green-border: #008744; --border-gray: #D9D9D9; } .phone-box { display: block; } .checkEmailAuthConflict__modal, .checkEmailAuthConflict__modal--bg { position: fixed; width: 100%; height: 100%; top: 0; left: 0; z-index: 99999; } .checkEmailAuthConflict__modal--bg { background: #000; opacity: 0.4; } .checkEmailAuthConflict__modal--wrap { width: 400px; background: #fff; position: fixed; left: calc(50% - 200px); top: 50%; transform: translateY(-50%); z-index: 99999; padding: 30px; border-radius: 3px; box-sizing: border-box; color: #333333; background: #fff; box-shadow: 0 5px 0 #ddd; border-bottom: 1px solid #fff; border-radius: 4px; border: 2px solid #eee; } button.checkEmailAuthConflict__modal--button { background: var(--ActionPrimary); padding: 10px; display: inline-block; border: none; border-radius: 3px; color: #fff; } .checkEmailAuthConflict__modal--button.js-loading:after { border: 3px solid var(--MutedFive); /* Light grey */ border-top: 3px solid #9999; /* Blue */ border-radius: 50%; width: 10px; height: 10px; animation: spin 1s linear infinite; content: ''; display: inline-block; margin-left: 8px; vertical-align: middle; } h4.checkEmailAuthConflict__modal--title { font-size: 16px; font-weight: bold; color: #000; } p.checkEmailAuthConflict__modal--text { margin-bottom: 20px; } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } /* source: */ input, select, button { outline: none !important } #vtexIdContainer input, .table.cart-items tr.item-attachments-content input, .table.cart-items tr.item-attachments-content select, .table.cart-items tbody tr td .product-service select, .table.cart-items td.quantity input, .summary-template-holder .summary-coupon fieldset.coupon-fieldset input[type="text"], .summary-template-holder .summary-coupon fieldset.coupon-fieldset button[type="submit"], .cart-more-options .srp-container select, .cart-more-options .srp-container input[type=text]:not(.pac-target-input), .cart-more-options .srp-container .vtex-shipping-preview-0-x-addressFormPart1.vtex-shipping-preview-0-x-geolocation input, .orderform-template-holder #client-profile-data form.client-pre-email input[type=text]:not(.pac-target-input), .orderform-template-holder #client-profile-data form.client-pre-email input[type=tel]:not(.pac-target-input), .orderform-template-holder #client-profile-data form.client-pre-email input[type=email]:not(.pac-target-input), .orderform-template-holder #client-profile-data form.client-pre-email select:not(.pac-target-input), .orderform-template-holder #client-profile-data .step.client-profile-data input[type=text]:not(.pac-target-input), .orderform-template-holder #client-profile-data .step.client-profile-data input[type=tel]:not(.pac-target-input), .orderform-template-holder #client-profile-data .step.client-profile-data input[type=email]:not(.pac-target-input), .orderform-template-holder #client-profile-data .step.client-profile-data select:not(.pac-target-input), .orderform-template-holder #shipping-data input[type=text]:not(.pac-target-input), .orderform-template-holder #shipping-data input[type=tel]:not(.pac-target-input), .orderform-template-holder #shipping-data input[type=email]:not(.pac-target-input), .orderform-template-holder #shipping-data select:not(.pac-target-input), .orderform-template-holder #payment-data input[type=text]:not(.pac-target-input), .orderform-template-holder #payment-data input[type=tel]:not(.pac-target-input), .orderform-template-holder #payment-data input[type=email]:not(.pac-target-input), .orderform-template-holder #payment-data select:not(.pac-target-input), .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-addressFormPart1.vtex-omnishipping-1-x-geolocation input, .orderform-template .summary-note .note-textarea, #app-container input[type=text], #app-container input[type=tel], #app-container input[type=email], #app-container select, .vcustom--vtex-omnishipping-1-x-address input { height: 28px; line-height: 28px; max-height: initial; display: inline-block; padding: 0px 10px; border-radius: 0; border: 1px solid #D9D9D9; outline: initial; font-family: "HM-Slussen-regular", sans-serif; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; } #vtexIdContainer input.error, .table.cart-items tr.item-attachments-content input.error, .table.cart-items tr.item-attachments-content select.error, .table.cart-items tbody tr td .product-service select.error, .table.cart-items td.quantity input.error, .summary-template-holder .summary-coupon fieldset.coupon-fieldset input.error[type="text"], .summary-template-holder .summary-coupon fieldset.coupon-fieldset button.error[type="submit"], .cart-more-options .srp-container select.error, .cart-more-options .srp-container input.error[type=text]:not(.pac-target-input), .cart-more-options .srp-container .vtex-shipping-preview-0-x-addressFormPart1.vtex-shipping-preview-0-x-geolocation input.error, .orderform-template-holder #client-profile-data form.client-pre-email input.error[type=text]:not(.pac-target-input), .orderform-template-holder #client-profile-data form.client-pre-email input.error[type=tel]:not(.pac-target-input), .orderform-template-holder #client-profile-data form.client-pre-email input.error[type=email]:not(.pac-target-input), .orderform-template-holder #client-profile-data form.client-pre-email select.error:not(.pac-target-input), .orderform-template-holder #client-profile-data .step.client-profile-data input.error[type=text]:not(.pac-target-input), .orderform-template-holder #client-profile-data .step.client-profile-data input.error[type=tel]:not(.pac-target-input), .orderform-template-holder #client-profile-data .step.client-profile-data input.error[type=email]:not(.pac-target-input), .orderform-template-holder #client-profile-data .step.client-profile-data select.error:not(.pac-target-input), .orderform-template-holder #shipping-data input.error[type=text]:not(.pac-target-input), .orderform-template-holder #shipping-data input.error[type=tel]:not(.pac-target-input), .orderform-template-holder #shipping-data input.error[type=email]:not(.pac-target-input), .orderform-template-holder #shipping-data select.error:not(.pac-target-input), .orderform-template-holder #payment-data input.error[type=text]:not(.pac-target-input), .orderform-template-holder #payment-data input.error[type=tel]:not(.pac-target-input), .orderform-template-holder #payment-data input.error[type=email]:not(.pac-target-input), .orderform-template-holder #payment-data select.error:not(.pac-target-input), .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-addressFormPart1.vtex-omnishipping-1-x-geolocation input.error, .orderform-template .summary-note .error.note-textarea, #app-container input.error[type=text], #app-container input.error[type=tel], #app-container input.error[type=email], #app-container select.error, .vcustom--vtex-omnishipping-1-x-address input.error { border-color: var(--Danger) } #vtexIdContainer input:focus, .table.cart-items tr.item-attachments-content input:focus, .table.cart-items tr.item-attachments-content select:focus, .table.cart-items tbody tr td .product-service select:focus, .table.cart-items td.quantity input:focus, .summary-template-holder .summary-coupon fieldset.coupon-fieldset input:focus[type="text"], .summary-template-holder .summary-coupon fieldset.coupon-fieldset button:focus[type="submit"], .cart-more-options .srp-container select:focus, .cart-more-options .srp-container input:focus[type=text]:not(.pac-target-input), .cart-more-options .srp-container .vtex-shipping-preview-0-x-addressFormPart1.vtex-shipping-preview-0-x-geolocation input:focus, .orderform-template-holder #client-profile-data form.client-pre-email input:focus[type=text]:not(.pac-target-input), .orderform-template-holder #client-profile-data form.client-pre-email input:focus[type=tel]:not(.pac-target-input), .orderform-template-holder #client-profile-data form.client-pre-email input:focus[type=email]:not(.pac-target-input), .orderform-template-holder #client-profile-data form.client-pre-email select:focus:not(.pac-target-input), .orderform-template-holder #client-profile-data .step.client-profile-data input:focus[type=text]:not(.pac-target-input), .orderform-template-holder #client-profile-data .step.client-profile-data input:focus[type=tel]:not(.pac-target-input), .orderform-template-holder #client-profile-data .step.client-profile-data input:focus[type=email]:not(.pac-target-input), .orderform-template-holder #client-profile-data .step.client-profile-data select:focus:not(.pac-target-input), .orderform-template-holder #shipping-data input:focus[type=text]:not(.pac-target-input), .orderform-template-holder #shipping-data input:focus[type=tel]:not(.pac-target-input), .orderform-template-holder #shipping-data input:focus[type=email]:not(.pac-target-input), .orderform-template-holder #shipping-data select:focus:not(.pac-target-input), .orderform-template-holder #payment-data input:focus[type=text]:not(.pac-target-input), .orderform-template-holder #payment-data input:focus[type=tel]:not(.pac-target-input), .orderform-template-holder #payment-data input:focus[type=email]:not(.pac-target-input), .orderform-template-holder #payment-data select:focus:not(.pac-target-input), .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-addressFormPart1.vtex-omnishipping-1-x-geolocation input:focus, .orderform-template .summary-note .note-textarea:focus, #app-container input:focus[type=text], #app-container input:focus[type=tel], #app-container input:focus[type=email], #app-container select:focus, .vcustom--vtex-omnishipping-1-x-address input:focus { box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(0, 0, 0, 0.4) } input#creditCardpayment-card-0Number, input#creditCardpayment-card-0Code, input#creditCardpayment-card-1Number, input#creditCardpayment-card-1Code { font-size: 18px } input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active { animation: input_background_autofill 0s forwards } @keyframes input_background_autofill { 100% { background-color: transparent } } .btn, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a, .orderform-template-holder #payment-data .payment-discounts-list table td.action a { font-family: var(--fontFamily); text-shadow: none; border-radius: 2px; outline: none !important; text-align: center; font-size: 14px; padding: 5px 12px; box-sizing: border-box; display: inline-block; background: none; box-shadow: none } .btn, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a, .orderform-template-holder #payment-data .payment-discounts-list table td.action a, .btn:hover, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a:hover, .orderform-template-holder #payment-data .payment-discounts-list table td.action a:hover, .btn:focus, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a:focus, .orderform-template-holder #payment-data .payment-discounts-list table td.action a:focus { transition: all ease 0.3s } .btn:hover, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a:hover, .orderform-template-holder #payment-data .payment-discounts-list table td.action a:hover, .btn:focus, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a:focus, .orderform-template-holder #payment-data .payment-discounts-list table td.action a:focus { background: none } .btn-large, .client-pre-email .client-email.input.text .btn-success { padding: 17px 19px } .btn-link, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a { color: var(--ActionPrimary); } .btn-link:hover, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a:hover, .btn-link:focus, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a:focus { color: var(--ActionPrimaryDark) } .btn-success { background: var(--Success); border: 1px solid var(--Success); font-size: 13px } .btn-success:hover, .btn-success:focus, .btn-success:active { background: var(--SuccessDarker); border: 1px solid var(--SuccessDarker); } .btn-success[disabled] { background: var(--Success); } .btn-primary { background: var(--ActionPrimary); border: 1px solid var(--ActionPrimary); color: var(--ActionSecondary); } .btn-primary:hover, .btn-primary:focus, .btn-primary:active { background: var(--ActionPrimaryDark); border: 1px solid var(--ActionPrimaryDark) } .btn-secondary, .table.cart-items tbody tr td.product-name .add-service.btn, .table.cart-items tbody tr td.product-name .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a.add-service, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .table.cart-items tbody tr td.product-name a.add-service, .table.cart-items tbody tr td.product-name .clone-item.btn, .table.cart-items tbody tr td.product-name .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a.clone-item, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .table.cart-items tbody tr td.product-name a.clone-item, .table.cart-items tbody tr td.product-name .add-item-attachment-container a, .table.cart-items tbody tr td .product-service input[type=submit], .summary-template-holder .summary-coupon fieldset.coupon-fieldset button[type="submit"], .cart-more-options .srp-container .vtex-shipping-preview-0-x-pc .btn, .cart-more-options .srp-container .vtex-shipping-preview-0-x-pc .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .cart-more-options .srp-container .vtex-shipping-preview-0-x-pc a, .orderform-template-holder #payment-data .payment-discounts-list table td.action a, .orderform-template-holder #payment-data #btn-add-gift-card { background: transparent; border: 1px solid var(--ActionPrimary); color: var(--ActionPrimary); } .btn-secondary:hover, .table.cart-items tbody tr td.product-name .add-service.btn:hover, .table.cart-items tbody tr td.product-name .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a.add-service:hover, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .table.cart-items tbody tr td.product-name a.add-service:hover, .table.cart-items tbody tr td.product-name .clone-item.btn:hover, .table.cart-items tbody tr td.product-name .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a.clone-item:hover, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .table.cart-items tbody tr td.product-name a.clone-item:hover, .table.cart-items tbody tr td.product-name .add-item-attachment-container a:hover, .table.cart-items tbody tr td .product-service input:hover[type=submit], .summary-template-holder .summary-coupon fieldset.coupon-fieldset button:hover[type="submit"], .cart-more-options .srp-container .vtex-shipping-preview-0-x-pc .btn:hover, .cart-more-options .srp-container .vtex-shipping-preview-0-x-pc .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a:hover, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .cart-more-options .srp-container .vtex-shipping-preview-0-x-pc a:hover, .orderform-template-holder #payment-data .payment-discounts-list table td.action a:hover, .orderform-template-holder #payment-data #btn-add-gift-card:hover, .btn-secondary:focus, .table.cart-items tbody tr td.product-name .add-service.btn:focus, .table.cart-items tbody tr td.product-name .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a.add-service:focus, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .table.cart-items tbody tr td.product-name a.add-service:focus, .table.cart-items tbody tr td.product-name .clone-item.btn:focus, .table.cart-items tbody tr td.product-name .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a.clone-item:focus, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .table.cart-items tbody tr td.product-name a.clone-item:focus, .table.cart-items tbody tr td.product-name .add-item-attachment-container a:focus, .table.cart-items tbody tr td .product-service input:focus[type=submit], .summary-template-holder .summary-coupon fieldset.coupon-fieldset button:focus[type="submit"], .cart-more-options .srp-container .vtex-shipping-preview-0-x-pc .btn:focus, .cart-more-options .srp-container .vtex-shipping-preview-0-x-pc .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a:focus, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .cart-more-options .srp-container .vtex-shipping-preview-0-x-pc a:focus, .orderform-template-holder #payment-data .payment-discounts-list table td.action a:focus, .orderform-template-holder #payment-data #btn-add-gift-card:focus, .btn-secondary:active, .table.cart-items tbody tr td.product-name .add-service.btn:active, .table.cart-items tbody tr td.product-name .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a.add-service:active, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .table.cart-items tbody tr td.product-name a.add-service:active, .table.cart-items tbody tr td.product-name .clone-item.btn:active, .table.cart-items tbody tr td.product-name .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a.clone-item:active, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .table.cart-items tbody tr td.product-name a.clone-item:active, .table.cart-items tbody tr td.product-name .add-item-attachment-container a:active, .table.cart-items tbody tr td .product-service input:active[type=submit], .summary-template-holder .summary-coupon fieldset.coupon-fieldset button:active[type="submit"], .cart-more-options .srp-container .vtex-shipping-preview-0-x-pc .btn:active, .cart-more-options .srp-container .vtex-shipping-preview-0-x-pc .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a:active, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .cart-more-options .srp-container .vtex-shipping-preview-0-x-pc a:active, .orderform-template-holder #payment-data .payment-discounts-list table td.action a:active, .orderform-template-holder #payment-data #btn-add-gift-card:active { background: var(--ActionSecondary); border: 1px solid var(--ActionPrimaryDark); color: var(--ActionPrimaryDark) } .btn-outlined { background: transparent; border: 1px solid var(--Success); color: var(--Success); } .btn-outlined:hover, .btn-outlined:focus, .btn-outlined:active { background: transparent; border: 1px solid var(--SuccessDarker); } .item-unavailable { display: none !important; } body .content-separator-existent { margin-bottom: 0px !important; z-index: 9; padding-bottom: 0 !important; } .btn#payment-data-submit span, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a#payment-data-submit span, .orderform-template-holder #payment-data .payment-discounts-list table td.action a#payment-data-submit span { font-size: 14px; margin-left: 5px; font-weight: bold } .cart-more-options .srp-container .srp-main-title, .client-pre-email h3.client-pre-email-h span:after, .orderform-template-holder #client-profile-data form.client-pre-email .accordion-toggle, .orderform-template-holder #client-profile-data .step.client-profile-data .accordion-toggle, .orderform-template-holder #shipping-data .accordion-toggle, .orderform-template-holder #payment-data .accordion-toggle, .orderform-template .cart-template.mini-cart h2 { font-size: calc(12px + 2px); text-transform: uppercase; border-bottom: 1px solid #eee; font-weight: bold; margin-bottom: 15px; padding: 7px 0 !important; color: #999; color: var(--MutedOne); border: none; font-size: 20px; text-transform: initial; margin-bottom: 0px } .payment-data .gift-card-section, .payment-data .payment-discounts-alert { margin: 0; width: 100% !important; box-sizing: border-box } .input-append, .input-prepend { display: flex !important; align-items: stretch } .input-append .btn, .input-append .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .input-append a, .input-append .orderform-template-holder #payment-data .payment-discounts-list table td.action a, .orderform-template-holder #payment-data .payment-discounts-list table td.action .input-append a, .input-append .add-on, .input-prepend .btn, .input-prepend .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .input-prepend a, .input-prepend .orderform-template-holder #payment-data .payment-discounts-list table td.action a, .orderform-template-holder #payment-data .payment-discounts-list table td.action .input-prepend a, .input-prepend .add-on { height: 40px; line-height: 40px; box-sizing: border-box; padding: 0; width: 20px } .input-append .add-on, .input-prepend .add-on { height: initial !important } .input-append input, .input-prepend input { border-radius: 0 4px 4px 0 !important; width: 100% !important; max-width: 100px !important } .payment-discoints-table .number, .gift-card-provider-group .number, .payment-discoints-table .action, .gift-card-provider-group .action { text-align: right } @media (max-width: 1024px) { .orderform-template-holder .client-profile-data input[type="text"] { width: 100% !important } } .default-modal { border-radius: 4px; height: auto } .modal .btn, .modal .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .modal a, .modal .orderform-template-holder #payment-data .payment-discounts-list table td.action a, .orderform-template-holder #payment-data .payment-discounts-list table td.action .modal a { background: #FFF } .modal.guest-login-modal button.btn { width: auto } .modal.guest-login-modal, .modal.modal-email-template, .modal.modal-payment-template, .modal.modal-masked-info-template { background: var(--Success); } .payment-confirmation-message { width: 100% } #vtexIdContainer { position: fixed !important } .vtexIdUI { position: absolute; top: 50% !important; transform: translateY(-50%) !important } #vtexIdContainer { position: fixed } #vtexIdContainer a { color: var(--ActionPrimary); } #vtexIdContainer .vtexIdUI .modal-footer { background: none } #vtexIdContainer .vtexIdUI .btn, #vtexIdContainer .vtexIdUI .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data #vtexIdContainer .vtexIdUI a, #vtexIdContainer .vtexIdUI .orderform-template-holder #payment-data .payment-discounts-list table td.action a, .orderform-template-holder #payment-data .payment-discounts-list table td.action #vtexIdContainer .vtexIdUI a { border-radius: 30px; height: 40px; line-height: 40px; box-shadow: none !important; font-size: 12px; padding: 0 30px } #vtexIdContainer .vtexIdUI .btn.btn-success, #vtexIdContainer .vtexIdUI .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a.btn-success, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data #vtexIdContainer .vtexIdUI a.btn-success, #vtexIdContainer .vtexIdUI .orderform-template-holder #payment-data .payment-discounts-list table td.action a.btn-success, .orderform-template-holder #payment-data .payment-discounts-list table td.action #vtexIdContainer .vtexIdUI a.btn-success { background: var(--Success); border: 1px solid var(--Success); } #vtexIdContainer .vtexIdUI .btn.btn-success:hover, #vtexIdContainer .vtexIdUI .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a.btn-success:hover, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data #vtexIdContainer .vtexIdUI a.btn-success:hover, #vtexIdContainer .vtexIdUI .orderform-template-holder #payment-data .payment-discounts-list table td.action a.btn-success:hover, .orderform-template-holder #payment-data .payment-discounts-list table td.action #vtexIdContainer .vtexIdUI a.btn-success:hover, #vtexIdContainer .vtexIdUI .btn.btn-success:focus, #vtexIdContainer .vtexIdUI .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a.btn-success:focus, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data #vtexIdContainer .vtexIdUI a.btn-success:focus, #vtexIdContainer .vtexIdUI .orderform-template-holder #payment-data .payment-discounts-list table td.action a.btn-success:focus, .orderform-template-holder #payment-data .payment-discounts-list table td.action #vtexIdContainer .vtexIdUI a.btn-success:focus, #vtexIdContainer .vtexIdUI .btn.btn-success:active, #vtexIdContainer .vtexIdUI .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a.btn-success:active, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data #vtexIdContainer .vtexIdUI a.btn-success:active, #vtexIdContainer .vtexIdUI .orderform-template-holder #payment-data .payment-discounts-list table td.action a.btn-success:active, .orderform-template-holder #payment-data .payment-discounts-list table td.action #vtexIdContainer .vtexIdUI a.btn-success:active { background: var(--SuccessDarker); border: 1px solid var(--SuccessDarker); } #vtexIdContainer .vtexIdUI .btn#vtexIdUI-facebook, #vtexIdContainer .vtexIdUI .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a#vtexIdUI-facebook, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data #vtexIdContainer .vtexIdUI a#vtexIdUI-facebook, #vtexIdContainer .vtexIdUI .orderform-template-holder #payment-data .payment-discounts-list table td.action a#vtexIdUI-facebook, .orderform-template-holder #payment-data .payment-discounts-list table td.action #vtexIdContainer .vtexIdUI a#vtexIdUI-facebook { background: #4568ad !important } @media (max-width: 1024px) { #vtexIdContainer { position: fixed !important } #vtexIdContainer .vtexIdUI { overflow: auto; border-radius: 0; width: 100%; left: 0; margin: 0; top: 0; height: 100% !important; border: none } #vtexIdContainer .vtexIdUI .modal-header .close { top: 0; right: 0; margin: 0; padding: 4px 8px } } body { font-family: var(--fontFamily); min-width: initial !important; padding: 0 !important; background: rgb(255, 255, 255) !important; min-height: 93vh; position: relative; font-size: 14px; overflow-x: hidden } body a { color: var(--ActionPrimary); } body a:hover { color: var(--ActionPrimaryDark) } @media (max-width: 1024px) { body { padding-bottom: 0px !important } } body .cart-template.full-cart>* { opacity: 0; transition-delay: 1.2s; transition-property: opacity; -webkit-transition-duration: 0.5s } body.v-custom-loaded .cart-template.full-cart>* { opacity: initial } body.returningUser.v-custom-addressForm-on.v-custom-step-shipping .accordion-inner.shipping-container .vtex-omnishipping-1-x-addressFormPart1.vtex-omnishipping-1-x-geolocation { display: block } body.returningUser.v-custom-addressForm-on.v-custom-step-shipping .accordion-inner.shipping-container .vtex-omnishipping-1-x-deliveryGroup { display: block } body.returningUser.v-custom-addressForm-on.v-custom-step-shipping .accordion-inner.shipping-container .vtex-omnishipping-1-x-submitPaymentButton { display: block } .onda-v1 .br-pill, .step, .cart, .totalizers { border-radius: 4px } .loading.loading-bg { background: var(--Base) } .container { max-width: 100%; width: var(--width); } @media (max-width: 1024px) { .container { width: calc(100% - 20px) } } .checkout-container { overflow: initial !important; z-index: 2 } @media (max-width: 1024px) { .checkout-container { margin-bottom: 30px } } .checkout-container .orderform-template, .checkout-container .cart-template { display: flex; justify-content: space-between; align-items: flex-start; transition: position ease 0.8s, opacity ease 0.8s, margin ease 0.8s } .checkout-container .orderform-template::before, .checkout-container .cart-template::before, .checkout-container .orderform-template::after, .checkout-container .cart-template::after { content: none !important; } .checkout-container .orderform-template.inactive, .checkout-container .cart-template.inactive { max-height: 50vh; overflow: hidden; top: 0; position: absolute } .checkout-container .full-cart.inactive { margin-left: -140% } .checkout-container .orderform-template.inactive { left: 140%; margin: 0; display: none !important } .container-cart h1, h1#orderform-title { font-size: 22px !important; font-weight: 400 !important; color: var(--MutedOne) !important } h1#orderform-title { display: none !important } .v-custom-assemblies { margin: 10px 0 3px 0; overflow: hidden; border-top: 1px solid var(--MutedFour); padding-top: 7px } @media (max-width: 1024px) { .v-custom-assemblies { width: 100%; left: 0; margin-bottom: 2px } } .v-custom-assemblies p { display: none } .v-custom-assemblies__values { list-style: none; padding: 0; margin: 0 } .v-custom-assemblies__values__item strong:after { content: ":" } .v-custom-assemblies__values__item span, .v-custom-assemblies__values__item strong { line-height: 14px } .client-pre-email h3.client-pre-email-h span:before, .client-profile-data .accordion-toggle>span:before, .shipping-data .accordion-toggle:before, .payment-data .accordion-toggle>span:not(.payment-edit-link):before { background: #FFF; border: 1px solid var(--MutedOne); color: var(--MutedOne); width: 26px; height: 26px; line-height: 26px; font-size: 15px } body.v-custom-step-profile .client-pre-email h3.client-pre-email-h span:before, body.v-custom-step-shipping .client-pre-email h3.client-pre-email-h span:before, body.v-custom-step-shipping .client-profile-data .accordion-toggle>span:before, body.v-custom-step-payment .client-pre-email h3.client-pre-email-h span:before, body.v-custom-step-payment .client-profile-data .accordion-toggle>span:before, body.v-custom-step-payment .shipping-data .accordion-toggle:before, body.v-custom-step-email .client-pre-email h3.client-pre-email-h span:before, body.v-custom-step-profile .client-profile-data .accordion-toggle>span:before, body.v-custom-step-shipping .shipping-data .accordion-toggle:before, body.v-custom-step-payment .payment-data .accordion-toggle>span:not(.payment-edit-link):before, body.js-vcustom-hideEmailStep .client-profile-data .accordion-toggle>span:before { background: var(--ActionPrimary); border-color: var(--ActionPrimary); color: #FFF } .client-pre-email h3.client-pre-email-h span:before, .client-profile-data .accordion-toggle>span:before, .shipping-data .accordion-toggle:before, .payment-data .accordion-toggle>span:not(.payment-edit-link):before { text-align: center; margin-right: 10px; border-radius: 100%; display: inline-block; font-weight: bold; vertical-align: middle; margin-top: -2px } .client-pre-email h3.client-pre-email-h span:before { content: "1" } .client-profile-data .accordion-toggle>span:before { content: "2" } .shipping-data .accordion-toggle:before { content: "3" } .payment-data .accordion-toggle>span:not(.payment-edit-link):before { content: "4" } @media (max-width: 1024px) { body:before { width: 0; height: 4px; background: var(--ActionPrimary); display: block; content: ""; position: fixed; top: 0; transition: all ease 0.3s; z-index: 999 } body.v-custom-step-email:before { width: 23% } body.v-custom-step-profile:before { width: 46% } body.v-custom-step-shipping:before { width: 69% } body.v-custom-step-payment:before { width: 92% } } body.v-custom-step-cart .checkout-steps_item_cart .text, body.v-custom-step-email .checkout-steps_item_cart .text, body.v-custom-step-email .checkout-steps_item_identification .text, body.v-custom-step-profile .checkout-steps_item_cart .text, body.v-custom-step-profile .checkout-steps_item_identification .text, body.v-custom-step-shipping .checkout-steps_item_cart .text, body.v-custom-step-shipping .checkout-steps_item_identification .text, body.v-custom-step-shipping .checkout-steps_item_shipping .text, body.v-custom-step-payment .checkout-steps_item_cart .text, body.v-custom-step-payment .checkout-steps_item_identification .text, body.v-custom-step-payment .checkout-steps_item_shipping .text, body.v-custom-step-payment .checkout-steps_item_payment .text { color: var(--MutedOne); font-weight: bold; pointer-events: initial } body.v-custom-step-cart .checkout-steps_item_cart { opacity: 1 } body.v-custom-step-cart .checkout-steps_item_cart .text { pointer-events: none } body.v-custom-step-cart .checkout-steps_item_cart:before { background: var(--ActionPrimary); border-color: var(--ActionPrimary); } body.v-custom-step-email .checkout-steps_bar_inner-active, body.v-custom-step-profile .checkout-steps_bar_inner-active { width: 20% } body.v-custom-step-email .checkout-steps_item_cart, body.v-custom-step-email .checkout-steps_item_identification, body.v-custom-step-profile .checkout-steps_item_cart, body.v-custom-step-profile .checkout-steps_item_identification { opacity: 1 } body.v-custom-step-email .checkout-steps_item_cart:before, body.v-custom-step-email .checkout-steps_item_identification:before, body.v-custom-step-profile .checkout-steps_item_cart:before, body.v-custom-step-profile .checkout-steps_item_identification:before { background: var(--ActionPrimary); border-color: var(--ActionPrimary); } body.v-custom-step-email .checkout-steps_item_identification .text, body.v-custom-step-profile .checkout-steps_item_identification .text { pointer-events: none } body.v-custom-step-shipping .checkout-steps_bar_inner-active { width: 40% } body.v-custom-step-shipping .checkout-steps_item_cart, body.v-custom-step-shipping .checkout-steps_item_identification, body.v-custom-step-shipping .checkout-steps_item_shipping { opacity: 1 } body.v-custom-step-shipping .checkout-steps_item_cart:before, body.v-custom-step-shipping .checkout-steps_item_identification:before, body.v-custom-step-shipping .checkout-steps_item_shipping:before { background: var(--ActionPrimary); border-color: var(--ActionPrimary); } body.v-custom-step-shipping .checkout-steps_item_shipping .text { pointer-events: none } body.v-custom-step-payment .checkout-steps_bar_inner-active { width: 60% } body.v-custom-step-payment .checkout-steps_item_cart, body.v-custom-step-payment .checkout-steps_item_identification, body.v-custom-step-payment .checkout-steps_item_shipping, body.v-custom-step-payment .checkout-steps_item_payment { opacity: 1 } body.v-custom-step-payment .checkout-steps_item_cart:before, body.v-custom-step-payment .checkout-steps_item_identification:before, body.v-custom-step-payment .checkout-steps_item_shipping:before, body.v-custom-step-payment .checkout-steps_item_payment:before { background: var(--ActionPrimary); border-color: var(--ActionPrimary); } body.v-custom-step-payment .checkout-steps_item_payment .text { pointer-events: none } .checkout-steps { display: none; position: relative; min-width: 470px; width: 100%; display: block } @media (max-width: 1024px) { .checkout-steps { display: none !important } } .checkout-steps_bar_inner-active { width: 0; background: var(--ActionPrimary); } .checkout-steps_items { display: flex; justify-content: space-between } .checkout-steps_item { position: relative; text-align: center; flex-grow: 1; display: flex; align-items: center; justify-content: flex-start; opacity: 0.6 } .checkout-steps_item:after { content: ""; height: 2px; background: var(--ActionPrimary); margin: 0px 5px; min-width: 10px } .checkout-steps_item .text { clear: both; display: flex; align-items: center; color: #999; font-weight: 500; cursor: pointer; pointer-events: none } .checkout-steps_item .text:before { content: ""; width: 7px; height: 7px; background: var(--ActionPrimary); border: 2px solid var(--ActionPrimary); display: inline-block; border-radius: 100%; margin-right: 7px; transition: all ease 0.3s } .checkout-steps_item_cart:after { width: calc(100% - 50px) } .checkout-steps_item_identification:after { width: calc(100% - 103px) } .checkout-steps_item_shipping:after { width: calc(100% - 77px) } .checkout-steps_item_payment:after { width: calc(100% - 77px) } .checkout-steps_item_confirmation:after { display: none } body .main-header { padding: 12px 0; text-align: center; border-bottom: 1px solid var(--MutedFour); position: relative; background-color: #FFF; margin-bottom: 40px } body .main-header, body .main-header>.container { display: flex; align-items: center } @media (max-width: 1024px) { body .main-header, body .main-header>.container { justify-content: center } } body .main-header>.container:before, body .main-header>.container:after { display: none } body .main-header .header-link { position: absolute; left: 0px; top: calc(100% + 18px); display: none } body .main-header .header-link a { height: 20px; font-size: 11px; line-height: 115%; padding-left: 0px; color: var(--MutedTwo); display: flex; align-items: center } body .main-header .header-link a:before { display: block; float: left; width: 10px; height: 10px; -webkit-mask: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pg0KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE5LjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPg0KPHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJDYXBhXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgNDQzLjUyIDQ0My41MiIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNDQzLjUyIDQ0My41MjsiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPGc+DQoJPGc+DQoJCTxwYXRoIGQ9Ik0xNDMuNDkyLDIyMS44NjNMMzM2LjIyNiwyOS4xMjljNi42NjMtNi42NjQsNi42NjMtMTcuNDY4LDAtMjQuMTMyYy02LjY2NS02LjY2Mi0xNy40NjgtNi42NjItMjQuMTMyLDBsLTIwNC44LDIwNC44DQoJCQljLTYuNjYyLDYuNjY0LTYuNjYyLDE3LjQ2OCwwLDI0LjEzMmwyMDQuOCwyMDQuOGM2Ljc4LDYuNTQ4LDE3LjU4NCw2LjM2LDI0LjEzMi0wLjQyYzYuMzg3LTYuNjE0LDYuMzg3LTE3LjA5OSwwLTIzLjcxMg0KCQkJTDE0My40OTIsMjIxLjg2M3oiLz4NCgk8L2c+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8L3N2Zz4NCg==) no-repeat 50% 50%; mask: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pg0KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE5LjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPg0KPHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJDYXBhXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgNDQzLjUyIDQ0My41MiIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNDQzLjUyIDQ0My41MjsiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPGc+DQoJPGc+DQoJCTxwYXRoIGQ9Ik0xNDMuNDkyLDIyMS44NjNMMzM2LjIyNiwyOS4xMjljNi42NjMtNi42NjQsNi42NjMtMTcuNDY4LDAtMjQuMTMyYy02LjY2NS02LjY2Mi0xNy40NjgtNi42NjItMjQuMTMyLDBsLTIwNC44LDIwNC44DQoJCQljLTYuNjYyLDYuNjY0LTYuNjYyLDE3LjQ2OCwwLDI0LjEzMmwyMDQuOCwyMDQuOGM2Ljc4LDYuNTQ4LDE3LjU4NCw2LjM2LDI0LjEzMi0wLjQyYzYuMzg3LTYuNjE0LDYuMzg3LTE3LjA5OSwwLTIzLjcxMg0KCQkJTDE0My40OTIsMjIxLjg2M3oiLz4NCgk8L2c+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8L3N2Zz4NCg==) no-repeat 50% 50%; -webkit-mask-size: cover; mask-size: cover; background-color: var(--MutedTwo); content: "" } body .main-header .header-link a.back-cart-link { display: none } @media (max-width: 1024px) { body .main-header .header-link { top: 50%; transform: translateY(-50%) } body .main-header .header-link a { max-width: 80px } body .main-header .header-link a:before { width: 17px; height: 17px } } body .main-header .logo { max-width: calc(100% - 180px) } body .main-header .logo svg.vtex-logo { height: 50px } body .main-header .logo, body .main-header .logo img { display: inline-block; font-size: 24px; border: none; line-height: 39px } body .main-header .checkout-steps { max-width: 540px; margin-left: auto; padding-right: 10px } @media (max-width: 1024px) { body:not(.body-cart) .main-header { padding: 4px 0; margin-bottom: 10px } body:not(.body-cart) .main-header .v-custom-mhide { display: none !important } body:not(.body-cart) .main-header, body:not(.body-cart) .main-header>.container { background: none; border: none; justify-content: center } body:not(.body-cart) .main-header .logo { cursor: default; pointer-events: none; font-weight: bold } body:not(.body-cart) .main-header .logo svg, body:not(.body-cart) .main-header .logo img { display: none !important } body:not(.body-cart) .main-header .logo:before { content: "checkout"; text-transform: uppercase } body:not(.body-cart) .main-header .logo, body:not(.body-cart) .main-header .logo:hover { color: var(--MutedOne); font-size: 14px } body:not(.body-cart) .main-header .header-link { display: block } body:not(.body-cart) .main-header a.buy-more-link { display: none } body:not(.body-cart) .main-header a.back-cart-link { display: block !important; font-size: 0 } body:not(.body-cart) .main-header a.back-cart-link:before { background: var(--MutedOne) } } .main-footer { clear: both; text-align: center; padding: 2px 0; border-top: 1px solid var(--MutedFour); position: absolute; bottom: 0; width: 100%; z-index: -1 } .main-footer .container { position: initial } @media (max-width: 1024px) { .main-footer { position: relative } } .main-footer a.credits-vtex { width: 100px; display: block; margin: 0 auto } .main-footer .vtex-logo { display: block; margin: 0 auto } .main-footer svg, .main-footer svg path { fill: #999 } .cart { border: none; padding: 0 } body.v-custom-step-cart .main-header .header-link { display: block } body.v-custom-cart-empty #cart-title, body.v-custom-cart-empty #shipping-preview-container, body.v-custom-cart-empty .summary-template-holder, body.v-custom-cart-empty .checkout-steps, body.v-custom-cart-empty .cart-more-options { display: none !important } body.v-custom-cart-empty .cart-template-holder { margin: 0 auto } .empty-cart-content { padding: 50px 0 } h1#cart-title { display: none !important } .cart-more-options, .cart-template-holder .cart { padding: 20px 0px; background: #fff; margin: 0; border-radius: 4px } @media (max-width: 1024px) { .cart-more-options, .cart-template-holder .cart { padding: 12px } } .cart-template-holder .cart { border: none; margin-bottom: 20px } @media (max-width: 1024px) { .table.cart-items tbody tr:first-child { border: none } } .table.cart-items tbody tr.item-attachments-head, .table.cart-items tbody tr.item-attachments-content { display: none } .table.cart-items tbody tr .v-custom-product-item-wrap { width: 100%; display: flex; align-items: center; position: relative; padding: 20px 0 } @media (max-width: 1024px) { .table.cart-items tbody tr .v-custom-product-item-wrap { display: block; } .table.cart-items tbody tr .v-custom-product-item-wrap:after { content: ""; clear: both; display: block } } .table.cart-items tbody tr td { width: auto; border: none } .table.cart-items tbody tr td.product-name .add-service-container, .table.cart-items tbody tr td.product-name .clone-item.btn, .table.cart-items tbody tr td.product-name .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a.clone-item, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .table.cart-items tbody tr td.product-name a.clone-item, .table.cart-items tbody tr td.product-name .orderform-template-holder #payment-data .payment-discounts-list table td.action a.clone-item, .orderform-template-holder #payment-data .payment-discounts-list table td.action .table.cart-items tbody tr td.product-name a.clone-item, .table.cart-items tbody tr td.product-name .add-item-attachment-container { margin: 10px 0 } .table.cart-items tbody tr td.product-name .add-service-container+p, .table.cart-items tbody tr td.product-name .clone-item.btn+p, .table.cart-items tbody tr td.product-name .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a.clone-item+p, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .table.cart-items tbody tr td.product-name a.clone-item+p, .table.cart-items tbody tr td.product-name .orderform-template-holder #payment-data .payment-discounts-list table td.action a.clone-item+p, .orderform-template-holder #payment-data .payment-discounts-list table td.action .table.cart-items tbody tr td.product-name a.clone-item+p, .table.cart-items tbody tr td.product-name .add-item-attachment-container+p { display: none } @media (min-width: 1025px) { .table.cart-items tbody tr td.product-name { width: calc(100% - 355px) !important } } .table.cart-items tbody tr td.product-name .seller { display: block } .table.cart-items tbody tr td.product-price, .table.cart-items tbody tr td.quantity-price { width: 90px !important; white-space: nowrap; margin: 0 10px; line-height: 16px } .table.cart-items tbody tr td.product-price br, .table.cart-items tbody tr td.quantity-price br { display: none } @media (max-width: 1024px) { .table.cart-items tbody tr td.product-price, .table.cart-items tbody tr td.quantity-price { width: initial !important; text-align: right; float: right; margin: 0; padding: 0 } } .table.cart-items tbody tr td.product-price .new-product-price-label, .table.cart-items tbody tr td.product-price .old-product-price-label, .table.cart-items tbody tr td.quantity-price .new-product-price-label, .table.cart-items tbody tr td.quantity-price .old-product-price-label { display: none } .table.cart-items tbody tr td.product-price .list-price, .table.cart-items tbody tr td.quantity-price .list-price { font-size: 10px } .table.cart-items tbody tr td.product-price .list-price:not(.hide) .old-product-price, .table.cart-items tbody tr td.quantity-price .list-price:not(.hide) .old-product-price { font-size: 14px; color: #000 !important } .table.cart-items tbody tr.product-item:not(.unavailable) td.product-price .list-price:not(.hide) ~ span.best-price .new-product-price, .table.cart-items tbody tr.product-item:not(.unavailable) td.quantity-price .list-price:not(.hide) ~ span.best-price .new-product-price { color: var(--HmSale); font-weight: 600 } /* HMDCP-3411: nodo nativo .discount del item en rojo (Desktop y Mobile, fuera de media queries) */ .table.cart-items tbody tr.product-item:not(.unavailable) td.product-price .best-price .discount:not(:empty), .table.cart-items tbody tr.product-item:not(.unavailable) td.product-price .total-selling-price .discount:not(:empty), .table.cart-items tbody tr.product-item:not(.unavailable) td.quantity-price .best-price .discount:not(:empty), .table.cart-items tbody tr.product-item:not(.unavailable) td.quantity-price .total-selling-price .discount:not(:empty) { color: var(--HmSale); } /* HMDCP-3411: variante quantityPriceCart: true (precio unitario envuelto en .v-custom-quantity-price__list--selling) */ .table.cart-items tbody tr.product-item:not(.unavailable) td.product-price.v-custom-quantity-price-active:has(.v-custom-quantity-price__list--list) .v-custom-quantity-price__list--selling .best-price .new-product-price, .table.cart-items tbody tr.product-item:not(.unavailable) td.quantity-price.v-custom-quantity-price-active:has(.v-custom-quantity-price__list--list) .v-custom-quantity-price__list--selling .best-price .new-product-price { color: var(--HmSale); } .table.cart-items tbody tr td.product-price .total-selling-price, .table.cart-items tbody tr td.quantity-price .total-selling-price, .table.cart-items tbody tr td.quantity-price .best-price { font-weight: bold; position: relative } @media (max-width: 1024px) { .table.cart-items tbody tr td.product-price .total-selling-price, .table.cart-items tbody tr td.product-price .best-price, .table.cart-items tbody tr td.quantity-price .total-selling-price, .table.cart-items tbody tr td.quantity-price .best-price { display: flex; justify-content: flex-end; margin-top: 7px } .table.cart-items tbody tr td.product-price .total-selling-price .discount, .table.cart-items tbody tr td.product-price .best-price .discount, .table.cart-items tbody tr td.quantity-price .total-selling-price .discount, .table.cart-items tbody tr td.quantity-price .best-price .discount { margin-left: 5px; display: block } } .table.cart-items tbody tr td.product-price .new-product-real-price-per-unit, .table.cart-items tbody tr td.quantity-price .new-product-real-price-per-unit { display: inline-block } .table.cart-items tbody tr td.product-price .v-custom-quantity-price__best, .table.cart-items tbody tr td.quantity-price .v-custom-quantity-price__best { font-weight: bold; font-size: 12px } .table.cart-items tbody tr td.product-price .v-custom-quantity-price__list, .table.cart-items tbody tr td.quantity-price .v-custom-quantity-price__list { display: block; font-size: 10px } .table.cart-items tbody tr td.product-price .v-custom-quantity-price__list--list, .table.cart-items tbody tr td.product-price .v-custom-quantity-price__list--selling, .table.cart-items tbody tr td.quantity-price .v-custom-quantity-price__list--list, .table.cart-items tbody tr td.quantity-price .v-custom-quantity-price__list--selling { display: block } .table.cart-items tbody tr td.product-price .v-custom-quantity-price__list--list, .table.cart-items tbody tr td.quantity-price .v-custom-quantity-price__list--list { text-decoration: line-through; color: #999 } .table.cart-items tbody tr td.product-price .v-custom-quantity-price__list, .table.cart-items tbody tr td.product-price .v-custom-quantity-price__list--selling, .table.cart-items tbody tr td.quantity-price .v-custom-quantity-price__list, .table.cart-items tbody tr td.quantity-price .v-custom-quantity-price__list--selling { color: var(--MutedTwo); font-size: 10px; line-height: 11px } .table.cart-items tbody tr td.product-price .v-custom-quantity-price__list--selling, .table.cart-items tbody tr td.quantity-price .v-custom-quantity-price__list--selling { margin-bottom: 3px } .table.cart-items tbody tr td.product-price .v-custom-quantity-price__list--selling .discount, .table.cart-items tbody tr td.quantity-price .v-custom-quantity-price__list--selling .discount { display: none } .table.cart-items tbody tr td.product-price .v-custom-quantity-price__list--selling:after, .table.cart-items tbody tr td.quantity-price .v-custom-quantity-price__list--selling:after { content: ")" } .table.cart-items tbody tr td.product-price .v-custom-quantity-price__list--selling:before, .table.cart-items tbody tr td.quantity-price .v-custom-quantity-price__list--selling:before { content: "(" } .table.cart-items tbody tr td.product-price .v-custom-quantity-price__list--selling .best-price, .table.cart-items tbody tr td.quantity-price .v-custom-quantity-price__list--selling .best-price { font-weight: normal; display: inline-block } @media (max-width: 1024px) { .table.cart-items tbody tr td.product-price .v-custom-quantity-price__list>*:last-child, .table.cart-items tbody tr td.quantity-price .v-custom-quantity-price__list>*:last-child { margin-bottom: -7px } } .table.cart-items tbody tr td.product-price.v-custom-quantity-price-active>.list-price, .table.cart-items tbody tr td.quantity-price.v-custom-quantity-price-active>.list-price { display: none !important } .table.cart-items tbody tr td.product-price>span.list-price, .table.cart-items tbody tr td.product-price>span.best-price, .table.cart-items tbody tr td.quantity-price>span.list-price, .table.cart-items tbody tr td.quantity-price>span.best-price { display: block } .table.cart-items tbody tr td.product-price span.product-manualprice, .table.cart-items tbody tr td.product-price a.manualprice-link-remove, .table.cart-items tbody tr td.quantity-price span.product-manualprice, .table.cart-items tbody tr td.quantity-price a.manualprice-link-remove { z-index: 2 } .table.cart-items tbody tr td.product-price a.manualprice-link-remove, .table.cart-items tbody tr td.quantity-price a.manualprice-link-remove { position: absolute; top: -2px; left: -4px; background: #FFF } .table.cart-items tbody tr td.product-price a.manualprice-link-remove i.icon-remove:before, .table.cart-items tbody tr td.quantity-price a.manualprice-link-remove i.icon-remove:before { width: 10px !important; height: 10px !important } .table.cart-items tbody tr td.product-price span.product-manualprice, .table.cart-items tbody tr td.quantity-price span.product-manualprice { padding: 5px 5px 5px 31px; border: 1px solid #ccc; display: inline-block; background: #FFF; border-radius: 5px; box-shadow: 0 0 19px #777; position: absolute; top: 0; left: 0; transform: translate(-15%, -34%) } @media (max-width: 1024px) { .table.cart-items tbody tr td.product-price span.list-price:not(.hide)+br+span.best-price { margin-top: 0 } } .table.cart-items tbody tr td.item-remove { margin-left: auto; width: 20px !important } @media (max-width: 1024px) { .table.cart-items tbody tr td.item-remove { top: 0 !important } } .table.cart-items tbody tr td.product-image { order: 1 } .table.cart-items tbody tr td.product-name { order: 2; width: 60% } .table.cart-items tbody tr td.shipping-date { order: 3 } .table.cart-items tbody tr td.quantity { order: 3 } .table.cart-items tbody tr td.product-price, .table.cart-items tbody tr td.quantity-price { order: 5 } .table.cart-items tbody tr td.item-remove { order: 10 } .table.cart-items tbody tr td.quantity-price { display: none !important } .table.cart-items tbody tr td.product-price { display: flex !important; flex-flow: nowrap row-reverse; /* HMDCP-3411: baseline y no center, para que el precio rojo y el tachado compartan linea base (sus cajas tienen distinto alto) */ align-items: baseline; justify-content: flex-end; } .table.cart-items tbody tr td .field-help { background: var(--ActionPrimary); border-color: var(--ActionPrimary); } .table.cart-items tbody tr td i.icon-question-sign { color: var(--ActionPrimary); } .table.cart-items tbody tr td .add-item-attachment-container, .table.cart-items tbody tr td .clone-item, .table.cart-items tbody tr td p.clone-item-container { display: none !important } .table.cart-items tbody tr td hr.clone-item-sep { margin: 0; clear: both; border: none } .table.cart-items tbody tr td .product-service { height: calc(40px + 10px); margin-top: 10px; position: relative } @media (min-width: 1025px) { .table.cart-items tbody tr td .product-service fieldset { width: 100%; position: absolute; min-width: 250px } } .table.cart-items tbody tr td .product-service p { display: flex } .table.cart-items tbody tr td .product-service select { background: #FFF; width: 100%; margin-right: 10px } .table.cart-items tbody tr td.quantity input { line-height: inherit } .table.cart-items tbody tr .v-custom-assemblies { clear: both } .table.cart-items tbody tr.v-custom-bundles-in .product-service { display: none } .table.cart-items tbody tr.item-unavailable { margin: 10px 0; border-radius: 10px; border: none !important } @media (max-width: 1024px) { .table.cart-items tbody tr.item-unavailable { padding: 0; text-align: center } } .table.cart-items tbody tr.v-custom-indexedItems-in+tr.item-unavailable { display: none } .table.cart-items tbody tr.v-custom-indexed-item { border: none } .table.cart-items tbody tr.v-custom-indexed-item, .table.cart-items tbody tr.item-service { margin: 0 0 10px 0; padding: 0; border-top: none } .table.cart-items tbody tr.v-custom-indexed-item .v-custom-product-item-wrap, .table.cart-items tbody tr.v-custom-indexed-item .v-custom-trservice-wrap, .table.cart-items tbody tr.item-service .v-custom-product-item-wrap, .table.cart-items tbody tr.item-service .v-custom-trservice-wrap { background: var(--ActionSecondary); border: 1px dashed var(--MutedFour); border-radius: 4px; width: 100%; display: flex; align-items: center; box-sizing: border-box; padding: 5px 10px } .table.cart-items tbody tr.v-custom-indexed-item .v-custom-trservice-wrap, .table.cart-items tbody tr.item-service .v-custom-trservice-wrap { margin-bottom: 10px; margin-top: 10px } .table.cart-items tbody tr.v-custom-indexed-item td.quantity, .table.cart-items tbody tr.item-service td.quantity { background: #FFF; width: 25px; height: 20px; text-align: center; justify-content: center } .table.cart-items tbody tr.v-custom-indexed-item td.quantity p, .table.cart-items tbody tr.item-service td.quantity p { width: 100% } .table.cart-items tbody tr.v-custom-indexed-item td.product-price, .table.cart-items tbody tr.item-service td.product-price { display: none !important } .table.cart-items tbody tr.v-custom-indexed-item td.quantity-price, .table.cart-items tbody tr.item-service td.quantity-price { display: block !important } .table.cart-items tbody tr.v-custom-indexed-item .item-remove, .table.cart-items tbody tr.item-service .item-remove { margin-left: auto; position: initial; width: auto } .table.cart-items tbody tr.v-custom-indexed-item .item-remove i.icon.icon-remove.item-remove-ico:before, .table.cart-items tbody tr.item-service .item-remove i.icon.icon-remove.item-remove-ico:before { content: "-"; background: var(--Danger); color: #FFF; line-height: 9px; border-radius: 100%; width: 16px; height: 16px; font-size: 27px } @media (max-width: 1024px) { .table.cart-items tbody tr.v-custom-indexed-item, .table.cart-items tbody tr.item-service { border-top: none !important } .table.cart-items tbody tr.v-custom-indexed-item .product-price, .table.cart-items tbody tr.v-custom-indexed-item .quantity, .table.cart-items tbody tr.item-service .product-price, .table.cart-items tbody tr.item-service .quantity { margin: auto !important; width: auto !important; min-width: initial !important } } .table.cart-items tbody tr.v-custom-indexed-item:last-child { margin-bottom: 20px } .table.cart-items tbody tr.v-custom-indexed-item td.product-image { display: none } @media (max-width: 1024px) { .table.cart-items tbody tr.v-custom-indexed-item td.quantity { display: none } } .table.cart-items tbody tr.v-custom-indexed-item td.product-name { margin-left: 0 !important; padding: 0 !important; width: 100% !important; margin-right: 15px } .table.cart-items tbody tr.v-custom-indexed-item p { margin: 0; padding: 0 } .table.cart-items tbody tr:last-child { border-bottom: none } .table.cart-items tbody>tr.v-custom-indexed-item, .table.cart-items tbody>tr[data-parentitemindex] { display: none } .table.cart-items td.product-image a { overflow: hidden; border-radius: 4px } .table.cart-items td.product-image a { margin-right: 20px } .table.cart-items td.product-image a, .table.cart-items td.product-image img { width: 100px; display: block; max-width: initial; height: auto } @media (max-width: 1024px) { .table.cart-items td.product-image a, .table.cart-items td.product-image img { width: 70px } } .table.cart-items td.quantity { margin: 0; display: flex; align-items: center; padding: 0; border-radius: 4px; border: 1px solid var(--MutedFour); float: left; min-width: 30px; text-align: center; justify-content: center } .table.cart-items td.quantity .item-quantity-change { position: initial; left: initial; top: initial; bottom: initial; height: initial; display: flex; align-items: center; justify-content: center; padding: 0 } .summary-template-holder { background: #fff; padding: 20px; text-align: left; box-sizing: border-box; border-radius: 4px; position: sticky; top: 20px; border: none } .summary-template-holder .summary-totalizers, .summary-template-holder .summary-coupon-wrap { width: 100% !important } .summary-template-holder .cart-more-options { display: none !important } .summary-template-holder .summary-coupon { text-align: center; margin: 0 auto !important; min-width: initial } .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data { display: none !important } .summary-template-holder .summary-coupon fieldset.coupon-fieldset p { margin: 0; color: var(--MutedTwo) } .summary-template-holder .summary-coupon fieldset.coupon-fieldset p label { cursor: initial; font-size: 13px } .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data { margin: 0; width: 100% } .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a { width: 100%; text-decoration: underline } .summary-template-holder .summary-coupon fieldset.coupon-fieldset>div { display: flex; justify-content: space-between; align-items: center } .summary-template-holder .summary-coupon fieldset.coupon-fieldset>div[style*="none"] { display: block !important } .summary-template-holder .summary-coupon fieldset.coupon-fieldset>div[style*="flex"] p.coupon-label { display: none } .summary-template-holder .summary-coupon fieldset.coupon-fieldset>div[style*="flex"] p.coupon-fields { width: 100% } .summary-template-holder .summary-coupon p.coupon-fields span { display: flex; width: 100%; position: relative } .summary-template-holder .summary-coupon p.coupon-fields span.info { align-items: center; padding: 0; color: var(--MutedOne) } .summary-template-holder .summary-coupon p.coupon-fields span.info>span { text-align: left; margin-right: 10px; color: var(--ActionPrimary); } .summary-template-holder .summary-coupon p.coupon-fields span input { width: 100%; margin-right: 10px } .summary-template-holder .summary-coupon p.coupon-fields .delete { width: auto } .summary-template-holder .summary-coupon p.coupon-fields .delete #cart-coupon-remove { color: var(--Danger); font-size: 0; display: flex; align-items: center } .summary-template-holder .summary-coupon p.coupon-fields .delete #cart-coupon-remove:before { content: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pg0KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE5LjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPg0KPHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJDYXBhXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgNTEyLjAwMSA1MTIuMDAxIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA1MTIuMDAxIDUxMi4wMDE7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxnPg0KCQk8cGF0aCBkPSJNMjg0LjI4NiwyNTYuMDAyTDUwNi4xNDMsMzQuMTQ0YzcuODExLTcuODExLDcuODExLTIwLjQ3NSwwLTI4LjI4NWMtNy44MTEtNy44MS0yMC40NzUtNy44MTEtMjguMjg1LDBMMjU2LDIyNy43MTcNCgkJCUwzNC4xNDMsNS44NTljLTcuODExLTcuODExLTIwLjQ3NS03LjgxMS0yOC4yODUsMGMtNy44MSw3LjgxMS03LjgxMSwyMC40NzUsMCwyOC4yODVsMjIxLjg1NywyMjEuODU3TDUuODU4LDQ3Ny44NTkNCgkJCWMtNy44MTEsNy44MTEtNy44MTEsMjAuNDc1LDAsMjguMjg1YzMuOTA1LDMuOTA1LDkuMDI0LDUuODU3LDE0LjE0Myw1Ljg1N2M1LjExOSwwLDEwLjIzNy0xLjk1MiwxNC4xNDMtNS44NTdMMjU2LDI4NC4yODcNCgkJCWwyMjEuODU3LDIyMS44NTdjMy45MDUsMy45MDUsOS4wMjQsNS44NTcsMTQuMTQzLDUuODU3czEwLjIzNy0xLjk1MiwxNC4xNDMtNS44NTdjNy44MTEtNy44MTEsNy44MTEtMjAuNDc1LDAtMjguMjg1DQoJCQlMMjg0LjI4NiwyNTYuMDAyeiIvPg0KCTwvZz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjwvc3ZnPg0K"); width: 11px; height: 12px; display: block; line-height: 10px } .summary-template-holder .summary-coupon i.icon-spin.loading-coupon { border: 1px solid #666; border-top: none; border-radius: 100%; font-size: 0; width: 20px; height: 20px; padding: 0; line-height: 0; display: none; margin: 0; position: absolute; top: 25%; right: 10px; z-index: -1 } .summary-template-holder span.link-choose-more-products-wrapper { display: none } .summary-template-holder .cart-links-bottom { float: none; margin: 10px 0 0 0 } .summary-template-holder .cart-links-bottom .btn, .summary-template-holder .cart-links-bottom .summary-coupon fieldset.coupon-fieldset .coupon-data a, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .cart-links-bottom a, .summary-template-holder .cart-links-bottom .orderform-template-holder #payment-data .payment-discounts-list table td.action a, .orderform-template-holder #payment-data .payment-discounts-list table td.action .summary-template-holder .cart-links-bottom a { width: 100%; box-sizing: border-box } .summary-template-holder .cart-links-bottom .btn-success { font-weight: bold } .vtex-front-messages-type-error.vtex-front-messages-template-opened { font-size: 13px; border-radius: 0 !important; border: none !important; background-color: #F4422B; color: var(--Hmblack); display: none !important; } @media (max-width: 1024px) { .summary-template-holder .cart-links-bottom { position: fixed; bottom: 0; width: 100%; left: 0; z-index: 10000 } .summary-template-holder .cart-links-bottom a { border-radius: 0 } } .summary-template-holder .summary-totalizers .table td.space, .summary-template-holder .summary-totalizers .table td.empty, .summary-template-holder .summary-totalizers tbody.shipping-calculate { display: none } .summary-template-holder .shipping-reset { display: none } .summary-template-holder tr:not(.Shipping) { display: flex !important; justify-content: space-between; border: none !important } .summary-template-holder tr:not(.Shipping).CustomTax:not(.CustomTax--total) { display: none !important } .summary-template-holder tbody { border-top: 1px solid var(--MutedFour); border-bottom: 1px solid var(--MutedFour); padding: 15px 0; display: block } .summary-template-holder tbody td { display: inline-block; text-align: left !important; width: auto; color: var(--MutedTwo); font-size: 13px; padding: 0 0 3px 0 !important } .summary-template-holder tbody td.monetary { text-align: right !important; margin-left: auto; float: right } .summary-template-holder tfoot tr td { padding: 14px 0 !important; color: var(--MutedOne); font-size: 14px; font-weight: bold } .summary-template-holder tfoot tr td.monetary { text-align: right !important; margin-left: auto; float: right; color: var(--ActionPrimary); } .summary-coupon { width: 100% !important } .cart-select-gift-placeholder { width: auto !important; display: none !important } .cart-more-options { width: 100% !important; margin: 0 !important; border: none; padding: 0; min-height: 0 !important; display: flex !important; flex-wrap: wrap } .cart-more-options .cart-select-gift-placeholder { display: block !important } .cart-more-options .vtex-shipping-preview-0-x-alert .shp-alert-content.vtex-shipping-preview-0-x-content { display: flex; align-items: center } .cart-more-options .srp-container { max-width: 100% !important } .cart-more-options .srp-container span.error { display: none } .cart-more-options .srp-container .srp-toggle__wrapper label { background: #FFF; padding: 10px 0; border-radius: 4px } .cart-more-options .srp-container .srp-delivery-info .b--light-gray { background: #FFF; border-radius: 4px } .cart-more-options .srp-container select, .cart-more-options .srp-container input[type=text]:not(.pac-target-input) { outline: initial } .cart-more-options .srp-container form.srp-postal-code__form.dib.relative { width: 100% } .cart-more-options .srp-container button.shp-open-options { border-color: var(--ActionPrimaryDark) } .cart-more-options .srp-container .onda-v1 .blue { color: var(--ActionPrimary); outline: none } .cart-more-options .srp-container .onda-v1 .b--blue { border-color: var(--ActionPrimary); outline: none } .cart-more-options .srp-container .onda-v1 .bg-blue { background: var(--ActionPrimary); outline: initial } .cart-more-options .srp-container .vtex-shipping-preview-0-x-pc .ship-country { width: 98% } .cart-more-options .srp-container .vtex-shipping-preview-0-x-pc .btn, .cart-more-options .srp-container .vtex-shipping-preview-0-x-pc .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .cart-more-options .srp-container .vtex-shipping-preview-0-x-pc a, .cart-more-options .srp-container .vtex-shipping-preview-0-x-pc .orderform-template-holder #payment-data .payment-discounts-list table td.action a, .orderform-template-holder #payment-data .payment-discounts-list table td.action .cart-more-options .srp-container .vtex-shipping-preview-0-x-pc a { height: 40px; outline: initial; border-radius: 4px } .cart-more-options .srp-container .ship-postalCode { width: auto !important; max-width: 190px } .cart-more-options .srp-container .ship-postalCode input#ship-postalCode { width: 100% } .cart-more-options .cart-select-gift-placeholder, .cart-more-options #shipping-preview-container { margin: 20px; width: 100% } @media (min-width: 1025px) { .cart-more-options .cart-select-gift-placeholder { margin-bottom: 0 } } .cart-more-options .cart-select-gift-placeholder:empty { display: none } .cart-more-options #shipping-preview-container { width: 100% !important } @media (max-width: 1024px) { .cart-more-options #shipping-preview-container { display: none !important } } .cart-more-options .vtex-pickup-points-modal-3-x-pickupViewMode .btn, .cart-more-options .vtex-pickup-points-modal-3-x-pickupViewMode .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .cart-more-options .vtex-pickup-points-modal-3-x-pickupViewMode a, .cart-more-options .vtex-pickup-points-modal-3-x-pickupViewMode .orderform-template-holder #payment-data .payment-discounts-list table td.action a, .orderform-template-holder #payment-data .payment-discounts-list table td.action .cart-more-options .vtex-pickup-points-modal-3-x-pickupViewMode a { padding: 13px 0 } .cart-select-gift-placeholder .available-gift-item.active { background: var(--ActionSecondary); } .cart-select-gift-placeholder .label-vertical-group:hover, .cart-select-gift-placeholder .icon-check-empty, .cart-select-gift-placeholder .icon-check-sign { color: var(--MutedTwo) } .cart-select-gift-placeholder .label-vertical-group:hover .icon-check-empty, .cart-select-gift-placeholder .icon-check-sign { color: var(--ActionPrimary); } .body-cart-vertical .cart-template-holder { width: calc(70% - 20px) } @media (max-width: 1024px) { .body-cart-vertical .cart-template-holder { width: 100% } } .body-cart-vertical .summary-template-holder { width: 30% } @media (max-width: 1024px) { .body-cart-vertical .summary-template-holder { width: 100%; margin-top: 20px } } .body-cart-vertical .cart-template.full-cart.active { display: flex; flex-flow: wrap; justify-content: space-between; align-items: flex-start } .body-cart-vertical .cart-template.full-cart.active .extensions-checkout-buttons-container { width: auto !important; margin: 0 } .body-cart-vertical .cart-template.full-cart.active .totalizers.summary-totalizers.cart-totalizers { width: 100%; padding: 0; margin: 0 } .client-pre-email { background: none; width: 100%; border-top: none; position: relative; text-align: left } .client-pre-email fieldset.pre-email { box-sizing: border-box } .client-pre-email label { margin: 0; line-height: 20px } .client-pre-email label small { font-size: 12px; padding: 0; margin: 0; color: var(--MutedOne); font-weight: 400; margin: 0; vertical-align: top; display: block; margin-bottom: 13px; margin-top: 20px } .client-pre-email .link-cart { display: none } .client-pre-email h3.client-pre-email-h { margin: 0 } .client-pre-email h3.client-pre-email-h span { display: block; position: relative; font-size: 0; padding: 7px 0 !important } .client-pre-email h3.client-pre-email-h span:after { content: "Email"; vertical-align: middle; display: inline-block; margin: 0 } .client-pre-email h3.client-pre-email-h span:after { padding: 0 !important } .client-pre-email h3.client-pre-email-h .link-box-edit { display: none } .client-pre-email a#orderform-to-cart { color: var(--ActionPrimary); } .client-pre-email .client-email.input.text { margin: 0; width: 100%; position: initial } .client-pre-email .client-email.input.text input[type="email"] { width: 100%; box-sizing: border-box } .client-pre-email .client-email.input.text .btn-success { width: 20%; margin: 0; height: initial; position: absolute; top: initial; bottom: 15px; right: initial; left: 50%; transform: translateX(-50%); min-width: 55% } @media (max-width: 1024px) { .client-pre-email .client-email.input.text .btn-success { width: calc(100% - 60px) } } .client-pre-email .client-email.input.text .loading-inline { position: absolute; color: #FFF; font-size: 16px; bottom: 35px; top: initial; right: 50% !important; margin-right: -10px } .client-pre-email .client-email.input.text .loading-inline[style=""]+#btn-client-pre-email { font-size: 0 } .client-pre-email .emailInfo { margin-top: 20px; width: 80%; box-sizing: border-box } .client-pre-email .emailInfo .icon-ok, .client-pre-email .emailInfo h3 { color: var(--ActionPrimary); } @media (max-width: 1024px) { .client-pre-email .emailInfo { width: 100% } } .client-pre-email .emailInfo .icon-lock { color: #eee } @media (max-width: 1024px) { .client-pre-email .link-cart { display: none !important } } .client-pre-email+.client-profile-data .accordion-body:before { content: "Waiting for more information"; display: block } .client-pre-email+.client-profile-data .accordion-body .accordion-inner { display: none } .client-pre-email+.client-profile-data.filled .accordion-body:before { display: none } .client-pre-email[style*="display: none"] { padding-bottom: 20px !important } .client-pre-email[style*="display: none"] .link-box-edit { display: block !important } .client-pre-email[style*="display: none"] label small { display: none !important } .client-pre-email[style*="display: none"] input#client-pre-email { padding: 0 !important; border: none !important; box-shadow: none !important; font-size: 12px; font-weight: 400; pointer-events: none; cursor: text; background: none !important; color: var(--MutedTwo) } .client-pre-email[style*="display: none"] .emailInfo, .client-pre-email[style*="display: none"] #btn-client-pre-email { display: none } .client-pre-email[style*="display: none"]+.client-profile-data .accordion-body:before { display: none } .client-pre-email[style*="display: none"]+.client-profile-data .accordion-inner { display: block } body:not(.v-custom-step-email) .client-pre-email span.help.error { display: none !important } .payment-group-item-cards .card-flag { width: 32px !important; background-size: auto 20px; min-width: auto; height: 20px } .payment-group-item-cards .card-flag.Visa { background-position: 0 0 } .payment-group-item-cards .card-flag.Mastercard { background-position: -32px 0 } .payment-group-item-cards .card-flag.Diners { background-position: -64px 0 } .payment-group-item-cards .card-flag.Amex, .payment-group-item-cards .card-flag.American { background-position: -96px 0 } .payment-group-item-cards .card-flag.Hipercard { background-position: -128px 0 } .payment-group-item-cards .card-flag.Discover { background-position: -160px 0 } .payment-group-item-cards .card-flag.Aura { background-position: -192px 0 } .payment-group-item-cards .card-flag.Banricompras { background-position: -224px 0 } .payment-group-item-cards .card-flag.Elo { background-position: -256px 0 } .payment-group-item-cards .card-flag.JCB { background-position: -288px 0 } .payment-group-item-cards .card-flag.Cabal { background-position: -320px 0 } .payment-group-item-cards .card-flag.Maestro { background-position: -352px 0 } .payment-group-item-cards .card-flag.Credz { background-position: -384px 0 } .orderform-template-holder .step .input.text label, .vcustom--vtex-omnishipping-1-x-address label { margin: 10px 0 5px 0; display: block; color: #999 } @keyframes placeHolderShimmer { 0% { background-position: -468px 0 } 100% { background-position: 468px 0 } } .orderform-template .cart-template.mini-cart .cart .cart-items:not(.v-loaded) li.item:after, .js-v-custom-is-loadAddress #shipping-data .accordion-group.shipping-data:after, .js-v-custom-is-loading .vcustom--vtex-omnishipping-1-x-address:before { animation-duration: 1.25s; animation-fill-mode: forwards; animation-iteration-count: infinite; animation-name: placeHolderShimmer; animation-timing-function: linear; background: darkgray; background: linear-gradient(to right, #eee 10%, #ddd 18%, #eee 33%); background-size: 800px 104px } svg.pickup-marker-blue, svg.pickup-marker-blue path, svg.pkpmodal-pickup-point-marker-image, svg.pkpmodal-pickup-point-marker-image path, svg.vtex-omnishipping-1-x-svg, svg.vtex-omnishipping-1-x-svg path, svg.pkpmodal-pickup-point-best-marker-image path:not([fill="white"]) { fill: var(--ActionPrimary); } @media (max-width: 1024px) { .container.container-main.container-order-form { width: calc(100% - 20px) } } .orderform-template-holder #client-profile-data { width: 100% } .orderform-template-holder #client-profile-data form.client-pre-email, .orderform-template-holder #client-profile-data .step.client-profile-data, .orderform-template-holder #shipping-data, .orderform-template-holder #payment-data { width: 100% !important; padding: 0; margin: 0; box-sizing: border-box; background: transparent !important; border-radius: 4px; margin-bottom: 20px !important; z-index: initial; border: none; padding: 30px 30px 30px 0; } @media (max-width: 1024px) { .orderform-template-holder #client-profile-data form.client-pre-email, .orderform-template-holder #client-profile-data .step.client-profile-data, .orderform-template-holder #shipping-data, .orderform-template-holder #payment-data { padding: 20px } } .orderform-template-holder #client-profile-data form.client-pre-email.client-pre-email, .orderform-template-holder #client-profile-data .step.client-profile-data.client-pre-email, .orderform-template-holder #shipping-data.client-pre-email, .orderform-template-holder #payment-data.client-pre-email { display: block !important; padding-bottom: calc(40px + 14px + 30px) } .orderform-template-holder #client-profile-data form.client-pre-email .link-box-edit, .orderform-template-holder #client-profile-data .step.client-profile-data .link-box-edit, .orderform-template-holder #shipping-data .link-box-edit, .orderform-template-holder #payment-data .link-box-edit { background: none; box-shadow: none; border: none; color: var(--ActionPrimary); outline: none; position: absolute; right: 0; top: 50%; padding: 1px; font-size: 14px; transform: translateY(-50%); opacity: 0.7; transition: all ease 0.2s } .orderform-template-holder #client-profile-data form.client-pre-email .link-box-edit:hover, .orderform-template-holder #client-profile-data .step.client-profile-data .link-box-edit:hover, .orderform-template-holder #shipping-data .link-box-edit:hover, .orderform-template-holder #payment-data .link-box-edit:hover { opacity: 1 } .orderform-template-holder #client-profile-data form.client-pre-email .link-box-edit i.icon-spinner, .orderform-template-holder #client-profile-data .step.client-profile-data .link-box-edit i.icon-spinner, .orderform-template-holder #shipping-data .link-box-edit i.icon-spinner, .orderform-template-holder #payment-data .link-box-edit i.icon-spinner { font-size: 17px; position: absolute; right: 0; display: none; top: -7px } .orderform-template-holder #client-profile-data form.client-pre-email .link-box-edit.active i.icon-edit, .orderform-template-holder #client-profile-data .step.client-profile-data .link-box-edit.active i.icon-edit, .orderform-template-holder #shipping-data .link-box-edit.active i.icon-edit, .orderform-template-holder #payment-data .link-box-edit.active i.icon-edit { display: none } .orderform-template-holder #client-profile-data form.client-pre-email .link-box-edit.active i.icon-spinner, .orderform-template-holder #client-profile-data .step.client-profile-data .link-box-edit.active i.icon-spinner, .orderform-template-holder #shipping-data .link-box-edit.active i.icon-spinner, .orderform-template-holder #payment-data .link-box-edit.active i.icon-spinner { display: block } .orderform-template-holder #client-profile-data form.client-pre-email .accordion-toggle, .orderform-template-holder #client-profile-data .step.client-profile-data .accordion-toggle, .orderform-template-holder #shipping-data .accordion-toggle, .orderform-template-holder #payment-data .accordion-toggle { padding: 0 } .orderform-template-holder #client-profile-data form.client-pre-email .accordion-toggle>i, .orderform-template-holder #client-profile-data .step.client-profile-data .accordion-toggle>i, .orderform-template-holder #shipping-data .accordion-toggle>i, .orderform-template-holder #payment-data .accordion-toggle>i { display: none } .orderform-template-holder #client-profile-data form.client-pre-email .accordion-toggle, .orderform-template-holder #client-profile-data form.client-pre-email .accordion-inner, .orderform-template-holder #client-profile-data .step.client-profile-data .accordion-toggle, .orderform-template-holder #client-profile-data .step.client-profile-data .accordion-inner, .orderform-template-holder #shipping-data .accordion-toggle, .orderform-template-holder #shipping-data .accordion-inner, .orderform-template-holder #payment-data .accordion-toggle, .orderform-template-holder #payment-data .accordion-inner { padding: 0 } .orderform-template-holder #client-profile-data form.client-pre-email input[type=text]:not(.pac-target-input), .orderform-template-holder #client-profile-data form.client-pre-email input[type=tel]:not(.pac-target-input), .orderform-template-holder #client-profile-data form.client-pre-email input[type=email]:not(.pac-target-input), .orderform-template-holder #client-profile-data form.client-pre-email select:not(.pac-target-input), .orderform-template-holder #client-profile-data .step.client-profile-data input[type=text]:not(.pac-target-input), .orderform-template-holder #client-profile-data .step.client-profile-data input[type=tel]:not(.pac-target-input), .orderform-template-holder #client-profile-data .step.client-profile-data input[type=email]:not(.pac-target-input), .orderform-template-holder #client-profile-data .step.client-profile-data select:not(.pac-target-input), .orderform-template-holder #shipping-data input[type=tel]:not(.pac-target-input), .orderform-template-holder #shipping-data input[type=email]:not(.pac-target-input), .orderform-template-holder #shipping-data select:not(.pac-target-input), .orderform-template-holder #payment-data input[type=text]:not(.pac-target-input), .orderform-template-holder #payment-data input[type=tel]:not(.pac-target-input), .orderform-template-holder #payment-data input[type=email]:not(.pac-target-input), .orderform-template-holder #payment-data select:not(.pac-target-input) { width: 100%; max-width: 100%; font-family: 'HM-Slussen-Extended-Regular'; } .orderform-template-holder #payment-data p.link.link-gift-card, .orderform-template-holder #payment-data .payment-group-item { box-sizing: border-box; margin: 0 6px 10px 0; border-radius: 4px; border: 1px solid var(--MutedFour); opacity: 1; text-decoration: none; color: var(--MutedOne); transition: all ease 0.3s; padding: 11px; text-align: center; display: flex; align-items: center; justify-content: center; background: var(--MutedFive); float: left; width: 100% } .orderform-template-holder #payment-data p.link.link-gift-card.active, .orderform-template-holder #payment-data .payment-group-item.active { background: #FFF } .orderform-template-holder #payment-data p.link.link-gift-card.active span, .orderform-template-holder #payment-data .payment-group-item.active span { color: #000 } .orderform-template-holder #payment-data p.link.link-gift-card.active, .orderform-template-holder #payment-data p.link.link-gift-card:hover, .orderform-template-holder #payment-data .payment-group-item.active, .orderform-template-holder #payment-data .payment-group-item:hover { box-shadow: 0 0 6px var(--MutedFour); border: 1px solid var(--ActionPrimary); } .orderform-template-holder #payment-data p.link.link-gift-card, .orderform-template-holder #payment-data fieldset.payment-group { width: 100%; left: 0; display: block; background: none; position: relative; margin: 0 } .orderform-template-holder #payment-data #iframe-placeholder-creditCardPaymentGroup { padding-top: 32px } .orderform-template-holder #payment-data #iframe-placeholder-creditCardPaymentGroup>.payment-group-item-cards { display: block; overflow: hidden; position: absolute; right: 0; top: 0 } .orderform-template-holder #payment-data #iframe-placeholder-creditCardPaymentGroup>.payment-group-item-cards .card-flag { opacity: 1 } .orderform-template-holder #payment-data p.link.link-gift-card { margin-bottom: 10px; padding: 0 } .orderform-template-holder #payment-data p.link.link-gift-card a { padding: 10px 10px; display: block; text-align: left } .orderform-template-holder #payment-data .payment-group-list-btn { width: 100% } .orderform-template-holder #payment-data p.link.link-gift-card *, .orderform-template-holder #payment-data .payment-group-item * { font-size: 12px !important; font-weight: bold } .orderform-template-holder #payment-data .payment-group-item { position: relative; height: 40px } .orderform-template-holder #payment-data .payment-group-item:first-child:nth-last-child(n+3), .orderform-template-holder #payment-data .payment-group-item:first-child:nth-last-child(n+3)~.payment-group-item { width: calc(33.3% - 4px) } .orderform-template-holder #payment-data .payment-group-item:first-child:nth-last-child(n+4), .orderform-template-holder #payment-data .payment-group-item:first-child:nth-last-child(n+4)~.payment-group-item { width: calc(25% - 4.8px) } .orderform-template-holder #payment-data .payment-group-item:first-child:nth-last-child(n+5), .orderform-template-holder #payment-data .payment-group-item:first-child:nth-last-child(n+5)~.payment-group-item { width: 100%; margin-right: 0; height: auto } .orderform-template-holder #payment-data .payment-group-item:first-child:nth-last-child(n+5):after, .orderform-template-holder #payment-data .payment-group-item:first-child:nth-last-child(n+5):before, .orderform-template-holder #payment-data .payment-group-item:first-child:nth-last-child(n+5)~.payment-group-item:after, .orderform-template-holder #payment-data .payment-group-item:first-child:nth-last-child(n+5)~.payment-group-item:before { display: none } .orderform-template-holder #payment-data .payment-group-item:first-child:nth-last-child(n+5):hover, .orderform-template-holder #payment-data .payment-group-item:first-child:nth-last-child(n+5)~.payment-group-item:hover { top: 0 } .orderform-template-holder #payment-data .payment-group-item:last-child { margin-right: 0 } .orderform-template-holder #payment-data .payment-group-item:hover { position: relative; background: #FFF; top: -2px } .orderform-template-holder #payment-data .payment-group-item.active:after, .orderform-template-holder #payment-data .payment-group-item.active:before { content: ''; display: block; position: absolute; left: 50%; transform: translateX(-50%); top: 100%; width: 0; height: 0; border-style: solid } .orderform-template-holder #payment-data .payment-group-item.active:after { border-color: #FFF transparent transparent transparent; border-width: 6px } .orderform-template-holder #payment-data .payment-group-item.active:before { border-color: var(--ActionPrimary) transparent transparent transparent; border-width: 7px } .orderform-template-holder #payment-data .gift-card-section.form-step.box-default { padding: 0; margin: 0; width: 100% } .orderform-template-holder #payment-data .gift-card-section.form-step.box-default label { font-weight: bold; color: #000; font-size: 12px } .orderform-template-holder #payment-data p.payment-discounts-options, .orderform-template-holder #payment-data p.gift-card-provider-options { display: flex; align-items: center; padding-bottom: 10px } .orderform-template-holder #payment-data p.payment-discounts-options input, .orderform-template-holder #payment-data p.payment-discounts-options select, .orderform-template-holder #payment-data p.gift-card-provider-options input, .orderform-template-holder #payment-data p.gift-card-provider-options select { margin: 0 10px } .orderform-template-holder #payment-data p.payment-discounts-options label, .orderform-template-holder #payment-data p.gift-card-provider-options label { line-height: 12px; margin: 0 } .orderform-template-holder #payment-data .payment-discounts-list { margin-bottom: 10px } .orderform-template-holder #payment-data .payment-discounts-list .gift-card-provider-group-loyalty-program { border-bottom: 1px solid #eee } .orderform-template-holder #payment-data .payment-discounts-list table { width: 100% } .orderform-template-holder #payment-data .payment-discounts-list table td { padding: 0 } .orderform-template-holder #payment-data .payment-discounts-list table tbody, .orderform-template-holder #payment-data .payment-discounts-list table tr { display: flex; width: 100%; flex-wrap: wrap; align-items: center } .orderform-template-holder #payment-data .payment-discounts-list table td.code, .orderform-template-holder #payment-data .payment-discounts-list table td.number { margin-right: 20px; flex-grow: 1; padding: 0 } .orderform-template-holder #payment-data .payment-discounts-list table #remove-gift-card { text-decoration: underline; color: var(--Danger) } .orderform-template-holder #payment-data input#payment-discounts-code { width: 100% !important } .orderform-template-holder #payment-data #btn-add-gift-card { height: 40px; border-radius: 4px } .orderform-template-holder #payment-data .steps-view { width: 100% !important; padding: 0; min-height: initial } .orderform-template-holder #payment-data .steps-view iframe { margin: 0 } .orderform-template-holder #payment-data p.notification { font-weight: bold; font-weight: 400; color: var(--MutedOne) } .orderform-template-holder #payment-data p.notification:not([style="display: none;"])+.box-step { padding: 0; border: none } @media (min-width: 1025px) { .orderform-template-holder #payment-data:last-child { margin-bottom: 0px !important } } .orderform-template-holder #payment-data .v-custom-payment-item-wrap { box-sizing: border-box; border-radius: 4px; background: #FFF; border: 1px solid var(--MutedFour); color: var(--MutedOne); transition: all ease 0.3s; overflow: hidden; margin-bottom: 10px } .orderform-template-holder #payment-data .v-custom-payment-item-wrap.active, .orderform-template-holder #payment-data .v-custom-payment-item-wrap:hover { border-color: var(--ActionPrimary); box-shadow: 0 0 6px #ddd } .orderform-template-holder #payment-data .v-custom-payment-item-wrap #iframe-placeholder-creditCardPaymentGroup { padding-top: 0 } .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item { border: none; border-bottom: 1px solid transparent; box-shadow: none; margin: 0; width: 100% !important; height: auto; top: 0 } .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item-text:before { content: ""; width: 20px; height: 20px; display: inline-block; border: 1px solid #999; border-radius: 100%; vertical-align: middle; margin: -3px 10px 0 0 } .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item-cards { display: flex; justify-content: flex-end; flex-wrap: wrap } .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item-cards .card-flag:last-child { margin: 0 } @media (max-width: 360px) { .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item-cards { display: none } } .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item.active { background: var(--ActionSecondary); border-bottom: 1px solid var(--ActionPrimary); } .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item.active .payment-group-item-text:before { background: var(--ActionPrimary); border-color: var(--ActionPrimary); box-shadow: inset 0 0 0 3px #FFF } .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item.active .payment-group-item-cards span { opacity: 1 } .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item:hover .payment-group-item-text:before { border-color: var(--ActionPrimary); } .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item:before, .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item:after { display: none } .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item#payment-group-payPalPaymentGroup { position: relative } .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item#payment-group-payPalPaymentGroup:after { content: ""; width: 50px; height: 20px; display: block; background: url("https://io.vtex.com.br/checkout-ui/v6.18.19/img/payment-paypal-landscape.png") center no-repeat; background-size: contain; position: absolute; top: 50%; transform: translateY(-50%); right: 12px; left: initial; border: none } .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item#payment-group-AffirmPaymentGroup:after { content: ""; width: 65px; height: 25px; display: block; background: url(https://cdn-assets.affirm.com/images/black_logo-transparent_bg.png) center no-repeat; background-size: contain; position: absolute; top: 49%; transform: translateY(-50%); right: 3px; left: initial; border: none } .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item.active+div, .orderform-template-holder #payment-data .v-custom-payment-item-wrap.active>div { padding: 20px; overflow: hidden; box-sizing: border-box } .orderform-template-holder #payment-data .v-custom-payment-item-wrap .SecurityEnvironmentIcon { display: none } .orderform-template-holder .step { border: none; padding: 0; background: none; margin-bottom: 0 } @media (max-width: 1024px) { .orderform-template-holder .step { width: 100% } } .orderform-template-holder .step .box-info { color: var(--MutedOne) } .orderform-template-holder .step .box-info[style*="display: block"] { margin-top: 10px } .orderform-template-holder .step .form-step fieldset { width: 100%; float: none } .orderform-template-holder .step .form-step fieldset p { position: relative; top: 0; left: 0; } @media (max-width: 1024px) { .orderform-template-holder .step .form-step fieldset p { float: none !important } } .orderform-template-holder .step .form-step fieldset p.client-last-name, .orderform-template-holder .step .form-step fieldset p.client-first-name { width: calc(50% - 5px); position: relative } @media (max-width: 1024px) { .orderform-template-holder .step .form-step fieldset p.client-last-name, .orderform-template-holder .step .form-step fieldset p.client-first-name { width: 100% } .orderform-template-holder .step .form-step fieldset p.client-last-name input[type="text"], .orderform-template-holder .step .form-step fieldset p.client-first-name input[type="text"] { width: 100% !important } } .orderform-template-holder .step .form-step fieldset p span.help.error { position: absolute; font-size: 11px; margin-top: 0 } .orderform-template-holder .step .form-step fieldset.box-payment-option h3 { display: none } .orderform-template-holder .step .form-step #is-corporate-client { color: var(--ActionPrimary); } .orderform-template-holder .step.client-profile-data .client-notice.notice { margin: 0 0 10px 0 } .orderform-template-holder .step.client-profile-data .box-client-info { margin-bottom: 20px } .orderform-template-holder .step.client-profile-data .client-document, .orderform-template-holder .step.client-profile-data .client-phone { width: calc(50% - 5px) } @media (max-width: 1024px) { .orderform-template-holder .step.client-profile-data .client-document, .orderform-template-holder .step.client-profile-data .client-phone { width: 100% } } .orderform-template-holder .step.shipping-data .box-step { display: flex; flex-wrap: wrap } .orderform-template-holder .step.shipping-data .box-step>* { width: 100%; order: 1 } .orderform-template-holder .step.shipping-data .box-step>*.vtex-omnishipping-1-x-addressFormPart1 { order: 1 } .orderform-template-holder .step.shipping-data .box-step>*.vtex-omnishipping-1-x-addressForm { order: 2 } .orderform-template-holder .step.shipping-data .box-step>*.vtex-omnishipping-1-x-addressInfo { order: 3 } .orderform-template-holder .step.shipping-data .box-step>*.vtex-omnishipping-1-x-deliveryGroup { order: 4 } .orderform-template-holder .step.shipping-data .box-step>*.vtex-omnishipping-1-x-submitPaymentButton { order: 100 } .orderform-template-holder .step.shipping-data .box-step>*.btn-link.vtex-omnishipping-1-x-btnDelivery, .orderform-template-holder .step.shipping-data .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .box-step>a.vtex-omnishipping-1-x-btnDelivery, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .orderform-template-holder .step.shipping-data .box-step>a.vtex-omnishipping-1-x-btnDelivery { order: 5; margin-top: 20px; background: var(--ActionPrimary); } .orderform-template-holder .step.shipping-data .box-step>*#postalCode-finished-loading, .orderform-template-holder .step.shipping-data .box-step>*:last-child { margin: 0 } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-address { margin: 0 } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-addressSummaryActive .address-summary { background: url("data:image/svg+xml;utf8, ") no-repeat; background-position: 12px 9px; border: 1px solid var(--MutedFour) } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-content { align-items: center } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-deliveryChannelsOption { background: #FFF } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-pickupButton, .orderform-template-holder .step.shipping-data .vtex-pickup-points-modal-3-x-pickupViewOptionActive, .orderform-template-holder .step.shipping-data .vtex-pickup-points-modal-3-x-pickupViewOptionActive:hover, .orderform-template-holder .step.shipping-data .vtex-pickup-points-modal-3-x-pickupViewOptionActive:active, .orderform-template-holder .step.shipping-data .vtex-pickup-points-modal-3-x-pickupViewOptionActive:focus, .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-deliveryChannelsTogglePickup, .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-deliveryChannelsOption.vtex-omnishipping-1-x-deliveryOptionActive { background: var(--ActionPrimary); border-color: var(--ActionPrimary); border-radius: 4px } .orderform-template-holder .step.shipping-data .vtex-pickup-points-modal-3-x-pickupViewOptionInctive { color: var(--ActionPrimary); border-color: var(--ActionPrimary); border-radius: 4px } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-addressItemOption:hover, .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-active { background-color: var(--ActionSecondary); } .orderform-template-holder .step.shipping-data .shipping-method-toggle { border-color: var(--ActionPrimary); } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-alert { border-color: var(--Warning); display: flex; align-items: center } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-linkEdit { text-decoration: underline } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-deliveryChannelsWrapper, .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-deliveryChannelsToggle { border-radius: 4px } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-deliveryChannelsWrapper { border: 1px solid var(--MutedFour); width: 100%; overflow: hidden; margin: 0 0 20px 0 } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-summaryChange { background: var(--ActionSecondary); border-color: var(--MutedFour); color: var(--ActionPrimary); } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-leanShippingGroupList { border-color: #eee; margin: 0 } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-option:hover, .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-leanShippingOptionActive, .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-leanShippingOption { background: #FFF !important } .orderform-template-holder .step.shipping-data .vtex-pickup-points-modal-3-x-modalDetailsBackLnk svg path, .orderform-template-holder .step.shipping-data .vtex-pickup-points-modal-3-x-modalDetailsBackLnk { color: var(--MutedTwo); fill: var(--MutedTwo) } .orderform-template-holder .step.shipping-data .vtex-pickup-points-modal-3-x-primary { outline: none; background: var(--ActionPrimary); border-color: var(--ActionPrimary); } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-pickupPointChange { border-color: var(--ActionPrimary); } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-address p { clear: both; float: none; margin: 0 } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-address p.input.ship-checkboxNumberLabel.text { width: auto; align-self: flex-end; display: flex; align-items: center; margin-left: 10px !important; height: 40px; display: none; } .orderform-template-holder .step.shipping-data input#ship-addressQuery { width: 100% } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-container.shp-pickup-receiver { display: block } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-container.shp-pickup-receiver svg.person-blue path { fill: var(--ActionPrimary); } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-container.shp-pickup-receiver .vtex-omnishipping-1-x-btn { color: var(--ActionPrimary); } @media (max-width: 490px) { .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-dateLink { width: 100% } } .orderform-template-holder .step .submit.btn.btn-success, .orderform-template-holder .step .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data a.submit.btn-success, .summary-template-holder .summary-coupon fieldset.coupon-fieldset .coupon-data .orderform-template-holder .step a.submit.btn-success, .orderform-template-holder .step #payment-data .payment-discounts-list table td.action a.submit.btn-success, .orderform-template-holder #payment-data .payment-discounts-list table td.action .step a.submit.btn-success { display: block; margin: 20px auto 0 auto; width: 100%; } .orderform-template { display: flex !important; padding-top: 0px; min-height: 400px !important; align-items: flex-start } @media (max-width: 1024px) { .orderform-template { flex-wrap: wrap } } .orderform-template .orderform-template-holder { width: 100% } @media (max-width: 1024px) { .orderform-template { width: 100%; padding-top: 0px } } .orderform-template .cart-template.mini-cart { width: 39%; min-width: 255px; position: -webkit-sticky; position: -moz-sticky; position: -o-sticky; position: -ms-sticky; position: sticky; bottom: 0px; top: 20px; right: 0; float: right; margin: 0 } @media (max-width: 1024px) { .orderform-template .cart-template.mini-cart { width: 100%; position: relative; top: 0 } } .orderform-template .cart-template.mini-cart .cart-items>.v-custom-indexed-item { display: none !important } .orderform-template .cart-template.mini-cart .cart-fixed { height: auto !important; position: relative !important; max-width: 100%; width: 100% !important; top: 0; min-height: initial } @media (min-width: 1025px) { .orderform-template .cart-template.mini-cart .cart-fixed.affix-top { position: relative !important } } .orderform-template .cart-template.mini-cart h2 { text-align: left; border-top: none; background: none !important; margin-bottom: 15px } .orderform-template .cart-template.mini-cart .quantity { min-width: 10px; width: auto; height: 10px; display: inline-block; background: var(--ActionSecondary); color: var(--ActionPrimary); } .orderform-template .cart-template.mini-cart .summary-template-holder { width: 100%; background: none; border: none; padding: 0 } .orderform-template .cart-template.mini-cart .summary-template-holder .accordion-inner { margin-top: 0px } .orderform-template .cart-template.mini-cart .summary-template-holder .summary>.summary-coupon-wrap, .orderform-template .cart-template.mini-cart .summary-template-holder .summary-coupon-wrap>.summary-coupon { display: block !important } .orderform-template .cart-template.mini-cart .summary-template-holder .summary-coupon p { margin: 0 } .orderform-template .cart-template.mini-cart .summary-template-holder .summary>.summary-coupon-wrap { border: none; } .orderform-template .cart-template.mini-cart .summary-template-holder input[type=text], .orderform-template .cart-template.mini-cart .summary-template-holder button[type=submit], .orderform-template .cart-template.mini-cart .summary-template-holder p.coupon-fields span.info>span { line-height: 30px !important; height: 30px !important } .orderform-template .cart-template.mini-cart .item { padding: 10px 0; margin: 0; border: none; border-bottom: 1px solid #eee } .orderform-template .cart-template.mini-cart .item:last-child { border: none } .orderform-template .cart-template.mini-cart .item ul.service-list.unstyled { margin: 0; float: none; width: 100%; background: none; display: inline-block; clear: both } .orderform-template .cart-template.mini-cart .item .service-item, .orderform-template .cart-template.mini-cart .item.v-custom-indexed-item { background: var(--ActionSecondary); border: 1px dashed var(--MutedFour); border-radius: 4px; width: 100%; display: flex; align-items: center; justify-content: space-between; box-sizing: border-box; padding: 5px 10px; margin: 10px 0 0 0 } .orderform-template .cart-template.mini-cart .item .service-item .description, .orderform-template .cart-template.mini-cart .item.v-custom-indexed-item .description { margin-top: 0 } .orderform-template .cart-template.mini-cart .item .service-item>a, .orderform-template .cart-template.mini-cart .item .service-item .quantity, .orderform-template .cart-template.mini-cart .item .service-item .shipping-date, .orderform-template .cart-template.mini-cart .item .service-item .item-subscription, .orderform-template .cart-template.mini-cart .item.v-custom-indexed-item>a, .orderform-template .cart-template.mini-cart .item.v-custom-indexed-item .quantity, .orderform-template .cart-template.mini-cart .item.v-custom-indexed-item .shipping-date, .orderform-template .cart-template.mini-cart .item.v-custom-indexed-item .item-subscription { display: none } .orderform-template .cart-template.mini-cart .item .service-item .price, .orderform-template .cart-template.mini-cart .item.v-custom-indexed-item .price { margin: 0 } .orderform-template .cart-template.mini-cart .item .service-item:last-child, .orderform-template .cart-template.mini-cart .item.v-custom-indexed-item:last-child { margin-bottom: 0 } .orderform-template .cart-template.mini-cart .item.v-custom-indexed-item .item-unavailable { display: none } .orderform-template .cart-template.mini-cart .item .fn { width: calc(82% - 20px) } .orderform-template .cart-template.mini-cart .item .description { display: flex; justify-content: space-between } .orderform-template .cart-template.mini-cart .item .price, .orderform-template .cart-template.mini-cart .item span.shipping-date { white-space: nowrap } .orderform-template .cart-template.mini-cart .item .url { border-radius: 4px; overflow: hidden } .orderform-template .cart-template.mini-cart .summary-totalizers { margin-bottom: 0 } #go-to-cart-button { position: static; display: block; width: calc(100% - 24px); max-width: 100%; margin: 12px auto 4px; padding: 0; font-size: 14px; text-transform: uppercase; line-height: 1; background: transparent; text-align: left; } #go-to-cart-button a, #go-to-cart-button a:hover, #go-to-cart-button a:focus { display: inline-flex; align-items: center; gap: 8px; color: #000; outline: none !important; } #go-to-cart-button a::before { content: ""; display: inline-block; width: 16px; height: 16px; background: url("data:image/svg+xml;utf8,") no-repeat center / contain; } body.body-cart #go-to-cart-button { display: none !important; } .orderform-template .cart-template.mini-cart .summary-totalizers tbody tr.CustomTax:not(.CustomTax--total) { display: none !important } .orderform-template .cart-template.mini-cart .summary-totalizers tbody td.monetary { text-align: right !important; margin-left: auto; float: right } .orderform-template .cart-template.mini-cart .summary-totalizers tbody+tbody { border-top: none } .orderform-template .cart-template.mini-cart .summary-totalizers tbody.shipping-reset, .orderform-template .cart-template.mini-cart .summary-totalizers tbody.shipping-calculate { display: none !important } .orderform-template .cart-template.mini-cart .summary-totalizers tfoot tr td { padding: 14px 0 !important; color: #000; font-size: 14px; font-weight: bold; text-align: left } .orderform-template .cart-template.mini-cart .summary-totalizers tfoot tr td.monetary { text-align: right !important; margin-left: auto; float: right; color: var(--ActionPrimary); } .orderform-template .cart-template.mini-cart .cart { margin-bottom: 0; max-height: calc(100vh - 355px); overflow: auto } .orderform-template .cart-template.mini-cart .cart::-webkit-scrollbar { width: 6px } .orderform-template .cart-template.mini-cart .cart::-webkit-scrollbar-track { background: transparent; border-radius: 4px } .orderform-template .cart-template.mini-cart .cart::-webkit-scrollbar-thumb { background: var(--MutedFour); border-radius: 30px } .orderform-template .cart-template.mini-cart .cart:hover::-webkit-scrollbar-thumb { background: #eee } .orderform-template .cart-template.mini-cart .cart .cart-items:not(.v-loaded) { max-height: 100px; overflow: hidden } .orderform-template .cart-template.mini-cart .cart .cart-items:not(.v-loaded) li.item { overflow: hidden; position: relative; border: none !important } .orderform-template .cart-template.mini-cart .cart .cart-items:not(.v-loaded) li.item>* { opacity: 0 } .orderform-template .cart-template.mini-cart .cart .cart-items:not(.v-loaded) li.item:after { content: ""; width: 100%; height: 100%; display: block; top: 0px; left: 0; position: absolute } .orderform-template .payment-confirmation-wrap { border: none; padding: 0 } .orderform-template .payment-confirmation-wrap .payment-submit-wrap { margin: 10px 0 0 0 } @media (max-width: 1024px) { .orderform-template .payment-confirmation-wrap .payment-submit-wrap { z-index: 9999; position: static; bottom: 0; width: 100%; left: 0; padding: 0; background: #FFF; margin: 0 !important } .orderform-template .payment-confirmation-wrap .payment-submit-wrap button { border-radius: 0 !important } } @media (max-width: 1024px) { .orderform-template .payment-confirmation-wrap { border: none !important } .orderform-template .payment-confirmation-wrap .payment-submit-wrap, .orderform-template .payment-confirmation-wrap button { margin: 0 !important } } .orderform-template .payment-confirmation-wrap #payment-data-submit:disabled span { display: none } .orderform-template .summary-note { display: none !important } .orderform-template .summary-note p.note-data { display: none !important } .orderform-template .summary-note>div { display: block !important } .orderform-template .summary-note .note-textarea { height: 50px; line-height: 20px; max-width: 100%; width: 100%; font-family: var(--fontFamily); max-height: 100px } .orderform-template .custom-cart-template-wrap { position: relative; background: #FFF; padding: 17px 20px; text-align: left; box-sizing: border-box; border-radius: 4px; border: none } .orderform-template .custom-cart-template-wrap .summary-cart-template-holder { height: auto !important } .orderform-template .custom-cart-template-wrap .summary-template-holder { margin-top: 0 } .step.client-profile-data.active .box-step .form-step[style*="display: block"], .step.shipping-data.active .accordion-inner.shipping-container, #payment-data .box-step form.form-step { display: flex; flex-direction: column; padding-top: 20px !important } .orderform-template-holder #shipping-data .shipping-summary-info, .orderform-template-holder .step .accordion-body p.notification, .client-pre-email+.client-profile-data .accordion-body:before { display: none } body.v-custom-step-shipping #shipping-data .shipping-summary-info, body.v-custom-step-payment #shipping-data .shipping-summary-info { display: block } .steps-view, .gift-card-section, .App.iframe-credit-card-payment-group { background: #FFF } #app-container { min-height: 100vh; background: #FFF } #app-container input[type=text], #app-container input[type=tel], #app-container input[type=email], #app-container select { width: 100% } #app-container span.help.error { margin: 0 !important; display: none } #app-container .SecurityEnvironmentIcon { margin-bottom: 20px; display: none } #app-container .CardForm>div { position: relative; clear: both } #app-container .CardForm .PaymentValue { display: none } #app-container .CardForm input#creditCardpayment-card-0Number[value=""] { background: #FFF; position: relative; z-index: 1 } #app-container .CardForm .SavedCardsList { width: calc(100% - 1px) } #app-container .CardForm .SavedCard .link-delete { right: 8px; top: 50%; margin-top: -10px; border: 1px solid #ccc; background: #FFF; width: 20px; height: 20px; line-height: 17px } #app-container .FormFieldLabel { line-height: 30px } #app-container .PaymentCardFlags { display: none !important; } #app-container .PaymentCardFlags .card-flag-label input { display: none } #app-container .PaymentCardFlags .card-flag-label { width: auto } #app-container .PaymentCardFlags .card-flag { opacity: 0.7; display: none } #app-container .PaymentCardFlags .card-flag.card-selected { opacity: 1; display: block } #app-container input#creditCardpayment-card-0Code, #app-container input#creditCardpayment-card-1Code { width: 100px !important } #app-container .label-vertical-group { padding: 9px } #app-container .label-vertical-group:hover { color: var(--ActionPrimary); } #app-container .label-vertical-group.active { color: var(--ActionPrimary); background: var(--ActionSecondary); } #app-container .label-vertical-group:not(.SavedCard) .card-flag { position: absolute; left: 5px; top: 8px } #app-container .label-vertical-group .icon-ok-circle, #app-container .label-vertical-group .icon-circle-blank { top: 9px } #app-container .label-vertical-group.UseAnotherCard { background-color: #eee; padding: 4px; font-size: 11px; text-decoration: underline } #app-container .label-vertical-group.UseAnotherCard #use-another-card { color: var(--MutedTwo) } #app-container .label-vertical-group.UseAnotherCard:hover #use-another-card { text-decoration: underline; color: #999 } #app-container label.FormFieldLabel { display: block; clear: both; width: auto; margin-right: 10px } #app-container .AddressForm { display: flex; flex-wrap: wrap } #app-container .AddressForm>* { width: 100%; order: 10 } #app-container .AddressForm input { max-width: 100% } #app-container .AddressForm .payment-billing-address-street { order: 1 } #app-container .AddressForm .payment-billing-address-complement { order: 2 } #app-container .AddressForm .payment-billing-address-city { order: 3 } #app-container .AddressForm .payment-billing-address-state { order: 4 } #app-container .AddressForm .PostalCode { order: 5 } .orderform-template .summary-note.js-active { display: block !important } body.js-vcustom-showNoteField .orderform-template .payment-confirmation-wrap { display: block !important } body.js-vcustom-showNoteField .orderform-template .payment-confirmation-wrap .payment-submit-wrap { display: none } body.js-vcustom-showNoteField .orderform-template .summary-note { display: block !important } body.js-vcustom-showNoteField.v-custom-step-payment .orderform-template .payment-confirmation-wrap .payment-submit-wrap { display: block !important } .vcustom-customTax-tot { display: inline-block; position: relative; margin-left: 5px } .vcustom-customTax-tot>span { background: #eee; width: 15px; height: 15px; line-height: 15px; display: inline-block; border-radius: 100%; text-align: center; cursor: pointer } .vcustom-customTax-tot:hover .vcustom-customTax-resume { display: block } .vcustom-customTax-resume { position: absolute; left: calc(100% + 10px); width: 128px; background: #eee; top: 50%; font-size: 11px; padding: 10px; transform: translateY(-50%); display: none } .vcustom-customTax-resume__i { display: flex; justify-content: space-between; margin: 0 } .vcustom-customTax-resume:before { content: ""; display: block; position: absolute; left: -4px; top: calc(50% - 4px); width: 0; height: 0; border: 0 solid transparent; border-top-width: 4px; border-bottom-width: 4px; border-right: 4px solid #eee } .v-custom-addLabels-active-flag { background: #FFF; color: var(--MutedOne); padding: 1px 4px; border-radius: 4px; display: inline-block; align-items: center; font-size: 11px; border: 1px solid var(--MutedFour) } .v-custom-addLabels-active-flag:before { content: ""; display: inline-block; width: 14px; height: 14px; background: url("//io.vtex.com.br/front-libs/bootstrap/2.3.2/img/glyphicons-halflings.png"); background-repeat: no-repeat; background-position: 0 -48px; margin-right: 4px; opacity: 0.9; vertical-align: middle } .v-custom-assemblies { margin: 10px 0 3px 0; overflow: hidden; border-top: 1px solid var(--MutedFour); padding-top: 7px } @media (max-width: 1024px) { .v-custom-assemblies { width: 100%; left: 0; margin-bottom: 2px } } .v-custom-assemblies p { display: none } .v-custom-assemblies__values { list-style: none; padding: 0; margin: 0 } .v-custom-assemblies__values__item strong:after { content: ":" } .v-custom-assemblies__values__item span, .v-custom-assemblies__values__item strong { line-height: 14px } body.v-custom-paymentBuilder-accordion .steps-view { display: none } #shipping-data .accordion-group.shipping-data:after { opacity: 0; transition: all ease 0.3s } .js-v-custom-is-loadAddress .vtex-omnishipping-1-x-warning { display: none !important } .js-v-custom-is-loadAddress #shipping-data .accordion-group.shipping-data:after { content: ""; display: block; opacity: 1; left: 0; top: 0; width: 100%; height: 20px; z-index: 2; margin: 0 0 20px 0; border-radius: 3px } .js-v-custom-is-loadAddress #postalCode-finished-loading+.mb5 { display: none !important } .vcustom--vtex-omnishipping-1-x-address { display: none } body.v-custom-addressForm-on.v-custom-step-shipping .vcustom--vtex-omnishipping-1-x-address { display: block } body.v-custom-addressForm-on.v-custom-step-shipping .v-custom-ship-info { display: flex } body.v-custom-addressForm-on.v-custom-step-shipping .v-custom-ship-info .ship-number { margin-right: 10px } body.v-custom-addressForm-on.v-custom-step-shipping .vtex-omnishipping-1-x-addressForm, body.v-custom-addressForm-on.v-custom-step-shipping .vtex-omnishipping-1-x-deliveryGroup, body.v-custom-addressForm-on.v-custom-step-shipping .vtex-omnishipping-1-x-submitPaymentButton { display: none } .vtex-omnishipping-1-x-submitShippingStepButton { margin: 20px 0 0 0 } body.v-custom-googleForm-on .vtex-omnishipping-1-x-deliveryGroup, body.v-custom-googleForm-on .vtex-omnishipping-1-x-addressForm, body.v-custom-googleForm-on .vtex-omnishipping-1-x-submitPaymentButton, body.v-custom-googleForm-on .vtex-omnishipping-1-x-btnDelivery { display: none } body.v-custom-googleForm-on .alert-noStreet { display: none } .v-custom-googleFormScript-added.v-custom-googleForm-on .accordion-inner.shipping-container>* { display: none } body.v-custom-fnsCustomAddressForm .accordion-inner.shipping-container { padding-top: 0 !important } body.v-custom-fnsCustomAddressForm .accordion-inner.shipping-container { transition: all ease 0.3s } body.v-custom-fnsCustomAddressForm .vtex-omnishipping-1-x-selectDeliveryText+div { margin: 0 !important } body.v-custom-fnsCustomAddressForm .orderform-template-holder p.vtex-omnishipping-1-x-submitPaymentButton.btn-submit-wrapper.btn-go-to-payment-wrapper { margin-bottom: 0 !important } body.v-custom-fnsCustomAddressForm .vtex-omnishipping-1-x-addressFormPart1 .input.ship-country, body.v-custom-fnsCustomAddressForm .vtex-omnishipping-1-x-addressFormPart1 .input.ship-addressQuery, body.v-custom-fnsCustomAddressForm .vtex-omnishipping-1-x-addressFormPart1 .input.ship-postalCode { display: none } body.v-custom-fnsCustomAddressForm.returningUser .vtex-omnishipping-1-x-addressFormPart1 .input.ship-postalCode { display: block } body.v-custom-fnsCustomAddressForm .vtex-omnishipping-1-x-container.shp-pickup-receiver+.vtex-omnishipping-1-x-shippingSectionTitle+#back-to-address-list+.vtex-omnishipping-1-x-addressFormPart1 p.input.ship-postalCode, body.v-custom-fnsCustomAddressForm .vtex-omnishipping-1-x-container.shp-pickup-receiver+.vtex-omnishipping-1-x-shippingSectionTitle+.vtex-omnishipping-1-x-addressFormPart1 p.input.ship-postalCode { display: block } body.v-custom-fnsCustomAddressForm .orderform-template-holder .step.shipping-data .box-step .vtex-omnishipping-1-x-addressFormPart1 { order: 1 } body.v-custom-fnsCustomAddressForm .pac-logo[style*="none"] { border: 0 } body.v-custom-fnsCustomAddressForm .pac-logo[style*="none"]:after { display: none } body.v-custom-fnsCustomAddressForm #shipping-data .accordion-inner+.vcustom--vtex-omnishipping-1-x-address { display: none } body.v-custom-fnsCustomAddressForm div#shipping-data { display: flex; flex-wrap: wrap } body.v-custom-fnsCustomAddressForm div#shipping-data>* { width: 100% } body.v-custom-fnsCustomAddressForm div#shipping-data .step.accordion-group.shipping-data { order: 1 } body.v-custom-fnsCustomAddressForm div#shipping-data .vcustom--vtex-omnishipping-1-x-address { order: 3 } .js-v-custom-is-loading .accordion-inner.shipping-container, .js-v-custom-is-loading .vcustom--vtex-omnishipping-1-x-address { overflow: hidden } .js-v-custom-is-loading .vcustom--vtex-omnishipping-1-x-address { height: 120px; position: relative } .js-v-custom-is-loading .vcustom--vtex-omnishipping-1-x-address:before { content: ""; display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 2 } .js-v-custom-is-loading .accordion-inner.shipping-container>*, .js-v-custom-is-loading .vcustom--vtex-omnishipping-1-x-address>* { opacity: 0.5 } .vcustom--vtex-omnishipping-1-x-address { transition: all ease 0.3s } .vcustom--vtex-omnishipping-1-x-address p.input { float: none; width: 100%; margin: 0 } .vcustom--vtex-omnishipping-1-x-address span.help.error { display: none } .vcustom--vtex-omnishipping-1-x-address input { max-width: initial; width: 100% } .vcustom--vtex-omnishipping-1-x-address input.error+span.help.error, .vcustom--vtex-omnishipping-1-x-address select.error+span.help.error { display: block } .vcustom--vtex-omnishipping-1-x-address__state { display: flex; margin: 0 -5px } .vcustom--vtex-omnishipping-1-x-address__state p.input { margin: 0 5px } @media (max-width: 1024px) { .vcustom--vtex-omnishipping-1-x-address__state { flex-wrap: wrap; margin: 0 } .vcustom--vtex-omnishipping-1-x-address__state p.input.ship-state { margin: 0 } } .pac-container.pac-logo { border: 1px solid var(--MutedFour); border-radius: 4px } .pac-logo:after { background: #fbfbfb url(https://developers.google.com/maps/documentation/images/powered_by_google_on_white.png) no-repeat 10px center; padding: 14px; background-size: 110px } .address-list.vtex-omnishipping-1-x-addressList+p.input.ship-addressQuery.text { display: none } .alert-noStreet { margin: 30px auto 0 auto; text-align: center } body.js-vcustom-hideEmailStep .orderform-template-holder #client-profile-data form.client-pre-email.client-pre-email { display: none !important } body.js-vcustom-hideEmailStep .client-profile-data .accordion-toggle>span:before { content: "1" } body.js-vcustom-hideEmailStep .shipping-data .accordion-toggle:before { content: "2" } body.js-vcustom-hideEmailStep .payment-data .accordion-toggle>span:not(.payment-edit-link):before { content: "3" } body.js-vcustom-hideEmailStep .client-pre-email+.client-profile-data .accordion-body .accordion-inner { display: block } .RTL-checkout select { direction: rtl } .RTL-checkout .cart-template-holder { order: 2 } .RTL-checkout body .main-header .header-link { left: initial; right: 0 } .RTL-checkout body .main-header .checkout-steps { margin-left: initial; margin-right: auto } .RTL-checkout .main-header .logo { order: 2 } .RTL-checkout .summary-template-holder tr .info { order: 2; text-align: right !important } .RTL-checkout .orderform-template-holder #client-profile-data form.client-pre-email .link-box-edit, .RTL-checkout .orderform-template-holder #client-profile-data .step.client-profile-data .link-box-edit, .RTL-checkout .orderform-template-holder #shipping-data .link-box-edit, .RTL-checkout .orderform-template-holder #payment-data .link-box-edit { right: initial; left: 0 } .RTL-checkout .summary-template-holder tbody td.monetary, .RTL-checkout .summary-template-holder tfoot tr td.monetary { margin-right: auto; margin-left: initial !important; text-align: left !important } .RTL-checkout .summary-template-holder .summary-coupon p.coupon-fields span { flex-direction: row-reverse } .RTL-checkout .summary-template-holder .summary-coupon p.coupon-fields span input { margin: 0 0 0 10px } .RTL-checkout .table.cart-items tbody tr .v-custom-product-item-wrap, .RTL-checkout .table.cart-items tbody tr, .RTL-checkout .table.cart-items thead tr, .RTL-checkout .table.cart-items thead tr th.product { flex-direction: row-reverse; text-align: right } .RTL-checkout .table.cart-items tbody tr td.product-name { text-align: right } .RTL-checkout .orderform-template .orderform-template-holder { order: 2; padding: 0 0 0 20px } .RTL-checkout .orderform-template .cart-template.mini-cart .summary-totalizers tfoot tr td.monetary { text-align: left !important } .RTL-checkout br { width: 100%; height: 1px; content: " " !important; display: block !important; clear: both } .RTL-checkout .table.cart-items td.quantity { direction: rtl } .RTL-checkout .checkout-steps_items { direction: rtl } .RTL-checkout .checkout-steps_items .text:before { margin: 0 0 0 7px } .RTL-checkout .srp-toggle__wrapper { direction: rtl } .RTL-checkout .srp-toggle__wrapper .vtex-shipping-preview-0-x-framePickup { left: 0 } .RTL-checkout .srp-toggle__wrapper .vtex-shipping-preview-0-x-frameDelivery { left: 50% } .RTL-checkout .srp-delivery-header.mb3 { direction: rtl; display: flex } .RTL-checkout .srp-delivery-current-many .flex { direction: rtl; text-align: right } .RTL-checkout .step { direction: rtl } .RTL-checkout .step .accordion-toggle>span:before, .RTL-checkout .step .accordion-toggle:before { margin-right: 0 !important; margin-left: 10px !important } .RTL-checkout fieldset.box-client-info-pf { display: flex; flex-wrap: wrap } .RTL-checkout .orderform-template-holder .step .form-step fieldset p, .RTL-checkout .orderform-template-holder .step .form-step fieldset div { width: 100% } .RTL-checkout p.client-first-name, .RTL-checkout p.client-different-document, .RTL-checkout p.client-document, .RTL-checkout p.client-company-ie, .RTL-checkout p.client-company-postal-code, .RTL-checkout p.client-document-type, .RTL-checkout p.payment-card-due-date { margin-left: 10px; margin-right: 0 } .RTL-checkout p.client-document, .RTL-checkout p.client-phone, .RTL-checkout p.client-company-document, .RTL-checkout p.client-company-ie, .RTL-checkout p.client-company-postal-code, .RTL-checkout p.client-company-phone, .RTL-checkout p.payment-card-due-month, .RTL-checkout p.payment-card-lash, .RTL-checkout p.payment-card-due-year { float: right } .RTL-checkout input.success:not([invalid="true"]) { background-position: left top } .RTL-checkout .vtexIdUI .vtexIdUI-page { direction: rtl } .RTL-checkout .vtexIdUI .modal-header .close { left: -1px; right: initial } .RTL-checkout .vtexIdUI .pull-left { float: right } .RTL-checkout .orderform-template-holder .step .box-info p { display: flex; flex-wrap: wrap; width: 100% } .RTL-checkout .vtex-omnishipping-1-x-leanShippingIcon.shp-option-icon, .RTL-checkout .vtex-omnishipping-1-x-addressItemIcon { margin: 0 0 0 10px } .RTL-checkout .vtex-omnishipping-1-x-leanShippingText { padding-right: 10px } .RTL-checkout .address-summary { display: flex; flex-wrap: wrap } .RTL-checkout br.line1-delimiter { width: 100%; height: 1px; content: " " !important; display: block !important; clear: both } .RTL-checkout .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item#payment-group-AffirmPaymentGroup:after, .RTL-checkout .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item#payment-group-payPalPaymentGroup:after { right: initial; left: 10px } .RTL-checkout .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item-text { margin-left: auto; margin-right: inherit } .RTL-checkout .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item-text:before { margin-right: initial; margin-left: 10px } .RTL-checkout .orderform-template-holder #payment-data p.link.link-gift-card a { text-align: right } .RTL-checkout .orderform-template .custom-cart-template-wrap .summary-cart-template-holder { direction: rtl } .RTL-checkout .pull-right { float: left !important } .RTL-checkout .orderform-template .cart-template.mini-cart .item .price { margin-right: auto; direction: initial } .RTL-checkout .orderform-template .cart-template.mini-cart .item .url { float: right; margin: 0 0 0 6px } .RTL-checkout .orderform-template .cart-template.mini-cart .item .fn { text-align: right; float: right } .RTL-checkout .orderform-template .cart-template.mini-cart h2 { text-align: right } .RTL-checkout #go-to-cart-button { text-align: right; } .RTL-checkout #go-to-cart-button a::before { transform: scaleX(-1); } #go-to-cart-button a:hover { text-decoration: underline; color: #737373; } #go-to-cart-button small { font-size: 14px; } .RTL-checkout .vtex-omnishipping-1-x-SummaryItemInfo { border: none; border-left: 1px solid #eee; padding: 0 0 0 6px } .RTL-checkout .vtexIdUI .vtexIdUI-page { direction: rtl } .RTL-checkout .vtexIdUI .modal-header .close { left: -1px; right: initial } .RTL-checkout .vtexIdUI .pull-left { float: right } .RTL-checkout #app-container { direction: rtl } .RTL-checkout #app-container .PaymentCardDueDate.clearfix { display: flex } .RTL-checkout #app-container label.FormFieldLabel { margin: 0 0 0 10px } .RTL-checkout #app-container .PaymentCardCVV { display: flex } .RTL-checkout #app-container p.AddressToggle { display: flex } .RTL-checkout #app-container .AddressToggle input { margin: 3px 0 0 5px } #shipping-data .input.ship-country.text { display: none !important; } .whatsappButonCheckout { position: fixed; width: 55px; height: 55px; bottom: 40px; right: 30px; background-color: black; color: #FFF; border-radius: 50px; text-align: center; font-size: 30px; box-shadow: 2px 2px 3px #999; z-index: 999999999; overflow: hidden; } .my-float { display: block; position: absolute; width: 50px; height: 50px; background-image: url("data:image/svg+xml,%3csvg%20width='56'%20height='56'%20viewBox='0%200%2056%2056'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3ccircle%20cx='28'%20cy='28'%20r='28'%20fill='black'/%3e%3cpath%20d='M23%2026.75H25V25.25H23V26.75Z'%20fill='white'/%3e%3cpath%20d='M29%2026.75H27V25.25H29V26.75Z'%20fill='white'/%3e%3cpath%20d='M31%2026.75H33V25.25H31V26.75Z'%20fill='white'/%3e%3cpath%20fill-rule='evenodd'%20clip-rule='evenodd'%20d='M38%2037L34%2033H18V19H38V37ZM34.6213%2031.5H19.5V20.5H36.5V33.3787L34.6213%2031.5Z'%20fill='white'/%3e%3c/svg%3e"); background-size: contain; top: 50%; left: 50%; transform: translate(-50%, -50%); background-repeat: no-repeat; } @media (max-width: 1024px) { body:has(.cart-template.full-cart.span12.active) .whatsappButonCheckout { display: none; } } #chatbot-container .cw-trigger-wrapper { gap: 0; bottom: 40px; right: 30px; } #chatbot-container .cw-trigger-label { display: none; } #chatbot-container .cw-trigger-btn { width: 100%; height: 100%; background-color: transparent; background-size: 50px 50px; background-position: center; box-shadow: none; transform: translate(-50%, -50%); transition: none; } #chatbot-container .cw-trigger-btn:hover { transform: translate(-50%, -50%); } #chatbot-container .cw-trigger-btn svg { display: none; } #app-container .PaymentInstallments .FormFieldLabel { font-size: 0px; } #app-container .PaymentInstallments .FormFieldLabel::before { content: 'Cuotas disponibles:'; font-family: 'HM-Slussen-Extended-Regular'; font-size: 12px; color: var(--Hmblack); text-transform: uppercase; } @media (max-width: 1024px) { .RTL-checkout.body-cart-vertical .summary-template-holder { order: 2 } } @media (max-width: 1024px) { .RTL-checkout .orderform-template .cart-template.mini-cart { order: 2 } } @media (max-width: 1024px) { .RTL-checkout .table.cart-items td.product-image a { margin-right: 0; margin-left: 20px } .RTL-checkout .full-cart .cart table tbody tr td.product-image, .RTL-checkout .full-cart .cart table tbody tr td.bundle-item-image { left: initial; right: 0 } .RTL-checkout .table.cart-items td.quantity { float: right } .RTL-checkout .full-cart .cart table tbody tr td.product-name a, .RTL-checkout .full-cart .cart table tbody tr td.bundle-item-name span { padding: 0 0 0 20px } .RTL-checkout .full-cart .cart table tbody tr td.product-price { float: left } .RTL-checkout .full-cart .cart table tbody tr td.item-remove { left: 0; right: initial } } body.debug-on>*:not(.container-main):not(.main-header):not(.main-footer):not(#vtexIdContainer):not(.vtex-front-messages-placeholder):not(.pac-container) { display: none } [data-days] { font-size: 0px !important; } [data-days]::before { content: attr(data-days); font-weight: bold; font-size: 13px; } .orderform-template-holder .link-box-edit::before { content: "Editar"; font-size: 12px; text-decoration: underline; } .orderform-template-holder .link-box-edit i { display: none !important; } /** Loyalty **/ .forms.coupon-column.summary-coupon-wrap { padding-top: 0px !important; } .orderform-template-holder .link-box-edit i { display: none !important; } .summary-coupon-wrap .coupon-label label { font-size: 0px !important; } .summary-coupon-wrap .coupon-label { text-align: left; } .summary-coupon-wrap .coupon-label label::after { font-size: 12px !important; font-family: 'HM-Slussen-Regular'; content: 'AÑADIR UN CÓDIGO DE DESCUENTO'; text-align: left; } .forms.coupon-column { margin: 0 !important; } input[type="checkbox"]#termsCheckbox, input[type="checkbox"][name="option-utm"] { box-sizing: border-box; min-width: 25px; width: 24px; height: 24px !important; margin: 6px 6px 26px; border: 1px solid var(--Hmblack); appearance: none; background-color: transparent; outline: none; border-radius: 0; transition: outline 0.1s; } input[type="checkbox"]:checked#termsCheckbox, input[type="checkbox"]:checked[name="option-utm"] { background-size: cover; padding: 2px; } input[type="checkbox"]:not(:disabled):checked#termsCheckbox, input[type="checkbox"]:not(:disabled):checked[name="option-utm"] { border-color: var(--Hmblack); background-image: url('data:image/svg+xml;utf8,'); } input[type="checkbox"]:disabled#termsCheckbox, input[type="checkbox"]:disabled[name="option-utm"] { background-color: #d9d9d9; } input[type="checkbox"]:disabled:checked#termsCheckbox, input[type="checkbox"]:disabled:checked[name="option-utm"] { background-image: url('data:image/svg+xml;utf8,'); } .cart { display: none !important; } .container-main:has(.empty-cart-content[style="display: block;"]) .loading.loading-bg.loading-custom { display: none !important; } @media (max-width: 1024px) { .table.cart-items .product-item.unavailable.lookatme { min-height: 190px; display: block !important; } } #client-profile-data .btn-submit-wrapper { position: relative; justify-content: center; gap: 20px; width: 100%; display: grid !important; grid-auto-flow: column; grid-auto-columns: 1fr; .member__open { width: 100%; order: -1; margin-top: 20px; } } @media screen and (max-width: 1024px) { #client-profile-data .btn-submit-wrapper { display: flex !important; flex-direction: column; gap: 0; .member__open { min-height: 61px; margin-bottom: 20px; } } } #client-profile-data .btn-submit-wrapper:has(#memberRegister__open2) { #go-to-shipping::before, #go-to-payment::before { position: absolute; top: 0; left: 0; } #go-to-payment, #go-to-shipping { margin-top: 20px !important; margin-left: 0 !important; margin-right: 0 !important; font-size: 0; padding: 14px !important; min-width: unset; width: 100%; background: white !important; color: black !important; font-weight: bold; order: 2 !important; padding-top: 16px !important; &::before { content: ""; font-size: 0px !important; } &::after { content: "Continuar sin ser miembro"; font-size: 13px; } @media (max-width: 1024px) { margin-top: 0px !important; } } } .product-item .item-link-remove { display: none !important; } .product-item.unavailable .item-link-remove { display: block !important; } /* === Loader unificado HM (30x30, borde 4px transparente, top #e50010, gira 1s linear infinite) === */ .loading.loading-bg::after, .checkEmailAuthConflict__modal--button.js-loading:after, .summary-template-holder .summary-coupon i.icon-spin.loading-coupon, .orderform-template-holder #client-profile-data form.client-pre-email .link-box-edit i.icon-spinner, .orderform-template-holder #client-profile-data .step.client-profile-data .link-box-edit i.icon-spinner, .orderform-template-holder #shipping-data .link-box-edit i.icon-spinner, .orderform-template-holder #payment-data .link-box-edit i.icon-spinner { box-sizing: border-box !important; width: 30px !important; height: 30px !important; border: 4px solid transparent !important; border-top: 4px solid #e50010 !important; border-radius: 50% !important; animation: spin 1s linear infinite !important; background: none !important; padding: 0 !important; font-size: 0 !important; line-height: 0 !important; } /* Variante reducida cuando el loader vive dentro de un botón o link-edit */ .checkEmailAuthConflict__modal--button.js-loading:after, .orderform-template-holder #client-profile-data form.client-pre-email .link-box-edit i.icon-spinner, .orderform-template-holder #client-profile-data .step.client-profile-data .link-box-edit i.icon-spinner, .orderform-template-holder #shipping-data .link-box-edit i.icon-spinner, .orderform-template-holder #payment-data .link-box-edit i.icon-spinner { width: 18px !important; height: 18px !important; border-width: 3px !important; } .product-item.unavailable .hm-nc-product-references .hm-nc-product-references-item { display: none; } .product-item.unavailable .hm-nc-product-references .articuloname { display: block; } body .product-item.unavailable i.icon.icon-remove.item-remove-ico:before { visibility: visible !important; content: '' !important; line-height: 0; content: ""; width: 24px !important; height: 24px !important; background-image: url(data:image/svg+xml,%3Csvg%20role%3D%22img%22%20aria-hidden%3D%22true%22%20focusable%3D%22false%22%20viewBox%3D%220%200%2024%2024%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20height%3D%2224%22%20width%3D%2224%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M9%2017V9.5h1.5V17H9ZM15%2017V9.5h-1.5V17H15Z%20M7.75%202v2.75H2v1.5h1.75V22h16.5V6.25H22v-1.5h-5.75V2h-8.5Zm1.5%201.5v1.25h5.5V3.5h-5.5Zm9.5%202.75H5.25V20.5h13.5V6.25Z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E); background-position: center; background-repeat: no-repeat; background-size: contain; display: flex; } /* shipping */ .orderform-template-holder #client-profile-data form.client-pre-email input[type=text]:not(.pac-target-input), .orderform-template-holder #client-profile-data form.client-pre-email input[type=tel]:not(.pac-target-input), .orderform-template-holder #client-profile-data form.client-pre-email input[type=email]:not(.pac-target-input), .orderform-template-holder #client-profile-data form.client-pre-email select:not(.pac-target-input), .orderform-template-holder #client-profile-data .step.client-profile-data input[type=text]:not(.pac-target-input), .orderform-template-holder #client-profile-data .step.client-profile-data input[type=tel]:not(.pac-target-input), .orderform-template-holder #client-profile-data .step.client-profile-data input[type=email]:not(.pac-target-input), .orderform-template-holder #client-profile-data .step.client-profile-data select:not(.pac-target-input), .orderform-template-holder #shipping-data input[type=text]:not(.pac-target-input), .orderform-template-holder #shipping-data input[type=tel]:not(.pac-target-input), .orderform-template-holder #shipping-data input[type=email]:not(.pac-target-input), .orderform-template-holder #shipping-data select:not(.pac-target-input), .orderform-template-holder #payment-data input[type=text]:not(.pac-target-input), .orderform-template-holder #payment-data input[type=tel]:not(.pac-target-input), .orderform-template-holder #payment-data input[type=email]:not(.pac-target-input), .orderform-template-holder #payment-data select:not(.pac-target-input) { height: 54px !important; box-shadow: unset !important; font-size: 1rem; } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-address p { width: 100%; } .accordion-toggle.collapsed { font-family: 'HM-Slussen-Extended-Semibold'; } .orderform-template-holder #shipping-data { border-top: 0 !important; border-bottom: 0 !important; } #ship-addressQuery { height: 56px; border-radius: 0; } #ship-addressQuery:focus, #ship-addressQuery:focus-visible { box-shadow: none; } .address-summary { border-radius: 0; } .vtex-omnishipping-1-x-shippingSectionTitle { font-size: 12px; font-family: 'HM-Slussen-Extended-Regular'; font-weight: 400; color: var(--Hmblack); text-transform: uppercase; } .vtex-omnishipping-1-x-leanShippingOption { padding-left: 0 !important; } .vtex-omnishipping-1-x-leanShippingIcon { margin-right: 0; } .vtex-omnishipping-1-x-leanShippingIcon .vtex-omnishipping-1-x-svg { width: 24px; height: 24px; } .vtex-omnishipping-1-x-warning { border: none !important; background-color: #FF9C00; border-radius: 0 !important; } .vtex-omnishipping-1-x-warning .vtex-omnishipping-1-x-unavailableIcon svg { display: none; } .vtex-omnishipping-1-x-warning .vtex-omnishipping-1-x-unavailableIcon { visibility: hidden; } .vtex-omnishipping-1-x-warning .vtex-omnishipping-1-x-unavailableIcon::before { content: ""; visibility: visible; background-image: url("/arquivos/hazmat-1.png"); background-size: 21px; display: inline-block; width: 21px; height: 21px; } #unavailable-delivery-disclaimer, #remove-unavailable-items { font-size: 13px; color: var(--Hmblack); } .vtex-omnishipping-1-x-leanShippingText { font-family: 'HM-Slussen-Extended-Semibold'; color: var(--Hmblack); text-transform: uppercase; font-size: 12px; } .vtex-omnishipping-1-x-leanShippingOption.vtex-omnishipping-1-x-leanShippingOptionActive { display: grid; grid-template-areas: "radio texto" "radio precio"; grid-template-columns: 30px 1fr; } .vtex-omnishipping-1-x-leanShippingIcon { grid-area: radio; } .vtex-omnishipping-1-x-leanShippingText { grid-area: texto; font-family: 'HM-Slussen-Extended-Semibold'; color: var(--Hmblack); text-transform: uppercase; font-size: 12px; } .vtex-omnishipping-1-x-optionPrice { grid-area: precio; font-size: 13px; font-family: 'HM-Slussen-Extended-Regular'; font-weight: 400; color: var(--Hmblack); text-transform: uppercase; } .vtex-omnishipping-1-x-optionPrice { margin-left: 0 !important; padding-left: 0 !important; text-align: left !important; } #btn-go-to-payment { font-family: 'HM-Slussen-Extended-Semibold'; font-size: 0; border-radius: 0; } #btn-go-to-payment::before { content: "CONTINUAR"; font-size: 12px; color: white; } .address-summary, .vtex-omnishipping-1-x-summaryPackage { font-size: 12px; font-family: 'HM-Slussen-Extended-Regular'; font-weight: 400; color: var(--Hmblack); text-transform: uppercase; } #open-shipping { border: none; border-radius: 0; background-color: white; font-family: 'HM-Slussen-Extended-Semibold'; color: var(--Hmblack); text-transform: uppercase; font-size: 12px; text-align: left; text-decoration: none; padding-left: 0 !important; } #open-shipping:hover { text-decoration: none; } .vtex-omnishipping-1-x-geolocationTitle, .vtex-omnishipping-1-x-subtitle { font-size: 0px !important; visibility: hidden; color: black !important; text-align: left; } .vtex-omnishipping-1-x-geolocationTitle::before { font-size: 16px !important; visibility: visible; content: '· El retiro en tiendas de H&M es gratuito.'; } .vtex-omnishipping-1-x-subtitle::before { font-size: 16px !important; visibility: visible; content: '· Puntos de recolección externos pueden tener un costo adicional.'; } .vtex-omnishipping-1-x-imageAsk { background: #3D3D3D !important; } .vtex-omnishipping-1-x-ask .ask-for-geolocation-ask::after { content: "Seleccione una de las siguientes opciones para encontrar el punto de recolección más cercano"; color: #666; font-size: 15px; display: block; width: 70%; margin: 0 auto 26px; } .vtex-omnishipping-1-x-manualBtn.btn-ask-for-geolocation-manual { border: 1px solid #666; text-decoration: none; font-weight: 700; color: #666; padding: 17px 19px; } .btn-ask-for-geolocation-cta { width: 276px; font-weight: 700; } .vtex-omnishipping-1-x-container { display: none !important; } .cart-more-options .srp-container .srp-data #shipping-calculate-link { color: white; background-color: black; border: none; text-transform: capitalize; margin-top: 0; } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-deliveryChannelsToggle { border: none; background-color: transparent; } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-deliveryChannelsWrapper { border-radius: 11px; } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-deliveryChannelsOption.vtex-omnishipping-1-x-deliveryOptionActive { font-family: 'HM-Slussen-Extended-Regular'; border-radius: 11px; width: 50%; z-index: 2; } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-deliveryChannelsOption.vtex-omnishipping-1-x-deliveryOptionInactive { font-family: 'HM-Slussen-Extended-Regular'; border-radius: 11px; width: 30%; } .vtex-omnishipping-1-x-deliveryChannelsOption { flex: auto !important; } #shipping-option-pickup-in-point span.shp-method-option-text, button#shipping-option-pickup-in-point .vtex-omnishipping-1-x-deliveryChannelsComplement { font-size: 0; } #shipping-option-pickup-in-point span.shp-method-option-text::before { font-size: 14px; content: 'Recoger en punto'; } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-deliveryChannelsWrapper { border-radius: 11px; } .vtex-omnishipping-1-x-isActive { display: flex; } .vtex-omnishipping-1-x-deliveryChannelsComplement { display: block !important; } .orderform-template-holder .step.shipping-data .vtex-omnishipping-1-x-deliveryChannelsOption.vtex-omnishipping-1-x-deliveryOptionActive { border-radius: 11px; width: 50%; z-index: 2; } .vtex-pickup-points-modal-3-x-pickupPointMarker path, .vtex-pickup-points-modal-3-x-pickupPointMarker circle, .vtex-pickup-points-modal-3-x-pickupPointMarker path, .vtex-pickup-points-modal-3-x-pickupPointMarker circle, .vtex-pickup-points-modal-3-x-pickupPointMarker path, .vtex-pickup-points-modal-3-x-pickupPointMarker circle, .vtex-omnishipping-1-x-PickupPointInfo path, .vtex-omnishipping-1-x-PickupPointInfo circle { display: none; } .vtex-pickup-points-modal-3-x-pickupPointMarker svg, .vtex-pickup-points-modal-3-x-pickupPointMarker svg, .vtex-pickup-points-modal-3-x-pickupPointMarker svg, .vtex-omnishipping-1-x-PickupPointInfo svg, .vtex-omnishipping-1-x-PickupPoint .vtex-omnishipping-1-x-PickupPointInfo svg { display: block; background-image: url(/arquivos/logoPickit.png); background-repeat: no-repeat; width: 30px; height: 30px; background-size: inherit; border-radius: 29px; } [id^="Retiro-en-Sucursal-CO00"]:not([id$="14"]) .vtex-pickup-points-modal-3-x-pickupPointMarker svg { display: block; background-image: url(https://hmuruguay.vteximg.com.br/arquivos/hm-checkout.png); background-repeat: no-repeat; background-size: contain; width: 35px; height: 58px; background-position: 0px -7px; } [id^="Retiro-en-Sucursal-CO00"]:not([id$="14"]) .vtex-pickup-points-modal-3-x-pickupPointPrice { font-size: 14px; font-weight: 600; } [id^="Retiro-en-Sucursal-CO00"]:not([id$="14"]) .vtex-pickup-points-modal-3-x-pickupPointAddress, [id^="Retiro-en-Sucursal-CO00"]:not([id$="14"]) .pkpmodal-pickup-point-available { font-size: 10.5px; } [id="1_CO0014"] .vtex-pickup-points-modal-3-x-pickupPointMarker svg, [id="1_CO0001"] .vtex-pickup-points-modal-3-x-pickupPointMarker svg, [id="1_CO0010"] .vtex-pickup-points-modal-3-x-pickupPointMarker svg, [id="1_CO0008"] .vtex-pickup-points-modal-3-x-pickupPointMarker svg, [id="1_CO0003"] .vtex-pickup-points-modal-3-x-pickupPointMarker svg, [id="1_CO0004"] .vtex-pickup-points-modal-3-x-pickupPointMarker svg, [id="1_CO0018"] .vtex-pickup-points-modal-3-x-pickupPointMarker svg, [id="1_CO0011"] .vtex-pickup-points-modal-3-x-pickupPointMarker svg, [id="1_CO0002"] .vtex-pickup-points-modal-3-x-pickupPointMarker svg, [id*="CO0001"] .vtex-pickup-points-modal-3-x-pickupPointMarker svg, [id*="CO0002"] .vtex-pickup-points-modal-3-x-pickupPointMarker svg, [id*="CO0004"] .vtex-pickup-points-modal-3-x-pickupPointMarker svg, [id*="CO0005"] .vtex-pickup-points-modal-3-x-pickupPointMarker svg, [id*="CO0003"] .vtex-pickup-points-modal-3-x-pickupPointMarker svg, [id*="CO0006"] .vtex-pickup-points-modal-3-x-pickupPointMarker svg, [id*="CO0007"] .vtex-pickup-points-modal-3-x-pickupPointMarker svg, [id*="CO0008"] .vtex-pickup-points-modal-3-x-pickupPointMarker svg, [id*="CO0009"] .vtex-pickup-points-modal-3-x-pickupPointMarker svg, [id*="CO0011"] .vtex-pickup-points-modal-3-x-pickupPointMarker svg, [id*="CO0012"] .vtex-pickup-points-modal-3-x-pickupPointMarker svg, [id*="CO0015"] .vtex-pickup-points-modal-3-x-pickupPointMarker svg, [id*="CO0014"] .vtex-pickup-points-modal-3-x-pickupPointMarker svg, [id*="CO0013"] .vtex-pickup-points-modal-3-x-pickupPointMarker svg, [id*="CO0022"] .vtex-pickup-points-modal-3-x-pickupPointMarker svg, [id*="CO0019"] .vtex-pickup-points-modal-3-x-pickupPointMarker svg, [id*="CO0010"] .vtex-pickup-points-modal-3-x-pickupPointMarker svg, [id*="CO0018"] .vtex-pickup-points-modal-3-x-pickupPointMarker svg, [id*="CO0023"] .vtex-pickup-points-modal-3-x-pickupPointMarker svg, [id*="CO0020"] .vtex-pickup-points-modal-3-x-pickupPointMarker svg, [id*="CO0017"] .vtex-pickup-points-modal-3-x-pickupPointMarker svg, [id*="CO0016"] .vtex-pickup-points-modal-3-x-pickupPointMarker svg, [id="1_CO0014"] .vtex-omnishipping-1-x-PickupPointInfo svg, [id="1_CO0001"] .vtex-omnishipping-1-x-PickupPointInfo svg, [id="1_CO0010"] .vtex-omnishipping-1-x-PickupPointInfo svg, [id="1_CO0008"] .vtex-omnishipping-1-x-PickupPointInfo svg, [id="1_CO0003"] .vtex-omnishipping-1-x-PickupPointInfo svg, [id="1_CO0004"] .vtex-omnishipping-1-x-PickupPointInfo svg, [id="1_CO0018"] .vtex-omnishipping-1-x-PickupPointInfo svg, [id="1_CO0011"] .vtex-omnishipping-1-x-PickupPointInfo svg, [id="1_CO0002"] .vtex-omnishipping-1-x-PickupPointInfo svg, [id*="CO0001"] .vtex-omnishipping-1-x-PickupPointInfo svg, [id*="CO0002"] .vtex-omnishipping-1-x-PickupPointInfo svg, [id*="CO0004"] .vtex-omnishipping-1-x-PickupPointInfo svg, [id*="CO0005"] .vtex-omnishipping-1-x-PickupPointInfo svg, [id*="CO0003"] .vtex-omnishipping-1-x-PickupPointInfo svg, [id*="CO0006"] .vtex-omnishipping-1-x-PickupPointInfo svg, [id*="CO0007"] .vtex-omnishipping-1-x-PickupPointInfo svg, [id*="CO0008"] .vtex-omnishipping-1-x-PickupPointInfo svg, [id*="CO0009"] .vtex-omnishipping-1-x-PickupPointInfo svg, [id*="CO0011"] .vtex-omnishipping-1-x-PickupPointInfo svg, [id*="CO0012"] .vtex-omnishipping-1-x-PickupPointInfo svg, [id*="CO0015"] .vtex-omnishipping-1-x-PickupPointInfo svg, [id*="CO0014"] .vtex-omnishipping-1-x-PickupPointInfo svg, [id*="CO0013"] .vtex-omnishipping-1-x-PickupPointInfo svg, [id*="CO0022"] .vtex-omnishipping-1-x-PickupPointInfo svg, [id*="CO0019"] .vtex-omnishipping-1-x-PickupPointInfo svg, [id*="CO0010"] .vtex-omnishipping-1-x-PickupPointInfo svg, [id*="CO0018"] .vtex-omnishipping-1-x-PickupPointInfo svg, [id*="CO0023"] .vtex-omnishipping-1-x-PickupPointInfo svg, [id*="CO0020"] .vtex-omnishipping-1-x-PickupPointInfo svg, [id*="CO0017"] .vtex-omnishipping-1-x-PickupPointInfo svg, [id*="CO0016"] .vtex-omnishipping-1-x-PickupPointInfo svg { display: block !important; background-image: url(https://hmuruguay.vteximg.com.br/arquivos/hm-checkout.png) !important; background-repeat: no-repeat !important; background-size: contain !important; width: 35px !important; height: 58px !important; background-position: 0px -7px !important; border-radius: 0 !important; } [id^="1_bx"] .vtex-pickup-points-modal-3-x-pickupPointMarker svg, [id^="PickUp-Points-bx"] .vtex-pickup-points-modal-3-x-pickupPointMarker svg { background-image: url(https://hmchile.vteximg.com.br/arquivos/bluexpressvg.svg) !important; background-repeat: no-repeat !important; background-size: contain !important; width: 48px !important; height: 38px !important; background-position: 0 2px !important; border-radius: 0 !important; } [id^="1_bx"] .vtex-omnishipping-1-x-PickupPointInfo svg, [id^="PickUp-Points-bx"] .vtex-omnishipping-1-x-PickupPointInfo svg { background-image: url(https://hmchile.vteximg.com.br/arquivos/bluexpressvg.svg) !important; background-repeat: no-repeat !important; background-size: contain !important; width: 38px !important; height: 27px !important; background-position: 0 2px !important; border-radius: 0 !important; } .vtex-pickup-points-modal-3-x-pointsItem [id="1_CO0004"], .vtex-pickup-points-modal-3-x-pointsItem [id="CO0004"], .vtex-pickup-points-modal-3-x-pointsItem [id="CO0003"], .vtex-pickup-points-modal-3-x-pointsItem [id="1_CO0003"], .vtex-pickup-points-modal-3-x-pointsItem [id="CO0006"], .vtex-pickup-points-modal-3-x-pointsItem [id="1_CO0006"], .vtex-pickup-points-modal-3-x-pointsItem [id="CO0008"], .vtex-pickup-points-modal-3-x-pointsItem [id="1_CO0008"], .vtex-pickup-points-modal-3-x-pointsItem [id="CO0009"], .vtex-pickup-points-modal-3-x-pointsItem [id="1_CO0009"], .vtex-pickup-points-modal-3-x-pointsItem [id="CO0012"], .vtex-pickup-points-modal-3-x-pointsItem [id="1_CO0012"], .vtex-pickup-points-modal-3-x-pointsItem [id="CO0015"], .vtex-pickup-points-modal-3-x-pointsItem [id="1_CO0015"], .vtex-pickup-points-modal-3-x-pointsItem [id="CO0014"], .vtex-pickup-points-modal-3-x-pointsItem [id="1_CO0014"], .vtex-pickup-points-modal-3-x-pointsItem [id="CO0013"], .vtex-pickup-points-modal-3-x-pointsItem [id="1_CO0013"], .vtex-pickup-points-modal-3-x-pointsItem [id="CO0022"], .vtex-pickup-points-modal-3-x-pointsItem [id="1_CO0022"], .vtex-pickup-points-modal-3-x-pointsItem [id="CO0019"], .vtex-pickup-points-modal-3-x-pointsItem [id="1_CO0019"], .vtex-pickup-points-modal-3-x-pointsItem [id="CO0018"], .vtex-pickup-points-modal-3-x-pointsItem [id="1_CO0018"], .vtex-pickup-points-modal-3-x-pointsItem [id="CO0023"], .vtex-pickup-points-modal-3-x-pointsItem [id="1_CO0023"] { display: none !important; } .vtex-pickup-points-modal-3-x-pickupPointMarker { text-align: -webkit-center !important; } .vtex-omnishipping-1-x-pointWrapper { padding-left: 57px !important; } .vtex-pickup-points-modal-3-x-pickupPointMain { padding: 5px 10px 5px 0; } .vtex-pickup-points-modal-3-x-pickupPointMarker { display: flex; align-items: center; flex-direction: column; } .vtex-pickup-points-modal-3-x-showListButton { background-color: black !important; color: white !important; border: none !important; } button#change-pickup-button:after { border: 1px solid black !important; } .vtex-omnishipping-1-x-buttonEditAddress:hover, .vtex-omnishipping-1-x-buttonCreateAddress:hover { border-color: black !important; color: black !important; } .vtex-omnishipping-1-x-backToAddressList{ border: 1px dashed black !important; } p.ship-state { width: 100%; } @media (max-width: 1024px) { #shipping-option-pickup-in-point span.shp-method-option-text::before, .vtex-omnishipping-1-x-deliveryChannelsOption { font-size: 11px; } button#shipping-option-pickup-in-point .vtex-omnishipping-1-x-deliveryChannelsComplement::before, .vtex-omnishipping-1-x-deliveryChannelsComplement { font-size: 10px; } .vtex-omnishipping-1-x-ask .ask-for-geolocation-ask::after { width: 100%; } .vtex-omnishipping-1-x-manualBtn.btn-ask-for-geolocation-manual { width: 100%; } } /* payment */ .orderform-template-holder #payment-data .payment-group-item:first-child:nth-last-child(n+2), .orderform-template-holder #payment-data .payment-group-item:first-child:nth-last-child(n+2)~.payment-group-item { background: unset; height: 64px; } .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item.active { background: unset; border-bottom: unset; } #app-container input[type=text], #app-container input[type=tel], #app-container input[type=email], #app-container select { height: 54px; } .orderform-template-holder #payment-data .v-custom-payment-item-wrap { border: unset; border-radius: unset; border-bottom: 1px solid var(--border-gray); } .orderform-template-holder #payment-data .v-custom-payment-item-wrap.active, .orderform-template-holder #payment-data .v-custom-payment-item-wrap:hover { box-shadow: unset; border-color: var(--border-gray); } .orderform-template-holder #payment-data p.link.link-gift-card a { display: none; } .orderform-template-holder #client-profile-data form.client-pre-email, .orderform-template-holder #client-profile-data .step.client-profile-data, .orderform-template-holder #shipping-data, .orderform-template-holder #payment-data { border-radius: unset; border-color: var(--border-gray); } #payment-data { border: none !important; border-radius: 0 !important; } .summary-totalizers.cart-totalizers tfoot .info { font-family: 'HM-Slussen-Extended-Semibold'; color: var(--Hmblack); text-transform: uppercase; } #payment-data-submit { border-radius: 0; font-family: 'HM-Slussen-Extended-Semibold'; text-transform: uppercase; font-size: 12px; } #app-container label.FormFieldLabel { font-family: 'HM-Slussen-Extended-Regular'; color: var(--Hmblack); text-transform: uppercase; font-size: 12px; } #app-container .AddressToggle { font-family: 'HM-Slussen-Extended-Semibold'; text-transform: uppercase; font-size: 12px; color: var(--Hmblack); } #app-container .ChangeNumberOfPayments { display: none !important; } .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item-text { margin-right: auto; text-align: left; line-height: 27px !important; white-space: nowrap; background: none !important; font-family: 'HM-Slussen-Extended-Semibold'; font-weight: 600; text-transform: uppercase; color: var(--Hmblack); } #app-container .PaymentCardNumber .FormFieldLabel { font-size: 0px; } #app-container .PaymentCardHolderName .FormFieldLabel { font-size: 0px; } #app-container .PaymentCardNumber .FormFieldLabel::before { content: 'Número de tarjeta'; font-family: 'HM-Slussen-Extended-Regular'; font-size: 12px; color: var(--Hmblack); text-transform: uppercase; } #app-container .PaymentCardHolderName .FormFieldLabel::before { content: 'Nombre y apellido de la tarjeta'; font-family: 'HM-Slussen-Extended-Regular'; font-size: 12px; color: var(--Hmblack); text-transform: uppercase; } div#app-container p.PaymentCardCVV.input.text.required .PaymentCardCVVHelp { font-size: 10px; line-height: 12px; height: 1px; margin: 0; padding: 75px 10px 27px; width: 140px; left: 300px; bottom: 80px; } div#app-container .BillingAddress { display: inherit; } .PaymentCardDueDate .payment-card-lash { color: #999; margin: 5px; font-size: 15px !important; margin-top: 16px !important; } .payment-card-due-year .input-mini, .payment-card-due-month .input-mini { width: 65px !important; } .payment-mercadopago-container-methods .box-flags div{ height: 34px; background-size: contain !important; } @media (max-width: 1024px) { .payment-mercadopago-container-methods .box-flags div { width: 100%; } .PaymentCardCVVHelp { display: none !important; } } @media (max-width:500px) { .payment-card-due-year .input-mini, .payment-card-due-month .input-mini { width: 57px !important; } .orderform-template-holder #payment-data .v-custom-payment-item-wrap .payment-group-item.active+div, .orderform-template-holder #payment-data .v-custom-payment-item-wrap.active>div { padding: 13px !important; } #creditCardpayment-card-0Month, #creditCardpayment-card-0Year { padding: 3px !important; font-size: 11px !important; } #app-container label.FormFieldLabel { font-family: 'HM-Slussen-Extended-Regular'; color: var(--Hmblack); text-transform: uppercase; font-size: 11px; } #app-container .PaymentInstallments .FormFieldLabel::before { content: 'Cuotas disponibles:'; font-family: 'HM-Slussen-Extended-Regular'; font-size: 11px !important; color: var(--Hmblack); text-transform: uppercase; } .PaymentCardDueDate .payment-card-lash { color: #999; margin: 5px; margin-top: 17px !important; font-size: 12px !important; } #app-container .PaymentCardNumber .FormFieldLabel::before { content: 'Número de tarjeta'; font-family: 'HM-Slussen-Extended-Regular'; font-size: 11px !important; color: var(--Hmblack); text-transform: uppercase; } #app-container .PaymentCardHolderName .FormFieldLabel::before { content: 'Nombre y apellido de la tarjeta'; font-family: 'HM-Slussen-Extended-Regular'; font-size: 11px !important; color: var(--Hmblack); text-transform: uppercase; } } /* summary / totalizadores del carrito */ /* HMDCP-3411: importe de la fila de descuentos en rojo de marca (solo td.monetary; el TOTAL vive en tfoot) */ .summary-template-holder .summary-totalizers tbody tr.Discounts td.monetary { color: var(--HmSale); } /* cart */ .empty-cart-content { padding: 50px 15px; } .table.cart-items { display: block; } .table.cart-items thead { width: 100%; display: block; } .table.cart-items thead tr { display: flex; align-items: center; } .table.cart-items thead tr th.product { width: calc(100% - 242px) !important; } .table.cart-items thead tr th.product-price, .table.cart-items thead tr th.quantity-price { width: 90px !important; } .table.cart-items thead tr th.item-remove, .table.cart-items thead tr th.quantity-price, .table.cart-items thead tr th.shipping-date, .table.cart-items thead tr th.product-price, .table.cart-items thead tr th.product, .table.cart-items thead tr th.quantity { display: none; } .table.cart-items thead tr th.quantity { min-width: 62px; } .table.cart-items thead tr th.product-image { order: 1; } .table.cart-items thead tr th.product-name { order: 2; } .table.cart-items thead tr th.shipping-date { order: 3; } .table.cart-items thead tr th.quantity { order: 3; } .table.cart-items thead tr th.product-price, .table.cart-items thead tr th.quantity-price { order: 5; } .table.cart-items tr.item-attachments-head { border: none !important; justify-content: center; } .table.cart-items tr.item-attachments-head .help-arrow { display: none; } .table.cart-items td.shipping-date { display: none; } .table.cart-items tbody { display: flex; flex-wrap: wrap; width: 100%; flex-direction: column; } .table.cart-items tbody tr { width: 100%; display: flex; flex-wrap: wrap; border-top: 1px solid #eee; } .table.cart-items tbody tr.hide, #shipping-preview-container { display: none; } .table.cart-items tbody tr>.v-custom-bundles { width: 100%; } .empty-cart-title { font-family: "HM-Slussen-Extended-Semibold"; font-weight: 600; font-size: 16px; text-transform: uppercase; color: var(--Hmblack); margin: 0; } .empty-cart-message p { font-size: 13px; font-weight: 400; color: var(--Hmblack); } a#cart-choose-products { width: 420px; height: 56px; background: white; border: 1px solid var(--Hmblack); font-family: "HM-Slussen-regular", sans-serif; font-weight: 400; font-size: 12px; text-transform: uppercase; border-radius: 0; color: var(--Hmblack) !important; } a#hm-full-cart-login-cta { padding: 17px 0; width: 100%; background: white; border: 1px solid var(--Hmblack); font-family: "HM-Slussen-regular", sans-serif; font-weight: 400; font-size: 12px; text-transform: uppercase; border-radius: 0; color: var(--Hmblack) !important; text-align: center; /* HMDCP-3532 FIX QA visual: .summary-template-holder es flex-column y .hm-nc-payment-options-text-container tiene order:3. Sin order explicito el boton arrancaba con 0 y quedaba visualmente antes del contenedor de medios de pago. order:4 lo pone al final visual del summary (debajo de medios de pago). */ order: 4; } a#hm-full-cart-login-cta:hover{ text-decoration: none; } .empty-cart-content .empty-cart-message p:not(.hm-cta-ready), .empty-cart-content a#cart-choose-products:not(.hm-cta-ready) { visibility: hidden; } /* HMDCP-3532 anti-flash de sesión: ocultar el botón "Inicia sesión" hasta que Cart.applyLoginCtaVisibility() confirme loggedIn === false. La clase hm-login-visible la agrega el helper; aplica tanto al empty-cart (#cart-choose-products + el

del message) como al full-cart (#hm-full-cart-login-cta). Usamos visibility (no display) para no reflow. El full-cart arranca sin la clase porque insertFullCartLoginCta lo inserta limpio; el gating lo oculta por default hasta que apply confirme. */ .empty-cart-content .empty-cart-message p:not(.hm-login-visible), .empty-cart-content a#cart-choose-products:not(.hm-login-visible), a#hm-full-cart-login-cta:not(.hm-login-visible) { visibility: hidden; } .table.cart-items td.product-image a, .table.cart-items td.product-image img { aspect-ratio: 2 / 3; width: 128px; margin: 0; } .full-cart .cart table tbody tr td.product-name a, .full-cart .cart table tbody tr td.bundle-item-name span { font-family: "HM-Slussen-Extended-Regular"; font-size: 14px; font-weight: 400; text-transform: uppercase; color: var(--Hmblack); } .table.cart-items td.product-name a, .table.cart-items td.product-name a:hover { text-decoration: none; color: var(--Hmblack); font-weight: 400; } .hm-nc-product-references { display: flex; flex-direction: column; order: 3; } .summary-template-holder .cart-links-bottom { position: initial; } .full-cart .cart table tbody tr td.product-name .seller { display: none; } .full-cart .cart table tbody tr td.product-name { display: flex; flex-direction: column; } .full-cart .cart table tbody tr td .brand {} .full-cart .cart table tbody tr td.product-name a { order: 1; } .full-cart .cart table tbody tr td.product-price { order: 2; } .full-cart .cart table tbody tr td.quantity { height: 56px; width: 128px; border-radius: 0 !important; border-color: var(--border-gray); box-sizing: border-box; } .summary-template-holder .cart-links-bottom .btn-success { font-family: "HM-Slussen-Extended-Semibold"; background-color: var(--Hmblack); border: none; border-radius: unset; font-size: 12px; text-transform: uppercase; } .full-cart .summary-totalizers .info, #cart-coupon, #cart-coupon::placeholder, .summary-template-holder .summary-coupon fieldset.coupon-fieldset p label { font-family: "HM-Slussen-Extended-Regular"; color: var(--Hmblack); font-size: 12px; text-transform: uppercase; } .summary-coupon fieldset.coupon-fieldset .vcustom-showCustomMsgCoupon { border: none !important; color: var(--Hmblack) !important; padding: 4px !important; border-radius: 0 !important; font-size: 11px; text-shadow: none; margin-top: 4px !important; clear: both; } #cart-coupon:focus, #cart-coupon:focus-visible { box-shadow: none !important; } #cart-coupon-add { padding: 0; } #cart-coupon-add:hover, #cart-coupon-add:focus, #cart-coupon-add:focus-visible { box-shadow: none !important; background-color: transparent !important; border: none !important; } .full-cart .summary-totalizers .monetary, #cart-coupon-add { font-family: "HM-Slussen-Extended-Semibold"; color: var(--Hmblack); font-size: 12px; text-transform: uppercase; } .summary-template-holder tfoot tr td.monetary, .full-cart .totalizers tfoot td { font-family: "HM-Slussen-Extended-Semibold" !important; color: var(--Hmblack); font-size: 16px !important; text-transform: uppercase; } .full-cart .summary-totalizers .monetary { font-weight: 600; } .summary-template-holder tbody { border: unset; padding: 0; } .summary-template-holder .summary-coupon fieldset.coupon-fieldset input[type="text"] { border: unset; padding-left: 0; box-shadow: unset; } .summary-template-holder .summary-coupon fieldset.coupon-fieldset button[type="submit"] { border: unset; padding-right: 0; } .summary-template-holder .summary-coupon fieldset.coupon-fieldset button[type="submit"]:hover { color: inherit; border-color: inherit; } .hm-nc-product-references-item { font-size: 12px; font-weight: 400; display: flex; justify-content: space-between; width: 70%; } .hm-nc-product-references-item span { width: 50%; text-align: left; } .hm-nc-product-references-item-total { font-family: "HM-Slussen-Extended-Semibold"; font-weight: 600; font-size: 14px; color: var(--Hmblack); } .hm-low-stock-message { color: black; font-size: 11px; font-weight: 400; display: inline; align-items: center; margin-left: 6px; } .hm-low-stock-dot { width: 8px !important; height: 8px; background-color: #e50010; display: inline-block; } .table.cart-items tbody tr td.product-price>span.best-price { text-align: left; font-size: 14px; font-family: "HM-Slussen-Extended-Regular"; font-weight: 400; } .hm-nc-payment-options-text-container { padding: 20px 0; order: 3; background-color: white; z-index: 1; position: relative; } .hm-nc-payment-options { display: flex; gap: 10px; align-items: center; } .hm-nc-payment-options-text p { font-size: 11px; font-weight: 400; } .hm-nc-payment-options-text a { text-decoration: underline; color: inherit; } .hm-nc-payment-message { font-size: 11px; font-weight: 400; color: #e50010; } .summary-template-holder { padding: 0 12px; } .summary-template-holder { display: flex; flex-direction: column; } .hm-nc-carrousel-slide-image img { aspect-ratio: 2/3; width: 320px; } .hm-nc-carrousel-item-slide { max-width: 320px; } .slick-prev, .slick-next { z-index: 2; top: -50px !important; transform: unset !important; } .slick-prev { right: 50px !important; left: unset !important; } .slick-next { right: 25px !important; left: unset !important; } .slick-prev.slick-arrow::after { display: block; content: ""; background: url(https://hmuruguay.vtexassets.com/assets/vtex.file-manager-graphql/images/6ba99117-b7a8-4111-b2a3-cf3cbf345e35___7c74fdace9d0ee779eadfcb1f3d36eb7.png); width: 10px; height: 15px; } .slick-next.slick-arrow::after { display: block; content: ""; background: url(https://hmuruguay.vtexassets.com/assets/vtex.file-manager-graphql/images/2d2a6305-c7fc-4f76-b8e5-2a6e9178c289___28c7fb5a0749829b146ba0e5f93021b7.png); width: 10px; height: 15px; } .hm-nc-carrousel-slide-price { font-family: "HM-Slussen-Extended-Semibold"; font-weight: 600; font-size: 12px; display: flex; flex-flow: row nowrap; align-items: center; justify-content: flex-start; gap: 5px; } .productSlide--price-offer { font-family: "HM-Slussen-Extended-Regular"; font-weight: 400; font-size: 12px; } .hm-nc-carrousel-title { margin: 0; padding: 5px 30px; font-family: "HM-Slussen-Extended-Regular"; font-weight: 400; font-size: 12px; text-transform: uppercase; } .hm-nc-carrousel-slide-link:focus { outline: none; text-decoration: none; color: var(--Hmblack); } .hm-nc-carrousel-slide-link:hover { text-decoration: none; color: var(--Hmblack); } .hm-nc-carrousel-slide-text { padding: 5px 30px; } .hm-nc-carrousel-slide-name { font-family: "HM-Slussen-Extended-Regular"; font-weight: 400; font-size: 12px; text-transform: uppercase; } .hm-nc-carrousel-slide-name { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; max-width: 100%; white-space: normal; } @media (max-width: 1024px) { .hm-nc-carrousel-title { padding: 5px 30px 5px 0; } body:not(.body-cart) .hm-nc-carrousel { padding: 0 10px; } .slick-next.slick-arrow, .slick-prev.slick-arrow { display: none !important; } .hm-nc-product-references-item { width: 90%; } .hm-nc-product-references-item span { overflow-wrap: break-word; } } .table.cart-items td.quantity input { font-family: "HM-Slussen-Extended-Regular"; margin: 0 12px; width: 30px !important; height: 30px !important; padding: 0; border: none; box-shadow: none !important; color: #737479; } .table.cart-items tbody tr { margin-bottom: 45px; } .show-more-items-button { font-size: 0; border: none !important; background: none !important; } .show-more-items-button::before { content: "MOSTRAR MÁS ITEMS"; font-size: 12px; font-family: "HM-Slussen-Extended-Semibold"; font-weight: 600; text-transform: uppercase; } .vtex-front-messages-template.vtex-front-messages-type-error {} .vtex-front-messages-placeholder.vtex-front-messages-placeholder-opened { display: none !important; } .product-item.unavailable.lookatme { margin-bottom: 0 !important; background-color: white !important; } .product-item.unavailable.lookatme .wishlistButton { display: none !important; } .product-item.unavailable.lookatme td.product-image { background: none !important; } .product-item.unavailable.lookatme img { opacity: 0.4; outline: none; } .product-item.unavailable.lookatme img:focus, .product-item.unavailable.lookatme a:focus { outline: none; } /* HMDCP-3412 v1.1: regla reemplazada por td.product-name::before (ver AC-13/AC-14). Se preserva comentada para trazabilidad. */ /* .product-item.unavailable.lookatme .hm-nc-product-references::after { content: "Producto sin stock"; display: block; color: #000; font-size: 12px; font-weight: 600; margin-top: 8px; } */ .product-item.unavailable.lookatme .item-link-remove.hm-nc-unavailable-remove { display: inline-block; position: static; width: auto; order: 10; margin-top: 12px; color: #222; font-size: 13px; font-family: "HM-SLUSSEN-REGULAR", sans-serif; text-decoration: underline; cursor: pointer; margin-left: -5px; opacity: 1; /* HMDCP-3412 v1.1 AC-11: botón siempre plenamente visible */ } .product-item.unavailable.lookatme .item-link-remove.hm-nc-unavailable-remove .item-remove-text { display: inline; } /* HMDCP-3412 v1.1 AC-09/AC-10: transparencia por hijos, no por padre — botón y label quedan excluidos */ .product-item.unavailable.lookatme td.product-name > a:not(.item-link-remove), .product-item.unavailable.lookatme td.product-price, .product-item.unavailable.lookatme .hm-nc-product-references { opacity: 0.4; } /* HMDCP-3412 v1.1 AC-13/AC-14: label reubicado arriba en rojo. Reemplaza la regla anterior .hm-nc-product-references::after (label negro debajo del Art. No.). td.product-name ya es display:flex; flex-direction:column (ver minicart.css L164-167), por lo que order:-1 lo coloca primero. */ .product-item.unavailable.lookatme td.product-name::before { content: "Producto sin stock"; order: -1; color: var(--Danger); font-size: 12px; font-weight: 600; display: block; margin-bottom: 8px; opacity: 1; } @media (max-width:900px) { .product-item.unavailable.lookatme .item-link-remove.hm-nc-unavailable-remove { display: block; text-align: center; } } .item-unavailable { background-color: #FF9C00 !important; } .hm-unavailable-separator { order: 9999 !important; } .product-item.unavailable { order: 10000 !important; } .item-unavailable .item-unavailable-message { font-size: 13px; font-weight: 400 !important; } .item-unavailable .help-arrow.top-arrow { display: none !important; } .item-unavailable .icon-warning-sign:before { content: "" !important; background-image: url("/arquivos/hazmat.png"); background-size: 11px; width: 11px; height: 11px; } /* HMDCP-3411: el corazón se ancla a la esquina superior derecha del thumbnail */ .table.cart-items tbody tr td.product-image { position: relative; } .wishlistButton { background: none; cursor: pointer; padding: 0; display: flex; align-items: center; justify-content: center; position: absolute; z-index: 2; border: 0; top: 2px; right: 2px; width: 44px; height: 44px; } /* HMDCP-3411: solo relleno, sin stroke: el contorno ya ocupa todo el viewBox 16x16 y el stroke se recortaba en los costados */ .wishlistButton.active .heartIcon path { fill: var(--HmSale); stroke: none; } @media (min-width: 1025px) { .wishlistButton:hover .heartIcon path { stroke: none; fill: var(--HmSale); } } .full-cart .cart table tbody tr td.empty, .full-cart .cart table tbody tr td.shipping-date, .full-cart .cart table tbody tr td .brand { display: none; } .product-item.unavailable td.quantity { display: none !important; } a:visited, a:focus { color: black; } @media (min-width: 1025px) { .hm-nc-carrousel { margin-top: 90px; } body.v-custom-cart-empty .cart-template-holder { margin: 0; } .table.cart-items thead { display: none; } .table.cart-items td.product-name, .table.cart-items td.quantity { margin-left: 0 !important; } .table.cart-items tbody tr .v-custom-product-item-wrap { align-items: flex-start; gap: 10px; } /* HMDCP-3411: alineada al nombre (138px imagen + 10px gap + 5px padding del nombre); antes 205px dejaba lugar al corazon viejo */ .full-cart .cart table tbody tr td.quantity { position: absolute; bottom: -37px; left: 153px; } .full-cart .cart table tbody tr td.product-price { margin-left: 0; padding-left: 0; } .table.cart-items tbody tr { border: unset; } .container.container-main.container-cart { max-width: unset; width: 100%; } .cart-template-holder .cart { padding: 0; } .body-cart-vertical .cart-template.full-cart.active { justify-content: space-between; padding: 0 24px; } .table.cart-items tbody tr td.item-remove { position: absolute; right: 0; } .body-cart-vertical .cart-template-holder { width: calc(60% - 20px); } .summary-template-holder { padding-top: 20px; } } @media (max-width: 1024px) { .table.cart-items tbody tr td.product-price { margin-left: 0 !important; padding-left: 0 !important; } .cart-links.cart-links-bottom { padding: 0; width: 100% !important; } /* HMDCP-3411: alineada al nombre (128px imagen + 16px gap) */ .full-cart .cart table tbody tr td.quantity { position: absolute; bottom: -44px; left: 144px; margin-left: 0 !important; } .wishlistButton { top: 6px; } .table.cart-items tbody tr .v-custom-product-item-wrap { align-items: flex-start; } } @media (max-width: 1024px) { .table.cart-items tbody tr { margin-left: 0 !important; } .hm-nc-step-title { font-size: 24px; padding: 0 16px; } .empty-cart-content { padding: 24px 16px; } a#cart-choose-products, a#hm-full-cart-login-cta { width: 100%; } .table.cart-items td.quantity { width: 97px; } .table.cart-items td.product-name { margin-left: 144px !important; } .item-quantity-change { display: inline-block; } .item-quantity-change { float: left; padding: 3px 5px 3px 0px; } .item-quantity-change-increment { padding-left: 5px; padding-right: 0; } .full-cart .cart-links-bottom .btn-success { width: 83%; display: block; margin-top: 10px; } .full-cart .cart table { display: block; margin-top: 0 !important; } .full-cart .cart table thead { display: none; } .full-cart .cart table tbody { display: flex; } .full-cart .cart table tbody tr+tr { border-top: 0px; } .full-cart .cart table tbody tr { display: block; margin-top: 10px; padding: 10px 0; position: relative; } .full-cart .cart table tbody tr .product-name a, .full-cart .cart table tbody tr .product-name .seller { overflow: hidden; } .full-cart .cart table tbody tr td { display: inline-block; padding: 4px 0; } .full-cart .cart table tbody tr td.product-image, .full-cart .cart table tbody tr td.bundle-item-image { left: 0; position: absolute; } .full-cart .cart table tbody tr td.product-name { padding: 0 0 10px !important; } .full-cart .cart table tbody tr td.product-name a, .full-cart .cart table tbody tr td.bundle-item-name span { display: block; padding-right: 20px; } .full-cart .cart table tbody tr td.quantity input { width: 55px !important; } .full-cart .cart table tbody tr td.product-price { text-align: right; float: right; margin-right: 5px; padding: 0; } .full-cart .cart table tbody tr td.quantity-price { display: none; } .full-cart .cart table tbody tr td.item-remove { position: absolute; top: 2px; right: 0; width: 24px; } .cart-links-bottom { float: none; margin-top: 5px; margin-bottom: 40px; text-align: right; } .more { margin-right: 0; } .full-cart .cart-links-bottom .btn-success { width: auto; } .full-cart .cart table tbody tr.item-attachments-head { border: 0; margin: 0; padding: 0; } .full-cart .cart table tbody tr.item-attachments-head .item-attachments-header { top: auto; } .full-cart .cart table tbody tr.item-attachments-head .item-attachments-header:after { content: none; } .full-cart .cart table tbody tr.item-attachments-head .item-attachments-header strong { box-shadow: none; } .full-cart .cart table tbody tr.item-attachments-content { margin: 0; border: 0; padding: 0; } .full-cart .cart table tbody tr.item-attachments-content .item-attachments-item-fields { margin-left: 5px; width: 95%; } } .table.cart-items td.quantity .item-quantity-change i { background: none; line-height: 0; display: inline-block; } .table.cart-items td.quantity .item-quantity-change i:before { width: auto; height: auto; } .table.cart-items td.quantity .item-quantity-change>p { margin: 0; } .table.cart-items td.quantity .item-quantity-change.item-quantity-change-decrement i { visibility: hidden; } .table.cart-items td.quantity .item-quantity-change.item-quantity-change-decrement i:before { visibility: visible; content: url("https://hmuruguay.vteximg.com.br/arquivos/icon-minus-nc.png"); line-height: 0; } .table.cart-items td.quantity .item-quantity-change.item-quantity-change-increment i { visibility: hidden; } .table.cart-items td.quantity .item-quantity-change.item-quantity-change-increment i:before { visibility: visible; content: url("https://hmuruguay.vteximg.com.br/arquivos/icon-plus-nc.png"); line-height: 0; } .table.cart-items i.icon.icon-remove.item-remove-ico:before { content: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pg0KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE5LjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPg0KPHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJDYXBhXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgNTEyLjAwMSA1MTIuMDAxIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA1MTIuMDAxIDUxMi4wMDE7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxnPg0KCQk8cGF0aCBkPSJNMjg0LjI4NiwyNTYuMDAyTDUwNi4xNDMsMzQuMTQ0YzcuODExLTcuODExLDcuODExLTIwLjQ3NSwwLTI4LjI4NWMtNy44MTEtNy44MS0yMC40NzUtNy44MTEtMjguMjg1LDBMMjU2LDIyNy43MTcNCgkJCUwzNC4xNDMsNS44NTljLTcuODExLTcuODExLTIwLjQ3NS03LjgxMS0yOC4yODUsMGMtNy44MSw3LjgxMS03LjgxMSwyMC40NzUsMCwyOC4yODVsMjIxLjg1NywyMjEuODU3TDUuODU4LDQ3Ny44NTkNCgkJCWMtNy44MTEsNy44MTEtNy44MTEsMjAuNDc1LDAsMjguMjg1YzMuOTA1LDMuOTA1LDkuMDI0LDUuODU3LDE0LjE0Myw1Ljg1N2M1LjExOSwwLDEwLjIzNy0xLjk1MiwxNC4xNDMtNS44NTdMMjU2LDI4NC4yODcNCgkJCWwyMjEuODU3LDIyMS44NTdjMy45MDUsMy45MDUsOS4wMjQsNS44NTcsMTQuMTQzLDUuODU3czEwLjIzNy0xLjk1MiwxNC4xNDMtNS44NTdjNy44MTEtNy44MTEsNy44MTEtMjAuNDc1LDAtMjguMjg1DQoJCQlMMjg0LjI4NiwyNTYuMDAyeiIvPg0KCTwvZz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjwvc3ZnPg0K"); width: 15px; height: 15px; } input[type="checkbox"]#tyc { box-sizing: border-box; width: 24px; height: 24px !important; margin: 6px 6px 26px; border: 1px solid var(--Hmblack); appearance: none; background-color: transparent; outline: none; transition: outline 0.1s; } input[type="checkbox"]:checked#tyc { background-size: cover; padding: 2px; } input[type="checkbox"]:not(:disabled):checked#tyc { border-color: var(--Hmblack); background-image: url('data:image/svg+xml;utf8,'); } input[type="checkbox"]:disabled#tyc { background-color: #d9d9d9; } input[type="checkbox"]:disabled:checked#tyc { background-image: url('data:image/svg+xml;utf8,'); } .checkout-container .cart-more-options { display: none !important; } .hm-nc-countDown { display: none; box-sizing: border-box; width: 98%; border: 1px solid #e5e5e5; background: #fff; color: #000; font-family: var(--fontFamily); font-weight: 400; font-size: 14px; line-height: 1.4; text-align: left; padding: 16px 20px; margin: 16px; } .hm-nc-countDown__text { margin: 0 0 25px 0; font-size: 14px; font-weight: 400; text-transform: uppercase; letter-spacing: 0.02em; } .hm-nc-countDown__row { display: flex; align-items: center; justify-content: space-between; gap: 12px; } .hm-nc-countDown__counter { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; } .hm-nc-countDown__pulse { display: inline-block; width: 7px; height: 7px; background: currentColor; border: 1px solid currentColor; animation: hmNcCountDownPulse 1s ease-in-out infinite; } @keyframes hmNcCountDownPulse { 0%, 100% { background: currentColor; } 50% { background: #fff; } } .hm-nc-countDown__counter-label, .hm-nc-countDown__counter-value { font-size: 14px; font-weight: 400; } .hm-nc-countDown__counter-value { font-variant-numeric: tabular-nums; } .hm-nc-countDown__info { display: inline-flex; align-items: center; justify-content: center; width: 17px; height: 17px; padding: 0; margin: 0; border: 1.5px solid currentColor; border-radius: 50%; background: transparent; color: inherit; font-family: var(--fontFamily); font-size: 10px; font-weight: 400; line-height: 1; cursor: pointer; flex-shrink: 0; } .hm-nc-countDown__info:hover, .hm-nc-countDown__info:focus { border-color: #747171; } .hm-nc-countDown__info:hover span, .hm-nc-countDown__info:focus span { color: #747171; } .hm-nc-countDown__info-text { margin: 12px 0 0 0; padding: 0; font-size: 12px; font-weight: 400; color: #747171; opacity: 0.85; } @media (max-width: 1024px) { .hm-nc-countDown { width: 97%; } } @media (max-width: 1024px) { .hm-nc-countDown { padding: 14px 16px; font-size: 13px; margin: 16px 10px; width: 95%; } .hm-nc-countDown__text, .hm-nc-countDown__counter, .hm-nc-countDown__counter-label, .hm-nc-countDown__counter-value { font-size: 13px; } } #vtexIdContainer .btn.btn-block.btn-large.btn-success.vtexIdUI-send-email#loginWithAccessKeyBtn { border-radius: 0; border: 1px solid #000; background: #000; font-family: HM-Slussen-Regular; width: 100%; margin-bottom: 20px; font-weight: 400; text-transform: uppercase; margin-top: 5px; font-size: 12px; display: flex; justify-content: center; align-items: center; } #vtexIdContainer .btn.btn-block.btn-large.vtexIdUI-others-send-email#loginWithUserAndPasswordBtn { border-radius: 0; display: flex; justify-content: center; align-items: center; background: transparent; cursor: pointer; padding: 3px; color: #000; font-family: HM-Slussen-Regular; width: 100%; margin-bottom: 20px; font-weight: 400; text-transform: uppercase; margin-top: 5px; font-size: 14px; border: 1px solid #000; } .vtexIdUI .vtexid-icon-lock.bottom-icon, i.vtexid-icon-mail { display: none; } #vtexIdContainer .vtexIdUI.ng-scope.vtexIdUI-show-app { box-shadow: unset; border: 1px solid; border-radius: 0; padding: 20px 30px; } #vtexIdContainer .vtexIdUI .modal-header { background: #fff; border: unset; } #vtexIdContainer .vtexIdUI .modal-header span { font-family: HM-Slussen-Regular; font-size: 14px; font-weight: 600; color: #000; } #vtexIdContainer .vtexIdUI .modal-header .close { background: unset; color: #000; font-size: 30px; } #vtexIdContainer .vtexIdUI .modal-header .vtexIdUI-user span { font-weight: 200; } #vtexIdContainer .vtexIdUI .vtexIdUI-page-active { display: flex; flex-direction: column; justify-content: center; width: 90%; } #vtexIdContainer .control-group.vtexIdUI-classic-login-control.email-model.ng-hide { display: block !important; } #vtexIdContainer .control-group.vtexIdUI-classic-login-control.email-model.ng-hide label { font-size: 0; } #vtexIdContainer .control-group.vtexIdUI-classic-login-control.email-model.ng-hide label::before { content: "Correo electrónico *"; font-size: 14px; color: rgb(0, 0, 0); font-family: HM-Slussen-Regular; } #vtexIdContainer .vtexIdUI-page input { border: 1px solid #d0d0d0; padding: 8px; color: #000; font-size: 14px; width: 100%; margin-top: 6px; outline: none; font-family: HM-Slussen-Regular !important; border-radius: 0; background: #fff; height: 45px; } #vtexIdContainer .vtexIdUI-page label { font-size: 14px; color: rgb(0, 0, 0); font-family: HM-Slussen-Regular; } #vtexIdContainer .vtexIdUI .modal-footer { border: unset; display: flex; flex-direction: column-reverse; } #vtexIdContainer .vtexIdUI .modal-footer .btn.btn-success { width: 100%; border-radius: 0; height: 45px; text-transform: uppercase; justify-content: center; font-size: 14px; display: flex; align-items: center; } #vtexIdContainer .vtexIdUI .modal-footer .vtexIdUI-back-link { justify-content: center; display: flex; align-items: center; border: 1px solid; height: 45px; font-size: 14px; font-weight: 600; text-transform: uppercase; } #vtexIdContainer .vtexIdUI .modal-footer .vtexIdUI-back-link .vtexid-icon-arrow-left { display: none; } #vtexIdContainer .vtexIdUI .modal-footer .vtexIdUI-back-link span { font-size: 0; line-height: normal; } #vtexIdContainer .vtexIdUI .modal-footer .vtexIdUI-back-link span::after { font-size: 14px; content: "Atrás"; } #vtexIdContainer .vtexIdUI .modal-header span[data-i18n="vtexid.selectAuthOption"] { font-size: 0; } #vtexIdContainer .vtexIdUI .modal-header span[data-i18n="vtexid.selectAuthOption"]::before { content: "Elije una de las opciones para confirmar tu identidad"; font-size: 14px; } @media (max-width: 1024px) { #vtexIdContainer .vtexIdUI.ng-scope.vtexIdUI-show-app { padding: 10px 10px; } #vtexIdContainer .btn.btn-block.btn-large.vtexIdUI-others-send-email#loginWithUserAndPasswordBtn, #vtexIdContainer .btn.btn-block.btn-large.btn-success.vtexIdUI-send-email#loginWithAccessKeyBtn { height: 55px; line-height: normal; } #vtexIdContainer .btn.btn-block.btn-large.btn-success.vtexIdUI-send-email#loginWithAccessKeyBtn span { font-size: 0; } #vtexIdContainer .btn.btn-block.btn-large.btn-success.vtexIdUI-send-email#loginWithAccessKeyBtn span::after { content: "Recibir código de acceso por e-mail"; font-size: 14px; } } p.ship-city { width: 100%; } .hm-nc-quantity-single .item-quantity-change-decrement i::before { content: "" !important; width: 24px !important; height: 24px !important; background-image: url("data:image/svg+xml,%3Csvg%20role%3D%22img%22%20aria-hidden%3D%22true%22%20focusable%3D%22false%22%20viewBox%3D%220%200%2024%2024%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20height%3D%2224%22%20width%3D%2224%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M9%2017V9.5h1.5V17H9ZM15%2017V9.5h-1.5V17H15Z%20M7.75%202v2.75H2v1.5h1.75V22h16.5V6.25H22v-1.5h-5.75V2h-8.5Zm1.5%201.5v1.25h5.5V3.5h-5.5Zm9.5%202.75H5.25V20.5h13.5V6.25Z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E"); background-position: center; background-repeat: no-repeat; background-size: contain; display: flex; } .hm-nc-quantity-single .item-quantity-change-decrement:hover i::before { color: #737373 !important; opacity: 0.5; } .hm-nc-remove-modal-open { overflow: hidden; } .hm-nc-remove-modal-backdrop { position: fixed; inset: 0; background: rgba(0, 0, 0, 0.72); z-index: 100000; display: none; align-items: center; justify-content: center; padding: 16px; box-sizing: border-box; } .hm-nc-remove-modal-backdrop.is-visible { display: flex; } .hm-nc-remove-modal { width: 420px; max-width: 100%; background: #fff; color: var(--Hmblack); padding: 24px; box-sizing: border-box; transform: translate3d(0, 90px, 0); } .hm-nc-remove-modal-backdrop.is-visible .hm-nc-remove-modal { animation: hmNcRemoveModalIn 260ms cubic-bezier(0.22, 0.61, 0.36, 1) forwards; } .hm-nc-remove-modal-backdrop.is-closing .hm-nc-remove-modal { animation: hmNcRemoveModalOut 220ms cubic-bezier(0.55, 0.06, 0.68, 0.19) forwards; } @keyframes hmNcRemoveModalIn { from { transform: translate3d(0, 90px, 0); } to { transform: translate3d(0, 0, 0); } } @keyframes hmNcRemoveModalOut { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(0, 90px, 0); } } .hm-nc-remove-modal-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 35px; } .hm-nc-remove-modal-title { margin: 0; font-family: "HM-Slussen-Regular" !important; font-size: 14px !important; line-height: 1.05 !important; font-weight: 400 !important; text-transform: uppercase; letter-spacing: 0; } .hm-nc-remove-modal-close { border: 0; background: transparent; color: var(--Hmblack); font-size: 26px !important; line-height: 1 !important; width: 36px; height: 36px; cursor: pointer; padding: 0; display: flex; align-items: center; justify-content: center; font-family: "HM-Slussen-Regular" !important; } .hm-nc-remove-modal-text { margin: 0 0 24px; font-family: "HM-Slussen-Regular" !important; font-size: 14px !important; line-height: 1.35 !important; font-weight: 400 !important; color: var(--Hmblack); } .hm-nc-remove-modal-actions { display: flex; gap: 16px; } .hm-nc-remove-modal-cancel, .hm-nc-remove-modal-confirm { border: 0; border-radius: 0; background: var(--Hmblack); color: white !important; font-size: 11px !important; line-height: 1.1 !important; font-weight: 600 !important; text-transform: uppercase; letter-spacing: 0; cursor: pointer; height: 48px; padding: 0 14px; display: inline-flex; align-items: center; justify-content: center; white-space: normal; text-align: center; font-size: 13px !important; font-weight: 100 !important; } .hm-nc-remove-modal-cancel:hover, .hm-nc-remove-modal-confirm:hover { background-color: #5a5a5a; color: #fff; } .hm-nc-remove-modal-cancel { min-width: 106px; flex: 0 0 106px; } .hm-nc-remove-modal-confirm { flex: 1; } @media (max-width: 1024px) { .hm-nc-remove-modal-backdrop { padding: 0; } .hm-nc-remove-modal { width: 100%; max-width: unset; height: 100%; max-height: 240px; padding: 20px; display: flex; flex-direction: column; } .hm-nc-remove-modal-actions { margin-top: auto; } .hm-nc-remove-modal-title { font-size: 14px !important; } .hm-nc-remove-modal-cancel, .hm-nc-remove-modal-confirm { font-size: 11px !important; color: white !important; font-weight: 700 !important; } } @media (max-width: 1024px) { body .full-cart .cart table tbody tr td.quantity input { width: 36px !important; margin-left: 10px !important; margin-right: 10px !important; } } @media (max-width: 365px) { body .full-cart .cart table tbody tr td.quantity { width: 122px; } } /* HMDCP-3413: orden de los grupos de no disponibles (S -> L -> O) dentro del tbody flex de .table.cart-items. UnavailableItems.js marca filas y separadores con data-hm-unavailable-group="S|L|O"; las filas de VTEX no se mueven ni se clonan, el agrupamiento es solo visual por order. Cada separador queda inmediatamente antes de las filas de su grupo. Las reglas legacy de minicart.css:569-575 (.hm-unavailable-separator 9999 / .product-item.unavailable 10000) quedan como fallback equivalente al grupo O si el JS no clasifica; estas ganan por especificidad (ambas con !important). Solo orden: sin estilos de presentacion. */ /* Grupo S: sin stock */ .table.cart-items tbody tr.hm-unavailable-separator[data-hm-unavailable-group="S"] { order: 9995 !important; } .table.cart-items tbody tr.product-item.unavailable[data-hm-unavailable-group="S"] { order: 9996 !important; } /* Grupo L: envio/logistica */ .table.cart-items tbody tr.hm-unavailable-separator[data-hm-unavailable-group="L"] { order: 9997 !important; } .table.cart-items tbody tr.product-item.unavailable[data-hm-unavailable-group="L"] { order: 9998 !important; } /* Grupo O: otros (fallback) */ .table.cart-items tbody tr.hm-unavailable-separator[data-hm-unavailable-group="O"] { order: 9999 !important; } .table.cart-items tbody tr.product-item.unavailable[data-hm-unavailable-group="O"] { order: 10000 !important; } /* profile */ .container.container-main.container-order-form { width: 100%; max-width: unset; } .orderform-template-holder #client-profile-data .step.client-profile-data input { box-shadow: unset !important; font-size: 1rem; } .orderform-template-holder #client-profile-data .step.client-profile-data input:hover { border-color: var(--Hmblack) !important; } .orderform-template-holder #client-profile-data .step.client-profile-data input:focus { border-color: var(--Hmblack); } .orderform-template-holder .step .form-step fieldset p { width: 100% !important; } .client-profile-data .accordion-toggle>span:before, body.js-vcustom-hideEmailStep .client-profile-data .accordion-toggle>span:before, .orderform-template-holder .step.client-profile-data .client-notice.notice { display: none !important; } .orderform-template-holder #client-profile-data form.client-pre-email .accordion-toggle>span, .orderform-template-holder #shipping-data .accordion-toggle>span { font-size: 1rem; text-transform: uppercase; color: var(--Hmblack); line-height: initial; font-family: 'HM-Slussen-Extended-Semibold'; font-weight: 600; } .step.client-profile-data.active .box-step .form-step[style*="display: block"] { padding-top: 0 !important; } .orderform-template-holder .step .input.text label, .vcustom--vtex-omnishipping-1-x-address label { font-family: 'HM-Slussen-Extended-Regular'; color: var(--Hmblack); font-size: 12px; text-transform: uppercase; } .orderform-template-holder .step .client-email.input.text label::after, .orderform-template-holder .step .client-first-name.input.text label::after, .orderform-template-holder .step .client-last-name.input.text label::after, .orderform-template-holder .step .client-phone.input.text label::after { content: "*"; font-family: 'HM-Slussen-Extended-Regular'; font-size: 12px; color: #D6001C; margin-left: 3px; } .orderform-template-holder .step .form-step fieldset.box-client-info-pj { display: none !important; } .orderform-template-holder .step .form-step .box-client-info .client-phone [for="client-phone2"] { font-size: 0px; } .orderform-template-holder .step .form-step .box-client-info .client-phone [for="client-phone2"]::before { content: 'Teléfono / Móvil'; font-size: 12px !important; text-transform: uppercase; } .newsletter-text { visibility: hidden; } .newsletter-text::before { visibility: visible; font-size: 13px; color: var(--Hmblack); content: "Me gustaría recibir promociones personalizadas de H&M, una marca del Grupo H&M, por correo electrónico y mensajes de texto. Puedo retirar este consentimiento en cualquier momento. Confirmo que tengo 18 años o más."; } .input-small+span.error { width: 100% !important; } .span6.pull-right.client-profile-data, .span6.pull-right.shipping-data, .span6.pull-right.payment-data { border-top: 1px solid var(--Hmgray) !important; border-bottom: 1px solid var(--Hmgray) !important; } .row-fluid.orderform-template.span12.active .orderform-template-holder.span8 { padding-left: 24px; } .orderform-template-holder #client-profile-data form.client-pre-email, .orderform-template-holder #client-profile-data .step.client-profile-data, .orderform-template-holder #shipping-data, .orderform-template-holder #payment-data { padding: 24px 0 !important; } #go-to-shipping::before, #go-to-payment::before { content: "GUARDAR" !important; font-size: 12px !important; color: white !important; } .accordion-toggle.collapsed { color: var(--base-text-disabled) !important; text-transform: uppercase !important; font-size: 1rem !important; } .accordion-toggle.collapsed.accordion-toggle-active { color: var(--Hmblack) !important; } .accordion-toggle.collapsed::before { display: none !important; } #go-to-shipping::before, #go-to-payment::before { content: "GUARDAR"; font-size: 12px; color: white; } body.js-vcustom-hideEmailStep .payment-data .accordion-toggle>span:not(.payment-edit-link):before { display: none; } .orderform-template .custom-cart-template-wrap .summary-cart-template-holder, .orderform-template .custom-cart-template-wrap h2 { display: none !important; } .input-xlarge.success { border-color: var(--green-border) !important; } .orderform-template .cart-template.mini-cart .summary-totalizers tbody { border: unset; display: block } .orderform-template .cart-template.mini-cart .summary-totalizers tbody td { text-transform: uppercase; font-family: 'HM-Slussen-Extended-Regular'; display: inline-block; text-align: left !important; width: auto; color: var(--Hmblack); font-size: 12px; padding: 0 0 3px 0 !important } #go-to-shipping, #go-to-payment { font-family: 'HM-Slussen-Extended-Semibold'; font-size: 0; border-radius: 0; } #go-to-shipping::before, #go-to-payment::before { content: "GUARDAR" !important; font-size: 12px !important; color: white !important; } .accordion-body.collapse .client-profile-email .email, .accordion-body.collapse .client-profile-summary .name { text-transform: uppercase; font-family: 'HM-Slussen-Extended-Regular'; font-size: 12px; } .accordion-body.collapse .client-profile-summary .tel { display: none; } .checkbox.newsletter-label { padding-left: 0 !important; } input[type="checkbox"]#opt-in-newsletter { box-sizing: border-box; width: 24px; height: 24px !important; margin: 6px 6px 26px; border: 1px solid var(--Hmblack); appearance: none; background-color: transparent; outline: none; transition: outline 0.1s; } input[type="checkbox"]:checked#opt-in-newsletter { background-size: cover; padding: 2px; } input[type="checkbox"]:not(:disabled):checked#opt-in-newsletter { border-color: var(--Hmblack); background-image: url('data:image/svg+xml;utf8,'); } input[type="checkbox"]:disabled#opt-in-newsletter { background-color: #d9d9d9; } input[type="checkbox"]:disabled:checked#opt-in-newsletter { background-image: url('data:image/svg+xml;utf8,'); } .hm-nc-terms-text { color: var(--Hmblack); font-size: 11px; } .hm-nc-terms-link { text-decoration: underline; } .hm-nc-terms-link:hover, .hm-nc-terms-link:focus { color: var(--Hmblack); outline: none; } @media (min-width: 1025px) { .orderform-template .orderform-template-holder { width: 47% !important; padding-right: 20px; max-width: calc(100% - 271px); float: left; box-sizing: border-box } } @media (max-width: 1024px) { .row-fluid.orderform-template.span12.active .orderform-template-holder.span8 { padding: 0 24px; } input[type="checkbox"]#opt-in-newsletter { margin: 6px 6px 20%; } } @media (max-width: 1024px) { .orderform-template-holder .step .form-step fieldset p { width: 95% !important; } .hm-nc-carrousel-item-slide { max-width: 157px; } } #birthDateModalContent { background: white; padding: 20px; border-radius: 5px; text-align: center; width: 400px; position: relative; } .title-modal-register { text-align: center; font-size: 13px; text-transform: uppercase; font-family: 'HM-Slussen-Extended-Semibold'; margin: auto; margin-top: 13px; } .subtitle-modal-register { font-size: 11px; line-height: normal; text-align: center; color: black; font-weight: 100; max-width: 343px; margin: auto; font-family: 'HM-Slussen-Extended-Regular'; } .birthDateLabel { font-family: 'HM-Slussen-Extended-Regular'; text-transform: uppercase; font-size: 11px; } .birthDateLabel::after { content: "*"; font-family: 'HM-Slussen-Extended-Regular'; font-size: 12px; color: #D6001C; margin-left: 3px; } #birthDateInput { margin: 5px 0; padding: 5px !important; width: 97% !important; min-width: 97% !important; font-family: 'HM-Slussen-Regular'; text-transform: uppercase; border: 1px solid #d0d0d0; height: 29px; padding: 8px; color: #222; background: #fff; border-radius: 0; box-shadow: none; outline: none !important; font-size: 12px; } .checkout-terms { text-align: left; margin: 10px 0; align-items: flex-start; display: flex; gap: 9px; } .checkout-terms label { font-size: 11px; font-family: 'HM-Slussen-Extended-Regular'; line-height: normal; } .checkout-terms-secondary a { text-decoration: underline; color: black !important; } #confirmBirthDate { margin-bottom: 0 !important; margin-top: 30px !important; border: 1px solid #000; text-decoration: none; background: black; color: white; font-family: 'HM-Slussen-Extended-Semibold'; width: 100% !important; font-size: 12px; } #promoSave.disabled, #confirmBirthDate.disabled { background-color: rgb(239 239 239); color: rgba(16, 16, 16, 0.3); border-color: rgba(118, 118, 118, 0.3); } .checkout-terms-secondary { text-align: center; font-size: 11px; line-height: normal; color: #707070; font-weight: 500; font-family: 'HM-Slussen-Extended-Regular'; margin-top: 19px !important; } #birthDateError, #termsError { color: #e50010 !important; font-size: 11px; text-align: left !important; display: block; } #payment-data #memberRegister__open2 { width: 100% !important; } #closeModal { color: black !important; } .vtex-omnishipping-1-x-submitPaymentButton:has(#memberRegister__open2) { display: inline-flex !important; position: relative; justify-content: center; gap: 20px; } .vtex-omnishipping-1-x-submitPaymentButton:has(#memberRegister__open2) { &::before { position: absolute; top: 0; left: 0; } .btn-go-to-payment.submit.btn.btn-success#btn-go-to-payment { margin-top: 30px !important; margin-left: 0 !important; margin-right: 0 !important; font-size: 0; padding: 14px !important; min-width: unset; width: 50%; background: white !important; color: black !important; font-weight: bold; order: 2 !important; padding-top: 16px !important; &::before { content: ""; font-size: 0px !important; } &::after { content: "Continuar sin ser miembro"; font-size: 13px; } @media (max-width: 1024px) { margin-top: 0px !important; } } } @media (max-width: 1024px) { .subtitle-modal-register { max-width: 100%; margin: auto; } #memberRegister__open2 { width: 100% !important; margin-top: 17px; } .vtex-omnishipping-1-x-submitPaymentButton:has(#memberRegister__open2) { flex-direction: column; padding-top: 28px; &>button { width: 100% !important; margin-top: 30px !important; padding: 15px; } } } #memberRegister__open2 { width: 50%; margin-bottom: 0; margin-top: 30px; border: 1px solid #000; text-decoration: none; background: black; color: white; font-family: 'HM-Slussen-Extended-Semibold'; } .v-custom-step-shipping .payment-body #memberRegister__open2 { display: none !important; } .payment-body #memberRegister__open2 { min-height: 56px; } #payment-data #memberRegister__open2 { display: none !important; } #memberRegister__open2+#memberRegister__open2 { display: none !important; } .togglePromo-content { display: flex; justify-content: space-between; margin-bottom: 6px; color: black; align-items: center; margin-bottom: 32px; } .coupon-fieldset { margin-bottom: 20px; } #togglePromo::before { content: 'DESCUENTOS'; font-size: 15px; } #cart-coupon { height: 54px !important; } #cart-coupon::placeholder { color: white; } #cart-coupon-add { background: black !important; height: 55px !important; color: white; padding: 3px 21px; font-family: 'HM-Slussen-Regular'; font-weight: 500; } #cart-coupon-add:hover { opacity: 0.8; background-color: black !important; } #modal-offers-body-collapsible { padding-bottom: 33px; margin-bottom: 19px; } #modal-offers-body-collapsible .offer-box:last-child { border-bottom: 1px solid #D9D9D9; padding-bottom: 33px; margin-bottom: 19px; background: red; } .offer-box { margin-bottom: 27px; } body .offer-box-header input { margin: 0px 1px !important; margin-right: 10px !important; } #promoSave:disabled { border-radius: 0; font-family: 'HM-Slussen-Extended-Semibold'; text-transform: uppercase; font-size: 12px; width: 100%; padding: 15px; border: 0; color: #CCC; margin-top: 24px; } #promoSave { border-radius: 0; font-family: 'HM-Slussen-Extended-Semibold'; text-transform: uppercase; font-size: 12px; width: 100%; padding: 15px; border: 0; background: black; color: white; margin-top: 24px; } .offer-box-title { font-weight: 600; color: black; font-size: 12px; margin-bottom: 0; } body #cart-coupon { max-height: initial; margin-left: 0; display: inline-block; padding: 0px; border-radius: 0; border: 1px solid #D9D9D9; font-family: "HM-Slussen-regular", sans-serif; box-sizing: border-box; -moz-box-sizing: border-box; padding-left: 13px; padding-right: 13px; -webkit-box-sizing: border-box; height: 55px !important; } .togglePromo-content-button-a { text-decoration: underline; } .coupon-label { margin-bottom: 5px; } .promoSave-content { border-top: 1px solid #D9D9D9; margin-top: -7px; } .offer-box-header { display: flex; gap: 6px; align-items: center; } #modal-offers-body-collapsible { padding-top: 20px; border-top: 1px solid #D9D9D9; margin-top: 118px; } .coupon-form { margin-bottom: 10px; } @media (max-width: 1024px) { .content-discount { margin-top: 35px; } #modal-offers-body-collapsible { padding-top: 12px; border-top: 1px solid #D9D9D9; margin-top: -2px; } .coupon-form { margin-bottom: 20px; } #birthDateModalContent { margin: 20px !important; } } body.utm { .togglePromo-content-button-a { font-size: 0; } .togglePromo-content-button-a::after { font-size: 13px; content: "Tienes un descuento"; } } .row-fluid.summary { .forms.coupon-column.summary-coupon-wrap.span7.pull-left { display: none !important; } #modal-offers-body-collapsible { display: none !important; } } .row-fluid.summary:has(#togglePromo0:checked), .row-fluid.summary:has(#togglePromo2:checked) { .forms.coupon-column.summary-coupon-wrap.span7.pull-left { display: block !important; } .togglePromo-content { margin-bottom: 10px; } #modal-offers-body-collapsible { display: block !important; } .togglePromo-content-button-a { font-size: 0; } .togglePromo-content-button-a::after { content: ""; width: 18px; height: 18px; display: inline-flex; align-items: center; background-repeat: no-repeat; background-size: contain; background-image: url(data:image/svg+xml,%3Csvg%20role%3D%22img%22%20aria-hidden%3D%22true%22%20focusable%3D%22false%22%20viewBox%3D%220%200%2016%2016%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20height%3D%2216%22%20width%3D%2216%22%3E%3Cpath%20d%3D%22M8.00011%206.9375L3.04%202L2%203.06L6.93945%207.99816L2%2012.96L3.04%2014L8.00011%209.05882L12.96%2014L14%2012.96L9.06077%207.99816L14%203.04L12.96%202L8.00011%206.9375Z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E); } } .forms.coupon-column.summary-coupon-wrap.text-center { display: none !important; } /* HMDCP-3411 EM-01: linea 'Member price' por item del carrito */ .table.cart-items td.product-name .hm-member-price { order: 2; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px; margin-top: 4px; font-family: "HM-Slussen-Regular"; font-size: 12px; font-weight: 400; line-height: 1.4; max-width: 100%; margin-bottom: 8px; } .table.cart-items td.product-name .hm-member-price__label { color: inherit; } .table.cart-items td.product-name .hm-member-price__value { color: var(--HmSale); font-weight: bold; } .table.cart-items tr.product-item.unavailable .hm-member-price { display: none !important; } /* HMDCP-3533 (DCCAPH-3022): Sticky CTA de la Shopping Bag (paso #/cart), solo mobile. Hoja aislada del modulo StickyCta.js. Contrato DOM y de clases (plan seccion 6): - Root: div#hm-sticky-cta.hm-sticky-cta, hijo directo de body, con data-hm-sticky-cta-state="active|loading|blocked|disabled". - Fila 1: .hm-sticky-cta__summary > .hm-sticky-cta__label (.hm-sticky-cta__label-text + .hm-sticky-cta__count) + .hm-sticky-cta__total - Fila 2: button.hm-sticky-cta__button > .hm-sticky-cta__button-text + .hm-sticky-cta__spinner - Teclado: modificador .hm-sticky-cta--keyboard-hidden en el root. - body.hm-sticky-cta-active mientras el CTA esta montado (reserva de espacio, chat y nativo oculto). - --hm-sticky-cta-height en document.documentElement: altura real del CTA en px (safe area incluida). Breakpoint del checkout: (max-width: 1024px) mobile / (min-width: 1025px) desktop. Todas las reglas de layout del CTA y del chat van dentro de la media query mobile; en desktop solo hay una regla de defensa. No se agregan colores ni tokens nuevos: cada valor cita su archivo:linea de origen. No se toca el meta viewport (sin viewport-fit=cover, D-5: queda condicionado a la prueba en iPhone real). Replicacion PE/CL/CO/EC: copiar tal cual; revisar el breakpoint y los selectores del chat del repo destino. */ /* Giro del spinner: mismos keyframes que @keyframes spin (checkoutUi.css:136-144), con nombre propio para que el modulo sea autocontenido. Fuera de la media query porque no aplica layout. */ @keyframes hm-sticky-cta-spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } @media (max-width: 1024px) { /* (1) Barra fija al pie. */ .hm-sticky-cta { position: fixed; top: auto; right: 0; bottom: 0; left: 0; /* Por debajo del chat (999999), overlay de carga (9999), modal de eliminar (100000), modales de VTEX ID y Bootstrap (1040/1050) y modal de conflicto de email (99999); por encima del contenido (plan 3.6, R-09). */ z-index: 1000; margin: 0; box-sizing: border-box; background-color: #fff; /* Separador de filas del carrito: .table.cart-items tbody tr (minicart.css:83-88). */ border-top: 1px solid #eee; /* Fallback sin env()/max(); la declaracion siguiente lo reemplaza donde hay soporte (AC-06, AC-07, AC-08). */ padding: 12px 16px; padding: 12px max(16px, env(safe-area-inset-right)) max(12px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left)); /* Capa propia para el elemento fijo (sin backdrop-filter, AC-19). Misma lista de funciones que el estado oculto por teclado para que la transicion interpole par a par. */ transform: translateY(0) translateZ(0); /* (8) Fade-in alineado con la lista: mismo opacity/delay/duracion que body .cart-template.full-cart>* (checkoutUi.css:858-867). Si el CTA se monta con body.v-custom-loaded ya presente, aparece sin transicion. */ opacity: 0; transition: opacity 0.5s ease 1.2s; } body.v-custom-loaded .hm-sticky-cta { opacity: 1; } /* (2) Fila 1: "TOTAL (N articulos)" a la izquierda, monto a la derecha. */ .hm-sticky-cta__summary { display: flex; justify-content: space-between; align-items: baseline; /* Separacion con el boton: mismo valor que el padding vertical de la barra. */ margin: 0 0 12px; } /* El label puede envolver y el monto nunca se corta (AC-05, 320px con monto de 6+ digitos y "(30 articulos)"). */ .hm-sticky-cta__label { min-width: 0; overflow-wrap: break-word; overflow-wrap: anywhere; font-family: "HM-Slussen-Extended-Regular"; font-size: 12px; color: var(--Hmblack); } .hm-sticky-cta__label-text { text-transform: uppercase; } .hm-sticky-cta__count { text-transform: none; } /* Espacio entre "TOTAL" y "(N articulos)". Si el DOM ya trae un espacio entre los spans, colapsa con este (white-space normal), asi que siempre queda uno solo. */ .hm-sticky-cta__count::before { content: " "; } /* Valores del total del resumen: .summary-template-holder tfoot tr td.monetary (minicart.css:242-248). */ .hm-sticky-cta__total { flex-shrink: 0; /* Separacion minima con el label: mismo valor que el padding lateral de la barra. */ margin-left: 16px; white-space: nowrap; font-family: "HM-Slussen-Extended-Semibold"; font-size: 16px; color: var(--Hmblack); text-transform: uppercase; } /* (3) Boton activo: copia del primario del resumen. - Fondo, fuente, tamano, sin borde ni radio y mayusculas: .summary-template-holder .cart-links-bottom .btn-success (minicart.css:187-194). text-transform uppercase: el DOM dice "Proceder al pago" y se ve "PROCEDER AL PAGO" (D-4). - Padding: .btn-large (checkoutUi.css:329-332). - line-height 20px: el de .btn del CSS base de checkout6 (fuera del repo), para igualar la altura del nativo. */ .hm-sticky-cta__button { position: relative; display: block; width: 100%; margin: 0; padding: 17px 19px; box-sizing: border-box; border: 0; border-radius: 0; -webkit-appearance: none; appearance: none; background-color: var(--Hmblack); color: #fff; font-family: "HM-Slussen-Extended-Semibold"; font-size: 12px; line-height: 20px; text-align: center; text-transform: uppercase; cursor: pointer; } /* :active del primario: .btn-success:active (checkoutUi.css:352-357). Solo en estado activo. */ .hm-sticky-cta[data-hm-sticky-cta-state="active"] .hm-sticky-cta__button:active { background-color: var(--SuccessDarker); } /* (4) Deshabilitado y bloqueado: mismo aspecto que el boton nativo deshabilitado (#cart-to-orderform.disabled, p. ej. con Terminos sin aceptar). Pedido del usuario (2026-10-09): se ve opaco como en web, sin cambiar el color. El nativo toma opacity .65 y cursor default de .btn.disabled de Bootstrap 2.3.2, el CSS base de checkout6 (fuera del repo): el boton conserva el fondo negro y el texto blanco. Sin borde ni cambio de tamano entre estados (sin layout shift ni cambio de --hm-sticky-cta-height). */ .hm-sticky-cta[data-hm-sticky-cta-state="disabled"] .hm-sticky-cta__button, .hm-sticky-cta[data-hm-sticky-cta-state="blocked"] .hm-sticky-cta__button { opacity: 0.65; cursor: default; } /* (5) Cargando: el boton primario con el label transparente (mismo tamano) y el spinner centrado. */ .hm-sticky-cta[data-hm-sticky-cta-state="loading"] .hm-sticky-cta__button { cursor: progress; } .hm-sticky-cta[data-hm-sticky-cta-state="loading"] .hm-sticky-cta__button-text { color: transparent; } /* Spinner: copia de .checkEmailAuthConflict__modal--button.js-loading:after (checkoutUi.css:111-124). Centrado con inset 0 + margin auto (no con transform, que lo usa la animacion). Oculto fuera de loading, asi la animacion no corre. */ .hm-sticky-cta__spinner { display: none; position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 10px; height: 10px; margin: auto; box-sizing: content-box; border: 3px solid var(--MutedFive); border-top: 3px solid #9999; border-radius: 50%; animation: hm-sticky-cta-spin 1s linear infinite; pointer-events: none; } .hm-sticky-cta[data-hm-sticky-cta-state="loading"] .hm-sticky-cta__spinner { display: block; } /* (6) Teclado abierto (AC-09, AC-10): oculto y fuera de la pantalla. visibility hidden tampoco recibe taps. No cambia la altura del nodo, asi que --hm-sticky-cta-height y el padding de body quedan iguales. */ .hm-sticky-cta.hm-sticky-cta--keyboard-hidden { visibility: hidden; transform: translateY(100%) translateZ(0); } /* (7) Espacio inferior (AC-03, AC-04, AC-16): le gana a body { padding-bottom: 0px !important } (checkoutUi.css:852-856, styles.css:740-744) por especificidad (0,1,1). Sin la clase no se reserva nada. */ body.hm-sticky-cta-active { padding-bottom: var(--hm-sticky-cta-height, 0px) !important; } /* (7b) HMDCP-3533, F-01 del QA (AC-04): body { min-height: 93vh } (checkoutUi.css:838, styles.css:726) es content-box, asi que el padding de (7) se sumaba a la altura minima (93vh + CTA) y con contenido corto aparecia un scroll que antes no existia. Se descuenta la reserva: la altura minima con padding vuelve a ser 93vh. Le gana a body (0,0,1, sin !important) por especificidad (0,1,1). No se cambia box-sizing de body. Si cambia el 93vh de base, actualizarlo aca (el contrato CSS de stickyCtaRender.js lo compara). */ body.hm-sticky-cta-active { min-height: calc(93vh - var(--hm-sticky-cta-height, 0px)); } /* (9) Chat flotante por encima del CTA, solo mientras el CTA esta montado (AC-21). Depende de la clase de body (no del teclado), asi que no salta con foco/blur, y aplica tambien si el chat carga tarde. - Widget actual (chatbot-widget.js): trigger div._triggerWrapper_ fijo a bottom 30px; se usa substring estable ante cambios del hash (R-04). Se conserva la distancia de 30px desde el borde del CTA. - .cw-trigger-wrapper: markup de HMDCP-3280 (styles.css:4799-4803), mismo ajuste que el widget actual. - .whatsappButonCheckout: legacy (styles.css:4764-4778, bottom 40px). !important le gana al inline sin !important. */ body.hm-sticky-cta-active #chatbot-container [class*="_triggerWrapper_"], body.hm-sticky-cta-active #chatbot-container .cw-trigger-wrapper { top: auto !important; bottom: calc(var(--hm-sticky-cta-height, 0px) + 30px) !important; } body.hm-sticky-cta-active .whatsappButonCheckout { top: auto !important; bottom: calc(var(--hm-sticky-cta-height, 0px) + 40px) !important; } /* (11) HMDCP-3533, S-10 revisado por el usuario (2026-10-09): con el CTA montado el boton nativo del resumen se oculta, asi no se ven dos "Proceder al pago". Solo se oculta, no sale del DOM: el tap del CTA hace click() sobre #cart-to-orderform (binding de VTEX + Tealium) y el error de Terminos se dispara sobre este wrapper. El checkbox (#tyc-container) es hermano del wrapper (ThirdPartyApps.mercadoPago) y sigue visible. Sin la clase de body (desktop, App, bolsa vacia u otro paso) el nativo se ve como siempre. */ body.hm-sticky-cta-active .cart-links-bottom .btn-place-order-wrapper { display: none !important; } } /* (6) Transicion corta del ocultamiento por teclado, solo si el usuario no pidio movimiento reducido. Mantiene el fade-in de (8) en la misma lista. Al ocultar, visibility cambia al final del deslizamiento; al mostrar, cambia al inicio. */ @media (max-width: 1024px) and (prefers-reduced-motion: no-preference) { .hm-sticky-cta { transition: opacity 0.5s ease 1.2s, transform 0.2s ease-out 0s, visibility 0s linear 0s; } .hm-sticky-cta.hm-sticky-cta--keyboard-hidden { transition: opacity 0.5s ease 1.2s, transform 0.2s ease-in 0s, visibility 0s linear 0.2s; } } /* (10) Defensa en desktop (AC-17): aunque el JS montara el nodo, no se muestra. El padding de body y el reposicionamiento del chat solo existen dentro de la media query mobile. */ @media (min-width: 1025px) { .hm-sticky-cta { display: none !important; } } /* source: */