/* Plain working styles for the console until the design arrives. */

.content {
    padding: 1.5rem 2rem;
    max-width: 1280px;
}

h1 { font-size: 1.6rem; margin: 0 0 1rem; }
h2 { font-size: 1.15rem; margin: 2rem 0 0.75rem; }

.shell-brand { font-weight: 600; margin-right: 2rem; }
.shell-nav { display: flex; gap: 1.25rem; flex: 1; }
.shell-nav a { color: inherit; text-decoration: none; opacity: 0.8; }
.shell-nav a:hover, .shell-nav a.active { opacity: 1; text-decoration: underline; }
.shell-user { display: flex; gap: 0.75rem; align-items: center; margin: 0; }

.link-button {
    background: none; border: 0; padding: 0; color: inherit; font: inherit;
    text-decoration: underline; cursor: pointer;
}

.crumbs { margin: 0 0 0.25rem; color: #5b6472; font-size: 0.9rem; }
.empty, .hint { color: #5b6472; }
.hint { font-size: 0.9rem; }
.error { color: #b3261e; margin: 0; }

.grid { border-collapse: collapse; width: 100%; }
.grid th, .grid td { text-align: left; padding: 0.5rem 0.75rem; border-bottom: 1px solid #e3e6ea; vertical-align: top; }
.grid th { font-weight: 600; font-size: 0.85rem; color: #5b6472; white-space: nowrap; }
.grid .num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.grid--log td { font-family: Consolas, "Cascadia Mono", monospace; font-size: 0.85rem; }

.facts { display: grid; grid-template-columns: max-content 1fr; gap: 0.35rem 1.5rem; margin: 0; }
.facts dt { color: #5b6472; }
.facts dd { margin: 0; }

.badge { display: inline-block; padding: 0.1rem 0.55rem; border-radius: 999px; font-size: 0.8rem; font-weight: 600; white-space: nowrap; }
h1 .badge { vertical-align: middle; margin-left: 0.5rem; }
.badge--good { background: #dff3e4; color: #17603a; }
.badge--warn { background: #fdecc8; color: #7a4b00; }
.badge--bad { background: #fbdcd9; color: #8c1d18; }
.badge--info { background: #dbe9fb; color: #124a94; }
.badge--muted { background: #e9ecf0; color: #4a5361; }

.tiles { display: flex; flex-wrap: wrap; gap: 1rem; }
.tile { border: 1px solid #e3e6ea; border-radius: 8px; padding: 0.9rem 1.25rem; min-width: 8rem; display: flex; flex-direction: column; }
.tile-value { font-size: 1.8rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.tile-label { color: #5b6472; font-size: 0.9rem; }
.tile--bad { border-color: #e9a29c; background: #fff5f4; }
.outcomes { display: flex; flex-wrap: wrap; gap: 0.5rem; }

.form { display: flex; flex-wrap: wrap; gap: 1rem; align-items: flex-end; }
.form--stacked { flex-direction: column; align-items: stretch; max-width: 32rem; }
.form label { display: flex; flex-direction: column; gap: 0.25rem; font-size: 0.9rem; color: #5b6472; }
.form input, .form select, .form textarea {
    font: inherit; color: #1a1f26; padding: 0.4rem 0.55rem; border: 1px solid #b9c0ca; border-radius: 6px; min-width: 14rem;
}

.button {
    display: inline-block; font: inherit; font-weight: 600; cursor: pointer; text-decoration: none;
    background: #0f6cbd; color: #fff; border: 1px solid #0f6cbd; border-radius: 6px; padding: 0.45rem 1rem;
}
.button:hover { background: #115ea3; }
.button--quiet { background: #fff; color: #1a1f26; border-color: #b9c0ca; }
.button--quiet:hover { background: #f3f4f6; }
.button--danger { background: #b3261e; border-color: #b3261e; }
.button--danger:hover { background: #8c1d18; }

.callout { border: 1px solid #b9d3f2; background: #f2f7fd; border-radius: 8px; padding: 0.25rem 1.25rem; margin: 1rem 0; max-width: 40rem; }
.callout--danger { border-color: #e9a29c; background: #fff5f4; }
.code-display { font-family: Consolas, "Cascadia Mono", monospace; font-size: 1.4rem; letter-spacing: 0.08em; user-select: all; }

.signin { max-width: 24rem; margin: 12vh auto 0; text-align: center; }
.signin .button { margin-top: 0.5rem; }