/* ==============================
TG Affiliate Front UI
============================== */


.tgaw-page{

font-family:Inter,Arial,sans-serif;

}


.tgaw-page h1{

font-size:36px;

font-weight:800;

color:#06122d;

margin-bottom:35px;

}





/* Grid */

.tgaw-grid{

display:grid;

gap:25px;

margin-bottom:35px;

}


.tgaw-grid.four{

grid-template-columns:repeat(4,1fr);

}







/* Cards */

.tgaw-box{


background:#fff;

border-radius:22px;

padding:35px;

box-shadow:
0 15px 40px rgba(0,0,0,.08);

border-top:4px solid #eee;

transition:.3s;


}


.tgaw-box:hover{

transform:translateY(-5px);

}



.tgaw-box h2{

font-size:30px;

margin:15px 0 5px;

font-weight:800;

}



.tgaw-box p{

color:#7d879c;

font-size:16px;

}





/* Icon */

.tgaw-icon{

width:65px;

height:65px;

border-radius:50%;

display:flex;

align-items:center;

justify-content:center;

font-size:28px;

font-weight:bold;

margin-bottom:25px;

}







/* Colors */


.green{

border-color:#22c55e;

}


.green .tgaw-icon{

background:#d8ffe9;

color:#16a34a;

}


.green h2{

color:#22c55e;

}





.purple{

border-color:#7c3aed;

}


.purple .tgaw-icon{

background:#eee4ff;

color:#7c3aed;

}


.purple h2{

color:#7c3aed;

}






.blue{

border-color:#2563eb;

}


.blue .tgaw-icon{

background:#e0eaff;

color:#2563eb;

}



.blue h2{

color:#2563eb;

}






.orange{

border-color:#ff6534;

}


.orange .tgaw-icon{

background:#ffe7dc;

color:#ff6534;

}


.orange h2{

color:#ff6534;

}









/* Panel */

.tgaw-panel{

background:#fff;

padding:35px;

border-radius:25px;

margin-bottom:35px;

box-shadow:
0 15px 45px rgba(0,0,0,.07);

}








/* Referral Box */

.tgaw-ref-box{

display:flex;

gap:30px;

align-items:center;

}


.tgaw-ref-icon{

width:70px;

height:70px;

border-radius:50%;

background:#e8ecff;

display:flex;

align-items:center;

justify-content:center;

font-size:35px;

}



.tgaw-copy-row{

display:flex;

gap:20px;

}


.tgaw-copy-row input{

flex:1;

padding:18px;

border-radius:12px;

border:1px solid #ddd;

font-size:16px;

}



.tgaw-copy-row button,
.tgaw-btn{


background:linear-gradient(
135deg,#2563eb,#4f46e5
);

color:white;

border:none;

padding:15px 35px;

border-radius:14px;

font-weight:700;

cursor:pointer;

}








/* Table */


.tgaw-table{

width:100%;

border-collapse:collapse;

}


.tgaw-table th{

background:#f7f9ff;

padding:18px;

text-align:left;

}


.tgaw-table td{

padding:18px;

border-bottom:1px solid #eee;

}


.green-text{

color:#16a34a;

font-weight:700;

}







/* Alerts */


.tgaw-alert{

padding:15px;

border-radius:12px;

margin-bottom:20px;

}


.tgaw-alert.success{

background:#dcffe8;

color:#15803d;

}








/* Mobile */


@media(max-width:900px){


.tgaw-grid.four{

grid-template-columns:repeat(2,1fr);

}


}




@media(max-width:600px){


.tgaw-grid.four{

grid-template-columns:1fr;

}


.tgaw-ref-box{

display:block;

}


.tgaw-copy-row{

display:block;

}


.tgaw-copy-row button{

margin-top:15px;

width:100%;

}


}

/* Wallet */


.tgaw-wallet-banner{


background:linear-gradient(
135deg,
#2563eb,
#7c3aed
);


color:white;

border-radius:30px;

padding:45px;

display:flex;

justify-content:space-between;

align-items:center;

margin-bottom:35px;

box-shadow:0 15px 40px rgba(37,99,235,.3);

}



.tgaw-wallet-banner p{

font-size:18px;

opacity:.9;

}



.tgaw-wallet-banner h2{

font-size:55px;

margin:15px 0;

color:white;

}



.tgaw-wallet-banner a{

display:inline-block;

background:white;

color:#2563eb;

padding:13px 30px;

border-radius:50px;

text-decoration:none;

font-weight:700;

}




.wallet-icon{

font-size:70px;

}





.tgaw-grid.two{

grid-template-columns:repeat(2,1fr);

}





.tgaw-badge{

padding:8px 18px;

border-radius:50px;

font-size:13px;

font-weight:700;

}





.tgaw-badge.success{

background:#dcffe8;

color:#16a34a;

}





.tgaw-badge.danger{

background:#ffe1e1;

color:#dc2626;

}





@media(max-width:700px){


.tgaw-wallet-banner{

display:block;

text-align:center;

}


.tgaw-grid.two{

grid-template-columns:1fr;

}


}

/* Withdraw */


.tgaw-input{

width:100%;

padding:16px;

border-radius:14px;

border:1px solid #ddd;

margin:10px 0 25px;

font-size:15px;

}



.tgaw-panel label{

font-weight:700;

color:#333;

}





.tgaw-badge.warning{

background:#fff5d6;

color:#ca8a04;

}




.tgaw-badge.info{

background:#dbeafe;

color:#2563eb;

}




.tgaw-alert.error{

background:#ffe1e1;

color:#dc2626;

padding:15px;

border-radius:12px;

margin-bottom:20px;

}