﻿


.agrigold .performance-list {
    margin: 25px auto;
    margin: 1.5625rem auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    max-width: 1080px;
    max-width: 67.5rem;
    padding: 0 15px;
    padding: 0 .9375rem;
}

    .agrigold .performance-list h2 {
        font-family: "gotham-narrow";
        font-size: 1.5rem;
        font-style: normal;
        font-weight: 700;
        line-height: 1.625rem; /* 108.333% */
        text-transform: capitalize;
        align-self: start;
    }

    .agrigold .performance-list .filters {
        flex-direction: row;
    }


        .agrigold .performance-list .filters .controls {
            display: flex;
            flex-wrap: wrap;
            max-width: 100%;
            width: 100%;
        }


    .agrigold .performance-list .filters {
        width: 100%;
        max-width: 100%;
    }

        .agrigold .performance-list .filters .controls select {
            width: 320px;
            width: 20rem;
        }

        .agrigold .performance-list .filters .basic-filters {
            display: flex;
            flex-direction: column;
            align-items: center;
        }

            .agrigold .performance-list .filters .basic-filters .field-group {
                display: flex;
                flex-direction: row;
                width: 100%;
                justify-content: space-evenly;
                background: rgba(200, 201, 199, 0.2);
                height: 204px;
                height: 12.75rem;
                padding: 48px 25px;
                padding: 3rem 1.5625rem;
            }


@media (max-width: 767px) {
    .agrigold .performance-list .filters .basic-filters .field-group {
        flex-direction: column;
        height: auto;
    }
}

.agrigold .performance-list .filters .label {
    font-family: "gotham-narrow";
    font-size: 0.875rem;
    font-style: normal;
    font-weight: 700;
    line-height: 0.75rem; /* 85.714% */
    text-transform: uppercase;
    margin-bottom: .5rem;
    margin-top: .5rem;
    width: 100%;
}

    .agrigold .performance-list .filters .label > div {
        font-weight: 500;
        line-height: 16px;
        line-height: 1rem;
        display: inline;
    }

.agrigold .performance-list .filters .basic-filters .perf-col-two {
    display: flex;
    flex-direction: column;
    justify-content: start;
}

.agrigold .performance-list .filters .basic-filters input {
    margin-bottom: .5rem;
}


.agrigold .performance-list .filters .basic-filters .button-group {
    justify-content: space-between;
    width: 19rem;
    display: flex;
    flex-direction: row;
}

@media (max-width: 767px) {

    agrigold .performance-list .filters .basic-filters .button-group {
        width: 100%;
    }
}

.agrigold .performance-list .filters .basic-filters #clearFilter {
    background: #FFF;
    color: #343333;
    border: 1px solid var(--PrimaryAgriGold);
}





.agrigold .performance-list .filters .select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 37px;
    line-height: 2.3125rem;
}



@media (max-width: 767px) {
    .agrigold .performance-list .filters .controls {
        width: 100% !important;
        max-width: 100%;
    }

        .agrigold .performance-list .filters .controls select {
            width: 100%;
        }

    .agrigold .basic-filters #product, .agrigold .basic-filters #city, .agrigold .basic-filters #Radius, .agrigold .basic-filters #HarvestYear {
        width: 100% !important;
        margin-left: 0;
    }

    .agrigold .filters .select2 {
        margin: 0px 0px;
        width: 100% !important;
    }
}

.agrigold .performance-list .basic-filters {
    align-items: baseline;
    justify-content: space-between;
}



.agrigold .performance-list .filters .controls > * {
    margin-bottom: 15px !important;
    margin-bottom: .9375rem !important;
    width: 100%;
}



.agrigold .performance-list .basic-filters > * {
    margin-bottom: 10px !important;
    margin-bottom: .625rem !important;
}


@media (max-width: 767px) {

    .agrigold .performance-list .basic-filters {
        flex-direction: column;
        margin-left: 0;
        width: 100%;
    }

        .agrigold .performance-list .basic-filters > * {
            width: 100% !important;
        }
}

.agrigold .plots {
    width: 100%;
    margin-top: 25px;
    margin-top: 1.5625rem;
}


.agrigold .map-view {
    display: flex;
    flex-direction: row;
    width: 100%;
}

@media (max-width: 767px) {

    .agrigold .map-view {
        flex-direction: column-reverse;
    }
}


.agrigold .plots .list-section {
    width: 50%;
    margin-right: .5rem;
}


@media (max-width: 767px) {

    .agrigold .plots .list-section {
        width: 100%;
        margin-right: 0;
    }
}

.agrigold .plots table.plots-list {
    border-collapse: separate;
    border-spacing: 0 15px;
    border-spacing: 0 .9375rem;
    width: 100%;
}




.agrigold .plots .plot-list-button {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 700;
    font-size: 24px;
    font-size: 1.5rem;
    line-height: 33px;
    line-height: 2.0625rem;
    /* identical to box height */
    display: flex;
    align-items: center;
    justify-content: center;
    letter-spacing: 0.01em;
    text-transform: uppercase;
    color: #B12A2F;
    cursor: pointer;
}

    .agrigold .plots .plot-list-button img {
        margin-right: 5px;
        margin-right: .3125rem;
    }

.agrigold .plots table.plots-list td {
    padding: 8px;
    padding: .5rem;
    border-bottom: 1px solid #D8D8D8;
    border-top: 1px solid #D8D8D8;
}


.agrigold .plots table.plots-list th {
    text-align: center;
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 700;
    font-size: 14px;
    font-size: .875rem;
    color: #888888;
    letter-spacing: 0.01em;
    text-transform: uppercase;
}

.agrigold .plots .plot-item {
    cursor: pointer;
}

.agrigold .plots table.plots-list td:first-child {
    border-radius: 10px 0 0 10px;
    border-left: 1px solid #D8D8D8;
}

.agrigold .plots table.plots-list td:last-child {
    border-radius: 0 10px 10px 0;
    border-right: 1px solid #D8D8D8;
}


.agrigold .plots table.plots-list .plot-item td.yield {
    background: #F5AB2C;
    color: black;
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 700;
    width: 145px;
    width: 9.0625rem;
    text-align: center;
}

.agrigold .plots table.plots-list .plot-item.selected td.yield {
    background: #B12A2F;
    color: #FFF;
}



.agrigold .plots table.plots-list td.year {
    color: black;
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    width: 140px;
    width: 8.75rem;
    text-align: center;
}

.agrigold .plots table.plots-list td.chu {
    color: black;
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    width: 140px;
    width: 8.75rem;
    text-align: center;
}

.agrigold .plots table.plots-list td.variety {
    color: black;
    font-family: 'montserrat-semibold';
    font-style: normal;
    font-weight: 400;
    width: 213px;
    width: 13.3125rem;
    text-align: center;
}


.agrigold .map-section {
    max-height: 75vh;
    width: 50%;
    border-radius: 15px;
    position: relative;
    min-height: 500px;
    margin-left: .5rem;
}


@media (max-width: 767px) {

    .agrigold .map-section {
        margin-left: 0;
        width: 100%;
        margin-bottom: 2rem;
    }
}

.agrigold .map-section #plot-map {
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
}



.agrigold .map-section .item-card {
    background: #FFF;
    border-left-color: #B12A2F;
}







/* grid view */
.agrigold .grid-view {
    display: none;
    flex-direction: column;
    width: 100%;
    justify-content: center;
}


@media (max-width: 767px) {

    /* grid view */
    .agrigold .grid-view {
        display: flex;
    }
}

.agrigold .grid-view > * {
    /* width: 80%;*/
}

.agrigold .performance-list .grid-view ul.card-list {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}


.agrigold .performance-list .plots .card-list-count {
    font-family: gotham-narrow;
    font-size: 24px;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 24px;
    line-height: 1.5rem;
    letter-spacing: 0em;
    text-align: left;
    color: #97999B;
    margin-bottom: 15px;
    margin-bottom: .9375rem;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}


    .agrigold .performance-list .plots .card-list-count .card-list-zero-warning {
        font-family: gotham-narrow;
        font-size: 16px;
        font-size: 1rem;
        font-style: italic;
        font-weight: 500;
        line-height: 16px;
        line-height: 1rem;
        color: #BE4D00;
    }


.agrigold .performance-list .plot-list-buttons {
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
    margin-bottom: 25px;
    margin-bottom: 1.5625rem;
}


@media (max-width: 767px) {

    .agrigold .performance-list .plot-list-buttons {
        display: none;
    }
}



.agrigold li.item-card .actions, .agrigold li.item-card .plot-details {
    display: none;
}


.agrigold li.item-card.selected .actions, .agrigold li.item-card.selected .plot-details {
    display: flex;
}


.agrigold li.item-card .actions a.view-plot {
    border-top-left-radius: 20px;
    border-top-left-radius: 1.25rem;
}

.agrigold li.item-card .actions a.save-plot, .agrigold li.item-card .actions a.save-plot-special {
    border-top-right-radius: 20px;
    border-top-right-radius: 1.25rem;
}

.agrigold li.item-card .body .header .title-header {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}

.agrigold li.item-card .header {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}


.agrigold li.item-card.selected .header {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
    margin-bottom: .5rem;
}

.agrigold li.item-card .header .header-row {
    flex-direction: column;
    width: 100%;
}

.agrigold li.item-card .body .header .selector {
    padding: 10px;
    padding: .625rem;
}

    .agrigold li.item-card .body .header .selector.selector-plus {
        display: block;
        height: 50%;
    }

.agrigold li.item-card.selected .body .header .selector.selector-plus {
    display: none;
}

.agrigold li.item-card .body .header .selector.selector-dash {
    display: none;
}

.agrigold li.item-card.selected .body .header .selector.selector-dash {
    display: flex;
}


.agrigold li.item-card .body .header .title-header .plot-average {
    font-family: gotham-narrow;
    font-size: 42px;
    font-size: 2.625rem;
    font-weight: 700;
    line-height: 44px;
    line-height: 2.75rem;
    letter-spacing: 0em;
    text-align: left;
    display: flex;
    flex-direction: row;
    align-items: baseline;
    color: var(--AgrigoldDarkGreen);
}

    .agrigold li.item-card .body .header .title-header .plot-average .label {
        font-family: gotham-narrow;
        font-size: 14px;
        font-size: .875rem;
        font-weight: 700;
        line-height: 16px;
        line-height: 1rem;
        letter-spacing: 0em;
        text-align: left;
        text-transform: uppercase;
        color: var(--PrimaryAgriGold);
        margin-left: 10px;
    }

.agrigold li.item-card .body .header .location {
    font-family: gotham-narrow;
    font-size: 24px;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 29px;
    line-height: 1.8125rem;
    letter-spacing: 0em;
    text-align: left;
    text-transform: uppercase;
}

.agrigold li.item-card .plot-details .detail-item {
    justify-content: space-between;
    padding: 8px 0px 8px 0px;
    border-bottom: 1px solid #C8C9C7;
    margin: 0;
}

.agrigold li.item-card .plot-details .compare-item {
    display: flex;
    flex-direction: row;
    justify-content: right;
    align-items: center;
    text-transform: uppercase;
    font-family: gotham;
    font-size: .85rem;
    color: var(--PrimaryAgriGold);
    font-weight: 700;
    letter-spacing: 0em;
    margin-top: 10px;
}

.agrigold li.item-card .plot-details .switch {
    margin-left: 10px;
}




.agrigold .performance-list li.item-card .plot-details .detail-item.genetic-family {
    display: none;
}


.agrigold .performance-list.Corn li.item-card .plot-details .detail-item.genetic-family {
    display: flex;
}


.agrigold li.item-card .body .plot-details .detail-item .label {
    font-family: gotham-narrow;
    font-size: 14px;
    font-size: .875rem;
    font-weight: 700;
    line-height: 12px;
    line-height: .75rem;
    letter-spacing: 0em;
    text-align: left;
    text-transform: uppercase;
    white-space: nowrap;
}

.agrigold li.item-card .body .plot-details .detail-item .value {
    font-family: gotham-narrow;
    font-size: 24px;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 29px;
    line-height: 1.8125rem;
    letter-spacing: 0em;
    text-align: left;
    text-transform: uppercase;
}


.agrigold li.item-card .plot-details .sub-section .detail-item {
    border: none;
}

.agrigold li.item-card .body .plot-details .sub-section .detail-item .label {
    font-family: gotham;
    font-size: 12px;
    font-size: .75rem;
    font-weight: 400;
    line-height: 16px;
    line-height: 1rem;
    letter-spacing: 0em;
    text-align: left;
    color: var(--PrimaryAgriGold);
}

.agrigold li.item-card .body .plot-details .sub-section .detail-item .value {
    font-family: gotham;
    font-size: 12px;
    font-size: .75rem;
    font-weight: 700;
    line-height: 16px;
    line-height: 1rem;
    letter-spacing: 0em;
    text-align: right;
    color: var(--PrimaryAgriGold);
}
