.checkout-col{display:flex;flex-direction:column;gap:20px;}

.checkout-card.is-locked{opacity:.5;pointer-events:none;}

.account-tabs{display:flex;gap:8px;margin-bottom:18px;}
.account-tab{
  flex:1;
  padding:10px 14px;
  border-radius:999px;
  border:1.5px solid var(--border);
  background:var(--white);
  font-weight:600;
  font-size:.85rem;
  color:var(--ink-soft);
  transition:all .15s ease;
}
.account-tab.is-active{background:var(--blue-600);border-color:var(--blue-600);color:var(--white);}

.field-hint{font-size:.76rem;color:var(--ink-soft);margin-top:2px;}

.account-active{
  display:flex;align-items:center;justify-content:space-between;
  gap:12px;
  background:var(--blue-50);
  border:1px solid var(--blue-100);
  border-radius:var(--radius-sm);
  padding:14px 16px;
  font-size:.88rem;
}
.account-active strong{color:var(--blue-800);}
.account-logout{color:var(--offer);font-weight:600;font-size:.82rem;}

.checkout-banner--error{background:#fdeceb;color:#c0392b;}

.checkout-banner--success{display:flex;flex-direction:column;align-items:flex-start;gap:14px;}
.success-banner__btn{align-self:stretch;justify-content:center;}

.pix-box{
  margin-top:18px;
  padding:20px;
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  background:var(--blue-50);
  text-align:center;
}
.pix-box__qr{width:200px;height:200px;margin:0 auto 14px;border-radius:var(--radius-sm);background:var(--white);}
.pix-box__label{font-size:.85rem;color:var(--ink-soft);margin-bottom:10px;}
.pix-box__code{display:flex;gap:8px;margin-bottom:14px;}
.pix-box__code input{
  flex:1;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  padding:10px 12px;
  font-size:.8rem;
  color:var(--ink-soft);
  background:var(--white);
}
.pix-box__status{
  display:flex;align-items:center;justify-content:center;gap:8px;
  font-size:.85rem;font-weight:600;color:var(--blue-700);
}
.pix-spinner{
  width:14px;height:14px;border-radius:50%;
  border:2px solid var(--blue-100);
  border-top-color:var(--blue-600);
  animation:pix-spin .7s linear infinite;
}
@keyframes pix-spin{to{transform:rotate(360deg);}}

@media (max-width:1024px){
  .checkout-side{order:-1;}
}

/* ============ Minha conta ============ */
.account-page{
  max-width:640px;
  margin:0 auto;
  display:flex;
  flex-direction:column;
  gap:20px;
}
.account-page__back{align-self:flex-start;}

.account-orders{display:flex;flex-direction:column;gap:14px;}
.account-empty{color:var(--ink-soft);font-size:.9rem;text-align:center;padding:20px 0;}

.account-order{
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  overflow:hidden;
}
.account-order.is-open{border-color:var(--blue-100);}

.account-order__summary{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px;
  width:100%;
  padding:16px;
  text-align:left;
  transition:background .15s ease;
}
.account-order__summary:hover{background:var(--blue-50);}
.account-order__summary-main{display:flex;flex-direction:column;gap:2px;flex:1;min-width:140px;}
.account-order__ref{font-family:var(--font-head);color:var(--blue-900);font-weight:700;}
.account-order__date{color:var(--ink-soft);font-size:.8rem;}

.order-status{
  padding:4px 12px;
  border-radius:999px;
  font-size:.76rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.02em;
}
.order-status--aguardando_pagamento{background:rgba(47,123,246,.12);color:var(--blue-700);}
.order-status--pago{background:rgba(26,169,113,.12);color:var(--success);}
.order-status--expirado{background:rgba(148,163,184,.15);color:var(--ink-soft);}
.order-status--cancelado{background:rgba(224,86,47,.12);color:var(--offer);}
.order-status--enviado{background:rgba(124,58,237,.12);color:#6d28d9;}

.account-order__total{
  font-family:var(--font-head);
  font-size:1.05rem;
  color:var(--blue-800);
  font-weight:700;
  white-space:nowrap;
}
.account-order__chevron{width:18px;height:18px;color:var(--ink-soft);flex-shrink:0;transition:transform .2s ease;}
.account-order__summary[aria-expanded="true"] .account-order__chevron{transform:rotate(180deg);}

.account-order__details{
  padding:0 16px 16px;
  display:flex;
  flex-direction:column;
  gap:16px;
  border-top:1px solid var(--border);
  padding-top:16px;
}

.account-order__products{display:flex;flex-direction:column;gap:12px;}
.account-order__product{display:flex;align-items:center;gap:12px;}
.account-order__product-media{
  width:52px;height:52px;
  border-radius:var(--radius-sm);
  background:var(--blue-50);
  display:flex;align-items:center;justify-content:center;
  font-size:1.3rem;
  overflow:hidden;
  flex-shrink:0;
}
.account-order__product-media img{width:100%;height:100%;object-fit:cover;}
.account-order__product-info{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0;}
.account-order__product-name{font-weight:600;color:var(--ink);font-size:.9rem;}
.account-order__product-qty{font-size:.8rem;color:var(--ink-soft);}
.account-order__product-subtotal{font-weight:700;color:var(--ink);font-size:.9rem;white-space:nowrap;}

.account-order__totals{border-top:1px solid var(--border);padding-top:12px;display:flex;flex-direction:column;gap:6px;}
.account-order__line{display:flex;justify-content:space-between;font-size:.85rem;color:var(--ink-soft);}
.account-order__line--total{font-weight:700;color:var(--blue-800);font-size:1rem;font-family:var(--font-head);}

.account-order__address{
  background:var(--blue-50);
  border-radius:var(--radius-sm);
  padding:12px 14px;
  font-size:.85rem;
  color:var(--ink-soft);
}
.account-order__address strong{display:block;color:var(--blue-800);margin-bottom:4px;font-size:.82rem;}
.account-order__address p{margin:0;}

.account-order__continue{align-self:flex-start;}
.card-installments{margin:4px 0 14px;}
.card-installments .checkout-note{margin-top:6px;}
.checkout-summary-note{margin-top:12px;padding:10px 12px;border-radius:10px;background:var(--blue-50,#f1f6ff);font-size:.82rem;line-height:1.4;color:var(--ink-soft);}

/* Shipping / tracking in the customer's order (Minha conta) */
.account-order__shipping{border:1px solid #d9ccf7;background:#f7f3ff;border-radius:var(--radius-sm);padding:12px 14px;font-size:.85rem;color:var(--ink-soft);display:flex;flex-direction:column;gap:8px;}
.account-order__shipping strong{color:#5b21b6;font-size:.82rem;}
.account-order__shipping p{margin:0;}
.account-order__shipping--waiting{border-color:rgba(26,169,113,.3);background:rgba(26,169,113,.07);color:var(--ink);line-height:1.45;}
.account-order__tracking{display:flex;flex-direction:column;gap:2px;}
.account-order__tracking-label{font-size:.75rem;}
.account-order__tracking-code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:1.05rem;font-weight:700;color:var(--ink);letter-spacing:.04em;word-break:break-all;}
.account-order__tracking-actions{display:flex;flex-wrap:wrap;gap:8px;}
.account-order__tracking-actions .btn{padding:10px 16px;font-size:.85rem;}

.checkout-privacidade{margin-top:8px;font-size:.78rem;}
.checkout-privacidade a{text-decoration:underline;}

/* Payment confirmed popup (tracking shows up in Minha conta → Meus pedidos) */
body.pago-popup-aberto{overflow:hidden;}
.pago-popup{position:fixed;inset:0;z-index:2000;background:rgba(8,16,40,.6);backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;padding:16px;}
.pago-popup__caixa{background:#fff;border-radius:20px;max-width:420px;width:100%;padding:26px 22px 18px;text-align:center;box-shadow:0 24px 60px rgba(0,0,0,.3);}
.pago-popup__icone{font-size:2.4rem;margin-bottom:4px;}
.pago-popup h2{font-size:1.35rem;margin-bottom:8px;}
.pago-popup__texto{font-size:.92rem;color:var(--ink);line-height:1.5;margin-bottom:14px;}
.pago-popup__rastreio{display:flex;gap:10px;align-items:flex-start;text-align:left;background:#eef3ff;border:1px solid #c9d8f5;border-radius:12px;padding:12px;margin-bottom:16px;}
.pago-popup__rastreio span{font-size:1.4rem;line-height:1;}
.pago-popup__rastreio p{font-size:.88rem;line-height:1.5;color:#1b3a8a;font-weight:600;margin:0;}
.pago-popup__ir{display:flex;width:100%;}
.pago-popup__fechar{margin-top:8px;background:none;border:0;font:inherit;font-size:.86rem;color:var(--ink-soft);cursor:pointer;padding:8px;}

/* Card payment not completed: retry / Pix */
.card-retry{margin-top:12px;display:flex;flex-direction:column;gap:8px;text-align:left;}
.card-retry[hidden]{display:none;}
.card-retry p{font-size:.88rem;line-height:1.5;color:var(--ink);margin:0 0 4px;}
.card-retry .btn{width:100%;}

/* ===== Minha conta → Meus pedidos: banner, stages, timeline, tracking strip ===== */
.order-status--separacao{background:rgba(245,158,11,.15);color:#a16207;}
.order-status--entregue{background:rgba(26,169,113,.16);color:#13804f;}
.account-orders__banner{display:flex;gap:12px;align-items:flex-start;background:linear-gradient(135deg,#eef3ff,#f4f9ff);border:1px solid #c9d8f5;border-radius:14px;padding:14px 16px;}
.account-orders__banner > span{font-size:1.5rem;line-height:1;}
.account-orders__banner p{margin:0;font-size:.88rem;line-height:1.55;color:#1b3a8a;}
.account-orders__banner b{color:#16213e;}
.account-order__track-strip{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 12px;padding:9px 16px;border-top:1px dashed var(--border);background:#f7f3ff;font-size:.82rem;color:#5b21b6;}
.account-order__track-strip code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-weight:700;color:var(--ink);letter-spacing:.03em;}
.account-order__track-strip a{font-weight:700;color:#5b21b6;text-decoration:none;white-space:nowrap;}
.order-steps{list-style:none;margin:0;padding:4px 0 2px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));position:relative;}
.order-steps__item{display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;position:relative;min-width:0;}
.order-steps__item::before{content:'';position:absolute;top:12px;left:-50%;width:100%;height:3px;background:var(--border);z-index:0;}
.order-steps__item:first-child::before{display:none;}
.order-steps__item.is-done::before{background:#1aa971;}
.order-steps__dot{width:26px;height:26px;border-radius:50%;border:2px solid var(--border);background:#fff;display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:800;color:#fff;position:relative;z-index:1;}
.order-steps__item.is-done .order-steps__dot{background:#1aa971;border-color:#1aa971;}
.order-steps__item.is-current .order-steps__dot{box-shadow:0 0 0 4px rgba(26,169,113,.18);}
.order-steps__label{font-size:.74rem;font-weight:700;color:var(--ink-soft);line-height:1.25;}
.order-steps__item.is-done .order-steps__label{color:var(--ink);}
.order-steps__date{font-size:.68rem;color:var(--ink-soft);min-height:1em;}
.account-orders__old{margin-top:4px;}
.account-orders__old summary{cursor:pointer;font-size:.85rem;font-weight:600;color:var(--ink-soft);padding:6px 2px;}
.account-orders__old-list{display:flex;flex-direction:column;gap:12px;margin-top:8px;opacity:.85;}
@media (max-width:560px){
  .account-orders__banner{padding:12px;}
  .account-orders__banner p{font-size:.82rem;}
  /* Vertical timeline on phones */
  .order-steps{grid-template-columns:1fr;gap:0;padding-left:2px;}
  .order-steps__item{flex-direction:row;align-items:center;text-align:left;gap:10px;padding:5px 0;}
  .order-steps__item::before{top:-50%;left:12px;width:3px;height:100%;}
  .order-steps__label{font-size:.82rem;flex:1;}
  .order-steps__date{font-size:.74rem;}
  .account-order__track-strip{padding:9px 12px;}
}
@media (max-width:560px){
  /* Order header in two rows: reference/date + total + chevron, then the stage badge. */
  .account-order__summary{display:grid;grid-template-columns:minmax(0,1fr) auto auto;grid-template-areas:"main total chev" "badge badge badge";gap:6px 10px;align-items:center;}
  .account-order__summary-main{grid-area:main;min-width:0;}
  .account-order__summary > .order-status{grid-area:badge;justify-self:start;}
  .account-order__total{grid-area:total;font-size:1rem;}
  .account-order__chevron{grid-area:chev;}
}

/* ===== Minha conta on computers: account card on the left, orders on the right ===== */
@media (min-width:980px){
  .account-page:has(#ordersCard:not([hidden])){max-width:1160px;display:grid;grid-template-columns:300px minmax(0,1fr);align-items:start;gap:16px 24px;}
  .account-page:has(#ordersCard:not([hidden])) > .account-page__back{grid-column:1 / -1;}
  .account-page:has(#ordersCard:not([hidden])) > #accountCard{position:sticky;top:96px;padding:20px;}
  .account-page:has(#ordersCard:not([hidden])) .account-active{flex-direction:column;align-items:flex-start;gap:10px;}
  .account-page:has(#ordersCard:not([hidden])) .account-active p{display:flex;flex-direction:column;gap:2px;margin:0;word-break:break-word;}
  .account-page:has(#ordersCard:not([hidden])) .account-active #accountActiveEmail{font-size:.82rem;color:var(--ink-soft);}
  #ordersCard{padding:22px 24px;}
  #ordersCard .checkout-card__title{margin-bottom:12px;}
  .account-orders__banner{padding:10px 14px;}
  .account-orders__banner p{font-size:.84rem;}
  .account-order__summary{padding:12px 18px;}
  /* Open order: timeline on top, then shipping (left) and items/totals/address (right) */
  .account-order__details:not([hidden]){display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"steps steps" "ship prod" "ship tot" "ship addr" "pix pix";gap:14px 22px;align-items:start;padding:16px 18px 18px;}
  .account-order__details > *{min-width:0;}
  .account-order__details > .order-steps{grid-area:steps;}
  .account-order__details > .account-order__shipping{grid-area:ship;}
  .account-order__details > .account-order__products{grid-area:prod;}
  .account-order__details > .account-order__totals{grid-area:tot;}
  .account-order__details > .account-order__address{grid-area:addr;}
  .account-order__details > .account-order__continue,
  .account-order__details > .pix-box{grid-column:1 / -1;}
  /* Unpaid orders have no shipping block: address goes under the items */
  .account-order__details:not(:has(.account-order__shipping)){grid-template-areas:"steps steps" "prod tot" "addr tot" "pix pix";}
}
@media (min-width:980px){
  /* Less empty space above the account page */
  .checkout:has(.account-page){padding-top:14px;}
  .account-page:has(#ordersCard:not([hidden])){row-gap:10px;}
  .account-page__back{font-size:.85rem;}
  .account-page:has(#ordersCard:not([hidden])) > #accountCard{top:84px;}
}