/* ============================================================
 * SII design system - layer ereditato dal sito Idea-Re
 * (classi idearewb-* -> sii-*, palette SII: #006eb7 / #034876 / #012e4b)
 * Contiene SOLO le regole effettivamente usate da viste e js.
 * Rigenerabile: l'origine e' out-readable/_next/static/css/app.css
 * ============================================================ */

/* ============================================================
 * Source: /_next/static/chunks/0z62f23mgl8pe.css
 * ============================================================ */
:root {
  --sii-primary: #006eb7;
  --sii-primary-dark: #034876;
  --sii-primary-darker: #012e4b;
  --sii-primary-light: #eaf3fa;
  --sii-hero-dark: #2f2f2f;
  --sii-hero-darker: #1f1f1f;
  --sii-hero-accent: #7fc3ea;
  --sii-success: #008758;
  --sii-warning: #ea7905;
  --sii-danger: #d9364f;
  --sii-text: #111;
  --sii-heading: #454545;
  --sii-text-muted: #555;
  --sii-text-on-red: #fff;
  --sii-bg-page: #fff;
  --sii-bg-card: #fff;
  --sii-bg-soft: #f7f7f7;
  --sii-border: #e0e0e0;
  --sii-font-sans: Titillium Web, -apple-system, BlinkMacSystemFont, Segoe UI, sans-serif;
  --sii-font-serif: Lora, Georgia, serif;
  --sii-font-mono: Roboto Mono, Courier New, monospace;
  --sii-radius: 8px;
  --sii-radius-lg: 16px;
  --sii-shadow: 0 4px 12px #11111114;
  --sii-shadow-lg: 0 12px 32px #1111111f
}

.skiplinks {
  text-align: center;
  background-color: #f3f7fc
}

.skiplinks a {
  color: #06c;
  padding: .5rem;
  font-weight: 600;
  text-decoration: underline;
  display: block
}

.skiplinks ul {
  margin-bottom: 0;
  padding: 0;
  font-size: 1rem;
  line-height: 1.5rem;
  list-style: none
}

.sii-breadcrumb {
  margin: 0 0 1.5rem;
  font-size: .8333rem
}

.sii-breadcrumb ol, .sii-breadcrumb li, .sii-breadcrumb a, .sii-breadcrumb span {
  font-size: .8333rem;
  line-height: 1.5
}

.sii-breadcrumb ol {
  flex-wrap: wrap;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex
}

.sii-breadcrumb a {
  color: inherit;
  text-underline-offset: 2px;
  font-weight: 600;
  text-decoration: underline
}

.sii-breadcrumb a:hover {
  opacity: .85
}

.sii-breadcrumb span {
  color: inherit
}

.sii-breadcrumb__sep {
  opacity: .6;
  margin: 0 .5rem
}

.sii-breadcrumb--on-red {
  color: #fff;
  opacity: .95
}

@media (prefers-reduced-motion:reduce) {
  *, :before, :after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important
  }
  .sii-menu-mobile__panel {
    transition-duration: .28s !important
  }
  .sii-menu-mobile__overlay {
    transition-duration: .22s !important
  }
  .sii-menu-mobile__close {
    transition-duration: .22s !important;
    transition-delay: .14s !important
  }
}

.sii-brand {
  align-items: center;
  gap: .85rem;
  min-width: 0;
  text-decoration: none;
  display: inline-flex
}

@media (max-width:991.98px) {
  .sii-brand {
    gap: .5rem
  }
}

.sii-brand--light {
  color: #fff
}

.sii-header {
  z-index: 100;
  color: #fff;
  position: relative;
  box-shadow: 0 2px #0f172a1a, 0 8px 20px #0f172a1a
}

.sii-header__slim {
  background: #034876;
  font-size: .7rem;
  line-height: 1
}

.sii-header__slim-inner {
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  min-height: 48px;
  padding-block: .6rem;
  display: flex
}

.sii-header__region {
  color: #fff;
/*  font-weight: 600;
*/  text-decoration: none
}

.sii-header__region:hover {
  color: #fff;
  text-decoration: underline
}

.sii-header__slim-tools {
  flex-wrap: wrap;
  align-items: center;
  gap: .75rem;
  display: flex
}

.sii-header__slim-icon {
  color: #fff;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  transition: opacity .15s;
  display: inline-flex
}

.sii-header__slim-icon:hover, .sii-header__slim-icon:focus-visible {
  color: #fff;
  opacity: .85
}

.sii-header__slim-icon-disc {
  color: #034876;
  background: #fff;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 24px;
  height: 24px;
  display: inline-flex
}

.sii-header__slim-lang {
  color: #fff;
  text-transform: uppercase;
  font-weight: 600
}

.sii-header__slim-lang span {
  letter-spacing: .04em
}

.sii-header__lang {
  position: relative
}

.sii-header__lang-chevron {
  transition: transform .2s
}

.sii-header__lang-chevron.is-rotated {
  transform: rotate(180deg)
}

.sii-header__center {
  background: #006eb7;
  padding-block: 1rem .6rem
}

.sii-header__center-inner {
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
  gap: 1.5rem;
  display: flex
}

@media (max-width:767.98px) {
  .sii-header__center-inner {
    justify-content: space-between;
    gap: .75rem
  }
}

.sii-header__brand-link {
  text-decoration: none;
  display: inline-flex
}

.sii-header__brand-link:hover {
  text-decoration: none
}

@media (max-width:991.98px) {
  .sii-header__brand-link {
    margin-right: auto
  }
}

.sii-header__center-tools {
  flex-wrap: wrap;
  align-items: center;
  gap: 1.25rem;
  display: flex
}

@media (max-width:991.98px) {
  .sii-header__center-tools {
    flex-wrap: nowrap;
    gap: .5rem
  }
}

.sii-header__burger-mobile {
  color: #fff;
  cursor: pointer;
  background: 0 0;
  border: 0;
  flex: none;
  justify-content: center;
  align-items: center;
  padding: .25rem;
  display: none
}

@media (max-width:991.98px) {
  .sii-header__burger-mobile {
    display: inline-flex
  }
}

.sii-header__icon-btn {
    color: #fff;
    align-items: center;
    gap: .55rem;
    font-size: .9rem;
    font-weight: 400;
    text-decoration: none;
    transition: opacity .15s;
    display: inline-flex
}

.sii-header__icon-btn:hover {
  color: #fff;
  text-decoration: none
}

.sii-header__icon-btn:hover .sii-header__icon-btn-disc {
  background: #eaf3fa;
  transform: scale(1.05)
}

.sii-header__icon-btn:focus-visible {
  outline-offset: 3px;
  border-radius: 8px;
  outline: 2px solid #fff
}

.sii-header__icon-btn-disc {
  color: #006eb7;
  background: #fff;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 48px;
  height: 48px;
  transition: background .15s, transform .15s;
  display: inline-flex;
  box-shadow: 0 1px 2px #00000014
}

.sii-header__icon-btn-disc svg {
  width: 22px;
  height: 22px
}

@media (max-width:991.98px) {
  .sii-header__icon-btn-disc {
    width: 40px;
    height: 40px
  }
  .sii-header__icon-btn-disc svg {
    width: 20px;
    height: 20px
  }
  .sii-header__icon-btn-label {
    display: none
  }
}

.sii-header__nav {
  background: #006eb7;
  margin-top: 0
}

.sii-header__nav .container {
  align-items: stretch;
  display: flex
}

.sii-header__nav-list {
  flex-wrap: wrap;
  gap: 0;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex
}

@media (max-width:991.98px) {
  .sii-header__nav-list {
    display: none
  }
}

.sii-header__nav-link {
  color: #fff;
  align-items: center;
  gap: .35rem;
  padding: .8rem 1rem;
  font-size: 1rem;
  font-weight: 600;
  text-decoration: none;
  transition: background .15s;
  display: inline-flex;
  position: relative
}

.sii-header__nav-link:hover, .sii-header__nav-link:focus-visible {
  color: #fff;
  background: #0000002e;
  text-decoration: none
}

.sii-header__nav-link[aria-current=page] span, .sii-header__nav-link.is-active span {
  text-underline-offset: 6px;
  text-decoration-thickness: 2px
}

.sii-header__nav-link[aria-current=page]:after, .sii-header__nav-link.is-active:after {
  content: "";
  background: #fff;
  border-radius: 2px 2px 0 0;
  height: 3px;
  position: absolute;
  bottom: 0;
  left: 1rem;
  right: 1rem
}

.sii-header__nav-chevron {
  flex: none;
  transition: transform .2s
}

.sii-header__nav-chevron.is-rotated {
  transform: rotate(180deg)
}

.sii-header__nav-item {
  display: inline-flex;
  position: relative
}

.sii-header__nav-toggle {
  cursor: pointer;
  font-family: inherit;
  background: 0 0;
  border: 0;
  font-weight: 600
}

.sii-header__dropdown {
  color: #111;
  z-index: 50;
  opacity: 0;
  visibility: hidden;
  background: #fff;
  border: 1px solid #e0e0e0;
  border-radius: 0 0 8px 8px;
  min-width: 260px;
  padding: .5rem 0;
  transition: opacity .15s, transform .15s, visibility .15s;
  position: absolute;
  top: 100%;
  left: 0;
  transform: translateY(-4px);
  box-shadow: 0 8px 24px #0000002e
}

.sii-header__dropdown.is-open {
  opacity: 1;
  visibility: visible;
  transform: translateY(0)
}

.sii-header__dropdown-list {
  margin: 0;
  padding: 0;
  list-style: none
}

.sii-header__dropdown-link {
  color: #111;
  border-left: 3px solid #0000;
  padding: .65rem 1.25rem;
  font-size: 1rem;
  font-weight: 500;
  text-decoration: none;
  transition: background .15s, border-color .15s, color .15s;
  display: block
}

.sii-header__dropdown-link:hover, .sii-header__dropdown-link:focus-visible {
  color: #006eb7;
  background: #eaf3fa;
  border-left-color: #006eb7;
  outline: 0;
  text-decoration: none
}

.sii-header__dropdown-link.is-active {
  color: #006eb7;
  background: #eaf3fa;
  border-left-color: #006eb7;
  font-weight: 700
}

.sii-header__burger {
  color: #fff;
  cursor: pointer;
  background: 0 0;
  border: 0;
  align-items: center;
  gap: .5rem;
  padding: .75rem 1rem;
  font-weight: 600;
  display: none
}

@media (max-width:991.98px) {
  .sii-header__nav {
    display: none
  }
}

.sii-menu-mobile {
  z-index: 1050;
  pointer-events: none;
  position: fixed;
  inset: 0
}

.sii-menu-mobile.is-open {
  pointer-events: auto
}

.sii-menu-mobile.is-open .sii-menu-mobile__overlay {
  opacity: 1
}

.sii-menu-mobile.is-open .sii-menu-mobile__panel {
  transform: translate(0)
}

.sii-menu-mobile.is-open .sii-menu-mobile__close {
  opacity: 1;
  pointer-events: auto;
  transform: translate(0)
}

.sii-menu-mobile__overlay {
  cursor: pointer;
  opacity: 0;
  appearance: none;
  background: #0a14238c;
  border: 0;
  padding: 0;
  transition: opacity .42s;
  position: absolute;
  inset: 0
}

.sii-menu-mobile__panel {
  background: #fff;
  flex-direction: column;
  width: min(85%, 360px);
  transition: transform .52s cubic-bezier(.22, .61, .36, 1);
  display: flex;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  overflow-y: auto;
  transform: translate(-100%)
}

.sii-menu-mobile__head {
  border-bottom: 1px solid #e3e7ee;
  align-items: flex-start;
  gap: .75rem;
  padding: 1rem 1rem 1.25rem;
  display: flex;
  position: relative
}

.sii-menu-mobile__brand {
  color: #006eb7;
  flex: 1;
  align-items: flex-start;
  gap: .65rem;
  min-width: 0;
  text-decoration: none;
  display: flex
}

.sii-menu-mobile__brand:hover {
  text-decoration: none
}

.sii-menu-mobile__close {
  color: #fff;
  cursor: pointer;
  opacity: 0;
  pointer-events: none;
  background: 0 0;
  border: 1.5px solid #ffffffd9;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  padding: 0;
  transition: opacity .36s .22s, transform .42s cubic-bezier(.22, .61, .36, 1) .22s, background-color .15s;
  display: inline-flex;
  position: absolute;
  top: .9rem;
  left: calc(min(85%, 360px) + .9rem);
  transform: translate(-8px)
}

.sii-menu-mobile__close:hover {
  background: #ffffff26
}

.sii-menu-mobile__close:focus-visible {
  outline-offset: 2px;
  outline: 2px solid #fff
}

.sii-menu-mobile__nav {
  flex: 1;
  padding-block: .5rem
}

.sii-menu-mobile__list {
  margin: 0;
  padding: 0;
  list-style: none
}

.sii-menu-mobile__item {
  border-left: 4px solid #0000;
  transition: border-color .15s, background-color .15s
}

.sii-menu-mobile__item.is-active {
  background: #f3f5f8;
  border-left-color: #006eb7
}

.sii-menu-mobile__link {
  color: #111;
  padding: .95rem 1.15rem;
  font-family: Titillium Web, -apple-system, BlinkMacSystemFont, Segoe UI, sans-serif;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.35;
  text-decoration: none;
  display: block
}

.sii-menu-mobile__link:hover {
  color: #006eb7;
  background: #f3f5f8;
  text-decoration: none
}

.sii-menu-mobile__link:focus-visible {
  outline-offset: -2px;
  outline: 2px solid #006eb7
}

.sii-menu-mobile__item.is-active .sii-menu-mobile__link, .sii-menu-mobile__item.is-active .sii-menu-mobile__toggle, .sii-menu-mobile__item.is-active .sii-menu-mobile__chevron {
  color: #006eb7
}

.sii-menu-mobile__toggle {
  text-align: left;
  cursor: pointer;
  color: #111;
  background: 0 0;
  border: 0;
  justify-content: space-between;
  align-items: center;
  gap: .75rem;
  width: 100%;
  font-family: inherit;
  font-size: 1rem;
  font-weight: 700;
  display: flex
}

.sii-menu-mobile__chevron {
  color: #111;
  flex-shrink: 0;
  transition: transform .2s
}

.sii-menu-mobile__chevron.is-rotated {
  transform: rotate(180deg)
}

.sii-menu-mobile__sublist {
  background: #fafbfc;
  border-top: 1px solid #e3e7ee;
  margin: 0;
  padding: 0 0 .5rem;
  list-style: none
}

.sii-menu-mobile__subitem {
  border-left: 4px solid #0000;
  transition: background-color .15s
}

.sii-menu-mobile__subitem.is-active {
  background: #eaf3fa;
  border-left-color: #0000
}

.sii-menu-mobile__subitem.is-active .sii-menu-mobile__sublink {
  color: #006eb7;
  font-weight: 700
}

.sii-menu-mobile__sublink {
  color: #111;
  padding: .65rem 1.15rem .65rem 2.25rem;
  font-family: Titillium Web, -apple-system, BlinkMacSystemFont, Segoe UI, sans-serif;
  font-size: .95rem;
  font-weight: 500;
  line-height: 1.35;
  text-decoration: none;
  display: block
}
.sii-menu-mobile__sublink-secondario {
    padding: .65rem .25rem .65rem .25rem;
}
.sii-menu-mobile__sublink:hover {
    color: #006eb7;
    background: #f3f5f8;
    text-decoration: none
}

.sii-menu-mobile__sublink:focus-visible {
  outline-offset: -2px;
  outline: 2px solid #006eb7
}

.sii-menu-mobile__footer {
  border-top: 1px solid #e3e7ee;
  padding: 1.25rem 1.15rem 1.5rem
}

@media (min-width:992px) {
  .sii-menu-mobile {
    display: none
  }
}

.sii-footer-cta {
  color: #fff;
  background: #006eb7;
  padding-block: 1.5rem
}

.sii-footer-cta__inner {
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 1.5rem;
  display: grid
}

@media (max-width:767.98px) {
  .sii-footer-cta__inner {
    text-align: left;
    grid-template-columns: 1fr;
    justify-items: start;
    gap: 1rem
  }
}

.sii-footer-cta__title {
  color: #fff;
  margin: 0 0 .25rem;
  font-size: 1.4rem;
  font-weight: 700
}

.sii-footer-cta__lead {
  color: #ffffffe6;
  margin: 0;
  font-size: .95rem
}

.sii-back-to-top {
  color: #fff;
  cursor: pointer;
  opacity: 0;
  pointer-events: none;
  z-index: 90;
  background: #006eb7;
  border: 0;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 48px;
  height: 48px;
  transition: opacity .2s, transform .2s, background .15s;
  display: inline-flex;
  position: fixed;
  bottom: 1.5rem;
  right: 1.5rem;
  transform: translateY(12px);
  box-shadow: 0 8px 22px #006eb759
}

.sii-back-to-top.is-visible {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0)
}

.sii-back-to-top:hover {
  color: #fff;
  background: #034876;
  transform: translateY(-2px)
}

.sii-back-to-top:focus-visible {
  outline-offset: 2px;
  outline: 3px solid #fff;
  box-shadow: 0 0 0 5px #006eb7
}

.sii-footer {
  color: #ffffffeb;
  background: #034876;
  padding-block: 0
}

.sii-footer__main {
  padding-block: 2.5rem 0
}

.sii-footer__brand {
  margin-bottom: 1.5rem
}

.sii-footer__grid {
  margin-bottom: 2rem
}

@media (max-width:991.98px) {
  .sii-footer__col {
    margin-bottom: 2rem
  }
}

.sii-footer__col-title {
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #fff;
  margin-bottom: 1rem;
  font-size: .92rem;
  font-weight: 700
}

.sii-footer__contacts {
  font-size: .9rem;
  font-style: normal;
}

.sii-footer__contacts a {
  color: #fff;
  text-decoration: none
}

.sii-footer__contacts a:hover {
  color: #fff;
  text-decoration: underline
}

.sii-footer__list {
  margin: 0;
  padding: 0;
  list-style: none
}

    .sii-footer__list li {
        margin-bottom: .5rem;
        line-height: 1;
    }

.sii-footer__list a {
  color: #ffffffeb;
  font-size: .9rem;
  text-decoration: none
}

.sii-footer__list a:hover {
  color: #fff;
  text-decoration: underline
}

.sii-footer__prints {
  background: #012e4b;
  margin-top: 1.5rem;
  padding: .65rem 0
}

.sii-footer__prints ul {
  flex-flow: wrap;
  gap: .4rem 1.75rem;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex
}

.sii-footer__prints ul a {
  color: #fff;
  text-underline-offset: 3px;
  font-size: .7rem;
  text-decoration: underline;
  text-decoration-thickness: 1px
}

.sii-footer__prints ul a:hover {
  color: #fff;
  opacity: .85
}

@media (max-width:991.98px) {
  .sii-footer__prints {
    padding: 1rem 0
  }
  .sii-footer__prints ul {
    flex-direction: column;
    gap: .5rem
  }
  .sii-footer__prints ul a {
    font-size: .88rem
  }
}

/* ============================================================
 * SII overrides / estensioni (non presenti in ideare)
 * ============================================================ */

/* topbar: link MYSII con etichetta accanto al disco */
.sii-header__slim-icon {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #fff;
  text-decoration: none;
}

.sii-header__slim-icon-label {
    font-size: 0.7rem;
    letter-spacing: 0.02em;
    color: #fff;
}

/* footer CTA: canali assistenza (label piccola + icona + valore bold) */
.sii-footer-cta__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  flex-wrap: wrap;
}

.sii-footer-cta__channels {
  display: flex;
  align-items: center;
  gap: 48px;
  flex-wrap: wrap;
}

.sii-footer-cta__channel {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.sii-footer-cta__channel-label {
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #ffffffd9;
}

.sii-footer-cta__channel-value {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 1.25rem;
  font-weight: 700;
}

.sii-footer-cta__channel-value a {
  color: #fff;
  text-decoration: none;
}

.sii-footer-cta__channel-value a:hover {
  text-decoration: underline;
}

.sii-footer-cta__channel-icon {
  width: 28px;
  height: 28px;
  object-fit: contain;
  overflow: hidden;
  flex: 0 0 28px;
}

/* footer main: divider fra i gruppi di colonne (l'ultimo gruppo = dati societari) */
.sii-footer__grid-group:last-child {
  border-top: 1px solid #ffffff80;
  margin-top: 40px;
  padding-top: 30px;
}

@media (max-width: 992px) {
  .sii-footer__grid-group:last-child {
    border-top: none;
    margin-top: 0;
    padding-top: 0;
  }
}

/* menu mobile: menu secondario nel footer del pannello */
.sii-menu-mobile__secondary {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

/* topbar: gruppo link istituzionali a sinistra, sottolineati come da mockup */
.sii-header__slim-links {
  display: flex;
  align-items: center;
  gap: 28px;
}

.sii-header__slim-links .sii-header__region {
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* ============================================================
 * Componenti pagina (page-hero, toolbar, project-card, results)
 * ereditati da ideare app.css
 * ============================================================ */


.sii-project-card {
  background: #fff;
  border: 1px solid #e0e0e0;
  border-radius: 8px;
  flex-direction: column;
  width: 100%;
  height: 100%;
  transition: box-shadow .25s cubic-bezier(.4, 0, .2, 1);
  display: flex;
  overflow: hidden
}

.sii-project-card:hover {
  box-shadow: 0 4px 12px #11111114
}

.sii-project-card__body {
  flex-direction: column;
  flex: 1;
  gap: .5rem;
  padding: 1.25rem 1.25rem 1.5rem;
  display: flex
}

.sii-project-card__title {
  margin: 0;
  font-family: Titillium Web, -apple-system, BlinkMacSystemFont, Segoe UI, sans-serif;
  font-size: 1.2rem;
  font-weight: 700;
  line-height: 1.3
}

.sii-project-card__title a {
  color: #006eb7;
  text-decoration: none
}

.sii-project-card__title a:hover, .sii-project-card__title a:focus-visible {
  text-decoration: underline
}

.sii-project-card__text {
  color: #555;
  flex: 1;
  margin: 0;
  font-size: .92rem;
  line-height: 1.5
}

.sii-results-section__container, .sii-toolbar__container, .sii-page-hero__container {
  max-width: 1320px;
  margin: 0 auto;
  padding-inline: 1.5rem
}

.sii-page-hero {
  color: #fff;
  background: #006eb7;
  padding-block: 2rem 4rem
}

@media (max-width:767.98px) {
  .sii-page-hero {
    padding-block: 1.25rem 1.5rem
  }
}

.sii-page-hero__body {
  grid-template-columns: 1fr;
  align-items: center;
  gap: 2rem;
  display: grid
}

@media (min-width:992px) {
  .sii-page-hero__body {
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr)
  }
}

@media (max-width:767.98px) {
  .sii-page-hero__body {
    gap: 0
  }
}

.sii-page-hero__lead strong {
  color: inherit;
  font-weight: 700
}

.sii-page-hero__actions {
  flex-wrap: wrap;
  gap: .75rem;
  margin-top: 1.25rem;
  display: inline-flex
}

/* il bottone e' un .btn.btn-primary di Bootstrap Italia: nessun override di
   colore, raggio o dimensione, cosi' e' identico ai bottoni primari del resto
   del portale su tutte le pagine che usano l'hero */
.sii-page-hero__actions a {
  text-decoration: none
}

/* eventuale secondo bottone: variante in outline sul fondo scuro */
.sii-page-hero__actions a+a {
  color: #fff;
  background: 0 0;
  border: 1px solid #fff
}

.sii-toolbar {
  background: #f8f8f8;
  padding-block: 2.5rem 2.5rem
}

.sii-toolbar__container {
  flex-direction: column;
  gap: 1.25rem;
  display: flex
}

.sii-toolbar__heading {
  color: #5a6d80;
  margin: 0;
  font-size: clamp(1.75rem, 1.3rem + 1.2vw, 2.25rem);
  font-weight: 700
}

.sii-toolbar__searchbar {
  flex-wrap: wrap;
  align-items: stretch;
  gap: 1rem;
  display: flex
}

.sii-toolbar .sii-toolbar__input {
  min-width: 240px;
  height: 48px;
  box-shadow: none;
  background-color: #fff;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23111111' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><circle cx='11' cy='11' r='7'/><line x1='21' y1='21' x2='16.65' y2='16.65'/></svg>");
  background-position: 1rem;
  background-repeat: no-repeat;
  background-size: 20px 20px;
  border: 1px solid #e0e0e0;
  border-right: 0;
  border-radius: 8px 0 0 8px;
  flex: 600px;
  padding: 0 1rem 0 3rem;
  font-family: inherit;
  font-size: 1rem;
  line-height: 1.2;
  transition: none
}

.sii-toolbar .sii-toolbar__input:focus {
  outline-offset: 1px;
  z-index: 1;
  border-color: #006eb7;
  outline: 2px solid #006eb7
}

.sii-toolbar__submit {
  color: #fff;
  cursor: pointer;
  background: #006eb7;
  border: 0;
  border-radius: 0 8px 8px 0;
  height: 48px;
  margin-left: -1rem;
  padding: 0 2.5rem;
  font-size: 1rem;
  font-weight: 600;
  transition: background .25s cubic-bezier(.4, 0, .2, 1)
}

.sii-toolbar__submit:hover {
  background: #034876
}

.sii-toolbar__toggle {
  color: #006eb7;
  cursor: pointer;
  background: 0 0;
  border: 1px solid #006eb7;
  border-radius: 8px;
  flex: none;
  align-items: center;
  gap: .625rem;
  height: 48px;
  padding: 0 1.5rem;
  font-size: 1rem;
  font-weight: 600;
  display: inline-flex
}

.sii-toolbar__toggle:hover {
  background: #eaf3fa
}

.sii-toolbar__toggle-icon {
  justify-content: center;
  align-items: center;
  width: 1rem;
  padding-bottom: 3px;
  font-size: 1.5rem;
  font-weight: 400;
  line-height: 1;
  display: inline-flex
}

.sii-toolbar__toggle-stack {
  grid-template-columns: 1fr;
  display: inline-grid
}

.sii-toolbar__toggle-label, .sii-toolbar__toggle-placeholder {
  white-space: nowrap;
  grid-area: 1/1
}

.sii-toolbar__toggle-placeholder {
  visibility: hidden;
  pointer-events: none
}

.sii-toolbar__filters-panel {
  background: #e5edf3;
  border-radius: 8px;
  flex-direction: column;
  gap: 1.5rem;
  padding: 1.75rem 1.5rem 2rem;
  display: flex
}

.sii-toolbar__filters {
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 1rem;
  display: grid
}

.sii-toolbar__filters label {
  color: #5a6d80;
  flex-direction: column;
  gap: .375rem;
  font-size: .875rem;
  display: flex
}

.sii-toolbar__filters select, .sii-toolbar__filters input[type=text], .sii-toolbar__filters input[type=search] {
  color: #2a3a4d;
  background: #fff;
  border: 1px solid #c8ced4;
  border-radius: 8px;
  height: 48px;
  padding: 0 .75rem;
  font-family: inherit;
  font-size: 1rem
}

.sii-toolbar__filters select {
  appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235a6d80' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
  background-position: right 1rem center;
  background-repeat: no-repeat;
  background-size: 16px 16px;
  padding-right: 2.75rem
}

.sii-toolbar__filter-actions {
  flex-wrap: wrap;
  gap: .75rem;
  display: flex
}

.sii-toolbar__filter-actions button {
  cursor: pointer;
  border-radius: 8px;
  height: 48px;
  padding: 0 1.75rem;
  font-weight: 600;
  transition: background .25s cubic-bezier(.4, 0, .2, 1)
}

.sii-toolbar__filter-actions .sii-toolbar__submit {
  color: #fff;
  background: #006eb7;
  border: 0;
  border-radius: 8px;
  margin-left: 0
}

.sii-toolbar__filter-actions .sii-toolbar__submit:hover {
  background: #034876
}

.sii-toolbar__filter-actions .sii-toolbar__cancel {
  color: #6c757d;
  cursor: pointer;
  background: #e6e6e6;
  border: 0;
  border-radius: 8px;
  height: 48px;
  padding: 0 1.75rem;
  font-weight: 600
}

.sii-toolbar__filter-actions .sii-toolbar__cancel:hover {
  color: #444;
  background: #d8d8d8
}

.sii-toolbar__count {
  color: #5a6d80;
  font-size: 1rem;
  font-weight: 400
}

.sii-toolbar__count strong, .sii-toolbar__count b {
  font-size: 1.125rem;
  font-weight: 700
}

@media (max-width:991.98px) {
  .sii-toolbar .sii-toolbar__searchbar {
    flex-wrap: wrap;
    gap: .75rem
  }
  .sii-toolbar .sii-toolbar__input {
    flex: 1 1 0;
    min-width: 0
  }
  .sii-toolbar .sii-toolbar__submit {
    flex: none;
    padding: 0 1.25rem
  }
  .sii-toolbar .sii-toolbar__toggle {
    flex: 1 0 100%;
    justify-content: center
  }
}

.sii-results-section {
  background: #fff;
  padding-block: 2.5rem 3.5rem
}

.sii-results-section__grid {
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 1.5rem;
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid
}

.sii-results-section__grid--three {
  grid-template-columns: 1fr
}

@media (min-width:640px) {
  .sii-results-section__grid--three {
    grid-template-columns: repeat(2, minmax(0, 1fr))
  }
}

@media (min-width:992px) {
  .sii-results-section__grid--three {
    grid-template-columns: repeat(3, minmax(0, 1fr))
  }
}

.sii-project-card {
  border: 1px solid #e0e0e0;
  border-radius: 8px;
  transition: box-shadow .25s cubic-bezier(.4, 0, .2, 1), transform .25s cubic-bezier(.4, 0, .2, 1);
  overflow: hidden
}

.sii-project-card:hover, .sii-project-card:focus-within {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px #11111114
}

.sii-project-card .card-title {
  color: #006eb7;
  font-weight: 700
}

.sii-project-card__title {
  margin-bottom: .75rem;
  font-size: 1.375rem;
  line-height: 1.25
}

.sii-project-card .card-body {
  padding: 1.5rem
}

.sii-project-card .card-text {
  color: #111;
  margin-bottom: 1rem
}

section.sii-page-hero h1.sii-page-hero__title, section.sii-page-hero .sii-page-hero__title {
  color: #fff !important
}

section.sii-page-hero .sii-page-hero__lead {
  opacity: .95;
  color: #fff !important
}

.sii-project-card .card-title {
  color: #006eb7 !important
}

.sii-page-hero__actions a, .sii-page-hero__actions a+a, .sii-toolbar__submit {
  box-sizing: border-box;
  justify-content: center;
  align-items: center;
  padding-top: 0;
  padding-bottom: 0;
  line-height: 1.2;
  display: inline-flex
}

/* select custom (initStyledSelects) ereditate da ideare */


.sii-styled-select {
  width: 100%;
  display: inline-flex;
  position: relative
}

.sii-styled-select__native {
  opacity: 0;
  pointer-events: none;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
  border: 0 !important;
  min-width: 0 !important;
  padding: 0 !important
}

.sii-styled-select__trigger {
  text-align: left;
  color: #2a3a4d;
  cursor: pointer;
  background: #fff;
  border: 1px solid #c8ced4;
  border-radius: 8px;
  justify-content: space-between;
  align-items: center;
  gap: .5rem;
  width: 100%;
  height: 48px;
  padding: 0 2.75rem 0 .75rem;
  font-family: inherit;
  font-size: 1rem;
  display: inline-flex
}

.sii-styled-select__trigger:focus-visible {
  outline-offset: 2px;
  outline: 2px solid #006eb7
}

.sii-styled-select__label {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden
}

.sii-styled-select__chevron {
  color: #5a6d80;
  pointer-events: none;
  transition: transform .2s;
  display: inline-flex;
  position: absolute;
  top: 50%;
  right: 1rem;
  transform: translateY(-50%)
}

.sii-styled-select.is-open .sii-styled-select__chevron {
  transform: translateY(-50%)rotate(180deg)
}

.sii-styled-select__menu {
  z-index: 100;
  background: #fff;
  border: 1px solid #c8ced4;
  border-radius: 8px;
  width: 100%;
  max-height: 280px;
  margin: 0;
  padding: .25rem 0;
  list-style: none;
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  overflow-y: auto;
  box-shadow: 0 8px 20px #00000014
}

.sii-styled-select__menu[hidden] {
  display: none
}

.sii-styled-select__option {
  cursor: pointer;
  color: #2a3a4d;
  padding: .625rem .875rem;
  font-size: 1rem;
  line-height: 1.4
}

.sii-styled-select__option:hover {
  background: #eaf3fa
}

.sii-styled-select__option[aria-selected=true] {
  color: #006eb7;
  background: #eaf3fa;
  font-weight: 600
}

/* ============================================================
 * Hero standard di pagina (_pageHero.cshtml): struttura unica
 * ============================================================ */
.sii-page-hero .sii-page-hero__body {
  display: block;
}

.sii-page-hero__focus {
  background: #1a7dbe;
  border-left: 4px solid #fff;
  color: #fff;
  font-style: italic;
  padding: 28px 32px;
  margin-top: 28px;
}

.sii-page-hero__focus p {
  margin-bottom: 12px;
}

.sii-page-hero__focus ul {
  margin: 0;
  padding-left: 20px;
  list-style: disc;
}

.sii-page-hero__focus li {
  margin-bottom: 10px;
}

/* ============================================================
 * Blocco numeri (sii-chisiamo-numeri) + eyebrow, da ideare
 * ============================================================ */


.sii-section__eyebrow {
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #006eb7;
  margin: 0 0 .5rem;
  font-family: Titillium Web, -apple-system, BlinkMacSystemFont, Segoe UI, sans-serif;
  font-size: .875rem;
  font-weight: 700
}

.sii-chisiamo-numeri {
  background: #f4f5f6;
  padding: 4rem 0
}

@media (max-width:991.98px) {
  .sii-chisiamo-numeri {
    padding: 2rem 0
  }
}

.sii-chisiamo-numeri__title {
  color: #454545;
  margin: 0 0 .75rem;
  font-family: Titillium Web, -apple-system, BlinkMacSystemFont, Segoe UI, sans-serif;
  font-size: clamp(1.5rem, 1.2rem + 1.4vw, 2.25rem);
  font-weight: 700;
  line-height: 1.15
}

.sii-chisiamo-numeri__grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.5rem;
  margin: 0;
  display: grid
}

@media (max-width:767.98px) {
  .sii-chisiamo-numeri__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr))
  }
}

.sii-chisiamo-numeri__cell {
  background: 0 0;
  border-left: 8px solid #006eb7;
  border-radius: 0;
  padding: .25rem 0 .25rem 1.5rem
}

.sii-chisiamo-numeri__value {
  color: #006eb7;
  margin: 0 0 .4rem;
  font-family: Titillium Web, -apple-system, BlinkMacSystemFont, Segoe UI, sans-serif;
  font-size: clamp(1.75rem, 1.4rem + 1.2vw, 2.5rem);
  font-weight: 700;
  line-height: 1.1
}

.sii-chisiamo-numeri__label {
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #111;
  margin: 0;
  font-family: Titillium Web, -apple-system, BlinkMacSystemFont, Segoe UI, sans-serif;
  font-size: .75rem;
  font-weight: 700;
  line-height: 1.35
}

/* hero scura per le pagine del menu "La Società" (mockup Il Gestore) */
.sii-page-hero--dark {
  background: #034876;
}

/* hero con immagine a destra a piena altezza (_pageHero ImageUrl) */
.sii-page-hero {
  position: relative;
  overflow: hidden;
}

.sii-page-hero__media {
  position: absolute;
  top: 0;
  /* allineata al bordo interno del container (max-width 1320px centrato, padding 1.5rem) */
  right: max(1.5rem, calc((100% - 1320px) / 2 + 1.5rem));
  bottom: 0;
}

.sii-page-hero__media img {
  height: 100%;
  max-height: 100%;
  width: auto;
  display: block;
}

.sii-page-hero--with-media .sii-page-hero__container {
  position: relative;
  z-index: 1;
}

@media (min-width: 992px) {
  .sii-page-hero--with-media .sii-page-hero__text, .sii-page-hero--with-media .sii-page-hero__focus {
    max-width: 58%;
  }
}

@media (max-width: 991.98px) {
  .sii-page-hero__media {
    display: none;
  }
}

/* ===========================================================================
   BOTTONI — tutti i .btn con la STESSA altezza in tutto il sito.
   Altezza fissa + centratura flex del contenuto (icone/testo verticalmente
   centrati). I bottoni full-width restano a tutta larghezza (display:flex).
   =========================================================================== */
.btn {
  box-sizing: border-box;
  min-height: 48px !important;
  height: 48px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.btn.w-100,
.btn.d-block,
.btn.btn-block,
.btn.d-flex {
  display: flex;
}

/* ===========================================================================
   FORM — altezza campi uniforme + floating label animata (GLOBALE, tutti i form)
   input / select / textarea hanno la stessa altezza ovunque nel sito.
   =========================================================================== */

/* 1) Campi più alti e alla STESSA altezza: input e select
   (esclude la barra di ricerca autocomplete/search delle liste, che ha un suo
   stile e altrimenti "sbuzza" fuori dall'input-group col bottone) */
.form-group .form-control:not(.autocomplete):not([type="search"]),
.form-group input.form-control:not(.autocomplete):not([type="search"]),
.select-wrapper select {
  min-height: 3.25rem;
  padding: 0rem 1.5rem 0rem 1rem;
  line-height: 1.5;
}

/* rimuove l'height:2.5rem fisso di BS Italia sul select */
.select-wrapper select {
  height: auto;
}

.select-wrapper select option {
  font-size: 1rem;
}

/* Pagina candidatura: il primo blocco (ambito) ha sfondo azzurrino chiaro come da mockup */
.card.has-bkg-grey.sii-card-ambito {
  background: #F3F8FB !important;
}

/* textarea: stessa larghezza/padding, ma più alta di default */
textarea.form-control,
.form-group textarea {
  min-height: 6rem;
  height: auto;
  padding: 0.75rem 1rem;
  line-height: 1.5;
}

/* neutralizza il margin-top (classe mt-4 nel markup) che spingeva giù l'input
   e impediva alla label di centrarsi come placeholder */
.form-group .form-control.mt-4 {
  margin-top: 0 !important;
}

/* aria tra i campi: nel markup i .form-group hanno mb-0, quindi lo spazio va
   messo sul gruppo stesso (in alto), così resta room per la label flottata
   senza appiccicarsi al campo precedente e senza rompere il centraggio. */
.form-group {
  margin-top: 2.5rem;
}

/* 2) Floating label: a riposo fa da placeholder centrato nel campo,
      al focus (click) o a campo compilato (.active) sale sopra il bordo.
      Esclude .select-wrapper: la sua label ha un comportamento proprio in BS Italia. */
.form-group:not(.select-wrapper) label {
  top: 0;
  line-height: 3.25rem;      /* centra la label nell'altezza del campo */
  padding: 0 1rem;
  transition: 0.2s ease-out;
}

.form-group:not(.select-wrapper):has(.form-control:focus) label,
.form-group:not(.select-wrapper) label.active {
  transform: translateY(-1.35rem);
  padding: 0;
  font-size: 0.875rem;
  font-weight: 600;
  color: hsl(0, 0%, 10%);
}


    .form-group:has(.form-control:not(:placeholder-shown)) .cmp-input__label,
    .form-group:has(.form-control:focus) .cmp-input__label {
        top: -1.6rem;
        font-size: 0.875rem;
        /*line-height: 1.5rem;*/
        line-height: 3.25rem;
        background-color: transparent;
    }

/* ---------------------------------------------------------------------------
   Barra di ricerca Amministrazione Trasparente
   (TplDocumentiATNew / tplListaAtNew / TplCDA — classe .sii-at-search)
   Veste allineata ai form del sito (floating label + bottone primario) e, cosa
   più importante, la label resta FLOTTATA a campo compilato anche dopo la
   perdita del focus: si aggancia a :not(:placeholder-shown) (l'input ha
   placeholder=" "), quindi non dipende dalla classe .active del JS di BS Italia.
   --------------------------------------------------------------------------- */
.sii-at-search__panel {
  /*background: #F3F8FB;*/                 /* stesso azzurrino dei form del sito */
  /*border-bottom: 1px solid #d9e3ea;*/
}
    .sii-at-search__panel .form-control {
        border: 1px solid #BFBFBF;
    }
.sii-at-search .form-group:not(.select-wrapper):has(.form-control:not(:placeholder-shown)) label {
  transform: translateY(-2.55rem);
  padding: 0;
  font-size: 0.875rem;
  font-weight: 600;
  color: hsl(0, 0%, 10%);
}

/* bottone "Ricerca": stessa altezza del campo, full-width su mobile */
.sii-at-search__btn {
  min-height: 3.25rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  width: 100%;
}

@media (min-width: 992px) {
  .sii-at-search__btn {
    width: auto;
  }
}

/* ===========================================================================
   FOCUS — nasconde l'evidenziazione (anello/outline/box-shadow) quando l'elemento
   riceve il focus da MOUSE/click (:focus:not(:focus-visible)), MANTENENDOLA per la
   navigazione da TASTIERA (:focus-visible) — accessibilità WCAG 2.4.7.
   Sovrascrive lo stile di focus di Bootstrap Italia.
   =========================================================================== */
a:focus:not(:focus-visible),
p a:focus:not(:focus-visible),
button:focus:not(:focus-visible),
.btn:focus:not(:focus-visible),
input:focus:not(:focus-visible),
select:focus:not(:focus-visible),
textarea:focus:not(:focus-visible),
.form-control:focus:not(:focus-visible),
.select-wrapper select:focus:not(:focus-visible),
.form-check input:focus:not(:focus-visible),
[tabindex]:focus:not(:focus-visible),
summary:focus:not(:focus-visible) {
  outline: none !important;
  box-shadow: none !important;
}

/* campi form: quando il focus è da mouse, il bordo torna al colore di riposo
   (hsl(210,17%,44%)) invece del nero di BS Italia */
input:focus:not(:focus-visible),
select:focus:not(:focus-visible),
textarea:focus:not(:focus-visible),
.form-control:focus:not(:focus-visible),
.select-wrapper select:focus:not(:focus-visible),
.form-check input:focus:not(:focus-visible) {
  border-color: hsl(210, 17%, 44%) !important;
}

/* link testuali: rimuove lo sfondo bianco al focus da mouse (non tocca i .btn) */
p a:focus:not(:focus-visible):not(.btn),
a:focus:not(:focus-visible):not(.btn) {
  background-color: transparent !important;
}

/* Fallback JS-driven: quando l'ultima interazione è il mouse/touch, la classe
   `using-mouse` (impostata da sii-interactions.js) nasconde il focus su TUTTI gli
   elementi, campi di testo compresi (che i browser trattano sempre come
   :focus-visible al click). Da tastiera la classe viene rimossa e il focus torna. */
html.using-mouse :focus {
  outline: none !important;
  box-shadow: none !important;
}

html.using-mouse input:focus,
html.using-mouse select:focus,
html.using-mouse textarea:focus,
html.using-mouse .form-control:focus,
html.using-mouse .select-wrapper select:focus,
html.using-mouse .form-check input:focus {
  border-color: hsl(210, 17%, 44%) !important;
}

html.using-mouse a:focus:not(.btn),
html.using-mouse p a:focus:not(.btn) {
  background-color: transparent !important;
}

/* checkbox/radio: in BS Italia l'anello di focus è disegnato sulla LABEL
   adiacente (e sul suo ::before), non sull'input. Va azzerato lì. */
.form-check [type="checkbox"]:focus:not(:focus-visible) + label,
.form-check [type="radio"]:focus:not(:focus-visible) + label,
.form-check [type="checkbox"]:focus:not(:focus-visible) + label::before,
.form-check [type="radio"]:focus:not(:focus-visible) + label::before,
html.using-mouse .form-check [type="checkbox"]:focus + label,
html.using-mouse .form-check [type="radio"]:focus + label,
html.using-mouse .form-check [type="checkbox"]:focus + label::before,
html.using-mouse .form-check [type="radio"]:focus + label::before {
  outline: none !important;
  box-shadow: none !important;
}


/* ============================================================
   Tabella + export Societa' Trasparente (_tabellatrasparenza.cshtml)
   Nessun testo sotto 16px (1rem): requisito di leggibilita' delle due pagine AT.
   ============================================================ */

.sii-tab-trasp {
    margin: 0 0 2rem;
    font-size: 1rem;
}

/* Elenco bandi: il titolo sta subito sopra la barra strumenti, senza testo di
   introduzione in mezzo, quindi la sezione va staccata dall'h1. */
.sii-tab-trasp--staccata {
    margin-top: 32px;
}

/* barra strumenti estratta sopra la tabella: ricerca a mezza pagina, reset, export */
.sii-tab-trasp__barra {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px;
    margin-bottom: 28px;
}

.sii-tab-trasp__ricerca {
    flex: 0 1 50%;
    min-width: 280px;
}

    .sii-tab-trasp__ricerca .input-group {
        margin-bottom: 0;
    }

    /* Senza input-group-append la scatola va richiusa a destra. Serve pari
       specificita' (4 classi) e !important per battere stylenew.css, che su
       .trasparenza .form-group .searchtrasparenza.form-control impone
       "border-radius: 6px 0 0 6px !important" pensando al bottone accanto. */
    .sii-tab-trasp__ricerca .form-group .searchtrasparenza.form-control {
        border-radius: 6px !important;
        /* Senza il bottone dentro l'input-group, che lo stirava, il campo collassava
           a 29px per il "min-height: 10px !important" di stylenew.css: lo riportiamo
           alla stessa altezza dei bottoni della barra (48px). */
        min-height: 48px !important;
        height: 48px !important;
        /* spazio a destra per la X di cancellazione, cosi' il testo non le finisce sotto */
        padding-right: 48px !important;
    }

    /* La X di cancellazione (button.clean-input, creata dal JS del sito quando si
       digita) si vedeva minuscola: il glifo it-close occupa circa il 37% del suo
       viewBox, quindi in un'icona da 25px la X disegnata era di 9px. La portiamo a
       40px - X visibile di circa 15px - e la centriamo in verticale.
       Vale per tutti i campi di ricerca della trasparenza, non solo per la barra
       della tabella: la ricerca in Amministrazione Trasparente monta lo stesso
       fieldset .sii-at-search e prima si ritrovava la X minuscola di serie. */
    .sii-at-search .clean-input {
        position: absolute !important;
        left: auto !important;
        top: 50% !important;
        bottom: auto !important;
        transform: translateY(-50%);
        display: flex;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
        padding: 0;
        border: 0;
        background: none;
        cursor: pointer;
        /* l'input dell'input-group ha position:relative e z-index:5, quindi con
           z-index automatico il bottone finiva coperto dal fondo bianco del campo */
        z-index: 6;
    }

        .sii-at-search .clean-input .icon {
            width: 40px;
            height: 40px;
            fill: #435a70;
        }

        .sii-at-search .clean-input:hover .icon,
        .sii-at-search .clean-input:focus .icon {
            fill: #06c;
        }

    /* Nella barra della tabella l'input-group non ha il bottone "Cerca", quindi la X
       va al bordo destro del campo. Dove il bottone c'e' l'offset non e' esprimibile
       in css - dipende dalla larghezza resa dell'append - e lo calcola
       sii-trasparenza.js con uno stile inline. */
    .sii-tab-trasp__ricerca .clean-input {
        right: 6px !important;
    }

    /* Spazio a destra per la X anche nella ricerca AT, cosi' il testo non le finisce
       sotto. Serve piu' specificita' di stylenew.css, che impone il padding su
       .trasparenza .form-group .searchtrasparenza.form-control. */
    .trasparenza .sii-at-search .form-group .searchtrasparenza.form-control {
        padding-right: 48px !important;
    }

.sii-tab-trasp__reset {
    flex: 0 0 auto;
}

/* flex-wrap non cambia nulla dove etichetta e bottoni stanno in riga; sotto i 340px
   non ci stavano e il blocco sfondava il contenitore di 47px, portandosi dietro lo
   scroll orizzontale della pagina */
.sii-tab-trasp__export {
    flex: 1 1 auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    min-width: 0;
}

.sii-tab-trasp__export-label {
    font-size: 1rem;
    font-weight: 600;
    color: #435a70;
    white-space: nowrap;
}

.sii-tab-trasp__export-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    list-style: none;
    margin: 0;
    padding: 0;
}

/* la tabella, distaccata dalla barra */
/*.sii-tab-trasp__wrap {
    border-top: 1px solid #dfe4f2;
    padding-top: 4px;
}*/

/* Dentro #annresult - il bersaglio degli aggiornamenti ajax - alla tabella possono
   seguire altri blocchi redazionali (negli uffici il link all'organigramma): stando
   nella stessa card ombreggiata erano attaccati all'ultima riga e si leggevano come
   una riga in piu'. Fuori da #annresult non serve: paginazione e "nessun risultato"
   hanno il proprio margine, e sommarli lascerebbe un buco doppio. */
#annresult .sii-tab-trasp__wrap:has(+ *) {
    margin-bottom: 24px;
}

.sii-tab-trasp__table {
    margin-bottom: 0;
    font-size: 1rem;
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15) !important;
}

/* .table-responsive scorre su entrambi gli assi e ritaglia al proprio bordo:
   l'ombra della tabella, disegnata fuori da quel bordo, non si vedeva. La
   ripetiamo sulla scatola esterna, che ha la stessa forma e non e' ritagliata
   (quella sulla tabella resta per le tabelle non avvolte dal contenitore). */
.table-responsive:has(> .sii-tab-trasp__table) {
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15) !important;
}

    .sii-tab-trasp__table th,
    .sii-tab-trasp__table td {
        vertical-align: top;
        font-size: 1rem;
    }

    /* i nomi di colonna vanno a capo: un'etichetta lunga non deve allargare la colonna */
    .sii-tab-trasp__table thead th {
        white-space: normal;
        overflow-wrap: break-word;
        max-width: 14em;
        border-bottom: 2px solid #06c;
        background: #f5f7fa;
        vertical-align: bottom;
    }

/* Zebra pilotata dal javascript sulle righe VISIBILI: con filtri, ordinamento e
   paginazione un :nth-child conterebbe anche le righe nascoste. La prima riga
   resta bianca, cosi' stacca dall'intestazione. */
.sii-tab-trasp__table > tbody > tr {
    background-color: #fff;
}

    .sii-tab-trasp__table > tbody > tr.is-alternata {
        background-color: #f5f7fa;
    }

/* intestazione ordinabile: bottone che non sembra un bottone */
.sii-tab-trasp__sort {
    display: inline-flex;
    align-items: flex-start;
    gap: 6px;
    padding: 0;
    border: 0;
    background: none;
    font: inherit;
    font-size: 1rem;
    text-align: left;
    color: inherit;
    cursor: pointer;
}

    .sii-tab-trasp__sort:hover span,
    .sii-tab-trasp__sort:focus span {
        text-decoration: underline;
    }

.sii-tab-trasp__sort-ico {
    flex: 0 0 auto;
    margin-top: 2px;
    opacity: 0.45;
}

.sii-tab-trasp__sort[data-ordine] .sii-tab-trasp__sort-ico {
    opacity: 1;
}

.sii-tab-trasp__sort[data-ordine="asc"] .sii-tab-trasp__sort-ico path:last-child,
.sii-tab-trasp__sort[data-ordine="desc"] .sii-tab-trasp__sort-ico path:first-child {
    opacity: 0.25;
}

.sii-tab-trasp__vuoto {
    margin: 16px 0 0;
    font-size: 1rem;
    font-style: italic;
}

/* paginazione fuori dalla tabella, centrata */
.sii-tab-trasp__pager {
    margin-top: 24px;
}

.sii-tab-trasp__pager-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 4px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.sii-tab-trasp__pager-btn {
    min-width: 44px;
    padding: 6px 12px;
    border: 1px solid #b1b1b3;
    border-radius: 4px;
    background: #fff;
    font-size: 1rem;
    color: #06c;
    cursor: pointer;
}

    .sii-tab-trasp__pager-btn:disabled {
        color: #77787b;
        cursor: default;
    }

    .sii-tab-trasp__pager-btn.is-active {
        background: #06c;
        border-color: #06c;
        color: #fff;
        font-weight: 700;
    }

/* puntini di omissione quando le pagine sono piu' dei sei numeri mostrati */
.sii-tab-trasp__pager-sep {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 24px;
    padding: 6px 0;
    font-size: 1rem;
    color: #435a70;
}

/* date di pubblicazione e ultimo aggiornamento (partial _datesezione) */
.sii-date-sezione {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 32px;
    margin: 0;
    font-size: 1rem;
}

    .sii-date-sezione > div {
        display: flex;
        gap: 8px;
    }

    .sii-date-sezione dt {
        font-weight: 700;
    }

    .sii-date-sezione dd {
        margin: 0;
    }

/* Le due pagine AT rese in forma tabellare non devono avere testo sotto 1rem,
   con la sola eccezione di <em> (vedi regola sotto).
   La classe sta sul <main>, quindi copre tutto il contenuto di pagina; header di
   sito e footer restano quelli globali e non vengono toccati da qui.
   L'!important serve a superare le regole di Bootstrap Italia, piu' specifiche.
   Escluso il testo per soli screen reader (.visually-hidden), dove la dimensione
   non ha effetto visivo. */
.sii-at-tabellare {
    font-size: 1rem;
}

.sii-at-tabellare p,
.sii-at-tabellare li,
.sii-at-tabellare i,
.sii-at-tabellare small,
.sii-at-tabellare span,
.sii-at-tabellare label:not(.visually-hidden),
.sii-at-tabellare a,
.sii-at-tabellare dt,
.sii-at-tabellare dd,
.sii-at-tabellare .text-paragraph-small,
.sii-at-tabellare .other-link-title,
.sii-at-tabellare .infofile,
.sii-at-tabellare .chip-label {
    font-size: 1rem !important;
}

/* Il breadcrumb non segue il minimo di 1rem delle pagine AT: la sua misura e'
   unica in tutto il sito (vedi la regola .breadcrumb-item piu' sotto), cosi' la
   navigazione ha lo stesso peso su ogni template. */

/* unica eccezione: il riquadro introduttivo (.infoat), nota di servizio e non
   contenuto principale, quindi piu' compatto */
.sii-at-tabellare .infoat p,
.sii-at-tabellare .infoat em {
    margin-bottom: 0rem;
    font-size: 0.825rem !important;
    line-height: 1.3 !important;
}

/* le icone svg dimensionate in em non devono crescere con il testo */
.sii-at-tabellare .icon {
    font-size: 1rem;
}

/* ---- filtri avanzati per campo (pannello sotto la barra) ----
   Dichiarati sulle colonne (ColonnaTrasparenza.Filtro): il pannello si costruisce
   da se', qui non c'e' nulla di specifico della sezione. */

/* Con il toggle dei filtri in piu' la riga non teneva anche il blocco export, che
   finiva a capo da solo: dove il toggle c'e', il campo di ricerca rapida si
   restringe (il lavoro fine lo fanno i filtri per campo). */
.sii-tab-trasp__barra:has(.sii-tab-trasp__filtri-toggle) .sii-tab-trasp__ricerca {
    flex: 0 1 34%;
}

.sii-tab-trasp__filtri-toggle {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

    .sii-tab-trasp__filtri-toggle .icon {
        width: 20px;
        height: 20px;
        fill: currentColor;
    }

    /* aperto: il bottone resta "premuto", cosi' si capisce da dove esce il pannello */
    .sii-tab-trasp__filtri-toggle.is-aperto {
        background: #06c;
        color: #fff;
    }

.sii-tab-trasp__filtri {
    margin: -8px 0 28px;
    padding: 20px 24px;
    background: #fff;
    border: 1px solid #dfe4f2;
    /* stessa cifra dell'inciso normativo sopra la tabella (.sii-at-norma) */
    border-left: 4px solid #06c;
    border-radius: 6px;
}

.sii-tab-trasp__filtri-griglia {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 16px 20px;
}

.sii-tab-trasp__filtro {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}

.sii-tab-trasp__filtro-label {
    /* legend e label insieme: le due varianti del filtro data e degli altri */
    float: none;
    width: auto;
    margin: 0;
    padding: 0;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.3;
    color: #435a70;
}

/* i controlli del pannello hanno l'altezza dei bottoni della barra (48px) */
.sii-tab-trasp__filtri input[type="text"],
.sii-tab-trasp__filtri input[type="date"],
.sii-tab-trasp__filtri select {
    width: 100%;
    min-height: 48px !important;
    height: 48px !important;
    padding: 0 12px !important;
    font-size: 1rem;
    color: #191919;
    background: #fff;
    border: 1px solid #bfbfbf !important;
    border-radius: 6px !important;
    box-shadow: none;
}

    .sii-tab-trasp__filtri input[type="text"]:focus,
    .sii-tab-trasp__filtri input[type="date"]:focus,
    .sii-tab-trasp__filtri select:focus {
        border-color: #06c !important;
        outline: 2px solid rgba(0, 102, 204, 0.25);
        outline-offset: 1px;
    }

/* La tendina sta fuori dalla styled-select del sito (data-styled-select="off"),
   quindi la freccia la disegniamo qui. La dizione ANAC intera non deve allargare
   la colonna della griglia. */
.sii-tab-trasp__filtri select {
    appearance: none;
    -webkit-appearance: none;
    padding-right: 40px !important;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23435a70' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    background-size: 16px 16px;
    text-overflow: ellipsis;
}

/* dal/al sono due campi affiancati: da soli in una traccia della griglia starebbero
   troppo stretti, quindi l'intervallo ne occupa due */
.sii-tab-trasp__filtro--data {
    grid-column: span 2;
}

    .sii-tab-trasp__filtro--data .sii-tab-trasp__filtro-intervallo {
        display: flex;
        gap: 10px;
    }

.sii-tab-trasp__filtro-estremo {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    flex: 1 1 0;
}

    .sii-tab-trasp__filtro-estremo label {
        margin: 0;
        font-size: 1rem;
        color: #435a70;
        white-space: nowrap;
    }

.sii-tab-trasp__filtri-azioni {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px;
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid #dfe4f2;
}

.sii-tab-trasp__filtri-esito {
    margin: 0;
    font-size: 1rem;
    color: #435a70;
}

/* ---- modale di conferma dell'export ---- */

.sii-export .modal-title {
    color: #191919;
}

.sii-export__intro {
    margin: 0 0 16px;
    font-size: 1rem;
}

/* Il quadratino della spunta lo disegna Bootstrap Italia con gli pseudo-elementi
   della label (l'input nativo e' nascosto): qui mettiamo solo la superficie che
   stacca la conferma dal resto della modale, senza toccare .form-check. */
.sii-export__check {
    padding: 14px 16px;
    background: #f2f6fb;
    border: 1px solid #dfe4f2;
    border-radius: 6px;
}

    .sii-export__check label {
        margin: 0;
        font-size: 1rem;
        font-weight: 600;
        color: #191919;
    }

.sii-export__nota {
    margin: 10px 0 0;
    font-size: 1rem;
    line-height: 1.4;
    color: #435a70;
}

.sii-export__errore {
    margin: 12px 0 0;
    font-size: 1rem;
    font-weight: 600;
    color: #a4133c;
}

.sii-export__attesa-testo {
    margin: 0 0 10px;
    font-size: 1rem;
    color: #435a70;
}

.sii-export__attesa-perc {
    font-weight: 700;
    color: #06c;
    font-variant-numeric: tabular-nums;
}

.sii-export__barra {
    height: 10px;
    background: #e9edf5;
    border-radius: 999px;
    overflow: hidden;
}

    .sii-export__barra .progress-bar {
        height: 100%;
        width: 0;
        background: #06c;
        /* accompagna i passi da 60ms del javascript senza scatti */
        transition: width 120ms linear;
    }

@media (max-width: 992px) {
    .sii-tab-trasp__ricerca {
        flex: 1 1 100%;
    }

    .sii-tab-trasp__export {
        justify-content: flex-start;
    }

    .sii-tab-trasp__filtri-toggle,
    .sii-tab-trasp__reset {
        flex: 1 1 auto;
        justify-content: center;
    }
}

@media (max-width: 576px) {
    .sii-tab-trasp__filtri {
        padding: 16px;
    }

    /* una traccia sola e dal/al in colonna: affiancati, i due campi data non
       stanno nei 320px */
    .sii-tab-trasp__filtro--data {
        grid-column: auto;
    }

    .sii-tab-trasp__filtro--data .sii-tab-trasp__filtro-intervallo {
        flex-direction: column;
        gap: 8px;
    }
}


/* ============================================================
   Bandi di gara: elenco (listabandigara) e scheda (bandogara)
   ============================================================ */

.sii-at-norma {
    margin: 0 0 12px;
    padding-left: 12px;
    border-left: 4px solid #06c;
    font-size: 1rem;
}

.sii-at-vuoto {
    margin: 24px 0;
    font-size: 1rem;
    font-style: italic;
}

.sii-bando-cig {
    margin: 0 0 8px;
    font-size: 1rem;
}

    .sii-bando-cig span {
        color: #435a70;
        text-transform: uppercase;
        letter-spacing: .4px;
        margin-right: 6px;
    }

/* dati generali della scheda: coppie etichetta/valore su due colonne */
.sii-bando-dati {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px 32px;
    margin: 0;
    font-size: 1rem;
}

    .sii-bando-dati > div {
        border-bottom: 1px solid #dfe4f2;
        padding-bottom: 10px;
    }

    .sii-bando-dati dt {
        font-weight: 700;
        color: #435a70;
        margin-bottom: 2px;
    }

    .sii-bando-dati dd {
        margin: 0;
    }

        .sii-bando-dati dd p {
            margin: 0;
        }

@media (max-width: 768px) {
    .sii-bando-dati {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* ============================================================
   Breadcrumb: una misura sola in tutto il sito
   ============================================================
   Due regole da superare:
   - stylenew.css lo teneva a .7rem con ".cmp-breadcrumbs .breadcrumb > li"
     (due volte, una dentro una media query): basta piu' specificita', da qui
     il selettore con "> .breadcrumb-item";
   - sulle pagine AT tabellari il minimo di 1rem passa da ".sii-at-tabellare
     li / a / span" con !important, e una voce di breadcrumb e' un li con
     dentro un a e uno span: serve !important anche qui, e vince perche' il
     selettore e' piu' specifico di ".sii-at-tabellare li".
   Il selettore nudo copre i breadcrumb fuori da .cmp-breadcrumbs (primopiano
   e le viste in Views/old); link e separatore sono elencati a parte perche'
   Bootstrap Italia e stylenew.css li dimensionano da soli. */
.breadcrumb-item,
.breadcrumb-item a,
.breadcrumb-item .separator,
.cmp-breadcrumbs .breadcrumb > .breadcrumb-item,
.cmp-breadcrumbs .breadcrumb > .breadcrumb-item a,
.cmp-breadcrumbs .breadcrumb > .breadcrumb-item .separator {
    font-size: 0.8333rem !important; /* 15px con root 18px */
}


@media (max-width: 767.98px) {
    #annresult .row {
        display: flex;
        align-items: center;
        flex-wrap: nowrap;
    }

        #annresult .row > .col-12:first-child {
            width: auto;
            flex: 1 1 auto;
        }

        #annresult .row > .col-12:last-child {
            width: auto;
            flex: 0 0 auto;
            text-align: right !important;
        }

    #annresult h4 {
        margin-bottom: 0;
    }
}