ms-*,visually-hidden,form-check,btn-close). - Wat er nog in staat is het SB Admin 2-thema plus de ista-aanpassingen die op Bootstrap-SELECTORS moeten blijven staan: het 11-delige lg-raster (col-lg-5 = 48,45%,col-lg-11 = 100%),.btn-primary in huisblauw #0071F0,de goot van .row via --bs-gutter-x,en de veldafstanden. Die winnen niet op specificiteit maar op POSITIE: laatst gedefinieerd wint. Omwisselen geeft een andere portal zonder dat er één CSS-regel wijzigt. - En topbar-divider,no-arrow,animated--grow-in,text-gray-400,img-profile,sidebar-brand en scroll-to-top hebben hun BASISREGEL nergens anders: Bootstrap 5 kent die klassen niet en dit bestand zet er alleen thema-overrides bovenop (donker/hoog contrast),geen kleur of positie voor de standaardweergave. Wie de link naar vendor-sb-admin-2.css weghaalt voordat die basisregels hierheen zijn overgezet,krijgt een kleurloze navbar en een zijbalk zonder opmaak. ===================================================================== */ .autocomplete{position:relative;display:inline-block}.autocomplete-items{position:absolute;border:1px solid #d4d4d4;border-bottom:none;border-top:none;z-index:99;min-width:100px;max-width:150px;top:100%;left:0;right:0}.autocomplete-items div{padding:10px;cursor:pointer;background-color:#fff;border-bottom:1px solid #d4d4d4}.autocomplete-items div:hover{background-color:#e9e9e9}.autocomplete-active{background-color:#1e90ff!important;color:#fff}.percbox{min-width:100px;max-width:150px;margin-top:8px}.ajax-loader{background-color:#f8f8f8;display:block;height:100%;left:0;margin-left:0;margin-top:0;opacity:.9;position:absolute;top:0;width:100%}.ajax-loader img{left:50%;margin-left:-33px;margin-top:-33px;position:absolute;top:50%}.figureMaster{padding-left:0;padding-right:0;padding-block:var(--ista-card-gap)}.figureParent{min-width:100%;max-width:100%;margin:0 auto}.ista-chart-box{position:relative;width:100%;height:400px}.ista-gauge-box{position:relative;width:307.62px;max-width:100%;margin:0 auto}.chart-figure{width:100%;max-width:100%;margin:0 auto}input:invalid{border-color:red}input,input:valid{border-color:#ccc}.lowercase-input{text-transform:lowercase}.iOSCheckContainer{position:relative;height:27px;cursor:pointer;overflow:hidden}.iOSCheckContainer input{position:absolute;top:5px;left:30px;filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=0);opacity:0}.iOSCheckContainer label{white-space:nowrap;font-size:17px;line-height:17px;font-weight:700;font-family:Helvetica Neue,Arial,Helvetica,sans-serif;cursor:pointer;display:block;height:27px;position:absolute;width:auto;top:0;padding-top:5px;overflow:hidden}.iOSCheckContainer,.iOSCheckContainer label{user-select:none;-moz-user-select:none;-khtml-user-select:none}.iOSCheckDisabled{filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=50);opacity:.5}label.iOSCheckLabelOn{color:#fff;background:url(/img/ios-style-checkboxes/on.png?1284697268) no-repeat;text-shadow:0px 0px 2px rgba(0,0,0,.6);left:0;padding-top:5px}label.iOSCheckLabelOn span{padding-left:8px}label.iOSCheckLabelOff{color:#8b8b8b;background:url(/img/ios-style-checkboxes/off.png?1284697268) no-repeat right 0;text-shadow:0px 0px 2px rgba(255,255,255,.6);text-align:right;right:0}label.iOSCheckLabelOff span{padding-right:8px}.iOSCheckHandle{display:block;height:27px;cursor:pointer;position:absolute;top:0;left:0;width:0;background:url(/img/ios-style-checkboxes/slider_left.png?1284697268) no-repeat;padding-left:3px}.iOSCheckHandleRight{height:100%;width:100%;padding-right:3px;background:url(/img/ios-style-checkboxes/slider_right.png?1284697268) no-repeat right 0}.iOSCheckHandleCenter{height:100%;width:100%;background:url(/img/ios-style-checkboxes/slider_center.png?1284697268)}html,body{height:100%}@media(min-width:768px)and (pointer:fine){body.app-shell{height:100vh;height:100dvh;overflow:hidden}body.app-shell #wrapper{display:flex;height:100vh;height:100dvh;overflow:hidden;align-items:stretch}body.app-shell #wrapper>.sidebar{height:100vh;height:100dvh;overflow-y:auto;overflow-x:hidden;flex:0 0 auto}body.app-shell #wrapper>.fullwidth{display:flex;flex-direction:column;height:100vh;height:100dvh;min-width:0;overflow:hidden}body.app-shell #wrapper>.fullwidth>main.app-main{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;overflow:hidden}body.app-shell #wrapper>.fullwidth #content{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;overflow:hidden}body.app-shell #content>.topbar{flex:0 0 auto}body.app-shell #content>.container-fluid{flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden}body.app-shell footer.fixed-bottom{position:static;flex:0 0 auto}}:root{--ista-series-1: #0065e4;--ista-series-2: #00003C;--ista-bg: #f8f9fc;--ista-surface: #ffffff;--ista-surface-alt: #f4f7f9;--ista-text: #3a3b45;--ista-text-muted: #64748b;--ista-border: #e3e6f0;--ista-accent: #0071ff;--ista-accent-contrast: #ffffff;--ista-shadow: rgba(58, 59, 69, .15);--ista-focus-ring: #00003C;--ista-focus-ring-halo: #ffffff;--ista-dropdown-focus-ring: #1beb83;--ista-dropdown-focus-edge: #00003C;--ista-card-gap: 1rem;--ista-card-gap-tight: .5rem;--ista-card-pad: 1rem;--ista-loader-min: 25rem}html[data-theme=dark]{--ista-series-1: #1a66d6;--ista-series-2: #55709e;--ista-bg: #001026;--ista-surface: #0a1a3a;--ista-surface-alt: #122544;--ista-text: #e6ecf5;--ista-text-muted: #9fb0c8;--bs-secondary-color: var(--ista-text-muted);--bs-link-color: #4d9cf8;--bs-link-color-rgb: 77, 156, 248;--bs-link-hover-color: #abcffb;--bs-link-hover-color-rgb: 171, 207, 251;--ista-border: #1f3358;--ista-accent: #3d8bff;--ista-accent-contrast: #ffffff;--ista-shadow: rgba(0, 0, 0, .55);color-scheme:dark;--ista-focus-ring: #1beb83;--ista-focus-ring-halo: #001026;--ista-dropdown-focus-edge: #001026}body.app-shell,body.app-shell #wrapper{background-color:var(--ista-bg);color:var(--ista-text);transition:background-color .2s ease,color .2s ease}html[data-theme=dark] body{background-color:var(--ista-bg);color:var(--ista-text)}html[data-theme=dark] .sidebar,html[data-theme=dark] .topbar.bg-white,html[data-theme=dark] footer.bg-white,html[data-theme=dark] footer.fixed-bottom,html[data-theme=dark] .bg-white,html[data-theme=dark] .backWhite{background-color:var(--ista-surface)!important}html[data-theme=dark] .card{background-color:var(--ista-surface);border-color:transparent;color:var(--ista-text);box-shadow:0 .15rem 1.75rem 0 var(--ista-shadow)}html[data-theme=dark] .textBlack,html[data-theme=dark] h1,html[data-theme=dark] h2,html[data-theme=dark] h3,html[data-theme=dark] h4,html[data-theme=dark] h5,html[data-theme=dark] h6{color:var(--ista-text)!important}html[data-theme=dark] .text-gray-400,html[data-theme=dark] .text-gray-500,html[data-theme=dark] .text-gray-600,html[data-theme=dark] .text-gray-700,html[data-theme=dark] .text-gray-800,html[data-theme=dark] .small,html[data-theme=dark] small{color:var(--ista-text-muted)!important}html[data-theme=dark] .text-primary{color:#7693e6!important}html[data-theme=dark] .text-success{color:#4d9cf8!important}html[data-theme=dark] .text-info{color:#2ea4b6!important}html[data-theme=dark] .text-danger{color:#ec7064!important}html[data-theme=dark] .text-secondary,html[data-theme=dark] .text-muted,html[data-theme=dark] .text-body{color:var(--ista-text-muted)!important}html[data-theme=dark] hr,html[data-theme=dark] .sidebar-divider{border-color:var(--ista-border)}html[data-theme=dark] .table{color:var(--ista-text)}html[data-theme=dark] .table th,html[data-theme=dark] .table td,html[data-theme=dark] .table thead th{border-color:var(--ista-border)!important}html[data-theme=dark] .table-striped tbody tr:nth-of-type(odd){background-color:var(--ista-surface-alt)}html[data-theme=dark] .table-hover tbody tr:hover{background-color:var(--ista-surface-alt);color:var(--ista-text)}html[data-theme=dark] .fullwidth,html[data-theme=dark] .valueTable{color:var(--ista-text)}html[data-theme=dark] .fullwidth th,html[data-theme=dark] .fullwidth td,html[data-theme=dark] .valueTable th,html[data-theme=dark] .valueTable td{border-color:var(--ista-border)!important}html[data-theme=dark] .tableRowAlternator1{background-color:var(--ista-surface);color:var(--ista-text)}html[data-theme=dark] .tableRowAlternator2{background-color:var(--ista-surface-alt);color:var(--ista-text)}html[data-theme=dark] .tableTotal{color:var(--ista-text)}html[data-theme=dark] .dropdown-menu{background-color:var(--ista-surface);border-color:var(--ista-border);box-shadow:0 .15rem 1.75rem 0 var(--ista-shadow);color:var(--ista-text-muted)}html[data-theme=dark] .dropdown-item{color:var(--ista-text)}html[data-theme=dark] .dropdown-item:hover,html[data-theme=dark] .dropdown-item:focus{background-color:var(--ista-surface-alt);color:var(--ista-text)}html[data-theme=dark] .dropdown-divider{border-color:var(--ista-border)}html[data-theme=dark] .form-control,html[data-theme=dark] input,html[data-theme=dark] select,html[data-theme=dark] textarea{background-color:var(--ista-surface-alt);color:var(--ista-text);border-color:var(--ista-border)}html[data-theme=dark] .form-control::placeholder{color:var(--ista-text-muted)}html[data-theme=dark] select option,html[data-theme=dark] select optgroup{background-color:var(--ista-surface);color:var(--ista-text)}html[data-theme=dark] .modal-content{background-color:var(--ista-surface);color:var(--ista-text);border-color:var(--ista-border)}html[data-theme=dark] .modal-header,html[data-theme=dark] .modal-footer{border-color:var(--ista-border)}html[data-theme=dark] .btn-close,html[data-contrast=on] .btn-close{filter:var(--bs-btn-close-white-filter)}html[data-theme=dark] .form-select,html[data-contrast=on] .form-select{--bs-form-select-bg-img: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23dee2e6' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e")}html[data-theme=dark] .form-switch .form-check-input:not(:checked):not(:focus),html[data-contrast=on] .form-switch .form-check-input:not(:checked):not(:focus){--bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%28255, 255, 255, 0.25%29'/%3e%3c/svg%3e")}html[data-theme=dark] .nav-tabs{border-bottom-color:var(--ista-border)}html[data-theme=dark] .nav-tabs .nav-link{color:var(--ista-text-muted)}html[data-theme=dark] .nav-tabs .nav-link:hover,html[data-theme=dark] .nav-tabs .nav-link:focus{border-color:var(--ista-border);color:var(--ista-text)}html[data-theme=dark] .nav-tabs .nav-link.active,html[data-theme=dark] .nav-tabs .nav-item.show .nav-link{color:var(--ista-text);background-color:var(--ista-surface);border-color:var(--ista-border) var(--ista-border) var(--ista-surface)}html[data-theme=dark] .sidebar .nav-item .nav-link,html[data-theme=dark] .sidebar .nav-item .nav-link span{color:var(--ista-text)}html[data-theme=dark] .sidebar .nav-item.active .nav-link,html[data-theme=dark] .sidebar .nav-item.active .nav-link span{color:var(--istaLime)}html[data-theme=dark] .istaGreen{color:var(--ista-accent)}html[data-theme=dark] .istaBlue{color:#9fb2d8}html[data-theme=dark] .logo{filter:brightness(0) invert(1)}html[data-contrast=on]{--ista-series-1: #ffffff;--ista-series-2: #ffee32;--ista-bg: #000000;--ista-surface: #000000;--ista-surface-alt: #0d0d0d;--ista-text: #ffffff;--ista-text-muted: #ededed;--bs-secondary-color: var(--ista-text-muted);--ista-border: #ffffff;--ista-accent: #ffee32;--ista-accent-contrast: #000000;--ista-shadow: rgba(0, 0, 0, .9);color-scheme:dark;--ista-focus-ring: #ffee32;--ista-focus-ring-halo: #000000}html[data-contrast=on] a:focus,html[data-contrast=on] button:focus,html[data-contrast=on] input:focus,html[data-contrast=on] select:focus,html[data-contrast=on] textarea:focus,html[data-contrast=on] [tabindex]:focus,html[data-contrast=on] .nav-link:focus,html[data-contrast=on] *:focus-visible{outline:3px solid var(--ista-accent)!important;outline-offset:2px!important}html[data-contrast=on] .card,html[data-contrast=on] .dropdown-menu,html[data-contrast=on] .modal-content,html[data-contrast=on] .form-control,html[data-contrast=on] input,html[data-contrast=on] select,html[data-contrast=on] textarea,html[data-contrast=on] .btn{border:2px solid var(--ista-border)!important}html[data-contrast=on] a:not(.btn):not(.nav-link):not(.theme-option){color:var(--ista-accent)!important;text-decoration:underline!important}html[data-contrast=on] .istaGreen{color:#fff!important}html[data-contrast=on] .istaBlue{color:var(--ista-accent)!important}.theme-toggle .nav-link{cursor:pointer}.theme-toggle .nav-link i{font-size:1.1rem;color:var(--ista-text-muted)}.theme-option.active{font-weight:700;color:var(--ista-accent)}.theme-option.active i{color:var(--ista-accent)}html[data-theme=dark] .border{border-color:var(--ista-border)!important}html[data-theme=dark] .btn-outline-secondary{color:var(--ista-text);border-color:var(--ista-accent)}html[data-theme=dark] .btn-outline-secondary:hover{color:#fff;background-color:var(--ista-accent);border-color:var(--ista-accent)}html[data-theme=dark] .btn-outline-secondary:disabled,html[data-theme=dark] .btn-outline-secondary.disabled{color:var(--ista-text-muted);border-color:var(--ista-border);background-color:transparent;opacity:.55}html[data-theme=dark] .backGreen{background-color:var(--ista-series-1)!important;border-color:transparent}html[data-theme=dark] .backBlue{background-color:var(--ista-series-2)!important;border-color:transparent}html[data-theme=dark] .tableHeaderGreen{background-color:var(--ista-series-1)!important}html[data-theme=dark] .tableHeaderBlue{background-color:var(--ista-series-2)!important}html[data-theme=dark] .backGray{background-color:var(--ista-surface-alt)!important;border-color:transparent;color:var(--ista-text)}html:not([data-contrast=on]) .backGreen select,html:not([data-contrast=on]) .backBlue select,html:not([data-contrast=on]) .backGray select,html:not([data-contrast=on]) select.backGreen,html:not([data-contrast=on]) select.backBlue,html:not([data-contrast=on]) select.backGray{border-color:transparent}html[data-theme=dark] img[src*=logo2],html[data-theme=dark] img[src*=Arrow],html[data-contrast=on] img[src*=Arrow]{filter:brightness(0) invert(1)}.navbar .lang-select{display:flex;align-items:center;gap:.4rem;margin:0}.navbar .lang-select img{width:18px;height:18px}.navbar .lang-select select{width:auto;padding-top:.15rem;padding-bottom:.15rem}.navbar-nav .theme-toggle .nav-link{padding-top:.25rem;padding-bottom:.25rem}.settings-culture-select{max-width:320px}.settings-theme-group .theme-option.active{background-color:var(--ista-accent);color:var(--ista-accent-contrast);border-color:var(--ista-accent)}.peeper-container{position:relative;display:block}.peeper-container>.form-control{padding-right:2.5rem}.peeper-toggle{position:absolute;top:0;right:0;height:100%;display:flex;align-items:center;padding:0 .75rem;background:none;border:0;cursor:pointer;color:var(--ista-text-muted)}.peeper-toggle:hover{color:var(--ista-text)}@media(max-width:575.98px){.settings-theme-group{display:flex;flex-direction:column;width:100%}.settings-theme-group>.btn{border-radius:.25rem!important;margin:0 0 .5rem!important}.settings-theme-group>.btn:last-child{margin-bottom:0!important}.floatDiv1{width:100%;min-width:0;float:none}.floatDiv2{width:100%;max-width:450px;min-width:0;float:none}.floatDiv2>select{max-width:100%}.floatDiv50{width:100%;min-width:0;float:none}.floatDiv50+.floatDiv50{margin-top:var(--ista-card-gap)}.topbar{height:auto;min-height:4.375rem}.topbar h1.h4{font-size:1rem;margin-bottom:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}.istaSwitch{display:flex;align-items:center;gap:.5rem;margin-bottom:0}.istaSwitch .form-check-input{flex:0 0 auto;margin:0}.istaSwitch .form-check-label{margin:0;cursor:pointer}.dashExplain{max-width:330px;margin:0 auto;text-align:center;text-wrap:balance;font-size:.8125rem;line-height:1.35;color:var(--ista-text-muted, #64748b)}.dashExplain i{margin-right:.25rem}a:focus-visible,button:focus-visible,[role=button]:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,[tabindex]:focus-visible,.btn:focus-visible,.nav-link:focus-visible,.form-control:focus-visible,.form-check-input:focus-visible,.dropdown-item:focus-visible,.theme-option:focus-visible,.page-link:focus-visible{outline:3px solid var(--ista-focus-ring);outline-offset:2px;box-shadow:0 0 0 2px var(--ista-focus-ring-halo);border-radius:2px}.btn:focus:not(:focus-visible),.form-control:focus:not(:focus-visible){outline:0}select:focus,select:focus-visible,select.form-control:focus,select.form-control:focus-visible,select.form-select:focus,select.form-select:focus-visible{outline:3px solid var(--ista-dropdown-focus-ring);outline-offset:-3px;box-shadow:none}html:not([data-theme=dark]) select:not(.backGreen):not(.backBlue):not(.backGray):focus,html:not([data-theme=dark]) select:not(.backGreen):not(.backBlue):not(.backGray):focus-visible{box-shadow:inset 0 0 0 4px var(--ista-dropdown-focus-edge)}html[data-contrast=on] select:focus,html[data-contrast=on] select:focus-visible{outline-offset:-3px!important}html[data-contrast=on] .backGreen,html[data-contrast=on] .backBlue{background-color:#000!important;color:#fff!important}html[data-contrast=on] .backGreen{border:2px solid #ffffff!important}html[data-contrast=on] .backBlue{border:2px solid #ffee32!important}html[data-contrast=on] .tableHeaderGreen,html[data-contrast=on] .tableHeaderBlue{background-color:#000!important;color:#fff!important}html[data-contrast=on] .tableHeaderGreen{border-top:2px solid #ffffff!important;border-bottom:2px solid #ffffff!important}html[data-contrast=on] .tableHeaderBlue{border-top:2px solid #ffee32!important;border-bottom:2px solid #ffee32!important}.skip-link{position:absolute;left:-9999px;top:0;width:1px;height:1px;overflow:hidden;z-index:2000}.skip-link:focus,.skip-link:focus-visible{left:.5rem;top:.5rem;width:auto;height:auto;padding:.6rem 1rem;background-color:var(--ista-surface, #ffffff);color:var(--ista-text, #3a3b45);border:2px solid var(--ista-focus-ring, #00003C);border-radius:4px;font-weight:600;text-decoration:none;outline:3px solid var(--ista-focus-ring, #00003C);outline-offset:2px}.ista-card{padding:var(--ista-card-pad)!important}.ista-card-roomy{--ista-card-pad: 2rem}.ista-card-compact{--ista-card-pad: var(--ista-card-gap-tight)}.ista-stack>*{margin-top:0!important;margin-bottom:0!important}.ista-stack>*+*{margin-top:var(--ista-card-gap)!important}.ista-stack>:empty:not(hr):not(img):not(canvas):not(input):not(svg),.ista-stack>:empty:not(hr):not(img):not(canvas):not(input):not(svg)+*{margin-top:0!important}.ista-stack-tight{--ista-card-gap: var(--ista-card-gap-tight)}.ista-stack>.ista-tight{margin-top:var(--ista-card-gap-tight)!important}.ista-rows tr+tr>td,.ista-rows tr+tr>th{padding-top:var(--ista-card-gap-tight)}.ista-loader-card{display:flex;align-items:center;justify-content:center;min-height:var(--ista-loader-min)}#graphcardbody>#selectors,#datacardbody>#selectors{margin-bottom:2rem!important}.ista-stack-page{padding-block:var(--ista-card-gap) calc(var(--ista-card-gap) * 3);padding-inline:0}html[data-contrast=on] .ista-card{padding:calc(var(--ista-card-pad) - 1px)!important}html[data-contrast=on] .figureMaster{padding-block:calc(var(--ista-card-gap) - 1px)}.mr-*,.pl-*/ .pr-*,.no-gutters). De views zijn daar in dezelfde ronde op omgezet,dus die klassen zijn nu overal dood - OP EEN NA. Wat hier staat is dat ene geval,en het staat hier en niet in vendor-sb-admin-2.css omdat het GEEN vendorcode is: het is een bewuste eigen regel. .form-group - GEEN mb-3,en dat is met opzet. De omzettingsregel voor Bootstrap 5 zegt: .form-group vervangen door mb-3 (1rem). Dat mag hier NIET,want vendor-sb-admin-2.css had op .form-group een ista-aanpassing staan met de marker "was 1": margin-bottom .25rem in plaats van Bootstraps 1rem. Blind omzetten naar mb-3 zou de onderruimte van ELK formulierveld in de portal met een factor vier vergroten (Registratie stap 1 t/m 3,Profiel,e-mail/telefoon/naam/wachtwoord wijzigen,Instellingen) en die formulieren een halve pagina langer maken. De klasse staat dus nog in de markup (14 plekken in Areas/Registration en Pages) en de maat staat hier. Verwijder deze regel alleen samen met een markup-ronde die de klasse ook uit de views haalt,en dan met een voor/na-beeld van die formulieren. ===================================================================== */ .form-group{margin-bottom:.25rem}@media print{:root{--ista-card-gap: .75rem}.ista-chart-box{height:400px}}