/*
 * TPL HR - styles.
 *
 * Token block first; no raw hex past it. Built almost entirely on native
 * RISE classes (card, badge, appTable, panel); these rules add only the
 * completeness progress bar, the missing-field chips and the widget grid.
 */

:root {
    --tplhr-accent: var(--tpl-accent, #FF7707);
    --tplhr-ink:    #33383e;
    --tplhr-muted:  #8a949e;
    --tplhr-line:   #e4e8ec;
    --tplhr-track:  #eef1f4;
    --tplhr-good:   #2ab57d;
    --tplhr-warn:   #f7b924;
    --tplhr-bad:    #e02020;
}

/* Summary KPIs */
.tpl-hr-summary { margin-top: 4px; }
.tpl-hr-kpi { border: 1px solid var(--tplhr-line); margin-bottom: 16px; }
.tpl-hr-kpi-label {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .03em;
    color: var(--tplhr-muted);
}
.tpl-hr-kpi-value {
    font-size: 22px;
    font-weight: 700;
    color: var(--tplhr-ink);
    margin-top: 2px;
}
.tpl-hr-kpi-sub {
    font-size: 12px;
    color: var(--tplhr-muted);
    margin-top: 2px;
}

/* Completeness progress bar */
.tpl-hr-progress {
    display: inline-block;
    width: 90px;
    height: 8px;
    background: var(--tplhr-track);
    border-radius: 4px;
    overflow: hidden;
    vertical-align: middle;
}
.tpl-hr-progress-lg { width: 100%; height: 12px; }
.tpl-hr-progress-bar { height: 100%; }
.tpl-hr-progress-bar.bg-success { background: var(--tplhr-good); }
.tpl-hr-progress-bar.bg-warning { background: var(--tplhr-warn); }
.tpl-hr-progress-bar.bg-danger  { background: var(--tplhr-bad); }
.tpl-hr-progress-label {
    font-size: 12px;
    color: var(--tplhr-muted);
    margin-left: 6px;
    vertical-align: middle;
}

/* Missing-field chips */
.badge.tpl-hr-miss {
    font-weight: 500;
    margin-bottom: 2px;
}

/* Snapshot labels (profile tab) */
.tpl-hr-snap-label {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .03em;
    color: var(--tplhr-muted);
    margin-bottom: 4px;
}
.tpl-hr-snap-value {
    font-size: 16px;
    font-weight: 600;
    color: var(--tplhr-ink);
    margin-top: 4px;
}

.tpl-hr-emp-link { font-weight: 600; }

/* Dashboard widget */
.tpl-hr-widget .tpl-hr-widget-cell { padding: 8px 4px; }
.tpl-hr-widget-label {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .03em;
    color: var(--tplhr-muted);
}
.tpl-hr-widget-value {
    font-size: 18px;
    font-weight: 700;
    color: var(--tplhr-ink);
}