@import '_content/Ui/Ui.5lnay7ltdx.bundle.scp.css';

/* /Components/Pages/Account/Dialogs/CreateApiKeyDialog.razor.rz.scp.css */
/* The secret is one long unbroken token: it must wrap inside the dialog rather than scroll away,
   because this is the only time it is ever shown. */
.hp-api-key-secret[b-2gwmi7q9py] {
    white-space: pre-wrap;
    word-break: break-all;
}
/* /Components/Pages/Billing/BillingUsageFilterBar.razor.rz.scp.css */
/* The filter chips became <button> so they are focusable and can announce aria-pressed; these
   rules only undo the native button chrome so they still look exactly like the badges they wrap.
   Focus is deliberately NOT suppressed — the theme's outline is the only keyboard affordance. */
.hp-filter-badge[b-bj1pmp4e81] {
    appearance: none;
    background: none;
    border: 0;
    padding: 0;
    margin: 0;
    font: inherit;
    color: inherit;
    display: inline-flex;
    border-radius: var(--hp-radius-sm);
}
/* /Components/Pages/Billing/SpendApprovalDialog.razor.rz.scp.css */
.sad-summary[b-4bjve6kdrq] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    padding: 0.75rem;
    border: 1px solid var(--hp-border-subtle);
    border-radius: var(--hp-radius);
    background: var(--hp-surface-muted);
}

.sad-action[b-4bjve6kdrq] {
    margin: 0;
    font-weight: 600;
    color: var(--hp-text);
}

.sad-where[b-4bjve6kdrq] {
    margin: 0;
    font-size: var(--hp-font-2xs);
    color: var(--hp-text-muted);
}

.sad-quote[b-4bjve6kdrq] {
    margin: 0.2rem 0 0;
    font-size: var(--hp-font-xs);
    color: var(--hp-text);
    font-variant-numeric: tabular-nums;
}
/* /Components/Pages/Billing/SpendApprovalInbox.razor.rz.scp.css */
.sai[b-4dwf2aqhco] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.sai-request[b-4dwf2aqhco] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.sai-head[b-4dwf2aqhco] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.sai-action[b-4dwf2aqhco] {
    margin: 0;
    font-weight: 600;
    color: var(--hp-text);
}

.sai-where[b-4dwf2aqhco] {
    margin: -0.5rem 0 0;
    font-size: var(--hp-font-2xs);
    color: var(--hp-text-muted);
}

.sai-facts[b-4dwf2aqhco] {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: 0.4rem 1rem;
    margin: 0;
    font-size: var(--hp-font-xs);
}

.sai-fact[b-4dwf2aqhco] {
    display: contents;
}

.sai-fact dt[b-4dwf2aqhco] {
    color: var(--hp-text-muted);
}

.sai-fact dd[b-4dwf2aqhco] {
    margin: 0;
    color: var(--hp-text);
}

.sai-quote[b-4dwf2aqhco] {
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.sai-basis[b-4dwf2aqhco] {
    display: block;
    margin-top: 0.2rem;
    font-size: var(--hp-font-2xs);
    color: var(--hp-text-muted);
}

.sai-actions[b-4dwf2aqhco] {
    display: flex;
    gap: 0.5rem;
}

@media (max-width: 640px) {
    .sai-facts[b-4dwf2aqhco] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/Billing/SpendEnvelopeDialog.razor.rz.scp.css */
.sed-field[b-daca0ekcic] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.sed-label[b-daca0ekcic] {
    font-size: var(--hp-font-xs);
    font-weight: 600;
    color: var(--hp-text);
}

.sed-hint[b-daca0ekcic] {
    font-size: var(--hp-font-2xs);
    color: var(--hp-text-muted);
}

.sed-options[b-daca0ekcic] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.sed-option[b-daca0ekcic] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    padding: 0.6rem 0.75rem;
    border: 1px solid var(--hp-border-subtle);
    border-radius: var(--hp-radius);
    background: transparent;
    color: var(--hp-text);
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.sed-option:hover[b-daca0ekcic] {
    background: var(--hp-surface-hover);
}

.sed-option[aria-checked="true"][b-daca0ekcic] {
    border-color: var(--hp-primary-accent);
    background: var(--hp-primary-muted);
}

.sed-option:focus-visible[b-daca0ekcic] {
    outline: 2px solid var(--hp-primary-accent);
    outline-offset: 2px;
}

.sed-option-title[b-daca0ekcic] {
    font-weight: 600;
    font-size: var(--hp-font-xs);
}

.sed-option-description[b-daca0ekcic] {
    font-size: var(--hp-font-2xs);
    color: var(--hp-text-muted);
}
/* /Components/Pages/Billing/SpendEnvelopeHistoryDialog.razor.rz.scp.css */
.seh-list[b-hncm68xctc] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.seh-item[b-hncm68xctc] {
    padding-bottom: 0.75rem;
    border-bottom: 1px solid var(--hp-border-subtle);
}

.seh-item:last-child[b-hncm68xctc] {
    border-bottom: none;
    padding-bottom: 0;
}

.seh-head[b-hncm68xctc] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.seh-version[b-hncm68xctc] {
    font-weight: 600;
    font-size: var(--hp-font-xs);
    color: var(--hp-text);
}

.seh-when[b-hncm68xctc] {
    margin-left: auto;
    font-size: var(--hp-font-2xs);
    color: var(--hp-text-muted);
    font-variant-numeric: tabular-nums;
}

.seh-detail[b-hncm68xctc] {
    margin: 0.3rem 0 0;
    font-size: var(--hp-font-2xs);
    color: var(--hp-text-muted);
}
/* /Components/Pages/Billing/SpendEnvelopeMeter.razor.rz.scp.css */
.sem[b-63vpqppn8p] {
    display: flex;
    gap: var(--hp-space-4);
    align-items: flex-start;
}

.sem-dial[b-63vpqppn8p] {
    position: relative;
    flex: 0 0 5.5rem;
    width: 5.5rem;
    height: 5.5rem;
}

.sem-dial svg[b-63vpqppn8p] {
    width: 100%;
    height: 100%;
}

.sem-dial-track[b-63vpqppn8p] {
    fill: none;
    stroke: var(--hp-surface-muted);
    stroke-width: 6;
}

.sem-dial-fill[b-63vpqppn8p] {
    fill: none;
    stroke: var(--hp-primary);
    stroke-width: 6;
    stroke-linecap: round;
}

.sem-dial-over .sem-dial-fill[b-63vpqppn8p] {
    stroke: var(--hp-warning);
}

.sem-dial-text[b-63vpqppn8p] {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    line-height: 1.1;
}

.sem-dial-value[b-63vpqppn8p] {
    font-size: 1rem;
    font-weight: 600;
    color: var(--hp-text);
    font-variant-numeric: tabular-nums;
}

.sem-dial-caption[b-63vpqppn8p] {
    font-size: 0.6875rem;
    color: var(--hp-text-muted);
}

.sem-body[b-63vpqppn8p] {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: var(--hp-space-3);
}

.sem-row[b-63vpqppn8p] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.sem-row-head[b-63vpqppn8p] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 0.25rem 1rem;
    font-size: var(--hp-font-xs);
}

.sem-row-title[b-63vpqppn8p] {
    color: var(--hp-text-secondary);
    font-weight: 500;
}

.sem-row-figure[b-63vpqppn8p] {
    color: var(--hp-text);
    font-variant-numeric: tabular-nums;
}

.sem-track[b-63vpqppn8p] {
    position: relative;
    height: 0.625rem;
    border-radius: var(--hp-radius-pill);
    border: 1px solid var(--hp-border-subtle);
    background: var(--hp-surface-muted);
}

/* The 2px gap keeps adjacent parts readable as parts, not one blended fill. */
.sem-fill[b-63vpqppn8p] {
    display: flex;
    gap: 2px;
    height: 100%;
    overflow: hidden;
    border-radius: var(--hp-radius-pill);
}

.sem-seg[b-63vpqppn8p] {
    display: block;
    height: 100%;
    flex: 0 0 auto;
}

.sem-seg-recorded[b-63vpqppn8p] {
    background: var(--hp-primary);
}

.sem-seg-committed[b-63vpqppn8p] {
    background: var(--hp-primary-accent);
}

/* Reserved is real money but not yet a fact on the bill: striped, like the ledger's projected part. */
.sem-seg-reserved[b-63vpqppn8p] {
    background: repeating-linear-gradient(-55deg, var(--hp-primary-accent) 0 3px, transparent 3px 6px);
}

.sem-seg-runrate[b-63vpqppn8p] {
    background: var(--hp-primary-light);
}

.sem-cap[b-63vpqppn8p] {
    position: absolute;
    top: -0.25rem;
    bottom: -0.25rem;
    width: 2px;
    margin-left: -1px;
    background: var(--hp-text);
}

.sem-legend[b-63vpqppn8p] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem 1rem;
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: var(--hp-font-2xs);
    color: var(--hp-text-muted);
}

.sem-legend li[b-63vpqppn8p] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.sem-legend strong[b-63vpqppn8p] {
    color: var(--hp-text);
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.sem-swatch[b-63vpqppn8p] {
    width: 0.625rem;
    height: 0.625rem;
    border-radius: 2px;
    display: inline-block;
    border: 1px solid var(--hp-border-subtle);
}

.sem-over[b-63vpqppn8p] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    margin: 0;
    font-size: var(--hp-font-2xs);
    color: var(--hp-text);
}

.sem-over[b-63vpqppn8p]  .rzi {
    color: var(--hp-warning);
    font-size: 1rem;
}

.sem-caption[b-63vpqppn8p],
.sem-foot[b-63vpqppn8p] {
    margin: 0;
    font-size: var(--hp-font-2xs);
    color: var(--hp-text-muted);
}

@media (max-width: 640px) {
    .sem[b-63vpqppn8p] {
        flex-direction: column;
    }
}
/* /Components/Pages/Billing/SpendEnvelopes.razor.rz.scp.css */
.se-roof[b-dvrrx16dp1] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.se-roof-title[b-dvrrx16dp1] {
    margin: 0;
    font-weight: 600;
    color: var(--hp-text);
}

.se-roof-body[b-dvrrx16dp1] {
    margin: 0;
    font-size: var(--hp-font-xs);
    color: var(--hp-text-secondary);
    max-width: 72ch;
}

.se-roof-links[b-dvrrx16dp1] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    margin: 0.25rem 0 0;
    font-size: var(--hp-font-xs);
}

.se-card[b-dvrrx16dp1] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.se-card-head[b-dvrrx16dp1] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
}

.se-card-heading[b-dvrrx16dp1] {
    min-width: 0;
}

.se-card-title[b-dvrrx16dp1] {
    margin: 0;
    font-weight: 600;
    color: var(--hp-text);
}

.se-card-sub[b-dvrrx16dp1],
.se-card-missing[b-dvrrx16dp1] {
    margin: 0.2rem 0 0;
    font-size: var(--hp-font-2xs);
    color: var(--hp-text-muted);
}

.se-card-bounded[b-dvrrx16dp1] {
    margin: 0.3rem 0 0;
    font-size: var(--hp-font-2xs);
    color: var(--hp-text);
}

.se-card-actions[b-dvrrx16dp1] {
    display: flex;
    gap: 0.25rem;
    flex: 0 0 auto;
}

.se-unbounded[b-dvrrx16dp1] {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid var(--hp-border-subtle);
}
/* /Components/Pages/Databases/DatabasePortalPanel.razor.rz.scp.css */
/* The grid needs its own frame inside the flush browser card: without it the rows run edge to
   edge and read as part of the toolbar above them. */
.hp-portal-grid-frame[b-txhswsi62t] {
    border: 1px solid var(--hp-border-subtle);
    border-radius: var(--hp-radius-sm);
    overflow: hidden;
}
/* /Components/Pages/Databases/PortalCreateTableDialog.razor.rz.scp.css */
/* Compact frame for a repeated column row: an HpCard's page-level padding would push a
   four-column table past the dialog's scroll height. */
.hp-column-editor[b-xwk2x8asez] {
    padding: 0.75rem;
    border: 1px solid var(--hp-border-subtle);
    border-radius: var(--hp-radius-sm);
    background: var(--hp-surface);
}
/* /Components/Pages/Deployments/Detail.razor.rz.scp.css */
.hp-deployment-resources[b-06ridjj9gw] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.hp-deployment-resource[b-06ridjj9gw] {
    display: flex;
    align-items: flex-start;
    gap: 0.65rem;
    margin: -0.25rem -0.5rem;
    padding: 0.25rem 0.5rem;
    border-radius: var(--hp-radius-sm);
    color: inherit;
    text-decoration: none;
}

a.hp-deployment-resource:hover[b-06ridjj9gw],
a.hp-deployment-resource:focus-visible[b-06ridjj9gw] {
    background: var(--hp-surface-hover);
}

a.hp-deployment-resource:hover .hp-deployment-resource-name[b-06ridjj9gw],
a.hp-deployment-resource:focus-visible .hp-deployment-resource-name[b-06ridjj9gw] {
    color: var(--hp-primary-accent);
    text-decoration: underline;
}

a.hp-deployment-resource:focus-visible[b-06ridjj9gw] {
    outline: 2px solid var(--hp-primary-accent);
    outline-offset: 2px;
}

.hp-deployment-resource-text[b-06ridjj9gw] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.hp-deployment-resource-name[b-06ridjj9gw] {
    color: var(--hp-text);
    font-size: var(--hp-font-sm);
    overflow-wrap: anywhere;
}

.hp-deployment-resource-label[b-06ridjj9gw] {
    color: var(--hp-text-muted);
    font-size: var(--hp-font-xs);
}

.hp-deployment-stages[b-06ridjj9gw] {
    display: grid;
    /* 14rem, not the 18rem the inline key-values needed: a card is now a name, a duration and a
       toggle, and four of them share one row on the desktop stage instead of leaving a lone
       card on a second row beside empty space. auto-fit, so the row ends with the last card
       rather than an empty track where a fifth would have gone. */
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr));
    gap: 1rem;
}

.hp-deployment-stage[b-06ridjj9gw] {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
    padding: 1.125rem;
    border: 1px solid var(--hp-border-subtle);
    border-radius: var(--hp-radius-sm);
    background: var(--hp-surface);
}

/* The inset bar carries the state at a glance; border-colour alone is too quiet to scan a grid by. */
.hp-deployment-stage-active[b-06ridjj9gw] {
    border-color: var(--hp-primary-light);
    box-shadow: inset 3px 0 0 var(--hp-primary);
}

.hp-deployment-stage-done[b-06ridjj9gw] {
    border-color: var(--hp-success);
}

.hp-deployment-stage-failed[b-06ridjj9gw] {
    border-color: var(--hp-danger);
    box-shadow: inset 3px 0 0 var(--hp-danger);
}

/* A raised surface, not the 6% hover wash: the open card has to read as chosen next to three
   closed ones, and the wash was too faint to tell from a cursor resting on it. */
.hp-deployment-stage-selected[b-06ridjj9gw] {
    background: var(--hp-surface-raised);
}

.hp-deployment-stage-header[b-06ridjj9gw] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.hp-stage-details-toggle[b-06ridjj9gw] {
    display: inline-flex;
    align-items: center;
    align-self: flex-start;
    gap: 0.25rem;
    margin-top: auto;
    padding: 0;
    border: 0;
    border-radius: var(--hp-radius-sm);
    background: transparent;
    color: var(--hp-text-muted);
    font: inherit;
    font-size: var(--hp-font-2xs);
    cursor: pointer;
    transition: color 0.15s ease;
}

/* A text action that brightens and underlines like the portal's links; it never grows a pill.
   A pill hugging two words inside a card read as a stray tag, and the same pill held for the
   open card looked like a hover that had stuck. */
.hp-stage-details-toggle:hover[b-06ridjj9gw],
.hp-stage-details-toggle[aria-expanded="true"][b-06ridjj9gw] {
    color: var(--hp-text);
}

.hp-stage-details-toggle:hover span[b-06ridjj9gw] {
    text-decoration: underline;
    text-underline-offset: 0.2em;
}

.hp-stage-details-toggle[b-06ridjj9gw]  .rzi {
    font-size: var(--hp-font-md) !important;
    opacity: 0.75;
    transition: opacity 0.15s ease;
}

.hp-stage-details-toggle:hover[b-06ridjj9gw]  .rzi,
.hp-stage-details-toggle[aria-expanded="true"][b-06ridjj9gw]  .rzi {
    opacity: 1;
}

.hp-deployment-stage-panel[b-06ridjj9gw] {
    margin-top: 1rem;
    padding: 1rem 1.125rem 1.125rem;
    border: 1px solid var(--hp-border-subtle);
    border-radius: var(--hp-radius-sm);
    background: var(--hp-surface);
}

.hp-deployment-stage-panel-head[b-06ridjj9gw] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.875rem;
    font-family: var(--hp-font-mono);
    font-size: var(--hp-font-2xs);
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--hp-text-muted);
}
/* /Components/Pages/Dns/ZoneDetail.razor.rz.scp.css */
/* TXT and DKIM values have no spaces to break on, so without this one record stretches the grid
   past the viewport and takes the whole page's horizontal scroll with it. */
.hp-dns-value[b-t58zbvv7y7] {
    word-break: break-all;
}
/* /Components/Pages/Domains/Search.razor.rz.scp.css */
/* The extension picker is a set of equal, tappable tiles rather than resource cards, so it uses a
   tighter track than the shared .hp-resource-grid. */
.hp-tld-grid[b-u806qxj7tj] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 10rem), 1fr));
    gap: 1rem;
}
/* /Components/Pages/Error.razor.rz.scp.css */
/* Separated from the empty state above it: the request ID is for support, not for the reader. */
.hp-error-request-id[b-6mwlorgpyo] {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid var(--hp-border-subtle);
}
/* /Components/Pages/Mail/DomainDetail.razor.rz.scp.css */
/* DKIM public keys and long SPF strings contain no spaces, so without an explicit break the
   record table pushes the page into horizontal scroll. */
.hp-mail-record-value[b-nkyz4mijte] {
    word-break: break-all;
}
/* /Components/Pages/Organization/AccessControl.razor.rz.scp.css */
/* One grant-form cell: the field plus the small text button that swaps it for the manual/advanced
   variant. They must stay together — the button changes THAT field, not the form. */
.hp-grant-field[b-69cxqild9p] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.35rem;
    min-width: 0;
}

.hp-grant-field[b-69cxqild9p]  .rz-form-field {
    width: 100%;
}

.hp-grant-field[b-69cxqild9p]  .rz-dropdown,
.hp-grant-field[b-69cxqild9p]  .rz-textbox {
    width: 100%;
}
/* /Components/Pages/Projects/AetherInstancePanel.razor.rz.scp.css */
/* The cost estimate has to read as a gate, not as another form field: it is the block whose
   checkbox unlocks Create. A tinted, bordered well separates it from the inputs above it. */
.hp-aether-quote[b-ojs5co6tw8] {
    border: 1px solid var(--hp-border);
    border-radius: var(--hp-radius);
    background: var(--hp-surface-muted);
    padding: 1rem;
}

.hp-aether-quote-title[b-ojs5co6tw8] {
    margin: 0 0 0.5rem;
    font-size: var(--hp-font-xs);
    font-weight: var(--hp-stat-label-weight);
    letter-spacing: var(--hp-stat-label-letter-spacing);
    text-transform: var(--hp-stat-label-transform);
    color: var(--hp-text-muted);
}

.hp-aether-quote-total[b-ojs5co6tw8] {
    margin: 0;
    font-size: var(--hp-font-xl);
    font-weight: 600;
    color: var(--hp-text);
}
/* /Components/Pages/Projects/AetherOperationPanel.razor.rz.scp.css */
/* The status legend doubles as the history filter, so each entry has to be a real button:
   as a <span> with @onclick it was unreachable by keyboard and invisible to a screen reader.
   These rules only strip the UA button chrome — the look still comes from .hp-filter-badge. */
.hp-status-filter-row[b-zpy30usuil] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
}

.hp-status-filter[b-zpy30usuil] {
    appearance: none;
    background: none;
    border: 0;
    padding: 0;
    font: inherit;
    color: inherit;
    cursor: pointer;
}
/* /Components/Pages/Services/Components/TemplateSelector.razor.rz.scp.css */
/* The cards are real <button>s (keyboard-reachable, unlike the old @onclick RadzenCard);
   this restores the card look on the button element. */
.hp-template-card-button[b-guao7pj2ls] {
    display: block;
    width: 100%;
    height: 100%;
    padding: 1rem;
    text-align: left;
    font: inherit;
    color: inherit;
    background: var(--hp-surface-raised);
    border-radius: var(--hp-radius);
    box-sizing: border-box;
}

.hp-template-card-button:focus-visible[b-guao7pj2ls] {
    outline: 2px solid var(--hp-primary-accent);
    outline-offset: 2px;
}
/* /Components/Shared/HpManifestRail.razor.rz.scp.css */
.hp-manifest[b-19rk3h41cf] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 1rem;
    border: 1px solid var(--hp-border-subtle);
    border-radius: var(--hp-radius);
    background: var(--hp-surface-raised);
    height: fit-content;
    box-sizing: border-box;
}

.hp-manifest-header[b-19rk3h41cf] {
    font-size: var(--hp-font-2xs);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--hp-text-muted);
}

.hp-manifest-rows[b-19rk3h41cf] {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
}

.hp-manifest-row[b-19rk3h41cf] {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    min-width: 0;
}

.hp-manifest-label[b-19rk3h41cf] {
    flex: 0 0 5.2rem;
    font-size: var(--hp-font-2xs);
    color: var(--hp-text-muted);
}

/* The product's terminal voice: manifest values are data, so they read as data. */
.hp-manifest-value[b-19rk3h41cf] {
    flex: 1 1 auto;
    min-width: 0;
    font-family: var(--hp-font-mono);
    font-size: var(--hp-font-xs);
    color: var(--hp-text);
    overflow-wrap: anywhere;
    animation: hp-manifest-row-in-b-19rk3h41cf 120ms ease-out;
}

.hp-manifest-value--empty[b-19rk3h41cf] {
    color: var(--hp-text-muted);
    animation: none;
}

.hp-manifest-tag[b-19rk3h41cf] {
    flex: 0 0 auto;
    font-size: 0.6875rem;
    line-height: 1.3;
    padding: 0 0.35rem;
    border-radius: var(--hp-radius-pill);
    border: 1px solid transparent;
}

.hp-manifest-tag--auto[b-19rk3h41cf] {
    color: var(--hp-primary-accent);
    border-color: var(--hp-primary-accent);
    opacity: 0.85;
}

.hp-manifest-tag--edited[b-19rk3h41cf] {
    color: var(--hp-warning);
    border-color: var(--hp-warning);
    opacity: 0.85;
}

.hp-manifest-total[b-19rk3h41cf] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    padding-top: 0.75rem;
    border-top: 1px solid var(--hp-border-subtle);
}

.hp-manifest-total-label[b-19rk3h41cf] {
    font-size: var(--hp-font-2xs);
    color: var(--hp-text-muted);
}

/* The rail's total keeps the manifest's data voice on top of the shared QuoteTotal figures. */
.hp-manifest-total[b-19rk3h41cf]  .hp-quote-summary-value {
    font-family: var(--hp-font-mono);
}

.hp-manifest-total-error[b-19rk3h41cf] {
    font-size: var(--hp-font-xs);
    color: var(--hp-danger-light);
}

.hp-manifest-extras[b-19rk3h41cf] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding-top: 0.5rem;
}

/* Promoted (confirm step): the rail becomes the main column. */
.hp-manifest--promoted[b-19rk3h41cf] {
    padding: 1.25rem;
}

.hp-manifest--promoted .hp-manifest-rows[b-19rk3h41cf] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 0.5rem 1.5rem;
}

.hp-manifest--promoted .hp-manifest-label[b-19rk3h41cf] {
    flex-basis: 6.5rem;
}

.hp-manifest--promoted .hp-manifest-total[b-19rk3h41cf]  .hp-quote-summary-value {
    font-size: 1.35rem;
}

@keyframes hp-manifest-row-in-b-19rk3h41cf {
    from {
        opacity: 0;
        transform: translateY(4px);
    }
    to {
        opacity: 1;
        transform: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .hp-manifest-value[b-19rk3h41cf] {
        animation: none;
    }
}

/* Narrow viewports (rail stacked between body and footer): compact two-column strip. */
@media (max-width: 900px) {
    .hp-manifest:not(.hp-manifest--promoted)[b-19rk3h41cf] {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        gap: 0.5rem 1.25rem;
        padding: 0.65rem 1rem;
    }

    .hp-manifest:not(.hp-manifest--promoted) .hp-manifest-header[b-19rk3h41cf] {
        flex-basis: 100%;
    }

    .hp-manifest:not(.hp-manifest--promoted) .hp-manifest-rows[b-19rk3h41cf] {
        flex: 1 1 auto;
        flex-direction: row;
        flex-wrap: wrap;
        gap: 0.25rem 1.25rem;
    }

    .hp-manifest:not(.hp-manifest--promoted) .hp-manifest-row .hp-manifest-label[b-19rk3h41cf] {
        flex-basis: auto;
    }

    .hp-manifest:not(.hp-manifest--promoted) .hp-manifest-total[b-19rk3h41cf] {
        border-top: none;
        padding-top: 0;
        margin-left: auto;
    }
}
/* /Components/Shared/OnboardingWizard.razor.rz.scp.css */
/* Onboarding wizard — a plain centered column on the page background. The 2026-08-05 minimal
   pass removed the hero banner and the card chrome: the wizard is the only thing on the page,
   so a frame around it separated it from nothing. */

.hostport-onboarding[b-sflry1l6vq] {
    width: 100%;
    display: flex;
    justify-content: center;
    box-sizing: border-box;
    /* No top padding of its own: .main-content already gives the page its 1.5rem — the two
       stacked read as a hole between the header and the content. */
    padding: 0 0 2.5rem;
}

.onboarding-card[b-sflry1l6vq] {
    width: 100%;
    /* A form measure, not a page cap: the shell is full-bleed, but a text input stretched
       across a 2560px screen is unusable. Forms sit in a centered column; tables and
       grids elsewhere keep the full width. */
    max-width: 72rem;
    margin-inline: auto;
    box-sizing: border-box;
    min-height: min(70vh, 720px);
}

.onboarding-card-header[b-sflry1l6vq] {
    text-align: center;
    padding: 0.5rem 1rem 1.5rem;
}

.onboarding-progress-header[b-sflry1l6vq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.5rem;
}

.onboarding-progress-detail[b-sflry1l6vq] {
    margin: 0;
    color: var(--hp-text-secondary);
}

.onboarding-progress-badge[b-sflry1l6vq] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.75rem;
    padding: 0.2rem 0.55rem;
    border-radius: var(--hp-radius-pill);
    font-size: var(--hp-font-2xs);
    font-weight: 600;
    letter-spacing: 0.01em;
    color: var(--hp-primary-accent);
    background: var(--hp-primary-muted);
    border: 1px solid rgba(110, 146, 192, 0.35);
    flex-shrink: 0;
}

.onboarding-progress-track[b-sflry1l6vq] {
    height: 4px;
    border-radius: var(--hp-radius-pill);
    background: var(--hp-surface-overlay);
    overflow: hidden;
}

.onboarding-progress-fill[b-sflry1l6vq] {
    height: 100%;
    border-radius: inherit;
    background: var(--hp-gradient-primary);
    transition: width 0.35s ease;
}

.hostport-onboarding[b-sflry1l6vq]  .rz-steps {
    margin-bottom: 1.5rem;
    justify-content: center;
}

.hostport-onboarding[b-sflry1l6vq]  .rz-steps ul {
    flex-wrap: nowrap;
    gap: 0.25rem;
}

.hostport-onboarding[b-sflry1l6vq]  .rz-steps-item .rz-steps-number {
    width: 2rem;
    height: 2rem;
    font-size: var(--hp-font-sm);
    font-weight: 600;
}

.hostport-onboarding[b-sflry1l6vq]  .rz-steps-item .rz-steps-title {
    font-size: var(--hp-font-xs);
    font-weight: 500;
    white-space: nowrap;
}

.onboarding-step-body[b-sflry1l6vq] {
    min-height: 12rem;
}

.hostport-onboarding[b-sflry1l6vq]  .rz-row {
    width: 100%;
}

@media (max-width: 768px) {
    .hostport-onboarding[b-sflry1l6vq] {
        padding: 0 0 1.5rem;
    }

    .onboarding-card[b-sflry1l6vq] {
        max-width: 100%;
    }

    .onboarding-card-header[b-sflry1l6vq] {
        padding: 0.5rem 0.75rem 1.25rem;
    }

    .hostport-onboarding[b-sflry1l6vq]  .rz-steps-item .rz-steps-title {
        font-size: var(--hp-font-2xs);
    }
}
/* /Components/Shared/SourceArchiveUploadPicker.razor.rz.scp.css */
.hp-source-upload[b-onioyxehxa] {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    padding: 1rem 1.25rem;
    border: 1px dashed var(--hp-border-subtle);
    border-radius: var(--hp-radius);
    cursor: pointer;
    transition: border-color 0.15s ease, background-color 0.15s ease;
}

.hp-source-upload:hover[b-onioyxehxa] {
    border-color: var(--rz-primary, #6e92c0);
    background: rgba(110, 146, 192, 0.08);
}

.hp-source-upload--disabled[b-onioyxehxa] {
    opacity: 0.55;
    cursor: not-allowed;
}

.hp-source-upload--disabled:hover[b-onioyxehxa] {
    border-color: var(--hp-border-subtle);
    background: transparent;
}

.hp-source-upload[b-onioyxehxa]  input[type="file"] {
    display: none;
}

.hp-source-upload-file[b-onioyxehxa] {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    padding: 0.85rem 1.1rem;
    border: 1px solid var(--hp-border-subtle);
    border-radius: var(--hp-radius);
    background: var(--hp-surface-raised);
}