/**
 * @file
 * Stile per sottotema di unito_base per i federati.
 */
body {
  --black-text-base: #1a1a1a;
  --text-light: #54565a;
  /* nella variabile '--clr-scuola' uso il codice colore rgb senza il rgb() in modo che possa gestirne la trasparenza o altre varianti quando serve */
  --clr-scuola: 0, 110, 192; /* #006ec0 */
  /* mantengo la variabile --clr-text-primary nel caso che un giorno vogliano cambiare il colore del testo rispetto a quello principale del portale */
  --clr-text-primary: rgb(var(--clr-scuola));
  --main-color: rgb(var(--clr-scuola));
}

body.blu-light {
  --clr-scuola: 0, 124, 186; /* #007CBA */
  --filter: brightness(0) saturate(100%) invert(31%) sepia(96%) saturate(999%)
    hue-rotate(171deg) brightness(98%) contrast(102%);
}

body.blu-dark {
  --clr-scuola: 35, 86, 137; /* #235689 */
  --filter: brightness(0) saturate(100%) invert(29%) sepia(10%) saturate(4567%)
    hue-rotate(174deg) brightness(92%) contrast(87%);
}

body.amaranto {
  --clr-scuola: 185, 23, 52; /* #B91734 */
  --filter: brightness(0) saturate(100%) invert(19%) sepia(51%) saturate(3049%)
    hue-rotate(328deg) brightness(100%) contrast(111%);
}

body.verde {
  --clr-scuola: 4, 133, 103; /* #048567 */
  --filter: brightness(0) saturate(100%) invert(24%) sepia(63%) saturate(4211%)
    hue-rotate(158deg) brightness(93%) contrast(97%);
}

body.arancio {
  --clr-scuola: 212, 68, 6; /* D44406  */
  --filter: brightness(0) saturate(100%) invert(25%) sepia(98%) saturate(1911%)
    hue-rotate(7deg) brightness(97%) contrast(95%);
}

:is(.clr--scuola, a.clr--scuola) {
  color: rgb(var(--clr-scuola));
}

.bg--scuola {
  background-color: rgb(var(--clr-scuola));
}

:is(.text--red, .clr--scuola, a.clr--scuola):hover,
.text--red:is(a, button):focus,
.btn.text--red:is(:active, .show) {
  color: color-mix(in srgb, rgb(var(--clr-scuola)) 85%, black);
}

.text--grey,
a.text--grey {
  color: var(--text-light);
}

.link-hover {
  background: linear-gradient(
      transparent 1px,
      rgb(var(--clr-scuola)) 1px,
      rgb(var(--clr-scuola)) 3px,
      transparent 3px
    )
    0 bottom / 0 3px no-repeat;

  transition: background-size 0.4s cubic-bezier(0.55, 0.09, 0.68, 0.53);
}

.link-hover:hover {
  background: linear-gradient(
      transparent 1px,
      color-mix(in srgb, rgb(var(--clr-scuola)) 85%, black) 1px,
      color-mix(in srgb, rgb(var(--clr-scuola)) 85%, black) 3px,
      transparent 3px
    )
    0 bottom / 100% 3px no-repeat;
  text-decoration: none;
  transition: background-size 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.slick--optionset--slider-hp .slick__arrow .slick-arrow svg {
  filter: brightness(0) saturate(100%) invert(100%) sepia(2%) saturate(7483%)
    hue-rotate(317deg) brightness(104%) contrast(106%);
}

.slick--optionset--slider-hp
  .slick-dots
  li.slick-active
  button
  .slick-dot-icon::before {
  background-color: #fff;
  color: #fff;
}

.slick__arrow .slick-arrow svg,
.filter--red,
.filter--scuola {
  filter: var(--filter);
}

.field--name-field-allegati a,
.text-formatted ul li::marker {
  color: rgb(var(--clr-scuola));
}

/* MOBILE HEADER */
.modal-search .btn-close {
  filter: brightness(0) saturate(100%) invert(100%) sepia(8%) saturate(456%)
    hue-rotate(146deg) brightness(117%) contrast(100%);
}

.mobile-header .modal-btn img {
  filter: var(--filter);
}

/* PARAGRAFI */
.paragraph--type--cards-wrapper.dropdown > button::after,
.paragraph--type--bp-tabs .btn::after {
  filter: var(--filter);
}

.paragraph--type--semplice .paragraph__links circle {
  filter: var(--filter);
}

:is(.paragraph--accordion, .paragraph--type--bp-view) .accordion-button::after,
.paragraph--type--cards-wrapper.dropdown > button::after,
.paragraph--type--bp-tabs .btn::after {
  filter: var(--filter);
}

@media (min-width: 64em) {
  .slide__box {
    background-color: transparent;
  }

  .slide__box-inner > .slide__text {
    background-color: rgba(var(--clr-scuola), 0.8);
  }
}

/* Paragrafo TIMELINE */
.paragraph--type--timeline.evento--scaduto .card::before,
.paragraph--type--timeline.evento--scaduto .card::after {
  background-color: color-mix(
    in srgb,
    rgb(var(--clr-scuola)) 55%,
    #ffffff
  ) !important;
  border-color: color-mix(
    in srgb,
    rgb(var(--clr-scuola)) 55%,
    #ffffff
  ) !important;
}

/* SHARE EVERYWHERE */
.se-block img {
  filter: var(--filter);
}

/* PUNTATORE MAPPA */
.field--name-field-puntatore-mappa a::before {
  filter: var(--filter);
}

/* MENU IN SPALLA */
.menu--main-in-spalla .dropdown-menu svg {
  filter: var(--filter);
}

/* Icona file */
.file > svg {
  filter: var(--filter);
}

/* FOOTER PAGINA */
.footer-pagina__documenti svg {
  filter: var(--filter);
}

/* PAGINA RICERCA */
#google-cse-results .gsc-refinementHeader.gsc-refinementhActive {
  border-bottom-color: rgb(var(--clr-scuola)) !important;
}

#google-cse-results .gsc-refinementBlock > .gsc-refinementHeader,
#___gcse_0 a,
#___gcse_0 a b,
.gsc-cursor-page,
a.gs-title:link *,
a.gs-title,
.gsc-cursor-current-page,
.gs-snippet a,
.gsc-tabHeader,
.gs-webResult div.gs-per-result-labels a.gs-label,
a.gs-title,
.gs-snippet a,
.gs-visibleUrl,
.gs-visibleUrl-short,
.gcsc-find-more-on-google {
  color: rgb(var(--clr-scuola)) !important;
}