/* css/theme.css — both <style> blocks from index.html, original order */

:root{
  --bg:#eef1f8;--s1:#ffffff;--s2:#edf0f7;--s3:#e3e8f2;--s4:#d5dcea;
  --br:#c8cfe0;--br2:#b4bdd4;
  --ok:#0a8a5e;--ok-d:#076644;--ok-lt:#d1f7e9;
  --warn:#b87200;--warn-lt:#fef3c7;
  --err:#c41f3a;--err-lt:#fde0e5;
  --tx:#05101e;--tx2:#172747;--tx3:#3d5478;--tx4:#d0d8ec;
  --accent:#1648c8;
  --stretch:#2d5f8a;--stretch-lt:#dbeafe;
}
*{box-sizing:border-box;margin:0;padding:0;}
html,body{min-height:100%;background:var(--bg);color:var(--tx);font-family:'Calibri','Trebuchet MS',sans-serif;font-size:15px;}
::-webkit-scrollbar{width:5px;height:5px;}
::-webkit-scrollbar-track{background:var(--s2);}
::-webkit-scrollbar-thumb{background:var(--br2);border-radius:3px;}

/* TOPBAR */
.topbar{position:sticky;top:0;z-index:300;background:rgba(255,255,255,0.95);backdrop-filter:blur(14px);border-bottom:1px solid var(--br);height:56px;display:flex;align-items:center;padding:0 22px;justify-content:space-between;gap:10px;box-shadow:0 1px 4px rgba(0,0,0,0.06);}
.brand{display:flex;align-items:center;gap:12px;}
.brand-logo{width:34px;height:34px;border-radius:9px;background:linear-gradient(135deg,var(--color-primary),var(--color-primary-light));display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0;}
.brand-name{font-size:16px;font-weight:800;letter-spacing:-0.02em;color:var(--tx);}
.brand-sub{font-family:'Tahoma','Geneva',sans-serif;font-size:10px;color:var(--tx3);letter-spacing:0.12em;text-transform:uppercase;}
.topbar-right{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.date-chip{display:flex;align-items:center;gap:8px;background:var(--s2);border:1px solid var(--br);border-radius:7px;padding:5px 11px;}
.date-chip label{font-family:'Tahoma','Geneva',sans-serif;font-size:10px;color:var(--tx3);text-transform:uppercase;letter-spacing:0.1em;}
.date-chip input[type=date]{background:none;border:none;color:var(--tx);font-family:'Tahoma','Geneva',sans-serif;font-size:12px;outline:none;cursor:pointer;}
.date-chip input::-webkit-calendar-picker-indicator{filter:none;opacity:0.5;}

/* TABS */
.tab-row{background:var(--s1);border-bottom:1px solid var(--br);display:flex;overflow-x:auto;padding:0 12px;gap:0;position:sticky;top:56px;z-index:200;align-items:stretch;box-shadow:0 1px 3px rgba(0,0,0,0.04);}
.tab-row::-webkit-scrollbar{height:0;}
.tbtn{display:flex;align-items:center;gap:6px;padding:10px 14px;background:none;border:none;font-family:'Calibri','Trebuchet MS',sans-serif;font-size:13px;font-weight:600;color:var(--tx3);cursor:pointer;border-bottom:2px solid transparent;white-space:nowrap;transition:color .15s,border-color .15s;letter-spacing:0.01em;flex-shrink:0;}
.tbtn:hover{color:var(--tx2);}
.tbtn.active{color:var(--tx);border-bottom-color:var(--active-color,var(--ok));}
.tbtn .dot{width:6px;height:6px;border-radius:50%;background:var(--br2);flex-shrink:0;transition:background .2s,box-shadow .2s;}
.tbtn .dot.filled{background:var(--ok);}
.tbtn .dot.partial{background:var(--warn);}
.tbtn.active .dot.filled{box-shadow:0 0 5px rgba(13,159,110,0.5);}
.tbtn.active .dot.partial{box-shadow:0 0 5px rgba(196,127,0,0.4);}
.tab-divider{width:1px;background:var(--br);margin:8px 4px;flex-shrink:0;}
.add-rep-btn{display:flex;align-items:center;gap:5px;padding:10px 14px;background:none;border:none;font-family:'Tahoma','Geneva',sans-serif;font-size:10px;color:var(--ok);cursor:pointer;white-space:nowrap;letter-spacing:0.06em;text-transform:uppercase;transition:opacity .15s;flex-shrink:0;}
.add-rep-btn:hover{opacity:0.6;}

/* PAGES */
.page{display:none;padding:24px;max-width:1320px;margin:0 auto;}
.page.active{display:block;animation:fadeUp .2s ease;}
@keyframes fadeUp{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:translateY(0);}}
@keyframes syncPulse{0%,100%{opacity:1;transform:scale(1);}50%{opacity:0.45;transform:scale(0.85);}}
#syncDot.syncing{background:var(--color-warning) !important;animation:syncPulse 1s ease-in-out infinite;}
@keyframes skelShimmer{0%{background-position:200% 0;}100%{background-position:-200% 0;}}
.skeleton-pulse{
  background:linear-gradient(90deg,rgba(15,23,42,0.04) 25%,rgba(15,23,42,0.10) 50%,rgba(15,23,42,0.04) 75%);
  background-size:200% 100%;
  animation:skelShimmer 1.4s linear infinite;
  border-radius:4px;
  /* Preserve the placeholder layout — don't shift surrounding text */
  display:inline-block;
  min-width:2.5em;
}

/* REP PAGE */
.rep-page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:22px;flex-wrap:wrap;}
.rep-identity{display:flex;align-items:center;gap:14px;}
.rep-big-av{width:50px;height:50px;border-radius:13px;display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:800;flex-shrink:0;border:2px solid;}
.rep-name-input{background:none;border:none;font-family:'Calibri','Trebuchet MS',sans-serif;font-size:20px;font-weight:800;color:inherit;outline:none;width:200px;border-bottom:2px solid var(--br);padding-bottom:2px;transition:border-color .15s;}
.rep-name-input:focus{border-bottom-color:var(--ok);}
.rep-name-input::placeholder{color:var(--tx3);}
.rep-role{font-family:'Tahoma','Geneva',sans-serif;font-size:9px;color:var(--tx3);text-transform:uppercase;letter-spacing:0.12em;margin-top:4px;}
.rep-head-right{display:flex;align-items:center;gap:10px;}

/* RING */

/* FORM SECTIONS */
.form-section{background:var(--s1);border:1px solid var(--br);border-radius:9px;margin-bottom:14px;overflow:hidden;}
.form-section-head{background:var(--s2);border-bottom:1px solid var(--br);padding:9px 16px;display:flex;align-items:center;gap:9px;}
.sec-icon{font-size:14px;}
.sec-title{font-family:'Tahoma','Geneva',sans-serif;font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:0.14em;color:var(--tx2);}
.sec-count{margin-left:auto;font-family:'Tahoma','Geneva',sans-serif;font-size:10px;color:var(--tx3);}
.form-fields{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));}
.field-item{padding:13px 16px;border-right:1px solid var(--br);border-bottom:1px solid var(--br);display:flex;flex-direction:column;gap:5px;transition:background .12s;}
.field-item:hover{background:var(--s2);}
.field-item.error{background:var(--err-lt);border-color:rgba(196,31,58,0.2);}
.field-item.filled{background:var(--color-success-soft);}
.field-label{font-family:'Tahoma','Geneva',sans-serif;font-size:10px;color:var(--tx3);text-transform:uppercase;letter-spacing:0.08em;line-height:1.4;}
.field-label .req{color:var(--err);margin-left:2px;}
.field-input{background:var(--s3);border:1px solid var(--br);border-radius:5px;color:var(--tx);font-family:'Tahoma','Geneva',sans-serif;font-size:14px;font-weight:600;padding:7px 9px;outline:none;width:100%;transition:border-color .15s,background .15s;}
.field-input:focus{border-color:var(--ok);background:var(--bg);}
.field-input.is-currency{color:var(--ok);}
.field-item.error .field-input{border-color:rgba(196,31,58,0.5);}
.field-item.filled .field-input{border-color:rgba(10,138,94,0.2);}
.field-group{width:100%;margin-bottom:4px;}.field-group-label{font-size:10px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:var(--color-text-muted);padding:8px 2px 4px;border-bottom:1px solid var(--color-border);margin-bottom:6px;width:100%;}.field-err-msg{font-family:'Tahoma','Geneva',sans-serif;font-size:9px;color:var(--err);display:none;}
.field-item.error .field-err-msg{display:block;}

/* SUBMIT AREA */
.submit-area{background:var(--s1);border:1px solid var(--br);border-radius:9px;padding:16px 20px;display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-top:6px;}
.submit-status-line{font-family:'Tahoma','Geneva',sans-serif;font-size:11px;color:var(--tx2);}
.submit-warn{font-family:'Tahoma','Geneva',sans-serif;font-size:9px;color:var(--warn);display:none;margin-top:2px;}
.submit-actions{display:flex;gap:9px;align-items:center;}


/* BUTTONS */
.btn{display:inline-flex;align-items:center;gap:7px;padding:8px 16px;border-radius:7px;font-family:'Tahoma','Geneva',sans-serif;font-size:10px;font-weight:500;letter-spacing:0.06em;text-transform:uppercase;cursor:pointer;transition:all .15s;border:none;}
.btn-ok{background:var(--ok);color:var(--color-text-inverse);}
.btn-ok:hover{background:var(--ok-d);transform:translateY(-1px);box-shadow:0 3px 10px rgba(13,159,110,0.25);}
.btn-ok:disabled{background:var(--s4);color:var(--tx3);cursor:not-allowed;transform:none;box-shadow:none;}
.btn-outline{background:transparent;color:var(--accent);border:1px solid var(--accent);}
.btn-outline:hover{background:rgba(26,86,219,0.06);}
.btn-ghost{background:var(--s2);color:var(--tx2);border:1px solid var(--br);}
.btn-ghost:hover{color:var(--tx);background:var(--s3);}
.btn-danger{background:transparent;color:var(--err);border:1px solid rgba(212,43,74,0.3);}
.btn-danger:hover{background:rgba(212,43,74,0.06);}
.btn-sm{padding:5px 11px;font-size:9px;}

/* CARD */
.card{background:var(--s1);border:1px solid var(--br);border-radius:9px;overflow:hidden;margin-bottom:14px;}
.card-head{background:var(--s2);border-bottom:1px solid var(--br);padding:10px 16px;display:flex;align-items:center;justify-content:space-between;}
.card-title{font-family:'Tahoma','Geneva',sans-serif;font-size:9px;font-weight:500;text-transform:uppercase;letter-spacing:0.14em;color:var(--ok);display:flex;align-items:center;gap:7px;}
.card-title::before{content:'';width:3px;height:11px;background:var(--ok);border-radius:2px;}
.card-body{padding:16px;}

/* COMPANY REV */
.rev-banner{display:flex;align-items:center;justify-content:space-between;gap:18px;background:linear-gradient(120deg,rgba(13,159,110,0.06),rgba(26,86,219,0.04));border:1px solid rgba(13,159,110,0.2);border-radius:9px;padding:16px 22px;margin-bottom:16px;flex-wrap:wrap;}
.rev-lbl{font-family:'Tahoma','Geneva',sans-serif;font-size:9px;color:var(--tx3);text-transform:uppercase;letter-spacing:0.12em;margin-bottom:4px;}
.rev-big{font-size:30px;font-weight:800;color:var(--ok);line-height:1;}
.rev-big span{font-size:17px;font-weight:500;color:var(--ok-d);}
.rev-right{display:flex;align-items:center;gap:10px;}
.rev-right label{font-family:'Tahoma','Geneva',sans-serif;font-size:9px;color:var(--tx3);text-transform:uppercase;letter-spacing:0.1em;}
.rev-input{background:var(--color-card);border:1px solid rgba(13,159,110,0.35);border-radius:7px;color:var(--ok-d);font-family:'Tahoma','Geneva',sans-serif;font-size:15px;font-weight:700;padding:7px 13px;width:155px;outline:none;text-align:right;transition:border-color .15s;box-shadow:inset 0 1px 3px rgba(0,0,0,0.05);}
.rev-input:focus{border-color:var(--ok);}

/* SUMMARY TABLE */
.tbl-wrap{overflow-x:auto;}
table{width:100%;border-collapse:collapse;font-size:11px;}
thead th{background:var(--s2);font-family:'Tahoma','Geneva',sans-serif;font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:0.1em;color:var(--tx2);padding:8px 11px;text-align:right;border-bottom:1px solid var(--br);white-space:nowrap;}
thead th:first-child{text-align:left;min-width:200px;}
tbody td{padding:7px 11px;text-align:right;border-bottom:1px solid var(--br);font-family:'Tahoma','Geneva',sans-serif;font-size:12px;color:var(--tx2);}
tbody td:first-child{text-align:left;color:var(--tx);font-family:'Calibri','Trebuchet MS',sans-serif;font-size:12px;font-weight:600;}
.sec-row td{background:var(--s3);font-family:'Tahoma','Geneva',sans-serif;font-size:9px;text-transform:uppercase;letter-spacing:0.14em;color:var(--tx2);padding:5px 11px;font-weight:700;}
.total-row td{background:var(--ok-lt);border-top:2px solid var(--ok);color:var(--tx);font-weight:700;}
.total-row td:first-child{color:var(--ok-d);}
.g{color:var(--ok)!important;font-weight:700;}.r{color:var(--err)!important;}.a{color:var(--warn)!important;}

/* KPI GRID */
.kpi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:18px;}
@media(max-width:1100px){.kpi-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:680px){.kpi-grid{grid-template-columns:1fr;}}
.kpi-card{background:var(--s1);border:1px solid var(--br);border-radius:10px;padding:16px;position:relative;overflow:visible;box-shadow:0 1px 3px rgba(0,0,0,0.05);}
.kpi-info-btn{position:absolute;top:10px;right:10px;width:16px;height:16px;border-radius:50%;background:var(--br);border:none;cursor:pointer;font-size:10px;color:var(--tx3);display:flex;align-items:center;justify-content:center;font-style:italic;font-weight:700;z-index:2;padding:0;line-height:1;}
.kpi-info-btn:hover{background:var(--acc);color:var(--color-text-inverse);}
.kpi-tooltip{display:none;position:absolute;top:28px;right:0;background:var(--color-text);color:var(--color-border-light);font-size:11px;padding:12px 14px;border-radius:8px;width:250px;z-index:9999;line-height:1.6;box-shadow:0 8px 24px rgba(0,0,0,0.3);pointer-events:none;white-space:normal;}
.kpi-tooltip::before{content:'';position:absolute;top:-5px;right:12px;border-left:5px solid transparent;border-right:5px solid transparent;border-bottom:5px solid var(--color-text);}
.kpi-info-btn:hover + .kpi-tooltip, .kpi-tooltip:hover{display:block;}
.kpi-card::after{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--kc,var(--ok));border-radius:10px 10px 0 0;}
.kpi-lbl{font-family:'Tahoma','Geneva',sans-serif;font-size:9px;text-transform:uppercase;letter-spacing:0.13em;color:var(--tx3);margin-bottom:6px;line-height:1.4;padding-right:60px;}
.kpi-val{font-size:26px;font-weight:800;color:var(--kc,var(--ok));line-height:1;margin-bottom:3px;}
.kpi-target{font-family:'Tahoma','Geneva',sans-serif;font-size:9px;color:var(--tx3);margin-bottom:8px;}
.kpi-bar-bg{background:var(--s3);border-radius:2px;height:4px;overflow:hidden;margin-bottom:6px;}
.kpi-bar-fill{height:100%;border-radius:2px;background:var(--kc,var(--ok));transition:width .5s ease;max-width:100%;}
.kpi-badge{position:absolute;top:12px;right:12px;font-family:'Tahoma','Geneva',sans-serif;font-size:9px;font-weight:700;padding:3px 7px;border-radius:9px;letter-spacing:0.06em;}
.b-ok{background:var(--ok-lt);color:var(--ok-d);}
.b-stretch{background:var(--stretch-lt);color:var(--stretch);}
.b-miss{background:var(--err-lt);color:var(--err);}
.b-warn{background:var(--warn-lt);color:var(--warn);}
.kpi-thresholds{display:flex;gap:8px;margin-top:4px;}
.kpi-thr{font-family:'Tahoma','Geneva',sans-serif;font-size:9px;padding:2px 7px;border-radius:5px;font-weight:600;}
.kpi-thr.base{background:var(--ok-lt);color:var(--ok-d);}
.kpi-thr.stretch{background:var(--stretch-lt);color:var(--stretch);}
.kpi-incentive{font-family:'Tahoma','Geneva',sans-serif;font-size:9px;color:var(--accent);font-weight:600;margin-top:2px;}

/* AGENT CARDS */
.agent-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:11px;}
@media(max-width:1100px){.agent-grid{grid-template-columns:repeat(3,1fr);}}
@media(max-width:800px){.agent-grid{grid-template-columns:repeat(2,1fr);}}
.agent-mini{background:var(--s1);border:1px solid var(--br);border-radius:9px;overflow:hidden;box-shadow:0 1px 3px rgba(0,0,0,0.04);}
.agent-mini-head{padding:9px 13px;background:var(--s2);border-bottom:1px solid var(--br);display:flex;align-items:center;justify-content:space-between;}
.agent-mini-name{display:flex;align-items:center;gap:8px;font-weight:700;font-size:13px;color:var(--tx);}
.agent-mini-av{width:26px;height:26px;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;}
.agent-mini-body{padding:11px 13px;display:flex;flex-direction:column;gap:6px;}
.am-row{display:flex;align-items:center;gap:7px;}
.am-lbl{font-family:'Tahoma','Geneva',sans-serif;font-size:10px;color:var(--tx3);flex:1;}
.am-bar-bg{width:46px;height:4px;background:var(--s3);border-radius:2px;overflow:hidden;flex-shrink:0;}
.am-bar-fill{height:100%;border-radius:2px;transition:width .5s ease;}
.am-val{font-family:'Tahoma','Geneva',sans-serif;font-size:11px;font-weight:700;width:64px;text-align:right;}
.status-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;}

/* CHARTS */
.chart-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:13px;margin-bottom:14px;}
@media(max-width:900px){.chart-grid{grid-template-columns:1fr;}}
.chart-wrap{background:var(--s1);border:1px solid var(--br);border-radius:9px;overflow:hidden;box-shadow:0 1px 3px rgba(0,0,0,0.04);}
.chart-head{background:var(--s2);border-bottom:1px solid var(--br);padding:8px 14px;}
.chart-title{font-family:'Tahoma','Geneva',sans-serif;font-size:10px;text-transform:uppercase;letter-spacing:0.12em;color:var(--tx2);font-weight:600;}
.chart-body{padding:12px;height:200px;position:relative;}

/* HISTORY */
.hist-table{width:100%;border-collapse:collapse;font-size:12px;}
.hist-table th{background:var(--s2);font-family:'Tahoma','Geneva',sans-serif;font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:0.1em;color:var(--tx2);padding:8px 12px;text-align:left;border-bottom:1px solid var(--br);}
.hist-table td{padding:8px 12px;border-bottom:1px solid var(--br);font-family:'Tahoma','Geneva',sans-serif;font-size:11px;color:var(--tx2);}
.hist-table td:first-child{color:var(--tx);font-weight:700;}
.t-up{color:var(--ok);font-weight:700;}.t-dn{color:var(--err);font-weight:700;}.t-eq{color:var(--tx3);}

/* MODAL */
.modal-overlay{display:none;position:fixed;inset:0;background:rgba(15,21,35,0.55);backdrop-filter:blur(4px);z-index:500;align-items:center;justify-content:center;}
.modal-overlay.open{display:flex;}
.modal{background:var(--s1);border:1px solid var(--br);border-radius:11px;padding:26px;width:490px;max-width:95vw;max-height:90vh;overflow-y:auto;box-shadow:0 8px 32px rgba(0,0,0,0.12);}
.modal-title{font-size:15px;font-weight:800;color:var(--tx);margin-bottom:5px;}
.modal-sub{font-family:'Tahoma','Geneva',sans-serif;font-size:10px;color:var(--tx3);margin-bottom:16px;}
.step-list{list-style:none;display:flex;flex-direction:column;gap:11px;margin-bottom:20px;}
.step-item{display:flex;gap:11px;align-items:flex-start;font-size:12px;color:var(--tx2);line-height:1.5;}
.step-n{background:var(--ok);color:var(--color-text-inverse);font-family:'Tahoma','Geneva',sans-serif;font-size:9px;font-weight:700;width:20px;height:20px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:2px;}
.modal-actions{display:flex;gap:9px;justify-content:flex-end;}
.csv-prev{background:var(--s2);border:1px solid var(--br);border-radius:5px;padding:10px;font-family:'Tahoma','Geneva',sans-serif;font-size:9px;color:var(--tx3);white-space:pre;overflow-x:auto;margin-bottom:14px;max-height:110px;overflow-y:auto;}

/* ADD REP MODAL */
.add-rep-modal{background:var(--s1);border:1px solid var(--br);border-radius:11px;padding:26px;width:360px;max-width:95vw;box-shadow:0 8px 32px rgba(0,0,0,0.12);}
.add-rep-modal h2{font-size:15px;font-weight:800;color:var(--tx);margin-bottom:4px;}
.add-rep-modal p{font-family:'Tahoma','Geneva',sans-serif;font-size:10px;color:var(--tx3);margin-bottom:18px;}
.name-input{background:var(--color-card);border:1px solid var(--br);border-radius:7px;color:var(--tx);font-family:'Calibri','Trebuchet MS',sans-serif;font-size:15px;font-weight:700;padding:10px 14px;width:100%;outline:none;margin-bottom:14px;transition:border-color .15s;box-shadow:inset 0 1px 3px rgba(0,0,0,0.05);}
.name-input:focus{border-color:var(--ok);}

/* TOAST */
.toast{position:fixed;bottom:20px;right:20px;background:var(--tx);border-radius:7px;padding:10px 16px;font-family:'Tahoma','Geneva',sans-serif;font-size:10px;color:var(--color-text-inverse);z-index:999;opacity:0;transform:translateY(5px);transition:all .2s ease;pointer-events:none;box-shadow:0 4px 16px rgba(0,0,0,0.15);}
.toast.show{opacity:1;transform:translateY(0);}

/* MTD SECTION */
.mtd-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:20px;}
@media(max-width:1100px){.mtd-grid{grid-template-columns:repeat(3,1fr);}}
@media(max-width:680px){.mtd-grid{grid-template-columns:repeat(2,1fr);}}
.mtd-card{background:var(--s1);border:1px solid var(--br);border-radius:9px;padding:16px;position:relative;overflow:visible;box-shadow:0 1px 3px rgba(0,0,0,0.04);}
.mtd-card::before{content:'MTD';position:absolute;top:8px;right:10px;font-family:'Tahoma','Geneva',sans-serif;font-size:8px;font-weight:700;color:var(--accent);letter-spacing:0.1em;opacity:0.6;}
.mtd-stripe{position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--accent),var(--ok));}
.mtd-lbl{font-family:'Tahoma','Geneva',sans-serif;font-size:8px;text-transform:uppercase;letter-spacing:0.13em;color:var(--tx3);margin-bottom:6px;line-height:1.4;padding-right:28px;}
.mtd-val{font-size:22px;font-weight:800;color:var(--tx);line-height:1;margin-bottom:4px;}
.mtd-sub{font-family:'Tahoma','Geneva',sans-serif;font-size:9px;color:var(--tx3);margin-bottom:10px;}
.mtd-bar-bg{background:var(--s3);border-radius:2px;height:4px;overflow:hidden;}
.mtd-bar-fill{height:100%;border-radius:2px;background:linear-gradient(90deg,var(--accent),var(--ok));transition:width .6s ease;}
.trend-chart-wrap{background:var(--s1);border:1px solid var(--br);border-radius:9px;overflow:hidden;margin-bottom:16px;box-shadow:0 1px 3px rgba(0,0,0,0.04);}
.trend-chart-head{background:var(--s2);border-bottom:1px solid var(--br);padding:10px 16px;display:flex;align-items:center;justify-content:space-between;}
.trend-chart-title{font-family:'Tahoma','Geneva',sans-serif;font-size:9px;text-transform:uppercase;letter-spacing:0.12em;color:var(--tx2);}
.trend-chart-sub{font-family:'Tahoma','Geneva',sans-serif;font-size:9px;color:var(--tx3);}
.trend-chart-body{padding:14px;height:220px;position:relative;}
.mtd-days-info{font-family:'Tahoma','Geneva',sans-serif;font-size:9px;color:var(--tx3);padding:6px 16px 10px;background:var(--s2);border-top:1px solid var(--br);}

/* LOCK STYLES */
.lock-banner{display:flex;align-items:center;gap:12px;background:var(--color-warning-soft);border:1px solid var(--color-warning);border-radius:8px;padding:11px 16px;margin-bottom:14px;}
.lock-banner .lock-icon{font-size:18px;flex-shrink:0;}
.lock-banner .lock-text{font-family:'Tahoma','Geneva',sans-serif;font-size:10px;color:var(--color-warning-dark);line-height:1.5;}
.lock-banner .lock-text strong{color:var(--color-warning-dark);}
.lock-overlay{position:relative;}
.lock-overlay::after{content:'🔒 Locked';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:rgba(255,251,235,0.92);border:1px solid var(--color-warning);border-radius:6px;padding:4px 12px;font-family:'Tahoma','Geneva',sans-serif;font-size:10px;color:var(--color-warning-dark);font-weight:700;pointer-events:none;z-index:10;}
input:disabled,.field-input:disabled{background:var(--color-bg)!important;color:var(--color-text-muted)!important;border-color:var(--color-border)!important;cursor:not-allowed!important;}
.field-item.computed .field-input{background:var(--color-accent-soft);border-color:var(--color-accent-soft);color:var(--color-accent);font-weight:700;cursor:default;}
.field-item.computed .field-label::after{content:' (auto)';color:var(--color-accent-light);font-size:8px;}

/* LEAD URLS */
.lead-urls-section{background:var(--color-card);border:1px solid var(--br);border-radius:9px;margin-bottom:14px;overflow:hidden;}
.lead-urls-head{background:var(--s2);border-bottom:1px solid var(--br);padding:9px 16px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;}
.lead-urls-title{display:flex;align-items:center;gap:9px;font-family:'Tahoma','Geneva',sans-serif;font-size:9px;font-weight:500;text-transform:uppercase;letter-spacing:0.14em;color:var(--tx2);}
.lead-urls-variance{display:flex;align-items:center;gap:6px;font-family:'Tahoma','Geneva',sans-serif;font-size:9px;font-weight:700;color:var(--err);background:var(--err-lt);border:1px solid rgba(196,31,58,0.25);border-radius:5px;padding:3px 9px;}

.lead-urls-col-hdr{font-family:'Tahoma','Geneva',sans-serif;font-size:8px;font-weight:700;text-transform:uppercase;letter-spacing:0.12em;color:var(--tx3);}
.lead-urls-body{padding:10px 16px;display:flex;flex-direction:column;gap:6px;}


.lead-url-input{background:var(--s2);border:1px solid var(--br);border-radius:5px;color:var(--tx);font-family:'Tahoma','Geneva',sans-serif;font-size:11px;padding:6px 9px;outline:none;transition:border-color .15s;width:100%;}
.lead-url-input:focus{border-color:var(--accent);}
.lead-url-input::placeholder{color:var(--tx3);}
.lead-url-select{background:var(--s2);border:1px solid var(--br);border-radius:5px;color:var(--tx);font-family:'Tahoma','Geneva',sans-serif;font-size:10px;padding:6px 5px;outline:none;cursor:pointer;width:100%;transition:border-color .15s;}
.lead-url-select:focus{border-color:var(--accent);}
.lead-url-select option{font-family:'Tahoma','Geneva',sans-serif;}
.lead-url-select.status-won{background:var(--color-success-soft);border-color:var(--color-success-soft);color:var(--color-success-dark);}
.lead-url-select.status-won-dup{background:#eceff1;border-color:#cfd8dc;color:#607d8b;}
.lead-url-select.status-lost{background:var(--color-danger-soft);border-color:var(--color-danger-soft);color:var(--color-danger-dark);}
.lead-url-select.status-followup{background:var(--color-warning-soft);border-color:var(--color-warning-soft);color:var(--color-warning-dark);}
.lead-url-select.status-sample{background:var(--color-accent-soft);border-color:var(--color-accent-light);color:var(--color-accent);}
.lead-url-select.status-other{background:var(--color-accent-soft);border-color:var(--color-accent-light);color:var(--color-accent);}
.lead-url-select.rating-hot{background:var(--color-danger-soft);border-color:var(--color-danger-soft);color:var(--color-danger-dark);font-weight:700;}
.lead-url-select.rating-warm{background:var(--color-warning-soft);border-color:var(--color-warning);color:var(--color-warning-dark);}
.lead-url-select.rating-cold{background:var(--color-accent-soft);border-color:var(--color-accent-light);color:var(--color-accent);}
.lead-url-select.rating-notqualified{background:var(--color-bg);border-color:var(--color-border);color:var(--color-text-secondary);}

.lead-url-remove{background:none;border:none;color:var(--tx3);cursor:pointer;font-size:15px;padding:2px 5px;border-radius:4px;line-height:1;transition:color .15s,background .15s;}
.lead-url-remove:hover{color:var(--err);background:var(--err-lt);}
.lead-url-open{background:none;border:none;color:var(--accent);cursor:pointer;font-size:12px;padding:2px 5px;border-radius:4px;transition:opacity .15s;}
.lead-url-open:hover{opacity:0.7;}
.add-url-btn{display:inline-flex;align-items:center;gap:5px;padding:6px 12px;background:var(--s2);border:1px solid var(--br);border-radius:6px;font-family:'Tahoma','Geneva',sans-serif;font-size:9px;color:var(--accent);cursor:pointer;text-transform:uppercase;letter-spacing:0.06em;transition:background .15s;}
.add-url-btn:hover{background:var(--s3);}
.add-url-btn:disabled{opacity:0.4;cursor:not-allowed;}
.lead-url-empty{font-family:'Tahoma','Geneva',sans-serif;font-size:10px;color:var(--tx3);text-align:center;padding:12px;}
/* PERFORMANCE COMMAND CENTRE */
.perf-header{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:18px;}
@media(max-width:900px){.perf-header{grid-template-columns:repeat(2,1fr);}}
.perf-card{background:var(--color-card);border:1px solid var(--br);border-radius:10px;padding:14px 16px;position:relative;overflow:visible;}
.perf-card::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--pc,var(--ok));}
.perf-card-lbl{font-family:'Tahoma','Geneva',sans-serif;font-size:9px;text-transform:uppercase;letter-spacing:0.13em;color:var(--tx3);margin-bottom:5px;}
.perf-card-val{font-size:22px;font-weight:800;color:var(--pc,var(--tx));line-height:1;margin-bottom:2px;}
.perf-card-sub{font-family:'Tahoma','Geneva',sans-serif;font-size:9px;color:var(--tx3);}
.perf-card-badge{position:absolute;top:10px;right:10px;font-family:'Tahoma','Geneva',sans-serif;font-size:8px;font-weight:700;padding:2px 7px;border-radius:8px;letter-spacing:0.05em;}
.prediction-box{background:linear-gradient(120deg,var(--color-success-soft),var(--color-accent-soft));border:1px solid rgba(10,138,94,0.18);border-radius:10px;padding:18px 22px;margin-bottom:18px;}
.prediction-title{font-family:'Tahoma','Geneva',sans-serif;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:0.14em;color:var(--ok-d);margin-bottom:14px;}
.prediction-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;}
@media(max-width:800px){.prediction-grid{grid-template-columns:1fr 1fr;}}
.pred-item{background:var(--color-card);border:1px solid var(--br);border-radius:8px;padding:12px 14px;}
.pred-lbl{font-family:'Tahoma','Geneva',sans-serif;font-size:9px;color:var(--tx3);text-transform:uppercase;letter-spacing:0.1em;margin-bottom:4px;}
.pred-val{font-size:20px;font-weight:800;line-height:1;margin-bottom:3px;}
.pred-sub{font-family:'Tahoma','Geneva',sans-serif;font-size:9px;color:var(--tx3);}
.pred-bar{height:5px;background:var(--s3);border-radius:3px;margin-top:8px;overflow:hidden;}
.pred-bar-fill{height:100%;border-radius:3px;transition:width .6s ease;}
.funnel-wrap{background:var(--color-card);border:1px solid var(--br);border-radius:10px;padding:16px 20px;margin-bottom:18px;}
.funnel-title{font-family:'Tahoma','Geneva',sans-serif;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:0.13em;color:var(--tx2);margin-bottom:12px;}
.funnel-row{display:flex;align-items:center;gap:10px;margin-bottom:8px;}
.funnel-label{font-family:'Tahoma','Geneva',sans-serif;font-size:10px;color:var(--tx2);width:100px;flex-shrink:0;}
.funnel-bar-bg{flex:1;height:22px;background:var(--s2);border-radius:5px;overflow:hidden;}
.funnel-bar-fill{height:100%;border-radius:5px;display:flex;align-items:center;padding:0 8px;font-family:'Tahoma','Geneva',sans-serif;font-size:9px;font-weight:700;color:var(--color-text-inverse);white-space:nowrap;transition:width .5s ease;min-width:2px;}
.funnel-count{font-family:'Tahoma','Geneva',sans-serif;font-size:10px;font-weight:700;width:40px;text-align:right;flex-shrink:0;}
.trajectory-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:18px;}
@media(max-width:900px){.trajectory-grid{grid-template-columns:repeat(2,1fr);}}
.traj-card{background:var(--color-card);border:1px solid var(--br);border-radius:9px;padding:13px 15px;}
.traj-lbl{font-family:'Tahoma','Geneva',sans-serif;font-size:9px;text-transform:uppercase;letter-spacing:0.12em;color:var(--tx3);margin-bottom:5px;}
.traj-val{font-size:20px;font-weight:800;color:var(--tx);line-height:1;margin-bottom:2px;}
.traj-delta{font-family:'Tahoma','Geneva',sans-serif;font-size:11px;font-weight:700;}
.traj-sub{font-family:'Tahoma','Geneva',sans-serif;font-size:9px;color:var(--tx3);margin-top:2px;}
.projection-banner{background:linear-gradient(120deg,rgba(22,72,200,0.06),rgba(124,58,237,0.04));border:1px solid rgba(22,72,200,0.18);border-radius:10px;padding:16px 20px;margin-bottom:18px;display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px;}
@media(max-width:800px){.projection-banner{grid-template-columns:1fr;}}
.proj-lbl{font-family:'Tahoma','Geneva',sans-serif;font-size:9px;text-transform:uppercase;letter-spacing:0.12em;color:var(--tx3);margin-bottom:4px;}
.proj-val{font-size:18px;font-weight:800;color:var(--accent);line-height:1;margin-bottom:2px;}
.proj-sub{font-family:'Tahoma','Geneva',sans-serif;font-size:9px;color:var(--tx3);}
.tsh-hdr{display:flex;align-items:center;gap:10px;margin:20px 0 10px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:0.12em;color:var(--tx2);}
.tsh-hdr::before{content:'';flex:0 0 3px;height:16px;background:var(--tsh-c,var(--ok));border-radius:2px;}
.tsh-hdr::after{content:'';flex:1;height:1px;background:var(--br);}
.lead-score-badge{display:inline-flex;align-items:center;gap:4px;padding:2px 7px;border-radius:5px;font-family:'Tahoma','Geneva',sans-serif;font-size:10px;font-weight:700;}
.ls-a{background:var(--color-success-soft);color:var(--color-success-dark);border:1px solid var(--color-success-soft);}
.ls-b{background:var(--color-success-soft);color:var(--color-success-dark);border:1px solid var(--color-success-soft);}
.ls-c{background:var(--color-warning-soft);color:var(--color-warning-dark);border:1px solid var(--color-warning-soft);}
.ls-d{background:var(--color-danger-soft);color:var(--color-danger-dark);border:1px solid var(--color-danger-soft);}
.ls-x{background:var(--color-bg);color:var(--color-text-secondary);border:1px solid var(--color-border);}
.lead-insights-bar{background:var(--s2);border:1px solid var(--br);border-radius:7px;padding:10px 14px;margin-top:10px;display:flex;flex-wrap:wrap;gap:14px;align-items:center;}
.li-stat{font-family:'Tahoma','Geneva',sans-serif;font-size:10px;color:var(--tx2);}
.li-stat strong{color:var(--tx);font-weight:700;}
.lead-url-row.ql-a{background:rgba(209,247,233,0.25);}
.lead-url-row.ql-c{background:rgba(254,243,199,0.3);}
.lead-url-row.ql-d{background:rgba(253,224,229,0.2);}
.lead-url-row.ql-reconcile{background:rgba(255,100,50,0.12);border-left:3px solid var(--color-warning);}
/* MANAGER REVIEW */
.mgr-review-section{background:var(--color-card);border:1px solid rgba(22,72,200,0.25);border-radius:9px;margin-bottom:14px;overflow:hidden;}
.mgr-review-head{background:linear-gradient(90deg,rgba(22,72,200,0.06),rgba(124,58,237,0.03));border-bottom:1px solid var(--br);padding:9px 16px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;}
.mgr-review-title{font-family:'Tahoma','Geneva',sans-serif;font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:0.14em;color:var(--accent);display:flex;align-items:center;gap:8px;}
.mgr-review-status{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:6px;font-family:'Tahoma','Geneva',sans-serif;font-size:9px;font-weight:700;letter-spacing:0.08em;}
.mgr-status-pending{background:var(--color-warning-soft);color:var(--color-warning-dark);border:1px solid var(--color-warning-soft);}
.mgr-status-approved{background:var(--ok-lt);color:var(--ok-d);border:1px solid rgba(10,138,94,0.3);}
.mgr-status-rejected{background:var(--err-lt);color:var(--err);border:1px solid rgba(196,31,58,0.3);}
.mgr-review-body{padding:14px 16px;display:flex;flex-direction:column;gap:10px;}
.mgr-review-note{width:100%;background:var(--s2);border:1px solid var(--br);border-radius:5px;color:var(--tx);font-family:'Tahoma','Geneva',sans-serif;font-size:11px;padding:8px 10px;outline:none;resize:vertical;min-height:60px;transition:border-color .15s;}
.mgr-review-note:focus{border-color:var(--accent);}
.mgr-review-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
.btn-approve{background:var(--ok);color:var(--color-text-inverse);border:none;padding:7px 16px;border-radius:7px;font-family:'Tahoma','Geneva',sans-serif;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:0.07em;cursor:pointer;transition:background .15s;}
.btn-approve:hover{background:var(--ok-d);}
.btn-reject{background:var(--err-lt);color:var(--err);border:1px solid rgba(196,31,58,0.3);padding:7px 16px;border-radius:7px;font-family:'Tahoma','Geneva',sans-serif;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:0.07em;cursor:pointer;transition:all .15s;}
.btn-reject:hover{background:var(--err);color:var(--color-text-inverse);}
.btn-unreview{background:var(--s3);color:var(--tx3);border:1px solid var(--br);padding:7px 12px;border-radius:7px;font-family:'Tahoma','Geneva',sans-serif;font-size:10px;cursor:pointer;}
.mgr-notice{font-family:'Tahoma','Geneva',sans-serif;font-size:9px;color:var(--tx3);}
/* TEAM TOTAL INNER TABS */
.tt-tabs{display:flex;gap:2px;background:var(--s2);border:1px solid var(--br);border-radius:8px;padding:3px;margin-bottom:16px;flex-wrap:wrap;}
.tt-tab{flex:1;min-width:110px;padding:8px 10px;background:none;border:none;border-radius:6px;font-family:'Tahoma','Geneva',sans-serif;font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:0.09em;color:var(--tx3);cursor:pointer;transition:all .15s;text-align:center;}
.tt-tab.active{background:var(--s1);color:var(--tx);box-shadow:0 1px 3px rgba(0,0,0,0.08);}
.tt-tab.act-ind{color:var(--accent)!important;}
.tt-tab.act-team{color:var(--ok)!important;}
/* PENDING REVIEW QUEUE on Team Total */
.review-queue{background:var(--color-card);border:1px solid rgba(22,72,200,0.2);border-radius:9px;margin-bottom:18px;overflow:hidden;}
.review-queue-head{background:linear-gradient(90deg,rgba(22,72,200,0.07),rgba(124,58,237,0.03));border-bottom:1px solid var(--br);padding:10px 16px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;}
.review-queue-title{font-family:'Tahoma','Geneva',sans-serif;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:0.13em;color:var(--accent);}
.review-badge{font-family:'Tahoma','Geneva',sans-serif;font-size:9px;font-weight:700;padding:3px 9px;border-radius:6px;}
.review-badge.pending{background:var(--color-warning-soft);color:var(--color-warning-dark);border:1px solid var(--color-warning-soft);}
.review-badge.approved{background:var(--ok-lt);color:var(--ok-d);}
.review-badge.rejected{background:var(--err-lt);color:var(--err);}
.review-queue-body{padding:14px 16px;display:flex;flex-direction:column;gap:10px;}
.rq-item{background:var(--s2);border:1px solid var(--br);border-radius:7px;padding:12px 14px;display:grid;grid-template-columns:1fr auto;gap:12px;align-items:start;}
.rq-name{font-weight:700;font-size:15px;color:var(--tx);margin-bottom:2px;}
.rq-meta{font-family:'Tahoma','Geneva',sans-serif;font-size:9px;color:var(--tx3);}
.rq-leads{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px;}
.rq-lead-chip{font-family:'Tahoma','Geneva',sans-serif;font-size:9px;padding:2px 8px;border-radius:4px;border:1px solid var(--br);background:var(--color-card);color:var(--tx2);}
.rq-actions{display:flex;flex-direction:column;gap:6px;align-items:flex-end;}
.rq-note{width:200px;background:var(--color-card);border:1px solid var(--br);border-radius:5px;font-family:'Tahoma','Geneva',sans-serif;font-size:10px;color:var(--tx);padding:5px 8px;outline:none;resize:none;height:48px;}
.rq-note:focus{border-color:var(--accent);}
.rq-btn-row{display:flex;gap:6px;}
/* KPI SECTION HEADERS */
.kpi-section-hdr{display:flex;align-items:center;gap:10px;margin:20px 0 10px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:0.12em;color:var(--tx2);}
.kpi-section-hdr::before{content:'';flex:0 0 3px;height:16px;background:var(--ksh-c,var(--ok));border-radius:2px;}
.kpi-section-hdr::after{content:'';flex:1;height:1px;background:var(--br);}

/* MANUAL KPI CARD (reference only) */
.kpi-card.manual{opacity:0.85;}
.kpi-card.manual::after{background:var(--tx3);}
.kpi-manual-badge{position:absolute;top:12px;right:12px;font-family:'Tahoma','Geneva',sans-serif;font-size:8px;font-weight:700;padding:3px 7px;border-radius:9px;background:var(--s3);color:var(--tx3);letter-spacing:0.06em;}

/* INCENTIVE CALCULATOR */
.incentive-calc{background:linear-gradient(120deg,rgba(10,138,94,0.05),rgba(22,72,200,0.04));border:1px solid rgba(10,138,94,0.2);border-radius:10px;padding:18px 22px;margin-bottom:18px;}
.incentive-calc-title{font-family:'Tahoma','Geneva',sans-serif;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:0.14em;color:var(--ok-d);margin-bottom:14px;display:flex;align-items:center;gap:8px;}
.incentive-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;}
@media(max-width:900px){.incentive-grid{grid-template-columns:repeat(2,1fr);}}
.incentive-item{background:var(--color-card);border:1px solid var(--br);border-radius:8px;padding:12px 14px;}
.incentive-item-lbl{font-family:'Tahoma','Geneva',sans-serif;font-size:9px;color:var(--tx3);text-transform:uppercase;letter-spacing:0.1em;margin-bottom:4px;}
.incentive-item-val{font-size:18px;font-weight:800;color:var(--ok);line-height:1;}
.incentive-item-sub{font-family:'Tahoma','Geneva',sans-serif;font-size:9px;color:var(--tx3);margin-top:3px;}
.incentive-item.stretch-hit .incentive-item-val{color:var(--stretch);}
.incentive-item.stretch-hit{border-color:rgba(124,58,237,0.25);background:var(--stretch-lt);}

/* MTD updates */
.mtd-lbl{font-family:'Tahoma','Geneva',sans-serif;font-size:9px;text-transform:uppercase;letter-spacing:0.13em;color:var(--tx3);margin-bottom:6px;line-height:1.4;padding-right:28px;}
.mtd-val{font-size:23px;font-weight:800;color:var(--tx);line-height:1;margin-bottom:4px;}
.mtd-sub{font-family:'Tahoma','Geneva',sans-serif;font-size:10px;color:var(--tx3);margin-bottom:10px;}

/* rep name input */
.rep-name-input{background:none;border:none;font-family:'Calibri','Trebuchet MS',sans-serif;font-size:22px;font-weight:800;color:inherit;outline:none;width:220px;border-bottom:2px solid var(--br);padding-bottom:2px;transition:border-color .15s;}
.rep-role{font-family:'Tahoma','Geneva',sans-serif;font-size:10px;color:var(--tx3);text-transform:uppercase;letter-spacing:0.12em;margin-top:4px;}
.submit-status-line{font-family:'Tahoma','Geneva',sans-serif;font-size:12px;color:var(--tx2);}
.submit-warn{font-family:'Tahoma','Geneva',sans-serif;font-size:10px;color:var(--warn);display:none;margin-top:2px;}
.card-title{font-family:'Tahoma','Geneva',sans-serif;font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:0.14em;color:var(--ok);display:flex;align-items:center;gap:7px;}
.card-title::before{content:'';width:3px;height:12px;background:var(--ok);border-radius:2px;}
/* computed field variance state */
.field-item.computed.variance .field-input{background:var(--color-danger-soft)!important;border-color:var(--color-danger)!important;color:var(--err)!important;}
.field-item.computed .field-label::after{content:' (auto)';color:var(--color-accent-light);font-size:9px;}
.flex-between{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;}
.flex-row{display:flex;align-items:center;gap:9px;flex-wrap:wrap;}
.page-title{font-size:21px;font-weight:800;letter-spacing:-0.02em;margin-bottom:2px;color:var(--tx);}
.page-sub{font-family:'Tahoma','Geneva',sans-serif;font-size:10px;color:var(--tx3);text-transform:uppercase;letter-spacing:0.1em;}
.divider{border:none;border-top:1px solid var(--br);margin:13px 0;}
.empty-state{text-align:center;padding:36px;color:var(--tx3);font-family:'Tahoma','Geneva',sans-serif;font-size:11px;}
.g{color:var(--ok)!important;font-weight:700;}.r{color:var(--err)!important;}.a{color:var(--warn)!important;}


/* CLEAN CRM TABLE GRID */






.lead-url-open,
.lead-url-remove{
width:26px;
height:26px;
display:flex;
align-items:center;
justify-content:center;
}


/* force action icons to stay in last column */


.lead-url-actions button{
width:26px;
height:26px;
display:flex;
align-items:center;
justify-content:center;
}



/* FINAL GRID FIX */






.lead-url-actions button{
width:26px;
height:26px;
display:flex;
align-items:center;
justify-content:center;
}



/* === CLEAN CRM TABLE LAYOUT === */





.lead-url-row input,
.lead-url-row select{
width:100%;
}



.lead-url-open,
.lead-url-remove{
width:24px;
height:24px;
display:flex;
align-items:center;
justify-content:center;
font-size:14px;
cursor:pointer;
}

.lead-url-row:hover{
background:var(--color-bg);
}




/* FIX ASSIGN + ICON LAYOUT */


.lead-url-actions select{
min-width:120px;
}

.lead-url-open,
.lead-url-remove{
width:24px;
height:24px;
display:flex;
align-items:center;
justify-content:center;
}



/* CRM TABLE FIX — PROPER COLUMN GRID */


/* keep icons aligned */


/* prevent dropdown wrap */
.lead-url-row select,
.lead-url-row input{
min-width:0;
}

/* hover like CRM */
.lead-url-row:hover{
background:var(--color-bg);
}




/* FINAL CRM GRID FIX */







/* FINAL HEADER + ROW GRID ALIGNMENT */
.lead-urls-col-row,





/* FINAL LEAD GRID FIX */
.lead-urls-col-headers{
  display:grid !important;
  grid-template-columns: 180px 170px 90px 80px 100px 100px 80px 70px 80px 120px 80px 95px 70px 90px !important;
  gap:6px !important;
  align-items:center !important;
  width:1606px !important;
}

.lead-url-row{
  display:grid !important;
  grid-template-columns: 180px 170px 90px 80px 100px 100px 80px 70px 80px 120px 80px 95px 70px 90px !important;
  gap:6px !important;
  align-items:center !important;
  width:1606px !important;
  padding:6px 0 !important;
}

.lead-url-row > *{
  min-width:0 !important;
}

.lead-url-actions{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:3px !important;
  grid-column: 13 !important;
  white-space:nowrap !important;
  flex-wrap:nowrap !important;
}

.lead-url-open,
.lead-url-remove{
  width:24px !important;
  height:24px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}

.lead-url-select,
.lead-url-input{
  width:100% !important;
  box-sizing:border-box !important;
}



/* lead analysis columns defined above */




/* FIX mixed alignment in Lead Analysis rows — grid defined above with 13 columns */
.lead-url-row > *{
  min-width:0 !important;
}

/* hide extra inline badges/text that are breaking the grid */
.lead-url-row > span,
.lead-url-row > .pending-chip,
.lead-url-row > .approved-chip,
.lead-url-row > .rejected-chip,
.lead-url-row > .mgr-review-status,
.lead-url-row > .mgr-status-pending,
.lead-url-row > .mgr-status-approved,
.lead-url-row > .mgr-status-rejected{
  display:none !important;
}

/* keep assign/actions aligned */
.lead-url-actions{
  grid-column: 13 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:6px !important;
}

/* ═══════════════════════════════════════════════════════════════
   PREMIUM REDESIGN — Additive Design System
   ═══════════════════════════════════════════════════════════════
   New variables + component classes layered on top of the legacy
   system above. Coexists so legacy panels (rep cards, form
   sections) keep working until they're migrated class-by-class.
   Don't introduce a new variable name that already exists upstream
   — the old vars (--bg, --tx, --ok, --br...) stay until every
   consumer is moved over.
   ═══════════════════════════════════════════════════════════════ */
:root {
  /* ─────────────────────────────────────────────────────────
     Theme palette — SINGLE SOURCE OF TRUTH for every inline color.
     All hardcoded colors in style="..." attributes and component
     CSS were replaced with these semantic variables, so the whole
     theme is reconfigurable from this block alone. Change a value
     here and it propagates everywhere.
     ───────────────────────────────────────────────────────── */
  /* Primary (navigation, headers, primary buttons) */
  --color-primary: #0f172a;
  --color-primary-light: #1e293b;
  --color-primary-dark: #0f2440;
  /* Accent (links, interactive, info) */
  --color-accent: #2563eb;
  --color-accent-light: #60a5fa;
  --color-accent-soft: #eff6ff;
  /* Status — success */
  --color-success: #10b981;
  --color-success-dark: #15803d;
  --color-success-soft: #ecfdf5;
  /* Status — warning */
  --color-warning: #f59e0b;
  --color-warning-dark: #92400e;
  --color-warning-soft: #fffbeb;
  /* Status — danger */
  --color-danger: #ef4444;
  --color-danger-dark: #b91c1c;
  --color-danger-soft: #fef2f2;
  /* Neutrals */
  --color-bg: #f1f5f9;
  --color-card: #ffffff;
  --color-border: #e2e8f0;
  --color-border-light: #f1f5f9;
  --color-text: #0f172a;
  --color-text-secondary: #64748b;
  --color-text-muted: #94a3b8;
  --color-text-inverse: #ffffff;
  /* Categorical scale — distinct hues for category-coded displays
     (Attendance table) where status must be told apart at a glance.
     Intentionally a multi-hue scale, separate from the single-family
     theme above. */
  --color-cat-present: #10b981;
  --color-cat-absent: #ef4444;
  --color-cat-half-day: #f59e0b;
  --color-cat-wfh: #6366f1;
  --color-cat-leave: #8b5cf6;
  --color-cat-holiday: #06b6d4;
  /* (shadow tokens --shadow-sm/md/lg are defined below in this block) */

  /* Brand — deep blue for primary affordances */
  --brand-primary: #1e40af;
  --brand-primary-hover: #1e3a8a;
  --brand-primary-soft: #dbeafe;
  --brand-accent: #0f766e;

  /* Status — emerald / amber / red / sky with soft tints */
  --status-success: #059669;
  --status-success-soft: #ecfdf5;
  --status-warning: #d97706;
  --status-warning-soft: #fffbeb;
  --status-danger: #dc2626;
  --status-danger-soft: #fef2f2;
  --status-info: #0284c7;
  --status-info-soft: #f0f9ff;

  /* Surfaces — cool gray scale */
  --bg-page: #f8fafc;
  --bg-card: #ffffff;
  --bg-elevated: #ffffff;
  --bg-inset: #f1f5f9;
  --bg-hover: #f8fafc;

  /* Borders */
  --border-default: #e2e8f0;
  --border-light: #f1f5f9;
  --border-focus: #1e40af;

  /* Text */
  --text-primary: #0f172a;
  --text-secondary: #475569;
  --text-tertiary: #94a3b8;
  --text-inverse: #ffffff;
  --text-link: #1e40af;

  /* Typography */
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-mono: 'JetBrains Mono', 'SF Mono', 'Fira Code', monospace;
  --text-xs: 0.75rem;
  --text-sm: 0.8125rem;
  --text-base: 0.875rem;
  --text-md: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.375rem;
  --text-2xl: 1.75rem;
  --text-3xl: 2.25rem;
  --weight-normal: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;
  --leading-tight: 1.25;
  --leading-normal: 1.5;

  /* Spacing */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;

  /* Radii / Shadows */
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-full: 9999px;
  --shadow-xs: 0 1px 2px rgba(0,0,0,0.04);
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04);
  --shadow-md: 0 4px 8px -2px rgba(0,0,0,0.06), 0 2px 4px -2px rgba(0,0,0,0.04);
  --shadow-lg: 0 12px 24px -4px rgba(0,0,0,0.08), 0 4px 8px -4px rgba(0,0,0,0.03);
  --shadow-focus: 0 0 0 3px rgba(30,64,175,0.15);

  /* Transitions */
  --ease-default: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-out: cubic-bezier(0, 0, 0.2, 1);
  --duration-fast: 150ms;
  --duration-normal: 200ms;
  --duration-slow: 300ms;
}

/* ── Tab Bar (in-place upgrade of .tab-row / .tbtn) ───────
   Keeps the same class names so existing markup carries over,
   but replaces chunky bordered chips with a clean underline tab
   row (Linear / Stripe / Vercel feel). */
.tab-row {
  background: var(--bg-card);
  border-bottom: 1px solid var(--border-default);
  box-shadow: none;
  padding: 0 var(--space-6);
  gap: 0;
}
.tbtn {
  font-family: var(--font-sans);
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
  color: var(--text-tertiary);
  padding: var(--space-3) var(--space-5);
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  letter-spacing: 0;
  transition: color var(--duration-fast) var(--ease-default),
              border-color var(--duration-fast) var(--ease-default);
}
.tbtn:hover { color: var(--text-secondary); }
.tbtn.active {
  color: var(--brand-primary);
  border-bottom-color: var(--brand-primary);
  font-weight: var(--weight-semibold);
}
.tbtn .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--text-tertiary); flex-shrink: 0; }
.tbtn .dot.filled  { background: var(--status-success); box-shadow: none; }
.tbtn .dot.partial { background: var(--status-warning); box-shadow: none; }
.tab-divider { background: var(--border-default); }

/* ── Cards / Stat Cards ───────────────────────────────── */
.card {
  background: var(--bg-card);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-lg);
  padding: var(--space-6);
  box-shadow: var(--shadow-xs);
  transition: box-shadow var(--duration-normal) var(--ease-default),
              transform var(--duration-normal) var(--ease-default);
}
.card:hover { box-shadow: var(--shadow-md); }

.stat-card {
  background: var(--bg-card);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-lg);
  padding: var(--space-5) var(--space-6);
  box-shadow: var(--shadow-xs);
  transition: box-shadow var(--duration-normal) var(--ease-default),
              transform var(--duration-normal) var(--ease-default);
}
.stat-card:hover { box-shadow: var(--shadow-md); transform: translateY(-1px); }
.stat-card .stat-label {
  font-family: var(--font-sans);
  font-size: var(--text-xs);
  font-weight: var(--weight-semibold);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-tertiary);
  margin-bottom: var(--space-2);
}
.stat-card .stat-value {
  font-family: var(--font-sans);
  font-size: var(--text-2xl);
  font-weight: var(--weight-bold);
  color: var(--text-primary);
  line-height: var(--leading-tight);
  font-variant-numeric: tabular-nums;
}
.stat-card .stat-subtitle {
  font-size: var(--text-xs);
  color: var(--text-tertiary);
  margin-top: var(--space-1);
}

/* ── Data Tables ─────────────────────────────────────── */
.data-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-family: var(--font-sans);
  font-size: var(--text-sm);
}
.data-table thead th {
  background: var(--bg-inset);
  color: var(--text-tertiary);
  font-weight: var(--weight-semibold);
  text-transform: uppercase;
  font-size: 0.6875rem;
  letter-spacing: 0.06em;
  padding: var(--space-3) var(--space-4);
  border-bottom: 1px solid var(--border-default);
  text-align: left;
  position: sticky;
  top: 0;
  z-index: 1;
}
.data-table tbody td {
  padding: var(--space-3) var(--space-4);
  border-bottom: 1px solid var(--border-light);
  color: var(--text-secondary);
}
.data-table tbody tr { transition: background var(--duration-fast) var(--ease-default); }
.data-table tbody tr:hover td { background: var(--bg-hover); }
.data-table tbody tr:last-child td { border-bottom: none; }
.data-table tfoot td {
  padding: var(--space-3) var(--space-4);
  font-weight: var(--weight-semibold);
  color: var(--text-primary);
  border-top: 2px solid var(--border-default);
  background: var(--bg-inset);
}
.data-table .num { font-variant-numeric: tabular-nums; text-align: right; }
.data-table .mono { font-family: var(--font-mono); font-size: var(--text-xs); }
/* Fixed-layout variant: the table fills 100% of its container at explicit
   per-column widths (set via <colgroup>), so it never grows past the
   viewport and the Actions column (Accept/Reject) is always on screen with
   no horizontal scroll. Text cells truncate with an ellipsis + title. */
.data-table.fixed-cols { table-layout: fixed; width: 100%; }
.data-table.fixed-cols th,
.data-table.fixed-cols td {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* Actions cell: let its buttons wrap onto multiple lines within the
   column width instead of being clipped. */
.data-table.fixed-cols td.cell-actions {
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  /* Stack actions vertically: Accept line, dropdown+Assign line, Dismiss/
     Reject line — keeps the crowded disputes cells legible. */
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-start;
}
.data-table.fixed-cols td.cell-actions .btn-new {
  font-size: 11px;
  padding: 3px 8px;
  margin: 0;
}
/* dropdown + its Assign button sit together on one line within the column */
.data-table.fixed-cols td.cell-actions .action-row {
  display: flex;
  gap: 4px;
  align-items: center;
}
/* Split rep-picker: a compact wrap of checkboxes (tick 2-3 → Split), so the
   manager never has to Cmd-click a multi-select. Shared by every section that
   offers Split (Attribution Holds, Disputed Attributions, Sales-Assisted). */
.data-table.fixed-cols td.cell-actions .action-split { align-items: flex-start; flex-wrap: wrap; }
.split-reps {
  display: flex;
  flex-wrap: wrap;
  gap: 2px 6px;
  max-width: 150px;
}
.split-rep-chk {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 10px;
  line-height: 1.4;
  color: var(--text-secondary);
  white-space: nowrap;
  cursor: pointer;
}
.split-rep-chk input { margin: 0; cursor: pointer; }

/* ── Buttons (new system — coexists with legacy .btn .btn-ok) ─ */
.btn-new {
  font-family: var(--font-sans);
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
  padding: var(--space-2) var(--space-4);
  border-radius: var(--radius-md);
  border: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  transition: all var(--duration-fast) var(--ease-default);
  line-height: var(--leading-tight);
}
.btn-new:active { transform: scale(0.97); transition-duration: 50ms; }
.btn-primary {
  background: var(--brand-primary);
  color: var(--text-inverse);
  box-shadow: var(--shadow-xs);
}
.btn-primary:hover {
  background: var(--brand-primary-hover);
  box-shadow: var(--shadow-sm);
  transform: translateY(-1px);
}
.btn-success { background: var(--status-success); color: var(--text-inverse); }
.btn-success:hover { filter: brightness(1.08); transform: translateY(-1px); }
.btn-danger  { background: var(--status-danger);  color: var(--text-inverse); }
.btn-danger:hover  { filter: brightness(1.08); transform: translateY(-1px); }
.btn-outline {
  background: transparent;
  border: 1px solid var(--border-default);
  color: var(--text-secondary);
}
.btn-outline:hover { background: var(--bg-inset); border-color: var(--text-tertiary); }
.btn-ghost {
  background: transparent;
  color: var(--text-secondary);
  padding: var(--space-1) var(--space-2);
}
.btn-ghost:hover { background: var(--bg-inset); color: var(--text-primary); }
.btn-new.btn-sm-new {
  font-size: var(--text-xs);
  padding: var(--space-1) var(--space-3);
}

/* ── Badges (pill-shaped, muted) ──────────────────────── */
.badge {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  padding: 2px var(--space-2);
  border-radius: var(--radius-full);
  font-family: var(--font-sans);
  font-size: var(--text-xs);
  font-weight: var(--weight-semibold);
  letter-spacing: 0.02em;
  line-height: 1.6;
}
.badge-success { background: var(--status-success-soft); color: var(--status-success); }
.badge-warning { background: var(--status-warning-soft); color: var(--status-warning); }
.badge-danger  { background: var(--status-danger-soft);  color: var(--status-danger); }
.badge-info    { background: var(--status-info-soft);    color: var(--status-info); }
.badge-neutral { background: var(--bg-inset);            color: var(--text-tertiary); }

/* ── AI checklist badge + popover (Disputed Orders tab) ──────
   The badge is small + inline; the checklist is a position:fixed popover
   (appended to <body> in disputes.js) so it escapes the fixed table cell's
   overflow:hidden and never widens the table / causes horizontal overflow. */
.ai-verdict-cell { display: flex; flex-direction: column; gap: 3px; align-items: flex-start; }

.ai-badge {
  display: inline-block;
  max-width: 120px;
  padding: 1px 7px;
  border-radius: var(--radius-full);
  font-size: 10px;
  font-weight: var(--weight-semibold);
  line-height: 1.6;
  white-space: nowrap;
  cursor: pointer;
  border: 1px solid transparent;
  user-select: none;
}
.ai-badge:hover { filter: brightness(0.96); }
.ai-badge.helped     { background: var(--status-success-soft); color: var(--status-success); }
.ai-badge.not-helped { background: var(--status-danger-soft);  color: var(--status-danger); }
.ai-badge.unclear    { background: var(--status-warning-soft); color: var(--status-warning); }
.ai-badge.late-note  { background: #fff1e0; color: #d9730b; }

.ai-checklist {
  display: none;                 /* shown (block) on badge click */
  position: fixed;
  z-index: 1000;
  width: 220px;
  max-width: calc(100vw - 16px);
  padding: 10px 12px;
  background: var(--s1);
  border: 1px solid var(--br);
  border-radius: 8px;
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.16);
  font-size: 11px;
  color: var(--text-primary);
}
.ai-checklist-header { font-weight: var(--weight-bold); margin-bottom: 6px; }
.ai-checklist-timeline {
  margin: 4px 0 6px;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--br);
  font-size: 10px;
  color: #d9730b;
}
.ai-checklist-item { display: flex; gap: 6px; padding: 2px 0; align-items: center; }
.ai-checklist-item.true  { color: var(--status-success); }
.ai-checklist-item.false { color: var(--text-tertiary); }
.ai-checklist-confidence {
  margin-top: 6px;
  padding-top: 6px;
  border-top: 1px solid var(--br);
  font-weight: var(--weight-semibold);
}

/* ⚠️ manager-override flag on the Orders Placed table (rep page). The icon
   sits AFTER the order number; the row gets a subtle yellow tint. Neither
   affects column widths or the fixed table layout. */
.override-flagged { background: #fffbe6; }
.override-icon { cursor: pointer; font-size: 12px; margin-left: 4px; }

/* ── QMS Per-Rep Scorecard (Dashboard tab) ── metrics rows × rep cols + Total.
   Reuses .data-table chrome; adds sticky metric + Total columns, tier tinting,
   and green/red color-coding mirroring the QMS sheet. */
.qms-scorecard { font-size: var(--text-sm); }
.qms-scorecard th, .qms-scorecard td { white-space: nowrap; }
.qms-scorecard td.qms-num, .qms-scorecard th:not(.qms-metric-col) { text-align: right; font-variant-numeric: tabular-nums; }
.qms-scorecard .qms-metric-col {
  text-align: left;
  position: sticky; left: 0; z-index: 2;
  background: var(--bg-inset, var(--color-card));
  font-weight: var(--weight-semibold);
}
.qms-scorecard thead .qms-metric-col { z-index: 3; }
.qms-scorecard .qms-total-col {
  position: sticky; right: 0; z-index: 2;
  background: var(--bg-inset, var(--color-card));
  font-weight: var(--weight-bold, 700);
}
.qms-scorecard thead .qms-total-col { z-index: 3; }
/* Green = good, red = bad (per-row rules set in js). */
.qms-scorecard td.qms-good { color: var(--color-success, #0d9f6e); font-weight: var(--weight-semibold); }
.qms-scorecard td.qms-bad  { color: var(--color-danger, #dc2626); font-weight: var(--weight-semibold); }
/* Tier-3 deferred rows + engine-unavailable cells render greyed. */
.qms-scorecard .qms-na, .qms-scorecard .qms-na-cell { color: var(--text-tertiary, #94a3b8); }
.qms-scorecard tr.qms-tier3 td { color: var(--text-tertiary, #94a3b8); font-style: italic; }
.qms-scorecard tr.qms-tier1 td.qms-metric-col::after { content: ' ⚙'; color: var(--text-tertiary, #94a3b8); font-size: 10px; }
.qms-scorecard tr.qms-score-row td, .qms-scorecard tr.qms-rank-row td {
  border-top: 2px solid var(--border-default, #e2e8f0);
  font-weight: var(--weight-bold, 700);
}
.qms-scorecard td.qms-score { color: var(--color-primary, #2563eb); }
.qms-scorecard td.qms-rank  { color: var(--text-secondary); }
.qms-engine-warn {
  background: var(--color-warning-soft, #fef3c7);
  color: var(--color-warning, #b45309);
  font-size: 12px; padding: 8px 12px; border-radius: 6px; margin-bottom: 10px;
}

/* ── Disputed Orders — shared section chrome (every top-level section) ── */
/* Uniform header for each dispute section: bold icon+title + muted one-liner. */
.dispute-top-header {
  display: flex;
  align-items: baseline;
  gap: 10px;
  flex-wrap: wrap;
  margin: 0 0 8px;
}
.dispute-top-title {
  font-size: 13px;
  font-weight: var(--weight-bold, 700);
  color: var(--color-primary);
}
.dispute-top-desc {
  font-size: 11px;
  color: var(--color-text-secondary);
}
/* Uniform container for each section's table — same card chrome + spacing. */
.dispute-section-card {
  overflow-x: auto;
  background: var(--color-card);
  border: 1px solid var(--color-border);
  border-radius: 8px;
  margin-bottom: 24px;
}
.dispute-section-card--last { margin-bottom: 0; }

/* ── Disputed Orders — Sales-Assisted sub-sections (section 2 only) ── */
.dispute-summary {
  display: flex;
  gap: var(--space-4);
  padding: var(--space-3);
  background: var(--bg-inset);
  border-radius: var(--radius-md);
  margin-bottom: var(--space-4);
  font-size: var(--text-sm);
  flex-wrap: wrap;
}
.dispute-summary span { padding: var(--space-1) var(--space-2); border-radius: var(--radius-sm); }
.dispute-section-header {
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-2) 0;
  font-weight: var(--weight-semibold);
  user-select: none;
}
.dispute-section-header .badge {
  background: var(--color-danger);
  color: white;
  border-radius: var(--radius-full);
  padding: 2px 8px;
  font-size: var(--text-xs);
}
.dispute-section.collapsed .dispute-section-body { display: none; }

/* ── Dashboard executive summary (Dashboard tab, above the KPI framework) ──
   All rules scoped under .dashboard-summary so the .kpi-card / .kpi-grid here
   don't collide with the global rep/perf-page cards of the same name. */
.dashboard-summary { margin-bottom: var(--space-6); }
.dashboard-summary .kpi-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-4);
  margin-bottom: var(--space-6);
}
.dashboard-summary .kpi-card {
  background: var(--bg-card);
  border: 1px solid var(--border-default);
  border-left: 4px solid var(--color-accent);
  border-radius: var(--radius-lg);
  padding: var(--space-4);
}
.dashboard-summary .kpi-card .kpi-value {
  font-size: var(--text-2xl);
  font-weight: var(--weight-bold);
  color: var(--text-primary);
  line-height: 1.2;
}
.dashboard-summary .kpi-card .kpi-label {
  font-size: var(--text-sm);
  color: var(--text-secondary);
  margin-top: 4px;
}
.dashboard-summary .ds-section {
  background: var(--bg-card);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-lg);
  padding: var(--space-4);
  margin-bottom: var(--space-4);
}
.dashboard-summary .ds-section-title {
  font-size: var(--text-sm);
  font-weight: var(--weight-bold);
  color: var(--text-primary);
  margin-bottom: var(--space-3);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.dashboard-summary .ds-bar-row {
  display: grid;
  grid-template-columns: 120px 1fr 110px;
  align-items: center;
  gap: var(--space-3);
  margin-bottom: 6px;
}
.dashboard-summary .ds-bar-label {
  font-size: var(--text-sm);
  color: var(--text-primary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.dashboard-summary .ds-bar-track {
  background: var(--bg-inset);
  border-radius: var(--radius-md);
  overflow: hidden;
}
.dashboard-summary .revenue-bar {
  height: 28px;
  background: var(--color-primary);
  border-radius: var(--radius-md);
  transition: width 0.3s;
  min-width: 2px;
}
.dashboard-summary .source-bar {
  height: 20px;
  border-radius: var(--radius-sm);
  transition: width 0.3s;
  min-width: 2px;
}
.dashboard-summary .ds-bar-value {
  font-size: var(--text-sm);
  color: var(--text-secondary);
  text-align: right;
  white-space: nowrap;
}
.dashboard-summary .ds-orders-table { width: 100%; border-collapse: collapse; font-size: var(--text-sm); }
.dashboard-summary .ds-orders-table th {
  text-align: left;
  color: var(--text-secondary);
  font-weight: var(--weight-semibold);
  padding: 6px 8px;
  border-bottom: 1px solid var(--border-default);
}
.dashboard-summary .ds-orders-table td {
  padding: 6px 8px;
  border-bottom: 1px solid var(--border-light);
  color: var(--text-primary);
}
.dashboard-summary .ds-empty { color: var(--text-secondary); font-size: var(--text-sm); padding: 8px 0; }
@media (max-width: 900px) { .dashboard-summary .kpi-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) {
  .dashboard-summary .kpi-grid { grid-template-columns: 1fr; }
  .dashboard-summary .ds-bar-row { grid-template-columns: 90px 1fr 80px; }
}

/* ── Section Headers ─────────────────────────────────── */
.section-header {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  margin-bottom: var(--space-5);
  padding-bottom: var(--space-3);
  border-bottom: 1px solid var(--border-light);
}
.section-header h2, .section-header h3 {
  font-family: var(--font-sans);
  font-size: var(--text-lg);
  font-weight: var(--weight-bold);
  margin: 0;
  color: var(--text-primary);
}
.section-header .count {
  background: var(--brand-primary-soft);
  color: var(--brand-primary);
  font-family: var(--font-sans);
  font-size: var(--text-xs);
  font-weight: var(--weight-bold);
  padding: 2px 8px;
  border-radius: var(--radius-full);
}

/* ── Money Formatting ───────────────────────────────── */
.money { font-variant-numeric: tabular-nums; font-weight: var(--weight-semibold); }
.money-positive { color: var(--status-success); }
.money-negative { color: var(--status-danger); }
.money-zero     { color: var(--text-tertiary); }
.money-strikethrough { text-decoration: line-through; color: var(--status-danger); opacity: 0.7; }

/* ── Tier badges (Performance) ──────────────────────── */
.tier-star    { background: var(--status-success); color: var(--text-inverse); }
.tier-ontrack { background: var(--brand-primary); color: var(--text-inverse); }
.tier-needs   { background: var(--status-warning); color: var(--text-inverse); }
.tier-under   { background: var(--status-danger); color: var(--text-inverse); }

/* ── Score bars ─────────────────────────────────────── */
.score-bar {
  height: 6px;
  background: var(--bg-inset);
  border-radius: var(--radius-full);
  overflow: hidden;
}
.score-bar-fill {
  height: 100%;
  border-radius: var(--radius-full);
  transition: width var(--duration-slow) var(--ease-out);
}

/* ── Avatars ───────────────────────────────────────── */
.avatar {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-sans);
  font-size: var(--text-xs);
  font-weight: var(--weight-bold);
  color: var(--text-inverse);
  flex-shrink: 0;
}

/* ── Live dot (websocket / sync indicator) ──────────── */
@keyframes pulse-soft { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } }
.live-dot {
  width: 8px;
  height: 8px;
  background: var(--status-success);
  border-radius: 50%;
  animation: pulse-soft 2s var(--ease-default) infinite;
  display: inline-block;
}

/* ── Animations — subtle tab fade-in ──────────────── */
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}
.page.active { animation: fadeInUp var(--duration-slow) var(--ease-out); }

/* ── Input focus ring (additive — only triggers on
       elements that opt into the new system via .form-input) ── */
.form-input {
  font-family: var(--font-sans);
  font-size: var(--text-sm);
  padding: var(--space-2) var(--space-3);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-md);
  background: var(--bg-card);
  color: var(--text-primary);
  transition: border-color var(--duration-fast), box-shadow var(--duration-fast);
}
.form-input:focus {
  outline: none;
  border-color: var(--border-focus);
  box-shadow: var(--shadow-focus);
}

/* ── Zendesk link convention ───────────────────────── */
.zendesk-link {
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  color: var(--text-link);
  font-weight: var(--weight-medium);
}
.zendesk-link:hover { color: var(--brand-primary-hover); text-decoration: underline; }



/* --- CRM TABLE POLISH --- */





.lead-url-row select,
.lead-url-row input{
width:100%;
box-sizing:border-box;
}



.lead-url-actions button{
width:26px;
height:26px;
display:flex;
align-items:center;
justify-content:center;
}









.lead-url-row select,
.lead-url-row input{
width:100%;
}