/* Visual identity. Layout mechanics and component behavior remain in app.css. */
body.itc-wasm {
    --itc-blue: #2563eb;
    --itc-blue-dark: #1d4ed8;
    --itc-blue-soft: #edf3ff;
    --itc-blue-line: #cbdcfb;
    --itc-page: #f4f7fc;
    --itc-text: #1b2b45;
    --itc-muted: #65748b;
    --itc-border: #e3e9f2;
    --itc-sidebar-w: 260px;
    --itc-header-h: 76px;
    --itc-radius: 16px;
    --rz-text-color: var(--itc-text);
    --rz-text-secondary-color: var(--itc-muted);
    --rz-button-border-radius: 10px;
    --rz-grid-stripe-background-color: #fff;
    background: var(--itc-page);
}
.itc-wasm .itc-admin-layout { background: radial-gradient(ellipse at 90% 0, #eaf0ff 0, transparent 40%), var(--itc-page); }
.itc-wasm .itc-page-content { padding: 32px clamp(20px, 2.4vw, 40px) 48px; }
.itc-wasm :where(h1, .rz-text-h5) { color: #162842; font-weight: 750; letter-spacing: -.035em; }
.itc-wasm .rz-card { border-color: var(--itc-border); border-radius: 16px; box-shadow: 0 4px 24px #19345405, 0 1px 2px #19345403; }
.itc-wasm .itc-eyebrow { display: block; margin-bottom: 14px; color: #5d7292; font-size: 10px; font-weight: 750; line-height: 1.5; letter-spacing: .16em; }

/* A calm work surface, framed by a distinct navigation rail. */
.itc-wasm .itc-sidebar { background: linear-gradient(175deg, #102441 0%, #0e1d34 100%); border: 0; color: #d7e2f3; }
.itc-wasm .itc-brand-row { padding: 26px 22px 20px; min-height: 144px; border-bottom: 1px solid #ffffff0d; }
.itc-wasm .itc-brand { flex-direction: column; align-items: flex-start; gap: 12px; text-decoration: none; }
.itc-wasm .itc-brand-mark { display: flex; align-items: center; justify-content: center; padding: 12px 16px; background: #fff; border-radius: 12px; box-shadow: 0 5px 18px #06112426; }
.itc-wasm .itc-brand img { width: 158px; height: 42px; }
.itc-wasm .itc-brand-caption { color: #aabbd3; font-size: 10px; font-weight: 500; letter-spacing: .04em; }
.itc-wasm .itc-nav-shell { padding: 24px 14px; }
.itc-wasm .itc-nav-label { color: #8ca2c1; font-size: 10px; letter-spacing: .14em; padding: 0 14px 14px; }
.itc-wasm .itc-panel-menu .rz-navigation-item-wrapper { color: #c8d7ec; margin: 4px 0; border-radius: 10px; }
.itc-wasm .itc-panel-menu .rz-navigation-item-link { min-height: 46px; padding: 12px 14px; border-radius: 10px; font-size: 13px; font-weight: 500; }
.itc-wasm .itc-panel-menu .rz-navigation-item-icon { color: #8fa8cd; font-size: 21px; }
.itc-wasm .itc-panel-menu .rz-navigation-item-wrapper:hover { background: #ffffff0a; color: #fff; }
.itc-wasm .itc-panel-menu .rz-navigation-menu { padding: 0 0 4px 12px; }
.itc-wasm .itc-panel-menu .rz-navigation-menu .rz-navigation-item-link { font-size: 12px; }
.itc-wasm .itc-panel-menu .rz-navigation-item-wrapper-active,
.itc-wasm .itc-panel-menu .rz-navigation-item-link.rz-state-active,
.itc-wasm .itc-panel-menu .rz-navigation-item-active > .rz-navigation-item-wrapper { background: #2563eb; color: #fff; box-shadow: 0 4px 12px #081d4740; }
.itc-wasm .itc-panel-menu .rz-navigation-item-wrapper-active .rzi,
.itc-wasm .itc-panel-menu .rz-navigation-item-active > .rz-navigation-item-wrapper .rzi { color: #fff; }
.itc-wasm .itc-sidebar :focus-visible { outline-color: #9bc0ff; }
.itc-wasm .itc-sidebar .itc-menu-close { color: #d7e2f3; }
.itc-wasm .itc-sidebar .itc-menu-close:hover { background: #ffffff14; }
.itc-wasm .itc-sidebar-footer { margin: 0 22px; padding: 22px 0 24px; border-top: 1px solid #ffffff12; }
.itc-wasm .itc-sidebar-footer-name { display: block; color: #d5e2f5; font-size: 11px; font-weight: 700; letter-spacing: .12em; }
.itc-wasm .itc-sidebar-footer-copy { display: block; margin-top: 5px; font-size: 11px; color: #8fa6c5; }
.itc-wasm .itc-topbar { background: #ffffffed; color: var(--itc-text); border-bottom: 1px solid var(--itc-border); backdrop-filter: blur(14px); }
.itc-wasm .itc-topbar-inner { padding-inline: clamp(20px, 2.4vw, 40px); }
.itc-wasm .itc-topbar-copy { display: grid; gap: 3px; }
.itc-wasm .itc-topbar-eyebrow { color: var(--itc-muted); font-size: 10px; letter-spacing: .08em; }
.itc-wasm .itc-topbar-title { font-size: 13px; color: #263c5b; font-weight: 650; }
.itc-wasm .itc-user-name { font-size: 12px; font-weight: 650; }
.itc-wasm .itc-user-role { font-size: 11px; color: var(--itc-muted); }
.itc-wasm .itc-profile-menu { color: var(--itc-text); }
.itc-wasm .itc-profile-menu > .rz-navigation-item > .rz-navigation-item-wrapper .rzi { color: var(--itc-muted); }
.itc-wasm .itc-avatar-wrap { width: 40px; height: 40px; border: 3px solid #edf3fc; background: #dbe7ff; }
.itc-wasm .itc-topbar .itc-icon-button:hover { background: var(--itc-blue-soft); }
.itc-wasm .itc-topbar :focus-visible { outline-color: var(--itc-blue); }

/* Consistent tactile controls, with visible keyboard focus. */
.itc-wasm .rz-button { border-radius: 10px; font-weight: 600; letter-spacing: 0; transition: background-color .16s, border-color .16s, box-shadow .16s; }
.itc-wasm .rz-button.rz-primary { background: linear-gradient(180deg, #2c70f4, #235fe0); border: 1px solid #215ad0; box-shadow: 0 4px 10px #2563eb22, inset 0 1px #ffffff26; }
.itc-wasm .rz-button.rz-primary:hover:not(:disabled) { background: #1d55ce; box-shadow: 0 6px 14px #2563eb30; }
.itc-wasm .rz-button.rz-light { background: #fff; border-color: #dce4f0; color: #4a5f7d; }
.itc-wasm .rz-form-field .rz-form-field-label { color: #536783; font-size: 11px; font-weight: 600; }
.itc-wasm .rz-form-field-content > :is(.rz-textbox, .rz-inputtext, .rz-textarea, .rz-password, .rz-dropdown, .rz-multiselect, .rz-spinner, .rz-datepicker) { border-color: #dce5f1; border-radius: 10px; background: #fbfcfe; }
.itc-wasm .rz-form-field-content > :is(.rz-textbox, .rz-inputtext, .rz-textarea, .rz-password, .rz-dropdown, .rz-multiselect, .rz-spinner, .rz-datepicker):hover { border-color: #b7cae5; }
.itc-wasm .badge-ok, .itc-wasm .badge-off { gap: 6px; border-radius: 20px; padding: 4px 10px; font-size: 11px; line-height: 1.5; }
.itc-wasm .badge-ok { background: #eaf7f0; color: #207454; }
.itc-wasm .badge-off { background: #f0f2f6; color: #61728b; }
.itc-wasm .badge-ok::before, .itc-wasm .badge-off::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: currentColor; flex-shrink: 0; }
.itc-wasm .rz-dropdown-panel, .itc-wasm .rz-multiselect-panel { border: 1px solid var(--itc-border); border-radius: 12px; box-shadow: 0 14px 40px #17335320; }

/* Catalog: strong titles, a clear filter area and record identities. */
.itc-wasm .itc-catalog-page .itc-page-heading { gap: 20px; margin-bottom: 4px; }
.itc-wasm .itc-catalog-heading-copy { flex: 1 1 380px; min-width: 0; }
.itc-wasm .itc-catalog-title-row { display: flex; align-items: center; gap: 16px; }
.itc-wasm .itc-catalog-title-row > div { min-width: 0; }
.itc-wasm .itc-catalog-title-row h1 { margin: 0; font-size: clamp(26px, 2.1vw, 34px); line-height: 1.2; font-weight: 750; }
.itc-wasm .itc-catalog-title-row p { margin: 8px 0 0; color: var(--itc-muted); font-size: 13px; line-height: 1.55; }
.itc-wasm .itc-heading-icon { display: grid; place-items: center; flex: 0 0 58px; width: 58px; height: 58px; background: #e5edfc; color: #2a63c8; border: 1px solid #dbe6fb; border-radius: 17px; box-shadow: inset 0 1px #ffffffb3; }
.itc-wasm .itc-heading-icon .rzi { font-size: 27px; }
.itc-wasm .itc-catalog-page .itc-page-heading > .rz-button { align-self: flex-end; margin-bottom: 5px; padding-inline: 18px; min-height: 46px; }
.itc-wasm .itc-catalog-filters { padding: 20px 24px 24px; }
.itc-wasm .itc-filter-heading { display: flex; align-items: center; gap: 8px; margin-bottom: 16px; font-size: 12px; font-weight: 650; color: #405775; }
.itc-wasm .itc-filter-heading .rzi { color: #6484b2; font-size: 19px; }
.itc-wasm .itc-catalog-filters .rz-form-field-content > :is(.rz-dropdown, .rz-textbox) { height: 44px; min-height: 44px; }
.itc-wasm .itc-collection-header { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 23px 24px; border-bottom: 1px solid var(--itc-border); }
.itc-wasm .itc-collection-header h2 { margin: 0; font-size: 15px; font-weight: 700; letter-spacing: -.015em; }
.itc-wasm .itc-collection-header p { margin: 5px 0 0; color: var(--itc-muted); font-size: 11px; }
.itc-wasm .itc-collection-status, .itc-wasm .itc-collection-label { display: inline-flex; align-items: center; gap: 7px; padding: 7px 11px; border: 1px solid #e7edf6; border-radius: 7px; font-size: 11px; color: #566f92; background: #fafcff; white-space: nowrap; }
.itc-wasm .itc-collection-status > span { width: 5px; height: 5px; border-radius: 50%; background: #588ac9; }
.itc-wasm .itc-catalog-grid { border-radius: 0; --rz-grid-header-cell-padding: 13px 12px; }
.itc-wasm .itc-categories-grid { --itc-catalog-width: 1182px; }
.itc-wasm .itc-brands-grid { --itc-catalog-width: 976px; }
.itc-wasm .itc-products-grid { --itc-catalog-width: 1216px; }
.itc-wasm .itc-catalog-grid .rz-grid-table th { background: #f7f9fd; border-color: #e9edf5; }
.itc-wasm .itc-catalog-grid .rz-column-title { color: #586b88; font-size: 11px; font-weight: 650; letter-spacing: .01em; text-transform: none; }
.itc-wasm .itc-catalog-grid .rz-grid-table td { padding: 14px 16px; border-color: #edf1f7; }
.itc-wasm .itc-catalog-grid .rz-grid-table tbody tr:not(.rz-state-highlight) > td { background: #fff; }
.itc-wasm .itc-catalog-grid .rz-grid-table tbody tr:hover:not(.rz-state-highlight) > td { background: #f7faff; }
.itc-wasm .itc-record-identity { display: flex; align-items: center; gap: 13px; min-width: 0; }
.itc-wasm .itc-catalog-image { width: 48px; height: 48px; flex: 0 0 48px; border-radius: 12px; background: #f7f9fc; border-color: #e7edf6; padding: 6px; }
.itc-wasm .itc-catalog-image .rzi { color: #829abd; font-size: 23px; }
.itc-wasm .itc-record-link { padding: 0; border: 0; border-radius: 3px; background: transparent; color: #294362; font: 600 13px/1.55 var(--itc-font); text-align: left; text-decoration: none; overflow-wrap: anywhere; cursor: pointer; }
.itc-wasm .itc-record-link:hover { color: var(--itc-blue); text-decoration: underline; text-underline-offset: 3px; }
.itc-wasm .itc-catalog-grid .itc-wrap-cell .rz-cell-data { font-size: 12px; color: #536985; }
.itc-wasm .itc-catalog-grid .itc-muted-cell .rz-cell-data { color: #657894; font-size: 12px; }
.itc-wasm .itc-catalog-grid .itc-number-cell .rz-cell-data { font-size: 12px; font-weight: 550; }
.itc-wasm .itc-catalog-grid td.itc-state-cell, .itc-wasm .itc-catalog-grid td.itc-actions-cell { padding-inline: 10px; }
.itc-wasm .itc-catalog-grid .itc-actions-cell .rz-cell-data { gap: 7px; }
.itc-wasm .itc-catalog-grid .itc-actions-cell .rz-button { border-radius: 9px; box-shadow: none; }
.itc-wasm .itc-catalog-grid .itc-grid-edit { background: #eff5ff; color: #3774d5; }
.itc-wasm .itc-catalog-grid .itc-grid-delete { background: #fff; color: #9aa7b8; border-color: #e6ebf2; }
.itc-wasm .itc-catalog-grid .itc-grid-delete:hover { background: #fff1ef; color: #b42318; border-color: #f4c8c2; }
.itc-wasm .itc-featured-mark, .itc-wasm .itc-featured-muted { display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 8px; }
.itc-wasm .itc-featured-mark { color: #b77a16; background: #fff5df; }
.itc-wasm .itc-featured-muted { color: #b2bfd0; }
.itc-wasm .itc-stock-empty { background: #fff3ee; color: #b6643d; padding: 3px 8px; }
.itc-wasm .itc-catalog-grid .rz-pager { padding: 16px 20px; }
.itc-wasm .rz-pager-element { border-radius: 9px; font-size: 12px; }
.itc-wasm .itc-catalog-grid .rz-pager-element.rz-state-active { background: var(--itc-blue); color: #fff; box-shadow: 0 3px 8px #2563eb20; }
.itc-wasm .itc-catalog-card .itc-table-hint { display: none; align-items: center; gap: 7px; font-size: 11px; color: #687f9e; background: #fbfcff; padding: 10px 16px; }
.itc-wasm .itc-table-hint .rzi { font-size: 17px; }
@container (max-width: 1181.98px) { .itc-wasm .itc-categories-card .itc-table-hint { display: flex; } }
@container (max-width: 975.98px) { .itc-wasm .itc-brands-card .itc-table-hint { display: flex; } }
@container (max-width: 1215.98px) { .itc-wasm .itc-products-card .itc-table-hint { display: flex; } }

@media (max-width: 1023.98px) {
    .itc-wasm .itc-topbar-inner { padding-inline: 20px; }
    .itc-wasm .itc-sidebar { max-width: 300px; }
}
@media (max-width: 767.98px) {
    .itc-wasm .itc-page-content { padding: 24px 16px 36px; }
    .itc-wasm .itc-catalog-heading-copy { flex-basis: 100%; }
    .itc-wasm .itc-catalog-page .itc-page-heading > .rz-button { flex: 1 1 100%; margin: 0; }
    .itc-wasm .itc-catalog-title-row { gap: 12px; }
    .itc-wasm .itc-heading-icon { width: 48px; height: 48px; flex-basis: 48px; border-radius: 14px; }
    .itc-wasm .itc-catalog-filters { padding: 18px; }
    .itc-wasm .itc-collection-header { padding: 18px; flex-wrap: wrap; gap: 10px; }
    .itc-wasm .itc-collection-status, .itc-wasm .itc-collection-label { font-size: 10px; }
    .itc-wasm .itc-catalog-grid .rz-pager { padding: 14px 12px; }
}
@media (max-width: 479.98px) {
    .itc-wasm .itc-topbar-inner { padding-inline: 12px; }
    .itc-wasm .itc-page-content { padding-inline: 12px; }
    .itc-wasm .itc-topbar-title { font-size: 12px; }
    .itc-wasm .itc-catalog-title-row p { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) {
    .itc-wasm .rz-button { transition: none; }
}

/* Keep row actions within reach while wide desktop tables scroll. */
@media (min-width: 1024px) {
    .itc-wasm .itc-catalog-grid td.itc-actions-cell,
    .itc-wasm .itc-catalog-grid th.itc-actions-heading { position: sticky; right: 0; z-index: 2; box-shadow: -1px 0 #e3e9f2, -8px 0 16px -12px #27466a55; }
    .itc-wasm .itc-catalog-grid th.itc-actions-heading { z-index: 3; }
}

.itc-wasm .itc-catalog-grid .rz-grid-table th .rz-column-title { padding-inline: 0; overflow: visible; }
.itc-wasm .itc-catalog-grid .rz-sortable-column-icon.rzi-sort:not(.rzi-sort-asc):not(.rzi-sort-desc) { display: none; }