/* Custom stylesheet for .vpnBanner element */

.vpnBanner {
  height: 42px;
}

/* */
.home 
.header-searchbox-container {
background-color: #45b97c;
}

.home
.linked-cards {
margin:
0 0
2em;
}

.home .header-searchbox-container .summonBtn {
    border-color: var(--home-page-primary-color,#0e1d2b);
    color: #231f20;
}

/* Targets the h1.title inside any element with 
  data-aid="primary-announcements" 
*/
[data-aid="primary-announcements"] h1.title {
  /* Example: Sets top/bottom margin to 20px, left/right to 0 */
  margin: 20px 0; 
  
  /* Example: Adds 10px of padding on all sides */
  padding: 10px; 
}

/* Targets the div with the class Header-searchbox-container */
.Header-searchbox-container {
  /* Example: Sets top/bottom margin to 20px, left/right to auto or 0 */
  margin: 20px auto; 
}

/* This will override an inline style="..." attribute */
#topLinks {
  padding-top: 14px !important;
}

/*
  This specifically targets the "Meld een probleem" link 
  (which has data-aid="Feedback") and makes its text bold.
*/
a[data-aid="Feedback"] {
  font-weight: bold !important; 
}

/*
  ========================================
  RULE 1: VISIBILITY LOGIC
  This hides the link's <li> if the button is visible.
  ========================================
*/
div#topLinks:has(button[data-aid="research-assistant-tab"]:not(.ng-hide)) li[ng-repeat]:has(a[data-aid="AI Research Assistant"]) {
  display: none !important;
}

/*
  ========================================
  RULE 2: ICON
  This adds the sparkle icon and makes it black & white.
  ========================================
*/
a[data-aid="AI Research Assistant"]::before {
  /* This is the sparkle emoji (é‘´æ¬’å°ƒé‘´æ¿‹åž¾å¨…î…žå• éˆ§î„‚å¦´éˆ¶â•äº¾é–³â”¾æŒŒéã‚†å´¡éˆ¶â•äº¾ é‘´æ¬ç€¯é‘ºæŽ—åž¾å§£î„‰å„ªéˆ¶â”¾å“éè¡¡æŒŒéã‚†å´¡é¡å¿Šå“å¨…î…žåŽ½éˆ·æ°£æ‡‡éˆ§î„î‡¡é”Ÿï¿½ é‘´æ¬’å°ƒé‘´æ¥€ç€¯é‘´æ¬ç€¯é‘ºæŽ—åŸ€é¡‘çŠ«åŸ—é‹î‡…å„ªéç†²æŒŒéˆ¶â•äº¾éŸî‡å‰¹é¨å‹®å‰»é‘¼çŠºåŠƒé–³ãƒ¦îªéï½‚å“é˜å—æ‡‡é‹æ’»åŸ„éˆ·æ°¬å…éŽ¹æ¥€ä¼„éˆ·æ°¬åŽ½éˆ·æ°£æ‡‡é‹æ’´å«¥é‘´æ¥€å´² é‘´æ¬’å°ƒé‘´æ¿‹åž¾å¨…î…žå• éˆ§î„î‡¢é‹î†¹æŒŒéã‚†å´¡é‹î†¹æŒŒéç†²æŒŒéˆ¶â”¾å“å§£î„‰å„ªéšâ‘©åŸ—éï½‚å“å§£î…žä¼„é¡‘ç‚²å…éŽ¹æ¥€ä¼„éˆ·æ°¬åŽ½éˆ·æ°£æ‡‡éˆ§î„î‡¡é¡‘ç‚²æ‚½æ¶”å‘­å• éˆ§î„î‡¢é‹î†¹æŒŒéã‚†å´¡é¡å¿Šå“å¨…î…žå• éˆ§î„‚å¦´éˆ¶â•äº¾é–³â”¾æŒŒéã‚†å´¡éˆ¶â•äº¾ é‘´æ¬ç€¯é‘ºæŽ—åž¾å§£î„‰å„ªéˆ¶â”¾å“éè¡¡æŒŒéã‚†å´¡é¡å¿Šå“å¨…î…žå• éˆ§î„î‡¢é‹î†¹æŒŒéã‚†å´¡é‹î†¹æŒŒéç†²æŒŒéˆ¶â”¾å“å§£î„‰å„ªéšâ‘©åŸ—éï½‚å“å§£î…žä¼„é¡‘ç‚²å…éŽ¹æ¤»æ‡‡é‹æ’³â–Œé‘´æ¬“åž¾å§£î…žä¼„éˆ­è·ºå…éŽ¹æ¥€æ£Œéˆ§î„îªéï½‚å“é˜å—æ‡‡é‹æ’»åŸ„éˆ·æ°¬å…éŽ¹æ¥€ä¼„éˆ·æ°¬åŽ½éˆ·æ°£æ‡‡é‹æ’´å«¥é‘´æ¥€å´²é‘´æ¬“åž¾çº¬é‹î†¹åŸ—éã‚†å´¡é¡å¿Šå“å¨…î…žåŽ½éˆ·æ°£æ‡‡éˆ§î„î‡¡é¡‘ç‚²æ‚½éˆ­è·ºå…éŽ¹æ¤»æ‡‡é‹æ’´å«¥é‘´æ¬“åž¾å§£î…žä¼„éˆ·æ°¬å…éŽ¹æ¥€æ£Œéˆ§î„îªéï½‚å“é˜å—æ‡‡é‹æ’»åŸ„éˆ·æ°¬å…éŽ¹æ¤»æ‡‡é‹ï¿½ é‘´æ¬ç€¯é‘ºæŽ—åž¾å§£î„‰å„ªéˆ¶â”¾å“éè¡¡æŒŒéã‚†å´¡é¡å¿Šå“å¨…î…žåŽ½éˆ·æ°£æ‡‡éˆ§î„î‡¡é”Ÿï¿½ é‘´æ¬’å°ƒé‘´æ¥€ç€¯é‘´æ¬ç€¯é‘ºæŽ—åŸ€é¡‘çŠ«åŸ—é‹î‡…å„ªéç†²æŒŒéˆ¶â•äº¾éŸî‡å‰¹é¨å‹®å‰»é‘¼çŠºåŠƒé–³ãƒ¦îªéï½‚å“é˜å—æ‡‡é‹æ’»åŸ„éˆ·æ°¬å…éŽ¹æ¤»æ‡‡é‹æ’´å«¥é‘´æ¬“åž¾å§£î…žä¼„éˆ·æ°¬å…éŽ¹æ¥€æ£Œéˆ§î„îªéï½‚å“å§£î…žä¼„éˆ·æ°¬å…éŽ¹æ¥€ä¼„éˆ·æ°¬åŽ½éˆ·æ°£æ‡‡é‹æ’´å«¥é‘´æ¥€å´²é‘´æ¬“åž¾çº¬é‹î†¹åŸ—éã‚†å´¡éˆ¶â•äº¾éŽ·Ñ†å‰»é–³ãƒ¦î‡¢é‹î‡…å„ªéã‚†å´¡é¡å¿Šå“å¨…î…žåŽ½éˆ·æ°£æ‡‡éˆ§î„î‡¡é¡‘ç‚²æ‚½éˆ­è·ºå…éŽ¹æ¤»æ‡‡é‹æ’´å«¥é‘´æ¬“åž¾å§£î…žä¼„çº¬éã‚†å´¡é¡å¿Šå“å¨…î…žå• éˆ§î„‚å¦´éˆ¶â•äº¾é–³â”¾æŒŒéã‚†å´¡éˆ¶â•äº¾ é‘´æ¬ç€¯é‘ºæŽ—åž¾å§£î„‰å„ªéˆ¶â”¾å“éè¡¡æŒŒéã‚†å´¡é¡å¿Šå“å¨…î…žåŽ½éˆ·æ°£æ‡‡éˆ§î„î‡¡é¡‘ç‚²æ‚½éˆ­è·ºå…éŽ¹æ¤»æ‡‡é‹æ’´å«¥é‘´æ¬“åž¾å§£î…žä¼„éˆ·æ°¬å…éŽ¹æ¥€æ£Œéˆ§î„îªéï½‚å“é˜å—æ‡‡é‹æ’»åŸ„éˆ·æ°¬å…éŽ¹æ¤»æ‡‡é‹æ’´å«¥é‘´æ¬“åž¾å§£î…žä¼„éˆ·æ°¬å…éŽ¹æ¥€æ£Œéˆ§î„îªéï½‚å“å§£î…žä¼„éˆ·æ°¬å…éŽ¹æ¥€ä¼„éˆ·æ°¬åŽ½éˆ·æ°£æ‡‡éˆ§î„î‡¡é¡‘ç‚²æ‚½éˆ­è·ºå• éˆ§î„î‡¢é‹î‡…å„ªéã‚†å´¡éˆ¶â•äº¾æ¿žå‹®å‰»é–³ãƒ¦î‡¢é‹î†¹åŸ—éã‚†å´¡é¡å¿Šå“å¨…î…žåŽ½éˆ·æ°£æ‡‡éˆ§î„î‡¡é¡‘ç‚²æ‚½éˆ­è·ºå…éŽ¹æ¤»æ‡‡é‹æ’´å«¥é‘´æ¬“åž¾å§£î…žä¼„é¡‘ç‚²å…éŽ¹æ¥€æ£Œéˆ§î„îªéï½‚å“é˜å—æ‡‡é‹æ’»åŸ„éˆ·æ°¬å…éŽ¹æ¥€ä¼„éˆ·æ°¬åŽ½éˆ·æ°£æ‡‡é‹æ’´å«¥é‘´æ¥€å´²é‘´æ¬“åž¾å§£î…žä¼„çº¬éã‚†å´¡é¡å¿Šå“å¨…î…žå• éˆ§î„î‡¢é‹î†¹æŒŒéã‚†å´¡é‹î†¹æŒŒéç†²æŒŒéˆ¶â”¾å“å§£î„‰å„ªéšâ‘©åŸ—éï½‚å“å§£î…žä¼„é¡‘ç‚²å…éŽ¹æ¤»æ‡‡é‹æ’³â–Œé‘´æ¬ç€¯é‘ºæŽ—åž¾å§£î„‰å„ªé›îå“å©§å¶…å…éŽ¹æ¥€æ£Œéˆ§î„îªéï½‚å“é˜å—æ‡‡é‹æ’»åŸ„éˆ·æ°¬å…éŽ¹æ¤»æ‡‡é‹ï¿½ é‘´æ¬ç€¯é‘ºæŽ—åž¾å§£î„‰å„ªéˆ¶â”¾å“éè¡¡æŒŒéã‚†å´¡é¡å¿Šå“å¨…î…žåŽ½éˆ·æ°£æ‡‡éˆ§î„î‡¡é”Ÿï¿½ é‘´æ¬’å°ƒé‘´æ¥€ç€¯é‘´æ¬ç€¯é‘ºæŽ—åŸ€é¡‘çŠ«åŸ—é‹î‡…å„ªéç†²æŒŒéˆ¶â•äº¾éŸî‡å‰¹é¨å‹®å‰»é‘¼çŠºåŠƒé–³ãƒ¦îªéï½‚å“é˜å—æ‡‡é‹æ’»åŸ„éˆ·æ°¬å…éŽ¹æ¤»æ‡‡é‹æ’´å«¥é‘´æ¬“åž¾å§£î…žä¼„éˆ·æ°¬å…éŽ¹æ¥€æ£Œéˆ§î„îªéï½‚å“å§£î…žä¼„éˆ·æ°¬å…éŽ¹æ¥€ä¼„éˆ·æ°¬åŽ½éˆ·æ°£æ‡‡é‹æ’´å«¥é‘´æ¥€å´²é‘´æ¬“åž¾çº¬é‹î†¹åŸ—éã‚†å´¡éˆ¶â•äº¾éŽ·Ñ†å‰»é–³ãƒ¦î‡¢é‹î‡…å„ªéã‚†å´¡é¡å¿Šå“å¨…î…žåŽ½éˆ·æ°£æ‡‡éˆ§î„î‡¡é¡‘ç‚²ä¼„çº¬éã‚†å´¡éˆ¶â•äº¾éŽ·Ñ†å‰»é–³ãƒ¦î‡¢é‹î†¹åŸ—éã‚†å´¡é¡å¿Šå“å¨…î…žå• éˆ§î„‚å¦´éˆ¶â•äº¾é–³â”¾æŒŒéã‚†å´¡éˆ¶â•äº¾ é‘´æ¬ç€¯é‘ºæŽ—åž¾å§£î„‰å„ªéˆ¶â”¾å“éè¡¡æŒŒéã‚†å´¡é¡å¿Šå“å¨…î…žå• éˆ§î„î‡¢é‹î†¹æŒŒéã‚†å´¡é‹î†¹æŒŒéç†²æŒŒéˆ¶â”¾å“å§£î„‰å„ªéšâ‘©åŸ—éï½‚å“å§£î…žä¼„é¡‘ç‚²å…éŽ¹æ¤»æ‡‡é‹æ’³â–Œé‘´æ¬“åž¾å§£î…žä¼„éˆ­è·ºå…éŽ¹æ¥€æ£Œéˆ§î„îªéï½‚å“é˜å—æ‡‡é‹æ’»åŸ„éˆ·æ°¬å…éŽ¹æ¥€ä¼„éˆ·æ°¬åŽ½éˆ·æ°£æ‡‡é‹æ’´å«¥é‘´æ¥€å´²é‘´æ¬“åž¾çº¬é‹î†¹åŸ—éã‚†å´¡é¡å¿Šå“å¨…î…žåŽ½éˆ·æ°£æ‡‡éˆ§î„î‡¡é¡‘ç‚²æ‚½éˆ­è·ºå…éŽ¹æ¤»æ‡‡é‹æ’´å«¥é‘´æ¬“åž¾å§£î…žä¼„é”Ÿï¿½) */
  content: "\2728"; 
  
  /* This forces the emoji to render in grayscale */
  filter: grayscale(100%);
  
  /* Space between icon and text */
  margin-right: 5px;
}

/*
  ========================================
  RULE 3: LAYOUT STYLING
  This applies only the layout rules you provided.
  ========================================
*/
a[data-aid="AI Research Assistant"] {
  display: inline-block !important;
  margin-bottom: 0 !important;
  font-weight: normal !important;
  text-align: center !important;
  vertical-align: middle !important;
  touch-action: manipulation !important;
  cursor: pointer !important;
  background-image: none !important;
  border: 1px solid transparent !important;
  white-space: nowrap !important;
  padding: 6px 12px !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
  border-radius: 2px !important;
  -webkit-user-select: none !important;
  -moz-user-select: none !important;
  -ms-user-select: none !important;
  user-select: none !important;
  
  /* This removes the default underline */
  text-decoration: none !important;
}

/*
  ========================================
  NEW RULE 4: REMOVE HOVER UNDERLINE
  This explicitly removes any underline on mouse hover.
  ========================================
*/
a[data-aid="AI Research Assistant"]:hover {
  text-decoration: none !important;
}

/* black checkmark */
.clearRefinementsContainer .clearRefinementsContainerHeader h3 .uxf-check, 
.clearRefinementsContainerFooter h3 .uxf-check {
    color: #231f20 !important;
}


.btn-link {
    color: #2e7c56;
}

.customSections .content a {
    color: #2e7c56; /* De groene kleur uit je eerdere ontwerpen */
    text-decoration: underline;
}

/* 1. Base State: Dark Green (#2e7c56) */
a[data-aid="openAccessLink"], 
a[data-aid="openAccessLink"] span {
    color: #2e7c56 !important;
    text-decoration: none !important; /* Ensure no underline by default */
}

a[data-aid="openAccessLink"] svg g {
    stroke: #2e7c56 !important;
}

a[data-aid="openAccessLink"] svg circle#inner-circle {
    fill: #2e7c56 !important;
}

/* 2. Hover State: Lighter Green (#45b97c) + Underline */
a[data-aid="openAccessLink"]:hover, 
a[data-aid="openAccessLink"]:focus,
a[data-aid="openAccessLink"]:hover span,
a[data-aid="openAccessLink"]:focus span {
    color: #45b97c !important;
    text-decoration: underline !important;
}

/* Change Icon color on hover as well */
a[data-aid="openAccessLink"]:hover svg g,
a[data-aid="openAccessLink"]:focus svg g {
    stroke: #45b97c !important;
}

a[data-aid="openAccessLink"]:hover svg circle#inner-circle,
a[data-aid="openAccessLink"]:focus svg circle#inner-circle {
    fill: #45b97c !important;
}

/* Change the border and shadow glow to Dark Green on Hover and Focus */
.summonBtn.customPrimaryLink:hover,
.summonBtn.customPrimaryLink:focus,
.summonBtn.customPrimaryLink:active {
    border-color: #2e7c56 !important;
    outline-color: #2e7c56 !important;
}

/* Change border color on hover/focus for segmented buttons */
.summonBtn.startSegment:hover,
.summonBtn.startSegment:focus,
.summonBtn.endSegment:hover,
.summonBtn.endSegment:focus {
    border-color: #2e7c56 !important;
    outline-color: #2e7c56 !important;
}

.summonBtn.endSegment {
    background-color: #ffffff !important;
}