/* Cervegoza – Productos de Amazon. Usa las variables del plugin principal si están (--cvg-*). */
.cvga, .cvga-acompanar {
	--cvga-acento: var(--cvg-accent, #b86b12);
	--cvga-borde: var(--cvg-border, rgba(0, 0, 0, 0.12));
	--cvga-suave: var(--cvg-muted, rgba(0, 0, 0, 0.6));
	--cvga-radio: 10px;
	--cvga-fondo: rgba(184, 107, 18, 0.07);
	--cvga-btn: #ff9900;
	--cvga-btn-hover: #f08804;
	--cvga-btn-texto: #0f1111;
	--cvga-verde: #1e7d3c;
	--cvga-estrella: #e8a317;
}
@supports (color: color-mix(in srgb, red 10%, white)) {
	.cvga, .cvga-acompanar { --cvga-fondo: color-mix(in srgb, var(--cvga-acento) 8%, transparent); }
}
.cvga { margin: 1.75em 0; }
/* Reinicio frente a los estilos del tema (.entry-content p, ul li, ol li, th…): selectores con más peso. */
.cvga.cvga *, .cvga-acompanar.cvga-acompanar * { box-sizing: border-box; }
.cvga.cvga p, .cvga-acompanar.cvga-acompanar p { margin: 0 0 0.6em; line-height: 1.5; }
.cvga.cvga ul, .cvga.cvga ol, .cvga-acompanar.cvga-acompanar ul { margin: 0; padding: 0; list-style: none; }
.cvga.cvga li, .cvga-acompanar.cvga-acompanar li { list-style: none; margin-left: 0; }
.cvga.cvga li::marker { content: none; }
.cvga.cvga th, .cvga.cvga td { text-transform: none; letter-spacing: normal; font-family: inherit; }
.cvga.cvga img { margin: 0; max-width: 100%; }

/* Botón */
.cvga-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 0.45em;
	min-height: 44px; padding: 0.55em 1.15em;
	background: var(--cvga-btn); color: var(--cvga-btn-texto) !important;
	border-radius: 999px; font-weight: 700; font-size: 0.95em; line-height: 1.2;
	text-decoration: none !important; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
	transition: background-color 0.15s, transform 0.15s, box-shadow 0.15s;
}
.cvga-btn:hover { background: var(--cvga-btn-hover); box-shadow: 0 3px 8px rgba(0, 0, 0, 0.18); transform: translateY(-1px); }
.cvga-btn:focus-visible { outline: 3px solid var(--cvga-btn-texto); outline-offset: 2px; }
.cvga-btn__ico { flex: none; }
.cvga-btn__fuera { flex: none; opacity: 0.7; }
.cvga-btn--compacto { min-height: 38px; padding: 0.4em 0.9em; font-size: 0.875em; }
.cvga-solo { display: inline-flex; align-items: center; gap: 0.5em; flex-wrap: wrap; margin: 0.25em 0; }
.cvga-solo small, .cvga-aviso { color: var(--cvga-suave); }
@media (prefers-reduced-motion: reduce) { .cvga-btn { transition: none; } .cvga-btn:hover { transform: none; } }

/* Piezas comunes */
.cvga-media {
	display: flex; align-items: center; justify-content: center;
	aspect-ratio: 4 / 3; overflow: hidden; border-radius: calc(var(--cvga-radio) - 4px);
	background: #fff; margin: 0 0 0.75em;
}
.cvga-media__img { width: 100%; height: 100%; object-fit: contain; display: block; }
.cvga-media--icono { background: var(--cvga-fondo); color: var(--cvga-acento); }
.cvga-media--icono svg { width: 42%; height: auto; max-width: 96px; }
.cvga-nombre { font-weight: 700; font-size: 1.05em; line-height: 1.3; }
.cvga-nombre a { color: inherit; text-decoration: none; }
.cvga-nombre a:hover { text-decoration: underline; }
.cvga-resumen { color: var(--cvga-suave); font-size: 0.93em; }
.cvga-etiquetas { display: flex; flex-wrap: wrap; gap: 0.35em; margin: 0 0 0.5em !important; }
.cvga-etq {
	display: inline-block; padding: 0.15em 0.65em; border-radius: 999px;
	font-size: 0.75em; font-weight: 700; letter-spacing: 0.02em; text-transform: uppercase; line-height: 1.4;
	background: var(--cvga-acento); color: #fff;
}
.cvga-etq--usamos { background: var(--cvga-verde); }
.cvga-etq--usamos::before { content: "✓ "; }
.cvga-nota { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 0.35em; font-size: 0.9em; }
.cvga-nota__estrellas {
	font-size: 1.15em; letter-spacing: 0.06em; line-height: 1;
	background: linear-gradient(90deg, var(--cvga-estrella) var(--cvga-pct), rgba(128, 128, 128, 0.35) var(--cvga-pct));
	-webkit-background-clip: text; background-clip: text; color: transparent;
}
.cvga-nota__num { font-weight: 700; }
.cvga-nota__de { color: var(--cvga-suave); font-size: 0.85em; white-space: nowrap; }
.cvga-precio { font-size: 0.95em; }
.cvga-precio strong { font-size: 1.2em; }
.cvga-precio span { color: var(--cvga-verde); margin-left: 0.35em; }
.cvga-precio small { display: block; color: var(--cvga-suave); font-size: 0.75em; line-height: 1.35; margin-top: 0.2em; }
.cvga-aviso { font-size: 0.8em; margin: 0.75em 0 0 !important; }
.cvga-titulo { font-weight: 700; font-size: 1.15em; margin-bottom: 0.75em !important; }
.cvga-cinta {
	display: inline-block; margin: 0 0 0.6em !important; padding: 0.2em 0.75em;
	background: var(--cvga-acento); color: #fff; border-radius: 4px;
	font-size: 0.75em; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em;
}
.cvga-error { padding: 0.5em 0.75em; border-left: 4px solid #b32d2e; background: #fcf0f1; font-size: 0.9em; }

/* Pros y contras */
.cvga-pc { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 0.75em 1.25em; margin: 0.25em 0 1em; }
.cvga-pc__tit { font-weight: 700; font-size: 0.85em; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.3em !important; }
.cvga-pc__col--pros .cvga-pc__tit { color: var(--cvga-verde); }
.cvga-pc__col--contras .cvga-pc__tit { color: #b32d2e; }
.cvga-pc li, .cvga-comp-pros li, .cvga-comp-contras li { position: relative; padding-left: 1.3em; margin-bottom: 0.25em; font-size: 0.93em; line-height: 1.4; }
.cvga-pc__col--pros li::before, .cvga-comp-pros li::before { content: "+"; position: absolute; left: 0; font-weight: 700; color: var(--cvga-verde); }
.cvga-pc__col--contras li::before, .cvga-comp-contras li::before { content: "−"; position: absolute; left: 0; font-weight: 700; color: #b32d2e; }

/* Caja destacada */
.cvga-destacado { border: 1px solid var(--cvga-borde); border-radius: var(--cvga-radio); padding: 1.25em; }
.cvga-destacado__grid { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: 1.5em; align-items: start; }
.cvga-destacado .cvga-media { margin: 0; }
.cvga-destacado .cvga-nombre { font-size: 1.25em; }
@media (max-width: 640px) { .cvga-destacado__grid { grid-template-columns: 1fr; gap: 0.75em; } }

/* Tarjetas */
.cvga-tarjetas__grid { display: grid; grid-template-columns: repeat(var(--cvga-cols, 3), minmax(0, 1fr)); gap: 1em; }
@media (max-width: 900px) { .cvga-tarjetas__grid { grid-template-columns: repeat(min(var(--cvga-cols, 3), 2), minmax(0, 1fr)); } }
@media (max-width: 520px) { .cvga-tarjetas__grid { grid-template-columns: 1fr; } }
.cvga-tarjetas--una { max-width: 340px; }
.cvga-tarjeta { display: flex; flex-direction: column; border: 1px solid var(--cvga-borde); border-radius: var(--cvga-radio); padding: 0.9em; }
.cvga-tarjeta__cuerpo { display: flex; flex-direction: column; flex: 1; }
.cvga-tarjeta__pie { margin-top: auto; padding-top: 0.4em; }
.cvga-tarjeta .cvga-btn { width: 100%; padding-left: 0.8em; padding-right: 0.8em; }
.cvga--eleccion { border-color: var(--cvga-acento) !important; box-shadow: 0 0 0 1px var(--cvga-acento); }

/* Comparativa */
.cvga-comp-tabla { overflow-x: auto; border: 1px solid var(--cvga-borde); border-radius: var(--cvga-radio); }
.cvga-comp-tabla:focus-visible { outline: 2px solid var(--cvga-acento); }
.cvga-comp-tabla table { width: 100%; border-collapse: collapse; margin: 0; font-size: 0.93em; }
.cvga-comp-tabla th, .cvga-comp-tabla td { padding: 0.7em 0.8em; border: 0; border-bottom: 1px solid var(--cvga-borde); vertical-align: top; text-align: left; }
.cvga-comp-tabla thead th { vertical-align: top; min-width: 170px; font-weight: 400; }
.cvga-comp-tabla thead .cvga-media { max-width: 180px; }
.cvga-comp-tabla tbody th { font-weight: 700; white-space: nowrap; background: var(--cvga-fondo); }
.cvga-comp-tabla tr:last-child td, .cvga-comp-tabla tr:last-child th { border-bottom: 0; }
.cvga-comp-tabla .cvga--eleccion { box-shadow: none; background: var(--cvga-fondo); }
.cvga-comp-tabla .cvga-btn { white-space: nowrap; }
.cvga-comp-movil { display: none; gap: 1em; }
.cvga-carac { margin: 0 0 0.75em; font-size: 0.9em; }
.cvga-carac div { display: flex; justify-content: space-between; gap: 1em; padding: 0.3em 0; border-bottom: 1px dashed var(--cvga-borde); }
.cvga-carac dt { font-weight: 700; margin: 0; }
.cvga-carac dd { margin: 0; text-align: right; }
@media (max-width: 640px) { .cvga-comp-tabla { display: none; } .cvga-comp-movil { display: grid; } }

/* Ranking */
.cvga-ranking__lista { counter-reset: none; display: grid; gap: 0.9em; }
.cvga-ranking .cvga-ranking__lista > li.cvga-rank {
	display: grid; margin: 0; grid-template-columns: auto 120px minmax(0, 1fr) auto; gap: 1em; align-items: center;
	border: 1px solid var(--cvga-borde); border-radius: var(--cvga-radio); padding: 0.9em 1em;
}
.cvga-rank__num { font-size: 2em; font-weight: 800; line-height: 1; color: var(--cvga-acento); min-width: 1.2em; text-align: center; }
.cvga-rank .cvga-media { margin: 0; }
.cvga-rank__cuerpo > :last-child { margin-bottom: 0; }
.cvga-rank { position: relative; }
@media (max-width: 640px) {
	/* Móvil: el número pasa a ser una insignia sobre la foto, para dejar el ancho al texto. */
	.cvga-ranking .cvga-ranking__lista > li.cvga-rank { grid-template-columns: 64px minmax(0, 1fr); gap: 0.75em; align-items: start; padding: 0.8em; }
	.cvga-rank__num {
		position: absolute; top: 0.35em; left: 0.35em; z-index: 1; min-width: 0;
		width: 1.7em; height: 1.7em; display: flex; align-items: center; justify-content: center;
		font-size: 0.95em; background: var(--cvga-acento); color: #fff; border-radius: 999px;
	}
	.cvga-rank .cvga-media { aspect-ratio: 1; }
	.cvga-rank__boton { grid-column: 1 / -1; }
	.cvga-rank__boton .cvga-btn { width: 100%; }
}

/* Caja «Para acompañarla» de las fichas de cerveza */
.cvga-mini-lista { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 0.75em; margin: 0.5em 0; }
.cvga-mini { display: flex; gap: 0.75em; align-items: center; border: 1px solid var(--cvga-borde); border-radius: var(--cvga-radio); padding: 0.7em; }
.cvga-mini .cvga-media { flex: none; width: 64px; aspect-ratio: 1; margin: 0; }
.cvga-mini .cvga-media--icono svg { width: 60%; }
.cvga-mini__cuerpo { display: flex; flex-direction: column; align-items: flex-start; gap: 0.35em; min-width: 0; }
.cvga-mini .cvga-nombre { font-size: 0.95em; margin: 0; }
.cvga-mini .cvga-resumen { margin: 0; font-size: 0.85em; }

/* Más peso frente al tema en las etiquetas y botones dentro de rejillas estrechas. */
.cvga.cvga .cvga-etiquetas, .cvga-acompanar .cvga-etiquetas { display: flex; flex-flow: row wrap; align-items: flex-start; }
.cvga.cvga .cvga-etq { display: inline-block; width: auto; }
.cvga-btn span { white-space: nowrap; }
.cvga-tarjeta .cvga-btn__fuera, .cvga-mini .cvga-btn__fuera { display: none; }
