/*
Theme Name: Customizr Child
Theme URI: https://innerwavemorocco.com
Description: Child theme van Customizr voor Inner Wave Morocco
Author: Larissa
Template: customizr
Version: 1.0.0
*/

/* === Jouw aangepaste stijlen === */

/* Achtergrond voor de hele pagina: zacht beige met een vaste afbeelding gecentreerd bovenaan */
body {
  background: rgba(237, 219, 205) ;
}

/* Achtergrondkleur met transparantie over container-elementen */
.container {
  background-color: rgba(237, 219, 205, 0.5);
}

/* Achtergrond van de header en subnavigatie ook half-transparant */
.header-skin-light #tc-sn .tc-sn-inner, .header-skin-light .tc-header {
  background-color: rgba(237, 219, 205, 0.5);
}

/* Positionering en styling van de link-overlay op uitgelichte blokken */
.czr-link-mask {
  position: absolute;
  border-color: rgba(237, 219, 205); /* optisch kader in zelfde tint */
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  overflow: hidden;
  z-index: 1;
}

/* Verberg titels, teksten en knoppen van de uitgelichte blokken */
.fp-title,
.fp-text-one,
.fp-text-two,
.fp-text-three,
.fp-button.readmore-holder {
  display: none;
}

/* Pas verticale marges aan op het .marketing element */
.marketing {
  margin-bottom: -1em;
  margin-top: -4em;
}

/* Keyframes voor een scrollende golf-animatie van rechts naar links */
@keyframes scrollWaves {
  0% {
    background-position: 100% 0;
  }
  100% {
    background-position: 0 0;
  }
}

/* Styling voor de golfbalk met animatie (golf100.png) */
.wave-border {
  width: 100%;
  height: 40px;
  background-image: url('https://www.innerwavemorocco.com/wp-content/uploads/2025/05/golf100_darkred.png');
  background-repeat: repeat-x;
  background-size: auto 100%;
  animation: scrollWaves 30s linear infinite;
}

/* 
  Uitgelichte blokken horizontaal positioneren (niet laten 'wrappen') 
  - Gebruik flexbox voor net rijgedrag
  - gap definieert de ruimte tussen de blokken
*/
.fp-widget-area {
  display: flex;
  flex-wrap: nowrap;       /* voorkomt dat blokken op kleinere schermen onder elkaar komen */
  justify-content: center; /* centreert de rij in het midden */
  gap: 1rem;               /* ruimte tussen blokken, kan je aanpassen */
}

/* 
  Beheers de breedte van elk uitgelicht blok
  - Zorgt dat ze naast elkaar blijven passen
  - Pas marge aan om de balans visueel correct te houden
*/
.fp-widget-area > .featured-page {
  flex: 0 0 50%;         /* laat dit gelijk lopen met max-width */
  max-width: 30%;        /* ieder blok neemt max 30% breedte in */
  margin: 5% -5% 1% -5%; /* negatieve horizontale marge om de ruimte te verkleinen */
}

/* 
  Verklein de inhoud binnen de blokken (afbeelding + kader)
  - transform verkleint visueel zonder de layout te breken
*/
.featured-page .widget-front,
.featured-page .czr-thumb-wrapper {
  transform: scale(0.8);     /* 80% grootte t.o.v. origineel */
  transform-origin: center;  /* schaal vanuit het midden */
  margin: 0 auto;            /* centreer het geheel binnen de kolom */
}

/* Algemene instelling voor de aangepaste cursor */
body {
    cursor: url('https://www.innerwavemorocco.com/wp-content/uploads/2025/03/golf32.png') 16 16, auto;
}

/* Terugvaloptie voor links om standaard cursor weer te geven */
a, button {
    cursor: pointer;
}