.career-site { min-height: 100vh; display: flex; flex-direction: column; }
.brand-copy small { margin-top: 4px; color: #758796; font-size: 10px; font-weight: 650; letter-spacing: .12em; text-transform: uppercase; }
.hr-nav { display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-end; gap: 12px 20px; }
.hr-nav > a { display: inline-flex; min-height: 24px; align-items: center; color: #263f50; font-size: 13px; font-weight: 650; line-height: 1.2; }
.hr-nav > a:hover { color: #00658b; }
.hr-account-controls { display: flex; align-items: center; gap: 18px; }
.hr-account-controls .language-switch { margin: 0; }
.hr-user-menu { position: relative; display: flex; align-items: center; }
.hr-nav-user { display: inline-flex; min-height: 24px; align-items: center; gap: 9px; margin: 0; padding: 0; color: #fff; font-size: 12px; font-weight: 650; line-height: 1.2; white-space: nowrap; list-style: none; cursor: pointer; }
.hr-nav-user::-webkit-details-marker { display: none; }
.hr-nav-user::after { width: 7px; height: 7px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; content: ""; transform: translateY(-2px) rotate(45deg); transition: transform .15s ease; }
.hr-user-menu[open] > .hr-nav-user::after { transform: translateY(2px) rotate(225deg); }
.hr-nav-user:focus-visible { outline: 2px solid #06a3da; outline-offset: 5px; }
.hr-user-menu-panel { position: absolute; z-index: 20; top: calc(100% + 12px); right: 0; width: 205px; padding: 6px; border: 1px solid #dfe8ea; border-radius: 7px; background: #fff; box-shadow: 0 12px 30px rgb(17 45 58 / 18%); }
.hr-user-menu-panel > a, .hr-user-menu-panel button { display: flex; width: 100%; align-items: center; padding: 10px 12px; border: 0; border-radius: 4px; color: #263f50; background: transparent; font: inherit; font-size: 13px; font-weight: 600; text-align: left; text-decoration: none; cursor: pointer; }
.hr-user-menu-panel > a:hover, .hr-user-menu-panel button:hover { color: #006b94; background: #eff8fb; }
.hr-user-menu-panel form { margin: 0; }
.hr-settings-menu .hr-user-menu-panel { width: 250px; }
.portal-content-grid .hr-field textarea { min-height: 220px; }
.hr-logout-form { margin: 0; }
.hr-main { flex: 1; padding: 27px 0 44px; background: #f3f5f5; }
.info-page-shell { flex: 1; padding: 0; background: #f3f5f5; }
.site-footer { margin-top: auto; }
.footer-row { display: flex; justify-content: space-between; gap: 16px; padding-block: 15px; color: #58717e; font-size: 11px; }
.footer-bottom.container { padding-block: 12px 14px; }
@media (max-width: 620px) {
    .footer-bottom.container { padding-block: 12px 14px; }
}
.hr-page { display: grid; gap: 20px; }
.page-heading, .section-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; }
.page-heading h1 { margin: 0; color: #263f50; font-size: clamp(25px, 3vw, 32px); line-height: 1.2; }
.page-heading p { margin: 7px 0 0; color: #58717e; font-size: 13px; line-height: 1.55; }
.section-eyebrow { display: block; margin-bottom: 6px; color: #00658b; font-size: 10px; font-weight: 750; letter-spacing: .12em; text-transform: uppercase; }
.hr-card { padding: 22px 24px; border: 1px solid #dfe8ea; border-radius: 11px; background: #fff; }
.section-heading { margin-bottom: 17px; }
.section-heading h2 { margin: 0; color: #263f50; font-size: 17px; line-height: 1.35; }
.table-count { color: #758796; font-size: 12px; }
.hr-alert { margin: 0; padding: 11px 14px; border-radius: 6px; color: #385c4a; background: #eef7f0; font-size: 13px; line-height: 1.5; }
.hr-alert-error { color: #8f3027; background: #fff1ef; }
.hr-form-grid { display: grid; grid-template-columns: minmax(220px, 460px) auto; align-items: end; gap: 14px; }
.hr-field { display: grid; align-content: start; gap: 7px; color: #344d5e; font-size: 13px; font-weight: 650; }
.hr-field input, .hr-field select, .hr-field textarea { box-sizing: border-box; width: 100%; min-height: 43px; padding: 9px 11px; border: 1px solid #d7e0e4; border-radius: 6px; color: #263f50; background: #fff; font: inherit; font-size: 14px; font-weight: 400; }
.hr-field input:not([type="checkbox"]):not([type="radio"]), .hr-field select { height: 48px; min-height: 48px; }
.hr-field input[type="file"] { padding: 6px 9px; }
.hr-field textarea { min-height: 100px; resize: vertical; }
.hr-field input:focus, .hr-field select:focus, .hr-field textarea:focus { border-color: #06a3da; outline: 3px solid rgb(6 163 218 / 20%); }
.hr-form-action { display: flex; justify-content: flex-start; }
.field-error { color: #b42318; font-size: 12px; }
.hr-empty-state { padding: 23px; border: 1px dashed #cbd8dc; border-radius: 8px; color: #58717e; text-align: center; }
.hr-empty-state strong { color: #344d5e; font-size: 14px; }
.hr-empty-state p { margin: 5px 0 0; font-size: 12px; }
.table-scroll { overflow-x: auto; }
.hr-table { width: 100%; border-collapse: collapse; text-align: left; }
.hr-table th { padding: 11px 12px; border-bottom: 1px solid #dfe8ea; color: #758796; font-size: 10px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; }
.hr-table td { padding: 13px 12px; border-bottom: 1px solid #edf1f2; color: #344d5e; font-size: 12px; vertical-align: middle; }
.applicant-list-table td { vertical-align: top; }
.applicant-experience-item strong { display: block; color: #344d5e; font-weight: 650; }
.applicant-experience-item span { display: block; margin-top: 2px; color: #758796; font-size: 11px; }
.applicant-experience-row:not(.applicant-experience-row-last) > td:not([rowspan]) { border-bottom-color: transparent; }
.hr-table tr:last-child td { border-bottom: 0; }
.table-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; }
.table-actions form { margin: 0; }
.vacancy-action-menu { position: relative; }
.vacancy-action-menu > summary { display: inline-flex; align-items: center; gap: 8px; list-style: none; cursor: pointer; }
.vacancy-action-menu > summary::-webkit-details-marker { display: none; }
.vacancy-action-menu > summary::after { width: 6px; height: 6px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; content: ""; transform: translateY(-2px) rotate(45deg); }
.vacancy-action-menu[open] > summary::after { transform: translateY(2px) rotate(225deg); }
.vacancy-action-menu-panel { position: fixed; z-index: 60; display: grid; width: max-content; min-width: 190px; max-width: calc(100vw - 16px); gap: 2px; padding: 6px; border: 1px solid #dfe8ea; border-radius: 7px; background: #fff; box-shadow: 0 12px 30px rgb(17 45 58 / 18%); }
.vacancy-action-menu-panel > a, .vacancy-action-menu-panel button { display: flex; width: 100%; align-items: center; padding: 9px 11px; border: 0; border-radius: 4px; color: #263f50; background: transparent; font: inherit; font-size: 12px; font-weight: 600; text-align: left; text-decoration: none; white-space: nowrap; cursor: pointer; }
.vacancy-action-menu-panel > a:hover, .vacancy-action-menu-panel button:hover { color: #006b94; background: #eff8fb; }
.vacancy-action-menu-panel button.vacancy-delete-action { color: #a82f27; }
.vacancy-action-menu-panel button.vacancy-delete-action:hover { color: #84231d; background: #fff3f2; }
.vacancy-action-menu-panel form { margin: 0; }
.vacancy-action-menu-panel :focus-visible { outline: 2px solid #06a3da; outline-offset: 1px; }
.status-pill { display: inline-flex; min-height: 24px; align-items: center; padding: 3px 9px; border-radius: 20px; font-size: 10px; font-weight: 700; white-space: nowrap; }
.status-active { color: #286044; background: #e8f5eb; }
.status-inactive { color: #667985; background: #eef1f2; }
.status-suspended { color: #8c3030; background: #fdeaea; }
.candidate-management-search { grid-template-columns: minmax(220px, 2fr) repeat(4, minmax(150px, 1fr)) auto; margin: 0 0 18px; }
.candidate-management-search .hr-field { min-width: 0; }
.candidate-management-statuses { display: flex; flex-wrap: wrap; gap: 8px; }
.candidate-detail-subsection { margin-top: 22px; }
.candidate-detail-subsection h3 { margin: 0 0 10px; }
.candidate-detail-records { display: grid; gap: 14px; }
.candidate-detail-records > dl { margin: 0; padding: 4px 0 14px; border-bottom: 1px solid #edf1f2; }
.candidate-management-actions .form-actions form { display: inline-flex; margin: 0; }
.candidate-delete-button { color: #8c3030; border-color: #d7b9b9; }
.candidate-reference { color: #758796; font-size: 12px; }
.pagination { display: flex; align-items: center; justify-content: center; gap: 14px; margin-top: 20px; }
.account-card { box-shadow: 0 12px 30px rgb(25 61 77 / 5%); }
.account-form-error { margin: 11px 0 0; }
.user-create-dialog { width: min(520px, calc(100vw - 32px)); max-width: 520px; max-height: calc(100vh - 32px); padding: 0; overflow: auto; border: 1px solid #dfe8ea; border-radius: 11px; color: #263f50; background: #fff; box-shadow: 0 20px 70px rgb(17 45 58 / 25%); }
.user-create-dialog::backdrop { background: rgb(12 32 42 / 58%); }
.user-edit-dialog { width: min(560px, calc(100vw - 32px)); max-width: 560px; max-height: calc(100vh - 32px); padding: 0; overflow: auto; border: 1px solid #dfe8ea; border-radius: 11px; color: #263f50; background: #fff; box-shadow: 0 20px 70px rgb(17 45 58 / 25%); }
.user-edit-dialog::backdrop { background: rgb(12 32 42 / 58%); }
.user-response-dialog { width: min(520px, calc(100vw - 32px)); max-width: 520px; max-height: calc(100vh - 32px); padding: 0; overflow: auto; border: 1px solid #dfe8ea; border-radius: 11px; color: #263f50; background: #fff; box-shadow: 0 20px 70px rgb(17 45 58 / 25%); }
.user-response-dialog::backdrop { background: rgb(12 32 42 / 58%); }
.user-response-dialog:focus { outline: none; }
.user-response-dialog-header { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 18px 22px; border-bottom: 1px solid #edf1f2; }
.user-response-dialog-header h2 { margin: 0; color: #263f50; font-size: 19px; }
.user-response-dialog-body { padding: 20px 22px 8px; color: #58717e; font-size: 14px; line-height: 1.6; }
.user-response-dialog-body > p { margin: 0; }
.user-response-dialog[data-kind="error"] .user-response-dialog-body { color: #8f3027; }
.user-response-dialog[data-kind="success"] .user-response-dialog-body { color: #385c4a; }
.user-response-dialog-actions { display: flex; align-items: center; justify-content: flex-end; gap: 12px; padding: 12px 22px 22px; }
.company-response-dialog { width: min(480px, calc(100vw - 32px)); max-width: 480px; max-height: calc(100vh - 32px); padding: 0; overflow: auto; border: 1px solid #dfe8ea; border-radius: 11px; color: #263f50; background: #fff; box-shadow: 0 20px 70px rgb(17 45 58 / 25%); }
.company-response-dialog:focus { outline: none; }
.company-response-dialog::backdrop { background: rgb(12 32 42 / 58%); }
.company-response-dialog-header { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 18px 22px; border-bottom: 1px solid #edf1f2; }
.company-response-dialog-header h2 { margin: 0; color: #263f50; font-size: 19px; }
.company-response-dialog-body { padding: 20px 22px 8px; color: #58717e; font-size: 14px; line-height: 1.6; }
.company-response-dialog-body p { margin: 0; }
.company-response-errors { margin: 0; padding-inline-start: 20px; color: #8f3027; }
.company-response-dialog[data-kind="success"] .company-response-dialog-body { color: #385c4a; }
.company-response-dialog-actions { display: flex; justify-content: flex-end; padding: 12px 22px 22px; }
.user-create-dialog-header { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 20px 22px; border-bottom: 1px solid #edf1f2; }
.user-create-dialog-header h2 { margin: 0; color: #263f50; font-size: 20px; }
.user-create-dialog-form { display: grid; gap: 18px; padding: 22px; }
.user-create-dialog-actions { justify-content: flex-end; margin-top: 5px; }
.company-access-field { display: grid; gap: 10px; min-width: 0; margin: 0; padding: 14px; border: 1px solid #d7e0e4; border-radius: 7px; }
.company-access-field[hidden] { display: none; }
.company-access-field legend { padding: 0 4px; color: #344d5e; font-size: 13px; font-weight: 700; }
.company-access-field p { margin: 0; color: #758796; font-size: 12px; font-weight: 400; line-height: 1.5; }
.company-access-options { display: grid; gap: 9px; max-height: 180px; overflow: auto; }
.company-access-options label { display: flex; align-items: flex-start; gap: 9px; color: #344d5e; font-size: 13px; font-weight: 500; }
.company-access-options input { width: 16px; height: 16px; margin: 1px 0 0; accent-color: #00658b; }
.button-danger { color: #a82f27; border-color: #e5b8b5; }
.button-danger:hover { color: #84231d; background: #fff3f2; }
.vacancy-filters { display: grid; grid-template-columns: minmax(250px, 1.8fr) repeat(4, minmax(145px, 1fr)) auto; align-items: end; gap: 14px; }
.vacancy-filters .hr-field { min-width: 0; }
.vacancy-filters .hr-field input, .vacancy-filters .hr-field select { box-sizing: border-box; min-width: 0; }
.vacancy-search-field { min-width: 0; }
.filter-actions { display: flex; align-items: stretch; gap: 8px; white-space: nowrap; }
.filter-actions > .button { box-sizing: border-box; height: 48px; min-height: 48px; padding-block: 0; }
.pagination { display: flex; align-items: center; justify-content: center; gap: 16px; padding-top: 17px; color: #58717e; font-size: 12px; }
.vacancy-status { color: #355361; background: #edf4f5; }
.status-draft { color: #647b88; background: #eef1f2; }
.status-published { color: #286044; background: #e8f5eb; }
.status-closed { color: #875626; background: #fff4e5; }
.status-archived { color: #626c75; background: #eceff1; }
.vacancy-list-status { display: inline-flex; min-width: 88px; min-height: 30px; align-items: center; justify-content: center; gap: 7px; padding: 5px 11px; border: 1px solid transparent; border-radius: 999px; font-size: 11px; line-height: 1; font-weight: 700; letter-spacing: .01em; white-space: nowrap; }
.vacancy-list-status::before { content: ""; width: 7px; height: 7px; flex: 0 0 7px; border-radius: 50%; background: currentColor; opacity: .85; }
.vacancy-list-status.status-draft { color: #536b7b; background: #f1f5f7; border-color: #dbe5ea; }
.vacancy-list-status.status-published { color: #226744; background: #eaf6ee; border-color: #cde7d5; }
.vacancy-list-status.status-closed { color: #805817; background: #fff6e8; border-color: #efdfbd; }
.vacancy-list-status.status-archived { color: #5e6872; background: #eef1f3; border-color: #dce2e6; }
.vacancy-list-status.vacancy-list-status-cancelled { color: #984f38; background: #fff1ec; border-color: #f1d4c9; }
.vacancy-cancel-dialog { width: min(540px, calc(100vw - 32px)); max-width: 540px; max-height: calc(100vh - 32px); padding: 0; overflow: auto; border: 1px solid #dfe8ea; border-radius: 11px; color: #263f50; background: #fff; box-shadow: 0 20px 70px rgb(17 45 58 / 25%); }
.vacancy-cancel-dialog::backdrop { background: rgb(12 32 42 / 58%); }
.vacancy-cancel-dialog:focus { outline: none; }
.vacancy-cancel-dialog-header { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 18px 22px; border-bottom: 1px solid #edf1f2; }
.vacancy-cancel-dialog-header h2 { margin: 0; color: #263f50; font-size: 20px; }
.vacancy-cancel-dialog-form { display: grid; gap: 16px; padding: 20px 22px 22px; }
.vacancy-cancel-explanation { margin: 0; color: #58717e; font-size: 13px; line-height: 1.55; }
.vacancy-cancel-captcha-row { display: grid; grid-template-columns: minmax(0, 240px) minmax(0, 1fr); align-items: end; gap: 14px; }
.vacancy-cancel-captcha-row .account-captcha-image { display: block; width: 100%; max-width: 240px; height: 60px; border: 1px solid #d7e0e4; border-radius: 4px; background: #f2f2f2; }
.vacancy-cancel-captcha-row .hr-field { min-width: 0; }
.vacancy-cancel-captcha-row input { text-transform: lowercase; }
.vacancy-cancel-dialog-actions { justify-content: flex-end; margin-top: 2px; }
.vacancy-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px 18px; }
.vacancy-form-grid .hr-field textarea { min-height: 76px; }
.salary-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.form-section-heading { margin: 28px 0 15px; padding-top: 22px; border-top: 1px solid #edf1f2; }
.required-mark { color: #b42318; }
.required-fields-note { margin-right: auto; color: #758796; font-size: 12px; line-height: 1.5; }
.field-hint, .section-help { color: #758796; font-size: 11px; font-weight: 400; line-height: 1.5; }
.vacancy-form-grid .field-guide { display: block; min-height: 1.5em; }
.section-help { margin: 0 0 12px; }
.readonly-field { background: #f4f7f7 !important; }
.rich-field { margin-top: 16px; }
.rich-toolbar { display: flex; flex-wrap: wrap; gap: 6px; }
.rich-toolbar button { min-height: 30px; padding: 4px 10px; border: 1px solid #d7e0e4; border-radius: 5px; color: #344d5e; background: #f8fafb; font: inherit; font-size: 11px; font-weight: 650; cursor: pointer; }
.rich-toolbar button:hover { border-color: #91a9b2; background: #edf4f5; }
.rich-editor-surface { box-sizing: border-box; width: 100%; min-height: 160px; padding: 11px 12px; overflow: auto; border: 1px solid #d7e0e4; border-radius: 6px; color: #263f50; background: #fff; font-size: 14px; font-weight: 400; line-height: 1.55; overflow-wrap: anywhere; }
.rich-editor-surface:focus { border-color: #06a3da; outline: 3px solid rgb(6 163 218 / 20%); }
.rich-editor-surface:empty::before { color: #82939b; content: attr(data-placeholder); pointer-events: none; }
.rich-editor-surface p { margin: 0 0 .65em; }
.rich-editor-surface p:last-child { margin-bottom: 0; }
.rich-editor-surface ul, .rich-editor-surface ol { margin: .25em 0 .65em; padding-left: 1.5em; }
.toggle-row { display: flex; align-items: flex-start; gap: 10px; margin-top: 17px; color: #344d5e; cursor: pointer; }
.toggle-row input { width: 18px; height: 18px; accent-color: #00658b; }
.toggle-row strong, .toggle-row small { display: block; }
.toggle-row strong { font-size: 13px; }
.toggle-row small { margin-top: 4px; color: #758796; font-size: 11px; line-height: 1.5; }
.form-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.vacancy-details-actions { justify-content: flex-end; }
.vacancy-form-actions { justify-content: flex-end; margin-top: 28px; padding-top: 20px; border-top: 1px solid #edf1f2; }
.text-button { padding: 0; border: 0; color: #00658b; background: transparent; font: inherit; font-size: 12px; font-weight: 700; cursor: pointer; }
.text-button:hover, .text-link:hover { color: #00465f; text-decoration: underline; }
.detail-summary { padding: 22px 24px; }
.vacancy-summary-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px 20px; margin: 0; }
.vacancy-summary-grid dt { color: #758796; font-size: 10px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.vacancy-summary-grid dd { margin: 5px 0 0; color: #344d5e; font-size: 13px; overflow-wrap: anywhere; }
.vacancy-summary-grid .full-width { grid-column: 1 / -1; }
.applicant-summary-name { grid-row: 1; grid-column: 1; }
.applicant-summary-email { grid-row: 1; grid-column: 2; }
.applicant-summary-phone { grid-row: 1; grid-column: 3; }
.applicant-summary-birth { grid-row: 2; grid-column: 1; }
.applicant-summary-age { grid-row: 2; grid-column: 2; }
.applicant-ktp-address { grid-row: 2; grid-column: 3; }
.applicant-summary-gender { grid-row: 3; grid-column: 1; }
.candidate-registered-at { grid-row: 3; grid-column: 2; }
.candidate-verified-at { grid-row: 3; grid-column: 3; }
.vacancy-detail-section h2 { margin: 0 0 12px; color: #263f50; font-size: 17px; }
.vacancy-detail-section p { margin: 0; color: #344d5e; font-size: 13px; line-height: 1.65; white-space: pre-line; }
.applicant-profile-section .section-heading { margin-bottom: 14px; }
.applicant-skill-list { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.applicant-skill-list li { padding: 7px 10px; border: 1px solid #dfe8ea; border-radius: 20px; color: #344d5e; background: #f7f9fa; font-size: 12px; }
.applicant-history-list { display: grid; gap: 15px; }
.applicant-history-item { padding-bottom: 15px; border-bottom: 1px solid #edf1f2; }
.applicant-history-item:last-child { padding-bottom: 0; border-bottom: 0; }
.applicant-history-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 15px; }
.applicant-history-heading h3 { margin: 0; color: #263f50; font-size: 14px; }
.applicant-work-history .applicant-history-heading h3 { font-weight: 400; }
.applicant-education-history .applicant-history-heading h3 { font-weight: 400; }
.applicant-history-heading p { margin: 4px 0 0; color: #58717e; font-size: 12px; }
.applicant-history-heading > span { max-width: 48%; color: #758796; font-size: 12px; white-space: normal; text-align: right; }
.candidate-work-history-extra { margin-top: 10px; }
.candidate-work-history-extra dd { line-height: 1.5; white-space: pre-line; }
.applicant-history-description { margin: 9px 0 0; color: #344d5e; font-size: 13px; line-height: 1.65; }
@media print {
  @page { size: A4; margin: 14mm; }
  body, .career-site, .hr-main { background: #fff !important; }
  .site-header, .site-footer, .skip-link, .applicant-page-actions, .candidate-management-actions { display: none !important; }
  .hr-main { padding: 0 !important; }
  .container.hr-page { width: 100% !important; max-width: none !important; gap: 10px !important; margin: 0 !important; }
  .hr-card { padding: 15px !important; border-color: #cbd8dc !important; box-shadow: none !important; break-inside: avoid; }
  .applicant-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .applicant-summary-grid > div { grid-row: auto !important; grid-column: auto !important; }
  .applicant-history-item { break-inside: avoid; }
  .table-scroll { overflow: visible !important; }
  .hr-table { display: table !important; width: 100% !important; table-layout: fixed; }
  .hr-table thead { display: table-header-group !important; }
  .hr-table tbody { display: table-row-group !important; }
  .hr-table tr { display: table-row !important; padding: 0 !important; border: 0 !important; }
  .hr-table th, .hr-table td { display: table-cell !important; width: auto !important; padding: 7px 8px !important; }
  .hr-table th { font-size: 9px !important; white-space: normal !important; }
  .hr-table td { font-size: 10px !important; vertical-align: top !important; overflow-wrap: anywhere; }
  .hr-table td::before { display: none !important; content: none !important; }
  a { color: inherit !important; text-decoration: none !important; }
  .status-pill, .applicant-skill-list li { print-color-adjust: exact; -webkit-print-color-adjust: exact; }
}
.attachment-card .section-heading { align-items: center; }
.vacancy-preview-dialog { width: min(1080px, calc(100vw - 40px)); max-width: 1080px; max-height: calc(100vh - 36px); padding: 0; overflow: hidden; border: 1px solid #dfe8ea; border-radius: 12px; color: #263f50; background: #f3f5f5; box-shadow: 0 20px 70px rgb(17 45 58 / 25%); }
.vacancy-preview-dialog::backdrop { background: rgb(12 32 42 / 58%); }
.vacancy-preview-dialog:focus { outline: none; }
.preview-dialog-header, .preview-dialog-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 17px 22px; background: #fff; }
.preview-dialog-header { border-bottom: 1px solid #edf1f2; }
.preview-dialog-header h2 { margin: 0; color: #263f50; font-size: 19px; }
.preview-dialog-header .section-eyebrow { margin-bottom: 3px; }
.preview-close { width: 36px; height: 36px; border: 0; border-radius: 50%; color: #58717e; background: #f1f5f6; font-size: 25px; cursor: pointer; }
.preview-dialog-toolbar { border-bottom: 1px solid #dfe8ea; }
.preview-mode-switch { display: inline-flex; padding: 3px; border: 1px solid #d7e0e4; border-radius: 6px; background: #f3f6f7; }
.preview-mode-switch button { padding: 6px 11px; border: 0; border-radius: 4px; color: #58717e; background: transparent; font: inherit; font-size: 11px; font-weight: 700; cursor: pointer; }
.preview-mode-switch button[aria-pressed="true"] { color: #fff; background: #00658b; }
.preview-internal-note { color: #758796; font-size: 11px; }
.preview-canvas { max-height: calc(100vh - 155px); padding: 24px; overflow: auto; }
.preview-job-card { max-width: 100%; margin: 0 auto; padding: 32px; border: 1px solid #dfe8ea; border-radius: 9px; background: #fff; }
.preview-canvas[data-mode="mobile"] .preview-job-card { max-width: 375px; padding: 23px 18px; }
.preview-reference { margin: 0 0 9px; color: #00658b; font-size: 11px; font-weight: 700; }
.preview-job-card > h1 { margin: 0; color: #263f50; font-size: clamp(24px, 3vw, 34px); line-height: 1.2; }
.preview-company { margin: 8px 0 17px; color: #758796; font-size: 13px; }
.preview-meta { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 10px 18px; margin: 0; padding: 12px 0; border-block: 1px solid #edf1f2; color: #58717e; font-size: 12px; }
.preview-meta dt { color: #758796; font-size: 10px; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; }
.preview-meta dd { margin: 4px 0 0; color: #344d5e; font-size: 12px; overflow-wrap: anywhere; }
.preview-meta [hidden] { display: none !important; }
.preview-salary { margin: 14px 0; color: #344d5e; font-size: 14px; font-weight: 700; }
.preview-job-card section { margin-top: 23px; }
.preview-job-card section h2 { margin: 0 0 9px; color: #263f50; font-size: 16px; }
.preview-job-card section p, .preview-rich-content { margin: 0; color: #344d5e; font-size: 13px; line-height: 1.65; overflow-wrap: anywhere; }
.preview-rich-content ul, .preview-rich-content ol { margin: 8px 0; padding-left: 22px; }
.preview-apply-button { width: 100%; margin-top: 25px; opacity: .65; cursor: not-allowed; }
.preview-job-card [hidden] { display: none !important; }
.hr-table td form { display: inline-flex; margin: 0; }
.hr-table td[data-label="Aksi"] { gap: 10px; }
.company-table { min-width: 1080px; }
.company-table td.table-actions { display: table-cell; text-align: center; vertical-align: middle; }
.company-logo-preview { display: block; width: 78px; height: 54px; object-fit: contain; }
.company-logo-missing { color: #758796; font-size: 11px; }
.company-description-preview { display: block; max-width: 280px; overflow: hidden; color: #58717e; line-height: 1.5; text-overflow: ellipsis; }
.company-form { display: grid; gap: 18px; }
.company-form .vacancy-form-grid { align-items: start; }
.company-form .field-hint { min-height: 1.5em; }
.company-description-field { grid-column: 1 / -1; }
.company-description-field textarea { min-height: 130px; }
.company-logo-row { display: grid; grid-column: 1 / -1; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; align-items: start; }
.company-logo-field { align-self: start; }
.company-logo-large-preview { display: block; width: min(260px, 100%); height: 130px; padding: 8px; border: 1px solid #dfe8ea; border-radius: 7px; object-fit: contain; background: #fff; }
.portal-favicon-field { grid-column: 1 / -1; }
.portal-favicon-current { display: flex; align-items: center; gap: 10px; color: #758796; font-size: 12px; }
.portal-favicon-preview { width: 48px; height: 48px; padding: 4px; border: 1px solid #dfe8ea; border-radius: 6px; object-fit: contain; background: #fff; }
.portal-logo-field { grid-column: 1 / -1; }
.portal-logo-current { display: flex; min-height: 54px; align-items: center; color: #758796; font-size: 12px; }
.portal-logo-preview { display: block; width: min(260px, 100%); height: 100px; padding: 8px; border: 1px solid #dfe8ea; border-radius: 7px; object-fit: contain; background: #fff; }
.brand.has-portal-logo { gap: 10px; }
.portal-brand-logo { display: block; width: 42px; height: 42px; flex: 0 0 auto; object-fit: contain; }
.company-active-column { display: grid; align-content: start; gap: 7px; }
.company-active-spacer { display: block; min-height: 1.5em; visibility: hidden; }
.company-active-preview-spacer { height: 130px; min-height: 130px; }
.company-active-toggle { align-self: center; margin-top: 0; }

@media (max-width: 720px) {
  .hr-nav { justify-content: flex-start; gap: 9px 15px; }
  .hr-card { padding: 18px 16px; }
  .hr-form-grid { grid-template-columns: minmax(0, 1fr); }
  .user-create-dialog-form { padding: 18px 16px; }
  .user-create-dialog-header { padding: 16px; }
  .page-heading { align-items: flex-start; flex-direction: column; }
  .hr-table thead { display: none; }
  .hr-table, .hr-table tbody, .hr-table tr, .hr-table td { display: block; width: 100%; }
  .hr-table tr { padding: 10px 0; border-bottom: 1px solid #edf1f2; }
  .hr-table td { display: grid; grid-template-columns: 90px minmax(0, 1fr); gap: 10px; padding: 5px 4px; border: 0; }
  .hr-table td::before { color: #758796; font-size: 10px; font-weight: 700; content: attr(data-label); }
  .hr-table td.table-actions { justify-items: start; }
  .company-table td.table-actions { display: grid; text-align: left; }
  .hr-table td.table-actions::before { align-self: center; }
  .table-actions { grid-column: 2; }
  .vacancy-filters { grid-template-columns: minmax(0, 1fr); }
  .filter-actions { flex-wrap: wrap; }
  .vacancy-form-grid, .salary-grid, .vacancy-summary-grid { grid-template-columns: minmax(0, 1fr); }
  .applicant-summary-grid > div { grid-row: auto; grid-column: auto; }
  .company-logo-row { grid-template-columns: minmax(0, 1fr); gap: 15px; }
  .company-active-column { display: flex; align-items: flex-start; }
  .company-active-spacer { display: none; }
  .company-active-toggle { align-self: auto; }
  .vacancy-form-grid .field-guide { min-height: 0; }
  .vacancy-form-actions { justify-content: stretch; }
  .required-fields-note { flex: 1 1 100%; }
  .vacancy-form-actions .button { flex: 1 1 140px; }
  .vacancy-preview-dialog { width: calc(100vw - 16px); max-height: calc(100vh - 16px); }
  .preview-dialog-header, .preview-dialog-toolbar { align-items: flex-start; flex-direction: column; padding: 14px 16px; }
  .preview-dialog-header { flex-direction: row; }
  .preview-canvas { max-height: calc(100vh - 160px); padding: 12px; }
  .preview-job-card { padding: 21px 16px; }
}

@media (max-width: 1180px) and (min-width: 721px) {
  .candidate-management-search { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .candidate-management-search .filter-actions { grid-column: 1 / -1; justify-content: flex-end; }
  .vacancy-filters { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .vacancy-search-field { grid-column: span 2; }
  .filter-actions { grid-column: 1 / -1; justify-content: flex-end; }
}

@media (max-width: 850px) {
  .hr-header-actions { flex-wrap: wrap; justify-content: flex-end; gap: 9px 16px !important; }
  .hr-account-controls { gap: 10px; }
}

@media (max-width: 620px) {
  .hr-header-actions { align-items: center; justify-content: space-between; }
  .hr-nav { gap: 8px 12px; }
  .hr-nav > a { font-size: 11px; }
  .hr-account-controls { flex-wrap: wrap; justify-content: flex-end; gap: 6px 9px; }
  .hr-nav-user { font-size: 10px; }
  .hr-account-controls .button-small { min-height: 30px; }
  .vacancy-search-field { grid-column: auto; }
  .applicant-work-history .applicant-history-heading { flex-direction: column; gap: 5px; }
  .applicant-work-history .applicant-history-heading > span { max-width: 100%; text-align: left; }
}

/* Apply the same focus treatment to all administration fields and editors. */
:where(input:not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="hidden"]), select, textarea, [contenteditable="true"]):focus {
  border-color: #06a3da !important;
  outline: 2px solid #06a3da !important;
  outline-offset: 1px !important;
  box-shadow: 0 0 0 3px rgb(6 163 218 / 16%) !important;
}
:where(input[type="checkbox"], input[type="radio"]):focus { accent-color: #06a3da !important; }
.search-field:focus-within { border-color: #06a3da !important; box-shadow: 0 0 0 3px rgb(6 163 218 / 16%) !important; }
@media (max-width: 620px) {
  .vacancy-cancel-dialog-header { padding: 16px; }
  .vacancy-cancel-dialog-form { padding: 16px; }
  .vacancy-cancel-captcha-row { grid-template-columns: minmax(0, 1fr); }
  .vacancy-cancel-captcha-row .account-captcha-image { max-width: 100%; }
}

.report-page > .page-heading p { margin: 7px 0 0; color: #58717e; font-size: 13px; line-height: 1.55; }
.report-filters { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)) auto; align-items: end; gap: 14px; }
.report-filters .filter-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.report-page-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.report-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.report-metric { display: grid; min-width: 0; gap: 8px; padding: 17px 19px; border: 1px solid #dfe8ea; border-radius: 9px; background: #fff; }
.report-metric span { color: #758796; font-size: 12px; line-height: 1.4; }
.report-metric strong { color: #263f50; font-size: 25px; font-weight: 700; line-height: 1.2; }
.report-section-note { max-width: 760px; margin: 7px 0 0; color: #758796; font-size: 12px; font-weight: 400; line-height: 1.55; }
.report-vacancy-table { min-width: 1180px; table-layout: fixed; }
.report-vacancy-table th { white-space: normal; line-height: 1.4; }
.report-vacancy-table td { vertical-align: top; }
.report-vacancy-table col:nth-child(1) { width: 20%; }
.report-vacancy-table col:nth-child(2) { width: 18%; }
.report-vacancy-table col:nth-child(3) { width: 8%; }
.report-vacancy-table col:nth-child(4), .report-vacancy-table col:nth-child(5),
.report-vacancy-table col:nth-child(6), .report-vacancy-table col:nth-child(7) { width: 10%; }
.report-vacancy-table col:nth-child(8), .report-vacancy-table col:nth-child(9) { width: 7%; }
.report-page .report-vacancy-table { border: 1px solid #dfe8ea; }
.report-page .report-vacancy-table th, .report-page .report-vacancy-table td { border: 1px solid #dfe8ea; }
.report-page .hr-table tr:last-child td { border-bottom: 1px solid #dfe8ea; }
.report-vacancy-id { color: #263f50; font-size: 12px; }
.report-vacancy-status { display: table; margin: 7px 0 5px; white-space: nowrap; }
.report-vacancy-title { display: block; margin-top: 5px; color: #58717e; font-size: 12px; line-height: 1.45; overflow-wrap: anywhere; }
.report-vacancy-company { display: block; margin-bottom: 7px; }
.report-primary-count, .report-rate { color: #263f50; font-size: 14px; }
.report-chart-card .section-heading { margin-bottom: 12px; }
.report-chart-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 26px; max-width: 900px; margin-inline: auto; }
.report-chart-panel { width: 100%; max-width: 420px; min-width: 0; margin-inline: auto; }
.report-chart-panel h3 { margin: 0 0 6px; color: #263f50; font-size: 14px; font-weight: 700; }
.report-mini-chart { display: block; width: 100%; height: auto; }
.report-chart-panel-frame { fill: transparent; stroke: #dfe8ea; stroke-width: 1; }
.report-chart-gridline { stroke: #e5ecee; stroke-width: 1; vector-effect: non-scaling-stroke; }
.report-chart-label { fill: #758796; font-family: inherit; font-size: 12px; }
.report-chart-axis-title { fill: #58717e; font-family: inherit; font-size: 11px; }
.report-chart-area { opacity: .1; stroke: none; }
.report-chart-series { fill: none; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.report-chart-series-total { color: #007fa4; stroke: #007fa4; }
.report-chart-series-logged-in { color: #375d85; stroke: #375d85; stroke-dasharray: 8 5; }
.report-chart-series-anonymous { color: #54a9b9; stroke: #54a9b9; stroke-dasharray: 3 5; }
.report-chart-series-applications { color: #c47b34; stroke: #c47b34; stroke-dasharray: 10 4 2 4; }
.report-chart-area.report-chart-series-total, .report-chart-dot.report-chart-series-total { fill: #007fa4; }
.report-chart-area.report-chart-series-logged-in, .report-chart-dot.report-chart-series-logged-in { fill: #375d85; }
.report-chart-area.report-chart-series-anonymous, .report-chart-dot.report-chart-series-anonymous { fill: #54a9b9; }
.report-chart-area.report-chart-series-applications, .report-chart-dot.report-chart-series-applications { fill: #c47b34; }
.report-chart-dot { fill: currentColor; stroke: #fff; stroke-width: 1.5; }
@media (max-width: 1050px) {
    .report-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .report-filters .filter-actions { grid-column: 1 / -1; }
}
@media (max-width: 620px) {
    .report-filters { grid-template-columns: minmax(0, 1fr); gap: 11px; }
    .report-filters .filter-actions { grid-column: 1; }
    .report-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
    .report-metric { padding: 13px; }
    .report-metric strong { font-size: 22px; }
}
@media (max-width: 760px) {
    .report-chart-grid { grid-template-columns: minmax(0, 1fr); gap: 16px; }
}
@media (max-width: 620px) {
    .report-chart-label { font-size: 15px; }
    .report-chart-axis-title { font-size: 14px; }
}
@media (max-width: 720px) {
    .report-vacancy-table { min-width: 0; }
}
@media (max-width: 375px) {
    .report-metrics { grid-template-columns: minmax(0, 1fr); }
}