/* Gerhardt Comparador de productos */
:root { --gh-c-pri: #1274e7; --gh-c-ink: #111827; --gh-c-mut: #6b7280; --gh-c-line: #e5e7eb; --gh-c-soft: #f3f6fb; }

/* Botón Comparar */
.gh-comp-btn {
	display: inline-flex; align-items: center; gap: 6px; margin: 8px auto 0; padding: 6px 12px;
	font: inherit; font-size: 13px; font-weight: 600; line-height: 1.2; color: var(--gh-c-mut);
	background: transparent; border: 1px solid var(--gh-c-line); border-radius: 999px; cursor: pointer;
	transition: color .2s, border-color .2s, background .2s; position: relative; z-index: 5;
}
.gh-comp-btn:hover { color: var(--gh-c-pri); border-color: var(--gh-c-pri); }
.gh-comp-btn.is-on { color: #fff; background: var(--gh-c-pri); border-color: var(--gh-c-pri); }
.gh-comp-btn--single { margin: 4px 0 18px; font-size: 14px; padding: 8px 16px; }
/* Dentro del formulario de compra: columna izquierda, debajo de la cantidad y al lado de WhatsApp */
form.cart .gh-comp-btn--single {
	flex: 0 0 100px; width: 100px; min-height: 52px; margin: 4px 0 0; padding: 8px 6px;
	flex-direction: column; justify-content: center; gap: 5px; border-radius: 10px;
	background: #fff; box-shadow: 0 1px 3px rgba(17,24,39,.08); font-size: 12px; text-align: center;
}
form.cart .gh-comp-btn--single.is-on { background: var(--gh-c-pri); }
body.single-product form.cart .single_add_to_cart_button { flex: 1 1 calc(100% - 108px) !important; }
body.single-product form.cart .gh-comp-btn--single + .nta-woo-products-button { margin-left: 0 !important; flex: 1 1 0 !important; }.gh-comp-ico { width: 14px; height: 14px; border: 2px solid currentColor; border-radius: 3px; position: relative; flex: none; }
.gh-comp-btn.is-on .gh-comp-ico::after {
	content: ""; position: absolute; left: 3px; top: 0; width: 4px; height: 7px;
	border: solid currentColor; border-width: 0 2px 2px 0; transform: rotate(45deg);
}
li.product .gh-comp-btn--loop { display: inline-flex; width: max-content; margin: 10px 0 0; }

/* Barra inferior */
.gh-comp-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 9990; background: #fff; box-shadow: 0 -8px 30px rgba(17,24,39,.12); border-top: 1px solid var(--gh-c-line); }
.gh-comp-bar[hidden] { display: none; }
.gh-comp-bar__in { max-width: 1140px; margin: 0 auto; padding: 10px 16px; display: flex; align-items: center; gap: 16px; }
.gh-comp-bar__items { display: flex; gap: 10px; flex: 1; min-width: 0; overflow-x: auto; }
.gh-comp-bar__item {
	position: relative; display: flex; align-items: center; gap: 8px; flex: 0 0 200px; height: 52px; padding: 6px 28px 6px 6px;
	border: 1px solid var(--gh-c-line); border-radius: 10px; font-size: 13px; line-height: 1.25; color: var(--gh-c-ink); background: #fff;
}
.gh-comp-bar__item img { width: 40px; height: 40px; object-fit: cover; border-radius: 6px; flex: none; }
.gh-comp-bar__item span { overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.gh-comp-bar__item.is-empty { justify-content: center; padding: 6px; color: #c0c6d0; border-style: dashed; font-size: 22px; }
.gh-comp-bar__x { position: absolute; top: 4px; right: 4px; width: 20px; height: 20px; padding: 0; border: 0; border-radius: 50%; background: var(--gh-c-soft); color: var(--gh-c-mut); font-size: 15px; line-height: 20px; cursor: pointer; }
.gh-comp-bar__x:hover { background: #fee2e2; color: #b91c1c; }
.gh-comp-bar__actions { display: flex; align-items: center; gap: 10px; flex: none; }
.gh-comp-bar__clear { border: 0; background: none; color: var(--gh-c-mut); font: inherit; font-size: 13px; cursor: pointer; text-decoration: underline; }
.gh-comp-bar__go { display: inline-block; padding: 12px 22px; border-radius: 10px; background: var(--gh-c-pri); color: #fff !important; font-weight: 700; font-size: 14px; text-decoration: none !important; white-space: nowrap; }
.gh-comp-bar__go.is-disabled { opacity: .5; }
body.gh-comp-bar-on { padding-bottom: 76px; }
body.gh-comp-bar-on .wa__btn_popup, body.gh-comp-bar-on .wa__popup_chat_box { bottom: 90px !important; }
@media (max-width: 767px) {
	.gh-comp-bar__item { flex-basis: 52px; padding: 6px; }
	.gh-comp-bar__item span { display: none; }
	.gh-comp-bar__x { top: -6px; right: -6px; box-shadow: 0 1px 3px rgba(0,0,0,.2); }
	.gh-comp-bar__in { gap: 10px; padding: 10px 12px; }
	.gh-comp-bar__go { padding: 11px 14px; }
}

/* Aviso */
.gh-comp-toast { position: fixed; left: 50%; bottom: 100px; transform: translate(-50%, 20px); opacity: 0; z-index: 9999; background: var(--gh-c-ink); color: #fff; padding: 10px 16px; border-radius: 10px; font-size: 14px; transition: .25s; max-width: calc(100% - 32px); text-align: center; }
.gh-comp-toast.is-on { opacity: 1; transform: translate(-50%, 0); }

/* Página de comparación */
.gh-comp { color: var(--gh-c-ink); }
.gh-comp__head { text-align: center; margin-bottom: 24px; }
.gh-comp__title { margin: 0 0 8px; }
.gh-comp__lead { color: var(--gh-c-mut); margin: 0; }
.gh-comp__picker { max-width: 620px; margin: 0 auto 24px; }
.gh-comp__picker label { display: block; font-size: 13px; font-weight: 700; margin-bottom: 6px; color: var(--gh-c-mut); }
.gh-comp__picker-row { display: flex; gap: 8px; }
.gh-comp__picker select { flex: 1; min-width: 0; height: 46px; padding: 0 12px; border: 1px solid var(--gh-c-line); border-radius: 10px; background: #fff; font: inherit; font-size: 15px; color: var(--gh-c-ink); }
.gh-comp__add, .gh-comp__shop, .gh-comp__cta { display: inline-block; padding: 0 20px; height: 46px; line-height: 46px; border: 0; border-radius: 10px; background: var(--gh-c-pri); color: #fff !important; font: inherit; font-weight: 700; font-size: 14px; cursor: pointer; text-decoration: none !important; white-space: nowrap; }
.gh-comp__empty { text-align: center; padding: 32px 16px; background: var(--gh-c-soft); border-radius: 18px; margin-bottom: 24px; }
.gh-comp__empty p { margin: 0 0 16px; }
.gh-comp__tools { display: flex; justify-content: flex-end; margin-bottom: 12px; }
.gh-comp__diff { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; cursor: pointer; user-select: none; }
.gh-comp__diff input { width: 18px; height: 18px; accent-color: var(--gh-c-pri); }

.gh-comp__scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; background: #fff; border-radius: 18px; box-shadow: 0 10px 30px rgba(17,24,39,.07); }
.gh-comp__table { width: 100%; min-width: calc(160px + var(--gh-cols, 2) * 200px); border-collapse: separate; border-spacing: 0; margin: 0; table-layout: fixed; font-size: 14px; }
.gh-comp__table th, .gh-comp__table td { padding: 12px 16px; border: 0; border-bottom: 1px solid var(--gh-c-line); text-align: left; vertical-align: top; background: #fff; line-height: 1.45; }
.gh-comp__table tbody th { width: 160px; font-weight: 700; color: var(--gh-c-mut); font-size: 13px; }
.gh-comp__table thead th:first-child, .gh-comp__table tbody th { position: sticky; left: 0; z-index: 2; box-shadow: 1px 0 0 var(--gh-c-line); }
.gh-comp__corner { width: 160px; vertical-align: bottom !important; }
.gh-comp__corner span { font-size: 12px; text-transform: uppercase; letter-spacing: .06em; color: var(--gh-c-mut); }
.gh-comp__prod { position: relative; text-align: center !important; vertical-align: top; padding-top: 20px !important; }
.gh-comp__imgwrap { display: block; margin: 0 auto 10px; max-width: 150px; }
.gh-comp__img { width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; border-radius: 12px; display: block; }
.gh-comp__name { display: block; font-weight: 700; font-size: 15px; color: var(--gh-c-ink) !important; text-decoration: none !important; margin-bottom: 10px; min-height: 2.9em; }
.gh-comp__cta { height: 38px; line-height: 38px; padding: 0 16px; font-size: 13px; }
.gh-comp__remove { position: absolute; top: 8px; right: 8px; width: 28px; height: 28px; padding: 0; border: 1px solid var(--gh-c-line); border-radius: 50%; background: #fff; color: var(--gh-c-mut); font-size: 18px; line-height: 26px; cursor: pointer; }
.gh-comp__remove:hover { background: #fee2e2; color: #b91c1c; border-color: #fecaca; }
.gh-comp__table tbody tr:first-child td { font-weight: 700; font-size: 16px; color: var(--gh-c-ink); }
.gh-comp__table tbody tr.is-diff td { background: #f8fbff; }
.gh-comp__table tbody tr:last-child th, .gh-comp__table tbody tr:last-child td { border-bottom: 0; }
.gh-comp__na { color: #c0c6d0; }
.gh-comp.only-diff tr.is-same { display: none; }
@media (max-width: 767px) {
	.gh-comp__table { min-width: calc(110px + var(--gh-cols, 2) * 160px); font-size: 13px; }
	.gh-comp__table tbody th, .gh-comp__corner { width: 110px; }
	.gh-comp__table th, .gh-comp__table td { padding: 10px; }
	.gh-comp__picker-row { flex-direction: column; }
}