/**
 * Base dos blocos de avaliações Joli Môme: Resumo IA, Resumo de categoria,
 * Lista, Plataformas e Notas do produto (um CSS só, carregado uma vez)
 * Versão 1.6.0
 * Autor: Hugo da Pequenaweb
 * Cores: paleta do Kadence (palette1 destaque, palette3 texto, palette7 bordas, palette8 faixas, palette9 fundo)
 */

.pqna-av {
	--pqna-av-destaque: var( --global-palette1, #d97706 );
	--pqna-av-texto: var( --global-palette3, #595959 );
	--pqna-av-suave: var( --global-palette7, #e2e8f0 );
	--pqna-av-faixa: var( --global-palette8, #f7f7f7 );
	--pqna-av-fundo: var( --global-palette9, #fff );
	--pqna-av-mascara: url( "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 24'><path d='M12 1.5l3.1 6.6 7.2.9-5.3 5 1.4 7.1L12 17.6 5.6 21.1 7 14l-5.3-5 7.2-.9z'/><path transform='translate(24 0)' d='M12 1.5l3.1 6.6 7.2.9-5.3 5 1.4 7.1L12 17.6 5.6 21.1 7 14l-5.3-5 7.2-.9z'/><path transform='translate(48 0)' d='M12 1.5l3.1 6.6 7.2.9-5.3 5 1.4 7.1L12 17.6 5.6 21.1 7 14l-5.3-5 7.2-.9z'/><path transform='translate(72 0)' d='M12 1.5l3.1 6.6 7.2.9-5.3 5 1.4 7.1L12 17.6 5.6 21.1 7 14l-5.3-5 7.2-.9z'/><path transform='translate(96 0)' d='M12 1.5l3.1 6.6 7.2.9-5.3 5 1.4 7.1L12 17.6 5.6 21.1 7 14l-5.3-5 7.2-.9z'/></svg>" );
	box-sizing: border-box;
	color: var( --pqna-av-texto );
}
.pqna-av *, .pqna-av *::before, .pqna-av *::after { box-sizing: border-box; }

/* Cartão: mesmo desenho do bloco Resumo IA do produto */
.pqna-av-cartao { padding: 1.25rem 1.5rem; border: 1px solid var( --pqna-av-suave ); border-left: 3px solid var( --pqna-av-destaque ); border-radius: 8px; background: var( --pqna-av-fundo ); }

/* Estrelas: base clara e camada cheia recortada pela nota, as duas pela mesma máscara */
.pqna-av-estrelas { position: relative; display: inline-block; width: 100px; height: 20px; vertical-align: middle; }
.pqna-av-estrelas::before,
.pqna-av-estrelas::after { content: ""; position: absolute; top: 0; left: 0; height: 100%; -webkit-mask: var( --pqna-av-mascara ) left center / 100px 20px no-repeat; mask: var( --pqna-av-mascara ) left center / 100px 20px no-repeat; }
.pqna-av-estrelas::before { width: 100%; background: var( --pqna-av-suave ); }
.pqna-av-estrelas::after { width: var( --pqna-av-pct, 100% ); background: var( --pqna-av-destaque ); }

/* Barras por nota, com o número de avaliações */
.pqna-av-dist { margin: 0; padding: 0; list-style: none; }
.pqna-av-dist li { margin: 0 0 .15rem; padding: 0; font-size: .85em; line-height: 1.2; }
.pqna-av-dist__linha { display: grid; grid-template-columns: 1.2em 1fr 2.5em; align-items: center; gap: .5rem; padding: .15rem .35rem; margin: 0 -.35rem; border-radius: 4px; color: inherit; }
.pqna-av-dist a.pqna-av-dist__linha { text-decoration: none; cursor: pointer; }
.pqna-av-dist a.pqna-av-dist__linha:hover,
.pqna-av-dist a.pqna-av-dist__linha:focus-visible { background: var( --pqna-av-faixa ); color: inherit; }
.pqna-av-dist a.pqna-av-dist__linha:hover .pqna-av-dist__nota,
.pqna-av-dist a.pqna-av-dist__linha:hover .pqna-av-dist__n { text-decoration: underline; }
.pqna-av-dist__nota { text-align: center; }
.pqna-av-dist__n { text-align: right; opacity: .8; }
.pqna-av-dist__barra { display: block; height: 6px; border-radius: 3px; background: var( --pqna-av-suave ); overflow: hidden; }
.pqna-av-dist__barra span { display: block; height: 100%; border-radius: 3px; background: var( --pqna-av-destaque ); }

/* Texto para leitores de tela, caso o tema não tenha a classe */
.pqna-av .screen-reader-text { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect( 0, 0, 0, 0 ); white-space: nowrap; border: 0; }

/* Cartão de resumo (Resumo IA do produto e Resumo de categoria): uma coluna por padrão */
.pqna-av-resumo { display: grid; grid-template-columns: 1fr; gap: 1rem; margin: 0 0 1.5rem; }
.pqna-av-resumo__media { display: flex; align-items: center; gap: .75rem; margin: 0 0 .75rem; }
.pqna-av-resumo__nota { font-size: 2.6rem; font-weight: 600; line-height: 1; color: var( --pqna-av-texto ); }
.pqna-av-resumo__media-lado { display: flex; flex-direction: column; gap: .25rem; }
.pqna-av-resumo__qtd { font-size: .85em; opacity: .8; }

.pqna-av-resumo .pqna-av-resumo__titulo { margin: 0 0 .6rem; font-size: 1.75rem; line-height: 1.2; color: var( --pqna-av-texto ); }
.pqna-av-resumo__fato,
.pqna-av-resumo__texto,
.pqna-av-resumo__rotulo { max-width: 70ch; }
.pqna-av-resumo .pqna-av-resumo__fato { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem .6rem; margin: 0 0 .75rem; font-size: 85%; opacity: .85; }
.pqna-av-resumo__fato .pqna-av-estrelas { width: 80px; height: 16px; }
.pqna-av-resumo__fato .pqna-av-estrelas::before,
.pqna-av-resumo__fato .pqna-av-estrelas::after { -webkit-mask-size: 80px 16px; mask-size: 80px 16px; }
.pqna-av-resumo .pqna-av-resumo__texto { margin: 0; hyphens: manual; }
.pqna-av-resumo .pqna-av-resumo__rotulo { display: flex; align-items: center; gap: .4rem; margin: .75rem 0 0; font-size: 85%; opacity: .8; }
.pqna-av-resumo__ia { flex: 0 0 auto; width: 16px; height: 16px; fill: var( --pqna-av-destaque ); }
.pqna-av-resumo .pqna-av-resumo__links { display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; margin: 1rem 0 0; font-size: 85%; }

/* Links dos cartões: todos na cor do texto, sublinhados; no hover, a mesma regra do tema
   (a:hover, a:focus, a:active), repetida aqui porque a cor acima tem mais especificidade */
.pqna-av-resumo__links a,
.pqna-av-plat a { color: var( --pqna-av-texto ); text-decoration: underline; }
.pqna-av-resumo__links a:hover, .pqna-av-resumo__links a:focus, .pqna-av-resumo__links a:active,
.pqna-av-plat a:hover, .pqna-av-plat a:focus, .pqna-av-plat a:active { color: var( --global-palette-highlight-alt ); text-underline-offset: .25em; }
.pqna-av-resumo .pqna-av-plat-linha { margin-top: 1rem; }

/* Cartão largo: notas à esquerda, texto à direita */
@media screen and ( min-width: 900px ) {
	.pqna-av-resumo--notas { grid-template-columns: 260px minmax( 0, 1fr ); gap: 2.5rem; align-items: start; }
	.pqna-av-resumo--notas .pqna-av-resumo__notas { padding-right: 2.5rem; border-right: 1px solid var( --pqna-av-suave ); }
	.pqna-resumo-ia--so-notas.pqna-av-resumo--notas { grid-template-columns: 260px; }
	.pqna-resumo-ia--so-notas .pqna-av-resumo__notas { padding-right: 0; border-right: 0; }
}

/* Resumo IA na página de produto: só a margem; título no mesmo tamanho dos outros cartões */
.pqna-resumo-ia.pqna-av-resumo { margin: 0 0 2rem; }

/* Coluna à direita com as notas das plataformas externas (cartões do Resumo IA no produto) */
@media screen and ( min-width: 900px ) {
	.pqna-av-resumo--lateral { grid-template-columns: minmax( 0, 1fr ) 260px; gap: 2rem; align-items: start; }
	.pqna-av-resumo--lateral.pqna-av-resumo--notas { grid-template-columns: 260px minmax( 0, 1fr ) 260px; }
	.pqna-resumo-ia--so-notas.pqna-av-resumo--lateral.pqna-av-resumo--notas { grid-template-columns: 260px 260px; }
	.pqna-av-resumo__lateral { padding-left: 2rem; border-left: 1px solid var( --pqna-av-suave ); }
}
.pqna-av-plat-cartoes--coluna { max-width: none; margin: 0; }
.pqna-av-plat-cartoes--coluna .pqna-av-plat { padding: 1rem; box-shadow: none; }
.pqna-av-plat-cartoes--coluna .pqna-av-plat__grande { font-size: 2.4rem; }
.pqna-av-plat-cartoes--coluna .pqna-av-plat__data { margin-bottom: 12px; }


/* Notas externas em linha: nota, uma estrela e o total ("5,0 ★ · 37 avaliações da loja no Google") */
.pqna-av-plat-linha { display: flex; flex-wrap: wrap; gap: .35rem 1.25rem; margin: 0; padding: 0; list-style: none; font-size: .9rem; }
.pqna-av-plat-linha li { display: inline-flex; align-items: center; gap: .4rem; margin: 0; padding: 0; }
.pqna-av-plat-linha a.pqna-av-plat__texto { text-decoration: underline; }
.pqna-av-plat-linha .pqna-av-plat__logo { width: 16px; height: 16px; flex: 0 0 16px; }
.pqna-av-plat__nota { font-weight: 600; white-space: nowrap; }
.pqna-av-plat__estrela { color: var( --pqna-av-destaque ); }

/* Cartões das plataformas (topo da página de avaliações); com 2 ou mais, grade compacta */
.pqna-av-plat-cartoes { display: grid; grid-template-columns: 1fr; gap: 1rem; max-width: 380px; margin: 0 auto; }
.pqna-av-plat-cartoes--varias { grid-template-columns: repeat( auto-fit, minmax( 180px, 1fr ) ); max-width: 640px; }
.pqna-av-plat { padding: 1.75rem 1.5rem; border: 1px solid var( --pqna-av-suave ); border-top: 3px solid var( --pqna-av-destaque ); border-radius: 8px; background: var( --pqna-av-fundo ); box-shadow: 0 12px 32px rgba( 74, 74, 74, .08 ); text-align: center; }
.pqna-av-plat--google { border-top-color: #4285F4; }
.pqna-av-plat p { margin: 0; padding: 0; }
.pqna-av-plat .pqna-av-plat__topo { display: flex; align-items: center; justify-content: center; gap: 8px; font-size: .8rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; }
.pqna-av-plat__topo .pqna-av-plat__logo { width: 28px; height: 28px; flex: 0 0 28px; }
.pqna-av-plat .pqna-av-plat__grande { margin: 14px 0 4px; font-size: 3.2rem; font-weight: 600; line-height: 1; }
.pqna-av-plat__grande .pqna-av-plat__estrela { font-size: .55em; vertical-align: .35em; }
.pqna-av-plat .pqna-av-plat__qtd { font-size: .95rem; font-weight: 600; }
.pqna-av-plat .pqna-av-plat__data { margin: 4px 0 18px; font-size: 85%; opacity: .8; }
/* Links das plataformas: estilo de link do tema, um embaixo do outro */
.pqna-av-plat .pqna-av-plat__link { display: block; margin: 0 0 .5rem; font-size: 85%; }
.pqna-av-plat-cartoes--varias .pqna-av-plat { padding: 1.25rem 1rem; box-shadow: none; }
.pqna-av-plat-cartoes--varias .pqna-av-plat__grande { font-size: 2.4rem; }

/* Notas do produto, perto do título */
.pqna-av-notas-produto { margin: 0 0 1rem; }
.pqna-av-notas-produto .woocommerce-product-rating { margin-bottom: .35rem; }
.pqna-av-notas-produto .pqna-av-plat-linha,
.pqna-av-notas-produto .pqna-av-notas-produto__categoria { font-size: 85%; }

/* Desktop: nota do produto e notas externas na mesma linha; celular: uma embaixo da outra */
@media screen and ( min-width: 768px ) {
	.pqna-av-notas-produto { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem 1rem; }
	.pqna-av-notas-produto .woocommerce-product-rating { margin-bottom: 0; }
}

/* Celular: borda inteira laranja nos cartões de resumo (página de avaliações e produto) */
@media screen and ( max-width: 767px ) {
	.pqna-av-resumo.pqna-av-cartao { border: 1px solid var( --pqna-av-destaque ); }
}

/* Avaliações no modelo do WooCommerce (lista da página Avaliações e Prova social): mesmo layout */
:is( .pqna-av-lista, .pqna-av-prova ) .pqna-av-produto { margin: 0 0 .5rem; font-size: .9em; }
:where( .pqna-av-lista, .pqna-av-prova ) :where( ol.commentlist, ol.commentlist ul.children, .pqna-av-lista__simples ) { margin: 0; padding: 0; list-style: none; }
:where( .pqna-av-lista, .pqna-av-prova ) :where( ol.commentlist > li ) { margin: 0 0 1.5rem; }
:where( .pqna-av-lista, .pqna-av-prova ) :where( .pqna-av-lista__simples > li ) { margin: 0 0 1rem; padding: 1rem 1.25rem; border: 1px solid var( --pqna-av-suave ); border-radius: 8px; }
:is( .pqna-av-lista, .pqna-av-prova ) .woocommerce #reviews.woocommerce-Reviews { display: block; }
:is( .pqna-av-lista, .pqna-av-prova ) .woocommerce #reviews.woocommerce-Reviews #comments { width: auto; max-width: none; float: none; flex: none; }
:is( .pqna-av-lista, .pqna-av-prova ) ol.commentlist .children { list-style: none; margin: 1rem 0 0 3rem; padding: 0; }
:is( .pqna-av-lista, .pqna-av-prova ) ol.commentlist .children > li { list-style: none; margin: 0; }
@media screen and ( min-width: 1100px ) {
	/* Lista da página Avaliações: mural em 2 colunas, cada cartão com a altura do próprio texto, sem buraco nem espaço vazio */
	.pqna-av-lista ol.commentlist { display: block; column-count: 2; column-gap: 2rem; }
	.pqna-av-lista ol.commentlist > li { display: inline-block; width: 100%; break-inside: avoid; }
	/* Prova social (2 avaliações): uma em cada coluna, lado a lado */
	.pqna-av-prova ol.commentlist { display: grid; grid-template-columns: repeat( 2, minmax( 0, 1fr ) ); column-gap: 2rem; align-items: start; }
	:is( .pqna-av-lista, .pqna-av-prova ) .woocommerce #reviews #comments ol.commentlist::before,
	:is( .pqna-av-lista, .pqna-av-prova ) .woocommerce #reviews #comments ol.commentlist::after { content: none; display: none; }
}

/* Cartões de avaliação em todo o site (produtos, página Avaliações, Prova social): fundo branco, sem borda, cantos arredondados */
/* .comment-text repetido: o CSS do tema usa o mesmo seletor e carrega depois (o .woocommerce pode ser o body ou o invólucro da lista) */
.woocommerce #reviews #comments ol.commentlist li .comment-text.comment-text { border: 0; border-radius: 12px; background: var( --global-palette9, #fff ); }

/* Selo "Compra verificada" na linha do autor (pqna_av_linha_autor): ícone e texto, sem etiqueta */
.pqna-av-selo { display: inline-flex; gap: .15em; color: var( --global-palette1, #d97706 ); font-size: 85%; font-style: normal; font-weight: 400; letter-spacing: 0; text-transform: uppercase; vertical-align: middle; }
.pqna-av-selo svg { width: 1.4em; height: 1.4em; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

/* Nome de quem avaliou na cor do texto (o tema deixa mais claro) */
.woocommerce #reviews #comments ol.commentlist li .comment-text p.meta .woocommerce-review__author { color: var( --global-palette3, #4a4a4a ); }

/* Rodapé depois do comentário (pqna_av_rodape_avaliacao): produto e data, cinza, 85% */
.woocommerce #reviews #comments ol.commentlist li .comment-text .pqna-av-rodape { margin: 0 0 10px; font-size: 85%; color: var( --pqna-av-texto, #595959 ); }
.pqna-av-rodape a { color: var( --global-palette3, #4a4a4a ); text-decoration: underline; }
.pqna-av-rodape a:hover,
.pqna-av-rodape a:focus { color: var( --global-palette-highlight-alt ); text-underline-offset: .25em; }
.pqna-av-rodape time,
.pqna-av-rodape__sep { opacity: .7; }

/* Desktop: selo ao lado do nome */
@media screen and ( min-width: 768px ) {
	.woocommerce #reviews #comments ol.commentlist li .comment-text p.meta .pqna-av-selo { margin-left: 5px; }
}

/* Celular: selo embaixo do nome */
@media screen and ( max-width: 767px ) {
	.woocommerce #reviews #comments ol.commentlist li .comment-text p.meta .pqna-av-selo { display: flex; margin-top: .25rem; }
}


/* Prova social (Home, Sobre, Cupom): faixa com as notas, avaliações e botão */
.pqna-av-prova { margin: 0 auto 1.5rem; }
.pqna-av-prova .pqna-av-prova__notas { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 1.5rem 2.5rem; margin: 0 0 2rem; }
.pqna-av-prova__nota .pqna-av-resumo__media { margin: 0; }
.pqna-av-prova__marca { display: inline-flex; align-items: center; gap: .4rem; font-size: 1.25rem; line-height: 1; }
.pqna-av-prova__marca .pqna-av-plat__logo { width: 20px; height: 20px; flex: 0 0 20px; }
.pqna-av-prova__nota .pqna-av-resumo__qtd a { color: var( --pqna-av-texto ); text-decoration: underline; }
.pqna-av-prova__nota .pqna-av-resumo__qtd a:hover,
.pqna-av-prova__nota .pqna-av-resumo__qtd a:focus { color: var( --global-palette-highlight-alt ); text-underline-offset: .25em; }
@media screen and ( min-width: 768px ) {
	.pqna-av-prova__nota + .pqna-av-prova__nota { padding-left: 2.5rem; border-left: 1px solid var( --pqna-av-suave ); }
}
.pqna-av-prova .pqna-av-prova__botao { display: flex; justify-content: center; margin: .5rem 0 0; }