/* affiliate.css - Affiliate view */
/* Affiliate in-app view (inside chart-area, like combat overlay) */
.aff-view{position:absolute;top:0;left:0;right:0;bottom:0;z-index:55;display:none;flex-direction:column;background:#0a0b0e;overflow:hidden;cursor:default}
.aff-view.visible{display:flex}
.aff-scroll{width:100%;height:100%;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:#2B2F36 transparent}
.aff-scroll::-webkit-scrollbar{width:5px}
.aff-scroll::-webkit-scrollbar-thumb{background:#2B2F36;border-radius:3px}
.aff-inner{max-width:680px;margin:0 auto;padding:80px 16px 48px}
.aff-page-header{text-align:center;margin-bottom:16px}
.aff-page-header h2{font-family:'Plus Jakarta Sans',sans-serif;font-size:28px;font-weight:800;color:#EAECEF;margin-bottom:6px}
.aff-page-header h2 span{color:#FCD535}
.aff-page-header .aff-sub{font-size:13px;color:#5E6673}
.aff-toolbar{display:flex;align-items:center;justify-content:space-between;padding:0 0 12px}
.aff-tabs{display:flex;gap:0;background:#111318;border:1px solid #2B2F36;border-radius:8px;padding:3px}
.aff-tab{padding:6px 14px;font-size:11px;font-weight:600;color:#5E6673;cursor:pointer;transition:color 0.2s ease,background 0.3s ease,transform 0.2s ease;border-radius:6px;background:none;letter-spacing:0.3px;border:none;font-family:'Plus Jakarta Sans',sans-serif;white-space:nowrap}
.aff-tab:hover{color:#EAECEF}
.aff-tab:active{transform:scale(0.95)}
.aff-tab.active{color:#EAECEF;background:#1E2026}
.aff-copy-link-btn{padding:7px 16px;border-radius:6px;font-size:12px;font-weight:700;color:#0a0b0e;background:#FCD535;cursor:pointer;transition:all 0.15s;display:flex;align-items:center;gap:5px;white-space:nowrap;border:none;letter-spacing:0.3px;min-width:100px;justify-content:center;font-family:'Plus Jakarta Sans',sans-serif}
.aff-copy-link-btn:hover{background:#e5c22e;transform:translateY(-1px)}
.aff-copy-link-btn.copied{background:#0ecb81;color:#fff}
.aff-toolbar-actions{display:flex;gap:8px;align-items:center}
.aff-icon-btn{width:34px;height:34px;border-radius:8px;background:#1E2026;border:1px solid #2B2F36;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all 0.15s;color:#EAECEF;flex-shrink:0}
.aff-icon-btn:active{transform:scale(0.92)}
.aff-icon-btn svg{width:18px;height:18px}
.aff-icon-btn.copied{background:#0ecb81;border-color:#0ecb81}
.aff-icon-btn.copied svg{color:#fff}
.aff-invite-btn{height:34px;padding:0 16px;border-radius:8px;font-size:12px;font-weight:700;color:#0a0b0e;background:#FCD535;cursor:pointer;transition:all 0.15s;display:flex;align-items:center;gap:6px;white-space:nowrap;border:none;letter-spacing:0.3px;font-family:'Plus Jakarta Sans',sans-serif}
.aff-invite-btn:active{transform:scale(0.95)}
.aff-invite-btn svg{width:18px;height:18px}
.aff-section{display:none}
.aff-section.active{display:block;animation:affSectionIn 0.3s ease}
@keyframes affSectionIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@keyframes affCardIn{from{opacity:0;transform:scale(0.96) translateY(12px)}to{opacity:1;transform:scale(1) translateY(0)}}

/* Affiliate -- Overview */
.aff-stats{display:flex;gap:6px;margin-bottom:0}
.aff-stat{background:#0d0e12;border:1px solid rgba(252,213,53,0.12);border-radius:8px;padding:12px 14px;text-align:center;transition:border-color 0.2s;flex:1;min-width:0}
.aff-stat:hover{border-color:rgba(252,213,53,0.25)}
.aff-stat-val{font-family:'Fira Code',monospace;font-size:12px;font-weight:700;color:#EAECEF;margin-bottom:2px}
.aff-stat-val.gold{color:#FCD535}
.aff-stat-val.green{color:#0ecb81}
.aff-stat-label{font-size:11px;color:#5E6673;text-transform:uppercase;letter-spacing:0.4px;font-weight:600}

/* Affiliate -- Assets */
.aff-asset-group{margin-bottom:24px;animation:affCardIn 0.35s ease both}
.aff-asset-title{font-size:12px;color:#FCD535;text-transform:uppercase;letter-spacing:1px;font-weight:700;margin-bottom:12px}
.aff-asset-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.aff-asset-card{background:#0d0e12;border:1.5px solid rgba(252,213,53,0.12);border-radius:12px;overflow:hidden;cursor:pointer;transition:all 0.2s}
.aff-asset-card:hover{border-color:rgba(252,213,53,0.35);transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,0.4),0 0 16px rgba(252,213,53,0.06)}
.aff-asset-preview{width:100%;aspect-ratio:16/9;background:#111318;display:flex;align-items:center;justify-content:center;font-size:28px;color:#2B2F36}
.aff-asset-preview img{max-width:80%;max-height:80%;object-fit:contain}
.aff-asset-info{padding:10px 12px;display:flex;justify-content:space-between;align-items:center}
.aff-asset-name{font-size:13px;color:#EAECEF;font-weight:600}
.aff-asset-dl{font-size:12px;color:#FCD535;text-transform:uppercase;letter-spacing:0.5px;font-weight:700;cursor:pointer}
.aff-asset-dl:hover{text-decoration:underline}
.aff-link-row{background:#0d0e12;border:1.5px solid rgba(252,213,53,0.12);border-radius:10px;padding:12px 16px;display:flex;align-items:center;gap:12px;margin-bottom:8px;transition:all 0.2s}
.aff-link-row:hover{border-color:rgba(252,213,53,0.3)}
.aff-link-label{font-size:13px;color:#848E9C;min-width:100px;font-weight:600}
.aff-link-url{font-size:13px;color:#EAECEF;font-family:'Fira Code',monospace;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.aff-link-copy{font-size:12px;color:#FCD535;text-transform:uppercase;letter-spacing:0.5px;font-weight:700;cursor:pointer;padding:4px 10px;border:1px solid rgba(252,213,53,0.2);border-radius:6px;background:transparent;font-family:inherit;transition:all 0.15s;flex-shrink:0}
.aff-link-copy:hover{background:rgba(252,213,53,0.1);border-color:rgba(252,213,53,0.4)}
.aff-asset-coming{text-align:center;padding:40px 20px;color:#5E6673;font-size:14px}
.aff-banner-desc{font-size:13px;color:#5E6673;margin-bottom:16px;line-height:1.5}
.aff-banner-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.aff-banner-card{background:#0d0e12;border:1.5px solid rgba(252,213,53,0.12);border-radius:12px;overflow:hidden;transition:all 0.2s}
.aff-banner-card:hover{border-color:rgba(252,213,53,0.35);box-shadow:0 8px 24px rgba(0,0,0,0.4),0 0 16px rgba(252,213,53,0.06)}
.aff-banner-canvas-wrap{width:100%;background:#111318;display:flex;align-items:center;justify-content:center;overflow:hidden}
.aff-banner-canvas-wrap canvas{width:100%;display:block}
.aff-banner-info{padding:12px 14px;display:flex;justify-content:space-between;align-items:center}
.aff-banner-label{font-size:13px;color:#EAECEF;font-weight:600}
.aff-banner-size{font-size:11px;color:#848E9C;font-family:'Fira Code',monospace;margin-top:2px}
.aff-banner-dl{padding:6px 14px;border-radius:6px;font-size:12px;font-weight:700;color:#0a0b0e;background:#FCD535;cursor:pointer;transition:all 0.15s;border:none;font-family:'Plus Jakarta Sans',sans-serif;letter-spacing:0.3px}
.aff-banner-dl:hover{background:#e5c22e;transform:translateY(-1px)}
.aff-portrait-grid{grid-template-columns:repeat(4,1fr)}
.aff-portrait-card{display:flex;flex-direction:column}
.aff-portrait-title{padding:12px 14px 8px;font-size:13px;color:#EAECEF;font-weight:600}
.aff-portrait-dl{margin:8px 14px 12px;padding:8px 0;border-radius:6px;font-size:12px;font-weight:700;color:#0a0b0e;background:#FCD535;cursor:pointer;transition:all 0.15s;border:none;font-family:'Plus Jakarta Sans',sans-serif;letter-spacing:0.3px;text-align:center}
.aff-portrait-dl:hover{background:#e5c22e;transform:translateY(-1px)}
.aff-video-card{background:#0d0e12;border:1.5px solid rgba(252,213,53,0.12);border-radius:12px;overflow:hidden;transition:all 0.2s}
.aff-video-card:hover{border-color:rgba(252,213,53,0.35);box-shadow:0 8px 24px rgba(0,0,0,0.4),0 0 16px rgba(252,213,53,0.06)}
.aff-video-preview{width:100%;aspect-ratio:16/9;background:#111318;position:relative;cursor:pointer;overflow:hidden}
.aff-video-portrait .aff-video-preview{aspect-ratio:9/16}
.aff-video-preview video{width:100%;height:100%;object-fit:cover;display:block}
.aff-video-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:44px;height:44px;background:rgba(0,0,0,0.55);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#FCD535;transition:opacity 0.25s,transform 0.2s;pointer-events:none}
.aff-video-play svg{width:22px;height:22px}
.aff-video-preview:hover .aff-video-play{transform:translate(-50%,-50%) scale(1.1)}
.aff-social-row{display:flex;gap:10px;flex-wrap:wrap}
.aff-social-btn{display:flex;align-items:center;gap:8px;padding:10px 18px;background:#0d0e12;border:1.5px solid rgba(252,213,53,0.12);border-radius:10px;cursor:pointer;transition:all 0.2s;font-size:14px;color:#EAECEF;font-weight:600}
.aff-social-btn:hover{border-color:rgba(252,213,53,0.3);background:#13151a;box-shadow:0 0 16px rgba(252,213,53,0.05);transform:translateY(-1px)}
.aff-social-btn .aff-social-icon{width:16px;height:16px;flex-shrink:0;display:flex;align-items:center;justify-content:center}
.aff-social-btn .aff-social-icon svg{width:16px;height:16px;fill:#EAECEF}

/* Affiliate -- Referrals table (in Overview) */
.aff-ref-wrap{background:#0d0e12;border:1px solid rgba(252,213,53,0.12);border-radius:8px;overflow:hidden;margin-top:12px;position:relative}
.aff-referrals-empty{text-align:center;padding:60px 24px}
.aff-referrals-empty-text{font-size:14px;color:#848E9C}
.aff-referrals-table{width:100%;border-collapse:collapse}
.aff-referrals-table th{font-size:12px;color:#FCD535;text-transform:uppercase;letter-spacing:0.5px;font-weight:700;text-align:left;padding:12px 16px;background:#111318;border-bottom:1px solid #2B2F36}
.aff-referrals-table td{font-size:12px;color:#848E9C;padding:12px 16px;border-bottom:1px solid rgba(43,47,54,0.4);vertical-align:middle}
.aff-referrals-table tr:last-child td{border-bottom:none}
.aff-referrals-table tr:hover td{background:rgba(252,213,53,0.03)}
.aff-referrals-table .aff-ref-earned{color:#0ecb81;font-weight:600}
.aff-ref-user{display:flex;align-items:center;gap:10px}
.aff-ref-avatar{width:22px;height:22px;border-radius:50%;background:#1E2026;flex-shrink:0}
.aff-ref-nick{font-weight:700;font-size:13px;color:#EAECEF}
.aff-ref-pagination{display:flex;align-items:center;justify-content:center;gap:12px;padding:12px 16px}
.aff-ref-pagination button{background:#1E2026;border:1px solid #2B2F36;border-radius:6px;color:#EAECEF;font-size:13px;padding:5px 12px;cursor:pointer;font-family:inherit;transition:all 0.15s}
.aff-ref-pagination button:hover:not(:disabled){background:#2B2F36;border-color:#FCD535}
.aff-ref-pagination button:disabled{opacity:0.35;cursor:default}
.aff-ref-pagination span{font-size:13px;color:#848E9C}

@media(max-width:600px){
.aff-inner{padding-left:16px;padding-right:16px}
.aff-stats{flex-wrap:wrap}
.aff-stat{flex:1 1 calc(50% - 3px);min-width:0}
.aff-asset-grid{grid-template-columns:repeat(2,1fr)}
.aff-banner-grid{grid-template-columns:1fr}
.aff-portrait-grid{grid-template-columns:repeat(2,1fr)}
.aff-tab{padding:5px 10px;font-size:10px}
.aff-copy-link-btn{padding:6px 12px;font-size:11px;min-width:80px}
.aff-link-row{flex-wrap:wrap;gap:6px}
.aff-link-label{min-width:auto;width:100%}
.aff-referrals-table th,.aff-referrals-table td{padding:10px 12px}
.aff-ref-wrap{overflow-x:auto!important;overflow-y:visible!important;-webkit-overflow-scrolling:touch}
.aff-referrals-table{width:max-content;min-width:100%}
.aff-referrals-table th,.aff-referrals-table td{white-space:nowrap}
}