.module-plan-documents .documents-wrapper {
    position: relative;
    
}

.module-plan-documents .intro-wrapper {
    width:100%;
    background-color: var(--dark-orange);
    background-image: var(--background-orange-dots);
    background-repeat: no-repeat;
    padding:5rem;
    text-align:center;
    border-radius: 10px;
}

.module-plan-documents .intro-wrapper .headline {
    width:100%;
}

.module-plan-documents .intro-wrapper .headline,
.module-plan-documents .intro-wrapper .headline strong {
    color:#fff;
}

.module-plan-documents .intro-wrapper {
    display: flex;
    gap:2rem;
    flex-wrap: wrap;
    align-items: center;
}

.module-plan-documents .intro-wrapper p {
    color:#000;
    margin:0;
    width:100%;
}

.module-plan-documents #document-filter {
    margin-top:2rem;
}

.module-plan-documents #document-filter .label {
    white-space: nowrap;
    font-size:1.6rem;
    font-weight:700;
    text-transform: uppercase;
}

.module-plan-documents #document-filter form {
    display:flex;
    gap:2rem;
    flex-wrap: wrap;
    margin-top:2rem;
    align-items: center;
}

.module-plan-documents #document-filter form .filter {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    gap:.1rem;
    width:100%;
}

.module-plan-documents #document-filter form .filter label {
    width:100%;
    font-size:1.2rem;
    text-transform: uppercase;
    padding:0 1rem;
}

.module-plan-documents #document-filter form select {
    font-size:1.6rem;
    padding:4px 10px;
    width:100%;
    border:0;
    border-bottom:1px solid var(--dark-gray);
    color:var(--dark-gray);
}

.module-plan-documents #document-filter form input[type="checkbox"],
.module-plan-documents #document-filter form .filter.checkbox label {
    font-size:1.6rem;
    padding-left:0;
    color:var(--dark-gray);
}

.module-plan-documents select#planYear {
    color:#fff;
    background:transparent;
    border:none;
    border-bottom:1px solid #fff;
}

.module-plan-documents select#planYear option {
    color:#000;
    background-color:#fff;
}

.module-plan-documents #document-filter #clearFilters {
    display: inline-block;
    color: #000;
    text-transform: uppercase;
    font-size: 1.6rem;
    line-height: 1.7rem;
    font-weight: 700;
    position: relative;
    transition: all 0.3s ease;
    margin-top:2rem;
}

.module-plan-documents #document-filter #clearFilters:after {
    content: '\f061';
    color: #000;
    font: var(--fa-font-solid);
    background-color: var(--yellow);
    border-radius: 50%;
    padding: 2px;
    width: 2.5rem;
    height: 2.5rem;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    font-size: 1rem;
    margin-left: 8px;
    text-decoration: none;
    transition: all 0.3s ease;
}

.module-plan-documents #document-filter #clearFilters:hover:after {
    transform: translateX(5px); /* Moves it 5px to the right */
}

.module-plan-documents .documents-wrapper {
    margin-top:2rem;
}

.module-plan-documents .documents-wrapper #documents-count {
    text-transform: uppercase;
    font-size:1.5rem;
}

.module-plan-documents .documents-wrapper #plan-group {
    font-weight:700;
}

.module-plan-documents .documents-wrapper #documents-list {
    width:100%;
    display: flex;
    flex-wrap: wrap;
}

.module-plan-documents .documents-wrapper #documents-list .plan-type-header {
    font-weight:700;
    text-transform: uppercase;
    width: 100%;
    font-size:2.4rem;
    line-height: 3rem;
    position: relative;
    padding:1rem 0;
}

.module-plan-documents .documents-wrapper #documents-list .plan-type-header span {
    color:var(--dark-orange);
    font-weight:700;
    text-transform: capitalize;
}

.module-plan-documents .documents-wrapper #documents-list .document {
    width:100%;
    display: flex; 
    justify-content: space-between;
    align-items: center;
    gap:5rem;
    padding:1rem 4rem;
    align-items: center;
}

.module-plan-documents .documents-wrapper #documents-list .document:nth-child(odd) {
    background-color: var(--light-gray);
}

.module-plan-documents .documents-wrapper #documents-list .document .title {
    font-weight:700;
}

.module-plan-documents .documents-wrapper #documents-list .document .title a:hover {
    text-decoration: underline;
}

.module-plan-documents .documents-wrapper #documents-list .document .plan-details p {
    font-size:1.2rem;
    line-height:1.6rem;
    display: inline-block;
    border-right:1px solid var(--medium-gray);
    padding-right:.5rem;
    margin-right:.5rem;
}

.module-plan-documents .documents-wrapper #documents-list .document .plan-details p:last-child {
    border-right:none;
    padding-right:0;
    margin-right:0;
}

.module-plan-documents .documents-wrapper #documents-list .document h3 {
    font-size:2.6rem;
    line-height: 3rem;
    font-weight: 700;
}

.module-plan-documents .documents-wrapper #documents-list .document p {
    margin:0;
}

.module-plan-documents .documents-wrapper #documents-list .document i {
    color:var(--dark-orange);
    font-size:2.8rem;
}

@media (min-width:1200px) {

    .module-plan-documents #document-filter {
        width:100%;
        margin-top:4rem;
        display: flex;
        gap:2rem;
        align-items: flex-end;
        justify-content: space-between;
        flex-wrap: wrap;
    }

    .module-plan-documents #document-filter > div {
        display: flex;
        align-items: center;
        gap:3rem;
    }

    .module-plan-documents #document-filter form .filter {
        width:auto;
    }

    .module-plan-documents #document-filter form {
        display:flex;
        gap:2rem;
        align-items:center;
        flex-wrap: wrap;
        justify-content: center;
        margin-top:0;
    }

    .module-plan-documents #document-filter form select {
        width:auto;
        min-width:150px;
    }

    .module-plan-documents .documents-wrapper {
        margin-top:5rem;
    }

    .module-plan-documents #document-filter form .filter.checkbox {
        margin-top:4px;
    }

    .module-plan-documents #document-filter #clearFilters {
        margin-bottom:-2px;
        margin-top:0;
    }

    .module-plan-documents .documents-wrapper #documents-list .plan-type-header {
        font-size:3.7rem;
        line-height: 5rem;
        margin-top:1rem;
        margin-bottom:1rem;
    }

    .module-plan-documents .documents-wrapper #documents-list .plan-type-header:before {
        content: url(/images/cho-dot-arrow.svg);
        display: block;
        position: absolute;
        left: -3rem;
        top: 8px;
    }
}