/*********** Lists ************/

.field--entity-reference-target-type-taxonomy-term {
    padding-left: 0;
    &.field--label-above {
        display: block;

        /* .field__items {
            display: block;
        } */
    }
    &::before,
    .field__item a:after,
    .field__label::before {
        display: none;
    }
}

#details-edit-group {

    position: relative;

    .form-group-wrapper {
        display: grid;
         
    }

    &.support-plan .form-group-wrapper,
    .field--name-field-cancellation .paragraphs-subform.form-wrapper {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(500px, 1fr));
        gap: 0 1rem;  
    }
    
    &.support-plan :is(.field--name-field-cancellation, .field--name-field-reason) {
            grid-column: 1 / -1; 
    }

    &.support-session .form-group-wrapper {
        grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
        gap: 0 1rem; 

        #session-rules-date-wrapper {
            grid-column: 1 / -1;
        }
    }

    &.ilp-target .form-group-wrapper {
        grid-template-columns: repeat(auto-fit, minmax(500px, 1fr));
        gap: 0 1rem; 
        align-items: center;
    }
}

#block-nexus-content form #edit-moderation-state-wrapper .form-type-item {
    display: flex;
    align-items: center;
    inline-size: fit-content;
    margin-bottom: 0;

    label {
        position: relative;
    }
}

/*************************

    Pre-screening form

**************************/

.neurodiversity-provider-access__layout {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(420px, 100%), 1fr));
    column-gap: 2rem;
}

.neurodiversity-provider-access__heading {
    grid-column: 1 / -1;
}

.neurodiversity-provider-access__intro p {
    margin-block: 1rem 1.25rem;

    &:first-child {
        margin-top: 0;
    }
}

/*************************

    Support Plan

**************************/

#node-support-plan-edit-form {
    position: relative;

    .field--name-field-meeting-attended {
        position: absolute;
        inset-block-start: 10px;
        inset-inline-end: 30px;
    }

    .field--name-field-meeting-date {
        grid-column: 2;
        grid-row: 1 / 3;
        align-self: center;
    }

    #equipment-edit-group > .form-group-wrapper {
        display: grid;
        grid-template-rows: auto auto;
        gap: 0 1rem;

        .field--name-field-equipment-information {
            grid-column: 2;
            grid-row: 1 / -1;

            .form-type-textarea.form-item {
                padding-bottom: 20px;
            }

            div, textarea {
                block-size: 100%;
            }
        }
    }

    #evidence-edit-group details {
        background: #fff;
        border-radius: 1rem;
    }

    #traits-edit-group > .form-group-wrapper {
        display: grid;
        grid-template-columns: repeat(6, 1fr);
        gap: 1rem;
        align-items: center;

        &>div > fieldset {
            margin-bottom: 0;
        }

        .field--type-list-string .fieldset-wrapper .form-checkboxes {
            display: grid;
            gap: 0 1rem;
        }

        &>div:nth-child(-n + 3) {
            grid-column: span 2;

            .fieldset-wrapper > .form-checkboxes {
                grid-template-columns: repeat(3, 1fr);
            }
        }
        &>div:nth-child(n + 4):nth-child(-n + 7) {
            grid-column: span 2;

            .fieldset-wrapper > .form-checkboxes {
                grid-template-columns: repeat(2, 1fr);
            }
        }

        .field--type-text-long{
            grid-column-start: 5;
            grid-column-end: 7;
            grid-row-start: 2;
            grid-row-end: 4;
            align-self: stretch;

            div, textarea {
                block-size: 100%;
            }
        }
    }

    #summary-edit-group .field--type-text-long.form-wrapper {
        margin-bottom: 2rem;
    }

    #recommendation-edit-group .form-group-wrapper {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr));
        grid-template-rows: auto 1fr;
        gap: 0 1rem;

        .field--name-field-type-of-support .form-checkboxes {
            display: flex;
            flex-wrap: wrap;
            gap: .75rem 1rem;

            &> .form-type-checkbox {
                margin-top: 0;
            }
        }
                
        .field--name-field-reasonable-adjustments,
        .field--name-field-software-recommended {
            grid-row: span 2;
        }
   
        .field--name-field-reasonable-adjustments {
            margin-bottom: 20px;

            fieldset {
                block-size: 100%;
            }
        }

        .field--name-field-recommended-adjustments {
            margin-bottom: 20px;

            :is(div, textarea) {
                block-size: 100%;

            }
        }
    }

    #breakdown-edit-group .form-group-wrapper {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 0 1rem;

        div:nth-child(7) {
            grid-area: 3 / 2;
        }
        div:nth-child(8) {
            grid-area: 3 / 3;
        }
        div:nth-child(9) {
            grid-area: 4 / 2;
        }
        div:nth-child(10) {
            grid-area: 4 / 3;
        }
        div:nth-child(11) {
            grid-area: 5 / 2;
        }
        div:nth-child(12) {
            grid-area: 5 / 3;
        }
        div:nth-child(13) {
            grid-area: 6 / 2;
        }
        div:nth-child(14) {
            grid-area: 6 / 3;
        }

        .field-suffix {
            position: absolute;
            inset-inline-end: 15px;
            inset-block-start: 50%;
            transform: translateY(-50%);
        }
    }

    #approval-edit-group .form-group-wrapper {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(500px, 1fr));;
        gap: 2rem;
    }

    .field--name-field-amendments-to-support {
        padding: 1rem 1rem 2rem;

        .paragraphs-subform {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 20px 1rem;

            div:not(.field--type-text-long, .field--type-string-long, .field--type-datetime:is(.field--name-field-amendment-proposed-date,.field--name-field-amendment-end-date)) {
                grid-column: span 2;
            }

            div:is(.field--type-text-long, .field--type-string-long) {
                grid-column: 1 / -1;
            }

            fieldset {
                block-size: 100%;
            }

            .field--type-datetime:not(.field--name-field-date-issued) :is(.form-item.form-type-date , input) {
                inline-size: 100%;
            }

            .field--name-field-support-type {
                grid-row: 1;
            }
            .field--name-field-date-issued {
                grid-row: 1 / 3;
            }

        }
    }


    .support-plan > .form-group-wrapper > .signature-group {
        grid-template-columns: repeat(auto-fit, minmax(500px, 1fr));
    }

}




/*************************

    Support Sessions

**************************/
#node-support-session-edit-form {
    #edit-field-type-of-support {
        overflow: clip;
        block-size: 62.5px;

        &:has(option[selected="selected"]) option:not([selected="selected"]) {
            display: none
        }
    }
}

#cancellation-edit-group .form-group-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;

    h3,
    .field--name-field-reason-for-cancellation,
    .field--name-field-cancellation-upload {
        grid-column: 1 / -1;
    }

    .form-radios {
        display: flex;
        flex-wrap: wrap;
        gap: 1rem;

        div:has(.form-radio[value='_none']) {
            display: none;
        }
    }

    .field--name-field-reason-for-cancellation .form-type-textarea+.form-wrapper {
        display: none;
    }
}

#node-support-session-edit-form {
    position: relative;
}

#additional-form-actions {
    position: absolute;
    inset-block-end: 0;
    inset-inline-end: 0;
    display: flex;
    gap: 1rem;
    justify-content: end;
}

#node-individual-learning-plan-target-edit-form:not(:has(.field--name-field-revision)) .form-type-vertical-tabs,
#node-support-plan-edit-form:not(:has(.field--name-field-revision)) .form-type-vertical-tabs,
#node-support-session-edit-form:not(:has(.field--name-field-revision)) .form-type-vertical-tabs {
    display: none;
}

#node-individual-learning-plan-target-edit-form:has(.field--name-field-revision) .form-type-vertical-tabs,
#node-support-plan-edit-form:has(.field--name-field-revision) .form-type-vertical-tabs,
#node-support-session-edit-form:has(.field--name-field-revision) .form-type-vertical-tabs {
    overflow: clip;
}
.form-type-vertical-tabs > .vertical-tabs {
    transition: 1s ease-in-out;
    block-size: 300px;
}

#additional-form-actions:not(:has(.field--name-field-revision input:checked)) + div .vertical-tabs {
    transform: translateX(2000px);
    opacity: 0;
    block-size: 1px;
}

#additional-form-actions:has(.field--name-field-revision input:checked) + div .vertical-tabs {
    transform: translateX(0);
    opacity: 1;
}

.highlighted__section:has(.hidden) {
    padding: 0;
}

.support-session  > .form-group-wrapper > .signature-group {
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}

#edit-field-mentor-signature.form-radios {
    display: flex;
    justify-content: space-evenly;

    .form-item:has([value="n_a"]) {
        display: none;
        pointer-events: none;
    }
}




/******************************

Support Plan Breakdown View

*******************************/

.view-support-plan-price-breakdown .views-row {
    display: grid;
    grid-template-columns: repeat(4, 1fr);

    .views-field {
        inline-size: 100%;
    }

    &>.sp-breakdown {
        padding: .5rem 1rem;
    }

    &>.table-heading.sp-breakdown {
        grid-row: 1;
        font-size: 1.25rem;
        font-weight: 600;
        border-bottom: 4px solid #CCC;
    }
    &>.field-total.sp-breakdown {
        display: flex;
        justify-content: space-between;
        inline-size: calc(100% + 1px);
        margin-left: -1px;
    }

    &>.field-total.sp-breakdown,
    &>.field-item.sp-breakdown {
        border: 1px solid #CCC;
    }

    &>.sp-breakdown.col-1 {
        grid-column: 1; 
    }
    &>.sp-breakdown.col-2 {
        grid-column: 2;
        text-align: center;
    }
    &>.sp-breakdown.col-3 {
        grid-column: 3;
        text-align: center;
    }
    &>.sp-breakdown.col-4 {
        grid-column: 4;
        text-align: end;
    }
    &>.field-item.sp-breakdown.border-l {
        border-left-width: 3px;
    }
    &>.field-item.sp-breakdown.border-r {
        border-right-width: 3px;
    }
    &>.field-item.sp-breakdown.border-bl {
        border-left-width: 3px;
        border-bottom-width: 3px;
    }
    &>.field-item.sp-breakdown.border-b {
        border-bottom-width: 3px;
    }
    &>.field-total.sp-breakdown.border-lr {
        border-left-width: 3px;
        border-right-width: 3px;
    }
    &>.field-total.sp-breakdown.border-lbr {
        border-left-width: 3px;
        border-right-width: 3px;
        border-bottom-width: 3px;
    }

    &>.sp-breakdown.col-4.striked {
        position: relative;

        &::after {
            content: "";
            position: absolute;
            inset-block-start: 50%;
            inset-inline-start: 15px;
            inset-inline-end: 15px;
            block-size: 3px;
            transform: translateY(-50%) rotate(-2deg);
            background: #666;
        }

        &>.field-content > span {
            position: absolute;
            inset-block-start: 0;
            inset-inline-end: 3px;
        }
    }

    &>.sp-helptext {
        position: relative;
        grid-row: span 3;
        grid-column: 1 / 4;

        .field-content > span {
            position: absolute;
            inset-block-start: 10px;
            inset-inline-start: 1.35rem;
        }

        li {
            font-size: .75rem;
            list-style: none;
        }
    }

    &:has(.sp-helptext > .field-content:empty) .striked > .field-content span {
        display: none;
    }
}
.document-container {
    h3 {
        padding-left: 1rem;
        margin-top: 1rem;
        margin-bottom: 1.5rem;
    }

    h5:is(.overview-subheading, .record-subheader),
    .field,
    p {
        margin-block: .75rem 1rem;
    }
    .field--name-field-software-recommended .field__item::before {
        display: none;
    }
    .field--entity-reference-target-type-taxonomy-term .field__item a {
        padding-right: 0;
    }
}

.record-info {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(300px),1fr));
    gap: 1rem;

    &>.field {
        display: inline-flex;
        flex-wrap: wrap;
        inline-size: fit-content;
    }
}

.record-style {
    background: rgba(255,255,255,.8);
    padding: 1rem;
    margin-block: 10px 20px;
    border-radius: 1rem;
    margin-inline: 1rem;

    &>h5:is(.overview-subheading, .record-subheader):first-child {
        margin-top: 0;
    }
}

.flex {
    display: flex;
    flex-wrap: wrap;
    gap: 0 .5em;
    
    &>.field:has(.field__label) {
        display: flex;

        &>.field__label {
            float: none;
        }
    }
}
.paragraph--type--amendments-to-support .field--name-field-approved-by {
    position: relative;

    &::after {
        content: "-";
    }
}

#session-overview-wrapper {
    container: overview / inline-size;

    .field--name-field-assistive-technology > .field__item > .paragraph {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%),1fr));
        gap: 1rem;

        &>.field {
            display: inline-flex;
            flex-wrap: wrap;
            gap: .5em;
            inline-size: fit-content;
        }
    }
}

#past-future-sessions-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;

    &>div:not(#block-future-learning-sessions-block) {
        grid-column: 1 / -1;
    }
    #block-past-learning-sessions-block {
        grid-row: 2;
    }

    #block-future-learning-sessions-block {
        grid-row: 2;
        grid-column: 2;
        justify-self: end;
    }
}

@container overview (max-inline-size: 500px) {
    #past-future-sessions-container {
        display: block;
    }
}

#signature-group {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%),1fr));
    gap: 1rem;   
}

.flex-list,
.flex-list-fields :is(.field:not(:has(.field__items)), .field__items) {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.flex-list-fields .field__item {
    --clr: lightblue;
    inline-size: fit-content;
    padding: .25rem .75rem;
    background-color: var(--clr);
    background-color: oklch(from var(--clr) calc(l + 0.05) calc(c - 0.01) h);
    border-radius: 1rem;
}

.grid-cols-2-auto {
    display: grid;
    grid-template-columns: repeat(auto-fit,minmax(min(400px, 100%),1fr));
    gap: 0 1rem;

    &>div:not(.field) {
        grid-column: 1 / -1;
    }
    .field {
        white-space: nowrap;
    }
}

.signature-group-item {
    position: relative;

    .field__item:has(img),
    .field-content {
        display: grid;
        &>img {
            place-self: center;
        }
    }
}

.signature-info {
    position: absolute;
    inset-inline-end: 0;
    inset-block-end: 0;

    .field {
        font-size: 10px;
        text-align: right;
        padding-right: 1rem;
    }
}

.field--name-field-mentor-signature:has( + #block-mentor-signature-block),
.field--name-field-learner-signature:has( + #block-learner-signature-block),
.field--name-field-case-manager-signature:has( + #block-case-manager-signature-block) {
    display: none;
}

.field--name-field-provider-signature >.field__item > img {
    block-size: 180px;
    max-inline-size: 288px;
}

@media (max-inline-size: 48rem) {
    .record-style {
        display: grid;
        gap: .25rem;
        margin-inline: .5rem;
    }

    .document-container .field,
    .document-container p {
        margin-block: .25rem;
    }

    .document-container h5:is(.overview-subheading, .record-subheader) {
        margin-block: .5rem .25rem;
    }
}

#block-nexus-supportsessionchecklist > .content {
    position: sticky;
    top: 150px;
}