/* =====================================================================
 * Shared page styles: CV Search, Client Search, Settings > Configuration.
 * Ubold theme colours only: dark #323a46, success #1abc9c, greys
 * #6c757d / #98a6ad, borders #dee2e6 / #eceff1, light fill #f7f8f9.
 * ===================================================================== */

/* ---------- tabs ---------- */
.cvs-tabs .nav-link { font-weight:600; color:#6c757d; padding:.6rem 1rem; }
.cvs-tabs .nav-link i { font-size:1.05rem; vertical-align:-1px; }
.cvs-tabs .nav-link.active { background:#1abc9c; color:#fff; }

/* ---------- filter forms (auto + manual) ---------- */
.cvs-intro { font-size:.8125rem; color:#6c757d; background:#f7f8f9; border:1px solid #eceff1;
    border-radius:.4rem; padding:.5rem .75rem; margin-bottom:.25rem; }
.cvs-intro i { color:#1abc9c; }
.cvs-section-title { display:flex; align-items:center; gap:.5rem; margin:1.1rem 0 .55rem;
    font-size:.7rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:#98a6ad; }
.cvs-section-title::after { content:''; flex:1; border-top:1px solid #eceff1; }
.cvs-filter-head { display:flex; align-items:center; gap:.45rem; min-height:22px; margin-bottom:.3rem; }
.cvs-filter-head .form-check-input { margin:0; flex-shrink:0; cursor:pointer; }
.cvs-filter-head label { margin:0; font-size:.8125rem; font-weight:600; color:#6c757d; cursor:pointer; }
.cvs-filter.is-on .cvs-filter-head label { color:#323a46; }
/* value entered but the filter is unticked: it is ignored by the search */
.cvs-filter.is-ignored .form-control,
.cvs-filter.is-ignored .input-group-text,
.cvs-filter.is-ignored .select2-selection { opacity:.55; }
.cvs-filters .form-control,
.cvs-filters .input-group-text { height:38px; font-size:.875rem; }
.cvs-filters .input-group-text { background:#f7f8f9; color:#6c757d; }
.cvs-filters .form-control:disabled { background:#f7f8f9; color:#323a46; opacity:1; }
.cvs-filters .select2-container .select2-selection--single { height:38px; }
.cvs-filters .select2-container--default .select2-selection--single .select2-selection__rendered { line-height:36px; }
.cvs-filters .select2-container--default .select2-selection--single .select2-selection__arrow { height:36px; }
.cvs-filters .select2-container .select2-selection--multiple { min-height:38px; }
.cvs-filters .select2-container--disabled .select2-selection { background:#f7f8f9 !important; }
.cvs-hint { font-size:.75rem; color:#98a6ad; }
.cvs-hint code { font-size:.75rem; }
.cvs-form-actions { display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-end; gap:.5rem;
    margin-top:1.1rem; padding-top:.85rem; border-top:1px solid #eceff1; }
.cvs-form-actions .cvs-hint { margin-right:auto; }
.cvs-jd-files:empty { display:none; }

/* ---------- result cards + grids (auto, manual, updated by candidates) ---------- */
.cvs-result-card { border:1px solid #dee2e6; border-radius:.5rem; box-shadow:none; overflow:hidden; }
.cvs-result-head { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:.5rem;
    padding:.7rem 1rem; background:#fff; border-bottom:1px solid #eceff1; }
.cvs-result-head .header-title { margin:0; font-size:.95rem; color:#323a46; }
.cvs-result-head .badge { font-size:.72rem; font-weight:600; }
.cvs-selected { font-size:.75rem; color:#6c757d; }
.cvs-toolbar-row { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:.5rem; margin-bottom:.6rem; }
.cvs-subsearch { width:340px; max-width:100%; }
.cv-tag-toolbar { display:flex; flex-wrap:wrap; align-items:center; gap:10px; padding:.6rem 1rem;
    background:#f7f8f9; border-bottom:1px solid #eceff1; }
.cv-tag-toolbar .form-label { font-size:.75rem; font-weight:600; color:#6c757d; white-space:nowrap; }
.cv-tag-toolbar .cv-tag-select { flex:1 1 320px; min-width:240px; max-width:520px; }
.cv-tag-toolbar .btn { flex-shrink:0; }
@media (max-width:575.98px) {
    .cv-tag-toolbar .cv-tag-select { flex-basis:100%; max-width:none; }
    .cv-tag-toolbar .btn { width:100%; }
}
.cvs-table-wrap { position:relative; min-height:130px; }
.cvs-table-scroll { border:1px solid #eceff1; border-radius:.4rem; overflow:auto; }
.cvs-grid { margin-bottom:0; }
.cvs-grid thead th { position:sticky; top:0; z-index:2; background:#323a46; color:#fff; border:0;
    font-size:.72rem; font-weight:600; letter-spacing:.03em; text-transform:uppercase;
    white-space:nowrap; padding:.65rem .6rem; vertical-align:middle; }
.cvs-grid tbody td { font-size:.8125rem; line-height:1.45; color:#323a46; vertical-align:middle;
    padding:.65rem .6rem; border-color:#eceff1; }
.cvs-grid tbody tr:hover { background:#f7f8f9; }
.cvs-grid tfoot th { border:0; padding:0; }
.cvs-grid .chk-col { width:36px !important; min-width:36px; max-width:36px; text-align:center;
    white-space:nowrap; padding-left:6px !important; padding-right:6px !important; }
.cvs-grid .chk-col input[type="checkbox"] { float:none; margin:0; vertical-align:middle; }
.cvs-empty { text-align:center; color:#98a6ad; padding:2rem 1rem !important; }
.cvs-empty > i { display:block; font-size:1.8rem; margin-bottom:.25rem; }
.cvs-name { font-weight:600; font-size:.875rem; color:#323a46; }
a.cvs-name:hover { color:#1abc9c; }
.cvs-meta { display:flex; flex-direction:column; gap:2px; margin-top:3px; font-size:.78rem; color:#6c757d; }
.cvs-meta i { color:#98a6ad; margin-right:4px; }
.cvs-loading { position:absolute; inset:0; z-index:5; display:none; align-items:center; justify-content:center;
    background:rgba(255,255,255,.75); border-radius:.4rem; }
.cvs-loading.show { display:flex; }
.cvs-pager { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:.5rem; margin-top:.85rem; }
.cvs-pager-btns { display:flex; flex-wrap:wrap; align-items:center; gap:.25rem; }
.cvs-pager-btns .btn { min-width:32px; padding:.25rem .5rem; }
.auto-page-num.active, .manual-page-num.active, .client-page-num.active { background:#323a46 !important; border-color:#323a46 !important; color:#fff !important; }
.auto-page-ellipsis, .manual-page-ellipsis { padding:0 .3rem; color:#98a6ad; align-self:center; }
.auto-action-icons .action-icon { font-size:1.15rem; margin:0 .15rem; }

/* ---------- updated by candidates ---------- */
.uc-toolbar { background:#f7f8f9; border:1px solid #eceff1; border-radius:.4rem; padding:.75rem 1rem; }
.uc-toolbar .form-label { font-size:.75rem; font-weight:600; color:#6c757d; margin-bottom:.25rem; }
#updated_candidates_table tbody td { vertical-align:top; }
#updated_candidates_table .uc-name { font-weight:600; font-size:.875rem; }
#updated_candidates_table .uc-contact { font-size:.78rem; color:#6c757d; }
#updated_candidates_table .uc-contact i { color:#98a6ad; }
#updated_candidates_table .uc-change { font-size:.8125rem; margin-bottom:3px; }
#updated_candidates_table .uc-change .uc-label { font-weight:600; }
#updated_candidates_table .uc-old { text-decoration:line-through; color:#98a6ad; }
#updated_candidates_table .uc-remarks { font-size:.8125rem; background:#f7f8f9; border-left:3px solid #1abc9c;
    padding:4px 8px; margin-top:6px; white-space:pre-line; }

/* ---------- modals: one header style (dark) ---------- */
.cvs-modal .modal-content { border:0; border-radius:.5rem; overflow:hidden; }
.cvs-modal .modal-header { background:#323a46; color:#fff; border:0; padding:.75rem 1.25rem; }
.cvs-modal .modal-header .modal-title { color:#fff; font-size:1rem; font-weight:600; }
.cvs-modal .modal-header small { color:rgba(255,255,255,.7); }
.cvs-modal .modal-footer { border-top:1px solid #eceff1; padding:.6rem 1.25rem; }

/* ---------- candidate detail modal ---------- */
.cvs-dsec { border:1px solid #eceff1; border-radius:.4rem; margin-bottom:.75rem; }
.cvs-dsec-title { padding:.45rem .75rem; background:#f7f8f9; border-bottom:1px solid #eceff1;
    font-size:.72rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:#6c757d; }
.cvs-dsec-title i { color:#1abc9c; margin-right:.3rem; font-size:.9rem; }
.cvs-dsec-body { padding:.6rem .75rem .15rem; }
.cvs-dl { margin-bottom:.6rem; }
.cvs-dl-label { font-size:.7rem; letter-spacing:.03em; text-transform:uppercase; color:#98a6ad; }
.cvs-dl-value { font-size:.8125rem; font-weight:600; color:#323a46; word-break:break-word; }
.cvs-chip { display:inline-block; font-size:.75rem; font-weight:500; color:#323a46; background:#f7f8f9;
    border:1px solid #dee2e6; border-radius:1rem; padding:.15rem .6rem; margin:0 .3rem .3rem 0; }

/* ---------- WhatsApp preview ---------- */
.cvs-wa-bubble { background:rgba(26,188,156,.12); border:1px solid rgba(26,188,156,.35); border-radius:.5rem;
    padding:.85rem 1rem; color:#323a46; font-size:.875rem; line-height:1.55; }

/* ---------- client search ---------- */
.cvs-more-toggle { display:inline-flex; align-items:center; gap:.35rem; margin-top:1rem; padding:0; border:0;
    background:none; font-size:.8125rem; font-weight:600; color:#1abc9c; }
.cvs-more-toggle:hover { color:#16a085; }
.cvs-more-toggle .mdi-chevron-down { transition:transform .15s; }
.cvs-more-toggle[aria-expanded="true"] .mdi-chevron-down { transform:rotate(180deg); }
.cvs-clamp { max-width:260px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }

/* =====================================================================
 * ATS dashboard look (.ats-dash) - CV Search and Client Search
 * Same panel language as the ATS Dashboard (jobportal.html): white cards
 * with a #d5dce4 outline, a #eef3fa header strip carrying a green icon and
 * an uppercase title, uppercase field labels, 36px inputs and the
 * dashboard's green Search / grey Reset buttons.
 * ===================================================================== */
.ats-dash .dsh-panel,
.ats-dash .cvs-result-card { background:#fff; border:1px solid #d5dce4; border-radius:10px; box-shadow:none;
    margin-bottom:12px; overflow:visible; }
.ats-dash .dsh-head,
.ats-dash .cvs-result-head { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px;
    min-height:54px; padding:11px 16px; background:#eef3fa; border-bottom:1px solid #d5dce4; border-radius:10px 10px 0 0; }
.ats-dash .dsh-title { display:flex; align-items:center; gap:10px; min-width:0; }
.ats-dash .dsh-title > i { color:#1abc9c; font-size:18px; line-height:1; }
.ats-dash .dsh-title h5,
.ats-dash .cvs-result-head .header-title { margin:0; font-size:14px; font-weight:700; text-transform:uppercase;
    letter-spacing:.4px; color:#323a46; }
.ats-dash .cvs-result-head .header-title i { font-size:18px; vertical-align:-2px; }
.ats-dash .dsh-sub { display:block; font-size:11.5px; color:#98a6ad; margin-top:1px; }
.ats-dash .dsh-body { padding:16px 18px 14px; }
.ats-dash .dsh-collapse { width:30px; height:30px; border-radius:6px; border:1px solid #d5dce4; background:#fff; color:#495057;
    display:inline-flex; align-items:center; justify-content:center; font-size:18px; line-height:1; padding:0; margin-left:auto; }
.ats-dash .dsh-collapse:hover,
.ats-dash .dsh-collapse:focus { background:#323a46; border-color:#323a46; color:#fff; }
.ats-dash .dsh-panel.is-collapsed > .dsh-body { display:none; }
.ats-dash .dsh-panel.is-collapsed > .dsh-head { border-bottom:0; border-radius:10px; }

/* tabs: a segmented bar like the dashboard's filter strip */
.ats-dash .cvs-tabs { background:#fafbfe; border:1px solid #eef2f7; border-radius:8px; padding:4px; }
.ats-dash .cvs-tabs .nav-link { border-radius:6px; font-size:13px; text-transform:uppercase; letter-spacing:.3px; }
.ats-dash .cvs-tabs .nav-link:not(.active):hover { background:#eef3fa; color:#323a46; }

/* filter fields */
.ats-dash .cvs-intro { background:#fafbfe; border-color:#eef2f7; border-radius:6px; }
.ats-dash .cvs-filters .form-label,
.ats-dash .cvs-filter-head label,
.ats-dash .uc-toolbar .form-label,
.ats-dash .dsh-panel .form-label { font-size:12.5px; font-weight:600; text-transform:uppercase; letter-spacing:.3px;
    color:#495057 !important; margin-bottom:3px; }
.ats-dash .cvs-filter.is-on .cvs-filter-head label { color:#323a46 !important; }
.ats-dash .cvs-filters .form-label .cvs-hint,
.ats-dash .cvs-filter-head label .cvs-hint { text-transform:none; letter-spacing:0; }
.ats-dash .cvs-filters .form-control,
.ats-dash .cvs-filters .form-select,
.ats-dash .cvs-filters .input-group-text { height:36px; font-size:14px; border-color:#ced4da; }
.ats-dash .cvs-filters .form-control,
.ats-dash .cvs-filters .form-select { border-radius:6px; color:#323a46; }
.ats-dash .cvs-filters .input-group > :not(:first-child) { border-top-left-radius:0; border-bottom-left-radius:0; }
.ats-dash .cvs-filters .input-group > :not(:last-child) { border-top-right-radius:0; border-bottom-right-radius:0; }
.ats-dash .cvs-filters .form-control:focus,
.ats-dash .cvs-filters .form-select:focus { border-color:#4a81d4; box-shadow:0 0 0 .15rem rgba(74,129,212,.15); }
.ats-dash .cvs-filters .form-control::placeholder { color:#6c757d; }
.ats-dash .cvs-filters .select2-container .select2-selection--single { height:36px; border-radius:6px; }
.ats-dash .cvs-filters .select2-container--default .select2-selection--single .select2-selection__rendered { line-height:34px; color:#323a46; }
.ats-dash .cvs-filters .select2-container--default .select2-selection--single .select2-selection__arrow { height:34px; }
.ats-dash .cvs-filters .select2-container .select2-selection--multiple { min-height:36px; border-radius:6px; }
.ats-dash .cvs-section-title { color:#6c757d; font-size:11.5px; letter-spacing:.5px; }
.ats-dash .cvs-section-title::after { border-top-color:#eef2f7; }

/* bottom bar: hint on the left, Reset / Search on the right */
.ats-dash .cvs-form-actions { margin-top:16px; padding-top:12px; border-top:1px solid #eef2f7; gap:8px; }
.ats-dash .cvs-form-actions .btn,
.ats-dash .uc-toolbar .btn { height:34px; display:inline-flex; align-items:center; gap:2px; padding:0 14px;
    font-size:13px; font-weight:600; border-radius:6px; box-shadow:none; }
.ats-dash .cvs-form-actions .btn-light,
.ats-dash .uc-toolbar .btn-light { background:#eceef0; border:1px solid #cfd4d9; color:#3c4247; }
.ats-dash .cvs-form-actions .btn-light:hover,
.ats-dash .uc-toolbar .btn-light:hover { background:#6c757d; border-color:#6c757d; color:#fff; }

/* "Updated by candidates" filter strip = the dashboard date bar */
.ats-dash .uc-toolbar { background:#fafbfe; border:1px solid #eef2f7; border-radius:8px; padding:11px 16px; }
.ats-dash .uc-toolbar .form-control-sm { height:34px; border-radius:6px; font-size:13px; }

/* result cards: action buttons, tag bar, toolbar and grid in the dashboard style */
.ats-dash .cvs-result-head .btn { height:31px; display:inline-flex; align-items:center; border-radius:6px; font-weight:600; box-shadow:none; }
.ats-dash .cv-tag-toolbar { background:#fafbfe; border-bottom:1px solid #eef2f7; padding:11px 16px; }
.ats-dash .cv-tag-toolbar .form-label { font-size:11.5px; text-transform:uppercase; letter-spacing:.3px; }
.ats-dash .cv-tag-toolbar .form-label i { color:#1abc9c; }
.ats-dash .cv-tag-toolbar .btn { height:31px; border-radius:6px; font-weight:600; }
.ats-dash .cvs-result-card > .card-body { padding:14px 16px 16px; }
.ats-dash .cvs-toolbar-row .form-select-sm { height:30px; min-width:64px; border-radius:6px; border-color:#ced4da; font-size:12.5px; }
.ats-dash .cvs-subsearch .form-control,
.ats-dash .cvs-subsearch .input-group-text,
.ats-dash .cvs-subsearch .btn { height:31px; border-color:#dee2e6; }
.ats-dash .cvs-subsearch .input-group-text { border-radius:6px 0 0 6px; }
.ats-dash .cvs-subsearch > :last-child { border-radius:0 6px 6px 0; }
.ats-dash .cvs-table-scroll { border-color:#d5dce4; border-radius:8px; }
.ats-dash .cvs-grid thead th { font-size:.74rem; letter-spacing:.3px; }
.ats-dash .cvs-grid tbody tr:hover { background:#fafbfe; }
.ats-dash .cvs-pager { padding-top:12px; border-top:1px solid #eef2f7; }
.ats-dash .cvs-pager-btns .btn { border-radius:6px; }

/* head actions (buttons / selects on the right of a panel header) */
.ats-dash .dsh-actions { display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin-left:auto; }
.ats-dash .dsh-actions .btn { height:31px; display:inline-flex; align-items:center; gap:4px; padding:0 12px;
    font-size:12.5px; font-weight:600; border-radius:6px; box-shadow:none; }
.ats-dash .dsh-actions .form-select { height:31px; width:auto; min-width:170px; font-size:12.5px; border-radius:6px; border-color:#ced4da; }
.ats-dash .dsh-head-value { font-size:17px; font-weight:700; color:#323a46; }

/* status tiles = the dashboard's .status-card */
.ats-dash .dsh-tiles { display:grid; grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); gap:10px; }
.ats-dash .dsh-tile { background:#fff; border:1px solid #dee2e6; border-radius:8px; min-height:72px; padding:10px 12px;
    display:flex; flex-direction:column; justify-content:center; gap:4px; text-align:center; cursor:pointer;
    transition:border-color .15s, box-shadow .15s, transform .15s; }
.ats-dash .dsh-tile:hover,
.ats-dash .dsh-tile:focus { border-color:#1abc9c; box-shadow:0 2px 6px rgba(50,58,70,.10); transform:translateY(-1px); outline:none; }
.ats-dash .dsh-tile.resume-stat-tile-active { border-color:#1abc9c; background:rgba(26,188,156,.08); }
.ats-dash .dsh-tile-title { font-size:11.5px; font-weight:600; text-transform:uppercase; letter-spacing:.3px; color:#6c757d; line-height:15px; }
.ats-dash .dsh-tile-count { font-size:22px; font-weight:700; line-height:1.2; }
.ats-dash .dsh-progress { height:10px; border-radius:6px; background:#eef2f7; }
.ats-dash .dsh-progress .progress-bar { font-size:0; }
.ats-dash .dsh-progress-meta { display:flex; justify-content:space-between; align-items:center; margin:6px 0 12px;
    font-size:12px; color:#6c757d; }
.ats-dash .dsh-progress-meta b { color:#323a46; }

/* filter strip inside a panel = the dashboard date bar */
.ats-dash .dsh-filterbar { background:#fafbfe; border-bottom:1px solid #eef2f7; padding:14px 16px 12px; }
.ats-dash .dsh-filterbar .cvs-form-actions { margin-top:12px; }

/* plain panel tables (template list, tagged job orders...) in the grid style */
.ats-dash .dsh-table { margin-bottom:0; }
.ats-dash .dsh-table > thead > tr > th { background:#323a46 !important; color:#fff !important; border:0; font-size:.74rem;
    font-weight:600; letter-spacing:.3px; text-transform:uppercase; white-space:nowrap; padding:.65rem .6rem; vertical-align:middle; }
.ats-dash .dsh-table > tbody > tr > td { font-size:.8125rem; color:#323a46; vertical-align:middle; border-color:#eceff1; padding:.6rem .6rem; }
.ats-dash .dsh-table > tbody > tr:hover > td { background:#fafbfe; }

/* page links rendered by the list scripts (.pagination-summary + .pagination) */
.ats-dash .pagination-summary { margin:12px 0 8px; font-size:12.5px; color:#6c757d; }
.ats-dash .pagination { display:flex; flex-wrap:wrap; gap:4px; align-items:center; }
.ats-dash .pagination a,
.ats-dash .pagination span { min-width:32px; height:31px; padding:0 10px; margin:0; display:inline-flex; align-items:center; justify-content:center;
    border:1px solid #dee2e6; border-radius:6px; background:#fff; color:#323a46; font-size:12.5px; font-weight:600; text-decoration:none; }
.ats-dash .pagination a:hover { background:#fafbfe; border-color:#1abc9c; }
.ats-dash .pagination .active,
.ats-dash .pagination span.active { background:#323a46; border-color:#323a46; color:#fff; }
.ats-dash .pagination .dots { border:0; background:transparent; min-width:auto; padding:0 4px; }

/* horizontal form rows (label | field) used on edit pages */
.ats-dash .dsh-form .col-form-label { font-size:12.5px; font-weight:600; text-transform:uppercase; letter-spacing:.3px; color:#495057; }
.ats-dash .dsh-form .form-control:not(textarea) { height:36px; }
.ats-dash .dsh-form .form-control { border-radius:6px; font-size:14px; color:#323a46; border-color:#ced4da; }
.ats-dash .dsh-form .form-control:focus { border-color:#4a81d4; box-shadow:0 0 0 .15rem rgba(74,129,212,.15); }

/* =====================================================================
 * Settings > Configuration (.cfg-page)
 * ===================================================================== */
.cfg-page .tab-content { padding-top:1rem; }
.cfg-page .cvs-tabs .nav-link { white-space:nowrap; }

/* panels inside the tabs: flat, bordered */
.cfg-page .cfg-panel { border:1px solid #eceff1; border-radius:.5rem; box-shadow:none; background:#fff; }
.cfg-page .cfg-panel > .card-body { padding:1rem 1.1rem; }

/* labels: one weight / colour everywhere */
.cfg-page .col-form-label,
.cfg-page .form-label { font-size:.8125rem; font-weight:600; color:#6c757d; }
.cfg-page .form-label { margin-bottom:.3rem; }
.cfg-page .mandatory { color:#f1556c; }
.cfg-page hr { border-color:#eceff1; opacity:1; }
.cfg-page h4:not(.page-title), .cfg-page h5 { color:#323a46; }
.cfg-page .cvs-section-title { font-size:.7rem; }

/* every table on the page: the same dark header as the search grids */
.cfg-page .table { margin-bottom:0; }
.cfg-page .table > thead > tr > th { background:#323a46 !important; color:#fff !important; border-color:#323a46;
    font-size:.72rem; font-weight:600; letter-spacing:.03em; text-transform:uppercase; white-space:nowrap;
    padding:.6rem .6rem; vertical-align:middle; }
.cfg-page .table > tbody > tr > td { font-size:.8125rem; color:#323a46; vertical-align:middle; border-color:#eceff1; }
.cfg-page .table > tbody > tr:hover > td { background:#f7f8f9; }
.cfg-page .table > tfoot > tr > td { background:#f7f8f9; font-size:.8125rem; }

/* grouped blocks in the Company form (approvals, email settings) */
.cfg-page .section-box { background:#fff; border:1px solid #eceff1; border-radius:.5rem; padding:1rem 1.1rem;
    margin-bottom:1rem; box-shadow:none; }
.cfg-page .section-title { font-size:.8125rem; font-weight:700; color:#323a46; margin-bottom:.75rem; }
.cfg-page .sla-row td { background:#f7f8f9; }
.cfg-page .auto-row td { background:#eceff1; }
.cfg-page .main-row td { border-top:2px solid #dee2e6; }

/* Offer letter approval matrix: wide, first two columns stay in view */
.cfg-page .approval-wrapper { overflow-x:auto; }
.cfg-page #approvalTable { min-width:1200px; }
.cfg-page #approvalTable th,
.cfg-page #approvalTable td { min-width:180px; white-space:nowrap; }
.cfg-page #approvalTable select { width:100% !important; }
.cfg-page #approvalTable td:first-child,
.cfg-page #approvalTable td:nth-child(2) { position:sticky; background:#f7f8f9; z-index:2; }
.cfg-page #approvalTable th:first-child,
.cfg-page #approvalTable th:nth-child(2) { position:sticky; z-index:3; }
.cfg-page #approvalTable th:first-child, .cfg-page #approvalTable td:first-child { left:0; }
.cfg-page #approvalTable th:nth-child(2), .cfg-page #approvalTable td:nth-child(2) { left:180px; }

/* sort order buttons on Dropdown Values */
.cfg-page #sort_asending_config.active,
.cfg-page #sort_decending_config.active { background:#323a46; border-color:#323a46; color:#fff; }

/* ---- Configuration in the ATS dashboard look (.ats-dash .cfg-page) ----
   Tab bar is its own panel; each tab's sections are dsh-panels (see above). */
.ats-dash .cfg-page > .tab-content { padding-top:0; }
.ats-dash .cfg-tabbar > .dsh-body { padding:10px 16px; }
.ats-dash .cfg-tabbar .cvs-tabs { margin-bottom:0; }

/* sub-tabs (Stake-Holder, Job Order): same segmented strip as the main tabs */
.ats-dash .cfg-page .nav-tabs { display:flex; flex-wrap:wrap; gap:4px; margin-bottom:12px; padding:4px;
    background:#fff; border:1px solid #d5dce4; border-radius:8px; }
.ats-dash .cfg-page .nav-tabs .nav-link { border:0; border-radius:6px; padding:.45rem .9rem; background:transparent;
    font-size:12.5px; font-weight:600; text-transform:uppercase; letter-spacing:.3px; color:#6c757d; }
.ats-dash .cfg-page .nav-tabs .nav-link:not(.active):hover { background:#eef3fa; color:#323a46; }
.ats-dash .cfg-page .nav-tabs .nav-link.active { background:#1abc9c; color:#fff; }
.ats-dash .cfg-page .nav-tabs + .tab-content { padding-top:0; }

/* labels and fields: the dashboard search-panel sizes everywhere on the page */
.ats-dash .cfg-page .col-form-label,
.ats-dash .cfg-page .form-label { font-size:12.5px; font-weight:600; text-transform:uppercase; letter-spacing:.3px; color:#495057; }
.ats-dash .cfg-page .form-label .cvs-hint,
.ats-dash .cfg-page .col-form-label .cvs-hint { text-transform:none; letter-spacing:0; font-weight:400; }
.ats-dash .cfg-page .form-control:not(textarea),
.ats-dash .cfg-page .form-select:not(.form-select-sm) { height:36px; }
.ats-dash .cfg-page .form-control,
.ats-dash .cfg-page .form-select { border-radius:6px; border-color:#ced4da; font-size:14px; color:#323a46; }
.ats-dash .cfg-page .form-control:focus,
.ats-dash .cfg-page .form-select:focus { border-color:#4a81d4; box-shadow:0 0 0 .15rem rgba(74,129,212,.15); }
.ats-dash .cfg-page .select2-container .select2-selection--single { height:36px; border-radius:6px; }
.ats-dash .cfg-page .select2-container--default .select2-selection--single .select2-selection__rendered { line-height:34px; color:#323a46; }
.ats-dash .cfg-page .select2-container--default .select2-selection--single .select2-selection__arrow { height:34px; }
.ats-dash .cfg-page .select2-container .select2-selection--multiple { min-height:36px; border-radius:6px; }
.ats-dash .cfg-page .dsh-body .btn:not(.btn-sm):not(.btn-xs):not(.fileinput-button) { height:34px; display:inline-flex; align-items:center; justify-content:center; gap:2px;
    padding:0 14px; font-size:13px; font-weight:600; border-radius:6px; box-shadow:none; }
.ats-dash .cfg-page .dsh-body hr { border-color:#eef2f7; opacity:1; }

/* styles.css zeroes form.form-horizontal padding with !important; a form that is a panel body keeps it */
.ats-dash form.form-horizontal.dsh-body { padding:16px 18px 14px !important; }

/* panels whose children sit straight inside the card (Billing Format, Orchestration Email) */
.ats-dash .dsh-panel.dsh-loose > :not(.dsh-head) { padding-left:18px; padding-right:18px; }
.ats-dash .dsh-panel.dsh-loose > .dsh-head + * { padding-top:16px; }
.ats-dash .dsh-panel.dsh-loose > :last-child { padding-bottom:16px; }
.ats-dash .dsh-panel.dsh-loose > .cvs-form-actions { margin-left:18px; margin-right:18px; padding-left:0; padding-right:0; }

/* =====================================================================
 * Employee avatars - Users list, Users form, top bar (one look everywhere)
 * ===================================================================== */
.emp-avatar { width:36px; height:36px; flex:0 0 36px; border-radius:50%; overflow:hidden;
    display:inline-flex; align-items:center; justify-content:center;
    background:rgba(26,188,156,.15); color:#148f77; font-weight:700; font-size:.8rem; }
.emp-avatar img { width:100%; height:100%; object-fit:cover; display:block; }
#profile-pic, .nav-user img.rounded-circle { object-fit:cover; background:#eceff1; }
#pp-img { object-fit:cover; border-radius:50%; background:#eceff1; }
.emp-photo-edit { position:relative; display:inline-block; }
.emp-photo-edit .emp-photo-badge { position:absolute; right:2px; bottom:2px; width:30px; height:30px; border-radius:50%;
    display:flex; align-items:center; justify-content:center; background:#1abc9c; color:#fff; border:2px solid #fff;
    font-size:.95rem; pointer-events:none; }
.emp-photo-hint { font-size:.75rem; color:#98a6ad; margin-top:.35rem; text-align:center; }

/* Topbar WhatsApp icon: brief ring when a new reply arrives */
@keyframes wa-ring {
    0%, 100% { transform: rotate(0); }
    15%, 45%, 75% { transform: rotate(-15deg); }
    30%, 60%, 90% { transform: rotate(15deg); }
}
.noti-icon.wa-ring { display: inline-block; animation: wa-ring 0.9s ease-in-out 2; }

/* New WhatsApp reply popup (index.js showWAToast) - WhatsApp colours */
#waToastStack { position: fixed; top: 82px; right: 20px; z-index: 2000; display: flex; flex-direction: column; gap: 10px; width: 360px; max-width: calc(100vw - 32px); pointer-events: none; }
.wa-toast { pointer-events: auto; display: flex; align-items: flex-start; gap: 12px; padding: 14px 14px 14px 16px; background: #fff; border-radius: 12px; border-left: 5px solid #25d366; box-shadow: 0 10px 30px rgba(11, 20, 26, .22); cursor: pointer; opacity: 0; transform: translateX(24px); transition: opacity .25s, transform .25s; }
.wa-toast.show { opacity: 1; transform: none; }
.wa-toast:hover { box-shadow: 0 12px 34px rgba(11, 20, 26, .3); }
.wa-toast-icon { width: 40px; height: 40px; border-radius: 50%; background: #25d366; color: #fff; font-size: 24px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.wa-toast-body { flex: 1; min-width: 0; }
.wa-toast-title { font-size: 15px; font-weight: 700; color: #0b141a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wa-toast-text { font-size: 14px; color: #3b4a54; margin-top: 2px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.wa-toast-foot { font-size: 12.5px; font-weight: 600; color: #008069; margin-top: 5px; }
.wa-toast-close { border: 0; background: transparent; color: #667781; font-size: 22px; line-height: 1; padding: 0 2px; }
.wa-toast-close:hover { color: #0b141a; }

/* =====================================================================
 * Job order comments modal (#jpcModal) - assets/js/custom/topbar-notifications.js
 * Header, composer and each comment are separate white cards on a light grey
 * body, so the thread never reads as one block.
 * ===================================================================== */
#jpcModal .min-w-0 { min-width:0; }
#jpcModal .jpc-header { background:#fff; border-bottom:1px solid #e9ecef; padding:1rem 1.25rem; }
#jpcModal .jpc-header-ico { width:42px; height:42px; flex:0 0 42px; border-radius:10px;
    display:inline-flex; align-items:center; justify-content:center;
    background:#6658dd; color:#fff; font-size:1.35rem; box-shadow:0 3px 8px rgba(102,88,221,.3); }
#jpcModal .jpc-title { font-size:1.05rem; font-weight:700; color:#323a46; margin:0 0 .3rem; }
#jpcModal .jpc-subtitle { display:flex; flex-wrap:wrap; gap:.35rem; }
#jpcModal .jpc-chip { display:inline-flex; align-items:center; gap:.25rem; max-width:100%;
    padding:.1rem .5rem; border-radius:50rem; background:#f1f3fa; color:#6c757d;
    font-size:.72rem; font-weight:500; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#jpcModal .jpc-chip .mdi { color:#6658dd; }
#jpcModal .jpc-body { background:#f5f6f8; padding:1rem 1.25rem 1.25rem; }

/* composer */
#jpcModal .jpc-composer { display:flex; gap:.75rem; align-items:flex-start;
    padding:.875rem; border:1px solid #e9ecef; border-radius:.5rem; background:#fff;
    box-shadow:0 1px 2px rgba(0,0,0,.03); }
#jpcModal .jpc-composer textarea { font-size:.875rem; }

/* "Discussion" heading between the composer and the thread */
#jpcModal .jpc-list-head { display:flex; align-items:center; gap:.5rem; margin:1.25rem 0 .6rem;
    font-size:.75rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:#6c757d; }
#jpcModal .jpc-list-head small { text-transform:none; letter-spacing:0; font-weight:400; }

/* each comment is its own card */
#jpcModal .jpc-list { display:flex; flex-direction:column; gap:.75rem; }
#jpcModal .jpc-item { display:flex; gap:.75rem; padding:.875rem 1rem; background:#fff;
    border:1px solid #e9ecef; border-left:3px solid #e9ecef; border-radius:.5rem;
    box-shadow:0 1px 2px rgba(0,0,0,.03); }
#jpcModal .jpc-item.jpc-mine { border-left-color:#6658dd; }
#jpcModal .jpc-item.jpc-unread { border-left-color:#f7b84b; background:#fffdf7; }
#jpcModal .jpc-main { flex:1 1 auto; min-width:0; }
#jpcModal .jpc-meta { display:flex; align-items:center; flex-wrap:wrap; gap:.2rem; font-size:.8rem; line-height:1.4; }
#jpcModal .jpc-name { font-weight:700; color:#323a46; font-size:.85rem; }
#jpcModal .jpc-dot, #jpcModal .jpc-time { color:#98a6ad; }
#jpcModal .jpc-time { cursor:default; }
#jpcModal .jpc-bubble { margin-top:.35rem; color:#343a40; font-size:.875rem; line-height:1.5;
    white-space:pre-wrap; word-break:break-word; }
#jpcModal .jpc-actions { display:flex; gap:1rem; margin-top:.5rem; font-size:.78rem; }
#jpcModal .jpc-actions a { color:#6c757d; font-weight:500; }
#jpcModal .jpc-actions a:hover { color:#6658dd; }

/* seen by */
#jpcModal .jpc-seen { margin-top:.6rem; padding:.5rem .75rem; border:1px solid #eef0f3; border-radius:.5rem; font-size:.8rem; background:#f8f9fa; }
#jpcModal .jpc-seen-head { font-weight:600; color:#6c757d; margin-bottom:.35rem; }
#jpcModal .jpc-seen-row { display:flex; align-items:center; gap:.5rem; padding:.2rem 0; }
#jpcModal .jpc-unseen { opacity:.55; }

/* replies: an indented grey panel inside the comment card */
#jpcModal .jpc-replies:not(:empty) { margin-top:.65rem; padding:.25rem .75rem; background:#f8f9fa;
    border-radius:.5rem; border-left:2px solid #dee2e6; }
#jpcModal .jpc-reply { display:flex; gap:.5rem; padding:.45rem 0; }
#jpcModal .jpc-reply + .jpc-reply { border-top:1px dashed #e3e6ea; }
#jpcModal .jpc-bubble-reply { margin-top:.15rem; font-size:.84rem; }
#jpcModal .emp-avatar.jpc-av-sm { width:28px; height:28px; flex:0 0 28px; font-size:.7rem; }
#jpcModal .jpc-more { display:inline-block; margin:.35rem 0 0 .75rem; font-size:.78rem; }
#jpcModal .jpc-reply-box { display:flex; gap:.4rem; margin-top:.6rem; }
#jpcModal .jpc-empty { text-align:center; color:#98a6ad; padding:2.5rem 1rem; background:#fff;
    border:1px dashed #dee2e6; border-radius:.5rem; }
#jpcModal .jpc-empty > .mdi { font-size:2.5rem; color:#ced4da; line-height:1; margin-bottom:.5rem; }

/* =====================================================================
 * Topbar notification panels (Job order comments, Resume comments, Notifications)
 * ===================================================================== */
.tb-panel { width:380px; max-width:calc(100vw - 16px); padding:0; overflow:visible; border:0; box-shadow:0 .5rem 1.5rem rgba(0,0,0,.15); }
.tb-panel > :first-child { border-top-left-radius:inherit; border-top-right-radius:inherit; }
.tb-panel > :last-child { border-bottom-left-radius:inherit; border-bottom-right-radius:inherit; }
.tb-panel .tb-head { display:flex; align-items:center; justify-content:space-between; gap:.5rem;
    padding:.75rem 1rem; background:#f8f9fa; border-bottom:1px solid #eef0f3; font-weight:600; color:#343a40; }
.tb-panel .tb-mark-all { font-size:.78rem; font-weight:500; color:#6658dd; white-space:nowrap; }
.tb-panel .tb-mark-all.disabled { color:#ced4da; pointer-events:none; }
.tb-panel .tb-head-count { font-size:.72rem; font-weight:600; color:#f1556c; background:rgba(241,85,108,.12); border-radius:1rem; padding:.1rem .5rem; }
.tb-panel .tb-head-count:empty { display:none; }
.tb-panel .tb-tools { display:flex; position:relative; align-items:center; justify-content:space-between; gap:.5rem; padding:.4rem 1rem; border-bottom:1px solid #eef0f3; }
.tb-panel .tb-range { display:inline-flex; align-items:center; gap:.3rem; margin:0; font-size:.78rem; color:#6c757d; cursor:pointer; }
.tb-panel .tb-range .mdi { color:#6658dd; font-size:.95rem; }
.tb-panel .tb-range .flatpickr-wrapper { position:static; }
.tb-panel input.tb-range-input { width:9.5rem; border:1px solid #e3e6ea; border-radius:.25rem; padding:.15rem .4rem; font-size:.75rem; color:#495057; background:#fff; cursor:pointer; }
.tb-panel input.tb-range-input:focus { outline:0; border-color:#6658dd; }
.tb-panel .tb-tools .flatpickr-calendar.static { top:calc(100% + 2px); left:.5rem; z-index:1060; box-shadow:0 .25rem .75rem rgba(0,0,0,.15); }
.tb-panel .tb-list { max-height:420px; overflow-y:auto; }
.tb-panel .tb-item { display:flex; gap:.65rem; align-items:flex-start; padding:.7rem 1rem; white-space:normal;
    border-bottom:1px solid #f1f3f5; position:relative; }
.tb-panel .tb-item:last-child { border-bottom:0; }
.tb-panel .tb-item.tb-unread { background:rgba(102,88,221,.06); }
.tb-panel .tb-item.tb-unread::before { content:""; position:absolute; left:0; top:0; bottom:0; width:3px; background:#6658dd; }
.tb-panel .tb-body { flex:1 1 auto; min-width:0; }
.tb-panel .tb-title { display:flex; align-items:center; gap:.4rem; font-size:.82rem; color:#343a40; font-weight:600; min-width:0; }
.tb-panel .tb-title > .text-truncate { min-width:0; }
.tb-panel .tb-text { font-size:.8rem; color:#6c757d; margin-top:.1rem; overflow:hidden;
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; word-break:break-word; }
.tb-panel .tb-sub { font-size:.72rem; color:#98a6ad; margin-top:.2rem; }
.tb-panel .tb-dot { width:8px; height:8px; flex:0 0 8px; border-radius:50%; background:#6658dd; }
.tb-panel .tb-empty { text-align:center; color:#98a6ad; padding:2rem 1rem; font-size:.85rem; }
.tb-panel .tb-empty > .mdi { font-size:2.2rem; color:#ced4da; line-height:1; margin-bottom:.4rem; }

/* Topbar "Top recruiters" leaderboard */
.tb-panel .tb-month { display:inline-flex; align-items:center; gap:.25rem; font-size:.8rem; font-weight:500; color:#6c757d; }
.tb-panel .tb-month a { color:#6658dd; font-size:1.1rem; line-height:1; padding:0 .15rem; }
.tb-panel .tb-month a.disabled { color:#ced4da; pointer-events:none; }
.tb-top-totals { display:grid; grid-template-columns:repeat(4, 1fr); gap:.4rem; padding:.6rem .75rem; border-bottom:1px solid #eef0f3; }
.tb-top-totals:empty { display:none; }
.tb-top-total { text-align:center; background:#f8f9fa; border-radius:.4rem; padding:.35rem .2rem; line-height:1.15; }
.tb-top-total .mdi { color:#6658dd; font-size:1rem; display:block; }
.tb-top-total b { display:block; font-size:1rem; color:#343a40; }
.tb-top-total small { font-size:.62rem; color:#98a6ad; }
.tb-panel .tb-top-row { align-items:center; cursor:default; }
.tb-panel .tb-top-row:hover { background:transparent; }
.tb-panel .tb-top-row.tb-unread:hover { background:rgba(102,88,221,.06); }
.tb-rank { width:24px; flex:0 0 24px; text-align:center; font-weight:700; font-size:.8rem; color:#98a6ad; }
.tb-rank .mdi { font-size:1.2rem; }
.tb-rank-1 { color:#f7b84b; }
.tb-rank-2 { color:#98a6ad; }
.tb-rank-3 { color:#cd7f32; }
.tb-top-score { text-align:center; font-weight:700; font-size:1.1rem; color:#1abc9c; line-height:1; min-width:56px; }
.tb-top-score small { display:block; font-size:.6rem; font-weight:500; color:#98a6ad; margin-top:.15rem; }
.tb-top-me-label { padding:.4rem 1rem 0; font-size:.7rem; text-transform:uppercase; letter-spacing:.03em; color:#98a6ad; border-top:1px dashed #dee2e6; }

/* Configuration: a .row placed straight in a panel (after its body) gets the body's side padding */
.ats-dash .cfg-page .dsh-panel > .row { margin:0; padding:0 18px 16px; }
/* a bordered grid wrapper that is itself a row column: move the gutter from padding to margin */
.ats-dash .cfg-page .row > .cvs-table-scroll { padding:0; margin-left:calc(var(--bs-gutter-x) * .5); margin-right:calc(var(--bs-gutter-x) * .5); width:calc(100% - var(--bs-gutter-x)); }
.ats-dash .cfg-page .dsh-panel > .row > .table-responsive { padding:0; margin-left:0; margin-right:0; width:100%; }