/* ==========================================
   HISTORY SECTION
========================================== */

.history{

    margin-bottom:50px;

}

.history-wrapper{

    padding:32px;

}

/* ==========================================
   TOP BAR
========================================== */

.history-top{

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:20px;

    margin-bottom:28px;

}

.history-header{

    display:flex;

    align-items:center;

    gap:16px;

}

.history-icon{

    width:48px;

    height:48px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    color:#ffffff;

    font-size:1.25rem;

    background:rgba(0,140,255,.12);

    border:2px solid rgba(0,140,255,.25);

}

.history-header h2{

    margin:0;

    color:#ffffff;

    font-size:1.8rem;

    font-weight:800;

    letter-spacing:.5px;

}

/* ==========================================
   SEARCH
========================================== */

.history-search{

    width:320px;

    position:relative;

}

.history-search i{

    position:absolute;

    top:50%;

    left:16px;

    transform:translateY(-50%);

    color:#AFC4F3;

    font-size:1rem;

}

.history-search input{

    width:100%;

    height:48px;

    padding:0 18px 0 46px;

    border-radius:12px;

    border:1px solid rgba(44,125,255,.35);

    background:rgba(255,255,255,.03);

    color:#ffffff;

    font-size:.95rem;

    outline:none;

    transition:.25s;

}

.history-search input::placeholder{

    color:#8FA8D9;

}

.history-search input:focus{

    border-color:#4CA8FF;

}
/* ==========================================
   TABLE
========================================== */

.history-table{

    overflow:hidden;

    border-radius:14px;

    border:1px solid rgba(44,125,255,.30);

    background:rgba(255,255,255,.02);

}

.history-table table{

    width:100%;

    border-collapse:collapse;

}

.history-table thead{

    background:rgba(35,78,150,.55);

}

.history-table th{

    padding:18px;

    text-align:center;

    color:#ffffff;

    font-size:.95rem;

    font-weight:700;

    letter-spacing:.5px;

    text-transform:uppercase;

}

.history-table td{

    padding:18px;

    text-align:center;

    color:#E5EEFF;

    font-size:1rem;

    border-top:1px solid rgba(255,255,255,.05);

}

.history-table tbody tr{

    transition:.25s;

}

.history-table tbody tr:hover{

    background:rgba(255,255,255,.04);

}

.result-number{

    color:#FFD84A;

    font-weight:800;

}

/* ==========================================
   PAGINATION
========================================== */

.history-pagination{

    display:flex;

    justify-content:center;

    align-items:center;

    gap:10px;

    margin-top:28px;

    flex-wrap:wrap;

}

.page-btn{

    min-width:46px;

    height:42px;

    padding:0 16px;

    border:none;

    border-radius:10px;

    background:rgba(255,255,255,.04);

    color:#ffffff;

    cursor:pointer;

    transition:.25s;

    border:1px solid rgba(44,125,255,.25);

}

.page-btn:hover{

    background:#1E63FF;

}

.page-btn.active{

    background:#2F7CFF;

    border-color:#2F7CFF;

}

.page-btn.prev,
.page-btn.next{

    display:flex;

    align-items:center;

    gap:8px;

}