div#cookie-banner {
  position: fixed; 
  bottom: 0; 
  width: 20%; 
  right: 0;
  z-index: 1000;
  background-color: white;
  display: grid;
  row-gap: .5rem;
  
  padding: 1rem; 
  margin: 1rem;
  border-radius: var(--border-radius);
  box-shadow: var(--box-shadow);
}

div#cookie-banner button {
  width: min-content;
  justify-self: right;
}

.cookie-banner-shadow {
  position:fixed;
  height: 100vh;
  width: 100vw;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  z-index: 999;
  background-color: rgba(0,0,0,.5);
}

body:has(div#cookie-banner) {
  height: 100vh;
  overflow: hidden !important;
}

/* Small devices such as large phones (640px and up) */
@media screen and (max-width: 48em) {
  div#cookie-banner {
    width: auto;
    left: 0;
    right: 0;
  }
}



div#cookie-banner.hidden {
  display: none;
}