/* Cookie-/Einwilligungs-Banner fuer johann-hinger.com.
   Ruhige Galerie-Optik passend zur Seite. Vanilla, kein Framework. */
:root{
  --jhc-paper:#F8F4ED; --jhc-paper2:#F1E8D9; --jhc-ink:#2B2521;
  --jhc-inksoft:#5C5247; --jhc-line:rgba(43,37,33,.18);
  --jhc-sienna:#A83E2C; --jhc-sienna-deep:#87301F;
  --jhc-sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
}

.jhc-backdrop{
  position:fixed;inset:0;z-index:9998;
  background:rgba(43,37,33,.28);
  backdrop-filter:saturate(.9) blur(1px);
  opacity:0;transition:opacity .25s ease;
}
.jhc-backdrop.is-on{opacity:1}

.jhc{
  position:fixed;z-index:9999;left:50%;bottom:1.1rem;transform:translateX(-50%) translateY(0);
  width:min(680px,calc(100vw - 2rem));
  background:var(--jhc-paper);
  border:1px solid var(--jhc-line);
  border-radius:2px;
  box-shadow:0 18px 50px -12px rgba(43,37,33,.35);
  font-family:var(--jhc-sans);color:var(--jhc-ink);
  opacity:0;transition:opacity .3s ease, transform .3s ease;
}
.jhc.is-on{opacity:1}
.jhc[hidden]{display:none}

.jhc-body{padding:1.4rem 1.5rem 1.25rem}
.jhc-title{
  font-family:var(--jhc-sans);font-size:.72rem;font-weight:600;
  letter-spacing:.18em;text-transform:uppercase;color:var(--jhc-sienna);
}
.jhc-text{margin-top:.55rem;font-size:.86rem;line-height:1.55;color:var(--jhc-inksoft)}
.jhc-text a{color:var(--jhc-ink);text-underline-offset:2px}
.jhc-text a:hover{color:var(--jhc-sienna)}

.jhc-actions{
  margin-top:1.1rem;display:flex;flex-wrap:wrap;gap:.6rem;
}
.jhc-btn{
  font:inherit;font-size:.82rem;font-weight:500;letter-spacing:.02em;
  padding:.62rem 1.15rem;border-radius:1px;cursor:pointer;
  border:1px solid var(--jhc-line);background:transparent;color:var(--jhc-ink);
  transition:background-color .25s ease,color .25s ease,border-color .25s ease;
}
.jhc-btn:hover{border-color:var(--jhc-ink)}
.jhc-btn--primary{background:var(--jhc-sienna);border-color:var(--jhc-sienna);color:#FBF7F0}
.jhc-btn--primary:hover{background:var(--jhc-sienna-deep);border-color:var(--jhc-sienna-deep)}
.jhc-btn--link{border:0;padding:.62rem .35rem;color:var(--jhc-inksoft);text-decoration:underline;text-underline-offset:3px}
.jhc-btn--link:hover{color:var(--jhc-sienna)}
.jhc-btn:focus-visible{outline:2px solid var(--jhc-sienna);outline-offset:2px}

/* Einstellungen-Panel */
.jhc-settings{display:none;margin-top:1.1rem;border-top:1px solid var(--jhc-line);padding-top:1rem}
.jhc.is-settings .jhc-settings{display:block}
.jhc.is-settings .jhc-actions--main{display:none}

.jhc-cat{padding:.7rem 0;border-bottom:1px solid var(--jhc-line)}
.jhc-cat:last-of-type{border-bottom:0}
.jhc-cat-head{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.jhc-cat-name{font-size:.85rem;font-weight:600}
.jhc-cat-desc{margin-top:.3rem;font-size:.78rem;line-height:1.5;color:var(--jhc-inksoft)}

/* Toggle */
.jhc-switch{position:relative;width:40px;height:22px;flex:none}
.jhc-switch input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}
.jhc-switch span{
  position:absolute;inset:0;border-radius:22px;background:rgba(43,37,33,.22);
  transition:background-color .2s ease;
}
.jhc-switch span::after{
  content:"";position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;
  background:#FBF7F0;box-shadow:0 1px 3px rgba(43,37,33,.4);transition:transform .2s ease;
}
.jhc-switch input:checked + span{background:var(--jhc-sienna)}
.jhc-switch input:checked + span::after{transform:translateX(18px)}
.jhc-switch input:disabled + span{background:rgba(43,37,33,.32);opacity:.65}
.jhc-switch input:focus-visible + span{outline:2px solid var(--jhc-sienna);outline-offset:2px}

/* Reopener (Fusszeilen-Link erledigt das meist; dieser ist optional) */
.jhc-reopen{
  position:fixed;left:.9rem;bottom:.9rem;z-index:9997;
  font-family:var(--jhc-sans);font-size:.66rem;letter-spacing:.06em;
  color:rgba(43,37,33,.55);background:var(--jhc-paper);
  border:1px solid var(--jhc-line);border-radius:1px;padding:.3rem .55rem;cursor:pointer;
}
.jhc-reopen:hover{color:var(--jhc-sienna);border-color:var(--jhc-sienna)}

@media (max-width:520px){
  .jhc{bottom:0;left:0;transform:none;width:100%;border-radius:0;border-left:0;border-right:0;border-bottom:0}
  .jhc-actions{flex-direction:column}
  .jhc-btn{width:100%}
  .jhc-btn--link{width:auto;align-self:center}
}
@media (prefers-reduced-motion:reduce){
  .jhc,.jhc-backdrop,.jhc-switch span,.jhc-switch span::after{transition:none}
}