/*
 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
*/

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

/* ============================================
   FRONTEND: Fix voor witrand rechts van full align blokken.
   ============================================ */
  .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: Opsommingen
   ============================================ */
main ul {
  margin-left: 0;
  padding-left: 0;
  list-style-position: inside;
  margin-block-start: 0;
  margin-block-end: 1em;
}

main ul li {
  padding-left: 0.25em;
  text-indent: -0.25em;
}

main ol {
  margin-left: 1.2em;
  padding-left: 0;
  list-style-position: outside;
  margin-block-start: 0;
  margin-block-end: 1em;  
}

/* ============================================
  Mobiel menu
============================================ */
.brxe-nav-menu .bricks-mobile-menu {
    padding-top: 1rem;
}
:where(.brxe-nav-menu) .bricks-nav-menu .sub-menu {
    padding-top: 1rem;
    padding-bottom: 1rem;
}

/* ============================================
  FRONTEND: Kolommen
============================================ */
html,
body {
    overflow-x: clip;
}

:where(.wp-block-columns) {
    width: auto !important;
    max-width: none !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    margin-bottom: 0 !important;

    padding-left: max(30px, calc((100vw - 1230px) / 2)) !important;
    padding-right: max(30px, calc((100vw - 1230px) / 2)) !important;
    padding-top: var(--ruimte-xxl) !important;
    padding-bottom: var(--ruimte-xxl) !important;
    box-sizing: border-box !important;
}

/* Desktop */
:where(.wp-block-columns.is-layout-flex) {
    gap: 3em;
}

/* Mobiel / stacked */
@media (max-width: 781px) {
    :where(.wp-block-columns.is-layout-flex) {
        gap: 1em;
    }
}


/* ============================================
  FRONTEND: Header overlay achtergrond
============================================ */
.overlay-bg0::before {
    background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)) !important;
    position: absolute !important;
    content: "" !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    pointer-events: none !important;
}
.overlay-bg20::before {
    background-image: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.3)) !important;
    position: absolute !important;
    content: "" !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    pointer-events: none !important;
}
.overlay-bg40::before {
    background-image: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.5)) !important;
    position: absolute !important;
    content: "" !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    pointer-events: none !important;
}
.overlay-bg60::before {
    background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.7)) !important;
    position: absolute !important;
    content: "" !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    pointer-events: none !important;
}
.overlay-bg80::before {
    background-image: linear-gradient(rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.9)) !important;
    position: absolute !important;
    content: "" !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    pointer-events: none !important;
}


/* ============================================
  FRONTEND: Geen padding bij kolommen
============================================ */
.wp-block-columns.lm-columns-no-padding-top {
	padding-top: 0 !important;
}
.wp-block-columns.lm-columns-no-padding-bottom {
	padding-bottom: 0 !important;
}
/* Oude oplossing, misschien nog wel gebruikt ergens */
.geen-padding-top { padding-top:0px !important; }
.geen-padding-bottom { padding-bottom:0px !important; }


/* ============================================
  FRONTEND: Headers marging etc
============================================ */
h1, h2, h3, h4, h5, h6 {
    margin-bottom: .3em;
}

/* ============================================
  FRONTEND: Foto en video geen marge
============================================ */
.wp-block-image, .wp-block-video, figure[class^=wp-block-] {
    margin: 0;
}


/* ============================================
  FRONTEND: Tabel
============================================ */
.tabel--organisatie {
  border-left: 0px !important;
  border-right: 0px !important;
}
.tabel--organisatie th {
  border-left: 0px !important;
  border-right: 0px !important;
}
.tabel--organisatie td {
  border-left: 0px !important;
  border-right: 0px !important;
}

/* ============================================
  FRONTEND: Container padding links en rechts
============================================ */
.container--button-nopadding { 
  padding-left:0px !important; 
  padding-right:0px !important;
}