@charset "UTF-8";

:root {
    --sim-navbar-height: 48px;
    --sim-navbar-gradient-height: 3px;
    --sim-nav-action-hit-area: 48px;
    --sim-breadcrumb-row-height: 32px;
    --sim-breadcrumb-height: calc(var(--sim-navbar-gradient-height) + var(--sim-breadcrumb-row-height));
    --sim-page-content-gap: 16px;
    --sim-nav-drawer-width: 304px;
    --sim-nav-drawer-transition: .3s ease-in-out;
    --sim-z-sticky-nav: 1100;
    --sim-z-nav-drawer: 1500;
    --sim-z-user-menu: 2000;
    --black: #000;
    --white: #fff;
    --blue-10: #eff8fd;
    --blue-20: #c5e8f9;
    --blue-30: #76cbf2;
    --blue-40: #00b7f1;
    --blue-50: #009cce;
    --blue-60: #007fa9;
    --blue-70: #006283;
    --blue-80: #004259;
    --blue-90: #002b3b;
    --blue-100: #001d29;
    --crimson-10: #f3ddd9;
    --crimson-20: #f8aea2;
    --crimson-30: #f67e6f;
    --crimson-40: #e64a3c;
    --crimson-50: #d80003;
    --crimson-60: #a30c09;
    --crimson-70: #770b07;
    --crimson-80: #4f0503;
    --crimson-90: #280302;
    --crimson-100: #060101;
    --forest-10: #dbe7db;
    --forest-20: #9fd4a0;
    --forest-30: #63bf6a;
    --forest-40: #24a33a;
    --forest-50: #1e862f;
    --forest-60: #146822;
    --forest-70: #104b19;
    --forest-80: #07300d;
    --forest-90: #041705;
    --forest-100: #010301;
    --gray-10: #f6f6f6;
    --gray-20: #E6E6E6;
    --gray-30: #bebebe;
    --gray-40: #a8a8a8;
    --gray-50: #8f8f8f;
    --gray-60: #747474;
    --gray-70: #595959;
    --gray-80: #3c3c3c;
    --gray-90: #262626;
    --gray-100: #191919;
    --green-10: #C7E9E7;
    --green-20: #A4DBD7;
    --green-30: #80CDC8;
    --green-40: #5DBFB8;
    --green-50: #39B1A9;
    --green-60: #1D958E;
    --green-70: #16746F;
    --green-80: #13645F;
    --green-90: #105450;
    --green-100: #0D4340;
    --lemon-10: #edebd0;
    --lemon-20: #ece49e;
    --lemon-30: #ece079;
    --lemon-40: #e7d854;
    --lemon-50: #ebd814;
    --lemon-60: #c0b12b;
    --lemon-70: #877c27;
    --lemon-80: #595220;
    --lemon-90: #2c280b;
    --lemon-100: #0c0c03;
    --ocean-10: #d9e4f4;
    --ocean-20: #9ec6fe;
    --ocean-30: #69a8ff;
    --ocean-40: #3386f2;
    --ocean-50: #296fc8;
    --ocean-60: #1e559d;
    --ocean-70: #163d71;
    --ocean-80: #0b274b;
    --ocean-90: #051225;
    --ocean-100: #010307;
    --orange-10: #f3f4f0;
    --orange-20: #fcd9cc;
    --orange-30: #f6a98c;
    --orange-40: #f4845a;
    --orange-50: #e95c1a;
    --orange-60: #bc4d1d;
    --orange-70: #903c18;
    --orange-80: #612812;
    --orange-90: #40190a;
    --orange-100: #310b00;
    --ochre-10: #faf6ed;
    --ochre-20: #eee0c1;
    --ochre-30: #dbba71;
    --ochre-40: #d0a005;
    --ochre-50: #b28800;
    --ochre-60: #926f00;
    --ochre-70: #715500;
    --ochre-80: #4c3800;
    --ochre-90: #322400;
    --ochre-100: #221800;
    --ruby-10: #fef3f6;
    --ruby-20: #fcd6e0;
    --ruby-30: #f4a3bb;
    --ruby-40: #f17ca3;
    --ruby-50: #e5528a;
    --ruby-60: #b94570;
    --ruby-70: #8e3656;
    --ruby-80: #5f2439;
    --ruby-90: #3f1625;
    --ruby-100: #300818;
    --steel-10: #f1f7ff;
    --steel-20: #d9e3ef;
    --steel-30: #b6bfcb;
    --steel-40: #9fa9b4;
    --steel-50: #87909b;
    --steel-60: #6d7580;
    --steel-70: #525a65;
    --steel-80: #353d46;
    --steel-85: #2c343c;
    --steel-90: #202730;
    --steel-100: #131a22;
    --twilight-10: #f7f5fe;
    --twilight-20: #e4dcfc;
    --twilight-30: #c5b1f7;
    --twilight-40: #b292f9;
    --twilight-50: #9d70f2;
    --twilight-60: #7f5cc3;
    --twilight-70: #624795;
    --twilight-80: #413064;
    --twilight-90: #2a1e42;
    --twilight-100: #1d1133;
    --error: var(--crimson-40);
    --success: var(--forest-40);
    --warning: var(--lemon-40);
    --info: var(--ocean-40);

    --bs-black: #000;
    --bs-white: #fff;
    --bs-gray: #6c757d;
    --bs-gray-dark: #343a40;
    --bs-gray-100: #f8f9fa;
    --bs-gray-200: #e9ecef;
    --bs-gray-300: #dee2e6;
    --bs-gray-400: #ced4da;
    --bs-gray-500: #adb5bd;
    --bs-gray-600: #6c757d;
    --bs-gray-700: #495057;
    --bs-gray-800: #343a40;
    --bs-gray-900: #212529;
    --bs-success: var(--green-70);
    --bs-info: #296FC8;
    --bs-warning: #E7D854;
    --bs-danger: #D80003;
    --bs-light: #f8f9fa;
    --bs-dark: #212529;
    --bs-primary-rgb: 0, 105, 87;
    --bs-secondary-rgb: 0, 127, 169;
    --bs-success-rgb: 30, 134, 47;
    --bs-info-rgb: 41, 111, 200;
    --bs-warning-rgb: 174, 144, 42;
    --bs-danger-rgb: 216, 0, 3;
    --bs-light-rgb: 248, 249, 250;
    --bs-dark-rgb: 0, 0, 0;
    --bs-white-rgb: 255, 255, 255;
    --bs-black-rgb: 0, 0, 0;
    --bs-font-sans-serif: "Roboto Flex", sans-serif;
    --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
    --bs-navbar-brand-color: #011946;
    --bs-body-font-family: var(--bs-font-sans-serif);
    --bs-body-font-size: var(--body-font-base-size);
    --bs-body-font-weight: 400;
    --bs-body-line-height: 1.5;
    --bs-body-color: #212529;
    --bs-body-color-rgb: 33, 37, 41;
    --bs-body-bg: #FCFCFC;
    --bs-body-bg-rgb: 255, 255, 255;
    --bs-emphasis-color: #000;
    --bs-emphasis-color-rgb: 0, 0, 0;
    --bs-secondary-color: rgba(33, 37, 41, 0.75);
    --bs-secondary-color-rgb: 33, 37, 41;
    --bs-secondary-bg: #e9ecef;
    --bs-secondary-bg-rgb: 233, 236, 239;
    --bs-tertiary-color: rgba(33, 37, 41, 0.5);
    --bs-tertiary-color-rgb: 33, 37, 41;
    --bs-tertiary-bg: #f8f9fa;
    --bs-tertiary-bg-rgb: 248, 249, 250;
    --bs-heading-color: inherit;
    --bs-link-color: #0d6efd;
    --bs-link-color-rgb: 13, 110, 253;
    --bs-link-decoration: underline;
    --bs-link-hover-color: #0a58ca;
    --bs-link-hover-color-rgb: 10, 88, 202;
    --bs-code-color: #d63384;
    --bs-highlight-bg: #fff3cd;
    --bs-border-width: 1px;
    --bs-border-style: solid;
    --bs-border-color: #dee2e6;
    --bs-border-color-translucent: rgba(0, 0, 0, 0.175);
    --bs-border-radius: 0.375rem;
    --bs-border-radius-sm: 0.25rem;
    --bs-border-radius-lg: 0.5rem;
    --bs-border-radius-xl: 1rem;
    --bs-border-radius-xxl: 2rem;
    --bs-border-radius-2xl: var(--bs-border-radius-xxl);
    --bs-border-radius-pill: 50rem;
    --bs-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    --bs-box-shadow-sm: 10px 4px 4px rgba(0, 0, 0, 0.25);
    --bs-box-shadow-lg: 10px 4px 4px rgba(0, 0, 0, 0.25);
    --bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.075);
    --bs-focus-ring-width: var(--outline-width);
    --bs-focus-ring-opacity: 1;
    --bs-focus-ring-color: var(--outline-color);
    --bs-form-valid-color: #198754;
    --bs-form-valid-border-color: #198754;
    --bs-form-invalid-color: #dc3545;
    --bs-form-invalid-border-color: #dc3545;
    --bd-callout-danger: #dc3545;
    --bd-callout-warning: #ffc107;
    --bd-callout-primary: #0d6efd;
    --bd-callout-success: #198754;
    --bd-callout-secondary: #6c757d;
    --bd-callout-info: #0dcaf0;
    --bd-callout-light: #f8f9fa;

    --font-family: "Roboto Flex", sans-serif;
    --logo-family: "Roboto Logo Text";
    --code-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New", monospace;

    --font-size-xxs: 0.5rem;
    --font-size-xs: 0.625rem;
    --font-size-sm: 0.75rem;
    --font-size-md: var(--body-font-base-size);
    --font-size: var(--font-size-md);
    --font-size-lg: 1rem;
    --font-size-xl: 1.125rem;

    --header-font-size-1: 1.625rem;
    --header-font-size-2: 1.5rem;
    --header-font-size-3: 1.25rem;
    --header-font-size-4: 1.125rem;
    --header-font-size-5: 1rem;
    --header-font-size-6: var(--body-font-base-size);

    --header-font-weight-1-brand: SemiBold 600;
    --header-font-weight-1: ExtraLight 200;
    --header-font-weight-2: Regular 400;
    --header-font-weight-3: Regular 400;
    --header-font-weight-4: Regular 400;
    --header-font-weight-5: Regular 400;
    --header-font-weight-6: Regular 400;
    --header-font-weight-6-brand: SemiBold 600;

    --body-font-base-size: 0.875rem;
    --font-weight-bold: 500;
    --font-weight-bolder: 600;
    --font-weight-light: ExtraLight 200;
    --line-height: 1.42;
    --readable-width: 80ch;

    --neutral-0: #FCFCFC;
    --neutral-1: #FFFFFF;
    --neutral-2: #F2F2F2;
    --neutral-3: #E1E1E1;
    --neutral-4: #D1D1D1;

    --size-0: 0;
    --size-1: 4px;
    --size-2: 7px;
    --size-3: 11px;
    --size-4: 14px;
    --size-5: 21px;
    --size-6: 28px;
    --size-7: 42px;
    --size-8: 56px;

    --bs-nav-link-font-size: 1em;
    --bs-nav-link-font-weight: 400;
    --bs-nav-link-color: var(--green-40);
    --bs-nav-link-hover-color: var(--green-40);
    --bs-nav-link-disabled-color: #6c757d;

    --bs-btn-font-weight: 600;
    --bs-btn-font-size: var(--body-font-base-size);
    --bs-btn-line-height: 16px;
    --bs-btn-color: var(--bs-black);
    --bs-btn-bg: var(--green-40);
    --bs-btn-border-color: var(--green-40);
    --bs-btn-border-radius: 4;
    --bs-btn-border-width: 2;
    --bs-btn-hover-color: var(--green-30);
    --bs-btn-hover-bg: var(--green-50);
    --bs-btn-hover-border-color: var(--green-50);
    --bs-btn-focus-shadow-rgb: none;
    --bs-btn-focus-border-weight: 0;
    --bs-btn-active-color: var(--green-20);
    --bs-btn-active-bg: var(--green-20);
    --bs-btn-active-border-color: var(--green-20);

    --hover-darken: 0.9;
    --hover-brighten: 1.1;

}

.pagination {
    --bs-pagination-padding-x: 0.75rem;
    --bs-pagination-padding-y: 0.375rem;
    --bs-pagination-font-size: 1rem;
    --bs-pagination-color: var(--bs-link-color);
    --bs-pagination-bg: var(--bs-body-bg);
    --bs-pagination-border-width: 1px;
    --bs-pagination-border-color: var(--bs-gray-500);
    --bs-pagination-border-radius: 0px;
    --bs-pagination-hover-color: var(--bs-link-hover-color);
    --bs-pagination-hover-bg: var(--bs-tertiary-bg);
    --bs-pagination-hover-border-color: var(--bs-border-color);
    --bs-pagination-focus-color: var(--green-40);
    --bs-pagination-focus-bg: var(--bs-secondary-bg);
    --bs-pagination-focus-box-shadow: 0 0 0 2px var(--green-70);
    --bs-pagination-active-color: #fff;
    --bs-pagination-active-bg: var(--white);
    --bs-pagination-active-border-color: var(--white);
    --bs-pagination-disabled-color: var(--bs-secondary-color);
    --bs-pagination-disabled-bg: var(--bs-secondary-bg);
    --bs-pagination-disabled-border-color: var(--bs-border-color);
}

.form-control,
.form-select {
    min-height: 36px;
    color: var(--text-default);
    background-color: var(--color-input-background-default);
    border: 1px solid var(--color-input-border-default);
    border-radius: 2px;
    font-size: var(--font-size, 14px);
    line-height: 1.4;
}

.form-select {
    min-width: 150px;
    max-width: 300px;
    width: auto;
    padding: 10px 8px;
}

.form-control:hover:not(:disabled),
.form-select:hover:not(:disabled) {
    border-color: var(--color-input-border-hover);
}

.form-control:focus,
.form-select:focus {
    color: var(--text-default);
    background-color: var(--color-input-background-active);
    border-color: var(--color-input-border-active);
    outline: 0;
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--color-input-border-active) 35%, transparent);
}

.form-control:disabled,
.form-select:disabled {
    color: var(--text-disabled);
    background-color: var(--color-input-background-disabled);
    border-color: var(--color-input-border-disabled);
    cursor: not-allowed;
}

.form-select.form-select-md {
    min-width: 200px;
    width: auto;
    padding: 10px 8px;
    border-radius: 2px;

}

.form-select.form-select-sm {
    min-width: 65px;
    min-height: 32px;
    width: auto;
    padding: 5px 28px 5px 10px;
    border: 1px solid var(--color-input-border-default);
    border-radius: 2px;
    line-height: 18px;
}

.form-label {
    margin-bottom: var(--size-2, 4px);
    color: var(--text-default);
    font-size: var(--font-size-sm, 13px);
    font-weight: var(--font-weight-bold, 500);
}

.form-text {
    color: var(--text-muted);
    font-size: var(--font-size-sm, 13px);
}

.invalid-feedback,
.errorlist {
    color: var(--text-negative);
    font-size: var(--font-size-sm, 13px);
}

.form-control.is-invalid,
.form-select.is-invalid {
    border-color: var(--color-negative-30);
}

[data-bs-theme="theme-green-light"] {
    --bs-body-color: var(--text-default);
    --bs-body-color-rgb: 17, 17, 17;
    --bs-body-bg: var(--surface-background);
    --bs-body-bg-rgb: 250, 250, 250;
    --bs-secondary-color: var(--text-muted);
    --bs-secondary-bg: var(--surface-level-1);
    --bs-tertiary-bg: var(--surface-raised);
    --bs-primary: var(--color-interactive-30);
    --bs-secondary: var(--color-interactive-30);
    --bs-success: var(--color-positive-30);
    --bs-info: var(--color-info-30);
    --bs-warning: var(--color-warning-30);
    --bs-danger: var(--color-negative-30);
    --bs-light: var(--surface-raised);
    --bs-dark: var(--text-default);
    --bs-primary-rgb: 42, 100, 102;
    --bs-secondary-rgb: 42, 100, 102;
    --bs-success-rgb: 0, 123, 34;
    --bs-info-rgb: 51, 88, 204;
    --bs-warning-rgb: 218, 187, 7;
    --bs-danger-rgb: 214, 0, 0;
    --bs-light-rgb: 240, 242, 244;
    --bs-dark-rgb: 17, 17, 17;
    --bs-border-color: var(--border-color-10);
    --bs-link-color: var(--color-link-10);
    --bs-link-hover-color: var(--color-link-20);
    --bs-nav-link-color: var(--text-default);
    --bs-nav-link-hover-color: var(--color-link-20);
    --bs-btn-hover-color: var(--color-interactive-40);
}


[data-bs-theme="theme-green-dark"] {
    --bs-body-color: var(--text-default);
    --bs-body-color-rgb: 250, 250, 250;
    --bs-body-bg: var(--surface-background);
    --bs-body-bg-rgb: 17, 17, 17;
    --bs-tertiary-bg: var(--surface-raised);
    --bs-secondary-bg: var(--surface-level-1);
    --bs-primary: var(--color-interactive-30);
    --bs-secondary: var(--color-interactive-30);

    --bs-success: var(--color-positive-30);
    --bs-info: var(--text-info);
    --bs-warning: var(--color-warning-30);
    --bs-danger: var(--color-negative-30);
    --bs-light: var(--surface-raised);
    --bs-dark: var(--text-default);
    --bs-primary-rgb: 72, 184, 188;
    --bs-secondary-rgb: 72, 184, 188;
    --bs-success-rgb: 69, 170, 97;
    --bs-info-rgb: 122, 149, 235;
    --bs-warning-rgb: 236, 203, 9;
    --bs-danger-rgb: 251, 106, 106;
    --bs-light-rgb: 41, 49, 56;
    --bs-dark-rgb: 250, 250, 250;
    --bs-border-color: var(--border-color-10);
    --bs-link-color: var(--color-link-10);
    --bs-link-hover-color: var(--color-link-20);
    --bs-nav-link-color: var(--text-default);
    --bs-nav-link-hover-color: var(--color-link-20);
    --bs-secondary-color: var(--text-muted);
}

[data-theme="light"] {
    color-scheme: light;
}

[data-theme="dark"] {
    color-scheme: dark;
}

[data-theme] {
    --color-input-10: var(--color-input-background-default);
    --navbar-background: var(--surface-background);
    --datatable-row-bg: var(--surface-level-1);
    --datatable-row-alt-bg: var(--color-grid-row-odd);
    --sim-hover-bg: var(--color-interactive-10);
    --sim-list-item-hover-bg: var(--sim-hover-bg);
    --datatable-row-hover-bg: var(--sim-list-item-hover-bg);
    --datatable-header-bg: var(--color-grid-header);
    --rail-background: var(--surface-raised);
    --sim-page-bg: var(--surface-background);
    --sim-surface: var(--surface-level-1);
    --sim-surface-subtle: var(--color-neutral-10);
    --sim-border: var(--border-color-10);
    --sim-border-strong: var(--border-color-30);
    --sim-text: var(--text-default);
    --sim-muted: var(--text-muted);
    --sim-accent: var(--color-interactive-30);
    --sim-accent-strong: var(--color-link-20);
    --sim-accent-soft: var(--color-interactive-10);
}

html[data-theme="dark"] .tooltip {
    --bs-tooltip-bg: var(--surface-raised, #293138);
    --bs-tooltip-color: var(--text-default, #fafafa);
    --bs-tooltip-opacity: 1;
}

html[data-theme="dark"] .tooltip-inner {
    color: var(--text-default, #fafafa);
    background-color: var(--surface-raised, #293138);
    border: 1px solid var(--border-color-10, #3b3b3b);
    box-shadow: 0 8px 24px rgba(0, 0, 0, .42);
}

html[data-theme="dark"] .popover {
    --bs-popover-bg: var(--surface-raised, #293138);
    --bs-popover-border-color: var(--border-color-10, #3b3b3b);
    --bs-popover-header-bg: var(--surface-level-1, #262626);
    --bs-popover-header-color: var(--text-default, #fafafa);
    --bs-popover-body-color: var(--text-default, #fafafa);
}

html[data-theme="light"] .navbar-brand img {
    filter: brightness(0);
}

html[data-theme="light"] .navbar-toggler-icon {
    background-image: url('data:image/svg+xml;utf8,<svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><rect x="4" y="6" width="16" height="2" fill="%23011946"/><rect x="4" y="11" width="16" height="2" fill="%23011946"/><rect x="4" y="16" width="16" height="2" fill="%23011946"/></svg>');
}

html[data-theme="light"] .tooltip {
    --bs-tooltip-bg: var(--white, #ffffff);
    --bs-tooltip-color: var(--gray-100, #191919);
    --bs-tooltip-opacity: 1;
}

html[data-theme="light"] .tooltip-inner {
    color: var(--gray-100, #191919);
    background-color: var(--white, #ffffff);
    border: 1px solid var(--border-color-10, var(--gray-20));
    box-shadow: 0 8px 24px rgba(25, 25, 25, .16);
}

html[data-theme="light"] .popover {
    --bs-popover-bg: var(--white, #ffffff);
    --bs-popover-border-color: var(--border-color-10, var(--gray-20));
    --bs-popover-header-bg: var(--surface-level-1, #ffffff);
    --bs-popover-header-color: var(--gray-100, #191919);
    --bs-popover-body-color: var(--gray-100, #191919);
}

html[data-theme="light"] .offcanvas {
    --sim-drawer-active-bg: var(--bs-primary);
    --sim-drawer-active-color: var(--white);
    --sim-drawer-hover-bg: #E3E3E3;
    color: var(--text-default);
    background-color: var(--rail-background);
    border-right: 1px solid var(--border-color-10);
}

html[data-theme="light"] .table {
    --bs-table-color: var(--text-default);
    --bs-table-bg: var(--datatable-row-bg);
    --bs-table-border-color: var(--border-color-10);
    --bs-table-striped-color: var(--text-default);
    --bs-table-striped-bg: var(--datatable-row-alt-bg);
    --bs-table-hover-color: var(--text-default);
    --bs-table-hover-bg: var(--datatable-row-hover-bg);
    color: var(--text-default);
    background-color: var(--datatable-row-bg);
    border-color: var(--border-color-10);
}

html[data-theme="light"] .table:not(.dataTable) thead th {
    color: var(--text-default);
    background-color: var(--datatable-header-bg);
    border-color: var(--border-color-10);
}

html[data-theme="light"] .table tbody td {
    border-color: var(--border-color-10);
}

html[data-theme="light"] .table-hover:not(.dataTable) > tbody > tr:hover > * {
    color: var(--text-default);
    background-color: var(--datatable-row-hover-bg);
}

html[data-theme="light"] .sim-entities-page,
html[data-theme="light"] .catalog-page {
    --sim-surface-subtle: var(--datatable-header-bg);
}

html[data-theme="dark"],
html[data-theme="dark"] body {
    color: var(--text-default);
    background-color: var(--surface-background);
}

html[data-theme="dark"] main,
html[data-theme="dark"] main > .container-fluid {
    color: var(--text-default);
    background-color: var(--surface-background);
}

.theme-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--bs-nav-link-color);
    background: transparent;
    border: 0;
    cursor: pointer;
}

.theme-toggle:hover,
.theme-toggle:focus-visible {
    color: var(--bs-nav-link-hover-color);
}

.theme-toggle:focus-visible {
    outline: 2px solid var(--color-focus-10, var(--green-70));
    outline-offset: 2px;
}

html[data-theme="dark"] .offcanvas {
    --sim-drawer-active-bg: #48B8BC;
    --sim-drawer-active-color: var(--surface-background);
    --sim-drawer-hover-bg: #3B3B3B;
    color: var(--text-default);
    background-color: var(--rail-background);
    border-right: 1px solid var(--border-color-10);
}

html[data-theme="dark"] :is(.standard-container, .standard-fluid-container, .standard-filter-container),
html[data-theme="dark"] #datatable,
html[data-theme="dark"] .card,
html[data-theme="dark"] .card-body,
html[data-theme="dark"] .list-group-item,
html[data-theme="dark"] .modal-content,
html[data-theme="dark"] .toast {
    color: var(--text-default);
    background-color: var(--surface-level-1);
    border-color: var(--border-color-10);
}

html[data-theme="dark"] .card-body:hover > .card-title,
html[data-theme="dark"] .card-body:hover > p {
    color: var(--text-default);
}

html[data-theme="dark"] small,
html[data-theme="dark"] .small,
html[data-theme="dark"] .field-label {
    color: var(--text-muted);
}

html[data-theme="dark"] .text-secondary {
    --bs-secondary-rgb: 171, 171, 171;
}

html[data-theme="dark"] .field-data,
html[data-theme="dark"] h1,
html[data-theme="dark"] h2,
html[data-theme="dark"] h3,
html[data-theme="dark"] h4,
html[data-theme="dark"] h5,
html[data-theme="dark"] h6,
html[data-theme="dark"] p,
html[data-theme="dark"] li,
html[data-theme="dark"] td,
html[data-theme="dark"] th {
    color: var(--text-default);
}

html[data-theme="dark"] .dropdown-menu {
    color: var(--text-default);
    background-color: var(--surface-raised);
    border-color: var(--border-color-10);
}

html[data-theme="dark"] .dropdown-item,
html[data-theme="dark"] .dropdown-item-text {
    color: var(--text-default);
}

html[data-theme="dark"] .dropdown-item:hover,
html[data-theme="dark"] .dropdown-item:focus {
    color: var(--text-default);
    background-color: var(--color-interactive-10);
}

html[data-theme="dark"] .form-control,
html[data-theme="dark"] .form-select,
html[data-theme="dark"] input,
html[data-theme="dark"] textarea,
html[data-theme="dark"] select {
    color: var(--text-default);
    background-color: var(--color-input-background-default);
    border-color: var(--color-input-border-default);
}

html[data-theme="dark"] .form-control::placeholder,
html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder {
    color: var(--text-muted);
}

html[data-theme="dark"] .form-control:focus,
html[data-theme="dark"] .form-select:focus,
html[data-theme="dark"] input:focus,
html[data-theme="dark"] textarea:focus,
html[data-theme="dark"] select:focus {
    border-color: var(--color-input-border-active);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--color-input-border-active) 35%, transparent);
}

html[data-theme="dark"] .table {
    --bs-table-color: var(--text-default);
    --bs-table-bg: var(--surface-level-1);
    --bs-table-border-color: var(--border-color-10);
    --bs-table-striped-color: var(--text-default);
    --bs-table-striped-bg: var(--color-neutral-10);
    --bs-table-hover-color: var(--text-default);
    --bs-table-hover-bg: var(--datatable-row-hover-bg);
    color: var(--text-default);
    border-color: var(--border-color-10);
}

html[data-theme="dark"] .table:not(.dataTable) thead th {
    color: var(--text-default);
    background-color: var(--color-neutral-10);
    border-color: var(--border-color-10);
}

html[data-theme="dark"] .table-dark {
    --bs-table-color: var(--text-default);
    --bs-table-bg: var(--color-neutral-10);
    --bs-table-border-color: var(--border-color-10);
    color: var(--text-default);
    background-color: var(--color-neutral-10);
}

html[data-theme="dark"] .table tbody td {
    border-color: var(--border-color-10);
}

html[data-theme="dark"] .table-hover:not(.dataTable) > tbody > tr:hover > * {
    color: var(--text-default);
    background-color: var(--datatable-row-hover-bg);
}

html[data-theme="dark"] .page-link {
    color: var(--text-default);
    background-color: var(--surface-level-1);
    border-color: var(--border-color-10);
}

html[data-theme="dark"] .page-link:hover,
html[data-theme="dark"] .page-link:focus {
    color: var(--text-default);
    background-color: var(--color-interactive-10);
    border-color: var(--border-color-30);
}

html[data-theme="dark"] .page-item.active .page-link {
    color: var(--surface-background);
    background-color: var(--color-interactive-30);
    border-color: var(--color-interactive-30);
}

html[data-theme="dark"] code,
html[data-theme="dark"] pre {
    color: var(--text-default);
    background-color: var(--surface-background);
    border-color: var(--border-color-code);
}

html[data-theme="dark"] code[class*="language-"],
html[data-theme="dark"] pre[class*="language-"] {
    color: var(--text-default);
    background: var(--surface-background);
    text-shadow: none;
}

html[data-theme="dark"] :not(pre) > code[class*="language-"],
html[data-theme="dark"] pre[class*="language-"] {
    background: var(--surface-background);
    border: 1px solid var(--border-color-code);
}

html[data-theme="dark"] .token.comment,
html[data-theme="dark"] .token.prolog,
html[data-theme="dark"] .token.doctype,
html[data-theme="dark"] .token.cdata {
    color: var(--text-muted);
}

html[data-theme="dark"] .token.punctuation {
    color: #d7e0e4;
}

html[data-theme="dark"] .token.property,
html[data-theme="dark"] .token.tag,
html[data-theme="dark"] .token.boolean,
html[data-theme="dark"] .token.number,
html[data-theme="dark"] .token.constant,
html[data-theme="dark"] .token.symbol {
    color: var(--color-link-20);
}

html[data-theme="dark"] .token.selector,
html[data-theme="dark"] .token.attr-name,
html[data-theme="dark"] .token.string,
html[data-theme="dark"] .token.char,
html[data-theme="dark"] .token.builtin {
    color: var(--color-positive-30);
}

html[data-theme="dark"] .token.operator,
html[data-theme="dark"] .token.entity,
html[data-theme="dark"] .token.url,
html[data-theme="dark"] .language-css .token.string,
html[data-theme="dark"] .style .token.string {
    color: var(--color-warning-30);
    background: transparent;
}

html[data-theme="dark"] .token.atrule,
html[data-theme="dark"] .token.attr-value,
html[data-theme="dark"] .token.keyword {
    color: var(--text-info);
}

html[data-theme="dark"] .token.function,
html[data-theme="dark"] .token.class-name {
    color: var(--color-negative-30);
}

html[data-theme="dark"] .footer-copyright {
    color: var(--text-muted);
    background-color: var(--surface-background);
    border-top: 1px solid var(--border-color-10);
}

.entity-list-page .entity-list-eyebrow {
    color: var(--gray-70);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.entity-list-page .entity-count-pill {
    padding: 4px 10px;
    color: var(--gray-80);
    white-space: nowrap;
    background-color: var(--gray-10);
    border: 1px solid var(--gray-20);
    border-radius: 999px;
    font-size: var(--font-size, 0.875rem);
    font-weight: 400;
}

.entity-list-page .entity-description {
    width: 100%;
    max-width: none;
}

.entity-list-page .locked-entity,
.api-overview-page .locked-entity {
    color: var(--gray-60);
}

.entity-list-page .locked-entity .material-symbols-outlined,
.api-overview-page .locked-entity .material-symbols-outlined {
    margin-right: 4px;
    color: var(--gray-60);
    font-size: 16px;
    line-height: 1;
    vertical-align: -3px;
}

html[data-theme="dark"] .entity-list-page .entity-list-eyebrow {
    color: var(--color-link-20);
}

html[data-theme="dark"] .entity-list-page .entity-count-pill {
    color: var(--text-default);
    background-color: var(--color-neutral-10);
    border-color: var(--border-color-10);
}

html[data-theme="dark"] .entity-list-page .locked-entity,
html[data-theme="dark"] .api-overview-page .locked-entity {
    color: var(--text-muted);
}

html[data-theme="dark"] .entity-list-page .locked-entity .material-symbols-outlined,
html[data-theme="dark"] .api-overview-page .locked-entity .material-symbols-outlined {
    color: var(--text-muted);
}

html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}


hr {
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    height: 0;
    overflow: visible
}

/* Font */
@font-face {
    font-family: 'Roboto Flex';
    src: url("../fonts/RobotoFlex.44246d37f28d.woff2") format('woff2')
}

/* Material Icons */
.material-symbols-outlined {
    vertical-align: middle;
    font-variation-settings: 'FILL' 1,
    'wght' 400,
    'GRAD' 0,
    'opsz' 24
}

:is(a, button, .btn, [role="button"]) .material-symbols-outlined {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

/* Header */

h1.navbar-brand {
    font-size: var(--header-font-size-1);
    font-weight: var(--header-font-weight-1-brand);
    margin-top: var(--size-3);
    margin-bottom: var(--size-3);
}

h1 {
    font-size: var(--header-font-size-1);
    font-weight: var(--font-weight-bold);
    margin-top: var(--size-3);
    margin-bottom: var(--size-3);
    text-transform: uppercase;
}

h2 {
    font-size: var(--header-font-size-2);
    font-weight: var(--font-weight-bold);
}

h3 {
    font-size: var(--header-font-size-3);
    font-weight: var(--font-weight-bold);
}

h4 {
    font-size: var(--header-font-size-4);
    font-weight: var(--font-weight-bold);
}

h5 {
    font-size: var(--header-font-size-5);
    font-weight: var(--font-weight-bold);
}

h6.brand {
    font-size: var(--header-font-size-6);
    font-weight: var(--font-weight-bold);
    margin-top: var(--size-3);
    margin-bottom: var(--size-3);
}

h6 {
    font-size: var(--header-font-size-6);
    font-weight: var(--font-weight-bold);
}


/* Hero */

.heroBanner_src-pages {
    padding: 4rem 0;
    text-align: center;
    position: relative;
    overflow: hidden;
}

.hero__title,
.hero__subtitle {
    font-style: normal;
    font-weight: 600;
    font-stretch: 151%;
    color: var(--bs-white);
}

.hero__title {
    font-size: 4rem;
    margin: 0;
}

.hero__subtitle {
    display: block;
    width: fit-content;
    font-size: 2rem;
    margin: 1rem auto 1.5rem;
}

.hero__wordmark {
    display: block;
    max-width: 150px;
}

.btn.hero__button {
    padding: 14px 20px;
}

main[role="main"] {
    background-color: var(--neutral-0);
    padding-top: var(--sim-page-content-gap);
}

/* Hero */

.bgimage {
    height: 350px;
    background-image: url("../img/LIVE_Gradient-1_Wide.3a9631d9df7e.svg");
    background-size: cover;
    display:block;
}

#features.landing-features {
    margin-right: calc(var(--bs-gutter-x, 1.5rem) / -2);
    margin-left: calc(var(--bs-gutter-x, 1.5rem) / -2);
    padding: 3rem var(--bs-gutter-x, 1.5rem) 3.5rem;
    background-color: var(--surface-background, var(--neutral-0));
}

#features .landing-features__container {
    overflow: visible;
}

.landing-features__grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 1.5rem;
    align-items: stretch;
}

.landing-feature {
    display: flex;
    flex-direction: column;
    min-height: 100%;
    padding: 1.75rem;
    color: var(--text-default, var(--gray-100));
    background-color: var(--surface-level-1, var(--white));
    border: 1px solid var(--border-color-10, var(--gray-20));
    border-top: 3px solid var(--color-interactive-30, var(--green-40));
    border-radius: 8px;
    box-shadow: 0 16px 32px rgba(19, 26, 34, .08);
}

.landing-feature__media {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    margin-bottom: 1.25rem;
    background-color: rgba(var(--bs-primary-rgb), .08);
    border: 1px solid rgba(var(--bs-primary-rgb), .18);
    border-radius: 8px;
}

.landing-feature__image.feature-image {
    width: 42px;
    height: 42px;
    margin-bottom: 0;
    padding: 0;
    object-fit: contain;
}

.landing-feature__title {
    margin: 0 0 .875rem;
    color: var(--text-default, var(--gray-100));
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1.25;
}

.landing-feature__text {
    display: block;
    margin: 0;
    color: var(--text-muted, var(--gray-70));
    line-height: 1.65;
}

html[data-theme="dark"] #features.landing-features {
    background-color: var(--surface-background);
}

html[data-theme="dark"] .landing-feature {
    color: var(--text-default);
    background-color: var(--surface-level-1);
    border-color: var(--border-color-10);
    border-top-color: var(--sim-action-bg);
    box-shadow: none;
}

html[data-theme="dark"] .landing-feature__media {
    background-color: rgba(106, 182, 187, .12);
    border-color: rgba(106, 182, 187, .28);
}

html[data-theme="dark"] .landing-feature__text {
    color: var(--text-muted);
}

/* Landing hero + features for mobile-friendly scaling. */
@media (max-width: 768px) {
    .heroBanner_src-pages {
        padding: 2.5rem 1rem;
    }

    .hero__title {
        font-size: 2.5rem;
    }

    .hero__subtitle {
        font-size: 1.5rem;
    }

    .bgimage {
        height: auto;
        min-height: 260px;
    }

    #features.landing-features {
        padding: 2rem var(--bs-gutter-x, 1rem) 2.5rem;
    }

    .landing-feature {
        padding: 1.5rem;
    }
}

@media (max-width: 480px) {
    .heroBanner_src-pages {
        padding: 2rem 1rem;
    }

    .hero__title {
        font-size: 2rem;
    }

    .hero__subtitle {
        font-size: 1.25rem;
    }

    .bgimage {
        min-height: 220px;
    }
}

/* Adjustments for 1200px breakpoint */
@media (max-width: 1200px) {
    .bgimage {
        background-image: url("../img/LIVE_Gradient-1_Wide.3a9631d9df7e.svg");
        display:block;
    }
}

/* Adjustments for 960px breakpoint */
@media (max-width: 960px) {
    .divider {
        background-image: url("../img/LIVE_Gradient-1_Wide.3a9631d9df7e.svg");
        display:block;
    }
}

.divider-gradient {
    height: var(--sim-navbar-gradient-height);
    border: none;
    width: 100%;
    background-image: linear-gradient(90deg, #7DE6E0 0%, #0A7BD7 18%, #083EA7 34%, #4B17B6 50%, #EF3E4A 68%, #FB9B2A 86%, #E3E3E3 100%);
    background-position: left center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
}


/* Nav Bar */

.sim-navbar {
    --bs-navbar-color: var(--text-default);
    --bs-navbar-hover-color: var(--text-default);
    --bs-navbar-active-color: var(--text-default);
}

.navbar {
    padding: 0 0 0 16px;
    display: flex;
    align-items: center;
    color: var(--text-default);
    background-color: var(--navbar-background);
}

/* Navbar action area: theme toggle, admin icons, user dropdown */
.navbar-actions {
    display: flex;
    align-items: stretch;
    justify-content: flex-end;
    margin-left: auto;
    padding-right: 0.75rem;
}

.navbar-actions .navbar-nav {
    align-items: stretch;
    gap: 0;
    margin-bottom: 0;
}

.navbar-actions .nav-item {
    display: flex;
    align-items: stretch;
    /* Reset the legacy sidebar `li.nav-item { margin: 24px 0 }` rule, which would
       otherwise inflate the action bar to twice the navbar height and push the
       logo/login out of the visible bar (most noticeable on mobile). */
    margin: 0;
}

/* Make every action (link or button) the same 48x48 hit-area and visually consistent */
.navbar-actions .nav-link,
.navbar-actions .theme-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: var(--sim-nav-action-hit-area);
    height: var(--sim-nav-action-hit-area);
    padding: 0 0.75rem;
    color: var(--text-default);
    background: transparent;
    border: 0;
    text-decoration: none;
    line-height: 1;
    border-radius: 0;
}

.navbar-actions .nav-link:hover,
.navbar-actions .nav-link:focus,
.navbar-actions .theme-toggle:hover,
.navbar-actions .theme-toggle:focus {
    color: var(--text-default);
    text-decoration: none;
    background-color: var(--datatable-row-alt-bg);
}

.navbar-actions .nav-link:focus-visible,
.navbar-actions .theme-toggle:focus-visible {
    outline: 2px solid var(--color-focus-10, var(--green-40));
    outline-offset: -2px;
}

/* Normalize icon sizes inside the navbar so Material Symbols and Bootstrap Icons match */
.navbar-actions .material-symbols-outlined,
.navbar-actions .bi {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    font-size: 18px;
    line-height: 1;
    vertical-align: middle;
}

.navbar-actions .theme-toggle [data-theme-toggle-icon] {
    display: none;
}

html[data-theme-preference="system"] .theme-toggle [data-theme-toggle-icon="system"],
html[data-theme-preference="light"] .theme-toggle [data-theme-toggle-icon="light"],
html[data-theme-preference="dark"] .theme-toggle [data-theme-toggle-icon="dark"] {
    display: inline-flex;
}

/* User dropdown */
.navbar-user-menu {
    position: relative;
}

.navbar-theme-menu {
    position: relative;
}

.navbar-theme-menu .dropdown-toggle::after {
    display: none;
}

.navbar-theme-menu .dropdown-menu {
    --bs-dropdown-min-width: 0;
    position: absolute;
    top: 100%;
    right: 0;
    left: auto;
    display: block;
    height: auto;
    margin-top: 0.25rem;
    width: max-content;
    min-width: 8rem;
    padding: 0.35rem 0;
    color: var(--text-default, var(--gray-100));
    background-color: #fff;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: var(--bs-border-radius, 0.375rem);
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.175);
    z-index: var(--sim-z-user-menu);
}

.navbar-theme-menu .dropdown-menu:not(.show) {
    display: none;
}

.navbar-theme-menu .dropdown-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    width: 100%;
    padding: 0.45rem 0.85rem;
    color: var(--text-default, var(--gray-100));
    background-color: transparent;
    border: 0;
    font-size: var(--font-size, 0.875rem);
    line-height: 1.2;
}

.navbar-theme-menu .dropdown-item .material-symbols-outlined {
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    font-size: 18px;
}

.navbar-theme-menu .dropdown-item:hover,
.navbar-theme-menu .dropdown-item:focus,
.navbar-theme-menu .dropdown-item.active,
.navbar-theme-menu .dropdown-item[aria-checked="true"] {
    color: var(--color-link-10, var(--green-80));
    background-color: var(--color-interactive-10, var(--green-10));
    text-decoration: none;
}

.navbar-theme-menu .dropdown-item.active,
.navbar-theme-menu .dropdown-item[aria-checked="true"] {
    font-weight: 600;
}

.navbar-user-menu .dropdown-toggle::after {
    display: none; /* avatar icon is the affordance */
}

.navbar-user-menu .dropdown-menu {
    position: absolute;
    top: 100%;
    right: 0;
    left: auto;
    display: block;
    height: auto;
    margin-top: 0.25rem;
    min-width: 12rem;
    padding: 0.5rem 0;
    color: var(--text-default, var(--gray-100));
    background-color: #fff;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: var(--bs-border-radius, 0.375rem);
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.175);
    align-items: stretch;
    justify-content: flex-start;
    z-index: var(--sim-z-user-menu);
}

.navbar-user-menu .dropdown-menu:not(.show) {
    display: none;
}

.navbar-user-menu .dropdown-item,
.navbar-user-menu .dropdown-item-text {
    display: block;
    width: 100%;
    padding: 0.5rem 1rem;
    color: var(--text-default, var(--gray-100));
    background-color: transparent;
    text-decoration: none;
    white-space: nowrap;
}

.navbar-user-menu .dropdown-item:hover,
.navbar-user-menu .dropdown-item:focus {
    color: var(--color-link-10, var(--green-80));
    background-color: var(--color-interactive-10, var(--green-10));
    text-decoration: none;
}

/* Dark-mode overrides for the user dropdown */
html[data-theme="dark"] .navbar-user-menu .dropdown-menu {
    background-color: var(--surface-raised);
    border-color: var(--border-color-10);
    box-shadow: 0 18px 42px rgba(0, 0, 0, .42);
}

html[data-theme="dark"] .navbar-theme-menu .dropdown-menu {
    background-color: var(--surface-raised);
    border-color: var(--border-color-10);
    box-shadow: 0 18px 42px rgba(0, 0, 0, .42);
}

html[data-theme="dark"] .navbar-user-menu .dropdown-item,
html[data-theme="dark"] .navbar-user-menu .dropdown-item-text,
html[data-theme="dark"] .navbar-theme-menu .dropdown-item {
    color: var(--text-default);
}

html[data-theme="dark"] .navbar-user-menu .dropdown-item:hover,
html[data-theme="dark"] .navbar-user-menu .dropdown-item:focus,
html[data-theme="dark"] .navbar-theme-menu .dropdown-item:hover,
html[data-theme="dark"] .navbar-theme-menu .dropdown-item:focus,
html[data-theme="dark"] .navbar-theme-menu .dropdown-item.active,
html[data-theme="dark"] .navbar-theme-menu .dropdown-item[aria-checked="true"] {
    color: var(--text-default);
    background-color: var(--color-interactive-10);
}

.nav-link.dropdown-toggle,
.sim-navbar .navbar-nav .nav-link {
    font-weight: 400;
    font-size: var(--font-size, 0.875rem);
}



.button-wrapper, .toggle-button {
    background-color: var(--bs-primary);
    display: flex;
    justify-content: center;
    align-items: center;
    height: 44px;
    width: 44px;
}

.navbar-toggler-icon {
    background-image: url('data:image/svg+xml;utf8,<svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><rect x="4" y="6" width="16" height="2" fill="white"/><rect x="4" y="11" width="16" height="2" fill="white"/><rect x="4" y="16" width="16" height="2" fill="white"/></svg>');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 18px 18px;
    background-color: transparent;
    display: block;
    height: 18px;
    width: 18px;
    padding: 0;
}

.navbar-toggler-icon:hover {
    filter: brightness(1.1);
}


.sim-navbar .navbar-toggler {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--icon-target-min-size, 32px);
    height: var(--icon-target-min-size, 32px);
    margin-left: 0;
    margin-right: 12px;
    padding: 0;
    border: 0;
    background-color: transparent;
}

.sim-navbar .navbar-toggler:focus:not(:focus-visible),
.sim-navbar .navbar-toggler:active:not(:focus-visible),
.sim-navbar .navbar-toggler-icon:focus:not(:focus-visible) {
    outline: none;
    box-shadow: none;
}

.sim-navbar .navbar-nav .nav-link {
    position: relative;
    color: var(--text-default);
    font-size: var(--font-size, 0.875rem);
    line-height: 16px;
    text-transform: none;
    font-style: normal;
    font-weight: 400;
    white-space: nowrap;
}

.sim-navbar .navbar-nav .nav-link.dropdown:active {
    background-color: var(--bs-primary);
}

.sim-navbar .navbar-nav .nav-link:hover {
    color: var(--text-default);
}

.navbar-brand {
    font-style: normal;
    line-height: 19px;
    font-weight: 500;
    font-stretch: 151%;
    /* Keep the logo off the burger icon on mobile, matching the desktop spacing.
       The min-width:960px rule below overrides this with its own inline padding. */
    padding-left: 0.7em;
}

.ellipsis {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sticky-top {
    background-color: var(--navbar-background);
    overflow: visible;
    z-index: var(--sim-z-sticky-nav);
}

header.sticky-top {
    min-height: var(--sim-navbar-height);
    border-bottom: 1px solid var(--border-color-10);
}

.navbar.sticky-top {
    height: var(--sim-navbar-height);
}

.sticky-top ul {
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100%;
    color: var(--text-default);
}

li.nav-item {
    margin: 24px 0;
}


a.nav-link {
    font-family: "Roboto Flex", sans-serif;
    color: var(--text-default);
    font-size: var(--font-size, 0.875rem);
    line-height: 16px;
    text-transform: none;
    font-style: normal;
    font-weight: 500;
}

a.nav-link:hover {
    color: var(--bs-nav-link-hover-color);
    font-weight: 400;
    transition: color .3s ease;
}


a.nav-link.active {
    color: var(--bs-btn-hover-color);
    font-weight: 600;
}

a.nav-link.active:hover {
    text-decoration: none;
}

@media only screen and (min-width: 960px) {
    .sim-navbar .navbar-nav .nav-link {
        padding: 1em 0.7em;
    }

    .sim-navbar {
        padding: 0 0 0 16px;
    }

    .sim-navbar .navbar-brand {
        padding: 0 0.7em;
    }
}

.sim-navbar .navbar-nav .nav-link::after {
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    border: 0;
    background-color: var(--bs-primary);
    color: transparent;
    width: 0;
    content: '';
    height: 3px;
}

.sim-navbar .navbar-nav .nav-link:hover::after,
.sim-navbar .navbar-nav .nav-link:active::after,
.sim-navbar .navbar-nav .nav-link.active::after {
    width: 100%;
}


/* Nav drawer */

.offcanvas {
    --bs-offcanvas-width: var(--sim-nav-drawer-width);
    --sim-drawer-padding-inline: 8px;
    --sim-drawer-item-padding-inline-start: 8px;
    --sim-drawer-item-padding-inline-end: 32px;
    --sim-drawer-child-indent: 14px;
    --sim-drawer-top-level-font-weight: 600;
    --sim-drawer-page-font-weight: 400;
    top: calc(var(--sim-navbar-height) + var(--sim-navbar-gradient-height));
    z-index: var(--sim-z-nav-drawer);
    width: var(--sim-nav-drawer-width);
    max-width: min(var(--sim-nav-drawer-width), calc(100vw - 24px));
    background-color: white;
}

.offcanvas.offcanvas-start {
    top: calc(var(--sim-navbar-height) + var(--sim-navbar-gradient-height));
    bottom: 0;
    height: auto;
    z-index: var(--sim-z-nav-drawer);
}

.offcanvas.show {
    outline: none;
}


.offcanvas-body {
    padding: 16px var(--sim-drawer-padding-inline) 24px;
}

main[role="main"] > .container-fluid {
    transition: padding-left var(--sim-nav-drawer-transition);
}

#breadcrumbs > nav {
    transition:
        transform var(--sim-nav-drawer-transition),
        width var(--sim-nav-drawer-transition);
    will-change: transform;
}

@media (min-width: 992px) {
    html.sim-nav-drawer-open .offcanvas.offcanvas-start {
        transform: none;
        visibility: visible;
    }

    html.sim-nav-drawer-open main[role="main"] > .container-fluid {
        padding-left: calc(var(--sim-nav-drawer-width) + (var(--bs-gutter-x, 1.5rem) * .5));
    }

    html.sim-nav-drawer-open main[role="main"] > .container-fluid.landing-page-main {
        padding-left: calc(var(--bs-gutter-x, 1.5rem) * .5);
    }

    html.sim-nav-drawer-open #breadcrumbs > nav {
        transform: translateX(var(--sim-nav-drawer-width));
        width: calc(100% - var(--sim-nav-drawer-width));
    }
}

@media (prefers-reduced-motion: reduce) {
    main[role="main"] > .container-fluid,
    #breadcrumbs > nav {
        transition: none;
    }
}

.offcanvas a {
    color: var(--bs-nav-link-color);
    text-decoration: none;
    font-weight: 600;
}

.sidebar-nav {
    margin-top: 20px;
    padding: 0;
    list-style: none;
}

.side-nav {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    row-gap: 8px;
}

.side-nav__item,
.side-nav__child-item {
    margin: 0;
}

.side-nav__links {
    margin: 6px 0 8px;
    padding: 0;
    list-style: none;
    display: grid;
    row-gap: 2px;
}

.side-nav__separator {
    margin: 16px 0 8px;
    border-top: 1px solid var(--border-color-10);
}


.offcanvas-body .nav-link {
    margin-left: var(--sim-drawer-child-indent);
}

.offcanvas .btn-toggle.nav-button,
.offcanvas a.btn-toggle-nav.direct-link,
.offcanvas .btn-toggle-nav .nav-link {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    min-height: 31px;
    width: 100%;
    padding: 7px var(--sim-drawer-item-padding-inline-end) 7px var(--sim-drawer-item-padding-inline-start);
    border-radius: 4px;
    line-height: 1.2;
    text-align: left;
}

.offcanvas .btn-toggle.nav-button,
.offcanvas a.btn-toggle-nav.direct-link {
    font-weight: var(--sim-drawer-top-level-font-weight);
}

.offcanvas button.btn.btn-toggle.nav-button {
    border: 0;
    box-shadow: none;
}

.offcanvas .btn-toggle-nav .nav-link,
.offcanvas .btn-toggle-nav .nav-link.active {
    font-weight: var(--sim-drawer-page-font-weight);
}

.offcanvas .side-nav__links .nav-link {
    min-height: 29px;
    padding-top: 5px;
    padding-bottom: 5px;
}

.offcanvas .btn-toggle.nav-button::after {
    right: 12px;
}

.offcanvas .btn-toggle-nav .nav-link {
    width: calc(100% - var(--sim-drawer-child-indent));
}

.offcanvas button.btn.btn-toggle.nav-button.active {
    color: var(--bs-nav-link-color);
    background-color: transparent;
    border: 0;
    font-weight: var(--sim-drawer-top-level-font-weight);
}

.offcanvas a.btn-toggle-nav.direct-link.active {
    color: var(--sim-drawer-active-color);
    background-color: var(--sim-drawer-active-bg);
}

.offcanvas .btn-toggle-nav .nav-link.active {
    color: var(--sim-drawer-active-color);
    background-color: var(--sim-drawer-active-bg);
}

.offcanvas .side-nav a:not(.active):hover,
.offcanvas .side-nav a:not(.active):focus-visible {
    color: var(--text-default);
    background-color: var(--sim-drawer-hover-bg);
    text-decoration: none;
}

.offcanvas .btn-toggle.nav-button:hover {
    color: var(--text-default);
    background-color: transparent;
    text-decoration: none;
}

.offcanvas .btn-toggle.nav-button:focus,
.offcanvas .btn-toggle.nav-button:focus-visible {
    outline: 0;
    box-shadow: none;
}

.offcanvas .btn-toggle.nav-button:focus-visible {
    color: var(--text-default);
    background-color: transparent;
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 3px;
}


/* Body */

main, article, section {
    padding: 1em;
}

.col-sm {
    display: block;
    flex: 1 0;
    padding-left: 10px;
    padding-right: 10px
}


.text--center {
    text-align: center;
}

.feature-image {
    height: 200px;
    width: 200px;
    aspect-ratio: auto 200 / 200;
    margin-bottom: 1rem;
}

/* Filters */

.filter-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    border: 1px solid lightgray;
    padding: 30px 30px 30px 30px;
    background: var(--bs-white);
}

.filters {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.filter {
    display: flex;
    flex-direction: column;
}

.filter label {
    margin-bottom: 5px;
    display: flex;
    align-items: center; /* Aligns the text and checkmark vertically */
}

.checkmark {
    color: green;
    display: none; /* Hide checkmark by default */
    margin-left: 5px; /* Spacing between label text and checkmark */
}

.filter.applied .checkmark {
    display: inline; /* Show checkmark when filter is applied */
}

.reset-button {
    margin-left: auto;
}


.filters__items {
    margin: 0 0 0 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-bottom: .5rem;
}

.filters__subtitle {
    font-size: .875rem;
    color: rgba(0, 0, 0, 0.5);
    margin: 0;
    padding-right: 1rem;
    font-weight: 400;
    line-height: 1.2;
}

/* Cards */

.card {
    margin-top: var(--sim-page-content-gap);
    background-color: var(--white);
    border: var(--gray-20) 1px solid;
    border-radius: 0;
    text-align: left;
}

.card-body {
    background-color: var(--white);
    border: none;
}

.card-sim__category, .card-text {
    display: inline-block;
    font-size: .875rem;
    margin-top: 0;
    margin-right: .3125rem;
    margin-bottom: .4375rem;
    text-align: left;
}

.card-sim__category {
    font-weight: 700;
}

.card-sim__title {
    font-weight: 400;
    font-size: 1.25rem;
    line-height: 1.2;
    margin: 0 0 1rem;
    text-align: left;
}

.card-sim__body:hover, .card-sim__body:hover ~ .card-header {
    background-color: rgba(0, 0, 0, 0.05);
}

.card-body:hover > .subpage-navigation__link-arrow {
    background-color: var(--bs-primary);
}

.card-body:hover > .subpage-navigation__link-arrow > .arrow-icon,
.card-body:hover > .card-title,
.card-body:hover > p {
    transition: color 350ms ease, fill 350ms ease;

}

.card-body:hover > .subpage-navigation__link-arrow > .arrow-icon {
    fill: white;
}

.card-body .card-title {
    font-family: "Roboto Flex", sans-serif;
    font-size: 1rem;
}

.card-body:hover > .card-title, .card-body:hover > p {
    color: black;
}

.card-body:hover > p > .text-muted {
    color: white;
}

.card-text {
    display: -webkit-box;
    -webkit-line-clamp: 4;
    line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
}


.card.card-sim {
    float: left;
    text-align: center;
    display: none;
    overflow: hidden;
    width: 19rem;
    height: 16rem;
    margin: .5rem;
    padding-left: 0;
    padding-right: 0;
}

.disabled {
    text-decoration: none;
    opacity: 50%;
}

.card-body.card-sim__body {
    position: relative;
    height: 16rem;
}

.card-title.card-sim__category {
    font-weight: 700;
    font-size: .875rem;
}

.card-title.card-sim__title {
    font-weight: 400;
    font-size: 1.25rem;
}

.arrow-down-icon {
    margin-left: .875rem;
    width: .875rem;
    height: .625rem;
}

.catalog-page {
    --catalog-card-min-width: 22.5rem;
    --catalog-card-min-height: 176px;
    --catalog-card-padding: 20px;
    --catalog-card-arrow-size: 40px;
}

.catalog-page__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 18px;
}

.catalog-page__header h1 {
    margin-bottom: 8px;
}

.catalog-page__description {
    max-width: 72ch;
    margin-bottom: 0;
}

.catalog-page__action {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex: 0 0 auto;
    white-space: nowrap;
}

.catalog-page__action .material-symbols-outlined {
    font-size: 18px;
    line-height: 1;
}

.catalog-filter-panel {
    margin-top: 0;
}

.catalog-hero-search {
    width: min(760px, 100%);
    margin-top: var(--size-4, 14px);
}

.catalog-hero-search__control {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr) auto;
    align-items: center;
    min-height: 42px;
    overflow: hidden;
    color: var(--sim-muted);
    background: var(--sim-surface);
    border: 1px solid var(--sim-border-strong);
    border-radius: 4px;
}

.catalog-hero-search__control:focus-within {
    border-color: var(--sim-accent);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--sim-accent) 24%, transparent);
}

.catalog-hero-search__control > .material-symbols-outlined {
    justify-self: center;
    font-size: 19px;
}

.catalog-hero-search__control input {
    min-width: 0;
    height: 40px;
    padding: 0 12px 0 0;
    color: var(--sim-text);
    background: transparent;
    border: 0;
    outline: 0;
}

.catalog-page .catalog-hero-search__control input:focus,
.catalog-page .catalog-hero-search__control input:focus-visible {
    outline: 0;
    box-shadow: none;
}

.catalog-hero-search__control > .catalog-hero-search__submit {
    align-self: stretch;
    padding: 0 16px;
    color: var(--sim-action-text, var(--white));
    background: var(--sim-action-bg, var(--sim-accent));
    border: 0;
    font-size: var(--font-size-sm, 13px);
    font-weight: var(--font-weight-bold, 500);
}

.catalog-hero-search__control > .catalog-hero-search__submit:hover,
.catalog-hero-search__control > .catalog-hero-search__submit:focus-visible {
    background: var(--sim-accent-strong);
}

.catalog-filter__toolbar {
    display: flex;
    align-items: center;
    gap: 10px;
}

.catalog-filter__label {
    margin: 0;
    color: var(--text-muted, var(--gray-70));
    font-size: var(--font-size, 0.875rem);
    font-weight: 500;
    line-height: 1.2;
}

.catalog-filter__toggle {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.catalog-filter__chevron {
    font-size: 18px;
    line-height: 1;
    transition: transform .2s ease;
}

.catalog-filter__toggle[aria-expanded="true"] .catalog-filter__chevron {
    transform: rotate(180deg);
}

.catalog-filter__options {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-top: 12px;
}

.catalog-filter__options[hidden],
.catalog-filter__description[hidden] {
    display: none;
}

.catalog-filter__empty-toggle {
    padding-inline: 4px;
    color: var(--bs-link-color);
    text-decoration: none;
}

.catalog-filter__empty-toggle:hover,
.catalog-filter__empty-toggle:focus {
    color: var(--bs-link-hover-color);
    text-decoration: underline;
}

.catalog-filter__descriptions {
    max-width: 80ch;
    margin-top: 10px;
}

.catalog-filter__description {
    margin: 0;
    color: var(--text-muted, var(--gray-70));
    line-height: 1.42;
}

.catalog-domain-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, var(--catalog-card-min-width)), 1fr));
    gap: 20px;
    align-items: stretch;
    justify-content: stretch;
    margin-top: 20px;
}

.catalog-domain-grid > .catalog-card.card.card-sim {
    display: block;
    float: none;
    width: auto;
    height: auto;
    min-height: var(--catalog-card-min-height);
    margin: 0;
    overflow: hidden;
    text-align: left;
    border: 1px solid var(--border-color-10, var(--gray-20));
    border-radius: 4px;
    background-color: var(--surface-level-1, var(--white));
}

.catalog-domain-grid > .catalog-card.card.card-sim[hidden] {
    display: none;
}

.catalog-card__link {
    display: flex;
    min-height: var(--catalog-card-min-height);
    color: inherit;
    text-decoration: none;
}

.catalog-card__link:hover,
.catalog-card__link:focus {
    color: inherit;
    text-decoration: none;
}

.catalog-card__link:focus-visible {
    outline: 2px solid var(--color-focus-10, var(--green-70));
    outline-offset: -2px;
}

.catalog-card__link.is-disabled {
    cursor: default;
    opacity: .55;
}

.catalog-card__body.card-sim__body {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: var(--catalog-card-min-height);
    height: auto;
    width: 100%;
    padding: var(--catalog-card-padding);
    background-color: var(--surface-level-1, var(--white));
    transition: background-color .18s ease;
}

.catalog-card__link:not(.is-disabled):hover .catalog-card__body,
.catalog-card__link:not(.is-disabled):focus .catalog-card__body {
    background-color: var(--sim-list-item-hover-bg);
}

.catalog-card__category.card-sim__category {
    margin: 0 0 6px;
    padding-right: calc(var(--catalog-card-arrow-size) + 10px);
    color: var(--text-muted, var(--gray-70));
    font-size: 12px;
    font-weight: 600;
    line-height: 1.2;
}

.catalog-card__title.card-sim__title {
    margin: 0 0 10px;
    padding-right: calc(var(--catalog-card-arrow-size) + 10px);
    color: var(--text-default, var(--gray-100));
    font-size: 18px;
    font-weight: 500;
    line-height: 1.25;
}

.catalog-card__text.card-sim__text {
    display: -webkit-box;
    max-width: 72ch;
    margin: 0;
    overflow: hidden;
    color: var(--text-muted, var(--gray-70));
    font-size: var(--font-size, 0.875rem);
    line-height: 1.42;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    line-clamp: 4;
}

.catalog-card__meta {
    display: inline-flex;
    align-items: center;
    align-self: flex-start;
    margin-top: auto;
    padding-top: 12px;
    color: var(--text-muted, var(--gray-70));
    font-size: var(--font-size-sm, 12px);
    font-weight: var(--font-weight-bold, 500);
    line-height: 1.2;
}

.catalog-card__meta strong {
    color: var(--text-default, var(--gray-100));
    font-weight: var(--font-weight-bolder, 600);
}

.api-catalog-empty-state {
    margin-top: var(--size-4, 14px);
}

.catalog-domain-grid .catalog-card__arrow.subpage-navigation__link-arrow {
    position: absolute;
    top: var(--catalog-card-padding);
    right: var(--catalog-card-padding);
    bottom: auto;
    width: var(--catalog-card-arrow-size);
    height: var(--catalog-card-arrow-size);
    color: var(--sim-action-bg, var(--bs-primary));
    background-color: transparent;
    border-radius: 4px;
    opacity: 1;
    transition: background-color .18s ease, color .18s ease, box-shadow .18s ease;
}

.catalog-domain-grid .catalog-card__link:not(.is-disabled):hover .catalog-card__arrow,
.catalog-domain-grid .catalog-card__link:not(.is-disabled):focus .catalog-card__arrow {
    color: var(--sim-action-text, var(--white));
    background-color: var(--sim-action-bg, var(--bs-primary));
    box-shadow: 0 6px 14px rgba(15, 64, 53, .18);
}

.catalog-card__arrow .material-symbols-outlined {
    font-size: 20px;
    line-height: 1;
}

@media (max-width: 767.98px) {
    .catalog-domain-grid {
        grid-template-columns: 1fr;
    }

    .catalog-page__header {
        display: block;
    }

    .catalog-page__action {
        margin-top: 12px;
    }
}


/* Accordion */

.accordion-button {
    transition: opacity 150ms ease-in-out;
    color: inherit;
}

.accordion-button:not(.collapsed) {
    background-color: inherit;
}

.accordion-button:hover {
    transition: color 300ms ease;
    color: var(--bs-link-hover-color);
}

.accordion-button:focus {
    box-shadow: none;
}

.accordion-item {
    background-color: inherit;
    border: none;
    border-top: 1px solid;
    border-bottom: 1px solid;
}

.accordion-body {
    padding: 1.5rem 0;
}


/* Dropdown */

a.dropdown-item,
a.dropdown-item:active,
a.dropdown-item:hover {
    font-size: var(--font-size, 0.875rem);
}

a.dropdown-item:active {
    background-color: #f8f9fa;
}

a.dropdown-item:hover {
    transition: all .3s ease;
    color: var(--bs-link-hover-color);
    background-color: #fff;
}


/* Buttons */
/* General Button Styles */


button,
[type="button"],
[type="reset"],
[type="submit"],
.btn {
    -webkit-user-select: none;
    user-select: none;
    padding: 8px 16px;
    border-radius: 2px;
    color: var(--bs-black);
    font-weight: 500;
    transition: .1s ease;
    display: inline-flex;
    box-sizing: border-box;
    align-items: center;
    justify-content: center;
    gap: 8px;
    cursor: pointer;
}

/* Focus State for Buttons */

.offcanvas-start.show .btn-toggle:focus {
    box-shadow: none;
}


/* Primary Button Styles */

.btn-primary,
.button.button,
.primaryAction {
    font-family: "Roboto Flex", sans-serif;
    font-size: var(--font-size, 14px);
    line-height: 16px;
    min-height: var(--components-min-height, 32px);
    padding: var(--padding-s, 6px) var(--padding-l, 12px);
    transition: background-color .16s ease, border-color .16s ease, color .16s ease;
    --bs-btn-hover-color: var(--text-on-interactive-40);
    --bs-btn-hover-bg: var(--color-interactive-40);
    --bs-btn-hover-border-color: var(--color-interactive-40);
    --bs-btn-active-color: var(--text-on-interactive-50);
    --bs-btn-active-bg: var(--color-interactive-50);
    --bs-btn-active-border-color: var(--color-interactive-50);
    border: var(--border-width-10, 1px) solid var(--color-interactive-30);
    border-radius: var(--radius-default, 4px);
    cursor: pointer;
    background-color: var(--color-interactive-30);
    color: var(--text-on-interactive-30);
    font-weight: 500;
    text-decoration: none;
}

.btn-secondary,
.btn-outline-primary,
.btn-outline-secondary,
.btn-outline-info,
.secondaryAction,
.btn-filter,
.sim-secondary-action,
.catalog-action,
.sim-detail-admin-action,
.sim-detail-download {
    font-family: "Roboto Flex", sans-serif;
    font-size: var(--font-size, 14px);
    line-height: 16px;
    min-height: var(--components-min-height, 32px);
    padding: var(--padding-s, 6px) var(--padding-l, 12px);
    transition: background-color .16s ease, border-color .16s ease, color .16s ease;
    --bs-btn-hover-color: var(--text-brand);
    --bs-btn-hover-bg: var(--color-interactive-10);
    --bs-btn-hover-border-color: var(--color-interactive-40);
    --bs-btn-active-color: var(--text-default);
    --bs-btn-active-bg: var(--color-interactive-20);
    --bs-btn-active-border-color: var(--color-interactive-50);
    border: var(--border-width-10, 1px) solid var(--color-interactive-30);
    border-radius: var(--radius-default, 4px);
    cursor: pointer;
    background-color: transparent;
    color: var(--text-brand);
    font-weight: 500;
    text-decoration: none;
}

.btn-tertiary,
.btn-link {
    font-family: "Roboto Flex", sans-serif;
    font-size: var(--font-size, 14px);
    line-height: 16px;
    min-height: var(--components-min-height, 32px);
    padding: var(--padding-s, 6px) var(--padding-l, 12px);
    --bs-btn-hover-color: var(--text-brand);
    --bs-btn-hover-bg: var(--color-interactive-10);
    --bs-btn-hover-border-color: transparent;
    --bs-btn-active-color: var(--text-default);
    --bs-btn-active-bg: var(--color-interactive-20);
    --bs-btn-active-border-color: transparent;
    color: var(--text-brand);
    background-color: transparent;
    border: var(--border-width-10, 1px) solid transparent;
    border-radius: var(--radius-default, 4px);
    text-decoration: none;
}

.btn-negative {
    --bs-btn-hover-color: var(--text-negative);
    --bs-btn-hover-bg: var(--color-negative-10);
    --bs-btn-hover-border-color: var(--color-negative-40);
    --bs-btn-active-color: var(--text-default);
    --bs-btn-active-bg: var(--color-negative-20);
    --bs-btn-active-border-color: var(--color-negative-50);
    color: var(--text-negative);
    background-color: transparent;
    border-color: var(--color-negative-30);
}

.btn-primary:focus,
.button.button:focus,
.primaryAction:focus {
    color: var(--text-on-interactive-30);
    background-color: var(--color-interactive-30);
    border-color: var(--color-interactive-30);
}

.btn-secondary:focus,
.btn-outline-primary:focus,
.btn-outline-secondary:focus,
.btn-outline-info:focus,
.secondaryAction:focus,
.btn-filter:focus,
.sim-secondary-action:focus,
.catalog-action:focus,
.sim-detail-admin-action:focus,
.sim-detail-download:focus {
    color: var(--text-brand);
    background-color: transparent;
    border-color: var(--color-interactive-30);
    text-decoration: none;
}

.btn-tertiary:focus,
.btn-link:focus {
    color: var(--text-brand);
    background-color: transparent;
    border-color: transparent;
    text-decoration: none;
}

.btn-negative:focus {
    color: var(--text-negative);
    background-color: transparent;
    border-color: var(--color-negative-30);
}

/* Hover States */

.btn-primary:hover,
.button.button:hover,
.primaryAction:hover {
    color: var(--text-on-interactive-40);
    background-color: var(--color-interactive-40);
    border-color: var(--color-interactive-40);
}

.btn-secondary:hover,
.btn-outline-primary:hover,
.btn-outline-secondary:hover,
.btn-outline-info:hover,
.secondaryAction:hover,
.btn-filter:hover,
.sim-secondary-action:hover,
.sim-secondary-action[aria-expanded="true"],
.catalog-action:hover,
.sim-detail-admin-action:hover,
.sim-detail-download:hover {
    color: var(--text-brand);
    background-color: var(--color-interactive-10);
    border-color: var(--color-interactive-40);
    text-decoration: none;
}

.btn-primary:active,
.button.button:active,
.primaryAction:active {
    color: var(--text-on-interactive-50);
    background-color: var(--color-interactive-50);
    border-color: var(--color-interactive-50);
}

.btn-secondary:active,
.btn-outline-primary:active,
.btn-outline-secondary:active,
.btn-outline-info:active,
.secondaryAction:active,
.btn-filter.active,
.btn-filter[aria-expanded="true"],
.sim-secondary-action:active,
.catalog-action:active,
.sim-detail-admin-action:active,
.sim-detail-download:active {
    color: var(--text-default);
    background-color: var(--color-interactive-20);
    border-color: var(--color-interactive-50);
}

.btn-tertiary:hover,
.btn-link:hover {
    color: var(--text-brand);
    background-color: var(--color-interactive-10);
    text-decoration: none;
}

.btn-tertiary:active,
.btn-link:active {
    color: var(--text-default);
    background-color: var(--color-interactive-20);
}

.btn-negative:hover {
    color: var(--text-negative);
    background-color: var(--color-negative-10);
    border-color: var(--color-negative-40);
}

.btn-negative:active {
    color: var(--text-default);
    background-color: var(--color-negative-20);
    border-color: var(--color-negative-50);
}

.btn-primary:disabled,
.btn-primary.disabled,
.button.button:disabled,
.button.button.disabled,
.primaryAction:disabled,
.btn-secondary:disabled,
.btn-secondary.disabled,
.btn-outline-primary:disabled,
.btn-outline-secondary:disabled,
.btn-outline-info:disabled,
.secondaryAction:disabled,
.btn-filter:disabled,
.sim-secondary-action:disabled,
.sim-secondary-action.disabled,
.catalog-action:disabled,
.catalog-action.disabled,
.catalog-action[aria-disabled="true"],
.sim-detail-admin-action:disabled,
.sim-detail-admin-action.disabled,
.sim-detail-admin-action[aria-disabled="true"],
.sim-detail-download:disabled,
.sim-detail-download.disabled,
.sim-detail-download[aria-disabled="true"],
.btn-tertiary:disabled,
.btn-tertiary.disabled,
.btn-link:disabled,
.btn-link.disabled,
.btn-negative:disabled,
.btn-negative.disabled {
    color: var(--text-disabled);
    background-color: var(--color-disabled-10);
    border-color: var(--color-disabled-20);
    cursor: not-allowed;
    text-decoration: none;
}

.btn-secondary:disabled,
.btn-secondary.disabled,
.btn-outline-primary:disabled,
.btn-outline-secondary:disabled,
.btn-outline-info:disabled,
.secondaryAction:disabled,
.btn-filter:disabled,
.sim-secondary-action:disabled,
.sim-secondary-action.disabled,
.catalog-action:disabled,
.catalog-action.disabled,
.catalog-action[aria-disabled="true"],
.sim-detail-admin-action:disabled,
.sim-detail-admin-action.disabled,
.sim-detail-admin-action[aria-disabled="true"],
.sim-detail-download:disabled,
.sim-detail-download.disabled,
.sim-detail-download[aria-disabled="true"],
.btn-tertiary:disabled,
.btn-tertiary.disabled,
.btn-link:disabled,
.btn-link.disabled,
.btn-negative:disabled,
.btn-negative.disabled {
    background-color: transparent;
}

button:focus-visible,
[type="button"]:focus-visible,
[type="reset"]:focus-visible,
[type="submit"]:focus-visible,
.btn:focus-visible,
.catalog-action:focus-visible,
.sim-detail-admin-action:focus-visible,
.sim-detail-download:focus-visible {
    outline: var(--outline-width, 2px) solid var(--outline-color, var(--color-focus-10));
    outline-offset: var(--outline-offset, 2px);
    box-shadow: none;
}

:is(
    .btn-primary,
    .btn-secondary,
    .btn-outline-primary,
    .btn-outline-secondary,
    .btn-outline-info,
    .primaryAction,
    .secondaryAction,
    .btn-tertiary,
    .btn-link,
    .btn-negative,
    .sim-secondary-action
) .material-symbols-outlined {
    width: 18px;
    height: 18px;
    font-size: 18px;
    line-height: 1;
}

/* Filter Button Specifics */

/* Toggle Button Specifics */

.btn-toggle {
    display: inline-block;
    align-items: center;
    padding: 0;
    font-weight: 600;
    background-color: transparent;
    color: var(--bs-nav-link-color);
    position: relative;
    width: 100%;
    text-align: left;
    font-size: 1em;
}

.btn-toggle::after, .btn-toggle[aria-expanded="true"]::after {
    transition: transform .35s ease;
}

html.sim-nav-init .btn-toggle::after,
html.sim-nav-init .btn-toggle[aria-expanded="true"]::after,
html.sim-nav-init #offcanvasScrolling,
html.sim-nav-init #offcanvasScrolling .collapse,
html.sim-nav-init #offcanvasScrolling .collapsing {
    transition: none;
}


.btn-toggle::after {
    content: "";
    position: absolute;
    right: 0;
    width: 1em;
    height: 1em;
    line-height: 0;
    background-color: currentColor;
    transition: transform .35s ease;
    transform-origin: .5em 50%;
    -webkit-mask: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 14l6-6-6-6'/%3e%3c/svg%3e") center / 1em 1em no-repeat;
    mask: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 14l6-6-6-6'/%3e%3c/svg%3e") center / 1em 1em no-repeat;
}


.btn-toggle[aria-expanded="true"]::after {
    transform: rotate(90deg);
}


/* Body */

body {
    display: flex;
    min-height: 100vh;
    flex-direction: column;
    clear: both;
    font-size: var(--body-font-base-size);
    font-family: "Roboto Flex", sans-serif;
    background-color: var(--neutral-1);
}

/* Consolidate anchor tag styles and override specific properties as needed */

body a, .site-footer a {
    color: var(--bs-link-color);
    text-decoration: underline;
    font-style: normal;
    font-weight: bold;
}

tbody a, .site-footer a {
    text-decoration: none;
}

footer a {
    color: white;
    text-transform: none;
    font-weight: bold;
}

footer a:hover {
    color: var(--bs-primary);
    transition: all .3s ease;
}

/* Use inheritance for font-family where possible instead of repeating */

body, body p, .site-footer {
    font-family: "Roboto Flex", sans-serif;
}

/* Styles for other elements */

body p {
    display: inline-block;
    font-style: normal;
    font-weight: normal;
}

footer {
    margin-top: auto;
}

.site-footer {
    background-color: var(--bs-gray-100);
    color: #595959;
    border-top: 1px solid #EBEBEB;
}


input {
    background: #FFFFFF;
    border: 1px solid #CCCCCC;
    box-sizing: border-box;
    border-radius: 4px;
}

input:focus {
    outline: none;
}


html:not(.sim-edit-mode) .edit {
    display: none;
}

#editModeToggle[aria-pressed="true"] {
    color: var(--text-default);
    background-color: var(--color-interactive-20);
}

#editModeToggle[aria-pressed="true"]::after {
    width: 100%;
}

.row {
    --bs-gutter-x: 1rem;
    --bs-gutter-y: 1;
    display: flex;
    flex-wrap: wrap;
    margin-right: calc(var(--bs-gutter-x) / -2);
    margin-left: calc(var(--bs-gutter-x) / -2);
    justify-content: left;
}

.attribute > .row {
    margin-right: 0;
    margin-left: 0;
}

.col, .col-auto {
    flex: 1;
    padding-right: calc(var(--bs-gutter-x) / 2);
    padding-left: calc(var(--bs-gutter-x) / 2);
    border: none;
}

.col-empty, .col:empty, [class^="col-"]:empty {
    display: none;
}

.vertical-right-aligned {
    transform-origin: 100% 100%;
    position: absolute;
    right: 0;
    bottom: 55px;
    z-index: 100;
    color: white;
}

#feedback-btn:hover {
    color: white;
}

.alert-primary, .alert-warning, .alert-danger, .alert-success {
    border-radius: 0;
    border: none;
}

.alert-success {
    background-color: #F5FDF8;
}

.sim-inline-notification {
    --sim-notification-accent: var(--text-info);
    display: flex;
    gap: var(--size-3, 8px);
    align-items: flex-start;
    padding: var(--size-3, 8px) var(--size-4, 12px);
    color: var(--text-default);
    background-color: var(--color-info-10);
    border: 1px solid var(--color-info-20);
    border-inline-start: 4px solid var(--sim-notification-accent);
    border-radius: 2px;
}

.sim-inline-notification--error {
    --sim-notification-accent: var(--text-negative);
    background-color: var(--color-negative-10);
    border-color: var(--color-negative-20);
    border-inline-start-color: var(--sim-notification-accent);
}

.sim-inline-notification__icon {
    flex: 0 0 auto;
    color: var(--sim-notification-accent);
    font-size: var(--icon-iconSize4, 18px);
}

.sim-inline-notification .errorlist {
    margin: 0;
    padding-left: var(--size-5, 16px);
}

.sim-loading-state {
    display: flex;
    min-height: 48px;
    align-items: center;
    justify-content: center;
}

.sim-spinner {
    --bs-spinner-width: 24px;
    --bs-spinner-height: 24px;
    --bs-spinner-border-width: 2px;
    color: var(--color-interactive-30);
}

.sim-spinner--small {
    --bs-spinner-width: 16px;
    --bs-spinner-height: 16px;
}

.sim-toast-region {
    z-index: var(--bs-toast-zindex, 1090);
}

.sim-toast {
    --sim-toast-accent: var(--text-info);
    color: var(--text-default);
    background-color: var(--surface-level-1);
    border-color: var(--border-color-10);
    border-inline-start: 4px solid var(--sim-toast-accent);
}

.sim-toast--success {
    --sim-toast-accent: var(--text-positive);
}

.sim-toast--warning {
    --sim-toast-accent: var(--text-warning);
}

.sim-toast--error {
    --sim-toast-accent: var(--text-negative);
}

html[data-theme="dark"] .sim-toast {
    border-inline-start-color: var(--sim-toast-accent);
}

.sim-toast .toast-header {
    color: inherit;
    background-color: inherit;
    border-color: var(--border-color-10);
}

.sim-toast__icon {
    color: var(--sim-toast-accent);
    font-size: var(--icon-iconSize4, 18px);
}

.sim-toast .btn-close {
    width: var(--icon-target-min-size, 32px);
    height: var(--icon-target-min-size, 32px);
    padding: 0;
    border-radius: var(--radius-default, 4px);
    background-color: transparent;
    background-image: var(--bs-btn-close-bg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 1em auto;
}

.sim-toast .btn-close:hover,
.sim-toast .btn-close:focus {
    background-color: var(--color-interactive-10);
}

.sim-toast .btn-close:active {
    background-color: var(--color-interactive-20);
}

[data-theme="dark"] .sim-toast .btn-close {
    filter: var(--bs-btn-close-white-filter);
}

div#getting-started p {
    margin-left: 1em;
}

.table thead th {
    vertical-align: bottom;
    border-top: 1px solid #dee2e6;
    border-bottom: 2px solid #dee2e6;
    font-family: "Roboto Flex", sans-serif;
}

.table-dark {
    --bs-table-bg: #011946;
}


.table th {
    color: var(--bs-table-color);
    background-color: var(--bs-table-accent-bg);
}

.table {
    --bs-table-color-type: #000000;
    --bs-table-bg-type: initial;
    --bs-table-color-state: initial;
    --bs-table-bg-state: initial;
    --bs-table-color: var(--text-default, #000000);
    --bs-table-bg: var(--neutral-1);
    --bs-table-border-color: #BEBEBE;
    --bs-table-accent-bg: transparent;
    --bs-table-striped-color: var(--text-default, #000000);
    --bs-table-striped-bg: rgba(0, 0, 0, .04);
    --bs-table-active-color: var(--text-default, #000000);
    --bs-table-active-bg: rgba(0, 0, 0, .08);
    --bs-table-hover-color: var(--text-default, #000000);
    --bs-table-hover-bg: var(--datatable-row-hover-bg, rgba(0, 0, 0, .06));
}


/* Base styles for anchor tags */

a {
    font-family: "Roboto Flex", sans-serif;
    color: #011946;
    transition: color .3s ease; /* Apply transitions to color changes */
}

:is(a, button, .btn, [role="button"]):has(.material-symbols-outlined):hover,
:is(a, button, .btn, [role="button"]):has(.material-symbols-outlined):focus {
    text-decoration: none;
}


.mx-auto {
    position: relative;
    margin-top: 54px;
    width: 425px;
    max-width: calc(100% - 2rem);
    background-color: var(--bs-primary);
    border-radius: 4px;
}

.mx-auto::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    height: 5px;
    width: 100%;
    background: url("../img/LIVE_Gradient-1_Wide.3a9631d9df7e.svg");
    background-size: cover;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
}


/* Pagination */


#filter-container {
    width: 100%;
    display: none;
}

#toggle-empty {
    margin: 10px;
}

#filter-descriptions {
    width: 100%;
    padding-top: .5rem;
    padding-bottom: .5rem;
    display: none;
}

.filter-description {
    display: none;
    overflow: hidden;
}

.row.g-1 {
    margin-top: 1rem;
}


.filter-dropdown-toggle > .arrow-down-icon {
    transition: all 0.3s ease;
    transform: rotate(180deg);
}

.filter-dropdown-toggle[aria-expanded="true"] > .arrow-down-icon {
    transform: rotate(0deg);
}


.subpage-navigation__link-arrow {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 4rem;
    height: 4rem;
    position: absolute;
    right: 0;
    bottom: 0;
}

.subpage-navigation__link-arrow .arrow-icon {
    width: 1.125rem;
    height: .875rem;
    overflow: visible;
}

.subpage-navigation__link:hover .arrow-icon {
    fill: #fff;
}

.container {
    overflow: hidden;
}

.show {
    display: block;
}

.hide {
    visibility: collapse;
}

/* Release status banners */

.release-status-banners {
    display: grid;
    gap: 6px;
    margin: var(--sim-page-content-gap) 0 0;
}

.release-status-banner {
    --release-status-bg: #fbfcfc;
    --release-status-border: #dde5e6;
    --release-status-accent: var(--color-link-10, #3b6366);
    --release-status-icon-bg: transparent;
    --release-status-badge-bg: rgba(59, 99, 102, .07);
    --release-status-title: var(--text-default, #191919);
    --release-status-muted: var(--text-muted, #595959);
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    gap: 8px;
    align-items: center;
    min-height: 32px;
    padding: 6px 10px 6px 9px;
    color: var(--release-status-title);
    background: var(--release-status-bg);
    border: 1px solid var(--release-status-border);
    box-shadow: inset 2px 0 0 var(--release-status-accent);
    border-radius: 4px;
}

.release-status-banner--pre-alpha {
    --release-status-accent: #8a5a00;
    --release-status-badge-bg: rgba(138, 90, 0, .08);
}

.release-status-banner--alpha {
    --release-status-accent: #8a5a00;
    --release-status-badge-bg: rgba(138, 90, 0, .08);
}

.release-status-banner--beta {
    --release-status-accent: var(--color-link-10, #3b6366);
    --release-status-badge-bg: rgba(59, 99, 102, .08);
}

.release-status-banner--deprecated {
    --release-status-accent: var(--gray-60, #737373);
    --release-status-badge-bg: rgba(115, 115, 115, .08);
}

.release-status-banner--hidden {
    --release-status-accent: #8f4a5a;
    --release-status-badge-bg: rgba(143, 74, 90, .08);
}

html[data-theme="dark"] .release-status-banner {
    --release-status-bg: #181818;
    --release-status-border: #333333;
    --release-status-accent: #48B8BC;
    --release-status-badge-bg: rgba(72, 184, 188, .1);
    --release-status-title: var(--text-default, #fafafa);
    --release-status-muted: #c9c9c9;
}

html[data-theme="dark"] .release-status-banner--pre-alpha {
    --release-status-accent: #d8b04c;
    --release-status-badge-bg: rgba(216, 176, 76, .11);
}

html[data-theme="dark"] .release-status-banner--alpha {
    --release-status-accent: #d8b04c;
    --release-status-badge-bg: rgba(216, 176, 76, .11);
}

html[data-theme="dark"] .release-status-banner--beta {
    --release-status-accent: #48B8BC;
    --release-status-badge-bg: rgba(72, 184, 188, .12);
}

html[data-theme="dark"] .release-status-banner--deprecated {
    --release-status-accent: var(--text-muted, #bebebe);
    --release-status-badge-bg: rgba(190, 190, 190, .1);
}

html[data-theme="dark"] .release-status-banner--hidden {
    --release-status-accent: #d98293;
    --release-status-badge-bg: rgba(217, 130, 147, .11);
}

.release-status-banner__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    color: var(--release-status-accent);
    background: var(--release-status-icon-bg);
    border-radius: 4px;
}

.release-status-banner__icon .material-symbols-outlined {
    font-size: 17px;
    line-height: 1;
}

.release-status-banner__body {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 3px 9px;
    min-width: 0;
}

.release-status-banner__eyebrow {
    display: none;
}

.release-status-banner__heading {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    flex: 0 0 auto;
    gap: 6px;
}

.release-status-banner__title {
    margin: 0;
    color: var(--release-status-title);
    font-size: var(--font-size-sm, 13px);
    font-weight: var(--font-weight-bolder, 600);
    line-height: 1.25;
}

.release-status-banner__status {
    display: inline-flex;
    align-items: center;
    min-height: 17px;
    padding: 1px 5px;
    color: var(--release-status-accent);
    background: var(--release-status-badge-bg);
    border: 0;
    border-radius: 4px;
    font-size: var(--font-size-xs, 11px);
    font-weight: var(--font-weight-bold, 500);
    line-height: 1.2;
}

.release-status-banner__text {
    flex: 1 1 320px;
    max-width: none;
    margin: 0;
    color: var(--release-status-muted);
    font-size: var(--font-size-sm, 13px);
    line-height: var(--line-height, 1.42);
}

html[data-theme="dark"] .release-status-banner__text {
    color: var(--release-status-muted);
}

@media (max-width: 576px) {
    .release-status-banner {
        grid-template-columns: 18px minmax(0, 1fr);
        padding: 6px 9px;
    }
}


/* Breadcrumb */

#breadcrumbs {
    height: var(--sim-breadcrumb-height);
    color: var(--text-default);
    background-color: var(--surface-level-1);
    border-bottom: 1px solid var(--border-color-10);
    padding-bottom: 0;
    overflow: visible;
}

#home-breadcrumb {
    font-size: 16px;
    margin-left: 0;
    margin-right: 4px;
}

nav[aria-label="breadcrumb"] {
    display: flex;
    align-items: center;
    height: var(--sim-breadcrumb-row-height);
    padding: 0 16px;
}

.breadcrumb {
    align-items: center;
    margin-bottom: 0;
    font-size: 13px;
    line-height: 1.2;
}

.breadcrumb-item i {
    align-content: center;
    padding-right: 6px;
    padding-left: 16px;
    vertical-align: 0;
}

.breadcrumb-item a {
    color: var(--text-brand);
    text-decoration: none;
}

.breadcrumb-item a:hover,
.breadcrumb-item a:focus {
    color: var(--text-brand);
    text-decoration: none;
}

.breadcrumb-item.active {
    color: var(--text-muted);
}


main {
    display: flex;
    flex-wrap: nowrap;
    height: -webkit-fill-available;
    overflow-x: auto;
    overflow-y: hidden;
    padding-bottom: 150px;
}

@media (min-width: 90rem) {
    main:has(.sim-detail-page) {
        overflow-x: clip;
        overflow-y: visible;
    }
}


.bi {
    vertical-align: -.125em;
    pointer-events: none;
}

.dropdown-toggle {
    outline: none;
}

.nav-flush .nav-link {
    border-radius: 0;
}

.nav a {
    text-decoration: none;
}

.scrollarea {
    overflow-y: auto;
}

.fw-semibold {
    font-weight: 600;
}

.lh-tight {
    line-height: 1.25;
}


.select {
    padding: 0.375rem 0.75rem;
    border: 1px solid #ccc;
    border-radius: 0.25rem;
    color: #000;
    font-size: 16px;
    appearance: none;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' fill='black' viewBox='0 0 512 512'><path d='M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z'/></svg>");
    background-repeat: no-repeat;
    background-position: right 8px center;
    background-size: 12px;
    line-height: 1.5;
}

.light .select {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' fill='black' viewBox='0 0 512 512'><path d='M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z'/></svg>")
}

html[data-theme="dark"] .select {
    color: var(--text-default);
    background-color: var(--color-input-10);
    border-color: var(--border-color-10);
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 512 512'><path d='M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z'/></svg>");
}

div#sim_detail_table_paginate {
    display: flex;
    gap: 8px;
    align-items: center;
}

.paginate_button {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 8px;
    min-width: 34px;
    height: 34px;
}

.paginator-selector {
    all: unset;
    transition: .1s ease;
    padding: 8px 28px 8px 8px;
    border: 1px solid var(--steel-60);
    border-radius: 2px;
    box-sizing: border-box;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 512 512'><path d='M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z'/></svg>");
    color: var(--white);
    font-size: inherit;
    appearance: none;
    background-repeat: no-repeat;
    background-position: right 8px top 50%;
    background-size: 12px;
    background-color: var(--steel-90);
}

.page-item.active .page-link {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0;
    min-width: 34px;
    height: 34px;
    box-sizing: border-box;
    -webkit-user-select: none;
    user-select: none;
    font-size: var(--font-size, 0.875rem);
    color: var(--white);
    background-color: var(--green-70)
}

.page-link {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0;
    min-width: 34px;
    height: 34px;
    box-sizing: border-box;
    -webkit-user-select: none;
    user-select: none;
    font-size: var(--font-size, 0.875rem);
    color: var(--gray-90);
    background-color: var(--white)
}

/* put everything in div class="bottom" on a single line */
.bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1rem;
    margin-top: 1rem;
    margin-bottom: 1rem;
}

:is(.standard-container, .standard-fluid-container, .standard-filter-container) {
    --standard-container-padding-block: 20px;
    --standard-container-padding-inline: 20px;
    --standard-container-header-title-inset: .5rem;
    --standard-container-header-title-color: var(--text-default, var(--gray-100));
    --standard-container-header-muted-color: var(--text-muted, var(--gray-70));
    --standard-container-header-accent: var(--sim-action-bg, var(--color-interactive-30, var(--green-70)));
    border: var(--gray-20) 1px solid;
    margin-top: var(--sim-page-content-gap);
    background-color: var(--white);
    padding: var(--standard-container-padding-block) var(--standard-container-padding-inline);
    border-radius: 4px;
}

:is(.standard-container, .standard-fluid-container, .standard-filter-container) > :is(.standard-container__header, .standard-fluid-container__header, .standard-filter-container__header) {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--size-3, 11px);
    margin: calc(var(--standard-container-padding-block) * -.5) calc(var(--standard-container-padding-inline) * -1) 1rem;
    padding: 0 var(--standard-container-padding-inline) 0 0;
    border: 0;
}

:is(.standard-container__heading, .standard-fluid-container__heading, .standard-filter-container__heading) {
    min-width: 0;
}

:is(.standard-container__header, .standard-fluid-container__header, .standard-filter-container__header) :is(.standard-container__title, .standard-fluid-container__title, .standard-filter-container__title) {
    display: inline-flex;
    align-items: center;
    max-width: 100%;
    margin: 0;
    padding: 4px .375rem .375rem var(--standard-container-padding-inline);
    color: var(--standard-container-header-title-color);
    background: transparent;
    border: 0;
    border-bottom: 2px solid var(--standard-container-header-accent);
    border-radius: 0;
    font-size: var(--font-size, 14px);
    font-weight: var(--font-weight-bold, 500);
    line-height: 1.2;
    letter-spacing: 0;
}

:is(.standard-container__header, .standard-fluid-container__header, .standard-filter-container__header) :is(.standard-container__description, .standard-fluid-container__description, .standard-filter-container__description) {
    display: block;
    max-width: var(--readable-width, 80ch);
    margin: .5rem 0 0 var(--standard-container-padding-inline);
    color: var(--standard-container-header-muted-color);
    line-height: var(--line-height, 1.42);
}

:is(.standard-container__actions, .standard-fluid-container__actions, .standard-filter-container__actions) {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: .5rem;
    margin-top: -.125rem;
}

@media (max-width: 576px) {
    :is(.standard-container, .standard-fluid-container, .standard-filter-container) > :is(.standard-container__header, .standard-fluid-container__header, .standard-filter-container__header) {
        flex-direction: column;
    }

    :is(.standard-container__actions, .standard-fluid-container__actions, .standard-filter-container__actions) {
        align-self: flex-start;
        margin-top: 0;
    }
}

.sim-detail-page {
    --sim-detail-panel-bg: var(--white, #ffffff);
    --sim-detail-chip-bg: #f7fafa;
    --sim-detail-chip-border: #d8e3e4;
    --sim-detail-chip-color: var(--text-default, #191919);
    --sim-detail-muted: var(--text-muted, #595959);
    --sim-detail-accent: var(--sim-action-bg, var(--color-interactive-30, #008578));
}

.sim-detail-hero {
    display: grid;
    gap: 7px;
    padding: 0 0 2px;
}

.sim-detail-hero__header {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: flex-start;
    gap: 16px;
}

.sim-detail-hero__heading {
    grid-column: 1;
    grid-row: 1;
    min-width: 0;
}

.sim-detail-hero__context {
    display: grid;
    grid-column: 2;
    grid-row: 1;
    justify-items: end;
    gap: 10px;
    min-width: 0;
}

.sim-detail-hero__eyebrow {
    margin: 0 0 3px;
    color: var(--sim-detail-accent);
    font-size: var(--font-size-xs, 11px);
    font-weight: var(--font-weight-bolder, 600);
    letter-spacing: .08em;
    line-height: 1.2;
    text-transform: uppercase;
}

.sim-detail-hero__eyebrow-context {
    color: var(--sim-detail-muted);
}

.sim-detail-hero__title-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
}

.sim-direction-pill {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    min-height: 22px;
    padding: 2px 6px;
    color: var(--sim-accent-strong, var(--sim-detail-accent, #13645f));
    background: var(--sim-accent-soft, #dff3f1);
    border: 1px solid var(--sim-border-strong, var(--sim-detail-chip-border, #9dd5d2));
    border-radius: 4px;
    font-size: var(--font-size-xs, 11px);
    font-weight: var(--font-weight-bolder, 600);
    letter-spacing: 0;
    line-height: 1.2;
    vertical-align: middle;
}

.sim-direction-pill .material-symbols-outlined {
    width: 14px;
    height: 14px;
    font-size: 14px;
    line-height: 1;
}

html[data-theme="dark"] .sim-direction-pill {
    color: var(--color-link-20);
    background: var(--color-interactive-10);
    border-color: rgba(72, 184, 188, .42);
}

#entity.sim-detail-hero__title {
    margin: 0;
    color: var(--text-default, #191919);
    font-size: 26px;
    font-weight: var(--font-weight-bolder, 600);
    letter-spacing: 0;
    line-height: 1.15;
    text-transform: none;
}

.sim-detail-hero__description {
    width: 100%;
    max-width: none;
    margin: 10px 0 0;
    color: var(--sim-detail-muted);
    font-size: var(--font-size, 0.875rem);
    line-height: 1.38;
}

.sim-detail-hero__requirements {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    justify-self: end;
    gap: 6px;
    margin: 0;
}

.sim-req-pill {
    --sim-req-pill-dot: var(--sim-detail-muted);
    --sim-req-pill-border: var(--sim-detail-chip-border);
    --sim-req-pill-bg: var(--sim-detail-chip-bg);
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 22px;
    padding: 2px 9px 2px 8px;
    color: var(--sim-detail-chip-color);
    background: var(--sim-req-pill-bg);
    border: 1px solid var(--sim-req-pill-border);
    border-radius: 999px;
    line-height: 1.2;
    white-space: nowrap;
}

.sim-req-pill::before {
    content: "";
    flex: 0 0 auto;
    width: 6px;
    height: 6px;
    background: var(--sim-req-pill-dot);
    border-radius: 50%;
}

.sim-req-pill__count {
    color: var(--text-default, #191919);
    font-size: var(--font-size-sm, 13px);
    font-weight: var(--font-weight-bolder, 600);
    font-variant-numeric: tabular-nums;
    line-height: 1.2;
}

.sim-req-pill__label {
    color: var(--sim-detail-muted);
    font-size: var(--font-size-xs, 11px);
    font-weight: var(--font-weight-bolder, 600);
    letter-spacing: 0;
    line-height: 1.2;
    text-transform: none;
}

.sim-req-pill--required {
    --sim-req-pill-dot: var(--text-negative);
}

.sim-req-pill--conditional {
    --sim-req-pill-dot: var(--color-formatting-icon-orange);
}

.sim-req-pill--optional {
    --sim-req-pill-dot: var(--text-positive);
}

/* Change summaries keep semantic color in the indicator, not the container. */
.sim-change-pill--added {
    --sim-req-pill-dot: var(--text-positive);
}

.sim-change-pill--modified {
    --sim-req-pill-dot: var(--text-info);
}

.sim-change-pill--removed {
    --sim-req-pill-dot: var(--text-negative);
}

.sim-detail-hero__actions {
    position: absolute;
    z-index: 20;
    top: calc(100% + 8px);
    right: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
    max-width: 100%;
    padding: 8px;
    background: var(--sim-detail-panel-bg);
    border: 1px solid var(--sim-detail-chip-border);
    border-radius: 4px;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .16);
}

:is(.catalog-action, .sim-detail-admin-action, .sim-detail-download) {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: var(--components-min-height, 32px);
    padding: var(--padding-s, 6px) var(--padding-l, 12px);
    border-radius: 4px;
    font-size: var(--font-size-sm, 13px);
    font-weight: var(--font-weight-bold, 500);
    line-height: 1.2;
    text-decoration: none;
}

:is(.catalog-action, .sim-detail-admin-action, .sim-detail-download) .material-symbols-outlined {
    width: 17px;
    height: 17px;
    font-size: 17px;
    line-height: 1;
}

.sim-detail-download--disabled,
.sim-detail-download--disabled:hover,
.sim-detail-download--disabled:focus {
    color: var(--text-disabled);
    background: transparent;
    border-color: var(--color-disabled-20);
    cursor: not-allowed;
}

.sim-detail-hero__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.sim-detail-hero__chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 28px;
    padding: 4px 8px;
    color: var(--sim-detail-chip-color);
    background: var(--sim-detail-chip-bg);
    border: 1px solid var(--sim-detail-chip-border);
    border-radius: 4px;
    font-size: var(--font-size-sm, 13px);
    line-height: 1.2;
}

.sim-detail-hero__chip .material-symbols-outlined {
    width: 16px;
    height: 16px;
    color: var(--sim-detail-accent);
    font-size: 16px;
    line-height: 1;
}

.sim-detail-hero__chip-label {
    color: var(--sim-detail-muted);
    font-size: var(--font-size-xs, 11px);
    font-weight: var(--font-weight-bolder, 600);
    text-transform: uppercase;
}

.sim-detail-hero__chip--contacts {
    flex-wrap: wrap;
    max-width: 100%;
}

.sim-detail-contact-groups {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 4px;
    min-width: 0;
}

.sim-detail-contact-group {
    display: inline-flex;
    align-items: baseline;
    gap: 4px;
    min-width: 0;
}

.sim-detail-contact-group + .sim-detail-contact-group::before {
    color: var(--sim-detail-muted);
    content: "·";
}

.sim-detail-contact-group__role {
    color: var(--sim-detail-muted);
    font-size: var(--font-size-xs, 11px);
    font-weight: var(--font-weight-bolder, 600);
    line-height: 1.2;
}

.sim-detail-contact-group__names {
    min-width: 0;
    color: var(--text-default, #191919);
    font-weight: var(--font-weight-bold, 500);
    line-height: 1.2;
    overflow-wrap: anywhere;
}

.sim-detail-hero__chip--contacts .catalog-private-indicator {
    flex: 0 0 auto;
    margin-left: 0;
}

.sim-detail-hero__chip--status .badge {
    min-height: 18px;
    padding: 2px 6px;
    border-radius: 4px;
    font-size: var(--font-size-xs, 11px);
    line-height: 1.2;
}

.sim-detail-ownership__content {
    display: grid;
    gap: 8px;
}

.sim-detail-ownership__contacts {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

.sim-detail-muted {
    display: block;
    margin-top: 3px;
    color: var(--sim-detail-muted);
    font-size: var(--font-size-sm, 13px);
}

.sim-detail-downloads {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.sim-detail-table-card {
    --standard-container-padding-block: 16px;
    --standard-container-padding-inline: 16px;
}

.sim-detail-table-card > .standard-fluid-container__header {
    margin-bottom: 12px;
}

.sim-detail-table-card__actions {
    justify-content: flex-end;
}

.sim-detail-export-actions .dt-buttons {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
    padding: 0;
}

.sim-detail-table-card .dt-container .dt-layout-start,
.sim-detail-table-card .dt-container .dt-layout-end,
.sim-detail-table-card .dt-container .dt-layout-full {
    gap: 8px;
}

.sim-detail-table-card .dt-container .dt-search label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.sim-detail-table-card .dt-container .dt-search input {
    min-width: 240px;
}

.sim-detail-table-card #sim-detail-datatable tbody td {
    line-height: 1.45;
}

.sim-detail-table-card #sim-detail-datatable tbody td:first-child {
    min-width: 190px;
}

.sim-detail-field-name {
    display: block;
    color: var(--text-default, #191919);
    font-weight: var(--font-weight-bolder, 600);
}

.sim-detail-field-leg {
    display: inline-flex;
    margin-top: 4px;
    color: var(--sim-detail-muted);
    font-size: var(--font-size-sm, 13px);
}

.sim-inline-edit {
    align-items: center;
    margin-inline-start: 3px;
    vertical-align: middle;
}

.sim-inline-edit__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    color: var(--sim-detail-accent, var(--sim-accent, #008578));
    background: transparent;
    border: 1px solid transparent;
    border-radius: 4px;
    text-decoration: none;
}

.sim-inline-edit__link:hover,
.sim-inline-edit__link:focus {
    color: var(--text-default, #191919);
    background: var(--datatable-row-hover-bg, #edf5f5);
    border-color: var(--sim-detail-chip-border, var(--sim-border, #d8e3e4));
    text-decoration: none;
}

.sim-inline-edit__link .bi {
    font-size: 15px;
    line-height: 1;
}

.sim-detail-table-card .badge {
    border-radius: 4px;
    font-weight: var(--font-weight-bold, 500);
}

.sim-detail-primary-key {
    fill: #8a5a00;
}

.sim-detail-table-card #sim-detail-datatable code.language-markup {
    display: inline-flex;
    align-items: center;
    min-height: 20px;
    margin: 1px 2px 1px 0;
    padding: 1px 5px;
    color: var(--text-default, #191919);
    background: var(--sim-detail-chip-bg);
    border: 1px solid var(--sim-detail-chip-border);
    border-radius: 4px;
    font-size: var(--font-size-xs, 11px);
    line-height: 1.2;
}

html[data-theme="dark"] .sim-detail-page {
    --sim-detail-panel-bg: #181818;
    --sim-detail-chip-bg: #1c1c1c;
    --sim-detail-chip-border: #3b3b3b;
    --sim-detail-chip-color: var(--text-default, #fafafa);
    --sim-detail-muted: #c9c9c9;
    --sim-detail-accent: #48B8BC;
}

html[data-theme="dark"] .sim-detail-page .sim-req-pill__count {
    color: var(--text-default, #fafafa);
}

html[data-theme="dark"] #entity.sim-detail-hero__title,
html[data-theme="dark"] .sim-detail-field-name {
    color: var(--text-default, #fafafa);
}

html[data-theme="dark"] .sim-detail-page .sim-detail-hero__description,
html[data-theme="dark"] .sim-detail-page .sim-detail-hero__eyebrow,
html[data-theme="dark"] .sim-detail-page .sim-detail-muted,
html[data-theme="dark"] .sim-detail-page .sim-detail-field-leg {
    color: var(--sim-detail-muted);
}

html[data-theme="dark"] .sim-detail-page .sim-detail-hero__eyebrow,
html[data-theme="dark"] .sim-detail-page .sim-detail-hero__chip .material-symbols-outlined {
    color: var(--sim-detail-accent);
}

html[data-theme="dark"] .sim-detail-primary-key {
    fill: #d8b04c;
}

html[data-theme="dark"] .sim-detail-table-card #sim-detail-datatable code.language-markup {
    color: var(--text-default, #fafafa);
    background: #1c1c1c;
    border-color: #3b3b3b;
}

@media (max-width: 768px) {
    .sim-detail-hero {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .sim-detail-hero__header {
        grid-template-columns: minmax(0, 1fr);
    }

    .sim-detail-hero__heading,
    .sim-detail-hero__requirements {
        grid-column: 1;
        grid-row: auto;
        justify-self: start;
    }

    .sim-detail-hero__requirements {
        margin-top: 0;
    }

    #entity.sim-detail-hero__title {
        font-size: 24px;
    }

    .sim-detail-hero__actions {
        right: auto;
        left: 0;
        justify-content: flex-start;
    }

    .sim-detail-table-card__actions,
    .sim-detail-export-actions .dt-buttons {
        width: 100%;
        justify-content: flex-start;
    }

    .sim-detail-table-card .dt-container .dt-search,
    .sim-detail-table-card .dt-container .dt-search label,
    .sim-detail-table-card .dt-container .dt-search input {
        width: 100%;
    }
}

.datatable-filter-panel {
    --standard-container-padding-block: var(--size-4, 14px);
    --standard-container-padding-inline: var(--size-4, 14px);
    overflow: visible;
}

.datatable-filter-panel__reset {
    flex: 0 0 auto;
}

.datatable-filter-panel .filters {
    gap: var(--size-4, 14px);
    align-items: flex-end;
}

.datatable-filter-panel .filter__name {
    margin-bottom: var(--size-2, 7px);
    color: var(--sim-text, var(--text-default, var(--gray-100)));
    font-size: var(--font-size-sm, 12px);
    letter-spacing: .04em;
    text-transform: uppercase;
}

.datatable-filter-panel .form-select {
    min-height: 32px;
    padding: 5px 28px 5px 10px;
    font-size: var(--font-size, 14px);
    line-height: 18px;
}

.sim-internal-note {
    --sim-internal-note-bg: var(--surface-level-1, #f7fafa);
    --sim-internal-note-border: var(--border-color-10, #d8e3e4);
    --sim-internal-note-accent: var(--color-interactive-30, #48b8bc);
    --sim-internal-note-icon-bg: var(--sim-accent-soft, #e3f2f2);
    --sim-internal-note-icon-color: var(--color-link-20, #2f5053);
    --sim-internal-note-text: var(--text-default, #191919);
    --sim-internal-note-muted: var(--text-muted, #595959);
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: var(--size-3, 11px);
    align-items: flex-start;
    margin: 0 0 var(--size-4, 14px);
    padding: var(--size-4, 14px) var(--size-5, 21px) var(--size-4, 14px) var(--size-4, 14px);
    color: var(--sim-internal-note-text);
    background: var(--sim-internal-note-bg);
    border: 1px solid var(--sim-internal-note-border);
    border-left: 4px solid var(--sim-internal-note-accent);
    border-radius: 4px;
}

html[data-theme="light"] .sim-internal-note {
    --sim-internal-note-bg: #f7fafa;
    --sim-internal-note-border: #d8e3e4;
    --sim-internal-note-accent: #3b6366;
    --sim-internal-note-icon-bg: #e3f2f2;
    --sim-internal-note-icon-color: #2f5053;
    --sim-internal-note-text: var(--gray-100, #191919);
    --sim-internal-note-muted: var(--gray-70, #595959);
}

html[data-theme="dark"] .sim-internal-note {
    --sim-internal-note-bg: var(--surface-level-1, #262626);
    --sim-internal-note-border: var(--border-color-10, #3b3b3b);
    --sim-internal-note-accent: #48B8BC;
    --sim-internal-note-icon-bg: rgba(72, 184, 188, .14);
    --sim-internal-note-icon-color: #48B8BC;
    --sim-internal-note-text: var(--text-default, #fafafa);
    --sim-internal-note-muted: var(--text-muted, #bebebe);
}

.sim-internal-note__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    color: var(--sim-internal-note-icon-color);
    background: var(--sim-internal-note-icon-bg);
    border-radius: 4px;
}

.sim-internal-note__icon .material-symbols-outlined {
    font-size: 21px;
    line-height: 1;
}

.sim-internal-note__eyebrow {
    margin: 0 0 var(--size-1, 4px);
    color: var(--sim-internal-note-icon-color);
    font-size: var(--font-size-xs, 11px);
    font-weight: var(--font-weight-bolder, 600);
    letter-spacing: .08em;
    line-height: 1.2;
    text-transform: uppercase;
}

.sim-internal-note__title {
    margin: 0;
    color: var(--sim-internal-note-text);
    font-size: var(--font-size, 14px);
    font-weight: var(--font-weight-bolder, 600);
    line-height: 1.25;
}

.sim-internal-note__content {
    margin-top: var(--size-2, 7px);
    color: var(--sim-internal-note-muted);
    line-height: var(--line-height, 1.42);
}

.sim-internal-note__content p {
    margin: 0;
    color: inherit;
}

.sim-internal-note__content p + p,
.sim-internal-note__details {
    margin-top: var(--size-2, 7px);
}

.sim-internal-note__details {
    color: var(--sim-internal-note-muted);
}

.sim-internal-note__details summary {
    color: var(--sim-internal-note-icon-color);
    cursor: pointer;
    font-weight: var(--font-weight-bolder, 600);
}

.sim-internal-note__details p {
    margin-top: var(--size-2, 7px);
}

@media (max-width: 576px) {
    .sim-internal-note {
        grid-template-columns: minmax(0, 1fr);
        padding: var(--size-4, 14px);
    }
}

/* Inline description callouts.
   Authored inside description TextFields as `.bd-callout` markup, e.g.
   <div class="bd-callout bd-callout-primary"><h4><i class="bi ..."></i> Info: …</h4><p>…</p></div>
   Styled to match the site's banner/note language: tinted surface, left
   accent border, accent-coloured icon. Variant classes set the accent. */
.bd-callout {
    --bd-callout-accent: var(--color-interactive-30, #48b8bc);
    --bd-callout-surface: var(--surface-level-1, #f7fafa);
    --bd-callout-border: var(--border-color-10, #d8e3e4);
    --bd-callout-heading: var(--text-default, #191919);
    --bd-callout-body: var(--text-muted, #595959);
    margin: var(--size-5, 21px) 0;
    padding: var(--size-3, 11px) var(--size-4, 14px);
    color: var(--bd-callout-body);
    background: var(--bd-callout-surface);
    border: 1px solid var(--bd-callout-border);
    border-left: 4px solid var(--bd-callout-accent);
    border-radius: 4px;
}

.bd-callout > :first-child {
    margin-top: 0;
}

.bd-callout > :last-child {
    margin-bottom: 0;
}

.bd-callout h4 {
    margin: 0 0 var(--size-2, 7px);
    color: var(--bd-callout-heading);
    font-size: var(--font-size, 14px);
    font-weight: var(--font-weight-bolder, 600);
    line-height: 1.3;
}

.bd-callout h4 .bi,
.bd-callout h4 i[class^="bi-"],
.bd-callout h4 i[class*=" bi-"] {
    margin-right: var(--size-2, 7px);
    color: var(--bd-callout-accent);
}

.bd-callout p {
    margin: 0 0 var(--size-2, 7px);
    color: var(--bd-callout-body);
    line-height: var(--line-height, 1.42);
}

.bd-callout p:last-child {
    margin-bottom: 0;
}

.bd-callout a {
    color: var(--bd-callout-accent);
}

.bd-callout-info,
.bd-callout-primary {
    --bd-callout-accent: var(--color-interactive-30, #48b8bc);
}

.bd-callout-warning {
    --bd-callout-accent: #8a5a00;
}

.bd-callout-danger {
    --bd-callout-accent: #b3261e;
}

.bd-callout-success {
    --bd-callout-accent: #1f7a4d;
}

.bd-callout-secondary {
    --bd-callout-accent: var(--gray-60, #737373);
}

html[data-theme="dark"] .bd-callout {
    --bd-callout-accent: #48b8bc;
    --bd-callout-surface: var(--surface-level-1, #262626);
    --bd-callout-border: var(--border-color-10, #3b3b3b);
    --bd-callout-heading: var(--text-default, #fafafa);
    --bd-callout-body: var(--text-muted, #bebebe);
}

html[data-theme="dark"] .bd-callout-warning {
    --bd-callout-accent: #d8b04c;
}

html[data-theme="dark"] .bd-callout-danger {
    --bd-callout-accent: #e0918a;
}

html[data-theme="dark"] .bd-callout-success {
    --bd-callout-accent: #6bbd92;
}

html[data-theme="dark"] .bd-callout-secondary {
    --bd-callout-accent: var(--text-muted, #bebebe);
}

/* SIM Entities documentation catalogue */

.sim-entities-page,
.catalog-page {
    width: calc(100% - var(--size-6, 28px));
    max-width: 1760px;
    padding-bottom: var(--size-7, 42px);
}

.catalog-toolbar {
    margin-bottom: 0;
}

.catalog-domain-filter-panel {
    overflow: hidden;
}

.catalog-domain-filter {
    display: grid;
    gap: var(--size-3, 11px);
}

.catalog-domain-filter__row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: var(--size-2, 7px);
}

.catalog-domain-filter__viewport {
    min-width: 0;
    padding: 2px;
    contain: paint;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-x: contain;
    -ms-overflow-style: none;
    scrollbar-width: none;
    scroll-behavior: smooth;
}

.catalog-domain-filter__viewport::-webkit-scrollbar {
    display: none;
}

.catalog-domain-filter__rail {
    display: flex;
    align-items: center;
    gap: 8px;
    width: max-content;
    min-width: 100%;
    margin: 0;
    padding: 0;
    border: 0;
}

.catalog-domain-filter__button {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    gap: 8px;
    max-width: clamp(10rem, 22vw, 18rem);
    min-height: 34px;
    padding: 6px 10px;
    color: var(--sim-accent-strong, var(--green-80, #13645F));
    background: var(--sim-surface, var(--white, #fff));
    border: 1px solid var(--sim-border, var(--gray-20, #e6e6e6));
    border-radius: 4px;
    font-family: "Roboto Flex", sans-serif;
    font-size: var(--font-size-sm, 13px);
    font-weight: var(--font-weight-bold, 500);
    line-height: 1.2;
    white-space: nowrap;
    cursor: pointer;
    transition: color .16s ease, background-color .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.catalog-domain-filter__button:hover,
.catalog-domain-filter__button:focus {
    color: var(--sim-text, var(--gray-100, #191919));
    background: var(--sim-hover-bg, #F3FAF9);
    border-color: var(--sim-border-strong, var(--gray-30, #bebebe));
}

.catalog-domain-filter__button:focus-visible,
.catalog-domain-filter__scroll-button:focus-visible {
    outline: 2px solid var(--sim-accent, var(--green-70, #16746F));
    outline-offset: 2px;
    box-shadow: none;
}

.catalog-domain-filter__button-label {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.catalog-domain-filter__count,
.catalog-domain-filter__empty-count {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    min-width: 24px;
    min-height: 22px;
    padding: 2px 6px;
    color: var(--sim-muted, var(--gray-70, #595959));
    background: var(--sim-surface-subtle, var(--gray-10, #f6f6f6));
    border: 1px solid var(--sim-border, var(--gray-20, #e6e6e6));
    border-radius: 999px;
    font-size: var(--font-size-xs, 11px);
    font-weight: var(--font-weight-bolder, 600);
    line-height: 1;
}

.catalog-domain-filter__button.is-active .catalog-domain-filter__count,
.catalog-domain-filter__button[aria-pressed="true"] .catalog-domain-filter__count {
    color: currentColor;
    background: rgba(255, 255, 255, .16);
    border-color: rgba(255, 255, 255, .26);
}

.catalog-domain-filter__scroll-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    color: var(--sim-accent-strong, var(--green-80, #13645F));
    background: var(--sim-surface, var(--white, #fff));
    border: 1px solid var(--sim-border, var(--gray-20, #e6e6e6));
    border-radius: 4px;
    cursor: pointer;
}

.catalog-domain-filter__scroll-button:hover,
.catalog-domain-filter__scroll-button:focus {
    color: var(--sim-text, var(--gray-100, #191919));
    background: var(--sim-hover-bg, #F3FAF9);
    border-color: var(--sim-border-strong, var(--gray-30, #bebebe));
}

.catalog-domain-filter__scroll-button:disabled {
    color: var(--sim-muted, var(--gray-70, #595959));
    background: var(--sim-surface-subtle, var(--gray-10, #f6f6f6));
    opacity: .55;
    cursor: default;
}

.catalog-domain-filter__scroll-button[hidden] {
    display: none;
}

.catalog-domain-filter__scroll-button .material-symbols-outlined {
    width: 18px;
    height: 18px;
    font-size: 18px;
    line-height: 1;
}

.catalog-domain-filter__details {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: 12px 24px;
    padding-top: var(--size-3, 11px);
    border-top: 1px solid var(--sim-border, var(--gray-20, #e6e6e6));
}

.catalog-domain-filter__empty-control.sim-toggle {
    justify-self: end;
}

.catalog-domain-filter__summary {
    display: grid;
    gap: 7px;
    min-width: 0;
    width: 100%;
    max-width: 128ch;
    margin: 0;
    color: var(--sim-muted, var(--gray-70, #595959));
    text-align: left;
}

.catalog-domain-filter__summary-header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 10px;
}

.catalog-domain-filter__summary-title {
    color: var(--sim-text, var(--gray-100, #191919));
    font-size: 16px;
    font-weight: var(--font-weight-bolder, 600);
    line-height: 1.25;
}

.catalog-domain-filter__summary-meta {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 3px 8px;
    color: var(--sim-muted, var(--gray-70, #595959));
    background: var(--sim-surface-subtle, var(--gray-10, #f6f6f6));
    border: 1px solid var(--sim-border, var(--gray-20, #e6e6e6));
    border-radius: 999px;
    font-size: var(--font-size-xs, 12px);
    font-weight: var(--font-weight-bold, 500);
    line-height: 1.2;
}

.catalog-domain-filter__summary-description {
    color: var(--sim-muted, var(--gray-70, #595959));
    font-size: 15px;
    line-height: 1.5;
    overflow-wrap: anywhere;
}

html[data-theme="dark"] .catalog-domain-filter__button,
html[data-theme="dark"] .catalog-domain-filter__scroll-button {
    color: var(--sim-action-outline-text, var(--color-link-10));
    background: transparent;
    border-color: var(--border-color-10, #3b3b3b);
}

html[data-theme="dark"] .catalog-domain-filter__button:hover,
html[data-theme="dark"] .catalog-domain-filter__button:focus,
html[data-theme="dark"] .catalog-domain-filter__scroll-button:hover,
html[data-theme="dark"] .catalog-domain-filter__scroll-button:focus {
    color: var(--text-default, #fafafa);
    background: var(--surface-raised, #293138);
    border-color: var(--sim-action-bg, var(--green-70, #16746F));
}

main[role="main"] .catalog-domain-filter__button.is-active,
main[role="main"] .catalog-domain-filter__button[aria-pressed="true"] {
    color: var(--text-on-interactive-30);
    background: var(--color-interactive-30, #2a6466);
    border-color: var(--color-interactive-30, #008578);
    box-shadow: none;
}

html[data-theme="dark"] .catalog-domain-filter__count,
html[data-theme="dark"] .catalog-domain-filter__empty-count,
html[data-theme="dark"] .catalog-domain-filter__scroll-button:disabled {
    color: var(--text-muted, #b8c8ca);
    background: var(--surface-level-1, #262626);
    border-color: var(--border-color-10, #3b3b3b);
}

html[data-theme="dark"] .catalog-domain-filter__summary-title {
    color: var(--text-default, #fafafa);
}

html[data-theme="dark"] .catalog-domain-filter__summary,
html[data-theme="dark"] .catalog-domain-filter__summary-meta {
    color: var(--text-muted, #b8c8ca);
}

html[data-theme="dark"] .catalog-domain-filter__summary-meta {
    background: var(--surface-level-1, #262626);
    border-color: var(--border-color-10, #3b3b3b);
}

@media (max-width: 576px) {
    .catalog-domain-filter__row {
        grid-template-columns: minmax(0, 1fr);
    }

    .catalog-domain-filter__scroll-button {
        display: none;
    }

    .catalog-domain-filter__button {
        max-width: 74vw;
    }

    .catalog-domain-filter__details {
        grid-template-columns: minmax(0, 1fr);
    }

    .catalog-domain-filter__empty-control.sim-toggle {
        justify-self: start;
    }
}

.catalog-overview-header {
    margin-top: 0;
    margin-bottom: var(--sim-page-content-gap);
}

.catalog-overview-header .sim-doc-eyebrow {
    display: block;
    margin-left: var(--standard-container-padding-inline);
}

.catalog-overview-header .standard-container__title {
    font-size: var(--header-font-size-1, 26px);
    font-weight: var(--font-weight-bolder, 600);
    text-transform: none;
}

.catalog-summary,
.catalog-requirements {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 7px;
}

.catalog-summary {
    margin-top: var(--size-3, 11px);
}

.catalog-summary__item,
.catalog-requirements__item {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-height: 28px;
    padding: 4px 8px;
    color: var(--sim-text);
    background: var(--sim-surface-subtle);
    border: 1px solid var(--sim-border);
    border-radius: 4px;
    font-size: var(--font-size-sm, 13px);
    line-height: 1.2;
    text-decoration: none;
}

.catalog-summary__item strong,
.catalog-requirements__item strong {
    color: var(--sim-text);
    font-weight: var(--font-weight-bolder, 600);
}

.catalog-summary__item--link:hover,
.catalog-summary__item--link:focus {
    color: var(--sim-text);
    background: var(--sim-hover-bg);
    border-color: var(--sim-border-strong);
    text-decoration: none;
}

.catalog-summary__item .material-symbols-outlined {
    width: 16px;
    height: 16px;
    color: var(--green-70, #16746f);
    font-size: 16px;
    line-height: 1;
}

.catalog-summary__item--status .badge {
    min-height: 18px;
    padding: 2px 6px;
    border-radius: 4px;
    font-size: var(--font-size-xs, 11px);
    line-height: 1.2;
}

.catalog-summary__label,
.catalog-requirements__label {
    color: var(--sim-muted);
    font-size: var(--font-size-xs, 11px);
    font-weight: var(--font-weight-bolder, 600);
    letter-spacing: .04em;
    text-transform: uppercase;
}

.catalog-detail-page {
    display: grid;
    gap: var(--sim-page-content-gap);
}

.catalog-detail-page > :is(
    .standard-container,
    .standard-fluid-container,
    .standard-filter-container,
    .release-status-banners,
    .sim-internal-note,
    .catalog-toolbar
) {
    margin-block: 0;
}

.catalog-detail-page > .catalog-toolbar > .standard-filter-container,
.catalog-detail-page > .marketplace-detail-layout > :is(.standard-container, .standard-fluid-container) {
    margin-top: 0;
}

.catalog-detail-hero {
    display: grid;
    gap: 10px;
    padding: 2px 0 4px;
}

.catalog-detail-hero__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.catalog-detail-hero__heading {
    min-width: 0;
}

.catalog-detail-hero__eyebrow {
    margin: 0 0 4px;
    color: var(--sim-accent);
    font-size: var(--font-size-xs, 11px);
    font-weight: var(--font-weight-bolder, 600);
    letter-spacing: .08em;
    line-height: 1.2;
    text-transform: uppercase;
}

.catalog-detail-hero__title {
    margin: 0;
    color: var(--sim-text);
    font-size: 28px;
    font-weight: var(--font-weight-bolder, 600);
    letter-spacing: 0;
    line-height: 1.15;
    text-transform: none;
}

.catalog-detail-hero__description {
    width: 100%;
    max-width: none;
    margin: 0;
    color: var(--sim-muted);
    font-size: 15px;
    line-height: 1.45;
}

.catalog-detail-hero__description > :last-child {
    margin-bottom: 0;
}

.catalog-detail-hero__description ul,
.catalog-detail-hero__description ol {
    margin: 8px 0;
    padding-left: 20px;
}

.catalog-detail-hero__description li {
    margin: 2px 0;
}

/* Collapsible hero description ("Read more").
   The clamp + toggle are applied by JS only when the content overflows, so the
   full description stays visible without JavaScript. The fade uses a mask so it
   is background-agnostic and works in both light and dark themes. */
.hero-description {
    --hero-desc-clamp: 4.5em;
}

.hero-description.is-clamped .hero-description__body {
    max-height: var(--hero-desc-clamp);
    overflow: hidden;
    -webkit-mask-image: linear-gradient(to bottom, #000 55%, transparent);
    mask-image: linear-gradient(to bottom, #000 55%, transparent);
}

.hero-description__toggle {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    min-height: var(--icon-target-min-size, 32px);
    margin-top: 4px;
    padding: 2px 0;
    color: var(--sim-accent-strong, #2f5053);
    background: none;
    border: 0;
    font-size: var(--font-size-sm, 13px);
    font-weight: var(--font-weight-bold, 500);
    line-height: 1.2;
    cursor: pointer;
}

.hero-description__toggle:hover {
    text-decoration: underline;
}

.hero-description__toggle:focus-visible {
    outline: 2px solid var(--sim-accent-strong, #2f5053);
    outline-offset: 2px;
    border-radius: 2px;
}

.hero-description__toggle .material-symbols-outlined {
    font-size: 18px;
    line-height: 1;
    transition: transform .15s ease;
}

.hero-description.is-expanded .hero-description__toggle .material-symbols-outlined {
    transform: rotate(180deg);
}

.hero-description__toggle-less {
    display: none;
}

.hero-description.is-expanded .hero-description__toggle-more {
    display: none;
}

.hero-description.is-expanded .hero-description__toggle-less {
    display: inline;
}

.catalog-detail-hero__actions {
    display: flex;
    flex: 0 0 auto;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

.catalog-requirements {
    color: var(--sim-muted);
    font-size: var(--font-size-sm, 13px);
}

.catalog-requirements__label {
    margin-right: 2px;
}

.catalog-requirements__item {
    min-height: 24px;
    padding: 3px 7px;
    background: var(--sim-surface);
}

.catalog-facts-card,
.catalog-table-card,
.catalog-visual-card {
    --standard-container-padding-block: 16px;
    --standard-container-padding-inline: 16px;
}

.catalog-facts {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 15px 20px;
    margin: 0;
}

.catalog-facts--divided {
    --catalog-facts-divider: var(--sim-border, var(--sim-detail-chip-border, var(--gray-20, #e6e6e6)));
    gap: 0;
}

.catalog-facts--columns-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.catalog-facts--columns-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.catalog-facts--columns-5 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.catalog-facts--divided .catalog-fact {
    padding-inline: 20px;
    border-inline-start: 1px solid var(--catalog-facts-divider);
}

.catalog-facts--divided .catalog-fact:first-child {
    padding-inline-start: 0;
    border-inline-start: 0;
}

.catalog-facts--divided .catalog-fact:last-child {
    padding-inline-end: 0;
}

.catalog-facts--divided .catalog-fact--wide {
    margin-top: 15px;
    padding: 15px 0 0;
    border-top: 1px solid var(--catalog-facts-divider);
    border-inline-start: 0;
}

.catalog-facts--divided .catalog-fact--wide:first-child {
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
}

.catalog-fact {
    min-width: 0;
}

.catalog-fact--wide {
    grid-column: 1 / -1;
}

.catalog-fact .field-label {
    margin: 0 0 4px;
}

.catalog-fact .field-data {
    margin: 0;
    overflow-wrap: anywhere;
}

@media (min-width: 768px) and (max-width: 991.98px) {
    .catalog-facts--columns-4,
    .catalog-facts--columns-5 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .catalog-facts--divided {
        grid-template-columns: minmax(0, 1fr);
    }

    .catalog-facts--divided .catalog-fact,
    .catalog-facts--divided .catalog-fact:first-child,
    .catalog-facts--divided .catalog-fact:last-child,
    .catalog-facts--divided .catalog-fact--wide {
        margin-top: 0;
        padding: 14px 0;
        border-top: 1px solid var(--catalog-facts-divider);
        border-inline-start: 0;
    }

    .catalog-facts--divided .catalog-fact:first-child {
        padding-top: 0;
        border-top: 0;
    }

    .catalog-facts--divided .catalog-fact:last-child {
        padding-bottom: 0;
    }
}

.catalog-private-indicator {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--icon-target-min-size, 32px);
    height: var(--icon-target-min-size, 32px);
    margin-left: 4px;
    padding: 0;
    color: var(--text-brand);
    background: transparent;
    border: 0;
    border-radius: var(--radius-default, 4px);
    font-size: 16px;
    line-height: 1;
    vertical-align: text-bottom;
    cursor: help;
}

.catalog-private-indicator:hover,
.catalog-private-indicator:focus {
    color: var(--text-brand);
    background: var(--color-interactive-10);
}

.catalog-private-indicator:active {
    color: var(--text-default);
    background: var(--color-interactive-20);
}

.catalog-code-value {
    font-family: "Menlo", "Consolas", monospace;
    overflow-wrap: anywhere;
}

.catalog-code-link {
    color: var(--sim-accent);
    text-decoration: none;
    text-underline-offset: 3px;
}

.catalog-code-link:hover,
.catalog-code-link:focus-visible {
    color: var(--sim-accent);
    text-decoration: underline;
}

.catalog-table-card {
    overflow: visible;
}

.catalog-table-card > .standard-container__header,
.catalog-table-card > .standard-fluid-container__header {
    margin-bottom: 12px;
}

.catalog-export-actions {
    justify-content: flex-end;
    padding-right: var(--standard-container-padding-inline);
}

.catalog-export-actions .dt-buttons {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
    padding: 0;
}

.catalog-table-card .dt-container .dt-layout-start,
.catalog-table-card .dt-container .dt-layout-end,
.catalog-table-card .dt-container .dt-layout-full {
    gap: 8px;
}

.catalog-table-card .dt-container .dt-search label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.catalog-table-card .dt-container .dt-search input {
    min-width: 240px;
}

.catalog-table-card tbody td {
    line-height: 1.45;
}

.catalog-table__primary {
    display: block;
    color: var(--sim-text);
    font-weight: var(--font-weight-bolder, 600);
}

.sim-detail-attribute-description b,
.sim-detail-attribute-description strong {
    color: var(--text-brand);
    font-weight: var(--font-weight-bolder, 600);
}

.sim-detail-attribute-description__additional {
    margin-top: var(--spacing-small, 8px);
}

.catalog-status-pill {
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    padding: 2px 7px;
    color: var(--sim-text);
    background: var(--sim-surface-subtle);
    border: 1px solid var(--sim-border);
    border-radius: 4px;
    font-size: var(--font-size-sm, 12px);
    font-weight: var(--font-weight-bold, 500);
    line-height: 1.2;
}

.catalog-primary-key {
    fill: #8a5a00;
}

.catalog-visual-card__content {
    display: flex;
    justify-content: center;
    width: 100%;
    overflow: auto;
}

.adaptor-workflow {
    display: grid;
    grid-template-columns: minmax(180px, .75fr) minmax(440px, 1.8fr) minmax(260px, 1fr);
    align-items: stretch;
    gap: 28px;
    width: 100%;
    min-width: 940px;
    padding: 20px;
    color: var(--sim-text);
    background: var(--sim-surface-subtle);
    border: 1px solid var(--sim-border);
    border-radius: 6px;
}

.adaptor-workflow__party {
    display: flex;
    min-width: 0;
    padding: 20px;
    background: var(--sim-surface);
    border: 1px solid var(--sim-border);
    border-top: 3px solid var(--workflow-party-accent);
    border-radius: 6px;
}

.adaptor-workflow__party--vendor {
    --workflow-party-accent: var(--text-info);
    align-items: center;
    flex-direction: column;
    justify-content: center;
    gap: 14px;
    text-align: center;
}

.adaptor-workflow__party--simcorp {
    --workflow-party-accent: var(--sim-accent);
    flex-direction: column;
    justify-content: center;
}

.adaptor-workflow__party-icon {
    display: grid;
    width: 56px;
    height: 56px;
    color: var(--text-info);
    background: var(--color-info-10);
    border: 1px solid var(--color-info-20);
    border-radius: 50%;
    place-items: center;
}

.adaptor-workflow__party-icon .material-symbols-outlined {
    display: grid;
    width: 30px;
    height: 30px;
    font-size: 30px;
    line-height: 1;
    place-items: center;
    transform: translateY(-1px);
}

.adaptor-workflow__simcorp-logo {
    width: 126px;
    height: auto;
    margin-bottom: 18px;
    filter: brightness(0);
}

html[data-theme="dark"] .adaptor-workflow__simcorp-logo {
    filter: none;
}

.adaptor-workflow__eyebrow {
    display: block;
    margin-bottom: 4px;
    color: var(--sim-muted);
    font-size: var(--font-size-xs, 11px);
    font-weight: var(--font-weight-bolder, 600);
    letter-spacing: .06em;
    line-height: 1.2;
    text-transform: uppercase;
}

.adaptor-workflow__party-title {
    margin: 0;
    color: var(--sim-text);
    font-size: var(--font-size-lg, 16px);
    font-weight: var(--font-weight-bolder, 600);
    letter-spacing: 0;
    line-height: 1.25;
}

.adaptor-workflow__party-detail {
    margin: 5px 0 0;
    color: var(--sim-muted);
    font-size: var(--font-size-sm, 12px);
    line-height: 1.35;
}

.adaptor-workflow__sequence {
    display: grid;
    align-content: center;
    gap: 12px;
    min-width: 0;
    margin: 0;
    padding: 0;
    list-style: none;
}

.adaptor-workflow__step {
    --workflow-route-color: var(--sim-accent);
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    min-height: 62px;
}

.adaptor-workflow__step--to-vendor {
    --workflow-route-color: var(--text-info);
}

.adaptor-workflow__step-number {
    display: grid;
    width: 32px;
    height: 32px;
    color: var(--sim-text);
    background: var(--sim-surface);
    border: 1px solid var(--sim-border-strong);
    border-radius: 50%;
    font-size: var(--font-size-xs, 11px);
    font-variant-numeric: tabular-nums;
    font-weight: var(--font-weight-bolder, 600);
    place-items: center;
}

.adaptor-workflow__step-content {
    min-width: 0;
}

.adaptor-workflow__step-label {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 8px;
}

.adaptor-workflow__step-label strong {
    color: var(--sim-text);
    font-size: var(--font-size-sm, 13px);
    font-weight: var(--font-weight-bolder, 600);
    line-height: 1.25;
}

.adaptor-workflow__step-label span {
    color: var(--sim-muted);
    font-size: var(--font-size-xs, 11px);
    line-height: 1.25;
    text-align: right;
}

.adaptor-workflow__route {
    position: relative;
    height: 22px;
    color: var(--workflow-route-color);
}

.adaptor-workflow__route::before {
    position: absolute;
    top: 50%;
    right: 8px;
    left: 8px;
    height: 2px;
    background: var(--workflow-route-color);
    content: "";
    transform: translateY(-50%);
}

.adaptor-workflow__route .material-symbols-outlined {
    position: absolute;
    top: 50%;
    z-index: 1;
    display: grid;
    width: 24px;
    height: 24px;
    background: var(--sim-surface-subtle);
    border: 1px solid currentColor;
    border-radius: 50%;
    font-size: 17px;
    line-height: 1;
    place-items: center;
    transform: translateY(-50%);
}

.adaptor-workflow__step--to-vendor .adaptor-workflow__route .material-symbols-outlined {
    left: 0;
}

.adaptor-workflow__step--to-simcorp .adaptor-workflow__route .material-symbols-outlined {
    right: 0;
}

.adaptor-workflow__systems {
    display: grid;
    gap: 6px;
    margin-top: 16px;
}

.adaptor-workflow__system {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    align-items: center;
    gap: 9px;
    min-height: 48px;
    padding: 8px 10px;
    color: var(--sim-text);
    background: var(--color-interactive-10);
    border: 1px solid var(--color-interactive-20);
    border-radius: 4px;
    font-size: var(--font-size-sm, 13px);
    font-weight: var(--font-weight-bold, 500);
    line-height: 1.3;
}

.adaptor-workflow__system .material-symbols-outlined {
    color: var(--sim-accent);
    font-size: 22px;
}

.adaptor-workflow__system-link {
    justify-self: center;
    color: var(--sim-muted);
    font-size: 20px;
    line-height: 1;
    transform: rotate(90deg);
}

[data-plotly-theme] .js-plotly-plot {
    color: var(--text-default, #1f2933);
}

[data-plotly-theme] .modebar-btn path {
    fill: var(--text-muted, #6c757d);
}

[data-plotly-theme] .modebar-btn:hover path,
[data-plotly-theme] .modebar-btn:focus path {
    fill: var(--text-default, #1f2933);
}

.catalog-diagram {
    max-width: 100%;
    height: auto;
}

.catalog-empty-state {
    display: grid;
    min-height: 96px;
    margin: 0;
    padding: var(--size-6, 24px);
    place-items: center;
    color: var(--sim-muted);
    background-color: var(--sim-surface-subtle);
    border: 1px dashed var(--sim-border-strong);
    border-radius: 4px;
    line-height: 1.45;
    text-align: center;
}

.catalog-empty-state::before {
    content: "inbox";
    color: var(--sim-muted);
    font-family: "Material Symbols Outlined", sans-serif;
    font-size: var(--icon-iconSize6, 28px);
    font-weight: normal;
    line-height: 1;
}

.sim-doc-overview {
    margin-top: 0;
    margin-bottom: var(--sim-page-content-gap);
}

.sim-doc-header,
.sim-doc-card,
.sim-doc-action-panel,
.sim-entity-filters,
.sim-entity-catalogue {
    position: relative;
    overflow: hidden;
}

.sim-doc-header,
.sim-doc-card,
.sim-doc-action-panel {
    border: 1px solid var(--sim-border);
    border-radius: 4px;
    background: var(--sim-surface);
}

.sim-doc-header {
    max-width: none;
    padding: var(--size-3, 11px) 0 var(--size-5, 21px);
    border: 0;
    border-bottom: 1px solid var(--sim-border);
    background: transparent;
}

.sim-doc-header > .sim-doc-eyebrow,
.sim-doc-header > h1,
.sim-doc-header > .sim-doc-lede {
    max-width: var(--readable-width, 80ch);
}

.sim-doc-card {
    padding: var(--size-5, 21px);
}

.sim-doc-header__content,
.sim-entity-filters__header,
.sim-entity-catalogue__header {
    display: flex;
    gap: var(--size-4, 14px);
    align-items: flex-start;
    justify-content: space-between;
}

.sim-doc-header h1,
.sim-doc-card h2,
.sim-doc-action-panel h2,
.sim-entity-filters h2,
.sim-entity-catalogue h2 {
    margin: 0;
    color: var(--sim-text);
    font-weight: var(--font-weight-bolder, 600);
    line-height: 1.2;
}

.sim-doc-header h1 {
    font-size: var(--header-font-size-1, 26px);
    text-transform: none;
}

.sim-doc-card h2,
.sim-doc-action-panel h2,
.sim-entity-filters h2,
.sim-entity-catalogue h2 {
    font-size: var(--header-font-size-3, 20px);
}

.sim-doc-eyebrow {
    margin: 0 0 var(--size-2, 7px);
    color: var(--sim-accent);
    font-size: var(--font-size-sm, 12px);
    font-weight: var(--font-weight-bolder, 600);
    letter-spacing: .08em;
    line-height: 1.2;
    text-transform: uppercase;
}

.sim-doc-lede {
    max-width: 76ch;
    margin: var(--size-3, 11px) 0 0;
    color: var(--sim-muted);
    font-size: var(--font-size, 14px);
    line-height: var(--line-height, 1.42);
}

.sim-doc-header__link {
    flex: 0 0 auto;
    margin-top: var(--size-2, 7px);
    text-decoration: none;
}

.sim-doc-card p,
.sim-doc-action-panel p,
.sim-entity-filters p,
.sim-entity-catalogue__hint {
    margin-bottom: 0;
    color: var(--sim-muted);
    line-height: var(--line-height, 1.42);
}

.sim-doc-steps {
    margin: var(--size-3, 11px) 0 0;
    padding-left: var(--size-5, 21px);
    color: var(--sim-muted);
}

.sim-doc-steps li + li {
    margin-top: var(--size-2, 7px);
}

.ash-reference-guide {
    display: grid;
    gap: var(--size-3, 11px);
    max-width: var(--readable-width, 80ch);
    margin: var(--size-4, 14px) 0 0;
}

.ash-reference-guide__item {
    display: block;
}

.ash-reference-guide dt {
    margin-bottom: 2px;
    color: var(--sim-text);
    font-weight: var(--font-weight-bold, 500);
}

.ash-reference-guide dd {
    margin: 0;
    color: var(--sim-muted);
}

.ash-related-sims__trigger {
    padding: 0;
    border: 0;
    color: var(--sim-accent-strong);
    background: transparent;
    cursor: pointer;
    font-weight: var(--font-weight-bold, 500);
}

.ash-related-sims__trigger:hover,
.ash-related-sims__trigger:focus-visible,
.ash-related-sims__trigger[aria-expanded="true"] {
    color: var(--sim-accent-strong);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.ash-related-sims__menu {
    min-width: 320px;
    max-width: 420px;
    max-height: 260px;
    overflow-y: auto;
}

.ash-related-sims__menu .dropdown-item {
    white-space: normal;
}

.sim-doc-action-panel__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    color: var(--sim-accent-strong);
    background: var(--sim-accent-soft);
    border-radius: 4px;
}

.sim-doc-action-panel {
    --standard-container-padding-block: var(--size-4, 14px);
    --standard-container-padding-inline: var(--size-4, 14px);
    align-self: stretch;
    display: block;
    margin-top: 0;
    margin-bottom: 0;
    padding: var(--size-4, 14px);
}

.sim-doc-action-panel > .standard-container__header {
    margin-bottom: var(--size-4, 14px);
}

.sim-doc-action-panel h2 {
    font-size: var(--header-font-size-5, 16px);
}

.sim-doc-action-panel p {
    margin-top: var(--size-1, 4px);
}

.sim-doc-action-panel__action {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: var(--size-3, 11px);
    margin-top: 0;
}

.sim-doc-action-panel .btn {
    white-space: nowrap;
}

.sim-entity-toolbar {
    display: grid;
    grid-template-columns: minmax(520px, 1fr) minmax(340px, 480px);
    gap: var(--size-4, 14px);
    align-items: stretch;
    margin-top: var(--sim-page-content-gap);
    margin-bottom: 0;
}

.sim-entity-filters {
    --standard-container-padding-block: var(--size-4, 14px);
    --standard-container-padding-inline: var(--size-4, 14px);
    overflow: visible;
    margin-top: 0;
    padding: var(--size-4, 14px);
}

.sim-entity-filters__header {
    margin-bottom: var(--size-4, 14px);
}

.sim-entity-filters__reset {
    flex: 0 0 auto;
    font-weight: var(--font-weight-bold, 500);
}

.sim-entity-filters .filters {
    gap: var(--size-4, 14px);
    align-items: flex-end;
}

.sim-entity-filters .filter__name {
    margin-bottom: var(--size-2, 7px);
    color: var(--sim-text);
    font-size: var(--font-size-sm, 12px);
    letter-spacing: .04em;
    text-transform: uppercase;
}

.sim-entity-filters .form-select {
    min-height: 32px;
    padding: 5px 28px 5px 10px;
    font-size: var(--font-size, 14px);
    line-height: 18px;
}

.sim-entity-catalogue {
    --standard-container-padding-block: var(--size-5, 21px);
    --standard-container-padding-inline: var(--size-5, 21px);
    overflow: visible;
    padding: var(--size-5, 21px);
}

.sim-entity-catalogue__header {
    margin-bottom: var(--size-4, 14px);
    padding-bottom: var(--size-4, 14px);
    border-bottom: 1px solid var(--sim-border);
}

.sim-entity-catalogue__header.standard-container__header {
    margin-bottom: var(--size-4, 14px);
    padding: 0 0 var(--size-3, 11px);
    border-bottom: 0;
}

.sim-entity-catalogue__header .sim-doc-eyebrow,
.sim-entity-catalogue__header .standard-container__title {
    display: block;
}

.sim-entity-catalogue__header .standard-container__title {
    margin-left: 0;
}

.catalog-table-card .sim-entity-catalogue__header .standard-container__title {
    display: inline-flex;
    width: auto;
}

.sim-entity-catalogue__hint {
    max-width: 34ch;
    text-align: right;
}

.sim-tooltip-label {
    border-bottom: 1px dotted currentColor;
    white-space: nowrap;
    cursor: help;
}

.sim-entity-link {
    color: var(--sim-accent-strong);
    font-weight: var(--font-weight-bolder, 600);
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}

.sim-entity-link:hover {
    color: var(--sim-accent);
}

.sim-entity-table__entity {
    min-width: 12rem;
}

.sim-entity-table__entity--locked {
    color: var(--sim-muted);
    font-weight: var(--font-weight-bold, 500);
}

.sim-entity-table__description {
    max-width: 52rem;
    color: var(--sim-text);
}

.sim-entity-table__meta {
    color: var(--sim-muted);
    white-space: nowrap;
}

.sim-entity-table__status {
    white-space: nowrap;
}

.sim-tag {
    display: inline-flex;
    align-items: center;
    max-width: 100%;
    padding: .25em .6em;
    color: var(--sim-text);
    background: var(--sim-surface-subtle);
    border: 1px solid var(--sim-border);
    border-radius: 999px;
    font-size: var(--font-size-sm, 12px);
    font-weight: var(--font-weight-bold, 500);
}

/* ============================================================
   SIM change history / release notes — timeline change list.
   Shared by the entity version-history page, the release-notes
   page, and the SIM detail summary panel. Local fallback tokens
   keep it correct in both the .catalog-page and .sim-detail-page
   scopes, in light and dark themes.
   ============================================================ */
.sim-change-list {
    --scl-text: var(--sim-text, var(--sim-detail-chip-color, #191919));
    --scl-muted: var(--sim-muted, var(--sim-detail-muted, #595959));
    --scl-border: var(--sim-border, var(--sim-detail-chip-border, #e6e6e6));
    --scl-surface: var(--sim-surface, var(--sim-detail-panel-bg, #fff));
    --scl-surface-subtle: var(--sim-surface-subtle, var(--sim-detail-chip-bg, #f6f6f6));
    position: relative;
    margin: 0;
    padding: 2px 0 0;
    list-style: none;
}

.sim-change-list::before {
    content: "";
    position: absolute;
    top: 15px;
    bottom: 15px;
    left: 6px;
    width: 2px;
    background: var(--scl-border);
    border-radius: 2px;
}

.sim-change-list__item {
    position: relative;
    padding: 3px 0 18px 30px;
}

.sim-change-list__item:last-child {
    padding-bottom: 2px;
}

.sim-change-list__item::before {
    content: "";
    position: absolute;
    top: 7px;
    left: 0;
    width: 14px;
    height: 14px;
    box-sizing: border-box;
    background: var(--scl-surface);
    border: 2px solid var(--scl-muted);
    border-radius: 50%;
}

.sim-change-list__item--added::before { border-color: var(--text-positive); }
.sim-change-list__item--removed::before { border-color: var(--text-negative); }
.sim-change-list__item--modified::before { border-color: var(--text-info); }

.sim-change-list__head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    min-height: 22px;
}

.sim-change-list__label {
    color: var(--scl-text);
    font-size: var(--font-size, 0.875rem);
    font-weight: var(--font-weight-bolder, 600);
    line-height: 1.3;
    overflow-wrap: anywhere;
}

.sim-change-list__meta {
    color: var(--scl-muted);
    font-size: var(--font-size-sm, 12px);
    line-height: 1.3;
    white-space: nowrap;
}

.sim-change-list__summary {
    margin: 5px 0 0;
    color: var(--scl-muted);
    font-size: var(--font-size, 14px);
    line-height: 1.4;
}

.sim-change-list__fields {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin: 10px 0 0;
    padding: 0;
    list-style: none;
}

.sim-change-list__field {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 10px;
    padding: 7px 11px;
    background: var(--scl-surface-subtle);
    border: 1px solid var(--scl-border);
    border-radius: 8px;
    font-size: var(--font-size, 14px);
    line-height: 1.4;
}

.sim-change-list__field > .catalog-summary__label {
    flex: 0 0 auto;
    min-width: 128px;
}

.sim-change-list__field .material-symbols-outlined {
    width: 16px;
    height: 16px;
    font-size: 16px;
    line-height: 1;
    color: var(--scl-muted);
}

.sim-change-old,
.sim-change-new {
    padding: 1px 7px;
    border-radius: 5px;
    font-family: var(--font-family-mono, ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace);
    font-size: 13px;
    overflow-wrap: anywhere;
}

.sim-change-old {
    color: var(--scl-muted);
    background: color-mix(in srgb, #c62828 12%, transparent);
    text-decoration: line-through;
    text-decoration-color: color-mix(in srgb, #c62828 55%, transparent);
}

.sim-change-new {
    color: var(--scl-text);
    background: color-mix(in srgb, #2e7d32 15%, transparent);
    font-weight: var(--font-weight-bold, 500);
}

.sim-status-pill {
    --scb-dot: var(--text-muted);
    --scb-bg: var(--surface-raised);
    --scb-border: var(--border-color-10);
    --scb-color: var(--text-default);
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 2px 10px 2px 8px;
    color: var(--scb-color);
    background: var(--scb-bg);
    border: 1px solid var(--scb-border);
    border-radius: 999px;
    font-size: var(--font-size-sm, 12px);
    font-weight: var(--font-weight-bolder, 600);
    letter-spacing: 0;
    line-height: 1.35;
    text-transform: none;
    white-space: nowrap;
}

.sim-status-pill::before {
    content: "";
    flex: 0 0 auto;
    width: 7px;
    height: 7px;
    background: var(--scb-dot);
    border-radius: 50%;
}

.sim-status-pill--positive {
    --scb-dot: var(--text-positive);
    --scb-color: var(--text-positive);
    --scb-bg: var(--color-positive-10);
    --scb-border: var(--color-positive-20);
}

.sim-status-pill--negative {
    --scb-dot: var(--text-negative);
    --scb-color: var(--text-negative);
    --scb-bg: var(--color-negative-10);
    --scb-border: var(--color-negative-20);
}

.sim-status-pill--warning {
    --scb-dot: var(--color-formatting-icon-orange);
    --scb-color: var(--color-formatting-text-orange);
    --scb-bg: color-mix(in srgb, var(--color-formatting-icon-orange) 12%, transparent);
    --scb-border: color-mix(in srgb, var(--color-formatting-icon-orange) 34%, transparent);
}

.sim-status-pill--info {
    --scb-dot: var(--text-info);
    --scb-color: var(--text-info);
    --scb-bg: var(--color-info-10);
    --scb-border: var(--color-info-20);
}

.sim-status-pill--quiet {
    --scb-color: var(--text-default);
    --scb-bg: var(--surface-raised);
    --scb-border: var(--border-color-10);
}

/* Release-notes feed: per-version grouping within each SIM section */
.sim-feed-sim-link {
    color: inherit;
    text-decoration: none;
}

.sim-feed-sim-link:hover,
.sim-feed-sim-link:focus-visible {
    text-decoration: underline;
    text-underline-offset: 3px;
}

.sim-version-group + .sim-version-group {
    margin-top: 20px;
    padding-top: 18px;
    border-top: 1px dashed var(--sim-border, #e6e6e6);
}

.sim-version-group__header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0 0 12px;
}

.sim-version-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 12px;
    color: var(--sim-text, #191919);
    background: var(--sim-surface-subtle, #f6f6f6);
    border: 1px solid var(--sim-border, #e6e6e6);
    border-radius: 999px;
    font-size: 13px;
    font-weight: var(--font-weight-bolder, 600);
    line-height: 1.3;
    text-decoration: none;
    white-space: nowrap;
    transition: background-color .15s ease, border-color .15s ease;
}

a.sim-version-pill:hover,
a.sim-version-pill:focus-visible {
    color: var(--sim-text, #191919);
    border-color: color-mix(in srgb, var(--green-40, #2e7d32) 60%, var(--sim-border, #e6e6e6));
    background: color-mix(in srgb, var(--green-40, #2e7d32) 8%, var(--sim-surface-subtle, #f6f6f6));
    text-decoration: none;
}

.sim-version-pill .material-symbols-outlined {
    width: 16px;
    height: 16px;
    font-size: 16px;
    line-height: 1;
}

.sim-version-pill--unreleased {
    color: var(--sim-muted, #595959);
    background: transparent;
    border-style: dashed;
}

.sim-version-group__count {
    flex: 0 0 auto;
    color: var(--sim-muted, #595959);
    font-size: var(--font-size-sm, 12px);
    font-weight: var(--font-weight-bold, 500);
    white-space: nowrap;
}

.sim-version-group__rule {
    flex: 1 1 auto;
    height: 0;
    margin: 0;
    border: 0;
    border-top: 1px solid var(--sim-border, #e6e6e6);
    opacity: .6;
}

.sim-feed-card__heading {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    min-width: 0;
}

.sim-version-pill--current {
    padding: 3px 10px;
    font-size: var(--font-size-sm, 12px);
}

/* Curated version headline (EntityVersion.title): the human summary shown
   beside "What changed in vX.Y" and next to each version in the history feed. */
.sim-version-headline {
    color: var(--scl-text, #1a1a1a);
    font-size: var(--font-size-lg, 16px);
    font-weight: var(--font-weight-bold, 500);
    line-height: 1.35;
}

/* Version "what changed" panel: collapsible per-change field detail */
.sim-change-disclosure__summary {
    position: relative;
    cursor: pointer;
    list-style: none;
    -webkit-user-select: none;
    user-select: none;
    margin: 0 -8px;
    padding: 6px 8px;
    border-radius: 8px;
    transition: background-color .15s ease;
}

.sim-change-disclosure__summary::-webkit-details-marker {
    display: none;
}

.sim-change-disclosure__summary:hover {
    background: var(--sim-list-item-hover-bg);
}

.sim-change-disclosure__summary:focus-visible {
    outline: 2px solid var(--color-focus-10, var(--green-70));
    outline-offset: 0;
}

.sim-change-disclosure__toggle {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-left: auto;
    padding-left: 6px;
    color: var(--scl-muted);
    transition: color .15s ease;
}

.sim-change-disclosure__summary:hover .sim-change-disclosure__toggle {
    color: var(--scl-text);
}

.sim-change-disclosure__count {
    font-size: var(--font-size-sm, 12px);
    font-weight: var(--font-weight-bold, 500);
    white-space: nowrap;
}

.sim-change-disclosure__chevron {
    font-size: 20px;
    line-height: 1;
    transition: transform .18s ease;
}

.sim-change-disclosure[open] > .sim-change-disclosure__summary .sim-change-disclosure__chevron {
    transform: rotate(180deg);
}

.sim-change-disclosure > .sim-change-list__fields {
    margin-top: 10px;
}

.sim-detail-history {
    --standard-container-padding-block: 14px;
    --standard-container-padding-inline: 16px;
    margin-top: 12px;
}

.sim-detail-history > .standard-fluid-container__header {
    align-items: center;
    margin-bottom: 10px;
}

.sim-detail-history > .standard-fluid-container__header .standard-fluid-container__actions {
    margin-top: 0;
}

.sim-detail-history .standard-fluid-container__description {
    margin-top: .25rem;
    font-size: var(--font-size, 14px);
    line-height: 1.3;
}

/* Title row: a small "what's tracked" info affordance sits inline with the
   panel heading. */
.sim-detail-history__titlerow {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
}

/* "What's tracked" note: a subtle inline info icon next to the title. */
.sim-change-scope-note {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--icon-target-min-size, 32px);
    height: var(--icon-target-min-size, 32px);
    min-width: var(--icon-target-min-size, 32px);
    min-height: var(--icon-target-min-size, 32px);
    padding: 0;
    color: var(--scl-muted);
    background: transparent;
    border: 0;
    border-radius: var(--radius-default, 4px);
    cursor: help;
}

.sim-change-scope-note:hover,
.sim-change-scope-note:focus-visible {
    color: var(--scl-text);
}

.sim-change-scope-note .material-symbols-outlined {
    font-size: 17px;
    line-height: 1;
}

.sim-change-summary {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--scl-muted);
    font-size: var(--font-size-sm, 12px);
    line-height: 1.2;
    white-space: nowrap;
}

.sim-change-summary__item {
    display: inline-flex;
    align-items: baseline;
    gap: 3px;
}

.sim-change-summary__item + .sim-change-summary__item::before {
    content: "·";
    margin-right: 3px;
    color: var(--scl-muted);
}

.sim-change-summary strong {
    color: var(--scl-text);
    font-weight: var(--font-weight-bolder, 600);
}

/* "Show N more" expander: sets a compact two-row preview for larger change
   sets. The full counts legend remains visible in the panel header. */
.sim-change-more {
    padding: 4px 0 0;
}

.sim-change-more__summary {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    padding-left: 24px;
    cursor: pointer;
    list-style: none;
    -webkit-user-select: none;
    user-select: none;
}

.sim-change-more__summary::-webkit-details-marker {
    display: none;
}

.sim-change-more__summary:focus-visible {
    border-radius: var(--radius-default, 4px);
    outline: 2px solid var(--color-focus-10, var(--green-70));
    outline-offset: 0;
}

.sim-change-more__toggle {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: var(--scl-text);
    font-size: 13px;
    font-weight: var(--font-weight-bolder, 600);
    white-space: nowrap;
}

.sim-change-more:not([open]) .sim-change-more__less {
    display: none;
}

.sim-change-more[open] .sim-change-more__more {
    display: none;
}

.sim-change-more__chevron {
    font-size: 18px;
    line-height: 1;
    transition: transform .18s ease;
}

.sim-change-more[open] > .sim-change-more__summary .sim-change-more__chevron {
    transform: rotate(180deg);
}

.sim-change-more__list {
    margin-top: 10px;
}

/* Nested list inside the expander keeps the node dots but not a second timeline line. */
.sim-change-more .sim-detail-history__list::before {
    content: none;
}

@media (prefers-reduced-motion: no-preference) {
    .sim-change-more[open] > .sim-change-more__list {
        animation: sim-change-reveal .18s ease-out;
    }

    @keyframes sim-change-reveal {
        from { opacity: 0; transform: translateY(-4px); }
        to { opacity: 1; transform: translateY(0); }
    }
}

.sim-detail-history__list {
    padding-top: 0;
}

.sim-detail-history__list::before {
    top: 12px;
    bottom: 8px;
}

.sim-detail-history__list .sim-change-list__item {
    padding: 0 0 10px 24px;
}

.sim-detail-history__list .sim-change-list__item:last-child {
    padding-bottom: 0;
}

.sim-detail-history__list .sim-change-list__item::before {
    top: 4px;
    width: 12px;
    height: 12px;
}

/* Disclosure rows wrap the pill in a summary with 6px top padding, which
   pushes the badge down; offset the node ring to match its center. */
.sim-detail-history__list .sim-change-list__item:has(.sim-change-disclosure)::before {
    top: 10px;
}

.sim-detail-history__list .sim-change-list__head {
    gap: 6px;
    min-height: 20px;
}

.sim-detail-history__list .sim-status-pill,
.sim-detail-history__list .sim-tag {
    padding: 1px 8px;
    font-size: var(--font-size-sm, 12px);
    line-height: 1.3;
}

.sim-detail-history__list .sim-status-pill::before {
    width: 6px;
    height: 6px;
}

.sim-detail-history__list .sim-change-list__label {
    font-size: var(--font-size, 14px);
    line-height: 1.25;
}

.sim-detail-history__list .sim-change-list__summary {
    margin-top: 2px;
    font-size: 13px;
    line-height: 1.25;
}

/* Release-notes: collapsible per-version change cards */
.sim-version-notes {
    margin: 0;
    padding: 0;
    list-style: none;
}

.sim-version-notes__item {
    border-top: 1px solid var(--sim-border, #e6e6e6);
}

.sim-version-notes__item:first-child {
    border-top: 0;
}

.sim-version-notes__summary {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px 12px;
    padding: 12px 10px;
    border-radius: 8px;
    cursor: pointer;
    list-style: none;
    transition: background-color .15s ease;
}

.sim-version-notes__summary::-webkit-details-marker {
    display: none;
}

.sim-version-notes__summary:hover {
    background: var(--sim-list-item-hover-bg);
}

.sim-version-notes__summary:focus-visible {
    outline: 2px solid var(--color-focus-10, var(--green-70, #13645f));
    outline-offset: -2px;
}

.sim-version-notes__name {
    min-width: 0;
    color: var(--sim-text, #191919);
    font-size: var(--font-size, 14px);
    font-weight: var(--font-weight-bolder, 600);
    line-height: 1.3;
    overflow-wrap: anywhere;
}

.sim-version-notes__meta {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    margin-left: auto;
    color: var(--sim-muted, #595959);
    font-size: var(--font-size-sm, 12px);
    white-space: nowrap;
}

.sim-version-notes__count {
    font-weight: var(--font-weight-bold, 500);
}

.sim-version-notes__chevron {
    font-size: 22px;
    line-height: 1;
    transition: transform .18s ease;
}

details[open] > .sim-version-notes__summary .sim-version-notes__chevron {
    transform: rotate(180deg);
}

.sim-version-notes__body {
    padding: 2px 10px 12px;
}

.sim-release-feed-heading {
    margin-top: 24px;
}

.sim-version-control {
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    gap: 8px;
    margin: 0;
}

.sim-version-control__field {
    display: grid;
    gap: 4px;
}

.sim-version-control__label {
    color: var(--sim-muted);
    font-size: var(--font-size-xs, 11px);
    font-weight: var(--font-weight-bolder, 600);
    line-height: 1.2;
    text-transform: uppercase;
}

.sim-version-control__readonly {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    min-width: 200px;
    min-height: 36px;
    background: var(--color-input-background-default);
    border: 1px solid var(--color-input-border-default);
    border-radius: 2px;
}

.sim-version-control__input,
.sim-version-control__input:focus {
    flex: 1 1 auto;
    width: 1px;
    min-width: 0;
    min-height: 34px;
    padding: 6px 0 6px 10px;
    color: var(--text-default);
    background: transparent;
    border: 0;
    border-radius: 0;
    font-size: var(--font-size-sm, 13px);
    font-weight: var(--font-weight-bold, 500);
    line-height: 1.25;
    pointer-events: none;
}

.sim-version-control__readonly .sim-version-control__status {
    flex: 0 0 auto;
    margin-right: 10px;
}

.sim-select__trigger {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    min-width: 190px;
    min-height: 36px;
    padding: 6px 10px;
    color: var(--text-default);
    background: var(--color-input-background-default);
    border: 1px solid var(--color-input-border-default);
    border-radius: 2px;
    font-size: var(--font-size-sm, 13px);
    font-weight: var(--font-weight-bold, 500);
    line-height: 1.25;
    text-align: left;
}

.sim-select__trigger::after {
    display: none;
}

.sim-select__chevron {
    flex: 0 0 auto;
    margin-left: auto;
    font-size: 18px;
    line-height: 1;
}

.sim-select__trigger:hover {
    border-color: var(--color-input-border-hover);
}

.sim-select__trigger[aria-expanded="true"] {
    background: var(--color-input-background-active);
    border-color: var(--color-input-border-default);
    outline: 0;
    box-shadow: none;
}

.sim-select__trigger:focus-visible {
    background: var(--color-input-background-active);
    border-color: var(--color-input-border-active);
    outline: 2px solid var(--color-focus-10);
    outline-offset: 2px;
    box-shadow: none;
}

.sim-version-snapshot {
    margin: 12px 0 10px;
}

.sim-select__selection,
.sim-select__option {
    display: flex;
    align-items: center;
    gap: 8px;
}

.sim-select__menu {
    min-width: 100%;
    max-height: min(320px, calc(100vh - 32px));
    overflow-y: auto;
    padding: 4px;
    background: var(--surface-raised);
    border-color: var(--border-color-10);
    border-radius: 4px;
    box-shadow: none;
}

.sim-select__option {
    width: 100%;
    min-height: 34px;
    padding: 6px 8px;
    color: var(--text-default);
    background: transparent;
    border: 0;
    border-radius: 2px;
    font-size: var(--font-size, 14px);
    font-weight: var(--font-weight-normal, 400);
    justify-content: flex-start;
    text-align: left;
    text-decoration: none;
}

.sim-select {
    min-width: 200px;
}

.sim-select > select {
    display: none;
}

.sim-select__selection {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sim-version-control .sim-select__menu a.sim-select__option:hover,
.sim-version-control .sim-select__menu a.sim-select__option:focus,
.sim-version-control .sim-select__menu a.sim-select__option[aria-current="page"],
.sim-select__menu .sim-select__option:hover,
.sim-select__menu .sim-select__option:focus,
.sim-select__menu .sim-select__option[aria-checked="true"] {
    color: var(--text-default);
    background: var(--color-interactive-10);
    text-decoration: none;
}

.sim-version-control .sim-select__option[aria-current="page"],
.sim-select__option[aria-checked="true"] {
    font-weight: var(--font-weight-bolder, 600);
}

html[data-theme="light"] .dropdown-menu {
    --bs-dropdown-link-hover-color: var(--text-default);
    --bs-dropdown-link-hover-bg: var(--color-interactive-20);
    --bs-dropdown-link-active-color: var(--text-default);
    --bs-dropdown-link-active-bg: var(--color-interactive-20);
}

html[data-theme="light"] .dropdown-menu .dropdown-item:is(
    :hover,
    :focus,
    :active,
    .active,
    [aria-current="page"],
    [aria-checked="true"],
    [aria-selected="true"]
) {
    color: var(--text-default);
    background-color: var(--color-interactive-20);
}

html[data-theme="light"] select option:is(:checked, :hover, :focus) {
    color: var(--text-default);
    background-color: var(--color-interactive-20);
}

.sim-select__check {
    width: 17px;
    height: 17px;
    margin-left: auto;
    color: var(--color-link-10);
    font-size: 17px;
    line-height: 1;
}

.sim-toggle {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 32px;
    margin: 0;
    color: var(--text-default);
    font-size: var(--font-size-sm, 12px);
    font-weight: var(--font-weight-bold, 500);
    line-height: 1.2;
    cursor: pointer;
}

.sim-toggle__input {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.sim-toggle__track {
    position: relative;
    flex: 0 0 auto;
    width: 38px;
    height: 20px;
    color: var(--text-muted);
    background: var(--color-input-background-default);
    border: 1px solid var(--color-input-border-default);
    border-radius: 10px;
    transition: background-color .15s ease, border-color .15s ease;
}

.sim-toggle__thumb {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 14px;
    height: 14px;
    background: var(--text-muted);
    border-radius: 50%;
    transition: transform .15s ease, background-color .15s ease;
}

.sim-toggle:hover .sim-toggle__input:not(:disabled) + .sim-toggle__track {
    border-color: var(--color-input-border-hover);
}

.sim-toggle__input:focus-visible + .sim-toggle__track {
    outline: 2px solid var(--color-focus-10);
    outline-offset: 2px;
}

.sim-toggle__input:checked + .sim-toggle__track {
    color: var(--text-on-positive-30);
    background: var(--color-positive-30);
    border-color: var(--color-positive-30);
}

.sim-toggle__input:checked + .sim-toggle__track .sim-toggle__thumb {
    background: var(--surface-raised);
    transform: translateX(18px);
}

.sim-toggle__input:disabled ~ .sim-toggle__track,
.sim-toggle__input:disabled ~ .sim-toggle__label,
.sim-toggle__input:disabled ~ .sim-toggle__count {
    opacity: .45;
}

.sim-toggle:has(.sim-toggle__input:disabled) {
    cursor: not-allowed;
}

.sim-toggle__count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    min-height: 22px;
    padding: 2px 6px;
    color: var(--text-muted);
    background: var(--surface-level-1);
    border: 1px solid var(--border-color-10);
    border-radius: 999px;
    font-size: var(--font-size-xs, 11px);
    line-height: 1;
}

.sim-version-control__status {
    gap: 4px;
    padding: 1px 6px 1px 5px;
    font-size: 10px;
    letter-spacing: 0;
}

.sim-version-control__status::before {
    width: 5px;
    height: 5px;
}

.sim-version-control .sim-copy-link {
    justify-content: center;
    width: 36px;
    min-height: 36px;
    padding: 0;
}

.sim-version-control .sim-copy-link--copied {
    color: var(--text-positive);
    background: var(--color-positive-10);
    border-color: var(--color-positive-20);
}

.sim-release-switcher {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-top: 4px;
}

.sim-release-switcher .sim-version-link {
    display: inline-flex;
    align-items: center;
    max-width: 100%;
    gap: 4px;
    padding: .25em .6em;
    color: var(--sim-text);
    background: var(--sim-surface-subtle);
    border: 1px solid var(--sim-border);
    border-radius: 4px;
    font-size: 13px;
    font-weight: var(--font-weight-bold, 500);
    text-decoration: none;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}

.sim-release-switcher .sim-version-link .material-symbols-outlined {
    font-size: 15px;
    line-height: 1;
}

.sim-release-switcher .sim-version-link--unreleased:not([aria-current="page"]) {
    border-color: color-mix(in srgb, #e0a64e 55%, var(--sim-border, #e6e6e6));
}

.sim-release-switcher .sim-version-link--unreleased:not([aria-current="page"]) .material-symbols-outlined {
    color: #c9871f;
}

.sim-release-switcher__note {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    margin: 8px 0 0;
    font-size: 0.875rem;
    line-height: 1.45;
    color: var(--sim-text, #191919);
}

.sim-release-switcher__note .material-symbols-outlined {
    font-size: 18px;
    line-height: 1.35;
    color: #c9871f;
    flex-shrink: 0;
}

.sim-release-switcher__note a {
    color: var(--sim-accent-strong, #13645f);
    font-weight: var(--font-weight-bold, 600);
    text-decoration: underline;
}

.sim-release-switcher__note a:hover,
.sim-release-switcher__note a:focus {
    text-decoration: none;
}

.sim-release-switcher .sim-version-link:hover,
.sim-release-switcher .sim-version-link:focus {
    border-color: var(--sim-border-strong, #bebebe);
    background: var(--sim-hover-bg, #f3faf9);
}

.sim-release-switcher .sim-version-link[aria-current="page"],
.sim-release-switcher .sim-version-link[aria-current="page"]:hover,
.sim-release-switcher .sim-version-link[aria-current="page"]:focus {
    color: var(--text-on-interactive-30);
    background: var(--color-interactive-30);
    border-color: var(--color-interactive-30);
    font-weight: var(--font-weight-bolder, 600);
}

[data-theme="dark"] .sim-change-old {
    background: color-mix(in srgb, #ef6b6b 16%, transparent);
    text-decoration-color: color-mix(in srgb, #ef6b6b 60%, transparent);
}

[data-theme="dark"] .sim-change-new {
    background: color-mix(in srgb, #67c46d 18%, transparent);
}

[data-theme="dark"] .sim-doc-header__link {
    color: var(--sim-accent-strong);
    border-color: var(--sim-border-strong);
}

[data-theme="dark"] .sim-entities-page :is(.standard-filter-container, .standard-container),
[data-theme="dark"] .catalog-page :is(.standard-filter-container, .standard-container, .standard-fluid-container) {
    border-color: var(--sim-border);
    background-color: var(--sim-surface);
}

[data-theme="dark"] .catalog-detail-hero__title,
[data-theme="dark"] .catalog-table__primary,
[data-theme="dark"] .catalog-summary__item strong,
[data-theme="dark"] .catalog-requirements__item strong {
    color: var(--sim-text);
}

[data-theme="dark"] .catalog-detail-hero__description,
[data-theme="dark"] .catalog-summary__label,
[data-theme="dark"] .catalog-requirements__label,
[data-theme="dark"] .catalog-empty-state {
    color: var(--sim-muted);
}

[data-theme="dark"] .catalog-summary__item--link {
    color: var(--sim-accent-strong);
    border-color: var(--sim-border-strong);
}

[data-theme="dark"] .catalog-summary__item--link:hover,
[data-theme="dark"] .catalog-summary__item--link:focus {
    color: var(--sim-text);
    background: var(--sim-hover-bg);
}

[data-theme="dark"] .catalog-primary-key {
    fill: #d8b04c;
}

.feedback-page {
    --feedback-gap: var(--sim-page-content-gap);
}

.feedback-hero {
    margin-bottom: 0;
}

.feedback-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 340px);
    gap: var(--feedback-gap);
    align-items: start;
    margin-top: var(--sim-page-content-gap);
}

.feedback-layout > :is(.standard-container, .standard-fluid-container) {
    margin-top: 0;
}

.feedback-form-card,
.feedback-support-card,
.feedback-result {
    --standard-container-padding-block: 18px;
    --standard-container-padding-inline: 18px;
}

.feedback-form {
    display: grid;
    gap: 14px;
}

.sim-field {
    display: grid;
    gap: 7px;
}

.sim-field__label {
    margin: 0;
    color: var(--sim-text);
    font-size: var(--font-size-sm, 13px);
    font-weight: var(--font-weight-bold, 500);
}

.sim-field__help {
    color: var(--sim-muted);
    font-size: var(--font-size-sm, 13px);
}

.sim-field__error {
    color: var(--text-negative);
    font-size: var(--font-size-sm, 13px);
}

.feedback-message-input {
    min-height: 190px;
    resize: vertical;
}

.sim-field--invalid .form-control,
.form-control[aria-invalid="true"],
.form-select[aria-invalid="true"] {
    border-color: var(--color-negative-30);
}

html[data-theme="dark"] .form-control[aria-invalid="true"],
html[data-theme="dark"] .form-select[aria-invalid="true"] {
    border-color: var(--color-negative-30);
}

.sim-field--invalid .form-control:focus,
.form-control[aria-invalid="true"]:focus,
.form-select[aria-invalid="true"]:focus {
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--color-negative-30) 45%, transparent);
}

html[data-theme] .form-control:disabled,
html[data-theme] .form-select:disabled {
    color: var(--text-disabled);
    background-color: var(--color-input-background-disabled);
    border-color: var(--color-input-border-disabled);
}

html[data-theme] .form-control.is-invalid,
html[data-theme] .form-select.is-invalid,
html[data-theme] .form-control[aria-invalid="true"],
html[data-theme] .form-select[aria-invalid="true"] {
    border-color: var(--color-negative-30);
}

html[data-theme] .form-control:focus,
html[data-theme] .form-select:focus {
    background-color: var(--color-input-background-active);
    border-color: var(--color-input-border-active);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--color-input-border-active) 35%, transparent);
}

html[data-theme] .form-control[aria-invalid="true"]:focus,
html[data-theme] .form-select[aria-invalid="true"]:focus {
    border-color: var(--color-negative-30);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--color-negative-30) 45%, transparent);
}

.feedback-form__actions {
    display: flex;
    justify-content: flex-end;
}

.feedback-submit {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.feedback-submit .material-symbols-outlined {
    width: 18px;
    height: 18px;
    font-size: 18px;
    line-height: 1;
}

.feedback-context-list {
    display: grid;
    gap: 14px;
    margin: 0;
}

.feedback-context-list div {
    min-width: 0;
}

.feedback-context-list dt {
    margin-bottom: 3px;
    color: var(--sim-text);
    font-size: var(--font-size-sm, 13px);
    font-weight: var(--font-weight-bold, 500);
}

.feedback-context-list dd {
    margin: 0;
    color: var(--sim-muted);
    font-size: var(--font-size-sm, 13px);
    line-height: 1.45;
}

.feedback-result-page {
    max-width: 920px;
}

.feedback-result {
    display: flex;
    gap: 16px;
    align-items: flex-start;
}

.feedback-result__icon {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    color: var(--sim-accent-strong);
    background: var(--sim-accent-soft);
    border: 1px solid var(--sim-border);
    border-radius: 4px;
}

.feedback-result__icon .material-symbols-outlined {
    font-size: 24px;
    line-height: 1;
}

.feedback-result__content {
    display: grid;
    gap: 10px;
    min-width: 0;
}

.feedback-result__title {
    margin: 0;
    color: var(--sim-text);
    font-size: 24px;
    font-weight: var(--font-weight-bold, 500);
    line-height: 1.2;
}

.feedback-result__message {
    max-width: 70ch;
    margin: 0;
    color: var(--sim-muted);
    line-height: 1.5;
}

.marketplace-page {
    --marketplace-gap: var(--sim-page-content-gap);
    --marketplace-card-radius: 6px;
}

.marketplace-hero,
.marketplace-filter-card,
.marketplace-standards {
    margin-bottom: var(--marketplace-gap);
}

.marketplace-summary-sim,
.marketplace-solution-tag--sim,
.marketplace-standard-card--sim .marketplace-standard-card__icon {
    color: #d8b04c;
}

.marketplace-summary-sim .material-symbols-outlined,
.catalog-summary__item .material-symbols-outlined {
    width: 16px;
    height: 16px;
    font-size: 16px;
    line-height: 1;
}

.marketplace-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 14px 18px;
    align-items: end;
}

.marketplace-filter-field {
    display: grid;
    gap: 6px;
    min-width: 220px;
}

.marketplace-filter-field--toggle {
    display: flex;
    min-height: 40px;
    min-width: 180px;
    align-items: center;
    gap: 8px;
}

.marketplace-filter-label {
    margin: 0;
    color: var(--sim-text);
    font-size: var(--font-size-sm, 13px);
    font-weight: var(--font-weight-bold, 500);
}

.marketplace-standards {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--marketplace-gap);
}

.marketplace-standard-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 12px;
    padding: 14px 16px;
    color: var(--sim-text);
    background: var(--sim-surface);
    border: 1px solid var(--sim-border);
    border-radius: var(--marketplace-card-radius);
}

.marketplace-standard-card__icon {
    width: 24px;
    height: 24px;
    color: var(--sim-accent-strong);
    font-size: 24px;
    line-height: 1;
}

.marketplace-standard-card h2 {
    margin: 0 0 4px;
    color: var(--sim-text);
    font-size: var(--font-size, 14px);
    font-weight: var(--font-weight-bold, 500);
    line-height: 1.25;
}

.marketplace-standard-card p {
    margin: 0;
    color: var(--sim-muted);
    font-size: var(--font-size-sm, 13px);
    line-height: 1.45;
}

.marketplace-product-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
    gap: var(--marketplace-gap);
}

.marketplace-product-card {
    min-width: 0;
}

.marketplace-product-card__link {
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr) auto;
    gap: 13px;
    height: 100%;
    min-height: 310px;
    padding: 16px;
    color: var(--sim-text);
    background: var(--sim-surface);
    border: 1px solid var(--sim-border);
    border-radius: var(--marketplace-card-radius);
    text-decoration: none;
    transition: border-color .16s ease, background-color .16s ease, transform .16s ease;
}

.marketplace-product-card__link:hover,
.marketplace-product-card__link:focus {
    color: var(--sim-text);
    background: var(--sim-hover-bg);
    border-color: var(--sim-border-strong);
    text-decoration: none;
    transform: translateY(-1px);
}

.marketplace-product-card__meta,
.marketplace-card-action,
.marketplace-solution-tag {
    display: flex;
    align-items: center;
}

.marketplace-product-card__meta {
    flex-wrap: wrap;
    gap: 7px;
}

.marketplace-category-tag,
.marketplace-solution-tag {
    min-height: 24px;
    padding: 3px 7px;
    background: var(--sim-surface-subtle);
    border: 1px solid var(--sim-border);
    border-radius: 4px;
    color: var(--sim-muted);
    font-size: 12px;
    font-weight: var(--font-weight-bold, 500);
    line-height: 1.2;
}

.marketplace-solution-tag {
    gap: 4px;
}

.marketplace-solution-tag .material-symbols-outlined {
    width: 15px;
    height: 15px;
    font-size: 15px;
    line-height: 1;
}

.marketplace-logo-frame {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 92px;
    padding: 14px;
    background: #fff;
    border: 1px solid var(--sim-border);
    border-radius: var(--marketplace-card-radius);
    color: #1f2933;
    font-size: 30px;
    font-weight: var(--font-weight-bold, 500);
}

.marketplace-logo-frame img {
    display: block;
    max-width: 160px;
    max-height: 64px;
    width: auto;
    height: auto;
    object-fit: contain;
}

.marketplace-product-card__body {
    min-width: 0;
}

.marketplace-product-card__body h2 {
    margin: 0;
    color: var(--sim-text);
    font-size: 17px;
    font-weight: var(--font-weight-bold, 500);
    line-height: 1.25;
}

.marketplace-product-card__vendor {
    margin: 5px 0 0;
    color: var(--sim-accent-strong);
    font-size: var(--font-size-sm, 13px);
    font-weight: var(--font-weight-bold, 500);
}

.marketplace-product-card__description {
    display: -webkit-box;
    margin: 9px 0 0;
    overflow: hidden;
    color: var(--sim-muted);
    font-size: var(--font-size-sm, 13px);
    line-height: 1.45;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    -webkit-box-orient: vertical;
}

.marketplace-card-action {
    justify-content: space-between;
    gap: 10px;
    color: var(--sim-accent-strong);
    font-size: var(--font-size-sm, 13px);
    font-weight: var(--font-weight-bold, 500);
}

.marketplace-card-action .material-symbols-outlined {
    width: 17px;
    height: 17px;
    font-size: 17px;
    line-height: 1;
}

.marketplace-empty-state {
    margin-top: var(--marketplace-gap);
}

.marketplace-detail-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 380px);
    gap: var(--marketplace-gap);
    align-items: start;
}

.marketplace-vendor-card,
.marketplace-interest-card {
    --standard-container-padding-block: 18px;
    --standard-container-padding-inline: 18px;
}

.marketplace-vendor-card__body {
    display: grid;
    grid-template-columns: minmax(160px, 240px) minmax(0, 1fr);
    gap: 16px;
    align-items: start;
}

.marketplace-logo-frame--detail {
    width: min(100%, 240px);
    min-height: 120px;
    align-self: start;
}

.marketplace-logo-frame--detail img {
    max-width: 220px;
    max-height: 76px;
}

.marketplace-vendor-facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.marketplace-vendor-link {
    color: var(--sim-accent-strong);
    overflow-wrap: anywhere;
}

.marketplace-interest-form {
    display: grid;
    gap: 12px;
}

.marketplace-interest-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.marketplace-interest-button .material-symbols-outlined {
    width: 18px;
    height: 18px;
    font-size: 18px;
    line-height: 1;
}

.marketplace-interest-status {
    min-height: 20px;
    margin: 0;
    color: var(--sim-muted);
    font-size: var(--font-size-sm, 13px);
    line-height: 1.45;
}

.marketplace-interest-status:empty {
    display: none;
}

@media (max-width: 768px) {
    .catalog-detail-hero__header {
        flex-direction: column;
    }

    .catalog-detail-hero__title {
        font-size: 24px;
    }

    .catalog-detail-hero__actions,
    .catalog-export-actions,
    .catalog-export-actions .dt-buttons {
        width: 100%;
        justify-content: flex-start;
    }

    .catalog-table-card .dt-container .dt-search,
    .catalog-table-card .dt-container .dt-search label,
    .catalog-table-card .dt-container .dt-search input {
        width: 100%;
    }

    .feedback-layout {
        grid-template-columns: 1fr;
    }

    .feedback-form__actions,
    .feedback-submit {
        width: 100%;
    }

    .feedback-submit {
        justify-content: center;
    }

    .feedback-result {
        flex-direction: column;
    }

    .marketplace-standards,
    .marketplace-detail-layout {
        grid-template-columns: 1fr;
    }

    .marketplace-vendor-card__body {
        grid-template-columns: 1fr;
    }

    .marketplace-product-grid {
        grid-template-columns: 1fr;
    }

    .marketplace-filter-field,
    .marketplace-filter-field .sim-select,
    .marketplace-interest-button {
        width: 100%;
    }
}

/* Dark mode enterprise UI standardization */
html[data-theme="dark"] {
    --surface-level-1: #21262B;
    --bs-primary: var(--color-interactive-30);
    --bs-secondary: var(--color-interactive-30);
    --bs-primary-rgb: 72, 184, 188;
    --bs-secondary-rgb: 72, 184, 188;
    --sim-action-bg: var(--color-interactive-30);
    --sim-action-hover-bg: var(--color-interactive-40);
    --sim-action-text: var(--text-on-interactive-30);
    --sim-action-outline-text: var(--text-brand);
    --sim-action-outline-hover-text: var(--text-brand);
}

html[data-theme="dark"] main[role="main"],
html[data-theme="dark"] body,
html[data-theme="dark"] main[role="main"] > .container-fluid {
    background-color: var(--surface-background);
}

html[data-theme="dark"] .card-header,
html[data-theme="dark"] .card-footer,
html[data-theme="dark"] .box,
html[data-theme="dark"] .box-header,
html[data-theme="dark"] .box-body,
html[data-theme="dark"] .alert-light {
    color: var(--text-default);
    background-color: var(--surface-level-1);
    border-color: var(--border-color-10);
}

html[data-theme="dark"] .card-header > *,
html[data-theme="dark"] .box-header > * {
    margin-bottom: 0;
    font-size: inherit;
    line-height: inherit;
}

html[data-theme="dark"] .alert-info,
html[data-theme="dark"] .alert-primary,
html[data-theme="dark"] .alert-success,
html[data-theme="dark"] .alert-warning,
html[data-theme="dark"] .alert-danger {
    color: var(--text-default);
    background-color: var(--color-neutral-10);
    border: 1px solid var(--border-color-10);
}

html[data-theme="dark"] .form-check-input:checked {
    background-color: var(--sim-action-bg);
    border-color: var(--sim-action-bg);
}

html[data-theme="dark"] .feature-image {
    filter: brightness(0) invert(1);
    opacity: .95;
}

html[data-theme="dark"] .card-sim__body.marketplace .logo img,
html[data-theme="dark"] .vendor-logo {
    background-color: var(--white);
    border-radius: 4px;
    padding: .5rem;
}

html[data-theme="dark"] .subpage-navigation__link-arrow {
    color: var(--white);
}

html[data-theme="dark"] .navbar-toggler-icon {
    background-image: url('data:image/svg+xml;utf8,<svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><rect x="4" y="6" width="16" height="2" fill="white"/><rect x="4" y="11" width="16" height="2" fill="white"/><rect x="4" y="16" width="16" height="2" fill="white"/></svg>');
    background-color: transparent;
}

html[data-theme="dark"] .sim-navbar .navbar-toggler,
html[data-theme="dark"] .sim-navbar .navbar-toggler:hover,
html[data-theme="dark"] .sim-navbar .navbar-toggler:focus,
html[data-theme="dark"] .sim-navbar .navbar-toggler:active {
    background-color: transparent;
}

@media (max-width: 1100px) {
    .sim-doc-overview {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .sim-doc-header {
        grid-column: 1 / -1;
    }

    .sim-entity-toolbar {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 768px) {
    .sim-doc-header,
    .sim-doc-card,
    .sim-doc-action-panel,
    .sim-entity-filters,
    .sim-entity-catalogue {
        padding: var(--size-4, 14px);
    }

    .sim-doc-header__content,
    .sim-entity-filters__header,
    .sim-entity-catalogue__header {
        flex-direction: column;
    }

    .sim-doc-overview,
    .sim-entity-toolbar,
    .sim-doc-action-panel {
        grid-template-columns: minmax(0, 1fr);
    }

    .sim-entity-catalogue__hint {
        max-width: none;
        text-align: left;
    }
}

/* Documentation support pages */
.standard-platform-page,
.release-page,
.changelog-page,
.dictionary-page,
.adaptor-support-page,
.adaptor-message-page,
.error-page {
    --support-page-gap: var(--sim-page-content-gap);
}

.standard-platform-note,
.rich-content-card,
.code-example-card,
.release-product-card,
.release-note-card,
.changelog-entry,
.error-state {
    --standard-container-padding-block: 18px;
    --standard-container-padding-inline: 18px;
}

/* Deep-linked announcement (from the What's New dropdown): offset for the
   sticky header and briefly highlight so the target post is easy to spot. */
.changelog-entry {
    scroll-margin-top: 90px;
}

.changelog-entry:target {
    animation: changelog-target-highlight 2.4s ease;
}

@keyframes changelog-target-highlight {
    0%, 15% {
        box-shadow: 0 0 0 2px var(--sim-accent, #2f6fed);
    }
    100% {
        box-shadow: 0 0 0 2px transparent;
    }
}

@media (prefers-reduced-motion: reduce) {
    .changelog-entry:target {
        animation: none;
        box-shadow: 0 0 0 2px var(--sim-accent, #2f6fed);
    }
}

.standard-platform-note {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    margin-bottom: 0;
}

.standard-platform-note .material-symbols-outlined {
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    color: var(--sim-accent-strong);
    font-size: 20px;
    line-height: 1;
}

.standard-platform-note p,
.rich-content-card__body > :last-child,
.release-package-row__body > :last-child,
.release-note-card__body > :last-child,
.changelog-entry__body > :last-child,
.error-state__content > :last-child {
    margin-bottom: 0;
}

.adaptor-message-page .catalog-detail-hero__description :is(i, code) {
    padding: 1px 4px;
    color: var(--sim-text);
    background: var(--sim-surface-subtle);
    border: 1px solid var(--sim-border);
    border-radius: 3px;
    font-family: "Courier New", Courier, monospace;
    font-size: .92em;
    font-style: normal;
    white-space: nowrap;
}

.rich-content-card__body,
.release-note-card__text,
.changelog-entry__body {
    color: var(--sim-text);
    line-height: 1.55;
}

.rich-content-card__body :is(table, pre, blockquote),
.code-example-card pre {
    max-width: 100%;
    overflow-x: auto;
}

.code-example-card {
    margin-top: var(--sim-page-content-gap);
}

.code-example-card pre {
    margin: 0;
    padding: 14px;
    color: var(--sim-text);
    background: var(--sim-surface-subtle);
    border: 1px solid var(--sim-border);
    border-radius: 4px;
}

.release-product-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: var(--support-page-gap);
}

.release-package-list,
.release-timeline,
.changelog-timeline {
    display: grid;
    gap: 12px;
}

.release-package-row {
    display: grid;
    grid-template-columns: minmax(84px, auto) minmax(0, 1fr);
    gap: 12px;
    align-items: start;
    padding: 12px;
    background: var(--sim-surface-subtle);
    border: 1px solid var(--sim-border);
    border-radius: 6px;
}

.release-package-row__type {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 24px;
    padding: 3px 8px;
    color: var(--sim-accent-strong);
    background: var(--sim-accent-soft);
    border: 1px solid var(--sim-border);
    border-radius: 4px;
    font-size: 12px;
    font-weight: var(--font-weight-bold, 500);
    line-height: 1.2;
    white-space: nowrap;
}

.release-package-row--latest .release-package-row__type {
    color: var(--sim-action-text, #061314);
    background: var(--sim-action-bg, var(--sim-accent-strong));
    border-color: var(--sim-action-bg, var(--sim-accent-strong));
}

.release-package-row--vintage .release-package-row__type {
    color: var(--sim-muted);
    background: transparent;
}

.release-package-row__body h3,
.release-note-card__body h2,
.changelog-entry__title,
.error-state__title {
    margin: 0;
    color: var(--sim-text);
    font-weight: var(--font-weight-bold, 500);
    line-height: 1.25;
}

.release-package-row__body h3,
.changelog-entry__title {
    font-size: 17px;
}

.release-package-row__body p,
.release-note-card__publisher,
.changelog-entry__date,
.error-state__message {
    margin: 4px 0 0;
    color: var(--sim-muted);
    font-size: var(--font-size-sm, 13px);
    line-height: 1.45;
}

.release-timeline,
.changelog-timeline {
    position: relative;
}

.release-note-card {
    display: grid;
    grid-template-columns: minmax(128px, 180px) minmax(0, 1fr);
    gap: 16px;
}

.release-note-card__meta {
    display: flex;
    flex-direction: column;
    gap: 8px;
    color: var(--sim-muted);
    font-size: var(--font-size-sm, 13px);
}

.release-note-card__support {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    margin-top: 8px;
}

.release-note-card__text {
    margin-top: 12px;
}

.changelog-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(240px, 320px);
    gap: var(--support-page-gap);
    align-items: start;
}

.changelog-timeline {
    min-width: 0;
    outline: 0;
}

.changelog-entry__date {
    margin: 0 0 6px;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.changelog-entry__title {
    display: flex;
    gap: 8px;
    align-items: center;
}

.changelog-entry__title .edit a {
    display: inline-flex;
    color: var(--sim-accent-strong);
    text-decoration: none;
}

.changelog-entry__body {
    margin-top: 10px;
}

.changelog-toc {
    position: sticky;
    top: calc(var(--sim-navbar-height) + var(--sim-breadcrumb-height) + 16px);
}

.changelog-toc__title {
    margin: 0 0 10px;
    color: var(--sim-text);
    font-size: var(--font-size, 14px);
    font-weight: var(--font-weight-bold, 500);
}

.changelog-toc .nav-link {
    padding: 6px 0 6px 10px;
    color: var(--sim-muted);
    border-left: 2px solid transparent;
    font-size: var(--font-size-sm, 13px);
    line-height: 1.35;
    text-decoration: none;
}

.changelog-toc .nav-link:hover,
.changelog-toc .nav-link:focus,
.changelog-toc .nav-link.active {
    color: var(--sim-accent-strong);
    border-left-color: var(--sim-accent-strong);
    text-decoration: none;
}

.error-page {
    display: flex;
    justify-content: center;
    padding-top: 0;
}

.error-page > .error-state {
    margin-top: 0;
}

.error-state {
    display: flex;
    width: min(100%, 760px);
    gap: 18px;
    align-items: flex-start;
}

.error-state__icon {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    color: var(--sim-accent-strong);
    background: var(--sim-accent-soft);
    border: 1px solid var(--sim-border);
    border-radius: 6px;
}

.error-state__icon .material-symbols-outlined {
    font-size: 28px;
    line-height: 1;
}

.error-state__content {
    display: grid;
    gap: 10px;
    min-width: 0;
}

.error-state__title {
    font-size: 28px;
}

@media (max-width: 768px) {
    .release-package-row,
    .release-note-card,
    .changelog-layout {
        grid-template-columns: minmax(0, 1fr);
    }

    .release-note-card__meta {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .error-page {
        padding-top: 12px;
    }

    .error-state {
        flex-direction: column;
    }
}

.sim-skip-link {
    position: fixed;
    top: 8px;
    left: 8px;
    z-index: 2101;
    transform: translateY(calc(-100% - 16px));
    padding: 8px 12px;
    color: var(--sim-action-text, #061314);
    background: var(--sim-action-bg, var(--green-40));
    border-radius: 4px;
    font-weight: var(--font-weight-bold, 500);
    text-decoration: none;
    transition: transform .15s ease;
}

.sim-skip-link:focus,
.sim-skip-link:focus-visible {
    transform: translateY(0);
    color: var(--sim-action-text, #061314);
    text-decoration: none;
    outline: 2px solid var(--color-focus-10, var(--green-70));
    outline-offset: 2px;
}

:is(a, button, .btn, [role="button"], input, select, textarea):focus-visible {
    outline: 2px solid var(--color-focus-10, var(--green-70));
    outline-offset: 2px;
    box-shadow: none;
}

#main-content:focus-visible {
    outline: 2px solid var(--color-focus-10, var(--green-70));
    outline-offset: -2px;
}

/* -------------------------------------------------------------------------- */
/* What's New announcement centre                                             */
/* -------------------------------------------------------------------------- */

/* Preserve the readable measure now that the SIM entities header wraps its
   text in a heading column beside the Release notes action. */
.sim-doc-header__heading > .sim-doc-eyebrow,
.sim-doc-header__heading > h1,
.sim-doc-header__heading > .sim-doc-lede {
    max-width: var(--readable-width, 80ch);
}

/* Campaign trigger + unread badge */
.navbar-whats-new {
    position: relative;
}

.navbar-whats-new .nav-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.sim-badge--count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    min-width: var(--dimension-14);
    height: var(--dimension-14);
    padding-inline: var(--padding-xs);
    font-family: var(--typography-small-font-family);
    font-size: var(--typography-small-font-size);
    font-weight: var(--typography-small-font-weight);
    line-height: var(--typography-small-line-height);
    white-space: nowrap;
}

.sim-badge--primary {
    color: var(--text-on-interactive-30);
    background: var(--color-interactive-30);
    border: var(--border-width-10) solid var(--color-interactive-30);
    border-radius: var(--radius-999);
}

.navbar-notification-badge {
    position: absolute;
    top: 5px;
    right: 4px;
    z-index: 1;
    pointer-events: none;
}

/* Dropdown shell — self-contained design tokens so the panel renders
   correctly outside the .catalog-page token scope, in light and dark. */
.navbar-whats-new__menu {
    --sim-surface: var(--white, #fff);
    --sim-surface-subtle: var(--gray-10, #f6f6f6);
    --sim-border: var(--gray-20, #e6e6e6);
    --sim-border-strong: var(--gray-30, #bebebe);
    --sim-text: var(--gray-100, #191919);
    --sim-muted: var(--gray-70, #595959);
    --sim-accent: var(--green-70, #16746F);
    --sim-accent-strong: var(--green-80, #13645F);
    --sim-accent-soft: var(--green-10, #C7E9E7);
    width: min(384px, calc(100vw - 24px));
    max-height: min(74vh, 580px);
    margin-top: 10px;
    padding: 0;
    overflow: hidden;
    color: var(--sim-text);
    background: var(--sim-surface);
    border: 1px solid var(--sim-border);
    border-radius: 14px;
    box-shadow: 0 18px 44px rgba(19, 26, 34, .18), 0 2px 8px rgba(19, 26, 34, .08);
}

[data-theme="dark"] .navbar-whats-new__menu {
    --sim-surface: var(--surface-raised, #293138);
    --sim-surface-subtle: var(--color-neutral-10, #1f252b);
    --sim-border: var(--border-color-10, #3b3b3b);
    --sim-border-strong: var(--border-color-30, #55605a);
    --sim-text: var(--text-default, #eef1f3);
    --sim-muted: var(--text-muted, #a7b0b6);
    --sim-accent: var(--color-interactive-30, #48B8BC);
    --sim-accent-strong: var(--color-link-20, #6fd0cf);
    --sim-accent-soft: var(--color-interactive-10, #21343a);
    box-shadow: 0 22px 50px rgba(0, 0, 0, .55);
}

.whats-new-menu__header {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
    padding: 14px 18px 12px;
    border-bottom: 1px solid var(--sim-border);
}

.whats-new-menu__title {
    margin: 0;
    color: var(--sim-text);
    font-size: 15px;
    font-weight: var(--font-weight-bolder, 600);
    line-height: 1.2;
}

.whats-new-menu__hint {
    color: var(--sim-muted);
    font-size: var(--font-size-xs, 11px);
    font-weight: var(--font-weight-bold, 500);
    letter-spacing: .04em;
    text-transform: uppercase;
}

.whats-new-preview {
    max-height: min(56vh, 420px);
    padding: 4px 0;
    overflow-y: auto;
    overscroll-behavior: contain;
}

/* Loading / error / empty states */
.whats-new-preview__state {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 22px 18px;
    color: var(--sim-muted);
    font-size: var(--font-size-sm, 13px);
}

.whats-new-preview__state::before {
    content: "";
    flex: 0 0 auto;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--sim-accent);
    opacity: .55;
}

@media (prefers-reduced-motion: no-preference) {
    .whats-new-preview__state:not(.whats-new-preview__state--error)::before {
        animation: whats-new-blink 1.1s ease-in-out infinite;
    }
}

@keyframes whats-new-blink {
    0%, 100% { opacity: .25; transform: scale(.85); }
    50% { opacity: .8; transform: scale(1); }
}

.whats-new-preview__state--error {
    color: var(--sim-text);
}

.whats-new-preview__state--error::before {
    background: var(--whats-new-dot, #e5484d);
    opacity: 1;
}

.navbar-whats-new__menu .whats-new-preview__list {
    display: block;
    width: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
    text-align: left;
}

.navbar-whats-new__menu .whats-new-preview__item {
    position: relative;
    display: block;
    width: 100%;
    margin: 0;
    padding: 10px 18px 12px;
    border-top: 1px solid var(--sim-border);
    transition: background-color .14s ease;
}

.whats-new-preview__item:first-child {
    border-top: none;
}

.whats-new-preview__item:hover {
    background: var(--sim-list-item-hover-bg);
}

.whats-new-preview__item--new {
    box-shadow: inset 3px 0 0 var(--sim-accent);
}

.whats-new-preview__meta,
.announcement-card__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-bottom: 7px;
}

/* The dropdown preview is dense: keep the chip row compact and close to the title. */
.whats-new-preview__meta {
    gap: 6px;
    margin-bottom: 3px;
}

.whats-new-preview .announcement-area-chip {
    padding: 0 8px;
    font-size: 10.5px;
    line-height: 1.55;
}

.whats-new-preview__date,
.changelog-entry__date {
    margin-left: auto;
    color: var(--sim-muted);
    font-size: var(--font-size-xs, 11px);
    white-space: nowrap;
}

.announcement-card__meta .changelog-entry__date {
    font-size: 12.5px;
}

.whats-new-preview__title {
    margin: 0 0 3px;
    color: var(--sim-text);
    font-weight: var(--font-weight-bolder, 600);
    font-size: var(--font-size, 0.875rem);
    line-height: 1.35;
}

.whats-new-preview__summary {
    display: -webkit-box;
    margin: 0;
    overflow: hidden;
    color: var(--sim-muted);
    font-size: 13px;
    line-height: 1.45;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
}

.whats-new-preview__cta {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-top: 8px;
    color: var(--sim-accent-strong);
    font-size: 13px;
    font-weight: var(--font-weight-bold, 500);
    text-decoration: none;
    /* Sit above the title's stretched-link overlay so the CTA stays clickable. */
    position: relative;
    z-index: 1;
}

.whats-new-preview__cta::after {
    content: "arrow_forward";
    font-family: "Material Symbols Outlined", sans-serif;
    font-size: 15px;
    line-height: 1;
}

.whats-new-preview__cta:hover,
.whats-new-preview__cta:focus {
    color: var(--sim-text);
    text-decoration: none;
}

.whats-new-preview__empty {
    padding: 26px 18px;
    color: var(--sim-muted);
    font-size: var(--font-size-sm, 13px);
    text-align: center;
    list-style: none;
}

/* Whole preview item is a link to its full post (stretched-link pattern). The
   title carries the real anchor for assistive tech; the ::after overlay makes
   the entire card clickable. The row's hover background is the affordance, so
   the title shifts colour on hover rather than underlining. */
.whats-new-preview__title-link {
    color: inherit;
    text-decoration: none;
}

.whats-new-preview__title-link::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
}

.whats-new-preview__item:hover .whats-new-preview__title-link {
    color: var(--sim-accent-strong);
}

.whats-new-preview__title-link:focus-visible {
    outline: 2px solid var(--sim-accent-strong);
    outline-offset: 2px;
    border-radius: 4px;
}

.whats-new-preview__footer {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 12px 16px;
    color: var(--sim-accent-strong);
    font-size: 13px;
    font-weight: var(--font-weight-bold, 500);
    text-align: center;
    text-decoration: none;
    background: var(--sim-surface-subtle);
    border-top: 1px solid var(--sim-border);
}

.whats-new-preview__footer::after {
    content: "arrow_forward";
    font-family: "Material Symbols Outlined", sans-serif;
    font-size: 16px;
    line-height: 1;
    transition: transform .14s ease;
}

.whats-new-preview__footer:hover,
.whats-new-preview__footer:focus {
    color: var(--sim-text);
    background: var(--sim-list-item-hover-bg);
    text-decoration: none;
}

.whats-new-preview__footer:hover::after {
    transform: translateX(2px);
}

/* Shared announcement tags and statuses (dropdown + full page) */
.announcement-status-pill {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 9px;
    font-size: 10.5px;
    font-weight: var(--font-weight-bolder, 600);
    letter-spacing: .05em;
    line-height: 1.5;
    text-transform: uppercase;
    border-radius: 999px;
}

.announcement-area-chip {
    padding: 2px 10px;
    font-size: var(--font-size-xs, 11px);
    font-weight: var(--font-weight-bold, 500);
}

/* Internal-only marker: reuses the "verified_user" guard icon and teal accent
   from .sim-internal-note so employee-only announcements read as not-for-clients. */
.announcement-internal-chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 9px 2px 7px;
    color: #2f5053;
    background: #e3f2f2;
    border-radius: 999px;
    font-size: var(--font-size-xs, 11px);
    font-weight: var(--font-weight-bolder, 600);
    line-height: 1.5;
    white-space: nowrap;
}

.announcement-internal-chip .material-symbols-outlined {
    font-size: 14px;
    line-height: 1;
}

[data-theme="dark"] .announcement-internal-chip {
    color: var(--sim-accent-strong);
    background: var(--sim-accent-soft);
}

/* ============================================================
   What's New page — chronological announcement feed
   ============================================================ */
.changelog-feed {
    display: flex;
    flex-direction: column;
    gap: var(--sim-page-content-gap);
    max-width: 860px;
    margin-top: var(--sim-page-content-gap);
}

.changelog-feed > .standard-container {
    margin-top: 0;
}

.announcement-card {
    position: relative;
    transition: border-color .14s ease, box-shadow .14s ease;
}

.announcement-card--new {
    border-color: var(--sim-accent-soft);
    box-shadow: inset 4px 0 0 var(--sim-accent);
}

.announcement-card .changelog-entry__title {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 2px 0 8px;
    font-size: 18px;
    line-height: 1.3;
}

/* Full-page cards use larger, better-balanced labels than the dense dropdown
   preview (which keeps its compact sizing). */
.announcement-card__meta {
    gap: 10px;
    margin-bottom: 12px;
}

.announcement-card .announcement-area-chip {
    padding: 4px 13px;
    font-size: 12.5px;
}

.announcement-card .announcement-status-pill {
    padding: 4px 12px;
    font-size: 11.5px;
}

.announcement-card .announcement-status-pill::before {
    width: 7px;
    height: 7px;
}

.announcement-card .announcement-internal-chip {
    padding: 4px 13px 4px 10px;
    font-size: 12px;
}

.announcement-card .announcement-internal-chip .material-symbols-outlined {
    font-size: 16px;
}

.announcement-card__cta {
    margin-top: 14px;
}

.announcement-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 22px;
    margin-bottom: var(--sim-page-content-gap);
}

/* Pull the "N updates" summary up toward the description and give the filter
   pills below it room to breathe (changelog page only). */
.changelog-page .catalog-summary {
    margin-top: 2px;
}

.announcement-filter-chip {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 4px 14px;
    color: var(--sim-muted);
    background: var(--sim-surface);
    border: 1px solid var(--sim-border);
    border-radius: 999px;
    font-size: var(--font-size-sm, 13px);
    font-weight: var(--font-weight-bold, 500);
    text-decoration: none;
    transition: color .14s ease, background-color .14s ease, border-color .14s ease;
}

.announcement-filter-chip:hover,
.announcement-filter-chip:focus {
    color: var(--sim-text);
    background: var(--sim-hover-bg);
    border-color: var(--sim-border-strong);
    text-decoration: none;
}

.announcement-filter-chip--active,
.announcement-filter-chip--active:hover,
.announcement-filter-chip--active:focus {
    color: var(--text-on-interactive-30);
    background: var(--color-interactive-30);
    border-color: var(--color-interactive-30);
}

.announcement-pagination {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px;
    margin-top: 22px;
    max-width: 860px;
}

.announcement-pagination__status {
    color: var(--sim-muted);
    font-size: var(--font-size-sm, 13px);
}

.whats-new-markseen-form {
    margin: 0;
}

@media (max-width: 575.98px) {
    .navbar-whats-new__menu {
        width: calc(100vw - 20px);
    }

    .announcement-card__meta,
    .whats-new-preview__meta {
        gap: 6px;
    }

    .whats-new-preview__date,
    .changelog-entry__date {
        margin-left: 0;
    }
}