/*-----------------------------------------*/
/*--- COOKIES                       -------*/
/*--- CONTAINER                     -------*/
/*--- ACCORDIONS                    -------*/
/*--- TABS                          -------*/
/*--- SEARCH                        -------*/
/*--- POWERMAIL                     -------*/
/*--- NEWS                          -------*/
/*-----------------------------------------*/

/*--- COOKIES ---*/
#tx_cookies {
    /* COOKIE SETTINGS BUTTON */
    .cookieSettings-btn {
        display: none;
    }

    /* TYPO3 MESSAGES */
    .typo3-messages {
        display: none;
        visibility: hidden;
    }

    /* COOKIE SELECTION BOX */
    #tx_cookies_inner {
        position: relative;
        top: 0;
        bottom: unset;
        z-index: unset;
        background-color: #E8EDEE;
        padding: 20px;

        &.show {
            display: block;
        }

        #tx_cookies_close {
            display: none;

            &::after {
                content: "";
                padding: 0;
            }
        }

        h2 {
            margin: 0 0 10px;
        }

        a {
            text-decoration: underline;
        }

        /* - COOKIE ACCEPT/REJECT BUTTONS - */
        .cookie-controls {
            form {
                width: 100%;
            }

            .cookie-controls-btn {
                display: flex;
                justify-content: space-between;
                gap: 10px;

                input {
                    width: 100%;
                    white-space: normal;

                    &.btn-primary, &.primary-btn,
                    &.btn-secondary {
                        display: inline-block;
                        padding: 8px 25px;
                        outline: none;
                        border: 0;
                        border-radius: 5px;
                        font-size: 1.6rem;
                        line-height: calc(1.6rem * 1.5);
                        word-spacing: calc(1.6rem * 0.16);

                        &:hover {
                            text-decoration: underline;
                        }

                        &:focus {
                            background: #FFB81C!important;
                            color: #231F20!important;
                            box-shadow: none!important;
                            text-decoration: underline;
                        }
                    }

                    &.btn-primary, &.primary-btn {
                        background-color: #005EB8;
                        color: #fff;

                        &:hover {
                            background-color: #003087;
                            text-decoration: underline;
                        }
                    }

                    &.btn-secondary {
                        background-color: #003087;
                        color: #fff;

                        &:hover {
                            background-color: #005EB8;
                            text-decoration: underline;
                        }
                    }
                }
            }
        }
    }
}

/* COOKIE PAGE ONLY */
.cookies-btn {
    #tx_cookies {
        #tx_cookies_showPermanent, #tx_cookies_inner {
            position: static;
            transition: none;
        }

        /* - COOKIE SELECTION BOX - */
        #tx_cookies_inner {
            border-radius: 5px;

            #tx_cookies_close {
                display: block;
                width: auto;
            }
        }
    }
}

/* COOKIES MEDIA QUERIES */
@media screen and (max-width: 576px) {
    /* - COOKIE SELECTION BOX - */
    #tx_cookies_inner {
        &.show {
            display: inline-block;
        }

        #tx_cookies_close {
            float: none;
            margin-left: 0;
        }

        /* - COOKIE ACCEPT/REJECT BUTTONS - */
        .cookie-controls {
            .cookie-controls-btn {
                justify-content: flex-start;
                flex-direction: column;
            }
        }
    }
}

/*--- CONTAINER ---*/
.grid-container {
    [class*="col-"]:empty {
        display: none !important;
    }
}

/*--- ACCORDIONS ---*/
.accordion {
    margin-bottom: 1.5rem;

    .accordion-item {
        border: 1px solid #E8EDEE;
        border-radius: 0;
        margin-bottom: 5px;

        &:first-of-type {
            .accordion-button {
                border-top-left-radius: 0;
                border-top-right-radius: 0;
            }
        }

        &:last-of-type {
            .accordion-button {
                border-bottom-left-radius: 0;
                border-bottom-right-radius: 0;
            }

            /* OVERRIDES BOOTSTRAP BORDER RADIUS */
            &>.accordion-header {
                .accordion-button {
                    &.collapsed {
                        border-bottom-right-radius: 0;
                        border-bottom-left-radius: 0;
                    }
                }
            }
        }

        /* ACCORDION HEADER/BUTTON */
        .accordion-header {
            margin: 0;

            .accordion-button {
                display: flex;
                justify-content: space-between;
                align-items: center;
                width: 100%;
                background-color: #0d2240;
                color: #fff;
                border-radius: 0;
                border: 0;
                padding: 10px;
                margin-bottom: 0;
                text-align: left;
                font-size: 1.6rem;
                line-height: calc(1.6rem * 1.5);
                word-spacing: calc(1.6rem * 0.16);

                &:hover {
                    background-color: #003087;
                    text-decoration: underline;
                }

                &:focus {
                    background: #fcc100!important;
                    color: #231f20!important;
                    box-shadow: none;
                    border-color: transparent;
                }

                &:not(.collapsed) {
                    background: #fcc100!important;
                    color: #231f20!important;
                    box-shadow: none;
                    border-color: transparent;
                    text-decoration: none;
                }

                &::after {
                    content: none;
                }

                /* - SETS ACCORDION TOGGLE ICON WHEN CLOSED - */
                .accordion-toggle-text {
                    margin-left: auto;

                    &:after {
                        content: '\002B';
                        margin-left: 10px;
                    }
                }

                /* - SETS ACCORDION TOGGLE ICON WHEN OPEN - */
                &:not(.collapsed) {
                    .accordion-toggle-text {
                        &::after {
                            content: '\2212';
                        }
                    }
                }
            }
        }

        /* ACCORDION BODY */
        .accordion-body {
            [data-label="header"] {
                &:first-child {
                    display: none;
                }

                /* - HEADING STYLING FOR ACCORDIONS INSIDE ACCORDIONS */
                .accordion {
                    h2 {
                        &:first-child {
                            display: block;
                        }
                    }

                    .accordion-body {
                        h2 {
                            &:first-child {
                                display: none;
                            }
                        }
                    }
                }
            }
        }
    }
}

/* ACCORDION COLOUR OVERRIDES */
/* - UPDATES ACCORDION CONTENT ELEMENT #C18915 TO USE NHS EMERGENCY SERVICES RED
   - PAGE UID: 2698
   - REQUESTED BY MEGAN LITJENS ON 10/06/2026
- */
.accordion .accordion-item .accordion-header {
    button#c18915 {
        background-color: #DA291C;
    }
}

/*--- TABS ---*/
.tab-navigation {
    background-color: transparent;

    .nav-tabs {
        border-bottom: 2px solid #e8edee;

        button {
            width: auto;
            background: transparent;
            color: #005EB8;
            font-size: 1.6rem;
            border: 2px solid transparent;
            padding: 10px 12px;
            border-radius: 0;
            text-decoration: underline;
            transition: none;

            &:hover {
                background-color: #003087;
                color: #fff;
                text-decoration: none;
            }

            &:focus,
            &.active {
                background-color: #ffb81C;
                color: #231f20;
                box-shadow: none !important;
                outline: none;
                border: 2px solid #e8edee !important
            }
        }
    }
}

/*--- SEARCH ---*/
/* SEARCH BOX */
.searchBox {
    .kesearchbox {
        #ke_search_sword {
            border: 2px solid #005EB8;
            color: #231f20;
            margin-bottom: 5px !important;
            font-size: 1.4rem;
            line-height: calc(1.4rem * 1.5);
            word-spacing: calc(1.4rem * 0.16);
        }
    }

    /* - SEARCH BOX BUTTON */
    .submitbutt {
        position: relative;
        display: block;

        input {
            position: absolute;
            top: -38px;
            right: 2px;
            min-width: 31px;
            max-width: 31px;
            padding: 4px;
            border: 2px solid transparent;
        }
    }
}

/* SEARCH PAGE */
.tx-kesearch-pi1 {
    /* - RESULT NUMBER - */
    #kesearch_num_results {
        margin-bottom: 10px;
        color: #231f20;
    }

    /* - RESULTS LIST - */
    #kesearch_results {
        .result-list-item {
            margin: 10px 0;

            .result-teaser {
                color: #231f20;
            }

            /* -- SEARCH HITS -- */
            .hit {
                color: #005eb8;
                font-weight: bold;
            }
        }
    }

    /* - PAGINATION - */
    #kesearch_pagebrowser_bottom {
        color: #231f20;
        text-align: left;
        margin: 30px 0 0;

        .pages_total {
            border-top: 3px solid #005eb8;

            .result_txt {
                color: #231f20;
                margin: 10px 0;
            }

            .kesearch_pagebrowser {
                .pagination {
                    display: flex;
                    align-items: center;
                    flex-wrap: wrap;
                    margin-bottom: 0;
                    margin-left: 0;

                    .page-item {
                        margin: 0;
                        margin-bottom: 1.5rem;
                        margin-right: 10px;

                        .page-link {
                            background-color: #005eb8;
                            color: #fff;
                            padding: 5px 15px;
                            border-color: transparent;
                            border-radius: 0;
                            font-weight: normal;
                            font-size: 1.6rem;
                            line-height: calc(1.6rem * 1.5);
                            word-spacing: calc(1.6rem * 0.16);

                            &:hover {
                                background-color: #003087;
                                color: #fff;
                                text-decoration: underline;
                            }

                            &:focus {
                                background: #FFB81C;
                                color: #231F20 !important;
                                box-shadow: none!important;
                            }
                        }

                        &.active {
                            .page-link {
                                background: #FFB81C;
                                color: #231F20 !important;
                                box-shadow: none!important;
                                text-decoration: none;
                            }
                        }
                    }
                }
            }
        }
    }
}

/*--- POWERMAIL ---*/
.tx-powermail {
    border: 1px solid #E8EDEE;
    padding: 10px;

    .powermail_form {
        /* ERROR BOX */
        .powermail_message_error {
            background-color: #f8d4d2;
            border: 2px solid #8b1309;
            padding: 10px;
            margin-bottom: 1.5rem;

            h2 {
                font-size: 2.6rem;
                line-height: calc(2.6rem * 1.5);
                word-spacing: calc(2.6rem * 0.16);
            }

            ol {
                font-weight: 600;
            }
        }

        /* TEXT AS A FIELD */
        .powermail_fieldwrap_type_text {
            margin-bottom: 10px;
        }

        /* FORM FIELDS */
        .powermail_fieldset {
            legend {
                display: block;
                width: 100%;
                border: 0;
                border-bottom: 1px solid #E8EDEE;
                margin-bottom: 1.5rem;
                font-size: 2.2rem;
                line-height: calc(2.2rem * 1.5);
                word-spacing: calc(2.2rem * 0.16);
            }

            .powermail_fieldwrap {
                margin-bottom: 10px;

                .powermail_field {
                    /* - INLINE ERRORS - */
                    &:has(.powermail-errors-list) {
                        input {
                            margin-bottom: 6px;
                        }
                        textarea {
                            margin-bottom: 0;
                        }
                    }

                    .powermail-errors-list {
                        background-color: #f8d4d2;
                        border: 2px solid #8b1309;
                        font-size: 1.6rem;
                        line-height: calc(1.6rem * 1.5);
                        word-spacing: calc(1.6rem * 0.16);
                        font-weight: 600;
                        padding: 5px 10px;
                        margin: 0 0 1.5rem;

                        li {
                            list-style: none;
                            margin-left: 0;
                        }
                    }

                    /* - INPUTS - */
                    input:not([type=submit]),
                    textarea,
                    select,
                    &[type=radio],
                    &[type=checkbox] {
                        background-color: #fff;
                    }

                    /* - RADIO BUTTONS AND CHECKBOXES - */
                    p.powermail_label {
                        font-weight: 600;
                        margin-bottom: 5px;
                    }

                    .powermail_radiowrap,
                    .powermail_checkwrap {
                        display: flex;
                        align-items: center;
                        margin-bottom: 1.5rem;

                        label {
                            margin-bottom: 0;
                            font-weight: normal;
                        }
                    }
                }
            }
        }

        /* SPLIT PAGES */
        /* - TABS - */
        .powermail_multistep_navigation {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 10px;

            .tab-btn {
                border-radius: 5px;

                &.active {
                    text-decoration: underline;
                }
            }
        }

        /* - BUTTONS - */
        .powermail_tab_navigation {
            display: flex;
            align-items: center;
            gap: 1.5rem;

            button {
                margin-bottom: 0;
            }
        }
    }

    /* CONFIRMATION PAGE */
    .powermail_confirmation {
        h2 {
            font-size: 2.6rem;
            line-height: calc(2.6rem * 1.5);
            word-spacing: calc(2.6rem * 0.16);
        }

        /* - CONFIRMATION TABLE - */
        figure.table {
            table {
                tbody {
                    th {
                        font-weight: normal;
                    }
                }
            }
        }

        /* - CONFIRMATION BUTTONS - */
        .powermail_tab_navigation {
            display: flex;
            align-items: center;
            gap: 1.5rem;

            input[type=submit] {
                display: inline-block;
                padding: 8px 25px;
                outline: none;
                border: 0;
                border-radius: 5px;
                font-size: 1.6rem;
                line-height: calc(1.6rem * 1.5);
                word-spacing: calc(1.6rem * 0.16);
                background-color: #005EB8;
                color: #fff;

                &.secondary-btn {
                    background-color: #003087;
                    color: #fff;
                }

                &:hover {
                    text-decoration: underline;
                }

                &:focus {
                    background-color: #ffb81C;
                    color: #231f20;
                    box-shadow: none!important;
                    outline: none;
                }
            }
        }
    }

    /* - CONFIRMATION MESSAGE - */
    .powermail_create {
        p:first-child {
            color: #01785b;
            font-weight: bold;
        }
    }
}

/* POWERMAIL MEDIA QUERIES */
@media screen and (max-width: 576px) {
    .tx-powermail {
        .powermail_form {
            /* - SPLIT PAGES - */
            /* - TABS - */
            .powermail_multistep_navigation {
                flex-direction: column;
                gap: 0;
            }

            /* -- BUTTONS -- */
            .powermail_tab_navigation {
                flex-direction: column;
                align-items: flex-start;
                gap: 0;
            }
        }

        /* - CONFIRMATION PAGE - */
        .powermail_confirmation {
            /* -- CONFIRMATION BUTTONS -- */
            .powermail_tab_navigation {
                flex-direction: column;
                align-items: flex-start;
                gap: 0;
            }
        }
    }
}

/*--- NEWS ---*/
.news {
    /* LIST VIEW */
    .news-list-view {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        margin-bottom: 20px;

        .article {
            display: flex;
            flex: 0 0 calc((100% / 4) - (8px * (4 - 1) / 4));
            margin-right: 8px;
            padding: 0 !important;
            margin-bottom: 1.5rem !important;

            &:nth-of-type(4n) {
                margin-right: 0;
            }

            a {
                flex-direction: column;
                text-decoration: none;

                &:hover {
                    .news-text-wrap {
                        background-color: #003087;
                        box-shadow: none;
                        text-decoration: underline;
                    }
                }

                &:focus {
                    .news-text-wrap {
                        background-color: #ffb81C;
                        color: #231f20;
                        box-shadow: none !important;
                        outline: none;
                    }
                }

                &:hover, &:focus {
                    .news-img-wrap {
                        img {
                            outline: 0;
                        }
                    }
                }

                .news-img-wrap {
                    float: none;
                    margin: 0;

                    img {
                        display: block;
                        width: 100%;
                        float: none;
                    }
                }

                .news-text-wrap {
                    background-color: #005EB8;
                    color: #fff;
                    height: 100%;
                    border-bottom-left-radius: 5px;
                    border-bottom-right-radius: 5px;
                    padding: 15px;
                    margin-bottom: 0;
                    font-size: 2rem;
                    line-height: calc(2rem * 1.5);
                    word-spacing: calc(2rem * 0.16);
                    font-weight: normal;
                    text-align: center;
                }
            }
        }
    }

    /* DETAILS VIEW */
    &.news-single {
        .news-list-date {
            border-top: 1px solid #e8edee;
            color: #425563;
            padding: 5px 0 0;
        }

        .article {
            .news-img-wrap {
                float: none;
                width: 100%;
                margin: 0;

                img {
                    float: left;
                    max-width: 60%;
                    margin-right: 1.5rem;
                }
            }
        }
    }

    /* PAGINATION */
    .f3-widget-paginator {
        border-top: 2px solid #005eb8;
        text-align: left;
        padding: 30px 0 0;
        margin-left: 0;
        margin-top: 1.5rem;

        &:first-child {
            display: none;
        }

        li {
            display: inline-flex;
            margin: 0;
            margin-bottom: 1.5rem;

            &.current {
                background: #FFB81C;
                color: #231F20 !important;
                box-shadow: none!important;
                padding: 10.2px 15px !important;
                text-decoration: none;
            }

            a {
                color: #fff !important;
                padding: 10px 15px !important;
                background-color: #005eb8;
                border-color: transparent;
                border-radius: 0;
                font-weight: normal;
                font-size: 1.6rem;
                line-height: calc(1.6rem * 1.5);
                word-spacing: calc(1.6rem * 0.16);
                text-decoration: none;

                &:hover {
                    background-color: #003087;
                    color: #fff !important;
                    text-decoration: underline;
                }

                &:focus {
                    background: #FFB81C;
                    color: #231F20 !important;
                    box-shadow: none!important;
                }
            }
        }
    }
}

/* DETAILS PAGE */
.newsArticle {
    .news .news-list-view .article {
        flex: auto;
        margin-right: 60px;
    }
}

/* NEWS MEDIA QUERIES */
@media screen and (max-width: 991px) {
    .news {
        /* - LIST VIEW - */
        .news-list-view {
            .article {
                flex: 0 0 calc((100% / 2) - (8px * (2 - 1) / 2));

                &:nth-of-type(4n) {
                    margin-right: 8px;
                }

                &:nth-of-type(2n) {
                    margin-right: 0;
                }
            }
        }
    }

    /* - DETAILS PAGE - */
    .newsArticle {
        [class*="col-"]:has(.news-list-view) {
            display: flex;
            flex-direction: column;
            order: 2;
        }

        .news {
            .news-list-view {
                &:has(.article:last-of-type:nth-of-type(odd)) {
                    .article {
                        &:first-child {
                            flex: auto;
                            margin-right: 0;

                            a {
                                width: 100%
                            }
                        }
                    }
                }

                .article {
                    flex: 0 0 calc((100% / 2) - (8px * (2 - 1) / 2));
                    margin-right: 8px;

                    &:nth-of-type(2n+1) {
                        margin-right: 0;
                    }
                }
            }
        }
    }
}
@media screen and (max-width: 767px) {
    .news {
        /* - DETAILS VIEW - */
        &.news-single {
            .article {
                .news-img-wrap {
                    float: none;
                    width: 100%;
                    margin: 0 0 1.5rem 0;
                }
            }
        }
    }
}
@media screen and (max-width: 567px) {
    .news {
        /* - LIST VIEW - */
        .news-list-view {
            .article {
                flex: 0 0 calc((100% / 1) - (8px * (1 - 1) / 1));
                margin-right: 0;
            }
        }

        /* - DETAILS VIEW - */
        &.news-single {
            .article {
                .news-img-wrap {
                    img {
                        float: none;
                        max-width: 100%;
                        margin-right: 0;
                    }
                }
            }
        }
    }

    /* - DETAILS PAGE - */
    .newsArticle {
        .news .news-list-view .article {
            flex: 0 0 calc((100% / 1) - (8px * (1 - 1) / 1));
            margin-right: 0;
        }
    }
}