/*
 * Fallbacks for browsers without color-mix() support (Safari < 16.2, iOS < 16.2).
 * This file is in public/ so it's served as-is, bypassing Tailwind/Lightning CSS.
 * Tailwind 4 uses color-mix(in oklab, ...) for opacity modifiers — on older
 * browsers these silently fail, making elements transparent.
 */
@supports not (background: color-mix(in oklab, red, red)) {
  .bg-dark-blue\/20 { background-color: rgba(10, 104, 180, 0.2) !important; }
  .bg-dark-blue\/10 { background-color: rgba(10, 104, 180, 0.1) !important; }
  .bg-cyan\/10 { background-color: rgba(131, 209, 242, 0.1) !important; }
  .bg-seafoam\/10 { background-color: rgba(86, 216, 141, 0.1) !important; }
  .bg-near-black\/95 { background-color: rgba(11, 17, 32, 0.95) !important; }
  .bg-near-black\/60 { background-color: rgba(11, 17, 32, 0.6) !important; }
  .border-white\/10 { border-color: rgba(255, 255, 255, 0.1) !important; }
  .border-white\/20 { border-color: rgba(255, 255, 255, 0.2) !important; }
  .border-gray-200 { border-color: #E5E7EB !important; }
  .text-white\/80 { color: rgba(255, 255, 255, 0.8) !important; }
  .text-white\/70 { color: rgba(255, 255, 255, 0.7) !important; }
  .text-white\/60 { color: rgba(255, 255, 255, 0.6) !important; }
  .text-white\/55 { color: rgba(255, 255, 255, 0.55) !important; }
  .text-white\/50 { color: rgba(255, 255, 255, 0.5) !important; }
  .text-gray-400 { color: #9CA3AF !important; }
  .text-gray-500 { color: #6B7280 !important; }
  .text-gray-600 { color: #4B5563 !important; }
}