/* Mal-design snapshot — geoogst van mal.brickser.nl (WindPress) op 14 sep 2026.
   Dit is Dennis' vertrekpunt-design: nav/dropdown/mobiel menu, kaart-hover, formulier-styling.
   Bron van waarheid = de mal; bij designwijzigingen daar: opnieuw oogsten. Niet handmatig verbouwen. */
@layer theme, base, components, utilities;
:root { --glw-nav-duration: 0.25s; --glw-nav-easing: cubic-bezier(0.4, 0, 0.2, 1); --glw-dropdown-min-width: 240px; --glw-dropdown-offset: 0.5rem; --glw-dropdown-shadow: 0 10px 40px rgba(0, 0, 0, 0.08); --glw-dropdown-radius: var(--radius-m, 8px); --glw-dropdown-item-padding-y: 0.7rem; --glw-dropdown-item-padding-x: 1.1rem; --glw-dropdown-item-margin-x: 0.5rem; --glw-mobile-bg: var(--primary); --glw-mobile-padding-y: var(--space-l); --glw-mobile-padding-x: var(--space-m); }
.glw-header .bricks-nav-menu > li > a, .glw-header .bricks-nav-menu > li > .brx-submenu-toggle > a { position: relative; display: inline-flex; align-items: center; gap: 0.4rem; padding: var(--space-xs) 0.25rem; color: var(--neutral); font-size: var(--text-s); font-weight: 500; text-decoration: none; transition: color var(--glw-nav-duration) var(--glw-nav-easing); }
.glw-header .bricks-nav-menu > li:hover > a, .glw-header .bricks-nav-menu > li:hover > .brx-submenu-toggle > a, .glw-header .bricks-nav-menu > li.current-menu-item > a, .glw-header .bricks-nav-menu > li.current-menu-ancestor > a, .glw-header .bricks-nav-menu > li.current-menu-item > .brx-submenu-toggle > a, .glw-header .bricks-nav-menu > li.current-menu-ancestor > .brx-submenu-toggle > a { color: var(--primary); }
.glw-header .bricks-nav-menu > li > a::after, .glw-header .bricks-nav-menu > li > .brx-submenu-toggle > a::after { content: ""; position: absolute; left: 0px; bottom: -2px; width: 0px; height: 2px; background: var(--primary); transition: width var(--glw-nav-duration) var(--glw-nav-easing); }
.glw-header .bricks-nav-menu > li:hover > a::after, .glw-header .bricks-nav-menu > li:hover > .brx-submenu-toggle > a::after, .glw-header .bricks-nav-menu > li.current-menu-item > a::after, .glw-header .bricks-nav-menu > li.current-menu-ancestor > a::after, .glw-header .bricks-nav-menu > li.current-menu-item > .brx-submenu-toggle > a::after, .glw-header .bricks-nav-menu > li.current-menu-ancestor > .brx-submenu-toggle > a::after { width: 100%; }
.glw-header .bricks-nav-menu .brx-submenu-toggle svg { width: 0.7rem; height: 0.7rem; margin-left: 0.25rem; opacity: 0.6; transition: transform var(--glw-nav-duration) var(--glw-nav-easing), opacity var(--glw-nav-duration) var(--glw-nav-easing); }
.glw-header .bricks-nav-menu > li:hover .brx-submenu-toggle svg { transform: rotate(180deg); opacity: 1; }
.glw-header .bricks-nav-menu > li > a:focus-visible, .glw-header .bricks-nav-menu > li > .brx-submenu-toggle > a:focus-visible { outline: 2px solid var(--primary); outline-offset: 4px; border-radius: 2px; }
.glw-header .bricks-nav-menu > li > .sub-menu { margin-top: var(--glw-dropdown-offset); padding: 0.6rem 0px; min-width: var(--glw-dropdown-min-width); background: var(--white); border: 1px solid var(--primary-trans-20); border-radius: var(--glw-dropdown-radius); box-shadow: var(--glw-dropdown-shadow); list-style: none; opacity: 0; transform: translateY(-8px); transition: opacity var(--glw-nav-duration) var(--glw-nav-easing), transform var(--glw-nav-duration) var(--glw-nav-easing); }
.glw-header .bricks-nav-menu > li:hover > .sub-menu, .glw-header .bricks-nav-menu > li:focus-within > .sub-menu { opacity: 1; transform: translateY(0px); }
.glw-header .bricks-nav-menu > li > .sub-menu li { margin: 0px; padding: 0px; list-style: none; }
.glw-header .bricks-nav-menu > li > .sub-menu li a { display: flex; align-items: center; gap: 0.7rem; margin: 0 var(--glw-dropdown-item-margin-x); padding: var(--glw-dropdown-item-padding-y) var(--glw-dropdown-item-padding-x); color: var(--neutral); font-size: var(--text-s); line-height: 1.3; text-decoration: none; border-radius: var(--radius-s, 4px); transition: background var(--glw-nav-duration) var(--glw-nav-easing), color var(--glw-nav-duration) var(--glw-nav-easing); }
.glw-header .bricks-nav-menu > li > .sub-menu li.current-menu-item a { background: var(--primary); color: var(--white); outline: none; }
.glw-header .bricks-nav-menu > li > .sub-menu li.current-menu-item a::before { background: var(--white); transform: scale(1.4); }
.glw-header .bricks-nav-menu > li > .sub-menu li a::before { content: ""; width: 6px; height: 6px; background: var(--primary); border-radius: var(--radius-50, 50%); flex-shrink: 0; transition: transform var(--glw-nav-duration) var(--glw-nav-easing), background var(--glw-nav-duration) var(--glw-nav-easing); }
.glw-header .bricks-nav-menu > li > .sub-menu li a:hover, .glw-header .bricks-nav-menu > li > .sub-menu li a:focus-visible { background: var(--primary); color: var(--white); outline: none; }
.glw-header .bricks-nav-menu > li > .sub-menu li a:hover::before, .glw-header .bricks-nav-menu > li > .sub-menu li a:focus-visible::before { background: var(--white); transform: scale(1.4); }
.glw-header__link { display: flex; align-items: center; gap: 0.4rem; color: var(--primary); font-size: var(--text-s); font-weight: 500; text-decoration: none; transition: color var(--glw-nav-duration) var(--glw-nav-easing); }
.glw-header__link:hover, .glw-header__link:focus-visible { color: var(--primary-hover); outline: none; }
.glw-header__link:focus-visible { outline: 2px solid var(--primary); outline-offset: 4px; border-radius: 2px; }
.glw-header--sticky { position: sticky; top: 0px; z-index: 100; transition: box-shadow var(--glw-nav-duration) var(--glw-nav-easing); }
.glw-header--sticky.is-scrolled { box-shadow: rgba(0, 0, 0, 0.06) 0px 2px 12px; }
.glw-header { border-bottom: 1px solid var(--primary-trans-10, rgba(0, 0, 0, 0.06)); }
.bricks-mobile-menu-wrapper::before { background: var(--glw-mobile-bg) !important; }
.bricks-mobile-menu-wrapper { padding: var(--glw-mobile-padding-y) var(--glw-mobile-padding-x) !important; }
.bricks-mobile-menu > li > a, .bricks-mobile-menu > li > .brx-submenu-toggle > a { display: flex; align-items: center; width: 100%; padding: var(--space-s) 0; font-size: var(--text-m); font-weight: 500; text-decoration: none; border-bottom: 1px solid rgba(255, 255, 255, 0.2); transition: color var(--glw-nav-duration) var(--glw-nav-easing), padding-left var(--glw-nav-duration) var(--glw-nav-easing); color: var(--white) !important; }
.bricks-mobile-menu > li > a:hover, .bricks-mobile-menu > li > .brx-submenu-toggle > a:hover, .bricks-mobile-menu > li.current-menu-item > a { color: var(--white) !important; padding-left: 0.5rem; }
.bricks-mobile-menu > li > .brx-submenu-toggle { display: flex; align-items: center; justify-content: space-between; width: 100%; }
.bricks-mobile-menu > li > .brx-submenu-toggle > a { flex: 1 1 0%; border-bottom: 0px; }
.bricks-mobile-menu > li.menu-item-has-children > .brx-submenu-toggle { border-bottom: 1px solid rgba(255, 255, 255, 0.2); }
.bricks-mobile-menu > li > .brx-submenu-toggle > button { display: flex; align-items: center; justify-content: center; padding: var(--space-s) 0 var(--space-s) var(--space-s); background: transparent; border: 0px; color: var(--white); cursor: pointer; }
.bricks-mobile-menu > li > .brx-submenu-toggle > button svg { width: 1rem; height: 1rem; transition: transform var(--glw-nav-duration) var(--glw-nav-easing); stroke: var(--white) !important; }
.bricks-mobile-menu > li > .brx-submenu-toggle > button[aria-expanded="true"] svg { transform: rotate(180deg); }
.bricks-mobile-menu .sub-menu li a { display: flex; align-items: center; gap: 0.5rem; padding: 0.7rem var(--space-m); font-size: var(--text-s); text-decoration: none; border-bottom: 1px solid rgba(255, 255, 255, 0.1); transition: background var(--glw-nav-duration) var(--glw-nav-easing), padding-left var(--glw-nav-duration) var(--glw-nav-easing); color: var(--white) !important; }
.bricks-mobile-menu .sub-menu li a::before { content: ""; width: 5px; height: 5px; background: var(--white); border-radius: var(--radius-50, 50%); flex-shrink: 0; opacity: 0.7; transition: transform var(--glw-nav-duration) var(--glw-nav-easing), opacity var(--glw-nav-duration) var(--glw-nav-easing); }
.bricks-mobile-menu .sub-menu li a:hover { background: var(--secondary) !important; color: var(--white) !important; }
.bricks-mobile-menu .sub-menu li a:hover::before { opacity: 1; transform: scale(1.4); }
.bricks-mobile-menu-toggle .bar-top, .bricks-mobile-menu-toggle .bar-center, .bricks-mobile-menu-toggle .bar-bottom { background: var(--neutral) !important; }
.bricks-mobile-menu-toggle.show-mobile-menu .bar-top, .bricks-mobile-menu-toggle.show-mobile-menu .bar-center, .bricks-mobile-menu-toggle.show-mobile-menu .bar-bottom, .bricks-mobile-menu-toggle[aria-expanded="true"] .bar-top, .bricks-mobile-menu-toggle[aria-expanded="true"] .bar-center, .bricks-mobile-menu-toggle[aria-expanded="true"] .bar-bottom { background: var(--white) !important; }
@media (prefers-reduced-motion: reduce) {
  .glw-header *, .bricks-mobile-menu-wrapper * { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
  .glw-header .bricks-nav-menu > li > .sub-menu { transform: none !important; }
}
.glw-card { transition: transform 0.25s, box-shadow 0.25s, border-color 0.25s; }
.glw-card:hover { transform: translateY(-3px); box-shadow: rgba(0, 0, 0, 0.06) 0px 8px 20px; border-color: var(--primary-trans-40); }
.glw-form input[type="text"], .glw-form input[type="email"], .glw-form input[type="tel"], .glw-form input[type="url"], .glw-form input[type="number"], .glw-form input[type="password"], .glw-form textarea, .glw-form select, .glw-form input[type="file"] {
  background-color: var(--white); border: 1px solid var(--primary-trans-20); border-radius: var(--radius-m); transition: border-color 0.2s, box-shadow 0.2s;
  &:hover { border-color: var(--primary-trans-40); }
  &:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-trans-10); }
}
:is(.glw-form input[type="text"], .glw-form input[type="email"], .glw-form input[type="tel"], .glw-form input[type="url"], .glw-form input[type="number"], .glw-form input[type="password"], .glw-form textarea):user-invalid { border-color: var(--danger); }
.glw-form textarea { min-height: 8rem; resize: vertical; }
.glw-form select { cursor: pointer; appearance: none; background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23718096' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'/%3e%3c/svg%3e"); background-repeat: no-repeat; background-position: right var(--space-s) center; background-size: 1.25em auto; padding-right: calc(var(--space-s) + 2em); }
.glw-form .options-wrapper {
  list-style: none; padding: 0px; margin: var(--space-xs) 0 0 0; grid-template-columns: repeat(2, 1fr); gap: var(--space-xs) var(--space-m);
  @media (max-width: 767px) {
  grid-template-columns: 1fr;
}
  & li { display: flex; align-items: center; gap: var(--space-xs); margin: 0px; }
  & input[type="checkbox"], & input[type="radio"] {
  appearance: none; flex-shrink: 0; cursor: pointer; background-color: var(--white); border: 2px solid var(--primary); transition: background-color 0.15s, border-color 0.15s; width: 1.375rem !important; height: 1.375rem !important; padding: 0px !important; margin: 0px !important;
  &:hover { border-color: var(--secondary); }
  &:focus-visible { outline: none; box-shadow: 0 0 0 3px var(--primary-trans-20); }
}
  & input[type="checkbox"] {
  border-radius: var(--radius-s);
  &:checked { background-color: var(--primary); border-color: var(--primary); background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='20 6 9 17 4 12'/%3e%3c/svg%3e"); background-size: 75% auto; background-repeat: no-repeat; background-position: center center; }
}
  & input[type="radio"] {
  border-radius: 50%;
  &:checked { background-color: var(--primary); border-color: var(--primary); background-image: radial-gradient(circle, white 30%, transparent 35%); }
}
  & label { font-weight: 400; font-size: var(--text-m); line-height: 1.4; color: var(--base); cursor: pointer; margin: 0px !important; }
  & a {
  color: var(--primary); text-decoration: underline;
  &:hover { color: var(--secondary); }
}
}
.glw-form input.flatpickr-input { background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23718096' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3crect x='3' y='4' width='18' height='18' rx='2' ry='2'/%3e%3cline x1='16' y1='2' x2='16' y2='6'/%3e%3cline x1='8' y1='2' x2='8' y2='6'/%3e%3cline x1='3' y1='10' x2='21' y2='10'/%3e%3c/svg%3e"); background-repeat: no-repeat; background-position: right var(--space-s) center; background-size: 1.125em auto; padding-right: calc(var(--space-s) + 2em); cursor: pointer; }
.glw-form input[type="file"] {
  cursor: pointer; font-size: var(--text-s); color: var(--base); padding: var(--space-xs);
  &::file-selector-button {
  background-color: var(--primary); color: var(--white); border: none; border-radius: var(--radius-s); padding: var(--space-xs) var(--space-s); margin-right: var(--space-s); font-weight: 600; font-size: var(--text-s); cursor: pointer; transition: background-color 0.2s;
  &:hover { background-color: var(--secondary); }
}
}
.glw-form .submit-button-wrapper {
  display: flex; justify-content: flex-start;
  & button[type="submit"] {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--space-xs); width: max-content; padding: var(--space-s) var(--space-l); margin-top: var(--space-xs); border-radius: var(--radius-m); font-weight: 600; font-size: var(--text-m); line-height: 1.2; cursor: pointer; text-decoration: none; transition: background-color 0.2s, border-color 0.2s, transform 0.15s; background-color: var(--primary) !important; color: var(--white) !important; border: 2px solid var(--primary) !important;
  &:hover { transform: translateY(-1px); background-color: var(--secondary) !important; border-color: var(--secondary) !important; color: var(--white) !important; }
  &:active { transform: translateY(0px); }
  &:focus-visible { outline: none; box-shadow: 0 0 0 3px var(--primary-trans-20); }
  & .loading { display: none; }
  &.is-loading {
  & .text { opacity: 0.5; }
  & .loading { display: inline-flex; animation: 0.8s linear 0s infinite normal none running glw-spin; }
}
}
}
.glw-form label.required::after { content: " *"; color: var(--primary); font-weight: 700; margin-left: 0.15em; }
.glw-form .message {
  padding: var(--space-s) var(--space-m); border-radius: var(--radius-s); font-size: var(--text-s); margin-top: var(--space-s);
  &.success { background-color: var(--primary); color: var(--white); border: 1px solid var(--primary); }
  &.error { background-color: var(--danger-ultra-light); color: var(--danger-dark); border: 1px solid var(--danger-trans-20); }
}
@media (max-width: 767px) {
  .glw-form .submit-button-wrapper {
  justify-content: stretch;
  & button[type="submit"] { width: 100%; }
}
}
.flatpickr-calendar .flatpickr-day.selected, .flatpickr-calendar .flatpickr-day.selected:hover { background: var(--primary); border-color: var(--primary); color: var(--white); }
.flatpickr-calendar .flatpickr-day:hover { background: var(--primary-ultra-light); }
.flatpickr-calendar .flatpickr-day.today { border-color: var(--primary); }
@keyframes glw-spin {
  100% { transform: rotate(360deg); }
}
footer a {
  text-decoration: none !important;
  &:hover { color: var(--primary) !important; text-decoration: underline !important; }
}