/* =====================================================
   NEST IN DASHBOARD ALIGNMENT V4
   Layout/alignment only
   ===================================================== */

/* Consistent page width */
#dashboardView.dcc-dashboard{
  width:100%;
  max-width:1480px;
  margin:0 auto!important;
  padding:22px 24px 34px!important;
  box-sizing:border-box;
}


/* =====================================================
   HERO
   Title on left / property selector on right
   ===================================================== */

#dashboardView.dcc-dashboard .ops-home-hero{
  width:100%;
  min-height:170px!important;

  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(300px,390px)!important;

  align-items:end!important;
  gap:38px!important;

  padding:30px 40px!important;
  margin:0 0 24px!important;

  box-sizing:border-box;
}

#dashboardView .ops-home-copy{
  min-width:0;
  align-self:center;
}

#dashboardView .ops-home-copy h1{
  margin:6px 0 10px!important;
  line-height:1.05!important;
}

#dashboardView .ops-home-copy p{
  margin:0!important;
  max-width:650px!important;
  line-height:1.55!important;
}

#dashboardView .ops-home-tools{
  width:100%!important;
  min-width:0!important;
  align-self:center;
}

#dashboardView .ops-home-tools label{
  display:block!important;
  margin:0 0 8px!important;
}

#dashboardView .ops-home-tools select{
  width:100%!important;
  min-width:0!important;
  height:52px!important;
}


/* =====================================================
   COMMAND CENTER HEADING
   ===================================================== */

#dashboardView .dcc-command-bar{
  width:100%;

  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:space-between!important;

  gap:24px!important;

  margin:0 0 18px!important;
}

#dashboardView .dcc-command-copy{
  min-width:0;
}

#dashboardView .dcc-command-copy strong{
  margin:0!important;
  font-size:22px!important;
  line-height:1.25!important;
}

#dashboardView .dcc-command-copy span{
  margin-top:5px!important;
  line-height:1.45!important;
}

#dashboardView .dcc-status{
  flex:0 0 auto;
  margin:0!important;
  white-space:nowrap;
}


/* =====================================================
   QUICK OPERATIONS
   ===================================================== */

#dashboardView.dcc-dashboard .dcc-quick-actions{
  width:100%!important;

  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;

  gap:14px!important;
  margin:0 0 22px!important;
}


/* Every action card same size/alignment */

#dashboardView.dcc-dashboard .dcc-quick-actions > *{
  width:100%!important;
  min-width:0!important;
  min-height:96px!important;

  display:grid!important;
  grid-template-columns:56px minmax(0,1fr)!important;

  align-items:center!important;
  justify-content:start!important;

  column-gap:15px!important;

  padding:16px 18px!important;
  margin:0!important;

  text-align:left!important;
  box-sizing:border-box!important;
}


/* Icon container */
#dashboardView.dcc-dashboard .dcc-quick-actions > * > :first-child{
  justify-self:center;
  align-self:center;
}


/* Text column */
#dashboardView.dcc-dashboard .dcc-quick-actions > * > :last-child{
  min-width:0;
  align-self:center;
}


/* Action titles */
#dashboardView.dcc-dashboard .dcc-quick-actions strong{
  display:block;
  margin:0 0 4px!important;
  line-height:1.2!important;
}


/* Action descriptions */
#dashboardView.dcc-dashboard .dcc-quick-actions p,
#dashboardView.dcc-dashboard .dcc-quick-actions small,
#dashboardView.dcc-dashboard .dcc-quick-actions span{
  line-height:1.35!important;
}


/* =====================================================
   KPI / STAT CARDS
   ===================================================== */

#dashboardView .ops-stats{
  width:100%!important;

  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;

  gap:14px!important;

  margin:0 0 20px!important;
}

#dashboardView .ops-stat-card{
  min-width:0!important;
  min-height:116px!important;

  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;

  padding:18px 20px!important;

  box-sizing:border-box;
}


/* =====================================================
   LOWER DASHBOARD
   ===================================================== */

#dashboardView.dcc-dashboard .ops-home-grid{
  width:100%!important;

  display:grid!important;
  grid-template-columns:minmax(0,1.65fr) minmax(310px,.75fr)!important;

  align-items:start!important;

  gap:18px!important;
  margin:0!important;
}

#dashboardView .ops-card{
  width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
}

#dashboardView .ops-card-head{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;

  gap:16px!important;
}


/* =====================================================
   TABLE / PROPERTY ROW ALIGNMENT
   ===================================================== */

#dashboardView table{
  width:100%!important;
}

#dashboardView th,
#dashboardView td{
  vertical-align:middle!important;
}


/* =====================================================
   RESPONSIVE
   ===================================================== */

@media(max-width:1100px){

  #dashboardView.dcc-dashboard{
    padding:18px!important;
  }

  #dashboardView.dcc-dashboard .ops-home-hero{
    grid-template-columns:minmax(0,1fr) minmax(260px,340px)!important;
    gap:24px!important;
    padding:28px 30px!important;
  }

  #dashboardView .ops-stats{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  #dashboardView.dcc-dashboard .ops-home-grid{
    grid-template-columns:1fr!important;
  }
}


@media(max-width:780px){

  #dashboardView.dcc-dashboard{
    padding:14px!important;
  }

  #dashboardView.dcc-dashboard .ops-home-hero{
    grid-template-columns:1fr!important;
    align-items:start!important;

    gap:22px!important;

    padding:25px 24px!important;
  }

  #dashboardView .ops-home-tools{
    max-width:none!important;
  }

  #dashboardView .dcc-command-bar{
    align-items:flex-start!important;
    flex-direction:column!important;
    gap:12px!important;
  }

  #dashboardView.dcc-dashboard .dcc-quick-actions{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}


@media(max-width:520px){

  #dashboardView.dcc-dashboard .dcc-quick-actions{
    grid-template-columns:1fr!important;
  }

  #dashboardView .ops-stats{
    grid-template-columns:1fr!important;
  }

  #dashboardView.dcc-dashboard .ops-home-hero{
    padding:22px 20px!important;
    border-radius:18px!important;
  }
}
