/* ===== BuurtKids UI Layout Engine ===== */

/* Container reset */
.bk-payment-container{
width:100%;
max-width:100%;
margin:30px auto;
padding:24px;
border-radius:18px;
background:#fafafa;
border:1px solid #e5e5e5;
box-sizing:border-box;
}

/* Title */
.bk-payment-title{
font-size:22px;
font-weight:600;
margin-bottom:18px;
}

/* Layout */
.bk-payment-options{
display:flex;
gap:20px;
width:100%;
justify-content:center;
align-items:stretch;
flex-wrap:wrap;
}

/* Option wrapper */
.bk-option{
flex:1 1 48%;
max-width:48%;
}

/* Card UI */
.bk-card{
width:100%;
padding:28px;
border-radius:18px;
border:2px solid #ddd;
background:#fff;
box-sizing:border-box;
transition:all .25s ease;
text-align:left;
}

.bk-card:hover{
transform:translateY(-2px);
}

/* Selected state */
.bk-option input:checked + .bk-card{
border-color:#f26c21;
box-shadow:0 0 0 3px rgba(242,108,33,0.25);
}

/* Titles */
.bk-card-title{
font-weight:600;
font-size:18px;
margin-bottom:6px;
}

.bk-card-desc{
font-size:14px;
color:#666;
}

/* Mobile Engine */
@media (max-width:768px){

.bk-payment-options{
flex-direction:column;
}

.bk-option{
flex:1 1 100%;
max-width:100%;
}

.bk-card{
width:100%;
}

}

/* CSS Conflict Shield */
.bk-payment-container *{
box-sizing:border-box;
}