/* Приложение: журнал заявок. Свои стили — только сетка, отступы, логотип. Цвета — токены ДС; базовые иконки — из спрайта.""" .sidebar-brand { display: flex; align-items: center; gap: var(--kt-ai-space-4); padding: var(--kt-ai-space-3) var(--kt-ai-space-4); } .brand-logo { width: auto; height: 26px; } .sidebar-new { margin: var(--kt-ai-space-6) var(--kt-ai-space-3) var(--kt-ai-space-8); } .sidebar-tools { margin-top: auto; display: flex; flex-direction: column; gap: var(--kt-ai-space-4); padding: 0 var(--kt-ai-space-3) var(--kt-ai-space-3); } .topbar-crumb { font-size: var(--kt-ai-text-xs); color: var(--kt-ai-fg-muted); } .page-head { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--kt-ai-space-5); flex-wrap: wrap; } .meta-chip { white-space: nowrap; } .toolbar { display: flex; align-items: center; gap: var(--kt-ai-space-4); flex-wrap: wrap; margin-top: var(--kt-ai-stack-block); } .toolbar .kt-ai-filterbar { margin: 0; flex-wrap: wrap; } .search-input { width: min(380px, 100%); } .table-foot { margin-top: var(--kt-ai-space-3); } .log-section { margin-top: var(--kt-ai-stack-region); } .log-section h2 { margin-bottom: var(--kt-ai-stack-tight); } /* Карточка заявки в панели */ .drawer-head { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--kt-ai-space-4); margin-bottom: var(--kt-ai-stack-tight); } .detail-stack { display: flex; flex-direction: column; gap: var(--kt-ai-stack-tight); } .detail-note { padding-top: var(--kt-ai-space-5); border-top: 1px solid var(--kt-ai-border); } .detail-note .kt-ai-label { display: block; margin-bottom: var(--kt-ai-space-3); } .note-text { margin: 0; font-size: var(--kt-ai-text-sm); line-height: 1.6; color: var(--kt-ai-fg-muted); white-space: pre-line; overflow-wrap: anywhere; } /* Ящик: при открытии поверх шапки, а скрытие — флагом hidden */ .kt-ai-drawer { z-index: calc(var(--kt-ai-z-drawer) + 1); } .kt-ai-drawer[hidden] { display: none; } /* Пустое состояние: центрируем содержимое */ .kt-ai-empty { align-items: center; text-align: center; min-height: 220px; } .kt-ai-empty .kt-icon { width: 30px; height: 30px; color: var(--kt-ai-fg-faint); margin-bottom: var(--kt-ai-space-3); } .kt-ai-empty .kt-ai-sub { margin: 0; font-size: var(--kt-ai-text-sm); color: var(--kt-ai-fg-muted); max-width: 420px; } /* История действий: события */ .event-list { display: flex; flex-direction: column; } .event-row { display: flex; align-items: flex-start; gap: var(--kt-ai-space-4); padding: var(--kt-ai-space-3) 0; border-bottom: 1px solid var(--kt-ai-border); } .event-row:last-child { border-bottom: none; } .event-time { flex: 0 0 96px; font-size: var(--kt-ai-text-xs); color: var(--kt-ai-fg-muted); font-variant-numeric: tabular-nums; padding-top: 2px; } @media (max-width: 639.98px) { .event-time { flex-basis: 80px; } } .event-main { min-width: 0; } .event-user { display: block; } .event-what { display: block; margin-top: var(--kt-ai-space-1); font-size: var(--kt-ai-text-sm); overflow-wrap: anywhere; } /* Оверлей под ящиком */ .drawer-overlay { position: fixed; inset: 0; background: rgb(12 10 9 / 0.45); z-index: var(--kt-ai-z-drawer); border: none; padding: 0; cursor: default; } .drawer-overlay:focus-visible { outline: none; } /* Просроченная строка: приглушённая пометка слева */ tr.is-overdue td:first-child { box-shadow: inset 2px 0 0 var(--kt-ai-status-risk-fg); } /* Поле-дата в форме */ #zform .kt-ai-input[type="date"] { padding-right: var(--kt-ai-space-4); } /* Форма заявки */ .drawer-head h2 { margin: 0; } .drawer-head .kt-ai-meta { margin: var(--kt-ai-space-2) 0 0; } #zformRoot .kt-ai-field { display: block; margin-bottom: var(--kt-ai-stack-tight); } .req { color: var(--kt-ai-fg-muted); } .form-err { margin-top: var(--kt-ai-space-2); padding: var(--kt-ai-space-3) var(--kt-ai-space-4); background: var(--kt-ai-status-risk-bg); border: 1px solid color-mix(in srgb, var(--kt-ai-status-risk-fg) 45%, transparent); border-radius: var(--kt-ai-radius-lg); color: var(--kt-ai-status-risk-fg); font-size: var(--kt-ai-text-sm); } .drawer-actions .spacer { flex: 1; } .drawer-actions { display: flex; align-items: center; gap: var(--kt-ai-space-2); } .log-dash { font-size: var(--kt-ai-text-2xs); color: var(--kt-ai-fg-faint); } @media (max-width: 639.98px) { .search-input { width: 100%; } }