/* PropertyPulse — Professional CRM UI */
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0;height:100%}
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;background:#f1f5f9;color:#0f172a;font-size:14px;line-height:1.5}

/* Layout with sidebar */
body.has-sidebar .pp-shell{margin-left:220px;transition:margin-left .2s}
body.has-sidebar.sidebar-collapsed .pp-shell{margin-left:64px}
.pp-shell{min-height:100vh;display:flex;flex-direction:column}

/* === SIDEBAR === */
.pp-sidebar{position:fixed;left:0;top:0;bottom:0;width:220px;background:#0f172a;color:#cbd5e1;display:flex;flex-direction:column;z-index:100;transition:width .2s ease}
body.sidebar-collapsed .pp-sidebar{width:64px}
body.sidebar-collapsed .pp-lbl,body.sidebar-collapsed .pp-brand-text,body.sidebar-collapsed .pp-group summary,body.sidebar-collapsed .pp-user-meta,body.sidebar-collapsed .pp-sidebar .pp-inline-form,body.sidebar-collapsed .pp-nav-badge{display:none}
body.sidebar-collapsed .pp-nav-item{justify-content:center;padding:10px 0}
.pp-sidebar-head{display:flex;align-items:center;justify-content:space-between;padding:14px 14px;border-bottom:0.5px solid rgba(255,255,255,.08)}
.pp-brand{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none;font-weight:500}
.pp-logo{background:#f59e0b;color:#0f172a;width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:13px;flex-shrink:0}
.pp-brand-text{font-size:14px}
.pp-brand-sub{font-size:11px;color:#64748b;display:block}
.pp-sidebar-toggle{background:transparent;border:0;color:rgba(255,255,255,.6);font-size:16px;cursor:pointer;padding:4px 6px;border-radius:4px}
.pp-sidebar-toggle:hover{background:rgba(255,255,255,.1);color:#fff}
.pp-sidebar-nav{flex:1;overflow-y:auto;padding:10px 8px;font-size:12.5px}
.pp-nav-item{display:flex;align-items:center;gap:10px;padding:7px 10px;color:rgba(255,255,255,.85);text-decoration:none;border-radius:6px;margin:1px 0}
.pp-nav-item:hover{background:rgba(255,255,255,.08);color:#fff}
.pp-nav-item.active{background:#1e40af;color:#fff}
.pp-nav-item .pp-lbl{flex:1}
.pp-nav-badge{background:#dc2626;color:#fff;font-size:10px;padding:1px 6px;border-radius:8px}
.pp-nav-badge.warn{background:#f59e0b;color:#0f172a}
.pp-ico{font-size:14px;width:18px;text-align:center;flex-shrink:0}
.pp-group{margin:6px 0}
.pp-group summary{padding:8px 10px 4px;cursor:pointer;color:#64748b;font-size:10px;text-transform:uppercase;letter-spacing:.8px;font-weight:500;list-style:none;user-select:none}
.pp-group summary::-webkit-details-marker{display:none}
.pp-group summary::before{content:'▸ ';font-size:9px;display:inline-block;transition:transform .15s}
.pp-group[open] summary::before{transform:rotate(90deg)}
.pp-group summary:hover{color:#fff}
.pp-sidebar-foot{border-top:0.5px solid rgba(255,255,255,.08);padding:10px}
.pp-user-chip{display:flex;align-items:center;gap:10px;padding:6px;margin-bottom:6px}
.pp-user-avatar{width:30px;height:30px;border-radius:50%;background:#1e40af;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:500;font-size:12px;flex-shrink:0}
.pp-user-meta{flex:1;min-width:0;line-height:1.2}
.pp-user-meta strong{display:block;color:#fff;font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pp-user-meta small{color:#64748b;font-size:10px}

/* === TOPBAR === */
.pp-topbar{background:#fff;border-bottom:0.5px solid #e2e8f0;padding:0 20px;height:58px;display:flex;align-items:center;gap:16px;box-shadow:0 1px 3px rgba(15,23,42,.04);position:sticky;top:0;z-index:50}
.pp-topbar-title{flex:1;min-width:0}
.pp-breadcrumb{font-size:11px;color:#64748b;margin-bottom:2px}
.pp-breadcrumb strong{color:#0f172a;font-weight:500}
.pp-topbar-title h1,.pp-topbar h1{font-size:16px;font-weight:500;margin:0}
.pp-topbar-search{position:relative;width:300px}
.pp-topbar-search input{width:100%;border:0.5px solid #e2e8f0;background:#f8fafc;border-radius:6px;padding:7px 10px 7px 32px;font-size:12.5px;font-family:inherit}
.pp-topbar-search input:focus{outline:none;border-color:#1e40af;background:#fff}
.pp-topbar-search .pp-search-ico{position:absolute;left:10px;top:7px;color:#94a3b8;font-size:13px}
.pp-topbar-search .pp-kbd{position:absolute;right:8px;top:6px;background:#e2e8f0;color:#64748b;font-size:10px;padding:2px 6px;border-radius:4px;font-family:Menlo,monospace}
.pp-topbar-actions{display:flex;align-items:center;gap:4px}
.pp-icon-btn{background:transparent;border:0;padding:8px;cursor:pointer;font-size:15px;border-radius:6px;color:#475569;position:relative}
.pp-icon-btn:hover{background:#f1f5f9}
.pp-dot-red{position:absolute;top:4px;right:4px;width:8px;height:8px;background:#dc2626;border-radius:50%;border:1.5px solid #fff}
.pp-topbar-divider{width:1px;height:24px;background:#e2e8f0;margin:0 4px}
.pp-topbar-user{display:flex;align-items:center;gap:8px;padding:4px 8px;border-radius:6px;cursor:pointer}
.pp-topbar-user:hover{background:#f1f5f9}
.pp-topbar-user .pp-user-avatar{width:28px;height:28px;font-size:11px}

/* === PAGE HEAD (breadcrumb + title + actions per page) === */
.pp-page-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:18px;flex-wrap:wrap}
.pp-page-head h1{font-size:22px;font-weight:500;margin:2px 0 0}
.pp-page-head .pp-breadcrumb{font-size:11px;color:#64748b}
.pp-page-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}

/* === MAIN === */
.pp-main{padding:18px 24px;flex:1}

/* === CARDS WITH SHADOW === */
.pp-card{background:#fff;border-radius:10px;padding:16px 18px;box-shadow:0 1px 3px rgba(15,23,42,.08),0 1px 2px rgba(15,23,42,.04);margin-bottom:14px}
.pp-card-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.pp-card-head h2,.pp-card-head h3{margin:0;font-size:14px;font-weight:500}

/* === METRIC CARDS === */
.pp-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin-bottom:16px}
.pp-metric{background:#fff;border-radius:8px;padding:13px 14px;box-shadow:0 1px 3px rgba(15,23,42,.08),0 1px 2px rgba(15,23,42,.04)}
.pp-metric-label{font-size:10px;color:#64748b;text-transform:uppercase;letter-spacing:.5px}
.pp-metric-value{font-size:22px;font-weight:500;margin:3px 0 2px}
.pp-metric-delta{font-size:10.5px}
.pp-metric-delta.up{color:#0f6e56}
.pp-metric-delta.down{color:#dc2626}

/* === BANNER (welcome / info strip) === */
.pp-banner{background:linear-gradient(90deg,#1e3a8a 0%,#1e40af 100%);color:#fff;border-radius:10px;padding:14px 18px;margin-bottom:16px;display:flex;justify-content:space-between;align-items:center;box-shadow:0 4px 12px rgba(30,58,138,.18),0 1px 3px rgba(15,23,42,.1);gap:16px;flex-wrap:wrap}
.pp-banner-title{font-size:15px;font-weight:500}
.pp-banner-sub{font-size:13px;opacity:.85}

/* === TABLES === */
.pp-table{width:100%;border-collapse:collapse;font-size:13px}
.pp-table thead th{text-align:left;padding:10px 8px;border-bottom:0.5px solid #e2e8f0;color:#64748b;font-size:10.5px;text-transform:uppercase;letter-spacing:.5px;font-weight:500;background:#f8fafc}
.pp-table tbody td{padding:10px 8px;border-bottom:0.5px solid #f1f5f9}
.pp-table tbody tr:hover{background:#f8fafc}

/* === PILLS === */
.pp-pill{display:inline-block;font-size:11px;padding:2px 8px;border-radius:10px;font-weight:500}
.pp-pill-new,.pp-pill-info{background:#E6F1FB;color:#0C447C}
.pp-pill-contacted,.pp-pill-purple{background:#EEEDFE;color:#3C3489}
.pp-pill-qualified,.pp-pill-success{background:#E1F5EE;color:#085041}
.pp-pill-viewing,.pp-pill-scheduled,.pp-pill-warning{background:#FAEEDA;color:#633806}
.pp-pill-negotiating,.pp-pill-danger{background:#FAECE7;color:#712B13}
.pp-pill-completed{background:#E1F5EE;color:#085041}
.pp-pill-cancelled{background:#f1f5f9;color:#475569}

/* === BUTTONS === */
.pp-btn{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:6px;font-size:12.5px;font-weight:500;cursor:pointer;border:0.5px solid transparent;text-decoration:none;background:transparent;color:inherit;font-family:inherit;transition:all .1s}
.pp-btn-primary{background:#1e40af;color:#fff;border-color:#1e40af}
.pp-btn-primary:hover{background:#1e3a8a}
.pp-btn-ghost{background:#fff;border-color:#e2e8f0;color:#334155}
.pp-btn-ghost:hover{background:#f1f5f9}
.pp-btn-ghost.active{background:#eff6ff;border-color:#1e40af;color:#1e3a8a}
.pp-btn-block{display:block;width:100%;text-align:center;justify-content:center}
.pp-btn-sm{padding:4px 10px;font-size:11.5px}

/* === FORMS === */
.pp-input,.pp-select,.pp-textarea{width:100%;padding:8px 12px;border:0.5px solid #e2e8f0;border-radius:6px;font-size:13px;font-family:inherit;background:#fff}
.pp-input:focus,.pp-select:focus,.pp-textarea:focus{outline:none;border-color:#1e40af;box-shadow:0 0 0 3px rgba(30,64,175,.1)}
.pp-field{margin-bottom:12px}
.pp-field label{display:block;font-size:12px;font-weight:500;margin-bottom:4px;color:#475569}
.pp-check label{display:flex;align-items:center;gap:8px;cursor:pointer}
.pp-inline-form{display:inline}

/* === UTILITIES === */
.pp-muted{color:#64748b}
.pp-link{color:#1e40af;text-decoration:none}
.pp-link:hover{text-decoration:underline}
.pp-grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.pp-grid-2{grid-template-columns:1.5fr 1fr}
.pp-grid-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}
@@media (max-width:900px){.pp-grid-2{grid-template-columns:1fr}}

/* === EMPTY STATE === */
.pp-empty{text-align:center;padding:40px 20px;color:#64748b}
.pp-empty-icon{font-size:40px;margin-bottom:8px}
.pp-empty h3{font-size:16px;color:#334155;margin:0 0 6px}

/* === TEAM / MEMBER CARD === */
.pp-member-card{display:flex;gap:12px;align-items:flex-start;text-decoration:none;color:inherit;transition:transform .1s,box-shadow .1s}
.pp-member-card:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(15,23,42,.1),0 1px 3px rgba(15,23,42,.06)}
.pp-member-avatar{width:44px;height:44px;border-radius:50%;background:#1e40af;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:500;font-size:15px;flex-shrink:0}
.pp-member-body{flex:1;min-width:0}
.pp-member-body strong{display:block;color:#0f172a}
.pp-member-body small{display:block;color:#64748b;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* === AI SUGGESTION STRIPS === */
.pp-ai-list{display:flex;flex-direction:column;gap:8px}
.pp-ai-item{padding:8px 10px;border-radius:0 6px 6px 0;font-size:12px}
.pp-ai-item strong{display:block;margin-bottom:2px}
.pp-ai-urgent{border-left:3px solid #dc2626;background:#fef2f2}.pp-ai-urgent strong{color:#991b1b}
.pp-ai-warning{border-left:3px solid #f59e0b;background:#fef3c7}.pp-ai-warning strong{color:#78350f}
.pp-ai-info{border-left:3px solid #1e40af;background:#eff6ff}.pp-ai-info strong{color:#1e3a8a}
.pp-ai-success{border-left:3px solid #0f6e56;background:#f0fdf4}.pp-ai-success strong{color:#065f46}

/* === FOOTER === */
.pp-footer{background:#fff;border-top:0.5px solid #e2e8f0;padding:10px 24px;text-align:center;color:#64748b;font-size:11px}
.pp-footer strong{color:#1e3a8a}

/* === LOGIN === */
.pp-login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px;background:linear-gradient(135deg,#1e3a8a 0%,#0ea5e9 100%)}
.pp-login-box{background:#fff;border-radius:14px;box-shadow:0 20px 60px rgba(0,0,0,.25),0 4px 12px rgba(0,0,0,.08);max-width:920px;width:100%;display:grid;grid-template-columns:1fr 1fr;overflow:hidden}
.pp-login-left{padding:40px}
.pp-login-right{background:#f8fafc;padding:30px;border-left:0.5px solid #e2e8f0}
@@media (max-width:760px){.pp-login-box{grid-template-columns:1fr}.pp-login-right{border-left:0;border-top:0.5px solid #e2e8f0}}
