/* Reconstructed DASH styling — palette from the real rent.css (#e2e2cb tan / #f3f3e9 cream),
   master.css/rentinfo.css were not captured so this re-creates the look. */
html,body{margin:0;padding:0}
BODY{font-family:Tahoma,Verdana,Arial,sans-serif;font-size:12px;background:#fff;color:#000}
BODY,TD{font-size:12px}
INPUT{padding-left:4px}
b,B{font-weight:bold}

/* ---- top title + version bars ---- */
.titleBar{background:#f4c400;border-bottom:2px solid #000;padding:3px 6px}
.titleBar b,.titleBar B{font-size:13px;letter-spacing:.3px}
.oatmeal td{color:#000}
.versionBar{background:#000;color:#fff;height:auto}
.version td{color:#fff;font-size:11px;padding:2px 6px}

/* ---- left navigation menu (BUTTON.nav = section, BUTTON.navFeat = item) ---- */
table[width="125"]{margin:0 0 0 6px}
button.nav,button.navFeat{display:block;width:138px!important;text-align:left;cursor:pointer;
  font-family:Tahoma,Arial,sans-serif;font-size:12px;padding:3px 9px;margin:1px 0;border:1px solid #b7b7a3}
button.nav{background:#e2e2cb;font-weight:bold;color:#000}            /* section header */
button.nav.opened{background:#d2d2b6}
button.navFeat{background:#f3f3e9;color:#1a1a1a;padding-left:16px}     /* feature item */
button.navFeat:hover{background:#fff7cf}
button.navFeat.selected{background:#FFD100;font-weight:bold}          /* current screen */
button.navFeat.disabled,button[disabled]{color:#a6a6a6;cursor:default}

/* ---- form panels (Customer Address Entry) ---- */
table.border,table.displaySection,table.display,table.specialDisplaySection{
  background:#e2e2cb;border:2px solid #000;padding:0;margin:6px auto}
table.display{background:#f3f3e9;border:1px solid #b7b7a3}
td.tableData{background:#fff;border:1px solid #b7b7a3;padding:1px 5px;font-weight:bold}
.displaySection td,.display td{font-size:12px}
TD.unselectedTab{background:#e2e2cb;border:none}
TD.selectedTab{background:#f3f3e9;border:none}
TR.rtEvenRow TD,TD.rtEvenRow{background:#f3f3e9;border-style:none}
TR.rtOddRow TD,TD.rtOddRow{background:#fff;border-style:none}

/* readonly entry fields — the look Customer Lens reads from */
input.readonly,input[readonly]{background:#eef0e8;border:1px solid #9a9a86;color:#1a1a1a;font-family:Tahoma,Arial,sans-serif;font-size:12px;height:18px}
input.narrow{width:24px;text-align:center}

/* ---- function-key footer (F1..F12) ---- */
form.fkeys{margin:0}
table.outFkeys{background:#000;margin-top:6px}
button.fkeys{font-family:Tahoma,Arial,sans-serif;font-size:11px;background:#dcdcdc;border:2px outset #bdbdbd;
  padding:2px 4px;min-width:78px;line-height:1.1;cursor:default;color:#111}
button.fkeys[disabled]{color:#888;background:#cfcfcf}
tr.fkeys td{padding:4px 2px}

/* =====================================================================
   Customer Lens overlay (injected demo UI — not part of original Dash)
   ===================================================================== */
#cl-demobar{position:fixed;top:0;left:0;right:0;z-index:60;background:#111;color:#fff;
  display:flex;align-items:center;gap:12px;padding:8px 14px;font-family:"Open Sans",Tahoma,Arial,sans-serif;font-size:13px;box-shadow:0 2px 6px rgba(0,0,0,.3)}
#cl-demobar .cl-tag{background:#FFD100;color:#111;font-weight:800;font-size:11px;border-radius:3px;padding:3px 8px;letter-spacing:.5px}
#cl-demobar label{font-weight:600;color:#ddd}
#cl-demobar select{font-family:inherit;font-size:14px;padding:6px 9px;border:1px solid #888;border-radius:6px;min-width:260px}
#cl-demobar .cl-hint{font-size:12px;color:#9aa0a6;margin-left:auto}
body{padding-top:46px}   /* clear the fixed demo bar */

#cl-lens{position:fixed;right:22px;bottom:22px;width:362px;max-width:calc(100vw - 28px);background:#fff;border-radius:12px;
  box-shadow:0 14px 44px rgba(0,0,0,.32);border:1px solid #e0e0e0;overflow:hidden;z-index:61;
  font-family:"Open Sans",Tahoma,Arial,sans-serif;animation:clpop .22s ease}
@keyframes clpop{from{transform:translateY(12px);opacity:0}to{transform:none;opacity:1}}
#cl-lens header{background:#111;color:#fff;display:flex;align-items:center;gap:9px;padding:11px 14px}
#cl-lens header .d{width:9px;height:9px;border-radius:50%;background:#FFD100;box-shadow:0 0 0 3px rgba(255,209,0,.25)}
#cl-lens header b{font-size:14px}
#cl-lens header .x{margin-left:auto;cursor:pointer;color:#aaa;font-size:20px;line-height:1;border:0;background:none}
#cl-lens header .x:hover{color:#fff}
#cl-lens .bd{padding:14px 16px}
#cl-lens .cu{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px}
#cl-lens .cu .nm{font-weight:800;font-size:16px;color:#1a1a1a}
#cl-lens .cu .sub{font-size:11.5px;color:#9aa0a6}
#cl-lens .bg{font-size:10.5px;font-weight:800;padding:3px 8px;border-radius:20px;white-space:nowrap}
#cl-lens .bg.gold{background:#FFD100;color:#111}
#cl-lens .bg.grey{background:#eceff1;color:#607d8b}
#cl-lens .nps{display:flex;gap:10px;margin-bottom:14px}
#cl-lens .bx{flex:1;border-radius:8px;padding:9px 8px;text-align:center;border:1px solid #e3e3e3}
#cl-lens .bx .k{font-size:9.5px;text-transform:uppercase;letter-spacing:.3px;color:#888;font-weight:700}
#cl-lens .bx .v{font-size:22px;font-weight:800;line-height:1.1;margin-top:2px}
#cl-lens .bx .t{font-size:10.5px;font-weight:700;margin-top:1px}
#cl-lens .bx.gr{background:#e7f6ec;border-color:#bfe6cb}#cl-lens .bx.gr .v,#cl-lens .bx.gr .t{color:#178a3f}
#cl-lens .bx.am{background:#fdf6e3;border-color:#eedca0}#cl-lens .bx.am .v,#cl-lens .bx.am .t{color:#b8860b}
#cl-lens .bx.rd{background:#fdecea;border-color:#f3c6c0}#cl-lens .bx.rd .v,#cl-lens .bx.rd .t{color:#c0392b}
#cl-lens .enroll{background:#fffae0;border:1px solid #f0e3a8;border-left:4px solid #FFD100;border-radius:7px;
  padding:8px 11px;margin:-2px 0 12px;font-size:12px;color:#6b5d12}
#cl-lens .sh{font-size:11px;text-transform:uppercase;letter-spacing:.4px;color:#777;font-weight:800;margin:4px 0 8px}
#cl-lens .recs{display:flex;flex-direction:column;gap:7px;margin-bottom:12px}
#cl-lens .rec{display:flex;align-items:center;gap:10px;padding:9px 11px;border-radius:8px;border:1px solid #f0e3a8;background:#fffdf0}
#cl-lens .rec .ic{width:22px;height:22px;border-radius:50%;background:#FFD100;color:#111;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:12px;flex:0 0 auto}
#cl-lens .rec .rn{font-weight:700;font-size:13px;color:#1a1a1a}
#cl-lens .rec .rm{font-size:11px;color:#9aa0a6}
#cl-lens .rec .pc{margin-left:auto;font-weight:800;font-size:13px;color:#111}
#cl-lens .chips{display:flex;flex-wrap:wrap;gap:6px}
#cl-lens .ch{font-size:11px;color:#90a4ae;background:#f5f6f7;border:1px solid #e6e8ea;border-radius:14px;padding:3px 9px}
#cl-lens .empty{font-size:12.5px;color:#9aa0a6;background:#f7f8f9;border:1px dashed #d8dcdf;border-radius:8px;padding:12px;text-align:center}
#cl-lens footer{font-size:10.5px;color:#9aa0a6;padding:9px 14px;border-top:1px solid #eee;background:#fafafa}
#cl-show{position:fixed;right:22px;bottom:22px;z-index:60;background:#111;color:#fff;border:0;border-radius:30px;
  padding:11px 18px;font-family:"Open Sans",Tahoma,Arial,sans-serif;font-weight:700;font-size:13px;cursor:pointer;
  box-shadow:0 6px 18px rgba(0,0,0,.25);display:none;align-items:center;gap:8px}
#cl-show .cl-dot{width:8px;height:8px;border-radius:50%;background:#FFD100}
