:root {
    --navy: #1a365d;
    --navy-2: #122744;
    --navy-hover: #234876;
    --gold: #c9a227;
    --gold-dark: #a6851c;
    --bg: #f3f5f8;
    --text: #1e293b;
    --muted: #64748b;
    --border: #e2e8f0;
    --sidebar-w: 260px;
    --header-h: 56px;
    --admin-mobile-nav-h: 56px;
}

* { box-sizing: border-box; }

body {
    margin: 0;
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    background: var(--bg);
    color: var(--text);
    font-size: 14px;
    line-height: 1.5;
}

a { color: var(--navy); text-decoration: none; }
a:hover { color: var(--navy-hover); }

.num, .tabular-nums { font-variant-numeric: tabular-nums; text-align: right; }

/* Header */
.app-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: var(--header-h);
    background: var(--navy);
    border-bottom: 3px solid var(--gold);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 1.25rem;
    z-index: 1030;
    color: #fff;
}

.app-brand {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    color: #fff;
    font-weight: 600;
    font-size: 1rem;
}

.app-brand-mark {
    width: 32px;
    height: 32px;
    background: var(--gold);
    color: var(--navy);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 0.75rem;
    border-radius: 4px;
}

.app-header-actions {
    display: flex;
    align-items: center;
    gap: 1rem;
    font-size: 0.875rem;
}

.save-status {
    color: rgba(255,255,255,0.75);
    min-width: 4rem;
}

.save-status.is-visible { color: var(--gold); }

/* Shell */
.app-shell {
    display: flex;
    padding-top: var(--header-h);
    min-height: 100vh;
}

.app-sidebar {
    width: var(--sidebar-w);
    flex-shrink: 0;
    background: var(--navy-2);
    color: rgba(255,255,255,0.85);
    padding: 1rem 0;
    position: fixed;
    top: var(--header-h);
    bottom: 0;
    overflow-y: auto;
}

.app-main {
    flex: 1;
    margin-left: var(--sidebar-w);
    padding: 1.5rem 2rem 2rem;
    min-width: 0;
}

/* Sidebar */
.sidebar-section {
    padding-bottom: 0.5rem;
    margin-bottom: 0.35rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.sidebar-section:last-child {
    border-bottom: 0;
    margin-bottom: 0;
}

.sidebar-section-label {
    font-size: 0.65rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.45);
    padding: 0.75rem 1rem 0.35rem;
    font-weight: 600;
}

.sidebar-link-disabled {
    display: block;
    padding: 0.5rem 1rem;
    color: rgba(255, 255, 255, 0.28);
    cursor: not-allowed;
}

.current-project-card {
    display: block;
    margin: 0 0.75rem 1rem;
    padding: 0.75rem 1rem;
    background: rgba(255,255,255,0.08);
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 6px;
    color: #fff;
    transition: background 0.15s;
}

.current-project-card:hover {
    background: rgba(255,255,255,0.12);
    color: #fff;
}

.current-project-card .cp-name {
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.15rem;
}

.current-project-card .cp-ref {
    font-size: 0.75rem;
    color: rgba(255,255,255,0.55);
}

.sidebar-nav a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    color: rgba(255,255,255,0.75);
    font-size: 0.875rem;
    border-left: 3px solid transparent;
}

.sidebar-nav a:hover,
.sidebar-nav a.active {
    background: rgba(255,255,255,0.06);
    color: #fff;
    border-left-color: var(--gold);
}

.sidebar-link-label {
    min-width: 0;
}

.sidebar-notify-dot {
    flex: 0 0 auto;
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 50%;
    background: #e11d48;
    box-shadow: 0 0 0 2px rgba(18, 39, 68, 0.9);
}

.sidebar-nav a.disabled {
    pointer-events: none;
    opacity: 0.4;
}

.sidebar-nav-nested a,
.sidebar-nav-nested .sidebar-link-disabled {
    padding-left: 1.15rem;
    font-size: 0.84rem;
}

.sidebar-link-disabled {
    display: block;
    padding: 0.5rem 1rem;
    color: rgba(255,255,255,0.35);
    font-size: 0.875rem;
    border-left: 3px solid transparent;
    cursor: default;
}

.task-planning-wrap {
    overflow: hidden;
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
}

.task-planning-scroll {
    overflow: auto;
    flex: 1 1 auto;
    min-height: 0;
    -webkit-overflow-scrolling: touch;
}

/* Shared viewport-fill list pages (table scrolls inside panel) */
body:has(.pms-fill-page) {
    overflow: hidden;
    height: 100vh;
}

body:has(.pms-fill-page) .app-shell {
    min-height: 0;
    height: 100vh;
    overflow: hidden;
}

body:has(.pms-fill-page) .app-main {
    display: flex;
    flex-direction: column;
    height: calc(100vh - var(--header-h));
    max-height: calc(100vh - var(--header-h));
    overflow: hidden;
    box-sizing: border-box;
}

body:has(.pms-fill-page) .app-main > .alert-flash,
body:has(.pms-fill-page) .app-main > .alert {
    flex-shrink: 0;
}

.pms-fill-page {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}

.pms-fill-header {
    flex-shrink: 0;
}

.pms-fill-panel {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}

.pms-fill-scroll {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
}

.pms-fill-scroll .table-pms thead th {
    position: sticky;
    top: 0;
    z-index: 6; /* above .pms-tree-rail-layer (5) so rows don't show through */
    background: #dde5f0;
}

.pms-fill-footer {
    flex-shrink: 0;
}

/* Project setup / reporting period sections */
.setup-section .setup-section-title {
    margin: 0 0 1rem;
    padding-bottom: 0.55rem;
    border-bottom: 1px solid var(--border, #d7dee8);
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--navy, #1b2a4a);
}

.setup-section.form-horizontal .row-field,
.form-horizontal .setup-section .row-field {
    max-width: none;
}

.setup-section .field-wrap {
    max-width: none;
}

/* Lock Task Planning into the viewport — table scrolls, main wrapper does not */
body:has(.tp-page) {
    overflow: hidden;
    height: 100vh;
}

body:has(.tp-page) .app-shell {
    min-height: 0;
    height: 100vh;
    overflow: hidden;
}

body:has(.tp-page) .app-main {
    display: flex;
    flex-direction: column;
    height: calc(100vh - var(--header-h));
    max-height: calc(100vh - var(--header-h));
    overflow: hidden;
    box-sizing: border-box;
}

body:has(.tp-page) .app-main > .alert-flash {
    flex-shrink: 0;
}

.tp-panel-frame {
    flex: 1 1 auto;
    min-height: 0;
    height: auto;
    max-height: none;
    overflow: hidden;
}

.tp-page {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    height: auto;
    max-height: none;
    overflow: hidden;
}

.tp-tab-content {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.tp-tab-content > .tab-pane.show.active {
    display: flex !important;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}

.tp-plan-form {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}

.tp-page-tabs .nav-link {
    font-weight: 500;
    color: var(--muted);
}

.tp-page-tabs .nav-link.active {
    color: var(--navy);
    border-bottom-color: var(--navy);
}

/* Create structure table */
.tp-structure-wrap {
    overflow: hidden;
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
}

.tp-structure-scroll {
    overflow: auto;
    flex: 1 1 auto;
    min-height: 0;
    -webkit-overflow-scrolling: touch;
}

.tp-empty-panel {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
}

.tp-empty-state {
    text-align: center;
    padding: 2rem 1.5rem;
    max-width: 22rem;
}

.tp-empty-state > i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3.5rem;
    height: 3.5rem;
    margin-bottom: 1rem;
    border-radius: 999px;
    background: #e8eef5;
    color: var(--navy);
    font-size: 1.5rem;
}

.tp-empty-title {
    font-size: 1rem;
    font-weight: 600;
    color: var(--navy);
    margin-bottom: 0.35rem;
}

.tp-empty-text {
    font-size: 0.875rem;
    color: var(--muted);
    line-height: 1.45;
}

.tp-structure-table {
    margin-bottom: 0;
}

.tp-structure-table thead th {
    position: sticky;
    top: 0;
    z-index: 6; /* above .pms-tree-rail-layer (5) */
    background: #dde5f0;
}

.tp-structure-table .tp-struct-col-num {
    width: 3rem;
    min-width: 3rem;
    vertical-align: middle;
    text-align: left;
    padding-left: 0.65rem;
    padding-right: 0.25rem;
    white-space: nowrap;
}

.tp-structure-table thead th.tp-struct-col-num {
    text-align: left;
    padding-left: 0.65rem;
}

.tp-structure-table .tp-struct-col-item {
    min-width: 16rem;
    vertical-align: middle;
    padding-left: 0.35rem;
    text-align: left;
}

.tp-structure-table tr.tp-struct-parent > td {
    background: #fff;
}

.tp-structure-table tr.tp-struct-child > td {
    background: #f4f6f8;
}

.tp-structure-table .wp-item-cell {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    min-width: 0;
}

.tp-structure-table .wp-item-cell.is-child:not(.pms-tree) {
    padding-left: 0.35rem;
}

.tp-structure-table thead th.tp-struct-col-item {
    padding-left: 0.35rem;
}

.tp-structure-table .tp-struct-col-zone {
    width: 9.5rem;
    min-width: 9.5rem;
    vertical-align: middle;
}

.tp-structure-table .tp-struct-col-subzone {
    width: 9.5rem;
    min-width: 9.5rem;
    vertical-align: middle;
}

.tp-structure-table .tp-struct-col-measure {
    width: 10rem;
    vertical-align: middle;
}

.tp-structure-table .tp-struct-col-budget {
    width: 10rem;
    vertical-align: middle;
}

.tp-structure-table .tp-struct-col-actions {
    width: 10rem;
    vertical-align: middle;
}

.tp-struct-child.tp-child-collapsed,
.tp-plan-child.tp-plan-child-collapsed,
.tp-plan-child.tp-child-collapsed,
#table-tp-structure tr.tp-list-hide,
#table-task-planning tr.tp-list-hide {
    display: none !important;
}

/* Plan grid */
.task-planning-table {
    width: max-content;
    min-width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    margin-bottom: 0;
}

.task-planning-table .tp-col-num {
    position: sticky;
    left: 0;
    z-index: 5;
    background: #fff;
    width: 3rem;
    min-width: 3rem;
    max-width: 3rem;
    padding: 0.45rem 0.25rem 0.45rem 0.65rem;
    vertical-align: middle;
    text-align: left;
    white-space: nowrap;
}

.task-planning-table .tp-col-item {
    position: sticky;
    left: 3rem;
    z-index: 4;
    background: #fff;
    width: 14rem;
    min-width: 14rem;
    max-width: 14rem;
    padding: 0.45rem 0.75rem 0.45rem 0.35rem;
    vertical-align: middle;
    border-right: 1px solid rgba(15, 23, 42, 0.12);
    box-shadow: 4px 0 8px -4px rgba(15, 23, 42, 0.12);
    text-align: left;
}

/* When # is inlined/hidden, Work Item sticks at left edge (match Create tree alignment) */
#table-task-planning.is-by-zone .tp-col-item,
#table-task-planning.has-inline-nums .tp-col-item,
#table-task-planning.is-by-zone thead th.tp-col-item,
#table-task-planning.has-inline-nums thead th.tp-col-item {
    left: 0;
    width: 16.5rem;
    min-width: 16.5rem;
    max-width: 16.5rem;
}

/* Plan zone/sub-zone header: tree in sticky item col; band continues across months */
#table-task-planning.is-by-zone tr.tp-zone-header > td.tp-col-item,
#table-task-planning.has-inline-nums tr.tp-zone-header > td.tp-col-item,
#table-task-planning.is-by-zone tr.tp-subzone-header > td.tp-col-item,
#table-task-planning.has-inline-nums tr.tp-subzone-header > td.tp-col-item {
    z-index: 5;
}

#table-task-planning tr.tp-zone-header > td.tp-zone-band-rest,
#table-task-planning tr.tp-subzone-header > td.tp-zone-band-rest {
    border-right: 0;
    box-shadow: none;
}

.task-planning-table thead .tp-col-num {
    text-align: left;
    padding-left: 0.65rem;
}

.task-planning-table thead .tp-col-item {
    padding-left: 0.35rem;
}

.task-planning-table .wp-item-cell {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    min-width: 0;
    max-width: 100%;
}

.task-planning-table .wp-item-cell.pms-tree {
    display: flex;
    width: 100%;
}

.task-planning-table .wp-item-cell.is-child:not(.pms-tree) {
    padding-left: 0.35rem;
}

.task-planning-table .tp-item-name {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.task-planning-table thead .tp-col-num,
.task-planning-table thead .tp-col-item {
    z-index: 7; /* above month headers + rail layer */
    background: #dde5f0;
    top: 0;
}

.task-planning-table thead th {
    position: sticky;
    top: 0;
    z-index: 6; /* above .pms-tree-rail-layer (5) */
    background: #dde5f0;
}

.task-planning-table.tp-plan-only .tp-col-month,
.task-planning-table.tp-plan-only .tp-col-plan {
    width: 5.5rem;
    min-width: 5.5rem;
    max-width: 5.5rem;
    white-space: nowrap;
    vertical-align: middle;
}

.task-planning-table.tp-plan-only .tp-col-month {
    text-align: center;
    font-weight: 600;
    letter-spacing: 0.02em;
    border-left: 1px solid rgba(15, 23, 42, 0.1);
    padding: 0.55rem 0.4rem;
}

.task-planning-table.tp-plan-only .tp-month-label {
    display: block;
    text-align: center;
    text-transform: uppercase;
    font-size: 0.72rem;
    letter-spacing: 0.04em;
}

.task-planning-table.tp-plan-only .tp-month-badge {
    display: block;
    width: fit-content;
    margin: 0.2rem auto 0;
}

.task-planning-table.tp-plan-only .tp-col-plan {
    border-left: 1px solid rgba(15, 23, 42, 0.1);
    padding: 0.35rem 0.35rem;
    background: #fff;
    text-align: center;
}

.task-planning-table.tp-plan-only .tp-col-plan-band {
    border-left: 1px solid rgba(15, 23, 42, 0.08);
    background: #fff;
    padding: 0;
}

/* Match Create: parents (incl. packages) white; children tinted */
.task-planning-table.tp-plan-only tr.tp-plan-parent > td.tp-col-num,
.task-planning-table.tp-plan-only tr.tp-plan-parent > td.tp-col-item,
.task-planning-table.tp-plan-only tr.tp-plan-package > td.tp-col-num,
.task-planning-table.tp-plan-only tr.tp-plan-package > td.tp-col-item {
    background: #fff;
}

.task-planning-table.tp-plan-only tr.tp-plan-child > td.tp-col-num,
.task-planning-table.tp-plan-only tr.tp-plan-child > td.tp-col-item,
.task-planning-table.tp-plan-only tr.tp-plan-child > td.tp-col-plan:not(.tp-month-current) {
    background: #f4f6f8;
}

.task-planning-table.tp-plan-only tbody tr.tp-plan-parent:nth-child(even) td.tp-col-plan:not(.tp-month-current) {
    background: #fafbfc;
}

.task-planning-table .tp-month-current {
    background: rgba(201, 162, 39, 0.1) !important;
}

.task-planning-table thead .tp-month-current {
    background: #e8e0c4 !important; /* opaque gold tint (was rgba — showed rows through) */
    color: var(--navy);
}

.tp-month-badge {
    display: inline-block;
    margin-left: 0.25rem;
    padding: 0.05rem 0.35rem;
    border-radius: 999px;
    font-size: 0.6rem;
    font-weight: 600;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    background: rgba(201, 162, 39, 0.25);
    color: var(--navy);
    vertical-align: middle;
}

.tp-plan-input {
    background: #fff;
    border: 1px solid #cbd5e1;
    box-shadow: inset 0 1px 1px rgba(15, 23, 42, 0.04);
    text-align: right;
    font-variant-numeric: tabular-nums;
    min-height: 1.85rem;
    padding: 0.2rem 0.35rem;
    width: 100%;
}

.tp-plan-input:focus {
    border-color: var(--navy);
    box-shadow: 0 0 0 0.15rem rgba(30, 58, 95, 0.15);
    background: #fff;
}

.tp-plan-input::placeholder {
    color: #cbd5e1;
}

.tp-item-name {
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--navy);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.tp-item-name.is-package {
    font-weight: 600;
    color: #334155;
}

.wp-item-label {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--navy);
}

.task-planning-table tbody tr:hover .tp-col-num,
.task-planning-table tbody tr:hover .tp-col-item {
    background: #f8fafc;
}

.task-planning-table tbody tr:hover td.tp-col-plan:not(.tp-month-current) {
    background: #f8fafc;
}

.task-planning-table tbody tr.tp-plan-child:hover > td.tp-col-num,
.task-planning-table tbody tr.tp-plan-child:hover > td.tp-col-item,
.task-planning-table tbody tr.tp-plan-child:hover > td.tp-col-plan:not(.tp-month-current) {
    background: #eef1f4;
}

.tp-modal-col-title {
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--muted);
    margin-bottom: 0.85rem;
    padding-bottom: 0.4rem;
    border-bottom: 1px solid var(--border);
}

.tp-edit-task {
    position: relative;
}

.tp-tree-toggle {
    position: relative;
}

.tp-tree-toggle.has-alert {
    color: #b45309;
}

.tp-edit-alert {
    position: absolute;
    top: -0.35rem;
    right: -0.35rem;
    width: 0.95rem;
    height: 0.95rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #b45309;
    background: #fff;
    border-radius: 999px;
    line-height: 1;
    pointer-events: none;
}

.tp-tree-toggle .tp-edit-alert {
    top: -0.3rem;
    right: -0.4rem;
}

.tp-edit-alert .bi {
    font-size: 0.85rem;
}

.tp-field-alert {
    display: inline-flex;
    align-items: center;
    color: #b45309;
    margin-left: 0.25rem;
    vertical-align: middle;
    cursor: help;
}

.tp-field-alert .bi {
    font-size: 0.85rem;
}

#table-tp-structure tr.tp-zone-header td,
#table-task-planning tr.tp-zone-header td {
    background: #e8eef5;
    color: var(--navy, #1a365d);
    font-weight: 650;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding-top: 0.5rem;
    padding-bottom: 0.45rem;
    border-top: 0;
    border-bottom: 1px solid #d5dde8;
    text-align: left;
}

#table-tp-structure.is-by-zone tr.tp-zone-header td,
#table-tp-structure.is-by-zone tr.tp-subzone-header td,
#table-task-planning.is-by-zone tr.tp-zone-header td,
#table-task-planning.is-by-zone tr.tp-subzone-header td {
    border-bottom: none;
}

#table-tp-structure tr.tp-subzone-header td,
#table-task-planning tr.tp-subzone-header td {
    background: transparent;
    color: #475569;
    font-weight: 600;
    font-size: 0.8125rem;
    letter-spacing: 0.01em;
    padding-top: 0.55rem;
    padding-bottom: 0.35rem;
    border-top: 0;
    border-bottom: 1px solid #e8edf4;
    text-align: left;
}

#table-tp-structure tr.tp-subzone-header + tr.tp-struct-parent td,
#table-tp-structure tr.tp-subzone-header + tr.tp-plan-parent td,
#table-task-planning tr.tp-subzone-header + tr.tp-struct-parent td,
#table-task-planning tr.tp-subzone-header + tr.tp-plan-parent td {
    border-top: 0;
}

/* File-tree hierarchy (By zone): continuous 26px guide rails */
.pms-tree {
    --pms-tree-step: 26px;
    --pms-tree-line: #94a3b8;
    --pms-tree-stroke: 1px;
    --pms-tree-inset: 10px;
    /* Same arm length at every depth (sub / parent / child) */
    --pms-tree-arm: 14px;
    --pms-tree-depth: 0;
    display: flex;
    align-items: center;
    gap: 0.2rem;
    min-width: 0;
    position: relative;
    padding-left: 0.1rem;
}

.pms-tree-text {
    min-width: 0;
}

.pms-tree-label {
    display: inline-flex;
    align-items: baseline;
    gap: 0.35rem;
    min-width: 0;
    flex: 1 1 auto;
}

.pms-tree-guides {
    display: flex;
    flex-shrink: 0;
    align-self: stretch;
    min-height: 1.5rem;
    position: relative;
    z-index: 2;
}

.pms-guide {
    position: relative;
    flex: 0 0 var(--pms-tree-step);
    width: var(--pms-tree-step);
    align-self: stretch;
}

/* Fallback in-row stems — use background (not border) so weight matches overlay rails */
.pms-guide.is-line::before {
    content: '';
    position: absolute;
    left: var(--pms-tree-inset);
    top: 0;
    bottom: 0;
    width: var(--pms-tree-stroke);
    background: var(--pms-tree-line);
}

.pms-guide.is-line.is-end::before {
    bottom: auto;
    height: 50%;
    top: 0;
}

.pms-guide.is-elbow::before {
    content: '';
    position: absolute;
    left: var(--pms-tree-inset);
    top: 0;
    height: 50%;
    width: var(--pms-tree-stroke);
    background: var(--pms-tree-line);
}

.pms-guide.is-elbow.is-open::before {
    top: 0;
    bottom: 0;
    height: auto;
}

.pms-guide.is-elbow::after {
    content: '';
    position: absolute;
    left: var(--pms-tree-inset);
    top: 50%;
    width: var(--pms-tree-arm);
    height: var(--pms-tree-stroke);
    margin-top: calc(var(--pms-tree-stroke) / -2);
    background: var(--pms-tree-line);
    z-index: 3;
}

/* Continuous overlay rails (one axis across rows; sits above separators) */
.pms-tree-rail-layer {
    position: absolute;
    pointer-events: none;
    z-index: 5;
    overflow: visible;
}

.pms-tree-rail {
    position: absolute;
    width: var(--pms-tree-stroke, 1px);
    margin: 0;
    padding: 0;
    border: 0;
    background: var(--pms-tree-line, #94a3b8);
    display: block;
    pointer-events: none;
}

/* Hide per-row vertical stems once overlay is active; keep elbow horizontals */
table.has-tree-rails .pms-guide.is-line::before,
table.has-tree-rails .pms-guide.is-elbow::before {
    content: none;
    display: none;
}

.pms-tree.is-depth-0 {
    font-weight: 650;
    gap: 0;
}

.pms-tree.is-zone .pms-tree-text {
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.pms-tree.is-subzone .pms-tree-text {
    font-weight: 600;
    color: #475569;
}

.pms-tree-num {
    flex-shrink: 0;
    font-size: 0.75rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: var(--navy, #1a365d);
    min-width: 1.5rem;
    line-height: 1.25rem;
}

.pms-tree-num.is-child {
    font-weight: 500;
    color: var(--muted, #6b7280);
    font-size: 0.7rem;
}

.pms-tree.is-depth-1 .tp-item-name,
.pms-tree.is-depth-1 .wp-item-label,
.pms-tree.is-depth-3 .tp-item-name,
.pms-tree.is-depth-3 .wp-item-label {
    font-weight: 400;
}

.pms-tree.is-depth-2 .tp-item-name,
.pms-tree.is-depth-2 .wp-item-label {
    font-weight: 600;
}

/* Shared tree metrics (list + by-zone) */
table.has-tree-rails,
table.is-by-zone {
    --pms-tree-step: 26px;
    --pms-tree-line: #94a3b8;
    --pms-tree-stroke: 1px;
    --pms-tree-inset: 10px;
    --pms-tree-arm: 14px;
    border-collapse: separate !important;
    border-spacing: 0;
}

/* # column hidden when numbers live inline in the tree (list + by-zone) */
table.is-by-zone .tp-struct-col-num,
table.is-by-zone .tp-col-num,
table.is-by-zone .wp-col-num,
table.is-by-zone .wa-col-num,
table.is-by-zone thead th.tp-struct-col-num,
table.is-by-zone thead th.tp-col-num,
table.is-by-zone thead th.wp-col-num,
table.is-by-zone thead th.wa-col-num,
table.has-inline-nums .tp-struct-col-num,
table.has-inline-nums .tp-col-num,
table.has-inline-nums .wp-col-num,
table.has-inline-nums .wa-col-num,
table.has-inline-nums thead th.tp-struct-col-num,
table.has-inline-nums thead th.tp-col-num,
table.has-inline-nums thead th.wp-col-num,
table.has-inline-nums thead th.wa-col-num {
    display: none;
}

/* Tree item cells: allow overflow for rails; keep full row separators.
   Overlay rails (.pms-tree-rail-layer z-index 5) paint above borders. */
table.has-tree-rails td.tp-struct-col-item,
table.has-tree-rails td.tp-col-item,
table.has-tree-rails td.wp-col-item,
table.has-tree-rails td.wa-col-item,
table.has-tree-rails td.ct-col-item,
table.is-by-zone td.tp-struct-col-item,
table.is-by-zone td.tp-col-item,
table.is-by-zone td.wp-col-item,
table.is-by-zone td.wa-col-item,
table.is-by-zone td.ct-col-item {
    position: relative;
    overflow: visible;
    /* Do not set box-shadow: none — Bootstrap table-hover uses inset box-shadow */
}

/* Zone header band only — sub-zone keeps a full row separator */
table.is-by-zone tr.tp-zone-header > td[colspan],
table.is-by-zone tr.wp-zone-header > td[colspan],
table.is-by-zone tr.wa-zone-header > td[colspan],
table.is-by-zone tr.wp-zone-header > td.wp-col-item {
    border-bottom: none !important;
}

/* Plan sticky Work Item: drop edge shadow so it does not sit over rails */
#table-task-planning.has-tree-rails td.tp-col-item,
#table-task-planning.is-by-zone td.tp-col-item {
    box-shadow: none;
}

.pms-tree > .wp-toggle-children {
    margin-left: 0;
    flex-shrink: 0;
}

/* Prefer guide rails over list-mode L when tree guides are active */
.pms-tree > .wp-child-branch {
    display: none;
}

/* List-mode fallback elbow (before JS guides / SSR) — same stroke & arm as By-zone */
.wp-child-branch {
    --pms-tree-line: #94a3b8;
    --pms-tree-stroke: 1px;
    --pms-tree-inset: 10px;
    --pms-tree-arm: 14px;
    flex-shrink: 0;
    width: 26px;
    height: 1.25rem;
    margin: 0;
    border: 0;
    align-self: center;
    position: relative;
}

.wp-child-branch::before {
    content: '';
    position: absolute;
    left: var(--pms-tree-inset);
    top: 0;
    height: 50%;
    width: var(--pms-tree-stroke);
    background: var(--pms-tree-line);
}

.wp-child-branch.is-open::before {
    height: auto;
    bottom: 0;
}

.wp-child-branch::after {
    content: '';
    position: absolute;
    left: var(--pms-tree-inset);
    top: 50%;
    width: var(--pms-tree-arm);
    height: var(--pms-tree-stroke);
    margin-top: calc(var(--pms-tree-stroke) / -2);
    background: var(--pms-tree-line);
}

/* Zones / Locations hierarchy (match Task Planning list tree) */
.zones-table.has-inline-nums,
.zones-table.has-tree-rails {
    --pms-tree-step: 26px;
    --pms-tree-line: #94a3b8;
    --pms-tree-stroke: 1px;
    --pms-tree-inset: 10px;
    --pms-tree-arm: 14px;
    border-collapse: separate !important;
    border-spacing: 0;
}

.zones-table.has-tree-rails td.zones-col-name {
    position: relative;
    overflow: visible;
    /* Do not set box-shadow: none — Bootstrap table-hover uses inset box-shadow */
}

.zones-table .pms-tree {
    width: 100%;
}

.zones-table .pms-tree.is-depth-0 .zones-name-text {
    font-weight: 600;
    color: var(--navy, #1a365d);
}

.zones-table .pms-tree.is-depth-1 .zones-name-text {
    font-weight: 400;
    color: var(--text, #334155);
}

.zones-table tr.zone-sub-row > td {
    background: #f8fafc;
}

.zones-table tr.zone-main-row > td {
    background: #fff;
}

.zones-table.table-hover > tbody > tr:hover > td {
    background: #eef2f6;
}

#tpTaskModal.modal.show {
    display: flex !important;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

#tpDeleteModal.modal.show {
    display: flex !important;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

#tpDeleteModal .tp-delete-dialog {
    width: min(28rem, calc(100vw - 2rem));
    max-width: 28rem;
    margin: 0;
}

#tpDeleteModal .modal-body {
    padding: 1.25rem 1.5rem;
}

#tpTaskModal .tp-task-dialog {
    width: 80vw;
    max-width: 80vw;
    height: 80vh;
    max-height: calc(100vh - 2rem);
    margin: 0;
}

#tpTaskModal .tp-task-modal-content {
    height: 80vh;
    max-height: 80vh;
    display: flex;
    flex-direction: column;
}

#tpTaskModal .modal-header,
#tpTaskModal .modal-footer {
    flex-shrink: 0;
}

#tpTaskModal .tp-task-modal-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    padding: 1.25rem 1.5rem;
}

#tpTaskModal .tp-task-form .row-field {
    max-width: none;
    align-items: flex-start;
}

#tpTaskModal .tp-task-form label {
    width: 7.5rem;
    flex-shrink: 0;
    padding-top: 0.4rem;
    font-size: 0.875rem;
}

#tpTaskModal .tp-task-form .field-wrap {
    max-width: none;
    flex: 1;
    min-width: 0;
}

@media (max-width: 767.98px) {
    #tpTaskModal .tp-task-dialog,
    #tpTaskModal .tp-task-modal-content {
        width: calc(100vw - 1.5rem);
        max-width: calc(100vw - 1.5rem);
        height: auto;
        max-height: calc(100vh - 1.5rem);
    }

    #tpTaskModal .tp-task-form .row-field {
        flex-direction: column;
        gap: 0.35rem;
    }

    #tpTaskModal .tp-task-form label {
        width: 100%;
        padding-top: 0;
    }
}

/* Page */
.page-title {
    font-size: 1.35rem;
    font-weight: 600;
    margin-bottom: 0.35rem;
    color: var(--navy);
}

.page-subtitle {
    color: var(--muted);
    margin-bottom: 1.5rem;
    font-size: 0.875rem;
}

.page-nav {
    margin-top: 2rem;
    padding-top: 1rem;
    border-top: 1px solid var(--border);
    display: flex;
    justify-content: space-between;
    gap: 1rem;
}

/* Cards & KPIs */
.card-panel {
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 1.25rem;
    margin-bottom: 1rem;
}

.kpi-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 1rem;
    margin-bottom: 1rem;
}

.kpi-card {
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 1rem 1.25rem;
}

.kpi-label {
    font-size: 0.75rem;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 0.35rem;
}

.kpi-value {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--navy);
}

.kpi-card .kpi-value,
.kpi-card .kpi-value.num {
    text-align: left;
}

.ipc-ready-banner {
    padding: 0.9rem 1rem;
    border: 1px solid #c5d0de;
    border-radius: 0.4rem;
    background: #f4f7fb;
}

#table-ipc-batches {
    table-layout: fixed;
    width: 100%;
}

#table-ipc-batches tbody tr.ipc-batch-row {
    cursor: pointer;
}

#table-ipc-batches tbody tr.ipc-batch-row:hover > td {
    background: #eef2f6;
}

#table-ipc-batches > :not(caption) > * > * {
    padding-top: 0.55rem;
    padding-bottom: 0.55rem;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
    vertical-align: middle;
    text-align: left;
}

#table-ipc-batches th.ipc-col-num,
#table-ipc-batches td.ipc-col-num {
    width: 2.75rem;
    min-width: 2.75rem;
    padding-left: 0.65rem;
}

#table-ipc-batches th.ipc-col-period,
#table-ipc-batches td.ipc-col-period {
    width: 20%;
}

#table-ipc-batches th.ipc-col-no,
#table-ipc-batches td.ipc-col-no {
    width: 18%;
}

#table-ipc-batches th.ipc-col-included,
#table-ipc-batches td.ipc-col-included {
    width: 9%;
    text-align: right;
    font-variant-numeric: tabular-nums;
}

#table-ipc-batches th.ipc-col-claim,
#table-ipc-batches td.ipc-col-claim,
#table-ipc-batches th.ipc-col-certified,
#table-ipc-batches td.ipc-col-certified {
    width: 16%;
    white-space: nowrap;
    text-align: right;
    font-variant-numeric: tabular-nums;
}

#table-ipc-batches th.ipc-col-status,
#table-ipc-batches td.ipc-col-status {
    width: 12%;
    white-space: nowrap;
    text-align: center;
}

/* Empty batches: keep header chrome; center copy under sticky thead */
.ipc-batches-scroll:has(.ipc-empty-row) {
    position: relative;
    overflow: hidden;
}

#table-ipc-batches:has(.ipc-empty-row) {
    height: 100%;
    margin-bottom: 0;
}

#table-ipc-batches .ipc-empty-row > td {
    padding: 0 !important;
    border-bottom: 0;
    height: 100%;
    vertical-align: middle;
}

.ipc-empty-state {
    position: absolute;
    left: 0;
    right: 0;
    top: 2.75rem;
    bottom: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 2rem 1.5rem;
    box-sizing: border-box;
    pointer-events: none;
}

.ipc-empty-state > i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3.5rem;
    height: 3.5rem;
    margin-bottom: 1rem;
    border-radius: 999px;
    background: #e8eef5;
    color: var(--navy, #1a365d);
    font-size: 1.5rem;
}

.ipc-empty-title {
    font-size: 1rem;
    font-weight: 600;
    color: var(--navy, #1a365d);
    margin-bottom: 0.35rem;
}

.ipc-empty-text {
    font-size: 0.875rem;
    color: var(--muted, #6b7280);
    line-height: 1.45;
    max-width: 26rem;
    margin: 0 0 1rem;
}

.ipc-empty-actions {
    pointer-events: auto;
}

@media (max-width: 992px) {
    #table-ipc-batches > :not(caption) > * > * {
        padding-left: 0.55rem;
        padding-right: 0.55rem;
    }

    #table-ipc-batches th.ipc-col-period,
    #table-ipc-batches td.ipc-col-period {
        width: 22%;
    }

    #table-ipc-batches th.ipc-col-no,
    #table-ipc-batches td.ipc-col-no {
        width: 16%;
    }
}

/* IPC batch detail — page fill */
body:has(.ipc-page) {
    overflow: hidden;
    height: 100vh;
}

body:has(.ipc-page) .app-shell {
    min-height: 0;
    height: 100vh;
    overflow: hidden;
}

body:has(.ipc-page) .app-main {
    display: flex;
    flex-direction: column;
    height: calc(100vh - var(--header-h));
    max-height: calc(100vh - var(--header-h));
    overflow: hidden;
    box-sizing: border-box;
    padding-bottom: 1rem;
}

body:has(.ipc-page) .app-main > .alert-flash,
body:has(.ipc-page) .app-main > .alert {
    flex-shrink: 0;
}

.ipc-page {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}

.ipc-page-header {
    flex-shrink: 0;
    margin-bottom: 0.75rem;
}

.ipc-batch-panel.card-panel {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    margin-top: 0;
    margin-bottom: 0;
    overflow: hidden;
}

.ipc-batch-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem 1rem;
    flex-wrap: wrap;
    flex-shrink: 0;
    padding: 0.65rem 1rem;
    border-bottom: 1px solid var(--border, #e2e8f0);
    background: #fff;
}

.ipc-batch-toolbar-title {
    font-size: 0.75rem;
    font-weight: 650;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--muted, #6b7280);
}

.ipc-batch-toolbar-meta {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.15rem 0;
    font-size: 0.8125rem;
    color: var(--muted, #6b7280);
}

.ipc-batch-toolbar-meta strong {
    color: var(--navy, #1a365d);
    font-weight: 650;
}

.ipc-batch-meta-sep {
    margin: 0 0.45rem;
    opacity: 0.55;
}

.ipc-save-status {
    margin-left: 0.65rem;
    font-size: 0.75rem;
}

.ipc-batch-table-scroll {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
}

#table-ipc-members {
    table-layout: fixed;
    width: 100%;
    margin-bottom: 0;
}

#table-ipc-members thead th {
    position: sticky;
    top: 0;
    z-index: 6;
    background: #dde5f0;
}

#table-ipc-members > :not(caption) > * > * {
    padding-top: 0.55rem;
    padding-bottom: 0.55rem;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
    vertical-align: middle;
    text-align: left;
}

#table-ipc-members th.ipc-m-check,
#table-ipc-members td.ipc-m-check {
    width: 2.75rem;
    text-align: center;
    padding-left: 0.65rem;
    padding-right: 0.35rem;
}

#table-ipc-members th.ipc-m-item,
#table-ipc-members td.ipc-m-item {
    width: 28%;
}

#table-ipc-members th.ipc-m-contractor,
#table-ipc-members td.ipc-m-contractor {
    width: 16%;
}

#table-ipc-members th.ipc-m-amount,
#table-ipc-members td.ipc-m-amount,
#table-ipc-members th.ipc-m-paid,
#table-ipc-members td.ipc-m-paid,
#table-ipc-members th.ipc-m-remain,
#table-ipc-members td.ipc-m-remain {
    width: 12%;
    white-space: nowrap;
    text-align: right;
    font-variant-numeric: tabular-nums;
}

#table-ipc-members th.ipc-m-pay,
#table-ipc-members td.ipc-m-pay {
    width: 9.5rem;
    text-align: right;
    white-space: nowrap;
}

.ipc-pay-actions {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    justify-content: flex-end;
}

#table-ipc-members tbody td {
    vertical-align: middle;
}

#table-ipc-members tr.ipc-member-excluded > td {
    color: #9aa3af;
    background: #fafbfc;
}

#table-ipc-members tr.ipc-member-excluded > td.num,
#table-ipc-members tr.ipc-member-excluded > td.ipc-m-amount,
#table-ipc-members tr.ipc-member-excluded > td.ipc-m-paid,
#table-ipc-members tr.ipc-member-excluded > td.ipc-m-remain {
    text-decoration: line-through;
}

/* Buttons */
.btn-navy {
    background: var(--navy);
    border-color: var(--navy);
    color: #fff;
}

.btn-navy:hover {
    background: var(--navy-hover);
    border-color: var(--navy-hover);
    color: #fff;
}

.btn-outline-navy {
    color: var(--navy);
    border-color: var(--navy);
    background: transparent;
}

.btn-outline-navy:hover {
    background: var(--navy);
    border-color: var(--navy);
    color: #fff;
}

.btn-gold {
    background: var(--gold);
    border-color: var(--gold-dark);
    color: var(--navy);
    font-weight: 600;
}

.btn-gold:hover {
    background: var(--gold-dark);
    border-color: var(--gold-dark);
    color: #fff;
}

/* Forms */
.form-horizontal .row-field {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    margin-bottom: 1rem;
    max-width: 720px;
}

.form-horizontal label {
    width: 200px;
    flex-shrink: 0;
    padding-top: 0.375rem;
    font-weight: 500;
    color: var(--text);
}

.form-horizontal .field-wrap {
    flex: 1;
    max-width: 480px;
}

.form-horizontal.form-full .row-field,
.form-horizontal.form-full .field-wrap,
.form-horizontal.form-full .invite-code-row {
    max-width: none;
}

.form-text-muted {
    font-size: 0.8rem;
    color: var(--muted);
    margin-top: 0.25rem;
}

/* Tables */
.table-pms th.num,
.table-pms td.num { text-align: right; }

.num-input {
    text-align: right;
}

.table-pms thead th {
    background: #dde5f0;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--navy);
    border-bottom: 1px solid #c5d0e0;
}

.project-row-current {
    background: rgba(201, 162, 39, 0.08) !important;
    border-left: 3px solid var(--gold);
}

.badge-current {
    background: var(--gold);
    color: var(--navy);
    font-weight: 600;
}

/* Variance */
.variance-pos { color: #15803d; }
.variance-neg { color: #b91c1c; }

/* Work programme parent / child */
.wp-item-cell {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    min-width: 0;
}

.wp-item-cell.pms-tree {
    width: 100%;
}

.wp-item-cell .form-control {
    flex: 1;
    min-width: 0;
}

.wp-item-cell.is-child:not(.pms-tree) {
    padding-left: 0.35rem;
}

.wp-row-num {
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: var(--navy, #1e3a5f);
    line-height: 1.75rem;
    min-width: 1.25rem;
    text-align: right;
}

.wp-row-num.is-child {
    font-weight: 500;
    color: var(--muted, #6b7280);
    font-size: 0.7rem;
}

.wp-toggle-children {
    flex-shrink: 0;
    width: 1.25rem;
    height: 1.25rem;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--muted, #6b7280);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    border-radius: 0.2rem;
}

.wp-toggle-children:not(:disabled):hover {
    color: var(--navy, #1e3a5f);
    background: rgba(26, 54, 93, 0.06);
}

.wp-toggle-children.is-empty,
.wp-toggle-children:disabled {
    visibility: hidden;
    pointer-events: none;
}

#table-work-programme tr.wp-parent-row > td {
    background: #fff;
}

#table-work-programme tr.wp-child-row > td {
    background: #f4f6f8;
    border-bottom: 1px solid #d5dde8;
}

/* Full-row click opens task modal — pointer cues the affordance */
#table-work-programme tbody tr.wp-parent-row,
#table-work-programme tbody tr.wp-child-row {
    cursor: pointer;
}

#table-work-programme tbody tr.wp-parent-row :is(input, select, textarea),
#table-work-programme tbody tr.wp-child-row :is(input, select, textarea) {
    cursor: auto;
}

/* Full-row hover (parent/child forced backgrounds otherwise win; match Zones / WA) */
#table-work-programme.table-hover > tbody > tr.wp-parent-row:hover > td,
#table-work-programme.table-hover > tbody > tr.wp-child-row:hover > td {
    background: #eef2f6;
}

#table-work-programme tr.wp-child-row .form-control,
#table-work-programme tr.wp-child-row .form-select {
    background: #fbfcfd;
    border-color: #d8dee6;
    color: #6b7280;
    box-shadow: none;
}

#table-work-programme tr.wp-child-row .variance-cell {
    color: #9ca3af;
    font-weight: 400;
}

#table-work-programme tr.wp-parent-row .variance-cell {
    font-weight: 600;
}

#table-work-programme tr.wp-child-row.wp-child-collapsed,
#table-work-programme tr.wp-list-hide {
    display: none !important;
}

.wp-list-pager,
.pms-list-pager {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
    margin-top: 0.75rem;
    flex-shrink: 0;
}

.pms-list-pager.is-inset {
    margin: 0;
    padding: 0.65rem 0.85rem;
    border-top: 1px solid var(--border, #e2e8f0);
    background: #fff;
}

.wp-list-pager-label,
.pms-list-pager-label {
    font-size: 0.8125rem;
    color: var(--muted, #6b7280);
    min-width: 10rem;
    text-align: center;
}

.claim-approval-table .ca-col-num,
.claim-history-table .ca-col-num,
.wa-attach-table .wa-col-num {
    width: 3rem;
    min-width: 3rem;
    white-space: nowrap;
}

.claim-approval-table tr.ca-page-hide,
.claim-history-table tr.ca-page-hide,
.wa-attach-table tr.wa-page-hide,
#table-tp-structure tr.tp-page-hide,
#table-task-planning tr.tp-page-hide {
    display: none !important;
}

.wp-item-th {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.wp-item-filter-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.35rem;
    height: 1.35rem;
    padding: 0;
    border: 0;
    border-radius: 0.25rem;
    background: transparent;
    color: var(--navy, #1a365d);
    opacity: 0.85;
    line-height: 1;
}

.wp-item-filter-btn:hover,
.wp-item-filter-btn.is-open {
    color: var(--navy, #1a365d);
    opacity: 1;
    background: rgba(26, 54, 93, 0.1);
}

.wp-item-filter-btn.is-active {
    color: var(--gold, #c9a227);
    opacity: 1;
}

.wp-item-filter-popover {
    position: absolute;
    top: calc(100% + 0.4rem);
    left: 0;
    z-index: 20;
    width: min(16rem, 70vw);
    padding: 0.55rem;
    background: #fff;
    border: 1px solid var(--border, #e2e8f0);
    border-radius: 0.4rem;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.14);
    text-transform: none;
    letter-spacing: normal;
    font-weight: 400;
}

.wp-item-filter-popover .form-control {
    font-size: 0.8125rem;
}

#table-work-programme tr.wp-zone-header td {
    background: #e8eef5;
    color: var(--navy, #1a365d);
    font-weight: 650;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding-top: 0.5rem;
    padding-bottom: 0.45rem;
    border-top: 0;
    border-bottom: 1px solid #d5dde8;
    text-align: left;
}

#table-work-programme tr.wp-zone-header > td.wp-zone-band-rest,
#table-work-programme tr.wp-subzone-header > td.wp-zone-band-rest {
    border-right: 0;
}

#table-work-programme.is-by-zone tr.wp-zone-header td {
    border-bottom: none;
}

/* Give Work Item room for tree + label once # is hidden (stops "WORK IT" truncation) */
#table-work-programme.is-by-zone .wp-col-item,
#table-work-programme.has-inline-nums .wp-col-item {
    width: 16.5rem;
    min-width: 14rem;
}

#table-work-programme tr.wp-subzone-header td {
    background: transparent;
    color: #475569;
    font-weight: 600;
    font-size: 0.8125rem;
    letter-spacing: 0.01em;
    padding-top: 0.55rem;
    padding-bottom: 0.35rem;
    border-top: 0;
    border-bottom: 1px solid #e8edf4;
    text-align: left;
}

#table-work-programme.is-by-zone tr.wp-subzone-header td {
    border-bottom: 1px solid #e8edf4;
}

.view-mode-switch {
    display: inline-flex;
    align-items: stretch;
    height: 2rem;
    padding: 0.15rem;
    gap: 0.15rem;
    background: #e8edf4;
    border: 1px solid #d0d7e2;
    border-radius: 0.4rem;
    box-sizing: border-box;
}

.view-mode-switch .btn {
    min-width: 5.25rem;
    height: auto;
    margin: 0;
    padding: 0 0.7rem;
    border: 0 !important;
    border-radius: 0.3rem !important;
    background: transparent;
    color: #5a6a7e;
    font-size: 0.8125rem;
    font-weight: 500;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: none !important;
}

.view-mode-switch .btn:hover {
    background: rgba(26, 54, 93, 0.08);
    color: var(--navy, #1a365d);
}

.view-mode-switch .btn.active,
.view-mode-switch .btn.active:hover,
.view-mode-switch .btn.active:focus {
    background: var(--navy, #1a365d);
    color: #fff;
    font-weight: 600;
    pointer-events: none;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.18) !important;
}

.summary-actual-mode {
    width: 100%;
}

.summary-actual-mode .view-mode-switch {
    display: flex;
    width: 100%;
}

.summary-actual-mode .view-mode-switch .btn {
    flex: 1 1 0;
    min-width: 0;
}

.schedule-field-full {
    width: 100%;
}

.schedule-field-full .schedule-status {
    width: 100%;
}

/* Match Expand / Collapse height with view switch */
#wa-expand-all,
#wa-collapse-all,
#wp-expand-all,
#wp-collapse-all,
.tp-expand-all,
.tp-collapse-all {
    height: 2rem;
    min-height: 2rem;
    min-width: 6.75rem;
    padding: 0 0.75rem;
    font-size: 0.8125rem;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.4rem;
    box-sizing: border-box;
}

.wp-actions-wrap {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.15rem;
    width: 100%;
}

.wp-row-actions {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.25rem;
    white-space: nowrap;
}

.wp-row-actions .btn {
    width: 1.75rem;
    height: 1.75rem;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    line-height: 1;
    font-size: 0.8rem;
}

.wp-parent-total-hint {
    font-size: 0.7rem;
    line-height: 1.1;
    white-space: nowrap;
    color: var(--muted, #6b7280);
    text-align: right;
}

/* Work programme table layout — fill panel width, no forced horizontal scroll */
#table-work-programme {
    width: 100%;
    table-layout: fixed;
}

#table-work-programme > :not(caption) > * > * {
    vertical-align: middle;
}

#table-work-programme thead th {
    padding: 0.55rem 0.35rem;
    white-space: nowrap;
    vertical-align: middle;
    line-height: 1.2;
}

#table-work-programme tbody td {
    padding: 0.35rem 0.35rem;
    border-bottom: 1px solid var(--border, #e2e8f0);
}

#table-work-programme .wp-col-num {
    width: 2.5rem;
    text-align: right;
    white-space: nowrap;
    padding-right: 0.35rem;
    padding-left: 0.35rem;
    vertical-align: middle;
}

#table-work-programme .wp-col-item {
    width: auto;
    text-align: left;
    padding-left: 0.25rem;
}

#table-work-programme .wp-col-zone,
#table-work-programme .wp-col-subzone {
    width: 8.5rem;
    min-width: 7.5rem;
    vertical-align: middle;
}

/* Align Work Item header with tree label start (match Task Planning Create) */
#table-work-programme thead th.wp-col-item {
    padding-left: 0.35rem;
}

#table-work-programme.has-inline-nums .wp-col-item,
#table-work-programme.is-by-zone .wp-col-item {
    padding-left: 0.35rem;
    min-width: 18rem;
}

#table-work-programme tr.wp-child-row .wp-col-item {
    padding-left: 0.25rem;
}

#table-work-programme.has-inline-nums tr.wp-child-row .wp-col-item,
#table-work-programme.is-by-zone tr.wp-child-row .wp-col-item {
    padding-left: 0.35rem;
}

#table-work-programme thead th.wp-col-num {
    text-align: right;
}

#table-work-programme .wp-col-pct {
    width: 6.75rem;
    text-align: left;
}

#table-work-programme thead th.wp-col-pct,
#table-work-programme thead th.wp-col-date,
#table-work-programme thead th.wp-col-schedule {
    text-align: left;
}

#table-work-programme .wp-col-actual {
    width: 6.75rem;
}

#table-work-programme .wp-actual-wrap {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0.15rem;
    justify-content: center;
}

#table-work-programme .wp-actual-wrap .actual-input {
    width: 100%;
    min-width: 0;
}

#table-work-programme .variance-chip {
    font-size: 0.65rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    line-height: 1;
    text-align: right;
}

#table-work-programme .variance-chip.is-empty {
    display: none;
}

#table-work-programme .wp-col-pct .form-control,
#table-work-programme .wp-col-pct .num-input {
    width: 100%;
    text-align: right;
}

#table-work-programme .wp-col-date {
    width: 9rem;
    text-align: left;
}

#table-work-programme .wp-col-schedule {
    width: 9rem;
    text-align: left;
}

#table-work-programme .wp-col-remarks {
    width: 12rem;
    min-width: 10rem;
    text-align: left;
}

#table-work-programme .wp-col-remarks .wp-parent-total-hint {
    display: block;
    font-size: 0.7rem;
    color: var(--muted, #6b7280);
    margin-bottom: 0.15rem;
}

#table-work-programme .wp-col-actions {
    width: 6.5rem;
    white-space: nowrap;
    text-align: right;
}

#table-work-programme .wp-col-item,
#table-work-programme .wp-col-item .form-control {
    text-align: left;
}

#table-work-programme .wp-item-label {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#table-work-programme .wp-col-pct .form-control,
#table-work-programme .wp-col-pct .num-input,
#table-work-programme .variance-cell {
    text-align: right;
}

#table-work-programme .form-control-sm,
#table-work-programme .form-select-sm {
    height: 1.75rem;
    min-height: 1.75rem;
    padding-top: 0.15rem;
    padding-bottom: 0.15rem;
    line-height: 1.25;
}

#table-work-programme .wp-col-pct .form-control,
#table-work-programme .wp-col-date .form-control,
#table-work-programme .wp-item-cell .form-control {
    width: 100%;
    min-width: 0;
}

#table-work-programme input.form-control-sm {
    min-width: 0;
}

#table-work-programme .wp-col-pct .form-control {
    padding-left: 0.3rem;
    padding-right: 0.3rem;
}

#table-work-programme .schedule-field,
#table-work-programme .schedule-field-compact {
    width: 100%;
}

#table-work-programme .schedule-status {
    width: 100% !important;
    min-width: 0;
    max-width: 100%;
    text-align: left;
}

.btn-wp-task {
    position: relative;
}

.btn-wp-task.is-configured {
    background: var(--navy, #1e3a5f);
    color: #fff;
    border-color: var(--navy, #1e3a5f);
}

.wp-task-badge {
    position: absolute;
    top: -0.35rem;
    right: -0.35rem;
    min-width: 1rem;
    height: 1rem;
    padding: 0 0.25rem;
    border-radius: 999px;
    background: #c45c26;
    color: #fff;
    font-size: 0.65rem;
    line-height: 1rem;
    font-weight: 600;
    text-align: center;
}

.wp-task-photo-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(6.5rem, 1fr));
    gap: 0.5rem;
}

.wp-task-photo {
    position: relative;
    display: block;
    width: 100%;
    padding: 0;
    border: 1px solid var(--border, #dee2e6);
    border-radius: 0.3rem;
    background: #fff;
    overflow: hidden;
    cursor: pointer;
}

.wp-task-photo img {
    display: block;
    width: 100%;
    aspect-ratio: 1;
    object-fit: cover;
}

.wp-task-photo-meta {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 0.2rem 0.35rem;
    font-size: 0.65rem;
    line-height: 1.2;
    color: #fff;
    background: linear-gradient(transparent, rgba(0, 0, 0, 0.65));
}

#wpSetupModal.modal.show {
    display: flex !important;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

#wpSetupModal .wp-setup-dialog {
    width: 80vw;
    max-width: 80vw;
    height: 80vh;
    max-height: calc(100vh - 2rem);
    margin: 0;
}

#wpSetupModal .wp-setup-modal-content {
    height: 80vh;
    max-height: 80vh;
    display: flex;
    flex-direction: column;
}

#wpSetupModal .modal-header {
    flex-shrink: 0;
}

#wpSetupModal .wp-setup-modal-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}

#wpSetupModal .wp-setup-tabs {
    display: flex;
    width: 100%;
    flex-shrink: 0;
    margin: 0;
    padding: 0 1rem;
    border-bottom: 1px solid var(--border, #dee2e6);
    background: #fff;
}

#wpSetupModal .wp-setup-tabs .nav-item {
    flex: 1 1 0;
    text-align: center;
}

#wpSetupModal .wp-setup-tabs .nav-link {
    width: 100%;
    color: var(--muted, #6b7280);
    font-size: 0.875rem;
    font-weight: 600;
    padding: 0.7rem 0.75rem;
    border: 0;
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
    background: transparent;
    border-radius: 0;
}

#wpSetupModal .wp-setup-tabs .nav-link:hover {
    color: var(--navy, #1e3a5f);
}

#wpSetupModal .wp-setup-tabs .nav-link.active {
    color: var(--navy, #1e3a5f);
    border-bottom-color: var(--gold, #c9a227);
    background: transparent;
}

#wpSetupModal .wp-setup-tab-badge {
    display: inline-block;
    min-width: 1.1rem;
    margin-left: 0.25rem;
    padding: 0.05rem 0.35rem;
    border-radius: 999px;
    background: var(--navy, #1e3a5f);
    color: #fff;
    font-size: 0.65rem;
    font-weight: 600;
    line-height: 1.2;
    vertical-align: middle;
}

#wpSetupModal .wp-setup-tab-content {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

#wpSetupModal .wp-setup-tab-content > .tab-pane.active {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

#wpSetupModal #wp-tab-photos.active:has(.wp-setup-photos-empty:not(.d-none)) {
    justify-content: center;
}

#wpSetupModal #wp-tab-measure.active:has(#wp-setup-parent-note:not(.d-none)) {
    justify-content: center;
}

#wpSetupModal #wp-tab-measure.active:has(#wp-setup-parent-note:not(.d-none)) .wp-setup-form {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

#wpSetupModal .wp-setup-photos-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    flex: 1 1 auto;
    width: 100%;
    min-height: 100%;
    padding: 2rem 1rem;
    text-align: center;
    color: var(--muted, #6b7280);
}

#wpSetupModal .wp-setup-photos-empty i {
    font-size: 2.5rem;
    line-height: 1;
    opacity: 0.55;
    color: var(--navy, #1e3a5f);
}

#wpSetupModal .wp-setup-photos-empty p {
    font-size: 0.9375rem;
    max-width: 22rem;
}

#wpSetupModal #wp-setup-parent-note:not(.d-none) {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    flex: 1 1 auto;
    width: 100%;
    min-height: 12rem;
    padding: 2rem 1rem;
    text-align: center;
    color: var(--muted, #6b7280);
}

#wpSetupModal #wp-setup-parent-note i {
    font-size: 2.5rem;
    line-height: 1;
    opacity: 0.55;
    color: var(--navy, #1e3a5f);
}

#wpSetupModal #wp-setup-parent-note p {
    font-size: 0.9375rem;
    max-width: 22rem;
}

#wpSetupModal .wp-task-photo-grid {
    grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr));
    gap: 0.75rem;
}

#wpSetupModal .wp-setup-form {
    max-width: none;
    width: 100%;
}

#wpSetupModal .wp-setup-form .row-field {
    margin-bottom: 1rem;
    max-width: none;
    align-items: flex-start;
}

#wpSetupModal .wp-setup-form label {
    width: 8rem;
    flex-shrink: 0;
    padding-top: 0.45rem;
}

#wpSetupModal .wp-setup-form .field-wrap {
    flex: 1;
    max-width: none;
    min-width: 0;
}

#wpSetupModal .wp-setup-form .form-control,
#wpSetupModal .wp-setup-form .form-select {
    width: 100%;
}

#wpSetupModal .wp-setup-form textarea.form-control {
    min-height: 12rem;
}

@media (max-width: 767.98px) {
    #wpSetupModal .wp-setup-dialog {
        width: calc(100vw - 1rem);
        max-width: calc(100vw - 1rem);
        height: auto;
        max-height: calc(100vh - 2rem);
        margin: 0;
    }

    #wpSetupModal .wp-setup-modal-content {
        height: auto;
        max-height: calc(100vh - 2rem);
    }

    #wpSetupModal .wp-setup-tabs {
        padding: 0 0.5rem;
    }

    #wpSetupModal .wp-setup-tabs .nav-link {
        font-size: 0.75rem;
        padding: 0.6rem 0.35rem;
    }

    #wpSetupModal .wp-setup-form .row-field {
        flex-direction: column;
        gap: 0.35rem;
    }

    #wpSetupModal .wp-setup-form label {
        width: 100%;
        padding-top: 0;
    }
}

#table-work-programme tr.wp-child-row,
.assignment-table tr.wp-child-row,
.report-data-table tr.wp-child-row {
    background: #f8fafc;
}

.assignment-table tr.wp-parent-row > td {
    background: #fff;
}

.assignment-table tr.wp-child-row > td {
    background: #f4f6f8;
    color: #4b5563;
}

.assignment-table tr.wp-child-row .wp-item-label {
    font-weight: 500;
    color: #4b5563;
}

.assignment-table tr.wp-parent-row .wp-item-label {
    font-weight: 600;
    color: var(--navy, #1e3a5f);
}

.assignment-table .assignment-col-item,
.assignment-table .ct-col-item {
    padding-left: 0.65rem;
}

.assignment-table tr.wp-child-row .assignment-col-item,
.assignment-table tr.wp-child-row .ct-col-item {
    padding-left: 0.65rem;
}

.assignment-table .wp-item-cell.is-child {
    padding-left: 0;
}

.assignment-table.table-hover > tbody > tr.wp-parent-row:hover > td,
.assignment-table.table-hover > tbody > tr.wp-child-row:hover > td {
    background: #eef2f6;
}

.contractor-tasks-scroll {
    overflow: auto;
}

.contractor-tasks-table {
    table-layout: fixed;
    width: 100%;
    margin-bottom: 0;
}

.contractor-tasks-table thead th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: #dde5f0;
    color: var(--navy);
    border-bottom: 1px solid #c5d0e0;
}

.contractor-tasks-table > :not(caption) > * > * {
    padding-top: 0.55rem;
    padding-bottom: 0.55rem;
    padding-left: 0.65rem;
    padding-right: 0.65rem;
    vertical-align: middle;
    text-align: left;
    border-bottom: 1px solid var(--border, #e2e8f0);
}

.contractor-tasks-table th.ct-col-num,
.contractor-tasks-table td.ct-col-num {
    width: 2.75rem;
    padding-left: 0.55rem;
    padding-right: 0.35rem;
}

.contractor-tasks-table.has-inline-nums .ct-col-num,
.contractor-tasks-table.has-inline-nums thead th.ct-col-num {
    display: none;
}

.contractor-tasks-table th.ct-col-item,
.contractor-tasks-table td.ct-col-item {
    width: 32%;
}

.contractor-tasks-table th.ct-col-zone,
.contractor-tasks-table td.ct-col-zone,
.contractor-tasks-table th.ct-col-subzone,
.contractor-tasks-table td.ct-col-subzone {
    width: 14%;
}

.contractor-tasks-table th.ct-col-pct,
.contractor-tasks-table td.ct-col-pct {
    width: 8%;
    text-align: right;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.contractor-tasks-table th.ct-col-photos,
.contractor-tasks-table td.ct-col-photos {
    width: 6%;
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.contractor-tasks-table .wp-item-cell {
    gap: 0.4rem;
}

.contractor-tasks-table .pms-tree-num {
    flex-shrink: 0;
    font-size: 0.75rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: var(--navy, #1e3a5f);
    min-width: 1.25rem;
    text-align: right;
    line-height: 1.75rem;
}

.contractor-tasks-table .pms-tree-num.is-child {
    font-weight: 500;
    color: var(--muted, #6b7280);
    font-size: 0.7rem;
}

.contractor-tasks-table .pms-tree {
    width: 100%;
}

.contractor-tasks-table .pms-tree-label {
    min-width: 0;
}

.contractor-tasks-table .pms-tree.is-depth-1 .tp-item-name {
    font-weight: 400;
}

.contractor-tasks-table .tp-item-name {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--navy, #1e3a5f);
}

.contractor-tasks-table .tp-item-name.is-package {
    font-weight: 600;
    color: #334155;
}

.contractor-tasks-table tr.wp-child-row.wp-child-collapsed {
    display: none !important;
}

.contractor-tasks-table tr.ct-task-row {
    cursor: pointer;
}

.contractor-tasks-table tr.ct-task-rollup {
    cursor: default;
}

.contractor-tasks-table tr.table-active > td {
    background: rgba(26, 54, 93, 0.08);
}

.contractor-tasks-table tr.wp-child-row.table-active > td {
    background: rgba(26, 54, 93, 0.1);
}

.contractor-tasks-table tr.wp-child-row > td {
    border-bottom-color: #d5dde8;
}

.contractor-task-parent {
    font-size: 0.8125rem;
    color: var(--muted);
    margin: 0;
}

/* Claim approval page fill */
body:has(.ca-page) {
    overflow: hidden;
    height: 100vh;
}

body:has(.ca-page) .app-shell {
    min-height: 0;
    height: 100vh;
    overflow: hidden;
}

body:has(.ca-page) .app-main {
    display: flex;
    flex-direction: column;
    height: calc(100vh - var(--header-h));
    max-height: calc(100vh - var(--header-h));
    overflow: hidden;
    box-sizing: border-box;
}

body:has(.ca-page) .app-main > .alert-flash,
body:has(.ca-page) .app-main > .alert {
    flex-shrink: 0;
}

.ca-page {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}

.ca-panel-fill {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}

.ca-panel-fill.d-none {
    display: none !important;
}

.ca-panel-card {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    margin-bottom: 0;
    overflow: hidden;
}

.ca-panel-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
}

.ca-panel-body .table {
    margin-bottom: 0;
}

.ca-empty {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem 1.25rem;
}

.ca-empty-state {
    text-align: center;
    max-width: 22rem;
}

.ca-empty-state > i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3.5rem;
    height: 3.5rem;
    margin-bottom: 1rem;
    border-radius: 999px;
    background: #e8eef5;
    color: var(--navy, #1a365d);
    font-size: 1.5rem;
}

.ca-empty-title {
    font-size: 1rem;
    font-weight: 600;
    color: var(--navy, #1a365d);
    margin-bottom: 0.35rem;
}

.ca-empty-text {
    font-size: 0.875rem;
    color: var(--muted, #6b7280);
    line-height: 1.45;
}

/* Claim approval review */
.claim-approval-info {
    line-height: 1;
    color: var(--muted);
    text-decoration: none;
    vertical-align: middle;
}

.claim-approval-info:hover,
.claim-approval-info:focus {
    color: var(--navy);
}

.claim-approval-info .bi {
    font-size: 1rem;
}

.claim-approval-table tbody td {
    vertical-align: middle;
}

.claim-history-table th.ca-col-certified,
.claim-history-table td.ca-col-certified {
    min-width: 8.5rem;
    padding-right: 1.5rem;
    white-space: nowrap;
}

.claim-history-table th.ca-col-date,
.claim-history-table td.ca-col-date {
    min-width: 7rem;
    padding-left: 0.75rem;
    white-space: nowrap;
}

.claim-approval-table tbody tr.claim-approval-row {
    cursor: pointer;
}

.claim-approval-table tbody tr.claim-approval-row:hover > td {
    background: rgba(26, 54, 93, 0.05);
}

.claim-approval-table tbody tr.claim-approval-row.is-disabled {
    cursor: not-allowed;
    opacity: 0.7;
}

.claim-approval-table tbody tr.claim-approval-row.is-disabled:hover > td {
    background: transparent;
}

.claim-review-modal .modal-header {
    background: #f8fafc;
    border-bottom: 1px solid var(--border);
}

.claim-review-summary {
    padding: 0.65rem 0.9rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
}

.claim-review-kv {
    display: grid;
    grid-template-columns: 8.5rem minmax(0, 1fr);
    column-gap: 0.85rem;
    align-items: start;
    padding: 0.4rem 0;
    border-bottom: 1px solid #e8edf3;
}

.claim-review-kv:last-child {
    border-bottom: 0;
}

.claim-review-k {
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--muted);
    line-height: 1.4;
    padding-top: 0.05rem;
}

.claim-review-v {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--text, #1e293b);
    text-align: right;
    line-height: 1.4;
    word-break: break-word;
}

.claim-review-field-row {
    display: grid;
    grid-template-columns: 8.5rem minmax(0, 1fr);
    column-gap: 0.85rem;
    align-items: center;
}

.claim-review-field-label {
    margin: 0;
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--muted);
    line-height: 1.4;
}

.claim-review-reject-controls {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.5rem;
    align-items: stretch;
}

.claim-review-reject-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    min-height: 0;
    padding-top: 0;
    padding-bottom: 0;
    white-space: nowrap;
}

/* Checklist */
.checklist-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.35rem 0;
    font-size: 0.875rem;
}

.checklist-item .icon-done { color: #15803d; }
.checklist-item .icon-pending { color: var(--muted); }

/* Auth */
.auth-page {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.5rem;
    background:
        radial-gradient(ellipse 80% 60% at 10% 20%, rgba(201, 162, 39, 0.14), transparent 55%),
        radial-gradient(ellipse 70% 50% at 90% 80%, rgba(35, 72, 118, 0.55), transparent 50%),
        linear-gradient(145deg, var(--navy) 0%, var(--navy-2) 55%, #0c1a2e 100%);
    position: relative;
    overflow: hidden;
}

.auth-page::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.03) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.03) 1px, transparent 1px);
    background-size: 48px 48px;
    mask-image: radial-gradient(ellipse 70% 70% at 50% 50%, #000 20%, transparent 75%);
    pointer-events: none;
}

.auth-shell {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
    width: 100%;
    max-width: 880px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 16px;
    overflow: hidden;
    box-shadow:
        0 24px 64px rgba(0, 0, 0, 0.35),
        0 0 0 1px rgba(201, 162, 39, 0.12);
    backdrop-filter: blur(8px);
}

.auth-brand-panel {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0.75rem;
    padding: 2.5rem 2.25rem;
    background:
        linear-gradient(160deg, rgba(26, 54, 93, 0.35) 0%, transparent 60%),
        linear-gradient(180deg, rgba(18, 39, 68, 0.9), rgba(12, 26, 46, 0.95));
    border-right: 1px solid rgba(255, 255, 255, 0.08);
    color: #fff;
}

.auth-brand-mark {
    width: 44px;
    height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--gold);
    color: var(--navy);
    font-weight: 700;
    font-size: 0.8rem;
    letter-spacing: 0.04em;
    border-radius: 8px;
    box-shadow: 0 4px 14px rgba(201, 162, 39, 0.35);
}

.auth-brand-mark--mobile {
    display: none;
    margin-bottom: 0.75rem;
}

.auth-brand-title {
    margin: 0.5rem 0 0;
    font-size: 1.55rem;
    font-weight: 650;
    line-height: 1.25;
    letter-spacing: -0.02em;
    color: #fff;
}

.auth-brand-copy {
    margin: 0;
    max-width: 28ch;
    color: rgba(255, 255, 255, 0.72);
    font-size: 0.95rem;
    line-height: 1.55;
}

.auth-card {
    background: #fff;
    padding: 2.25rem 2rem 1.75rem;
    width: 100%;
    display: flex;
    flex-direction: column;
}

.auth-card-head {
    margin-bottom: 1.35rem;
    padding-bottom: 1.1rem;
    border-bottom: 1px solid var(--border);
}

.auth-card h1 {
    font-size: 1.4rem;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: var(--navy);
    margin: 0 0 0.35rem;
}

.auth-card .subtitle {
    color: var(--muted);
    font-size: 0.9rem;
    line-height: 1.45;
    margin: 0;
}

.auth-form {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.auth-field {
    margin-bottom: 1rem;
}

.auth-field .form-label {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--text);
    margin-bottom: 0.35rem;
}

.auth-field .form-control {
    min-height: 2.65rem;
    border-radius: 8px;
    border-color: #d5dde8;
    padding: 0.55rem 0.85rem;
    font-size: 0.9375rem;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.auth-field .form-control:focus {
    border-color: var(--navy);
    box-shadow: 0 0 0 3px rgba(26, 54, 93, 0.15);
}

.auth-field .form-control::placeholder {
    color: #94a3b8;
}

.auth-field .form-text {
    margin-top: 0.3rem;
    font-size: 0.75rem;
}

.auth-alert {
    border-radius: 8px;
    font-size: 0.875rem;
    margin-bottom: 1rem;
}

.auth-submit {
    min-height: 2.75rem;
    margin-top: 0.35rem;
    border-radius: 8px;
    font-weight: 600;
    letter-spacing: 0.01em;
}

.auth-footer {
    text-align: center;
    margin: 1.35rem 0 0;
    padding-top: 1.1rem;
    border-top: 1px solid var(--border);
    font-size: 0.875rem;
    color: var(--muted);
}

.auth-footer a {
    font-weight: 600;
}

@media (max-width: 768px) {
    .auth-page {
        padding: 1rem;
        align-items: flex-start;
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    .auth-shell {
        grid-template-columns: 1fr;
        max-width: 440px;
    }

    .auth-brand-panel {
        display: none;
    }

    .auth-brand-mark--mobile {
        display: inline-flex;
    }

    .auth-card {
        padding: 1.75rem 1.35rem 1.5rem;
    }
}

.alert-flash {
    animation: fadeOut 3s forwards;
    overflow: hidden;
}

@keyframes fadeOut {
    0%, 70% { opacity: 1; }
    100% { opacity: 0; }
}

@media (max-width: 768px) {
    .app-sidebar { display: none; }
    .app-main {
        margin-left: 0;
        padding: 1rem 1rem 0;
        padding-bottom: calc(var(--admin-mobile-nav-h) + env(safe-area-inset-bottom, 0px) + 1rem);
    }
    .form-horizontal .row-field { flex-direction: column; }
    .form-horizontal label { width: 100%; }

    .admin-header-mobile {
        display: flex;
        align-items: center;
        gap: 0.65rem;
        padding: 0 0.75rem;
    }

    .admin-header-mobile-brand {
        flex-shrink: 0;
        color: #fff;
    }

    .admin-header-mobile-project {
        flex: 1 1 auto;
        min-width: 0;
        color: #fff;
        text-align: center;
        line-height: 1.25;
    }

    .admin-header-mobile-project-name {
        display: block;
        font-size: 0.875rem;
        font-weight: 600;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .admin-header-mobile-project-ref {
        display: block;
        font-size: 0.7rem;
        color: rgba(255, 255, 255, 0.65);
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .admin-header-mobile-actions {
        flex-shrink: 0;
        display: flex;
        align-items: center;
        gap: 0.35rem;
    }

    .admin-header-logout-btn {
        padding: 0.25rem 0.45rem;
        line-height: 1;
    }

    .admin-mobile-nav {
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 1040;
        display: flex;
        align-items: stretch;
        height: calc(var(--admin-mobile-nav-h) + env(safe-area-inset-bottom, 0px));
        padding-bottom: env(safe-area-inset-bottom, 0px);
        background: var(--navy);
        border-top: 3px solid var(--gold);
        box-shadow: 0 -4px 16px rgba(15, 23, 42, 0.12);
    }

    .admin-mobile-nav-item {
        flex: 1 1 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 0.15rem;
        min-height: 44px;
        padding: 0.35rem 0.2rem 0.25rem;
        border: 0;
        background: transparent;
        color: rgba(255, 255, 255, 0.72);
        font-size: 0.65rem;
        font-weight: 600;
        letter-spacing: 0.02em;
        text-decoration: none;
        position: relative;
        cursor: pointer;
    }

    .admin-mobile-nav-item i {
        font-size: 1.15rem;
        line-height: 1;
    }

    .admin-mobile-nav-item.is-active {
        color: var(--gold);
    }

    .admin-mobile-nav-item.is-disabled {
        opacity: 0.45;
        cursor: not-allowed;
    }

    .admin-mobile-nav-notify-dot {
        position: absolute;
        top: 0.35rem;
        right: calc(50% - 1.1rem);
        width: 7px;
        height: 7px;
        border-radius: 50%;
        background: #f59e0b;
        box-shadow: 0 0 0 2px var(--navy);
    }

    .admin-more-offcanvas {
        --bs-offcanvas-height: min(82vh, calc(100vh - var(--header-h) - 1rem));
        border-top: 3px solid var(--gold);
        border-radius: 1rem 1rem 0 0;
        z-index: 1050;
    }

    .admin-more-sheet-handle {
        flex-shrink: 0;
        width: 2.5rem;
        height: 0.25rem;
        margin: 0.5rem auto 0;
        border-radius: 999px;
        background: #cbd5e1;
    }

    .admin-more-sheet-header {
        padding-top: 0.35rem;
        padding-bottom: 0.65rem;
        border-bottom: 1px solid var(--border);
    }

    .admin-more-offcanvas .offcanvas-body,
    .admin-more-sheet-body {
        padding: 0.75rem 1rem calc(1rem + env(safe-area-inset-bottom, 0px));
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    .admin-more-offcanvas .sidebar-section-label {
        color: var(--muted);
        padding: 0.5rem 0 0.35rem;
        font-size: 0.65rem;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        font-weight: 600;
    }

    .admin-more-offcanvas .current-project-card {
        margin: 0;
        background: #f8fafc;
        border: 1px solid var(--border);
        color: var(--text);
    }

    .admin-more-offcanvas .current-project-card:hover {
        background: #f1f5f9;
        color: var(--text);
    }

    .admin-more-offcanvas .current-project-card .cp-ref {
        color: var(--muted);
    }

    .admin-more-nav {
        display: flex;
        flex-direction: column;
        gap: 0.15rem;
    }

    .admin-more-link {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.5rem;
        padding: 0.55rem 0.65rem;
        border-radius: 6px;
        color: var(--text);
        text-decoration: none;
        font-size: 0.875rem;
        font-weight: 500;
    }

    .admin-more-link:hover {
        background: #f1f5f9;
        color: var(--navy);
    }

    .admin-more-link.is-active {
        background: rgba(26, 54, 93, 0.08);
        color: var(--navy);
        font-weight: 600;
    }

    .admin-more-link.is-disabled {
        color: var(--muted);
        opacity: 0.55;
        padding: 0.55rem 0.65rem;
    }
}

@media (min-width: 769px) {
    .admin-mobile-nav,
    .admin-header-mobile,
    .admin-more-offcanvas {
        display: none !important;
    }
}

/* Progress report tabs */
.progress-tabs .nav-link {
    color: var(--muted);
    font-size: 0.8125rem;
    padding: 0.5rem 0.85rem;
    border: none;
    border-bottom: 2px solid transparent;
    border-radius: 0;
}

.progress-tabs .nav-link:hover {
    color: var(--navy);
    border-bottom-color: var(--border);
}

.progress-tabs .nav-link.active {
    color: var(--navy);
    font-weight: 600;
    background: transparent;
    border-bottom-color: var(--gold);
}

.dynamic-table input.form-control-sm {
    min-width: 5rem;
}

.dynamic-table td {
    vertical-align: middle;
}

#table-physical {
    width: 100%;
    table-layout: fixed;
}

#table-physical th:nth-child(1),
#table-physical td:nth-child(1),
#table-physical th:nth-child(2),
#table-physical td:nth-child(2),
#table-physical th:nth-child(3),
#table-physical td:nth-child(3) {
    width: calc((100% - 2.75rem) / 3);
}

#table-physical th:last-child,
#table-physical td:last-child {
    width: 2.75rem;
    text-align: center;
    vertical-align: middle;
}

#table-physical .form-control {
    width: 100%;
    min-width: 0;
}

#table-financial {
    width: 100%;
    table-layout: fixed;
}

#table-financial col.fin-col-date { width: 14%; }
#table-financial col.fin-col-value { width: 18%; }
#table-financial col.fin-col-cumul { width: 18%; }
#table-financial col.fin-col-action { width: 2.75rem; }

#table-financial th,
#table-financial td {
    vertical-align: middle;
}

#table-financial th:nth-child(2),
#table-financial th:nth-child(3),
#table-financial th:nth-child(4),
#table-financial th:nth-child(5) {
    white-space: nowrap;
}

#table-financial th:last-child,
#table-financial td:last-child {
    width: 2.75rem;
    text-align: center;
}

#table-financial .form-control {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
}

#table-financial .cumul-planned,
#table-financial .cumul-actual {
    white-space: nowrap;
    padding-inline: 0.5rem;
}

.chart-wrap {
    position: relative;
}

/* Contractors */
.assignment-accordion .accordion-button {
    font-weight: 600;
    color: var(--navy);
    background: #fff;
    box-shadow: none;
}

.assignment-accordion .accordion-button:not(.collapsed) {
    background: rgba(26, 54, 93, 0.04);
    color: var(--navy);
    box-shadow: none;
}

.assignment-accordion .accordion-button:focus {
    box-shadow: none;
    border-color: var(--border);
}

.assignment-accordion .accordion-item {
    border-color: var(--border);
}

.assignment-accordion .accordion-body {
    border-top: 1px solid var(--border);
}

.assignment-table .form-check-input {
    cursor: pointer;
}

.invite-code-row {
    display: flex;
    gap: 0.5rem;
    align-items: center;
    max-width: 480px;
}

.invite-code-row .form-control {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    letter-spacing: 0.04em;
}

.invite-code-badge {
    font-size: 0.85rem;
    background: #f3f5f8;
    padding: 0.15rem 0.45rem;
    border-radius: 4px;
    border: 1px solid var(--border, #e2e8f0);
}

/* Contractors list: keep Assigned items clear of Linked login */
.contractors-table th.contractors-col-assigned,
.contractors-table td.contractors-col-assigned {
    min-width: 8.5rem;
    padding-right: 1.25rem;
    white-space: nowrap;
}

.contractors-table th.contractors-col-linked,
.contractors-table td.contractors-col-linked {
    min-width: 9rem;
    padding-left: 1rem;
    white-space: nowrap;
}

.form-text-muted {
    font-size: 0.8rem;
    color: var(--muted);
    margin-top: 0.25rem;
}

.row-field {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    margin-bottom: 1rem;
}

.row-field > label {
    width: 140px;
    flex-shrink: 0;
    padding-top: 0.4rem;
    font-weight: 500;
}

.row-field .field-wrap {
    flex: 1;
    max-width: 480px;
}

/* Daily record */
#dailyRecordModal.modal.show {
    display: flex !important;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

#dailyRecordModal .daily-record-dialog {
    width: 80vw;
    max-width: 80vw;
    height: 80vh;
    max-height: calc(100vh - 2rem);
    margin: 0;
}

#dailyRecordModal .daily-record-modal-content {
    height: 80vh;
    max-height: 80vh;
    display: flex;
    flex-direction: column;
}

#dailyRecordModal .daily-record-form {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
}

#dailyRecordModal .modal-header,
#dailyRecordModal .modal-footer {
    flex-shrink: 0;
}

#dailyRecordModal .daily-record-modal-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding: 1rem 1.25rem;
}

#dailyRecordModal .daily-record-date-field {
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--border, #d7dee8);
}

#dailyRecordModal .daily-record-section {
    margin-bottom: 1rem;
    padding: 0.9rem 1rem 1rem;
    border: 1px solid var(--border, #d7dee8);
    border-radius: 0.4rem;
    background: #f8fafc;
}

#dailyRecordModal .daily-record-section-title {
    margin: 0 0 0.85rem;
    padding-bottom: 0.55rem;
    border-bottom: 1px solid var(--border, #d7dee8);
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--navy, #1b2a4a);
}

#dailyRecordModal .daily-record-form .row-field {
    align-items: flex-start;
}

#dailyRecordModal .daily-record-form .row-field > label {
    width: 9.5rem;
    padding-top: 0.4rem;
}

#dailyRecordModal .daily-record-form .field-wrap {
    max-width: none;
}

#dailyRecordModal .daily-dynamic-block {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
}

#dailyRecordModal .daily-dynamic-scroll {
    height: 11.5rem;
    max-height: 11.5rem;
    overflow: auto;
    border: 1px solid var(--border);
    border-radius: 0.35rem;
}

#dailyRecordModal .daily-dynamic-scroll .table {
    margin-bottom: 0;
}

#dailyRecordModal .btn-add-row {
    flex-shrink: 0;
}

@media (max-width: 767.98px) {
    #dailyRecordModal .daily-record-dialog,
    #dailyRecordModal .daily-record-modal-content {
        width: calc(100vw - 1.5rem);
        max-width: calc(100vw - 1.5rem);
        height: auto;
        max-height: calc(100vh - 1.5rem);
    }

    #dailyRecordModal .daily-dynamic-scroll {
        height: 10rem;
        max-height: 10rem;
    }
}

#table-daily-records {
    table-layout: fixed;
    width: 100%;
}

#table-daily-records > :not(caption) > * > * {
    padding-top: 0.55rem;
    padding-bottom: 0.55rem;
    padding-left: 0.85rem;
    padding-right: 0.85rem;
    vertical-align: middle;
}

#table-daily-records tbody tr[role="button"] {
    cursor: pointer;
}

#table-daily-records tbody tr[role="button"]:hover > td {
    background: #f4f7fb;
}

#table-daily-records th.daily-col-date,
#table-daily-records td.daily-col-date {
    width: 18%;
    white-space: nowrap;
    text-align: left;
}

#table-daily-records th.daily-col-weather,
#table-daily-records td.daily-col-weather {
    width: 19%;
    text-align: left;
}

#table-daily-records th.daily-col-manpower,
#table-daily-records td.daily-col-manpower {
    width: 10%;
    white-space: nowrap;
    text-align: right;
    font-variant-numeric: tabular-nums;
}

#table-daily-records th.daily-col-machinery,
#table-daily-records td.daily-col-machinery {
    width: 10%;
    white-space: nowrap;
    text-align: right;
    font-variant-numeric: tabular-nums;
    padding-right: 1.5rem;
}

#table-daily-records th.daily-col-remarks,
#table-daily-records td.daily-col-remarks {
    width: 43%;
    text-align: left;
    padding-left: 1rem;
}

#table-daily-records td.daily-col-remarks .daily-remarks-text {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 992px) {
    #table-daily-records > :not(caption) > * > * {
        padding-left: 0.65rem;
        padding-right: 0.65rem;
    }

    #table-daily-records th.daily-col-date,
    #table-daily-records td.daily-col-date {
        width: 16%;
    }

    #table-daily-records th.daily-col-weather,
    #table-daily-records td.daily-col-weather {
        width: 18%;
    }

    #table-daily-records th.daily-col-manpower,
    #table-daily-records td.daily-col-manpower,
    #table-daily-records th.daily-col-machinery,
    #table-daily-records td.daily-col-machinery {
        width: 11%;
    }

    #table-daily-records th.daily-col-machinery,
    #table-daily-records td.daily-col-machinery {
        padding-right: 1.15rem;
    }

    #table-daily-records th.daily-col-remarks,
    #table-daily-records td.daily-col-remarks {
        width: 44%;
        padding-left: 0.85rem;
    }
}

.kpi-card.kpi-text .kpi-value {
    text-align: left;
}

/* RFI */
.rfi-preview-sticky {
    position: sticky;
    top: calc(var(--header-h) + 1rem);
}

.rfi-letter {
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 0.5rem;
    overflow: hidden;
    font-size: 0.9375rem;
    line-height: 1.65;
    color: var(--text);
    box-shadow: 0 1px 2px rgba(26, 54, 93, 0.04);
}

.rfi-letter-mail-head {
    padding: 1.15rem 1.5rem 1.05rem;
    border-bottom: 1px solid var(--border);
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
    border-left: 3px solid var(--navy);
}

.rfi-letter-mail-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.55rem 1.25rem;
}

.rfi-letter-mail-row {
    display: grid;
    grid-template-columns: 4.75rem minmax(0, 1fr);
    gap: 0.65rem;
    align-items: start;
}

.rfi-letter-mail-label {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--muted);
    padding-top: 0.05rem;
}

.rfi-letter-mail-value {
    color: var(--text);
    word-break: break-word;
    min-width: 0;
}

.rfi-letter-mail-email-inline {
    color: var(--muted);
    font-size: 0.8125rem;
    font-weight: 400;
    margin-left: 0.35rem;
    word-break: break-all;
}

.rfi-letter-mail-subject .rfi-letter-mail-value {
    font-weight: 650;
    color: var(--navy);
    font-size: 1rem;
    line-height: 1.4;
}

.rfi-letter-body {
    padding: 1.35rem 1.5rem 1.35rem;
    color: var(--text);
}

.rfi-letter-salutation {
    margin: 0 0 1rem;
    font-weight: 500;
}

.rfi-letter-query {
    min-height: 4.5rem;
    white-space: pre-wrap;
}

.rfi-letter-remarks {
    margin-top: 1.25rem;
    padding: 0.75rem 0 0;
    border-top: 1px dashed #e2e8f0;
}

.rfi-letter-remarks-label {
    font-size: 0.75rem;
    font-weight: 650;
    color: var(--muted);
    margin-bottom: 0.3rem;
}

.rfi-letter-remarks-text {
    color: var(--text);
    font-size: 0.875rem;
    white-space: pre-wrap;
}

.rfi-letter-closing {
    margin-top: 2rem;
}

.rfi-letter-farewell {
    margin: 0 0 1.1rem;
}

.rfi-letter-signature {
    padding-top: 0.15rem;
}

.rfi-letter-sign-name {
    font-weight: 650;
    color: var(--navy);
    font-size: 0.975rem;
}

.rfi-letter-sign-role {
    font-size: 0.8125rem;
    color: var(--muted);
    margin-top: 0.15rem;
}

.rfi-letter-sign-email {
    margin-top: 0.15rem;
    font-size: 0.8125rem;
    color: var(--muted);
}

.rfi-letter-mail-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem 0.5rem;
    padding: 0.7rem 1.5rem;
    border-top: 1px solid var(--border);
    color: #94a3b8;
    font-size: 0.75rem;
    line-height: 1.4;
}

.rfi-letter-mail-meta-sep {
    opacity: 0.7;
}

@media (max-width: 575.98px) {
    .rfi-letter-mail-grid {
        grid-template-columns: 1fr;
    }

    .rfi-letter-mail-row {
        grid-template-columns: 1fr;
        gap: 0.15rem;
    }

    .rfi-letter-mail-head {
        padding: 1rem 1.15rem;
    }

    .rfi-letter-body {
        padding: 1.15rem;
    }
}

/* Contractor portal */
.contractor-body {
    height: 100vh;
    overflow: hidden;
}

html:has(.contractor-body) {
    height: 100%;
    overflow: hidden;
}

.contractor-main {
    width: 100%;
    max-width: none;
    margin: 0;
    height: 100vh;
    padding: calc(var(--header-h) + 1rem) 1.25rem 1rem;
    display: flex;
    flex-direction: column;
    overflow-x: hidden;
    overflow-y: auto;
    box-sizing: border-box;
}

.contractor-nav {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    margin: 0;
}

.contractor-nav-link {
    color: rgba(255, 255, 255, 0.78);
    text-decoration: none;
    font-size: 0.875rem;
    font-weight: 500;
    padding: 0.35rem 0.7rem;
    border-radius: 0.35rem;
    white-space: nowrap;
}

.contractor-nav-link:hover {
    color: #fff;
    background: rgba(255, 255, 255, 0.08);
}

.contractor-nav-link.active {
    color: #fff;
    background: rgba(255, 255, 255, 0.14);
}

@media (max-width: 575.98px) {
    .contractor-nav {
        display: none !important;
    }
}

.contractor-nav-mobile {
    position: sticky;
    top: var(--header-h);
    z-index: 20;
    background: var(--navy, #1b2a4a);
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
    padding: 0.35rem 0.75rem;
    gap: 0.25rem;
    justify-content: center;
}

body.contractor-body .app-header .app-brand,
body.contractor-body .app-header .app-header-actions {
    position: relative;
    z-index: 1;
}

body.contractor-body .contractor-main {
    padding-top: calc(var(--header-h) + 1rem);
}

body.contractor-body:has(.contractor-rfi-page) .contractor-main {
    overflow: hidden;
}

@media (max-width: 575.98px) {
    body.contractor-body .contractor-main {
        padding-top: 1rem;
    }
}

.contractor-page {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.contractor-rfi-page {
    min-height: 0;
}

.contractor-rfi-header {
    flex-shrink: 0;
}

.contractor-rfi-header .page-title {
    line-height: 1.2;
}

.contractor-rfi-header .rfi-title-status {
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    padding: 0.28em 0.55em;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    align-self: center;
}

.contractor-rfi-header-actions {
    align-self: center;
}

.contractor-rfi-panel {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.contractor-rfi-scroll {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
}

.contractor-rfi-scroll .table-pms thead th {
    position: sticky;
    top: 0;
    z-index: 1;
}

#table-contractor-rfis > :not(caption) > * > * {
    padding-top: 0.85rem;
    padding-bottom: 0.85rem;
    padding-left: 0.9rem;
    padding-right: 0.9rem;
    vertical-align: middle;
}

#table-contractor-rfis tbody tr[role="button"] {
    cursor: pointer;
}

#table-contractor-rfis tbody tr[role="button"]:hover > td {
    background: #f4f7fb;
}

#table-contractor-rfis th.rfi-col-num,
#table-contractor-rfis td.rfi-col-num {
    width: 3.25rem;
    white-space: nowrap;
}

#table-contractor-rfis th.rfi-col-date,
#table-contractor-rfis td.rfi-col-date {
    width: 8.5rem;
    white-space: nowrap;
}

#table-contractor-rfis th.rfi-col-no,
#table-contractor-rfis td.rfi-col-no {
    width: 7rem;
    white-space: nowrap;
}

#table-contractor-rfis th.rfi-col-status,
#table-contractor-rfis td.rfi-col-status {
    width: 7.5rem;
    white-space: nowrap;
}

.contractor-rfi-detail .rfi-view-pane {
    max-width: 52rem;
}

.contractor-rfi-detail-panel {
    width: 100%;
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.contractor-rfi-detail-panel .contractor-rfi-scroll {
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.contractor-rfi-detail-panel .rfi-view-pane {
    max-width: none;
    width: 100%;
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.contractor-rfi-detail-panel .rfi-view-pane.d-none {
    display: none !important;
}

.contractor-rfi-detail-panel .rfi-detail-form {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    height: 100%;
}

.contractor-rfi-detail-panel .rfi-detail-form-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding: 1.25rem 1.5rem;
}

.contractor-rfi-detail-panel .rfi-detail-form-footer {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 0.85rem 1.5rem;
    border-top: 1px solid var(--border, #d7dee8);
    background: #fff;
}

.contractor-rfi-detail-panel .rfi-detail-form-footer-secondary {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.contractor-rfi-detail-panel .rfi-detail-form-footer-secondary .btn {
    flex: 1 1 0;
}

.contractor-rfi-detail-panel .rfi-detail-preview-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
    padding: 0;
    display: flex;
    flex-direction: column;
}

.contractor-rfi-detail-panel .rfi-letter {
    flex: 1 1 auto;
    min-height: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.contractor-rfi-detail-panel .rfi-letter-mail-head,
.contractor-rfi-detail-panel .rfi-letter-mail-meta {
    flex-shrink: 0;
}

.contractor-rfi-detail-panel .rfi-letter-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.contractor-rfi-detail-panel .rfi-letter-query {
    min-height: 0;
}

.contractor-rfi-detail-panel .form-horizontal .row-field,
.contractor-rfi-detail-panel .form-horizontal .field-wrap {
    max-width: none;
}

.contractor-rfi-header .rfi-back-btn {
    height: 2rem;
    padding: 0 0.75rem;
    display: inline-flex;
    align-items: center;
    font-size: 0.8125rem;
    line-height: 1;
    box-sizing: border-box;
}

.contractor-workspace {
    flex: 1 1 auto;
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(240px, 280px) minmax(0, 1fr);
    gap: 1rem;
    align-items: stretch;
    overflow: hidden;
}

.contractor-project-pane,
.contractor-detail-pane {
    min-height: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.contractor-pane-header {
    flex: 0 0 auto;
    padding: 0.85rem 1rem;
    border-bottom: 1px solid var(--border);
    background: #fff;
}

.contractor-project-search-header {
    padding: 0.75rem;
}

.contractor-project-search {
    position: relative;
}

.contractor-project-search > i {
    position: absolute;
    left: 0.7rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--muted);
    font-size: 0.85rem;
    pointer-events: none;
}

.contractor-project-search .form-control {
    padding-left: 2rem;
    border-radius: 8px;
    background: #f8fafc;
}

.contractor-project-search .form-control:focus {
    background: #fff;
    border-color: rgba(26, 54, 93, 0.35);
    box-shadow: 0 0 0 0.2rem rgba(26, 54, 93, 0.1);
}

.contractor-pane-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
}

.contractor-project-list {
    display: flex;
    flex-direction: column;
}

.contractor-project-item {
    display: block;
    padding: 0.85rem 1rem;
    border-bottom: 1px solid var(--border);
    color: var(--text);
    text-decoration: none;
    transition: background 0.15s ease, border-color 0.15s ease;
}

.contractor-project-item:hover {
    background: #f8fafc;
    color: var(--text);
}

.contractor-project-item.is-active {
    background: #e4ebf5;
    border-left: 3px solid var(--navy);
    padding-left: calc(1rem - 3px);
}

.contractor-project-item.is-active:hover {
    background: #dce5f2;
}

.contractor-project-item.is-active .contractor-project-name {
    color: var(--navy);
    font-weight: 600;
}

.contractor-project-item.is-active .contractor-project-meta {
    color: #64748b;
}

.contractor-project-name {
    font-size: 0.9375rem;
    line-height: 1.3;
    margin-bottom: 0.15rem;
}

.contractor-project-meta {
    font-size: 0.75rem;
    color: var(--muted);
}

.contractor-task-detail {
    display: flex;
    flex-direction: column;
    min-height: 0;
    height: 100%;
    overflow: hidden;
}

.contractor-task-header {
    flex: 0 0 auto;
    border-bottom: 1px solid var(--border);
    background: #fff;
}

.contractor-task-header-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.65rem 1rem;
}

.contractor-task-header-left {
    min-width: 0;
    flex: 1 1 auto;
    padding-bottom: 0;
}

.contractor-task-header-actions {
    display: flex;
    align-items: center;
    align-self: center;
    gap: 0.5rem;
    flex: 0 0 auto;
}

.contractor-task-back {
    display: inline-flex;
    align-items: center;
    gap: 0.15rem;
    flex-shrink: 0;
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--muted);
    text-decoration: none;
    padding: 0.3rem 0.55rem;
    border-radius: 999px;
    line-height: 1.2;
    white-space: nowrap;
}

.contractor-task-back i {
    font-size: 0.75rem;
    line-height: 1;
}

.contractor-task-back:hover {
    color: var(--navy);
    background: rgba(26, 54, 93, 0.06);
}

.contractor-task-title {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.25;
    color: var(--navy);
}

.contractor-task-meta-row {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.35rem 1rem;
    margin-top: 0.15rem;
}

.contractor-task-sub {
    margin: 0;
    font-size: 0.75rem;
    color: var(--muted);
    line-height: 1.3;
}

.contractor-task-kpi {
    display: inline-flex;
    align-items: baseline;
    gap: 0.4rem;
    flex-shrink: 0;
}

.contractor-task-kpi-label {
    font-size: 0.6875rem;
    color: var(--muted);
    line-height: 1.2;
}

.contractor-task-kpi-value {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--navy);
    line-height: 1.2;
}

.contractor-task-tabs {
    flex: 0 0 auto;
    display: inline-flex;
    flex-wrap: nowrap;
    align-items: center;
    align-self: center;
    margin: 0;
    padding: 0.2rem;
    gap: 0.15rem;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: #f1f5f9;
    list-style: none;
}

.contractor-task-tabs .nav-item {
    margin: 0;
}

.contractor-task-tabs .nav-link {
    border: 0;
    border-radius: 999px;
    color: var(--muted);
    font-size: 0.8125rem;
    font-weight: 500;
    padding: 0.35rem 0.9rem;
    white-space: nowrap;
    line-height: 1.2;
    background: transparent;
}

.contractor-task-tabs .nav-link:hover {
    color: var(--navy);
    background: rgba(255, 255, 255, 0.65);
    border-color: transparent;
}

.contractor-task-tabs .nav-link.active {
    color: #fff;
    background: var(--navy);
    border-color: transparent;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.12);
}

.contractor-task-tabs .badge {
    font-weight: 500;
    font-size: 0.6875rem;
    vertical-align: middle;
}

.contractor-task-tabs .nav-link.active .badge {
    background: rgba(255, 255, 255, 0.2) !important;
    color: #fff;
}

.contractor-task-tabs-content {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    padding: 1.25rem 1.5rem 1.5rem;
}

.contractor-task-body {
    display: flex;
    flex-direction: column;
}

.contractor-task-tabs-content > .tab-pane.active {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.contractor-subbadges {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem;
}

.contractor-subbadge {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    margin: 0;
    padding: 0.3rem 0.75rem;
    border: 1px solid #d0d7e2;
    border-radius: 999px;
    background: #f1f5f9;
    color: #5a6a7e;
    font-size: 0.8125rem;
    font-weight: 500;
    line-height: 1.2;
    cursor: pointer;
}

.contractor-subbadge:hover {
    color: var(--navy);
    border-color: #c5ceda;
    background: #e8edf4;
}

.contractor-subbadge.active {
    color: #fff;
    background: var(--navy);
    border-color: var(--navy);
    font-weight: 600;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.12);
}

.contractor-subbadge-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.15rem;
    height: 1.15rem;
    padding: 0 0.35rem;
    border-radius: 999px;
    font-size: 0.65rem;
    font-weight: 650;
    line-height: 1;
    background: #e2e8f0;
    color: #5a6a7e;
}

.contractor-subbadge.active .contractor-subbadge-count {
    background: rgba(255, 255, 255, 0.22);
    color: #fff;
}

.contractor-claim-panel {
    width: 100%;
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.contractor-photo-panel {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.contractor-photo-panel > .tab-content,
.contractor-claim-panel > .tab-content {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.contractor-photo-panel > .tab-content > .tab-pane.active,
.contractor-claim-panel > .tab-content > .tab-pane.active {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.contractor-claim-history-table {
    width: 100%;
    table-layout: fixed;
    border-collapse: separate;
    border-spacing: 0;
}

.contractor-claim-history-table th,
.contractor-claim-history-table td {
    vertical-align: middle;
    padding: 0.7rem 1.1rem;
}

.contractor-claim-history-table th:first-child,
.contractor-claim-history-table td:first-child {
    padding-left: 1rem;
}

.contractor-claim-history-table th:last-child,
.contractor-claim-history-table td:last-child {
    padding-right: 1rem;
}

.contractor-claim-history-table th.cch-date,
.contractor-claim-history-table td.cch-date {
    width: 15%;
    white-space: nowrap;
}

.contractor-claim-history-table th.cch-period,
.contractor-claim-history-table td.cch-period {
    width: 24%;
}

.contractor-claim-history-table th.cch-measure,
.contractor-claim-history-table td.cch-measure {
    width: 13%;
}

.contractor-claim-history-table th.cch-amount,
.contractor-claim-history-table td.cch-amount {
    width: 16%;
}

.contractor-claim-history-table th.cch-status,
.contractor-claim-history-table td.cch-status {
    width: 14%;
}

.contractor-claim-history-table th.cch-actions-h,
.contractor-claim-history-table td.cch-actions {
    width: 12%;
    text-align: right;
    white-space: nowrap;
}

.contractor-claim-history-table th.num,
.contractor-claim-history-table td.num {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.contractor-claim-history-table .cch-actions .btn {
    min-width: 4.25rem;
}

.contractor-photos-history,
.contractor-claim-history {
    width: 100%;
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.contractor-history-empty {
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 12rem;
    padding: 2rem 1.25rem;
}

.contractor-empty-state {
    text-align: center;
    max-width: 22rem;
}

.contractor-empty-state > i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3.5rem;
    height: 3.5rem;
    margin-bottom: 1rem;
    border-radius: 999px;
    background: #e8eef5;
    color: var(--navy);
    font-size: 1.5rem;
}

.contractor-empty-title {
    font-size: 1rem;
    font-weight: 600;
    color: var(--navy);
    margin-bottom: 0.35rem;
}

.contractor-empty-text {
    font-size: 0.875rem;
    color: var(--muted);
    line-height: 1.45;
}

.contractor-photo-table {
    width: 100%;
    table-layout: fixed;
}

.contractor-photo-table th,
.contractor-photo-table td {
    vertical-align: middle;
    padding: 0.7rem 1.1rem;
}

.contractor-photo-table th:first-child,
.contractor-photo-table td:first-child {
    padding-left: 1rem;
}

.contractor-photo-table th:last-child,
.contractor-photo-table td:last-child {
    padding-right: 1rem;
}

.contractor-photo-table th.cph-preview,
.contractor-photo-table td.cph-preview {
    width: 12%;
}

.contractor-photo-table th.cph-caption,
.contractor-photo-table td.cph-caption {
    width: 28%;
}

.contractor-photo-table th.cph-date,
.contractor-photo-table td.cph-date {
    width: 16%;
    white-space: nowrap;
}

.contractor-photo-table th.cph-location,
.contractor-photo-table td.cph-location {
    width: 20%;
}

.contractor-photo-table th.cph-actions,
.contractor-photo-table td.cph-actions {
    width: 24%;
    text-align: right;
    white-space: nowrap;
}

.contractor-photo-table .cph-actions .btn {
    min-width: 4.25rem;
}

.contractor-photo-table .cph-actions form {
    margin-left: 0.35rem;
}

.contractor-photo-table .cph-caption .text-truncate,
.contractor-photo-table .cph-location .text-truncate {
    max-width: 100%;
}

.contractor-section-title {
    margin: 0 0 1.25rem;
    padding: 0 0 0.85rem;
    border-bottom: 1px solid var(--border);
}

.contractor-section-heading {
    margin: 0;
    font-size: 0.9375rem;
    font-weight: 600;
    line-height: 1.3;
    color: var(--text);
}

.contractor-upload-form.form-horizontal.form-full .row-field {
    max-width: none;
}

.contractor-upload-form.form-horizontal label {
    width: 11rem;
}

.contractor-upload-form .btn.w-100 {
    margin-top: 0.5rem;
}

.contractor-photo-table .contractor-photo-thumb {
    display: block;
    width: 3.25rem;
    height: 2.5rem;
    padding: 0;
    border: 1px solid var(--border);
    border-radius: 4px;
    overflow: hidden;
    background: #e8edf3;
    cursor: zoom-in;
}

.contractor-photo-table .contractor-photo-thumb img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.photo-lightbox-modal.modal.show {
    display: flex !important;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

.photo-lightbox-modal .modal-dialog {
    max-width: min(1100px, calc(100vw - 2rem));
    width: 100%;
    margin: 0 auto;
}

.photo-lightbox-content {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 12px 32px rgba(15, 23, 42, 0.12);
}

.photo-lightbox-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.75rem 1rem;
    background: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
}

.photo-lightbox-title {
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--navy, #1a365d);
    line-height: 1.3;
}

.photo-lightbox-toolbar-actions {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    flex-shrink: 0;
}

.photo-lightbox-toolbar-actions .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    padding: 0;
    border-radius: 6px;
}

.photo-lightbox-stage {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 280px;
    max-height: min(72vh, 780px);
    padding: 0.85rem 1rem;
    background: #f1f5f9;
}

.photo-lightbox-img {
    display: block;
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: min(68vh, 740px);
    object-fit: contain;
    border-radius: 6px;
    box-shadow: 0 4px 16px rgba(15, 23, 42, 0.1);
}

.photo-lightbox-footer {
    padding: 0.75rem 1rem 0.9rem;
    border-top: 1px solid #e2e8f0;
    background: #f8fafc;
}

.photo-lightbox-caption {
    color: #1e293b;
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.35;
}

.photo-lightbox-meta {
    margin-top: 0.2rem;
    color: #64748b;
    font-size: 0.75rem;
    line-height: 1.3;
}

@media (max-width: 767.98px) {
    .contractor-task-header-row {
        flex-direction: column;
        align-items: stretch;
        gap: 0.5rem;
        padding: 0.55rem 1rem;
    }

    .contractor-task-header-left {
        padding-bottom: 0;
    }

    .contractor-task-header-actions {
        width: 100%;
        justify-content: space-between;
    }

    .contractor-task-tabs {
        align-self: stretch;
        flex: 1 1 auto;
        width: auto;
        margin-bottom: 0;
    }

    .contractor-task-tabs .nav-item {
        flex: 1 1 0;
    }

    .contractor-task-tabs .nav-link {
        width: 100%;
        text-align: center;
    }
}

@media (max-width: 991.98px) {
    .contractor-body {
        height: auto;
        overflow: auto;
    }

    .contractor-main {
        height: auto;
        overflow: visible;
        padding-bottom: 1.5rem;
    }

    .contractor-workspace {
        grid-template-columns: 1fr;
        overflow: visible;
        min-height: 0;
    }

    .contractor-project-pane,
    .contractor-detail-pane {
        height: auto;
        max-height: none;
        overflow: visible;
    }

    .contractor-pane-body {
        overflow: visible;
    }

    .contractor-project-list {
        flex-direction: row;
        overflow-x: auto;
    }

    .contractor-project-item {
        min-width: 180px;
        border-bottom: 0;
        border-right: 1px solid var(--border);
    }

    .contractor-project-item.is-active {
        border-left: 0;
        border-bottom: 3px solid var(--navy);
        padding-left: 1rem;
        padding-bottom: calc(0.85rem - 3px);
    }

    .contractor-task-detail {
        height: auto;
        overflow: visible;
    }
}

.photo-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 1rem;
}

.photo-card {
    margin: 0;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 8px;
    overflow: hidden;
}

.photo-card img {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    background: #e8edf3;
}

.photo-card figcaption {
    padding: 0.5rem 0.65rem 0.65rem;
}

.photo-grid-admin {
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
}

.photo-card a {
    display: block;
    cursor: zoom-in;
}

/* Admin / report photo plates */
.photo-plate-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.25rem;
}

.photo-plate {
    margin: 0;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 6px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.photo-plate-label {
    padding: 0.45rem 0.75rem;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--navy);
    background: #f3f5f8;
    border-bottom: 1px solid var(--border);
}

.photo-plate-media {
    background: #e8edf3;
    aspect-ratio: 4 / 3;
    overflow: hidden;
}

.photo-plate-media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.photo-plate-meta {
    padding: 0.75rem 0.85rem 0.85rem;
    border-top: 1px solid var(--border);
}

.photo-plate-dl {
    display: grid;
    gap: 0.4rem;
}

.photo-plate-dl > div {
    display: grid;
    grid-template-columns: 5.5rem 1fr;
    gap: 0.5rem;
    align-items: start;
    font-size: 0.8125rem;
    line-height: 1.35;
}

.photo-plate-dl dt {
    margin: 0;
    color: var(--muted);
    font-weight: 500;
}

.photo-plate-dl dd {
    margin: 0;
    color: var(--text);
    word-break: break-word;
}

@media (max-width: 768px) {
    .photo-plate-grid {
        grid-template-columns: 1fr;
    }
}


/* Work Attachment */
.wa-zone-panel {
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.wa-table-scroll {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
}

/* Empty attachments: fill panel body and center icon/copy under sticky header */
.wa-table-scroll:has(.wa-empty-row) {
    position: relative;
    overflow: hidden;
}

.wa-attach-table:has(.wa-empty-row) {
    height: 100%;
    margin-bottom: 0;
}

.wa-empty-row > td {
    padding: 0 !important;
    border-bottom: 0;
    height: 100%;
    vertical-align: middle;
}

.wa-empty-state {
    position: absolute;
    left: 0;
    right: 0;
    top: 2.75rem; /* below sticky thead */
    bottom: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 2rem 1.5rem;
    box-sizing: border-box;
    pointer-events: none;
}

.wa-attach-table tbody td {
    vertical-align: middle;
}

.wa-attach-table tr.wa-parent-row > td {
    background: #fff;
}

.wa-attach-table tr.wa-child-row > td {
    background: #f4f6f8;
    color: #4b5563;
}

.wa-attach-table tbody tr.wa-attach-row {
    cursor: pointer;
}

.wa-attach-table tbody tr.wa-attach-row:hover > td {
    background: #eef2f6;
}

.wa-attach-table tr.wa-child-row.wa-child-collapsed,
.wa-attach-table tr.wa-list-hide,
.wa-attach-table tr.wa-page-hide {
    display: none !important;
}

.wa-attach-table .wp-item-cell {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    min-width: 0;
}

.wa-attach-table .wp-item-cell.is-child:not(.pms-tree) {
    padding-left: 0.35rem;
}

.wa-attach-table .tp-item-name {
    min-width: 0;
}

.wa-attach-table tr.wa-zone-header td {
    background: #e8eef5;
    color: var(--navy, #1a365d);
    font-weight: 650;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding-top: 0.5rem;
    padding-bottom: 0.45rem;
    border-top: 0;
    border-bottom: 1px solid #d5dde8;
    text-align: left;
}

.wa-attach-table.is-by-zone tr.wa-zone-header td,
.wa-attach-table.is-by-zone tr.wa-subzone-header td {
    border-bottom: none;
}

.wa-attach-table tr.wa-subzone-header td {
    background: transparent;
    color: #475569;
    font-weight: 600;
    font-size: 0.8125rem;
    letter-spacing: 0.01em;
    padding-top: 0.55rem;
    padding-bottom: 0.35rem;
    border-top: 0;
    border-bottom: 1px solid #e8edf4;
    text-align: left;
}

.wa-col-num {
    width: 3rem;
    min-width: 3rem;
    padding-left: 0.65rem;
}

.wa-col-item {
    min-width: 14rem;
}

.wa-col-thumb {
    width: 3.75rem;
    min-width: 3.75rem;
    white-space: nowrap;
}

.wa-col-caption {
    min-width: 8rem;
}

.wa-col-date {
    width: 7.5rem;
    white-space: nowrap;
}

.wa-col-contractor {
    min-width: 8rem;
}

.wa-attach-table th.wa-col-thumb,
.wa-attach-table td.wa-col-thumb,
.wa-attach-table th.wa-col-caption,
.wa-attach-table td.wa-col-caption,
.wa-attach-table th.wa-col-date,
.wa-attach-table td.wa-col-date,
.wa-attach-table th.wa-col-contractor,
.wa-attach-table td.wa-col-contractor {
    padding-left: 0.65rem !important;
    padding-right: 0.65rem !important;
}

.wa-count {
    font-size: 0.75rem;
    color: var(--muted, #6b7280);
    white-space: nowrap;
}

.wa-thumb {
    display: block;
    width: 2.25rem;
    height: 1.7rem;
    border: 1px solid var(--border, #e2e8f0);
    border-radius: 0.25rem;
    overflow: hidden;
    background: #e8edf3;
}

.wa-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.wa-empty-state > i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3.5rem;
    height: 3.5rem;
    margin-bottom: 1rem;
    border-radius: 999px;
    background: #e8eef5;
    color: var(--navy, #1a365d);
    font-size: 1.5rem;
}

.wa-empty-title {
    font-size: 1rem;
    font-weight: 600;
    color: var(--navy, #1a365d);
    margin-bottom: 0.35rem;
}

.wa-empty-text {
    font-size: 0.875rem;
    color: var(--muted, #6b7280);
    line-height: 1.45;
    max-width: 24rem;
    margin-left: auto;
    margin-right: auto;
}