/* --- Knop algemene styling --- */
.vacaturekaart-toggle-btn {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  background: none;
  border: none;
  cursor: pointer;
  font-size: 1rem;
  font-weight: 600;
  color: currentColor;
  padding: 0;
  margin-bottom: 20px;
  text-align: left;
}

.vacaturekaart-toggle-btn:focus,
.vacaturekaart-toggle-btn:hover {
  background: none;   /* geen hover-achtergrond */
  outline: none;      /* geen focusrand */
  border: none;       /* geen rand */
  color: currentColor;
}

/* --- Icon container (cirkel) --- */
.vacaturekaart-toggle-btn .btn-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;             /* maakt cirkel */
  background-color: var(--wp--preset--color--fl-accent);     /* hoofdkleur */
  transition: transform 0.6s ease;
}

/* --- SVG in de cirkel --- */
.vacaturekaart-toggle-btn .btn-icon svg {
  width: 30px;
  height: 30px;
  border-radius: 50%;
}

.vacaturekaart-toggle-btn .btn-icon svg rect {
  fill: var(--wp--preset--color--fl-accent); /* achtergrondkleur */
  transition: transform 1.3s ease;
}

.vacaturekaart-toggle-btn .btn-icon svg path {
  fill: #ffffff;                  /* pijl wit */
  transition: transform 1.3s ease;
}

/* --- Kaart animatie --- */
.vacaturekaart-toggle-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 1s ease;
}

.vacaturekaart-toggle-content.open {
  max-height: 1200px; /* groot genoeg voor de kaart */
}

/* --- Pijl animatie bij toggle --- */
.vacaturekaart-toggle-btn.active .btn-icon {
  transform: rotate(180deg);
}

/* Buitenste wrapper: volle breedte */
.vacaturekaart-toggle-wrapper {
  width: 100%;
  margin: 20px 0;
  
}

/* Zorg dat de knop zelf inline blijft */
.vacaturekaart-toggle-btn {
  display: inline-flex;
}

/* Kaart blijft 100% breed */
.vacaturekaart-toggle-content {
  width: 100%;
  margin-top: 20px;
}

.vacaturekaart-toggle-inner .info-content strong {
	color: #303030;
	font-weight: 700;
	font-size: 16px;
}

/* Voorkomt dat scroll down in de weg zit */
#scroll_down {display: none}