/* HCM ▸ Employees (v1.6). Howie's style: charcoal lines, yellow accent rules, white backgrounds; status = text colour only; no blue. */
.hce { color: var(--hh-charcoal, #121212); }
.hce-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: .3rem 1rem; margin-bottom: .4rem; }
.hce-title { font-family: var(--font-display, "Bebas Neue", Impact, sans-serif); font-size: 1.7rem; letter-spacing: .04em; margin: 0; border-bottom: 4px solid var(--hh-yellow, #FFF200); line-height: 1.05; }
.hce-head p { margin: 0; font-size: .78rem; }
.hce-filters { display: flex; flex-wrap: wrap; gap: .5rem .9rem; align-items: flex-end; margin: .5rem 0 .7rem; padding-bottom: .6rem; border-bottom: 2px solid var(--hh-charcoal, #121212); }
.hce-filters label { display: flex; flex-direction: column; font-size: .66rem; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: var(--hh-muted, #5a5a5a); gap: .15rem; }
.hce-filters select, .hce-filters input, .hce-form select, .hce-form input { font: inherit; font-size: .82rem; font-weight: 600; text-transform: none; letter-spacing: 0; color: var(--hh-charcoal, #121212);
  border: 1.5px solid var(--hh-charcoal, #121212); border-radius: 6px; padding: .28rem .45rem; background: #fff; min-width: 8rem; }
.hce-filters .hce-search { flex: 1 1 14rem; } .hce-filters .hce-search input { width: 100%; }
.hce-filters select:focus, .hce-filters input:focus, .hce-form select:focus, .hce-form input:focus { outline: 2px solid var(--hh-yellow, #FFF200); outline-offset: 1px; }
.hce-body { display: flex; gap: 1rem; align-items: flex-start; }
.hce-main { flex: 1 1 auto; min-width: 0; }
.hce-tablewrap { overflow-x: auto; }
table.hce-table { width: 100%; border-collapse: collapse; font-size: .78rem; }
table.hce-table th { text-align: left; font-size: .64rem; text-transform: uppercase; letter-spacing: .05em; color: var(--hh-muted, #5a5a5a); background: transparent; border-bottom: 2px solid var(--hh-charcoal, #121212); padding: .35rem .45rem; white-space: nowrap; }
table.hce-table td { padding: .4rem .45rem; border-bottom: 1px solid rgba(18, 18, 18, .14); vertical-align: top; }
table.hce-table th.num, table.hce-table td.num { text-align: right; white-space: nowrap; }
table.hce-table tbody tr { cursor: pointer; }
table.hce-table tbody tr:hover td { border-bottom-color: var(--hh-charcoal, #121212); }
table.hce-table tbody tr.sel td { border-bottom: 2px solid var(--hh-red, #E4002B); }
table.hce-table tbody tr.sel td:first-child { box-shadow: inset 4px 0 0 var(--hh-red, #E4002B); }
table.hce-table tbody tr:focus { outline: 2px solid var(--hh-yellow, #FFF200); outline-offset: -2px; }
.hce-empty { padding: 1rem 0; }
.hce-detail { flex: 0 0 25rem; max-width: 25rem; border: 2px solid var(--hh-charcoal, #121212); border-radius: 10px; padding: .7rem .85rem; background: #fff; font-size: .78rem;
  position: sticky; top: .5rem; max-height: calc(100vh - 1rem); overflow-y: auto; }
.hce-dhead { display: flex; justify-content: space-between; gap: .5rem; align-items: flex-start; border-bottom: 3px solid var(--hh-yellow, #FFF200); padding-bottom: .4rem; margin-bottom: .5rem; }
.hce-dhead h3 { font-family: var(--font-display, "Bebas Neue", Impact, sans-serif); font-size: 1.45rem; letter-spacing: .03em; margin: 0; line-height: 1; }
.hce-dhead p { margin: .25rem 0 0; }
.hce-detail h4 { font-size: .66rem; text-transform: uppercase; letter-spacing: .06em; color: var(--hh-muted, #5a5a5a); font-weight: 800; margin: .75rem 0 .2rem; border-bottom: 1px solid rgba(18, 18, 18, .2); padding-bottom: .1rem; }
.hce-list { list-style: none; margin: 0; padding: 0; } .hce-list li { padding: .14rem 0; line-height: 1.3; }
.hce-dgrid { display: block; }
.hce-form { display: grid; grid-template-columns: 1fr 1fr; gap: .45rem .6rem; padding-bottom: .55rem; border-bottom: 2px solid var(--hh-charcoal, #121212); }
.hce-form label { display: flex; flex-direction: column; gap: .15rem; font-size: .64rem; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: var(--hh-muted, #5a5a5a); }
.hce-form select, .hce-form input { min-width: 0; width: 100%; box-sizing: border-box; }
.hce-form .hce-wide { grid-column: 1 / -1; } .hce-form p { margin: 0; }
.hce-form label.hce-chk { flex-direction: row; align-items: center; gap: .4rem; grid-column: 1 / -1; text-transform: none; letter-spacing: 0; font-size: .78rem; color: var(--hh-charcoal, #121212); font-weight: 700; }
.hce-form label.hce-chk input { width: auto; accent-color: #121212; }
.hce-save { font-size: .8rem !important; padding: .35rem .9rem !important; border-width: 2px !important; }
.hce-close { flex: 0 0 auto; }
.hce-admin { display: grid; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); gap: .8rem; margin-top: 1rem; }
.hce-box { border: 2px solid var(--hh-charcoal, #121212); border-radius: 10px; padding: .6rem .8rem; font-size: .78rem; background: #fff; }
.hce-box h3 { font-family: var(--font-display, "Bebas Neue", Impact, sans-serif); font-size: 1.15rem; letter-spacing: .04em; margin: 0 0 .3rem; font-weight: 400; }
.hce-box h3 .hcs-muted, .hce-box h3 .hcs-warn { font-family: inherit; font-size: .9rem; }
.hce-box ul { margin: 0; padding-left: 1rem; } .hce-box p { margin: 0; }
.hce-payroll { border-style: dashed; }
@media (max-width: 1100px) { .hce-detail { flex-basis: 21rem; max-width: 21rem; } }
@media (max-width: 600px) {
  .hce-title { font-size: 1.5rem; }
  .hce-filters { gap: .45rem; } .hce-filters label { flex: 1 1 45%; } .hce-filters .hce-search { flex: 1 1 100%; }
  .hce-filters select, .hce-filters input { min-height: 44px; font-size: 16px; min-width: 0; width: 100%; box-sizing: border-box; }
  .hce-cards { display: flex; flex-direction: column; gap: .5rem; }
  .hce-card { display: grid; grid-template-columns: 1fr auto; grid-template-areas: "name stat" "meta stat" "hrs hrs" "login login"; gap: .15rem .5rem; text-align: left; width: 100%;
    background: #fff; border: 1.5px solid var(--hh-charcoal, #121212); border-radius: 10px; padding: .55rem .7rem; font: inherit; font-size: .85rem; color: var(--hh-charcoal, #121212); box-shadow: none; cursor: pointer; }
  .hce-card:hover { background: #fff; transform: none; }
  .hce-card, .hce-card * { text-transform: none; letter-spacing: normal; }
  .hce-card .hce-cname { font-weight: 700; }
  .hce-card.sel { border: 2.5px solid var(--hh-red, #E4002B); }
  .hce-cname { grid-area: name; font-weight: 800; } .hce-cmeta { grid-area: meta; font-size: .8rem; } .hce-cstat { grid-area: stat; text-align: right; font-size: .8rem; }
  .hce-chrs { grid-area: hrs; font-size: .8rem; } .hce-clogin { grid-area: login; font-size: .76rem; overflow-wrap: anywhere; }
  .hce-body { display: block; }
  .hce-detail { position: fixed; inset: 0; z-index: 60; max-width: none; max-height: none; border: 0; border-radius: 0; padding: .8rem .9rem 2rem; font-size: .9rem; }
  .hce-form { grid-template-columns: 1fr; } .hce-form select, .hce-form input { min-height: 44px; font-size: 16px; }
  .hce-close, .hce-save { min-height: 44px; }
  .hce-admin { grid-template-columns: 1fr; }
}
/* 915: new-hire badge (outline only, no tinted background) */
.hce .hce-badge { display: inline-block; margin-left: .3rem; padding: 0 .35rem; border: 1.5px solid var(--hh-charcoal, #222); border-radius: 4px; background: #fff;
  color: var(--hh-charcoal, #222); font-size: .7rem; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; line-height: 1.35; white-space: nowrap; vertical-align: 1px; }
/* v1.6.4 recurring days off */
.hce-ruleform { display: flex; flex-wrap: wrap; gap: .35rem .6rem; align-items: flex-end; margin: .2rem 0 .6rem; }
.hce-ruleform label { display: flex; flex-direction: column; font-size: .72rem; font-weight: 800; }
.hce-ruleform select, .hce-ruleform input { font: inherit; font-size: .82rem; font-weight: 600; color: var(--hh-charcoal, #121212); border: 1px solid rgba(18, 18, 18, .3); border-radius: 6px; padding: .2rem .35rem; background: #fff; }
.hce-ruleform .hce-wide { flex: 1 1 12rem; }
/* v1.6.6 HR-only address + tax withholding (outline only, no tinted background, no blue) */
.hce-private { border: 1.5px dashed var(--hh-charcoal, #121212); border-radius: 8px; padding: .5rem .7rem .6rem; margin: .4rem 0 .8rem; }
.hce-private h4 { margin: 0 0 .25rem; } .hce-private > p { margin: .1rem 0; font-size: .82rem; }
.hce-pform fieldset { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .35rem .6rem; border: 1px solid rgba(18, 18, 18, .25); border-radius: 6px; margin: .3rem 0 0; padding: .35rem .55rem .5rem; min-width: 0; }
.hce-pform legend { font-size: .74rem; font-weight: 800; padding: 0 .25rem; }
/* HCM 2.8.18.3 (a11y): "off" W-4 fields (e.g. Exempt reason while SC exempt is unticked) were dimmed with opacity .45 = 2.06:1 light /
   2.71:1 dark. Now the muted token (dark twin via gen_dark_theme.py) + a dashed control border, full opacity. */
.hce-pform .hce-off { color: var(--hh-muted, #5a5a5a); }
.hce-pform .hce-off :is(input, select) { border-style: dashed; }
.hce-pwarn { font-size: .78rem; }
@media (max-width: 600px) { .hce-pform fieldset { grid-template-columns: 1fr; } }
/* v1.6.6.2 replace-confirm dialog (white card, charcoal border; no blue) */
.hce-modalwrap { position: fixed; inset: 0; z-index: 200; display: flex; align-items: center; justify-content: center; background: rgba(18, 18, 18, .45); padding: 1rem; }
.hce-modal { background: #fff; color: var(--hh-charcoal, #121212); border: 2px solid var(--hh-charcoal, #121212); border-radius: 10px; max-width: 26rem; width: 100%; padding: .9rem 1rem .8rem; box-shadow: 0 10px 30px rgba(0, 0, 0, .3); }
.hce-modal h4 { margin: 0 0 .4rem; font-size: 1rem; } .hce-modal p { margin: 0 0 .8rem; font-size: .9rem; line-height: 1.35; }
.hce-mbtns { display: flex; justify-content: flex-end; gap: .5rem; }
.hce-mbtns .hcs-act { min-height: 40px; min-width: 6rem; }
.hce-mbtns .hce-mreplace { background: #fff; color: var(--hh-red, #E4002B); border-color: var(--hh-red, #E4002B); font-weight: 800; }

/* 2.8.18.7: New hires & invites on Employees (same charcoal / yellow rules as Scheduling; no blue, no tinted backgrounds) */
.hce-htools { margin-left: auto; display: flex; flex-wrap: wrap; gap: .35rem; align-items: center; }
.hce-head { align-items: center; }
.hce-iform { margin: .6rem 0; }
.hce-iform h2 { font-family: var(--font-display, "Bebas Neue", Impact, sans-serif); font-size: 1.25rem; letter-spacing: .03em; margin: 0 0 .4rem; font-weight: 400; }
.hce-ifields { display: grid; grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr)); gap: .45rem .7rem; align-items: end; }
.hce-ifields label { display: flex; flex-direction: column; gap: .15rem; font-size: .64rem; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: var(--hh-muted, #5a5a5a); }
.hce-ifields label.hce-chk { flex-direction: row; align-items: center; gap: .4rem; text-transform: none; letter-spacing: 0; font-size: .78rem; color: var(--hh-charcoal, #121212); font-weight: 700; }
.hce-ifields label.hce-chk input { width: auto; accent-color: #121212; }
.hce-ifields input, .hce-ifields select { font: inherit; font-size: .82rem; font-weight: 600; text-transform: none; letter-spacing: 0; color: var(--hh-charcoal, #121212);
  border: 1.5px solid var(--hh-charcoal, #121212); border-radius: 6px; padding: .28rem .45rem; background: #fff; min-width: 0; width: 100%; box-sizing: border-box; }
.hce-ifields .hce-wide { grid-column: 1 / -1; }
.hce-iactions { margin-top: .55rem; display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; }
table.hce-inv { width: 100%; border-collapse: collapse; font-size: .78rem; }
table.hce-inv th { text-align: left; font-size: .64rem; text-transform: uppercase; letter-spacing: .05em; color: var(--hh-muted, #5a5a5a); border-bottom: 2px solid var(--hh-charcoal, #121212); padding: .35rem .45rem; white-space: nowrap; }
table.hce-inv td { padding: .4rem .45rem; border-bottom: 1px solid rgba(18, 18, 18, .14); vertical-align: top; }
@media (max-width: 600px) {
  .hce-htools { margin-left: 0; width: 100%; }
  .hce-htools .hcs-act { min-height: 44px; }
  .hce-ifields input, .hce-ifields select { min-height: 44px; font-size: 16px; }
}

/* 2.8.19: current pay on employee detail + Rate list column (admins / GMs) */
.hce-payblock { border: 1.5px solid var(--hh-charcoal, #121212); border-radius: 8px; padding: .5rem .7rem .55rem; margin: .35rem 0 .7rem; background: #fff; }
.hce-payblock h4 { margin: 0 0 .2rem; font-size: .95rem; }
.hce-payblock p { margin: 0; font-size: .86rem; }
.hce-ratecol { white-space: nowrap; font-variant-numeric: tabular-nums; }