/* =======================================================================
   search.css — ricerca sito: pulsante header, pannello autocomplete,
   pagina risultati (search.php) e 404. Dipende dai token di shared.css.
   ===================================================================== */

/* ---------- pulsante nell'header ---------- */
.hsearch-btn{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:11px;border:1px solid var(--line);
	background:#fff;color:var(--ink-2);cursor:pointer;flex:0 0 auto;transition:background .18s,border-color .18s,color .18s}
.hsearch-btn:hover{border-color:var(--violet);color:var(--violet);background:var(--violet-tint)}
.hsearch-btn[aria-expanded="true"]{background:var(--violet);border-color:var(--violet);color:#fff}

/* (il pannello si ancora all'header: .site-header è già position:sticky in shared.css,
   che funge da containing block per il pannello absolute — NON sovrascrivere qui) */

/* ---------- pannello dropdown ---------- */
.hsearch-panel{position:absolute;left:0;right:0;z-index:1200;background:var(--card);border-bottom:1px solid var(--line);
	box-shadow:0 26px 50px -28px rgba(21,18,28,.5);animation:hsDrop .22s ease}
.hsearch-panel[hidden]{display:none}
@keyframes hsDrop{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
.hsearch-form{display:flex;align-items:center;gap:10px;padding:16px 0 12px}
.hsearch-ico{color:var(--muted);flex:0 0 auto}
.hsearch-input{flex:1;min-width:0;border:0;background:none;font-family:var(--disp);font-size:1.45rem;font-weight:600;color:var(--ink);letter-spacing:-.01em}
.hsearch-input::placeholder{color:var(--text-faint,#9aa0ab);font-weight:500}
.hsearch-input:focus{outline:none}
.hsearch-go{flex:0 0 auto;background:var(--violet);color:#fff;border:0;border-radius:10px;padding:11px 20px;font-weight:700;font-size:.9rem;cursor:pointer;transition:background .18s}
.hsearch-go:hover{background:var(--violet-700)}
.hsearch-close{flex:0 0 auto;width:38px;height:38px;border-radius:10px;border:1px solid var(--line);background:#fff;color:var(--muted);font-size:1rem;cursor:pointer}
.hsearch-close:hover{border-color:var(--violet);color:var(--violet)}
.hsearch-hint{padding:0 0 16px;font-size:.74rem;color:var(--text-faint,#9aa0ab)}
.hsearch-hint kbd{font-family:var(--mono);background:var(--paper-2);border:1px solid var(--line);border-radius:5px;padding:1px 6px;font-size:.7rem}

/* niente scrim a tutta pagina (bloccava i click): il pannello è un dropdown
   ad alto z-index; la chiusura avviene con ✕, Esc o click fuori (search.js). */

/* ---------- risultati suggest ---------- */
.hsearch-results{max-height:min(62vh,520px);overflow-y:auto;padding-bottom:8px}
.hsearch-results.is-loading{opacity:.55}
.hs-list{list-style:none;margin:0;padding:0}
.hs-list a{display:flex;align-items:center;gap:11px;padding:11px 12px;border-radius:10px;text-decoration:none;color:var(--ink);transition:background .14s}
.hs-list a:hover{background:var(--violet-tint)}
.hs-t{flex:1;min-width:0;font-weight:600;font-size:.96rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hs-n{flex:0 0 auto;font-family:var(--mono);font-size:.72rem;color:var(--muted);background:var(--paper-2);border-radius:999px;padding:1px 8px}
.hs-sec-h{font-family:var(--disp);font-style:italic;font-size:.86rem;color:var(--muted);margin:10px 4px 4px}
.hs-all{display:block;text-align:center;margin:8px 0 14px;padding:11px;font-weight:700;font-size:.86rem;color:var(--violet);
	border-top:1px solid var(--line)}
.hs-all:hover{color:var(--violet-700)}
.hs-empty{padding:16px 12px 22px;color:var(--muted);font-size:.92rem}

/* ---------- targhette tipologia (suggest + results) ---------- */
.hs-badge,.sr-badge{flex:0 0 auto;display:inline-block;font-size:.6rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;
	padding:3px 8px;border-radius:6px;line-height:1.5}
.hs-badge--news,.sr-badge--news{background:#fdecea;color:#c0392b}
.hs-badge--broker,.sr-badge--broker{background:#e6f8ef;color:#0b8f28}
.hs-badge--guida,.sr-badge--guida{background:var(--violet-tint);color:var(--violet-700)}
.hs-badge--pagina,.sr-badge--pagina{background:var(--paper-2);color:var(--muted)}
.hs-badge--sezione{background:#eef0fb;color:#3a3f9c}

/* ---------- pagina risultati (search.php) ---------- */
.srpage{margin:8px 0 40px}
.sr-hero{background:var(--ink);color:#fff;border-radius:var(--r-lg);padding:30px 32px;margin:6px 0 24px;position:relative;overflow:hidden}
.sr-hero::before{content:"";position:absolute;inset:0 0 0 auto;width:44%;pointer-events:none;background:radial-gradient(circle at 85% 12%,rgba(73,7,217,.5),transparent 62%)}
.sr-hero .in{position:relative}
.sr-hero .eyebrow{color:#c9b8ff;font-family:var(--disp);font-style:italic;font-weight:600;font-size:.95rem}
.sr-hero h1{font-family:var(--disp);font-weight:600;font-size:clamp(1.8rem,3.4vw,2.6rem);line-height:1.06;letter-spacing:-.02em;color:#fff;margin:8px 0 0}
.sr-hero h1 em{color:#9d7bff;font-style:normal}
.sr-hero .sr-count{margin-top:12px;font-size:.95rem;color:#c4bfd0}
.sr-hero .sr-form{display:flex;align-items:center;gap:10px;margin-top:18px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);border-radius:12px;padding:8px 8px 8px 14px;max-width:560px}
.sr-hero .sr-form svg{color:#c9b8ff;flex:0 0 auto}
.sr-hero .sr-form input{flex:1;min-width:0;background:none;border:0;color:#fff;font-size:1rem;font-family:var(--sans)}
.sr-hero .sr-form input::placeholder{color:rgba(255,255,255,.6)}
.sr-hero .sr-form input:focus{outline:none}
.sr-hero .sr-form button{flex:0 0 auto;background:var(--violet);color:#fff;border:0;border-radius:9px;padding:9px 18px;font-weight:700;cursor:pointer}

.sr-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.sr-card{display:grid;grid-template-columns:130px 1fr;gap:16px;align-items:stretch;background:var(--card);border:1px solid var(--line);
	border-radius:var(--r-lg);overflow:hidden;text-decoration:none;color:inherit;box-shadow:var(--shadow-xs);
	transition:transform .25s,box-shadow .25s,border-color .25s}
.sr-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:var(--line-2)}
.sr-ph{background:linear-gradient(135deg,#211d2e,#3a3450) center/cover no-repeat}
.sr-ph[data-empty]{background:linear-gradient(135deg,#1a0f4d,#4907d9)}
.sr-body{padding:15px 16px 15px 0;display:flex;flex-direction:column;gap:7px;min-width:0}
.sr-card .sr-badge{align-self:flex-start}
.sr-ttl{font-family:var(--disp);font-weight:600;font-size:1.12rem;line-height:1.2;color:var(--ink);
	display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sr-card:hover .sr-ttl{color:var(--violet-700)}
.sr-exc{font-size:.86rem;color:var(--muted);line-height:1.5;margin:0;
	display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sr-meta{margin-top:auto;font-size:.74rem;color:var(--text-faint,#9aa0ab)}
.sr-empty{text-align:center;padding:50px 20px;background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg)}
.sr-empty h2{font-family:var(--disp);font-weight:600;font-size:1.4rem;margin-bottom:8px}
.sr-empty p{color:var(--muted);max-width:46ch;margin:0 auto 18px}

/* ---------- 404 ---------- */
.e404{margin:8px 0 50px}
.e404-hero{background:var(--ink);color:#fff;border-radius:var(--r-lg);padding:44px 36px;text-align:center;position:relative;overflow:hidden}
.e404-hero::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 80% 0%,rgba(73,7,217,.45),transparent 55%),radial-gradient(circle at 10% 100%,rgba(4,190,104,.2),transparent 55%)}
.e404-code{position:relative;font-family:var(--disp);font-weight:600;font-size:clamp(3.4rem,9vw,6rem);line-height:1;color:#fff;letter-spacing:-.03em}
.e404-code em{color:#9d7bff;font-style:normal}
.e404-hero h1{position:relative;font-family:var(--disp);font-weight:600;font-size:clamp(1.3rem,2.6vw,1.8rem);margin:6px 0 0;color:#fff}
.e404-hero p{position:relative;color:#c4bfd0;max-width:52ch;margin:12px auto 0;line-height:1.6}
.e404-form{position:relative;display:flex;gap:10px;max-width:520px;margin:22px auto 0;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);border-radius:12px;padding:8px 8px 8px 14px}
.e404-form svg{color:#c9b8ff;align-self:center;flex:0 0 auto}
.e404-form input{flex:1;min-width:0;background:none;border:0;color:#fff;font-size:1rem}
.e404-form input::placeholder{color:rgba(255,255,255,.6)}
.e404-form input:focus{outline:none}
.e404-form button{flex:0 0 auto;background:var(--violet);color:#fff;border:0;border-radius:9px;padding:10px 20px;font-weight:700;cursor:pointer}
.e404-links{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:26px}
.e404-link{display:block;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px;text-decoration:none;color:inherit;box-shadow:var(--shadow-xs);transition:transform .22s,box-shadow .22s,border-color .22s}
.e404-link:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:var(--violet)}
.e404-link b{display:block;font-family:var(--disp);font-weight:600;font-size:1.04rem;color:var(--ink)}
.e404-link span{display:block;font-size:.82rem;color:var(--muted);margin-top:3px;line-height:1.45}

/* ---------- responsive ---------- */
@media(max-width:880px){
	.sr-grid{grid-template-columns:1fr}
	.e404-links{grid-template-columns:1fr 1fr}
}
@media(max-width:620px){
	.hsearch-form{flex-wrap:wrap}
	.hsearch-input{font-size:1.2rem;order:1;flex:1 1 100%;padding:4px 0}
	.hsearch-ico{display:none}
	.hsearch-go{order:2}.hsearch-close{order:3;margin-left:auto}
	.sr-card{grid-template-columns:96px 1fr;gap:12px}
	.sr-body{padding:13px 14px 13px 0}
	.e404-links{grid-template-columns:1fr}
}