/* ==========================================================================
   GEEKFINDER — PROPUESTA 11 · BORDES RECTOS (diseno/propuesta-11-bordes)
   El sitio actual tal cual, con la geometría recta de la Propuesta 1 y su
   tarjeta de producto. No cambia colores, tipografía ni estructura.
   Se carga después de guildhall.css; para descartarla basta con quitar el <link>.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Radios: de píldoras y esquinas de 16 px a esquinas de 2-4 px
   -------------------------------------------------------------------------- */
:root, [data-theme="dark"], [data-theme="light"] {
  --radius-sm: 2px;
  --radius-md: 4px;
  --radius-lg: 4px;
  --radius-full: 4px;
}

/* Controles que tenían el círculo escrito a mano: misma geometría recta.
   Los puntos de estado (stock, "en vivo") siguen redondos: son indicadores, no formas. */
.gf-switch-slider::before { border-radius: 2px; }
.gf-price-slider-input::-webkit-slider-thumb { border-radius: 2px; }
.gf-price-slider-input::-moz-range-thumb { border-radius: 2px; }
.gf-modal-icon-badge, .gf-modal-close-btn { border-radius: var(--radius-md); }
.gf-alert-modal-card::before { border-radius: 2px; }

/* Modal de alerta como hoja inferior en el teléfono: esquinas superiores rectas */
@media (max-width: 640px) {
  .gf-alert-modal-card { border-radius: 4px 4px 0 0 !important; }
}

/* --------------------------------------------------------------------------
   2. Tarjeta de producto (la de la Propuesta 1): el botón de comparar ocupa
      todo el pie y se llena de dorado al pasar; la tarjeta sube apenas y la
      imagen no se agranda.
   -------------------------------------------------------------------------- */
.gf-product-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.40);
}

[data-theme="light"] .gf-product-card:hover { box-shadow: 0 2px 8px rgba(28, 25, 23, 0.08); }

.gf-product-card:hover .gf-card-img { transform: none; }

.gf-card-footer, .gf-product-card .gf-card-footer { padding: 0; }

.gf-card-footer .gf-btn-compare {
  height: auto;
  min-height: 44px;
  border: 0;
  border-radius: 0;
  background: none;
  transition: background var(--transition-fast), color var(--transition-fast);
}

.gf-product-card:hover .gf-card-footer .gf-btn-compare {
  background: var(--brand-gold);
  color: var(--brand-amber-ink);
  box-shadow: none;
}

.gf-product-card:hover .gf-btn-arrow { transform: translateX(3px); }

.gf-pdp-img:hover { transform: none; }