1/**
2 * @file
3 * Styles for menu placed in sidebar region.
4 */
5
6@import "../../base/variables.pcss.css";
7
8.menu--sidebar {
9  list-style: none;
10
11  & .menu {
12    list-style: none;
13  }
14
15  & .menu--level-1 {
16    margin: 0;
17  }
18
19  & .menu__link {
20    position: relative;
21    display: block;
22    padding-block: var(--sp0-75);
23    padding-inline-start: 0;
24    padding-inline-end: 0;
25    font-family: var(--font-serif);
26    font-size: 18px;
27
28    /* Bottom divider line. */
29    &:after {
30      position: absolute;
31      inset-block-end: 0;
32      inset-inline-start: 0;
33      width: var(--sp4);
34      height: 0;
35      content: "";
36      border-block-start: solid 2px var(--color--gray-80);
37    }
38  }
39
40  & .menu__link--link {
41    text-decoration: none;
42    color: var(--color--gray-0);
43    font-weight: 600;
44
45    &:hover {
46      color: var(--color--blue-50);
47    }
48  }
49
50  /* No bottom divider line for last menu item. */
51  & .menu__item--level-1:last-child > .menu__link:last-child,
52  & .menu__item--level-1:last-child > .menu__item--level-2:last-child > .menu__link:last-child {
53    &:after {
54      content: none;
55    }
56  }
57}
58