/* @group @m-news-list */

[class*="m-news-list"] {
padding-left: 0;
list-style: none;
}

[class*="m-news-list"]>li:not(:last-of-type) {
border-bottom: 1px dotted hsl(0deg 0% 20%);
}

/* @end @m-news-list */

/* @group @variables */

[class*="m-news-link"] {
--news-link-grid-template-columns: auto 1fr 1rem;
--news-link-grid-template-rows: auto auto;
--news-link-gap: .75rem;
--news-time-grid-column: 1;
--news-time-grid-row: 1;
--news-title-grid-column: 1 / span 2;
--news-title-grid-row: 2;
--news-link-icon-grid-column: 3;
--news-link-icon-grid-row: 1 / span 2;
}

@media all and (min-width: 48em) {

[class*="m-news-link"] {
--news-link-grid-template-columns: auto 1fr 1rem;
--news-link-grid-template-rows: 1fr;
--news-link-gap: 1rem;
--news-time-grid-column: 1;
--news-time-grid-row: 1;
--news-title-grid-column: 2;
--news-title-grid-row: 1;
--news-link-icon-grid-column: 3;
--news-link-icon-grid-row: 1;
}

}

/* @end @variables */

/* @group @m-news-link */

[class*="m-news-link"] {
box-sizing: border-box;
display: grid;
grid-template-columns: var(--news-link-grid-template-columns);
grid-template-rows: var(--news-link-grid-template-rows);
gap: var(--news-link-gap);
min-height: .75rem;
padding: 1.25rem .75rem;
background-color: hsl(0deg 0% 100%);
text-decoration: none;
color: hsl(0deg 0% 20%);
transition: var(--link-proto-transition);
}

[class*="m-news-link"]:hover,
[class*="m-news-link"]:focus {
color: hsl(347deg 84% 59%);
}

[class*="a-news-time"] {
grid-column: var(--news-time-grid-column);
grid-row: var(--news-time-grid-row);
}

[class*="a-news-title"] {
align-self: center;
grid-column: var(--news-title-grid-column);
grid-row: var(--news-title-grid-row);
}

[class*="a-news-link-icon"] {
align-self: center;
grid-column: var(--news-link-icon-grid-column);
grid-row: var(--news-link-icon-grid-row);
}

[class*="a-news-title"] {
margin-bottom: 0;
}

[class*="a-news-time"] {
display: grid;
justify-content: center;
align-items: center;
height: 1.75rem;
padding: 0 .5rem;
background-color: hsl(198deg 59% 65%);
color: hsl(0deg 0% 100%);
}

[class*="a-news-link-icon"] {
width: 1rem;
height: auto;
width: .75rem;
height: auto;
fill: currentColor;
transition: inherit;
}

/* @end @m-news-link */