/* ═══════════════════════════════════════════════════════════════════════════
   MIJN ACCOUNT — de werkplek van de uitvoerder
   Zie includes/mijn-account.php voor de opbouw.

   ⚠ HET BIEDINGENBLOK HIERONDER IS EEN LETTERLIJKE OVERNAME UIT app.html.
   Klassenamen, maten en kleuren zijn ongewijzigd, alleen voorafgegaan door
   `.pmMa` zodat ze niet buiten dit scherm lekken. Zo is de website naast de app
   te leggen zonder te vertalen.

   Eerst stond hier mijn eigen benadering met andere klassenamen en gegokte
   maten: thumbnail 72px in plaats van 46px, een titel die over twee regels brak
   in plaats van af te kappen, en een dichte overlay in plaats van een
   doorschijnende tint. Dat zag er niet uit (Robbie, 31-08-2026) en er was geen
   reden voor: die stylesheet ligt er gewoon. Verandert er iets in app.html,
   verander het hier ook.

   AFSCHERMING TEGEN HET THEMA
   Het thema laadt bootstrap.min.css sitewide, met eigen .card, .badge, .btn en
   marges op ul/li/h1-h6/p op ELKE diepte. Vandaar de nullijn hieronder,
   gescoped op .pmMa.
   ═══════════════════════════════════════════════════════════════════════════ */

.pmMa {
  /* Exact de tokens uit :root in app.html, zodat de overgenomen regels
     hieronder ongewijzigd konden blijven. */
  --surface: #f7fbff;
  --white: #ffffff;
  --on-surface: #191c1d;
  --on-surface-variant: #3e4850;
  --outline: #6e7881;
  --outline-variant: #bdc8d1;
  --primary: #00658c;
  --primary-container: #00afef;
  --secondary: #4d6700;
  --green: #95c11f;
  --error: #ba1a1a;
  --error-container: #ffdad6;
  --amber: #e69500;
  --deep-navy: #192a3d;
  --container-low: #f3f4f5;

  font-family: 'Albert Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
  background: var(--surface);
  color: var(--on-surface);
  line-height: 1.5;
}

/* De nullijn. Geldt voor alles binnen .pmMa; er staan hier geen shortcodes meer
   in, dus de uitzondering die daarvoor bestond is vervallen. */
.pmMa, .pmMa *, .pmMa *::before, .pmMa *::after {
  margin: 0; padding: 0; box-sizing: border-box;
}
.pmMa ul { list-style: none; }
/* Zelf verbergen, niet overlaten aan het thema. Dezelfde les als bij het
   schuifpaneel van de schil: .aw-overlay en .modal hebben display:flex, en een
   class-regel wint van de browser-eigen [hidden]. Dat het tot nu toe werkte,
   kwam doordat bootstrap.min.css toevallig [hidden]{display:none!important}
   meebrengt — op een pagina zonder Bootstrap zou elke overlay openstaan. */
.pmMa [hidden] { display: none !important; }
.pmMa a { color: inherit; text-decoration: none; }
.pmMa img { display: block; max-width: 100%; }
.pmMa button { font: inherit; }

/* ⚠ De padding en het centreren staan ná de nullijn, anders wint die.
   Precies daar ging het fout: `.pmMa .pmMaBinnen { margin: 0 }` versloeg
   `.pmMaBinnen { margin: 0 auto }` op specificiteit, en de pagina plakte
   linksboven vast. */
.pmMa .pmMaBinnen {
  max-width: 720px; margin: 0 auto;
  padding: 18px 16px 56px;
}
.pmMa .pmMaTitel {
  font-size: 28px; font-weight: 800; letter-spacing: -0.02em;
  color: var(--on-surface); margin-bottom: 14px;
}

/* De paginabalk met tabbladen is er niet meer; zie de toelichting in
   includes/mijn-account.php. Geschakeld wordt er in de pil onderaan en in de
   header, precies zoals de app dat met zijn tabbalk doet. */

.pmMa .pmMaLaden { text-align: center; color: var(--on-surface-variant); padding: 32px 16px; font-size: 14px; }

/* ── Melding voor wie hier niet hoort ──────────────────────────────────────── */
.pmMa .pmMaMelding {
  background: var(--white); border: 1px solid var(--outline-variant);
  border-radius: 14px; padding: 28px 22px; text-align: center;
}
.pmMa .pmMaMelding h2 { font-size: 20px; font-weight: 800; margin-bottom: 8px; }
.pmMa .pmMaMelding p { font-size: 14px; color: var(--on-surface-variant); margin-bottom: 18px; }
.pmMa .pmMaKnop {
  display: inline-block; padding: 12px 24px; border-radius: 10px;
  background: var(--green); color: #fff; font-size: 14px; font-weight: 700;
}

/* ══════════════════════════════════════════════════════════════════════════
   BIEDINGEN — letterlijk uit app.html
   ══════════════════════════════════════════════════════════════════════════ */

.pmMa .segment { display:flex; gap:4px; background:var(--container-low); border:1px solid var(--outline-variant); border-radius:10px; padding:4px; margin-bottom:16px; }
.pmMa .seg { flex:1 1 0; padding:9px 8px; border:none; background:none; border-radius:8px; font-size:14px; font-weight:600; color:var(--on-surface-variant); cursor:pointer; display:flex; align-items:center; justify-content:center; gap:6px; }
.pmMa .seg.active { background:var(--white); color:var(--primary); box-shadow:0 1px 2px rgba(0,0,0,.08); }
.pmMa .seg-badge { display:inline-flex; align-items:center; justify-content:center; min-width:18px; height:18px; padding:0 5px; background:var(--primary-container); color:#fff; font-size:11px; font-weight:700; border-radius:999px; }

.pmMa .bids-search { position:relative; margin-bottom:14px; }
.pmMa .bids-search-icon { position:absolute; left:13px; top:50%; transform:translateY(-50%); color:var(--on-surface-variant); display:flex; pointer-events:none; }
.pmMa .bids-search input { width:100%; padding:11px 14px 11px 40px; border:1px solid var(--outline-variant); border-radius:12px; background:var(--white); font-size:15px; font-family:inherit; color:var(--on-surface); outline:none; -webkit-appearance:none; appearance:none; }
.pmMa .bids-search input::placeholder { color:var(--outline); }
.pmMa .bids-search input:focus { border-color:var(--primary-container); box-shadow:0 0 0 2px rgba(0,175,239,.12); }

.pmMa .bid-row { position:relative; background:var(--white); border:1px solid var(--outline-variant); border-radius:12px; padding:12px; margin-bottom:10px; cursor:pointer; transition:background .12s ease; }
.pmMa .bid-row:hover { background:var(--container-low); }
.pmMa .bid-rowtop { display:flex; align-items:center; gap:12px; }
.pmMa .bid-thumb { width:46px; height:46px; border-radius:9px; flex:0 0 46px; background:var(--deep-navy); display:flex; align-items:center; justify-content:center; color:#fff; overflow:hidden; }
.pmMa .bid-thumb img { width:100%; height:100%; object-fit:cover; }
.pmMa .bid-main { flex:1 1 auto; min-width:0; }
.pmMa .bid-main h3 { font-size:14px; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pmMa .bid-loc { display:flex; align-items:center; gap:4px; font-size:12px; color:var(--outline); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-top:2px; }
.pmMa .bid-loc svg { flex:0 0 auto; color:#2d5d6e; }
.pmMa .bid-right { flex:0 0 auto; text-align:right; }
.pmMa .bid-amount { font-size:18px; font-weight:800; }
.pmMa .bid-status { font-size:12px; font-weight:600; margin-top:2px; }
.pmMa .bid-status.beste { color:#1565c0; }
.pmMa .bid-status.onderboden { color:#c62828; }
.pmMa .bid-status.actie { color:#2e7d32; }
.pmMa .bid-status.afgerond { color:#2e7d32; display:inline-flex; align-items:center; gap:3px; }
.pmMa .bid-status.afgerond svg { flex:0 0 auto; }
.pmMa .bid-status.geannuleerd { color:var(--error); display:inline-flex; align-items:center; gap:3px; }
.pmMa .bid-status.geannuleerd svg { flex:0 0 auto; width:13px; height:13px; }
.pmMa .bid-status.gecrediteerd { color:#d63384; display:inline-flex; align-items:center; gap:3px; }
.pmMa .bid-status.gecrediteerd svg { flex:0 0 auto; width:13px; height:13px; }
.pmMa .bid-status.in_behandeling { color:#9a6700; }
.pmMa .bid-status.gesloten { color:var(--error); }
.pmMa .bid-sub { font-size:10px; color:var(--outline); }
.pmMa .bid-sub.credit { color:#d63384; font-weight:600; }

.pmMa .bid-confirm { display:block; width:100%; margin-top:12px; padding:11px; border:none; border-radius:10px; background:var(--green); color:#fff; font-size:14px; font-weight:700; text-align:center; cursor:pointer; }
.pmMa .bid-confirm:hover { opacity:.9; }
.pmMa .bid-row.tegenbod { border:2px solid var(--primary-container); box-shadow:0 0 0 4px rgba(0,175,239,.18), 0 6px 16px -6px rgba(0,175,239,.45); }
.pmMa .bid-tegenbod-flag { margin-top:10px; padding:9px 10px; border-radius:8px; background:var(--primary-container); color:#fff; font-size:13px; font-weight:800; text-align:center; letter-spacing:.01em; }

.pmMa .bid-x { display:inline-flex; align-items:center; justify-content:center; width:22px; height:22px; border-radius:999px; background:var(--container-low); border:1px solid var(--outline-variant); color:var(--outline); cursor:pointer; padding:0; }
.pmMa .bid-x:hover { background:var(--outline-variant); }
.pmMa .bid-right .bid-x { margin-bottom:6px; }

.pmMa .bid-row.inactive .bid-rowtop { opacity:.55; }
.pmMa .bid-overlay { position:absolute; inset:0; border-radius:12px; display:flex; align-items:center; justify-content:center; pointer-events:none; }
.pmMa .bid-overlay span { font-size:13px; font-weight:800; text-transform:uppercase; letter-spacing:.02em; }
.pmMa .bid-overlay .status-cross { display:inline-flex; margin-right:4px; vertical-align:-2px; }
.pmMa .bid-overlay.in_behandeling .status-cross { color:var(--error); }
.pmMa .bid-overlay.in_behandeling { background:rgba(251,232,198,.78); }
.pmMa .bid-overlay.in_behandeling span { color:#7a5200; }
.pmMa .bid-overlay.gesloten { background:rgba(255,218,214,.82); }
.pmMa .bid-overlay.gesloten span { color:var(--error); }
.pmMa .bid-overlay .bid-x { position:absolute; top:8px; right:8px; pointer-events:auto; }

.pmMa .verborgen-toggle { width:100%; display:flex; align-items:center; justify-content:space-between; background:none; border:none; border-top:1px solid var(--outline-variant); padding:16px 4px 10px; margin-top:6px; font-size:14px; font-weight:700; color:var(--on-surface-variant); cursor:pointer; }
.pmMa .verborgen-toggle svg { transition:transform .15s ease; }
.pmMa .verborgen-toggle.open svg { transform:rotate(180deg); }
.pmMa .verborgen-list { display:flex; flex-direction:column; gap:10px; }

.pmMa .action-notice { display:flex; align-items:center; gap:8px; background:rgba(230,149,0,.12); color:#9a6700; border:1px solid rgba(230,149,0,.3); border-radius:12px; padding:12px 14px; margin-bottom:12px; font-size:14px; font-weight:600; }
.pmMa .action-notice svg { flex:0 0 auto; }
.pmMa .bids-sep { height:1px; background:var(--outline-variant); margin:18px 4px; }
.pmMa .bids-empty { text-align:center; color:var(--on-surface-variant); padding:32px 16px; font-size:14px; }

/* ── Bureaublad ────────────────────────────────────────────────────────────
   De app kent geen bureaubladweergave (nul media queries). Eén kolom met een
   maximumbreedte is daarom de enige eerlijke vertaling; een raster met kolommen
   is bij het aanvragen-overzicht al expliciet afgewezen. */
@media (min-width: 900px) {
  .pmMa .pmMaBinnen { max-width: 740px; padding: 26px 24px 72px; }
}


/* ══════════════════════════════════════════════════════════════════════════
   ACCOUNT — letterlijk uit app.html
   Zelfde klassenamen en waarden als daar; alleen `.pmMa` ervoor gezet zodat ze
   niet buiten dit scherm lekken, en `#view-account-bedrijfsgegevens` is
   `.pmAccBedrijf` geworden omdat het bij ons geen eigen view-id heeft.
   Verandert er iets in app.html, verander het hier ook.
   ══════════════════════════════════════════════════════════════════════════ */

.pmMa .account-profile { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 8px 0 28px; }
.pmMa .account-avatar-wrap { position: relative; width: 84px; height: 84px; margin-bottom: 14px; }
.pmMa .account-avatar-wrap.partner::before { content: ''; position: absolute; inset: -3px; border-radius: 999px; background: linear-gradient(135deg, #13A7E1 0%, #5BC461 100%); z-index: 0; }
.pmMa .account-avatar-wrap.partner .account-avatar { position: relative; z-index: 1; }
.pmMa .account-avatar { width: 84px; height: 84px; border-radius: 999px; background: var(--container-low); border: 1px solid var(--outline-variant); display: flex; align-items: center; justify-content: center; color: var(--outline); overflow: hidden; }
.pmMa .account-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pmMa .account-avatar.uploading { opacity: .45; }
.pmMa .account-avatar-edit { position: absolute; z-index: 2; right: -2px; bottom: -2px; width: 28px; height: 28px; border-radius: 999px; background: var(--primary); color: #fff; border: 2px solid var(--white); display: flex; align-items: center; justify-content: center; cursor: pointer; box-shadow: 0 2px 6px rgba(25,42,61,.2); }
.pmMa .account-avatar-edit:active { transform: scale(.92); }
.pmMa .account-avatar-edit:disabled { opacity: .6; }
.pmMa .account-avatar-error { color: var(--error); font-size: 12px; margin-top: -6px; margin-bottom: 8px; }
.pmMa .account-name { font-size: 19px; font-weight: 800; letter-spacing: -0.01em; margin-bottom: 6px; }
.pmMa .account-profielnaam { font-size: 13px; color: var(--on-surface-variant); margin-bottom: 6px; }
.pmMa .account-rating { display: inline-flex; align-items: center; gap: 1px; border: none; background: none; padding: 0; cursor: pointer; font: inherit; -webkit-tap-highlight-color: transparent; }
.pmMa .account-rating:active { opacity: .6; }
.pmMa .account-rating .rating-text { font-size: 13px; font-weight: 500; color: var(--on-surface-variant); margin-left: 7px; }
.pmMa .account-reviews-link { display: block; border: none; background: none; padding: 0; margin-top: 6px; font: inherit; font-size: 13px; font-weight: 600; color: var(--primary-container); cursor: pointer; -webkit-tap-highlight-color: transparent; }
.pmMa .account-reviews-link:active { opacity: .6; }
.pmMa .settings-label { font-size: 12px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--on-surface-variant); margin-bottom: 10px; }
.pmMa .settings-card { background: var(--white); border-radius: 18px; box-shadow: 0 2px 12px rgba(25,42,61,.07); overflow: hidden; }
.pmMa .settings-row { width: 100%; display: flex; align-items: center; gap: 14px; padding: 14px 16px; border: none; border-bottom: 1px solid var(--outline-variant); background: none; font: inherit; text-align: left; cursor: pointer; }
.pmMa .settings-row:last-child { border-bottom: none; }
.pmMa .settings-row:active { background: var(--container-low); }
.pmMa .settings-icon { flex: 0 0 auto; width: 38px; height: 38px; border-radius: 999px; background: rgba(0,101,140,.10); color: var(--primary); display: flex; align-items: center; justify-content: center; }
.pmMa .settings-label-text { flex: 1 1 auto; font-size: 15px; color: var(--on-surface); }
.pmMa .settings-chev { flex: 0 0 auto; color: var(--outline); display: flex; }
.pmMa .settings-row-tip { flex: 0 0 auto; background: var(--primary-container); color: #fff; font-size: 10px; font-weight: 800; letter-spacing: .04em; padding: 3px 8px; border-radius: 999px; }
.pmMa .settings-row.danger:active { background: var(--error-container); }
.pmMa .settings-row.danger .settings-label-text { color: var(--error); font-weight: 600; }
.pmMa .settings-icon.danger { background: var(--error-container); color: var(--error); }
.pmMa .pmAccBedrijf .sub { color:var(--on-surface-variant); font-size:14px; line-height:1.5; margin-bottom:28px; }
.pmMa .profile-field { display:flex; flex-direction:column; gap:8px; margin-bottom:16px; }
.pmMa .profile-field label { font-size:12px; font-weight:500; letter-spacing:.02em; color:var(--on-surface-variant); }
.pmMa .profile-field input { width:100%; border:1px solid #e1e4e8; border-radius:8px; padding:12px 16px; font-size:16px; font-family:inherit; background:var(--white); color:var(--on-surface); outline:none; -webkit-appearance:none; appearance:none; transition:border-color .15s, box-shadow .15s; }
.pmMa .profile-field input:focus { border-color:var(--primary-container); box-shadow:0 0 0 2px rgba(0,175,239,.1); }
.pmMa .pmAccBedrijf .settings-label { margin-top:30px; }
.pmMa .pw-head { display:flex; align-items:center; gap:13px; margin-bottom:18px; padding-right:38px; }
.pmMa .pw-head-icon { flex:0 0 auto; width:44px; height:44px; border-radius:13px; background:rgba(0,101,140,.10); color:var(--primary); display:flex; align-items:center; justify-content:center; }
.pmMa .pw-head h2 { font-size:19px; font-weight:800; letter-spacing:-0.01em; }
.pmMa .pw-head-sub { font-size:13px; line-height:1.4; color:var(--on-surface-variant); margin-top:2px; }
.pmMa .pw-field { margin-bottom:14px; }
.pmMa .pw-field label { display:block; font-size:12px; font-weight:500; letter-spacing:.02em; color:var(--on-surface-variant); margin-bottom:6px; }
.pmMa .pw-input-wrap { position:relative; }
.pmMa .pw-input-wrap input { width:100%; padding:13px 48px 13px 14px; border:1px solid #e1e4e8; border-radius:10px; background:var(--white); color:var(--on-surface); font-size:16px; font-family:inherit; outline:none; -webkit-appearance:none; appearance:none; transition:border-color .15s, box-shadow .15s; }
.pmMa .pw-input-wrap input:focus { border-color:var(--primary-container); box-shadow:0 0 0 2px rgba(0,175,239,.12); }
.pmMa .pw-input-wrap.ok input { border-color:var(--green); }
.pmMa .pw-input-wrap.err input { border-color:var(--error); box-shadow:0 0 0 2px rgba(186,26,26,.10); }
.pmMa .pw-toggle { position:absolute; top:50%; right:5px; transform:translateY(-50%); width:38px; height:38px; display:flex; align-items:center; justify-content:center; border:none; border-radius:9px; background:none; color:var(--outline); cursor:pointer; }
.pmMa .pw-toggle:active { background:var(--container-low); color:var(--primary); }
.pmMa .pw-caps { display:flex; align-items:center; gap:6px; margin-top:7px; font-size:12px; font-weight:600; color:var(--amber); }
.pmMa .pw-caps svg { flex:0 0 auto; width:13px; height:13px; }
.pmMa .pw-strength { margin:-6px 0 14px; }
.pmMa .pw-bars { display:flex; gap:5px; }
.pmMa .pw-bars i { flex:1 1 0; height:5px; border-radius:999px; background:#e6e9ec; transition:background .25s ease; }
.pmMa .pw-strength-label { margin-top:7px; font-size:12px; font-weight:700; color:var(--on-surface-variant); }
.pmMa .pw-strength.s1 .pw-bars i:nth-child(-n+1) { background:var(--error); }
.pmMa .pw-strength.s2 .pw-bars i:nth-child(-n+2) { background:var(--amber); }
.pmMa .pw-strength.s3 .pw-bars i:nth-child(-n+3) { background:#7cb518; }
.pmMa .pw-strength.s4 .pw-bars i { background:var(--green); }
.pmMa .pw-strength.s1 .pw-strength-label { color:var(--error); }
.pmMa .pw-strength.s2 .pw-strength-label { color:var(--amber); }
.pmMa .pw-strength.s3 .pw-strength-label { color:var(--secondary); }
.pmMa .pw-strength.s4 .pw-strength-label { color:var(--secondary); }
.pmMa .pw-rules { display:flex; flex-direction:column; gap:8px; margin:0 0 16px; padding:13px 14px; background:var(--container-low); border-radius:12px; }
.pmMa .pw-rule { display:flex; align-items:center; gap:9px; font-size:12.5px; color:var(--on-surface-variant); transition:color .15s; }
.pmMa .pw-rule-dot { flex:0 0 auto; width:18px; height:18px; border-radius:999px; border:1.5px solid var(--outline-variant); display:flex; align-items:center; justify-content:center; color:transparent; transition:background .18s, border-color .18s, color .18s; }
.pmMa .pw-rule-dot svg { width:10px; height:10px; }
.pmMa .pw-rule.ok { color:var(--secondary); font-weight:600; }
.pmMa .pw-rule.ok .pw-rule-dot { background:var(--green); border-color:var(--green); color:#fff; }
.pmMa .pw-note { display:flex; align-items:center; gap:6px; margin:-6px 0 14px; font-size:12.5px; font-weight:600; }
.pmMa .pw-note svg { flex:0 0 auto; width:13px; height:13px; }
.pmMa .pw-note.ok { color:var(--secondary); }
.pmMa .pw-note.no { color:var(--error); }
.pmMa #pwForm .btn-action:disabled { opacity:.45; cursor:default; }
.pmMa .account-partner-badge { display: inline-flex; align-items: center; gap: 6px; margin-top: 10px; padding: 5px 13px; border-radius: 999px; font-size: 12.5px; font-weight: 700; border: 1px solid; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.pmMa .account-partner-badge svg { width: 15px; height: 15px; flex: 0 0 auto; }
.pmMa .account-partner-badge.on { color: #5BA000; border-color: rgba(91,160,0,.32); background: rgba(91,160,0,.08); }
.pmMa .account-partner-badge.off { color: var(--on-surface-variant); border-color: transparent; background: var(--container-low); }
.pmMa .account-partner-badge:active { opacity: .7; }

/* ── Wat de app niet nodig heeft en wij wel ────────────────────────────────
   In de app is elk accountscherm een eigen view; hier zijn het deelschermen
   binnen één paneel. Vandaar een terugknop en een kop in onze eigen opmaak. */
.pmMa .pmAccTerug {
  display: inline-flex; align-items: center; gap: 7px;
  margin-bottom: 14px; padding: 8px 0;
  background: none; border: none; cursor: pointer;
  font-size: 14px; font-weight: 600; color: var(--primary);
}
.pmMa .pmAccTitel { font-size: 22px; font-weight: 800; letter-spacing: -0.02em; margin-bottom: 10px; }
.pmMa .pmAccSub { color: var(--on-surface-variant); font-size: 14px; line-height: 1.5; margin-bottom: 22px; }
.pmMa .btn-action { width:100%; display:flex; align-items:center; justify-content:center; gap:8px; border:none; border-radius:10px; padding:13px; font-size:14px; font-weight:600; color:#fff; cursor:pointer; margin-bottom:12px; }
.pmMa .btn-action.green { background: var(--green); }
.pmMa .btn-action.danger { background: var(--error); }
.pmMa .btn-action.ghost { background: none; color: var(--on-surface-variant); margin-bottom: 0; }
.pmMa .btn-action:disabled { opacity: .45; cursor: default; }
.pmMa .bid-error { color: var(--error); font-size: 13px; margin: -2px 0 8px; }


/* ══════════════════════════════════════════════════════════════════════════
   POP-UPS — letterlijk uit app.html
   De bottom sheet die de app voor alles gebruikt: wachtwoord wijzigen, reviews,
   bevestigingen. Eén container in de pagina die telkens opnieuw gevuld wordt,
   precies zoals `bidModal` daar.

   ⚠ .pmMa staat hier ook voor de modal zelf, en de modal hangt in de pagina
   BINNEN .pmMa — anders zou de nullijn en de typografie er niet op werken.
   ══════════════════════════════════════════════════════════════════════════ */

.pmMa .modal { position:fixed; inset:0; z-index:200; display:flex; align-items:flex-end; justify-content:center; }
.pmMa .modal-backdrop { position:absolute; inset:0; background:rgba(25,42,61,.45); }
.pmMa .modal-card { position:relative; z-index:1; width:100%; max-width:480px; max-height:92dvh; overflow-y:auto; -webkit-overflow-scrolling:touch; background:var(--white); border-radius:18px 18px 0 0; padding:20px 18px calc(20px + env(safe-area-inset-bottom)); box-shadow:0 -6px 24px rgba(0,0,0,.18); animation:sheetUp .22s ease-out; }
.pmMa .reviews-modal-card { padding:0; max-height:88dvh; display:flex; flex-direction:column; overflow:hidden; }
.pmMa .reviews-modal-head { position:relative; flex:0 0 auto; padding:22px 20px 20px; border-radius:18px 18px 0 0; background:linear-gradient(150deg, var(--primary) 0%, var(--primary-container) 100%); color:#fff; }
.pmMa .reviews-modal-head .modal-close { background:rgba(255,255,255,.22); color:#fff; }
.pmMa .reviews-modal-who { display:flex; align-items:center; gap:14px; }
.pmMa .reviews-modal-avatar { width:56px; height:56px; border-radius:999px; overflow:hidden; background:rgba(255,255,255,.22); display:flex; align-items:center; justify-content:center; flex:0 0 auto; color:#fff; }
.pmMa .reviews-modal-avatar img { width:100%; height:100%; object-fit:cover; display:block; }
.pmMa .reviews-modal-name { font-size:18px; font-weight:800; letter-spacing:-0.01em; margin-bottom:4px; }
.pmMa .reviews-modal-score { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.pmMa .reviews-modal-score-num { font-size:19px; font-weight:800; }
.pmMa .reviews-modal-stars { display:flex; align-items:center; gap:1px; }
.pmMa .reviews-modal-stars svg { display:block; }
.pmMa .reviews-modal-count { font-size:13px; opacity:.85; }
.pmMa .reviews-modal-list { flex:1 1 auto; overflow-y:auto; -webkit-overflow-scrolling:touch; padding:16px 18px calc(16px + env(safe-area-inset-bottom)); }
.pmMa .review-card { background:var(--surface); border:1px solid var(--outline-variant); border-radius:14px; padding:14px 16px; margin-bottom:12px; }
.pmMa .review-card:last-child { margin-bottom:0; }
.pmMa .review-card-top { display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin-bottom:5px; }
.pmMa .review-card-name { font-size:14px; font-weight:700; color:var(--on-surface); }
.pmMa .review-card-date { font-size:12px; color:var(--on-surface-variant); flex:0 0 auto; }
.pmMa .review-card-stars { display:flex; align-items:center; gap:1px; margin-bottom:7px; }
.pmMa .review-card-stars svg { width:13px; height:13px; display:block; }
.pmMa .review-card-text { font-size:14px; color:var(--on-surface-variant); line-height:1.5; white-space:pre-line; }
.pmMa .reviews-modal-empty, .pmMa .reviews-modal-loading { text-align:center; color:var(--on-surface-variant); padding:40px 16px; font-size:14px; }
.pmMa .modal-close { position:absolute; top:12px; right:12px; width:34px; height:34px; border:none; background:var(--container-low); border-radius:50%; color:var(--on-surface-variant); display:flex; align-items:center; justify-content:center; cursor:pointer; }
.pmMa .modal-title { font-size:20px; font-weight:800; margin-bottom:16px; padding-right:38px; }
.pmMa .modal-text { color:var(--on-surface-variant); font-size:14px; line-height:1.5; margin-bottom:16px; }
.pmMa .modal-success { text-align:center; padding:16px 6px 6px; }
.pmMa .success-check { width:64px; height:64px; border-radius:50%; background:rgba(118,162,0,.15); color:#2e7d32; display:flex; align-items:center; justify-content:center; margin:0 auto 14px; }
.pmMa .success-check.del { background:var(--error-container); color:var(--error); }
.pmMa .modal-success h2 { font-size:21px; font-weight:800; margin-bottom:6px; }
.pmMa .modal-success .sub { color:var(--on-surface-variant); font-size:14px; margin-bottom:18px; }

@keyframes sheetUp { from { transform: translateY(100%); } to { transform: translateY(0); } }

/* Het schuifpaneel van de schil en deze pop-up mogen elkaar niet overlappen.
   De app zit op z-index 200; hier moet hij boven de zwevende pil (9990) en het
   menupaneel (9993) uit, anders opent er een pop-up onder de navigatie. */
.pmMa .modal { z-index: 9995; }


/* ══════════════════════════════════════════════════════════════════════════
   FACTUREN — letterlijk uit app.html
   ══════════════════════════════════════════════════════════════════════════ */

.pmMa .modal-title { font-size:20px; font-weight:800; margin-bottom:16px; padding-right:38px; }
.pmMa .modal-text { color:var(--on-surface-variant); font-size:14px; line-height:1.5; margin-bottom:16px; }
.pmMa .fac-os-card { background:var(--white); border-radius:20px; padding:20px; box-shadow:0 4px 20px rgba(25,42,61,.08); margin-bottom:24px; }
.pmMa .fac-os-label { font-size:14px; font-weight:600; color:var(--on-surface-variant); margin-bottom:4px; }
.pmMa .fac-os-amount { font-size:32px; font-weight:800; letter-spacing:-0.02em; color:var(--error); line-height:1.1; }
.pmMa .fac-os-card.is-nul .fac-os-amount { color:var(--secondary); }
.pmMa .fac-os-btw { display:flex; align-items:center; gap:6px; margin-top:12px; color:var(--primary); font-size:14px; font-weight:600; }
.pmMa .fac-os-btw svg { flex:0 0 auto; }
.pmMa .fac-section-title { font-size:12px; font-weight:600; letter-spacing:.05em; text-transform:uppercase; color:var(--on-surface-variant); margin:0 2px 12px; }
.pmMa .fac-next-card { background:var(--white); border-radius:18px; padding:16px; box-shadow:0 4px 20px rgba(25,42,61,.08); margin-bottom:24px; }
.pmMa .fac-next-main { display:flex; justify-content:space-between; align-items:center; }
.pmMa .fac-next-right { text-align:right; }
.pmMa .fac-next-label { font-size:13px; font-weight:500; color:var(--on-surface-variant); margin-bottom:2px; }
.pmMa .fac-next-val { font-size:18px; font-weight:700; color:var(--on-surface); }
.pmMa .fac-spec-toggle { width:100%; margin-top:14px; padding-top:14px; display:flex; align-items:center; justify-content:space-between; gap:8px; border:none; border-top:1px solid var(--container-low); background:none; color:var(--primary); font-size:13px; font-weight:600; font-family:inherit; cursor:pointer; }
.pmMa .fac-spec-toggle svg { flex:0 0 auto; transition:transform .2s; }
.pmMa .fac-spec-toggle[aria-expanded="true"] svg { transform:rotate(90deg); }
.pmMa .fac-spec-list { display:flex; flex-direction:column; margin-top:4px; }
.pmMa .fac-spec-row { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding:11px 0; border-bottom:1px solid var(--container-low); }
.pmMa .fac-spec-row:last-child { border-bottom:none; padding-bottom:0; }
.pmMa .fac-spec-info { min-width:0; }
.pmMa .fac-spec-desc { display:block; font-size:14px; font-weight:600; color:var(--on-surface); }
.pmMa .fac-spec-date { display:block; font-size:12px; color:var(--on-surface-variant); margin-top:1px; }
.pmMa .fac-spec-amt { flex:0 0 auto; font-size:14px; font-weight:700; color:var(--on-surface); white-space:nowrap; }
.pmMa .fac-spec-amt.neg { color:var(--error); }
.pmMa .fac-list { display:flex; flex-direction:column; gap:14px; }
.pmMa .fac-card { background:var(--white); border-radius:18px; padding:16px; box-shadow:0 4px 20px rgba(25,42,61,.08); }
.pmMa .fac-main { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.pmMa .fac-info { flex:1 1 auto; min-width:0; }
.pmMa .fac-top { display:flex; align-items:center; gap:8px; margin-bottom:5px; }
.pmMa .fac-maand { font-size:16px; font-weight:700; color:var(--on-surface); }
.pmMa .fac-nr { font-size:12px; font-weight:500; color:var(--on-surface-variant); }
.pmMa .fac-amount-row { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.pmMa .fac-amount { font-size:20px; font-weight:800; letter-spacing:-0.01em; color:var(--on-surface); }
.pmMa .fac-badge { padding:2px 10px; border-radius:999px; font-size:12px; font-weight:600; white-space:nowrap; }
.pmMa .fac-badge.betaald { background:rgba(149,193,31,.18); color:var(--secondary); }
.pmMa .fac-badge.openstaand { background:var(--error-container); color:var(--error); }
.pmMa .fac-net { margin-top:12px; padding:10px 12px; background:var(--container-low); border-radius:10px; }
.pmMa .fac-net-row { display:flex; justify-content:space-between; align-items:center; gap:12px; font-size:13px; color:var(--on-surface-variant); }
.pmMa .fac-net-row + .fac-net-row { margin-top:4px; }
.pmMa .fac-net-row .neg { color:var(--error); font-weight:600; }
.pmMa .fac-net-row.total { margin-top:7px; padding-top:7px; border-top:1px solid var(--outline-variant); font-size:14px; font-weight:700; color:var(--on-surface); }
.pmMa .fac-net-row.total span:last-child { color:var(--error); }
.pmMa .fac-net.subtle { margin-top:10px; padding:0; background:none; }
.pmMa .fac-net.subtle .fac-net-row { font-size:12px; color:var(--on-surface-variant); }
.pmMa .fac-net.subtle .fac-net-row .neg { color:var(--on-surface-variant); font-weight:500; }
.pmMa .fac-net.subtle .fac-net-row.total { margin-top:5px; padding-top:5px; border-top:1px solid var(--container-low); font-size:12.5px; font-weight:600; color:var(--on-surface-variant); }
.pmMa .fac-net.subtle .fac-net-row.total span:last-child { color:var(--on-surface-variant); }
.pmMa .fac-pay { display:inline-flex; align-items:center; gap:6px; margin-top:12px; padding:8px 16px; border:none; border-radius:10px; background:var(--green); color:#fff; font-size:14px; font-weight:700; font-family:inherit; cursor:pointer; }
.pmMa .fac-pay:active { transform:scale(.97); }
.pmMa .fac-pay svg { flex:0 0 auto; }
.pmMa .fac-dl { flex:0 0 auto; width:48px; height:48px; display:flex; align-items:center; justify-content:center; border-radius:12px; background:var(--container-low); color:var(--primary); box-shadow:0 1px 3px rgba(25,42,61,.08); transition:background .15s, color .15s; }
.pmMa .fac-dl:active { background:var(--primary); color:#fff; transform:scale(.95); }
.pmMa .fac-dl.disabled { opacity:.35; pointer-events:none; }
.pmMa .fac-dl.credit { width:40px; height:40px; color:var(--error); }
.pmMa .fac-dl-spacer { flex:0 0 auto; width:40px; }
.pmMa .fac-dl-col { flex:0 0 auto; display:flex; flex-direction:column; align-items:center; gap:5px; }
.pmMa .fac-dl-link { font-size:11px; font-weight:600; color:var(--primary); text-decoration:none; white-space:nowrap; }
.pmMa .fac-dl-link:active { opacity:.6; }
.pmMa .fac-credit-row { display:flex; align-items:center; gap:10px; margin-top:12px; padding-top:12px; border-top:1px dashed var(--outline-variant); }
.pmMa .fac-credit-label { flex:1 1 auto; font-size:14px; font-weight:600; color:var(--on-surface-variant); }
.pmMa .fac-credit-nr { font-size:12px; font-weight:500; color:var(--outline); }
.pmMa .fac-credit-meta { display:block; font-size:12px; font-weight:500; color:var(--green, #3c763d); margin-top:2px; }
.pmMa .fac-credit-amount { font-size:15px; font-weight:700; color:var(--error); }
.pmMa .fac-more { width:100%; margin-top:20px; padding:14px; display:flex; align-items:center; justify-content:center; gap:8px; border:2px solid var(--outline-variant); border-radius:14px; background:none; color:var(--on-surface-variant); font-size:14px; font-weight:600; font-family:inherit; cursor:pointer; }
.pmMa .fac-more:active { background:var(--container-low); }
.pmMa .fac-empty-state { text-align:center; padding:40px 20px; }
.pmMa .fac-empty-icon { color:var(--green); margin-bottom:14px; }
.pmMa .fac-empty-icon svg { width:40px; height:40px; }
.pmMa .fac-empty-state p { color:var(--on-surface-variant); font-size:15px; margin-bottom:18px; }
.pmMa .fac-empty-state .btn-action { display:inline-block; width:auto; text-decoration:none; }
.pmMa .pay-fields { display:flex; flex-direction:column; gap:10px; margin:4px 0 16px; }
.pmMa .pay-field { display:flex; align-items:center; gap:10px; padding:12px 14px; background:var(--container-low); border-radius:12px; }
.pmMa .pay-field-info { flex:1 1 auto; min-width:0; }
.pmMa .pay-field-label { display:block; font-size:11px; font-weight:600; letter-spacing:.03em; text-transform:uppercase; color:var(--on-surface-variant); margin-bottom:2px; }
.pmMa .pay-field-value { display:block; font-size:16px; font-weight:700; color:var(--on-surface); word-break:break-word; }
.pmMa .pay-copy { flex:0 0 auto; width:42px; height:42px; display:flex; align-items:center; justify-content:center; border:none; border-radius:10px; background:var(--white); color:var(--primary); box-shadow:0 1px 3px rgba(25,42,61,.1); cursor:pointer; transition:transform .1s, color .15s; }
.pmMa .pay-copy:active { transform:scale(.92); }
.pmMa .pay-copy.done { color:var(--secondary); }
.pmMa .pay-note { display:flex; align-items:flex-start; gap:7px; font-size:13px; line-height:1.45; color:var(--on-surface-variant); margin:-4px 2px 16px; }
.pmMa .pay-note svg { flex:0 0 auto; margin-top:2px; }
.pmMa .pay-copy-all { display:flex; align-items:center; justify-content:center; gap:8px; }
.pmMa .pay-copy-all.done { background:var(--secondary); }


/* ══════════════════════════════════════════════════════════════════════════
   PARTNERSTATUS — letterlijk uit app.html
   ══════════════════════════════════════════════════════════════════════════ */

.pmMa .switch { position: relative; display: inline-block; width: 46px; height: 27px; flex: 0 0 auto; }
.pmMa .switch input { position: absolute; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; z-index: 2; }
.pmMa .switch-track { position: absolute; inset: 0; background: var(--outline-variant); border-radius: 999px; transition: background .15s; }
.pmMa .switch-track::after { content: ''; position: absolute; top: 2.5px; left: 2.5px; width: 22px; height: 22px; background: #fff; border-radius: 999px; box-shadow: 0 1px 3px rgba(0,0,0,.25); transition: transform .15s; }
.pmMa .switch input:checked + .switch-track { background: var(--green); }
.pmMa .switch input:checked + .switch-track::after { transform: translateX(19px); }
.pmMa .switch input:disabled { cursor: not-allowed; }
.pmMa .switch input:disabled + .switch-track { opacity: .5; }
.pmMa .partner-card { background: var(--surface); border: 1px solid var(--outline-variant); border-radius: 18px; padding: 18px; margin-top: 4px; }
.pmMa .partner-card.active { background: linear-gradient(180deg, #ecfdf5, var(--surface)); border: 2px solid #22c55e; box-shadow: 0 12px 30px -16px rgba(34,197,94,.4); }
.pmMa .partner-card-top { display: flex; justify-content: space-between; gap: 14px; align-items: flex-start; }
.pmMa .partner-card-title { font-weight: 800; font-size: 16px; color: var(--on-surface); }
.pmMa .partner-card-sub { margin-top: 6px; font-size: 13px; color: var(--on-surface-variant); line-height: 1.45; }
.pmMa .partner-pending { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 12px; padding: 10px 12px; background: #fff7ed; border: 1px solid #fed7aa; border-radius: 12px; font-size: 13px; color: #9a3412; font-weight: 700; }
.pmMa .partner-pending svg { flex: 0 0 auto; }
.pmMa .partner-cancel-link { background: none; border: none; padding: 0; margin-left: auto; font-size: 12px; font-weight: 700; color: #b45309; text-decoration: underline; cursor: pointer; }
.pmMa .partner-benefits { margin-top: 14px; display: flex; flex-direction: column; gap: 8px; font-size: 13px; }
.pmMa .partner-benefit { display: flex; gap: 8px; align-items: flex-start; color: var(--on-surface); }
.pmMa .partner-benefit-icon { flex: 0 0 auto; display: flex; }
.pmMa .partner-benefit-icon.on { color: #16a34a; }
.pmMa .partner-benefit-icon.off { color: var(--outline); }
.pmMa .partner-benefit-note { font-size: 12px; color: var(--on-surface-variant); font-style: italic; margin-top: 2px; }
.pmMa .partner-explain { margin-top: 14px; padding: 12px; background: var(--container-low); border-radius: 12px; font-size: 12px; color: var(--on-surface-variant); line-height: 1.55; }
.pmMa .partner-explain b { color: var(--on-surface); }
.pmMa .partner-fineprint { margin-top: 10px; font-size: 12px; color: var(--on-surface-variant); }
.pmMa .partner-save-msg { margin-top: 10px; font-size: 12px; color: var(--on-surface-variant); }
.pmMa .partner-promo { display: flex; gap: 12px; align-items: flex-start; margin-top: 14px; padding: 14px 16px; border-radius: 14px; background: linear-gradient(135deg, var(--container-low), var(--surface)); border: 1px dashed #22c55e; font-size: 20px; line-height: 1; }
.pmMa .partner-promo-title { font-weight: 800; font-size: 14px; color: var(--on-surface); margin-bottom: 4px; }
.pmMa .partner-promo p { font-size: 13px; color: var(--on-surface-variant); line-height: 1.45; margin: 0; }
.pmMa .partner-promo button { background: none; border: none; padding: 0; margin-top: 8px; font-size: 13px; font-weight: 700; color: #16a34a; text-decoration: underline; cursor: pointer; }


/* ══════════════════════════════════════════════════════════════════════════
   AUTOMATISCH BIEDEN — letterlijk uit app.html
   ══════════════════════════════════════════════════════════════════════════ */

.pmMa .autobid-intro { color:var(--on-surface-variant); font-size:14px; line-height:1.5; margin-bottom:16px; }
.pmMa .autobid-status { display:flex; align-items:center; justify-content:space-between; gap:12px; background:var(--white); border:1px solid var(--outline-variant); border-radius:14px; padding:14px 16px; margin-bottom:16px; }
.pmMa .autobid-status-main { min-width:0; }
.pmMa .autobid-status-title { font-weight:700; font-size:15px; display:flex; align-items:center; gap:8px; }
.pmMa .autobid-status-sub { font-size:13px; color:var(--on-surface-variant); margin-top:3px; }
.pmMa .autobid-status-dot { width:10px; height:10px; border-radius:50%; background:var(--outline-variant); flex:0 0 auto; }
.pmMa .autobid-status-dot.on { background:var(--green); }
.pmMa .autobid-blocked { background:var(--error-container); color:var(--error); border-radius:12px; padding:12px 14px; font-size:13px; line-height:1.45; margin-bottom:16px; font-weight:600; }
.pmMa .amc-card { position:relative; border:2px solid var(--outline-variant); border-radius:16px; padding:18px; margin-bottom:14px; background:var(--white); }
.pmMa .amc-card.wizard { border-color:var(--green); background:linear-gradient(160deg,#f6ffe6 0%,#fff 60%); }
.pmMa .amc-corner-badge { position:absolute; top:12px; right:12px; background:var(--green); color:#fff; font-size:11px; font-weight:800; padding:4px 11px; border-radius:999px; box-shadow:0 2px 6px rgba(76,175,80,.3); }
.pmMa .amc-card .aw-robot { width:46px; height:52px; margin-bottom:8px; }
.pmMa .amc-card .aw-robot .bot { transform:scale(.68); }
.pmMa .amc-icon-gear { font-size:30px; line-height:1; margin-bottom:8px; }
.pmMa .amc-card.amc-active { box-shadow:0 0 0 2px rgba(45,93,110,.25); }
.pmMa .amc-card h3 { font-size:19px; font-weight:800; margin-bottom:6px; }
.pmMa .amc-card p { font-size:13px; color:var(--on-surface-variant); line-height:1.45; margin-bottom:12px; }
.pmMa .amc-benefits { list-style:none; margin:0 0 14px; padding:0; }
.pmMa .amc-benefits li { font-size:13.5px; color:var(--on-surface); padding-left:22px; position:relative; margin-bottom:7px; }
.pmMa .amc-benefits li::before { content:'✓'; position:absolute; left:0; color:var(--green); font-weight:800; }
.pmMa .amc-cta { width:100%; border:none; border-radius:10px; padding:14px; font-size:14px; font-weight:700; cursor:pointer; }
.pmMa .amc-cta.primary { background:#2d5d6e; color:#fff; }
.pmMa .amc-cta.secondary { background:var(--container-low); color:var(--on-surface); border:1px solid var(--outline-variant); }
.pmMa .amc-of { text-align:center; color:var(--outline); font-weight:700; font-size:13px; margin:8px 0 14px; }
.pmMa .amc-toggle-row { display:flex; align-items:center; justify-content:space-between; border-top:1px solid var(--outline-variant); margin-top:14px; padding-top:13px; font-size:14px; font-weight:700; color:var(--on-surface); }
.pmMa .autobid-note { font-size:13px; color:var(--on-surface-variant); background:var(--container-low); border:1px solid var(--outline-variant); border-radius:10px; padding:10px 12px; margin-top:6px; line-height:1.45; }
.pmMa .aw-overlay { position:fixed; inset:0; z-index:260; background:rgba(10,20,40,.6); display:flex; align-items:flex-end; justify-content:center; }
.pmMa .aw-overlay[hidden] { display:none; }
.pmMa .aw-modal { width:100%; max-width:560px; height:94dvh; background:var(--surface); border-radius:18px 18px 0 0; display:flex; flex-direction:column; overflow:hidden; animation:sheetUp .22s ease-out; }
.pmMa .aw-head { flex:0 0 auto; display:flex; align-items:center; justify-content:space-between; padding:calc(14px + env(safe-area-inset-top)) 16px 12px; background:var(--white); border-bottom:1px solid var(--outline-variant); }
.pmMa .aw-head h2 { font-size:18px; font-weight:800; }
.pmMa .aw-head small { color:var(--on-surface-variant); font-size:12px; }
.pmMa .aw-close { width:34px; height:34px; border:none; border-radius:50%; background:var(--container-low); color:var(--on-surface-variant); font-size:22px; line-height:1; cursor:pointer; flex:0 0 auto; }
.pmMa .aw-head-left { display:flex; align-items:center; gap:10px; min-width:0; }
.pmMa .aw-robot { width:36px; height:40px; flex:0 0 auto; position:relative; animation:wzFloat 3s ease-in-out infinite; }
.pmMa .aw-robot .bot { width:68px; height:76px; position:relative; transform:scale(.53); transform-origin:top left; }
.pmMa .aw-robot .ant { position:absolute; top:0; left:50%; width:2px; height:12px; background:#2D5D6E; transform:translateX(-50%); }
.pmMa .aw-robot .ant::after { content:""; position:absolute; top:-5px; left:-4px; width:10px; height:10px; background:#4CAF50; border-radius:50%; animation:wzPulse 1.8s infinite; }
.pmMa .aw-robot .bot-body { position:absolute; left:6px; right:6px; top:12px; bottom:4px; border-radius:12px; background:#fff; border:2px solid #2D5D6E; box-shadow:0 6px 14px rgba(45,93,110,.18); }
.pmMa .aw-robot .visor { position:absolute; left:12px; right:12px; top:20px; height:18px; border-radius:5px; background:linear-gradient(135deg,#0f2730,#2D5D6E); display:flex; align-items:center; justify-content:space-around; padding:0 5px; }
.pmMa .aw-robot .visor .eye { width:5px; height:5px; background:#6ddc6f; border-radius:50%; box-shadow:0 0 4px rgba(109,220,111,.75); animation:wzBlink 4s ease-in-out infinite; }
.pmMa .aw-robot .mouth { position:absolute; left:50%; bottom:12px; transform:translateX(-50%); width:14px; height:5px; border-bottom:2px solid #2D5D6E; border-radius:0 0 14px 14px; background:transparent; }
.pmMa .aw-usps { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:7px; }
.pmMa .aw-usps li { font-size:13px; color:#11313c; padding-left:22px; position:relative; line-height:1.3; }
.pmMa .aw-usps li::before { content:'✓'; position:absolute; left:0; top:0; color:var(--green); font-weight:800; }
.pmMa .aw-progress { flex:0 0 auto; display:flex; gap:4px; padding:10px 10px; background:var(--white); border-bottom:1px solid var(--outline-variant); }
.pmMa .aw-dot { flex:1 1 0; text-align:center; font-size:9px; font-weight:700; letter-spacing:.02em; text-transform:uppercase; color:var(--outline); padding:6px 2px; border-radius:8px; }
.pmMa .aw-dot.active { background:var(--green); color:#fff; }
.pmMa .aw-dot.done { color:var(--green); }
.pmMa .aw-body { flex:1 1 auto; overflow-y:auto; -webkit-overflow-scrolling:touch; padding:18px 16px; }
.pmMa .aw-step { display:none; }
.pmMa .aw-step.active { display:block; }
.pmMa .aw-step h3 { font-size:19px; font-weight:800; margin-bottom:6px; }
.pmMa .aw-sub { color:var(--on-surface-variant); font-size:14px; line-height:1.45; margin-bottom:16px; }
.pmMa .aw-info { font-size:13px; color:var(--on-surface-variant); margin-top:10px; }
.pmMa .aw-cat-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.pmMa .aw-cat-tile { position:relative; border:2px solid var(--outline-variant); border-radius:14px; padding:14px 12px; cursor:pointer; background:var(--white); }
.pmMa .aw-cat-tile.on { border-color:var(--green); background:#f6ffe6; }
.pmMa .aw-cat-check { position:absolute; top:8px; right:8px; width:20px; height:20px; border-radius:50%; background:var(--green); color:#fff; display:none; align-items:center; justify-content:center; font-size:12px; }
.pmMa .aw-cat-tile.on .aw-cat-check { display:flex; }
.pmMa .aw-cat-name { font-weight:700; font-size:14px; padding-right:18px; }
.pmMa .aw-cat-count { font-size:12px; color:var(--on-surface-variant); margin-top:2px; }
.pmMa .wm-slider-card { border:1px solid #e2e8f0; border-radius:14px; padding:22px; margin-bottom:16px; background:#fafafa; }
.pmMa .wm-slider-card h4 { margin:0 0 4px; font-size:16px; font-weight:700; color:#1e293b; }
.pmMa .wm-track-wrap { position:relative; }
.pmMa .wm-track-bg { height:11px; border-radius:6px; background:linear-gradient(to right,#60a5fa 0% 16.7%,#3b82f6 16.7% 41.7%,#22c55e 41.7% 66.7%,#ca8a04 66.7% 86.7%,#ef4444 86.7% 100%); }
.pmMa .wm-track-labels { display:flex; justify-content:space-between; font-size:11px; color:#94a3b8; margin-top:4px; }
.pmMa .wm-thumb { position:absolute; top:50%; width:26px; height:26px; border-radius:50%; background:#fff; border:3.5px solid #22c55e; box-shadow:0 2px 8px rgba(0,0,0,.18); transform:translate(-50%,-50%); pointer-events:none; transition:border-color .15s; }
.pmMa .wm-val-row { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:12px; }
.pmMa .wm-val-num { font-size:28px; font-weight:900; color:#1e293b; line-height:1; }
.pmMa .wm-rp-label { font-size:11px; color:#94a3b8; margin-top:1px; font-weight:500; }
.pmMa .wm-badge { font-size:12px; font-weight:700; padding:4px 12px; border-radius:20px; text-align:center; }
.pmMa .wm-badge.agg-extreme { background:#bfdbfe; color:#1d4ed8; }
.pmMa .wm-badge.agg-high { background:#dbeafe; color:#1d4ed8; }
.pmMa .wm-badge.agg { background:#eff6ff; color:#2563eb; }
.pmMa .wm-badge.opt { background:#dcfce7; color:#15803d; }
.pmMa .wm-badge.sel { background:#fef9c3; color:#854d0e; }
.pmMa .wm-badge.sel-high { background:#fee2e2; color:#991b1b; }
.pmMa .wm-examples { display:flex; gap:8px; flex-wrap:wrap; margin-top:14px; }
.pmMa .wm-ex-pill { background:#fff; border:1px solid #e2e8f0; border-radius:8px; padding:5px 12px; font-size:13px; color:#374151; }
.pmMa .wm-ex-pill b { color:#1e293b; }
.pmMa .aw-pc6 { display:flex; gap:8px; margin-bottom:10px; }
.pmMa .aw-pc6 input { flex:1; padding:11px 12px; border:1px solid var(--outline-variant); border-radius:10px; font-size:15px; text-transform:uppercase; outline:none; }
.pmMa .aw-pc6 input:focus { border-color:var(--primary-container); }
.pmMa .aw-pc6 button { flex:0 0 auto; padding:0 16px; border:none; border-radius:10px; background:var(--primary); color:#fff; font-weight:700; cursor:pointer; }
.pmMa .aw-map-wrap { position:relative; border-radius:14px; overflow:hidden; border:1px solid var(--outline-variant); }
.pmMa .aw-map-hint { position:absolute; left:8px; bottom:8px; z-index:500; background:rgba(15,23,42,.7); color:#fff; font-size:12px; padding:5px 10px; border-radius:8px; pointer-events:none; max-width:80%; }
.pmMa .aw-radius-row { display:flex; align-items:center; gap:10px; margin:12px 0 8px; font-size:13px; }
.pmMa .aw-radius-row input { flex:1; accent-color:var(--green); }
.pmMa .aw-add-btn { width:100%; border:1px dashed var(--green); background:#f6ffe6; color:#3f6212; border-radius:10px; padding:11px; font-weight:700; cursor:pointer; }
.pmMa .aw-add-btn:disabled { opacity:.55; cursor:not-allowed; border-color:var(--outline-variant); background:var(--container-low); color:var(--outline); }
.pmMa .aw-chip { display:inline-flex; align-items:center; gap:6px; background:var(--white); border:1px solid var(--outline-variant); border-radius:999px; padding:6px 10px; font-size:13px; margin:8px 8px 0 0; }
.pmMa .aw-chip button { border:none; background:none; color:var(--error); font-size:16px; line-height:1; cursor:pointer; padding:0; }
.pmMa .aw-field { margin-bottom:18px; }
.pmMa .aw-field > label { display:block; font-size:13px; font-weight:600; color:var(--on-surface); margin-bottom:8px; }
.pmMa .aw-opt { color:var(--outline); font-weight:400; }
.pmMa .aw-field select { width:100%; padding:12px 14px; border:1px solid var(--outline-variant); border-radius:10px; background:var(--white); font-size:15px; -webkit-appearance:none; appearance:none; }
.pmMa .aw-m3 { text-align:center; margin:4px 0; }
.pmMa .aw-m3-val { font-size:28px; font-weight:800; }
.pmMa .aw-m3-unit { font-size:13px; color:var(--on-surface-variant); margin-left:4px; }
.pmMa .aw-field input[type=range] { width:100%; accent-color:var(--green); }
.pmMa .aw-m3-labels { display:flex; justify-content:space-between; font-size:11px; color:var(--on-surface-variant); margin-top:2px; }
.pmMa .aw-pills { display:flex; flex-direction:column; gap:8px; }
.pmMa .aw-pill { text-align:left; border:1px solid var(--outline-variant); background:var(--white); border-radius:10px; padding:11px 14px; font-size:14px; cursor:pointer; display:flex; align-items:center; gap:10px; }
.pmMa .aw-pill::before { content:''; width:16px; height:16px; border-radius:50%; border:2px solid var(--outline-variant); flex:0 0 auto; }
.pmMa .aw-pill.on { border-color:var(--green); background:#f6ffe6; }
.pmMa .aw-pill.on::before { background:var(--green); border-color:var(--green); box-shadow:inset 0 0 0 3px #fff; }
.pmMa .aw-notif { display:flex; gap:10px; }
.pmMa .aw-notif-btn { flex:1; border:1px solid var(--outline-variant); background:var(--white); border-radius:10px; padding:11px 8px; font-size:12.5px; font-weight:600; cursor:pointer; line-height:1.3; }
.pmMa .aw-notif-btn.active { border-color:var(--green); background:#f6ffe6; color:#3f6212; }
.pmMa .aw-sum-row { display:flex; justify-content:space-between; gap:12px; padding:11px 0; border-bottom:1px solid var(--outline-variant); font-size:14px; }
.pmMa .aw-sum-row span { color:var(--on-surface-variant); flex:0 0 auto; }
.pmMa .aw-sum-row strong { text-align:right; }
.pmMa .aw-ok { background:#dcfce7; color:#15803d; border-radius:10px; padding:12px; font-weight:700; margin-top:12px; text-align:center; }
.pmMa .aw-err { background:var(--error-container); color:var(--error); border-radius:10px; padding:12px; font-weight:600; margin-top:12px; }
.pmMa .aw-foot { flex:0 0 auto; display:flex; gap:10px; padding:12px 16px calc(12px + env(safe-area-inset-bottom)); background:var(--white); border-top:1px solid var(--outline-variant); }
.pmMa .aw-back { flex:0 0 auto; border:1px solid var(--outline-variant); background:var(--white); color:var(--on-surface); border-radius:10px; padding:12px 18px; font-weight:700; cursor:pointer; }
.pmMa .aw-next { flex:1 1 auto; border:none; background:var(--green); color:#fff; border-radius:10px; padding:12px; font-weight:800; cursor:pointer; }
.pmMa .aw-next:disabled { background:var(--outline-variant); cursor:not-allowed; }




/* ═══════════════════════════════════════════════════════════════════════════
   KLANTACCOUNT — de klantweergave van dezelfde accountpagina
   Zie includes/klant-account.php. Bewust een klein bestand: dit scherm doet
   weinig en hoort er ook niet uit te zien alsof het veel doet.

   Zelfde tokens en maten als de werkplek, zodat de twee accountpagina's van één
   site lijken. Gescoped op .pmKa, met de nullijn erbij tegen Bootstrap.
   ═══════════════════════════════════════════════════════════════════════════ */

.pmKa {
  --white: #ffffff;
  --inkt: #191c1d;
  --inkt-zacht: #3e4850;
  --outline: #6e7881;
  --lijn: #bdc8d1;
  --fond: #f7fbff;
  --primary: #00658c;
  --blauw: #00afef;
  --groen: #95c11f;
  --amber: #9a6700;
  --fout: #ba1a1a;

  font-family: 'Albert Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
  background: var(--fond);
  color: var(--inkt);
  line-height: 1.5;
}
.pmKa, .pmKa *, .pmKa *::before, .pmKa *::after { margin: 0; padding: 0; box-sizing: border-box; }
.pmKa a { color: inherit; text-decoration: none; }
.pmKa img { display: block; max-width: 100%; }

.pmKa .pmKaBinnen { max-width: 720px; margin: 0 auto; padding: 18px 16px 56px; }
.pmKa .pmKaTitel { font-size: 28px; font-weight: 800; letter-spacing: -0.02em; margin-bottom: 16px; }
.pmKa .pmKaKop { font-size: 17px; font-weight: 800; margin-bottom: 12px; }
.pmKa .pmKaKop--los { margin-top: 30px; }

.pmKa .pmKaGelukt {
  background: rgba(149,193,31,.14); border: 1px solid rgba(149,193,31,.4);
  color: #4d6700; border-radius: 12px; padding: 12px 14px; margin-bottom: 16px;
  font-size: 14px; font-weight: 600;
}

.pmKa .pmKaKaart {
  background: var(--white); border: 1px solid var(--lijn);
  border-radius: 14px; padding: 18px;
}
.pmKa .pmKaVeld { display: flex; flex-direction: column; gap: 6px; margin-bottom: 14px; }
.pmKa .pmKaVeld label { font-size: 12px; font-weight: 500; letter-spacing: .02em; color: var(--inkt-zacht); }
.pmKa .pmKaVeld input {
  width: 100%; padding: 12px 14px; border: 1px solid #e1e4e8; border-radius: 10px;
  background: var(--white); color: var(--inkt); font-size: 16px; font-family: inherit;
  outline: none; -webkit-appearance: none; appearance: none;
}
.pmKa .pmKaVeld input:focus { border-color: var(--blauw); box-shadow: 0 0 0 2px rgba(0,175,239,.12); }
.pmKa .pmKaVast { font-size: 16px; color: var(--inkt); }
.pmKa .pmKaHint { font-size: 12px; color: var(--outline); }

.pmKa .pmKaKnop {
  display: inline-block; width: 100%; text-align: center;
  padding: 13px; border: none; border-radius: 10px;
  background: var(--groen); color: #fff;
  font-size: 14px; font-weight: 700; font-family: inherit; cursor: pointer;
}
.pmKa .pmKaKnop:hover { opacity: .92; }

.pmKa .pmKaMelding, .pmKa .pmKaLeeg {
  background: var(--white); border: 1px solid var(--lijn); border-radius: 14px;
  padding: 26px 22px; text-align: center;
}
.pmKa .pmKaMelding h2 { font-size: 19px; font-weight: 800; margin-bottom: 8px; }
.pmKa .pmKaMelding p, .pmKa .pmKaLeeg p { font-size: 14px; color: var(--inkt-zacht); margin-bottom: 18px; }
.pmKa .pmKaMelding .pmKaKnop, .pmKa .pmKaLeeg .pmKaKnop { width: auto; padding: 12px 24px; }

/* ── Uitloggen ──
   Onderaan de klantpagina, los van de kaarten erboven: het is geen instelling maar
   een uitgang. Een <details>, dus de bevestiging klapt open zonder dat er iets
   geladen hoeft te worden. Zie pm_ka_uitlogblok() in includes/klant-account.php
   voor waarom dat geen tweede pagina meer is.

   De summary staat met order:2 ONDER het paneel zodra hij openstaat. Daardoor is
   dezelfde knop dicht "Uitloggen" en open "Annuleren", en is er geen aparte
   sluitknop nodig. */
.pmKa .pmKaUitlog {
  margin-top: 28px; scroll-margin-top: 90px;
  display: flex; flex-direction: column; gap: 9px;
}
.pmKa .pmKaUitlog > summary { order: 2; }
.pmKa .pmKaUitlogVraag { order: 1; }

/* list-style weg in alle browsers: Chrome/Firefox via list-style, Safari via het
   eigen ::-webkit-details-marker. */
.pmKa .pmKaUitlogKnop { list-style: none; }
.pmKa .pmKaUitlogKnop::-webkit-details-marker { display: none; }

.pmKa .pmKaUitlogKnop {
  display: flex; align-items: center; justify-content: center; gap: 9px;
  width: 100%; padding: 13px; border-radius: 10px;
  border: 1px solid var(--lijn); background: var(--white);
  color: var(--inkt-zacht); font-size: 14px; font-weight: 700;
  cursor: pointer; user-select: none;
}
.pmKa .pmKaUitlogKnop:hover { border-color: var(--fout); color: var(--fout); }
.pmKa .pmKaUitlogKnop:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
.pmKa .pmKaUitlogDicht { display: flex; align-items: center; gap: 9px; }
.pmKa .pmKaUitlogOpen { display: none; }
.pmKa .pmKaUitlog[open] > summary .pmKaUitlogDicht { display: none; }
.pmKa .pmKaUitlog[open] > summary .pmKaUitlogOpen { display: block; }

.pmKa .pmKaUitlogVraag {
  background: var(--white); border: 1px solid var(--lijn); border-radius: 14px;
  padding: 22px; text-align: center;
}
.pmKa .pmKaUitlogVraag p {
  font-size: 14px; color: var(--inkt-zacht); margin: 8px 0 18px;
}
.pmKa .pmKaKnop--fout { background: var(--fout); }

/* ── De aanvragen ────────────────────────────────────────────────────────── */
.pmKa .pmKaLijst { display: flex; flex-direction: column; gap: 10px; }
.pmKa .pmKaRij {
  display: flex; align-items: center; gap: 12px;
  background: var(--white); border: 1px solid var(--lijn);
  border-radius: 12px; padding: 12px;
  transition: background .12s ease;
}
.pmKa .pmKaRij:hover { background: #f3f4f5; }
.pmKa .pmKaFoto {
  flex: 0 0 46px; width: 46px; height: 46px; border-radius: 9px;
  overflow: hidden; background: #192a3d;
}
.pmKa .pmKaFoto img { width: 100%; height: 100%; object-fit: cover; }
.pmKa .pmKaRijInfo { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
.pmKa .pmKaRijTitel {
  font-size: 14px; font-weight: 700; color: var(--primary);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.pmKa .pmKaRijDatum { font-size: 12px; color: var(--outline); }
.pmKa .pmKaStatus {
  flex: 0 0 auto; padding: 3px 10px; border-radius: 999px;
  font-size: 12px; font-weight: 700; white-space: nowrap;
}
.pmKa .pmKaStatus--open { background: rgba(0,175,239,.14); color: #00658c; }
.pmKa .pmKaStatus--behandel { background: rgba(230,149,0,.14); color: var(--amber); }
.pmKa .pmKaStatus--dicht { background: #ffdad6; color: var(--fout); }


/* ══════════════════════════════════════════════════════════════════════════
   HANDMATIG INSTELLEN — de klassen die ik bij de eerste overname MISTE
   Mijn extractiepatroon zocht op `.amc-` (de keuzekaarten) en niet op `.am-`
   (het formulier zelf). Gevolg: het scherm werkte wel maar had geen enkele
   opmaak (Robbie, 31-08-2026: "dat handmatig instellen ziet er niet uit").
   Er is nu een controle die alle gebruikte klassen tegen de CSS legt.
   ══════════════════════════════════════════════════════════════════════════ */

.pmMa .empty { text-align: center; color: var(--on-surface-variant); padding: 40px 16px; font-size: 14px; }
.pmMa .bg-account-hint { font-size:12.5px; line-height:1.5; color:var(--on-surface-variant); margin:10px 2px 0; }
.pmMa .wm-slider-card { border:1px solid #e2e8f0; border-radius:14px; padding:22px; margin-bottom:16px; background:#fafafa; }
.pmMa .wm-slider-card h4 { margin:0 0 4px; font-size:16px; font-weight:700; color:#1e293b; }
.pmMa .am-section { margin-bottom:22px; }
.pmMa .am-section > h3 { font-size:15px; font-weight:800; margin-bottom:10px; }
.pmMa .am-hint { font-size:12.5px; color:var(--on-surface-variant); margin:-6px 0 10px; line-height:1.4; }
.pmMa .am-row { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:6px 0 14px; }
.pmMa .am-field { margin-bottom:12px; }
.pmMa .am-field > label { display:block; font-size:13px; font-weight:600; margin-bottom:6px; }
.pmMa .am-field input, .pmMa .am-field select { width:100%; padding:11px 13px; border:1px solid var(--outline-variant); border-radius:10px; background:var(--white); font-size:15px; -webkit-appearance:none; appearance:none; }
.pmMa .am-radio { font-size:14px; color:var(--on-surface); }
.pmMa .am-radio input { margin-right:8px; }
.pmMa .am-area-row { display:flex; gap:8px; margin-bottom:8px; }
.pmMa .am-area-row input { flex:1 1 auto; min-width:0; padding:11px 12px; border:1px solid var(--outline-variant); border-radius:10px; font-size:15px; text-transform:uppercase; }
.pmMa .am-area-row select { flex:0 0 auto; width:86px; padding:11px 8px; border:1px solid var(--outline-variant); border-radius:10px; background:var(--white); }
.pmMa .am-area-rm { flex:0 0 auto; width:42px; border:1px solid var(--outline-variant); background:var(--white); border-radius:10px; color:var(--error); font-size:18px; cursor:pointer; }
.pmMa .am-add { width:100%; border:1px dashed var(--green); background:#f6ffe6; color:#3f6212; border-radius:10px; padding:10px; font-weight:700; cursor:pointer; margin-top:2px; }
.pmMa .am-toeslag { display:flex; align-items:center; gap:10px; margin-bottom:10px; }
.pmMa .am-toeslag label { flex:1 1 auto; font-size:14px; }
.pmMa .am-toeslag .am-unit { flex:0 0 auto; color:var(--on-surface-variant); font-weight:700; width:16px; text-align:center; }
.pmMa .am-toeslag input { flex:0 0 110px; padding:10px 12px; border:1px solid var(--outline-variant); border-radius:10px; font-size:15px; }
.pmMa .am-cat-h { font-size:15px; font-weight:800; margin:16px 0 8px; color:var(--primary); }
.pmMa .am-sub { border:1px solid var(--outline-variant); border-radius:12px; margin-bottom:8px; overflow:hidden; background:var(--white); }
.pmMa .am-sub-head { display:flex; align-items:center; justify-content:space-between; padding:12px 14px; cursor:pointer; font-weight:700; font-size:14px; }
.pmMa .am-sub-head .am-chev { color:var(--outline); transition:transform .15s ease; display:inline-flex; }
.pmMa .am-sub.open .am-sub-head .am-chev { transform:rotate(180deg); }
.pmMa .am-sub-body { display:none; padding:2px 14px 10px; border-top:1px solid var(--outline-variant); }
.pmMa .am-sub.open .am-sub-body { display:block; }
.pmMa .am-prod-row { display:flex; align-items:center; gap:10px; padding:9px 0; border-bottom:1px solid var(--container-low); }
.pmMa .am-prod-row:last-child { border-bottom:none; }
.pmMa .am-prod-icon { width:32px; height:32px; flex:0 0 auto; object-fit:contain; border-radius:7px; background:var(--surface); }
.pmMa .am-prod-icon-ph { background:var(--container-low); border:1px solid var(--outline-variant); }
.pmMa .am-prod-name { flex:1 1 auto; font-size:14px; min-width:0; }
.pmMa .am-prod-row input { flex:0 0 54px; padding:9px 7px; border:1px solid var(--outline-variant); border-radius:9px; font-size:15px; text-align:right; }
.pmMa .am-catprice-row { display:flex; align-items:center; gap:10px; padding:10px 0; border-bottom:1px solid var(--container-low); }
.pmMa .am-catprice-row label { flex:1 1 auto; font-size:14px; font-weight:600; }
.pmMa .am-catprice-row input { flex:0 0 110px; padding:10px 12px; border:1px solid var(--outline-variant); border-radius:10px; font-size:15px; }

/* Twee losse regels die mijn patronen misten: input.wm-slider begint niet
   met een punt, en .btn-action.bid gebruik ik voor de kopieerknop. */
.pmMa input.wm-slider { position:absolute; top:-6px; left:0; width:100%; height:24px; opacity:0; cursor:pointer; margin:0; }
.pmMa .btn-action.bid { background:var(--primary-container); }


/* ══════════════════════════════════════════════════════════════════════════
   AANVULLING: regels die mijn eerdere patronen misten
   Die zochten op selectors die met een punt beginnen, en lieten daardoor
   `#awMap` liggen (de kaart in stap 3 van de wizard had geen hoogte en was
   dus onzichtbaar), naast `input.wm-slider` en `.btn-action.bid`. Deze set
   is verzameld door élke app-regel te pakken die een klasse of id noemt die
   in onze markup voorkomt, ongeacht hoe de selector geschreven is.
   ══════════════════════════════════════════════════════════════════════════ */

.pmMa .view.active { display: block; }
.pmMa .filter-pill.active { border-color: var(--green); color: #5c7a13; background: rgba(149,193,31,.1); }
.pmMa .filter-pill.active .chev { color: #5c7a13; }
.pmMa .bid-row:active { background:var(--container-low); }
.pmMa .bid-confirm:active { opacity:.9; }
.pmMa .bid-x:active { background:var(--outline-variant); }
.pmMa .tab.active { background: var(--primary-container); color: var(--on-primary-container); }
.pmMa .tab.active span { font-weight: 700; }
.pmMa .tab.active .dot { box-shadow: 0 0 0 2px var(--primary-container); }
.pmMa .card-block .sub { color:var(--on-surface-variant); font-size:14px; margin-bottom:16px; }
.pmMa .bids-section .sub { color:var(--on-surface-variant); font-size:14px; }
.pmMa .celebrate-box .btn-action { position:relative; z-index:1; }
.pmMa .celebrate-box .btn-action.cta { background:linear-gradient(135deg, #9ed42c 0%, var(--green) 100%); color:#fff; font-weight:700; box-shadow:0 4px 10px -3px rgba(0,0,0,.25); }
.pmMa .celebrate-box .btn-action.reject { background:var(--error); color:#fff; margin-top:5px; margin-bottom:0; }
.pmMa .btn-action.paars { background:#7c3aed; color:#fff; font-weight:700; box-shadow:0 4px 10px -3px rgba(124,58,237,.4); }
.pmMa .celebrate-box .btn-action.grijs { background:#e1e4e8; color:var(--on-surface-variant); margin-top:5px; margin-bottom:0; }
.pmMa .btn-action.chat { background:var(--primary); }
.pmMa .btn-action:active { opacity:.9; }
.pmMa .notif-zoekstraal-status.active { color: var(--green); font-weight: 600; }
.pmMa #view-chat-thread.active { display:flex; }
.pmMa .lb-dot.active { background:#fff; width:18px; border-radius:4px; transition:width .2s; }
.pmMa .detail-dot.active { background:#fff; width:16px; border-radius:3px; transition:width .2s; }
.pmMa .ab-promo .aw-robot { width:52px; height:58px; }
.pmMa .ab-promo .aw-robot .bot { transform:scale(.76); }
.pmMa #awMap { width:100%; height:260px; background:#e8eef3; }
.pmMa .tab.active .tip { box-shadow:0 0 0 2px var(--primary-container); }

/* De hoofdschakelaar staat boven de twee keuzekaarten en niet erin: automatisch
   bieden is één instelling, de kaarten gaan alleen over de METHODE. */
.pmMa .amc-hoofdschakelaar {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  background: var(--white); border: 1px solid var(--outline-variant);
  border-radius: 14px; padding: 14px 16px; margin-bottom: 16px;
  font-size: 15px; font-weight: 700; color: var(--on-surface);
}