/* Huisstijl: volg de globale Elementor-kleuren en -typografie van Moedermelk Netwerk.
   De --mi-* variabelen zijn desgewenst via Extra CSS bij te stellen, zonder pluginwijziging. */
.mi{
  --mi-ink:var(--e-global-color-text,var(--ast-global-color-3,currentColor));
  --mi-teal:var(--e-global-color-primary,var(--ast-global-color-0,var(--wp--preset--color--primary,#2b6b70)));
  --mi-rose:var(--e-global-color-secondary,var(--e-global-color-accent,var(--mi-teal)));
  --mi-muted:color-mix(in srgb,var(--mi-ink) 72%,#fff);
  --mi-line:color-mix(in srgb,var(--mi-teal) 25%,#fff);
  --mi-tint:color-mix(in srgb,var(--mi-teal) 8%,#fff);
  --mi-button-bg:color-mix(in srgb,var(--mi-teal) 4%,#fff);
  --mi-heading-font:var(--e-global-typography-primary-font-family,inherit);
  --mi-text-font:var(--e-global-typography-text-font-family,inherit);
  font-family:var(--mi-text-font);
  line-height:1.62;
  color:var(--mi-ink);
  font-size:inherit;
  width:100%;max-width:100%;overflow-wrap:break-word;
}
.mi,.mi *{box-sizing:border-box}
.mi-shell{max-width:850px;margin:0 auto;padding:clamp(12px,3vw,28px);min-width:0}
.mi h2{font-family:var(--mi-heading-font);font-size:clamp(25px,4vw,33px);color:var(--mi-teal);margin:4px 0 11px;line-height:1.22}
.mi h3{font-family:var(--mi-heading-font);font-size:clamp(19px,3vw,25px);line-height:1.32;margin:0 0 12px;color:var(--mi-teal)}
.mi p{margin:0 0 12px}
.mi-eyebrow{font-size:12px;letter-spacing:.07em;font-weight:700;text-transform:uppercase;color:var(--mi-rose)}
.mi-lead{font-size:16px;max-width:740px}
.mi-calm{padding:12px 16px;background:var(--mi-tint);border-radius:10px;margin:14px 0 20px!important;font-size:14px}
.mi-app{border:1px solid var(--mi-line);border-radius:16px;padding:clamp(15px,3vw,26px);background:#fff;box-shadow:0 5px 19px rgba(27,75,79,.07);min-width:0;max-width:100%;}
.mi-top{display:flex;flex-wrap:wrap;gap:7px 16px;align-items:center;justify-content:space-between;color:var(--mi-muted);font-size:12px;margin-bottom:16px}
#mi-step{font-weight:700;color:var(--mi-rose)}
.mi-support{font-size:15px;color:var(--mi-muted);margin-bottom:14px!important;white-space:pre-line}
.mi-options{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;max-width:100%;min-width:0}
.mi button{appearance:none;-webkit-appearance:none;display:block;box-sizing:border-box;max-width:100%;min-width:0;white-space:normal!important;overflow-wrap:anywhere!important;word-wrap:break-word!important;word-break:normal;text-align:left;line-height:1.4;font-family:inherit;cursor:pointer}
.mi-options button{width:100%;border:1px solid var(--mi-line);border-radius:11px;background:var(--mi-button-bg);padding:13px 16px;color:var(--mi-ink);font-size:15px;font-weight:600;transition:background .15s,border-color .15s}
.mi-options button:hover,.mi-options button:focus-visible{border-color:var(--mi-teal);background:var(--mi-tint);outline-offset:2px}
.mi-options button:active{background:var(--mi-tint)}
.mi-buttons{display:flex;flex-wrap:wrap;gap:9px;margin-top:20px;min-width:0}
.mi button.mi-secondary{width:auto;max-width:100%;border:1px solid var(--mi-line);border-radius:9px;padding:9px 12px;background:#fff;font-size:13px;font-weight:600;color:var(--mi-teal)}
.mi button.mi-secondary:hover{background:var(--mi-tint)}
.mi-result[hidden],.mi-options[hidden],.mi button[hidden]{display:none!important}
.mi-result{padding:3px 0;max-width:100%}
.mi-result h4{font-family:var(--mi-heading-font);color:var(--mi-teal);font-size:19px;margin:0 0 12px}
.mi-result p{margin-bottom:11px}
.mi-result ul{margin:0 0 14px;padding-left:21px}
.mi-result li{padding:0 0 9px}
.mi-result .mi-note{background:var(--mi-tint);border-left:3px solid var(--mi-teal);border-radius:0 8px 8px 0;padding:11px 13px;margin:10px 0 14px}
.mi-result .mi-contact{border-left:3px solid #d9a65b;background:#fefaf3;padding:11px 13px;border-radius:0 8px 8px 0;margin-top:12px}
.mi-details{border:1px solid var(--mi-line);border-radius:11px;margin:14px 0 0;background:#fff;overflow:hidden}
.mi-details summary{padding:13px 17px;cursor:pointer;font-weight:700;color:var(--mi-teal);overflow-wrap:anywhere}
.mi-details-inner{padding:0 17px 15px;font-size:14px}
.mi-details .mi-refs{padding-left:21px}
.mi-details .mi-refs li{margin-bottom:8px}
.mi-details a{color:var(--mi-teal);text-decoration:underline;text-underline-offset:2px}
.mi-footnote{font-size:12px;color:var(--mi-muted)}
@media(max-width:480px){.mi-shell{padding:10px}.mi-app{padding:15px;border-radius:12px}.mi-options button{padding:13px 12px;font-size:14px}.mi h3{font-family:var(--mi-heading-font);font-size:20px}.mi-buttons{flex-direction:column}.mi button.mi-secondary{width:100%}.mi-top{font-size:12px}}

.mi-loading{opacity:.72;pointer-events:none}
.mi-error{padding:12px;border-left:3px solid #b34b46;background:#fff9f7;color:#7a322e;margin:10px 0}

/* Elementor-typografie blijft leidend; de standaardafmetingen blijven mobielvriendelijk. */
.mi h2,.mi h3,.mi-result h4{
  font-weight:var(--e-global-typography-primary-font-weight,700);
}
.mi,.mi button,.mi details{font-family:var(--mi-text-font)}
.mi h2,.mi h3,.mi-result h4{font-family:var(--mi-heading-font)}
.mi a:focus-visible,.mi button:focus-visible,.mi summary:focus-visible{outline:2px solid var(--mi-teal);outline-offset:3px}
/* Modern CSS kleurmenging met gewone fallbackwaarden voor oudere browsers. */
@supports not (color: color-mix(in srgb, red, blue)) {
 .mi{--mi-muted:#626a6b;--mi-line:#d6dddd;--mi-tint:#f5f7f7;--mi-button-bg:#f9fafa}
}
/* Revisie 2.0 – meerkeuze en medische veiligheidsmelding */
.mi-safety[hidden]{display:none!important}
.mi-safety{padding:12px 14px;border-radius:10px;margin:0 0 16px;border-left:3px solid var(--mi-teal);background:var(--mi-tint);font-size:14px}
.mi-safety p{margin:0!important}
.mi-safety-urgent{border-left-color:#a3473d;background:#fff6f3;color:#723830}
.mi-safety-caution{border-left-color:#b67d2a;background:#fffaf2}
.mi-multi-options{display:grid;gap:9px}
.mi-multi-item{display:flex;gap:12px;align-items:flex-start;border:1px solid var(--mi-line);background:var(--mi-button-bg);border-radius:10px;padding:12px 14px;cursor:pointer;line-height:1.45;font-weight:500;font-size:15px}
.mi-multi-item:focus-within{outline:2px solid var(--mi-teal);outline-offset:2px}
.mi-multi-item input{flex:0 0 auto;width:19px;height:19px;margin:2px 0 0;accent-color:var(--mi-teal)}
.mi-options button.mi-primary{width:100%;border:1px solid var(--mi-teal);border-radius:10px;padding:12px 14px;background:var(--mi-teal);color:#fff;font-weight:700;font-size:15px;margin-top:5px}
.mi-options button.mi-primary:disabled{opacity:.52;cursor:not-allowed}
.mi-result-section-title{font-family:var(--mi-heading-font);font-size:16px;font-weight:700;color:var(--mi-teal);margin:20px 0 6px;line-height:1.3}
.mi-result ul{margin-bottom:10px}