/* ============================================================================
   Privacy Information Notice — bitcoinhyper.eu (EU English site)
   FASE 4G-E2
   ----------------------------------------------------------------------------
   Non-blocking, informational-only bottom bar. It is purely informational:
   it does not gate the page, does not overlay it, does not block scrolling,
   and is visually distinct from the site's privacy-tool panel.

   Constraints:
   - No remote URLs, no embedded binary data, no imported fonts (inherited).
   - Inherits the site fonts (font: inherit).
   - No Tailwind dependency (fully self-contained selectors).
   - z-index high enough to be visible, but BELOW the privacy-tool panels.
   - Horizontal layout on desktop, vertical on mobile, no horizontal overflow.
   - Dark background, discreet gold border, ivory text, gold Continue button.
   - Respects prefers-reduced-motion.
   ========================================================================== */

#bh-privacy-info-notice {
  /* Fixed informational bar pinned to the bottom, full width. */
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  /* The site's privacy-tool banner/widget use very high z-indexes
     (2147483xxx). Keep this comfortably below them so it never covers it. */
  z-index: 2147480000;

  box-sizing: border-box;
  width: 100%;
  margin: 0;
  padding: 0;

  /* Site palette: dark background, ivory text. */
  background-color: #0A0C10;
  color: #F7F4EC;

  /* Discreet gold top border, no full box to stay understated. */
  border-top: 1px solid #C9A227;
  box-shadow: 0 -6px 24px rgba(0, 0, 0, 0.45);

  /* Inherit the site typography rather than importing any font. */
  font-family: inherit;
  font-size: 15px;
  line-height: 1.5;

  /* Gentle entrance; disabled under prefers-reduced-motion (see below). */
  animation: bh-pin-slide-up 320ms ease-out both;
}

#bh-privacy-info-notice *,
#bh-privacy-info-notice *::before,
#bh-privacy-info-notice *::after {
  box-sizing: border-box;
}

/* Inner wrapper: consistent max-width, centred, horizontal on desktop. */
.bh-pin-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 16px 20px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
}

.bh-pin-text {
  flex: 1 1 420px;
  min-width: 0; /* allow shrinking, prevents horizontal overflow */
}

.bh-pin-eyebrow {
  display: block;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #F7A91E;
  margin: 0 0 4px 0;
}

.bh-pin-title {
  display: block;
  font-size: 16px;
  font-weight: 700;
  color: #F7F4EC;
  margin: 0 0 6px 0;
}

.bh-pin-body {
  display: block;
  font-size: 14px;
  color: #D8D3C7;
  margin: 0;
}

/* Policy links: readable, clearly links (underlined), NOT button-like,
   so they read as plain in-text links rather than actionable controls. */
.bh-pin-link {
  color: #F7A91E;
  text-decoration: underline;
  text-underline-offset: 2px;
  white-space: nowrap;
}

.bh-pin-link:hover,
.bh-pin-link:focus-visible {
  color: #FFC24D;
}

/* Actions cluster (holds only the Continue button). */
.bh-pin-actions {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 12px;
}

/* Continue: gold button with dark text — the single primary action. */
.bh-pin-continue {
  font-family: inherit;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: #0A0C10;
  background-color: #F7A91E;
  border: 1px solid #C9A227;
  border-radius: 8px;
  padding: 10px 22px;
  cursor: pointer;
  /* Adequate touch target. */
  min-height: 44px;
  min-width: 96px;
  transition: background-color 160ms ease, transform 160ms ease;
}

.bh-pin-continue:hover {
  background-color: #FFC24D;
}

.bh-pin-continue:active {
  transform: translateY(1px);
}

/* Visible keyboard focus for all interactive elements. */
#bh-privacy-info-notice a:focus-visible,
#bh-privacy-info-notice button:focus-visible {
  outline: 2px solid #F7F4EC;
  outline-offset: 2px;
  border-radius: 6px;
}

/* --- Mobile: stack vertically, full-width Continue button. --- */
@media (max-width: 640px) {
  .bh-pin-inner {
    flex-direction: column;
    align-items: stretch;
    gap: 14px;
    padding: 14px 16px;
  }

  .bh-pin-actions {
    width: 100%;
  }

  .bh-pin-continue {
    width: 100%;
  }

  #bh-privacy-info-notice {
    font-size: 14px;
  }
}

/* --- Respect reduced-motion preference. --- */
@media (prefers-reduced-motion: reduce) {
  #bh-privacy-info-notice {
    animation: none;
  }

  .bh-pin-continue {
    transition: none;
  }
}

@keyframes bh-pin-slide-up {
  from {
    transform: translateY(100%);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}