/*
============================================================
 ELR ARTICLES V4
 Article cards + Filter & Sort

 PAGE-SPECIFIC ONLY.
 NO PUBLIC SHELL SELECTORS.
============================================================
*/


:root{
    --elr-v4-deep:#102F50;
    --elr-v4-navy:#173F69;
    --elr-v4-blue:#315F89;
    --elr-v4-gold:#B08A4A;
    --elr-v4-soft-gold:#C4A66D;

    --elr-v4-line:#D9E2EA;
    --elr-v4-text:#263F54;
    --elr-v4-muted:#647989;
    --elr-v4-paper:#FFFFFF;
}


/* ============================================================
   ARTICLE RESULT CARD
============================================================ */

.elr-article-card-v4{

    position:relative;

    display:grid;

    grid-template-columns:
        132px
        minmax(0,1fr);

    gap:28px;

    align-items:start;

    width:100%;

    box-sizing:border-box;

    margin:
        0
        0
        24px;

    padding:
        27px
        30px;

    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #fdfefe 100%
        );

    border:
        1px solid
        #dfe6ec;

    border-top:
        2px solid
        var(--elr-v4-navy);

    border-radius:
        2px;

    box-shadow:
        0 5px 20px
        rgba(16,47,80,.055);

}


.elr-article-card-v4::after{

    content:"";

    position:absolute;

    top:-2px;
    right:0;

    width:76px;
    height:2px;

    background:
        var(--elr-v4-gold);

}


/* ============================================================
   COMPLETE COVER
============================================================ */

.elr-article-cover-v4{

    width:132px;

    min-height:178px;

    display:flex;

    align-items:flex-start;
    justify-content:center;

    box-sizing:border-box;

    padding:0;

    background:#fff;

}


.elr-article-cover-v4 img{

    display:block;

    width:100%;
    height:178px;

    object-fit:contain;

    object-position:
        center
        top;

    background:#fff;

    border:
        1px solid
        #e2e7eb;

    box-shadow:
        0 4px 14px
        rgba(16,47,80,.07);

}


/* fallback only when Janeway has no real image */

.elr-article-cover-placeholder-v4{

    width:100%;
    height:178px;

    box-sizing:border-box;

    padding:
        28px
        13px;

    display:flex;
    flex-direction:column;

    justify-content:space-between;

    background:
        linear-gradient(
            150deg,
            #173F69,
            #102F50
        );

    border-bottom:
        4px solid
        var(--elr-v4-gold);

    color:#fff;

}


.elr-article-cover-placeholder-v4 span{

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:25px;

    letter-spacing:.04em;

}


.elr-article-cover-placeholder-v4 small{

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size:8px;

    line-height:1.45;

    letter-spacing:.11em;

    text-transform:uppercase;

    color:
        rgba(255,255,255,.77);

}


/* ============================================================
   ORIGINAL JANEWAY CONTENT
============================================================ */

.elr-article-card-body-v4{

    min-width:0;

    padding-top:2px;

}


/*
 Remove only the old outer-card presentation.
 Janeway's inner article data remains intact.
*/

.elr-article-card-body-v4 > :first-child{

    width:100% !important;

    max-width:none !important;

    margin:0 !important;

    padding:0 !important;

    background:
        transparent !important;

    border:0 !important;

    border-radius:0 !important;

    box-shadow:none !important;

}


.elr-article-card-v4 h1,
.elr-article-card-v4 h2,
.elr-article-card-v4 h3{

    margin-top:
        0 !important;

    font-family:
        Georgia,
        "Times New Roman",
        serif !important;

    color:
        var(--elr-v4-navy) !important;

    font-weight:
        400 !important;

    line-height:
        1.18 !important;

}


.elr-article-card-v4 h2 a,
.elr-article-card-v4 h3 a{

    color:
        var(--elr-v4-navy) !important;

    text-decoration:
        none !important;

}


.elr-article-card-v4 h2 a:hover,
.elr-article-card-v4 h3 a:hover{

    color:
        var(--elr-v4-blue) !important;

}


.elr-article-card-v4 p{

    color:
        var(--elr-v4-text);

    line-height:
        1.62;

}


.elr-article-card-v4 ul{

    padding-left:
        0;

    list-style:
        none;

}


.elr-article-card-v4 a{

    text-underline-offset:
        3px;

}


/* ============================================================
   RIGHT RAIL
============================================================ */

.elr-articles-sidebar,
.elr-articles-filter,
.elr-articles-search,
.elr-articles-browse{

    box-sizing:border-box !important;

    width:100% !important;
    max-width:100% !important;

    overflow:visible !important;

    max-height:none !important;

}


.elr-articles-sidebar *{

    box-sizing:
        border-box;

    max-width:
        100%;

}


/* Search / Filter title */

.elr-articles-sidebar h2,
.elr-articles-sidebar h3{

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    color:
        var(--elr-v4-navy);

    font-weight:
        400;

}


/* fields */

.elr-articles-field{

    margin:
        0
        0
        18px;

}


.elr-articles-field > label{

    display:block;

    margin:
        0
        0
        7px;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size:
        12px;

    font-weight:
        700;

    color:
        #536A7B;

}


.elr-articles-sidebar
input[type="text"],

.elr-articles-sidebar
input[type="search"],

.elr-articles-sidebar
input[type="date"],

.elr-articles-sidebar
select{

    width:100% !important;

    min-height:45px;

    margin:0 !important;

    padding:
        0
        12px;

    border:
        1px solid
        #C9D5DE;

    border-radius:
        2px;

    background:
        #fff;

    color:
        #425A6D;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size:
        13px;

    box-shadow:
        none !important;

}


/* ============================================================
   SECTION CHECKBOX
============================================================ */

#id_section__pk{

    width:100%;

    margin:
        2px
        0
        0;

}


#id_section__pk > div,
#id_section__pk > div > div{

    width:100% !important;

    margin:0 !important;

    padding:0 !important;

}


#id_section__pk label{

    display:flex !important;

    align-items:center !important;

    gap:9px !important;

    width:100% !important;

    margin:0 !important;

    padding:
        9px
        0 !important;

    color:
        #455F72 !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif !important;

    font-size:
        12px !important;

    line-height:
        1.35 !important;

    font-weight:
        600 !important;

    cursor:pointer;

}


#id_section__pk
input[type="checkbox"]{

    appearance:auto !important;

    -webkit-appearance:
        checkbox !important;

    position:static !important;

    display:inline-block !important;

    flex:
        0 0 16px !important;

    width:
        16px !important;

    height:
        16px !important;

    min-width:
        16px !important;

    min-height:
        16px !important;

    max-width:
        16px !important;

    max-height:
        16px !important;

    margin:
        0 !important;

    padding:
        0 !important;

    vertical-align:
        middle !important;

    accent-color:
        var(--elr-v4-navy);

    transform:
        none !important;

}


/* ============================================================
   FILTER ACTIONS
============================================================ */

.elr-articles-filter-actions{

    display:flex;

    align-items:center;

    gap:14px;

    margin-top:
        21px;

}


.elr-articles-apply,
.elr-articles-sidebar button[type="submit"]{

    min-height:
        42px;

    padding:
        0
        17px;

    display:inline-flex;

    align-items:center;
    justify-content:center;

    border:
        1px solid
        var(--elr-v4-navy);

    border-radius:
        2px;

    background:
        var(--elr-v4-navy);

    color:
        #fff;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size:
        12px;

    font-weight:
        700;

    cursor:pointer;

    box-shadow:
        inset 0 -2px 0
        var(--elr-v4-gold);

}


.elr-articles-apply:hover,
.elr-articles-sidebar button[type="submit"]:hover{

    background:
        #1E4B77;

}


.elr-articles-clear{

    display:inline-flex;

    align-items:center;

    min-height:
        42px;

    color:
        #60778A !important;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size:
        12px;

    font-weight:
        600;

    text-decoration:
        none !important;

    border-bottom:
        1px solid
        var(--elr-v4-soft-gold);

}


.elr-articles-clear:hover{

    color:
        var(--elr-v4-navy) !important;

}


/* ============================================================
   BROWSE
============================================================ */

.elr-articles-browse{

    overflow-x:
        hidden !important;

}


.elr-articles-browse a{

    display:block;

    width:100%;

    padding:
        11px
        0;

    border-bottom:
        1px solid
        #E1E7EC;

    color:
        #425B6E;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size:
        13px;

    font-weight:
        600;

    text-decoration:
        none;

}


.elr-articles-browse a.is-current{

    position:relative;

    padding-left:
        15px;

    color:
        var(--elr-v4-navy);

}


.elr-articles-browse a.is-current::before{

    content:"";

    position:absolute;

    left:0;

    top:10px;
    bottom:10px;

    width:
        3px;

    background:
        var(--elr-v4-gold);

}


/* ============================================================
   RESPONSIVE
============================================================ */

@media(max-width:780px){

    .elr-article-card-v4{

        grid-template-columns:
            92px
            minmax(0,1fr);

        gap:
            18px;

        padding:
            20px;

    }


    .elr-article-cover-v4{

        width:
            92px;

        min-height:
            130px;

    }


    .elr-article-cover-v4 img,
    .elr-article-cover-placeholder-v4{

        height:
            130px;

    }

}


@media(max-width:520px){

    .elr-article-card-v4{

        grid-template-columns:
            1fr;

    }


    .elr-article-cover-v4{

        width:
            108px;

        min-height:
            150px;

    }


    .elr-article-cover-v4 img,
    .elr-article-cover-placeholder-v4{

        height:
            150px;

    }

}
