/* ========================================================================== Tunasonga Artist CRM — Public Dashboard Palette: midnight plum surface, electric violet primary, acid lime accent Type: Space Grotesk (display) / Inter (body & data) ========================================================================== */ .tsc-dash { --tsc-bg: #15121f; --tsc-surface: #1e1a2e; --tsc-surface-2: #241f38; --tsc-border: #322c49; --tsc-text: #f4f2fa; --tsc-muted: #a79fc2; --tsc-violet: #7c5cff; --tsc-violet-soft: rgba(124, 92, 255, 0.16); --tsc-lime: #c6ff3d; --tsc-amber: #ffb020; --tsc-amber-soft: rgba(255, 176, 32, 0.15); --tsc-coral: #ff5470; --tsc-coral-soft: rgba(255, 84, 112, 0.15); --tsc-green: #34d399; --tsc-green-soft: rgba(52, 211, 153, 0.15); --tsc-radius: 14px; --tsc-font-display: 'Space Grotesk', 'Segoe UI', sans-serif; --tsc-font-body: 'Inter', 'Segoe UI', sans-serif; font-family: var(--tsc-font-body); color: var(--tsc-text); background: var(--tsc-bg); border-radius: 22px; overflow: hidden; box-shadow: 0 30px 80px -30px rgba(0, 0, 0, 0.6); max-width: 1180px; margin: 32px auto; border: 1px solid var(--tsc-border); } .tsc-dash * { box-sizing: border-box; } .tsc-dash h1, .tsc-dash h2, .tsc-dash h3 { font-family: var(--tsc-font-display); margin: 0 0 4px; letter-spacing: -0.01em; } .tsc-dash a { color: var(--tsc-violet); } /* ---------- Logged out ---------- */ .tsc-logged-out { display: flex; align-items: center; justify-content: center; min-height: 320px; background: radial-gradient(circle at 20% 20%, #241f38, #15121f 70%); } .tsc-logged-out-card { text-align: center; padding: 48px; max-width: 420px; } .tsc-logged-out-card h2 { font-size: 28px; } .tsc-logged-out-card p { color: var(--tsc-muted); margin: 12px 0 24px; } /* ---------- Top bar ---------- */ .tsc-topbar { display: flex; align-items: center; justify-content: space-between; padding: 18px 28px; background: linear-gradient(120deg, #1c1730, #241f3c 60%, #1c1730); border-bottom: 1px solid var(--tsc-border); } .tsc-topbar-brand { display: flex; align-items: center; gap: 12px; } .tsc-brand-text { font-family: var(--tsc-font-display); font-weight: 600; font-size: 17px; } .tsc-brand-text em { font-style: normal; color: var(--tsc-muted); font-weight: 400; margin-left: 4px; } .tsc-wave { display: inline-flex; align-items: flex-end; gap: 3px; height: 22px; } .tsc-wave i { display: block; width: 4px; background: var(--tsc-violet); border-radius: 2px; animation: tsc-bounce 1.1s ease-in-out infinite; } .tsc-wave i:nth-child(1) { height: 8px; animation-delay: 0s; background: var(--tsc-lime); } .tsc-wave i:nth-child(2) { height: 16px; animation-delay: .1s; } .tsc-wave i:nth-child(3) { height: 22px; animation-delay: .2s; background: var(--tsc-lime); } .tsc-wave i:nth-child(4) { height: 14px; animation-delay: .3s; } .tsc-wave i:nth-child(5) { height: 10px; animation-delay: .4s; } @keyframes tsc-bounce { 0%, 100% { transform: scaleY(0.5); } 50% { transform: scaleY(1); } } @media (prefers-reduced-motion: reduce) { .tsc-wave i { animation: none; } } .tsc-topbar-user { display: flex; align-items: center; gap: 14px; } .tsc-avatar { width: 36px; height: 36px; border-radius: 50%; background: var(--tsc-violet); color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 600; font-family: var(--tsc-font-display); } .tsc-kyc-pill { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; padding: 6px 12px; border-radius: 999px; background: var(--tsc-surface-2); color: var(--tsc-muted); } .tsc-kyc-pill i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; } .tsc-kyc-pill.tsc-kyc-approved { background: var(--tsc-green-soft); color: var(--tsc-green); } .tsc-kyc-pill.tsc-kyc-pending { background: var(--tsc-amber-soft); color: var(--tsc-amber); } .tsc-kyc-pill.tsc-kyc-rejected { background: var(--tsc-coral-soft); color: var(--tsc-coral); } .tsc-kyc-pill.tsc-kyc-not_submitted { background: var(--tsc-surface-2); color: var(--tsc-muted); } /* ---------- Body layout ---------- */ .tsc-body { display: flex; min-height: 560px; } .tsc-sidenav { width: 230px; flex-shrink: 0; padding: 22px 14px; border-right: 1px solid var(--tsc-border); background: #181425; } .tsc-nav-item { width: 100%; display: flex; align-items: center; gap: 10px; text-align: left; background: none; border: none; color: var(--tsc-muted); font-family: var(--tsc-font-body); font-size: 14px; font-weight: 500; padding: 11px 12px; border-radius: 10px; cursor: pointer; margin-bottom: 4px; position: relative; transition: background .15s, color .15s; } .tsc-nav-item:hover { background: var(--tsc-surface-2); color: var(--tsc-text); } .tsc-nav-item.is-active { background: var(--tsc-violet-soft); color: var(--tsc-text); } .tsc-nav-item.is-active .tsc-nav-ico { background: var(--tsc-violet); } .tsc-nav-ico { width: 8px; height: 8px; border-radius: 50%; background: var(--tsc-border); flex-shrink: 0; } .tsc-nav-badge { margin-left: auto; background: var(--tsc-coral); color: #fff; font-size: 11px; font-weight: 700; padding: 1px 7px; border-radius: 999px; } /* ---------- Main / panels ---------- */ .tsc-main { flex: 1; padding: 30px 34px; min-width: 0; } .tsc-panel { display: none; animation: tsc-fade .25s ease; } .tsc-panel.is-active { display: block; } @keyframes tsc-fade { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } } .tsc-panel-head { margin-bottom: 20px; } .tsc-panel-head h1 { font-size: 24px; } .tsc-sub { color: var(--tsc-muted); font-size: 14px; margin: 0; } .tsc-toast { display: none; position: sticky; top: 0; z-index: 5; margin-bottom: 16px; padding: 12px 16px; border-radius: 10px; font-size: 14px; font-weight: 500; } .tsc-toast.is-visible { display: block; } .tsc-toast.is-success { background: var(--tsc-green-soft); color: var(--tsc-green); border: 1px solid rgba(52,211,153,.3); } .tsc-toast.is-error { background: var(--tsc-coral-soft); color: var(--tsc-coral); border: 1px solid rgba(255,84,112,.3); } /* ---------- Grid & cards ---------- */ .tsc-grid { display: grid; gap: 20px; } .tsc-grid-2 { grid-template-columns: 1fr 1fr; align-items: start; } .tsc-grid-3 { grid-template-columns: repeat(3, 1fr); } .tsc-grid-4 { grid-template-columns: repeat(4, 1fr); } .tsc-tight { gap: 12px; } @media (max-width: 900px) { .tsc-grid-2, .tsc-grid-3, .tsc-grid-4 { grid-template-columns: 1fr; } } .tsc-card { background: var(--tsc-surface); border: 1px solid var(--tsc-border); border-radius: var(--tsc-radius); padding: 24px; } .tsc-card-title { font-size: 16px; margin-bottom: 16px; } .tsc-card-title.tsc-no-margin { margin-bottom: 0; } .tsc-card-subtitle { font-size: 13px; text-transform: uppercase; letter-spacing: .04em; color: var(--tsc-muted); margin: 22px 0 10px; font-family: var(--tsc-font-body); font-weight: 600; } /* ---------- Forms ---------- */ .tsc-field { margin-bottom: 16px; } .tsc-field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; } .tsc-field label { display: block; font-size: 13px; font-weight: 600; margin-bottom: 6px; color: var(--tsc-text); } .tsc-field .req { color: var(--tsc-coral); } .tsc-field input[type=text], .tsc-field input[type=url], .tsc-field input[type=number], .tsc-field input[type=file], .tsc-field select, .tsc-field textarea { width: 100%; background: var(--tsc-surface-2); border: 1px solid var(--tsc-border); color: var(--tsc-text); border-radius: 9px; padding: 10px 12px; font-size: 14px; font-family: var(--tsc-font-body); outline: none; transition: border-color .15s, box-shadow .15s; } .tsc-field input:focus, .tsc-field select:focus, .tsc-field textarea:focus { border-color: var(--tsc-violet); box-shadow: 0 0 0 3px var(--tsc-violet-soft); } .tsc-field textarea { resize: vertical; } .tsc-hint { display: block; font-size: 12px; color: var(--tsc-muted); margin-top: 6px; } .tsc-hint-file { color: var(--tsc-lime); } .tsc-form-actions { margin-top: 6px; } .tsc-btn { font-family: var(--tsc-font-body); font-weight: 600; font-size: 14px; padding: 11px 22px; border-radius: 9px; border: none; cursor: pointer; transition: transform .1s, opacity .15s; } .tsc-btn:active { transform: scale(0.98); } .tsc-btn:disabled { opacity: .6; cursor: not-allowed; } .tsc-btn-primary { background: var(--tsc-violet); color: #fff; } .tsc-btn-primary:hover { background: #6b4cf0; } .tsc-btn-outline { background: transparent; color: var(--tsc-text); border: 1px solid var(--tsc-border); } .tsc-btn-outline:hover { border-color: var(--tsc-violet); color: var(--tsc-violet); } /* ---------- KYC ---------- */ .tsc-kyc-status { display: flex; align-items: flex-start; gap: 12px; padding: 14px; border-radius: 10px; background: var(--tsc-surface-2); margin-bottom: 18px; } .tsc-kyc-status i { width: 10px; height: 10px; border-radius: 50%; margin-top: 4px; flex-shrink: 0; background: var(--tsc-muted); } .tsc-kyc-status-approved i { background: var(--tsc-green); } .tsc-kyc-status-pending i { background: var(--tsc-amber); } .tsc-kyc-status-rejected i { background: var(--tsc-coral); } .tsc-kyc-note { color: var(--tsc-coral); font-size: 13px; margin: 4px 0 0; } .tsc-verified-msg { color: var(--tsc-green); font-weight: 600; } /* ---------- Music: filters / table ---------- */ .tsc-music-list-card { margin-top: 20px; } .tsc-list-toolbar { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; margin-bottom: 18px; } .tsc-filter-pills { display: flex; gap: 8px; flex-wrap: wrap; } .tsc-pill { background: var(--tsc-surface-2); border: 1px solid var(--tsc-border); color: var(--tsc-muted); font-size: 13px; font-weight: 600; padding: 7px 13px; border-radius: 999px; cursor: pointer; } .tsc-pill b { font-weight: 700; margin-left: 4px; } .tsc-pill.is-active { background: var(--tsc-violet-soft); border-color: var(--tsc-violet); color: var(--tsc-text); } .tsc-table-wrap { overflow-x: auto; } .tsc-table { width: 100%; border-collapse: collapse; font-size: 13.5px; } .tsc-table th { text-align: left; color: var(--tsc-muted); font-weight: 600; font-size: 12px; text-transform: uppercase; letter-spacing: .03em; padding: 10px 12px; border-bottom: 1px solid var(--tsc-border); } .tsc-table td { padding: 12px; border-bottom: 1px solid var(--tsc-border); vertical-align: top; } .tsc-table tr:last-child td { border-bottom: none; } .tsc-table tr.tsc-row-hidden { display: none; } .tsc-track-cell { display: flex; align-items: center; gap: 10px; } .tsc-track-ico { width: 30px; height: 30px; border-radius: 8px; background: var(--tsc-violet-soft); flex-shrink: 0; position: relative; } .tsc-track-ico::after { content: '♪'; position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: var(--tsc-violet); font-size: 14px; } .tsc-track-cell small { display: block; color: var(--tsc-muted); } .tsc-status { display: inline-block; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; padding: 4px 9px; border-radius: 999px; } .tsc-status-pending { background: var(--tsc-amber-soft); color: var(--tsc-amber); } .tsc-status-approved { background: var(--tsc-green-soft); color: var(--tsc-green); } .tsc-status-rejected { background: var(--tsc-coral-soft); color: var(--tsc-coral); } .tsc-row-note { margin-top: 4px; font-size: 12px; color: var(--tsc-coral); max-width: 220px; } .tsc-icon-btn { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 8px; background: var(--tsc-surface-2); text-decoration: none; color: var(--tsc-text); } .tsc-icon-btn:hover { background: var(--tsc-violet-soft); color: var(--tsc-violet); } .tsc-empty { padding: 32px; text-align: center; color: var(--tsc-muted); } /* ---------- Analytics ---------- */ .tsc-stat-row { margin-bottom: 20px; } .tsc-stat-card { background: var(--tsc-surface); border: 1px solid var(--tsc-border); border-radius: var(--tsc-radius); padding: 18px 20px; } .tsc-stat-label { display: block; font-size: 12px; color: var(--tsc-muted); text-transform: uppercase; letter-spacing: .03em; margin-bottom: 8px; } .tsc-stat-value { font-family: var(--tsc-font-display); font-size: 26px; font-weight: 700; } .tsc-stat-accent { border-color: var(--tsc-violet); box-shadow: 0 0 0 1px var(--tsc-violet) inset; } .tsc-stat-accent .tsc-stat-value { color: var(--tsc-lime); } .tsc-dsp-chip { background: var(--tsc-surface-2); border: 1px solid var(--tsc-border); font-size: 12px; padding: 3px 9px; border-radius: 999px; } @media (max-width: 780px) { .tsc-body { flex-direction: column; } .tsc-sidenav { width: 100%; display: flex; overflow-x: auto; border-right: none; border-bottom: 1px solid var(--tsc-border); } .tsc-nav-item { white-space: nowrap; } .tsc-main { padding: 20px; } .tsc-field-row { grid-template-columns: 1fr; } } /* ========================================================================== TunaSONGa Mobile Artist Portal — screenshot-aligned account experience These overrides keep the existing CRM components, but give the logged-in portal the compact midnight/pink mobile layout used by the approved design. ========================================================================== */ .tsc-home { max-width: 860px; margin: 0 auto; } .tsc-mobile-welcome { display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; } .tsc-eyebrow { display:block; color:#8d91a5; font-size:10px; text-transform:uppercase; letter-spacing:.08em; margin-bottom:5px; } .tsc-mobile-welcome h1 { font-size:24px; margin:0; color:#f7f7fb; } .tsc-status-dot { width:10px; height:10px; border-radius:50%; background:#5d6070; box-shadow:0 0 0 5px rgba(93,96,112,.12); } .tsc-status-dot-approved { background:#35d59a; box-shadow:0 0 0 5px rgba(53,213,154,.12); } .tsc-status-dot-pending { background:#ffbd4a; } .tsc-status-dot-rejected { background:#ff4f87; } .tsc-earnings-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-bottom:14px; } .tsc-home-stat { min-height:88px; display:flex; align-items:center; gap:10px; padding:14px; border:1px solid #1e2638; border-radius:13px; background:linear-gradient(145deg,#101728,#0d1321); box-shadow:0 10px 28px rgba(0,0,0,.16); } .tsc-home-stat-icon { width:34px; height:34px; border-radius:10px; display:flex; align-items:center; justify-content:center; background:#087cff; color:#fff; font-weight:800; font-size:16px; flex-shrink:0; } .tsc-source-pavarisk .tsc-home-stat-icon { background:#ff7a18; } .tsc-source-dsp .tsc-home-stat-icon { background:#1fcf8a; } .tsc-home-stat-copy span { display:block; color:#8f94a8; font-size:10px; line-height:1.25; } .tsc-home-stat-copy strong { display:block; color:#f6f7fb; font-size:15px; margin-top:5px; } .tsc-home-alert { display:flex; align-items:center; gap:12px; margin:14px 0 22px; padding:14px; border:1px solid #2a243a; border-radius:13px; background:#111728; } .tsc-home-alert-icon { width:34px; height:34px; display:flex; align-items:center; justify-content:center; border-radius:9px; background:rgba(255,32,151,.13); color:#ff2097; font-weight:800; flex-shrink:0; } .tsc-home-alert-copy { flex:1; min-width:0; } .tsc-home-alert-copy strong { font-size:13px; } .tsc-home-alert-copy p { margin:3px 0 0; color:#8f94a8; font-size:10px; line-height:1.35; } .tsc-home-alert .tsc-btn { background:#ef1990; border-radius:9px; padding:9px 14px; font-size:11px; white-space:nowrap; } .tsc-home-section { margin:22px 0; } .tsc-home-section-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; } .tsc-home-section-head h2 { font-size:13px; color:#f3f3f8; margin:0; } .tsc-text-link { border:0; background:none; color:#ff2097; font-size:11px; cursor:pointer; } .tsc-release-list { display:grid; gap:8px; } .tsc-release-row { display:flex; align-items:center; gap:10px; padding:10px; border:1px solid #20283a; border-radius:11px; background:#111829; } .tsc-release-art { width:42px; height:42px; border-radius:7px; background:linear-gradient(145deg,#252b3c,#090d17); border:1px solid #30374a; flex-shrink:0; } .tsc-release-copy { flex:1; min-width:0; } .tsc-release-copy strong { display:block; color:#f2f2f6; font-size:12px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .tsc-release-copy span { display:block; color:#81869a; font-size:9px; margin-top:3px; } .tsc-status { font-size:9px; padding:4px 7px; } .tsc-support-grid { display:grid; gap:8px; } .tsc-support-card { width:100%; display:flex; align-items:center; gap:10px; padding:12px; border:1px solid #20283a; border-radius:11px; background:#111829; color:#fff; text-align:left; cursor:pointer; } .tsc-support-card > span:nth-child(2) { flex:1; } .tsc-support-card strong,.tsc-support-card small { display:block; } .tsc-support-card strong { font-size:11px; } .tsc-support-card small { color:#80869a; font-size:9px; margin-top:3px; } .tsc-support-card b { color:#747a90; font-size:17px; } .tsc-support-icon { width:28px; height:28px; display:flex; align-items:center; justify-content:center; border-radius:8px; background:#181d2d; color:#ff2097; border:1px solid #272e40; } .tsc-news-list { display:grid; gap:9px; } .tsc-news-card { display:flex; gap:10px; padding:13px; border:1px solid #20283a; border-radius:11px; background:#111829; } .tsc-news-icon { color:#ff2097; font-size:20px; line-height:1; } .tsc-news-card strong { font-size:11px; } .tsc-news-card p { color:#8b90a3; font-size:10px; line-height:1.5; margin:5px 0; } .tsc-news-card small { color:#626a80; font-size:8px; } .tsc-bottom-nav { display:none; } @media (max-width:780px) { .tsc-dash { width:100%; max-width:none; margin:0; border:0; border-radius:0; background:#080e1a; box-shadow:none; min-height:100vh; padding-bottom:72px; } .tsc-topbar { position:sticky; top:0; z-index:30; padding:10px 12px; background:rgba(8,14,26,.96); border-bottom:1px solid #1d2536; } .tsc-topbar-brand { gap:7px; } .tsc-brand-text { font-size:12px; } .tsc-brand-text em { color:#ff2097; } .tsc-wave { transform:scale(.72); transform-origin:left center; width:34px; } .tsc-topbar-user { gap:7px; } .tsc-topbar-user .tsc-avatar { display:none; } .tsc-kyc-pill { font-size:8px; padding:5px 8px; } .tsc-body { display:block; min-height:0; } .tsc-sidenav { display:none; } .tsc-main { padding:18px 12px 12px; } .tsc-panel-head h1 { font-size:19px; } .tsc-sub { font-size:10px; } .tsc-earnings-grid { grid-template-columns:repeat(2,1fr); gap:7px; } .tsc-home-stat { min-height:72px; padding:10px; gap:8px; } .tsc-home-stat-icon { width:29px; height:29px; font-size:13px; border-radius:8px; } .tsc-home-stat-copy span { font-size:8px; } .tsc-home-stat-copy strong { font-size:12px; } .tsc-earnings-grid .tsc-source-dsp { grid-column:1 / -1; } .tsc-home-alert { align-items:flex-start; flex-wrap:wrap; } .tsc-home-alert .tsc-btn { width:100%; text-align:center; } .tsc-home-section { margin:20px 0; } .tsc-bottom-nav { position:fixed; left:0; right:0; bottom:0; z-index:50; height:66px; display:grid; grid-template-columns:repeat(5,1fr); background:rgba(9,14,25,.98); border-top:1px solid #1e2638; padding-bottom:env(safe-area-inset-bottom); } .tsc-bottom-item { border:0; background:none; color:#71778b; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; font-size:17px; cursor:pointer; } .tsc-bottom-item small { font-size:8px; } .tsc-bottom-item.is-active { color:#ff2097; } .tsc-upload-item b { width:34px; height:34px; margin-top:-16px; display:flex; align-items:center; justify-content:center; border-radius:50%; background:linear-gradient(135deg,#ff1c9a,#b62cff); color:#fff; font-size:21px; box-shadow:0 8px 22px rgba(255,32,151,.32); } .tsc-upload-item small { margin-top:-1px; } } .tsc-brand-text span { color:#ff2097; } .tsc-logout-link { color:#ff2097; text-decoration:none; font-size:11px; font-weight:700; margin-left:8px; } @media (max-width:780px){ .tsc-logout-link { padding:6px 8px; border-radius:8px; background:rgba(255,32,151,.1); } } /* v2.12 Royalty Analytics */ .tsc-analytics-pro{display:flex;flex-direction:column;gap:20px}.tsc-report-period{padding:10px 16px;border:1px solid var(--tsc-border);border-radius:12px;color:var(--tsc-lime);font-weight:700}.tsc-analytics-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.tsc-analytics-stat{background:var(--tsc-surface);border:1px solid var(--tsc-border);border-radius:16px;padding:20px}.tsc-analytics-stat span{display:block;color:var(--tsc-muted);font-size:12px;text-transform:uppercase;letter-spacing:.08em}.tsc-analytics-stat strong{display:block;font-size:28px;margin-top:8px}.tsc-analytics-card{background:var(--tsc-surface);border:1px solid var(--tsc-border);border-radius:16px;padding:20px}.tsc-section-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.tsc-section-title h2{margin:0;font-size:18px}.tsc-section-title span{color:var(--tsc-muted);font-size:12px}.tsc-analytics-two{display:grid;grid-template-columns:1.35fr 1fr;gap:20px}.tsc-arow{display:grid;grid-template-columns:1.5fr 1.2fr .8fr .9fr;gap:12px;padding:13px 8px;border-top:1px solid var(--tsc-border);align-items:center;font-size:13px}.tsc-arow.tsc-head{border-top:0;color:var(--tsc-muted);text-transform:uppercase;font-size:11px;font-weight:700}.tsc-arow span:last-child{text-align:right}.tsc-analytics-empty{padding:24px 8px;color:var(--tsc-muted)}.tsc-bar-row{display:grid;grid-template-columns:1fr 44px;gap:6px;margin:16px 0}.tsc-bar-row>div:first-child,.tsc-territory-row>div:first-child{display:flex;justify-content:space-between;gap:10px}.tsc-bar-row>div:first-child span,.tsc-territory-row>div:first-child span{color:var(--tsc-muted)}.tsc-bar{grid-column:1/2;height:8px;background:var(--tsc-border);border-radius:99px;overflow:hidden}.tsc-bar i,.tsc-territory-bar i{display:block;height:100%;background:var(--tsc-lime);border-radius:99px}.tsc-bar-row small{grid-column:2;grid-row:2;color:var(--tsc-muted);text-align:right}.tsc-source-row{display:flex;justify-content:space-between;padding:14px 0;border-top:1px solid var(--tsc-border)}.tsc-territory-row{margin:16px 0}.tsc-territory-bar{height:9px;background:var(--tsc-border);border-radius:99px;overflow:hidden;margin-top:8px}.tsc-month-chart{display:flex;align-items:flex-end;gap:12px;height:220px;overflow-x:auto;padding-top:18px}.tsc-month-col{min-width:64px;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:7px}.tsc-month-value{font-size:10px;color:var(--tsc-muted);white-space:nowrap}.tsc-month-bar{height:150px;width:28px;background:var(--tsc-border);border-radius:8px 8px 3px 3px;display:flex;align-items:flex-end;overflow:hidden}.tsc-month-bar i{width:100%;background:var(--tsc-violet);border-radius:8px 8px 3px 3px}.tsc-month-col small{color:var(--tsc-muted)} @media(max-width:900px){.tsc-analytics-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.tsc-analytics-two{grid-template-columns:1fr}.tsc-arow{grid-template-columns:1.4fr 1fr .8fr .9fr;font-size:12px;min-width:620px}.tsc-analytics-table{overflow:auto}.tsc-panel-head{gap:12px}.tsc-report-period{align-self:flex-start}} @media(max-width:520px){.tsc-analytics-stats{grid-template-columns:1fr 1fr}.tsc-analytics-stat strong{font-size:20px}.tsc-analytics-card{padding:14px}} /* TunaSONGa Core v2.12.4 — mobile analytics tables */ .tsc-table-wrap { overflow-x: auto; overflow-y: hidden; max-width: 100%; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; scrollbar-width: thin; } .tsc-table-wrap .tsc-table { min-width: 720px; width: max-content; max-width: none; } .tsc-table-wrap::-webkit-scrollbar { height: 7px; } .tsc-table-wrap::-webkit-scrollbar-thumb { border-radius: 999px; background: var(--tsc-violet); } .tsc-table-wrap::-webkit-scrollbar-track { background: var(--tsc-surface-2); } @media (max-width: 700px) { .tsc-table-wrap { margin-left: 0; margin-right: 0; padding-bottom: 4px; } .tsc-table-wrap .tsc-table { min-width: 760px; } } /* TunaSONGa Core 2.13.2 — final responsive safeguards */ .tsc-dash img, .tsc-dash video, .tsc-dash iframe { max-width: 100%; height: auto; } .tsc-dash button, .tsc-dash input, .tsc-dash select, .tsc-dash textarea { max-width: 100%; } .tsc-dash .tsc-card, .tsc-dash .tsc-panel { min-width: 0; } @media (max-width: 900px) { .tsc-topbar { gap: 10px; } .tsc-topbar-user { min-width: 0; } .tsc-topbar-user > * { min-width: 0; } .tsc-main { min-width: 0; overflow-x: hidden; } .tsc-card { padding: 18px; } .tsc-field-row { grid-template-columns: 1fr; } .tsc-list-toolbar { align-items: stretch; } .tsc-filter-pills { width: 100%; overflow-x: auto; padding-bottom: 3px; flex-wrap: nowrap; } .tsc-pill { flex: 0 0 auto; } .tsc-table-wrap { max-width: 100%; } } @media (max-width: 520px) { .tsc-main { padding-left: 10px; padding-right: 10px; } .tsc-card { padding: 14px; border-radius: 12px; } .tsc-panel-head h1 { font-size: 18px; } .tsc-btn { width: 100%; min-height: 42px; } .tsc-form-actions { display: grid; gap: 8px; } .tsc-home-section-head { gap: 8px; } .tsc-home-section-head > * { min-width: 0; } } /* TunaSONGa Core 2.13.3 — Label CRM mobile parity */ .tsc-label-more { display:none; } .tsc-label-bottom-nav .tsc-more-item span { font-size:18px; line-height:1; } @media (max-width:780px) { .tsc-label-bottom-nav { grid-template-columns:repeat(5,minmax(0,1fr)); } .tsc-label-bottom-nav .tsc-bottom-item { min-width:0; } .tsc-label-bottom-nav .tsc-bottom-item span { line-height:1; } .tsc-label-more { position:fixed; inset:0; z-index:100; display:block; visibility:hidden; pointer-events:none; } .tsc-label-more.is-open { visibility:visible; pointer-events:auto; } .tsc-label-more-backdrop { position:absolute; inset:0; background:rgba(4,7,14,.68); backdrop-filter:blur(4px); opacity:0; transition:opacity .2s ease; } .tsc-label-more-sheet { position:absolute; left:0; right:0; bottom:0; max-height:min(78vh,680px); overflow:auto; padding:16px 14px calc(86px + env(safe-area-inset-bottom)); background:linear-gradient(180deg,#171326,#0d101b); border-top:1px solid var(--tsc-border); border-radius:22px 22px 0 0; box-shadow:0 -24px 70px rgba(0,0,0,.45); transform:translateY(100%); transition:transform .24s ease; } .tsc-label-more.is-open .tsc-label-more-backdrop { opacity:1; } .tsc-label-more.is-open .tsc-label-more-sheet { transform:translateY(0); } .tsc-label-more-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px; } .tsc-label-more-head strong { display:block; font-size:17px; color:var(--tsc-text); } .tsc-label-more-head small { display:block; color:var(--tsc-muted); font-size:10px; margin-top:3px; } .tsc-label-more-close { width:36px; height:36px; border:1px solid var(--tsc-border); border-radius:10px; background:var(--tsc-surface-2); color:var(--tsc-text); font-size:24px; line-height:1; cursor:pointer; } .tsc-label-more-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; } .tsc-more-link { min-height:58px; display:flex; align-items:center; gap:10px; padding:11px 12px; border:1px solid var(--tsc-border); border-radius:12px; background:var(--tsc-surface); color:var(--tsc-text); font:600 11px var(--tsc-font-body); text-align:left; cursor:pointer; } .tsc-more-link span { width:30px; height:30px; display:flex; align-items:center; justify-content:center; border-radius:9px; background:var(--tsc-violet-soft); color:var(--tsc-violet); font-size:15px; flex-shrink:0; } .tsc-more-link:active { transform:scale(.98); } body.tsc-label-more-open { overflow:hidden; } .tsc-label-dash .tsc-table-wrap { position:relative; } .tsc-label-dash .tsc-table-wrap::after { content:'Swipe left/right for more'; position:sticky; right:8px; bottom:4px; display:block; width:max-content; margin:3px 0 0 auto; padding:3px 7px; border-radius:999px; background:var(--tsc-surface-2); color:var(--tsc-muted); font-size:8px; pointer-events:none; } } @media (min-width:781px) { .tsc-label-more, .tsc-artist-more { display:none !important; } } @media (max-width:390px) { .tsc-label-more-grid { grid-template-columns:1fr; } } /* TunaSONGa Core 2.13.5 — mandatory label contract workflow + mobile More hardening */ .tsc-required-badge{display:inline-flex;align-items:center;margin-left:5px;padding:2px 6px;border-radius:999px;background:rgba(245,196,81,.14);border:1px solid rgba(245,196,81,.35);color:#f5c451;font-size:8px;font-weight:800;letter-spacing:.05em;vertical-align:middle} .tsc-contract-required-note{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;margin:14px 0 18px;border:1px solid rgba(245,196,81,.28);border-radius:14px;background:linear-gradient(135deg,rgba(245,196,81,.10),rgba(22,155,255,.05));color:var(--tsc-text)} .tsc-contract-required-note strong{display:block;color:#f5c451;font-size:12px;white-space:nowrap}.tsc-contract-required-note span{color:var(--tsc-muted);font-size:12px;line-height:1.5} .tsc-contract-action-card{margin-top:22px;padding:20px;border:1px solid var(--tsc-border);border-radius:16px;background:var(--tsc-surface-2)} .tsc-contract-action-card h2{margin:0 0 8px}.tsc-contract-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}.tsc-contract-actions .tsc-btn{flex:1 1 260px}.tsc-contract-reject-box{margin-top:14px;padding:14px;border:1px solid rgba(255,80,110,.28);border-radius:12px;background:rgba(255,80,110,.05)} .tsc-btn-danger{background:#8f243a!important;color:#fff!important;border:1px solid #c23b55!important} @media(max-width:780px){ .tsc-label-dash .tsc-more-link,.tsc-label-dash button.tsc-more-link,.tsc-dash .tsc-artist-more .tsc-more-link,.tsc-dash .tsc-artist-more button.tsc-more-link{appearance:none!important;-webkit-appearance:none!important;display:flex!important;width:100%!important;min-height:58px!important;box-sizing:border-box!important;margin:0!important;border:1px solid #29334a!important;border-radius:14px!important;background:#121a2b!important;color:#f4f6fb!important;font-family:inherit!important;font-size:12px!important;font-weight:700!important;line-height:1.2!important;text-align:left!important;box-shadow:0 5px 18px rgba(0,0,0,.18)!important} .tsc-label-dash .tsc-more-link span,.tsc-dash .tsc-artist-more .tsc-more-link span{background:rgba(116,92,255,.14)!important;color:#9d91ff!important;border-radius:10px!important} .tsc-label-dash .tsc-more-required{position:relative}.tsc-label-dash .tsc-more-required b{font-size:12px}.tsc-label-dash .tsc-more-required em{margin-left:auto;font-style:normal;font-size:8px;color:#f5c451;background:rgba(245,196,81,.12);border:1px solid rgba(245,196,81,.28);padding:4px 6px;border-radius:999px} .tsc-contract-required-note{display:block}.tsc-contract-required-note strong{margin-bottom:5px}.tsc-contract-actions{display:grid;grid-template-columns:1fr}.tsc-contract-actions .tsc-btn{width:100%!important} } /* TunaSONGa Core 2.14.0 — KYC registration-style UI + reliable upload progress */ .tsc-verification-gate .tsc-kyc-lock-card{max-width:760px;margin:28px auto;padding:28px;border-radius:22px;background:linear-gradient(145deg,#111827,#0b1220);border:1px solid rgba(255,255,255,.08);box-shadow:0 24px 70px rgba(0,0,0,.28)} .tsc-verification-gate .tsc-kicker{font-size:11px;font-weight:800;letter-spacing:.14em;color:var(--tsc-violet);text-transform:uppercase;margin-bottom:8px} .tsc-verification-gate .tsc-kyc-lock-card h2{font-size:28px;margin:0 0 8px}.tsc-verification-gate .tsc-kyc-lock-card>p{color:var(--tsc-muted);line-height:1.65} .tsc-kyc-gate-form-card{margin-top:22px;padding:24px;border-radius:18px;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.08)} .tsc-kyc-gate-form-card h3{margin-top:0;font-size:19px}.tsc-kyc-form .tsc-field input,.tsc-kyc-form .tsc-field select,.tsc-upload-form .tsc-field input,.tsc-upload-form .tsc-field select{min-height:48px;border-radius:12px;background:rgba(255,255,255,.045);border:1px solid var(--tsc-border);padding:12px 14px} .tsc-kyc-form input[type=file],.tsc-upload-form input[type=file]{padding:10px;cursor:pointer}.tsc-kyc-form input[type=file]::file-selector-button,.tsc-upload-form input[type=file]::file-selector-button{border:0;border-radius:8px;padding:9px 12px;margin-right:10px;background:var(--tsc-violet-soft);color:var(--tsc-text);font-weight:700;cursor:pointer} .tsc-upload-status{margin:14px 0 16px;padding:12px 14px;border:1px solid var(--tsc-border);border-radius:13px;background:rgba(255,255,255,.025)} .tsc-upload-connection{font-size:12px;color:var(--tsc-muted);margin-bottom:9px}.tsc-upload-connection.is-good{color:var(--tsc-green)}.tsc-upload-connection.is-slow{color:var(--tsc-amber)}.tsc-upload-connection.is-offline{color:var(--tsc-coral)} .tsc-upload-progress{display:block}.tsc-upload-progress-track{height:9px;background:var(--tsc-surface-2);border-radius:999px;overflow:hidden}.tsc-upload-progress-track i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--tsc-violet),var(--tsc-lime));border-radius:999px;transition:width .15s ease}.tsc-upload-progress-meta{display:flex;justify-content:space-between;gap:10px;margin-top:7px;font-size:11px;color:var(--tsc-muted)}.tsc-upload-progress-meta b{color:var(--tsc-text)} @media(max-width:520px){.tsc-verification-gate .tsc-kyc-lock-card{margin:10px 0;padding:18px;border-radius:16px}.tsc-verification-gate .tsc-kyc-lock-card h2{font-size:22px}.tsc-kyc-gate-form-card{padding:16px}.tsc-upload-status{padding:10px}.tsc-kyc-form .tsc-field input,.tsc-kyc-form .tsc-field select,.tsc-upload-form .tsc-field input,.tsc-upload-form .tsc-field select{min-height:46px;font-size:16px}} /* TunaSONGa Core 2.14.1 — professional post-action completion + redirect state */ .tsc-action-complete{position:fixed;inset:0;z-index:999999;display:flex;align-items:center;justify-content:center;padding:24px;background:rgba(5,9,18,.88);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);opacity:0;animation:tscCompleteIn .22s ease forwards} .tsc-action-complete-card{width:min(520px,100%);box-sizing:border-box;text-align:center;padding:36px 30px;border-radius:24px;border:1px solid rgba(255,255,255,.11);background:linear-gradient(145deg,#121b2d,#09111f);box-shadow:0 30px 100px rgba(0,0,0,.5);color:var(--tsc-text,#fff)} .tsc-action-complete-icon{width:64px;height:64px;margin:0 auto 16px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--tsc-violet,#745cff),var(--tsc-lime,#b7e45c));color:#07101a;font-size:30px;font-weight:900;box-shadow:0 12px 35px rgba(116,92,255,.28)} .tsc-action-complete-kicker{font-size:10px;font-weight:900;letter-spacing:.18em;text-transform:uppercase;color:var(--tsc-violet,#9d91ff);margin-bottom:8px}.tsc-action-complete-card h2{margin:0 0 10px;font-size:25px}.tsc-action-complete-card p{margin:0 auto 20px;max-width:430px;color:var(--tsc-muted,#9da8bb);font-size:13px;line-height:1.7}.tsc-action-complete-progress{height:4px;overflow:hidden;border-radius:999px;background:rgba(255,255,255,.08);margin:18px 0 10px}.tsc-action-complete-progress i{display:block;width:100%;height:100%;transform-origin:left;animation:tscCompleteProgress 1.8s linear forwards;background:linear-gradient(90deg,var(--tsc-violet,#745cff),var(--tsc-lime,#b7e45c))}.tsc-action-complete-card small{display:block;color:var(--tsc-muted,#9da8bb);font-size:11px}.tsc-action-complete-link{display:inline-block;margin-top:18px;color:#fff;font-size:12px;font-weight:800;text-decoration:none;padding:10px 16px;border-radius:10px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1)}.tsc-action-complete-open{overflow:hidden!important} @keyframes tscCompleteIn{to{opacity:1}}@keyframes tscCompleteProgress{from{transform:scaleX(0)}to{transform:scaleX(1)}} @media(max-width:520px){.tsc-action-complete{padding:16px}.tsc-action-complete-card{padding:28px 20px;border-radius:20px}.tsc-action-complete-card h2{font-size:21px}.tsc-action-complete-icon{width:56px;height:56px;font-size:26px}} /* TunaSONGa Core 2.14.2 — contract signing polish */ .tsc-contract-action-card .tsc-contract-actions .tsc-btn{min-height:52px;border-radius:12px;font-weight:800;letter-spacing:.02em;box-shadow:0 10px 24px rgba(0,0,0,.18)} .tsc-contract-action-card .tsc-btn-primary{background:linear-gradient(135deg,#147cff,#f0c34d);color:#fff;border:0} .tsc-contract-action-card .tsc-btn-danger{background:linear-gradient(135deg,#c9255b,#8d163f);color:#fff;border:0;min-height:48px} .tsc-contract-action-card .tsc-btn-outline{border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.06);color:#fff} .tsc-contract-view input,.tsc-contract-view textarea{width:100%;box-sizing:border-box;min-height:50px;border-radius:10px} .tsc-contract-view .tsc-field-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px} @media(max-width:640px){.tsc-contract-view .tsc-field-row{grid-template-columns:1fr}.tsc-contract-action-card .tsc-contract-actions{display:grid;grid-template-columns:1fr}.tsc-contract-action-card .tsc-contract-actions .tsc-btn{width:100%;min-height:56px}.tsc-contract-view h1{font-size:clamp(30px,8vw,46px);line-height:1.05}.tsc-contract-view h2{font-size:20px}.tsc-contract-view{overflow:hidden}} .tsc-contract-result{padding:22px;border-radius:18px;margin:0 0 20px;border:1px solid rgba(255,255,255,.12);background:linear-gradient(135deg,rgba(22,155,255,.12),rgba(245,196,81,.08))} .tsc-contract-result strong{display:block;font-size:18px;margin-bottom:6px} /* TunaSONGa Core 2.14.3 — secure contract access, premium signature UI & Artist CRM */ .tsc-contract-page{max-width:980px;margin:24px auto 60px;padding:0 18px;color:var(--tsc-text,#f4f6fb)} .tsc-contract-hero{position:relative;overflow:hidden;padding:30px;border-radius:26px;background:radial-gradient(circle at 90% 10%,rgba(20,124,255,.18),transparent 34%),linear-gradient(145deg,#121d31,#09111f);border:1px solid rgba(255,255,255,.09);box-shadow:0 28px 90px rgba(0,0,0,.28)} .tsc-contract-hero:after{content:"";position:absolute;right:-90px;bottom:-120px;width:300px;height:300px;border-radius:50%;background:rgba(240,195,77,.07);filter:blur(5px)} .tsc-contract-brand{display:flex;align-items:center;gap:9px;font-size:25px;font-weight:700;letter-spacing:-.03em}.tsc-contract-brand strong{color:#f0c34d}.tsc-contract-brand-mark{display:inline-flex;width:34px;height:34px;align-items:center;justify-content:center;border-radius:11px;background:linear-gradient(135deg,#147cff,#f0c34d);color:#07101a;font-size:17px;box-shadow:0 10px 28px rgba(20,124,255,.28)} .tsc-contract-kicker{display:block;margin-top:22px;color:#9d91ff;font-size:10px;font-weight:900;letter-spacing:.18em;text-transform:uppercase}.tsc-contract-hero h1{position:relative;z-index:1;margin:8px 0 8px;font-size:clamp(32px,5vw,56px);line-height:1.02;letter-spacing:-.045em}.tsc-contract-hero>p{position:relative;z-index:1;max-width:680px;margin:0;color:#9da8bb;line-height:1.7;font-size:14px} .tsc-contract-status-row{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:24px;flex-wrap:wrap}.tsc-contract-status{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);font-size:11px;font-weight:800}.tsc-contract-status i{width:8px;height:8px;border-radius:50%;background:#f0c34d;box-shadow:0 0 0 4px rgba(240,195,77,.1)}.tsc-contract-status-sent i{background:#2ca8ff}.tsc-contract-status-accepted i,.tsc-contract-status-active i{background:#61d68b}.tsc-contract-status-rejected i{background:#ff5577}.tsc-contract-id{font-size:11px;color:#8d98aa} .tsc-contract-meta-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:14px 0}.tsc-contract-meta-grid>div{padding:16px;border-radius:16px;background:#101827;border:1px solid rgba(255,255,255,.07)}.tsc-contract-meta-grid span{display:block;font-size:9px;font-weight:900;letter-spacing:.12em;color:#7f8aa0;margin-bottom:6px}.tsc-contract-meta-grid strong{font-size:13px;line-height:1.35} .tsc-contract-document{margin-top:14px;border-radius:22px;overflow:hidden;background:#f7f8fb;color:#172033;box-shadow:0 25px 70px rgba(0,0,0,.25)}.tsc-contract-document-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;padding:24px 26px;background:linear-gradient(135deg,#ffffff,#eef2f7);border-bottom:1px solid #dfe5ed}.tsc-contract-document-head .tsc-contract-kicker{margin:0;color:#65708a}.tsc-contract-document-head h2{margin:5px 0 0;font-size:22px;color:#172033}.tsc-contract-doc-badge{padding:7px 10px;border-radius:9px;background:#101827;color:#fff;font-size:10px;font-weight:900;white-space:nowrap}.tsc-contract-document-body{padding:28px 30px;font-size:14px;line-height:1.8}.tsc-contract-document-body h1{margin:0 0 18px;font-size:clamp(25px,4vw,38px);line-height:1.05;color:#111827}.tsc-contract-document-body h2{margin:28px 0 7px;font-size:16px;color:#111827}.tsc-contract-document-body p{margin:0 0 12px}.tsc-contract-document-body .tsc-sign-box{margin-top:28px;padding:20px;border:1px solid #d9e0e9;border-radius:14px;background:#f1f4f8}.tsc-contract-document-body .tsc-sign-box p{margin:0 0 16px}.tsc-contract-document-body .tsc-sign-box p:last-child{margin-bottom:0} .tsc-contract-sign-card{margin-top:16px;padding:26px;border-radius:22px;background:linear-gradient(145deg,#121d31,#0b1322);border:1px solid rgba(255,255,255,.09);box-shadow:0 25px 80px rgba(0,0,0,.25)}.tsc-contract-sign-heading .tsc-contract-step{display:inline-flex;padding:6px 9px;border-radius:8px;background:rgba(116,92,255,.14);color:#b0a7ff;font-size:9px;font-weight:900;letter-spacing:.12em}.tsc-contract-sign-heading h2{margin:12px 0 7px;font-size:25px}.tsc-contract-sign-heading p{margin:0;color:#9da8bb;font-size:13px;line-height:1.7;max-width:720px}.tsc-contract-sign-form{margin-top:20px}.tsc-contract-sign-form .tsc-field label{color:#dce3ef}.tsc-contract-sign-form input,.tsc-contract-sign-form textarea{background:rgba(255,255,255,.045)!important;color:#fff!important;border:1px solid rgba(255,255,255,.12)!important}.tsc-contract-sign-form input::placeholder,.tsc-contract-sign-form textarea::placeholder{color:#68758b}.tsc-contract-actions{display:grid;grid-template-columns:1.5fr 1fr;gap:12px;margin-top:18px}.tsc-contract-actions .tsc-btn{min-height:56px!important;border-radius:13px!important;font-weight:900!important;letter-spacing:.015em;box-shadow:0 12px 30px rgba(0,0,0,.22)!important}.tsc-contract-accept-btn{background:linear-gradient(135deg,#147cff,#f0c34d)!important;color:#fff!important;border:0!important}.tsc-contract-accept-btn span,.tsc-contract-actions .tsc-btn-outline span{margin-right:7px}.tsc-contract-actions .tsc-btn-outline{background:rgba(255,255,255,.045)!important;color:#fff!important;border:1px solid rgba(255,255,255,.15)!important}.tsc-contract-reject-box{margin-top:14px}.tsc-contract-reject-box .tsc-btn-danger{width:100%;min-height:52px;border-radius:12px!important;font-weight:900} .tsc-contract-state{display:flex;flex-direction:column;align-items:center;text-align:center;gap:9px;margin:16px 0;padding:30px 24px;border-radius:20px;background:linear-gradient(145deg,#111b2d,#0b1321);border:1px solid rgba(255,255,255,.09);box-shadow:0 20px 55px rgba(0,0,0,.2)}.tsc-contract-state strong{font-size:20px}.tsc-contract-state span{max-width:600px;color:#9da8bb;line-height:1.65;font-size:13px}.tsc-contract-state-icon{width:58px!important;height:58px!important;display:flex;align-items:center;justify-content:center;border-radius:50%;background:linear-gradient(135deg,#147cff,#f0c34d);color:#07101a!important;font-size:25px!important;font-weight:900;box-shadow:0 12px 35px rgba(20,124,255,.25)}.tsc-contract-state.is-error{border-color:rgba(255,85,119,.2)}.tsc-contract-state.is-warning{border-color:rgba(240,195,77,.2)}.tsc-contract-state.is-success{border-color:rgba(97,214,139,.2)}.tsc-contract-state .tsc-btn{margin-top:8px;min-height:50px;padding:0 22px;border-radius:12px} .tsc-contract-footer-note{display:flex;align-items:center;justify-content:center;gap:8px;margin:18px auto 0;max-width:700px;color:#7f8aa0;font-size:11px;text-align:center}.tsc-contract-footer-note p{margin:0}.tsc-contract-footer-note span{font-size:13px} .tsc-contract-list{display:grid;gap:14px}.tsc-contract-list-card{padding:22px}.tsc-contract-list-top{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}.tsc-contract-list-top .tsc-contract-kicker{margin:0 0 5px}.tsc-contract-list-top h2{margin:0;font-size:18px}.tsc-contract-list-meta{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0;color:var(--tsc-muted);font-size:11px}.tsc-contract-list-meta span{padding:6px 9px;border-radius:8px;background:rgba(255,255,255,.04);border:1px solid var(--tsc-border)}.tsc-contract-list-action .tsc-btn{min-height:48px;border-radius:11px;font-weight:800}.tsc-contract-empty{text-align:center;padding:45px 25px}.tsc-contract-empty-icon{width:58px;height:58px;margin:0 auto 15px;border-radius:16px;display:flex;align-items:center;justify-content:center;background:rgba(116,92,255,.12);color:#b0a7ff;font-size:24px}.tsc-contract-empty h2{margin:0 0 7px}.tsc-more-count{margin-left:auto!important;font-style:normal!important;font-size:9px!important;color:#fff!important;background:#745cff!important;padding:3px 7px!important;border-radius:999px!important} @media(max-width:760px){.tsc-contract-page{margin:8px auto 42px;padding:0 10px}.tsc-contract-hero{padding:22px 18px;border-radius:20px}.tsc-contract-hero h1{font-size:34px}.tsc-contract-meta-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.tsc-contract-document-head{padding:18px;display:block}.tsc-contract-doc-badge{display:inline-block;margin-top:10px}.tsc-contract-document-body{padding:20px 17px;font-size:13px;line-height:1.75}.tsc-contract-document-body h1{font-size:27px}.tsc-contract-sign-card{padding:20px 16px;border-radius:18px}.tsc-contract-actions{grid-template-columns:1fr}.tsc-contract-actions .tsc-btn{min-height:58px!important}.tsc-contract-list-top{display:block}.tsc-contract-list-top .tsc-contract-status{margin-top:12px}.tsc-contract-list-action .tsc-btn{width:100%}} @media(max-width:420px){.tsc-contract-meta-grid{grid-template-columns:1fr}.tsc-contract-status-row{align-items:flex-start;flex-direction:column}.tsc-contract-id{margin-left:2px}.tsc-contract-hero h1{font-size:30px}} /* 2.14.4 — Label Distribution workspace + premium contract presentation */ .tsc-distribution-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px} .tsc-distribution-card{overflow:hidden;border:1px solid rgba(255,255,255,.09);border-radius:22px;background:linear-gradient(145deg,#111b2b,#0a1220);box-shadow:0 20px 60px rgba(0,0,0,.22)} .tsc-distribution-art{position:relative;aspect-ratio:1.7/1;background:linear-gradient(145deg,#232b3c,#080d16);overflow:hidden} .tsc-distribution-art img{width:100%;height:100%;display:block;object-fit:cover} .tsc-distribution-art:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 48%,rgba(0,0,0,.72) 100%);pointer-events:none} .tsc-distribution-art>span:not(.tsc-distribution-status){position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#6f7b91;font-size:12px;font-weight:900;letter-spacing:.08em} .tsc-distribution-status{position:absolute!important;right:12px;top:12px;z-index:2;padding:8px 10px;border-radius:9px;background:rgba(10,16,27,.78);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(10px);font-size:10px;font-weight:900;color:#fff} .tsc-dist-status-distributed{background:linear-gradient(135deg,#0b7f53,#35d47d)} .tsc-dist-status-approved{background:linear-gradient(135deg,#147cff,#f0c34d)} .tsc-distribution-body{padding:18px} .tsc-distribution-body h2{margin:0;font-size:18px;line-height:1.2}.tsc-distribution-body p{margin:5px 0 0;color:#8d98aa;font-size:12px} .tsc-distribution-meta{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}.tsc-distribution-meta span{padding:8px 10px;border-radius:9px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);font-size:10px;color:#8d98aa}.tsc-distribution-meta b{color:#e9edf5} .tsc-distribution-actions{display:flex;align-items:center;min-height:48px}.tsc-distribution-actions .tsc-btn{width:100%;min-height:52px;border-radius:14px!important;font-weight:900!important;letter-spacing:.02em}.tsc-distribution-actions .tsc-btn-primary{background:linear-gradient(135deg,#147cff 0%,#197cff 46%,#f0c34d 100%)!important;box-shadow:0 14px 32px rgba(20,124,255,.22)!important}.tsc-distributed-pill{display:inline-flex;width:100%;justify-content:center;align-items:center;min-height:52px;border-radius:14px;background:linear-gradient(135deg,#0b7f53,#35d47d);color:#fff;font-size:12px;font-weight:900}.tsc-distribution-locked{width:100%;text-align:center;color:#78849a;font-size:11px;font-weight:800;padding:15px;border:1px solid rgba(255,255,255,.07);border-radius:13px;background:rgba(255,255,255,.025)} .tsc-distribution-empty{text-align:center;padding:55px 25px;grid-column:1/-1}.tsc-distribution-empty-icon{width:62px;height:62px;margin:0 auto 14px;border-radius:18px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#147cff,#f0c34d);color:#07101a;font-size:32px;font-weight:900;box-shadow:0 14px 35px rgba(20,124,255,.22)} .tsc-contract-page{min-height:calc(100vh - 80px);display:flex;flex-direction:column;justify-content:center;max-width:1080px;margin:0 auto;padding:42px 18px 70px;box-sizing:border-box}.tsc-contract-hero{width:100%;box-sizing:border-box;text-align:center}.tsc-contract-hero>p{margin-left:auto;margin-right:auto}.tsc-contract-status-row{justify-content:center}.tsc-contract-meta-grid{width:100%}.tsc-contract-document,.tsc-contract-sign-card{width:100%;box-sizing:border-box}.tsc-contract-sign-card{background:linear-gradient(145deg,#121d31,#0a1322);box-shadow:0 28px 90px rgba(0,0,0,.3)}.tsc-contract-actions .tsc-contract-accept-btn,.tsc-contract-actions .tsc-contract-reject-toggle{min-height:58px!important;border-radius:15px!important}.tsc-contract-actions .tsc-contract-reject-toggle{background:linear-gradient(145deg,#182235,#0d1421)!important;border:1px solid rgba(255,255,255,.13)!important;color:#fff!important;box-shadow:0 12px 30px rgba(0,0,0,.24)!important}.tsc-contract-actions .tsc-contract-reject-toggle:hover{border-color:rgba(240,195,77,.4)!important;transform:translateY(-1px)} @media(max-width:760px){.tsc-distribution-grid{grid-template-columns:1fr}.tsc-distribution-card{border-radius:18px}.tsc-contract-page{min-height:calc(100vh - 70px);padding:25px 10px 80px}.tsc-contract-hero{text-align:left}.tsc-contract-status-row{justify-content:flex-start}.tsc-contract-meta-grid{width:auto}} /* 2.14.5 — Release type + multi-track upload workspace */ .tsc-release-type-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:0 0 20px} .tsc-release-type-option{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-height:118px;padding:15px;border-radius:18px;border:1px solid rgba(255,255,255,.09);background:linear-gradient(145deg,#111b2b,#0a1220);cursor:pointer;text-align:center;transition:.18s ease;box-sizing:border-box} .tsc-release-type-option input{position:absolute;opacity:0;pointer-events:none} .tsc-release-type-option:has(input:checked){border-color:rgba(20,124,255,.75);background:linear-gradient(145deg,rgba(20,124,255,.18),rgba(240,195,77,.09));box-shadow:0 14px 35px rgba(20,124,255,.13);transform:translateY(-1px)} .tsc-release-type-icon{width:38px;height:38px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.06);color:#f0c34d;font-weight:900;font-size:15px} .tsc-release-type-option b{font-size:13px;letter-spacing:.08em}.tsc-release-type-option small{color:#7f8aa0;font-size:10px} .tsc-release-tracks-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:22px 0 10px}.tsc-release-tracks-head strong{display:block;font-size:14px}.tsc-release-tracks-head span{display:block;margin-top:3px;color:#7f8aa0;font-size:11px;line-height:1.5}.tsc-release-tracks-head .tsc-btn{min-height:42px;border-radius:12px;white-space:nowrap} .tsc-release-tracks{display:grid;gap:10px}.tsc-release-track-row{position:relative;display:grid;grid-template-columns:42px minmax(0,1fr) minmax(0,1.3fr) 36px;gap:12px;align-items:end;padding:14px;border-radius:16px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.025)} .tsc-track-number{width:36px;height:36px;border-radius:11px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#147cff,#f0c34d);color:#07101a;font-size:11px;font-weight:900;margin-bottom:2px}.tsc-release-track-row .tsc-field{margin:0}.tsc-remove-track{width:34px;height:34px;border:0;border-radius:10px;background:rgba(255,85,119,.12);color:#ff7b96;font-size:20px;cursor:pointer;margin-bottom:2px}.tsc-release-upload-card .tsc-form-actions{margin-top:18px}.tsc-release-upload-card .tsc-upload-status{margin-top:18px} @media(max-width:760px){.tsc-release-type-grid{grid-template-columns:1fr}.tsc-release-type-option{min-height:82px;display:grid;grid-template-columns:42px 1fr;grid-template-rows:auto auto;text-align:left;justify-content:stretch}.tsc-release-type-icon{grid-row:1/3}.tsc-release-type-option b{align-self:end}.tsc-release-type-option small{align-self:start}.tsc-release-tracks-head{align-items:flex-start;flex-direction:column}.tsc-release-tracks-head .tsc-btn{width:100%}.tsc-release-track-row{grid-template-columns:36px 1fr 32px}.tsc-release-track-row .tsc-field:nth-child(3){grid-column:2/4}.tsc-remove-track{grid-column:3;grid-row:1;width:32px}.tsc-track-number{width:32px;height:32px}} .tsc-contract-register-actions{display:flex;flex-wrap:wrap;gap:7px}.tsc-contract-register-actions .tsc-btn{min-height:38px;padding:8px 12px;border-radius:10px;font-size:10px;font-weight:900} .tsc-contract-modal{position:fixed;inset:0;z-index:99999;display:none;align-items:center;justify-content:center;padding:20px}.tsc-contract-modal.is-open{display:flex}.tsc-contract-modal-backdrop{position:absolute;inset:0;background:rgba(2,7,15,.78);backdrop-filter:blur(8px)}.tsc-contract-modal-card{position:relative;z-index:1;width:min(900px,100%);max-height:90vh;overflow:auto;border-radius:22px;background:#eef3f7;color:#172033;box-shadow:0 35px 100px rgba(0,0,0,.45)}.tsc-contract-modal-close{position:absolute;right:15px;top:12px;width:38px;height:38px;border:0;border-radius:12px;background:#172033;color:#fff;font-size:24px;cursor:pointer}.tsc-contract-modal-head{padding:22px 55px 18px 24px;background:linear-gradient(135deg,#ffffff,#e9eef4);border-bottom:1px solid #dce3eb}.tsc-contract-modal-head span{display:block;font-size:9px;font-weight:900;letter-spacing:.14em;color:#6f7b91}.tsc-contract-modal-head strong{display:block;margin-top:5px;font-size:20px}.tsc-contract-modal-head small{display:block;margin-top:5px;color:#6f7b91}.tsc-contract-modal-body{padding:24px;line-height:1.75}.tsc-contract-modal-body h1{font-size:30px;line-height:1.1}.tsc-contract-modal-body h2{font-size:16px;margin-top:25px}.tsc-contract-modal-body .tsc-sign-box{padding:18px;border-radius:14px;background:#fff;border:1px solid #d8e0e8} @media(max-width:640px){.tsc-contract-modal{padding:8px}.tsc-contract-modal-card{max-height:94vh;border-radius:18px}.tsc-contract-modal-body{padding:18px}.tsc-contract-modal-head{padding:18px 50px 15px 18px}.tsc-contract-register-actions .tsc-btn{flex:1 1 45%}} /* 2.14.6 — KYC gate upload feedback and submission state */ .tsc-kyc-submission-success{display:flex;flex-direction:column;gap:7px;margin:18px 0;padding:15px 16px;border-radius:14px;background:linear-gradient(135deg,rgba(183,228,92,.11),rgba(116,92,255,.09));border:1px solid rgba(183,228,92,.24);color:var(--tsc-text,#fff)} .tsc-kyc-submission-success strong{font-size:14px;color:var(--tsc-green,#b7e45c)} .tsc-kyc-submission-success span{font-size:12px;line-height:1.65;color:var(--tsc-muted,#9da8bb)} .tsc-upload-status.is-uploading{border-color:rgba(116,92,255,.38);box-shadow:0 8px 28px rgba(0,0,0,.16)} .tsc-upload-connection.is-slow{font-weight:700} /* 2.14.8 — Global per-file upload status */ .tsc-upload-file-list{display:grid;gap:7px;margin-top:10px}.tsc-upload-file-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 10px;border-radius:9px;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.06);font-size:11px}.tsc-upload-file-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--tsc-text,#fff)}.tsc-upload-file-state{flex:0 0 auto;color:var(--tsc-muted,#9da8bb);font-weight:700}.tsc-upload-status.is-uploading .tsc-upload-file-state{color:var(--tsc-amber,#f0c34d)}@media(max-width:520px){.tsc-upload-file-row{align-items:flex-start;flex-direction:column;gap:3px}.tsc-upload-file-state{font-size:10px}} /* TunaSONGa Core 2.16.7 — Unified CRM shell / remove duplicate WordPress page title * The WordPress page title is not part of the CRM UI. The portal owns its own * header, so Artist and Label CRM pages start directly with the TunaSONGa shell. */ body.tsc-crm-page .entry-title, body.tsc-crm-page .page-title, body.tsc-crm-page .wp-block-post-title, body.tsc-crm-page .elementor-page-title, body.tsc-crm-page .page-header, body.tsc-crm-page .entry-header, body.tsc-crm-page .post-header, body.tsc-crm-page .wp-block-group:has(> .wp-block-post-title) { display:none !important; } /* Fallback for themes that do not expose the expected body classes. * The selector is scoped to pages that actually contain a TunaSONGa CRM root. */ body:has(.tsc-dash) .entry-title, body:has(.tsc-dash) .page-title, body:has(.tsc-dash) .wp-block-post-title, body:has(.tsc-dash) .elementor-page-title, body:has(.tsc-dash) .elementor-widget-theme-post-title, body:has(.tsc-dash) .page-header, body:has(.tsc-dash) .entry-header, body:has(.tsc-dash) .post-header, body:has(.tsc-dash) .wp-block-group:has(> .wp-block-post-title) { display:none !important; } /* 2.16.8 — Hard-remove WordPress/block-theme page-title markup. * CRM pages must look like application dashboards, never like WordPress pages. * The actual CRM headings live inside .tsc-dash and are intentionally preserved. */ body.tsc-crm-page .entry-content > h1:first-child, body.tsc-crm-page .entry-content > h2:first-child, body.tsc-crm-page article > h1:first-child, body.tsc-crm-page article > h2:first-child, body.tsc-crm-page .wp-block-post-content > h1:first-child, body.tsc-crm-page .wp-block-post-content > h2:first-child, body.tsc-crm-page .content-area > h1:first-child, body.tsc-crm-page .content-area > h2:first-child { display:none !important; height:0 !important; min-height:0 !important; margin:0 !important; padding:0 !important; } body.tsc-crm-page .site-main > article > header, body.tsc-crm-page .site-main > .page-header { display:none !important; height:0 !important; min-height:0 !important; margin:0 !important; padding:0 !important; } body.tsc-crm-page .site-main, body.tsc-crm-page main#main, body.tsc-crm-page .content-area, body.tsc-crm-page .site-content { padding-top:0 !important; margin-top:0 !important; } body.tsc-crm-page .tsc-dash { margin-top:0; margin-bottom:0; max-width:none; border-radius:0; border-left:0; border-right:0; } .tsc-topbar-action { appearance:none; -webkit-appearance:none; border:0; border-radius:12px; padding:11px 18px; min-height:44px; background:linear-gradient(135deg,#147cff,#f0c34d); color:#fff; font-family:var(--tsc-font-body); font-size:13px; font-weight:800; cursor:pointer; box-shadow:0 10px 24px rgba(20,124,255,.22); white-space:nowrap; } .tsc-topbar-action:hover { opacity:.94; transform:translateY(-1px); } @media(max-width:780px){ .tsc-topbar-action { min-height:40px; padding:9px 13px; border-radius:11px; font-size:11px; } .tsc-topbar-user { gap:6px; } body.tsc-crm-page .tsc-dash { min-height:100vh; } } /* 2.16.9 — CRM application-shell spacing: no gap between the site header and CRM. * Artist and Label CRM pages must begin immediately after the main TunaSONGa header. */ body.tsc-crm-page .wp-site-blocks, body.tsc-crm-page .site, body.tsc-crm-page .site-container, body.tsc-crm-page .site-content, body.tsc-crm-page .content-area, body.tsc-crm-page .page-content, body.tsc-crm-page .entry-content, body.tsc-crm-page .site-main, body.tsc-crm-page main#main, body.tsc-crm-page article { margin-top:0 !important; padding-top:0 !important; } body.tsc-crm-page .tsc-dash { margin-top:0 !important; } \n/* TunaSONGa Label Operations Enhancement v2.17.3.5 */\n.tsc-ops-strip{margin:0 0 20px;padding:18px;border:1px solid rgba(255,255,255,.08);border-radius:18px;background:linear-gradient(135deg,rgba(20,34,58,.92),rgba(11,18,31,.92));box-shadow:0 12px 35px rgba(0,0,0,.12)}\n.tsc-ops-strip-head,.tsc-card-title-row{display:flex;align-items:center;justify-content:space-between;gap:14px}.tsc-ops-strip-head strong{display:block;font-size:17px}.tsc-ops-strip-head span{display:block;color:var(--tsc-muted,#9aa7b8);font-size:12px;margin-top:3px}.tsc-ops-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:14px}.tsc-ops-item{border:1px solid rgba(255,255,255,.07);background:rgba(255,255,255,.035);border-radius:14px;padding:13px;text-align:left;color:inherit;cursor:pointer}.tsc-ops-item b{display:block;font-size:25px;line-height:1.1}.tsc-ops-item span{display:block;margin-top:5px;font-size:12px;color:var(--tsc-muted,#9aa7b8)}.tsc-ops-card{text-align:left;cursor:pointer;border:1px solid rgba(255,255,255,.08);color:inherit}.tsc-ops-card .tsc-ops-icon{display:inline-flex;width:34px;height:34px;border-radius:10px;align-items:center;justify-content:center;background:rgba(78,138,255,.15);margin-bottom:12px;font-weight:700}.tsc-ops-card strong,.tsc-ops-card b,.tsc-ops-card small{display:block}.tsc-ops-card b{font-size:30px;margin:4px 0}.tsc-ops-card small{color:var(--tsc-muted,#9aa7b8)}.tsc-pipeline{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-top:14px}.tsc-pipeline div{padding:12px;border-radius:12px;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.06)}.tsc-pipeline span{display:block;font-size:11px;color:var(--tsc-muted,#9aa7b8)}.tsc-pipeline b{display:block;font-size:22px;margin-top:4px}.tsc-ops-list{margin:14px 0 0;padding-left:18px}.tsc-ops-list li{margin:9px 0}.tsc-empty-success{margin-top:14px;padding:14px;border-radius:12px;background:rgba(54,211,153,.08);color:#9ff0c9}.tsc-status-pill{display:inline-flex;padding:5px 9px;border-radius:999px;font-size:11px;font-weight:700;background:rgba(255,255,255,.08)}.tsc-status-pill.status-approved,.tsc-status-pill.status-distributed{background:rgba(54,211,153,.12);color:#9ff0c9}.tsc-status-pill.status-rejected,.tsc-status-pill.status-contract_rejected{background:rgba(255,82,82,.12);color:#ffb0b0}.tsc-status-pill.status-submitted{background:rgba(255,194,71,.12);color:#ffd88a}\n@media(max-width:900px){.tsc-ops-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.tsc-pipeline{grid-template-columns:repeat(2,minmax(0,1fr))}}\n@media(max-width:560px){.tsc-ops-strip-head,.tsc-card-title-row{align-items:flex-start;flex-direction:column}.tsc-ops-grid{grid-template-columns:1fr 1fr}.tsc-pipeline{grid-template-columns:1fr}.tsc-ops-strip .tsc-btn{width:100%}}\n /* TunaSONGa CRM Visual Theme v2.17.3.6 * Official palette derived from the approved TunaSONGa logo: * deep/navy blue + vivid blue + gold + white + dark neutrals. * Blue is the dominant structural color; gold is reserved for premium * accents, emphasis and high-value actions. Accessibility/status colors remain * distinct so meaning is never communicated by brand color alone. */ .tsc-dash { --tsc-bg: #071a4d; --tsc-surface: #0d2868; --tsc-surface-2: #123579; --tsc-border: rgba(255, 255, 255, 0.14); --tsc-text: #f8fbff; --tsc-muted: #b9c8e5; --tsc-violet: #087cff; --tsc-violet-soft: rgba(8, 124, 255, 0.18); --tsc-lime: #f5c400; --tsc-amber: #f5c400; --tsc-amber-soft: rgba(245, 196, 0, 0.16); --tsc-coral: #ff667d; --tsc-coral-soft: rgba(255, 102, 125, 0.15); --tsc-green: #39d98a; --tsc-green-soft: rgba(57, 217, 138, 0.15); } .tsc-dash a { color: #58a9ff; } .tsc-logged-out { background: radial-gradient(circle at 20% 20%, #123579, #071a4d 72%); } .tsc-topbar { background: linear-gradient(120deg, #061744, #0b2f7c 58%, #071a4d); } .tsc-brand-text em { color: #f5c400; } .tsc-wave i:nth-child(1), .tsc-wave i:nth-child(3) { background: #f5c400; } .tsc-avatar { background: linear-gradient(135deg, #087cff, #f5c400); color: #071a4d; } .tsc-sidenav { background: #061744; } .tsc-nav-item:hover { background: rgba(8,124,255,.13); } .tsc-nav-item.is-active { background: linear-gradient(90deg, rgba(8,124,255,.24), rgba(245,196,0,.10)); } .tsc-nav-item.is-active .tsc-nav-ico { background: #f5c400; } .tsc-nav-badge { background: #f5c400; color: #071a4d; } .tsc-btn-primary { background: linear-gradient(135deg, #087cff, #075dcc); color: #fff; } .tsc-btn-primary:hover { background: linear-gradient(135deg, #1687ff, #f5c400); color: #071a4d; } .tsc-btn-outline:hover { border-color: #f5c400; color: #f5c400; } .tsc-field input:focus, .tsc-field select:focus, .tsc-field textarea:focus { border-color: #087cff; box-shadow: 0 0 0 3px rgba(8,124,255,.18); } .tsc-pill.is-active { background: rgba(8,124,255,.16); border-color: #087cff; color: #fff; } .tsc-track-ico { background: rgba(8,124,255,.16); } .tsc-track-ico::after { color: #58a9ff; } .tsc-icon-btn:hover { background: rgba(8,124,255,.16); color: #58a9ff; } .tsc-stat-accent { border-color: #f5c400; box-shadow: 0 0 0 1px #f5c400 inset; } .tsc-stat-accent .tsc-stat-value { color: #f5c400; } .tsc-table-wrap::-webkit-scrollbar-thumb { background: #087cff; } .tsc-home-stat-icon { background: #087cff; } .tsc-source-pavarisk .tsc-home-stat-icon { background: #f5c400; color: #071a4d; } .tsc-home-alert-icon { background: rgba(245,196,0,.14); color: #f5c400; } .tsc-home-alert .tsc-btn { background: linear-gradient(135deg,#087cff,#f5c400); color:#071a4d; } .tsc-text-link { color: #58a9ff; } .tsc-support-icon { color: #f5c400; } .tsc-news-icon { color: #f5c400; } .tsc-brand-text span { color: #f5c400; } .tsc-logout-link { color: #f5c400; } .tsc-month-bar i { background: #087cff; } .tsc-verification-gate .tsc-kicker { color: #f5c400; } .tsc-kyc-form input[type=file]::file-selector-button, .tsc-upload-form input[type=file]::file-selector-button { background: rgba(8,124,255,.16); color: #fff; } .tsc-upload-progress-track i { background: linear-gradient(90deg,#087cff,#f5c400); } .tsc-action-complete-icon { background: linear-gradient(135deg,#087cff,#f5c400); box-shadow: 0 12px 35px rgba(8,124,255,.28); } .tsc-action-complete-kicker { color: #f5c400; } .tsc-action-complete-progress i { background: linear-gradient(90deg,#087cff,#f5c400); } .tsc-contract-required-note strong { color: #f5c400; } .tsc-contract-action-card .tsc-contract-actions .tsc-btn-primary { background: linear-gradient(135deg,#087cff,#f5c400); color:#071a4d; } .tsc-contract-kicker { color: #f5c400; } .tsc-contract-empty-icon { background: rgba(8,124,255,.12); color: #58a9ff; } .tsc-more-count { background: #f5c400 !important; color: #071a4d !important; } /* Mobile CRM accents: remove legacy pink/purple highlights. */ @media(max-width:780px){ .tsc-label-dash .tsc-more-link span,.tsc-dash .tsc-artist-more .tsc-more-link span{background:rgba(8,124,255,.14)!important;color:#58a9ff!important} .tsc-label-dash .tsc-more-required em{color:#f5c400;background:rgba(245,196,0,.12);border-color:rgba(245,196,0,.28)} .tsc-bottom-item.is-active { color:#f5c400; } } /* ====================================================================== * TunaSONGa CRM UI LOCK v2.17.3.7 * Official brand palette + accessible controls + CRM-only application shell * ====================================================================== */ .tsc-dash { --tsc-bg: #071a4a; --tsc-surface: #ffffff; --tsc-surface-2: #eef4ff; --tsc-border: #c8d7f2; --tsc-text: #0b1736; --tsc-muted: #53627f; --tsc-violet: #0757c9; --tsc-violet-soft: rgba(7, 87, 201, .12); --tsc-lime: #f4b900; --tsc-amber: #e6a800; --tsc-amber-soft: rgba(244,185,0,.15); --tsc-coral: #c92f4a; --tsc-coral-soft: rgba(201,47,74,.12); --tsc-green: #087a4b; --tsc-green-soft: rgba(8,122,75,.12); } /* The public site footer belongs to the public website, never to CRM apps. */ body.tsc-crm-page footer, body.tsc-crm-page .site-footer, body.tsc-crm-page .site-info, body.tsc-crm-page .footer, body.tsc-crm-page .elementor-location-footer, body.tsc-crm-page [data-elementor-type="footer"], body.tsc-crm-page .wp-block-template-part footer, body.tsc-crm-page .wp-block-template-part:has(footer) { display: none !important; } body.tsc-crm-page { background: #f4f7fc !important; } body.tsc-crm-page .site-content, body.tsc-crm-page .site-main, body.tsc-crm-page main#main, body.tsc-crm-page .content-area { margin-bottom: 0 !important; padding-bottom: 0 !important; } /* Strong, predictable form contrast. */ .tsc-dash .tsc-field select, .tsc-dash .tsc-field input[type=text], .tsc-dash .tsc-field input[type=url], .tsc-dash .tsc-field input[type=number], .tsc-dash .tsc-field input[type=email], .tsc-dash .tsc-field input[type=date], .tsc-dash .tsc-field input[type=file], .tsc-dash .tsc-field textarea { color: #0b1736 !important; background: #ffffff !important; border-color: #b9cbea !important; } .tsc-dash .tsc-field input::placeholder, .tsc-dash .tsc-field textarea::placeholder { color: #667594 !important; opacity: 1 !important; } .tsc-dash .tsc-field select:focus, .tsc-dash .tsc-field input:focus, .tsc-dash .tsc-field textarea:focus { border-color: #0757c9 !important; box-shadow: 0 0 0 3px rgba(7,87,201,.18) !important; } /* Accessible custom select. The native select remains the form's source of truth. */ .tsc-custom-select { position: relative; width: 100%; } .tsc-custom-select > select.tsc-native-select { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; opacity: 0 !important; pointer-events: none !important; } .tsc-custom-select-button { width: 100%; min-height: 44px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 13px; border: 1px solid #b9cbea; border-radius: 9px; background: #fff; color: #0b1736; font: 600 14px/1.35 var(--tsc-font-body); text-align: left; cursor: pointer; } .tsc-custom-select-button:hover { border-color: #0757c9; } .tsc-custom-select-button:focus-visible { outline: 3px solid rgba(7,87,201,.25); outline-offset: 1px; border-color: #0757c9; } .tsc-custom-select-button .tsc-select-arrow { color: #0757c9; font-size: 16px; flex: 0 0 auto; } .tsc-custom-select-button .tsc-select-placeholder { color: #667594; font-weight: 500; } .tsc-custom-select-menu { display: none; position: absolute; left: 0; right: 0; top: calc(100% + 6px); z-index: 10000; max-height: 300px; overflow-y: auto; padding: 6px; border: 1px solid #8eabe0; border-radius: 12px; background: #071a4a; box-shadow: 0 18px 42px rgba(3,20,55,.28); } .tsc-custom-select.is-open .tsc-custom-select-menu { display: block; } .tsc-custom-select-option { display: block; width: 100%; border: 0; border-radius: 8px; padding: 10px 11px; margin: 1px 0; background: transparent; color: #fff; font: 500 14px/1.35 var(--tsc-font-body); text-align: left; cursor: pointer; } .tsc-custom-select-option:hover, .tsc-custom-select-option:focus-visible { background: #0757c9; color: #fff; outline: none; } .tsc-custom-select-option.is-selected { background: #f4b900; color: #071a4a; font-weight: 800; } .tsc-custom-select-group { padding: 9px 11px 5px; color: #f4b900; font: 800 11px/1.2 var(--tsc-font-body); text-transform: uppercase; letter-spacing: .06em; } .tsc-custom-select-empty { padding: 12px; color: #dbe7ff; font-size: 13px; } /* Gold/blue brand hierarchy across CRM controls. */ .tsc-dash .tsc-btn-primary { background: linear-gradient(135deg,#0757c9,#0a72ef) !important; color: #fff !important; } .tsc-dash .tsc-btn-primary:hover { background: linear-gradient(135deg,#064aa9,#075fce) !important; } .tsc-dash .tsc-nav-item.is-active { background: linear-gradient(135deg,#f4b900,#ffd34f) !important; color: #071a4a !important; } .tsc-dash .tsc-nav-item.is-active .tsc-nav-ico { background: #0757c9 !important; } .tsc-dash .tsc-nav-item:hover { background: rgba(7,87,201,.10); color: #0b1736; } .tsc-dash .tsc-btn-outline:hover { border-color: #0757c9; color: #0757c9; } @media (max-width: 760px) { .tsc-custom-select-menu { max-height: 260px; } .tsc-custom-select-button { min-height: 48px; font-size: 16px; } .tsc-custom-select-option { padding: 12px; font-size: 16px; } } /* Label CRM application presentation: white content canvas, navy shell, gold actions. */ .tsc-label-dash { background:#f4f7fc !important; color:#0b1736; } .tsc-label-dash .tsc-main { background:#f4f7fc; } .tsc-label-dash .tsc-panel-head h1, .tsc-label-dash .tsc-card-title, .tsc-label-dash .tsc-section-title h2 { color:#0b1736; } .tsc-label-dash .tsc-sub { color:#53627f; } .tsc-label-dash .tsc-card, .tsc-label-dash .tsc-stat-card, .tsc-label-dash .tsc-analytics-card, .tsc-label-dash .tsc-analytics-stat { background:#fff; border-color:#d6e0ef; color:#0b1736; box-shadow:0 8px 24px rgba(7,26,74,.06); } .tsc-label-dash .tsc-ops-strip { background:linear-gradient(135deg,#0a2d78,#063c91); border-color:rgba(8,124,255,.22); } .tsc-label-dash .tsc-ops-item, .tsc-label-dash .tsc-pipeline div { background:rgba(255,255,255,.10); border-color:rgba(255,255,255,.16); color:#fff; } .tsc-label-dash .tsc-ops-item span, .tsc-label-dash .tsc-pipeline span { color:#dbe7ff; } .tsc-label-dash .tsc-table th { color:#53627f; } .tsc-label-dash .tsc-table td { color:#0b1736; } .tsc-label-dash .tsc-home-stat, .tsc-label-dash .tsc-release-row, .tsc-label-dash .tsc-support-card, .tsc-label-dash .tsc-news-card { background:#fff; border-color:#d6e0ef; color:#0b1736; } .tsc-label-dash .tsc-home-alert { background:#f8fbff; border-color:#d6e0ef; color:#0b1736; } .tsc-label-dash .tsc-home-alert .tsc-sub, .tsc-label-dash .tsc-release-row small { color:#53627f; } /* TunaSONGa Core v2.17.3.8 — approved color hierarchy / readability pass. * Presentation only: no CRM business logic or stored status values changed. */ #tsc-label-dash { background:#071a4d !important; color:#f8fbff !important; } #tsc-label-dash .tsc-main { background:#071a4d !important; color:#f8fbff !important; } #tsc-label-dash .tsc-panel-head h1, #tsc-label-dash .tsc-panel-head h2, #tsc-label-dash .tsc-card-title, #tsc-label-dash .tsc-section-title h2 { color:#ffffff !important; } #tsc-label-dash .tsc-panel-head .tsc-sub, #tsc-label-dash .tsc-sub { color:#dbe7ff !important; } #tsc-label-dash .tsc-kicker { color:#f5c400 !important; } /* White content surfaces remain the approved mobile/CRM card treatment. */ #tsc-label-dash .tsc-card, #tsc-label-dash .tsc-stat-card, #tsc-label-dash .tsc-analytics-card, #tsc-label-dash .tsc-analytics-stat, #tsc-label-dash .tsc-home-stat, #tsc-label-dash .tsc-release-row, #tsc-label-dash .tsc-support-card, #tsc-label-dash .tsc-news-card, #tsc-label-dash .tsc-home-alert { background:#ffffff !important; border-color:#d6e0ef !important; color:#0b1736 !important; box-shadow:0 8px 24px rgba(7,26,74,.08); } #tsc-label-dash .tsc-card-title, #tsc-label-dash .tsc-stat-value, #tsc-label-dash .tsc-home-stat strong, #tsc-label-dash .tsc-release-row strong, #tsc-label-dash .tsc-support-card strong, #tsc-label-dash .tsc-news-card strong { color:#0b1736 !important; } #tsc-label-dash .tsc-card .tsc-sub, #tsc-label-dash .tsc-release-row span, #tsc-label-dash .tsc-release-row small, #tsc-label-dash .tsc-news-card p, #tsc-label-dash .tsc-news-card small, #tsc-label-dash .tsc-home-alert .tsc-sub { color:#53627f !important; } /* Action Center: dark blue surface, deliberately high-contrast text. */ #tsc-label-dash .tsc-ops-strip { background:linear-gradient(135deg,#0a2d78,#063c91) !important; border-color:rgba(8,124,255,.28) !important; } #tsc-label-dash .tsc-ops-strip-head strong { color:#ffffff !important; } #tsc-label-dash .tsc-ops-strip-head span { color:#dbe7ff !important; } #tsc-label-dash .tsc-ops-strip .tsc-btn-outline { background:#ffffff !important; color:#0b1736 !important; border-color:#ffffff !important; } #tsc-label-dash .tsc-ops-strip .tsc-btn-outline:hover { background:#f5c400 !important; border-color:#f5c400 !important; color:#071a4d !important; } #tsc-label-dash .tsc-ops-item, #tsc-label-dash .tsc-pipeline div { background:rgba(255,255,255,.10) !important; border-color:rgba(255,255,255,.22) !important; color:#ffffff !important; } #tsc-label-dash .tsc-ops-item b, #tsc-label-dash .tsc-pipeline b { color:#ffffff !important; } #tsc-label-dash .tsc-ops-item span, #tsc-label-dash .tsc-pipeline span { color:#dbe7ff !important; } #tsc-label-dash .tsc-ops-item:focus-visible, #tsc-label-dash .tsc-pipeline div:focus-visible { outline:3px solid #f5c400; outline-offset:2px; } /* Navigation hierarchy: gold active, light inactive, no dark-on-dark text. */ #tsc-label-dash .tsc-nav-item { color:#eef4ff !important; } #tsc-label-dash .tsc-nav-item:hover { background:rgba(8,124,255,.18) !important; color:#ffffff !important; } #tsc-label-dash .tsc-nav-item.is-active { background:linear-gradient(135deg,#f4b900,#ffd34f) !important; color:#071a4d !important; } #tsc-label-dash .tsc-nav-item.is-active .tsc-nav-ico { background:#0757c9 !important; } #tsc-label-dash .tsc-nav-badge { background:#f5c400 !important; color:#071a4d !important; } /* Tables and data: dark text on white surfaces. */ #tsc-label-dash .tsc-table th { color:#53627f !important; } #tsc-label-dash .tsc-table td { color:#0b1736 !important; } #tsc-label-dash .tsc-table td small { color:#53627f !important; } /* Form controls: preserve the white treatment and strong contrast. */ #tsc-label-dash .tsc-field label { color:#0b1736 !important; } #tsc-label-dash .tsc-field input, #tsc-label-dash .tsc-field select, #tsc-label-dash .tsc-field textarea { color:#0b1736 !important; background:#ffffff !important; border-color:#b9cbea !important; } #tsc-label-dash .tsc-field input::placeholder, #tsc-label-dash .tsc-field textarea::placeholder { color:#667594 !important; opacity:1 !important; } /* Mobile bottom navigation: no legacy pink; active state is TunaSONGa gold. */ #tsc-label-dash .tsc-bottom-nav { background:rgba(6,20,56,.98) !important; border-top-color:rgba(219,231,255,.22) !important; } #tsc-label-dash .tsc-bottom-item { color:#dbe7ff !important; } #tsc-label-dash .tsc-bottom-item.is-active { color:#f5c400 !important; } #tsc-label-dash .tsc-bottom-item:focus-visible { outline:3px solid #f5c400; outline-offset:-3px; } /* Primary actions and publish CTA. */ #tsc-label-dash .tsc-btn-primary { background:linear-gradient(135deg,#0757c9,#0a72ef) !important; color:#ffffff !important; } #tsc-label-dash .tsc-btn-primary:hover { background:linear-gradient(135deg,#064aa9,#075fce) !important; } #tsc-label-dash .tsc-btn-primary:focus-visible { outline:3px solid #f5c400 !important; outline-offset:2px; } /* Never rely on color alone for status: retain text/status labels and icons. */ #tsc-label-dash .tsc-status-pill.status-approved, #tsc-label-dash .tsc-status-pill.status-distributed { color:#12633f !important; background:#e8f8ef !important; } #tsc-label-dash .tsc-status-pill.status-rejected, #tsc-label-dash .tsc-status-pill.status-contract_rejected { color:#9d1c2f !important; background:#fdebed !important; } #tsc-label-dash .tsc-status-pill.status-submitted { color:#735100 !important; background:#fff5d6 !important; } /* TunaSONGa Core v2.17.3.9 — Artist CRM official brand parity. * Applies the locked TunaSONGa Blue/Gold readability system to Artist CRM too. * Presentation-only: existing CRM workflows, data, statuses and permissions are unchanged. */ #tsc-dash:not(.tsc-label-dash) { --tsc-bg:#071a4a; --tsc-surface:#ffffff; --tsc-surface-2:#eef4ff; --tsc-border:#c8d7f2; --tsc-text:#0b1736; --tsc-muted:#53627f; --tsc-violet:#0757c9; --tsc-violet-soft:rgba(7,87,201,.12); --tsc-lime:#f4b900; --tsc-amber:#e6a800; } #tsc-dash:not(.tsc-label-dash) { background:#071a4a !important; color:#f8fbff !important; } #tsc-dash:not(.tsc-label-dash) .tsc-topbar { background:linear-gradient(120deg,#061744,#0b2f7c 58%,#071a4d) !important; border-bottom-color:rgba(255,255,255,.16) !important; } #tsc-dash:not(.tsc-label-dash) .tsc-brand-text { color:#fff !important; } #tsc-dash:not(.tsc-label-dash) .tsc-brand-text em { color:#f5c400 !important; } #tsc-dash:not(.tsc-label-dash) .tsc-wave i { background:#087cff !important; } #tsc-dash:not(.tsc-label-dash) .tsc-wave i:nth-child(1), #tsc-dash:not(.tsc-label-dash) .tsc-wave i:nth-child(3) { background:#f5c400 !important; } #tsc-dash:not(.tsc-label-dash) .tsc-avatar { background:linear-gradient(135deg,#087cff,#f5c400) !important; color:#071a4d !important; } #tsc-dash:not(.tsc-label-dash) .tsc-sidenav { background:#061744 !important; border-color:rgba(255,255,255,.14) !important; } #tsc-dash:not(.tsc-label-dash) .tsc-nav-item { color:#eef4ff !important; } #tsc-dash:not(.tsc-label-dash) .tsc-nav-item:hover { background:rgba(8,124,255,.18) !important; color:#fff !important; } #tsc-dash:not(.tsc-label-dash) .tsc-nav-item.is-active { background:linear-gradient(135deg,#f4b900,#ffd34f) !important; color:#071a4d !important; } #tsc-dash:not(.tsc-label-dash) .tsc-nav-item.is-active .tsc-nav-ico { background:#0757c9 !important; } #tsc-dash:not(.tsc-label-dash) .tsc-nav-badge { background:#f5c400 !important; color:#071a4d !important; } #tsc-dash:not(.tsc-label-dash) .tsc-main { background:#071a4a !important; color:#f8fbff !important; } #tsc-dash:not(.tsc-label-dash) .tsc-panel-head h1, #tsc-dash:not(.tsc-label-dash) .tsc-home-section-head h2 { color:#fff !important; } #tsc-dash:not(.tsc-label-dash) .tsc-sub, #tsc-dash:not(.tsc-label-dash) .tsc-eyebrow { color:#dbe7ff !important; } #tsc-dash:not(.tsc-label-dash) .tsc-text-link { color:#58a9ff !important; } #tsc-dash:not(.tsc-label-dash) .tsc-card, #tsc-dash:not(.tsc-label-dash) .tsc-stat-card, #tsc-dash:not(.tsc-label-dash) .tsc-home-stat, #tsc-dash:not(.tsc-label-dash) .tsc-release-row, #tsc-dash:not(.tsc-label-dash) .tsc-support-card, #tsc-dash:not(.tsc-label-dash) .tsc-news-card { background:#fff !important; border-color:#d6e0ef !important; color:#0b1736 !important; box-shadow:0 8px 24px rgba(7,26,74,.08); } #tsc-dash:not(.tsc-label-dash) .tsc-card h2, #tsc-dash:not(.tsc-label-dash) .tsc-card h3, #tsc-dash:not(.tsc-label-dash) .tsc-card-title, #tsc-dash:not(.tsc-label-dash) .tsc-home-stat strong, #tsc-dash:not(.tsc-label-dash) .tsc-release-row strong, #tsc-dash:not(.tsc-label-dash) .tsc-support-card strong, #tsc-dash:not(.tsc-label-dash) .tsc-news-card strong { color:#0b1736 !important; } #tsc-dash:not(.tsc-label-dash) .tsc-home-stat-copy span, #tsc-dash:not(.tsc-label-dash) .tsc-release-copy span, #tsc-dash:not(.tsc-label-dash) .tsc-support-card small, #tsc-dash:not(.tsc-label-dash) .tsc-news-card p, #tsc-dash:not(.tsc-label-dash) .tsc-news-card small { color:#53627f !important; } #tsc-dash:not(.tsc-label-dash) .tsc-home-stat-icon { background:#087cff !important; color:#fff !important; } #tsc-dash:not(.tsc-label-dash) .tsc-source-pavarisk .tsc-home-stat-icon { background:#f5c400 !important; color:#071a4d !important; } #tsc-dash:not(.tsc-label-dash) .tsc-source-dsp .tsc-home-stat-icon { background:#0757c9 !important; color:#fff !important; } #tsc-dash:not(.tsc-label-dash) .tsc-home-alert { background:#fff !important; border-color:#d6e0ef !important; color:#0b1736 !important; } #tsc-dash:not(.tsc-label-dash) .tsc-home-alert-icon { background:rgba(245,196,0,.14) !important; color:#a56f00 !important; } #tsc-dash:not(.tsc-label-dash) .tsc-home-alert-copy p { color:#53627f !important; } #tsc-dash:not(.tsc-label-dash) .tsc-home-alert .tsc-btn { background:linear-gradient(135deg,#087cff,#f5c400) !important; color:#071a4d !important; } #tsc-dash:not(.tsc-label-dash) .tsc-support-icon, #tsc-dash:not(.tsc-label-dash) .tsc-news-icon { color:#0757c9 !important; } #tsc-dash:not(.tsc-label-dash) .tsc-field label { color:#0b1736 !important; } #tsc-dash:not(.tsc-label-dash) .tsc-field input, #tsc-dash:not(.tsc-label-dash) .tsc-field select, #tsc-dash:not(.tsc-label-dash) .tsc-field textarea { color:#0b1736 !important; background:#fff !important; border-color:#b9cbea !important; } #tsc-dash:not(.tsc-label-dash) .tsc-field input::placeholder, #tsc-dash:not(.tsc-label-dash) .tsc-field textarea::placeholder { color:#667594 !important; opacity:1 !important; } #tsc-dash:not(.tsc-label-dash) .tsc-field input:focus, #tsc-dash:not(.tsc-label-dash) .tsc-field select:focus, #tsc-dash:not(.tsc-label-dash) .tsc-field textarea:focus { border-color:#0757c9 !important; box-shadow:0 0 0 3px rgba(7,87,201,.18) !important; } #tsc-dash:not(.tsc-label-dash) .tsc-btn-primary { background:linear-gradient(135deg,#0757c9,#0a72ef) !important; color:#fff !important; } #tsc-dash:not(.tsc-label-dash) .tsc-btn-primary:hover { background:linear-gradient(135deg,#064aa9,#f5c400) !important; color:#071a4d !important; } #tsc-dash:not(.tsc-label-dash) .tsc-btn-outline { background:#fff !important; color:#0b1736 !important; border-color:#b9cbea !important; } #tsc-dash:not(.tsc-label-dash) .tsc-btn-outline:hover { border-color:#0757c9 !important; color:#0757c9 !important; } #tsc-dash:not(.tsc-label-dash) .tsc-pill { background:#eef4ff !important; border-color:#c8d7f2 !important; color:#53627f !important; } #tsc-dash:not(.tsc-label-dash) .tsc-pill.is-active { background:rgba(7,87,201,.12) !important; border-color:#0757c9 !important; color:#0b1736 !important; } #tsc-dash:not(.tsc-label-dash) .tsc-table th { color:#53627f !important; } #tsc-dash:not(.tsc-label-dash) .tsc-table td { color:#0b1736 !important; } #tsc-dash:not(.tsc-label-dash) .tsc-table td small { color:#53627f !important; } #tsc-dash:not(.tsc-label-dash) .tsc-stat-accent { border-color:#f5c400 !important; box-shadow:0 0 0 1px #f5c400 inset !important; } #tsc-dash:not(.tsc-label-dash) .tsc-stat-accent .tsc-stat-value { color:#a56f00 !important; } #tsc-dash:not(.tsc-label-dash) .tsc-icon-btn:hover { background:rgba(7,87,201,.12) !important; color:#0757c9 !important; } #tsc-dash:not(.tsc-label-dash) .tsc-bottom-nav { background:rgba(6,20,56,.98) !important; border-top-color:rgba(219,231,255,.22) !important; } #tsc-dash:not(.tsc-label-dash) .tsc-bottom-item { color:#dbe7ff !important; } #tsc-dash:not(.tsc-label-dash) .tsc-bottom-item.is-active { color:#f5c400 !important; } #tsc-dash:not(.tsc-label-dash) .tsc-bottom-item:focus-visible { outline:3px solid #f5c400 !important; outline-offset:-3px; } #tsc-dash:not(.tsc-label-dash) .tsc-logout-link { color:#f5c400 !important; } #tsc-dash:not(.tsc-label-dash) .tsc-kyc-pill { background:#eef4ff !important; color:#53627f !important; } #tsc-dash:not(.tsc-label-dash) .tsc-kyc-pill.tsc-kyc-approved { background:#e8f8ef !important; color:#087a4b !important; } #tsc-dash:not(.tsc-label-dash) .tsc-kyc-pill.tsc-kyc-pending { background:#fff5d6 !important; color:#735100 !important; } #tsc-dash:not(.tsc-label-dash) .tsc-kyc-pill.tsc-kyc-rejected { background:#fdebed !important; color:#9d1c2f !important; } @media(max-width:780px){ #tsc-dash:not(.tsc-label-dash) { background:#071a4a !important; padding-bottom:72px; } #tsc-dash:not(.tsc-label-dash) .tsc-main { background:#071a4a !important; } #tsc-dash:not(.tsc-label-dash) .tsc-home-stat, #tsc-dash:not(.tsc-label-dash) .tsc-release-row, #tsc-dash:not(.tsc-label-dash) .tsc-support-card, #tsc-dash:not(.tsc-label-dash) .tsc-news-card { background:#fff !important; } #tsc-dash:not(.tsc-label-dash) .tsc-home-section-head h2 { color:#fff !important; } #tsc-dash:not(.tsc-label-dash) .tsc-home-stat-copy span { color:#53627f !important; } #tsc-dash:not(.tsc-label-dash) .tsc-home-stat-copy strong { color:#0b1736 !important; } #tsc-dash:not(.tsc-label-dash) .tsc-contract-list-card h2, #tsc-dash:not(.tsc-label-dash) .tsc-contract-empty h2 { color:#0b1736 !important; } } /* ====================================================================== * TunaSONGa Core v2.17.3.10 — Global CRM Data Containment & Readability * Applies equally to Artist CRM and Label CRM. Presentation-only. * ====================================================================== */ #tsc-dash .tsc-analytics-card, #tsc-dash .tsc-analytics-stat { background:#fff !important; border-color:#d6e0ef !important; color:#0b1736 !important; box-shadow:0 8px 24px rgba(7,26,74,.08); min-width:0; overflow:hidden; } #tsc-dash .tsc-analytics-stat span, #tsc-dash .tsc-analytics-stat strong { color:#0b1736 !important; } #tsc-dash .tsc-analytics-stat span { color:#53627f !important; } #tsc-dash .tsc-analytics-stat strong { display:block; margin-top:8px; color:#0757c9 !important; font-size:clamp(20px,2.3vw,28px) !important; line-height:1.18 !important; font-weight:800 !important; overflow-wrap:anywhere; word-break:normal; min-width:0; } #tsc-dash .tsc-analytics-stat:nth-child(3) strong { color:#a56f00 !important; } #tsc-dash .tsc-analytics-stat:nth-child(4) strong { color:#0b1736 !important; } #tsc-dash .tsc-analytics-card .tsc-section-title h2 { color:#0b1736 !important; } #tsc-dash .tsc-analytics-card .tsc-section-title span { color:#53627f !important; } #tsc-dash .tsc-analytics-card .tsc-arow { color:#0b1736; min-width:0; } #tsc-dash .tsc-analytics-card .tsc-arow span { min-width:0; overflow-wrap:anywhere; } #tsc-dash .tsc-analytics-card .tsc-arow span strong { color:#0b1736 !important; overflow-wrap:anywhere; } #tsc-dash .tsc-analytics-card .tsc-arow span:last-child { color:#0757c9; font-weight:700; } #tsc-dash .tsc-analytics-card .tsc-source-row, #tsc-dash .tsc-analytics-card .tsc-territory-row { min-width:0; } #tsc-dash .tsc-analytics-card .tsc-source-row > *, #tsc-dash .tsc-analytics-card .tsc-territory-row > * { min-width:0; overflow-wrap:anywhere; } #tsc-dash .tsc-analytics-card .tsc-source-row strong, #tsc-dash .tsc-analytics-card .tsc-territory-row span { color:#0757c9; } #tsc-dash .tsc-month-value { color:#53627f !important; max-width:100%; overflow-wrap:anywhere; text-align:center; } /* Global containment rule for dynamic CRM card data. */ #tsc-dash .tsc-card, #tsc-dash .tsc-stat-card, #tsc-dash .tsc-home-stat, #tsc-dash .tsc-release-row, #tsc-dash .tsc-support-card, #tsc-dash .tsc-news-card, #tsc-dash .tsc-ops-item, #tsc-dash .tsc-pipeline > div { min-width:0; max-width:100%; } #tsc-dash .tsc-stat-value, #tsc-dash .tsc-home-stat-copy strong, #tsc-dash .tsc-release-copy strong, #tsc-dash .tsc-support-card strong, #tsc-dash .tsc-news-card strong, #tsc-dash .tsc-ops-item b, #tsc-dash .tsc-pipeline b { overflow-wrap:anywhere; word-break:normal; max-width:100%; } #tsc-dash .tsc-home-stat-copy, #tsc-dash .tsc-release-copy, #tsc-dash .tsc-support-card > span:nth-child(2) { min-width:0; } /* Financial/analytics values must remain legible and contained on narrow screens. */ @media (max-width:560px) { #tsc-dash .tsc-analytics-stat { padding:16px !important; } #tsc-dash .tsc-analytics-stat strong { font-size:clamp(17px,5vw,22px) !important; line-height:1.2 !important; } #tsc-dash .tsc-analytics-stat span { font-size:11px !important; line-height:1.35; } } @media (max-width:360px) { #tsc-dash .tsc-analytics-stats { gap:8px; } #tsc-dash .tsc-analytics-stat { padding:13px !important; } #tsc-dash .tsc-analytics-stat strong { font-size:17px !important; } } /* ====================================================================== * TunaSONGa Core v2.17.3.11 — Unified Logged-In App Shell * Visual-only shell: canonical CRM navigation, responsive header and * account identity. Existing CRM workflows remain unchanged. * ====================================================================== */ .tsc-dash { --tsc-blue:#0757c9; --tsc-bright:#00b2ff; --tsc-gold:#ffc107; --tsc-deep-gold:#ffa000; --tsc-navy:#0a1b38; --tsc-ink:#0b1736; --tsc-light:#dbe7ff; --tsc-muted-light:#9eb1d1; max-width:1440px; width:100%; margin:0 auto; border:0; border-radius:0; overflow:visible; background:var(--tsc-navy); } .tsc-app-header { position:sticky; top:0; z-index:80; min-height:82px; padding:10px 18px; gap:18px; background:linear-gradient(110deg,#0a1b38 0%,#0757c9 52%,#0a2d70 100%); border-bottom:2px solid rgba(255,193,7,.75); box-shadow:0 8px 30px rgba(0,0,0,.18); } .tsc-app-brand-wrap{display:flex;align-items:center;gap:12px;flex:0 0 auto;min-width:260px} .tsc-app-logo{display:flex;align-items:center;max-width:270px;height:60px;padding:4px 10px;border:1px solid rgba(255,255,255,.10);border-radius:12px;background:rgba(255,255,255,.04)} .tsc-app-logo img{display:block;width:100%;height:auto;max-height:54px;object-fit:contain} .tsc-app-menu-toggle{display:none;width:42px;height:42px;border:1px solid rgba(255,255,255,.22);border-radius:11px;background:rgba(5,22,57,.35);color:#fff;font-size:21px;cursor:pointer} .tsc-app-search{flex:1;min-width:180px;max-width:500px;height:46px;display:flex;align-items:center;gap:10px;padding:0 14px;border:1px solid rgba(255,255,255,.12);border-radius:13px;background:rgba(5,22,57,.48);color:#fff} .tsc-app-search span{font-size:25px;line-height:1;color:#dbe7ff} .tsc-app-search input{width:100%;border:0!important;outline:0!important;background:transparent!important;color:#fff!important;font:500 13px var(--tsc-font-body)!important;box-shadow:none!important} .tsc-app-search input::placeholder{color:#b9c9e3!important;opacity:1} .tsc-app-actions{position:relative;display:flex;align-items:center;justify-content:flex-end;gap:10px;min-width:0} .tsc-app-icon-btn{position:relative;width:42px;height:42px;border:0;border-radius:11px;background:transparent;color:#fff;font-size:21px;cursor:pointer} .tsc-app-icon-btn:hover{background:rgba(255,255,255,.10)} .tsc-app-icon-btn b{position:absolute;top:0;right:0;min-width:17px;height:17px;padding:0 4px;border-radius:99px;background:var(--tsc-gold);color:#0b1736;font:800 9px/17px var(--tsc-font-body)} .tsc-withdraw-head{border:0;border-radius:11px;padding:11px 17px;background:linear-gradient(135deg,#0757c9 35%,#ffc107 100%);color:#fff;font:700 12px var(--tsc-font-body);cursor:pointer;white-space:nowrap} .tsc-account-trigger{display:flex;align-items:center;gap:9px;min-width:180px;border:0;background:transparent;color:#fff;text-align:left;cursor:pointer;padding:4px 5px;border-radius:12px} .tsc-account-trigger:hover{background:rgba(255,255,255,.08)} .tsc-account-trigger .tsc-avatar{width:43px;height:43px;background:var(--tsc-gold);color:#0b1736;flex:0 0 43px} .tsc-account-copy{display:flex;flex-direction:column;min-width:0;line-height:1.12} .tsc-account-copy small{font-size:9px;color:#dbe7ff}.tsc-account-copy strong{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tsc-account-copy em{font-style:normal;color:var(--tsc-gold);font-size:10px;font-weight:700;margin-top:3px} .tsc-account-chevron{font-size:18px;color:#dbe7ff;margin-left:auto} .tsc-account-menu{position:absolute;right:0;top:56px;width:210px;padding:8px;border:1px solid #cbd8eb;border-radius:14px;background:#fff;box-shadow:0 18px 45px rgba(4,18,45,.25);z-index:100} .tsc-account-menu-item{display:block;width:100%;padding:11px 12px;border:0;border-radius:9px;background:transparent;color:#0b1736;text-decoration:none;font:600 12px var(--tsc-font-body);text-align:left;cursor:pointer} .tsc-account-menu-item:hover{background:#eef4ff;color:#0757c9}.tsc-account-logout{color:#a51f35!important} .tsc-sidenav{background:linear-gradient(180deg,#071a4a,#0a1b38)!important;border-right:1px solid rgba(219,231,255,.18)!important;width:250px!important;padding:18px 14px!important;position:sticky;top:82px;height:calc(100vh - 82px);overflow:auto} .tsc-nav-item{color:#dbe7ff!important}.tsc-nav-item:hover{background:rgba(0,178,255,.10)!important;color:#fff!important}.tsc-nav-item.is-active{background:linear-gradient(90deg,#0757c9,#0b3e94)!important;color:#fff!important;box-shadow:inset 3px 0 0 #ffc107}.tsc-nav-item.is-active .tsc-nav-ico{background:#ffc107!important}.tsc-nav-badge{background:#ffc107!important;color:#0b1736!important}.tsc-required-badge{color:#735100!important;background:#fff5d6!important;border-color:#f5c107!important} .tsc-body{align-items:stretch;min-height:calc(100vh - 82px);background:#071a4a} .tsc-main{background:#071a4a!important;color:#f8fbff!important;padding:28px 30px!important;min-width:0} .tsc-panel-head h1{color:#fff!important;font-size:32px!important}.tsc-panel-head .tsc-sub{color:#dbe7ff!important} .tsc-label-dash .tsc-card{background:#fff!important;border-color:#d6e0ef!important;color:#0b1736!important;box-shadow:0 8px 24px rgba(7,26,74,.08)} .tsc-label-dash .tsc-card-title,.tsc-label-dash .tsc-card h2,.tsc-label-dash .tsc-card h3{color:#0b1736!important}.tsc-label-dash .tsc-card .tsc-sub{color:#53627f!important} .tsc-label-dash .tsc-ops-strip{background:linear-gradient(135deg,#0757c9,#0b3e94)!important;border-color:rgba(255,255,255,.16)!important}.tsc-label-dash .tsc-ops-strip-head strong,.tsc-label-dash .tsc-ops-strip-head span{color:#fff!important}.tsc-label-dash .tsc-ops-item{background:rgba(255,255,255,.10)!important;border-color:rgba(255,255,255,.28)!important;color:#fff!important}.tsc-label-dash .tsc-ops-item b{color:#fff!important}.tsc-label-dash .tsc-ops-item span{color:#dbe7ff!important} @media(max-width:1000px){.tsc-app-brand-wrap{min-width:210px}.tsc-app-search{max-width:360px}.tsc-account-copy{display:none}.tsc-account-trigger{min-width:55px}.tsc-sidenav{width:220px!important}} @media(max-width:780px){ .tsc-dash{width:100%;max-width:none;margin:0;border-radius:0;box-shadow:none;min-height:100vh;padding-bottom:74px} .tsc-app-header{min-height:74px;padding:8px 10px;gap:7px;position:sticky;top:0} .tsc-app-brand-wrap{min-width:0;gap:6px;flex:1}.tsc-app-menu-toggle{display:block;flex:0 0 38px;width:38px;height:38px;font-size:18px}.tsc-app-logo{height:50px;max-width:190px;padding:2px 5px}.tsc-app-logo img{max-height:45px} .tsc-app-search{display:none}.tsc-app-actions{gap:3px}.tsc-app-icon-btn{width:34px;height:38px;font-size:18px}.tsc-app-icon-btn b{min-width:15px;height:15px;line-height:15px;font-size:8px}.tsc-withdraw-head{display:none}.tsc-account-trigger{min-width:38px;width:38px;padding:0}.tsc-account-trigger .tsc-avatar{width:38px;height:38px;flex-basis:38px;font-size:12px}.tsc-account-chevron{display:none} .tsc-account-menu{right:4px;top:48px;width:220px} .tsc-sidenav{position:fixed!important;left:0;top:74px;bottom:74px;height:auto!important;width:min(320px,88vw)!important;z-index:90;padding:18px 14px!important;transform:translateX(-105%);transition:transform .22s ease;box-shadow:20px 0 60px rgba(0,0,0,.35);overflow:auto} .tsc-label-dash.tsc-mobile-nav-open .tsc-sidenav,.tsc-dash.tsc-mobile-nav-open .tsc-sidenav{transform:translateX(0)} .tsc-mobile-nav-backdrop{position:fixed;inset:74px 0 74px 0;background:rgba(2,8,22,.58);z-index:89;display:none}.tsc-mobile-nav-open .tsc-mobile-nav-backdrop{display:block} .tsc-body{min-height:calc(100vh - 74px);display:block}.tsc-main{padding:20px 12px 90px!important;overflow-x:hidden} .tsc-panel-head h1{font-size:27px!important}.tsc-panel-head{margin-bottom:16px} .tsc-bottom-nav{z-index:100!important;background:rgba(6,20,56,.98)!important;border-top:1px solid rgba(219,231,255,.22)!important;backdrop-filter:blur(12px)} } @media(max-width:420px){.tsc-app-logo{max-width:160px}.tsc-app-icon-btn{display:none}.tsc-app-actions{margin-left:auto}.tsc-main{padding-left:10px!important;padding-right:10px!important}.tsc-panel-head h1{font-size:24px!important}} /* ======================================================================== * TunaSONGa Core v2.17.3.12 — header notification/message controls * Uses real activity/contract records rendered by the CRM. * ======================================================================== */ .tsc-app-actions { position:relative; } .tsc-header-popover { position:absolute; right:0; top:58px; width:min(380px,calc(100vw - 28px)); padding:10px; border:1px solid #cbd8eb; border-radius:16px; background:#fff; box-shadow:0 20px 55px rgba(4,18,45,.28); z-index:120; color:#0b1736; } .tsc-header-popover[hidden] { display:none !important; } .tsc-header-popover-head { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:8px 9px 10px; border-bottom:1px solid #e4eaf3; } .tsc-header-popover-head strong { font-size:14px; } .tsc-popover-close { width:30px; height:30px; border:0; border-radius:8px; background:#eef4ff; color:#0b1736; font-size:20px; line-height:1; cursor:pointer; } .tsc-header-popover-list { max-height:360px; overflow:auto; padding:5px 0; } .tsc-header-popover-item { width:100%; display:flex; gap:10px; align-items:flex-start; padding:10px 9px; border:0; border-radius:10px; background:transparent; color:#0b1736; text-align:left; cursor:pointer; } .tsc-header-popover-item:hover { background:#eef4ff; } .tsc-header-popover-item > span:last-child { display:flex; flex-direction:column; min-width:0; } .tsc-header-popover-item strong { font-size:12px; line-height:1.3; } .tsc-header-popover-item small { color:#53627f; font-size:11px; line-height:1.35; margin-top:2px; overflow-wrap:anywhere; } .tsc-header-popover-item em { color:#8290a8; font-style:normal; font-size:9px; margin-top:3px; } .tsc-popover-dot { width:28px; height:28px; flex:0 0 28px; display:inline-flex; align-items:center; justify-content:center; border-radius:9px; background:#eef4ff; color:#0757c9; font-weight:800; } .tsc-popover-dot.is-gold { background:#fff5d6; color:#a56f00; } .tsc-header-empty { padding:20px 12px; color:#53627f; font-size:12px; text-align:center; } /* Full-width application shell: the CRM owns the remaining viewport. */ body.tunasonga-core-page .tsc-dash, body.tunasonga-core-page #tsc-dash, body.tunasonga-core-page #tsc-label-dash { width:100% !important; max-width:none !important; margin:0 !important; } body.tunasonga-core-page .tsc-body { width:100% !important; max-width:none !important; } body.tunasonga-core-page .tsc-main { flex:1 1 auto !important; width:auto !important; max-width:none !important; } @media(max-width:780px){ .tsc-header-popover { position:fixed; top:82px; right:10px; left:10px; width:auto; max-width:none; z-index:140; } } @media(max-width:420px){ .tsc-app-logo { max-width:142px !important; } .tsc-app-logo img { max-height:42px !important; } .tsc-app-menu-toggle { width:36px !important; height:36px !important; flex-basis:36px !important; } .tsc-app-icon-btn { display:inline-flex !important; width:32px !important; height:36px !important; align-items:center; justify-content:center; } .tsc-app-icon-btn b { display:block !important; } .tsc-account-trigger { width:36px !important; min-width:36px !important; } .tsc-account-trigger .tsc-avatar { width:36px !important; height:36px !important; flex-basis:36px !important; } .tsc-app-actions { gap:2px !important; } } /* ======================================================================== * TunaSONGa Core v2.17.3.14 — Sticky CRM app header fix * Applies to Artist + Label CRM only. * ======================================================================== */ .tsc-dash .tsc-app-header { position:sticky !important; top:0 !important; z-index:1000 !important; width:100% !important; } .tsc-dash .tsc-app-menu-toggle { display:none !important; } /* Escape any parent theme content-width constraint while keeping the CRM * itself proportional: sidebar + workspace use the complete viewport. */ body.tunasonga-core-page .tsc-dash, body.tunasonga-core-page #tsc-dash, body.tunasonga-core-page #tsc-label-dash { width:100vw !important; max-width:none !important; margin-left:calc(50% - 50vw) !important; margin-right:0 !important; } body.tunasonga-core-page .tsc-body { width:100% !important; } body.tunasonga-core-page .tsc-main { flex:1 1 auto !important; min-width:0 !important; } @media (max-width:780px) { .tsc-dash .tsc-app-header { position:sticky !important; top:0 !important; } .tsc-dash .tsc-app-menu-toggle { display:none !important; } .tsc-app-brand-wrap { min-width:0 !important; flex:1 1 auto !important; } .tsc-app-logo { max-width:190px !important; } .tsc-app-actions { flex:0 0 auto !important; } } @media (max-width:420px) { .tsc-app-logo { max-width:150px !important; } .tsc-app-icon-btn { display:inline-flex !important; } } /* TunaSONGa Core v2.17.3.14 — final sticky-header containment fix. * The dashboard previously inherited overflow:hidden, which creates a non-scrolling * containing block for position:sticky and prevents the app header from sticking * to the viewport during page scroll. CRM dashboards are full-viewport shells, so * overflow is intentionally visible here; component-level overflow remains scoped. */ body.tsc-crm-page .tsc-dash, body.tunasonga-core-page .tsc-dash, body.tunasonga-core-page #tsc-dash, body.tunasonga-core-page #tsc-label-dash { overflow: visible !important; } body.tsc-crm-page .tsc-app-header, body.tunasonga-core-page .tsc-app-header { position: sticky !important; top: 0 !important; z-index: 1000 !important; } /* ======================================================================== * TunaSONGa Core v2.17.3.15 — viewport-level CRM app shell * Artist + Label CRM only. Replaces sticky-within-shell behavior with a * true fixed application header and a correctly sized scrolling workspace. * ======================================================================== */ body.tunasonga-core-page .tsc-dash, body.tsc-crm-page .tsc-dash { position: static !important; width: 100% !important; max-width: none !important; margin: 0 !important; transform: none !important; } body.tunasonga-core-page .tsc-app-header, body.tsc-crm-page .tsc-app-header { position: fixed !important; inset: 0 0 auto 0 !important; width: auto !important; max-width: none !important; margin: 0 !important; z-index: 10000 !important; } body.tunasonga-core-page .tsc-body, body.tsc-crm-page .tsc-body { width: 100% !important; max-width: none !important; margin: 82px 0 0 !important; min-height: calc(100vh - 82px) !important; } body.tunasonga-core-page .tsc-main, body.tsc-crm-page .tsc-main { width: auto !important; max-width: none !important; min-width: 0 !important; flex: 1 1 auto !important; } body.tunasonga-core-page .tsc-sidenav, body.tsc-crm-page .tsc-sidenav { flex: 0 0 250px !important; width: 250px !important; position: sticky !important; top: 82px !important; height: calc(100vh - 82px) !important; align-self: flex-start !important; } @media (max-width:780px) { body.tunasonga-core-page .tsc-app-header, body.tsc-crm-page .tsc-app-header { position: fixed !important; inset: 0 0 auto 0 !important; } body.tunasonga-core-page .tsc-body, body.tsc-crm-page .tsc-body { margin-top: 74px !important; min-height: calc(100vh - 74px) !important; } body.tunasonga-core-page .tsc-sidenav, body.tsc-crm-page .tsc-sidenav { position: fixed !important; top: 74px !important; bottom: 74px !important; height: auto !important; } } /* ======================================================================== * TunaSONGa Core v2.17.3.16 — CRM application portal shell * The authenticated Artist/Label CRM root is moved directly under by * public.js. These rules are the single final shell contract and intentionally * supersede the historical sticky/100vw compatibility layers above. * ======================================================================== */ body.tsc-crm-page > .tsc-crm-portal-root, body.tunasonga-core-page > .tsc-crm-portal-root { position: relative !important; display: block !important; width: 100% !important; max-width: none !important; min-width: 0 !important; margin: 0 !important; padding: 0 0 74px !important; border: 0 !important; border-radius: 0 !important; overflow: visible !important; transform: none !important; contain: none !important; filter: none !important; perspective: none !important; } body.tsc-crm-page > .tsc-crm-portal-root > .tsc-app-header, body.tunasonga-core-page > .tsc-crm-portal-root > .tsc-app-header { position: fixed !important; top: 0 !important; right: 0 !important; left: 0 !important; width: 100% !important; max-width: none !important; min-width: 0 !important; margin: 0 !important; border-radius: 0 !important; z-index: 2147483000 !important; } body.tsc-crm-page > .tsc-crm-portal-root > .tsc-body, body.tunasonga-core-page > .tsc-crm-portal-root > .tsc-body { width: 100% !important; max-width: none !important; min-width: 0 !important; margin: 82px 0 0 !important; display: flex !important; align-items: stretch !important; } body.tsc-crm-page > .tsc-crm-portal-root > .tsc-body > .tsc-sidenav, body.tunasonga-core-page > .tsc-crm-portal-root > .tsc-body > .tsc-sidenav { flex: 0 0 250px !important; width: 250px !important; max-width: 250px !important; min-width: 250px !important; } body.tsc-crm-page > .tsc-crm-portal-root > .tsc-body > .tsc-main, body.tunasonga-core-page > .tsc-crm-portal-root > .tsc-body > .tsc-main { flex: 1 1 auto !important; width: auto !important; max-width: none !important; min-width: 0 !important; } @media (max-width:780px) { body.tsc-crm-page > .tsc-crm-portal-root, body.tunasonga-core-page > .tsc-crm-portal-root { padding-bottom: 74px !important; } body.tsc-crm-page > .tsc-crm-portal-root > .tsc-app-header, body.tunasonga-core-page > .tsc-crm-portal-root > .tsc-app-header { height: 74px !important; min-height: 74px !important; } body.tsc-crm-page > .tsc-crm-portal-root > .tsc-body, body.tunasonga-core-page > .tsc-crm-portal-root > .tsc-body { margin-top: 74px !important; display: block !important; min-height: calc(100vh - 74px) !important; } body.tsc-crm-page > .tsc-crm-portal-root > .tsc-body > .tsc-sidenav, body.tunasonga-core-page > .tsc-crm-portal-root > .tsc-body > .tsc-sidenav { position: fixed !important; top: 74px !important; bottom: 74px !important; left: 0 !important; width: min(320px,88vw) !important; max-width: min(320px,88vw) !important; min-width: 0 !important; height: auto !important; z-index: 2147482900 !important; } body.tsc-crm-page > .tsc-crm-portal-root > .tsc-body > .tsc-main, body.tunasonga-core-page > .tsc-crm-portal-root > .tsc-body > .tsc-main { width: 100% !important; max-width: none !important; min-width: 0 !important; } } /* ======================================================================== * TunaSONGa Core v2.17.3.18 — public-theme wrapper removal * The authenticated CRM portal is moved directly under . The former * public .ts-site wrapper is no longer part of the CRM layout and must not * retain its historical min-height:100vh reservation. * ======================================================================== */ /* v2.17.3.23 — hide the legacy public wrapper only for the actual * authenticated CRM portal. KYC gates remain server-rendered inside the * theme wrapper and must never be hidden before the user submits KYC. */ body.tsc-crm-page:not(.tsc-kyc-gate-page) > .ts-site, body.tunasonga-core-page:not(.tsc-kyc-gate-page) > .ts-site { display: none !important; width: 0 !important; height: 0 !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; } body.tsc-crm-page > .tsc-crm-portal-root, body.tunasonga-core-page > .tsc-crm-portal-root { margin: 0 !important; } /* ========================================================== TunaSONGa Events & Ticketing — v2.17.3.28 ========================================================== */ .ts-ticket-app,.ts-ticket-store,.ts-ticket-checkout{font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#0b1f3a} .ts-ticket-head,.ts-ticket-store-head{display:flex;justify-content:space-between;gap:24px;align-items:flex-end;margin-bottom:22px} .ts-ticket-head h2,.ts-ticket-store-head h1{margin:.2rem 0 .45rem;font-size:clamp(26px,3vw,38px);line-height:1.08;letter-spacing:-.02em} .ts-ticket-head p,.ts-ticket-store-head p{margin:0;color:#64748b;font-size:14px;line-height:1.6} .ts-ticket-kicker{font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#b88916} .ts-ticket-btn{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:10px 16px;border:1px solid #d7dee8;border-radius:10px;background:#fff;color:#0b1f3a;text-decoration:none;font-weight:750;cursor:pointer;box-shadow:0 2px 7px rgba(15,23,42,.05)} .ts-ticket-btn.primary{background:#0b2a4a;color:#fff;border-color:#0b2a4a} .ts-ticket-btn:hover{transform:translateY(-1px)} .ts-ticket-panel{background:#fff;border:1px solid #e5eaf0;border-radius:16px;padding:20px;margin:0 0 16px;box-shadow:0 8px 28px rgba(15,23,42,.05)} .ts-ticket-event-row{display:flex;justify-content:space-between;gap:16px;align-items:flex-start} .ts-ticket-event-row h3,.ts-ticket-panel h3{margin:0 0 5px;font-size:20px} .ts-ticket-event-row p,.ts-ticket-muted{margin:0;color:#64748b;font-size:13px;line-height:1.55} .ts-ticket-status{display:inline-flex;border-radius:999px;padding:6px 10px;background:#eef5ff;color:#0b2a4a;font-size:11px;font-weight:800} .ts-ticket-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:16px 0} .ts-ticket-grid label{display:flex;flex-direction:column;gap:7px;font-size:12px;font-weight:750;color:#334155} .ts-ticket-grid label.full{grid-column:1/-1} .ts-ticket-grid input,.ts-ticket-grid select,.ts-ticket-grid textarea{width:100%;box-sizing:border-box;border:1px solid #d7dee8;border-radius:9px;background:#fff;padding:11px 12px;color:#0f172a;font:inherit;font-size:14px;outline:none} .ts-ticket-grid input:focus,.ts-ticket-grid select:focus,.ts-ticket-grid textarea:focus{border-color:#0b2a4a;box-shadow:0 0 0 3px rgba(11,42,74,.08)} .ts-ticket-types{margin-top:18px;border-top:1px solid #edf1f5;padding-top:16px} .ts-ticket-tier{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:12px 0;border-bottom:1px solid #f0f3f6} .ts-ticket-tier span{display:flex;flex-direction:column;gap:3px}.ts-ticket-tier small{color:#64748b;font-size:12px} .ts-ticket-add{margin-top:14px}.ts-ticket-add summary{cursor:pointer;font-weight:800;color:#0b2a4a} .ts-ticket-link{font-size:13px;font-weight:750;color:#0b2a4a} .ts-ticket-empty{display:flex;flex-direction:column;gap:7px;align-items:flex-start;padding:34px 24px;background:#fff;border:1px dashed #ccd6e1;border-radius:16px;color:#334155}.ts-ticket-empty strong{font-size:18px}.ts-ticket-empty span{color:#64748b;font-size:13px} .ts-ticket-note{padding:14px 16px;border-left:4px solid #c99b2e;background:#fffaf0;border-radius:10px;color:#5b4a22;font-size:13px;line-height:1.55} .ts-ticket-event-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.ts-ticket-event-card{overflow:hidden;border:1px solid #e5eaf0;border-radius:16px;background:#fff;box-shadow:0 8px 28px rgba(15,23,42,.06)} .ts-ticket-event-art{height:120px;background:linear-gradient(135deg,#0b2a4a,#173e67 58%,#c99b2e)}.ts-ticket-event-body{padding:18px}.ts-ticket-event-body>span{font-size:10px;text-transform:uppercase;letter-spacing:.1em;font-weight:800;color:#b88916}.ts-ticket-event-body h2{font-size:21px;line-height:1.15;margin:7px 0}.ts-ticket-event-body p{margin:5px 0;color:#64748b;font-size:13px} .ts-ticket-checkout-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(260px,.7fr);gap:18px}.ts-ticket-summary{border:1px solid #e5eaf0;border-radius:16px;background:#f8fafc;padding:20px;height:max-content}.ts-ticket-summary h3{margin-top:0}.ts-ticket-check{display:flex!important;flex-direction:row!important;align-items:center;gap:8px;font-weight:500!important}.ts-ticket-check input{width:auto} .ts-ticket-ticket{max-width:620px;margin:30px auto;padding:30px;border-radius:20px;background:#fff;border:1px solid #e5eaf0;box-shadow:0 14px 45px rgba(15,23,42,.1);text-align:center}.ts-ticket-ticket h1{font-size:30px;margin:8px 0}.ts-ticket-code{margin:24px 0;padding:18px;border:2px dashed #c99b2e;border-radius:14px;font:800 24px/1.1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em}.ts-ticket-status-large{display:inline-flex;padding:9px 14px;border-radius:999px;background:#edf7ef;color:#166534;font-size:12px;font-weight:850} @media(max-width:900px){.ts-ticket-event-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.ts-ticket-checkout-grid{grid-template-columns:1fr}} @media(max-width:640px){.ts-ticket-head,.ts-ticket-store-head{display:block}.ts-ticket-head .ts-ticket-btn{margin-top:14px}.ts-ticket-grid{grid-template-columns:1fr}.ts-ticket-grid label.full{grid-column:auto}.ts-ticket-event-grid{grid-template-columns:1fr}.ts-ticket-panel{padding:16px}.ts-ticket-event-row{display:block}.ts-ticket-status{margin-top:10px}} /* ====================================================================== * TunaSONGa v2.17.3.38 — Ticketing contrast + Sacco navigation visibility * The CRM uses a deep-navy application canvas. Ticketing is a light * operational workspace inside that canvas, so headings/stats/controls * must remain strongly readable on mobile and desktop. * ====================================================================== */ .tsc-dash .ts-ticket-app { display:block; width:100%; box-sizing:border-box; padding:22px; border:1px solid #d9e1ec; border-radius:20px; background:#f7f9fc !important; color:#10213d !important; box-shadow:0 12px 34px rgba(2,18,50,.14); } .tsc-dash .ts-ticket-app h1, .tsc-dash .ts-ticket-app h2, .tsc-dash .ts-ticket-app h3, .tsc-dash .ts-ticket-app strong, .tsc-dash .ts-ticket-app b { color:#10213d !important; } .tsc-dash .ts-ticket-app p, .tsc-dash .ts-ticket-app span, .tsc-dash .ts-ticket-app small, .tsc-dash .ts-ticket-app label { color:#52627b !important; } .tsc-dash .ts-ticket-app .ts-ticket-kicker, .tsc-dash .ts-ticket-app .ts-ticket-status, .tsc-dash .ts-ticket-app .ts-ticket-tier strong, .tsc-dash .ts-ticket-app .ts-ticket-link { color:#0b4ea2 !important; } .tsc-dash .ts-ticket-app .ts-ticket-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-bottom:22px; } .tsc-dash .ts-ticket-app .ts-ticket-stats > div { padding:15px 16px; border:1px solid #dce4ef; border-radius:14px; background:#fff; } .tsc-dash .ts-ticket-app .ts-ticket-stats b { display:block; font-size:24px; line-height:1.15; color:#0b2a4a !important; } .tsc-dash .ts-ticket-app .ts-ticket-stats span { display:block; margin-top:5px; font-size:12px; color:#64748b !important; } .tsc-dash .ts-ticket-app .ts-ticket-head h2 { color:#10213d !important; } .tsc-dash .ts-ticket-app .ts-ticket-head p { color:#52627b !important; } .tsc-dash .ts-ticket-app .ts-ticket-btn.primary { background:linear-gradient(135deg,#0757c9,#0a72ef) !important; color:#fff !important; border-color:#0757c9 !important; } .tsc-dash .ts-ticket-app .ts-ticket-btn.primary:hover { background:linear-gradient(135deg,#064aa9,#075fce) !important; color:#fff !important; } .tsc-dash .ts-ticket-app .ts-ticket-panel, .tsc-dash .ts-ticket-app .ts-ticket-empty { background:#fff !important; } .tsc-dash .ts-ticket-app .ts-ticket-empty strong { color:#10213d !important; } .tsc-dash .ts-ticket-app .ts-ticket-empty span { color:#64748b !important; } .tsc-dash .ts-ticket-app .ts-ticket-grid label { color:#334155 !important; } /* Sacco navigation cards are visible both on standalone Sacco pages and * when the same shortcode is rendered inside Artist/Label CRM. */ .tsc-dash .tsc-sacco-wrap { width:100%; box-sizing:border-box; } .tsc-dash .tsc-sacco-wrap > div:not(:first-child) a { color:#172033 !important; } .tsc-dash .tsc-sacco-wrap > div:not(:first-child) a strong { color:#172033 !important; } .tsc-dash .tsc-sacco-wrap > div:not(:first-child) a span { color:#687386 !important; } .tsc-dash .tsc-sacco-wrap > div:not(:first-child) a span:last-child { color:#0b4ea2 !important; } @media(max-width:640px){ .tsc-dash .ts-ticket-app { padding:14px; border-radius:16px; } .tsc-dash .ts-ticket-app .ts-ticket-stats { grid-template-columns:1fr; gap:9px; } .tsc-dash .ts-ticket-app .ts-ticket-head .ts-ticket-btn { width:100%; } } /* v2.17.3.41 — payment states + admin event control polish */ .tsc-dash .ts-ticket-payment-success, .tsc-dash .ts-ticket-payment-pending, .tsc-dash .ts-ticket-payment-error, .ts-ticket-payment-success, .ts-ticket-payment-pending, .ts-ticket-payment-error{ display:flex;flex-direction:column;gap:8px;padding:20px;margin:0 0 18px;border-radius:16px;border:1px solid #dce4ef;background:#fff;color:#10213d; } .ts-ticket-payment-success{border-left:5px solid #198754}.ts-ticket-payment-pending{border-left:5px solid #d49a16}.ts-ticket-payment-error{border-left:5px solid #c0392b} .ts-ticket-payment-success strong,.ts-ticket-payment-pending strong,.ts-ticket-payment-error strong{font-size:18px;color:#10213d!important} .ts-ticket-payment-success span,.ts-ticket-payment-pending span,.ts-ticket-payment-error span{color:#52627b!important;line-height:1.6} .tsc-admin-event-status{display:inline-flex;padding:4px 9px;border-radius:999px;font-size:11px;font-weight:700}.tsc-status-published{background:#e8f7ee;color:#17683c}.tsc-status-draft{background:#eef2f7;color:#43536a}.tsc-status-suspended{background:#fff3d6;color:#815d08}.tsc-status-deleted{background:#fdeaea;color:#9b2c2c} /* TunaSONGa Events v2.17.3.41 — public event detail + organizer controls */ .ts-ticket-event-card .ts-ticket-event-art{display:block;text-decoration:none;height:220px} .ts-ticket-event-card .ts-ticket-event-body{display:flex;flex-direction:column;align-items:flex-start;min-height:190px} .ts-ticket-event-card .ts-ticket-event-body .ts-ticket-btn{margin-top:auto} .ts-ticket-detail{max-width:1120px;margin:0 auto;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#0b1f3a} .ts-ticket-detail-back{margin:0 0 14px} .ts-ticket-detail-card{display:grid;grid-template-columns:minmax(320px,.95fr) minmax(0,1.05fr);gap:0;background:#fff;border:1px solid #e5eaf0;border-radius:18px;overflow:hidden;box-shadow:0 12px 36px rgba(15,23,42,.07)} .ts-ticket-detail-poster{min-height:480px;background:#eef2f7}.ts-ticket-detail-poster img{display:block;width:100%;height:100%;min-height:480px;object-fit:cover} .ts-ticket-detail-info{padding:34px 34px 30px}.ts-ticket-detail-info h1{margin:7px 0 20px;font-size:clamp(30px,4vw,48px);line-height:1.04;letter-spacing:-.035em;color:#0b1f3a} .ts-ticket-detail-line{margin:12px 0;color:#475569;font-size:15px;line-height:1.55}.ts-ticket-detail-line a{color:#0b2a4a}.ts-ticket-detail-meta{display:inline-flex;flex-direction:column;margin:10px 8px 0 0;padding:9px 13px;border:1px solid #e5eaf0;border-radius:10px;background:#f8fafc;color:#0b1f3a;font-size:13px}.ts-ticket-detail-meta span{font-size:10px;text-transform:uppercase;letter-spacing:.09em;color:#94a3b8;font-weight:800;margin-bottom:3px} .ts-ticket-detail-description{margin-top:24px;padding-top:20px;border-top:1px solid #edf1f5}.ts-ticket-detail-description h3{margin:0 0 8px;font-size:18px}.ts-ticket-detail-description p{margin:0;color:#475569;line-height:1.7;font-size:14px} .ts-ticket-detail-section{margin-top:20px;background:#fff;border:1px solid #e5eaf0;border-radius:18px;padding:24px;box-shadow:0 8px 28px rgba(15,23,42,.05)} .ts-ticket-section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:12px}.ts-ticket-section-heading h2{margin:5px 0 0;font-size:26px;color:#0b1f3a} .ts-ticket-table-wrap{overflow-x:auto}.ts-ticket-table{width:100%;border-collapse:collapse;min-width:650px}.ts-ticket-table th{text-align:left;background:#f8fafc;color:#475569;font-size:12px;text-transform:uppercase;letter-spacing:.06em;padding:13px 12px;border-bottom:1px solid #e5eaf0}.ts-ticket-table td{padding:15px 12px;border-bottom:1px solid #edf1f5;color:#334155;font-size:14px;vertical-align:middle}.ts-ticket-table tr:last-child td{border-bottom:0}.ts-ticket-table td:first-child{width:40%;color:#0b1f3a}.ts-ticket-table td small{display:block;color:#64748b;margin-top:4px}.ts-ticket-soldout{color:#b42318;font-weight:800}.ts-ticket-detail-footer{display:flex;justify-content:space-between;gap:16px;padding:16px 4px 0;color:#94a3b8;font-size:12px} .ts-ticket-owner-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:16px 0 4px}.ts-ticket-owner-actions form{margin:0}.ts-ticket-btn.danger{color:#b42318;border-color:#f0caca;background:#fff7f7}.ts-ticket-btn.danger:hover{background:#fff0f0} @media(max-width:800px){.ts-ticket-detail-card{grid-template-columns:1fr}.ts-ticket-detail-poster,.ts-ticket-detail-poster img{min-height:300px;height:300px}.ts-ticket-detail-info{padding:25px 20px}.ts-ticket-detail-section{padding:18px}.ts-ticket-section-heading{align-items:flex-start;flex-direction:column}.ts-ticket-detail-footer{flex-direction:column}} @media(max-width:640px){.ts-ticket-event-card .ts-ticket-event-art{height:210px}.ts-ticket-owner-actions{align-items:stretch}.ts-ticket-owner-actions .ts-ticket-btn,.ts-ticket-owner-actions form{width:100%}.ts-ticket-owner-actions form .ts-ticket-btn{width:100%}.ts-ticket-detail-info h1{font-size:34px}} /* ====================================================================== * TunaSONGa Events v2.17.3.43 — public visual layer * Keep the operational CRM light and readable while giving the public * Events experience the TunaSONGa navy/blue/gold application identity. * ====================================================================== */ .ts-ticket-store, .ts-ticket-detail, .ts-ticket-checkout{ --ts-navy:#071b49; --ts-blue:#0b4ea2; --ts-blue-2:#0876e8; --ts-gold:#f2c21a; --ts-ink:#10213d; --ts-muted:#66758f; } .ts-ticket-store{ max-width:1240px; margin:0 auto; padding:clamp(18px,3vw,38px); border-radius:28px; background:linear-gradient(145deg,#06173f 0%,#09265d 52%,#071b49 100%); color:#fff; box-shadow:0 20px 60px rgba(2,18,50,.22); } .ts-ticket-store .ts-ticket-store-head{align-items:flex-start;margin-bottom:28px} .ts-ticket-store .ts-ticket-store-head h1{color:#fff;font-size:clamp(34px,5vw,58px);margin:.2rem 0 .55rem} .ts-ticket-store .ts-ticket-store-head p{color:#d7e2f3;font-size:15px} .ts-ticket-store .ts-ticket-kicker{color:var(--ts-gold)} .ts-ticket-event-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px} .ts-ticket-event-card{ border:1px solid rgba(255,255,255,.13); border-radius:20px; background:rgba(255,255,255,.97); box-shadow:0 14px 36px rgba(0,0,0,.18); overflow:hidden; transition:transform .18s ease,box-shadow .18s ease; } .ts-ticket-event-card:hover{transform:translateY(-3px);box-shadow:0 20px 44px rgba(0,0,0,.25)} .ts-ticket-event-card .ts-ticket-event-art{height:250px;background:#0a2454;overflow:hidden} .ts-ticket-event-card .ts-ticket-event-art img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .25s ease} .ts-ticket-event-card:hover .ts-ticket-event-art img{transform:scale(1.025)} .ts-ticket-event-card .ts-ticket-event-body{padding:20px;min-height:205px} .ts-ticket-event-body>span{color:#b88916} .ts-ticket-event-body h2{color:var(--ts-ink);font-size:24px;margin:8px 0 12px} .ts-ticket-event-body p{color:#5d6c83} .ts-ticket-store .ts-ticket-btn.primary{background:linear-gradient(135deg,#0862d7,#0a78ee);border-color:#0862d7;color:#fff} .ts-ticket-detail{ max-width:1180px; padding:clamp(16px,3vw,34px); border-radius:28px; background:linear-gradient(145deg,#06173f 0%,#09265d 52%,#071b49 100%); color:#fff; box-shadow:0 20px 60px rgba(2,18,50,.22); } .ts-ticket-detail-back .ts-ticket-link{color:#dbe9ff!important} .ts-ticket-detail-card{border:1px solid rgba(255,255,255,.12);box-shadow:0 18px 48px rgba(0,0,0,.2)} .ts-ticket-detail-poster{background:#071b49} .ts-ticket-detail-info h1{color:var(--ts-ink)} .ts-ticket-detail-info{background:#fff} .ts-ticket-detail-info .ts-ticket-kicker{color:#b88916} .ts-ticket-detail-line{color:#53637a} .ts-ticket-detail-meta{background:#f5f8fc} .ts-ticket-detail-section{border-color:#dbe3ee} .ts-ticket-detail-section .ts-ticket-kicker{color:#b88916} .ts-ticket-section-heading h2{color:var(--ts-ink)} .ts-ticket-table th{background:#071b49;color:#fff;border-bottom-color:#0b4ea2} .ts-ticket-table td{background:#fff} .ts-ticket-table tr:hover td{background:#f8fbff} .ts-ticket-detail .ts-ticket-btn.primary{background:linear-gradient(135deg,#0862d7,#0a78ee);border-color:#0862d7;color:#fff} .ts-ticket-detail-footer{color:#c5d2e6} /* Admin/organizer controls remain readable and touch-friendly. */ .ts-ticket-owner-actions .ts-ticket-btn{min-height:44px} .ts-ticket-owner-actions .danger{font-weight:800} @media(max-width:900px){ .ts-ticket-store,.ts-ticket-detail{border-radius:20px;padding:18px} .ts-ticket-event-grid{grid-template-columns:repeat(2,minmax(0,1fr))} .ts-ticket-event-card .ts-ticket-event-art{height:230px} } @media(max-width:640px){ .ts-ticket-store,.ts-ticket-detail{border-radius:16px;padding:12px} .ts-ticket-store .ts-ticket-store-head h1{font-size:38px} .ts-ticket-event-grid{grid-template-columns:1fr;gap:16px} .ts-ticket-event-card .ts-ticket-event-art{height:230px} .ts-ticket-event-card .ts-ticket-event-body{min-height:190px;padding:17px} .ts-ticket-detail-card{border-radius:15px} .ts-ticket-detail-poster,.ts-ticket-detail-poster img{min-height:280px;height:280px} .ts-ticket-detail-info{padding:22px 18px} .ts-ticket-detail-info h1{font-size:32px} .ts-ticket-detail-section{border-radius:15px;padding:16px} .ts-ticket-table{min-width:0} .ts-ticket-table th,.ts-ticket-table td{padding:11px 8px;font-size:13px} .ts-ticket-table th:last-child,.ts-ticket-table td:last-child{width:1%;white-space:nowrap} } /* v2.17.3.44 — advanced public event experience */ .ts-ticket-detail-actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:18px;padding-top:16px;border-top:1px solid #edf1f5} .ts-ticket-detail-actions .ts-ticket-btn{min-height:42px;display:inline-flex;align-items:center;justify-content:center;text-decoration:none} .ts-ticket-mobile-list{display:none} .ts-ticket-mobile-card{border:1px solid #dbe3ee;border-radius:16px;padding:16px;background:#fff;display:grid;grid-template-columns:1fr auto;gap:8px 12px;align-items:center;box-shadow:0 8px 20px rgba(15,23,42,.05)} .ts-ticket-mobile-card>div{min-width:0}.ts-ticket-mobile-name{display:block;font-weight:850;color:#10213d;font-size:17px}.ts-ticket-mobile-card small{display:block;color:#64748b;line-height:1.45;margin-top:4px}.ts-ticket-mobile-card>strong{color:#0b4ea2;font-size:17px;white-space:nowrap}.ts-ticket-mobile-availability{grid-column:1/-1;color:#52627b;font-size:13px;font-weight:700}.ts-ticket-mobile-card .ts-ticket-btn{grid-column:1/-1;width:100%;min-height:44px} .ts-ticket-detail .ts-ticket-section-heading{padding-bottom:4px} @media(max-width:640px){ .ts-ticket-detail-actions{display:grid;grid-template-columns:1fr 1fr}.ts-ticket-detail-actions .ts-ticket-btn:first-child{grid-column:1/-1}.ts-ticket-table-wrap{display:none}.ts-ticket-mobile-list{display:grid;gap:12px}.ts-ticket-detail-section{margin-top:14px}.ts-ticket-detail-line{font-size:14px}.ts-ticket-detail-footer{font-size:11px} } /* ====================================================================== * TunaSONGa Core v2.17.3.45 — premium public Events detail experience * Poster standard: exactly 1080 x 1080. UI remains centered, card-based, * touch-friendly and visually consistent with the TunaSONGa app shell. * ====================================================================== */ .ts-ticket-detail{ max-width:1160px !important; width:calc(100% - 32px) !important; margin:28px auto 60px !important; padding:0 !important; background:transparent !important; border-radius:0 !important; box-shadow:none !important; color:#fff !important; } .ts-ticket-detail-back{margin:0 0 14px !important;padding:0 4px} .ts-ticket-detail-back .ts-ticket-link{display:inline-flex;align-items:center;gap:7px;padding:9px 12px;border-radius:999px;background:rgba(8,118,232,.12);border:1px solid rgba(139,195,255,.18);text-decoration:none !important;color:#dceaff !important} .ts-ticket-detail-card{ display:grid !important; grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important; align-items:stretch !important; overflow:hidden !important; border:1px solid rgba(255,255,255,.13) !important; border-radius:26px !important; background:#fff !important; box-shadow:0 24px 70px rgba(0,0,0,.30) !important; } .ts-ticket-detail-poster{ position:relative !important; min-height:0 !important; aspect-ratio:1/1 !important; background:linear-gradient(145deg,#071b49,#0b4ea2) !important; overflow:hidden !important; } .ts-ticket-detail-poster img{ display:block !important; width:100% !important; height:100% !important; min-height:0 !important; aspect-ratio:1/1 !important; object-fit:cover !important; object-position:center !important; } .ts-ticket-detail-info{padding:38px !important;background:#fff !important;display:flex;flex-direction:column;justify-content:center} .ts-ticket-detail-info h1{font-size:clamp(34px,4.3vw,56px) !important;line-height:1.02 !important;margin:8px 0 22px !important;color:#0b1f3a !important} .ts-ticket-detail-highlights{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 16px} .ts-ticket-detail-highlights>div{padding:13px 14px;border:1px solid #e2e8f0;border-radius:14px;background:#f7faff} .ts-ticket-detail-highlights span{display:block;font-size:9px;letter-spacing:.12em;font-weight:850;color:#7b8aa1;margin-bottom:5px} .ts-ticket-detail-highlights strong{display:block;font-size:14px;line-height:1.35;color:#10213d} .ts-ticket-detail-line{margin:10px 0 !important;color:#53637a !important} .ts-ticket-detail-line a{color:#0b4ea2 !important} .ts-ticket-detail-actions{gap:8px !important;margin-top:20px !important;padding-top:18px !important} .ts-ticket-detail-actions .ts-ticket-btn{border-radius:11px !important;background:#f8fafc !important;color:#10213d !important;border-color:#dce4ef !important} .ts-ticket-detail-actions .ts-ticket-btn:hover{background:#eef5ff !important;border-color:#b9d5f5 !important} .ts-ticket-detail-section{margin-top:18px !important;padding:26px !important;border-radius:22px !important;background:#fff !important;border:1px solid #dfe7f1 !important;box-shadow:0 18px 48px rgba(0,0,0,.16) !important} .ts-ticket-secure-badge{display:inline-flex;align-items:center;padding:8px 11px;border-radius:999px;background:#edf8f0;color:#18713b;font-size:11px;font-weight:850} .ts-ticket-table th{background:linear-gradient(135deg,#071b49,#0b4ea2) !important} .ts-ticket-table td{font-size:15px !important;padding:16px 13px !important} .ts-ticket-table td:first-child strong{font-size:15px} .ts-ticket-table .ts-ticket-btn{min-width:92px} .ts-ticket-mobile-card{border-radius:17px !important;padding:17px !important} .ts-ticket-mobile-card .ts-ticket-btn{border-radius:12px !important} .ts-ticket-detail-footer{margin-top:12px !important;padding:18px 5px 0 !important} .ts-ticket-mobile-cta{display:none} /* Event discovery cards: square poster artwork and stronger hierarchy. */ .ts-ticket-event-card .ts-ticket-event-art{height:auto !important;aspect-ratio:1/1 !important} .ts-ticket-event-card .ts-ticket-event-art img{aspect-ratio:1/1 !important;object-fit:cover !important} @media(max-width:800px){ .ts-ticket-detail{width:calc(100% - 20px) !important;margin:18px auto 90px !important} .ts-ticket-detail-card{grid-template-columns:1fr !important;border-radius:22px !important} .ts-ticket-detail-poster{aspect-ratio:1/1 !important} .ts-ticket-detail-poster img{aspect-ratio:1/1 !important} .ts-ticket-detail-info{padding:24px 20px 22px !important} .ts-ticket-detail-info h1{font-size:34px !important} .ts-ticket-detail-section{padding:18px !important;border-radius:18px !important} } @media(max-width:640px){ .ts-ticket-detail{width:calc(100% - 14px) !important;margin-top:12px !important} .ts-ticket-detail-back{padding:0 2px} .ts-ticket-detail-card{border-radius:18px !important} .ts-ticket-detail-info{padding:21px 16px 18px !important} .ts-ticket-detail-info h1{font-size:31px !important;margin-bottom:18px !important} .ts-ticket-detail-highlights{gap:8px} .ts-ticket-detail-highlights>div{padding:11px 10px} .ts-ticket-detail-highlights strong{font-size:12px} .ts-ticket-detail-actions{grid-template-columns:1fr 1fr !important} .ts-ticket-detail-actions .ts-ticket-btn:first-child{grid-column:1/-1} .ts-ticket-detail-section{margin-top:12px !important;padding:15px !important} .ts-ticket-section-heading{gap:10px !important} .ts-ticket-secure-badge{font-size:10px} .ts-ticket-detail-footer{padding-bottom:15px !important} .ts-ticket-mobile-cta{ display:flex !important; position:fixed !important; z-index:1200 !important; left:14px !important; right:14px !important; bottom:calc(12px + env(safe-area-inset-bottom)) !important; min-height:50px !important; align-items:center !important; justify-content:center !important; border-radius:15px !important; background:linear-gradient(135deg,#0862d7,#0a78ee) !important; color:#fff !important; text-decoration:none !important; font-size:16px !important; font-weight:850 !important; box-shadow:0 12px 34px rgba(5,58,125,.38) !important; } }