/* TEORA home dashboard mockups
   Keep the dark product UI readable regardless of the global site theme. */
.dh-mockup-skin {
  color: #eaf1fa !important;
}

.dh-mockup-skin .bg-\[oklch\(0\.20_0\.04_165\)\] {
  background-color: #0b1e3a !important;
}
.dh-mockup-skin .bg-\[oklch\(0\.18_0\.04_165\)\] {
  background-color: #07111f !important;
}
.dh-mockup-skin .bg-\[oklch\(0\.23_0\.04_165\)\] {
  background-color: #0e2647 !important;
}
.dh-mockup-skin .bg-\[oklch\(0\.26_0\.05_165\)\] {
  background-color: #123a63 !important;
}

.dh-mockup-skin .text-primary-foreground {
  color: #f4f8ff !important;
}
.dh-mockup-skin .text-primary-foreground\/75 {
  color: rgba(234, 241, 250, 0.82) !important;
}
.dh-mockup-skin .text-primary-foreground\/60 {
  color: rgba(234, 241, 250, 0.68) !important;
}
.dh-mockup-skin .text-primary-foreground\/50 {
  color: rgba(234, 241, 250, 0.58) !important;
}
.dh-mockup-skin .text-primary-foreground\/40 {
  color: rgba(234, 241, 250, 0.48) !important;
}

.dh-mockup-skin .text-accent {
  color: #f6b833 !important;
}
.dh-mockup-skin .text-accent-foreground {
  color: #07111f !important;
}
.dh-mockup-skin .bg-accent {
  background-color: #f6b833 !important;
}
.dh-mockup-skin .bg-accent\/10 {
  background-color: rgba(246, 184, 51, 0.12) !important;
}
.dh-mockup-skin .border-accent\/30 {
  border-color: rgba(246, 184, 51, 0.35) !important;
}

.dh-mockup-skin .bg-primary-foreground\/15 {
  background-color: rgba(234, 241, 250, 0.16) !important;
}
.dh-mockup-skin .bg-primary-foreground\/10 {
  background-color: rgba(234, 241, 250, 0.1) !important;
}
.dh-mockup-skin .border-primary-foreground\/10 {
  border-color: rgba(234, 241, 250, 0.12) !important;
}
.dh-mockup-skin .divide-primary-foreground\/5 > :not(:last-child) {
  border-color: rgba(234, 241, 250, 0.08) !important;
}

.dh-mockup-skin svg text,
.dh-mockup-skin .recharts-text,
.dh-mockup-skin .recharts-cartesian-axis-tick-value {
  fill: rgba(234, 241, 250, 0.62) !important;
  color: rgba(234, 241, 250, 0.62) !important;
}