/* Shared floating accessibility and chatbot tools for frontend pages. */
.frontend-chat-fab {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 1040;
    min-height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .55rem;
    padding: .75rem 1rem;
    border: 0;
    border-radius: 999px;
    background: #067647;
    color: #fff !important;
    font-family: 'Sarabun', 'IBM Plex Sans Thai', sans-serif;
    font-weight: 600;
    box-shadow: 0 10px 28px rgba(24, 67, 55, .25);
    cursor: pointer;
    transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.frontend-chat-fab:hover,
.frontend-chat-fab:focus-visible {
    color: #fff !important;
    background: #055d38;
    outline: none;
    transform: translateY(-2px);
    box-shadow: 0 14px 32px rgba(24, 67, 55, .32);
}

.frontend-chat-fab.is-open {
    background: #184337;
    box-shadow: 0 0 0 3px rgba(255,255,255,.85), 0 12px 30px rgba(24,67,55,.32);
}

.frontend-chat-panel {
    position: fixed;
    right: 24px;
    bottom: 84px;
    z-index: 1055;
    width: min(390px, calc(100vw - 32px));
    height: min(620px, calc(100vh - 116px));
    overflow: hidden;
    border: 1px solid rgba(6,118,71,.2);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 24px 70px rgba(5,59,42,.3);
}

.frontend-chat-panel[hidden] { display: none; }

.frontend-chat-panel__header {
    height: 58px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 1rem;
    background: #2d6a4f;
    color: #fff;
}

.frontend-chat-panel__title {
    display: flex;
    align-items: center;
    gap: .6rem;
}

.frontend-chat-panel__header button {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: rgba(255,255,255,.14);
    color: #fff;
}

.frontend-chat-panel iframe {
    display: block;
    width: 100%;
    height: calc(100% - 58px);
    border: 0;
    background: #f6fbf8;
}

body #accessibility-toolbar {
    right: auto !important;
    left: 24px !important;
    bottom: 24px !important;
    margin: 0 !important;
}

body #accessibility-toolbar #a11y-toggle {
    width: auto !important;
    min-width: 0 !important;
    height: 48px !important;
    justify-content: center !important;
    gap: .55rem !important;
    padding: 0 1rem !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: #0b6047 !important;
    box-shadow: 0 10px 28px rgba(24,67,55,.25) !important;
}

body #accessibility-toolbar #a11y-toggle:hover,
body #accessibility-toolbar #a11y-toggle:focus-visible {
    background: #064e3b !important;
    outline: none !important;
    transform: translateY(-2px);
}

body #accessibility-toolbar #a11y-toggle.is-open {
    background: #184337 !important;
    box-shadow: 0 0 0 3px rgba(255,255,255,.85), 0 12px 30px rgba(24,67,55,.32) !important;
}

body #accessibility-toolbar #a11y-toggle > i {
    width: auto;
    height: auto;
    display: inline-block;
    flex: 0 0 auto;
    border-radius: 0;
    background: transparent;
    text-align: center;
}

body #accessibility-toolbar .a11y-toggle-label {
    display: inline !important;
    font-size: .92rem !important;
}

body #accessibility-toolbar .a11y-dismiss { display: none !important; }

body #accessibility-toolbar .a11y-menu {
    right: auto !important;
    left: 0 !important;
    bottom: 60px !important;
}

@media (max-width: 991.98px) {
    .frontend-chat-fab {
        right: 14px;
        bottom: 14px;
        width: 48px;
        min-width: 48px;
        height: 48px;
        padding: 0;
    }

    .frontend-chat-fab span { display: none; }

    .frontend-chat-panel {
        right: 10px;
        bottom: 72px;
        width: calc(100vw - 20px);
        height: min(620px, calc(100vh - 88px));
        border-radius: 16px;
    }

    body #accessibility-toolbar {
        left: 14px !important;
        bottom: 14px !important;
    }

    body #accessibility-toolbar #a11y-toggle {
        width: 48px !important;
        min-width: 48px !important;
        height: 48px !important;
        padding: 0 !important;
    }

    body #accessibility-toolbar .a11y-toggle-label { display: none !important; }

    body #accessibility-toolbar .a11y-menu {
        width: min(300px, calc(100vw - 28px));
        bottom: 58px !important;
    }
}

@media print {
    .frontend-chat-fab,
    .frontend-chat-panel,
    #accessibility-toolbar { display: none !important; }
}