/*
 * j4-bridge.css
 * Het ontwerp (template.css/bootstrap.css) is gebouwd op Bootstrap 3.3.7 en blijft dat.
 * Sinds Joomla 4 gebruikt de core-markup (artikelen, formulieren, meldingen, zoeken, ...)
 * Bootstrap 5-klassenamen. Dit bestand levert alleen de klassen die daar vaak voorkomen
 * en in Bootstrap 3 niet bestaan, zodat core-pagina's niet "kaal" ogen.
 * Wil je later volledig naar Bootstrap 5? Dan vervangt dit bestand + bootstrap.css.
 */

/* --- toegankelijkheid / zichtbaarheid --- */
.visually-hidden,
.visually-hidden-focusable:not(:focus):not(:focus-within){position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.d-none{display:none!important}.d-block{display:block!important}.d-inline{display:inline!important}
.d-inline-block{display:inline-block!important}.d-flex{display:flex!important}
@media (min-width:768px){.d-md-none{display:none!important}.d-md-block{display:block!important}.d-md-flex{display:flex!important}}

/* --- flex / uitlijning --- */
.flex-wrap{flex-wrap:wrap!important}.flex-column{flex-direction:column!important}
.justify-content-between{justify-content:space-between!important}.justify-content-end{justify-content:flex-end!important}
.align-items-center{align-items:center!important}
.gap-1{gap:.25rem!important}.gap-2{gap:.5rem!important}.gap-3{gap:1rem!important}
.float-start{float:left!important}.float-end{float:right!important}
.text-start{text-align:left!important}.text-end{text-align:right!important}.text-center{text-align:center!important}

/* --- marges (veelgebruikte subset) --- */
.m-0{margin:0!important}.mb-0{margin-bottom:0!important}.mt-0{margin-top:0!important}
.mb-1{margin-bottom:.25rem!important}.mb-2{margin-bottom:.5rem!important}.mb-3{margin-bottom:1rem!important}.mb-4{margin-bottom:1.5rem!important}
.mt-1{margin-top:.25rem!important}.mt-2{margin-top:.5rem!important}.mt-3{margin-top:1rem!important}.mt-4{margin-top:1.5rem!important}
.ms-1{margin-left:.25rem!important}.ms-2{margin-left:.5rem!important}.ms-auto{margin-left:auto!important}
.me-1{margin-right:.25rem!important}.me-2{margin-right:.5rem!important}.me-auto{margin-right:auto!important}
.p-0{padding:0!important}.p-2{padding:.5rem!important}.p-3{padding:1rem!important}

/* --- formulieren --- */
.form-select{display:block;width:100%;height:34px;padding:6px 12px;font-size:14px;line-height:1.42857143;color:#555;background:#fff;border:1px solid #ccc;border-radius:4px}
.form-label{display:inline-block;margin-bottom:5px;font-weight:700}
.form-check{display:block;min-height:1.5rem;padding-left:1.5em}
.form-check-input{float:left;margin-left:-1.5em}
.form-text{display:block;margin-top:5px;color:#737373}
.input-group{display:flex;width:100%}.input-group>.form-control{flex:1 1 auto}

/* --- knoppen --- */
.btn-secondary{color:#333;background-color:#fff;border-color:#ccc}
.btn-secondary:hover,.btn-secondary:focus{color:#333;background-color:#e6e6e6;border-color:#adadad}
.btn-outline-secondary{color:#333;background:transparent;border-color:#ccc}
.btn-close{box-sizing:content-box;width:1em;height:1em;padding:.25em;border:0;background:transparent;opacity:.5;cursor:pointer}
.btn-close:before{content:"\00d7";font-size:1.5em;line-height:.6}

/* --- kaarten, badges, lijsten --- */
.card{position:relative;display:flex;flex-direction:column;min-width:0;word-wrap:break-word;background:#fff;border:1px solid rgba(0,0,0,.125);border-radius:4px;margin-bottom:15px}
.card-header{padding:10px 15px;background:rgba(0,0,0,.03);border-bottom:1px solid rgba(0,0,0,.125)}
.card-body{flex:1 1 auto;padding:15px}
.card-footer{padding:10px 15px;background:rgba(0,0,0,.03);border-top:1px solid rgba(0,0,0,.125)}
.badge.bg-secondary,.badge.bg-info,.badge.bg-primary,.badge.bg-success,.badge.bg-warning,.badge.bg-danger{color:#fff}
.bg-secondary{background-color:#777!important}.bg-info{background-color:#5bc0de!important}.bg-primary{background-color:#337ab7!important}
.bg-success{background-color:#5cb85c!important}.bg-warning{background-color:#f0ad4e!important}.bg-danger{background-color:#d9534f!important}
.list-group-item{position:relative;display:block;padding:10px 15px;background:#fff;border:1px solid #ddd;margin-bottom:-1px}
.table-striped>tbody>tr:nth-of-type(odd){background-color:#f9f9f9}

/* --- paginering: BS5-markup (li.page-item > a.page-link) in BS3-stijl --- */
.pagination .page-item{display:inline}
.pagination .page-link{position:relative;float:left;padding:6px 12px;margin-left:-1px;line-height:1.42857143;text-decoration:none;color:#337ab7;background:#fff;border:1px solid #ddd}
.pagination .page-item.active .page-link{z-index:3;color:#fff;background:#337ab7;border-color:#337ab7;cursor:default}
.pagination .page-item.disabled .page-link{color:#777;cursor:not-allowed}

/* --- BS5-collapse (.show) naast BS3 (.in) --- */
.collapse.show{display:block}

/* --- Joomla-iconen: icon-*/fa-* komen uit de core 'fontawesome'-asset --- */
[class^="icon-"],[class*=" icon-"]{display:inline-block;font-style:normal}
