#isbu-popup-overlay{

position:fixed;

left:0;
top:0;

width:100%;
height:100%;

display:flex;

justify-content:center;
align-items:center;

background:rgba(0,0,0,.60);

backdrop-filter:blur(6px);

z-index:999999;

}

#isbu-popup{

width:920px;

max-width:92%;

background:#fff;

border-radius:20px;

padding:28px;

position:relative;

box-shadow:0 25px 70px rgba(0,0,0,.18);

animation:isbuPopup .25s ease;

}

@keyframes isbuPopup{

from{

opacity:0;

transform:translateY(20px) scale(.96);

}

to{

opacity:1;

transform:none;

}

}

.isbu-close{

position:absolute;

right:18px;

top:18px;

width:42px;

height:42px;

border-radius:50%;

background:#f3f3f3;

display:flex;

justify-content:center;

align-items:center;

cursor:pointer;

font-size:22px;

transition:.25s;

}

.isbu-close:hover{

background:#E53935;

color:#fff;

}


/* ========================================
   HEADER
======================================== */

.isbu-header{

text-align:center;

margin-bottom:28px;

}

.isbu-logo{

height:90px;

margin-bottom:12px;

}

.isbu-header h2{

font-size:30px;

font-weight:700;

margin-bottom:10px;

}

.isbu-header p{

font-size:16px;

color:#666;

line-height:1.6;

}


/* ========================================
   GRID
======================================== */

.isbu-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:18px;

}


/* ========================================
   CARD
======================================== */

.isbu-card{

background:#fff;

border:1px solid #ececec;

border-radius:16px;

overflow:hidden;

transition:.30s;

}

.isbu-card:hover{

transform:translateY(-8px);

box-shadow:0 15px 35px rgba(0,0,0,.10);

}


/* ========================================
   IMAGE
======================================== */

.isbu-card img{

width:100%;

aspect-ratio:16/9;

object-fit:contain;

background:#fff;

padding:8px;

display:block;

}


/* ========================================
   TITLE
======================================== */

.isbu-card h3{

font-size:22px;

text-align:center;

margin:18px 0 8px;

}


/* ========================================
   BUTTON
======================================== */

.isbu-card button{

width:calc(100% - 30px);

margin:0 15px 15px;

height:46px;

border:none;

border-radius:10px;

background:#67B52E;

color:#fff;

font-size:16px;

font-weight:600;

cursor:pointer;

transition:.25s;

}

.isbu-card button:hover{

background:#4B9620;

}


/* ========================================
   RESPONSIVE
======================================== */

@media(max-width:992px){

.isbu-grid{

grid-template-columns:repeat(2,1fr);

}

}


@media(max-width:640px){

#isbu-popup{

width:96%;

padding:22px;

max-height:90vh;

overflow:auto;

}

.isbu-grid{

grid-template-columns:1fr;

}

.isbu-logo{

height:70px;

}

.isbu-header h2{

font-size:24px;

}

}
/* Pastikan elemen popup selalu dapat menerima klik meskipun tema memakai layer lain. */
#isbu-popup-overlay{
    pointer-events:auto !important;
}
#isbu-popup{
    pointer-events:auto !important;
    isolation:isolate;
}
.isbu-card,
.isbu-card button,
.isbu-select-branch,
.isbu-close{
    pointer-events:auto !important;
}
.isbu-card button:disabled{
    opacity:.72;
    cursor:wait;
}
html.isbu-popup-open,
html.isbu-popup-open body{
    overflow:hidden;
}

/* v1.2.0: tombol berupa anchor agar tetap aktif tanpa JavaScript */
.isbu-card .isbu-select-branch{
    width:calc(100% - 30px);
    min-height:46px;
    margin:0 15px 15px;
    padding:10px 14px;
    border:0;
    border-radius:10px;
    background:#67B52E;
    color:#fff !important;
    font-size:16px;
    font-weight:600;
    line-height:26px;
    text-align:center;
    text-decoration:none !important;
    cursor:pointer;
    display:block !important;
    position:relative !important;
    z-index:20 !important;
    pointer-events:auto !important;
    touch-action:manipulation;
    transition:.25s;
}
.isbu-card .isbu-select-branch:hover,
.isbu-card .isbu-select-branch:focus{
    background:#4B9620;
    color:#fff !important;
    text-decoration:none !important;
}
.isbu-card .isbu-select-branch.isbu-loading{
    opacity:.72;
    pointer-events:none !important;
}
.isbu-close{
    border:0;
    padding:0;
    z-index:30;
}