/* Journey workflow page (#/trips/<id>) — reuses the .pp-* layout from proposal-page.css */
.tw-steps{list-style:none;margin:0;padding:2px 2px 8px;display:flex;gap:6px;overflow-x:auto;scrollbar-width:none}
.tw-steps::-webkit-scrollbar{display:none}
.tw-steps li{flex:1 0 auto}
.tw-step-btn{width:100%;display:flex;align-items:center;gap:8px;padding:9px 12px;border:1px solid var(--border);border-radius:12px;background:transparent;color:var(--muted);font:inherit;font-size:12.5px;white-space:nowrap;cursor:pointer;transition:background-color .16s ease,border-color .16s ease,color .16s ease}
.tw-step-btn:hover{color:var(--text);background:var(--surface)}
.tw-dot{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--surface2);font-size:11px;font-weight:600;flex:none}
.tw-step-btn.done .tw-dot{background:var(--accent);color:var(--accent-ink,#20231a)}
.tw-step-btn.current{color:var(--text);border-color:var(--accent)}
.tw-step-btn.current .tw-dot{box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 55%,transparent)}
.tw-step-btn.viewing{background:var(--surface);color:var(--text)}
.tw-list-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.tw-list-head strong{display:block;font-size:14px}.tw-list-head small{display:block;color:var(--muted);font-size:12px;margin-top:2px}
.tw-steps-list{display:grid;gap:8px}
.tw-row{display:flex;align-items:center;gap:6px}
.tw-row .tw-check{flex:1;min-width:0;text-align:left}
.tw-check[disabled]{opacity:.7;cursor:default}
.tw-add{display:flex;gap:8px}.tw-add .input{flex:1;min-width:0}
.tw-chapters{display:grid;gap:8px}
.tw-chapter{display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:12px;align-items:center;padding:11px 12px;border:1px solid var(--border);border-radius:12px;background:transparent;color:var(--text);font:inherit;font-size:13px;text-align:left;cursor:pointer;transition:background-color .16s ease,border-color .16s ease}
.tw-chapter:hover{background:var(--surface)}
.tw-chapter .sb-num{color:var(--muted);font-variant-numeric:tabular-nums}
.tw-bar{height:8px;border-radius:999px;background:var(--surface2);overflow:hidden}
.tw-bar i{display:block;height:100%;border-radius:inherit;background:var(--accent);transition:width .4s ease}
.tw-send{display:grid;gap:14px}
@media(max-width:640px){.tw-add{flex-direction:column}.tw-add .btn{width:100%}.tw-chapter{grid-template-columns:30px minmax(0,1fr) auto;gap:10px}}

/* Board view on the Journeys list */
.trip-cols{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(236px,1fr);gap:12px;overflow-x:auto;padding:2px 2px 10px;scroll-snap-type:x proximity}
.trip-cols.single{grid-auto-flow:row;grid-auto-columns:auto;grid-template-columns:minmax(0,1fr)}
.trip-col{display:grid;align-content:start;gap:10px;padding:12px;border:1px solid var(--border);border-radius:16px;background:var(--surface);scroll-snap-align:start;min-width:0}
.trip-col>header{display:flex;justify-content:space-between;align-items:center;font-size:13px}
.trip-col>header span{color:var(--muted);font-size:12px}
.trip-col .journey-card{width:100%;text-align:left}

/* Request workflow page (#/requests/<name>) */
.rq-actions{display:grid;grid-template-columns:1fr;gap:8px}.rq-actions .btn{width:100%}
.rq-tpls{display:flex;flex-wrap:wrap;align-items:center;gap:8px}.rq-tpls>span{font-size:12px;color:var(--muted);margin-right:4px}
.rq-tpls .btn.active{background:var(--surface2);border-color:var(--accent)}
.rq-lost{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;border:1px solid #c0675b55;border-radius:14px;background:#c0675b14}
.rq-lost strong{display:block;font-size:13px}.rq-lost small{color:var(--muted);font-size:12px}

/* ---- Workflow pages: hover, focus and feedback (all themes) ---- */
.pp-page{--tw-hover:color-mix(in srgb,var(--text) 6%,transparent);--tw-hover-strong:color-mix(in srgb,var(--text) 11%,transparent);--tw-line-hover:color-mix(in srgb,var(--text) 24%,var(--border))}
.pp-status{display:grid}
.pp-back:hover{background:var(--tw-hover);color:var(--text)}
.tw-step-btn:hover{background:var(--tw-hover);border-color:var(--tw-line-hover);color:var(--text)}
.tw-step-btn.current:hover{border-color:var(--accent)}
.tw-step-btn:active{transform:scale(.98)}
.tw-check{border-radius:10px!important;transition:background-color .16s ease,transform .16s ease}
.tw-check:not([disabled]):hover{background:var(--tw-hover)!important}
.tw-check:not([disabled]):active{transform:scale(.99)}
.tw-chapter:hover{background:var(--tw-hover);border-color:var(--tw-line-hover)}
.tw-chapter:active{transform:scale(.995)}
.pp-x:hover{background:var(--tw-hover)!important}
.pp-day:hover,.pp-line:hover .input{border-color:var(--tw-line-hover)}
.trip-col .journey-card:hover{background:var(--tw-hover)}
.tw-step-btn:focus-visible,.tw-check:focus-visible,.tw-chapter:focus-visible,.pp-back:focus-visible,.pp-x:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@keyframes tw-pop{0%{transform:scale(.78)}60%{transform:scale(1.14)}100%{transform:scale(1)}}
@keyframes tw-flash{from{background:color-mix(in srgb,var(--accent) 30%,transparent)}to{background:transparent}}
@keyframes tw-new{from{opacity:0;transform:translateY(-6px);background:color-mix(in srgb,var(--accent) 22%,transparent)}to{opacity:1;transform:none;background:transparent}}
@media(prefers-reduced-motion:no-preference){
  .tw-pop .cal-box{animation:tw-pop .3s cubic-bezier(.3,1.5,.5,1)}
  .tw-flash{animation:tw-flash .9s ease-out}
  .pp-history li.tw-new{animation:tw-new .5s cubic-bezier(.2,.7,.2,1);border-radius:8px}
  .tw-step-btn,.tw-dot{transition:background-color .2s ease,border-color .2s ease,color .2s ease,box-shadow .2s ease}
  .tw-dot{transition-property:background-color,color,box-shadow,transform}
  .tw-step-btn:hover .tw-dot{transform:scale(1.06)}
}

/* Calendar activity workflow (#/calendar/<activity>) */
.ca-tasks{display:grid;gap:8px}
.ca-task{display:flex;align-items:center;gap:10px}
.ca-task .tw-check{flex:1;min-width:0}
.ca-task .tw-check>span:last-child{display:grid;gap:2px}.ca-task .tw-check small{color:var(--muted);font-size:12px}
.ca-task.done strong{text-decoration:line-through;opacity:.6}
.ca-newtask{display:grid;gap:12px;padding-top:12px;border-top:1px solid var(--border)}
.ca-task-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:10px;align-items:end}
.ca-totask{white-space:nowrap;color:var(--muted)}
.ca-totask:hover{background:var(--tw-hover)!important;color:var(--text)}
.ca-linked{flex:none}
.ca-danger-actions{display:flex;gap:6px;flex-wrap:wrap}
.cal-done{opacity:.62}
.cal-cancelled{opacity:.42}.cal-cancelled strong,.cal-cancelled span{text-decoration:line-through}
@media(max-width:640px){.ca-task-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.ca-task-row .btn{grid-column:1/-1}}

/* Client workflow page (#/clients/<id>) */
.cl-links{display:grid;gap:8px}
.cl-link{display:grid;grid-template-columns:84px minmax(0,1fr) auto;gap:12px;align-items:center;padding:11px 12px;border:1px solid var(--border);border-radius:12px;background:transparent;color:var(--text);font:inherit;text-align:left;cursor:pointer;transition:background-color .16s ease,border-color .16s ease,transform .16s ease}
.cl-link:hover{background:var(--tw-hover);border-color:var(--tw-line-hover)}
.cl-link:active{transform:scale(.995)}
.cl-link:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.cl-link-kind{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.cl-link strong{display:block;font-size:13px;font-weight:600}.cl-link small{display:block;color:var(--muted);font-size:12px;margin-top:2px}
.cl-link-go{color:var(--muted);font-size:18px;transition:transform .16s ease}.cl-link:hover .cl-link-go{transform:translateX(3px)}
.cl-note-add{display:grid;gap:8px;justify-items:end}.cl-note-add .input{width:100%;box-sizing:border-box}
.cl-notes{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.cl-notes li{display:grid;grid-template-columns:96px minmax(0,1fr);gap:10px;font-size:13px}
.cl-notes li span{color:var(--muted)}.cl-notes li p{margin:0;overflow-wrap:anywhere;line-height:1.5}
.cl-consent-row{align-items:flex-start}.cl-consent-row small{display:block;color:var(--muted);font-size:12px;margin-top:2px}
@media(max-width:640px){.cl-link{grid-template-columns:70px minmax(0,1fr) auto;gap:10px}.cl-notes li{grid-template-columns:78px minmax(0,1fr)}}

/* Task workflow page (#/tasks/<id>) and task list additions */
.tk-waiting{margin-top:12px}
.tk-hint{padding:10px 12px;border-radius:10px;background:color-mix(in srgb,var(--accent) 16%,transparent);font-size:13px}
.tk-overdue{border-color:#c0675b55;background:#c0675b14}
