Download frontend/src/styles/app.css from stadv/sipracd: direct link, hf CLI and curl.
- Browser
- Download file 58.7 kB
-
https://huggingface.co/spaces/stadv/sipracd/resolve/main/frontend/src/styles/app.css
- Command line
-
hf download hf://spaces/stadv/sipracd/frontend/src/styles/app.css
-
curl -L -o app.css https://huggingface.co/spaces/stadv/sipracd/resolve/main/frontend/src/styles/app.css
58.7 kB
| :root { | |
| font-family: "Aptos", "Segoe UI", "Helvetica Neue", Arial, sans-serif; | |
| color: #1f2d3a; | |
| background: | |
| radial-gradient(circle at top left, rgba(210, 231, 247, 0.85), transparent 30%), | |
| radial-gradient(circle at top right, rgba(239, 227, 209, 0.35), transparent 24%), | |
| linear-gradient(180deg, #eef3f5 0%, #f8fafb 48%, #eef2f4 100%); | |
| --bg: #f4f7f8; | |
| --panel: rgba(255, 255, 255, 0.96); | |
| --panel-strong: #ffffff; | |
| --panel-soft: #f8fbfc; | |
| --panel-accent: #eef5f7; | |
| --border: #d7e0e6; | |
| --border-strong: #c4d2db; | |
| --text: #1f2d3a; | |
| --muted: #687a8b; | |
| --title: #10202d; | |
| --accent: #236e83; | |
| --accent-strong: #184f61; | |
| --accent-soft: #e7f1f3; | |
| --warning-bg: #fff3e3; | |
| --warning-text: #9a5600; | |
| --info-bg: #e8f4fb; | |
| --info-text: #12638f; | |
| --ok-bg: #e9f6ef; | |
| --ok-text: #1f6a45; | |
| --shadow: 0 24px 60px rgba(28, 52, 70, 0.08); | |
| --shadow-soft: 0 14px 36px rgba(28, 52, 70, 0.06); | |
| --radius-lg: 24px; | |
| --radius-md: 18px; | |
| --radius-sm: 14px; | |
| } | |
| * { | |
| box-sizing: border-box; | |
| } | |
| html, | |
| body, | |
| #root { | |
| min-height: 100%; | |
| } | |
| body { | |
| margin: 0; | |
| background: var(--bg); | |
| color: var(--text); | |
| } | |
| a { | |
| color: inherit; | |
| text-decoration: none; | |
| } | |
| button, | |
| input, | |
| select, | |
| textarea { | |
| font: inherit; | |
| } | |
| button { | |
| border: 0; | |
| } | |
| .app-shell { | |
| min-height: 100vh; | |
| display: block; | |
| } | |
| .app-header { | |
| position: sticky; | |
| top: 0; | |
| z-index: 20; | |
| padding: 0 24px; | |
| background: rgba(244, 247, 248, 0.92); | |
| border-bottom: 1px solid rgba(199, 212, 221, 0.72); | |
| backdrop-filter: blur(6px); | |
| transition: transform 0.24s ease, opacity 0.24s ease; | |
| will-change: transform; | |
| } | |
| .app-shell-header-collapsed .app-header { | |
| transform: translateY(calc(-100% - 8px)); | |
| opacity: 0; | |
| pointer-events: none; | |
| } | |
| .app-header-inner { | |
| width: min(1600px, 100%); | |
| margin: 0 auto; | |
| display: flex; | |
| justify-content: space-between; | |
| align-items: center; | |
| gap: 16px; | |
| padding: 7px 0; | |
| } | |
| .sidebar-brand { | |
| display: flex; | |
| align-items: baseline; | |
| gap: 10px; | |
| min-width: 0; | |
| } | |
| .sidebar h1, | |
| .topbar h2, | |
| .section-header h3, | |
| .timeline-card h4, | |
| .info-card h4, | |
| .stat-card strong, | |
| .form-section h4, | |
| .process-main h4, | |
| .evaluator-card-head h4 { | |
| margin: 0; | |
| color: var(--title); | |
| } | |
| .sidebar h1 { | |
| font-size: 1.05rem; | |
| line-height: 1; | |
| } | |
| .sidebar-copy, | |
| .panel-title, | |
| .cell-subtitle, | |
| .feedback, | |
| .timeline-card p, | |
| .info-card p, | |
| th, | |
| td, | |
| dt, | |
| dd, | |
| label, | |
| .plain-note { | |
| color: var(--muted); | |
| } | |
| .sidebar-copy { | |
| margin: 0; | |
| line-height: 1.3; | |
| font-size: 0.84rem; | |
| white-space: nowrap; | |
| } | |
| .nav { | |
| display: flex; | |
| flex-wrap: wrap; | |
| justify-content: flex-end; | |
| gap: 6px; | |
| } | |
| .nav-link { | |
| display: inline-flex; | |
| align-items: center; | |
| justify-content: center; | |
| min-height: 32px; | |
| padding: 0 11px; | |
| border: 1px solid transparent; | |
| border-radius: 12px; | |
| color: var(--text); | |
| font-size: 0.9rem; | |
| transition: background-color 0.18s ease, color 0.18s ease, transform 0.18s ease, border-color 0.18s ease; | |
| } | |
| .nav-link:hover, | |
| .nav-link.active { | |
| background: var(--accent-soft); | |
| color: var(--accent-strong); | |
| border-color: rgba(171, 204, 214, 0.7); | |
| font-weight: 700; | |
| transform: translateY(-1px); | |
| } | |
| .main-content { | |
| width: min(1600px, calc(100vw - 48px)); | |
| margin: 0 auto; | |
| padding: 18px 0 48px; | |
| } | |
| .topbar { | |
| display: flex; | |
| justify-content: space-between; | |
| align-items: center; | |
| gap: 16px; | |
| margin-bottom: 30px; | |
| padding: 6px 4px 0; | |
| } | |
| .topbar h2 { | |
| flex: 1 1 auto; | |
| font-size: clamp(1.7rem, 2vw, 2.1rem); | |
| line-height: 1.2; | |
| letter-spacing: -0.02em; | |
| } | |
| .topbar-action { | |
| flex: 0 0 auto; | |
| display: flex; | |
| align-items: center; | |
| } | |
| .page-grid { | |
| display: grid; | |
| gap: 24px; | |
| } | |
| .stats-grid { | |
| display: grid; | |
| grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); | |
| gap: 18px; | |
| } | |
| .section-card, | |
| .stat-card, | |
| .timeline-card, | |
| .info-card { | |
| background: var(--panel); | |
| border: 1px solid rgba(216, 227, 235, 0.86); | |
| border-radius: var(--radius-lg); | |
| box-shadow: var(--shadow-soft); | |
| } | |
| .stat-card, | |
| .section-card, | |
| .timeline-card, | |
| .info-card { | |
| padding: 26px; | |
| } | |
| .section-card { | |
| display: grid; | |
| gap: 24px; | |
| align-content: start; | |
| } | |
| .stat-card { | |
| background: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(246, 250, 251, 0.96) 100%); | |
| } | |
| .stat-card strong { | |
| display: block; | |
| margin: 8px 0 6px; | |
| font-size: 2rem; | |
| } | |
| .panel-title { | |
| font-size: 0.86rem; | |
| font-weight: 700; | |
| letter-spacing: 0.02em; | |
| } | |
| .eyebrow { | |
| margin: 0 0 8px; | |
| color: var(--accent-strong); | |
| font-size: 0.76rem; | |
| letter-spacing: 0.08em; | |
| text-transform: uppercase; | |
| font-weight: 700; | |
| } | |
| .eyebrow-button { | |
| display: block; | |
| margin: 0 0 8px; | |
| padding: 0; | |
| background: transparent; | |
| color: var(--accent-strong); | |
| font-size: 0.76rem; | |
| letter-spacing: 0.08em; | |
| text-transform: uppercase; | |
| font-weight: 700; | |
| text-align: left; | |
| cursor: pointer; | |
| border-bottom: 1px dashed transparent; | |
| transition: color 0.16s ease, border-color 0.16s ease; | |
| } | |
| .eyebrow-button:hover { | |
| color: var(--accent); | |
| border-color: rgba(35, 110, 131, 0.35); | |
| } | |
| .section-header, | |
| .timeline-head, | |
| .detail-header, | |
| .header-actions, | |
| .timeline-entry-head { | |
| display: flex; | |
| justify-content: space-between; | |
| align-items: start; | |
| gap: 14px; | |
| } | |
| .section-card > .section-header { | |
| padding-bottom: 18px; | |
| border-bottom: 1px solid rgba(216, 227, 235, 0.72); | |
| } | |
| .section-header h3 { | |
| font-size: 1.28rem; | |
| letter-spacing: -0.01em; | |
| } | |
| .detail-header { | |
| margin-bottom: 22px; | |
| } | |
| .detail-header h3 { | |
| margin: 0 0 8px; | |
| color: var(--title); | |
| } | |
| .section-title-row { | |
| display: flex; | |
| justify-content: space-between; | |
| align-items: center; | |
| gap: 14px; | |
| margin-bottom: 20px; | |
| } | |
| .section-title-row h4 { | |
| margin: 0; | |
| } | |
| .detail-header p { | |
| margin: 0; | |
| } | |
| .hero-summary-list { | |
| margin-top: 0 ; | |
| } | |
| .detail-hero { | |
| padding: 28px 30px; | |
| border-radius: var(--radius-md); | |
| border: 1px solid rgba(210, 223, 230, 0.92); | |
| background: | |
| radial-gradient(circle at top right, rgba(255, 234, 208, 0.42), transparent 26%), | |
| linear-gradient(135deg, rgba(231, 243, 247, 0.98) 0%, rgba(255, 255, 255, 0.99) 72%); | |
| } | |
| .detail-hero h3 { | |
| font-size: 1.8rem; | |
| line-height: 1.1; | |
| margin-bottom: 14px; | |
| } | |
| .hero-title-button { | |
| display: block; | |
| margin: 0 0 14px; | |
| padding: 0; | |
| background: transparent; | |
| color: var(--title); | |
| font-size: 1.8rem; | |
| font-weight: 800; | |
| line-height: 1.1; | |
| text-align: left; | |
| cursor: pointer; | |
| border-bottom: 1px dashed transparent; | |
| transition: color 0.16s ease, border-color 0.16s ease; | |
| } | |
| .hero-title-button:hover { | |
| color: var(--accent-strong); | |
| border-color: rgba(35, 110, 131, 0.35); | |
| } | |
| .detail-hero-form { | |
| margin-bottom: 6px; | |
| } | |
| .hero-heading { | |
| display: grid; | |
| gap: 4px; | |
| } | |
| .kanban-grid { | |
| display: grid; | |
| grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); | |
| gap: 16px; | |
| } | |
| .timeline-card, | |
| .process-row, | |
| .evaluator-card, | |
| .timeline-entry, | |
| .subform-block { | |
| transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease; | |
| } | |
| .timeline-card:hover, | |
| .process-row:hover, | |
| .evaluator-card:hover { | |
| transform: translateY(-1px); | |
| box-shadow: var(--shadow); | |
| } | |
| .timeline-card dl, | |
| .info-card dl { | |
| display: grid; | |
| gap: 12px; | |
| margin: 18px 0 0; | |
| } | |
| dl div { | |
| display: grid; | |
| gap: 4px; | |
| } | |
| dt { | |
| font-size: 0.84rem; | |
| font-weight: 700; | |
| text-transform: uppercase; | |
| letter-spacing: 0.04em; | |
| color: var(--accent-strong); | |
| } | |
| dd { | |
| margin: 0; | |
| color: var(--text); | |
| font-size: 1rem; | |
| line-height: 1.55; | |
| } | |
| .table-wrap { | |
| overflow-x: auto; | |
| border-radius: var(--radius-md); | |
| border: 1px solid rgba(216, 227, 235, 0.78); | |
| background: rgba(255, 255, 255, 0.84); | |
| } | |
| .property-table-wrap { | |
| overflow-x: visible; | |
| overflow-y: visible; | |
| max-height: none; | |
| border-radius: 0; | |
| } | |
| .property-table-note { | |
| margin: 0; | |
| padding: 12px 14px 0; | |
| } | |
| table { | |
| width: 100%; | |
| border-collapse: collapse; | |
| } | |
| th, | |
| td { | |
| padding: 15px 16px; | |
| border-bottom: 1px solid rgba(216, 227, 235, 0.72); | |
| text-align: left; | |
| vertical-align: top; | |
| line-height: 1.55; | |
| } | |
| th { | |
| font-weight: 700; | |
| color: var(--title); | |
| background: rgba(237, 245, 251, 0.9); | |
| } | |
| tbody tr:last-child td { | |
| border-bottom: 0; | |
| } | |
| .filters, | |
| .form-grid { | |
| display: grid; | |
| gap: 16px; | |
| } | |
| .filters { | |
| grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); | |
| margin-bottom: 22px; | |
| } | |
| .filters label, | |
| .form-grid label, | |
| .timeline-form label { | |
| display: grid; | |
| gap: 7px; | |
| font-weight: 700; | |
| color: var(--title); | |
| } | |
| .form-inline-note { | |
| align-self: end; | |
| margin: 0; | |
| padding-bottom: 2px; | |
| line-height: 1.55; | |
| } | |
| .inline-note-card { | |
| display: grid; | |
| gap: 6px; | |
| align-content: center; | |
| padding: 12px 14px; | |
| border: 1px dashed rgba(171, 204, 214, 0.9); | |
| border-radius: 14px; | |
| background: rgba(244, 249, 251, 0.72); | |
| } | |
| .inline-note-card strong { | |
| color: var(--title); | |
| } | |
| .scope-status-chip-list { | |
| display: flex; | |
| flex-wrap: wrap; | |
| gap: 10px; | |
| } | |
| .scope-status-chip { | |
| display: inline-flex; | |
| align-items: center; | |
| min-height: 48px; | |
| padding: 10px 14px; | |
| border: 1px solid rgba(216, 227, 235, 0.82); | |
| border-radius: 999px; | |
| background: rgba(248, 251, 252, 0.94); | |
| color: var(--title); | |
| text-align: left; | |
| cursor: pointer; | |
| transition: transform 0.16s ease, border-color 0.16s ease, background-color 0.16s ease; | |
| } | |
| .scope-status-chip:hover { | |
| transform: translateY(-1px); | |
| border-color: rgba(137, 175, 188, 0.95); | |
| background: #ffffff; | |
| } | |
| .scope-status-chip:disabled { | |
| cursor: default; | |
| opacity: 0.72; | |
| transform: none; | |
| } | |
| .scope-status-chip:disabled:hover { | |
| transform: none; | |
| border-color: rgba(216, 227, 235, 0.82); | |
| background: rgba(248, 251, 252, 0.94); | |
| } | |
| .scope-status-chip-active { | |
| border-color: rgba(35, 110, 131, 0.35); | |
| background: rgba(231, 243, 246, 0.96); | |
| } | |
| .scope-status-chip span { | |
| display: grid; | |
| gap: 3px; | |
| } | |
| .scope-status-chip small { | |
| color: var(--muted); | |
| font-size: 0.8rem; | |
| font-weight: 600; | |
| } | |
| .section-inline-note { | |
| margin: 0 0 12px; | |
| } | |
| input, | |
| select, | |
| textarea { | |
| width: 100%; | |
| background: rgba(255, 255, 255, 0.98); | |
| color: var(--text); | |
| border: 1px solid var(--border); | |
| border-radius: 14px; | |
| padding: 12px 14px; | |
| transition: border-color 0.18s ease, box-shadow 0.18s ease, background-color 0.18s ease; | |
| } | |
| select.multi-select { | |
| min-height: 132px; | |
| padding-block: 8px; | |
| } | |
| textarea { | |
| resize: vertical; | |
| line-height: 1.6; | |
| } | |
| input:focus, | |
| select:focus, | |
| textarea:focus { | |
| outline: none; | |
| border-color: #8fb9c6; | |
| box-shadow: 0 0 0 4px rgba(35, 110, 131, 0.12); | |
| background: #ffffff; | |
| } | |
| .status-badge { | |
| display: inline-flex; | |
| align-items: center; | |
| justify-content: center; | |
| padding: 7px 11px; | |
| border-radius: 999px; | |
| font-size: 0.8rem; | |
| font-weight: 700; | |
| letter-spacing: 0.01em; | |
| } | |
| .status-sem_atribuicao, | |
| .status-pendente_revisao, | |
| .status-em_ajuste, | |
| .status-pendente { | |
| background: var(--warning-bg); | |
| color: var(--warning-text); | |
| } | |
| .status-com_avaliador { | |
| background: #eef2f5; | |
| color: #5f6f7d; | |
| } | |
| .status-revisado, | |
| .status-ativa, | |
| .status-planejada { | |
| background: var(--info-bg); | |
| color: var(--info-text); | |
| } | |
| .status-pronto, | |
| .status-enviado, | |
| .status-concluido, | |
| .status-concluida { | |
| background: var(--ok-bg); | |
| color: var(--ok-text); | |
| } | |
| .ghost-link, | |
| .primary-button, | |
| .secondary-button { | |
| display: inline-flex; | |
| align-items: center; | |
| justify-content: center; | |
| min-height: 42px; | |
| padding: 0 15px; | |
| border-radius: 14px; | |
| cursor: pointer; | |
| transition: transform 0.16s ease, background-color 0.16s ease, border-color 0.16s ease, color 0.16s ease; | |
| } | |
| .ghost-link, | |
| .secondary-button { | |
| border: 1px solid var(--border); | |
| background: rgba(255, 255, 255, 0.92); | |
| color: var(--text); | |
| } | |
| .primary-button { | |
| border: 1px solid var(--accent); | |
| background: linear-gradient(180deg, var(--accent) 0%, var(--accent-strong) 100%); | |
| color: #fff; | |
| font-weight: 700; | |
| } | |
| .ghost-link:hover, | |
| .secondary-button:hover, | |
| .primary-button:hover { | |
| transform: translateY(-1px); | |
| } | |
| .ghost-link:hover, | |
| .secondary-button:hover { | |
| background: #ffffff; | |
| border-color: var(--border-strong); | |
| } | |
| .primary-button:hover { | |
| background: linear-gradient(180deg, #1d6578 0%, #154f60 100%); | |
| } | |
| .ghost-link:disabled, | |
| .primary-button:disabled, | |
| .secondary-button:disabled { | |
| cursor: default; | |
| opacity: 0.62; | |
| transform: none; | |
| } | |
| .ghost-link:disabled:hover, | |
| .primary-button:disabled:hover, | |
| .secondary-button:disabled:hover { | |
| transform: none; | |
| } | |
| .process-shortcut-button { | |
| box-shadow: 0 10px 24px rgba(24, 79, 97, 0.18); | |
| } | |
| .stat-strip { | |
| display: flex; | |
| gap: 18px; | |
| flex-wrap: wrap; | |
| margin-bottom: 16px; | |
| color: var(--muted); | |
| } | |
| .detail-grid { | |
| display: grid; | |
| grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); | |
| gap: 22px; | |
| align-items: start; | |
| } | |
| .detail-grid-stacked { | |
| grid-template-columns: 1fr; | |
| gap: 16px; | |
| } | |
| .stack-row { | |
| display: grid; | |
| gap: 5px; | |
| } | |
| .form-grid { | |
| grid-template-columns: repeat(2, minmax(0, 1fr)); | |
| gap: 22px; | |
| } | |
| .wide { | |
| grid-column: 1 / -1; | |
| } | |
| .form-section { | |
| display: grid; | |
| gap: 16px; | |
| padding: 26px; | |
| border: 1px solid rgba(216, 227, 235, 0.84); | |
| border-radius: var(--radius-md); | |
| background: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(248, 251, 252, 0.96) 100%); | |
| position: relative; | |
| overflow: hidden; | |
| } | |
| .form-section::before { | |
| content: ""; | |
| position: absolute; | |
| inset: 0 auto auto 0; | |
| width: 100%; | |
| height: 4px; | |
| background: linear-gradient(90deg, rgba(35, 110, 131, 0.9) 0%, rgba(134, 191, 205, 0.5) 100%); | |
| } | |
| .form-section h4 { | |
| margin: 0 0 10px; | |
| font-size: 1.1rem; | |
| line-height: 1.25; | |
| font-weight: 800; | |
| letter-spacing: 0.01em; | |
| text-transform: none; | |
| color: var(--title); | |
| } | |
| .form-columns { | |
| display: grid; | |
| gap: 14px; | |
| } | |
| .form-columns.two { | |
| grid-template-columns: repeat(2, minmax(0, 1fr)); | |
| } | |
| .form-columns.one { | |
| grid-template-columns: minmax(0, 1fr); | |
| } | |
| .form-columns.three { | |
| grid-template-columns: repeat(3, minmax(0, 1fr)); | |
| } | |
| .form-columns.four { | |
| grid-template-columns: repeat(4, minmax(0, 1fr)); | |
| } | |
| .form-actions { | |
| display: flex; | |
| justify-content: flex-start; | |
| } | |
| .subform-block { | |
| display: grid; | |
| gap: 12px; | |
| padding: 16px; | |
| border: 1px solid rgba(216, 227, 235, 0.8); | |
| border-radius: var(--radius-sm); | |
| background: rgba(255, 255, 255, 0.97); | |
| } | |
| .subform-head { | |
| display: flex; | |
| justify-content: space-between; | |
| align-items: center; | |
| gap: 12px; | |
| } | |
| .subform-head strong { | |
| color: var(--title); | |
| font-size: 0.98rem; | |
| } | |
| .danger-button { | |
| color: #a43833; | |
| border-color: #edc8c4; | |
| background: #fff6f5; | |
| } | |
| .danger-button:hover { | |
| border-color: #dfaba5; | |
| background: #fff1f0; | |
| } | |
| .feedback { | |
| padding: 14px 16px; | |
| border-radius: 14px; | |
| background: #edf4fb; | |
| border: 1px solid #d7e6f4; | |
| } | |
| .feedback.error { | |
| background: #fff1f0; | |
| color: #a43833; | |
| border-color: #f2d1ce; | |
| } | |
| .loading-state { | |
| display: grid; | |
| justify-items: center; | |
| gap: 14px; | |
| padding: 42px 24px; | |
| border: 1px solid rgba(216, 227, 235, 0.82); | |
| border-radius: var(--radius-md); | |
| background: linear-gradient(180deg, rgba(248, 251, 252, 0.98) 0%, rgba(243, 248, 250, 0.96) 100%); | |
| } | |
| .loading-spinner { | |
| width: 34px; | |
| height: 34px; | |
| border-radius: 999px; | |
| border: 3px solid rgba(35, 110, 131, 0.18); | |
| border-top-color: var(--accent); | |
| animation: spinner-rotate 0.8s linear infinite; | |
| } | |
| .loading-text { | |
| color: var(--accent-strong); | |
| font-weight: 700; | |
| } | |
| @keyframes spinner-rotate { | |
| from { | |
| transform: rotate(0deg); | |
| } | |
| to { | |
| transform: rotate(360deg); | |
| } | |
| } | |
| .process-list, | |
| .cronogramas-list, | |
| .timeline-list, | |
| .section-list { | |
| display: grid; | |
| gap: 16px; | |
| } | |
| .cronogramas-list { | |
| grid-template-columns: repeat(2, minmax(0, 1fr)); | |
| } | |
| .process-row { | |
| display: grid; | |
| grid-template-columns: minmax(0, 1.35fr) minmax(300px, 0.95fr); | |
| gap: 22px; | |
| padding: 22px; | |
| border: 1px solid rgba(216, 227, 235, 0.82); | |
| border-radius: var(--radius-md); | |
| background: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(249, 251, 252, 0.97) 100%); | |
| } | |
| .cronograma-row { | |
| display: grid; | |
| grid-template-columns: minmax(0, 1.2fr) minmax(260px, 0.8fr); | |
| gap: 22px; | |
| padding: 22px; | |
| border: 1px solid rgba(216, 227, 235, 0.82); | |
| border-radius: var(--radius-md); | |
| background: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(249, 251, 252, 0.97) 100%); | |
| transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease; | |
| } | |
| .process-row:hover, | |
| .cronograma-row:hover, | |
| .evaluator-card:hover { | |
| border-color: #b7cfde; | |
| } | |
| .cronograma-row:hover { | |
| transform: translateY(-1px); | |
| box-shadow: var(--shadow); | |
| } | |
| .process-main { | |
| display: grid; | |
| gap: 7px; | |
| } | |
| .process-heading { | |
| display: grid; | |
| gap: 10px; | |
| } | |
| .cronograma-main { | |
| display: grid; | |
| gap: 7px; | |
| } | |
| .process-main h4 { | |
| margin: 0; | |
| font-size: 1.08rem; | |
| line-height: 1.35; | |
| } | |
| .cronograma-main h4 { | |
| margin: 0; | |
| font-size: 1.08rem; | |
| line-height: 1.35; | |
| color: var(--title); | |
| } | |
| .process-main p, | |
| .timeline-entry p { | |
| margin: 0; | |
| } | |
| .process-meta, | |
| .cronograma-meta, | |
| .evaluator-card-meta { | |
| display: grid; | |
| grid-template-columns: repeat(auto-fit, minmax(118px, 1fr)); | |
| gap: 14px 18px; | |
| align-items: start; | |
| } | |
| .process-meta > div, | |
| .cronograma-meta > div, | |
| .evaluator-meta { | |
| display: grid; | |
| gap: 4px; | |
| min-width: 110px; | |
| } | |
| .process-meta strong, | |
| .cronograma-meta strong, | |
| .evaluator-meta strong { | |
| color: var(--title); | |
| } | |
| .gs-row { | |
| cursor: default; | |
| } | |
| .gs-row .timeline-head { | |
| justify-content: flex-start; | |
| align-items: center; | |
| gap: 8px; | |
| } | |
| .gs-row:hover { | |
| transform: none; | |
| box-shadow: var(--shadow-soft); | |
| border-color: rgba(216, 227, 235, 0.82); | |
| } | |
| .gs-meta { | |
| grid-template-columns: repeat(3, minmax(112px, 1fr)); | |
| } | |
| .registration-row { | |
| align-items: start; | |
| } | |
| .registration-row-simple { | |
| grid-template-columns: minmax(0, 1fr); | |
| } | |
| .registration-inline-grid { | |
| display: grid; | |
| grid-template-columns: minmax(180px, 1fr) minmax(180px, 0.9fr) minmax(280px, 1.5fr) minmax(180px, 1fr); | |
| gap: 18px; | |
| width: 100%; | |
| align-items: start; | |
| } | |
| .registration-inline-item { | |
| display: grid; | |
| gap: 6px; | |
| min-width: 0; | |
| } | |
| .registration-inline-item .plain-note { | |
| margin: 0; | |
| font-size: 0.72rem; | |
| font-weight: 800; | |
| letter-spacing: 0.05em; | |
| text-transform: uppercase; | |
| } | |
| .registration-inline-item strong, | |
| .registration-inline-text { | |
| color: var(--title); | |
| font-size: 1rem; | |
| line-height: 1.4; | |
| } | |
| .registration-inline-primary { | |
| font-size: 1.08rem ; | |
| } | |
| .registration-inline-text { | |
| display: block; | |
| } | |
| .registration-heading { | |
| display: flex; | |
| flex-wrap: wrap; | |
| align-items: center; | |
| gap: 8px 12px; | |
| } | |
| .registration-heading h4 { | |
| margin: 0; | |
| color: var(--title); | |
| font-size: 1.08rem; | |
| line-height: 1.35; | |
| } | |
| .registration-group-chip { | |
| display: inline-flex; | |
| align-items: center; | |
| justify-content: center; | |
| padding: 6px 10px; | |
| border-radius: 999px; | |
| background: rgba(231, 241, 247, 0.92); | |
| color: var(--accent-strong); | |
| font-size: 0.78rem; | |
| font-weight: 700; | |
| } | |
| .registration-process-note { | |
| color: var(--muted); | |
| } | |
| .evaluator-grid { | |
| display: grid; | |
| grid-template-columns: repeat(auto-fit, minmax(210px, 240px)); | |
| gap: 16px; | |
| } | |
| .evaluator-card { | |
| display: grid; | |
| gap: 18px; | |
| padding: 20px; | |
| border: 1px solid rgba(216, 227, 235, 0.82); | |
| border-radius: var(--radius-md); | |
| background: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(246, 250, 251, 0.96) 100%); | |
| align-content: start; | |
| } | |
| .evaluator-card-head { | |
| display: grid; | |
| justify-items: center; | |
| text-align: center; | |
| } | |
| .evaluator-card-head h4 { | |
| font-size: 1rem; | |
| line-height: 1.3; | |
| text-transform: uppercase; | |
| letter-spacing: 0.08em; | |
| } | |
| .evaluator-card-meta { | |
| grid-template-columns: repeat(2, minmax(0, 1fr)); | |
| gap: 12px; | |
| } | |
| .evaluator-meta { | |
| justify-items: center; | |
| text-align: center; | |
| min-width: 0; | |
| } | |
| .team-intro { | |
| margin-top: -6px; | |
| } | |
| .team-intro p { | |
| margin: 0; | |
| } | |
| .team-periods { | |
| display: grid; | |
| gap: 16px; | |
| padding-top: 6px; | |
| } | |
| .team-periods-head { | |
| display: grid; | |
| gap: 6px; | |
| } | |
| .team-periods-head h4 { | |
| margin: 0; | |
| color: var(--title); | |
| font-size: 1.02rem; | |
| } | |
| .team-periods-head p { | |
| margin: 0; | |
| } | |
| .catalog-field { | |
| display: grid; | |
| gap: 10px; | |
| } | |
| .evaluator-card-head { | |
| display: grid; | |
| gap: 6px; | |
| } | |
| .evaluator-card-head h4 { | |
| font-size: 1rem; | |
| } | |
| .timeline-entry { | |
| display: grid; | |
| gap: 10px; | |
| padding: 18px; | |
| border: 1px solid rgba(216, 227, 235, 0.82); | |
| border-radius: var(--radius-sm); | |
| background: rgba(248, 251, 252, 0.95); | |
| } | |
| .timeline-entry-automatic { | |
| border-color: rgba(171, 204, 214, 0.9); | |
| background: linear-gradient(180deg, rgba(238, 247, 249, 0.98) 0%, rgba(248, 251, 252, 0.96) 100%); | |
| } | |
| .timeline-outcome { | |
| color: var(--accent-strong); | |
| } | |
| .timeline-form { | |
| display: grid; | |
| gap: 16px; | |
| margin: 10px 0 20px; | |
| padding: 22px; | |
| border: 1px solid rgba(216, 227, 235, 0.84); | |
| border-radius: var(--radius-md); | |
| background: linear-gradient(180deg, rgba(244, 249, 250, 0.98) 0%, rgba(255, 255, 255, 0.97) 100%); | |
| } | |
| .info-section { | |
| padding: 26px; | |
| background: | |
| linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(248, 251, 252, 0.96) 100%); | |
| position: relative; | |
| overflow: hidden; | |
| } | |
| .info-section::before { | |
| content: ""; | |
| position: absolute; | |
| inset: 0 auto auto 0; | |
| width: 100%; | |
| height: 4px; | |
| background: linear-gradient(90deg, rgba(35, 110, 131, 0.9) 0%, rgba(134, 191, 205, 0.5) 100%); | |
| } | |
| .info-section h4 { | |
| margin-bottom: 16px; | |
| padding-bottom: 0; | |
| border-bottom: 0; | |
| font-size: 1.1rem; | |
| line-height: 1.25; | |
| font-weight: 800; | |
| letter-spacing: 0.01em; | |
| text-transform: none; | |
| color: var(--title); | |
| } | |
| .info-section-strong { | |
| background: | |
| linear-gradient(180deg, rgba(240, 248, 250, 0.98) 0%, rgba(255, 255, 255, 0.97) 100%); | |
| border-color: rgba(195, 216, 223, 0.9); | |
| } | |
| .process-lock-banner { | |
| border-color: rgba(233, 96, 87, 0.2); | |
| background: | |
| linear-gradient(180deg, rgba(255, 247, 246, 0.98) 0%, rgba(255, 255, 255, 0.97) 100%); | |
| } | |
| .process-lock-banner::before { | |
| background: linear-gradient(90deg, rgba(180, 35, 24, 0.86) 0%, rgba(236, 137, 128, 0.42) 100%); | |
| } | |
| .process-lock-banner p { | |
| margin: 0; | |
| } | |
| .keyword-strip { | |
| padding: 18px 22px; | |
| background: linear-gradient(180deg, rgba(243, 248, 250, 0.98) 0%, rgba(255, 255, 255, 0.97) 100%); | |
| } | |
| .keyword-editor { | |
| gap: 12px; | |
| } | |
| .keyword-pills { | |
| display: flex; | |
| flex-wrap: wrap; | |
| gap: 10px; | |
| } | |
| .keyword-pill { | |
| display: inline-flex; | |
| align-items: center; | |
| gap: 8px; | |
| min-height: 34px; | |
| padding: 0 12px; | |
| border: 1px solid rgba(189, 214, 222, 0.9); | |
| border-radius: 999px; | |
| background: rgba(255, 255, 255, 0.86); | |
| color: var(--accent-strong); | |
| font-size: 0.92rem; | |
| font-weight: 700; | |
| } | |
| .keyword-pill-remove { | |
| display: inline-flex; | |
| align-items: center; | |
| justify-content: center; | |
| width: 20px; | |
| height: 20px; | |
| padding: 0; | |
| border-radius: 999px; | |
| background: rgba(35, 110, 131, 0.12); | |
| color: var(--accent-strong); | |
| cursor: pointer; | |
| } | |
| .keyword-pill-remove:disabled { | |
| opacity: 0.45; | |
| cursor: default; | |
| } | |
| .keyword-add-row { | |
| display: flex; | |
| gap: 10px; | |
| align-items: center; | |
| } | |
| .keyword-add-button { | |
| min-width: 108px; | |
| } | |
| .keyword-empty { | |
| margin: 0; | |
| } | |
| .field-label { | |
| font-size: 0.8rem; | |
| font-weight: 800; | |
| letter-spacing: 0.04em; | |
| text-transform: uppercase; | |
| color: var(--accent-strong); | |
| } | |
| .field-label-alert, | |
| .alert-text { | |
| color: #b42318 ; | |
| } | |
| .field-block { | |
| display: grid; | |
| gap: 8px; | |
| } | |
| .wide-field { | |
| grid-column: 1 / -1; | |
| } | |
| .field-button, | |
| .table-field-button { | |
| width: 100%; | |
| padding: 14px 16px; | |
| border: 1px solid rgba(216, 227, 235, 0.82); | |
| border-radius: var(--radius-sm); | |
| background: linear-gradient(180deg, rgba(248, 251, 252, 0.99) 0%, rgba(243, 248, 250, 0.96) 100%); | |
| color: var(--text); | |
| text-align: left; | |
| line-height: 1.55; | |
| cursor: pointer; | |
| transition: transform 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease; | |
| } | |
| .field-button:hover, | |
| .table-field-button:hover { | |
| transform: translateY(-1px); | |
| border-color: #aec7d2; | |
| box-shadow: 0 10px 24px rgba(28, 52, 70, 0.08); | |
| } | |
| .field-button:disabled, | |
| .table-field-button:disabled { | |
| cursor: default; | |
| opacity: 0.82; | |
| transform: none; | |
| box-shadow: none; | |
| } | |
| .field-button:disabled:hover, | |
| .table-field-button:disabled:hover { | |
| transform: none; | |
| border-color: rgba(216, 227, 235, 0.82); | |
| box-shadow: none; | |
| } | |
| .field-button-alert { | |
| border-color: rgba(233, 96, 87, 0.45); | |
| background: linear-gradient(180deg, rgba(255, 244, 243, 0.98) 0%, rgba(255, 250, 250, 0.97) 100%); | |
| color: #8f1f17; | |
| } | |
| .field-button-alert:hover { | |
| border-color: rgba(219, 76, 67, 0.62); | |
| box-shadow: 0 10px 24px rgba(180, 35, 24, 0.08); | |
| } | |
| .field-button-large { | |
| min-height: 96px; | |
| align-items: start; | |
| white-space: pre-wrap; | |
| } | |
| .table-field-button { | |
| padding: 10px 12px; | |
| background: rgba(255, 255, 255, 0.92); | |
| } | |
| .property-table { | |
| width: 100%; | |
| table-layout: fixed; | |
| } | |
| .property-col-registration { | |
| width: 12%; | |
| } | |
| .property-col-group { | |
| width: 11%; | |
| } | |
| .property-col-address { | |
| width: 20%; | |
| } | |
| .property-col-evaluator { | |
| width: 11%; | |
| } | |
| .property-col-deadline { | |
| width: 9%; | |
| } | |
| .property-col-model { | |
| width: 17%; | |
| } | |
| .property-col-registration-details { | |
| width: 18%; | |
| } | |
| .property-col-obs { | |
| width: 6%; | |
| } | |
| .property-col-duplicate { | |
| width: 7%; | |
| } | |
| .property-col-delete { | |
| width: 7%; | |
| } | |
| .property-table th, | |
| .property-table td { | |
| padding: 9px 10px; | |
| font-size: 0.86rem; | |
| line-height: 1.35; | |
| text-align: center; | |
| } | |
| .property-table th { | |
| font-size: 0.72rem; | |
| letter-spacing: 0.05em; | |
| text-transform: uppercase; | |
| background: rgba(235, 242, 246, 0.94); | |
| text-align: center; | |
| } | |
| .property-table tbody tr:nth-child(even) td { | |
| background: rgba(248, 251, 252, 0.66); | |
| } | |
| .property-table .table-field-button { | |
| width: 100%; | |
| padding: 4px 6px; | |
| border: 1px solid transparent; | |
| border-radius: 8px; | |
| background: transparent; | |
| font-size: 0.84rem; | |
| line-height: 1.3; | |
| box-shadow: none; | |
| text-align: center; | |
| } | |
| .property-table .table-action-button { | |
| min-height: 30px; | |
| padding: 0 8px; | |
| font-size: 0.8rem; | |
| } | |
| .property-cell-center { | |
| text-align: center; | |
| } | |
| .property-cell-center .table-field-button, | |
| .property-cell-center .secondary-button { | |
| margin-inline: auto; | |
| justify-content: center; | |
| text-align: center; | |
| } | |
| .property-table .table-field-button:hover { | |
| transform: none; | |
| border-color: rgba(174, 199, 210, 0.7); | |
| background: rgba(237, 245, 251, 0.86); | |
| box-shadow: none; | |
| } | |
| .table-field-button.multiline { | |
| display: grid; | |
| gap: 4px; | |
| } | |
| .binary-presence-button { | |
| min-width: 58px; | |
| font-weight: 700; | |
| color: #0d4f8c; | |
| border-color: rgba(122, 174, 217, 0.48); | |
| background: rgba(232, 244, 255, 0.84); | |
| } | |
| .binary-presence-button:hover { | |
| border-color: rgba(85, 148, 205, 0.72) ; | |
| background: rgba(220, 237, 252, 0.95) ; | |
| box-shadow: none; | |
| } | |
| .address-button { | |
| white-space: normal; | |
| } | |
| .address-inline { | |
| display: flex; | |
| flex-wrap: wrap; | |
| align-items: center; | |
| justify-content: center; | |
| gap: 8px; | |
| text-align: center; | |
| } | |
| .address-main { | |
| color: var(--title); | |
| } | |
| .address-extra { | |
| font-size: 0.84rem; | |
| color: var(--muted); | |
| } | |
| .table-field-button strong { | |
| color: var(--title); | |
| } | |
| .model-cell { | |
| position: relative; | |
| } | |
| .model-button { | |
| max-width: 100%; | |
| white-space: nowrap; | |
| overflow: hidden; | |
| text-overflow: ellipsis; | |
| } | |
| .model-hover-card { | |
| position: absolute; | |
| top: calc(100% + 8px); | |
| left: 0; | |
| z-index: 8; | |
| width: min(360px, 42vw); | |
| display: grid; | |
| gap: 12px; | |
| padding: 14px 16px; | |
| border: 1px solid rgba(201, 215, 223, 0.92); | |
| border-radius: 16px; | |
| background: linear-gradient(180deg, rgba(255, 255, 255, 0.99) 0%, rgba(247, 250, 251, 0.98) 100%); | |
| box-shadow: 0 22px 46px rgba(17, 28, 36, 0.16); | |
| opacity: 0; | |
| visibility: hidden; | |
| transform: translateY(4px); | |
| pointer-events: none; | |
| transition: opacity 0.16s ease, transform 0.16s ease, visibility 0.16s ease; | |
| } | |
| .model-cell:hover .model-hover-card, | |
| .model-cell:focus-within .model-hover-card { | |
| opacity: 1; | |
| visibility: visible; | |
| transform: translateY(0); | |
| } | |
| .model-hover-title { | |
| color: var(--title); | |
| font-size: 0.96rem; | |
| font-weight: 800; | |
| } | |
| .model-hover-list { | |
| display: grid; | |
| gap: 12px; | |
| } | |
| .model-hover-list > div { | |
| display: grid; | |
| gap: 4px; | |
| } | |
| .model-hover-label { | |
| color: var(--accent-strong); | |
| font-size: 0.74rem; | |
| font-weight: 800; | |
| letter-spacing: 0.05em; | |
| text-transform: uppercase; | |
| } | |
| .model-hover-value { | |
| color: var(--title); | |
| font-size: 0.92rem; | |
| line-height: 1.45; | |
| } | |
| .model-hover-text { | |
| color: var(--text); | |
| font-size: 0.9rem; | |
| line-height: 1.5; | |
| white-space: pre-wrap; | |
| } | |
| .icon-action-button { | |
| width: 32px; | |
| min-width: 32px; | |
| padding: 0; | |
| } | |
| .trash-icon { | |
| width: 15px; | |
| height: 15px; | |
| } | |
| .property-draft-panel { | |
| display: grid; | |
| gap: 18px; | |
| margin-bottom: 18px; | |
| padding: 22px; | |
| border: 1px solid rgba(216, 227, 235, 0.84); | |
| border-radius: var(--radius-md); | |
| background: linear-gradient(180deg, rgba(247, 250, 251, 0.98) 0%, rgba(255, 255, 255, 0.98) 100%); | |
| } | |
| .property-draft-head { | |
| margin-bottom: 0; | |
| } | |
| .property-draft-head h5 { | |
| margin: 0; | |
| color: var(--title); | |
| font-size: 1rem; | |
| } | |
| .property-draft-panel label { | |
| gap: 9px; | |
| } | |
| .property-draft-panel .form-columns { | |
| gap: 16px; | |
| } | |
| .property-draft-panel textarea, | |
| .property-draft-panel input, | |
| .property-draft-panel select { | |
| margin-top: 0; | |
| } | |
| .property-draft-actions { | |
| align-items: center; | |
| gap: 12px; | |
| padding-top: 6px; | |
| } | |
| .table-pagination-stack { | |
| display: grid; | |
| justify-items: center; | |
| gap: 6px; | |
| margin-top: 14px; | |
| } | |
| .table-pagination { | |
| display: flex; | |
| justify-content: center; | |
| align-items: center; | |
| gap: 8px; | |
| flex-wrap: wrap; | |
| } | |
| .table-pagination-button { | |
| min-width: 36px; | |
| width: 36px; | |
| min-height: 36px; | |
| padding: 0; | |
| border-radius: 12px; | |
| } | |
| .table-pagination-button:disabled { | |
| opacity: 0.45; | |
| } | |
| .pagination-icon { | |
| width: 16px; | |
| height: 16px; | |
| } | |
| .table-pagination .plain-note { | |
| min-width: 120px; | |
| text-align: center; | |
| font-weight: 700; | |
| color: var(--title); | |
| } | |
| .table-pagination-summary { | |
| min-width: 0 ; | |
| font-size: 0.82rem; | |
| color: var(--muted); | |
| opacity: 0.96; | |
| } | |
| .activity-entry { | |
| padding: 0; | |
| border: 0; | |
| background: transparent; | |
| } | |
| .activity-fields { | |
| margin: 0 ; | |
| } | |
| .timeline-entry-strong { | |
| position: relative; | |
| padding: 20px; | |
| border-radius: var(--radius-md); | |
| background: linear-gradient(180deg, rgba(249, 252, 253, 0.99) 0%, rgba(243, 248, 250, 0.97) 100%); | |
| border-color: rgba(206, 221, 229, 0.9); | |
| box-shadow: 0 10px 24px rgba(28, 52, 70, 0.05); | |
| } | |
| .timeline-entry-strong::before { | |
| content: ""; | |
| position: absolute; | |
| inset: 0 auto 0 0; | |
| width: 4px; | |
| border-radius: 999px; | |
| background: linear-gradient(180deg, rgba(35, 110, 131, 0.95) 0%, rgba(127, 188, 201, 0.65) 100%); | |
| } | |
| .timeline-meta { | |
| font-size: 0.9rem; | |
| } | |
| .modal-backdrop { | |
| position: fixed; | |
| inset: 0; | |
| display: grid; | |
| place-items: start center; | |
| padding: clamp(12px, 3vw, 24px); | |
| background: rgba(17, 28, 36, 0.38); | |
| backdrop-filter: blur(6px); | |
| z-index: 50; | |
| overflow-y: auto; | |
| overscroll-behavior: contain; | |
| } | |
| .modal-card { | |
| width: min(680px, 100%); | |
| box-sizing: border-box; | |
| display: grid; | |
| gap: 20px; | |
| padding: 24px; | |
| border: 1px solid rgba(208, 220, 227, 0.92); | |
| border-radius: 24px; | |
| background: linear-gradient(180deg, rgba(255, 255, 255, 0.99) 0%, rgba(247, 250, 251, 0.98) 100%); | |
| box-shadow: 0 30px 70px rgba(17, 28, 36, 0.18); | |
| max-height: calc(100vh - 48px); | |
| max-height: calc(100dvh - 24px); | |
| overflow-y: auto; | |
| overscroll-behavior: contain; | |
| align-self: start; | |
| margin: 0; | |
| } | |
| .modal-head, | |
| .modal-actions { | |
| display: flex; | |
| justify-content: space-between; | |
| align-items: start; | |
| gap: 16px; | |
| } | |
| .modal-head h3 { | |
| margin: 0 0 6px; | |
| color: var(--title); | |
| font-size: 1.25rem; | |
| } | |
| .modal-head p { | |
| margin: 0; | |
| } | |
| .modal-form { | |
| display: grid; | |
| gap: 16px; | |
| min-height: 0; | |
| } | |
| @media (max-width: 720px) { | |
| .modal-card { | |
| padding: 20px; | |
| border-radius: 20px; | |
| } | |
| } | |
| .long-note { | |
| margin: 0; | |
| padding: 18px 20px; | |
| border: 1px solid rgba(216, 227, 235, 0.82); | |
| border-radius: var(--radius-sm); | |
| background: linear-gradient(180deg, rgba(248, 251, 252, 0.98) 0%, rgba(243, 248, 250, 0.96) 100%); | |
| line-height: 1.65; | |
| white-space: pre-wrap; | |
| } | |
| .empty-state { | |
| margin: 0; | |
| color: var(--muted); | |
| line-height: 1.6; | |
| padding: 6px 0 2px; | |
| } | |
| .cell-subtitle { | |
| margin-top: 4px; | |
| font-size: 0.92rem; | |
| } | |
| .timeline-entry-head strong { | |
| font-size: 1rem; | |
| color: var(--title); | |
| } | |
| .timeline-entry-title { | |
| display: grid; | |
| gap: 4px; | |
| } | |
| .timeline-entry-title-row { | |
| display: flex; | |
| flex-wrap: wrap; | |
| align-items: center; | |
| gap: 8px; | |
| } | |
| .timeline-actions { | |
| display: flex; | |
| flex-wrap: wrap; | |
| justify-content: flex-end; | |
| gap: 8px; | |
| } | |
| .timeline-entry-head span { | |
| color: var(--muted); | |
| font-size: 0.9rem; | |
| } | |
| .timeline-entry-head .timeline-group-chip { | |
| display: inline-flex; | |
| align-items: center; | |
| min-height: 28px; | |
| padding: 0 10px; | |
| border-radius: 999px; | |
| background: rgba(227, 240, 245, 0.92); | |
| color: var(--accent-strong); | |
| font-size: 0.72rem; | |
| font-weight: 800; | |
| letter-spacing: 0.05em; | |
| text-transform: uppercase; | |
| } | |
| .work-unit-badge { | |
| display: inline-flex; | |
| align-items: center; | |
| justify-content: center; | |
| min-height: 28px; | |
| padding: 0 11px; | |
| border: 1px solid transparent; | |
| border-radius: 999px; | |
| font-size: 0.76rem; | |
| font-weight: 800; | |
| letter-spacing: 0.03em; | |
| text-transform: uppercase; | |
| } | |
| .work-unit-eav { | |
| border-color: #8fb2c0; | |
| background: #deedf3; | |
| color: #365c6d; | |
| } | |
| .work-unit-esjl { | |
| border-color: #d7b59c; | |
| background: #f5e9df; | |
| color: #85583d; | |
| } | |
| .work-unit-epgv { | |
| border-color: #a4bb9b; | |
| background: #e4ecdf; | |
| color: #466342; | |
| } | |
| .work-unit-dai { | |
| border-color: #cfacb7; | |
| background: #f1e2e6; | |
| color: #7d4b58; | |
| } | |
| .table-action-button, | |
| .timeline-action-button { | |
| min-height: 38px; | |
| padding: 0 12px; | |
| white-space: nowrap; | |
| } | |
| .detail-data-list { | |
| display: grid; | |
| grid-template-columns: 1fr; | |
| gap: 0; | |
| margin-top: 0 ; | |
| border: 1px solid rgba(216, 227, 235, 0.82); | |
| border-radius: var(--radius-sm); | |
| overflow: hidden; | |
| background: linear-gradient(180deg, rgba(248, 251, 252, 0.98) 0%, rgba(244, 249, 250, 0.96) 100%); | |
| } | |
| .detail-data-list > div, | |
| .detail-list-card { | |
| border-bottom: 1px solid rgba(216, 227, 235, 0.82); | |
| background: transparent; | |
| } | |
| .detail-data-list > div:last-child, | |
| .detail-list-card:last-child { | |
| border-bottom: 0; | |
| } | |
| .field-block-row { | |
| display: grid; | |
| grid-template-columns: minmax(160px, 220px) minmax(0, 1fr); | |
| gap: 0; | |
| align-items: stretch; | |
| } | |
| .detail-data-list .field-label { | |
| display: flex; | |
| align-items: center; | |
| padding: 14px 16px; | |
| border-right: 1px solid rgba(216, 227, 235, 0.82); | |
| background: rgba(237, 245, 251, 0.82); | |
| } | |
| .detail-data-list .field-button { | |
| min-height: 100%; | |
| padding: 14px 16px; | |
| border: 0; | |
| border-radius: 0; | |
| background: rgba(255, 255, 255, 0.9); | |
| } | |
| .detail-data-list .field-button:hover { | |
| transform: none; | |
| border-color: transparent; | |
| box-shadow: inset 0 0 0 1px rgba(174, 199, 210, 0.85); | |
| } | |
| .detail-data-list .field-button-alert { | |
| background: linear-gradient(180deg, rgba(255, 244, 243, 0.98) 0%, rgba(255, 250, 250, 0.97) 100%); | |
| } | |
| .detail-data-list .field-button-alert:hover { | |
| box-shadow: inset 0 0 0 1px rgba(219, 76, 67, 0.42); | |
| } | |
| .detail-section-row { | |
| padding-block: 22px; | |
| } | |
| .detail-data-list-inline { | |
| display: flex; | |
| flex-wrap: wrap; | |
| gap: 12px; | |
| margin-top: 10px ; | |
| padding-top: 14px; | |
| border: 0; | |
| border-top: 1px solid rgba(216, 227, 235, 0.82); | |
| border-radius: 0; | |
| overflow: visible; | |
| background: transparent; | |
| } | |
| .detail-data-list-inline > div { | |
| flex: 1 1 220px; | |
| min-width: min(240px, 100%); | |
| border-bottom: 0; | |
| } | |
| .detail-data-list-inline .wide-field { | |
| flex-basis: 100%; | |
| } | |
| .detail-data-list-inline .field-block-row { | |
| grid-template-columns: 1fr; | |
| gap: 8px; | |
| } | |
| .detail-data-list-inline .field-label { | |
| padding: 0; | |
| border-right: 0; | |
| background: transparent; | |
| } | |
| .detail-data-list-inline .field-button { | |
| min-height: auto; | |
| border: 1px solid rgba(216, 227, 235, 0.82); | |
| border-radius: var(--radius-sm); | |
| background: linear-gradient(180deg, rgba(248, 251, 252, 0.99) 0%, rgba(243, 248, 250, 0.96) 100%); | |
| } | |
| .detail-data-list-inline .field-button:hover { | |
| transform: translateY(-1px); | |
| border-color: #aec7d2; | |
| box-shadow: 0 10px 24px rgba(28, 52, 70, 0.08); | |
| } | |
| .detail-data-list-inline .field-button-alert { | |
| background: linear-gradient(180deg, rgba(255, 244, 243, 0.98) 0%, rgba(255, 250, 250, 0.97) 100%); | |
| } | |
| .detail-data-list-inline .field-button-alert:hover { | |
| box-shadow: 0 10px 24px rgba(219, 76, 67, 0.12); | |
| } | |
| .registration-detail-page { | |
| gap: 20px; | |
| } | |
| .registration-detail-hero { | |
| padding-bottom: 24px; | |
| } | |
| .registration-detail-header { | |
| margin-bottom: 18px; | |
| align-items: flex-start; | |
| } | |
| .registration-static-grid { | |
| display: flex; | |
| flex-wrap: wrap; | |
| gap: 12px; | |
| margin-top: 10px; | |
| padding-top: 14px; | |
| border-top: 1px solid rgba(216, 227, 235, 0.82); | |
| } | |
| .registration-static-grid-compact { | |
| margin-top: 0; | |
| } | |
| .registration-static-field { | |
| flex: 1 1 220px; | |
| display: grid; | |
| gap: 8px; | |
| min-width: min(240px, 100%); | |
| } | |
| .registration-static-field-wide { | |
| flex-basis: 100%; | |
| } | |
| .registration-static-label { | |
| color: var(--muted); | |
| font-size: 0.72rem; | |
| font-weight: 800; | |
| letter-spacing: 0.05em; | |
| text-transform: uppercase; | |
| } | |
| .registration-static-label-alert { | |
| color: var(--warning-text); | |
| } | |
| .registration-static-value { | |
| min-height: 54px; | |
| padding: 14px 16px; | |
| border: 1px solid rgba(216, 227, 235, 0.82); | |
| border-radius: var(--radius-sm); | |
| background: rgba(249, 251, 252, 0.95); | |
| color: var(--title); | |
| line-height: 1.45; | |
| white-space: pre-wrap; | |
| } | |
| .registration-static-field-alert .registration-static-value { | |
| border-color: rgba(240, 208, 201, 0.92); | |
| background: linear-gradient(180deg, rgba(255, 247, 246, 0.98) 0%, rgba(255, 251, 250, 0.97) 100%); | |
| } | |
| .registration-static-field-status .registration-static-value { | |
| display: flex; | |
| align-items: center; | |
| } | |
| .registration-static-field-status .status-badge { | |
| margin: 0; | |
| } | |
| .registration-detail-section { | |
| padding-block: 22px; | |
| } | |
| .registration-detail-section-title { | |
| margin-bottom: 14px; | |
| padding-bottom: 12px; | |
| border-bottom: 1px solid rgba(216, 227, 235, 0.82); | |
| } | |
| .registration-detail-section > h4 { | |
| margin-bottom: 0; | |
| } | |
| .field-button-prominent { | |
| font-size: 1.04rem; | |
| font-weight: 700; | |
| } | |
| .field-button-static { | |
| cursor: default; | |
| } | |
| .field-button-static:hover { | |
| transform: none; | |
| border-color: transparent; | |
| box-shadow: none; | |
| } | |
| .field-button-status { | |
| display: flex; | |
| align-items: center; | |
| } | |
| .detail-data-list .field-button-status .status-badge { | |
| min-height: 32px; | |
| padding: 0 10px; | |
| font-size: 1.04rem; | |
| font-weight: 700; | |
| letter-spacing: 0; | |
| text-transform: uppercase; | |
| } | |
| .detail-list-card strong { | |
| color: var(--title); | |
| font-size: 1rem; | |
| } | |
| .dashboard-page { | |
| align-content: start; | |
| gap: 30px; | |
| } | |
| .entry-dashboard-toolbar { | |
| display: flex; | |
| flex-wrap: wrap; | |
| align-items: center; | |
| justify-content: space-between; | |
| gap: 14px 18px; | |
| } | |
| .entry-dashboard-subtabs { | |
| display: flex; | |
| flex-wrap: wrap; | |
| gap: 10px; | |
| margin-top: -6px; | |
| } | |
| .entry-dashboard-granularity { | |
| display: inline-flex; | |
| align-items: center; | |
| gap: 8px; | |
| padding: 6px; | |
| border: 1px solid rgba(203, 216, 225, 0.92); | |
| border-radius: 999px; | |
| background: rgba(247, 251, 252, 0.92); | |
| } | |
| .entry-dashboard-granularity-button { | |
| min-height: 36px; | |
| padding: 0 14px; | |
| border: 1px solid transparent; | |
| border-radius: 999px; | |
| background: transparent; | |
| color: var(--muted); | |
| font-size: 0.84rem; | |
| font-weight: 700; | |
| cursor: pointer; | |
| transition: background-color 0.16s ease, color 0.16s ease, border-color 0.16s ease; | |
| } | |
| .entry-dashboard-granularity-button.active { | |
| border-color: rgba(112, 160, 177, 0.92); | |
| background: linear-gradient(180deg, rgba(235, 246, 249, 0.98) 0%, rgba(227, 239, 243, 0.96) 100%); | |
| color: var(--accent-strong); | |
| } | |
| .entry-dashboard-granularity-button:disabled { | |
| cursor: not-allowed; | |
| opacity: 0.45; | |
| } | |
| .entry-dashboard-subtab { | |
| min-height: 40px; | |
| padding: 0 16px; | |
| border: 1px solid rgba(203, 216, 225, 0.92); | |
| border-radius: 999px; | |
| background: rgba(247, 251, 252, 0.8); | |
| color: var(--muted); | |
| cursor: pointer; | |
| transition: transform 0.16s ease, border-color 0.16s ease, background-color 0.16s ease, color 0.16s ease; | |
| } | |
| .entry-dashboard-subtab:hover { | |
| transform: translateY(-1px); | |
| border-color: rgba(159, 189, 202, 0.92); | |
| color: var(--title); | |
| } | |
| .entry-dashboard-subtab.active { | |
| transform: translateY(-1px); | |
| border-color: rgba(112, 160, 177, 0.95); | |
| background: linear-gradient(180deg, rgba(235, 246, 249, 0.98) 0%, rgba(227, 239, 243, 0.96) 100%); | |
| color: var(--accent-strong); | |
| font-weight: 700; | |
| } | |
| .entry-dashboard-intro { | |
| display: grid; | |
| grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); | |
| gap: 20px; | |
| align-items: start; | |
| } | |
| .entry-dashboard-intro-main { | |
| display: grid; | |
| gap: 12px; | |
| } | |
| .entry-dashboard-intro-main h3 { | |
| margin: 0; | |
| font-size: clamp(1.4rem, 1.8vw, 1.95rem); | |
| line-height: 1.2; | |
| } | |
| .entry-dashboard-copy { | |
| margin: 0; | |
| color: var(--muted); | |
| line-height: 1.65; | |
| } | |
| .entry-dashboard-source-card { | |
| display: grid; | |
| gap: 8px; | |
| padding: 20px 22px; | |
| border: 1px solid rgba(211, 224, 231, 0.9); | |
| border-radius: var(--radius-md); | |
| background: linear-gradient(180deg, rgba(250, 252, 253, 0.99) 0%, rgba(242, 248, 250, 0.97) 100%); | |
| } | |
| .entry-dashboard-source-card strong { | |
| color: var(--title); | |
| font-size: 2rem; | |
| } | |
| .entry-dashboard-source-card p { | |
| margin: 0; | |
| color: var(--muted); | |
| } | |
| .entry-dashboard-macro .section-card { | |
| border-width: 1.5px; | |
| border-color: rgba(198, 212, 221, 0.96); | |
| box-shadow: 0 16px 34px rgba(28, 52, 70, 0.07); | |
| } | |
| .entry-dashboard-macro .section-card > .section-header { | |
| border-bottom-color: rgba(202, 216, 225, 0.94); | |
| } | |
| .entry-dashboard-general-panel .section-card { | |
| background: | |
| radial-gradient(circle at top right, rgba(215, 234, 240, 0.65), transparent 32%), | |
| linear-gradient(180deg, rgba(249, 252, 253, 0.99) 0%, rgba(243, 248, 250, 0.97) 100%); | |
| } | |
| .entry-dashboard-detail-panel .section-card { | |
| background: | |
| radial-gradient(circle at top right, rgba(243, 231, 214, 0.56), transparent 30%), | |
| linear-gradient(180deg, rgba(252, 251, 249, 0.99) 0%, rgba(247, 244, 240, 0.97) 100%); | |
| } | |
| .entry-dashboard-filter-sticky { | |
| position: sticky; | |
| top: 0; | |
| z-index: 12; | |
| margin-top: 0; | |
| padding-bottom: 12px; | |
| background: var(--bg); | |
| } | |
| .entry-dashboard-filter-dock { | |
| display: grid; | |
| gap: 12px; | |
| padding: 12px 14px; | |
| border: 1.5px solid rgba(198, 212, 221, 0.96); | |
| border-radius: 20px; | |
| background: #f5f8f6; | |
| box-shadow: 0 14px 30px rgba(28, 52, 70, 0.1); | |
| } | |
| .app-shell-header-collapsed .entry-dashboard-filter-sticky { | |
| margin-top: -14px; | |
| } | |
| .app-shell-header-collapsed .entry-dashboard-filter-dock { | |
| border-radius: 0 0 20px 20px; | |
| } | |
| .entry-dashboard-filter-heading h3 { | |
| margin: 0; | |
| color: var(--title); | |
| font-size: 1.28rem; | |
| letter-spacing: -0.01em; | |
| } | |
| .entry-dashboard-highlight-picker { | |
| display: grid; | |
| gap: 12px; | |
| padding-top: 18px; | |
| padding-bottom: 18px; | |
| } | |
| .entry-dashboard-highlight-picker-note { | |
| margin: 0; | |
| } | |
| .entry-filter-grid { | |
| display: grid; | |
| grid-template-columns: repeat(3, minmax(0, 1fr)); | |
| gap: 10px; | |
| } | |
| .entry-filter-group { | |
| display: grid; | |
| grid-template-columns: auto minmax(0, 1fr); | |
| align-items: center; | |
| gap: 8px 12px; | |
| padding: 10px 14px; | |
| border: 1px solid rgba(216, 227, 235, 0.84); | |
| border-radius: 18px; | |
| background: rgba(249, 252, 253, 0.9); | |
| } | |
| .entry-filter-group .panel-title { | |
| min-width: 86px; | |
| font-size: 0.74rem; | |
| letter-spacing: 0.03em; | |
| } | |
| .entry-filter-chip-list { | |
| display: flex; | |
| flex-wrap: wrap; | |
| gap: 8px; | |
| } | |
| .entry-filter-chip { | |
| min-height: 34px; | |
| padding: 6px 10px; | |
| font-size: 0.82rem; | |
| opacity: 0.92; | |
| } | |
| .entry-filter-chip { | |
| border: 1px solid rgba(216, 227, 235, 0.88); | |
| border-radius: 999px; | |
| background: rgba(248, 251, 252, 0.7); | |
| color: var(--muted); | |
| cursor: pointer; | |
| transition: | |
| transform 0.16s ease, | |
| border-color 0.16s ease, | |
| background-color 0.16s ease, | |
| color 0.16s ease, | |
| box-shadow 0.16s ease, | |
| opacity 0.16s ease; | |
| opacity: 0.78; | |
| } | |
| .entry-filter-chip:hover { | |
| transform: translateY(-1px); | |
| border-color: color-mix(in srgb, var(--filter-color) 34%, #d8e3eb); | |
| color: var(--title); | |
| opacity: 1; | |
| } | |
| .entry-filter-chip.active { | |
| transform: translateY(-1px); | |
| color: var(--title); | |
| border-color: color-mix(in srgb, var(--filter-color) 52%, #d8e3eb); | |
| background: color-mix(in srgb, var(--filter-color) 18%, #ffffff); | |
| box-shadow: 0 8px 20px color-mix(in srgb, var(--filter-color) 18%, rgba(28, 52, 70, 0.04)); | |
| opacity: 1; | |
| } | |
| .entry-view-picker { | |
| display: flex; | |
| flex-wrap: wrap; | |
| gap: 12px; | |
| } | |
| .entry-view-pill { | |
| flex: 1 1 230px; | |
| min-height: 78px; | |
| display: grid; | |
| gap: 6px; | |
| align-content: start; | |
| padding: 16px 18px; | |
| text-align: left; | |
| border: 1px solid rgba(211, 224, 231, 0.9); | |
| border-radius: 20px; | |
| background: rgba(248, 251, 252, 0.96); | |
| color: var(--text); | |
| cursor: pointer; | |
| transition: transform 0.16s ease, border-color 0.16s ease, background-color 0.16s ease, box-shadow 0.16s ease; | |
| } | |
| .entry-view-pill strong, | |
| .entry-view-pill small { | |
| display: block; | |
| } | |
| .entry-view-pill strong { | |
| color: var(--title); | |
| font-size: 0.98rem; | |
| } | |
| .entry-view-pill small { | |
| color: var(--muted); | |
| line-height: 1.45; | |
| } | |
| .entry-view-pill:hover, | |
| .entry-view-pill.active { | |
| transform: translateY(-1px); | |
| border-color: rgba(153, 194, 206, 0.95); | |
| background: linear-gradient(180deg, rgba(239, 248, 250, 0.98) 0%, rgba(231, 241, 243, 0.96) 100%); | |
| box-shadow: 0 12px 30px rgba(28, 52, 70, 0.08); | |
| } | |
| .entry-dashboard-filters { | |
| margin-bottom: 0; | |
| } | |
| .entry-dashboard-target-filter { | |
| margin-bottom: 0; | |
| } | |
| .entry-dashboard-chart-filter { | |
| margin-bottom: 0; | |
| padding-top: 12px; | |
| border-top: 1px solid rgba(216, 227, 235, 0.78); | |
| } | |
| .entry-dashboard-chart-filter-control { | |
| max-width: 280px; | |
| gap: 6px; | |
| font-weight: 600; | |
| color: var(--muted); | |
| } | |
| .entry-dashboard-chart-filter-label { | |
| font-size: 0.72rem; | |
| font-weight: 700; | |
| letter-spacing: 0.04em; | |
| text-transform: uppercase; | |
| color: var(--muted); | |
| } | |
| .entry-dashboard-chart-filter-control select { | |
| font-weight: 600; | |
| color: var(--title); | |
| } | |
| .entry-dashboard-target-filter label { | |
| max-width: 320px; | |
| } | |
| .entry-dashboard-notes { | |
| margin: 0; | |
| padding-left: 20px; | |
| display: grid; | |
| gap: 8px; | |
| } | |
| .entry-dashboard-notes li { | |
| color: var(--muted); | |
| line-height: 1.55; | |
| } | |
| .entry-total-chart-scroll, | |
| .entry-line-chart-scroll { | |
| overflow-x: auto; | |
| padding-bottom: 4px; | |
| } | |
| .entry-line-chart-shell { | |
| position: relative; | |
| width: 100%; | |
| min-width: 0; | |
| } | |
| .entry-line-tooltip { | |
| position: absolute; | |
| top: 14px; | |
| z-index: 3; | |
| min-width: 180px; | |
| max-width: 240px; | |
| padding: 12px 14px; | |
| border: 1px solid rgba(208, 220, 227, 0.94); | |
| border-radius: 16px; | |
| background: rgba(255, 255, 255, 0.96); | |
| box-shadow: 0 16px 34px rgba(28, 52, 70, 0.12); | |
| pointer-events: none; | |
| transform: translateX(10px); | |
| } | |
| .entry-line-tooltip.align-right { | |
| transform: translateX(calc(-100% - 10px)); | |
| } | |
| .entry-line-tooltip strong { | |
| display: block; | |
| margin-bottom: 10px; | |
| color: var(--title); | |
| font-size: 0.92rem; | |
| } | |
| .entry-line-tooltip-list { | |
| display: grid; | |
| gap: 8px; | |
| } | |
| .entry-line-tooltip-row { | |
| display: flex; | |
| justify-content: space-between; | |
| align-items: center; | |
| gap: 10px; | |
| color: var(--title); | |
| font-size: 0.84rem; | |
| } | |
| .entry-line-tooltip-label { | |
| display: inline-flex; | |
| align-items: center; | |
| gap: 8px; | |
| min-width: 0; | |
| } | |
| .entry-line-tooltip-dot { | |
| width: 10px; | |
| height: 10px; | |
| flex: 0 0 auto; | |
| border-radius: 999px; | |
| } | |
| .entry-total-chart { | |
| display: grid; | |
| gap: 12px; | |
| align-items: end; | |
| min-width: max-content; | |
| padding-top: 4px; | |
| } | |
| .entry-total-bar { | |
| display: grid; | |
| gap: 10px; | |
| min-width: 56px; | |
| padding: 12px 10px 14px; | |
| border: 1px solid rgba(216, 227, 235, 0.82); | |
| border-radius: 20px; | |
| background: linear-gradient(180deg, rgba(249, 252, 253, 0.99) 0%, rgba(243, 248, 250, 0.96) 100%); | |
| color: var(--title); | |
| cursor: pointer; | |
| box-shadow: 0 8px 18px rgba(28, 52, 70, 0.04); | |
| transition: border-color 0.16s ease, background-color 0.16s ease, box-shadow 0.16s ease; | |
| } | |
| .entry-total-bar:hover, | |
| .entry-total-bar.active { | |
| border-color: rgba(154, 194, 205, 0.9); | |
| background: linear-gradient(180deg, rgba(239, 248, 250, 0.98) 0%, rgba(231, 241, 243, 0.95) 100%); | |
| box-shadow: 0 12px 22px rgba(28, 52, 70, 0.08); | |
| } | |
| .entry-total-bar-value { | |
| color: var(--title); | |
| font-size: 0.78rem; | |
| font-weight: 700; | |
| } | |
| .entry-total-bar-track { | |
| height: 160px; | |
| display: flex; | |
| align-items: end; | |
| } | |
| .entry-total-bar-fill { | |
| width: 100%; | |
| border-radius: 14px 14px 8px 8px; | |
| background: linear-gradient(180deg, rgba(35, 110, 131, 0.95) 0%, rgba(122, 183, 198, 0.88) 100%); | |
| transition: height 0.22s ease, background 0.22s ease; | |
| } | |
| .entry-total-bar.active .entry-total-bar-fill { | |
| background: linear-gradient(180deg, rgba(24, 79, 97, 0.98) 0%, rgba(94, 161, 176, 0.92) 100%); | |
| } | |
| .entry-total-bar-label { | |
| color: var(--muted); | |
| font-size: 0.76rem; | |
| } | |
| .entry-dashboard-two-column { | |
| display: grid; | |
| grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); | |
| gap: 24px; | |
| } | |
| .entry-dashboard-detail-grid { | |
| display: grid; | |
| grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); | |
| gap: 24px; | |
| align-items: start; | |
| } | |
| .entry-dashboard-summary { | |
| display: grid; | |
| gap: 8px; | |
| } | |
| .entry-dashboard-summary p { | |
| margin: 0; | |
| color: var(--muted); | |
| line-height: 1.6; | |
| } | |
| .entry-dashboard-summary strong { | |
| color: var(--title); | |
| } | |
| .entry-dashboard-surface { | |
| padding: 20px 22px; | |
| border: 1px solid rgba(210, 222, 229, 0.9); | |
| border-radius: 22px; | |
| background: rgba(255, 255, 255, 0.58); | |
| } | |
| .entry-dashboard-block-copy { | |
| display: grid; | |
| gap: 12px; | |
| } | |
| .entry-dashboard-block-panel { | |
| display: grid; | |
| gap: 18px; | |
| } | |
| .entry-dashboard-block-panel h4 { | |
| margin: 0; | |
| color: var(--title); | |
| font-size: 1rem; | |
| } | |
| .entry-dashboard-block-panel > h4 { | |
| padding-bottom: 12px; | |
| margin-bottom: 2px; | |
| border-bottom: 1px solid rgba(216, 227, 235, 0.78); | |
| } | |
| .entry-dashboard-block-copy h4 { | |
| padding-bottom: 0; | |
| margin-bottom: 0; | |
| border-bottom: 0; | |
| } | |
| .entry-dashboard-detail-top { | |
| display: grid; | |
| grid-template-columns: minmax(220px, 320px) minmax(0, 1fr); | |
| gap: 20px; | |
| align-items: end; | |
| } | |
| .entry-dashboard-detail-top .plain-note { | |
| margin: 0; | |
| } | |
| .entry-dashboard-meta-strip { | |
| gap: 10px; | |
| margin-bottom: 0; | |
| } | |
| .entry-dashboard-meta-strip span { | |
| display: inline-flex; | |
| align-items: center; | |
| min-height: 34px; | |
| padding: 0 12px; | |
| border: 1px solid rgba(216, 227, 235, 0.84); | |
| border-radius: 999px; | |
| background: rgba(247, 251, 252, 0.92); | |
| } | |
| .entry-dashboard-metric-list { | |
| display: grid; | |
| gap: 12px; | |
| } | |
| .entry-dashboard-metric-item { | |
| display: grid; | |
| gap: 4px; | |
| padding: 14px 16px; | |
| border: 1px solid rgba(216, 227, 235, 0.82); | |
| border-radius: 18px; | |
| background: linear-gradient(180deg, rgba(249, 252, 253, 0.99) 0%, rgba(244, 249, 251, 0.98) 100%); | |
| } | |
| .entry-dashboard-metric-label { | |
| color: var(--muted); | |
| font-size: 0.74rem; | |
| font-weight: 700; | |
| letter-spacing: 0.04em; | |
| text-transform: uppercase; | |
| } | |
| .entry-dashboard-metric-value { | |
| color: var(--title); | |
| font-size: 1.02rem; | |
| line-height: 1.35; | |
| } | |
| .entry-dashboard-metric-hint { | |
| color: var(--muted); | |
| font-size: 0.82rem; | |
| line-height: 1.45; | |
| } | |
| .entry-dashboard-inline-note { | |
| margin: 0; | |
| } | |
| .entry-series-chip-list { | |
| display: flex; | |
| flex-wrap: wrap; | |
| gap: 10px; | |
| } | |
| .entry-series-chip { | |
| display: inline-flex; | |
| align-items: center; | |
| gap: 10px; | |
| min-height: 42px; | |
| padding: 10px 14px; | |
| border: 1px solid rgba(216, 227, 235, 0.82); | |
| border-radius: 999px; | |
| background: rgba(248, 251, 252, 0.96); | |
| color: var(--title); | |
| cursor: pointer; | |
| transition: transform 0.16s ease, border-color 0.16s ease, background-color 0.16s ease; | |
| } | |
| .entry-series-chip:hover, | |
| .entry-series-chip.active { | |
| transform: translateY(-1px); | |
| border-color: rgba(154, 194, 205, 0.9); | |
| background: rgba(239, 248, 250, 0.98); | |
| } | |
| .entry-series-chip-dot { | |
| width: 10px; | |
| height: 10px; | |
| flex: 0 0 auto; | |
| border-radius: 999px; | |
| background: var(--series-color); | |
| box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.92); | |
| } | |
| .entry-line-chart { | |
| width: 100%; | |
| height: auto; | |
| min-width: 0; | |
| display: block; | |
| overflow: visible; | |
| background: linear-gradient(180deg, rgba(249, 252, 253, 0.99) 0%, rgba(244, 249, 251, 0.98) 100%); | |
| border: 1px solid rgba(216, 227, 235, 0.82); | |
| border-radius: 20px; | |
| } | |
| .entry-line-grid { | |
| stroke: rgba(173, 190, 200, 0.5); | |
| stroke-width: 1; | |
| } | |
| .entry-line-grid-label, | |
| .entry-line-axis-label { | |
| fill: #708493; | |
| font-size: 11px; | |
| } | |
| .entry-line-axis-label.rotated { | |
| font-size: 10px; | |
| } | |
| .entry-line-marker { | |
| stroke: rgba(16, 32, 45, 0.28); | |
| stroke-width: 1.5; | |
| stroke-dasharray: 5 5; | |
| } | |
| .entry-line-hover-marker { | |
| stroke: rgba(16, 32, 45, 0.22); | |
| stroke-width: 1.5; | |
| stroke-dasharray: 4 4; | |
| } | |
| .entry-line-path { | |
| fill: none; | |
| stroke-width: 3.5; | |
| stroke-linecap: round; | |
| stroke-linejoin: round; | |
| } | |
| .entry-line-dot { | |
| stroke: #ffffff; | |
| stroke-width: 2; | |
| } | |
| .entry-line-hover-dot { | |
| stroke: #ffffff; | |
| stroke-width: 2.5; | |
| } | |
| .entry-line-hitbox { | |
| cursor: crosshair; | |
| } | |
| .entry-breakdown-list { | |
| display: grid; | |
| gap: 14px; | |
| } | |
| .entry-breakdown-row { | |
| display: grid; | |
| gap: 9px; | |
| padding: 16px 18px; | |
| border: 1px solid rgba(216, 227, 235, 0.82); | |
| border-radius: 18px; | |
| background: linear-gradient(180deg, rgba(249, 252, 253, 0.99) 0%, rgba(244, 249, 251, 0.98) 100%); | |
| } | |
| .entry-breakdown-head, | |
| .entry-breakdown-meta { | |
| display: flex; | |
| justify-content: space-between; | |
| align-items: center; | |
| gap: 12px; | |
| } | |
| .entry-breakdown-head strong, | |
| .entry-breakdown-head span { | |
| color: var(--title); | |
| } | |
| .entry-breakdown-head span { | |
| font-weight: 700; | |
| } | |
| .entry-breakdown-bar { | |
| height: 14px; | |
| overflow: hidden; | |
| border-radius: 999px; | |
| background: rgba(227, 236, 241, 0.92); | |
| } | |
| .entry-breakdown-bar-fill { | |
| display: block; | |
| height: 100%; | |
| border-radius: inherit; | |
| transition: width 0.22s ease, background-color 0.22s ease; | |
| } | |
| .entry-breakdown-meta { | |
| color: var(--muted); | |
| font-size: 0.84rem; | |
| } | |
| .entry-breakdown-list-compact .entry-breakdown-meta { | |
| display: none; | |
| } | |
| .entry-dashboard-collapse { | |
| display: grid; | |
| gap: 14px; | |
| } | |
| .entry-dashboard-collapse summary { | |
| display: flex; | |
| align-items: baseline; | |
| justify-content: space-between; | |
| gap: 12px; | |
| cursor: pointer; | |
| list-style: none; | |
| color: var(--title); | |
| font-weight: 700; | |
| } | |
| .entry-dashboard-collapse summary::-webkit-details-marker { | |
| display: none; | |
| } | |
| .entry-dashboard-collapse summary::after { | |
| content: "▾"; | |
| color: var(--muted); | |
| font-size: 0.95rem; | |
| transition: transform 0.16s ease; | |
| } | |
| .entry-dashboard-collapse[open] summary::after { | |
| transform: rotate(180deg); | |
| } | |
| .entry-dashboard-collapse summary span { | |
| color: var(--title); | |
| } | |
| .entry-dashboard-collapse summary small { | |
| color: var(--muted); | |
| font-size: 0.82rem; | |
| font-weight: 600; | |
| } | |
| .entry-dashboard-collapse-body { | |
| display: grid; | |
| gap: 12px; | |
| } | |
| .entry-dashboard-table-wrap { | |
| max-height: calc(11 * 3.25rem); | |
| overflow: auto; | |
| border: 1px solid rgba(216, 227, 235, 0.82); | |
| border-radius: 18px; | |
| background: rgba(255, 255, 255, 0.94); | |
| } | |
| .entry-dashboard-table { | |
| min-width: 820px; | |
| } | |
| .entry-dashboard-table thead th { | |
| position: sticky; | |
| top: 0; | |
| z-index: 1; | |
| background: rgba(237, 245, 251, 0.98); | |
| } | |
| .entry-dashboard-table th:first-child, | |
| .entry-dashboard-table td:first-child { | |
| position: sticky; | |
| left: 0; | |
| } | |
| .entry-dashboard-table th:first-child { | |
| z-index: 3; | |
| background: rgba(237, 245, 251, 0.98); | |
| } | |
| .entry-dashboard-table td:first-child { | |
| z-index: 1; | |
| background: rgba(255, 255, 255, 0.98); | |
| } | |
| .entry-dashboard-table tbody tr.active td { | |
| background: rgba(236, 245, 247, 0.78); | |
| } | |
| .entry-dashboard-table tbody tr.active td:first-child { | |
| background: rgba(227, 240, 244, 0.96); | |
| } | |
| @media (max-width: 1180px) { | |
| .detail-grid, | |
| .form-columns.four { | |
| grid-template-columns: repeat(2, minmax(0, 1fr)); | |
| } | |
| .registration-inline-grid { | |
| grid-template-columns: repeat(2, minmax(0, 1fr)); | |
| } | |
| .process-row { | |
| grid-template-columns: minmax(0, 1fr); | |
| } | |
| .cronograma-row { | |
| grid-template-columns: minmax(0, 1fr); | |
| } | |
| .cronogramas-list { | |
| grid-template-columns: 1fr; | |
| } | |
| } | |
| @media (max-width: 920px) { | |
| .app-header { | |
| padding: 0 16px; | |
| } | |
| .app-header-inner { | |
| align-items: flex-start; | |
| flex-direction: column; | |
| gap: 12px; | |
| padding: 9px 0; | |
| } | |
| .main-content { | |
| width: calc(100vw - 32px); | |
| padding: 22px 0 28px; | |
| } | |
| .nav { | |
| width: 100%; | |
| justify-content: flex-start; | |
| } | |
| .sidebar-brand { | |
| flex-direction: column; | |
| align-items: flex-start; | |
| gap: 4px; | |
| } | |
| .sidebar-copy { | |
| white-space: normal; | |
| } | |
| .stats-grid, | |
| .filters, | |
| .detail-grid, | |
| .evaluator-grid, | |
| .form-grid, | |
| .form-columns.two, | |
| .form-columns.three, | |
| .form-columns.four { | |
| grid-template-columns: 1fr; | |
| } | |
| .process-row { | |
| grid-template-columns: 1fr; | |
| gap: 18px; | |
| } | |
| .entry-filter-grid { | |
| grid-template-columns: 1fr; | |
| } | |
| .entry-dashboard-toolbar { | |
| align-items: stretch; | |
| } | |
| .entry-dashboard-granularity { | |
| width: fit-content; | |
| } | |
| .entry-dashboard-filter-sticky { | |
| margin-top: -8px; | |
| } | |
| .entry-filter-group { | |
| grid-template-columns: 1fr; | |
| align-items: start; | |
| } | |
| .entry-filter-group .panel-title { | |
| min-width: 0; | |
| } | |
| .entry-dashboard-detail-top { | |
| grid-template-columns: 1fr; | |
| align-items: start; | |
| } | |
| .entry-dashboard-collapse summary { | |
| flex-direction: column; | |
| align-items: flex-start; | |
| } | |
| .registration-inline-grid { | |
| grid-template-columns: 1fr; | |
| gap: 14px; | |
| } | |
| .cronograma-row { | |
| grid-template-columns: 1fr; | |
| gap: 18px; | |
| } | |
| .process-meta, | |
| .cronograma-meta, | |
| .evaluator-card-meta { | |
| grid-template-columns: repeat(2, minmax(0, 1fr)); | |
| } | |
| .subform-head { | |
| align-items: flex-start; | |
| flex-direction: column; | |
| } | |
| .section-title-row, | |
| .timeline-entry-head, | |
| .topbar { | |
| align-items: flex-start; | |
| flex-direction: column; | |
| } | |
| } | |
| @media (max-width: 640px) { | |
| .app-header { | |
| padding: 0 12px; | |
| } | |
| .field-block-row { | |
| grid-template-columns: 1fr; | |
| } | |
| .detail-data-list .field-label { | |
| border-right: 0; | |
| border-bottom: 1px solid rgba(216, 227, 235, 0.82); | |
| } | |
| .nav-link { | |
| width: 100%; | |
| } | |
| .main-content { | |
| width: calc(100vw - 24px); | |
| } | |
| .section-card, | |
| .stat-card, | |
| .timeline-card, | |
| .info-card { | |
| padding: 20px; | |
| } | |
| .detail-hero { | |
| padding: 22px 20px; | |
| } | |
| .detail-hero h3 { | |
| font-size: 1.45rem; | |
| } | |
| .hero-title-button { | |
| font-size: 1.45rem; | |
| } | |
| .registration-detail-header, | |
| .registration-detail-section-title { | |
| flex-direction: column; | |
| align-items: stretch; | |
| } | |
| .registration-static-value { | |
| min-height: auto; | |
| } | |
| .process-meta, | |
| .cronograma-meta, | |
| .evaluator-card-meta { | |
| grid-template-columns: 1fr; | |
| } | |
| } | |