/* Help desk records: organisations, customers, setup screens, custom objects and the customer portal's requests (prefix hr-). */

/* lists */
.hr-saved { flex-wrap: wrap; gap: 6px; }
.hr-bulk { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; padding: 10px 12px; border-bottom: 1px solid #e0e7ed; }
.hr-bulk select { max-width: 260px; min-width: 0; }
.hr-rowact { white-space: nowrap; }
.hr-rowact form, .hr-rowact .ct-inline { display: inline-flex; }
.hr-rowact .ct-btn + .ct-btn, .hr-rowact form + form, .hr-rowact .ct-btn + form { margin-left: 4px; }
.hr-pager { padding: 8px 12px; border-top: 1px solid #e0e7ed; }
.hr-bad td { background: var(--badBg, #fdecec); }
.hr-err { color: var(--badFg, #b42318); font-size: 12px; }
.hr-inl { display: inline; }
.hr-tag { display: inline-block; padding: 1px 8px; border-radius: 10px; background: #eef3f8; border: 1px solid #d3dde7; font-size: 12px; font-family: ui-monospace, Menlo, Consolas, monospace; color: #2f4a63; }

/* look-up */
.hr-lookup { display: flex; gap: 8px; align-items: center; }
.hr-lookup input { flex: 1; min-width: 0; font-size: 16px; min-height: 40px; }

/* organisation and customer pages */
.hr-mix { padding: 10px 14px 4px; }
.hr-tl li b .bi { margin-right: 4px; }
.hr-actions .ct-btn { width: 100%; justify-content: center; }
.hr-actions form { margin: 0; }
.hr-note { margin: 10px 0 0; color: #4a5d70; font-size: 13px; }
.hr-special { display: flex; gap: 8px; align-items: flex-start; padding: 8px 10px; border-left: 3px solid var(--warnFg, #a15c00); background: var(--warnBg, #fff6e5); border-radius: 3px; font-size: 13px; }
.hr-special + .hr-special { margin-top: 8px; }
.hr-special .bi { color: var(--warnFg, #a15c00); font-size: 16px; flex: none; }
.hr-loc, .hr-orgrow, .hr-check, .hr-linkrow { display: flex; gap: 8px; align-items: flex-start; padding: 7px 0; border-bottom: 1px solid #edf1f5; min-width: 0; }
.hr-loc > div, .hr-orgrow > div, .hr-check > div, .hr-linkrow > div { flex: 1; min-width: 0; }
.hr-loc .sub, .hr-orgrow .sub, .hr-check .sub, .hr-linkrow .sub { display: block; overflow-wrap: anywhere; }
.hr-loc > .bi, .hr-orgrow > .bi, .hr-linkrow > .bi { color: #5b7891; margin-top: 2px; }
.hr-more { margin-top: 10px; }
.hr-more summary { cursor: pointer; font-weight: 700; font-size: 13px; color: var(--brand-primary); padding: 4px 0; }
.hr-more form { margin-top: 8px; }
.hr-addmember { padding: 12px; border-top: 1px solid #e0e7ed; }
.hr-approval form { margin-top: 10px; }
.hr-decide .ct-inline { gap: 8px; }
.hr-codebox { padding: 10px; margin-bottom: 10px; background: var(--infoBg, #eaf3fd); border-radius: 3px; }
.hr-startcheck { margin-top: 10px; padding-top: 10px; border-top: 1px solid #e0e7ed; }

/* setup screens */
.hr-setupnav { margin-bottom: 2px; }
.hr-order { width: 72px; }
.hr-statusgrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.hr-statusgrid fieldset { border: 1px solid #dfe7ee; border-radius: 3px; padding: 8px 10px; min-width: 0; margin: 0; }
.hr-statusgrid legend { font-weight: 700; font-size: 12px; padding: 0 4px; }
.hr-statusgrid .ct-check { display: flex; }
.hr-cond, .hr-objfield { align-items: flex-end; border-bottom: 1px dashed #e0e7ed; padding-bottom: 6px; margin-bottom: 6px; }
.hr-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px; }
.hr-cards > * { min-width: 0; }
.hr-objtype { display: flex; gap: 12px; align-items: flex-start; }
.hr-objtype > .bi { font-size: 26px; color: var(--brand-primary); }
.hr-objtype .sub { display: block; margin-top: 6px; }
.hr-objbtns { margin-top: 12px; gap: 6px; flex-wrap: wrap; }

/* ticket page panels */
.hr-suggest .hr-sugrow { display: flex; gap: 8px; align-items: center; justify-content: space-between; padding: 6px 0; border-bottom: 1px solid #edf1f5; }
.hr-suggest .hr-sugrow > div { min-width: 0; overflow-wrap: anywhere; }
.hr-suggest .hr-sugrow .sub { display: block; }
.hr-sugnote { margin: 8px 0 0; font-size: 11.5px; }
.hr-linkform { margin-top: 10px; }
.hr-linkform label { font-weight: 700; font-size: 12.5px; }
.hr-linkform .ct-inline { gap: 6px; flex-wrap: wrap; margin-top: 6px; }
.hr-linkform .hint { display: block; font-size: 11.5px; color: #6a7c8d; }

/* customer portal */
.hr-tabs { align-self: flex-start; }
.hr-formpick { display: grid; gap: 8px; }
.hr-formcard { display: grid; grid-template-columns: auto 1fr auto; gap: 2px 10px; padding: 12px 14px; border: 1px solid #d3dde7; border-radius: 4px; color: inherit; background: #fff; }
.hr-formcard:hover { border-color: var(--brand-primary); background: #f6fafe; }
.hr-formcard b { grid-column: 2; }
.hr-formcard .hr-fic { grid-column: 1; grid-row: 1 / span 2; width: 40px; height: 40px; border-radius: 10px; display: grid; place-items: center; background: #eef4fb; color: var(--brand-primary); font-size: 19px; align-self: center; }
.hr-formcard .hr-fic .bi { grid-column: auto; grid-row: auto; }
.hr-formcard > span:not(.hr-fic) { grid-column: 2; color: #5b6f82; font-size: 13px; }
.hr-formcard > .bi { grid-column: 3; grid-row: 1 / span 2; align-self: center; color: var(--brand-primary); }
.hr-cfield[hidden] { display: none; }
.hr-tplink { display: block; padding: 6px 0; border-bottom: 1px solid #edf1f5; }
.hr-steps { margin: 0; padding-left: 18px; font-size: 13px; line-height: 1.6; }
.hr-convo { display: flex; flex-direction: column; gap: 10px; }
.hr-convo .ct-msg { min-width: 0; }
.hr-msghead { display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap; margin-bottom: 4px; }
.hr-msghead small { color: #6a7c8d; }
.hr-msgbody { overflow-wrap: anywhere; font-size: 13.5px; line-height: 1.55; }
.hr-files { display: flex; flex-wrap: wrap; gap: 6px 12px; margin-top: 8px; font-size: 12.5px; }
.hr-files a { overflow-wrap: anywhere; }

@media (max-width: 760px) {
    .hr-statusgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .hr-rowact { white-space: normal; }
    .hr-rowact .ct-btn, .hr-rowact form { margin: 2px 0; }
}
@media (max-width: 560px) {
    .hr-statusgrid { grid-template-columns: minmax(0, 1fr); }
    .hr-lookup { flex-wrap: wrap; }
    .hr-lookup .ct-btn { width: 100%; justify-content: center; }
    .hr-bulk select { max-width: 100%; flex: 1 1 100%; }
    .hr-suggest .hr-sugrow { flex-wrap: wrap; }
}

/* customer dashboard row */
.hr-dtbl td.hr-subj b { display: inline-block; max-width: 190px; overflow: hidden; text-overflow: ellipsis; vertical-align: bottom; }
.hr-dtbl tr.hr-needs td { background: #fffaf0; }
.hr-dtbl tr.hr-needs td:first-child { box-shadow: inset 3px 0 0 #d99a06; }
.ct-pfoot .hr-footwarn { color: var(--warnFg, #a15c00); font-weight: 700; margin-right: auto; order: -1; }
.cdb-list li small.hr-quote { color: #4a5d70; font-style: italic; }
.hr-minihead { margin: 4px 0 0; font-size: 11.5px; text-transform: uppercase; letter-spacing: .04em; color: #6a7c8d; }
.hr-kinds { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.hr-kinds li { display: flex; justify-content: space-between; gap: 8px; padding: 6px 9px; background: #f5f8fb; border: 1px solid #e3eaf1; border-radius: 6px; font-size: 12.5px; min-width: 0; }
.hr-kinds li span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }

/* portal list */
.hr-segrow { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; justify-content: space-between; }
.hr-segrow .hr-tabs { align-self: auto; }
.hr-findbar { width: 100%; }
.hr-findbar input[type=search] { flex: 1 1 240px; min-width: 0; }
.hr-findbar select { flex: 0 1 auto; min-width: 0; max-width: 100%; }

/* portal request page */
.hr-reqkpis .ct-kpi strong { font-size: 22px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; }
.hr-reqkpis .ct-kpi em { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; }
.hr-reqsteps { margin: 0; padding: 0; }
.hr-recent { list-style: none; margin: 0; padding: 0; }
.hr-recent li { display: flex; gap: 8px; align-items: center; justify-content: space-between; padding: 7px 0; border-bottom: 1px solid #edf1f5; min-width: 0; }
.hr-recent li:last-child { border-bottom: 0; }
.hr-recent li > div { min-width: 0; }
.hr-recent li b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hr-recent .sub { display: block; font-size: 11.5px; color: var(--muted); }

.hr-helptext { margin: 0 0 10px; font-size: 13px; color: #4a5d70; }
.hr-flow { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.hr-flow li { display: grid; justify-items: center; text-align: center; gap: 4px; padding: 12px 8px; border: 1px solid #e3eaf1; border-radius: 8px; background: #f8fbfd; min-width: 0; font-size: 12.5px; }
.hr-flow .bi { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: #e4f0ff; color: #1a7fe0; font-size: 17px; }
.hr-flow small { color: #6a7c8d; font-size: 11.5px; }
@media (max-width: 560px) { .hr-flow { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.db-panel .ct-pbody > .hr-pushdown { margin-top: auto; }

/* setup tables: long descriptions wrap under the name instead of widening the table */
.hr-wrapcell { white-space: normal; min-width: 220px; max-width: 360px; }
.hr-wrapcell .sub { overflow-wrap: anywhere; }
.hr-typeic { color: var(--brand-primary); margin-right: 6px; }
.hr-setupnav .n { font-size: 11px; opacity: .8; }
.hr-setuptbl td:first-child { white-space: normal; min-width: 200px; max-width: 340px; }
.hr-setuptbl td:first-child .sub { overflow-wrap: anywhere; }
.hr-setuptbl .hr-rowact .ct-btn { min-height: 28px; padding: 0 8px; }
.hr-namecell { max-width: 230px; }
.hr-namecell .sub { overflow: hidden; text-overflow: ellipsis; }
.hr-rowact .ct-btn.sm { min-height: 28px; padding: 0 8px; }
@media (max-width: 560px) { .hr-reqkpis .ct-kpi strong { font-size: 17px; } .hr-reqkpis .ct-kpi { padding-right: 56px; } }