
/* ==========================================================================
   Shared Daily Rhythm styling. The same markup renders inside My Rhythm and
   inside Life Vault's Diary & Planner, so it is styled once here rather than
   twice — that is what stops the two views drifting apart.
   Class names avoid the -card / -tile / -tag / -pill / -badge suffix traps.
   ========================================================================== */
.hab-sum{
  display:flex; align-items:center; gap:12px; flex-wrap:wrap;
  background:#F5F9F3 !important; border:1px solid #DCE7D7 !important;
  border-radius:16px; padding:12px 16px; margin:0 0 14px;
}
.hab-sum-t{ font-size:.92rem; font-weight:800; color:#243447 !important; -webkit-text-fill-color:#243447 !important; }
.hab-sum-p{ font-size:.86rem; font-weight:800; color:#4E6640 !important; -webkit-text-fill-color:#4E6640 !important; }
.hab-sum-bar{ flex:1 1 120px; min-width:100px; height:8px; border-radius:99px; background:#E4EDE0 !important; overflow:hidden; }
.hab-sum-fill{ display:block; height:100%; border-radius:99px; background:#7D9E77 !important; background-image:none !important; }

.hab-grp{ margin:0 0 16px; }
.hab-gh{
  display:flex; align-items:baseline; justify-content:space-between; gap:10px;
  font-family:'Nunito',system-ui,sans-serif !important;
  font-size:.74rem !important; font-weight:800 !important; letter-spacing:.14em; text-transform:uppercase;
  margin:0 0 8px !important; color:#5E6A54 !important; -webkit-text-fill-color:#5E6A54 !important;
}
.hab-gc{ letter-spacing:0; text-transform:none; font-size:.78rem; font-weight:700;
  color:#5F6773 !important; -webkit-text-fill-color:#5F6773 !important; }

.hab-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; }
.hab-row{
  display:flex; align-items:center; gap:12px;
  background:#fff !important; border:1px solid #E4E9E0 !important; border-radius:14px;
  padding:10px 14px; min-height:56px;
}
.hab-row.is-done{ background:#F6FAF4 !important; border-color:#DCE7D7 !important; }
.hab-tick{
  flex:none; width:44px; height:44px; min-height:44px; border-radius:50%; cursor:pointer;
  background:#fff !important; border:2px solid #C6D2BF !important; font:inherit; font-size:1rem; font-weight:800;
  color:#4E6640 !important; -webkit-text-fill-color:#4E6640 !important;
}
.hab-row.is-done .hab-tick{ background:#5F7350 !important; border-color:#5F7350 !important;
  color:#fff !important; -webkit-text-fill-color:#fff !important; }
.hab-tick:focus-visible, .hab-plus:focus-visible{ outline:3px solid #CF9E3F; outline-offset:2px; }
.hab-body{ flex:1; min-width:0; display:flex; flex-direction:column; gap:3px; }
.hab-n{ font-size:.95rem; font-weight:700; color:#243447 !important; -webkit-text-fill-color:#243447 !important; }
.hab-row.is-done .hab-n{ color:#3F5136 !important; -webkit-text-fill-color:#3F5136 !important; }
.hab-m{ font-size:.79rem; color:#5A6472 !important; -webkit-text-fill-color:#5A6472 !important; }
.hab-bar{ display:block; height:6px; border-radius:99px; background:#EDF1EA !important; overflow:hidden; margin:3px 0 0; }
.hab-fill{ display:block; height:100%; border-radius:99px; background:#7D9E77 !important; background-image:none !important; }
.hab-who{
  flex:none; width:30px; height:30px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  font-size:.8rem; font-weight:800;
}
.hab-plus{
  flex:none; min-width:52px; min-height:44px; border-radius:999px; cursor:pointer; font:inherit;
  font-size:.82rem; font-weight:800;
  background:#EEF4EC !important; border:1px solid #CFE0C8 !important;
  color:#3D4A3A !important; -webkit-text-fill-color:#3D4A3A !important;
}
.hab-none{
  margin:0; padding:20px 18px; text-align:center; border-radius:16px;
  border:1px dashed #D8DFD4 !important; background:#FBFCFA !important;
  font-size:.9rem; color:#5A6472 !important; -webkit-text-fill-color:#5A6472 !important;
}

/* ---- the person switcher above Daily Rhythm ----------------------------- */
.hab-whorow{ display:flex; gap:7px; flex-wrap:wrap; margin:0 0 14px; }
.hab-wb{
  min-height:44px; padding:10px 15px; border-radius:999px; cursor:pointer; font:inherit;
  font-size:.83rem; font-weight:700;
  background:#fff !important; border:1px solid #DDE3D8 !important;
  color:#4C5560 !important; -webkit-text-fill-color:#4C5560 !important;
}
.hab-wb[aria-pressed="true"]{ background:#EEF4EC !important; border-color:#A9C4A2 !important;
  color:#33452C !important; -webkit-text-fill-color:#33452C !important; }

/* ---- Day view tabs (Diary | Daily Rhythm) ------------------------------- */
.dvt-row{
  display:inline-flex; gap:4px; padding:4px; border-radius:999px; margin:0 0 16px;
  background:#F2F5F0 !important; border:1px solid #E1E8DD !important; flex-wrap:wrap;
}
.dvt-b{
  min-height:44px; padding:11px 20px; border-radius:999px; cursor:pointer; font:inherit;
  font-size:.86rem; font-weight:700; border:1px solid transparent !important; background:transparent !important;
  color:#4C5560 !important; -webkit-text-fill-color:#4C5560 !important;
}
.dvt-b[aria-pressed="true"]{
  background:#fff !important; border-color:#D3E0CD !important;
  color:#243447 !important; -webkit-text-fill-color:#243447 !important;
  box-shadow:0 1px 3px rgba(36,52,71,.07);
}
.dvt-day{ font-family:'Nunito',system-ui,sans-serif !important; font-size:1.05rem !important;
  font-weight:800 !important; margin:0 0 10px !important;
  color:#243447 !important; -webkit-text-fill-color:#243447 !important; }

/* ---- a linked list, shown in the diary as ONE card ---------------------- */
.dvl-wrap{ margin:0 0 16px; }
.dvl-h{
  font-family:'Nunito',system-ui,sans-serif !important; font-size:.74rem !important; font-weight:800 !important;
  letter-spacing:.14em; text-transform:uppercase; margin:0 0 8px !important;
  color:#5E6A54 !important; -webkit-text-fill-color:#5E6A54 !important;
}
.dvl{
  background:#fff !important; border:1px solid #E4E9E0 !important; border-radius:16px;
  padding:14px 16px; margin:0 0 9px;
}
.dvl.is-done{ background:#F4F9F2 !important; border-color:#D5E4CF !important; }
.dvl-top{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.dvl-n{ font-size:.96rem; font-weight:800; color:#243447 !important; -webkit-text-fill-color:#243447 !important; }
.dvl-m{ font-size:.81rem; color:#5A6472 !important; -webkit-text-fill-color:#5A6472 !important; }
.dvl-bar{ display:block; height:7px; border-radius:99px; background:#EDF1EA !important; overflow:hidden; margin:9px 0 0; }
.dvl-fill{ display:block; height:100%; border-radius:99px; background:#7D9E77 !important; background-image:none !important; }
.dvl-acts{ display:flex; gap:7px; flex-wrap:wrap; margin:11px 0 0; }
.dvl-b{
  min-height:44px; padding:10px 15px; border-radius:999px; cursor:pointer; font:inherit;
  font-size:.8rem; font-weight:700;
  background:#fff !important; border:1px solid #DDD7C9 !important;
  color:#3D4A3A !important; -webkit-text-fill-color:#3D4A3A !important;
}
.dvl-b:hover{ background:#EEF4EC !important; }
.dvl-b.is-primary{ background:#4E6640 !important; border-color:#4E6640 !important;
  color:#fff !important; -webkit-text-fill-color:#fff !important; }
.dvl-items{ list-style:none; margin:12px 0 0; padding:0; display:flex; flex-direction:column; gap:7px; }
.dvl-it{ display:flex; align-items:center; gap:11px; }
.dvl-tick{
  flex:none; width:44px; height:44px; min-height:44px; border-radius:50%; cursor:pointer;
  background:#fff !important; border:2px solid #C6D2BF !important; font:inherit; font-size:.95rem; font-weight:800;
  color:#4E6640 !important; -webkit-text-fill-color:#4E6640 !important;
}
.dvl-it.is-done .dvl-tick{ background:#5F7350 !important; border-color:#5F7350 !important;
  color:#fff !important; -webkit-text-fill-color:#fff !important; }
.dvl-itx{ font-size:.9rem; color:#243447 !important; -webkit-text-fill-color:#243447 !important; }
.dvl-it.is-done .dvl-itx{ color:#5F6773 !important; -webkit-text-fill-color:#5F6773 !important; text-decoration:line-through; }
.dvl-note{
  margin:11px 0 0; font-size:.79rem; line-height:1.6;
  color:#4E5A49 !important; -webkit-text-fill-color:#4E5A49 !important;
}
.dvl-done-msg{
  margin:10px 0 0; padding:11px 14px; border-radius:13px;
  background:#EDF4EA !important; border:1px solid #D5E4CF !important;
  font-size:.85rem; font-weight:700;
  color:#33452C !important; -webkit-text-fill-color:#33452C !important;
}

/* Life Vault's diary canvas is pale sage, so the shared components need to
   lift off it rather than off white. */
#page-life-vault[data-lvbg="sage"] .hab-row,
#page-life-vault[data-lvbg="sage"] .dvl{ border-color:#D7E3D2 !important; }
#page-life-vault[data-lvbg="sage"] .hab-sum{ background:#E4EDE0 !important; border-color:#CBDCC4 !important; }

@media (max-width:520px){
  .hab-sum{ gap:8px; }
  .hab-sum-bar{ flex-basis:100%; }
  .dvl-acts .dvl-b{ flex:1 1 auto; }
}


/* The diary toolbar sat at 40px. It is a control row I have now added a fifth
   button to, so it goes to the 44px target rather than being left as found. */
#lvxSec .dv-vb, #lvxSec .dv-arw, #lvxSec .dv-today, #lvxSec .dv-allbtn{
  min-height:44px !important;
}
#lvxSec .dv-arw{ min-width:44px !important; }
#lvxSec .dv-views{ flex-wrap:wrap; }

/* my own link inside the Daily Rhythm note — the shared .lvx-link is 36px and
   is used in many other places, so this is scoped rather than changed globally */
#lvxSec .dvl-note .lvx-link{ min-height:44px; padding:10px 0; }

