#project-switcher{max-width:260px;min-width:150px;padding:8px 34px 8px 11px;border-radius:10px;border:1px solid rgba(139,92,246,.55);background:#111522;color:#edf1f7}.vxProjectAdd{padding:8px 11px;border-radius:10px;border:1px solid rgba(139,92,246,.55);background:rgba(124,82,221,.16);color:#e9e2ff;cursor:pointer;font-weight:700}@media(max-width:720px){#project-switcher{max-width:145px}.vxProjectAdd{font-size:0}.vxProjectAdd:after{content:'+';font-size:18px}}


/* Project suspension */
.vxProjectSuspendedBanner{margin:12px 18px 0;padding:13px 16px;display:flex;align-items:flex-start;gap:12px;border:1px solid rgba(255,116,116,.32);border-radius:14px;background:linear-gradient(135deg,rgba(111,24,33,.38),rgba(35,17,25,.86));box-shadow:0 10px 30px rgba(0,0,0,.18);color:#f5e9ec}
.vxProjectSuspendedIcon{display:grid;place-items:center;flex:0 0 34px;width:34px;height:34px;border-radius:10px;background:rgba(255,103,119,.13);color:#ff8997;font-weight:900}
.vxProjectSuspendedBanner strong{display:block;font-size:14px;color:#fff}
.vxProjectSuspendedBanner p{margin:4px 0 0;font-size:12px;line-height:1.5;color:#d7bdc3}
@media(max-width:700px){.vxProjectSuspendedBanner{margin:9px 10px 0;padding:11px 12px}.vxProjectSuspendedIcon{display:none}}

/* Tariff capacity overflow */
.vxProjectCapacityBanner{margin:10px 18px 0;padding:12px 15px;display:flex;align-items:center;gap:12px;border:1px solid rgba(245,190,67,.32);border-radius:14px;background:linear-gradient(135deg,rgba(98,67,12,.28),rgba(28,24,15,.88));box-shadow:0 10px 30px rgba(0,0,0,.14);color:#f5edd9}
.vxProjectCapacityIcon{display:grid;place-items:center;flex:0 0 32px;width:32px;height:32px;border-radius:10px;background:rgba(245,190,67,.14);color:#ffd56a;font-weight:900}
.vxProjectCapacityBanner strong{display:block;font-size:13px;color:#fff5d8}.vxProjectCapacityBanner p{margin:3px 0 0;font-size:12px;line-height:1.45;color:#d8ccb0}.vxProjectCapacityBanner>a{margin-left:auto;white-space:nowrap;padding:8px 11px;border-radius:9px;border:1px solid rgba(245,190,67,.35);color:#ffe4a0;text-decoration:none;font-size:12px;font-weight:800;background:rgba(245,190,67,.08)}
@media(max-width:700px){.vxProjectCapacityBanner{margin:8px 10px 0;align-items:flex-start;flex-wrap:wrap}.vxProjectCapacityIcon{display:none}.vxProjectCapacityBanner>a{margin-left:0}}
/* Empty account header: the project selector is fully replaced by the create action. */
body.vx-authenticated.vx-no-projects > header:not(.vx-public-header) > .row > #project-switcher,
body.vx-authenticated.vx-no-projects > header:not(.vx-public-header) > .row > #vx-project-switcher-custom,
body.vx-authenticated[data-vx-project-count="0"] > header:not(.vx-public-header) > .row > #project-switcher,
body.vx-authenticated[data-vx-project-count="0"] > header:not(.vx-public-header) > .row > #vx-project-switcher-custom,
body.vx-authenticated > header.vx-no-projects:not(.vx-public-header) > .row > #project-switcher,
body.vx-authenticated > header.vx-no-projects:not(.vx-public-header) > .row > #vx-project-switcher-custom{
  display:none!important;
  visibility:hidden!important;
  pointer-events:none!important;
}

/* Create-project CTA. Keep selector-specific rules stronger than the later redesign/mobile sheets. */
#vx-project-add.vxProjectAdd--empty{
  display:none;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-height:38px;
  padding:0 13px 0 9px;
  border:1px solid rgba(124,108,246,.42)!important;
  border-radius:11px!important;
  background:linear-gradient(135deg,rgba(111,92,236,.24),rgba(74,91,210,.15))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.055),0 5px 16px rgba(0,0,0,.16);
  color:#eceaff!important;
  text-decoration:none!important;
  white-space:nowrap;
  font-size:13px!important;
  font-weight:800!important;
  line-height:1;
  cursor:pointer;
  transition:transform .15s ease,border-color .15s ease,background .15s ease,box-shadow .15s ease;
}
body.vx-authenticated.vx-no-projects > header:not(.vx-public-header) > .row > #vx-project-add.vxProjectAdd--empty,
body.vx-authenticated[data-vx-project-count="0"] > header:not(.vx-public-header) > .row > #vx-project-add.vxProjectAdd--empty,
body.vx-authenticated > header.vx-no-projects:not(.vx-public-header) > .row > #vx-project-add.vxProjectAdd--empty{
  display:inline-flex!important;
  visibility:visible!important;
  opacity:1!important;
  pointer-events:auto!important;
  flex:0 0 auto!important;
  order:20!important;
}
#vx-project-add.vxProjectAdd--empty::after{content:none!important;display:none!important}
#vx-project-add.vxProjectAdd--empty:hover{
  transform:translateY(-1px);
  border-color:rgba(158,144,255,.72)!important;
  background:linear-gradient(135deg,rgba(122,100,248,.34),rgba(79,99,225,.22))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.075),0 7px 20px rgba(0,0,0,.2);
  color:#fff!important;
}
#vx-project-add.vxProjectAdd--empty:active{transform:translateY(0)}
#vx-project-add .vxProjectAddIcon{
  display:grid!important;
  place-items:center;
  width:23px;
  height:23px;
  flex:0 0 23px;
  border-radius:7px;
  background:rgba(157,143,255,.14);
  border:1px solid rgba(175,164,255,.22);
  color:#cfc8ff;
  font-size:17px!important;
  font-weight:600;
  line-height:1;
}
#vx-project-add .vxProjectAddLabel{display:inline!important;text-decoration:none!important}

@media(max-width:820px){
  body.vx-authenticated.vx-no-projects > header:not(.vx-public-header) > .row > #vx-project-add.vxProjectAdd--empty,
body.vx-authenticated[data-vx-project-count="0"] > header:not(.vx-public-header) > .row > #vx-project-add.vxProjectAdd--empty,
body.vx-authenticated > header.vx-no-projects:not(.vx-public-header) > .row > #vx-project-add.vxProjectAdd--empty{
    display:inline-flex!important;
    height:34px!important;
    min-height:34px!important;
    padding:0 10px 0 7px!important;
    gap:6px!important;
    border-radius:9px!important;
    font-size:11px!important;
  }
  #vx-project-add .vxProjectAddIcon{width:21px;height:21px;flex-basis:21px;border-radius:6px;font-size:15px!important}
}
@media(max-width:390px){
  body.vx-authenticated.vx-no-projects > header:not(.vx-public-header) > .row > #vx-project-add.vxProjectAdd--empty,
body.vx-authenticated[data-vx-project-count="0"] > header:not(.vx-public-header) > .row > #vx-project-add.vxProjectAdd--empty,
body.vx-authenticated > header.vx-no-projects:not(.vx-public-header) > .row > #vx-project-add.vxProjectAdd--empty{
    width:34px!important;
    padding:0!important;
  }
  #vx-project-add .vxProjectAddLabel{display:none!important}
  #vx-project-add .vxProjectAddIcon{width:30px;height:30px;flex-basis:30px;border:0;background:transparent}
}
