Template:Article assessment/styles.css

.ed-assessment {
    border: 1px solid #a2a9b1;
    border-left: 4px solid #b35b08;
    background: #f8f9fa;
    color: #202122;
    margin: 0.75em auto;
    max-width: 76em;
    font-size: 0.9em;
    line-height: 1.5;
    overflow-wrap: anywhere;
}
.ed-assessment .ed-assessment-quality {
    display: flex;
    align-items: center;
    gap: 0.85em;
    padding: 0.7em 0.9em;
}
.ed-assessment .ed-assessment-badge {
    flex: 0 0 auto;
    min-width: 5.5em;
    padding: 0.25em 0.45em;
    text-align: center;
    border: 1px solid #72777d;
    color: #202122;
    background: #eaecf0;
}
.ed-assessment .ed-assessment-badge-label {
    display: block;
    font-size: 0.8em;
}
.ed-assessment .ed-assessment-badge strong {
    display: block;
    font-size: 1.1em;
}
.ed-assessment .ed-assessment-badge-stub { background: #f8d7da; }
.ed-assessment .ed-assessment-badge-start { background: #ffe0b2; }
.ed-assessment .ed-assessment-badge-c { background: #fff1ad; }
.ed-assessment .ed-assessment-badge-b { background: #d8edbd; }
.ed-assessment .ed-assessment-badge-good { background: #bce5d5; }
.ed-assessment .ed-assessment-badge-featured { background: #c8e2f8; }
.ed-assessment .ed-assessment-badge-invalid { background: #f8d7da; border-color: #a12622; }
.ed-assessment .ed-assessment-summary { min-width: 0; }
.ed-assessment .ed-assessment-projects {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
    background: transparent;
    color: inherit;
}
.ed-assessment .ed-assessment-projects caption {
    text-align: left;
    font-weight: bold;
    padding: 0.3em 0.9em;
    border-top: 1px solid #a2a9b1;
    background: #eaecf0;
}
.ed-assessment .ed-assessment-projects th,
.ed-assessment .ed-assessment-projects td {
    padding: 0.4em 0.9em;
    text-align: left;
    vertical-align: top;
    border-top: 1px solid #c8ccd1;
}
.ed-assessment .ed-assessment-projects th { width: 30%; }
.ed-assessment .ed-assessment-notes {
    border-top: 1px solid #a2a9b1;
    padding: 0.5em 0.9em;
}
.ed-assessment .ed-assessment-notes-body > :first-child { margin-top: 0; }
.ed-assessment .ed-assessment-notes-body > :last-child { margin-bottom: 0; }
.ed-assessment a:focus { outline: 2px solid #b35b08; outline-offset: 2px; }
@media screen and (max-width: 480px) {
    .ed-assessment { font-size: 0.88em; margin: 0.5em 0; }
    .ed-assessment .ed-assessment-quality { align-items: flex-start; gap: 0.5em; padding: 0.55em; }
    .ed-assessment .ed-assessment-badge { min-width: 0; max-width: 7em; }
    .ed-assessment .ed-assessment-projects th { width: 38%; }
    .ed-assessment .ed-assessment-projects th,
    .ed-assessment .ed-assessment-projects td,
    .ed-assessment .ed-assessment-projects caption,
    .ed-assessment .ed-assessment-notes { padding: 0.4em 0.55em; }
}
html.skin-theme-clientpref-night .ed-assessment {
    background: #20262e;
    color: #eaecf0;
    border-color: #72777d;
    border-left-color: #f5a443;
}
html.skin-theme-clientpref-night .ed-assessment .ed-assessment-projects caption { background: #303944; }
html.skin-theme-clientpref-night .ed-assessment a { color: #9ecbff; }
html.skin-theme-clientpref-night .ed-assessment a:visited { color: #d4bcf5; }
@media screen and (prefers-color-scheme: dark) {
    html.skin-theme-clientpref-os .ed-assessment {
        background: #20262e;
        color: #eaecf0;
        border-color: #72777d;
        border-left-color: #f5a443;
    }
    html.skin-theme-clientpref-os .ed-assessment .ed-assessment-projects caption { background: #303944; }
    html.skin-theme-clientpref-os .ed-assessment a { color: #9ecbff; }
    html.skin-theme-clientpref-os .ed-assessment a:visited { color: #d4bcf5; }
}