/* Staff & HR module */
.hr-type { display: inline-flex; align-items: center; gap: .35rem; white-space: nowrap; }
.hr-dot { width: 9px; height: 9px; border-radius: 50%; display: inline-block; flex: none; }
.hr-days { font-size: 1.15rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.hr-list li { padding: .35rem 0; border-bottom: 1px solid var(--border); }
.hr-list li:last-child { border-bottom: 0; }

/* balances */
.hr-balances { display: grid; gap: .8rem; }
.hr-balances.compact { gap: .55rem; }
.hr-bal .muted.small { margin-top: .2rem; }
.hr-bar { height: 8px; border-radius: 5px; background: var(--green-soft); overflow: hidden; display: flex; margin-top: .3rem; }
.hr-bar-used { background: var(--accent); height: 100%; }
.hr-bar-pending { background: repeating-linear-gradient(45deg, var(--amber), var(--amber) 3px, #f3c77e 3px, #f3c77e 6px); height: 100%; }
.hr-balance-table th.center { border-left: 1px solid var(--border); }
.hr-preview { font-weight: 500; }
[data-hr-leave-form] [hidden] { display: none !important; }

/* leave calendar */
.hr-cal-wrap { overflow-x: auto; }
.hr-cal { width: 100%; border-collapse: collapse; table-layout: fixed; min-width: 760px; }
.hr-cal th { padding: .5rem; font-size: .8rem; color: var(--muted); text-transform: uppercase; letter-spacing: .05em; border-bottom: 1px solid var(--border); }
.hr-cal td { vertical-align: top; height: 104px; padding: .3rem .35rem; border: 1px solid var(--border); }
.hr-cal td.hr-cal-empty { background: var(--surface-2); }
.hr-cal .hr-cal-off { background: var(--surface-2); color: var(--faint); }
.hr-cal td.hr-cal-hol { background: repeating-linear-gradient(135deg, var(--surface-2), var(--surface-2) 6px, #fff 6px, #fff 12px); }
.hr-cal td.hr-cal-today { box-shadow: inset 0 0 0 2px var(--accent); }
.hr-cal-date { font-weight: 600; font-size: .85rem; margin-bottom: .2rem; }
.hr-cal-holname { font-weight: 500; font-size: .72rem; color: var(--muted); }
.hr-cal-item { display: block; font-size: .78rem; padding: .08rem .35rem; margin-bottom: 2px; border-left: 3px solid var(--muted); background: var(--surface-2); border-radius: 3px; color: var(--text);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-decoration: none !important; }
.hr-cal-item:hover { background: var(--accent-soft); }
.hr-cal-item.pending { border-left-style: dashed; background: var(--amber-soft); }
.hr-cal-item small { color: var(--muted); }
.icon.flip { transform: rotate(180deg); }

/* duty roster */
.hr-roster th, .hr-roster td { vertical-align: top; }
.hr-roster th.hr-today { box-shadow: inset 0 -3px 0 var(--accent); }
.hr-cell { min-width: 150px; }
.hr-cell.hr-short { background: #fffaf0; }
.hr-cell.hr-cell-hol { background: var(--surface-2); }
.hr-duty-chip { display: inline-flex; align-items: center; gap: .15rem; background: var(--accent-soft); border-radius: 14px; padding: .1rem .15rem .1rem .55rem; margin: 0 .2rem .25rem 0; font-size: .82rem; }
.hr-duty-chip.me { background: var(--accent); color: #fff; }
.hr-duty-chip.away { text-decoration: line-through; background: var(--red-soft); color: var(--red); }
.hr-duty-chip form { display: inline; }
.hr-x { border: 0; background: transparent; cursor: pointer; color: inherit; opacity: .55; font-size: 1rem; line-height: 1; padding: 0 .3rem; }
.hr-x:hover { opacity: 1; }
.hr-duty-add select { font-size: .78rem; padding: .1rem .25rem; max-width: 150px; color: var(--muted); border: 1px dashed var(--border-strong); background: transparent; border-radius: 5px; }
.hr-roster tr.hr-me td { background: var(--accent-soft); }

/* observations */
.hr-rating-table td, .hr-rating-table th { vertical-align: middle; }
.hr-radio { display: inline-flex; padding: .3rem; cursor: pointer; }
.hr-radio input { width: 18px; height: 18px; cursor: pointer; }
.hr-scale { display: inline-flex; gap: 3px; margin-right: .4rem; vertical-align: middle; }
.hr-scale span { width: 18px; height: 8px; border-radius: 3px; background: var(--grey-soft); }
.hr-scale span.on.tone-green { background: var(--green); }
.hr-scale span.on.tone-blue { background: var(--blue); }
.hr-scale span.on.tone-amber { background: var(--amber); }
.hr-scale span.on.tone-red { background: var(--red); }

/* settings */
.hr-settings-table input:not([type=checkbox]):not([type=color]), .hr-settings-table select { padding: .3rem .4rem; }
.hr-settings-table select { min-width: 6.5rem; }

/* month bars (leave taken report) */
.hr-months { display: grid; grid-template-columns: repeat(12, 1fr); gap: .35rem; align-items: end; }
.hr-month { text-align: center; }
.hr-month-bar { height: 120px; display: flex; flex-direction: column-reverse; background: var(--surface-2); border-radius: 4px; overflow: hidden; }
.hr-month-bar span { display: block; width: 100%; }
.hr-month-label { font-size: .75rem; color: var(--muted); margin-top: .2rem; }
.hr-month-val { font-size: .75rem; font-weight: 600; min-height: 1em; }

@media (max-width: 860px) {
    .hr-cal td { height: 80px; }
    .hr-months { gap: .15rem; }
}