/* Widget VISUfarma. Colori e font arrivano dai controlli del widget (Global del Kit). */

.vf-ico { width: 1.25em; height: 1.25em; flex: none; }

/* ------------------------------------------------------------------ Barra accessibilità */
.vf-a11y {
  display: flex; align-items: center; justify-content: space-between;
  gap: .5rem 1rem; flex-wrap: wrap; color: var(--vf-a11y-ink, #3C3C3B);
}
.vf-a11y__group { display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; }
.vf-a11y__label { font-weight: 700; }
.vf-a11y__sizes { display: flex; gap: .5rem; }
/* I pulsanti della barra non ereditano lo stile globale dei pulsanti del Kit (applicato a ogni <button>) */
.vf-a11y button { box-shadow: none; text-transform: none; letter-spacing: normal; min-height: 0; }
.vf-a11y .vf-a11y__sizes button {
  min-width: 40px; height: 36px; padding: 0 .5rem;
  border: var(--vf-border-w, 1.5px) solid var(--vf-a11y-border, #6D6F71);
  border-radius: var(--vf-a11y-radius, 8px);
  background: #fff; color: var(--vf-a11y-ink, #3C3C3B);
  font: inherit; font-weight: 700; line-height: 1; cursor: pointer;
}
.vf-a11y .vf-a11y__sizes button:nth-child(2) { font-size: 1.05em; }
.vf-a11y .vf-a11y__sizes button:nth-child(3) { font-size: 1.15em; }
.vf-a11y .vf-a11y__sizes button:hover { border-color: var(--vf-a11y-active, #14589F); background: #fff; color: var(--vf-a11y-ink, #3C3C3B); }
.vf-a11y .vf-a11y__sizes button[aria-pressed='true'] {
  background: var(--vf-a11y-active, #14589F); border-color: var(--vf-a11y-active, #14589F); color: #fff;
}
.vf-a11y .vf-a11y__switch,
.vf-a11y .vf-a11y__switch:hover,
.vf-a11y .vf-a11y__switch:focus {
  display: inline-flex; align-items: center; gap: .5rem; padding: .5rem;
  background: none; border: 0; border-radius: 0; font: inherit; font-weight: 400; color: inherit; cursor: pointer;
}
.vf-a11y__track {
  position: relative; width: 52px; height: 28px; border-radius: 999px;
  border: 2px solid var(--vf-a11y-border, #6D6F71); background: #fff;
}
.vf-a11y__dot {
  position: absolute; top: 4px; left: 4px; width: 16px; height: 16px; border-radius: 50%;
  background: var(--vf-a11y-border, #6D6F71); transition: left .15s;
}
.vf-a11y__switch[aria-pressed='true'] .vf-a11y__track { background: var(--vf-a11y-active, #14589F); border-color: var(--vf-a11y-active, #14589F); }
.vf-a11y__switch[aria-pressed='true'] .vf-a11y__dot { left: 28px; background: #fff; }
.vf-a11y__hcp { margin: 0; }
.vf-a11y__hcp a { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; color: var(--vf-a11y-link, #14589F); }
@media (max-width: 767px) {
  .vf-a11y--hcp-mobile-yes .vf-a11y__hcp { display: none; }
  .vf-a11y__size-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
}
@media (prefers-reduced-motion: reduce) { .vf-a11y__dot { transition: none; } }

/* Variante compatta: pulsante «Aa» (44 px, WCAG 2.5.8) che apre il pannello sotto l'header */
.vf-a11y--compact { display: block; }
.vf-a11y .vf-a11y__toggle {
  width: 44px; height: 44px; padding: 0; border-radius: 50%;
  border: 1.5px solid var(--vf-a11y-border, #6D6F71); background: #fff; color: var(--vf-a11y-ink, #3C3C3B);
  font: inherit; font-weight: 700; line-height: 1; cursor: pointer;
}
/* Stati: il Kit colora di blu ogni <button> al passaggio e al focus; qui fondo bianco e bordo blu, sempre leggibile */
.vf-a11y .vf-a11y__toggle:hover,
.vf-a11y .vf-a11y__toggle:focus,
.vf-a11y .vf-a11y__toggle[aria-expanded='true'] {
  background: #fff; border-color: var(--vf-a11y-active, #14589F); color: var(--vf-a11y-active, #14589F);
}
.vf-a11y .vf-a11y__toggle[aria-expanded='true'] { box-shadow: inset 0 0 0 1.5px var(--vf-a11y-active, #14589F); }
.vf-a11y__pop {
  position: fixed; left: 0; right: 0; top: var(--vf-pop-top, 72px); z-index: 1000;
  padding: 16px 20px; background: #fff; border-bottom: 1px solid var(--e-global-color-vflinea, #DDDEDF);
  box-shadow: 0 12px 28px rgba(20, 88, 159, .12);
}
.vf-a11y__pop[hidden] { display: none; }
.vf-a11y__pop .vf-a11y__group { gap: 12px 16px; }
.vf-a11y__pop .vf-a11y__size-label { position: static; width: auto; height: auto; clip: auto; }
html[data-contrast='high'] .vf-a11y { --vf-border-w: 2px; }

/* ------------------------------------------------------------------ Icona */
.vf-icon { display: inline-grid; place-items: center; color: #14589F; line-height: 0; }
.vf-icon svg { width: 24px; height: 24px; }

/* ------------------------------------------------------------------ Percorso di pagina */
.vf-percorso ol { display: flex; flex-wrap: wrap; gap: 2px 0; margin: 0; padding: 0; list-style: none; }
.vf-percorso li { display: inline-flex; align-items: center; }
.vf-percorso li + li::before { content: '›'; margin: 0 .5em; color: var(--e-global-color-vfgrigio, #595B5D); }
.vf-percorso a { text-decoration: underline; text-underline-offset: 3px; }
.vf-percorso [aria-current] { font-weight: 700; }

/* ------------------------------------------------------------------ Documento a sezioni (RCP) */
.vf-sezioni details { border-bottom: 1px solid var(--e-global-color-vflinea, #DDDEDF); }
.vf-sezioni details:first-child { border-top: 1px solid var(--e-global-color-vflinea, #DDDEDF); }
.vf-sezioni summary {
  display: flex; justify-content: space-between; align-items: center; gap: 1rem;
  min-height: 44px; padding: .75rem 0; cursor: pointer; list-style: none;
}
.vf-sezioni summary::-webkit-details-marker { display: none; }
/* più / meno: lo stato si vede dalla forma, non dal colore (WCAG 1.4.1) */
.vf-sezioni summary::after { content: '+'; flex: none; font-size: 1.4em; line-height: 1; color: var(--e-global-color-primary, #14589F); }
.vf-sezioni details[open] summary::after { content: '−'; }
.vf-sezioni__testo { padding: 0 0 1.25rem; }
.vf-sezioni__testo p { margin: 0 0 .6em; }
.vf-sezioni summary { font-weight: 700; }
.vf-sezioni__testo h3 { font-size: 1em; font-weight: 700; line-height: 1.4; margin: 1.4em 0 .5em; }
.vf-sezioni__testo h3:first-child { margin-top: 0; }
.vf-sezioni__testo hr { border: 0; border-top: 1px solid var(--e-global-color-vflinea, #DDDEDF); margin: 1em 0; }
.vf-sezioni__tabella { overflow-x: auto; margin: .5em 0 1em; }
.vf-sezioni__tabella:focus-visible { outline: 2px solid var(--e-global-color-primary, #14589F); outline-offset: 2px; }
.vf-sezioni__testo table { width: 100%; border-collapse: collapse; font-size: .85em; }
/* tabelle con molte colonne: larghezza minima leggibile, il contenitore scorre */
.vf-sezioni__testo table:has(td:nth-child(4)) { min-width: 40rem; }
.vf-sezioni__testo th, .vf-sezioni__testo td { border: 1px solid #BFC3C7; padding: .35em .5em; vertical-align: top; text-align: left; }
.vf-sezioni__testo tr:first-child td { background: var(--e-global-color-vfbluchiaro, #E8F0F8); font-weight: 700; }
.vf-sezioni__testo .rientro { padding-left: 1.4em; text-indent: -1.4em; }

/* ------------------------------------------------------------------ Blocchi che si nascondono se vuoti
   Classe «vf-if-link» sul contenitore di un pulsante con link dinamico (es. foglio illustrativo):
   senza file, il pulsante sparisce invece di restare morto. */
.vf-if-link:has(a.elementor-button:not([href])),
.vf-if-link:has(a.elementor-button[href=''])  { display: none; }

/* Sezione con un Loop Grid che non trova contenuti (es. nessun approfondimento per l'area): si nasconde */
.vf-nascondi-se-vuoto:not(:has(.e-loop-item)) { display: none; }

/* ------------------------------------------------------------------ Catalogo prodotti (wireframe 04) */
/* Menu del catalogo: settore › Farmaci / Parafarmaci › categoria, con il numero; la voce corrente ha il bordo blu */
.vf-catmenu__sommario { display: none; }
.vf-catmenu__titolo { margin: 0 0 8px; font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--e-global-color-vfgrigio, #595B5D); }
.vf-catmenu ul { list-style: none; margin: 0; padding: 0; }
.vf-catmenu a { display: flex; justify-content: space-between; gap: 12px; padding: 7px 10px; border-left: 3px solid transparent; color: inherit; text-decoration: none; line-height: 1.35; }
.vf-catmenu a:hover .vf-catmenu__nome { text-decoration: underline; text-underline-offset: 3px; }
.vf-catmenu__voce--l0 > a { font-weight: 700; margin-top: 12px; }
.vf-catmenu__voce--l1 > a { font-weight: 700; padding-left: 20px; font-size: .95em; }
.vf-catmenu__voce--l2 > a { padding-left: 32px; font-size: .95em; }
.vf-catmenu__n { flex: none; color: var(--e-global-color-vfgrigio, #595B5D); font-variant-numeric: tabular-nums; }
.vf-catmenu .is-corrente > a { border-left-color: var(--e-global-color-primary, #14589F); background: var(--e-global-color-vfsuperficie, #F0F0F0); font-weight: 700; }
.vf-catmenu__voce--tutti > a { font-weight: 700; }
@media (max-width: 1024px) {
  /* su tablet e smartphone il menu è una tendina «Categoria: …» (04 mobile · 1) */
  .vf-catmenu__tendina { border: 1.5px solid var(--e-global-color-vfgrigio, #6D6F71); border-radius: 8px; background: #fff; }
  .vf-catmenu__sommario { display: flex; justify-content: space-between; align-items: center; min-height: 48px; padding: 10px 16px; cursor: pointer; list-style: none; }
  .vf-catmenu__sommario::-webkit-details-marker { display: none; }
  .vf-catmenu__sommario::after { content: '+'; font-size: 1.4em; line-height: 1; color: var(--e-global-color-primary, #14589F); }
  .vf-catmenu__tendina[open] .vf-catmenu__sommario::after { content: '−'; }
  .vf-catmenu__tendina[open] { padding-bottom: 8px; }
  .vf-catmenu__titolo { display: none; }
}

/* Ricerca e filtro per area */
.vf-filtro { display: flex; flex-direction: column; gap: 16px; }
.vf-filtro__cerca label { display: block; margin-bottom: 6px; font-weight: 700; }
.vf-filtro__cerca input[type='search'] {
  width: 100%; max-width: 480px; min-height: 48px; padding: 10px 14px; font: inherit;
  border: 1.5px solid var(--e-global-color-vfgrigio, #6D6F71); border-radius: 8px; background: #fff;
}
.vf-filtro__aree { border: 0; margin: 0; padding: 0; min-width: 0; }
.vf-filtro__aree legend { padding: 0; margin-bottom: 8px; font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--e-global-color-vfgrigio, #595B5D); }
.vf-filtro__etichette { display: flex; flex-wrap: wrap; gap: 8px; }
/* le etichette non ereditano lo stile pieno dei pulsanti del Kit */
.vf-filtro .vf-filtro__etichetta,
.vf-filtro .vf-filtro__etichetta:hover,
.vf-filtro .vf-filtro__etichetta:focus {
  min-height: 40px; padding: 6px 14px; border: 1.5px solid var(--e-global-color-vfgrigio, #6D6F71); border-radius: 999px;
  background: #fff; color: var(--e-global-color-text, #3C3C3B); font: inherit; font-size: .95em; font-weight: 400;
  text-transform: none; letter-spacing: normal; box-shadow: none; cursor: pointer;
}
.vf-filtro .vf-filtro__etichetta:hover { border-color: var(--e-global-color-primary, #14589F); }
/* scelta: fondo blu e spunta, non solo il colore (WCAG 1.4.1) */
.vf-filtro .vf-filtro__etichetta[aria-pressed='true'] { background: var(--e-global-color-primary, #14589F); border-color: var(--e-global-color-primary, #14589F); color: #fff; font-weight: 700; }
.vf-filtro .vf-filtro__etichetta[aria-pressed='true']::before { content: '\2713\00a0'; }
.vf-filtro__esito { margin: 0; font-weight: 700; }

/* Card nascoste dal filtro, gruppi rimasti vuoti, «Mostra altri» */
.vf-gruppo-catalogo[hidden], .vf-gruppo-catalogo .e-loop-item[hidden] { display: none !important; }
.vf-gruppo-catalogo .vf-mostra-altri,
.vf-gruppo-catalogo .vf-mostra-altri:hover,
.vf-gruppo-catalogo .vf-mostra-altri:focus {
  align-self: center; min-height: 48px; padding: 12px 24px; margin-top: 8px; border: 2px solid var(--e-global-color-primary, #14589F);
  border-radius: 8px; background: #fff; color: var(--e-global-color-primary, #14589F); font: inherit; font-weight: 700;
  text-transform: none; letter-spacing: normal; box-shadow: none; cursor: pointer;
}
.vf-gruppo-catalogo .vf-mostra-altri:hover { background: var(--e-global-color-vfbluchiaro, #E8F0F8); }
.vf-gruppo-catalogo .vf-mostra-altri[hidden] { display: none; }