/* DailyCRM — free cleaning checklist generator (/tools/cleaning-checklist-generator/). Builds on /style.css and /tools/tools.css. */
.ck-section { background: var(--sand); padding: 28px 0 88px; }

.ck-privacy { display: flex; gap: 14px; align-items: flex-start; margin-bottom: 20px; padding: 18px 20px; border-radius: 14px; background: #ecf8f2; border: 1px solid #bfe5d2; color: #14513a; }
.ck-privacy .i { width: 24px; height: 24px; color: #1f9d6b; margin-top: 2px; flex: none; }
.ck-privacy h2 { font-size: 21px; line-height: 1.3; color: #0f3d2c; }
.ck-privacy p { margin-top: 4px; font-size: 15px; line-height: 1.55; }

.ck-app { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 24px; align-items: start; }
.ck-edit { grid-column: 1; grid-row: 1; background: var(--paper); border: 1px solid var(--line); border-radius: 14px; padding: 8px 28px 28px; }
.ck-side { grid-column: 2; grid-row: 1; position: sticky; top: 92px; display: flex; flex-direction: column; gap: 12px; max-height: calc(100vh - 108px); }
.ck-toolbar { padding: 12px; border-radius: 14px; background: var(--paper); border: 1px solid var(--line); }
.ck-tabs { display: none; }
.ck-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.ck-actions .btn { height: 40px; padding: 0 14px; font-size: 14px; }
.ck-actions .btn-primary { flex: 1 1 auto; }
.ck-actions .btn[aria-busy='true'] { opacity: 0.7; cursor: progress; }
.ck-status-row { display: flex; align-items: baseline; gap: 12px; }
.ck-status { font-size: 14px; color: #177a53; margin-top: 8px; }
.ck-status:empty { display: none; }
.ck-status.is-error { color: #c2410c; }
.ck-link { padding: 4px 0; font-size: 14px; font-weight: 600; color: var(--accent-ink); text-decoration: underline; text-underline-offset: 3px; }
.ck-link[hidden] { display: none; }

.ck-preview { display: flex; flex-direction: column; min-height: 0; }
.ck-preview-head { display: flex; justify-content: space-between; padding: 0 4px 8px; font-size: 13px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); }
.ck-preview-meta { font-weight: 500; letter-spacing: 0; text-transform: none; }
.ck-paper-wrap { container-type: inline-size; overflow: auto; min-height: 0; border-radius: 6px; }
.ck-fine { margin-top: 8px; font-size: 13px; color: var(--muted); }

/* Editor */
.ck-edit .field textarea { width: 100%; min-height: 70px; padding: 10px 12px; border: 1px solid var(--line-2); border-radius: 8px; background: var(--paper); font: inherit; font-size: 16px; line-height: 1.45; color: var(--ink); resize: vertical; transition: border-color 0.15s, box-shadow 0.15s; }
.ck-edit .field textarea:hover { border-color: var(--muted); }
.ck-edit .field textarea:focus, .ck-edit .input input:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px rgba(62, 99, 221, 0.18); }
.field-check small { display: block; margin-top: 2px; font-size: 13px; color: var(--muted); }
.ck-checks { display: grid; gap: 10px; }

.ck-types { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.ck-types label { position: relative; }
.ck-types input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.ck-types span { display: flex; align-items: center; justify-content: center; min-height: 46px; padding: 6px 10px; border: 1px solid var(--line-2); border-radius: 10px; background: var(--paper); font-size: 14px; font-weight: 600; line-height: 1.25; text-align: center; color: var(--ink-2); cursor: pointer; transition: border-color 0.15s, background-color 0.15s, color 0.15s; }
.ck-types label:hover span { border-color: var(--accent); }
.ck-types input:checked + span { border-color: var(--accent); background: var(--accent-soft); color: var(--accent-ink); box-shadow: inset 0 0 0 1px var(--accent); }
.ck-types input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 2px; }

.ck-zones { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.ck-zone { border: 1px solid var(--line); border-radius: 12px; background: #fcfcfa; padding: 10px 12px; }
.ck-zone.is-off { background: var(--sand); }
.ck-zone.is-off .ck-zone-name input { color: var(--muted); text-decoration: line-through; text-decoration-color: var(--line-2); }
.ck-zone-head { display: flex; align-items: center; gap: 8px; }
.ck-on { display: flex; align-items: center; justify-content: center; width: 30px; height: 40px; flex: none; cursor: pointer; }
.ck-on input { width: 20px; height: 20px; margin: 0; accent-color: var(--accent); cursor: pointer; }
.ck-zone-name { flex: 1 1 auto; min-width: 0; }
.ck-zone .input input { height: 40px; font-size: 15px; }
.ck-zone-name input { font-weight: 600; }
.ck-zone-count { flex: 0 0 64px; }
.ck-zone-count input { padding-right: 6px; }
.ck-tools { display: flex; gap: 4px; flex: none; }
.ck-icon-btn { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 8px; border: 1px solid var(--line-2); background: var(--paper); color: var(--ink-2); }
.ck-icon-btn:hover:not(:disabled) { border-color: var(--ink); color: var(--ink); }
.ck-icon-btn:disabled { opacity: 0.35; cursor: default; }
.ck-icon-btn--del:hover:not(:disabled) { border-color: #c2410c; color: #c2410c; }
.ck-zone-toggle { display: inline-flex; align-items: center; gap: 6px; margin: 6px 0 0 30px; padding: 4px 0; font-size: 13px; font-weight: 600; color: var(--accent-ink); }
.ck-zone-toggle .i { transition: transform 0.15s; }
.ck-zone-toggle[aria-expanded='true'] .i { transform: rotate(180deg); }
.ck-zone-body { margin-top: 8px; }
.ck-zone-body[hidden] { display: none; }
.ck-tasks { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.ck-task { display: flex; align-items: center; gap: 6px; }
.ck-task .input { flex: 1 1 auto; min-width: 0; }
.ck-zone .ck-task .input input { height: 38px; font-size: 15px; }
.ck-addon { display: inline-flex; align-items: center; gap: 5px; flex: none; height: 34px; padding: 0 8px; border: 1px solid var(--line-2); border-radius: 8px; background: var(--paper); font-size: 12px; font-weight: 600; color: var(--muted); cursor: pointer; }
.ck-addon input { width: 15px; height: 15px; margin: 0; accent-color: var(--accent); }
.ck-addon:has(input:checked) { border-color: var(--accent); color: var(--accent-ink); background: var(--accent-soft); }
.ck-add-task, .ck-add-zone { display: flex; gap: 8px; margin-top: 10px; }
.ck-add-task .input, .ck-add-zone .input { flex: 1 1 auto; min-width: 0; }
.ck-add-task .btn, .ck-add-zone .btn { height: 40px; padding: 0 14px; font-size: 14px; flex: none; }
.ck-add-zone { margin-top: 14px; }
.ck-add-zone .input input { height: 40px; }
.ck-count { margin-top: 10px; font-size: 14px; color: var(--muted); }

.ck-logo { display: flex; gap: 16px; align-items: flex-start; margin-bottom: 18px; padding: 14px; border: 1px dashed var(--line-2); border-radius: 12px; transition: border-color 0.15s, background-color 0.15s; }
.ck-logo.is-drag { border-color: var(--accent); background: var(--accent-soft); }
.ck-logo-box { flex: none; display: flex; align-items: center; justify-content: center; width: 104px; height: 72px; border-radius: 8px; background: var(--sand); overflow: hidden; }
.ck-logo-box img { max-width: 100%; max-height: 100%; object-fit: contain; }
.ck-logo-box img[hidden], .ck-logo-box .is-hidden { display: none; }
.ck-logo-box .i { width: 28px; height: 28px; color: var(--muted); }
.ck-logo-body { display: grid; gap: 4px; min-width: 0; }
.ck-logo-body .field-label { font-size: 14px; font-weight: 600; color: var(--ink); }
.ck-logo-body small { font-size: 13px; color: var(--muted); }
.ck-logo-btns { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }
.ck-logo-btns .btn { height: 38px; padding: 0 14px; font-size: 14px; }
.ck-logo-btns .btn[hidden] { display: none; }
.ck-file { position: relative; cursor: pointer; }
.ck-file input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.ck-file:focus-within { outline: 2px solid var(--accent); outline-offset: 2px; }
.ck-err { font-size: 13px; color: #c2410c; }
.ck-err:empty { display: none; }

.ck-save { display: grid; gap: 14px; justify-items: start; }
.ck-save-btns { display: flex; flex-wrap: wrap; gap: 8px; }
.ck-save .btn { height: 40px; font-size: 14px; }
.ck-mini { display: none; }

/* Checklist sheet — sized in em, where 1em equals 10pt on the printed page */
.ck-sheet { position: relative; background: #fff; color: #12141c; font-family: Helvetica, Arial, 'Liberation Sans', 'Nimbus Sans', sans-serif; font-size: 10.5px; font-size: calc(100cqw * 10 / 612); line-height: 1.3; padding: 4em; min-height: calc(100cqw * 792 / 612); border: 1px solid var(--line); border-radius: 6px; box-shadow: var(--shadow-md); overflow-wrap: anywhere; }
.ck-sheet.ck-paper--a4 { font-size: calc(100cqw * 10 / 595.28); min-height: calc(100cqw * 841.89 / 595.28); }
.ck-sheet dl, .ck-sheet dd, .ck-sheet ul, .ck-sheet h3 { margin: 0; padding: 0; }
.ck-sheet ul { list-style: none; }
.ck-pre { white-space: pre-line; }
.ck-ph { color: #9aa0b1; font-size: 1em; padding: 2em 0; text-align: center; }
.ck-h { display: flex; justify-content: space-between; align-items: flex-start; gap: 1.6em; }
.ck-from { width: 42%; min-width: 0; }
.ck-logo-img { display: block; max-width: 13em; max-height: 4.6em; object-fit: contain; object-position: left top; margin-bottom: 0.8em; }
.ck-company { font-size: 1.15em; font-weight: 700; line-height: 1.3; }
.ck-titles { flex: 1; min-width: 0; text-align: right; }
.ck-title { font-size: 1.7em; font-weight: 700; line-height: 1.24; letter-spacing: 0.02em; text-transform: uppercase; color: #3e63dd; }
.ck-sub { margin-top: 0.2em; font-size: 0.85em; color: #6b7080; }
.ck-info { display: grid; grid-template-columns: 1fr 1fr; gap: 0.6em 1.6em; margin-top: 1.4em; }
.ck-info div { display: flex; align-items: flex-end; gap: 1em; min-width: 0; }
.ck-info dt { flex: none; font-size: 0.75em; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: #6b7080; padding-bottom: 0.3em; }
.ck-info dd { flex: 1; min-width: 0; font-size: 0.95em; padding: 0 0 0.15em 0.4em; border-bottom: 0.05em solid #c9cbd2; }
.ck-notes { margin-top: 1.2em; padding: 0.7em 1em 0.9em; background: #f4f6fd; }
.ck-notes .ck-label { font-size: 0.75em; font-weight: 700; letter-spacing: 0.08em; color: #3e63dd; text-transform: uppercase; margin-bottom: 0.3em; }
.ck-notes .ck-pre { font-size: 0.9em; color: #3b3f4c; }
.ck-list { margin-top: 1.8em; }
.ck-list.is-2 { column-count: 2; column-gap: 2.2em; }
.ck-sec { margin-bottom: 1.2em; }
.ck-zone-title { display: flex; justify-content: space-between; align-items: baseline; gap: 1em; padding-bottom: 0.25em; border-bottom: 0.1em solid #3e63dd; font-size: 1.1em; font-weight: 700; line-height: 1.4; break-after: avoid; }
.ck-zone-title small { font-size: 0.68em; font-weight: 400; color: #6b7080; white-space: nowrap; }
.ck-colhead { display: flex; gap: 0.8em; padding: 0.4em 0 0.1em; font-size: 0.65em; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: #6b7080; break-after: avoid; }
.ck-c-task { flex: 1; }
.ck-items { padding-top: 0.3em !important; }
.ck-item { display: flex; align-items: flex-start; gap: 0.8em; padding: 0.3em 0; font-size: 0.95em; line-height: 1.32; break-inside: avoid; }
.ck--initials .ck-item { border-bottom: 0.035em solid #e4e4e0; }
.ck-boxes { display: flex; gap: 0.32em; flex: none; padding-top: 0.15em; }
.ck-box { display: block; width: 0.84em; height: 0.84em; border: 0.085em solid #4b5060; }
.ck-dot { display: block; width: 0.32em; height: 0.32em; margin: 0.42em 0.25em 0 0.1em; background: #4b5060; }
.ck-dash { display: block; width: 2.3em; height: 1.1em; border-bottom: 0.065em solid #4b5060; }
.ck-text { flex: 1; min-width: 0; }
.ck-tag { flex: none; margin-top: 0.1em; padding: 0.05em 0.45em; border: 0.065em solid #3e63dd; font-size: 0.62em; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: #3e63dd; }
.ck-init { flex: none; width: 5.2em; height: 1.1em; border-bottom: 0.065em solid #4b5060; }
.ck-colhead .ck-c-init { width: 7.4em; text-align: right; }
.ck-sign { display: grid; grid-template-columns: 1fr 1fr; gap: 3.2em; margin-top: 2.6em; break-inside: avoid; }
.ck-sign-line { display: block; height: 2.2em; border-bottom: 0.07em solid #4b5060; }
.ck-sign-labels { display: flex; justify-content: space-between; margin-top: 0.3em; font-size: 0.8em; color: #6b7080; }

/* Ready-made checklists in the article */
.prose .ck-ref { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 32px; margin: 8px 0 12px; }
.prose .ck-ref h4 { margin: 14px 0 4px; font-size: 17px; line-height: 1.35; color: var(--ink); }
.prose .ck-ref ul { margin-bottom: 4px; font-size: 16px; }
.prose .ck-ref li { margin: 3px 0; }
.prose .ck-ref em { color: var(--muted); font-style: normal; font-size: 14px; }
.ck-ref-load { margin: 8px 0 32px !important; }
.ck-ref-load .btn { height: 40px; font-size: 14px; }

@media (max-width: 1024px) {
  .ck-app { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .ck-side { grid-column: 1; grid-row: 1; position: static; max-height: none; }
  .ck-edit { grid-column: 1; grid-row: 2; }
  .ck-tabs { display: flex; gap: 4px; padding: 4px; margin-bottom: 12px; border-radius: 10px; background: var(--sand-2); border: 1px solid var(--line); }
  .ck-tabs [role='tab'] { flex: 1; min-height: 42px; border-radius: 7px; font-size: 15px; font-weight: 600; color: var(--muted); }
  .ck-tabs [role='tab'][aria-selected='true'] { background: var(--paper); color: var(--ink); box-shadow: 0 1px 2px rgba(18, 20, 28, 0.08); }
  .ck-app:not(.is-preview) .ck-preview { display: none; }
  .ck-app.is-preview .ck-edit { display: none; }
  .ck-paper-wrap { overflow: visible; }
  .ck-mini:not([hidden]) { position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 40; display: flex; align-items: center; gap: 10px; padding: 10px 10px 10px 16px; border-radius: 12px; background: var(--night); color: #d9dbe6; font-size: 14px; box-shadow: var(--shadow-lg); }
  .ck-mini b { font-family: var(--display); font-weight: 400; font-size: 20px; color: #fff; margin-right: auto; white-space: nowrap; }
  .ck-mini .btn { height: 38px; padding: 0 14px; font-size: 14px; }
  .btn-sun { background: var(--sun); color: var(--night); }
}
@media (max-width: 640px) {
  .ck-privacy { padding: 14px 16px; }
  .ck-privacy h2 { font-size: 18px; }
  .ck-edit { padding: 4px 14px 20px; }
  .ck-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .ck-actions .btn-primary { grid-column: 1 / -1; height: 46px; font-size: 15px; }
  .ck-actions .btn { padding: 0 8px; font-size: 13px; }
  .ck-types { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ck-zone { padding: 8px; }
  .ck-zone-head { flex-wrap: wrap; }
  .ck-zone-name { flex-basis: calc(100% - 38px); }
  .ck-zone-count { margin-left: 38px; }
  .ck-tools { margin-left: auto; }
  .ck-task { flex-wrap: wrap; }
  .ck-task .input { flex-basis: 100%; }
  .ck-task .ck-tools { margin-left: auto; }
  .ck-zone-toggle { margin-left: 0; }
  .ck-logo { flex-direction: column; }
  .prose .ck-ref { grid-template-columns: minmax(0, 1fr); }
}

/* Print: only the checklist. The named page lives on <html> — on the sheet it makes Chrome add a blank first page. */
@page ck-letter { size: letter; margin: 0.55in; }
@page ck-a4 { size: A4; margin: 0.55in; }
@media print {
  body > :not(main), main > :not(.ck-section), .ck-privacy, .ck-edit, .ck-toolbar, .ck-preview-head, .ck-fine, .ck-mini, .sr-only { display: none !important; }
  html { page: ck-letter; }
  html.ck-print-a4 { page: ck-a4; }
  html, body, main, .ck-section { background: #fff !important; margin: 0 !important; padding: 0 !important; }
  .ck-section .wrap { max-width: none; padding: 0; }
  .ck-app { display: block; }
  .ck-side { position: static; max-height: none; display: block; }
  .ck-preview { display: block !important; }
  .ck-paper-wrap { overflow: visible; container-type: normal; border-radius: 0; }
  .ck-sheet, .ck-sheet.ck-paper--a4 { font-size: 10pt; padding: 0; min-height: 0; border: 0; border-radius: 0; box-shadow: none; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}