From 72a5863871860afe944af0dbd3ac798aa2db9042 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=D0=9A=D0=BE=D0=BD=D1=81=D1=82=D0=B0=D0=BD=D1=82=D0=B8?=
 =?UTF-8?q?=D0=BD=20=D0=9B=D0=B5=D0=B1=D0=B5=D0=B4=D0=B8=D0=BD=D1=81=D0=BA?=
 =?UTF-8?q?=D0=B8=D0=B9?= <lebedinsky.kd@gmail.com>
Date: Mon, 27 Apr 2026 20:19:51 +0500
Subject: [PATCH] fix(mobile): version card height, assign list, header
 safe-area

- version cards: flex-grow 0 for main in column layout (no empty vertical gap)
- test detail: slightly larger gaps between accordion bricks; more bottom padding for fixed footer
- header: respect safe-area insets for top and sides (logout away from screen edge)
- assign: compact toolbar inputs on narrow screens; taller scroll area; row borders a bit stronger
- assign rows: center checkbox with text; clamp meta to 3 lines with ellipsis; checkbox size + accent-color

Made-with: Cursor
---
 frontend/src/styles/cabinet-theme.css | 56 +++++++++++++++++++++++++--
 1 file changed, 52 insertions(+), 4 deletions(-)

diff --git a/frontend/src/styles/cabinet-theme.css b/frontend/src/styles/cabinet-theme.css
index dbf9e9e..7107f48 100644
--- a/frontend/src/styles/cabinet-theme.css
+++ b/frontend/src/styles/cabinet-theme.css
@@ -300,7 +300,10 @@ code,
 .cabinet-header__inner {
   max-width: var(--max-content);
   margin: 0 auto;
-  padding: 0.75rem 1.25rem;
+  padding-top: max(0.75rem, env(safe-area-inset-top, 0px));
+  padding-bottom: 0.75rem;
+  padding-left: max(1.25rem, env(safe-area-inset-left, 0px) + 0.5rem);
+  padding-right: max(1.25rem, env(safe-area-inset-right, 0px) + 0.5rem);
   display: flex;
   align-items: center;
   justify-content: space-between;
@@ -574,6 +577,11 @@ code,
   margin-bottom: 1.1rem;
 }
 
+/* Чуть больше воздуха между аккордеонами на карточке теста */
+.test-detail-page > .cabinet-brick {
+  margin-bottom: 1.35rem;
+}
+
 .cabinet-brick--hero {
   padding: 0.1rem 0 0.2rem;
   border-bottom: 1px solid color-mix(in srgb, var(--outline-variant) 45%, transparent);
@@ -651,6 +659,19 @@ code,
   flex: 1 1 200px;
 }
 
+/* Назначение: компактнее поля на мобилке; 16px — без авто-зума iOS в поле */
+@media (max-width: 640px) {
+  .assign-toolbar {
+    gap: 0.4rem;
+  }
+
+  .assign-toolbar .form-input {
+    padding: 8px 12px;
+    font-size: 16px;
+    line-height: 1.3;
+  }
+}
+
 .assign-list {
   max-height: min(40vh, 18rem);
   min-height: 0;
@@ -661,13 +682,28 @@ code,
   -webkit-overflow-scrolling: touch;
 }
 
+/* Чуть выше область прокрутки — под панель инструмента теста и fixed-футер */
+@media (max-width: 640px) {
+  .assign-list {
+    max-height: min(52dvh, 24rem);
+  }
+}
+
 .assign-row {
   display: flex;
   gap: 0.5rem;
   padding: 0.65rem 0.75rem;
-  border-bottom: 1px solid color-mix(in srgb, var(--outline-variant) 30%, transparent);
+  border-bottom: 1px solid color-mix(in srgb, var(--outline-variant) 40%, transparent);
   cursor: pointer;
-  align-items: flex-start;
+  align-items: center;
+}
+
+.assign-row input[type='checkbox'] {
+  flex-shrink: 0;
+  width: 1.125rem;
+  height: 1.125rem;
+  margin: 0;
+  accent-color: var(--primary);
 }
 
 .assign-row:last-child {
@@ -704,6 +740,12 @@ code,
   font-size: 0.8rem;
   color: var(--secondary);
   line-height: 1.35;
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 3;
+  overflow: hidden;
+  word-break: break-word;
+  overflow-wrap: anywhere;
 }
 
 .create-row {
@@ -811,6 +853,7 @@ code,
 
 .version-card-list__item {
   margin: 0;
+  min-height: 0;
 }
 
 .version-card-list__row {
@@ -844,6 +887,11 @@ code,
     align-items: stretch;
   }
 
+  /* В column flex `flex-grow: 1` на .main тянет блок по вертикали — лишнее пустое место */
+  .version-card-list__main {
+    flex: 0 1 auto;
+  }
+
   .version-card-list__action {
     width: 100%;
     align-self: stretch;
@@ -1060,7 +1108,7 @@ code,
 
 @media (max-width: 640px) {
   .test-detail-page--with-fixed-actions {
-    padding-bottom: calc(6.5rem + env(safe-area-inset-bottom, 0px));
+    padding-bottom: calc(7.5rem + env(safe-area-inset-bottom, 0px));
   }
 
   .test-detail-page--with-fixed-actions .editor-actions-flow {