/* profile.html 專用 CSS（主題化） */
.profile-container {max-width: 1200px;margin: 0 auto;}
.profile-header {margin-bottom: 30px;padding: 25px;background: linear-gradient(90deg, var(--bg-darker,#36393f), var(--bg-darker,#2f3136));border-radius: 12px;box-shadow: 0 4px 15px rgba(0,0,0,0.15);border-left: 5px solid var(--primary-color,#5865f2);}
.profile-header h1 {margin: 0;display: flex;align-items: center;gap: 15px;font-size: 2rem;color: var(--text-main,#ffffff);}
.profile-header p {margin: 10px 0 0 0;color: var(--text-muted,#6b7280);font-size: 1.1rem;}
.profile-grid {display: grid;grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));gap: 25px;margin-bottom: 30px;}
.profile-card {background: var(--bg-darker,#2f3136);border-radius: 12px;padding: 25px;color: var(--text-main,#e5e7eb);box-shadow: 0 4px 15px rgba(0,0,0,0.18);transition: all 0.3s ease;border: 1px solid var(--border-subtle,rgba(255, 255, 255, 0.08));}
.profile-card:hover {transform: translateY(-5px);box-shadow: 0 8px 25px rgba(0,0,0,0.25);border-color: rgba(114, 137, 218, 0.4);}
.avatar-container {display: flex;flex-direction: column;align-items: center;margin-bottom: 25px;position: relative;}
.profile-avatar {width: 150px;height: 150px;border-radius: 50%;object-fit: cover;border: 4px solid var(--primary-color,#5865f2);box-shadow: 0 4px 15px rgba(0,0,0,0.3);transition: all 0.3s ease;margin-bottom: 20px;}
.profile-avatar:hover {transform: scale(1.05);border-color: #7289da;}
.admin-badge {position: absolute;bottom: 45px;right: calc(50% - 85px);background: linear-gradient(to right, #f04747, #f57a7a);color: #ffffff;padding: 5px 10px;border-radius: 20px;font-size: 0.75rem;font-weight: bold;box-shadow: 0 2px 5px rgba(0,0,0,0.2);display: flex;align-items: center;gap: 5px;}
.profile-username {font-size: 1.8rem;margin: 0 0 5px 0;color: var(--text-main,#ffffff);text-align: center;}
.profile-info {margin-bottom: 20px;}
.info-item {padding: 10px 15px;border-radius: 8px;margin-bottom: 10px;background: var(--bg-lighter,rgba(0, 0, 0, 0.06));display: flex;justify-content: space-between;align-items: center;}
.info-label {color: var(--text-muted,#9ca3af);font-weight: 500;}
.info-value {color: var(--text-main,#111827);font-weight: 600;background: var(--bg-body,rgba(0, 0, 0, 0.06));padding: 5px 10px;border-radius: 4px;}
.profile-section-title {display: flex;align-items: center;gap: 10px;margin-bottom: 20px;color: var(--text-main,#ffffff);font-size: 1.4rem;}
.discord-status {display: flex;align-items: center;margin-bottom: 20px;padding: 15px;border-radius: 8px;background: rgba(114, 137, 218, 0.1);border: 1px solid rgba(114, 137, 218, 0.3);}
.discord-info {flex: 1;}
.discord-avatar {width: 60px;height: 60px;border-radius: 50%;object-fit: cover;margin-right: 15px;border: 2px solid #7289da;}
.discord-username {color: var(--text-main,#ffffff);font-weight: 600;margin: 0 0 5px 0;}
.discord-id {color: var(--text-muted,#9ca3af);font-size: 0.9rem;margin: 0;}
.button-group {display: flex;flex-wrap: wrap;gap: 15px;margin-top: 20px;}
.profile-btn {padding: 10px 20px;border-radius: 8px;border: none;font-weight: 600;cursor: pointer;transition: all 0.2s;display: flex;align-items: center;gap: 8px;flex: 1;min-width: 180px;justify-content: center;}
.btn-primary {background: linear-gradient(to right, var(--primary-color,#5865f2), #7289da);color: #ffffff;box-shadow: 0 4px 6px rgba(88, 101, 242, 0.2);}
.btn-primary:hover {background: linear-gradient(to right, #4752c4, #637ad4);transform: translateY(-2px);box-shadow: 0 6px 10px rgba(88, 101, 242, 0.3);}
.btn-secondary {background: linear-gradient(to right, #4f545c, #5c6067);color: #ffffff;box-shadow: 0 4px 6px rgba(79, 84, 92, 0.2);}
.btn-secondary:hover {background: linear-gradient(to right, #434548, #4a4c52);transform: translateY(-2px);box-shadow: 0 6px 10px rgba(79, 84, 92, 0.3);}
.btn-danger {background: linear-gradient(to right, #f04747, #f57a7a);color: #ffffff;box-shadow: 0 4px 6px rgba(240, 71, 71, 0.2);}
.btn-danger:hover {background: linear-gradient(to right, #d84040, #e56b6b);transform: translateY(-2px);box-shadow: 0 6px 10px rgba(240, 71, 71, 0.3);}
.btn-success {background: linear-gradient(to right, #43b581, #3ca374);color: #ffffff;box-shadow: 0 4px 6px rgba(67, 181, 129, 0.2);}
.btn-success:hover {background: linear-gradient(to right, #3ca374, #37946a);transform: translateY(-2px);box-shadow: 0 6px 10px rgba(67, 181, 129, 0.3);}
.feature-list {list-style-type: none;padding: 0;margin: 10px 0 20px 0;}
.feature-list li {padding: 8px 0;display: flex;align-items: center;gap: 10px;}
.feature-list li i {color: var(--primary-color,#7289da);}
.not-connected-box {background: var(--bg-lighter,rgba(0, 0, 0, 0.06));border-radius: 8px;padding: 20px;border: 1px dashed var(--border-subtle,rgba(148, 163, 184, 0.6));margin-bottom: 20px;}
.not-connected-box h3 {margin-top: 0;color: #f04747;display: flex;align-items: center;gap: 10px;}
.alert {padding: 15px;margin-bottom: 20px;border-radius: 8px;display: flex;align-items: center;gap: 15px;}
.alert-danger {background: rgba(240, 71, 71, 0.06);border: 1px solid rgba(240, 71, 71, 0.3);color: #f04747;}
.alert-success {background: rgba(67, 181, 129, 0.06);border: 1px solid rgba(67, 181, 129, 0.3);color: #43b581;}
.alert i {font-size: 1.5rem;}
@keyframes pulse {0% {box-shadow: 0 0 0 0 rgba(88, 101, 242, 0.7);}70% {box-shadow: 0 0 0 10px rgba(88, 101, 242, 0);}100% {box-shadow: 0 0 0 0 rgba(88, 101, 242, 0);}}
.pulse {animation: pulse 2s infinite;}
@media (max-width: 768px) {.profile-grid {grid-template-columns: 1fr;}.button-group {flex-direction: column;}.profile-btn {width: 100%;}}

/* Payment status chips (profile recent payments table) */
.ph-chip {text-transform: uppercase;letter-spacing:.5px;line-height:1;border-radius:999px;background:var(--bg-darker,#2d2f31);color:var(--text-muted,#9ca3af);}
.ph-chip.ok {background:rgba(67,181,129,.15);color:#16a34a;border:1px solid rgba(67,181,129,.4);} 
.ph-chip.fail {background:rgba(240,71,71,.15);color:#dc2626;border:1px solid rgba(240,71,71,.4);} 
.ph-chip.wait {background:rgba(250,166,26,.18);color:#d97706;border:1px solid rgba(250,166,26,.45);} 
.ph-chip.other {background:rgba(114,137,218,.18);color:#4f46e5;border:1px solid rgba(114,137,218,.45);} 
@media (max-width:640px){
	.profile-avatar {width:120px;height:120px;}
	.profile-header h1 {font-size:1.6rem;}
	.profile-section-title {font-size:1.2rem;}
	.profile-grid {gap:18px;}
}