/* Baner zgody cookies szaty 2 (P10, 2026-10-12), wg zaakceptowanej wizualizacji P8.
   Szablon: frontend/templates/frontend/_n2_cookies.html. Widocznosc ustawia
   SaploCookies (style.display), tu tylko wyglad. */
.n2-cookies{position:fixed;left:24px;bottom:24px;z-index:9999;width:min(460px,calc(100vw - 48px));
  font-family:'Plus Jakarta Sans',system-ui,sans-serif}
.n2-cookies-karta{display:grid;grid-template-columns:64px 1fr;grid-template-areas:"ikona tytul" "ikona tekst" "przyciski przyciski";
  column-gap:16px;align-items:start;padding:20px 20px 20px 18px;background:#fff;border-radius:20px;
  border:1px solid rgba(17,22,42,.12);box-shadow:0 2px 6px rgba(11,20,40,.06),0 24px 60px -12px rgba(11,20,40,.18)}
.n2-cookies-ikona{grid-area:ikona;width:64px;height:64px;margin-top:0;object-fit:contain}
.n2-cookies-tytul{grid-area:tytul;margin:0 0 4px;font-size:21px;line-height:1.25;font-weight:800;letter-spacing:-.01em;color:#11162a}
.n2-cookies-tekst{grid-area:tekst;margin:0;font-size:14px;line-height:1.55;color:#41475a}
.n2-cookies-tekst a{color:#f05a0a;text-decoration:underline;text-underline-offset:2px}
.n2-cookies-tekst a:hover{color:#11162a}
.n2-cookies-przyciski{grid-area:przyciski;display:flex;gap:10px;margin-top:16px}
.n2-cookies-btn{flex:1 1 0;display:inline-flex;align-items:center;justify-content:center;height:50px;padding:0 18px;
  border-radius:999px;font:inherit;font-size:16px;font-weight:700;white-space:nowrap;cursor:pointer;
  transition:background .2s,border-color .2s,color .2s,translate .2s}
.n2-cookies-btn--obrys{background:transparent;color:#11162a;border:1.5px solid rgba(17,22,42,.55)}
.n2-cookies-btn--obrys:hover{border-color:#11162a;background:rgba(17,22,42,.04)}
.n2-cookies-btn--pelny{background:var(--pomarancz,#ff6a1a);color:#fff;border:1px solid transparent}
.n2-cookies-btn--pelny:hover{background:var(--pomarancz-2,#f05a0a);translate:0 -1px}
.n2-cookies-btn:focus-visible,.n2-cookies-tekst a:focus-visible{outline:2px solid #11162a;outline-offset:2px}

/* Telefon: plywajaca karta 12 px od krawedzi, ikona przy tytule, tekst na cala
   szerokosc, przyciski jeden pod drugim, "Akceptuję wszystkie" na gorze. */
@media (max-width:640px){
  .n2-cookies{left:12px;right:12px;bottom:12px;width:auto}
  .n2-cookies-karta{grid-template-columns:52px 1fr;grid-template-areas:"ikona tytul" "tekst tekst" "przyciski przyciski";
    column-gap:14px;align-items:center;padding:16px 18px 18px}
  .n2-cookies-ikona{width:52px;height:52px;margin:0}
  .n2-cookies-tytul{margin:0;font-size:21px}
  .n2-cookies-tekst{margin-top:10px;font-size:15px;line-height:1.45}
  .n2-cookies-przyciski{flex-direction:column-reverse;gap:10px;margin-top:14px}
  .n2-cookies-btn{flex:none;width:100%;height:44px}
}
@media (prefers-reduced-motion:reduce){
  .n2-cookies-btn{transition:none}
  .n2-cookies-btn--pelny:hover{translate:none}
}

/* Przycisk zmiany zgody w polityce cookies. Szata 2 zdejmuje z tresci dokumentu
   atrybuty style (stara szata ma je w cookies.html), wiec bez tej reguly przycisk
   byl bialym tekstem na bialej karcie. */
.n2p-zgoda-btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 24px;border-radius:999px;background:var(--pomarancz,#ff6a1a);color:#fff;border:1px solid transparent;font:inherit;font-size:15px;font-weight:700;cursor:pointer;transition:background .15s ease,translate .15s ease}
.n2p-zgoda-btn:hover{background:var(--pomarancz-2,#f05a0a);translate:0 -1px}
.n2p-zgoda-btn:focus-visible{outline:2px solid #11162a;outline-offset:2px}
