/* Mission Control teacher collaboration workspace and side chat. */

.mission-control-page .mission-control-snapshot {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.mission-control-collaboration-toggle {
    align-items: center;
    background: var(--mc-surface, #fff);
    border: 1px solid var(--mc-line, #d7e2ec);
    border-radius: .7rem;
    color: var(--mc-ink, #1f344d);
    cursor: pointer;
    display: inline-flex;
    font: inherit;
    font-size: .82rem;
    font-weight: 750;
    gap: .45rem;
    padding: .55rem .75rem;
}

.mission-control-collaboration-toggle:hover,
.mission-control-collaboration-toggle:focus-visible {
    border-color: var(--mc-accent, #1689a7);
    color: var(--mc-accent-dark, #08748f);
}

.mission-control-live-dot,
.mission-control-presence-dot {
    background: #16a34a;
    border: 2px solid var(--mc-surface, #fff);
    border-radius: 999px;
    box-shadow: 0 0 0 1px color-mix(in srgb, #16a34a 45%, transparent);
    display: inline-block;
    height: .62rem;
    width: .62rem;
}

.mission-control-live-dot.offline,
.mission-control-presence-dot.offline { background: #94a3b8; box-shadow: none; }
.mission-control-presence-dot.focus { background: #8b5cf6; }
.mission-control-presence-dot.away { background: #f59e0b; }

.mission-control-chat-unread,
.mission-control-nav-count {
    align-items: center;
    background: #d04b3f;
    border-radius: 999px;
    color: #fff;
    display: inline-flex;
    font-size: .68rem;
    font-weight: 800;
    justify-content: center;
    line-height: 1;
    min-height: 1.15rem;
    min-width: 1.15rem;
    padding: 0 .28rem;
}

.mission-control-chat-unread[hidden],
.mission-control-nav-count[hidden] {
    display: none;
}

.mission-control-nav-btn .mission-control-nav-count { float: right; margin-left: auto; }

.mission-control-collaboration-summary {
    display: grid;
    gap: .75rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin: 0 0 1rem;
}

.mission-control-collaboration-summary article {
    background: var(--mc-surface, #fff);
    border: 1px solid var(--mc-line, #d7e2ec);
    border-radius: .9rem;
    display: flex;
    flex-direction: column;
    padding: .9rem 1rem;
}

.mission-control-collaboration-summary span {
    color: var(--mc-ink, #1f344d);
    font-size: 1.55rem;
    font-weight: 850;
}

.mission-control-collaboration-summary small {
    color: var(--mc-muted, #64748b);
    font-size: .76rem;
}

.mission-control-collaboration-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(250px, .72fr) minmax(420px, 1.4fr);
}

.mission-control-collaboration-card {
    background: var(--mc-surface, #fff);
    border: 1px solid var(--mc-line, #d7e2ec);
    border-radius: 1rem;
    min-width: 0;
    padding: 1rem;
}

.mission-control-collaboration-card-heading {
    align-items: flex-start;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    margin-bottom: .8rem;
}

.mission-control-collaboration-card-heading h2 {
    color: var(--mc-ink, #1f344d);
    font-size: 1.05rem;
    margin: .1rem 0 0;
}

.mission-control-collaboration-card-heading > span {
    background: color-mix(in srgb, #16a34a 10%, var(--mc-surface, #fff));
    border-radius: 999px;
    color: #15803d;
    font-size: .7rem;
    font-weight: 800;
    padding: .3rem .55rem;
}

.mission-control-people-list,
.mission-control-project-list {
    display: flex;
    flex-direction: column;
    gap: .55rem;
}

.mission-control-person-row {
    align-items: center;
    background: color-mix(in srgb, var(--mc-tint, #e6f5f7) 34%, transparent);
    border: 1px solid transparent;
    border-radius: .8rem;
    display: grid;
    gap: .65rem;
    grid-template-columns: auto minmax(0, 1fr) auto;
    min-height: 58px;
    padding: .62rem;
}

.mission-control-person-avatar {
    align-items: center;
    background: linear-gradient(145deg, var(--mc-accent, #1689a7), #334e68);
    border-radius: .72rem;
    color: #fff;
    display: inline-flex;
    font-size: .72rem;
    font-weight: 850;
    height: 2.25rem;
    justify-content: center;
    position: relative;
    width: 2.25rem;
}

.mission-control-person-avatar .mission-control-presence-dot {
    bottom: -.12rem;
    position: absolute;
    right: -.12rem;
}

.mission-control-person-copy {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.mission-control-person-copy strong {
    color: var(--mc-ink, #1f344d);
    font-size: .85rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mission-control-person-copy span {
    color: var(--mc-muted, #64748b);
    font-size: .73rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mission-control-message-person,
.mission-control-project-action,
.mission-control-thread-button {
    cursor: pointer;
    font: inherit;
}

.mission-control-message-person {
    background: transparent;
    border: 1px solid var(--mc-line, #d7e2ec);
    border-radius: .6rem;
    color: var(--mc-accent-dark, #08748f);
    font-size: .72rem;
    font-weight: 800;
    padding: .4rem .52rem;
}

.mission-control-project-row {
    border: 1px solid var(--mc-line, #d7e2ec);
    border-radius: .9rem;
    padding: .85rem;
}

.mission-control-project-row-top,
.mission-control-project-actions,
.mission-control-project-members,
.mission-control-handoff-row,
.mission-control-handoff-actions {
    align-items: center;
    display: flex;
    gap: .55rem;
}

.mission-control-project-row-top { justify-content: space-between; }
.mission-control-project-row h3 { color: var(--mc-ink, #1f344d); font-size: .95rem; margin: 0; }
.mission-control-project-row p { color: var(--mc-muted, #64748b); font-size: .8rem; line-height: 1.45; margin: .5rem 0; }

.mission-control-project-status {
    background: color-mix(in srgb, var(--mc-accent, #1689a7) 10%, var(--mc-surface, #fff));
    border-radius: 999px;
    color: var(--mc-accent-dark, #08748f);
    font-size: .67rem;
    font-weight: 850;
    padding: .25rem .48rem;
    text-transform: capitalize;
}

.mission-control-project-status.completed { background: color-mix(in srgb, #16a34a 12%, var(--mc-surface, #fff)); color: #15803d; }
.mission-control-project-status.review { background: color-mix(in srgb, #f59e0b 14%, var(--mc-surface, #fff)); color: #a16207; }
.mission-control-project-status.archived { color: var(--mc-muted, #64748b); }

.mission-control-project-members { color: var(--mc-muted, #64748b); flex-wrap: wrap; font-size: .72rem; margin: .7rem 0; }

.mission-control-project-member {
    background: color-mix(in srgb, var(--mc-tint, #e6f5f7) 55%, var(--mc-surface, #fff));
    border-radius: 999px;
    padding: .24rem .46rem;
}

.mission-control-project-actions { flex-wrap: wrap; }

.mission-control-project-action {
    background: transparent;
    border: 0;
    color: var(--mc-accent-dark, #08748f);
    font-size: .75rem;
    font-weight: 800;
    padding: .35rem 0;
}

.mission-control-project-action + .mission-control-project-action { margin-left: .55rem; }
.mission-control-project-action.danger { color: #b45309; }
.mission-control-project-action-link { color: var(--mc-accent-dark, #08748f); font-size: .75rem; font-weight: 800; text-decoration: none; }

.mission-control-handoff-section { margin-top: 1rem; }
.mission-control-handoff-row { border-top: 1px solid var(--mc-line, #d7e2ec); justify-content: space-between; padding: .8rem 0; }
.mission-control-handoff-row:first-child { border-top: 0; }
.mission-control-handoff-copy { display: flex; flex-direction: column; }
.mission-control-handoff-copy strong { color: var(--mc-ink, #1f344d); font-size: .86rem; }
.mission-control-handoff-copy span { color: var(--mc-muted, #64748b); font-size: .74rem; }

.mission-control-chat-drawer {
    background: var(--mc-surface, #fff);
    border-left: 1px solid var(--mc-line, #d7e2ec);
    bottom: 0;
    box-sizing: border-box;
    box-shadow: -20px 0 55px rgba(15, 23, 42, .14);
    color: var(--mc-ink, #1f344d);
    display: flex;
    flex-direction: column;
    max-width: 100%;
    max-height: 100dvh;
    position: fixed;
    right: 0;
    top: 0;
    width: min(520px, 100%);
    z-index: 1300;
}

.mission-control-chat-drawer[hidden] { display: none; }

.mission-control-chat-header {
    align-items: center;
    background: linear-gradient(120deg, #0b2d4a, #12556b);
    color: #fff;
    display: grid;
    flex-shrink: 0;
    gap: .4rem .6rem;
    grid-template-columns: minmax(0, 1fr) auto;
    justify-content: space-between;
    min-height: 74px;
    padding: .85rem 1rem;
}

.mission-control-chat-header h2 { color: #fff; font-size: 1.1rem; margin: .08rem 0 0; }
.mission-control-chat-header .mission-control-eyebrow { color: #9de8ef; }
.mission-control-chat-header button { background: transparent; border: 0; color: #fff; cursor: pointer; font-size: 1.7rem; padding: .2rem .5rem; }
.mission-control-chat-header .mission-control-chat-find { font-size: .78rem; text-decoration: underline; }
.mission-control-chat-tools { display: flex; flex-wrap: wrap; gap: .3rem; grid-column: 1 / -1; grid-row: 2; }
.mission-control-chat-header [data-collaboration-close-chat] { grid-column: 2; grid-row: 1; min-height: 44px; min-width: 44px; }
.mission-control-chat-tools .mission-control-chat-find { min-height: 44px; }
.mission-control-contact-toolbar { align-items: center; display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: .6rem; }
.mission-control-contact-toolbar select { max-width: 100%; }
.mission-control-contact-toolbar #mcPresenceFreshness { margin-left: auto; }
.mission-control-person-actions { display: flex; flex-wrap: wrap; gap: .35rem; justify-content: flex-end; }
/* Restore modal centering after the dashboard reset; keep both new dialogs on the workspace theme. */
.mission-control-colleague-dialog {
    background: var(--mc-surface, #fff);
    border-color: var(--mc-line, #d7e2ec);
    color: var(--mc-ink, #1f344d);
    inset: 0;
    margin: auto;
    max-height: min(85vh, 760px);
    overflow-y: auto;
    width: min(640px, calc(100vw - 2rem));
}
.mission-control-colleague-dialog .mission-control-colleague-dialog-body { display: grid; gap: .85rem; min-width: 0; padding: 1.25rem; }
.mission-control-colleague-dialog header { align-items: center; display: flex; justify-content: space-between; }
.mission-control-colleague-dialog header h2 { color: inherit; font-size: 1.2rem; min-width: 0; }
.mission-control-colleague-dialog header button { flex-shrink: 0; }
.mission-control-colleague-dialog p { font-size: .85rem; line-height: 1.5; }
.mission-control-colleague-dialog input,
.mission-control-colleague-dialog select { background: var(--mc-surface, #fff); border-color: var(--mc-line, #d7e2ec); color: var(--mc-ink, #1f344d); min-width: 0; width: 100%; }
.mission-control-colleague-dialog input::placeholder { color: var(--mc-muted, #64748b); opacity: 1; }
.mission-control-colleague-dialog button:disabled { cursor: not-allowed; opacity: .6; }
.mission-control-colleague-dialog .mission-control-person-copy { min-width: 0; overflow-wrap: anywhere; }
.mission-control-colleague-dialog .mission-control-person-row { grid-template-columns: minmax(0, 1fr) auto; }

.mission-control-chat-layout {
    display: grid;
    flex: 1;
    grid-template-columns: 148px minmax(0, 1fr);
    min-height: 0;
}

.mission-control-thread-list {
    background: color-mix(in srgb, var(--mc-tint, #e6f5f7) 45%, var(--mc-surface, #fff));
    border-right: 1px solid var(--mc-line, #d7e2ec);
    overflow-y: auto;
    padding: .55rem;
}

.mission-control-thread-button {
    background: transparent;
    border: 0;
    border-radius: .72rem;
    color: inherit;
    display: flex;
    flex-direction: column;
    gap: .2rem;
    margin-bottom: .32rem;
    padding: .62rem;
    text-align: left;
    width: 100%;
}

.mission-control-thread-button:hover,
.mission-control-thread-button.active { background: var(--mc-surface, #fff); box-shadow: 0 1px 0 rgba(15, 23, 42, .05); }
.mission-control-thread-button strong { font-size: .77rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 100%; }
.mission-control-thread-button span { color: var(--mc-muted, #64748b); font-size: .65rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 100%; }
.mission-control-thread-button.unread strong::after { background: #d04b3f; border-radius: 999px; content: ''; display: inline-block; height: .42rem; margin-left: .35rem; width: .42rem; }

.mission-control-chat-conversation { display: flex; flex-direction: column; min-height: 0; min-width: 0; }
.mission-control-conversation-header { border-bottom: 1px solid var(--mc-line, #d7e2ec); flex-shrink: 0; min-height: 62px; padding: .7rem .85rem; }
.mission-control-conversation-header div { display: flex; flex-direction: column; }
.mission-control-conversation-header strong { font-size: .88rem; }
.mission-control-conversation-header span { color: var(--mc-muted, #64748b); font-size: .7rem; }

.mission-control-chat-messages {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: .55rem;
    min-height: 0;
    overflow-y: auto;
    padding: .8rem;
}

.mission-control-chat-empty { align-items: center; color: var(--mc-muted, #64748b); display: flex; flex: 1; flex-direction: column; justify-content: center; padding: 1.5rem; text-align: center; }
.mission-control-chat-empty > span { color: var(--mc-accent, #1689a7); font-size: 2rem; }
.mission-control-chat-empty strong { color: var(--mc-ink, #1f344d); font-size: .9rem; }
.mission-control-chat-empty p { font-size: .75rem; line-height: 1.45; }

.mission-control-chat-message { align-self: flex-start; max-width: 88%; }
.mission-control-chat-message.mine { align-self: flex-end; }
.mission-control-chat-message.system { align-self: center; color: var(--mc-muted, #64748b); font-size: .68rem; max-width: 95%; text-align: center; }
.mission-control-chat-message-bubble { background: color-mix(in srgb, var(--mc-tint, #e6f5f7) 62%, var(--mc-surface, #fff)); border-radius: .85rem .85rem .85rem .2rem; line-height: 1.45; padding: .6rem .7rem; white-space: pre-wrap; word-break: break-word; }
.mission-control-chat-message.mine .mission-control-chat-message-bubble { background: var(--mc-accent, #1689a7); border-radius: .85rem .85rem .2rem .85rem; color: #fff; }
.mission-control-chat-message-meta { color: var(--mc-muted, #64748b); display: block; font-size: .62rem; margin-top: .2rem; }
.mission-control-chat-message.mine .mission-control-chat-message-meta { text-align: right; }

.mission-control-message-composer { align-items: flex-end; border-top: 1px solid var(--mc-line, #d7e2ec); display: flex; gap: .45rem; padding: .65rem; }
.mission-control-message-composer textarea { background: var(--mc-surface, #fff); border: 1px solid var(--mc-line, #d7e2ec); border-radius: .72rem; color: inherit; flex: 1; font: inherit; max-height: 120px; min-height: 42px; min-width: 0; padding: .58rem .65rem; resize: vertical; }
.mission-control-message-composer .mission-control-primary-action { flex-shrink: 0; min-height: 44px; min-width: 64px; }
.mission-control-message-composer { flex-shrink: 0; }
.mission-control-message-composer button:disabled { cursor: not-allowed; opacity: .6; }
.mission-control-composer-status { color: var(--mc-muted, #64748b); flex-shrink: 0; font-size: .66rem; margin: 0; padding: 0 .65rem .55rem; }
.mission-control-file-picker-toggle { align-self: flex-start; flex-shrink: 0; margin: .25rem .65rem; min-height: 44px; }
.mission-control-drive-items { display: flex; flex-direction: column; gap: .35rem; margin: .75rem 0; max-height: 300px; overflow-y: auto; }
.mission-control-drive-item { background: var(--mc-surface, #fff); border: 1px solid var(--mc-line, #d7e2ec); border-radius: .5rem; color: inherit; min-height: 44px; padding: .65rem; text-align: left; overflow-wrap: anywhere; }
.mission-control-colleague-dialog button { min-height: 44px; }
.mission-control-drive-item.selected { border-color: var(--mc-accent, #1689a7); box-shadow: inset 0 0 0 1px var(--mc-accent, #1689a7); }
.mission-control-chat-message-bubble button { margin: .3rem .4rem .1rem 0; min-height: 36px; }
.mission-control-chat-message-bubble p { font-size: .75rem; }

.mission-control-project-dialog { width: min(620px, calc(100vw - 2rem)); }
.mission-control-project-dialog select { width: 100%; }

@media (min-width: 1280px) {
    .mission-control-page.collaboration-chat-open .dashboard-container { margin-right: 520px; transition: margin-right 160ms ease; }
}

@media (max-width: 900px) {
    .mission-control-collaboration-grid { grid-template-columns: 1fr; }
}

@media (max-width: 680px) {
    .mission-control-page .mission-control-snapshot { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .mission-control-page .mission-control-snapshot a:nth-child(5) { border-left: 0; border-top: 1px solid var(--mc-line, #d7e2ec); grid-column: 1 / -1; }
    .mission-control-collaboration-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .mission-control-chat-layout { grid-template-columns: 112px minmax(0, 1fr); }
    .mission-control-thread-list { padding: .35rem; }
    .mission-control-thread-button { padding: .52rem .4rem; }
    .mission-control-project-row-top,
    .mission-control-handoff-row { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 480px) {
    .mission-control-chat-layout { grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 76px) minmax(0, 1fr); }
    .mission-control-thread-list { border-bottom: 1px solid var(--mc-line, #d7e2ec); border-right: 0; display: flex; gap: .35rem; overflow-x: auto; overflow-y: hidden; }
    .mission-control-thread-button { flex: 0 0 150px; margin-bottom: 0; max-width: 180px; }
    .mission-control-colleague-dialog .mission-control-colleague-dialog-body { padding: 1rem; }
    .mission-control-colleague-dialog .mission-control-person-row { grid-template-columns: minmax(0, 1fr); }
    .mission-control-colleague-dialog .mission-control-person-actions { grid-column: 1; justify-content: flex-start; }
    #mcCollaborationPeople .mission-control-person-actions { grid-column: 2 / -1; justify-content: flex-start; }
}

@media (max-height: 540px) {
    .mission-control-chat-header { grid-template-columns: auto minmax(0, 1fr) auto; min-height: 0; padding: .3rem .65rem; }
    .mission-control-chat-header .mission-control-eyebrow { display: none; }
    .mission-control-chat-header h2 { font-size: 1rem; }
    .mission-control-chat-tools { flex-wrap: nowrap; grid-column: 2; grid-row: 1; justify-content: flex-end; min-width: 0; }
    .mission-control-chat-tools .mission-control-chat-find { padding: .2rem .35rem; }
    .mission-control-chat-header [data-collaboration-close-chat] { grid-column: 3; }
    .mission-control-conversation-header { min-height: 0; padding: .3rem .65rem; }
    .mission-control-chat-messages { padding: .4rem; }
    .mission-control-message-composer { padding: .35rem .65rem; }
    .mission-control-message-composer textarea { height: 44px; min-height: 44px; max-height: 70px; }
    .mission-control-composer-status { padding-bottom: .25rem; }
}

@media (max-width: 480px) and (max-height: 540px) {
    .mission-control-chat-layout { grid-template-rows: minmax(0, 56px) minmax(0, 1fr); }
}

@media (prefers-reduced-motion: reduce) {
    .mission-control-page.collaboration-chat-open .dashboard-container { transition: none; }
}