/* Temporary accommodation move-out form.
 *
 * The look of the move-out report (fonts, colours, section rules, tables,
 * declaration boxes, signature cards), confined to .mwk-move-out-page so it
 * cannot restyle the site around it -- the page renders inside website.layout,
 * like the Fortnightly Inspection and Fire Safety Checker forms. The second
 * half styles the form controls in the same look.
 */
.mwk-move-out-page,.mwk-move-out-page *,.mwk-move-out-page *::before,.mwk-move-out-page *::after{box-sizing:border-box}
.mwk-move-out-page{font:14px/1.45 -apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:#12343B;background:#fff;padding:20px}
.mwk-move-out-page .page{max-width:820px;margin:0 auto}
.mwk-move-out-page h1{font-family:"Iowan Old Style",Georgia,serif;font-size:24px;margin:0 0 4px;color:#12343B}
.mwk-move-out-page h2{font-family:"Iowan Old Style",Georgia,serif;font-size:18px;margin:26px 0 8px;padding-bottom:4px;border-bottom:2px solid #A85F2A;color:#12343B}
.mwk-move-out-page h4{margin:0 0 6px;font-size:14px;font-weight:700;color:#12343B}
.mwk-move-out-page .meta{color:#5B6C6F;font-size:13px}
.mwk-move-out-page table{width:100%;border-collapse:collapse;margin:6px 0}
.mwk-move-out-page th,.mwk-move-out-page td{border:1px solid #D1DAD8;padding:6px 8px;text-align:left;vertical-align:middle}
.mwk-move-out-page th{background:#F2F5F4;width:38%;font-weight:600}
.mwk-move-out-page table.list th{width:auto}
.mwk-move-out-page .declare{background:#E3EEEE;border-radius:8px;padding:10px 12px;font-family:"Iowan Old Style",Georgia,serif}
.mwk-move-out-page .declare p{margin:0 0 6px}
.mwk-move-out-page .ok{color:#2E7D4F;font-weight:600}
.mwk-move-out-page .sgs{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.mwk-move-out-page .sg{border:1px solid #D1DAD8;border-radius:6px;padding:10px}
.mwk-move-out-page .small{font-size:12px;color:#5B6C6F;margin:4px 0}
.mwk-move-out-page footer{margin-top:28px;color:#5B6C6F;font-size:12px;border-top:1px solid #D1DAD8;padding-top:8px}
@media(max-width:560px){.mwk-move-out-page .sgs{grid-template-columns:1fr}.mwk-move-out-page th{width:45%}}

/* ---------- Form controls, in the report's look ---------- */
.mwk-move-out-page .req{color:#B42318}
.mwk-move-out-page td input[type=text],
.mwk-move-out-page td input[type=email],
.mwk-move-out-page td input[type=tel],
.mwk-move-out-page td input[type=date],
.mwk-move-out-page td input[type=time],
.mwk-move-out-page td input[type=number],
.mwk-move-out-page table.meters td input,
.mwk-move-out-page td select,
.mwk-move-out-page td textarea,
.mwk-move-out-page .sg input[type=text]{width:100%;padding:5px 7px;border:1px solid #D1DAD8;border-radius:4px;font:inherit;color:#12343B;background:#fff;box-shadow:none}
.mwk-move-out-page td textarea{min-height:56px;resize:vertical}
.mwk-move-out-page td input:focus,.mwk-move-out-page td select:focus,.mwk-move-out-page td textarea:focus,
.mwk-move-out-page .sg input:focus{outline:2px solid #1E6F73;outline-offset:0;border-color:#1E6F73}
.mwk-move-out-page .agree{display:inline-flex;gap:8px;align-items:center;margin:8px 0 0;font-weight:600;color:#2E7D4F;cursor:pointer}
.mwk-move-out-page .agree input{width:18px;height:18px;accent-color:#2E7D4F}

/* Meter readings: a clean table, one row per reading. */
.mwk-move-out-page table.meters td{padding:4px 5px}
.mwk-move-out-page table.meters td.rm{width:34px;text-align:center}
.mwk-move-out-page table.meters td:first-child{min-width:118px}
.mwk-move-out-page table.meters .empty td{color:#9FB2AF;text-align:center;padding:10px}
.mwk-move-out-page .mo-remove{border:0;background:none;color:#B42318;font-size:18px;line-height:1;cursor:pointer;padding:2px 6px}
.mwk-move-out-page .mo-add{display:inline-block;margin:6px 0 0;border:0;background:none;padding:0;color:#1E6F73;font-weight:600;cursor:pointer}
.mwk-move-out-page .mo-add:hover{text-decoration:underline}
@media(max-width:700px){
  .mwk-move-out-page table.meters thead{display:none}
  .mwk-move-out-page table.meters tr{display:grid;grid-template-columns:1fr 1fr;gap:4px;border:1px solid #D1DAD8;border-left:4px solid #1E6F73;border-radius:6px;padding:6px;margin:0 0 8px}
  .mwk-move-out-page table.meters td{border:0}
  .mwk-move-out-page table.meters td::before{content:attr(data-label);display:block;font-size:12px;color:#5B6C6F}
}

/* Signatures: a name box and a pad, as on the report's signature cards. */
.mwk-move-out-page .sg .sg-name{margin:0 0 6px}
.mwk-move-out-page .sg .sg-name b{font-weight:700}
.mwk-move-out-page .sig-pad{display:block;width:100%;height:110px;border:1px dashed #9FB2AF;border-radius:4px;background:#FBFCFC;touch-action:none;cursor:crosshair}
.mwk-move-out-page .sig-actions{display:flex;justify-content:space-between;align-items:center;margin-top:4px}
.mwk-move-out-page .sig-clear{border:0;background:none;color:#1E6F73;font-size:12px;font-weight:600;cursor:pointer;padding:0}

/* Submit, centred under the form. */
.mwk-move-out-page .mo-submit-wrap{text-align:center;margin:28px 0 6px}
.mwk-move-out-page .mo-submit{min-width:220px;padding:11px 26px;border:0;border-radius:6px;background:#1E6F73;color:#fff;font:inherit;font-weight:700;font-size:15px;cursor:pointer}
.mwk-move-out-page .mo-submit:hover{background:#185b5e}
.mwk-move-out-page .mo-submit[disabled]{opacity:.6;cursor:wait}
.mwk-move-out-page .mo-msg{margin:12px auto 0;max-width:640px;padding:10px 12px;border-radius:6px;font-size:14px;background:#E8F3EC;color:#2E7D4F;border:1px solid #B9DCC5;text-align:left}
.mwk-move-out-page .mo-msg.error{background:#FBEAE8;color:#B42318;border-color:#F0C2BD}
.mwk-move-out-page .mo-msg.hidden{display:none}

/* The fields a Submit found a problem with, until they are edited. */
.mwk-move-out-page .mo-invalid,
.mwk-move-out-page td input.mo-invalid,
.mwk-move-out-page td select.mo-invalid,
.mwk-move-out-page .sg input.mo-invalid{border-color:#B42318;outline:2px solid #F0C2BD;outline-offset:0}
.mwk-move-out-page canvas.sig-pad.mo-invalid{border:1px solid #B42318;background:#FFF7F6}
.mwk-move-out-page label.agree.mo-invalid{color:#B42318;outline:0}
.mwk-move-out-page .mo-msg.mo-flash{animation:mo-flash .6s ease-out}
@keyframes mo-flash{0%{box-shadow:0 0 0 4px rgba(180,35,24,.35)}100%{box-shadow:0 0 0 0 rgba(180,35,24,0)}}