.ptt-leaderboard {

	margin:20px 0;
}
.ptt-activity-list{
	margin:0;
	padding:0;
	list-style:none;
}

.ptt-activity-item{
	padding:12px 15px;
	border-bottom:1px solid #eee;
}

.ptt-activity-content{
	display:flex;
	align-items:center;
	gap:10px;
}

.ptt-activity-points{
	font-weight:700;
	color:#28a745;
	min-width:60px;
}

.ptt-activity-text{
	flex:1;
}

.ptt-activity-date{
	margin-top:4px;
	font-size:12px;
	color:#777;
}
.ptt-leaderboard table {

	width:100%;
}

.ptt-feed-item{
	padding:12px;
	margin-bottom:10px;
	border-bottom:1px solid #ddd;
}

.ptt-notification-list{
	list-style:none;
	margin:0;
	padding:0;
}

.ptt-notification-item{
	padding:15px;
	border-bottom:1px solid #ddd;
}

.ptt-notification-item.unread{
	background:#f6faff;
}

.ptt-notification-item.read{
	opacity:.8;
}

.ptt-notification-bell{
	position:relative;
	display:inline-block;
	font-size:22px;
}

.ptt-bell-count{
	position:absolute;
	top:-8px;
	right:-10px;
	background:#d63638;
	color:#fff;
	border-radius:50%;
	min-width:18px;
	height:18px;
	line-height:18px;
	text-align:center;
	font-size:11px;
	padding:0 4px;
}

.ptt-toast{

	position:fixed;
	right:20px;
	top:20px;

	width:320px;

	padding:15px;

	background:#fff;

	border-left:4px solid #2271b1;

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

	opacity:0;

	transform:translateY(-20px);

	transition:.3s;

	z-index:99999;
}

.ptt-toast-show{

	opacity:1;

	transform:translateY(0);
}

.ptt-toast-title{

	font-weight:600;

	margin-bottom:5px;
}

.ptt-toast-message{

	font-size:13px;
}



.ptt-certificates-table th,
.ptt-certificates-table td{
	padding:12px;
	border:1px solid #ddd;
	text-align:left;
}

.ptt-certificates-table{
	margin-top:20px;
	background:#fff;
}

.ptt-certificates-header{
	margin-bottom:20px;
}

.ptt-no-certificates{
	padding:20px;
	background:#fff;
	border:1px solid #ddd;
}

.ptt-referral-summary{
	display:flex;
	gap:20px;
	margin-bottom:20px;
	flex-wrap:wrap;
}

.ptt-referral-card{
	background:#fff;
	border:1px solid #ddd;
	padding:20px;
	min-width:180px;
}

.ptt-referral-link-box{
	margin-bottom:25px;
}

.ptt-referrals-table{
	width:100%;
	border-collapse:collapse;
	background:#fff;
}

.ptt-referrals-table th,
.ptt-referrals-table td{
	border:1px solid #ddd;
	padding:12px;
	text-align:left;
}

.ptt-store-grid{
	display:grid;
	grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
	gap:20px;
	margin-top:20px;
}

.ptt-store-item{
	background:#fff;
	border:1px solid #ddd;
	padding:20px;
	border-radius:6px;
}

.ptt-store-balance{
	margin-top:10px;
	font-size:16px;
}

.ptt-store-meta{
	margin:15px 0;
}

.ptt-store-empty,
.ptt-store-success{
	padding:15px;
	border:1px solid #ddd;
	background:#fff;
	margin-top:15px;
}

.ptt-level-card{
	background:#fff;
	border:1px solid #ddd;
	padding:20px;
	border-radius:6px;
	margin-bottom:25px;
}

.ptt-level-progress-wrapper{
	margin-top:20px;
}

.ptt-level-progress-bar{
	width:100%;
	height:24px;
	background:#eee;
	border-radius:20px;
	overflow:hidden;
}

.ptt-level-progress-fill{
	height:24px;
	background:#2271b1;
}

.ptt-level-progress-text{
	margin-top:10px;
	font-weight:600;
}

.ptt-levels-table{
	width:100%;
	border-collapse:collapse;
	background:#fff;
}

.ptt-levels-table th,
.ptt-levels-table td{
	padding:12px;
	border:1px solid #ddd;
	text-align:left;
}

.ptt-levels-list{
	margin-top:25px;
}

.ptt-rank-card{
	background:#fff;
	border:1px solid #ddd;
	padding:20px;
	border-radius:6px;
	margin-bottom:25px;
}

.ptt-rank-table{
	width:100%;
	border-collapse:collapse;
	background:#fff;
}

.ptt-rank-table th,
.ptt-rank-table td{
	padding:12px;
	border:1px solid #ddd;
	text-align:left;
}

.ptt-leaderboard-section{
	margin-top:20px;
}







/* ==================================================
   Transactions Filter
================================================== */

.transactions-wrapper-filter{
	margin:20px 0;
}

.transactions-wrapper-filter .ptt-filters{
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	gap:15px;
	padding:20px;
	background:#fff;
	border:1px solid #e5e7eb;
	border-radius:12px;
	box-shadow:0 1px 3px rgba(0,0,0,.04);
}

/* ==================================================
   Select & Date Fields
================================================== */

.transactions-wrapper-filter .ptt-filters select,
.transactions-wrapper-filter .ptt-filters input[type="date"]{
	height:42px;
	min-width:180px;
	padding:0 14px;

	border:1px solid #dcdcde;
	border-radius:8px;

	background:#fff;
	color:#1d2327;

	font-size:14px;
	font-weight:500;

	outline:none;
	box-shadow:none;

	transition:all .2s ease;
}

.transactions-wrapper-filter .ptt-filters select:focus,
.transactions-wrapper-filter .ptt-filters input[type="date"]:focus{
	border-color:#2271b1;
	box-shadow:0 0 0 3px rgba(34,113,177,.12);
}

/* ==================================================
   Filter Button
================================================== */

.transactions-wrapper-filter .ptt-filters button{
	height:42px;
	padding:0 24px;

	border:none;
	border-radius:999px;

	background:#2271b1;
	color:#fff;

	font-size:14px;
	font-weight:600;

	cursor:pointer;

	transition:all .2s ease;
}

.transactions-wrapper-filter .ptt-filters button:hover{
	background:#135e96;
	transform:translateY(-1px);
}

.transactions-wrapper-filter .ptt-filters button:active{
	transform:translateY(0);
}


.transactions-wrapper-filter .ptt-filter-btn{
	height:42px;
	padding:0 24px;
	border:none;
	border-radius:999px;
	background:#2271b1;
	color:#fff;
	font-size:14px;
	font-weight:600;
	cursor:pointer;
	transition:.2s;
}

.transactions-wrapper-filter .ptt-filter-btn:hover{
	background:#135e96;
}

.transactions-wrapper-filter .ptt-reset-btn{
	display:inline-flex;
	align-items:center;
	justify-content:center;

	height:42px;
	padding:0 24px;

	border:1px solid #dcdcde;
	border-radius:999px;

	background:#fff;
	color:#50575e;

	text-decoration:none;
	font-size:14px;
	font-weight:600;

	transition:.2s;
}

.transactions-wrapper-filter .ptt-reset-btn:hover{
	background:#f6f7f7;
	color:#1d2327;
	border-color:#bfc3c8;
}

/* ==================================================
   Responsive
================================================== */

@media (max-width: 768px){

	.transactions-wrapper-filter .ptt-filters{
		flex-direction:column;
		align-items:stretch;
	}

	.transactions-wrapper-filter .ptt-filters select,
	.transactions-wrapper-filter .ptt-filters input[type="date"],
	.transactions-wrapper-filter .ptt-filters button{
		width:100%;
		max-width:100%;
	}

}




/*********************Table Layout********************************/

/* ==================================================
   Transactions Table Wrapper
================================================== */

.transactions-wrapper-table{
	margin-top:20px;
	background:#fff;
	border:1px solid #e5e7eb;
	border-radius:12px;
	overflow:hidden;
	box-shadow:0 1px 3px rgba(0,0,0,.04);
}

/* ==================================================
   Table
================================================== */

.transactions-wrapper-table .ptt-transactions-table{
	width:100%;
	border-collapse:collapse;
	border-spacing:0;
	margin:0;
	background:#fff;
}

/* ==================================================
   Header
================================================== */

.transactions-wrapper-table .ptt-transactions-table thead{
	background:#f8fafc;
}

.transactions-wrapper-table .ptt-transactions-table th{
	padding:16px 20px;
	text-align:left;

	font-size:13px;
	font-weight:600;
	text-transform:uppercase;
	letter-spacing:.5px;

	color:#64748b;

	border-bottom:1px solid #e5e7eb;
}

/* ==================================================
   Body
================================================== */

.transactions-wrapper-table .ptt-transactions-table td{
	padding:16px 20px;
	font-size:14px;
	color:#1e293b;
	border-bottom:1px solid #f1f5f9;
	vertical-align:middle;
}

.transactions-wrapper-table .ptt-transactions-table tbody tr{
	transition:background .2s ease;
}

.transactions-wrapper-table .ptt-transactions-table tbody tr:hover{
	background:#f8fafc;
}

.transactions-wrapper-table .ptt-transactions-table tbody tr:last-child td{
	border-bottom:none;
}

/* ==================================================
   Date Column
================================================== */

.transactions-wrapper-table .ptt-transactions-table td:first-child{
	color:#64748b;
	font-weight:500;
	white-space:nowrap;
}

/* ==================================================
   Point Type Badge
================================================== */

.transactions-wrapper-table .ptt-transactions-table td:nth-child(2){
	font-weight:600;
}

.transactions-wrapper-table .ptt-transactions-table td:nth-child(2)::before{
	content:"";
	display:inline-block;
	width:8px;
	height:8px;
	border-radius:50%;
	background:#2271b1;
	margin-right:8px;
	vertical-align:middle;
}

/* ==================================================
   Points
================================================== */

.transactions-wrapper-table .ptt-plus{
	display:inline-flex;
	align-items:center;
	justify-content:center;

	min-width:70px;
	padding:6px 12px;

	border-radius:999px;

	background:#ecfdf3;
	color:#15803d;

	font-size:13px;
	font-weight:700;
	line-height:1;
}

.transactions-wrapper-table .ptt-minus{
	display:inline-flex;
	align-items:center;
	justify-content:center;

	min-width:70px;
	padding:6px 12px;

	border-radius:999px;

	background:#fef2f2;
	color:#dc2626;

	font-size:13px;
	font-weight:700;
	line-height:1;
}

/* ==================================================
   Details Column
================================================== */

.transactions-wrapper-table .ptt-transactions-table td:last-child{
	color:#475569;
}

/* ==================================================
   Empty Values
================================================== */

.transactions-wrapper-table .ptt-transactions-table td:empty::after{
	content:"—";
	color:#cbd5e1;
}

/* ==================================================
   Responsive
================================================== */

@media (max-width: 768px){

	.transactions-wrapper-table{
		overflow-x:auto;
	}

	.transactions-wrapper-table .ptt-transactions-table{
		min-width:700px;
	}

	.transactions-wrapper-table .ptt-transactions-table th,
	.transactions-wrapper-table .ptt-transactions-table td{
		padding:12px 14px;
	}
}