/* ─── WŁASNE KLASY SZUFLADY (nie kolidują z Tailwindem) ────── */ .ks-drawer { background-color: #ffffff; } .ks-drawer-header { background-color: #f9fafb; } html.dark .ks-drawer { background-color: #1e293b !important; color: #e2e8f0 !important; } html.dark .ks-drawer-header { background-color: #0f172a !important; border-color: #334155 !important; } /* Wpisy powiadomień — dynamicznie generowane przez JS */ html.dark #lista-powiadomien > div { background-color: #1e293b !important; border-color: #334155 !important; } html.dark #lista-powiadomien > div.bg-blue-50 { background-color: #0f172a !important; } html.dark #lista-powiadomien > div:hover { background-color: #0f172a !important; } html.dark #lista-powiadomien p, html.dark #lista-powiadomien span.text-gray-800, html.dark #lista-powiadomien span.text-sm, html.dark #lista-powiadomien span.text-gray-500, html.dark #lista-powiadomien span.text-gray-400 { color: #cbd5e1 !important; } /* ============================================================ KS Parfum — Dark Mode Nadpisuje klasy Tailwind gdy ma klasę "dark" ============================================================ */ /* ─── Przycisk przełącznika ─────────────────────────────── */ #btn-theme { transition: transform 0.2s ease, background 0.2s ease; } #btn-theme:active { transform: scale(0.9); } /* ─── BAZOWE TŁA ────────────────────────────────────────── */ html.dark body { background-color: #0f172a !important; color: #e2e8f0 !important; } html.dark .bg-white { background-color: #1e293b !important; } html.dark .bg-gray-50, html.dark .bg-gray-50\/50 { background-color: #1e293b !important; } html.dark .bg-gray-100 { background-color: #0f172a !important; } html.dark .bg-gray-200 { background-color: #334155 !important; } html.dark .bg-gray-800 { background-color: #0f172a !important; } /* ─── TEKST ─────────────────────────────────────────────── */ html.dark .text-gray-900, html.dark .text-gray-950 { color: #f1f5f9 !important; } html.dark .text-gray-800 { color: #e2e8f0 !important; } html.dark .text-gray-700 { color: #cbd5e1 !important; } html.dark .text-gray-600 { color: #94a3b8 !important; } html.dark .text-gray-500 { color: #64748b !important; } html.dark .text-gray-400 { color: #475569 !important; } /* ─── RAMKI ─────────────────────────────────────────────── */ html.dark .border, html.dark .border-gray-100, html.dark .border-gray-200, html.dark .border-gray-300 { border-color: #334155 !important; } html.dark .divide-gray-100 > * + * { border-color: #334155 !important; } /* ─── HEADER / NAWIGACJA ────────────────────────────────── */ html.dark header.bg-blue-600 { background-color: #1e3a5f !important; } html.dark .bg-blue-700 { background-color: #1e3a5f !important; } /* ─── INPUTY I SELECTY ──────────────────────────────────── */ html.dark input, html.dark textarea, html.dark select { background-color: #0f172a !important; color: #e2e8f0 !important; border-color: #334155 !important; } html.dark input::placeholder, html.dark textarea::placeholder { color: #475569 !important; } /* ─── KARTY AUKCJI ──────────────────────────────────────── */ html.dark .rounded-2xl.border, html.dark .rounded-xl.border { border-color: #334155 !important; } html.dark .bg-gray-50.rounded-xl, html.dark .bg-gray-50\/50 { background-color: #1e293b !important; } /* ─── MODALE ────────────────────────────────────────────── */ html.dark .bg-black\/60 { background-color: rgba(0,0,0,0.8) !important; } html.dark .shadow-2xl { box-shadow: 0 25px 50px -12px rgba(0,0,0,0.6) !important; } /* ─── PRZYCISKI NEUTRALNE ───────────────────────────────── */ html.dark .bg-gray-100.hover\:bg-gray-200 { background-color: #1e293b !important; } html.dark .hover\:bg-gray-50:hover { background-color: #1e293b !important; } html.dark .hover\:bg-gray-100:hover { background-color: #334155 !important; } /* ─── TABSY ─────────────────────────────────────────────── */ html.dark .active-tab { background-color: #1e293b !important; } html.dark .border-b-4 { border-color: inherit; } /* ─── STANY SPECJALNE (zostawiamy kolory brandowe) ──────── */ /* bg-blue-600, bg-emerald-600, bg-red-600, bg-yellow-500 — bez zmian w dark mode */ /* ─── PANEL ADMINA (ciemny z natury) ───────────────────── */ html.dark .bg-gray-800.rounded-2xl { background-color: #020617 !important; } html.dark .bg-gray-700\/60 { background-color: rgba(30, 41, 59, 0.6) !important; } html.dark .bg-gray-700\/40 { background-color: rgba(30, 41, 59, 0.4) !important; } /* ─── TOAST ─────────────────────────────────────────────── */ html.dark #toast-admin { background-color: #1e293b !important; } /* ─── SLIDESHOW / GALERIA ───────────────────────────────── */ html.dark [data-slider-id] { background-color: #1e293b !important; } /* ─── PANEL UŻYTKOWNIKA (panel.html) ───────────────────── */ /* Karty aukcji w panelu kupującego/sprzedawcy */ html.dark #moje-aukcje-lista .bg-white, html.dark #wygrane-aukcje-lista .bg-white, html.dark #ulubione-aukcje-lista .bg-white, html.dark #sprzedawca-aukcje-lista .bg-white { background-color: #1e293b !important; } /* Karta profilu (Zalogowany jako) */ html.dark #user-profile-name { color: #f1f5f9 !important; } /* Zakładki nawigacji */ html.dark #nawigacja-panelu { background-color: #1e293b !important; border-color: #334155 !important; } html.dark .active-tab { background-color: #0f172a !important; } /* Sekcja wygranych / wygrana aukcja */ html.dark .bg-green-50\/40 { background-color: rgba(0, 42, 16, 0.4) !important; } html.dark .border-green-500 { border-color: #16a34a !important; } html.dark .ring-green-100 { --tw-ring-color: rgba(0, 80, 30, 0.3) !important; } /* Podsumowanie transakcji w karcie */ html.dark .border-green-200 { border-color: #166534 !important; } html.dark .bg-emerald-50.rounded-xl { background-color: #052e16 !important; } html.dark .border-emerald-100 { border-color: #14532d !important; } html.dark .text-emerald-800 { color: #34d399 !important; } html.dark .text-emerald-700 { color: #6ee7b7 !important; } html.dark .text-emerald-600 { color: #6ee7b7 !important; } /* Baner Oczekiwanie na dane (żółty) */ html.dark .bg-yellow-50.border.border-yellow-200 { background-color: #1a1200 !important; border-color: #5a4000 !important; } html.dark .text-yellow-800 { color: #fbbf24 !important; } html.dark .text-yellow-600 { color: #d97706 !important; } /* Szczegóły wysyłki (niebieski baner) */ html.dark .bg-blue-50\/50.border.border-blue-200 { background-color: rgba(15, 39, 68, 0.5) !important; border-color: #1e3a5f !important; } html.dark .bg-blue-50.rounded-xl { background-color: #0f2744 !important; } html.dark .text-blue-900 { color: #93c5fd !important; } html.dark .text-blue-700 { color: #60a5fa !important; } /* Dashboard sprzedawcy */ html.dark #dashboard-sprzedawcy { background-color: #1e293b !important; border-color: #334155 !important; } html.dark #dashboard-sprzedawcy .bg-gray-50 { background-color: #0f172a !important; } /* Modale (Dostawa, Edycja, Opinie) */ html.dark #modalDostawy .bg-white, html.dark #modalEdycjiAukcji .bg-white, html.dark #modalOpinii .bg-white { background-color: #1e293b !important; } html.dark #modalDostawy input, html.dark #modalDostawy select, html.dark #modalEdycjiAukcji input, html.dark #modalEdycjiAukcji textarea { background-color: #0f172a !important; color: #e2e8f0 !important; border-color: #334155 !important; } /* Scrollbar (subtelna w dark mode) */ html.dark ::-webkit-scrollbar { width: 4px; height: 4px; } html.dark ::-webkit-scrollbar-track { background: #1e293b; } html.dark ::-webkit-scrollbar-thumb { background: #475569; border-radius: 2px; } /* ─── FOOTER ────────────────────────────────────────────── */ html.dark footer.bg-white { background-color: #1e293b !important; border-color: #334155 !important; } /* ─── PŁYNNE PRZEJŚCIE ──────────────────────────────────── */ *, *::before, *::after { transition: background-color 0.2s ease, border-color 0.2s ease, color 0.15s ease; } /* ─── WŁASNE KLASY MODALU PROFILU ───────────────────────── */ .ks-modal { background-color: #ffffff; color: #111827; } .ks-modal-text { color: #111827; } .ks-modal-muted { color: #9ca3af; } .ks-modal-border { border-color: #e5e7eb; } .ks-modal-input { background-color: #f3f4f6; } .ks-input { background-color: #ffffff; color: #111827; } html.dark .ks-modal { background-color: #1e293b !important; color: #e2e8f0 !important; } html.dark .ks-modal-text { color: #f1f5f9 !important; } html.dark .ks-modal-muted { color: #64748b !important; } html.dark .ks-modal-border { border-color: #334155 !important; } html.dark .ks-modal-input { background-color: #0f172a !important; } html.dark .ks-input { background-color: #0f172a !important; color: #e2e8f0 !important; border-color: #334155 !important; } html.dark .ks-input::placeholder { color: #475569 !important; } /* ─── PANEL CENA + LIDER (aukcja.html) ──────────────────── */ .bg-blue-50.border.border-blue-100, html.dark .bg-blue-50.border.border-blue-100 { background-color: #1e293b !important; border-color: #334155 !important; } html.dark .bg-blue-100.border.border-blue-200 { background-color: #1e293b !important; border-color: #334155 !important; } html.dark .bg-yellow-50.border.border-yellow-200, html.dark .bg-orange-50.border.border-orange-200 { background-color: #1e293b !important; border-color: #334155 !important; }