/*==================================================
 DARK SYSTEM ROHAN
 Global Theme
==================================================*/

:root{

    --bg:#0f172a;

    --surface:#1e293b;

    --surface-hover:#273549;

    --border:#334155;

    --primary:#7c3aed;

    --primary-hover:#6d28d9;

    --success:#22c55e;

    --warning:#facc15;

    --danger:#ef4444;

    --text:#f8fafc;

    --muted:#94a3b8;

    --radius:14px;

    --transition:.25s ease;

}

/*==================================================
BODY
==================================================*/

html,
body{

    background:var(--bg);

    color:var(--text);

    font-family:"Poppins",sans-serif;

    min-height:100%;

    margin:0;

    padding:0;

}

/*==================================================
LINKS
==================================================*/

a{

    color:var(--text);

    text-decoration:none;

    transition:var(--transition);

}

a:hover{

    color:var(--warning);

}

/*==================================================
TYPOGRAPHY
==================================================*/

h1,
h2,
h3,
h4,
h5,
h6{

    font-weight:700;

}

p{

    line-height:1.6;

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

.card{

    background:var(--surface);

    border:1px solid var(--border);

    border-radius:var(--radius);

    overflow:hidden;

    transition:var(--transition);

}

.card:hover{

    transform:translateY(-5px);

    border-color:var(--primary);

    box-shadow:

        0 10px 25px rgba(124,58,237,.25);

}

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

.card-header{

    background:#162032;

    border-bottom:1px solid var(--border);

 color:inherit;

    font-weight:600;

}

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

.card-body{

 color:inherit;

}

/*==================================================
BUTTONS
==================================================*/

.btn{

    border-radius:10px;

    transition:var(--transition);

}

.btn-primary{

    background:var(--primary);

    border:none;

}

.btn-primary:hover{

    background:var(--primary-hover);

}

.btn-success{

    background:var(--success);

    border:none;

}

.btn-warning{

    color:#111;

    font-weight:600;

}
.form-control,
.form-select{

    background:#ffffff;

    border:1px solid #ced4da;

    color:#000000;

}

/*==================================================
FORM INPUTS
==================================================*/
.form-control,
.form-control:not(:focus),
.form-control:focus,
.form-control:active,
.form-select,
.form-select:not(:focus),
.form-select:focus,
input,
input:not(:focus),
input:focus,
textarea,
select{

    background:#ffffff !important;
    color:#000000 !important;
    -webkit-text-fill-color:#000000 !important;
    caret-color:#000000 !important;

}

.form-control::placeholder,
input::placeholder,
textarea::placeholder{

    color:#6c757d !important;

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

.dataTables_filter input{

    background:#ffffff !important;

    color:#000000 !important;

    border:1px solid #ced4da !important;

}

.dataTables_filter input::placeholder{

    color:#6c757d !important;

}

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

input[type="search"]{

    background:#ffffff !important;

    color:#000000 !important;

}

input[type="search"]::placeholder{

    color:#6c757d !important;

}
/*==================================================
TOPUP PACKAGE
==================================================*/

.package-card{

    cursor:pointer;

    border:2px solid #334155;

    transition:.25s;

}

.package-card:hover{

    border-color:#7c3aed;

    transform:translateY(-5px);

    box-shadow:0 10px 20px rgba(124,58,237,.25);

}

.package-card input:checked + div{

    color:#facc15;

}
/*==================================================
PACKAGE CARD
==================================================*/

.package-card{

    cursor:pointer;

    transition:.25s;

    border:2px solid transparent;

}

.package-card:hover{

    transform:translateY(-5px);

    border-color:#7c3aed;

}

.package-card.active{

    border:2px solid #facc15;

    box-shadow:0 0 18px rgba(250,204,21,.35);

}
/*==================================================
TOPUP REMINDER (DARK)
==================================================*/

.alert-warning{

    background:#111112;

    border:1px solid #facc15;

    color:#000;

    border-radius:12px;

}

.alert-warning h6{

 

    font-weight:700;

}

.alert-warning ul{

    margin:0;

    padding-left:20px;

}

.alert-warning ul li{

    color:#e5e7eb;

    font-size:14px;

    line-height:1.8;

}

.alert-warning i{

 

}

.package-radio{
    display:none;
}

.package-content{
    border:2px solid transparent;
    border-radius:12px;
    padding:15px;
    transition:.3s;
}

.package-radio:checked + .package-content{
    border-color:#ffc107;
    background:#202938;
}

.package-card{
    cursor:pointer;
} 
/*==================================================
TOPUP HISTORY TABLE
==================================================*/

.table.table-hover,
.table.table-hover th,
.table.table-hover td{

    color:#212529 !important;

}

.table.table-hover thead th{

    color:#000 !important;

    font-weight:700;

}

.table.table-hover tbody td{

    color:#000 !important;

}
 

}
/*==================================================
TOPUP TABLE FIX
==================================================*/

.view-topup-card table{

    background:#ffffff !important;

}

.view-topup-card table th,
.view-topup-card table td{

    background:#ffffff !important;

    color:#000000 !important;

    border-color:#dee2e6 !important;

}

.view-topup-card .table>:not(caption)>*>*{

    background:#ffffff !important;

    color:#000000 !important;

}

.view-topup-card .table-hover tbody tr:hover td{

    background:#f8f9fa !important;

    color:#000000 !important;

}
/*==================================================
TOPUP HISTORY TABLE
==================================================*/

.topup-history-table{

    background:#ffffff !important;

}

.topup-history-table th,
.topup-history-table td{

    background:#ffffff !important;

    color:#000000 !important;

    border-color:#dee2e6 !important;

}

.topup-history-table > :not(caption) > * > *{

    background:#ffffff !important;

    color:#000000 !important;

}

.topup-history-table tbody tr:hover td{

    background:#f8f9fa !important;

    color:#000000 !important;

}
/*=========================================
TOPUP HISTORY
=========================================*/

#topupTable{

    background:#fff;

}

#topupTable thead th{

    background:#212529 !important;

    color:#fff !important;

    text-align:center;

    vertical-align:middle;

}

#topupTable tbody td{

    background:#fff;

    color:#000 !important;

    vertical-align:middle;

}

#topupTable tbody tr:hover td{

    background:#f8f9fa !important;

}

#topupTable img{

    border-radius:10px;

}

.card-header h3{

    font-weight:700;

}

.card{

    border-radius:15px;

}

.card-footer{

    background:#fff;

}
/* Topup History Table */
#topupTable td,
#topupTable th{
    color:#000 !important;
}

#topupTable td strong{
    color:#000 !important;
}

#topupTable td span{
    color:inherit;
}

#topupTable tbody td{
    background:#fff !important;
}