@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@200..1000&display=swap');
/*! Package version @n8n/chat@1.2.1 */
:root {
    --chat--color--primary: #10B981;
    --chat--color--primary-shade-50: #34D399;
    --chat--color--primary--shade-100: #059669;
    --chat--color--secondary: #06B6D4;
    --chat--color-secondary-shade-50: #22D3EE;
    --chat--color-white: #0F172A;
    --chat--color-light: #0B1120;
    --chat--color-light-shade-50: rgba(255, 255, 255, 0.1);
    --chat--color-light-shade-100: rgba(16, 185, 129, 0.25);
    --chat--color-medium: #94A3B8;
    --chat--color-dark: #F8FAFC;
    --chat--color-disabled: rgba(255, 255, 255, 0.3);
    --chat--color-typing: #10B981;
    --chat--spacing: 1rem;
    --chat--border-radius: 16px;
    --chat--transition-duration: .2s;
    --chat--font-family: 'Cairo', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    --chat--window--width: 390px;
    --chat--window--height: 580px;
    --chat--window--bottom: 24px;
    --chat--window--right: 24px;
    --chat--window--z-index: 9999;
    --chat--window--border: 1px solid rgba(16, 185, 129, 0.35);
    --chat--window--border-radius: 20px;
    --chat--window--margin-bottom: 24px;
    --chat--header-height: auto;
    --chat--header--padding: 1.1rem 1.25rem;
    --chat--header--background: #0B1120;
    --chat--header--color: #F8FAFC;
    --chat--header--border-top: none;
    --chat--header--border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    --chat--header--border-left: none;
    --chat--header--border-right: none;
    --chat--heading--font-size: 1.15rem;
    --chat--subtitle--font-size: 0.82rem;
    --chat--subtitle--line-height: 1.5;
    --chat--message--font-size: 0.92rem;
    --chat--message--padding: 0.85rem 1.1rem;
    --chat--message--border-radius: 14px;
    --chat--message-line-height: 1.6;
    --chat--message--margin-bottom: 0.85rem;
    --chat--message--bot--background: rgba(15, 23, 42, 0.95);
    --chat--message--bot--color: #F8FAFC;
    --chat--message--bot--border: 1px solid rgba(255, 255, 255, 0.08);
    --chat--message--user--background: linear-gradient(135deg, #10B981 0%, #059669 100%);
    --chat--message--user--color: #FFFFFF;
    --chat--message--user--border: none;
    --chat--message--pre--background: rgba(0, 0, 0, 0.35);
    --chat--messages-list--padding: 1rem;
    --chat--toggle--size: 58px;
    --chat--toggle--width: var(--chat--toggle--size);
    --chat--toggle--height: var(--chat--toggle--size);
    --chat--toggle--border-radius: 50%;
    --chat--toggle--background: linear-gradient(135deg, #10B981 0%, #059669 100%);
    --chat--toggle--hover--background: linear-gradient(135deg, #34D399 0%, #10B981 100%);
    --chat--toggle--active--background: #059669;
    --chat--toggle--color: #FFFFFF;
    --chat--textarea--height: 48px;
    --chat--textarea--max-height: 20rem;
    --chat--input--font-size: 0.92rem;
    --chat--input--border: 1px solid rgba(255, 255, 255, 0.1);
    --chat--input--border-radius: 12px;
    --chat--input--padding: 0.75rem 1rem;
    --chat--input--background: #060913;
    --chat--input--text-color: #F8FAFC;
    --chat--input--line-height: 1.5;
    --chat--input--placeholder--font-size: 0.88rem;
    --chat--input--border-active: 1px solid #10B981;
    --chat--input--left--panel--width: 2rem;
    --chat--button--color: #FFFFFF;
    --chat--button--background: #10B981;
    --chat--button--padding: 0.5rem 1rem;
    --chat--button--border-radius: 10px;
    --chat--button--hover--color: #FFFFFF;
    --chat--button--hover--background: #34D399;
    --chat--close--button--color-hover: #10B981;
    --chat--input--send--button--background: transparent;
    --chat--input--send--button--color: #10B981;
    --chat--input--send--button--background-hover: transparent;
    --chat--input--send--button--color-hover: #34D399;
    --chat--input--file--button--background: transparent;
    --chat--input--file--button--color: #10B981;
    --chat--input--file--button--background-hover: transparent;
    --chat--input--file--button--color-hover: #34D399;
    --chat--files-spacing: .25rem;
    --chat--body--background: #060913;
    --chat--footer--background: #0B1120;
    --chat--footer--color: #F8FAFC;
}
pre code.hljs {
    padding:1em;
    display:block;
    overflow-x:auto
}
code.hljs {
    padding:3px 5px
}
.hljs {
    color:#24292e;
    background:#fff
}
.hljs-doctag,.hljs-keyword,.hljs-meta .hljs-keyword,.hljs-template-tag,.hljs-template-variable,.hljs-type,.hljs-variable.language_ {
    color:#d73a49
}
.hljs-title,.hljs-title.class_,.hljs-title.class_.inherited__,.hljs-title.function_ {
    color:#6f42c1
}
.hljs-attr,.hljs-attribute,.hljs-literal,.hljs-meta,.hljs-number,.hljs-operator,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-id,.hljs-variable {
    color:#005cc5
}
.hljs-meta .hljs-string,.hljs-regexp,.hljs-string {
    color:#032f62
}
.hljs-built_in,.hljs-symbol {
    color:#e36209
}
.hljs-code,.hljs-comment,.hljs-formula {
    color:#6a737d
}
.hljs-name,.hljs-quote,.hljs-selector-pseudo,.hljs-selector-tag {
    color:#22863a
}
.hljs-subst {
    color:#24292e
}
.hljs-section {
    color:#005cc5;
    font-weight:700
}
.hljs-bullet {
    color:#735c0f
}
.hljs-emphasis {
    color:#24292e;
    font-style:italic
}
.hljs-strong {
    color:#24292e;
    font-weight:700
}
.hljs-addition {
    color:#22863a;
    background-color:#f0fff4
}
.hljs-deletion {
    color:#b31d28;
    background-color:#ffeef0
}
body[data-theme=dark] pre code.hljs {
    padding:1em;
    display:block;
    overflow-x:auto
}
body[data-theme=dark] code.hljs {
    padding:3px 5px
}
body[data-theme=dark] .hljs {
    color:#adbac7;
    background:#22272e
}
body[data-theme=dark] .hljs-doctag,body[data-theme=dark] .hljs-keyword,body[data-theme=dark] .hljs-meta .hljs-keyword,body[data-theme=dark] .hljs-template-tag,body[data-theme=dark] .hljs-template-variable,body[data-theme=dark] .hljs-type,body[data-theme=dark] .hljs-variable.language_ {
    color:#f47067
}
body[data-theme=dark] .hljs-title,body[data-theme=dark] .hljs-title.class_,body[data-theme=dark] .hljs-title.class_.inherited__,body[data-theme=dark] .hljs-title.function_ {
    color:#dcbdfb
}
body[data-theme=dark] .hljs-attr,body[data-theme=dark] .hljs-attribute,body[data-theme=dark] .hljs-literal,body[data-theme=dark] .hljs-meta,body[data-theme=dark] .hljs-number,body[data-theme=dark] .hljs-operator,body[data-theme=dark] .hljs-selector-attr,body[data-theme=dark] .hljs-selector-class,body[data-theme=dark] .hljs-selector-id,body[data-theme=dark] .hljs-variable {
    color:#6cb6ff
}
body[data-theme=dark] .hljs-meta .hljs-string,body[data-theme=dark] .hljs-regexp,body[data-theme=dark] .hljs-string {
    color:#96d0ff
}
body[data-theme=dark] .hljs-built_in,body[data-theme=dark] .hljs-symbol {
    color:#f69d50
}
body[data-theme=dark] .hljs-code,body[data-theme=dark] .hljs-comment,body[data-theme=dark] .hljs-formula {
    color:#768390
}
body[data-theme=dark] .hljs-name,body[data-theme=dark] .hljs-quote,body[data-theme=dark] .hljs-selector-pseudo,body[data-theme=dark] .hljs-selector-tag {
    color:#8ddb8c
}
body[data-theme=dark] .hljs-subst {
    color:#adbac7
}
body[data-theme=dark] .hljs-section {
    color:#316dca;
    font-weight:700
}
body[data-theme=dark] .hljs-bullet {
    color:#eac55f
}
body[data-theme=dark] .hljs-emphasis {
    color:#adbac7;
    font-style:italic
}
body[data-theme=dark] .hljs-strong {
    color:#adbac7;
    font-weight:700
}
body[data-theme=dark] .hljs-addition {
    color:#b4f1b4;
    background-color:#1b4721
}
body[data-theme=dark] .hljs-deletion {
    color:#ffd8d3;
    background-color:#78191b
}
@media (prefers-color-scheme:dark) {
    body:not([data-theme]) pre code.hljs {
        padding:1em;
        display:block;
        overflow-x:auto
}
    body:not([data-theme]) code.hljs {
        padding:3px 5px
}
    body:not([data-theme]) .hljs {
        color:#adbac7;
        background:#22272e
}
    body:not([data-theme]) .hljs-doctag,body:not([data-theme]) .hljs-keyword,body:not([data-theme]) .hljs-meta .hljs-keyword,body:not([data-theme]) .hljs-template-tag,body:not([data-theme]) .hljs-template-variable,body:not([data-theme]) .hljs-type,body:not([data-theme]) .hljs-variable.language_ {
        color:#f47067
}
    body:not([data-theme]) .hljs-title,body:not([data-theme]) .hljs-title.class_,body:not([data-theme]) .hljs-title.class_.inherited__,body:not([data-theme]) .hljs-title.function_ {
        color:#dcbdfb
}
    body:not([data-theme]) .hljs-attr,body:not([data-theme]) .hljs-attribute,body:not([data-theme]) .hljs-literal,body:not([data-theme]) .hljs-meta,body:not([data-theme]) .hljs-number,body:not([data-theme]) .hljs-operator,body:not([data-theme]) .hljs-selector-attr,body:not([data-theme]) .hljs-selector-class,body:not([data-theme]) .hljs-selector-id,body:not([data-theme]) .hljs-variable {
        color:#6cb6ff
}
    body:not([data-theme]) .hljs-meta .hljs-string,body:not([data-theme]) .hljs-regexp,body:not([data-theme]) .hljs-string {
        color:#96d0ff
}
    body:not([data-theme]) .hljs-built_in,body:not([data-theme]) .hljs-symbol {
        color:#f69d50
}
    body:not([data-theme]) .hljs-code,body:not([data-theme]) .hljs-comment,body:not([data-theme]) .hljs-formula {
        color:#768390
}
    body:not([data-theme]) .hljs-name,body:not([data-theme]) .hljs-quote,body:not([data-theme]) .hljs-selector-pseudo,body:not([data-theme]) .hljs-selector-tag {
        color:#8ddb8c
}
    body:not([data-theme]) .hljs-subst {
        color:#adbac7
}
    body:not([data-theme]) .hljs-section {
        color:#316dca;
        font-weight:700
}
    body:not([data-theme]) .hljs-bullet {
        color:#eac55f
}
    body:not([data-theme]) .hljs-emphasis {
        color:#adbac7;
        font-style:italic
}
    body:not([data-theme]) .hljs-strong {
        color:#adbac7;
        font-weight:700
}
    body:not([data-theme]) .hljs-addition {
        color:#b4f1b4;
        background-color:#1b4721
}
    body:not([data-theme]) .hljs-deletion {
        color:#ffd8d3;
        background-color:#78191b
}
}

.chat-message-markdown {
    -webkit-text-size-adjust:100%;
    word-break:break-word;
    line-height:1.4
}
.chat-message-markdown *,.chat-message-markdown :before,.chat-message-markdown :after {
    box-sizing:border-box
}
.chat-message-markdown :before,.chat-message-markdown :after {
    -webkit-text-decoration:inherit;
    text-decoration:inherit;
    vertical-align:inherit
}
.chat-message-markdown body,.chat-message-markdown dl dl,.chat-message-markdown dl ol,.chat-message-markdown dl ul,.chat-message-markdown ol dl,.chat-message-markdown ul dl,.chat-message-markdown ol ol,.chat-message-markdown ol ul,.chat-message-markdown ul ol,.chat-message-markdown ul ul,.chat-message-markdown button,.chat-message-markdown input,.chat-message-markdown select,.chat-message-markdown textarea {
    margin:0
}
.chat-message-markdown hr {
    height:0;
    overflow:visible
}
.chat-message-markdown main,.chat-message-markdown details {
    display:block
}
.chat-message-markdown summary {
    display:list-item
}
.chat-message-markdown nav ol,.chat-message-markdown nav ul {
    padding:0;
    list-style:none
}
.chat-message-markdown pre,.chat-message-markdown code,.chat-message-markdown kbd,.chat-message-markdown samp {
    font-family:var(--font-family--monospace),"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
    font-size:1em
}
.chat-message-markdown abbr[title] {
    cursor:help;
    text-decoration:underline;
    -webkit-text-decoration:underline dotted;
    text-decoration:underline dotted
}
.chat-message-markdown b,.chat-message-markdown strong {
    font-weight:var(--font-weight--bold)
}
.chat-message-markdown small {
    opacity:.8;
    font-size:80%
}
.chat-message-markdown audio,.chat-message-markdown canvas,.chat-message-markdown iframe,.chat-message-markdown img,.chat-message-markdown svg,.chat-message-markdown video {
    vertical-align:middle
}
.chat-message-markdown iframe {
    border-style:none
}
.chat-message-markdown svg:not([fill]) {
    fill:currentColor
}
.chat-message-markdown svg:not(:root) {
    overflow:hidden
}
.chat-message-markdown button,.chat-message-markdown input {
    overflow:visible
}
.chat-message-markdown button,.chat-message-markdown select {
    text-transform:none
}
.chat-message-markdown button,.chat-message-markdown [type=button],.chat-message-markdown [type=reset],.chat-message-markdown [type=submit] {
    -webkit-appearance:button
}
.chat-message-markdown fieldset {
    border:1px solid #666;
    padding:.35em .75em .625em
}
.chat-message-markdown legend {
    color:inherit;
    white-space:normal;
    max-width:100%;
    display:table
}
.chat-message-markdown progress {
    vertical-align:baseline;
    display:inline-block
}
.chat-message-markdown textarea {
    resize:vertical;
    overflow:auto
}
.chat-message-markdown [type=search] {
    outline-offset:-2px;
    -webkit-appearance:textfield
}
.chat-message-markdown ::-webkit-inner-spin-button {
    height:auto
}
.chat-message-markdown ::-webkit-outer-spin-button {
    height:auto
}
.chat-message-markdown ::-webkit-input-placeholder {
    color:inherit;
    opacity:.54
}
.chat-message-markdown ::-webkit-search-decoration {
    -webkit-appearance:none
}
.chat-message-markdown ::-webkit-file-upload-button {
    font:inherit;
    -webkit-appearance:button
}
.chat-message-markdown ::-moz-focus-inner {
    border-style:none;
    padding:0
}
.chat-message-markdown :-moz-focusring {
    outline:1px dotted buttontext
}
.chat-message-markdown :-moz-ui-invalid {
    box-shadow:none
}
.chat-message-markdown [aria-busy=true] {
    cursor:progress
}
.chat-message-markdown [aria-controls] {
    cursor:pointer
}
.chat-message-markdown [aria-disabled=true],.chat-message-markdown [disabled] {
    cursor:not-allowed
}
.chat-message-markdown [aria-hidden=false][hidden] {
    display:inline;
    display:initial
}
.chat-message-markdown [aria-hidden=false][hidden]:not(:focus) {
    clip:rect(0,0,0,0);
    position:absolute
}
@media print {
    .chat-message-markdown a[href^=http]:after {
        content:" (" attr(href)")"
}
}
.chat-message-markdown :root {
    --background-main:#fefefe;
    --background-element:#eee;
    --background-inverted:#282a36;
    --text-main:#1f1f1f;
    --text-alt:#333;
    --text-inverted:#fefefe;
    --border-element:#282a36;
    --theme:#7a283a;
    --theme-light:#bc8f8f;
    --theme-dark:#8f5656
}
.chat-message-markdown body {
    background:var(--background-main);
    max-width:36rem;
    min-height:100%;
    color:var(--text-main);
    margin:auto;
    overflow-x:hidden
}
.chat-message-markdown h1,.chat-message-markdown h2,.chat-message-markdown h3,.chat-message-markdown h4,.chat-message-markdown h5,.chat-message-markdown h6 {
    margin:2rem 0 .8em
}
.chat-message-markdown h1 {
    font-size:2.441rem;
    line-height:1.1
}
.chat-message-markdown h2 {
    font-size:1.953rem;
    line-height:1.15
}
.chat-message-markdown h3 {
    font-size:1.563rem;
    line-height:1.2
}
.chat-message-markdown h4 {
    font-size:1.25rem;
    line-height:1.3
}
.chat-message-markdown h5,.chat-message-markdown h6 {
    font-size:1rem;
    line-height:1.4
}
.chat-message-markdown p,.chat-message-markdown ul,.chat-message-markdown ol,.chat-message-markdown figure {
    margin:.6rem 0 1.2rem
}
.chat-message-markdown h1 span,.chat-message-markdown h2 span,.chat-message-markdown h3 span,.chat-message-markdown h4 span,.chat-message-markdown h5 span,.chat-message-markdown h6 span {
    font-size:1em;
    font-style:italic;
    font-weight:var(--font-weight--regular);
    margin-top:.3em;
    line-height:1.3;
    display:block
}
.chat-message-markdown h1 span {
    font-size:.6em
}
.chat-message-markdown h2 span {
    font-size:.7em
}
.chat-message-markdown h3 span {
    font-size:.8em
}
.chat-message-markdown h4 span {
    font-size:.9em
}
.chat-message-markdown mark {
    background:pink;
    padding:.1em .15em
}
.chat-message-markdown pre {
    tab-size:4
}
.chat-message-markdown ins {
    font-weight:var(--font-weight--bold);
    text-decoration:none
}
.chat-message-markdown blockquote {
    border-left:.3rem solid #7a283a;
    border-left:.3rem solid var(--theme);
    margin:.6rem 0 1.2rem;
    padding-left:2rem
}
.chat-message-markdown blockquote p {
    font-size:1.2em;
    font-style:italic
}
.chat-message-markdown figure {
    margin:0
}
.chat-message-markdown a {
    color:var(--theme);
    text-decoration:underline
}
.chat-message-markdown a:hover {
    color:var(--theme-light)
}
.chat-message-markdown a:active {
    color:var(--theme-dark)
}
.chat-message-markdown :focus {
    outline:3px solid #bc8f8f;
    outline:3px solid var(--theme-light);
    outline-offset:3px
}
.chat-message-markdown input {
    background:#eee;
    background:var(--background-element);
    border:2px solid #282a36;
    border:2px solid var(--border-element);
    border-radius:.5rem;
    padding:.5rem .65rem;
    font-size:1rem
}
.chat-message-markdown kbd,.chat-message-markdown code {
    -webkit-box-decoration-break:clone;
    box-decoration-break:clone;
    border-radius:.2rem;
    padding:.1em .25em
}
.chat-message-markdown kbd>kbd {
    padding-left:0;
    padding-right:0
}
.chat-message-markdown pre code {
    word-break:normal;
    padding:0 0 .5rem .5rem;
    display:block;
    overflow-x:auto
}
.chat-message-markdown [tabindex="-1"]:focus {
    outline:none
}
.chat-message-markdown [hidden] {
    display:none
}
.chat-message-markdown [aria-disabled],.chat-message-markdown [disabled] {
    cursor:not-allowed!important;
    pointer-events:none!important
}
.chat-message-markdown a[href^=\#]:after {
    content:""
}
.chat-message-markdown body>a:first-child {
    background:#7a283a;
    background:var(--theme);
    color:var(--text-inverted);
    border-radius:.2rem;
    padding:.3em .5em;
    position:absolute;
    top:-10rem
}
.chat-message-markdown body>a:first-child:focus {
    top:1rem
}
.chat-message-markdown ul,.chat-message-markdown ol {
    margin-bottom:1rem;
    padding-left:1.5rem
}
.chat-message-markdown ul li,.chat-message-markdown ol li {
    margin-bottom:.5rem
}
.n8n-chat pre code.hljs {
    padding:1em;
    display:block;
    overflow-x:auto
}
.n8n-chat code.hljs {
    padding:3px 5px
}
.n8n-chat .hljs {
    color:#24292e;
    background:#fff
}
.n8n-chat .hljs-doctag,.n8n-chat .hljs-keyword,.n8n-chat .hljs-meta .hljs-keyword,.n8n-chat .hljs-template-tag,.n8n-chat .hljs-template-variable,.n8n-chat .hljs-type,.n8n-chat .hljs-variable.language_ {
    color:#d73a49
}
.n8n-chat .hljs-title,.n8n-chat .hljs-title.class_,.n8n-chat .hljs-title.class_.inherited__,.n8n-chat .hljs-title.function_ {
    color:#6f42c1
}
.n8n-chat .hljs-attr,.n8n-chat .hljs-attribute,.n8n-chat .hljs-literal,.n8n-chat .hljs-meta,.n8n-chat .hljs-number,.n8n-chat .hljs-operator,.n8n-chat .hljs-selector-attr,.n8n-chat .hljs-selector-class,.n8n-chat .hljs-selector-id,.n8n-chat .hljs-variable {
    color:#005cc5
}
.n8n-chat .hljs-meta .hljs-string,.n8n-chat .hljs-regexp,.n8n-chat .hljs-string {
    color:#032f62
}
.n8n-chat .hljs-built_in,.n8n-chat .hljs-symbol {
    color:#e36209
}
.n8n-chat .hljs-code,.n8n-chat .hljs-comment,.n8n-chat .hljs-formula {
    color:#6a737d
}
.n8n-chat .hljs-name,.n8n-chat .hljs-quote,.n8n-chat .hljs-selector-pseudo,.n8n-chat .hljs-selector-tag {
    color:#22863a
}
.n8n-chat .hljs-subst {
    color:#24292e
}
.n8n-chat .hljs-section {
    color:#005cc5;
    font-weight:700
}
.n8n-chat .hljs-bullet {
    color:#735c0f
}
.n8n-chat .hljs-emphasis {
    color:#24292e;
    font-style:italic
}
.n8n-chat .hljs-strong {
    color:#24292e;
    font-weight:700
}
.n8n-chat .hljs-addition {
    color:#22863a;
    background-color:#f0fff4
}
.n8n-chat .hljs-deletion {
    color:#b31d28;
    background-color:#ffeef0
}
.chat-button {
    text-align:center;
    vertical-align:middle;
    -webkit-user-select:none;
    user-select:none;
    color:var(--chat--button--color);
    background-color:var(--chat--button--background);
    padding:var(--chat--button--padding);
    border-radius:var(--chat--button--border-radius);
    transition:color var(--chat--transition-duration)ease-in-out,background-color var(--chat--transition-duration)ease-in-out,border-color var(--chat--transition-duration)ease-in-out,box-shadow var(--chat--transition-duration)ease-in-out;
    cursor:pointer;
    border:1px solid #0000;
    font-size:1rem;
    line-height:1.5;
    display:inline-flex
}
.chat-button:hover {
    color:var(--chat--button--hover--color);
    background-color:var(--chat--button--hover--background);
    text-decoration:none
}
.chat-button:focus {
    outline:0;
    box-shadow:0 0 0 .2rem #007bff40
}
.chat-button:disabled {
    opacity:.65
}
.chat-get-started {
    padding-top:var(--chat--spacing);
    padding-bottom:var(--chat--spacing);
    justify-content:center;
    align-items:center;
    height:100%;
    display:flex
}
.chat-powered-by {
    text-align:center
}
.chat-powered-by a {
    color:var(--chat--color--primary);
    text-decoration:none
}
.chat-get-started-footer {
    padding:var(--chat--spacing)
}
.chat-file[data-v-562a0e08] {
    width:fit-content;
    max-width:15rem;
    color:var(--chat--color-dark);
    border:1px solid var(--chat--color-dark);
    background:#fff;
    border-radius:.25rem;
    flex-wrap:nowrap;
    align-items:center;
    gap:.25rem;
    padding:.5rem;
    font-size:.75rem;
    display:flex
}
.chat-file[data-v-562a0e08]:has(.chat-file-preview) {
    cursor:pointer
}
.chat-icon[data-v-562a0e08] {
    flex-shrink:0
}
.chat-file-name-tooltip[data-v-562a0e08] {
    overflow:hidden
}
.chat-file-name[data-v-562a0e08] {
    text-overflow:ellipsis;
    white-space:nowrap;
    max-width:100%;
    margin:0;
    overflow:hidden
}
.chat-file-delete[data-v-562a0e08],.chat-file-preview[data-v-562a0e08] {
    cursor:pointer;
    background:0 0;
    border:none;
    flex-shrink:0;
    display:block
}
.chat-file-delete[data-v-562a0e08] {
    position:relative
}
.chat-file-delete[data-v-562a0e08]:hover {
    color:red
}
.chat-file-delete[data-v-562a0e08]:before {
    content:"";
    position:absolute;
    inset:-10px
}
.chat-input[data-v-66014261] {
    flex-direction:column;
    justify-content:center;
    align-items:center;
    width:100%;
    display:flex;
    position:relative
}
.chat-input[data-v-66014261] * {
    box-sizing:border-box
}
.chat-inputs[data-v-66014261] {
    justify-content:center;
    align-items:flex-end;
    width:100%;
    display:flex


}
.chat-inputs textarea[data-v-66014261]::-webkit-scrollbar {
  display: none;                /* Chrome, Safari */
}
.chat-inputs textarea[data-v-66014261] {
    font-family:inherit;
    font-size:var(--chat--input--font-size);
    border:var(--chat--input--border,0);
    border-radius:var(--chat--input--border-radius);
    width:100%;
    padding:var(--chat--input--padding);
    min-height:var(--chat--textarea--height,2.5rem);
    max-height:var(--chat--textarea--max-height);
    height:var(--chat--textarea--height,2.5rem);
    resize:none;
    background:var(--chat--input--background,white);
    color:var(--chat--input--text-color,initial);
    line-height:var(--chat--input--line-height,1.5);
    outline:none;
    overflow-y:auto;
	scrollbar-width: none; 
	-ms-overflow-style: none; 
}
.chat-inputs textarea[data-v-66014261]::placeholder {
    font-size:var(--chat--input--placeholder--font-size,var(--chat--input--font-size))
}
.chat-inputs textarea[data-v-66014261]:focus,.chat-inputs textarea[data-v-66014261]:hover {
    border-color:var(--chat--input--border-active,0)
}
.chat-inputs-controls[data-v-66014261] {
    display:flex
}
.chat-input-send-button[data-v-66014261],.chat-input-file-button[data-v-66014261] {
    height:var(--chat--textarea--height);
    width:var(--chat--textarea--height);
    background:var(--chat--input--send--button--background,white);
    cursor:pointer;
    color:var(--chat--input--send--button--color,var(--chat--color--secondary));
    transition:color var(--chat--transition-duration)ease;
    border:0;
    justify-content:center;
    align-items:center;
    font-size:24px;
    display:inline-flex
}
.chat-input-send-button svg[data-v-66014261],.chat-input-file-button svg[data-v-66014261] {
    min-width:fit-content
}
.chat-input-send-button[disabled][data-v-66014261],.chat-input-file-button[disabled][data-v-66014261] {
    cursor:no-drop;
    color:var(--chat--color-disabled)
}
.chat-input-send-button .chat-input-send-button[data-v-66014261]:hover,.chat-input-send-button .chat-input-send-button[data-v-66014261]:focus,.chat-input-file-button .chat-input-send-button[data-v-66014261]:hover,.chat-input-file-button .chat-input-send-button[data-v-66014261]:focus {
    background:var(--chat--input--send--button--background-hover,var(--chat--input--send--button--background));
    color:var(--chat--input--send--button--color-hover)
}
.chat-input-file-button[data-v-66014261] {
    background:var(--chat--input--file--button--background,white);
    color:var(--chat--input--file--button--color)
}
.chat-input-file-button[data-v-66014261]:hover {
    background:var(--chat--input--file--button--background-hover);
    color:var(--chat--input--file--button--color-hover)
}
.chat-files[data-v-66014261] {
    width:100%;
    padding:var(--chat--files-spacing);
    flex-flow:wrap;
    gap:.5rem;
    display:flex;
    overflow:hidden auto
}
.chat-input-left-panel[data-v-66014261] {
    width:var(--chat--input--left--panel--width);
    margin-left:.4rem
}
.chat-layout {
    width:100%;
    height:100%;
    font-family:var(--chat--font-family);
    flex-direction:column;
    display:flex;
    overflow-y:auto
}
.chat-layout .chat-header {
    height:var(--chat--header-height);
    padding:var(--chat--header--padding);
    background:var(--chat--header--background);
    color:var(--chat--header--color);
    border-top:var(--chat--header--border-top);
    border-bottom:var(--chat--header--border-bottom);
    border-left:var(--chat--header--border-left);
    border-right:var(--chat--header--border-right);
    flex-direction:column;
    justify-content:center;
    gap:1em;
    display:flex
}
.chat-layout .chat-header h1 {
    font-size:var(--chat--heading--font-size);
    color:var(--chat--header--color)
}
.chat-layout .chat-header p {
    font-size:var(--chat--subtitle--font-size);
    line-height:var(--chat--subtitle--line-height)
}
.chat-layout .chat-body {
    background:var(--chat--body--background);
    flex-direction:column;
    flex:1;
    min-height:100px;
    display:flex;
    position:relative;
    overflow-y:auto;
    scrollbar-color:var(--chat--color--primary)var(--chat--color-light);
    scrollbar-width:thin
}
.chat-layout .chat-body::-webkit-scrollbar {
    width:10px;
    height:10px
}
.chat-layout .chat-body::-webkit-scrollbar-track {
    background:var(--chat--color-light);
    border-radius:var(--chat--border-radius)
}
.chat-layout .chat-body::-webkit-scrollbar-thumb {
    background-color:var(--chat--color--primary);
    border-radius:var(--chat--border-radius);
    border:2px solid var(--chat--color-light)
}
.chat-layout .chat-body::-webkit-scrollbar-thumb:hover {
    background-color:var(--chat--color--primary-shade-50)
}
.chat-layout .chat-footer {
    border-top:1px solid var(--chat--color-light-shade-100);
    background:var(--chat--footer--background);
    color:var(--chat--footer--color)
}
._strokeWidth_amcx4_1 rect,._strokeWidth_amcx4_1 path {
    stroke-width:var(--icon--stroke-width)
}
._spin_amcx4_6 {
    animation:1s linear infinite _spin_amcx4_6
}
@keyframes _spin_amcx4_6 {
    0% {
        transform:rotate(0)
}
    to {
        transform:rotate(360deg)
}
}
.lds-ring {
    width:48px;
    height:48px;
    display:inline-block;
    position:relative
}
.lds-ring div {
    box-sizing:border-box;
    border:4px solid var(--color--foreground--tint-2);
    border-color:var(--color--primary)transparent transparent transparent;
    border-radius:50%;
    width:48px;
    height:48px;
    animation:1.2s cubic-bezier(.5,0,.5,1) infinite lds-ring;
    display:block;
    position:absolute
}
.lds-ring div:first-child {
    animation-delay:-.45s
}
.lds-ring div:nth-child(2) {
    animation-delay:-.3s
}
.lds-ring div:nth-child(3) {
    animation-delay:-.15s
}
@keyframes lds-ring {
    0% {
        transform:rotate(0)
}
    to {
        transform:rotate(360deg)
}
}
.el-button {
    white-space:nowrap;
    cursor:pointer;
    -webkit-appearance:none;
    text-align:center;
    box-sizing:border-box;
    gap:var(--spacing--3xs);
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    --button--padding--vertical:var(--spacing--2xs);
    --button--padding--horizontal:var(--spacing--xs);
    --button--font-size:var(--font-size--2xs);
    outline:none;
    margin:0;
    line-height:1;
    transition:all .3s,padding,width,height;
    display:inline-block;
    border:var(--border-width)var(--button--border-color,var(--button--border-color--primary))var(--border-style)!important;
    color:var(--button--color--text,var(--button--color--text--primary))!important;
    background-color:var(--button--color--background,var(--button--color--background--primary))!important;
    font-weight:var(--font-weight--medium)!important;
    border-radius:var(--button--radius,4px)!important;
    padding:var(--button--padding--vertical,var(--spacing--xs))var(--button--padding--horizontal,var(--spacing--md))!important;
    font-size:var(--button--font-size,var(--font-size--sm))!important
}
.el-button a {
    color:var(--button--color--text,var(--button--color--text--primary))!important
}
.el-button:hover {
    color:var(--button--color--text--hover,var(--button--color--text--primary))!important;
    border-color:var(--button--border-color--hover,var(--button--border-color--primary--hover-active))!important;
    background-color:var(--button--color--background--hover,var(--button--color--background--primary--hover-active-focus))!important
}
.el-button:hover a {
    color:var(--button--color--text--hover,var(--button--color--text--primary))!important
}
.el-button:active,.el-button.active {
    outline:none;
    color:var(--button--color--text--active,var(--button--color--text--primary))!important;
    border-color:var(--button--border-color--active,var(--button--border-color--primary--hover-active))!important;
    background-color:var(--button--color--background--active,var(--button--color--background--primary--hover-active-focus))!important
}
.el-button:active a,.el-button.active a {
    color:var(--button--color--text--active,var(--button--color--text--primary))!important
}
.el-button:focus-visible:not(:active,.active) {
    color:var(--button--color--text--focus,var(--button--color--text--primary))!important;
    border-color:var(--button--border-color--focus,var(--button--border-color--primary))!important;
    background-color:var(--button--color--background--focus,var(--button--color--background--primary--hover-active-focus))!important;
    outline:3px solid var(--button--outline-color--focus,var(--button--outline-color--primary--focus))!important
}
.el-button:focus-visible:not(:active,.active) a {
    color:var(--button--color--text--focus,var(--button--color--text--primary))!important
}
.el-button.disabled,.el-button.disabled:hover,.el-button.disabled:active,.el-button.disabled:focus-visible {
    color:var(--button--color--text--disabled,var(--button--color--text--primary--disabled));
    border-color:var(--button--border-color--disabled,var(--button--border-color--primary--disabled));
    background-color:var(--button--color--background--disabled,var(--button--color--background--primary--disabled))
}
.el-button.disabled a,.el-button.disabled:hover a,.el-button.disabled:active a,.el-button.disabled:focus-visible a {
    color:var(--button--color--text--disabled,var(--button--color--text--primary--disabled))
}
.el-button .loading,.el-button .loading:hover,.el-button .loading:active,.el-button .loading:focus-visible {
    color:var(--button--color--text--loading,var(--button--color--text--primary));
    border-color:var(--button--border-color--loading,var(--button--border-color--primary));
    background-color:var(--button--color--background--loading,var(--button--color--background--primary))
}
.el-button .loading a,.el-button .loading:hover a,.el-button .loading:active a,.el-button .loading:focus-visible a {
    color:var(--button--color--text--loading,var(--button--color--text--primary))
}
.el-button::-moz-focus-inner {
    border:0
}
.el-button>i {
    display:none
}
.el-button>span {
    justify-content:center;
    align-items:center;
    display:flex
}
.el-button+.el-button {
    margin-left:var(--spacing--2xs)
}
.el-button.btn--cancel,.el-button.el-color-dropdown__link-btn {
    --button--color--text:var(--button--color--text--secondary);
    --button--border-color:var(--button--border-color--secondary);
    --button--color--background:var(--button--color--background--secondary);
    --button--color--text--hover:var(--button--color--text--secondary--hover-active-focus);
    --button--border-color--hover:var(--button--border-color--secondary--hover-active-focus);
    --button--color--background--hover:var(--button--color--background--secondary--hover);
    --button--color--text--active:var(--button--color--text--secondary--hover-active-focus);
    --button--border-color--active:var(--button--border-color--secondary--hover-active-focus);
    --button--color--background--active:var(--button--color--background--secondary--active-focus);
    --button--color--text--focus:var(--button--color--text--secondary--hover-active-focus);
    --button--border-color--focus:var(--button--border-color--secondary--hover-active-focus);
    --button--color--background--focus:var(--button--color--background--secondary--active-focus);
    --button--outline-color--focus:var(--button--outline-color--secondary--focus);
    --button--color--text--disabled:var(--button--color--text--secondary--disabled);
    --button--border-color--disabled:var(--button--border-color--secondary--disabled);
    --button--color--background--disabled:var(--button--color--background--secondary);
    --button--color--text--loading:var(--button--color--text--secondary--loading);
    --button--border-color--loading:var(--button--border-color--secondary--loading);
    --button--color--background--loading:var(--button--color--background--secondary--loading)
}
._button_4ilxt_115 {
    white-space:nowrap;
    cursor:pointer;
    border:var(--border-width)var(--button--border-color,var(--button--border-color--primary))var(--border-style);
    color:var(--button--color--text,var(--button--color--text--primary));
    background-color:var(--button--color--background,var(--button--color--background--primary));
    line-height:1;
    font-weight:var(--font-weight--medium);
    border-radius:var(--button--radius,4px);
    padding:var(--button--padding--vertical,var(--spacing--xs))var(--button--padding--horizontal,var(--spacing--md));
    font-size:var(--button--font-size,var(--font-size--sm));
    -webkit-appearance:none;
    text-align:center;
    box-sizing:border-box;
    gap:var(--spacing--3xs);
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    outline:none;
    margin:0;
    transition:all .3s,padding,width,height;
    display:inline-block
}
._button_4ilxt_115 a {
    color:var(--button--color--text,var(--button--color--text--primary))
}
._button_4ilxt_115:hover {
    color:var(--button--color--text--hover,var(--button--color--text--primary));
    border-color:var(--button--border-color--hover,var(--button--border-color--primary--hover-active));
    background-color:var(--button--color--background--hover,var(--button--color--background--primary--hover-active-focus))
}
._button_4ilxt_115:hover a {
    color:var(--button--color--text--hover,var(--button--color--text--primary))
}
._button_4ilxt_115:active,._button_4ilxt_115._active_4ilxt_149 {
    color:var(--button--color--text--active,var(--button--color--text--primary));
    border-color:var(--button--border-color--active,var(--button--border-color--primary--hover-active));
    background-color:var(--button--color--background--active,var(--button--color--background--primary--hover-active-focus));
    outline:none
}
._button_4ilxt_115:active a,._button_4ilxt_115._active_4ilxt_149 a {
    color:var(--button--color--text--active,var(--button--color--text--primary))
}
._button_4ilxt_115:focus-visible:not(:active,._active_4ilxt_149) {
    color:var(--button--color--text--focus,var(--button--color--text--primary));
    border-color:var(--button--border-color--focus,var(--button--border-color--primary));
    background-color:var(--button--color--background--focus,var(--button--color--background--primary--hover-active-focus));
    outline:3px solid var(--button--outline-color--focus,var(--button--outline-color--primary--focus))
}
._button_4ilxt_115:focus-visible:not(:active,._active_4ilxt_149) a {
    color:var(--button--color--text--focus,var(--button--color--text--primary))
}
._button_4ilxt_115._disabled_4ilxt_167,._button_4ilxt_115._disabled_4ilxt_167:hover,._button_4ilxt_115._disabled_4ilxt_167:active,._button_4ilxt_115._disabled_4ilxt_167:focus-visible {
    color:var(--button--color--text--disabled,var(--button--color--text--primary--disabled));
    border-color:var(--button--border-color--disabled,var(--button--border-color--primary--disabled));
    background-color:var(--button--color--background--disabled,var(--button--color--background--primary--disabled))
}
._button_4ilxt_115._disabled_4ilxt_167 a,._button_4ilxt_115._disabled_4ilxt_167:hover a,._button_4ilxt_115._disabled_4ilxt_167:active a,._button_4ilxt_115._disabled_4ilxt_167:focus-visible a {
    color:var(--button--color--text--disabled,var(--button--color--text--primary--disabled))
}
._button_4ilxt_115 ._loading_4ilxt_175,._button_4ilxt_115 ._loading_4ilxt_175:hover,._button_4ilxt_115 ._loading_4ilxt_175:active,._button_4ilxt_115 ._loading_4ilxt_175:focus-visible {
    color:var(--button--color--text--loading,var(--button--color--text--primary));
    border-color:var(--button--border-color--loading,var(--button--border-color--primary));
    background-color:var(--button--color--background--loading,var(--button--color--background--primary))
}
._button_4ilxt_115 ._loading_4ilxt_175 a,._button_4ilxt_115 ._loading_4ilxt_175:hover a,._button_4ilxt_115 ._loading_4ilxt_175:active a,._button_4ilxt_115 ._loading_4ilxt_175:focus-visible a {
    color:var(--button--color--text--loading,var(--button--color--text--primary))
}
._button_4ilxt_115::-moz-focus-inner {
    border:0
}
._button_4ilxt_115>i {
    display:none
}
._button_4ilxt_115>span {
    justify-content:center;
    align-items:center;
    display:flex
}
._secondary_4ilxt_198 {
    --button--color--text:var(--button--color--text--secondary);
    --button--border-color:var(--button--border-color--secondary);
    --button--color--background:var(--button--color--background--secondary);
    --button--color--text--hover:var(--button--color--text--secondary--hover-active-focus);
    --button--border-color--hover:var(--button--border-color--secondary--hover-active-focus);
    --button--color--background--hover:var(--button--color--background--secondary--hover);
    --button--color--text--active:var(--button--color--text--secondary--hover-active-focus);
    --button--border-color--active:var(--button--border-color--secondary--hover-active-focus);
    --button--color--background--active:var(--button--color--background--secondary--active-focus);
    --button--color--text--focus:var(--button--color--text--secondary--hover-active-focus);
    --button--border-color--focus:var(--button--border-color--secondary--hover-active-focus);
    --button--color--background--focus:var(--button--color--background--secondary--active-focus);
    --button--outline-color--focus:var(--button--outline-color--secondary--focus);
    --button--color--text--disabled:var(--button--color--text--secondary--disabled);
    --button--border-color--disabled:var(--button--border-color--secondary--disabled);
    --button--color--background--disabled:var(--button--color--background--secondary);
    --button--color--text--loading:var(--button--color--text--secondary--loading);
    --button--border-color--loading:var(--button--border-color--secondary--loading);
    --button--color--background--loading:var(--button--color--background--secondary--loading)
}
._highlight_4ilxt_220 {
    --button--color--text:var(--button--color--text--highlight);
    --button--border-color:var(--button--border-color--highlight);
    --button--color--background:var(--button--color--background--highlight);
    --button--color--text--hover:var(--button--color--text--highlight--hover-active-focus);
    --button--border-color--hover:var(--button--border-color--highlight--hover-active-focus);
    --button--color--background--hover:var(--button--color--background--highlight--hover);
    --button--color--text--active:var(--button--color--text--highlight--hover-active-focus);
    --button--border-color--active:var(--button--border-color--highlight--hover-active-focus);
    --button--color--background--active:var(--button--color--background--highlight--active-focus);
    --button--color--text--focus:var(--button--color--text--highlight--hover-active-focus);
    --button--border-color--focus:var(--button--border-color--highlight--hover-active-focus);
    --button--color--background--focus:var(--button--color--background--highlight--active-focus);
    --button--outline-color--focus:var(--button--outline-color--highlight--focus);
    --button--color--text--disabled:var(--button--color--text--highlight--disabled);
    --button--border-color--disabled:var(--button--border-color--highlight--disabled);
    --button--color--background--disabled:var(--button--color--background--highlight--disabled);
    --button--color--text--loading:var(--button--color--text--highlight--loading);
    --button--border-color--loading:var(--button--border-color--highlight--loading);
    --button--color--background--loading:var(--button--color--background--highlight--loading)
}
._tertiary_4ilxt_242 {
    --button--color--text:var(--button--color--text--secondary);
    --button--border-color:var(--button--border-color--secondary);
    --button--color--background:var(--button--color--background--secondary);
    --button--color--text--hover:var(--button--color--text--secondary--hover-active-focus);
    --button--border-color--hover:var(--button--border-color--secondary--hover-active-focus);
    --button--color--background--hover:var(--button--color--background--secondary--hover);
    --button--color--text--active:var(--button--color--text--secondary--hover-active-focus);
    --button--border-color--active:var(--button--border-color--secondary--hover-active-focus);
    --button--color--background--active:var(--button--color--background--secondary--active-focus);
    --button--color--text--focus:var(--button--color--text--secondary--hover-active-focus);
    --button--border-color--focus:var(--button--border-color--secondary--hover-active-focus);
    --button--color--background--focus:var(--button--color--background--secondary--active-focus);
    --button--outline-color--focus:var(--button--outline-color--secondary--focus);
    --button--color--text--disabled:var(--button--color--text--secondary--disabled);
    --button--border-color--disabled:var(--button--border-color--secondary--disabled);
    --button--color--background--disabled:var(--button--color--background--secondary);
    --button--color--text--loading:var(--button--color--text--secondary--loading);
    --button--border-color--loading:var(--button--border-color--secondary--loading);
    --button--color--background--loading:var(--button--color--background--secondary--loading)
}
._success_4ilxt_264 {
    --button--color--text:var(--button--color--text--success);
    --button--border-color:var(--color--success);
    --button--color--background:var(--color--success);
    --button--color--text--hover:var(--button--color--text--success);
    --button--border-color--hover:var(--color--success--shade-1);
    --button--color--background--hover:var(--color--success--shade-1);
    --button--color--text--active:var(--button--color--text--success);
    --button--border-color--active:var(--color--success--shade-1);
    --button--color--background--active:var(--color--success--shade-1);
    --button--color--text--focus:var(--button--color--text--success);
    --button--border-color--focus:var(--color--success);
    --button--color--background--focus:var(--color--success);
    --button--outline-color--focus:var(--color--success--tint-1);
    --button--color--text--disabled:var(--button--color--text--success--disabled);
    --button--border-color--disabled:var(--color--success--tint-3);
    --button--color--background--disabled:var(--color--success--tint-3);
    --button--color--text--loading:var(--button--color--text--success);
    --button--border-color--loading:var(--color--success);
    --button--color--background--loading:var(--color--success)
}
._warning_4ilxt_286 {
    --button--color--text:var(--button--color--text--warning);
    --button--border-color:var(--color--warning);
    --button--color--background:var(--color--warning);
    --button--color--text--hover:var(--button--color--text--warning);
    --button--border-color--hover:var(--color--warning--shade-1);
    --button--color--background--hover:var(--color--warning--shade-1);
    --button--color--text--active:var(--button--color--text--warning);
    --button--border-color--active:var(--color--warning--shade-1);
    --button--color--background--active:var(--color--warning--shade-1);
    --button--color--text--focus:var(--button--color--text--warning);
    --button--border-color--focus:var(--color--warning);
    --button--color--background--focus:var(--color--warning);
    --button--outline-color--focus:var(--color--warning--tint-1);
    --button--color--text--disabled:var(--button--color--text--warning--disabled);
    --button--border-color--disabled:var(--color--warning--tint-1);
    --button--color--background--disabled:var(--color--warning--tint-1);
    --button--color--text--loading:var(--button--color--text--warning);
    --button--border-color--loading:var(--color--warning);
    --button--color--background--loading:var(--color--warning)
}
._danger_4ilxt_308 {
    --button--color--text:var(--button--color--text--danger);
    --button--border-color:var(--button--border-color--danger);
    --button--color--background:var(--color--danger);
    --button--color--text--hover:var(--button--color--text--danger);
    --button--border-color--hover:var(--color--danger--shade-1);
    --button--color--background--hover:var(--color--danger--shade-1);
    --button--color--text--active:var(--button--color--text--danger);
    --button--border-color--active:var(--color--danger--shade-1);
    --button--color--background--active:var(--color--danger--shade-1);
    --button--color--text--focus:var(--button--color--text--danger);
    --button--border-color--focus:var(--color--danger);
    --button--color--background--focus:var(--color--danger);
    --button--outline-color--focus:var(--button--outline-color--danger--focus);
    --button--color--text--disabled:var(--button--color--text--danger--disabled);
    --button--border-color--disabled:var(--button--border-color--danger--disabled);
    --button--color--background--disabled:var(--button--color--background--danger--disabled);
    --button--color--text--loading:var(--button--color--text--danger);
    --button--border-color--loading:var(--color--danger);
    --button--color--background--loading:var(--color--danger)
}
._xmini_4ilxt_333 {
    --button--padding--vertical:var(--spacing--4xs);
    --button--padding--horizontal:var(--spacing--3xs);
    --button--font-size:var(--font-size--3xs)
}
._xmini_4ilxt_333._square_4ilxt_338 {
    width:22px;
    height:22px
}
._mini_4ilxt_343 {
    --button--padding--vertical:var(--spacing--4xs);
    --button--padding--horizontal:var(--spacing--2xs);
    --button--font-size:var(--font-size--2xs)
}
._mini_4ilxt_343._square_4ilxt_338 {
    width:22px;
    height:22px
}
._small_4ilxt_353 {
    --button--padding--vertical:var(--spacing--3xs);
    --button--padding--horizontal:var(--spacing--xs);
    --button--font-size:var(--font-size--2xs)
}
._small_4ilxt_353._square_4ilxt_338 {
    width:26px;
    height:26px
}
._medium_4ilxt_363 {
    --button--padding--vertical:var(--spacing--2xs);
    --button--padding--horizontal:var(--spacing--xs);
    --button--font-size:var(--font-size--2xs)
}
._medium_4ilxt_363._square_4ilxt_338 {
    width:30px;
    height:30px
}
._large_4ilxt_373._square_4ilxt_338 {
    width:42px;
    height:42px
}
._xlarge_4ilxt_378 {
    --button--padding--vertical:var(--spacing--xs);
    --button--padding--horizontal:var(--spacing--sm);
    --button--font-size:var(--font-size--md)
}
._xlarge_4ilxt_378._square_4ilxt_338 {
    width:46px;
    height:46px
}
._outline_4ilxt_391 {
    --button--color--background:transparent;
    --button--color--background--disabled:transparent
}
._outline_4ilxt_391._primary_4ilxt_395 {
    --button--color--text:var(--color--primary);
    --button--color--text--disabled:var(--color--primary--tint-1);
    --button--border-color--disabled:var(--color--primary--tint-1);
    --button--color--background--disabled:transparent
}
._outline_4ilxt_391._success_4ilxt_264 {
    --button--color--text:var(--color--success);
    --button--border-color:var(--color--success);
    --button--border-color--hover:var(--color--success);
    --button--color--background--hover:var(--color--success);
    --button--color--background--active:var(--color--success);
    --button--color--text--disabled:var(--color--success--tint-1);
    --button--border-color--disabled:var(--color--success--tint-1);
    --button--color--background--disabled:transparent
}
._outline_4ilxt_391._warning_4ilxt_286 {
    --button--color--text:var(--color--warning);
    --button--border-color:var(--color--warning);
    --button--border-color--hover:var(--color--warning);
    --button--color--background--hover:var(--color--warning);
    --button--color--background--active:var(--color--warning);
    --button--color--text--disabled:var(--color--warning--tint-1);
    --button--border-color--disabled:var(--color--warning--tint-1);
    --button--color--background--disabled:transparent
}
._outline_4ilxt_391._danger_4ilxt_308 {
    --button--color--text:var(--color--danger);
    --button--border-color:var(--color--danger);
    --button--border-color--hover:var(--color--danger);
    --button--color--background--hover:var(--color--danger);
    --button--color--background--active:var(--color--danger);
    --button--color--text--disabled:var(--color--danger--tint-3);
    --button--border-color--disabled:var(--color--danger--tint-3);
    --button--color--background--disabled:transparent
}
._text_4ilxt_432 {
    --button--color--text:var(--text-button--color--text--secondary);
    --button--border-color:transparent;
    --button--color--background:transparent;
    --button--border-color--hover:transparent;
    --button--color--background--hover:transparent;
    --button--border-color--active:transparent;
    --button--color--background--active:transparent;
    --button--border-color--focus:transparent;
    --button--color--background--focus:transparent;
    --button--border-color--disabled:transparent;
    --button--color--background--disabled:transparent
}
._text_4ilxt_432:focus {
    outline:0
}
._text_4ilxt_432._primary_4ilxt_395 {
    --button--color--text:var(--color--primary);
    --button--color--text--hover:var(--color--primary--shade-1);
    --button--color--text--active:var(--color--primary--shade-1);
    --button--color--text--focus:var(--color--primary);
    --button--color--text--disabled:var(--color--primary--tint-1)
}
._text_4ilxt_432._success_4ilxt_264 {
    --button--color--text:var(--color--success);
    --button--color--text--hover:var(--color--success--shade-1);
    --button--color--text--active:var(--color--success--shade-1);
    --button--color--text--focus:var(--color--success);
    --button--color--text--disabled:var(--color--success--tint-1)
}
._text_4ilxt_432._warning_4ilxt_286 {
    --button--color--text:var(--color--warning);
    --button--color--text--hover:var(--color--warning--shade-1);
    --button--color--text--active:var(--color--warning--shade-1);
    --button--color--text--focus:var(--color--warning);
    --button--color--text--disabled:var(--color--warning--tint-1)
}
._text_4ilxt_432._danger_4ilxt_308 {
    --button--color--text:var(--color--danger);
    --button--color--text--hover:var(--color--danger--shade-1);
    --button--color--text--active:var(--color--danger--shade-1);
    --button--color--text--focus:var(--color--danger);
    --button--color--text--disabled:var(--color--danger--tint-3)
}
._text_4ilxt_432:hover {
    text-decoration:underline
}
._loading_4ilxt_175 {
    pointer-events:none;
    position:relative
}
._loading_4ilxt_175:before {
    pointer-events:none;
    content:"";
    border-radius:inherit;
    position:absolute;
    inset:-1px
}
._disabled_4ilxt_167,._disabled_4ilxt_167:hover,._disabled_4ilxt_167:active,._disabled_4ilxt_167:focus {
    cursor:not-allowed;
    background-image:none
}
._transparent_4ilxt_500 {
    --button--color--background:transparent;
    --button--color--background--active:transparent
}
._withIcon_4ilxt_505,._icon_4ilxt_511 {
    justify-content:center;
    align-items:center;
    display:inline-flex
}
._icon_4ilxt_511 svg {
    display:block
}
._block_4ilxt_520 {
    width:100%
}
._float-left_4ilxt_524 {
    float:left
}
._float-right_4ilxt_528 {
    float:right
}
._bold_1e0nf_1 {
    font-weight:var(--font-weight--medium)
}
._regular_1e0nf_5 {
    font-weight:var(--font-weight--regular)
}
._size-xlarge_1e0nf_9 {
    font-size:var(--font-size--xl);
    line-height:var(--line-height--xl)
}
._size-large_1e0nf_14 {
    font-size:var(--font-size--md);
    line-height:var(--line-height--xl)
}
._size-medium_1e0nf_19 {
    font-size:var(--font-size--sm);
    line-height:var(--line-height--lg)
}
._size-small_1e0nf_24 {
    font-size:var(--font-size--2xs);
    line-height:var(--line-height--lg)
}
._size-xsmall_1e0nf_29 {
    font-size:var(--font-size--3xs);
    line-height:var(--line-height--sm)
}
._compact_1e0nf_34 {
    line-height:1
}
._primary_1e0nf_38 {
    color:var(--color--primary)
}
._secondary_1e0nf_42 {
    color:var(--color--secondary)
}
._text-dark_1e0nf_46 {
    color:var(--color--text--shade-1)
}
._text-base_1e0nf_50 {
    color:var(--color--text)
}
._text-light_1e0nf_54 {
    color:var(--color--text--tint-1)
}
._text-xlight_1e0nf_58 {
    color:var(--color--text--tint-3)
}
._danger_1e0nf_62 {
    color:var(--color--text--danger)
}
._success_1e0nf_66 {
    color:var(--color--success)
}
._warning_1e0nf_70 {
    color:var(--color--warning)
}
._foreground-dark_1e0nf_74 {
    color:var(--color--foreground--shade-1)
}
._foreground-xdark_1e0nf_78 {
    color:var(--color--foreground--shade-2)
}
._align-left_1e0nf_82 {
    text-align:left
}
._align-right_1e0nf_86 {
    text-align:right
}
._align-center_1e0nf_90 {
    text-align:center
}
._xlarge_104df_1 {
    --input--font-size:var(--font-size--md)
}
._xlarge_104df_1 input {
    height:48px
}
.blinking-cursor {
    height:var(--font-size--md);
    width:var(--spacing--3xs);
    border-radius:var(--radius--sm);
    margin-left:var(--spacing--4xs);
    animation:1s step-end infinite blink;
    display:inline-block
}
@keyframes blink {
    0%,to {
        background-color:#0000
}
    50% {
        background-color:var(--color--foreground--shade-2)
}
}
._h1Last_1sdbr_1 {
    width:40%
}
._pLast_1sdbr_5 {
    width:61%
}
._custom_1sdbr_9,.n8n-loading-custom.el-skeleton,.n8n-loading-custom.el-skeleton .el-skeleton__item {
    width:100%;
    height:100%
}
._markdown_24arw_1 {
    color:var(--color--text)
}
._markdown_24arw_1 * {
    font-size:var(--font-size--md);
    line-height:var(--line-height--xl)
}
._markdown_24arw_1 h1,._markdown_24arw_1 h2,._markdown_24arw_1 h3,._markdown_24arw_1 h4 {
    margin-bottom:var(--spacing--sm);
    font-size:var(--font-size--md);
    font-weight:var(--font-weight--bold)
}
._markdown_24arw_1 h3,._markdown_24arw_1 h4 {
    font-weight:var(--font-weight--bold)
}
._markdown_24arw_1 p,._markdown_24arw_1 span {
    margin-bottom:var(--spacing--sm)
}
._markdown_24arw_1 ul,._markdown_24arw_1 ol {
    margin-bottom:var(--spacing--sm);
    padding-left:var(--spacing--md)
}
._markdown_24arw_1 ul li,._markdown_24arw_1 ol li {
    margin-top:.25em
}
._markdown_24arw_1 pre>code {
    background-color:var(--color--background);
    color:var(--color--text--shade-1)
}
._markdown_24arw_1 li>code,._markdown_24arw_1 p>code {
    padding:0 var(--spacing--4xs);
    color:var(--color--text--shade-1);
    background-color:var(--color--background)
}
._markdown_24arw_1 ._label_24arw_43 {
    color:var(--color--text)
}
._markdown_24arw_1 img {
    border-radius:var(--radius--lg);
    max-width:100%
}
._markdown_24arw_1 blockquote {
    border-left:var(--border-color)2px solid;
    padding-left:10px;
    font-style:italic
}
input[type=checkbox] {
    accent-color:var(--color--primary)
}
input[type=checkbox]+label {
    cursor:pointer
}
._sticky_24arw_64 {
    color:var(--sticky--color--text);
    overflow-wrap:break-word
}
._sticky_24arw_64 h1,._sticky_24arw_64 h2,._sticky_24arw_64 h3,._sticky_24arw_64 h4,._sticky_24arw_64 h5,._sticky_24arw_64 h6 {
    color:var(--sticky--color--text)
}
._sticky_24arw_64 h1,._sticky_24arw_64 h2,._sticky_24arw_64 h3,._sticky_24arw_64 h4 {
    margin-bottom:var(--spacing--2xs);
    font-weight:var(--font-weight--bold);
    line-height:var(--line-height--lg)
}
._sticky_24arw_64 h1 {
    font-size:36px
}
._sticky_24arw_64 h2 {
    font-size:24px
}
._sticky_24arw_64 h3,._sticky_24arw_64 h4,._sticky_24arw_64 h5,._sticky_24arw_64 h6 {
    font-size:var(--font-size--md)
}
._sticky_24arw_64 p {
    margin-bottom:var(--spacing--2xs);
    font-size:var(--font-size--sm);
    font-weight:var(--font-weight--regular);
    line-height:var(--line-height--lg)
}
._sticky_24arw_64 ul,._sticky_24arw_64 ol {
    margin-bottom:var(--spacing--2xs);
    padding-left:var(--spacing--md)
}
._sticky_24arw_64 ul li,._sticky_24arw_64 ol li {
    font-size:var(--font-size--sm);
    font-weight:var(--font-weight--regular);
    line-height:var(--line-height--md);
    margin-top:.25em
}
:is(._sticky_24arw_64 ul:has(input[type=checkbox]),._sticky_24arw_64 ol:has(input[type=checkbox])) {
    padding-left:var(--spacing--5xs);
    list-style-type:none
}
._sticky_24arw_64 pre>code {
    background-color:var(--sticky--code--color--background);
    color:var(--sticky--code--color--text)
}
._sticky_24arw_64 pre>code,._sticky_24arw_64 li>code,._sticky_24arw_64 p>code {
    color:var(--sticky--code--color--text)
}
._sticky_24arw_64 a:hover {
    text-decoration:underline
}
._sticky_24arw_64 img {
    object-fit:contain;
    margin-top:var(--spacing--xs);
    margin-bottom:var(--spacing--2xs)
}
._sticky_24arw_64 img[src*=\#full-width] {
    width:100%
}
._sticky_24arw_64 pre,._markdown_24arw_1 pre {
    margin-bottom:var(--spacing--sm);
    display:grid
}
._sticky_24arw_64 pre>code,._markdown_24arw_1 pre>code {
    padding:var(--spacing--sm);
    display:block;
    overflow-x:auto
}
._sticky_24arw_64 iframe,._markdown_24arw_1 iframe {
    aspect-ratio:auto 16/9
}
._sticky_24arw_64 summary,._markdown_24arw_1 summary {
    cursor:pointer
}
._spacer_24arw_160 {
    margin:var(--spacing--2xl)
}
.recycle-scroller-wrapper {
    flex:auto;
    width:100%;
    height:100%;
    overflow:auto
}
.recycle-scroller {
    width:100%;
    display:block;
    position:relative
}
.recycle-scroller-items-wrapper {
    width:100%;
    position:absolute
}
.recycle-scroller-item {
    width:100%;
    display:flex;
    position:relative
}
._resize_11wc6_1 {
    --resizer--size:4px;
    --resizer--spacing--side:-2px;
    --resizer--spacing--corner:-3px;
    z-index:2;
    width:100%;
    height:100%;
    position:relative
}
._resizer_11wc6_11 {
    z-index:3;
    position:absolute
}
._right_11wc6_16 {
    width:var(--resizer--size);
    height:100%;
    top:var(--resizer--spacing--side);
    right:var(--resizer--spacing--side);
    cursor:ew-resize
}
._top_11wc6_24 {
    width:100%;
    height:var(--resizer--size);
    top:var(--resizer--spacing--side);
    left:var(--resizer--spacing--side);
    cursor:ns-resize
}
._bottom_11wc6_32 {
    width:100%;
    height:var(--resizer--size);
    bottom:var(--resizer--spacing--side);
    left:var(--resizer--spacing--side);
    cursor:ns-resize
}
._left_11wc6_40 {
    width:var(--resizer--size);
    height:100%;
    top:var(--resizer--spacing--side);
    left:var(--resizer--spacing--side);
    cursor:ew-resize
}
._topLeft_11wc6_48 {
    width:var(--resizer--size);
    height:var(--resizer--size);
    top:var(--resizer--spacing--corner);
    left:var(--resizer--spacing--corner);
    cursor:nw-resize
}
._topRight_11wc6_56 {
    width:var(--resizer--size);
    height:var(--resizer--size);
    top:var(--resizer--spacing--corner);
    right:var(--resizer--spacing--corner);
    cursor:ne-resize
}
._bottomLeft_11wc6_64 {
    width:var(--resizer--size);
    height:var(--resizer--size);
    bottom:var(--resizer--spacing--corner);
    left:var(--resizer--spacing--corner);
    cursor:sw-resize
}
._bottomRight_11wc6_72 {
    width:var(--resizer--size);
    height:var(--resizer--size);
    bottom:var(--resizer--spacing--corner);
    right:var(--resizer--spacing--corner);
    cursor:se-resize
}
._outset_11wc6_80 {
    --resizer--spacing--side:calc(-1*var(--resizer--size) + 2px);
    --resizer--spacing--corner:calc(-1*var(--resizer--size) + 3px)
}
._sticky_1uezk_1 {
    border-radius:var(--radius);
    background-color:var(--sticky--color--background);
    border:1px solid var(--sticky--border-color);
    position:absolute
}
._clickable_1uezk_8 {
    cursor:pointer
}
._wrapper_1uezk_12 {
    width:100%;
    height:100%;
    padding:var(--spacing--2xs)var(--spacing--xs)0;
    position:absolute;
    overflow:hidden
}
._footer_1uezk_20 {
    padding:var(--spacing--5xs)var(--spacing--2xs)0 var(--spacing--2xs);
    justify-content:flex-end;
    display:flex
}
._color-2_1uezk_26 {
    --sticky--color--background:var(--sticky--color--background--variant-2);
    --sticky--border-color:var(--sticky--border-color--variant-2)
}
._color-3_1uezk_31 {
    --sticky--color--background:var(--sticky--color--background--variant-3);
    --sticky--border-color:var(--sticky--border-color--variant-3)
}
._color-4_1uezk_36 {
    --sticky--color--background:var(--sticky--color--background--variant-4);
    --sticky--border-color:var(--sticky--border-color--variant-4)
}
._color-5_1uezk_41 {
    --sticky--color--background:var(--sticky--color--background--variant-5);
    --sticky--border-color:var(--sticky--border-color--variant-5)
}
._color-6_1uezk_46 {
    --sticky--color--background:var(--sticky--color--background--variant-6);
    --sticky--border-color:var(--sticky--border-color--variant-6)
}
._color-7_1uezk_51 {
    --sticky--color--background:var(--sticky--color--background--variant-7);
    --sticky--border-color:var(--sticky--border-color--variant-7)
}
.sticky-textarea {
    height:calc(100% - var(--spacing--lg));
    padding:var(--spacing--2xs)var(--spacing--2xs)0 var(--spacing--2xs);
    cursor:default
}
.sticky-textarea .el-textarea {
    height:100%
}
.sticky-textarea .el-textarea .el-textarea__inner {
    height:100%;
    resize:unset
}
.full-height {
    height:calc(100% - var(--spacing--2xs))
}
ul.user-stack-list {
    gap:var(--spacing--sm);
    padding-bottom:var(--spacing--2xs);
    border:none;
    flex-direction:column;
    display:flex
}
ul.user-stack-list .el-dropdown-menu__item {
    line-height:var(--line-height--md)
}
ul.user-stack-list li:hover {
    color:currentColor!important
}
.user-stack-popper {
    border:1px solid var(--border-color--light);
    border-radius:var(--radius);
    padding:var(--spacing--5xs)0;
    background-color:var(--color--background--light-3);
    box-shadow:0 2px 8px #441c171a
}
.command-bar-enter-active {
    transition:opacity .1s ease-out,transform .1s ease-out
}
.command-bar-leave-active {
    transition:opacity .1s ease-in,transform .1s ease-in
}
.command-bar-enter-from {
    opacity:0;
    transform:translate(-50%)translateY(-20px)scale(.95)
}
.command-bar-leave-to {
    opacity:0;
    transform:translate(-50%)translateY(-10px)scale(.98)
}
.command-bar-enter-to,.command-bar-leave-from {
    opacity:1;
    transform:translate(-50%)translateY(0)scale(1)
}
.n8n-loading-custom,.n8n-loading-custom>div {
    width:100%;
    height:100%
}
.chat-message {
    max-width:fit-content;
    font-size:var(--chat--message--font-size);
    padding:var(--chat--message--padding);
    border-radius:var(--chat--message--border-radius);
    scroll-margin:3rem;
    display:block;
    position:relative
}
.chat-message .chat-message-actions {
    opacity:0;
    gap:1rem;
    display:flex;
    position:absolute;
    bottom:calc(100% - .5rem);
    left:0;
    transform:translateY(-.25rem)
}
.chat-message.chat-message-from-user .chat-message-actions {
    left:auto;
    right:0
}
.chat-message:hover .chat-message-actions {
    opacity:1
}
.chat-message p {
    line-height:var(--chat--message-line-height);
    word-wrap:break-word
}
.chat-message+.chat-message {
    margin-top:var(--chat--message--margin-bottom)
}
.chat-message.chat-message-from-user+.chat-message.chat-message-from-bot,.chat-message.chat-message-from-bot+.chat-message.chat-message-from-user {
    margin-top:var(--chat--spacing)
}
.chat-message.chat-message-from-bot {
    color:var(--chat--message--bot--color);
    border-bottom-left-radius:0
}
.chat-message.chat-message-from-bot:not(.chat-message-transparent) {
    background-color:var(--chat--message--bot--background);
    border:var(--chat--message--bot--border)
}
.chat-message.chat-message-from-user {
    color:var(--chat--message--user--color);
    border-bottom-right-radius:0;
    margin-left:auto
}
.chat-message.chat-message-from-user:not(.chat-message-transparent) {
    background-color:var(--chat--message--user--background);
    border:var(--chat--message--user--border)
}
.chat-message>.chat-message-markdown {
    box-sizing:border-box;
    font-size:inherit;
    display:block
}
.chat-message>.chat-message-markdown>:first-child {
    margin-top:0
}
.chat-message>.chat-message-markdown>:last-child {
    margin-bottom:0
}
.chat-message>.chat-message-markdown pre {
    font-family:inherit;
    font-size:inherit;
    white-space:pre-wrap;
    box-sizing:border-box;
    padding:var(--chat--spacing);
    background:var(--chat--message--pre--background);
    border-radius:var(--chat--border-radius);
    margin:0
}
.chat-message .chat-message-files {
    flex-wrap:wrap;
    gap:.25rem;
    padding-top:.5rem;
    display:flex
}
.chat-window-wrapper {
    bottom:var(--chat--window--bottom);
    right:var(--chat--window--right);
    z-index:var(--chat--window--z-index);
    max-width:calc(100% - var(--chat--window--right,var(--chat--spacing))*2);
    max-height:calc(100% - var(--chat--window--bottom,var(--chat--spacing))*2);
    flex-direction:column;
    display:flex;
    position:fixed
}
.chat-window-wrapper .chat-window {
    width:var(--chat--window--width);
    height:var(--chat--window--height);
    border:var(--chat--window--border,1px solid var(--chat--color-light-shade-100));
    border-radius:var(--chat--window--border-radius,var(--chat--border-radius));
    max-width:100%;
    max-height:100%;
    margin-bottom:var(--chat--window--margin-bottom,var(--chat--spacing));
    transform-origin:100% 100%;
    display:flex;
    overflow:hidden
}
.chat-window-wrapper .chat-window .chat-layout {
    flex:1;
    width:auto;
    height:auto
}
.chat-window-wrapper .chat-window-toggle {
    background:var(--chat--toggle--background);
    color:var(--chat--toggle--color);
    cursor:pointer;
    width:var(--chat--toggle--width);
    height:var(--chat--toggle--height);
    border-radius:var(--chat--toggle--border-radius,50%);
    transition:transform var(--chat--transition-duration)ease,background var(--chat--transition-duration)ease;
    flex:none;
    justify-content:center;
    align-items:center;
    margin-left:auto;
    display:inline-flex
}
.chat-window-wrapper .chat-window-toggle:hover,.chat-window-wrapper .chat-window-toggle:focus {
    background:var(--chat--toggle--hover--background);
    transform:scale(1.05)
}
.chat-window-wrapper .chat-window-toggle:active {
    background:var(--chat--toggle--active--background);
    transform:scale(.95)
}
.chat-window-transition-enter-active,.chat-window-transition-leave-active {
    transition:transform var(--chat--transition-duration)ease,opacity var(--chat--transition-duration)ease
}
.chat-window-transition-enter-from,.chat-window-transition-leave-to {
    opacity:0;
    transform:scale(0)
}
.chat-window-toggle-transition-enter-active,.chat-window-toggle-transition-leave-active {
    transition:opacity var(--chat--transition-duration)ease
}
.chat-window-toggle-transition-enter-from,.chat-window-toggle-transition-leave-to {
    opacity:0
}
.chat-message-typing {
    max-width:80px
}
.chat-message-typing.chat-message-typing-animation-scaling .chat-message-typing-circle {
    animation:.8s ease-in-out 3.6s infinite chat-message-typing-animation-scaling
}
.chat-message-typing.chat-message-typing-animation-bouncing .chat-message-typing-circle {
    animation:.8s ease-in-out 3.6s infinite chat-message-typing-animation-bouncing
}
.chat-message-typing .chat-message-typing-body {
    justify-content:center;
    align-items:center;
    display:flex
}
.chat-message-typing .chat-message-typing-circle {
    background-color:var(--chat--color-typing);
    border-radius:50%;
    width:10px;
    height:10px;
    margin:3px;
    display:block
}
.chat-message-typing .chat-message-typing-circle:first-child {
    animation-delay:0s
}
.chat-message-typing .chat-message-typing-circle:nth-child(2) {
    animation-delay:.333s
}
.chat-message-typing .chat-message-typing-circle:nth-child(3) {
    animation-delay:.666s
}
@keyframes chat-message-typing-animation-scaling {
    0% {
        transform:scale(1)
}
    33% {
        transform:scale(1)
}
    50% {
        transform:scale(1.4)
}
    to {
        transform:scale(1)
}
}
@keyframes chat-message-typing-animation-bouncing {
    0% {
        transform:translateY(0)
}
    33% {
        transform:translateY(0)
}
    50% {
        transform:translateY(-10px)
}
    to {
        transform:translateY(0)
}
}
.chat-messages-list {
    padding:var(--chat--messages-list--padding);
    margin-top:auto;
    display:block
}
.empty-container {
    justify-content:center;
    align-items:center;
    display:flex;
    container-type:size
}
.empty-container p {
    max-width:16em;
    margin:0
}
.empty {
    text-align:center;
    color:var(--color--text);
    justify-content:center;
    align-items:center;
    gap:var(--spacing--xs);
    padding-inline:var(--spacing--md);
    padding-bottom:var(--spacing--lg);
    flex-direction:column;
    display:flex;
    overflow:hidden
}
.emptyIcon {
    zoom:2.5;
    color:var(--color-button-secondary-border)
}
@container (height<150px) {
    .empty {
        text-align:left;
        flex-direction:row
}
    .emptyIcon {
        zoom:1.5
}
}
.chat-heading {
    justify-content:space-between;
    align-items:center;
    display:flex
}
.chat-close-button {
    cursor:pointer;
    background:0 0;
    border:none;
    display:flex
}
.chat-close-button:hover {
    color:var(--chat--close--button--color-hover,var(--chat--color--primary))
}
/*$vite$:1*/

/* ==========================================================================
   PORTFOLIO 2026 CYBER EXECUTIVE DESIGN SYSTEM - TAMER ALJABALI
   ========================================================================== */

:root {
    --bg-base: #060913;
    --bg-surface: #0b1120;
    --bg-surface-2: #111a2e;
    --bg-card: rgba(15, 23, 42, 0.75);
    --bg-card-hover: rgba(22, 34, 60, 0.9);
    --border-subtle: rgba(255, 255, 255, 0.08);
    --border-glow: rgba(16, 185, 129, 0.35);
    --border-glow-cyan: rgba(6, 182, 212, 0.35);
    --accent-emerald: #10b981;
    --accent-emerald-light: #34d399;
    --accent-cyan: #06b6d4;
    --accent-cyan-light: #22d3ee;
    --accent-amber: #f59e0b;
    --accent-indigo: #6366f1;
    --text-primary: #f8fafc;
    --text-secondary: #cbd5e1;
    --text-muted: #94a3b8;
    --text-dim: #64748b;
    --font-main: 'Cairo', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    --shadow-card: 0 10px 30px -10px rgba(0, 0, 0, 0.6);
    --shadow-glow: 0 0 25px -5px rgba(16, 185, 129, 0.25);
    --radius-sm: 8px;
    --radius-md: 14px;
    --radius-lg: 20px;
    --radius-full: 9999px;
    --transition: all 0.28s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Global Reset & Base */
body.body1, body {
    background-color: var(--bg-base) !important;
    color: var(--text-secondary);
    font-family: var(--font-main);
    overflow-x: hidden;
    line-height: 1.65;
}

::selection {
    background: rgba(16, 185, 129, 0.3);
    color: #ffffff;
}

/* Scrollbar */
::-webkit-scrollbar {
    width: 8px;
}
::-webkit-scrollbar-track {
    background: var(--bg-base);
}
::-webkit-scrollbar-thumb {
    background: #1e293b;
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
    background: var(--accent-emerald);
}

/* Animated Ambient Background Mesh */
.ambient-mesh {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    pointer-events: none;
    z-index: 0;
    overflow: hidden;
}
.ambient-orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(100px);
    opacity: 0.15;
    animation: orbFloat 20s infinite alternate ease-in-out;
}
.ambient-orb-1 {
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, var(--accent-emerald) 0%, transparent 70%);
    top: -100px;
    right: -100px;
}
.ambient-orb-2 {
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, var(--accent-cyan) 0%, transparent 70%);
    bottom: -150px;
    left: -100px;
    animation-duration: 25s;
}
.ambient-orb-3 {
    width: 450px;
    height: 450px;
    background: radial-gradient(circle, var(--accent-indigo) 0%, transparent 70%);
    top: 45%;
    left: 35%;
    animation-duration: 18s;
}

@keyframes orbFloat {
    0% { transform: translate(0, 0) scale(1); }
    100% { transform: translate(60px, 40px) scale(1.15); }
}

/* Modern Top Navigation Bar - Cute Compact 1-Line */
.modern-navbar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    padding: 8px 0;
    transition: var(--transition);
    background: rgba(6, 9, 19, 0.82);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-bottom: 1px solid var(--border-subtle);
}
.modern-navbar.scrolled {
    padding: 6px 0;
    background: rgba(6, 9, 19, 0.95);
    box-shadow: 0 8px 25px rgba(0,0,0,0.5);
    border-bottom-color: rgba(16, 185, 129, 0.25);
}
.nav-brand-group {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    white-space: nowrap;
}
.nav-brand-avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid var(--accent-emerald);
    box-shadow: 0 0 10px var(--accent-emerald-glow);
    flex-shrink: 0;
}
.nav-brand-text {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
}
.nav-brand-name {
    font-size: 0.96rem;
    font-weight: 800;
    color: var(--text-primary);
    line-height: 1;
    margin: 0;
    white-space: nowrap;
}
.nav-role-badge {
    font-size: 0.68rem;
    color: var(--accent-emerald);
    background: rgba(16, 185, 129, 0.12);
    border: 1px solid rgba(16, 185, 129, 0.3);
    padding: 2px 8px;
    border-radius: var(--radius-full);
    font-weight: 700;
    letter-spacing: 0.3px;
    display: inline-block;
    white-space: nowrap;
}
.nav-links-desktop {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0;
    padding: 0;
    list-style: none;
    white-space: nowrap;
}
.nav-links-desktop a {
    color: var(--text-muted);
    font-size: 0.82rem;
    font-weight: 600;
    text-decoration: none;
    transition: var(--transition);
    padding: 4px 8px;
    border-radius: var(--radius-sm);
    position: relative;
    white-space: nowrap;
}
.nav-links-desktop a:hover,
.nav-links-desktop a.active {
    color: var(--accent-emerald);
    background: rgba(16, 185, 129, 0.08);
}
.nav-action-group {
    display: flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
}

/* Language Switcher Button */
.lang-switcher-btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 10px;
    border-radius: var(--radius-full);
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid var(--border-subtle);
    color: var(--text-primary);
    font-size: 0.76rem;
    font-weight: 700;
    text-decoration: none;
    transition: var(--transition);
    white-space: nowrap;
}
.lang-switcher-btn:hover {
    background: rgba(16, 185, 129, 0.15);
    border-color: var(--accent-emerald);
    color: var(--accent-emerald);
}

/* CTA Buttons */
.btn-cyber-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 6px 14px;
    border-radius: var(--radius-full);
    background: linear-gradient(135deg, #10b981 0%, #059669 100%);
    color: #ffffff !important;
    font-weight: 700;
    font-size: 0.8rem;
    text-decoration: none;
    border: none;
    cursor: pointer;
    box-shadow: 0 3px 12px var(--accent-emerald-glow);
    transition: var(--transition);
    white-space: nowrap;
}
.btn-cyber-primary:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 18px rgba(16, 185, 129, 0.45);
    background: linear-gradient(135deg, #34d399 0%, #10b981 100%);
    color: #ffffff !important;
}

.btn-cyber-outline {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 6px 12px;
    border-radius: var(--radius-full);
    background: rgba(15, 23, 42, 0.6);
    border: 1px solid var(--border-subtle);
    color: var(--text-primary) !important;
    font-weight: 700;
    font-size: 0.78rem;
    text-decoration: none;
    cursor: pointer;
    backdrop-filter: blur(10px);
    transition: var(--transition);
    white-space: nowrap;
}
.btn-cyber-outline:hover {
    border-color: var(--accent-cyan);
    color: var(--accent-cyan) !important;
    background: rgba(6, 182, 212, 0.1);
    transform: translateY(-1px);
}

/* Clear & Bright Languages Badge - High Visibility */
.lang-badge-highlight {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(6, 182, 212, 0.14);
    border: 1px solid rgba(6, 182, 212, 0.45);
    color: #FFFFFF !important;
    font-size: 0.94rem;
    font-weight: 700;
    padding: 8px 18px;
    border-radius: var(--radius-full);
    box-shadow: 0 0 16px rgba(6, 182, 212, 0.2);
    backdrop-filter: blur(8px);
}
.lang-badge-highlight i {
    color: #38bdf8 !important;
    font-size: 1.1rem;
}
.lang-badge-highlight strong {
    color: #38bdf8 !important;
    font-weight: 800;
}
.lang-badge-highlight span {
    color: #FFFFFF !important;
    font-weight: 600;
}

/* n8n AI Chatbot Deep Custom Theming */
.n8n-chat,
.chat-window-wrapper,
.chat-window {
    font-family: var(--font-main) !important;
}

.chat-window-wrapper .chat-window {
    background: #0B1120 !important;
    border: 1px solid rgba(16, 185, 129, 0.4) !important;
    border-radius: 20px !important;
    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.85), 0 0 30px rgba(16, 185, 129, 0.2) !important;
    backdrop-filter: blur(24px) !important;
    -webkit-backdrop-filter: blur(24px) !important;
    overflow: hidden !important;
}

.chat-window .chat-header {
    background: #080D1A !important;
    color: #F8FAFC !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
    padding: 1.1rem 1.25rem !important;
}

.chat-window .chat-header-title,
.chat-window .chat-heading {
    font-size: 1.12rem !important;
    font-weight: 800 !important;
    color: #F8FAFC !important;
}

.chat-window .chat-header-subtitle,
.chat-window .chat-subtitle {
    font-size: 0.82rem !important;
    color: var(--accent-emerald) !important;
    font-weight: 600 !important;
}

.chat-window .chat-header-close-button,
.chat-window .chat-close-button {
    color: var(--text-muted) !important;
    transition: var(--transition) !important;
}
.chat-window .chat-header-close-button:hover,
.chat-window .chat-close-button:hover {
    color: var(--accent-emerald) !important;
    transform: scale(1.1);
}

.chat-window .chat-body,
.chat-window .chat-messages-list {
    background: #060913 !important;
    padding: 1.2rem !important;
}

.chat-window .chat-message-bot,
.chat-window .chat-message--bot {
    background: #0F172A !important;
    color: #F8FAFC !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: 14px !important;
    font-size: 0.92rem !important;
    line-height: 1.6 !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
}

.chat-window .chat-message-user,
.chat-window .chat-message--user {
    background: linear-gradient(135deg, #10B981 0%, #059669 100%) !important;
    color: #FFFFFF !important;
    border: none !important;
    border-radius: 14px !important;
    font-size: 0.92rem !important;
    font-weight: 600 !important;
    box-shadow: 0 4px 14px rgba(16, 185, 129, 0.35) !important;
}

.chat-window .chat-footer {
    background: #080D1A !important;
    border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
    padding: 0.85rem 1rem !important;
}

.chat-window .chat-input-container {
    background: #0B1120 !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    border-radius: 12px !important;
    transition: var(--transition) !important;
}
.chat-window .chat-input-container:focus-within {
    border-color: var(--accent-emerald) !important;
    box-shadow: 0 0 14px rgba(16, 185, 129, 0.25) !important;
}

.chat-window .chat-textarea,
.chat-window .chat-input {
    background: transparent !important;
    color: #F8FAFC !important;
    font-family: var(--font-main) !important;
    font-size: 0.92rem !important;
}

.chat-window .chat-input-send-button {
    color: var(--accent-emerald) !important;
    transition: var(--transition) !important;
}
.chat-window .chat-input-send-button:hover {
    color: var(--accent-emerald-light) !important;
    transform: scale(1.1);
}

.chat-window-wrapper .chat-window-toggle,
.chat-window-wrapper .chat-toggle-button {
    background: linear-gradient(135deg, #10B981 0%, #059669 100%) !important;
    color: #FFFFFF !important;
    box-shadow: 0 8px 25px rgba(16, 185, 129, 0.5) !important;
    border: 2px solid rgba(255, 255, 255, 0.15) !important;
    transition: var(--transition) !important;
}
.chat-window-wrapper .chat-window-toggle:hover,
.chat-window-wrapper .chat-toggle-button:hover {
    background: linear-gradient(135deg, #34D399 0%, #10B981 100%) !important;
    transform: scale(1.06);
    box-shadow: 0 10px 30px rgba(16, 185, 129, 0.65) !important;
}

.chat-window .chat-button,
.chat-window .chat-get-started-button {
    background: linear-gradient(135deg, #10B981 0%, #059669 100%) !important;
    color: #FFFFFF !important;
    border-radius: 10px !important;
    font-weight: 700 !important;
    font-family: var(--font-main) !important;
    transition: var(--transition) !important;
}
.chat-window .chat-button:hover,
.chat-window .chat-get-started-button:hover {
    background: linear-gradient(135deg, #34D399 0%, #10B981 100%) !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(16, 185, 129, 0.4) !important;
}

/* Pulse Online Badge */
.status-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 14px;
    background: rgba(16, 185, 129, 0.1);
    border: 1px solid rgba(16, 185, 129, 0.3);
    border-radius: var(--radius-full);
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--accent-emerald);
}
.status-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: var(--accent-emerald);
    box-shadow: 0 0 10px var(--accent-emerald);
    animation: statusPulse 2s infinite;
}
@keyframes statusPulse {
    0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.7); }
    70% { transform: scale(1); box-shadow: 0 0 0 8px rgba(16, 185, 129, 0); }
    100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(16, 185, 129, 0); }
}

/* Hero Section */
.hero-wrapper {
    position: relative;
    padding-top: 130px;
    padding-bottom: 70px;
    z-index: 1;
}
.hero-card-main {
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-lg);
    padding: 40px;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    box-shadow: var(--shadow-card);
    position: relative;
    overflow: hidden;
}
.hero-card-main::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--accent-emerald), var(--accent-cyan), var(--accent-indigo));
}
.hero-avatar-box {
    position: relative;
    text-align: center;
}
.hero-avatar-glow {
    position: relative;
    display: inline-block;
    border-radius: 50%;
    padding: 6px;
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.5), rgba(6, 182, 212, 0.2), rgba(99, 102, 241, 0.5));
    box-shadow: 0 0 35px rgba(16, 185, 129, 0.25);
}
.hero-avatar-img {
    width: 200px;
    height: 200px;
    border-radius: 50%;
    object-fit: cover;
    background-color: var(--bg-surface-2);
    display: block;
}
.hero-badge-float {
    position: absolute;
    bottom: 0px;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(11, 17, 32, 0.95);
    border: 1px solid var(--accent-emerald);
    padding: 4px 14px;
    border-radius: var(--radius-full);
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--accent-emerald);
    white-space: nowrap;
    box-shadow: 0 4px 12px rgba(0,0,0,0.5);
}

.hero-title-gradient {
    background: linear-gradient(135deg, #ffffff 40%, #10b981 80%, #06b6d4 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 2.55rem;
    font-weight: 800;
    line-height: 1.25;
    margin-bottom: 16px;
}
.hero-subtitle {
    font-size: 1.18rem;
    font-weight: 600;
    color: var(--accent-cyan);
    margin-bottom: 18px;
}
.hero-bio {
    font-size: 1.02rem;
    color: var(--text-muted);
    line-height: 1.8;
    margin-bottom: 28px;
}

/* Hero Stats Row */
.stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-top: 36px;
}
.stat-card {
    background: rgba(15, 23, 42, 0.65);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-md);
    padding: 20px 16px;
    text-align: center;
    transition: var(--transition);
}
.stat-card:hover {
    border-color: var(--accent-emerald);
    transform: translateY(-3px);
    box-shadow: 0 10px 25px rgba(0,0,0,0.4);
}
.stat-number {
    font-size: 2.1rem;
    font-weight: 800;
    color: var(--text-primary);
    line-height: 1.1;
    margin-bottom: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
}
.stat-number span.plus {
    color: var(--accent-emerald);
}
.stat-label {
    font-size: 0.82rem;
    color: var(--text-muted);
    font-weight: 600;
    margin: 0;
}

/* Sidebar Quick Profile Box (Left Sticky Component) */
.profile-sidebar-card {
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-lg);
    padding: 30px;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    box-shadow: var(--shadow-card);
    position: sticky;
    top: 90px;
}
.sidebar-avatar-wrap {
    text-align: center;
    margin-bottom: 20px;
}
.sidebar-avatar {
    width: 140px;
    height: 140px;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid var(--accent-emerald);
    box-shadow: 0 0 25px var(--accent-emerald-glow);
}
.sidebar-name {
    font-size: 1.35rem;
    font-weight: 800;
    color: var(--text-primary);
    margin-bottom: 4px;
    text-align: center;
}
.sidebar-role {
    font-size: 0.88rem;
    color: var(--accent-emerald);
    font-weight: 600;
    text-align: center;
    margin-bottom: 16px;
}
.sidebar-info-list {
    list-style: none;
    padding: 0;
    margin: 0 0 24px 0;
}
.sidebar-info-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    font-size: 0.88rem;
    color: var(--text-secondary);
}
.sidebar-info-item:last-child {
    border-bottom: none;
}
.sidebar-info-item i {
    width: 20px;
    color: var(--accent-emerald);
    font-size: 1rem;
    text-align: center;
}
.sidebar-info-item a {
    color: var(--text-secondary);
    text-decoration: none;
    transition: var(--transition);
    word-break: break-all;
}
.sidebar-info-item a:hover {
    color: var(--accent-emerald);
}

.sidebar-social-links {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-bottom: 24px;
}
.sidebar-social-btn {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid var(--border-subtle);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--text-muted);
    text-decoration: none;
    transition: var(--transition);
}
.sidebar-social-btn:hover {
    background: var(--accent-emerald);
    color: #ffffff;
    border-color: var(--accent-emerald);
    transform: translateY(-2px);
    box-shadow: 0 5px 15px var(--accent-emerald-glow);
}

.sidebar-cloud-links {
    background: rgba(11, 17, 32, 0.6);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: var(--radius-md);
    padding: 16px;
    margin-top: 20px;
}
.sidebar-cloud-title {
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--accent-cyan);
    font-weight: 700;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    gap: 6px;
}
.sidebar-cloud-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.cloud-tag {
    font-size: 0.76rem;
    font-weight: 600;
    padding: 4px 10px;
    border-radius: var(--radius-sm);
    background: rgba(6, 182, 212, 0.08);
    border: 1px solid rgba(6, 182, 212, 0.2);
    color: var(--text-secondary);
    text-decoration: none;
    transition: var(--transition);
}
.cloud-tag:hover {
    background: var(--accent-cyan);
    color: #06111f;
    border-color: var(--accent-cyan);
}

/* Section Common Headers */
.section-header-modern {
    margin-bottom: 36px;
    position: relative;
}
.section-tag-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 12px;
    border-radius: var(--radius-full);
    background: rgba(16, 185, 129, 0.1);
    border: 1px solid rgba(16, 185, 129, 0.3);
    color: var(--accent-emerald);
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 12px;
}
.section-tag-pill i {
    font-size: 0.75rem;
}
.section-title-modern {
    font-size: 2.15rem;
    font-weight: 800;
    color: var(--text-primary);
    line-height: 1.25;
    margin-bottom: 12px;
}
.section-title-modern span {
    color: var(--accent-emerald);
}
.section-desc-modern {
    font-size: 1rem;
    color: var(--text-muted);
    max-width: 720px;
    line-height: 1.7;
    margin-bottom: 0;
}

/* Generic Section Card Container */
.cyber-card {
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-lg);
    padding: 32px;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    box-shadow: var(--shadow-card);
    transition: var(--transition);
    position: relative;
    overflow: hidden;
    margin-bottom: 30px;
}
.cyber-card:hover {
    border-color: rgba(16, 185, 129, 0.35);
    box-shadow: 0 15px 35px rgba(0,0,0,0.5), 0 0 20px rgba(16, 185, 129, 0.1);
}

/* Core Competencies Grid */
.competency-card {
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-md);
    padding: 24px;
    height: 100%;
    transition: var(--transition);
    display: flex;
    flex-direction: column;
    position: relative;
}
.competency-card:hover {
    border-color: var(--accent-emerald);
    background: var(--bg-card-hover);
    transform: translateY(-4px);
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.5), 0 0 20px rgba(16, 185, 129, 0.15);
}
.competency-icon-wrap {
    width: 52px;
    height: 52px;
    border-radius: var(--radius-md);
    background: rgba(16, 185, 129, 0.1);
    border: 1px solid rgba(16, 185, 129, 0.25);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--accent-emerald);
    font-size: 1.4rem;
    margin-bottom: 18px;
    transition: var(--transition);
}
.competency-card:hover .competency-icon-wrap {
    background: var(--accent-emerald);
    color: #ffffff;
    box-shadow: 0 0 15px var(--accent-emerald-glow);
}
.competency-title {
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--text-primary);
    margin-bottom: 12px;
}
.competency-desc {
    font-size: 0.9rem;
    color: var(--text-muted);
    line-height: 1.6;
    margin-bottom: 0;
    flex-grow: 1;
}

/* Projects Showcase */
.project-card-modern {
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-lg);
    padding: 30px;
    height: 100%;
    display: flex;
    flex-direction: column;
    transition: var(--transition);
    position: relative;
}
.project-card-modern:hover {
    border-color: var(--accent-cyan);
    background: var(--bg-card-hover);
    transform: translateY(-4px);
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.5), 0 0 25px rgba(6, 182, 212, 0.18);
}
.project-card-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 16px;
    gap: 12px;
}
.project-status-badge {
    padding: 4px 10px;
    border-radius: var(--radius-full);
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.badge-live {
    background: rgba(16, 185, 129, 0.15);
    border: 1px solid var(--accent-emerald);
    color: var(--accent-emerald);
}
.badge-donor {
    background: rgba(6, 182, 212, 0.15);
    border: 1px solid var(--accent-cyan);
    color: var(--accent-cyan);
}
.badge-ai {
    background: rgba(245, 158, 11, 0.15);
    border: 1px solid var(--accent-amber);
    color: var(--accent-amber);
}
.badge-enterprise {
    background: rgba(99, 102, 241, 0.15);
    border: 1px solid var(--accent-indigo);
    color: #a5b4fc;
}

.project-year-pill {
    font-size: 0.8rem;
    color: var(--text-dim);
    font-weight: 600;
}
.project-title {
    font-size: 1.28rem;
    font-weight: 800;
    color: var(--text-primary);
    margin-bottom: 4px;
    line-height: 1.35;
}
.project-subtitle-ar {
    font-size: 0.92rem;
    color: var(--accent-emerald);
    font-weight: 600;
    margin-bottom: 12px;
}
.project-org-tag {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.82rem;
    color: var(--text-secondary);
    font-weight: 600;
    margin-bottom: 14px;
}
.project-desc {
    font-size: 0.92rem;
    color: var(--text-muted);
    line-height: 1.65;
    margin-bottom: 20px;
    flex-grow: 1;
}
.project-tech-stack {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 22px;
}
.tech-pill {
    font-size: 0.74rem;
    font-weight: 600;
    padding: 4px 10px;
    border-radius: var(--radius-sm);
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.08);
    color: var(--text-secondary);
}
.project-card-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 16px;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
}
.project-link-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--accent-cyan);
    font-size: 0.88rem;
    font-weight: 700;
    text-decoration: none;
    transition: var(--transition);
}
.project-link-btn:hover {
    color: var(--accent-cyan-light);
    gap: 9px;
}

/* Timeline Components */
.timeline-modern {
    position: relative;
    padding-left: 28px;
}
html[dir="rtl"] .timeline-modern {
    padding-left: 0;
    padding-right: 28px;
}
.timeline-modern::before {
    content: '';
    position: absolute;
    top: 10px;
    bottom: 10px;
    left: 8px;
    width: 2px;
    background: linear-gradient(180deg, var(--accent-emerald), var(--accent-cyan), rgba(99, 102, 241, 0.2));
}
html[dir="rtl"] .timeline-modern::before {
    left: auto;
    right: 8px;
}

.timeline-item-modern {
    position: relative;
    margin-bottom: 36px;
}
.timeline-item-modern:last-child {
    margin-bottom: 0;
}
.timeline-item-modern::after {
    content: '';
    position: absolute;
    top: 6px;
    left: -28px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: var(--bg-surface);
    border: 3px solid var(--accent-emerald);
    box-shadow: 0 0 10px var(--accent-emerald-glow);
    z-index: 2;
}
html[dir="rtl"] .timeline-item-modern::after {
    left: auto;
    right: -28px;
}

.timeline-card-content {
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-md);
    padding: 24px;
    transition: var(--transition);
}
.timeline-card-content:hover {
    border-color: rgba(16, 185, 129, 0.35);
    background: var(--bg-card-hover);
    transform: translateY(-2px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.4);
}
.timeline-header-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 12px;
}
.timeline-role-title {
    font-size: 1.2rem;
    font-weight: 800;
    color: var(--text-primary);
    margin: 0 0 4px 0;
}
.timeline-company-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--accent-emerald);
}
.timeline-period-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 12px;
    border-radius: var(--radius-full);
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid var(--border-subtle);
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--text-secondary);
}
.timeline-period-badge.badge-present {
    background: rgba(16, 185, 129, 0.15);
    border-color: var(--accent-emerald);
    color: var(--accent-emerald);
}
.timeline-bullet-list {
    list-style: none;
    padding: 0;
    margin: 14px 0 0 0;
}
.timeline-bullet-list li {
    position: relative;
    padding-left: 18px;
    margin-bottom: 8px;
    font-size: 0.9rem;
    color: var(--text-muted);
    line-height: 1.6;
}
html[dir="rtl"] .timeline-bullet-list li {
    padding-left: 0;
    padding-right: 18px;
}
.timeline-bullet-list li::before {
    content: '▹';
    position: absolute;
    left: 0;
    top: 0;
    color: var(--accent-emerald);
    font-size: 1rem;
}
html[dir="rtl"] .timeline-bullet-list li::before {
    left: auto;
    right: 0;
    content: '◃';
}

/* Skills Matrix Cards & Tags */
.skill-category-card {
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-md);
    padding: 24px;
    height: 100%;
    transition: var(--transition);
}
.skill-category-card:hover {
    border-color: var(--accent-cyan);
    background: var(--bg-card-hover);
    transform: translateY(-3px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.4);
}
.skill-category-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
.skill-category-header i {
    font-size: 1.3rem;
    color: var(--accent-cyan);
}
.skill-category-header h4 {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
}
.skill-badge-cloud {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.skill-tag-item {
    font-size: 0.82rem;
    font-weight: 600;
    padding: 6px 12px;
    border-radius: var(--radius-sm);
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.08);
    color: var(--text-secondary);
    transition: var(--transition);
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.skill-tag-item:hover {
    background: rgba(6, 182, 212, 0.12);
    border-color: var(--accent-cyan);
    color: var(--text-primary);
    transform: translateY(-2px);
}

/* Certifications & Education */
.cert-card-modern {
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-md);
    padding: 20px;
    display: flex;
    align-items: center;
    gap: 16px;
    height: 100%;
    transition: var(--transition);
}
.cert-card-modern:hover {
    border-color: var(--accent-amber);
    background: var(--bg-card-hover);
    transform: translateY(-3px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.4);
}
.cert-icon-box {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: rgba(245, 158, 11, 0.1);
    border: 1px solid rgba(245, 158, 11, 0.3);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--accent-amber);
    font-size: 1.25rem;
    flex-shrink: 0;
}
.cert-info h4 {
    font-size: 1rem;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0 0 4px 0;
}
.cert-info p {
    font-size: 0.82rem;
    color: var(--text-muted);
    margin: 0;
}

/* Partners & Organizations Grid */
.partner-badge-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 12px;
}
.partner-badge-card {
    background: rgba(15, 23, 42, 0.6);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-md);
    padding: 16px 10px;
    text-align: center;
    transition: var(--transition);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 85px;
}
.partner-badge-card:hover {
    border-color: var(--accent-emerald);
    background: var(--bg-card-hover);
    transform: translateY(-3px);
}
.partner-badge-name {
    font-size: 0.88rem;
    font-weight: 700;
    color: var(--text-primary);
    margin-bottom: 2px;
}
.partner-badge-sub {
    font-size: 0.72rem;
    color: var(--text-dim);
}

/* Professional References Grid */
.ref-card-modern {
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-md);
    padding: 22px;
    height: 100%;
    transition: var(--transition);
}
.ref-card-modern:hover {
    border-color: var(--accent-emerald);
    background: var(--bg-card-hover);
    transform: translateY(-3px);
}
.ref-name {
    font-size: 1.1rem;
    font-weight: 800;
    color: var(--text-primary);
    margin: 0 0 4px 0;
}
.ref-title {
    font-size: 0.84rem;
    color: var(--accent-emerald);
    font-weight: 600;
    margin-bottom: 10px;
}
.ref-phone {
    font-size: 0.88rem;
    color: var(--text-secondary);
    display: inline-flex;
    align-items: center;
    gap: 6px;
    text-decoration: none;
    transition: var(--transition);
}
.ref-phone:hover {
    color: var(--accent-emerald);
}

/* Modern Contact Form */
.form-control-cyber {
    width: 100%;
    background: rgba(11, 17, 32, 0.75);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-sm);
    padding: 12px 16px;
    color: var(--text-primary);
    font-size: 0.92rem;
    font-family: var(--font-main);
    transition: var(--transition);
    outline: none;
}
.form-control-cyber:focus {
    border-color: var(--accent-emerald);
    box-shadow: 0 0 15px rgba(16, 185, 129, 0.2);
    background: rgba(15, 23, 42, 0.9);
}
.form-control-cyber::placeholder {
    color: var(--text-dim);
}

/* Modern Footer */
.modern-footer {
    background: #04060d;
    border-top: 1px solid var(--border-subtle);
    padding: 30px 0;
    margin-top: 60px;
    position: relative;
    z-index: 1;
}

/* RTL Helpers */
html[dir="rtl"] {
    text-align: right;
}
html[dir="rtl"] .text-start {
    text-align: right !important;
}
html[dir="rtl"] .text-end {
    text-align: left !important;
}
html[dir="rtl"] .ms-auto {
    margin-right: auto !important;
    margin-left: 0 !important;
}
html[dir="rtl"] .me-auto {
    margin-left: auto !important;
    margin-right: 0 !important;
}

/* Responsive Breakpoints */
@media (max-width: 991px) {
    .stats-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .partner-badge-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .hero-title-gradient {
        font-size: 2.1rem;
    }
    .hero-card-main {
        padding: 24px;
    }
    .profile-sidebar-card {
        position: static;
        margin-bottom: 30px;
    }
    .nav-links-desktop {
        display: none;
    }
}

@media (max-width: 576px) {
    .stats-grid {
        grid-template-columns: 1fr;
    }
    .partner-badge-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .hero-title-gradient {
        font-size: 1.8rem;
    }
    .hero-avatar-img {
        width: 150px;
        height: 150px;
    }
    .timeline-modern {
        padding-left: 20px;
    }
    html[dir="rtl"] .timeline-modern {
        padding-right: 20px;
    }
}