/* ──────────────────────────────────────────────────────────────
   CKF cookie consent
   Design tokens are declared per page inside each file's :root
   block. Fallback values are inlined here so the component also
   renders correctly on 404.html, which does not carry that block.
   ────────────────────────────────────────────────────────────── */

.ckf-cc{
  position:fixed;
  left:18px;
  bottom:18px;
  width:340px;
  z-index:400;
  box-sizing:border-box;
  background:#FFFFFF;
  border:1.5px solid var(--line,#E8DDC8);
  border-radius:20px;
  padding:16px 18px;
  box-shadow:0 8px 32px rgba(32,41,38,.10);
  font-family:var(--font-body,"Inter","Helvetica Neue",Arial,sans-serif);
  color:var(--ink,#202926);
  animation:ckf-cc-in 300ms ease both;
}
.ckf-cc *{box-sizing:border-box;}

@keyframes ckf-cc-in{
  from{opacity:0;transform:translateY(8px);}
  to{opacity:1;transform:translateY(0);}
}

/* ── Header row ── */
.ckf-cc-head{display:flex;align-items:flex-start;gap:10px;}
.ckf-cc-title{
  flex:1 1 auto;
  display:flex;
  align-items:center;
  gap:6px;
  margin:0;
  font-family:var(--font-display,"Archivo","Helvetica Neue",Arial,sans-serif);
  font-weight:700;
  font-size:15px;
  line-height:1.3;
  color:var(--ink,#202926);
}
.ckf-cc-ico{
  flex:0 0 auto;
  display:block;
  width:16px;
  height:16px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.4;
  stroke-linecap:round;
  color:var(--muted,#828282);
}
.ckf-cc-ico path{stroke-width:2;}
.ckf-cc-close{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  justify-content:center;
  width:28px;
  height:28px;
  padding:0;
  border:none;
  border-radius:50%;
  background:var(--tan-deep,#F1E4CC);
  color:var(--ink,#202926);
  cursor:pointer;
}
.ckf-cc-close svg{
  width:12px;
  height:12px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.6;
  stroke-linecap:round;
}

/* ── Body ── */
.ckf-cc-body{
  margin:6px 0 0;
  font-weight:400;
  font-size:12.5px;
  line-height:1.55;
  color:var(--ink-soft,#3A4340);
}
.ckf-cc-link{
  color:inherit;
  text-decoration:underline;
}
.ckf-cc-link:hover,
.ckf-cc-link:focus{color:inherit;}

/* ── Category rows ── */
.ckf-cc-panel{display:none;margin-top:10px;}
.ckf-cc.is-expanded .ckf-cc-panel{display:block;}
.ckf-cc-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 0;
  border-top:1px solid var(--line,#E8DDC8);
}
.ckf-cc-name{
  font-weight:600;
  font-size:12.5px;
  line-height:1.3;
  color:var(--ink,#202926);
}
.ckf-cc-badge{
  margin-left:6px;
  font-weight:500;
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--muted,#828282);
}
.ckf-cc-desc{
  margin:2px 0 0;
  font-weight:400;
  font-size:11.5px;
  line-height:1.45;
  color:var(--muted,#828282);
}

/* ── Toggle ── */
.ckf-cc-tg{
  position:relative;
  flex:0 0 auto;
  width:32px;
  height:18px;
  padding:0;
  border:none;
  border-radius:999px;
  background:#D3C7B0;
  cursor:pointer;
  transition:background 160ms ease;
}
.ckf-cc-tg::after{
  content:"";
  position:absolute;
  top:2px;
  left:2px;
  width:14px;
  height:14px;
  border-radius:50%;
  background:#FFFFFF;
  transition:transform 160ms ease;
}
.ckf-cc-tg[aria-checked="true"]{background:var(--ink,#202926);}
.ckf-cc-tg[aria-checked="true"]::after{transform:translateX(14px);}
.ckf-cc-tg[disabled]{background:var(--muted,#828282);cursor:default;}

/* ── Action row ── */
.ckf-cc-actions{
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:12px;
}
.ckf-cc-actions button{
  font-family:inherit;
  font-weight:600;
  font-size:13px;
  line-height:1;
  padding:9px 18px;
  border-radius:999px;
  background:#FFFFFF;
  color:var(--ink,#202926);
  border:1.5px solid #202926;
  cursor:pointer;
  white-space:nowrap;
}
.ckf-cc-actions button:hover{background:var(--cream,#FBF5EA);}
/* Two classes, so the general action-button rule above cannot override it. */
.ckf-cc-actions .ckf-cc-manage{
  margin-left:auto;
  padding:0;
  border:none;
  border-radius:0;
  background:transparent;
  font-family:inherit;
  font-weight:500;
  font-size:12px;
  line-height:1.2;
  color:var(--ink-soft,#3A4340);
  text-decoration:underline;
  cursor:pointer;
  white-space:nowrap;
}
.ckf-cc-actions .ckf-cc-manage:hover{background:transparent;}
.ckf-cc-save{display:none;}
.ckf-cc.is-expanded .ckf-cc-save{display:inline-block;}
.ckf-cc.is-expanded .ckf-cc-reject,
.ckf-cc.is-expanded .ckf-cc-manage{display:none;}

/* ── Focus ── */
.ckf-cc :focus-visible{
  outline:2px solid var(--ink,#202926);
  outline-offset:2px;
}

/* Focused controls are kept clear of the card by cookie-consent.js:
   it reserves the card's height in the footer and in html
   scroll-padding-bottom, and scrolls a focused element above it. */

/* ── Responsive ── */
@media (max-width:640px){
  .ckf-cc{
    left:12px;
    right:12px;
    bottom:12px;
    width:auto;
    padding:12px 14px;
  }
  .ckf-cc-title{font-size:14px;}
  .ckf-cc-body{margin-top:4px;font-size:12px;line-height:1.45;}
  .ckf-cc-actions{margin-top:10px;}
  .ckf-cc-actions button:not(.ckf-cc-manage){padding:7px 14px;}
  .ckf-cc-accept,
  .ckf-cc-reject{flex:1 1 0;}
}

/* ── Motion ── */
@media (prefers-reduced-motion: reduce){
  .ckf-cc{animation:none;}
  .ckf-cc-tg,
  .ckf-cc-tg::after{transition:none;}
}