/* Cookie settings button which needs to be moved above Bulb Messenger button */
#gdc-cookieSettings {
    bottom: 4.375rem;
}

/* Cookie settings container must be placed above cookie settings button */
#gdc-container {
   bottom: 7.75rem;
   right: 1.125rem;
}

/* "Back to top" button which needs to be moved above Bulb Messenger button */
div.fixed:has(#to_top) {
    bottom: 7.75rem;
    right: 1.125rem;
}


.bulb-messenger-element {
    --bui-popup-panel-toggle-button-margin-right: 1.125rem;

    /* Remove default message margins */
    & .bui-message-content p {
        margin-block: 0;
    }

    & bui-message-input {
        --bui-message-input-border-color: lightgray;
    }
}

/*****************/
/* Accessibility */
/*****************/
/* a11y: Impairment */
#bulb-messenger.bulb-a11y-impairment {
    --red: #000;
    --background: #222;
    --lightgrey: #444;

    --chat-i-contrast-light: #fff;
    --chat-i-contrast-medium: var(--lightgrey);
    --chat-i-contrast-dark: var(--red);

    
    .bulb-consent-overlay {
        color: var(--chat-i-contrast-dark);
    }

    .bulb-consent-link {
        color: var(--chat-i-contrast-dark);
    }

    .bulb-footer-link {
        color: var(--chat-i-contrast-light);
    }

    .bulb-consent-button {
        background-color: var(--chat-i-contrast-dark);
        color: var(--chat-i-contrast-light);
    }

    .popup-panel-toggle-button:not(.popup-panel-toggle-button-opened) {
        --bui-button-border-color: var(--chat-i-contrast-light);
    }

    .messenger-popup-panel {
        --bui-popup-panel-toggle-button-color: var(--chat-i-contrast-medium);
        --bui-popup-panel-header-background-color: var(--chat-i-contrast-dark);
        
        .bui-messenger {
            --bui-messenger-background-color: var(--chat-i-contrast-medium);
        }
        
        .bui-message {
            --bui-message-sent-background: var(--chat-i-contrast-dark);
            --bui-message-sent-color: var(--chat-i-contrast-light);
        }
    }

    .bui-messenger-close-conversation-dialog-actions {
        bui-button[variant="secondary"] {
            --bui-button-background: var(--chat-i-contrast-medium);
            --bui-button-background-hover: var(--chat-i-contrast-medium);
            --bui-button-background-active: var(--chat-i-contrast-medium);
        }

        bui-button[variant="danger"] {
            --bui-button-background: var(--chat-i-contrast-dark);
            --bui-button-background-hover: var(--chat-i-contrast-dark);
            --bui-button-background-active: var(--chat-i-contrast-dark);
        }
    }
}

/* a11y: Size */
.bulb-consent-overlay {
    gap: calc(1.25rem * var(--bui-upscale-factor));
    padding: calc(1.5rem * var(--bui-upscale-factor));
}

.bulb-consent-text {
    font-size: calc(1rem * var(--bui-upscale-factor));

    > p {
        margin-block: calc(0.375em * var(--bui-upscale-factor));
    }
}

.bulb-consent-button {
    padding: calc(0.5rem * var(--bui-upscale-factor)) calc(1.5rem * var(--bui-upscale-factor));
    font-size: calc(1rem * var(--bui-upscale-factor));
}

.chat-i-messenger .messenger-popup-panel {
    /* Variables: Popup Panel Header */
    --bui-popup-panel-header-height: calc(4rem * var(--bui-upscale-factor));
    --bui-popup-panel-header-title-font-size: calc(1.25rem * var(--bui-upscale-factor));
    --bui-popup-panel-header-padding-inline: calc(0.375rem * var(--bui-upscale-factor));
    --bui-popup-panel-header-action-button-font-size: calc(var(--bui-fs-300) * var(--bui-upscale-factor));
    --bui-popup-panel-header-action-button-padding-block: calc(0.375rem * var(--bui-upscale-factor));
    --bui-popup-panel-header-action-button-padding-inline: calc(0.5rem * var(--bui-upscale-factor));
    --bui-popup-panel-header-action-button-font-size: calc(1rem * var(--bui-upscale-factor));

    /* Variables: Messages */
    --chat-i-messenger-message-padding-block: calc(0.5rem * var(--bui-upscale-factor));
    --chat-i-messenger-message-padding-inline: calc(0.875rem * var(--bui-upscale-factor));

    /* Variables: Message Input */
    --chat-i-messenger-input-padding: calc(0.25rem * var(--bui-upscale-factor)) calc(0.375rem * var(--bui-upscale-factor));

    /* Variables: Send Button */
    --chat-i-messenger-send-button-size: calc(2rem * var(--bui-upscale-factor));
    --chat-i-messenger-send-button-icon-size: calc(1.25rem * var(--bui-upscale-factor));

    /* Variables: Close Conversation Dialog */
    --chat-i-messenger-close-dialog-header-title-font-size: calc(1.25rem * var(--bui-upscale-factor));
    --chat-i-messenger-close-dialog-close-button-icon-size: calc(1.125rem * var(--bui-upscale-factor));
    --chat-i-messenger-close-dialog-container-padding: calc(1rem * var(--bui-upscale-factor));
    --chat-i-messenger-close-dialog-message-margin: calc(1rem * var(--bui-upscale-factor)) 0 calc(1.5rem * var(--bui-upscale-factor)) 0;

    /* Variables: Close Dialog Action Buttons */
    --chat-i-messenger-close-dialog-action-button-font-size: calc(1rem * var(--bui-upscale-factor));
    --chat-i-messenger-close-dialog-action-button-padding-block: calc(0.625rem * var(--bui-upscale-factor));
    --chat-i-messenger-close-dialog-action-button-padding-inline: calc(0.75rem * var(--bui-upscale-factor));

    /* Variables: Conversation Completed Message */
    --chat-i-messenger-conversation-completed-message-font-size: calc(0.875rem * var(--bui-upscale-factor));


    /* Popup Panel Header */
    .popup-panel-header-title {
        font-size: var(--bui-popup-panel-header-title-font-size);
        padding-inline: var(--bui-popup-panel-header-padding-inline);
    }

    .popup-panel-header-actions {
        .bui-popup-panel-action-button .bui-button {
            --bui-font-size: var(--bui-popup-panel-header-action-button-font-size);
            --bui-padding-block: var(--bui-popup-panel-header-action-button-padding-block);
            --bui-padding-inline: var(--bui-popup-panel-header-action-button-padding-inline);
            --bui-svg-icon-size: var(--bui-popup-panel-header-action-button-font-size);
        }

        .bui-icon.bui-icon-connection {
            --bui-icon-size: var(--bui-popup-panel-header-action-button-font-size);
        }
    }

    /* Messages */
    .bui-message {
        --bui-message-padding-block: var(--chat-i-messenger-message-padding-block);
        --bui-message-padding-inline: var(--chat-i-messenger-message-padding-inline);

        font-size: calc(1rem * var(--bui-upscale-factor));
    }

    /* Message Input */
    bui-message-input {
        & .bui-message-input {
            padding: var(--chat-i-messenger-input-padding);
        }

        .bui-message-textarea {
            font-size: calc(1rem * var(--bui-upscale-factor));
        }

        .bui-message-input-button .bui-button {
            --bui-svg-icon-size: var(--chat-i-messenger-send-button-icon-size);

            height: var(--chat-i-messenger-send-button-size);
            width: var(--chat-i-messenger-send-button-size);
        }
    }

    /* Footer Links */
    .bulb-footer-links {
        font-size: calc(0.875rem * var(--bui-upscale-factor));
    }

    /* Close Conversation Dialog */
    .bui-messenger-dialog-non-modal .bui-messenger-dialog-container {
        padding: var(--chat-i-messenger-close-dialog-container-padding);
    }

    .bui-messenger-close-conversation-dialog {
        .bui-messenger-dialog-header-title {
            font-size: var(--chat-i-messenger-close-dialog-header-title-font-size);
        }

        .bui-messenger-dialog-close-button {
            --bui-svg-icon-size: var(--chat-i-messenger-close-dialog-close-button-icon-size);
            display: flex;
            align-items: center;
        }

        .bui-messenger-close-conversation-dialog-message {
            margin: var(--chat-i-messenger-close-dialog-message-margin);
            font-size: calc(1rem * var(--bui-upscale-factor))
        }

        .bui-messenger-close-conversation-dialog-actions {
            .bui-message-input-button .bui-button {
                --bui-padding-block: var(--chat-i-messenger-close-dialog-action-button-padding-block);
                --bui-padding-inline: var(--chat-i-messenger-close-dialog-action-button-padding-inline);

                .bui-button-content {
                    font-size: var(--chat-i-messenger-close-dialog-action-button-font-size);
                }
            }

            .bui-button-content {
                gap: 0.5rem;
            }
        }
    }

    /* Display only the completed message text */
    bui-completed-message {
        display: flex;

        .separator, .bui-conversation-completed-message {
            display: none;
        }

        &::after {
            content: var(--bui-conversation-completed-message-text, "Conversation completed on");
            margin-inline: auto;
            padding-block: var(--bui-message-padding-block, .5rem);
            padding-inline: var(--bui-message-padding-inline, 1rem);
            border-radius: var(--bui-message-border-radius, 1rem);
            background-color: var(--chat-i-messenger-message-received-background, var(--bui-surface-100));
            color: var( --chat-i-messenger-message-received-color, var(--bui-neutral-700));
            font-size: var(--chat-i-messenger-conversation-completed-message-font-size);
        }
    }

    /* Typing Message */
    .typing-dots {
        height: calc(2.5 * 0.5rem * var(--bui-upscale-factor));
    }
}
