/* Intranet shell overrides — loaded after Bootstrap/theme so these win. */

/*
 * Bridge client brand (--primary from app.{client}.css) into Intranet tokens.
 * Must live in this global file (not Blazor scoped CSS): scoped :root never matches,
 * so header/admin fell back to #2563eb even when --primary was set.
 */
:root {
    --il-primary: var(--primary, #2563eb);
    --il-primary-soft: color-mix(in srgb, var(--il-primary) 10%, white);
    --il-primary-disabled: color-mix(in srgb, var(--il-primary) 22%, white);
    --il-primary-border: color-mix(in srgb, var(--il-primary) 28%, white);
    --il-primary-hover: var(--active, var(--il-primary));
}

.il-reader-shell {
    --il-navbar-height: 64px;
    --il-reader-gutter: 40px;
    flex: 1 1 auto;
    min-height: 0;
    width: 100%;
    max-width: 100%;
    align-self: stretch;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.article-container:has(.il-reader-shell) {
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

article.content:has(.il-reader-shell) {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.il-reader-shell > .il-main {
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    overflow-y: auto;
    overflow-x: hidden;
    max-width: none !important;
    width: 100%;
    margin: 0;
    padding: 75px var(--il-reader-gutter) 56px;
    scroll-padding-top: 16px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: stretch;
}

.il-reader-shell > .il-main > * {
    width: 100%;
    max-width: none;
    min-width: 0;
    box-sizing: border-box;
}

.il-reader-shell .il-navbar {
    flex-shrink: 0;
    position: sticky;
    top: 0;
    z-index: 1100;
}

@media (max-width: 768px) {
    .il-reader-shell {
        --il-navbar-height: 72px;
        --il-reader-gutter: 20px;
    }

    .il-reader-shell > .il-main {
        padding: 20px var(--il-reader-gutter) 40px;
    }
}

/* Disabled outline buttons: gray fill (theme defaults leave bg transparent/white). */
.btn-outline-primary.disabled,
.btn-outline-primary:disabled,
fieldset:disabled .btn-outline-primary,
.btn-outline-danger.disabled,
.btn-outline-danger:disabled,
fieldset:disabled .btn-outline-danger {
    --bs-btn-disabled-color: #6c757d;
    --bs-btn-disabled-bg: #e9ecef;
    --bs-btn-disabled-border-color: #adb5bd;
    --bs-btn-disabled-opacity: 1;
    color: #6c757d !important;
    background-color: #e9ecef !important;
    border-color: #adb5bd !important;
    opacity: 1 !important;
    box-shadow: none !important;
}

/* Admin hub + nav: force client brand (wins over hardcoded blues in app.css / stale RCL CSS) */
.admin-hub-eyebrow,
.admin-hub-stat strong,
.admin-hub-card-icon {
    color: var(--il-primary, #1e4d7b);
}

.admin-hub-card-icon {
    background: var(--il-primary-soft, #eff6ff);
}

.admin-hub-link:hover {
    background: var(--il-primary-soft, #eff6ff);
    color: var(--il-primary, #1e4d7b);
}

.admin-hub-link:hover i {
    color: var(--il-primary, #1e4d7b);
}

.admin-hub-link:focus-visible {
    outline-color: var(--il-primary, #2563eb);
}

/* Scoped RCL attribute selectors beat plain class rules — keep these specific */
.il-admin-root .ih-admin-nav-brand-icon {
    background: var(--il-primary, #1e4d7b) !important;
    color: #fff !important;
    box-shadow: 0 4px 10px color-mix(in srgb, var(--il-primary, #1e4d7b) 28%, transparent);
}

.il-admin-root .ih-admin-nav-group-icon {
    color: var(--il-primary, #1e4d7b) !important;
}

.il-admin-root .ih-admin-nav-overview {
    color: var(--il-primary, #1e4d7b) !important;
}

.il-admin-root .ih-admin-nav-overview:hover {
    color: var(--il-primary-hover, var(--il-primary, #1e4d7b)) !important;
}

.il-admin-root .ih-admin-nav-overview.active {
    background: var(--il-primary, #1e4d7b) !important;
    color: #fff !important;
    box-shadow:
        0 0 0 1px color-mix(in srgb, var(--il-primary, #1e4d7b) 35%, transparent),
        0 6px 14px color-mix(in srgb, var(--il-primary, #1e4d7b) 28%, transparent) !important;
}

.il-admin-root .ih-admin-nav-overview.active i {
    color: #fff !important;
}

.il-admin-root .ih-admin-nav-link:hover,
.il-admin-root .ih-admin-nav-link:hover i,
.il-admin-root .ih-admin-nav-link.active,
.il-admin-root .ih-admin-nav-link.active i {
    color: var(--il-primary, #1e4d7b) !important;
}

.il-admin-root .ih-admin-nav-link.active {
    box-shadow:
        0 0 0 1px rgba(0, 0, 0, 0.04),
        0 2px 8px rgba(15, 23, 42, 0.06),
        inset 3px 0 0 var(--il-primary, #1e4d7b) !important;
}

.il-admin-root .ih-admin-nav-overview:focus-visible,
.il-admin-root .ih-admin-nav-link:focus-visible {
    outline-color: var(--il-primary, #2563eb) !important;
}

.il-admin-root .ih-admin-sidebar {
    background: var(--il-primary-soft, #e8f1fa);
    border-right-color: var(--il-primary-border, #c7d9ec);
}

/* Active top-nav underline was still falling back to #3b82f6 from stale RCL CSS */
.il-nav-link.active,
.il-nav-dropdown-trigger:has(.il-nav-link.active),
.il-nav-dropdown.open .il-nav-dropdown-trigger {
    box-shadow: inset 0 -2px 0 var(--il-primary, #2563eb) !important;
}

/* proto-tabs: beat hardcoded blues + global .nav-tabs primary fill */
.proto-tabs .nav-link:hover,
.nav.proto-tabs .nav-link:hover {
    color: var(--il-primary, #1e4d7b) !important;
    background: var(--il-primary-soft, #f8fafc) !important;
}

.proto-tabs .nav-link.active,
.nav.proto-tabs .nav-link.active,
.intranet-page-editor .proto-tabs .nav-link.active,
.intranet-page-editor .nav-tabs .nav-link.active {
    color: var(--il-primary, #1e4d7b) !important;
    background: var(--il-primary-soft, #e8f1fa) !important;
    box-shadow: inset 0 -2px 0 var(--il-primary, #1e4d7b) !important;
}

/* Back link + top navbar chrome */
.proto-back-link {
    color: var(--il-primary, #1e4d7b) !important;
    background: var(--il-primary-soft, #e8f1fa) !important;
    border-color: var(--il-primary-border, #c7d9ec) !important;
}

.proto-back-link:hover {
    color: var(--il-primary-hover, var(--il-primary, #0f3460)) !important;
    background: #fff !important;
}

.il-brand {
    color: var(--il-primary, #1e4d7b) !important;
}

.il-nav-link:hover {
    color: var(--il-primary, #1e4d7b) !important;
    background: var(--il-primary-soft, #e8f1fa) !important;
}

.il-nav-link.active {
    color: var(--il-primary, #1e4d7b) !important;
    background: var(--il-primary-soft, #e8f1fa) !important;
    box-shadow: inset 0 -2px 0 var(--il-primary, #2563eb) !important;
}

.il-search:focus-within {
    border-color: var(--il-primary, #3b82f6) !important;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--il-primary, #3b82f6) 20%, transparent) !important;
}

.ih-eyebrow,
.ih-card-icon,
.ih-card-link {
    color: var(--il-primary, #2563eb);
}

.ih-card-icon {
    background: var(--il-primary-soft, #eff6ff);
}

.ih-btn-primary {
    background: var(--il-primary, #2563eb);
    color: #fff;
}

.ih-card:hover {
    border-color: var(--il-primary-border, #bfdbfe);
}