.commerce-navbar-container{padding:0 15px;margin:0 auto;max-width:1300px}.commerce-user-menu a{font-size:11px!important;font-weight:700!important;text-transform:uppercase}.navbar-top .commerce-user-menu a,.navbar-top .commerce-user-menu a:hover,.navbar-top .commerce-user-menu a:focus{background:transparent!important;text-decoration:none}.navbar-actions{display:flex!important;align-items:stretch}.navbar-actions #divSearchButton{padding-top:9px!important}.navbar-actions .cartMenu>a{display:block;color:#fff;padding:16px 12px 14px;line-height:20px}.navbar-actions .cartMenu .count-cart{margin-right:3px}.commerce-page-heading{margin-bottom:20px}.commerce-price-profile{text-align:right;padding-top:20px}.commerce-price-profile span,.commerce-price-profile small{display:block}.commerce-search-form{margin:0 0 25px}.commerce-product{height:455px!important;display:flex;flex-direction:column}.commerce-product .image{height:205px!important;display:flex;align-items:center;justify-content:center;overflow:hidden}.commerce-product .image img{max-height:205px;margin:auto}.commerce-product-link,.commerce-product-title{border:0;background:transparent;padding:0;cursor:pointer;color:inherit}.commerce-product-link{width:100%}.commerce-product-title{font-size:18px;text-align:left}.commerce-product .description{flex:1}.commerce-product .action-control{padding:0 15px 15px}.commerce-product .action-control .btn{width:100%}.commerce-specs{min-height:38px;color:#777}.commerce-price{font-size:17px;color:#34495e}.commerce-price-locked{font-size:14px}.commerce-unavailable{margin-top:25px}.commerce-modal-content{padding:25px;min-height:420px}.commerce-modal-content>.close{position:absolute;right:13px;top:8px;z-index:5;font-size:32px}.commerce-gallery>img{width:100%;max-height:480px;object-fit:contain}.commerce-thumbnails{display:flex;gap:8px;margin-top:10px;overflow:auto}.commerce-thumbnails button{width:70px;height:55px;padding:2px;border:1px solid #ddd;background:#fff}.commerce-thumbnails img{width:100%;height:100%;object-fit:cover}.commerce-bundle-number{font-size:16px;color:#777}.commerce-bundle-specs{display:grid;grid-template-columns:110px 1fr;gap:5px 10px}.commerce-bundle-specs dt,.commerce-bundle-specs dd{margin:0}.commerce-modal-price{font-size:18px;margin-top:15px}.commerce-slab-section{clear:both;padding-top:25px}.commerce-slab-table th,.commerce-slab-table td{vertical-align:middle!important}.commerce-select-column{text-align:center;width:70px}.commerce-slab-unavailable{opacity:.62}.commerce-status{display:inline-block;padding:4px 8px;border-radius:2px;background:#777;color:#fff;font-size:11px;text-transform:uppercase}.commerce-status-available,.commerce-status-confirmed,.commerce-status-delivered{background:#3c8b3c}.commerce-status-hold,.commerce-status-submitted,.commerce-status-processing{background:#d18b00}.commerce-status-sold{background:#34495e}.commerce-status-disabled,.commerce-status-expired,.commerce-status-cancelled{background:#8b0000}.commerce-floating-cart{position:fixed!important;display:none;right:18px!important;top:108px!important;width:390px!important;max-width:calc(100vw - 30px);max-height:calc(100vh - 130px);overflow:auto;background:#fff;box-shadow:0 5px 24px rgba(0,0,0,.35);z-index:10050!important}.commerce-floating-cart.is-open{display:block!important}.commerce-cart-header{display:flex;justify-content:space-between;align-items:center;background:#34495e;color:#fff;padding:14px 16px;font-size:18px}.commerce-cart-close{border:0;background:transparent;color:#fff;font-size:25px}.commerce-cart-body{padding:15px}.commerce-cart-item{display:flex;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid #ddd}.commerce-cart-item span,.commerce-cart-item small{display:block}.commerce-cart-item button,.commerce-cart-page-remove{border:0;background:transparent;color:#8b0000}.commerce-cart-total{display:flex;justify-content:space-between;padding:15px 0;font-size:18px}.commerce-cart-loading,.commerce-cart-empty{text-align:center;padding:25px}.commerce-form{margin:20px 0}.commerce-form-narrow{max-width:700px}.commerce-form sup{color:#b00}.commerce-complete{padding:55px 15px}.commerce-complete>i{font-size:70px;color:#84bd00}.commerce-complete .btn{margin:15px 4px}.commerce-alert{margin-top:15px}.commerce-logout-form{margin-top:25px}.commerce-logout-form button{border:0;background:#fff}.commerce-order-section{margin:25px 0}.commerce-orders-table{width:100%}.commerce-orders-table th{background:#34495e!important;color:#fff!important}.commerce-orders-table th,.commerce-orders-table td{padding:12px!important}.commerce-order-summary{margin:20px 0}.commerce-order-summary>div{border:1px solid #ddd;padding:15px}.commerce-order-summary small,.commerce-order-summary strong{display:block}.commerce-order-notes{padding:15px;background:#f5f5f5}.commerce-submit-hold{max-width:650px;margin:25px 0}.erro-login{margin:0 0 10px;color:#b00000;font-size:13px} .inventory-source-navigation{display:flex;align-items:stretch;width:100%;margin:0 -2px 12px}.inventory-source-option{flex:1 1 0;min-width:0;padding:2px!important}.inventory-source-option>.btn{height:100%;white-space:normal}.inventory-source-flag{vertical-align:middle;width:20px;margin-right:8px}.inventory-source-icon{display:inline-block;vertical-align:middle;width:20px;margin-right:8px;font-size:20px;line-height:1;text-align:center}.commerce-inventory-heading{float:none;margin-bottom:15px;padding-left:0;padding-right:0} #BTP_ALL,#MostraIS{display:none!important} .commerce-cancel-order{margin:20px 0} @media(max-width:991px){.inventory-source-navigation{flex-wrap:wrap}.inventory-source-option{flex:1 1 50%}} @media(max-width:480px){.inventory-source-option{flex-basis:100%}} .commerce-image-placeholder{display:flex;align-items:center;justify-content:center;width:100%;height:205px;background:#edf0f2;color:#9aa3aa;font-size:48px} .commerce-native-details .commerce-gallery{position:relative;min-height:300px}.commerce-native-details .commerce-gallery .style3{height:300px;overflow:hidden}.commerce-native-details .commerce-gallery .style3>a{display:flex;align-items:center;justify-content:center;width:100%;height:300px}.commerce-native-details .commerce-gallery .style3 img{width:100%;height:300px;object-fit:cover}.commerce-native-details .commerce-gallery-more{position:absolute;right:0;bottom:0;z-index:2;padding:10px;background:rgba(0,0,0,.8)}.commerce-native-details .commerce-gallery-more a{color:#fff}.commerce-native-details .zoom{padding:8px 0;text-align:center}.commerce-native-details .commerce-thumbnails{display:block;margin-top:0;overflow:visible}.commerce-native-details .commerce-thumbnails a{height:47px;padding:0;background:#fff}.commerce-native-details .commerce-thumbnails img{width:60px!important;height:45px!important;object-fit:cover}.commerce-native-details .commerce-product-summary{min-height:424px!important;padding-bottom:0}.commerce-native-details .product-title{margin-top:0}.commerce-native-details .details-description small{display:inline;font-size:smaller}.commerce-native-details .commerce-inventory-marker{display:flex;align-items:center;padding:15px 0 25px}.commerce-native-details .commerce-inventory-marker>span{display:flex;align-items:center;justify-content:center;width:30px;height:30px;margin-right:10px;color:#fff;background:#34495e;border-radius:50%}.commerce-native-details .commerce-product-lower{min-height:0!important}.commerce-native-details .product-tab{margin-top:30px}.commerce-native-details .tb-slabs-div{overflow:auto}.commerce-native-details .commerce-slab-help{margin:5px 0 12px}.commerce-native-details .commerce-slab-total-row{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:10px}.commerce-native-details .previous-back{float:right;margin-top:18px;cursor:pointer}.commerce-native-details .commerce-gallery-empty{display:flex;align-items:center;justify-content:center}.commerce-native-details .commerce-gallery-empty .commerce-image-placeholder{height:300px} .commerce-inventory-product{height:500px!important;cursor:pointer}.commerce-inventory-image{height:150px!important;display:flex!important;align-items:center;justify-content:center}.commerce-inventory-image>a{display:flex;width:100%;height:150px;align-items:center;justify-content:center;overflow:hidden}.commerce-inventory-image img{max-height:150px;margin:auto}.commerce-inventory-image .commerce-image-placeholder{height:150px}.commerce-inventory-product .description h4{min-height:30px}.commerce-inventory-slab-count{height:40px}.commerce-inventory-location{display:flex;align-items:center;justify-content:center;padding-bottom:6px}.commerce-inventory-location-icon{display:flex;align-items:center;justify-content:center;width:30px;height:30px;margin-right:10px;color:#fff;background:#34495e;border-radius:50%}.commerce-thickness-2cm{color:#c00!important;font-weight:bold}.commerce-thickness-3cm{color:blue!important;font-weight:bold}.commerce-price-unit{display:inline!important;width:auto!important;font-size:smaller}.commerce-locked-card-price{font-size:13px!important}.commerce-inventory-action{padding-top:10px!important} @media(max-width:767px){.commerce-price-profile{text-align:left;padding-top:5px}.commerce-product{height:auto!important}.commerce-floating-cart{right:8px!important;top:75px!important}.commerce-order-summary>div{margin-bottom:5px}.commerce-user-menu{margin:0}.navbar-actions{display:none!important}.commerce-native-details .commerce-slab-total-row{align-items:stretch;flex-direction:column}.commerce-native-details .commerce-slab-total-row .btn{width:100%}} /* Floating cart: mirrors Plataforma.View while retaining slab-level commerce. */ .CarrinhoFlutuante.commerce-floating-cart{background-clip:padding-box;background-color:#fff;border-left:1px solid #ccc;bottom:0!important;box-shadow:0 6px 12px rgb(0 0 0 / 18%);display:none;max-height:none;max-width:500px!important;overflow:visible;position:fixed!important;right:0!important;top:0!important;width:100%!important;z-index:99999!important} .CarrinhoFlutuante.commerce-floating-cart.is-open{display:block!important} .commerce-floating-cart .contentcart{background-color:#fff;border:1px solid rgba(0,0,0,.15);border-radius:0;bottom:0;box-shadow:0 6px 12px rgb(0 0 0 / 18%);display:flex!important;flex-direction:column;justify-content:space-between!important;max-height:100vh;max-width:500px!important;position:fixed;right:0;top:0;transition:all .5s ease;width:100%;z-index:1350!important} .commerce-floating-cart .miniCart{height:calc(100% - 3.4375rem - 1.5rem);overflow:hidden} .commerce-floating-cart .modalheader{align-items:flex-start;border-bottom:1px solid #dee2e6;display:flex;justify-content:space-between;line-height:1;padding:1rem 1rem 0} .commerce-floating-cart .modalheader h2{color:#fff;font-size:24px;margin:5px 0 5px} .commerce-floating-cart .CartHeight{height:calc(100% - 18.75rem);overflow:hidden} .commerce-floating-cart .rolagem{height:calc(100% - 3.4375rem - 1.5rem);margin-bottom:50px;margin-right:3px;overflow-y:auto!important} .commerce-floating-cart .CartFooter{background:#ecf0f1;bottom:0;padding:10px;position:absolute;width:100%} .commerce-floating-cart .commerce-cart-message{padding:40px 20px} .commerce-floating-cart .commerce-cart-message .btn,.commerce-floating-cart .commerce-cart-message .previous-back{display:inline-block;margin-top:25px} .commerce-floating-cart .commerce-slab-cart-table{table-layout:fixed;width:100%} .commerce-floating-cart .commerce-slab-cart-table tr{border-bottom:1px solid #ddd} .commerce-floating-cart .commerce-slab-cart-table td{padding:8px 5px;vertical-align:top} .commerce-floating-cart .tabela-cart-bundles-header{padding:20px 5px 10px;text-align:center} .commerce-floating-cart .miniCartProductThumb{width:22%} .commerce-floating-cart .miniCartProductThumb img{height:72px;object-fit:cover;width:96px} .commerce-floating-cart .miniCartDescription{width:48%} .commerce-floating-cart .miniCartDescription h4{font-size:18px;font-weight:600;margin:0 0 6px;padding-bottom:0} .commerce-floating-cart .miniCartDescription h4 a,.commerce-floating-cart .miniCartSubtotal span{color:#34495e} .commerce-floating-cart .miniCartDescription .size{color:#888;font-size:11px} .commerce-floating-cart .miniCartSubtotal{padding-top:12px!important;text-align:right;width:25%} .commerce-floating-cart .delete-cart{padding-top:12px!important;text-align:center;width:5%} .commerce-floating-cart .delete-cart a{color:#8b0000;cursor:pointer} .commerce-floating-cart .commerce-cart-loading{padding:40px 20px;text-align:center} @media(max-width:767px){.CarrinhoFlutuante.commerce-floating-cart,.commerce-floating-cart .contentcart{max-width:none!important;width:100%!important}.commerce-floating-cart .miniCartProductThumb img{height:58px;width:72px}} /* Order list and details: follows the Plataforma.View account-area layout. */ .commerce-order-list-section{margin-top:20px} .order-expand-button{background:none;border:0;color:#d71920;font-size:20px;font-weight:bold;line-height:1;margin-left:0;padding:2px 5px} .order-expand-button:focus,.order-expand-button:hover{color:#a90f15;outline:none;text-decoration:none} .order-expand-column{text-align:center;width:36px} .order-bundles-row{display:none} .order-bundles-cell{background:#fafafa;padding:14px 16px!important} .order-bundles-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:12px} .order-bundles-title{color:#333;font-size:13px;font-weight:bold;text-transform:uppercase} .order-bundles-list{display:flex;flex-wrap:wrap;gap:12px} .order-bundle-item{border:1px solid #ddd;border-radius:4px;color:#333;display:block;overflow:hidden;text-decoration:none;width:150px} .order-bundle-item:focus,.order-bundle-item:hover{border-color:#999;color:#333;text-decoration:none} .order-bundle-item img{background:#eee;height:82px;object-fit:cover;width:100%} .order-bundle-info{display:block;padding:8px} .order-bundle-name{display:block;font-size:12px;font-weight:bold;line-height:1.2;margin:0 8px;min-height:30px} .order-bundle-meta{color:#666;display:block;font-size:11px;line-height:1.35;margin:4px 8px} .order-bundles-empty{color:#777;font-size:12px;margin:0} .commerce-order-status-content{line-height:35px} .commerce-order-status-content:after{clear:both;content:"";display:table} .commerce-order-hold-message{clear:both;margin:20px 15px} .commerce-order-box-column,.commerce-cancel-order-wrapper{padding-left:0;padding-right:0} .commerce-order-product{align-items:flex-start;border-bottom:1px solid #ddd;display:flex;margin-bottom:10px;padding:10px 0} .commerce-order-product:last-child{border-bottom:0;margin-bottom:0} .commerce-order-product-image{width:23.333333%} .commerce-order-product-image img{height:120px;object-fit:cover;width:80%} .commerce-order-product-description{width:23.333333%} .commerce-order-product-description h4{margin-top:0;padding-bottom:0} .commerce-order-product-measurements{width:30%} .commerce-order-product-price{text-align:right;width:23.333333%} @media(max-width:767px){.commerce-order-product{flex-wrap:wrap}.commerce-order-product-image,.commerce-order-product-description{width:50%}.commerce-order-product-measurements,.commerce-order-product-price{margin-top:12px;width:50%}.order-bundle-item{width:calc(50% - 6px)}} /* ------------------------------------------------------------------ Correcao do conflito com slabware.css slabware.css (linha 375) define: .alert { display:none; position:fixed; left:15%!important; top:10%!important; text-indent:40px; text-align:center!important; width:70%; z-index:2000 } Isso trata .alert como um aviso flutuante do site, e nao como o bloco estatico do Bootstrap. Duas consequencias no Fabricator Commerce: 1. A caixa do Sweet Modal recebia a classe 'alert' (padrao herdado do Wing) e ficava com display:none -- o overlay abria, mas o modal nao aparecia. 2. Todos os avisos estaticos das telas de Commerce ficavam invisiveis. As regras abaixo restauram o comportamento esperado apenas no escopo do Commerce, sem alterar slabware.css (compartilhado com o restante do site). ------------------------------------------------------------------ */ /* Blindagem: nenhuma caixa de Sweet Modal pode ser ocultada pela regra .alert. */ .sweet-modal-overlay .sweet-modal-box.alert { display: block !important; position: absolute !important; /* Neutraliza o top:10%!important do slabware. Nao usar auto: o plugin aplica margin-top negativo inline contando com top:50% para centralizar. */ top: 50% !important; left: 25% !important; width: 50%; text-indent: 0; text-align: left !important; } /* Avisos estaticos do Commerce voltam a ser blocos no fluxo da pagina. */ .commerce-alert { display: block !important; position: static !important; top: auto !important; left: auto !important; width: auto; z-index: auto; text-indent: 0; text-align: left !important; } /* Conteudo dos Sweet Modals centralizado. */ .sweet-modal-overlay .sweet-modal-box .sweet-modal-content, .sweet-modal-overlay .sweet-modal-box .sweet-modal-buttons { text-align: center; } /* ------------------------------------------------------------------ Modal do Our Inventory em telas menores. O corpo do modal usa colunas 7/5, que abaixo de 992px ficam estreitas demais (a foto some e a tabela de chapas espreme). As regras abaixo empilham as colunas, deixam a galeria fluida e rolam a tabela na horizontal. Escopadas em .commerce-our-inventory-details para nao alterar o modal do estoque Brothers (.commerce-native-details). ------------------------------------------------------------------ */ .commerce-our-inventory-details .commerce-copy-actions { padding-bottom: 25px; } .commerce-our-inventory-details .commerce-download-image { margin-top: 18px; } @media (max-width: 991px) { #product-details-modal .modal-dialog { margin: 10px auto; max-width: 96%; width: auto; } .commerce-our-inventory-details > .col-sm-7, .commerce-our-inventory-details > .col-sm-5 { float: none; padding-left: 15px; padding-right: 15px; width: 100%; } .commerce-our-inventory-details .modal-details { padding-top: 20px; } .commerce-our-inventory-details .commerce-gallery, .commerce-our-inventory-details .commerce-gallery .col-lg-12 { width: 100%; } .commerce-our-inventory-details #commerceMainImage { height: auto; max-width: 100%; width: 100%; } .commerce-our-inventory-details .commerce-thumbnails { display: flex; flex-wrap: wrap; gap: 6px; } .commerce-our-inventory-details .commerce-thumbnails .thumbLink { display: block; width: calc(25% - 6px); } .commerce-our-inventory-details .commerce-thumbnails img { height: auto; width: 100%; } .commerce-our-inventory-details .tb-slabs-div { -webkit-overflow-scrolling: touch; overflow-x: auto; } .commerce-our-inventory-details .commerce-slab-table { min-width: 620px; } } @media (max-width: 767px) { .commerce-our-inventory-details .product-title { font-size: 22px; line-height: 1.2; } .commerce-our-inventory-details .commerce-thumbnails .thumbLink { width: calc(33.333% - 6px); } .commerce-our-inventory-details .commerce-copy-actions .btn, .commerce-our-inventory-details .commerce-product-summary > .btn { width: 100%; } .commerce-our-inventory-details .details-description p { margin-bottom: 6px; } } /* A pedido: HOME/INVENTORY/SEARCH/CART ficam na mesma linha do logo em qualquer largura, como o Bootstrap ja faz em telas >=768px -- sem cair numa segunda linha (o efeito 'expandido' de menu mobile aberto) e sem depender do botao hamburguer, que perde a funcao e some. O icone de busca proprio do mobile (`.area-mobile .search-box`) tambem some, pois o botao 'SEARCH' do menu principal passa a ficar sempre visivel. */ .navbar-header .navbar-toggle { display: none !important; } .commerce-navbar-row { display: flex; align-items: center; flex-wrap: nowrap; width: 100%; } .commerce-navbar-row .navbar-header { flex: 0 0 auto; } .navbar-header .area-mobile { display: none !important; } .navbar-collapse.collapse { display: flex !important; align-items: center; flex: 1 1 auto; min-width: 0; height: auto !important; overflow: visible !important; width: auto; } .navbar-collapse .navbar-left.navbar-nav { display: flex; flex-wrap: nowrap; float: none; margin: 0; order: 1; } .navbar-collapse .navbar-left.navbar-nav > li { float: none; } /* No HTML, o grupo de busca/carrinho vem ANTES de HOME/INVENTORY -- 'order' os reposiciona visualmente para o layout do print (HOME/INVENTORY perto da logo, busca/carrinho no extremo direito) sem alterar o DOM. Abaixo de 767px, style.css tem '.hidden-xs{display:none!important; visibility:hidden!important}' (regra generica reaproveitada em varios lugares do site) -- por isso o 'display' sozinho nao bastava, tambem precisa reverter o 'visibility' explicitamente. */ .navbar-collapse .navbar-actions.hidden-xs { display: flex !important; visibility: visible !important; align-items: center; order: 2; margin-left: auto; } /* style.css ja escondia o texto 'Cart ($0.00)' entre 768-979px (regra original: .cartRespons{font-size:0} dentro de @media(max-width:979px)) e o devolvia abaixo de 767px, pois nessa largura o carrinho ganhava uma linha propria dentro do menu mobile aberto. Como HOME/INVENTORY/busca/ carrinho agora dividem sempre a mesma linha, mantemos o carrinho compacto (icone + contador) em toda essa faixa, sem reaparecer abaixo de 767px. */ @media (max-width: 979px) { .navbar-actions .cartRespons { display: none !important; } }