/* ==========================================================================
   Comparador de proyectos (en todas las páginas; lo activa assets/js/comparar.js):
   botón «Comparar» de la tarjeta de proyecto y barra flotante de abajo con los proyectos elegidos.
   La tabla de /comparar/ está en paginas/comparar.css.
   ========================================================================== */

/* ───────── Botón de la tarjeta (bajo la flecha, sobre la foto) ───────── */
.tproy__comparar{position:absolute;top:70px;right:16px;z-index:2;display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:0 13px 0 10px;border:0;border-radius:var(--r-pill);background:rgba(255,255,255,.92);color:var(--noche);font-family:var(--f-titulo);font-weight:800;font-size:12px;letter-spacing:.01em;line-height:1;white-space:nowrap;cursor:pointer;box-shadow:0 4px 14px rgba(6,18,34,.2);transition:background .2s,color .2s}
/* Área táctil de 44 px sin agrandar el botón */
.tproy__comparar::before{content:'';position:absolute;inset:-6px -4px}
.tproy__comparar svg{flex:none;display:block}
.tproy__comparar:hover{background:#fff;color:var(--azul)}
.tproy__comparar[aria-pressed="true"]{background:var(--azul);color:#fff}
.tproy__comparar[aria-pressed="true"]:hover{background:var(--azul-hover);color:#fff}
.tproy__comparar-si{display:none!important}
.tproy__comparar[aria-pressed="true"] .tproy__comparar-mas{display:none!important}
.tproy__comparar[aria-pressed="true"] .tproy__comparar-si{display:block!important}
.tproy__comparar:focus-visible{outline:3px solid #fff;outline-offset:2px;box-shadow:0 0 0 6px var(--azul)}
/* Tarjeta angosta (carrusel a 320 px) */
@container (max-width:249.98px){.tproy__comparar{top:68px;right:14px;padding:0 11px 0 9px;font-size:11px}}

/* ───────── Barra flotante ───────── */
.cbarra{position:fixed;left:16px;right:16px;bottom:16px;z-index:35;max-width:1080px;margin:0 auto;color:var(--tinta);font-family:var(--f-texto);animation:cbarra-entra .35s var(--curva)}
@keyframes cbarra-entra{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.cbarra__in{display:flex;align-items:center;gap:12px;padding:8px 8px 8px 22px;border-radius:var(--r-pill);background:#fff;border:1px solid var(--linea-2);box-shadow:0 18px 50px rgba(11,37,69,.22),0 2px 6px rgba(11,37,69,.08)}
.cbarra__cab{flex:none;margin:0;display:flex;flex-direction:column;line-height:1.2}
.cbarra__titulo{font-family:var(--f-titulo);font-weight:800;font-size:15px;letter-spacing:-.01em}
.cbarra__cuenta{font-size:12px;color:var(--gris)}
.cbarra__chips{flex:1;min-width:0;display:flex;gap:8px;margin:0;padding:2px;list-style:none;overflow-x:auto;scrollbar-width:none}
.cbarra__chips::-webkit-scrollbar{display:none}
.cbarra__chip{flex:none;display:inline-flex;align-items:center;gap:2px;max-width:240px;min-height:40px;padding:0 4px 0 14px;border-radius:var(--r-pill);background:var(--azul-suave);color:var(--noche);font-weight:600;font-size:14px}
.cbarra__chip-txt{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cbarra__quitar{flex:none;display:flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;border:0;border-radius:var(--r-pill);background:transparent;color:var(--azul);cursor:pointer;transition:background .2s}
.cbarra__quitar:hover{background:#fff}
.cbarra__vaciar{flex:none;min-height:44px;padding:0 10px;border:0;background:transparent;color:var(--gris);font:600 14px var(--f-texto);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.cbarra__vaciar:hover{color:var(--azul)}
.cbarra__ir{flex:none;display:inline-flex;align-items:center;gap:12px;min-height:52px;padding:0 6px 0 22px;border-radius:var(--r-pill);background:var(--azul);color:#fff;font-family:var(--f-titulo);font-weight:800;font-size:15px;text-decoration:none;white-space:nowrap;cursor:pointer;transition:background .2s}
.cbarra__ir:hover{background:var(--azul-hover);color:#fff}
.cbarra__ir-ico{flex:none;display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:var(--r-pill);background:#fff;color:var(--azul)}
.cbarra__ir[aria-disabled="true"]{background:var(--linea);color:var(--gris);cursor:not-allowed}
.cbarra__ir[aria-disabled="true"] .cbarra__ir-ico{color:var(--gris)}
/* Aviso corto encima de la barra («máximo 3», «agrega otro») */
.cbarra__aviso{position:absolute;left:50%;bottom:calc(100% + 10px);width:max-content;max-width:calc(100% - 16px);margin:0;padding:10px 16px;border-radius:var(--r-campo);background:var(--noche);color:#fff;font-size:14px;line-height:1.4;text-align:center;opacity:0;pointer-events:none;transform:translate(-50%,6px);transition:opacity .25s,transform .25s}
.cbarra--aviso .cbarra__aviso{opacity:1;transform:translate(-50%,0)}

/* Celular: una sola fila (chips que se deslizan + «Comparar (n)»); el título queda para lectores de pantalla. */
@media (max-width:759.98px){
  .cbarra{left:10px;right:10px;bottom:12px}
  .cbarra__in{gap:8px;padding:6px 6px 6px 8px}
  .cbarra__cab{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
  .cbarra__vaciar{display:none}
  .cbarra__chips{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 18px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 18px),transparent)}
  .cbarra__chip{max-width:180px;padding-left:12px;font-size:13px}
  .cbarra__ir{min-height:48px;gap:8px;padding:0 5px 0 16px;font-size:14px}
  .cbarra__ir-ico{width:38px;height:38px}
}
@media (max-width:359.98px){
  .cbarra__chip{max-width:140px}
  .cbarra__ir{padding:0 16px}
  .cbarra__ir-ico{display:none}
}

/* Fichas en celular: la barra de WhatsApp (.barra-ficha, 68 px a 12 px del borde) queda abajo y esta encima. */
@media (max-width:1079.98px){.con-barra-ficha .cbarra{bottom:90px}}

/* Espacio azul noche bajo el pie para que la barra no tape los enlaces legales (alto medido por comparar.js). */
html.con-comparar body::after{content:'';display:block;height:calc(var(--cbarra-h,64px) + 28px);background:var(--noche)}

/* Con el menú u otro panel abierto la barra no estorba. */
html.sin-scroll .cbarra{visibility:hidden}

@media (prefers-reduced-motion:reduce){
  .cbarra{animation:none}
  .cbarra__aviso{transition:none}
}
@media print{.cbarra,.tproy__comparar{display:none!important}}