/* HorecaPodcast · Follower e notifiche (modules/Follow): pulsante «+ Segui» con campanella (profili, canali, show,
   categorie, serie, ospiti), campanella della testata, scheda «Seguiti» dell'account. Colori del sito: navy #1E305A,
   rosso #CA0000; ogni tipo seguito ha il suo colore (Targets::META), canali/show/categorie anche il proprio. */

/* ---------- pulsante «+ Segui» ---------- */
.hp-fl{position:relative;display:inline-flex;gap:8px;align-items:center;vertical-align:middle}
.hp-fl__btn{display:inline-flex;align-items:center;gap:6px;height:44px;padding:0 22px 0 18px;border:0;border-radius:999px;background:#CA0000;color:#fff;font:700 15px Montserrat,Roboto,Arial,sans-serif;cursor:pointer;transition:background .2s,box-shadow .2s;white-space:nowrap;-webkit-tap-highlight-color:transparent}
@media (hover:hover){.hp-fl__btn:hover{background:#a80000}.hp-fl.is-on .hp-fl__btn:hover{background:#dfe3ee}.hp-fl.is-dark.is-on .hp-fl__btn:hover{background:#f1f3f8}}
.hp-fl__btn:focus-visible,.hp-fl__bell:focus-visible,.hp-fl__menu button:focus-visible{outline:3px solid #1E305A;outline-offset:2px}
/* il «+» grande e in evidenza (richiesta del proprietario) */
.hp-fl__plus{display:inline-grid;place-items:center;width:26px;height:26px;margin-right:2px;border-radius:50%;background:#fff;color:#CA0000;font:900 26px/1 'Roboto Condensed',Arial,sans-serif;padding-bottom:2px;box-sizing:border-box}
.hp-fl__on{display:none}
.hp-fl.is-on .hp-fl__off{display:none}
.hp-fl.is-on .hp-fl__on{display:inline}
.hp-fl.is-on .hp-fl__btn{background:#EBEEF5;color:#141B2D;box-shadow:inset 0 0 0 1px #DCE0E8;padding:0 18px}
.hp-fl__btn[disabled]{opacity:.7;cursor:progress}
.hp-fl__bell{width:44px;height:44px;border-radius:50%;border:1px solid #DCE0E8;background:#fff;color:#141B2D;cursor:pointer;display:none;place-items:center;padding:0;transition:opacity .2s}
.hp-fl.is-on .hp-fl__bell{display:grid}
.hp-fl__bell.is-muted{opacity:.5}
.hp-fl__bell.is-muted .hp-fl__slash{display:inline}
.hp-fl__slash{display:none}
.hp-fl__menu{position:absolute;right:0;top:calc(100% + 6px);z-index:70;width:252px;max-width:calc(100vw - 24px);background:#fff;border:1px solid #DCE0E8;border-radius:10px;padding:6px;box-shadow:0 14px 30px -14px rgba(0,0,0,.4);display:flex;flex-direction:column;gap:2px;text-align:left}
.hp-fl__menu[hidden]{display:none}
.hp-fl__menu button{display:flex;gap:10px;align-items:center;width:100%;text-align:left;border:0;background:transparent;color:#141B2D;padding:10px;border-radius:7px;font:500 14px Roboto,Arial,sans-serif;cursor:pointer}
.hp-fl__menu button:hover{background:#EBEEF5}
.hp-fl__menu button[aria-checked="true"]{background:#FBE9E9;color:#CA0000;font-weight:700}
.hp-fl__menu hr{border:0;border-top:1px solid #DCE0E8;margin:4px 2px}
.hp-fl__menu .hp-fl__stop{color:#5B6478;font-size:13px}
.hp-fl__menu small{display:block;padding:2px 10px 6px;color:#5B6478;font:400 12px/1.4 Roboto,Arial,sans-serif}
/* variante su fondo scuro (es. testata colorata degli show) */
.hp-fl.is-dark .hp-fl__btn{box-shadow:0 0 0 2px #fff}
.hp-fl.is-dark.is-on .hp-fl__btn{background:#fff;color:#1E305A;box-shadow:none}

/* ---------- campanella della testata ---------- */
.hp-bell{position:relative;flex:none}
.hp-bell__btn{position:relative;width:42px;height:42px;border:1px solid rgba(255,255,255,.35);border-radius:4px;background:transparent;color:#fff;display:grid;place-items:center;cursor:pointer;padding:0}
.hp-bell__btn:hover{background:rgba(255,255,255,.08)}
.hp-bell__n{position:absolute;top:-7px;right:-7px;min-width:20px;height:20px;padding:0 5px;border-radius:10px;background:#CA0000;color:#fff;font:700 11px/20px Montserrat,Arial,sans-serif;text-align:center;box-shadow:0 0 0 2px #1E305A}
.hp-bell__n[hidden]{display:none}
.hp-bell__panel{position:absolute;right:0;top:calc(100% + 10px);z-index:80;width:360px;max-width:calc(100vw - 20px);background:#fff;color:#141B2D;border:1px solid #DCE0E8;border-radius:10px;box-shadow:0 18px 40px -16px rgba(0,0,0,.45);overflow:hidden;text-transform:none;letter-spacing:0}
.hp-bell__panel[hidden]{display:none}
.hp-bell__head{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:12px 14px;border-bottom:1px solid #DCE0E8}
.hp-bell__head b{font:800 16px 'Roboto Condensed',Arial,sans-serif;text-transform:uppercase}
.hp-bell__head button{border:0;background:transparent;color:#1E305A;font:600 12px Montserrat,Arial,sans-serif;cursor:pointer;padding:4px}
.hp-bell__list{max-height:min(60vh,420px);overflow:auto;margin:0;padding:0;list-style:none}
.hp-bell__list a{display:flex;gap:10px;padding:11px 14px;color:#141B2D;border-bottom:1px solid #f0f1f5;text-decoration:none}
.hp-bell__list a:hover{background:#f5f6f9;color:#141B2D}
.hp-bell__list a.is-new{background:#fff7f7}
.hp-bell__dot{flex:none;width:8px;height:8px;margin-top:6px;border-radius:50%;background:#CA0000}
.hp-bell__list a:not(.is-new) .hp-bell__dot{background:transparent}
.hp-bell__txt{display:flex;flex-direction:column;gap:2px;min-width:0}
.hp-bell__txt small{font:700 10.5px Montserrat,Arial,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:#CA0000}
.hp-bell__txt span{font:500 14px/1.35 Roboto,Arial,sans-serif;overflow-wrap:anywhere}
.hp-bell__txt em{font:400 12px Roboto,Arial,sans-serif;color:#5B6478;font-style:normal}
.hp-bell__empty{padding:22px 14px;text-align:center;color:#5B6478;font-size:14px}
.hp-bell__foot{display:block;padding:11px 14px;text-align:center;font:700 12px Montserrat,Arial,sans-serif;color:#1E305A;background:#f5f6f9}
@media (max-width:1023px){.hp-bell__panel{position:fixed;left:10px;right:10px;top:64px;width:auto;max-width:none}}

/* ---------- account › Seguiti ---------- */
.hp-fa{display:flex;flex-direction:column;gap:14px;scroll-margin-top:90px}
.hp-fa h2{margin:0;font:800 24px 'Roboto Condensed',Arial,sans-serif;text-transform:uppercase}
.hp-fa__list{display:flex;flex-direction:column;gap:8px}
.hp-fa__row{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:center;border:1px solid #d9dce4;border-radius:8px;padding:12px}
.hp-fa__av{flex:none;width:48px;height:48px;border-radius:50%;background:#1E305A;color:#fff;display:grid;place-items:center;font:800 17px 'Roboto Condensed',Arial,sans-serif;overflow:hidden}
.hp-fa__av img{width:100%;height:100%;object-fit:cover}
.hp-fa__who{flex:1 1 180px;min-width:0;display:flex;flex-direction:column;gap:2px}
.hp-fa__who a{font:800 17px 'Roboto Condensed',Arial,sans-serif;text-transform:uppercase;color:#111;overflow-wrap:anywhere}
.hp-fa__who small{font-size:12px;color:#5B6478}
.hp-fa__ctl{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.hp-fa__ctl select{height:40px;border:1px solid #d9dce4;border-radius:6px;padding:0 10px;font:500 14px Roboto,Arial,sans-serif;background:#fff;max-width:100%}
.hp-fa__ctl label{display:inline-flex;gap:6px;align-items:center;font-size:13px;color:#333}
.hp-fa__stop{height:40px;padding:0 14px;border:1px solid #d9dce4;border-radius:20px;background:#fff;color:#5B6478;font:600 12px Montserrat,Arial,sans-serif;cursor:pointer}
.hp-fa__stop:hover{border-color:#CA0000;color:#CA0000}
.hp-fa__box{border:1px solid #d9dce4;border-radius:8px;padding:14px;display:flex;flex-direction:column;gap:10px}
.hp-fa__box b{font:800 16px 'Roboto Condensed',Arial,sans-serif;text-transform:uppercase}
.hp-fa__box p{margin:0;font-size:14px;color:#4a4f5c;line-height:1.5}
.hp-fa__opts{display:flex;flex-wrap:wrap;gap:8px}
.hp-fa__opts label{display:inline-flex;gap:8px;align-items:center;border:1px solid #d9dce4;border-radius:20px;padding:8px 14px;font-size:14px;cursor:pointer}
.hp-fa__opts label:has(input:checked){border-color:#1E305A;background:#1E305A;color:#fff}
.hp-fa__opts input{accent-color:#CA0000}
.hp-fa__push{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.hp-fa__state{font:600 12px Montserrat,Arial,sans-serif;color:#5B6478}

/* ---------- contatore follower e versione compatta del pulsante ---------- */
.hp-fl__count{font:600 13px Montserrat,Arial,sans-serif;white-space:nowrap}
.hp-fl__count[hidden]{display:none}
.hp-fl__count b{font:800 17px 'Roboto Condensed',Arial,sans-serif}
.hp-fl.is-small .hp-fl__btn{height:36px;padding:0 14px 0 10px;font-size:13px}
.hp-fl.is-small .hp-fl__plus{width:22px;height:22px;font-size:22px}
.hp-fl.is-small.is-on .hp-fl__btn{padding:0 12px}
.hp-fl.is-small .hp-fl__bell{width:36px;height:36px}

/* ---------- account › Seguiti: testata, tipi, gruppi ---------- */
.hp-fa *{box-sizing:border-box}
.hp-fa__head p{margin:4px 0 0;font-size:14px;color:#4a4f5c;line-height:1.5}
.hp-fa__nav{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding-bottom:2px;max-width:100%}
.hp-fa__nav[hidden]{display:none}
.hp-fa__nav::-webkit-scrollbar{display:none}
.hp-fa__nav a{flex:none;display:inline-flex;gap:7px;align-items:center;height:40px;padding:0 14px 0 6px;border-radius:20px;border:1px solid #d9dce4;background:#fff;color:#111;font:700 13px 'Roboto Condensed',Arial,sans-serif;text-transform:uppercase;letter-spacing:.03em;text-decoration:none}
.hp-fa__nav a[hidden]{display:none}
.hp-fa__nav a b{font:700 12px Montserrat,Arial,sans-serif;color:var(--c)}
.hp-fa__ti{flex:none;display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--c);color:#fff}
.hp-fa__group{display:flex;flex-direction:column;gap:10px;scroll-margin-top:90px}
.hp-fa__group[hidden]{display:none}
.hp-fa__group h3{margin:6px 0 0;display:flex;gap:10px;align-items:center;font:800 19px 'Roboto Condensed',Arial,sans-serif;text-transform:uppercase;border-bottom:3px solid var(--c);padding-bottom:8px}
.hp-fa__n{min-width:26px;height:22px;padding:0 7px;border-radius:11px;background:#EBEEF5;color:#141B2D;font:700 12px/22px Montserrat,Arial,sans-serif;text-align:center}
.hp-fa__av{position:relative;overflow:visible;text-decoration:none}
.hp-fa__av img{border-radius:50%}
.hp-fa__badge{position:absolute;right:-3px;bottom:-3px;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;color:#fff;box-shadow:0 0 0 2px #fff}
.hp-fa__row.is-muted .hp-fa__av{opacity:.6}
.hp-fa__mail{min-height:40px}
.hp-fa__mail input{width:18px;height:18px;accent-color:#1E305A}

/* stato vuoto con suggerimenti */
.hp-fa__empty{display:flex;flex-direction:column;gap:16px;border:1px dashed #c4cad6;border-radius:10px;padding:clamp(14px,3vw,22px);background:#fafbfd}
.hp-fa__empty[hidden]{display:none}
.hp-fa__emptyhead{display:flex;gap:14px;align-items:flex-start}
.hp-fa__emptyhead b{display:block;font:800 22px 'Roboto Condensed',Arial,sans-serif;text-transform:uppercase}
.hp-fa__emptyhead p{margin:4px 0 0;font-size:14px;line-height:1.5;color:#4a4f5c}
.hp-fa__emptyic{flex:none;width:58px;height:58px;border-radius:50%;background:#CA0000;color:#fff;display:grid;place-items:center}
.hp-fa__sug{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr))}
.hp-fa__suggrp{background:#fff;border:1px solid #d9dce4;border-top:4px solid var(--c);border-radius:8px;padding:12px;display:flex;flex-direction:column;gap:8px;min-width:0}
.hp-fa__suggrp h4{margin:0;display:flex;flex-wrap:wrap;gap:4px 8px;align-items:center;font:800 16px 'Roboto Condensed',Arial,sans-serif;text-transform:uppercase}
.hp-fa__suggrp h4 small{flex-basis:100%;font:400 12px Roboto,Arial,sans-serif;text-transform:none;color:#5B6478}
.hp-fa__suggrp ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:6px}
.hp-fa__suggrp li{display:flex;gap:8px;align-items:center;justify-content:space-between;min-width:0}
.hp-fa__sugname{display:inline-flex;gap:8px;align-items:center;min-width:0;color:#111;font:600 14px Roboto,Arial,sans-serif;overflow-wrap:anywhere}
.hp-fa__dot{flex:none;width:10px;height:10px;border-radius:50%}
.hp-fa__explore{display:flex;flex-wrap:wrap;gap:8px}

/* telefono: righe come in un'app, comandi sotto al nome a tutta larghezza */
@media (max-width:600px){
  .hp-fa__row{padding:12px 12px 10px}
  .hp-fa__ctl{flex-basis:100%;display:grid;grid-template-columns:1fr auto;gap:8px}
  .hp-fa__ctl select{width:100%;height:44px}
  .hp-fa__stop{grid-column:1 / -1;height:42px;width:100%}
  .hp-fa__emptyic{width:46px;height:46px}
}
