/* BackupR management interface */
:root { --ink:#1f2d3d; --muted:#586575; --line:#dce2e9; --accent:#2259a8; }
body { color:var(--ink); background:#f5f7fa; font-family:system-ui,-apple-system,"Segoe UI",sans-serif; }
a { color:var(--accent); }
h1 { font-size:1.85rem; letter-spacing:-.025em; margin-bottom:.6rem; }
h2 { font-size:1.15rem; margin-bottom:1rem; }
.app-header { min-height:76px; padding:1rem 2rem; background:white; border-bottom:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.brand { font-weight:750; font-size:1.45rem; color:var(--ink); text-decoration:none; }
.brand span { font-size:.8rem; font-weight:400; color:var(--muted); margin-left:1rem; }
.app-shell { display:grid; grid-template-columns:240px minmax(0,1fr); min-height:calc(100vh - 76px); }
.app-nav { border-right:1px solid var(--line); background:#fff; padding:2rem 1rem; }
.app-nav a { display:block; color:var(--muted); padding:.75rem 1rem; margin-bottom:.3rem; border-radius:6px; text-decoration:none; font-weight:500; }
.app-nav a.active { color:#173f7a; background:#eaf0fb; }
.nav-caption { padding:1.5rem 1rem; font-size:.75rem; color:var(--muted); }
main { padding:2.5rem; max-width:1480px; width:100%; }
.page-intro { color:var(--muted); max-width:70ch; margin-bottom:2rem; }
.eyebrow { color:var(--muted); font-size:.75rem; text-transform:uppercase; letter-spacing:.09em; font-weight:600; margin-bottom:.6rem; }
.panel,.summary-card { background:#fff; border:1px solid var(--line); border-radius:8px; padding:1.5rem; }
.summary-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; margin:1.8rem 0; }
.summary-card p { margin-top:.75rem; color:var(--muted); font-size:.9rem; line-height:1.8; }
.actions { display:flex; flex-wrap:wrap; gap:.75rem; }
.btn-primary { background:var(--accent); border-color:var(--accent); }
.btn { min-height:40px; }
.config-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.form-floating > label { max-width:100%; overflow:hidden; text-overflow:ellipsis; }
.config-section { margin:1rem 0 1.75rem; }
.field-help { font-size:.8rem; color:var(--muted); }
.secret-box { border-left:3px solid #dce2e9; padding-left:1rem; margin:1rem 0; }
.save-bar { position:sticky; bottom:0; background:white; border:1px solid var(--line); padding:1rem; display:flex; gap:1rem; align-items:center; z-index:2; }
.table { --bs-table-bg:transparent; font-size:.9rem; }
.table th { color:var(--muted); font-weight:600; }
.table td { overflow-wrap:anywhere; }
.status { display:inline-block; white-space:nowrap; border-radius:4px; padding:.3rem .6rem; font-size:.8rem; background:#eaf0fb; }
.run-table { min-width:680px; }
.status-success { color:#175b3c; background:#e5f2e9; }
.status-error { color:#9d2434; background:#fdebee; }
.empty-state { padding:2rem 0; color:var(--muted); }
.login-container { max-width:540px; margin:5vh auto; padding:1rem; }
.login-card { background:white; border:1px solid var(--line); border-radius:10px; padding:2rem; }
.login-card h1 { font-size:1.6rem; }
.qr-panel { text-align:center; margin-top:1.5rem; }
.qr-panel img { max-width:100%; height:auto; }
.file-tree { list-style:none; padding-left:1.25rem; }
.file-tree li { padding:.35rem 0; overflow-wrap:anywhere; }
.file-tree summary { cursor:pointer; font-weight:600; }
.file-path { font-family:ui-monospace,monospace; font-size:.85rem; }
.skip-link { position:fixed; top:-100px; left:1rem; background:white; padding:1rem; z-index:100; }
.skip-link:focus { top:1rem; }
:focus-visible { outline:3px solid #3073d7; outline-offset:3px; }
#blazor-error-ui { display:none; position:fixed; bottom:0; width:100%; padding:1rem; background:#fff3cd; z-index:999; }
#components-reconnect-modal { display:none; position:fixed; inset:0; padding:30vh 2rem; text-align:center; background:#ffffffed; z-index:998; }
#components-reconnect-modal.components-reconnect-show,#components-reconnect-modal.components-reconnect-failed,#components-reconnect-modal.components-reconnect-rejected { display:block; }
.reconnect-failed,.reconnect-rejected { display:none; }
.components-reconnect-failed .reconnect-wait,.components-reconnect-rejected .reconnect-wait { display:none; }
.components-reconnect-failed .reconnect-failed,.components-reconnect-rejected .reconnect-rejected { display:block; }
@media(max-width:900px) { .summary-grid { grid-template-columns:1fr; } main { padding:1.5rem; } .app-shell { grid-template-columns:200px minmax(0,1fr); } }
@media(max-width:650px) { .app-shell { display:block; } .app-header { padding:1rem; } .brand span { display:none; } .app-nav { border-right:0; border-bottom:1px solid var(--line); padding:.5rem; display:flex; flex-wrap:wrap; gap:.25rem; } .app-nav a { padding:.6rem; margin:0; font-size:.8rem; } .nav-caption { display:none; } main { padding:1.25rem 1rem; } .config-grid { grid-template-columns:1fr; } .login-card { padding:1.5rem; } .save-bar { flex-wrap:wrap; } }