/*
 Theme Name:   Kina Theme
 Theme URI:    https://www.kina.it/
 Description:  Use this child theme to extend functionality.
 Author:       KINA
 Template:     bricks
 Version:      1.1
 Text Domain:  kina
*/
/* Animazione iniziale*/
body {
  opacity: 0;
  transition: opacity 0.4s ease;
}

body[data-builder-mode] {
  opacity: 1;
}

body.page-enter {
  opacity: 1;
}

body.page-exit {
  opacity: 0;
}

/*Template pagina interna stlye*/
.page-title {
  overflow-wrap: break-word;
  word-wrap: break-word;
}

.intro-img {
  clip-path: inset(5%);
}
/*Colore viola*/
.viola {
  color: #a17788;
}
/*Animazione arrow*/
.arrow-container {
  clip-path: circle(50% at 50% 50%);
}

/*Small Slider style*/
.custom-prev,
.custom-next,
.next-gallery,
.prev-gallery {
  cursor: pointer;
}

@media screen and (max-width: 1440px) {
  .carousel-title {
    padding-left: var(--padding-left);
    padding-right: var(--padding-right);
  }
}

/*Big Slider Style*/

.big-nav-container .next,
.img-slider-sync {
  cursor: url("/wp-content/uploads/2025/10/slider-arrow-right-ok.svg"), pointer;
}

.big-nav-container .prev {
  cursor: url("/wp-content/uploads/2025/10/slider-arrow-left.svg"), pointer;
}

/*Sync Slider Style*/
.splide__track--nav > .splide__list > .splide__slide {
  border: none;
}

/*Gallery Selector Style*/
.gallery-selector-container,
.filter-testimonianze-container {
  backdrop-filter: blur(15px);
}

.gallery-selector {
  font-size: var(--dida);
  border: 1px black solid;
  border-radius: 5rem;
  min-width: fit-content;
  width: auto;
  padding-right: 4rem;

  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;

  background: url("data:image/svg+xml;utf8,<svg fill='black' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M7 10l5 5 5-5z'/></svg>")
    no-repeat right 0.7em center / 1em;
}

.gallery-selector-container,
.filter-testimonianze-container {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}

.gallery-selector-container.visible,
.filter-testimonianze-container.visible {
  opacity: 1;
  visibility: visible;
}

/*Form Selector*/
.btn-form-selector.active {
  background-color: var(--bricks-color-nldlcg) !important;
  color: white !important;
}

.contact-form.active {
  opacity: 1 !important;
  display: flex !important;
}