@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&display=swap');

*{ margin:0; padding:0; box-sizing:border-box; font-family:'Poppins',sans-serif; }
body { background-color: #fafafb; padding-top: 120px; }
header { position: fixed; top:0; left:0; width:100%; padding:10px 7%; display:flex; justify-content:space-between; align-items:center; background:#004786; color:#fff; z-index:1000; }
.navbar { display:flex; gap:15px; list-style:none; }
.navbar li a { color:#fff; text-decoration:none; font-weight:600; }
.navbar .submenu { display:none; position:absolute; top:100%; background:#fff; color:#444; border-radius:5px; padding:10px 0; min-width:150px; box-shadow:0 4px 10px rgba(0,0,0,0.1); }
.navbar li:hover .submenu { display:block; }
.navbar .submenu li a { display:block; padding:8px 15px; color:#444; }
.navbar .submenu li a:hover { background:#f3831f; color:#fff; border-radius:5px; }

.header-icons i { font-size:24px; margin-left:10px; position:relative; cursor:pointer; }
#contadorCarrinho { position:absolute; top:-8px; right:-8px; background:red; color:#fff; border-radius:50%; padding:2px 6px; font-size:12px; }

.main-container { max-width:900px; margin:0 auto; padding:20px; }
.subtitulo { text-align:center; margin-bottom:20px; font-size:1.8rem; }

.lista-carrinho { list-style:none; margin-top:20px; }
.item-carrinho { display:flex; align-items:center; padding:12px; background:#fff; margin-bottom:12px; border-radius:10px; transition:0.2s; }
.item-carrinho:hover { transform:translateY(-3px); box-shadow:0 10px 20px rgba(0,0,0,0.1); }
.item-carrinho img { width:100px; height:80px; object-fit:cover; margin-right:15px; }
.quantidade-container { display:flex; align-items:center; gap:5px; margin-top:10px; }
.btn-quantidade { width:32px; height:32px; border-radius:50%; border:none; background:#0d6efd; color:#fff; font-weight:bold; cursor:pointer; transition:0.3s; }
.btn-quantidade:hover { background:#084298; }
.btn-quantidade:active { transform:scale(0.95); }

.barra-frete { max-width:900px; margin:30px auto; }
.barra-externa { width:100%; height:22px; background:#e2e8f0; border-radius:8px; overflow:hidden; }
.progresso { height:100%; width:0; background:linear-gradient(90deg,#f3831f,#004786); transition:width 0.4s ease; }
.texto-frete { text-align:center; margin-top:5px; font-weight:600; font-size:14px; }

.carrinho-resumo { display:flex; justify-content:flex-end; margin-top:20px; gap:10px; }
.btn-secundario { background:#f0ad4e; color:#222; border:none; padding:12px 25px; border-radius:8px; cursor:pointer; font-weight:600; transition:0.2s; }
.btn-secundario:hover { transform:translateY(-2px); }
.btn-finalizar-pedido { background:linear-gradient(135deg,#f3831f,#004786); color:#fff; padding:14px 28px; border-radius:12px; font-weight:700; cursor:pointer; transition:0.2s; }
.btn-finalizar-pedido:hover { transform:scale(1.03); }

.modal { display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.4); z-index:3000; }
.modal-content { background:#fff; margin:100px auto; padding:30px; border-radius:12px; max-width:500px; position:relative; box-shadow:0 20px 60px rgba(0,0,0,0.2); }
.close { position:absolute; top:12px; right:14px; font-size:28px; font-weight:bold; cursor:pointer; }
.resumo-conteudo { max-height:300px; overflow-y:auto; margin-top:10px; font-size:14px; line-height:1.4; }
.acoes-modal { display:flex; gap:10px; margin-top:20px; }
.btn-confirmar { background:#16a34a; color:#fff; border:none; padding:12px 20px; border-radius:8px; cursor:pointer; flex:1; }
.btn-cancelar { background:#ccc; color:#333; border:none; padding:12px 20px; border-radius:8px; cursor:pointer; flex:1; }