/*
 * NET Centre Planner: cookie bar theme and footer (eplatforms consent drop-in, 2026-09-15).
 * Loaded after /consent/consent.css. Colours match the planner: navy #003771, blue #0056ad,
 * teal panels rgba(4,144,135,.5), Montserrat.
 */
.cc-bar,
.cc-modal {
  --cc-font: Montserrat, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
}

/* While the bar shows, lift the full-screen planner so Back / Next stay above it. */
body.cc-bar-open #renderer { bottom: var(--cc-bar-h, 0px); }

/* ---------- footer: start page ---------- */
.ep-planner-footer {
  font-family: Montserrat, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  color: #ffffff;
}
.ep-planner-footer__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0 1.5rem;
  max-width: 1280px;
  margin: 3rem auto 0;
  padding: 0.75rem 1rem 1rem;
  border-top: 1px solid rgba(255, 255, 255, 0.25);
  font-size: 0.875rem;
  line-height: 1.4;
}
.ep-planner-footer a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: #ffffff;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}
.ep-planner-footer a:hover { text-decoration-thickness: 2px; }
.ep-planner-footer a:focus-visible {
  outline: 3px solid #ff8f1c;
  outline-offset: 2px;
}

/* ---------- footer: planner screen (full-screen canvas) ---------- */
/* Bottom left, in the planner's own teal panel style, level with Back / Next. */
body:has(#planner) .ep-planner-footer {
  position: fixed;
  left: 0;
  bottom: 0;
  z-index: 10;
}
body.cc-bar-open:has(#planner) .ep-planner-footer { bottom: var(--cc-bar-h, 0px); }
body:has(#planner) .ep-planner-footer__inner {
  margin: 0 0 0.5rem 0.5rem;
  padding: 0 0.75rem;
  gap: 0 1rem;
  border: 0;
  border-radius: 0.25rem;
  background-color: rgba(4, 144, 135, 0.5);
  font-size: 0.8125rem;
}
body:has(#planner) .ep-planner-footer__site { display: none; }
/* The tools panel fills the left edge in the placing steps; phones have no free corner. */
body:has(#tools) .ep-planner-footer { display: none; }
@media (max-width: 639px) {
  body:has(#planner) .ep-planner-footer { display: none; }
}
@media print {
  .ep-planner-footer { display: none; }
}