/* @group @variables */

[class*="a-filter-open"] {
--link-color: var(--color-text);
--link-background-color: var(--color-whitesmoke);
--link-action-background-color: var(--color-whitesmoke-action);
--link-action-color: var(--color-link-action);
--link-box-shadow: -1px 0 0 0 var(--color-gainsboro);
--link-action-box-shadow: -1px 0 0 0 var(--color-gainsboro);
--link-action-box-shadow: -1px 0 0 0 var(--color-gainsboro);
--icon-width: 1.5rem;
--icon-height: 1.5rem;
}

/* @end @variables */

/* @group @a-filter-open */

[class*="a-filter-open"] {
display: grid;
justify-content: center;
align-items: center;
}

/* @end @a-filter-open */

/* @group @a-filter-open */

[class*="a-filter-open"] {
width: 4.5rem;
height: 100%;
cursor: pointer;
transition: var(--transition);
}

[class*="a-filter-open"]:hover,
[class*="a-filter-open"]:focus {
background-color: var(--label-action-background-color);
color: var(--label-action-color);
}

/* @end @a-filter-open */