/* Vier API Cyber Console UI v2.1
   Mobile polish + stronger cyber command-center aesthetic
   Frontend only. Load AFTER cyber-console-v2.css.
*/

:root{
  --cy21-bg:#02050a;
  --cy21-panel:rgba(4,12,20,.94);
  --cy21-panel2:rgba(8,18,29,.94);
  --cy21-line:rgba(85,231,255,.18);
  --cy21-line2:rgba(171,103,255,.22);
  --cy21-cyan:#55e7ff;
  --cy21-violet:#a667ff;
  --cy21-green:#56f2ac;
  --cy21-amber:#ffc36a;
  --cy21-text:#f5fbff;
  --cy21-muted:#8397aa;
}

/* ===== stronger global atmosphere ===== */
body.enterprise-v5{
  background:
    radial-gradient(900px 560px at 105% -5%,rgba(166,103,255,.14),transparent 58%),
    radial-gradient(740px 500px at -12% 22%,rgba(85,231,255,.10),transparent 62%),
    linear-gradient(180deg,#030812 0%,#02050a 48%,#010307 100%)!important;
}
body.enterprise-v5:before{
  opacity:.9!important;
  background-image:
    linear-gradient(rgba(85,231,255,.026) 1px,transparent 1px),
    linear-gradient(90deg,rgba(85,231,255,.026) 1px,transparent 1px),
    radial-gradient(circle at 50% 0%,rgba(85,231,255,.06),transparent 38%)!important;
  background-size:28px 28px,28px 28px,100% 100%!important;
}
body.enterprise-v5:after{
  opacity:.09!important;
}

/* ===== top control bar ===== */
.neo-topbar.dashboard-header-clean{
  height:78px!important;
  border-bottom:1px solid rgba(85,231,255,.18)!important;
  background:rgba(2,7,12,.88)!important;
  box-shadow:0 12px 40px rgba(0,0,0,.38),0 1px 0 rgba(255,255,255,.02) inset!important;
}
.neo-topbar.dashboard-header-clean:before{
  content:"VIER // CONTROL CENTER"!important;
  white-space:nowrap!important;
  color:rgba(235,248,255,.78)!important;
  text-shadow:0 0 16px rgba(85,231,255,.18)!important;
}
.plan-mini{
  max-width:150px!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  box-shadow:0 0 22px rgba(85,231,255,.05)!important;
}

/* ===== profile hero: command identity card ===== */
.profile-hero{
  border-color:rgba(85,231,255,.22)!important;
  background:
    linear-gradient(135deg,rgba(8,20,31,.96),rgba(3,10,18,.96))!important;
  box-shadow:
    0 0 0 1px rgba(166,103,255,.04) inset,
    0 28px 80px rgba(0,0,0,.42),
    0 0 40px rgba(85,231,255,.035)!important;
}
.profile-hero:before{
  padding:7px 10px!important;
  border:1px solid rgba(86,242,172,.16)!important;
  border-radius:999px!important;
  background:rgba(86,242,172,.04)!important;
}
.profile-hero:after{
  width:420px!important;
  height:420px!important;
  right:-130px!important;
  top:-170px!important;
  background:
    radial-gradient(circle,rgba(85,231,255,.14),rgba(166,103,255,.08) 35%,transparent 68%)!important;
}
.profile-avatar{
  box-shadow:
    0 0 0 1px rgba(85,231,255,.22),
    0 0 0 8px rgba(85,231,255,.025),
    0 0 42px rgba(85,231,255,.09)!important;
}
.profile-avatar:after{
  border-style:solid!important;
  border-color:rgba(85,231,255,.46) rgba(166,103,255,.48) rgba(85,231,255,.13) rgba(166,103,255,.18)!important;
  box-shadow:0 0 18px rgba(85,231,255,.08)!important;
}
.profile-name-row h1{
  line-height:.96!important;
}

/* ===== access modules ===== */
.account-actions{
  gap:12px!important;
}
.account-action{
  min-height:142px!important;
  border-color:rgba(85,231,255,.16)!important;
  background:
    linear-gradient(150deg,rgba(8,19,30,.96),rgba(3,9,16,.98))!important;
}
.account-action:before{
  height:1px!important;
  background:linear-gradient(90deg,var(--cy21-cyan),var(--cy21-violet),transparent 85%)!important;
}
.account-action:hover{
  border-color:rgba(85,231,255,.35)!important;
  transform:translateY(-3px)!important;
}
.account-glyph{
  background:
    linear-gradient(145deg,rgba(85,231,255,.08),rgba(166,103,255,.045))!important;
}
.account-action b{
  font-size:16px!important;
  letter-spacing:-.015em!important;
}
.account-action small{
  line-height:1.45!important;
}

/* unique accent per access card */
.account-action:nth-child(1) .account-glyph{color:#b26cff!important}
.account-action:nth-child(2) .account-glyph{color:#7fb5ff!important}
.account-action:nth-child(3) .account-glyph{color:#61e0a4!important}
.account-action:nth-child(4) .account-glyph{color:#ffc36a!important}

/* ===== telemetry command grid ===== */
.neo-stats.dashboard-core-stats{
  gap:12px!important;
}
.neo-stats.dashboard-core-stats article{
  min-width:0!important;
  min-height:126px!important;
  border-color:rgba(85,231,255,.16)!important;
  background:
    linear-gradient(145deg,rgba(5,15,24,.96),rgba(2,8,14,.98))!important;
  box-shadow:
    0 16px 38px rgba(0,0,0,.24),
    inset 0 1px rgba(255,255,255,.015)!important;
}
.neo-stats.dashboard-core-stats article:after{
  content:""!important;
  position:absolute!important;
  left:0!important;
  bottom:0!important;
  width:44%!important;
  height:1px!important;
  background:linear-gradient(90deg,var(--cy21-cyan),transparent)!important;
  opacity:.55!important;
}
.neo-stats.dashboard-core-stats strong{
  display:block!important;
  min-width:0!important;
  max-width:100%!important;
  line-height:1.02!important;
  overflow-wrap:anywhere!important;
  word-break:break-word!important;
}
.neo-stats.dashboard-core-stats article:nth-child(2) strong{
  font-size:clamp(20px,3vw,30px)!important;
}
.neo-stats.dashboard-core-stats article:nth-child(4) strong{
  font-size:clamp(20px,3vw,28px)!important;
}

/* ===== notification terminal: fix overlap ===== */
.notification-center-card:before{
  position:static!important;
  inset:auto!important;
  width:auto!important;
  height:auto!important;
  display:block!important;
  margin:0!important;
  padding:12px 18px!important;
  line-height:1.4!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  box-sizing:border-box!important;
  z-index:auto!important;
}
.notification-center-head{
  position:relative!important;
  padding:20px 22px 16px!important;
  margin:0!important;
}
.notification-center-head:before{
  content:"SYSTEM FEED"!important;
  display:block!important;
  margin-bottom:8px!important;
  font:700 9px "JetBrains Mono",monospace!important;
  letter-spacing:.16em!important;
  color:rgba(166,103,255,.82)!important;
}
.notification-center-head h2{
  margin:0 0 4px!important;
  line-height:1.15!important;
}
.notification-center-head p{
  margin:0!important;
}
.notification-preview-list{
  padding:0 18px 18px!important;
}

/* ===== drawer improvements ===== */
.user-drawer{
  width:min(86vw,360px)!important;
  max-width:360px!important;
}
.user-drawer:before{
  padding:15px 18px 10px!important;
  font-size:9px!important;
  letter-spacing:.17em!important;
  border-bottom:1px solid rgba(85,231,255,.08)!important;
}
.drawer-v66-head{
  padding-top:14px!important;
  padding-bottom:18px!important;
}
.drawer-link,.drawer-group summary{
  min-height:50px!important;
}
.drawer-link.active{
  background:linear-gradient(90deg,rgba(166,103,255,.36),rgba(121,63,255,.84))!important;
  border-color:rgba(166,103,255,.38)!important;
  box-shadow:0 10px 28px rgba(83,38,157,.22), inset 0 0 0 1px rgba(255,255,255,.03)!important;
}
.drawer-link.active:before{
  width:3px!important;
  height:28px!important;
  left:3px!important;
}
.drawer-icon{
  box-shadow:inset 0 0 18px rgba(85,231,255,.04)!important;
}

/* ===== modal refinement ===== */
.modal-card{
  border-radius:18px!important;
}
.modal-card:before{
  padding-bottom:10px!important;
  border-bottom:1px solid rgba(85,231,255,.10)!important;
}

/* ===== mobile-specific layout fixes ===== */
@media(max-width:900px){
  .neo-topbar.dashboard-header-clean{
    padding:0 14px!important;
  }
  .neo-topbar.dashboard-header-clean:before{
    left:92px!important;
    right:auto!important;
    transform:none!important;
    max-width:170px!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    font-size:8px!important;
    letter-spacing:.14em!important;
  }
  .plan-mini{
    max-width:105px!important;
    font-size:8px!important;
    letter-spacing:.08em!important;
  }

  .profile-hero{
    min-height:210px!important;
  }

  .neo-stats.dashboard-core-stats article:nth-child(2) strong{
    font-size:22px!important;
  }
}

@media(max-width:620px){
  .neo-main.dashboard-v64{
    padding:18px 12px 46px!important;
  }

  /* keep header readable on narrow phones */
  .neo-topbar.dashboard-header-clean:before{
    content:"VIER // CONSOLE"!important;
    left:82px!important;
    max-width:124px!important;
  }
  .plan-mini{
    position:absolute!important;
    right:72px!important;
    top:50%!important;
    transform:translateY(-50%)!important;
    max-width:86px!important;
    padding-left:8px!important;
    padding-right:8px!important;
  }

  .profile-hero{
    grid-template-columns:82px minmax(0,1fr)!important;
    align-items:center!important;
    gap:18px!important;
    min-height:196px!important;
    padding:54px 18px 22px!important;
    text-align:left!important;
  }
  .profile-hero:before{
    top:14px!important;
    left:18px!important;
    right:auto!important;
    font-size:7px!important;
    letter-spacing:.12em!important;
  }
  .profile-avatar{
    width:72px!important;
    height:72px!important;
  }
  .profile-copy{
    min-width:0!important;
  }
  .welcome-label{
    font-size:9px!important;
  }
  .profile-name-row h1{
    font-size:clamp(29px,9vw,39px)!important;
    max-width:100%!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }
  .profile-copy p{
    font-size:10px!important;
    max-width:100%!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }

  .account-actions{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
  }
  .account-action{
    min-width:0!important;
    min-height:126px!important;
    padding:16px 14px!important;
  }
  .account-action b{
    font-size:14px!important;
  }
  .account-action small{
    font-size:9px!important;
  }

  .neo-stats.dashboard-core-stats{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
  }
  .neo-stats.dashboard-core-stats article{
    min-width:0!important;
    min-height:126px!important;
    padding:15px 13px!important;
  }
  .neo-stats.dashboard-core-stats article:before{
    font-size:7px!important;
    right:10px!important;
  }
  .neo-stats.dashboard-core-stats small{
    font-size:8px!important;
    letter-spacing:.1em!important;
  }
  .neo-stats.dashboard-core-stats strong{
    font-size:clamp(24px,8vw,34px)!important;
  }
  .neo-stats.dashboard-core-stats article:nth-child(2) strong{
    font-size:clamp(18px,5vw,23px)!important;
    white-space:normal!important;
  }
  .neo-stats.dashboard-core-stats article:nth-child(4) strong{
    font-size:clamp(19px,5.5vw,25px)!important;
    white-space:normal!important;
  }

  .notification-center-card{
    border-radius:16px!important;
  }
  .notification-center-card:before{
    padding:10px 14px!important;
    font-size:8px!important;
  }
  .notification-center-head{
    padding:16px 16px 12px!important;
  }
  .notification-center-head h2{
    font-size:20px!important;
  }
  .notification-center-head p{
    font-size:12px!important;
  }
  .notification-preview-list{
    padding:0 12px 14px!important;
  }

  .user-drawer{
    width:min(88vw,340px)!important;
  }

  /* keep common floating assistants away from dashboard content */
  .assistant-fab,
  .floating-assistant,
  .assistant-widget,
  .chatbot-launcher,
  .floating-chat{
    right:14px!important;
    bottom:18px!important;
    transform:scale(.88)!important;
    transform-origin:bottom right!important;
  }
}

@media(max-width:390px){
  .neo-topbar.dashboard-header-clean:before{
    display:none!important;
  }
  .plan-mini{
    right:68px!important;
    max-width:78px!important;
  }
  .profile-hero{
    grid-template-columns:70px minmax(0,1fr)!important;
    gap:14px!important;
  }
  .profile-avatar{
    width:64px!important;
    height:64px!important;
  }
  .account-action{
    min-height:118px!important;
    padding:14px 12px!important;
  }
  .neo-stats.dashboard-core-stats article{
    min-height:120px!important;
  }
}