/* css/dashboard-v2.css - creator dashboard layout: header, slide-in menu, quick-submit sheet, balance, tabs, withdraw */
html.dx-lock, html.dx-lock body { overflow: hidden; }
.dx-nav { position: sticky; top: 0; z-index: 30; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px; background: var(--bg-card); border-bottom: 1px solid var(--border-soft); }
.dx-brand { display: inline-flex; align-items: center; gap: 8px; color: var(--text); font-family: var(--font-display); font-weight: 700; }
.dx-brand:hover { text-decoration: none; }
.dx-icon-btn { background: none; border: none; color: var(--text); cursor: pointer; font-size: 24px; line-height: 1; padding: 6px; border-radius: 8px; }
.dx-icon-btn:hover { background: var(--bg-elevated); }
.dx-quick-btn { display: inline-flex; align-items: center; gap: 8px; border: none; border-radius: var(--radius-sm); background: var(--money); color: #14161c; font: inherit; font-weight: 600; padding: 9px 14px; cursor: pointer; }
.dx-short { display: none; }
@media (max-width: 520px) { .dx-long { display: none; } .dx-short { display: inline; } }
.dx-overlay { position: fixed; inset: 0; background: rgba(0, 0, 0, .55); opacity: 0; pointer-events: none; transition: opacity .2s; z-index: 40; }
.dx-overlay.is-open { opacity: 1; pointer-events: auto; }
.dx-drawer { position: fixed; top: 0; bottom: 0; left: 0; width: min(300px, 85vw); background: var(--bg-card); border-right: 1px solid var(--border-soft); transform: translateX(-100%); transition: transform .22s ease; z-index: 50; display: flex; flex-direction: column; padding: 14px; }
.dx-drawer.is-open { transform: none; }
.dx-drawer-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.dx-links { display: flex; flex-direction: column; gap: 4px; flex: 1; }
.dx-link { display: flex; align-items: center; padding: 11px 12px; border-radius: var(--radius-sm); color: var(--text-muted); font: inherit; font-weight: 500; background: none; border: none; text-align: left; cursor: pointer; width: 100%; }
.dx-link:hover, .dx-link.is-active { background: var(--bg-elevated); color: var(--text); text-decoration: none; }
.dx-logout { color: var(--danger); }
.dx-wrap { width: 100%; max-width: 1080px; margin: 0 auto; padding: 8px 16px 56px; }
.dx-hello { color: var(--text-muted); margin: 18px 0 12px; }
.dx-hello span { color: var(--text); font-weight: 600; }
.dx-balance { display: grid; grid-template-columns: 1.4fr 1fr; gap: 12px; margin-bottom: 12px; }
@media (max-width: 560px) { .dx-balance { grid-template-columns: 1fr; } }
.dx-bal-tile { background: linear-gradient(155deg, var(--bg-card-raised), var(--bg-card)); border: 1px solid var(--border-soft); border-radius: var(--radius); padding: 18px; }
.dx-avail { border-color: rgba(242, 184, 75, .3); }
.dx-money { font-family: var(--font-display); font-size: 32px; font-weight: 700; color: var(--money); margin-top: 4px; }
.dx-pend { color: var(--text); }
.dx-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.dx-mini { display: inline-flex; flex-direction: column; background: var(--bg-card); border: 1px solid var(--border-soft); border-radius: var(--radius-sm); padding: 10px 14px; margin: 0 8px 8px 0; min-width: 120px; }
.dx-mini b { font-size: 20px; }
.dx-tabs { display: flex; gap: 6px; border-bottom: 1px solid var(--border-soft); margin: 18px 0 12px; }
.dx-tab { background: none; border: none; border-bottom: 2px solid transparent; color: var(--text-muted); padding: 10px 14px; font: inherit; font-weight: 600; cursor: pointer; }
.dx-tab.is-active { color: var(--text); border-bottom-color: var(--money); }
.dx-section-head { display: flex; align-items: center; gap: 12px; margin: 18px 0 12px; }
.dx-back { background: var(--bg-elevated); color: var(--text); border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 8px 12px; font: inherit; cursor: pointer; }
.dx-h2 { font-size: 18px; margin: 0; }
.dx-panel { background: var(--bg-card); border: 1px solid var(--border-soft); border-radius: var(--radius); padding: 14px; }
.dx-submit-card { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; background: var(--bg-card); border: 1px solid var(--border-soft); border-radius: var(--radius); padding: 16px; margin-bottom: 14px; }
.dx-submit-info { display: flex; align-items: center; gap: 12px; }
.dx-submit-icon { width: 38px; height: 38px; border-radius: 10px; background: var(--bg-elevated); display: flex; align-items: center; justify-content: center; }
.dx-submit-card .dx-join { margin-top: 0; border: none; font: inherit; font-weight: 600; cursor: pointer; padding: 10px 16px; }
.dx-submissions-title { margin: 18px 0 10px; }
.dx-sheet { position: fixed; left: 0; right: 0; bottom: 0; max-height: 90vh; overflow: auto; background: var(--bg-card); border-top: 1px solid var(--border); border-radius: 18px 18px 0 0; padding: 18px 16px 24px; transform: translateY(105%); transition: transform .22s ease; z-index: 50; max-width: 560px; margin: 0 auto; }
.dx-sheet.is-open { transform: none; }
.dx-sheet-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.dx-sheet form { display: grid; gap: 10px; }
.dx-sheet-close { font-size: 26px; }
.withdraw-wrap { display: grid; gap: 20px; }
[hidden] { display: none !important; }

.analytics-card,.notifications-card{margin:18px 0;padding:18px}.analytics-card .dx-section-head,.notifications-card .dx-section-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.analytics-summary{font-weight:700}.views-chart{height:190px;display:flex;align-items:flex-end;gap:8px;padding:18px 4px 4px;border-bottom:1px solid var(--border,#e5e7eb);overflow-x:auto}.view-bar{min-width:30px;flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;height:100%;gap:6px}.view-bar-fill{width:100%;max-width:38px;min-height:2px;border-radius:7px 7px 2px 2px;background:currentColor;opacity:.8}.view-bar-label{font-size:.72rem;color:var(--muted,#6b7280)}.view-bar-value{font-size:.68rem;color:var(--muted,#6b7280)}.analytics-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}.analytics-metrics>div{padding:10px;border:1px solid var(--border,#e5e7eb);border-radius:12px}.analytics-metrics b{display:block;margin-top:3px}.notification-count{position:absolute;top:0;right:0;min-width:17px;height:17px;padding:0 4px;border-radius:99px;font-size:10px;line-height:17px;background:#dc2626;color:#fff}.dx-notification-btn{position:relative}.notification-row{display:flex;justify-content:space-between;gap:12px;padding:13px 0;border-bottom:1px solid var(--border,#e5e7eb)}.notification-row.unread{font-weight:600}.notification-row p{margin:4px 0;font-weight:400}.notification-row small{opacity:.65}.notification-actions{display:flex;gap:6px;align-items:center}.notification-row a{color:inherit}.notification-empty{padding:18px 0;opacity:.65}
@media(max-width:600px){.analytics-metrics{grid-template-columns:1fr}.views-chart{gap:5px}}

.view-streak-card{margin:14px 0;padding:14px;border:1px solid var(--border-soft);border-radius:var(--radius);background:var(--bg-card);display:grid;gap:10px}.view-streak-card b{display:block;font-size:22px;margin-top:3px}.streak-progress{height:9px;background:var(--bg-elevated);border-radius:999px;overflow:hidden}.streak-progress>div{height:100%;width:0;background:currentColor;border-radius:inherit;transition:width .3s ease}.analytics-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.analytics-metrics>div{padding:10px;border:1px solid var(--border-soft);border-radius:var(--radius-sm)}@media(max-width:560px){.analytics-metrics{grid-template-columns:1fr}}

/* Personalized campaigns + notifications */
.dx-notification-btn{position:relative;margin-left:auto;margin-right:8px}.dx-notification-count{position:absolute;top:0;right:0;min-width:17px;height:17px;padding:0 4px;border-radius:999px;font-size:10px;line-height:17px;font-weight:800;transform:translate(25%,-25%);background:#ef4444;color:#fff}.dx-notification-panel{position:fixed;z-index:100;top:62px;right:12px;width:min(390px,calc(100vw - 24px));max-height:min(620px,calc(100vh - 80px));overflow:auto;border:1px solid rgba(128,128,128,.25);border-radius:16px;background:#101318;box-shadow:0 20px 60px rgba(0,0,0,.3)}.dx-notification-head{position:sticky;top:0;display:flex;justify-content:space-between;align-items:center;padding:14px 16px;background:inherit;border-bottom:1px solid rgba(128,128,128,.18)}.dx-notification-readall{border:0;background:none;color:inherit;opacity:.7;cursor:pointer;font-size:12px}.dx-notification-item{width:100%;display:flex;gap:10px;text-align:left;padding:13px 15px;border:0;border-bottom:1px solid rgba(128,128,128,.12);background:transparent;color:inherit;cursor:pointer}.dx-notification-item.is-unread{background:rgba(59,130,246,.08)}.dx-notification-icon{width:28px;flex:0 0 28px}.dx-notification-copy{display:flex;flex-direction:column;gap:3px;min-width:0}.dx-notification-copy strong{font-size:13px}.dx-notification-copy span{font-size:12px;opacity:.72;line-height:1.4}.dx-notification-copy small{font-size:10px;opacity:.48}.dx-notification-empty{padding:28px 18px;text-align:center;opacity:.6;font-size:13px}@media(max-width:600px){.dx-notification-panel{top:58px;right:8px;width:calc(100vw - 16px)}}
