:root{
  --bg:#0b1020;
  --card: rgba(255,255,255,.06);
  --border: rgba(255,255,255,.12);
  --text: rgba(255,255,255,.92);
  --muted: rgba(255,255,255,.72);
  --primary: #2563EB;
  --accent: #F97316;
  --accent: #7dd3fc;
  --shadow: 0 12px 40px rgba(0,0,0,.35);
  --radius: 16px;
  --maxw: 1100px;
}
*{ box-sizing:border-box; }
html,body{ height:100%; margin:0; font-family: system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif; background: radial-gradient(1200px 700px at 10% -10%, rgba(125,211,252,.20), transparent 60%), radial-gradient(900px 600px at 90% 0%, rgba(167,139,250,.16), transparent 55%), var(--bg); color:var(--text); }
a{ color:inherit; text-decoration:none; }
.no-scroll{ overflow:hidden; }

.topbar{ position: sticky; top:0; z-index: 20; backdrop-filter: blur(10px); background: rgba(10,14,30,.65); border-bottom:1px solid var(--border); }
.topbar-inner{ max-width: var(--maxw); margin:0 auto; padding: 14px 18px; display:flex; align-items:center; gap:14px; }
.brand{ font-weight:800; letter-spacing:.2px; }
.nav{ display:flex; gap:12px; margin-left:10px; flex-wrap:wrap; }
.nav a{ color: var(--muted); padding: 8px 10px; border-radius: 10px; }
.nav a.active, .nav a:hover{ color: var(--text); background: rgba(255,255,255,.06); }
.nav-right{ margin-left:auto; display:flex; gap:10px; align-items:center; }

.main{ max-width: var(--maxw); margin: 0 auto; padding: 22px 18px 8px; }
.footer{ border-top:1px solid var(--border); margin-top: 24px; background: rgba(10,14,30,.40); }
.footer-inner{ max-width: var(--maxw); margin:0 auto; padding: 18px; display:flex; justify-content:space-between; gap:10px; color: var(--muted); flex-wrap:wrap; }
.footer-links{ display:flex; gap:12px; }

.card{ background: var(--card); border:1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); padding: 18px; }
.grid{ display:grid; gap: 14px; }
.grid-2{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 860px){ .grid-2{ grid-template-columns: 1fr; } }

.hero{ padding: 26px; border-radius: 22px; background:
  radial-gradient(900px 600px at 10% 0%, rgba(37,99,235,.14), transparent 60%),
  radial-gradient(900px 600px at 90% 10%, rgba(249,115,22,.10), transparent 55%),
  url("https://images.unsplash.com/photo-1445019980597-93fa8acb246c?auto=format&fit=crop&w=1920&q=80") center/cover no-repeat;
  border:1px solid var(--border);
  box-shadow: var(--shadow);
}
.hero h1{ margin:0 0 10px; font-size: clamp(28px, 4.2vw, 48px); line-height:1.05; }
.hero p{ margin:0 0 16px; max-width: 70ch; color: rgba(255,255,255,.86); line-height:1.55; }
.badges{ display:flex; gap:10px; flex-wrap:wrap; }
.badge{ display:inline-flex; gap:8px; align-items:center; font-size: 13px; padding: 8px 10px; border-radius: 999px; background: rgba(0,0,0,.25); border:1px solid rgba(255,255,255,.16); }

.btn{ display:inline-flex; justify-content:center; align-items:center; gap:8px; padding: 10px 12px; border-radius: 12px; border:1px solid rgba(255,255,255,.18); background: rgba(255,255,255,.12); color: var(--text); font-weight: 700; }
.btn:hover{ background: rgba(255,255,255,.18); }
.btn-ghost{ background: transparent; }
.btn-ghost:hover{ background: rgba(255,255,255,.08); }

.input, .textarea, .select{
  width:100%; padding: 10px 12px; border-radius: 12px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(0,0,0,.20);
  color: var(--text);
  outline: none;
}
.textarea{ min-height: 140px; resize: vertical; }
label{ display:block; font-size: 13px; color: var(--muted); margin: 8px 0 6px; }
.small{ font-size: 13px; color: var(--muted); line-height: 1.5; }
.kicker{ color: var(--muted); font-size: 14px; margin:0 0 8px; }
.h2{ font-size: 22px; margin:0 0 12px; }
.row{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; }

.notice{ padding: 12px 12px; border-radius: 14px; border:1px solid rgba(255,255,255,.16); background: rgba(125,211,252,.12); }
.error{ background: rgba(248,113,113,.10); }

.portal-wrap{ height: calc(100vh - 64px); /* header approx */ margin-top: 10px; }
.portal-iframe{ width: 100%; height: 100%; border: 1px solid rgba(255,255,255,.14); border-radius: 14px; background: rgba(0,0,0,.2); }

.table{ width:100%; border-collapse: collapse; }
.table th,.table td{ padding: 10px 10px; border-bottom:1px solid rgba(255,255,255,.10); font-size: 14px; }
.table th{ text-align:left; color: var(--muted); font-weight: 700; }

.pill{ padding: 6px 10px; border-radius: 999px; background: rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.12); font-size: 12px; color: var(--muted); display:inline-block; }


/* Batch B: button variants */
.btn.primary{background:rgba(37,99,235,.20);border-color:rgba(37,99,235,.40)}
.btn.primary:hover{background:rgba(37,99,235,.28)}
.btn.accent{background:rgba(249,115,22,.20);border-color:rgba(249,115,22,.40)}
.btn.accent:hover{background:rgba(249,115,22,.28)}

/* Batch B: admin layout polish */
.admin-grid{display:grid;grid-template-columns:240px 1fr;gap:14px}
@media(max-width:980px){.admin-grid{grid-template-columns:1fr}}
.sidebar{position:sticky;top:78px;align-self:start}
.side-link{display:flex;gap:10px;align-items:center;padding:10px 12px;border-radius:14px;color:var(--muted);border:1px solid transparent}
.side-link:hover{background:rgba(255,255,255,.06);color:var(--text);border-color:rgba(255,255,255,.12)}
.side-link.active{background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.35);color:var(--text)}

/* Batch B.1.1: orange/blue brand background */
body{
  background:
    radial-gradient(900px 600px at 10% -10%, rgba(37,99,235,.30), transparent 60%),
    radial-gradient(900px 600px at 90% 0%, rgba(249,115,22,.22), transparent 55%),
    radial-gradient(700px 500px at 50% 120%, rgba(37,99,235,.12), transparent 60%),
    linear-gradient(180deg, rgba(8,10,18,1) 0%, rgba(10,14,30,1) 55%, rgba(8,10,18,1) 100%);
  background-attachment: fixed;
}


/* Patch: brand background v2 */
html,body{background-color:#0a0e1e;}
body{
  background:
    radial-gradient(1100px 700px at 0% 0%, rgba(37,99,235,.40), transparent 58%),
    radial-gradient(1100px 700px at 100% 0%, rgba(249,115,22,.28), transparent 55%),
    radial-gradient(900px 650px at 50% 120%, rgba(37,99,235,.16), transparent 60%),
    linear-gradient(180deg, #070a15 0%, #0a0e1e 55%, #070a15 100%);
  background-attachment: fixed;
}


/* Patch: Light hero + glass panel */
.hero .hero-panel{
  width: min(760px, 100%);
  padding: 20px 18px;
  border-radius: 18px;
  background: rgba(255,255,255,.18);
  border: 1px solid rgba(255,255,255,.26);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: 0 18px 50px rgba(0,0,0,.20);
}
.hero h1{
  text-shadow:
    0 2px 0 rgba(0,0,0,.18),
    0 12px 30px rgba(0,0,0,.22);
}
.hero p{
  text-shadow:
    0 2px 0 rgba(0,0,0,.14),
    0 10px 22px rgba(0,0,0,.18);
}
.hero .kicker{ opacity:.95; }


/* Patch: lighter global background */
body{
  background:
    radial-gradient(1200px 800px at 0% 0%, rgba(37,99,235,.26), transparent 60%),
    radial-gradient(1200px 800px at 100% 0%, rgba(249,115,22,.18), transparent 58%),
    linear-gradient(180deg, #0b1226 0%, #0a0f22 55%, #0b1226 100%);
  background-attachment: fixed;
}


/* Patch: LIGHT brand background (orange/blue) */
body{
  color-scheme: dark; /* keep dark UI components */
  background:
    radial-gradient(1200px 800px at 0% 0%, rgba(37,99,235,.18), transparent 55%),
    radial-gradient(1200px 800px at 100% 0%, rgba(249,115,22,.16), transparent 55%),
    linear-gradient(180deg, #f7f9ff 0%, #fff7ef 45%, #f7fbff 100%);
  background-attachment: fixed;
}
/* Ensure main cards remain readable on light backdrop */
.card, .hero, .navbar{
  background: rgba(10,14,30,.82) !important;
  border-color: rgba(255,255,255,.14) !important;
}
.navbar{
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}


/* ===============================
   LIGHT THEME (A) — PropertyZentral
   =============================== */
:root{
  --bg:#f7fbff;
  --card:#ffffff;
  --card2:#f6f8ff;
  --text:#0f172a;
  --muted:#475569;
  --border:rgba(15,23,42,.12);
  --shadow: 0 16px 40px rgba(2,6,23,.10);
  --shadow2: 0 10px 24px rgba(2,6,23,.08);
  --primary:#2563EB;
  --accent:#F97316;
}

/* Global background */
body{
  color: var(--text);
  background:
    radial-gradient(1200px 800px at 0% 0%, rgba(37,99,235,.14), transparent 55%),
    radial-gradient(1200px 800px at 100% 0%, rgba(249,115,22,.12), transparent 55%),
    linear-gradient(180deg, #f7fbff 0%, #fff7ef 45%, #f7fbff 100%) !important;
  background-attachment: fixed;
}

/* Typography */
h1,h2,h3,.h1,.h2,.h3{ color: var(--text) !important; }
.small, .muted, .subtle{ color: var(--muted) !important; }
a{ color: var(--primary); }
a:hover{ opacity:.9; }

/* Navbar */
.navbar{
  background: rgba(255,255,255,.72) !important;
  border-bottom: 1px solid rgba(15,23,42,.10) !important;
  box-shadow: 0 8px 26px rgba(2,6,23,.08);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}
.navbar .nav a{ color: rgba(15,23,42,.78) !important; }
.navbar .nav a.active{ color: var(--text) !important; background: rgba(37,99,235,.10) !important; }
.brand span{ color: var(--text) !important; }

/* Cards */
.card{
  background: rgba(255,255,255,.92) !important;
  border: 1px solid rgba(15,23,42,.10) !important;
  box-shadow: var(--shadow2);
}
.card:hover{ border-color: rgba(37,99,235,.18) !important; }

/* Hero */
.hero{
  background:
    radial-gradient(900px 600px at 10% 0%, rgba(37,99,235,.10), transparent 60%),
    radial-gradient(900px 600px at 90% 10%, rgba(249,115,22,.10), transparent 55%),
    url("https://images.unsplash.com/photo-1445019980597-93fa8acb246c?auto=format&fit=crop&w=1920&q=80") center/cover no-repeat !important;
  border: 1px solid rgba(15,23,42,.08) !important;
  box-shadow: var(--shadow);
}
.hero .hero-panel{
  background: rgba(255,255,255,.82) !important;
  border: 1px solid rgba(15,23,42,.12) !important;
  box-shadow: 0 18px 50px rgba(2,6,23,.14);
}
.hero h1, .hero p, .hero .kicker{
  color: var(--text) !important;
  text-shadow: none !important;
}
.hero p{ color: rgba(15,23,42,.78) !important; }

/* Pills / chips */
.pill{
  background: rgba(15,23,42,.05) !important;
  border: 1px solid rgba(15,23,42,.10) !important;
  color: rgba(15,23,42,.82) !important;
}

/* Inputs */
.input, .select, textarea{
  background: rgba(255,255,255,.96) !important;
  border: 1px solid rgba(15,23,42,.12) !important;
  color: var(--text) !important;
}
.input::placeholder, textarea::placeholder{ color: rgba(71,85,105,.65) !important; }
label{ color: rgba(15,23,42,.78) !important; }

/* Buttons */
.btn{
  background: rgba(15,23,42,.04) !important;
  border: 1px solid rgba(15,23,42,.12) !important;
  color: rgba(15,23,42,.88) !important;
}
.btn:hover{ background: rgba(15,23,42,.06) !important; }
.btn.primary{
  background: rgba(37,99,235,.12) !important;
  border-color: rgba(37,99,235,.28) !important;
  color: rgba(15,23,42,.92) !important;
}
.btn.accent{
  background: rgba(249,115,22,.14) !important;
  border-color: rgba(249,115,22,.30) !important;
  color: rgba(15,23,42,.92) !important;
}
.btn.btn-ghost{
  background: transparent !important;
  border-color: rgba(15,23,42,.12) !important;
}

/* Tables */
.table th{ color: rgba(15,23,42,.72) !important; }
.table td{ color: rgba(15,23,42,.86) !important; }
.table thead tr{ background: rgba(37,99,235,.06) !important; }

/* Footer */
.footer{
  background: rgba(255,255,255,.70) !important;
  border-top: 1px solid rgba(15,23,42,.10) !important;
  color: rgba(15,23,42,.70) !important;
}
.footer a{ color: rgba(15,23,42,.78) !important; }


/* Patch: Light header + hero white text with subtle outline (A) */
.navbar{
  background: rgba(255,255,255,.88) !important;
  border-bottom: 1px solid rgba(15,23,42,.10) !important;
  box-shadow: 0 10px 30px rgba(2,6,23,.08) !important;
}
.navbar .nav a{ color: rgba(15,23,42,.74) !important; }
.navbar .nav a:hover{ color: rgba(15,23,42,.92) !important; }
.navbar .nav a.active{ background: rgba(37,99,235,.10) !important; color: rgba(15,23,42,.92) !important; }
.navbar .btn.primary{
  background: rgba(37,99,235,.12) !important;
  border-color: rgba(37,99,235,.30) !important;
}

/* Hero text: white with subtle dark outline */
.hero h1, .hero p, .hero .kicker{
  color: #ffffff !important;
  text-shadow:
    0 2px 14px rgba(0,0,0,.22),
    0 1px 0 rgba(0,0,0,.18) !important;
}
.hero h1{
  -webkit-text-stroke: 1px rgba(15,23,42,.55);
  paint-order: stroke fill;
}
/* For browsers without stroke support, add a subtle outline via multi-shadow */
.hero h1{
  text-shadow:
    0 0 0 rgba(0,0,0,0),
    1px 0 rgba(15,23,42,.35),
    -1px 0 rgba(15,23,42,.35),
    0 1px rgba(15,23,42,.35),
    0 -1px rgba(15,23,42,.35),
    0 16px 34px rgba(0,0,0,.18);
}
.hero p, .hero .kicker{
  text-shadow:
    1px 0 rgba(15,23,42,.22),
    -1px 0 rgba(15,23,42,.22),
    0 1px rgba(15,23,42,.22),
    0 -1px rgba(15,23,42,.22),
    0 12px 26px rgba(0,0,0,.14);
}

/* Make hero panel more transparent so image feels brighter */
.hero .hero-panel{
  background: rgba(255,255,255,.22) !important;
  border: 1px solid rgba(255,255,255,.30) !important;
}



/* ===== MERGED FROM PROPERTYZENTRAL-PATCH-NEWSLETTER-RESTORE-FOOTER-STICKY.zip :: assets/css/footer_fix.css ===== */
/* Sticky footer (professional): footer stays at bottom when page is short, and flows naturally when content is long */
html, body { height: 100%; }
body {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
/* common wrappers */
main, .main, #main, .page-main, .content {
  flex: 1 0 auto;
}
footer, .site-footer, #footer {
  flex-shrink: 0;
}



/* ===== MERGED FROM PROPERTYZENTRAL-WORKING-ZIP-READABILITY-PATCH.zip :: assets/css/overrides.css ===== */
/* PropertyZentral Readability Overrides (SAFE PATCH)
   This file is loaded AFTER app.css so it won't break the base stylesheet.
*/

/* HEADER: light gray background + dark readable text */
.topbar{
  background:#f2f3f5 !important;
  border-bottom:1px solid rgba(0,0,0,.08) !important;
  box-shadow:0 6px 18px rgba(0,0,0,.05) !important;
}
.topbar .brand span{ color:#2f2f2f !important; }
.topbar .nav a{ color:#374151 !important; }
.topbar .nav a:hover{ color:#111827 !important; }
.topbar .nav a.active{ background: rgba(37,99,235,.08) !important; color:#111827 !important; }

/* HERO TEXT: white with dark gray border (outline) */
.hero h1,
.hero p,
.hero .kicker{
  color:#ffffff !important;
  -webkit-text-stroke: 1px rgba(60,60,60,.85);
  paint-order: stroke fill;
}

/* Fallback outline using multi-shadow (thin) */
.hero h1,
.hero p,
.hero .kicker{
  text-shadow:
    1px 0 rgba(60,60,60,.55),
   -1px 0 rgba(60,60,60,.55),
    0 1px rgba(60,60,60,.55),
    0 -1px rgba(60,60,60,.55);
}

/* HERO BUTTONS: white text + light transparent background */
.hero .btn{
  color:#ffffff !important;
  background: rgba(255,255,255,.22) !important;
  border: 1px solid rgba(255,255,255,.45) !important;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.hero .btn:hover{
  background: rgba(255,255,255,.32) !important;
}

/* HERO FEATURE TEXT: white + transparent */
.hero .pill{
  color:#ffffff !important;
  background: transparent !important;
  border: 1px solid rgba(255,255,255,.45) !important;
}



/* ===== MERGED FROM PROPERTYZENTRAL-PATCH-KICKER-PILLS-READABILITY.zip :: assets/css/overrides.extra.css ===== */
/* Patch: kicker size + readable hero pills */

/* "Modern Property Operations" (kicker) */
.hero .kicker{
  font-size: 16px !important;
  font-weight: 600 !important;
  letter-spacing: .2px !important;
  color: #000000 !important;
  -webkit-text-stroke: 0 !important;
  text-shadow: none !important;
}

/* Feature chips under buttons */
.hero .pill{
  color: #ffffff !important;
  background: rgba(255,255,255,.22) !important;  /* white transparent */
  border: 1px solid rgba(255,255,255,.45) !important;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  text-shadow:
    1px 0 rgba(60,60,60,.35),
   -1px 0 rgba(60,60,60,.35),
    0 1px rgba(60,60,60,.35),
    0 -1px rgba(60,60,60,.35) !important;
}
.hero .pill:hover{
  background: rgba(255,255,255,.30) !important;
}



/* ===== MERGED FROM PROPERTYZENTRAL-URGENT-HERO-PILLS-WHITE-GLASS.zip :: assets/css/overrides.urgent.css ===== */
/* PropertyZentral: Hero pill readability fix */
.hero .pz-hero-pill{
  color: #ffffff !important;
  background: rgba(255,255,255,.22) !important; /* white transparent */
  border: 1px solid rgba(255,255,255,.45) !important;
  padding: 8px 14px !important;
  border-radius: 999px !important;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  text-shadow:
    1px 0 rgba(60,60,60,.35),
   -1px 0 rgba(60,60,60,.35),
    0 1px rgba(60,60,60,.35),
    0 -1px rgba(60,60,60,.35) !important;
  white-space: nowrap;
}



/* ===== FINAL CLEANUP (remove black strip + keep footer stable) ===== */

/* Ensure page background stays light */
body{
  background: linear-gradient(135deg, rgba(255,247,237,1), rgba(239,246,255,1)) !important;
  color:#0f172a !important;
}

/* Header readability */
.topbar{
  background: rgba(243,244,246,.92) !important;
  border-bottom: 1px solid rgba(15,23,42,.08) !important;
}
.topbar .brand span{ color:#111827 !important; }
.nav a{ color:#374151 !important; }
.nav a.active{ background: rgba(59,130,246,.12) !important; color:#111827 !important; }

/* Kill any accidental "band" before footer */
.footer-bar,.footer-bg,.bg-band,.page-divider,.footer-spacer,.pre-footer,.footerBand{
  display:none !important;
  height:0 !important;
  margin:0 !important;
  padding:0 !important;
  background:transparent !important;
}

/* Footer should be normal (not fixed), clean, and consistent */
.footer{
  position: static !important;
  left:auto !important;
  right:auto !important;
  bottom:auto !important;
  width:auto !important;
  background: #ffffff !important;
  border-top: 1px solid rgba(15,23,42,.10) !important;
  box-shadow: none !important;
}

/* Use a flex layout so footer sits at bottom on short pages without freezing */
html, body{ height:100% !important; }
body{
  display:flex !important;
  min-height:100% !important;
  flex-direction:column !important;
}
.main{ flex:1 0 auto !important; }

/* Hero "pills" readable */
.hero .badges .badge,
.hero-features span{
  color:#ffffff !important;
  background: rgba(255,255,255,.22) !important;
  border: 1px solid rgba(255,255,255,.35) !important;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

/* Hero CTA buttons should be white text */
.hero .btn, .hero .btn-ghost{
  color:#ffffff !important;
}

/* Kicker ("Modern Property Operations") readable on light image */
.hero .kicker{
  color:#111827 !important;
  text-shadow:none !important;
  font-weight:700 !important;
  font-size: 15px !important;
}


/* === PZ FIX: remove dark band above footer (body bg showing through footer margin) === */
.footer{ margin-top: 0 !important; }
.main{ padding-bottom: 28px !important; }

/* Ensure page background stays light everywhere */
html, body{
  background: radial-gradient(1200px 700px at 10% -10%, rgba(59,130,246,.10), transparent 60%),
              radial-gradient(900px 600px at 90% 0%, rgba(249,115,22,.12), transparent 55%),
              #fff7ed !important; /* warm off-white */
  color: #0f172a !important;
}

:root{
  --bg:#fff7ed !important;
  --card:#ffffff !important;
  --border: rgba(15,23,42,.10) !important;
  --text:#0f172a !important;
  --muted: rgba(15,23,42,.72) !important;
  --shadow: 0 12px 40px rgba(15,23,42,.12) !important;
}

