/*******************************************
   Reset
 ******************************************/
.node .field--type-image {
  float: none;
}

.node__content {
  font-size: 1rem;
  margin-top: 0;
}

.node--view-mode-teaser {
  border: 0;
}

img, video {
  max-width: 100%;
  height: auto;
  display: block;
}

.field--type-entity-reference {
    margin: 0 0 0 0;
}

/*******************************************
     General
******************************************/

body{
    scroll-margin-top: 550px;
}

body,
.node--view-mode-teaser .node__content {
  font-family: var(--sans-serif);
  font-size: 20px;
  line-height: 30px;
}




a{
  text-decoration: none;
  color: var(--blue);
}

a:hover{
  text-decoration: none;
  color: var(--blue_hover);
}



h1, h2, h3, h4, h5, h6{
  font-family: var(--serif);
  color: var(--blue_dark);
}

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a{
  font-family: var(--serif);
  color: var(--blue_dark);
}

h1{
  font-size: 2.2rem;
}

h2{
  font-size: 1.8rem;
}

h3{
  font-size: 1.4rem;
}

h4{
  font-size: 1.2rem;
}

.field--name-field-media-video-file {
  position: relative;
}

.field--name-field-media-video-file video{
  cursor: pointer;
}

.field--name-field-media-video-file .play_icon{
  cursor: pointer;
  position: absolute;
  z-index: 99;
  top: 50%;
  left: 50%;
}

.field--name-field-media-video-file .play_icon_inner{
  width: 6rem;
  margin-left: -3rem;
  height: 6rem;
  margin-top: -3rem;
  background-color: var(--blue);
  border-radius: 3rem;
  padding: 0.5rem;
}

.field--name-field-media-video-file .play_icon_inner svg{
  fill: var(--white);
}

.btn{
  border-radius: 5rem;
  border-width: 3px;
  padding: 0.5rem 1.5rem;
  font-weight: bold;
}

select.form-select,
input.form-control,
.form-select.tagify-select-widget{
  border-radius: 5rem;
  padding: 0.5rem 1.5rem;
}

.views-exposed-form.bef-exposed-form{

}

.views-exposed-form.bef-exposed-form .d-flex.flex-wrap{

}


.views-exposed-form.bef-exposed-form #edit-search-api-fulltext--4{
  padding: 0.65rem 1.5rem;
}

.views-exposed-form.bef-exposed-form .d-flex.flex-wrap .js-form-item{
  margin-right: 1rem;
  min-width: 45%;

}

.views-exposed-form.bef-exposed-form .d-flex.flex-wrap .js-form-item .form-select.tagify-select-widget{
  padding: 0;
  display: flex;
  line-height: 1rem;
}

.views-exposed-form.bef-exposed-form .d-flex.flex-wrap #edit-actions--4{
  width: 100%;
}

.btn-primary {
  background-color: var(--red);
  border-color: var(--red);
}

.btn-primary:after{
  content: "";
  width: 1.05rem;
  height: 1.2rem;
  display: inline-block;
  margin-bottom: -0.4rem;
  margin-left: 0.5rem;
  background-repeat: no-repeat;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgZmlsbD0iI2ZmZmZmZiIgY2xhc3M9ImJpIGJpLWFycm93LXJpZ2h0IiB2aWV3Qm94PSIwIDAgMTYgMTYiPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgZD0iTTEgOGEuNS41IDAgMCAxIC41LS41aDExLjc5M2wtMy4xNDctMy4xNDZhLjUuNSAwIDAgMSAuNzA4LS43MDhsNCA0YS41LjUgMCAwIDEgMCAuNzA4bC00IDRhLjUuNSAwIDAgMS0uNzA4LS43MDhMMTMuMjkzIDguNUgxLjVBLjUuNSAwIDAgMSAxIDgiPjwvcGF0aD48L3N2Zz4=)
}

.btn-primary.dropdown-toggle:after{
    border: 0;
    margin-bottom: -0.6rem;
}

.btn-primary:hover,
.btn-primary:active
 {
  background-color: var(--white);
  color: var(--red);
  border-color: var(--red);
}

.btn-primary:hover:after,
.btn-primary:active:after
 {
background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgZmlsbD0iI0RGNkY2MyIgY2xhc3M9ImJpIGJpLWFycm93LXJpZ2h0IiB2aWV3Qm94PSIwIDAgMTYgMTYiPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgZD0iTTEgOGEuNS41IDAgMCAxIC41LS41aDExLjc5M2wtMy4xNDctMy4xNDZhLjUuNSAwIDAgMSAuNzA4LS43MDhsNCA0YS41LjUgMCAwIDEgMCAuNzA4bC00IDRhLjUuNSAwIDAgMS0uNzA4LS43MDhMMTMuMjkzIDguNUgxLjVBLjUuNSAwIDAgMSAxIDgiPjwvcGF0aD48L3N2Zz4=)
}
.btn-info {
  background-color: var(--blue);
  border-color: var(--blue);
}

.btn-info:hover,
.btn-info:active {
  background-color: var(--blue_hover);
  border-color: var(--blue_hover);
}


a.arrow_link{
  color: var(--blue);
  text-decoration: none;
  font-weight: 600;
  display: inline-block;
  margin-top: 0.5rem;
  font-size: 0.9rem;
}

a.arrow_link.add_arrow:after{
  content: "";
  width: 1.05rem;
  height: 1.2rem;
  display: inline-block;
  margin-bottom: -0.4rem;
  margin-left: 0.5rem;
  background-repeat: no-repeat;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgZmlsbD0iIzAxOUJERCIgY2xhc3M9ImJpIGJpLWFycm93LXJpZ2h0IiB2aWV3Qm94PSIwIDAgMTYgMTYiPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgZD0iTTEgOGEuNS41IDAgMCAxIC41LS41aDExLjc5M2wtMy4xNDctMy4xNDZhLjUuNSAwIDAgMSAuNzA4LS43MDhsNCA0YS41LjUgMCAwIDEgMCAuNzA4bC00IDRhLjUuNSAwIDAgMS0uNzA4LS43MDhMMTMuMjkzIDguNUgxLjVBLjUuNSAwIDAgMSAxIDgiPjwvcGF0aD48L3N2Zz4=);

}

a.arrow_link svg{
  fill: var(--blue);
  height: 1.2rem;
  width: auto;
  margin-left: 0.2rem;
  margin-top: -0.1rem;
  transition: 0.5s all;
}


a.arrow_link:hover{
  color: var(--blue_hover);
  text-decoration: none;
  font-weight: 600;
}

a.arrow_link:hover svg{
  fill: var(--blue_hover);
  margin-left: 0.5rem;
}


.container-xxxl {
  max-width: var(--containerXXXL);
  margin: auto;
  padding: 0 0.5rem;
}

blockquote{
  position: relative;
  background-color: var(--blue_light);
  border-radius: var(--borderradius_large);
  padding: 2rem;
  font-family: var(--serif);
  font-size:1.5rem;
  line-height: 2.4rem;
  color: var(--blue_dark);
}

blockquote p{
  border-left: 5px solid var(--blue_dark);
  padding-left: 2rem;
}


/* Pager */

.pagination {
    --bs-pagination-padding-x: 0.75rem;
    --bs-pagination-padding-y: 0.375rem;
    --bs-pagination-font-size: 1rem;
    --bs-pagination-color: var(--bs-link-color);
    --bs-pagination-bg: #fff;
    --bs-pagination-border-width: 1px;
    --bs-pagination-border-color: #dee2e6;
    --bs-pagination-border-radius: 0.375rem;
    --bs-pagination-hover-color: var(--bs-link-hover-color);
    --bs-pagination-hover-bg: #e9ecef;
    --bs-pagination-hover-border-color: #dee2e6;
    --bs-pagination-focus-color: var(--bs-link-hover-color);
    --bs-pagination-focus-bg: #e9ecef;
    --bs-pagination-focus-box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
    --bs-pagination-active-color: #fff;
    --bs-pagination-active-bg: #0d6efd;
    --bs-pagination-active-border-color: #0d6efd;
    --bs-pagination-disabled-color: #6c757d;
    --bs-pagination-disabled-bg: #fff;
    --bs-pagination-disabled-border-color: #dee2e6;
    display: flex;
    padding-left: 0;
    list-style: none;
    border: 0;

}

li.page-item {
    border: 0;
    line-height: 1rem;
    font-size: 0.9rem;
    margin-right: 0.5rem;
}


.page-link {
    position: relative;
    display: block;
    padding: 0.75rem;
    border-radius: var(--borderradius_large);
    color: var(--blue);
    line-height: 0.5rem;
    font-size: 0.9rem;
    text-decoration: none;
    background-color: transparent;
    border: 0px;
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.page-item:first-child .page-link,
.page-item:last-child .page-link
 {
    border-radius: var(--borderradius_large);
}


/* Loader */
.loader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1000;
  background-color: var(--white);
  opacity: 1;
  transition: opacity .3s ease;
  display: flex;
  align-items: center;
  justify-content: space-around;
}

.loader.is-hidden {
  opacity: 0;
  visibility: hidden;   /* rimuove il loader da click e tab senza toglierlo dal DOM */
  pointer-events: none;
  transition: opacity .5s ease, visibility 0s linear .5s; /* visibility cambia a fine fade */
}

.loader_inner{

}

.loader_inner img{
  max-width: 150px;
  height: auto;
  animation: pulse 1.5s ease-in-out infinite;
}


@keyframes pulse {
  0%, 100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.1);
  }
}


/* Tags */
.node--type-article.node--view-mode-teaser .field--name-field-categories,
.node--type-unita-operativa .field--name-field-areas{
  display: flex;
  flex-wrap: wrap;
}

.node--type-article.node--view-mode-teaser .field--name-field-categories .field__item,
.node--type-unita-operativa .field--name-field-areas .field__item{
  margin-right: 0.5rem;
  margin-bottom: 0.5rem;
}

.node--type-article.node--view-mode-teaser .field--name-field-categories .field__item a,
.node--type-unita-operativa .field--name-field-areas .field__item a{
  background-color: var(--blue_light);
  color: var(--blue);
  border-radius: var(--borderradius_large);
  font-size: 0.9rem;
  text-decoration: none;
  padding: 0.25rem 1rem;
}

.node--type-unita-operativa .field--name-field-areas .field__item.area-della-salute-mentale a{
  background-color: var(--blue_dark);
  color: var(--white);
}

.node--type-unita-operativa .field--name-field-areas .field__item.area--rsa a{
  background-color: var(--yellow);
  color: var(--white);
}

/* immagini - images */
.section_item.hascontainer img.image-style-teaser-3-2{
  border-radius: var(--borderradius_large);
}

.active>.page-link, .page-link.active {
    z-index: 3;
    color: var(--bs-pagination-active-color);
    background-color: var(--blue);
    border-color: var(--blue);
}

/* Views filters - Better exposed filters */
.views-exposed-form.bef-exposed-form{

}

.bef-links{

}

.bef-links > ul{
  display: flex;
  flex-wrap: wrap;
  list-style-type: none;
  margin: 0;
  padding: 0;
}

.bef-links > ul li{
  margin-bottom: 0.5rem;
}

.bef-exposed-form .bef-links .bef-link{
  text-transform: uppercase;
  color: var(--blue);
  border-radius: var(--borderradius_large);
  font-size: 0.9rem;
  text-decoration: none;
  padding: 0.25rem 1rem;
  margin-right: 0.5rem;
}

.bef-exposed-form .bef-links .bef-link:hover,
.bef-exposed-form .bef-links .bef-link.bef-link--selected{
  background-color: var(--blue);
  color: var(--white);
}

/* Slick carousel */
.slick-slider{
  margin: 0 -1rem;
}

.slick__slide{
  margin: 0 1rem;
}

.slick-dots{
  list-style-type: none;
  margin: 0;
  padding: 0;
  margin-top: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

.slick-dots > li{
  margin: 0;
  padding: 0;
}

.slick-dots > li button{
  height: 0.75rem;
  width: 0.75em;
  background-color: var(--grey);
  text-indent: -9999px;
  border: 0;
  padding: 0;
  margin: 0.5rem;
  border-radius: 0.75rem;
  transform: 0.5s all;
}

.slick-dots > li.slick-active button{
  background-color: var(--red);
  transform: scale(1.5);
}



/* Webform */
.webform-submission-form {

}

.webform-submission-form label{
  font-size: 0.9rem;
}


.path-node .ui-dialog.webform-confirmation-modal{
  background-color: var(--white);
  border-radius: var(--borderradius_large);
}

.path-node .ui-dialog .ui-dialog-titlebar {
    line-height: 1.2;
    padding: var(--gin-spacing-m) var(--gin-spacing-l);
    background-color: var(--blue_dark);
    border: 0 none;
    border-radius: var(--borderradius_large) var(--borderradius_large) 0 0;
    position: relative;
    padding: 1.5rem;
}

.path-node .ui-dialog .ui-dialog-content:not(:has(+ .ui-widget-content.ui-dialog-buttonpane)) {
    border-end-start-radius: var(--gin-border-m);
    border-end-end-radius: var(--gin-border-m);
    padding: 1.5rem;
}

.path-node .ui-dialog {
    & .ui-dialog-titlebar {
        .ui-dialog-titlebar-close {
            position: absolute;
            inset-block-start: 50%;
            inset-inline-end: 0;
            box-sizing: border-box;
            inline-size: var(--jui-dialog-close-button-size);
            block-size: var(--jui-dialog-close-button-size);
            margin-inline: var(--space-l);
            padding: 0;
            transition: all 0.1s;
            transform: translateY(-50%);
            border-radius: var(--jui-dialog-close-button-border-radius);
            background: none;
            background-color: var(--white);
        }

        .ui-dialog-titlebar-close:after{
          content: 'X';
        }
    }
}
