#tab-commissions-kpi{--ck-ink:#071b3d;--ck-muted:#647793;--ck-line:#dce7f3;--ck-blue:#0d6ff2;--ck-green:#10a56c;background:#f4f9ff;color:var(--ck-ink);padding:18px}.commissionKpiWorkspace{display:grid;gap:14px;margin:auto;max-width:1800px}.commissionKpiPanel{background:#fff;border:1px solid var(--ck-line);border-radius:14px;box-shadow:0 8px 22px rgba(12,56,104,.06);min-width:0}.commissionKpiIdentity{padding:18px}.commissionKpiHeader{align-items:flex-end;display:flex;gap:16px;justify-content:space-between}.commissionKpiHeader>div:first-child>span{color:#1374eb;font-size:10px;font-weight:850;letter-spacing:.16em}.commissionKpiHeader h2{color:var(--ck-ink);font-size:30px;margin:4px 0}.commissionKpiHeader p{color:var(--ck-muted);margin:0}.commissionKpiFilters{align-items:end;display:flex;gap:9px}.commissionKpiFilters label{display:grid;gap:5px}.commissionKpiFilters label>span{color:var(--ck-muted);font-size:11px;font-weight:700}.commissionKpiFilters select,.commissionKpiFilters a{background:#fff;border:1px solid #cbdced;border-radius:9px;color:#174b86;font:inherit;font-weight:700;min-height:40px;padding:8px 12px;text-decoration:none}.commissionKpiHero{align-items:center;border-top:1px solid #e6eef7;display:grid;gap:14px;grid-template-columns:auto minmax(180px,1fr) minmax(120px,.55fr) minmax(140px,.7fr) minmax(300px,1.2fr);margin-top:16px;padding-top:16px}.commissionKpiAvatar{align-items:center;background:linear-gradient(135deg,#3c95ff,#7c6df2);border-radius:50%;color:#fff;display:flex;font-size:20px;font-weight:800;height:58px;justify-content:center;width:58px}.commissionKpiPerson{display:grid;gap:3px}.commissionKpiPerson strong{color:var(--ck-ink);font-size:18px}.commissionKpiPerson small,.commissionKpiMeta span{color:var(--ck-muted);font-size:12px}.commissionKpiMeta{border-left:1px solid #e5edf6;display:grid;gap:4px;padding-left:16px}.commissionKpiMeta strong{color:var(--ck-ink)}.commissionKpiTrophy{align-items:center;background:#e9f9f2;border-radius:10px;display:flex;gap:12px;padding:12px}.commissionKpiTrophy>span{font-size:32px}.commissionKpiTrophy div{display:grid;grid-template-columns:auto auto;gap:2px 12px}.commissionKpiTrophy small{color:#268364}.commissionKpiTrophy strong{color:#073d34;font-size:26px;grid-row:2/4}.commissionKpiTrophy em{color:#147d5b;font-size:11px;font-style:normal}.commissionKpiCards{display:grid;gap:12px;grid-template-columns:repeat(4,minmax(0,1fr))}.commissionKpiCards article{display:grid;gap:6px;padding:15px 18px}.commissionKpiCards span,.commissionKpiCards small{color:var(--ck-muted);font-size:11px}.commissionKpiCards strong{color:var(--ck-ink);font-size:18px}.commissionKpiMain{display:grid;gap:14px;grid-template-columns:minmax(300px,.8fr) minmax(0,1.7fr)}.commissionKpiMain>article,.commissionKpiDetails>article{padding:18px}.commissionKpiMain h3,.commissionKpiDetails h3{color:var(--ck-ink);font-size:17px;margin:0 0 12px}.commissionKpiTotal{display:grid;grid-template-columns:190px 1fr;align-items:center}.commissionKpiTotal>h3,.commissionKpiTotal>p{grid-column:1/-1}.commissionKpiDonut{align-items:center;background:conic-gradient(var(--ck-green) calc(var(--commission-progress)*1%),#dfe8f3 0);border-radius:50%;display:flex;height:164px;justify-content:center;width:164px}.commissionKpiDonut:before{background:#fff;border-radius:50%;content:'';height:118px;position:absolute;width:118px}.commissionKpiDonut>div{display:grid;position:relative;text-align:center}.commissionKpiDonut strong{color:var(--ck-ink);font-size:28px}.commissionKpiDonut span{color:var(--ck-muted);font-size:11px}.commissionKpiTotal dl{display:grid;gap:11px}.commissionKpiTotal dl div{display:flex;justify-content:space-between}.commissionKpiTotal dt{color:var(--ck-muted);font-size:12px}.commissionKpiTotal dd{color:var(--ck-ink);font-size:12px;font-weight:800;margin:0}.commissionKpiTotal>p{background:#eaf8f1;border-radius:8px;color:#0b8057;font-size:12px;font-weight:700;padding:10px}.commissionKpiTableScroll{max-width:100%;overflow-x:auto}.commissionKpiCategoryTable,.commissionKpiCalculationTable{border-collapse:collapse;min-width:680px;width:100%}.commissionKpiCategoryTable :is(th,td),.commissionKpiCalculationTable :is(th,td){border-bottom:1px solid #e5edf6;padding:9px 10px;text-align:left}.commissionKpiCategoryTable th,.commissionKpiCalculationTable th{background:#f1f6fc;color:#506781;font-size:10px}.commissionKpiCategoryTable td,.commissionKpiCalculationTable td{color:#173456;font-size:11px}.commissionKpiCategoryTable td:first-child{align-items:center;display:flex;gap:8px}.commissionKpiCategoryTable td:first-child i{background:hsl(calc(205 + var(--category-index)*42),75%,55%);border-radius:50%;height:10px;width:10px}.commissionKpiBar{background:#e5ecf5;border-radius:99px;display:inline-block;height:7px;margin-right:7px;overflow:hidden;width:110px}.commissionKpiBar i{background:linear-gradient(90deg,#2b87f6,#6b65ef);display:block;height:100%}.commissionKpiCategoryTable td:last-child span{background:#dff7eb;border-radius:99px;color:#088057;font-weight:800;padding:4px 8px}.commissionKpiDetails{display:grid;gap:14px;grid-template-columns:minmax(300px,.9fr) minmax(0,1.5fr)}.commissionKpiTrend>small{color:var(--ck-muted)}.commissionKpiTrend svg{height:auto;margin-top:10px;overflow:visible;width:100%}.commissionKpiTrend svg line{stroke:#d7e2ef;stroke-width:1}.commissionKpiTrend svg polyline{fill:none;stroke:#2687f4;stroke-width:4}.commissionKpiTrend svg circle{fill:#fff;stroke:#2687f4;stroke-width:3}.commissionKpiTrend svg text{fill:#687c97;font-size:10px}.commissionKpiCalculationTable tfoot{background:#e9f3ff;font-weight:800}.commissionKpiEmpty{background:#fff;border:1px dashed #bbcee3;border-radius:14px;color:#61728f;font-size:16px;font-weight:700;padding:50px;text-align:center}body[data-theme-mode="dark"] #tab-commissions-kpi :is(.commissionKpiHeader h2,.commissionKpiPerson strong,.commissionKpiMeta strong,.commissionKpiCards strong,.commissionKpiMain h3,.commissionKpiDetails h3,.commissionKpiDonut strong,.commissionKpiTotal dd,.commissionKpiCategoryTable td,.commissionKpiCalculationTable td){color:#071b3d!important;-webkit-text-fill-color:#071b3d!important}body[data-theme-mode="dark"] #tab-commissions-kpi :is(.commissionKpiPanel,.commissionKpiFilters select,.commissionKpiFilters a){background:#fff!important}
#tab-commissions-kpi{font-family:Inter,"Segoe UI",Arial,sans-serif}
body[data-theme-mode="dark"] #tab-commissions-kpi :is(.commissionKpiHeader h2,.commissionKpiHeader p,.commissionKpiHeader span,.commissionKpiFilters label>span,.commissionKpiFilters select,.commissionKpiFilters a,.commissionKpiPerson strong,.commissionKpiPerson small,.commissionKpiMeta span,.commissionKpiMeta strong,.commissionKpiCards span,.commissionKpiCards strong,.commissionKpiCards small,.commissionKpiMain h3,.commissionKpiDetails h3,.commissionKpiTotal dt,.commissionKpiTotal dd,.commissionKpiTotal p,.commissionKpiCategoryTable th,.commissionKpiCategoryTable td,.commissionKpiCategoryTable td strong,.commissionKpiCalculationTable th,.commissionKpiCalculationTable td,.commissionKpiTrend small,.commissionKpiEmpty){color:#071b3d!important;-webkit-text-fill-color:#071b3d!important}
.commissionKpiDonut{position:relative}
@media(prefers-reduced-motion:reduce){#tab-commissions-kpi *{animation:none!important;transition:none!important}}
@media(max-width:980px){#tab-commissions-kpi{padding:12px}.commissionKpiHeader{align-items:flex-start;flex-direction:column}.commissionKpiFilters{overflow-x:auto;width:100%}.commissionKpiHero{grid-template-columns:auto 1fr 1fr}.commissionKpiTrophy{grid-column:1/-1}.commissionKpiCards{grid-template-columns:repeat(2,minmax(0,1fr))}.commissionKpiMain,.commissionKpiDetails{grid-template-columns:1fr}}
@media(max-width:560px){#tab-commissions-kpi{overflow-x:hidden;padding:10px}.commissionKpiIdentity{padding:12px}.commissionKpiHeader h2{font-size:25px}.commissionKpiFilters{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.commissionKpiFilters label{min-width:0}.commissionKpiFilters select{box-sizing:border-box;max-width:100%;width:100%}.commissionKpiFilters a{grid-column:1/-1;text-align:center}.commissionKpiHero{grid-template-columns:auto 1fr}.commissionKpiMeta{border-left:0;border-top:1px solid #e5edf6;padding:10px 0 0}.commissionKpiTrophy{grid-column:1/-1}.commissionKpiCards{grid-template-columns:1fr 1fr;gap:8px}.commissionKpiCards article{padding:12px}.commissionKpiTotal{grid-template-columns:1fr}.commissionKpiDonut{margin:auto}.commissionKpiTotal dl{margin-top:14px}.commissionKpiCategoryTable,.commissionKpiCalculationTable{min-width:660px}.commissionKpiMain>article,.commissionKpiDetails>article{padding:12px}.commissionKpiEmpty{padding:32px 16px}}
html body[data-theme-mode] .tabPane#tab-commissions-kpi :is(.commissionKpiHeader h2,.commissionKpiHeader p,.commissionKpiFilters label>span,.commissionKpiFilters select,.commissionKpiFilters a,.commissionKpiPerson strong,.commissionKpiPerson small,.commissionKpiMeta span,.commissionKpiMeta strong,.commissionKpiCards span,.commissionKpiCards strong,.commissionKpiCards small,.commissionKpiMain h3,.commissionKpiDetails h3,.commissionKpiTotal dt,.commissionKpiTotal dd,.commissionKpiTotal p,.commissionKpiCategoryTable th,.commissionKpiCategoryTable td,.commissionKpiCategoryTable td strong,.commissionKpiCalculationTable th,.commissionKpiCalculationTable td,.commissionKpiTrend small,.commissionKpiEmpty){color:#071b3d!important;-webkit-text-fill-color:#071b3d!important}
html body[data-theme-mode] .tabPane#tab-commissions-kpi :is(.commissionKpiPanel,.commissionKpiFilters select,.commissionKpiFilters a,.commissionKpiEmpty){background:#fff!important}
html body[data-theme-mode] .tabPane#tab-commissions-kpi .commissionKpiTrophy :is(small,strong,em){color:#073d34!important;-webkit-text-fill-color:#073d34!important}