/* ============================================================
   FlameCraft – style modułu cookies. Wszystkie klasy z prefiksem fcc-.
   Przyciski: klasy .mc-btn (+ .gold / .blue / .sm) zdefiniowane niżej,
   w stylistyce strony (ciemne szkło + pomarańczowy akcent).
   ============================================================ */

/* Atrybut hidden ma wygrać z display ustawionym niżej */
.fcc-banner[hidden], .fcc-overlay[hidden], .fcc-note[hidden], .fcc-svcs[hidden]{ display:none }

html.fcc-lock{ overflow:hidden; scrollbar-gutter:stable }

/* ---- Przyciski modułu ---- */
.mc-btn{
  position:relative; display:inline-flex; align-items:center; justify-content:center; gap:8px;
  min-height:44px; padding:0 18px; border-radius:5px; cursor:pointer;
  font:700 13px/1.1 var(--f-ui,"Montserrat",system-ui,sans-serif); letter-spacing:.1em; text-transform:uppercase; text-align:center;
  color:var(--c-text,#f3eee6); background:rgba(255,255,255,.04); border:1.5px solid rgba(255,138,31,.55);
  transition:background-color .2s, box-shadow .2s, transform .2s, border-color .2s;
}
.mc-btn:hover{ background:rgba(255,138,31,.12); border-color:var(--c-flame,#ff8a1f); box-shadow:0 0 18px rgba(255,138,31,.3) }
.mc-btn:active{ transform:translateY(1px) }
.mc-btn:focus-visible{ outline:2px solid var(--c-flame-hi,#ffb23f); outline-offset:3px }
.mc-btn.gold{
  color:#2a1405; border-color:#ffc861;
  background:linear-gradient(180deg,#ffb23f 0%,#ff8a1f 55%,#e86a12 100%);
  box-shadow:0 0 16px rgba(255,138,31,.35), inset 0 1px 0 rgba(255,255,255,.45);
}
.mc-btn.gold:hover{ box-shadow:0 0 28px rgba(255,138,31,.6), inset 0 1px 0 rgba(255,255,255,.5) }
.mc-btn.blue{ border-color:rgba(127,196,255,.6); color:#dcefff }
.mc-btn.blue:hover{ background:rgba(127,196,255,.12); border-color:#7fc4ff; box-shadow:0 0 18px rgba(127,196,255,.25) }
.mc-btn.sm{ min-height:40px; padding:0 14px; font-size:12px }
.mc-btn:disabled,.mc-btn[aria-disabled="true"]{ opacity:.5; pointer-events:none }

/* ---- Baner (nie zasłania #cookieBtn: 16px + 52px + odstęp) ---- */
.fcc-banner{
  position:fixed; z-index:60; left:84px; right:16px; bottom:16px; max-width:820px;
  padding:18px 22px; color:var(--c-text,#f3eee6); font-family:var(--f-ui,"Montserrat",system-ui,sans-serif);
  background:rgba(13,12,16,.94); border:1px solid rgba(255,138,31,.45); border-radius:8px;
  -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px);
  box-shadow:0 18px 48px rgba(0,0,0,.6), 0 0 26px rgba(255,138,31,.14);
  animation:fccIn .35s cubic-bezier(.16,1,.3,1);
}
.fcc-title{ margin:0 0 6px; font:700 15px/1.3 var(--f-ui,"Montserrat",sans-serif); letter-spacing:.14em; text-transform:uppercase; color:var(--c-flame-hi,#ffb23f) }
.fcc-text{ margin:0 0 14px; font-size:14.5px; line-height:1.55; color:var(--c-muted,#b9b0a3) }
.fcc-link{ color:var(--c-flame-hi,#ffb23f); text-decoration:underline; text-underline-offset:2px }
.fcc-link:hover{ color:#fff }
.fcc-link:focus-visible{ outline:2px solid var(--c-flame-hi,#ffb23f); outline-offset:2px }
.fcc-row{ display:flex; flex-wrap:wrap; gap:10px }
.fcc-row .mc-btn{ flex:1 1 140px }

/* ---- Panel ---- */
.fcc-overlay{
  position:fixed; inset:0; z-index:61; display:flex; align-items:center; justify-content:center;
  padding:12px; background:rgba(4,4,8,.72); -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px);
}
.fcc-dialog{
  display:flex; flex-direction:column; width:100%; max-width:640px; max-height:100%;
  color:var(--c-text,#f3eee6); font-family:var(--f-ui,"Montserrat",system-ui,sans-serif);
  background:rgba(13,12,16,.97); border:1px solid rgba(255,138,31,.45); border-radius:10px;
  box-shadow:0 24px 60px rgba(0,0,0,.7), 0 0 30px rgba(255,138,31,.14);
  animation:fccIn .3s cubic-bezier(.16,1,.3,1);
}
.fcc-dialog:focus{ outline:none }
.fcc-dlg-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:16px 16px 10px 22px }
.fcc-dlg-title{ margin:0; font:700 16px/1.3 var(--f-ui,"Montserrat",sans-serif); letter-spacing:.14em; text-transform:uppercase; color:var(--c-flame-hi,#ffb23f) }
.fcc-close{
  flex:none; width:40px; height:40px; padding:0; border-radius:6px; font:400 24px/1 var(--f-ui,sans-serif); color:#fff;
  background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.12); cursor:pointer;
}
.fcc-close:hover{ border-color:var(--c-flame,#ff8a1f); color:var(--c-flame-hi,#ffb23f) }
.fcc-close:focus-visible{ outline:2px solid var(--c-flame-hi,#ffb23f); outline-offset:2px }
.fcc-dlg-body{ flex:1 1 auto; overflow-y:auto; padding:4px 22px 12px; overscroll-behavior:contain }
.fcc-dlg-foot{
  display:flex; flex-wrap:wrap; gap:10px; padding:14px 22px 18px; border-top:1px solid rgba(255,138,31,.2);
}
.fcc-dlg-foot .mc-btn{ flex:1 1 150px }

/* ---- Kategorie ---- */
.fcc-cat{ margin:0 0 10px; padding:14px 16px; background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.08); border-radius:7px }
.fcc-cat-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap }
.fcc-cat-title{ margin:0; font:700 15px/1.3 var(--f-ui,sans-serif); color:#fff }
.fcc-cat-desc{ margin:6px 0 0; font-size:14px; line-height:1.5; color:var(--c-muted,#b9b0a3) }
.fcc-empty{ margin:8px 0 0; font-size:13.5px; color:var(--c-muted,#b9b0a3); font-style:italic }

/* ---- Przełącznik ---- */
.fcc-sw{ position:relative; display:inline-flex; align-items:center; gap:10px; cursor:pointer }
.fcc-sw-input{ position:absolute; inset:0 auto 0 0; width:48px; height:100%; margin:0; opacity:0; cursor:inherit }
.fcc-sw-track{
  position:relative; flex:none; width:48px; height:26px; border-radius:999px; background:#2a2730; border:1px solid rgba(255,255,255,.15);
  transition:background-color .2s, border-color .2s;
}
.fcc-sw-track::after{
  content:""; position:absolute; top:3px; left:3px; width:18px; height:18px; border-radius:50%; background:#cfc8bd;
  transition:transform .2s cubic-bezier(.16,1,.3,1), background-color .2s;
}
.fcc-sw-input:checked + .fcc-sw-track{ background:linear-gradient(180deg,#ffb23f,#e86a12); border-color:#ffc861 }
.fcc-sw-input:checked + .fcc-sw-track::after{ transform:translateX(22px); background:#fff }
.fcc-sw-input:focus-visible + .fcc-sw-track{ outline:2px solid var(--c-flame-hi,#ffb23f); outline-offset:3px }
.fcc-sw-input:disabled + .fcc-sw-track{ opacity:.55 }
.fcc-sw-state{ font:600 13px/1 var(--f-ui,sans-serif); color:#e9e3d9; min-width:7.5em }

/* ---- Lista usług ---- */
.fcc-more{
  margin-top:8px; padding:4px 0; background:none; border:0; border-bottom:1px dashed var(--c-flame,#ff8a1f); color:var(--c-flame-hi,#ffb23f);
  font:600 13.5px/1.3 var(--f-ui,sans-serif); cursor:pointer;
}
.fcc-more::before{ content:"▸ " }
.fcc-more[aria-expanded="true"]::before{ content:"▾ " }
.fcc-more:hover{ color:#fff; border-color:#fff }
.fcc-more:focus-visible{ outline:2px solid var(--c-flame-hi,#ffb23f); outline-offset:3px }
.fcc-svcs{ list-style:none; margin:10px 0 0; padding:0; display:grid; gap:10px }
.fcc-svc{ padding:10px 12px; background:rgba(0,0,0,.3); border-left:3px solid var(--c-flame,#ff8a1f); border-radius:0 6px 6px 0 }
.fcc-svc-name{ display:block; margin-bottom:6px; font:700 14px/1.3 var(--f-ui,sans-serif); color:#fff }
.fcc-dl{ display:grid; grid-template-columns:auto 1fr; gap:3px 12px; margin:0; font-size:13.5px; line-height:1.4 }
.fcc-dl dt{ color:var(--c-flame-hi,#ffb23f); font-weight:600 }
.fcc-dl dd{ margin:0; overflow-wrap:anywhere; color:var(--c-muted,#b9b0a3) }

/* ---- Powiadomienie o przeładowaniu ---- */
.fcc-note{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px;
  margin:6px 0 0; padding:10px 14px; font-size:14px; color:#fff; border-radius:7px;
  background:rgba(255,138,31,.1); border:1px solid rgba(255,138,31,.45);
}

/* ---- Animacje ---- */
@keyframes fccIn{ from{ opacity:0; transform:translateY(16px) } to{ opacity:1; transform:none } }
@media (prefers-reduced-motion:reduce){
  .fcc-banner, .fcc-dialog{ animation:none }
  .fcc-sw-track, .fcc-sw-track::after, .mc-btn{ transition:none }
}

/* ---- RWD ---- */
@media (max-width:640px){
  /* przycisk cookies zostaje odsłonięty: baner nad nim */
  .fcc-banner{ left:12px; right:12px; bottom:80px; max-height:calc(100vh - 100px); max-height:calc(100dvh - 100px); overflow-y:auto; padding:14px 16px }
  .fcc-title{ font-size:14px }
  .fcc-overlay{ padding:8px }
  .fcc-dlg-body{ padding:4px 14px 10px }
  .fcc-dlg-foot{ padding:10px 14px 14px }
  .fcc-dl{ grid-template-columns:1fr; gap:0 }
  .fcc-dl dd{ margin-bottom:6px }
}
@media (max-width:360px){
  .fcc-row .mc-btn, .fcc-dlg-foot .mc-btn{ flex-basis:100% }
  .fcc-sw-state{ min-width:0 }
}