/* Client agreements: the "I have read and agree" tick box and the Read the agreement pop-up
   (partials/agreement-consent.php). Loaded on the IQA review page, the event brief and the course
   booking form, so it carries its own copy of the pop-up styles for pages without account.css. */

.agreement-consent{grid-column:1/-1;flex:1 1 100%;margin:1.25rem 0 .25rem}
.agreement-intro{margin:0 0 .5rem;font-size:var(--text-sm);color:var(--ink-soft)}
.agreement-check{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.4rem .75rem;align-items:center;padding:.75rem .9rem;border:1.5px solid var(--gold-500);border-radius:12px;background:#fffaf0}
.agreement-check .field-error{grid-column:1/-1;margin:0 0 .2rem}
.agreement-check input{width:1.4rem;height:1.4rem;margin:0;accent-color:var(--navy-900)}
.agreement-check label{font-size:var(--text-sm);font-weight:600;color:var(--ink);line-height:1.45}
.agreement-check .agreement-version{font-weight:500;color:var(--ink-soft);white-space:nowrap}
.agreement-check .agreement-read{grid-column:2;justify-self:start;min-height:40px}
.agreement-check .agreement-read .icon{width:1rem;height:1rem}
.agreement-check.has-error{border-color:var(--error);background:#fffafa}
@media (max-width:30em){.agreement-check .agreement-read{grid-column:1/-1;width:100%}}

/* The pop-up (same look as the portal pop-ups) */
.agreement-dialog{width:min(100% - 2rem,44rem);margin:auto;padding:0;border:0;border-radius:var(--radius-lg);background:transparent;color:var(--ink)}
.agreement-dialog::backdrop{background:rgba(6,18,41,.6);backdrop-filter:blur(4px)}
.agreement-card{position:relative;margin:0;background:#fff;border-radius:var(--radius-lg);padding:clamp(1.5rem,3vw,2.25rem);box-shadow:0 30px 80px rgba(6,18,41,.45)}
.agreement-card .portal-dialog-close{position:absolute;top:.75rem;right:.75rem;width:44px;height:44px;display:grid;place-items:center;border:0;border-radius:10px;background:var(--blue-50);color:var(--navy-900);cursor:pointer}
.agreement-card .portal-dialog-close:hover{background:var(--brand-100,#e6eef8)}
.agreement-card .portal-dialog-close .icon{width:1.1rem;height:1.1rem}
.agreement-card .eyebrow{margin-bottom:.35rem}
.agreement-card h2{font-size:1.5rem;margin:0 0 .75rem;padding-right:2.5rem}
.agreement-body{max-height:min(60vh,34rem);overflow:auto;padding:1rem 1.1rem;border:1px solid var(--line);border-radius:12px;background:var(--blue-50);font-size:var(--text-sm);line-height:1.6}
.agreement-body h2{font-size:1.15rem;margin:1.1rem 0 .4rem}
.agreement-body h3{font-size:1.02rem;margin:.9rem 0 .3rem}
.agreement-body h4{font-size:.95rem;margin:.8rem 0 .3rem}
.agreement-body p,.agreement-body ul,.agreement-body ol{margin:0 0 .75rem}
.agreement-body table{width:100%;border-collapse:collapse;margin:0 0 .9rem;font-size:var(--text-sm)}
.agreement-body th,.agreement-body td{padding:.35rem .5rem;border:1px solid var(--line);text-align:left;vertical-align:top}
.agreement-card .btn-row{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--line)}
@media (prefers-reduced-motion:no-preference){.agreement-dialog[open]{animation:login-pop 220ms var(--ease)}}

/* No JavaScript: the pop-up cannot open, so the wording is shown under the tick box instead. */
html.no-js .agreement-dialog{display:block;position:static;width:100%;margin:.75rem 0 0;background:none}
html.no-js .agreement-card{box-shadow:none;border:1px solid var(--line);padding:1rem}
html.no-js .agreement-card .portal-dialog-close,html.no-js .agreement-read,html.no-js .agreement-card .btn-row{display:none}

/* "You accepted the … agreement" line on an IQA review, event or booking page */
.agreement-signed{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1rem;margin:0 0 1rem;padding:.7rem .9rem;border:1px solid var(--line);border-radius:12px;background:var(--blue-50);font-size:var(--text-sm);color:var(--ink-soft)}
.agreement-signed .icon{width:1.1rem;height:1.1rem;color:var(--success,#1e7b4a);flex:none}
.agreement-signed strong{color:var(--ink);font-weight:600}
.agreement-signed a{margin-left:auto;font-weight:600;color:var(--navy-900)}
