#compare-toggle, .compare-toggle, [data-compare-toggle]{display:none!important}

/* Botão novo (texto à esquerda + ícone à direita; altura igual ao botão "F") */
.fs-compare-open{
  display:inline-flex; align-items:center; gap:.6rem;
  padding:0 12px; min-height:var(--fs-btn-h,44px);
  border:1px solid #034638; background:#fff; color:#034638;
  font:500 .9rem/1 Montserrat,Arial,sans-serif; text-decoration:none; cursor:pointer; border-radius:0;
}
.fs-compare-open:hover{ border-color:#b69974; }
.fs-compare-open .fs-compare-label{ order:1; letter-spacing:.02em; }
.fs-compare-open .fs-compare-icon{ order:2; display:inline-flex; align-items:center; }
.fs-compare-open .fs-compare-ico{
  display:inline-block; width:var(--cmp-icon-size,18px); height:var(--cmp-icon-size,18px);
  background-repeat:no-repeat; background-position:center; background-size:contain;
}

#compare-box{
  display:none; position:fixed; left:0; right:0; bottom:0; top:120px;
  background:#fff; border-top:4px solid #b69974; z-index:9998;
  box-sizing:border-box; font-family:Montserrat,Arial,sans-serif; color:#4a4a4a;
  padding:16px 12px 12px; overflow:auto; -webkit-overflow-scrolling:touch;
}
@media (max-width:1024px){ #compare-box{ top:90px } }
@media (max-width:767px){  #compare-box{ top:72px } }

#compare-title{ font-size:1.2rem; color:#034638; text-align:center; margin:0 0 8px; }

/* Grid + fallback de altura; o JS pode atualizar --cmp-ph */
#compare-items{
  --cmp-ph: 220px;
  display:grid; grid-template-columns:repeat(3,1fr); gap:12px;
}

.compare-item{ position:relative; text-align:center; padding-bottom:88px; }

/* ⇨ IMAGEM: altura natural (não igualamos à caixa cinzenta) */
.compare-item img{
  width:100%;
  height:auto;
  max-height:none;
  aspect-ratio:auto;              /* anula ratio fixo do tema */
  object-fit:contain;
  background:#f3f3f3;
  display:block;
}

.compare-item p{ margin:6px 0 0; font-weight:500; color:#034638; min-height:1.5rem; font-size:1rem; }

/* ⇨ PLACEHOLDER CINZENTO: usa a mesma altura (—cmp-ph) */
.compare-item.empty{ opacity:.8; }
.compare-item.empty .ph{
  width:100%;
  height:var(--cmp-ph);
  aspect-ratio:auto;              /* impede 1/1 do tema */
  background:#e5e5e5;
  display:block;
}

/* Descrição no fundo de cada slot */
.compare-item .cmp-desc{
  position:absolute; left:0; right:0; bottom:0;
  background:#fff; border-top:1px solid #e6e6e6;
  padding:10px; text-align:left;
  font:500 12px/1.4 Montserrat,Arial,sans-serif; color:#4a4a4a;
  max-height:78px; overflow:auto;
}
@media (max-width:767px){
  .compare-item{ padding-bottom:98px; }
  .compare-item .cmp-desc{ font-size:11px; max-height:86px; }
}

.remove-from-compare{
  position:absolute; top:8px; right:8px;
  width:48px; height:48px; line-height:48px; font-size:32px;
  border:0; background:rgba(255,255,255,.9); color:#034638;
  cursor:pointer; z-index:5; border-radius:0;
  transition:background .15s ease, color .15s ease, box-shadow .15s ease;
}
@media (hover:hover){ .remove-from-compare:hover{ background:#fff; box-shadow:0 0 0 1px #034638 inset; } }
.remove-from-compare:focus{ outline:2px solid #b69974; outline-offset:2px; }
@media (max-width:767px){ .remove-from-compare{ width:44px; height:44px; line-height:44px; font-size:30px; } }

/* Botão fechar */
#close-compare{ position:absolute; top:8px; right:16px; border:0; background:transparent; font-size:36px; cursor:pointer; color:#4a4a4a; }

/* Toast limite 3 */
#fs-compare-toast{
  position:fixed; left:50%; bottom:24px; transform:translateX(-50%);
  background:#034638; color:#fff; padding:10px 14px; font:500 14px/1.2 Montserrat,Arial,sans-serif;
  border:1px solid #b69974; z-index:99999; border-radius:0; box-shadow:0 4px 14px rgba(0,0,0,.18);
  opacity:0; pointer-events:none; transition:opacity .18s ease;
}
#fs-compare-toast.fs-show{ opacity:1; }

/* Proxy flutuante do comparador: pequeno, estável e acima de tudo */
#fs-cmp-float{
  position: fixed;
  display: inline-flex !important;
  flex: 0 0 auto !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent;
  border: 0;
  box-sizing: border-box !important;
  z-index: 10060;
  will-change: left, top;
  transition: none !important;
  pointer-events: auto !important;
}

@media (max-width: 767px){
  #fs-cmp-float{ display:none !important; }
}

/* Fixar o botão original do comparador ao lado do "F" */
#fs-compare-fixed{
  position: fixed !important;
  display: inline-flex !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent;
  border: 0;
  box-sizing: border-box !important;
  z-index: 10060;
  will-change: left, top;
  transition: none !important;
  pointer-events: auto !important;
}

@media (max-width: 767px){
  #fs-compare-fixed{ display:none !important; }
}

/* FS Compare – baseline seguro */
#fs-compare-float{
  position:fixed; right:16px; bottom:16px;
  display:inline-flex; align-items:center; gap:.65rem;
  padding:10px 14px; min-height:44px;
  border:1px solid #034638; background:#fff; color:#034638;
  cursor:pointer; font:600 14px/1.1 Montserrat,Arial,sans-serif;
  box-shadow:0 10px 24px rgba(0,0,0,.12);
  z-index:2147483645; transition:transform .12s ease,border-color .2s ease;
}
#fs-compare-float:hover{ transform:translateY(-1px); border-color:#b69974; }
#fs-compare-float .ico{
  width:18px; height:18px; display:inline-block;
  background-repeat:no-repeat; background-position:center; background-size:contain;
}

/* Fallback emergente */
#compare-box.fs-fallback{
  position:fixed; left:0; right:0; bottom:0; top:120px;
  background:#fff; border-top:4px solid #b69974; z-index:2147483644;
  box-sizing:border-box; padding:16px; overflow:auto;
}
#compare-box.fs-fallback h3{ margin:0 0 8px; color:#034638; font:700 18px/1.2 Montserrat,Arial,sans-serif; }
#compare-box.fs-fallback #close-compare{
  position:absolute; top:8px; right:16px; border:0; background:transparent;
  font-size:32px; line-height:1; cursor:pointer; color:#4a4a4a;
}