.sites-intro,
.sites-browser{
text-align:left;
}
.sites-browser>*+*{
margin-top:16px;
}
.sites-label{
display:flex;
flex-direction:column;
gap:8px;
min-width:0;
color:var(--tx2);
}
.sites-search,
.sites-selects select{
width:100%;
min-width:0;
font:inherit;
line-height:1.6;
color:var(--tx1);
background:var(--bg2);
border:0;
padding:12px 16px;
border-radius:var(--br1);
}
.sites-search{
border-radius:var(--br1);
padding:16px 24px;
}
.sites-search::placeholder{
color:var(--tx2);
opacity:1;
}
.sites-search:focus{
background:var(--bg3);
outline:none;
}
.sites-selects{
display:grid;
gap:16px;
}
.sites-result,
.sites-number{
color:var(--tx2);
}
.sites-records{
display:grid;
}
.sites-record{
display:grid;
grid-template-columns:minmax(0,1fr) max-content;
align-items:center;
gap:16px;
padding:6px 8px;
overflow-wrap:anywhere;
}
.sites-name{
font-weight:700;
}
.sites-status{
text-align:right;
white-space:nowrap;
color:var(--cl2);
}
.sites-record[data-status="Working samples"] .sites-status{
color:var(--cl4);
}
.sites-record[data-status="Failing samples"] .sites-status{
color:var(--cl5);
}
.sites-record[data-status="Restricted samples"] .sites-status{
color:var(--cl6);
}
.sites-pager{
display:flex;
align-items:center;
justify-content:space-between;
gap:8px;
}
.sites-browser button{
font-size:inherit;
}
.sites-pager button{
border-radius:var(--br9);
padding:10px 16px;
}
.sites-pager[hidden],
.sites-retry[hidden]{
display:none;
}