/* Dark theme: keep token text light grey (no green). */
html:not(.cm-theme-light)[data-theme="dark"] .text-green-400,
html:not(.cm-theme-light)[data-theme="dark"] .text-green-500,
html:not(.cm-theme-light)[data-theme="dark"] .text-emerald-400,
html:not(.cm-theme-light)[data-theme="dark"] .text-emerald-500{
  color: rgba(226,232,240,0.78) !important;
}

/* Hide CoreMate brand/logo overlay inside CAD viewer (top-right watermark). */
#root img[src*="core-mate-icon"],
#root img[src*="core-mate-dark"],
#root img[src*="coremate"],
#root a[href*="coremate"] img{
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Dark mode: remove 1px seam/cusp between sidebar and viewport. */
html:not(.cm-theme-light)[data-theme="dark"] body,
html:not(.cm-theme-light)[data-theme="dark"] #root{
  background: #111827 !important; /* slate-900 */
}

/* If the shell uses gap/dividers/border-left between columns, zero them. */
html:not(.cm-theme-light)[data-theme="dark"] #root .divide-x > :not([hidden]) ~ :not([hidden]){
  border-left-width: 0 !important;
}
html:not(.cm-theme-light)[data-theme="dark"] #root .border-l{
  border-left-width: 0 !important;
}

/* Ensure rounded shells clip inner backgrounds (prevents a dark "cusp" at corners). */
html:not(.cm-theme-light)[data-theme="dark"] #root [class*="rounded"]{
  background-clip: padding-box;
}
html:not(.cm-theme-light)[data-theme="dark"] #root [class*="rounded"][class*="overflow-hidden"],
html:not(.cm-theme-light)[data-theme="dark"] #root [class*="rounded"][style*="overflow: hidden"]{
  background: #111827 !important;
}

/* Dark mode: Home (dashboard) active shading should match "Use 4 tokens" CTA. */
html:not(.cm-theme-light)[data-theme="dark"] #root nav a[href="/user/dashboard"],
html:not(.cm-theme-light)[data-theme="dark"] #root nav a[href="/user/dashboard/"],
html:not(.cm-theme-light)[data-theme="dark"] #root nav a[href="/user/dashboard"][aria-current="page"],
html:not(.cm-theme-light)[data-theme="dark"] #root nav a[href="/user/dashboard/"][aria-current="page"],
html:not(.cm-theme-light)[data-theme="dark"] #root nav button[aria-current="page"][data-to="/user/dashboard"],
html:not(.cm-theme-light)[data-theme="dark"] #root nav button[aria-current="page"][data-href="/user/dashboard"]{
  background: linear-gradient(90deg, #0ea5e9 0%, #2563eb 100%) !important; /* sky-500 -> blue-600 */
  color: rgba(255,255,255,0.92) !important;
  border-color: rgba(14,165,233,0.35) !important;
  box-shadow: 0 0 0 1px rgba(14,165,233,0.25), 0 6px 18px rgba(37,99,235,0.20) !important;
}

/* Hide Move-to-origin control when disabled (no greyed-out state). */
#root button[title="Move selected structure to world origin (0,0,0)"][disabled],
#root button[title="Move selected structure to world origin (0,0,0)"][aria-disabled="true"]{
  display: none !important;
}

/* Dark mode typography: avoid pure white; match "Expiry Date" label tone. */
html:not(.cm-theme-light)[data-theme="dark"] body,
html:not(.cm-theme-light)[data-theme="dark"] #root{
  color: rgba(209,213,219,0.92) !important; /* ≈ Tailwind gray-300 */
}

/* Force common "white" text utility classes to the same tone. */
html:not(.cm-theme-light)[data-theme="dark"] #root .text-white,
html:not(.cm-theme-light)[data-theme="dark"] #root [class*="text-white"],
html:not(.cm-theme-light)[data-theme="dark"] #root [class*="text-blue-50"],
html:not(.cm-theme-light)[data-theme="dark"] #root [class*="text-blue-100"]{
  color: rgba(209,213,219,0.92) !important;
}

/* Dark mode: slightly brighten the simulation (left) sidebar column. */
html:not(.cm-theme-light)[data-theme="dark"] #root .divide-x > :not([hidden]):first-child{
  background-color: rgba(30,41,59,0.92) !important; /* brighter */
  border-right-color: rgba(148,163,184,0.18) !important; /* slightly stronger divider */
}

/* Hide Move-to-origin control when disabled (no greyed-out state). */
#root button[title="Move selected structure to world origin (0,0,0)"][disabled],
#root button[title="Move selected structure to world origin (0,0,0)"][aria-disabled="true"]{
  display: none !important;
}

/* Dark mode: make Home shading match "Use 4 tokens" CTA tone. */
html:not(.cm-theme-light)[data-theme="dark"] #root a[href="/user/dashboard"],
html:not(.cm-theme-light)[data-theme="dark"] #root button[aria-current="page"]{
  background: linear-gradient(135deg, rgb(29,78,216) 0%, rgb(37,99,235) 55%, rgb(59,130,246) 100%) !important;
  border-color: rgba(147,197,253,0.42) !important;
  color: rgba(255,255,255,0.97) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.18), 0 4px 18px rgba(37,99,235,0.38) !important;
}

/* Dark mode: remove 1px seam/cusp between sidebar and viewport. */
html:not(.cm-theme-light)[data-theme="dark"] body,
html:not(.cm-theme-light)[data-theme="dark"] #root{
  background: #111827 !important; /* slate-900 */
}

/* If the shell uses gap/dividers/border-left between columns, zero them. */
html:not(.cm-theme-light)[data-theme="dark"] #root .divide-x > :not([hidden]) ~ :not([hidden]){
  border-left-width: 0 !important;
}
html:not(.cm-theme-light)[data-theme="dark"] #root .border-l{
  border-left-width: 0 !important;
}

/* Ensure rounded shells clip inner backgrounds (prevents a dark "cusp" at corners). */
html:not(.cm-theme-light)[data-theme="dark"] #root [class*="rounded"]{
  background-clip: padding-box;
}
html:not(.cm-theme-light)[data-theme="dark"] #root [class*="rounded"][class*="overflow-hidden"],
html:not(.cm-theme-light)[data-theme="dark"] #root [class*="rounded"][style*="overflow: hidden"]{
  background: #111827 !important;
}