/* =========================================================
   ChiliPiper / Square-like scheduler (scoped)
========================================================= */

#hcoGcal.cpWrap{
  max-width: 840px;
  margin: 10px auto 0;
  text-align: center;
}

#hcoGcal .cpH2{
  font-size: 34px;
  font-weight: 700;
  margin: 20px 0 26px;
  color:#111;
}
#hcoGcal .cpH2Space{ margin-top: 56px; }

#hcoGcal .cpDateBar{
  max-width: 840px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  margin-bottom: 28px;
}

#hcoGcal .cpNav{
  width:56px;height:56px;
  border-radius:14px;
  border:1px solid #ececec;
  background:#f7f7f7;
  color:#666;
  font-size:26px;
  display:grid;
  place-items:center;
  cursor:pointer;
}
#hcoGcal .cpNav:disabled{ opacity:.45; cursor:not-allowed; }

#hcoGcal .cpPicker{
  border-radius:16px;
  border:1px solid #eee;
  overflow:hidden;
  background:#f0f0f0;
}

#hcoGcal .cpDowRow{
  display:grid;
  grid-template-columns:repeat(7, 1fr);
  gap:10px;
  padding:14px 18px;
  font-size:18px;
  color:#777;
  background:#ededed;
}

#hcoGcal .cpDates{
  display:grid;
  grid-template-columns:repeat(7, 1fr);
  gap:0;
  padding:18px;
  background:#f7f7f7;
}

#hcoGcal .cpDay{
  border:none;
  background:transparent;
  padding:14px 6px;
  border-radius:14px;
  cursor:pointer;
  transition: background .15s ease, color .15s ease;
}
#hcoGcal .cpDay:hover{ background:#ffffff; }

#hcoGcal .cpDay.isSelected{
  background:#12161d;
  color:#fff;
}

#hcoGcal .cpDay:disabled{
  opacity:.35;
  cursor:not-allowed;
}

#hcoGcal .cpNum{
  font-size:22px;
  font-weight:600;
  line-height:1.05;
}
#hcoGcal .cpMon{
  font-size:16px;
  opacity:.8;
  margin-top:4px;
}

#hcoGcal .cpMetaLine{
  display:flex;
  justify-content:center;
  margin: 6px 0 24px;
  color:#5a5a5a;
  font-size:20px;
}

#hcoGcal .cpMetaLeft{
  display:flex;
  align-items:center;
  gap:10px;
}

#hcoGcal .cpDuration{
  border:none;
  background:transparent;
  font-weight:600;
  font-size:20px;
  color:#5a5a5a;
  cursor:pointer;
}

#hcoGcal .cpDot{ opacity:.6; }

#hcoGcal .cpTimeGrid{
  width: 100%;
  max-width: 640px;
  margin: 0 auto;
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:18px;
}

#hcoGcal .cpTime{
  padding:10px 10px;
  border-radius:16px;
  border:1px solid #e8e8e8;
  background:#fff;
  font-size:16px;
  font-weight:600;
  cursor:pointer;
  transition: background .15s ease, border-color .15s ease;
}
#hcoGcal .cpTime:hover{ background:#fafafa; }
#hcoGcal .cpTime.isSelected{
  background:#12161d;
  color:#fff;
  border-color:#12161d;
}
#hcoGcal .cpTime.isDisabled{
  opacity:.35;
  cursor:not-allowed;
}

#hcoGcal .cpStatus{
  margin-top: 14px;
  color:#777;
  font-size:16px;
  min-height: 22px;
}

#hcoGcal .cpNotes{
  max-width: 720px;
  margin: 30px auto 0;
  text-align:left;
}

#hcoGcal .cpContinueBtn{
  margin: 24px auto 0;
  display:inline-block;
  padding:16px 30px;
  border-radius:999px;
  border:none;
  background:#12161d;
  color:#fff;
  font-weight:700;
  font-size:18px;
  cursor:pointer;
}
#hcoGcal .cpContinueBtn:disabled{
  opacity:.45;
  cursor:not-allowed;
}

#hcoGcal .cpHint{
  margin-top: 18px;
  color:#6b7280;
  font-size:14px;
}
@media (max-width: 760px){
  #hcoGcal .cpTimeGrid{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 520px){
  #hcoGcal .cpTimeGrid{ grid-template-columns:1fr; }
}