/* ideaDIGITAL Cookie und IP – Frontend */

:root{
  --lw-icb-primary:#111827;
  --lw-icb-accent:#2563eb;
  --lw-icb-text:#111827;
  --lw-icb-bg:#ffffff;
  --lw-icb-radius:10px;
  --lw-icb-border-width:1px;

  /* Hover/Active (optional) */
  --lw-icb-accept-hover-bg:var(--lw-icb-accept-bg);
  --lw-icb-accept-hover-text:var(--lw-icb-accept-text);
  --lw-icb-accept-hover-border:var(--lw-icb-accept-border);
  --lw-icb-accept-active-bg:var(--lw-icb-accept-bg);
  --lw-icb-accept-active-text:var(--lw-icb-accept-text);
  --lw-icb-accept-active-border:var(--lw-icb-accept-border);

  --lw-icb-reject-hover-bg:var(--lw-icb-reject-bg);
  --lw-icb-reject-hover-text:var(--lw-icb-reject-text);
  --lw-icb-reject-hover-border:var(--lw-icb-reject-border);
  --lw-icb-reject-active-bg:var(--lw-icb-reject-bg);
  --lw-icb-reject-active-text:var(--lw-icb-reject-text);
  --lw-icb-reject-active-border:var(--lw-icb-reject-border);

  /* Per element */
  --lw-icb-banner-bg:var(--lw-icb-bg);
  --lw-icb-banner-text:var(--lw-icb-text);
  --lw-icb-banner-border:var(--lw-icb-primary);

  --lw-icb-accept-bg:var(--lw-icb-accent);
  --lw-icb-accept-text:var(--lw-icb-text);
  --lw-icb-accept-border:var(--lw-icb-accent);

  --lw-icb-reject-bg:transparent;
  --lw-icb-reject-text:var(--lw-icb-primary);
  --lw-icb-reject-border:var(--lw-icb-text);

  --lw-icb-manage-bg:#ffffff;
  --lw-icb-manage-icon:#111827;
  --lw-icb-manage-border:var(--lw-icb-manage-icon);
}

#lw-icb-banner.lw-icb-banner[hidden],
#lw-icb-manage.lw-icb-manage[hidden],
#lw-icb-toast.lw-icb-toast[hidden]{
  display:none !important;
}

.lw-icb-banner{
  position:fixed;
  left:0;
  right:0;
  bottom:0;
  z-index:999999;
  background:var(--lw-icb-banner-bg) !important;
  color:var(--lw-icb-banner-text) !important;
  border-top:var(--lw-icb-border-width) solid var(--lw-icb-banner-border) !important;
}

.lw-icb-inner{
  display:flex;
  gap:16px;
  align-items:flex-start;
  justify-content:space-between;
  padding:16px;
  max-width:1200px;
  margin:0 auto;
}

.lw-icb-text{
  flex:1 1 auto;
  font-size:14px;
  line-height:1.5;
}

.lw-icb-text a{
  color:var(--lw-icb-accent) !important;
  text-decoration:underline;
}

.lw-icb-actions{
  flex:0 0 auto;
  display:flex;
  gap:10px;
  align-items:center;
}

/* Mobile: stack content and center actions */
@media (max-width: 767px){
  .lw-icb-inner{
    flex-direction:column;
    align-items:stretch;
  }

  .lw-icb-actions{
    width:100%;
    justify-content:center;
    flex-wrap:wrap;
  }

  .lw-icb-btn{
    min-width:140px;
  }
}

.lw-icb-btn{
  appearance:none;
  border:var(--lw-icb-border-width) solid var(--lw-icb-reject-border) !important;
  border-radius:var(--lw-icb-radius) !important;
  padding:10px 14px;
  font-size:14px;
  line-height:1;
  cursor:pointer;
  background:var(--lw-icb-reject-bg) !important;
  color:var(--lw-icb-reject-text) !important;
  min-width:120px;
  text-align:center;
}

.lw-icb-btn:focus-visible,
.lw-icb-manage:focus-visible{
  outline:2px solid var(--lw-icb-accent) !important;
  outline-offset:2px;
}

.lw-icb-btn.lw-icb-accept{
  background:var(--lw-icb-accept-bg) !important;
  border-color:var(--lw-icb-accept-border) !important;
  color:var(--lw-icb-accept-text) !important;
}

.lw-icb-btn.lw-icb-reject{
  background:var(--lw-icb-reject-bg) !important;
  border-color:var(--lw-icb-reject-border) !important;
  color:var(--lw-icb-reject-text) !important;
}

.lw-icb-btn.lw-icb-necessary{
  background:var(--lw-icb-necessary-bg,transparent) !important;
  border-color:var(--lw-icb-necessary-border,#6b7280) !important;
  color:var(--lw-icb-necessary-text,#111827) !important;
}
.lw-icb-btn.lw-icb-necessary:hover{
  opacity:.85;
}

/* Manage button (icon only) */
.lw-icb-manage{
  position:fixed;
  z-index:1000000;
  width:var(--lw-icb-manage-size, 48px);
  height:var(--lw-icb-manage-size, 48px);
  padding:0;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:9999px !important; /* always circular */
  border:var(--lw-icb-border-width) solid var(--lw-icb-manage-border) !important;
  background:var(--lw-icb-manage-bg) !important;
  color:var(--lw-icb-manage-icon) !important;
  cursor:pointer;
  transition:background .2s ease, color .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.lw-icb-manage:hover{
  background:var(--lw-icb-manage-hover-bg, var(--lw-icb-manage-bg)) !important;
  color:var(--lw-icb-manage-hover-icon, var(--lw-icb-manage-icon)) !important;
  border-color:var(--lw-icb-manage-hover-border, var(--lw-icb-manage-border)) !important;
}

/* Icon skaliert mit dem Button */
.lw-icb-manage .lw-icb-icon svg{
  width:calc(var(--lw-icb-manage-size, 48px) * 0.42);
  height:calc(var(--lw-icb-manage-size, 48px) * 0.42);
}

/* Positionsklassen */
.lw-icb-manage--bottom-right{
  right:var(--lw-icb-manage-offset-x, 16px);
  bottom:var(--lw-icb-manage-offset-y, 16px);
}
.lw-icb-manage--bottom-left{
  left:var(--lw-icb-manage-offset-x, 16px);
  bottom:var(--lw-icb-manage-offset-y, 16px);
}
.lw-icb-manage--top-right{
  right:var(--lw-icb-manage-offset-x, 16px);
  top:var(--lw-icb-manage-offset-y, 16px);
}
.lw-icb-manage--top-left{
  left:var(--lw-icb-manage-offset-x, 16px);
  top:var(--lw-icb-manage-offset-y, 16px);
}

/* Responsive: Mobil-Größe */
@media (max-width: 767px){
  .lw-icb-manage{
    width:var(--lw-icb-manage-size-m, 40px);
    height:var(--lw-icb-manage-size-m, 40px);
  }
  .lw-icb-manage .lw-icb-icon svg{
    width:calc(var(--lw-icb-manage-size-m, 40px) * 0.42);
    height:calc(var(--lw-icb-manage-size-m, 40px) * 0.42);
  }
}

.lw-icb-icon{ display:block; }

.lw-icb-sr{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

/* Toast */
.lw-icb-toast{
  position:fixed;
  left:16px;
  right:16px;
  bottom:88px;
  z-index:1000001;
  max-width:520px;
  margin:0 auto;
  padding:12px 14px;
  border-radius:var(--lw-icb-radius) !important;
  background:var(--lw-icb-banner-bg) !important;
  color:var(--lw-icb-text) !important;
  border:var(--lw-icb-border-width) solid var(--lw-icb-text) !important;
  font-size:14px;
}

/* Placeholder for blocked embeds */
.lw-icb-placeholder{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:14px;
  border:var(--lw-icb-border-width) solid var(--lw-icb-text) !important;
  border-radius:var(--lw-icb-radius) !important;
  background:var(--lw-icb-banner-bg) !important;
  color:var(--lw-icb-text) !important;
}

.lw-icb-placeholder__text{ font-size:14px; line-height:1.4; }

.lw-icb-placeholder__btn{
  white-space:nowrap;
}

/* Desktop refinements */
@media (min-width: 768px){
  .lw-icb-text{ font-size:15px; }
  .lw-icb-btn{
  appearance:none;
  border:var(--lw-icb-border-width) solid var(--lw-icb-reject-border) !important;
  border-radius:var(--lw-icb-radius) !important;
  padding:10px 14px;
  font-size:14px;
  line-height:1;
  cursor:pointer;
  background:var(--lw-icb-reject-bg) !important;
  color:var(--lw-icb-reject-text) !important;
  min-width:120px;
  text-align:center;
}


.lw-icb-btn.lw-icb-accept:hover{
  background:var(--lw-icb-accept-hover-bg) !important;
  border-color:var(--lw-icb-accept-hover-border) !important;
  color:var(--lw-icb-accept-hover-text) !important;
}
.lw-icb-btn.lw-icb-accept:active{
  background:var(--lw-icb-accept-active-bg) !important;
  border-color:var(--lw-icb-accept-active-border) !important;
  color:var(--lw-icb-accept-active-text) !important;
}

.lw-icb-btn.lw-icb-reject:hover{
  background:var(--lw-icb-reject-hover-bg) !important;
  border-color:var(--lw-icb-reject-hover-border) !important;
  color:var(--lw-icb-reject-hover-text) !important;
}
.lw-icb-btn.lw-icb-reject:active{
  background:var(--lw-icb-reject-active-bg) !important;
  border-color:var(--lw-icb-reject-active-border) !important;
  color:var(--lw-icb-reject-active-text) !important;
}

/* ─── Schriftgröße via CSS-Variable ──────────────────────────────────────── */
.lw-icb-banner,
.lw-icb-placeholder,
.lw-icb-toast {
  font-size: var(--lw-icb-font-size, 14px);
}

/* ─── Banner-Position: oben ──────────────────────────────────────────────── */
.lw-icb-banner--top {
  top: 0;
  bottom: auto !important;
  border-top: none !important;
  border-bottom: var(--lw-icb-border-width) solid var(--lw-icb-banner-border) !important;
}

/* ─── Banner-Position: Modal ─────────────────────────────────────────────── */
.lw-icb-banner--modal {
  position: fixed !important;
  inset: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: transparent !important;
  border: none !important;
  z-index: 9999999 !important;
}
.lw-icb-modal-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.5);
}
.lw-icb-modal-box {
  position: relative;
  z-index: 1;
  background: var(--lw-icb-banner-bg) !important;
  color: var(--lw-icb-banner-text) !important;
  border: var(--lw-icb-border-width) solid var(--lw-icb-banner-border) !important;
  border-radius: calc(var(--lw-icb-radius) + 4px) !important;
  max-width: 560px;
  width: calc(100% - 32px);
  padding: 0;
}
.lw-icb-banner--modal .lw-icb-inner {
  flex-direction: column;
  align-items: stretch;
  gap: 20px;
}
.lw-icb-banner--modal .lw-icb-actions {
  justify-content: flex-end;
}

/* ─── Animationen ────────────────────────────────────────────────────────── */

/* Slide (Standard) – von unten */
.lw-icb-banner--bottom.lw-icb-banner--anim-slide {
  transform: translateY(100%);
  transition: transform 0.3s ease;
}
.lw-icb-banner--bottom.lw-icb-banner--anim-slide.lw-icb-banner--visible {
  transform: translateY(0);
}

/* Slide – von oben */
.lw-icb-banner--top.lw-icb-banner--anim-slide {
  transform: translateY(-100%);
  transition: transform 0.3s ease;
}
.lw-icb-banner--top.lw-icb-banner--anim-slide.lw-icb-banner--visible {
  transform: translateY(0);
}

/* Fade */
.lw-icb-banner--anim-fade {
  opacity: 0;
  transition: opacity 0.3s ease;
}
.lw-icb-banner--anim-fade.lw-icb-banner--visible {
  opacity: 1;
}

/* Modal-Fade */
.lw-icb-banner--modal.lw-icb-banner--anim-slide,
.lw-icb-banner--modal.lw-icb-banner--anim-fade {
  opacity: 0;
  transition: opacity 0.25s ease;
  transform: none;
}
.lw-icb-banner--modal.lw-icb-banner--anim-slide.lw-icb-banner--visible,
.lw-icb-banner--modal.lw-icb-banner--anim-fade.lw-icb-banner--visible {
  opacity: 1;
}

/* Keine Animation */
.lw-icb-banner--anim-none {
  transition: none !important;
}

/* ─── Dark Mode ──────────────────────────────────────────────────────────── */
/* Greift wenn prefers-color-scheme: dark erkannt wurde (via JS-Klasse) */
.lw-icb-dark .lw-icb-banner {
  --lw-icb-banner-bg: #1f2937;
  --lw-icb-banner-text: #f9fafb;
  --lw-icb-banner-border: #374151;
}
.lw-icb-dark .lw-icb-toast {
  background: #1f2937 !important;
  color: #f9fafb !important;
  border-color: #374151 !important;
}
.lw-icb-dark .lw-icb-placeholder {
  background: #1f2937 !important;
  color: #f9fafb !important;
  border-color: #374151 !important;
}
.lw-icb-dark .lw-icb-manage {
  background: #1f2937 !important;
  color: #f9fafb !important;
  border-color: #374151 !important;
}

/* ─── Highlight-Zeile (Laufender Monat Admin) ────────────────────────────── */
.lw-icb-highlight {
  margin-top: 12px;
  padding: 10px 14px;
  background: #eff6ff;
  border-left: 3px solid #2563eb;
  border-radius: 4px;
  font-size: 13px;
}

/* ─── Jahres-Switcher Admin ─────────────────────────────────────────────── */
.lw-icb-year-switcher {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
}