/* The consent banner: a snow strip fixed to the foot of the page (owner, 2026-09-18). It is not
   modal and it has no backdrop, so the page underneath stays readable and usable, the trip request
   included: a banner that blocked the page would be a cookie wall. Every value is a theme token
   (brand-book/tokens/tokens.css), so the banner follows the design system. */
.el-consent {
  position: fixed;
  inset-inline: 0;
  inset-block-end: 0;
  z-index: 60;
  border-block-start: 1px solid var(--c-rule);
  /* Long wording on a short phone scrolls inside the banner rather than covering the page. */
  max-block-size: 70vh;
  overflow-y: auto;
  overscroll-behavior: contain;
}
.el-consent[hidden] { display: none; }
.el-consent__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--s-3) var(--s-6);
  padding-block: var(--s-4);
}
.el-consent__words { flex: 1 1 32rem; max-inline-size: 72ch; }
.el-consent__title {
  margin: 0 0 var(--s-2);
  font-size: var(--t-small);
  line-height: var(--t-small-lh);
  font-weight: 500;
}
.el-consent__text {
  margin: 0;
  font-size: var(--t-small);
  line-height: var(--t-small-lh);
}
/* Refusing is exactly as easy as allowing: the same button, the same size, side by side. */
.el-consent__actions { display: flex; flex-wrap: wrap; gap: var(--s-3); }
.el-consent .btn { min-block-size: 48px; min-inline-size: 12rem; justify-content: center; cursor: pointer; }
@media (max-width: 30rem) {
  .el-consent__actions { inline-size: 100%; }
  .el-consent .btn { flex: 1 1 100%; min-inline-size: 0; }
}
