:root{
  --cmp-black:#000; --cmp-white:#fff; --cmp-bg:#fff; --cmp-text:#111;
  --cmp-muted:#60646c; --cmp-border:#e6e8eb; --cmp-overlay:rgba(0,0,0,.54);
  --cmp-shadow:0 20px 60px rgba(0,0,0,.25);

  /* Pozycja FAB */
  --cmp-fab-left-desktop:22px;
  --cmp-fab-bottom-desktop:22px;
  --cmp-fab-left-mobile:20px;
  --cmp-fab-bottom-mobile:22px;
}

#cmp-modal,[id^="cmp-"] *{ box-sizing:border-box; }
[hidden]{ display:none !important; }

/* Ukryj FAB, gdy modal otwarty */
body.cmp-open .cmp-fab{ display:none !important; }

/* ===== FAB ===== */
.cmp-fab{
  position:fixed;
  left:var(--cmp-fab-left-desktop);
  bottom:var(--cmp-fab-bottom-desktop);
  z-index:2147483647;
  width:48px; height:48px;
  border-radius:50%;
  background:#000;
  border:2px solid #000;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 8px 26px rgba(0,0,0,.18);
  cursor:pointer; transition:transform .15s ease, box-shadow .2s ease, background-color .15s ease, border-color .15s ease;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}
.cmp-fab:hover{ transform:translateY(-1px); background:#222; border-color:#222; }
.cmp-fab:focus{ outline:2px solid #222; outline-offset:3px; }
.cmp-fab-ico{ width:26px; height:26px; fill:#fff; display:block; }

/* ===== Modal ===== */
.cmp-modal[aria-hidden="true"]{ display:none; }
.cmp-modal{ position:fixed; inset:0; z-index:2147483646; display:flex; align-items:center; justify-content:center; }
.cmp-backdrop{ position:absolute; inset:0; background:var(--cmp-overlay); }

/* Panel */
.cmp-panel{
  position:relative; background:var(--cmp-bg); color:var(--cmp-text);
  width:min(860px, 92vw); max-height:88vh; overflow:auto;
  border-radius:24px; box-shadow:var(--cmp-shadow); padding:20px 24px 16px;
}
.cmp-panel > *:last-child{ margin-bottom:0; }

/* Close */
.cmp-close{
  position:absolute; top:20px; right:20px;
  width:36px; height:36px; display:flex; align-items:center; justify-content:center;
  border-radius:999px; background:#fff; border:1px solid #d9d9d9;
  font-size:24px; line-height:1; cursor:pointer; color:#111; padding:0;
  box-shadow:0 2px 10px rgba(0,0,0,.06);
}
.cmp-close:hover{ transform:scale(1.05); }

/* Header */
.cmp-header h2{ margin:0 64px 14px 0; font-size:20px; line-height:1.25; font-weight:700; }
.cmp-desc{ margin:0 0 12px; color:var(--cmp-text); font-size:14px; line-height:1.55; }

/* Link „Pokaż więcej” */
.cmp-more{
  appearance:none; -webkit-appearance:none;
  background:transparent !important; border:0 !important; box-shadow:none !important;
  margin-left:.35rem; padding:0 !important; cursor:pointer;
  color:#1a73e8 !important; text-decoration:underline; text-underline-offset:2px;
  font:inherit !important; font-size:1em !important; font-weight:inherit !important; line-height:inherit !important;
  display:inline;
}
.cmp-more:hover, .cmp-more:focus{
  color:#1a73e8 !important; background:transparent !important;
}

.cmp-desc-more{ font-size:13.5px; line-height:1.6; color:#333; }
.cmp-desc-more p{ margin:.55em 0; }

/* Accordion */
.cmp-accordion{ border-top:1px solid var(--cmp-border); margin-top:10px; }
.cmp-acc{ border-bottom:1px solid var(--cmp-border); }
.cmp-acc summary{
  list-style:none;
  display:grid; grid-template-columns: 16px 1fr auto; align-items:center;
  column-gap:10px; padding:12px 4px; cursor:pointer; font-size:15px; text-align:left;
}
.cmp-acc summary::-webkit-details-marker{ display:none; }
.cmp-acc summary::before{
  content:""; width:9px; height:9px; border-right:2px solid #6b6f75; border-bottom:2px solid #6b6f75;
  transform:rotate(-45deg); justify-self:center;
}
.cmp-acc[open] summary::before{ transform:rotate(45deg); }
.cmp-acc-title{ font-weight:600; }
.cmp-acc-body{ padding:0 4px 12px 30px; color:#3c3f44; font-size:13.5px; line-height:1.6; }

.cmp-badge{ font-size:12px; color:#2e7d32; font-weight:700; }

/* Switch */
.cmp-switch{ position:relative; display:inline-flex; align-items:center; }
.cmp-switch input{ position:absolute; opacity:0; pointer-events:none; }
.cmp-slider{
  width:42px; height:24px; border-radius:999px; background:#dadde1; position:relative; display:block;
  transition:background .2s ease; outline:1px solid #cfd4d9; outline-offset:-1px;
}
.cmp-slider::after{
  content:""; position:absolute; top:3px; left:3px; width:18px; height:18px; border-radius:50%;
  background:#fff; box-shadow:0 1px 2px rgba(0,0,0,.2); transition:transform .2s ease;
}
.cmp-switch input:checked + .cmp-slider{ background:#9aa0a6; outline-color:#9aa0a6; }
.cmp-switch input:checked + .cmp-slider::after{ transform:translateX(18px); }

/* Actions */
.cmp-actions{
  display:flex; justify-content:flex-end; gap:10px; margin-top:14px; margin-bottom:0;
}
.cmp-btn{
  appearance:none; border-radius:999px; padding:9px 14px;
  font-weight:700; cursor:pointer; text-align:center;
  transition:transform .06s ease, opacity .2s ease, box-shadow .2s ease, background-color .15s ease, color .15s ease, border-color .15s ease;
  font-size:13.5px; line-height:1;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}
.cmp-btn:hover{ transform:translateY(-1px); }
.cmp-btn:active{ transform:translateY(0); }

/* Outline buttons (Dostosuj / Zapisz) */
.cmp-btn--outline{
  background:#fff !important;
  color:#000 !important;
  border:1px solid #000 !important;
  background-image:none !important;
  text-shadow:none !important;
}
.cmp-btn--outline:hover,
.cmp-btn--outline:active,
.cmp-btn--outline:focus-visible{
  background:#000 !important;
  color:#fff !important;
  border-color:#000 !important;
}

/* Wymuszenie (nadpisy motywów) */
#cmp-modal .cmp-actions .cmp-btn.cmp-btn--outline,
#cmp-modal .cmp-actions button.cmp-btn--outline,
#cmp-modal .cmp-panel .cmp-btn--outline{
  background:#fff !important;
  color:#000 !important;
  border:1px solid #000 !important;
  background-image:none !important;
  text-shadow:none !important;
}
#cmp-modal .cmp-actions .cmp-btn.cmp-btn--outline:hover,
#cmp-modal .cmp-actions .cmp-btn.cmp-btn--outline:active,
#cmp-modal .cmp-actions .cmp-btn.cmp-btn--outline:focus-visible{
  background:#000 !important;
  color:#fff !important;
  border-color:#000 !important;
}

/* Akceptacja – większy czarny; hover: biały z czarną obwódką; brak animacji */
.cmp-btn--accept{
  background:#000 !important;
  color:#fff !important;
  border:1px solid #000 !important;
  padding:12px 18px; /* większy */
  font-size:14.5px;
  box-shadow:none !important;
  animation:none !important;
}
.cmp-btn--accept:hover,
.cmp-btn--accept:active,
.cmp-btn--accept:focus-visible{
  background:#fff !important;
  color:#000 !important;
  border-color:#000 !important;
}

/* Wysokość panelu */
.cmp-panel{ height:auto; }
.cmp--expanded .cmp-panel{ height:auto; max-height:88vh; }

/* Mobile */
@media (max-width:768px){
  .cmp-fab{
    left:var(--cmp-fab-left-mobile);
    bottom:var(--cmp-fab-bottom-mobile);
    width:44px; height:44px;
  }
  .cmp-modal{ align-items:flex-end; }
  .cmp-panel{
    width:100%; border-radius:16px 16px 0 0; padding:18px 16px 12px;
  }
  .cmp-panel{ height:auto; max-height:none; }
  .cmp--expanded .cmp-panel{ height:88dvh; max-height:88dvh; }

  .cmp-header h2{ font-size:18px; margin-right:44px; margin-bottom:12px; line-height:1.2; }
  .cmp-desc{ font-size:13px; }
  .cmp-desc-more{ font-size:12.8px; }
  .cmp-close{ top:14px; right:14px; width:36px; height:36px; font-size:24px; }

  .cmp-actions{ flex-direction:column; gap:8px; margin-top:12px; }
  .cmp-actions .cmp-btn{ width:100%; }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  .cmp-fab, .cmp-btn, .cmp-slider, .cmp-slider::after{
    transition:none !important; animation:none !important;
  }
  .cmp-btn--accept{ animation:none !important; }
}