/* Babi · estilos do e-commerce (checkout, pedido, imagens reais) */
.photo.has-img{background:none;overflow:hidden;display:flex;align-items:center;justify-content:center;background:#f6edf0}
.photo.has-img img{width:100%;height:100%;object-fit:cover;display:block}
.product.sold-out .product-image{opacity:.6}
.product.sold-out .tag{background:var(--ink);color:#fff}
.options button.unavailable{opacity:.35;text-decoration:line-through;cursor:not-allowed}
.gallery{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.gallery button{width:64px;height:64px;border:1px solid var(--line);padding:0;background:#fff;cursor:pointer;overflow:hidden}
.gallery button.selected{border-color:var(--accent)}
.gallery img{width:100%;height:100%;object-fit:cover}
.installments{color:var(--muted);font-size:12px;margin-top:-10px}
.muted{color:var(--muted)} .small{font-size:12px} .error{color:#b3261e;font-size:13px;padding:10px 0}
.link{background:none;border:0;padding:0;color:var(--accent);text-decoration:underline;cursor:pointer;font:inherit}

.checkout h1,.order-page h1{font-size:clamp(28px,4vw,42px);margin:8px 0 24px}
.checkout-grid,.order-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(280px,.9fr);gap:40px;align-items:start}
.checkout h2{font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;margin:32px 0 14px;color:var(--accent);font-weight:600}
.checkout h2:first-child{margin-top:0}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:12px 16px}
.field{display:flex;flex-direction:column;gap:6px;grid-column:span 2}
.field.half{grid-column:span 1}
.field span{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.field input,.coupon input{width:100%;border:1px solid var(--line);background:#fff;padding:12px 14px;font-size:14px;border-radius:10px;outline:0}
.field input:focus,.coupon input:focus{border-color:var(--accent)}
.check{display:flex;gap:10px;align-items:flex-start;font-size:13px;margin:12px 0;line-height:1.5}
.check input{margin-top:3px;width:16px;height:16px;accent-color:var(--accent)}
.shipping-box{margin:16px 0 0;border:1px solid var(--line);padding:16px;background:#fff;border-radius:var(--radius)}
.shipping-box h3,.pay-pending h3,.tracking h3{font-size:12px;letter-spacing:.1em;text-transform:uppercase;margin:0 0 12px}
.ship-opt{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--line);margin-bottom:8px;cursor:pointer;font-size:14px;border-radius:12px}
.ship-opt.selected{border-color:var(--accent);background:var(--paper)}
.ship-opt input{accent-color:var(--accent)} .ship-opt span{flex:1} .ship-opt small{color:var(--muted)}
.ship-opt b{font-weight:600}
.payment-box .pay-opt{border:1px solid var(--accent);background:var(--paper);padding:14px 16px;font-size:13px}
.payment-box .pay-opt p{margin:4px 0 0;color:var(--muted)}
.primary.big{width:100%;justify-content:center;margin-top:16px;padding:16px}
.summary{border:1px solid var(--line);background:#fff;padding:22px;position:sticky;top:calc(var(--header-h) + var(--nav-h) + 16px);border-radius:var(--radius)}
.summary h2{font-size:13px;letter-spacing:.12em;text-transform:uppercase;margin:0 0 16px}
.sum-line{display:grid;grid-template-columns:56px 1fr auto;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line);font-size:13px}
.sum-line .photo{width:56px;height:56px;aspect-ratio:1;position:static;transform:none;flex:none}
.sum-line small{color:var(--muted)}
.order-page .sum-line{grid-template-columns:1fr auto}
.coupon{display:flex;gap:8px;margin:16px 0}
.coupon .outline{padding:10px 16px;white-space:nowrap}
.tot{display:flex;justify-content:space-between;font-size:13px;padding:6px 0;color:var(--muted)}
.tot.total{border-top:1px solid var(--line);margin-top:8px;padding-top:14px;color:var(--ink);font-size:16px}
.order-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:24px}
.steps{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;list-style:none;padding:0;margin:0 0 32px;counter-reset:s}
.steps li{font-size:11px;letter-spacing:.06em;text-transform:uppercase;padding:14px 4px 0;border-top:3px solid var(--line);color:var(--muted)}
.steps li.done{border-color:var(--accent);color:var(--ink)}
.pay-pending,.pay-ok,.tracking{border:1px solid var(--line);background:#fff;padding:20px;margin-bottom:20px;border-radius:var(--radius)}
.pay-ok{display:flex;gap:10px;align-items:center;border-color:#9bc3a3;background:#f1f8f2;font-weight:600}
.pay-ok svg,.pay-pending svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.6}
.pixcode{display:flex;gap:8px;align-items:center;margin:8px 0 14px}
.pixcode code{flex:1;font-size:12px;word-break:break-all;background:var(--paper);padding:10px;border:1px dashed var(--line)}
.pay-pending .outline{margin-top:10px}
@media(max-width:800px){.checkout-grid,.order-grid{grid-template-columns:1fr}.summary{position:static}.fields{grid-template-columns:1fr}.field.half{grid-column:span 1}.steps{grid-template-columns:repeat(5,1fr)}.steps li{font-size:9px}}

.delivery-choice{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 0 0}.delivery-choice .ship-opt{margin:0}.delivery-choice svg{width:20px;height:20px}@media(max-width:600px){.delivery-choice{grid-template-columns:1fr}}

.pixqr{text-align:center;margin:10px 0}.pixqr img{border:1px solid #ebdce2;border-radius:8px;background:#fff;padding:6px}

.age-gate{max-width:560px;margin:40px auto;text-align:center}.age-gate .row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:18px}.age-gate .outline{display:inline-block;padding:14px 22px;border:1px solid var(--line);text-decoration:none;color:inherit}

.wa-float{position:fixed;right:18px;bottom:18px;z-index:60;display:flex;align-items:center;gap:8px;background:#25d366;color:#fff;text-decoration:none;font-weight:600;font-size:13px;padding:10px 16px 10px 12px;border-radius:999px;box-shadow:0 6px 20px rgba(0,0,0,.18);transition:transform .2s}.wa-float:hover{transform:translateY(-2px)}@media(max-width:600px){.wa-float span{display:none}.wa-float{padding:12px}}

.color-swatches{display:flex;align-items:center;gap:8px;margin:14px 0;flex-wrap:wrap}.color-swatches .muted{font-size:12px;margin-right:2px}.color-swatches .cs{display:inline-flex;width:30px;height:30px;border-radius:50%;border:2px solid transparent;padding:2px;transition:border-color .15s}.color-swatches .cs i{display:block;width:100%;height:100%;border-radius:50%;outline:1px solid #d8c8ce}.color-swatches .cs.selected{border-color:var(--accent)}.color-swatches .cs.out i{opacity:.35}.color-swatches small{font-size:12px;color:var(--muted);margin-left:4px}.card-swatches{display:inline-flex;gap:3px}.card-swatches .swatch.sel{outline-color:var(--accent)}

.header-actions a#accountBtn{display:flex;gap:8px;align-items:center;font-size:10px;white-space:nowrap;padding:5px 0;text-decoration:none;color:inherit}.header-actions a#accountBtn svg{width:18px;height:18px}
.account-box{max-width:520px;margin:0 auto;background:#fff;border:1px solid var(--line);padding:28px;border-radius:var(--radius)}.account-box h2{margin:0 0 10px}.account-box .field{display:block;margin:12px 0}.account-box .fields{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}.account-box .fields .field:not(.half){grid-column:1/-1}.account-box .primary.big{width:100%;margin-top:14px}
.account-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:24px}.account-head .outline{padding:10px 18px;border:1px solid var(--line);background:#fff;cursor:pointer}
.account-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:40px;align-items:start}.account-grid h2{font-size:14px;letter-spacing:.08em;text-transform:uppercase;margin:0 0 14px}.account-grid aside{background:#fff;border:1px solid var(--line);padding:22px}.account-grid .fields{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}.account-grid .field{display:block;margin:8px 0}.account-grid .field:not(.half){grid-column:1/-1}.account-grid .field span{display:block;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:4px}.account-grid .field input{width:100%;padding:10px;border:1px solid var(--line);font:inherit}.account-grid .field input:disabled{background:#f6f1f3;color:var(--muted)}
.orders-table{width:100%;border-collapse:collapse;font-size:13px}.orders-table th{text-align:left;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);padding:8px 6px;border-bottom:1px solid var(--line)}.orders-table td{padding:12px 6px;border-bottom:1px solid var(--line);vertical-align:top}.orders-table a{color:var(--accent);font-weight:600}
.status-pill{display:inline-block;padding:3px 10px;border-radius:999px;font-size:11px;background:#f3e3ea;color:var(--ink)}.status-pill.s-paid,.status-pill.s-delivered{background:#e3f3e8}.status-pill.s-cancelled{background:#f8e0e0}.status-pill.s-shipped{background:#e6e3f3}
.empty.small{padding:30px;text-align:center;background:#fff;border:1px solid var(--line);border-radius:var(--radius)}
@media(max-width:800px){.account-grid{grid-template-columns:1fr}}

.payment-box{display:grid;gap:8px}.pay-opt{display:flex;gap:12px;align-items:flex-start;cursor:pointer;border-color:var(--line);background:#fff}.pay-opt.selected{border-color:var(--accent);background:var(--paper)}.pay-opt input{margin-top:3px;accent-color:var(--accent)}.pay-opt span{flex:1}#pixCanvas{display:inline-block;padding:10px;background:#fff;border:1px solid var(--line)}#pixCanvas img,#pixCanvas canvas{display:block}
