/*
 Theme Name:   Bricks Child Theme
 Theme URI:    https://bricksbuilder.io/
 Description:  Use this child theme to extend Bricks.
 Author:       Bricks
 Author URI:   https://bricksbuilder.io/
 Template:     bricks
 Version:      1.1
 Text Domain:  bricks
*/

/* Underline links FIX */
a.brxe-button,
a.bricks-button,
.topmenu a,
.hoofdmenu a,
a .footer-social-tekst,
a .footer-icoon,
.social--div a{
  text-decoration: none !important;
}

.hover--animatie {
  transition: 0.3s;
}


@media (max-width: 767px) {
  .m-hide767 {
    display:none !important;
  }   
}


/* ============================================
   FRONTEND: Scrollen na klikken anker-link FALLBACK > zie JS
   ============================================ */

/* default */
:root{
  --scroll-offset: 108px;
}

/* admin bar */
body.admin-bar{
  --scroll-offset: 150px;
}

/* mobiel */
@media (max-width: 991px){
  :root{
    --scroll-offset: 86px;
  }

  body.admin-bar{
    --scroll-offset: 116px;
  }
}


/* daadwerkelijke scroll */
[id]{
  scroll-margin-top: var(--scroll-offset);
}


/* ============================================
   FRONTEND: Fix voor witrand rechts van full align blokken.
   ============================================ */
@media only screen and (max-width: 991px) {
  .alignfull,.wp-block-categories-list.alignfull {
      left: 50%;
      margin-left: -50vw;
      margin-right: -50vw;
      max-width: calc(100vw - 0em) !important; /* =FIX LMM */
      position: relative;
      right: 50%;
      width: 100vw
  }
}

/* ============================================
   FRONTEND: Marges
   ============================================ */
/* 2. Basis reset voor Gutenberg content in Bricks */
.brxe-post-content:not([data-source="bricks"]) {
    /* optioneel, als je dit niet al ergens anders doet */
    line-height: 1.6;
}

/* 3. Paragrafen & standaard tekstblokken */
.brxe-post-content:not([data-source="bricks"]) p,
.brxe-post-content:not([data-source="bricks"]) .wp-block-paragraph {
    margin: 0 0 1.5em;
}


.brxe-post-content:not([data-source="bricks"]) li > ul,
.brxe-post-content:not([data-source="bricks"]) li > ol {
    margin-top: 0.5em; /* iets ruimte tussen geneste lijsten */
}

/* 6. Blockquotes, pre, code-blokken */
.brxe-post-content:not([data-source="bricks"]) blockquote {
    margin: 2rem 0;
}

.brxe-post-content:not([data-source="bricks"]) pre,
.brxe-post-content:not([data-source="bricks"]) .wp-block-code {
    margin: 1.5rem 0;
}

/* 7. Laatste element in de content geen extra onderruimte */
.brxe-post-content:not([data-source="bricks"]) > *:last-child {
    margin-bottom: 0;
}

/* Geen marge-bottom voor laatste ul of ol */
.tekstblok--tekst > ul:last-child,
.tekstblok--tekst > ol:last-child {
  margin-bottom: 0;
}

/* ================================
   IMAGE / FIGURE BLOCK SPACING FIX
   ================================ */

/* Frontend / Bricks contentgebied */
.brxe-post-content .wp-block-image,
.brxe-post-content figure.wp-block-image {
    margin-top: 0 !important;
    margin-bottom: var(--ruimte-s) !important;
}

/* Laatste image-block in content → geen marge onder */
.brxe-post-content .wp-block-image:last-child,
.brxe-post-content figure.wp-block-image:last-child {
    margin-bottom: 0 !important;
}


/* ==========================================================
   UNIVERSELE BLOCK SPACING
   Frontend + Gutenberg Editor
   ----------------------------------------------------------
   - Elk Gutenberg-block: geen marge boven
   - Elk Gutenberg-block: marge onder var(--ruimte-m)
   - Laatste block: marge onder = 0
   ========================================================== */

/* Paragrafen in Gutenberg-content via Bricks */

.brxe-post-content:not([data-source="bricks"]) p:last-child,
.brxe-post-content:not([data-source="bricks"]) .wp-block-paragraph:last-child {
    margin-bottom: 0 !important;
}
.wp-block-image, .wp-block-video, figure[class^=wp-block-] {
    margin: 0;
}

/* 1. BASIS — ALLE BLOKKEN */
.wp-block {
    margin-top: 0 !important;
    margin-bottom: var(--ruimte-m) !important;
}
.wp-block-list  {
  margin-bottom: var(--ruimte-m);
}

/* 2. LAATSTE BLOCK IN EEN CONTAINER → GEEN ONDERMARGE */
.wp-block:last-child,
figure:last-child,
.button--section:last-child {
    margin-bottom: 0 !important;  
}

/* 3. NESTED BLOCKS (bijv. columns, groups, covers) */
.wp-block:last-child,
.wp-block > .wp-block:last-child,
.wp-block-group > .wp-block:last-child,
.wp-block-column > .wp-block:last-child,
.wp-block-cover > .wp-block:last-child,
.wp-block-media-text__content > .wp-block:last-child,
.brxe-gb-inner-blocks > .button--section:last-child,
.wp-block-list:last-child,{
    margin-bottom: 0 !important;
}

.brxe-post-content p + ul,
.brxe-post-content p + ol{
  margin-top: 0 !important;
}

.brxe-post-content p:has(+ ul),
.brxe-post-content p:has(+ ol){
  margin-bottom: 0 !important;
}


/* ============================================
   FRONTEND: Force footer naar bottom
   ============================================ */
.brx-body {
  min-height:100vh;
  min-height:100dvh;
}





/* ============================================
   FRONTEND: Topmenu toch zichtbaar wanneer ingelogd
   ============================================ */
body.admin-bar .site-header,
body.admin-bar header,
body.admin-bar .brxe-header{
  top: var(--wp-adminbar-h) !important;
}


/* ============================================
   FRONTEND: Topmenu
   ============================================ */
@media only screen and (max-width: 767px) {
  .topmenu__nav-link span.text { display:none; }
}

/* Header verschuiven bij scrollen */
/* Header omhoog schuiven */
header {
  position: fixed;        /* deze had je al werkend */
  top: 0;
  left: 0;
  right: 0;
  z-index: 9999;
  transition: top 0.3s ease;
}

/* Na scroll (100px): header 55px omhoog */
header.header--up {
  top: -50px;
}

/* Container padding aanpassen bij scroll */
.container--scrollen {
  transition: padding 0.3s ease;
}


/* Witruimte in menu */
.menu-witruimte {
  margin-bottom:1.5rem;
}
.menu-vet a {
  font-weight:700 !important;
}
.menu-roze a {
  color:var(--roze) !important;
}
.menu-oranje a {
  color:var(--oranje) !important;
}


/* ============================================
   FRONTEND: Menu inloggen
   ============================================ */
#menu-inloggen .sub-menu {
  margin-left:-1.5rem;
  margin-top:1.2rem;
}
@media (max-width: 991px) {
  #menu-inloggen .sub-menu {
    margin-left:-0.9rem;
    margin-top:1.1rem;
  } 
}

.mobiel-menu--actief a[aria-current="page"] {
  color: #ffffff !important;
}

/* ============================================
   FRONTEND: Zoeken topmenu
   ============================================ */
.top-zoeken .x-search-form {
  max-height:5rem;
}
.top-zoeken .x-header-search_toggle-open-text {
  order: 2;
}
.top-zoeken .x-header-search_toggle-open i {
  order: 1;
}
@media only screen and (max-width: 767px) {
  .top-zoeken .x-header-search_toggle-open-text {
    display:none;
  }
}

/* ============================================
   FRONTEND: Topmenu mobiel menu inspringen
   ============================================ */
.show-mobile-menu .bricks-mobile-menu-wrapper {
  padding:var(--ruimte-m);
}
#menu-hoofdmenu-1 {
  width:100%;
  margin-top: -4px;
}

/* Wrapper van tekst + pijltje */
header .brx-submenu-toggle {
  display: flex;
  align-items: center;
  width: 100%;
}

/* Tekst/link links, neemt alle ruimte */
header .brx-submenu-toggle > a {
  flex: 1;
  display: block;
  text-align: left;
}

/* Pijltje helemaal rechts */
header .brx-submenu-toggle > button {
  flex-shrink: 0;
  margin-left: auto;
}
header ul.brx-submenu-positioned > li:last-child {
  margin-bottom: var(--ruimte-s);
}


/* ============================================
   FRONTEND: Mobielmenu
   ============================================ */
@media (max-width: 991px) {

  /* JOUW FIX: maar correct gescope'd op hetzelfde element */
  #brxe-uqfufg.show-mobile-menu.hoofdmenu .bricks-mobile-menu-wrapper:before {
    margin-top: 13.4rem;
    padding-top: 13.4rem;
  }

  .header--up #brxe-uqfufg.show-mobile-menu.hoofdmenu .bricks-mobile-menu-wrapper:before {
    margin-top: 8.4rem;
    padding-top: 8.4rem;
  }

  /* Scrollbaar hoofdmenu */
  .show-mobile-menu.hoofdmenu .bricks-mobile-menu-wrapper {
    margin-top: 0 !important;

    max-height: 100vh;
    max-height: 100dvh;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;

    padding-top: 13.8rem !important;
    padding-left: var(--ruimte-m);
    padding-right: var(--ruimte-m);
    padding-bottom: var(--ruimte-m);
  }

  .header--up .show-mobile-menu.hoofdmenu .bricks-mobile-menu-wrapper {
    padding-top: 9rem !important;
  }

  /* Submenu’s meescrollend */
  .hoofdmenu ul.brx-submenu-positioned {
    position: static !important;
    inset: auto !important;
    transform: none !important;
    padding-bottom: var(--ruimte-s);
  }

  
   /* Uitlijnen submenu-items met > */
  #menu-hoofdmenu-1 .bricks-menu-item a {
     margin-bottom:-0.4rem !important;
  }
  #menu-hoofdmenu-1 .bricks-menu-item {
    padding-top:0rem !important;
  } 
  #menu-hoofdmenu-1 .menu-item-has-children .brx-submenu-toggle a {
     margin-bottom:-0.2rem !important;
  }
  #menu-hoofdmenu-1 .menu-item-has-children .brx-submenu-toggle {
    padding-top:0.2rem !important;
  }  
}
@media (max-width: 768px) {

  /* JOUW FIX: maar correct gescope'd op hetzelfde element */
  #brxe-uqfufg.show-mobile-menu.hoofdmenu .bricks-mobile-menu-wrapper:before {
    margin-top: 13.4rem;
    padding-top: 14rem;
  }
}



/* ============================================
   GBR: Startblok
   ============================================ */
/* Direct naar */
.startblok--direct h2 {
  font-size:var(--kop-s);
  margin-bottom:0.5rem;
}
.startblok--direct ul {
  margin: 0;
  padding: 0;
  list-style: none; 
}
.startblok--direct ul li a:hover {
  color:var(--blauw-halve-hover);
}

/* Ronde foto's */
@media (max-width: 1300px) {
  .ronde-foto3 { display:none; }
}

/* Broodkruimels */
.brxe-breadcrumbs .item[aria-current="page"] {
  text-decoration:none !important;
}

/* Achtergrond Geel met beeldmerk */
.section--beeldmerk-geel {
  background-color: var(--geel-2);
  background-image: url('/wp-content/uploads/beeldmerk-geel-breed-v3.png');
  background-repeat: no-repeat;
  background-position: top center;
  background-size: auto;
}
/* Achtergrond Roze met beeldmerk */
.section--beeldmerk-roze {
  background-color: var(--roze-2);
  background-image: url('/wp-content/uploads/beeldmerk-roze-breed-v3.png');
  background-repeat: no-repeat;
  background-position: top center;
  background-size: auto;
}
/* Achtergrond Oranje met beeldmerk */
.section--beeldmerk-rood {
  background-color: var(--oranje-2);
  background-image: url('/wp-content/uploads/beeldmerk-rood-breed-v3.png');
  background-repeat: no-repeat;
  background-position: top center;
  background-size: auto;
}
/* Achtergrond Wit zonder beeldmerk */
.section--wit {
  background-color: var(--wit);
}
/* Achtergrond Geel zonder beeldmerk */
.section--geel {
  background-color: var(--geel-2);
}
/* Achtergrond Roze zonder beeldmerk */
.section--roze {
  background-color: var(--roze-2);
}
/* Achtergrond Oranje zonder beeldmerk */
.section--rood {
  background-color: var(--oranje-2);
}
/* Achtergrond Blauw zonder beeldmerk */
.section--blauw {
  background-color: var(--blauw);
  color:var(--wit);
}

/* ============================================
   GBR: Accordion Hover per achtergrondkleur
   ============================================ */
.section--wit .accordion--los .accordion-title-wrapper {
  transition: 0.3s;
}
.section--wit .accordion--los .accordion-title-wrapper:hover {
  background-color:#e6eff6;
  transition: 0.3s;
}
.section--geel .accordion--los .accordion-title-wrapper {
  transition: 0.3s;
}
.section--geel .accordion--los .accordion-title-wrapper:hover {
  background-color:#E6DDBF;
  transition: 0.3s;
}
.section--roze .accordion--los .accordion-title-wrapper {
  transition: 0.3s;
}
.section--roze .accordion--los .accordion-title-wrapper:hover {
  background-color:#F0CBD7;
  transition: 0.3s;
}
.section--rood .accordion--los .accordion-title-wrapper {
  transition: 0.3s;
}
.section--rood .accordion--los .accordion-title-wrapper:hover {
  background-color:#F5D0C1;
  transition: 0.3s;
}


/* ============================================
   GBR: Kleur Buttons
   ============================================ */
.buttons--blauw .button--vol { background-color: var(--blauw); border: 1px solid var(--blauw); color:var(--wit) !important; }
.buttons--groen .button--vol { background-color: var(--groen); border: 1px solid var(--groen); color:var(--wit) !important; }
.buttons--roze .button--vol { background-color: var(--roze); border: 1px solid var(--roze); color:var(--wit) !important; }
.buttons--oranje .button--vol { background-color: var(--oranje); border: 1px solid var(--oranje); color:var(--wit) !important;}

.buttons--blauw .button--vol:hover { background-color: var(--blauw-hover); border: 1px solid var(--blauw-hover); color:var(--wit) !important; }
.buttons--groen .button--vol:hover { background-color: var(--groen-hover); border: 1px solid var(--groen-hover); color:var(--wit) !important;}
.buttons--roze .button--vol:hover { background-color: var(--roze-hover); border: 1px solid var(--roze-hover); color:var(--wit) !important; }
.buttons--oranje .button--vol:hover { background-color: var(--oranje-hover); border: 1px solid var(--oranje-hover); color:var(--wit) !important;}

.buttons--blauw .button--outline { border: 1px solid var(--blauw); color:var(--blauw) !important; }
.buttons--groen .button--outline { border: 1px solid var(--groen); color:var(--groen) !important; }
.buttons--roze .button--outline { border: 1px solid var(--roze); color:var(--roze) !important; }
.buttons--oranje .button--outline { border: 1px solid var(--oranje); color:var(--oranje) !important; }

.buttons--blauw .button--outline:hover { border: 1px solid var(--blauw-hover); color:var(--blauw-hover) !important; background-color: var(--blauw-2); }
.buttons--groen .button--outline:hover { border: 1px solid var(--groen-hover); color:var(--groen-hover) !important; background-color: var(--groen-2); }
.buttons--roze .button--outline:hover { border: 1px solid var(--roze-hover); color:var(--roze-hover) !important; background-color: var(--roze-2); }
.buttons--oranje .button--outline:hover { border: 1px solid var(--oranje-hover); color:var(--oranje-hover) !important; background-color: var(--oranje-2); }

/* Download-icoon toevoegen aan button */
a.button--vol[aria-label*="Download"] {
  display: inline-flex;
  align-items: center;
  gap: 0.5em; /* ruimte tussen icoon en tekst */
}

/* Download-icoon vóór de tekst */
a.button--vol[aria-label*="Download"]::before {
  content: "";
  width: 1em;
  height: 1em;
  display: inline-block;

  background-image: url("/wp-content/uploads/download.svg");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;

  /* optioneel: kleur via filter (bij witte svg) */
  /* filter: invert(1); */
}


/* BLAUW */
.buttons--blauw a.button--outline[aria-label*="Download"] {
  display: inline-flex;
  align-items: center;
  gap: 0.5em; /* ruimte tussen icoon en tekst */
}
.buttons--blauw a.button--outline[aria-label*="Download"]::before{
  content: "";
  width: 1em;
  height: 1em;
  display: inline-block;
  background-color: var(--blauw);
  -webkit-mask: url("/wp-content/uploads/download.svg") no-repeat center;
  mask: url("/wp-content/uploads/download.svg") no-repeat center;
  -webkit-mask-size: contain;
  mask-size: contain;
}
.buttons--blauw a.button--outline[aria-label*="Download"]:hover::before{
  background-color: var(--blauw-hover);
}
/* GROEN */
.buttons--groen a.button--outline[aria-label*="Download"] {
  display: inline-flex;
  align-items: center;
  gap: 0.5em; /* ruimte tussen icoon en tekst */
}
.buttons--groen a.button--outline[aria-label*="Download"]::before{
  content: "";
  width: 1em;
  height: 1em;
  display: inline-block;
  background-color: var(--groen);
  -webkit-mask: url("/wp-content/uploads/download.svg") no-repeat center;
  mask: url("/wp-content/uploads/download.svg") no-repeat center;
  -webkit-mask-size: contain;
  mask-size: contain;
}
.buttons--groen a.button--outline[aria-label*="Download"]:hover::before{
  background-color: var(--groen-hover);
}
/* ROZE */
.buttons--roze a.button--outline[aria-label*="Download"] {
  display: inline-flex;
  align-items: center;
  gap: 0.5em; /* ruimte tussen icoon en tekst */
}
.buttons--roze a.button--outline[aria-label*="Download"]::before{
  content: "";
  width: 1em;
  height: 1em;
  display: inline-block;
  background-color: var(--roze);
  -webkit-mask: url("/wp-content/uploads/download.svg") no-repeat center;
  mask: url("/wp-content/uploads/download.svg") no-repeat center;
  -webkit-mask-size: contain;
  mask-size: contain;
}
.buttons--roze a.button--outline[aria-label*="Download"]:hover::before{
  background-color: var(--roze-hover);
}
/* ORANJE */
.buttons--oranje a.button--outline[aria-label*="Download"] {
  display: inline-flex;
  align-items: center;
  gap: 0.5em; /* ruimte tussen icoon en tekst */
}
.buttons--oranje a.button--outline[aria-label*="Download"]::before{
  content: "";
  width: 1em;
  height: 1em;
  display: inline-block;
  background-color: var(--oranje);
  -webkit-mask: url("/wp-content/uploads/download.svg") no-repeat center;
  mask: url("/wp-content/uploads/download.svg") no-repeat center;
  -webkit-mask-size: contain;
  mask-size: contain;
}
.buttons--oranje a.button--outline[aria-label*="Download"]:hover::before{
  background-color: var(--oranje-hover);
}



/* ============================================
   GBR: UL en OL
   ============================================ */
/* Netjes laten lijnen van bullets */
.startblok--intro ul,
.startblok--intro ol,
ul.wp-block-list,
ol.wp-block-list,
.tekstblok--tekst ul,
.tekstblok--tekst ol {
  margin: 0;
  margin-bottom:var(--ruimte-m);
  padding-left: 1.25em;      /* ruimte voor bullets / cijfers */
  list-style-position: outside;
}

.startblok--intro ul li,
ul.wp-block-list li,
.tekstblok--tekst ul li {
  margin-left: 0.05em;            /* <-- deze dus NIET gebruiken bij OL */
}
.startblok--intro ol li,
ol.wp-block-list li,
.tekstblok--tekst ol li {
  margin-left: 0.7em;   
}


/* ============================================
   FRONTEND: Roze linkjes
   ============================================ */
.startblok--intro a,
.tekstblok--tekst a {
  color: var(--roze) !important;
}
.startblok--intro a:hover,
.tekstblok--tekst a:hover {
  color: var(--roze) !important;
}




/* ============================================
   FRONTEND: H-titels
   ============================================ */
h3.wp-block-heading,
.tekstblok--tekst h3 { 
  margin-bottom:0.1em;
}

/* ============================================
   FRONTEND: Footer Tekst
   ============================================ */
.footer-tekst a {
  text-decoraion: underline;
}

/* ============================================
   FRONTEND: USP-grid
   ============================================ */
.usp--grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); /* Deze regels staat ook in Bricks */
  gap: var(--ruimte-l);
  width: 100%;
  margin-inline: auto;
}
.usp--grid:has(> :nth-child(1):nth-last-child(-n+4)) {
  max-width: 80%;
}

@media (max-width: 1280px) {
  .usp--grid {
    grid-template-columns: repeat(3, 1fr);
    max-width: 100%; /* geen 80% op tablet */
  }
  .usp--grid:has(> :nth-child(1):nth-last-child(-n+4)) {
    max-width: 80%;
    grid-template-columns: repeat(2, 1fr);
  }  
}

@media (max-width: 767px) {
  .usp--grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .usp--grid:has(> :nth-child(1):nth-last-child(-n+4)) {
    max-width: 100%;
    grid-template-columns: repeat(2, 1fr);
  }    
}

@media (max-width: 479px) {
  .usp--grid {
    grid-template-columns: 1fr;
  }
  .usp--grid:has(> :nth-child(1):nth-last-child(-n+4)) {
    max-width: 100%;
    grid-template-columns: 1fr;
  }   
}


/* ============================================
   FRONTEND: TablePress
   ============================================ */
.tablepress thead tr > *,
.tablepress tfoot tr > * {
	background-color: transparent !important;
	color: var(--blauw) !important;
  border-bottom:1px solid var(--blauw) !important;
}
.tablepress>:where(tbody)>tr>* {
    color: var(--blauw) !important;
}
.tablepress {
    --text-color: var(--blauw) !important;
    --head-text-color: var(--blauw) !important;
    --head-bg-color: transparent !important;
    --odd-text-color: var(--blauw) !important;
    --odd-bg-color: transparent !important;
    --even-text-color: var(--blauw) !important;
    --even-bg-color: transparent !important;
    --hover-text-color: var(--blauw) !important;
    --hover-bg-color: transparent !important;
    --border-color: var(--blauw) !important;
    --padding: 0.7rem !important;
    font-size: var(--tekst-m) !important;
    line-height:1.6 !important;
    font-weight: 400 !important;
    border-bottom:1px solid var(--blauw) !important;
}
.vakantie--tabel table {
  width: 100%;
  table-layout: fixed;
}
.tablepress>:not(caption)>*>* {
    padding-left: 0px !important;
}


/* ============================================
   FRONTEND: Nieuw scherm-icoontje bij tekstlinks met target _blank
   ============================================ */
/* alleen tekstlinks die een nieuw scherm openen */
.brxe-post-content a[target="_blank"]:not(.button):not([class*="button"]):not([class*="download--tekst"]):not([class*="linkblok--container"]):not([class*="geen-blank-icoon"]):not([class*="sbi_header_link"])::after{ 
  content: ""; 
  display: inline-block; 
  width: .9em; 
  height: .9em; 
  margin-left: .25em; 
  vertical-align: baseline; 
  transform: translateY(0.09em); 
  background-color: currentColor; 
  mask: url("/wp-content/uploads/nieuw-scherm.svg") no-repeat center / contain; 
  -webkit-mask: url("/wp-content/uploads/nieuw-scherm.svg") no-repeat center / contain; 
}
.geen-text-decoration { text-decoration:none !important; }


/* ============================================
   FRONTEND: Documenten
   ============================================ */
a.download--tekst {
  text-decoration:none !important;
  transition: 0.3s;
}
a.download--tekst:hover {
  transition: 0.3s;
}

/* 1) Standaard: geen lijn */
.download--lijst a.download--tekst{
  border-bottom: 0 !important;
}

/* 2) Alleen de laatste download--block die NOG een download--tekst heeft
      (dus tekstblok--tekst blocks tellen niet mee) */
.download--lijst .download--block:has(a.download--tekst)
  :where(a.download--tekst){
  border-bottom: 0 !important; /* expliciet, mag */
}

/* 3) …en dan: de laatste “download--block met download--tekst”
      = een download--block die wel een download--tekst heeft,
      maar GEEN volgende download--tekst meer in latere blocks. */
.download--lijst .download--block:has(a.download--tekst):not(:has(~ .download--block a.download--tekst))
  a.download--tekst{
  border-bottom: 1px solid var(--blauw) !important;
}


/* ============================================
   FRONTEND: FAQ
   ============================================ */
.faq--accordion .accordion-title-wrapper {
  text-decoration:none !important;
  transition: 0.3s;
}
.faq--accordion .accordion-title-wrapper:hover {
  text-decoration:none !important;
  transition: 0.3s;
}

/* Accordion los */
/* standaard: border onder elke accordion */
.tekstblok--tekst .accordion--los{
  border-bottom: 1px solid var(--blauw);
}

/* als er (met alleen scripts ertussen) nog een accordion volgt → border weg */
.tekstblok--tekst .accordion--los:has(+ .accordion--los),
.tekstblok--tekst .accordion--los:has(+ script + .accordion--los),
.tekstblok--tekst .accordion--los:has(+ script + script + .accordion--los),
.tekstblok--tekst .accordion--los:has(+ script + script + script + .accordion--los){
  border-bottom: 0;
}

/* ============================================
   FRONTEND: Vakken
   ============================================ */
.vak--positie {
  order: 0;
}
.vak--positie[data-positie="1"] {
  order: 1;
}
.vak--container:last-child {
  margin-bottom:0px !important;
}


/* ============================================
   FRONTEND: Video Home
   ============================================ */
.video-home--titel strong {
  display:block;
}


/* ============================================
   FRONTEND: 4x Linkblokken
   ============================================ */
.linkblok--geel .linkblok--container {
  background-color: var(--geel-2);
}
.linkblok--geel .linkblok--container:hover {
  background-color: var(--geel-3);
}

.linkblok--roze .linkblok--container {
  background-color: var(--roze-2);
}
.linkblok--roze .linkblok--container:hover {
  background-color: var(--roze-3);
}

.linkblok--rood .linkblok--container {
  background-color: var(--oranje-2);
}
.linkblok--rood .linkblok--container:hover {
  background-color: var(--oranje-3);
}

/* ============================================
   FRONTEND: Meldingen
   ============================================ */
.melding--banner { display:none !important; }
.melding--data-banner { display:none !important; }


/* ============================================
   FRONTEND: Telefoon-icoon
   ============================================ */
/* Tel-links als nette inline-flex */
.brxe-post-content a[href^="tel:"]:not(.button):not([class*="button"]){
  display: inline-flex;
  align-items: baseline;
  gap: .3em;
}

/* Telefoon icoon */
.brxe-post-content a[href^="tel:"]:not(.button):not([class*="button"])::before{
  content: "";
  width: 1.1em;
  height: 1.1em;
  flex: 0 0 1.1em;
  transform: translateY(.18em); /* ← hiermee speel je */
  background-color: currentColor;
  mask: url("https://wwwrietlandcollegeed8b9.zapwp.com/q:u/r:0/wp:0/w:1/u:https://www.rietlandcollege.nl/wp-content/uploads/telefoon.svg") no-repeat center / contain;
  -webkit-mask: url("https://wwwrietlandcollegeed8b9.zapwp.com/q:u/r:0/wp:0/w:1/u:https://www.rietlandcollege.nl/wp-content/uploads/telefoon.svg") no-repeat center / contain;
}


/* ============================================
   FRONTEND: Agenda
   ============================================ */
.agenda--maand-titel {
  text-transform: capitalize;
}
.agenda--border {
  border:2px solid var(--blauw) !important;
  border-radius: 1.8rem !important;
  padding: var(--ruimte-s);
}
.agenda--border .x-slider_slide {
    padding: 0;
}
.agenda--border a {
  color: var(--blauw) !important;
}



/* ============================================
   FRONTEND: Instagram Feed
   ============================================ */
.sb_instagram_header {
    padding: 0;
}

/* ============================================
   FRONTEND: Zoeken
   ============================================ */
.zoeken--link a { 
  color:var(--roze);
  font-size:var(--tekst-s);
}

/* ============================================
   FRONTEND: Popup
   ============================================ */
body.popup-disabled .brx-popup {
  display: none !important;
}