﻿@font-face {
	font-family: Inter;
	font-style: normal;
	font-weight: 100;
	font-display: swap;
	src: url('../../Static/Fonts/Inter/Inter-Thin.ttf') format('truetype');
}
@font-face {
	font-family: Inter;
	font-style: normal;
	font-weight: 200;
	font-display: swap;
	src: url('../../Static/Fonts/Inter/Inter-ExtraLight.ttf') format('truetype');
}
@font-face {
	font-family: Inter;
	font-style: normal;
	font-weight: 300;
	font-display: swap;
	src: url('../../Static/Fonts/Inter/Inter-Light.ttf') format('truetype');
}
@font-face {
	font-family: Inter;
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('../../Static/Fonts/Inter/Inter-Regular.ttf') format('truetype');
}
@font-face {
	font-family: Inter;
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url('../../Static/Fonts/Inter/Inter-Medium.ttf') format('truetype');
}
@font-face {
	font-family: Inter;
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url('../../Static/Fonts/Inter/Inter-SemiBold.ttf') format('truetype');
}
@font-face {
	font-family: Inter;
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url('../../Static/Fonts/Inter/Inter-Bold.ttf') format('truetype');
}
@font-face {
	font-family: Inter;
	font-style: normal;
	font-weight: 800;
	font-display: swap;
	src: url('../../Static/Fonts/Inter/Inter-ExtraBold.ttf') format('truetype');
}
@font-face {
	font-family: Inter;
	font-style: normal;
	font-weight: 900;
	font-display: swap;
	src: url('../../Static/Fonts/Inter/Inter-Black.ttf') format('truetype');
}

/*****************************************************************************/
/*** Base Elements                                                         ***/
/*****************************************************************************/
body {
	font-family: 'Inter', Arial, sans-serif;
	font-size: 14px;
	background-color: #fdfbff;
	color: #5e5959;
}
h1, h2, h3, h4, h5, h6 {
	font-family: 'Inter', Arial, sans-serif;
	font-weight: 600;
	color: #5e5959;
}
h1 {
	font-size: 26px;
}
h2 {
	font-size: 22px;
}
h3 {
	font-size: 18px;
}
h4 {
	font-size: 14px;
}
h5 {
	font-size: 14px;
}
h6 {
	font-size: 14px;
}
a {
	color: #408fc1;
	text-decoration: none;
}
a:hover {
	color: #7fc9ff;
}
i.fa-light, i.fa-regular {
	color: #8c64f1;
}
i.fa-check.green {
	color: #3bdbb3;
	font-size: 18px;
	font-weight: 600;
}
i.fa-xmark.red {
	color: #ff0000;
	font-size: 18px;
	font-weight: 600;
}
i.fa-ellipsis-vertical {
	cursor: pointer;
}
.i-12 {
	font-size: 12px !important;
}
.i-14 {
	font-size: 14px !important;
}
.i-16 {
	font-size: 16px !important;
}
.i-18 {
	font-size: 18px !important;
}
.i-20 {
	font-size: 20px !important;
}
.i-22 {
	font-size: 22px !important;
}
.i-24 {
	font-size: 24px !important;
}
.i-64 {
	font-size: 64px !important;
}
.error {
  border-color: #a31b28;
}
.hide {
	display: none;
}
.monospace {
	font-family: monospace;
	font-size: 14px;
}
.monospace.bg {
    background-color: #ebebeb;
    border: solid 1px #a9a9a9;
    padding: 5px;
}

/*****************************************************************************/
/*** Bootstrap Overrides                                                   ***/
/*****************************************************************************/
label.error,
span.error {
	font-size: 13px;
	color: #a31b28;
}
.form-control,
.form-select {
	font-size: 1em;
	border-radius: 4px;
	padding-top: .35rem;
	padding-bottom: .35rem;
	color: #5e5959;
}
.form-control:focus {
	color: #5e5959;
}
.form-control::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #c1c1c1;
  opacity: 1; /* Firefox */
}
.form-control:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color: #c1c1c1;
}
.form-control::-ms-input-placeholder { /* Microsoft Edge */
	color: #c1c1c1;
}
.form-label {
	margin-bottom: .35rem;
}
.form-label strong {
	font-weight: 600;
}
.form-check-input {
	width: 1.25em;
	height: 1.25em;
	margin-top: .15em;
}
.form-check-input:checked {
	/*background-color: #9370db;
	border-color: #9370db;*/
	background-color: #8c64f1;
	border-color: #8c64f1;
}
.form-password-toggle {
	float: right;
	margin-top: -25px;
	margin-right: 10px;
	cursor: pointer;
}

/* Custom styles for input rage sliders, see https://www.smashingmagazine.com/2021/12/create-custom-range-input-consistent-browsers/ */
/* Chrome, Safari, Opera and Edge Chromium */
input[type="range"]::-webkit-slider-thumb {
	background-color: #8c64f1;
}
input[type="range"]:active::-webkit-slider-thumb {
	background-color: #8c64f1;
}
input[type="range"]:focus::-webkit-slider-thumb {
	outline: solid 1px #8c64f1;
	outline-offset: 0.125rem;
}
/* Firefox */
input[type="range"]::-moz-range-thumb {
	background-color: #8c64f1;
}
input[type="range"]:active::-moz-range-thumb {
	background-color: #8c64f1;
}
input[type="range"]:focus::-moz-range-thumb {
	outline: solid 1px #8c64f1;
	outline-offset: 0.125rem;
}
.alert {
	border-radius: 4px;
	padding-top: .5rem;
	padding-bottom: .5rem;
}
.alert-danger {
	background-color: #fdeced;
}
.alert-info {
	background-color: #f3f8fe;
	border-color: #96bff5;
}
.alert-success {
	background-color: #f1fbf7;
}
.gy-5 {
	margin-top: 5px;
}
.gy-8 {
	margin-top: 8px;
}
.gy-10 {
	margin-top: 10px;
}
.gy-20 {
	margin-top: 20px;
}
.gy-30 {
	margin-top: 30px;
}
.gy-40 {
	margin-top: 40px;
}
.gy-50 {
	margin-top: 50px;
}
.gy-60 {
	margin-top: 60px;
}
.ml-5 {
	margin-left: 5px;
}
.ml-10 {
	margin-left: 10px;
}
.ml-15 {
	margin-left: 15px;
}
.ml-20 {
	margin-left: 20px;
}
.ml-30 {
	margin-left: 30px;
}
.mr-5 {
	margin-right: 5px;
}
.mr-10 {
	margin-right: 10px;
}
.mr-15 {
	margin-right: 15px;
}
.mr-20 {
	margin-right: 20px;
}
.mr-30 {
	margin-right: 30px;
}
.pl-5 {
	padding-left: 5px;
}
.pl-10 {
	padding-left: 10px;
}
.pl-15 {
	padding-left: 15px;
}
.pl-20 {
	padding-left: 20px;
}
.pl-30 {
	padding-left: 30px;
}
.pr-5 {
	padding-right: 5px;
}
.pr-10 {
	padding-right: 10px;
}
.pr-15 {
	padding-right: 15px;
}
.pr-20 {
	padding-right: 20px;
}
.pr-30 {
	padding-right: 30px;
}
.w-10 {
	width: 10% !important;
}
.w-15 {
	width: 15% !important;
}
.w-20 {
	width: 20% !important;
}
.w-25 {
	width: 25% !important;
}
.w-30 {
	width: 30% !important;
}
.w-35 {
	width: 35% !important;
}
.w-40 {
    width: 40% !important;
}
.h-200 {
	height: 200px;
}
.h-300 {
	height: 300px;
}
.h-400 {
	height: 400px;
}
.btn {
	border-radius: 4px;
}
.btn-group {
	border-radius: 4px;
}
.btn-success {
	color: #ffffff;
	padding: 8px 16px;
	background-color: #19af8a;
	border-radius: 4px;
	border: none;
	font-size: 14px;
}
.btn-success:hover {
	color: #ffffff;
	text-decoration: none;
	background-color: #1bb992;
}
.dropdown-menu {
	font-size: 14px;
	border-radius: 4px;
}
.dropdown-item {
	color: #5e5959;
}
.tooltip-inner {
	text-align: left !important;
    /*min-width: 220px;
    max-width: 220px;*/
}
.tooltip-inner ul {
	padding-left: 5px;
}
.tooltip-inner ul li {
	list-style-type: none;
}
.modal-body {
	color: #5e5959;
}
.offcanvas-title {
	font-size: 20px;
}

/*****************************************************************************/
/*** EasyMDE Overrides                                                     ***/
/*****************************************************************************/
.EasyMDEContainer .CodeMirror {
	font-family: monospace;
	color: #5e5959;
}
.EasyMDEContainer button.table {
	width: unset;
}
.EasyMDEContainer .editor-preview-full {
	padding: 14px;
}
.EasyMDEContainer .editor-preview-full pre code {
	font-size: 14px;
}
.EasyMDEContainer .editor-preview-full h1 {
	font-size: 18px;
	font-family: monospace;
	font-weight: 600;
}
.EasyMDEContainer .editor-preview-full h2 {
	font-size: 18px;
	font-family: monospace;
	font-weight: 600;
}
.EasyMDEContainer .editor-preview-full h3 {
	font-size: 18px;
	font-family: monospace;
	font-weight: 600;
}
.EasyMDEContainer .cm-s-easymde .cm-header-1 {
	font-size: 18px;
}
.EasyMDEContainer .cm-s-easymde .cm-header-2 {
	font-size: 18px;
}
.EasyMDEContainer .cm-s-easymde .cm-header-3 {
	font-size: 18px;
}
.EasyMDEContainer .cm-s-easymde .cm-header-4 {
	font-size: 18px;
}

/*****************************************************************************/
/*** App                                                                   ***/
/*****************************************************************************/
.page-header .page-title {
	margin: 30px 0px 30px 0;
	font-size: 30px;
}
.page-header .page-settings {
	margin-top: 37px;
}
.prefill-questions button {
	max-width: 225px;
	font-size: 0.85rem;
}
.prefill-questions button:hover {
	background-color: #f3f3f3;
	color: #5e5959;
}
.codenav-box {
	margin-bottom: 30px;
}
.codenav-box__content {
    border: solid 1px #f1f1f1;
    padding: 30px;
    background-color: #ffffff;
}
.codenav-box__content select {
	width: 225px;
	margin-top: 10px;
}
.codenav-box__content select:first-of-type {
	margin-right: 15px;
}
.user-input-container {
	margin-bottom: 15px;
}
.codenav-button__purple {
    color: #ffffff;
    padding: 8px 16px;
    background-color: #956cf9;
    border-radius: 4px;
    border: none;
    font-size: 14px;
}
.codenav-button__purple i {
	color: #ffffff;
	font-size: 18px;
	vertical-align: text-top;
}
.codenav-button__red {
	color: #ffffff;
	padding: 8px 16px;
	background-color: #dc3545;
	border-radius: 4px;
	border: none;
	font-size: 14px;
}
.codenav-button__red:hover {
	background-color: #c82333;
}
.codenav-button__red i {
	color: #ffffff;
	font-size: 18px;
	vertical-align: text-top;
}
.stopped-indicator {
	color: #6c757d;
	font-style: italic;
	margin-top: 10px;
}
#document-upload-section hr {
	border-color: #f1f1f1;
	opacity: 1;
}
.upload-repo-label {
	color: #5e5959;
}
.messages .codenav-box__content {
    padding-bottom: 0;
}
.messages .message {
	margin-bottom: 30px;
	padding: 15px 15px 0 15px;
	border-radius: 3px;
}
.messages .message li {
	margin-top: 5px;
	margin-bottom: 5px;
}
.messages .message.user {
	border: solid 1px #e4f2ff;
	background-color: #f5faff;
	float: right;
	width: 80%;
}
.messages .message.assistant {
	border: solid 1px #f1f1f1;
	background-color: #fbfbfb;
}
.messages .message.assistant h1 {
	margin-bottom: 15px;
}
.messages .message.assistant h2,
.messages .message.assistant h3,
.messages .message.assistant h4 {
	margin-top: 30px;
	margin-bottom: 15px;
}
.messages .message.assistant table {
	width: 100%;
	margin-top: 15px;
	margin-bottom: 15px;
	background-color: #ffffff;
	table-layout: fixed;
}
.messages .message.assistant table th {
	border-top: solid 1px #e5e5e5;
	border-bottom: solid 1px #e5e5e5;
	padding: 10px;
	font-weight: 600;
}
.messages .message.assistant table td {
	padding: 15px 10px 15px 10px;
	border-bottom: solid 1px #e5e5e5;
	overflow-wrap: break-word;
	word-wrap: break-word;
}
.messages .message.spinner {
	padding: 0;
	margin-top: -10px;
	font-style: italic;
}
.messages .message.metadata {
	padding: 8px 16px;
	border: solid 1px #f1f1f1;
	background-color: #fbfbfb;
	font-size: 12px;
	text-align: right;
	margin-top: -30px;
}
.messages .message.metadata .item {
	margin-left: 20px;
}

/*****************************************************************************/
/*** Chat Layout                                                           ***/
/*****************************************************************************/
.chat-layout {
	display: flex;
	flex-direction: column;
	height: 100vh;
	overflow: hidden;
}
.chat-layout__header {
	flex-shrink: 0;
	padding: 0 15px;
}
.chat-layout__header .page-title {
	margin: 30px 0;
	font-size: 30px;
}
.chat-layout__header .page-settings {
	margin-top: 37px;
}
.chat-layout__messages {
	flex: 1;
	overflow-y: auto;
	padding-left: 15px;
}
.chat-layout__messages .codenav-box {
	margin-bottom: 0;
}
.chat-layout__input {
	flex-shrink: 0;
	padding: 30px 15px 30px 15px;
	background-color: #fdfbff;
}
.chat-layout__input .codenav-box {
	margin-bottom: 0;
}

/*****************************************************************************/
/*** App Container & Sidebar                                               ***/
/*****************************************************************************/
.app-container {
	display: flex;
	min-height: 100vh;
	height: 100vh;
	overflow: hidden;
}
.main-content {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	overflow: hidden;
}
.main-content > .container {
	flex: 1;
	display: flex;
	flex-direction: column;
	overflow: hidden;
}
.main-content > .container > .row {
	flex: 1;
	overflow: hidden;
}
.main-content > .container > .row > [class*="col-"] {
	display: flex;
	flex-direction: column;
	overflow: hidden;
}
.session-sidebar {
	position: sticky;
	top: 0;
	width: 300px;
	min-width: 300px;
	height: 100vh;
	background-color: #f8f7fc;
	border-right: solid 1px #e8e5f0;
	display: flex;
	flex-direction: column;
	overflow: hidden;
}
.session-sidebar__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 20px 16px 16px 16px;
	border-bottom: solid 1px #e8e5f0;
}
.session-sidebar__header h4 {
	margin: 0;
	font-size: 16px;
	font-weight: 600;
	color: #5e5959;
}
.session-sidebar__new-chat {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: 6px;
	background-color: #956cf9;
	color: #ffffff;
	text-decoration: none;
	transition: background-color 0.2s ease;
}
.session-sidebar__new-chat:hover {
	background-color: #8c64f1;
	color: #ffffff;
}
.session-sidebar__new-chat i {
	color: #ffffff;
	font-size: 14px;
}
.session-sidebar__list {
	flex: 1;
	overflow-y: auto;
	padding: 12px 8px;
}
.session-sidebar__empty {
	padding: 20px 12px;
	text-align: center;
	color: #999999;
	font-size: 13px;
}
.session-sidebar__item {
	display: block;
	padding: 12px;
	margin-bottom: 4px;
	border-radius: 6px;
	text-decoration: none;
	color: #5e5959;
	transition: background-color 0.15s ease;
}
.session-sidebar__item:hover {
	background-color: #efedf5;
	color: #5e5959;
}
.session-sidebar__item.active {
	background-color: #e8e3f5;
}
.session-sidebar__item-name {
	font-size: 14px;
	font-weight: 500;
	line-height: 1.4;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.session-sidebar__item-date {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: 12px;
	color: #999999;
	margin-top: 4px;
}
.session-sidebar__delete-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	border: none;
	border-radius: 4px;
	background-color: transparent;
	color: #999999;
	cursor: pointer;
	margin-left: 8px;
	flex-shrink: 0;
	visibility: hidden;
	opacity: 0;
	transition: background-color 0.15s ease, color 0.15s ease, opacity 0.15s ease;
}
.session-sidebar__item:hover .session-sidebar__delete-btn {
	visibility: visible;
	opacity: 1;
}
.session-sidebar__delete-btn:hover {
	background-color: #e0e7ff;
	color: #dc2626;
}
.session-sidebar__delete-btn i {
	font-size: 12px;
}
/* Scrollbar styling for sidebar */
.session-sidebar__list::-webkit-scrollbar {
	width: 6px;
}
.session-sidebar__list::-webkit-scrollbar-track {
	background: transparent;
}
.session-sidebar__list::-webkit-scrollbar-thumb {
	background-color: #d0ccd8;
	border-radius: 3px;
}
.session-sidebar__list::-webkit-scrollbar-thumb:hover {
	background-color: #b8b3c2;
}
/* Responsive: hide sidebar on small screens */
@media (max-width: 992px) {
	.session-sidebar {
		display: none;
	}
}

/*****************************************************************************/
/*** Multi-Select Checkbox Dropdown                                        ***/
/*****************************************************************************/
.multiselect-dropdown {
	position: relative;
	margin-top: 10px;
}
.multiselect-dropdown__toggle {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	padding: 0.35rem 2.25rem 0.35rem 0.75rem;
	font-size: 1em;
	font-weight: 400;
	line-height: 1.5;
	color: #5e5959;
	background-color: #fff;
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
	background-repeat: no-repeat;
	background-position: right 0.75rem center;
	background-size: 16px 12px;
	border: 1px solid #dee2e6;
	border-radius: 4px;
	cursor: pointer;
	min-height: 34px;
}
.multiselect-dropdown__toggle:hover {
	border-color: #86b7fe;
}
.multiselect-dropdown__toggle.open {
	border-color: #86b7fe;
	box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
	border-radius: 4px 4px 0 0;
}
.multiselect-dropdown__placeholder {
	color: #6c757d;
}
.multiselect-dropdown__selected-text {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	flex: 1;
}
.multiselect-dropdown__menu {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	z-index: 1000;
	max-height: 200px;
	overflow-y: auto;
	background-color: #fff;
	border: 1px solid #86b7fe;
	border-top: none;
	border-radius: 0 0 4px 4px;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.multiselect-dropdown__menu.show {
	display: block;
}
.multiselect-dropdown__item {
	display: flex;
	align-items: center;
	padding: 0.5rem 0.75rem;
	cursor: pointer;
	transition: background-color 0.15s ease;
}
.multiselect-dropdown__item:hover {
	background-color: #f8f9fa;
}
.multiselect-dropdown__item input[type="checkbox"] {
	width: 1.1em;
	height: 1.1em;
	margin-right: 0.5rem;
	accent-color: #8c64f1;
	cursor: pointer;
}
.multiselect-dropdown__item label {
	flex: 1;
	margin: 0;
	cursor: pointer;
	user-select: none;
}
.multiselect-dropdown__empty {
	padding: 0.5rem 0.75rem;
	color: #6c757d;
	font-style: italic;
}
