sverka-dokumentov-pri-naznac/style.css

109 lines
6.7 KiB
CSS
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

/* Сверка документов — только сетка и отступы; цвета, кнопки, таблицы — ДС */
.view {
width: 100%;
max-width: 1120px;
margin-inline: auto;
padding: var(--kt-ai-space-8) var(--kt-ai-space-6) var(--kt-ai-space-12);
}
/* --- Экран 1: форма + файлы --- */
.up-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--kt-ai-space-4); }
.up-zones { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--kt-ai-space-4); }
.up-zone {
display: flex; flex-direction: column; gap: var(--kt-ai-space-3);
padding: var(--kt-ai-space-5) var(--kt-ai-space-5);
border: 1px dashed var(--kt-ai-border-strong); border-radius: var(--kt-ai-radius-xl);
background: var(--kt-ai-bg-elevated);
}
.up-zone .doc-ic {
display: inline-grid; place-items: center; width: 34px; height: 34px;
border-radius: var(--kt-ai-radius-lg); background: var(--kt-ai-bg-soft); color: var(--kt-ai-fg-muted);
}
.up-zone .z-name { font-size: var(--kt-ai-text-sm); font-weight: var(--kt-ai-weight-medium); color: var(--kt-ai-fg); }
.up-zone .z-file { font-size: var(--kt-ai-text-xs); color: var(--kt-ai-fg-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.up-zone .z-file .dim { color: var(--kt-ai-fg-faint); }
.up-list { display: flex; flex-direction: column; }
.up-list .kt-ai-doc { margin-bottom: var(--kt-ai-space-3); }
.up-bar { display: flex; gap: var(--kt-ai-space-4); flex-wrap: wrap; align-items: center; }
/* --- Экран 2: нарушений --- */
.viol-card {
display: flex; align-items: flex-start; gap: var(--kt-ai-space-4);
padding: var(--kt-ai-space-5);
border: 1px solid var(--kt-ai-border); border-radius: var(--kt-ai-radius-xl);
background: var(--kt-ai-bg-elevated);
}
.viol-vic {
display: inline-grid; place-items: center; width: 30px; height: 30px; flex-shrink: 0;
border-radius: var(--kt-ai-radius-lg); background: var(--kt-ai-bg-soft); color: var(--kt-ai-fg-muted);
}
.viol-vic[data-t="contra"] { background: var(--kt-ai-status-warn-bg); color: var(--kt-ai-status-warn-fg); }
.viol-vic[data-t="norm"] { background: var(--kt-ai-status-info-bg); color: var(--kt-ai-status-info-fg); }
.viol-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: var(--kt-ai-space-2); }
.viol-desc { font-size: var(--kt-ai-text-sm); }
.viol-meta { font-size: var(--kt-ai-text-xs); color: var(--kt-ai-fg-muted); }
.viol-actions { display: flex; flex-wrap: wrap; gap: var(--kt-ai-space-3); align-items: center; margin-left: auto; }
.viol-card[data-done="true"] { opacity: .78; background: var(--kt-ai-bg-soft); }
.viol-card[data-done="true"] .viol-vic { background: var(--kt-ai-status-ok-bg); color: var(--kt-ai-status-ok-fg); }
/* --- Экран 3: заключение --- */
.concl-layout { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: var(--kt-ai-space-6); align-items: start; }
.concl-side { display: flex; flex-direction: column; gap: var(--kt-ai-space-5); }
.doc-ref { display: flex; align-items: center; gap: var(--kt-ai-space-3); padding: var(--kt-ai-space-3) 0; border-bottom: 1px solid var(--kt-ai-divider); font-size: var(--kt-ai-text-sm); }
.doc-ref:last-child { border-bottom: 0; }
.doc-ref .kt-icon { color: var(--kt-ai-fg-faint); flex-shrink: 0; }
.doc-ref .r { font-weight: var(--kt-ai-weight-medium); min-width: 150px; flex-shrink: 0; }
.doc-ref .dim { color: var(--kt-ai-fg-muted); font-size: var(--kt-ai-text-xs); }
#conclText { min-height: 320px; font-size: var(--kt-ai-text-sm); }
/* --- Экран 4: согласование --- */
.approve-text {
padding: var(--kt-ai-space-6);
border: 1px solid var(--kt-ai-border); border-radius: var(--kt-ai-radius-xl);
background: var(--kt-ai-bg-elevated);
font-size: var(--kt-ai-text-sm); line-height: var(--kt-ai-leading-normal);
white-space: pre-wrap;
}
.approve-viol { display: flex; gap: var(--kt-ai-space-3); padding: var(--kt-ai-space-3) 0; border-bottom: 1px solid var(--kt-ai-divider); font-size: var(--kt-ai-text-sm); }
.approve-viol:last-child { border-bottom: 0; }
.approve-viol .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--kt-ai-status-warn-fg); margin-top: 8px; flex-shrink: 0; }
.approve-viol .dim { font-size: var(--kt-ai-text-xs); color: var(--kt-ai-fg-muted); margin-top: 2px; }
.reject-wrap { display: flex; flex-direction: column; gap: var(--kt-ai-space-3); margin-top: var(--kt-ai-space-5); }
/* --- Экран 5: о решении --- */
.pass-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--kt-ai-space-4); }
.pass-grid .kt-ai-kpi { padding: var(--kt-ai-space-5); }
.pass-grid2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--kt-ai-space-4); align-items: start; }
.pass-sec { font-size: var(--kt-ai-text-lg); font-weight: var(--kt-ai-weight-semibold); letter-spacing: -.01em; margin-top: var(--kt-ai-space-3); }
.psteps { display: flex; flex-direction: column; gap: var(--kt-ai-space-2); }
.pstep { display: flex; gap: var(--kt-ai-space-4); align-items: flex-start; padding: var(--kt-ai-space-3) 0; font-size: var(--kt-ai-text-sm); }
.pstep .n {
width: 20px; height: 20px; border-radius: 50%; flex-shrink: 0; margin-top: 1px;
display: inline-flex; align-items: center; justify-content: center;
font-size: var(--kt-ai-text-2xs); font-weight: var(--kt-ai-weight-bold);
background: var(--kt-ai-primary-subtle); color: var(--kt-ai-primary);
}
.pstep.ai .n { background: var(--kt-ai-primary); color: var(--kt-ai-fg-on-fill); }
.pstep .who { font-size: var(--kt-ai-text-2xs); color: var(--kt-ai-fg-faint); display: block; margin-top: 2px; }
/* --- Drawer --- */
.d-title { font-size: var(--kt-ai-text-lg); font-weight: var(--kt-ai-weight-semibold); }
.d-sub { font-size: var(--kt-ai-text-xs); color: var(--kt-ai-fg-muted); margin-top: 2px; }
.d-close { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: var(--kt-ai-radius-lg); border: 1px solid var(--kt-ai-border); background: var(--kt-ai-bg-elevated); color: var(--kt-ai-fg-muted); cursor: pointer; }
.d-close:hover { background: var(--kt-ai-bg-hover); color: var(--kt-ai-fg); }
/* --- Модалка возврата (редактор комментария) --- */
#rejectModal { margin: 0 auto; max-width: 480px; }
/* --- Узкие экраны --- */
@media (max-width: 860px) {
.concl-layout, .pass-grid2 { grid-template-columns: 1fr; }
}
@media (max-width: 639.98px) {
.view { padding: var(--kt-ai-space-5) var(--kt-ai-space-4) var(--kt-ai-space-10); }
.up-grid, .up-zones, .pass-grid { grid-template-columns: 1fr; }
.viol-actions { margin-left: 0; width: 100%; justify-content: flex-start; }
.doc-ref .r { min-width: 110px; }
}