/* ============================================================
   MOTAVIO COOKIE – VISIBLE BACKGROUND FINAL

   Ziel:
   - Website hinter Cookie-Popup bleibt sichtbar
   - nur leichte Abdunklung
   - leichter Blur
   - Hintergrund nicht anklickbar
   - Cookie-Dialog klar im Vordergrund
   ============================================================ */


/* ============================================================
   ALTES FAST-SCHWARZES VOLLFLÄCHEN-OVERLAY ABSCHALTEN
   ============================================================ */

html.mv-consent-lock body::before {
  content: none !important;

  display: none !important;

  opacity: 0 !important;

  background: transparent !important;

  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}


/* ============================================================
   WEBSITE BLEIBT SICHTBAR
   ============================================================ */

html.mv-consent-lock,
html.mv-consent-lock body {
  overflow: hidden !important;
}


html.mv-consent-lock
body
>
*:not(#mv-consent-root) {
  visibility: visible !important;

  opacity: 1 !important;

  filter: none !important;

  transform: none !important;

  pointer-events: none !important;

  user-select: none !important;
}


/* ============================================================
   MODERNES SHOP-ARTIGES OVERLAY
   ============================================================ */

html body
.mv-consent-overlay {
  position: fixed !important;

  inset: 0 !important;

  z-index: 2147483000 !important;

  padding: 24px !important;

  display: grid !important;

  place-items: center !important;

  /*
   * Nur leichte Abdunklung.
   * Die Website bleibt klar sichtbar.
   */
  background:
    rgba(
      2,
      8,
      14,
      0.34
    ) !important;

  backdrop-filter:
    blur(3px)
    saturate(0.96) !important;

  -webkit-backdrop-filter:
    blur(3px)
    saturate(0.96) !important;
}


html body
.mv-consent-overlay[hidden] {
  display: none !important;
}


/* ============================================================
   COOKIE-FENSTER STÄRKER VOM HINTERGRUND TRENNEN
   ============================================================ */

html body
.mv-consent-dialog {
  position: relative !important;

  z-index: 2147483100 !important;

  box-shadow:
    0 35px 100px
    rgba(
      0,
      0,
      0,
      0.48
    ) !important;
}


/* ============================================================
   LIGHT MODE
   ============================================================ */

html[data-mv-theme="light"]
body
.mv-consent-overlay,

html[data-theme="light"]
body
.mv-consent-overlay {
  background:
    rgba(
      7,
      26,
      44,
      0.20
    ) !important;

  backdrop-filter:
    blur(3px)
    saturate(0.97) !important;

  -webkit-backdrop-filter:
    blur(3px)
    saturate(0.97) !important;
}


html[data-mv-theme="light"]
body
.mv-consent-dialog,

html[data-theme="light"]
body
.mv-consent-dialog {
  box-shadow:
    0 35px 90px
    rgba(
      7,
      26,
      44,
      0.24
    ) !important;
}


/* ============================================================
   DARK MODE
   ============================================================ */

html:not([data-mv-theme="light"])
body
.mv-consent-overlay,

html[data-mv-theme="dark"]
body
.mv-consent-overlay {
  background:
    rgba(
      0,
      5,
      10,
      0.31
    ) !important;
}


/* ============================================================
   MOBILE
   ============================================================ */

@media(max-width: 680px) {

  html body
  .mv-consent-overlay {
    padding:
      10px !important;

    place-items:
      end center !important;

    background:
      rgba(
        2,
        8,
        14,
        0.29
      ) !important;

    backdrop-filter:
      blur(2px) !important;

    -webkit-backdrop-filter:
      blur(2px) !important;
  }


  html[data-mv-theme="light"]
  body
  .mv-consent-overlay {
    background:
      rgba(
        7,
        26,
        44,
        0.17
      ) !important;
  }

}
