/* REQWRECK agency workspace (reqwreck.com/account/...): tabs, leads table + board, lead page, what changed, wins, team, settings. */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.ws-main { padding: 26px 0 80px; }
.ws-top { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.ws-top .eyebrow { margin: 0; }
.ws-who { margin: 0; font-size: 14px; color: var(--muted); }
.ws-tabs { display: flex; gap: 4px; margin: 12px 0 26px; border-bottom: 3px solid var(--ink); overflow-x: auto; scrollbar-width: thin; }
.ws-tabs a { flex: none; padding: 10px 14px 9px; font-weight: 700; font-size: 14px; text-decoration: none; border: 2px solid transparent; border-bottom: 0;
  border-radius: 6px 6px 0 0; color: var(--muted); white-space: nowrap; }
.ws-tabs a:hover { color: var(--ink); background: rgba(252, 187, 12, .25); }
.ws-tabs a[aria-current] { color: var(--ink); background: var(--yellow); border-color: var(--ink); }
.ws-badge { display: inline-grid; place-items: center; min-width: 20px; height: 20px; padding: 0 5px; margin-left: 4px; border-radius: 10px; background: #C8102E;
  color: #FFF; font-size: 11px; }
.ws-title { margin: 0 0 6px; }
.ws-sub { color: var(--muted); margin: 0 0 18px; font-size: 15px; }
.ws-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; margin-bottom: 14px; }
.ws-head-actions { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.ws-back { margin: 0 0 8px; font-size: 14px; font-weight: 600; }
.ws-back a { text-decoration: none; }
.h4 { font-size: 21px; margin: 0 0 10px; }
.h5 { font-size: 16px; margin: 18px 0 6px; }
.input-sm { min-height: 38px; padding: 6px 10px; font-size: 14px; }
.linkish { background: none; border: 0; padding: 0; font: inherit; font-size: 14px; font-weight: 600; color: var(--ink); text-decoration: underline;
  text-decoration-color: var(--yellow); text-decoration-thickness: 2px; text-underline-offset: 3px; cursor: pointer; }
form.inline { display: inline; }
.is-due { color: #C8102E; font-weight: 700; }
.ws-saved { background: #E6F4EA; color: var(--ok); border-left: 4px solid var(--ok); padding: 8px 12px; font-weight: 600; font-size: 14px; }
.ws-flag { background: #FFF3B0; border: 2px solid var(--ink); padding: 10px 14px; font-size: 15px; }
.ws-box { background: var(--white); border: 2px solid var(--ink); box-shadow: 6px 6px 0 var(--ink); padding: 18px 20px; margin: 0 0 22px; }
.ws-box > :last-child { margin-bottom: 0; }
.ws-box-hot { box-shadow: 6px 6px 0 var(--yellow); }
.ws-stack { display: grid; gap: 12px; max-width: 420px; }
.ws-stack label { display: flex; flex-direction: column; gap: 6px; font-weight: 600; font-size: 14px; }
.ws-stack .tick { flex-direction: row; font-weight: 500; }
.ws-stack .btn { justify-self: start; }
.ws-inline-form { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.ws-inline-form .input { flex: 1; min-width: 180px; }
.ws-links { display: flex; gap: 8px 16px; flex-wrap: wrap; font-weight: 600; font-size: 15px; }
.ws-links a { text-decoration-color: var(--yellow); text-decoration-thickness: 2px; text-underline-offset: 3px; }

/* overview cards */
.ws-cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin: 18px 0 8px; }
.ws-card { display: flex; flex-direction: column; gap: 4px; padding: 16px 18px; background: var(--white); border: 2px solid var(--ink); box-shadow: 5px 5px 0 var(--ink);
  text-decoration: none; font-weight: 600; font-size: 14px; transition: transform .12s, box-shadow .12s; }
.ws-card:hover { transform: translate(-2px, -2px); box-shadow: 7px 7px 0 var(--ink); }
.ws-card-big { font-size: 40px; line-height: 1; }
.ws-card-hot { background: var(--yellow); }
.ws-card-quiet { color: var(--muted); }

/* filters */
.ws-filters { display: flex; flex-wrap: wrap; gap: 10px 12px; align-items: flex-end; padding: 14px 16px; background: var(--white); border: 2px solid var(--ink); margin: 0 0 12px; }
.ws-filters label { display: flex; flex-direction: column; gap: 4px; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.ws-filters .tick { flex-direction: row; text-transform: none; letter-spacing: 0; font-size: 14px; font-weight: 500; align-items: center; }
.ws-filters .tick input { margin: 0; }
.ws-filters select.input-sm { min-width: 120px; }
.wf-q { flex: 1 1 220px; }
.wf-range { display: inline-flex; align-items: center; gap: 6px; text-transform: none; font-weight: 600; }
.wf-range .input { width: 70px; }
.wf-checks { display: flex; flex-wrap: wrap; gap: 8px 16px; flex-basis: 100%; }
.wf-go { display: flex; gap: 12px; align-items: center; font-size: 14px; font-weight: 600; }
.ws-views { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 0 0 16px; }
.ws-chip { display: inline-flex; align-items: center; gap: 2px; background: var(--ink); color: var(--paper); border-radius: 18px; padding: 4px 6px 4px 14px; font-size: 13px; font-weight: 700; }
.ws-chip a { color: var(--paper); text-decoration: none; }
.ws-chip button { background: none; border: 0; color: var(--yellow); font-size: 16px; line-height: 1; padding: 2px 6px; cursor: pointer; }
.ws-saveview { display: flex; gap: 6px; }
.ws-saveview .input { width: 280px; max-width: 60vw; }
.ws-viewtoggle { display: inline-flex; border: 2px solid var(--ink); border-radius: var(--radius); overflow: hidden; }
.ws-viewtoggle a { padding: 6px 14px; font-size: 13px; font-weight: 700; text-decoration: none; background: var(--white); }
.ws-viewtoggle a + a { border-left: 2px solid var(--ink); }
.ws-viewtoggle a[aria-current] { background: var(--yellow); }
.ws-menu { position: relative; }
.ws-menu summary { list-style: none; cursor: pointer; }
.ws-menu summary::-webkit-details-marker { display: none; }
.ws-menu-list { position: absolute; right: 0; top: calc(100% + 6px); z-index: 20; width: 230px; background: var(--white); border: 2px solid var(--ink);
  box-shadow: 5px 5px 0 var(--ink); padding: 6px; }
.ws-menu-list a { display: block; padding: 8px 10px; text-decoration: none; font-weight: 600; font-size: 14px; }
.ws-menu-list a:hover { background: var(--yellow); }
.ws-menu-list p { margin: 4px 10px 6px; font-size: 12px; color: var(--muted); }

/* status colors */
.st-new { --st: #E2DDD0; } .st-called { --st: #BFD7F5; } .st-emailed { --st: #D6C8F2; } .st-meeting { --st: #FCBB0C; }
.st-client { --st: #9ED9B3; } .st-not_interested { --st: #EFC2BE; }
select[class*="st-"] { background-color: var(--st); font-weight: 600; }
.st-text { display: inline-block; margin-top: 2px; padding: 1px 8px; border-radius: 10px; background: var(--st); color: var(--ink); font-weight: 700; }
.ws-status { margin: 0; }
.ws-status-big { display: flex; flex-direction: column; gap: 4px; font-weight: 700; font-size: 13px; }
.ws-status-big .input { min-width: 200px; }

/* leads table */
.ws-table td { vertical-align: top; }
.ws-table td small a { text-decoration: none; }
.ws-table tr.is-excluded td { opacity: .55; }
.ws-table select.input-sm { min-width: 150px; }

/* board */
.ws-board { position: relative; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(168px, 1fr); gap: 12px; overflow-x: auto; padding: 0 0 12px; }
.ws-col { position: relative; padding: 0; background: rgba(20, 22, 26, .04); border: 2px solid var(--ink); min-height: 220px; display: flex; flex-direction: column; }
.ws-col.drag-over { background: rgba(252, 187, 12, .25); }
.ws-col-head { margin: 0; padding: 10px 12px; font: 700 14px/1.2 var(--body); background: var(--st); border-bottom: 2px solid var(--ink); display: flex; justify-content: space-between; }
.ws-col-head span { font-family: var(--display); font-size: 18px; }
.ws-col-cards { padding: 10px; display: grid; gap: 10px; align-content: start; flex: 1; }
.ws-card-lead { background: var(--white); border: 2px solid var(--ink); box-shadow: 3px 3px 0 var(--ink); padding: 10px 12px; cursor: grab; font-size: 13px; }
.ws-card-lead.dragging { opacity: .4; }
.ws-card-lead p { margin: 2px 0 0; }
.ws-cl-company { font-weight: 700; font-size: 15px; text-decoration: none; }
.ws-cl-role { color: var(--ink); }
.ws-cl-meta, .ws-cl-who { color: var(--muted); }
.ws-cl-meta .days { font-weight: 700; color: var(--ink); }
.ws-cl-move { margin-top: 8px; }
.ws-cl-move select { width: 100%; }
.ws-hint { margin-top: 6px; }

/* lead page */
.ws-lead-grid { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 22px; align-items: start; }
.ws-dl { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 18px; margin: 0 0 12px; }
.ws-dl dt { font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.ws-dl dd { margin: 2px 0 0; font-weight: 600; }
.ws-dl dd small { color: var(--muted); font-weight: 400; }
.ws-dl .wide { grid-column: 1 / -1; }
.ws-contact { font-size: 17px; }
.ws-note-form { display: grid; gap: 8px; margin: 0 0 14px; }
.ws-note-form .btn { justify-self: start; }
.ws-notes { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.ws-notes li { border-left: 4px solid var(--yellow); padding: 4px 0 4px 12px; }
.ws-notes li.auto { border-left-color: #E2DDD0; }
.ws-notes li.auto .ws-note-text { color: var(--muted); font-size: 14px; }
.ws-note-meta { margin: 0; font-size: 12px; color: var(--muted); }
.ws-note-text { margin: 2px 0 0; white-space: pre-wrap; }

/* what changed */
.ws-change-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.ws-change-grid .ws-box { margin: 0; }
.ws-count { display: inline-block; min-width: 36px; padding: 0 6px; margin-right: 6px; background: var(--ink); color: var(--yellow); text-align: center; }
.ws-change-list { list-style: none; padding: 0; margin: 10px 0 0; display: grid; gap: 8px; max-height: 420px; overflow-y: auto; }
.ws-change-list a { font-weight: 700; text-decoration: none; }
.ws-change-list small { display: block; color: var(--muted); font-size: 13px; }
.ws-tag { display: inline-block; padding: 0 6px; border-radius: 8px; font-weight: 700; font-size: 11px; background: #E2DDD0; color: var(--ink); }
.ws-tag-closed { background: #9ED9B3; } .ws-tag-aged_out { background: #FCBB0C; }

/* already working with */
.ws-ex-form { display: grid; gap: 14px; max-width: 640px; }
.ws-ex-form label { display: flex; flex-direction: column; gap: 6px; font-weight: 600; font-size: 14px; }
.ws-ex-form label small { font-weight: 400; color: var(--muted); }
.ws-ex-form .btn { justify-self: start; }

/* wins */
.ws-roi { background: var(--ink); color: var(--paper); border: 2px solid var(--ink); box-shadow: 8px 8px 0 var(--yellow); padding: 22px 24px; margin: 6px 0 26px; }
.ws-roi-big { color: var(--yellow); font-size: clamp(28px, 4vw, 44px); margin: 0 0 16px; line-height: 1; }
.ws-roi-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin: 0; }
.ws-roi-stats dt { font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #C9C6BE; }
.ws-roi-stats dd { margin: 2px 0 0; font-size: 30px; }
.ws-win-form { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 14px; align-items: end; }
.ws-win-form label { display: flex; flex-direction: column; gap: 6px; font-weight: 600; font-size: 14px; }
.ws-win-form .tick { flex-direction: row; font-weight: 500; }
.ws-win-form .wide { grid-column: 1 / -1; }
.ws-win-form .btn { justify-self: start; }
.ws-win-form .plan-toggle { flex-direction: row; flex-wrap: wrap; }
.ws-win-form .plan-toggle legend { width: 100%; }
.ws-win-form .plan-toggle label { padding: 8px 10px; min-height: 48px; flex: 1; white-space: nowrap; }

/* team + settings */
tr.is-pending td { color: var(--muted); }
.ws-invite { max-width: 640px; margin-top: 22px; }
.ws-settings { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 22px; align-items: start; }
.ws-copy { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.ws-copy code { flex: 1; min-width: 0; overflow-x: auto; white-space: nowrap; background: var(--paper); border: 1px solid var(--line); padding: 8px 10px; font-size: 12px; }

@media (max-width: 960px) {
  .ws-cards { grid-template-columns: repeat(2, 1fr); }
  .ws-lead-grid, .ws-change-grid, .ws-settings { grid-template-columns: 1fr; }
  .ws-win-form { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 720px) {
  .ws-cards { grid-template-columns: 1fr 1fr; gap: 10px; }
  .ws-card { padding: 12px; box-shadow: 4px 4px 0 var(--ink); }
  .ws-card-big { font-size: 30px; }
  .ws-filters { padding: 12px; }
  .ws-filters > label:not(.wf-q) { flex: 1 1 45%; }
  .ws-filters select.input-sm { min-width: 0; width: 100%; }
  .ws-saveview { flex-wrap: wrap; }
  .acct-table.ws-table th.c-status, .acct-table.ws-table td.c-status { display: table-cell; }  /* the Lists table's phone rule hides columns 3-6 */
  .acct-table.ws-table .c-days, .acct-table.ws-table .c-contact, .acct-table.ws-table .c-miles, .acct-table.ws-table .c-follow { display: none; }
  .ws-table select.input-sm { min-width: 0; width: 128px; }
  .ws-dl { grid-template-columns: 1fr; }
  .ws-roi-stats { grid-template-columns: 1fr; }
  .ws-win-form { grid-template-columns: 1fr; }
  .ws-box { padding: 14px; box-shadow: 4px 4px 0 var(--ink); }
}
@media (prefers-reduced-motion: reduce) { .ws-card { transition: none; } .ws-card:hover { transform: none; } }

/* Demo workspace (reqwreck.com/demo): made-up data, blurred; a bar on every page */
.demo-bar { position: sticky; top: 0; z-index: 40; background: repeating-linear-gradient(-45deg, var(--yellow) 0 16px, #FFD24D 16px 32px);
  border-bottom: 2px solid var(--ink); }
.demo-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-top: 10px; padding-bottom: 10px; }
.demo-row p { margin: 0; font-size: 14px; background: var(--yellow); padding: 2px 6px; }
.demo-tag { display: inline-block; font: 700 11px/1 var(--body); letter-spacing: .12em; text-transform: uppercase; background: var(--ink);
  color: var(--yellow); padding: 4px 6px 3px; margin-right: 6px; vertical-align: 1px; }
.demo-locked { display: block; margin-top: 2px; }
.btn-sm { min-height: 38px; padding: 8px 14px; font-size: 13px; white-space: nowrap; }
.is-demo .pii { filter: blur(5px); user-select: none; }
.is-demo .ws-title.pii { filter: blur(16px); }  /* big type needs more blur to be unreadable */
.is-demo input.pii { color: transparent; text-shadow: 0 0 8px rgba(20, 22, 26, .7); }
.is-demo a[href^="mailto:"], .is-demo a[href^="tel:"], .is-demo a.pii-link { pointer-events: none; }  /* company links still open the lead */
.is-demo a.pii-link { opacity: .55; text-decoration: line-through; }
.is-demo .nav { top: 58px; }
@media (max-width: 720px) { .demo-row { flex-direction: column; align-items: flex-start; gap: 8px; } .demo-more { display: none; } .is-demo .nav { position: static; } }
