@charset "UTF-8";
/*!
 * TrafficInsight Cookie Consent
 * Privacy-first CMP for Anonymous / Consent Mode
 *
 * Based on cookie-consent-js by Stefan Haack
 * https://github.com/shaack/cookie-consent-js
 *
 * Original license: MIT
 *
 * Major modifications, extensions and architecture:
 * © 2026 Günther Hörandl – TrafficInsight
 * Version: 1.1.0 | 2026-01-17
 */
/* ==========================================================
   Base colors
   ========================================================== */
/* ==========================================================
   Element colors
   ========================================================== */
/* ==========================================================
   Metrics
   ========================================================== */
/* ==========================================================
   Theme maps
   ========================================================== */
/* ==========================================================
   Mixins
   ========================================================== */
/* ==========================================================
   Animations
   ========================================================== */
@keyframes cc-fade {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes cc-slide-up {
  from {
    opacity: 0;
    transform: translateY(24px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes cc-slide-down {
  from {
    opacity: 0;
    transform: translateY(-24px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
/* ==========================================================
   Component
   ========================================================== */
.cookie-consent-modal {
  position: fixed;
  z-index: 1000;
  font-family: sans-serif;
  animation: cc-fade 0.25s ease-out;
}
.cookie-consent-modal .modal-content-wrap {
  position: fixed;
  margin: 1rem;
  bottom: 0;
}
.cookie-consent-modal .modal-content-wrap.right {
  right: 0;
}
.cookie-consent-modal .modal-content-wrap.left {
  left: 0;
}
.cookie-consent-modal .modal-content-wrap.center, .cookie-consent-modal .modal-content-wrap.centered {
  top: 50%;
  left: 50%;
  bottom: auto;
  transform: translate(-50%, -50%);
}
.cookie-consent-modal .modal-content-wrap.top {
  top: 0;
  left: 50%;
  bottom: auto;
  transform: translateX(-50%);
}
.cookie-consent-modal .modal-content-wrap.right, .cookie-consent-modal .modal-content-wrap.left, .cookie-consent-modal .modal-content-wrap.bottom {
  animation: cc-slide-up 0.35s ease-out;
}
.cookie-consent-modal .modal-content-wrap.top {
  animation: cc-slide-down 0.35s ease-out;
}
.cookie-consent-modal .modal-content-wrap.center, .cookie-consent-modal .modal-content-wrap.centered {
  animation: cc-fade 0.25s ease-out;
}
.cookie-consent-modal .modal-content-wrap .modal-content {
  border: 1px solid;
  max-width: 700px;
  border-radius: 0.2rem;
  box-shadow: 0 1rem 2rem rgba(0, 0, 0, 0.4);
  padding: 0;
  background-color: #f8f9fa;
  color: #212529;
  border-color: #ced4da;
}
.cookie-consent-modal .modal-content-wrap .modal-content a {
  color: #0d6efd;
}
.cookie-consent-modal .modal-content-wrap .modal-content a:hover {
  color: rgb(1.762295082, 87.2336065574, 213.237704918);
}
.cookie-consent-modal .modal-content-wrap .modal-content .btn-primary {
  background-color: #0d6efd;
  border-color: #0d6efd;
  color: #fff;
}
.cookie-consent-modal .modal-content-wrap .modal-content .btn-primary:hover {
  background-color: rgb(1.762295082, 87.2336065574, 213.237704918);
  border-color: rgb(1.762295082, 87.2336065574, 213.237704918);
}
.cookie-consent-modal .modal-content-wrap .modal-content .btn-secondary {
  background-color: #6c757d;
  border-color: #6c757d;
  color: #fff;
}
.cookie-consent-modal .modal-content-wrap .modal-content .btn-secondary:hover {
  background-color: rgb(84.3605150215, 91.3905579399, 97.6394849785);
  border-color: rgb(84.3605150215, 91.3905579399, 97.6394849785);
}
.cookie-consent-modal .modal-content-wrap .modal-content .modal-header {
  padding: 1rem;
}
.cookie-consent-modal .modal-content-wrap .modal-content .modal-header h3 {
  margin: 0;
  font-size: 130%;
  font-weight: 500;
}
.cookie-consent-modal .modal-content-wrap .modal-content .modal-body {
  padding: 1rem;
  line-height: 1.3;
}
.cookie-consent-modal .modal-content-wrap .modal-content .modal-footer {
  padding: 1rem 0.5rem 0.5rem;
}
.cookie-consent-modal .modal-content-wrap .modal-content .modal-footer .buttons {
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
}
.cookie-consent-modal .modal-content-wrap .modal-content .modal-footer .buttons .btn {
  padding: 0.375rem 0.75rem;
  border-radius: 0.2rem;
  margin: 0 0.5rem 0.5rem;
  font-size: 1rem;
  line-height: 1.5;
  border: 1px solid;
}
.cookie-consent-modal {
  /* ==========================================================
     Mobile: IMMER Bottom-Sheet (egal welche position aus JS kommt)
     ========================================================== */
}
@media screen and (max-width: 620px) {
  .cookie-consent-modal {
    /* Wrapper: erzwinge unten + full width - margin + keine transforms */
  }
  .cookie-consent-modal .modal-content-wrap,
  .cookie-consent-modal .modal-content-wrap.right,
  .cookie-consent-modal .modal-content-wrap.left,
  .cookie-consent-modal .modal-content-wrap.center,
  .cookie-consent-modal .modal-content-wrap.centered,
  .cookie-consent-modal .modal-content-wrap.top,
  .cookie-consent-modal .modal-content-wrap.bottom {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    top: auto;
    margin: 0.75rem; /* kleiner Rand links/rechts/unten */
    width: auto;
    max-width: none;
    transform: none;
  }
  .cookie-consent-modal {
    /* Modal selbst voll breit */
  }
  .cookie-consent-modal .modal-content-wrap .modal-content {
    width: 100%;
    max-width: none; /* 700px Limit aufheben */
    border-radius: 0.5rem 0.5rem 0 0; /* Bottom-Sheet Look */
  }
  .cookie-consent-modal {
    /* Buttons untereinander und 100% */
  }
  .cookie-consent-modal .modal-footer .buttons .btn {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
  }
}
.cookie-consent-modal.block-access {
  inset: 0;
  background-color: rgba(0, 0, 0, 0.5);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  overflow: auto;
  padding-top: 20vh;
}
@media (max-width: 620px) {
  .cookie-consent-modal.block-access {
    padding-top: 0;
  }
}
.cookie-consent-modal.block-access {
  /* Desktop-Layout in block-access (zentriert) */
}
.cookie-consent-modal.block-access .modal-content-wrap:not(.center):not(.centered) {
  position: relative;
  margin: 2.5% auto;
  width: 95%;
  bottom: auto;
}
.cookie-consent-modal.block-access .modal-content {
  border: none;
  margin: 0 auto;
}
.cookie-consent-modal.block-access {
  /* ==========================================================
     Mobile + block-access: überschreibe die 95%-Regel zuverlässig
     ========================================================== */
}
@media (max-width: 620px) {
  .cookie-consent-modal.block-access .modal-content-wrap:not(.center):not(.centered) {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    top: auto;
    margin: 0.75rem;
    width: auto;
    max-width: none;
    transform: none;
  }
  .cookie-consent-modal.block-access .modal-content-wrap .modal-content {
    width: 100%;
    max-width: none;
    border-radius: 0.5rem 0.5rem 0 0;
  }
}

/* ==========================================================
   Dark mode (system)
   ========================================================== */
@media (prefers-color-scheme: dark) {
  .cookie-consent-modal .modal-content {
    background-color: #1e1f22;
    color: #e4e6eb;
    border-color: #2b2d31;
  }
  .cookie-consent-modal .modal-content a {
    color: rgb(63.5819672131, 140.3073770492, 253.4180327869);
  }
  .cookie-consent-modal .modal-content a:hover {
    color: rgb(38.2909836066, 125.1536885246, 253.2090163934);
  }
  .cookie-consent-modal .modal-content .btn-primary {
    background-color: rgb(63.5819672131, 140.3073770492, 253.4180327869);
    border-color: rgb(63.5819672131, 140.3073770492, 253.4180327869);
    color: #fff;
  }
  .cookie-consent-modal .modal-content .btn-primary:hover {
    background-color: rgb(38.2909836066, 125.1536885246, 253.2090163934);
    border-color: rgb(38.2909836066, 125.1536885246, 253.2090163934);
  }
  .cookie-consent-modal .modal-content .btn-secondary {
    background-color: #8b8d91;
    border-color: #8b8d91;
    color: #fff;
  }
  .cookie-consent-modal .modal-content .btn-secondary:hover {
    background-color: #73757a;
    border-color: #73757a;
  }
  .cookie-consent-modal.block-access {
    background-color: rgba(0, 0, 0, 0.65);
  }
}
/* ==========================================================
   Manual dark mode override
   ========================================================== */
[data-theme=dark] .cookie-consent-modal .modal-content {
  background-color: #1e1f22;
  color: #e4e6eb;
  border-color: #2b2d31;
}
[data-theme=dark] .cookie-consent-modal .modal-content a {
  color: rgb(63.5819672131, 140.3073770492, 253.4180327869);
}
[data-theme=dark] .cookie-consent-modal .modal-content a:hover {
  color: rgb(38.2909836066, 125.1536885246, 253.2090163934);
}
[data-theme=dark] .cookie-consent-modal .modal-content .btn-primary {
  background-color: rgb(63.5819672131, 140.3073770492, 253.4180327869);
  border-color: rgb(63.5819672131, 140.3073770492, 253.4180327869);
  color: #fff;
}
[data-theme=dark] .cookie-consent-modal .modal-content .btn-primary:hover {
  background-color: rgb(38.2909836066, 125.1536885246, 253.2090163934);
  border-color: rgb(38.2909836066, 125.1536885246, 253.2090163934);
}
[data-theme=dark] .cookie-consent-modal .modal-content .btn-secondary {
  background-color: #8b8d91;
  border-color: #8b8d91;
  color: #fff;
}
[data-theme=dark] .cookie-consent-modal .modal-content .btn-secondary:hover {
  background-color: #73757a;
  border-color: #73757a;
}

/* ==========================================================
   Reduced motion
   ========================================================== */
@media (prefers-reduced-motion: reduce) {
  .cookie-consent-modal,
  .modal-content-wrap {
    animation: none !important;
  }
}

/*# sourceMappingURL=cookie-consent.css.map */
