/*
Theme Name: DRAK Moto
Theme URI: https://drakmoto.pl
Author: DRAK Moto
Description: Autorski motyw WooCommerce dla sklepu z odzieżą motocyklową DRAK Moto Wear
Version: 1.0.18
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 8.0
License: Proprietary
Text Domain: drak
*/

:root {
  --draki-black: #0a0a0a;
  --draki-red: #dc2626;
  --draki-red-glow: rgba(220, 38, 38, 0.4);
  --draki-red-light: #ef4444;
  --draki-white: #ffffff;
  --draki-gray: rgba(255, 255, 255, 0.7);
  --draki-gray-dim: rgba(255, 255, 255, 0.4);
  --draki-border: rgba(255, 255, 255, 0.1);
  --draki-border-hover: rgba(255, 255, 255, 0.25);
  --draki-surface: #1a1a1a;
  --draki-surface-light: #222222;
  --draki-ease: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --draki-ease-back: cubic-bezier(0.34, 1.56, 0.64, 1);
  --draki-radius: 6px;
}

/* === Skip link (a11y - WCAG 2.1) === */
.drak-skip-link {
  position: absolute;
  top: -50px;
  left: 0;
  background: var(--draki-red);
  color: var(--draki-white);
  padding: 10px 20px;
  z-index: 100000;
  text-decoration: none;
  font-family: 'Orbitron', sans-serif;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 1px;
  transition: top 0.2s ease;
}

.drak-skip-link:focus {
  top: 0;
  outline: 2px solid var(--draki-white);
  outline-offset: -2px;
}

*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  scroll-behavior: smooth;
}

/* Custom scrollbar */
::-webkit-scrollbar {
  width: 8px;
}

::-webkit-scrollbar-track {
  background: var(--draki-black);
}

::-webkit-scrollbar-thumb {
  background: var(--draki-red);
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--draki-red-light);
}

/* Selection */
::selection {
  background: var(--draki-red);
  color: var(--draki-white);
}

body {
  background-color: var(--draki-black);
  color: var(--draki-white);
  font-family: 'Exo 2', sans-serif;
  margin: 0;
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Russo One', 'Oswald', sans-serif;
}

a {
  color: inherit;
  text-decoration: none;
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

button {
  font-family: inherit;
  cursor: pointer;
}

ul, ol {
  list-style: none;
}

/* Utility: kontener sekcji */
.drak-container {
  max-width: 1400px;
  margin: 0 auto;
  padding-left: 40px;
  padding-right: 40px;
}

@media (max-width: 749px) {
  .drak-container {
    padding-left: 20px;
    padding-right: 20px;
  }
}

/* Main content — domyślny padding-top za fixed header.
   Strony z własnym hero (front-page, shop) mają padding: 0 i zarządzają spacingiem same. */
.site-main {
  padding-top: 120px;
}

body.home .site-main,
body.post-type-archive-product .site-main,
body.tax-product_cat .site-main,
body.single-product .site-main,
body.drak-ebook-page .site-main,
body.woocommerce-checkout .site-main,
body.woocommerce-cart .site-main {
  padding-top: 0;
}

/* Badge TECHNOLOGIAKLASA - na zdjęciach produktów (dosunięty do prawej krawędzi) */
.drak-tech-badge {
  position: absolute;
  top: 10px;
  right: 0;
  background: #000000;
  color: var(--draki-red);
  font-family: 'Orbitron', sans-serif;
  font-size: 10px;
  font-weight: 700;
  padding: 5px 12px;
  z-index: 5;
  letter-spacing: 1px;
  text-transform: uppercase;
  line-height: 1;
  pointer-events: none;
}

@media (max-width: 768px) {
  .drak-tech-badge {
    font-size: 8px;
    padding: 4px 8px;
    top: 6px;
    right: 0;
  }
}

/* === Strona chroniona hasłem === */
body.drak-password-page {
  margin: 0;
  padding: 0;
  background: var(--draki-black, #0a0a0a);
  font-family: 'Exo 2', sans-serif;
  -webkit-font-smoothing: antialiased;
}

.drak-password-protected {
  min-height: 60vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 80px 20px;
  background: var(--draki-black, #0a0a0a);
}

.drak-password-protected--fullscreen {
  min-height: 100vh;
  background:
    radial-gradient(ellipse at center, rgba(220, 38, 38, 0.08) 0%, transparent 60%),
    var(--draki-black, #0a0a0a);
  position: relative;
}

.drak-password-protected--fullscreen::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(220, 38, 38, 0.03) 1px, transparent 1px),
    linear-gradient(rgba(220, 38, 38, 0.03) 1px, transparent 1px);
  background-size: 60px 60px;
  pointer-events: none;
  opacity: 0.5;
}

.drak-password-protected--fullscreen .drak-password-protected-inner {
  position: relative;
  z-index: 1;
}

.drak-password-logo {
  display: flex;
  justify-content: center;
  margin-bottom: 32px;
}

.drak-password-logo img {
  width: 100px;
  height: auto;
}

.drak-password-protected-inner {
  max-width: 520px;
  width: 100%;
  text-align: center;
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid var(--draki-border, rgba(255, 255, 255, 0.08));
  padding: 48px 32px;
}

.drak-password-protected-icon {
  display: inline-flex;
  width: 80px;
  height: 80px;
  align-items: center;
  justify-content: center;
  background: rgba(220, 38, 38, 0.08);
  border: 1px solid rgba(220, 38, 38, 0.25);
  color: var(--draki-red, #dc2626);
  margin-bottom: 24px;
}

.drak-password-protected-title {
  font-family: 'Russo One', 'Oswald', sans-serif;
  font-size: clamp(22px, 4vw, 32px);
  letter-spacing: 2px;
  margin: 0 0 16px;
  color: var(--draki-white, #fff);
  text-transform: uppercase;
}

.drak-password-protected-title .drak-info-highlight {
  color: var(--draki-red, #dc2626);
}

.drak-password-protected-text {
  font-family: 'Exo 2', sans-serif;
  font-size: 15px;
  line-height: 1.6;
  color: var(--draki-gray, rgba(255, 255, 255, 0.7));
  margin: 0 0 32px;
}

.drak-pw-form {
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin-top: 8px;
}

.drak-pw-form input[type="password"] {
  width: 100%;
  padding: 16px 18px;
  background: rgba(0, 0, 0, 0.4);
  border: 1px solid var(--draki-border, rgba(255, 255, 255, 0.18));
  color: var(--draki-white, #fff);
  font-family: 'Exo 2', sans-serif;
  font-size: 16px;
  outline: none;
  transition: border-color 0.2s ease, background-color 0.2s ease;
  box-sizing: border-box;
  text-align: center;
  letter-spacing: 2px;
}

.drak-pw-form input[type="password"]::placeholder {
  color: rgba(255, 255, 255, 0.35);
  letter-spacing: 0.5px;
}

.drak-pw-form input[type="password"]:focus {
  border-color: var(--draki-red, #dc2626);
  background: rgba(0, 0, 0, 0.6);
  box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.15);
}

.drak-pw-form button[type="submit"] {
  padding: 16px 28px;
  background: var(--draki-red, #dc2626);
  color: var(--draki-white, #fff);
  border: 2px solid var(--draki-red, #dc2626);
  font-family: 'Russo One', 'Oswald', sans-serif;
  font-size: 14px;
  letter-spacing: 2px;
  text-transform: uppercase;
  cursor: pointer;
  transition: all 0.2s ease;
}

.drak-pw-form button[type="submit"]:hover {
  background: transparent;
  color: var(--draki-red, #dc2626);
}

@media (max-width: 600px) {
  .drak-password-protected-inner {
    padding: 36px 20px;
  }
}

/* Dostępność: wyłącz animacje dla użytkowników z wrażliwością na ruch */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* ================================================================
   === Formularz programu rabatowego (page-zglos-publikacje.php) ===
   ================================================================ */

.drak-publication-form {
  max-width: 800px;
  margin: 0 auto;
}

.drak-honeypot {
  position: absolute !important;
  left: -9999px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
}

.drak-form-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
  margin-top: 16px;
}

@media (max-width: 749px) {
  .drak-form-grid {
    grid-template-columns: 1fr;
  }
}

.drak-form-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.drak-form-field-full {
  grid-column: 1 / -1;
}

.drak-form-label {
  font-family: 'Orbitron', sans-serif;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--draki-gray);
}

.drak-form-optional {
  text-transform: none;
  font-size: 11px;
  opacity: 0.6;
  letter-spacing: 0;
}

.required {
  color: var(--draki-red);
}

.drak-form-field input[type="text"],
.drak-form-field input[type="email"],
.drak-form-field input[type="url"],
.drak-form-field input[type="date"],
.drak-form-field textarea {
  width: 100%;
  padding: 14px 16px;
  background: rgba(0, 0, 0, 0.4);
  border: 1px solid var(--draki-border);
  color: var(--draki-white);
  font-family: 'Exo 2', sans-serif;
  font-size: 15px;
  outline: none;
  transition: border-color 0.2s ease, background-color 0.2s ease;
  box-sizing: border-box;
}

.drak-form-field input:focus,
.drak-form-field textarea:focus {
  border-color: var(--draki-red);
  background: rgba(0, 0, 0, 0.6);
  box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.15);
}

.drak-form-field input::placeholder,
.drak-form-field textarea::placeholder {
  color: rgba(255, 255, 255, 0.3);
}

/* Chrome/Edge autofill - wymusza ciemne tło zamiast jasno-niebieskiego/żółtego */
.drak-form-field input:-webkit-autofill,
.drak-form-field input:-webkit-autofill:hover,
.drak-form-field input:-webkit-autofill:focus,
.drak-form-field input:-webkit-autofill:active,
.drak-form-field textarea:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px rgba(0, 0, 0, 0.6) inset !important;
  -webkit-text-fill-color: var(--draki-white) !important;
  caret-color: var(--draki-white) !important;
  transition: background-color 5000s ease-in-out 0s !important;
  border: 1px solid var(--draki-border) !important;
}

.drak-form-field input:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0 1000px rgba(0, 0, 0, 0.7) inset, 0 0 0 3px rgba(220, 38, 38, 0.15) !important;
  border-color: var(--draki-red) !important;
}

.drak-form-field textarea {
  resize: vertical;
  min-height: 80px;
}

/* Czerwony border tylko gdy klient ruszał pole (klasa dodawana po pierwszym blur w JS) */
.drak-form-field input.drak-touched:invalid,
.drak-form-field textarea.drak-touched:invalid {
  border-color: var(--draki-red-light);
}

/* === Fieldset platforma === */
.drak-form-fieldset {
  border: none;
  padding: 0;
  margin: 24px 0 16px;
}

.drak-form-fieldset legend {
  padding: 0;
  margin-bottom: 12px;
}

.drak-form-radio-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}

@media (max-width: 749px) {
  .drak-form-radio-grid {
    grid-template-columns: 1fr 1fr;
  }
}

.drak-form-radio {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  background: rgba(0, 0, 0, 0.3);
  border: 1px solid var(--draki-border);
  cursor: pointer;
  transition: all 0.2s ease;
  font-family: 'Exo 2', sans-serif;
  font-size: 14px;
}

.drak-form-radio:hover {
  border-color: rgba(255, 255, 255, 0.25);
  background: rgba(0, 0, 0, 0.5);
}

.drak-form-radio input[type="radio"] {
  accent-color: var(--draki-red);
  width: 18px;
  height: 18px;
  cursor: pointer;
  flex-shrink: 0;
}

.drak-form-radio:has(input:checked) {
  border-color: var(--draki-red);
  background: rgba(220, 38, 38, 0.08);
}

.drak-form-radio-other {
  grid-column: 1 / -1;
  flex-wrap: wrap;
}

.drak-form-radio-other input[type="text"] {
  flex: 1;
  min-width: 200px;
  padding: 8px 12px;
  background: rgba(0, 0, 0, 0.4);
  border: 1px solid var(--draki-border);
  color: var(--draki-white);
  font-family: 'Exo 2', sans-serif;
  font-size: 14px;
}

.drak-form-radio-other input[type="text"]:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

/* === Checkboxy oświadczeń === */
.drak-form-checkboxes {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 16px;
}

.drak-form-checkbox {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 14px 16px;
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid var(--draki-border);
  cursor: pointer;
  transition: all 0.2s ease;
  font-family: 'Exo 2', sans-serif;
  font-size: 14px;
  line-height: 1.5;
}

.drak-form-checkbox:hover {
  border-color: rgba(255, 255, 255, 0.2);
}

.drak-form-checkbox input[type="checkbox"] {
  accent-color: var(--draki-red);
  width: 18px;
  height: 18px;
  cursor: pointer;
  margin-top: 2px;
  flex-shrink: 0;
}

.drak-form-checkbox:has(input:checked) {
  border-color: var(--draki-red);
  background: rgba(220, 38, 38, 0.05);
}

.drak-form-checkbox span {
  color: var(--draki-white);
  flex: 1;
}

/* === Submit button === */
.drak-form-submit-block {
  text-align: center;
}

.drak-form-submit {
  position: relative;
  padding: 18px 48px;
  background: var(--draki-red);
  color: var(--draki-white);
  border: 2px solid var(--draki-red);
  font-family: 'Russo One', 'Oswald', sans-serif;
  font-size: 15px;
  letter-spacing: 2px;
  text-transform: uppercase;
  cursor: pointer;
  transition: all 0.2s ease;
  min-width: 280px;
}

.drak-form-submit:hover:not(:disabled) {
  background: var(--draki-red-light);
  border-color: var(--draki-red-light);
}

.drak-form-submit:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.drak-form-submit-loader {
  display: none;
  width: 16px;
  height: 16px;
  margin-left: 12px;
  border: 2px solid var(--draki-white);
  border-top-color: transparent;
  border-radius: 50%;
  vertical-align: middle;
  animation: drak-spin 0.7s linear infinite;
}

.drak-form-submit.loading .drak-form-submit-loader {
  display: inline-block;
}

@keyframes drak-spin {
  to { transform: rotate(360deg); }
}

.drak-form-status {
  margin-top: 20px;
  padding: 16px 20px;
  font-size: 14px;
  font-family: 'Exo 2', sans-serif;
  border: 1px solid transparent;
  display: none;
}

.drak-form-status.success {
  display: block;
  background: rgba(34, 197, 94, 0.1);
  border-color: rgba(34, 197, 94, 0.4);
  color: #4ade80;
}

.drak-form-status.error {
  display: block;
  background: rgba(220, 38, 38, 0.1);
  border-color: rgba(220, 38, 38, 0.4);
  color: var(--draki-red-light);
}

.drak-form-info-text {
  margin-top: 24px;
  padding: 16px;
  background: rgba(220, 38, 38, 0.05);
  border-left: 3px solid var(--draki-red);
  font-size: 13px;
  line-height: 1.5;
  color: var(--draki-gray);
  text-align: left;
}

.drak-info-publication code {
  display: inline-block;
  padding: 2px 8px;
  background: rgba(220, 38, 38, 0.1);
  border: 1px solid rgba(220, 38, 38, 0.3);
  color: var(--draki-red-light);
  font-family: 'Orbitron', sans-serif;
  font-size: 13px;
  border-radius: 3px;
}

/* ================================================================
   === CookieYes - DRAK Moto override (obejście braku Custom CSS w free) ===
   Free CookieYes blokuje kolory + custom CSS. Nadpisujemy z motywu.
   Jeśli kiedyś migracja na inną wtyczkę cookie - usunąć tę sekcję.
   ================================================================ */

/* Banner główny (Cookie Notice) */
.cky-consent-container,
.cky-consent-bar {
  background-color: var(--draki-black) !important;
  color: var(--draki-white) !important;
  border: 1px solid var(--draki-red) !important;
}

.cky-title,
.cky-notice-title,
.cky-preference-title {
  color: var(--draki-white) !important;
  font-family: 'Russo One', 'Oswald', sans-serif !important;
}

.cky-notice-des,
.cky-notice-des p,
.cky-notice-des span {
  color: var(--draki-gray) !important;
  font-family: 'Exo 2', sans-serif !important;
}

/* === Modal Ustawienia (Preference Centre) - wszystkie warianty selektorów === */
.cky-modal,
.cky-modal-open,
.cky-modal .cky-modal-content,
.cky-prefrence-center-wrapper,
.cky-preference-center-wrapper,
.cky-prefrence-center,
.cky-preference-center,
.cky-prefrence-body-wrapper,
.cky-preference-body-wrapper,
.cky-prefrence-content-wrapper,
.cky-preference-content-wrapper,
[id^="cky-detail"],
[class*="cky-prefrence"],
[class*="cky-preference"],
div[data-cky-tag="detail"],
div[data-cky-tag="notice"] {
  background-color: var(--draki-black) !important;
  background: var(--draki-black) !important;
  color: var(--draki-white) !important;
}

.cky-modal {
  border: 1px solid var(--draki-red) !important;
}

/* === Overlay (tło ZA modalem - przyciemnione) === */
.cky-overlay,
.cky-modal-overlay {
  background-color: rgba(0, 0, 0, 0.85) !important;
}

/* === Header modalu (gdzie tytuł "Dostosuj preferencje") === */
.cky-prefrence-header,
.cky-preference-header,
.cky-prefrence-title,
.cky-preference-title {
  background-color: var(--draki-black) !important;
  color: var(--draki-white) !important;
  border-bottom: 1px solid var(--draki-border) !important;
  font-family: 'Russo One', 'Oswald', sans-serif !important;
}

.cky-preference-content-wrapper,
.cky-preference-body-wrapper,
.cky-preference-header,
.cky-preference-title {
  color: var(--draki-white) !important;
}

/* === Tytuły kategorii (niezbędny / Funkcjonalny / Analityka / Występ / Reklama) === */
.cky-accordion-header,
.cky-accordion-title,
.cky-accordion-btn,
button.cky-accordion-btn {
  color: var(--draki-white) !important;
  font-weight: 700 !important;
  font-family: 'Russo One', 'Oswald', sans-serif !important;
  text-transform: capitalize !important;
  font-size: 16px !important;
  background: transparent !important;
}

/* === Opisy kategorii === */
.cky-accordion-header-des,
.cky-accordion-body-des,
.cky-accordion-cookie {
  color: var(--draki-gray) !important;
  font-family: 'Exo 2', sans-serif !important;
}

/* === Kontener akordeon kategorii === */
.cky-accordion {
  border: 1px solid var(--draki-border) !important;
  background-color: rgba(255, 255, 255, 0.02) !important;
  margin-bottom: 8px !important;
  border-radius: 4px !important;
}

.cky-accordion:hover {
  border-color: rgba(255, 255, 255, 0.2) !important;
}

/* === Header sekcji (gdzie nazwa kategorii + toggle) === */
.cky-accordion-header-wrapper,
.cky-accordion-wrapper > .cky-accordion-header {
  background-color: rgba(255, 255, 255, 0.03) !important;
  padding: 12px 16px !important;
}

/* === Lista cookies wewnątrz kategorii === */
.cky-accordion-cookie-list,
.cky-cookie-list-wrapper {
  background-color: var(--draki-surface) !important;
  padding: 12px 16px !important;
}

/* === Przycisk "Akceptuję wszystkie" === */
.cky-btn-accept,
button[data-cky-tag="accept-button"] {
  background-color: var(--draki-red) !important;
  border: 2px solid var(--draki-red) !important;
  color: var(--draki-white) !important;
  font-family: 'Russo One', 'Oswald', sans-serif !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  padding: 12px 20px !important;
  transition: all 0.2s ease !important;
}
.cky-btn-accept:hover,
button[data-cky-tag="accept-button"]:hover {
  background-color: var(--draki-red-light) !important;
  border-color: var(--draki-red-light) !important;
}

/* === Przycisk "Tylko niezbędne" / "Odrzuć wszystkie" === */
.cky-btn-reject,
button[data-cky-tag="reject-button"] {
  background-color: transparent !important;
  border: 2px solid var(--draki-white) !important;
  color: var(--draki-white) !important;
  font-family: 'Russo One', 'Oswald', sans-serif !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  padding: 12px 20px !important;
  transition: all 0.2s ease !important;
}
.cky-btn-reject:hover,
button[data-cky-tag="reject-button"]:hover {
  background-color: var(--draki-white) !important;
  color: var(--draki-black) !important;
}

/* === Przycisk "Ustawienia" / "Dostosuj" / Customise === */
.cky-btn-customize,
button[data-cky-tag="settings-button"] {
  background-color: transparent !important;
  border: 2px solid rgba(255, 255, 255, 0.4) !important;
  color: var(--draki-white) !important;
  font-family: 'Russo One', 'Oswald', sans-serif !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  padding: 12px 20px !important;
  transition: all 0.2s ease !important;
}
.cky-btn-customize:hover,
button[data-cky-tag="settings-button"]:hover {
  border-color: var(--draki-white) !important;
  background-color: rgba(255, 255, 255, 0.05) !important;
}

/* === Przycisk "Zapisz preferencje" === */
.cky-btn-preferences,
button[data-cky-tag="detail-save-button"] {
  background-color: var(--draki-red) !important;
  border: 2px solid var(--draki-red) !important;
  color: var(--draki-white) !important;
  font-family: 'Russo One', 'Oswald', sans-serif !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  padding: 12px 20px !important;
  transition: all 0.2s ease !important;
}
.cky-btn-preferences:hover,
button[data-cky-tag="detail-save-button"]:hover {
  background-color: var(--draki-red-light) !important;
  border-color: var(--draki-red-light) !important;
}

/* === Linki === */
.cky-policy,
.cky-show-desc-btn,
a[data-cky-tag="readmore-button"] {
  color: var(--draki-red) !important;
  text-decoration: underline !important;
}
.cky-policy:hover,
.cky-show-desc-btn:hover {
  color: var(--draki-red-light) !important;
}

/* === Floating button "Ustawienia cookies" (prawy dolny róg) === */
.cky-revisit-bottom,
.cky-revisit-bottom-left,
.cky-revisit-bottom-right {
  background-color: var(--draki-red) !important;
  color: var(--draki-white) !important;
}
.cky-revisit-bottom:hover,
.cky-revisit-bottom-left:hover,
.cky-revisit-bottom-right:hover {
  background-color: var(--draki-red-light) !important;
}

/* === Toggle switch (włącz/wyłącz kategorię) === */
/* WAŻNE: aktualna wersja CookieYes renderuje suwak jako:
   <div class="cky-switch" data-cky-tag="detail-category-toggle"><input type="checkbox"></div>
   BEZ <label> / .cky-switch-slider / [role=switch] (to był stary markup - stąd wcześniej
   suwak był niewidoczny: stylowaliśmy elementy, których nie ma). Stylujemy input[type=checkbox]
   BEZPOŚREDNIO + wymuszamy widoczność (nadpisuje anty-miganie [data-cky-tag]{visibility:hidden}). */

/* Wrapper suwaka - wymuś widoczność (ma data-cky-tag = anty-miganie go chowa) */
.cky-switch,
.cky-accordion .cky-switch {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  align-items: center !important;
}

/* Sam suwak = input[type=checkbox], stan OFF */
.cky-switch input[type="checkbox"] {
  -webkit-appearance: none !important;
  appearance: none !important;
  visibility: visible !important;
  opacity: 1 !important;
  position: relative !important;
  width: 44px !important;
  height: 24px !important;
  min-width: 44px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #555 !important;
  border: none !important;
  border-radius: 50px !important;
  cursor: pointer !important;
  outline: 0 !important;
  top: 0 !important;
  transition: background-color 0.2s ease !important;
}

/* Stan ON (zaznaczone) = czerwony DRAK */
.cky-switch input[type="checkbox"]:checked {
  background: var(--draki-red) !important;
}

/* Kółko suwaka */
.cky-switch input[type="checkbox"]::before {
  content: '' !important;
  position: absolute !important;
  top: 2px !important;
  left: 2px !important;
  width: 20px !important;
  height: 20px !important;
  background-color: #fff !important;
  border-radius: 50% !important;
  transition: transform 0.2s ease !important;
}

/* Kółko w pozycji ON */
.cky-switch input[type="checkbox"]:checked::before {
  transform: translateX(20px) !important;
}

/* === Empty state "Brak plików cookie do wyświetlenia" === */
.cky-cookie-list-empty,
.cky-no-cookies,
.cky-empty-cookies,
.cky-accordion-cookie-list-empty,
[class*="empty"],
[class*="no-cookies"],
[class*="no-data"],
.cky-accordion-body p:only-child {
  background-color: var(--draki-surface) !important;
  color: var(--draki-gray) !important;
  border: 1px solid var(--draki-border) !important;
  padding: 12px 16px !important;
  border-radius: 4px !important;
}

/* === USUŃ mask-image (gradient fade efektem CSS mask) === */
.cky-modal,
.cky-modal *,
.cky-prefrence-body-wrapper,
.cky-preference-body-wrapper,
.cky-prefrence-content-wrapper,
.cky-preference-content-wrapper,
[class*="cky-prefrence"],
[class*="cky-preference"] {
  mask-image: none !important;
  -webkit-mask-image: none !important;
  mask: none !important;
  -webkit-mask: none !important;
}

/* === NUKE wszystkie biało-fade elementy w modalu === */
.cky-modal [style*="gradient"],
.cky-modal [style*="rgba(255"],
.cky-modal [style*="background: rgb(255"],
.cky-modal [style*="background-color: rgb(255"],
.cky-modal [style*="background-color: white"],
.cky-modal [style*="background: white"] {
  background-color: var(--draki-black) !important;
  background-image: none !important;
  background: var(--draki-black) !important;
}

/* Box-shadow który może tworzyć "glow" */
.cky-modal,
.cky-prefrence-content-wrapper,
.cky-preference-content-wrapper,
.cky-prefrence-body-wrapper,
.cky-preference-body-wrapper {
  box-shadow: none !important;
}

/* === "Zawsze aktywne" label === */
.cky-always-active,
span[data-cky-tag="always-active"] {
  color: var(--draki-red) !important;
  font-weight: 600;
}

/* === Close [X] button === */
.cky-btn-close,
button[data-cky-tag="close-button"] {
  color: var(--draki-gray) !important;
  background: transparent !important;
}
.cky-btn-close:hover,
button[data-cky-tag="close-button"]:hover {
  color: var(--draki-white) !important;
}

/* === Cookie list table === */
.cky-cookie-list-table {
  background-color: var(--draki-surface) !important;
}
.cky-cookie-list-table th,
.cky-cookie-list-table td {
  color: var(--draki-gray) !important;
  border-color: var(--draki-border) !important;
  background-color: transparent !important;
}
.cky-cookie-list-table th {
  color: var(--draki-white) !important;
  font-family: 'Orbitron', sans-serif !important;
}

/* === Blocked content placeholder === */
.cky-blocked-content {
  background-color: var(--draki-surface) !important;
  border: 1px solid var(--draki-red) !important;
  color: var(--draki-white) !important;
}

/* === Usunięcie BIAŁEGO FADE na dole listy kategorii (agresywnie) === */
/* CookieYes dodaje overlay z białym gradientem nad przyciskami - zastępujemy czarnym */

/* Wszystkie pseudo-elementy w modalu */
.cky-modal *::before,
.cky-modal *::after {
  background-image: none !important;
}

/* Konkretne klasy fade (różne nazwy w różnych wersjach) */
.cky-prefrence-scroll-fade,
.cky-preference-scroll-fade,
.cky-fade-bottom,
.cky-scroll-indicator,
.cky-bottom-fade,
.cky-fade,
[class*="scroll-fade"],
[class*="fade-bottom"],
[class*="bottom-fade"] {
  background: linear-gradient(to bottom, transparent 0%, var(--draki-black) 100%) !important;
  display: none !important;
}

/* Pseudo-elementy na konkretnych kontenerach */
.cky-prefrence-body-wrapper::before,
.cky-prefrence-body-wrapper::after,
.cky-preference-body-wrapper::before,
.cky-preference-body-wrapper::after,
.cky-prefrence-content-wrapper::before,
.cky-prefrence-content-wrapper::after,
.cky-preference-content-wrapper::before,
.cky-preference-content-wrapper::after {
  background: linear-gradient(to bottom, transparent 0%, var(--draki-black) 100%) !important;
  background-image: linear-gradient(to bottom, transparent 0%, var(--draki-black) 100%) !important;
}

/* Ostatnia kategoria w liście - margin-bottom żeby fade nie nakładał się */
.cky-accordion:last-child,
.cky-accordion-wrapper:last-child {
  margin-bottom: 40px !important;
}

/* === Wyrównanie szerokości przycisków bannera (wymóg RODO - równa widoczność) === */
.cky-consent-bar .cky-notice-btn-wrapper,
.cky-consent-container .cky-notice-btn-wrapper,
.cky-btn-wrapper,
.cky-notice-btn-wrapper {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  width: 100% !important;
}

.cky-consent-bar .cky-btn,
.cky-consent-container .cky-btn,
.cky-notice-btn-wrapper .cky-btn {
  flex: 1 1 auto !important;
  min-width: 140px !important;
  text-align: center !important;
}

/* Modal - przyciski "Zapisz preferencje" i "Akceptuj wszystko" - takie same */
.cky-prefrence-btn-wrapper,
.cky-preference-btn-wrapper,
[class*="prefrence-btn-wrapper"] {
  display: flex !important;
  gap: 12px !important;
  width: 100% !important;
}

.cky-prefrence-btn-wrapper .cky-btn,
.cky-preference-btn-wrapper .cky-btn {
  flex: 1 1 auto !important;
  min-width: 200px !important;
}

/* === Floating cookie button (revisit) === */
.cky-revisit-bottom button,
.cky-revisit-bottom .cky-revisit-button {
  background-color: var(--draki-red) !important;
  color: var(--draki-white) !important;
  border: 2px solid var(--draki-white) !important;
}

/* === Headery/Footery modala (gdzie były szare paski) === */
.cky-prefrence-header,
.cky-preference-header,
.cky-prefrence-footer,
.cky-preference-footer,
[class*="prefrence-header"],
[class*="preference-header"],
[class*="prefrence-footer"],
[class*="preference-footer"] {
  background-color: var(--draki-black) !important;
  border-color: var(--draki-border) !important;
}

/* === KONIEC CookieYes override === */