.unreadMessageColumn {
    padding: 10px 0 0 7px;
}

.unreadMessageCircle {
    display: inline-block;
    width: 12px;
    height: 12px;
    background-color: #0a78cd;
    border-radius: 50%;
}

.nidirect-header__container {
    align-items: center;
}


.field-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem 2rem;
}

.field-item {
    display: flex;
    flex-direction: column;
}

.responsive-label {
    display: none;
}

.govuk-table__header__nowrap {
    white-space: nowrap;
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
    box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

.header-div {
    background-color: #eee;
}

.response-div {
    height: 500px;
    max-height: 500px;
    overflow: auto;
}

.cb-question {
    padding: 5px;
    margin: 5px 5px 5px 150px;
    text-align: right;
    border: 1px solid #ddd;
    border-radius: 10px;
    background-color: #C9DDF0;
    word-wrap: break-word;
}

.cb-answer p {
    padding: 5px;
    margin: 5px 150px 5px 5px;
    text-align: left;
    border: 1px solid #ddd;
    border-radius: 10px;
    background-color: #F5F5F5;
    word-wrap: break-word;
}

.cb-dialog p {
    padding: 5px;
    margin: 5px 150px 5px 25px;
    text-align: left;
    border: 1px solid #ddd;
    border-radius: 10px;
    cursor: pointer;
    color: #1d70b8;
    background-color: #F5F5F5;
    word-wrap: break-word;
}

.ccms-loader {
    border: 12px solid #DEE0E2;
    border-radius: 50%;
    border-top-color: #005EA5;
    width: 60px;
    height: 60px;
    -webkit-animation: spin 2s linear infinite;
    animation: spin 2s linear infinite;
}

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/* Mobile: table compaction and responsive table layout (~640px) */
@media (max-width: 40.0625em) {
    table.govuk-table {
        width: 100%;
        table-layout: fixed; /* helps prevent overflow from long content */
    }

    td.hideOnMobile, th.hideOnMobile {
        display: none;
    }

    /* Let long content wrap instead of pushing the viewport */
    table.govuk-table a,
    table.govuk-table .govuk-table__cell,
    table.govuk-table .govuk-table__header {
        overflow-wrap: break-word;
        word-break: auto-phrase;
    }

    .responsive-table thead {
        display: none;
    }

    .responsive-table .govuk-table__row {
        display: block;
        border-top: 1px solid #b1b4b6;
        padding-top: 8px;
        margin-bottom: 12px;
    }

    .responsive-table .govuk-table__cell,
    .responsive-table .govuk-table__header {
        display: block;
        width: 100%;
        text-align: left; /* override numeric on mobile for readability */
    }

    .responsive-table .govuk-table__cell--numeric,
    .responsive-table .govuk-table__header--numeric {
        text-align: left;
    }

    /* Any control whose id starts with postcode-search- gets spacing on small screens */
    [id^="postcode-search-"] {
        margin-bottom: 10px !important;
    }
}

/* --- TRANSLATE BUTTON AND WIDGET STYLES --- */

#language-widget-container {
    position: fixed;
    bottom: 10px;
    right: 10px;
    z-index: 9999;
    cursor: pointer;
    user-select: none;
    font-family: Arial, sans-serif;}

#language-icon {
    background-color: #0a78cd;
    color: white;
    padding: 0px 5px;
    width: auto;
    height: 40px;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    overflow: hidden;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    transition: all 0.2s ease-in-out;
    font-family: Arial, sans-serif;
}

    #language-icon:hover {
        text-decoration: underline;
        box-shadow: 0 6px 10px rgba(0, 0, 0, 0.3);  /*Enhanced shadow */
    }

    #language-icon .text {
        font-size: 16px;
        font-weight: 600;
        white-space: nowrap;
        opacity: 1;
        margin: 0;
    }

/* 3. Language List Container (#google_translate_element) Styles */
#google_translate_element {
    position: absolute;
    bottom: 50px;
    right: 0;
    width: 175px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    background-color: white;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
    padding: 10px;
    border-radius: 5px;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

/* State when the button is clicked */
#language-widget-container.active #google_translate_element {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

/* 4. Widget Cleanup (goog-te classes) */

/* Targets the main widget container (removes default border/padding) */
.skiptranslate.goog-te-gadget {
    border: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background-color: transparent !important;
    line-height: normal !important;
}

/* Style the Language Select element itself */
.goog-te-combo {
    width: 100% !important; /* Fills the new 200px parent container */
    padding: 8px 10px !important;
    border: 1px solid #ccc !important;
    border-radius: 4px !important;
    box-shadow: none !important;
    font-size: 14px !important;
    color: #333 !important;
    background-color: #f9f9f9 !important;
    margin-bottom: 5px !important; /* Space below the dropdown */
}

/* FIX: Ensure the "Powered by" line is VISIBLE, centered, and fits */
/* This is the rule from the first block, which is correct for display */
.goog-te-gadget > span:last-child {
    text-align: center;
    margin-top: 5px;
    font-size: 10px;
}

/* FIX: Ensure no conflicting HIDDEN rules are active. */
/* Delete the entire second block of CSS (starting with /*WIDGET*/

/* All iPhone 14 models (up to 430px) */
@media (max-width: 430px) {
    a.govuk-button[onclick*="FindBillingAddress"] {
        margin-top: 1rem !important;
    }
}