/* pager-secondary --------------------------------------------------------*/

/* @group @m-chapter-pager */

[class*="m-chapter-pager"] {
box-sizing: border-box;
display: grid;
grid-template-columns: 1fr 1px 1fr;
min-height: .3.75rem;
font-size: .875rem;
line-height: 1.71428571;
}

[class*="m-chapter-pager-category"] {
--pager-link-text-align: center;
}

[class*="m-chapter-pager"]:before {
content: '';
grid-column: 2;
grid-row: 1;
background-color: var(--pager-border-color);
}

[class*="a-pager-link-prev"] {
grid-column: 1;
grid-row: 1;
}

[class*="a-pager-link-next"] {
grid-column: 3;
grid-row: 1;
}

/* @end @m-chapter-pager */

/* pager-secondary --------------------------------------------------------*/

/* @group @variables */

[class*="m-chapter-pager"] {
--pager-icon-size: .75rem;
--pager-border-color: var(--border-color);
--icon-next: url('../img/sprite-svg.svg#icon-arrow-right-basic');
--icon-prev: url('../img/sprite-svg.svg#icon-arrow-left-basic');
}

[class*="a-pager-link-prev"] {
--pager-link-grid-template-columns: var(--pager-icon-size) 1fr;
}

[class*="a-pager-link-next"] {
--pager-link-grid-template-columns: 1fr var(--pager-icon-size);
--pager-link-text-align: right;
}

/* @end @variables */

/* @group @a-pager-link */

[class*="a-pager-link"] {
display: grid;
place-items: center;
grid-template-columns: var(--pager-link-grid-template-columns);
gap: .75rem;
padding: calc(.75rem - 1px);
background-color: hsla(0, 0%, 100%, 1);
text-align: var(--pager-link-text-align);
transition: var(--link-proto-transition);
}

[class*="a-pager-link"] {
color: var(--color-text);
}

[class*="a-pager-link"]:hover,
[class*="a-pager-link"]:focus {
color: var(--color-primary-action);
}

[class*="a-pager-link"]:active {
color: var(--color-primary-active);
}

/* @end @a-pager-link */

/* pager-secondary --------------------------------------------------------*/

/* @group @a-pager-icon */

[class*="a-pager-icon"] {
display: flex;
place-items: center;
width: var(--pager-icon-size);
height: var(--pager-icon-size);
background-color: currentColor;
-webkit-mask-size: var(--pager-icon-size);
mask-size: var(--pager-icon-size);
}

[class*="a-pager-icon-prev"] {
-webkit-mask-image: var(--icon-prev);
mask-image: var(--icon-prev);
}

[class*="a-pager-icon-next"] {
order: 1;
-webkit-mask-image: var(--icon-next);
mask-image: var(--icon-next);
}

/* @end @a-pager-icon */