/* styles-time-quick.css — быстрый ввод времени (app-time-quick.js, 14.11.2026): поле «ЧЧ:ММ»
   и под ним сетка готовых времён шагом 15 минут — 4 в ряд, видно 4 часа, дальше прокрутка.
   Цвета — как у меню клетки графика (светлая всплывашка, синяя рамка). */

input[data-time-quick] {
  width: 58px;
  min-height: 24px;
  box-sizing: border-box;
  border: 1px solid #b6c9df;
  border-radius: 7px;
  background: #fff;
  color: #1d3553;
  font-size: 11px;
  font-variant-numeric: tabular-nums;
  text-align: center;
  padding: 0 6px;
}
input[data-time-quick]:focus { outline: none; border-color: #2f5f8a; box-shadow: 0 0 0 2px rgba(47, 95, 138, 0.18); }

.time-quick-list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 4px;
  max-height: 132px;
  overflow-y: auto;
  padding: 4px;
  border: 1px solid #b6c9df;
  border-radius: 8px;
  background: #fff;
  overscroll-behavior: contain;
}
.time-quick-list[hidden] { display: none; }

.time-quick-slot {
  min-height: 24px;
  border: 1px solid #d6e2ef;
  border-radius: 6px;
  background: #f6f9fd;
  color: #1d3553;
  font-size: 11px;
  font-variant-numeric: tabular-nums;
  cursor: pointer;
}
.time-quick-slot:hover { background: #e3edf8; border-color: #7ea2c4; }
.time-quick-slot.is-on { background: #2f5f8a; border-color: #2f5f8a; color: #fff; }
.time-quick-slot.is-now { grid-column: 1 / -1; font-weight: 600; background: #e8f5ec; border-color: #9ed3ae; color: #166534; }
.time-quick-slot.is-now:hover { background: #d6efdd; }