.AppContainer__welcomeHeading {background-color: #727866;margin: 0;height: 56px;color: #727866;position: relative;width: 100%;opacity: unset;z-index: unset;top: 0;}
.Header__header {background-image: url(https://server.mondiaz.nl/files/mondiaz-herobanner.webp);}
.Header__logo img {max-width: 240px;}
.Header__header.Header__homeContent div#navBar {background-color: rgba(0, 0, 0, .7);}
.Header__header.Header__defaultContent div#navBar{background-color: #4c4c4c;}
.commonStyle__overflowDotted {font-size: 0.8rem;}
.Header__name{font-family: now-bold, sans-serif;text-transform: uppercase;font-size:16px;font-weight: unset;display:none;}
.Header__menuList{font-family: now-bold, sans-serif;text-transform: uppercase;font-size:14px;}
.Header__tabsTab{padding:0px;}
.Header__tabsTab:hover{border-bottom: 3px solid #FFFFFF;}
li#logoutDetails:hover{border-bottom: 3px solid #FFFFFF;}
li#localePopup:hover{border-bottom: 3px solid #FFFFFF;}
li a {color: #FFFFFF;}
.faqitem li a {color: #0000FF;}
p a {color: #0000FF;}
span.LocalePopup__localeText.commonStyle__overflowDotted.commonStyle__flex1 {display: none;}
:root {--color-brand: #727866;}
.html {font-family: now-bold, sans-serif;}
.Button__footerBtn {background: #727866;}
.Button__footerBtn:hover {background: #FFFFFF;border: 3px solid #727866;color: #727866;}
.Footer__container2 {background-image: url(https://server.mondiaz.nl/files/footerbg.jpg);height: 7rem;width:100%;max-width: 100%;display: flex;align-items: center;justify-content: center;}
div#layoutContainer {min-height: unset;}
html, body { height: 100%; margin: 0; }
.AccessibilityKeyboardNavigation__common {display: flex;flex-direction: column;min-height: 100vh;}
#mainContainer { flex: 1; }
.Header__menuList .Header__tabsTab a{display: flex;align-items: center;justify-content: center;padding: 0 16px;text-decoration: none;  height: 3rem;}
span.ListHeader__editOption.commonStyle__cursor.commonStyle__fRight.commonStyle__zt3Brand {display: none;}
@media (min-width: 769px) 
{
  [data-id="ticketForm"] .Layout__layout1 {
    flex: 0 0 50%;   /* basis = 50%, niet groeien/krimpen */
    padding: 0;
    box-sizing: border-box;
  }
  [data-id="ticketForm"] .Layout__layout2 {
    flex: 1 1 0;     /* groeit om resterende ruimte te vullen */
    padding: 0;
    box-sizing: border-box;
  }
}
div#field_productId {
    display: none;
}

  .modal {
    display: none;                 /* standaard verborgen */
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.7);   /* donkere overlay */
    z-index: 9999;
    padding: 2rem;                 /* marge rondom dialog */
  }
  .modal.is-open { display: block; }

  .modal__dialog {
    position: relative;
    margin: auto;
    max-width: min(90vw, 1000px);
    max-height: 90vh;
    background: #fff;
    border-radius: 8px;
    overflow: hidden;              /* nette randen */
    box-shadow: 0 10px 30px rgba(0,0,0,0.35);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction:column;
  }
  .modal__dialog img {
    display: block;
    max-width: 100%;
    max-height: 83vh;
    height: auto;
    width: auto;
    margin: 2rem 1rem 2rem 1rem;
  }
  .modal__close {
    position: absolute;
    top: .5rem;
    right: .5rem;
    font-size: 1.5rem;
    line-height: 1;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 999px;
    width: 2rem;
    height: 2rem;
    cursor: pointer;
  }

.modal { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.7); z-index:9999; padding:2rem; }
.modal.is-open { display:block; }

.modal__close { position:absolute; top:.5rem; right:.5rem; font-size:1.5rem; line-height:1;
  background:#fff; border:1px solid #ddd; border-radius:999px; width:2rem; height:2rem; cursor:pointer; }

.modal__nav {
  position:absolute; top:50%; transform:translateY(-50%);
  background:rgba(255,255,255,0.9); border:1px solid #ddd; border-radius:999px;
  width:6rem; height:6rem; font-size:3rem; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
}
.modal__prev { left:1.5rem; }
.modal__next { right:1.5rem; }

.modal__caption { width:100%; padding:.6rem .9rem; font-size:.95rem; color:#333; border-top:1px solid #eee; }
@media (max-width:600px) {
  .modal { padding:1rem; }
  .modal__dialog img { max-height:65vh;}
  .modal__dialog {margin: 0.5vh;}
  .modal__nav { width:2.2rem; height:2.2rem; font-size:1.25rem;}
  .modal__prev { left:.5rem; }
  .modal__next { right:.5rem; }
}

@media (min-width:600px) and (max-width:1024px) {
    .modal__dialog {margin: 1.5vh;}
}


/* Basis: verberg panelen die 'hidden' hebben */
.faqitem [hidden] { display: none !important; }

/* (Optioneel) visuele hint voor klikbare headers */
.faqitem h3 {
  cursor: pointer;
  position: relative;
  padding-right: 2rem; /* ruimte voor caret */
  user-select: none;
}

/* (Optioneel) caret-icoon met CSS */
.faqitem h3::after {
  position: absolute;
  right: .25rem;
  top: 50%;
  transform: translateY(-50%) rotate(-90deg); /* dicht */
  transition: transform .2s ease;
  opacity: .7;
}
.faqitem h3[aria-expanded="true"]::after {
  transform: translateY(-50%) rotate(0deg); /* open */
}

.faqitem h3 {
    color: #fff;
    background: #727866;
    padding: 0.4rem;
    border-radius: 3px;
    border-radius: 32px;
}


/* 1) Tijdens initialisatie: verberg ALLES behalve de H3 binnen faqitem */
article.faqitem:not([data-acc-ready="1"]) > :not(h3) {
  display: none !important;
}

/* 2) Na initialisatie: onze panel-regels gelden weer */
.faqitem .accordion-panel[hidden] {
  display: none !important;
}
.faqitem .accordion-panel {
  overflow: hidden;
  transition: max-height .25s ease;
}
.faqitem .accordion-panel.is-collapsing { will-change: max-height; }

/* H3 clickbaar en icon links netjes uitlijnen */
article.faqitem h3 {
  cursor: pointer;
  display: flex;           /* icon + tekst naast elkaar */
  align-items: center;
  gap: .5rem;              /* ruimte tussen icon en tekst */
  user-select: none;
}

/* Chevron icon (Font Awesome) vóóraan */
article.faqitem h3 > i.fa.fa-chevron-right {
  transition: transform .2s ease, opacity .2s ease;
  opacity: .7;
}

/* Bij open (aria-expanded="true"): draai chevron naar beneden */
article.faqitem h3[aria-expanded="true"] > i.fa.fa-chevron-right {
  transform: rotate(90deg);   /* gesloten = → , open = ↓ (90°) */
  opacity: .9;
}
article.faqitem li {list-style-type:disc;}

article.faqitem p {
    margin-bottom: 0;
    margin-top: 0;
}

/* --- Outlook / MSO Cleanup --- */

p.MsoNormal,
.MsoNormal,
p[class^="Mso"],
span[class^="Mso"] {
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.4 !important;
    font-size: inherit !important;
    font-family: inherit !important;
}

/* Word adds <o:p> tags — make them invisible */
o\:p,
o\\:p {
    display: none !important;
}

/* Remove MS Office table spacing */
table.MsoTableGrid,
table[class^="MsoTable"] {
    border-collapse: collapse !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Remove automatic Outlook spans that break layout */
span[style*="mso-"] {
    all: unset !important;
}