.cc-root {
  border: 1px solid #e5ddd1;
  border-radius: 14px;
  background: #fff;
  padding: .75rem;
}

.cc-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .5rem;
  margin-bottom: .55rem;
}

.cc-title {
  margin: 0;
  font-size: .98rem;
}

.cc-nav {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
}

.cc-btn {
  border-radius: 999px;
  border: 1px solid #b8ddcf;
  background: #e8f8f2;
  color: #105f49;
  padding: .25rem .55rem;
  font: inherit;
  font-size: .76rem;
  font-weight: 700;
  cursor: pointer;
}

.cc-month-label {
  font-size: .84rem;
  font-weight: 700;
  color: #4f483f;
  min-width: 122px;
  text-align: center;
}

.cc-weekdays {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: .3rem;
  margin-bottom: .3rem;
}

.cc-weekdays span {
  font-size: .72rem;
  color: #71685d;
  text-align: center;
  font-weight: 700;
}

.cc-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: .3rem;
}

.cc-day {
  min-height: 94px;
  border: 1px solid #eee5d8;
  border-radius: 10px;
  background: #fcfaf6;
  padding: .25rem .3rem;
  display: flex;
  flex-direction: column;
  gap: .2rem;
  cursor: pointer;
}

.cc-day:hover {
  border-color: #d3c7b7;
}

.cc-day.is-outside {
  opacity: .6;
}

.cc-day.is-today {
  box-shadow: inset 0 0 0 1px #83c8b2;
}

.cc-day.is-selected {
  border-color: #007a61;
  box-shadow: inset 0 0 0 1px #007a61;
}

.cc-date {
  font-size: .72rem;
  font-weight: 700;
  color: #5f574e;
}

.cc-pill {
  font-size: .66rem;
  line-height: 1.18;
  border-radius: 7px;
  padding: .14rem .23rem;
  border: 1px solid #cfd8d2;
  background: #f2f7f4;
  color: #28443b;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: pointer;
}

.cc-more {
  font-size: .65rem;
  color: #6d6459;
}

.cc-detail {
  margin-top: .65rem;
  border-top: 1px dashed #e7dfd2;
  padding-top: .55rem;
}

.cc-detail-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .45rem;
  margin-bottom: .4rem;
}

.cc-detail h4 {
  margin: 0;
  font-size: .86rem;
}

.cc-detail-action-btn {
  flex-shrink: 0;
}

.cc-detail-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: .35rem;
}

.cc-detail-item {
  border: 1px solid #e7dfd2;
  border-radius: 8px;
  padding: .35rem .45rem;
  background: #fffdfa;
  font-size: .78rem;
  cursor: pointer;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.cc-detail-empty {
  margin: 0;
  color: #6d6459;
  font-size: .78rem;
}

@media (max-width: 760px) {
  .cc-day { min-height: 78px; }
}