
/* EasyLeasey Dream Dashboard Phase 1
   Dark navy property-manager shell + crisp white dashboard cards.
   Desktop-focused visual foundation; mobile falls back to existing safe header/drawer. */
:root{
  --dream-navy:#001f4d;
  --dream-navy-2:#042b66;
  --dream-blue:#0b66f0;
  --dream-bg:#f4f7fb;
  --dream-card:#ffffff;
  --dream-line:#e8edf5;
  --dream-text:#0f172a;
  --dream-muted:#64748b;
  --dream-green:#15803d;
  --dream-red:#b91c1c;
  --dream-orange:#f97316;
}

@media (min-width: 821px){
  html[data-theme], body.is-auth{
    background:var(--dream-bg) !important;
    color:var(--dream-text) !important;
  }

  body.is-auth .app-shell{
    min-height:100vh !important;
    background:var(--dream-bg) !important;
  }

  body.is-auth .app-topbar{
    position:fixed !important;
    inset:0 auto 0 0 !important;
    width:232px !important;
    height:100vh !important;
    z-index:50 !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    justify-content:flex-start !important;
    gap:14px !important;
    padding:22px 16px !important;
    background:linear-gradient(180deg,var(--dream-navy) 0%,#00183d 100%) !important;
    border:0 !important;
    box-shadow:18px 0 44px rgba(0,20,60,.16) !important;
  }

  body.is-auth .app-brand{
    min-width:0 !important;
    width:100% !important;
    height:auto !important;
    padding:0 4px 14px !important;
    margin:0 !important;
    border-bottom:1px solid rgba(255,255,255,.12) !important;
    display:flex !important;
    justify-content:flex-start !important;
  }

  body.is-auth .app-brand-logo{
    content:url('/assets/img/brand/easyleasey-logo-white.svg?v=20260502b') !important;
    width:168px !important;
    max-height:44px !important;
    object-fit:contain !important;
  }

  body.is-auth .topnav-desktop{
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:7px !important;
    width:100% !important;
    padding-top:3px !important;
    margin:0 !important;
    flex:0 0 auto !important;
  }

  body.is-auth .topnav-desktop .topnav-link,
  body.is-auth .topnav-desktop .dropdown-trigger{
    width:100% !important;
    min-height:36px !important;
    padding:9px 11px !important;
    color:rgba(255,255,255,.88) !important;
    background:transparent !important;
    border:0 !important;
    border-radius:7px !important;
    font-size:13px !important;
    font-weight:700 !important;
    line-height:1.2 !important;
    display:flex !important;
    align-items:center !important;
    gap:9px !important;
    text-decoration:none !important;
  }

  body.is-auth .topnav-desktop .topnav-link:hover,
  body.is-auth .topnav-desktop .topnav-link.active,
  body.is-auth .topnav-desktop .nav-dropdown.is-active > .dropdown-trigger{
    color:#fff !important;
    background:var(--dream-blue) !important;
    box-shadow:0 12px 22px rgba(11,102,240,.26) !important;
  }

  body.is-auth .topnav-desktop .topnav-link::before,
  body.is-auth .topnav-desktop .dropdown-trigger::before{
    display:inline-flex !important;
    width:17px !important;
    min-width:17px !important;
    justify-content:center !important;
    font-size:15px !important;
    opacity:.95 !important;
  }
  body.is-auth .topnav-desktop a[href^="/dashboard"]::before{content:'⌂';}
  body.is-auth .topnav-desktop a[href^="/properties"]::before{content:'▣';}
  body.is-auth .topnav-desktop .dropdown-trigger::before{content:'▤';}
  body.is-auth .topnav-desktop a[href^="/tenants"]::before{content:'♙';}
  body.is-auth .topnav-desktop a[href^="/transactions"]::before{content:'$';}
  body.is-auth .topnav-desktop a[href^="/maintenance"]::before{content:'⚒';}
  body.is-auth .topnav-desktop a[href^="/documents"]::before{content:'▧';}
  body.is-auth .topnav-desktop a[href^="/reports"]::before{content:'▥';}
  body.is-auth .topnav-desktop a[href^="/tasks"]::before{content:'✓';}
  body.is-auth .topnav-desktop a[href^="/help"]::before{content:'?';}

  body.is-auth .nav-dropdown{width:100% !important; position:relative !important;}
  body.is-auth .nav-dropdown summary{list-style:none !important; cursor:pointer !important;}
  body.is-auth .nav-dropdown summary::-webkit-details-marker{display:none !important;}
  body.is-auth .dropdown-menu{
    position:static !important;
    display:flex !important;
    flex-direction:column !important;
    gap:4px !important;
    min-width:0 !important;
    padding:4px 0 4px 26px !important;
    margin:0 !important;
    border:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }
  body.is-auth .nav-dropdown:not([open]):not(.is-active) .dropdown-menu{display:none !important;}
  body.is-auth .dropdown-link{
    color:rgba(255,255,255,.72) !important;
    padding:7px 10px !important;
    border-radius:7px !important;
    font-size:12px !important;
    font-weight:650 !important;
    text-decoration:none !important;
  }
  body.is-auth .dropdown-link:hover,
  body.is-auth .dropdown-link.active{
    color:#fff !important;
    background:rgba(255,255,255,.10) !important;
  }

  body.is-auth .topbar-actions{
    position:fixed !important;
    top:20px !important;
    right:28px !important;
    z-index:45 !important;
    display:flex !important;
    align-items:center !important;
    gap:14px !important;
    margin:0 !important;
  }
  body.is-auth .topbar-actions .topbar-help-btn,
  body.is-auth .topbar-actions .theme-toggle,
  body.is-auth .topbar-actions .burger-btn,
  body.is-auth .topbar-actions form[action="/logout"]{
    display:none !important;
  }
  body.is-auth .userbox{
    border:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    padding:0 !important;
    display:grid !important;
    grid-template-columns:40px auto !important;
    grid-template-rows:auto auto !important;
    column-gap:10px !important;
    align-items:center !important;
  }
  body.is-auth .user-dot{
    grid-row:1 / span 2 !important;
    width:40px !important;
    height:40px !important;
    border-radius:999px !important;
    background:linear-gradient(135deg,#1552cf,#0b66f0) !important;
    box-shadow:0 8px 24px rgba(11,102,240,.24) !important;
    position:relative !important;
  }
  body.is-auth .user-dot::after{
    content:'DU';
    color:#fff;
    font-size:12px;
    font-weight:900;
    position:absolute;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center;
  }
  body.is-auth .user-name{
    color:#0f172a !important;
    font-weight:800 !important;
    font-size:13px !important;
    line-height:1.1 !important;
  }
  body.is-auth .userbox::before{
    content:'Good morning,';
    grid-column:2;
    color:#64748b;
    font-size:11px;
    line-height:1.1;
  }
  body.is-auth .userbox::after{
    content:'Demo User';
    grid-column:2;
    color:#0f172a;
    font-size:13px;
    font-weight:800;
    line-height:1.1;
  }
  body.is-auth .userbox .user-name{display:none !important;}

  body.is-auth .app-main{
    margin-left:232px !important;
    padding:74px 28px 32px !important;
    min-height:100vh !important;
    background:var(--dream-bg) !important;
  }
  body.is-auth .app-container,
  body.is-auth .app-main > .container{
    width:100% !important;
    max-width:1240px !important;
    margin:0 auto !important;
    padding:0 !important;
  }
  body.is-auth .app-footer{display:none !important;}

  body.is-auth .card,
  body.is-auth .dream-card{
    border:1px solid var(--dream-line) !important;
    background:#fff !important;
    border-radius:12px !important;
    box-shadow:0 10px 28px rgba(15,23,42,.06) !important;
  }
}

/* Dashboard-specific look */
.dream-dashboard{font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;color:var(--dream-text);}
.dream-page-title{font-size:22px;font-weight:850;letter-spacing:-.03em;margin:0 0 18px;}
.dream-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px;}
.dream-kpi{grid-column:span 3;padding:18px 18px 16px;min-height:116px;}
.dream-kpi-label{font-size:12px;font-weight:750;color:#334155;margin-bottom:12px;}
.dream-kpi-value{font-size:28px;font-weight:900;letter-spacing:-.04em;line-height:1;color:#0f172a;}
.dream-kpi-value.green{color:var(--dream-green);}.dream-kpi-value.red{color:var(--dream-red);}
.dream-kpi-sub{display:inline-flex;margin-top:12px;color:#0b66f0;font-size:12px;font-weight:750;text-decoration:none;}
.dream-panel{padding:20px;}
.dream-panel h2{font-size:15px;font-weight:900;margin:0 0 18px;letter-spacing:-.02em;}
.dream-chart{grid-column:span 6;min-height:290px;}
.dream-list{grid-column:span 6;min-height:290px;}
.dream-task{grid-column:span 6;min-height:245px;}
.dream-occupancy{grid-column:span 6;min-height:245px;}
.dream-bars{height:208px;display:flex;align-items:flex-end;gap:20px;padding:8px 4px 0;border-bottom:1px solid #dbe3ee;position:relative;}
.dream-bars::before,.dream-bars::after{content:'';position:absolute;left:0;right:0;border-top:1px solid #edf2f7}.dream-bars::before{top:54px}.dream-bars::after{top:112px}
.dream-month{flex:1;min-width:0;display:flex;align-items:flex-end;justify-content:center;gap:5px;height:100%;position:relative;z-index:1;}
.dream-bar{width:14px;border-radius:2px 2px 0 0;min-height:8px;}.dream-bar.income{background:#16a34a}.dream-bar.expense{background:#1d7af3}
.dream-month-label{position:absolute;bottom:-24px;left:50%;transform:translateX(-50%);font-size:11px;color:#64748b;}
.dream-legend{display:flex;justify-content:center;gap:18px;margin-top:34px;font-size:11px;color:#475569;}.dream-legend span::before{content:'';display:inline-block;width:8px;height:8px;border-radius:2px;margin-right:6px}.dream-legend .income::before{background:#16a34a}.dream-legend .expense::before{background:#1d7af3}.dream-legend .occupied::before{background:#0b66f0}.dream-legend .vacant::before{background:#16a34a}.dream-legend .maintenance::before{background:#f59e0b}
.dream-transaction,.dream-task-row{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:start;padding:0 0 14px;margin-bottom:14px;border-bottom:1px solid #eef2f7;}.dream-transaction:last-child,.dream-task-row:last-child{border-bottom:0;margin-bottom:0;padding-bottom:0}.dream-row-title{font-size:13px;font-weight:800;color:#1e293b;line-height:1.2}.dream-row-sub{font-size:12px;color:#64748b;margin-top:3px}.dream-amount{font-size:13px;font-weight:900}.dream-amount.income{color:#15803d}.dream-amount.expense{color:#b91c1c}.dream-view{display:inline-flex;margin-top:2px;color:#0b66f0;font-size:12px;font-weight:800;text-decoration:none}
.dream-priority{font-size:10px;font-weight:800;padding:5px 8px;border-radius:999px}.dream-priority.high{background:#fee2e2;color:#b91c1c}.dream-priority.medium{background:#ffedd5;color:#c2410c}.dream-priority.low{background:#dcfce7;color:#15803d}
.dream-donut-wrap{display:flex;align-items:center;justify-content:center;gap:36px;min-height:150px}.dream-donut{width:138px;height:138px;border-radius:999px;background:conic-gradient(#0b66f0 var(--occ,75%),#16a34a 0 calc(var(--occ,75%) + var(--vac,15%)),#f59e0b 0);display:grid;place-items:center;box-shadow:inset 0 0 0 1px rgba(15,23,42,.04)}.dream-donut-core{width:88px;height:88px;border-radius:999px;background:#fff;display:flex;align-items:center;justify-content:center;flex-direction:column;font-size:11px;color:#64748b;font-weight:700}.dream-donut-core strong{font-size:20px;color:#15803d;line-height:1}.dream-occ-list{min-width:170px}.dream-occ-row{display:flex;justify-content:space-between;gap:24px;font-size:13px;margin:10px 0;color:#334155}.dream-occ-row strong{font-weight:900;color:#0f172a}
.dream-empty{color:#64748b;font-size:13px;background:#f8fafc;border:1px dashed #dbe3ee;border-radius:10px;padding:14px;}
@media (max-width: 820px){.dream-grid{grid-template-columns:1fr;gap:12px}.dream-kpi,.dream-chart,.dream-list,.dream-task,.dream-occupancy{grid-column:span 1}.dream-page-title{font-size:21px}.dream-bars{gap:10px}.dream-donut-wrap{flex-direction:column;gap:16px}.dream-panel{padding:16px}}

/* Phase 1 sidebar polish: fixed direct menu items, reliable links, cleaner icons. */
@media (min-width: 821px){
  body.is-auth .topnav-desktop{
    overflow-y:auto !important;
    overflow-x:hidden !important;
    scrollbar-width:thin;
    padding-bottom:18px !important;
  }
  body.is-auth .topnav-desktop .topnav-link{
    position:relative !important;
    justify-content:flex-start !important;
    min-height:38px !important;
    padding:10px 11px !important;
    gap:10px !important;
    white-space:nowrap !important;
  }
  body.is-auth .topnav-desktop .topnav-link::before{
    font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:18px !important;
    min-width:18px !important;
    height:18px !important;
    font-size:15px !important;
    line-height:1 !important;
    color:inherit !important;
    opacity:.96 !important;
  }
  body.is-auth .topnav-desktop .topnav-label{
    display:block !important;
    min-width:0 !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
  }
  body.is-auth .topnav-desktop .topnav-link[data-nav-key="dashboard"]::before{content:'⌂' !important;}
  body.is-auth .topnav-desktop .topnav-link[data-nav-key="properties"]::before{content:'▧' !important;}
  body.is-auth .topnav-desktop .topnav-link[data-nav-key="leasing"]::before{content:'▤' !important;}
  body.is-auth .topnav-desktop .topnav-link[data-nav-key="leases"]::before{content:'□' !important;}
  body.is-auth .topnav-desktop .topnav-link[data-nav-key="tenants"]::before{content:'♙' !important;}
  body.is-auth .topnav-desktop .topnav-link[data-nav-key="transactions"]::before{content:'$' !important;}
  body.is-auth .topnav-desktop .topnav-link[data-nav-key="maintenance"]::before{content:'⚒' !important;}
  body.is-auth .topnav-desktop .topnav-link[data-nav-key="documents"]::before{content:'▣' !important;}
  body.is-auth .topnav-desktop .topnav-link[data-nav-key="reports"]::before{content:'▥' !important;}
  body.is-auth .topnav-desktop .topnav-link[data-nav-key="tasks"]::before{content:'✓' !important;}
  body.is-auth .topnav-desktop .topnav-link[data-nav-key="settings"]::before{content:'⚙' !important;}
  body.is-auth .topnav-desktop .topnav-link[data-nav-key="help"]::before{content:'?' !important;}
  body.is-auth .topnav-desktop .topnav-link[data-nav-key="users"]::before{content:'◉' !important;}
  body.is-auth .topnav-desktop .topnav-link[data-nav-key="invites"]::before{content:'+' !important;}
  body.is-auth .topnav-desktop .topnav-link[data-nav-key="demo"]::before{content:'◇' !important;}
  body.is-auth .topnav-desktop .topnav-link[data-nav-key="billing"]::before{content:'$' !important;}

  body.is-auth .sidebar-nav-section{
    margin:12px 6px 3px !important;
    padding-top:12px !important;
    border-top:1px solid rgba(255,255,255,.12) !important;
    color:rgba(255,255,255,.48) !important;
    font-size:10px !important;
    font-weight:900 !important;
    letter-spacing:.09em !important;
    text-transform:uppercase !important;
  }

  body.is-auth .user-dot::after{
    content:attr(data-initial) !important;
  }
  body.is-auth .userbox::after{
    content:attr(title) !important;
    max-width:150px !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
  }
}

/* Logout visibility polish: desktop dream sidebar + top-right quick action. */
@media (min-width: 821px){
  body.is-auth .app-topbar{
    padding-bottom:16px !important;
  }

  body.is-auth .topnav-desktop{
    flex:0 0 auto !important;
  }

  body.is-auth .dream-sidebar-account{
    margin-top:auto !important;
    padding-top:14px !important;
    border-top:1px solid rgba(255,255,255,.12) !important;
    display:flex !important;
    flex-direction:column !important;
    gap:10px !important;
  }

  body.is-auth .dream-sidebar-profile{
    display:flex !important;
    align-items:center !important;
    gap:10px !important;
    padding:10px 9px !important;
    border-radius:10px !important;
    text-decoration:none !important;
    background:rgba(255,255,255,.07) !important;
    border:1px solid rgba(255,255,255,.10) !important;
  }

  body.is-auth .dream-sidebar-profile:hover{
    background:rgba(255,255,255,.11) !important;
  }

  body.is-auth .dream-sidebar-avatar{
    width:34px !important;
    height:34px !important;
    min-width:34px !important;
    border-radius:999px !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    font-size:12px !important;
    font-weight:900 !important;
    color:#fff !important;
    background:linear-gradient(135deg,#0b66f0,#3b82f6) !important;
    box-shadow:0 8px 18px rgba(11,102,240,.28) !important;
  }

  body.is-auth .dream-sidebar-user{
    min-width:0 !important;
    display:flex !important;
    flex-direction:column !important;
    gap:2px !important;
  }

  body.is-auth .dream-sidebar-name{
    color:#fff !important;
    font-size:12px !important;
    line-height:1.15 !important;
    font-weight:850 !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    max-width:142px !important;
  }

  body.is-auth .dream-sidebar-role{
    color:rgba(255,255,255,.62) !important;
    font-size:11px !important;
    line-height:1.15 !important;
    font-weight:650 !important;
  }

  body.is-auth .dream-sidebar-logout-form{
    margin:0 !important;
    padding:0 !important;
    display:block !important;
  }

  body.is-auth .dream-sidebar-logout{
    width:100% !important;
    min-height:38px !important;
    padding:9px 11px !important;
    border-radius:9px !important;
    border:1px solid rgba(255,255,255,.12) !important;
    background:rgba(255,255,255,.06) !important;
    color:rgba(255,255,255,.90) !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:9px !important;
    font-size:13px !important;
    font-weight:800 !important;
    cursor:pointer !important;
  }

  body.is-auth .dream-sidebar-logout:hover{
    color:#fff !important;
    background:rgba(239,68,68,.22) !important;
    border-color:rgba(248,113,113,.34) !important;
  }

  body.is-auth .topbar-actions .topbar-logout-icon-form{
    display:inline-flex !important;
    margin:0 !important;
    padding:0 !important;
  }

  body.is-auth .topbar-logout-icon-btn{
    width:36px !important;
    height:36px !important;
    border-radius:999px !important;
    border:1px solid #e8edf5 !important;
    background:#fff !important;
    color:#334155 !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    cursor:pointer !important;
    box-shadow:0 10px 24px rgba(15,23,42,.06) !important;
    font-size:15px !important;
  }

  body.is-auth .topbar-logout-icon-btn:hover{
    color:#b91c1c !important;
    border-color:#fecaca !important;
    background:#fff5f5 !important;
  }

  body.is-auth .user-dot::after{
    content:attr(data-initial) !important;
  }

  body.is-auth .userbox::after{
    content:attr(data-display-name) !important;
  }
}

@media (max-width: 820px){
  body.is-auth .dream-sidebar-account{
    display:none !important;
  }
}
@media (min-width: 821px){
  body.is-auth .topbar-actions form.topbar-logout-icon-form[action="/logout"]{
    display:inline-flex !important;
  }
}
