/*
Theme Name: superlader
Template: Avada
*/

/* Voeg hieronder je aangepaste CSS-regels toe */

.fusion-page-title-row {
    display: flex;
    justify-content: center !important;
    align-items: center;
    text-align: center;
}

.fusion-page-title-secondary {
    position: absolute;
    right: 20px;
}

/* Basis card-styling voor de EV-tabs */
.ev-tabs {
  max-width: 1100px;
  margin: 40px auto;
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06);
  overflow: hidden;
}

/* Navigatiebalk van tabs */
.ev-tabs .nav-tabs {
  display: flex;
  flex-wrap: wrap;
  border-bottom: 1px solid #e4ece8;
  background: #f5faf7;
}

/* Individuele tab-knoppen */
.ev-tabs .nav-tabs > li {
  flex: 1 1 25%;
  text-align: left;
}

.ev-tabs .nav-tabs > li > a {
  position: relative;
  display: block;
  padding: 14px 20px 14px 36px;
  font-size: 14px;
  font-weight: 500;
  text-transform: none;
  color: #2a4b3c;
  border: none !important;
  background: transparent !important;
}

/* Actieve tab achtergrondkleur */
.ev-tabs .nav-tabs > li.active > a,
.ev-tabs .nav-tabs > li.active > a:focus,
.ev-tabs .nav-tabs > li.active > a:hover {
    background: #619e85 !important;
    color: #ffffff !important;
}

.ev-tabs .nav-tabs > li:not(.active) > a {
    background-color: #73ad94 !important;
}

/* Hover */
.ev-tabs .nav-tabs > li:not(.active) > a:hover {
    background: #619e85 !important; /* lichtere tint van #619e85 */
    color: #2a4b3c !important;
}

/* Contentblok */
.ev-tabs .tab-content {
  padding: 30px 30px 35px;
  font-size: 15px;
  line-height: 1.7;
}

/* Iconen standaardkleur */
.ev-tabs .nav-tabs > li > a::before {
    color: #ffffff !important;   /* zelfde kleur als brand color */
    content: "›";                 /* standaard: pijltje rechts */
    position: absolute;
    left: 16px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 18px;
    opacity: 1;
}

/* Actieve icon: naar beneden en wit */
.ev-tabs .nav-tabs > li.active > a::before {
    content: "▾";                 /* pijltje naar beneden */
    color: #ffffff !important;
}

/* Optioneel: iets minder sterk op hover van niet-actieve tabs */
.ev-tabs .nav-tabs > li:not(.active) > a:hover::before {
  opacity: 1;
}