iub-sidenav {
	display: block;

	nav {
		a {
			color: unset;
			display: block;
			flex-grow: 1;
			text-decoration: none;

			&:visited {
				color: inherit;
			}

			&:hover {
				color: var(--rvt-color-theme-text-accent);
				text-decoration: underline;
			}
		}
		
		button {
			--color-border: var(--rvt-color-theme-ui);
			--color-border-hover: var(--rvt-color-theme-ui);
			--color-text-hover: var(--rvt-color-theme-text-accent);
		}

		header {
			align-items: start;
			display: flex;
			gap: var(--rvt-size-8);
			padding-block: var(--rvt-size-8);

			h2 {
				display: block;
				flex-grow: 1;

				a {
					font: var(--rvt-font-18-bold);
					padding-block: var(--rvt-size-4);
				}
			}
		}

		ul {
			border-block-start: var(--rvt-size-1) solid var(--rvt-color-theme-ui);
			margin: 0;
			padding: 0;
		}

		li {
			align-items: start;
			border-block-end: var(--rvt-size-1) solid var(--rvt-color-theme-ui);
			display: flex;
			gap: var(--rvt-size-8);
			padding: var(--rvt-size-8);

			a {
				padding: var(--rvt-size-4) var(--rvt-size-8);
			}

			&:has([aria-current="page"]) {
				background-color: var(--rvt-color-theme-background-strong);

				a {
					font: var(--rvt-font-16-bold);
				}
			}
		}
	}
}

/*
 * NOTE: disabling this for now due to issues caused by "breakout" functionality on details pages
 *
 */
 
/*@media screen and (min-width: 67.5rem) {*/
/*    iub-sidenav {*/
/*        position: sticky;*/
/*        top: 0;*/
/*    }*/
/*}*/


/**
    NOTE: local override for IUB Sidenav implementation.
    This adjusts the aligment of breadcrumbs and Sidenav
    on larger screens.
*/

.rvt-layout-base__main {
    padding-block-start: var(--rvt-spacing-xl);
}

@media screen and (min-width: 67.5rem) {
    .rvt-layout-base__sidebar {
        padding-block-start: var(--rvt-spacing-md);
    }
}

/* End layout overrides */