/* Company workspace: header with the essentials, one topic per tab. */
.content.company-content { padding: 22px 28px 40px; }
.co-shell { display: grid; gap: 18px; max-width: 1400px; margin: 0 auto; }

/* Header */
.co-hero { position: relative; display: grid; gap: 18px; padding: 22px 24px; border-radius: 20px; border: 1px solid var(--line); background: var(--surface); overflow: hidden; }
.co-hero::before { content: ''; position: absolute; inset: 0 0 auto 0; height: 4px; background: var(--co-color, var(--accent)); }
.co-identity { display: flex; align-items: center; gap: 18px; }
.co-logo { width: 64px; height: 64px; border-radius: 18px; display: grid; place-items: center; overflow: hidden; flex: none; color: #fff; font-size: 22px; font-weight: 800; box-shadow: 0 10px 22px rgba(0, 0, 0, .12); }
.co-logo img { width: 100%; height: 100%; object-fit: contain; background: #fff; }
.co-name { flex: 1; min-width: 0; display: grid; gap: 8px; }
.co-name h1 { margin: 0; font-size: 26px; letter-spacing: -.5px; line-height: 1.1; }
.co-contacts { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.co-contacts small { color: var(--muted); font-size: 12px; }
.co-contact { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: 999px; border: 1px solid var(--line); background: var(--surface2); color: var(--ink); font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; transition: border-color .15s; }
.co-contact svg { color: var(--muted); }
.co-contact:hover { border-color: var(--accent); }
.co-contact:hover svg { color: var(--accent); }
.co-actions { display: flex; gap: 8px; flex: none; }
.co-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.co-stat { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 14px; background: var(--surface2); border: 1px solid var(--line); }
.co-stat > span { width: 38px; height: 38px; border-radius: 11px; display: grid; place-items: center; flex: none; }
.co-stat strong { display: block; font-size: 19px; letter-spacing: -.3px; }
.co-stat small { font-size: 11.5px; color: var(--muted); }
.co-stat.blue > span { color: #2f6fd6; background: rgba(57, 118, 216, .14); }
.co-stat.sky > span { color: #1f8cc4; background: rgba(47, 155, 214, .14); }
.co-stat.green > span { color: #1b8a5f; background: rgba(47, 179, 128, .14); }
.co-stat.violet > span { color: #6a52d6; background: rgba(138, 114, 240, .16); }
:root[data-theme=dark] .co-stat.blue > span { color: #8fb4ff; } :root[data-theme=dark] .co-stat.sky > span { color: #7cc8f0; }
:root[data-theme=dark] .co-stat.green > span { color: #6fdcae; } :root[data-theme=dark] .co-stat.violet > span { color: #b6a6ff; }

/* Tabs */
.co-tabs { display: flex; gap: 4px; padding: 4px; border-radius: 14px; background: var(--surface); border: 1px solid var(--line); overflow-x: auto; position: sticky; top: -22px; z-index: 5; }
.co-tabs button { display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px; border: 0; border-radius: 10px; background: transparent; color: var(--muted); font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; white-space: nowrap; transition: background .15s, color .15s; }
.co-tabs button:hover { color: var(--ink); background: var(--surface2); }
.co-tabs button.active { color: #fff; background: linear-gradient(135deg, #3976d8, #214fa6); box-shadow: 0 6px 14px rgba(33, 79, 166, .28); }
.co-tabs em { font-style: normal; font-size: 11px; min-width: 20px; padding: 1px 6px; border-radius: 999px; background: var(--surface2); color: var(--muted); text-align: center; }
.co-tabs button.active em { background: rgba(255, 255, 255, .22); color: #fff; }
.co-content { display: grid; gap: 16px; min-width: 0; }
/* Existing tab bodies (people, vault, files, discussion) sit on the same surface. */
.co-content > .cd-section, .co-content > .people-layout, .co-content > .cd-files-grid, .co-content > .context-chat { margin: 0; }

/* Cards */
.co-card { display: grid; gap: 12px; padding: 18px; border-radius: 16px; border: 1px solid var(--line); background: var(--surface); align-content: start; }
.co-card.flush { padding: 6px; }
.co-card > header { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.co-card h2 { margin: 0; font-size: 15px; display: flex; align-items: center; gap: 8px; }
.co-card > header small { font-size: 12px; color: var(--muted); }
.co-info p { margin: 0; font-size: 13px; line-height: 1.55; color: var(--ink); white-space: pre-wrap; }
.co-link { display: inline-flex; align-items: center; gap: 4px; border: 0; background: transparent; color: var(--accent); font: inherit; font-size: 12px; font-weight: 700; cursor: pointer; padding: 4px 6px; border-radius: 7px; }
.co-link:hover { background: var(--soft); }
.co-empty { display: flex; align-items: center; justify-content: center; gap: 8px; margin: 0; padding: 18px; color: var(--muted); font-size: 13px; text-align: center; }

/* Overview */
.co-overview { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(300px, 1fr); gap: 16px; align-items: start; }
.co-col { display: grid; gap: 16px; min-width: 0; }
.co-bar { display: flex; height: 12px; border-radius: 999px; overflow: hidden; background: var(--surface2); gap: 2px; }
.co-bar span { min-width: 6px; } .co-bar span.empty { flex: 1; }
.co-bar .backlog, .co-status-dot.backlog { background: #8a94a8; } .co-bar .todo, .co-status-dot.todo { background: #5d8ee8; }
.co-bar .progress, .co-status-dot.progress { background: #2f9bd6; } .co-bar .review, .co-status-dot.review { background: #9b7cf0; } .co-bar .done, .co-status-dot.done { background: #2fb380; }
.co-legend { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
.co-legend button { display: flex; align-items: center; gap: 7px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface2); color: var(--muted); font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; text-align: left; }
.co-legend button:hover { border-color: var(--accent); color: var(--ink); }
.co-legend b { margin-left: auto; color: var(--ink); font-size: 14px; }
.co-status-dot { width: 9px; height: 9px; border-radius: 50%; flex: none; display: inline-block; }
.co-shortcuts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.co-shortcut { display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; column-gap: 10px; align-items: center; padding: 12px; border-radius: 12px; border: 1px solid var(--line); background: var(--surface2); color: var(--ink); font: inherit; cursor: pointer; text-align: left; transition: border-color .15s, transform .15s; }
.co-shortcut:hover { border-color: var(--accent); transform: translateY(-1px); }
.co-shortcut span { grid-row: span 2; width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; color: var(--accent); background: var(--soft); }
.co-shortcut strong { font-size: 17px; line-height: 1; }
.co-shortcut small { font-size: 11.5px; color: var(--muted); }
.co-person { display: flex; align-items: center; gap: 10px; padding: 6px 0; }
.co-person + .co-person { border-top: 1px dashed var(--line); padding-top: 10px; }
.co-person > div { flex: 1; min-width: 0; display: grid; }
.co-person strong { font-size: 13px; }
.co-person small { font-size: 11.5px; color: var(--muted); }
.co-person-avatar { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; font-size: 12px; font-weight: 800; color: var(--accent); background: var(--soft); flex: none; }
.co-person-avatar.internal { color: #fff; background: linear-gradient(135deg, #2fb380, #1b8a5f); }

/* Task rows */
.co-task-list { display: grid; gap: 2px; }
.co-task { display: grid; grid-template-columns: minmax(0, 1fr) auto 92px 110px 34px; align-items: center; gap: 12px; padding: 8px 10px; border-radius: 12px; transition: background .12s; }
.co-task:hover { background: var(--surface2); }
.co-task.done .co-task-text strong { text-decoration: line-through; color: var(--muted); }
.co-task-main { display: flex; align-items: center; gap: 12px; min-width: 0; border: 0; background: transparent; color: inherit; font: inherit; text-align: left; cursor: pointer; padding: 2px 0; }
.co-task-text { display: grid; min-width: 0; }
.co-task-text strong { font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.co-task-text small { font-size: 12px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.co-due { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; color: var(--muted); white-space: nowrap; }
.co-due.overdue { color: #d84a4a; font-weight: 700; }
.co-task .badge { justify-self: start; white-space: nowrap; }
.co-avatars { display: flex; }
.co-avatars i { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; font-style: normal; font-size: 10px; font-weight: 800; color: var(--accent); background: var(--soft); border: 2px solid var(--surface); margin-left: -6px; }
.co-avatars i:first-child { margin-left: 0; }
.co-icon-btn { position: relative; width: 32px; height: 32px; border-radius: 9px; border: 1px solid var(--line); background: var(--surface); color: var(--muted); display: grid; place-items: center; cursor: pointer; transition: all .15s; flex: none; }
.co-icon-btn:hover { color: var(--accent); border-color: var(--accent); }
.co-icon-btn.running { color: #fff; background: #2fb380; border-color: #2fb380; }
.co-icon-btn.danger:hover { color: #d84a4a; border-color: #d84a4a; }
.co-icon-btn.ghost { visibility: hidden; }
.co-icon-btn em { position: absolute; top: -6px; right: -6px; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 999px; font-style: normal; font-size: 9.5px; font-weight: 800; line-height: 16px; color: #fff; background: var(--accent); }

/* Tasks toolbar + filters */
.co-toolbar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.co-spacer { flex: 1; }
.co-title { margin: 0; font-size: 17px; }
.co-sub { color: var(--muted); font-size: 12.5px; }
.co-seg { display: inline-flex; padding: 3px; border-radius: 11px; background: var(--surface); border: 1px solid var(--line); }
.co-seg button { border: 0; background: transparent; color: var(--muted); font: inherit; font-size: 12.5px; font-weight: 700; padding: 7px 14px; border-radius: 8px; cursor: pointer; }
.co-seg button.on { color: var(--ink); background: var(--surface2); box-shadow: 0 1px 3px rgba(0, 0, 0, .08); }
.co-filters { display: grid; gap: 8px; padding: 12px 14px; border-radius: 14px; border: 1px solid var(--line); background: var(--surface); }
.co-filter-row { display: flex; align-items: center; gap: 12px; }
.co-filter-row > span { width: 86px; flex: none; font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.co-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.co-chips button { display: inline-flex; align-items: center; gap: 6px; padding: 5px 11px; border-radius: 999px; border: 1px solid var(--line); background: var(--surface2); color: var(--muted); font: inherit; font-size: 12px; font-weight: 700; cursor: pointer; }
.co-chips button em { font-style: normal; font-size: 11px; opacity: .8; }
.co-chips button:hover { color: var(--ink); }
.co-chips button.on { color: var(--accent); border-color: var(--accent); background: color-mix(in srgb, var(--accent) 10%, var(--surface)); }

/* Applications */
.co-app-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 14px; }
.co-app { display: grid; gap: 12px; padding: 16px; border-radius: 16px; border: 1px solid var(--line); background: var(--surface); transition: border-color .15s, box-shadow .15s, transform .15s; }
.co-app:hover { border-color: color-mix(in srgb, var(--accent) 45%, var(--line)); box-shadow: 0 10px 24px rgba(6, 12, 30, .08); }
.co-app-main { display: flex; align-items: center; gap: 12px; border: 0; background: transparent; color: inherit; font: inherit; text-align: left; cursor: pointer; padding: 0; min-width: 0; }
.co-app-icon { width: 44px; height: 44px; border-radius: 13px; display: grid; place-items: center; flex: none; font-weight: 800; font-size: 14px; color: #fff; background: linear-gradient(135deg, #f0a43a, #d07a12); }
.co-app-text { display: grid; min-width: 0; }
.co-app-text strong { font-size: 15px; }
.co-app-text small { font-size: 12px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.co-app-stats { display: flex; gap: 8px; }
.co-app-stats span { flex: 1; padding: 8px 10px; border-radius: 10px; background: var(--surface2); font-size: 12px; color: var(--muted); }
.co-app-stats b { font-size: 16px; color: var(--ink); margin-right: 4px; }
.co-app footer { display: flex; align-items: center; gap: 6px; }
.co-app.add { place-items: center; align-content: center; gap: 6px; min-height: 170px; border-style: dashed; color: var(--muted); cursor: pointer; font: inherit; }
.co-app.add:hover { color: var(--accent); }
.co-app.add small { font-size: 12px; }

/* Weekly report dialog */
.co-report { border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.co-report header { display: flex; align-items: center; justify-content: space-between; padding: 8px 12px; background: var(--surface2); border-bottom: 1px solid var(--line); }
.co-report pre { margin: 0; padding: 14px; max-height: 360px; overflow: auto; font-size: 12.5px; line-height: 1.55; white-space: pre-wrap; color: var(--ink); }
.co-chat-modal .mx-body { padding: 0; }
.co-chat-modal .context-chat { border: 0; margin: 0; box-shadow: none; }

@media (max-width: 1100px) { .co-overview { grid-template-columns: 1fr; } .co-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } .co-legend { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 760px) { .co-identity { flex-wrap: wrap; } .co-task { grid-template-columns: minmax(0, 1fr) auto; } .co-task .co-due, .co-task .co-avatars, .co-task .badge { display: none; } }

/* Application cards: status, site links, technical facts */
.co-app-details { display: grid; gap: 8px; padding: 0 16px 4px; }
.co-app-status { justify-self: start; padding: 2px 10px; border-radius: 999px; font-size: 11px; font-weight: 800; }
.co-app-status.live { color: #1b8a5f; background: rgba(47, 179, 128, .15); }
.co-app-status.development { color: #2563eb; background: rgba(72, 130, 226, .15); }
.co-app-status.maintenance { color: #b45309; background: rgba(224, 162, 58, .18); }
.co-app-status.inactive { color: var(--muted); background: var(--surface2); }
:root[data-theme=dark] .co-app-status.live { color: #6fdcae; } :root[data-theme=dark] .co-app-status.development { color: #8fb8ff; } :root[data-theme=dark] .co-app-status.maintenance { color: #f2c06b; }
.co-app-links { display: grid; gap: 4px; }
.co-app-link { display: flex; align-items: center; gap: 7px; min-width: 0; padding: 6px 9px; border-radius: 9px; border: 1px solid var(--line); background: var(--surface2); color: var(--ink); font-size: 12px; text-decoration: none; }
.co-app-link:hover { border-color: var(--accent); color: var(--accent); }
.co-app-link > svg:first-child { color: var(--accent); flex: none; }
.co-app-link b { flex: none; font-size: 11px; }
.co-app-link span { flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: var(--muted); }
.co-app-link > svg:last-child { flex: none; opacity: .6; }
.co-app-facts { display: flex; flex-wrap: wrap; gap: 5px; }
.co-app-facts span { display: inline-flex; align-items: center; gap: 5px; max-width: 100%; padding: 3px 8px; border-radius: 7px; background: var(--surface2); font-size: 11.5px; color: var(--muted); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
/* Cards of different content height: content stays at the top, the action row at the bottom. */
.co-app { display: flex; flex-direction: column; }
.co-app footer { margin-top: auto; }
.co-app-details { padding: 0; }
.co-app-status { align-self: flex-start; }
/* ---------- user passwords (organization) ---------- */
.org-pw { display: inline-flex; align-items: center; gap: 5px; margin-left: 6px; padding: 2px 8px; border-radius: 7px; border: 1px solid var(--line); background: var(--surface2); color: var(--muted); font: inherit; font-size: 11.5px; cursor: pointer; vertical-align: middle; }
.org-pw:hover { color: var(--accent); border-color: var(--accent); }
.org-pw code, .org-pw-current code { font-family: ui-monospace, Consolas, monospace; font-size: 12.5px; color: var(--ink); letter-spacing: .02em; user-select: all; }
.org-pw-current { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; min-height: 38px; }
.org-pw-current code { padding: 7px 10px; border-radius: 8px; background: var(--surface2); border: 1px solid var(--line); min-width: 140px; }
.org-pw-current small { color: var(--muted); font-size: 12px; line-height: 1.4; }
.org-pw-input { display: flex; align-items: center; gap: 6px; }
.org-pw-input input { flex: 1; min-width: 0; }