/* ============================================================
   Tribeca Lisboa — COOKIE CONSENT (WP-C1)
   Loaded on every page right after responsive.css, so --gut,
   --ink, --paper, --pink and --font-text are already defined.
   Panel: fixed at the bottom — full width on phones, a compact
   box at bottom-left with the site gutter on desktop. z-index
   140 sits above the event page's sticky bar (45) and overlays
   (120/130); the panel disappears after a choice, so it never
   hides the ticket bar permanently.
   ============================================================ */
.tfl-cb{ position:fixed; z-index:140; left:0; right:0; bottom:0;
  background:var(--ink); color:var(--paper);
  border:1px solid rgba(255,255,255,.2); border-bottom:none; }
.tfl-cb[hidden]{ display:none; }
.tfl-cb-in{ padding:20px var(--gut) 24px; display:flex; flex-direction:column; gap:16px; }
.tfl-cb-txt{ margin:0; font-family:var(--font-text); font-size:14px; line-height:1.5; }
.tfl-cb-link{ color:var(--paper); text-decoration:underline; }
.tfl-cb-act{ display:flex; gap:12px; }
.tfl-cb-btn{ flex:1 1 0; min-width:44px; min-height:44px; padding:12px 16px;
  background:transparent; border:1px solid var(--paper); color:var(--paper);
  font-family:var(--font-text); font-weight:700; font-size:14px; cursor:pointer; }
.tfl-cb-btn:hover{ background:var(--pink); border-color:var(--pink); color:var(--ink); }
.tfl-cb-btn:focus-visible{ outline:2px solid var(--pink); outline-offset:3px; }
.tfl-cb-link:focus-visible{ outline:2px solid var(--pink); outline-offset:3px; }

/* desktop: compact box at bottom-left, aligned to the site gutter */
@media (min-width:768px){
  .tfl-cb{ left:var(--gut); right:auto; max-width:600px; }
  /* own padding, not the page gutter (operator review: the ~60px gutter squeezed the text into 5 lines) */
  .tfl-cb-in{ flex-direction:row; align-items:center; justify-content:space-between; gap:24px; padding:20px 24px; }
  .tfl-cb-txt{ flex:1 1 auto; }
  .tfl-cb-act{ flex:0 0 auto; }
}

/* animate only when the visitor did not ask for reduced motion */
@media (prefers-reduced-motion: no-preference){
  .tfl-cb-btn{ transition:background .15s, border-color .15s, color .15s; }
  .tfl-cb-link{ transition:color .15s; }
}

/* footer "Cookie preferences" — looks exactly like .r-ft-col a */
.r-ft-linkbtn{ background:none; border:0; padding:0; margin:0; cursor:pointer;
  text-align:left; color:#fff; font-family:var(--font-text); font-weight:700;
  font-size:15px; text-decoration:none; width:fit-content; }
.r-ft-linkbtn:hover{ color:var(--pink); }
.r-ft-linkbtn:focus-visible{ outline:2px solid var(--pink); outline-offset:3px; }
@media (prefers-reduced-motion: no-preference){
  .r-ft-linkbtn{ transition:color .15s; }
}
