/* =========================
   COOKIE CONSENT (scoped)
   ========================= */

.cookieOverlay{
  position:fixed;
  inset:0;
  z-index:9999;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  padding:16px;
  background:rgba(18,18,18,.16);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.cookieCard{
  width:min(760px, 100%);
  background:var(--paper);
  border:var(--border);
  border-radius:calc(var(--radius) + 4px);
  box-shadow:var(--shadow);
  padding:18px;
  overflow:hidden;
}

.cookieTop{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.cookieTopLeft{
  display:flex;
  align-items:flex-start;
  gap:0;
}

/* Gentle cookie watermark inside the card */
.cookieCard{ position:relative; }
.cookieCard::after{
  content:"";
  position:absolute;
  right:12px;
  top:10px;
  width:126px;
  height:126px;
  background:url("/assets/cookie.png") no-repeat center / contain;
  opacity:.08;
  transform: rotate(10deg);
  pointer-events:none;
}

.cookieTitle{
  font-weight:950;
  letter-spacing:-0.02em;
  font-size:18px;
}

.cookieText{
  margin-top:8px;
  color:rgba(18,18,18,.78);
  font-weight:650;
  line-height:1.35;
}

.cookieActions{
  margin-top:14px;
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.cookieMini{
  margin-top:10px;
  font-size:13px;
  color:rgba(18,18,18,.62);
}

.cookiePrefs{
  margin-top:12px;
  padding-top:12px;
  border-top:2px dashed rgba(18,18,18,.18);
  display:none;
}

.cookiePrefs.isOpen{display:block;}

.cookieRow{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 0;
}

.cookieRowTitle{
  font-weight:900;
}

.cookieToggle{
  display:inline-flex;
  align-items:center;
  gap:10px;
}

.cookieSwitch{
  width:54px;
  height:32px;
  border-radius:999px;
  border:var(--border);
  background:rgba(18,18,18,.08);
  box-shadow:var(--shadowSm);
  position:relative;
  cursor:pointer;
  user-select:none;
  flex:none;
}
.cookieSwitch::after{
  content:"";
  position:absolute;
  top:50%;
  left:6px;
  width:22px;height:22px;
  border-radius:999px;
  transform:translateY(-50%);
  background:#fff;
  border:2px solid rgba(18,18,18,.18);
  transition: transform .16s ease;
}
.cookieSwitch[data-on="true"]{
  background:color-mix(in srgb, var(--brand) 82%, #fff 18%);
}
.cookieSwitch[data-on="true"]::after{
  transform:translate(20px,-50%);
}

.cookieX{
  border:none;
  background:transparent;
  padding:8px;
  border-radius:999px;
  cursor:pointer;
}
.cookieX:hover{
  background:rgba(18,18,18,.06);
}
.cookieX .ms{
  font-size:22px;
}

@media (min-width: 860px){
  .cookieOverlay{align-items:flex-end;padding:22px;}
  .cookieCard{padding:20px;}
  .cookieTitle{font-size:19px;}
}