/* ===== 01. Карточка календаря ===== */
.kc-cal{
  border:1px solid rgba(255,255,255,.25);
  border-radius:12px;
  background:rgba(255,255,255,.06);
  padding:16px 18px 18px;
  box-sizing:border-box;
  color:#e6e9ef;
}

/* ===== 02. Тулбар и заголовок ===== */
.kc-cal-toolbar{
  display:flex; align-items:center; justify-content:space-between;
  gap:12px; margin-bottom:10px;
}
.kc-cal-title{ font-weight:700; font-size:16px; text-align:center; flex:1; }
.kc-btn.kc-nav{
  min-width:40px; height:36px; padding:0 10px; border-radius:10px;
  border:1px solid #3a4257; background:rgba(18,24,38,.6); color:#e6e9ef; cursor:pointer;
}
.kc-btn.kc-nav[hidden]{ display:none !important; }

/* ===== 03. Легенда ===== */
.kc-cal-legend{
  display:flex; gap:16px; align-items:center; justify-content:center;
  font-size:12px; opacity:.85; margin:4px 0 10px;
}
.kc-cal-legend .dot{
  display:inline-block; width:10px; height:10px; border-radius:50%;
  margin-right:6px; vertical-align:middle;
}
.dot-ok{ background:#4f8cff; }
.dot-ovr{ background:#f0c44c; }
.dot-off{ background:#777; }

/* ===== 04. Сетка календаря ===== */
.kc-cal-grid{
  display:grid;
  grid-template-columns: repeat(7, 1fr);
  gap:8px;
  user-select:none;
}
.kc-cal-weekday{
  font-size:12px; color:#ccd2e3; text-align:center;
  padding:4px 0; opacity:.9;
}
.kc-cal-day{
  height:38px; border-radius:8px; border:1px solid #2d3447;
  background:rgba(18,24,38,.55); color:#e6e9ef; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  transition: border-color .15s ease, background .15s ease, color .15s ease, transform .05s ease;
}
.kc-cal-day:hover{ border-color:#4f8cff; }
.kc-cal-day.is-override{ outline: 1px dashed #f0c44c; outline-offset: 2px; }
.kc-cal-day.is-selected{
  background:#4f8cff; border-color:#4f8cff; color:#fff; transform: translateY(-1px);
}
.kc-cal-day[aria-disabled="true"]{
  pointer-events:none; opacity:.35; background:rgba(18,24,38,.35);
}

/* ===== 05. Примечание и слоты ===== */
.kc-cal-note{
  margin:10px 0 6px; font-size:12px; color:#ccd2e3; text-align:center;
}

/* контейнер слотов (кнопки времени) */
.kc-cal-slots{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(90px, 90px));
  grid-auto-rows: 44px;
  gap: 10px;
  justify-content: center;
  margin-top:8px;
}
.kc-time{
  width:90px; height:44px; border-radius:8px;
  background: rgba(17,17,17,.6); border:1px solid #222938;
  color:#e8eefc; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  transition: border-color .15s ease, background .15s ease, color .15s ease;
}
.kc-time:hover{ border-color:#355296; }
.kc-time.is-active{ background:#4f8cff; border-color:#4f8cff; color:#fff; }
.kc-time.is-busy{ opacity:.45; cursor:not-allowed; }

/* ===== 06. Встраивание в форму (две колонки) ===== */
.kc-datetime .kc-field:first-child{ align-self:start; }

/* ===== 07. Адаптив ===== */
@media (max-width: 720px){
  .kc-cal{ padding:14px; }
}
@media (max-width: 640px){
  .kc-cal-legend{ flex-wrap:wrap; gap:10px; }
  .kc-cal{ border:none; background:rgba(255,255,255,.06); }
  .kc-cal-slots{ gap:8px; grid-template-columns: repeat(auto-fit, minmax(86px, 86px)); }
}
@media (max-width: 360px){
  .kc-cal{ padding:12px; }
  .kc-cal-slots{ grid-template-columns: repeat(auto-fit, minmax(80px, 80px)); }
}