/* PIC.MD cookie consent banner. Colors match the checkout button (#2788cc / #ea1f2d). */
.pic-consent {
  --pic-consent-accent: #2788cc;
  --pic-consent-accent-hover: #ea1f2d;
  --pic-consent-text: #212121;
  --pic-consent-muted: #616161;
  --pic-consent-line: #e0e0e0;
  position: fixed;
  left: 16px;
  right: 16px;
  bottom: 16px;
  z-index: 2147483000;
  display: flex;
  justify-content: center;
  pointer-events: none;
  font-family: "Open Sans", sans-serif;
}

/* Hide the floating cart bar (footer #footercart) while the banner is open, so they don't overlap. */
body:has(.pic-consent) #footercart {
  display: none !important;
}

.pic-consent__inner {
  pointer-events: auto;
  width: 100%;
  max-width: 720px;
  max-height: calc(100vh - 32px);
  overflow-y: auto;
  background: #fff;
  color: var(--pic-consent-text);
  border: 1px solid var(--pic-consent-line);
  border-radius: 0.5em;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
  padding: 1.25em 1.5em;
  font-size: 15px;
  line-height: 1.5;
}

.pic-consent__title {
  margin: 0 0 0.4em;
  font-family: "Montserrat", sans-serif;
  font-weight: 700;
  font-size: 1.1em;
}

.pic-consent__text {
  margin: 0 0 1em;
  font-size: 0.93em;
  color: var(--pic-consent-muted);
}

.pic-consent__text a {
  color: var(--pic-consent-accent);
  text-decoration: underline;
}

.pic-consent__settings {
  margin: 0 0 1em;
  border-top: 1px solid var(--pic-consent-line);
}

.pic-consent__settings[hidden],
.pic-consent__btn[hidden] {
  display: none;
}

.pic-consent__cat {
  padding: 0.75em 0;
  border-bottom: 1px solid var(--pic-consent-line);
}

.pic-consent__cat-head {
  display: flex;
  align-items: center;
  gap: 0.6em;
  margin: 0;
  font-weight: 600;
  cursor: pointer;
}

.pic-consent__cat-head input {
  width: 1.1em;
  height: 1.1em;
  margin: 0;
  accent-color: var(--pic-consent-accent);
}

.pic-consent__always {
  margin-left: auto;
  font-size: 0.8em;
  font-weight: 400;
  color: var(--pic-consent-muted);
}

.pic-consent__cat-desc {
  margin: 0.25em 0 0 1.7em;
  font-size: 0.85em;
  color: var(--pic-consent-muted);
}

.pic-consent__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6em;
}

/* Accept and Reject look the same on purpose: refusing must be as easy as accepting. */
.pic-consent__btn {
  flex: 1 1 140px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  margin: 0;
  padding: 0.85em 1em;
  border: 2px solid var(--pic-consent-accent);
  border-radius: 0.25em;
  background: var(--pic-consent-accent);
  color: #fff;
  font: inherit;
  font-size: 0.9em;
  font-weight: 600;
  line-height: 1;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  cursor: pointer;
}

.pic-consent__btn:hover,
.pic-consent__btn:focus-visible {
  background: var(--pic-consent-accent-hover);
  border-color: var(--pic-consent-accent-hover);
  color: #fff;
}

.pic-consent__btn:focus-visible {
  outline: 2px solid var(--pic-consent-text);
  outline-offset: 2px;
}

.pic-consent__btn--ghost {
  background: #fff;
  color: var(--pic-consent-accent);
}

@media (max-width: 478px) {
  .pic-consent {
    left: 8px;
    right: 8px;
    bottom: 8px;
  }

  .pic-consent__inner {
    padding: 1em;
    font-size: 14px;
  }

  .pic-consent__btn {
    flex-basis: 100%;
  }
}

/* Click-to-load placeholder for blocked embeds (Google Maps). Fills the embed's box. */
.pic-consent-embed {
  position: absolute;
  inset: 0;
}

.pic-consent-embed__placeholder {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.75em;
  padding: 1.25em;
  background: #f5f5f5;
  color: #424242;
  font-family: "Open Sans", sans-serif;
  font-size: 14px;
  line-height: 1.45;
  text-align: center;
}

.pic-consent-embed.is-loaded .pic-consent-embed__placeholder {
  display: none;
}

.pic-consent-embed__icon {
  width: 32px;
  height: 32px;
  fill: #2788cc;
}

.pic-consent-embed__text {
  max-width: 320px;
  margin: 0;
}

.pic-consent-embed__btn {
  text-align: center;
  margin: 0;
  padding: 0.75em 1.25em;
  border: 0;
  border-radius: 0.25em;
  background: #2788cc;
  color: #fff;
  font: inherit;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
}

.pic-consent-embed__btn:hover,
.pic-consent-embed__btn:focus-visible {
  background: #ea1f2d;
}

.pic-consent-embed__link {
  color: #2788cc;
  text-decoration: underline;
}