/* boards-browser.css — shared styles for the VSCode-style board tree picker. */

/* ─── Left side panel shell (mirrors info panel on the right) ─── */
.bb-panel{
  position:fixed; top:42px; left:-340px; width:340px;
  height:calc(100% - 42px); z-index:14;
  background:rgba(15,17,23,0.97);
  border-right:1px solid rgba(255,255,255,0.25);
  backdrop-filter:blur(16px);
  transition:left 0.35s cubic-bezier(0.4,0,0.2,1);
  display:flex; flex-direction:column; overflow:hidden;
  font-family:inherit;
}
.bb-panel.open{ left:0; }
.bb-panel-header{
  display:flex; align-items:center; padding:14px 16px;
  border-bottom:1px solid rgba(255,255,255,0.18); flex-shrink:0; height:52px;
}
.bb-panel-header h2{
  font-size:11px; color:#d32027; font-weight:700; text-transform:uppercase;
  letter-spacing:1.3px; margin:0; flex:1;
}
.bb-panel-close{
  background:transparent; border:1px solid rgba(255,255,255,0.2);
  color:#a8acb5; width:24px; height:24px; border-radius:5px; cursor:pointer;
  font-size:14px; line-height:1; display:flex; align-items:center; justify-content:center;
  transition:background .15s,color .15s;
}
.bb-panel-close:hover{ background:rgba(255,255,255,0.18); color:#d32027; }

/* Grid/tree container inside panel */
.bb-panel-body{
  flex:1 1 auto; display:flex; flex-direction:column; min-height:0;
}

/* ─── File type filters ─── */
.bbt-filter-bar{
  display:flex; align-items:center; gap:4px;
  padding:8px 8px 0;
  background:rgba(18,20,26,0.3);
  flex-shrink:0;
}
.bbt-filter-btn{
  height:26px;
  padding:0 8px;
  border:1px solid rgba(255,255,255,0.16);
  border-radius:5px;
  background:rgba(18,20,26,0.55);
  color:#a8acb5;
  font:600 11px/1 inherit;
  cursor:pointer;
  white-space:nowrap;
  transition:background .15s,color .15s,border-color .15s;
}
.bbt-filter-btn:hover{
  color:#e6e7ea;
  border-color:rgba(255,255,255,0.3);
  background:rgba(255,255,255,0.08);
}
.bbt-filter-btn.active{
  color:#f0f1f3;
  border-color:rgba(211,32,39,0.55);
  background:rgba(211,32,39,0.18);
}

/* ─── Search bar ─── */
.bbt-search-wrap{
  display:flex; align-items:center; gap:10px;
  padding:8px 12px;
  border-bottom:1px solid rgba(255,255,255,0.15);
  flex-shrink:0; background:rgba(18,20,26,0.3);
}
.bbt-search{
  flex:1; height:28px; padding:0 10px;
  background:rgba(18,20,26,0.7); color:#e6e7ea;
  border:1px solid rgba(255,255,255,0.22); border-radius:5px;
  font-size:12px; font-family:inherit; outline:none;
  transition:border-color .15s;
}
.bbt-search::placeholder{ color:#555e73; }
.bbt-search:focus{ border-color:rgba(211,32,39,0.55); }
.bbt-count{
  font-size:10px; color:#667790; letter-spacing:0.6px;
  text-transform:uppercase; white-space:nowrap;
}

/* ─── Tree ─── */
.bbt-tree{
  flex:1; overflow-y:auto; padding:4px 0;
  outline:none;
  font-family:ui-monospace, 'SF Mono', Menlo, Consolas, monospace;
  font-size:12px;
}
.bbt-tree::-webkit-scrollbar{ width:8px; }
.bbt-tree::-webkit-scrollbar-track{ background:transparent; }
.bbt-tree::-webkit-scrollbar-thumb{ background:rgba(255,255,255,0.18); border-radius:4px; }
.bbt-tree::-webkit-scrollbar-thumb:hover{ background:rgba(255,255,255,0.35); }

/* ─── Rows (shared base) ─── */
.bbt-row{
  display:flex; align-items:center; gap:6px;
  min-height:22px; padding:0 10px;
  color:#e6e7ea; cursor:pointer;
  user-select:none;
  white-space:nowrap; overflow:hidden;
}
.bbt-row:hover{ background:rgba(255,255,255,0.12); }

.bbt-indent{ width:14px; flex-shrink:0; }
.bbt-arrow{
  width:12px; text-align:center; flex-shrink:0;
  color:#667790; font-size:9px;
  transition:color .12s;
}
.bbt-row:hover .bbt-arrow{ color:#d32027; }
.bbt-icon{
  flex-shrink:0;
  font-size:13px; line-height:1;
  width:18px; text-align:center;
  filter:saturate(.85);
}
.bbt-folder-icon{
  position:relative;
  width:16px;
  height:12px;
  filter:none;
}
.bbt-folder-icon::before{
  content:"";
  position:absolute;
  left:1px;
  top:4px;
  width:14px;
  height:8px;
  border-radius:1px 2px 2px 2px;
  background:#f2c94c;
  box-shadow:inset 0 -1px 0 rgba(92,61,0,.25);
}
.bbt-folder-icon::after{
  content:"";
  position:absolute;
  left:2px;
  top:2px;
  width:7px;
  height:4px;
  border-radius:1px 1px 0 0;
  background:#ffd866;
}
.bbt-folder-open::before{
  background:#ffd35c;
}

.bbt-label{
  flex:0 0 auto;
  font-weight:600; letter-spacing:0.3px;
  color:#e6e7ea;
}
.bbt-chip{
  margin-left:auto;
  font-size:10px; color:#667790;
  background:rgba(255,255,255,0.12);
  padding:1px 7px; border-radius:9px;
  font-family:inherit;
  flex-shrink:0;
}

/* Category row: bolder, uppercase */
.bbt-cat .bbt-label{
  text-transform:uppercase; letter-spacing:1.1px;
  color:#e6e7ea; font-size:11px;
}

/* Brand row: medium weight */
.bbt-brand .bbt-label{
  color:#e6e7ea;
  font-size:12px;
}

/* Board row: dim, name + id */
.bbt-board{
  color:#8ea0b8;
}
.bbt-board .bbt-bullet{
  width:12px; text-align:center; flex-shrink:0;
  color:#4a5876; font-size:11px;
}
.bbt-board .bbt-name{
  flex:1 1 auto; min-width:0;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  color:#e6e7ea;
  font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}
.bbt-board .bbt-crumb{
  margin-left:auto;
  font-size:10px; color:#667790;
  background:rgba(255,255,255,0.1);
  padding:1px 6px; border-radius:8px;
  flex-shrink:0;
}
.bbt-board.current{
  background:rgba(211,32,39,0.1);
  box-shadow:inset 2px 0 0 #d32027;
}
.bbt-board.current .bbt-name{ color:#d32027; font-weight:600; }

/* Asset row: children of an expanded board (Boardview, Schematic PDF, …) */
.bbt-asset{
  color:#e6e7ea; font-size:12px;
}
.bbt-asset:hover{ background:rgba(211,32,39,0.07); color:#e6e7ea; }
.bbt-asset .bbt-bullet{
  width:12px; text-align:center; flex-shrink:0;
  color:#4a5876; font-size:11px;
}
.bbt-asset .bbt-icon{ font-size:13px; }
.bbt-asset .bbt-name{
  flex:1 1 auto; min-width:0;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

.bbt-del{
  background:transparent; border:1px solid transparent;
  color:#667790; width:18px; height:18px; border-radius:3px; cursor:pointer;
  font-size:13px; line-height:1; flex-shrink:0; margin-left:4px;
}
.bbt-del:hover{
  background:rgba(220,80,80,0.18); color:#ff6b6b;
  border-color:rgba(220,80,80,0.25);
}

.bbt-empty{
  padding:24px 16px; text-align:center;
  color:#667790; font-size:11px; letter-spacing:0.4px;
  font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}