/* Global visual refresh for Desa CRM — desktop + mobile */
:root{
  --modern-bg:#f6f8fa;
  --modern-card:#ffffff;
  --modern-line:#e6ebef;
  --modern-ink:#20272c;
  --modern-muted:#75838b;
  --modern-accent:#c3aa94;
  --modern-dark:#383838;
  --modern-shadow:0 8px 24px rgba(25,35,42,.055);
  --modern-shadow-hover:0 14px 34px rgba(25,35,42,.085);
}
html,body{background:var(--modern-bg)!important}
.app{background:linear-gradient(180deg,#f8fafb 0%,#f4f7f9 100%)!important}
.desktop-main{background:transparent!important}
.topbar{background:linear-gradient(180deg,rgba(246,248,250,.96),rgba(246,248,250,.86),rgba(246,248,250,0))!important}
.search,.profile,.panel,.calendarbox,.property,.setting,.sheet,.client-section,.settings-card,.lead-stat,.mini-kpi,.kpi{
  border-color:var(--modern-line)!important;
  box-shadow:var(--modern-shadow)!important;
}
.panel,.calendarbox,.property,.setting,.sheet,.client-section,.settings-card,.lead-stat,.mini-kpi,.kpi{
  background:rgba(255,255,255,.96)!important;
}
.panel,.calendarbox,.client-section,.settings-card,.property{border-radius:14px!important}
.kpi,.lead-stat,.mini-kpi{border-radius:12px!important}
.kpi{transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.kpi:hover{transform:translateY(-2px);box-shadow:var(--modern-shadow-hover)!important;border-color:#dbe2e7!important}
.page-head h2,.pipeline-head h2,.settings-header h2{letter-spacing:-.035em!important;color:var(--modern-ink)!important}
.page-head p,.pipeline-head p,.settings-header p{color:var(--modern-muted)!important}
.section-eyebrow{letter-spacing:.12em!important;color:#829099!important}
.btn,.toolbar select,.search,.profile{border-radius:10px!important}
.btn{box-shadow:none!important}
.btn.primary{background:var(--modern-dark)!important;color:#fff!important;border-color:var(--modern-dark)!important}
.btn.primary:hover{background:#2f2f2f!important}
.status,.muted-tag,.note-pill,.pipeline-chip,.score-badge,.delta{border-radius:999px!important}
.table-card{border-radius:14px!important;overflow:hidden!important}
.table thead th{background:#f7f9fa!important;color:#829098!important}
.table tbody tr{transition:background .15s ease}
.table tbody tr:hover{background:#f8fafb!important}
.pipeline-stage{background:#f4f6f8!important;border-color:#e4e9ed!important;border-radius:14px!important}
.pipeline-stage-head{background:transparent!important}
.pipeline-card{border-radius:12px!important;box-shadow:0 2px 8px rgba(25,35,42,.04)!important;border-color:#e5eaee!important}
.pipeline-card:hover{box-shadow:0 8px 18px rgba(25,35,42,.07)!important;transform:translateY(-1px)}
.dashboard-priority-item{padding:13px 0!important}
.dashboard-stage-track{height:7px!important}
.dashboard-stage-fill{background:linear-gradient(90deg,#627f89,#8ca2aa)!important}
.settings-row-icon{border-radius:10px!important;background:#f2f5f6!important;border:1px solid #e6ebee!important}
.integration-status{border-radius:999px!important}

/* Property catalogue */
#properties .property-grid{gap:16px!important}
#properties .property{position:relative;overflow:hidden!important;background:#fff!important;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
#properties .property:hover{transform:translateY(-3px);box-shadow:var(--modern-shadow-hover)!important;border-color:#dce3e8!important}
#properties .property-img{height:190px!important;position:relative}
#properties .property-img:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(20,23,24,.18));pointer-events:none}
#properties .property-body{padding:15px!important}
#properties .property-body b{font-size:15px!important;line-height:1.25!important;color:#22292e!important}
#properties .property-body p{font-size:11px!important;color:#7a8991!important;line-height:1.5!important;margin:7px 0 12px!important}
#properties .property-body strong{font-size:19px!important;color:#22292e!important}
#properties .property-body .btn{margin-top:12px!important;width:100%!important;background:#f8fafb!important;border-color:#e3e9ed!important}

@media(max-width:800px){
  .desktop-main{background:transparent!important}
  .panel,.calendarbox,.client-section,.settings-card,.property{border-radius:14px!important}
  .kpi,.lead-stat,.mini-kpi{border-radius:12px!important}
  #properties .property-img{height:130px!important}
  #properties .property-body{padding:11px!important}
  #properties .property-body b{font-size:12px!important}
  #properties .property-body strong{font-size:16px!important}
}
