/* Экран «Календарь» — портировано из style.css Mini App. */

/* --- Месячная сетка с точками статуса дня ---
   Ячейки квадратные (aspect-ratio: 1) и растут вместе с шириной контейнера
   — на широком экране (десктоп/ноутбук) без ограничения ширины они
   раздувались до ~190px и сетка переставала помещаться на экран. Поэтому
   сам блок месяца (навигация/дни недели/сетка) ограничен по ширине —
   ячейки остаются комфортного размера на любом экране, а дневной
   таймлайн ниже (посты × часы) по-прежнему растягивается на всю ширину,
   ему лишнее место не мешает. На мобильном экран уже уже этого предела,
   так что там ничего не меняется — сетка как и была занимает всю ширину. */
.cal-month-wrap { max-width: 480px; }
.cal-month-nav { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.cal-month-nav__label {
  flex: 1; min-width: 0; text-align: center; padding: 11px 12px;
  font: inherit; font-weight: 700; font-size: 14.5px; text-transform: capitalize;
  min-height: var(--control-h);
  border-radius: var(--radius-sm); border: 1px solid var(--border-strong); background: var(--surface-solid); color: var(--text);
}
.cal-weekdays {
  display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px;
  margin-bottom: 4px; text-align: center; font-size: 11px; font-weight: 600; color: var(--text-faint);
}
.cal-month-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.cal-day {
  position: relative; aspect-ratio: 1; max-height: 72px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
  background: var(--surface); border: 1px solid var(--border); border-radius: 12px;
  color: var(--text); font: inherit; transition: border-color 0.15s, background 0.15s;
}
.cal-day--out { color: var(--text-faint); background: transparent; border-color: transparent; }
.cal-day:hover { border-color: var(--primary-border); }
.cal-day--today { border-color: var(--primary); box-shadow: inset 0 0 0 1px var(--primary); }
.cal-day--selected { background: var(--accent); border-color: var(--accent); }
.cal-day--selected .cal-day__num { color: var(--on-accent); font-weight: 700; }
.cal-day__num { font-size: 13px; }
.cal-dot { width: 6px; height: 6px; border-radius: 50%; }
.cal-dot--green { background: var(--green); }
.cal-dot--red { background: var(--danger-text); }
.cal-dot--accent { background: var(--accent); }
.cal-day--selected .cal-dot--accent { background: var(--on-accent); }

.cal-nav { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.cal-nav__btn {
  width: 42px; height: 42px; flex-shrink: 0; font-size: 22px; line-height: 1;
  border-radius: var(--radius-sm); border: 1px solid var(--border-strong); background: var(--surface-solid); color: var(--text);
}
.cal-nav__day {
  flex: 1; min-width: 0; padding: 11px 12px; font: inherit; font-weight: 600; font-size: 14px;
  min-height: 42px;
  border-radius: var(--radius-sm); border: 1px solid var(--border-strong); background: var(--surface-solid); color: var(--text);
}

.cal-scroll { overflow-x: auto; }
.cal-agenda-row { cursor: pointer; }

/* «+ Новый выезд» вверху Календаря — кнопка .btn-new-order из home.css, справа */
.cal-head { display: flex; justify-content: flex-end; margin-bottom: 12px; }
