/** * BARMO Admin — design manual escopado (Fase 2) * ESCOPO: somente páginas com class="barmo-admin" no . */ .barmo-admin { --adm-brand: #102a43; --adm-brand-2: #1e5b8c; --adm-accent: #d9a441; --adm-accent-soft: #f4d27a; --adm-bg: #0b1220; --adm-bg-elevated: #111b2e; --adm-bg-card: #152238; --adm-ink: #e8eef6; --adm-ink-muted: #8b9cb3; --adm-ink-subtle: #5c6f88; --adm-line: rgba(255, 255, 255, 0.08); --adm-line-strong: rgba(255, 255, 255, 0.14); --adm-shadow-soft: 0 8px 28px rgba(0, 0, 0, 0.32); --adm-ok: #3ecf8e; --adm-warn: #e8b84a; --adm-info: #5eb3f0; --adm-danger: #dc4646; --adm-space-sm: 10px; --adm-space-md: 16px; --adm-radius-md: 14px; } body.barmo-admin { background: radial-gradient(ellipse 55% 38% at 0% 0%, rgba(30, 91, 140, 0.16), transparent 55%), radial-gradient(ellipse 45% 30% at 100% 100%, rgba(217, 164, 65, 0.07), transparent 50%), var(--adm-bg); color: var(--adm-ink); } .barmo-admin .shell-header { border-bottom-color: var(--adm-line); } .barmo-admin .shell-logo-mark { background: linear-gradient(145deg, #173b5d, var(--adm-brand)); color: var(--adm-accent); box-shadow: var(--adm-shadow-soft); } .barmo-admin .shell-title { color: var(--adm-ink); } .barmo-admin .shell-subtitle, .barmo-admin .shell-date { color: var(--adm-ink-muted); } .barmo-admin .shell-section-title { border-left-color: var(--adm-accent); color: var(--adm-ink); } .barmo-admin .shell-section-hint { color: var(--adm-ink-subtle); } .barmo-admin .alert-bar { background: rgba(30, 91, 140, 0.15); border-color: rgba(94, 179, 240, 0.2); color: var(--adm-ink-muted); } .barmo-admin .alert-bar strong { color: var(--adm-info); } /* Saúde do sistema */ .barmo-admin .admin-health { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin-bottom: 16px; } .barmo-admin .admin-status-badge { display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px; border-radius: 12px; font-weight: 800; font-size: 14px; border: 1px solid var(--adm-line-strong); background: var(--adm-bg-elevated); } .barmo-admin .admin-status-badge.is-ok { border-color: rgba(62, 207, 142, 0.45); color: var(--adm-ok); } .barmo-admin .admin-status-badge.is-atencao { border-color: rgba(232, 184, 74, 0.55); color: var(--adm-warn); } .barmo-admin .admin-status-badge.is-critico { border-color: rgba(220, 70, 70, 0.55); color: var(--adm-danger); } .barmo-admin .admin-metrics { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: var(--adm-space-sm); margin: 12px 0 16px; } .barmo-admin .admin-metric { padding: 10px 12px; border-radius: var(--adm-radius-md); border: 1px solid var(--adm-line); background: var(--adm-bg-card); transition: border-color 0.16s ease; } .barmo-admin .admin-metric:hover { border-color: var(--adm-line-strong); } .barmo-admin .admin-metric .label { display: block; font-size: 11px; color: var(--adm-ink-subtle); margin-bottom: 4px; } .barmo-admin .admin-metric .value { font-size: 18px; font-weight: 800; color: var(--adm-ink); } /* Integridade */ .barmo-admin .admin-actions { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; } .barmo-admin .admin-btn { display: inline-flex; align-items: center; min-height: 36px; padding: 8px 14px; border-radius: 8px; border: 1px solid var(--adm-line-strong); background: var(--adm-bg-elevated); color: var(--adm-ink); font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; text-decoration: none; transition: border-color 0.16s ease, filter 0.16s ease; } .barmo-admin .admin-btn:hover { filter: brightness(1.05); border-color: rgba(217, 164, 65, 0.4); } .barmo-admin .admin-btn:focus-visible { outline: 2px solid var(--adm-accent); outline-offset: 2px; } .barmo-admin .admin-btn.primary { background: var(--adm-accent); border-color: var(--adm-accent); color: var(--adm-brand); } .barmo-admin .admin-btn:disabled { opacity: 0.5; cursor: not-allowed; } .barmo-admin .admin-output { margin-top: 12px; padding: 12px; border-radius: 8px; border: 1px solid var(--adm-line); background: rgba(0, 0, 0, 0.15); font-size: 12px; max-height: 240px; overflow: auto; white-space: pre-wrap; color: var(--adm-ink-muted); } .barmo-admin .admin-issue-list { margin: 0; padding-left: 18px; font-size: 13px; } .barmo-admin .admin-issue-list li { margin: 4px 0; } .barmo-admin .admin-issue-list .critico { color: var(--adm-danger); } .barmo-admin .admin-issue-list .atencao { color: var(--adm-warn); } .barmo-admin .admin-issue-list .leve { color: var(--adm-ink-subtle); } /* Correções seguras */ .barmo-admin #admin-correcoes-preview, .barmo-admin #admin-limpeza-teste-preview { margin-top: var(--adm-space-md); padding: var(--adm-space-md); border-radius: var(--adm-radius-md); border: 1px solid var(--adm-line); background: var(--adm-bg-card); } /* Fornecedores table (Cap. 20) */ .barmo-admin .admin-table-wrap { overflow: auto; border: 1px solid var(--adm-line); border-radius: var(--adm-radius-md); background: var(--adm-bg-elevated); box-shadow: var(--adm-shadow-soft); } .barmo-admin .admin-table { width: 100%; border-collapse: collapse; font-size: 12px; } .barmo-admin .admin-table th, .barmo-admin .admin-table td { padding: 8px 10px; border-bottom: 1px solid var(--adm-line); text-align: left; vertical-align: top; } .barmo-admin .admin-table th { background: var(--adm-brand); color: var(--adm-ink-muted); font-weight: 800; font-size: 10px; text-transform: uppercase; letter-spacing: 0.05em; position: sticky; top: 0; } .barmo-admin .admin-table tbody tr:nth-child(even) td { background: rgba(255, 255, 255, 0.02); } .barmo-admin .admin-table tbody tr:hover td { background: rgba(30, 91, 140, 0.12); } .barmo-admin .admin-backup-select { min-width: 220px; padding: 8px; border-radius: 8px; border: 1px solid var(--adm-line-strong); background: var(--adm-bg-elevated); color: var(--adm-ink); font: inherit; } .barmo-admin .admin-meta { font-size: 12px; color: var(--adm-ink-subtle); margin: 8px 0; } /* Gate */ .barmo-admin .sistema-gate.is-locked { border-color: var(--adm-line); background: rgba(16, 42, 67, 0.35); } .barmo-admin .sistema-gate__form { background: rgba(16, 42, 67, 0.5); border-color: var(--adm-line); } .barmo-admin .sistema-gate__input { background: var(--adm-bg-elevated); border-color: var(--adm-line-strong); color: var(--adm-ink); } .barmo-admin .sistema-gate__submit { background: var(--adm-accent); border-color: var(--adm-accent); color: var(--adm-brand); } .barmo-admin .sistema-gate__error { color: var(--adm-danger); } .barmo-admin .shell-footer { border-top-color: var(--adm-line); color: var(--adm-ink-subtle); } @media (prefers-reduced-motion: reduce) { .barmo-admin .admin-btn, .barmo-admin .admin-metric { transition: none; } } /* Diagnóstico do Database — Fase Database 1.1 */ .barmo-admin .db-diag-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px; margin: 14px 0; } .barmo-admin .db-diag-card { padding: 12px 14px; border-radius: 10px; border: 1px solid var(--adm-line); background: var(--adm-bg-elevated); } .barmo-admin .db-diag-card h3 { margin: 0 0 6px; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.02em; color: var(--adm-ink-muted); } .barmo-admin .db-diag-valor { margin: 0 0 4px; font-size: 18px; font-weight: 800; color: var(--adm-ink); } .barmo-admin .db-diag-valor.db-diag-ok { color: #4caf7d; } .barmo-admin .db-diag-valor.db-diag-alerta { color: #d9a441; } .barmo-admin .db-diag-detalhe { margin: 0; font-size: 12px; color: var(--adm-ink-muted); line-height: 1.4; } .barmo-admin .db-diag-lista { margin: 4px 0 0; padding-left: 16px; font-size: 12px; color: var(--adm-ink-muted); line-height: 1.6; } .barmo-admin .db-diag-lista .db-diag-aviso { list-style: none; margin-left: -16px; margin-top: 6px; font-style: italic; opacity: 0.85; } /* Preview de Migração localStorage -> Supabase — Fase Database 1.2 */ .barmo-admin .admin-subtitle { margin: 18px 0 8px; font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.02em; color: var(--adm-ink-muted); } .barmo-admin .pv-badge { display: inline-flex; align-items: center; padding: 2px 8px; border-radius: 999px; font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.02em; } .barmo-admin .pv-badge-critico { background: rgba(217, 76, 65, 0.18); color: #e06a5e; } .barmo-admin .pv-badge-medio { background: rgba(217, 164, 65, 0.18); color: #d9a441; } .barmo-admin .pv-badge-baixo { background: rgba(76, 175, 125, 0.18); color: #4caf7d; } /* Limpeza Pré-Migração — Fase Database 1.2.2 */ .barmo-admin .lp-item-card { padding: 12px 14px; border-radius: 10px; border: 1px solid var(--adm-line); background: var(--adm-bg-elevated); margin-bottom: 10px; } .barmo-admin .lp-item-card.lp-item-marcado { opacity: 0.55; } .barmo-admin .lp-item-card .lp-item-titulo { display: flex; align-items: center; gap: 8px; font-weight: 800; margin-bottom: 6px; } .barmo-admin .lp-item-card dl { display: grid; grid-template-columns: max-content 1fr; gap: 4px 10px; font-size: 12px; color: var(--adm-ink-muted); margin: 8px 0; } .barmo-admin .lp-item-card dt { font-weight: 700; color: var(--adm-ink); } .barmo-admin .lp-item-card dd { margin: 0; } #lp-checklist li.lp-check-ok { color: #4caf7d; } #lp-checklist li.lp-check-pendente { color: #d9a441; }