/* HCM ▸ Resources (v1.0). Matches HCM ▸ Employees: charcoal lines, yellow accent rules, white backgrounds.
   No tinted backgrounds behind text (hover included); status = green / yellow / red text only; no blue. */
.hcr { color: var(--hh-charcoal, #121212); }
.hcr-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: .3rem 1rem; margin-bottom: .5rem; }
.hcr-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; font-weight: 400; }
.hcr-head p { margin: 0; font-size: .78rem; }
.hcr-head .hcr-add { margin-left: auto; }
.hcr-flash { margin: .2rem 0 .5rem; font-size: .82rem; }
.hcr-chips { display: flex; flex-wrap: wrap; gap: .4rem; margin: .3rem 0 .6rem; }
.hcr .hcr-chip { background: #fff; border: 1.5px solid var(--hh-charcoal, #121212); border-radius: 999px; padding: .25rem .8rem; font-size: .74rem; font-weight: 800; color: var(--hh-charcoal, #121212); box-shadow: none; }
.hcr .hcr-chip.on { border-width: 2.5px; border-color: var(--hh-charcoal, #121212); box-shadow: inset 0 -4px 0 var(--hh-yellow, #FFF200); }
.hcr .hcr-chip:hover, .hcr .hcs-act:hover, .hcr .hcr-btn:hover { background: #fff; transform: none; }
.hcr-sec { margin: .4rem 0 1.1rem; }
.hcr-sh { font-family: var(--font-display, "Bebas Neue", Impact, sans-serif); font-size: 1.3rem; letter-spacing: .04em; font-weight: 400; margin: 0 0 .2rem; padding-bottom: .15rem; border-bottom: 2px solid var(--hh-charcoal, #121212); }
.hcr-sh .hcs-muted { font-family: var(--font-body, Montserrat, Arial, sans-serif); font-size: .74rem; letter-spacing: 0; margin-left: .3rem; }
.hcr-cat h4 { font-size: .66rem; text-transform: uppercase; letter-spacing: .06em; color: var(--hh-muted, #5a5a5a); font-weight: 800; margin: .7rem 0 .25rem; }
.hcr-list { list-style: none; margin: 0; padding: 0; }
.hcr-item { display: flex; align-items: center; justify-content: space-between; gap: .4rem 1rem; padding: .45rem .1rem; border-bottom: 1px solid rgba(18, 18, 18, .14); }
.hcr-itxt { display: flex; flex-direction: column; gap: .1rem; min-width: 0; }
.hcr-ititle { font-weight: 800; font-size: .88rem; overflow-wrap: anywhere; }
.hcr-imeta { font-size: .74rem; } .hcr-idesc { font-size: .74rem; }
.hcr-iact { display: flex; gap: .35rem; flex-wrap: wrap; flex: 0 0 auto; justify-content: flex-end; }
.hcr a.hcr-btn { text-decoration: none; display: inline-flex; align-items: center; text-transform: uppercase; letter-spacing: .04em; }
.hcr .hcr-btn { font-size: .72rem; padding: .3rem .7rem; text-transform: uppercase; letter-spacing: .04em; }
/* HCM 2.8.18.3 (a11y, WCAG 2.5.8): Replace / Edit / Delete are at least 24x24 and never partly covered (axe target-size flagged Delete at 73.9 x 11.9). */
.hcr .hcr-btn { min-height: 28px; min-width: 28px; box-sizing: border-box; scroll-margin-block: 5rem; }
.hcr-empty { margin: .4rem 0; font-size: .8rem; }
.hcr-formwrap { position: fixed; inset: 0; z-index: 70; display: flex; align-items: center; justify-content: center; background: transparent; padding: 1rem; }
.hcr-form, .hcr-read { background: #fff; border: 2px solid var(--hh-charcoal, #121212); border-radius: 12px; padding: .8rem 1rem 1rem; width: min(34rem, 100%); max-height: calc(100vh - 2rem); overflow-y: auto; box-sizing: border-box; box-shadow: 0 10px 40px rgba(0, 0, 0, .28); }
.hcr-form { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem .7rem; font-size: .8rem; }
.hcr-read { width: min(52rem, 100%); }
.hcr-fhead { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: center; gap: .6rem; border-bottom: 3px solid var(--hh-yellow, #FFF200); padding-bottom: .35rem; margin-bottom: .2rem; }
.hcr-fhead h3 { font-family: var(--font-display, "Bebas Neue", Impact, sans-serif); font-size: 1.35rem; letter-spacing: .03em; font-weight: 400; margin: 0; overflow-wrap: anywhere; }
.hcr-ract { display: flex; gap: .35rem; flex-wrap: wrap; }
.hcr-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); }
.hcr-form label .hcs-muted { text-transform: none; letter-spacing: 0; font-weight: 500; }
.hcr-form input[type=text], .hcr-form select, .hcr-form input[type=file] { font: inherit; font-size: .84rem; 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: .32rem .45rem; background: #fff; width: 100%; box-sizing: border-box; min-width: 0; }
.hcr-form input:focus, .hcr-form select:focus { outline: 2px solid var(--hh-yellow, #FFF200); outline-offset: 1px; }
.hcr-form .hcr-wide { grid-column: 1 / -1; } .hcr-form p { margin: 0; font-size: .74rem; }
.hcr-text { white-space: pre-wrap; overflow-wrap: anywhere; font-family: ui-monospace, Menlo, Consolas, monospace; font-size: .8rem; line-height: 1.45; margin: .5rem 0 0; background: #fff; }
@media (max-width: 600px) {
  .hcr-title { font-size: 1.5rem; }
  .hcr-head .hcr-add { margin-left: 0; width: 100%; justify-content: center; }
  .hcr .hcr-chip { min-height: 44px; padding: .3rem 1rem; font-size: .82rem; }
  .hcr-item { flex-direction: column; align-items: stretch; border: 1.5px solid var(--hh-charcoal, #121212); border-radius: 10px; padding: .6rem .7rem; margin-bottom: .5rem; }
  .hcr-ititle { font-size: .98rem; } .hcr-imeta, .hcr-idesc { font-size: .82rem; }
  .hcr-iact { justify-content: stretch; display: grid; grid-template-columns: 1fr 1fr 1fr; gap: .4rem; margin-top: .35rem; }
  .hcr-iact .hcs-primary { grid-column: 1 / -1; }
  .hcr .hcr-btn { min-height: 44px; font-size: .86rem; justify-content: center; border-radius: 10px; }
  .hcr-formwrap { align-items: flex-end; padding: 0; }
  .hcr-form, .hcr-read { width: 100%; max-height: 92vh; border-radius: 16px 16px 0 0; border-width: 4px 0 0; grid-template-columns: 1fr; padding-bottom: 1.5rem; }
  .hcr-form input[type=text], .hcr-form select, .hcr-form input[type=file] { min-height: 44px; font-size: 16px; }
}
.hcr-form input[type=file]::file-selector-button { background: #fff; color: var(--hh-charcoal, #121212); border: 1.5px solid var(--hh-charcoal, #121212); border-radius: 6px; padding: .2rem .6rem; margin-right: .5rem; font: inherit; font-weight: 700; cursor: pointer; }