.result-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
}
.result-grid > div{
    border:1px solid #eee;
    border-radius:10px;
    padding:12px;
    background:#fafafa;
}
.result-grid span{display:block;color:#555;font-weight:700;margin-bottom:6px}
.result-grid b{font-size:18px}
.result-grid .highlight{
    grid-column:1 / -1;
    background:#f2fff3;
    border-color:#009368;
}
.hidden{display:none !important;}

[type=button], [type=submit], button {
    color:#009368 !important;
    border: 1px solid #009368 !important;
}

[type=button]:focus,[type=button]:hover,[type=submit]:focus,[type=submit]:hover,button:focus,button:hover {
    background:#009368 !important;
    color:#fff !important;
    text-decoration: none
}

.zakat-tab.active{
    background:#009368 !important;
    color:#fff !important;
}

.zakat-card{
    padding-top:25px;
}

.zakat-desc{
    margin: 0 0 18px;
    line-height: 1.7;
    color: #333;
    text-align:justify;
}

.prefix{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding: 0 10px;
    height: 40px;
    border-right: 1px solid #eee;
    margin-right: 10px;
  
    font-weight: 500;
    font-size: 14px;
    color: #009368;
    background: #f7fff7;
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
  
    flex: 0 0 auto;            /* jangan ikut mengecil */
    line-height: 1;
}

.zakat-input{
    display:flex;
    align-items:center;
    border:1px solid #009368;
    border-radius:8px;
    background:#fff;
    padding:0;                 /* biar prefix rata */
    overflow:hidden;           /* biar radius rapi */
}

.zakat-input input{
    border:0 !important;
    outline:none;
    width:100%;
    padding:10px 5px !important;
    font-size:16px;
}

.zakat-label {
    margin-top:15px;
}

.zakat-input {
    margin-top:10px;
}

.zakat-ref {
    margin-top:15px;
    margin-bottom: 15px;
}