/* =============================================================================
   ZARINNA — páginas internas
   -----------------------------------------------------------------------------
   Produto, checkout e confirmação de pedido. Mesma linguagem: cantos vivos,
   filetes, espaço negativo, nada de sombra.
   ========================================================================== */

/* ── Produto ──────────────────────────────────────────────────────────────── */
.z-produto {
  display: grid;
  gap: var(--z-sp-7);
  grid-template-columns: 1fr;
  align-items: start;
}
@media (min-width: 900px) {
  .z-produto { grid-template-columns: 7fr 5fr; gap: var(--z-sp-9); }
}

.z-produto__galeria { display: grid; gap: var(--z-sp-3); }

.z-produto__principal {
  position: relative;
  overflow: hidden;
  background-color: var(--z-bg-sunken);
  aspect-ratio: 4 / 5;
}
.z-produto__principal img { width: 100%; height: 100%; object-fit: cover; }

/* Peça ainda sem foto: a ficha assume a ausência em vez de reusar outra peça */
.z-produto__principal--vazia {
  display: grid;
  place-content: center;
  justify-items: center;
  gap: var(--z-sp-3);
  text-align: center;
  padding: var(--z-sp-8);
  border: var(--z-hairline);
  background-color: var(--z-bg);
}
.z-produto__principal--vazia svg {
  width: 2.5rem;
  height: 2.5rem;
  color: var(--z-orange);
}
.z-produto__principal--vazia .z-meta { max-width: 24rem; }

.z-produto__miniaturas {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(0, 1fr);
  gap: var(--z-sp-3);
  overflow-x: auto;
  scrollbar-width: thin;
  padding-bottom: var(--z-sp-2);
}
.z-produto__miniatura {
  position: relative;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  background-color: var(--z-bg-sunken);
  border: 1px solid transparent;
  transition: border-color var(--z-dur) var(--z-ease), opacity var(--z-dur) var(--z-ease);
  opacity: 0.7;
}
.z-produto__miniatura img { width: 100%; height: 100%; object-fit: cover; }
.z-produto__miniatura:hover,
.z-produto__miniatura:focus-visible { opacity: 1; }
.z-produto__miniatura[aria-current="true"] {
  border-color: var(--z-orange);
  opacity: 1;
}

.z-produto__info {
  display: grid;
  gap: var(--z-sp-4);
  align-content: start;
}
@media (min-width: 900px) {
  .z-produto__info { position: sticky; top: 7rem; }
}
.z-produto__titulo {
  font-family: var(--z-font-display);
  font-size: var(--z-fs-h1);
  line-height: 1;
  letter-spacing: var(--z-ls-mega);
  color: var(--z-text-display);
}
.z-produto__preco {
  font-size: var(--z-fs-body-lg);
  color: var(--z-text);
  font-variant-numeric: tabular-nums;
}
.z-produto__descricao { color: var(--z-text); max-width: 46ch; }
.z-produto__campo { display: grid; gap: var(--z-sp-3); }

.z-produto__ficha {
  display: grid;
  gap: var(--z-sp-3);
  margin-top: var(--z-sp-5);
  padding-top: var(--z-sp-5);
  border-top: var(--z-hairline);
}
.z-produto__ficha > div {
  display: grid;
  grid-template-columns: 8rem 1fr;
  gap: var(--z-sp-4);
  font-size: var(--z-fs-small);
}
.z-produto__ficha dt {
  font-size: var(--z-fs-label);
  text-transform: uppercase;
  letter-spacing: var(--z-ls-label);
  color: var(--z-text-muted);
}
.z-produto__ficha dd { color: var(--z-text); }

/* ── Checkout ─────────────────────────────────────────────────────────────── */
.z-checkout {
  display: grid;
  gap: var(--z-sp-7);
  grid-template-columns: 1fr;
  align-items: start;
}
@media (min-width: 900px) {
  .z-checkout { grid-template-columns: 7fr 5fr; gap: var(--z-sp-9); }
}

.z-checkout__form { display: grid; gap: var(--z-sp-4); align-content: start; }

.z-checkout__resumo {
  display: grid;
  gap: var(--z-sp-3);
  align-content: start;
  padding: var(--z-sp-6);
  background-color: var(--z-bg-sunken);
  border: var(--z-hairline);
}
@media (min-width: 900px) {
  .z-checkout__resumo { position: sticky; top: 7rem; }
}
.z-checkout__itens { display: grid; gap: var(--z-sp-3); }
.z-checkout__item {
  display: grid;
  grid-template-columns: 48px 1fr auto;
  gap: var(--z-sp-3);
  align-items: center;
  padding-bottom: var(--z-sp-3);
  border-bottom: var(--z-hairline);
  font-size: var(--z-fs-small);
}
.z-checkout__item img { width: 48px; aspect-ratio: 3 / 4; object-fit: cover; background-color: var(--z-bg); }
.z-checkout__item span:last-child { font-variant-numeric: tabular-nums; white-space: nowrap; }

/* ── Tabela do pedido ─────────────────────────────────────────────────────── */
.z-pedido { margin-top: var(--z-sp-6); font-size: var(--z-fs-small); }
.z-pedido th {
  text-align: left;
  font-size: var(--z-fs-label);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: var(--z-ls-label);
  color: var(--z-text-muted);
  padding-bottom: var(--z-sp-3);
  border-bottom: var(--z-hairline-strong);
}
.z-pedido td {
  padding-block: var(--z-sp-3);
  border-bottom: var(--z-hairline);
  vertical-align: top;
}
.z-pedido td:last-child,
.z-pedido th:last-child { text-align: right; font-variant-numeric: tabular-nums; }