/*
Theme Name: Salient Child Theme
Description: This is a custom child theme for Salient
Theme URI:   https://themeforest.net/item/salient-responsive-multipurpose-theme/4363266
Author: ThemeNectar
Author URI:  https://themeforest.net/user/themenectar
Template: salient
Version: 1.0
*/

/*load different types with relative paths to the font files*/
@font-face {
    font-family: 'ginto_nord';
    src: url('/wp-content/themes/salient-child/fonts/ginto_nord_black.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}


/*Event calendar overzicht*/
.tribe-events-pro-photo .tribe-common-g-row li
{
	list-style:none !important;
}

.tribe-common-h6{
	font-family: "ginto_nord" !important;
}

.tribe-common-l-container.tribe-events-l-container{
	padding-top:0px !important;
}

.tribe-common-c-btn.tribe-events-c-search__button{
	font-size:14px !important;
}

/*Event calendar single*/

.container-header{
	padding-top: 30px;
	padding-bottom: 30px;
}  
.component-image {
    height: 40vh;
    overflow: hidden;
}

.component-image__picture {
    display: block;
    width: 100%;
    height: 100%;
}

.component-image__picture img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}
.header-event__meta{
    display: flex;
    align-items: flex-start;
    margin-top: 3.125rem;
}

.link-arrow-left{
	font-family: "ginto_nord";
}
.link-arrow-left svg{
	vertical-align: middle;
    margin-right: 10px;
}
.link-arrow-left a:hover svg{
	color:black;
}
.tribe-events-single-event-title{
	font-family: "ginto_nord";
}

   

/*Oude COC site*/
.header-event__themes.tags > li{
font-size: .75rem;
    line-height: 1.666;
    font-weight: 500;
    padding: .1875rem .75rem;
    background-color: #ffff6c;
    display: inline-block;
    text-transform: uppercase;
    float: left;
    letter-spacing: 1px;
}
.header-event__meta > div{
	display:none;
}
.tribe-events-pg-template{
	max-width: 100% !important;
	padding: 0px 20px!important;
}
.tribe-events-pg-template .tribe_events{
	background-color: #ffff6c;
	padding: 50px;
}
.tribe-events-pro-photo__event-title.tribe-common-h6{
	font-family: "ABD Ginto Nord Variable";
    font-size: 1.3125rem;
    line-height: 1.523;
    letter-spacing: -.02em;
    font-weight: 300;
}
.tribe-events-pro-photo__event:hover article{
	background-color: black;
}
.tribe-events-pro-photo__event:hover, .tribe-events-pro-photo__event:hover .tribe-events-pro-photo__event-date-tag-month, .tribe-events-pro-photo__event:hover .tribe-common-h5, .tribe-events-pro-photo__event:hover .tribe-common-h6, .tribe-events-pro-photo__event:hover .tribe-events-pro .tribe-events-pro-photo__event-datetime, .tribe-events-pro-photo__event:hover .tribe-events-pro-photo__event-title-link{
	color: #fff!important;
}
.single-tribe_events .tribe-events-c-subscribe-dropdown .tribe-events-c-subscribe-dropdown__button.tribe-events-c-subscribe-dropdown__button--active, .single-tribe_events .tribe-events-c-subscribe-dropdown .tribe-events-c-subscribe-dropdown__button:focus, .single-tribe_events .tribe-events-c-subscribe-dropdown .tribe-events-c-subscribe-dropdown__button:focus-within, .single-tribe_events .tribe-events-c-subscribe-dropdown .tribe-events-c-subscribe-dropdown__button:hover, .tribe-events .tribe-events-c-subscribe-dropdown .tribe-events-c-subscribe-dropdown__button.tribe-events-c-subscribe-dropdown__button--active, .tribe-events .tribe-events-c-subscribe-dropdown .tribe-events-c-subscribe-dropdown__button:focus, .tribe-events .tribe-events-c-subscribe-dropdown .tribe-events-c-subscribe-dropdown__button:focus-within, .tribe-events .tribe-events-c-subscribe-dropdown .tribe-events-c-subscribe-dropdown__button:hover{
	border-radius:0px!important;
	background-color: #ffff6c;
}
.single-tribe_events .tribe-events-c-subscribe-dropdown .tribe-events-c-subscribe-dropdown__button-text, .single-tribe_events .tribe-events-c-subscribe-dropdown button.tribe-events-c-subscribe-dropdown__button-text, .tribe-events .tribe-events-c-subscribe-dropdown .tribe-events-c-subscribe-dropdown__button-text, .tribe-events .tribe-events-c-subscribe-dropdown button.tribe-events-c-subscribe-dropdown__button-text{
	color: black;
}
.tribe-common .tribe-common-c-btn-border, .tribe-common a.tribe-common-c-btn-border{
	border: 1px solid black;
}
:root{
	--tec-color-accent-primary: #ffff6c!important;
	--tec-color-background-events-bar-submit-button-hover: black!important;
--tec-color-background-events-bar-submit-button: black!important;
	--tec-color-link-accent: black!important;
}
.tribe-common .agenda-overview__title{
    padding: 4.5rem 0;
    max-width: 1000px;
}
.tribe-common .title--heading-1 {
	font-family: "ABD Ginto Nord Variable";
	font-size: 5.5rem;
    line-height: 1.102;
    font-weight: 775;
}
.tribe-events-pg-template .tribe-events-before-html{
	display:none;
}
@media (min-width: 1000px) {
    .tribe-events-meta-group {
        padding: var(--tec-spacer-7) 0 var(--tec-spacer-3);
        width: 333px; */
    }
}

/*V1*/
.light a{
    color: #fff;
    text-decoration: underline;
}
.nectar-button.jumbo{
    width: 100%;
    text-align:center;
}
.tribe-common .tribe-common-cta--thin-alt:active, .tribe-common .tribe-common-cta--thin-alt:focus, .tribe-common .tribe-common-cta--thin-alt:hover,.tribe-common .tribe-common-cta--thin-alt,.tribe-events .tribe-events-c-ical__link,.tribe-events-pro .tribe-events-pro-map__event-card-wrapper--active .tribe-events-pro-map__event-card-button{
border-color: #d3467d;    
}
.tribe-common .tribe-common-cta--thin-alt:active, .tribe-common .tribe-common-cta--thin-alt:focus, .tribe-common .tribe-common-cta--thin-alt:hover,.tribe-common .tribe-common-c-svgicon,.tribe-events .tribe-events-c-ical__link,.tribe-events .tribe-events-calendar-month__day--current .tribe-events-calendar-month__day-date, .tribe-events .tribe-events-calendar-month__day--current .tribe-events-calendar-month__day-date-link,.tribe-events-event-meta a, .tribe-events-event-meta a:visited, .tribe-events-cal-links .tribe-events-gcal, .tribe-events-cal-links .tribe-events-ical{
    
    color: #d3467d;
}
.tribe-events .tribe-events-c-ical__link:active, .tribe-events .tribe-events-c-ical__link:focus, .tribe-events .tribe-events-c-ical__link:hover{
        background-color: #d3467d;
}
.tribe-events-event-image img{
    max-width: 100%;
    height: auto;
}
.tribe-events-single .tribe-events-sub-nav .tribe-events-nav-next, .tribe-events-single .tribe-events-sub-nav .tribe-events-nav-previous{
    list-style: none;
}
.pt-checkout-form{
    width: auto;
}
.pt-radio-group label{
    float: left;
border: solid 1px rgba(0,0,0,0.1);
border-radius: 5px;
padding: 10px;
margin-right: 5px;
width: 20%;
}
#header-outer.transparent:not(.dark-slide) #top nav > ul > li > a{text-shadow: 2px 2px #333;}

/* =========================================
   Over COC – Jaartijdlijn
   ========================================= */

/* Kleuren op één plek, makkelijk aan te passen */
.jaartijdlijn {
  --kleur-1: #ec1c24;                  /* rood   */
  --kleur-2: #fca600;                  /* oranje */
  --kleur-3: #ffff6c;                  /* geel   */
  --kleur-4: var(--coc-main, #008f4e); /* groen  */
  --kleur-5: #0100d0;                  /* blauw  */
  --kleur-6: #b75de7;                  /* paars  */
  --kleur-7: #ffbef2;                  /* roze   */
  --kleur-8: #562900;                  /* bruin  */
}

/* Elke toggle krijgt zijn kleur via de cyclus van 8 */
.jaartijdlijn .toggle:nth-child(8n+1) { --bg: var(--kleur-1); --tekst: #fff; }
.jaartijdlijn .toggle:nth-child(8n+2) { --bg: var(--kleur-2); --tekst: #fff; }
.jaartijdlijn .toggle:nth-child(8n+3) { --bg: var(--kleur-3); --tekst: #000; }
.jaartijdlijn .toggle:nth-child(8n+4) { --bg: var(--kleur-4); --tekst: #fff; }
.jaartijdlijn .toggle:nth-child(8n+5) { --bg: var(--kleur-5); --tekst: #fff; }
.jaartijdlijn .toggle:nth-child(8n+6) { --bg: var(--kleur-6); --tekst: #fff; }
.jaartijdlijn .toggle:nth-child(8n+7) { --bg: var(--kleur-7); --tekst: #fff; }
.jaartijdlijn .toggle:nth-child(8n+8) { --bg: var(--kleur-8); --tekst: #fff; }

/* De kleur daadwerkelijk toepassen */
.jaartijdlijn .toggle {
  background-color: var(--bg);
  color: var(--tekst);
}
.jaartijdlijn .toggle a,
.jaartijdlijn .toggle h4,
.jaartijdlijn .toggle h5,
.jaartijdlijn .toggle p {
  color: var(--tekst) !important;
}

/* =========================================
   Zwart introvak links (alle schermen)
   ========================================= */
.jaartijdlijn-intro {
  background-color: #000 !important;   /* zwart op de buitenste kolom */
  color: #fff;
}
.jaartijdlijn-intro h1,
.jaartijdlijn-intro h2,
.jaartijdlijn-intro h3,
.jaartijdlijn-intro p {
  color: #fff !important;
}
/* Mobiel: zelfde zijruimte als de rest van de site (6%) */
.jaartijdlijn-intro .wpb_wrapper {
  padding: 40px 6%;
}

@media (min-width: 1000px) {
  .jaartijdlijn-intro .wpb_wrapper {
    padding-top: 60px;
    padding-right: 50px;
    padding-bottom: 60px;
    padding-left: max(
      90px,                                  /* containerpadding */
      calc((100vw - 1500px) / 2 + 90px)      /* lijnt uit met de container */
    );
  }
}

/* =========================================
   Horizontale accordion (vanaf 1000px)
   ========================================= */
@media (min-width: 1000px) {

  /* === Introvak: even hoog als de stroken === */
  .jaartijdlijn-intro {
    align-self: stretch;
    height: auto !important;
    min-height: 600px;
    padding: 0 !important;             /* geen witte rand om het zwart */
  }
  

  /* === Scrollbaar gebied rechts === */
  .jaartijdlijn .toggles {
    display: flex;
    height: 600px;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: thin;             /* Firefox */
    scrollbar-color: #000 transparent; /* Firefox: balk / baan */
  }
  .jaartijdlijn .toggles::-webkit-scrollbar {
    height: 10px;                      /* Chrome / Safari */
  }
  .jaartijdlijn .toggles::-webkit-scrollbar-track {
    background: transparent;
  }
  .jaartijdlijn .toggles::-webkit-scrollbar-thumb {
    background: #000;
    border-radius: 5px;
  }

  /* === Stroken === */
  .jaartijdlijn .toggle {
    position: relative;
    flex: 0 0 60px;                    /* dichte strook */
    margin: 0 !important;
    border: 0 !important;
    overflow: hidden;
    transition: flex-basis 0.5s ease;
  }
  .jaartijdlijn .toggle.open {
    flex: 0 0 500px;                   /* open strook */
  }
  .jaartijdlijn .toggle:not(.open) {
    cursor: pointer;
  }

  /* === Jaartal (eerste element in de toggle) === */
  .jaartijdlijn .toggle > :first-child {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 60px;
    margin: 0 !important;
    padding: 20px 0 !important;
    z-index: 2;
    display: flex;
    align-items: center;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
  }

  /* Alle lijnen, randen en onderstrepingen binnen de titel weg */
  .jaartijdlijn .toggle > :first-child,
  .jaartijdlijn .toggle > :first-child * {
    border: 0 !important;
    box-shadow: none !important;
    text-decoration: none !important;
    background: none !important;
  }

  /* Link vult de hele strook = hele strook klikbaar */
  .jaartijdlijn .toggle > :first-child a {
    flex: 1 1 auto;                    /* vult de hoogte */
    align-self: stretch;               /* vult de breedte */
    display: flex;
    align-items: center;               /* jaartal gecentreerd */
    padding: 0 !important;
    margin: 0 !important;
    font-size: 28px !important;
    line-height: 1 !important;
    font-weight: 900;
    white-space: nowrap;
  }

  /* Plus-icoon en pseudo-elementen weg */
  .jaartijdlijn .toggle > :first-child i,
  .jaartijdlijn .toggle > :first-child svg,
  .jaartijdlijn .toggle > :first-child [class*="icon"],
  .jaartijdlijn .toggle > :first-child::before,
  .jaartijdlijn .toggle > :first-child::after,
  .jaartijdlijn .toggle > :first-child *::before,
  .jaartijdlijn .toggle > :first-child *::after {
    display: none !important;
  }

  /* Open strook: groter jaartal, niet dichtklikbaar */
  .jaartijdlijn .toggle.open > :first-child {
    width: 110px;
    pointer-events: none;
  }
  .jaartijdlijn .toggle.open > :first-child a {
    font-size: 90px !important;
  }

  /* === Inhoud (laatste element in de toggle) === */
  .jaartijdlijn .toggle > :last-child {
    display: block !important;
    height: auto !important;
    width: 500px;
    padding: 50px 40px 50px 130px !important;
    opacity: 0;
    transition: opacity 0.2s ease;
  }
  .jaartijdlijn .toggle.open > :last-child {
    opacity: 1;
    transition-delay: 0.3s;
  }
}
/* =========================================
   Mobiel (kleiner dan 1000px)
   ========================================= */
@media (max-width: 999px) {

  	/* Plus-icoon weg */
  	.jaartijdlijn .toggle > :first-child i,
  	.jaartijdlijn .toggle > :first-child svg,
  	.jaartijdlijn .toggle > :first-child [class*="icon"],
  	.jaartijdlijn .toggle > :first-child::before,
  	.jaartijdlijn .toggle > :first-child::after,
  	.jaartijdlijn .toggle > :first-child *::before,
  	.jaartijdlijn .toggle > :first-child *::after {
    	display: none !important;
  	}

  	/* Jaartal: zelfde zijruimte als de container (6%) */
  	.jaartijdlijn .toggle > :first-child a {
    	padding-left: 6% !important;
    	padding-right: 6% !important;
  	}

  	  /* Inhoud: padding op wat erin zit, zodat dichtklappen goed werkt */
  	.jaartijdlijn .toggle > :last-child > * {
    	padding-left: 6% !important;
    	padding-right: 6% !important;
    	padding-bottom: 30px !important;
  	}
	
	/* streep onder de jaartallen weg */
	 .jaartijdlijn .toggle > :first-child,
  	.jaartijdlijn .toggle > :first-child * {
    	border: 0 !important;
    	box-shadow: none !important;
    	text-decoration: none !important;
  	}
}

/* Over ons tekst met schadu in header */
.tekst-met-schaduw {
  	text-shadow:
    	0 2px 2px rgba(0, 0, 0, 0.5),    /* scherpe schaduw dichtbij */
    	0 4px 10px rgba(0, 0, 0, 0.5);   /* zachte gloed eromheen */
}

/* Popup blijft zichtbaar zolang de muis op het plusje óf de popup staat */
.coc-kaart .nectar_hotspot_wrap:hover .nttip,
.coc-kaart .nttip:hover {
  opacity: 1 !important;
  visibility: visible !important;
  display: block !important;
  pointer-events: auto !important;
}

/* Hotspot waar je op staat komt boven de andere hotspots */
.coc-kaart .nectar_hotspot_wrap:hover {
  z-index: 10000 !important;
}

/* Onzichtbare brug tussen plusje en popup */
.coc-kaart .nttip::before {
  content: "";
  position: absolute;
  top: -30px;
  right: -30px;
  bottom: -30px;
  left: -30px;
  z-index: -1;
}

/* Underline in knop weghalen */
.nectar-cta .link_text {
	text-decoration: none;
}