:root {
    /* Colors */
    --chat--color--primary: #0f172a;
    --chat--color--primary-shade-50: #1e293b;
    --chat--color--primary--shade-100: #020617;
    --chat--color--secondary: #2563eb;
    --chat--color-secondary-shade-50: #1d4ed8;
    --chat--color-white: #ffffff;
    --chat--color-light: #f8fafc;
    --chat--color-light-shade-50: #e2e8f0;
    --chat--color-light-shade-100: #cbd5e1;
    --chat--color-medium: #94a3b8;
    --chat--color-dark: #0f172a;
    --chat--color-disabled: #cbd5e1;
    --chat--color-typing: #475569;

    /* Base Layout */
    --chat--spacing: 1rem;
    --chat--border-radius: 0.9rem;
    --chat--transition-duration: 0.2s;
    --chat--font-family:
        Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;

    /* Window Dimensions */
    --chat--window--width: 400px;
    --chat--window--height: 600px;
    --chat--window--bottom: var(--chat--spacing);
    --chat--window--right: var(--chat--spacing);
    --chat--window--z-index: 9999;
    --chat--window--border: 1px solid var(--chat--color-light-shade-50);
    --chat--window--border-radius: 1.25rem;
    --chat--window--margin-bottom: var(--chat--spacing);

    /* Header Styles */
    --chat--header-height: auto;
    --chat--header--padding: 1.25rem;
    --chat--header--background: var(--chat--color-dark);
    --chat--header--color: var(--chat--color-white);
    --chat--header--border-top: none;
    --chat--header--border-bottom: none;
    --chat--header--border-left: none;
    --chat--header--border-right: none;
    --chat--heading--font-size: 1.35em;
    --chat--subtitle--font-size: 0.95rem;
    --chat--subtitle--line-height: 1.6;

    /* Message Styles */
    --chat--message--font-size: 0.95rem;
    --chat--message--padding: 0.9rem 1rem;
    --chat--message--border-radius: 1rem;
    --chat--message-line-height: 1.55;
    --chat--message--margin-bottom: var(--chat--spacing);
    --chat--message--bot--background: var(--chat--color-white);
    --chat--message--bot--color: var(--chat--color-dark);
    --chat--message--bot--border: 1px solid var(--chat--color-light-shade-50);
    --chat--message--user--background: var(--chat--color-dark);
    --chat--message--user--color: var(--chat--color-white);
    --chat--message--user--border: none;
    --chat--message--pre--background: #f1f5f9;
    --chat--messages-list--padding: var(--chat--spacing);

    /* Toggle Button */
    --chat--toggle--size: 60px;
    --chat--toggle--width: var(--chat--toggle--size);
    --chat--toggle--height: var(--chat--toggle--size);
    --chat--toggle--border-radius: 999px;
    --chat--toggle--background: var(--chat--color-dark);
    --chat--toggle--hover--background: var(--chat--color--primary-shade-50);
    --chat--toggle--active--background: var(--chat--color--primary--shade-100);
    --chat--toggle--color: var(--chat--color-white);

    /* Input Area */
    --chat--textarea--height: 73px; /*50px;*/
    --chat--textarea--max-height: 30rem;
    --chat--input--font-size: 0.95rem;
    --chat--input--border: 1px solid var(--chat--color-light-shade-50);
    --chat--input--border-radius: 0.9rem;
    --chat--input--padding: 0.85rem 1rem;
    --chat--input--background: var(--chat--color-white);
    --chat--input--text-color: var(--chat--color-dark);
    --chat--input--line-height: 1.5;
    --chat--input--placeholder--font-size: var(--chat--input--font-size);
    --chat--input--border-active: 1px solid var(--chat--color--secondary);
    --chat--input--left--panel--width: 2rem;

    /* Button Styles */
    --chat--button--padding: 0.7rem 1rem;
    --chat--button--border-radius: 999px;
    --chat--button--font-size: 0.95rem;
    --chat--button--line-height: 1;
    --chat--button--color--primary: var(--chat--color-white);
    --chat--button--background--primary: var(--chat--color-dark);
    --chat--button--border--primary: none;
    --chat--button--color--primary--hover: var(--chat--color-white);
    --chat--button--background--primary--hover: var(--chat--color--primary-shade-50);
    --chat--button--border--primary--hover: none;
    --chat--button--color--primary--disabled: var(--chat--color-white);
    --chat--button--background--primary--disabled: var(--chat--color-medium);
    --chat--button--border--primary--disabled: none;
    --chat--button--color--secondary: var(--chat--color-dark);
    --chat--button--background--secondary: var(--chat--color-white);
    --chat--button--border--secondary: 1px solid var(--chat--color-light-shade-50);
    --chat--button--color--secondary--hover: var(--chat--color-dark);
    --chat--button--background--secondary--hover: var(--chat--color-light);
    --chat--button--border--secondary--hover: 1px solid var(--chat--color-light-shade-100);
    --chat--button--color--secondary--disabled: var(--chat--color-medium);
    --chat--button--background--secondary--disabled: var(--chat--color-light);
    --chat--button--border--secondary--disabled: 1px solid var(--chat--color-light-shade-50);
    --chat--close--button--color-hover: var(--chat--color--secondary);

    /* Send and File Buttons */
    --chat--input--send--button--background: transparent;
    --chat--input--send--button--color: var(--chat--color-dark);
    --chat--input--send--button--background-hover: var(--chat--color-light);
    --chat--input--send--button--color-hover: var(--chat--color--secondary);
    --chat--input--file--button--background: transparent;
    --chat--input--file--button--color: var(--chat--color-medium);
    --chat--input--file--button--background-hover: var(--chat--color-light);
    --chat--input--file--button--color-hover: var(--chat--color--secondary);
    --chat--files-spacing: 0.25rem;

    /* Body and Footer */
    --chat--body--background: var(--chat--color-light);
    --chat--footer--background: var(--chat--color-light);
    --chat--footer--color: var(--chat--color-dark);
}

.chat-window textarea:focus,
.chat-window input:focus,
.chat-window button:focus {
    --tw-ring-color: #fff;
}
