/* =========================================================
   CredBrain Liquid Glass UI — FINAL CONSOLIDATED
   Deep Glass + Neural Atmosphere
   Self-contained visual layer.
   No workflow tracker. No backend changes.
   ========================================================= */

:root{
  --cb-final-navy:#071a42;
  --cb-final-navy-2:#0d2f78;
  --cb-final-blue:#2e76ff;
  --cb-final-cyan:#36d9ff;
  --cb-final-violet:#8f67ff;
  --cb-final-glass:rgba(255,255,255,.58);
  --cb-final-glass-strong:rgba(255,255,255,.74);
  --cb-final-border:rgba(255,255,255,.60);
  --cb-final-shadow:0 20px 48px rgba(24,69,140,.12);
}

/* Never show old workflow/neural experiment panels */
#cbOperationalFlow,
#cbNeuralEngine,
.cb-flow-shell,
.cb-neural-shell,
[class*="operational-transparency"],
[class*="neural-engine"]{
  display:none!important;
}

/* Ambient app background */
html,body{
  background:
    radial-gradient(circle at 8% 7%,rgba(70,153,255,.22),transparent 26%),
    radial-gradient(circle at 88% 9%,rgba(111,84,255,.18),transparent 28%),
    radial-gradient(circle at 72% 82%,rgba(41,210,255,.14),transparent 24%),
    linear-gradient(145deg,#e9f2ff 0%,#eef5ff 48%,#e6effc 100%)!important;
}

body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:0;
  opacity:.42;
  background-image:
    radial-gradient(circle,rgba(74,148,255,.22) 0 1px,transparent 1.5px),
    radial-gradient(circle,rgba(126,98,255,.16) 0 1px,transparent 1.5px);
  background-size:120px 120px,170px 170px;
  background-position:10px 10px,65px 45px;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.56),transparent 78%);
}

.app-shell{position:relative;z-index:1;background:transparent!important}

/* ---------- LEFT RAIL ---------- */
body:not(.dark-mode) .sidebar{
  background:
    radial-gradient(circle at 14% 4%,rgba(68,173,255,.12),transparent 24%),
    linear-gradient(180deg,rgba(249,253,255,.74),rgba(226,240,255,.58))!important;
  border:1px solid rgba(255,255,255,.76)!important;
  border-right-color:rgba(126,176,255,.18)!important;
  box-shadow:
    14px 0 46px rgba(24,69,140,.11),
    inset 0 1px 0 rgba(255,255,255,.98),
    inset -1px 0 0 rgba(74,147,255,.07)!important;
  backdrop-filter:blur(28px) saturate(155%)!important;
  -webkit-backdrop-filter:blur(28px) saturate(155%)!important;
}

body:not(.dark-mode) .brand{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 22% 20%,rgba(80,227,255,.20),transparent 24%),
    linear-gradient(145deg,rgba(17,67,159,.96),rgba(34,95,213,.91))!important;
  border:1px solid rgba(255,255,255,.26)!important;
  box-shadow:
    0 18px 42px rgba(18,68,166,.24),
    inset 0 1px 0 rgba(255,255,255,.22),
    0 0 28px rgba(47,149,255,.10)!important;
}

body:not(.dark-mode) .nav-item{
  border:1px solid transparent!important;
  background:rgba(255,255,255,.18)!important;
  color:#183d6c!important;
  border-radius:15px!important;
  transition:transform .18s ease,background .18s ease,border-color .18s ease,box-shadow .18s ease;
}

body:not(.dark-mode) .nav-item:hover{
  background:rgba(255,255,255,.58)!important;
  border-color:rgba(255,255,255,.80)!important;
  box-shadow:0 10px 24px rgba(34,89,169,.10),inset 0 1px 0 rgba(255,255,255,.9)!important;
}

body:not(.dark-mode) .nav-item.active{
  background:
    linear-gradient(135deg,rgba(255,255,255,.90),rgba(213,235,255,.70))!important;
  border-color:rgba(95,174,255,.46)!important;
  box-shadow:
    0 14px 30px rgba(46,110,210,.14),
    0 0 0 1px rgba(255,255,255,.86) inset,
    0 0 22px rgba(54,217,255,.10)!important;
}

body:not(.dark-mode) .nav-icon{
  color:#387ee9!important;
  filter:drop-shadow(0 0 8px rgba(54,217,255,.18));
}

/* ---------- HEADER ---------- */
body:not(.dark-mode) .topbar{
  position:relative!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 82% 22%,rgba(64,216,255,.16),transparent 24%),
    linear-gradient(135deg,rgba(4,37,96,.96),rgba(10,54,135,.92) 52%,rgba(15,68,165,.88))!important;
  border:1px solid rgba(111,205,255,.32)!important;
  border-radius:0 0 24px 24px!important;
  box-shadow:
    0 20px 48px rgba(7,42,111,.26),
    inset 0 1px 0 rgba(255,255,255,.16),
    inset 0 -1px 0 rgba(30,105,220,.10),
    0 0 30px rgba(54,217,255,.09)!important;
  backdrop-filter:blur(24px) saturate(155%)!important;
  -webkit-backdrop-filter:blur(24px) saturate(155%)!important;
}

body:not(.dark-mode) .topbar::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 70% 28%,rgba(54,217,255,.18) 0 1px,transparent 1.5px),
    radial-gradient(circle at 86% 52%,rgba(143,103,255,.18) 0 1px,transparent 1.5px),
    linear-gradient(110deg,transparent 0 46%,rgba(255,255,255,.10) 50%,transparent 54%);
  background-size:92px 92px,140px 140px,220% 100%;
  animation:cbFinalHeaderSweep 12s ease-in-out infinite;
}

body:not(.dark-mode) .topbar::after{
  content:"";
  position:absolute;
  width:42%;
  height:180%;
  right:-8%;
  top:-58%;
  transform:rotate(13deg);
  pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.11),transparent);
  opacity:.66;
}

body:not(.dark-mode) .topbar h2,
body:not(.dark-mode) .topbar-heading-row h2{
  color:#fff!important;
  text-shadow:0 2px 18px rgba(62,176,255,.12);
}

body:not(.dark-mode) .topbar-title>p{
  color:rgba(226,239,255,.82)!important;
}

body:not(.dark-mode) .topbar button,
body:not(.dark-mode) .connection-pill{
  background:rgba(255,255,255,.10)!important;
  border:1px solid rgba(255,255,255,.22)!important;
  color:#fff!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 10px 24px rgba(3,30,84,.14)!important;
  backdrop-filter:blur(14px) saturate(145%);
  -webkit-backdrop-filter:blur(14px) saturate(145%);
}

body:not(.dark-mode) .connection-pill{
  background:rgba(255,255,255,.82)!important;
  color:#284a6d!important;
  border-color:rgba(255,255,255,.78)!important;
}

/* ---------- MAIN AREA / GLASS STRIP ---------- */
body:not(.dark-mode) .premium-dashboard-preview,
body:not(.dark-mode) .dashboard-preview,
body:not(.dark-mode) .dashboard-ai-entry,
body:not(.dark-mode) .ai-workspace-entry,
body:not(.dark-mode) .ai-workspace-panel{
  background:
    linear-gradient(145deg,rgba(255,255,255,.66),rgba(228,240,255,.50))!important;
  border:1px solid rgba(255,255,255,.74)!important;
  box-shadow:
    0 16px 38px rgba(30,78,151,.10),
    inset 0 1px 0 rgba(255,255,255,.94)!important;
  backdrop-filter:blur(22px) saturate(150%);
  -webkit-backdrop-filter:blur(22px) saturate(150%);
}

/* ---------- HERO ---------- */
body:not(.dark-mode) .premium-hero{
  position:relative!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 78% 46%,rgba(35,202,255,.18),transparent 22%),
    radial-gradient(circle at 66% 70%,rgba(121,83,255,.18),transparent 28%),
    radial-gradient(circle at 24% 12%,rgba(67,128,255,.11),transparent 30%),
    linear-gradient(145deg,rgba(5,29,77,.97),rgba(10,50,125,.94) 55%,rgba(15,61,150,.90))!important;
  border:1px solid rgba(99,203,255,.34)!important;
  box-shadow:
    0 26px 62px rgba(7,39,102,.30),
    inset 0 1px 0 rgba(255,255,255,.15),
    inset 0 -1px 0 rgba(82,90,220,.08),
    0 0 42px rgba(54,217,255,.11)!important;
  backdrop-filter:blur(26px) saturate(165%);
}

body:not(.dark-mode) .premium-hero::before{
  content:"";
  position:absolute;
  width:390px;
  height:390px;
  right:3%;
  top:50%;
  transform:translateY(-50%);
  border-radius:50%;
  pointer-events:none;
  background:
    radial-gradient(circle,transparent 0 18%,rgba(56,217,255,.18) 19% 19.6%,transparent 20% 30%,rgba(87,137,255,.13) 31% 31.6%,transparent 32% 43%,rgba(150,102,255,.12) 44% 44.6%,transparent 45%),
    radial-gradient(circle at 50% 50%,rgba(53,194,255,.09),transparent 59%);
  filter:
    drop-shadow(0 0 16px rgba(58,195,255,.11))
    drop-shadow(0 0 24px rgba(126,92,255,.07))!important;
  opacity:.92!important;
  animation:cbFinalOrbit 8s ease-in-out infinite;
}

body:not(.dark-mode) .premium-hero::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.40;
  background-image:
    radial-gradient(circle,rgba(75,198,255,.28) 0 1px,transparent 1.5px),
    radial-gradient(circle,rgba(145,105,255,.20) 0 1px,transparent 1.5px);
  background-size:88px 88px,130px 130px;
  mask-image:linear-gradient(90deg,transparent 20%,#000 100%);
}

/* FINAL hero logo position/size */
body:not(.dark-mode) #welcomePanel .premium-hero .welcome-logo{
  position:absolute!important;
  left:73.8%!important;
  top:52.1%!important;
  right:auto!important;
  bottom:auto!important;
  transform:translate(-50%,-50%)!important;

  width:132px!important;
  height:132px!important;
  min-width:132px!important;
  min-height:132px!important;

  z-index:2!important;
  overflow:visible!important;

  border:1px solid rgba(109,220,255,.42)!important;
  border-radius:34px!important;
  background:
    radial-gradient(circle at 24% 18%,rgba(79,235,255,.30),transparent 28%),
    radial-gradient(circle at 78% 78%,rgba(122,91,255,.20),transparent 32%),
    linear-gradient(145deg,rgba(6,48,118,.96),rgba(20,80,180,.88))!important;
  box-shadow:
    0 20px 48px rgba(8,48,126,.28),
    0 0 34px rgba(54,217,255,.18),
    0 0 26px rgba(128,94,255,.10),
    inset 0 1px 0 rgba(255,255,255,.17)!important;
}

body:not(.dark-mode) .premium-hero h3{
  color:#fff!important;
  text-shadow:0 2px 24px rgba(43,132,255,.08);
}

body:not(.dark-mode) .premium-hero .welcome-description{
  color:rgba(230,240,255,.87)!important;
}

/* Unified AI badge */
body:not(.dark-mode) .sidebar-top .brand-logo,
body:not(.dark-mode) #welcomePanel .premium-hero .welcome-logo{
  overflow:visible!important;
}

body:not(.dark-mode) .sidebar-top .brand-logo{
  position:relative!important;
}

body:not(.dark-mode) .sidebar-top .brand-logo::after,
body:not(.dark-mode) #welcomePanel .premium-hero .welcome-logo::after{
  content:"AI"!important;
  position:absolute!important;
  right:-8px!important;
  bottom:-6px!important;
  left:auto!important;
  top:auto!important;

  width:31px!important;
  min-width:31px!important;
  max-width:31px!important;
  height:23px!important;
  min-height:23px!important;
  max-height:23px!important;

  padding:0!important;
  margin:0!important;
  display:grid!important;
  place-items:center!important;

  border:1px solid rgba(112,226,255,.52)!important;
  border-radius:8px!important;

  background:
    radial-gradient(circle at 28% 20%,rgba(255,255,255,.22),transparent 32%),
    linear-gradient(145deg,#0c4f8f 0%,#1768bd 58%,#405fdb 100%)!important;

  color:#fff!important;
  box-shadow:
    0 6px 15px rgba(12,71,153,.25),
    0 0 16px rgba(54,217,255,.20),
    inset 0 1px 0 rgba(255,255,255,.22)!important;

  font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif!important;
  font-size:8px!important;
  font-weight:850!important;
  line-height:1!important;
  letter-spacing:.04em!important;
  z-index:999!important;
  pointer-events:none!important;
}

/* ---------- RIGHT RAIL ---------- */
body:not(.dark-mode) .provider-panel{
  background:
    radial-gradient(circle at 86% 5%,rgba(67,192,255,.13),transparent 24%),
    radial-gradient(circle at 18% 82%,rgba(117,93,255,.07),transparent 26%),
    linear-gradient(180deg,rgba(241,249,255,.74),rgba(216,234,255,.58))!important;
  border-left:1px solid rgba(255,255,255,.72)!important;
  box-shadow:
    -14px 0 42px rgba(26,72,143,.09),
    inset 1px 0 0 rgba(255,255,255,.90)!important;
  backdrop-filter:blur(26px) saturate(150%);
  -webkit-backdrop-filter:blur(26px) saturate(150%);
}

body:not(.dark-mode) .provider-panel-header{
  position:relative!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 82% 72%,rgba(57,207,255,.14),transparent 24%),
    linear-gradient(145deg,rgba(11,58,147,.96),rgba(31,95,210,.91))!important;
  border:1px solid rgba(116,213,255,.40)!important;
  box-shadow:
    0 20px 42px rgba(17,65,157,.22),
    inset 0 1px 0 rgba(255,255,255,.18),
    0 0 28px rgba(54,217,255,.11)!important;
}

body:not(.dark-mode) .provider-panel-header h3,
body:not(.dark-mode) .provider-panel-header .panel-label{
  color:#fff!important;
}

body:not(.dark-mode) .provider-panel-header .active-status{
  background:rgba(255,255,255,.12)!important;
  color:#fff!important;
  border:1px solid rgba(255,255,255,.20)!important;
}

/* ---------- COMMON GLASS CARDS ---------- */
body:not(.dark-mode) .provider-profile-card,
body:not(.dark-mode) .provider-metric-card,
body:not(.dark-mode) .priority-item,
body:not(.dark-mode) .quick-action-card,
body:not(.dark-mode) .provider-profile-section,
body:not(.dark-mode) .provider-enrollment-card,
body:not(.dark-mode) .enrollment-card,
body:not(.dark-mode) .provider-note-card,
body:not(.dark-mode) .document-card,
body:not(.dark-mode) .verification-card,
body:not(.dark-mode) .credential-alert-summary-card,
body:not(.dark-mode) .credential-alert-card,
body:not(.dark-mode) .settings-card,
body:not(.dark-mode) .settings-section,
body:not(.dark-mode) .audit-summary-card,
body:not(.dark-mode) .report-card,
body:not(.dark-mode) .sync-modal,
body:not(.dark-mode) .onboarding-modal,
body:not(.dark-mode) .modal-panel{
  background:
    linear-gradient(145deg,rgba(255,255,255,.72),rgba(235,244,255,.54))!important;
  border:1px solid rgba(255,255,255,.82)!important;
  box-shadow:
    0 18px 44px rgba(31,77,146,.11),
    0 0 0 1px rgba(81,187,255,.035),
    inset 0 1px 0 rgba(255,255,255,.98)!important;
  backdrop-filter:blur(20px) saturate(150%);
  -webkit-backdrop-filter:blur(20px) saturate(150%);
}

body:not(.dark-mode) input,
body:not(.dark-mode) select,
body:not(.dark-mode) textarea{
  background:rgba(255,255,255,.70)!important;
  border:1px solid rgba(143,183,234,.34)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.82)!important;
}

body:not(.dark-mode) input:focus,
body:not(.dark-mode) select:focus,
body:not(.dark-mode) textarea:focus{
  border-color:rgba(65,160,255,.58)!important;
  box-shadow:
    0 0 0 4px rgba(59,154,255,.10),
    0 0 18px rgba(54,217,255,.08),
    inset 0 1px 0 rgba(255,255,255,.84)!important;
}

/* Main buttons */
body:not(.dark-mode) #dashboardNewChatButton,
body:not(.dark-mode) .new-chat-button{
  background:
    radial-gradient(circle at 28% 18%,rgba(255,255,255,.18),transparent 30%),
    linear-gradient(145deg,#2f84ff 0%,#2765e6 62%,#674fef 100%)!important;
  border:1px solid rgba(255,255,255,.28)!important;
  box-shadow:
    0 14px 32px rgba(34,94,213,.26),
    0 0 24px rgba(54,217,255,.10),
    inset 0 1px 0 rgba(255,255,255,.24)!important;
}

body:not(.dark-mode) #openAssistantFromDashboard{
  background:
    linear-gradient(145deg,rgba(255,255,255,.78),rgba(229,240,255,.64))!important;
  border:1px solid rgba(255,255,255,.80)!important;
  box-shadow:
    0 12px 28px rgba(32,78,151,.10),
    inset 0 1px 0 rgba(255,255,255,.96)!important;
}

@keyframes cbFinalHeaderSweep{
  0%,20%{background-position:center,center,120% 0}
  58%{background-position:center,center,-20% 0}
  100%{background-position:center,center,-20% 0}
}

@keyframes cbFinalOrbit{
  0%,100%{transform:translateY(-50%) scale(.97);opacity:.72}
  50%{transform:translateY(-50%) scale(1.04);opacity:1}
}

@media (prefers-reduced-motion:reduce){
  body:not(.dark-mode) .topbar::before,
  body:not(.dark-mode) .premium-hero::before{
    animation:none!important;
  }
}