/* TR2 in produzione · correzioni a mano della cornice (tr2-cornice.css è generato: qui quello che la home TR2 non aveva). */
/* lingua: il selettore del sito (feature-i18n.php) spostato nella striscia o nel menu del telefono */
.tr2-lingua .rbz-lang-sw.tr2-lang, .tr2-lingua-fm .rbz-lang-sw.tr2-lang { display: flex; align-items: center; gap: 6px; padding: 0; color: inherit; }
.tr2-lingua .rbz-lang-sel { font: 700 13px/1 "Figtree", system-ui, sans-serif; letter-spacing: .04em; padding: 4px 20px 4px 4px; color: inherit; min-width: 0; max-width: 150px; }
.tr2-lingua .rbz-lang-chev { right: 4px; }
.tr2-lingua-fm { margin-top: 16px; }
.tr2-lingua-fm .rbz-lang-sel { flex: 1; max-width: none; font: 700 16px/1.2 "Figtree", system-ui, sans-serif; padding: 12px 28px 12px 8px; color: inherit; }
.sv-tu:is(.tr2c *) { color: var(--testo-2); font-size: 13px; }
/* utente collegato: campana delle notifiche e nome al posto di «Entra» */
.tr2-campana:is(.tr2c *) { position: relative; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 8px; color: var(--testo); cursor: pointer; }
.tr2-campana:is(.tr2c *):hover { background: var(--notte-2); }
.tr2-campana .notif-bell-count { position: absolute; top: 4px; right: 4px; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 8px; background: #fa7a14; color: #1a0f05; font: 800 11px/16px "Figtree", sans-serif; text-align: center; }
.tr2-campana .notif-dropdown { display: none; position: absolute; top: calc(100% + 8px); right: 0; z-index: 70; width: min(360px, 92vw); max-height: 70vh; overflow: auto; border-radius: 12px; border: 1px solid var(--linea); background: var(--notte-1); box-shadow: 0 12px 32px oklch(0.1 0.04 262 / .6); text-align: left; cursor: default; }
.tr2-campana .notif-dropdown.open { display: block; }
.tr2-campana .notif-dropdown-header { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 14px; border-bottom: 1px solid var(--linea); font-weight: 700; }
.tr2-campana .notif-mark-read { background: none; border: 0; color: var(--testo-2); font: 600 13px "Figtree", sans-serif; cursor: pointer; }
.tr2-utente:is(.tr2c *) { gap: 8px; max-width: 200px; }
.tr2-avatar:is(.tr2c *) { display: grid; place-items: center; flex: none; width: 28px; height: 28px; border-radius: 50%; background: #fa7a14; color: #1a0f05; font-weight: 800; font-size: 14px; }
.tr2-nome:is(.tr2c *) { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 1180px) { .tr2-nome:is(.tr2c *) { display: none; } }
/* piede: social, pagine del sito e note legali (dal piede di prima: nessun link tolto) */
.tr2-pg-social:is(.tr2c *), .tr2-pg-sito:is(.tr2c *) { margin: 10px 0 0; color: var(--testo-3, var(--testo-2)); font-size: 14px; line-height: 1.8; }
.tr2-pg-social a:is(.tr2c *), .tr2-pg-sito a:is(.tr2c *) { color: var(--testo-2); text-decoration: none; }
.tr2-pg-social a:is(.tr2c *):hover, .tr2-pg-sito a:is(.tr2c *):hover { color: var(--testo); text-decoration: underline; }
.tr2-pg-copy:is(.tr2c *) { margin: 10px 0 0; color: var(--testo-2); font-size: 13px; }
/* titoli della cornice: il bundle di prima impone a tutti gli h1-h6 Archivo Black maiuscolo con !important */
:is(h1, h2, h3, h4, h5, h6):is(.tr2c *) { font-family: var(--f-marchio) !important; text-transform: none !important; }
/* striscia: l'ora «nel tuo fuso» (pagine inglesi, fuori dall'Italia) solo dal computer, al telefono spingeva «Join» fuori */
@media (max-width: 860px) { .sv-tu:is(.tr2c *) { display: none !important; } }
/* piede al telefono: «Iscriviti al Weekly» era largo metà e spostato a destra (anche nell'anteprima): a tutta larghezza */
@media (max-width: 640px) { .pg-acc:is(.tr2c *) { grid-column: 1 / -1 !important; width: auto !important; justify-self: stretch !important; } }
/* menu: passando da una voce all'altra la tendina vecchia restava piena per 0,3 s (ritardo per scendere col mouse) mentre la
   nuova entrava semitrasparente sopra → sottovoci mescolate. Se il mouse è su un'altra voce, le altre tendine spariscono subito;
   il ritardo resta solo quando si esce dal menu. */
.nav:has(> li:hover) > li:not(:hover) > .nav-sub:is(.tr2c *) { visibility: hidden !important; opacity: 0 !important; transition: none !important; }
/* piede da collegato (owner, foto 30/10): con la barra laterale (in pagina sopra 1024 px, 220 px) il piede partiva sotto la
   barra, non allineato al contenuto → parte dopo la barra. 220/0,85 perché il piede ha zoom 0,85 sopra 860 px. */
@media (min-width: 1025px) { #rbz-content.rbz-has-sidebar ~ footer.pg.tr2c { margin-left: calc(220px / .85); } }
/* riquadro Weekly del piede: era alto quanto l'elenco e quasi vuoto → iscritti e conto alla rovescia in fondo */
.pg-acc-dati:is(.tr2c *) { margin-top: auto; display: grid; gap: 14px; padding-right: 64px; }
.pg-acc-iscr:is(.tr2c *) { display: grid; gap: 8px; max-width: 300px; }
.pg-acc-barra:is(.tr2c *) { display: block; height: 6px; border-radius: 3px; background: color-mix(in oklab, currentColor 18%, transparent); overflow: hidden; }
.pg-acc-barra:is(.tr2c *)::after { content: ""; display: block; height: 100%; width: var(--p); min-width: 6px; background: currentColor; border-radius: 3px; }
.pg-acc-dati strong:is(.tr2c *) { font: 800 24px/1 var(--f-marchio); font-stretch: 86%; font-variant-numeric: tabular-nums; }
/* ricerca dell'intestazione e del foglio al telefono (owner 30/10, foto: «ci sono due focus»): il riquadro si accendeva e il campo
   dentro aggiungeva il suo contorno arancione → un solo segno, il contorno arancione attorno a tutto il riquadro (icona compresa) */
.cerca-campo input:is(:focus, :focus-visible):is(.tr2c *) { outline: none !important; box-shadow: none !important; border-color: transparent !important; }
.cerca-campo:focus-within:is(.tr2c *) { outline: 2px solid var(--vetrina) !important; outline-offset: 0 !important; border-color: var(--vetrina) !important; }
/* scheda carta (owner 30/10 «rimodula»): parte bassa a due colonne indipendenti (tr2/area-prezzi.php, .two-col) — niente più buco
   sotto «Prezzi per lingua» quando «Gradate» accanto è più alta; sotto 1100 px le colonne vanno una sotto l'altra come prima */
.tr2-pz-carta .two-col { align-items: start; }
.tr2-pz-carta .two-col > .col { display: flex; flex-direction: column; gap: var(--g, 24px); min-width: 0; }
.tr2-pz-carta .two-col > .col > .rq { width: auto; max-width: none; margin: 0; min-width: 0; }
.tr2-pz-carta .two-col .notes { margin-top: 0; }
/* «Ranked» anche nell'intestazione compatta (owner 30/10: «manca nel header ranked»): sotto 1180 px i bottoni spariscono tutti,
   Ranked resta (prima di ricerca e menu); al telefono solo la coppa, grande come le altre icone (il testo resta per i lettori di schermo) */
@media (max-width: 1180px) {
  .hd .hd-ranked:is(.tr2c, .tr2c *) { display: inline-flex !important; order: -1; }
}
@media (max-width: 640px) {
  .hd .hd-ranked:is(.tr2c, .tr2c *) { width: 44px; padding: 0; gap: 0; justify-content: center; font-size: 0; }
  .hd .hd-ranked svg:is(.tr2c *) { width: 20px; height: 20px; }
  /* al telefono la lente dell'intestazione lascia il posto alla coppa: «Cerca» c'è già nella barra in basso (da collegato la
     campanella finiva fuori dallo schermo) */
  .hd-dx .hd-icona[data-apri="fs"]:is(.tr2c *) { display: none !important; }
}
/* dal computer Ranked è una voce del menu (owner 30/10 «Dov'è la sezione ranked nel header?»): il bottone con la coppa solo nell'intestazione compatta */
@media (min-width: 1181px) { .hd .hd-ranked:is(.tr2c, .tr2c *) { display: none !important; } }
