/* Theme 2.0 cookie consent banner + settings dialog. Owner: Account/Auth agent. Tokens and t2-* components only: no hex, weights 400/500/700.
   Bottom glass bar above the Ask bar (js sets --cc-bottom from the real bar). 375px gate: buttons stack full width at 44px. */

.t2-consent { position: fixed; z-index: 50; left: 16px; right: 16px; bottom: var(--cc-bottom, 16px); margin: 0 auto; max-width: 1040px;
  display: flex; align-items: center; gap: 24px; padding: 18px 20px; box-sizing: border-box;
  border-radius: var(--rad-panel); border: 1px solid var(--pbd); box-shadow: var(--shadow);
  background: color-mix(in srgb, var(--panel) 72%, transparent); backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px);
  animation: cc-in 0.22s var(--ease) both; }
@supports not (backdrop-filter: blur(1px)) { .t2-consent { background: color-mix(in srgb, var(--panelsolid) 94%, transparent); } }
.t2-consent[hidden] { display: none; }
@keyframes cc-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .t2-consent { animation: none; } }

.cc-txt { flex: 1; min-width: 0; }
.cc-title { margin: 0 0 4px; font-size: 15px; font-weight: 500; color: var(--tx); }
.cc-body { margin: 0; font-size: 13px; line-height: 1.5; color: var(--t2); }
.cc-body a, .cc-modal a { color: var(--tx); text-decoration: underline; text-underline-offset: 3px; }

/* Accept all and Reject non-essential are the same style and size on purpose */
.cc-actions { display: flex; gap: 8px; flex: none; }
.cc-btn { min-height: 44px; height: 44px; padding: 0 18px; font-size: 14px; }

/* settings dialog */
.cc-modal { width: min(560px, calc(100vw - 32px)); display: grid; gap: 12px; }
.cc-modal .t2-title { padding-right: 40px; }
.cc-rows { display: grid; margin: 4px 0; }
.cc-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 0; border-top: 1px solid var(--grid); }
.cc-row:first-child { border-top: 0; }
.cc-row > div { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.cc-dlg-actions { margin-top: 4px; }
.t2-switch { min-width: 40px; }                       /* 44px tap area comes from the row padding; keep the visual 40x24 */
.cc-row .t2-switch::before { content: ''; position: absolute; inset: -11px -4px; }   /* hit area 44px high (the 1px border makes -10px only 42) without changing the look */

@media (max-width: 760px) {
  .cc-modal .t2-modal-x { width: 44px; height: 44px; top: 8px; right: 8px; }     /* 44px tap on phones */
  .t2-consent { left: 8px; right: 8px; flex-direction: column; align-items: stretch; gap: 14px; padding: 16px; max-height: 72vh; overflow: auto; }
  .cc-body { font-size: 14px; }
  .cc-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  .cc-actions [data-cc="choose"] { grid-column: 1 / -1; }
  .cc-btn { width: 100%; padding: 0 12px; }
  .cc-dlg-actions { flex-direction: column; align-items: stretch; }
}

/* Menus (12 Oct, Builder A tap audit): the privacy link is its own 44px tap row */
.cc-body a, .cc-modal .t2-body a { display: flex; align-items: center; width: fit-content; min-height: 44px; }

/* Menus (12 Oct, SEO amber): compact banner on phones. Same copy and logic; Accept all, Reject non-essential and Choose are three equal 44px buttons in one row (Accept and Reject identical in weight),
   the privacy link flows at the end of the text as a 44px target, tighter padding and line height. */
@media (max-width: 760px) {
  .t2-consent { gap: 6px; padding: 12px 14px; }   /* selectors below start with .t2-consent so they out-rank .t2-btn whatever the stylesheet order (consent.css can print before components.css) */
  .t2-consent .cc-title { margin: 0; font-size: 14px; }
  .t2-consent .cc-body { line-height: 1.4; }
  .t2-consent .cc-body a { display: inline-flex; align-items: center; width: auto; min-height: 44px; }
  .t2-consent .cc-actions { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
  .t2-consent .cc-actions [data-cc="choose"] { grid-column: auto; }
  .t2-consent .cc-btn { height: auto; min-height: 44px; padding: 6px 4px; font-size: 14px; line-height: 1.2; white-space: normal; overflow-wrap: anywhere; }
}