
/* ===== NAV PROJECT FILTER ===== */
/* ===== NAV PROJECT FILTER ===== */
.nav-filter-btn{display:flex;align-items:center;gap:5px;background:transparent;border:none;color:var(--muted);font-size:11px;cursor:pointer;padding:2px 4px;border-radius:4px;transition:all var(--transition);font-family:'DM Sans',sans-serif;}
.nav-filter-btn:hover{color:var(--amber);}
.nav-filter-btn.active{color:var(--amber);}
.nav-filter-panel{background:var(--surface2);border:1px solid var(--border);border-radius:8px;padding:10px;margin:6px 0 4px;display:none;}
.nav-filter-panel.open{display:block;}
.nav-filter-group{margin-bottom:8px;}
.nav-filter-group-label{font-size:9px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:var(--muted);margin-bottom:5px;}
.nav-filter-chips{display:flex;flex-wrap:wrap;gap:4px;}
.nav-filter-chip{font-size:10.5px;padding:2px 8px;border-radius:10px;border:1px solid var(--border);color:var(--muted);cursor:pointer;transition:all var(--transition);background:transparent;font-family:'DM Sans',sans-serif;}
.nav-filter-chip:hover{border-color:var(--amber-dim);color:var(--amber);}
.nav-filter-chip.sel{background:var(--amber-glow);border-color:var(--amber-dim);color:var(--amber);}
.nav-filter-actions{display:flex;gap:6px;margin-top:8px;padding-top:8px;border-top:1px solid var(--border);}
.nav-filter-save{flex:1;font-size:10.5px;padding:4px 0;border-radius:5px;border:1px solid var(--amber-dim);background:var(--amber-glow);color:var(--amber);cursor:pointer;font-family:'DM Sans',sans-serif;transition:all var(--transition);}
.nav-filter-save:hover{background:var(--amber-dim);}
.nav-filter-clear{font-size:10.5px;padding:4px 8px;border-radius:5px;border:1px solid var(--border);background:transparent;color:var(--muted);cursor:pointer;font-family:'DM Sans',sans-serif;transition:all var(--transition);}
.nav-filter-clear:hover{color:var(--text);}
.nav-filter-active-dot{width:6px;height:6px;border-radius:50%;background:var(--amber);display:inline-block;margin-left:2px;}


/* ===== FREEZE PANE LAYOUT ===== */
#panel-projects.active{display:flex !important;flex-direction:column !important;overflow:hidden !important;}
.projtbl-wrap{display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden;width:100%;box-sizing:border-box;}
.projtbl-sticky-header{flex-shrink:0;padding:20px 32px 14px;background:var(--bg);border-bottom:1.5px solid var(--border);}
.projtbl-scroll-body{flex:1;min-height:0;overflow-y:auto;overflow-x:auto;padding:0 32px 32px;}
.projtbl-scroll-body::-webkit-scrollbar{width:10px;height:10px;}
.projtbl-scroll-body::-webkit-scrollbar-track{background:var(--surface2);border-radius:6px;}
.projtbl-scroll-body::-webkit-scrollbar-thumb{background:var(--amber-dim);border-radius:6px;border:2px solid var(--surface2);}
.projtbl-scroll-body::-webkit-scrollbar-thumb:hover{background:var(--amber);}
.projtbl-table thead{position:sticky;top:0;z-index:5;}
.projtbl-table thead tr{background:var(--surface2);border-bottom:2px solid var(--border);}
.projtbl-table th{padding:10px 14px;font-size:10px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--muted);text-align:left;white-space:nowrap;background:var(--surface2);}

/* ===== PROJECTS TABLE ===== */
/* ===== PROJECTS TABLE ===== */
.projtbl-toolbar{display:flex;align-items:center;gap:12px;margin-bottom:10px;flex-wrap:wrap;min-width:0;}
.projtbl-wrap{display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden;width:100%;box-sizing:border-box;}
.projtbl-title{font-family:'DM Serif Display',serif;font-size:22px;color:var(--text);}
.projtbl-sub{font-size:12px;color:var(--muted);margin-top:2px;}
.projtbl-table{width:100%;min-width:900px;border-collapse:collapse;background:var(--surface);border:1px solid var(--border);border-radius:10px;}
.projtbl-table thead tr{background:var(--surface2);border-bottom:2px solid var(--border);}
.projtbl-table th{padding:10px 14px;font-size:10px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--muted);text-align:left;white-space:nowrap;}
.projtbl-table td{padding:11px 14px;font-size:13px;color:var(--text);border-bottom:1px solid var(--border);vertical-align:middle;}
.projtbl-table tbody tr:last-child td{border-bottom:none;}
.projtbl-table tbody tr{transition:background var(--transition);cursor:pointer;}
.projtbl-table tbody tr:hover{background:var(--surface2);}
.projtbl-proj-name{color:var(--amber);font-weight:600;text-decoration:none;display:flex;align-items:center;gap:8px;}
.projtbl-proj-name:hover{text-decoration:underline;}
.projtbl-proj-emoji{font-size:16px;line-height:1;}
.projtbl-status{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;border-radius:12px;font-size:11px;font-weight:600;}
.projtbl-empty{text-align:center;padding:48px 24px;color:var(--muted);font-size:13px;}
.projtbl-amount{font-family:'JetBrains Mono',monospace;font-size:12px;}
/* Sortable headers */
.projtbl-table th.sortable{cursor:pointer;user-select:none;}
.projtbl-table th.sortable:hover{color:var(--text);}
.sort-icon{margin-left:4px;font-size:9px;opacity:.4;}
.sort-icon.active{opacity:1;color:var(--amber);}
/* Filter drawer */
.proj-filter-drawer{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:18px 20px;margin-bottom:14px;display:none;}
.proj-filter-drawer.open{display:block;}
.proj-filter-row{display:flex;gap:16px;flex-wrap:wrap;align-items:flex-start;margin-bottom:14px;}
.proj-filter-col{display:flex;flex-direction:column;gap:6px;}
.proj-filter-col label{font-size:10px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--muted);}
.proj-filter-col input[type=text]{background:var(--surface2);border:1.5px solid var(--border);border-radius:7px;color:var(--text);font-family:'DM Sans',sans-serif;font-size:13px;padding:6px 10px;outline:none;width:220px;transition:border-color var(--transition);}
.proj-filter-col input[type=text]:focus{border-color:var(--amber-dim);box-shadow:0 0 0 3px var(--amber-glow);}
/* Saved filters bar */
.saved-filters-bar{display:flex;align-items:center;gap:6px;margin-bottom:14px;flex-wrap:wrap;}
.saved-filter-chip{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:20px;font-size:11.5px;font-weight:600;background:var(--surface2);border:1.5px solid var(--border);color:var(--muted);cursor:pointer;transition:all var(--transition);font-family:'DM Sans',sans-serif;}
.saved-filter-chip:hover{border-color:var(--amber-dim);color:var(--amber);}
.saved-filter-chip.active{background:var(--amber-glow);border-color:var(--amber-dim);color:var(--amber);}
.saved-filter-chip .sf-del{font-size:11px;opacity:.5;margin-left:2px;}
.saved-filter-chip .sf-del:hover{opacity:1;color:var(--red);}


/* Per-column filter row */
.proj-col-filter-row th { background: var(--surface2); border-bottom: 1px solid var(--border); }
.proj-col-filter-input {
  width: 100%;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 4px;
  color: var(--text);
  font-size: 11px;
  padding: 3px 6px;
  font-family: 'DM Sans', sans-serif;
  outline: none;
  transition: border-color .15s, background .15s;
}
.proj-col-filter-input:focus { border-color: var(--amber-dim); }
.proj-col-filter-input::placeholder { color: var(--muted); opacity: 0.5; }

/* Column filter wrapper — hosts input + clear (×) button */
.proj-col-filter-wrap { position: relative; display: block; width: 100%; }
.proj-col-filter-wrap .proj-col-filter-input { padding-right: 20px; }
.proj-col-filter-clear {
  position: absolute;
  right: 2px;
  top: 50%;
  transform: translateY(-50%);
  width: 16px;
  height: 16px;
  padding: 0;
  display: none;               /* shown only when wrapper has data-filled */
  align-items: center;
  justify-content: center;
  background: transparent;
  border: none;
  color: var(--muted);
  font-size: 14px;
  line-height: 1;
  cursor: pointer;
  border-radius: 3px;
  font-family: inherit;
  transition: color .12s, background .12s;
}
.proj-col-filter-clear:hover { color: var(--text); background: var(--surface3, var(--surface2)); }
.proj-col-filter-wrap[data-filled] .proj-col-filter-clear { display: flex; }
