/* consent.css - the consent dialog (S134-FC9), UNLAYERED copy. */
/* (232-D) generated by build_ui2.py from resources/css/macrition/shells/public.css -
   do not edit; the layered copy lives in macrition-ui.css. This copy exists for the
   standalone surfaces whose raw legacy sheets would otherwise out-rank the layered
   component styles (the AI assistant page). Deterministic build; single source. */
/* ---- the consent chooser (S134-FC9, §3 the dialog of record)
     (S257-D4, disclosed) every token var in this block carries its
     light-theme literal fallback so the STANDALONE raw-shell surfaces
     (the auth wizards, the error pages, checkout — no ui bundle, no
     token layer) render the gate styled: the finding-1 unstyled-consent
     class is dead there. Bundle surfaces resolve the real token (the
     default is ignored — theming untouched); the standalone dark/sepia
     refinement is the disclosed follow-up. ------------
     The granular cookie chooser: a real task dialog on the --mc-z ladder.
     (S257-D1b, the 257-D lock claim 6124869161) The gate rides the MODAL
     token (1000), not the overlay token: the served anatomy merges the
     scrim + the dialog card into ONE node, so the element IS the dialog
     layer of the ladder — "dialogs, drawers" per the token scale's own
     semantics. The live inversion this fixes: the AI panel (z 901,
     ai-assistant.css) painted ABOVE the consent gate (z 900) — a policy
     re-ask fired while the panel was open would lose the ladder to a
     popover (the Audit-24 "consent-vs-AI ownership in acceptance" clause;
     the consent-overlay-vs-panel z law pinned by s257-floating-dock V4).
     Toasts (1100) and coach marks (1200) legitimately stay above; the
     nav/FAB (900) and every popover (901) fall below the gate. Composes
     with the announcement bar and the toast layer; never fights them.
     Scoped under body.pub like the cmdk modal; the DOM is authored by
     app.js (the served-dialog contract). */
  .consent-overlay {
    position: fixed;
    inset: 0;
    z-index: var(--mc-z-modal, 1000);
    display: none;
    align-items: flex-start;
    justify-content: center;
    padding: 8vh var(--mc-space-4, 1rem) calc(var(--mc-space-6, 1.5rem) + 72px);
    background: rgb(15 23 42 / .5);
    backdrop-filter: blur(2px);
  }
  .consent-overlay.open { display: flex; }

  .consent-modal {
    width: min(560px, 100%);
    max-height: 82vh;
    overflow-y: auto;
    background: var(--mc-surface-raised, #FFFFFF);
    border: 1px solid var(--mc-border-strong, #64748B);
    border-radius: var(--mc-radius-lg, 16px);
    box-shadow: var(--mc-shadow-3, 0 12px 32px rgba(15, 23, 42, 0.14), 0 2px 6px rgba(15, 23, 42, 0.06));
    padding: var(--mc-space-5, 1.25rem);
    display: flex;
    flex-direction: column;
    gap: var(--mc-space-4, 1rem);
  }
  .consent-title {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--mc-text, #0F172A);
  }
  .consent-lede {
    margin: 0;
    font-size: .875rem;
    line-height: 1.5;
    color: var(--mc-text-secondary, #475569);
  }
  .consent-rows {
    display: flex;
    flex-direction: column;
    gap: var(--mc-space-2, 0.5rem);
    margin: 0;
    padding: 0;
    border: none;
  }
  .consent-row {
    display: flex;
    align-items: flex-start;
    gap: var(--mc-space-3, 0.75rem);
    padding: var(--mc-space-3, 0.75rem) var(--mc-space-4, 1rem);
    border: 1px solid var(--mc-border, #E2E8F0);
    border-radius: var(--mc-radius-md, 12px);
    background: var(--mc-surface, #FFFFFF);
  }
  .consent-row--locked { opacity: .75; }
  .consent-row input[type="checkbox"] {
    margin: 2px 0 0;
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    accent-color: var(--mc-primary, #6366F1);
  }
  .consent-copy { min-width: 0; }
  .consent-copy-title {
    display: block;
    font-size: .875rem;
    font-weight: 600;
    color: var(--mc-text, #0F172A);
  }
  .consent-copy-desc {
    display: block;
    margin-top: 2px;
    font-size: .78125rem;
    line-height: 1.45;
    color: var(--mc-text-secondary, #475569);
  }
  .consent-state-badge {
    display: inline-block;
    margin-left: var(--mc-space-2, 0.5rem);
    font-size: .6875rem;
    font-weight: 700;
    letter-spacing: .02em;
    text-transform: uppercase;
    color: var(--mc-text-muted, #64748B);
  }
  .consent-notice {
    margin: 0;
    padding: var(--mc-space-3, 0.75rem) var(--mc-space-4, 1rem);
    border: 1px solid var(--mc-border-strong, #64748B);
    border-left: 3px solid var(--mc-primary, #6366F1);
    border-radius: var(--mc-radius-md, 12px);
    background: var(--mc-surface-sunken, #F1F5F9);
    font-size: .8125rem;
    line-height: 1.5;
    color: var(--mc-text, #0F172A);
  }
  .consent-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--mc-space-3, 0.75rem);
    justify-content: flex-end;
  }
  .consent-actions .consent-btn {
    border: 1px solid var(--mc-border-strong, #64748B);
    border-radius: var(--mc-radius-md, 12px);
    background: var(--mc-surface-raised, #FFFFFF);
    color: var(--mc-text, #0F172A);
    font: inherit;
    font-size: .875rem;
    font-weight: 600;
    padding: var(--mc-space-2, 0.5rem) var(--mc-space-4, 1rem);
    cursor: pointer;
  }
  .consent-actions .consent-btn:hover { background: var(--mc-surface-sunken, #F1F5F9); }
  .consent-actions .consent-btn:focus-visible {
    outline: 2px solid var(--mc-primary, #6366F1);
    outline-offset: 2px;
  }
  .consent-actions .consent-btn--primary {
    background: var(--mc-primary, #6366F1);
    border-color: var(--mc-primary, #6366F1);
    color: #fff;
  }
  .consent-actions .consent-btn--primary:hover { filter: brightness(.95); background: var(--mc-primary, #6366F1); }
  .consent-actions .consent-btn[disabled] { opacity: .55; cursor: wait; }
  .consent-policy-link {
    font-size: .78125rem;
    color: var(--mc-text-secondary, #475569);
    text-decoration: underline;
    text-underline-offset: 2px;
    /* (S258-D1) the link measured 18.8px tall — vertical padding lifts the
       pointer target over the WCAG 2.5.8 24px gate (the consent dialog is
       a legal-action surface; its one link must be a real target). */
    padding: 4px 0;
    display: inline-block;
  }
  .consent-policy-link:focus-visible {
    outline: 2px solid var(--mc-primary, #6366F1);
    outline-offset: 2px;
  }
  @media (max-width: 640px) {
    .consent-overlay { padding: var(--mc-space-3, 0.75rem) var(--mc-space-3, 0.75rem) calc(var(--mc-space-6, 1.5rem) + 72px); }
    .consent-modal { max-height: 78vh; padding: var(--mc-space-4, 1rem); }
    .consent-actions { justify-content: stretch; }
    .consent-actions .consent-btn { flex: 1 1 auto; }
  }

/* (235-D Lock B) the consent-vs-AI suspension: STRUCTURAL, not cosmetic.
   app.js owns the suspended state (inert + aria-hidden through the kernel
   journey); this rule only reflects the structure - a suspended surface
   leaves paint + tab order + the accessibility tree together. */
.ai-fab[inert],
.ai-chat-panel[inert] {
  visibility: hidden;
}
