/* Employee modal — elegant multi-accent task studio */
#employeeModal{
  --ett-navy:#14233f;
  --ett-blue:#2a66c8;
  --ett-gold:#b8892d;
  --ett-green:#1d8a68;
  --ett-red:#b93b4a;
  --ett-ink:#1c2c44;
  --ett-muted:#6e8098;
  --ett-paper:#fbfcfe;
  width:min(960px,96vw)!important;
  max-width:96vw;
  max-height:min(92dvh,940px)!important;
  height:auto;
  border:0;
  border-radius:22px;
  padding:0;
  overflow:hidden!important;
  color:var(--ett-ink);
  background:
    radial-gradient(circle at 100% 0%,#e8f1ff 0%,transparent 42%),
    radial-gradient(circle at 0% 100%,#fff6e8 0%,transparent 40%),
    linear-gradient(180deg,#ffffff 0%,#f7fafc 100%);
  box-shadow:0 28px 80px #0b1c3870;
}
#employeeModal[open]{
  display:flex!important;
  flex-direction:column;
}
#employeeModal::backdrop{
  background:linear-gradient(135deg,#0b1c38cc,#163a6baa);
  backdrop-filter:blur(6px);
}
#employeeModal form{
  padding:0!important;
  display:flex;
  flex-direction:column;
  flex:1 1 auto;
  min-height:0;
  max-height:min(92dvh,940px);
  overflow-x:hidden;
  overflow-y:auto!important;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
}
#employeeModal form::-webkit-scrollbar{width:10px}
#employeeModal form::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg,#2a66c8,#163a6b);
  border-radius:999px;
  border:2px solid #eef3f9;
}
#employeeModal form::-webkit-scrollbar-track{background:#eef3f9}
#employeeModal .modal-header{
  margin:0;
  padding:20px 24px;
  border-bottom:1px solid #d9e4f2;
  background:linear-gradient(115deg,#163a6b 0%,#1f4f8a 55%,#2a66c8 100%);
  color:#fff;
  border-radius:0;
  position:sticky;
  top:0;
  z-index:5;
  flex-shrink:0;
}
#employeeModal .modal-header .eyebrow{
  color:#c9daf0;
}
#employeeModal .modal-header h2{
  color:#fff;
}
#employeeModal .close-modal{
  background:#ffffff18;
  color:#fff;
  border:1px solid #ffffff40;
}
#employeeModal .form-hint{
  margin:12px 24px 0;
  color:var(--ett-muted);
}
#employeeModal .form-grid{
  padding:16px 24px 8px;
}
#employeeModal .form-grid label{
  color:#4a5d78;
}
#employeeModal .form-grid input,
#employeeModal .form-grid select,
#employeeModal .form-grid textarea{
  border:1.5px solid #c9d7ea;
  border-radius:10px;
  background:#f8fbff;
  transition:border-color .15s,box-shadow .15s,background .15s;
}
#employeeModal .form-grid input:focus,
#employeeModal .form-grid select:focus,
#employeeModal .form-grid textarea:focus{
  border-color:var(--ett-blue);
  background:#fff;
  box-shadow:0 0 0 4px #2a66c81a;
}

/* Routine tasks studio */
#employeeModal .employee-task-admin{
  margin:8px 24px 0;
  padding:18px;
  border:1.5px solid #c5d6ec;
  border-right:5px solid var(--ett-blue);
  border-radius:18px;
  background:
    linear-gradient(180deg,#ffffffee 0%,#f4f8fc 100%);
  box-shadow:0 10px 28px #163a6b0d;
}
#employeeModal .modal-section-heading{
  align-items:center;
  margin-bottom:14px;
  padding-bottom:12px;
  border-bottom:1px dashed #d4dfef;
}
#employeeModal .modal-section-heading h3{
  color:var(--ett-navy);
  font-size:15px;
}
#employeeModal .modal-section-heading p{
  color:var(--ett-muted);
}
#employeeModal .modal-section-heading span{
  display:inline-flex;
  align-items:center;
  padding:6px 12px;
  border-radius:999px;
  background:linear-gradient(135deg,#eef5ff,#e7f0ff);
  border:1px solid #b7cef0;
  color:var(--ett-blue);
  font-weight:800;
}

#employeeModal .employee-tasks-editor{
  display:grid;
  gap:9px;
  max-height:min(42vh,360px);
  overflow:auto;
  padding:4px 2px 8px;
  -webkit-overflow-scrolling:touch;
}
#employeeModal .task-editor-head{
  color:#7a8da6;
  padding:0 8px 4px;
}
#employeeModal .task-editor-row{
  background:linear-gradient(180deg,#ffffff 0%,#f7fafc 100%);
  border:1.5px solid #d5e0ee;
  border-right:4px solid var(--ett-blue);
  border-radius:12px;
  padding:10px;
  box-shadow:0 4px 14px #102b5308;
  transition:border-color .15s,transform .15s,box-shadow .15s;
}
#employeeModal .task-editor-row:nth-child(5n+1){border-right-color:var(--ett-blue);border-color:#c7d8ef}
#employeeModal .task-editor-row:nth-child(5n+2){border-right-color:var(--ett-gold);border-color:#e6d3a8;background:linear-gradient(180deg,#fffdf8 0%,#fbf6ea 100%)}
#employeeModal .task-editor-row:nth-child(5n+3){border-right-color:var(--ett-green);border-color:#b9dece;background:linear-gradient(180deg,#f8fffb 0%,#eef8f3 100%)}
#employeeModal .task-editor-row:nth-child(5n+4){border-right-color:var(--ett-red);border-color:#e7c0c5;background:linear-gradient(180deg,#fffafb 0%,#fdf1f3 100%)}
#employeeModal .task-editor-row:nth-child(5n+5){border-right-color:var(--ett-navy);border-color:#c5cedb;background:linear-gradient(180deg,#fbfcfe 0%,#f1f4f8 100%)}
#employeeModal .task-editor-row:hover{
  transform:translateY(-1px);
  box-shadow:0 8px 18px #102b5312;
}
#employeeModal .task-editor-row input,
#employeeModal .task-editor-row select,
#employeeModal .inline-task-form input,
#employeeModal .inline-task-form select,
#employeeModal .bulk-tasks-actions select,
#employeeModal .bulk-tasks-actions input,
#employeeModal .bulk-tasks-box textarea{
  border:1.5px solid #cfdced;
  border-radius:9px;
  background:#fff;
  color:#334862;
}
#employeeModal .task-editor-row input:focus,
#employeeModal .task-editor-row select:focus,
#employeeModal .inline-task-form input:focus,
#employeeModal .inline-task-form select:focus,
#employeeModal .bulk-tasks-box textarea:focus{
  border-color:var(--ett-blue);
  box-shadow:0 0 0 3px #2a66c814;
  outline:none;
}
#employeeModal .task-weight-badge{
  background:linear-gradient(135deg,#163a6b,#2a66c8);
  box-shadow:0 4px 10px #163a6b22;
}
#employeeModal .delete-employee-task,
#employeeModal .task-editor-row .row-menu{
  color:var(--ett-red);
}

/* Add task strip */
#employeeModal .inline-task-form,
#employeeModal .routine-add-form{
  margin-top:12px;
  padding:12px;
  border:1.5px solid #b9d0ef;
  border-right:4px solid var(--ett-green);
  border-radius:14px;
  background:linear-gradient(180deg,#f7fcff 0%,#eef7f3 100%);
}
#employeeModal #employeeTaskWeightHint{
  margin:8px 2px 0;
  color:#5f7a6e;
}

/* Bulk paste box */
#employeeModal .bulk-tasks-box{
  margin-top:14px;
  padding:14px;
  border:1.5px dashed #c4a35a;
  border-right:4px solid var(--ett-gold);
  border-radius:16px;
  background:
    linear-gradient(180deg,#fffdf7 0%,#faf3e4 100%);
  box-shadow:inset 0 1px 0 #ffffffaa;
}
#employeeModal .bulk-tasks-head strong{
  color:#7a5a1f;
}
#employeeModal .bulk-tasks-head small{
  color:#9a7a3f;
}
#employeeModal .bulk-tasks-box textarea{
  background:#fffdf9;
  border-color:#e0cc9a;
  min-height:120px;
}
#employeeModal .bulk-tasks-hint{
  color:var(--ett-green);
}

/* Copy toolbar / tools */
#employeeModal .ett-copy-toolbar{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  margin:14px 0 10px;
  padding:10px 12px;
  border:1.5px solid #c9d8ec;
  border-right:4px solid var(--ett-navy);
  border-radius:12px;
  background:linear-gradient(180deg,#f8fbff,#eef3f9);
}
#employeeModal .ett-copy-toolbar label{
  display:flex;
  align-items:center;
  gap:7px;
  margin-left:auto;
  color:#6d819c;
  font-size:12px;
}
#employeeModal .ett-copy-toolbar button{
  padding:8px 12px;
  font-size:11px;
  border-radius:9px;
}
#employeeModal .ett-task-title{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
}
#employeeModal .ett-task-title .edit-task-title{
  min-width:0;
  flex:1;
}
#employeeModal input[data-copy-task],
#ettSelectAll{
  width:16px;
  height:16px;
  flex:0 0 16px;
  accent-color:var(--ett-blue);
}
#employeeModal .ett-replace,
#ettConfirm .ett-replace{
  border:1.5px solid #c4923b;
  background:linear-gradient(180deg,#fff8ea,#f5e6c8);
  color:#7a5418;
  font:inherit;
  font-size:12px;
  padding:11px 15px;
  border-radius:10px;
  cursor:pointer;
  font-weight:800;
  box-shadow:0 4px 12px #b8892d22;
}
#employeeModal .ett-replace small{
  font-size:9px;
  background:var(--ett-gold);
  color:#fff;
  border-radius:4px;
  padding:2px 5px;
  margin-right:6px;
}
#employeeModal .ett-help{
  font-size:11px;
  color:#8a6a35;
  margin:12px 0 0;
}
#employeeModal .ett-undo{
  background:transparent;
  border:0;
  color:#557799;
  font:inherit;
  font-size:11px;
  cursor:pointer;
  margin-top:10px;
}
#employeeModal button:disabled{
  opacity:.45;
  cursor:not-allowed;
}
#employeeModal #ettPaste{margin-top:8px}
#employeeModal .bulk-tasks-actions{flex-wrap:wrap}

/* Footer actions */
#employeeModal .modal-actions{
  margin:0;
  padding:14px 24px 18px;
  border-top:1px solid #dce6f2;
  background:linear-gradient(180deg,#f8fbff,#eef4fb);
  position:sticky;
  bottom:0;
  z-index:5;
  flex-shrink:0;
}
#employeeModal .danger-button{
  border:1.5px solid #e3a8af;
  background:linear-gradient(180deg,#fff7f8,#fdecee);
  color:var(--ett-red);
}
#employeeModal .secondary{
  border:1.5px solid #c9d6e8;
  background:#fff;
  color:#4d617c;
  border-radius:10px;
}
#employeeModal #saveEmployee,
#employeeModal .modal-actions .new-task{
  border:0;
  border-radius:10px;
  background:linear-gradient(135deg,#1f4f8a,#2a66c8);
  box-shadow:0 8px 18px #2a66c833;
}

/* Confirm replace dialog (same studio language) */
#ettConfirm{
  width:min(760px,94vw);
  max-width:760px;
  border:0;
  border-radius:20px;
  padding:24px;
  color:#214467;
  max-height:88dvh;
  background:
    radial-gradient(circle at 0% 0%,#fff6e8 0%,transparent 36%),
    radial-gradient(circle at 100% 0%,#eaf4ff 0%,transparent 40%),
    #fff;
  box-shadow:0 24px 70px #0b1c3866;
}
#ettConfirm::backdrop{
  background:#142e5680;
  backdrop-filter:blur(3px);
}
#ettConfirm header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
}
#ettConfirm h2{font-size:20px;margin:0;color:var(--ett-navy)}
#ettConfirm>p{font-size:12px;line-height:1.9;color:var(--ett-muted)}
#ettConfirm .ett-comparison{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:13px;
}
#ettConfirm .ett-comparison article{
  border:1.5px solid #d7e2ef;
  border-radius:14px;
  overflow:hidden;
  background:#fbfcfe;
}
#ettConfirm .ett-comparison article:first-child{
  border-color:#e3b4ba;
  border-right:4px solid var(--ett-red);
}
#ettConfirm .ett-comparison article:last-child{
  border-color:#b7decc;
  border-right:4px solid var(--ett-green);
}
#ettConfirm h3{
  display:flex;
  justify-content:space-between;
  font-size:12px;
  padding:13px;
  margin:0;
  background:#f5f7fa;
  color:#7890a7;
}
#ettConfirm article:last-child h3{
  background:#edf7f1;
  color:#347657;
}
#ettConfirm ol{
  margin:0;
  padding:14px 32px 14px 15px;
  max-height:220px;
  overflow:auto;
  font-size:12px;
  line-height:2.2;
  overflow-wrap:anywhere;
}
#ettConfirm .ett-notice{
  padding:12px;
  background:linear-gradient(180deg,#fff9ef,#f7ecd7);
  border:1.5px solid #e0c792;
  border-right:4px solid var(--ett-gold);
  border-radius:12px;
  color:#7a5a1f;
}
#ettConfirm footer{
  display:flex;
  justify-content:flex-end;
  gap:10px;
  margin-top:20px;
}
#ettReviewError{color:#b0443c}
#ettConfirm :focus-visible,
#employeeModal .ett-copy-toolbar :focus-visible{
  outline:3px solid #427ddd;
  outline-offset:2px;
}

@media(max-width:640px){
  #employeeModal .employee-task-admin,
  #employeeModal .form-grid,
  #employeeModal .form-hint{
    margin-left:14px;
    margin-right:14px;
  }
  #employeeModal .employee-task-admin{padding:14px}
  #employeeModal .modal-actions{margin:14px}
  #ettConfirm{padding:18px}
  #ettConfirm h2{font-size:17px}
  #ettConfirm .ett-comparison{grid-template-columns:1fr}
  #ettConfirm ol{max-height:130px}
  #employeeModal .ett-copy-toolbar label{width:100%}
  #employeeModal .ett-replace{width:100%}
}
