/* Contracts UI refinements */
.tabs { display: flex; gap: 8px; margin-bottom: 8px; }
.tabs .btn { border-radius: 8px; }
.form-row { display: flex; flex-direction: column; gap: 6px; margin-bottom: 10px; }
.form-row label { font-size: 13px; opacity: 0.85; }
.form input, .form select, .form textarea { padding: 8px 10px; border: 1px solid #d9dde5; border-radius: 8px; }
.form textarea { min-height: 160px; }

/* Sidebar submenu animation fix */
.submenu { transition: none !important; }
.menu-group .group-toggle { will-change: transform; }
.menu-group.open .group-toggle[aria-expanded="true"] { transform: none; }
/* Toolbar utilities */
.toolbar-right { display: flex; gap: 10px; justify-content: flex-end; align-items: center; margin-bottom: 16px; }
/* Bulk import section */
.bulk-wrap { margin-bottom: 18px; border: 1px solid var(--border-soft); border-radius: 8px; background: var(--bg-soft); }
.bulk-summary { padding: 12px 16px; cursor: pointer; font-weight: 600; font-size: 14px; color: var(--text); user-select: none; }
.bulk-summary:hover { background: var(--bg-alt); }
.bulk-box { padding: 16px; }
.bulk-textarea { width: 100%; min-height: 120px; padding: 10px; border: 1px solid var(--border); border-radius: 6px; font-family: monospace; font-size: 13px; resize: vertical; background: var(--bg-alt); color: var(--text); }
.bulk-textarea:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px rgba(102,126,234,.25); }
.bulk-actions { display: flex; gap: 12px; align-items: center; margin-top: 12px; }
.bulk-errors { list-style: none; margin-top: 12px; padding: 0; }
.bulk-errors li { padding: 6px 10px; background: var(--badge-rejected-bg); color: var(--badge-rejected-text); border-radius: 4px; font-size: 12px; margin-bottom: 6px; }
/* Utility classes for contracts module */
.filters { display: flex; gap: 12px; align-items: center; margin-bottom: 12px; }
.grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.mt-12 { margin-top: 12px; }
.w-full { width: 100%; }
.hidden { display: none; }
.tsv-info { font-size:12px; opacity:.85; }
.tsv-actions { display:flex; gap:12px; flex-wrap:wrap; }
.suggest-box{position:absolute;display:none;max-width:420px;z-index:10}
.suggest-item{padding:6px 8px;cursor:pointer;border-bottom:1px solid #eef0f5}
.divider{border:none;border-top:1px dashed #e5e8ef;margin:12px 0}
/* Clean light-only stylesheet */
* { margin:0; padding:0; box-sizing:border-box; }
:root {
  --bg:#f5f6fa;
  --bg-alt:#ffffff;
  --bg-soft:#fafbff;
  --text:#1f1f1f;
  --text-soft:#555;
  --accent:#667eea;
  --accent-hover:#764ba2;
  --accent-gradient:linear-gradient(135deg,#667eea 0%,#764ba2 100%);
  --panel-bg:#ffffff;
  --panel-shadow:0 2px 12px rgba(0,0,0,.08);
  --border:#e2e6ec;
  --border-soft:#eef0f5;
  --secondary:#f0f0f4;
  --secondary-hover:#e4e4e8;
  --danger:#f43f5e;
  /* Chart palette */
  --chart-blue:#667eea;
  --chart-purple:#764ba2;
  --chart-teal:#2dd4bf;
  --chart-amber:#f59e0b;
  --chart-rose:#f43f5e;
  --chart-slate:#64748b;
  --chart-green:#22c55e;
  --chart-fill-purple:rgba(118,75,162,.15);
  /* Status badge palette */
  --badge-pending-bg:#fff3cd; --badge-pending-text:#856404;
  --badge-approved-bg:#d4edda; --badge-approved-text:#155724;
  --badge-rejected-bg:#f8d7da; --badge-rejected-text:#721c24;
  --badge-completed-bg:#d1ecf1; --badge-completed-text:#0c5460;
  --badge-processing-bg:#d1ecf1; --badge-processing-text:#0c5460;
  --badge-new-bg:#e2e3e5; --badge-new-text:#41464b;
  --badge-done-bg:#d4edda; --badge-done-text:#155724;
}
.panel-header { display: flex; justify-content: space-between; align-items: center; }
.profile { display: grid; grid-template-columns: 320px 1fr; gap: 16px; }
.profile-card { border: 1px solid #e5e8ef; border-radius: 12px; padding: 16px; background: #fff; }
.profile-content { border: 1px dashed #e5e8ef; border-radius: 12px; padding: 16px; background: #fafbff; }
.section-title { font-weight: 600; font-size: 18px; margin-bottom: 8px; }
.muted { color: #6b7280; }
.mt-12 { margin-top: 12px; }
.grid-1 { display: grid; grid-template-columns: 1fr; gap: 8px; }
.ml-auto { margin-left: auto; }
.max-w-720{max-width:720px}
body { font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif; background:var(--bg); color:var(--text); }
/* Layout */
.layout { display:flex; min-height:100vh; }
.sidebar { width:250px; background:var(--accent-gradient); color:#fff; padding:20px; position:fixed; top:0; bottom:0; overflow-y:auto; transition:transform .3s ease; }
.sidebar.hidden { transform:translateX(-100%); }
.sidebar h1 { font-size:22px; margin:0 0 18px; text-align:center; padding-bottom:14px; border-bottom:1px solid rgba(255,255,255,.3); }
.content { margin-left:250px; flex:1; padding:32px; transition:margin-left .3s ease; }
.sidebar.hidden + .content { margin-left:0; }
/* Panels */
.panel { background:var(--panel-bg); padding:26px 30px; border-radius:12px; box-shadow:var(--panel-shadow); border:1px solid var(--border-soft); }
.panel + .panel { margin-top:28px; }
/* Buttons */
.btn { display:inline-block; background:var(--accent); color:#fff; text-decoration:none; padding:10px 18px; border-radius:6px; font-size:14px; font-weight:600; transition:.25s; border:none; cursor:pointer; }
.btn:hover { background:var(--accent-hover); transform:translateY(-2px); box-shadow:0 4px 12px rgba(0,0,0,.25); }
.btn:active { transform:translateY(0); box-shadow:0 2px 6px rgba(0,0,0,.25); }
.btn.secondary { background:var(--secondary); color:var(--text); }
.btn.secondary:hover { background:var(--secondary-hover); }
.btn.danger { background:var(--danger); color:#fff; }
.btn.danger:hover { filter:brightness(1.1); }
.btn-outline { background:#fff; color:var(--accent); border:2px solid var(--accent); }
.btn-outline:hover { background:var(--accent); color:#fff; }
/* Inline table action buttons */
.table-actions a,
td.actions a { display:inline-block; background:var(--accent); color:#fff; text-decoration:none; padding:4px 10px; border-radius:5px; font-size:12px; font-weight:600; line-height:1.3; margin:0 6px 4px 0; transition:.2s; }
.table-actions a.secondary,
td.actions a.secondary { background:var(--secondary); color:var(--text); }
.table-actions a:hover,
td.actions a:hover { background:var(--accent-hover); transform:translateY(-1px); }
.table-actions a.secondary:hover,
td.actions a.secondary:hover { background:var(--secondary-hover); transform:none; }
.table-actions a:focus-visible,
td.actions a:focus-visible { outline:2px solid var(--accent-hover); outline-offset:2px; }
/* Employee action buttons (buttons instead of anchors) */
td.actions button { display:inline-block; background:var(--accent); color:#fff; border:none; padding:4px 10px; border-radius:5px; font-size:12px; font-weight:600; cursor:pointer; margin:0 6px 4px 0; transition:.2s; }
td.actions button.edit:hover { background:var(--accent-hover); }
td.actions button.delete { background:var(--danger); }
td.actions button.delete:hover { filter:brightness(1.1); }
td.actions button:focus-visible { outline:2px solid var(--accent-hover); outline-offset:2px; }
.btn:focus-visible, .group-toggle:focus-visible, .hamburger:focus-visible, .theme-toggle:focus-visible { outline:2px solid var(--accent-hover); outline-offset:2px; }
.table-responsive { width:100%; overflow-x:auto; }

/* Tables */
table { width:100%; border-collapse:collapse; }
th, td { border:1px solid var(--border); padding:8px 10px; font-size:13px; text-align:left; }
th { background:var(--bg-soft); font-weight:600; color:var(--text-soft); }
tr:hover { background:var(--bg-soft); }
/* theme-toggle removed in light-only mode */
code { background:var(--bg-soft); padding:2px 4px; border-radius:4px; font-size:12px; }

/* Form controls */
input[type=text],input[type=date],input[type=number],textarea,select{background:var(--bg-soft);border:1px solid var(--border);color:var(--text);border-radius:6px;padding:8px 10px;font-size:13px;transition:.2s}
textarea{resize:vertical}
input:focus,textarea:focus,select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(102,126,234,.25)}

/* Status badges unified */
.status, .status-badge {display:inline-block;padding:4px 10px;border-radius:12px;font-size:11px;font-weight:600;line-height:1.2;text-transform:capitalize}
.status.pending{background:var(--badge-pending-bg);color:var(--badge-pending-text)}
.status.approved{background:var(--badge-approved-bg);color:var(--badge-approved-text)}
.status.rejected{background:var(--badge-rejected-bg);color:var(--badge-rejected-text)}
.status.completed{background:var(--badge-completed-bg);color:var(--badge-completed-text)}
.status-badge.New{background:var(--badge-new-bg);color:var(--badge-new-text)}
.status-badge.Processing{background:var(--badge-processing-bg);color:var(--badge-processing-text)}
.status-badge.Done{background:var(--badge-done-bg);color:var(--badge-done-text)}

/* Progress components */
.progress-wrap{display:flex;align-items:center;gap:8px}
.progress-bar{height:8px;background:var(--bg-soft);border:1px solid var(--border-soft);border-radius:4px;flex:1;overflow:hidden}
.progress-bar span{display:block;height:100%;background:var(--accent)}
.progress-text{font-size:10px;color:var(--text-soft);min-width:42px;text-align:right}

/* Utility */
.table-gap{margin-top:10px}
.heading-gap{margin-bottom:14px}
.subtitle{color:var(--text-soft);margin-bottom:14px;font-size:13px;line-height:1.55}
.bulk-desc{font-size:12px;color:var(--text-soft);line-height:1.4;margin-bottom:8px}
.bulk-msg{font-size:12px;color:var(--text-soft)}
.success{color:var(--badge-approved-text)}
.error{color:var(--danger)}

/* Navigation Groups (Submenus) */
.nav-groups { list-style:none; }
.menu-group { margin-bottom:10px; }
.group-toggle { width:100%; background:rgba(255,255,255,.15); color:#fff; border:none; padding:9px 12px; text-align:left; font-size:13px; font-weight:600; border-radius:6px; cursor:pointer; display:flex; align-items:center; justify-content:space-between; }
.group-toggle:hover { background:rgba(255,255,255,.25); }
.group-toggle span { transition:transform .3s ease; }
.menu-group.open > .group-toggle span { transform:rotate(180deg); }
.submenu { list-style:none; margin-top:6px; padding-left:0; max-height:0; opacity:0; overflow:hidden; transition:max-height .35s ease, opacity .3s ease; }
.submenu.open { max-height:600px; opacity:1; }
.submenu li a { color:#fff; text-decoration:none; display:block; padding:9px 12px; border-radius:6px; font-size:13px; transition:.25s; }
.submenu li a:hover, .submenu li a.active { background:rgba(255,255,255,.3); }
.hamburger { position:fixed; top:10px; left:10px; z-index:999; background:var(--accent); color:#fff; border:none; padding:10px 13px; border-radius:6px; cursor:pointer; display:none; box-shadow:0 2px 8px rgba(0,0,0,.25); }
.hamburger:active { transform:scale(.95); }
.menu-section-title{display:none}

/* Reports Page Charts */
.charts-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px;margin-bottom:16px}
.charts-grid.four-cols{grid-template-columns:repeat(4,1fr);} /* force 4 columns */
.chart-card{background:var(--bg-soft);border:1px solid var(--border-soft);border-radius:10px;padding:12px;display:flex;flex-direction:column}
.chart-card h4{margin:0 0 8px;font-size:13px;color:var(--text-soft)}
.chart-holder{flex:1;min-height:150px;position:relative}
.chart-holder canvas{width:100%!important;height:100%!important}

/* Income Page */
.income-list{margin-top:14px;font-size:13px;line-height:1.6}
.income-note{margin-top:16px;font-size:12px;opacity:.55}

/* Payroll Create Batch */
.right-tools{text-align:right;margin-bottom:18px}
.page-title{margin-bottom:10px}
.preview-hidden{display:none}
.back-create{text-align:right;margin-bottom:16px}

/* Responsive */
@media (max-width:900px){
  .sidebar { transform:translateX(-100%); }
  .sidebar.visible { transform:translateX(0); }
  .content { margin-left:0; padding:20px 16px; }
  .hamburger { display:block; }
  .charts-grid{grid-template-columns:repeat(2,1fr);} /* medium: 2 columns */
}
@media (max-width:600px){
  .panel { padding:18px 20px; }
  th, td { font-size:12px; }
  .charts-grid{grid-template-columns:1fr;} /* small: 1 column */
  .chart-holder{min-height:180px}
}
@media (prefers-reduced-motion:reduce){
  .submenu { transition:none; }
  .group-toggle span { transition:none; }
}

/* Report & Charts specific (moved from inline) */
.header{background:var(--bg-alt);padding:22px 30px;border-radius:12px;margin-bottom:28px;box-shadow:var(--panel-shadow);border:1px solid var(--border-soft)}
.header h2{margin:0 0 6px;font-size:24px;color:var(--text)}
.header p{margin:0;color:var(--text-soft);font-size:13px}
.history-link{margin-top:-12px;margin-bottom:24px}
.filter-section{background:var(--bg-alt);padding:18px 24px;border-radius:12px;margin-bottom:22px;box-shadow:var(--panel-shadow);border:1px solid var(--border-soft);display:flex;gap:18px;align-items:flex-end;flex-wrap:wrap}
.filter-section label{font-size:13px;font-weight:600;color:var(--text-soft);display:block;margin-bottom:6px}
.filter-section select{padding:8px 10px;border:1px solid var(--border);background:var(--bg-soft);color:var(--text);border-radius:6px;font-size:14px;min-width:120px}
.filter-section button{padding:8px 14px;border:none;border-radius:6px;background:var(--accent);color:#fff;font-size:13px;font-weight:600;cursor:pointer;transition:.25s}
.filter-section button:hover{background:var(--accent-hover)}
.report-section{background:var(--bg-alt);padding:22px 26px;border-radius:12px;margin-bottom:26px;box-shadow:var(--panel-shadow);border:1px solid var(--border-soft)}
.report-section h3{margin:0 0 16px;font-size:18px;color:var(--text);border-bottom:2px solid var(--border-soft);padding-bottom:10px}
.report-title{margin-bottom:20px;font-size:18px;color:var(--text)}
.summary{background:var(--bg-soft);padding:14px;border-radius:10px;margin-top:14px;display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px}
.summary-item{text-align:center}
.summary-item .label{font-weight:600;color:var(--text-soft);font-size:11px;margin-bottom:4px}
.summary-item .value{font-size:20px;color:var(--accent);font-weight:700}
.empty-state{text-align:center;padding:26px;color:var(--text-soft);font-size:13px}
.text-right{text-align:right}
.flex-filter-form{display:flex;gap:16px;align-items:flex-end;flex-wrap:wrap}

/* Generic page header & info lines */
.header-bar{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px;flex-wrap:wrap;gap:14px}
.overall{font-size:12px;color:var(--text-soft)}
.history-filters{margin-bottom:22px}
.info-line{font-size:12px;color:var(--text-soft);margin-top:6px}
.meta{display:flex;gap:18px;flex-wrap:wrap;margin-bottom:16px}
.meta label{font-size:13px;font-weight:600;color:var(--text-soft);display:block;margin-bottom:6px}
.meta input{padding:10px 12px;border:1px solid var(--border);border-radius:6px;font-size:14px;min-width:240px;background:var(--bg-soft);color:var(--text)}
.meta input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(102,126,234,.25)}
.actions{display:flex;align-items:center;gap:16px;margin-top:14px;flex-wrap:wrap}
.actions .checkbox{display:flex;align-items:center;font-size:13px;color:var(--text);gap:6px}
.preview-title{font-size:15px;font-weight:600;color:var(--text);margin-bottom:8px}
#tsv{width:100%;height:190px;padding:12px;border:1px solid var(--border);border-radius:6px;font-family:monospace;font-size:13px;resize:vertical;background:var(--bg-soft);color:var(--text)}
#tsv:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(102,126,234,.25)}
.inline{display:flex;flex-wrap:wrap;gap:16px;background:var(--bg-soft);padding:14px 16px;border:1px solid var(--border-soft);border-radius:10px;margin-bottom:14px}
.inline label{font-size:12px;font-weight:600;color:var(--text-soft);display:block;margin-bottom:4px}
.inline input{padding:10px 12px;border:1px solid var(--border);border-radius:6px;font-size:14px;min-width:150px;background:var(--bg-alt);color:var(--text)}
.inline input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(102,126,234,.25)}
.inline button{background:var(--accent);color:#fff;border:none;padding:10px 18px;border-radius:6px;font-size:14px;font-weight:600;cursor:pointer;transition:.25s}
.inline button:hover{background:var(--accent-hover);transform:translateY(-2px)}
#editModal{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.45);display:none;align-items:center;justify-content:center;z-index:200}
#editModal .box{background:var(--bg-alt);padding:22px 24px;min-width:340px;border-radius:12px;box-shadow:0 4px 22px rgba(0,0,0,.35);border:1px solid var(--border-soft)}
#editModal h3{margin-bottom:12px;color:var(--text)}
#editModal label{display:block;font-size:12px;font-weight:600;color:var(--text-soft);margin-bottom:6px}
#editModal input{width:100%;padding:10px 12px;border:1px solid var(--border);border-radius:6px;margin-bottom:14px;font-size:14px;background:var(--bg-soft);color:var(--text)}
#editModal input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(102,126,234,.25)}
#editModal .btn-row{display:flex;gap:10px}
#editModal button{flex:1;background:var(--accent);color:#fff;border:none;padding:10px 16px;border-radius:6px;font-size:14px;font-weight:600;cursor:pointer;transition:.25s}
#editModal button:hover{background:var(--accent-hover)}
#cancelEdit{background:#999}
#cancelEdit:hover{background:#777}