﻿/* admin.css - styles for the settings editor (builds on styles.css) */
.admin{max-width:900px}
.panel{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:20px 22px;margin-bottom:18px}
.panel h3{margin:0 0 12px}
.muted{color:var(--grey);font-size:13px}
.error.left{text-align:left;min-height:1em;margin:10px 0 0}
.btn-primary.inline{width:auto;margin-top:0;padding:10px 22px}
button:disabled{opacity:.5;cursor:not-allowed}
.actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:6px}

.banner{border-radius:10px;padding:12px 16px;margin-bottom:18px;font-size:14px;border:1px solid}
.banner.ok{background:#eefaf1;border-color:#bfe6c9;color:#1e6b34}
.banner.warn{background:#fff7e6;border-color:#f3d9a0;color:#7a5200}
.banner.bad{background:#fdeeee;border-color:#f1bcbc;color:#9b2323}

.status-list{display:grid;grid-template-columns:200px 1fr;gap:8px 16px;margin:0;font-size:14px}
.status-list dt{color:var(--grey)}
.status-list dd{margin:0;word-break:break-word}
.mono{font-family:Consolas,Menlo,monospace;font-size:13px}

.setting{display:grid;grid-template-columns:1fr 200px;gap:6px 24px;padding:14px 0;border-top:1px solid var(--line)}
.setting:first-of-type{border-top:0;padding-top:4px}
.setting .meta .label{font-weight:600}
.setting .meta .desc{color:var(--grey);font-size:13px;margin-top:2px}
.setting .meta .range{color:var(--grey);font-size:12px;margin-top:2px}
.setting .control input[type=number]{width:100%;padding:9px 10px;border:1px solid var(--line);border-radius:8px;font-size:14px}
.setting .control input[type=checkbox]{width:20px;height:20px}
.setting .control .toggle{display:flex;align-items:center;gap:10px}
.setting .default-note{font-size:12px;color:var(--grey);margin-top:4px}
.setting.modified .label::after{content:"edited";margin-left:8px;font-size:11px;font-weight:600;color:var(--accent);
  background:#eaf5ff;border:1px solid #cfe6fb;border-radius:20px;padding:1px 8px}
.setting.invalid input{border-color:#c0392b}
.field-error{color:#c0392b;font-size:12px;min-height:1em;margin-top:3px}
.scope-tag{font-size:11px;font-weight:600;color:var(--grey);border:1px solid var(--line);border-radius:20px;
  padding:1px 8px;margin-left:8px;text-transform:uppercase;letter-spacing:.3px}

.field-row{display:flex;gap:16px;flex-wrap:wrap}
.field{flex:1 1 200px}.field.wide{flex:3 1 320px}
.field label{display:block;font-size:13px;color:var(--grey);margin-bottom:4px}
.field input{width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:8px}

table.history{width:100%;border-collapse:collapse;font-size:13px}
table.history th,table.history td{text-align:left;padding:8px 10px;border-top:1px solid var(--line);vertical-align:top}
table.history th{color:var(--grey);font-weight:600;border-top:0}
@media(max-width:760px){.setting{grid-template-columns:1fr}.status-list{grid-template-columns:1fr}}

/* tabs and the accounts screen */
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin-bottom:18px}
.tab{background:transparent;border:0;border-bottom:3px solid transparent;padding:10px 16px;font-size:15px;
  cursor:pointer;color:var(--grey)}
.tab.active{color:var(--dark);border-bottom-color:var(--blue);font-weight:600}
table.accounts td{vertical-align:middle}
table.accounts tr.inactive td{color:var(--grey)}
table.accounts select{padding:4px 6px;border:1px solid var(--line);border-radius:6px}
.row-actions{white-space:normal;min-width:180px}
.btn-ghost.small{padding:4px 10px;font-size:12px;margin:2px 4px 2px 0}
.field select{width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:#fff}
.secret{display:inline-block;font-size:18px;padding:8px 12px;background:#f4f7fb;border:1px solid var(--line);
  border-radius:8px;user-select:all}
#who-label{color:var(--grey);font-size:13px}
table.accounts td.num{text-align:right;font-variant-numeric:tabular-nums}

/* Usage, Monitoring and Audit tabs */
.tabs{flex-wrap:wrap}
.toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:14px;font-size:14px}
.toolbar select{padding:6px 8px;border:1px solid var(--line);border-radius:6px;background:#fff}
.toolbar input{padding:6px 8px;border:1px solid var(--line);border-radius:6px;max-width:100%}
#audit-field-filters label{display:flex;flex-direction:column;gap:4px}
#audit-field-filters input{width:180px}
#audit-body{overflow-x:auto}
.kpi-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px;margin-bottom:18px}
.kpi-grid.compact{margin:12px 0 0}
.kpi{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:12px 14px}
.kpi.warn{border-color:#f3d9a0;background:#fffaf0}.kpi.bad{border-color:#f1bcbc;background:#fdf5f5}
.kpi-label{font-size:12px;color:var(--grey)}
.kpi-value{font-size:22px;font-weight:700;margin-top:2px;font-variant-numeric:tabular-nums}
.kpi-sub{font-size:11px;color:var(--grey);margin-top:2px}
.two-col{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:0 18px}
.chart{width:100%}
.svg-chart{width:100%;height:auto;display:block}
.svg-chart .grid{stroke:#eef0f4;stroke-width:1}
.svg-chart .axis{font-size:11px;fill:#6b7280}
.svg-chart .bar.s0,.legend .key.s0{fill:#2aa0e6;background:#2aa0e6}
.svg-chart .bar.s1,.legend .key.s1{fill:#0a66c2;background:#0a66c2}
.svg-chart .bar.s2,.legend .key.s2{fill:#1e9e5a;background:#1e9e5a}
.svg-chart .bar.s3,.legend .key.s3{fill:#b0b8c4;background:#b0b8c4}
.svg-chart .line{fill:none;stroke-width:2.5}
.svg-chart .line.s0,.svg-chart .dot.s0{stroke:#2aa0e6;fill:#2aa0e6}
.svg-chart .line.s1,.svg-chart .dot.s1{stroke:#0a66c2;fill:#0a66c2}
.svg-chart .line.s0,.svg-chart .line.s1{fill:none}
.svg-chart .threshold{stroke-dasharray:6 4;stroke-width:1.5}
.svg-chart .threshold.warn{stroke:#d99a00}.svg-chart .threshold.bad{stroke:#c0392b}
.legend{display:flex;gap:6px 14px;flex-wrap:wrap;align-items:center;font-size:12px;color:var(--grey);margin-top:6px}
.legend .key{display:inline-block;width:12px;height:12px;border-radius:3px;margin-right:-8px}
.verdict{display:inline-block;border-radius:999px;padding:3px 12px;font-weight:700;font-size:13px;border:1px solid}
.verdict.ok{background:#eefaf1;border-color:#bfe6c9;color:#1e6b34}
.verdict.warn{background:#fff7e6;border-color:#f3d9a0;color:#7a5200}
.verdict.bad{background:#fdeeee;border-color:#f1bcbc;color:#9b2323}
.verdict.none{background:#f2f4f7;border-color:#dde2e8;color:#556070}
.verdict-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.findings{margin:6px 0 12px 18px;font-size:13px}
.findings.bad li{color:#9b2323}.findings.warn li{color:#7a5200}
.report-md{white-space:pre-wrap;background:#f7f9fc;border:1px solid var(--line);border-radius:8px;padding:12px;
  font-size:12px;max-height:480px;overflow:auto}
table.data td.num,table.data th.num{text-align:right;font-variant-numeric:tabular-nums}
