/*
    Accordion header styling.

    Radzen 11 renders the accordion header with its own markup (.rz-accordion-header
    and the toggle link inside it), so the GOV.UK ".govuk-accordion__section-button"
    rules never reach it. These rules replicate the GOV.UK link appearance used
    elsewhere in the app (e.g. the Business Plan "View/Edit" links): blue text,
    a slightly larger font, and an underline on hover.
*/

.govuk-accordion .rz-accordion-header,
.govuk-accordion .rz-accordion-header a,
.govuk-accordion .rz-accordion-header button {
    color: #1d70b8 !important;
    font-family: Arial, sans-serif;
    font-weight: 400;
    text-decoration: none;
    cursor: pointer;
}

/* Divider line after each accordion item, matching the pre-upgrade GOV.UK look. */
.govuk-accordion .rz-accordion-header {
    border-bottom: 1px solid #b1b4b6;
}

/* Apply the larger GOV.UK link size to the header text only, never the
   Radzen toggle icon (which relies on its own .rzi/.rz-accordion-toggle-icon sizing). */
.govuk-accordion .rz-accordion-header a > span:not(.rz-accordion-toggle-icon),
.govuk-accordion .rz-accordion-header button > span:not(.rz-accordion-toggle-icon) {
    font-size: 19px;
    line-height: 1.3157894737;
}

.govuk-accordion .rz-accordion-header a:hover,
.govuk-accordion .rz-accordion-header button:hover {
    color: #003078 !important;
}

/* Underline the text on hover, but leave the toggle icon untouched. */
.govuk-accordion .rz-accordion-header a:hover > span:not(.rz-accordion-toggle-icon),
.govuk-accordion .rz-accordion-header button:hover > span:not(.rz-accordion-toggle-icon) {
    text-decoration: underline;
    text-decoration-thickness: max(3px, .1875rem, .12em);
}
