/* cmp.css — baner zgody cookie (CMP, sn-cmp-*). Ręczny, Consent Mode v2.
   Styl: ciemny panel marki, akcent brass. Baner dolny + modal ustawień. */

.sn-cmp, .sn-cmp * { box-sizing: border-box; }

/* ── Baner dolny ───────────────────────────────────────── */
.sn-cmp-bar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 99999;
  background: var(--ink-900, #14110d);
  color: var(--fg-on-dark-1, #f4efe7);
  border-top: 1px solid rgba(255,255,255,0.12);
  box-shadow: 0 -8px 30px rgba(0,0,0,0.35);
  padding: clamp(16px, 2vw, 22px) clamp(16px, 4vw, 40px);
  font-family: var(--font-body, system-ui, sans-serif);
  transform: translateY(110%);
  transition: transform 320ms cubic-bezier(.2,.7,.2,1);
}
.sn-cmp-bar.is-open { transform: translateY(0); }
.sn-cmp-bar-inner {
  max-width: 1200px; margin: 0 auto;
  display: flex; align-items: center; gap: clamp(16px, 2.5vw, 36px); flex-wrap: wrap;
}
.sn-cmp-bar-text { flex: 1; min-width: 260px; }
.sn-cmp-bar-text h2 {
  font-family: var(--font-heading, inherit); font-weight: 700;
  font-size: 16px; margin: 0 0 6px; color: var(--bone-50, #fff); letter-spacing: -0.01em;
}
.sn-cmp-bar-text p { margin: 0; font-size: 13.5px; line-height: 1.55; color: var(--fg-on-dark-3, #c9c0b2); }
.sn-cmp-bar-text a { color: var(--brass-400, #d2ad62); text-decoration: underline; text-underline-offset: 3px; }
.sn-cmp-actions { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }

.sn-cmp-btn {
  font-family: var(--font-body, inherit); font-size: 13px; font-weight: 700;
  letter-spacing: 0.02em; padding: 12px 20px; border-radius: var(--radius-tight, 4px);
  border: 1px solid transparent; cursor: pointer; white-space: nowrap; transition: background 180ms, border-color 180ms, color 180ms;
}
.sn-cmp-btn-primary { background: var(--brass-500, #c2984c); color: #fff; }
.sn-cmp-btn-primary:hover { background: var(--brass-400, #d2ad62); }
.sn-cmp-btn-ghost { background: transparent; color: var(--fg-on-dark-1, #f4efe7); border-color: rgba(255,255,255,0.28); }
.sn-cmp-btn-ghost:hover { border-color: #fff; }
.sn-cmp-btn-link { background: transparent; color: var(--fg-on-dark-3, #c9c0b2); border: none; text-decoration: underline; text-underline-offset: 3px; padding: 12px 6px; }
.sn-cmp-btn-link:hover { color: #fff; }

/* ── Modal ustawień ────────────────────────────────────── */
.sn-cmp-modal {
  position: fixed; inset: 0; z-index: 100000; display: none;
  align-items: center; justify-content: center; padding: 20px;
  background: rgba(10,8,6,0.6); backdrop-filter: blur(2px);
}
.sn-cmp-modal.is-open { display: flex; }
.sn-cmp-modal-card {
  background: var(--bone-100, #f7f2ea); color: var(--fg-on-light-1, #14110d);
  max-width: 560px; width: 100%; max-height: 88vh; overflow: auto;
  border-radius: var(--radius-tight, 4px); padding: clamp(22px, 3vw, 34px);
  box-shadow: 0 24px 70px rgba(0,0,0,0.45);
}
.sn-cmp-modal-card h2 { font-family: var(--font-heading, inherit); font-weight: 700; font-size: 20px; margin: 0 0 6px; }
.sn-cmp-modal-card > p { font-size: 14px; line-height: 1.6; color: var(--fg-on-light-2, #4a443b); margin: 0 0 18px; }
.sn-cmp-cat {
  display: flex; gap: 14px; align-items: flex-start; padding: 16px 0;
  border-top: 1px solid rgba(20,17,13,0.12);
}
.sn-cmp-cat-body { flex: 1; }
.sn-cmp-cat-body h3 { font-family: var(--font-heading, inherit); font-weight: 700; font-size: 15px; margin: 0 0 4px; }
.sn-cmp-cat-body p { font-size: 13px; line-height: 1.5; color: var(--fg-on-light-2, #4a443b); margin: 0; }
.sn-cmp-cat-toggle { flex-shrink: 0; padding-top: 2px; }

/* przełącznik */
.sn-cmp-sw { position: relative; display: inline-block; width: 44px; height: 24px; }
.sn-cmp-sw input { opacity: 0; width: 0; height: 0; }
.sn-cmp-sw-track { position: absolute; inset: 0; background: #b9b1a4; border-radius: 24px; transition: background 180ms; }
.sn-cmp-sw-track::before { content: ""; position: absolute; left: 3px; top: 3px; width: 18px; height: 18px; background: #fff; border-radius: 50%; transition: transform 180ms; }
.sn-cmp-sw input:checked + .sn-cmp-sw-track { background: var(--brass-500, #c2984c); }
.sn-cmp-sw input:checked + .sn-cmp-sw-track::before { transform: translateX(20px); }
.sn-cmp-sw input:disabled + .sn-cmp-sw-track { background: var(--brass-500, #c2984c); opacity: 0.55; }
.sn-cmp-modal-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 22px; }
.sn-cmp-modal-actions .sn-cmp-btn-primary { background: var(--brass-500, #c2984c); }
.sn-cmp-modal-actions .sn-cmp-btn-ghost { color: var(--fg-on-light-1, #14110d); border-color: rgba(20,17,13,0.3); }

/* ── Re-open (mała pływająca pigułka) ──────────────────── */
.sn-cmp-reopen {
  position: fixed; left: 14px; bottom: 14px; z-index: 99990;
  width: 38px; height: 38px; border-radius: 50%; border: 1px solid rgba(20,17,13,0.15);
  background: #fff; color: var(--ink-900, #14110d); cursor: pointer;
  font-size: 16px; line-height: 1; box-shadow: 0 4px 14px rgba(0,0,0,0.18);
  display: none; align-items: center; justify-content: center;
}
.sn-cmp-reopen.is-visible { display: flex; }
.sn-cmp-reopen:hover { border-color: var(--brass-500, #c2984c); }

@media (max-width: 700px) {
  .sn-cmp-bar-inner { flex-direction: column; align-items: stretch; }
  .sn-cmp-actions { justify-content: stretch; }
  .sn-cmp-actions .sn-cmp-btn-primary, .sn-cmp-actions .sn-cmp-btn-ghost { flex: 1; text-align: center; }
}
