.sys-timesheets-module { min-height: calc(100vh - 50px); font-size: 12px; line-height: 1.35; }
#sysTimesheetsApp.sys-timesheets-module { min-height: 0; }
#sysTimesheetsApp.sys-timesheets-module { min-height: 0; height: auto; overflow: visible; }
#sysTimesheetsApp .sysdash-shell { height: auto; min-height: 0; overflow: visible; }
#sysTimesheetsApp .sysdash-widget { height: auto; min-height: 0; overflow: visible; flex: 0 0 auto; }
#sysTimesheetsApp .sysdash-widget-body { min-height: 0; height: auto; overflow: visible; flex: 0 0 auto; }
#sysTimesheetsApp .sysdash-canvas,
#sysTimesheetsApp .sysdash-main,
#sysTimesheetsApp .sys-timesheet-panel,
#sysTimesheetsApp [data-timesheet-panel] { overflow: visible; max-height: none; height: auto; min-height: 0; }
#sysTimesheetsApp [data-timesheet-panel] .sysdash-grid,
#sysTimesheetsApp [data-timesheet-panel] .sysdash-table,
#sysTimesheetsApp [data-timesheet-panel] .sysdash-widget-body { max-height: none; }
#sysTimesheetsApp .sysdash-shell { padding: 0 0 4px; }
.sys-timesheets-module .sysdash-commandbar { min-height: 46px; margin-bottom: 5px; padding: 6px 9px; box-shadow: 0 8px 18px rgba(0,0,0,.12); }
.sys-timesheets-module .sysdash-brand { align-items: center; }
.sys-timesheets-module .sysdash-brand > div { display: grid; align-content: center; gap: 2px; min-height: 34px; }
.sys-timesheets-module .sysdash-brand-icon { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 34px; width: 34px; height: 34px; }
.sys-timesheets-module .sysdash-brand h1 { margin: 0; font-size: 20px; line-height: 1.12; font-weight: 600; }
.sys-timesheets-module .sysdash-brand p { margin: 0; max-width: 620px; font-size: 12px; line-height: 1.3; }
.sys-timesheets-module .sysdash-canvas { border-color: var(--sysdash-line); box-shadow: 0 8px 18px rgba(0,0,0,.12); }
.sys-timesheets-module .sysdash-canvas-head { min-height: 0; padding: 8px 10px; }
.sys-timesheets-module .sysdash-canvas-head h2 { font-size: 20px; line-height: 1.15; margin-top: 2px; font-weight: 600; }
.sys-timesheets-module .sysdash-canvas-head p { margin-top: 4px; font-size: 12px; line-height: 1.35; }
.sys-timesheets-module .sysdash-segment button { transition: background .16s ease, border-color .16s ease, color .16s ease, transform .16s ease; }
.sys-timesheets-module .sysdash-segment button[hidden],
.sys-timesheets-module [data-timesheet-tab][hidden],
.sys-timesheets-module [data-timesheet-tab].is-permission-hidden { display: none !important; }
.sys-timesheets-module .sysdash-segment button.is-active { border-color: rgba(58,160,255,.80); background: #17679f; color: #fff; font-weight: 800; }
.sys-timesheets-module .sysdash-segment button:hover,
.sys-timesheets-module .sysdash-icon-btn:hover,
.sys-timesheets-module .sysdash-primary-btn:hover { transform: translateY(-1px); }
.sys-timesheets-module .sysdash-primary-btn { border-color: rgba(58,160,255,.58); background: rgba(58,160,255,.22); color: var(--sysdash-text); font-weight: 800; }
.sys-timesheets-module [data-timesheet-refresh] { border-color: rgba(58,160,255,.52); color: var(--sysdash-text); }
.sys-timesheets-module [data-timesheet-new-period] { border-color: rgba(245,171,53,.68); background: rgba(245,171,53,.24); color: var(--sysdash-text); }
.sys-timesheets-module [data-timesheet-create-period],
.sys-timesheets-module [data-timesheet-save],
.sys-timesheets-module [data-timesheet-submit],
.sys-timesheet-approve-btn { border-color: rgba(0,166,90,.78) !important; background: #0f7a4a !important; color: #fff !important; font-weight: 900; }
.sys-timesheet-reject-btn { border-color: rgba(221,75,57,.78) !important; background: #9b2f25 !important; color: #fff !important; font-weight: 900; }
.sys-timesheet-cancel-approval-btn { border-color: rgba(245,171,53,.82) !important; background: #8a5a10 !important; color: #fff !important; font-weight: 900; }
.sys-timesheets-module [data-timesheet-recall] { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 34px; border-color: rgba(245,171,53,.82); background: #8a5a10; color: #fff; font-weight: 900; }
.sys-timesheets-module button:disabled { opacity: .48; cursor: not-allowed; transform: none !important; }
.sys-timesheets-module .sysdash-primary-btn i,
.sys-timesheets-module .sysdash-icon-btn i,
.sys-timesheets-module .sys-timesheet-add-line-btn i { color: currentColor; opacity: .96; }
.sys-timesheet-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 5px; margin-bottom: 5px; }
.sys-timesheet-kpi .sysdash-widget-body { display: grid; gap: 3px; min-height: 58px; padding: 8px 10px; }
.sys-timesheet-kpi span { color: var(--sysdash-muted); font-size: 11px; font-weight: 700; text-transform: uppercase; }
.sys-timesheet-kpi strong { color: var(--sysdash-text); font-size: 20px; line-height: 1.1; font-weight: 700; }
.sys-timesheet-kpi small { color: var(--sysdash-muted); }
.sys-timesheet-access-denied { display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 14px; align-items: start; margin-top: 8px; border: 1px solid rgba(221,75,57,.38); background: var(--sysdash-surface); color: var(--sysdash-text); padding: 16px; box-shadow: 0 8px 18px rgba(0,0,0,.12); }
.sys-timesheet-access-denied[hidden] { display: none !important; }
.sys-timesheet-access-icon { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border: 1px solid rgba(221,75,57,.36); background: rgba(221,75,57,.13); color: #dd4b39; font-size: 18px; }
.sys-timesheet-access-denied h2 { margin: 3px 0 4px; color: var(--sysdash-text); font-size: 20px; line-height: 1.15; font-weight: 700; }
.sys-timesheet-access-denied p { margin: 0; color: var(--sysdash-muted); font-size: 12px; line-height: 1.4; }
.sys-timesheet-missing-permission { display: inline-flex; align-items: center; gap: 8px; margin-top: 12px; border: 1px solid var(--sysdash-line); background: var(--sysdash-surface-2); color: var(--sysdash-muted); padding: 7px 9px; font-size: 11px; font-weight: 800; text-transform: uppercase; }
.sys-timesheet-missing-permission code { border: 1px solid rgba(221,75,57,.30); background: rgba(221,75,57,.10); color: var(--sysdash-text); padding: 3px 6px; font-size: 11px; font-weight: 900; text-transform: none; }
.sys-timesheets-module.is-access-denied [data-timesheet-tabs] { display: none !important; }
.sys-timesheets-module.is-access-denied .sys-timesheet-kpis,
.sys-timesheets-module.is-access-denied [data-timesheet-panel] { display: none !important; }
#sysTimesheetsApp[data-active-tab="entry"] [data-kpi-scope]:not([data-kpi-scope~="entry"]),
#sysTimesheetsApp[data-active-tab="approval"] [data-kpi-scope]:not([data-kpi-scope~="approval"]),
#sysTimesheetsApp[data-active-tab="periods"] [data-kpi-scope]:not([data-kpi-scope~="periods"]),
#sysTimesheetsApp[data-active-tab="config"] [data-kpi-scope]:not([data-kpi-scope~="config"]),
#sysTimesheetsApp[data-active-tab="payroll"] [data-kpi-scope]:not([data-kpi-scope~="payroll"]) { display: none; }
.sys-timesheet-panel { display: none; }
.sys-timesheet-panel.is-active { display: block; }
.sys-timesheets-module [data-timesheet-panel="entry"] .sysdash-canvas-head { display: grid; grid-template-columns: minmax(0, 1fr); align-items: start; gap: 7px; }
.sys-timesheets-module [data-timesheet-panel="entry"] .sysdash-canvas-head > div:first-child { min-width: 0; }
.sys-timesheets-module [data-timesheet-panel="entry"] .sysdash-canvas-head h2 { white-space: nowrap; }
.sys-timesheets-module [data-timesheet-panel="entry"] .sysdash-status { width: 100%; justify-content: flex-start; align-items: center; gap: 6px; }
.sys-timesheet-entry-grid { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); gap: 6px; padding: 0; background: transparent; }
.sys-timesheet-entry-grid > .sysdash-widget:first-child { min-width: 0; overflow: hidden; }
.sys-timesheet-entry-grid > .sysdash-widget:first-child .sysdash-widget-body { overflow-x: auto; }
.sys-timesheet-context-panel { position: fixed; top: 172px; right: 0; z-index: 1040; width: min(294px, calc(100vw - 52px)); max-height: calc(100vh - 190px); overflow: visible; box-shadow: -12px 18px 46px rgba(0,0,0,.22); transition: transform .22s ease, box-shadow .22s ease, opacity .18s ease; }
.sys-timesheet-panel-close-corner { position: absolute; top: 7px; right: 7px; z-index: 5; display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border: 1px solid var(--sysdash-line); background: var(--sysdash-surface-3); color: var(--sysdash-text); padding: 0; font-size: 12px; line-height: 1; cursor: pointer; }
.sys-timesheet-panel-close-corner:hover { border-color: rgba(58,160,255,.72); background: rgba(58,160,255,.16); color: var(--sysdash-text); }
.sys-timesheet-context-panel > .sysdash-widget-head,
.sys-timesheet-context-panel > .sysdash-widget-body { transition: opacity .14s ease; }
.sys-timesheet-context-panel > .sysdash-widget-head { flex-wrap: nowrap; gap: 8px; min-height: 40px; padding: 7px 40px 7px 9px; }
.sys-timesheet-context-panel > .sysdash-widget-body { max-height: calc(100vh - 248px); overflow-y: auto; padding: 9px; }
.sys-timesheet-context-panel .sysdash-widget-actions { margin-left: auto; flex: 0 0 auto; }
.sys-timesheet-context-panel .sysdash-widget-title { min-width: 0; font-size: 13px; }
.sys-timesheet-drawer-grip { position: absolute; top: 12px; left: -32px; z-index: 2; display: none; align-items: center; justify-content: center; width: 32px; min-height: 96px; border: 1px solid var(--sysdash-line); border-right: 0; background: var(--sysdash-surface-2); color: var(--sysdash-text); writing-mode: vertical-rl; text-orientation: mixed; font-size: 10px; font-weight: 800; letter-spacing: 0; box-shadow: -8px 10px 24px rgba(0,0,0,.12); }
.sys-timesheet-drawer-grip i { margin-bottom: 7px; color: var(--sysdash-accent); }
.sys-timesheets-module.is-side-collapsed .sys-timesheet-context-panel { transform: translateX(calc(100% + 1px)); opacity: .96; }
.sys-timesheets-module.is-side-collapsed .sys-timesheet-drawer-grip { display: inline-flex; }
.sys-timesheets-module.is-side-collapsed .sys-timesheet-side-open { display: inline-flex !important; }
.sys-timesheets-module:not(.is-side-collapsed) .sys-timesheet-context-panel { transform: translateX(0); }
.sys-timesheets-module .sysdash-status { flex-wrap: wrap; }
.sys-timesheet-user-target,
.sys-timesheet-period-target { display: inline-flex; align-items: center; gap: 8px; min-height: 30px; border: 1px solid var(--sysdash-line); background: var(--sysdash-surface-2); color: var(--sysdash-muted); padding: 0 8px; font-size: 11px; font-weight: 700; text-transform: uppercase; }
.sys-timesheet-user-target select,
.sys-timesheet-period-target select { min-width: 170px; max-width: 220px; border: 0; background: transparent; color: var(--sysdash-text); padding: 0; font-size: 12px; font-weight: 600; text-transform: none; outline: 0; }
.sys-timesheet-period-target select { min-width: 220px; max-width: 300px; }
.sys-timesheet-entry-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
.sys-timesheet-entry-actions .sysdash-primary-btn,
.sys-timesheet-entry-actions .sysdash-icon-btn,
.sys-timesheet-entry-actions .sys-timesheet-add-line-btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; width: auto; min-width: 118px; min-height: 32px; padding: 0 11px; }
.sys-timesheet-entry-actions [data-timesheet-recall] { border-color: rgba(245,171,53,.82); background: #8a5a10; color: #fff; }
.sys-timesheet-side-toggle { width: 32px; height: 32px; }
.sys-timesheet-side-open { display: none !important; }
.sys-timesheet-grid-feedback { display: grid; gap: 8px; padding: 0 0 10px; }
.sys-timesheet-grid-feedback:empty { display: none; }
.sys-timesheet-table input,
.sys-timesheet-table select,
.sys-timesheet-table textarea,
.sys-timesheet-side select,
.sys-timesheet-hour-bank input,
.sys-timesheet-hour-bank textarea,
.sys-timesheet-period-form input,
.sys-timesheet-config-grid input,
.sys-timesheet-config-grid select,
.sys-timesheet-config-grid textarea { width: 100%; border: 1px solid var(--sysdash-line); background: var(--sysdash-surface-3); color: var(--sysdash-text); padding: 7px 8px; outline: 0; }
.sys-timesheet-table textarea { min-height: 34px; resize: vertical; }
.sys-timesheet-table input:focus,
.sys-timesheet-table select:focus,
.sys-timesheet-table textarea:focus,
.sys-timesheet-side select:focus,
.sys-timesheet-hour-bank input:focus,
.sys-timesheet-hour-bank textarea:focus,
.sys-timesheet-period-form input:focus,
.sys-timesheet-config-grid input:focus,
.sys-timesheet-config-grid select:focus,
.sys-timesheet-config-grid textarea:focus { border-color: var(--sysdash-accent); }
.sys-timesheet-table { table-layout: fixed; min-width: 860px; }
.sys-timesheet-table[hidden], [data-timesheet-lines-empty][hidden] { display: none !important; }
.sys-timesheet-table th:nth-child(1),
.sys-timesheet-table td:nth-child(1) { width: 210px; }
.sys-timesheet-table th:last-child,
.sys-timesheet-table td:last-child { width: 64px; }
.sys-timesheet-day-head { width: 76px; min-width: 76px; text-align: center; white-space: normal; line-height: 1.2; }
.sys-timesheet-day-head span { display: block; }
.sys-timesheet-day-head em { display: block; margin-top: 3px; color: var(--sysdash-muted); font-size: 9px; font-style: normal; font-weight: 700; text-transform: uppercase; opacity: .72; }
.sys-timesheet-day-head small { display: inline-flex; align-items: center; justify-content: center; gap: 4px; max-width: 100%; margin-top: 4px; border: 1px solid rgba(245,171,53,.58); background: rgba(245,171,53,.15); color: var(--sysdash-text); padding: 2px 5px; font-size: 10px; font-weight: 800; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sys-timesheet-day-head.is-holiday { background: rgba(245,171,53,.08); }
.sys-timesheet-day-head.is-nonwork { background: rgba(127,140,141,.08); }
.sys-timesheet-day-head.is-nonwork em { color: var(--sysdash-muted); opacity: .95; }
.sys-timesheet-holiday-cell { background: rgba(245,171,53,.05); }
.sys-timesheet-nonwork-cell { background: rgba(127,140,141,.045); }
.sys-timesheet-day-hours { min-width: 0; width: 100%; text-align: right; padding-left: 4px; padding-right: 4px; }
.sys-timesheet-assignment-line { display: grid; grid-template-columns: minmax(0, 1fr) 32px; gap: 6px; align-items: center; }
.sys-timesheet-assignment-starter { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 8px; width: min(100%, 720px); margin: 0 auto; }
.sys-timesheet-assignment-starter select { width: 100%; min-width: 0; text-align: left; }
.sys-timesheet-assignment-starter .sys-timesheet-add-line-btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 34px; padding: 0 12px; border-color: rgba(0,166,90,.70); background: rgba(0,166,90,.24); color: var(--sysdash-text); font-weight: 800; }
.sys-timesheet-assignment-cell.is-system-assignment select { border-color: rgba(58,160,255,.36); background: rgba(58,160,255,.07); font-weight: 700; }
.sys-timesheet-assignment-cell.is-holiday-assignment select { border-color: rgba(245,171,53,.54); background: rgba(245,171,53,.11); }
.sys-timesheet-delete-btn { width: 30px; height: 30px; color: #7a1f1f; border-color: rgba(180,50,50,.35); }
.sys-timesheet-row-total { display: inline-flex; min-width: 54px; justify-content: flex-end; color: var(--sysdash-text); font-size: 12px; white-space: nowrap; }
.sys-timesheet-table tfoot td { border-top: 2px solid var(--sysdash-line-strong); background: var(--sysdash-surface-2); color: var(--sysdash-text); font-weight: 800; }
.sys-timesheet-column-total,
.sys-timesheet-grand-total { text-align: right; white-space: nowrap; }
.sys-timesheet-grand-total { color: #0f5f39; }
.sys-timesheet-description-row td { padding-top: 0 !important; border-top: 0 !important; }
.sys-timesheet-description-row textarea { min-height: 30px; }
.sys-timesheet-save-status { min-height: 18px; color: var(--sysdash-muted); font-size: 12px; }
.sys-timesheet-side { display: grid; gap: 12px; align-content: start; }
.sys-timesheet-side-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.sys-timesheet-side-tabs button { display: inline-flex; align-items: center; justify-content: center; gap: 5px; min-height: 30px; border: 1px solid var(--sysdash-line); background: var(--sysdash-surface-2); color: var(--sysdash-muted); padding: 4px 6px; font-size: 12px; font-weight: 800; line-height: 1.12; text-align: center; }
.sys-timesheet-side-tabs button.is-active { border-color: rgba(58,160,255,.70); background: rgba(58,160,255,.16); color: var(--sysdash-text); }
.sys-timesheet-side-content { display: none; }
.sys-timesheet-side-content.is-active { display: grid; gap: 12px; }
.sys-timesheet-side label,
.sys-timesheet-hour-bank label,
.sys-timesheet-period-form label,
.sys-timesheet-config-grid label { display: grid; gap: 5px; color: var(--sysdash-muted); font-size: 11px; font-weight: 700; text-transform: uppercase; }
.sys-timesheet-side-title { display: flex; align-items: center; gap: 8px; color: var(--sysdash-text); font-weight: 800; }
.sys-timesheet-side-title i { color: var(--sysdash-accent); }
.sys-timesheet-hour-bank { display: grid; gap: 10px; border: 1px solid var(--sysdash-line); background: var(--sysdash-surface-2); padding: 10px; }
.sys-timesheet-hour-bank textarea { min-height: 58px; resize: vertical; }
.sys-timesheet-hour-bank[hidden] { display: none !important; }
.sys-timesheet-bank-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.sys-timesheet-bank-actions button { display: inline-flex; align-items: center; justify-content: center; gap: 5px; min-height: 34px; border: 1px solid rgba(58,160,255,.42); background: rgba(58,160,255,.14); color: var(--sysdash-text); padding: 5px 7px; font-size: 11px; font-weight: 800; line-height: 1.12; text-align: center; }
.sys-timesheet-bank-actions button span { min-width: 0; overflow-wrap: anywhere; }
.sys-timesheet-bank-actions button:last-child { border-color: rgba(0,166,90,.48); background: rgba(0,166,90,.13); }
.sys-timesheet-bank-actions button:disabled { opacity: .46; cursor: not-allowed; }
.sys-timesheets-module .sysdash-widget-actions .sys-timesheet-add-line-btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; width: auto; min-width: 132px; height: 30px; padding: 0 10px; border-color: rgba(0,166,90,.70); background: rgba(0,166,90,.24); color: var(--sysdash-text); font-weight: 800; }
.sys-timesheets-module .sysdash-widget-actions .sys-timesheet-add-line-btn:hover { border-color: rgba(0,166,90,.88); background: rgba(0,166,90,.34); color: var(--sysdash-text); }
.sys-timesheet-rule-list { display: grid; border: 1px solid var(--sysdash-line); }
.sys-timesheet-rule-list span { display: flex; justify-content: space-between; gap: 12px; padding: 9px 10px; border-bottom: 1px solid var(--sysdash-line); color: var(--sysdash-muted); }
.sys-timesheet-rule-list span:last-child { border-bottom: 0; }
.sys-timesheet-rule-list b { flex: 0 0 auto; color: var(--sysdash-text); font-weight: 600; }
.sys-timesheet-rule-list em { min-width: 0; color: var(--sysdash-muted); font-style: normal; text-align: right; overflow-wrap: anywhere; }
.sys-timesheet-rule-list em .sys-timesheet-status { min-height: 22px; }
.sys-timesheet-note { display: flex; align-items: flex-start; gap: 8px; border: 1px solid var(--sysdash-line); background: var(--sysdash-surface-2); color: var(--sysdash-muted); padding: 9px 10px; font-size: 12px; line-height: 1.35; }
.sys-timesheet-note i { margin-top: 2px; color: var(--sysdash-accent); }
.sys-timesheet-submit-note { display: flex; align-items: flex-start; gap: 8px; border: 1px solid rgba(245,171,53,.72); background: rgba(245,171,53,.20); color: var(--sysdash-text); padding: 9px 10px; font-size: 12px; line-height: 1.35; }
.sys-timesheet-submit-note[hidden] { display: none !important; }
.sys-timesheet-submit-note.is-success { border-color: rgba(0,166,90,.68); background: rgba(0,166,90,.22); color: var(--sysdash-text); }
.sys-timesheet-submit-note.is-rejected { border-color: rgba(221,75,57,.72); background: rgba(221,75,57,.16); color: var(--sysdash-text); }
.sys-timesheet-submit-note.is-rejected i { color: var(--sysdash-danger, #dd4b39); }
.sys-timesheet-submit-note i { margin-top: 2px; }
.sys-timesheet-contextuid { display: block; margin-top: 4px; color: var(--sysdash-muted); font-size: 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sys-timesheet-empty { color: var(--sysdash-muted); text-align: center; padding: 24px 8px !important; }
.sys-timesheet-current-badge { display: inline-flex; align-items: center; min-height: 20px; margin-left: 6px; border: 1px solid rgba(0,166,90,.45); background: var(--sysdash-success-soft); color: var(--sysdash-accent-2); padding: 0 6px; font-size: 10px; font-weight: 700; text-transform: uppercase; }
.sys-timesheet-status { display: inline-flex; align-items: center; justify-content: center; min-height: 24px; max-width: 100%; border: 1px solid rgba(255,255,255,.18); background: rgba(255,255,255,.06); color: var(--sysdash-muted); padding: 2px 9px; font-size: 11px; font-weight: 800; line-height: 1.2; text-transform: uppercase; white-space: nowrap; }
.sys-timesheet-status:before { content: ""; width: 7px; height: 7px; flex: 0 0 7px; margin-right: 7px; border-radius: 50%; background: currentColor; box-shadow: 0 0 0 3px rgba(255,255,255,.06); }
.sys-timesheet-status.is-open { border-color: rgba(0,166,90,.62); background: rgba(0,166,90,.13); color: #69e6a6; }
.sys-timesheet-status.is-closed { border-color: rgba(221,75,57,.68); background: rgba(221,75,57,.14); color: #ff9b8c; }
.sys-timesheet-status.is-none,
.sys-timesheet-status.is-draft { border-color: rgba(245,171,53,.62); background: rgba(245,171,53,.13); color: #ffd48a; }
.sys-timesheet-status.is-not-started { border-color: rgba(127,140,141,.7); background: rgba(127,140,141,.16); color: #d6dee2; }
.sys-timesheet-status.is-submitted { border-color: rgba(58,160,255,.62); background: rgba(58,160,255,.14); color: #91d1ff; }
.sys-timesheet-status.is-approved { border-color: rgba(0,166,90,.68); background: rgba(0,166,90,.16); color: #82f0b5; }
.sys-timesheet-status.is-rejected { border-color: rgba(221,75,57,.72); background: rgba(221,75,57,.16); color: #ff9b8c; }
.sys-timesheet-status.is-warning { border-color: rgba(245,171,53,.72); background: rgba(245,171,53,.16); color: #ffd48a; }
.sys-timesheet-approval-actions { display: flex; gap: 7px; flex-wrap: wrap; }
.sys-timesheet-approval-actions .sysdash-primary-btn { min-height: 30px; padding: 0 10px; }
.sys-timesheet-no-action { display: inline-flex; align-items: center; min-height: 26px; color: var(--sysdash-muted); font-size: 11px; font-weight: 700; }
.sys-timesheet-muted { color: var(--sysdash-muted); font-size: 11px; font-weight: 700; }
.sys-timesheet-bank-cell { display: grid; gap: 3px; min-width: 72px; font-size: 11px; font-weight: 800; line-height: 1.2; }
.sys-timesheet-bank-cell span { display: inline-flex; align-items: center; width: max-content; max-width: 100%; padding: 2px 6px; border: 1px solid var(--sysdash-line); background: var(--sysdash-surface-2); }
.sys-timesheet-bank-cell .is-earned { border-color: rgba(0,166,90,.48); color: #0f7a4a; }
.sys-timesheet-bank-cell .is-used { border-color: rgba(58,160,255,.48); color: #17679f; }
.sys-timesheet-approval-note { display: inline-block; max-width: 240px; color: var(--sysdash-text); font-size: 11px; line-height: 1.25; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: middle; }
.sys-timesheet-approval-details { position: relative; display: inline-block; min-width: 94px; color: var(--sysdash-text); }
.sys-timesheet-approval-details summary { display: inline-flex; align-items: center; gap: 6px; min-height: 28px; border: 1px solid var(--sysdash-line); background: var(--sysdash-surface-2); color: var(--sysdash-text); padding: 0 10px; font-size: 11px; font-weight: 800; cursor: pointer; list-style: none; box-shadow: 0 2px 8px rgba(0,0,0,.06); }
.sys-timesheet-approval-details[open] summary { border-color: rgba(58,160,255,.72); background: rgba(58,160,255,.14); }
.sys-timesheet-approval-details summary::-webkit-details-marker { display: none; }
.sys-timesheet-approval-details div { position: absolute; top: calc(100% + 6px); left: 0; z-index: 1060; display: grid; gap: 4px; min-width: 340px; max-width: min(460px, calc(100vw - 48px)); max-height: 300px; overflow: auto; padding: 8px; border: 1px solid var(--sysdash-line); background: var(--sysdash-surface); box-shadow: 0 16px 34px rgba(0,0,0,.20); }
.sys-timesheet-approval-details span { display: grid; grid-template-columns: 92px minmax(120px, 1fr) 58px; gap: 8px; align-items: center; min-height: 30px; border: 1px solid transparent; border-bottom-color: var(--sysdash-line); padding: 5px 6px; font-size: 11px; }
.sys-timesheet-approval-details span:last-child { border-bottom-color: transparent; }
.sys-timesheet-approval-details b,
.sys-timesheet-approval-details strong { color: var(--sysdash-text); }
.sys-timesheet-approval-details b { font-weight: 800; }
.sys-timesheet-approval-details em { min-width: 0; color: var(--sysdash-text); font-style: normal; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sys-timesheet-approval-details strong { justify-self: end; white-space: nowrap; }
.sys-timesheet-approval-details small { grid-column: 2 / -1; color: var(--sysdash-muted); line-height: 1.25; }
.sys-timesheet-approval-filter { display: grid; gap: 5px; min-width: 280px; color: var(--sysdash-muted); font-size: 11px; font-weight: 700; text-transform: uppercase; }
.sys-timesheet-approval-filter select { width: 100%; border: 1px solid var(--sysdash-line); background: var(--sysdash-surface-3); color: var(--sysdash-text); padding: 7px 8px; outline: 0; }
.sys-timesheet-state-btn { transition: background .16s ease, border-color .16s ease, color .16s ease, transform .16s ease; }
.sys-timesheet-state-btn.is-open-action { border-color: rgba(0,166,90,.62); background: rgba(0,166,90,.16); color: #82f0b5; }
.sys-timesheet-state-btn.is-close-action { border-color: rgba(221,75,57,.62); background: rgba(221,75,57,.14); color: #ff9b8c; }
.sys-timesheets-module[data-period-state="open"] .sys-timesheet-kpi:first-child { border-color: rgba(0,166,90,.45); }
.sys-timesheets-module[data-period-state="closed"] .sys-timesheet-kpi:first-child { border-color: rgba(221,75,57,.45); }
.sys-timesheets-module[data-period-state="none"] .sys-timesheet-kpi:first-child { border-color: rgba(245,171,53,.45); }
.sys-timesheet-followup-strip { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 10px; border-bottom: 1px solid var(--sysdash-line); background: rgba(245,171,53,.10); color: var(--sysdash-text); }
.sys-timesheet-followup-strip div { display: flex; align-items: baseline; gap: 8px; }
.sys-timesheet-followup-strip strong { font-size: 22px; }
.sys-timesheet-followup-strip span,
.sys-timesheet-followup-strip small { color: var(--sysdash-muted); }
.sys-timesheet-panel .sysdash-grid {
    overflow-x: auto;
}

.sys-timesheet-panel .sysdash-widget-body {
    overflow-x: auto;
}

.sys-timesheet-panel .sysdash-widget-body > .sysdash-table {
    width: max-content;
    max-width: max-content;
    min-width: 100%;
    table-layout: auto;
}

.sys-timesheet-panel .sysdash-table {
    width: max-content;
    max-width: max-content;
    min-width: 100%;
    table-layout: auto;
}

.sys-timesheet-panel .sysdash-table th,
.sys-timesheet-panel .sysdash-table td {
    white-space: nowrap;
}

.sys-timesheet-panel[data-timesheet-panel="entry"] .sysdash-table {
    width: 100%;
    min-width: 860px;
    max-width: none;
    table-layout: fixed;
}
.sys-timesheet-period-form { display: grid; grid-template-columns: minmax(180px, 1fr) 150px 150px 110px 96px minmax(140px, auto); align-items: end; gap: 10px; padding: 8px; border-bottom: 1px solid var(--sysdash-line); background: transparent; }
.sys-timesheet-check { display: flex !important; align-items: center; gap: 8px; min-height: 34px; }
.sys-timesheet-check input { width: auto !important; min-height: 0; }
.sys-timesheet-period-form [data-period-save-status] { color: var(--sysdash-muted); font-size: 12px; align-self: center; }
.sys-timesheet-period-form.is-saving [data-timesheet-create-period],
.sys-timesheet-period-form.is-saved [data-timesheet-create-period],
.sys-timesheet-period-form.is-error [data-timesheet-create-period] { color: #fff; }
.sys-timesheet-period-form.is-saving [data-timesheet-create-period] { border-color: rgba(58,160,255,.7); background: rgba(58,160,255,.22); }
.sys-timesheet-period-form.is-saved [data-timesheet-create-period] { border-color: rgba(0,166,90,.72); background: rgba(0,166,90,.22); }
.sys-timesheet-period-form.is-error [data-timesheet-create-period] { border-color: rgba(221,75,57,.75); background: rgba(221,75,57,.22); }
.sys-timesheet-config-actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; flex-wrap: wrap; }
.sys-timesheet-config-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 8px; background: transparent; }
.sys-timesheet-config-grid textarea { min-height: 90px; resize: vertical; }
.sys-timesheet-payroll-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; padding: 8px; background: transparent; }
.sys-timesheet-payroll-grid .sysdash-widget-body { display: grid; align-content: center; min-height: 150px; gap: 8px; }
.sys-timesheet-payroll-grid strong { font-size: 38px; line-height: 1; color: var(--sysdash-text); }
.sys-timesheet-payroll-grid small { color: var(--sysdash-muted); }
.sys-timesheet-payroll-detail-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 0 8px 8px; }
.sys-timesheet-payroll-detail-grid > .sysdash-widget { min-width: 0; }
.sys-timesheet-payroll-detail-grid > .sysdash-widget:first-child { grid-column: 1 / -1; }
.sys-timesheet-panel .sysdash-widget-body > .sys-timesheet-payroll-table,
.sys-timesheet-panel .sys-timesheet-payroll-table { width: 100%; max-width: none; min-width: 1100px; table-layout: fixed; }
.sys-timesheet-payroll-table th:nth-child(1),
.sys-timesheet-payroll-table td:nth-child(1) { width: 250px; }
.sys-timesheet-payroll-table th:nth-child(2),
.sys-timesheet-payroll-table td:nth-child(2) { width: 140px; }
.sys-timesheet-payroll-table th:nth-child(3),
.sys-timesheet-payroll-table td:nth-child(3) { width: auto; }
.sys-timesheet-payroll-table th:nth-child(4),
.sys-timesheet-payroll-table td:nth-child(4) { width: 110px; }
.sys-timesheet-payroll-table th:nth-child(5),
.sys-timesheet-payroll-table td:nth-child(5) { width: 170px; }
.sys-timesheet-payroll-table th:nth-child(6),
.sys-timesheet-payroll-table td:nth-child(6) { width: 90px; }
.sys-timesheet-payroll-table th:nth-child(7),
.sys-timesheet-payroll-table td:nth-child(7) { width: 150px; }
.sys-timesheet-payroll-table th:nth-child(8),
.sys-timesheet-payroll-table td:nth-child(8) { width: 160px; }
.sys-timesheet-payroll-table td { vertical-align: top; white-space: normal; }
.sys-timesheet-overtime { color: #ffd48a; font-weight: 900; white-space: nowrap; }
.sys-timesheet-payroll-hours { font-weight: 800; white-space: nowrap; }
.sys-timesheet-payroll-hours.is-vacation { color: #7bd389; }
.sys-timesheet-payroll-hours.is-holiday { color: #ffd48a; }
.sys-timesheet-payroll-hours.is-sick,
.sys-timesheet-payroll-hours.is-absence,
.sys-timesheet-payroll-hours.is-unpaid,
.sys-timesheet-payroll-hours.is-system { color: #ff9f7d; }
.sys-timesheet-payroll-total strong { color: var(--sysdash-text); white-space: nowrap; }
.sys-timesheet-payroll-line-details { min-width: 120px; }
.sys-timesheet-payroll-line-details summary { display: inline-flex; align-items: center; gap: 5px; cursor: pointer; }
.sys-timesheet-payroll-line-details summary strong { color: var(--sysdash-text); }
.sys-timesheet-payroll-line-details div { display: grid; gap: 4px; margin-top: 6px; min-width: 260px; max-width: 440px; }
.sys-timesheet-payroll-line-details span { display: grid; grid-template-columns: 78px minmax(110px, 1fr) 64px; gap: 7px; align-items: center; border-left: 2px solid var(--sysdash-line); padding-left: 7px; color: var(--sysdash-muted-strong); font-size: 11px; line-height: 1.25; }
.sys-timesheet-payroll-line-details span.is-vacation { border-left-color: #7bd389; }
.sys-timesheet-payroll-line-details span.is-holiday { border-left-color: #ffd48a; }
.sys-timesheet-payroll-line-details span.is-sick,
.sys-timesheet-payroll-line-details span.is-unpaid,
.sys-timesheet-payroll-line-details span.is-absence { border-left-color: #ff9f7d; }
.sys-timesheet-payroll-line-details em { overflow: hidden; color: var(--sysdash-muted-strong); font-style: normal; text-overflow: ellipsis; }
.sys-timesheet-payroll-line-details b,
.sys-timesheet-payroll-line-details strong { color: var(--sysdash-text); font-weight: 800; white-space: nowrap; }
.sys-timesheet-payroll-breakdown { display: flex; align-items: flex-start; gap: 5px; flex-wrap: wrap; min-width: 0; }
.sys-timesheet-payroll-chip { display: inline-grid; grid-template-columns: auto auto; align-items: center; gap: 5px; min-height: 24px; border: 1px solid var(--sysdash-line); background: var(--sysdash-surface-3); color: var(--sysdash-muted-strong); padding: 2px 6px; white-space: nowrap; }
.sys-timesheet-payroll-chip b { color: var(--sysdash-muted); font-size: 10px; font-weight: 800; }
.sys-timesheet-payroll-chip strong { color: var(--sysdash-text); font-size: 11px; font-weight: 900; }
.sys-timesheet-payroll-chip.is-overtime,
.sys-timesheet-payroll-chip.is-holiday { border-color: rgba(255,212,138,.48); background: rgba(245,171,53,.14); }
.sys-timesheet-payroll-chip.is-vacation { border-color: rgba(123,211,137,.48); background: rgba(0,166,90,.14); }
.sys-timesheet-payroll-chip.is-bank-balance { border-color: rgba(77,166,255,.48); background: rgba(61,153,230,.14); }
.sys-timesheet-payroll-chip.is-bank-projected,
.sys-timesheet-payroll-chip.is-bank-earned { border-color: rgba(123,211,137,.48); background: rgba(0,166,90,.14); }
.sys-timesheet-payroll-chip.is-bank-used { border-color: rgba(255,159,125,.48); background: rgba(221,75,57,.12); }
.sys-timesheet-payroll-chip.is-sick,
.sys-timesheet-payroll-chip.is-absence,
.sys-timesheet-payroll-chip.is-unpaid,
.sys-timesheet-payroll-chip.is-system { border-color: rgba(255,159,125,.48); background: rgba(221,75,57,.12); }
.sys-timesheet-payroll-bank { display: flex; align-items: flex-start; gap: 5px; flex-wrap: wrap; min-width: 0; }
.sys-timesheet-payroll-comments { min-width: 180px; }
.sys-timesheet-payroll-comments summary { display: inline-flex; align-items: center; gap: 5px; color: var(--sysdash-accent); font-weight: 800; cursor: pointer; }
.sys-timesheet-payroll-comments div { display: grid; gap: 4px; margin-top: 6px; max-width: 360px; }
.sys-timesheet-payroll-comments span { border-left: 2px solid var(--sysdash-line); padding-left: 7px; color: var(--sysdash-muted-strong); font-size: 11px; line-height: 1.3; }
.sys-timesheet-payroll-process-btn,
.sys-timesheet-payroll-cancel-btn { min-height: 30px; padding: 0 10px; white-space: nowrap; }
.sys-timesheet-payroll-cancel-btn { border-color: rgba(255,212,138,.72) !important; background: rgba(245,171,53,.18) !important; color: #ffd48a !important; }
.sys-timesheet-payroll-processed-meta { display: block; margin-top: 4px; color: var(--sysdash-muted); font-size: 10px; line-height: 1.25; }
.sys-timesheet-payroll-table tr.is-payroll-processed { opacity: .72; }
.sys-timesheet-reminder-actions { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.sys-timesheet-reminder-actions .sysdash-primary-btn { min-height: 28px; padding: 0 9px; font-size: 11px; }
.sys-timesheet-reminder-send { border-color: rgba(0,166,90,.72) !important; background: #0f7a4a !important; color: #fff !important; }
.sys-timesheet-reminder-status { min-height: 18px; margin-bottom: 6px; color: var(--sysdash-muted); font-size: 12px; }
.sys-timesheet-reminder-status.is-success { color: #0f7a4a; font-weight: 700; }
.sys-timesheet-reminder-status.is-warning { color: #b46b00; font-weight: 700; }
.sys-timesheet-select-col { width: 36px; text-align: center; }
.sys-timesheet-select-col input { width: auto; margin: 0; }
[data-timesheet-reject-dialog].sysdash-dialog-backdrop { z-index: 10080; align-items: center; justify-content: center; padding: 18px; background: rgba(20,24,28,.58); }
[data-timesheet-reject-dialog] .sys-timesheet-reject-dialog { width: min(460px, calc(100vw - 36px)); overflow: hidden; border: 1px solid var(--sysdash-line-strong, rgba(38,50,56,.22)); background: var(--sysdash-surface, #fff); color: var(--sysdash-text, #263238); box-shadow: 0 22px 58px rgba(0,0,0,.30); }
[data-timesheet-reject-dialog] .sysdash-dialog-head { display: grid; grid-template-columns: 32px minmax(0, 1fr) 32px; gap: 9px; min-height: 48px; padding: 8px 10px; border-bottom: 1px solid var(--sysdash-line, rgba(38,50,56,.12)); background: var(--sysdash-surface-2, #f9fafb); }
[data-timesheet-reject-dialog] .sysdash-dialog-head span { width: 32px; height: 32px; border-color: rgba(221,75,57,.35); background: rgba(221,75,57,.12); color: var(--sysdash-danger, #dd4b39); }
[data-timesheet-reject-dialog] .sysdash-dialog-head strong { min-width: 0; color: var(--sysdash-text, #263238); font-size: 15px; font-weight: 800; line-height: 1.2; }
[data-timesheet-reject-dialog] .sysdash-dialog-close { width: 32px; height: 32px; color: var(--sysdash-muted, rgba(38,50,56,.58)); }
[data-timesheet-reject-dialog] .sysdash-dialog-body { display: grid; gap: 10px; padding: 12px 12px 4px; color: var(--sysdash-muted-strong, rgba(38,50,56,.76)); line-height: 1.35; }
.sys-timesheet-dialog-help { border: 1px solid var(--sysdash-line, rgba(38,50,56,.12)); background: var(--sysdash-surface-2, #f9fafb); color: var(--sysdash-muted-strong, rgba(38,50,56,.76)); padding: 8px 9px; font-size: 12px; }
.sys-timesheet-dialog-label { display: grid; gap: 6px; color: var(--sysdash-muted, rgba(38,50,56,.58)); font-size: 11px; font-weight: 800; text-transform: uppercase; }
.sys-timesheet-dialog-textarea.sysdash-dialog-input { display: block; width: 100%; height: 96px; min-height: 96px; margin: 0; resize: vertical; border: 1px solid var(--sysdash-line-strong, rgba(38,50,56,.22)); background: var(--sysdash-surface-3, #eef1f4); color: var(--sysdash-text, #263238); padding: 8px 9px; line-height: 1.35; }
.sys-timesheet-dialog-textarea.sysdash-dialog-input:focus { border-color: var(--sysdash-accent, #3c8dbc); box-shadow: 0 0 0 2px var(--sysdash-accent-soft, rgba(60,141,188,.12)); }
.sys-timesheet-dialog-error { border: 1px solid rgba(221,75,57,.56); background: rgba(221,75,57,.12); color: var(--sysdash-text, #263238); padding: 7px 9px; font-size: 12px; font-weight: 700; }
.sys-timesheet-dialog-error[hidden] { display: none !important; }
[data-timesheet-reject-dialog] .sysdash-dialog-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; padding: 10px 12px 12px; }
[data-timesheet-reject-dialog] .sysdash-dialog-actions button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-width: 94px; min-height: 32px; padding: 0 12px; font-size: 12px; font-weight: 800; }
[data-timesheet-reject-dialog] .sysdash-dialog-danger { border-color: rgba(221,75,57,.82) !important; background: #a9362a; color: #fff; }
.sys-timesheet-employee-wrap { display: grid; grid-template-columns: minmax(150px, 1fr) auto; align-items: center; gap: 8px; min-width: 210px; }
.sys-timesheet-employee-cell { display: grid; gap: 2px; min-width: 0; max-width: 360px; }
.sys-timesheet-employee-name { min-width: 0; color: var(--sysdash-text); font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sys-timesheet-employee-email { min-width: 0; color: var(--sysdash-accent); font-size: 11px; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sys-timesheet-employee-meta { min-width: 0; color: var(--sysdash-muted); font-size: 11px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sys-timesheet-employee-actions { display: inline-flex; align-items: center; gap: 4px; }
.sys-timesheet-employee-actions .sysdash-icon-btn { width: 28px; height: 28px; min-height: 28px; }
.sys-timesheet-exempt-badge { display: inline-flex; width: max-content; max-width: 100%; border: 1px solid rgba(245,171,53,.55); background: rgba(245,171,53,.14); color: var(--sysdash-muted-strong); padding: 1px 5px; font-size: 10px; font-weight: 800; text-transform: uppercase; }
.sys-timesheet-compact-table { width: max-content; max-width: max-content; min-width: 100%; }
.sys-timesheet-compact-table th,
.sys-timesheet-compact-table td { padding: 7px 8px; }
.sys-timesheets-module.is-entry-locked [data-timesheet-add-line],
.sys-timesheets-module.is-entry-locked [data-timesheet-save],
.sys-timesheets-module.is-entry-locked [data-timesheet-submit],
.sys-timesheets-module.is-entry-locked .sys-timesheet-table input,
.sys-timesheets-module.is-entry-locked .sys-timesheet-table select,
.sys-timesheets-module.is-entry-locked .sys-timesheet-table textarea,
.sys-timesheets-module.is-entry-locked .sys-timesheet-hour-bank input,
.sys-timesheets-module.is-entry-locked .sys-timesheet-hour-bank textarea { opacity: .62; pointer-events: none; }
.skin-blue-light .sys-timesheets-module .sysdash-primary-btn,
.skin-sysimple-soft .sys-timesheets-module .sysdash-primary-btn,
.skin-blue-light .sys-timesheets-module .sysdash-icon-btn,
.skin-sysimple-soft .sys-timesheets-module .sysdash-icon-btn,
.skin-blue-light .sys-timesheets-module .sys-timesheet-add-line-btn,
.skin-sysimple-soft .sys-timesheets-module .sys-timesheet-add-line-btn,
.skin-blue-light .sys-timesheet-submit-note,
.skin-sysimple-soft .sys-timesheet-submit-note { color: #263238 !important; }
.skin-blue-light .sys-timesheets-module [data-timesheet-create-period],
.skin-sysimple-soft .sys-timesheets-module [data-timesheet-create-period],
.skin-blue-light .sys-timesheets-module [data-timesheet-save],
.skin-sysimple-soft .sys-timesheets-module [data-timesheet-save],
.skin-blue-light .sys-timesheets-module [data-timesheet-submit],
.skin-sysimple-soft .sys-timesheets-module [data-timesheet-submit],
.skin-blue-light .sys-timesheets-module [data-timesheet-recall],
.skin-sysimple-soft .sys-timesheets-module [data-timesheet-recall],
.skin-blue-light .sys-timesheets-module .sys-timesheet-approve-btn,
.skin-sysimple-soft .sys-timesheets-module .sys-timesheet-approve-btn,
.skin-blue-light .sys-timesheets-module .sys-timesheet-reject-btn,
.skin-sysimple-soft .sys-timesheets-module .sys-timesheet-reject-btn,
.skin-blue-light .sys-timesheets-module .sys-timesheet-cancel-approval-btn,
.skin-sysimple-soft .sys-timesheets-module .sys-timesheet-cancel-approval-btn,
.skin-blue-light .sys-timesheets-module .sysdash-segment button.is-active,
.skin-sysimple-soft .sys-timesheets-module .sysdash-segment button.is-active { color: #fff !important; }

/* Timesheets intentionally reuses the dashboard visual system: compact canvas,
   widget-like panels, and restrained typography. */
#sysTimesheetsApp .sysdash-shell { padding: 0 0 6px; }
.sys-timesheets-module .sysdash-commandbar { margin-bottom: 4px; border-color: transparent; background: transparent; box-shadow: none; }
.sys-timesheets-module .sysdash-brand { gap: 10px; }
.sys-timesheets-module .sysdash-brand h1 { font-size: 20px; font-weight: 600; }
.sys-timesheets-module .sysdash-brand p { max-width: 680px; font-size: 12px; line-height: 1.35; }
.sys-timesheets-module .sysdash-segment button { min-height: 34px; padding: 0 10px; font-size: 13px; font-weight: 600; }
.sys-timesheets-module .sysdash-canvas { min-height: 0; overflow: visible; border-color: transparent; background: transparent; box-shadow: none; }
.sys-timesheets-module .sysdash-canvas-head { display: grid; grid-template-columns: minmax(0, 1fr); align-items: start; gap: 8px; min-height: 0; padding: 8px 10px; border-bottom: 0; background: transparent; }
.sys-timesheets-module .sysdash-canvas-head h2 { margin: 2px 0 0; font-size: 20px; line-height: 1.12; font-weight: 600; }
.sys-timesheets-module .sysdash-canvas-head p { max-width: none; margin: 4px 0 0; font-size: 12px; line-height: 1.35; }
.sys-timesheets-module .sysdash-status { width: 100%; justify-content: flex-start; gap: 6px; }
.sys-timesheet-kpis { gap: 5px; margin-bottom: 5px; }
.sys-timesheet-kpi { border-color: transparent !important; box-shadow: none !important; }
.sys-timesheet-kpi .sysdash-widget-body { min-height: 58px; padding: 8px 10px; }
.sys-timesheet-kpi strong { font-size: 20px; line-height: 1.08; }
.sys-timesheet-entry-grid { padding: 0; gap: 6px; }
.sys-timesheet-entry-grid > .sysdash-widget:first-child .sysdash-widget-head { min-height: 40px; padding: 7px 9px; }
.sys-timesheet-entry-grid > .sysdash-widget:first-child .sysdash-widget-body { padding: 10px; }
.sys-timesheet-context-panel { top: 176px; right: 0; width: min(286px, calc(100vw - 48px)); max-height: calc(100vh - 194px); box-shadow: -10px 16px 42px rgba(0,0,0,.22); }
.sys-timesheet-context-panel > .sysdash-widget-head { flex-wrap: nowrap; min-height: 40px; padding: 7px 9px; }
.sys-timesheet-context-panel > .sysdash-widget-body { max-height: calc(100vh - 252px); padding: 9px; }
.sys-timesheet-context-panel .sysdash-widget-title { font-size: 13px; font-weight: 700; }
.sys-timesheet-context-panel .sysdash-widget-title span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sys-timesheet-side-tabs button { min-height: 29px; padding: 3px 5px; font-size: 11px; font-weight: 700; }
.sys-timesheet-rule-list span { padding: 7px 8px; gap: 8px; }
.sys-timesheet-rule-list b { font-size: 12px; font-weight: 600; }
.sys-timesheet-rule-list em { font-size: 12px; }
.sys-timesheet-note { padding: 8px; font-size: 11px; }
.sys-timesheet-user-target,
.sys-timesheet-period-target { min-height: 30px; font-size: 10.5px; font-weight: 700; }
.sys-timesheet-user-target select,
.sys-timesheet-period-target select { font-size: 12px; font-weight: 600; }
.sys-timesheet-period-target select { min-width: min(260px, 38vw); max-width: min(320px, 42vw); }
.sys-timesheets-module .sysdash-canvas,
.sys-timesheets-module .sysdash-widget,
.sys-timesheet-context-panel,
.sys-timesheet-hour-bank { background: var(--sysdash-surface); color: var(--sysdash-text); }
.sys-timesheets-module .sysdash-widget-head,
.sys-timesheets-module .sysdash-canvas-head,
.sys-timesheet-rule-list span,
.sys-timesheet-side-tabs button,
.sys-timesheet-user-target,
.sys-timesheet-period-target,
.sys-timesheet-note { background: var(--sysdash-surface-2); color: var(--sysdash-text); border-color: var(--sysdash-line); }
.sys-timesheet-table input,
.sys-timesheet-table select,
.sys-timesheet-table textarea,
.sys-timesheet-side select,
.sys-timesheet-hour-bank input,
.sys-timesheet-hour-bank textarea,
.sys-timesheet-period-form input,
.sys-timesheet-config-grid input,
.sys-timesheet-config-grid select,
.sys-timesheet-config-grid textarea { background: var(--sysdash-surface-3); color: var(--sysdash-text); border-color: var(--sysdash-line); }
.sys-timesheets-module .sysdash-icon-btn,
.sys-timesheets-module .sysdash-primary-btn,
.sys-timesheet-bank-actions button { background: var(--sysdash-surface-2); color: var(--sysdash-text); border-color: var(--sysdash-line); }
.sys-timesheet-side-close { width: auto; min-width: 76px; padding: 0 9px; gap: 6px; font-size: 11px; font-weight: 800; }
.sys-timesheet-side-close span { display: inline; }
.sys-timesheet-panel-close-corner { background: var(--sysdash-surface-3); color: var(--sysdash-text); border-color: var(--sysdash-line); }
.sys-timesheet-drawer-grip { background: var(--sysdash-surface-2); color: var(--sysdash-text); border-color: var(--sysdash-line); }
.sys-timesheets-module.is-side-collapsed .sys-timesheet-context-panel { box-shadow: none; }
.sys-timesheets-module.is-side-collapsed .sys-timesheet-context-panel > .sysdash-widget-head,
.sys-timesheets-module.is-side-collapsed .sys-timesheet-context-panel > .sysdash-widget-body,
.sys-timesheets-module.is-side-collapsed .sys-timesheet-panel-close-corner { opacity: 0; pointer-events: none; }
.skin-blue-light .sys-timesheet-context-panel,
.skin-sysimple-soft .sys-timesheet-context-panel { box-shadow: -10px 16px 38px rgba(38,50,56,.14); }
.skin-blue-light .sys-timesheet-drawer-grip,
.skin-sysimple-soft .sys-timesheet-drawer-grip { background: #ffffff; color: #263238; border-color: rgba(38,50,56,.18); }
.skin-blue-light .sys-timesheet-rule-list span,
.skin-sysimple-soft .sys-timesheet-rule-list span,
.skin-blue-light .sys-timesheet-note,
.skin-sysimple-soft .sys-timesheet-note,
.skin-blue-light .sys-timesheet-side-tabs button,
.skin-sysimple-soft .sys-timesheet-side-tabs button { color: #263238; }
.skin-blue-light .sys-timesheet-rule-list em,
.skin-sysimple-soft .sys-timesheet-rule-list em,
.skin-blue-light .sys-timesheet-note,
.skin-sysimple-soft .sys-timesheet-note { color: rgba(38,50,56,.68); }
.skin-blue-light .sys-timesheets-module .sysdash-icon-btn,
.skin-sysimple-soft .sys-timesheets-module .sysdash-icon-btn,
.skin-blue-light .sys-timesheet-bank-actions button,
.skin-sysimple-soft .sys-timesheet-bank-actions button { background: #f9fafb; color: #263238 !important; border-color: rgba(38,50,56,.16); }
.skin-blue-light .sys-timesheet-side-close,
.skin-sysimple-soft .sys-timesheet-side-close { color: #263238 !important; }
.skin-blue-light .sys-timesheet-panel-close-corner,
.skin-sysimple-soft .sys-timesheet-panel-close-corner { background: #ffffff; color: #263238; border-color: rgba(38,50,56,.22); }
@media (max-width: 1100px) {
    .sys-timesheet-kpis,
    .sys-timesheet-entry-grid,
    .sys-timesheet-period-form,
    .sys-timesheet-config-grid,
    .sys-timesheet-payroll-grid,
    .sys-timesheet-payroll-detail-grid { grid-template-columns: minmax(0, 1fr); }
    .sys-timesheets-module .sysdash-commandbar { align-items: stretch; flex-direction: column; }
    .sys-timesheets-module .sysdash-actions { justify-content: flex-start; overflow-x: auto; }
}

@media (max-width: 860px) {
    .sys-timesheet-panel .sysdash-widget-body > .sys-timesheet-payroll-table,
    .sys-timesheet-panel .sys-timesheet-payroll-table { min-width: 0; }
    .sys-timesheet-payroll-table thead { display: none; }
    .sys-timesheet-payroll-table,
    .sys-timesheet-payroll-table tbody,
    .sys-timesheet-payroll-table tr,
    .sys-timesheet-payroll-table td { display: block; width: 100% !important; }
    .sys-timesheet-payroll-table tr { border-bottom: 1px solid var(--sysdash-line); padding: 8px 0; }
    .sys-timesheet-payroll-table td { display: grid; grid-template-columns: 98px minmax(0, 1fr); gap: 8px; align-items: start; border-bottom: 0; padding: 5px 0; white-space: normal; }
    .sys-timesheet-payroll-table td::before { content: attr(data-label); color: var(--sysdash-muted); font-size: 10px; font-weight: 900; text-transform: uppercase; }
    .sys-timesheet-payroll-table td[data-label="Action"] .sysdash-primary-btn { width: 100%; justify-content: center; }
}

#sysTimesheetsApp .sys-timesheet-panel .sysdash-widget-body {
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-x: contain;
}

#sysTimesheetsApp [data-timesheet-panel="entry"] .sysdash-widget-body {
    overflow-x: auto;
}

#sysTimesheetsApp [data-timesheet-panel="entry"] .sys-timesheet-table {
    width: 100%;
    min-width: 780px;
    max-width: none;
    table-layout: fixed;
}

#sysTimesheetsApp [data-timesheet-panel="entry"] .sys-timesheet-table th,
#sysTimesheetsApp [data-timesheet-panel="entry"] .sys-timesheet-table td {
    white-space: normal;
}

#sysTimesheetsApp [data-timesheet-panel="entry"] .sys-timesheet-table th:nth-child(1),
#sysTimesheetsApp [data-timesheet-panel="entry"] .sys-timesheet-table td:nth-child(1) {
    width: 190px;
}

#sysTimesheetsApp [data-timesheet-panel="entry"] .sys-timesheet-table th:last-child,
#sysTimesheetsApp [data-timesheet-panel="entry"] .sys-timesheet-table td:last-child {
    width: 62px;
}

#sysTimesheetsApp .sys-timesheet-day-head {
    width: 66px;
    min-width: 66px;
    overflow: hidden;
}

#sysTimesheetsApp .sys-timesheet-day-head span {
    white-space: normal;
    overflow-wrap: anywhere;
}

#sysTimesheetsApp .sys-timesheet-entry-actions .sys-timesheet-side-toggle {
    flex: 0 0 32px;
    width: 32px;
    min-width: 32px;
    padding: 0;
}

@media (max-width: 1320px) {
    #sysTimesheetsApp .sys-timesheet-entry-actions {
        justify-content: flex-start;
    }

    #sysTimesheetsApp .sys-timesheet-entry-actions .sysdash-primary-btn,
    #sysTimesheetsApp .sys-timesheet-entry-actions .sys-timesheet-add-line-btn,
    #sysTimesheetsApp .sys-timesheet-entry-actions [data-timesheet-recall] {
        min-width: 0;
        padding: 0 9px;
    }

    #sysTimesheetsApp .sys-timesheet-payroll-table th:nth-child(1),
    #sysTimesheetsApp .sys-timesheet-payroll-table td:nth-child(1) { width: 220px; }
    #sysTimesheetsApp .sys-timesheet-payroll-table th:nth-child(2),
    #sysTimesheetsApp .sys-timesheet-payroll-table td:nth-child(2) { width: 132px; }
    #sysTimesheetsApp .sys-timesheet-payroll-table th:nth-child(5),
    #sysTimesheetsApp .sys-timesheet-payroll-table td:nth-child(5) { width: 146px; }
    #sysTimesheetsApp .sys-timesheet-payroll-table th:nth-child(7),
    #sysTimesheetsApp .sys-timesheet-payroll-table td:nth-child(7) { width: 132px; }
    #sysTimesheetsApp .sys-timesheet-payroll-table th:nth-child(8),
    #sysTimesheetsApp .sys-timesheet-payroll-table td:nth-child(8) { width: 146px; }
}

@media (max-width: 1400px) {
    #sysTimesheetsApp .sys-timesheet-payroll-detail-grid {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 1180px) {
    #sysTimesheetsApp .sys-timesheet-panel .sys-timesheet-payroll-table,
    #sysTimesheetsApp .sys-timesheet-panel .sys-timesheet-payroll-secondary-table,
    #sysTimesheetsApp .sys-timesheet-panel .sys-timesheet-approval-table {
        min-width: 0;
    }

    #sysTimesheetsApp .sys-timesheet-approval-table thead,
    #sysTimesheetsApp .sys-timesheet-payroll-secondary-table thead,
    #sysTimesheetsApp .sys-timesheet-payroll-table thead {
        display: none;
    }

    #sysTimesheetsApp .sys-timesheet-approval-table,
    #sysTimesheetsApp .sys-timesheet-approval-table tbody,
    #sysTimesheetsApp .sys-timesheet-approval-table tr,
    #sysTimesheetsApp .sys-timesheet-approval-table td,
    #sysTimesheetsApp .sys-timesheet-payroll-secondary-table,
    #sysTimesheetsApp .sys-timesheet-payroll-secondary-table tbody,
    #sysTimesheetsApp .sys-timesheet-payroll-secondary-table tr,
    #sysTimesheetsApp .sys-timesheet-payroll-secondary-table td,
    #sysTimesheetsApp .sys-timesheet-payroll-table,
    #sysTimesheetsApp .sys-timesheet-payroll-table tbody,
    #sysTimesheetsApp .sys-timesheet-payroll-table tr,
    #sysTimesheetsApp .sys-timesheet-payroll-table td {
        display: block;
        width: 100% !important;
    }

    #sysTimesheetsApp .sys-timesheet-approval-table tr,
    #sysTimesheetsApp .sys-timesheet-payroll-secondary-table tr,
    #sysTimesheetsApp .sys-timesheet-payroll-table tr {
        border-bottom: 1px solid var(--sysdash-line);
        padding: 9px 0;
    }

    #sysTimesheetsApp .sys-timesheet-approval-table td,
    #sysTimesheetsApp .sys-timesheet-payroll-secondary-table td,
    #sysTimesheetsApp .sys-timesheet-payroll-table td {
        display: grid;
        grid-template-columns: 112px minmax(0, 1fr);
        gap: 8px;
        align-items: start;
        border-bottom: 0;
        padding: 5px 0;
        white-space: normal;
    }

    #sysTimesheetsApp .sys-timesheet-approval-table td::before,
    #sysTimesheetsApp .sys-timesheet-payroll-secondary-table td::before,
    #sysTimesheetsApp .sys-timesheet-payroll-table td::before {
        content: attr(data-label);
        color: var(--sysdash-muted);
        font-size: 10px;
        font-weight: 900;
        text-transform: uppercase;
    }

    #sysTimesheetsApp .sys-timesheet-approval-table td[data-label="Action"] .sysdash-primary-btn,
    #sysTimesheetsApp .sys-timesheet-payroll-table td[data-label="Action"] .sysdash-primary-btn {
        width: 100%;
        justify-content: center;
    }
}

@media (max-width: 760px) {
    #sysTimesheetsApp [data-timesheet-panel="entry"] .sys-timesheet-table,
    #sysTimesheetsApp [data-timesheet-panel="entry"] .sys-timesheet-table tbody,
    #sysTimesheetsApp [data-timesheet-panel="entry"] .sys-timesheet-table tr,
    #sysTimesheetsApp [data-timesheet-panel="entry"] .sys-timesheet-table td {
        display: block;
        width: 100% !important;
        min-width: 0;
    }

    #sysTimesheetsApp [data-timesheet-panel="entry"] .sys-timesheet-table {
        min-width: 0;
    }

    #sysTimesheetsApp [data-timesheet-panel="entry"] .sys-timesheet-table thead {
        display: none;
    }

    #sysTimesheetsApp [data-timesheet-panel="entry"] .sys-timesheet-hours-row {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 7px;
        padding: 10px 0 0;
        border-top: 1px solid var(--sysdash-line);
    }

    #sysTimesheetsApp [data-timesheet-panel="entry"] .sys-timesheet-hours-row td {
        display: grid;
        grid-template-columns: 82px minmax(0, 1fr);
        gap: 7px;
        align-items: center;
        border-bottom: 0;
        padding: 0;
    }

    #sysTimesheetsApp [data-timesheet-panel="entry"] .sys-timesheet-hours-row td::before,
    #sysTimesheetsApp [data-timesheet-panel="entry"] .sys-timesheet-description-row td[data-label]::before {
        content: attr(data-label);
        color: var(--sysdash-muted);
        font-size: 10px;
        font-weight: 900;
        text-transform: uppercase;
    }

    #sysTimesheetsApp [data-timesheet-panel="entry"] .sys-timesheet-assignment-cell {
        grid-column: 1 / -1;
    }

    #sysTimesheetsApp [data-timesheet-panel="entry"] .sys-timesheet-description-row {
        display: block;
        padding: 7px 0 12px;
    }

    #sysTimesheetsApp [data-timesheet-panel="entry"] .sys-timesheet-description-row td:first-child {
        display: none;
    }

    #sysTimesheetsApp [data-timesheet-panel="entry"] .sys-timesheet-description-row td[data-label] {
        display: grid;
        grid-template-columns: 82px minmax(0, 1fr);
        gap: 7px;
        align-items: start;
        border-bottom: 0;
        padding: 0;
    }

    #sysTimesheetsApp [data-timesheet-panel="entry"] .sys-timesheet-table tfoot,
    #sysTimesheetsApp [data-timesheet-panel="entry"] .sys-timesheet-table tfoot tr,
    #sysTimesheetsApp [data-timesheet-panel="entry"] .sys-timesheet-table tfoot td {
        display: block;
        width: 100% !important;
    }

    #sysTimesheetsApp [data-timesheet-panel="entry"] .sys-timesheet-table tfoot td:not(:first-child):not(:last-child) {
        display: none;
    }

    #sysTimesheetsApp [data-timesheet-panel="entry"] .sys-timesheet-table tfoot tr {
        display: grid;
        grid-template-columns: 82px minmax(0, 1fr);
        align-items: center;
        gap: 7px;
        padding: 8px 0;
    }
}
/* Compact workspace aligned with the operational dashboard. */
#sysTimesheetsApp .sysdash-shell{padding:14px;gap:14px}
#sysTimesheetsApp .sysdash-commandbar{padding:10px 14px;border:1px solid var(--sysdash-line);background:var(--sysdash-surface);border-radius:3px;gap:14px;flex-wrap:wrap}
#sysTimesheetsApp .sysdash-commandbar .sysdash-brand{display:flex!important}
#sysTimesheetsApp .sysdash-brand h1{font-size:18px;font-weight:600}
#sysTimesheetsApp .sysdash-brand p{font-size:12px}
#sysTimesheetsApp .sys-timesheet-kpis{display:flex;flex-wrap:wrap;gap:12px;margin:0}
#sysTimesheetsApp .sys-timesheet-kpi{flex:1 1 220px;max-width:none;border:1px solid var(--sysdash-line);border-top:3px solid var(--sysdash-accent);border-radius:3px;box-shadow:none}
#sysTimesheetsApp .sys-timesheet-kpi .sysdash-widget-body{padding:12px 14px}
#sysTimesheetsApp .sys-timesheet-kpi strong{font-size:21px;font-weight:600;line-height:1.5}
#sysTimesheetsApp .sys-timesheet-kpi small{font-size:12px}
#sysTimesheetsApp .sysdash-canvas,#sysTimesheetsApp .sysdash-widget{border-radius:3px;box-shadow:0 2px 6px #00000008}
#sysTimesheetsApp .sysdash-canvas-head{display:flex;flex-direction:row;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:14px;padding:14px;border-bottom:1px solid var(--sysdash-line);background:var(--sysdash-surface-2)}
#sysTimesheetsApp .sysdash-canvas-head h2{font-size:18px;font-weight:600;margin:3px 0}
#sysTimesheetsApp .sysdash-canvas-head p{font-size:12px;line-height:1.5}
#sysTimesheetsApp .sysdash-status{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
#sysTimesheetsApp .sysdash-widget-head{padding:10px 14px;gap:12px;flex-wrap:wrap}
#sysTimesheetsApp .sysdash-widget-title,#sysTimesheetsApp button{font-weight:600}
#sysTimesheetsApp button{min-height:34px;border-radius:3px}
#sysTimesheetsApp [data-timesheet-new-period]{width:auto;flex:0 0 auto;background:var(--sysdash-accent);border-color:var(--sysdash-accent);padding:8px 14px}
#sysTimesheetsApp [data-timesheet-save]{background:var(--sysdash-accent-soft);color:var(--sysdash-accent);border:1px solid var(--sysdash-accent)}
#sysTimesheetsApp [data-timesheet-submit]{background:var(--sysdash-accent-2);border-color:var(--sysdash-accent-2);color:#fff}
#sysTimesheetsApp :is(input,select,textarea){font-family:inherit;font-size:13px;border-radius:3px;box-sizing:border-box}
#sysTimesheetsApp .sys-timesheet-description-row textarea{height:48px;min-height:48px;resize:vertical;font-family:inherit;font-size:13px;line-height:1.5;padding:8px 10px}
#sysTimesheetsApp .sys-timesheet-table th{font-weight:600;padding:10px 8px}
#sysTimesheetsApp .sys-timesheet-table td{padding:8px}
#sysTimesheetsApp .sys-timesheet-table input[type=number]{text-align:center;font-variant-numeric:tabular-nums}
#sysTimesheetsApp .sys-timesheet-grid-feedback:not(:has([data-timesheet-save-status]:not(:empty))):not(:has([data-timesheet-submit-note]:not([hidden]))){display:none}
#sysTimesheetsApp .sys-timesheet-period-form{padding:14px;gap:12px;background:var(--sysdash-surface);border-bottom:1px solid var(--sysdash-line);align-items:end}
#sysTimesheetsApp .sys-timesheet-status{border:0;background:transparent;font-weight:600}
@media(max-width:700px){#sysTimesheetsApp .sysdash-shell{padding:8px;gap:10px}#sysTimesheetsApp .sysdash-actions,#sysTimesheetsApp .sysdash-segment{flex-wrap:wrap}#sysTimesheetsApp .sys-timesheet-entry-actions{gap:6px;flex-wrap:wrap}#sysTimesheetsApp .sysdash-canvas-head{align-items:stretch}#sysTimesheetsApp .sys-timesheet-period-target{width:100%;min-width:0}#sysTimesheetsApp .sys-timesheet-period-target select{min-width:0;width:100%}}
body #sysTimesheetsApp [data-timesheet-save]{background:var(--sysdash-accent-soft)!important;color:var(--sysdash-accent)!important;border-color:var(--sysdash-accent)!important}
body #sysTimesheetsApp [data-timesheet-submit]{background:var(--sysdash-accent-2)!important;color:#fff!important;border-color:var(--sysdash-accent-2)!important}
/* Keep the module identity at the start, independent of the shared shell alignment. */
body #sysTimesheetsApp .sysdash-commandbar{justify-content:space-between;align-items:center}
body #sysTimesheetsApp .sysdash-commandbar>.sysdash-brand{margin:0 auto 0 0;text-align:left;flex:0 1 auto}
body #sysTimesheetsApp .sysdash-commandbar>.sysdash-actions{margin-left:auto}
/* Context takes its own column instead of covering the save/submit commands. */
#sysTimesheetsApp:not(.is-side-collapsed) .sys-timesheet-entry-grid{grid-template-columns:minmax(0,1fr) 286px;align-items:start;gap:14px}
#sysTimesheetsApp .sys-timesheet-context-panel{position:relative;top:auto;right:auto;width:100%;max-height:none;transform:none;z-index:auto;box-shadow:none;transition:none}
#sysTimesheetsApp .sys-timesheet-context-panel>.sysdash-widget-body{max-height:none}
#sysTimesheetsApp.is-side-collapsed .sys-timesheet-context-panel{display:none}
#sysTimesheetsApp .sys-timesheet-drawer-grip{display:none}
#sysTimesheetsApp .sys-timesheet-context-panel>.sysdash-widget-head{padding-right:44px}
#sysTimesheetsApp .sys-timesheet-entry-actions{flex-wrap:wrap;justify-content:flex-end}
@media(max-width:1100px){#sysTimesheetsApp:not(.is-side-collapsed) .sys-timesheet-entry-grid{grid-template-columns:minmax(0,1fr)}#sysTimesheetsApp .sys-timesheet-context-panel{grid-row:2}}
@media(max-width:700px){body #sysTimesheetsApp .sysdash-commandbar{align-items:stretch}body #sysTimesheetsApp .sysdash-commandbar>.sysdash-actions{margin-left:0;justify-content:flex-start}}

/* Settings: themed sections and naturally sized controls. */
.sys-timesheet-settings-sections{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;padding:14px;align-items:start}
.sys-timesheet-settings-card{min-width:0;border:1px solid var(--sysdash-line);border-top:3px solid var(--sysdash-accent);background:var(--sysdash-surface)}
.sys-timesheet-settings-card:nth-child(5),.sys-timesheet-settings-card:nth-child(6){border-top-color:var(--sysdash-accent-2)}
.sys-timesheet-settings-card>header{display:flex;gap:10px;align-items:flex-start;padding:14px;border-bottom:1px solid var(--sysdash-line);background:var(--sysdash-surface-2)}
.sys-timesheet-settings-icon{display:grid;place-items:center;width:34px;height:34px;flex-shrink:0;background:var(--sysdash-accent-soft);color:var(--sysdash-accent);font-size:17px}
.sys-timesheet-settings-card h3{margin:0 0 4px;font-size:15px;color:var(--sysdash-text);font-weight:700}
.sys-timesheet-settings-card header p{margin:0;font-size:12px;line-height:1.5;color:var(--sysdash-muted)}
.sys-timesheet-settings-card .sys-timesheet-config-grid{padding:14px;gap:12px;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
.sys-timesheet-settings-card .sys-timesheet-config-grid label{min-width:0;align-content:start;font-size:12px;font-weight:500;text-transform:none;color:var(--sysdash-text);line-height:1.5}
.sys-timesheet-settings-card .is-wide{grid-column:1/-1}
.sys-timesheet-settings-card .sys-timesheet-config-grid input,.sys-timesheet-settings-card .sys-timesheet-config-grid select{height:36px;min-height:36px;box-sizing:border-box;align-self:start}
.sys-timesheet-settings-card .sys-timesheet-config-grid textarea{min-height:90px;box-sizing:border-box}
@media(max-width:1100px){.sys-timesheet-settings-sections{grid-template-columns:minmax(0,1fr)}}
@media(max-width:600px){.sys-timesheet-settings-card .sys-timesheet-config-grid{grid-template-columns:minmax(0,1fr)}.sys-timesheet-settings-sections{padding:8px;gap:10px}}

/* Work configurations share the operational dashboard's theme. */
.sys-timesheets-module .sys-timesheet-context-bar { display:flex; flex-wrap:wrap; align-items:center; gap:14px; padding:14px; margin-bottom:14px; background:var(--sysdash-surface); border:1px solid var(--sysdash-line); border-left:3px solid var(--sysdash-accent); }
.sys-timesheets-module .sys-timesheet-context-bar label { display:grid; gap:6px; min-width:240px; font-weight:600; }
.sys-timesheets-module .sys-timesheet-context-bar p { margin:4px 0; color:var(--sysdash-muted); }
.sys-timesheets-module .sys-timesheet-context-bar [role=status] { color:var(--sysdash-warning); }
.sys-timesheets-module .sys-timesheet-context-bar details { margin-left:auto; max-width:360px; }
.sys-timesheets-module .sys-timesheet-context-bar small, .sys-timesheet-source-picker small { display:block; margin-top:8px; color:var(--sysdash-muted); }
.sys-timesheets-module .sys-timesheet-context-bar select, .sys-timesheets-module .sys-timesheet-context-bar input { min-height:36px; width:100%; padding:6px 10px; color:var(--sysdash-text); background:var(--sysdash-surface); border:1px solid var(--sysdash-line); }
.sys-timesheets-module .sys-timesheet-source-picker { padding:10px; background:var(--sysdash-surface-2); border:1px solid var(--sysdash-line); }
.sys-timesheets-module .sys-timesheet-source-picker details { margin-top:10px; }
.sys-timesheets-module summary { cursor:pointer; }
@media(max-width:600px) { .sys-timesheets-module .sys-timesheet-context-bar > *, .sys-timesheets-module .sys-timesheet-context-bar details { width:100%; min-width:0; margin-left:0; } }

.sys-timesheet-workdays{display:flex;flex-wrap:wrap;gap:12px;border:1px solid var(--sysdash-line);padding:12px}.sys-timesheet-config-grid .sys-timesheet-workdays label{display:flex;align-items:center;gap:6px}.sys-timesheet-config-grid .sys-timesheet-workdays input{width:16px;min-height:16px;height:16px}

/* The period is a labelled field, not a badge nested around another box. */
#sysTimesheetsApp .sys-timesheet-entry-context { display:flex; align-items:flex-end; gap:12px; }
#sysTimesheetsApp .sys-timesheet-period-target { display:flex; flex-direction:column; align-items:stretch; gap:6px; width:360px; max-width:100%; min-width:0; padding:0; border:0; background:transparent; text-transform:none; font-size:12px; }
#sysTimesheetsApp .sys-timesheet-period-target > span { color:var(--sysdash-muted-strong); line-height:18px; border:0; padding:0; background:transparent; text-transform:none; }
#sysTimesheetsApp .sys-timesheet-period-target i { color:var(--sysdash-accent); margin-right:4px; }
#sysTimesheetsApp .sys-timesheet-period-target select { box-sizing:border-box; width:100%; min-width:0; max-width:none; min-height:36px; padding:7px 32px 7px 10px; border:1px solid var(--sysdash-line-strong); border-radius:4px; background:var(--sysdash-surface); color:var(--sysdash-text); font:inherit; }
#sysTimesheetsApp .sys-timesheet-period-target select:focus-visible { outline:2px solid var(--sysdash-accent); outline-offset:2px; }
#sysTimesheetsApp .sys-timesheet-entry-context > [data-timesheet-period-state] { min-height:36px; display:inline-flex; align-items:center; text-transform:none; font-size:12px; }
#sysTimesheetsApp .sys-timesheet-entry-context > .sys-timesheet-user-target { min-height:36px; box-sizing:border-box; }
@media(max-width:700px) { #sysTimesheetsApp .sys-timesheet-entry-context { width:100%; } #sysTimesheetsApp .sys-timesheet-period-target { width:100%; flex-basis:100%; } }

#sysTimesheetsApp .sys-timesheet-setup-flow { padding:14px; display:grid; gap:16px; }
#sysTimesheetsApp .sys-timesheet-setup-step { min-width:0; margin:0; padding:12px; border:1px solid var(--sysdash-line); border-left:3px solid var(--sysdash-accent); background:var(--sysdash-surface); }
#sysTimesheetsApp .sys-timesheet-setup-step legend { width:auto; margin:0; padding:0 6px; border:0; font-size:13px; font-weight:700; color:var(--sysdash-text); }
#sysTimesheetsApp .sys-timesheet-setup-step > p { margin:0 0 10px; color:var(--sysdash-muted); font-size:12px; }
#sysTimesheetsApp .sys-timesheet-setup-step .sys-timesheet-config-grid { padding:0; }
#sysTimesheetsApp .sys-timesheet-setup-step .sys-timesheet-source-picker { padding:0; border:0; background:transparent; }
#sysTimesheetsApp .sys-timesheet-prerequisite { display:block; margin-top:6px; color:var(--sysdash-muted); font-size:12px; font-weight:400; }
#sysTimesheetsApp .sys-timesheet-prerequisite:empty { display:none; }

/* Parent mapping is shown only for inherited task approval. */
[data-timesheets-root] [data-parent-review][hidden] { display: none !important; }

/* Keep selection visible despite shared shell button/theme overrides. */
#sysTimesheetsApp [data-timesheet-tabs] [data-timesheet-tab][aria-selected="true"] {
    background: #236f9c !important;
    border-color: #236f9c !important;
    color: #fff !important;
    box-shadow: inset 0 -3px 0 rgba(255,255,255,.7) !important;
    font-weight: 700;
}
#sysTimesheetsApp [data-timesheet-tabs] [data-timesheet-tab][aria-selected="true"] i { color: #fff !important; }
#sysTimesheetsApp [data-timesheet-tab]:focus-visible { outline: 2px solid var(--sysdash-accent); outline-offset: 3px; }
#sysTimesheetsApp .sys-timesheet-section-guide { display: flex; flex-wrap: wrap; align-items: baseline; gap: 5px 10px; padding: 9px 12px; border-left: 3px solid var(--sysdash-accent); background: var(--sysdash-surface-2); color: var(--sysdash-text); }
#sysTimesheetsApp .sys-timesheet-section-guide > span:first-child { color: var(--sysdash-muted); font-size: 11px; }
#sysTimesheetsApp .sys-timesheet-section-guide[hidden] { display: none !important; }
