/* _content/kaleidoprompt.Frontend.Web/Components/Layout/Footer.razor.rz.scp.css */
.footer[b-qukp2iqtc9] {
    background-color: #1e1e1e;
    z-index: 1;
}

.footer-links a[b-qukp2iqtc9] {
    color: #a1a1a1;
    text-decoration: none;
}

    .footer-links a:hover[b-qukp2iqtc9] {
        color: #ffffff;
        text-decoration: underline;
    }

.footer-info p[b-qukp2iqtc9] {
    color: #a1a1a1;
}

.social-media a[b-qukp2iqtc9] {
    color: #a1a1a1;
}

    .social-media a:hover[b-qukp2iqtc9] {
        color: #ffffff;
    }
/* _content/kaleidoprompt.Frontend.Web/Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-yp43kfvurh] {
    position: relative;
    display: flex;
    flex-direction: column;
    background-color: var(--kaleidoprompt-dark-bg-color);
}

main[b-yp43kfvurh] {
    flex: 1;
}




#blazor-error-ui[b-yp43kfvurh] {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-yp43kfvurh] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* _content/kaleidoprompt.Frontend.Web/Components/Layout/NavMenuChat.razor.rz.scp.css */

.top-row[b-14tb10wufi] {
    height: 3.5rem;
}

.navbar-brand[b-14tb10wufi] {
    font-size: 1.1rem;
}

.navbar-brand img[b-14tb10wufi] {
    margin-right: 8px; /* Add space between the image and the text */
    vertical-align: middle; /* Align the image with the text */
    margin-top: -2px; /* Adjust the vertical alignment */
}

/* Mobile styles */
@media only screen and (max-width: 768px) {
    .navbar-brand img[b-14tb10wufi] {
        content: url('images/kp-logo.svg');
    }
}

/* _content/kaleidoprompt.Frontend.Web/Components/Layout/NavMenuLanding.razor.rz.scp.css */
.top-row[b-fb1xb3et5j] {
    height: 3.5rem;
    background-color: var(--kaleidoprompt-dark-bg-color);
}

    /* Ensure no wrapping in the .top-row container */
    .top-row .container-fluid[b-fb1xb3et5j] {
        /* flex-nowrap ensures items stay on one line */
        flex-wrap: nowrap !important;
    }

.navbar-brand[b-fb1xb3et5j] {

}

    .navbar-brand img[b-fb1xb3et5j] {
        margin-top: -2px; /* Adjust vertical alignment */
        margin-right: 1rem;
    }


/* Slightly smaller link text */
.link-wrapper .nav-link[b-fb1xb3et5j] {
    font-size: 0.9rem;
    text-decoration: none;
    color: #ffffff;
}

    .link-wrapper .nav-link:hover[b-fb1xb3et5j] {
        color: #ddd;
        text-decoration: underline;
    }


/* Button Wrapper */
.button-wrapper[b-fb1xb3et5j] {
    margin: 0rem 0rem 0rem 0rem;
    gap: 1rem;
}


/* Original Button Styles */
.original-button-try[b-fb1xb3et5j] {
    position: relative;
    z-index: 1;
    border: 0px solid transparent;
    border-radius: 10px;
    background-color: transparent;
    color: white;
    padding: 5px 10px;
    cursor: pointer;
    font-size: 1em;
    width: 120px;
    overflow: hidden; /* Prevent pseudo-elements from overflowing */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 1);
    transition: transform 0.1s, box-shadow 0.1s; /* Add transition for smooth movement */
}

    .original-button-try[b-fb1xb3et5j]::before {
        content: '';
        position: absolute;
        top: -2px; /* Adjust to match the border width */
        left: -2px;
        right: -2px;
        bottom: -2px;
        background: linear-gradient(270deg, #E7048C, #F9B826, #FB429D, #E7048C, #F9B826, #FB429D);
        background-size: 400% 400%;
        animation: gradientAnimation-b-fb1xb3et5j 13s ease infinite;
        z-index: -2; /* Place behind the button content and after element */
    }

    .original-button-try[b-fb1xb3et5j]::after {
        content: '';
        position: absolute;
        top: 1px; /* Adjust to match the border width */
        left: 1px;
        right: 1px;
        bottom: 1px;
        border-radius: 9px; /* Slightly smaller to fit inside the border */
        background-color: var(--kaleidoprompt-dark-bg-color);
        transition: background-color 0.3s, border-color 0.3s;
        z-index: -1; /* Place between the before element and button content */
    }

/* Keyframes for the gradient animation */
@keyframes gradientAnimation-b-fb1xb3et5j {
    0% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}

.original-button-try:hover[b-fb1xb3et5j]::after {
    background-color: #2b2b2c;
}

.original-button-try:active[b-fb1xb3et5j] {
    transform: translateY(2px);
    box-shadow: 0 2px 3px rgba(0, 0, 0, 0.9); /* Adjust shadow to simulate pressing */
}

    .original-button-try:active[b-fb1xb3et5j]::after {
        background-color: #424243;
    }


.original-button[b-fb1xb3et5j] {
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 10px;
    background-color: transparent;
    color: white;
    padding: 5px 10px;
    cursor: pointer;
    font-size: 1em;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 1);
    transition: transform 0.1s, box-shadow 0.1s; /* Add transition for smooth movement */
    width: 120px;
}

    .original-button:hover[b-fb1xb3et5j] {
        background-color: #2b2b2c;
        transition: background-color 0.3s, border-color 0.3s;
    }

    .original-button:active[b-fb1xb3et5j] {
        transform: translateY(2px);
        box-shadow: 0 2px 3px rgba(0, 0, 0, 0.9); /* Adjust shadow to simulate pressing */
        background-color: #424243;
    }


/* Mobile styles */
@media only screen and (max-width: 920px) {

    .link-wrapper[b-fb1xb3et5j] {
        display: none !important;
    }

}

@media only screen and (max-width: 768px) {

    .navbar-brand img[b-fb1xb3et5j] {
        content: url('images/kp-logo.svg');
    }

}
/* _content/kaleidoprompt.Frontend.Web/Components/Modal/Dialogs/AddOrEditBotProfileDialog.razor.rz.scp.css */
.dialog-box[b-2rxxwz80ol] {
    background-color: rgb(47, 47, 47);
    color: white;
    overflow: hidden; /* Ensures no overflow */
}

.input-elements[b-2rxxwz80ol] {
    display: flex;
    gap: 2rem;
    flex-direction: row;
    justify-content: end;
}


/* Original Button Styles */
.original-button[b-2rxxwz80ol] {
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 10px;
    background-color: transparent;
    color: white;
    padding: 5px 10px;
    cursor: pointer;
    font-size: 1em;
    transition: background-color 0.3s, border-color 0.3s;
    max-width: 200px;
}

    .original-button:hover[b-2rxxwz80ol] {
        background-color: rgba(255, 255, 255, 0.1);
    }

    .original-button:active[b-2rxxwz80ol] {
        background-color: rgba(255, 255, 255, 0.2);
    }

.profile-name-textbox-style[b-2rxxwz80ol] {
    background-color: rgba(255, 255, 255, 0.1);
    padding: 2px 8px;
    border-radius: 4px;
    color: white;
    font-size: 0.9em;
    width: 100%;
    resize: none;
}

.system-message-textbox-style[b-2rxxwz80ol] {
    background-color: rgba(255, 255, 255, 0.1);
    padding: 2px 8px;
    border-radius: 4px;
    color: white;
    font-size: 0.9em;
    width: 100%;
    height: 200px;
    resize: none; /* remove if you want to allow manual resizing */
}

/* Additional classes for sliders */
.slider-column[b-2rxxwz80ol] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-bottom: 1rem;
}

.slider-label[b-2rxxwz80ol] {
    font-weight: bold;
    margin-bottom: 0.5rem;
}

.slider-value[b-2rxxwz80ol] {
    margin-top: 0.25rem;
    font-size: 0.9em;
    color: #ccc;
}

.slider-style[b-2rxxwz80ol] {
    width: 100%;
    margin: 0;
}

/* WebKit slider thumb */
.form-range.slider-style[b-2rxxwz80ol]::-webkit-slider-thumb {
    background-color: rgb(249, 184, 38); /* Change to desired knob color */
}

/* Firefox slider thumb */
.form-range.slider-style[b-2rxxwz80ol]::-moz-range-thumb {
    background-color: rgb(249, 184, 38); /* Change to desired knob color */
}

/* IE/Edge slider thumb */
.form-range.slider-style[b-2rxxwz80ol]::-ms-thumb {
    background-color: rgb(249, 184, 38); /* Change to desired knob color */
}

/* Add a highlight on hover */
.form-range.slider-style[b-2rxxwz80ol]::-webkit-slider-thumb:hover {
    box-shadow: 0 0 0 3px rgba(249, 184, 38, 0.4);
    cursor: pointer;
}

.form-range.slider-style[b-2rxxwz80ol]::-moz-range-thumb:hover {
    box-shadow: 0 0 0 3px rgba(249, 184, 38, 0.4);
    cursor: pointer;
}

.form-range.slider-style[b-2rxxwz80ol]::-ms-thumb:hover {
    box-shadow: 0 0 0 3px rgba(249, 184, 38, 0.4);
    cursor: pointer;
}

/* OPTIONAL: Make disabled sliders visibly greyed out */
.form-range.slider-style:disabled[b-2rxxwz80ol] {
    opacity: 0.4;
    cursor: not-allowed;
}

/* Small red text under input */
.small-error-message[b-2rxxwz80ol] {
    color: #ff4f4f; /* or any red-ish color you prefer */
    font-size: 0.75rem;
    margin: 1px 0px 0px 5px;
    height: 0rem;
}
/* _content/kaleidoprompt.Frontend.Web/Components/Modal/Dialogs/DeleteAccountDialog.razor.rz.scp.css */

.dialog-box[b-v6mqfk1c69] {
    background-color: rgb(47, 47, 47);
    color: white;
    padding: 20px;
    border-radius: 10px;
    height: 230px;
    overflow: hidden; /* Ensures no overflow */
}

.input-group[b-v6mqfk1c69] {
    display: flex;
    flex-direction: column;
    align-items: center;
}

    .input-group span[b-v6mqfk1c69] {
        text-align: center;
        margin-bottom: 25px;
    }

.input-elements[b-v6mqfk1c69] {
    display: flex;
    gap: 4rem;
}

/* Button Wrapper */
.button-wrapper[b-v6mqfk1c69] {
    display: flex;
    justify-content: flex-end;
}

/* Original Button Styles */
.original-button[b-v6mqfk1c69] {
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 10px;
    background-color: transparent;
    color: white;
    padding: 10px 20px;
    cursor: pointer;
    font-size: 1em;
    transition: background-color 0.3s, border-color 0.3s;
    width: 100%;
    max-width: 200px;
}

    .original-button:hover[b-v6mqfk1c69] {
        background-color: rgba(255, 255, 255, 0.1);
    }

    .original-button:active[b-v6mqfk1c69] {
        background-color: rgba(255, 255, 255, 0.2);
    }

/* Delete Button Specific Styles */
.delete-button[b-v6mqfk1c69] {
    border-color: rgba(255, 0, 0, 0.5);
}

    .delete-button:hover[b-v6mqfk1c69] {
        background-color: rgba(255, 0, 0, 0.1);
    }

    .delete-button:active[b-v6mqfk1c69] {
        background-color: rgba(255, 0, 0, 0.2);
    }

#progress-container[b-v6mqfk1c69] {
    margin-top: 25px;
    width: 100%;
    display: flex;
    align-items: center;
    flex-direction: column;
}

.progress-bar[b-v6mqfk1c69] {
    width: 100%;
    background-color: #ddd;
    border-radius: 10px;
    overflow: hidden;
    height: 20px;
    margin-bottom: 5px;
}

.progress-fill[b-v6mqfk1c69] {
    height: 100%;
    background-color: #F9B826;
    width: 0%;
    transition: width 0.3s;
}

#progress-container span[b-v6mqfk1c69] {
    font-size: 14px;
}
/* _content/kaleidoprompt.Frontend.Web/Components/Modal/Dialogs/DeleteBotProfileDialog.razor.rz.scp.css */

.dialog-box[b-d97vpjcbag] {
    background-color: rgb(47, 47, 47);
    color: white;
    padding: 20px;
    border-radius: 10px;
    height: 250px;
    overflow: hidden; /* Ensures no overflow */
}

.input-group[b-d97vpjcbag] {
    display: flex;
    flex-direction: column;
    align-items: center;
}

    .input-group span[b-d97vpjcbag] {
        text-align: center;
        margin-bottom: 25px;
    }

.input-elements[b-d97vpjcbag] {
    display: flex;
    gap: 4rem;
}

/* Button Wrapper */
.button-wrapper[b-d97vpjcbag] {
    display: flex;
    justify-content: flex-end;
}

/* Original Button Styles */
.original-button[b-d97vpjcbag] {
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 10px;
    background-color: transparent;
    color: white;
    padding: 10px 20px;
    cursor: pointer;
    font-size: 1em;
    transition: background-color 0.3s, border-color 0.3s;
    width: 100%;
    max-width: 200px;
}

    .original-button:hover[b-d97vpjcbag] {
        background-color: rgba(255, 255, 255, 0.1);
    }

    .original-button:active[b-d97vpjcbag] {
        background-color: rgba(255, 255, 255, 0.2);
    }

/* Delete Button Specific Styles */
.delete-button[b-d97vpjcbag] {
    border-color: rgba(255, 0, 0, 0.5);
}

    .delete-button:hover[b-d97vpjcbag] {
        background-color: rgba(255, 0, 0, 0.1);
    }

    .delete-button:active[b-d97vpjcbag] {
        background-color: rgba(255, 0, 0, 0.2);
    }

#progress-container[b-d97vpjcbag] {
    margin-top: 25px;
    width: 100%;
    display: flex;
    align-items: center;
    flex-direction: column;
}

.progress-bar[b-d97vpjcbag] {
    width: 100%;
    background-color: #ddd;
    border-radius: 10px;
    overflow: hidden;
    height: 20px;
    margin-bottom: 5px;
}

.progress-fill[b-d97vpjcbag] {
    height: 100%;
    background-color: #F9B826;
    width: 0%;
    transition: width 0.3s;
}

#progress-container span[b-d97vpjcbag] {
    font-size: 14px;
}


.profile-textbox-style[b-d97vpjcbag] {
    background-color: rgba(255, 255, 255, 0.1);
    padding: 2px 8px;
    border-radius: 4px;
    color: white;
    font-size: 0.9em;
}
/* _content/kaleidoprompt.Frontend.Web/Components/Modal/Dialogs/DeleteThreadDialog.razor.rz.scp.css */

.dialog-box[b-terlql4ymt] {
    background-color: rgb(47, 47, 47);
    color: white;
    padding: 20px;
    border-radius: 10px;
    height: 270px;
    overflow: hidden; /* Ensures no overflow */
}

.input-group[b-terlql4ymt] {
    display: flex;
    flex-direction: column;
    align-items: center;
}

    .input-group span[b-terlql4ymt] {
        text-align: center;
        margin-bottom: 25px;
    }

.input-elements[b-terlql4ymt] {
    display: flex;
    gap: 4rem;
}

/* Button Wrapper */
.button-wrapper[b-terlql4ymt] {
    display: flex;
    justify-content: flex-end;
}

/* Original Button Styles */
.original-button[b-terlql4ymt] {
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 10px;
    background-color: transparent;
    color: white;
    padding: 10px 20px;
    cursor: pointer;
    font-size: 1em;
    transition: background-color 0.3s, border-color 0.3s;
    width: 100%;
    max-width: 200px;
}

    .original-button:hover[b-terlql4ymt] {
        background-color: rgba(255, 255, 255, 0.1);
    }

    .original-button:active[b-terlql4ymt] {
        background-color: rgba(255, 255, 255, 0.2);
    }

/* Delete Button Specific Styles */
.delete-button[b-terlql4ymt] {
    border-color: rgba(255, 0, 0, 0.5);
}

    .delete-button:hover[b-terlql4ymt] {
        background-color: rgba(255, 0, 0, 0.1);
    }

    .delete-button:active[b-terlql4ymt] {
        background-color: rgba(255, 0, 0, 0.2);
    }

#progress-container[b-terlql4ymt] {
    margin-top: 25px;
    width: 100%;
    display: flex;
    align-items: center;
    flex-direction: column;
}

.progress-bar[b-terlql4ymt] {
    width: 100%;
    background-color: #ddd;
    border-radius: 10px;
    overflow: hidden;
    height: 20px;
    margin-bottom: 5px;
}

.progress-fill[b-terlql4ymt] {
    height: 100%;
    background-color: #F9B826;
    width: 0%;
    transition: width 0.3s;
}

#progress-container span[b-terlql4ymt] {
    font-size: 14px;
}



.thread-textbox-style[b-terlql4ymt] {
    background-color: rgba(255, 255, 255, 0.1);
    padding: 2px 8px;
    border-radius: 4px;
    color: white;
    font-size: 0.9em;
}
/* _content/kaleidoprompt.Frontend.Web/Components/Modal/Dialogs/DeleteUserDataDialog.razor.rz.scp.css */

.dialog-box[b-aqpjd0bjmi] {
    background-color: rgb(47, 47, 47);
    color: white;
    padding: 20px;
    border-radius: 10px;
    height: 210px;
    overflow: hidden; /* Ensures no overflow */
}

.input-group[b-aqpjd0bjmi] {
    display: flex;
    flex-direction: column;
    align-items: center;
}

    .input-group span[b-aqpjd0bjmi] {
        text-align: center;
        margin-bottom: 25px;
    }

.input-elements[b-aqpjd0bjmi] {
    display: flex;
    gap: 4rem;
}

/* Button Wrapper */
.button-wrapper[b-aqpjd0bjmi] {
    display: flex;
    justify-content: flex-end;
}

/* Original Button Styles */
.original-button[b-aqpjd0bjmi] {
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 10px;
    background-color: transparent;
    color: white;
    padding: 10px 20px;
    cursor: pointer;
    font-size: 1em;
    transition: background-color 0.3s, border-color 0.3s;
    width: 100%;
    max-width: 200px;
}

    .original-button:hover[b-aqpjd0bjmi] {
        background-color: rgba(255, 255, 255, 0.1);
    }

    .original-button:active[b-aqpjd0bjmi] {
        background-color: rgba(255, 255, 255, 0.2);
    }

/* Delete Button Specific Styles */
.delete-button[b-aqpjd0bjmi] {
    border-color: rgba(255, 0, 0, 0.5);
}

    .delete-button:hover[b-aqpjd0bjmi] {
        background-color: rgba(255, 0, 0, 0.1);
    }

    .delete-button:active[b-aqpjd0bjmi] {
        background-color: rgba(255, 0, 0, 0.2);
    }


#progress-container[b-aqpjd0bjmi] {
    margin-top: 25px;
    width: 100%;
    display: flex;
    align-items: center;
    flex-direction: column;
}

.progress-bar[b-aqpjd0bjmi] {
    width: 100%;
    background-color: #ddd;
    border-radius: 10px;
    overflow: hidden;
    height: 20px;
    margin-bottom: 5px;
}

.progress-fill[b-aqpjd0bjmi] {
    height: 100%;
    background-color: #F9B826;
    width: 0%;
    transition: width 0.3s;
}

#progress-container span[b-aqpjd0bjmi] {
    font-size: 14px;
}
/* _content/kaleidoprompt.Frontend.Web/Components/Modal/Dialogs/ErrorMessageDialog.razor.rz.scp.css */
.dialog-box[b-7wlslb0913] {
    background-color: rgb(47, 47, 47);
    color: white;
    padding: 20px;
    border-radius: 10px;
    height: 200px;
    overflow: hidden; /* Ensures no overflow */
}

.input-group[b-7wlslb0913] {
    display: flex;
    margin-top: 0px;
    justify-content: space-between; /* Align label to the left and input elements to the right */
    width: 100%; /* Ensure it takes full width */
}

.input-elements[b-7wlslb0913] {
    display: flex;
    justify-content: flex-end; /* Align items to the right */
    padding-top: 20px;
    width: 100%;
}


.button-wrapper button[b-7wlslb0913] {
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 10px;
    background-color: transparent;
    color: white;
    padding: 5px 10px;
    cursor: pointer;
    box-shadow: none; /* No shadow */
}

    .button-wrapper button:focus[b-7wlslb0913], .button-wrapper button:active[b-7wlslb0913] {
        outline: none; /* No outline on focus or active */
        box-shadow: none; /* No shadow on focus or active */
    }
/* _content/kaleidoprompt.Frontend.Web/Components/Modal/Dialogs/FundsDialog.razor.rz.scp.css */
.dialog-box[b-fq0w249exb] {
    background-color: rgb(47, 47, 47);
    color: white;
    padding: 20px;
    border-radius: 10px;
}

    .dialog-box div[b-fq0w249exb] {
        display: flex;
        align-items: center;
    }

    .dialog-box .current-balance-value[b-fq0w249exb] {
        margin-left: auto;
        text-align: right;
    }

.positive-balance[b-fq0w249exb] {
    color: rgb(86, 217, 114);
}

.negative-balance[b-fq0w249exb] {
    color: red;
}

.deposit-history-title[b-fq0w249exb] {
    margin-top: 30px;
    font-weight: bold;
}

.table-container[b-fq0w249exb] {
    overflow-y: hidden;
    margin-top: 10px;
    border-radius: 10px;
    background-color: rgba(255, 255, 255, 0.1);
    display: flex;
    flex-direction: column;
}

.table-style[b-fq0w249exb] {
    width: 100%;
    margin: 0;
}

.tbody-container[b-fq0w249exb] {
    overflow-y: auto;
    max-height: 130px;
    width: 100%;
    display: flex;
    flex-direction: column;
}

.table-style th[b-fq0w249exb], .table-style td[b-fq0w249exb] {
    padding: 0px 30px 5px 20px;
    color: white;
    font-size: 0.9em;
}

.table-style th[b-fq0w249exb] {
    background-color: rgba(255, 255, 255, 0.1);
    top: 0;
    z-index: 1;
}

th.date[b-fq0w249exb] {
    text-align: left;
}

th.amount[b-fq0w249exb] {
    text-align: right;
    padding-right: 30px;
}

.parent-container[b-fq0w249exb] {
    position: absolute;
    right: 0;
    padding: 3px 25px 0px 0px;
}

.pricing-details-link[b-fq0w249exb] {
    font-size: 0.775em;
    color: white;
    text-decoration: underline;
}

/* Styles for Deposit Buttons */

.deposit-buttons-card[b-fq0w249exb] {
    background-color: rgba(255, 255, 255, 0.05);
    padding: 15px 15px 10px 15px;
    border-radius: 10px;
    margin-top: 40px;
}

.deposit-buttons-group[b-fq0w249exb] {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.deposit-title[b-fq0w249exb] {
    margin-bottom: 10px;
    font-size: 1.1em;
    font-weight: bold;
    text-align: left;
    width: 100%;
}

.buttons-container[b-fq0w249exb] {
    width: 100%;
}

.deposit-button-wrapper[b-fq0w249exb] {
    flex: 0 0 auto;
    width: 25%;
    margin: 0px;
    padding: 0px 10px 0px 10px;
}

    .deposit-button-wrapper:first-child[b-fq0w249exb] {
        padding-left: 0; /* Remove padding from the leftmost element */
    }

    .deposit-button-wrapper:last-child[b-fq0w249exb] {
        padding-right: 0; /* Remove padding from the rightmost element */
    }

.deposit-button[b-fq0w249exb] {
    width: 100%;
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 10px;
    background-color: transparent;
    color: white;
    padding: 8px 0;
    cursor: pointer;
    font-size: 1em;
    transition: background-color 0.3s, border-color 0.3s, color 0.3s;
    text-align: center;
}

    .deposit-button:hover[b-fq0w249exb] {
        background-color: rgba(249, 184, 38, 0.45);
        color: black;
        font-weight: bold;
    }

    .deposit-button:active[b-fq0w249exb] {
        background-color: rgba(249, 184, 38, 0.9);
    }

.bonus-text[b-fq0w249exb] {
    margin-top: 5px;
    font-size: 0.8em;
    color: #F9B826;
    text-align: center;
    width: 100%;
    min-height: 25px;
}
/* _content/kaleidoprompt.Frontend.Web/Components/Modal/Dialogs/RenameThreadDialog.razor.rz.scp.css */
.dialog-box[b-acboennnir] {
    background-color: rgb(47, 47, 47);
    color: white;
    height: 175px;
    overflow: hidden; /* Ensures no overflow */
}

.input-elements[b-acboennnir] {
    display: flex;
    gap: 4rem;
    flex-direction: row;
    align-items: center;
    justify-content:center;
}

/* Button Wrapper */
.button-wrapper[b-acboennnir] {
    display: flex;
    justify-content: flex-end;
}

/* Original Button Styles */
.original-button[b-acboennnir] {
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 10px;
    background-color: transparent;
    color: white;
    padding: 5px 10px;
    cursor: pointer;
    font-size: 1em;
    transition: background-color 0.3s, border-color 0.3s;
    width: 100%;
    max-width: 200px;
}

    .original-button:hover[b-acboennnir] {
        background-color: rgba(255, 255, 255, 0.1);
    }

    .original-button:active[b-acboennnir] {
        background-color: rgba(255, 255, 255, 0.2);
    }


.thread-textbox-style[b-acboennnir] {
    background-color: rgba(255, 255, 255, 0.1);
    padding: 2px 8px;
    border-radius: 4px;
    color: white;
    font-size: 0.9em;
    width: 100%;
    min-height: 50px;
    resize: none; /* remove if you want to allow manual resizing */
}

/* _content/kaleidoprompt.Frontend.Web/Components/Modal/Dialogs/SettingsDialog.razor.rz.scp.css */

/* Dialog Box */
.dialog-box[b-p91yerglza] {
    background-color: rgb(47, 47, 47);
    overflow-y: hidden;
    box-sizing: border-box;
}

/* Button Wrapper */
.button-wrapper[b-p91yerglza] {
    display: flex;
    justify-content: flex-end;
}

/* Original Button Styles */
.original-button[b-p91yerglza] {
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 10px;
    background-color: transparent;
    color: white;
    padding: 5px 10px;
    cursor: pointer;
    font-size: 1em;
    transition: background-color 0.3s, border-color 0.3s;
    width: 100%;
    max-width: 200px;
}

    .original-button:hover[b-p91yerglza] {
        background-color: rgba(255, 255, 255, 0.1);
    }

    .original-button:active[b-p91yerglza] {
        background-color: rgba(255, 255, 255, 0.2);
    }

/* Delete Button Specific Styles */
.delete-button[b-p91yerglza] {
    border-color: rgba(255, 0, 0, 0.5);
}

    .delete-button:hover[b-p91yerglza] {
        background-color: rgba(255, 0, 0, 0.1);
    }

    .delete-button:active[b-p91yerglza] {
        background-color: rgba(255, 0, 0, 0.2);
    }

/* User Email Display */
.user-style[b-p91yerglza] {
    background-color: rgba(255, 255, 255, 0.1);
    padding: 2px 8px;
    font-family: "Courier New";
    border-radius: 4px;
    color: white;
    font-size: 0.9em;
    text-align: right;
}

/* Responsive Adjustments */
@media (min-width: 768px) {
    .original-button[b-p91yerglza] {
        width: auto;
    }
}

@media (max-width: 768px) {
    .button-wrapper[b-p91yerglza] {
        margin-top: 10px;
    }
}
/* _content/kaleidoprompt.Frontend.Web/Components/Modal/Dialogs/UsageDialog.razor.rz.scp.css */
.dialog-box[b-3upx6dooff] {
    background-color: rgb(47, 47, 47);
    color: white;
    padding: 0px 0px 10px 0px;
    border-radius: 10px;
    overflow: hidden;
}

.histogram-container[b-3upx6dooff] {
    width: 100%; /* Takes up the full width of its parent container */
    margin: 0px auto; /* Adds space above and below the histogram, and centers it horizontally */
    padding: 5px; /* Adds some padding inside the container */
    background-color: transparent; /* Light background color to distinguish the histogram area */
    border-radius: 10px; /* Rounds the corners of the container */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3); /* Adds a subtle shadow for depth */
    border: 1px solid rgba(255, 255, 255, 0.1); /* Adds a border with a slight transparency */
}

    .histogram-container canvas[b-3upx6dooff] {
        display: block;
        width: 100%;
        height: auto;
    }

    /* Reintroduce spacing between the two histograms */
    .histogram-container.top[b-3upx6dooff] {
        margin-bottom: 16px;
    }

    .histogram-container.bottom[b-3upx6dooff] {
        margin-top: 16px;
    }

/* The wrapper for both histograms */
.histograms-wrapper[b-3upx6dooff] {
    position: relative;
}

/* Navigation FAB buttons: absolutely positioned so they overlay the histograms
   (centered vertically in the wrapper) */
.navigation-buttons[b-3upx6dooff] {
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    justify-content: space-between;
    pointer-events: all;
}

/* Circular FAB style for the navigation buttons */
.nav-button[b-3upx6dooff] {
    background: rgba(0, 0, 0, 0.6);
    color: white;
    border: none;
    width: 40px;
    height: 40px;
    font-size: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    border-radius: 50%;
}

    .nav-button:disabled[b-3upx6dooff] {
        opacity: 0.4;
        cursor: not-allowed;
    }

.switch-label[b-3upx6dooff] {
    align-items: center;
    justify-content: center;
    padding: 0px 0px 0px 10px;
    height: 28px;
    line-height: 25px; /* Ensures the text is vertically centered */
    text-align: center; /* Centers text horizontally */
}

/* The switch - the box around the slider */
.switch[b-3upx6dooff] {
    position: relative;
    display: inline-block;
    width: 55px;
    height: 28px;
}

    /* Hide default HTML checkbox */
    .switch input[b-3upx6dooff] {
        opacity: 0;
        width: 0;
        height: 0;
    }

/* The slider */
.slider[b-3upx6dooff] {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #7f7f7f;
    -webkit-transition: .4s;
    transition: .4s;
}

    .slider[b-3upx6dooff]:before {
        position: absolute;
        content: "";
        height: 20px;
        width: 20px;
        left: 4px;
        bottom: 4px;
        background-color: white;
        -webkit-transition: .4s;
        transition: .4s;
    }

input:checked + .slider[b-3upx6dooff] {
    background-color: #F9B826;
}

input:focus + .slider[b-3upx6dooff] {
    box-shadow: 0 0 1px #F9B826;
}

input:checked + .slider[b-3upx6dooff]:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
}

/* Rounded sliders */
.slider[b-3upx6dooff] {
    border-radius: 34px;
}

    .slider[b-3upx6dooff]:before {
        border-radius: 50%;
    }


.table-container[b-3upx6dooff] {
    font-size: smaller;
    width: 100%;
    margin: 20px auto;
    padding: 0px;
    height: 100px;
}

.usage-table[b-3upx6dooff] {
    width: 100%;
    border-collapse: collapse;
}

    .usage-table td[b-3upx6dooff] {
        text-align: left;
        padding: 5px;
    }

    .usage-table tr td:first-child[b-3upx6dooff] {
        text-align: left;
        width: 70%; /* Adjust this value to allocate space for the label */
    }

    .usage-table tr td:last-child[b-3upx6dooff] {
        text-align: right;
        width: 30%; /* Adjust this value to allocate space for the value */
    }

.table-divider[b-3upx6dooff] {
    border-top: 1px solid rgba(255, 255, 255, 0.2); /* Semi-transparent black border */
    padding: 0; /* Remove padding from the divider row */
    height: 1px; /* Ensures the divider takes minimal space */
}
/* _content/kaleidoprompt.Frontend.Web/Components/Modal/Modal.razor.rz.scp.css */

.modal-dialog-styling[b-ued3szdn8g] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 100dvh; /* Use full viewport height to center content */
    margin: 0 auto; /* Center content horizontally */
}

.modal-content-styling[b-ued3szdn8g] {
    background-color: rgb(47, 47, 47);
    border-radius: 10px;
    color: white;
}

.modal-body-styling[b-ued3szdn8g] {
    color: white;
}

.close-button[b-ued3szdn8g] {
    cursor: pointer;
    border: none;
    background: none;
    color: transparent;
    text-shadow: 0 0 0 white;
    padding: 0px 6px 0px 6px;
    margin: 4px 0px 0px 0px;
}

    .close-button[b-ued3szdn8g]::selection {
        background: transparent; /* No background color when selected */
        color: transparent; /* No color when selected */
        text-shadow: 0 0 0 white;
    }


.modal-header-custom[b-ued3szdn8g] {
    margin-bottom: 0; /* Reduce or remove the bottom margin */
    padding: 1rem 0.1rem 0.5rem 0.5rem;
}



/* Media query for height-based scaling */
@media (max-height: 850px) {
    .modal-dialog-styling[b-ued3szdn8g] {
        transition: none;
        transform: scale(0.9);
        /* Adjust layout dimensions to match the visual scale */
        height: 100dvh;
    }
}
/* _content/kaleidoprompt.Frontend.Web/Components/Modules/AddModelButtonDisplay.razor.rz.scp.css */
.navbar-toggler[b-73s3txazm5] {
    appearance: none;
    cursor: pointer;
    width: 9rem;
    height: 2.25rem;
    color: white;
    position: absolute;
    top: 0.65rem;
    right: 5rem;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-size: 1rem;
    background-position: 13px 2px; /* Adjust as needed */
    background-size: contain; /* Adjust as needed */
    transition: background-color 0.3s, border-color 0.3s;
}

    .navbar-toggler[b-73s3txazm5]::before {
        content: "+ Add model";
        color: white;
        font-size: 0.95rem;
    }

    .navbar-toggler:hover[b-73s3txazm5] {
        background-color: rgba(255, 255, 255, 0.1);
    }

    .navbar-toggler:checked[b-73s3txazm5] {
        background-color: rgba(255, 255, 255, 0.2);
    }

.custom-checkbox[b-73s3txazm5] {
    border: 1px solid rgba(255, 255, 255, 0.2);
}

    .custom-checkbox:focus[b-73s3txazm5] {
        outline: none;
        box-shadow: none;
    }
/* _content/kaleidoprompt.Frontend.Web/Components/Modules/AddModelDropdownDisplay.razor.rz.scp.css */
.model-dropdown[b-4xawh1mbsj] {
    display: none;
}

    .model-dropdown.active[b-4xawh1mbsj] {
        display: block;
        width: 250px;
        background: rgb(47, 47, 47);
        position: fixed;
        z-index: 1000;
        border-radius: 10px;
        overflow-y: auto;
        right: 5rem;
        max-height: 70dvh;
    }

.nav-item[b-4xawh1mbsj] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}

    .nav-item:first-of-type[b-4xawh1mbsj] {
        padding-top: 0.5rem;
    }

    .nav-item:last-of-type[b-4xawh1mbsj] {
        padding-bottom: 0.5rem;
    }

[b-4xawh1mbsj] .nav-link {
    color: #d7d7d7;
    border-radius: 4px;
    height: 2rem;
    display: flex;
    align-items: center;
    line-height: 3rem;
    cursor: pointer;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}

    [b-4xawh1mbsj] .nav-link:hover {
        background-color: rgba(255,255,255,0.1);
        color: white;
    }

.bi[b-4xawh1mbsj] {
    display: inline-block;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    top: -1px;
    background-size: cover;
}

.bi-list-nested-chatgpt[b-4xawh1mbsj] {
    background-image: url("/images/chatgpt-icon.svg");
}

.bi-list-nested-gemini[b-4xawh1mbsj] {
    background-image: url("/images/google-gemini-icon.svg");
}

.bi-list-nested-meta[b-4xawh1mbsj] {
    width: 1.7rem;
    height: 1.1rem;
    background-image: url("/images/meta-icon.svg");
}

.bi-list-nested-mistral[b-4xawh1mbsj] {
    background-image: url("/images/mistral-icon.svg");
}

.bi-list-nested-claude[b-4xawh1mbsj] {
    width: 1.4rem;
    height: 1.4rem;
    background-image: url("/images/claude-icon.png");
}

.bi-list-nested-xai[b-4xawh1mbsj] {
    width: 1.6rem;
    height: 1.4rem;
    background-image: url("/images/xai-icon.svg");
}

.bi-list-nested-deepseek[b-4xawh1mbsj] {
    width: 1.4rem;
    height: 1.4rem;
    background-image: url("/images/deepseek-icon.svg");
}

.line[b-4xawh1mbsj] {
    border: none;
    border-top: 1px solid white; /* Change color/thickness as needed */
    width: 90%;
    margin: 0 auto 10px auto;
}

/* CSS rule for truncated bot model names with ellipsis */
.botmodel-name[b-4xawh1mbsj] {
    flex: 1;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
/* _content/kaleidoprompt.Frontend.Web/Components/Modules/BotProfilesDisplay.razor.rz.scp.css */
.bot-profiles-wrapper[b-5fz81ysi7p] {
    transition: max-height 0.3s ease, background-color 0.3s;
    font-size: 0.95em;
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 8px;
    background-color: transparent;
    color: white;
    padding: 10px;
    margin: 10px 10px 20px 10px;
    position: relative;
    overflow: hidden;
    width: 180px;
    display: flex;
    flex-direction: column;
    height: auto;
    min-height: 45px;
    max-height: 175px;
}

.bot-profiles-wrapper.collapsed[b-5fz81ysi7p] {
    max-height: 45px;
}

.bot-profiles-wrapper.expanded[b-5fz81ysi7p] {
    max-height: 175px;
}

.profiles-header[b-5fz81ysi7p] {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0px 0px 10px 0px;
}

.profiles-title[b-5fz81ysi7p] {
    font-weight: bold;
    font-size: 1.1em;
    margin: 0px 0px 0px 5px;
}

.add-profile-button[b-5fz81ysi7p] {
    background-color: rgba(255, 255, 255, 0.1);
    color: white;
    border: none;
    border-radius: 6px;
    padding: 0px 5px 5px 5px;
    margin: -5px 0px -5px 0px;
    cursor: pointer;
    font-size: 1.8em;
    font-weight: bold;
    transition: background-color 0.3s;
    line-height: 0.9;
}

    .add-profile-button:hover[b-5fz81ysi7p] {
        background-color: rgba(255, 255, 255, 0.2);
    }

    .add-profile-button:active[b-5fz81ysi7p] {
        background-color: rgba(255, 255, 255, 0.3);
    }

.profiles-list[b-5fz81ysi7p] {
    display: flex;
    flex-direction: column;
    width: 100%;
    overflow-y: auto;
    flex-shrink: 1; /* let it shrink if needed, but not stretch by default */
    flex-grow: 0; /* do not force it to grow */
    background-color: rgb(33, 33, 33);
    border-radius: 4px;
    padding: 5px;
    box-sizing: border-box;
    max-height: 175px;
    transition: max-height 0.3s ease-in-out;
}

.profile-item[b-5fz81ysi7p] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: transparent;
    padding: 2px 5px 2px 5px;
    margin: 0px 0px 0px 0px;
    border-radius: 4px;
    cursor: pointer;
    transition: background-color 0.3s, font-weight 0.3s, color 0.3s;
    animation: fadeIn-b-5fz81ysi7p 0.3s ease-in-out;
}

    .profile-item:hover[b-5fz81ysi7p] {
        background-color: rgba(255, 255, 255, 0.2);
    }

    .profile-item.selected[b-5fz81ysi7p] {
        font-weight: bold;
        color: #F9B826;
    }

.profile-item-content[b-5fz81ysi7p] {
    margin-right: 8px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.profile-options-container[b-5fz81ysi7p] {
    position: relative;
    display: flex;
    align-items: center;
}

.profile-options-menu[b-5fz81ysi7p] {
    position: fixed;
    pointer-events: auto; /* allow interaction with the menu */
    background-color: #444;
    border: 1px solid #999;
    border-radius: 5px;
    min-width: 100px;
    display: flex;
    flex-direction: column;
    box-shadow: 0 2px 8px rgba(0,0,0,0.5);
    padding: 5px 0;
    z-index: 999999;
}


.menu-option[b-5fz81ysi7p] {
    color: #fff;
    padding: 6px 12px;
    font-size: 0.75rem;
    cursor: pointer;
    white-space: nowrap;
    font-weight: normal;
    transition: background-color 0.3s;
}

    .menu-option:hover[b-5fz81ysi7p] {
        background-color: rgba(255,255,255,0.3);
    }



@keyframes fadeIn-b-5fz81ysi7p {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}




.outer-border-container[b-5fz81ysi7p] {
    position: relative;
    width: 20px; /* match your textarea width */
    height: 100px; /* match your textarea height */
    margin: 0px 0px 20px 5px;
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 100px;
}

.vertical-text-container[b-5fz81ysi7p] {
    height: 100%;
    border-radius: inherit;
    /* Masks out the bottom so text inside gradually fades to transparent */
    -webkit-mask-image: linear-gradient(to bottom, black 70%, transparent 100%);
    mask-image: linear-gradient(to bottom, black 70%, transparent 100%);
}

/* Your existing textarea styles */
.vertical-text[b-5fz81ysi7p] {
    display: block;
    width: 100%; /* fill container width */
    height: 100%; /* fill container height */
    border: none;
    color: white;
    background-color: transparent;
    resize: none;
    padding: 5px 0px 0px 0px;
    margin: 0px;
    text-align: center;
    line-height: 1.0; /* adjust spacing between letters */
    overflow: hidden;
    cursor: default;
}
/* _content/kaleidoprompt.Frontend.Web/Components/Modules/BotReplyDisplay.razor.rz.scp.css */
/* BotReplyDisplay.razor.css */


/* Base text color */
.text-color[b-x0b3dc724i] {
    color: rgb(236, 236, 236);
    font-size: 0.97rem;
}

.content-wrapper[b-x0b3dc724i] {
    display: flex;
    align-items: flex-start;
    padding: 0px 0px 0px 0px;
}

.main-content[b-x0b3dc724i] {
    flex: 1;
    min-width: 0;
    padding: 5px 5px 5px 5px;
}

.button-wrapper[b-x0b3dc724i] {
    float: right;
    margin: -10px 20px 10px 5px;
}

.button-wrapper-copy[b-x0b3dc724i] {
    float: right;
    margin: -10px 5px 10px 10px;
}

.copy-reply-button[b-x0b3dc724i] {
    cursor: pointer;
    background-color: rgba(255, 255, 255, 0.1);
    color: rgb(236, 236, 236);
    font-size: 12px;
    border-radius: 5px;
    border: 0px;
    width: 35px;
    height: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .copy-reply-button:hover[b-x0b3dc724i] {
        background-color: rgba(255, 255, 255, 0.2);
    }

    .copy-reply-button:active[b-x0b3dc724i] {
        background-color: rgba(255, 255, 255, 0.3);
    }

.open-dropdown-button[b-x0b3dc724i] {
    cursor: pointer;
    background-color: rgba(255, 255, 255, 0.1);
    color: rgb(236, 236, 236);
    font-size: 12px;
    border-radius: 5px;
    border: 0px;
    width: 35px;
    height: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .open-dropdown-button i[b-x0b3dc724i] {
        transform: scaleY(-1); /* Ensures the icon is always flipped */
    }

    .open-dropdown-button:hover[b-x0b3dc724i] {
        background-color: rgba(255, 255, 255, 0.2);
    }

        .open-dropdown-button:hover i[b-x0b3dc724i] {
            transform: scaleY(-1);
        }

    .open-dropdown-button:active[b-x0b3dc724i] {
        background-color: rgba(255, 255, 255, 0.3);
    }

.visible-button[b-x0b3dc724i] {
    visibility: visible;
    pointer-events: auto; /* normal click behavior */
}

.hidden-button[b-x0b3dc724i] {
    visibility: hidden;
    pointer-events: none; /* disable interaction */
}









/* Code block styles CustomCodeBlockCss  ================== */
[b-x0b3dc724i] .code-container {
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 10px;
    margin: 20px 10px;
    background-color: var(--kaleidoprompt-dark-bg-code-block-color);
    padding: 15px 15px 5px 20px;
    font-size: 1.18rem;
}

[b-x0b3dc724i] .code-header {
    font-family: Arial, sans-serif;
    font-size: 13px;
    padding: 4px 10px;
    background-color: rgba(52,52,52, 0.8);
    position: -webkit-sticky; /* for Safari */
    position: sticky;
    top: 0;
    z-index: 10;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

[b-x0b3dc724i] .copy-button {
    cursor: pointer;
    background-color: rgba(255, 255, 255, 0.1);
    color: rgb(236, 236, 236);
    padding: 3px 10px;
    margin-right: 10px;
    font-size: 11px;
    border-radius: 5px;
    border: 0px;
}

    [b-x0b3dc724i] .copy-button:hover {
        background-color: rgba(255, 255, 255, 0.2);
    }

    [b-x0b3dc724i] .copy-button:active {
        background-color: rgba(255, 255, 255, 0.3);
    }

/* Code block styles CustomCodeBlockCss  ================== */

/* Output block styles CustomOutputBlockCss --------------- */
[b-x0b3dc724i] .output-container {
    border: 1px solid rgba(255, 255, 255, 0.2);
    position: relative;
    overflow: hidden;
    margin: 20px 10px;
    border-radius: 10px;
}

[b-x0b3dc724i] .output-block {
    background-color: var(--kaleidoprompt-dark-bg-code-block-color);
    overflow-x: auto;
    font-family: 'Consolas', 'Courier New', monospace;
    font-size: 16px;
    padding: 15px 15px 15px 20px;
    margin: 0;
}
/* Output block styles CustomOutputBlockCss --------------- */

/* OverrideBootstrapCss ####################################*/
/* Inline code blocks */
[b-x0b3dc724i] code {
    background-color: #2f2f2f;
    padding: 2px 5px;
    font-family: "Courier New", Courier, monospace;
    border-radius: 4px;
    color: white;
    font-size: 0.95em;
}

/* Table styles */
[b-x0b3dc724i] .table {
    border: 1px solid #666666;
    border-collapse: collapse;
    width: 100%;
    table-layout: fixed;
}

    [b-x0b3dc724i] .table thead th {
        background-color: #333333;
        color: white;
        border: 1px solid #666666;
        padding: 8px;
    }

    [b-x0b3dc724i] .table tbody tr {
        background-color: transparent;
        color: white;
    }

        [b-x0b3dc724i] .table tbody tr td {
            border: 1px solid #666666;
            padding: 8px;
        }

    [b-x0b3dc724i] .table tr {
        border-bottom: 1px solid #666666;
    }

        [b-x0b3dc724i] .table tr th,
        [b-x0b3dc724i] .table tr td {
            border-right: 1px solid #666666;
            border-left: 1px solid #666666;
            border-bottom: 1px solid #666666;
        }

    [b-x0b3dc724i] .table thead th {
        border-bottom: none;
    }
/* OverrideBootstrapCss ####################################*/
/* _content/kaleidoprompt.Frontend.Web/Components/Modules/ChatDisplay.razor.rz.scp.css */
.chat-container[b-ij4lyj28qk] {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    border-radius: 10px;
    background-color: var(--kaleidoprompt-dark-bg-chat-window-color);
    max-width: 1200px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.chat-inner[b-ij4lyj28qk] {
    display: flex;
    flex-grow: 1;
    overflow: hidden;
}

.top-bar[b-ij4lyj28qk] {
    display: flex;
    justify-content: space-between;
    padding: 5px 9px 5px 10px;
    color: white;
    width: 100%; /* Ensures it stretches across */
    height: 40px;
}

.title[b-ij4lyj28qk] {
    flex-grow: 1;
    padding: 5px 0px 0px 10px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.logo-image[b-ij4lyj28qk] {
    padding: 0px 0px 0px 0px;
    margin: 5px 0px 0px 8px;
}

.logo-image-xai[b-ij4lyj28qk] {
    padding: 0px 0px 0px 0px;
    margin: 0px -5px 0px 5px;
}

.close-button[b-ij4lyj28qk] {
    cursor: pointer;
    border: none;
    background: none;
    color: transparent;
    text-shadow: 0 0 0 white;
    padding: 0px 6px 0px 6px;
    margin: 4px 0px 0px 0px;
    
}

    .close-button[b-ij4lyj28qk]::selection {
        background: transparent; /* No background color when selected */
        color: transparent; /* No color when selected */
        text-shadow: 0 0 0 white;
    }

.content-area[b-ij4lyj28qk] {
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    overflow: hidden; /* Ensures no overflow from this container itself */
}

.message-components[b-ij4lyj28qk] {
    padding: 10px;
    overflow-y: auto; /* Enables vertical scrollbar when needed */
    flex-grow: 1;
    word-wrap: break-word;
}
/* _content/kaleidoprompt.Frontend.Web/Components/Modules/ChatSidebarDisplay.razor.rz.scp.css */
.sidebar[b-eoz4i1du6d] {
    background-color: var(--kaleidoprompt-dark-bg-chat-window-sidebar-color);
    height: 100%;
    border-radius: 10px 0px 0px 10px;
    display: flex;
    flex-direction: column;
    transition: max-width 0.3s ease, min-width 0.3s ease;
    will-change: max-width, min-width;
    font-size: 0.9rem;
    position: relative;
}

.sidebar-maximized[b-eoz4i1du6d] {
    max-width: 200px; /* Sidebar width when opened */
    min-width: 200px;
}

.sidebar-minimized[b-eoz4i1du6d] {
    max-width: 30px; /* Sidebar width when closed */
    min-width: 30px;
}

.history-list[b-eoz4i1du6d] {
    padding: 0;
    flex-grow: 1;
    overflow-y: auto;
    margin: 40px 0px 20px 0px;
    position: relative;
    height: 70%;
}

.sidebar-minimized .history-list[b-eoz4i1du6d] {
    overflow-y: hidden;
}


.history-item[b-eoz4i1du6d] {
    color: white;
    padding: 7px 0px 5px 7px;
    cursor: pointer;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}

.history-item-content[b-eoz4i1du6d] {
    overflow: hidden;
    text-overflow: clip;
    white-space: nowrap;
    padding-right: 20px; /* Add space for the fade effect */
    mask-image: linear-gradient(to right, black 85%, transparent 100%);
    -webkit-mask-image: linear-gradient(to right, black 85%, transparent 100%);
    padding: 5px 150px 3px 5px;
    margin: -5px 0px -3px -5px;
}

.sidebar-minimized .history-item-content[b-eoz4i1du6d] {
    padding: 5px 7px 3px 5px;
    margin: -5px 0px -3px -5px;
    mask-image: none;
}

.history-item:hover[b-eoz4i1du6d] {
    background-color: rgba(255, 255, 255, 0.1);
    border-radius: 5px;
}

/* Style for the selected history item */
.history-item.selected[b-eoz4i1du6d] {
    background-color: rgba(255, 255, 255, 0.1);
    color: #F9B826;
    border-radius: 5px;
}

/* Styles for disabled history items */
.history-item.disabled[b-eoz4i1du6d] {
    color: grey;
    cursor: default;
}

    .history-item.disabled:hover[b-eoz4i1du6d] {
        background-color: transparent;
    }

.history-list-header[b-eoz4i1du6d] {
    color: rgba(255, 255, 255, 0.9);
    font-size: .8rem;
    padding: 25px 0px 5px 15px;
    cursor: default;
    font-weight: bold;
}

.sidebar-toggle-button[b-eoz4i1du6d] {
    cursor: pointer;
    border: none;
    background: none;
    color: transparent;
    text-shadow: 0 0 0 white;
    font-size: 1.25rem;
    width: 100%;
    text-align: left;
    padding: 2px 0px 10px 5px;
}

    .sidebar-toggle-button .toggle-icon[b-eoz4i1du6d] {
        color: white;
        background-color: transparent;
        padding: 0px 2px 2px 2px;
        border-radius: 3px;
    }

        .sidebar-toggle-button .toggle-icon:hover[b-eoz4i1du6d] {
            background-color: rgba(255, 255, 255, 0.1);
        }

.sidebar-footer[b-eoz4i1du6d] {
    display: flex;
    flex-direction: column;
    padding: 10px 10px 10px 0px;
}

.sidebar-maximized .sidebar-footer[b-eoz4i1du6d] {
    padding: 10px;
}

.clear-chat-button[b-eoz4i1du6d] {
    cursor: pointer;
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 8px;
    background-color: transparent;
    color: white;
    font-size: 1.1rem;
    width: 100%;
    text-align: left;
    padding: 0px 0px 0px 0px;
    transition: background-color 0.3s, border-color 0.3s;
}

    .clear-chat-button:hover[b-eoz4i1du6d] {
        background-color: rgba(255, 255, 255, 0.1);
    }

    .clear-chat-button:active[b-eoz4i1du6d] {
        background-color: rgba(255, 255, 255, 0.2);
    }

    .clear-chat-button .eraser-icon[b-eoz4i1du6d] {
        color: white;
        padding: 5px 5px 5px 3px;
        border-radius: 3px;
    }

.sidebar-maximized .clear-chat-button .eraser-icon[b-eoz4i1du6d] {
    padding: 5px 5px 5px 29px;
}

.clear-chat-button .eraser-icon:hover[b-eoz4i1du6d] {
    background-color: rgba(255, 255, 255, 0.1);
}

.sidebar-maximized .clear-chat-button .eraser-icon:hover[b-eoz4i1du6d] {
    background: none;
}

.clear-chat-span[b-eoz4i1du6d] {
    padding: 0px 0px 0px 5px;
    font-size: 1rem;
}

.pause-button[b-eoz4i1du6d],
.play-button[b-eoz4i1du6d] {
    cursor: pointer;
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 8px;
    background-color: transparent;
    color: white;
    font-size: 1.1rem;
    width: 100%;
    text-align: left;
    padding: 0px 0px 0px 0px;
    transition: background-color 0.3s, border-color 0.3s;
}

    .pause-button:hover[b-eoz4i1du6d],
    .play-button:hover[b-eoz4i1du6d] {
        background-color: rgba(255, 255, 255, 0.1);
    }

    .pause-button:active[b-eoz4i1du6d],
    .play-button:active[b-eoz4i1du6d] {
        background-color: rgba(255, 255, 255, 0.2);
    }

    .pause-button .playpause-icon[b-eoz4i1du6d] {
        color: white;
        background-color: transparent;
        padding: 6px 8px 5px 8px;
        border-radius: 3px;
    }

.sidebar-maximized .pause-button .playpause-icon[b-eoz4i1du6d] {
    padding: 6px 8px 5px 34px;
}

        .pause-button .playpause-icon:hover[b-eoz4i1du6d] {
            background-color: rgba(255, 255, 255, 0.1);
        }

.sidebar-maximized .pause-button .playpause-icon:hover[b-eoz4i1du6d] {
    background: none;
}

.playpause-span-pause-button[b-eoz4i1du6d] {
    padding: 0px 0px 0px 7px;
    font-size: 1rem;
    position: relative;
    top: -1px; /* Move text up by 1px */
}


.play-button .playpause-icon[b-eoz4i1du6d] {
    color: white;
    background-color: transparent;
    padding: 6px 7px 5px 7px;
    border-radius: 3px;
}

.sidebar-maximized .play-button .playpause-icon[b-eoz4i1du6d] {
    padding: 6px 7px 5px 33px;
}

.play-button .playpause-icon:hover[b-eoz4i1du6d] {
    background-color: rgba(255, 255, 255, 0.1);
}

.sidebar-maximized .play-button .playpause-icon:hover[b-eoz4i1du6d] {
    background: none;
}

.playpause-span-play-button[b-eoz4i1du6d] {
    padding: 0px 0px 0px 7px;
    font-size: 1rem;
    position: relative;
    top: -1px; /* Move text up by 1px */
}


.sidebar-minimized .clear-chat-span[b-eoz4i1du6d],
.sidebar-minimized .playpause-span-pause-button[b-eoz4i1du6d],
.sidebar-minimized .playpause-span-play-button[b-eoz4i1du6d] {
    display: none;
}

.sidebar-minimized .clear-chat-button[b-eoz4i1du6d],
.sidebar-minimized .pause-button[b-eoz4i1du6d],
.sidebar-minimized .play-button[b-eoz4i1du6d],
.sidebar-minimized .clear-chat-button:hover[b-eoz4i1du6d],
.sidebar-minimized .pause-button:hover[b-eoz4i1du6d],
.sidebar-minimized .play-button:hover[b-eoz4i1du6d] {
    border: 1px solid transparent;
    background: none;
}


.line[b-eoz4i1du6d] {
    border: none;
    border-top: 1px solid white; /* Change the color and thickness as needed */
    width: 20px; /* Change the width as needed */
    margin: 25px auto 15px auto; /* Change the margins as needed */
}


/* Container for button and menu */
.item-options-container[b-eoz4i1du6d] {
    position: relative;
    display: inline-block;
}

.item-options-button[b-eoz4i1du6d] {
    background: none;
    border: none;
    color: grey;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    padding: 5px 5px 5px 5px;
    margin: -5px 0px -5px 0px;
}

    .item-options-button:hover[b-eoz4i1du6d] {
        color: white;
    }

.history-item.disabled .item-options-button:hover[b-eoz4i1du6d] {
    color: grey;
}


.menu-option[b-eoz4i1du6d] {
    color: #fff;
    padding: 6px 12px;
    font-size: 0.75rem;
    cursor: pointer;
    white-space: nowrap;
}

    .menu-option:hover[b-eoz4i1du6d] {
        background-color: rgba(255,255,255,0.3);
    }
/* _content/kaleidoprompt.Frontend.Web/Components/Modules/DetailsBoxDisplay.razor.rz.scp.css */
.details-box-wrapper[b-730ig2esox] {
    flex-grow: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 15dvh;
    font-size: 0.95em;
}

.details-box[b-730ig2esox] {
    background-color: rgba(255, 255, 255, 0.1); /* Slightly transparent */
    padding: 20px 20px 10px 20px;
    border-radius: 10px;
    text-align: left; /* Align text to the left */
    color: rgb(236, 236, 236);
    max-width: 400px;
    width: 350px;
    overflow: auto; /* Contain floated elements */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3); /* Adds a subtle shadow for depth */
}

.details-box-content[b-730ig2esox] {
    text-align: left; /* Align text to the left */
    overflow: auto; /* Contain floated elements */
}

.details-box-icon[b-730ig2esox] {
    float: left; /* Float image to the left */
    margin-right: 20px; /* Space between image and text */
    margin-bottom: 10px; /* Space below image */
}

.details-box-description[b-730ig2esox],
.details-box-info[b-730ig2esox] {
    word-wrap: break-word; /* Ensure long text wraps within the box */
}

.details-box-description[b-730ig2esox] {
    margin-bottom: 40px; /* Spacing below description */
}

.details-box-info[b-730ig2esox] {
    margin: 5px 0;
    text-align: left;
    width: 99%;
    font-size: 0.9em;
}

    .details-box-info div[b-730ig2esox] {
        display: flex;
        align-items: center;
    }

    .details-box-info .data-row-alignment[b-730ig2esox] {
        margin-left: auto;
        text-align: right;
    }

.logo-image-xai[b-730ig2esox] {
    padding: 0px 0px 0px 0px;
    margin: -5px -10px -10px -5px;   
}
/* _content/kaleidoprompt.Frontend.Web/Components/Modules/LandingPage/AboutUs.razor.rz.scp.css */
/* About Us section styles */

.section-container[b-hyesrrbksz] {
    position: relative;
    display: flex;
    width: 100%;
    max-width: 100vw;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    margin-top: 6rem;
    margin-bottom: 13rem;
}

.headline[b-hyesrrbksz] {
    color: #f9f9f9;
    text-align: center;
    font-size: 3rem;
    font-weight: 500;
}

.descriptiontext[b-hyesrrbksz] {
    color: #f9f9f9;
    text-align: center;
}

.my-auto[b-hyesrrbksz] {
    max-width: 60%;
}

@media (max-width: 768px) {
    .headline[b-hyesrrbksz] {
        font-size: 2.25rem;
    }
}
/* _content/kaleidoprompt.Frontend.Web/Components/Modules/LandingPage/Benefits.razor.rz.scp.css */
/* Benefits section styles */

.section-container[b-p5awx3dugr] {
    position: relative;
    display: flex;
    width: 100%;
    max-width: 100vw;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-bottom: 2rem;
}

.content-container[b-p5awx3dugr] {
    display: flex;
    min-height: 40dvh;
    justify-content: center;
    align-items: center;
    gap: 10%;
    margin-bottom: 3rem;
}

.image-wrapper-1[b-p5awx3dugr] {
    display: flex;
    flex: 2.775;
}

.image-wrapper-2[b-p5awx3dugr] {
    display: flex;
    flex: 1.6;
}


.image-container[b-p5awx3dugr] {
    /* Force the container to always be 16:9 */
    aspect-ratio: 16 / 9;
    /* Make the container fill its parent’s width or set a max-width if desired */
    width: 100%;

    position: relative;
    overflow: hidden;
    border-radius: 0.5rem;
    box-shadow: 0 0 15px 3px rgba(255, 255, 255, 0.5);
    margin-bottom: 0.5rem;
}

    /* Let the images fill that container while preserving the 16:9 ratio */
    .image-container img[b-p5awx3dugr] {
        width: 100%;
        height: 100%;
        object-fit: cover; /* or object-fit: fill depending on how you want scaling handled */
    }


.text-content[b-p5awx3dugr] {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 1rem;
    color: #f9f9f9;
}

.feature-container[b-p5awx3dugr] {
    margin-top: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.feature-heading[b-p5awx3dugr] {
    font-size: 1.25rem;
    font-weight: 500;
}

    .feature-heading i[b-p5awx3dugr] {
        font-size: 1.5rem !important;
    }

.feature-description[b-p5awx3dugr] {
    font-size: 1.125rem;
    color: rgb(209, 213, 219);
}

.feature-description-icons[b-p5awx3dugr] {
    font-size: 2.0rem;
    color: rgb(209, 213, 219);
}

@media (max-width: 1024px) {
    .content-container[b-p5awx3dugr] {
        flex-direction: column;
        gap: 2.5rem;
    }

    .content-container[b-p5awx3dugr] {
        margin-bottom: 6rem;
    }

    .text-content[b-p5awx3dugr] {
        max-width: 100%;
    }

}

@media (max-width: 768px) {
    .main-heading[b-p5awx3dugr] {
        font-size: 1.5rem;
    }

    .feature-description[b-p5awx3dugr] {
        font-size: 1rem;
    }
}


/* _content/kaleidoprompt.Frontend.Web/Components/Modules/LandingPage/Carousel.razor.rz.scp.css */
/* General Styles */
.brands-section[b-bid4tkeuvp] {
    position: relative;
    display: flex;
    width: 100%;
    max-width: 100vw;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    color: #f9f9f9;
    min-height: 15dvh;
    margin-top: 5rem;
    margin-bottom: 4rem;
}

.section-title[b-bid4tkeuvp] {
    font-size: 3rem;
    font-weight: 500;
    text-align: center;
    margin-bottom: 3.5rem;
}

/* Carousel Styles */
.carousel-container[b-bid4tkeuvp] {
    width: 100%;
    height: 40px;
    overflow: hidden;
    position: relative;
}

.carousel-wrapper[b-bid4tkeuvp] {
    position: absolute; /* take it out of the normal flow */
    top: 0;
    left: 0;
    display: flex;
    gap: 3.25rem;
    animation: scroll-b-bid4tkeuvp 30s linear infinite; /* Adjust time to control speed */
}

    /* Pause animation on hover */
    .carousel-wrapper:hover[b-bid4tkeuvp] {
        animation-play-state: paused;
    }

.carousel-img[b-bid4tkeuvp] {
    height: 40px;
    width: 150px;
    flex-shrink: 0; /* Prevent images from shrinking */
}

    .carousel-img img[b-bid4tkeuvp] {
        height: 100%;
        width: 100%;
        object-fit: contain;
        filter: grayscale(100%);
        transition: filter 0.3s ease;
    }

        .carousel-img img:hover[b-bid4tkeuvp] {
            filter: grayscale(0%);
        }

.adjust-up[b-bid4tkeuvp] {
    transform: translateY(-5px); /* Adjust this value to move it up more or less */
}



/* Sliding Animation */
@keyframes scroll-b-bid4tkeuvp {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-50%); /* Move by half of the wrapper width */
    }
}

/* Animation Class */
.reveal-up[b-bid4tkeuvp] {
    opacity: 0;
    transform: translateY(20px);
    animation: revealUp-b-bid4tkeuvp 0.6s ease forwards;
}

@keyframes revealUp-b-bid4tkeuvp {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Media Queries */
@media (max-width: 768px) {
    .section-title[b-bid4tkeuvp] {
        font-size: 2.25rem;
    }

    .carousel-wrapper[b-bid4tkeuvp] {
        gap: 1rem;
    }
}
/* _content/kaleidoprompt.Frontend.Web/Components/Modules/LandingPage/FAQ.razor.rz.scp.css */
.faq-section[b-hsi40za9d3] {
    position: relative;
    display: flex;
    width: 100%;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 10%;
    padding: 5% 10%;
    color: #f9f9f9;
    margin-top: 4rem;
    margin-bottom: 5rem;
}

.faq-title[b-hsi40za9d3] {
    font-size: 3rem;
    font-weight: 500;
}

.faq-container[b-hsi40za9d3] {
    margin-top: 2.25rem;
    display: flex;
    width: 100%;
    max-width: 850px;
    flex-direction: column;
    gap: 1rem;
}

.faq-item[b-hsi40za9d3] {
    width: 100%;
    cursor: pointer;
}

.faq-accordion[b-hsi40za9d3] {
    display: flex;
    width: 100%;
    user-select: none;
    font-size: 1.25rem;
}

    .faq-accordion i[b-hsi40za9d3] {
        font-size: 1.25rem;
        transform-origin: center;
        transition: transform 0.3s;
        margin-left: auto;
        font-weight: 600;
    }

.faq-content[b-hsi40za9d3] {
    display: none;
    margin-top: 2rem;
    cursor: default;
}

/* Add this class when accordion is active */
.faq-item.active .faq-content[b-hsi40za9d3] {
    display: block;
}

.faq-item.active .faq-accordion i[b-hsi40za9d3] {
    transform: rotate(45deg);
}


/* Media Queries */
@media (max-width: 768px) {
    .faq-title[b-hsi40za9d3] {
        font-size: 2.25rem;
    }

    .faq-accordion[b-hsi40za9d3] {
        font-size: 1.125rem;
    }

    .faq-content[b-hsi40za9d3] {
        font-size: 0.875rem;
    }
}

hr[b-hsi40za9d3] {
    width: 100%;
    border: none;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
}

h4 .semi-bold[b-hsi40za9d3] {
    font-weight: 650 !important;
}
/* _content/kaleidoprompt.Frontend.Web/Components/Modules/LandingPage/LandingNotAuthorized.razor.rz.scp.css */
/* Topbar Styles */
.topbar[b-qevgm0o2dt] {
    position: fixed;
    top: 0;
    width: 100%;
    box-sizing: border-box;
    z-index: 1000;
}

/* Content Wrapper */
.content[b-qevgm0o2dt] {
    padding-top: 3.5rem; /* Adjust for topbar height */
    max-width: 1400px;
    margin: 0 auto;
    position: relative;
    z-index: 1; /* Ensure content sits above the watermark */
}

/* Divider Line */
.divider-line[b-qevgm0o2dt] {
    position: relative;
    width: 100%;
    height: 1px;
    margin: 0;
    padding: 0;
    background: linear-gradient(to right, rgba(255, 255, 255, 0), #ccc, rgba(255, 255, 255, 0));
}
/* _content/kaleidoprompt.Frontend.Web/Components/Modules/LandingPage/Overview.razor.rz.scp.css */
/* Overview Styles */

/* Headline Styles */
.hero-text[b-7uit2mxhtd] {
    min-height: 40dvh;
    display: grid;
    place-content: center;
    gap: clamp(1rem, 5vh, 3rem); /* min, preferred, max */
    margin-top: 3rem;
}

.headline[b-7uit2mxhtd] {
    color: #f9f9f9;
    text-align: center;
    font-size: 4rem;
    font-weight: 600;
}

    .headline .highlight[b-7uit2mxhtd] {
        color: #F9B826;
    }

    
/* Description Text */
.descriptiontext[b-7uit2mxhtd] {
    color: #f9f9f9;
    text-align: center;
    font-size: 1.2rem;
}


.hero-section[b-7uit2mxhtd] {
    /* Your usual container styles */
    position: relative;
    width: 100%;
    z-index: -100;
    padding-bottom: 12rem;
}

    .hero-section[b-7uit2mxhtd]::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        /* 1) Draw repeated white dots on transparent background */
        background-image: radial-gradient(#fff 2px, transparent 2px);
        background-repeat: repeat;
        background-size: 25px 25px; /* adjust for spacing */
        /* 2) Use a mask to fade them from center to edges */
        /* White center => fully visible, black edges => fully hidden */
        /* --- Safari (prefixed) --- */
        -webkit-mask-image: radial-gradient( 
            circle,
            rgba(255, 255, 255, 0.09) 0%,
            rgba(255, 255, 255, 0.08) 25%,
            rgba(255, 255, 255, 0.05) 50%,
            rgba(255, 255, 255, 0.01) 75%,
            rgba(255, 255, 255, 0) 100%
        );

        -webkit-mask-repeat: no-repeat;
        -webkit-mask-position: center;
        -webkit-mask-size: cover;
        /* --- Standard (unprefixed) --- */
        mask-image: radial-gradient( 
            circle,
            rgba(255, 255, 255, 0.09) 0%,
            rgba(255, 255, 255, 0.08) 25%,
            rgba(255, 255, 255, 0.05) 50%,
            rgba(255, 255, 255, 0.01) 75%,
            rgba(255, 255, 255, 0) 100% );
        mask-repeat: no-repeat;
        mask-position: center;
        mask-size: cover;
        /* Let clicks pass through */
        pointer-events: none;
        z-index: -100;
    }


/* "Try now for free!" Button */
.original-button[b-7uit2mxhtd] {
    position: relative;
    z-index: 1;
    border: 0 solid transparent;
    border-radius: 10px;
    background-color: transparent;
    color: white;
    padding: 5px 10px;
    cursor: pointer;
    font-size: 1.2em;
    width: 190px;
    height: 50px;
    overflow: hidden;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 1), 0 0 8px rgba(249, 184, 38, 0.7), 0 0 16px rgba(249, 184, 38, 0.5), 0 0 24px rgba(249, 184, 38, 0.3), 0 0 32px rgba(249, 184, 38, 0.2);
    transition: transform 0.1s, box-shadow 0.1s;
    margin-top: 1rem;
    margin-bottom: 4rem;
}

    .original-button[b-7uit2mxhtd]::before {
        content: '';
        position: absolute;
        top: -2px;
        left: -2px;
        right: -2px;
        bottom: -2px;
        background: linear-gradient( 270deg, #E7048C, #F9B826, #FB429D, #E7048C, #F9B826, #FB429D );
        background-size: 400% 400%;
        animation: gradientAnimation-b-7uit2mxhtd 6s ease infinite;
        z-index: -2;
    }

    .original-button[b-7uit2mxhtd]::after {
        content: '';
        position: absolute;
        top: 1px;
        left: 1px;
        right: 1px;
        bottom: 1px;
        border-radius: 9px;
        background-color: var(--kaleidoprompt-dark-bg-color);
        transition: background-color 0.3s;
        z-index: -1;
    }

@keyframes gradientAnimation-b-7uit2mxhtd {
    0% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}

.original-button:hover[b-7uit2mxhtd]::after {
    background-color: #2b2b2c;
}

.original-button:active[b-7uit2mxhtd] {
    transform: translateY(2px);
    box-shadow: 0 3px 5px rgba(0, 0, 0, 1), 0 0 6px rgba(249, 184, 38, 0.7), 0 0 12px rgba(249, 184, 38, 0.5), 0 0 18px rgba(249, 184, 38, 0.3);
}

    .original-button:active[b-7uit2mxhtd]::after {
        background-color: #424243;
    }


.welcome-bonus[b-7uit2mxhtd] {
    background-color: rgba(0, 0, 0, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 100px;
    padding: 4px 40px;
    color: #f9f9f9;
    font-size: 0.9rem;
    display: block;
    margin: -4rem auto 2rem auto;
    max-width: 400px;
    text-align: center;
}

.positive-balance[b-7uit2mxhtd] {
    color: rgb(86, 217, 114);
}


/* Video Container */
.video-container[b-7uit2mxhtd] {
    align-content: center;
    min-height: 45dvh;
    margin-top: 3rem;
}

    .video-container video[b-7uit2mxhtd] {
        display: block;
        width: calc(100% + 250px);
        margin: 0 auto;
        margin-left: -125px;
        margin-right: -125px;
        max-width: none;
        border-radius: 10px;
        box-shadow: 0 0 15px 3px rgba(255, 255, 255, 0.5);
    }



/* Responsive Adjustments */
@media (max-width: 768px) {

    .video-container[b-7uit2mxhtd] {
        align-content: center;
        min-height: 25dvh;
    }

    .video-container video[b-7uit2mxhtd] {
        display: block;
        width: calc(100% + 100px);
        margin: 0 auto;
        margin-left: -50px;
        margin-right: -50px;
        max-width: none;
        border-radius: 10px;
        box-shadow: 0 0 15px 3px rgba(255, 255, 255, 0.5);
    }

    .headline[b-7uit2mxhtd] {
        font-size: 2.75rem;
    }

    .descriptiontext[b-7uit2mxhtd] {
        font-size: 1rem;
    }

    .welcome-bonus[b-7uit2mxhtd] {
        padding: 4px 20px;
    }

}
/* _content/kaleidoprompt.Frontend.Web/Components/Modules/LandingPage/PricingSection.razor.rz.scp.css */
/* Pricing Section Styles */

.pricing-section[b-e20w5hu3v2] {
    position: relative;
    display: flex;
    max-width: 100vw;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    color: #f9f9f9;
    margin-top: 6rem;
    margin-bottom: 6rem;
}

.pricing-container[b-e20w5hu3v2] {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    align-items: center;
    gap: 1.25rem;
}

.pricing-header[b-e20w5hu3v2] {
    margin-top: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    text-align: center;
}

    .pricing-header h2[b-e20w5hu3v2] {
        font-size: 3rem;
        font-weight: 500;
    }

.pricing-content[b-e20w5hu3v2] {
    display: flex;
    flex-direction: column;
    max-width: 1150px;
    height: 100%;
    padding: 1rem;
    gap: 2rem;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    margin-bottom: 5rem;
}

.pricing-grid[b-e20w5hu3v2] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
    justify-content: center;
}

.card-wrapper[b-e20w5hu3v2] {
    width: 350px;
    display: flex;
}

.card[b-e20w5hu3v2] {
    position: relative;
    padding: 2.5rem;
    transition: all 0.3s;
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    background-color: rgb(255, 255, 255, 0.06);
    border-radius: 1.5rem;
    gap: 1.25rem;
    text-decoration: none;
    color: #f9f9f9;
}

    .card:hover[b-e20w5hu3v2] {
        transform: scale(1.02);
    }

    .card h2[b-e20w5hu3v2] {
        font-size: 1.875rem;
        font-weight: 500;
    }

    .card p[b-e20w5hu3v2] {
        font-size: 1rem;
        line-height: normal;
    }

.large-card-wrapper[b-e20w5hu3v2] {
    width: 100%;
    display: flex;
}

.large-card[b-e20w5hu3v2] {
    position: relative;
    padding: 2.5rem;
    transition: all 0.3s;
    display: grid;
    grid-template-columns: auto 1fr; /* Changed to auto 1fr */
    width: 100%;
    height: 100%;
    background-color: rgb(255, 255, 255, 0.06);
    border-radius: 1.5rem;
    gap: 4rem;
    text-decoration: none;
    color: #f9f9f9;
    justify-content: center;
    align-items: center;
}

    .large-card:hover[b-e20w5hu3v2] {
        transform: scale(1.02);
    }

.large-card-image[b-e20w5hu3v2] {
    /* Aspect ratio = 898 / 428 ≈ 2.09813 */
    width: 500px; /* Fixed width */
    height: 238px; /* Fixed height */
    overflow: hidden;
    border-radius: 0.5rem;
    box-shadow: 0 0 15px 3px rgba(255, 255, 255, 0.5);
    flex-shrink: 0; /* Prevents image from shrinking */
}

    .large-card-image img[b-e20w5hu3v2] {
        width: 100%;
        height: 100%;
    }

.large-card-content[b-e20w5hu3v2] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    min-width: 0; /* Allows content to shrink below its minimum content size */
}

    .large-card-content h2[b-e20w5hu3v2] {
        font-size: 1.875rem;
        font-weight: 500;
    }

.learn-more[b-e20w5hu3v2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: auto;
}

    .learn-more i[b-e20w5hu3v2] {
        transition: transform 0.3s;
    }

.card:hover .learn-more i[b-e20w5hu3v2] {
    transform: translateX(0.5rem);
}

.large-card:hover .learn-more i[b-e20w5hu3v2] {
    transform: translateX(0.5rem);
}

.table-container[b-e20w5hu3v2] {
    padding: 0px 0px 0px 10px;
    margin: -15px 0px 0px 0px;
}

.price-example-table[b-e20w5hu3v2] {
    width: 80%;
    border-collapse: collapse;
}

    .price-example-table td[b-e20w5hu3v2] {
        text-align: left;
        padding: 5px;
    }

    .price-example-table tr td:first-child[b-e20w5hu3v2] {
        text-align: left;
        width: 70%;
    }

    .price-example-table tr td:last-child[b-e20w5hu3v2] {
        text-align: right;
        width: 30%;
    }

.table-divider[b-e20w5hu3v2] {
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    padding: 0;
    height: 1px;
}

.positive-balance[b-e20w5hu3v2] {
    color: rgb(86, 217, 114);
}

/* Media Queries */
@media (max-width: 1280px) {
    .pricing-grid[b-e20w5hu3v2] {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .card-wrapper[b-e20w5hu3v2] {
        width: 100%;
    }

}

@media (max-width: 900px) {

    .large-card[b-e20w5hu3v2] {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .large-card-image[b-e20w5hu3v2] {
        width: 80%;
        height: auto;
        aspect-ratio: 2.098;
    }

}


@media (max-width: 768px) {

    .large-card-image[b-e20w5hu3v2] {
        width: 100%;
        height: auto;
        aspect-ratio: 2.098;
    }

    .pricing-header h2[b-e20w5hu3v2] {
        font-size: 2.25rem;
    }

}
/* _content/kaleidoprompt.Frontend.Web/Components/Modules/NavMenuModelSelectorDisplay.razor.rz.scp.css */
.add-model-container[b-zjzw0a3xi9] {
    
}
/* _content/kaleidoprompt.Frontend.Web/Components/Modules/ProfileItemDisplay.razor.rz.scp.css */


.profile-options-button[b-mokrih4c0l] {
    background: none;
    border: none;
    color: grey;
    cursor: pointer;
    font-size: 1rem;
    padding: 0px 5px 0px 5px;
    margin: 0px 0px 0px 0px;
    transition: color 0.3s;
}

    .profile-options-button:hover[b-mokrih4c0l] {
        color: white;
    }

/* _content/kaleidoprompt.Frontend.Web/Components/Modules/PromptInputDisplay.razor.rz.scp.css */

.prompt-container[b-kubu47538a] {
    flex: 0 0 auto;
    width: auto;
    padding: 0.5rem !important;
    display: flex;
    justify-content: center;
    flex-shrink: 0;
    flex-direction: column;
}

.container-flex-center-info[b-kubu47538a] {
    width: 100%;
    max-width: 400px;
    margin: auto;
    display: flex;
    justify-content: space-between; /* Changed from 'left' to 'space-between' */
    border-radius: 100px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    overflow: hidden;
    font-size: smaller;
    height: 1.5rem;
}

.price-text[b-kubu47538a] {
    color: rgb(236, 236, 236);
    padding: 0px 20px 0px 20px;
    cursor: default;
}

/* New style for right-aligned text */
.price-text-right[b-kubu47538a] {
    color: rgb(236, 236, 236);
    padding: 0px 20px 0px 20px;
    margin-left: auto; /* Pushes this element to the right */
    cursor: default;
}


/* Styling for the outer container */
.container-flex-center[b-kubu47538a] {
    width: 100%;
    max-width: 900px;
    margin: auto;
    display: flex;
    justify-content: center;
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    overflow: hidden;
}

/* Styling for the input group */
.input-group-custom[b-kubu47538a] {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    background: transparent;
    border: none;
    position: relative;
    width: 100%;
    overflow-y: auto;
    padding-bottom: 0px;
    overflow: hidden;
}

/* Styling for the input field to expand and have a scrollbar */
.input-field-custom[b-kubu47538a] {
    background-color: transparent;
    border: none;
    max-height: 200px;
    height: 50px;
    padding: 16px 60px 16px 50px;
    scroll-padding-block-start: 10px;
    scroll-padding-block-end: 10px;
    color: white;
    resize: none;
    line-height: 1.1;
    width: 100%;
}

/* Styling for the sr-only class to hide the file input */
.sr-only[b-kubu47538a] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}

/* Styling for the paperclip label */
.paperclip-label[b-kubu47538a] {
    color: white;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    width: 40px;
    position: absolute;
    left: 0px;
    top: 100%;
    transform: translateY(-50%);
    margin: -25px 0px 0px 0px;
    border-radius: 10px;
}

    .paperclip-label:hover[b-kubu47538a] {
        background-color: rgba(255, 255, 255, 0.1);
        margin: -25px 0px 0px 2.5px;
        height: 35px;
        width: 35px;
    }

/* Styling for the send button */
.send-button-custom[b-kubu47538a] {
    position: absolute;
    right: 15px;
    top: 100%;
    transform: translateY(-50%);
    background-color: rgba(255, 255, 255, 0.1);
    border-radius: 10px;
    height: 35px;
    width: 35px;
    border: none;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    margin: -25px 0px 0px 0px;
}

    .send-button-custom:hover[b-kubu47538a] {
        background-color: rgba(255, 255, 255, 0.2);
    }

    .send-button-custom:active[b-kubu47538a] {
        background-color: rgba(255, 255, 255, 0.3);
    }

/* Remove shadow on focus for inputs and buttons */
.input-group-custom .form-control:focus[b-kubu47538a],
.input-group-custom .btn:focus[b-kubu47538a] {
    box-shadow: none;
}

/* Styling for the file drop zone */
.file-drop-zone[b-kubu47538a] {
    display: flex;
    width: 100%;
    align-items: center;
    margin-bottom: 0px;
    position: relative;
    flex-direction: column;
}

.hover[b-kubu47538a] {
    background-color: rgba(255, 255, 255, 0.05);
}

.thumbnail-container[b-kubu47538a] {
    display: flex;
    flex-direction: row;
    gap: 15px;
    position: absolute;
    top: 5px;
    left: 50px;
    background-color: transparent;
    overflow-y: hidden;
    width: 87%;
    padding: 0px 10px 0px 0px;
}

.thumbnail-wrapper[b-kubu47538a] {
    position: relative;
    display: inline-block;
}

.thumbnail-image[b-kubu47538a] {
    width: 50px;
    height: 50px;
    object-fit: cover;
    border-radius: 5px;
    padding: 0px;
    margin: 10px 0px 5px 0px;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.thumbnail-delete[b-kubu47538a] {
    display: none;
    position: absolute;
    top: 0px;
    right: -10px;
    background-color: black;
    color: transparent;
    text-shadow: 0 0 0 white;
    border: none;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    cursor: pointer;
    font-size: small;
    align-items: center;
    justify-content: center;
    line-height: 1;
    padding: 0;
}

.thumbnail-wrapper:hover .thumbnail-delete[b-kubu47538a] {
    display: block;
}

/* Styling for non-image thumbnails */
.non-image-thumbnail[b-kubu47538a] {
    width: 150px;
    height: 50px;
    background-color: rgba(255, 255, 255, 0.05);
    border-radius: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
    font-size: 12px;
    text-align: center;
    padding: 5px;
    margin: 10px 0px 5px 0px;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.file-name[b-kubu47538a] {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
}

.error-message-container[b-kubu47538a] {
    color: red;
    text-align: left;
    position: absolute;
    bottom: -15px;
    left: 50px;
    font-size: smaller;
    width: 77%;
}

/* Spinner for file uploads */
.spinner[b-kubu47538a] {
    border: 4px solid rgba(255, 255, 255, 0.2);
    border-radius: 50%;
    border-top: 4px solid white;
    width: 40px;
    height: 40px;
    animation: spin-b-kubu47538a 1s linear infinite;
    padding: 5px;
    margin: 15px 0px 5px 0px;
    display: flex;
    justify-content: center;
    align-items: center;
}

@keyframes spin-b-kubu47538a {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/* ---------------------------------------------
   SMALL "sending message" spinner & container
   --------------------------------------------- */
.sending-message-container[b-kubu47538a] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 60px;
    color: white;
}

/* Smaller spinner for sending message */
.spinner-message-sender[b-kubu47538a] {
    border: 2px solid rgba(255, 255, 255, 0.2);
    border-radius: 50%;
    border-top: 2px solid white;
    width: 18px;
    height: 18px;
    animation: spin-b-kubu47538a 1s linear infinite;
}

.yellow-text[b-kubu47538a] {
    color: #F9B826 !important;
}


@media (max-width: 576px) {
    .hide-on-small[b-kubu47538a] {
        display: none;
    }
}
/* _content/kaleidoprompt.Frontend.Web/Components/Modules/PromptMessageDisplay.razor.rz.scp.css */
.prompt-container[b-vt7xq7m67b] {
    color: rgb(236, 236, 236);
    background-color: rgba(255, 255, 255, 0.1);
    border-radius: 10px;
    margin: 10px 0px 5px 0px;
    position: relative;
    font-size: 0.97rem;
}

.content-wrapper[b-vt7xq7m67b] {
    display: flex;
    align-items: flex-start;
    padding: 0px 0px 0px 0px;
}

.main-content[b-vt7xq7m67b] {
    flex: 1;
    min-width: 0;
    padding: 5px 5px 5px 5px;
}

.button-wrapper[b-vt7xq7m67b] {
    float: right;
    margin: 5px 20px 5px 5px;
}

.button-wrapper-copy[b-vt7xq7m67b] {
    float: right;
    margin: 5px 5px 5px 10px;
}

.copy-prompt-button[b-vt7xq7m67b] {
    cursor: pointer;
    background-color: rgba(255, 255, 255, 0.1);
    color: rgb(236, 236, 236);
    font-size: 12px;
    border-radius: 5px;
    border: 0px;
    width: 35px;
    height: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .copy-prompt-button:hover[b-vt7xq7m67b] {
        background-color: rgba(255, 255, 255, 0.2);
    }

    .copy-prompt-button:active[b-vt7xq7m67b] {
        background-color: rgba(255, 255, 255, 0.3);
    }

.open-dropdown-button[b-vt7xq7m67b] {
    cursor: pointer;
    background-color: rgba(255, 255, 255, 0.1);
    color: rgb(236, 236, 236);
    font-size: 12px;
    border-radius: 5px;
    border: 0;
    width: 35px;
    height: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .open-dropdown-button i[b-vt7xq7m67b] {
        transform: scaleY(-1); /* Ensures the icon is always flipped */
    }

    .open-dropdown-button:hover[b-vt7xq7m67b] {
        background-color: rgba(255, 255, 255, 0.2);
    }

        .open-dropdown-button:hover i[b-vt7xq7m67b] {
            transform: scaleY(-1);
        }

    .open-dropdown-button:active[b-vt7xq7m67b] {
        background-color: rgba(255, 255, 255, 0.3);
    }

.file-thumbnails[b-vt7xq7m67b] {
    display: flex;
    flex-wrap: wrap;
    margin-left: 10px;
}

.file-thumbnail[b-vt7xq7m67b] {
    margin: 10px 10px 10px 0px;
}

    .file-thumbnail img[b-vt7xq7m67b] {
        width: 100px;
        height: 100px;
        object-fit: cover;
        border-radius: 5px;
        border: 1px solid rgba(255, 255, 255, 0.1);
    }

.non-image-box[b-vt7xq7m67b] {
    width: 150px;
    height: 50px;
    border-radius: 5px;
    background-color: rgba(255, 255, 255, 0.05);
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
    font-size: 12px;
    text-align: center;
    border: 1px solid rgba(255, 255, 255, 0.1);
    padding: 5px;
}

.file-name[b-vt7xq7m67b] {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
}

.prompt-block[b-vt7xq7m67b] {
    padding: 5px 10px;
    flex-grow: 1;
    white-space: normal; /* Allows normal wrapping of text */
    word-break: break-all; /* Forces long words to wrap to the next line */
    overflow-wrap: break-word; /* Breaks word if exceeding container width */
}

/* Spinner for loading files */
.spinner[b-vt7xq7m67b] {
    border: 4px solid rgba(255, 255, 255, 0.2);
    border-radius: 50%;
    border-top: 4px solid white;
    width: 20px;
    height: 20px;
    animation: spin-b-vt7xq7m67b 1s linear infinite;
    padding: 5px;
    margin: 15px 0px 5px 0px;
    display: flex;
    justify-content: center;
    align-items: center;
}

@keyframes spin-b-vt7xq7m67b {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}
/* _content/kaleidoprompt.Frontend.Web/Components/Modules/UserDropdownDisplay.razor.rz.scp.css */
.user-toggler[b-v8zvhimudd] {
    --initials-content: ''; /* Default value */
    appearance: none;
    cursor: pointer;
    width: 2.1rem;
    height: 2.1rem;
    color: white;
    background-color: #AE2090;
    position: absolute;
    top: 0.7rem;
    right: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-size: 1rem;
    background-position: 13px 2px;
    background-size: contain;
    transition: background-color 0.3s, border-color 0.3s;
}

    .user-toggler[b-v8zvhimudd]::before {
        content: var(--initials-content); /* Use CSS variable */
        color: white; /* Set the text color */
        font-size: 0.9rem; /* Adjust text size as needed */
    }

    .user-toggler:hover[b-v8zvhimudd] {
        border: 1px solid rgba(255, 255, 255, 0.5);
    }

    .user-toggler:checked[b-v8zvhimudd] {
        border: 2px solid rgba(255, 255, 255, 0.5);
    }

.model-dropdown[b-v8zvhimudd] {
    display: none;
}

.user-toggler:checked ~ .model-dropdown[b-v8zvhimudd] {
    display: block;
    width: 160px;
    background: rgb(47, 47, 47);
    position: absolute;
    z-index: 1000;
    right: 1rem;
    border-radius: 10px;
}

.nav-item[b-v8zvhimudd] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
    padding-left: .5rem;
    padding-right: .5rem;
}

    .nav-item:first-of-type[b-v8zvhimudd] {
        padding-top: 0.5rem;
    }

    .nav-item:last-of-type[b-v8zvhimudd] {
        padding-bottom: 0.5rem;
    }

    .nav-item[b-v8zvhimudd]  a {
        color: #d7d7d7;
        border-radius: 4px;
        height: 2rem;
        display: flex;
        align-items: center;
        line-height: 3rem;
        cursor: pointer;
        padding-left: .5rem;
        padding-right: .5rem;
    }

        .nav-item[b-v8zvhimudd]  a:hover {
            background-color: rgba(255, 255, 255, 0.1);
            color: white;
        }

.bi[b-v8zvhimudd] {
    display: inline-block;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    top: -1px;
    background-size: cover;
}

.bi-funds[b-v8zvhimudd] {
    display: inline-block;
    position: relative;
    width: 1.4rem;
    height: 1.25rem;
    margin-right: 0.7rem;
    top: -1px;
    background-size: cover;
}


.bi-list-funds[b-v8zvhimudd] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 576 512'%3E%3Cpath fill='white' d='M512 80c8.8 0 16 7.2 16 16v32H48V96c0-8.8 7.2-16 16-16H512zm16 144V416c0 8.8-7.2 16-16 16H64c-8.8 0-16-7.2-16-16V224H528zM64 32C28.7 32 0 60.7 0 96V416c0 35.3 28.7 64 64 64H512c35.3 0 64-28.7 64-64V96c0-35.3-28.7-64-64-64H64zm56 304c-13.3 0-24 10.7-24 24s10.7 24 24 24h48c13.3 0 24-10.7 24-24s-10.7-24-24-24H120zm128 0c-13.3 0-24 10.7-24 24s10.7 24 24 24H360c13.3 0 24-10.7 24-24s-10.7-24-24-24H248z'/%3E%3C/svg%3E");
}

.bi-list-settings[b-v8zvhimudd] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='white' d='M495.9 166.6c3.2 8.7 .5 18.4-6.4 24.6l-43.3 39.4c1.1 8.3 1.7 16.8 1.7 25.4s-.6 17.1-1.7 25.4l43.3 39.4c6.9 6.2 9.6 15.9 6.4 24.6c-4.4 11.9-9.7 23.3-15.8 34.3l-4.7 8.1c-6.6 11-14 21.4-22.1 31.2c-5.9 7.2-15.7 9.6-24.5 6.8l-55.7-17.7c-13.4 10.3-28.2 18.9-44 25.4l-12.5 57.1c-2 9.1-9 16.3-18.2 17.8c-13.8 2.3-28 3.5-42.5 3.5s-28.7-1.2-42.5-3.5c-9.2-1.5-16.2-8.7-18.2-17.8l-12.5-57.1c-15.8-6.5-30.6-15.1-44-25.4L83.1 425.9c-8.8 2.8-18.6 .3-24.5-6.8c-8.1-9.8-15.5-20.2-22.1-31.2l-4.7-8.1c-6.1-11-11.4-22.4-15.8-34.3c-3.2-8.7-.5-18.4 6.4-24.6l43.3-39.4C64.6 273.1 64 264.6 64 256s.6-17.1 1.7-25.4L22.4 191.2c-6.9-6.2-9.6-15.9-6.4-24.6c4.4-11.9 9.7-23.3 15.8-34.3l4.7-8.1c6.6-11 14-21.4 22.1-31.2c5.9-7.2 15.7-9.6 24.5-6.8l55.7 17.7c13.4-10.3 28.2-18.9 44-25.4l12.5-57.1c2-9.1 9-16.3 18.2-17.8C227.3 1.2 241.5 0 256 0s28.7 1.2 42.5 3.5c9.2 1.5 16.2 8.7 18.2 17.8l12.5 57.1c15.8 6.5 30.6 15.1 44 25.4l55.7-17.7c8.8-2.8 18.6-.3 24.5 6.8c8.1 9.8 15.5 20.2 22.1 31.2l4.7 8.1c6.1 11 11.4 22.4 15.8 34.3zM256 336a80 80 0 1 0 0-160 80 80 0 1 0 0 160z'/%3E%3C/svg%3E");
}

.bi-list-usage[b-v8zvhimudd] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='white' d='M32 32c17.7 0 32 14.3 32 32l0 336c0 8.8 7.2 16 16 16l400 0c17.7 0 32 14.3 32 32s-14.3 32-32 32L80 480c-44.2 0-80-35.8-80-80L0 64C0 46.3 14.3 32 32 32zM160 224c17.7 0 32 14.3 32 32l0 64c0 17.7-14.3 32-32 32s-32-14.3-32-32l0-64c0-17.7 14.3-32 32-32zm128-64l0 160c0 17.7-14.3 32-32 32s-32-14.3-32-32l0-160c0-17.7 14.3-32 32-32s32 14.3 32 32zm64 32c17.7 0 32 14.3 32 32l0 96c0 17.7-14.3 32-32 32s-32-14.3-32-32l0-96c0-17.7 14.3-32 32-32zM480 96l0 224c0 17.7-14.3 32-32 32s-32-14.3-32-32l0-224c0-17.7 14.3-32 32-32s32 14.3 32 32z'/%3E%3C/svg%3E");
}

.bi-list-sign-out[b-v8zvhimudd] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='white' d='M502.6 278.6c12.5-12.5 12.5-32.8 0-45.3l-128-128c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L402.7 224 192 224c-17.7 0-32 14.3-32 32s14.3 32 32 32l210.7 0-73.4 73.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l128-128zM160 96c17.7 0 32-14.3 32-32s-14.3-32-32-32L96 32C43 32 0 75 0 128L0 384c0 53 43 96 96 96l64 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-64 0c-17.7 0-32-14.3-32-32l0-256c0-17.7 14.3-32 32-32l64 0z'/%3E%3C/svg%3E");
}



.line[b-v8zvhimudd] {
    border: none;
    border-top: 1px solid white; /* Change the color and thickness as needed */
    width: 90%; /* Change the width as needed */
    margin: 0px auto 10px auto; /* Change the margins as needed */
}
/* _content/kaleidoprompt.Frontend.Web/Components/Pages/Chat.razor.rz.scp.css */
.chat-page[b-d2wmgapmoq] {
    height: calc(100dvh - 3.5rem);
    display: flex;
    flex-direction: column;
    padding: 0rem 1.5rem 0.5rem 1.5rem;
}

.chat-container[b-d2wmgapmoq] {
    display: flex;
    flex-grow: 1;
    overflow: auto;
}

/* The default chat-display style for non-mobile (desktop) */
.chat-display[b-d2wmgapmoq] {
    width: 100%;
    margin-right: 20px; /* Adjust the spacing as needed */
    min-width: 0; /* Prevents flex items from growing beyond their content size */
    justify-content: center;
    display: flex;
}

    .chat-display:first-child[b-d2wmgapmoq] {
    }

    .chat-display:last-child[b-d2wmgapmoq] {
        margin-right: 0;
    }


.topbar[b-d2wmgapmoq] {
    width: 100%;
    box-sizing: border-box;
}

/* Mobile styles apply only to devices with a small screen and a coarse pointer */
@media (max-width: 768px) and (pointer: coarse) and (hover: none) {
    .chat-page[b-d2wmgapmoq] {
        padding: 0rem 0.5rem 0.5rem 0.5rem;
    }

    .chat-container[b-d2wmgapmoq] {
        align-items: stretch;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        display: flex;
        -ms-overflow-style: none; /* IE, Edge */
        scrollbar-width: none; /* Firefox */
    }
        /* Hide scrollbar on Chrome, Safari, and Opera */
        .chat-container[b-d2wmgapmoq]::-webkit-scrollbar {
            display: none;
        }

    .chat-display[b-d2wmgapmoq] {
        scroll-snap-align: start;
        flex: 0 0 100%; /* Takes full width of the container */
        margin-right: 0;
    }

    /* Dot indicator style */
    .chat-indicator[b-d2wmgapmoq] {
        display: flex;
        justify-content: center;
        margin: 0.5rem 0;
    }

    .dot[b-d2wmgapmoq] {
        height: 10px;
        width: 10px;
        margin: 0 5px;
        background-color: #383838;
        border-radius: 50%;
        display: inline-block;
    }

        .dot.active[b-d2wmgapmoq] {
            background-color: #F9B826;
        }
}

/* Ensure the dot indicator is hidden on devices that aren’t classified as mobile */
@media (min-width: 769px), (pointer: fine) {
    .chat-indicator[b-d2wmgapmoq] {
        display: none;
    }
}

/* _content/kaleidoprompt.Frontend.Web/Components/Pages/Landing.razor.rz.scp.css */
/* Overlay Styles */
.overlay[b-xqhu4kfyqw] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100dvh;
    background-color: rgba(19, 19, 20, 0.9); /* Semi-transparent background */
    display: none; /* Hidden by default */
    justify-content: center; /* Center horizontally */
    align-items: center; /* Center vertically */
    z-index: 10000; /* On top of other elements */
}
/* _content/kaleidoprompt.Frontend.Web/Components/Pages/PaymentCancel.razor.rz.scp.css */


.container-fluid[b-asksiyhifr] {
    padding-top: 20px;
    align-items: center; /* Center horizontally */
    width: 100%;
    max-width: 800px;
}

/* Centered Content */
.centered-content[b-asksiyhifr] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    margin-bottom: 20px;
}

    .centered-content h1.display-4[b-asksiyhifr] {
        font-weight: 600;
        color: #ffffff;
        font-size: 2.5rem;
        margin-bottom: 15px;
    }

    .centered-content p.lead[b-asksiyhifr] {
        color: #f9f9f9;
        font-size: 1.2rem;
        margin-bottom: 10px;
    }



/* Main Link Styling */
.main-link[b-asksiyhifr] {
    color: white; 
    text-decoration: none;
    font-size: 1rem;
    transition: color 0.3s ease, text-decoration 0.3s ease;
    text-decoration: underline;
    margin-left: -10px;
}

    .main-link:hover[b-asksiyhifr] {
        color: rgba(255, 255, 255, 0.5);
        text-decoration: underline;
    }

/* _content/kaleidoprompt.Frontend.Web/Components/Pages/PaymentSuccess.razor.rz.scp.css */

.container-fluid[b-p91uy4khf7] {
    padding-top: 20px;
    align-items: center; /* Center horizontally */
    width: 100%;
    max-width: 800px;
}

/* Centered Content */
.centered-content[b-p91uy4khf7] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    margin-bottom: 20px;
}

    .centered-content h1.display-4[b-p91uy4khf7] {
        font-weight: 600;
        color: #ffffff;
        font-size: 2.5rem;
        margin-bottom: 15px;
    }

    .centered-content p.lead[b-p91uy4khf7] {
        color: #f9f9f9;
        font-size: 1.2rem;
        margin-bottom: 10px;
    }


.main-link[b-p91uy4khf7] {
    color: white;
    text-decoration: none;
    font-size: 1rem;
    transition: color 0.3s ease, text-decoration 0.3s ease;
    text-decoration: underline;
    margin-left: -10px;
}


.card[b-p91uy4khf7] {
    background-color: #1e1e1e;
    border: none;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
    margin-bottom: 20px;
    width: 80%;
}

.account-details[b-p91uy4khf7] {
    width: 100%;
    margin-top: 20px;
}

    .account-details table[b-p91uy4khf7] {
        width: 100%;
        margin: 0 auto;
    }

    .account-details th[b-p91uy4khf7],
    .account-details td[b-p91uy4khf7] {
        text-align: left;
        padding: 5px;
        vertical-align: middle;
    }

    .account-details th[b-p91uy4khf7] {
        color: #ffffff;
        font-size: 1rem;
    }

    .account-details td[b-p91uy4khf7] {
        font-size: 0.95rem;
    }

    /* Emphasize New Balance */
    .account-details tbody tr:last-child td[b-p91uy4khf7] {
        font-weight: bold;
        color: #ffffff;
        background-color: #1e1e1e;
    }
/* _content/kaleidoprompt.Frontend.Web/Components/Pages/Pricing.razor.rz.scp.css */
/* General Container Styling */

.container-fluid[b-7zh58bcrnq] {
    padding-top: 20px;
    align-items: center; /* Center horizontally */
    width: 100%;
    max-width: 800px;
}

/* Centered Content */
.centered-content[b-7zh58bcrnq] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    margin-bottom: 20px;
}

    .centered-content h1.display-4[b-7zh58bcrnq] {
        font-weight: 600;
        color: #ffffff;
        font-size: 2.5rem;
        margin-bottom: 15px;
    }

    .centered-content p.lead[b-7zh58bcrnq] {
        color: #f9f9f9;
        font-size: 1.2rem;
        margin-bottom: 10px;
    }

    .centered-content p.description[b-7zh58bcrnq] {
        margin-top: 10px;
        font-size: 1rem;
        color: #d9d9d9;
        max-width: 700px;
        line-height: 1.6;
    }

/* Calculation Example & Token Understanding */
.calculation-example[b-7zh58bcrnq],
.token-understanding[b-7zh58bcrnq],
.minimize-cost[b-7zh58bcrnq] {
    background-color: #1e1e1e;
    border: 1px solid #444;
    border-radius: 8px;
    padding: 15px;
    margin-bottom: 25px;
}

    .calculation-example h3[b-7zh58bcrnq],
    .token-understanding h3[b-7zh58bcrnq],
    .minimize-cost h3[b-7zh58bcrnq] {
        font-size: 1.3rem;
        margin-bottom: 10px;
        color: rgb(236, 236, 236);
    }

    .calculation-example p[b-7zh58bcrnq],
    .token-understanding p[b-7zh58bcrnq],
    .calculation-example li[b-7zh58bcrnq],
    .token-understanding li[b-7zh58bcrnq] {
        color: #f1f1f1;
        font-size: 0.95rem;
        margin-bottom: 5px;
    }

    .minimize-cost p[b-7zh58bcrnq],
    .minimize-cost li[b-7zh58bcrnq] {
        color: #f1f1f1;
        font-size: 0.95rem;
        margin-bottom: 10px;
    }


    .calculation-example ul[b-7zh58bcrnq],
    .token-understanding ul[b-7zh58bcrnq],
    .minimize-cost ul[b-7zh58bcrnq] {
        list-style-type: none;
        padding: 0;
    }

    .calculation-example p[b-7zh58bcrnq],
    .token-understanding p[b-7zh58bcrnq],
    .minimize-cost p[b-7zh58bcrnq] {
        color: #d9d9d9;
        font-size: 1rem;
        margin-bottom: 10px;
    }

/* Pricing Tables */
.card[b-7zh58bcrnq] {
    background-color: #1e1e1e;
    border: none;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
    margin-bottom: 20px;
}

.card-header[b-7zh58bcrnq] {
    background-color: #2a2a2a;
    border-bottom: 1px solid #444;
    padding: 10px 0px 0px 15px;
    border-radius: 8px 8px 0px 0px;
}

    .card-header h2[b-7zh58bcrnq] {
        margin: 0;
        font-size: 1.3rem;
        color: #ffffff;
    }

.table[b-7zh58bcrnq] {
    margin-bottom: 0;
    table-layout: fixed;
    width: 100%;
}

    .table th[b-7zh58bcrnq],
    .table td[b-7zh58bcrnq] {
        color: #f1f1f1;
        font-size: 0.85rem;
        word-wrap: break-word;
    }

    .table th[b-7zh58bcrnq] {
        font-weight: 500;
        color: #ffffff;
        font-size: 0.85rem;
    }

    .table th[b-7zh58bcrnq],
    .table td[b-7zh58bcrnq] {
        width: 25%;
    }

        .table th:first-child[b-7zh58bcrnq],
        .table td:first-child[b-7zh58bcrnq] {
            width: 25%;
        }

.table-hover tbody tr:hover[b-7zh58bcrnq] {
    background-color: #333333;
}

.text-muted[b-7zh58bcrnq] {
    color: #a1a1a1 !important;
    font-style: italic;
}

/* Responsive Design */
@media (max-width: 768px) {
    .centered-content h1.display-4[b-7zh58bcrnq] {
        font-size: 2rem;
    }

    .centered-content p.lead[b-7zh58bcrnq] {
        font-size: 1rem;
    }

    .centered-content p.description[b-7zh58bcrnq] {
        font-size: 0.9rem;
    }

    .calculation-example h3[b-7zh58bcrnq],
    .token-understanding h3[b-7zh58bcrnq] {
        font-size: 1.1rem;
    }

    .calculation-example p[b-7zh58bcrnq],
    .token-understanding p[b-7zh58bcrnq],
    .calculation-example li[b-7zh58bcrnq],
    .token-understanding li[b-7zh58bcrnq] {
        font-size: 0.9rem;
    }

    .table th[b-7zh58bcrnq],
    .table td[b-7zh58bcrnq] {
        font-size: 0.75rem;
    }

    .table th[b-7zh58bcrnq],
    .table td[b-7zh58bcrnq] {
        width: 30%;
    }

        .table th:first-child[b-7zh58bcrnq],
        .table td:first-child[b-7zh58bcrnq] {
            width: 40%;
        }
}
/* _content/kaleidoprompt.Frontend.Web/Components/Pages/PrivacyPolicy.razor.rz.scp.css */
.container-fluid[b-oa4syu3xqp] {
    padding-top: 20px;
    align-items: center; /* Center horizontally */
    width: 100%;
    max-width: 800px;
}

/* Centered Content */
.centered-content[b-oa4syu3xqp] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    margin-bottom: 20px;
}

    .centered-content h1.display-4[b-oa4syu3xqp] {
        font-weight: 600;
        color: #ffffff;
        font-size: 2.5rem;
        margin-bottom: 15px;
    }

    .centered-content p.lead[b-oa4syu3xqp] {
        color: #f9f9f9;
        font-size: 1.2rem;
        margin-bottom: 10px;
    }

/* Policy Content Styling */
.policy-content[b-oa4syu3xqp] {
    color: #f9f9f9;
    text-align: left;
    max-width: 800px;
}

    .policy-content h2[b-oa4syu3xqp] {
        color: #ffffff;
        font-size: 1.5rem;
        margin-top: 20px;
    }

    .policy-content p[b-oa4syu3xqp], .policy-content ul[b-oa4syu3xqp], .policy-content li[b-oa4syu3xqp] {
        color: #f9f9f9;
        font-size: 1rem;
        line-height: 1.5;
    }

    .policy-content ul[b-oa4syu3xqp] {
        list-style-type: disc;
        margin-left: 20px;
    }

    .policy-content a[b-oa4syu3xqp] {
        color: #ffffff;
        text-decoration: underline;
    }

        .policy-content a:hover[b-oa4syu3xqp] {
            color: rgba(255, 255, 255, 0.7);
        }

/* Main Link Styling */
.main-link[b-oa4syu3xqp] {
    color: white;
    text-decoration: none;
    font-size: 1rem;
    transition: color 0.3s ease, text-decoration 0.3s ease;
    text-decoration: underline;
    margin-left: -10px;
}

    .main-link:hover[b-oa4syu3xqp] {
        color: rgba(255, 255, 255, 0.5);
        text-decoration: underline;
    }
/* _content/kaleidoprompt.Frontend.Web/Components/Pages/TermsOfService.razor.rz.scp.css */
.container-fluid[b-g16ae52cc1] {
    padding-top: 20px;
    align-items: center; /* Center horizontally */
    width: 100%;
    max-width: 800px;
}

/* Centered Content */
.centered-content[b-g16ae52cc1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    margin-bottom: 20px;
}

    .centered-content h1.display-4[b-g16ae52cc1] {
        font-weight: 600;
        color: #ffffff;
        font-size: 2.5rem;
        margin-bottom: 15px;
    }

    .centered-content p.lead[b-g16ae52cc1] {
        color: #f9f9f9;
        font-size: 1.2rem;
        margin-bottom: 10px;
    }

/* Policy Content Styling */
.policy-content[b-g16ae52cc1] {
    color: #f9f9f9;
    text-align: left;
    max-width: 800px;
}

    .policy-content h2[b-g16ae52cc1] {
        color: #ffffff;
        font-size: 1.5rem;
        margin-top: 20px;
    }

    .policy-content p[b-g16ae52cc1], .policy-content ul[b-g16ae52cc1], .policy-content li[b-g16ae52cc1] {
        color: #f9f9f9;
        font-size: 1rem;
        line-height: 1.5;
    }

    .policy-content ul[b-g16ae52cc1] {
        list-style-type: disc;
        margin-left: 20px;
    }

    .policy-content a[b-g16ae52cc1] {
        color: #ffffff;
        text-decoration: underline;
    }

        .policy-content a:hover[b-g16ae52cc1] {
            color: rgba(255, 255, 255, 0.7);
        }

/* Main Link Styling */
.main-link[b-g16ae52cc1] {
    color: white;
    text-decoration: none;
    font-size: 1rem;
    transition: color 0.3s ease, text-decoration 0.3s ease;
    text-decoration: underline;
    margin-left: -10px;
}

    .main-link:hover[b-g16ae52cc1] {
        color: rgba(255, 255, 255, 0.5);
        text-decoration: underline;
    }
