.eg-gpt-wrapper {
    max-height: 100%;
    height: 85vh;
    box-sizing: border-box;
    font-size: 16px;
}

.eg-gpt-wrapper-content {
    height: 100%;
}

.eg-gpt-tabs {
    display: grid;
    grid-template-rows: 42px auto;
    height: 100%;
}

.eg-gpt-tab-wrapper, 
.eg-gpt-tab-wrapper > .tab-pane,
.eg-gpt-tab-wrapper > .tab-pane > .panel-body,
.eg-gpt-tab-wrapper > .tab-pane > .gpt-ui-type-content {
    height: 100%;
    min-height: 0;
}

.eg-gpt {
    width: 100%;
    height: 100%;
    max-width: 1000px;
    min-height: 100px;
    max-height: none;
    box-sizing: border-box;
    margin: 0 auto;
    position: relative;
    left: 0;
    right: 0;
    top: 0;
    margin: 0 auto;
    display: grid;
    grid-template-rows: 1px auto 40px;
}

.eg-gpt-wrapper .eg-gpt-close {
    display: none;
    position: absolute;
    right: -10px;
    top: -10px;
    width: 30px;
    height: 30px;
    background-color: #0009;
    color: #fff;
    border-radius: 15px;
    line-height: 30px;
    font-size: 20px;
    text-align: center;
}

.eg-gpt-header, .eg-gpt-content, .eg-gpt-footer {
    clear: both;
    width: 100%;
    box-sizing: border-box;
}

.eg-gpt-header {
    padding: 10px;
    clear: both;
    box-sizing: border-box;
}

.eg-gpt-footer {
    padding: 10px;
    box-sizing: border-box;
    display: grid;
    grid-template-columns: 0.8fr 0.2fr;
}

.eg-gpt-footer-controls.right {
    float: right;
    clear: both;
    text-align: right;
}

.eg-gpt-header h3 {
    margin: 0; 
    padding: 0;
}


.eg-gpt-content {
    display: grid;
    grid-template-rows: auto 100px;
    box-sizing: border-box;
    min-height: 0;
}

div.eg-gpt-request {
    height: 100%;
    box-sizing: border-box;
    display: grid;
    grid-template-rows: auto 100px;
    box-sizing: border-box;
}

div.eg-gpt-request-cols-ui {
    height: 100%;
    padding: 5px;
    display: block;
    box-sizing: border-box;
    position: relative;
}

.eg-gpt .eg-gpt-request-refinement-controls {
    display: block;
    visibility: hidden;
    height: 1px;
    overflow-y: hidden;
    color: #555;
}

.eg-gpt.refinement-controls-visible .eg-gpt-request-refinement-controls {
    display: block;
    visibility: visible;
    height: auto;
    overflow-y: visible;
}

.eg-gpt.refinement-controls-visible .eg-gpt-request-refinement-controls .eg-gpt-controls {
    /*width: 100%;*/
}

.eg-gpt.refinement-controls-visible .eg-gpt-content {
    grid-template-rows: auto max-content;
    transition: ease-in-out 0.2s;
}

.eg-gpt.refinement-controls-visible .eg-gpt-request {
    grid-template-rows: auto 100px;
    transition: ease-in-out 0.2s;
}

.eg-gpt-request-controls {
    display: flex;
    align-items: center;
}

.eg-gpt-request-input-controls {
    padding-left: 5px;
    position: absolute;
    bottom: 20px;
    right: 15px;
    display: none;
}

.eg-gpt-request-input-controls.no-text {
    display: none;
}

.eg-gpt-request-input-controls.has-text {
    display: block;
}

.eg-gpt .eg-gpt-request-input-controls.pending-response .send-button,
.eg-gpt .eg-gpt-request-input-controls.no-text.pending-response .send-button {
    background-image: 
        url("/gpt/img/stop-icon.png"),
        url("/gpt/img/generate-button.png");
}

.eg-gpt .eg-gpt-request-input-controls.no-text.pending-response {
    display: block;
}

.eg-gpt-result {
    padding: 10px;
    display: grid;
    /*grid-template-rows: 50px 1px auto;*/
    grid-template-rows: 100%;
    overflow-y: hidden;
}

.eg-gpt-result-controls {
    height: 50px;
    overflow: visible;
}

.eg-gpt-request-input {
    display: block;
    height: 80px;
}

.eg-gpt-request-input-textarea,
textarea.eg-gpt-request-input-textarea,
textarea.form-control.eg-gpt-request-input-textarea {
    width: 100%;
    height: 100%;
    border-radius: 10px;
    box-sizing: border-box;
    padding-right: 50px;
}

.eg-gpt-result-preview {
    /*border: 1px solid #0003;*/
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    padding: 0px;
    overflow-y: auto;
}

.eg-gpt-preview-wrapper {
    width: 100%;
    height: 100%;
    box-sizing: border-box;
}

.eg-gpt-preview {
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
}

.eg-gpt-preview .placeholder {
    float: left;
    width: 100%;
    box-sizing: border-box;
    position: relative;
}

.eg-gpt-preview .image-placeholder  {
    background-position: center center;
    background-size: contain;
    background-repeat: no-repeat;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

.eg-gpt-preview .text-placeholder {
    background-color: #fff3;
    border-radius: 10px;
    padding: 3px;
}

.eg-gpt-result-controls-break {
    display: block;
    height: 1px;
    clear: both;
    border-bottom: 1px solid #f3f3f3;
}

.eg-gpt-result .eg-gpt-control {
    display: block;
}

.eg-gpt-result .eg-gpt-control.new {
    display: none;
}

.eg-gpt-result.not-empty .eg-gpt-controls-wrapper .eg-gpt-control.new {
    display: table-cell;
}

.eg-gpt-ui .empty-placeholder,
.eg-gpt-ui .empty-placeholder {
    display: grid;
    width: 100%;
    height: 100%;
    align-items: center;
    justify-items: center;
    text-align: center;
    box-sizing: border-box;
    background-color: #f9f9f999;
    border-radius: 10px;
}

.eg-gpt-ui .eg-gpt-ui-type-content-inner {
    display: grid;
    grid-template-columns: auto 20px;
    height: 100%;
}

.eg-gpt-ui .eg-gpt-ui-type-content-inner .eg-gpt-navigation-buttons {
    display: none;
    grid-template-rows: 0.33fr 0.33fr 0.33fr;
}

.eg-gpt-ui.not-empty .eg-gpt-ui-type-content-inner .eg-gpt-navigation-buttons {
    display: grid;
}

.eg-gpt-ui .eg-gpt-ui-type-content-inner .eg-gpt-navigation-buttons button {
    font-size: 0.8rem;
    padding: 3px;
    opacity: 0.3;
}

.eg-gpt-ui .eg-gpt-ui-type-content-inner .eg-gpt-navigation-buttons .eg-gpt-navigation-button-adjacent > div {
    margin-bottom: 10px;
}

.eg-gpt-ui .eg-gpt-ui-type-content-inner .eg-gpt-navigation-buttons .eg-gpt-navigation-button-adjacent button {
    font-size: 1.3rem;
}

.empty-placeholder .empty-placeholder-wrapper,
.empty-placeholder .empty-placeholder-wrapper {
    text-align: center;
    margin: 0 auto;
    box-sizing: border-box;
    max-width: 350px;
}

.empty-placeholder i,
.empty-placeholder i {
    font-size: 4rem;
}

.eg-gpt-result.not-empty .empty-placeholder,
.eg-gpt-result.not-empty .empty-placeholder,
.eg-gpt-result.empty .placeholder,
.eg-gpt-result.empty .placeholder {
    display: none;
}

.empty-placeholder .empty-placeholder-wrapper > *,
.empty-placeholder .empty-placeholder-wrapper > * {
    margin-bottom: 20px;
}

.eg-gpt-switch {
    display: grid;
    grid-template-columns: 0.5fr 0.5fr;
    box-sizing: border-box;
}

.eg-gpt-switch .eg-gpt-switch-element {
    cursor: pointer;
    padding: 5px 10px;
    margin-right: 10px;
    font-size: 1.5rem;
    color: #000;
    background-color: #fff;
    box-sizing: border-box;
    white-space: nowrap;
}

.eg-gpt-footer-controls .eg-gpt-control  {
    padding-right: 0;
}

.eg-gpt-switch .eg-gpt-switch-element.active {
    background-color: #000;
    color: #fff;
    box-sizing: border-box;
}

.eg-gpt .eg-gpt-preview .gpt-request-wrapper {
    max-width: 70%;
    margin-bottom: 10px;
    line-height: 0;
    margin-top: 20px;
    box-sizing: border-box;
}

.eg-gpt .eg-gpt-preview .gpt-request-inner-wrapper {
    display: table;
}

.eg-gpt .eg-gpt-preview .gpt-response-wrapper {
    margin-bottom: 10px;
    display: block;
    line-height: 0;
    box-sizing: border-box;
}

.eg-gpt .eg-gpt-preview .gpt-response-wrapper .gpt-response-inner-wrapper {
    display: table;
    width: 100%;
    box-sizing: border-box;
}

.eg-gpt .eg-gpt-preview .gpt-response-wrapper .gpt-response-selected {
    display: table-cell;
    width: 40px;
}

.eg-gpt .eg-gpt-preview .gpt-response-wrapper .gpt-response {
    display: table-cell;
    max-width: 70%;
}

.eg-gpt .eg-gpt-preview .gpt-response-wrapper .gpt-meta {
    line-height: normal;
    font-size: 0.9rem;
    opacity: 0.4;
    margin-left: 7px;
    margin-bottom: 7px;
    display: none;
}

.eg-gpt.gpt-meta-visible .eg-gpt-preview .gpt-response-wrapper .gpt-meta {
    display: block;
}

.eg-gpt .eg-gpt-preview .gpt-response-wrapper.eg-gpt-pending-response .gpt-response {
    opacity: 0.5;
    animation: pulsating-background 2s infinite;
    white-space: normal;
    position: relative;
    min-width: 50px;
    min-height: 35px;
} 

.eg-gpt .eg-gpt-preview .gpt-response-wrapper.eg-gpt-pending-response .gpt-response .points {
    font-size: 100%;
    line-height: 1.5rem;
    font-weight: bold;
    position: absolute;
    left: 0;
    top: 0px;
    right: 0;
    bottom: 0;
    text-align: center;
}

.eg-gpt .eg-gpt-preview .gpt-response-wrapper.eg-gpt-pending-response .gpt-response .point-1 {
    animation: pulsating-point-1 0.7s ease-in-out infinite;
}

.eg-gpt .eg-gpt-preview .gpt-response-wrapper.eg-gpt-pending-response .gpt-response .point-2 {
    animation: pulsating-point-2 0.7s ease-in-out infinite;
}

.eg-gpt .eg-gpt-preview .gpt-response-wrapper.eg-gpt-pending-response .gpt-response .point-3 {
    animation: pulsating-point-3 0.7s ease-in-out infinite;
}

.eg-gpt .eg-gpt-preview .gpt-request-wrapper.selected {
    /*border-right: 2px solid #999;*/
}

.eg-gpt .eg-gpt-preview .gpt-request-wrapper.selected .gpt-request {
    /*background-image: linear-gradient(90deg, #fff0 90%, #9993);*/
}

/*.eg-gpt .eg-gpt-preview .gpt-request-wrapper.selected .gpt-request {
    font-weight: 520;
}
*/


/*
.eg-gpt .eg-gpt-preview .gpt-request-wrapper.not-selected {
    font-weight: 520;
}

.eg-gpt .eg-gpt-preview .gpt-request-wrapper.not-selected .gpt-request {
    opacity: 0.5;
}
*/

.eg-gpt .eg-gpt-preview .gpt-request-selected {
    vertical-align: top;
    display: table-cell;
    padding-left: 10px;
    width: 20px;
    text-align: center;
}

.eg-gpt .eg-gpt-preview .gpt-request-wrapper .gpt-request-options {
    float: right;
}

.eg-gpt .eg-gpt-preview .gpt-response-wrapper .gpt-response-options button,
.eg-gpt .eg-gpt-preview .gpt-request-wrapper .gpt-request-options button {
    background-color: transparent;
    border: none;
}

.eg-gpt .eg-gpt-preview .gpt-response-wrapper .gpt-response {
    border-radius: 10px;
    background-color: #fafafa99;
    border: 1px solid #fafafa;
}

.eg-gpt .eg-gpt-preview .gpt-response-wrapper .gpt-response-options {
    display: block;
}

.eg-gpt .eg-gpt-preview .gpt-request-selected input {
    cursor: pointer;
}

.eg-gpt .eg-gpt-preview .checkbox-label {
    padding: 5px;
    cursor: pointer;
    margin-top: 6px;
}

.eg-gpt .eg-gpt-preview .gpt-request-wrapper {
    white-space: pre-wrap;
    float: right;
    text-align: left;
    border-right: 2px solid transparent;
}

.eg-gpt .eg-gpt-preview .gpt-request-wrapper .gpt-request {
    background-color: #f0f0f099;
    border-width: 1px;
    border-style: solid;
    border-color: #e0e0e0;
    border-radius: 10px;
}

.eg-gpt .eg-gpt-preview .gpt-response-wrapper {
    float: left;
    text-align: left;
    border-right: 2px solid transparent;
    padding-right: 4px;
}

.eg-gpt .eg-gpt-preview .gpt-response-wrapper.selected {
    /*border-right: 2px solid #999;*/
}

.eg-gpt .eg-gpt-preview .gpt-response-wrapper.selected .gpt-response {
    /*background-image: linear-gradient(90deg, #fff0 90%, #9993);*/
}

/*
.eg-gpt .eg-gpt-preview .gpt-response-wrapper.request-non-selected .gpt-response-selected {
    visibility: hidden;
}

.eg-gpt .eg-gpt-preview .gpt-response-wrapper.request-selected .gpt-response-selected {
    visibility: visible;
}
*/

.eg-gpt .eg-gpt-preview .gpt-request,
.eg-gpt .eg-gpt-preview .gpt-response {
    display: table-cell;
    line-height: normal;
    padding: 10px;
    /*white-space: preserve-spaces;*/
}

.eg-gpt .eg-gpt-preview .gpt-response p {
    margin-top: 0;
    margin-bottom: 0;
}

.eg-gpt .eg-gpt-preview .gpt-response pre,
.eg-gpt .eg-gpt-preview .gpt-response code {
    line-height: normal;
}

.eg-gpt .eg-gpt-preview .gpt-request {
    white-space: pre-wrap;
}

.eg-gpt.image .eg-gpt-preview .gpt-response img {
    max-width: 100%;
    box-sizing: border-box;
}

.eg-gpt .eg-gpt-preview .gpt-request-wrapper::after,
.eg-gpt .eg-gpt-preview .gpt-response-wrapper::after {
    content: " ";
    display: block;
    width: 100%;
    height: 2px;
    clear: both;
}

.eg-gpt .eg-gpt-preview .gpt-response-wrapper.eg-gpt-pending-response::after {
    content: "";
    display: none;
}

.eg-gpt-upgrade-messages {
    display: none;
}

.eg-gpt-upgrade-messages, .eg-gpt-upgrade-message-ui {
    font-size: 1.2em;
}

.gpt-break {
    clear: both;
    display: block;
    width: 100%;
    height: 1px;
}

.gpt-load-history-placeholder {
    margin: 0 auto;
    text-align: center;
    margin-bottom: 10px;
    margin-top: 10px;
}

.eg-gpt-control.current-session {
    display: inline-table;
}

.eg-gpt-control.current-session > * {
    display: table-cell;
    vertical-align: middle;
}

.eg-gpt-loading,
.eg-gpt-sessions-loading {
    min-height: 150px;
    line-height: 150px;
    text-align: center;
    animation: pulsating-background 2s infinite;
}

.eg-gpt-sessions-wrapper .eg-gpt-sessions-header,
.eg-gpt-sessions-wrapper .eg-gpt-session {
    display: table-row;
}

.eg-gpt-sessions-wrapper .eg-gpt-sessions-header {
    position: sticky;
    top: -20px;
    background-color: #eee;
    z-index: 10;
}

.eg-gpt-sessions-wrapper .eg-gpt-sessions-header .eg-gpt-sessions-header-column {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    font-weight: bold;
    padding: 5px 3px;
}

.eg-gpt-sessions-wrapper .eg-gpt-sessions-header .eg-gpt-sessions-header-column.sortable {
    cursor: pointer;
}

.eg-gpt-sessions-wrapper .eg-gpt-sessions-header .eg-gpt-sessions-header-column.sortable .sort-direction {
    margin-left: 3px;
}

.eg-gpt-sessions-wrapper .eg-gpt-sessions-header .eg-gpt-sessions-header-column.sortable .sort-direction > * {
    display: none;
}

.eg-gpt-sessions-wrapper .eg-gpt-sessions-header .eg-gpt-sessions-header-column.sort-desc .sort-direction .desc,
.eg-gpt-sessions-wrapper .eg-gpt-sessions-header .eg-gpt-sessions-header-column.sort-asc .sort-direction .asc {
    display: inline-block;
    opacity: 0.5;
}

.eg-gpt-sessions-actions {
    margin-bottom: 20px;
    display: table;
    width: 100%;
    box-sizing: border-box;
}

.eg-gpt-sessions-actions .eg-gpt-sessions-search-ui {
    position: relative;
    display: inline-block;
    width: 100%;
}

.eg-gpt-sessions-actions .eg-gpt-sessions-search-button {
    position: absolute;
    right: 0px;
    top: 4px;
    width: 20px;
    height: 20px;
    cursor: pointer;
    font-size: 14px;
}

.eg-gpt-sessions-actions .eg-gpt-sessions-search-ui input {
    padding-right: 25px;
    width: 100%;
    box-sizing: border-box;
}

.eg-gpt-sessions {
    display: table;
    width: 100%;
}

.eg-gpt-sessions .eg-gpt-session {
    box-sizing: border-box;
    position: relative;
}

.eg-gpt-sessions.image .eg-gpt-session .eg-gpt-session-preview-wrapper .eg-gpt-session-preview {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    width: 80px;
    height: 80px;
    display: inline-block;
    margin-right: 5px;    
}

.eg-gpt-sessions .eg-gpt-session .eg-gpt-session-attr.eg-gpt-session-attr.eg-gpt-session-name-wrapper .eg-gpt-session-name span {
    display: inline-block;
}

.eg-gpt-sessions .eg-gpt-session .eg-gpt-session-attr.eg-gpt-session-attr.eg-gpt-session-date {
    width: 100px;
}

.eg-gpt-sessions .eg-gpt-session .eg-gpt-session-attr.eg-gpt-session-attr.eg-gpt-session-tokens,
.eg-gpt-sessions .eg-gpt-session .eg-gpt-session-attr.eg-gpt-session-attr.eg-gpt-session-eg-tokens,
.eg-gpt-sessions .eg-gpt-session .eg-gpt-session-attr.eg-gpt-session-attr.eg-gpt-session-price {
    text-align: right;
}

.eg-gpt-sessions .eg-gpt-session .eg-gpt-session-attr.eg-gpt-session-attr.eg-gpt-session-options {
    width: 40px;
    text-align: right;
}


.eg-gpt-sessions-wrapper .eg-gpt-sessions-header .eg-gpt-sessions-header-column.price,
.eg-gpt-sessions .eg-gpt-session .eg-gpt-session-attr.eg-gpt-session-attr.eg-gpt-session-price {
    display: none;
}


.eg-gpt-sessions .eg-gpt-session .eg-gpt-session-attr.eg-gpt-session-shared-state.shared {
    display: block;
    position: absolute;
    right: 0px;
    top: 0px;
    opacity: 0.2;
}

.eg-gpt-sessions .eg-gpt-session:nth-child(odd) {
    background-color: #cccccc33;
}

.eg-gpt-sessions .eg-gpt-session .eg-gpt-session-attr {
    display: table-cell;
    vertical-align: middle;
    padding: 5px;
}

.eg-gpt-sessions .eg-gpt-session .eg-gpt-session-shared-state {
    display: none;
}

.eg-gpt-sessions.image .eg-gpt-session .eg-gpt-session-preview-wrapper {
    display: block;
}

.eg-gpt-sessions.text .eg-gpt-session .eg-gpt-session-preview-wrapper {
    display: none;
}


.eg-gpt-sessions .eg-gpt-session .eg-gpt-session-options {
    width: 30px;
    box-sizing: border-box;
    position: relative;
}

.eg-gpt-ui .eg-gpt-session-name {
    cursor: pointer;
}

.eg-gpt-ui .current-session .eg-gpt-session-name {
    max-width: 180px;
    overflow: hidden;
}

.eg-gpt-sessions .eg-gpt-session .eg-gpt-session-options button {
    background-color: transparent;
    border: none;
}

.dropdown-item.dropdown-toggle::after {
    display: inline-block;
    width: 0;
    height: 0;
    right: 0px;
    margin-left: .3em;
    vertical-align: middle;
    content: "";
    border-top: .3em solid;
    border-right: .3em solid transparent;
    border-left: .3em solid transparent;
    transform: rotate(-90deg);
}

.eg-gpt-sessions .dropdown-menu {
    left: auto !important;
    right: 0px;
    max-width: 180px;
}

.dropdown-submenu {
    position: relative;
}

.dropdown-submenu .dropdown-menu {
    top: 0px !important;
    left: -100% !important;
    margin-top: -1px;
}

.dropdown-menu i {
    width: 25px;
    display: inline-block;
}

.eg-gpt-ui .eg-gpt-popup > .modal-dialog > .modal-content > .modal-body {
    max-height: calc(100vh - 212px);
    overflow-y: auto;
    min-height: 400px;
}

.alert.global {
    position: absolute;
    left: 0;
    right: 0;
    top: -20px;
    z-index: 99999;
    max-width: 500px;
    margin: 0 auto;
    opacity: 1;
}

.alert.alert-warning {
    color: #000;
}

.eg-gpt-global-settings {
    box-sizing: border-box;
}

.eg-gpt-global-settings .eg-gpt-global-settings-item {
    display: table-cell;
    vertical-align: middle;
    box-sizing: border-box;
}

.eg-gpt-control.current-session {
    display: inline-table;
    white-space: nowrap;
}

.eg-gpt-control.current-session input,
.eg-gpt-control.current-session .rename-button {
    display: table-cell;
}

.eg-gpt-control.current-session input {
    width: 70%;
}

.eg-gpt-control.current-session .rename-button {
    width: 30%;
    white-space: nowrap;
}

.eg-gpt-session-summary {
    display: inline-block;
    box-sizing: border-box;
    margin-top: 5px;
    margin-bottom: 10px;
}

.eg-gpt-session-summary .eg-gpt-session-summary-item {
    display: inline;
    font-size: 80%;
    opacity: 0.3;
    margin-right: 20px;
}

.eg-gpt-session-summary .eg-gpt-session-summary-item .eg-gpt-session-summary-item-name,
.eg-gpt-session-summary .eg-gpt-session-summary-item .eg-gpt-session-summary-item-value {
    display: inline;
}

.eg-gpt-session-summary .eg-gpt-session-summary-item .eg-gpt-session-summary-item-name {
    font-weight: bold;
}

.eg-gpt-session-summary .eg-gpt-session-summary-item .eg-gpt-session-summary-item-name::after {
    content: ": ";
}

.eg-gpt-available-tokens {
    display: inline-block;
    font-size: 80%;
    opacity: 0.3;
    font-weight: bold;
}

.eg-gpt-subscriptions-button {
    display: inline-block;
    font-size: 80%;
    opacity: 0.3;
    font-weight: bold;
    margin-right: 10px;
}

.eg-gpt-subscriptions-button .btn {
    padding: 3px 5px;
}

.eg-gpt-available-tokens .num-available-tokens {
    font-weight: normal;
}

@keyframes pulsating-background {
  0% {background-color: #eee9;}
  50% {background-color: #ffff;}
  100% {background-color: #eee9;}
}

@keyframes pulsating-point-1 {
  0% {font-size: 100%;}
  25% {font-size: 125%;}
  50% {font-size: 150%;}
  75% {font-size: 125%;}
  100% {font-size: 100%;}
}

@keyframes pulsating-point-2 {
  0% {font-size: 125%;}
  25% {font-size: 150%;}
  50% {font-size: 125%;}
  75% {font-size: 100%;}
  100% {font-size: 125%;}
}

@keyframes pulsating-point-3 {
  0% {font-size: 150%;}
  25% {font-size: 125%;}
  50% {font-size: 100%;}
  75% {font-size: 125%;}
  100% {font-size: 150%;}
}

.form-group.override-ui label {
    font-weight: normal;
}

.form-group.override-ui {
    margin-bottom: 3px;
    margin-top: 30px;
}

.form-group.override-mode {
    opacity: 0.5;
    user-select: none;
    pointer-events:none;
}

.form-group.override-mode.override-enabled {
    opacity: 1;
    user-select: auto;
    pointer-events: auto;
}

.eg-gpt input[type="checkbox"], 
.eg-gpt input[type="radio"] {
    accent-color: #333;
    width: 18px;
    height: 18px;
}

.eg-gpt input[type="checkbox"] {
    appearance: none;
    background-color: #fff;
    margin: 0;
    font: inherit;
    color: currentColor;
    width: 1.15em;
    height: 1.15em;
    border: 0.15em solid #333;
    border-radius: 0.25em;
    transform: translateY(-0.075em);
    display: grid;
    place-content: center;
}

.eg-gpt input[type="checkbox"]::before {
    content: "";
    width: 0.65em;
    height: 0.65em;
    transform: scale(0);
    transition: 120ms transform ease-in-out;
    box-shadow: inset 1em 1em #333;
    transform-origin: bottom left;
    clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
}

.eg-gpt input[type="checkbox"]:checked::before {
    transform: scale(1);
}

.eg-gpt-wrapper .checkbox-inline {
    margin-bottom: 15px;
}

.eg-gpt-tabs .eg-gpt-settings-menu {
    display: table;
    width: auto;
    float: right;
    height: 100%;
    position: relative;
}

.eg-gpt-tabs .eg-gpt-settings-menu .eg-gpt-session-settings-menu-wrapper,
.eg-gpt-tabs .eg-gpt-settings-menu .eg-gpt-global-settings-menu {
    display: table-cell;
    vertical-align: middle;
}

.eg-gpt-tabs .eg-gpt-session-settings-menu-wrapper .eg-gpt-session-settings-menu {
    display: none;
}

.eg-gpt-tabs .eg-gpt-session-settings-menu-wrapper.text .eg-gpt-session-settings-menu.text,
.eg-gpt-tabs .eg-gpt-session-settings-menu-wrapper.image .eg-gpt-session-settings-menu.image {
    display: table-cell;
}

.eg-gpt-tabs .eg-gpt-settings-menu .eg-gpt-session-setting-menu {
    display: table;
}

.eg-gpt-tabs .eg-gpt-settings-menu .eg-gpt-session-setting-menu-item {
    display: table-cell;
    padding-left: 4px;
    vertical-align: middle;
}

.eg-gpt-tabs .eg-gpt-settings-menu .eg-gpt-session-setting-menu-item.advanced {
    display: none;
}

.eg-gpt-tabs .eg-gpt-settings-menu.advanced .eg-gpt-session-setting-menu-item.advanced {
    display: table-cell;
}

.eg-gpt-tabs .eg-gpt-settings-menu .eg-gpt-session-setting-menu-item.toggle-advanced-mode {
    padding-left: 15px;
    padding-right: 15px;
}

.eg-gpt-tabs .eg-gpt-settings-menu .eg-gpt-session-setting-menu-item.eg-gpt-session-info .eg-gpt-session-name {
    max-width: 450px;
    overflow-x: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.eg-gpt-tabs .dropdown-menu li .disabled {
    pointer-events: none;
    opacity: 0.3;
}

.eg-gpt-tabs .share-session-button.not-shared .not-shared,
.eg-gpt-tabs .share-session-button.shared .shared {
    display: inline-block;
}

.eg-gpt-tabs .share-session-button .icon {
    position: relative;
}

.eg-gpt-tabs .share-session-button.shared .icon .shared {
    position: absolute;
    width: 12px;
    height: 12px;
    border-radius: 6px;
    background-color: #00aa00;
    color: #fff;
    left: -7px;
    bottom: 8px;
    text-align: center;
    line-height: 12px;
    font-size: 9px;
}

.eg-gpt-tabs .share-session-button.shared .icon .shared i {
    width: auto;
}

.eg-gpt-tabs .share-session-button.not-shared .shared,
.eg-gpt-tabs .share-session-button.shared .not-shared {
    display: none;
}

fieldset {
    margin-bottom: 30px;
}

fieldset:last-child {
    margin-bottom: 0;
}

.btn.btn-transparent {
    background-color: transparent;
}

.eg-gpt .send-button {
    background-image: url("/gpt/img/generate-button.png");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    width: 40px;
    height: 40px;
    background-color: transparent;
    border: none;
}

.override-presets-checkbox-placeholder.locked {
    display: none !important;
}

.form-control {
    border-radius: 10px;
}

.gpt-response code {
    position: relative;
    display: block;
}

.gpt-response code .gpt-copy-code-icon {
    position: absolute;
    top: 10px;
    right: 10px;
    box-shadow: 0px 3px 5px #5553;
    text-shadow: 0px 3px 5px #5553;
    cursor: pointer;
    background-color: #999;
    color: #fff;
    padding: 5px;
    cursor: pointer;
    z-index: 9999;
    opacity: 0.78;
}

.gpt-sidebar-items .latest-session.empty,
.gpt-sidebar-items.no-sessions .new-session,
.gpt-sidebar-items.no-sessions .load-sessions,
.gpt-sidebar-items.no-sessions .search-sessions,
.gpt-sidebar-items.no-sessions hr,
.gpt-sidebar-items.no-sessions .latest-session {
    display: none;
}

.gpt-sidebar-items hr {
    margin-top: 3px;
    margin-bottom: 3px;
}

.gpt-sidebar-items .latest-session a:active,
.gpt-sidebar-items .latest-session a:visited,
.gpt-sidebar-items .latest-session a:focus {
    color: #555;
}

.eg-shared-session-url-input {
    width: 100%;
}

.eg-gpt-ui .eg-gpt-popup.custom-flexible-window > .modal-dialog > .modal-content > .modal-body {
    min-height: auto;
}

.eg-gpt-macros-wrapper .eg-macros-search-placeholder {
    margin-bottom: 20px;
    box-sizing: border-box;
}

.eg-gpt-macros-wrapper .eg-macros-search-placeholder input {
    width: 100%;
    box-sizing: border-box;
    padding: 5px;
}

.eg-gpt-macros {
    display: table;
    width: 100%;
    box-sizing: border-box;
}

.eg-gpt-macro {
    display: table-row;
}

.eg-gpt-macro.hidden {
    display: none;
}

.eg-gpt-macro.disabled {
    opacity: 0.4;
}

.eg-gpt-macro .eg-gpt-macro-actions {
    width: 10%;
}

.eg-gpt-macro button {
    display: none;
}

.eg-gpt-macro.enabled .use-macro-button,
.eg-gpt-macro.disabled .upgrade-button {
    display: block;
}

.eg-gpt-macro:hover {
    background-color: #eee;
}

.eg-gpt-macro > * {
    display: table-cell;
    padding: 3px;
    vertical-align: middle;
}

.eg-gpt-macro > .eg-gpt-macro-name {
    display: none;
}

.eg-gpt-macro > .eg-gpt-macro-description {
    width: 250px;
}

.eg-gpt-macro > .eg-gpt-macro-value {
    cursor: pointer;
}


@media (max-width: 1300px) {
    .eg-gpt-tabs .eg-gpt-settings-menu .eg-gpt-session-setting-menu-item.eg-gpt-session-info .eg-gpt-session-name {
        max-width: 350px;
    }
}

@media (max-width: 1200px) {
    .eg-gpt-tabs .eg-gpt-settings-menu .eg-gpt-session-setting-menu-item.eg-gpt-session-info .eg-gpt-session-name {
        max-width: 250px;
    }
}

@media (max-width: 1070px) {
    .eg-gpt-tabs .eg-gpt-settings-menu .eg-gpt-session-setting-menu-item.eg-gpt-session-info .eg-gpt-session-name {
        max-width: 150px;
    }
}

@media (max-width: 970px) {
    .eg-gpt-tabs .eg-gpt-settings-menu .eg-gpt-session-setting-menu-item.eg-gpt-session-info {
        display: none;
    }
}

@media (max-width: 710px) {
    .eg-gpt {
        grid-template-rows: 1px auto 30px;
    }

    .eg-gpt.refinement-controls-visible .eg-gpt-request-refinement-controls .eg-gpt-controls {
        /*display: block;
        width: auto;
        */
    }

    .eg-gpt.refinement-controls-visible .eg-gpt-request-refinement-controls .eg-gpt-controls .eg-gpt-control {
        /*display: inline-block;
        width: auto;
        */
    }
}


@media (max-width: 500px) {
    .eg-gpt {
        grid-template-rows: 1px auto 30px;
    }

    .eg-gpt-tabs .eg-gpt-settings-menu.advanced .eg-gpt-session-setting-menu-item.advanced {
        display: none;
    }

    /*
    .eg-gpt.refinement-controls-visible .eg-gpt-content {
        grid-template-rows: auto 200px;
    }
        */
}


@media (max-width: 740px) {
    /*
    .eg-gpt.refinement-controls-visible .eg-gpt-content {
        grid-template-rows: auto 170px;
    }
        */

    .eg-gpt-session-summary {
        margin-bottom: 1px;
        margin-top: 0px;
    }
}

@media (max-width: 440px) {
    /*
    .eg-gpt.refinement-controls-visible .eg-gpt-content {
        grid-template-rows: auto 214px;
    }
        */

    .eg-gpt-controls-wrapper {
        margin-bottom: 0px;
    }

    .eg-gpt-footer {
        padding: 0px 5px;
    }

    .eg-gpt.refinement-controls-visible .eg-gpt-request {
        grid-template-rows: auto max-content;
    }
}