:root {
  --legacy-primary-rgb: 45, 89, 212;
  --legacy-success-rgb: 17, 173, 50;
  --legacy-warning-rgb: 245, 147, 0;
  --legacy-danger-rgb: 230, 43, 52;
  --legacy-info-rgb: 80, 126, 241;
  --legacy-muted-rgb: 243, 246, 249;
  --legacy-foreground-rgb: 5, 8, 12;
  --legacy-sidebar-accent-rgb: 22, 31, 42;
  --legacy-sidebar-border-rgb: 30, 37, 46;
  --legacy-sidebar-foreground-rgb: 211, 216, 222;
}

.dark {
  --legacy-primary-rgb: 74, 120, 234;
  --legacy-success-rgb: 48, 189, 68;
  --legacy-warning-rgb: 252, 159, 48;
  --legacy-danger-rgb: 249, 65, 68;
  --legacy-info-rgb: 100, 146, 255;
  --legacy-muted-rgb: 12, 17, 23;
  --legacy-foreground-rgb: 243, 245, 248;
}

@supports not (color: color-mix(in oklab, red, blue)) {
  html.mobile-viewport [class~="bg-primary/5"] {
    background-color: rgba(var(--legacy-primary-rgb), 0.05) !important;
  }

  html.mobile-viewport [class~="bg-primary/8"] {
    background-color: rgba(var(--legacy-primary-rgb), 0.08) !important;
  }

  html.mobile-viewport [class~="bg-primary/10"] {
    background-color: rgba(var(--legacy-primary-rgb), 0.1) !important;
  }

  html.mobile-viewport [class~="bg-primary/20"] {
    background-color: rgba(var(--legacy-primary-rgb), 0.2) !important;
  }

  html.mobile-viewport [class~="bg-primary/80"] {
    background-color: rgba(var(--legacy-primary-rgb), 0.8) !important;
  }

  html.mobile-viewport [class~="bg-success/5"] {
    background-color: rgba(var(--legacy-success-rgb), 0.05) !important;
  }

  html.mobile-viewport [class~="bg-success/10"] {
    background-color: rgba(var(--legacy-success-rgb), 0.1) !important;
  }

  html.mobile-viewport [class~="bg-success/90"] {
    background-color: rgba(var(--legacy-success-rgb), 0.9) !important;
  }

  html.mobile-viewport [class~="bg-warning/5"] {
    background-color: rgba(var(--legacy-warning-rgb), 0.05) !important;
  }

  html.mobile-viewport [class~="bg-warning/10"] {
    background-color: rgba(var(--legacy-warning-rgb), 0.1) !important;
  }

  html.mobile-viewport [class~="bg-danger/5"] {
    background-color: rgba(var(--legacy-danger-rgb), 0.05) !important;
  }

  html.mobile-viewport [class~="bg-danger/10"] {
    background-color: rgba(var(--legacy-danger-rgb), 0.1) !important;
  }

  html.mobile-viewport [class~="bg-danger/15"] {
    background-color: rgba(var(--legacy-danger-rgb), 0.15) !important;
  }

  html.mobile-viewport [class~="bg-info/5"] {
    background-color: rgba(var(--legacy-info-rgb), 0.05) !important;
  }

  html.mobile-viewport [class~="bg-info/10"] {
    background-color: rgba(var(--legacy-info-rgb), 0.1) !important;
  }

  html.mobile-viewport [class~="bg-muted/20"] {
    background-color: rgba(var(--legacy-muted-rgb), 0.2) !important;
  }

  html.mobile-viewport [class~="bg-muted/30"] {
    background-color: rgba(var(--legacy-muted-rgb), 0.3) !important;
  }

  html.mobile-viewport [class~="bg-muted/35"] {
    background-color: rgba(var(--legacy-muted-rgb), 0.35) !important;
  }

  html.mobile-viewport [class~="bg-muted/40"] {
    background-color: rgba(var(--legacy-muted-rgb), 0.4) !important;
  }

  html.mobile-viewport [class~="bg-muted/50"] {
    background-color: rgba(var(--legacy-muted-rgb), 0.5) !important;
  }

  html.mobile-viewport [class~="bg-muted/60"] {
    background-color: rgba(var(--legacy-muted-rgb), 0.6) !important;
  }

  html.mobile-viewport [class~="bg-sidebar-accent/70"] {
    background-color: rgba(var(--legacy-sidebar-accent-rgb), 0.7) !important;
  }

  html.mobile-viewport [class~="bg-sidebar-border/40"] {
    background-color: rgba(var(--legacy-sidebar-border-rgb), 0.4) !important;
  }

  html.mobile-viewport [class~="border-primary/20"] {
    border-color: rgba(var(--legacy-primary-rgb), 0.2) !important;
  }

  html.mobile-viewport [class~="border-primary/30"] {
    border-color: rgba(var(--legacy-primary-rgb), 0.3) !important;
  }

  html.mobile-viewport [class~="border-primary/40"] {
    border-color: rgba(var(--legacy-primary-rgb), 0.4) !important;
  }

  html.mobile-viewport [class~="border-primary/60"] {
    border-color: rgba(var(--legacy-primary-rgb), 0.6) !important;
  }

  html.mobile-viewport [class~="border-success/20"] {
    border-color: rgba(var(--legacy-success-rgb), 0.2) !important;
  }

  html.mobile-viewport [class~="border-success/30"] {
    border-color: rgba(var(--legacy-success-rgb), 0.3) !important;
  }

  html.mobile-viewport [class~="border-warning/20"] {
    border-color: rgba(var(--legacy-warning-rgb), 0.2) !important;
  }

  html.mobile-viewport [class~="border-warning/25"] {
    border-color: rgba(var(--legacy-warning-rgb), 0.25) !important;
  }

  html.mobile-viewport [class~="border-warning/30"] {
    border-color: rgba(var(--legacy-warning-rgb), 0.3) !important;
  }

  html.mobile-viewport [class~="border-danger/20"] {
    border-color: rgba(var(--legacy-danger-rgb), 0.2) !important;
  }

  html.mobile-viewport [class~="border-danger/30"] {
    border-color: rgba(var(--legacy-danger-rgb), 0.3) !important;
  }

  html.mobile-viewport [class~="border-danger/40"] {
    border-color: rgba(var(--legacy-danger-rgb), 0.4) !important;
  }

  html.mobile-viewport [class~="border-danger/50"] {
    border-color: rgba(var(--legacy-danger-rgb), 0.5) !important;
  }

  html.mobile-viewport [class~="border-info/20"] {
    border-color: rgba(var(--legacy-info-rgb), 0.2) !important;
  }

  html.mobile-viewport [class~="border-info/30"] {
    border-color: rgba(var(--legacy-info-rgb), 0.3) !important;
  }

  html.mobile-viewport [class~="border-foreground/30"] {
    border-color: rgba(var(--legacy-foreground-rgb), 0.3) !important;
  }

  html.mobile-viewport [class~="border-sidebar-border/60"] {
    border-color: rgba(var(--legacy-sidebar-border-rgb), 0.6) !important;
  }

  html.mobile-viewport [class~="border-sidebar-border/65"] {
    border-color: rgba(var(--legacy-sidebar-border-rgb), 0.65) !important;
  }

  html.mobile-viewport [class~="text-danger/90"] {
    color: rgba(var(--legacy-danger-rgb), 0.9) !important;
  }

  html.mobile-viewport [class~="text-info/80"] {
    color: rgba(var(--legacy-info-rgb), 0.8) !important;
  }

  html.mobile-viewport [class~="text-warning/80"] {
    color: rgba(var(--legacy-warning-rgb), 0.8) !important;
  }

  html.mobile-viewport [class~="text-warning/90"] {
    color: rgba(var(--legacy-warning-rgb), 0.9) !important;
  }

  html.mobile-viewport [class~="text-foreground/60"] {
    color: rgba(var(--legacy-foreground-rgb), 0.6) !important;
  }

  html.mobile-viewport [class~="text-foreground/90"] {
    color: rgba(var(--legacy-foreground-rgb), 0.9) !important;
  }

  html.mobile-viewport [class~="text-sidebar-foreground/40"] {
    color: rgba(var(--legacy-sidebar-foreground-rgb), 0.4) !important;
  }

  html.mobile-viewport [class~="text-sidebar-foreground/50"] {
    color: rgba(var(--legacy-sidebar-foreground-rgb), 0.5) !important;
  }

  html.mobile-viewport [class~="text-sidebar-foreground/70"] {
    color: rgba(var(--legacy-sidebar-foreground-rgb), 0.7) !important;
  }

  html.mobile-viewport [class~="ring-foreground/10"] {
    --tw-ring-color: rgba(var(--legacy-foreground-rgb), 0.1) !important;
  }

  html.mobile-viewport [class~="hover:bg-primary/80"]:hover {
    background-color: rgba(var(--legacy-primary-rgb), 0.8) !important;
  }

  html.mobile-viewport [class~="hover:bg-success/10"]:hover {
    background-color: rgba(var(--legacy-success-rgb), 0.1) !important;
  }

  html.mobile-viewport [class~="hover:bg-warning/10"]:hover {
    background-color: rgba(var(--legacy-warning-rgb), 0.1) !important;
  }

  html.mobile-viewport [class~="hover:bg-danger/10"]:hover {
    background-color: rgba(var(--legacy-danger-rgb), 0.1) !important;
  }

  html.mobile-viewport [class~="hover:bg-danger/20"]:hover {
    background-color: rgba(var(--legacy-danger-rgb), 0.2) !important;
  }

  html.mobile-viewport [class~="hover:bg-muted/50"]:hover {
    background-color: rgba(var(--legacy-muted-rgb), 0.5) !important;
  }
}