/* Consent UI: the banner and the per-form opt-in checkbox.
 *
 * Its own file because every page needs it and only some pages load tcs.css. It used to exist
 * twice, inline in index.html and again in tcs.css, which is two places for one banner to drift.
 *
 * Every custom property used here is declared by each page's own :root. Nothing is hard-coded,
 * so the banner inherits the palette of whatever page it appears on. */

#tcs-consent{position:fixed;left:0;right:0;bottom:0;z-index:200;background:var(--paper-2);
  border-top:1px solid var(--line-2);box-shadow:0 -8px 30px -18px rgba(22,21,15,.4)}
.tcs-consent-inner{max-width:1120px;margin:0 auto;padding:16px 20px;display:flex;gap:18px;
  align-items:center;justify-content:space-between;flex-wrap:wrap}
.tcs-consent-inner p{font-size:.88rem;color:var(--ink-2);max-width:62ch;margin:0}
.tcs-consent-inner a{color:var(--ink)}
.tcs-consent-actions{display:flex;gap:10px;flex-shrink:0;flex-wrap:wrap}
.tcs-consent-actions button{min-height:42px;padding:10px 20px;border-radius:100px;
  border:1px solid var(--line-2);background:var(--paper);color:var(--ink);
  font:inherit;font-size:.9rem;font-weight:600;cursor:pointer}
.tcs-consent-actions button:hover{background:var(--paper-3)}
.tcs-consent-actions .tcs-primary{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.tcs-consent-actions button:focus-visible{outline:3px solid var(--ink);outline-offset:2px}

/* Three choices do not fit one row on a phone. Each gets a full-width tap target rather than a
   third of one, and Decline stays first so the safer option is never the hardest to hit. */
@media(max-width:720px){
  .tcs-consent-inner{flex-direction:column;align-items:flex-start}
  .tcs-consent-actions{width:100%;flex-direction:column}
  .tcs-consent-actions button{width:100%}
}

/* Marketing consent checkbox, inside both email forms. Never pre-ticked. */
.tcs-optin{display:flex;gap:10px;align-items:flex-start;margin-top:16px}
.tcs-optin input{width:18px;height:18px;margin:2px 0 0;flex-shrink:0}
.tcs-optin label{font-size:.86rem;color:var(--ink-3);line-height:1.45}
.tcs-optin a{color:var(--ink-2)}
