/* Performance */
.perf-overview-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:24px}
@media(max-width:768px){.perf-overview-grid{grid-template-columns:1fr}}
.perf-overview-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:24px;text-align:center}
.perf-highlight{border-color:var(--primary);background:var(--primary-light)}
.perf-big-stat{margin-bottom:8px}.perf-big-num{font-size:42px;font-weight:700;color:var(--text)}.perf-big-unit{font-size:18px;color:var(--text-muted)}
.perf-big-label{font-size:13px;color:var(--text-muted);display:block;margin-top:4px}
.perf-bar-lg{height:6px;background:var(--bg-secondary);border-radius:3px;overflow:hidden;margin-top:12px}
.perf-bar-fill-lg{height:100%;background:var(--primary);border-radius:3px;transition:width 1.5s ease}.perf-bar-fill-lg.fill-blue{background:var(--info)}
.perf-trophy{font-size:28px;margin-bottom:8px}
.perf-top-name{display:block;font-size:16px;font-weight:600;color:var(--text);margin-top:8px}
.perf-top-score{display:block;font-size:14px;color:var(--primary);font-weight:600;margin-top:4px}
.perf-chart{display:flex;align-items:flex-end;gap:8px;height:200px;padding:0 8px}
.perf-chart-bar-wrap{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;min-width:0}
.perf-chart-bar-container{height:160px;width:100%;display:flex;align-items:flex-end;justify-content:center}
.perf-chart-bar{width:70%;max-width:40px;background:linear-gradient(180deg,var(--primary),rgba(225,29,72,0.4));border-radius:4px 4px 0 0;transition:height 1s ease;position:relative;min-height:4px}
.perf-chart-value{position:absolute;top:-20px;left:50%;transform:translateX(-50%);font-size:11px;font-weight:600;color:var(--text);white-space:nowrap}
.perf-chart-name{font-size:10px;color:var(--text-dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;text-align:center}
.score-cell{display:flex;align-items:center;gap:8px}.score-cell span{font-size:12px;width:35px;text-align:right;color:var(--text)}
.mini-bar{width:60px;height:4px;background:var(--bg-secondary);border-radius:2px;overflow:hidden}.mini-bar-fill{height:100%;border-radius:2px;transition:width 1s ease}
.rank-badge{width:24px;height:24px;border-radius:50%;background:var(--bg-secondary);display:inline-flex;align-items:center;justify-content:center;font-size:10px;font-weight:600;color:var(--text-muted);flex-shrink:0}
.overall-score{font-size:14px;font-weight:700;padding:4px 12px;border-radius:20px}
.score-high{background:rgba(16,185,129,0.15);color:#10B981}.score-mid{background:rgba(245,158,11,0.15);color:#F59E0B}.score-low{background:rgba(239,68,68,0.15);color:#EF4444}
/* Payslips */
.salary-summary-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:16px;margin-bottom:24px}
@media(max-width:900px){.salary-summary-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.salary-summary-grid{grid-template-columns:1fr}}
.salary-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:20px;display:flex;flex-direction:column;gap:4px}
.salary-card-main{flex-direction:row;align-items:center;gap:16px;border-left:3px solid var(--primary)}
.salary-card-icon{width:48px;height:48px;background:var(--primary-light);color:var(--primary);border-radius:var(--radius);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.salary-card-content{flex:1}
.salary-label{font-size:12px;color:var(--text-dim)}.salary-amount{font-size:28px;font-weight:700;color:var(--text);display:block}.salary-amount-sm{font-size:20px;font-weight:700;color:var(--text);display:block}
.salary-status{padding:3px 10px;border-radius:20px;font-size:11px;align-self:flex-start}
.payslip-view{border:1px solid var(--border);border-radius:var(--radius);padding:24px;background:var(--bg-secondary)}
.payslip-header{display:flex;justify-content:space-between;align-items:start;margin-bottom:20px;padding-bottom:16px;border-bottom:2px solid var(--primary)}
.payslip-company h2{font-size:20px;color:var(--primary)}.payslip-company p{font-size:12px;color:var(--text-muted)}
.payslip-title h3{font-size:16px;color:var(--text)}.payslip-title p{font-size:12px;color:var(--text-muted)}
.payslip-emp-info{margin-bottom:20px;padding:12px;background:var(--bg-card);border-radius:var(--radius-sm)}
.payslip-info-row{display:flex;justify-content:space-between;padding:4px 0;font-size:13px;color:var(--text-muted)}
.payslip-table{width:100%;border-collapse:collapse;margin-bottom:16px}
.payslip-table th,.payslip-table td{padding:8px 12px;text-align:left;border-bottom:1px solid var(--border);font-size:13px}
.payslip-table th{background:var(--bg-card);font-weight:600;color:var(--text-muted)}
.payslip-table td{color:var(--text-muted)}
.payslip-table tfoot td{font-weight:600;border-top:2px solid var(--border-light);color:var(--text)}
.payslip-net{display:flex;justify-content:space-between;padding:16px;background:var(--primary);border-radius:var(--radius);color:#fff;font-weight:600;font-size:16px}
.payslip-net-amount{font-size:20px}
.payslip-footer{text-align:center;margin-top:16px;font-size:11px;color:var(--text-dim)}
/* Social */
.social-layout{display:grid;grid-template-columns:1fr 300px;gap:20px}
@media(max-width:900px){.social-layout{grid-template-columns:1fr}}
.social-main{min-width:0}
.create-post-card{margin-bottom:20px;overflow:visible}
.create-toggle-bar{display:flex;border-bottom:1px solid var(--border);background:var(--bg-secondary);border-radius:var(--radius-lg) var(--radius-lg) 0 0;overflow:hidden}
.create-toggle-btn{flex:1;background:none;border:none;color:var(--text-muted);padding:12px 16px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;font-size:13px;font-weight:500;transition:var(--transition);border-bottom:2px solid transparent}
.create-toggle-btn.active{color:var(--primary);border-bottom-color:var(--primary);background:var(--bg-card)}
.create-toggle-btn:hover:not(.active){background:var(--bg-hover);color:var(--text)}
.create-post{display:flex;gap:12px;align-items:flex-start;padding:16px 20px}
.create-post-input-wrap{flex:1;display:flex;flex-direction:column;gap:10px}
.create-post-input{width:100%;padding:12px;background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);resize:none;outline:none;font-size:14px}
.create-post-input:focus{border-color:var(--primary)}
.create-post-footer{display:flex;justify-content:space-between;align-items:center}
.emoji-bar{display:flex;gap:2px}
.emoji-btn{background:none;border:none;font-size:18px;cursor:pointer;padding:4px 6px;border-radius:var(--radius-sm);transition:var(--transition)}
.emoji-btn:hover{background:var(--bg-hover);transform:scale(1.2)}
/* Poll Creator */
.create-poll{padding:16px 20px}
.poll-creator-header{display:flex;gap:12px;align-items:center;margin-bottom:16px}
.poll-question-input{flex:1;padding:12px;background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);font-size:15px;font-weight:500;outline:none}
.poll-question-input:focus{border-color:var(--primary)}
.poll-question-input::placeholder{color:var(--text-dim)}
.poll-options-creator{display:flex;flex-direction:column;gap:8px;margin-bottom:12px;padding-left:52px}
.poll-option-input-row{display:flex;align-items:center;gap:8px}
.poll-option-num{width:22px;height:22px;border-radius:50%;background:var(--bg-secondary);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:600;color:var(--text-dim);flex-shrink:0}
.poll-option-input{flex:1;padding:10px 12px;background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text);outline:none;font-size:13px}
.poll-option-input:focus{border-color:var(--primary)}
.poll-creator-actions{display:flex;justify-content:space-between;align-items:center;padding-left:52px}
/* Poll Display */
.poll-content{padding:4px 20px 12px}
.poll-question{font-size:15px;font-weight:600;color:var(--text);margin-bottom:12px}
.poll-options{display:flex;flex-direction:column;gap:8px}
.poll-option-vote{display:flex;align-items:center;gap:10px;padding:12px 16px;background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius);cursor:pointer;color:var(--text);font-size:14px;transition:var(--transition);width:100%;text-align:left}
.poll-option-vote:hover{border-color:var(--primary);background:var(--primary-light)}
.poll-vote-radio{width:18px;height:18px;border-radius:50%;border:2px solid var(--border-light);flex-shrink:0;transition:var(--transition)}
.poll-option-vote:hover .poll-vote-radio{border-color:var(--primary)}
.poll-option-result{position:relative;padding:12px 16px;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;transition:var(--transition)}
.poll-option-result.selected{border-color:var(--primary);background:rgba(225,29,72,0.05)}
.poll-option-result.winning{border-color:var(--success)}
.poll-result-bar{position:absolute;left:0;top:0;bottom:0;background:var(--primary-light);border-radius:var(--radius);transition:width 0.8s ease;z-index:0}
.poll-option-result.winning .poll-result-bar{background:rgba(16,185,129,0.12)}
.poll-option-content{display:flex;justify-content:space-between;align-items:center;position:relative;z-index:1}
.poll-option-text{font-size:14px;color:var(--text);font-weight:500}
.poll-option-pct{font-size:14px;font-weight:700;color:var(--text)}
.poll-option-votes{font-size:11px;color:var(--text-dim);position:relative;z-index:1;display:block;margin-top:2px}
.poll-footer{display:flex;align-items:center;gap:12px;margin-top:10px;padding-top:8px;font-size:12px;color:var(--text-dim)}
.poll-voted-badge{color:var(--success);font-weight:500}
.poll-hint{color:var(--text-dim);font-style:italic}
/* Post Cards */
.post-card{margin-bottom:16px}
.post-pinned{border-color:var(--primary);box-shadow:0 0 0 1px rgba(225,29,72,0.2)}
.pinned-badge{padding:6px 16px;background:var(--primary-light);color:var(--primary);font-size:11px;font-weight:600;display:flex;align-items:center;gap:6px;border-bottom:1px solid rgba(225,29,72,0.15)}
.post-header{display:flex;align-items:center;gap:12px;padding:16px 20px 0}
.post-author-info{flex:1}
.post-author-name{display:block;font-weight:600;color:var(--text);font-size:14px}
.post-type-badge{font-size:11px;font-weight:500;color:var(--info)}
.post-meta{font-size:11px;color:var(--text-dim)}
.post-admin-actions{display:flex;gap:4px}
.post-content{padding:12px 20px;font-size:14px;line-height:1.6;color:var(--text-muted)}
.post-stats{padding:0 20px 8px;font-size:12px;color:var(--text-dim);display:flex;gap:16px}
.post-actions{display:flex;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.post-action-btn{flex:1;background:none;border:none;color:var(--text-muted);padding:10px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px;font-size:13px;transition:var(--transition)}
.post-action-btn:hover{background:var(--bg-hover);color:var(--text)}.post-action-btn.liked{color:var(--primary)}
.post-comments{padding:12px 20px}
.comment{display:flex;gap:8px;padding:8px 0;border-bottom:1px solid var(--border)}.comment:last-of-type{border-bottom:none}
.comment-body{flex:1}
.comment-author{font-weight:500;color:var(--text);font-size:12px;margin-right:6px}
.comment-text{font-size:13px;color:var(--text-muted)}
.comment-time{font-size:10px;color:var(--text-dim);display:block;margin-top:2px}
.comment-input-wrap{display:flex;gap:8px;margin-top:8px}
.comment-input{flex:1;padding:8px 12px;background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text);outline:none;font-size:13px}.comment-input:focus{border-color:var(--primary)}
.social-sidebar .sidebar-stat{display:flex;align-items:center;gap:8px;padding:8px 0;border-bottom:1px solid var(--border)}.social-sidebar .sidebar-stat:last-child{border-bottom:none}
.sidebar-stat-num{font-size:18px;font-weight:700;color:var(--text)}
.sidebar-stat-label{font-size:12px;color:var(--text-muted)}
.contributor-item{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--border)}.contributor-item:last-child{border-bottom:none}
.contributor-info{flex:1;min-width:0}
.contributor-name{display:block;font-size:13px;font-weight:500;color:var(--text)}
.contributor-posts{font-size:11px;color:var(--text-dim)}
.text-dim{color:var(--text-dim)}
/* Messages */
.page-full-height{display:flex;flex-direction:column;height:calc(100vh - var(--header-height) - 48px)}
.messaging-layout{display:grid;grid-template-columns:320px 1fr;border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;background:var(--bg-card);flex:1;min-height:0}
@media(max-width:768px){.messaging-layout{grid-template-columns:1fr}}
.msg-sidebar{border-right:1px solid var(--border);display:flex;flex-direction:column}
.msg-sidebar-header{padding:16px;border-bottom:1px solid var(--border)}
.msg-sidebar-header h3{font-size:16px;font-weight:600;color:var(--text);margin-bottom:12px}
.msg-contacts{flex:1;overflow-y:auto}
.msg-contact{display:flex;align-items:center;gap:12px;padding:12px 16px;cursor:pointer;transition:var(--transition);border-bottom:1px solid var(--border)}
.msg-contact:hover{background:var(--bg-hover)}.msg-contact.active{background:var(--primary-light);border-left:3px solid var(--primary)}
.msg-contact-info{flex:1;min-width:0}
.msg-contact-top{display:flex;justify-content:space-between;align-items:center}
.msg-contact-name{font-weight:500;color:var(--text);font-size:13px}
.msg-contact-time{font-size:10px;color:var(--text-dim)}
.msg-contact-bottom{display:flex;justify-content:space-between;align-items:center;margin-top:4px}
.msg-contact-preview{font-size:12px;color:var(--text-dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;margin-right:8px}
.msg-unread-badge{background:var(--primary);color:#fff;font-size:10px;min-width:18px;height:18px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-weight:600}
.msg-chat{display:flex;flex-direction:column;min-height:0}
.msg-chat-header{display:flex;align-items:center;justify-content:space-between;padding:12px 20px;border-bottom:1px solid var(--border)}
.msg-chat-user{display:flex;align-items:center;gap:12px}
.msg-chat-name{display:block;font-weight:600;color:var(--text);font-size:14px}
.msg-chat-status{font-size:11px;color:var(--text-muted)}
.msg-chat-actions{display:flex;gap:4px}
.msg-chat-messages{flex:1;overflow-y:auto;padding:20px;display:flex;flex-direction:column;gap:8px}
.msg-bubble-wrap{display:flex;gap:8px;align-items:flex-end}
.msg-bubble-wrap.mine{justify-content:flex-end}
.msg-bubble{max-width:70%;padding:10px 14px;border-radius:16px;font-size:13px;line-height:1.5}
.bubble-mine{background:var(--primary);color:#fff;border-bottom-right-radius:4px}
.bubble-theirs{background:var(--bg-secondary);color:var(--text);border:1px solid var(--border);border-bottom-left-radius:4px}
.msg-time{font-size:10px;display:block;margin-top:4px;opacity:0.7}
.msg-chat-input{display:flex;align-items:center;gap:8px;padding:12px 16px;border-top:1px solid var(--border);background:var(--bg-secondary)}
.msg-chat-input input{flex:1;padding:10px 14px;background:var(--bg-card);border:1px solid var(--border);border-radius:20px;color:var(--text);outline:none;font-size:13px}.msg-chat-input input:focus{border-color:var(--primary)}
.msg-empty,.msg-no-selection{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:12px;color:var(--text-dim)}
.msg-no-selection h3{color:var(--text-muted)}
/* Notifications Panel */
.notifications-panel{position:absolute;top:calc(var(--header-height) - 4px);right:60px;width:360px;background:var(--bg-card);border:1px solid var(--border-light);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);z-index:60;max-height:480px;overflow-y:auto}
.notif-panel-header{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--border)}
.notif-panel-header h3{font-size:15px;font-weight:600}
.notif-item{display:flex;align-items:flex-start;gap:10px;padding:12px 16px;cursor:pointer;transition:var(--transition);border-bottom:1px solid var(--border)}
.notif-item:hover{background:var(--bg-hover)}.notif-item.unread{background:rgba(225,29,72,0.05)}
.notif-icon{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0;background:var(--bg-secondary)}
.notif-content{flex:1;min-width:0}
.notif-title{display:block;font-weight:500;color:var(--text);font-size:13px}
.notif-message{display:block;font-size:12px;color:var(--text-muted);margin-top:2px}
.notif-time{font-size:10px;color:var(--text-dim);display:block;margin-top:4px}
.notif-dot{width:8px;height:8px;border-radius:50%;background:var(--primary);flex-shrink:0;margin-top:6px}

/* ===================== CAMPAIGNS ===================== */
/* Summary Bar */
.camp-summary-grid{display:grid;grid-template-columns:repeat(4,1fr) 2fr;gap:14px;margin-bottom:24px}
@media(max-width:1100px){.camp-summary-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.camp-summary-grid{grid-template-columns:1fr}}
.camp-summary-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:20px;display:flex;align-items:center;gap:14px}
.camp-summary-wide{grid-column:span 1}
.camp-summary-icon{width:44px;height:44px;border-radius:var(--radius);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.camp-summary-num{font-size:28px;font-weight:700;color:var(--text);line-height:1}
.camp-summary-label{font-size:12px;color:var(--text-muted);margin-top:4px}
/* Progress bar */
.camp-progress-bar{height:6px;background:var(--bg-secondary);border-radius:3px;overflow:hidden;margin-top:0}
.camp-progress-fill{height:100%;background:linear-gradient(90deg,var(--primary),#F97316);border-radius:3px;transition:width 0.8s ease}
/* Campaign Table */
.camp-id-badge{display:inline-block;padding:2px 10px;background:rgba(225,29,72,0.12);color:var(--primary);border-radius:20px;font-size:12px;font-weight:600;letter-spacing:0.3px;font-family:monospace}
.camp-status-badge{padding:3px 10px;border-radius:20px;font-size:11px;font-weight:500;text-transform:capitalize}
/* Campaign Cards (TL / Analyst / Sales views) */
.camp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px}
.camp-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:20px;transition:var(--transition);cursor:default}
.camp-card:hover{border-color:var(--border-light);box-shadow:var(--shadow)}
.camp-card-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:14px}
.camp-card-name{font-size:16px;font-weight:600;color:var(--text);max-width:200px;word-break:break-word}
.camp-card-progress{margin-top:10px}
.camp-progress-labels{display:flex;justify-content:space-between;font-size:12px;color:var(--text-muted);margin-top:6px}
.camp-card-analysts{display:flex;justify-content:space-between;align-items:center;margin-top:14px;padding-top:14px;border-top:1px solid var(--border)}
/* Analyst stats row inside card */
.camp-analyst-stats{display:flex;gap:0;margin:14px 0 4px;background:var(--bg-secondary);border-radius:var(--radius);overflow:hidden}
.camp-analyst-stat{flex:1;padding:12px;text-align:center;border-right:1px solid var(--border)}
.camp-analyst-stat:last-child{border-right:none}
.camp-analyst-num{font-size:22px;font-weight:700;color:var(--text)}
.camp-analyst-label{font-size:11px;color:var(--text-muted);margin-top:2px}
/* Detail page */
.camp-detail-overview{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:24px}
@media(max-width:768px){.camp-detail-overview{grid-template-columns:repeat(2,1fr)}}
.camp-detail-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:20px}
.camp-detail-stat-label{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:0.5px;color:var(--text-dim);margin-bottom:6px}
.camp-detail-stat-val{font-size:26px;font-weight:700;color:var(--text)}
/* TL row */
.camp-tl-row{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--border)}
.camp-tl-row:last-child{border-bottom:none}
/* Assign modal rows */
.camp-assign-row{display:flex;align-items:center;gap:10px;padding:10px;border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition);margin-bottom:4px}
.camp-assign-row:hover{background:var(--bg-hover)}
.camp-assign-row input[type=checkbox]{width:16px;height:16px;accent-color:var(--primary);flex-shrink:0;cursor:pointer}
.camp-assign-analyst-row{padding:8px;border-radius:var(--radius-sm);margin-bottom:4px;border:1px solid transparent;transition:var(--transition)}
.camp-assign-analyst-row:hover{border-color:var(--border-light);background:var(--bg-hover)}
/* Notes */
.camp-note-card{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius);padding:16px;margin-bottom:12px}
.camp-note-header{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.camp-note-question{color:var(--text);font-size:14px;line-height:1.6}
.camp-note-reply{margin-top:12px;padding:12px;background:rgba(16,185,129,0.07);border-left:3px solid #10B981;border-radius:0 var(--radius-sm) var(--radius-sm) 0;font-size:13px;color:var(--text)}
.camp-note-reply-header{font-size:11px;color:#10B981;font-weight:600;margin-bottom:6px;display:flex;align-items:center;gap:6px}