/* tabs.css — Shared tab bar styling for 2D + 3D viewers.
   The host HTML is responsible for positioning the tab bar container
   (fixed, grid row, etc.). This stylesheet only styles chips + toast. */

.tabs-bar{
  display:flex; align-items:stretch;
  height:34px;
  padding:0 6px;
  background:rgba(18,20,26,0.96);
  border-bottom:1px solid rgba(255,255,255,0.2);
  backdrop-filter:blur(12px);
  box-shadow:0 2px 8px rgba(0,0,0,0.35);
  overflow:hidden;
  box-sizing:border-box;
}

.tabs-list{
  display:flex; align-items:stretch; gap:2px;
  flex:1 1 auto; min-width:0;
  overflow-x:auto; overflow-y:hidden;
  scrollbar-width:thin;
  padding:4px 0;
}
.tabs-list::-webkit-scrollbar{height:4px}
.tabs-list::-webkit-scrollbar-thumb{background:rgba(211,32,39,0.25);border-radius:2px}

.tab-chip{
  display:inline-flex; align-items:center; gap:6px;
  height:100%;
  padding:0 6px 0 10px;
  min-width:120px; max-width:220px;
  background:rgba(22,24,30,0.7);
  border:1px solid rgba(255,255,255,0.18);
  border-radius:6px;
  color:#a8acb5; font-size:11.5px;
  cursor:pointer;
  transition:background .12s, color .12s, border-color .12s;
  flex-shrink:0;
}
.tab-chip:hover{background:rgba(255,255,255,0.14);color:#e6e7ea;border-color:rgba(255,255,255,0.3)}
.tab-chip.active{
  background:rgba(211,32,39,0.12);
  color:#d32027;
  border-color:rgba(211,32,39,0.45);
}

.tab-chip .tab-icon{font-size:13px;line-height:1;flex-shrink:0}
.tab-chip .tab-title{
  flex:1 1 auto; min-width:0;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  font-weight:500; letter-spacing:0.2px;
}
.tab-chip .tab-close{
  background:transparent; border:none; cursor:pointer;
  color:inherit; opacity:0.5;
  font-size:14px; line-height:1;
  width:18px; height:18px; border-radius:4px;
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0; padding:0;
  font-family:inherit;
}
.tab-chip .tab-close:hover{opacity:1; background:rgba(232,70,70,0.22); color:#ff8866}

/* ─── Toast ─── */
.tabs-toast{
  position:fixed; left:50%; top:100px;
  transform:translateX(-50%) translateY(-8px);
  background:rgba(20,22,28,0.98);
  border:1px solid rgba(232,180,70,0.4);
  color:#e8c44a;
  padding:8px 14px; border-radius:8px;
  font-size:12px; font-weight:500;
  z-index:80;
  box-shadow:0 6px 24px rgba(0,0,0,0.6);
  opacity:0; pointer-events:none;
  transition:opacity .2s, transform .2s;
}
.tabs-toast.visible{opacity:1; transform:translateX(-50%) translateY(0)}

/* ─── Hide PDF sidebar-tab button when the active center tab is PDF. ─── */
body.pdf-fullscreen .sidebar-tab[data-sidebar-tab="pdf"]{
  display:none !important;
}