/* Power BI model health checklist.
   Page head from ../insights/insights.css, band from ../power-bi-review/review.css, form fields
   from ../contact/contact.css. This file adds the tickable list, and the print layout the
   PDF is made from (Chrome's print-to-PDF of this page). */

.cl-actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s5);margin-top:var(--s6);}
.cl-progress{font:500 0.75rem/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);}

.cl-body{display:grid;gap:var(--s7);padding-bottom:var(--s9);}
.cl-group{border-top:4px solid var(--ink);padding-top:var(--s5);}
.cl-group:nth-child(2){border-top-color:var(--accent);}
.cl-group:nth-child(3){border-top-color:var(--ink-3);}
.cl-num{font:500 0.6875rem/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);}
.cl-group h2{font:700 1.75rem/1.15 var(--display);letter-spacing:-0.03em;color:var(--ink);margin:var(--s3) 0 var(--s4);}

.cl-list{display:grid;counter-reset:none;}
.cl-item{list-style:none;padding:var(--s4) 0;border-bottom:1px solid var(--line);}
.cl-item label{display:flex;gap:var(--s4);align-items:flex-start;cursor:pointer;min-height:32px;}
.cl-item input{appearance:none;flex:none;width:24px;height:24px;margin:2px 0 0;border:1.5px solid var(--line-2);
  border-radius:4px;background:var(--bg);cursor:pointer;display:grid;place-content:center;
  transition:background .16s var(--ease),border-color .16s var(--ease);}
.cl-item input::before{content:"";width:12px;height:7px;border:solid #241C00;border-width:0 0 2.5px 2.5px;
  transform:rotate(-45deg) translate(1px,-1px);opacity:0;}
.cl-item input:checked{background:var(--accent);border-color:var(--accent);}
.cl-item input:checked::before{opacity:1;}
.cl-item input:focus-visible{outline:2px solid var(--accent);outline-offset:3px;}
.cl-title{font-weight:800;font-size:1.0625rem;line-height:1.4;color:var(--ink);}
.cl-n{font:500 0.8125rem/1 var(--mono);color:var(--accent-text);margin-right:4px;}
.cl-item p{margin:6px 0 0 calc(24px + var(--s4));font-size:0.9375rem;line-height:1.6;color:var(--ink-2);max-width:68ch;}
.cl-item p a{color:var(--ink);border-bottom:1px solid currentColor;}
.cl-item p a:hover{color:var(--accent-text);}
.cl-item.is-done .cl-title{color:var(--ink-3);}

.cl-pdf{display:grid;gap:var(--s6);}
.cl-pdf .h2{margin:var(--s3) 0 var(--s4);}
.cl-form{max-width:480px;}
.form-done a{color:var(--ink);font-weight:800;border-bottom:1px solid currentColor;}

.print-only{display:none;}

@media (min-width:1000px){
  .cl-body{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--s8);}
  .cl-pdf{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;column-gap:var(--s8);}
}

/* ---------- print: the PDF ----------
   A4, light ink on paper whatever the screen theme, one group per page with ruled lines
   under each check for notes. */
@media print{
  @page{size:A4;margin:16mm 16mm 18mm;}
  :root,[data-theme="dark"]{--bg:#fff;--bg-2:#fff;--ink:#0A0917;--ink-2:#333A48;--ink-3:#5A6576;
    --line:#D5DBE5;--line-2:#9AA5B5;--accent-text:#8A6D14;}
  html,body{background:#fff !important;}
  .site-header,.site-footer,.skip-link,.no-print{display:none !important;}
  .print-only{display:block;}
  .page-head{padding:0 0 8mm;}
  .page-head .display{font-size:30pt;max-width:none;}
  .page-head .lede{font-size:11pt;}
  .print-source{font:500 8pt/1.4 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);margin-top:4mm;}
  .wrap{width:auto;}
  .cl-body{display:block;padding:0;}
  .cl-group{padding-top:4mm;}
  .cl-group + .cl-group{break-before:page;}
  .cl-group h2{font-size:18pt;}
  .cl-item{break-inside:avoid;padding:3mm 0 0;border-bottom:0;}
  .cl-item p{font-size:9.5pt;margin-left:9mm;}
  .cl-item input{width:5mm;height:5mm;}
  .cl-title{font-size:11pt;}
  /* Two ruled lines per check for notes. Borders, because Chrome drops backgrounds in print. */
  .cl-item::after{content:"";display:block;height:6mm;margin:6mm 0 0 9mm;
    border-top:0.5pt solid var(--line-2);border-bottom:0.5pt solid var(--line-2);}
  .print-foot{break-before:avoid;margin-top:8mm;padding-top:4mm;border-top:1px solid var(--line-2);
    font:500 8.5pt/1.5 var(--mono);color:var(--ink-3);}
  .reveal{opacity:1 !important;transform:none !important;}
}