/* InfoDoer — Glass Pearl full layout (Workspace + Client Portal). Oct 2026.
   Active only when <html data-skin="pearl">. Colours/tokens come from the pearl block in each page's own CSS.
   Sidebar: expanded = icons + names; html.pl-mini = icons only (toggle at the top of the sidebar, remembered in localStorage "plRail"). */
html:not([data-skin="pearl"]) .pl-only{display:none !important}

html[data-skin="pearl"] body{font-family:'Poppins',Inter,system-ui,-apple-system,'Segoe UI',sans-serif !important;-webkit-font-smoothing:antialiased}
html[data-skin="pearl"] body *:not(svg):not(svg *):not(code):not(pre){font-family:inherit}
html[data-skin="pearl"] h1,html[data-skin="pearl"] h2,html[data-skin="pearl"] h3{letter-spacing:-.015em}

/* ---------- shared pieces ---------- */
html[data-skin="pearl"] .pl-dots{display:inline-flex;gap:7px;margin-right:14px}
html[data-skin="pearl"] .pl-dots i{width:12px;height:12px;border-radius:50%;background:#ff5f57;box-shadow:0 1px 2px rgba(0,0,0,.15) inset}
html[data-skin="pearl"] .pl-dots i:nth-child(2){background:#5b5f66}
html[data-skin="pearl"] .pl-dots i:nth-child(3){background:#28c840}
html[data-skin="pearl"] .pl-brand{display:flex;align-items:center;flex:0 0 auto;min-width:0}
html[data-skin="pearl"] .pl-brand-logo{display:flex !important;align-items:center;gap:8px;padding:0 !important;margin:0 !important;border:0 !important;background:none !important;box-shadow:none !important}
html[data-skin="pearl"] .pl-brand-logo img{height:30px !important;width:auto !important;max-width:130px}
html[data-skin="pearl"] .pl-brand-logo span,html[data-skin="pearl"] .pl-brand-logo .brand-sub{display:none !important}

html[data-skin="pearl"] .pl-rail-btn{width:46px;height:46px;flex:0 0 46px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;border:1px solid rgba(255,255,255,.95);background:rgba(255,255,255,.72);color:#2a2d32;cursor:pointer;box-shadow:0 8px 18px rgba(60,66,80,.10),0 1px 0 #fff inset;transition:transform .15s,background .2s,color .2s}
html[data-skin="pearl"] .pl-rail-btn:hover{transform:translateY(-1px);background:#fff}
html[data-skin="pearl"] .pl-rail-btn svg{width:18px;height:18px}

html[data-skin="pearl"] .pl-title{margin:4px 0 26px}
html[data-skin="pearl"] .pl-title .page-title,html[data-skin="pearl"] .pl-title h1{font-size:clamp(28px,3vw,40px) !important;line-height:1.08 !important;font-weight:700 !important;letter-spacing:-.025em;color:#15171a !important;margin:0 0 6px !important}
html[data-skin="pearl"] .pl-title .breadcrumb,html[data-skin="pearl"] .pl-title > div{font-size:13px !important;color:#7c838d !important}

/* page heading: big geometric title like the reference */
html[data-skin="pearl"] .content .hero h1,html[data-skin="pearl"] .content .top h1{font-size:clamp(28px,2.9vw,40px) !important;line-height:1.08 !important;font-weight:700 !important;letter-spacing:-.03em !important;color:#15171a !important}
html[data-skin="pearl"] .content .hero p,html[data-skin="pearl"] .content .hero .sub{color:#7c838d !important}

/* cards: big soft rounded glass */
html[data-skin="pearl"] .glass,html[data-skin="pearl"] .glass-pad{border-radius:30px !important}
html[data-skin="pearl"] .ov-tile,html[data-skin="pearl"] .stat,html[data-skin="pearl"] .tile{border-radius:26px !important}
html[data-skin="pearl"] .ov-item,html[data-skin="pearl"] .ov-list > *{border-radius:20px !important}
html[data-skin="pearl"] .ov-item{background:rgba(255,255,255,.72) !important;border:1px solid rgba(255,255,255,.95) !important;box-shadow:0 6px 16px rgba(60,66,80,.06) !important}
html[data-skin="pearl"] .chip,html[data-skin="pearl"] .badge,html[data-skin="pearl"] .status,html[data-skin="pearl"] [class*="status-"],html[data-skin="pearl"] [class*="pill"]{border-radius:999px !important}
html[data-skin="pearl"] .modal,html[data-skin="pearl"] .drawer{border-radius:30px !important}
html[data-skin="pearl"] .btn-sm,html[data-skin="pearl"] .btn.sm{min-height:36px}

/* sub-tabs and filter chips: black active pill */
html[data-skin="pearl"] .content [class*="chip"].active,html[data-skin="pearl"] .content [class*="tab"].active,html[data-skin="pearl"] .content [class*="tab"].on,html[data-skin="pearl"] .content .seg .on,html[data-skin="pearl"] .content [class*="subnav"] a.active{background:#111214 !important;color:#fff !important;border-color:#111214 !important;box-shadow:0 10px 22px rgba(17,18,20,.25) !important}
html[data-skin="pearl"] .content [class*="chip"].active .icon,html[data-skin="pearl"] .content [class*="tab"].active .icon,html[data-skin="pearl"] .content [class*="subnav"] a.active .icon{color:#fff !important}
html[data-skin="pearl"] .content [class*="chip"]:not(.active),html[data-skin="pearl"] .content [class*="subnav"] a:not(.active){border-radius:999px !important}

/* ================= Desktop layout ================= */
@media (min-width:981px){
  html[data-skin="pearl"] body{padding:18px !important;min-height:100vh}
  html[data-skin="pearl"] .app{min-height:calc(100vh - 36px);border-radius:40px;background:linear-gradient(150deg,rgba(247,248,250,.92) 0%,rgba(233,236,241,.86) 55%,rgba(222,226,233,.86) 100%);border:1px solid rgba(255,255,255,.95);box-shadow:0 1px 0 #fff inset,0 50px 100px rgba(60,66,80,.20),0 10px 30px rgba(60,66,80,.08)}

  /* ---- left sidebar: expanded (icons + names) ---- */
  html[data-skin="pearl"] .sidebar{width:248px !important;min-width:248px !important;flex:0 0 248px !important;padding:22px 16px 20px 18px !important;align-items:stretch !important;gap:12px !important;background:transparent !important;border:0 !important;box-shadow:none !important;backdrop-filter:none !important;-webkit-backdrop-filter:none !important;position:sticky !important;top:18px !important;height:calc(100vh - 36px) !important;overflow:visible !important;transition:width .25s ease,min-width .25s ease,flex-basis .25s ease,padding .25s ease}
  html[data-skin="pearl"] .sidebar > .brand,html[data-skin="pearl"] .sidebar .nav-label,html[data-skin="pearl"] .sidebar .promo,html[data-skin="pearl"] .sidebar .theme-row-label{display:none !important}
  html[data-skin="pearl"] .pl-side-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 2px 0 8px;flex:0 0 auto}
  html[data-skin="pearl"] .pl-side-title{font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#8a9099;white-space:nowrap;overflow:hidden}
  html[data-skin="pearl"] .pl-collapse svg{width:19px;height:19px}
  html[data-skin="pearl"] .sidebar .nav-group,html[data-skin="pearl"] .sidebar .nav{display:flex !important;flex-direction:column !important;align-items:stretch !important;gap:6px !important;padding:8px 4px !important;margin:0 -4px !important;flex:1 1 auto !important;overflow-y:auto !important;overflow-x:hidden !important;scrollbar-width:none}
  html[data-skin="pearl"] .sidebar .nav-group::-webkit-scrollbar,html[data-skin="pearl"] .sidebar .nav::-webkit-scrollbar{display:none}
  html[data-skin="pearl"] .sidebar .nav-link,html[data-skin="pearl"] .sidebar .nav a{position:relative;display:flex !important;align-items:center !important;justify-content:flex-start !important;gap:12px !important;width:auto !important;height:46px !important;min-height:46px !important;flex:0 0 46px !important;padding:0 14px !important;margin:0 !important;border-radius:999px !important;font-size:14px !important;font-weight:500 !important;color:#4a4f57 !important;background:transparent !important;border:1px solid transparent !important;box-shadow:none !important;white-space:nowrap;overflow:hidden;transition:background .2s,color .2s,box-shadow .2s,padding .25s}
  html[data-skin="pearl"] .sidebar .nav-link:hover,html[data-skin="pearl"] .sidebar .nav a:hover{background:rgba(255,255,255,.75) !important;border-color:rgba(255,255,255,.95) !important;color:#15171a !important;box-shadow:0 6px 16px rgba(60,66,80,.07) !important}
  html[data-skin="pearl"] .sidebar .nav-link .icon,html[data-skin="pearl"] .sidebar .nav a svg{width:18px !important;height:18px !important;flex:0 0 18px;margin:0 !important}
  html[data-skin="pearl"] .sidebar .pl-txt{overflow:hidden;text-overflow:ellipsis;transition:opacity .2s}
  html[data-skin="pearl"] .sidebar .nav-link.active,html[data-skin="pearl"] .sidebar .nav a.on{background:#111214 !important;color:#fff !important;border-color:#111214 !important;box-shadow:0 12px 24px rgba(17,18,20,.28) !important}
  html[data-skin="pearl"] .sidebar .nav-badge,html[data-skin="pearl"] .sidebar .nav a .badge{margin:0 0 0 auto !important;min-width:20px;height:20px;padding:0 6px !important;font-size:11px !important;line-height:20px !important;border-radius:999px !important;background:#e0605e !important;color:#fff !important;text-align:center}
  html[data-skin="pearl"] .sidebar .nav-link.active .nav-badge,html[data-skin="pearl"] .sidebar .nav a.on .badge{background:#fff !important;color:#111214 !important}

  html[data-skin="pearl"] .sidebar-foot,html[data-skin="pearl"] .side-out{display:flex !important;flex-direction:column !important;align-items:stretch !important;gap:10px !important;padding:12px 0 0 !important;margin:0 !important;border:0 !important;border-top:1px solid rgba(20,24,30,.06) !important;background:none !important}
  html[data-skin="pearl"] .theme-row.has-seg{padding:0 !important;margin:0 !important;background:none !important;border:0 !important;box-shadow:none !important}
  html[data-skin="pearl"] .theme-seg{flex-direction:row !important;justify-content:flex-start;gap:8px !important;padding:0 0 0 2px !important;border:0 !important;background:none !important}
  html[data-skin="pearl"] .theme-seg button{width:46px;height:46px;flex:0 0 46px !important;padding:0 !important;font-size:0 !important;border-radius:50% !important;background:rgba(255,255,255,.72) !important;border:1px solid rgba(255,255,255,.95) !important;color:#2a2d32 !important;box-shadow:0 8px 18px rgba(60,66,80,.10),0 1px 0 #fff inset !important}
  html[data-skin="pearl"] .theme-seg button .icon{width:18px !important;height:18px !important}
  html[data-skin="pearl"] .theme-seg button.on{background:#111214 !important;color:#fff !important;border-color:#111214 !important;box-shadow:0 12px 24px rgba(17,18,20,.30) !important}
  html[data-skin="pearl"] .logout-btn,html[data-skin="pearl"] .side-out button{display:flex !important;align-items:center !important;justify-content:flex-start !important;gap:12px !important;width:auto !important;height:46px !important;padding:0 14px !important;margin:0 !important;font-size:14px !important;font-weight:500 !important;border-radius:999px !important;background:rgba(255,255,255,.72) !important;border:1px solid rgba(255,255,255,.95) !important;color:#e0605e !important;box-shadow:0 8px 18px rgba(60,66,80,.08),0 1px 0 #fff inset !important;white-space:nowrap;overflow:hidden}
  html[data-skin="pearl"] .logout-btn .icon,html[data-skin="pearl"] .side-out button svg{width:18px !important;height:18px !important;flex:0 0 18px;margin:0 !important}

  /* ---- minimised: icons only ---- */
  html[data-skin="pearl"].pl-mini .sidebar{width:92px !important;min-width:92px !important;flex:0 0 92px !important;padding:22px 0 20px !important;align-items:center !important}
  html[data-skin="pearl"].pl-mini .pl-side-head{padding:0;justify-content:center}
  html[data-skin="pearl"].pl-mini .pl-side-title{display:none}
  html[data-skin="pearl"].pl-mini .pl-collapse svg{transform:scaleX(-1)}
  html[data-skin="pearl"].pl-mini .sidebar .nav-group,html[data-skin="pearl"].pl-mini .sidebar .nav{align-items:center !important;gap:10px !important;margin:0 !important;padding:8px 0 !important;width:100%;overflow-x:visible !important}
  html[data-skin="pearl"].pl-mini .sidebar .nav-link,html[data-skin="pearl"].pl-mini .sidebar .nav a{width:46px !important;padding:0 !important;justify-content:center !important;gap:0 !important;overflow:visible;background:rgba(255,255,255,.72) !important;border:1px solid rgba(255,255,255,.95) !important;color:#2a2d32 !important;box-shadow:0 8px 18px rgba(60,66,80,.10),0 1px 0 #fff inset !important}
  html[data-skin="pearl"].pl-mini .sidebar .nav-link.active,html[data-skin="pearl"].pl-mini .sidebar .nav a.on{background:#111214 !important;color:#fff !important;border-color:#111214 !important;box-shadow:0 12px 24px rgba(17,18,20,.30) !important}
  html[data-skin="pearl"].pl-mini .sidebar .pl-txt{display:none}
  html[data-skin="pearl"].pl-mini .sidebar .nav-badge,html[data-skin="pearl"].pl-mini .sidebar .nav a .badge{position:absolute !important;top:-3px;right:-3px;min-width:17px;height:17px;padding:0 4px !important;font-size:10px !important;line-height:17px !important;box-shadow:0 0 0 2px #f1f2f5}
  html[data-skin="pearl"].pl-mini .sidebar-foot,html[data-skin="pearl"].pl-mini .side-out{align-items:center !important;width:100%}
  html[data-skin="pearl"].pl-mini .theme-seg{flex-direction:column !important;padding:0 !important}
  html[data-skin="pearl"].pl-mini .logout-btn,html[data-skin="pearl"].pl-mini .side-out button{width:46px !important;padding:0 !important;justify-content:center !important;gap:0 !important}
  html[data-skin="pearl"].pl-mini .logout-btn .pl-txt,html[data-skin="pearl"].pl-mini .side-out button .pl-txt{display:none}

  /* ---- top bar: logo · search · round buttons ---- */
  html[data-skin="pearl"] .shell{min-width:0}
  html[data-skin="pearl"] .topbar{position:sticky !important;top:18px !important;z-index:5;display:flex !important;align-items:center !important;gap:16px !important;padding:12px 18px 12px 8px !important;margin:18px 22px 6px 0 !important;min-height:72px;border-radius:999px !important;background:rgba(255,255,255,.42) !important;border:1px solid rgba(255,255,255,.9) !important;box-shadow:0 1px 0 #fff inset,0 14px 34px rgba(60,66,80,.08) !important;backdrop-filter:blur(22px) saturate(150%) !important;-webkit-backdrop-filter:blur(22px) saturate(150%) !important}
  html[data-skin="pearl"] .topbar > .crumbwrap,html[data-skin="pearl"] .topbar > .tb-title{display:none !important}
  html[data-skin="pearl"] .topbar .pl-brand{padding-left:14px;margin-right:auto}
  html[data-skin="pearl"] .topbar-right,html[data-skin="pearl"] .tb-right{gap:10px !important;flex:0 0 auto;margin-left:0 !important}
  html[data-skin="pearl"] .topbar .icon-btn,html[data-skin="pearl"] .topbar .bell{width:46px !important;height:46px !important;border-radius:50% !important}
  html[data-skin="pearl"] .profile-btn{padding:4px 12px 4px 4px !important;border-radius:999px !important;min-height:46px}
  html[data-skin="pearl"] .profile-btn .avatar,html[data-skin="pearl"] .profile-btn .av{width:38px !important;height:38px !important;border-radius:50% !important}
  html[data-skin="pearl"] .topbar .searchbox{flex:0 1 380px !important;width:auto !important;min-width:200px !important;height:46px !important;border-radius:999px !important}

  html[data-skin="pearl"] .content{padding:22px 30px 50px 6px !important}
  html[data-skin="pearl"] .crumbwrap + .pl-title{display:none}
}
@media (min-width:981px) and (max-width:1600px){html[data-skin="pearl"] .pl-dots{display:none}}
@media (min-width:981px) and (max-height:820px){
  html[data-skin="pearl"] .sidebar .nav-link,html[data-skin="pearl"] .sidebar .nav a,html[data-skin="pearl"] .logout-btn,html[data-skin="pearl"] .side-out button{height:40px !important;min-height:40px !important;flex-basis:40px !important}
  html[data-skin="pearl"].pl-mini .sidebar .nav-link,html[data-skin="pearl"].pl-mini .sidebar .nav a,html[data-skin="pearl"].pl-mini .logout-btn,html[data-skin="pearl"].pl-mini .side-out button,html[data-skin="pearl"] .theme-seg button,html[data-skin="pearl"] .pl-rail-btn{width:40px !important;height:40px !important;min-height:40px !important;flex-basis:40px !important}
}

/* ================= Phones / tablets: keep the familiar slide-out menu ================= */
@media (max-width:980px){
  html[data-skin="pearl"] .pl-brand,html[data-skin="pearl"] .pl-title,html[data-skin="pearl"] .pl-side-head{display:none !important}
  html[data-skin="pearl"] .topbar{border-radius:0 0 26px 26px !important}
  html[data-skin="pearl"] .nav-link,html[data-skin="pearl"] .sidebar .nav a{border-radius:999px !important}
}

/* Active menu item, active sub-tabs/chips and active theme button: theme green (user request 21 Oct 2026) */
html[data-skin="pearl"] .sidebar .nav-link.active,
html[data-skin="pearl"] .sidebar .nav a.on,
html[data-skin="pearl"].pl-mini .sidebar .nav-link.active,
html[data-skin="pearl"].pl-mini .sidebar .nav a.on,
html[data-skin="pearl"] .theme-seg button.on,
html[data-skin="pearl"] .content [class*="chip"].active,
html[data-skin="pearl"] .content [class*="tab"].active,
html[data-skin="pearl"] .content [class*="tab"].on,
html[data-skin="pearl"] .content .seg .on,
html[data-skin="pearl"] .content [class*="subnav"] a.active{background:linear-gradient(135deg,#12c6a6 0%,#0aa88f 50%,#067f68 100%) !important;color:#fff !important;border-color:#0aa88f !important;box-shadow:0 10px 22px rgba(10,168,143,.30) !important}
html[data-skin="pearl"] .sidebar .nav-link.active .nav-badge,html[data-skin="pearl"] .sidebar .nav a.on .badge{background:#fff !important;color:#067f68 !important}

/* Theme-styled hover label for the minimised sidebar */
html[data-skin="pearl"] .pl-tip{position:fixed;z-index:9999;left:0;top:0;transform:translate(-6px,-50%);opacity:0;pointer-events:none;padding:8px 14px;border-radius:999px;background:linear-gradient(135deg,#12c6a6 0%,#0aa88f 50%,#067f68 100%);color:#fff;font:600 13px/1.2 Poppins,Inter,system-ui,sans-serif;white-space:nowrap;box-shadow:0 12px 26px rgba(10,168,143,.32),0 1px 0 rgba(255,255,255,.35) inset;transition:opacity .15s ease,transform .15s ease}
html[data-skin="pearl"] .pl-tip::before{content:"";position:absolute;left:-5px;top:50%;width:10px;height:10px;margin-top:-5px;border-radius:2px;background:#0fb898;transform:rotate(45deg)}
html[data-skin="pearl"] .pl-tip.show{opacity:1;transform:translate(0,-50%)}
@media (prefers-reduced-motion:reduce){html[data-skin="pearl"] .pl-tip{transition:none}}

/* ===================== Glass Pearl — DARK mode (graphite frosted glass) ===================== */
html[data-skin="pearl"][data-theme="dark"]{--bg:#0d0f12;--panel:rgba(30,33,38,.58);--panel-solid:#1a1d21;--panel-hover:rgba(40,44,50,.72);--hover:rgba(255,255,255,.05);--line:rgba(255,255,255,.07);--line-strong:rgba(255,255,255,.14);--line-soft:rgba(255,255,255,.05);--text:#eef0f3;--text-soft:#c3c8cf;--soft:#c3c8cf;--muted:#8b929c;--accent:#2ecc8f;--accent-deep:#1f9c6c;--accent2:#1f9c6c;--accent-grad:linear-gradient(135deg,#12c6a6 0%,#0aa88f 50%,#067f68 100%);--grad:linear-gradient(135deg,#12c6a6 0%,#0aa88f 50%,#067f68 100%);--accent-ink:#fff;--on-accent:#fff;--icon-bg:rgba(255,255,255,.06);--ok:#33e6a1;--success:#33e6a1;--warn:#ffb545;--warning:#ffb545;--bad:#ff6570;--danger:#ff6570;--info:#6aa5ff;--hero:linear-gradient(135deg,#1f3d35 0%,#142621 55%,#0c1512 100%);--hero-line:rgba(255,255,255,.22);--shadow-card:0 1px 0 rgba(255,255,255,.04) inset,0 20px 40px rgba(0,0,0,.45);--shadow:0 1px 0 rgba(255,255,255,.04) inset,0 20px 40px rgba(0,0,0,.45);--shadow-pop:0 1px 0 rgba(255,255,255,.05) inset,0 30px 70px rgba(0,0,0,.6);color-scheme:dark}
html[data-skin="pearl"][data-theme="dark"] body{background:radial-gradient(1200px 700px at 85% -10%,#262a30 0%,rgba(38,42,48,0) 60%),radial-gradient(900px 600px at -10% 110%,#1b1e23 0%,rgba(27,30,35,0) 60%),linear-gradient(160deg,#16181c 0%,#0f1114 55%,#0a0b0d 100%) fixed !important;color:var(--text)}
html[data-skin="pearl"][data-theme="dark"] .orb{background:radial-gradient(circle at 32% 28%,#4a5059 0%,#2a2e34 40%,#15181c 80%,#0e1013 100%) !important;opacity:.6 !important;box-shadow:inset -18px -22px 40px rgba(0,0,0,.45),0 40px 80px rgba(0,0,0,.5) !important}
html[data-skin="pearl"][data-theme="dark"] .topbar{background:rgba(30,33,38,.55) !important;border-color:rgba(255,255,255,.07) !important;box-shadow:0 1px 0 rgba(255,255,255,.04) inset,0 14px 34px rgba(0,0,0,.35) !important}
@media (min-width:981px){html[data-skin="pearl"][data-theme="dark"] .app{background:linear-gradient(150deg,rgba(34,37,42,.88) 0%,rgba(24,27,31,.86) 55%,rgba(17,19,22,.88) 100%) !important;border-color:rgba(255,255,255,.07) !important;box-shadow:0 1px 0 rgba(255,255,255,.05) inset,0 50px 100px rgba(0,0,0,.55) !important}}
@media (max-width:980px){html[data-skin="pearl"][data-theme="dark"] .sidebar{background:rgba(22,24,28,.96) !important;border-color:rgba(255,255,255,.07) !important}html[data-skin="pearl"][data-theme="dark"] .theme-seg{background:rgba(255,255,255,.05) !important;border-color:rgba(255,255,255,.08) !important}}
html[data-skin="pearl"][data-theme="dark"] .glass,html[data-skin="pearl"][data-theme="dark"] .glass-pad,html[data-skin="pearl"][data-theme="dark"] .ov-tile,html[data-skin="pearl"][data-theme="dark"] .stat,html[data-skin="pearl"][data-theme="dark"] .tile{background:linear-gradient(160deg,rgba(44,48,55,.72),rgba(30,33,38,.55)) !important;border:1px solid rgba(255,255,255,.07) !important;box-shadow:var(--shadow-card) !important}
html[data-skin="pearl"][data-theme="dark"] .modal,html[data-skin="pearl"][data-theme="dark"] .drawer,html[data-skin="pearl"][data-theme="dark"] .profile-menu,html[data-skin="pearl"][data-theme="dark"] .pop{background:rgba(26,29,33,.97) !important;border-color:rgba(255,255,255,.08) !important;box-shadow:var(--shadow-pop) !important}
html[data-skin="pearl"][data-theme="dark"] .ov-tile::before{background:rgba(255,255,255,.03) !important}
html[data-skin="pearl"][data-theme="dark"] .ov-tile::after{background:radial-gradient(circle,rgba(46,204,143,.10),rgba(0,0,0,0) 70%) !important}
html[data-skin="pearl"][data-theme="dark"] .ov-item{background:rgba(255,255,255,.04) !important;border-color:rgba(255,255,255,.06) !important;box-shadow:none !important}
html[data-skin="pearl"][data-theme="dark"] .ov-focus,html[data-skin="pearl"][data-theme="dark"] .eyebrow,html[data-skin="pearl"][data-theme="dark"] .ov-chip{background:rgba(255,255,255,.06) !important;border-color:rgba(255,255,255,.08) !important;color:var(--text-soft) !important}
html[data-skin="pearl"][data-theme="dark"] .ov-ico{background:rgba(255,255,255,.08) !important;box-shadow:none !important}
html[data-skin="pearl"][data-theme="dark"] .promo{background:linear-gradient(160deg,rgba(44,48,55,.8),rgba(30,33,38,.6)) !important;border-color:rgba(255,255,255,.08) !important;color:var(--text) !important}
html[data-skin="pearl"][data-theme="dark"] .btn:not(.btn-primary):not(.primary):not(.btn-danger):not(.active):not(.on),html[data-skin="pearl"][data-theme="dark"] .btn-ghost:not(.active),html[data-skin="pearl"][data-theme="dark"] .icon-btn,html[data-skin="pearl"][data-theme="dark"] .bell,html[data-skin="pearl"][data-theme="dark"] .profile-btn,html[data-skin="pearl"][data-theme="dark"] .pl-rail-btn,html[data-skin="pearl"][data-theme="dark"] .theme-seg button:not(.on),html[data-skin="pearl"][data-theme="dark"] .logout-btn,html[data-skin="pearl"][data-theme="dark"] .side-out button{background:rgba(255,255,255,.06) !important;border-color:rgba(255,255,255,.09) !important;color:var(--text) !important;box-shadow:0 8px 18px rgba(0,0,0,.30),0 1px 0 rgba(255,255,255,.05) inset !important}
html[data-skin="pearl"][data-theme="dark"] .logout-btn,html[data-skin="pearl"][data-theme="dark"] .side-out button{color:#ff7d7d !important}
html[data-skin="pearl"][data-theme="dark"] .sidebar .nav-link:not(.active),html[data-skin="pearl"][data-theme="dark"] .sidebar .nav a:not(.on){color:#c3c8cf !important}
html[data-skin="pearl"][data-theme="dark"] .sidebar .nav-link:not(.active):hover,html[data-skin="pearl"][data-theme="dark"] .sidebar .nav a:not(.on):hover{background:rgba(255,255,255,.07) !important;border-color:rgba(255,255,255,.08) !important;color:#fff !important;box-shadow:none !important}
html[data-skin="pearl"][data-theme="dark"].pl-mini .sidebar .nav-link:not(.active),html[data-skin="pearl"][data-theme="dark"].pl-mini .sidebar .nav a:not(.on){background:rgba(255,255,255,.06) !important;border-color:rgba(255,255,255,.09) !important;box-shadow:0 8px 18px rgba(0,0,0,.30) !important}
html[data-skin="pearl"][data-theme="dark"].pl-mini .sidebar .nav-badge,html[data-skin="pearl"][data-theme="dark"].pl-mini .sidebar .nav a .badge{box-shadow:0 0 0 2px #1a1d21 !important}
html[data-skin="pearl"][data-theme="dark"] .sidebar-foot,html[data-skin="pearl"][data-theme="dark"] .side-out{border-top-color:rgba(255,255,255,.07) !important}
html[data-skin="pearl"][data-theme="dark"] .pl-title .page-title,html[data-skin="pearl"][data-theme="dark"] .pl-title h1,html[data-skin="pearl"][data-theme="dark"] .content .hero h1,html[data-skin="pearl"][data-theme="dark"] .content .top h1{color:#f3f5f7 !important}
html[data-skin="pearl"][data-theme="dark"] .searchbox{background:rgba(255,255,255,.05) !important;border-color:rgba(255,255,255,.08) !important;box-shadow:none !important}
html[data-skin="pearl"][data-theme="dark"] input:not([type=checkbox]):not([type=radio]):not([type=range]),html[data-skin="pearl"][data-theme="dark"] select,html[data-skin="pearl"][data-theme="dark"] textarea,html[data-skin="pearl"][data-theme="dark"] .in,html[data-skin="pearl"][data-theme="dark"] .dtx-select-trigger,html[data-skin="pearl"][data-theme="dark"] .dtx-date-trigger{background:rgba(255,255,255,.05) !important;border-color:rgba(255,255,255,.09) !important;color:var(--text) !important}
html[data-skin="pearl"][data-theme="dark"] .searchbox input{background:transparent !important;border:0 !important}
html[data-skin="pearl"][data-theme="dark"] input:focus,html[data-skin="pearl"][data-theme="dark"] select:focus,html[data-skin="pearl"][data-theme="dark"] textarea:focus,html[data-skin="pearl"][data-theme="dark"] .in:focus{border-color:#2ecc8f !important;box-shadow:0 0 0 3px rgba(46,204,143,.16) !important}
html[data-skin="pearl"][data-theme="dark"] input::placeholder,html[data-skin="pearl"][data-theme="dark"] textarea::placeholder{color:#7d848e !important}
html[data-skin="pearl"][data-theme="dark"] table th{color:var(--muted) !important}
html[data-skin="pearl"][data-theme="dark"] table tr:hover td{background:rgba(255,255,255,.04) !important}
html[data-skin="pearl"][data-theme="dark"] .scrim{background:rgba(0,0,0,.5) !important}
html[data-skin="pearl"][data-theme="dark"] ::-webkit-scrollbar-thumb{background:rgba(255,255,255,.14)}

/* Glass Pearl — mobile slide-out menu: solid panel instead of see-through glass (22 Oct 2026) */
@media (max-width:760px){
  html[data-skin="pearl"] .sidebar{background:rgba(246,247,249,.98) !important;backdrop-filter:none !important;-webkit-backdrop-filter:none !important;border-radius:0 26px 26px 0;box-shadow:0 30px 80px rgba(40,46,60,.35) !important}
  html[data-skin="pearl"][data-theme="dark"] .sidebar{background:rgba(22,24,28,.98) !important;box-shadow:0 30px 80px rgba(0,0,0,.6) !important}
  html[data-skin="pearl"] .sidebar .nav-link,html[data-skin="pearl"] .sidebar .nav a{border-radius:999px !important}
}

/* Glass Pearl: any active tab / segmented button inside a page = theme green with white text (22 Oct 2026; e.g. Invoices · Outstanding & Dues · Collections) */
html[data-skin="pearl"] .content [class*="tabs"] > .on,html[data-skin="pearl"] .content [class*="tabs"] > .active,html[data-skin="pearl"] .content [class*="-tab"].on,html[data-skin="pearl"] .content [class*="-sub"] > a.active,html[data-skin="pearl"] .content [class*="-sub"] > a.on{background:linear-gradient(135deg,#12c6a6 0%,#0aa88f 50%,#067f68 100%) !important;color:#fff !important;border-color:#0aa88f !important;box-shadow:0 10px 22px rgba(10,168,143,.30) !important}
html[data-skin="pearl"] .content [class*="tabs"] > .on *,html[data-skin="pearl"] .content [class*="tabs"] > .active *{color:#fff !important}

/* Themed hover tooltips (22 Oct 2026) — Pro theme: solid panel with jade edge; Glass Pearl: green pill */
.pl-htip{position:fixed;z-index:10000;left:0;top:0;max-width:280px;padding:7px 12px;border-radius:10px;background:var(--panel-solid,#121815);color:var(--text,#eaf2ee);border:1px solid var(--line-strong,rgba(46,204,143,.34));box-shadow:0 14px 34px rgba(0,0,0,.35);font-size:12.5px;font-weight:600;line-height:1.35;font-family:inherit;white-space:normal;pointer-events:none;opacity:0;transform:translateY(4px);transition:opacity .14s ease,transform .14s ease}
.pl-htip::after{content:"";position:absolute;left:var(--ax,50%);bottom:-5px;width:9px;height:9px;margin-left:-5px;background:inherit;border:inherit;border-top:0;border-left:0;transform:rotate(45deg)}
.pl-htip.below::after{bottom:auto;top:-5px;border:inherit;border-bottom:0;border-right:0}
.pl-htip.below{transform:translateY(-4px)}
.pl-htip.show{opacity:1;transform:none}
html[data-theme="light"]:not([data-skin="pearl"]) .pl-htip{box-shadow:0 14px 34px rgba(20,40,32,.18)}
html[data-skin="pearl"] .pl-htip{border-radius:999px;padding:8px 14px;background:#0aa88f;background:linear-gradient(135deg,#12c6a6 0%,#0aa88f 50%,#067f68 100%);color:#fff;border:0;font-family:Poppins,inherit;font-weight:500;box-shadow:0 12px 28px rgba(10,168,143,.32)}
html[data-skin="pearl"] .pl-htip::after{background:#0aa88f;border:0}
@media (prefers-reduced-motion:reduce){.pl-htip{transition:none}}
@media (hover:none){.pl-htip{display:none}}