
/* GATOS Khan Bank History UI — FORCE V2
   New filename is intentional to bypass browser/CDN cache. */

#walletModal .modal-dialog,
#walletModal .modal-dialog.faucet-demo-modal,
#walletModal .modal-dialog.modal-dialog-centered {
    width: 980px !important;
    max-width: calc(100vw - 30px) !important;
    min-width: 0 !important;
    margin: 24px auto !important;
}

#walletModal .modal-content {
    width: 100% !important;
    max-width: none !important;
    min-height: 570px !important;
    overflow: hidden !important;
    border: 1px solid rgba(113, 86, 255, .42) !important;
    border-radius: 18px !important;
    background:
        radial-gradient(circle at 100% 0%, rgba(111, 82, 255, .14), transparent 35%),
        linear-gradient(180deg, #1d2941 0%, #172238 100%) !important;
    box-shadow: 0 32px 90px rgba(0, 0, 0, .62) !important;
}

#walletModal .faucet-container,
#walletModal .deposit-modal-component,
#walletModal .deposit-section,
#walletModal .tab {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

#walletModal .deposit-modal-component {
    padding: 0 30px 28px !important;
}

#walletModal .deposit-modal-component .tabs {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    width: auto !important;
    max-width: none !important;
    margin: 58px -30px 24px !important;
    padding: 10px 28px !important;
    overflow-x: auto !important;
    background: rgba(10, 17, 32, .48) !important;
    border-top: 1px solid rgba(255, 255, 255, .04) !important;
    border-bottom: 1px solid rgba(255, 255, 255, .07) !important;
}

#walletModal .deposit-modal-component .btn-tab {
    flex: 1 0 135px !important;
    min-width: 135px !important;
    height: 44px !important;
    padding: 0 18px !important;
    border: 0 !important;
    border-radius: 10px !important;
    background: transparent !important;
    color: #8995ad !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 44px !important;
    text-align: center !important;
    white-space: nowrap !important;
}

#walletModal .deposit-modal-component .btn-tab.isActive {
    background: linear-gradient(135deg, #6258f5, #8b5cf6) !important;
    color: #fff !important;
    box-shadow: 0 10px 24px rgba(98, 88, 245, .30) !important;
}

.khan-history-section {
    width: 100% !important;
    min-height: 410px !important;
    padding: 0 !important;
}

.khan-history-toolbar {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 18px !important;
    width: 100% !important;
    margin: 0 0 18px !important;
}

.khan-history-title-group {
    display: grid !important;
    gap: 5px !important;
    min-width: 0 !important;
}

.khan-history-title-group strong {
    display: block !important;
    margin: 0 !important;
    color: #fff !important;
    font-size: 20px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    letter-spacing: .01em !important;
}

.khan-history-title-group span {
    display: block !important;
    margin: 0 !important;
    color: #8793ad !important;
    font-size: 12px !important;
    line-height: 1.4 !important;
}

.khan-history-refresh {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 42px !important;
    width: 42px !important;
    height: 42px !important;
    padding: 0 !important;
    border: 1px solid rgba(255, 255, 255, .09) !important;
    border-radius: 11px !important;
    background: rgba(255, 255, 255, .06) !important;
    color: #e5e9f4 !important;
    font-size: 20px !important;
    line-height: 1 !important;
}

.khan-history-table-wrap {
    display: block;
    width: 100% !important;
    max-width: none !important;
    overflow-x: auto !important;
    border: 1px solid rgba(255, 255, 255, .07) !important;
    border-radius: 14px !important;
    background: rgba(7, 13, 27, .36) !important;
}

.khan-history-table {
    width: 100% !important;
    min-width: 850px !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    table-layout: fixed !important;
    color: #edf1fa !important;
    font-size: 13px !important;
}

.khan-history-table thead,
.khan-history-table tbody,
.khan-history-table tr {
    width: 100% !important;
}

.khan-history-table th {
    padding: 14px 15px !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, .07) !important;
    background: rgba(255, 255, 255, .035) !important;
    color: #919db5 !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: .05em !important;
    line-height: 1.2 !important;
    text-align: left !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
}

.khan-history-table td {
    padding: 15px !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, .045) !important;
    background: transparent !important;
    color: #e9edf7 !important;
    font-size: 13px !important;
    line-height: 1.35 !important;
    vertical-align: middle !important;
    word-break: normal !important;
    white-space: normal !important;
}

.khan-history-table tbody tr:hover td {
    background: rgba(255, 255, 255, .025) !important;
}

.khan-history-table th:nth-child(1),
.khan-history-table td:nth-child(1) { width: 9% !important; }

.khan-history-table th:nth-child(2),
.khan-history-table td:nth-child(2) { width: 18% !important; }

.khan-history-table th:nth-child(3),
.khan-history-table td:nth-child(3) { width: 12% !important; }

.khan-history-table th:nth-child(4),
.khan-history-table td:nth-child(4) { width: 15% !important; }

.khan-history-table th:nth-child(5),
.khan-history-table td:nth-child(5) { width: 15% !important; }

.khan-history-table th:nth-child(6),
.khan-history-table td:nth-child(6) { width: 31% !important; }

.khan-history-table td:first-child strong {
    color: #a89cff !important;
    font-size: 14px !important;
}

.khan-history-amount {
    color: #fff !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
}

.khan-status {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 86px !important;
    min-height: 28px !important;
    padding: 5px 10px !important;
    border-radius: 999px !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
}

.khan-status.pending {
    border: 1px solid rgba(255, 194, 72, .22) !important;
    background: rgba(255, 194, 72, .11) !important;
    color: #ffc85c !important;
}

.khan-status.approved {
    border: 1px solid rgba(67, 214, 164, .22) !important;
    background: rgba(67, 214, 164, .11) !important;
    color: #58ddb0 !important;
}

.khan-status.declined {
    border: 1px solid rgba(255, 113, 125, .22) !important;
    background: rgba(255, 113, 125, .11) !important;
    color: #ff8790 !important;
}

.khan-history-info {
    display: grid !important;
    gap: 3px !important;
    min-width: 0 !important;
}

.khan-history-info strong {
    overflow: hidden !important;
    color: #f4f6fb !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.khan-history-info span {
    overflow: hidden !important;
    color: #7f8aa3 !important;
    font-size: 11px !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.khan-history-pages {
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    margin-top: 18px !important;
}

.khan-history-pages button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 34px !important;
    height: 34px !important;
    padding: 0 !important;
    border: 1px solid rgba(255, 255, 255, .08) !important;
    border-radius: 9px !important;
    background: rgba(255, 255, 255, .05) !important;
    color: #dfe4f0 !important;
    font-size: 15px !important;
}

.khan-history-pages span {
    min-width: 72px !important;
    color: #aeb7ca !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    text-align: center !important;
}

@media (max-width: 760px) {
    #walletModal .modal-dialog,
    #walletModal .modal-dialog.faucet-demo-modal,
    #walletModal .modal-dialog.modal-dialog-centered {
        width: calc(100vw - 12px) !important;
        max-width: none !important;
        margin: 6px auto !important;
    }

    #walletModal .modal-content {
        min-height: calc(100vh - 12px) !important;
        border-radius: 14px !important;
    }

    #walletModal .deposit-modal-component {
        padding: 0 14px 18px !important;
    }

    #walletModal .deposit-modal-component .tabs {
        margin: 54px -14px 18px !important;
        padding: 8px 12px !important;
    }

    #walletModal .deposit-modal-component .btn-tab {
        flex: 0 0 108px !important;
        min-width: 108px !important;
        height: 40px !important;
        line-height: 40px !important;
    }

    .khan-history-table {
        min-width: 760px !important;
    }
}

/* Refill bank account + combined deposit/withdraw history */
.bank-refill-panel { width:100%; box-sizing:border-box; }
.bank-refill-heading { display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-bottom:14px; }
.bank-refill-heading strong { color:#fff; font-size:23px; font-weight:900; }
.bank-refill-heading span { padding:7px 12px; border-radius:8px; background:#342800; color:#ffd12f; font-size:13px; font-weight:800; }
.bank-refill-card { overflow:hidden; border:1px solid rgba(255,255,255,.85); border-radius:10px; background:linear-gradient(180deg,#031710,#02120d); }
.bank-refill-card > * { padding-left:16px; padding-right:16px; }
.bank-refill-bank { display:flex; align-items:center; gap:10px; padding-top:13px; color:#08d39a; }
.bank-refill-logo { display:inline-flex; align-items:center; justify-content:center; width:28px; height:28px; border-radius:8px; background:#0e3d55; }
.bank-refill-owner { padding-top:8px; color:#aeb7c9; font-size:16px; }
.bank-refill-owner strong { color:#ffd51f; }
.bank-refill-value-row { display:flex; align-items:center; gap:14px; padding-top:8px; padding-bottom:14px; flex-wrap:wrap; }
.bank-refill-value { color:#00d69b; font-size:42px; line-height:1.08; font-weight:900; letter-spacing:1px; word-break:break-all; }
.bank-refill-iban { font-size:34px; }
.bank-copy-btn { flex:0 0 auto; border:0; border-radius:8px; padding:11px 13px; background:#ffd424; color:#0b0b0b; font-weight:900; cursor:pointer; }
.bank-refill-divider { height:1px; padding:0 !important; background:rgba(255,255,255,.8); }
.bank-refill-warning { display:flex; gap:9px; align-items:flex-start; margin-top:13px; color:#fff; font-size:15px; line-height:1.45; }
.bank-refill-warning strong { color:#ffd424; }
.bank-refill-dot { flex:0 0 12px; width:12px; height:12px; margin-top:5px; border-radius:50%; background:#ff4c57; }
.bank-refill-help { margin-top:10px; border:0; border-radius:7px; padding:10px 14px; background:#3888ff; color:#fff; font-weight:800; cursor:pointer; }
.khan-history-type { display:inline-flex; padding:5px 9px; border-radius:999px; font-size:11px; font-weight:800; white-space:nowrap; }
.khan-history-type.deposit { background:rgba(0,214,155,.12); color:#38e2b4; }
.khan-history-type.withdraw { background:rgba(255,115,125,.12); color:#ff939b; }
.khan-history-amount.deposit { color:#35dfad !important; }
.khan-history-amount.withdraw { color:#ff8e97 !important; }
@media (max-width:760px) {
  .bank-refill-heading strong { font-size:20px; }
  .bank-refill-value { font-size:28px; }
  .bank-refill-iban { font-size:22px; }
  .bank-copy-btn { padding:9px 11px; }
}

/* Refill IBAN + refined bank card */
.bank-refill-card{padding:16px!important;border-color:rgba(40,224,157,.42)!important;border-radius:14px!important;background:linear-gradient(145deg,#061711,#03100d)!important;box-shadow:0 14px 30px rgba(0,0,0,.18)}
.bank-refill-card>*{padding-left:0!important;padding-right:0!important}
.bank-refill-bank-head{display:flex;align-items:center;gap:13px;padding-bottom:14px!important;border-bottom:1px solid rgba(255,255,255,.09)}
.bank-refill-logo-image{display:block;width:46px!important;height:46px!important;padding:5px;object-fit:contain;border-radius:12px;background:#fff}
.bank-refill-bank-head>div{min-width:0}.bank-refill-bank-head strong{display:block;color:#20df9d;font-size:20px}.bank-refill-bank-head small{display:block;margin-top:4px;color:#aebdb8;font-size:14px}.bank-refill-bank-head small b{color:#fff}
.bank-refill-item{padding:14px 0!important;border-bottom:1px solid rgba(255,255,255,.08)}.bank-refill-label{margin-bottom:7px;color:#7f9d93;font-size:11px;font-weight:900;letter-spacing:.12em}.bank-refill-value-row{padding:0!important;flex-wrap:nowrap!important}.bank-refill-value{flex:1;min-width:0;font-size:clamp(25px,4vw,36px)!important;overflow-wrap:anywhere}.bank-refill-iban{font-size:clamp(20px,3.2vw,30px)!important}.bank-copy-btn{background:#09231b!important;color:#20df9d!important;border:1px solid rgba(32,223,157,.42)!important}.bank-copy-btn:hover{background:#20df9d!important;color:#03100d!important}.bank-refill-warning{align-items:center!important;justify-content:space-between!important;padding:12px 14px;border:1px dashed rgba(255,211,47,.55);border-radius:10px;background:rgba(255,211,47,.07)}.bank-refill-warning>div span{display:block;color:#aebdb8;font-size:11px;font-weight:900;letter-spacing:.09em}.bank-refill-warning>div strong{display:block;margin-top:3px;font-size:18px}.bank-refill-dot{display:none!important}
@media(max-width:575px){.bank-refill-card{padding:13px!important}.bank-refill-value-row{align-items:stretch!important;flex-direction:column!important}.bank-copy-btn{width:100%}.bank-refill-warning{align-items:stretch!important;flex-direction:column!important}}
