/* ═══ Телефон — касса ═══
   Книга и окна — styles/cash.css стойки (там есть раскладки до 720 и 520 px);
   своё здесь — плита по роли и действия под палец. */
.tel-cs-plate{position:relative;isolation:isolate;overflow:hidden;padding:16px var(--ph-gutter) 16px;background:var(--band);color:var(--band-ink)}
.tel-cs-plate > :not(.plate-lite){position:relative;z-index:1}
.tel-cs-reads{display:grid;grid-template-columns:1fr 1fr;gap:12px 14px}
.tel-cs-read small{display:block;font-size:var(--ph-s);color:var(--band-ink-2)}
.tel-cs-read b{display:block;margin-top:3px;font-size:22px;font-weight:600;letter-spacing:-.02em;line-height:1.1;font-variant-numeric:tabular-nums}
.tel-cs-read.zero b{color:var(--band-ink-2)}
.tel-cs-read i{display:block;margin-top:2px;font-style:normal;font-size:var(--ph-xs);color:var(--band-ink-2)}
.tel-cs-said{margin:0;font-size:var(--ph-b);line-height:1.45;color:var(--band-ink-2)}
.tel-cs-acts{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:8px;margin-top:16px}
.tel-cs-act{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-height:64px;padding:8px 4px;
  border-radius:var(--r-lg);background:color-mix(in srgb,var(--band-ink) 10%,transparent);color:var(--band-ink);
  font-size:var(--ph-s);font-weight:500;line-height:1.2;text-align:center;transition:transform var(--t-tap) var(--ease),background-color var(--t-tap) var(--ease);
}
.tel-cs-act svg{width:22px;height:22px}
.tel-cs-act:active{transform:scale(.96);background:color-mix(in srgb,var(--band-ink) 16%,transparent)}
.tel-cs-bar{padding:10px var(--ph-gutter) 0}
.tel-cs-bar .cs-bar{padding:0}
/* Действия уже стоят на плите под палец; кнопки обоймы компьютера здесь лишние. */
.tel-cs-bar .cs-acts{display:none}
.tel-cs-book{padding:0 var(--ph-gutter) calc(20px + env(safe-area-inset-bottom,0px))}
@media (prefers-reduced-motion:reduce){
  .tel-cs-act{transition:none}
}

/* ── книга кассы по шкале телефона (design-review.md, «Касса») ──
   Разметка та же, что у стойки (cash.mjs); здесь кегли и отступы: обойма
   мест дорожкой, заголовок дня 17, строки 15 / 13, итоги дня 13 / 15. */
html[data-page="phone"] .tel-cs-bar .cs-places{min-width:0;padding:3px;border-radius:var(--r-lg)}
html[data-page="phone"] .tel-cs-bar .cs-place{height:36px;padding:0 13px;border-radius:calc(var(--r-lg) - 3px);font-size:var(--ph-s)}
.tel-cs-book .cs-day{padding-top:18px}
.tel-cs-book .cs-day-h{gap:8px;padding:10px 2px 8px}
.tel-cs-book .cs-day-h b{font-size:var(--ph-h);letter-spacing:-.02em}
.tel-cs-book .cs-day-h span{font-size:var(--ph-s)}
.tel-cs-book .cs-row{grid-template-columns:46px minmax(0,1fr) auto;gap:3px 12px;min-height:60px;padding:12px 2px}
.tel-cs-book .cs-row:active{background:var(--sunk)}
.tel-cs-book .cs-at{font-size:var(--ph-s)}
.tel-cs-book .cs-glyph svg{width:16px;height:16px}
.tel-cs-book .cs-what b{font-size:var(--ph-b)}
.tel-cs-book .cs-what>span{margin-top:2px;font-size:var(--ph-s);line-height:1.4}
.tel-cs-book .cs-where{max-width:140px;font-size:var(--ph-s)}
.tel-cs-book .cs-sum{font-size:var(--ph-b)}
.tel-cs-book .cs-void{font-size:var(--ph-s)}
.tel-cs-book .cs-foot{gap:6px 18px;padding:12px 2px 6px}
.tel-cs-book .cs-foot-i dt{font-size:var(--ph-s)}
.tel-cs-book .cs-foot-i dd{font-size:var(--ph-b)}
.tel-cs-book .cs-foot-i.end dd{font-size:var(--ph-h)}
.tel-cs-book .cs-note{margin-top:22px;font-size:var(--ph-s)}

/* ── окна кассы по шкале телефона ──
   Шапка, табло и подвал — от приёма оплаты (sheets.css). Здесь своё: места
   списком счетов, статьи чипами под палец, переключатель вида дорожкой,
   поля и подсказки. Селекторы тяжелее правил sheets.css (он подключён
   позже, и у `.pay-method` там свои размеры). */
html[data-page="phone"] .dlg-cash .pay-body .pay-sec{margin-top:20px}
html[data-page="phone"] .dlg-cash .pay-body>.pay-sec:first-child,
html[data-page="phone"] .dlg-cash .cx-seg + .pay-sec,
html[data-page="phone"] .dlg-cash .cx-warn + .pay-sec{margin-top:0}
html[data-page="phone"] .cx-places{grid-template-columns:1fr;gap:6px}
html[data-page="phone"] .pay-method.cx-place{min-height:52px;gap:12px;padding:12px 14px;border-radius:var(--r-lg)}
html[data-page="phone"] .pay-method.cx-place i svg{width:20px;height:20px}
html[data-page="phone"] .pay-method.cx-place span{font-size:var(--ph-b)}
/* переключатель «Владелец забрал / Перевести» — той же дорожкой, что закладки карточки брони */
html[data-page="phone"] .cx-seg{gap:2px;padding:3px;margin-bottom:18px;border-radius:var(--r-lg)}
html[data-page="phone"] .cx-seg-b{height:40px;border-radius:calc(var(--r-lg) - 3px);font-size:14px;transition:background-color var(--t-tap) var(--ease),color var(--t-tap) var(--ease),transform var(--t-tap) var(--ease)}
html[data-page="phone"] .cx-seg-b:active{transform:scale(.97)}
/* статьи */
html[data-page="phone"] .cx-find svg{left:13px;width:16px;height:16px}
html[data-page="phone"] .cx-find input{min-height:44px;padding-left:38px;border-radius:var(--r-lg)}
html[data-page="phone"] .cx-cats{gap:8px;margin-top:10px}
html[data-page="phone"] .cx-chip{height:36px;padding:0 14px;font-size:14px}
html[data-page="phone"] .cx-chip em{font-size:var(--ph-xs)}
html[data-page="phone"] .cx-none{font-size:var(--ph-s)}
/* поля, подсказки, предупреждения */
html[data-page="phone"] .cx-field{margin-top:20px}
html[data-page="phone"] .cx-field>span{margin-bottom:7px;font-size:var(--ph-s)}
html[data-page="phone"] .cx-field select{min-height:44px;border-radius:var(--r-lg)}
html[data-page="phone"] .cx-warn{margin-bottom:16px;padding:11px 13px;border-radius:var(--r-lg);font-size:var(--ph-s)}
html[data-page="phone"] :is(.cx-error,.cx-hint){margin-top:14px;font-size:var(--ph-s)}
html[data-page="phone"] .cx-counted{margin-bottom:16px;font-size:var(--ph-b)}
html[data-page="phone"] .cx-shown output{font-size:40px}
/* брони канала */
html[data-page="phone"] .cx-book{gap:6px}
html[data-page="phone"] .cx-book-row{min-height:56px;gap:12px;padding:10px 14px;border-radius:var(--r-lg)}
html[data-page="phone"] .cx-book-row input{width:20px;height:20px}
html[data-page="phone"] .cx-book-t b{font-size:var(--ph-b)}
html[data-page="phone"] .cx-book-t span{font-size:var(--ph-s)}
html[data-page="phone"] .cx-book-sum{font-size:var(--ph-b)}
html[data-page="phone"] .cx-book-all{display:inline-flex;align-items:center;min-height:44px;font-size:var(--ph-s)}
@media (prefers-reduced-motion:reduce){
  html[data-page="phone"] .cx-seg-b{transition:none}
  html[data-page="phone"] .cx-seg-b:active{transform:none}
}
