/* ============================================================
   Open Door Resident Forms — portal styles
   Everything is namespaced (#odrf-app / .odrf-*) and structural
   properties carry !important, because this renders inside an
   unknown WordPress theme that may style generic elements like
   <header>, <button>, <aside> and <h1>-<h3> aggressively.
   The signature modal is moved to <body> by the JS, so its rules
   are keyed off its own ID rather than an #odrf-app ancestor.
   ============================================================ */

#odrf-app {
  --odrf-navy:#004188;
  --odrf-navy-dark:#002d5e;
  --odrf-gold:#c9a14a;
  --odrf-gold-light:#e8d9b0;
  --odrf-paper:#f5f7fa;
  --odrf-line:#d7dde5;
  --odrf-ink:#1c2530;
  --odrf-muted:#697585;
  --odrf-danger:#b3452c;
  --odrf-ok:#1f7a4d;

  display:block !important;
  box-sizing:border-box !important;
  font-family:"Segoe UI",Helvetica,Arial,sans-serif !important;
  background:var(--odrf-paper) !important;
  color:var(--odrf-ink) !important;
  line-height:1.5 !important;
  text-align:left !important;
  margin:0 !important;
  overflow:visible !important;
}
#odrf-app *, #odrf-app *::before, #odrf-app *::after { box-sizing:border-box !important; }

/* ---------- Header bar ---------- */
#odrf-app .odrf-bar{
  background:linear-gradient(120deg,var(--odrf-navy) 0%,var(--odrf-navy-dark) 100%) !important;
  color:#fff !important;
  padding:16px 24px !important;
  margin:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  flex-wrap:wrap !important;
  gap:12px !important;
  border-bottom:3px solid var(--odrf-gold) !important;
  /* Safeguard: the dashboard's progress bar was once also called .odrf-bar and
     its height:9px squashed this header until the title was sliced off. The
     class was renamed to .odrf-meter, and these keep the header safe from any
     future height rule leaking in from a theme. */
  min-height:64px !important;
  height:auto !important;
  overflow:visible !important;
  position:relative !important;
  z-index:1 !important;
}
#odrf-app .odrf-brand-title,
#odrf-app .odrf-brand-sub{ overflow:visible !important; white-space:normal !important; }
#odrf-app .odrf-brand{ display:flex !important; flex-direction:column !important; gap:2px !important; cursor:pointer !important; }
#odrf-app .odrf-brand-title{ font-size:1.1rem !important; font-weight:700 !important; color:#fff !important; margin:0 !important; }
#odrf-app .odrf-brand-sub{ font-size:.78rem !important; color:var(--odrf-gold-light) !important; margin:0 !important; }
#odrf-app .odrf-toolbar{ display:flex !important; gap:10px !important; align-items:center !important; flex-wrap:wrap !important; }

/* ---------- Buttons ---------- */
#odrf-app .odrf-btn,
#odrf-sigModal .odrf-btn{
  display:inline-block !important;
  width:auto !important;
  appearance:none !important;
  -webkit-appearance:none !important;
  border:1px solid transparent !important;
  border-radius:6px !important;
  padding:9px 16px !important;
  margin:0 !important;
  font-family:inherit !important;
  font-size:.85rem !important;
  font-weight:600 !important;
  line-height:1.2 !important;
  text-transform:none !important;
  letter-spacing:normal !important;
  text-decoration:none !important;
  cursor:pointer !important;
  box-shadow:none !important;
  text-shadow:none !important;
}
#odrf-app .odrf-btn-gold,   #odrf-sigModal .odrf-btn-gold{ background:var(--odrf-gold) !important; color:#2b2205 !important; }
#odrf-app .odrf-btn-navy,   #odrf-sigModal .odrf-btn-navy{ background:#004188 !important; color:#fff !important; }
#odrf-app .odrf-btn-ghost,  #odrf-sigModal .odrf-btn-ghost{ background:#fff !important; color:#004188 !important; border-color:#d7dde5 !important; }
#odrf-app .odrf-btn-outline{ background:transparent !important; color:#fff !important; border-color:rgba(255,255,255,.6) !important; }
#odrf-app .odrf-btn-outline:hover{ background:rgba(255,255,255,.14) !important; }
#odrf-app .odrf-btn:disabled,
#odrf-sigModal .odrf-btn:disabled{ opacity:.45 !important; cursor:not-allowed !important; }

/* ---------- Menu / landing ---------- */
#odrf-app .odrf-menu{ max-width:920px !important; margin:0 auto !important; padding:34px 22px 60px !important; }
#odrf-app .odrf-menu-title{ font-size:1.45rem !important; margin:0 0 6px !important; color:var(--odrf-navy) !important; font-weight:700 !important; }
#odrf-app .odrf-lede{ color:var(--odrf-muted) !important; margin:0 0 28px !important; font-size:.94rem !important; }
#odrf-app .odrf-category{ margin:0 0 28px !important; }
#odrf-app .odrf-category-title{
  font-size:.74rem !important; text-transform:uppercase !important; letter-spacing:.08em !important;
  color:var(--odrf-muted) !important; border-bottom:1px solid var(--odrf-line) !important;
  padding:0 0 8px !important; margin:0 0 12px !important; font-weight:700 !important;
}
#odrf-app .odrf-grid{ display:grid !important; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)) !important; gap:12px !important; }
#odrf-app .odrf-card{
  background:#fff !important; border:1px solid var(--odrf-line) !important; border-radius:10px !important;
  padding:15px 17px !important; cursor:pointer !important; text-decoration:none !important;
  display:block !important; color:inherit !important;
}
#odrf-app .odrf-card:hover{ border-color:var(--odrf-navy) !important; box-shadow:0 6px 18px rgba(15,35,60,.1) !important; }
#odrf-app .odrf-card-eyebrow{ font-size:.66rem !important; color:var(--odrf-gold) !important; font-weight:700 !important; letter-spacing:.05em !important; margin:0 !important; }
#odrf-app .odrf-card-name{ font-size:.92rem !important; font-weight:600 !important; margin:3px 0 0 !important; color:var(--odrf-ink) !important; }

/* ---------- Form view layout ---------- */
#odrf-app .odrf-layout{ display:flex !important; align-items:flex-start !important; gap:0 !important; }
#odrf-app .odrf-side{
  width:250px !important; flex:0 0 250px !important; background:#fff !important;
  border-right:1px solid var(--odrf-line) !important; padding:20px 18px !important; align-self:stretch !important;
}
#odrf-app .odrf-side-h{
  font-size:.7rem !important; text-transform:uppercase !important; letter-spacing:.08em !important;
  color:var(--odrf-muted) !important; margin:0 0 10px !important; font-weight:700 !important;
}
#odrf-app .odrf-back{
  display:inline-block !important; font-size:.82rem !important; color:var(--odrf-navy) !important;
  text-decoration:none !important; font-weight:600 !important; margin:0 0 16px !important; cursor:pointer !important;
}
#odrf-app .odrf-step{ display:flex !important; gap:10px !important; margin:0 0 14px !important; align-items:flex-start !important; }
#odrf-app .odrf-num{
  width:22px !important; height:22px !important; min-width:22px !important; border-radius:50% !important;
  background:var(--odrf-navy) !important; color:#fff !important; font-size:.7rem !important; font-weight:700 !important;
  display:flex !important; align-items:center !important; justify-content:center !important; flex:0 0 22px !important;
}
#odrf-app .odrf-step p{ margin:0 !important; font-size:.8rem !important; color:var(--odrf-ink) !important; line-height:1.4 !important; }
#odrf-app .odrf-status{
  margin:18px 0 0 !important; padding:12px !important; border-radius:8px !important;
  background:var(--odrf-paper) !important; border:1px solid var(--odrf-line) !important;
  font-size:.77rem !important; color:var(--odrf-muted) !important; line-height:1.5 !important;
}
#odrf-app .odrf-status.odrf-err{ background:#fbeae5 !important; border-color:#eab6a5 !important; color:var(--odrf-danger) !important; }
#odrf-app .odrf-main{ flex:1 1 auto !important; padding:26px !important; display:flex !important; flex-direction:column !important; align-items:center !important; gap:20px !important; min-width:0 !important; }

/* ---------- PDF page + field overlays ---------- */
#odrf-app .odrf-page{ position:relative !important; box-shadow:0 3px 14px rgba(15,35,60,.14) !important; background:#fff !important; max-width:100% !important; }
/* The canvas is rendered at 2x for sharpness, so its intrinsic width is double
   the display width. If a theme overrides the inline sizing, the browser falls
   back to that intrinsic width and the page appears zoomed in. Pinning it to
   the wrapper makes the display size independent of the pixel buffer. */
#odrf-app .odrf-page canvas{
  display:block !important;
  width:100% !important;
  height:100% !important;
  max-width:100% !important;
}
#odrf-app .odrf-page{ overflow:hidden !important; }
#odrf-app input.odrf-f{
  position:absolute !important; margin:0 !important; border:1.5px solid rgba(0,65,136,.55) !important;
  background:rgba(0,65,136,.07) !important; border-radius:3px !important; font-family:inherit !important;
  font-size:12px !important; padding:2px 5px !important; color:var(--odrf-ink) !important;
  box-shadow:none !important; min-height:0 !important; line-height:1.2 !important;
}
#odrf-app input.odrf-f:focus{ outline:2px solid #0a6cff !important; outline-offset:1px !important; background:#fff !important; }
#odrf-app .odrf-cbhit{
  position:absolute !important; margin:0 !important; padding:0 !important;
  background:transparent !important; border:none !important; cursor:pointer !important;
  z-index:2 !important;
}
#odrf-app input.odrf-cb{
  position:absolute !important; margin:0 !important; padding:0 !important;
  -webkit-appearance:checkbox !important; appearance:checkbox !important; accent-color:var(--odrf-navy) !important;
  background:#fff !important; cursor:pointer !important;
}
#odrf-app .odrf-sig{
  position:absolute !important; margin:0 !important; border:2px dashed var(--odrf-gold) !important;
  background:rgba(201,161,74,.15) !important; border-radius:4px !important;
  display:flex !important; align-items:center !important; justify-content:center !important;
  cursor:pointer !important; font-size:11px !important; font-weight:700 !important;
  color:#8a6c1f !important; text-align:center !important; padding:2px !important; line-height:1.15 !important;
}
#odrf-app .odrf-sig:hover{ background:rgba(201,161,74,.3) !important; }
#odrf-app .odrf-sig.odrf-signed{ border-style:solid !important; background:#fff !important; padding:0 !important; }
#odrf-app .odrf-sig.odrf-signed img{ width:100% !important; height:100% !important; object-fit:contain !important; display:block !important; }
#odrf-app .odrf-clear{
  position:absolute !important; top:-9px !important; right:-9px !important; width:18px !important; height:18px !important;
  border-radius:50% !important; background:var(--odrf-danger) !important; color:#fff !important;
  font-size:11px !important; line-height:18px !important; text-align:center !important; font-weight:700 !important;
  display:none !important; cursor:pointer !important;
}
#odrf-app .odrf-sig.odrf-signed:hover .odrf-clear{ display:block !important; }

/* ---------- Success panel ---------- */
#odrf-app .odrf-success{
  max-width:440px !important; margin:70px auto !important; text-align:center !important; background:#fff !important;
  border:1px solid var(--odrf-line) !important; border-radius:12px !important; padding:38px 30px !important;
}
#odrf-app .odrf-tick{
  width:54px !important; height:54px !important; border-radius:50% !important; background:var(--odrf-ok) !important;
  color:#fff !important; display:flex !important; align-items:center !important; justify-content:center !important;
  font-size:1.5rem !important; margin:0 auto 16px !important;
}

/* ============================================================
   Signature modal — lives directly under <body>
   ============================================================ */
#odrf-sigModal{
  display:none !important;
  position:fixed !important; top:0 !important; left:0 !important; right:0 !important; bottom:0 !important;
  width:100% !important; height:100% !important;
  background:rgba(10,20,35,.6) !important;
  z-index:2147483000 !important;
  align-items:center !important; justify-content:center !important;
  padding:20px !important; margin:0 !important;
  font-family:"Segoe UI",Helvetica,Arial,sans-serif !important;
  box-sizing:border-box !important;
}
#odrf-sigModal.odrf-open{ display:flex !important; }
#odrf-sigModal *, #odrf-sigModal *::before, #odrf-sigModal *::after{ box-sizing:border-box !important; }
#odrf-sigModal .odrf-modal{
  background:#fff !important; border-radius:12px !important; width:100% !important; max-width:520px !important;
  box-shadow:0 20px 60px rgba(0,0,0,.4) !important; overflow:hidden !important; margin:0 !important;
  max-height:90vh !important; overflow-y:auto !important;
}
#odrf-sigModal .odrf-modal-head{
  background:#004188 !important; color:#fff !important; padding:15px 20px !important;
  display:flex !important; justify-content:space-between !important; align-items:center !important;
}
#odrf-sigModal .odrf-modal-head h3{ margin:0 !important; font-size:1rem !important; color:#fff !important; font-weight:700 !important; text-transform:none !important; letter-spacing:normal !important; }
#odrf-sigModal .odrf-x{
  background:none !important; border:none !important; color:#fff !important; font-size:1.4rem !important;
  cursor:pointer !important; line-height:1 !important; padding:0 !important; width:auto !important; box-shadow:none !important;
}
#odrf-sigModal .odrf-modal-body{ padding:20px !important; }
#odrf-sigModal .odrf-tabs{ display:flex !important; gap:6px !important; margin:0 0 14px !important; }
#odrf-sigModal .odrf-tab{
  flex:1 1 0 !important; padding:8px !important; border-radius:6px !important; border:1px solid #d7dde5 !important;
  background:#f5f7fa !important; cursor:pointer !important; font-size:.82rem !important; font-weight:600 !important;
  color:#697585 !important; font-family:inherit !important; width:auto !important; box-shadow:none !important;
}
#odrf-sigModal .odrf-tab.odrf-on{ background:#004188 !important; color:#fff !important; border-color:#004188 !important; }
#odrf-sigModal .odrf-pane{ display:none !important; }
#odrf-sigModal .odrf-pane.odrf-on{ display:block !important; }
#odrf-sigModal #odrf-sigCanvas{
  display:block !important; width:100% !important; height:180px !important;
  border:2px dashed #d7dde5 !important; border-radius:8px !important;
  touch-action:none !important; cursor:crosshair !important; background:#fff !important; margin:0 !important;
}
#odrf-sigModal .odrf-modal-actions{ display:flex !important; justify-content:space-between !important; margin:14px 0 0 !important; gap:10px !important; }
#odrf-sigModal .odrf-drop{
  border:2px dashed #d7dde5 !important; border-radius:8px !important; padding:24px !important;
  text-align:center !important; color:#697585 !important; font-size:.85rem !important; cursor:pointer !important;
}
#odrf-sigModal .odrf-drop:hover{ border-color:#004188 !important; color:#004188 !important; }
#odrf-sigModal .odrf-preview{ max-width:100% !important; max-height:140px !important; margin:12px auto 0 !important; }
#odrf-sigModal .odrf-hint{ font-size:.74rem !important; color:#697585 !important; margin:8px 0 0 !important; line-height:1.4 !important; }

/* ---------- Toast ---------- */
#odrf-toast{
  position:fixed !important; bottom:22px !important; left:50% !important; transform:translateX(-50%) !important;
  background:#1c2530 !important; color:#fff !important; padding:11px 20px !important; border-radius:8px !important;
  font-size:.85rem !important; font-family:"Segoe UI",Helvetica,Arial,sans-serif !important;
  box-shadow:0 8px 24px rgba(0,0,0,.3) !important; z-index:2147483001 !important;
  opacity:0 !important; pointer-events:none !important; transition:opacity .2s !important; margin:0 !important;
}
#odrf-toast.odrf-show{ opacity:1 !important; }

#odrf-app .odrf-searchwrap{ margin:0 0 22px !important; }
#odrf-app .odrf-search{
  width:100% !important; max-width:100% !important; display:block !important;
  padding:11px 14px !important; margin:0 !important;
  border:1px solid var(--odrf-line) !important; border-radius:8px !important;
  background:#fff !important; color:var(--odrf-ink) !important;
  font-family:inherit !important; font-size:.92rem !important; line-height:1.3 !important;
  box-shadow:none !important; height:auto !important; min-height:0 !important;
}
#odrf-app .odrf-search:focus{
  outline:none !important; border-color:var(--odrf-navy) !important;
  box-shadow:0 0 0 3px rgba(0,65,136,.12) !important;
}
#odrf-app .odrf-search::placeholder{ color:var(--odrf-muted) !important; opacity:1 !important; }

/* ============================================================
   Shareable link manager  [opendoor_form_links]
   ============================================================ */
.odrf-links{
  max-width:1000px !important; margin:0 auto !important; padding:26px 18px 50px !important;
  font-family:"Segoe UI",Helvetica,Arial,sans-serif !important; color:#1c2530 !important;
  box-sizing:border-box !important;
}
.odrf-links *, .odrf-links *::before, .odrf-links *::after{ box-sizing:border-box !important; }
.odrf-links-title{ font-size:1.35rem !important; font-weight:700 !important; color:#004188 !important; margin:0 0 6px !important; }
.odrf-links-lede{ color:#697585 !important; font-size:.92rem !important; margin:0 0 18px !important; line-height:1.5 !important; }
.odrf-links-search{
  width:100% !important; display:block !important; padding:11px 14px !important; margin:0 0 18px !important;
  border:1px solid #d7dde5 !important; border-radius:8px !important; background:#fff !important;
  font-family:inherit !important; font-size:.92rem !important; color:#1c2530 !important;
  box-shadow:none !important; height:auto !important;
}
.odrf-links-search:focus{ outline:none !important; border-color:#004188 !important; box-shadow:0 0 0 3px rgba(0,65,136,.12) !important; }
.odrf-links-table{
  width:100% !important; border-collapse:collapse !important; background:#fff !important;
  border:1px solid #d7dde5 !important; border-radius:10px !important; overflow:hidden !important; margin:0 !important;
}
.odrf-links-table tr{ border-bottom:1px solid #eef1f5 !important; }
.odrf-links-table tr:last-child{ border-bottom:none !important; }
.odrf-links-table td{ padding:12px 14px !important; vertical-align:middle !important; border:none !important; }
.odrf-links-cat{
  display:block !important; font-size:.66rem !important; text-transform:uppercase !important;
  letter-spacing:.06em !important; color:#c9a14a !important; font-weight:700 !important; margin-bottom:2px !important;
}
.odrf-links-name strong{ font-size:.92rem !important; color:#1c2530 !important; font-weight:600 !important; }
.odrf-links-url input{
  width:100% !important; padding:7px 10px !important; border:1px solid #d7dde5 !important;
  border-radius:6px !important; background:#f5f7fa !important; font-size:.76rem !important;
  font-family:ui-monospace,Menlo,Consolas,monospace !important; color:#697585 !important; height:auto !important;
}
.odrf-links-copy{
  background:#004188 !important; color:#fff !important; border:none !important; border-radius:6px !important;
  padding:8px 16px !important; font-size:.82rem !important; font-weight:600 !important; cursor:pointer !important;
  font-family:inherit !important; white-space:nowrap !important; width:auto !important; box-shadow:none !important;
}
.odrf-links-copy:hover{ filter:brightness(1.12) !important; }
.odrf-links-foot{ color:#697585 !important; font-size:.82rem !important; margin:16px 0 0 !important; line-height:1.6 !important; }
.odrf-links-foot-label{ margin:0 0 8px !important; }
.odrf-links-foot-row{ display:flex !important; gap:10px !important; align-items:center !important; flex-wrap:wrap !important; }
.odrf-links-foot-row input{
  flex:1 1 260px !important; min-width:0 !important; padding:7px 10px !important;
  border:1px solid #d7dde5 !important; border-radius:6px !important; background:#f5f7fa !important;
  font-size:.76rem !important; font-family:ui-monospace,Menlo,Consolas,monospace !important;
  color:#697585 !important; height:auto !important;
}
.odrf-links-foot code{ background:#f5f7fa !important; padding:2px 6px !important; border-radius:4px !important; font-size:.8rem !important; }

@media (max-width:700px){
  .odrf-links-table, .odrf-links-table tbody, .odrf-links-table tr, .odrf-links-table td{ display:block !important; width:100% !important; }
  .odrf-links-table tr{ padding:12px 4px !important; }
  .odrf-links-table td{ padding:4px 10px !important; }
  .odrf-links-copy{ width:100% !important; margin-top:6px !important; }
}

/* ---------- Visibility helper ----------
   JS toggles this class instead of setting inline display, because the
   !important rules above would otherwise beat an inline style="display:none".
   Compound selectors keep it winning against those rules. */
#odrf-app .odrf-hidden,
#odrf-app .odrf-toolbar.odrf-hidden,
#odrf-app .odrf-menu.odrf-hidden,
#odrf-app .odrf-success.odrf-hidden{ display:none !important; }

@media (max-width:820px){
  #odrf-app .odrf-layout{ display:block !important; }
  #odrf-app .odrf-side{
    width:100% !important; flex:none !important;
    border-right:none !important; border-bottom:1px solid var(--odrf-line) !important;
    padding:12px 14px !important;
  }
  /* Keep the status/error line visible on phones — only the how-it-works
     steps are dropped, since they'd otherwise push the form far down. */
  #odrf-app .odrf-side-h, #odrf-app .odrf-step{ display:none !important; }
  #odrf-app .odrf-status{ margin:10px 0 0 !important; }
  #odrf-app .odrf-main{ padding:12px 8px !important; }
  #odrf-app .odrf-bar{ padding:14px 16px !important; }
  #odrf-app .odrf-menu{ padding:22px 16px 40px !important; }
  #odrf-app .odrf-brand-title{ font-size:1rem !important; }
}

/* ============================================================
   Staff dashboard  [opendoor_staff_dashboard]
   ============================================================ */
.odrf-dash{
  max-width:1080px !important; margin:0 auto !important; padding:24px 16px 60px !important;
  font-family:"Segoe UI",Helvetica,Arial,sans-serif !important; color:#1c2530 !important; box-sizing:border-box !important;
}
.odrf-dash *, .odrf-dash *::before, .odrf-dash *::after{ box-sizing:border-box !important; }

.odrf-dash-head{
  display:flex !important; align-items:center !important; justify-content:space-between !important;
  gap:14px !important; flex-wrap:wrap !important; padding:18px 20px !important; margin:0 0 18px !important;
  background:linear-gradient(120deg,#004188 0%,#002d5e 100%) !important; border-bottom:3px solid #c9a14a !important;
  border-radius:12px !important;
}
.odrf-dash-who{ display:flex !important; align-items:center !important; gap:14px !important; }
.odrf-dash-title{ font-size:1.2rem !important; font-weight:700 !important; color:#fff !important; margin:0 !important; }
.odrf-dash-sub{ font-size:.8rem !important; color:#e8d9b0 !important; margin:2px 0 0 !important; }
img.odrf-avatar{ border-radius:50% !important; display:block !important; border:2px solid rgba(255,255,255,.5) !important; }

.odrf-tabs-nav{ display:flex !important; gap:4px !important; flex-wrap:wrap !important; margin:0 0 18px !important; border-bottom:1px solid #d7dde5 !important; }
.odrf-tab-link{
  display:inline-block !important; padding:10px 16px !important; text-decoration:none !important;
  font-size:.86rem !important; font-weight:600 !important; color:#697585 !important;
  border-bottom:3px solid transparent !important; margin-bottom:-1px !important;
}
.odrf-tab-link:hover{ color:#004188 !important; }
.odrf-tab-link.odrf-tab-on{ color:#004188 !important; border-bottom-color:#c9a14a !important; }
.odrf-badge{
  display:inline-block !important; background:#b3452c !important; color:#fff !important; border-radius:10px !important;
  padding:1px 7px !important; font-size:.68rem !important; margin-left:5px !important; vertical-align:middle !important;
}

.odrf-cards{ display:grid !important; grid-template-columns:repeat(auto-fit,minmax(165px,1fr)) !important; gap:12px !important; margin:0 0 18px !important; }
.odrf-card-stat{ background:#fff !important; border:1px solid #d7dde5 !important; border-radius:12px !important; padding:18px !important; }
.odrf-stat-num{ font-size:1.9rem !important; font-weight:700 !important; color:#004188 !important; line-height:1.1 !important; }
.odrf-stat-lbl{ font-size:.84rem !important; font-weight:600 !important; color:#1c2530 !important; margin-top:4px !important; }
.odrf-stat-sub{ font-size:.72rem !important; color:#9aa5b1 !important; margin-top:2px !important; }

.odrf-panel{ background:#fff !important; border:1px solid #d7dde5 !important; border-radius:12px !important; padding:20px !important; margin:0 0 18px !important; }
.odrf-panel-plain{ margin:0 0 18px !important; }
.odrf-panel-title{ font-size:1rem !important; font-weight:700 !important; color:#004188 !important; margin:0 0 12px !important; }
.odrf-dmuted{ color:#9aa5b1 !important; font-size:.85rem !important; line-height:1.5 !important; margin:0 !important; }

.odrf-spark{ display:flex !important; align-items:flex-end !important; gap:5px !important; height:130px !important; }
.odrf-spark-col{ flex:1 1 0 !important; display:flex !important; flex-direction:column !important; align-items:center !important; justify-content:flex-end !important; height:100% !important; }
.odrf-spark-bar{ width:100% !important; background:#004188 !important; border-radius:3px 3px 0 0 !important; min-height:4px !important; }
.odrf-spark-col span{ font-size:.62rem !important; color:#9aa5b1 !important; margin-top:4px !important; }

.odrf-dtable{ width:100% !important; border-collapse:collapse !important; font-size:.86rem !important; margin:0 !important; }
.odrf-dtable th{ text-align:left !important; padding:8px 10px !important; font-size:.68rem !important; text-transform:uppercase !important; letter-spacing:.06em !important; color:#697585 !important; border-bottom:1px solid #d7dde5 !important; font-weight:700 !important; }
.odrf-dtable td{ padding:10px !important; border-bottom:1px solid #eef1f5 !important; vertical-align:middle !important; }
.odrf-dtable tr:last-child td{ border-bottom:none !important; }
.odrf-row-off{ opacity:.55 !important; }
.odrf-pill{ display:inline-block !important; background:#eef5fa !important; color:#004188 !important; font-size:.62rem !important; text-transform:uppercase !important; letter-spacing:.05em !important; padding:2px 7px !important; border-radius:10px !important; margin-left:6px !important; font-weight:700 !important; }
.odrf-meter{ background:#eef1f5 !important; border-radius:4px !important; height:9px !important; width:100% !important; overflow:hidden !important; }
.odrf-meter-fill{ background:#c9a14a !important; height:100% !important; }

.odrf-dform{ margin:0 !important; }
.odrf-dgrid{ display:grid !important; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)) !important; gap:12px !important; margin:0 0 14px !important; }
.odrf-dlabel{ display:block !important; font-size:.78rem !important; font-weight:600 !important; color:#004188 !important; margin:0 !important; }
.odrf-dinput{
  display:block !important; width:100% !important; margin:5px 0 0 !important; padding:9px 11px !important;
  border:1px solid #d7dde5 !important; border-radius:8px !important; background:#fff !important;
  font-family:inherit !important; font-size:.88rem !important; color:#1c2530 !important; height:auto !important; box-shadow:none !important;
}
.odrf-dinput:focus{ outline:none !important; border-color:#004188 !important; box-shadow:0 0 0 3px rgba(0,65,136,.12) !important; }
.odrf-dsearch{
  display:block !important; width:100% !important; margin:0 0 14px !important; padding:10px 12px !important;
  border:1px solid #d7dde5 !important; border-radius:8px !important; font-family:inherit !important; font-size:.88rem !important; height:auto !important;
}

.odrf-dbtn{
  display:inline-block !important; width:auto !important; appearance:none !important; -webkit-appearance:none !important;
  border:1px solid transparent !important; border-radius:6px !important; padding:9px 16px !important; margin:0 !important;
  font-family:inherit !important; font-size:.84rem !important; font-weight:600 !important; line-height:1.2 !important;
  text-decoration:none !important; text-align:center !important; cursor:pointer !important; box-shadow:none !important; text-transform:none !important;
}
.odrf-dbtn-gold{ background:#c9a14a !important; color:#2b2205 !important; }
.odrf-dbtn-navy{ background:#004188 !important; color:#fff !important; }
.odrf-dbtn-ghost{ background:#fff !important; color:#004188 !important; border-color:#d7dde5 !important; }
.odrf-dbtn-small{ padding:6px 11px !important; font-size:.76rem !important; }
.odrf-dbtn:hover{ filter:brightness(1.07) !important; }

.odrf-dflash{ padding:12px 14px !important; border-radius:8px !important; font-size:.86rem !important; margin:0 0 16px !important; border:1px solid transparent !important; }
.odrf-dsuccess{ background:#e9f6ef !important; border-color:#a9dcc0 !important; color:#1f7a4d !important; }
.odrf-derror{ background:#fbeae5 !important; border-color:#eab6a5 !important; color:#b3452c !important; }

@media (max-width:640px){
  .odrf-dash{ padding:14px 10px 40px !important; }
  .odrf-dtable th:nth-child(2), .odrf-dtable td:nth-child(2){ display:none !important; }
  .odrf-dbtn-small{ display:block !important; margin-bottom:4px !important; }
}
.odrf-nowrap{ white-space:nowrap !important; }
.odrf-pill-warn{ background:#fbeae5 !important; color:#b3452c !important; }

/* ============================================================
   Resident journey  [opendoor_my_forms]
   ============================================================ */
.odrf-progress-head{ display:flex !important; justify-content:space-between !important; align-items:flex-start !important; gap:16px !important; }
.odrf-progress-pct{ font-size:2rem !important; font-weight:700 !important; color:#8B5CF6 !important; line-height:1 !important; white-space:nowrap !important; }
.odrf-progress-track{ background:#EDE7F8 !important; border-radius:8px !important; height:12px !important; width:100% !important; overflow:hidden !important; margin-top:12px !important; }
.odrf-progress-fill{ background:linear-gradient(90deg,#8B5CF6 0%,#EC4899 100%) !important; height:100% !important; border-radius:8px !important; }

.odrf-next{ border-left:4px solid #C9A14A !important; }
.odrf-next-label{ font-size:.66rem !important; font-weight:700 !important; letter-spacing:.09em !important; color:#8A6C1F !important; margin-bottom:4px !important; }
.odrf-next-name{ font-size:1.05rem !important; font-weight:700 !important; color:#36226A !important; margin-bottom:10px !important; }

.odrf-stage-head{ display:flex !important; justify-content:space-between !important; align-items:center !important; gap:12px !important; margin-bottom:2px !important; }
.odrf-stage-count{ font-size:.72rem !important; font-weight:700 !important; color:#697585 !important; background:#EFF1F3 !important; border-radius:10px !important; padding:3px 10px !important; white-space:nowrap !important; }
.odrf-stage-count.odrf-stage-done{ background:#E4F2E8 !important; color:#1F6F43 !important; }

.odrf-step-row{ display:flex !important; align-items:center !important; gap:12px !important; padding:9px 0 !important; border-bottom:1px solid #EEF1F5 !important; }
.odrf-step-row:last-child{ border-bottom:none !important; }
.odrf-step-tick{
  width:22px !important; height:22px !important; min-width:22px !important; border-radius:50% !important;
  border:2px solid #D7DDE5 !important; color:#fff !important; font-size:.72rem !important; font-weight:700 !important;
  display:flex !important; align-items:center !important; justify-content:center !important; flex:0 0 22px !important;
}
.odrf-step-done .odrf-step-tick{ background:#22C55E !important; border-color:#22C55E !important; }
.odrf-step-body{ flex:1 1 auto !important; min-width:0 !important; }
.odrf-step-name{ font-size:.9rem !important; color:#1C2530 !important; font-weight:600 !important; }
.odrf-step-done .odrf-step-name{ color:#9AA6B2 !important; font-weight:400 !important; text-decoration:line-through !important; }
.odrf-step-note{ font-size:.76rem !important; color:#9AA6B2 !important; margin-top:2px !important; }
.odrf-step-act{ flex:0 0 auto !important; }
.odrf-tag{
  display:inline-block !important; font-size:.6rem !important; text-transform:uppercase !important;
  letter-spacing:.05em !important; font-weight:700 !important; padding:2px 7px !important;
  border-radius:9px !important; margin-left:6px !important; background:#EFF1F3 !important; color:#697585 !important;
  vertical-align:middle !important;
}
.odrf-tag-staff{ background:#EDE7F8 !important; color:#5B3FA8 !important; }

@media (max-width:560px){
  .odrf-step-row{ flex-wrap:wrap !important; }
  .odrf-step-act{ width:100% !important; padding-left:34px !important; margin-top:4px !important; }
}

/* ============================================================
   Big field editor (mobile)
   ============================================================ */
#odrf-editor{
  position:fixed !important; left:0 !important; right:0 !important; bottom:0 !important;
  background:#0F1E33 !important; color:#fff !important; z-index:2147482900 !important;
  transform:translateY(110%) !important; transition:transform .18s ease !important;
  box-shadow:0 -8px 28px rgba(0,0,0,.35) !important;
  font-family:"Segoe UI",Helvetica,Arial,sans-serif !important; padding:10px 10px 14px !important;
  box-sizing:border-box !important;
}
#odrf-editor.odrf-ed-open{ transform:translateY(0) !important; }
#odrf-editor *{ box-sizing:border-box !important; }
.odrf-ed-bar{ display:flex !important; align-items:flex-end !important; gap:8px !important; }
.odrf-ed-mid{ flex:1 1 auto !important; min-width:0 !important; }
.odrf-ed-label{
  font-size:.72rem !important; font-weight:700 !important; letter-spacing:.05em !important;
  text-transform:uppercase !important; color:#8FB4E0 !important; margin:0 0 4px !important;
  white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important;
}
#odrf-ed-input{
  width:100% !important; font-size:17px !important;   /* 16px+ stops iOS auto-zoom */
  padding:11px 12px !important; border-radius:8px !important; border:2px solid #2F5C8F !important;
  background:#fff !important; color:#12202F !important; font-family:inherit !important; height:auto !important;
}
#odrf-ed-input:focus{ outline:none !important; border-color:#C9A14A !important; }
.odrf-ed-nav{
  background:#1D3557 !important; color:#fff !important; border:none !important; border-radius:8px !important;
  width:40px !important; height:44px !important; font-size:1.4rem !important; line-height:1 !important;
  cursor:pointer !important; flex:0 0 40px !important; padding:0 !important;
}
.odrf-ed-done{
  background:#C9A14A !important; color:#2B2205 !important; border:none !important; border-radius:8px !important;
  height:44px !important; padding:0 14px !important; font-weight:700 !important; font-size:.85rem !important;
  cursor:pointer !important; flex:0 0 auto !important; font-family:inherit !important;
}
.odrf-ed-pos{ font-size:.7rem !important; color:#7E93AC !important; margin:6px 2px 0 !important; }
#odrf-app input.odrf-f.odrf-f-active{
  outline:3px solid #C9A14A !important; outline-offset:1px !important;
  background:#FFF8E6 !important; box-shadow:0 0 0 4px rgba(201,161,74,.25) !important;
}
@media (min-width:821px){ #odrf-editor{ display:none !important; } }

/* unified account page footer */
.oda-account-foot{ max-width:1080px !important; margin:0 auto !important; padding:0 16px !important; }

/* ============================================================
   Messaging
   ============================================================ */
.odrf-dtextarea{
  width:100% !important; min-height:96px !important; resize:vertical !important;
  font-family:inherit !important; line-height:1.5 !important; padding:10px 12px !important;
}
.odrf-msg-forms{
  border:1px solid #D7DDE5 !important; border-radius:8px !important; padding:12px !important;
  margin:0 0 14px !important; background:#F8F6FD !important;
}
.odrf-msg-forms-head{
  font-size:.72rem !important; font-weight:700 !important; text-transform:uppercase !important;
  letter-spacing:.05em !important; color:#5B3FA8 !important; margin-bottom:8px !important;
}
.odrf-msg-forms-head span{ font-weight:400 !important; text-transform:none !important; letter-spacing:normal !important; color:#9AA6B2 !important; }
.odrf-msg-forms-grid{ display:grid !important; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)) !important; gap:6px !important; }
.odrf-msg-form{ display:flex !important; align-items:flex-start !important; gap:7px !important; font-size:.83rem !important; color:#1C2530 !important; cursor:pointer !important; }
.odrf-msg-form input{ margin:2px 0 0 !important; accent-color:#5B3FA8 !important; flex:0 0 auto !important; }

.odrf-msg-unread td{ background:#F4F0FD !important; }
.odrf-msg-link{ color:#36226A !important; text-decoration:none !important; }
.odrf-msg-link:hover{ text-decoration:underline !important; }
.odrf-back-link{ font-size:.82rem !important; color:#5B3FA8 !important; text-decoration:none !important; font-weight:600 !important; }

.odrf-msg{
  border-left:3px solid #D7DDE5 !important; padding:10px 0 10px 14px !important; margin:0 0 14px !important;
}
.odrf-msg-mine{ border-left-color:#C9A14A !important; background:#FCFAF4 !important; }
.odrf-msg-meta{ font-size:.74rem !important; color:#8A97A6 !important; margin-bottom:5px !important; }
.odrf-msg-body{ font-size:.9rem !important; color:#1C2530 !important; line-height:1.55 !important; }
.odrf-msg-body p{ margin:0 0 8px !important; }
.odrf-msg-attached{ margin-top:8px !important; display:flex !important; flex-wrap:wrap !important; gap:6px !important; }
.odrf-msg-formlink{
  display:inline-block !important; background:#EDE7F8 !important; color:#5B3FA8 !important;
  padding:4px 10px !important; border-radius:12px !important; font-size:.76rem !important;
  font-weight:600 !important; text-decoration:none !important;
}
.odrf-msg-formlink:hover{ background:#DED2F3 !important; }

/* ---------- sign-in gate on a protected form ---------- */
#odrf-app .odrf-gate{
  background:#fff !important; border:1px solid var(--odrf-line) !important; border-radius:12px !important;
  padding:30px !important; max-width:520px !important; margin:20px auto !important; text-align:center !important;
}
#odrf-app .odrf-gate-title{
  font-size:1.1rem !important; font-weight:700 !important; color:var(--odrf-navy) !important;
  margin:0 0 10px !important;
}
#odrf-app .odrf-gate-text{
  font-size:.9rem !important; color:var(--odrf-muted) !important; line-height:1.55 !important;
  margin:0 0 12px !important;
}
#odrf-app .odrf-gate-actions{
  display:flex !important; gap:10px !important; justify-content:center !important;
  flex-wrap:wrap !important; margin-top:16px !important;
}
.odrf-pending-note{ border-left:4px solid #C9A14A !important; }
