/* Vistitio — baner zgody na ciasteczka i okno „Ustawienia ciasteczek”.
   Wymiary odczytane z makiety (zrzut 2026-09-12): pasek desktop szerokości .wrap
   z marginesem 20 px nad dolną krawędzią, arkusz mobile od dołu, modal 780 px.
   Zero gradientów, kolory wyłącznie z tokenów --v-*. Uzupełnia site.css. */

.ck[hidden],
.ck-modal[hidden]{display:none}

/* ---------- przyciski i link wspólne dla paska i okna ---------- */
.ck-btn{
  display:grid;place-items:center;height:56px;padding:0 24px;border-radius:var(--v-r-btn);
  font-family:var(--v-font-body);font-weight:600;font-size:15px;white-space:nowrap;
}
.ck-btn--navy{background:var(--v-primary);color:var(--v-n-0)}
.ck-btn--navy:hover{background:var(--v-primary-hover);color:var(--v-n-0)}
.ck-btn--ghost{background:var(--v-n-0);color:var(--v-n-800);border:1.5px solid var(--v-n-300)}
.ck-btn--ghost:hover{border-color:var(--v-n-700)}
.ck-link{
  display:grid;place-items:center;height:56px;padding:0 16px;
  font-weight:600;font-size:15px;color:var(--v-n-700);
}
.ck-link:hover{color:var(--v-n-800)}

/* ---------- pasek / arkusz ---------- */
.ck{position:fixed;z-index:120;opacity:0}
.ck[data-gotowy]{opacity:1}
.ck-card{
  background:var(--v-n-0);color:var(--v-n-800);
  box-shadow:0 12px 40px rgba(30,43,69,.16);
}
.ck-handle{display:none}
.ck-h{font-family:var(--v-font-head);font-weight:600;letter-spacing:-.01em}
.ck-t{color:var(--v-n-700)}
.ck-t a{font-weight:600;color:var(--v-n-800);text-decoration:underline}
.ck-t a:hover{color:var(--v-secondary-text)}

/* ---------- okno ustawień ---------- */
.ck-modal{position:fixed;inset:0;z-index:130;display:flex}
.ck-ov{position:absolute;inset:0;background:rgba(30,43,69,.45)}
.ck-win{
  position:relative;background:var(--v-n-0);color:var(--v-n-800);
  box-shadow:0 12px 40px rgba(30,43,69,.2);overflow-y:auto;
}
.ck-win-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}
.ck-win-h{font-family:var(--v-font-head);font-weight:600;letter-spacing:-.02em}
.ck-x{
  flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;
  background:var(--v-n-100);color:var(--v-n-700);
}
.ck-x:hover{background:var(--v-n-200);color:var(--v-n-800)}
.ck-x svg{width:18px;height:18px}
.ck-lead{color:var(--v-n-600);font-size:15px;line-height:22px;margin-top:10px}

.ck-katy{display:flex;flex-direction:column;gap:12px;margin-top:24px}
.ck-kat{border:1px solid var(--v-n-200);border-radius:16px;padding:24px}
.ck-kat-head{display:flex;align-items:center;justify-content:space-between;gap:16px}
.ck-kat-t{font-family:var(--v-font-head);font-weight:600;font-size:17px;line-height:24px;letter-spacing:-.01em}
.ck-kat-d{color:var(--v-n-700);font-size:14px;line-height:22px;margin-top:4px}
.ck-zawsze{
  flex:none;height:28px;padding:0 14px;border-radius:999px;
  background:var(--v-n-100);color:var(--v-n-700);
  font-weight:600;font-size:13px;line-height:28px;
}

/* przełącznik: 52 × 28, gałka 22 px, stan włączony na granacie */
.ck-sw{
  position:relative;flex:none;width:52px;height:28px;padding:0;
  border-radius:999px;background:var(--v-n-200);
}
.ck-sw[aria-checked="true"]{background:var(--v-primary)}
.ck-sw-k{
  position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;
  background:var(--v-n-0);box-shadow:0 1px 3px rgba(30,43,69,.25);
}
.ck-sw[aria-checked="true"] .ck-sw-k{transform:translateX(24px)}
@media (prefers-reduced-motion:no-preference){
  .ck-sw{transition:background .15s ease}
  .ck-sw-k{transition:transform .15s ease}
}

.ck-lista{color:var(--v-n-600);font-size:14px;line-height:22px;margin-top:24px}
.ck-lista a{font-weight:600;color:var(--v-n-800);text-decoration:underline}
.ck-lista a:hover{color:var(--v-secondary-text)}
.ck-win-acts{display:flex;gap:12px;margin-top:20px}
.ck-win-acts .ck-btn{height:52px}

/* =========================================================
   MOBILE (< 900 px) — arkusz od dołu, tło przyciemnione
   ========================================================= */
@media (max-width:899.98px){
  .ck{inset:auto 0 0 0;transform:translateY(16px)}
  .ck[data-gotowy]{transform:none}
  .ck::before{content:"";position:fixed;inset:0;background:rgba(30,43,69,.45)}
  .ck-card{
    position:relative;display:flex;flex-direction:column;
    border-radius:var(--v-r-sheet) var(--v-r-sheet) 0 0;padding:10px 20px 24px;
    max-height:calc(100vh - 24px);overflow-y:auto;
  }
  .ck-handle{display:block;width:36px;height:4px;border-radius:2px;background:var(--v-n-200);margin:0 auto 12px}
  .ck-h{font-size:22px;line-height:28px}
  .ck-t{font-size:14px;line-height:22px;margin-top:10px}
  .ck-t-d{display:none}
  .ck-acts{display:flex;flex-direction:column;gap:10px;margin-top:14px}
  .ck-acts .ck-btn{height:52px;width:100%}
  .ck-acts .ck-btn--navy{order:1}
  .ck-acts .ck-btn--ghost{order:2}
  .ck-acts .ck-link{order:3;height:52px;margin-top:2px}

  .ck-modal{align-items:flex-end}
  .ck-win{
    width:100%;border-radius:var(--v-r-sheet) var(--v-r-sheet) 0 0;
    padding:10px 20px 24px;max-height:calc(100vh - 24px);
  }
  .ck-win .ck-handle{display:block}
  .ck-win-h{font-size:22px;line-height:28px}
  .ck-kat{padding:18px 20px}
  .ck-win-acts{flex-direction:column;gap:10px}
  .ck-win-acts .ck-btn{height:52px;width:100%}
  .ck-win-acts .ck-btn--navy{order:1}
  .ck-win-acts .ck-btn--ghost{order:2}
}

/* =========================================================
   DESKTOP (>= 900 px) — pasek na dole, okno wyśrodkowane
   ========================================================= */
@media (min-width:900px){
  .ck{left:0;right:0;bottom:20px;padding-inline:20px;transform:translateY(12px)}
  .ck[data-gotowy]{transform:none}
  .ck-card{
    max-width:1240px;margin-inline:auto;border-radius:20px;padding:32px 36px;
    display:flex;align-items:center;justify-content:space-between;gap:40px;
  }
  .ck-h{font-size:18px;line-height:24px}
  .ck-t{font-size:14px;line-height:22px;margin-top:8px;max-width:690px}
  .ck-t-m{display:none}
  .ck-acts{display:flex;align-items:center;gap:14px;flex:none}

  .ck-modal{align-items:center;justify-content:center;padding:20px}
  .ck-win{
    width:780px;max-width:100%;max-height:calc(100vh - 40px);
    border-radius:var(--v-r-sheet);padding:32px 40px 40px;
  }
  .ck-win-h{font-size:26px;line-height:32px}
}

@media (prefers-reduced-motion:no-preference){
  .ck[data-gotowy]{transition:opacity .2s ease,transform .2s ease}
}