/*
Theme Name:   Elementor Child
Template:     hello-elementor
Description:  Child theme per Hello
Author:       Lorenzo Lometti
Version:      1.0.0
*/

/* Qui potrai aggiungere le tue regole CSS personalizzate */

/* ======================================================================
   RESET eventuali inline style residui
   ====================================================================== */
.acc__panel[style],
.acc__panel_mobile[style] {
  background: #444 !important;
  padding: 0 !important;
}

/* ======================================================================
   CONTENITORE GENERALE
   ====================================================================== */
.acc__content {
  background: #444;
  padding: 0;
}
.acc {
  margin: 0;
  padding: 0;
}

/* ======================================================================
   VOCE “SINGOLA” (nessun dropdown)
   ====================================================================== */
.acc__title4.singolo > a {
  display: block;
  padding: 15px 30px;
  background: #e10f21;
  color: #fff !important;
  font-size: 14px;
  font-weight: 600;
  text-transform: uppercase;
  text-decoration: none;
  cursor: pointer;
}

/* ======================================================================
   TITOLO DROPDOWN (desktop)
   ====================================================================== */
/* wrapper per la freccina */
.acc__title {
  position: relative;
  padding: 0;
  background: transparent;
}
/* stile sul link vero */
.acc__title > a {
  display: block;
  padding: 15px 30px;
  background: rgba(225,15,33,1);
  color: #fff !important;
  font-size: 14px;
  font-weight: 600;
  text-transform: uppercase;
  text-decoration: none;
  cursor: pointer;
}
/* freccina */
.acc__title::after {
  content: "";
  position: absolute;
  top: 50%; right: 30px;
  width: 8px; height: 8px;
  border-right: 1px solid #fff;
  border-bottom: 1px solid #fff;
  transform: translateY(-50%) rotate(45deg);
  transition: transform .2s ease;
}
/* freccina aperta */
.acc__title.active::after {
  transform: translateY(-50%) rotate(-135deg);
}

/* ======================================================================
   PANEL DROPDOWN (desktop)
   ====================================================================== */
.acc__panel {
  max-height: 0;
  overflow: hidden;
  list-style: none;
  margin: 0;
  padding: 0;
  transition: max-height .3s ease;
}
/* quando il titolo è .active */
.acc__title.active + .acc__panel {
  max-height: 1000px;
}
.acc__panel li a {
  display: block;
  padding: 12px 30px;
  color: #efefef !important;
  font-size: 13px;
  text-transform: uppercase;
  text-decoration: none;
}
.acc__panel li:hover a {
  color: #fff !important;
}

/* ======================================================================
   TITOLO DROPDOWN (mobile)
   ====================================================================== */
.acc__title_mobile {
  position: relative;
  padding: 0;
  background: transparent;
}
.acc__title_mobile > a {
  display: block;
  padding: 15px 30px;
  background: rgba(225,15,33,1);
  color: #fff !important;
  font-size: 14px;
  font-weight: 600;
  text-transform: uppercase;
  text-decoration: none;
  cursor: pointer;
}
.acc__title_mobile::after {
  content: "";
  position: absolute;
  top: 50%; right: 30px;
  width: 8px; height: 8px;
  border-right: 1px solid #fff;
  border-bottom: 1px solid #fff;
  transform: translateY(-50%) rotate(45deg);
  transition: transform .2s ease;
}
.acc__title_mobile.active::after {
  transform: translateY(-50%) rotate(-135deg);
}

/* ======================================================================
   PANEL DROPDOWN (mobile)
   ====================================================================== */
.acc__panel_mobile {
  max-height: 0;
  overflow: hidden;
  list-style: none;
  margin: 0;
  padding: 0;
  transition: max-height .3s ease;
}
.acc__title_mobile.active + .acc__panel_mobile {
  max-height: 1000px;
}
.acc__panel_mobile li a {
  display: block;
  padding: 12px 30px;
  color: #efefef !important;
  font-size: 13px;
  text-transform: uppercase;
  text-decoration: none;
}
.acc__panel_mobile li:hover a {
  color: #fff !important;
}

/* ======================================================================
   MEDIA QUERY: eventuali stili differenziati per desktop ≥768px
   ====================================================================== */
@media (min-width: 768px) {
  /* esempio: cambiare colore freccia attiva */
  .acc__title.active::after,
  .acc__title_mobile.active::after {
    border-color: #e10f21;
  }
}