/**
 * CSS variables for library theming
 */

.g-root {
    /* === Colors === */
    --g-aikit-color-bg-primary: var(--g-aikit-bg-primary, var(--g-color-base-float));
    --g-aikit-color-bg-secondary: #f5f5f5;

    /* === Layout === */
    --g-aikit-layout-base-padding-m: 12px;

    /* === Messages === */
    --g-aikit-color-bg-message-user: #0077ff;
    --g-aikit-color-bg-message-assistant: #f0f0f0;

    /* === Disclaimer === */
    --g-aikit-disclaimer-gap: 10px;

    /* === Suggestions === */
    --g-aikit-suggestions-box-shadow: 0 3px 10px rgba(198, 172, 255, 0.52);

    /* === Header === */
    --g-aikit-header-background: none;

    /* === Context Indicator === */
    --g-aikit-ci-color-progress-1: var(
        --g-aikit-ci-progress-1,
        var(--g-color-private-green-550-solid)
    );
    --g-aikit-ci-color-progress-2: var(
        --g-aikit-ci-progress-2,
        var(--g-color-private-orange-500-solid)
    );
    --g-aikit-ci-color-progress-3: var(
        --g-aikit-ci-progress-3,
        var(--g-color-private-red-500-solid)
    );

    /* === Shimmer === */
    --g-aikit-shimmer-color-from: var(--g-aikit-shimmer-from, rgba(0, 0, 0, 0.35));
    --g-aikit-shimmer-color-to: var(--g-aikit-shimmer-to, rgba(0, 0, 0, 0.85));
    --g-aikit-shimmer-duration: var(--g-aikit-shimmer-time, 2.5s);
    --g-aikit-shimmer-gradient-size: 200%;

    /* === Chat History === */
    --g-aikit-history-width: 360px;
    --g-aikit-history-max-height: 605px;
    --g-aikit-history-item-height: 24px;

    /* === Prompt Input === */
    --g-aikit-prompt-input-panel-max-height: 500px;

    /* === Empty Container === */
    --g-aikit-empty-container-background: var(--g-color-base-background);
    --g-aikit-empty-container-welcome-gap: var(--g-spacing-6);
    --g-aikit-empty-container-content-gap: 48px;
    --g-aikit-empty-container-padding: 48px 32px;
    --g-aikit-empty-container-mobile-welcome-gap: 18px;
    --g-aikit-empty-container-mobile-content-gap: 32px;
    --g-aikit-empty-container-mobile-padding: 80px var(--g-spacing-4) 0;
    --g-aikit-empty-container-content-justify-content: flex-start;
    --g-aikit-empty-container-content-overflow-y: auto;
    --g-aikit-empty-container-suggestions-max-width: none;
    --g-aikit-empty-container-suggestions-flex: 1 1 auto;
    --g-aikit-empty-container-suggestions-align-self: stretch;
    --g-aikit-empty-container-suggestions-list-min-height: 70px;

    /* === Message List === */
    --g-aikit-message-list-footer-content-padding: var(--g-spacing-4) 0 var(--g-spacing-2);

    /* === Chat Content === */
    --g-aikit-chat-content-background: var(--g-color-base-background);
    --g-aikit-chat-content-padding: 0 var(--g-aikit-layout-base-padding-m) var(--g-spacing-4)
        var(--g-aikit-layout-base-padding-m);

    /* === Chat Container === */
    --g-aikit-chat-container-header-background: var(--g-color-base-background);
    --g-aikit-chat-container-content-background: var(--g-color-base-background);
    --g-aikit-chat-container-footer-background: var(--g-color-base-background);
    --g-aikit-chat-container-mobile-font-size: 16px;
    --g-aikit-chat-container-mobile-line-height: 24px;
    --g-aikit-chat-container-mobile-padding: var(--g-spacing-4);
    --g-aikit-chat-container-mobile-empty-container-padding: 80px 0 0;
    --g-aikit-chat-container-mobile-keyboard-empty-container-padding: var(--g-spacing-4) 0 0;
    --g-aikit-chat-container-background: var(--g-color-base-background);
    --g-aikit-chat-container-content-empty-background: var(--g-color-base-background);
    --g-aikit-chat-container-content-chat-background: var(--g-color-base-background);
    --g-aikit-chat-container-footer-empty-background: var(--g-color-base-background);
    --g-aikit-chat-container-footer-chat-background: var(--g-color-base-background);

    /* === Action Popup === */
    --g-aikit-action-popup-min-width: 280px;
    --g-aikit-action-popup-max-width: 400px;

    /* === Markdown Renderer === */
    --g-aikit-markdown-renderer-table-cell-max-width: 240px;
}
