/* Stack Commander dark theme — public site */
:root {
    --sc-bg: #0f1115;
    --sc-bg-elev: #181b22;
    --sc-surface: #1f242d;
    --sc-border: #2a313c;
    --sc-fg: #e6e9ef;
    --sc-fg-dim: #9aa3b2;
    --sc-accent: #4ea3ff;
    --sc-accent-hover: #7bbcff;
    --sc-danger: #ff6b6b;
    --sc-success: #54c787;
}

html, body {
    background: var(--sc-bg);
    color: var(--sc-fg);
    font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
    font-size: 15px;
}

body { margin-bottom: 60px; min-height: 100vh; }

a { color: var(--sc-accent); text-decoration: none; }
a:hover { color: var(--sc-accent-hover); text-decoration: underline; }

.sc-navbar { background: var(--sc-bg-elev); border-bottom: 1px solid var(--sc-border); padding: .6rem 0; }
.sc-navbar .navbar-brand { color: var(--sc-fg) !important; font-weight: 700; letter-spacing: .3px; }
.sc-navbar .nav-link { color: var(--sc-fg-dim) !important; }
.sc-navbar .nav-link:hover, .sc-navbar .nav-link.active { color: var(--sc-fg) !important; }
.sc-navbar .navbar-toggler { border-color: var(--sc-border); }

.sc-hero {
    background: radial-gradient(1200px 500px at 20% -10%, rgba(78,163,255,.18), transparent 60%),
                radial-gradient(900px 400px at 110% 10%, rgba(120,80,200,.14), transparent 60%),
                var(--sc-bg);
    border-bottom: 1px solid var(--sc-border);
    padding: 4rem 0 3rem;
}
.sc-hero h1 { font-size: 2.6rem; font-weight: 700; margin-bottom: .75rem; }
.sc-hero-icon { filter: drop-shadow(0 0 12px rgba(78,163,255,.45)); border-radius: 8px; }
.sc-hero p.lead { color: var(--sc-fg-dim); font-size: 1.15rem; max-width: 680px; }

.sc-card { background: var(--sc-surface); border: 1px solid var(--sc-border); border-radius: 8px; padding: 1.25rem; }

.btn-sc-primary { background: var(--sc-accent); border-color: var(--sc-accent); color: #07111c; font-weight: 600; }
.btn-sc-primary:hover { background: var(--sc-accent-hover); border-color: var(--sc-accent-hover); color: #07111c; }
.btn-sc-outline { background: transparent; border: 1px solid var(--sc-border); color: var(--sc-fg); }
.btn-sc-outline:hover { background: var(--sc-bg-elev); color: var(--sc-fg); }

.form-control, .form-select { background: #11141a; color: var(--sc-fg); border: 1px solid var(--sc-border); }
.form-control:focus, .form-select:focus { background: #11141a; color: var(--sc-fg); border-color: var(--sc-accent); box-shadow: 0 0 0 .2rem rgba(78,163,255,.2); }
.form-label { color: var(--sc-fg-dim); }
.form-check-input:checked { background-color: var(--sc-accent); border-color: var(--sc-accent); }

.table { color: var(--sc-fg); }
.table > :not(caption) > * > * { background: var(--sc-surface); border-bottom-color: var(--sc-border); }
.table thead th { background: var(--sc-bg-elev); color: var(--sc-fg-dim); border-bottom: 1px solid var(--sc-border); }

.wiki-layout { display: grid; grid-template-columns: 240px 1fr; gap: 24px; }
@media (max-width: 768px) { .wiki-layout { grid-template-columns: 1fr; } }
.wiki-nav { background: var(--sc-bg-elev); border: 1px solid var(--sc-border); border-radius: 8px; padding: .75rem; }
.wiki-nav a { display: block; padding: .35rem .5rem; border-radius: 4px; color: var(--sc-fg-dim); }
.wiki-nav a:hover, .wiki-nav a.active { background: var(--sc-surface); color: var(--sc-fg); text-decoration: none; }

.wiki-content { background: var(--sc-surface); border: 1px solid var(--sc-border); border-radius: 8px; padding: 1.5rem 2rem; line-height: 1.6; }
.wiki-content h1, .wiki-content h2, .wiki-content h3 { color: var(--sc-fg); margin-top: 1.5rem; }
.wiki-content code, .wiki-content pre { background: #0b0d12; border: 1px solid var(--sc-border); border-radius: 4px; }
.wiki-content pre { padding: .75rem 1rem; overflow-x: auto; }
.wiki-content code { padding: .1rem .3rem; }
.wiki-content blockquote { border-left: 3px solid var(--sc-accent); padding-left: 1rem; color: var(--sc-fg-dim); margin: 1rem 0; }
.wiki-content img { max-width: 100%; border-radius: 4px; }

.sc-footer { background: var(--sc-bg-elev); border-top: 1px solid var(--sc-border); color: var(--sc-fg-dim); padding: 1rem 0; margin-top: 3rem; }

.ql-toolbar.ql-snow, .ql-container.ql-snow { border-color: var(--sc-border) !important; background: var(--sc-bg-elev); }
.ql-toolbar.ql-snow .ql-stroke { stroke: var(--sc-fg-dim); }
.ql-toolbar.ql-snow .ql-fill { fill: var(--sc-fg-dim); }
.ql-toolbar.ql-snow .ql-picker-label { color: var(--sc-fg-dim); }
.ql-editor { background: #11141a; color: var(--sc-fg); min-height: 320px; }

.sc-pill { display: inline-block; padding: .15rem .55rem; border-radius: 999px; font-size: .8rem; background: var(--sc-bg-elev); border: 1px solid var(--sc-border); color: var(--sc-fg-dim); }
.sc-pill.new { color: var(--sc-accent); border-color: var(--sc-accent); }
.sc-pill.resolved { color: var(--sc-success); border-color: var(--sc-success); }
.sc-pill.critical { color: var(--sc-danger); border-color: var(--sc-danger); }

.sc-meta { color: var(--sc-fg-dim); font-size: .9rem; }