/* Building Permits Florida — consent layer styles.
   Phase 3B-14 R3.

   Kept in its own file so style.css stays byte-identical to the state
   certified at the end of 3B-13 (42 726 B / 06f91d0a…fbba).

   Colours come from the theme's own tokens, so the notice inherits the brand
   without redefining it. Accept and reject are visually equal in weight,
   size and contrast: the only difference is colour, and neither is hidden,
   greyed out or made smaller than the other. */

.bpf-consent {
  position: fixed;
  inset-inline: 0;
  inset-block-end: 0;
  z-index: 9999;
  background: var(--wp--preset--color--navy-950, #001B37);
  color: var(--wp--preset--color--navy-300, #BDC8D3);
  border-block-start: 3px solid var(--wp--preset--color--brand-gold, #D8B36A);
  padding: var(--wp--preset--spacing--40, 1rem) var(--wp--preset--spacing--50, 1.5rem);
  box-shadow: 0 -8px 24px rgb(0 0 0 / 28%);
}

/* On short viewports, and at 200% zoom, the notice must never grow taller than
   the screen and hide its own buttons. It caps itself and scrolls internally,
   so every option stays reachable. */
.bpf-consent {
  max-block-size: 85dvh;
  overflow-y: auto;
  overscroll-behavior: contain;
}

@supports not (max-block-size: 1dvh) {
  .bpf-consent { max-block-size: 85vh; }
}

.bpf-consent__inner {
  max-width: var(--wp--style--global--wide-size, 72rem);
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  gap: .75rem;
}

.bpf-consent__title {
  margin: 0;
  font-family: var(--wp--preset--font-family--serif, Georgia, serif);
  font-size: var(--wp--preset--font-size--md, 1.25rem);
  font-weight: 600;
  color: #fff;
  line-height: 1.2;
}

.bpf-consent__body {
  margin: 0;
  font-size: var(--wp--preset--font-size--sm, .9375rem);
  line-height: 1.5;
  max-width: 68ch;
}

.bpf-consent__policy {
  color: var(--wp--preset--color--brand-gold, #D8B36A);
  font-size: var(--wp--preset--font-size--sm, .9375rem);
  text-underline-offset: .2em;
}

.bpf-consent__policy:focus-visible,
.bpf-consent__btn:focus-visible {
  outline: 3px solid var(--wp--preset--color--brand-gold, #D8B36A);
  outline-offset: 2px;
}

.bpf-consent__actions {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
}

/* Both buttons are identical: same geometry, same background, same text
   colour, same border. There is no visual hierarchy between accepting and
   refusing, which is the point of gate 9.

   An earlier revision gave "allow everything" a filled orange background.
   That was two defects at once: it made one option more prominent than the
   others, and white on #C9611F measures ~4.03:1, which fails WCAG AA.
   White on the notice's own #001B37 measures 17.3:1, and the #BDC8D3 border
   on that same background measures 10.2:1.

   R3 drops the third button entirely. Advertising is out of scope, so there
   is no option to offer and no --all variant to style. */
.bpf-consent__btn {
  flex: 0 1 auto;
  min-height: 44px;
  padding: .5rem 1.25rem;
  font-family: inherit;
  font-size: var(--wp--preset--font-size--sm, .9375rem);
  font-weight: 600;
  line-height: 1.2;
  border-radius: var(--wp--custom--radius--sm, 4px);
  border: 2px solid transparent;
  cursor: pointer;
}

.bpf-consent__btn--reject,
.bpf-consent__btn--analytics {
  background: transparent;
  color: #fff;                                        /* 17.3:1 on #001B37 */
  border-color: var(--wp--preset--color--navy-300, #BDC8D3); /* 10.2:1 */
}

.bpf-consent__btn--reject:hover,
.bpf-consent__btn--analytics:hover {
  border-color: #fff;
}

/* The advertising category, shown and described as inactive rather than
   hidden. It is a status line, not a control: nothing here is focusable,
   nothing is greyed out to look like a disabled switch, and the text is at
   full contrast. #D8B36A on #001B37 measures 8.73:1 and #BDC8D3 measures
   10.2:1, so neither reads as "dimmed". */
.bpf-consent__ads {
  margin: 0;
  font-size: var(--wp--preset--font-size--sm, .9375rem);
  line-height: 1.5;
  max-width: 68ch;
}

.bpf-consent__ads-status {
  color: var(--wp--preset--color--brand-gold, #D8B36A);
  font-weight: 600;
  margin-inline-end: .5ch;
}

.bpf-consent__ads-note {
  color: var(--wp--preset--color--navy-300, #BDC8D3);
}

/* The permanent reopen control. Discreet, but a real focusable control with
   a visible focus ring, never a hidden or decorative element. */
.bpf-consent-reopen {
  background: none;
  border: 0;
  padding: 0;
  font: inherit;
  color: inherit;
  text-decoration: underline;
  text-underline-offset: .2em;
  cursor: pointer;
}

.bpf-consent-reopen:focus-visible {
  outline: 3px solid var(--wp--preset--color--brand-gold, #D8B36A);
  outline-offset: 2px;
}

@media (min-width: 40rem) {
  .bpf-consent__inner {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
  }

  .bpf-consent__actions {
    flex-wrap: nowrap;
  }
}

@media (prefers-reduced-motion: no-preference) {
  .bpf-consent {
    animation: bpf-consent-in .18s ease-out;
  }

  @keyframes bpf-consent-in {
    from { transform: translateY(100%); }
    to   { transform: translateY(0); }
  }
}