/* VoltTech Portal Shell v5
   Navigation/layout refinements only. Business/auth logic remains untouched. */

.portal-section-label{
  margin:18px 0 8px;
  color:var(--teal,#2fe6c8);
  font:700 8px 'JetBrains Mono',monospace;
  letter-spacing:.11em;
  text-transform:uppercase
}

/* Customer account main navigation */
#accountHub .account-primary-nav.portal-account-nav{
  display:flex!important;
  align-items:center;
  gap:6px;
  overflow-x:auto;
  overscroll-behavior-x:contain;
  scrollbar-width:none;
  margin:0 0 12px;
  padding:0 0 3px
}
#accountHub .account-primary-nav.portal-account-nav::-webkit-scrollbar{display:none}
#accountHub .account-primary-nav.portal-account-nav .tab{
  flex:0 0 auto!important;
  min-height:36px!important;
  border-radius:999px!important;
  padding:0 12px!important;
  font-size:8px!important;
  white-space:nowrap
}
#accountHub .account-primary-nav.portal-account-nav .portal-admin-link{
  border-color:rgba(255,180,84,.32);
  color:#ffbd68
}

#accountHub .account-more-panel.portal-more-panel{
  margin:-2px 0 14px;
  padding:8px;
  border-radius:9px
}
#accountHub .account-more-panel.portal-more-panel .account-more-grid{
  display:flex!important;
  flex-wrap:wrap;
  gap:6px
}
#accountHub .account-more-panel.portal-more-panel .tab{
  min-height:36px!important;
  flex:1 1 135px;
  border-radius:6px;
  padding:0 10px!important;
  font-size:8px!important
}

/* Account overview made useful on a phone rather than enormous */
#accountHub .profile-head{
  margin-bottom:14px
}
#accountHub .profile-head h1{
  font-size:clamp(22px,5vw,26px)
}
#accountHub .panel[data-panel="overview"]{
  padding:18px
}
#accountHub .dashboard-grid{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:8px!important
}
#accountHub .dash-card{
  min-height:108px!important;
  padding:13px!important;
  border-radius:7px!important
}
#accountHub .dash-card small{
  font-size:7.5px!important
}
#accountHub .dash-card strong{
  font-size:23px!important;
  margin:8px 0 3px!important
}
#accountHub .dash-card span{
  font-size:10.5px!important;
  line-height:1.35!important
}
#accountHub .dash-card.action{
  grid-column:1/-1!important;
  min-height:0!important;
  padding:15px!important
}
#accountHub .dash-card.action strong{
  font-size:16px!important
}
#accountHub .quick-row{
  gap:7px!important;
  margin-top:10px!important
}
#accountHub .quick-row .btn{
  min-height:40px!important;
  padding:0 12px!important;
  font-size:8px!important
}

/* Same customer navigation on every account sub-page */
.portal-customer-nav{
  display:flex;
  align-items:center;
  gap:5px;
  min-width:0;
  overflow-x:auto;
  scrollbar-width:none;
  padding:2px 0
}
.portal-customer-nav::-webkit-scrollbar{display:none}
.portal-customer-nav a{
  flex:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:34px;
  padding:0 9px;
  border:1px solid transparent;
  border-radius:999px;
  color:var(--muted,#78918d)!important;
  font:700 7.5px 'JetBrains Mono',monospace!important;
  text-transform:uppercase;
  white-space:nowrap
}
.portal-customer-nav a:hover,
.portal-customer-nav a:focus-visible{
  color:var(--text,#eaf4f1)!important;
  border-color:var(--line,#1a2b2b);
  outline:none
}
.portal-customer-nav a.active{
  color:#04120f!important;
  background:var(--teal,#2fe6c8);
  border-color:var(--teal,#2fe6c8)
}

/* Admin shell */
.portal-admin-nav{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
  position:relative
}
.portal-admin-nav a,
.portal-admin-nav button{
  min-height:35px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid var(--l,var(--line,#1a2b2b));
  border-radius:999px;
  background:transparent;
  color:var(--t,var(--teal,#2fe6c8));
  padding:0 11px;
  font:700 8px 'JetBrains Mono',monospace;
  text-transform:uppercase;
  cursor:pointer
}
.portal-admin-nav a.active{
  background:var(--t,var(--teal,#2fe6c8));
  color:#04120f;
  border-color:var(--t,var(--teal,#2fe6c8))
}
.portal-admin-more{
  position:absolute;
  right:0;
  top:calc(100% + 7px);
  z-index:100;
  width:min(250px,78vw);
  display:grid;
  gap:5px;
  padding:7px;
  border:1px solid var(--l,var(--line,#1a2b2b));
  border-radius:9px;
  background:#07100f;
  box-shadow:0 18px 55px rgba(0,0,0,.55)
}
.portal-admin-more[hidden]{display:none!important}
.portal-admin-more a{
  width:100%;
  justify-content:flex-start;
  border-radius:6px
}

.portal-admin-actions{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  margin-top:14px
}
.portal-admin-actions a,
.portal-admin-actions button{
  min-height:44px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid var(--l,var(--line,#1a2b2b));
  border-radius:6px;
  background:#081111;
  color:var(--t,var(--teal,#2fe6c8));
  padding:0 10px;
  font:700 8px 'JetBrains Mono',monospace;
  text-transform:uppercase;
  text-decoration:none
}
.portal-admin-actions button{cursor:pointer}
.portal-admin-actions .primary{
  background:var(--t,var(--teal,#2fe6c8));
  border-color:var(--t,var(--teal,#2fe6c8));
  color:#04120f
}
.portal-collapsible{
  scroll-margin-top:80px
}
.portal-collapsible[hidden],
[data-portal-hidden="true"]{
  display:none!important
}

/* Compact workflow map: useful reference, not half the screen */
#workflowPanel .vt-flow{
  display:flex!important;
  overflow-x:auto;
  gap:6px!important;
  scrollbar-width:none;
  margin:12px 0 16px!important
}
#workflowPanel .vt-flow::-webkit-scrollbar{display:none}
#workflowPanel .vt-flow-step{
  flex:0 0 145px;
  min-height:66px;
  padding:9px!important
}
#workflowPanel .vt-flow-step span{
  font-size:9px!important;
  line-height:1.3!important
}

/* Header refinements used with notification placement */
.portal-header-has-notify{
  gap:8px!important
}

@media(max-width:720px){
  #accountHub .dashboard-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important
  }
  #accountHub .panel[data-panel="overview"]{
    padding:15px 13px
  }
  .portal-admin-actions{
    grid-template-columns:1fr
  }
  .portal-admin-nav{
    flex-wrap:nowrap;
    overflow-x:auto;
    scrollbar-width:none;
    width:100%
  }
  .portal-admin-nav::-webkit-scrollbar{display:none}
  .portal-admin-nav a,
  .portal-admin-nav button{
    flex:none
  }
  .portal-customer-nav{
    max-width:calc(100vw - 125px)
  }
}

@media(max-width:390px){
  #accountHub .dash-card{
    min-height:101px!important;
    padding:11px!important
  }
  #accountHub .dash-card strong{
    font-size:21px!important
  }
}


/* v5.2 semantic status language */
.pill.vt-status-success,.v4-status.vt-status-success,.vt-work-stage.vt-status-success,[data-status-pill].vt-status-success{color:#68ffae!important;border-color:rgba(80,255,159,.48)!important;background:rgba(45,214,123,.085)!important;box-shadow:inset 0 0 0 1px rgba(80,255,159,.04),0 0 16px rgba(45,214,123,.11)!important;text-shadow:0 0 12px rgba(80,255,159,.30)}
.pill.vt-status-warning,.v4-status.vt-status-warning,.vt-work-stage.vt-status-warning,[data-status-pill].vt-status-warning{color:#ffd06f!important;border-color:rgba(255,190,84,.46)!important;background:rgba(255,180,84,.075)!important;box-shadow:inset 0 0 0 1px rgba(255,190,84,.035),0 0 14px rgba(255,180,84,.08)!important;text-shadow:0 0 10px rgba(255,190,84,.22)}
.pill.vt-status-danger,.v4-status.vt-status-danger,.vt-work-stage.vt-status-danger,[data-status-pill].vt-status-danger{color:#ff8c92!important;border-color:rgba(255,102,112,.52)!important;background:rgba(255,77,88,.075)!important;box-shadow:inset 0 0 0 1px rgba(255,102,112,.04),0 0 17px rgba(255,77,88,.10)!important;text-shadow:0 0 11px rgba(255,102,112,.24)}
.pill.vt-status-active,.v4-status.vt-status-active,.vt-work-stage.vt-status-active,[data-status-pill].vt-status-active{color:#42ead1!important;border-color:rgba(47,230,200,.40)!important;background:rgba(47,230,200,.065)!important;box-shadow:inset 0 0 0 1px rgba(47,230,200,.03),0 0 13px rgba(47,230,200,.07)!important;text-shadow:0 0 10px rgba(47,230,200,.18)}
.pill.vt-status-neutral,.v4-status.vt-status-neutral,.vt-work-stage.vt-status-neutral,[data-status-pill].vt-status-neutral{color:#98aaa6!important;border-color:rgba(143,164,159,.24)!important;background:rgba(143,164,159,.035)!important;box-shadow:none!important;text-shadow:none}
.vt-work-stage[class*="vt-status-"]{display:inline-flex!important;align-items:center;min-height:22px;padding:0 8px;border:1px solid;border-radius:999px;font-size:7px!important;letter-spacing:.08em}
#overviewAction[data-state="attention"]{border-color:rgba(255,190,84,.38)!important;background:linear-gradient(135deg,rgba(255,180,84,.065),rgba(8,17,17,.96))!important;box-shadow:0 0 22px rgba(255,180,84,.045)}
#overviewAction[data-state="attention"] small{color:#ffd06f!important}
#overviewAction[data-state="urgent"]{border-color:rgba(255,102,112,.48)!important;background:linear-gradient(135deg,rgba(255,77,88,.075),rgba(8,17,17,.96))!important;box-shadow:0 0 26px rgba(255,77,88,.07)}
#overviewAction[data-state="urgent"] small{color:#ff8c92!important;text-shadow:0 0 10px rgba(255,102,112,.20)}
#overviewAction[data-state="clear"]{border-color:rgba(80,255,159,.20)!important}
#overviewAction[data-state="clear"] small{color:#68ffae!important}
