
/* FutureScope Nexus LOCK 13 Enterprise Product Design System
© 2026 FutureScope Systems, Inc.
Confidential & Proprietary.
*/

:root,
html[data-theme="dark"]{
 --bg:#0b1020;
 --bg2:#111827;
 --surface:#121a2d;
 --surface2:#182235;
 --border:#27324a;
 --text:#f8fafc;
 --muted:#9ca3af;
 --accent:#3b82f6;
 --accent2:#06b6d4;
 --success:#10b981;
 --danger:#ef4444;
 --shadow:rgba(0,0,0,.35);
 --radius:10px;
}

html[data-theme="light"]{
 --bg:#f5f7fb;
 --bg2:#ffffff;
 --surface:#ffffff;
 --surface2:#eef2f8;
 --border:#d8dee8;
 --text:#111827;
 --muted:#667085;
 --accent:#2563eb;
 --accent2:#0891b2;
 --success:#0f9f6e;
 --danger:#dc2626;
 --shadow:rgba(15,23,42,.08);
 --radius:10px;
}

html[data-theme="cyber-defense"]{
 --bg:#060b1a;
 --bg2:#091225;
 --surface:#0e1730;
 --surface2:#15203a;
 --border:#384861;
 --text:#f9fafb;
 --muted:#a7b1c4;
 --accent:#ffd400;
 --accent2:#22d3ee;
 --success:#10b981;
 --danger:#ff5b5b;
 --shadow:rgba(0,0,0,.4);
 --radius:10px;
}

html[data-theme="enterprise-insight"]{
 --bg:#eef6f8;
 --bg2:#ffffff;
 --surface:#ffffff;
 --surface2:#e8f1f4;
 --border:#cddbe1;
 --text:#102833;
 --muted:#5f7480;
 --accent:#0f5f79;
 --accent2:#14b8a6;
 --success:#0f9f6e;
 --danger:#c24141;
 --shadow:rgba(16,24,40,.08);
 --radius:10px;
}

*{box-sizing:border-box}

body.fs-nexus-enabled{
 margin:0;
 background:linear-gradient(180deg,var(--bg),var(--bg2)) !important;
 color:var(--text) !important;
 font-family:Inter,Segoe UI,system-ui,sans-serif !important;
}

.fs13-shell{
 min-height:100vh;
}

.fs13-header{
 position:sticky;
 top:0;
 z-index:9999;
 height:64px;
 display:flex;
 align-items:center;
 gap:22px;
 padding:0 28px;
 background:rgba(10,15,28,.94);
 border-bottom:1px solid var(--border);
 backdrop-filter:blur(18px);
}

html[data-theme="light"] .fs13-header,
html[data-theme="enterprise-insight"] .fs13-header{
 background:rgba(255,255,255,.92);
}

.fs13-brand{
 display:flex;
 align-items:center;
 gap:14px;
 min-width:320px;
}

.fs13-logo{
 width:38px;
 height:38px;
 border-radius:10px;
 display:grid;
 place-items:center;
 background:linear-gradient(135deg,var(--accent),var(--accent2));
 color:white;
 font-weight:900;
 font-size:16px;
}

.fs13-brand-title{
 font-size:16px;
 font-weight:850;
 line-height:1;
 color:var(--text);
}

.fs13-brand-sub{
 margin-top:4px;
 font-size:11px;
 font-weight:700;
 color:var(--muted);
}

.fs13-context{
 padding:8px 14px;
 border-radius:999px;
 border:1px solid var(--border);
 background:var(--surface2);
 color:var(--muted);
 font-size:12px;
 font-weight:700;
}

.fs13-nav{
 display:flex;
 align-items:center;
 gap:8px;
 flex:1;
}

.fs13-nav a{
 color:var(--muted) !important;
 font-size:14px;
 font-weight:700;
 padding:8px 12px;
 border-radius:8px;
}

.fs13-nav a:hover{
 background:var(--surface2);
 text-decoration:none;
 color:var(--text) !important;
}

.fs13-language,
.fs13-theme{
 width:170px;
 height:36px;
 border-radius:8px !important;
 background:var(--surface) !important;
 color:var(--text) !important;
 border:1px solid var(--border) !important;
 font-size:13px !important;
 font-weight:700 !important;
}

.fs13-hero{
 max-width:1240px;
 margin:0 auto;
 padding:54px 28px 20px;
}

.fs13-product-tag{
 display:inline-flex;
 align-items:center;
 gap:8px;
 padding:8px 12px;
 border-radius:999px;
 background:var(--surface2);
 border:1px solid var(--border);
 color:var(--muted);
 font-size:12px;
 font-weight:800;
}

.fs13-hero-grid{
 display:grid;
 grid-template-columns:1.2fr .8fr;
 gap:48px;
 align-items:center;
 margin-top:26px;
}

.fs13-title{
 font-size:58px;
 line-height:1.02;
 letter-spacing:-.04em;
 margin:0 0 18px;
 max-width:760px;
}

.fs13-copy{
 font-size:19px;
 line-height:1.7;
 color:var(--muted);
 max-width:720px;
}

.fs13-actions{
 display:flex;
 gap:12px;
 margin-top:28px;
 flex-wrap:wrap;
}

.fs13-card,
section,
.card,
.panel,
.box{
 background:var(--surface) !important;
 border:1px solid var(--border) !important;
 border-radius:16px !important;
 box-shadow:0 10px 24px var(--shadow) !important;
}

button,.btn,input[type=button],input[type=submit]{
 min-height:40px;
 border-radius:8px !important;
 padding:10px 16px !important;
 border:1px solid var(--border) !important;
 background:var(--surface2) !important;
 color:var(--text) !important;
 font-weight:800 !important;
 box-shadow:none !important;
}

.fs-btn-primary{
 background:var(--accent) !important;
 color:#fff !important;
 border-color:var(--accent) !important;
}

.fs-btn-secondary{
 background:var(--surface2) !important;
 color:var(--text) !important;
}

.fs-btn-danger{
 background:var(--danger) !important;
 color:#fff !important;
 border-color:var(--danger) !important;
}

table{
 width:100%;
 border-collapse:collapse;
 background:var(--surface);
}

th,td{
 padding:12px 14px;
 border-bottom:1px solid var(--border);
}

th{
 background:var(--surface2);
 text-align:left;
}

input,select,textarea{
 background:var(--surface2) !important;
 color:var(--text) !important;
 border:1px solid var(--border) !important;
 border-radius:8px !important;
}

.fs13-footer{
 max-width:1240px;
 margin:40px auto 20px;
 padding:18px 28px;
 border-top:1px solid var(--border);
 color:var(--muted);
 font-size:12px;
}

@media(max-width:1000px){
 .fs13-hero-grid{
  grid-template-columns:1fr;
 }
 .fs13-title{
  font-size:42px;
 }
 .fs13-header{
  flex-wrap:wrap;
  height:auto;
  padding:14px 18px;
 }
 .fs13-nav{
  width:100%;
  overflow:auto;
 }
}


/* LOCK14.1 Enterprise button contrast fix: all action buttons must be black with white text. */
button,.btn,input[type=button],input[type=submit],a.btn,.fs-btn-primary,.fs-btn-secondary,.fs-btn-danger,.btn-primary,.btn-secondary,.btn-approve,.btn-reject,.btn-delete{
 background:#000000!important;
 color:#ffffff!important;
 border-color:#333333!important;
 text-shadow:none!important;
 -webkit-text-fill-color:#ffffff!important;
}
button:hover,.btn:hover,input[type=button]:hover,input[type=submit]:hover,a.btn:hover,.fs-btn-primary:hover,.fs-btn-secondary:hover,.fs-btn-danger:hover,.btn-primary:hover,.btn-secondary:hover,.btn-approve:hover,.btn-reject:hover,.btn-delete:hover{
 background:#111111!important;
 color:#ffffff!important;
 -webkit-text-fill-color:#ffffff!important;
}
select.theme-select,select.language-select,.fs-top-controls select{
 background:#000000!important;
 color:#ffffff!important;
 border-color:#333333!important;
}

/* LOCK31Q3 — Light / Enterprise Insight component contrast hardening
   Cosmetic-only. Preserves all portal logic and workflows. */
html[data-theme="light"],
html[data-theme="enterprise-insight"]{
  --fs-light-readable-text:#0b1f3a;
  --fs-light-readable-muted:#334155;
  --fs-light-pill-bg:#102a4c;
  --fs-light-pill-text:#ffffff;
  --fs-light-tab-bg:#e8f2f7;
  --fs-light-tab-text:#10233f;
  --fs-light-tab-border:#77a9c0;
  --fs-light-status-success:#14532d;
  --fs-light-status-warning:#7c2d12;
  --fs-light-status-danger:#7f1d1d;
}

/* Hero/top capability pills: dark pill must always have light text. */
html[data-theme="light"] .chip,
html[data-theme="enterprise-insight"] .chip,
html[data-theme="light"] .hero .chip,
html[data-theme="enterprise-insight"] .hero .chip,
html[data-theme="light"] .hero-badge,
html[data-theme="enterprise-insight"] .hero-badge,
html[data-theme="light"] .feature-pill,
html[data-theme="enterprise-insight"] .feature-pill,
html[data-theme="light"] .tag,
html[data-theme="enterprise-insight"] .tag{
  background:var(--fs-light-pill-bg)!important;
  color:var(--fs-light-pill-text)!important;
  -webkit-text-fill-color:var(--fs-light-pill-text)!important;
  border:1px solid #25466f!important;
  text-shadow:none!important;
}
html[data-theme="light"] .chip *,
html[data-theme="enterprise-insight"] .chip *,
html[data-theme="light"] .hero-badge *,
html[data-theme="enterprise-insight"] .hero-badge *,
html[data-theme="light"] .feature-pill *,
html[data-theme="enterprise-insight"] .feature-pill *{
  color:var(--fs-light-pill-text)!important;
  -webkit-text-fill-color:var(--fs-light-pill-text)!important;
}

/* Distributor guided workflow tabs: pale tab backgrounds require dark readable labels. */
html[data-theme="light"] .workspace-tab,
html[data-theme="enterprise-insight"] .workspace-tab{
  background:var(--fs-light-tab-bg)!important;
  color:var(--fs-light-tab-text)!important;
  -webkit-text-fill-color:var(--fs-light-tab-text)!important;
  border:1px solid var(--fs-light-tab-border)!important;
  text-shadow:none!important;
}
html[data-theme="light"] .workspace-tab::before,
html[data-theme="enterprise-insight"] .workspace-tab::before{
  background:#d7e5ed!important;
  color:#10233f!important;
  -webkit-text-fill-color:#10233f!important;
  border-color:#8ba9b8!important;
}
html[data-theme="light"] .workspace-tab::after,
html[data-theme="enterprise-insight"] .workspace-tab::after{
  color:#10233f!important;
  -webkit-text-fill-color:#10233f!important;
  opacity:.75!important;
}
html[data-theme="light"] .workspace-tab.active,
html[data-theme="enterprise-insight"] .workspace-tab.active{
  background:#b9e2eb!important;
  color:#082033!important;
  -webkit-text-fill-color:#082033!important;
  border-color:#4f9db6!important;
  box-shadow:0 0 0 3px rgba(79,157,182,.22),0 14px 28px rgba(15,54,80,.14)!important;
}
html[data-theme="light"] .workspace-tab.active::before,
html[data-theme="enterprise-insight"] .workspace-tab.active::before{
  background:#0f3b57!important;
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
  border-color:#0f3b57!important;
}

/* SecureSign pills/badges inside legal tables: dark pill must always have white text. */
html[data-theme="light"] .fsn-legal-pill,
html[data-theme="enterprise-insight"] .fsn-legal-pill,
html[data-theme="light"] .badge,
html[data-theme="enterprise-insight"] .badge,
html[data-theme="light"] .pill,
html[data-theme="enterprise-insight"] .pill{
  background:#102a4c!important;
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
  border-color:#315b8a!important;
  text-shadow:none!important;
}
html[data-theme="light"] .fsn-legal-pill *,
html[data-theme="enterprise-insight"] .fsn-legal-pill *,
html[data-theme="light"] .badge *,
html[data-theme="enterprise-insight"] .badge *,
html[data-theme="light"] .pill *,
html[data-theme="enterprise-insight"] .pill *{
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
  text-shadow:none!important;
}

/* Legal table status text: avoid neon green/yellow on white. */
html[data-theme="light"] .status-issued,
html[data-theme="light"] .status-generated,
html[data-theme="light"] .status-approved,
html[data-theme="light"] .status-accepted,
html[data-theme="light"] .success,
html[data-theme="light"] .ok,
html[data-theme="enterprise-insight"] .status-issued,
html[data-theme="enterprise-insight"] .status-generated,
html[data-theme="enterprise-insight"] .status-approved,
html[data-theme="enterprise-insight"] .status-accepted,
html[data-theme="enterprise-insight"] .success,
html[data-theme="enterprise-insight"] .ok{
  color:var(--fs-light-status-success)!important;
  -webkit-text-fill-color:var(--fs-light-status-success)!important;
  text-shadow:none!important;
  font-weight:900!important;
}
html[data-theme="light"] .status-draft,
html[data-theme="light"] .status-pending,
html[data-theme="light"] .warn,
html[data-theme="enterprise-insight"] .status-draft,
html[data-theme="enterprise-insight"] .status-pending,
html[data-theme="enterprise-insight"] .warn{
  color:var(--fs-light-status-warning)!important;
  -webkit-text-fill-color:var(--fs-light-status-warning)!important;
  text-shadow:none!important;
  font-weight:900!important;
}

/* Inline legacy status spans in SecureSign generated markup. */
html[data-theme="light"] #secureSignBody span[style*="color:#86efac"],
html[data-theme="enterprise-insight"] #secureSignBody span[style*="color:#86efac"],
html[data-theme="light"] #secureSignBody span[style*="color: #86efac"],
html[data-theme="enterprise-insight"] #secureSignBody span[style*="color: #86efac"]{
  color:var(--fs-light-status-success)!important;
  -webkit-text-fill-color:var(--fs-light-status-success)!important;
}
html[data-theme="light"] #secureSignBody span[style*="color:#facc15"],
html[data-theme="enterprise-insight"] #secureSignBody span[style*="color:#facc15"],
html[data-theme="light"] #secureSignBody span[style*="color: #facc15"],
html[data-theme="enterprise-insight"] #secureSignBody span[style*="color: #facc15"]{
  color:var(--fs-light-status-warning)!important;
  -webkit-text-fill-color:var(--fs-light-status-warning)!important;
}

/* Dark action/download buttons in light themes must keep white text. */
html[data-theme="light"] .fsn-legal-download-link,
html[data-theme="enterprise-insight"] .fsn-legal-download-link,
html[data-theme="light"] .fsn-legal-actions a,
html[data-theme="enterprise-insight"] .fsn-legal-actions a,
html[data-theme="light"] .fsn-legal-sign-btn,
html[data-theme="enterprise-insight"] .fsn-legal-sign-btn,
html[data-theme="light"] button.secondary,
html[data-theme="enterprise-insight"] button.secondary{
  background:#102a4c!important;
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
  border:1px solid #315b8a!important;
  text-shadow:none!important;
}
html[data-theme="light"] .fsn-legal-actions a *,
html[data-theme="enterprise-insight"] .fsn-legal-actions a *,
html[data-theme="light"] button.secondary *,
html[data-theme="enterprise-insight"] button.secondary *{
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
}

/* Legal table and muted boxes in pale themes need stronger separation/readability. */
html[data-theme="light"] th,
html[data-theme="enterprise-insight"] th{
  color:#0b1f3a!important;
  -webkit-text-fill-color:#0b1f3a!important;
  background:#d9e8ef!important;
  border-bottom:1px solid #8bb2c4!important;
}
html[data-theme="light"] td,
html[data-theme="enterprise-insight"] td,
html[data-theme="light"] .fsn-legal-title,
html[data-theme="enterprise-insight"] .fsn-legal-title{
  color:#0b1f3a!important;
  -webkit-text-fill-color:#0b1f3a!important;
}
html[data-theme="light"] .fsn-legal-muted-box,
html[data-theme="enterprise-insight"] .fsn-legal-muted-box,
html[data-theme="light"] .note,
html[data-theme="enterprise-insight"] .note{
  background:#eef6fb!important;
  color:#0b1f3a!important;
  -webkit-text-fill-color:#0b1f3a!important;
  border-color:#9bb9ca!important;
}
html[data-theme="light"] .fsn-legal-muted-box *,
html[data-theme="enterprise-insight"] .fsn-legal-muted-box *,
html[data-theme="light"] .note *,
html[data-theme="enterprise-insight"] .note *{
  color:#0b1f3a!important;
  -webkit-text-fill-color:#0b1f3a!important;
}

/* Footer/status strips that remain dark in light themes must use readable light text. */
html[data-theme="light"] .fsn-legal-footer,
html[data-theme="enterprise-insight"] .fsn-legal-footer,
html[data-theme="light"] [class*="footer" i][style*="background"],
html[data-theme="enterprise-insight"] [class*="footer" i][style*="background"]{
  color:#eaf2ff!important;
  -webkit-text-fill-color:#eaf2ff!important;
}

/* Do not let global black-button rules hide labels on pale components. */
html[data-theme="light"] .workspace-tab,
html[data-theme="enterprise-insight"] .workspace-tab,
html[data-theme="light"] .workspace-tab *,
html[data-theme="enterprise-insight"] .workspace-tab *{
  text-shadow:none!important;
}
