/* OPAC overrides for the self-hosted accessibility widget (MIT upstream; filename localized). */

/* Match floating button + panel chrome to customer page header color */
.asw-container,
.asw-widget,
.asw-menu,
.asw-menu-btn {
    --asw-primary: var(--page-header-bg, #2C3742) !important;
}

/*
 * Align launcher with .opac-go-top:
 * same size (56 / 50), same right edge, stacked above go-top.
 * Darker than header bg; no white ring / drop shadow.
 */
.asw-menu-btn,
.asw-widget .asw-menu-btn,
a.asw-menu-btn {
    --asw-btn-size: 56px !important;
    --asw-icon-size: 26px !important;
    --asw-btn-size-mobile: 50px !important;
    --asw-icon-size-mobile: 24px !important;

    box-sizing: border-box !important;
    right: 22px !important;
    left: auto !important;
    bottom: 40px !important; /* same as go-top when go-top is hidden; JS lifts when visible */
    top: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;

    width: 56px !important;
    height: 56px !important;
    min-width: 56px !important;
    min-height: 56px !important;
    max-width: 56px !important;
    max-height: 56px !important;

    border: none !important;
    border-width: 0 !important;
    border-style: none !important;
    border-color: transparent !important;
    outline: none !important;
    outline-width: 0 !important;
    outline-style: none !important;
    outline-color: transparent !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    background: color-mix(in srgb, var(--page-header-bg, var(--asw-primary, #2C3742)) 68%, #000) !important;
    background-color: color-mix(in srgb, var(--page-header-bg, var(--asw-primary, #2C3742)) 68%, #000) !important;
    border-radius: 50% !important;
    overflow: hidden !important;
}

.asw-menu-btn:hover,
.asw-menu-btn:focus,
.asw-menu-btn:active,
.asw-menu-btn:focus-visible,
.asw-widget .asw-menu-btn:hover,
.asw-widget .asw-menu-btn:focus {
    border: none !important;
    outline: none !important;
    transform: none !important;
    box-shadow: none !important;
    background: color-mix(in srgb, var(--page-header-bg, var(--asw-primary, #2C3742)) 58%, #000) !important;
    background-color: color-mix(in srgb, var(--page-header-bg, var(--asw-primary, #2C3742)) 58%, #000) !important;
    filter: none;
}

.asw-menu-btn svg {
    width: 26px !important;
    height: 26px !important;
    min-width: 26px !important;
    min-height: 26px !important;
    max-width: 26px !important;
    max-height: 26px !important;
}

.asw-menu-btn:focus-visible {
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--page-header-bg, #2C3742) 35%, transparent) !important;
}

/* Open panel from the right to match launcher side */
.asw-menu {
    --asw-menu-right: 0px !important;
    --asw-menu-left: auto !important;
    left: auto !important;
    right: 0 !important;
}

/* Header icon buttons only (not footer "Reset settings" text button). */
.asw-menu .asw-menu-header .asw-menu-reset,
.asw-menu .asw-menu-header .asw-menu-close,
.asw-menu-header .asw-menu-reset:hover,
.asw-menu-header .asw-menu-close:hover,
.asw-menu-header .asw-menu-reset:focus,
.asw-menu-header .asw-menu-close:focus,
.asw-menu-header .asw-menu-reset:active,
.asw-menu-header .asw-menu-close:active,
.asw-menu-header .asw-menu-reset:focus-visible,
.asw-menu-header .asw-menu-close:focus-visible {
    border: none !important;
    border-width: 0 !important;
    border-style: none !important;
    outline: none !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    filter: none !important;
    background: color-mix(in srgb, var(--page-header-bg, var(--asw-primary, #2C3742)) 68%, #000) !important;
    background-color: color-mix(in srgb, var(--page-header-bg, var(--asw-primary, #2C3742)) 68%, #000) !important;
    color: #fff !important;
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
    max-width: 40px !important;
    max-height: 40px !important;
    padding: 8px !important;
    box-sizing: border-box !important;
}

.asw-menu-header .asw-menu-reset svg,
.asw-menu-header .asw-menu-close svg,
.asw-menu-header .asw-menu-reset svg path,
.asw-menu-header .asw-menu-close svg path {
    width: 22px !important;
    height: 22px !important;
    fill: #fff !important;
    stroke: none !important;
    color: #fff !important;
    filter: none !important;
}

.asw-menu-header .asw-menu-reset:hover,
.asw-menu-header .asw-menu-close:hover {
    opacity: 0.92 !important;
}

/* Keep footer text reset button readable (do not inherit header icon sizing). */
.asw-menu-reset.asw-menu-reset-footer-btn {
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    padding: 15px !important;
    border-radius: 5px !important;
    overflow: visible !important;
    display: block !important;
    line-height: 1.3 !important;
    white-space: normal !important;
    text-align: center !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    box-shadow: none !important;
    border: none !important;
    background: var(--page-header-bg, var(--asw-primary, #2C3742)) !important;
    color: #fff !important;
}

/* Hide vendor footer (brand / external statement links). MIT allows UI modification; keep file header attribution.
   Widget may force display:flex inline on open; JS also removes .asw-footer from the DOM. */
.asw-menu .asw-footer,
.asw-footer {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    max-height: 0 !important;
    overflow: hidden !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    pointer-events: none !important;
}

/* Hide section info icons (external "learn more" links) */
.asw-menu .asw-info-icon {
    display: none !important;
}

/* Remove Visual & Navigation Aids (external PDF reader / structure tools, etc.) */
.asw-menu .asw-items.visual-navigation,
.asw-menu .asw-card:has(.asw-items.visual-navigation) {
    display: none !important;
}

/* Remove Additional Tools (Stop Animations / image tools) */
.asw-menu .asw-items.tools,
.asw-menu .asw-card:has(.asw-items.tools) {
    display: none !important;
}

/* Match .opac-go-top mobile rules (same breakpoint / size / right edge) */
@media only screen and (max-width: 767px) {
    .asw-menu-btn,
    .asw-widget .asw-menu-btn,
    a.asw-menu-btn {
        --asw-btn-size: 50px !important;
        --asw-btn-size-mobile: 50px !important;
        --asw-icon-size: 24px !important;
        --asw-icon-size-mobile: 24px !important;

        right: 14px !important;
        left: auto !important;
        bottom: 40px !important; /* same as go-top when go-top is hidden; JS lifts when visible */
        top: auto !important;
        transform: none !important;

        width: 50px !important;
        height: 50px !important;
        min-width: 50px !important;
        min-height: 50px !important;
        max-width: 50px !important;
        max-height: 50px !important;
        box-shadow: none !important;
    }

    .asw-menu-btn svg,
    .asw-widget .asw-menu-btn svg,
    a.asw-menu-btn svg {
        width: 24px !important;
        height: 24px !important;
        min-width: 24px !important;
        min-height: 24px !important;
        max-width: 24px !important;
        max-height: 24px !important;
    }
}