/* ── Sitea PM - scoped under #sitea-app and .s-overlay to prevent theme bleed ── */
:root{
  --s-bg-page:#f3f3f3;--s-bg-main:#fff;--s-bg-hover:#f5f7ff;--s-bg-input:#fff;
  --s-bg-th:#f9f9fb;--s-bg-done:#f7f7fa;
  --s-txt-primary:#1f2430;--s-txt-secondary:#676879;--s-txt-muted:#aaa;
  --s-border:#e6e9ef;--s-border-row:#f0f0f5;
}
body.sitea-dark{
  --s-bg-page:#13151c;--s-bg-main:#1e2130;--s-bg-hover:#252a3a;--s-bg-input:#252a3a;
  --s-bg-th:#181c27;--s-bg-done:#181c27;
  --s-txt-primary:#e0e4f0;--s-txt-secondary:#8890a8;--s-txt-muted:#555e78;
  --s-border:#2a3050;--s-border-row:#252a3a;
}

/* Reset everything inside the app */
#sitea-app,#sitea-app *,
.s-overlay,.s-overlay *,
#s-status-popup,#s-status-popup *,
#s-due-popup,#s-due-popup *,
#s-assign-popup,#s-assign-popup *,
#s-sort-popup,#s-sort-popup *,
#s-subtask-popup,#s-subtask-popup *,
#s-notes-panel,#s-notes-panel *{
  box-sizing:border-box;
  font-family:-apple-system,BlinkMacSystemFont,'SF Pro Text','Helvetica Neue',sans-serif;
}

/* Hard-reset buttons and inputs inside app to prevent theme override */
#sitea-app button,
#sitea-app input,
#sitea-app select,
#sitea-app textarea,
.s-overlay button,
.s-overlay input,
.s-overlay select,
.s-overlay textarea,
#s-status-popup button,
#s-due-popup button,
#s-assign-popup button,
#s-sort-popup button,
#s-subtask-popup button,
#s-notes-panel button,
#s-notes-panel input,
#s-notes-panel textarea{
  -webkit-appearance:none;
  -moz-appearance:none;
  appearance:none;
  border-radius:0;
  margin:0;
  box-shadow:none;
  outline:none;
}

/* Fix checkboxes - keep native appearance but constrain size */
#sitea-app input[type="checkbox"],
.s-overlay input[type="checkbox"]{
  -webkit-appearance:checkbox;
  -moz-appearance:checkbox;
  appearance:checkbox;
  width:16px !important;
  height:16px !important;
  min-width:16px !important;
  max-width:16px !important;
  min-height:16px !important;
  max-height:16px !important;
  flex-shrink:0;
  margin:0;
  padding:0;
  cursor:pointer;
  border-radius:3px !important;
}

/* Fix label layout for owner checkboxes */
.s-overlay label{
  display:inline-flex !important;
  align-items:center;
  gap:6px;
  cursor:pointer;
  font-size:12px;
  font-weight:400;
  color:var(--s-txt-primary);
  padding:4px 8px;
  border:1px solid var(--s-border);
  border-radius:6px;
  background:var(--s-bg-input);
  white-space:nowrap;
}

/* ── App shell ── */
#sitea-app{
  display:flex;flex-direction:column;
  min-height:calc(100vh - 120px);
  background:var(--s-bg-page);
  border-radius:10px;overflow:hidden;
  box-shadow:0 2px 20px rgba(0,0,0,.08);
}

/* ── Top nav ── */
#sitea-topnav{height:46px;background:#fff;border-bottom:1px solid #e6e9ef;display:flex;align-items:center;padding:0 16px;gap:10px;flex-shrink:0;}
.sitea-logo-hex{display:flex;}
.s-hex{width:11px;height:13px;background:#4ab8e8;clip-path:polygon(25% 0%,75% 0%,100% 50%,75% 100%,25% 100%,0% 50%);}
.s-hex2{background:#4ab8e8;margin-left:-4px;}
.sitea-logo-name{font-size:15px;font-weight:700;color:#1f2430;letter-spacing:-.3px;}
#sitea-app .sitea-nav-btn{
  background:transparent;border:1px solid #e0e4ef;color:#676879;
  border-radius:6px;padding:4px 10px;cursor:pointer;font-size:12px;
  display:flex;align-items:center;gap:4px;line-height:1.4;
}
#sitea-app .sitea-nav-btn:hover{background:#f5f6fa;}

/* ── Layout ── */
#sitea-layout{display:flex;flex:1;overflow:hidden;min-height:600px;}

/* ── Sidebar ── */
#sitea-sidebar{width:260px;background:#f7f8fa;border-right:1px solid #e6e9ef;display:flex;flex-direction:column;flex-shrink:0;overflow-y:auto;padding-bottom:12px;}
.s-section{padding:14px 8px 4px;}
.s-label{font-size:10px;font-weight:600;color:#aab;text-transform:uppercase;letter-spacing:.7px;padding:0 8px;margin-bottom:4px;display:flex;align-items:center;}
.s-label-btn{margin-left:auto;width:18px;height:18px;display:flex;align-items:center;justify-content:center;border-radius:4px;color:#aab;cursor:pointer;font-size:14px;}
.s-label-btn:hover{background:#e8eaf0;color:#555;}
.s-item{display:flex;align-items:center;gap:6px;padding:6px 8px;border-radius:7px;cursor:pointer;color:#555e78;transition:background .1s;font-size:12px;user-select:none;min-width:0;}
.s-item:hover{background:#edeef5;}
.s-item.active{background:#dbeeff;color:#0073ea;}
.s-item i{font-size:15px;flex-shrink:0;color:inherit;}
.s-lbl{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;}
.s-badge{font-size:11px;background:#e8eaf0;color:#aab;padding:1px 7px;border-radius:10px;}
.s-item.active .s-badge{background:#b8dff5;color:#0073ea;}
.s-del{width:16px;height:16px;display:flex;align-items:center;justify-content:center;border-radius:3px;color:transparent;font-size:12px;flex-shrink:0;cursor:pointer;}
.s-item:hover .s-del{color:#aab;}
.s-del:hover{background:#f5c0c8!important;color:#e2445c!important;}
.s-drag-h{width:14px;height:14px;display:flex;align-items:center;justify-content:center;color:transparent;font-size:12px;flex-shrink:0;cursor:grab;}
.s-item:hover .s-drag-h{color:#bbb;}
.s-dot{width:9px;height:9px;border-radius:50%;flex-shrink:0;}
.s-divider{height:1px;background:#e6e9ef;margin:8px 12px;}

/* ── Main ── */
#sitea-main{flex:1;display:flex;flex-direction:column;overflow:hidden;background:var(--s-bg-page);}
#sitea-board-header{background:var(--s-bg-main);border-bottom:1px solid var(--s-border);padding:0 20px;display:flex;align-items:center;height:50px;gap:10px;flex-shrink:0;}
#sitea-board-title{font-size:17px;font-weight:700;color:var(--s-txt-primary);flex:1;}

#sitea-app .s-hdr-btn{
  display:flex;align-items:center;gap:5px;
  padding:5px 11px;border-radius:6px;
  border:1px solid var(--s-border);
  background:var(--s-bg-main);color:var(--s-txt-secondary);
  cursor:pointer;font-size:12px;font-weight:500;
  transition:background .1s;line-height:1.4;
}
#sitea-app .s-hdr-btn:hover{background:var(--s-bg-hover);}
#sitea-app .s-hdr-btn.blue{background:#0073ea;border-color:#0073ea;color:#fff;}
#sitea-app .s-hdr-btn.blue:hover{background:#0060c0;}

#sitea-subtoolbar{background:var(--s-bg-main);border-bottom:1px solid var(--s-border);padding:0 20px;display:flex;align-items:center;height:38px;gap:6px;flex-shrink:0;}
.s-view-tab{padding:4px 12px;border-radius:20px;font-size:12px;font-weight:500;color:var(--s-txt-secondary);cursor:pointer;user-select:none;}
.s-view-tab:hover{background:var(--s-bg-hover);}
.s-view-tab.active{background:#ddeeff;color:#0073ea;}

#sitea-app .s-filter-chip{
  display:flex;align-items:center;gap:4px;
  padding:4px 10px;border-radius:20px;
  border:1px solid var(--s-border);
  background:var(--s-bg-main);color:var(--s-txt-secondary);
  font-size:12px;cursor:pointer;line-height:1.4;
}
#sitea-app .s-filter-chip:hover{background:var(--s-bg-hover);}

/* ── Board scroll ── */
#sitea-board-scroll{flex:1;overflow-y:auto;padding:16px 20px 40px;}
.s-group{margin-bottom:28px;}
.s-group-hdr{display:flex;align-items:center;gap:8px;padding:6px 2px;cursor:pointer;user-select:none;}
.s-group-bar{width:6px;height:26px;border-radius:3px;flex-shrink:0;}
.s-group-name{font-size:14px;font-weight:700;color:var(--s-txt-primary);}
.s-group-count{font-size:12px;color:var(--s-txt-muted);}
.s-group-prog{flex:0 0 90px;height:6px;background:var(--s-border);border-radius:3px;overflow:hidden;}
.s-group-prog-fill{height:100%;background:#00c875;border-radius:3px;}
.s-group-chev{font-size:14px;color:var(--s-txt-muted);transition:transform .15s;}
.s-group-chev.collapsed{transform:rotate(-90deg);}
.s-group-add{margin-left:auto;display:flex;align-items:center;gap:4px;font-size:12px;color:var(--s-txt-muted);padding:3px 8px;border-radius:5px;cursor:pointer;}
.s-group-add:hover{background:var(--s-bg-hover);color:var(--s-txt-secondary);}

/* ── Table ── */
.s-board-table{width:100%;border-collapse:collapse;margin-top:2px;table-layout:fixed;}
.s-board-table thead th{background:var(--s-bg-th);border-bottom:1px solid var(--s-border);border-right:1px solid var(--s-border);padding:7px 10px;font-size:11px;font-weight:600;color:var(--s-txt-muted);text-transform:uppercase;letter-spacing:.4px;white-space:nowrap;user-select:none;position:sticky;top:0;z-index:2;overflow:hidden;}
.s-board-table thead th:first-child{border-left:1px solid var(--s-border);border-radius:8px 0 0 0;}
.s-board-table thead th:last-child{border-radius:0 8px 0 0;}
.s-board-table tbody tr{transition:background .08s;cursor:pointer;}
.s-board-table tbody tr:hover{background:var(--s-bg-hover);}
.s-board-table tbody tr:hover .s-row-acts{opacity:1;}
.s-board-table tbody td{border-bottom:1px solid var(--s-border-row);border-right:1px solid var(--s-border-row);padding:8px 10px;font-size:13px;color:var(--s-txt-primary);vertical-align:middle;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.s-board-table tbody td:first-child{border-left:1px solid var(--s-border-row);}
.s-board-table tfoot td{border:1px solid var(--s-border-row);border-top:none;padding:7px 10px;}
.s-pill-cell{padding:0!important;height:1px;}
.s-col-resizer{position:absolute;right:0;top:0;width:5px;height:100%;cursor:col-resize;z-index:3;}
.s-col-resizer:hover,.s-col-resizer.dragging{background:#0073ea55;}

/* ── Checkbox ── */
.s-chk{
  width:16px;height:16px;border-radius:4px;
  border:1.5px solid #c5c7d4;
  display:inline-flex;align-items:center;justify-content:center;
  cursor:pointer;transition:all .12s;flex-shrink:0;
}
.s-chk.checked{background:#0073ea;border-color:#0073ea;color:#fff;}
.s-chk i{font-size:10px;}

/* ── Task text ── */
.s-task-txt{font-size:13px;color:var(--s-txt-primary);}
.s-task-txt.done{text-decoration:line-through;color:var(--s-txt-muted);}

/* ── Status / Priority pills ── */
#sitea-app .s-pill,
#sitea-app button.s-pill,
#sitea-app .s-pill-cell button,
#s-status-popup .s-pill,
#s-status-popup div.s-pill{
  display:flex!important;align-items:center!important;justify-content:center!important;
  padding:0 10px!important;
  border-radius:0!important;
  -webkit-border-radius:0!important;
  -moz-border-radius:0!important;
  font-size:11px!important;font-weight:700!important;
  cursor:pointer!important;
  width:100%!important;height:100%!important;min-height:36px!important;
  border:none!important;
  box-shadow:none!important;
  outline:none!important;
  line-height:1!important;
  text-transform:none!important;
  letter-spacing:normal!important;
}
#sitea-app .s-pill:hover,
#s-status-popup .s-pill:hover{filter:brightness(.92);}

/* Pills in popups need different sizing */
#s-status-popup .s-pill{
  border-radius:4px;
  min-height:28px;
  margin-bottom:3px;
  width:100%;
}

.s-todo{background:#c4c4c4;color:#fff;}
.s-working{background:#fdab3d;color:#fff;}
.s-review{background:#a25ddc;color:#fff;}
.s-done{background:#00c875;color:#fff;}
.s-stuck{background:#e2445c;color:#fff;}
.s-later{background:#579bfc;color:#fff;}
.s-phigh{background:#e2445c;color:#fff;}
.s-pmed{background:#fdab3d;color:#fff;}
.s-plow{background:#579bfc;color:#fff;}
.s-pcontinuous{background:#00b884;color:#fff;}

/* ── Avatar ── */
.s-av{width:24px;height:24px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;flex-shrink:0;}

/* ── Dates ── */
.s-date-over{color:#e2445c;font-weight:600;}
.s-date-soon{color:#fdab3d;font-weight:500;}
.s-date-ok{color:var(--s-txt-muted);}

/* ── Add row ── */
.s-add-row td{color:#0073ea;font-size:12px;font-weight:500;cursor:pointer;padding:7px 10px!important;}
.s-add-row:hover td{background:var(--s-bg-hover)!important;}

/* ── Row actions ── */
.s-row-acts{opacity:0;display:flex;gap:4px;}
.s-row-act{
  width:22px;height:22px;border-radius:4px;
  display:flex;align-items:center;justify-content:center;
  font-size:13px;color:var(--s-txt-muted);cursor:pointer;
  background:transparent;border:none;padding:0;
}
.s-row-act:hover{background:var(--s-border);color:var(--s-txt-secondary);}

/* ── Inline input ── */
#sitea-app .s-inline-input{
  background:var(--s-bg-input);
  border:1.5px solid #0073ea;
  border-radius:5px;
  padding:4px 7px;
  font-size:13px;
  color:var(--s-txt-primary);
  outline:none;
  width:100%;
}

/* ── Done section toggle ── */
.s-done-toggle td{background:var(--s-bg-done);cursor:pointer;padding:7px 12px!important;border-top:2px solid var(--s-border)!important;}

/* ── Subtask rows ── */
.s-subtask-row td{border-bottom:1px solid var(--s-border-row);border-right:1px solid var(--s-border-row);padding:5px 10px;vertical-align:middle;background:var(--s-bg-th);}
.s-subtask-row td:first-child{border-left:1px solid var(--s-border-row);}
.s-subtask-row:hover td{background:var(--s-bg-hover)!important;}

/* ── Modals ── */
.s-overlay{position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:9000;display:flex;align-items:center;justify-content:center;}
.s-modal{background:var(--s-bg-main);border-radius:12px;max-width:95vw;box-shadow:0 8px 48px rgba(0,0,0,.2);overflow:hidden;}
.s-modal-head{padding:18px 22px 14px;border-bottom:1px solid var(--s-border);display:flex;align-items:center;}
.s-modal-head h3{font-size:16px;font-weight:700;color:var(--s-txt-primary);flex:1;margin:0;}
.s-modal-close{width:28px;height:28px;border-radius:6px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--s-txt-muted);font-size:16px;background:transparent;border:none;}
.s-modal-close:hover{background:var(--s-bg-hover);}
.s-modal-body{padding:18px 22px;}
.s-modal-foot{padding:12px 22px;border-top:1px solid var(--s-border);display:flex;justify-content:flex-end;gap:8px;align-items:center;}

/* ── Form fields ── */
.s-frow{margin-bottom:13px;}
.s-frow label{display:block;font-size:12px;font-weight:600;color:var(--s-txt-secondary);margin-bottom:4px;}
.s-overlay .s-frow input,
.s-overlay .s-frow select,
.s-overlay .s-frow textarea{
  width:100%;
  padding:7px 10px;
  border:1px solid var(--s-border);
  border-radius:6px;
  font-size:13px;
  color:var(--s-txt-primary);
  background:var(--s-bg-input);
  display:block;
  line-height:1.5;
}
.s-overlay .s-frow input:focus,
.s-overlay .s-frow select:focus,
.s-overlay .s-frow textarea:focus{
  outline:none;
  border-color:#0073ea;
  box-shadow:none;
}

/* ── Modal buttons ── */
.s-overlay .s-mbtn,
.s-modal-foot .s-mbtn{
  padding:7px 16px;
  border-radius:6px;
  font-size:13px;font-weight:600;
  cursor:pointer;
  display:inline-flex;align-items:center;
  line-height:1.4;
}
.s-mbtn-cancel{background:var(--s-bg-th);color:var(--s-txt-secondary);border:1px solid var(--s-border);}
.s-mbtn-cancel:hover{background:var(--s-bg-hover);}
.s-mbtn-primary{background:#0073ea;color:#fff;border:none;}
.s-mbtn-primary:hover{background:#0060c0;}
.s-mbtn-del{background:transparent;color:#e2445c;border:1px solid #f5c0c8;}
.s-mbtn-del:hover{background:#fce8e8;}

/* ── Popups ── */
#s-status-popup,#s-due-popup,#s-assign-popup,#s-sort-popup,#s-subtask-popup{
  z-index:9500;
  font-family:-apple-system,BlinkMacSystemFont,'SF Pro Text',sans-serif;
}
#s-due-popup input,#s-subtask-popup input{
  width:100%;padding:7px 9px;
  border:1px solid var(--s-border);border-radius:6px;
  font-size:13px;font-family:inherit;
  color:var(--s-txt-primary);background:var(--s-bg-input);
  display:block;margin-bottom:10px;
}
#s-due-popup button,#s-subtask-popup button{
  padding:6px 10px;border-radius:6px;
  font-size:12px;font-weight:600;
  cursor:pointer;font-family:inherit;
  line-height:1.4;
}

/* ── Notes panel ── */
#s-notes-panel{
  position:fixed;top:0;right:0;width:320px;height:100vh;
  background:var(--s-bg-main);border-left:1px solid var(--s-border);
  z-index:8000;display:flex;flex-direction:column;
  box-shadow:-4px 0 24px rgba(0,0,0,.12);
  transform:translateX(100%);transition:transform .2s;
}
#s-notes-panel textarea,#s-notes-panel input{
  border:1px solid var(--s-border);border-radius:6px;
  font-size:13px;font-family:inherit;
  color:var(--s-txt-primary);background:var(--s-bg-input);
  padding:8px 10px;line-height:1.6;
}
#s-notes-panel textarea:focus,#s-notes-panel input:focus{
  outline:none;border-color:#0073ea;box-shadow:none;
}
#s-notes-panel button{
  padding:7px 12px;border-radius:6px;
  font-size:12px;font-weight:600;
  cursor:pointer;font-family:inherit;line-height:1.4;
  border:none;
}


/* Date input fix - allow native date picker to show correctly */
#sitea-app input[type="date"],
#sitea-app input[type="time"],
.s-overlay input[type="date"],
.s-overlay input[type="time"]{
  -webkit-appearance:auto;
  -moz-appearance:auto;
  appearance:auto;
  padding:7px 10px;
  border:1px solid var(--s-border);
  border-radius:6px;
  font-size:13px;
  color:var(--s-txt-primary);
  background:var(--s-bg-input);
  width:100%;
}

/* Fix color input */
#sitea-app input[type="color"],
.s-overlay input[type="color"]{
  -webkit-appearance:auto;
  appearance:auto;
  padding:2px;
  border-radius:6px;
  cursor:pointer;
}

body.sitea-dark #sitea-sidebar{background:#1e2130;border-right-color:#2a3050;}
body.sitea-dark #sitea-topnav{background:#1f2430;border-bottom-color:#2a3050;}
body.sitea-dark .sitea-logo-name{color:#e0e4f0;}
body.sitea-dark #sitea-app .sitea-nav-btn{border-color:#3e4560;color:#c8cdd8;}
body.sitea-dark #sitea-app .sitea-nav-btn:hover{background:#2e3447;}
body.sitea-dark .s-label{color:#636b82;}
body.sitea-dark .s-label-btn{color:#636b82;}
body.sitea-dark .s-label-btn:hover{background:#2e3447;color:#c8cdd8;}
body.sitea-dark .s-item{color:#c8cdd8;}
body.sitea-dark .s-item:hover{background:#2e3447;}
body.sitea-dark .s-item.active{background:#0073ea22;color:#4da3f5;}
body.sitea-dark .s-badge{background:#2e3447;color:#636b82;}
body.sitea-dark .s-item.active .s-badge{background:#0073ea33;color:#4da3f5;}
body.sitea-dark .s-divider{background:#2e3447;}
body.sitea-dark .s-del:hover{background:#3e4560!important;color:#ff6b6b!important;}
body.sitea-dark .s-item:hover .s-del{color:#636b82;}
body.sitea-dark .s-item:hover .s-drag-h{color:#444e6a;}

.s-lp-row:hover{background:var(--s-bg-hover);}

/* ── Home view ── */
#sitea-home-view{flex:1;overflow-y:auto;background:var(--s-bg-page);}
#sitea-client-search:focus{outline:none;border-color:#0073ea;box-shadow:0 0 0 3px #0073ea22;}
.s-client-card{
  background:var(--s-bg-main);border:1px solid var(--s-border);border-radius:10px;
  padding:18px;cursor:pointer;transition:box-shadow .15s,border-color .15s;
  display:flex;flex-direction:column;gap:8px;
}
.s-client-card:hover{border-color:#0073ea55;box-shadow:0 4px 16px rgba(0,115,234,.1);}
.s-client-card-dot{width:12px;height:12px;border-radius:50%;flex-shrink:0;}
.s-client-card-name{font-size:15px;font-weight:700;color:var(--s-txt-primary);}
.s-client-card-meta{font-size:12px;color:var(--s-txt-muted);}
.s-client-card-notes{font-size:12px;color:var(--s-txt-secondary);line-height:1.4;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;}

/* ── Client view ── */
#sitea-client-view{background:var(--s-bg-page);}
.sct-tab{
  padding:10px 16px;font-size:13px;font-weight:500;cursor:pointer;
  color:var(--s-txt-secondary);border-bottom:2px solid transparent;
  margin-bottom:-1px;display:flex;align-items:center;gap:6px;
}
.sct-tab:hover{color:var(--s-txt-primary);}
.sct-tab.active{color:#0073ea;border-bottom-color:#0073ea;font-weight:600;}

/* ── App layout without sidebar ── */
#sitea-app{display:flex;flex-direction:column;min-height:calc(100vh - 80px);background:var(--s-bg-page);border-radius:10px;overflow:hidden;box-shadow:0 2px 20px rgba(0,0,0,.08);}
#sitea-topnav{height:48px;background:#fff;border-bottom:1px solid #e6e9ef;display:flex;align-items:center;padding:0 20px;gap:10px;flex-shrink:0;}
#sitea-board-scroll{display:none;} /* not used in new layout */