/* ============================================================================
   Svetlý vzhľad — farby a štýl ISPadminu (#81 čitateľnosť na slnku, #82 vzhľad).

   PREČO PREKRÝVANIE, A NIE PREPÍSANÉ ŠABLÓNY: appka má tmavé triedy (bg-slate-900,
   text-slate-400, bg-white/10…) v ~60 súboroch na tisícoch miest. Prepisovať ich ručne
   by bolo dlhé a krehké. Tu sa tie isté triedy pod `html.svetlo` len premapujú na svetlú
   paletu — vyššia špecifickosť (html.svetlo .trieda) prebije Tailwind, ktorý sa generuje
   v prehliadači až za behu.

   Poradie v súbore: podklad → plochy → rámiky → text → farebný text → výnimky
   (tmavá lišta, farebné tlačidlá). Kto pridá novú tmavú triedu do šablóny, dopíše ju sem.
   ============================================================================ */
/* podklad aj v safe-area pásoch */
html.svetlo{background:#eef1f5;}
html.svetlo body{background:#eef1f5;color:#16212e;}
html.svetlo ::selection{background:rgba(15,107,176,.18);}
html.svetlo #nacitavanie .kryt{background:rgba(15,23,42,.28);}
html.svetlo #nacitavanie .kruh{border-color:rgba(15,107,176,.2);border-top-color:#0f6bb0;}
html.svetlo ::-webkit-scrollbar-thumb{background:#c7d0da;}
html.svetlo .card{background:#fff;border:1px solid #dde3ea;box-shadow:0 1px 2px rgba(16,24,40,.05);}
html.svetlo .card-hover:hover{border-color:#9ec5e8;box-shadow:0 10px 24px -14px rgba(15,23,42,.35);}
/* horná lišta a spodné menu — navy ako ISPadmin */
/* logo a všetko bez vlastnej farby v lište dedí bielu, nie tmavú z tela */
html.svetlo .glass{background:#24374a;color:#e8eef5;}
html.svetlo .prod-img{background:#fff;}
html.svetlo .bg-slate-900, html.svetlo .bg-slate-900\/80, html.svetlo .bg-slate-900\/70, html.svetlo .bg-slate-900\/60, html.svetlo .bg-slate-900\/50, html.svetlo .bg-slate-900\/40, html.svetlo .bg-slate-900\/30, html.svetlo .hover\:bg-slate-900:hover, html.svetlo .hover\:bg-slate-900\/80:hover, html.svetlo .hover\:bg-slate-900\/70:hover, html.svetlo .hover\:bg-slate-900\/60:hover, html.svetlo .hover\:bg-slate-900\/50:hover, html.svetlo .hover\:bg-slate-900\/40:hover, html.svetlo .hover\:bg-slate-900\/30:hover, html.svetlo .active\:bg-slate-900:active, html.svetlo .active\:bg-slate-900\/80:active, html.svetlo .active\:bg-slate-900\/70:active, html.svetlo .active\:bg-slate-900\/60:active, html.svetlo .active\:bg-slate-900\/50:active, html.svetlo .active\:bg-slate-900\/40:active, html.svetlo .active\:bg-slate-900\/30:active{background-color:#ffffff;}
html.svetlo .bg-slate-800, html.svetlo .bg-slate-800\/50, html.svetlo .bg-slate-800\/60, html.svetlo .bg-slate-800\/70, html.svetlo .hover\:bg-slate-800:hover, html.svetlo .hover\:bg-slate-800\/50:hover, html.svetlo .hover\:bg-slate-800\/60:hover, html.svetlo .hover\:bg-slate-800\/70:hover, html.svetlo .active\:bg-slate-800:active, html.svetlo .active\:bg-slate-800\/50:active, html.svetlo .active\:bg-slate-800\/60:active, html.svetlo .active\:bg-slate-800\/70:active{background-color:#f1f4f8;}
html.svetlo .bg-slate-700, html.svetlo .bg-slate-700\/50, html.svetlo .hover\:bg-slate-700:hover, html.svetlo .hover\:bg-slate-700\/50:hover, html.svetlo .active\:bg-slate-700:active, html.svetlo .active\:bg-slate-700\/50:active{background-color:#e8edf3;}
html.svetlo .bg-slate-600, html.svetlo .bg-slate-600\/80, html.svetlo .bg-slate-600\/40, html.svetlo .bg-slate-600\/30, html.svetlo .bg-slate-600\/20, html.svetlo .hover\:bg-slate-600:hover, html.svetlo .hover\:bg-slate-600\/80:hover, html.svetlo .hover\:bg-slate-600\/40:hover, html.svetlo .hover\:bg-slate-600\/30:hover, html.svetlo .hover\:bg-slate-600\/20:hover, html.svetlo .active\:bg-slate-600:active, html.svetlo .active\:bg-slate-600\/80:active, html.svetlo .active\:bg-slate-600\/40:active, html.svetlo .active\:bg-slate-600\/30:active, html.svetlo .active\:bg-slate-600\/20:active{background-color:#e2e8f0;}
html.svetlo .bg-white\/5, html.svetlo .hover\:bg-white\/5:hover, html.svetlo .active\:bg-white\/5:active{background-color:#f4f6f9;}
html.svetlo .bg-white\/10, html.svetlo .bg-white\/12, html.svetlo .hover\:bg-white\/10:hover, html.svetlo .hover\:bg-white\/12:hover, html.svetlo .active\:bg-white\/10:active, html.svetlo .active\:bg-white\/12:active{background-color:#e9edf2;}
html.svetlo .bg-white\/15, html.svetlo .hover\:bg-white\/15:hover, html.svetlo .active\:bg-white\/15:active{background-color:#dfe5ec;}
html.svetlo .bg-white\/20, html.svetlo .hover\:bg-white\/20:hover, html.svetlo .active\:bg-white\/20:active{background-color:#d7dee7;}
/* prekrytie pod dialógmi */
html.svetlo .bg-black\/80, html.svetlo .bg-black\/75, html.svetlo .bg-black\/70, html.svetlo .bg-black\/60, html.svetlo .bg-black\/55, html.svetlo .bg-black\/50, html.svetlo .bg-black\/40{background-color:rgba(15,23,42,.5);}
html.svetlo .border-white\/5, html.svetlo .border-white\/10, html.svetlo .border-white\/15, html.svetlo .border-white\/20{border-color:#e3e8ee;}
html.svetlo .ring-white\/5, html.svetlo .ring-white\/10, html.svetlo .ring-white\/20{--tw-ring-color:#dde3ea;}
html.svetlo .divide-white\/5 > :not([hidden]) ~ :not([hidden]), html.svetlo .divide-white\/10 > :not([hidden]) ~ :not([hidden]){border-color:#eaeef3;}
html.svetlo .text-slate-600{color:#93a0ad;}
html.svetlo .text-slate-500{color:#6b7784;}
html.svetlo .text-slate-400{color:#55626f;}
html.svetlo .text-slate-300{color:#3a4653;}
html.svetlo .text-slate-200, html.svetlo .text-slate-100, html.svetlo .text-white{color:#16212e;}
html.svetlo .hover\:text-white:hover, html.svetlo .hover\:text-slate-200:hover{color:#0b1220;}
html.svetlo .text-white\/70{color:#46535f;}
html.svetlo [class*="text-emerald-1"], html.svetlo [class*="text-emerald-2"], html.svetlo [class*="text-emerald-3"], html.svetlo [class*="text-emerald-4"]{color:#12794d;}
html.svetlo [class*="text-green-1"], html.svetlo [class*="text-green-2"], html.svetlo [class*="text-green-3"], html.svetlo [class*="text-green-4"]{color:#12794d;}
html.svetlo [class*="text-lime-1"], html.svetlo [class*="text-lime-2"], html.svetlo [class*="text-lime-3"], html.svetlo [class*="text-lime-4"]{color:#4d7c0f;}
html.svetlo [class*="text-teal-1"], html.svetlo [class*="text-teal-2"], html.svetlo [class*="text-teal-3"], html.svetlo [class*="text-teal-4"]{color:#0f766e;}
html.svetlo [class*="text-sky-1"], html.svetlo [class*="text-sky-2"], html.svetlo [class*="text-sky-3"], html.svetlo [class*="text-sky-4"]{color:#0f6bb0;}
html.svetlo [class*="text-blue-1"], html.svetlo [class*="text-blue-2"], html.svetlo [class*="text-blue-3"], html.svetlo [class*="text-blue-4"]{color:#0f5fb8;}
html.svetlo [class*="text-cyan-1"], html.svetlo [class*="text-cyan-2"], html.svetlo [class*="text-cyan-3"], html.svetlo [class*="text-cyan-4"]{color:#0e7490;}
html.svetlo [class*="text-indigo-1"], html.svetlo [class*="text-indigo-2"], html.svetlo [class*="text-indigo-3"], html.svetlo [class*="text-indigo-4"]{color:#4338ca;}
html.svetlo [class*="text-rose-1"], html.svetlo [class*="text-rose-2"], html.svetlo [class*="text-rose-3"], html.svetlo [class*="text-rose-4"]{color:#c02434;}
html.svetlo [class*="text-red-1"], html.svetlo [class*="text-red-2"], html.svetlo [class*="text-red-3"], html.svetlo [class*="text-red-4"]{color:#c02434;}
html.svetlo [class*="text-pink-1"], html.svetlo [class*="text-pink-2"], html.svetlo [class*="text-pink-3"], html.svetlo [class*="text-pink-4"]{color:#be185d;}
html.svetlo [class*="text-amber-1"], html.svetlo [class*="text-amber-2"], html.svetlo [class*="text-amber-3"], html.svetlo [class*="text-amber-4"]{color:#96620a;}
html.svetlo [class*="text-yellow-1"], html.svetlo [class*="text-yellow-2"], html.svetlo [class*="text-yellow-3"], html.svetlo [class*="text-yellow-4"]{color:#8a6100;}
html.svetlo [class*="text-orange-1"], html.svetlo [class*="text-orange-2"], html.svetlo [class*="text-orange-3"], html.svetlo [class*="text-orange-4"]{color:#9a4d0a;}
html.svetlo [class*="text-violet-1"], html.svetlo [class*="text-violet-2"], html.svetlo [class*="text-violet-3"], html.svetlo [class*="text-violet-4"]{color:#6941c6;}
html.svetlo [class*="text-purple-1"], html.svetlo [class*="text-purple-2"], html.svetlo [class*="text-purple-3"], html.svetlo [class*="text-purple-4"]{color:#6b21a8;}
html.svetlo [class*="text-fuchsia-1"], html.svetlo [class*="text-fuchsia-2"], html.svetlo [class*="text-fuchsia-3"], html.svetlo [class*="text-fuchsia-4"]{color:#a21caf;}

/* ---------- výnimky: biely text ostáva biely tam, kde je pod ním farba ---------- */
html.svetlo .bg-sky-400.text-white, html.svetlo .bg-sky-400 .text-white, html.svetlo .bg-sky-400\/80.text-white, html.svetlo .bg-sky-400\/80 .text-white, html.svetlo .bg-sky-400\/90.text-white, html.svetlo .bg-sky-400\/90 .text-white, html.svetlo .bg-sky-500.text-white, html.svetlo .bg-sky-500 .text-white, html.svetlo .bg-sky-500\/80.text-white, html.svetlo .bg-sky-500\/80 .text-white, html.svetlo .bg-sky-500\/90.text-white, html.svetlo .bg-sky-500\/90 .text-white, html.svetlo .bg-sky-600.text-white, html.svetlo .bg-sky-600 .text-white, html.svetlo .bg-sky-600\/80.text-white, html.svetlo .bg-sky-600\/80 .text-white, html.svetlo .bg-sky-600\/90.text-white, html.svetlo .bg-sky-600\/90 .text-white, html.svetlo .bg-sky-700.text-white, html.svetlo .bg-sky-700 .text-white, html.svetlo .bg-sky-700\/80.text-white, html.svetlo .bg-sky-700\/80 .text-white, html.svetlo .bg-sky-700\/90.text-white, html.svetlo .bg-sky-700\/90 .text-white, html.svetlo .bg-emerald-400.text-white, html.svetlo .bg-emerald-400 .text-white, html.svetlo .bg-emerald-400\/80.text-white, html.svetlo .bg-emerald-400\/80 .text-white, html.svetlo .bg-emerald-400\/90.text-white, html.svetlo .bg-emerald-400\/90 .text-white, html.svetlo .bg-emerald-500.text-white, html.svetlo .bg-emerald-500 .text-white, html.svetlo .bg-emerald-500\/80.text-white, html.svetlo .bg-emerald-500\/80 .text-white, html.svetlo .bg-emerald-500\/90.text-white, html.svetlo .bg-emerald-500\/90 .text-white, html.svetlo .bg-emerald-600.text-white, html.svetlo .bg-emerald-600 .text-white, html.svetlo .bg-emerald-600\/80.text-white, html.svetlo .bg-emerald-600\/80 .text-white, html.svetlo .bg-emerald-600\/90.text-white, html.svetlo .bg-emerald-600\/90 .text-white, html.svetlo .bg-emerald-700.text-white, html.svetlo .bg-emerald-700 .text-white, html.svetlo .bg-emerald-700\/80.text-white, html.svetlo .bg-emerald-700\/80 .text-white, html.svetlo .bg-emerald-700\/90.text-white, html.svetlo .bg-emerald-700\/90 .text-white, html.svetlo .bg-violet-400.text-white, html.svetlo .bg-violet-400 .text-white, html.svetlo .bg-violet-400\/80.text-white, html.svetlo .bg-violet-400\/80 .text-white, html.svetlo .bg-violet-400\/90.text-white, html.svetlo .bg-violet-400\/90 .text-white, html.svetlo .bg-violet-500.text-white, html.svetlo .bg-violet-500 .text-white, html.svetlo .bg-violet-500\/80.text-white, html.svetlo .bg-violet-500\/80 .text-white, html.svetlo .bg-violet-500\/90.text-white, html.svetlo .bg-violet-500\/90 .text-white, html.svetlo .bg-violet-600.text-white, html.svetlo .bg-violet-600 .text-white, html.svetlo .bg-violet-600\/80.text-white, html.svetlo .bg-violet-600\/80 .text-white, html.svetlo .bg-violet-600\/90.text-white, html.svetlo .bg-violet-600\/90 .text-white, html.svetlo .bg-violet-700.text-white, html.svetlo .bg-violet-700 .text-white, html.svetlo .bg-violet-700\/80.text-white, html.svetlo .bg-violet-700\/80 .text-white, html.svetlo .bg-violet-700\/90.text-white, html.svetlo .bg-violet-700\/90 .text-white, html.svetlo .bg-amber-400.text-white, html.svetlo .bg-amber-400 .text-white, html.svetlo .bg-amber-400\/80.text-white, html.svetlo .bg-amber-400\/80 .text-white, html.svetlo .bg-amber-400\/90.text-white, html.svetlo .bg-amber-400\/90 .text-white, html.svetlo .bg-amber-500.text-white, html.svetlo .bg-amber-500 .text-white, html.svetlo .bg-amber-500\/80.text-white, html.svetlo .bg-amber-500\/80 .text-white, html.svetlo .bg-amber-500\/90.text-white, html.svetlo .bg-amber-500\/90 .text-white, html.svetlo .bg-amber-600.text-white, html.svetlo .bg-amber-600 .text-white, html.svetlo .bg-amber-600\/80.text-white, html.svetlo .bg-amber-600\/80 .text-white, html.svetlo .bg-amber-600\/90.text-white, html.svetlo .bg-amber-600\/90 .text-white, html.svetlo .bg-amber-700.text-white, html.svetlo .bg-amber-700 .text-white, html.svetlo .bg-amber-700\/80.text-white, html.svetlo .bg-amber-700\/80 .text-white, html.svetlo .bg-amber-700\/90.text-white, html.svetlo .bg-amber-700\/90 .text-white, html.svetlo .bg-rose-400.text-white, html.svetlo .bg-rose-400 .text-white, html.svetlo .bg-rose-400\/80.text-white, html.svetlo .bg-rose-400\/80 .text-white, html.svetlo .bg-rose-400\/90.text-white, html.svetlo .bg-rose-400\/90 .text-white, html.svetlo .bg-rose-500.text-white, html.svetlo .bg-rose-500 .text-white, html.svetlo .bg-rose-500\/80.text-white, html.svetlo .bg-rose-500\/80 .text-white, html.svetlo .bg-rose-500\/90.text-white, html.svetlo .bg-rose-500\/90 .text-white, html.svetlo .bg-rose-600.text-white, html.svetlo .bg-rose-600 .text-white, html.svetlo .bg-rose-600\/80.text-white, html.svetlo .bg-rose-600\/80 .text-white, html.svetlo .bg-rose-600\/90.text-white, html.svetlo .bg-rose-600\/90 .text-white, html.svetlo .bg-rose-700.text-white, html.svetlo .bg-rose-700 .text-white, html.svetlo .bg-rose-700\/80.text-white, html.svetlo .bg-rose-700\/80 .text-white, html.svetlo .bg-rose-700\/90.text-white, html.svetlo .bg-rose-700\/90 .text-white, html.svetlo .bg-red-400.text-white, html.svetlo .bg-red-400 .text-white, html.svetlo .bg-red-400\/80.text-white, html.svetlo .bg-red-400\/80 .text-white, html.svetlo .bg-red-400\/90.text-white, html.svetlo .bg-red-400\/90 .text-white, html.svetlo .bg-red-500.text-white, html.svetlo .bg-red-500 .text-white, html.svetlo .bg-red-500\/80.text-white, html.svetlo .bg-red-500\/80 .text-white, html.svetlo .bg-red-500\/90.text-white, html.svetlo .bg-red-500\/90 .text-white, html.svetlo .bg-red-600.text-white, html.svetlo .bg-red-600 .text-white, html.svetlo .bg-red-600\/80.text-white, html.svetlo .bg-red-600\/80 .text-white, html.svetlo .bg-red-600\/90.text-white, html.svetlo .bg-red-600\/90 .text-white, html.svetlo .bg-red-700.text-white, html.svetlo .bg-red-700 .text-white, html.svetlo .bg-red-700\/80.text-white, html.svetlo .bg-red-700\/80 .text-white, html.svetlo .bg-red-700\/90.text-white, html.svetlo .bg-red-700\/90 .text-white, html.svetlo .bg-blue-400.text-white, html.svetlo .bg-blue-400 .text-white, html.svetlo .bg-blue-400\/80.text-white, html.svetlo .bg-blue-400\/80 .text-white, html.svetlo .bg-blue-400\/90.text-white, html.svetlo .bg-blue-400\/90 .text-white, html.svetlo .bg-blue-500.text-white, html.svetlo .bg-blue-500 .text-white, html.svetlo .bg-blue-500\/80.text-white, html.svetlo .bg-blue-500\/80 .text-white, html.svetlo .bg-blue-500\/90.text-white, html.svetlo .bg-blue-500\/90 .text-white, html.svetlo .bg-blue-600.text-white, html.svetlo .bg-blue-600 .text-white, html.svetlo .bg-blue-600\/80.text-white, html.svetlo .bg-blue-600\/80 .text-white, html.svetlo .bg-blue-600\/90.text-white, html.svetlo .bg-blue-600\/90 .text-white, html.svetlo .bg-blue-700.text-white, html.svetlo .bg-blue-700 .text-white, html.svetlo .bg-blue-700\/80.text-white, html.svetlo .bg-blue-700\/80 .text-white, html.svetlo .bg-blue-700\/90.text-white, html.svetlo .bg-blue-700\/90 .text-white, html.svetlo .bg-indigo-400.text-white, html.svetlo .bg-indigo-400 .text-white, html.svetlo .bg-indigo-400\/80.text-white, html.svetlo .bg-indigo-400\/80 .text-white, html.svetlo .bg-indigo-400\/90.text-white, html.svetlo .bg-indigo-400\/90 .text-white, html.svetlo .bg-indigo-500.text-white, html.svetlo .bg-indigo-500 .text-white, html.svetlo .bg-indigo-500\/80.text-white, html.svetlo .bg-indigo-500\/80 .text-white, html.svetlo .bg-indigo-500\/90.text-white, html.svetlo .bg-indigo-500\/90 .text-white, html.svetlo .bg-indigo-600.text-white, html.svetlo .bg-indigo-600 .text-white, html.svetlo .bg-indigo-600\/80.text-white, html.svetlo .bg-indigo-600\/80 .text-white, html.svetlo .bg-indigo-600\/90.text-white, html.svetlo .bg-indigo-600\/90 .text-white, html.svetlo .bg-indigo-700.text-white, html.svetlo .bg-indigo-700 .text-white, html.svetlo .bg-indigo-700\/80.text-white, html.svetlo .bg-indigo-700\/80 .text-white, html.svetlo .bg-indigo-700\/90.text-white, html.svetlo .bg-indigo-700\/90 .text-white, html.svetlo .bg-green-400.text-white, html.svetlo .bg-green-400 .text-white, html.svetlo .bg-green-400\/80.text-white, html.svetlo .bg-green-400\/80 .text-white, html.svetlo .bg-green-400\/90.text-white, html.svetlo .bg-green-400\/90 .text-white, html.svetlo .bg-green-500.text-white, html.svetlo .bg-green-500 .text-white, html.svetlo .bg-green-500\/80.text-white, html.svetlo .bg-green-500\/80 .text-white, html.svetlo .bg-green-500\/90.text-white, html.svetlo .bg-green-500\/90 .text-white, html.svetlo .bg-green-600.text-white, html.svetlo .bg-green-600 .text-white, html.svetlo .bg-green-600\/80.text-white, html.svetlo .bg-green-600\/80 .text-white, html.svetlo .bg-green-600\/90.text-white, html.svetlo .bg-green-600\/90 .text-white, html.svetlo .bg-green-700.text-white, html.svetlo .bg-green-700 .text-white, html.svetlo .bg-green-700\/80.text-white, html.svetlo .bg-green-700\/80 .text-white, html.svetlo .bg-green-700\/90.text-white, html.svetlo .bg-green-700\/90 .text-white, html.svetlo .bg-orange-400.text-white, html.svetlo .bg-orange-400 .text-white, html.svetlo .bg-orange-400\/80.text-white, html.svetlo .bg-orange-400\/80 .text-white, html.svetlo .bg-orange-400\/90.text-white, html.svetlo .bg-orange-400\/90 .text-white, html.svetlo .bg-orange-500.text-white, html.svetlo .bg-orange-500 .text-white, html.svetlo .bg-orange-500\/80.text-white, html.svetlo .bg-orange-500\/80 .text-white, html.svetlo .bg-orange-500\/90.text-white, html.svetlo .bg-orange-500\/90 .text-white, html.svetlo .bg-orange-600.text-white, html.svetlo .bg-orange-600 .text-white, html.svetlo .bg-orange-600\/80.text-white, html.svetlo .bg-orange-600\/80 .text-white, html.svetlo .bg-orange-600\/90.text-white, html.svetlo .bg-orange-600\/90 .text-white, html.svetlo .bg-orange-700.text-white, html.svetlo .bg-orange-700 .text-white, html.svetlo .bg-orange-700\/80.text-white, html.svetlo .bg-orange-700\/80 .text-white, html.svetlo .bg-orange-700\/90.text-white, html.svetlo .bg-orange-700\/90 .text-white, html.svetlo .bg-cyan-400.text-white, html.svetlo .bg-cyan-400 .text-white, html.svetlo .bg-cyan-400\/80.text-white, html.svetlo .bg-cyan-400\/80 .text-white, html.svetlo .bg-cyan-400\/90.text-white, html.svetlo .bg-cyan-400\/90 .text-white, html.svetlo .bg-cyan-500.text-white, html.svetlo .bg-cyan-500 .text-white, html.svetlo .bg-cyan-500\/80.text-white, html.svetlo .bg-cyan-500\/80 .text-white, html.svetlo .bg-cyan-500\/90.text-white, html.svetlo .bg-cyan-500\/90 .text-white, html.svetlo .bg-cyan-600.text-white, html.svetlo .bg-cyan-600 .text-white, html.svetlo .bg-cyan-600\/80.text-white, html.svetlo .bg-cyan-600\/80 .text-white, html.svetlo .bg-cyan-600\/90.text-white, html.svetlo .bg-cyan-600\/90 .text-white, html.svetlo .bg-cyan-700.text-white, html.svetlo .bg-cyan-700 .text-white, html.svetlo .bg-cyan-700\/80.text-white, html.svetlo .bg-cyan-700\/80 .text-white, html.svetlo .bg-cyan-700\/90.text-white, html.svetlo .bg-cyan-700\/90 .text-white, html.svetlo .bg-teal-400.text-white, html.svetlo .bg-teal-400 .text-white, html.svetlo .bg-teal-400\/80.text-white, html.svetlo .bg-teal-400\/80 .text-white, html.svetlo .bg-teal-400\/90.text-white, html.svetlo .bg-teal-400\/90 .text-white, html.svetlo .bg-teal-500.text-white, html.svetlo .bg-teal-500 .text-white, html.svetlo .bg-teal-500\/80.text-white, html.svetlo .bg-teal-500\/80 .text-white, html.svetlo .bg-teal-500\/90.text-white, html.svetlo .bg-teal-500\/90 .text-white, html.svetlo .bg-teal-600.text-white, html.svetlo .bg-teal-600 .text-white, html.svetlo .bg-teal-600\/80.text-white, html.svetlo .bg-teal-600\/80 .text-white, html.svetlo .bg-teal-600\/90.text-white, html.svetlo .bg-teal-600\/90 .text-white, html.svetlo .bg-teal-700.text-white, html.svetlo .bg-teal-700 .text-white, html.svetlo .bg-teal-700\/80.text-white, html.svetlo .bg-teal-700\/80 .text-white, html.svetlo .bg-teal-700\/90.text-white, html.svetlo .bg-teal-700\/90 .text-white, html.svetlo .btn-grad, html.svetlo .btn-grad .text-white, html.svetlo .bg-slate-700.text-white, html.svetlo .bg-slate-600.text-white{color:#fff;}
/* tmavé tlačidlá ostávajú tmavé */
html.svetlo .bg-slate-700.text-white, html.svetlo .bg-slate-600.text-white{background-color:#4b5b6b;}

/* ---------- tmavá lišta (hlavička a spodné menu) ---------- */
html.svetlo .glass .text-white, html.svetlo .glass .hover\:text-white:hover{color:#fff;}
html.svetlo .glass .text-slate-300{color:#d5dde6;}
html.svetlo .glass .text-slate-400{color:#a9b8c7;}
html.svetlo .glass .text-slate-500{color:#93a5b6;}
html.svetlo .glass .bg-white\/5, html.svetlo .glass .hover\:bg-white\/5:hover{background-color:rgba(255,255,255,.07);}
html.svetlo .glass .bg-white\/10, html.svetlo .glass .hover\:bg-white\/10:hover{background-color:rgba(255,255,255,.14);}
html.svetlo .glass .bg-white\/15, html.svetlo .glass .hover\:bg-white\/15:hover{background-color:rgba(255,255,255,.2);}
html.svetlo .glass .border-white\/5, html.svetlo .glass .border-white\/10{border-color:rgba(255,255,255,.12);}
html.svetlo .glass [class*="text-sky-3"], html.svetlo .glass [class*="text-sky-4"]{color:#7dd3fc;}
html.svetlo .glass [class*="text-emerald-3"]{color:#6ee7b7;}
html.svetlo .glass [class*="text-rose-3"]{color:#fda4af;}

/* ---------- panely, ktoré visia v tmavej lište (rolovacie menu) ---------- */
html.svetlo .panel-svetly{background:#fff;color:#16212e;}
html.svetlo .panel-svetly .text-slate-500{color:#6b7784;}
html.svetlo .panel-svetly .text-slate-400{color:#55626f;}
html.svetlo .panel-svetly .text-slate-300{color:#3a4653;}
html.svetlo .panel-svetly .text-white{color:#16212e;}
html.svetlo .panel-svetly .bg-white\/5, html.svetlo .panel-svetly .hover\:bg-white\/5:hover{background-color:#f4f6f9;}
html.svetlo .panel-svetly .bg-white\/10, html.svetlo .panel-svetly .hover\:bg-white\/10:hover{background-color:#e9edf2;}
html.svetlo .panel-svetly .border-white\/5{border-color:#e3e8ee;}
html.svetlo .panel-svetly [class*="text-sky-3"]{color:#0f6bb0;}
html.svetlo .panel-svetly [class*="text-rose-3"]{color:#c02434;}

/* ---------- polia a tlačidlá ---------- */
html.svetlo input, html.svetlo textarea, html.svetlo select{color:#16212e;}
html.svetlo input::placeholder, html.svetlo textarea::placeholder{color:#94a3b8;}
html.svetlo .btn-grad{background-image:linear-gradient(135deg,#1f6fd0,#0891b2);}
html.svetlo option{background:#fff;color:#16212e;}

/* ---------- žltá je na bielom slabá: tlačidlá s bielym textom stmavíme ---------- */
html.svetlo .bg-amber-500.text-white, html.svetlo .bg-amber-400.text-white,
html.svetlo .hover\:bg-amber-400:hover.text-white{background-color:#c2740a;}
html.svetlo .bg-amber-500.text-white:hover, html.svetlo .bg-amber-400.text-white:hover{background-color:#a86209;}

/* ---------- text vnútri farebných plôch (bubliny v chate, tlačidlá s popiskom) ----------
   Na farbe musí ostať svetlý — inak by sa tmavé odtiene z pravidiel vyššie stratili
   v modrej bubline. Ide to naspodok súboru, aby prebilo predchádzajúce pravidlá. */
html.svetlo .bg-sky-400 [class*="text-"],
html.svetlo .bg-sky-400\/80 [class*="text-"],
html.svetlo .bg-sky-400\/90 [class*="text-"],
html.svetlo .bg-sky-500 [class*="text-"],
html.svetlo .bg-sky-500\/80 [class*="text-"],
html.svetlo .bg-sky-500\/90 [class*="text-"],
html.svetlo .bg-sky-600 [class*="text-"],
html.svetlo .bg-sky-600\/80 [class*="text-"],
html.svetlo .bg-sky-600\/90 [class*="text-"],
html.svetlo .bg-sky-700 [class*="text-"],
html.svetlo .bg-sky-700\/80 [class*="text-"],
html.svetlo .bg-sky-700\/90 [class*="text-"],
html.svetlo .bg-emerald-400 [class*="text-"],
html.svetlo .bg-emerald-400\/80 [class*="text-"],
html.svetlo .bg-emerald-400\/90 [class*="text-"],
html.svetlo .bg-emerald-500 [class*="text-"],
html.svetlo .bg-emerald-500\/80 [class*="text-"],
html.svetlo .bg-emerald-500\/90 [class*="text-"],
html.svetlo .bg-emerald-600 [class*="text-"],
html.svetlo .bg-emerald-600\/80 [class*="text-"],
html.svetlo .bg-emerald-600\/90 [class*="text-"],
html.svetlo .bg-emerald-700 [class*="text-"],
html.svetlo .bg-emerald-700\/80 [class*="text-"],
html.svetlo .bg-emerald-700\/90 [class*="text-"],
html.svetlo .bg-violet-400 [class*="text-"],
html.svetlo .bg-violet-400\/80 [class*="text-"],
html.svetlo .bg-violet-400\/90 [class*="text-"],
html.svetlo .bg-violet-500 [class*="text-"],
html.svetlo .bg-violet-500\/80 [class*="text-"],
html.svetlo .bg-violet-500\/90 [class*="text-"],
html.svetlo .bg-violet-600 [class*="text-"],
html.svetlo .bg-violet-600\/80 [class*="text-"],
html.svetlo .bg-violet-600\/90 [class*="text-"],
html.svetlo .bg-violet-700 [class*="text-"],
html.svetlo .bg-violet-700\/80 [class*="text-"],
html.svetlo .bg-violet-700\/90 [class*="text-"],
html.svetlo .bg-amber-400 [class*="text-"],
html.svetlo .bg-amber-400\/80 [class*="text-"],
html.svetlo .bg-amber-400\/90 [class*="text-"],
html.svetlo .bg-amber-500 [class*="text-"],
html.svetlo .bg-amber-500\/80 [class*="text-"],
html.svetlo .bg-amber-500\/90 [class*="text-"],
html.svetlo .bg-amber-600 [class*="text-"],
html.svetlo .bg-amber-600\/80 [class*="text-"],
html.svetlo .bg-amber-600\/90 [class*="text-"],
html.svetlo .bg-amber-700 [class*="text-"],
html.svetlo .bg-amber-700\/80 [class*="text-"],
html.svetlo .bg-amber-700\/90 [class*="text-"],
html.svetlo .bg-rose-400 [class*="text-"],
html.svetlo .bg-rose-400\/80 [class*="text-"],
html.svetlo .bg-rose-400\/90 [class*="text-"],
html.svetlo .bg-rose-500 [class*="text-"],
html.svetlo .bg-rose-500\/80 [class*="text-"],
html.svetlo .bg-rose-500\/90 [class*="text-"],
html.svetlo .bg-rose-600 [class*="text-"],
html.svetlo .bg-rose-600\/80 [class*="text-"],
html.svetlo .bg-rose-600\/90 [class*="text-"],
html.svetlo .bg-rose-700 [class*="text-"],
html.svetlo .bg-rose-700\/80 [class*="text-"],
html.svetlo .bg-rose-700\/90 [class*="text-"],
html.svetlo .bg-red-400 [class*="text-"],
html.svetlo .bg-red-400\/80 [class*="text-"],
html.svetlo .bg-red-400\/90 [class*="text-"],
html.svetlo .bg-red-500 [class*="text-"],
html.svetlo .bg-red-500\/80 [class*="text-"],
html.svetlo .bg-red-500\/90 [class*="text-"],
html.svetlo .bg-red-600 [class*="text-"],
html.svetlo .bg-red-600\/80 [class*="text-"],
html.svetlo .bg-red-600\/90 [class*="text-"],
html.svetlo .bg-red-700 [class*="text-"],
html.svetlo .bg-red-700\/80 [class*="text-"],
html.svetlo .bg-red-700\/90 [class*="text-"],
html.svetlo .bg-blue-400 [class*="text-"],
html.svetlo .bg-blue-400\/80 [class*="text-"],
html.svetlo .bg-blue-400\/90 [class*="text-"],
html.svetlo .bg-blue-500 [class*="text-"],
html.svetlo .bg-blue-500\/80 [class*="text-"],
html.svetlo .bg-blue-500\/90 [class*="text-"],
html.svetlo .bg-blue-600 [class*="text-"],
html.svetlo .bg-blue-600\/80 [class*="text-"],
html.svetlo .bg-blue-600\/90 [class*="text-"],
html.svetlo .bg-blue-700 [class*="text-"],
html.svetlo .bg-blue-700\/80 [class*="text-"],
html.svetlo .bg-blue-700\/90 [class*="text-"],
html.svetlo .bg-indigo-400 [class*="text-"],
html.svetlo .bg-indigo-400\/80 [class*="text-"],
html.svetlo .bg-indigo-400\/90 [class*="text-"],
html.svetlo .bg-indigo-500 [class*="text-"],
html.svetlo .bg-indigo-500\/80 [class*="text-"],
html.svetlo .bg-indigo-500\/90 [class*="text-"],
html.svetlo .bg-indigo-600 [class*="text-"],
html.svetlo .bg-indigo-600\/80 [class*="text-"],
html.svetlo .bg-indigo-600\/90 [class*="text-"],
html.svetlo .bg-indigo-700 [class*="text-"],
html.svetlo .bg-indigo-700\/80 [class*="text-"],
html.svetlo .bg-indigo-700\/90 [class*="text-"],
html.svetlo .bg-green-400 [class*="text-"],
html.svetlo .bg-green-400\/80 [class*="text-"],
html.svetlo .bg-green-400\/90 [class*="text-"],
html.svetlo .bg-green-500 [class*="text-"],
html.svetlo .bg-green-500\/80 [class*="text-"],
html.svetlo .bg-green-500\/90 [class*="text-"],
html.svetlo .bg-green-600 [class*="text-"],
html.svetlo .bg-green-600\/80 [class*="text-"],
html.svetlo .bg-green-600\/90 [class*="text-"],
html.svetlo .bg-green-700 [class*="text-"],
html.svetlo .bg-green-700\/80 [class*="text-"],
html.svetlo .bg-green-700\/90 [class*="text-"],
html.svetlo .bg-orange-400 [class*="text-"],
html.svetlo .bg-orange-400\/80 [class*="text-"],
html.svetlo .bg-orange-400\/90 [class*="text-"],
html.svetlo .bg-orange-500 [class*="text-"],
html.svetlo .bg-orange-500\/80 [class*="text-"],
html.svetlo .bg-orange-500\/90 [class*="text-"],
html.svetlo .bg-orange-600 [class*="text-"],
html.svetlo .bg-orange-600\/80 [class*="text-"],
html.svetlo .bg-orange-600\/90 [class*="text-"],
html.svetlo .bg-orange-700 [class*="text-"],
html.svetlo .bg-orange-700\/80 [class*="text-"],
html.svetlo .bg-orange-700\/90 [class*="text-"],
html.svetlo .bg-cyan-400 [class*="text-"],
html.svetlo .bg-cyan-400\/80 [class*="text-"],
html.svetlo .bg-cyan-400\/90 [class*="text-"],
html.svetlo .bg-cyan-500 [class*="text-"],
html.svetlo .bg-cyan-500\/80 [class*="text-"],
html.svetlo .bg-cyan-500\/90 [class*="text-"],
html.svetlo .bg-cyan-600 [class*="text-"],
html.svetlo .bg-cyan-600\/80 [class*="text-"],
html.svetlo .bg-cyan-600\/90 [class*="text-"],
html.svetlo .bg-cyan-700 [class*="text-"],
html.svetlo .bg-cyan-700\/80 [class*="text-"],
html.svetlo .bg-cyan-700\/90 [class*="text-"],
html.svetlo .bg-teal-400 [class*="text-"],
html.svetlo .bg-teal-400\/80 [class*="text-"],
html.svetlo .bg-teal-400\/90 [class*="text-"],
html.svetlo .bg-teal-500 [class*="text-"],
html.svetlo .bg-teal-500\/80 [class*="text-"],
html.svetlo .bg-teal-500\/90 [class*="text-"],
html.svetlo .bg-teal-600 [class*="text-"],
html.svetlo .bg-teal-600\/80 [class*="text-"],
html.svetlo .bg-teal-600\/90 [class*="text-"],
html.svetlo .bg-teal-700 [class*="text-"],
html.svetlo .bg-teal-700\/80 [class*="text-"],
html.svetlo .bg-teal-700\/90 [class*="text-"],
html.svetlo .bg-slate-600 [class*="text-"],
html.svetlo .bg-slate-700 [class*="text-"],
html.svetlo .btn-grad [class*="text-"]{color:rgba(255,255,255,.88);}

/* štítok typu úlohy „čierna" (predaj/výdaj) musí ostať tmavý aj v svetlom vzhľade */
html.svetlo .bg-slate-700.text-white{background-color:#334155;color:#fff;}

/* ---------- chat: pripnuté karty (zákazník, úloha, tovar) a lišta úloh (#87, #88) ----------
   V room.php majú vlastné tmavé farby (nepriehľadné, aby cez ne nepresvitala konverzácia);
   v svetlom vzhľade musia byť svetlé, inak je karta čierna s čiernym textom. */
html.svetlo .chat-ref{background:#e3ecf6;color:#16212e;}
html.svetlo .chat-ref .opacity-60, html.svetlo .chat-ref .opacity-70{color:#16212e;}
html.svetlo .chat-ref-akcia{background:#c8d8ea;color:#16212e;}
html.svetlo .chat-ref-akcia:hover{background:#b6cbe2;}
html.svetlo .chat-ref .bg-sky-500\/20{background-color:rgba(15,107,176,.16);}
html.svetlo .chat-ref [class*="text-sky-2"]{color:#0f6bb0;}
/* v mojej (modrej) bubline ostáva karta tmavomodrá s bielym textom */
html.svetlo .chat-ref-moja, html.svetlo .chat-ref-moja *{color:#fff;}
html.svetlo .chat-ref-moja{background:#0f4a78;}
html.svetlo .chat-ref-moja .chat-ref-akcia{background:rgba(255,255,255,.18);color:#fff;}
html.svetlo .chat-ulohy{background:#fff4dc;}
/* skener: poznamka "da sa pridat len pri Vyfakturovat" - jantarova na bielom je necitatelna */
html.svetlo .pozn-len-fakt{color:#b45309;}
html.svetlo .dropdown-solid{background:#fff !important;}
