/* ============================================================
   Pool Party – Cookie banner & modal (v1.2)
   - Typo unifiée (Poppins)
   - Boutons lisibles (thème-safe)
   - Styles SCOPÉS au composant pour éviter tout conflit global
   ============================================================ */

/* -------- Variables / Typo -------- */
:root{
  --pp-font: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
  --pp-bg: #0b1220;
  --pp-text: #e6ecff;
  --pp-muted: #a8b3cf;
  --pp-border: #1f2a44;
  --pp-btn: #101727;
  --pp-primary: #4f8cff;
}

/* Scope typographique */
.pp-cookie-banner,
.pp-cookie-banner * ,
.pp-cookie-modal,
.pp-cookie-modal * {
  font-family: var(--pp-font) !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  letter-spacing: .2px;
}

/* -------- Banner -------- */
.pp-cookie-banner{
  position:fixed;left:0;right:0;bottom:0;z-index:9999;
  background:var(--pp-bg);color:var(--pp-text);
  border-top:1px solid var(--pp-border);
}
.pp-cookie-wrap{
  max-width:1100px;margin:0 auto;padding:16px 20px;
  display:flex;gap:16px;align-items:start;
}
.pp-cookie-text{flex:1;font-size:14px;line-height:1.5;color:var(--pp-text)}
.pp-cookie-text a{color:var(--pp-primary);text-decoration:underline}
.pp-cookie-actions{display:flex;flex-wrap:wrap;gap:8px}

/* -------- Modal -------- */
.pp-cookie-modal-backdrop{
  position:fixed;inset:0;background:rgba(0,0,0,.5);display:none;z-index:10000
}
.pp-cookie-modal{
  position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);
  background:var(--pp-bg);color:var(--pp-text);
  border:1px solid var(--pp-border);border-radius:12px;
  max-width:560px;width:92%;padding:20px;display:none;z-index:10001
}
.pp-cookie-modal h3{
  margin:0 0 8px;font-weight:700;line-height:1.25
}
.pp-pref-row{
  display:flex;justify-content:space-between;align-items:center;
  padding:10px 0;border-bottom:1px solid var(--pp-border)
}
.pp-note{font-size:12px;color:var(--pp-muted);margin-top:12px}

/* -------- Switch -------- */
.pp-switch{position:relative;display:inline-block;width:48px;height:26px}
.pp-switch input{opacity:0;width:0;height:0}
.pp-slider{
  position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;
  background:var(--pp-border);border-radius:26px;transition:.2s
}
.pp-slider:before{
  content:"";position:absolute;height:20px;width:20px;left:3px;top:3px;
  background:#fff;border-radius:50%;transition:.2s
}
.pp-switch input:checked + .pp-slider{background:var(--pp-primary)}
.pp-switch input:checked + .pp-slider:before{transform:translateX(22px)}

/* -------- Buttons (SCOPÉS) -------- */
.pp-cookie-banner .pp-btn,
.pp-cookie-modal  .pp-btn{
  border:1px solid var(--pp-border);
  background:var(--pp-btn);
  color:var(--pp-text);
  padding:10px 14px;border-radius:8px;cursor:pointer;
  font-weight:600; font-family:inherit;
  transition:background .15s ease, border-color .15s ease, opacity .15s ease;
  box-shadow:none; filter:none;
}
.pp-cookie-banner .pp-btn:hover,
.pp-cookie-modal  .pp-btn:hover{opacity:.92}

.pp-cookie-banner .pp-btn-primary,
.pp-cookie-modal  .pp-btn-primary{
  background:var(--pp-primary);border-color:var(--pp-primary);color:#fff
}
.pp-cookie-banner .pp-btn-ghost,
.pp-cookie-modal  .pp-btn-ghost{
  background:transparent;border:1px solid var(--pp-border);color:var(--pp-text)
}
.pp-cookie-banner .pp-btn[disabled],
.pp-cookie-modal  .pp-btn[disabled]{opacity:.6;cursor:not-allowed}

/* Focus visible (a11y) */
.pp-cookie-banner .pp-btn:focus-visible,
.pp-cookie-modal  .pp-btn:focus-visible{
  outline:2px solid var(--pp-primary);
  outline-offset:2px;
  box-shadow:0 0 0 2px rgba(79,140,255,.25);
}

/* -------- Responsive -------- */
@media (max-width:600px){
  .pp-cookie-wrap{flex-direction:column}
}

/* -------- Fine-tuning -------- */
.pp-cookie-text{ line-height: 1.5; }
.pp-cookie-text a{ font-weight: 600; }