.elementor-4206 .elementor-element.elementor-element-ebb990a{--display:flex;}.elementor-4206 .elementor-element.elementor-element-5934d76{--display:flex;}.elementor-4206 .elementor-element.elementor-element-b8981b6{--display:flex;--margin-top:-45px;--margin-bottom:-45px;--margin-left:0px;--margin-right:0px;}.elementor-4206 .elementor-element.elementor-element-529bf0c{--display:flex;}.elementor-4206 .elementor-element.elementor-element-3d7e755{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-4206 .elementor-element.elementor-element-bc4c433{--display:flex;}.elementor-4206 .elementor-element.elementor-element-9d83ff8{--display:flex;}.elementor-4206 .elementor-element.elementor-element-a0556b5 > .elementor-widget-container{margin:-7px 0px -26px 0px;}.elementor-4206 .elementor-element.elementor-element-a0556b5.elementor-element{--align-self:center;}.elementor-4206 .elementor-element.elementor-element-e562d01{--display:flex;}.elementor-4206 .elementor-element.elementor-element-1c18931{--display:flex;}.elementor-4206 .elementor-element.elementor-element-d2d7353{--display:flex;}.elementor-4206 .elementor-element.elementor-element-3215b56{--display:flex;}.elementor-4206 .elementor-element.elementor-element-ab3340b{--display:flex;}@media(max-width:767px){.elementor-4206 .elementor-element.elementor-element-c188ddc > .elementor-widget-container{margin:-20px 0px 0px 0px;}.elementor-4206 .elementor-element.elementor-element-9d83ff8{--margin-top:-30px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-4206 .elementor-element.elementor-element-aa31cd9 > .elementor-widget-container{margin:-11px 0px 0px 0px;}.elementor-4206 .elementor-element.elementor-element-cc1085d > .elementor-widget-container{margin:-4px 0px -17px 0px;padding:0px 0px 0px 0px;}.elementor-4206 .elementor-element.elementor-element-cf25dc5 > .elementor-widget-container{margin:-18px 0px 0px 0px;}}/* Start custom CSS for container, class: .elementor-element-529bf0c *//* Wheel Grundlayout */
.elementor-4206 .elementor-element.elementor-element-529bf0c .lc-wheel-mount{
  position:relative;width:100%;max-width:560px;margin:0 auto;aspect-ratio:1/1;
}
.elementor-4206 .elementor-element.elementor-element-529bf0c .lc-wheel{position:relative;width:100%;height:100%}
.elementor-4206 .elementor-element.elementor-element-529bf0c .lc-wheel__disc{
  position:absolute;inset:0;border-radius:50%;
  border:8px solid rgba(255,255,255,.08);
  /* Fallback + Segmente */
  background:#1a1216; /* Fallback-Farbe */
  background:
    conic-gradient(
      from 0deg,
      rgba(255,255,255,.10) 0 45deg,
      rgba(255,255,255,.16) 45deg 90deg,
      rgba(255,255,255,.10) 90deg 135deg,
      rgba(255,255,255,.16) 135deg 180deg,
      rgba(255,255,255,.10) 180deg 225deg,
      rgba(255,255,255,.16) 225deg 270deg,
      rgba(255,255,255,.10) 270deg 315deg,
      rgba(255,255,255,.16) 315deg 360deg
    );
}
.elementor-4206 .elementor-element.elementor-element-529bf0c .lc-wheel__pointer{
  position:absolute;top:-10px;left:50%;transform:translateX(-50%);
  width:0;height:0;border-left:12px solid transparent;border-right:12px solid transparent;
  border-bottom:22px solid var(--lc-rosa,#ff4f87);
}

/* Gifts-Grid Mindestlayout (Optik feilen wir später) */
.elementor-4206 .elementor-element.elementor-element-529bf0c .lc-gifts-grid__mount{display:grid;gap:16px;grid-template-columns:repeat(6,minmax(0,1fr))}
@media(max-width:1200px){.elementor-4206 .elementor-element.elementor-element-529bf0c .lc-gifts-grid__mount{grid-template-columns:repeat(4,1fr)}}
@media(max-width:768px){.elementor-4206 .elementor-element.elementor-element-529bf0c .lc-gifts-grid__mount{grid-template-columns:repeat(2,1fr)}}

.elementor-4206 .elementor-element.elementor-element-529bf0c .lc-gift-card{background:rgba(0,0,0,.12);border:1px solid rgba(255,255,255,.08);
  border-radius:16px;padding:12px;text-align:center}
.elementor-4206 .elementor-element.elementor-element-529bf0c .lc-gift-card .img-wrap{height:64px;display:grid;place-items:center;margin-bottom:8px}
.elementor-4206 .elementor-element.elementor-element-529bf0c .lc-gift-card img{max-height:48px;width:auto;height:auto}
.elementor-4206 .elementor-element.elementor-element-529bf0c .lc-gift-card .price{font-weight:700;opacity:.9;margin:6px 0}


/* Anti-Aliasing/Compositing für die drehende Scheibe */
.lc-wheel-section .lc-wheel,
.lc-wheel-section .lc-wheel__disc{
  will-change: transform;              /* eigenes Layer anlegen */
  transform: translateZ(0);            /* GPU aktivieren */
  backface-visibility: hidden;         /* Kanten “flimmern” weniger */
  -webkit-backface-visibility: hidden; /* Safari */
}

/* die Labels (falls sie mitdrehen) ebenso */
.lc-wheel-section .lc-wheel__labels{
  will-change: transform;
  transform: translateZ(0);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-1c18931 */.elementor-4206 .elementor-element.elementor-element-1c18931 .lc-gift-card img{max-height:48px;width:auto;height:auto}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-ebb990a *//* =======================================================
   Glücksrad-Wrapper (nur dieser Container!)
   Bordeaux-Card mit fixierten Licht-Spots & scharfen Ecken
   ======================================================= */
:root{
  --lc-plum-700:#321823;   /* Bordeaux dunkel   */
  --lc-plum-800:#1f0f17;   /* Bordeaux sehr dunkel */
  --lc-rose:#e5adc6;       /* Akzent Rosa */

  /* Position der Lichtkegel (px -> bleiben absolut stabil) */
  --glow1-x: 28px;  /* links  */
  --glow1-y: 36px;  /* oben   */
  --glow2-x: 32px;  /* rechts */
  --glow2-y: 28px;  /* unten  */
}

/* Alte Rahmen/Shadow neutralisieren (nur dieser Bereich) */
.page-id-4206 .lc-wheel-wrap,
.page-id-4206 .lc-wheel-section{
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* Card-Hintergrund nur auf .lc-wheel-wrap */
.page-id-4206 .lc-wheel-wrap{
  position: relative;
  z-index: 0;

  /* 1) Scharfe Ecken */
  border-radius: 0 !important;
  background-clip: border-box;

  /* Grundverlauf in sattem Bordeaux */
  background: linear-gradient(145deg, var(--lc-plum-700), var(--lc-plum-800));
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 10px 28px rgba(0,0,0,.34);
  overflow: visible;
}

/* Licht-Spots als Overlay – fixiert per Pixeloffsets */
.page-id-4206 .lc-wheel-wrap::before{
  content:"";
  position:absolute; inset:0;
  pointer-events:none;
  /* 2) Scharfe Ecken auch fürs Overlay */
  border-radius: 0 !important;
  z-index:0;

  /* zwei weiche Kegel – NICHT relativ, sondern fest angepinnt */
  background:
    radial-gradient(520px 280px at var(--glow1-x) var(--glow1-y),
                    rgba(229,173,198,.18), transparent 70%),
    radial-gradient(520px 260px at calc(100% - var(--glow2-x)) calc(100% - var(--glow2-y)),
                    rgba(255,255,255,.10), transparent 70%);
  mix-blend-mode: screen;
}

/* dezente Vignette (auch mit scharfen Ecken) */
.page-id-4206 .lc-wheel-wrap::after{
  content:"";
  position:absolute; inset:0;
  border-radius: 0 !important;
  pointer-events:none;
  box-shadow: inset 0 20px 60px rgba(0,0,0,.28);
}

/* Elementor-Schichten im Wrapper durchsichtig halten */
.page-id-4206 .lc-wheel-wrap .elementor-section,
.page-id-4206 .lc-wheel-wrap .e-con,
.page-id-4206 .lc-wheel-wrap .elementor-container,
.page-id-4206 .lc-wheel-wrap .elementor-widget,
.page-id-4206 .lc-wheel-wrap .elementor-widget-container{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Mobile: leicht kräftigere Kegel, weiterhin fixiert */
@media (max-width: 767px){
  :root{
    --glow1-x: 22px;
    --glow1-y: 28px;
    --glow2-x: 26px;
    --glow2-y: 22px;
  }
  .page-id-4206 .lc-wheel-wrap::before{
    background:
      radial-gradient(440px 240px at var(--glow1-x) var(--glow1-y),
                      rgba(229,173,198,.22), transparent 72%),
      radial-gradient(420px 220px at calc(100% - var(--glow2-x)) calc(100% - var(--glow2-y)),
                      rgba(255,255,255,.12), transparent 72%);
  }
}

/* =========================================================
   Seite Glücksrad (4206) – Geschenke-Karten im Chat-Bubble-Look
   ========================================================= */
.page-id-4206 :root{
  /* Fallbacks, falls die Chat-Variablen hier nicht geladen sind */
  --lc-plum-700: #321823;
  --lc-plum-900: #1d0e14;
  --lc-card-grad: linear-gradient(145deg, var(--lc-plum-700) 0%, var(--lc-plum-900) 100%);
  --lc-border-soft: rgba(255,255,255,.08);
  --lc-border-inner: rgba(255,255,255,.05);
}

/* Grundkarte = wie lc-model-card aus der Chatliste */
.page-id-4206 .lc-gifts-section .lc-gift-card{
  position: relative;
  background: var(--lc-card-grad) !important;
  border: 1px solid var(--lc-border-soft);
  border-radius: 22px;                 /* wie die Chat-Karten */
  box-shadow:
    0 8px 24px rgba(0,0,0,.35),
    inset 0 0 0 1px var(--lc-border-inner);
  overflow: hidden;                    /* damit das Highlight sauber clippt */
  padding: 18px;                       /* dein bisheriges Padding beibehalten */
}

/* zarter „Pink-Glow“-Spot wie in der Chatliste */
.page-id-4206 .lc-gifts-section .lc-gift-card::before{
  content:"";
  position:absolute; inset:-1px;
  border-radius: inherit;
  background: radial-gradient(420px 260px at 6% 12%, rgba(255,142,189,.15), transparent 70%);
  pointer-events:none;
}

/* dezente Hover-Anhebung (Desktop) – optional */
@media (hover:hover){
  .page-id-4206 .lc-gifts-section .lc-gift-card:hover{
    transform: translateY(-1px);
    box-shadow:
      0 12px 28px rgba(0,0,0,.40),
      inset 0 0 0 1px var(--lc-border-inner);
    transition: transform .15s ease, box-shadow .2s ease;
  }
}

/* Kauf-Button unverändert rosa lassen (Sicherheitsnetz) */
.page-id-4206 .lc-gifts-section .lc-gift-card .lc-btn.buy{
  background: var(--lc-rose, #e5adc6) !important;
  color:#fff !important;
  box-shadow: 0 8px 20px rgba(229,173,198,.28);
}
.page-id-4206 .lc-gifts-section .lc-gift-card .lc-btn.buy:hover{
  background: var(--lc-rose-hover, #d48ca9) !important;
}/* End custom CSS */
/* Start custom CSS *//* ===========================
   LC – Glücksrad (5 Container)
   =========================== */

/* ----------- Farben/Basis ----------- */
.lc-wheel-page,
.lc-wheel-section,
.lc-outcome,
.lc-gifts-section,
.lc-ticker-section{
  --card1: var(--lc-bg-700, #321823);
  --card2: var(--lc-bg-800, #1f0f17);
  --text:  #fff;
  --muted: rgba(255,255,255,.85);
  --accent: var(--lc-rose, #e5adc6);
  --accent-h: var(--lc-rose-hover, #d48ca9);
  color: var(--text);
}

/* =======================================================
   CONTAINER 1  (.lc-wheel-page)
   Header/Intro + Free-Spin Timer – mittig & auffällig
   -> Card-Hintergrund ENTFERNT (nur das).
   ======================================================= */
.lc-wheel-page{
  background: transparent !important;   /* <— geändert */
  border: 0 !important;                  /* <— geändert */
  box-shadow: none !important;           /* <— geändert */
  padding: 22px;
  text-align: center;
}
.lc-wheel-page *{ color:#fff; }
.lc-wheel-page #lc-free-spin-timer{
  display:inline-block;
  margin-top: 10px;
  font-weight: 900;
  letter-spacing:.2px;
  font-size: clamp(18px, 2.6vw, 28px);
  padding: 10px 16px;
  border-radius: 12px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.06);
}

/* =======================================================
   CONTAINER 2  (.lc-wheel-section)
   Wheel voll sichtbar, mittig; Button breit. KEIN Card-BG
   ======================================================= */

/* Card-Hintergründe aus, Layout stapeln & mittig */
.lc-wheel-section{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 10px 0;
  display: flex;                /* Wheel über „Dein Status“ */
  flex-direction: column;
  align-items: center;
  gap: 14px;
  overflow: visible;
}

/* Wheel-Größe + Darstellung */
.lc-wheel-section #lc-wheel-mount{ width:100%; }
.lc-wheel-section .lc-wheel{
  width: clamp(260px, 56vw, 540px);
  aspect-ratio: 1/1;
  position: relative;
  margin: 0 auto;
}
.lc-wheel-section .lc-wheel__pointer{
  position:absolute; top:-14px; left:50%; transform:translateX(-50%);
  width:0; height:0; 
  border-left: 12px solid transparent;
  border-right:12px solid transparent;
  border-bottom:18px solid var(--accent);
  filter: drop-shadow(0 2px 6px rgba(0,0,0,.45));
}

/* „Dein Status“ Text zentrieren */
.lc-wheel-section .elementor-heading-title,
.lc-wheel-section .lc-panel__coins{ text-align:center; }

/* ===== AUSKOMMENTIERT: alter Spin-Button-Layer (verursachte den Doppel-Hintergrund)
.lc-wheel-section .lc-spin-btn{
  appearance:none; border:0; cursor:pointer;
  background: var(--accent) !important;
  color:#fff !important;
  font-weight:900; letter-spacing:.2px;
  padding: 14px 18px;
  min-width: 280px;
  border-radius: 12px;
  box-shadow: 0 10px 22px rgba(229,173,198,.28);
  transition: filter .15s ease, transform .15s ease;
}
.lc-wheel-section .lc-spin-btn:hover{
  background: var(--accent-h) !important;
  transform: translateY(-1px);
}
END AUSKOMMENTIERT ===== */


/* Nur den Spin-Button-Widget-Wrapper neutralisieren (keine 2. Fläche) */
.page-id-4206 .lc-wheel-section .lc-spin-btn,
.page-id-4206 .lc-wheel-section .lc-spin-btn > .elementor-widget-container,
.page-id-4206 .lc-wheel-section .lc-spin-btn .elementor-button-wrapper{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}


/* Mobil: Button volle Breite */
@media (max-width: 980px){
  .lc-wheel-section .lc-spin-btn{ width:100%; min-width:0; }
}

/* =======================================================
   CONTAINER 3  (.lc-outcome)
   Letztes Ergebnis – KEIN Card-BG
   ======================================================= */
.lc-outcome{
  padding-top: 6px;
  /* KEIN background/border/box-shadow hier! */
}
.lc-outcome .lc-outcome__value{
  display:inline-block;
  background: rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);
  border-radius: 12px;
  padding: 10px 14px;
  font-weight:800;
}

/* =======================================================
   CONTAINER 4  (.lc-gifts-section)
   Shop: immer 2 Geschenke nebeneinander (Desktop & Mobil)
   ======================================================= */
   
/* =======================================================
   Fix: Titel "Geschenke kaufen" muss über dem Raster stehen
   Ursache: Elementor e-flex Container (#lc-gifts-shop) ist Row/Wrap
   ======================================================= */

/* Parent: Titel + Grid untereinander und zentriert */
.page-id-4206 #lc-gifts-shop{
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 18px !important;
  text-align: center;
}

/* Title-Widget: volle Breite, zentriert, immer oben */
.page-id-4206 #lc-gifts-shop .lc-gifts__title{
  order: 1 !important;
  width: 100% !important;
  max-width: 1200px;
  margin: 0 auto !important;
}
.page-id-4206 #lc-gifts-shop .lc-gifts__title .elementor-heading-title{
  text-align: center !important;
  margin: 0 !important;
}

/* Grid-Container: volle Breite, zentriert, immer unter dem Titel */
.page-id-4206 #lc-gifts-shop .lc-gifts-grid{
  order: 2 !important;
  width: 100% !important;
  max-width: 1200px;
  margin: 0 auto !important;
}

/* Mobile: etwas weniger Abstand, Title bleibt sauber über dem Grid */
@media (max-width: 767px){
  .page-id-4206 #lc-gifts-shop{ gap: 14px !important; }
}
   
.lc-gifts-section .lc-gifts-grid__mount{
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr)) !important;
  gap: 22px;
  max-width: 1200px;
  margin: 0 auto;
}

.lc-gifts-section .lc-gift-card{
  background: linear-gradient(145deg,var(--card1),var(--card2));
  border:1px solid rgba(255,255,255,.10);
  border-radius:14px;
  box-shadow:0 8px 22px rgba(0,0,0,.28);
  padding:18px;
  display:grid; gap:10px; align-content:start;
  min-height: 180px;
}
.lc-gifts-section .lc-gift-card .img-wrap{
  display:flex; align-items:center; justify-content:center; min-height:72px;
}
.lc-gifts-section .lc-gift-card img{
  width:64px; height:64px; object-fit:contain;
  filter: drop-shadow(0 3px 8px rgba(0,0,0,.35));
}
.lc-gifts-section .lc-gift-card .exp{
  color: var(--muted);
  font-size: 14px;
  line-height: 1.25;
  margin-top: -2px;
}
.lc-gifts-section .lc-gift-card .price{ color:var(--muted); }
.lc-gifts-section .lc-gift-card .lc-btn.buy{
  appearance:none; border:0; cursor:pointer;  background: var(--accent); color:#fff; font-weight:900;
  padding:10px 14px; border-radius:10px;
  box-shadow:0 8px 20px rgba(229,173,198,.28);
  transition:filter .15s ease, transform .15s ease;
}
.lc-gifts-section .lc-gift-card .lc-btn.buy:hover{
  background: var(--accent-h); transform: translateY(-1px);
}
@media (max-width: 380px){
  .lc-gifts-section .lc-gifts-grid__mount{ gap:14px; }
  .lc-gifts-section .lc-gift-card{ padding:14px; }
}




/* =======================================================
   CONTAINER 5  (.lc-ticker-section)
   Live-Ticker auf die letzten 5 Einträge begrenzen
   -> Card-Hintergrund ENTFERNT (nur das).
   ======================================================= */
.lc-ticker-section{
  background: transparent !important;    /* <— geändert */
  border:0 !important;                   /* <— geändert */
  box-shadow:none !important;            /* <— geändert */
  padding: 20px;
}
.lc-ticker-section #lc-live-ticker{
  list-style:none; margin:0; padding:0; display:grid; gap:12px;
  max-width: 1200px; margin-inline:auto;
}
/* Nur die 5 neuesten zeigen – Rest ausblenden */
.lc-ticker-section #lc-live-ticker li:nth-child(n+6){ display:none !important; }

.lc-ticker-section #lc-live-ticker li{
  background: rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);
  border-radius:12px; padding:12px 14px;
}

/* ---------- Fix 1: Spin-Button rosa & ohne grauen Hintergrund ---------- */
/* Wrapper des Elementor-Buttons: transparent, keine “Schiene” dahinter */
.lc-wheel-section .lc-spin-btn{
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  margin: 12px auto 0 !important;   /* zentriert */
  min-width: 0 !important;          /* keine erzwungene Breite */
}

/* Das eigentliche <a class="elementor-button"> rosa einfärben */
.lc-wheel-section .lc-spin-btn .elementor-button{
  background: var(--lc-rose, #e5adc6) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 12px !important;
  padding: 12px 20px !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  font-weight: 900 !important;
  letter-spacing: .2px;
  width: auto !important;           /* so breit wie der Text */
  box-shadow: 0 10px 22px rgba(229,173,198,.28) !important;
}
.lc-wheel-section .lc-spin-btn .elementor-button:hover{
  background: var(--lc-rose-hover, #d48ca9) !important;
  filter: none !important;
  transform: translateY(-1px);
}

/* ---------- Fix 2: Mobile-Stack richtig anordnen + Luft um das Rad ---------- */
@media (max-width: 767px){
  /* Reihenfolge in der Sektion: erst Rad, dann Status/Coins/Button */
  .lc-wheel-section{
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .lc-wheel-section > *{ order: 2; }              /* Standard: nach dem Rad */
  .lc-wheel-section #lc-wheel-mount{ order: 1; }  /* Das Rad immer zuerst */

  /* Etwas Abstand unter dem Rad, damit nichts überlappt */
  .lc-wheel-section .lc-wheel{ margin: 12px auto 18px !important; }

  /* Überschrift/Coins mittig halten */
  .lc-wheel-section .elementor-heading-title,
  .lc-wheel-section .lc-panel__coins{
    text-align: center;
  }
}

/* ========= MOBIL: Wheel steht frei zwischen Timer und "Dein Status" ========= */
@media (max-width: 767px){

  /* In der Wheel-Sektion erst das Rad, dann Heading/Coins/Button */
  .lc-wheel-section{
    display:flex;
    flex-direction:column;
    align-items:center;
  }
  .lc-wheel-section > *{ order:2; }              /* Standard: nach dem Rad */
  .lc-wheel-section #lc-wheel-mount{             /* Das Rad zuerst & freistehend */
    order:1;
    position:relative;
    z-index:3;                                   /* liegt über evtl. Hintergründen */
    width:min(92vw, 520px);
    margin: 12px auto 18px !important;           /* Luft oben & unten */
  }
  .lc-wheel-section .lc-wheel{ margin:0 !important; } /* keine Extra-Margen im Rad */

  /* Heading/Coins unter dem Rad und mit etwas Abstand starten */
  .lc-wheel-section .elementor-heading-title{ margin-top: 8px !important; }
  .lc-wheel-section .lc-panel__coins{ margin-top: 4px !important; }

  /* Outcome (Container 3) rutscht nicht ins Rad */
  .lc-outcome{ margin-top: 16px !important; }
}

/* ===== Mobile: Spin-Button zentrieren ===== */
@media (max-width: 767px){
  /* Button-Widget als Flex-Zeile mittig */
  .lc-wheel-section .elementor-widget-button,
  .lc-wheel-section .lc-spin-btn-wrap{
    display:flex !important;
    justify-content:center !important;
    align-items:center !important;
    width:100%;
    margin-top: 8px !important;
  }

  /* Der eigentliche Button */
  .lc-wheel-section .elementor-widget-button .elementor-button,
  .lc-wheel-section .lc-spin-btn{
    margin: 0 auto !important;
    text-align:center !important;
    min-width: min(82vw, 320px);
  }
}

/* ==== Wheel: Shadow fixed (dreht NICHT mit) ==== */
.lc-wheel-section .lc-wheel{
  position: relative;
}

/* 1) Schatten am drehenden Disc entfernen */
.lc-wheel-section .lc-wheel__disc{
  position: relative;
  z-index: 1;
  box-shadow: none !important; /* überschreibt den bisherigen 0 14px 40px ... */
}

/* 2) Statischer, gleichmäßiger Halo am Container */
.lc-wheel-section .lc-wheel::before{
  content: "";
  position: absolute;
  inset: -10px;                 /* leicht größer als das Rad für weiche Kante */
  border-radius: 50%;
  pointer-events: none;
  z-index: 0;

  /* gleichmäßiger Schatten/Halo */
  box-shadow: 0 0 52px rgba(0,0,0,.45);
  /* optional dezente Vignette – gern entfernen/abschalten, wenn zu stark */
  background: radial-gradient(60% 60% at 50% 50%, rgba(0,0,0,.08), transparent 70%);
}

/* Pointer sicher oben halten */
.lc-wheel-section .lc-wheel__pointer{
  position: absolute;
  z-index: 2;
}

/* (Optional) Wenn du trotzdem einen leichten Schatten am Disc willst,
   dann nur symmetrisch – dreht mit, fällt aber nicht auf: */
/*
.lc-wheel-section .lc-wheel__disc{
  box-shadow: 0 0 26px rgba(0,0,0,.25) !important;
}
*/

/* ===== Segment-Labels – RADIAL (Icon oben, Text darunter) ===== */

/* Overlay auf der Disc: rotiert mit */
.lc-wheel-section .lc-wheel__labels{
  position:absolute; inset:0;
  pointer-events:none; z-index:2;
}

/* Jedes Label wird per JS positioniert + rotiert */
.lc-wheel-section .lc-wheel__label{
  position:absolute;
  transform-origin: 50% 50%;
}

/* Vertikaler Stack (Icon außen, Text zur Mitte hin) */
.lc-wheel-section .lc-wheel__label .innerV{
  display:flex; flex-direction:column; align-items:center; gap:4px;
  background: rgba(0,0,0,.32);
  color:#fff; font-weight:800;
  padding:6px 8px; border-radius:12px;
  box-shadow:0 2px 6px rgba(0,0,0,.30);
  font-size: clamp(12px, 1.6vw, 14px);
}

.lc-wheel-section .lc-wheel__label .icoV{
  font-size: clamp(16px, 2vw, 18px); line-height:1;
}
.lc-wheel-section .lc-wheel__label .txtV{
  line-height:1.1; white-space:nowrap;
}

/* Mobile: minimal kompakter */
@media (max-width: 520px){
  .lc-wheel-section .lc-wheel__label .innerV{
    padding:5px 7px; border-radius:10px; gap:3px;
  }
  .lc-wheel-section .lc-wheel__label .icoV{ font-size:16px; }
  .lc-wheel-section .lc-wheel__label .txtV{ font-size:13px; }
}

/* ===== Glücksrad – Disc & Ringe ===== */
.lc-wheel-section .lc-wheel{ position:relative; }

.lc-wheel-section .lc-wheel__disc{
  position:relative;
  width:100%; height:100%;
  border-radius:50%;
  border:0 !important;
  background:
    radial-gradient(60% 60% at 50% 42%, rgba(255,255,255,.06), transparent 72%),
    conic-gradient(from -90deg,
      rgba(255,255,255,.08) 0deg   45deg,
      rgba(0,0,0,.10)       45deg  90deg,
      rgba(255,255,255,.08) 90deg  135deg,
      rgba(0,0,0,.10)       135deg 180deg,
      rgba(255,255,255,.08) 180deg 225deg,
      rgba(0,0,0,.10)       225deg 270deg,
      rgba(255,255,255,.08) 270deg 315deg,
      rgba(0,0,0,.10)       315deg 360deg),
    linear-gradient(145deg, rgba(255,255,255,.05), rgba(0,0,0,.10));
  box-shadow:none !important;
}
.lc-wheel-section .lc-wheel__disc::before{
  content:""; position:absolute; inset:10px; border-radius:50%;
  background: radial-gradient(80% 80% at 50% 40%, rgba(255,255,255,.04), transparent 70%);
  border:1px solid rgba(255,255,255,.18);
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.06),
    inset 0 18px 36px rgba(0,0,0,.18);
  pointer-events:none;
}
.lc-wheel-section .lc-wheel__disc::after{
  content:""; position:absolute; inset:0; border-radius:50%;
  box-shadow:
    inset 0 0 0 8px rgba(255,255,255,.12),
    inset 0 0 0 2px rgba(255,255,255,.05);
  pointer-events:none;
}

/* (Optional) Statischer Halo – kannst du lassen, wenn schon vorhanden */
.lc-wheel-section .lc-wheel::before{
  content:""; position:absolute; inset:-10px; border-radius:50%; pointer-events:none; z-index:0;
  box-shadow:0 0 52px rgba(0,0,0,.45);
  background: radial-gradient(60% 60% at 50% 50%, rgba(0,0,0,.08), transparent 70%);
}

/* =========================
   WHEEL – gezielte Overrides
   ========================= */
:root{
  --lc-bordeaux: var(--lc-bg-700, #321823);
  --lc-bordeaux-2: #3b1a26; /* etwas heller/rotstichiger */
}

/* 1) ÄUSSERSTER RING (außen herum) */
.lc-wheel-section .lc-wheel{
  position: relative;
}
.lc-wheel-section .lc-wheel::before{
  content:"";
  position:absolute;
  inset:-14px;                           /* außerhalb des Rades */
  border-radius:50%;
  border: 12px solid var(--lc-bordeaux); /* sichtbarer Ring */
  box-shadow: 0 0 52px rgba(0,0,0,.45);  /* Halo */
  background: radial-gradient(60% 60% at 50% 50%,
               rgba(0,0,0,.08), transparent 70%);
  z-index:0;
}

/* 2) SCHEIBE: stärkerer Segment-Kontrast + Bordeaux-Grundton */
.lc-wheel-section .lc-wheel__disc{
  border:0 !important;
  background:
    /* zentrales Licht */
    radial-gradient(60% 60% at 50% 42%, rgba(255,255,255,.06), transparent 72%),

    /* stärkerer Segmentkontrast (alle 45° wechselnd) */
    repeating-conic-gradient(from -90deg,
      rgba(255,255,255,.12) 0 45deg,    /* heller Keil */
      rgba(0,0,0,.26)       45deg 90deg /* dunkler Keil */
    ),

    /* Bordeaux-Grundton */
    linear-gradient(145deg, var(--lc-bg-700, #321823), #4b2332) !important;
}

/* 3) CENTER-KNOPF: dunkler Bordeaux, ohne weißen Rand */
.lc-wheel-section .lc-wheel::after{
  content:"";
  position:absolute;
  left:50%; top:50%;
  transform:translate(-50%,-50%);
  width:58px; height:58px;               /* bei Bedarf anpassen */
  border-radius:50%;
  background:
    radial-gradient(48% 48% at 38% 30%,
      rgba(255,255,255,.30), rgba(255,255,255,.06) 42%,
      rgba(255,255,255,0) 43%),
    linear-gradient(145deg, var(--lc-bordeaux-2), var(--lc-bordeaux));
  box-shadow:
    0 8px 18px rgba(0,0,0,.45),          /* äußerer Schatten */
    inset 0 6px 10px rgba(255,255,255,.10),
    inset 0 -8px 12px rgba(0,0,0,.35);
  z-index:3;
}

/* ===== Pointer – Rosa, Glow, Spitze zeigt zur Mitte ===== */
.lc-wheel-section .lc-wheel__pointer{
  position:absolute;
  top:-14px;                 /* bei Bedarf -12 .. -18 feinjustieren */
  left:50%;
  transform:translateX(-50%);
  width:0; height:0;

  /* alten Pointer vollständig neutralisieren */
  border:0 !important;
  border-bottom:0 !important;

  /* neuer, nach unten zeigender Pfeil (zur Rad-Mitte) */
  border-left: 14px solid transparent !important;
  border-right:14px solid transparent !important;
  border-top: 22px solid var(--lc-rose, #e5adc6) !important;

  /* zarter Rand + Glow wie beim Button */
  filter:
    drop-shadow(0 0 0 1px rgba(0,0,0,.55))             /* dünner dunkler Rand */
    drop-shadow(0 8px 16px rgba(229,173,198,.35));     /* rosa Schein */
  z-index: 8;          /* sicher über allen Ringen */
  pointer-events:none;
}

/* ===== Mobile: Wheel wirklich exakt zentrieren + 5% kleiner ===== */
@media (max-width: 767px){

  /* Mount absolut mittig in der Section ausrichten */
  .lc-wheel-section #lc-wheel-mount{
    position: relative;
    left: 50%;
    transform: translateX(-50%);   /* echte Mitte, unabhängig von Spalten-Padding */
    width: min(92vw, 520px);
    margin: 12px 0 18px !important; /* kein margin:auto mehr nötig */
  }

  /* gesamte Scheibe 5% schrumpfen (Pointer/Ringe/Labels skalieren mit) */
  .lc-wheel-section #lc-wheel-mount .lc-wheel{
    transform: scale(.95);
    transform-origin: top center;
  }
}


/* === Glücksrad: Gifts-Grid darf NICHT abgeschnitten werden ============ */

/* 1) Alle Wrapper in der Gifts-Section dürfen Überläufe zeigen */
.lc-gifts-section,
.lc-gifts-section .e-con,
.lc-gifts-section .e-con-inner,
.lc-gifts-section .elementor-container,
.lc-gifts-section .elementor-widget,
.lc-gifts-section .elementor-widget-container {
  overflow: visible !important;
}

/* 2) Das HTML-Widget, das das Grid enthält (dein .lc-gifts-grid) */
.lc-gifts-section .lc-gifts-grid,
.lc-gifts-section .lc-gifts-grid .elementor-widget-container {
  overflow: visible !important;
}

/* 3) Das eigentliche Grid – saubere Spalten, kein „Schieben“ */
.lc-gifts-section .lc-gifts-grid__mount{
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 22px;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  box-sizing: border-box;
  min-width: 0;
}

/* 4) Karten: eigener Mal-Kontext + nie clippen */
.lc-gifts-section .lc-gift-card{
  position: relative;
  box-sizing: border-box;
  min-width: 0;
  isolation: isolate;
  overflow: visible;        /* Schatten & Rundungen voll sichtbar */
}

/* 5) Sicherheitsnetz: etwaige Clip/Mask, die Elementor auf Wrapper setzt, neutralisieren */
.lc-gifts-section [style*="clip-path"],
.lc-gifts-section [style*="mask"],
.lc-gifts-section [style*="-webkit-mask"]{
  clip-path: none !important;
  mask: none !important;
  -webkit-mask: none !important;
}

/* Glücksrad: Wrapper NICHT das Chat-Overlay -> Overlay-Styles neutralisieren */
.lc-gifts-section .lc-gifts-grid{
  display: block !important;
  padding: 0 !important;
  background: transparent !important;
  overflow: visible !important; /* verhindert das Abschneiden rechts */
}

/* Das eigentliche Grid */
.lc-gifts-section .lc-gifts-grid__mount{
  width: 100% !important;           /* verhindert Überschreitung der Wrapperbreite */
  box-sizing: border-box !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 22px !important;
}

/* Sicherheit: Karten dürfen schrumpfen */
.lc-gifts-section .lc-gift-card{ min-width: 0; }


/* Glücksrad (Seite 4206): Titel/Header ausblenden + Lücke entfernen */
.page-id-4206 .entry-title,
.page-id-4206 .page-title,
.page-id-4206 .elementor-page-title,
.page-id-4206 .entry-header { 
  display: none !important;
}


/* Spin-Button – Basis + Glow */
.page-id-4206 .lc-wheel-section .lc-spin-btn .elementor-button{
  background: var(--lc-rose, #e5adc6) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 12px !important;
  padding: 12px 20px !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  font-weight: 900 !important;
  letter-spacing: .2px;
  width: auto !important;
  box-shadow: 0 10px 22px rgba(229,173,198,28) !important;
}

.page-id-4206 .lc-wheel-section .lc-spin-btn .elementor-button.is-busy,
.page-id-4206 .lc-wheel-section .lc-spin-btn .elementor-button[aria-disabled="true"]{
  pointer-events: none !important;
  opacity: .72;
  transform: none !important;
}

/* Hover nur bei echter Maus */
@media (hover:hover){
  .page-id-4206 .lc-wheel-section .lc-spin-btn .elementor-button:hover{
    background: var(--lc-rose-hover, #d48ca9) !important;
    transform: translateY(-1px);
    box-shadow: 0 14px 28px rgba(229,173,198,.34) !important;
  }
}

/* Sofortiger Tap-Impuls – nur während des echten Drückens */
.page-id-4206 .lc-wheel-section .lc-spin-btn .elementor-button:not(.is-busy):active{
  background: var(--lc-rose-hover, #d48ca9) !important;
  transform: translateY(1px) scale(.98);
  box-shadow: 0 8px 16px rgba(229,173,198,.24) !important;
}

/* Sticky-Zustände neutralisieren (wenn Script Klassen/ARIA setzt) */
.page-id-4206 .lc-wheel-section .lc-spin-btn .elementor-button:focus,
.page-id-4206 .lc-wheel-section .lc-spin-btn .elementor-button:focus-visible,
.page-id-4206 .lc-wheel-section .lc-spin-btn .elementor-button[aria-pressed="true"],
.page-id-4206 .lc-wheel-section .lc-spin-btn .elementor-button.active,
.page-id-4206 .lc-wheel-section .lc-spin-btn .elementor-button.is-active,
.page-id-4206 .lc-wheel-section .lc-spin-btn .elementor-button.pressed,
.page-id-4206 .lc-wheel-section .lc-spin-btn .elementor-button.is-pressed{
  background: var(--lc-rose, #e5adc6) !important;   /* zurück zur Basis */
  transform: none !important;
  box-shadow: 0 10px 22px rgba(229,173,198,.28) !important;
}

/* Deko-„Ohren“ am <a> sicher aus */
.page-id-4206 .lc-wheel-section .lc-spin-btn .elementor-button::before,
.page-id-4206 .lc-wheel-section .lc-spin-btn .elementor-button::after{
  content: none !important;
  display: none !important;
}

/* Nur den Spin-Button-Wrapper neutralisieren (damit kein zweiter Hintergrund) */
.page-id-4206 .lc-wheel-section .lc-spin-btn,
.page-id-4206 .lc-wheel-section .lc-spin-btn > .elementor-widget-container,
.page-id-4206 .lc-wheel-section .lc-spin-btn .elementor-button-wrapper{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}



/* ===============================
   Geschenke „Kaufen“-Buttons
   – Mobile: sauberes Tap-Feedback, kein Kleben
   =============================== */

/* Basis */
.lc-gifts-section .lc-gift-card .lc-btn.buy{
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  transition: background-color .18s ease, box-shadow .18s ease, transform .08s ease;
  outline: none;
  background: var(--accent);            /* rosa Idle */
  color:#fff;
  box-shadow: 0 8px 20px rgba(229,173,198,.28);
  border-radius: 10px;
}

/* Desktop: normales Hover */
@media (hover:hover){
  .lc-gifts-section .lc-gift-card .lc-btn.buy:hover{
    background: var(--accent-h) !important;
    transform: translateY(-1px);
    box-shadow: 0 10px 24px rgba(229,173,198,.32) !important;
  }
}

/* Touch: :hover neutralisieren, damit nichts klebt */
@media (hover:none){
  .lc-gifts-section .lc-gift-card button.lc-btn.buy:hover{
    background: var(--accent) !important;
    transform: none !important;
    box-shadow: 0 8px 20px rgba(229,173,198,.28) !important;
  }
}

/* >>> WICHTIG: Reset greift NICHT während :active */
.lc-gifts-section .lc-gift-card .lc-btn.buy:focus:not(:active),
.lc-gifts-section .lc-gift-card .lc-btn.buy:focus-visible:not(:active),
.lc-gifts-section .lc-gift-card .lc-btn.buy[aria-pressed="true"]:not(:active),
.lc-gifts-section .lc-gift-card .lc-btn.buy.active:not(:active),
.lc-gifts-section .lc-gift-card .lc-btn.buy.is-active:not(:active),
.lc-gifts-section .lc-gift-card .lc-btn.buy.pressed:not(:active),
.lc-gifts-section .lc-gift-card .lc-btn.buy.is-pressed:not(:active){
  background: var(--accent) !important;
  color:#fff !important;
  transform: none !important;
  box-shadow: 0 8px 20px rgba(229,173,198,.28) !important;
  outline: none !important;
}
/* <<< */

/* Tap-/Press-Impuls: ganz ans Ende + mit !important, damit er gewinnt */
.lc-gifts-section .lc-gift-card button.lc-btn.buy:active{
  background: var(--accent-h) !important;
  transform: translateY(1px) scale(.98) !important;
  box-shadow: 0 6px 14px rgba(229,173,198,.22) !important;
}

/* Sicherheitsnetz: keine Deko-Pseudoelemente, die den Effekt übermalen */
.lc-gifts-section .lc-gift-card .lc-btn.buy::before,
.lc-gifts-section .lc-gift-card .lc-btn.buy::after{
  content: none !important;
  display: none !important;
}



/* Seite 4206 – Outcome: 1 Card-Hintergrund wie die Gift-Cards
   -> WICHTIG: auf dem SICHTBAREN Layer (.e-con-inner) stylen */
.page-id-4206 .lc-outcome.e-con,
.page-id-4206 .lc-outcome.e-con > .e-con-inner{
  position: relative;
  isolation: isolate; /* eigener Stacking-Context */
  background: linear-gradient(145deg, var(--card1), var(--card2)) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 14px !important;
  box-shadow: 0 8px 22px rgba(0,0,0,.28) !important;
  padding: 14px 16px !important;          /* verhindert Margin-Collapse */
  overflow: hidden;                        /* saubere Kanten */
  background-clip: padding-box;
}

/* Elementor-Overlay/Lights an diesem Container sicher aus */
.page-id-4206 .lc-outcome.e-con > .e-con-inner::before,
.page-id-4206 .lc-outcome.e-con > .e-con-inner::after{
  content: none !important;
  display: none !important;
}

/* Innere Widgets dürfen keinen eigenen Card-Background mitbringen */
.page-id-4206 .lc-outcome .elementor-widget,
.page-id-4206 .lc-outcome .elementor-widget-container{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important; /* spacing steuert die Card oben */
}

/* Headline kompakter (optional) */
.page-id-4206 .lc-outcome .lc-outcome__title,
.page-id-4206 .lc-outcome .elementor-heading-title{
  margin: 0 0 8px !important;
}

/* Wert-Badge – so wie gehabt */
.page-id-4206 .lc-outcome .lc-outcome__value{
  display:inline-block;
  padding:8px 12px;
  border-radius:12px;
  font-weight:800;
  background: rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.04);
}



/* Desktop: 4 Geschenke pro Reihe (nur > 1024px) */
@media (min-width: 1024px){
  /* Grid auf 4 Spalten umstellen */
  .lc-gifts-section .lc-gifts-grid__mount{
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 22px !important;            /* kann bleiben, ggf. anpassen */
    max-width: 1200px;               /* passt für 4 Karten; ggf. 1320px */
  }

  /* Karten etwas kompakter, damit es luftiger wirkt (optional) */
  .lc-gifts-section .lc-gift-card{
    padding: 16px !important;
    min-height: 170px;               /* vorher 180px; gern feinjustieren */
  }

  /* Buy-Button vollbreit lassen (nur Safety, kein Muss) */
  .lc-gifts-section .lc-gift-card .lc-btn.buy{
    width: 100%;
  }
}/* End custom CSS */