/* OmniHub v3 self-hosted layout corrections. */
.audit-table .audit-col-time { width: 14%; }
.audit-table .audit-col-tenant { width: 12%; }
.audit-table .audit-col-user { width: 9%; }
.audit-table .audit-col-module { width: 7%; }
.audit-table .audit-col-action { width: 7%; }
.audit-table .audit-col-target { width: 17%; }
.audit-table .audit-col-status { width: 8%; }
.audit-table .audit-col-summary { width: 26%; }

.audit-table th,
.audit-table td {
  box-sizing: border-box;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
}

.audit-table .nowrap {
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.1px;
}

.audit-table th:nth-child(2),
.audit-table td:nth-child(2) {
  white-space: nowrap;
}

@media (max-width: 900px) {
  .audit-table {
    min-width: 1050px;
  }
}
/* Keep Payment History controls visible when restoring this sub-tab after F5. */
#tab-payments[data-pay-tab="hist"] > .page-hdr > .hdr-actions {
  display: flex !important;
}
#tab-payments[data-pay-tab="hist"] #pay-hdr-hist-actions {
  display: flex !important;
}

/* Overview grows with its data. A single vertical scroller prevents the
   Remember section and action rows from being clipped on desktop. */
#tab-overview {
  height: 100%;
  min-width: 0;
  min-height: 0;
  overflow: hidden !important;
}
#tab-overview > .page-body.pb-scroll {
  display: block;
  flex: 0 0 auto !important;
  height: calc(100vh - 54px) !important;
  max-height: calc(100vh - 54px) !important;
  min-height: 0;
  overflow-x: hidden !important;
  overflow-y: scroll !important;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  padding-bottom: 96px !important;
}
#tab-overview .ov-grid {
  height: auto !important;
  min-height: 0 !important;
  grid-template-rows: none !important;
  padding-bottom: 0 !important;
}
#tab-overview .ov-section {
  height: auto !important;
  min-width: 0;
}
#ov-action-center {
  min-width: 0;
}

/* Desktop overview: Action Center is a compact summary strip, not another
   full dashboard row. This keeps Remember Summary inside the first viewport. */
@media (min-width: 1400px) and (min-height: 800px) {
  #tab-overview > .page-body.pb-scroll {
    padding: 12px 18px 72px !important;
  }
  #tab-overview #ov-action-center .action-center {
    margin-bottom: 12px !important;
  }
  #tab-overview #ov-action-center .action-center-head {
    padding: 9px 14px !important;
  }
  #tab-overview #ov-action-center .action-center-head p {
    margin-top: 2px !important;
  }
  #tab-overview #ov-action-center .action-center-list {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    max-height: none !important;
  }
  #tab-overview #ov-action-center .action-item {
    min-height: 58px;
    padding: 8px 11px !important;
    border-right: 1px solid var(--brd);
  }
  #tab-overview #ov-action-center .action-item:last-child {
    border-right: 0;
  }
  #tab-overview .ov-grid {
    gap: 12px !important;
  }
  #tab-overview .ov-section {
    padding: 12px !important;
  }
  #tab-overview .ov-section-hdr {
    margin-bottom: 8px !important;
  }
}

@media (max-width: 767px) {
  #tab-overview > .page-body.pb-scroll {
    height: calc(100dvh - 54px) !important;
    max-height: calc(100dvh - 54px) !important;
    padding: 10px 10px 110px !important;
  }
  #tab-overview #ov-action-center .action-center-list {
    grid-template-columns: 1fr !important;
  }
  #tab-overview .ov-grid {
    display: block !important;
  }
  #tab-overview .ov-section {
    margin-bottom: 10px;
    overflow: hidden;
  }
  #tab-overview .ov-kpis,
  #tab-overview .ov-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .sch-layout {
    display: block !important;
    overflow-y: auto !important;
  }
  .sch-list-pane {
    width: 100% !important;
    max-height: 210px;
    border-right: 0 !important;
    border-bottom: 1px solid var(--brd);
  }
  .sch-hero {
    padding: 14px !important;
    align-items: flex-start !important;
  }
  .sch-title input {
    width: 100% !important;
    font-size: 18px !important;
  }
  .sch-kpis,
  .sch-fields {
    grid-template-columns: 1fr !important;
  }
  .sch-kpis > div,
  .sch-section {
    padding: 12px 14px !important;
  }
  .sch-actions {
    padding: 14px !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
  }
  .sch-actions > span {
    display: none;
  }
  .sch-actions .btn {
    width: 100%;
  }
  #tab-projects .proj-schedule-toolbar {
    flex-wrap: wrap;
    gap: 8px;
  }
  #tab-projects #proj-schedule-board {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  #tab-projects .proj-schedule-grid {
    min-width: 920px;
  }
}
/* Watchlist folders */
.watch-folder-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:10px 12px;border:1px solid var(--border);border-radius:12px 12px 0 0;
  background:var(--surf);flex:none}
.watch-folder-list{display:flex;align-items:center;gap:7px;overflow-x:auto;min-width:0;
  scrollbar-width:thin}
.watch-folder-chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--brd);
  background:var(--surf2);color:var(--txt);padding:7px 10px;border-radius:9px;white-space:nowrap;
  cursor:pointer;font:inherit}
.watch-folder-chip:hover,.watch-folder-chip.active{border-color:var(--accent);color:var(--accent)}
.watch-folder-chip.active{background:var(--accent-bg);font-weight:700}
.watch-folder-chip b{font-size:11px;padding:1px 6px;border-radius:999px;background:var(--surf);
  color:var(--dim)}
.watch-folder-actions{display:flex;gap:6px;flex:none}
.watch-synced-label{display:inline-flex;align-items:center;gap:5px;color:var(--accent);
  font-size:12px;white-space:nowrap}
#st-view-watch #st-watch-table{border-radius:0 0 12px 12px}
@media(max-width:700px){
  .watch-folder-bar{align-items:stretch;flex-direction:column}
  .watch-folder-actions{justify-content:flex-end}
}
.watch-market-grid{min-width:1380px;width:100%;table-layout:fixed;border-collapse:separate;
  border-spacing:0;background:var(--surf);font-variant-numeric:tabular-nums}
.watch-market-grid .col-symbol{width:76px}
.watch-market-grid .col-price{width:88px}
.watch-market-grid .col-change{width:82px}
.watch-market-grid .col-percent{width:88px}
.watch-market-grid .col-day{width:84px}
.watch-market-grid .col-volume{width:112px}
.watch-market-grid .col-target{width:92px}
.watch-market-grid .col-status{width:108px}
.watch-market-grid .col-note{width:172px}
.watch-market-grid .col-toggle{width:62px}
.watch-market-grid .col-actions{width:94px}
.watch-market-grid th,.watch-market-grid td{box-sizing:border-box;border-right:1px solid
  var(--brd2);border-bottom:1px solid var(--brd2);vertical-align:middle}
.watch-market-grid thead th{background:var(--surf2);color:var(--dim);padding:8px 10px;
  text-align:center;font-size:12px;font-weight:700;line-height:1.15}
.watch-market-grid th[data-watch-sort]{cursor:pointer;user-select:none}
.watch-market-grid th[data-watch-sort]>span{vertical-align:middle}
.watch-sort-icon{width:14px;height:14px;margin-left:4px;vertical-align:middle;
  color:var(--accent);stroke-width:2.5}
.watch-market-grid .watch-market-groups th{background:color-mix(in srgb,
  var(--accent) 10%,var(--surf2));color:var(--txt);letter-spacing:.02em}
.watch-market-grid tbody td{height:42px;background:var(--surf);color:var(--txt);
  padding:7px 10px;overflow:hidden;text-overflow:ellipsis}
.watch-market-grid tbody tr:nth-child(even) td{
  background:color-mix(in srgb,var(--txt) 1.8%,var(--surf))}
.watch-market-grid tbody td:nth-child(n+2):nth-child(-n+4){
  background:color-mix(in srgb,var(--accent) 2.5%,var(--surf))}
.watch-market-grid tbody td:nth-child(n+9):nth-child(-n+11){
  background:color-mix(in srgb,var(--yellow) 2.5%,var(--surf))}
.watch-market-grid tbody tr:hover td{background:var(--surf2)}
.watch-market-grid th.group-end,.watch-market-grid td.group-end{
  border-right:2px solid color-mix(in srgb,var(--accent) 55%,var(--brd2))}
.watch-market-grid th:last-child,.watch-market-grid td:last-child{border-right:0}
.watch-market-grid .tr{text-align:right}
.watch-market-grid .watch-symbol{color:var(--txt);position:sticky;left:0;z-index:2;
  background:var(--surf);text-align:left}
.watch-market-grid tbody tr:hover .watch-symbol{background:var(--surf2)}
.watch-price-up,.watch-target-buy{color:var(--green)!important}
.watch-price-down,.watch-target-sell{color:var(--red)!important}
.watch-price-flat{color:var(--yellow)!important}
.watch-market-status{display:inline-flex;padding:3px 8px;border-radius:999px;
  font-size:11px;font-weight:700;white-space:nowrap}
.watch-market-status.buy{color:var(--green);background:color-mix(in srgb,
  var(--green) 12%,transparent)}
.watch-market-status.sell{color:var(--red);background:color-mix(in srgb,
  var(--red) 12%,transparent)}
.watch-market-status.normal{color:var(--yellow);background:color-mix(in srgb,
  var(--yellow) 12%,transparent)}
.watch-note{max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.watch-market-grid .tgl{margin:auto}
.watch-market-grid .tbl-actions{justify-content:center;white-space:nowrap}
.watch-market-grid .tbl-actions .btn{width:36px;height:30px;padding:0;justify-content:center}
.watch-market-grid .watch-sync-btn:disabled{opacity:.55;cursor:default;color:var(--accent)}
.watch-market-grid thead tr:first-child th{border-bottom:1px solid var(--brd2)}
.watch-market-grid tbody tr:last-child td{border-bottom:0}
.watch-market-empty{display:flex;min-height:220px;align-items:center;justify-content:center;
  flex-direction:column;gap:8px}
.watch-market-empty svg{width:30px;height:30px;color:var(--accent)}

/* SignalR replaces the legacy stock polling selector. */
#st-hdr-shared-refresh .stock-last-sync{border-left:0;border-radius:12px 0 0 12px}

/* ── EXPENSES MODULE STYLES ── */
.exp-kpi-card {
  padding: 16px 20px;
  min-width: 0;
}
.exp-kpi-label { font-size: 11px; font-weight: 700; color: var(--dim); text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 6px; }
.exp-kpi-val { font-size: 22px; font-weight: 800; color: var(--txt); line-height: 1.1; margin-bottom: 4px; }
.exp-kpi-sub { font-size: 12px; color: var(--dim); }

.exp-cat-bar-row { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.exp-cat-bar-label { font-size: 13px; color: var(--txt2); min-width: 100px; flex-shrink: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.exp-cat-bar-track { flex: 1; height: 8px; background: var(--bg); border-radius: 99px; overflow: hidden; }
.exp-cat-bar-fill { height: 100%; border-radius: 99px; transition: width 0.4s ease; }
.exp-cat-bar-amt { font-size: 12px; font-weight: 700; color: var(--txt2); min-width: 80px; text-align: right; flex-shrink: 0; }

.exp-row { display: flex; align-items: center; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--brd); }
.exp-row:last-child { border-bottom: none; }
.exp-row-date { font-size: 11px; color: var(--dim); min-width: 70px; flex-shrink: 0; }
.exp-row-cat-pill { font-size: 11px; font-weight: 700; padding: 3px 8px; border-radius: 99px; flex-shrink: 0; }
.exp-row-desc { flex: 1; font-size: 13px; color: var(--txt2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.exp-row-amt { font-size: 14px; font-weight: 800; color: var(--txt); min-width: 80px; text-align: right; flex-shrink: 0; }
.exp-row-ops { display: flex; gap: 4px; flex-shrink: 0; }
.exp-row-ops button { background: none; border: 1px solid var(--brd); border-radius: 6px; padding: 3px 7px; cursor: pointer; color: var(--dim); font-size: 12px; transition: all 0.15s; }
.exp-row-ops button:hover { background: var(--accent-bg); border-color: var(--accent); color: var(--accent); }
.exp-row-ops button.del:hover { background: rgba(239,68,68,0.08); border-color: #ef4444; color: #ef4444; }

.exp-ai-row { background: var(--bg); border: 1px solid var(--brd); border-radius: var(--R2); padding: 12px 14px; margin-bottom: 8px; display: flex; gap: 10px; align-items: flex-start; flex-wrap: wrap; }
.exp-ai-row input, .exp-ai-row select { flex: 1; min-width: 100px; padding: 6px 10px; background: var(--surf2); border: 1px solid var(--brd); border-radius: 6px; color: var(--txt); font-size: 13px; }
.exp-ai-row-remove { background: none; border: none; color: var(--dim); cursor: pointer; font-size: 18px; padding: 4px; margin-left: auto; flex-shrink: 0; }
.exp-ai-row-remove:hover { color: #ef4444; }

.month-pill { padding: 5px 10px; border-radius: 99px; font-size: 12px; font-weight: 700; border: 1px solid var(--brd); background: var(--surf2); color: var(--dim); cursor: pointer; transition: all 0.15s; white-space: nowrap; }
.month-pill.active { background: var(--accent); border-color: var(--accent); color: #fff; }
