/* Project Atlas final interface repair: visible labels, account clarity and dashboard structure */

/* Accessibility link remains hidden until keyboard focus */
.skip-link{
  position:fixed !important;
  left:16px !important;
  top:-120px !important;
  z-index:100000 !important;
  padding:12px 16px !important;
  border-radius:10px !important;
  background:#fff !important;
  color:#25143e !important;
  font-weight:800 !important;
  text-decoration:none !important;
  transition:top .18s ease !important;
}
.skip-link:focus{top:16px !important}

/* Dashboard must remain a genuine two-column application shell */
body:has(.dash-layout){overflow:hidden !important}
.dash-layout{
  display:grid !important;
  grid-template-columns:240px minmax(0,1fr) !important;
  height:calc(100vh - 82px) !important;
  min-height:0 !important;
  overflow:hidden !important;
}
.dash-layout > .sidebar{
  display:flex !important;
  grid-column:1 !important;
  grid-row:1 !important;
  width:auto !important;
  min-width:0 !important;
  height:100% !important;
  overflow-y:auto !important;
}
.dash-layout > .dash-content{
  display:block !important;
  grid-column:2 !important;
  grid-row:1 !important;
  min-width:0 !important;
  height:100% !important;
  overflow-y:auto !important;
  padding:32px clamp(20px,3vw,46px) 72px !important;
}
.dash-content .page-hero{margin-top:0 !important}

/* Prevent decorative or loading layers from participating in page layout */
#gla-loader{position:fixed !important}

/* Account centre: premium dark glass treatment and readable text */
body:has(main.wrap) main.wrap{
  width:min(1200px,100%) !important;
  padding-top:38px !important;
}
body:has(main.wrap) .hero{
  position:relative !important;
  overflow:hidden !important;
  isolation:isolate !important;
  padding:clamp(30px,5vw,54px) !important;
  border:1px solid rgba(255,255,255,.14) !important;
  background:
    radial-gradient(circle at 88% 18%,rgba(80,170,255,.22),transparent 30%),
    radial-gradient(circle at 12% 85%,rgba(232,192,32,.13),transparent 34%),
    linear-gradient(135deg,#32145c 0%,#5b23a7 52%,#17102b 100%) !important;
  box-shadow:0 28px 80px rgba(8,2,24,.38) !important;
}
body:has(main.wrap) .hero::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  opacity:.18;
  background-image:
    linear-gradient(rgba(255,255,255,.07) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.07) 1px,transparent 1px);
  background-size:42px 42px;
  mask-image:linear-gradient(120deg,#000,transparent 78%);
}
body:has(main.wrap) .hero::after{
  content:"";
  position:absolute;
  width:360px;
  height:140px;
  right:-70px;
  bottom:-55px;
  border:2px solid rgba(232,192,32,.42);
  border-radius:50%;
  transform:rotate(-12deg);
  z-index:-1;
}
body:has(main.wrap) .hero h1,
body:has(main.wrap) .hero p{color:#fff !important}
body:has(main.wrap) .hero p{color:rgba(255,255,255,.78) !important;max-width:620px}
body:has(main.wrap) .avatar{
  background:linear-gradient(145deg,rgba(255,255,255,.22),rgba(255,255,255,.06)) !important;
  color:#fff !important;
  box-shadow:inset 0 1px rgba(255,255,255,.28),0 18px 40px rgba(0,0,0,.24) !important;
}

body:has(main.wrap) .panel{
  background:linear-gradient(145deg,rgba(39,20,68,.94),rgba(24,12,45,.96)) !important;
  border:1px solid rgba(255,255,255,.14) !important;
  box-shadow:inset 0 1px rgba(255,255,255,.05),0 20px 54px rgba(7,2,22,.25) !important;
  color:#f8f4ff !important;
}
body:has(main.wrap) .panel h2,
body:has(main.wrap) .panel b,
body:has(main.wrap) .panel td,
body:has(main.wrap) .panel code{color:#f8f4ff !important}
body:has(main.wrap) .panel .muted,
body:has(main.wrap) .panel .empty,
body:has(main.wrap) .panel p{color:#cfc3df !important}
body:has(main.wrap) .panel th{color:#aa9aba !important;border-color:rgba(255,255,255,.14) !important}
body:has(main.wrap) .panel td{border-color:rgba(255,255,255,.12) !important}
body:has(main.wrap) .quick a{
  background:rgba(255,255,255,.055) !important;
  border-color:rgba(255,255,255,.20) !important;
  color:#f8f4ff !important;
  transition:transform .18s ease,background .18s ease,border-color .18s ease !important;
}
body:has(main.wrap) .quick a:hover{
  transform:translateY(-2px);
  background:rgba(124,58,237,.20) !important;
  border-color:rgba(167,139,250,.55) !important;
}
body:has(main.wrap) .quick a i{color:#e8c020 !important}
body:has(main.wrap) .access-card{background:rgba(255,255,255,.05) !important;border-color:rgba(255,255,255,.14) !important}

.empty-state-copy{display:flex;flex-wrap:wrap;align-items:center;gap:16px;padding:6px 0}
.empty-state-copy p{margin:0 !important}
.account-action-button{
  display:inline-flex !important;
  align-items:center !important;
  gap:9px !important;
  padding:12px 16px !important;
  border-radius:12px !important;
  background:linear-gradient(135deg,#7c3aed,#4fa9ff) !important;
  color:#fff !important;
  text-decoration:none !important;
  font-weight:800 !important;
  box-shadow:0 10px 25px rgba(91,45,210,.30) !important;
}
.account-action-button:hover{transform:translateY(-1px);filter:brightness(1.06)}

/* Badge panel should match the page rather than becoming an isolated light component */
body:has(main.wrap) .gla-note{
  background:linear-gradient(145deg,rgba(39,20,68,.94),rgba(24,12,45,.96)) !important;
  border:1px solid rgba(255,255,255,.14) !important;
  color:#f8f4ff !important;
}
body:has(main.wrap) .gla-note p{color:#cfc3df !important}

@media(max-width:1024px){
  .dash-layout{grid-template-columns:210px minmax(0,1fr) !important}
}
@media(max-width:900px){
  body:has(.dash-layout){overflow:auto !important}
  .dash-layout{display:block !important;height:auto !important;overflow:visible !important}
  .dash-layout > .sidebar{display:none !important}
  .dash-layout > .dash-content{height:auto !important;overflow:visible !important;padding:22px 16px 72px !important}
}
@media(max-width:640px){
  body:has(main.wrap) .hero{align-items:flex-start !important}
  body:has(main.wrap) .avatar{width:60px !important;height:60px !important;border-radius:18px !important}
  .empty-state-copy{align-items:flex-start;flex-direction:column}
}