/* FXaeo Cookie Consent, reusable component styles
   Self-contained: uses its own --cc-* custom properties (defaulted to
   FXaeo's dark/mono aesthetic) so this file can be dropped into any site
   unchanged. To reskin for another site, override the --cc-* variables
   in that site's own stylesheet rather than editing this file. */

:root{
  --cc-bg:#0a0a0a;
  --cc-fg:#e5e5e5;
  --cc-muted:#8a8a8a;
  --cc-border:#262626;
  --cc-white:#ffffff;
  --cc-black:#000000;
  --cc-green:#3fb950;
  --cc-font:"Geist",ui-sans-serif,system-ui,sans-serif;
  --cc-mono:"Geist Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --cc-radius:0px;
  --cc-max:1120px;
  --cc-z:9999;
}

.cc-banner,.cc-modal,.cc-reopen{box-sizing:border-box;}
.cc-banner *,.cc-modal *,.cc-reopen *{box-sizing:border-box;}

/* ---------- bottom banner ---------- */
.cc-banner{
  position:fixed;left:0;right:0;bottom:0;
  z-index:var(--cc-z);
  background:var(--cc-bg);
  border-top:1px solid var(--cc-border);
  color:var(--cc-fg);
  font-family:var(--cc-font);
  padding:20px;
  animation:cc-slide-up .25s ease both;
}
@keyframes cc-slide-up{from{transform:translateY(12px);opacity:0}to{transform:translateY(0);opacity:1}}
.cc-banner[hidden]{display:none;}
.cc-banner-inner{
  max-width:var(--cc-max);
  margin:0 auto;
  display:flex;
  flex-wrap:wrap;
  gap:20px;
  align-items:flex-end;
  justify-content:space-between;
}
.cc-headline{
  font-family:var(--cc-mono);
  font-size:12px;
  font-weight:600;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--cc-white);
  margin:0 0 8px;
}
.cc-body{
  max-width:640px;
  font-size:14px;
  line-height:1.55;
  color:rgba(255,255,255,.7);
  margin:0;
}
.cc-body a{color:var(--cc-fg);text-decoration:underline;}
.cc-actions{display:flex;flex-wrap:wrap;gap:10px;flex:none;}
.cc-btn{
  font-family:var(--cc-mono);
  text-transform:uppercase;
  font-size:12px;
  font-weight:600;
  letter-spacing:.02em;
  padding:12px 20px;
  border:1px solid var(--cc-border);
  border-radius:var(--cc-radius);
  cursor:pointer;
  background:transparent;
  color:var(--cc-fg);
  white-space:nowrap;
}
.cc-btn:hover{border-color:#454545;background:rgba(255,255,255,.04);}
.cc-btn-primary{background:var(--cc-white);color:var(--cc-black);border-color:var(--cc-white);}
.cc-btn-primary:hover{opacity:.85;background:var(--cc-white);}
.cc-btn-ghost{border-color:transparent;color:var(--cc-muted);}
.cc-btn-ghost:hover{color:var(--cc-white);background:transparent;border-color:transparent;text-decoration:underline;}

/* ---------- customize modal ---------- */
.cc-modal-backdrop{
  position:fixed;inset:0;z-index:calc(var(--cc-z) - 1);
  background:rgba(0,0,0,.6);
}
.cc-modal-backdrop[hidden]{display:none;}
.cc-modal{
  position:fixed;
  left:50%;top:50%;
  transform:translate(-50%,-50%);
  z-index:var(--cc-z);
  width:min(560px, calc(100vw - 32px));
  max-height:calc(100vh - 64px);
  overflow-y:auto;
  background:var(--cc-bg);
  border:1px solid var(--cc-border);
  color:var(--cc-fg);
  font-family:var(--cc-font);
}
.cc-modal[hidden]{display:none;}
.cc-modal-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:20px 22px;border-bottom:1px solid var(--cc-border);
}
.cc-modal-head h2{font-size:16px;font-weight:500;color:var(--cc-white);margin:0;letter-spacing:-.01em;}
.cc-modal-close{background:none;border:none;color:var(--cc-muted);font-size:20px;line-height:1;cursor:pointer;padding:4px;}
.cc-modal-close:hover{color:var(--cc-white);}
.cc-modal-body{padding:4px 22px;}
.cc-cat{border-bottom:1px solid var(--cc-border);padding:18px 0;}
.cc-cat:last-child{border-bottom:none;}
.cc-cat-head{display:flex;align-items:center;justify-content:space-between;gap:16px;}
.cc-cat-title{font-size:14.5px;font-weight:500;color:var(--cc-white);}
.cc-cat-desc{margin-top:6px;font-size:13px;line-height:1.55;color:rgba(255,255,255,.6);}
.cc-modal-foot{
  display:flex;flex-wrap:wrap;gap:10px;
  padding:18px 22px 22px;border-top:1px solid var(--cc-border);
}
.cc-modal-foot .cc-btn{flex:1 1 auto;}

/* ---------- toggle switch ---------- */
.cc-switch{position:relative;display:inline-block;width:40px;height:22px;flex:none;}
.cc-switch input{opacity:0;width:0;height:0;position:absolute;}
.cc-switch .track{
  position:absolute;inset:0;background:var(--cc-border);
  border:1px solid var(--cc-border);cursor:pointer;transition:.15s;
}
.cc-switch .track::before{
  content:"";position:absolute;left:2px;top:2px;
  width:16px;height:16px;background:var(--cc-muted);
  transition:.15s;
}
.cc-switch input:checked + .track{background:rgba(63,185,80,.15);border-color:var(--cc-green);}
.cc-switch input:checked + .track::before{transform:translateX(18px);background:var(--cc-green);}
.cc-switch input:disabled + .track{opacity:.5;cursor:not-allowed;}
.cc-switch input:disabled + .track::before{background:var(--cc-muted);}
.cc-locked{
  font-family:var(--cc-mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--cc-muted);flex:none;
}

/* ---------- reopen tab ---------- */
.cc-reopen{
  position:fixed;left:16px;bottom:16px;z-index:calc(var(--cc-z) - 2);
  background:var(--cc-bg);border:1px solid var(--cc-border);color:var(--cc-muted);
  font-family:var(--cc-mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;
  padding:9px 12px;cursor:pointer;
}
.cc-reopen:hover{color:var(--cc-white);border-color:#454545;}
.cc-reopen[hidden]{display:none;}

@media(max-width:640px){
  .cc-banner-inner{flex-direction:column;align-items:stretch;}
  .cc-actions{flex-direction:column;}
  .cc-actions .cc-btn{width:100%;}
}
