/* ══════════════════════════════════════════
   TEAM WORKSPACE — Kanban
══════════════════════════════════════════ */

.kb-page {
  display: flex; flex: 1; overflow: hidden;
  background: var(--bg); height: 100%;
}

/* ── Сайдбар ── */
.kb-sidebar {
  width: 220px; flex-shrink: 0;
  background: var(--bg2);
  border-right: 1px solid var(--steel);
  display: flex; flex-direction: column;
  overflow-y: auto; padding: 12px 0;
}
.kb-sidebar-hdr {
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 14px 10px;
  border-bottom: 1px solid rgba(42,53,69,.8);
}
.kb-sidebar-title {
  font-family: 'Rajdhani', sans-serif; font-size: 11px; font-weight: 700;
  color: var(--gold); letter-spacing: 3px;
}
.kb-new-proj-btn {
  width: 22px; height: 22px; border-radius: 2px;
  background: rgba(200,162,39,.15); border: 1px solid rgba(200,162,39,.4);
  color: var(--gold); font-size: 16px; line-height: 1;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  transition: all .15s;
}
.kb-new-proj-btn:hover { background: rgba(200,162,39,.3); }

.kb-proj-item {
  padding: 9px 14px; cursor: pointer; position: relative;
  border-left: 2px solid transparent; transition: all .15s;
}
.kb-proj-item:hover      { background: rgba(42,53,69,.5); }
.kb-proj-item.active     { background: rgba(42,53,69,.8); border-left-color: var(--gold); }
.kb-proj-name { font-size: 12px; color: var(--txt); margin-bottom: 3px; }
.kb-proj-meta { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.kb-proj-status {
  font-family: 'Share Tech Mono', monospace; font-size: 8px;
  padding: 1px 5px; border-radius: 2px; letter-spacing: 1px; text-transform: uppercase;
}
.kb-proj-status.status-active   { background: rgba(47,214,122,.15); color: var(--green); }
.kb-proj-status.status-planning { background: rgba(74,176,224,.15); color: var(--blue); }
.kb-proj-status.status-done     { background: rgba(42,53,69,.6);    color: var(--txt-lo); }
.kb-proj-count { font-size: 9px; color: var(--txt-lo); }
.kb-proj-del {
  position: absolute; right: 8px; top: 8px;
  background: none; border: none; color: var(--txt-lo);
  font-size: 11px; cursor: pointer; padding: 2px 4px;
  opacity: 0; transition: opacity .15s;
}
.kb-proj-item:hover .kb-proj-del { opacity: .5; }
.kb-proj-del:hover { opacity: 1 !important; color: var(--red) !important; }

.kb-new-proj-form {
  padding: 10px 12px; border-top: 1px solid var(--steel); margin-top: 4px;
  display: flex; flex-direction: column; gap: 6px;
}
.kb-no-projects { padding: 14px; font-size: 11px; color: var(--txt-lo); text-align: center; }

/* ── Доска ── */
.kb-board-wrap {
  flex: 1; display: flex; flex-direction: column; overflow: hidden;
}
.kb-board-hdr {
  flex-shrink: 0; display: flex; align-items: center; gap: 14px;
  padding: 10px 18px;
  background: var(--bg2); border-bottom: 1px solid var(--steel);
}
.kb-board-title {
  font-family: 'Rajdhani', sans-serif; font-size: 16px; font-weight: 600;
  color: var(--txt); flex: 1;
}
.kb-board-deadline { font-size: 11px; color: var(--txt-lo); }
.kb-add-task-btn {
  font-family: 'Share Tech Mono', monospace; font-size: 10px;
  color: var(--gold); border: 1px solid rgba(200,162,39,.5);
  background: rgba(200,162,39,.08); padding: 6px 14px; cursor: pointer;
  transition: all .15s;
  clip-path: polygon(5px 0%,100% 0%,100% calc(100% - 5px),calc(100% - 5px) 100%,0% 100%,0% 5px);
}
.kb-add-task-btn:hover { background: rgba(200,162,39,.2); }

.kb-board {
  flex: 1; display: flex; gap: 0; overflow-x: auto; overflow-y: hidden;
  padding: 14px; gap: 10px;
}

/* ── Колонка ── */
.kb-col {
  flex: 0 0 220px; display: flex; flex-direction: column;
  background: rgba(14,21,32,.6); border: 1px solid rgba(42,53,69,.6);
  border-radius: 4px; overflow: hidden; transition: border-color .15s;
}
.kb-col-over { border-color: var(--gold); background: rgba(200,162,39,.06); }

.kb-col-header {
  flex-shrink: 0; display: flex; align-items: center; justify-content: space-between;
  padding: 8px 12px; border-bottom: 2px solid; border-color: inherit;
  background: rgba(10,15,24,.5);
}
.kb-col-title { font-family: 'Rajdhani', sans-serif; font-size: 11px; font-weight: 700; letter-spacing: 1px; }
.kb-col-count {
  font-family: 'Share Tech Mono', monospace; font-size: 10px;
  background: rgba(42,53,69,.8); color: var(--txt-lo);
  padding: 1px 6px; border-radius: 10px;
}

.kb-col-tasks { flex: 1; overflow-y: auto; padding: 8px; display: flex; flex-direction: column; gap: 6px; }

/* ── Карточка задачи ── */
.kb-task {
  background: var(--bg2); border: 1px solid rgba(42,53,69,.8);
  border-radius: 3px; cursor: grab; user-select: none;
  transition: border-color .15s, transform .1s, box-shadow .1s;
  overflow: hidden; display: flex;
}
.kb-task:hover       { border-color: rgba(42,154,176,.5); box-shadow: 0 2px 8px rgba(0,0,0,.3); }
.kb-task:active      { cursor: grabbing; }
.kb-task[draggable]  { touch-action: none; }

.kb-task-priority { width: 3px; flex-shrink: 0; }
.kb-task-body     { flex: 1; padding: 9px 10px; min-width: 0; }
.kb-task-title    { font-size: 12px; color: var(--txt); line-height: 1.35; margin-bottom: 5px; }

.kb-task-deadline {
  font-family: 'Share Tech Mono', monospace; font-size: 9px; color: var(--txt-lo);
  margin-bottom: 4px;
}
.kb-task-deadline.overdue { color: var(--red); }
.kb-task-deadline.soon    { color: #e8832a; }

.kb-task-footer { display: flex; align-items: center; justify-content: space-between; }
.kb-ava {
  border-radius: 50%; border: 1.5px solid;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Share Tech Mono', monospace; font-weight: 700;
  color: var(--txt); background: rgba(42,53,69,.8); flex-shrink: 0;
}
.kb-task-no-assign { font-size: 9px; color: rgba(122,143,168,.3); }
.kb-task-comments { font-size: 10px; color: var(--txt-lo); }

/* ── Пустое состояние ── */
.kb-empty-state {
  flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 10px;
}
.kb-empty-icon { font-size: 48px; opacity: .3; }
.kb-empty-text { font-size: 13px; color: var(--txt-lo); }
.kb-no-team {
  padding: 40px; text-align: center;
  font-size: 13px; color: var(--txt-lo);
}

.kb-loading {
  flex: 1; display: flex; align-items: center; justify-content: center;
  gap: 10px; color: var(--txt-lo); font-size: 13px;
}
.kb-spinner {
  width: 24px; height: 24px; border: 2px solid var(--steel);
  border-top-color: var(--gold); border-radius: 50%;
  animation: spin .8s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }
.kb-loading-sm { font-size: 11px; color: var(--txt-lo); padding: 8px 14px; }

/* ── Модалы ── */
.kb-modal-overlay {
  position: fixed; inset: 0; background: rgba(0,0,0,.6);
  display: flex; align-items: center; justify-content: center;
  z-index: 2000; padding: 20px;
}
.kb-modal {
  background: var(--bg2); border: 1px solid var(--steel);
  width: 420px; max-width: 100%; max-height: 85vh;
  display: flex; flex-direction: column; overflow: hidden;
  clip-path: polygon(12px 0%,100% 0%,100% calc(100% - 12px),calc(100% - 12px) 100%,0% 100%,0% 12px);
}
.kb-modal-task { width: 540px; }

.kb-modal-title {
  font-family: 'Rajdhani', sans-serif; font-size: 14px; font-weight: 700;
  color: var(--gold); letter-spacing: 2px; padding: 14px 16px;
  border-bottom: 1px solid var(--steel); flex-shrink: 0;
}
.kb-task-modal-hdr {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 14px; border-bottom: 1px solid var(--steel); flex-shrink: 0;
}
.kb-task-modal-badges { display: flex; gap: 6px; }
.kb-badge {
  font-family: 'Share Tech Mono', monospace; font-size: 9px;
  padding: 2px 8px; border: 1px solid; letter-spacing: 1px;
}
.kb-task-modal-actions { display: flex; gap: 6px; }
.kb-icon-btn {
  width: 28px; height: 28px; border: none; background: transparent;
  color: var(--txt-lo); font-size: 14px; cursor: pointer;
  transition: color .15s; display: flex; align-items: center; justify-content: center;
}
.kb-icon-btn:hover        { color: var(--txt); }
.kb-icon-btn.danger:hover { color: var(--red); }

.kb-task-modal-body { flex: 1; overflow-y: auto; padding: 14px 16px; display: flex; flex-direction: column; gap: 12px; }
.kb-task-modal-title { font-size: 16px; color: var(--txt); font-weight: 500; line-height: 1.3; }
.kb-task-modal-meta { display: flex; flex-direction: column; gap: 6px; }
.kb-meta-row { display: flex; align-items: center; gap: 8px; }
.kb-meta-lbl { font-family: 'Share Tech Mono', monospace; font-size: 9px; color: var(--txt-lo); width: 80px; letter-spacing: 1px; }
.kb-meta-val { font-size: 12px; color: var(--txt); }
.kb-task-modal-desc { font-size: 12px; color: var(--txt-lo); line-height: 1.5; white-space: pre-wrap; }

/* ── Комментарии ── */
.kb-comments { display: flex; flex-direction: column; gap: 6px; }
.kb-comments-title {
  font-family: 'Rajdhani', sans-serif; font-size: 11px; font-weight: 700;
  color: var(--gold); letter-spacing: 2px; padding-top: 4px;
  border-top: 1px solid rgba(42,53,69,.6);
}
.kb-comment-list { display: flex; flex-direction: column; gap: 6px; max-height: 180px; overflow-y: auto; }
.kb-comment { background: rgba(14,21,32,.7); padding: 8px 10px; border-left: 2px solid rgba(42,53,69,.8); }
.kb-comment-meta { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; }
.kb-comment-who { font-family: 'Share Tech Mono', monospace; font-size: 9px; color: var(--teal); letter-spacing: 1px; }
.kb-comment-time { font-size: 8px; color: var(--txt-lo); }
.kb-comment-text { font-size: 11px; color: var(--txt); line-height: 1.4; }
.kb-no-comments { font-size: 10px; color: var(--txt-lo); text-align: center; padding: 8px; }
.kb-comment-input-row { display: flex; gap: 6px; margin-top: 4px; }
.kb-comment-input {
  flex: 1; height: 32px; background: rgba(14,21,32,.8);
  border: 1px solid var(--steel); color: var(--txt);
  font-family: 'Share Tech Mono', monospace; font-size: 11px;
  padding: 0 10px;
}
.kb-comment-input:focus { outline: none; border-color: var(--teal); }
.kb-comment-send {
  width: 32px; height: 32px; background: rgba(42,154,176,.2);
  border: 1px solid rgba(42,154,176,.5); color: var(--teal);
  cursor: pointer; font-size: 12px; flex-shrink: 0;
  transition: all .15s;
}
.kb-comment-send:hover:not(:disabled) { background: rgba(42,154,176,.4); }
.kb-comment-send:disabled { opacity: .4; cursor: not-allowed; }

/* ── Формы ── */
.kb-input {
  width: 100%; height: 34px; padding: 0 10px; box-sizing: border-box;
  background: rgba(14,21,32,.9); border: 1px solid var(--steel);
  color: var(--txt); font-family: 'Share Tech Mono', monospace; font-size: 11px;
  transition: border-color .15s;
}
.kb-input:focus { outline: none; border-color: var(--teal); }
.kb-textarea { height: auto; padding: 8px 10px; resize: vertical; font-family: inherit; line-height: 1.4; }
.kb-select { appearance: none; cursor: pointer; }
.kb-modal-row { display: flex; gap: 8px; }
.kb-modal-row .kb-input { flex: 1; }
.kb-modal-btns { display: flex; gap: 8px; padding: 12px 16px; border-top: 1px solid var(--steel); flex-shrink: 0; }
.kb-edit-form { display: flex; flex-direction: column; gap: 8px; }
.kb-error { font-size: 10px; color: var(--red); }

.kb-btn-primary {
  font-family: 'Share Tech Mono', monospace; font-size: 10px;
  color: var(--bg); background: var(--gold); border: none;
  padding: 7px 18px; cursor: pointer; transition: all .15s; letter-spacing: 1px;
  clip-path: polygon(5px 0%,100% 0%,100% calc(100% - 5px),calc(100% - 5px) 100%,0% 100%,0% 5px);
}
.kb-btn-primary:hover:not(:disabled) { background: var(--gold-hi); }
.kb-btn-primary:disabled { opacity: .5; cursor: not-allowed; }

.kb-btn-cancel {
  font-family: 'Share Tech Mono', monospace; font-size: 10px;
  color: var(--txt-lo); background: transparent;
  border: 1px solid var(--steel); padding: 7px 14px; cursor: pointer;
  transition: all .15s;
}
.kb-btn-cancel:hover { color: var(--txt); border-color: rgba(122,143,168,.7); }

/* ══════════════════════════════════════════
   TEAM DISK
══════════════════════════════════════════ */

.disk-page { display: flex; flex-direction: column; flex: 1; overflow: hidden; background: var(--bg); }

/* Тулбар */
.disk-toolbar {
  flex-shrink: 0; display: flex; align-items: center; gap: 18px; flex-wrap: wrap;
  padding: 8px 18px; background: var(--bg2); border-bottom: 1px solid var(--steel);
}
.disk-tabs { display: flex; gap: 4px; }
.disk-tab {
  font-family: 'Share Tech Mono', monospace; font-size: 10px;
  color: var(--txt-lo); background: transparent; border: 1px solid transparent;
  padding: 5px 12px; cursor: pointer; letter-spacing: 1px; transition: all .15s;
}
.disk-tab.active { color: var(--gold); border-color: rgba(200,162,39,.4); background: rgba(200,162,39,.07); }
.disk-tab:hover:not(.active) { color: var(--txt); }

/* Квота */
.disk-quota { display: flex; flex-direction: column; gap: 3px; flex: 1; max-width: 300px; }
.disk-quota-bar { height: 4px; background: rgba(42,53,69,.8); border-radius: 2px; overflow: hidden; }
.disk-quota-fill { height: 100%; background: var(--teal); border-radius: 2px; transition: width .4s; }
.disk-quota-fill.warn { background: #e8832a; }
.disk-quota-fill.crit { background: var(--red); }
.disk-quota-text { font-family: 'Share Tech Mono', monospace; font-size: 9px; color: var(--txt-lo); }
.disk-quota-pct { }
.disk-quota-pct.warn { color: #e8832a; }
.disk-quota-pct.crit { color: var(--red); }

/* Навигация */
.disk-main { flex: 1; display: flex; flex-direction: column; overflow: hidden; }
.disk-nav {
  flex-shrink: 0; display: flex; align-items: center; justify-content: space-between;
  padding: 8px 16px; background: rgba(10,15,24,.6);
  border-bottom: 1px solid rgba(42,53,69,.5);
}
.disk-breadcrumb { display: flex; align-items: center; gap: 2px; flex-wrap: wrap; }
.disk-crumb {
  font-family: 'Share Tech Mono', monospace; font-size: 10px; color: var(--teal);
  background: none; border: none; cursor: pointer; padding: 2px 4px;
  transition: color .15s;
}
.disk-crumb:hover { color: var(--txt-hi); }
.disk-crumb-root { color: var(--gold); }
.disk-crumb-sep  { color: var(--txt-lo); font-size: 10px; }

.disk-nav-actions { display: flex; gap: 6px; }
.disk-nav-btn {
  font-family: 'Share Tech Mono', monospace; font-size: 10px; letter-spacing: 1px;
  color: var(--txt-lo); border: 1px solid var(--steel);
  background: transparent; padding: 5px 12px; cursor: pointer; transition: all .15s;
  clip-path: polygon(4px 0%,100% 0%,100% calc(100% - 4px),calc(100% - 4px) 100%,0% 100%,0% 4px);
}
.disk-nav-btn:hover:not(:disabled) { color: var(--txt); border-color: rgba(122,143,168,.6); }
.disk-nav-btn.upload { color: var(--teal); border-color: rgba(42,154,176,.5); }
.disk-nav-btn.upload:hover:not(:disabled) { background: rgba(42,154,176,.12); color: #fff; }
.disk-nav-btn:disabled { opacity: .5; cursor: not-allowed; }
.disk-nav-btn.loading { color: var(--gold); border-color: rgba(200,162,39,.4); }

/* Новая папка */
.disk-new-folder {
  display: flex; align-items: center; gap: 6px; padding: 8px 16px;
  background: rgba(200,162,39,.05); border-bottom: 1px solid rgba(200,162,39,.15);
}
.disk-folder-input {
  height: 30px; padding: 0 10px; background: rgba(14,21,32,.9);
  border: 1px solid rgba(200,162,39,.4); color: var(--txt);
  font-family: 'Share Tech Mono', monospace; font-size: 11px; width: 220px;
}
.disk-folder-input:focus { outline: none; border-color: var(--gold); }
.disk-folder-ok, .disk-folder-cancel {
  height: 30px; padding: 0 10px; border: 1px solid; cursor: pointer;
  font-family: 'Share Tech Mono', monospace; font-size: 11px; transition: all .15s;
}
.disk-folder-ok     { color: var(--green); border-color: rgba(47,214,122,.4); background: rgba(47,214,122,.08); }
.disk-folder-cancel { color: var(--txt-lo); border-color: var(--steel); background: transparent; }
.disk-folder-ok:hover     { background: rgba(47,214,122,.2); }
.disk-folder-cancel:hover { color: var(--txt); }

/* Таблица */
.disk-table-header {
  display: grid;
  grid-template-columns: 32px 1fr 120px 110px 90px 80px;
  padding: 6px 16px; gap: 8px;
  font-family: 'Share Tech Mono', monospace; font-size: 9px;
  color: var(--txt-lo); letter-spacing: 1px; text-transform: uppercase;
  border-bottom: 1px solid rgba(42,53,69,.6);
  background: rgba(10,15,24,.4); flex-shrink: 0;
}
.disk-content { flex: 1; overflow-y: auto; }

.disk-row {
  display: grid;
  grid-template-columns: 32px 1fr 120px 110px 90px 80px;
  align-items: center; gap: 8px;
  padding: 7px 16px; border-bottom: 1px solid rgba(42,53,69,.25);
  transition: background .12s;
}
.disk-row:hover { background: rgba(42,53,69,.3); }
.disk-row-folder { cursor: pointer; }
.disk-row-folder:hover .disk-row-name { color: var(--gold); }

.disk-row-icon { font-size: 18px; text-align: center; }
.disk-row-name { font-size: 12px; color: var(--txt); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.disk-row-meta { font-size: 10px; color: var(--txt-lo); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.disk-row-date { font-size: 10px; color: var(--txt-lo); }
.disk-row-size { font-family: 'Share Tech Mono', monospace; font-size: 10px; color: var(--txt-lo); }
.disk-row-actions { display: flex; gap: 4px; justify-content: flex-end; }

.disk-action-btn {
  width: 26px; height: 26px; border: 1px solid; cursor: pointer;
  background: transparent; font-size: 12px; display: flex; align-items: center; justify-content: center;
  transition: all .15s;
}
.disk-action-btn.dl  { color: var(--teal); border-color: rgba(42,154,176,.4); }
.disk-action-btn.del { color: var(--red);  border-color: rgba(224,64,64,.3); }
.disk-action-btn:hover:not(:disabled) { opacity: .8; transform: scale(1.05); }
.disk-action-btn:disabled { opacity: .35; cursor: not-allowed; }

/* Пустое состояние */
.disk-empty { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; padding: 60px; }
.disk-empty-icon { font-size: 52px; opacity: .25; }
.disk-empty-text { font-size: 14px; color: var(--txt-lo); }
.disk-empty-hint { font-size: 11px; color: rgba(122,143,168,.5); }
.disk-loading    { padding: 40px; text-align: center; color: var(--txt-lo); font-size: 13px; }
.disk-error      { padding: 8px 16px; font-size: 11px; color: var(--red); background: rgba(224,64,64,.07); }

/* Внешние диски */
.disk-ext-panel { padding: 24px; display: flex; flex-direction: column; gap: 14px; }
.disk-ext-title {
  font-family: 'Rajdhani', sans-serif; font-size: 13px; font-weight: 700;
  color: var(--gold); letter-spacing: 3px;
}
.disk-ext-list { display: flex; flex-direction: column; gap: 10px; }

/* ── Карточка провайдера ── */
.disk-ext-card {
  background: rgba(14,21,32,.7); border: 1px solid rgba(42,53,69,.6);
  clip-path: polygon(8px 0%,100% 0%,100% calc(100% - 8px),calc(100% - 8px) 100%,0% 100%,0% 8px);
  overflow: hidden;
}
.disk-ext-card-hdr {
  display: flex; align-items: center; gap: 14px;
  padding: 14px 16px;
}
.disk-ext-icon { font-size: 28px; }
.disk-ext-info { flex: 1; }
.disk-ext-name { font-size: 13px; font-weight: 600; margin-bottom: 4px; }
.disk-ext-status { font-size: 10px; color: var(--txt-lo); }
.disk-ext-actions { display: flex; gap: 6px; }
.disk-ext-btn {
  font-family: 'Share Tech Mono', monospace; font-size: 9px; letter-spacing: 1px;
  border: 1px solid; padding: 5px 12px; cursor: pointer; transition: opacity .15s;
}
.disk-ext-btn:disabled { cursor: not-allowed; opacity: .4; }
.disk-ext-btn.conn { color: var(--gold); border-color: var(--gold); background: transparent; }
.disk-ext-btn.conn:hover { background: rgba(200,162,39,.15); }
.disk-ext-btn.browse { color: var(--teal); border-color: var(--teal); background: transparent; }
.disk-ext-btn.browse:hover { background: rgba(42,154,176,.15); }
.disk-ext-btn.disc { color: var(--red); border-color: var(--red); background: transparent; }
.disk-ext-btn.disc:hover { background: rgba(224,64,64,.15); }
.disk-ext-btn:not(.conn):not(.browse):not(.disc) {
  color: var(--txt-lo); border-color: var(--steel); background: transparent; cursor: not-allowed; opacity: .5;
}

/* ── Файловый браузер внешнего диска ── */
.ext-browser { border-top: 1px solid rgba(42,53,69,.6); background: rgba(10,15,24,.5); }
.ext-browser-hdr {
  display: flex; align-items: center; padding: 8px 16px;
  border-bottom: 1px solid rgba(42,53,69,.4); gap: 8px;
}
.ext-browser-crumbs { flex: 1; display: flex; align-items: center; flex-wrap: wrap; gap: 2px; }
.ext-browser-close {
  background: none; border: none; color: var(--txt-lo); font-size: 14px;
  cursor: pointer; padding: 2px 6px;
}
.ext-browser-close:hover { color: var(--red); }