/* ===========================================================
   GROENE HUISSTIJL – ARCH IT
   =========================================================== */

/* --- Zoekknop en andere oranje elementen vervangen door groen --- */
button, 


input[type="submit"], 
.Header__searchSection .Header__container button,
.Header__searchSection .Header__container input[type="submit"],
.SearchBox__button, 
.SearchBox__submit {
    background-color: #4eb500 !important;
    border-color: #4eb500 !important;
}

button:hover, 
input[type="submit"]:hover,
.SearchBox__button:hover {
    background-color: #3da200 !important;
    border-color: #3da200 !important;
}

/* --- Iconen (zoals Help Center & Tickets) in groen --- */
svg path,
svg rect,
svg circle,
svg polygon {
    stroke: #4eb500 !important;
    fill: #4eb500 !important;
}

/* --- Hover-effect voor tekst & iconen --- */
a:hover,
span:hover,
i:hover {
    color: #3da200 !important;
    border-color: #3da200 !important;
}

/* ===========================================================
   SPECIFIEK: ZOEKKNOP (vergrootglas)
   =========================================================== */

/* Achtergrond van zoekknop groen */
.SearchContainer__searchIcon.commonStyle__zt3BrandBg {
    background-color: #ffffff !important; /* Groen */
    border-color: #ffffff !important;
}

/* Hover iets donkerder groen */
.SearchContainer__searchIcon.commonStyle__zt3BrandBg:hover {
    background-color: #ffffff !important;
    border-color: #ffffff !important;
}

/* Icoon binnen zoekknop wit */
.SearchContainer__searchIcon svg,
.SearchContainer__searchIcon svg use {
    fill: #ffffff !important;
    color: #ffffff !important;
    stroke: #ffffff !important;
}

/* ===========================================================
   SPECIFIEK: BACK-TO-TOP KNOP (pijl)
   =========================================================== */

/* Achtergrond van back-to-top knop groen */
.AppContainer__backToTop.commonStyle__zt3BrandBg {
    background-color: #ffffff !important; /* Groen */
    border-color: #ffffff !important;
}

/* Hover donkerder groen */
.AppContainer__backToTop.commonStyle__zt3BrandBg:hover {
    background-color: #ffffff !important;
    border-color: #ffffff !important;
}

/* Pijl in witte kleur */
.AppContainer__backToTop svg,
.AppContainer__backToTop svg use {
    fill: #ffffff !important;
    color: #ffffff !important;
    stroke: #ffffff !important;
}

/* ===========================================================
   NIEUWE DEEL: TEKSTLINKS MET BRAND-KLEUR (zoals "Hier aanmelden", "meer")
   =========================================================== */

/* Maak alle brand-links groen */
a.commonStyle__zt3Brand,
.Link__link2.commonStyle__zt3Brand,
.Signin__userLink.commonStyle__zt3Brand {
    color: #4eb500 !important;
}

/* Hover donkerder groen */
a.commonStyle__zt3Brand:hover,
.Link__link2.commonStyle__zt3Brand:hover,
.Signin__userLink.commonStyle__zt3Brand:hover {
    color: #3da200 !important;
}

/* Pijltje (svg binnen 'meer'-link) ook groen */
.Link__link2.commonStyle__zt3Brand svg,
.Link__link2.commonStyle__zt3Brand svg use {
    fill: #4eb500 !important;
    stroke: #4eb500 !important;
}

/* Hover: pijltje donkerder groen */
.Link__link2.commonStyle__zt3Brand:hover svg,
.Link__link2.commonStyle__zt3Brand:hover svg use {
    fill: #3da200 !important;
    stroke: #3da200 !important;
}

/* ===========================================================
   ORANJE TEKST (zoals "Volgen") VERANDEREN NAAR WIT
   =========================================================== */

/* Algemene aanpassing voor oranje tekst met brandkleur */
a.commonStyle__zt3Brand,
.Link__link2.commonStyle__zt3Brand,
.Signin__userLink.commonStyle__zt3Brand,
button.commonStyle__zt3Brand,
span.commonStyle__zt3Brand {
    color: #ffffff !important;   /* Witte tekst */
}

/* Hover (optioneel iets donkerder grijs of lichtgroen voor contrast) */
a.commonStyle__zt3Brand:hover,
.Link__link2.commonStyle__zt3Brand:hover,
.Signin__userLink.commonStyle__zt3Brand:hover,
button.commonStyle__zt3Brand:hover,
span.commonStyle__zt3Brand:hover {
    color: #f0f0f0 !important;   /* Lichtgrijs bij hover */
}


/* ===========================================================
   Hover-effect alleen voor klikbare elementen (links, buttons)
   =========================================================== */

/* Verwijder groene hover van gewone tekst */
span:hover,
i:hover {
    color: inherit !important; /* behoud de originele tekstkleur */
    border-color: inherit !important;
}

/* Behoud het hover-effect alleen voor echte links en knoppen */
a:hover,
button:hover,
input[type="submit"]:hover {
    color: #3da200 !important;
    border-color: #3da200 !important;
}

