/* Theme aligned with production 404 page */
:root{--bg-start:#0b1220;--bg-mid:#0f172a;--bg-end:#0b1220;--text:#e5e7eb;--muted:#9ca3af;--line:#1f2937;--panel:rgba(17,24,39,.7)}
*{box-sizing:border-box}
body{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:linear-gradient(180deg,var(--bg-start) 0%,var(--bg-mid) 60%,var(--bg-end) 100%);color:var(--text);margin:0}
.container{max-width:1100px;margin:0 auto;padding:16px}
.topbar{background:#0f1420;border-bottom:1px solid #1f2937}
.brand a{color:#fff;text-decoration:none;font-weight:700}
.nav{display:flex;gap:12px;align-items:center}
.nav a{color:#d1d5db;text-decoration:none;padding:8px 10px;border-radius:8px;border:1px solid transparent}
.nav a:hover{border-color:#374151}
.logout-form{display:inline}
.logout-form .linklike{background:transparent;border:1px solid #374151;border-radius:8px;color:#d1d5db;padding:8px 10px;cursor:pointer}
main .card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:18px;box-shadow:0 10px 30px rgba(0,0,0,.25)}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.k{font-size:12px;color:#9ca3af}
.v{font-size:20px;color:#fff;margin-top:6px}
.v.small{font-size:12px;word-break:break-all}
.card-title{color:#9ca3af;font-size:12px;margin-bottom:6px}
.alert{background:#102a17;border:1px solid #166534;color:#a7f3d0;padding:10px 12px;border-radius:8px;margin:12px 0}
.alert.error{background:#2a1111;border-color:#7f1d1d;color:#fecaca}
/* Toasts */
#toast-container{position:fixed;top:16px;right:16px;display:flex;flex-direction:column;gap:10px;z-index:9999}
.toast{display:flex;align-items:center;gap:10px;min-width:240px;max-width:420px;background:#0f1420;border:1px solid #1f2937;border-radius:10px;padding:10px 12px;box-shadow:0 10px 30px rgba(0,0,0,.35);opacity:1;transform:translateY(0);transition:opacity .25s, transform .25s}
.toast.removing{opacity:0;transform:translateY(-6px)}
.toast .toast-icon{width:22px;height:22px;display:grid;place-items:center;border-radius:50%;font-weight:700}
.toast.success .toast-icon{background:#102a17;color:#a7f3d0;border:1px solid #166534}
.toast.error .toast-icon{background:#2a1111;color:#fecaca;border:1px solid #7f1d1d}
.toast .toast-message{color:#e5e7eb;font-size:14px}
form label{display:block;font-size:13px;color:#9ca3af;margin-top:8px}
input,select{background:#0b0f17;border:1px solid #243047;border-radius:8px;padding:10px 12px;color:#e5e7eb;outline:none;width:100%}
input:focus,select:focus{border-color:#3b82f6;box-shadow:0 0 0 3px rgba(59,130,246,.15)}
button.primary{background:#3b82f6;border:none;border-radius:10px;padding:10px 14px;color:#fff;font-weight:600;cursor:pointer;margin-top:12px}
button.primary:hover{background:#2563eb}
.card.narrow{max-width:480px;margin:24px auto}

/* Generic button (404-like) */
.btn{display:inline-block;background:transparent;border:1px solid #334155;border-radius:10px;padding:10px 14px;color:var(--text);text-decoration:none;font-weight:600;cursor:pointer}
.btn:hover{background:#0b1220}

/* Sidebar layout */
.layout{display:grid;grid-template-columns:220px 1fr;min-height:100vh}
.sidebar{background:var(--panel);border-right:1px solid var(--line);padding:16px;position:sticky;top:0;height:100vh}
.sidebar .title{color:#fff;font-weight:700;margin-bottom:12px}
.sidebar a{display:block;color:#d1d5db;text-decoration:none;padding:8px 10px;border-radius:8px;margin-bottom:6px;border:1px solid transparent}
.sidebar a:hover{border-color:#334155}
.sidebar a.active{background:#182240;border-color:#31406b;color:#fff}
.content{padding:24px}

/* Page title */
.page-title{font-size:22px;color:#fff;margin:0 0 14px}

/* Stat cards */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin-bottom:14px}
.stat-card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:16px;display:flex;gap:10px;align-items:center}
.stat-card .ico{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:#111827;color:#9ca3af}
.stat-card .meta{display:flex;flex-direction:column}
.stat-card .meta .k{font-size:12px;color:#9ca3af}
.stat-card .meta .v{font-size:20px;color:#fff}

/* Snippet card */
.snippet{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:16px}
.snippet .desc{font-size:12px;color:#9ca3af;margin:6px 0 10px}
.snippet textarea{width:100%;background:#0b0f17;border:1px solid #243047;border-radius:8px;color:#e5e7eb;padding:10px;font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace}
.snippet .row{display:flex;gap:8px;align-items:center;margin-top:10px}
.snippet code{color:#d1d5db}

/* Mobile responsiveness */
.mobile-topbar{display:none;background:var(--panel);border-bottom:1px solid var(--line);padding:10px 12px;align-items:center;justify-content:space-between}
.mobile-topbar .brand{color:#fff;font-weight:700}
.burger{background:transparent;border:1px solid #374151;border-radius:8px;color:#d1d5db;padding:8px 10px;cursor:pointer}

@media (max-width: 900px){
	.layout{grid-template-columns:1fr}
	.sidebar{position:fixed;left:0;top:0;bottom:0;width:260px;transform:translateX(-100%);transition:transform .25s ease;z-index:1000}
	.layout.sidebar-open .sidebar{transform:translateX(0)}
	.content{padding:16px}
	.mobile-topbar{display:flex}
}

/* Tables */
table{border-collapse:collapse;width:100%}
thead th{font-weight:600;font-size:12px;color:#9ca3af;letter-spacing:.02em}
tbody td{font-size:14px;color:#d1d5db}
tbody tr{border-bottom:1px solid #111827}
tbody tr:hover{background:#0f1420}

/* Badges */
.badge{display:inline-block;padding:2px 8px;border-radius:9999px;font-size:12px;border:1px solid #374151;background:#111827;color:#d1d5db}
.badge.confirmed{background:#102a17;color:#a7f3d0;border-color:#166534}
.badge.pending{background:#1b2332;color:#c7d2fe;border-color:#374151}
.badge.expired,.badge.failed{background:#2a1111;color:#fecaca;border-color:#7f1d1d}