/* public/schermen/markt/borden.css — Markt als adviseur (goedgekeurd ontwerp 14-10, docs/ontwerp/markt/*.html, zes borden).
   De stijlregels van de borden, ongewijzigd (alle zes dezelfde), alleen afgeschermd onder .mkb zodat ze de rest van de app niet raken.
   Klassen en volgorde zijn die van het ontwerp: de markup in adviseur*.js is dezelfde als in de HTML-bestanden. */
.mkb{margin:0;background:#F8F9FA;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;color:#17223A}
.mkb a{color:#2864AE}
.mkb a:hover{color:#1E4F8C}
.mkb .k{font-size:13px;color:#5D6675}
.mkb .kaart{background:#fff;border-radius:16px;padding:20px 22px;box-shadow:0 1px 2px rgba(20,30,60,.06);min-width:0}
.mkb .tegel{background:#fff;border-radius:16px;padding:14px 16px;box-shadow:0 1px 2px rgba(20,30,60,.06);display:flex;flex-direction:column;gap:3px;min-width:0}
.mkb .chip{display:inline-flex;align-items:center;gap:4px;border-radius:999px;padding:3px 9px;font-size:12px;font-weight:600}
.mkb .up{background:#DCFCE7;color:#166534}
.mkb .down{background:#FEE2E2;color:#991B1B}
.mkb .neutraal{background:#F1F3F6;color:#17223A}
.mkb .warn{background:#FEF3C7;color:#92400E}
.mkb .blauw{background:#EAF1FA;color:#2864AE}
.mkb .sel{display:inline-flex;align-items:center;gap:8px;background:#fff;border:1px solid #e3e4e6;border-radius:6px;padding:9px 12px;font-size:13px;color:#17223A;min-height:40px;box-sizing:border-box;text-decoration:none;cursor:pointer}
.mkb .tab{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:5px;font-size:13px;color:#5D6675;text-decoration:none;border:0;background:transparent}
.mkb .tab.aan{background:#2864AE;color:#fff}
.mkb .dtab{padding:10px 4px;font-size:14px;color:#5D6675;text-decoration:none;border-bottom:2px solid transparent}
.mkb .dtab.aan{color:#2864AE;border-bottom-color:#2864AE;font-weight:600}
.mkb .knop{display:inline-flex;align-items:center;gap:6px;background:#2864AE;color:#fff;border:0;border-radius:5px;padding:9px 14px;font-size:13px;font-weight:600;cursor:pointer;text-decoration:none;min-height:38px}
.mkb .knop.wit{background:#fff;color:#2864AE;border:1px solid #2864AE}
.mkb .ikoon{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;color:#5D6675}
.mkb table{border-collapse:collapse;width:100%;font-size:13px}
.mkb th{text-align:right;font-weight:600;color:#5D6675;padding:10px 10px;border-bottom:1px solid #e3e4e6;white-space:nowrap}
.mkb th:first-child,.mkb td:first-child{text-align:left}
.mkb td{text-align:right;padding:11px 10px;border-bottom:1px solid #EEF0F5;white-space:nowrap;vertical-align:top}
.mkb .bod{display:inline-block;border:1px solid #e3e4e6;border-radius:5px;padding:3px 8px;min-width:52px;text-align:right;background:#fff}
.mkb .voorstel{background:#FFFBEB;border:1px solid #FDE68A;border-radius:8px;padding:12px 14px;display:flex;flex-wrap:wrap;gap:14px;align-items:flex-start;white-space:normal;text-align:left}
.mkb .prod{display:flex;align-items:center;gap:10px;min-width:0}
.mkb .prod .img{width:40px;height:40px;border-radius:6px;background:#F1F3F6;border:1px solid #e3e4e6;display:flex;align-items:center;justify-content:center;color:#6B7486;flex:none}
.mkb .prod .img.l{width:56px;height:56px;border-radius:8px}
.mkb .srt{background:transparent;border:0;padding:0;font:inherit;color:inherit;cursor:pointer;display:inline-flex;align-items:center;gap:3px}
.mkb .srt .pijl{font-size:9px;color:#B4BAC6;line-height:1}
.mkb .srt.aan{color:#2864AE}
.mkb .srt.aan .pijl{color:#2864AE}
.mkb .sub{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:999px;font-size:13px;color:#5D6675;text-decoration:none;border:1px solid #e3e4e6;background:#fff}
.mkb .sub.aan{background:#EAF1FA;color:#2864AE;border-color:#B9CFE9;font-weight:600}
.mkb .scrol{overflow-x:auto}
.mkb .graf{display:flex;flex-direction:column;gap:4px;background:#fff;border-radius:8px}
.mkb .graf .t{font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:#5D6675}
.mkb .leg{display:flex;gap:14px;font-size:11.5px;color:#5D6675;justify-content:center}
.mkb .leg i{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:4px;vertical-align:middle}
.mkb .veld{border:1px solid #e3e4e6;border-radius:6px;padding:8px 10px;font-size:13px;min-height:38px;box-sizing:border-box;background:#fff;color:#17223A}
.mkb .regel{border:1px solid #e3e4e6;border-radius:10px;background:#fff;padding:12px 14px;display:flex;flex-direction:column;gap:8px}
.mkb .schak{width:36px;height:20px;border-radius:999px;background:#2864AE;position:relative;flex:none}
.mkb .schak::after{content:"";position:absolute;top:2px;right:2px;width:16px;height:16px;border-radius:50%;background:#fff}
.mkb .schak.uit{background:#C9CEDB}
.mkb .schak.uit::after{right:auto;left:2px}
.mkb .lnav{display:flex;flex-direction:column;gap:2px}
.mkb .lnav a{padding:9px 12px;border-radius:6px;font-size:13px;color:#17223A;text-decoration:none}
.mkb .lnav a.aan{background:#EAF0F8;color:#2864AE;font-weight:600}
.mkb .ktegel{background:#fff;border-radius:12px;padding:12px 14px;border:1px solid #e3e4e6;cursor:pointer}
.mkb .ktegel.aan{border:2px solid #2864AE}
.mkb .vk{background:#fff;border-radius:12px;border:1px solid #e3e4e6;padding:16px 18px;display:flex;flex-direction:column;gap:10px}
.mkb .vk.p1{border-left:4px solid #991B1B}
.mkb .vk.p2{border-left:4px solid #2864AE}
.mkb .vk.p0{border-left:4px solid #9A5B00}
.mkb .feit{display:grid;grid-template-columns:repeat(3, minmax(0, 1fr));gap:12px;background:#E2E8F2;border-radius:10px;padding:12px 14px}
.mkb .feit div div:first-child{font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:#5D6675;margin-bottom:2px}
.mkb .feit div div:last-child{font-size:13px}
.mkb .deel{display:flex;align-items:center;gap:10px;padding:6px 0;border-top:1px solid #EEF0F5;font-size:13px;flex-wrap:wrap}
.mkb .deel input{width:18px;height:18px}
.mkb .ring{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;flex:none}
.mkb .stap{display:flex;align-items:center;gap:10px;padding:8px 0;border-top:1px solid #EEF0F5;font-size:13px}
.mkb .schak{display:inline-block;vertical-align:middle}
.mkb td.links{text-align:left}
.mkb .sub{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:999px;font-size:13px;color:#5D6675;text-decoration:none;border:1px solid #e3e4e6;background:#fff}
.mkb .sub.aan{background:#EAF1FA;color:#2864AE;border-color:#B9CFE9;font-weight:600}
.mkb .tabel td.links,.mkb .tabel th.links{text-align:left}
.mkb .ster{color:#F5A623;letter-spacing:1px;font-size:14px}
.mkb .ster.rood{color:#991B1B}
.mkb .ster.oranje{color:#9A5B00}
.mkb .ster.groen{color:#166534}
.mkb .arm{border:1px solid #e3e4e6;border-radius:10px;padding:12px 14px;display:flex;flex-direction:column;gap:6px;background:#fff}
.mkb .arm.wint{border:2px solid #2864AE}
.mkb .waarom{background:#E2E8F2;border-radius:10px;padding:12px 14px;font-size:13px}
.mkb .lijst{display:flex;flex-direction:column}
.mkb .lijst a,.mkb .lijst div.r{display:flex;gap:10px;align-items:center;padding:9px 0;border-top:1px solid #EEF0F5;font-size:13px;color:#17223A;text-decoration:none}
.mkb .groot{font-size:26px;font-weight:700;letter-spacing:-.5px}
.mkb .knop,.mkb .sel,.mkb .sub{box-sizing:border-box}
.mkb a.knop{line-height:1.2}
.mkb .kop{font-weight:700;font-size:15px}
.mkb .kopie{background:#F1F3F6;border-radius:8px;padding:10px 12px;font-family:ui-monospace,Menlo,monospace;font-size:12px}

/* Alleen voor de app (niet in het ontwerp): het kader vult de werkruimte; knoppen en velden die in het ontwerp links of spans zijn. */
.mkb{min-height:100%;font-size:13px}
.mkb .mkb-in{padding:20px 28px 40px;display:flex;flex-direction:column;gap:18px;width:100%;box-sizing:border-box}
.mkb button{font-family:inherit}
.mkb button.sub,.mkb button.tab,.mkb button.knop,.mkb button.sel{font:inherit;font-size:13px;cursor:pointer}
.mkb button.tab{border:0}
.mkb button.knop{border:0}
.mkb button.knop.wit{border:1px solid #2864AE}
.mkb button.sub{border:1px solid #e3e4e6}
.mkb button.sub.aan{border-color:#B9CFE9}
.mkb .knop[disabled],.mkb button.sub[disabled]{opacity:.55;cursor:not-allowed}
.mkb input.veld,.mkb select.veld{font:inherit;font-size:13px;color:#17223A}
.mkb .mkb-fout{background:#FEE2E2;color:#991B1B;border-radius:10px;padding:12px 14px;font-size:13px}
.mkb .mkb-laadt{color:#5D6675;font-size:13px;padding:24px 4px}
.mkb .mkb-melding{background:#DCFCE7;color:#166534;border-radius:10px;padding:10px 14px;font-size:13px}
.mkb summary{cursor:pointer}
.mkb .vk .img{width:64px;height:64px;border-radius:8px;object-fit:cover;flex:none;border:1px solid #e3e4e6;background:#F1F3F6}
.mkb td.aan,.mkb tr.mkb-rij{cursor:pointer}
.mkb tr.mkb-rij:hover td{background:#F8F9FB}
.mkb .mkb-uitklap td{white-space:normal;text-align:left;background:#FAFBFD}
.mkb .mkb-hint{color:#5D6675;font-size:12px}
.mkb .mkb-balk{display:inline-block;height:8px;border-radius:4px;background:#2864AE;vertical-align:middle}
.mkb .mkb-spoor{display:inline-block;width:90px;height:8px;border-radius:4px;background:#EEF0F5;vertical-align:middle;margin-right:6px;overflow:hidden}

/* alleen in de app: lange artikelnamen duwen de kolommen niet het scherm uit */
.mkb .scrol td.links { max-width: 520px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* alleen in de app: de kaarten staan in een raster dat met de breedte van het kader meerekt (geen vaste maximale breedte) */
.mkb .mkb-raster { display: grid; grid-template-columns: repeat(auto-fill, minmax(560px, 1fr)); gap: 12px; align-items: start; }
.mkb .mkb-raster--klein { grid-template-columns: repeat(auto-fill, minmax(440px, 1fr)); }