/* /Components/Layout/ConsoleLayout.razor.rz.scp.css */
/* The console shell - dark / flightline / amber-accent / monospace labels (mockup
   docs/design/Management-Console.dc.html). Dark-only, matching the mockup's single committed look. */

.console[b-w7kycb2hqc] {
    display: flex;
    min-height: 100vh;
    background: #0e0f11;
    color: #f5f5f7;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, system-ui, sans-serif;
}

[data-mono][b-w7kycb2hqc] {
    font-family: ui-monospace, 'SF Mono', Menlo, monospace;
}

/* ---- left nav ---- */
.console-nav[b-w7kycb2hqc] {
    flex: none;
    width: 246px;
    display: flex;
    flex-direction: column;
    background: #08090a;
    border-right: 1px solid rgba(255, 255, 255, .06);
}

.nav-brand[b-w7kycb2hqc] {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 15px 14px;
    border-bottom: 1px solid rgba(255, 255, 255, .05);
}

.brand-mark[b-w7kycb2hqc] {
    position: relative;
    flex: none;
    width: 28px;
    height: 28px;
    border-radius: 8px;
    background: #d9a95c;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.brand-arch[b-w7kycb2hqc] {
    position: absolute;
    width: 14px;
    height: 11px;
    top: 8px;
    border: 2.2px solid #241a06;
    border-bottom: none;
    border-radius: 7px 7px 0 0;
}

.brand-nose[b-w7kycb2hqc] {
    position: absolute;
    bottom: 8px;
    width: 0;
    height: 0;
    border-left: 3px solid transparent;
    border-right: 3px solid transparent;
    border-bottom: 4.5px solid #241a06;
}

.brand-word[b-w7kycb2hqc] {
    font-size: 14px;
    font-weight: 600;
    letter-spacing: .2px;
    color: #c9cacf;
}

.brand-badge[b-w7kycb2hqc] {
    font: 600 8.5px ui-monospace, Menlo, monospace;
    letter-spacing: .5px;
    padding: 3px 7px;
    border-radius: 6px;
    background: rgba(130, 174, 227, .14);
    color: #9cc3f0;
    text-transform: uppercase;
}

.nav-orgchip-wrap[b-w7kycb2hqc] {
    padding: 13px;
    border-bottom: 1px solid rgba(255, 255, 255, .05);
}

.nav-orgchip[b-w7kycb2hqc] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 9px;
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, .08);
}

.orgchip-avatar[b-w7kycb2hqc] {
    flex: none;
    width: 28px;
    height: 28px;
    border-radius: 8px;
    background: #182430;
    color: #82aee3;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font: 700 12px ui-monospace, Menlo, monospace;
}

.orgchip-text[b-w7kycb2hqc] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.orgchip-name[b-w7kycb2hqc] {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: -.2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.orgchip-id[b-w7kycb2hqc] {
    font-size: 9.5px;
    color: #66686e;
}

.nav-items[b-w7kycb2hqc] {
    flex: 1;
    padding: 11px 9px 4px;
    display: flex;
    flex-direction: column;
    gap: 2px;
    overflow: auto;
}

.nav-group[b-w7kycb2hqc] {
    font: 700 8.5px ui-monospace, Menlo, monospace;
    letter-spacing: .6px;
    color: #5b6069;
    margin: 2px 4px 6px;
    text-transform: uppercase;
}

.nav-item[b-w7kycb2hqc] {
    display: flex;
    align-items: center;
    gap: 11px;
    height: 34px;
    padding: 0 11px;
    border-radius: 9px;
    font-size: 12.5px;
    font-weight: 500;
    color: #8a8c93;
    text-decoration: none;
    transition: background .1s ease, color .1s ease;
}

.nav-item:hover[b-w7kycb2hqc] {
    background: rgba(255, 255, 255, .03);
    color: #c9cacf;
}

.nav-item.active[b-w7kycb2hqc] {
    background: rgba(130, 174, 227, .1);
    box-shadow: inset 2.5px 0 0 #82aee3;
    font-weight: 700;
    color: #f5f5f7;
}

.nav-ic[b-w7kycb2hqc] {
    flex: none;
    width: 16px;
    text-align: center;
    font-size: 13px;
    color: #66686e;
}

.nav-item.active .nav-ic[b-w7kycb2hqc] {
    color: #82aee3;
}

.nav-label[b-w7kycb2hqc] {
    flex: 1;
}

.nav-soon[b-w7kycb2hqc] {
    flex: none;
    font: 700 8px ui-monospace, Menlo, monospace;
    letter-spacing: .4px;
    color: #66686e;
    background: rgba(255, 255, 255, .05);
    border-radius: 5px;
    padding: 2px 6px;
    text-transform: uppercase;
}

.nav-footer[b-w7kycb2hqc] {
    padding: 11px;
    border-top: 1px solid rgba(255, 255, 255, .05);
    display: flex;
    flex-direction: column;
    gap: 9px;
}

.nav-sync[b-w7kycb2hqc] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 9px;
    background: rgba(127, 208, 165, .06);
    border: 1px solid rgba(127, 208, 165, .24);
    border-radius: 10px;
}

.sync-dot[b-w7kycb2hqc] {
    flex: none;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #7fd0a5;
}

.sync-text[b-w7kycb2hqc] {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.sync-label[b-w7kycb2hqc] {
    font-size: 10.5px;
    font-weight: 600;
    color: #7fd0a5;
}

.sync-sub[b-w7kycb2hqc] {
    font-size: 9px;
    color: #66686e;
}

.nav-user[b-w7kycb2hqc] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.user-avatar[b-w7kycb2hqc] {
    flex: none;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: #0a84ff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font: 700 9px ui-monospace, Menlo, monospace;
    color: #fff;
}

.user-text[b-w7kycb2hqc] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.user-name[b-w7kycb2hqc] {
    font-size: 11.5px;
    color: #c9cacf;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.user-link[b-w7kycb2hqc],
.user-role[b-w7kycb2hqc] {
    font-size: 9px;
    color: #82aee3;
    text-decoration: none;
}

.user-role[b-w7kycb2hqc] {
    color: #66686e;
}

.user-link:hover[b-w7kycb2hqc] {
    color: #9cc4f0;
}

/* ---- main ---- */
.console-main[b-w7kycb2hqc] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    background: #0e0f11;
}

.console-topbar[b-w7kycb2hqc] {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 56px;
    padding: 12px 22px;
    border-bottom: 1px solid rgba(255, 255, 255, .06);
    flex-wrap: wrap;
}

.topbar-title[b-w7kycb2hqc] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.topbar-h[b-w7kycb2hqc] {
    margin: 0;
    font-size: 17px;
    font-weight: 700;
    letter-spacing: -.3px;
    color: #f5f5f7;
}

.topbar-sub[b-w7kycb2hqc] {
    font-size: 11.5px;
    color: #66686e;
}

.topbar-spacer[b-w7kycb2hqc] {
    flex: 1;
}

.chip[b-w7kycb2hqc] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font: 600 10.5px ui-monospace, Menlo, monospace;
    border-radius: 8px;
    padding: 6px 11px;
}

.chip-plan[b-w7kycb2hqc] {
    color: #c9cacf;
    background: #141517;
    border: 1px solid rgba(255, 255, 255, .08);
}

.chip-ok[b-w7kycb2hqc] {
    color: #7fd0a5;
    background: rgba(127, 208, 165, .08);
    border: 1px solid rgba(127, 208, 165, .26);
}

.chip-attn[b-w7kycb2hqc] {
    color: #e7c489;
    background: rgba(240, 185, 95, .08);
    border: 1px solid rgba(240, 185, 95, .3);
}

.chip-dot[b-w7kycb2hqc] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.topbar-updated[b-w7kycb2hqc] {
    font-size: 9.5px;
    color: #5b6069;
}

.console-body[b-w7kycb2hqc] {
    flex: 1;
    min-height: 0;
    overflow: auto;
}
/* /Components/Pages/Overview.razor.rz.scp.css */
/* Overview page (mockup §ORG · OVERVIEW gauges row). Read-only, live from /me. */

.ov-pad[b-ssauneh713] {
    padding: 20px 22px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.ov-grid[b-ssauneh713] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
}

@media (max-width: 900px) {
    .ov-grid[b-ssauneh713] {
        grid-template-columns: 1fr;
    }
}

.ov-card[b-ssauneh713] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    background: #0b0c0d;
    border: 1px solid rgba(255, 255, 255, .07);
    border-radius: 14px;
    padding: 16px 17px;
}

.ov-card-soon[b-ssauneh713] {
    border-style: dashed;
}

.ov-card-head[b-ssauneh713] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.ov-kicker[b-ssauneh713] {
    font: 700 9px ui-monospace, Menlo, monospace;
    letter-spacing: .5px;
    color: #5b6069;
    text-transform: uppercase;
    flex: 1;
}

.ov-status[b-ssauneh713] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font: 9.5px ui-monospace, Menlo, monospace;
}

.ov-status-ok[b-ssauneh713] {
    color: #7fd0a5;
}

.ov-status-attn[b-ssauneh713] {
    color: #e7c489;
}

.ov-status-dot[b-ssauneh713] {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: currentColor;
}

.ov-plan[b-ssauneh713] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.ov-plan-tier[b-ssauneh713] {
    font-size: 22px;
    font-weight: 700;
    letter-spacing: -.4px;
}

.ov-plan-state[b-ssauneh713] {
    font-size: 11px;
    color: #8a8c93;
}

.ov-rule[b-ssauneh713] {
    height: 1px;
    background: rgba(255, 255, 255, .06);
}

.ov-kv[b-ssauneh713] {
    display: flex;
    flex-direction: column;
    gap: 7px;
    font-size: 11px;
    color: #8a8c93;
}

.ov-kv-row[b-ssauneh713] {
    display: flex;
}

.ov-kv-k[b-ssauneh713] {
    flex: 1;
}

.ov-kv-v[b-ssauneh713] {
    color: #c9cacf;
}

.ov-good[b-ssauneh713] {
    color: #7fd0a5;
}

.ov-seat-count[b-ssauneh713] {
    display: flex;
    align-items: baseline;
    gap: 7px;
}

.ov-seat-used[b-ssauneh713] {
    font: 700 22px ui-monospace, Menlo, monospace;
    letter-spacing: -.5px;
    color: #82aee3;
}

.ov-seat-cap[b-ssauneh713] {
    font: 12px ui-monospace, Menlo, monospace;
    color: #8a8c93;
}

.ov-attn[b-ssauneh713] {
    color: #f0b95f;
}

.ov-bar[b-ssauneh713] {
    height: 10px;
    border-radius: 5px;
    background: #1b1c1f;
    overflow: hidden;
}

.ov-bar-fill[b-ssauneh713] {
    display: block;
    height: 100%;
    background: #82aee3;
    border-radius: 5px;
}

.ov-bar-attn[b-ssauneh713] {
    background: linear-gradient(90deg, #82aee3, #f0b95f);
}

.ov-seat-note[b-ssauneh713] {
    font: 10.5px ui-monospace, Menlo, monospace;
}

.ov-muted[b-ssauneh713] {
    margin: 0;
    font-size: 11.5px;
    line-height: 1.5;
    color: #8a8c93;
}

/* ---- idle / empty states ---- */
.ov-empty[b-ssauneh713] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 14px;
    background: #0b0c0d;
    border: 1px dashed rgba(255, 255, 255, .14);
    border-radius: 16px;
    padding: 44px 24px;
}

.ov-empty-ic[b-ssauneh713] {
    width: 48px;
    height: 48px;
    border-radius: 13px;
    background: rgba(147, 160, 173, .12);
    color: #93a0ad;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
}

.ov-empty-text[b-ssauneh713] {
    max-width: 440px;
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.ov-empty-title[b-ssauneh713] {
    font-size: 17px;
    font-weight: 700;
}

.ov-empty-body[b-ssauneh713] {
    font-size: 13px;
    line-height: 1.6;
    color: #8a8c93;
}

.ov-signin[b-ssauneh713] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 40px;
    padding: 0 18px;
    border-radius: 10px;
    background: rgba(130, 174, 227, .14);
    border: 1px solid rgba(130, 174, 227, .34);
    font-size: 13px;
    font-weight: 700;
    color: #9cc4f0;
    text-decoration: none;
}

.ov-signin:hover[b-ssauneh713] {
    background: rgba(130, 174, 227, .2);
}

.ov-signin-off[b-ssauneh713] {
    background: rgba(255, 255, 255, .03);
    border-color: rgba(255, 255, 255, .08);
    color: #5b6069;
    font-size: 11px;
    font-weight: 600;
    cursor: not-allowed;
}

.console-loading[b-ssauneh713] {
    font-size: 12px;
    color: #66686e;
}
/* /Components/Pages/Placeholder.razor.rz.scp.css */
.ph-pad[b-iale2ab274] {
    padding: 20px 22px;
}

.ph-empty[b-iale2ab274] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 13px;
    background: #0b0c0d;
    border: 1px dashed rgba(255, 255, 255, .14);
    border-radius: 16px;
    padding: 48px 24px;
    color: #f5f5f7;
}

.ph-ic[b-iale2ab274] {
    width: 46px;
    height: 46px;
    border-radius: 12px;
    background: rgba(130, 174, 227, .1);
    color: #82aee3;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 19px;
}

.ph-text[b-iale2ab274] {
    max-width: 420px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.ph-title[b-iale2ab274] {
    font-size: 17px;
    font-weight: 700;
}

.ph-body[b-iale2ab274] {
    font-size: 12.5px;
    line-height: 1.6;
    color: #8a8c93;
}

.ph-badge[b-iale2ab274] {
    font: 700 8.5px ui-monospace, Menlo, monospace;
    letter-spacing: .5px;
    color: #66686e;
    background: rgba(255, 255, 255, .05);
    border-radius: 6px;
    padding: 4px 9px;
    text-transform: uppercase;
}
