@charset "UTF-8"; /* 0 - 600PX: Phone 600 - 900px: Table portrait 900 - 1200px: Tablet landscape [1200 - 1800] is where our nortal styles apply 1800px + : Big desktop */ /* Media Query M3 */ @import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;700&display=swap"); /* Grid breakpoints */ .productDescriptionContainer .productDescriptionTitle { font-weight: 400; font-size: 24px; line-height: 32px; color: #575757; margin: 0 0 8px; } .productDescriptionContainer .productDescriptionText { font-weight: 400; font-size: 16px; line-height: 22px; color: #929292; } .container { padding: 0; } .container .carouselContainer { display: flex; flex-direction: column-reverse; } .container .carouselContainer .carouselGaleryThumbs { position: static; margin: 16px 0 0; } .container .carouselContainer .carouselThumbBorder { height: fit-content; } .container .productImagesThumb { max-height: 90px !important; margin: 0 16px 0 0; width: fit-content !important; } .container .productImagesThumb .figure, .container .productImagesThumb .figure .thumbImg { max-height: 90px; max-width: 90px; min-height: 90px; object-fit: fill; border-radius: 8px; } .container .productImageTag--main { object-fit: fill !important; max-width: 664px; min-height: 664px; } .container .productNameContainer { text-align: right; } .container .productNameContainer .productBrand--quickview { font-weight: 300; font-size: 20px; line-height: 34px; color: #575757; } .container .skuSelectorContainer { display: flex; flex-direction: column-reverse; } .container .skuSelectorContainer .skuSelectorSubcontainer { margin: 0; margin: 16px 0 10px; } .container .skuSelectorContainer .skuSelectorSubcontainer .skuSelectorTextContainer { margin: 0 0 8px 0; } .container .skuSelectorContainer .skuSelectorSubcontainer .skuSelectorTextContainer .skuSelectorName { font-size: 0; } .container .skuSelectorContainer .skuSelectorSubcontainer .skuSelectorTextContainer .skuSelectorName::before { content: "OUTROS TAMANHOS:"; font-weight: 400; font-size: 14px; line-height: 19px; color: #929292; } .container .skuSelectorContainer .skuSelectorSubcontainer .skuSelectorOptionsList { margin: 0; } .container .skuSelectorContainer .skuSelectorSubcontainer .skuSelectorOptionsList .skuSelectorItem { margin: 0 16px 0 0; } .container .skuSelectorContainer .skuSelectorSubcontainer .skuSelectorOptionsList .skuSelectorItem .frameAround { display: none; } .container .skuSelectorContainer .skuSelectorSubcontainer .skuSelectorOptionsList .skuSelectorItem .skuSelectorInternalBox { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; border: 1px solid #989898; } .container .skuSelectorContainer .skuSelectorSubcontainer .skuSelectorOptionsList .skuSelectorItem .skuSelectorInternalBox .diagonalCross { border-radius: 50%; background-image: linear-gradient(to top left, transparent 44%, #d5d5d5, transparent 52%); } .container .skuSelectorContainer .skuSelectorSubcontainer .skuSelectorOptionsList .skuSelectorItem--selected .skuSelectorInternalBox { border: 2px solid #000; } .container .skuSelectorContainer .skuSelectorSubcontainer .skuSelectorNameContainer { margin: 0; } .container .skuSelectorContainer .skuSelectorSubcontainer:first-child { margin: 0 0 16px; } .container .skuSelectorContainer .skuSelectorSubcontainer:first-child .skuSelectorTextContainer .skuSelectorName::before { content: "OUTRAS CORES:"; } .container .skuSelectorContainer .skuSelectorSubcontainer:first-child .skuSelectorTextContainer .skuSelectorSelectorImageValue, .container .skuSelectorContainer .skuSelectorSubcontainer:first-child .skuSelectorTextContainer .skuSelectorNameSeparator { display: none; } .container .skuSelectorContainer .skuSelectorSubcontainer:first-child .skuSelectorOptionsList { margin: 0; } .container .subscriberContainer { margin: 43px 0 0; } .container .subscriberContainer :global(.vtex-store-components-3-x-title) { font-size: 0; margin: 0; } .container .subscriberContainer :global(.vtex-store-components-3-x-title)::before { content: "Produto indisponível"; font-weight: 700; font-size: 14px; line-height: 19px; color: #868686; } .container .subscriberContainer :global(.vtex-store-components-3-x-subscribeLabel) { font-size: 0; } .container .subscriberContainer :global(.vtex-store-components-3-x-subscribeLabel)::before { content: "Deseja saber quando estiver disponível?"; font-weight: 400; font-size: 14px; line-height: 19px; color: #868686; } .container .subscriberContainer :global(.vtex-store-components-3-x-form) { margin: 0; } .container .subscriberContainer :global(.vtex-store-components-3-x-form) :global(.vtex-store-components-3-x-content) { display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 10px; row-gap: 15px; margin: 16px 0 0; } .container .subscriberContainer :global(.vtex-store-components-3-x-form) :global(.vtex-store-components-3-x-content) :global(.vtex-store-components-3-x-input) { margin: 0; } .container .subscriberContainer :global(.vtex-store-components-3-x-form) :global(.vtex-store-components-3-x-content) :global(.vtex-store-components-3-x-input) :global(.vtex-input) :global(.vtex-input-prefix__group) { padding: 12px 14px; border: 1px solid #989898; } .container .subscriberContainer :global(.vtex-store-components-3-x-form) :global(.vtex-store-components-3-x-content) :global(.vtex-store-components-3-x-input) :global(.vtex-input) :global(.vtex-input-prefix__group) :global(.vtex-styleguide-9-x-input) { padding: 0; font-weight: 400; font-size: 12px; line-height: 16px; color: #989898; } .container .subscriberContainer :global(.vtex-store-components-3-x-form) :global(.vtex-store-components-3-x-content) :global(.vtex-store-components-3-x-submit) { margin: 0; grid-area: 2/1/2/3; } .container .subscriberContainer :global(.vtex-store-components-3-x-form) :global(.vtex-store-components-3-x-content) :global(.vtex-store-components-3-x-submit) :global(.vtex-button) { padding: 12px 0; width: 100%; border: none; background: #000; } .container .subscriberContainer :global(.vtex-store-components-3-x-form) :global(.vtex-store-components-3-x-content) :global(.vtex-store-components-3-x-submit) :global(.vtex-button) :global(.vtex-button__label) { font-size: 0; } .container .subscriberContainer :global(.vtex-store-components-3-x-form) :global(.vtex-store-components-3-x-content) :global(.vtex-store-components-3-x-submit) :global(.vtex-button) :global(.vtex-button__label)::before { content: "AVISE-ME"; font-weight: 600; font-size: 18px; line-height: 25px; color: #fff; } .container .shippingContainer { display: flex; position: relative; padding: 27px 0 0; width: 280px; } .container .shippingContainer :global(.vtex-button) { width: auto; } .container .shippingContainer :global(.vtex-button) :global(.vtex-button__label) { font-size: 0; padding: 15px; padding-top: 15px !important; padding-bottom: 15px !important; } .container .shippingContainer :global(.vtex-button) :global(.vtex-button__label)::before { content: "OK"; font-weight: 600; font-size: 14px; line-height: 19px; } .container .shippingContainer :global(.vtex-address-form__postalCode) { flex: 1; padding: 0; } .container .shippingContainer :global(.vtex-address-form__postalCode) :global(.vtex-input) :global(.vtex-input__label) { position: absolute; top: 0; left: 0; margin: 0; font-size: 0; } .container .shippingContainer :global(.vtex-address-form__postalCode) :global(.vtex-input) :global(.vtex-input__label)::before { content: "CALCULAR FRETE:"; font-weight: 400; font-size: 14px; line-height: 19px; color: #929292; } .container .shippingContainer :global(.vtex-address-form__postalCode) :global(.vtex-input) :global(.vtex-input-prefix__group) { height: 100%; } .container .shippingContainer :global(.vtex-address-form__postalCode) :global(.vtex-input) :global(.vtex-input__suffix) { display: none; } .container .shippingContainer :global(.vtex-address-form__postalCode) :global(.vtex-input) :global(.vtex-input__error) { display: none; } .container .shippingContainer :global(.vtex-address-form__postalCode) :global(.vtex-address-form-4-x-input) { padding: 16px; font-weight: 400; font-size: 12px; line-height: 16px; color: #afafaf; } .container .shippingContainer :global(.vtex-address-form__postalCode) :global(.vtex-address-form-4-x-input):focus::before { display: none; } .container .shippingContainer :global(.vtex-address-form__postalCode) :global(.vtex-address-form-4-x-input)::before { content: "asdasd"; } .container .shippingContainer :global(.vtex-address-form__postalCode) :global(.vtex-address-form__postalCode-forgottenURL) { padding: 0; position: absolute; top: 43px; left: calc(100% + 32px); white-space: nowrap; text-decoration-line: underline; } .container .shippingContainer :global(.vtex-address-form__postalCode) :global(.vtex-address-form__postalCode-forgottenURL) :global(.vtex__icon-external-link) { display: none; } .container .shippingTable { margin: 16px 0 0; padding: 0; border: none; width: fit-content; } .container .shippingTable .shippingTableHead { display: table-header-group; } .container .shippingTable .shippingTableHead .shippingTableRow { text-align: left; display: grid; grid-template-columns: repeat(3, 1fr); } .container .shippingTable .shippingTableHead .shippingTableRow .shippingTableHeadDeliveryEstimate { grid-area: 1/3/1/3; } .container .shippingTable .shippingTableHead .shippingTableRow .shippingTableHeadDeliveryEstimate::before { content: "PRAZO"; } .container .shippingTable .shippingTableHead .shippingTableRow .shippingTableHeadDeliveryName::before { content: "ENTREGA"; } .container .shippingTable .shippingTableHead .shippingTableRow .shippingTableHeadDeliveryPrice::before { content: "FRETE"; } .container .shippingTable .shippingTableHead .shippingTableRow .shippingTableHeadDeliveryEstimate, .container .shippingTable .shippingTableHead .shippingTableRow .shippingTableHeadDeliveryName, .container .shippingTable .shippingTableHead .shippingTableRow .shippingTableHeadDeliveryPrice { font-size: 0; } .container .shippingTable .shippingTableHead .shippingTableRow .shippingTableHeadDeliveryEstimate::before, .container .shippingTable .shippingTableHead .shippingTableRow .shippingTableHeadDeliveryName::before, .container .shippingTable .shippingTableHead .shippingTableRow .shippingTableHeadDeliveryPrice::before { font-weight: 400; font-size: 14px; line-height: 19px; color: #202020; } .container .shippingTable .shippingTableBody { font-weight: 400; font-size: 12px; line-height: 16px; color: #afafaf; } .container .shippingTable .shippingTableBody .shippingTableRow { margin: 15px 0 0; display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: 1; } .container .shippingTable .shippingTableBody .shippingTableRow .shippingTableCell { padding: 0; } .container .shippingTable .shippingTableBody .shippingTableRow .shippingTableCell .shippingTableRadioBtn { display: none; } .container .shippingTable .shippingTableBody .shippingTableRow .shippingTableCellDeliveryEstimate { grid-area: 1/3/1/3; }