﻿/* Personal Center Hover Dropdown - 参考 anytocopy.com 设计 */
/* 容器:相对定位,作为 hover 区域 */
.pc-trigger-wrap{position:relative;display:inline-flex;align-items:center;}

/* 触发器:头像+昵称+箭头 */
.pc-trigger{display:inline-flex;align-items:center;gap:8px;padding:4px 10px 4px 4px;border-radius:999px;cursor:pointer;transition:background-color .15s ease;}
.pc-trigger:hover{background-color:rgba(99,102,241,0.08);}
.pc-trigger-avatar{width:32px;height:32px;border-radius:50%;background-size:cover;background-position:center;background-color:#e0e7ff;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:600;font-size:14px;flex-shrink:0;}
.pc-trigger-name{font-size:14px;font-weight:500;color:#1f2937;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.pc-trigger-caret{width:12px;height:12px;color:#6b7280;transition:transform .15s ease;}
.pc-trigger-wrap.is-open .pc-trigger-caret{transform:rotate(180deg);}

/* 面板容器 */
.pc-panel{position:absolute;top:calc(100% + 8px);right:0;min-width:320px;max-width:360px;max-height:480px;overflow-y:auto;background:#fff;border-radius:12px;box-shadow:0 8px 24px rgba(0,0,0,0.12);z-index:1050;opacity:0;transform:translateY(-4px);pointer-events:none;transition:opacity .15s ease-out,transform .15s ease-out;}
.pc-panel::-webkit-scrollbar{width:6px;}
.pc-panel::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:3px;}
.pc-panel::-webkit-scrollbar-track{background:transparent;}
.pc-trigger-wrap.is-open .pc-panel{opacity:1;transform:translateY(0);pointer-events:auto;}

/* 账户卡 */
.pc-account{display:flex;align-items:center;gap:12px;padding:14px 16px;background:linear-gradient(135deg,#eef2ff 0%,#f3e8ff 100%);border-radius:12px 12px 0 0;text-decoration:none;color:inherit;transition:background .15s ease;cursor:pointer;}
.pc-account:hover{background:linear-gradient(135deg,#e0e7ff 0%,#ede9fe 100%);}
.pc-account-avatar{width:44px;height:44px;border-radius:50%;background-size:cover;background-position:center;background-color:#6366f1;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:600;font-size:18px;flex-shrink:0;}
.pc-account-info{flex:1;min-width:0;}
.pc-account-name{font-size:15px;font-weight:600;color:#111827;line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.pc-account-id{font-size:12px;color:#6b7280;line-height:1.4;margin-top:2px;}
.pc-account-arrow{color:#a5b4fc;flex-shrink:0;}

/* VIP 卡 */
.pc-vip{margin:12px;border-radius:12px;padding:16px;background:linear-gradient(135deg,#fb923c 0%,#f59e0b 100%);color:#fff;position:relative;overflow:hidden;}
.pc-vip.is-nonmember{background:linear-gradient(135deg,#9ca3af 0%,#6b7280 100%);}
.pc-vip-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:14px;}
.pc-vip-title{display:flex;align-items:center;gap:8px;}
.pc-vip-title-icon{width:24px;height:24px;background:rgba(255,255,255,0.25);border-radius:6px;display:flex;align-items:center;justify-content:center;}
.pc-vip-title-text{font-size:16px;font-weight:700;}
.pc-vip-subtitle{font-size:11px;opacity:0.85;margin-top:2px;}
.pc-vip-badge{background:rgba(255,255,255,0.25);padding:3px 8px;border-radius:6px;font-size:11px;font-weight:600;display:flex;align-items:center;gap:4px;}
.pc-vip-stats{display:flex;gap:10px;margin-bottom:14px;}
.pc-vip-stat{flex:1;background:rgba(255,255,255,0.18);border-radius:8px;padding:10px 12px;}
.pc-vip-stat-label{display:flex;align-items:center;gap:4px;font-size:11px;opacity:0.9;margin-bottom:4px;}
.pc-vip-stat-value{font-size:14px;font-weight:600;}
.pc-vip-stat-value.is-expiring{color:#fef2f2;font-weight:700;}
.pc-vip-btn{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;padding:10px;background:rgba(255,255,255,0.25);border:1px solid rgba(255,255,255,0.4);border-radius:8px;color:#fff;font-size:13px;font-weight:600;cursor:pointer;transition:background .15s ease;text-decoration:none;}
.pc-vip-btn:hover{background:rgba(255,255,255,0.4);}

/* 我的权益 */
.pc-benefits{padding:0 16px 12px;}
.pc-benefits-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;}
.pc-benefits-title{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:#374151;}
.pc-benefits-links{display:flex;gap:10px;}
.pc-benefits-link{font-size:11px;color:#6366f1;text-decoration:none;font-weight:600;}
.pc-benefits-link:hover{text-decoration:underline;}
.pc-quota-item{padding:10px;background:#f9fafb;border-radius:8px;margin-bottom:8px;}
.pc-quota-item:last-child{margin-bottom:0;}
.pc-quota-row1{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px;}
.pc-quota-name{font-size:13px;font-weight:500;color:#1f2937;display:flex;align-items:center;gap:6px;}
.pc-quota-total{font-size:11px;color:#6b7280;}
.pc-quota-bar{height:6px;background:#e5e7eb;border-radius:3px;overflow:hidden;margin-bottom:4px;}
.pc-quota-bar-fill{height:100%;background:linear-gradient(90deg,#3b82f6,#8b5cf6);border-radius:3px;transition:width .3s ease;}
.pc-quota-text{font-size:11px;color:#6b7280;}
.pc-quota-unlimited{font-size:11px;font-weight:600;color:#10b981;}

/* 任务按钮 */
.pc-tasks{padding:4px 12px 12px;display:flex;flex-direction:column;gap:8px;}
.pc-task-btn{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-radius:10px;cursor:pointer;border:2px solid transparent;text-decoration:none;color:inherit;transition:all .15s ease;background:#fff;}
.pc-task-btn:hover{box-shadow:0 2px 8px rgba(0,0,0,0.08);}
.pc-task-btn.running{background:linear-gradient(135deg,rgba(59,130,246,0.08),rgba(99,102,241,0.08));border-color:#bfdbfe;}
.pc-task-btn.running:hover{background:linear-gradient(135deg,rgba(59,130,246,0.16),rgba(99,102,241,0.16));border-color:#93c5fd;}
.pc-task-btn.history{background:linear-gradient(135deg,rgba(168,85,247,0.08),rgba(236,72,153,0.08));border-color:#e9d5ff;}
.pc-task-btn.history:hover{background:linear-gradient(135deg,rgba(168,85,247,0.16),rgba(236,72,153,0.16));border-color:#d8b4fe;}
.pc-task-left{display:flex;align-items:center;gap:10px;}
.pc-task-icon{width:36px;height:36px;border-radius:8px;display:flex;align-items:center;justify-content:center;color:#fff;flex-shrink:0;}
.pc-task-btn.running .pc-task-icon{background:linear-gradient(135deg,#3b82f6,#6366f1);}
.pc-task-btn.history .pc-task-icon{background:linear-gradient(135deg,#a855f7,#ec4899);}
.pc-task-text-main{font-size:13px;font-weight:600;color:#1f2937;}
.pc-task-text-sub{font-size:11px;color:#6b7280;margin-top:1px;}
.pc-task-arrow{color:#9ca3af;flex-shrink:0;}
.pc-task-btn:hover .pc-task-arrow{color:#4b5563;}

/* 退出登录 */
.pc-footer{padding:10px 16px 14px;border-top:1px solid #f3f4f6;}
.pc-signout{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;padding:8px;font-size:12px;color:#6b7280;background:transparent;border:none;border-radius:6px;cursor:pointer;transition:all .15s ease;}
.pc-signout:hover{color:#ef4444;background:#fef2f2;}

/* 加载/错误态 */
.pc-loading{padding:24px;text-align:center;color:#9ca3af;font-size:12px;}
.pc-error{padding:14px 16px;color:#9ca3af;font-size:12px;text-align:center;}

/* 移动端降级:click 切换 */
@media (max-width:768px){
  .pc-panel{min-width:280px;right:-40px;}
}
