/* Sidebar tools shared by the workspace (#app>.nav) and "My sites" (.shell>.nav): language switch + collapse. */
.nav-tools{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:10px 0 2px}
.nav-tools .lang-slot{display:flex;min-width:0}
.nav-tools .language-switch{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 10px;border:1px solid #dce4ef;border-radius:6px;background:#fff;color:#2f4466;font-size:13px;font-weight:500;text-decoration:none;white-space:nowrap}
.nav-tools .language-switch:hover{background:#f2f6fe;color:#005ae0;text-decoration:none}
.nav-tools .language-switch::before{content:"";width:14px;height:14px;flex-shrink:0;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M2 12h20M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M2 12h20M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z'/%3E%3C/svg%3E") center/contain no-repeat}
.nav-collapse{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;flex-shrink:0;border:1px solid #dce4ef;border-radius:6px;background:#fff;color:#53607a;cursor:pointer;padding:0}
.nav-collapse:hover{background:#f2f6fe;color:#005ae0}.nav-collapse:focus-visible,.nav-tools .language-switch:focus-visible{outline:2px solid #005ae0;outline-offset:2px}
.nav-collapse svg{width:17px;height:17px}.nav-collapse .when-mini{display:none}

/* Collapsed: icons only. Desktop widths only; on phones the sidebar is already a drawer. */
@media (min-width:761px){
  html.nav-mini #app>.nav{width:68px!important;padding:0 8px}
  html.nav-mini #app .main{margin-left:68px!important}
  html.nav-mini #app>.nav>.brand{font-size:0!important;justify-content:center;padding:0!important;margin:0 -8px!important;gap:0;overflow:hidden}
  html.nav-mini #app>.nav nav{gap:4px}
  html.nav-mini #app>.nav nav>button,html.nav-mini #app>.nav nav>a{font-size:0!important;justify-content:center;gap:0!important;padding:0!important}
  html.nav-mini #app>.nav nav svg{width:20px;height:20px}
  html.nav-mini #app>.nav .plan{display:none}
}
@media (min-width:901px){
  html.nav-mini .shell{grid-template-columns:68px minmax(0,1fr)}
  html.nav-mini .shell>.nav{padding:0 8px 16px}
  html.nav-mini .shell>.nav .brand{font-size:0!important;justify-content:center;padding:0!important;margin:0 -8px 10px!important;gap:0;overflow:hidden}
  html.nav-mini .shell>.nav .label,html.nav-mini .shell>.nav .sites small{display:none}
  html.nav-mini .shell>.nav .sites a{justify-content:center;padding:9px 0}
  html.nav-mini .shell>.nav .sites a span{font-size:0}
  html.nav-mini .shell>.nav .sites a span::before{content:attr(data-short);font-size:12px;font-weight:600;letter-spacing:.02em}
  html.nav-mini .shell>.nav .api-link,html.nav-mini .shell>.nav .back{font-size:0;justify-content:center;gap:0}
  html.nav-mini .shell>.nav .api-link svg,html.nav-mini .shell>.nav .back svg{width:18px;height:18px}
}
@media (min-width:761px){
  html.nav-mini #app .nav-tools,html.nav-mini .shell .nav-tools{flex-direction:column;gap:6px}
  html.nav-mini .nav-tools .language-switch{font-size:0;padding:0;width:32px;justify-content:center;gap:0}
  html.nav-mini .nav-collapse .when-open{display:none}html.nav-mini .nav-collapse .when-mini{display:block}
}
@media (max-width:760px){#app .nav-collapse{display:none}}
@media (max-width:900px){.shell .nav-collapse{display:none}}
#app>.nav nav>a.site-dashboards{display:flex;align-items:center;gap:13px;height:46px;padding:9px 13px;margin-bottom:6px;border-radius:6px;background:#f2f6fe;color:#005ae0;font-weight:600;text-decoration:none}
#app>.nav nav>a.site-dashboards:hover{background:#e6eefc}
