/*
 * AIC Licensing theme contract.
 * Raw colour values are intentionally confined to these light/dark token blocks.
 * The active Foundry IPlatformTheme owns shell selection and colour-mode persistence.
 */
:root,
[data-bs-theme="light"] {
    color-scheme: light;
    --aic-logo-ink: #003240;
    --aic-logo-signal: #00e6c3;
    --aic-brand-image: url("/images/brand/aic-logo-brand-light.svg");
    --portal-canvas: #f3f7f7;
    --portal-surface: #ffffff;
    --portal-surface-muted: #eaf1f1;
    --portal-surface-raised: #ffffff;
    --portal-ink: #102f38;
    --portal-muted: #526c73;
    --portal-border: #ccdbdc;
    --portal-border-strong: #9fb7b9;
    --portal-brand: #006b60;
    --portal-brand-rgb: 0, 107, 96;
    --portal-brand-strong: #004c46;
    --portal-brand-soft: #d9f3ed;
    --portal-accent: #007d70;
    --portal-accent-soft: #c9f8ee;
    --portal-on-brand: #ffffff;
    --portal-feature-bg: #003240;
    --portal-feature-ink: #f2fffc;
    --portal-feature-muted: #b9ddd6;
    --portal-feature-border: #23606a;
    --portal-focus: #00a58f;
    --portal-selection: rgba(0, 230, 195, .28);
    --portal-shadow-color: rgba(0, 50, 64, .12);
    --portal-shadow-strong: rgba(0, 38, 48, .2);
    --portal-overlay: rgba(0, 50, 64, .84);
    --portal-success: #167548;
    --portal-success-rgb: 22, 117, 72;
    --portal-success-soft: #ddf3e6;
    --portal-success-border: #87c7a4;
    --portal-info: #176b83;
    --portal-info-rgb: 23, 107, 131;
    --portal-info-soft: #ddf1f6;
    --portal-info-border: #8fc7d5;
    --portal-warning: #8a5500;
    --portal-warning-rgb: 138, 85, 0;
    --portal-warning-soft: #fff1d2;
    --portal-warning-border: #dfbd72;
    --portal-danger: #ad2d3d;
    --portal-danger-rgb: 173, 45, 61;
    --portal-danger-soft: #fde5e8;
    --portal-danger-border: #e3a0a9;
    --portal-disabled: #6b7e82;
    --portal-disabled-bg: #e5ecec;
    --portal-placeholder: #667b80;
    --portal-code: #765016;
    --portal-code-bg: #eaf1f1;
    --portal-code-block: #062d37;
    --portal-code-block-ink: #e9fffa;

    --bs-primary: var(--portal-brand);
    --bs-primary-rgb: var(--portal-brand-rgb);
    --bs-success: var(--portal-success);
    --bs-success-rgb: var(--portal-success-rgb);
    --bs-info: var(--portal-info);
    --bs-info-rgb: var(--portal-info-rgb);
    --bs-warning: var(--portal-warning);
    --bs-warning-rgb: var(--portal-warning-rgb);
    --bs-danger: var(--portal-danger);
    --bs-danger-rgb: var(--portal-danger-rgb);
    --bs-body-color: var(--portal-ink);
    --bs-body-color-rgb: 16, 47, 56;
    --bs-body-bg: var(--portal-canvas);
    --bs-body-bg-rgb: 243, 247, 247;
    --bs-emphasis-color: var(--portal-ink);
    --bs-secondary-color: var(--portal-muted);
    --bs-secondary-color-rgb: 82, 108, 115;
    --bs-secondary-bg: var(--portal-surface-muted);
    --bs-tertiary-bg: var(--portal-surface);
    --bs-border-color: var(--portal-border);
    --bs-link-color: var(--portal-brand);
    --bs-link-color-rgb: var(--portal-brand-rgb);
    --bs-link-hover-color-rgb: var(--portal-brand-rgb);
    --bs-link-hover-color: var(--portal-brand-strong);
    --bs-code-color: var(--portal-code);
    --bs-primary-text-emphasis: var(--portal-brand-strong);
    --bs-primary-bg-subtle: var(--portal-brand-soft);
    --bs-primary-border-subtle: var(--portal-border-strong);
    --bs-secondary-text-emphasis: var(--portal-muted);
    --bs-secondary-bg-subtle: var(--portal-surface-muted);
    --bs-secondary-border-subtle: var(--portal-border);
    --bs-focus-ring-color: rgba(var(--portal-brand-rgb), .28);
    --bs-form-valid-color: var(--portal-success);
    --bs-form-valid-border-color: var(--portal-success);
    --bs-form-invalid-color: var(--portal-danger);
    --bs-form-invalid-border-color: var(--portal-danger);
    --bs-success-text-emphasis: var(--portal-success);
    --bs-success-bg-subtle: var(--portal-success-soft);
    --bs-success-border-subtle: var(--portal-success-border);
    --bs-info-text-emphasis: var(--portal-info);
    --bs-info-bg-subtle: var(--portal-info-soft);
    --bs-info-border-subtle: var(--portal-info-border);
    --bs-warning-text-emphasis: var(--portal-warning);
    --bs-warning-bg-subtle: var(--portal-warning-soft);
    --bs-warning-border-subtle: var(--portal-warning-border);
    --bs-danger-text-emphasis: var(--portal-danger);
    --bs-danger-bg-subtle: var(--portal-danger-soft);
    --bs-danger-border-subtle: var(--portal-danger-border);
    --bs-border-radius: .5rem;
    --bs-border-radius-sm: .375rem;
    --bs-border-radius-lg: .75rem;
    --portal-shadow-sm: 0 1px 3px var(--portal-shadow-color);
    --portal-shadow-md: 0 1rem 2.5rem var(--portal-shadow-color);
}

[data-bs-theme="dark"] {
    color-scheme: dark;
    --aic-logo-ink: #ffffff;
    --aic-logo-signal: #00e6c3;
    --aic-brand-image: url("/images/brand/aic-logo-brand-dark.svg");
    --portal-canvas: #071b21;
    --portal-surface: #0e2931;
    --portal-surface-muted: #12343d;
    --portal-surface-raised: #173b44;
    --portal-ink: #e7f2f2;
    --portal-muted: #afc3c5;
    --portal-border: #31515a;
    --portal-border-strong: #51727a;
    --portal-brand: #62ecd3;
    --portal-brand-rgb: 98, 236, 211;
    --portal-brand-strong: #a3f8e8;
    --portal-brand-soft: #164d49;
    --portal-accent: #7af1dc;
    --portal-accent-soft: #164d49;
    --portal-on-brand: #032923;
    --portal-feature-bg: #021419;
    --portal-feature-ink: #effffb;
    --portal-feature-muted: #afd9d2;
    --portal-feature-border: #315d62;
    --portal-focus: #72f3da;
    --portal-selection: rgba(0, 230, 195, .32);
    --portal-shadow-color: rgba(0, 0, 0, .34);
    --portal-shadow-strong: rgba(0, 0, 0, .5);
    --portal-overlay: rgba(2, 20, 25, .84);
    --portal-success: #79d9a6;
    --portal-success-rgb: 121, 217, 166;
    --portal-success-soft: #153c2b;
    --portal-success-border: #3b7d59;
    --portal-info: #7fd8ee;
    --portal-info-rgb: 127, 216, 238;
    --portal-info-soft: #153a45;
    --portal-info-border: #3c7482;
    --portal-warning: #f6c66c;
    --portal-warning-rgb: 246, 198, 108;
    --portal-warning-soft: #463719;
    --portal-warning-border: #80612a;
    --portal-danger: #ff9ba7;
    --portal-danger-rgb: 255, 155, 167;
    --portal-danger-soft: #48232a;
    --portal-danger-border: #84424d;
    --portal-disabled: #94a7aa;
    --portal-disabled-bg: #18343b;
    --portal-placeholder: #9aadb0;
    --portal-code: #f1cb82;
    --portal-code-bg: #18343b;
    --portal-code-block: #020e12;
    --portal-code-block-ink: #eafffa;

    --bs-body-color: var(--portal-ink);
    --bs-body-color-rgb: 231, 242, 242;
    --bs-body-bg: var(--portal-canvas);
    --bs-body-bg-rgb: 7, 27, 33;
    --bs-emphasis-color: var(--portal-ink);
    --bs-secondary-color: var(--portal-muted);
    --bs-secondary-color-rgb: 175, 195, 197;
    --bs-secondary-bg: var(--portal-surface-muted);
    --bs-tertiary-bg: var(--portal-surface);
    --bs-border-color: var(--portal-border);
    --bs-link-color: var(--portal-brand);
    --bs-link-hover-color: var(--portal-brand-strong);
    --bs-code-color: var(--portal-code);
    --bs-focus-ring-color: rgba(var(--portal-brand-rgb), .34);
}

/* Foundry's packaged stylesheet loads from layout HeadContent after host styles.
 * Higher-specificity aliases keep those inherited rules on the active semantic palette. */
:root[data-bs-theme] {
    --primary-color: var(--portal-canvas);
    --secondary-color: var(--portal-surface-muted);
    --text-color: var(--portal-ink);
    --text-muted: var(--portal-muted);
    --card-bg: var(--portal-surface);
    --card-border: var(--portal-border);
    --accent-primary: var(--portal-brand);
    --accent-secondary: var(--portal-accent);
    --accent-success: var(--portal-success);
    --accent-warning: var(--portal-warning);
    --accent-danger: var(--portal-danger);
    --shadow-light: var(--portal-shadow-color);
    --surface-accent: var(--portal-surface-muted);
    --border-subtle: var(--portal-border);
    --hover-light: var(--portal-brand-soft);
    --dark-bg: var(--portal-canvas);
    --dark-bg-secondary: var(--portal-surface-muted);
    --dark-text: var(--portal-ink);
    --dark-text-muted: var(--portal-muted);
    --dark-card-bg: var(--portal-surface);
    --dark-card-bg-hover: var(--portal-surface-raised);
    --dark-border: var(--portal-border);
    --dark-surface-accent: var(--portal-surface-muted);
    --dark-shadow: var(--portal-shadow-color);
    --dark-accent-primary: var(--portal-brand);
    --dark-accent-secondary: var(--portal-accent);
    --dark-accent-success: var(--portal-success);
    --dark-accent-warning: var(--portal-warning);
    --dark-accent-danger: var(--portal-danger);
}

html {
    min-height: 100%;
    background: var(--portal-canvas);
}

html body,
html[data-bs-theme] body {
    min-height: 100vh;
    margin: 0;
    background: var(--portal-canvas) !important;
    color: var(--portal-ink) !important;
    font-family: "Segoe UI Variable Text", "Segoe UI", system-ui, -apple-system, sans-serif;
    font-size: .9375rem;
    font-feature-settings: "ss01" 1, "cv05" 1;
    line-height: 1.55;
    text-rendering: optimizeLegibility;
}

::selection {
    background: var(--portal-selection);
}

a,
button,
input,
select,
textarea {
    transition-duration: 140ms;
    transition-property: color, background-color, border-color, box-shadow, opacity, transform;
    transition-timing-function: ease-out;
}

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
    outline: .2rem solid color-mix(in srgb, var(--portal-focus) 58%, transparent);
    outline-offset: .12rem;
}

/* Foundry-owned shell */
.navbar-theme {
    position: sticky !important;
    inset-block-start: 0;
    z-index: 1030;
    min-height: 4.5rem;
    padding: .65rem 0;
    background: color-mix(in srgb, var(--portal-surface) 94%, transparent) !important;
    border-bottom: 1px solid var(--portal-border) !important;
    box-shadow: var(--portal-shadow-sm);
    color: var(--portal-ink) !important;
    backdrop-filter: saturate(140%) blur(14px);
}

.navbar-theme .container-fluid {
    width: min(calc(100% - 2rem), 92.5rem);
    padding: 0;
}

.navbar-theme .navbar-brand {
    display: inline-flex;
    align-items: center;
    min-width: 7rem;
    margin-right: 1.5rem;
    padding: 0;
}

.navbar-theme .navbar-brand img {
    /* Foundry initially supplies its light logo even when a dark preference is restored. */
    content: var(--aic-brand-image);
    width: auto;
    max-width: 9rem;
    height: 2.1rem !important;
    object-fit: contain;
}

.navbar-theme .navbar-toggler {
    padding: .5rem;
    border-color: var(--portal-border-strong);
    box-shadow: none;
}

.navbar-theme .navbar-nav {
    align-items: center;
    gap: .2rem;
}

.navbar-theme .nav-link {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    min-height: 2.5rem;
    padding: .5rem .7rem !important;
    border-radius: var(--bs-border-radius);
    color: var(--portal-muted) !important;
    font-size: .875rem;
    font-weight: 650;
}

.navbar-theme .nav-link:hover,
.navbar-theme .nav-link:focus-visible,
.navbar-theme .nav-link.show {
    background: var(--portal-brand-soft);
    color: var(--portal-brand-strong) !important;
}

.navbar-theme .nav-link > i {
    color: var(--portal-brand);
}

.navbar-theme .dropdown-menu,
.dropdown-menu {
    padding: .5rem;
    background: var(--portal-surface-raised);
    border-color: var(--portal-border);
    box-shadow: var(--portal-shadow-md);
}

.navbar-theme .dropdown-item,
.dropdown-item {
    min-height: 2.5rem;
    border-radius: var(--bs-border-radius-sm);
    color: var(--portal-ink);
}

.navbar-theme .dropdown-item:hover,
.navbar-theme .dropdown-item:focus,
.dropdown-item:hover,
.dropdown-item:focus {
    background: var(--portal-brand-soft);
    color: var(--portal-brand-strong);
}

html .container-integrated {
    width: min(calc(100% - 2rem), 92.5rem) !important;
    min-height: calc(100vh - 4.5rem);
    margin: 0 auto !important;
    padding: 2rem 0 1.5rem !important;
}

.container-integrated > footer.fixed-bottom {
    position: static !important;
    min-height: auto !important;
    height: auto !important;
    margin-top: 3rem;
    padding: 1.25rem 0 .5rem !important;
    background: transparent !important;
    border-top: 1px solid var(--portal-border) !important;
    color: var(--portal-muted) !important;
    font-size: .75rem;
}

.container-integrated > footer.fixed-bottom p {
    margin-left: 0 !important;
}

/* Shared application surfaces */
.min-width-0,
.card,
.card-body,
.list-group-item,
.container-fluid > .row > * {
    min-width: 0;
}

html :is(h1, h2, h3, h4, h5, h6) {
    color: var(--portal-ink) !important;
    letter-spacing: -.015em;
}

h1 {
    letter-spacing: -.035em;
}

code,
.portal-long-id {
    overflow-wrap: anywhere;
    word-break: break-word;
}

code {
    color: var(--portal-code);
}

.portal-eyebrow {
    color: var(--portal-brand) !important;
    font-size: .6875rem;
    font-weight: 750;
    letter-spacing: .12em;
    line-height: 1.2;
    text-transform: uppercase;
}

.portal-page-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem 1.5rem;
    margin-bottom: 1.5rem;
}

.portal-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .65rem;
}

.portal-filter-grid,
.portal-detail-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 13rem), 1fr));
    gap: 1rem;
}

html .card,
html[data-bs-theme] .card {
    --bs-card-bg: var(--portal-surface);
    --bs-card-color: var(--portal-ink);
    --bs-card-border-color: var(--portal-border);
    --bs-card-border-radius: .7rem;
    border-color: var(--portal-border);
    box-shadow: var(--portal-shadow-sm);
    background-color: var(--portal-surface) !important;
    margin-bottom: 0;
}

html[data-bs-theme] .card:hover {
    background-color: var(--portal-surface-raised) !important;
    border-color: var(--portal-border-strong);
    box-shadow: var(--portal-shadow-sm);
}

.card-header,
.card-footer {
    background: transparent;
    border-color: var(--portal-border);
}

.list-group {
    --bs-list-group-bg: var(--portal-surface);
    --bs-list-group-color: var(--portal-ink);
    --bs-list-group-border-color: var(--portal-border);
    --bs-list-group-action-hover-bg: var(--portal-surface-muted);
    --bs-list-group-action-active-bg: var(--portal-brand-soft);
}

.portal-icon {
    display: grid;
    flex: 0 0 auto;
    width: 2.55rem;
    height: 2.55rem;
    place-items: center;
    border: 1px solid color-mix(in srgb, currentColor 24%, transparent);
    border-radius: .55rem;
    font-size: 1.1rem;
}

.portal-metric {
    position: relative;
    overflow: hidden;
    color: inherit;
}

.portal-metric::before {
    position: absolute;
    inset: 0 auto 0 0;
    width: .2rem;
    background: var(--portal-brand);
    content: "";
    opacity: 0;
}

.portal-metric:hover,
.portal-metric:focus-visible {
    border-color: var(--portal-border-strong);
    box-shadow: var(--portal-shadow-md);
    transform: translateY(-1px);
}

.portal-metric:hover::before,
.portal-metric:focus-visible::before {
    opacity: 1;
}

.portal-metric .display-6 {
    font-size: clamp(1.75rem, 2.4vw, 2.35rem);
    font-variant-numeric: tabular-nums;
    letter-spacing: -.045em;
}

.portal-feature {
    position: relative;
    overflow: hidden;
    background: var(--portal-feature-bg);
    color: var(--portal-feature-ink);
    border-color: var(--portal-feature-border);
    box-shadow: var(--portal-shadow-sm);
}

.portal-feature :is(h1, h2, h3, h4, h5, h6) {
    color: var(--portal-feature-ink) !important;
}

.portal-feature .text-body-secondary,
.portal-feature .text-info {
    color: var(--portal-feature-muted) !important;
}

.portal-feature-step {
    display: inline-grid;
    width: 1.75rem;
    height: 1.75rem;
    flex: 0 0 auto;
    place-items: center;
    border: 1px solid var(--portal-feature-border);
    border-radius: 50%;
    color: var(--portal-feature-ink);
    font-size: .6875rem;
    font-weight: 700;
}

.portal-empty-state {
    max-width: 34rem;
    margin-inline: auto;
    padding: clamp(1.5rem, 5vw, 3.5rem) 1rem;
    color: var(--portal-muted);
    text-align: center;
}

.portal-empty-state > h2 {
    color: var(--portal-ink) !important;
}

/* Bootstrap and BlazorBootstrap controls */
.btn {
    --bs-btn-border-radius: .48rem;
    --bs-btn-font-weight: 650;
    min-height: 2.45rem;
}

.btn-sm {
    min-height: 2.05rem;
}

.btn-primary {
    --bs-btn-color: var(--portal-on-brand);
    --bs-btn-bg: var(--portal-brand);
    --bs-btn-border-color: var(--portal-brand);
    --bs-btn-hover-color: var(--portal-on-brand);
    --bs-btn-hover-bg: var(--portal-brand-strong);
    --bs-btn-hover-border-color: var(--portal-brand-strong);
    --bs-btn-active-color: var(--portal-on-brand);
    --bs-btn-active-bg: var(--portal-brand-strong);
    --bs-btn-active-border-color: var(--portal-brand-strong);
    --bs-btn-disabled-color: var(--portal-disabled);
    --bs-btn-disabled-bg: var(--portal-disabled-bg);
    --bs-btn-disabled-border-color: var(--portal-border);
    --bs-btn-focus-shadow-rgb: var(--portal-brand-rgb);
}

.btn-outline-primary {
    --bs-btn-color: var(--portal-brand);
    --bs-btn-border-color: var(--portal-brand);
    --bs-btn-hover-color: var(--portal-on-brand);
    --bs-btn-hover-bg: var(--portal-brand);
    --bs-btn-hover-border-color: var(--portal-brand);
    --bs-btn-active-color: var(--portal-on-brand);
    --bs-btn-active-bg: var(--portal-brand-strong);
    --bs-btn-active-border-color: var(--portal-brand-strong);
}

.btn-light {
    --bs-btn-color: var(--portal-ink);
    --bs-btn-bg: var(--portal-surface-muted);
    --bs-btn-border-color: var(--portal-border);
    --bs-btn-hover-color: var(--portal-brand-strong);
    --bs-btn-hover-bg: var(--portal-brand-soft);
    --bs-btn-hover-border-color: var(--portal-border-strong);
}

.form-label,
.col-form-label {
    color: var(--portal-ink);
    font-size: .8125rem;
    font-weight: 650;
}

.form-control,
.form-select,
.input-group-text {
    min-height: 2.75rem;
    background-color: var(--portal-surface);
    border-color: var(--portal-border-strong);
    color: var(--portal-ink);
}

.form-control::placeholder,
textarea::placeholder,
input::placeholder {
    color: var(--portal-placeholder);
    opacity: 1;
}

.form-control:disabled,
.form-select:disabled,
.form-control[readonly],
.input-group-text,
.portal-surface-muted,
.portal-key-panel {
    background-color: var(--portal-disabled-bg) !important;
    color: var(--portal-disabled);
    opacity: 1;
}

.form-check-input {
    background-color: var(--portal-surface);
    border-color: var(--portal-border-strong);
}

.form-check-input:checked {
    background-color: var(--portal-brand);
    border-color: var(--portal-brand);
}

.form-select option {
    background-color: var(--portal-surface-raised);
    color: var(--portal-ink);
}

.form-control:-webkit-autofill,
.form-control:-webkit-autofill:hover,
.form-control:-webkit-autofill:focus {
    -webkit-text-fill-color: var(--portal-ink);
    box-shadow: 0 0 0 1000px var(--portal-surface) inset;
    caret-color: var(--portal-ink);
}

.form-control:focus,
.form-select:focus,
.form-check-input:focus,
.btn:focus-visible,
.page-link:focus-visible {
    border-color: var(--portal-focus);
    box-shadow: 0 0 0 .2rem color-mix(in srgb, var(--portal-focus) 28%, transparent);
    outline: 0;
}

.form-text,
.text-muted,
.text-body-secondary {
    color: var(--portal-muted) !important;
}

.portal-choice-card,
.portal-feature-choice {
    background: var(--portal-surface);
    cursor: pointer;
}

.portal-choice-card:has(input:checked),
.portal-feature-choice:has(input:checked) {
    background: var(--portal-brand-soft);
    border-color: color-mix(in srgb, var(--portal-brand) 58%, var(--portal-border)) !important;
}

.validation-message,
.validation-errors,
.invalid-feedback {
    color: var(--portal-danger);
    font-size: .8125rem;
}

.invalid,
.is-invalid {
    border-color: var(--portal-danger) !important;
}

.valid,
.is-valid {
    border-color: var(--portal-success) !important;
}

.alert {
    --bs-alert-color: var(--portal-ink);
    border-color: var(--portal-border-strong);
}

.badge {
    flex-shrink: 0;
    max-width: 100%;
    border: 1px solid color-mix(in srgb, currentColor 28%, transparent);
    font-weight: 650;
    letter-spacing: .01em;
    overflow-wrap: anywhere;
    white-space: normal;
    word-break: break-word;
}

.d-flex.flex-wrap,
.card-header > .d-flex,
.card-body > .d-flex {
    min-width: 0;
    max-width: 100%;
}

.portal-status {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    max-width: 100%;
    white-space: normal;
}

/* Data-dense views */
.table-responsive,
.portal-table-region {
    position: relative;
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-gutter: stable;
}

.table-responsive:focus-visible,
.portal-table-region:focus-visible {
    border-radius: var(--bs-border-radius);
    box-shadow: 0 0 0 .2rem color-mix(in srgb, var(--portal-focus) 28%, transparent);
    outline: .1rem solid var(--portal-focus);
    outline-offset: .1rem;
}

.table {
    --bs-table-bg: transparent;
    --bs-table-color: var(--portal-ink);
    --bs-table-border-color: var(--portal-border);
    --bs-table-hover-bg: var(--portal-surface-muted);
    margin-bottom: 0;
    font-size: .84375rem;
}

.table > :not(caption) > * > * {
    padding: .85rem 1rem;
    vertical-align: middle;
}

.table thead th {
    background: var(--portal-surface-muted);
    color: var(--portal-muted);
    font-size: .675rem;
    font-weight: 750;
    letter-spacing: .065em;
    text-transform: uppercase;
    white-space: nowrap;
}

.table tbody tr:last-child > * {
    border-bottom: 0;
}

.portal-seat-progress {
    width: min(8rem, 100%);
    min-width: 5rem;
    height: .25rem;
    background: var(--portal-border);
}

.portal-key-input,
.portal-product-key,
.portal-request-json,
.portal-code-block {
    font-family: "Cascadia Mono", "SFMono-Regular", Consolas, monospace;
    font-variant-numeric: tabular-nums;
}

.portal-product-key {
    overflow-wrap: anywhere;
    letter-spacing: .065em;
    user-select: all;
}

.portal-request-json {
    min-height: 16rem;
    font-size: .78rem;
}

.portal-code-block {
    overflow: auto;
    background: var(--portal-code-block);
    color: var(--portal-code-block-ink);
    border-radius: var(--bs-border-radius);
    padding: 1rem;
}

.portal-audit-detail {
    max-width: 34rem;
}

.pagination {
    --bs-pagination-bg: var(--portal-surface);
    --bs-pagination-border-color: var(--portal-border);
    --bs-pagination-color: var(--portal-brand);
    --bs-pagination-hover-bg: var(--portal-brand-soft);
    --bs-pagination-disabled-bg: var(--portal-disabled-bg);
    --bs-pagination-disabled-color: var(--portal-disabled);
}

details summary {
    cursor: pointer;
}

/* Foundry identity/account surfaces. Foundry defaults blank background settings to a package image. */
.auth-shell {
    background-color: var(--portal-canvas) !important;
    background-image: none !important;
}

.auth-shell-overlay {
    background: linear-gradient(var(--portal-overlay), var(--portal-overlay)) !important;
}

.auth-card {
    background: var(--portal-surface);
    border: 1px solid var(--portal-border) !important;
    box-shadow: 0 1.5rem 4rem var(--portal-shadow-strong) !important;
}

.navbar-theme :is(.btn, .btn-link, .dropdown-toggle) {
    color: var(--portal-brand-strong) !important;
}

.navbar-theme :is(.btn, .btn-link, .dropdown-toggle):hover,
.navbar-theme :is(.btn, .btn-link, .dropdown-toggle):focus-visible {
    background-color: var(--portal-brand-soft);
    color: var(--portal-brand-strong) !important;
}

.auth-card .card-body {
    padding: clamp(1.35rem, 4vw, 2.5rem) !important;
}

@media (max-width: 991.98px) {
    .navbar-theme .container-fluid,
    .container-integrated {
        width: min(calc(100% - 1.5rem), 92.5rem) !important;
    }

    .navbar-theme .navbar-collapse {
        margin-top: .75rem;
        padding: .75rem;
        background: var(--portal-surface-raised);
        border: 1px solid var(--portal-border);
        border-radius: .7rem;
        box-shadow: var(--portal-shadow-md);
    }

    .navbar-theme .navbar-nav {
        align-items: stretch;
    }

    .navbar-theme .nav-link {
        width: 100%;
    }

    .container-integrated {
        padding-top: 1.5rem !important;
    }

    .container-fluid.py-4 > .d-flex.align-items-center.justify-content-between {
        flex-wrap: wrap;
        gap: 1rem;
    }
}

@media (max-width: 575.98px) {
    body {
        font-size: .9rem;
    }

    .navbar-theme .container-fluid,
    .container-integrated {
        width: min(calc(100% - 1rem), 92.5rem) !important;
    }

    .container-integrated {
        padding: 1rem .75rem 0 !important;
    }

    .portal-page-header {
        align-items: stretch;
        flex-direction: column;
    }

    .portal-actions > .btn,
    .portal-actions > a.btn {
        flex: 1 1 auto;
    }

    .card-header,
    .card-body,
    .card-footer {
        padding-right: 1rem;
        padding-left: 1rem;
    }

    .table > :not(caption) > * > * {
        padding-right: .8rem;
        padding-left: .8rem;
    }

    .portal-metric .card-body {
        padding: 1rem !important;
    }
}

@media (max-width: 389.98px) {
    .navbar-theme .navbar-brand img {
        max-width: 7.5rem;
        height: 1.8rem !important;
    }

    .portal-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .portal-actions > * {
        width: 100%;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
    }
}

@supports not (backdrop-filter: blur(14px)) {
    .navbar-theme {
        background: var(--portal-surface) !important;
    }
}