.winkel .mijn-kaart-schil { --mk-inkt: var(--nova-inkt, #161719); --mk-lijn: var(--nova-lijn, #e6e3df); --mk-vlak: var(--nova-vlak, #f3f2ef); --mk-accent: var(--nova-accent, #d77812); --mk-gedempt: var(--nova-gedempt, #6b6f74); padding: 22px 0 64px; color: var(--mk-inkt); }
.winkel .mijn-kaart-kruim { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0 0 22px; font-size: 14px; color: var(--mk-gedempt); }
.winkel .mijn-kaart-kruim a { color: var(--mk-gedempt); text-decoration: none; }
.winkel .mijn-kaart-kruim a:hover { color: var(--mk-inkt); }
.winkel .mijn-kaart-kruim .mijn-kaart-terug { display: inline-flex; align-items: center; gap: 6px; color: var(--mk-inkt); font-weight: 600; }
.winkel .mijn-kaart-kruim [aria-current] { color: var(--mk-inkt); }
.winkel .mijn-kaart-streep { color: #c9c5bf; }
.winkel .mijn-kaart-raster { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: 40px; align-items: start; }
.winkel .mijn-kaart-zij { position: sticky; top: 16px; }
.winkel .mijn-kaart-menu { border: 1px solid var(--mk-lijn); background: #fff; }
.winkel .mijn-kaart-kop { display: flex; flex-direction: column; gap: 4px; padding: 20px 20px 18px; background: var(--mk-inkt); color: #fff; list-style: none; cursor: default; }
.winkel .mijn-kaart-kop::-webkit-details-marker { display: none; }
.winkel .mijn-kaart-kop b { font-size: 17px; font-weight: 700; line-height: 1.3; }
.winkel .mijn-kaart-kop small { font-size: 13.5px; color: rgba(255, 255, 255, .72); }
.winkel .mijn-kaart-nu { display: none; }
.winkel .mijn-kaart-lijst { display: flex; flex-direction: column; }
.winkel .mijn-kaart-item { position: relative; display: flex; align-items: center; gap: 12px; min-height: 48px; padding: 0 20px; border: 0; border-top: 1px solid var(--mk-lijn); background: #fff; color: var(--mk-inkt); font: inherit; font-size: 15px; font-weight: 600; text-decoration: none; text-align: left; width: 100%; box-sizing: border-box; cursor: pointer; }
.winkel .mijn-kaart-lijst > .mijn-kaart-item:first-child { border-top: 0; }
.winkel .mijn-kaart-item:hover { background: var(--mk-vlak); }
.winkel .mijn-kaart-item.is-aan { background: var(--mk-vlak); }
.winkel .mijn-kaart-item.is-aan::before { content: ""; position: absolute; left: -1px; top: 0; bottom: 0; width: 3px; background: var(--mk-accent); }
.winkel .mijn-kaart-ico { flex: 0 0 18px; color: var(--mk-gedempt); }
.winkel .mijn-kaart-item.is-aan .mijn-kaart-ico { color: var(--mk-inkt); }
.winkel .mijn-kaart-teller { margin-left: auto; min-width: 22px; height: 22px; padding: 0 6px; border-radius: 11px; background: var(--mk-accent); color: #fff; font-style: normal; font-size: 13px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; }
.winkel .mijn-kaart-uitform { margin: 0; }
.winkel .mijn-kaart-item.mijn-kaart-uit { font-weight: 500; color: var(--mk-gedempt); }
.winkel .mijn-kaart-titel { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; margin: 0 0 22px; }
.winkel .mijn-kaart-titel .mijn-kaart-h1 { margin: 0; font-weight: 700; font-size: 40px; line-height: 1.05; letter-spacing: 0; text-transform: uppercase; color: var(--mk-inkt); }
.winkel.stencil-koppen .mijn-kaart-titel .mijn-kaart-h1 { font-family: "Saira Stencil One", var(--winkel-letter); font-weight: 400; font-size: 44px; letter-spacing: .02em; }
.winkel .mijn-kaart-actie { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 50px; padding: 0 26px; border: 1.5px solid var(--mk-inkt); background: #fff; color: var(--mk-inkt); font: inherit; font-size: 15.5px; font-weight: 700; text-decoration: none; white-space: nowrap; box-sizing: border-box; cursor: pointer; }
.winkel .mijn-kaart-actie .mijn-kaart-ico { color: currentColor; }
.winkel .mijn-kaart-actie.is-oranje { background: var(--mk-accent); border-color: var(--mk-accent); color: #fff; }
.winkel .mijn-kaart-actie.is-oranje:hover { filter: brightness(.94); }
.winkel .mijn-kaart-actie:not(.is-oranje):hover { background: var(--mk-vlak); }
.winkel .mijn-kaart-wacht { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin: 0 0 20px; padding: 24px; background: #fdf6ec; }
.winkel .mijn-kaart-wacht-tekst { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.winkel .mijn-kaart-oog { font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--mk-gedempt); }
.winkel .mijn-kaart-wacht-tekst b { font-size: 17px; line-height: 1.35; }
.winkel .mijn-kaart-wacht-tekst p { margin: 2px 0 0; font-size: 14px; line-height: 1.5; color: var(--mk-gedempt); }
.winkel .mijn-kaart-wacht-knoppen { display: flex; gap: 10px; flex: 0 0 auto; }
.winkel .mijn-kaart-wacht-knoppen form { margin: 0; }
.winkel .mijn-kaart-balk { display: flex; align-items: center; gap: 14px; margin: 0 0 12px; padding: 14px 18px; background: #fdf6ec; border-left: 3px solid var(--nova-accent, #d77812); font-size: 14.5px; line-height: 1.45; color: var(--nova-inkt, #161719); }
.winkel .mijn-kaart-balk > .mijn-kaart-ico { color: var(--nova-accent, #d77812); }
.winkel .mijn-kaart-balk p { margin: 0; flex: 1 1 auto; min-width: 0; }
.winkel .mijn-kaart-pijl { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; color: var(--nova-accent, #d77812); font-weight: 700; text-decoration: none; white-space: nowrap; }
.winkel .mijn-kaart-pijl .mijn-kaart-ico { color: currentColor; }
@media (min-width: 901px) {
.winkel .mijn-kaart-menu::details-content { content-visibility: visible; display: block; }
.winkel .mijn-kaart-kop { pointer-events: none; }
}
.winkel .mijn-kaart-inhoud > .klant-twee:has(#uitnodigen) { grid-template-columns: minmax(0, 1fr); gap: 24px; }
.winkel .mijn-kaart-inhoud > .klant-twee:has(#uitnodigen) > div:first-child > .klant-kaart-blok > .klant-kaartkop,
.winkel .mijn-kaart-inhoud > .klant-twee:has(#uitnodigen) > div:first-child > .klant-kaart-blok > .klant-uitleg { display: none; }
.winkel .mijn-kaart-inhoud > .klant-twee:has(#uitnodigen) > div:last-child > .klant-kaart-blok:not(#uitnodigen) { display: none; }
.winkel .mijn-kaart-hoofd:not(:has(.klant-melding.fout)) .mijn-kaart-inhoud #uitnodigen:not(:target) { display: none; }
.winkel .mijn-kaart-inhoud #uitnodigen { scroll-margin-top: 140px; }
.winkel .mijn-kaart-inhoud #uitnodigen .klant-vorm { display: flex; flex-direction: column; align-items: stretch; gap: 18px; max-width: 560px; }
.winkel .mijn-kaart-inhoud #uitnodigen .klant-vorm > *, .winkel .mijn-kaart-inhoud #uitnodigen .klant-vorm > * > * { grid-column: auto; min-width: 0; max-width: 100%; }
.winkel .mijn-kaart-inhoud #uitnodigen .klant-vorm input:not([type="checkbox"]), .winkel .mijn-kaart-inhoud #uitnodigen .klant-vorm select { width: 100%; min-width: 0; box-sizing: border-box; }
.winkel .mijn-kaart-inhoud #uitnodigen .klant-vorm > div { display: flex; flex-direction: column; gap: 12px; }
.winkel .mijn-kaart-inhoud #uitnodigen .klant-keuzes { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.winkel .mijn-kaart-inhoud #uitnodigen .klant-olabel, .winkel .mijn-kaart-inhoud #uitnodigen .klant-uitleg.klein, .winkel .mijn-kaart-inhoud #uitnodigen .klant-keuze small { font-size: 13px; }
.winkel .mijn-kaart-inhoud #uitnodigen .klant-vorm > div.klant-vormknoppen { flex-direction: row; flex-wrap: wrap; justify-content: flex-start; align-items: center; }
.winkel .mijn-kaart-inhoud .klant-kaart-blok > .klant-tabelvak { margin-left: 0; margin-right: 0; }
.winkel .mijn-kaart-inhoud .klant-tabel { font-size: 14px; }
.winkel .mijn-kaart-inhoud .klant-tabel th { font-size: 13px; }
.winkel .mijn-kaart-inhoud .klant-tabel td, .winkel .mijn-kaart-inhoud .klant-tabel .klant-stand { font-size: 14px; }
.winkel.stencil-koppen .mijn-best .mijn-best-h { font-family: "Saira Stencil One", var(--winkel-letter); font-weight: 400; letter-spacing: .02em; }
.winkel .mijn-kaart-inhoud .mijn-best .mijn-best-h { font-size: 44px; line-height: 1.05; }
.winkel .mijn-kaart-inhoud small, .winkel .mijn-kaart-inhoud .klant-kaart-blok small { font-size: 13px; }
.winkel .mijn-kaart-inhoud .klant-x { min-width: 44px; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; }
.winkel .mijn-best-factuur { font-size: 14px; color: var(--nova-gedempt, #6b6f74); white-space: nowrap; }
.winkel .mijn-best-factuur.is-open { color: var(--nova-accent, #d77812); font-weight: 700; }
.winkel .mijn-kaart-inhoud > .klant-meer { display: inline-flex; align-items: center; min-height: 44px; margin: -12px 0 4px; font-size: 14px; }
.winkel .mijn-kaart-inhoud > .klant-meer + .klant-kaart-blok > h2 { display: none; }
.winkel .mijn-kaart-inhoud .klant-sub { font-size: 14px; }
.winkel .mijn-kaart-inhoud .klant-acties { display: flex; flex-flow: row wrap; justify-content: flex-start; align-items: center; gap: 10px; }
.winkel .mijn-kaart-inhoud .klant-kaart-blok > .klant-acties { margin-bottom: 28px; }
.winkel .mijn-kaart-inhoud .klant-tabel .klant-sub { font-size: 13px; }
.winkel .mijn-extra-actie-sub { margin-top: -2px; font-size: 14px; line-height: 1.4; color: var(--nova-gedempt, #6b6f74); }
.winkel .mijn-kaart-inhoud > .mijn-extra { margin-top: 0; }
.winkel .mijn-kaart-inhoud .klant-kaart-blok:first-child { margin-top: 0; }
@media (max-width: 900px) {
.winkel .mijn-kaart-schil { padding: 14px 0 40px; }
.winkel .mijn-kaart-kruim { margin-bottom: 14px; font-size: 13.5px; }
.winkel .mijn-kaart-raster { grid-template-columns: minmax(0, 1fr); gap: 18px; }
.winkel .mijn-kaart-zij { position: static; }
.winkel .mijn-kaart-kop { position: relative; cursor: pointer; padding: 14px 52px 14px 16px; min-height: 44px; }
.winkel .mijn-kaart-kop::after { content: ""; position: absolute; right: 20px; top: 50%; width: 9px; height: 9px; margin-top: -7px; border-right: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(45deg); }
.winkel .mijn-kaart-menu[open] .mijn-kaart-kop::after { margin-top: -2px; transform: rotate(-135deg); }
.winkel .mijn-kaart-kop small { display: none; }
.winkel .mijn-kaart-nu { display: block; font-size: 13.5px; color: rgba(255, 255, 255, .72); }
.winkel .mijn-kaart-item { padding: 0 16px; }
.winkel .mijn-kaart-titel { flex-direction: column; gap: 14px; margin-bottom: 16px; }
.winkel .mijn-kaart-titel .mijn-kaart-h1, .winkel.stencil-koppen .mijn-kaart-titel .mijn-kaart-h1, .winkel .mijn-kaart-inhoud .mijn-best .mijn-best-h { font-size: 32px; }
.winkel .mijn-kaart-titel .mijn-kaart-actie { width: 100%; }
.winkel .mijn-kaart-wacht { flex-direction: column; align-items: stretch; padding: 18px 16px; gap: 16px; }
.winkel .mijn-kaart-wacht-knoppen .mijn-kaart-actie { padding: 0 18px; }
.winkel .mijn-kaart-wacht-knoppen form { flex: 1 1 auto; }
.winkel .mijn-kaart-wacht-knoppen form .mijn-kaart-actie { width: 100%; }
.winkel .mijn-kaart-balk { flex-wrap: wrap; padding: 12px 14px; gap: 8px 12px; }
.winkel .mijn-kaart-balk p { flex-basis: calc(100% - 40px); }
.winkel .mijn-kaart-balk .mijn-kaart-pijl { margin-left: 30px; }
}
@media (max-width: 600px) {
.winkel .mijn-kaart-inhoud #uitnodigen .klant-keuzes { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 720px) {
body.winkel .mijn-best .mijn-best-tabel td:nth-child(7):has(.mijn-best-factuur) { display: block; grid-column: 2; text-align: right; align-self: center; }
.winkel .mijn-best-factuur::before { content: "Factuur "; font-weight: 400; color: var(--nova-gedempt, #6b6f74); }
}
.winkel .mijn-kaart-inhoud .mijn-extra-rol, .winkel .mijn-kaart-inhoud .mijn-extra-rol.is-beheerder { height: auto; padding: 0; background: none; color: var(--nova-inkt, #161719); font-size: 15px; }
@media (min-width: 1100px) {
.winkel .mijn-kaart-inhoud .mijn-extra-collega { grid-template-columns: 44px minmax(0, 1.6fr) 110px minmax(0, 1.1fr) minmax(0, 1.3fr) auto; gap: 16px; }
.winkel .mijn-kaart-inhoud .mijn-extra-collega-mag { display: contents; }
.winkel .mijn-kaart-inhoud .mijn-extra-collega-zin { font-size: 15px; color: var(--nova-inkt, #161719); }
}
@media (min-width: 1024px) {
.winkel.werkplaats.terra .klant-tabs a.klant-tab-instel { order: 10; align-self: stretch; height: 44px; margin: 8px 0 0; padding: 0 16px; font-size: 14px; }
}