/*////////////////////////////////////////////////////////////////////////

/ ACCORDION
////////////////////////////////////////////////////////////////////////*/


/*ACCORDION AREA*/
.accordion {
  background: transparent;
  padding-top: 1rem;
  --padding-left: .5rem; /*Usado em várias partes do accordion*/
}

/*ACCORDION PANNEL*/
.accordion-panel {
  border-radius: 0;
  margin-bottom: 10px;
  margin-top: 10px;
}

/*ACCORDION HEADER*/
.accordion .accordion-panel h2 {
  font-family: var(--font-title);
  font-size: clamp(1.1rem, 1vw + 1rem, 1.9rem);
  padding: 0;
  margin: 0;
}
.accordion .accordion-panel button.accordion-trigger {
  cursor: pointer;
  position: relative;
  color: inherit;
  text-transform: uppercase;
  text-align: left;
  width: 100%;
  padding: 0.8rem 0.6rem;
  padding-left: var(--padding-left);
  /* color: #202A44; */
  background-color: #EDFF6F;
  /* background-color: #F0F0F0; */
  border: 2px solid #c5d8b8;
  border-radius: 1px;
  box-shadow: rgba(129, 132, 140, 0.3) 0px 0px 4px 0px;
  padding: .8rem .6rem;
  padding-left: .5rem;
}
.accordion .accordion-panel button.accordion-trigger:hover {
  background-color: #e5f440;
  /* color: #73a473; */

}
.accordion .accordion-panel button.accordion-trigger[aria-expanded="true"]{
  background-color: #F4FF6F;
  /* color: #669966; */
}
.accordion .accordion-panel button.accordion-trigger:hover[aria-expanded="true"]{
  background-color: #e5f440;
  /* color: #669966; */
}
.accordion .accordion-panel button.accordion-trigger > * {
  pointer-events: none;
}
.accordion .accordion-panel button.accordion-trigger .stage-tab {
  display: flex;
  justify-content: space-between;
}
button.accordion-trigger .accordion-tab {
  display: flex;
  align-content: center;
  justify-content: space-between;
  padding-right: 15px;
}
button.accordion-trigger .accordion-tab .icon-chevron-down {
  position: relative;
  transition: 0.1s ease;
}
.accordion .accordion-panel button.accordion-trigger[aria-expanded="true"] .accordion-tab .icon-chevron-down {
  transform: rotate(-180deg);
  padding-top: 0px;
}
.accordion .accordion-tab .icon-chevron-down::before {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
}

/*ACCORDION CONTENT*/
.accordion-content {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 500ms;
  padding: 0rem ;
}
.accordion-content[aria-hidden="false"] {
  grid-template-rows: 1fr;
}
.accordion-content > div {
  overflow: hidden;
}

/*---------------------------------------------------------------/
  PAGINA PROGRAMA COM O ACCORDION
*/
.pag-stages #main-content-area main {
  padding-top: 0.25rem;
  padding-bottom: clamp(3.5rem, 2vw + 3rem, 5rem);
}
#pag-programa {
  font-family: "bould";
  font-weight: 400;
  font-size: .9rem;
}
#pag-programa .container-main-top{
  margin-top: 30px;
}
#pag-programa .horizontal-banner img {
  width: 100%;
  max-height: 95px;
  object-fit: cover;
  min-height: 95px;
}
@media (min-width: 992px) {
  #pag-programa {
    padding: 10px 50px;
  }
}

/*AJUSTAR A LARGURA DO LAYOUT*/
.stages-wrapper {
  max-width: 1000px;
  margin: auto;
}

/*Especifico para as tabs PROGRAMA - Stages do Rally*/
/*PAGINA PROGRAMA CONTROLAR FONTES*/
.accordion .stage-panel .stage-tab {
  font-size: .85rem;
}
.accordion .stage-panel .pec-information {
  display: flex;
  align-content: center;
}
.accordion .program-tab .horas,
.accordion .stage-panel .pec-information .horas {
  font-weight: bold;
  text-align: right;
  margin-right: 12px;
  padding-right: 10px;
  font-style: oblique;
  width: 51px;
}
.accordion .stage-panel .pec-information .horas {
  border-right: 3px solid rgb(89, 255, 122);
  border-right: 3px solid rgb(251, 64, 21);
}
.accordion .stage-panel .pec-information .pec-id {
  font-weight: bold;
  text-align: left;
}
.accordion .pec-information .pec-name {
  padding-left: 8px;
}
.accordion .pec-information .pec-distance {
  font-weight: bold;
  /* font-size: .85rem; */
  padding-left: 15px;
}
.accordion .pec-information .pec-distance::after {
  content: "km";
  font-weight: normal;
  text-transform: initial;
}

/*Especifico para as tabs PROGRAMA - info do Rally*/
/*ITEMS DE PROGRAMA DA PROVA*/

.accordion .program-tab {
  display: flex;
  position: relative;
  text-align: left;
  width: 100%;
  padding: 0.45rem;
  padding-left: var(--padding-left);
  color: #3f4556;
}
.accordion .program-tab .horas {
  border-right: .1rem solid #202A44;
}
.accordion .program-tab .local {
  color: #3f4556;
}