/* ============================================================ Bestogoo Search reskin — 2026 Visual alignment with the Claude Design "Bestogoo Home and Search". Scoped to body.psearch and intentionally COSMETIC: it restyles the page chrome (search bar, subcategory chips, list/map tabs, CTA) and gently polishes the engine-generated result cards (.box007/.box008…) WITHOUT changing their layout geometry or any JS behaviour. ============================================================ */ body.psearch{ --bg-blue:#2563eb; --bg-blue-d:#1d4ed8; --bg-coral:#ff6b6b; --bg-ink:#111827; --bg-muted:#6b7280; --bg-line:#e5e7eb; --bg-surface:#f8f9fa; background:var(--bg-surface)!important; font-family:'Nunito Sans','Avenir Next',system-ui,-apple-system,sans-serif!important; color:var(--bg-ink); } /* .bgwtotal is a position:fixed full-viewport grey layer at z-index:0 that was covering everything without an explicit z-index (the chrome showcase, etc.) — send it to the back. */ body.psearch .bgwtotal{background:var(--bg-surface)!important;z-index:-1!important;} /* ---------------- top search / header tool ---------------- */ body.psearch #box001.contenitor-search-tool{ background:rgba(255,255,255,0.95)!important; backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px); border-bottom:1px solid var(--bg-line)!important; box-shadow:0 1px 0 rgba(0,0,0,0.02); } body.psearch .contenitor-info-search{ color:var(--bg-ink)!important;font-weight:700;letter-spacing:-0.01em; } /* location input */ body.psearch input#loc.box026{ font-family:inherit!important;font-size:15px!important;font-weight:600;color:var(--bg-ink)!important; } /* category select */ body.psearch #category{ font-family:inherit!important;font-weight:600;color:var(--bg-ink);cursor:pointer; } /* round blue search button */ body.psearch .box022{ background-color:var(--bg-blue)!important;border-radius:9999px!important; transition:background 150ms; } body.psearch .box022:hover{background-color:var(--bg-blue-d)!important;} /* Filtri / Accedi pills in the search bar */ body.psearch .contenitor-button-filter .filter{ border:1px solid #dee2e6!important;border-radius:9999px!important; background:#fff!important;color:var(--bg-ink)!important;font-family:inherit!important; font-weight:700!important;transition:all 140ms; } body.psearch .contenitor-button-filter .filter:hover{border-color:var(--bg-blue)!important;color:var(--bg-blue)!important;} body.psearch .contenitor-button-filter .buttonloginfilter{color:var(--bg-blue)!important;} /* ---------------- subcategory suggestion chips (sizing in "Round 2 fixes" below) ---------------- */ body.psearch .container-suggestion{background:transparent!important;} body.psearch .menu-suggestion{display:flex!important;gap:10px;flex-wrap:nowrap;align-items:flex-start;padding:0 4px;} body.psearch .menu-suggestion li{list-style:none;} body.psearch .menu-suggestion li.active .img{box-shadow:0 0 0 3px var(--bg-blue);} /* ---------------- Lista / Mappa segmented tabs ---------------- */ body.psearch .search-view-tabs{ display:inline-flex;background:#f0f2f5;border-radius:9999px;padding:3px;border:0;gap:0; } body.psearch .search-view-tab{ display:inline-flex;align-items:center;gap:6px;border:0;border-radius:9999px; padding:8px 16px;font-family:inherit;font-size:13.5px;font-weight:700;cursor:pointer; background:transparent;color:var(--bg-muted);transition:all 140ms; } body.psearch .search-view-tab.active{background:#fff;color:var(--bg-blue);box-shadow:0 1px 3px rgba(0,0,0,0.12);} /* ---------------- Add business CTA ---------------- */ body.psearch .box-container-add-business{display:flex!important;justify-content:center;margin:24px auto!important;position:static!important;z-index:auto!important;right:auto!important;bottom:auto!important;left:auto!important;top:auto!important;width:auto!important;} /* la bottom-nav mobile LEGACY (#contanitorbarmobile "Esplora/Prenotazioni/…") su search non era nascosta (la regola sta solo su body.detail-store): index.css la rende position:fixed + bianca opaca pinnata in alto -> DIPINGE SOPRA il pill di ricerca (la barra "non si vedeva"). Il redesign non la usa (i voci sono nel menu account). La nascondo anche qui. */ body.psearch #contanitorbarmobile, body.psearch .contanitor-barmobile{display:none!important;} body.psearch .box-container-add-business a{ display:inline-flex;align-items:center;gap:8px;background:#fff;border:1px solid #dee2e6; color:var(--bg-blue);font-family:inherit;font-weight:700;font-size:14px; padding:12px 22px;border-radius:9999px;cursor:pointer;transition:all 140ms; } body.psearch .box-container-add-business a:hover{border-color:var(--bg-blue);background:#f5f8ff;} /* ---------------- result cards: gentle polish only ---------------- */ body.psearch .box007{ border-radius:16px!important; box-shadow:0 2px 8px rgba(0,0,0,0.08)!important; overflow:hidden; transition:transform 180ms cubic-bezier(0.2,0.7,0.2,1),box-shadow 180ms!important; } body.psearch .box007:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,0,0,0.12)!important;} /* missing/404 photos → photo on top, Bestogoo logo placeholder behind (shows only if the photo fails). 2 background layers: [photo cover] , [logo 52px centred] on a light surface. */ body.psearch .box009{ border-radius:0!important;background-color:#eef1f4!important; background-size:cover,52px!important;background-position:center,center!important;background-repeat:no-repeat,no-repeat!important; } body.psearch .box009-no-photo{background-color:#eef1f4!important;background-size:46px!important;background-position:center!important;background-repeat:no-repeat!important;opacity:.85;} /* featured "In evidenza" card: don't clip the badge; logo placeholder behind the (cover) photo */ body.psearch .box007.featured-item{ overflow:visible!important;background-color:#e9eefb!important; background-size:cover,72px!important;background-position:center,center!important;background-repeat:no-repeat,no-repeat!important; } body.psearch .c-title-featured-item span{letter-spacing:-0.01em;} /* rating heart -> coral accent to match the new identity */ body.psearch .box021{color:var(--bg-ink);font-weight:800;} /* featured badge -> coral pill */ body.psearch .featured-badge span{background:var(--bg-coral)!important;} /* booking button -> brand blue */ body.psearch .buttonbrowsemenu{ background:var(--bg-blue)!important;border-radius:8px!important;font-family:inherit!important;font-weight:700!important; } /* loader / messaging */ body.psearch #loader_pager{font-family:inherit;font-weight:700;color:var(--bg-muted);} body.psearch .boxnoresult font{font-family:inherit;font-weight:700;color:var(--bg-muted);} /* ============================================================ Round 2 fixes (header pill, filter sheet, chips, card button) ============================================================ */ /* ---- header vertical alignment: centre the account cluster + logo with the centred pill ---- */ /* inset the account cluster so the dropdown sits off the edge AND scales like the home (whose centered header keeps it ~80px in at 1280, wider on bigger screens). Matches the home menu's positioning. */ body.psearch .box-contenitor-menu-index-right{top:0!important;bottom:0!important;right:14px!important;display:flex!important;align-items:center;justify-content:flex-end;height:auto!important;gap:14px;} /* same dropdown box model as the home (search lacked the global border-box reset → 236 vs 222) */ body.psearch .bgh-acct .box045-loged.bmenu{box-sizing:border-box!important;} body.psearch .box-contenitor-menu-index-right .call-to-action-index{margin-top:0!important;} /* logged-in: drop the redundant "Gestisci menu" header link — it's already in the avatar dropdown (the home hides it via .bgh-account, but search's container is .bgh-acct, so it leaked through). Anonymous keeps its "Crea Menu" CTA. */ body.psearch .bgh-acct:has(.box045-loged) a.call-to-action-index{display:none!important;} /* iOS/WebKit: uno slider "in evidenza" sborda orizzontalmente (scrollWidth 472>390 -> la pagina scrolla di lato su iOS, su Chromium no). Clip a livello pagina come su detail: gli slider interni hanno il loro overflow-x:auto e continuano a scrollare; qui blocco solo il leak orizzontale della pagina. overflow-x:clip non crea scroll container (non rompe sticky). */ html:has(body.psearch){overflow-x:clip;} body.psearch{overflow-x:clip;margin-top:-24px!important;/* elimina il gap grigio ~24px sopra la barra (offset fantasma del body, non da margin/quirks/whitespace) */} /* mobile: the absolute account cluster ends ~3px below the centred pill → nudge it up to align */ @media(max-width:767px){ /* Accedi/account cluster: centrato verticalmente (prima top:calc(50%-3px) lo lasciava ~12px piu' in basso del pill) */ body.psearch .box-contenitor-menu-index-right{top:50%!important;bottom:auto!important;transform:translateY(-50%)!important;} /* logo: css/extra/indexnew.php lo nasconde (.box047b{display:none!important}) su mobile. Lo rimostro come icona 30px a sinistra, centrata verticalmente (come home/detail). */ body.psearch #box001 .box047b{ display:flex!important;align-items:center;position:absolute!important; left:14px!important;right:auto!important;top:50%!important;transform:translateY(-50%)!important; width:auto!important;margin:0!important;padding:0!important;z-index:3; pointer-events:none!important; /* il canvas SVG e' largo ~106px: non deve intercettare i tap sulla freccia del pill (il logo non e' un link) */ } body.psearch #box001 .box047b .logobig{display:none!important;} body.psearch #box001 .box047b .logoicon{display:inline-block!important;height:30px!important;width:auto!important;} } body.psearch #box001 #filterforsearch{display:flex;align-items:center;position:relative;} body.psearch #box001 .box047b{display:flex;align-items:center;margin-top:0!important;} /* logo resta a ~29px (wrapper absolute legacy ml13+pl16); home+detail allineati a 29 */ body.psearch #box001 .box047b img{height:30px!important;width:auto!important;} /* 30px to match home + detail (was ~42) */ /* ---- header search pill "Categoria - Città": clean + kill the notch ---- */ body.psearch #box024{ width:min(48vw,500px)!important;max-width:500px;height:48px!important;margin:0 auto!important; border:1px solid #dee2e6;border-radius:9999px;background:#fff; box-shadow:0 2px 10px rgba(0,0,0,0.06);display:flex;align-items:center;overflow:hidden; } body.psearch #box024 #prosearch{width:100%;height:100%;display:flex;align-items:center;justify-content:center;} body.psearch #box024 .contenitor-info-search{font-family:inherit!important;font-weight:700!important;color:var(--bg-ink)!important;text-align:center;width:100%;} /* neutralise any pseudo-element / stray child that draws the little tab under the pill */ body.psearch #box024::before,body.psearch #box024::after, body.psearch #prosearch::before,body.psearch #prosearch::after, body.psearch .contenitor-info-search::before,body.psearch .contenitor-info-search::after{content:none!important;display:none!important;} body.psearch #location_field.box023.switchoff,body.psearch .box024.switchoff{display:none!important;} /* the "notch": the stray #filter (Filtri + duplicate login) button sitting centred in the header. Filter access isn't exposed in the redesign and login lives in the account area, so hide it. */ body.psearch #filter.contenitor-button-filter{display:none!important;} /* ===== DESKTOP: barra search = pill PIENA come la home (sempre espansa). Forzo via CSS lo stato espanso che prosearch() mostrerebbe: nascondo la pill collassata #box024 + il back-arrow, mostro il form reale (#loc + #category + bottone) e lo stilizzo identico alla home. Mobile (<768) resta la pill collassata centrata (la home stessa nasconde la pill piena ≤1080px). NON tocco id loc/category/name/handler -> motore di ricerca intatto. ===== */ @media(min-width:768px){ body.psearch #box001 #box024{display:none!important;} body.psearch #box001 .gotoback,body.psearch #box001 #gotobackinside{display:none!important;} body.psearch #box001 #location_field.box023, body.psearch #box001 #location_field.box023.switchoff{display:flex!important;justify-content:center;width:100%;margin:0!important;} body.psearch #box001 #location_field > .box024{width:min(48vw,500px)!important;max-width:500px!important;height:auto!important;margin:0 auto!important;padding:0!important;border:0!important;background:transparent!important;} body.psearch #box001 #mbscmo2.bcontsearch.mbscmo{ display:flex!important;align-items:center;gap:0;width:100%!important;height:48px!important; background:#fff!important;border:1px solid #dee2e6!important;border-radius:9999px!important; box-shadow:0 2px 10px rgba(0,0,0,0.06)!important;overflow:hidden;margin:0!important;padding:0!important; } /* reset posizioni legacy: il bottone .box022 è absolute DENTRO #categoryserachs e copriva il select "Pizzeria". Rimetto tutti i figli del pill + del segmento categoria in flusso -> ordine flex [pin|input|categoria][bottone]. */ body.psearch #box001 #mbscmo2.bcontsearch.mbscmo > *, body.psearch #box001 #categoryserachs > *{position:relative!important;inset:auto!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;float:none!important;} /* pin località (glifo blu come home/detail) */ body.psearch #box001 .box025.search025{flex-shrink:0;width:auto!important;height:auto!important;min-width:0!important;margin:0 0 0 16px!important;padding:0!important;background:none!important;display:grid;place-items:center;cursor:pointer;} body.psearch #box001 .box025.search025::before{content:"\f3c5";font-family:"Font Awesome 6 Free";font-weight:900;color:var(--bg-blue);font-size:13px;line-height:1;} /* input località trasparente */ body.psearch #box001 input#loc.box026.search026{flex:1 1 auto!important;min-width:0!important;width:auto!important;border:0!important;background:transparent!important;outline:none!important;box-shadow:none!important;font-family:inherit!important;font-size:14px!important;font-weight:600!important;color:var(--bg-ink)!important;height:100%!important;margin:0!important;padding:0 10px 0 8px!important;transform:translateY(-1px);/* baseline input ~1px piu' bassa del select -> allineo testo citta' a "Pizzeria" */} /* segmento categoria: divisore + select nativa stilizzata inline (blu/bold) con caret custom */ body.psearch #box001 #categoryserachs.box005, body.psearch #box001 #categoryserachs.box005.switchoff{display:flex!important;align-items:center;height:100%;flex-shrink:0;width:auto!important;background:transparent!important;border:0!important;} body.psearch #box001 #type_of_search.boxselect-search{width:auto!important;min-width:0!important;height:100%;display:flex;align-items:center;background:transparent!important;border:0!important;margin:0!important;padding:0!important;} body.psearch #box001 #type_of_search.boxselect-search::before{content:"";width:1px;height:20px;background:#dee2e6;margin:0 4px 0 6px;flex:0 0 auto;} body.psearch #box001 .styled-select-search{position:relative;background:transparent!important;border:0!important;box-shadow:none!important;height:100%;display:flex;align-items:center;margin:0!important;padding:0!important;} /* neutralizza il triangolo CSS legacy (border-based, absolute, 0x0) e mette il mio caret FA pulito inline */ body.psearch #box001 .styled-select-search::after{ content:"\f078"!important;border:0!important;width:auto!important;height:auto!important; position:static!important;top:auto!important;right:auto!important; font-family:"Font Awesome 6 Free"!important;font-weight:900!important;font-size:9px!important;color:#9ca3af!important;line-height:1!important; margin:0 10px 0 5px!important;pointer-events:none; } body.psearch #box001 select#category{ border:0!important;background:transparent!important;outline:none!important;box-shadow:none!important;cursor:pointer; font-family:inherit!important;font-size:13.5px!important;font-weight:700!important;color:var(--bg-blue)!important; height:100%!important;padding:0 2px 0 8px!important;margin:0!important;max-width:140px; -webkit-appearance:none!important;-moz-appearance:none!important;appearance:none!important; } /* bottone cerca blu, a filo a destra */ body.psearch #box001 button.box022{ width:46px!important;height:48px!important;flex-shrink:0;border:0!important;border-radius:0 9999px 9999px 0!important; background:var(--bg-blue)!important;color:#fff!important;cursor:pointer;display:grid!important;place-items:center!important;margin:0!important;padding:0!important;transition:background 150ms; } body.psearch #box001 button.box022::after{content:"\f002";font-family:"Font Awesome 6 Free";font-weight:900;color:#fff;font-size:14px;} body.psearch #box001 button.box022:hover{background:var(--bg-blue-d)!important;} } /* ---- filter panels: hidden until "Filtri" is clicked. filtersearch/index.php ships TWO off-canvas panels (.contenitorfiltersearch + .contenitorsearchinmenu); inputstyle.css (which normally hides them) is NOT loaded on search.php, so they fall into normal flow. display:none is bulletproof. ---- */ body.psearch .contenitorfiltersearch, body.psearch .contenitorsearchinmenu{display:none!important;} body.psearch .contenitorfiltersearch.openprecart, body.psearch .contenitorsearchinmenu.openprecart{ display:block!important;position:fixed;left:0;right:0;bottom:0;max-height:85vh;overflow:auto; background:#fff;z-index:300;box-shadow:0 -8px 30px rgba(0,0,0,0.18); border-radius:18px 18px 0 0;margin:0;width:auto; } /* ---- subcategory chips: uniform width, smaller circle, label wraps fully under ---- */ body.psearch .menu-suggestion>li{width:90px!important;flex:0 0 90px!important;} body.psearch .menu-suggestion>li>a{display:flex!important;flex-direction:column;align-items:center;text-align:center;padding:4px 2px;height:auto;width:100%;border:0!important;background:transparent!important;} body.psearch .menu-suggestion>li>a>.img{width:52px!important;height:52px!important;border-radius:50%!important;float:none!important;margin:0 0 6px 0!important;background-size:cover;} body.psearch .menu-suggestion>li>a>font{float:none!important;margin:0!important;font-size:11px!important;font-weight:600;color:#374151;white-space:normal!important;line-height:1.15;width:100%;display:block;word-break:break-word;} /* ---- Lista/Mappa tabs: hidden for now (map is WIP) ---- */ body.psearch .search-view-tabs{display:none!important;} /* ---- result cards: uniform height (cards with the menu button were taller) ---- */ body.psearch .box006b{display:flex!important;flex-wrap:wrap;align-items:stretch;} body.psearch .box007{display:flex!important;flex-direction:column;} body.psearch .box007 > .box008{flex:1 1 auto;display:flex;flex-direction:column;} body.psearch .bgs-cardbtns{margin-top:auto;} /* ---- result card: "Sfoglia menu" button (added by engine/design.js) ---- */ body.psearch .bgs-cardbtns{display:flex;gap:8px;padding:10px 14px 6px;} body.psearch .bgs-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;font-family:inherit;font-size:13px;font-weight:700;padding:9px 16px;border-radius:8px;cursor:pointer;text-decoration:none;white-space:nowrap;transition:filter 140ms;} body.psearch .bgs-btn-primary{background:var(--bg-blue);color:#fff;} body.psearch .bgs-btn-primary:hover{filter:brightness(1.06);} body.psearch .bgs-btn-ghost{background:#f0f2f5;color:var(--bg-ink);} body.psearch .bgs-btn-ghost:hover{background:#e4e6e9;} /* ============================================================ Round 3 — full result-card redesign ("Bestogoo Search" design) New markup from engine/design.js addElement: .bgs-card. Vote hooks preserved: #id (buttonup/ups), #id_down (buttondown/downs), #id_numup/_numdown, #id_rating, #id_expup/_exdwn. ============================================================ */ body.psearch #box006b.box006b{ display:grid!important;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:18px;align-items:stretch; max-width:1100px;margin:0 auto;padding:6px 0 0; } @media(max-width:560px){ /* legacy index.css (@media piccolo) impone .box006b{width:92%;float:left}: il redesign mette margin:0 auto ma il float:left annulla i margini auto -> griglia larga 92% incollata a sinistra con ~8% vuoto a destra. Qui: width piena + float:none + gutter 14px (come chrome/showcase). */ body.psearch #box006b.box006b{ grid-template-columns:1fr; width:100%!important;float:none!important;box-sizing:border-box!important; margin:0!important;padding:6px 14px 0!important; } } body.psearch .bgs-card{ display:flex;flex-direction:column;background:#fff;border-radius:16px;overflow:hidden;cursor:pointer; box-shadow:0 2px 8px rgba(0,0,0,0.08);border-left:4px solid transparent; transition:transform 180ms cubic-bezier(0.2,0.7,0.2,1),box-shadow 180ms; } body.psearch .bgs-card:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,0,0,0.12);} body.psearch .bgs-card-gold{border-left-color:transparent;} /* ranking border rimosso: "la classifica è un concetto superato" */ body.psearch .bgs-card-accent{border-left-color:transparent;} body.psearch .bgs-photo{position:relative;display:block;height:184px;background-size:cover;background-position:center;background-color:#eef1f4;text-decoration:none;} body.psearch .bgs-photo-veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0.22) 0%,rgba(0,0,0,0) 32%,rgba(0,0,0,0) 60%,rgba(0,0,0,0.34) 100%);} body.psearch .bgs-badge{position:absolute;top:12px;left:12px;display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:700;padding:5px 11px;border-radius:9999px;z-index:2;} body.psearch .bgs-badge-gold{background:rgba(255,215,0,0.95);color:#4a3500;} body.psearch .bgs-badge-blue{background:rgba(37,99,235,0.92);color:#fff;} body.psearch .bgs-fav{position:absolute;top:10px;right:10px;width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,0.92);color:#374151;display:grid;place-items:center;backdrop-filter:blur(4px);font-size:13px;z-index:2;} body.psearch .bgs-rep{position:absolute!important;bottom:12px!important;left:12px!important;top:auto!important;right:auto!important;display:inline-flex!important;flex-direction:row!important;align-items:center;gap:6px;white-space:nowrap!important;background:rgba(255,255,255,0.94)!important;backdrop-filter:blur(4px);padding:5px 11px!important;border-radius:9999px!important;font-size:12.5px!important;font-weight:800!important;color:#111827!important;margin:0!important;min-width:0!important;width:auto!important;max-width:none!important;height:auto!important;line-height:1.1!important;z-index:2;} body.psearch .bgs-rep > i{color:var(--bg-coral);font-size:11px;} body.psearch .bgs-rep .bgs-rep-l{color:#9ca3af;font-weight:600;} body.psearch .bgs-rep img{display:none!important;} body.psearch .bgs-body{padding:15px 17px 16px;display:flex;flex-direction:column;gap:10px;flex:1;} body.psearch .bgs-toprow{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;} body.psearch .bgs-namewrap{min-width:0;} body.psearch .bgs-nameline{display:flex;align-items:center;gap:8px;flex-wrap:wrap;} body.psearch .bgs-name{font-size:18px;font-weight:700;letter-spacing:-0.01em;color:#111827;line-height:1.2;text-decoration:none;} body.psearch .bgs-name:hover{color:var(--bg-blue);} body.psearch .bgs-verified{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:700;padding:2px 7px;border-radius:9999px;background:#dbeafe;color:#1d4ed8;} body.psearch .bgs-meta{font-size:13px;color:#6b7280;margin-top:5px;display:flex;align-items:center;gap:7px;flex-wrap:wrap;} body.psearch .bgs-meta > i{color:#9ca3af;} body.psearch .bgs-dot{color:#d1d5db;} body.psearch .bgs-votecol{display:flex;flex-direction:column;align-items:center;gap:10px;flex-shrink:0;} body.psearch .bgs-voteup,body.psearch .bgs-votedown{position:relative;height:30px;} body.psearch .bgs-voteup > a{display:inline-flex;align-items:center;gap:5px;cursor:pointer;text-decoration:none;background:#f0f2f5;color:#374151;font-size:12.5px;font-weight:800;padding:6px 11px;border-radius:9999px;transition:all 140ms;} body.psearch .bgs-voteup.buttonups > a{background:rgba(255,107,107,0.16);color:var(--bg-coral);} body.psearch .bgs-voteup > a > i{font-size:12px;} body.psearch .bgs-votedown > a{display:grid;place-items:center;width:30px;height:30px;background:#f0f2f5;color:#9ca3af;border-radius:50%;cursor:pointer;text-decoration:none;transition:all 140ms;} body.psearch .bgs-votedown.buttondowns > a{background:#fee2e2;color:#dc2626;} body.psearch .bgs-votedown > a > i{font-size:12px;} body.psearch .bgs-hidden{position:absolute!important;left:-9999px!important;top:auto!important;width:0!important;height:0!important;overflow:hidden;} body.psearch .bgs-voteup .esplosion,body.psearch .bgs-votedown .esplosion{position:absolute;inset:0;pointer-events:none;} body.psearch .bgs-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:auto;padding-top:4px;} body.psearch .bgs-actions .bgs-btn{flex:1 1 auto;padding:11px 15px;} body.psearch .bgs-actions .bgs-btn-primary{flex:1 1 0;min-width:0;} body.psearch .bgs-actions .bgs-btn-ghost{flex:0 0 auto;white-space:nowrap;overflow:visible;} /* the result-card CSS inflates any /icon inside result buttons into a 35-39px circle — force the Prenota/Menu icons back to small inline glyphs so the buttons are ~38px tall */ body.psearch .bgs-actions .bgs-btn,body.psearch .bgs-btn{min-height:0!important;height:auto!important;line-height:1.1!important;} body.psearch .bgs-actions .bgs-btn i,body.psearch .bgs-btn i{ font-size:13px!important;width:auto!important;height:auto!important;min-width:0!important;min-height:0!important; background:none!important;background-image:none!important;border:0!important;border-radius:0!important;box-shadow:none!important; padding:0!important;margin:0!important;display:inline-block!important;line-height:1!important;vertical-align:middle; } /* same inflation hits the vote heart / heart-crack icons (they get absolutely-positioned + 35px), spilling onto the Menu button — keep them small inline glyphs inside the compact vote column */ body.psearch .bgs-voteup > a i,body.psearch .bgs-votedown > a i,body.psearch .bgs-votecol i{ position:static!important;font-size:12px!important;width:auto!important;height:auto!important;min-width:0!important;min-height:0!important; background:none!important;background-image:none!important;border:0!important;border-radius:0!important;box-shadow:none!important; padding:0!important;margin:0!important;display:inline-block!important;line-height:1!important;float:none!important;inset:auto!important; } /* ROOT FIX: a global `.buttondown a / .buttonup a` rule sets position:absolute, which floated the heart-crack down onto the Menu button. Keep the vote links in-flow inside the vote column. */ body.psearch .bgs-voteup > a,body.psearch .bgs-votedown > a{position:relative!important;float:none!important;inset:auto!important;bottom:auto!important;top:auto!important;left:auto!important;right:auto!important;margin:0!important;} /* the legacy .buttonup/.buttondown CSS sizes the vote links to ~23px circles with a bg-image heart — override to the design: UP = pill "heart + count", DOWN = 30px circle with heart-crack. */ body.psearch .bgs-voteup > a{display:inline-grid!important;place-items:center!important;width:30px!important;height:30px!important;padding:0!important;gap:0!important;background:#f0f2f5!important;background-image:none!important;color:#374151!important;border-radius:50%!important;box-shadow:none!important;} body.psearch .bgs-voteup.buttonups > a{background:rgba(255,107,107,0.16)!important;color:var(--bg-coral)!important;} body.psearch .bgs-votedown > a{display:inline-grid!important;place-items:center!important;width:30px!important;height:30px!important;padding:0!important;background:#f0f2f5!important;background-image:none!important;color:#9ca3af!important;border-radius:50%!important;box-shadow:none!important;} body.psearch .bgs-votedown.buttondowns > a{background:#fee2e2!important;color:#dc2626!important;} /* no vote count inside the heart circle — the social-proof number lives in the "reputazione" pill on the photo. the stays in the DOM (vote() updates #..._numup) but is hidden so every up button is an identical clean circle, voted (coral) or not (grey). */ body.psearch .bgs-voteup > a > font{display:none!important;} /* ============================================================ Logged-in account menu on search: was showing the nav items (Esplora/Prenotazioni/Notifiche/Profilo) inline next to the avatar. Collapse to just the avatar — the items belong in the dropdown (.bmenu), like the home. ============================================================ */ body.psearch .bgh-acct .btnmainmenu{display:none!important;} body.psearch .bgh-acct .barmobilebtn{display:none!important;} body.psearch .bgh-acct .box045-loged.bmenu .btnmainmenu{display:flex!important;} /* ============================================================ Round 4 — search screen chrome White bar (heading + subcategory pills + Filtri/Ordina toolbar) sitting ABOVE #box006b. Reuses --bg-blue/--bg-ink/--bg-muted/--bg-line. ============================================================ */ /* the search header (#box001) sits over a grey full-bleed overlay; lift it so the search bar shows, and force a flow height so the chrome below clears the (absolutely-positioned) header content */ body.psearch #box001{position:relative!important;z-index:40!important;min-height:72px;} body.psearch .bgs-chrome{ clear:both;position:relative;z-index:5; max-width:1100px;margin:0 auto;padding:18px 0 0; /* NB: la pagina e' grigia (--bg-surface); un tempo qui c'era background:#fff che rendeva titolo+chips un blocco bianco -> il suo bordo inferiore contro la showcase grigia appariva come una "linea/band" sotto i chip. Trasparente = si fonde, nessuna linea. */ background:transparent; } /* the showcase section (below the chrome) also needs to sit above the (now z-1) grey layer */ body.psearch .bgs-showcase{position:relative;z-index:5;} @media(max-width:1140px){ body.psearch .bgs-chrome{padding-left:14px;padding-right:14px;} } /* ---- heading row ---- */ body.psearch .bgs-chrome-head{ display:block!important;direction:ltr!important; } body.psearch .bgs-chrome-count{display:inline-block;margin-left:10px;} body.psearch .bgs-chrome-title{ margin:0!important;font-family:inherit;font-size:clamp(19px,2.8vw,25px)!important;font-weight:800!important; letter-spacing:-0.01em;color:var(--bg-ink)!important;line-height:1.2!important; /* undo any global SEO h1 hiding (text-indent / off-screen / opacity / clip) */ text-indent:0!important;position:static!important;left:auto!important;top:auto!important; width:auto!important;height:auto!important;max-height:none!important;overflow:visible!important; opacity:1!important;visibility:visible!important;clip:auto!important;white-space:normal!important;text-align:left!important; float:none!important;flex:1 1 auto!important;order:0!important; } body.psearch .bgs-chrome-loc{color:var(--bg-blue);} body.psearch .bgs-chrome-count{font-size:13.5px;color:var(--bg-muted);white-space:nowrap;flex-shrink:0;} /* ---- subcategory chips: horizontal scroll, hidden scrollbar, pill look ---- */ body.psearch .bgs-chips-row{ display:flex;align-items:center;gap:9px;margin-top:14px;padding-bottom:6px; overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:none; } body.psearch .bgs-chips-row::-webkit-scrollbar{display:none;height:0;} /* the dynamic