/* Healthy Impact private workspace polish — scoped to admin/client hubs only */

.workspace{
  --workspace-navy:#0c2942;
  --workspace-navy-2:#123b5d;
  --workspace-blue:#1d5d91;
  --workspace-gold:#d0a34f;
  --workspace-paper:#f5f8fb;
  --workspace-ink:#173047;
}

/* Private hubs use the exact official Healthy Impact logo.
   The asset itself is transparent; the surrounding brand zone is part of
   the hub layout, sized specifically around the horizontal wordmark. */
.workspace-nav .brand{
  position:relative!important;
  isolation:isolate!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:auto!important;
  min-height:122px!important;
  margin:0 0 22px!important;
  padding:15px 4px 17px!important;
  box-sizing:border-box!important;
  overflow:visible!important;
  border:0!important;
  border-bottom:1px solid rgba(18,52,79,.10)!important;
  text-decoration:none!important;
  background:transparent!important;
  box-shadow:none!important;
}
.workspace-nav .brand::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  z-index:-1!important;
  left:2%!important;
  right:2%!important;
  top:9px!important;
  bottom:14px!important;
  border-radius:50%!important;
  background:transparent!important;
  filter:none!important;
  pointer-events:none!important;
}
.workspace-nav .brand::after{
  content:none!important;
  display:none!important;
}
.workspace-nav .brand-logo{
  position:relative!important;
  z-index:1!important;
  display:block!important;
  content:url("/assets/healthy-impact-logo-readable.webp")!important;
  width:266px!important;
  max-width:100%!important;
  height:auto!important;
  max-height:86px!important;
  object-fit:contain!important;
  object-position:center center!important;
  filter:none!important;
  background:transparent!important;
}

.workspace-nav{
  width:304px!important;
  padding:0 18px 24px!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  background:#fff!important;
  border-right:1px solid rgba(18,52,79,.10)!important;
  box-shadow:16px 0 44px rgba(15,43,66,.06)!important;
}
.workspace-nav-label{
  margin:0 12px 14px!important;
  color:#b8872f!important;
  font-size:9px!important;
  font-weight:700!important;
  letter-spacing:.19em!important;
  text-transform:uppercase!important;
}
.workspace-nav nav{
  gap:5px!important;
}
.workspace-nav nav a{
  min-height:43px!important;
  padding:10px 12px!important;
  border-radius:9px!important;
  border:1px solid transparent!important;
  color:#4f687d!important;
  font-size:11px!important;
  transition:background .16s ease,color .16s ease,transform .16s ease,border-color .16s ease!important;
}
.workspace-nav nav a:hover{
  transform:translateX(2px)!important;
  background:#f1f6fa!important;
  color:#173f67!important;
}
.workspace-nav nav a.active{
  background:linear-gradient(90deg,#eef5fa,#f8fbfd)!important;
  border-color:rgba(23,63,103,.10)!important;
  color:#173f67!important;
  box-shadow:inset 3px 0 0 var(--workspace-gold)!important;
}
.workspace-nav-foot{
  left:28px!important;
  right:28px!important;
  color:#8b99a5!important;
}

.workspace-contact-bar{
  left:304px!important;
  height:74px!important;
  padding:0 clamp(24px,3vw,46px)!important;
  background:rgba(255,255,255,.91)!important;
  border-bottom:1px solid rgba(23,48,71,.08)!important;
  backdrop-filter:blur(18px)!important;
  -webkit-backdrop-filter:blur(18px)!important;
  box-shadow:0 8px 30px rgba(25,53,77,.025)!important;
}
.workspace-contact-bar strong{
  font-size:16px!important;
}
.workspace-contact-bar>div:first-child span{
  font-size:8px!important;
  letter-spacing:.13em!important;
}

.workspace-main{
  margin-left:304px!important;
  padding:114px clamp(38px,4vw,70px) 80px!important;
  max-width:none!important;
  background:
    radial-gradient(circle at 88% 6%,rgba(31,95,146,.12),transparent 30%),
    linear-gradient(180deg,#eaf2f7 0%,#dfeaf2 100%)!important;
}
.workspace-main::before{
  inset:74px 0 0 304px!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.28),transparent 34%),
    radial-gradient(circle at 78% 0%,rgba(208,163,79,.045),transparent 24%)!important;
}

.workspace-head{
  margin-bottom:30px!important;
}
.workspace-head h1{
  font-size:clamp(42px,4vw,56px)!important;
  color:#173047!important;
}
.workspace-head p{
  max-width:760px!important;
  color:#6b7e8c!important;
}
.workspace-head .eyebrow{
  color:#2b628d!important;
}

.workspace-card{
  border-radius:14px!important;
  border-color:rgba(24,57,84,.085)!important;
  box-shadow:0 14px 42px rgba(32,64,88,.045)!important;
  background:rgba(255,255,255,.95)!important;
}
.summary-card{
  border-radius:13px!important;
}
.workspace .table-wrap{
  border-radius:12px!important;
}
.workspace .btn{
  min-height:38px!important;
  padding:9px 14px!important;
  border-radius:9px!important;
}
.workspace .btn-primary,
.workspace .btn.primary{
  background:linear-gradient(180deg,#255f91,#174b76)!important;
  border-color:#174b76!important;
}
.workspace input,
.workspace select,
.workspace textarea{
  border-radius:8px!important;
}

.client-row{
  border-radius:10px!important;
  margin:0 -8px!important;
  padding:16px 10px!important;
}
.client-row:hover{
  padding-left:15px!important;
  padding-right:15px!important;
}

.workspace-preview-strip{
  border-radius:10px!important;
  padding:13px 14px 13px 16px!important;
  background:linear-gradient(90deg,#fffaf0,#fffdf8)!important;
}
.workspace-preview-strip p{
  max-width:720px!important;
  font-size:10px!important;
}
.workspace-preview-strip [data-open-live-admin]{
  background:linear-gradient(180deg,#255f91,#174b76)!important;
  color:#fff!important;
  border-color:#174b76!important;
}
.preview-email-note{
  display:grid!important;
  gap:4px!important;
  margin:0 0 6px!important;
  padding:13px 14px!important;
  border:1px solid rgba(191,143,52,.24)!important;
  border-left:3px solid #c99b45!important;
  border-radius:9px!important;
  background:#fffaf0!important;
  color:#6f6554!important;
}
.preview-email-note strong{
  color:#835f1f!important;
  font-size:10px!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
}
.preview-email-note span{
  font-size:10px!important;
  line-height:1.55!important;
}

.modal{
  border-radius:16px!important;
  box-shadow:0 28px 90px rgba(15,36,54,.18)!important;
}

@media (max-width:980px){
  .workspace-nav{width:252px!important;padding-left:14px!important;padding-right:14px!important}
  .workspace-contact-bar{left:252px!important}
  .workspace-main{margin-left:252px!important}
  .workspace-main::before{left:252px!important}
  .workspace-nav .brand{min-height:104px!important;margin-left:0!important;margin-right:0!important;padding:13px 6px 14px!important;background:transparent!important;box-shadow:none!important}
  .workspace-nav .brand-logo{width:230px!important;max-height:74px!important}
}
@media (max-width:760px){
  .workspace-nav{
    width:100%!important;
    height:auto!important;
    max-height:none!important;
    inset:auto 0 0 0!important;
    padding:7px 8px calc(7px + env(safe-area-inset-bottom))!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
  }
  .workspace-nav .brand,
  .workspace-nav-label,
  .workspace-nav-foot{display:none!important}
  .workspace-nav nav{
    display:flex!important;
    gap:4px!important;
    min-width:max-content!important;
  }
  .workspace-nav nav a{
    min-width:54px!important;
    min-height:50px!important;
    justify-content:center!important;
    padding:8px 10px!important;
  }
  .workspace-nav nav a span{display:none!important}
  .workspace-contact-bar{
    left:0!important;
    height:64px!important;
    padding:0 14px!important;
  }
  .workspace-contact-bar>div:first-child span,
  .workspace-user-email{display:none!important}
  .workspace-main{
    margin-left:0!important;
    padding:88px 14px 92px!important;
  }
  .workspace-main::before{inset:64px 0 0 0!important}
  .workspace-preview-strip{
    align-items:flex-start!important;
    flex-direction:column!important;
  }
  .workspace-preview-strip .button-row{
    width:100%!important;
    flex-wrap:wrap!important;
  }
}

/* Hub context label: the official wordmark now carries the brand identity. */
.workspace-context{
  display:flex!important;
  align-items:center!important;
}
.workspace-contact-bar .workspace-context span{
  color:#6f8190!important;
  font-size:9px!important;
  font-weight:700!important;
  letter-spacing:.16em!important;
  text-transform:uppercase!important;
}

/* Final hub alignment around the official horizontal brand. */
.workspace-contact-bar{
  left:304px!important;
  min-width:0!important;
}
.workspace-context{
  display:flex!important;
  align-items:center!important;
  min-height:100%!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
}
.workspace-context::before,
.workspace-context::after{
  content:none!important;
  display:none!important;
}
.workspace-contact-bar .workspace-context span{
  color:#6f8190!important;
  font-size:9px!important;
  font-weight:700!important;
  letter-spacing:.16em!important;
  text-transform:uppercase!important;
}
@media (max-width:980px){
  .workspace-contact-bar{left:252px!important}
}
@media (max-width:760px){
  .workspace-contact-bar{left:0!important}
}


/* Task controls: preserve full status labels instead of squeezing them into circles. */
.workspace .task-row{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(190px,260px) max-content!important;
  align-items:center!important;
  gap:16px!important;
}
.workspace .task-row>div{
  min-width:0!important;
}
.workspace .task-row select{
  width:100%!important;
  min-width:0!important;
}
.workspace .task-row>.status{
  width:auto!important;
  min-width:76px!important;
  max-width:none!important;
  min-height:32px!important;
  padding:7px 12px!important;
  flex:0 0 auto!important;
  justify-content:center!important;
  white-space:nowrap!important;
  word-break:normal!important;
  overflow:visible!important;
  line-height:1!important;
  text-align:center!important;
}
@media(max-width:760px){
  .workspace .task-row{
    grid-template-columns:minmax(0,1fr) max-content!important;
  }
  .workspace .task-row select{
    grid-column:1/-1!important;
  }
}
@media(max-width:599px){
  .workspace .task-row{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) max-content!important;
    align-items:start!important;
    gap:8px 12px!important;
  }
  .workspace .task-row select{
    grid-column:1/-1!important;
  }
}


/* ===== DESKTOP READABILITY PASS — ADMIN / CLIENT WORKSPACES ===== */
@media (min-width:761px){
  .workspace-nav-label{
    margin:0 12px 15px!important;
    font-size:12px!important;
    line-height:1.2!important;
    font-weight:750!important;
    letter-spacing:.14em!important;
  }

  .workspace-nav nav{
    gap:5px!important;
  }

  .workspace-nav nav a{
    min-height:49px!important;
    padding:11px 13px!important;
    gap:12px!important;
    font-size:14.5px!important;
    line-height:1.25!important;
    font-weight:560!important;
  }

  .workspace-nav nav a svg{
    width:19px!important;
    height:19px!important;
    flex:0 0 19px!important;
  }

  .workspace-nav-foot{
    font-size:10.5px!important;
    line-height:1.4!important;
  }

  .workspace-contact-bar{
    height:78px!important;
  }

  .workspace-contact-bar .workspace-context span,
  .workspace-contact-bar>div:first-child span{
    font-size:12.5px!important;
    line-height:1.25!important;
    font-weight:700!important;
    letter-spacing:.10em!important;
  }

  .workspace-contact-actions{
    gap:20px!important;
  }

  .workspace-contact-actions a,
  .workspace-contact-actions button{
    font-size:14px!important;
    line-height:1.25!important;
    font-weight:600!important;
  }

  .workspace-user-email{
    font-size:12.5px!important;
    line-height:1.25!important;
    font-weight:500!important;
  }
}

@media (min-width:761px) and (max-width:980px){
  .workspace-nav nav a{
    font-size:13.5px!important;
    padding-left:11px!important;
    padding-right:11px!important;
  }
  .workspace-contact-actions a,
  .workspace-contact-actions button{
    font-size:13px!important;
  }
  .workspace-user-email{
    font-size:11.5px!important;
  }
}


/* ===== COMFORT READABILITY PASS — DESKTOP WORKSPACES ===== */
@media (min-width:761px){
  .workspace-head .eyebrow{
    font-size:12px!important;
    line-height:1.25!important;
    font-weight:750!important;
    letter-spacing:.14em!important;
  }

  .workspace-head p{
    max-width:900px!important;
    font-size:15px!important;
    line-height:1.55!important;
    font-weight:450!important;
  }

  .summary-card span{
    font-size:13.5px!important;
    line-height:1.3!important;
    letter-spacing:.07em!important;
  }

  .workspace-nav-label{
    font-size:13px!important;
    letter-spacing:.12em!important;
  }

  .workspace-nav nav a{
    min-height:51px!important;
    font-size:15.5px!important;
    line-height:1.25!important;
    font-weight:570!important;
  }

  .workspace-nav nav a svg{
    width:20px!important;
    height:20px!important;
    flex-basis:20px!important;
  }

  .workspace-contact-bar .workspace-context span,
  .workspace-contact-bar>div:first-child span{
    font-size:13.5px!important;
    line-height:1.25!important;
    letter-spacing:.08em!important;
  }

  .workspace-contact-actions a,
  .workspace-contact-actions button{
    font-size:15px!important;
    line-height:1.25!important;
  }

  .workspace-user-email{
    font-size:13.5px!important;
    line-height:1.25!important;
  }
}


/* ===== FINAL HUB READABILITY PASS ===== */
@media (min-width:761px){
  .workspace-contact-bar{
    height:82px!important;
    padding-left:44px!important;
    padding-right:44px!important;
  }

  .workspace-contact-bar .workspace-context span,
  .workspace-contact-bar>div:first-child span{
    font-size:15px!important;
    line-height:1.25!important;
    font-weight:700!important;
    letter-spacing:.055em!important;
  }

  .workspace-contact-actions{
    gap:24px!important;
  }

  .workspace-contact-actions a,
  .workspace-contact-actions button{
    font-size:16px!important;
    line-height:1.25!important;
    font-weight:600!important;
  }

  .workspace-user-email{
    font-size:14.5px!important;
    line-height:1.3!important;
    font-weight:500!important;
  }

  .workspace-head .eyebrow{
    font-size:13.5px!important;
    line-height:1.25!important;
    letter-spacing:.12em!important;
  }

  .workspace-head p{
    font-size:16px!important;
    line-height:1.55!important;
  }

  .summary-card span{
    font-size:14.5px!important;
    line-height:1.3!important;
    letter-spacing:.055em!important;
  }

  .workspace-nav-label{
    font-size:13.5px!important;
  }

  .workspace-nav nav a{
    font-size:16px!important;
  }
}


/* ===== TARGETED ADMIN TOP-BAR + ACTION-CENTER BALANCE ===== */
@media (min-width:761px){
  .workspace-admin .workspace-context span{
    font-size:17px!important;
    line-height:1.25!important;
    font-weight:700!important;
    letter-spacing:.035em!important;
  }

  .workspace-admin .workspace-user-email{
    font-size:16px!important;
    line-height:1.3!important;
    font-weight:500!important;
  }

  .workspace-admin .action-center-head h1{
    font-size:clamp(36px,3.15vw,46px)!important;
    line-height:1.02!important;
    letter-spacing:-.035em!important;
  }
}