/* === Вторые руки — вкладки внутри программы + единый «назад/закрыть» === */

/* Панель вкладок */
.vr-tabbar{
  display:flex; align-items:flex-end; gap:3px;
  background:linear-gradient(180deg,#0B3D2E,#0A2A20);
  padding:7px 10px 0; overflow-x:auto; scrollbar-width:thin;
  position:sticky; top:0; z-index:40; min-height:44px;
}
.vr-tabbar::-webkit-scrollbar{height:5px}
.vr-tabbar::-webkit-scrollbar-thumb{background:rgba(255,255,255,.25);border-radius:3px}
.vr-tab{
  display:inline-flex; align-items:center; gap:9px;
  background:rgba(255,255,255,.10); color:rgba(255,255,255,.85);
  border:0; border-radius:9px 9px 0 0; padding:8px 12px;
  font-size:13px; font-weight:500; cursor:pointer; white-space:nowrap;
  max-width:230px; transition:background .15s, color .15s;
}
.vr-tab:hover{background:rgba(255,255,255,.18); color:#fff}
.vr-tab.active{background:#F5F6F8; color:#0A2A20; font-weight:600}
.vr-tab .vr-tab-title{overflow:hidden; text-overflow:ellipsis}
.vr-tab .vr-x{
  display:inline-flex; align-items:center; justify-content:center;
  width:18px; height:18px; border-radius:50%; font-size:14px; line-height:1;
  opacity:.65; flex:none;
}
.vr-tab .vr-x:hover{opacity:1; background:rgba(226,75,74,.9); color:#fff}
.vr-newtab{
  flex:none; background:transparent; color:rgba(255,255,255,.7); border:0;
  font-size:20px; cursor:pointer; padding:4px 10px; border-radius:8px; margin-bottom:2px;
}
.vr-newtab:hover{background:rgba(255,255,255,.14); color:#fff}

/* Область iframe-вкладок */
.vr-tabs-frames{position:relative; background:#F5F6F8; width:100%}
.vr-tabframe{width:100%; border:0; display:none; background:#F5F6F8}
.vr-tabframe.active{display:block}

/* === Встроенный режим (страница внутри вкладки) — прячем вложенную шапку === */
html.vr-embedded #nav-sidebar,
html.vr-embedded header.sticky,
html.vr-embedded .vr-tabbar { display:none !important; }
html.vr-embedded #main,
html.vr-embedded body > .flex { margin-left:0 !important; padding-left:0 !important; }
html.vr-embedded body { min-width:0 !important; }

/* Единая полоса «назад/закрыть» вверху встроенной страницы */
.vr-backbar{
  position:sticky; top:0; z-index:60;
  display:flex; align-items:center; gap:8px;
  background:#fff; border-bottom:1px solid #E3E8F0; padding:8px 14px;
}
.vr-backbar button{
  display:inline-flex; align-items:center; gap:6px;
  background:#F5F6F8; color:#1A2033; border:1px solid #E3E8F0; border-radius:9px;
  padding:7px 14px; font-size:13.5px; font-weight:600; cursor:pointer;
  font-family:inherit; transition:background .15s, border-color .15s, transform .12s;
}
.vr-backbar button:hover{background:#E7F7F0; border-color:#059669; transform:translateY(-1px)}
.vr-backbar button.vr-close{margin-left:auto}
.vr-backbar button.vr-close:hover{background:#fdecec; border-color:#e24b4a; color:#c0221a}

/* Индикатор загрузки вкладки */
.vr-tab.loading .vr-tab-title{
  padding-left:20px; position:relative;
}
.vr-tab.loading .vr-tab-title::before{
  content:""; position:absolute; left:0; top:50%; width:12px; height:12px;
  margin-top:-6px; border:2px solid rgba(255,255,255,.35); border-top-color:#10B981;
  border-radius:50%; animation:vrSpin .7s linear infinite;
}
.vr-tab.active.loading .vr-tab-title::before{border-color:rgba(5,150,105,.3); border-top-color:#059669}
@keyframes vrSpin{to{transform:rotate(360deg)}}

/* Командная палитра (Ctrl/Cmd+K) */
.vr-cmd-overlay{
  position:fixed; inset:0; z-index:9999; display:none;
  background:rgba(10,42,32,.45); backdrop-filter:blur(2px);
  align-items:flex-start; justify-content:center;
}
.vr-cmd-overlay.show{display:flex}
.vr-cmd{
  width:min(620px,92vw); margin-top:12vh; background:#fff; border-radius:16px;
  box-shadow:0 24px 60px rgba(0,0,0,.30); overflow:hidden;
  font-family:'Inter',-apple-system,Segoe UI,Roboto,sans-serif;
  animation:vrCmdIn .16s cubic-bezier(.2,.8,.2,1);
}
@keyframes vrCmdIn{from{opacity:0; transform:translateY(-8px)} to{opacity:1; transform:none}}
.vr-cmd-input{
  width:100%; border:0; border-bottom:1px solid #E3E8F0; padding:18px 20px;
  font-size:16px; color:#1A2033; outline:none; font-family:inherit;
}
.vr-cmd-list{max-height:52vh; overflow-y:auto; padding:6px}
.vr-cmd-row{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:11px 14px; border-radius:10px; cursor:pointer; font-size:14.5px; color:#1A2033;
}
.vr-cmd-row.active,.vr-cmd-row:hover{background:#E7F7F0}
.vr-cmd-badge{
  font-size:11px; font-weight:700; color:#065f46; background:#d1fae5;
  border-radius:999px; padding:2px 9px; flex:none;
}

/* Пустое состояние — карточка действия */
.vr-empty{
  background:#fff; border:1px solid #E3E8F0; border-radius:16px;
  padding:34px 28px; text-align:center; margin:0 0 18px;
  box-shadow:0 2px 12px rgba(0,0,0,.05);
}
.vr-empty-h{font-size:19px; font-weight:700; color:#1A2033; margin-bottom:6px}
.vr-empty-p{font-size:14px; color:#808BA3; margin-bottom:18px}
.vr-empty-btn{
  display:inline-block; background:linear-gradient(145deg,#10B981,#059669); color:#fff;
  text-decoration:none; font-weight:700; font-size:15px; padding:12px 26px; border-radius:12px;
  box-shadow:0 6px 16px rgba(16,185,129,.30); transition:transform .14s, box-shadow .18s;
}
.vr-empty-btn:hover{transform:translateY(-2px); box-shadow:0 10px 26px rgba(16,185,129,.42)}

@media (prefers-reduced-motion: reduce){
  .vr-tab, .vr-backbar button, .vr-empty-btn{transition:none !important}
  .vr-backbar button:hover, .vr-empty-btn:hover{transform:none !important}
  .vr-tab.loading .vr-tab-title::before, .vr-cmd{animation:none !important}
}
