/* NIPI-215: освежённый интерфейс. Подключается после theme.css и readability.css; модульные стили могут уточнять.
   Единая геометрия кнопок (центрирование, высота), ряды кнопок без «выпавших» элементов, мягкие тени и переходы. */
:root {
  --ring: 0 0 0 3px rgba(38, 71, 150, .22);
  --shadow: 0 1px 2px rgba(16, 24, 40, .05), 0 4px 16px rgba(16, 24, 40, .06);
  --shadow-hover: 0 2px 4px rgba(16, 24, 40, .06), 0 10px 28px rgba(16, 24, 40, .10);
  --ease: cubic-bezier(.2, .7, .2, 1);
}

/* ---------- Кнопки: содержимое по центру, одинаковая высота в ряду ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  min-height: 40px; line-height: 1.2; text-align: center; vertical-align: middle;
  border-radius: 12px; letter-spacing: .01em;
  transition: background-color .16s var(--ease), border-color .16s var(--ease), box-shadow .16s var(--ease), transform .08s var(--ease), color .16s;
}
.btn-sm { min-height: 32px; border-radius: 10px; }
.btn-block { display: flex; width: 100%; }
.btn-primary { box-shadow: 0 1px 2px rgba(38, 71, 150, .18), 0 4px 12px rgba(38, 71, 150, .18); }
.btn-primary:hover:not(:disabled) { box-shadow: 0 2px 4px rgba(38, 71, 150, .22), 0 8px 20px rgba(38, 71, 150, .24); }
.btn:active:not(:disabled) { transform: translateY(1px); }
.btn:focus-visible, .icon-btn:focus-visible { outline: none; box-shadow: var(--ring); }
.btn:disabled { box-shadow: none; }
.btn .icon { flex-shrink: 0; }

/* ---------- Ряды кнопок ---------- */
.form-actions, .card-header, .settings-footer, .welcome { align-items: center; }
.form-actions { flex-wrap: wrap; }
td.actions .btn { vertical-align: middle; }

/* ---------- Поля ---------- */
label > input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]), label > select,
.form-grid input:not([type=checkbox]):not([type=radio]):not([type=file]), .form-grid select { min-height: 40px; }
input, select, textarea { transition: border-color .16s var(--ease), box-shadow .16s var(--ease); }
input:focus, select:focus, textarea:focus { outline: none; box-shadow: var(--ring); border-color: var(--primary); }

/* ---------- Карточки и окна ---------- */
.card { transition: box-shadow .2s var(--ease); }
a.card:hover, .card.clickable:hover, .quick-action:hover { box-shadow: var(--shadow-hover); }
.modal { backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); }
.modal:not([hidden]) .modal-dialog { animation: nipi-pop .18s var(--ease); }
.modal-page .modal-dialog { animation: none; }
.peer-call[open] { animation: nipi-pop .2s var(--ease); }
@keyframes nipi-pop { from { opacity: 0; transform: translateY(6px) scale(.985); } to { opacity: 1; transform: none; } }
.toast { animation: nipi-fade .18s var(--ease); }
@keyframes nipi-fade { from { opacity: 0; } to { opacity: 1; } }

/* ---------- Узкие экраны: кнопки ряда делят ширину поровну ---------- */
@media (max-width: 600px) {
  .form-actions { justify-content: stretch; }
  .form-actions > .btn, .form-actions > button { flex: 1 1 0; min-width: 0; }
  .btn { white-space: normal; }
}
@media (prefers-reduced-motion: reduce) {
  .btn, .card, input, select, textarea { transition: none; }
  .modal:not([hidden]) .modal-dialog, .peer-call[open], .toast { animation: none; }
}