/* ═══════════════════════════════════════════════════════════
   EuroMóveis — Ficha de produto (ronda 9, SPEC-20261004-ronda9-ficha-produto.md)
   Entra pelo evento euromoveis_ficha_depois (extension/euromoveis/catalog/controller/ficha.php). Não mexe no tema.
   ═══════════════════════════════════════════════════════════ */

/* B3 — «Ref.: …» por baixo do título, discreto */
.em-ref-titulo { margin: 0 auto 4px; padding: 0 16px; font-size: 13px; color: #7a7a7a; letter-spacing: .02em; text-align: center; }
/* o bloco das migalhas de pão do tema põe os filhos em linha: a Ref. ocupa a 1.ª linha inteira, por cima das migalhas */
.breadcrumbs:has(> .em-ref-titulo) { flex-wrap: wrap; justify-content: center; }
.breadcrumbs > .em-ref-titulo { flex: 0 0 100%; width: 100%; order: -1; }

/* B2 — nota por cima das amostras de cor */
.em-cor-nota { margin: 0 0 10px; font-size: 13px; color: #555; line-height: 1.45; }

/* B4 + C1 — medidas e bloco de confiança, por cima do botão «Pedir Orçamento». Discreto: texto pequeno, sem caixa colorida. */
.em-ficha-info { margin: 14px 0 12px; }
.em-ficha-medidas { margin: 0 0 8px; font-size: 15px; font-weight: 600; color: #333; }
.em-ficha-confianca { list-style: none; margin: 0; padding: 0; }
.em-ficha-confianca li { margin: 0 0 4px; font-size: 13px; line-height: 1.45; color: #555; }

/* B5 — telemóvel: amostras para além da 6.ª escondidas até carregar em «Ver as N cores» (o JS marca-as) */
.em-amostra-escondida { display: none !important; }
.em-ver-cores {
  display: block; width: 100%; margin: 8px 0 2px; padding: 10px 12px; min-height: 44px;
  font-size: 14px; color: #1b5e57; background: #fff; border: 1px solid #c9d9d6; border-radius: 8px; cursor: pointer;
}
.em-ver-cores:hover, .em-ver-cores:focus { border-color: #1b5e57; }

/* B6 — telemóvel, só onde a barra fixa «Pedir Orçamento» existe: o WhatsApp e a seta sobem acima dela, com margem.
   --em-barra é a distância medida do topo da barra ao fundo do ecrã (em-ficha.js). */
@media (max-width: 767px) {
  html.em-com-barra .em-wa-float { bottom: calc(var(--em-barra, 64px) + 14px) !important; }
  html.em-com-barra .scroll-top { bottom: calc(var(--em-barra, 64px) + 14px + var(--emwa-size, 58px) + 10px) !important; }
}

/* B10 — computador: a descrição ocupa a largura útil, com a linha a ~900 px no máximo */
@media (min-width: 992px) {
  #product-product .product-extra-description .block-wrapper,
  #product-product .product-extra-description .block-content { max-width: 900px; }
}

/* B10 — computador: sai a caixa branca com contorno e margens à volta do botão «Pedir Orçamento» (ficava vazia por cima e
   por baixo do botão). No telemóvel a mesma peça é a barra fixa do fundo e não se mexe. */
@media (min-width: 768px) {
  #product-product .product-details .button-group-page { border: 0 !important; padding: 0 !important; background: transparent !important; box-shadow: none !important; margin-top: 4px; }
  #product-product .product-details .em-ficha-info { margin-bottom: 14px; }
}

/* B3 — no telemóvel o tema alinha o título e as migalhas à esquerda: a Ref. acompanha */
@media (max-width: 767px) {
  .breadcrumbs > .em-ref-titulo { text-align: left; padding: 0 24px; margin: 0 0 6px; }   /* o mesmo recuo da lista das migalhas (24px) */
}

/* Ronda 12 — tabela das Especificações: a coluna dos nomes não pode partir palavras a meio («Acabame/nto»). */
#product-product .tab-content table td:first-child { width: 30%; min-width: 7.5em; word-break: keep-all; overflow-wrap: normal; hyphens: none; }