/* ==========================================================================
   Working days between two dates
   The shared calculator layout, plus a week of day chips, a holiday list that
   grows, and the weekday breakdown under the answer.
   ========================================================================== */

/* Seven chips that should read as one week rather than as a wrapped list, so
   they share the width evenly and stay on one line down to a narrow phone. */
.wd-week{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;}
.wd-week button{padding:8px 2px;text-align:center;border-radius:var(--radius-sm);}

.check{
  display:flex;align-items:center;gap:9px;margin-top:10px;
  font-size:.93rem;color:var(--ink);cursor:pointer;
}
.check input{width:17px;height:17px;accent-color:var(--accent);flex-shrink:0;}

/* A disabled hours box should read as switched off, not as broken. */
.ci-unit input:disabled{opacity:.45;cursor:not-allowed;}

.wd-add{display:flex;gap:8px;margin-bottom:10px;}
.wd-add input[type="date"]{flex:1;min-width:0;}
.wd-add .btn{flex-shrink:0;}

.wd-hols{display:flex;flex-wrap:wrap;gap:6px;}
.wd-hol{
  display:inline-flex;align-items:center;gap:4px;
  padding:5px 6px 5px 10px;border-radius:999px;
  background:var(--surface-2);border:1px solid var(--rule-2);
  font-size:.82rem;color:var(--ink-2);
}
.wd-hol button{
  width:19px;height:19px;flex-shrink:0;
  display:grid;place-items:center;
  background:transparent;border:none;border-radius:50%;
  color:var(--ink-3);font-size:1rem;line-height:1;cursor:pointer;
}
.wd-hol button:hover{background:var(--surface-3);color:var(--ink);}

.wd-none{margin:0;font-size:.82rem;color:var(--ink-3);line-height:1.55;}

.wd-break{margin-top:18px;padding-top:16px;border-top:1px solid var(--rule);}
.wd-break h4{
  margin:0 0 4px;font-family:var(--f-mono);font-size:.7rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink-3);font-weight:500;
}
.wd-break .res-rows{margin-top:0;}

#msgArea:not(:empty){margin-top:16px;}