.points-card{
    border:1px solid #b3b0b0;
    border-radius:10px;
    padding:30px;
    color:#fff;

    min-height:300px;
    
    /* Center content vertically */
    display:flex;
    align-items:center;
}

.points-title{
    font-size:18px;
    font-weight:500;
    margin-bottom:10px;
}

.points-error{
    width: 100%;
    padding: 10px;
    text-align: center;
    background: #f38b8b;
    color: #6e0909;
    border-radius: 4px;
}

.points-value{
    font-size:58px;
    font-weight:700;
    line-height:1;
    margin-bottom:12px;
}

.points-desc{
    font-size:16px;
    margin-bottom:0;
}

/* Tablet */
@media (max-width:768px){
    .points-value{
        font-size:42px;
    }
}

/* Mobile */
@media (max-width:576px){
    .points-card{
        padding:20px 15px;
        text-align:center;
        min-height:250px;
    }

    .points-value{
        font-size:36px;
    }

    .points-desc{
        font-size:14px;
    }
}

/* point history*/

.points-history-wrap{
    border:1px solid #b3b0b0;
    border-radius:8px;
    overflow:hidden;
    background:#fff;
    margin-top:20px;
}

/* Row */
.points-history-row{
    display:flex;
    align-items:center;
    padding:14px 18px;
    border-bottom:1px solid #bdbdbd;
    font-size:14px;
}

.points-history-row:last-child{
    border-bottom:none;
}

/* Columns */
.history-title{
    flex:1.6;
    display:flex;
    align-items:center;
    gap:8px;
    font-weight:500;
}

.history-date{
    flex:1;
    text-align:center;
    color:#222;
}

.history-points{
    flex:0.5;
    text-align:right;
    font-weight:700;
    font-size:24px;
}

/* Colors */
.plus{
    color:#0a9800;
}

.minus{
    color:#d40000;
}

/* Pagination */
.points-pagination{
    display:flex;
    justify-content:flex-end;
    gap:8px;
    margin-top:14px;
    flex-wrap:wrap;
}

.points-pagination a,
.points-pagination span{
    min-width:34px;
    height:34px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:6px;
    border:1px solid #d8d8d8;
    background:#fff;
    text-decoration:none;
    color:#0f1849;
    font-weight:600;
    padding:0 10px;
}

.points-pagination .active{
    background:#0f1849;
    color:#fff;
    border-color:#0f1849;
}

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

    .points-history-row{
        flex-direction:column;
        align-items:flex-start;
        gap:8px;
    }

    .history-title,
    .history-date,
    .history-points{
        width:100%;
        text-align:left;
    }

    .history-points{
        font-size:20px;
    }

    .points-pagination{
        justify-content:center;
    }
}

.icon-wrapper span {
    font-size: 60px;
}

.error-icon{
     color: #dc3545;
}

.success-icon{
     color: #3c7906;
}

.default-icon{
     color: #818b77;
}

.error-card{
    min-height: 10px;
    justify-content: center;
    text-align: center;
    border: none;
    background: #f8f8f8;
}

.auto-width{
    width: auto !important;
}


.page-btn.disabled{
      background-color: #dcdcdc !important;
    color: #b9b6b6;
}

.spinner {
    display: flex;
    gap: 6px;
    justify-content: center;
   margin-top: 10px;
    margin-bottom: 10px;
    width: 100%;
}

.spinner div {
    width: 8px;
    height: 8px;
    background: #04205c;
    border-radius: 50%;
    animation: bounce 1.2s infinite ease-in-out;
}

.spinner div:nth-child(2) {
    animation-delay: 0.2s;
}

.spinner div:nth-child(3) {
    animation-delay: 0.4s;
}

@keyframes bounce {
    0%, 40%, 60% { transform: scale(0); }
    30% { transform: scale(1); }
}

.bkt-none{
    display: none;
}

.bkt-block{
    display: block !important;
}

.text-black{
    color:#3b3a3a
}