/* Structural light-theme fix for the authenticated analytics workspace. */
html.light-ui body {
  background:
    radial-gradient(850px 440px at 78% -140px, rgba(202, 146, 16, 0.12), transparent 66%),
    #f3f5f8 !important;
  color: #172033 !important;
}

.gc-month-bar {
  display: flex;
  flex-wrap: wrap;
  flex: 0 0 auto;
  order: 99;
  width: 100%;
  align-items: center;
  gap: .35rem;
  width: auto;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}
.gc-month-bar button {
  border: 1px solid rgb(51 65 85);
  border-radius: 999px;
  background: rgb(15 23 42);
  color: rgb(203 213 225);
  padding: .32rem .62rem;
  font-size: .7rem;
  line-height: 1rem;
  font-weight: 650;
  cursor: pointer;
}
.gc-month-bar button:hover { border-color: rgb(251 191 36); color: white; }
.gc-month-bar button.is-active { border-color: rgb(217 152 19); background: rgb(217 152 19); color: rgb(15 23 42); }
html.light-ui .gc-month-bar { border-color: transparent; background: transparent; }
html.light-ui .gc-month-bar button { border-color: rgb(203 213 225); background: white; color: rgb(51 65 85); }
html.light-ui .gc-month-bar button.is-active { border-color: rgb(202 138 4); background: rgb(202 138 4); color: white; }

html.light-ui #root,
html.light-ui .golden-app,
html.light-ui .golden-app > div,
html.light-ui .golden-app main {
  background-color: #f3f5f8 !important;
  color: #172033 !important;
}

html.light-ui .golden-app main :is(h1, h2, h3, h4, h5, h6) {
  color: #111827 !important;
}

html.light-ui .golden-app main :is(p, label) {
  text-shadow: none !important;
}

html.light-ui [class~="bg-[#111827]"],
html.light-ui [class~="bg-[#0f172a]"],
html.light-ui [class~="bg-[#020617]"] {
  background-color: #f7f8fb !important;
}

html.light-ui .recharts-default-tooltip {
  background: #ffffff !important;
  border-color: #cbd5e1 !important;
  color: #172033 !important;
}

html.light-ui .recharts-tooltip-label,
html.light-ui .recharts-tooltip-item {
  color: #172033 !important;
}

/* Light workspace surfaces. The bundle uses dark Tailwind utility classes
   directly, so neutralise them only inside authenticated page content. */
html.light-ui .golden-app main [class*="bg-gradient-to-br"][class*="from-slate-900"],
html.light-ui .golden-app main [class*="bg-gradient-to-r"][class*="from-slate-900"],
html.light-ui .golden-app main [class*="bg-gradient-to-br"][class*="via-slate-"],
html.light-ui .golden-app main [class*="bg-gradient-to-br"][class*="to-slate-"],
html.light-ui .golden-app main [class*="bg-gradient-to-r"][class*="via-slate-"],
html.light-ui .golden-app main [class*="bg-gradient-to-r"][class*="to-slate-"] {
  --tw-gradient-from: #fffaf0 !important;
  --tw-gradient-via: #ffffff !important;
  --tw-gradient-to: #f5ead8 !important;
  background-color: #ffffff !important;
  background-image: linear-gradient(135deg, #fffdf7 0%, #ffffff 58%, #f7efe1 100%) !important;
  color: #172033 !important;
}

/* Product headers used an amber-to-black gradient. Keep the warm accent but
   remove every black/dark field in light mode. */
html.light-ui .golden-app main section[class*="bg-gradient"][class*="slate-"] {
  --tw-gradient-from: #fffaf0 !important;
  --tw-gradient-via: #ffffff !important;
  --tw-gradient-to: #f5ead8 !important;
  background: linear-gradient(135deg, #fffaf0 0%, #ffffff 62%, #f5ead8 100%) !important;
  color: #172033 !important;
}

html.light-ui .golden-app main :is(
  .bg-slate-950,
  .bg-slate-900,
  .bg-slate-800,
  [class*="bg-slate-950/"],
  [class*="bg-slate-900/"],
  [class*="bg-slate-800/"]
) {
  background-color: #ffffff !important;
}

html.light-ui .golden-app main :is(
  [class*="border-slate-800"],
  [class*="border-slate-700"],
  [class*="border-slate-600"]
) {
  border-color: #d8e0ea !important;
}

html.light-ui .golden-app main :is(.text-white, .text-slate-100, .text-slate-200, .text-slate-300) {
  color: #172033 !important;
}

html.light-ui .golden-app main :is(.text-slate-400, .text-slate-500, .text-slate-600, .text-slate-700) {
  color: #526176 !important;
}

html.light-ui .golden-app main [class*="hover:bg-slate-"]:hover {
  background-color: #eef2f7 !important;
}

html.light-ui .golden-app main table thead,
html.light-ui .golden-app main table thead tr,
html.light-ui .golden-app main table thead th {
  background-color: #edf2f8 !important;
  color: #334155 !important;
}

html.light-ui .golden-app main table tbody tr {
  background-color: #ffffff !important;
  color: #172033 !important;
}

html.light-ui .golden-app main table tbody tr:hover {
  background-color: #f6f8fb !important;
}

html.light-ui .golden-app main .rounded-3xl,
html.light-ui .golden-app main .rounded-2xl,
html.light-ui .golden-app main .rounded-xl {
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.045);
}