/* SENSE Portal — additions for the live version (not in the original design).
   Uses the design's color variables so everything matches. */

a.logo{text-decoration:none;}
.btn-primary:disabled{opacity:0.55; cursor:default;}

.panel-note{color:var(--muted); font-size:0.88rem; margin-top:14px;}
.summary-card .summary-hint.muted-hint{color:var(--muted); font-weight:600;}

.coming-soon-panel{max-width:640px; margin:8px 0 0; text-align:left;}
.coming-soon-panel h2{font-size:1.2rem; color:var(--ink); margin-bottom:8px;}
.coming-soon-panel p{color:var(--body-text);}

/* People list */
.people-actions{display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end;}
.onboarding-action.small-action{padding:5px 12px; font-size:0.78rem;}
.onboarding-action.danger-action{border-color:#c0392b; color:#c0392b;}
.role-select{
  font:inherit; font-size:0.82rem; color:var(--dark); font-weight:600;
  border:1px solid var(--line); border-radius:6px; padding:3px 8px; background:var(--white);
}
.role-fixed{font-weight:700; color:var(--dark);}
.meta-sep{color:var(--line); margin:0 4px;}

/* One-time link box */
.invite-link-box{
  margin-top:16px; padding:14px 16px; border-radius:10px;
  background:var(--pale); border:1px solid var(--line);
}
.link-slot .invite-link-box{margin:0 0 12px;}
.invite-link-text{font-size:0.86rem; color:var(--body-text); margin-bottom:10px;}
.invite-link-row{display:flex; gap:10px;}
.invite-link-row input{
  flex:1; min-width:0; font:inherit; font-size:0.82rem; color:var(--ink);
  border:1px solid var(--line); border-radius:6px; padding:8px 10px; background:var(--white);
}
.invite-link-row .btn-primary{white-space:nowrap;}

/* Toast */
.portal-toast{
  position:fixed; left:50%; bottom:28px; transform:translate(-50%, 20px);
  background:var(--ink); color:var(--white); font-size:0.88rem; font-weight:600;
  padding:10px 18px; border-radius:8px; box-shadow:0 8px 24px rgba(20,35,43,0.25);
  opacity:0; pointer-events:none; transition:opacity .2s ease, transform .2s ease; z-index:1000;
}
.portal-toast.show{opacity:1; transform:translate(-50%, 0);}

@media (max-width:700px){
  .invite-link-row{flex-direction:column;}
  .people-actions{justify-content:flex-start;}
}

/* Projects */
.badge.status-rejected{background:#fbe9e7; color:#c0392b;}
.muted-inline{color:var(--muted); font-size:0.85rem;}
.pm-chip{display:inline-block; margin-left:6px; padding:1px 7px; border-radius:999px; background:var(--pale); color:var(--dark); font-size:0.7rem; font-weight:800; vertical-align:middle;}
.team-add-row{display:flex; gap:10px; align-items:flex-end;}
.member-edit-fields{display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-top:6px;}
.member-edit-fields input, .member-edit-fields select{font:inherit; font-size:0.82rem; border:1px solid var(--line); border-radius:6px; padding:5px 8px; background:var(--white); color:var(--dark);}
.member-edit-fields input{width:80px;}
.setup-save-bar{display:flex; align-items:center; gap:16px; flex-wrap:wrap; position:sticky; bottom:0; padding:14px 0; background:linear-gradient(180deg, rgba(255,255,255,0), var(--white) 30%);}
.portal-project-card{cursor:pointer;}
@media (max-width:700px){ .team-add-row{flex-direction:column; align-items:stretch;} }
.row-edit-link{color:var(--teal); font-weight:700; font-size:0.82rem;}
.row-edit-link:hover{opacity:0.75;}

/* Admin Time Logs: two breakdown panels side by side (stack on phones) */
.time-breakdown-grid{display:grid; grid-template-columns:1fr 1fr; gap:20px; margin:24px 0;}
@media (max-width:760px){ .time-breakdown-grid{grid-template-columns:1fr;} }

/* Show / Hide password */
.pw-field{position:relative;}
.pw-field input{width:100%; padding-right:68px !important;}
.pw-toggle{position:absolute; right:8px; top:50%; transform:translateY(-50%); background:none; border:0; padding:6px 8px;
  font:inherit; font-size:0.78rem; font-weight:700; color:var(--teal); cursor:pointer; border-radius:6px;}
.pw-toggle:hover{background:var(--pale);}
.pw-toggle:focus-visible{outline:2px solid var(--teal); outline-offset:1px;}

/* Website Submissions */
.summary-card-button{font:inherit; text-align:left; cursor:pointer; background:var(--white); width:100%;}
.summary-card-button:hover{border-color:var(--teal);}
.summary-card-button.active{border-color:var(--teal); box-shadow:inset 0 0 0 1px var(--teal);}
.submissions-toolbar{display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin-bottom:8px;}
.submissions-toolbar input, .submissions-toolbar select{padding:9px 12px; border:1px solid var(--line); border-radius:6px; font:inherit; font-size:0.88rem; color:var(--dark); background:var(--white);}
.submissions-toolbar input{flex:1 1 240px; min-width:0;}
.submissions-toolbar input:focus, .submissions-toolbar select:focus{border-color:var(--teal); outline:none;}
.submissions-count{color:var(--muted); font-size:0.82rem; margin-right:auto;}
.submission-row{cursor:pointer;}
.submission-row:hover .mini-task-title{color:var(--teal);}
.submission-row:focus-visible{outline:2px solid var(--teal); outline-offset:2px; border-radius:6px;}
.submission-field{padding:12px 0; border-top:1px solid var(--line);}
.submission-field-label{font-size:0.76rem; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:.03em; margin-bottom:4px;}
.submission-field-value{font-size:0.92rem; color:var(--ink); white-space:pre-wrap; overflow-wrap:anywhere;}
@media (max-width:760px){ .submissions-count{margin-right:0; width:100%;} }

/* Top bar = My Work (personal) · account; sidebar = role tools */
.portal-role-chip{display:inline-block; margin-left:8px; padding:2px 8px; border-radius:999px; background:var(--white); border:1px solid var(--line);
  font-size:0.7rem; font-weight:700; color:var(--teal); vertical-align:middle; letter-spacing:.02em;}
.portal-mywork{display:flex; align-items:center; gap:14px; margin-left:auto;}
.portal-nav-group-label{font-size:0.68rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--muted);
  padding-right:14px; border-right:1px solid var(--line);}
.portal-account{padding-left:22px; border-left:1px solid var(--line); margin-left:auto;}
.portal-subnav-inner > .portal-account:nth-child(2){margin-left:auto; border-left:none; padding-left:0;}
.portal-sidebar-note{font-size:0.74rem; color:var(--muted); margin:-6px 0 14px; padding-left:2px;}
@media (max-width:880px){
  .portal-mywork{margin-left:0; width:100%; flex-wrap:wrap;}
  .portal-account{padding-left:0; border-left:none;}
}

/* Recruitment */
.nav-badge{display:inline-block; min-width:18px; padding:1px 6px; margin-left:8px; border-radius:999px; background:#c0392b; color:#fff; font-size:0.7rem; font-weight:800; text-align:center; line-height:16px;}
.unread-dot{display:inline-block; width:8px; height:8px; border-radius:50%; background:#c0392b; margin-right:8px; vertical-align:middle;}
.approver-toggle{display:inline-flex; align-items:center; gap:6px; font-size:0.78rem; font-weight:600; color:var(--body-text); cursor:pointer;}
.approver-toggle input{accent-color:var(--teal);}
.applicants-new{text-decoration:none; white-space:nowrap; padding:9px 16px; font-size:0.86rem;}
.recruit-alerts{border-left:4px solid #c0392b;}
.applicant-head{display:flex; justify-content:space-between; align-items:flex-start; gap:16px; flex-wrap:wrap; margin:8px 0 22px;}
.applicant-grid{display:grid; grid-template-columns:minmax(0,3fr) minmax(0,2fr); gap:20px; align-items:start;}
.stage-guide{margin-top:18px; padding:14px 16px; background:var(--pale); border-radius:8px;}
.stage-guide-title{font-size:0.8rem; font-weight:800; color:var(--dark); margin-bottom:8px;}
.stage-guide ol{margin:0; padding-left:18px; font-size:0.85rem; color:var(--body-text); line-height:1.5;}
.stage-guide li{margin-bottom:6px;}
.email-actions{display:flex; gap:10px; align-items:center; flex-wrap:wrap;}
.timeline-item{padding:10px 0 10px 14px; border-left:2px solid var(--line); margin-left:4px;}
.timeline-item.timeline-status{border-left-color:var(--teal);}
.timeline-item.timeline-email{border-left-color:#d9822b;}
.timeline-text{font-size:0.88rem; color:var(--ink); white-space:pre-wrap; overflow-wrap:anywhere;}
.timeline-meta{font-size:0.76rem; color:var(--muted); margin-top:2px;}
.source-item{padding:12px 0; border-top:1px solid var(--line);}
.source-item:first-of-type{border-top:none;}
.source-fields summary{cursor:pointer; font-size:0.82rem; color:var(--teal); font-weight:700; margin-top:6px;}
@media (max-width:960px){ .applicant-grid{grid-template-columns:1fr;} }

/* Recruitment: stage stepper + checklist */
.stage-stepper{display:flex; list-style:none; margin:4px 0 18px; padding:0; gap:4px; counter-reset:none;}
.stage-stepper li{flex:1 1 0; display:flex; flex-direction:column; align-items:center; gap:6px; text-align:center; position:relative; font-size:0.72rem; color:var(--muted); font-weight:600;}
.stage-stepper li::before{content:''; position:absolute; top:15px; left:-50%; width:100%; height:2px; background:var(--line); z-index:0;}
.stage-stepper li:first-child::before{display:none;}
.stage-stepper li.done::before, .stage-stepper li.current::before{background:var(--teal);}
.stage-num{position:relative; z-index:1; width:26px; height:26px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:var(--white); border:2px solid var(--line); font-weight:800; font-size:0.78rem; color:var(--muted);}
.stage-stepper li.done .stage-num{background:var(--teal); border-color:var(--teal); color:#fff;}
.stage-stepper li.current .stage-num{border-color:var(--teal); color:var(--teal); box-shadow:0 0 0 3px rgba(79,145,160,.18);}
.stage-stepper li.current .stage-name{color:var(--dark); font-weight:800;}
.checklist-head{display:flex; justify-content:space-between; align-items:center; gap:10px; flex-wrap:wrap; font-size:0.86rem; color:var(--dark); margin-bottom:6px;}
.checklist-progress{font-size:0.76rem; font-weight:700; color:#b45309; background:#fdf1e3; padding:3px 9px; border-radius:999px;}
.checklist-progress.complete{color:#2f7a4a; background:#eef6f0;}
.check-item{display:flex; gap:10px; align-items:flex-start; padding:9px 0; border-top:1px solid var(--line); cursor:pointer; font-size:0.86rem; color:var(--ink); line-height:1.45;}
.check-item:first-child{border-top:none;}
.check-item input{margin-top:3px; width:16px; height:16px; flex:0 0 16px; accent-color:var(--teal); cursor:pointer;}
.check-item input:disabled{cursor:not-allowed;}
.check-item.done .check-text{color:var(--body-text);}
.check-item.optional .check-text{color:var(--body-text);}
.check-tag{display:inline-block; font-size:0.68rem; font-weight:700; color:var(--muted); background:var(--pale); border-radius:999px; padding:1px 7px; margin-left:4px; white-space:nowrap;}
.check-by{display:block; font-size:0.72rem; color:#2f7a4a; margin-top:2px;}
.past-checklists{margin-top:16px;}
.past-checklists summary{cursor:pointer; font-size:0.82rem; font-weight:700; color:var(--teal);}
@media (max-width:560px){ .stage-name{display:none;} .stage-stepper li.viewing .stage-name{display:block;} }
.stage-chip{font-size:0.72rem; font-weight:700; color:var(--dark); background:var(--pale); border-radius:999px; padding:3px 9px; white-space:nowrap;}
.stage-stepper button{all:unset; display:flex; flex-direction:column; align-items:center; gap:6px; cursor:pointer; border-radius:8px; padding:2px 4px 6px; width:100%;}
.stage-stepper button:hover .stage-name{color:var(--dark);}
.stage-stepper button:focus-visible{outline:2px solid var(--teal); outline-offset:2px;}
.stage-stepper li.viewing button{background:var(--pale);}
.stage-stepper li.viewing .stage-name{color:var(--dark); font-weight:800; text-decoration:underline; text-underline-offset:3px;}
.checklist.is-preview .check-item{cursor:default; opacity:.75;}
/* Applicant page: email drafting on the right, details folded */
.applicant-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);}
.email-draft textarea#apBody{min-height:320px; font-size:0.88rem; line-height:1.5;}
.fold-panel > summary{list-style:none; cursor:pointer; display:flex; flex-direction:column; gap:3px;}
.fold-panel > summary::-webkit-details-marker{display:none;}
.fold-title{font-weight:800; font-size:1.02rem; color:var(--ink);}
.fold-title::after{content:' ▸'; color:var(--teal); font-size:0.85rem;}
.fold-panel[open] .fold-title::after{content:' ▾';}
.fold-summary{font-size:0.8rem; color:var(--muted); overflow-wrap:anywhere;}
.fold-panel[open] > summary{margin-bottom:14px;}

/* Requests to other people */
.check-row{border-top:1px solid var(--line);}
.check-row:first-child{border-top:none;}
.check-row .check-item{border-top:none;}
.req-area{margin:-2px 0 10px 26px;}
.req-summary{display:flex; flex-wrap:wrap; gap:6px; align-items:center; font-size:0.76rem; color:var(--muted); margin-bottom:6px;}
.req-person{padding:2px 8px; border-radius:999px; font-weight:700; background:var(--pale); color:var(--dark);}
.req-person.waiting{background:#fdf1e3; color:#b45309;}
.req-person.resp-done, .req-person.resp-approved{background:#eef6f0; color:#2f7a4a;}
.req-person.resp-changes{background:#fbeaea; color:#b3402f;}
.req-comment{flex-basis:100%; font-size:0.8rem; color:var(--body-text); font-style:italic; margin:2px 0;}
.req-email{flex-basis:100%; font-weight:700; color:#b45309;}
.req-email.sent{color:#2f7a4a;}
.req-email a{color:inherit; text-decoration:underline;}
.req-open{all:unset; cursor:pointer; font-size:0.78rem; font-weight:800; color:var(--teal);}
.req-open:hover{text-decoration:underline;}
.req-open:focus-visible{outline:2px solid var(--teal); outline-offset:2px;}
.req-form{margin-top:8px; padding:12px; background:var(--pale); border-radius:8px; display:flex; flex-direction:column; gap:8px;}
.req-people{display:flex; flex-wrap:wrap; gap:6px 14px;}
.req-message{padding:8px 10px; border:1px solid var(--line); border-radius:6px; font:inherit; font-size:0.85rem;}
.req-form .btn-primary{align-self:flex-start; padding:8px 16px; font-size:0.84rem;}
.bell-link{position:relative; text-decoration:none !important;}
.bell-count{position:absolute; top:-8px; right:-12px; min-width:17px; padding:0 5px; border-radius:999px; background:#c0392b; color:#fff; font-size:0.66rem; font-weight:800; line-height:17px; text-align:center;}
.request-card{padding:14px 0; border-top:1px solid var(--line); display:flex; flex-direction:column; gap:6px;}
.request-card:first-of-type{border-top:none;}
.request-kind{font-size:0.74rem; font-weight:800; color:#b45309; text-transform:uppercase; letter-spacing:.03em;}
.request-item{font-weight:700; color:var(--ink); font-size:0.92rem;}
.request-comment{padding:8px 10px; border:1px solid var(--line); border-radius:6px; font:inherit; font-size:0.86rem; width:100%;}
.mini-task-row.is-unread{background:#fffaf3;}
.req-form[hidden]{display:none;}
.req-due{font-size:0.82rem; font-weight:700; color:var(--dark);}
.req-due input{margin-left:8px; padding:6px 8px; border:1px solid var(--line); border-radius:6px; font:inherit; font-size:0.84rem;}
.req-message-label{font-size:0.82rem; font-weight:700; color:var(--dark);}
.req-form textarea.req-message{width:100%; line-height:1.45; resize:vertical;}
.due-tag{display:inline-block; padding:1px 8px; border-radius:999px; background:var(--pale); color:var(--dark); font-weight:700; font-size:0.72rem; text-transform:none; letter-spacing:0;}
.due-tag.overdue{background:#fbeaea; color:#b3402f;}
.request-message{white-space:pre-wrap; font-size:0.86rem; color:var(--body-text); background:var(--pale); border-radius:8px; padding:10px 12px; line-height:1.5;}
.outcome-choices{display:flex; flex-wrap:wrap; gap:8px;}
.outcome-choice{display:inline-flex; align-items:center; gap:6px; padding:6px 10px; border:1px solid var(--line); border-radius:999px; font-size:0.82rem; font-weight:600; cursor:pointer;}
.outcome-choice:has(input:checked){border-color:var(--teal); background:#e8f3f5; color:var(--dark);}
.outcome-choice input{accent-color:var(--teal);}
.req-email-opt.is-off{opacity:.7; cursor:not-allowed;}

/* Checklist: open vs done at a glance */
.check-item .check-text{color:var(--ink); font-weight:600;}
.check-item.optional .check-text{color:var(--body-text); font-weight:500;}
.check-row:has(.check-item.done){background:#f3f9f5;}
.check-item.done .check-text, .check-item.done.optional .check-text{color:#8b9ba4; font-weight:500;}
.check-item.done .check-tag{opacity:.6;}
.check-item.done .check-by{color:#2f7a4a; font-weight:600;}
.check-row{padding:0 8px; margin:0 -8px; border-radius:6px;}
.stage-actions{display:flex; justify-content:space-between; align-items:flex-start; gap:12px; flex-wrap:wrap; margin-top:14px; padding-top:14px; border-top:1px solid var(--line);}
.stage-actions .btn-primary:disabled{opacity:.45; cursor:not-allowed;}
.close-actions{display:flex; align-items:center; gap:6px; flex-wrap:wrap; font-size:0.78rem; color:var(--muted);}
.close-actions button{all:unset; cursor:pointer; padding:4px 10px; border:1px solid var(--line); border-radius:999px; font-weight:700; color:var(--body-text);}
.close-actions button:hover{border-color:#c0392b; color:#c0392b;}
.close-actions button:focus-visible{outline:2px solid var(--teal); outline-offset:2px;}
.more-status{margin-top:14px;}
.more-status summary{cursor:pointer; font-size:0.8rem; font-weight:700; color:var(--muted);}
.timeline.hide-ticks .timeline-check{display:none;}
.timeline-item.timeline-note{border-left-color:#7a5cc0;}
#naReferral[hidden]{display:none;}
.tpl-refs{margin:-4px 0 8px 26px; font-size:0.76rem; color:var(--body-text);}
.tpl-refs a{color:var(--teal); font-weight:700; text-decoration:underline; text-underline-offset:2px;}
.check-row:has(.check-item.done) .tpl-refs{opacity:.6;}
/* Role & offer details */
.role-block{margin:-2px 0 10px 26px; padding:10px 12px; border:1px dashed var(--line); border-radius:8px; background:var(--white);}
.role-summary{font-size:0.8rem; color:var(--body-text);}
.role-line{margin-top:3px; overflow-wrap:anywhere;}
.role-line span{color:var(--muted); font-weight:700;}
.role-form{margin-top:10px;}
.role-form[hidden]{display:none;}
.role-grid{display:grid; grid-template-columns:1fr 1fr; gap:8px 12px; margin-bottom:10px;}
.role-field{display:flex; flex-direction:column; gap:4px; font-size:0.76rem; font-weight:700; color:var(--dark);}
.role-field.wide{grid-column:1 / -1;}
.role-field input, .role-field select, .role-field textarea{padding:7px 9px; border:1px solid var(--line); border-radius:6px; font:inherit; font-weight:400; font-size:0.84rem; color:var(--dark);}
@media (max-width:560px){ .role-grid{grid-template-columns:1fr;} }
.role-line ul{margin:2px 0 0 18px; padding:0;}
.request-role{margin-left:0;}

/* Interview 1 / 2 主题 */
.check-theme{display:block;margin-top:4px;padding:3px 8px;border-left:3px solid var(--teal);background:rgba(74,143,163,.08);border-radius:0 4px 4px 0;font-size:.85em;font-weight:400;color:var(--ink);}
.check-theme strong{color:var(--teal);font-weight:600;}
.check-item.done .check-theme{opacity:.7;}

/* 清单项的说明和文件链接（Further review 等） */
.check-details{margin:6px 0 4px 30px;padding:6px 10px;border-left:3px solid var(--teal);background:rgba(74,143,163,.06);border-radius:0 4px 4px 0;font-size:.85rem;color:var(--ink);}
.check-details-text{white-space:pre-line;margin-bottom:2px;}
.check-details .req-open{padding:0;}
.check-details a{color:var(--teal);font-weight:700;}
.check-details-form{margin:6px 0 4px 30px;display:grid;gap:8px;}
.check-details-form[hidden]{display:none;}
.check-details-form em{font-style:normal;color:var(--muted);font-weight:400;}

/* 申请人页右侧的 Notes */
.notes-list{margin-top:12px;display:grid;gap:8px;max-height:320px;overflow:auto;}
.note-item{padding:8px 10px;background:var(--bg-soft,#f4f8f9);border-radius:6px;font-size:.85rem;}
.note-text{white-space:pre-line;color:var(--ink);margin-bottom:2px;}

/* Offer 起草提醒 */
.check-reminders{margin:6px 0 4px 30px;font-size:.84rem;color:var(--ink);}
.check-reminders summary{cursor:pointer;color:var(--teal);font-weight:700;}
.check-reminders ul{margin:6px 0 0 18px;padding:0;display:grid;gap:3px;}
.check-reminders ul{list-style:disc;}
.check-link-hint{margin:4px 0 2px 30px;font-size:.8rem;color:var(--muted);}
.check-resources{margin:4px 0 2px 30px;font-size:.84rem;}
.check-resources a{color:var(--teal);font-weight:700;}
.is-disabled{opacity:.45;pointer-events:auto;cursor:not-allowed;}
#apMarkSent:disabled{opacity:.45;cursor:not-allowed;}
.request-checklist{margin:8px 0;padding:8px 12px;border:1px dashed var(--line,#cfdde2);border-radius:8px;font-size:.88rem;}
.request-checklist ul{list-style:none;margin:6px 0;padding:0;display:grid;gap:4px;}
.request-checklist label{display:flex;gap:8px;align-items:center;cursor:pointer;}

/* Stage 4：志愿者档案 */
.archive-panel{margin-top:14px;padding:14px 16px;border:1px solid var(--line,#d7e3e7);border-radius:10px;background:#fbfdfd;}
.archive-panel h4{margin:0 0 4px;font-size:1rem;color:var(--ink);}
.archive-section{margin-top:12px;}
.archive-section>strong{display:block;font-size:.8rem;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin-bottom:4px;}
.archive-row{display:grid;grid-template-columns:200px 1fr;gap:10px;padding:5px 0;border-bottom:1px solid #edf3f5;font-size:.88rem;}
.archive-row>span{color:var(--muted);}
.archive-row a{color:var(--teal);font-weight:700;}
.archive-missing{color:#b9802a;font-size:.84rem;}
.archive-note{color:var(--muted);font-size:.84rem;}
.record-block{margin-left:0;}
@media (max-width:640px){.archive-row{grid-template-columns:1fr;gap:2px;}}
.archive-title{font-size:.78rem;text-transform:uppercase;letter-spacing:.05em;color:var(--teal);font-weight:800;margin:0 0 2px;padding-bottom:4px;border-bottom:2px solid #e3eef1;}
.archive-section{margin-top:16px;}
.req-people-status{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px;}
.req-person{font-size:.78rem;font-weight:700;padding:2px 8px;border-radius:999px;}
.req-person.done{background:#e6f4ea;color:#2e7d4f;}
.req-person.waiting{background:#fdf0e1;color:#b9661f;}