﻿#oc-chat-status {
    -moz-box-sizing: border-box !important;
    -webkit-box-sizing: border-box !important;
    background-color: #316FBD !important;
    border: 1px solid black !important;
    bottom: 0 !important;
    box-sizing: border-box !important;
    color: white !important;
    cursor: pointer !important;
    font-weight: bold !important;
    height: 45px !important;
    line-height: 45px !important;
    position: fixed !important;
    right: 15px !important;
    width: 300px !important;
    z-index: 1000000000 !important;
}

#oc-chat-status .availibility, #oc-chat-window .availibility  {
    background-color: #d9d9d9 !important;
    display: inline-block !important;
    float: left !important;
    height: 20px !important;
    width: 20px !important;
    -ms-border-radius: 20px !important;
    border-radius: 20px !important;
    margin: 13px 0 0 5px !important;
    -webkit-box-shadow: 0 0 0 2px rgba(0,0,0,0.2) !important;
   box-shadow: 0 0 0 2px  rgba(0,0,0,0.2) !important;
}


#oc-chat-status p {
    line-height: 45px !important;
    margin: 0 !important;
}

#oc-chat-status .availibility.green,
#oc-chat-window .availibility.green {
     background-color: limegreen !important;
}

#oc-chat-status .availibility.red,
#oc-chat-window .availibility.red {
     background-color: red !important;
}

#oc-chat-status .availibility.yellow,
#oc-chat-window .availibility.yellow {
     background-color: yellow !important;
}

#oc-chat-window {
    -moz-box-sizing: border-box !important;
    -webkit-box-sizing: border-box !important;
    background-color: #FFF !important;
    border: 1px solid black !important;
    bottom: 0 !important;
    box-sizing: border-box !important;
    font-family: arial !important;
    font-size: 12px !important;
    min-height: 200px !important;
    min-width: 200px !important;
    padding-bottom: 5px !important;
    position: fixed !important;
    right: 15px !important;
    width: 300px !important;
    z-index: 1000000001 !important;
}

#oc-chat-window .oc-container {
    height: 100% !important;
    width: 100% !important;
}

#oc-chat-availability-message {
    padding: 10px 10px 0 10px !important;
    margin-top: 15px !important;
}

#oc-chat-window ul {
    list-style-type: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

#oc-chat-window ul li:nth-child(odd):not(.oc-redirect-option) {
     margin-top: 5px !important;
}

#oc-chat-window label {
    overflow-wrap: break-word;
}

#oc-chat-window .oc-response-messages li:nth-child(odd):not(.oc-redirect-option) {
    margin-top: 0px !important;
}

#oc-chat-window ul li span {
    white-space: pre-wrap !important;
    word-break: break-all !important;
    word-break: break-word !important;
    word-wrap: break-word !important;
}

#oc-chat-window .oc-header {
    background-color: #316FBD !important;
    border-bottom: 1px solid black !important;
    height: 45px !important;
    cursor: all-scroll !important;
}


#oc-chat-window .oc-chat-header-text {
    color: white !important;
    font-size: 14px !important;
    font-weight: bold !important;
    line-height: 45px !important;
    cursor: all-scroll !important;
}


#oc-chat-window .oc-chat-header-text[title]:focus:after {
    content: attr(title) !important;
    position: absolute !important;
    left: 50% !important;
    bottom: 100% !important;
    margin-bottom: 1em !important;
    padding: 1em !important;
    background-color: #000 !important;
    font-size: .6em !important;
    line-height: 1.6 !important;
    text-align: left !important;
    white-space: nowrap !important;
    transform: translate(-50%, 1em) !important;
    transition: all .15s ease-in-out !important;
}


#oc-chat-window .oc-chat-header-text:focus:after {
    content: attr(title);
}

#oc-chat-window .oc-logo, #oc-chat-status .oc-logo {
    float: left !important;
    margin-left: 7px !important;
    margin-top: 5px !important;
}

#oc-chat-window .oc-chat-logo {
    background-image: url('../Content/img/chat.png') !important;
    background-repeat: no-repeat !important;
    height: 40px !important;
    width: 55px !important;
    background-size: contain !important;
    background-position: 0 4px !important;
}

#oc-chat-status .oc-status-logo {
    background-image: url('../Content/img/chat.png') !important;
    background-repeat: no-repeat !important;
    height: 100% !important;
    width: 55px !important;
    background-size: contain !important;
    background-position: 0 4px !important;       
}

#oc-chat-window .oc-close-button {
    -ms-background-size: contain !important;
    background-image: url('../Content/img/close.png') !important;
    background-repeat: no-repeat !important;
    background-size: contain !important;
    height: 45px !important;
    width: 25px !important;

    position: absolute !important;
    right: 5px !important;
    top:0 !important;
    background-position: 0 12px !important;

}

#oc-chat-status .oc-open-button {
    -ms-background-size: contain !important;
    background-image: url('../Content/img/open.png') !important;
    background-repeat: no-repeat !important;
    background-size: contain !important;
    height: 25px !important;
    width: 25px !important;
    
    position: absolute !important;
    right: 5px !important;
    top: 12px !important;
}

#oc-chat-window .oc-email-button {
    -ms-background-size: contain !important;
    background-image: url('../Content/img/email2.png') !important;
    background-repeat: no-repeat !important;
    height: 32px !important;
    width: 32px !important;
    background-color: #316fbd !important;
    border-radius: 33px !important;
    background-position: 4px 4px!important;
    background-size: 23px 23px!important;
}

#oc-chat-window .oc-file-button {
    -ms-background-size: contain !important;
    background-image: url('../Content/img/clip.png') !important;
    background-repeat: no-repeat !important;
    height: 32px !important;
    width: 32px !important;
    background-color: #316fbd !important;
    border-radius: 33px !important;
    background-position: 1px 5px !important;
    margin-left: 7px !important;
    background-position: 4px 4px!important;
    background-size: 23px 23px!important;
}

#oc-chat-window .oc-redirect-button {
    background-color: #F0F0F0 !important;
    border: 1px solid #2475DA !important;
    color: #000000 !important;
    display: inline-block !important;
    font-family: Arial !important;
    font-size: 15px !important;
    font-style: normal !important;
    text-align: center !important;
    text-decoration: none !important;
    padding: 4px 4px !important;
    font-weight: normal !important;
    width: 265px !important;
    text-align: left !important;
    margin: 0 !important;
    margin-bottom: 4px !important;
}

#oc-chat-window .oc-video-connection-button {
    margin-left: 7px !important;
    display: inline-block !important;
    -ms-background-size: contain !important;
    background-image: url('../Content/img/video_call.png') !important;
    background-repeat: no-repeat !important;
    height: 32px !important;
    width: 32px !important;
    background-color: #316fbd !important;
    border-radius: 33px !important;
    background-position: 4px 4px !important;
    background-size: 23px 23px !important;
}

#oc-chat-window .main-content-options {
    position: relative !important;
}

#oc-chat-window .oc-font-size-button {
    display: inline-block !important;
    height: 25px !important;
    width: 25px !important;
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
}

#oc-chat-window .oc-text-box.oc-chat-font-small {
    font-size: 80% !important;
}
#oc-chat-window .oc-text-box.oc-chat-font-large {
    font-size: 120% !important;
}

#oc-chat-window #oc-message-container .oc-chat-font-small span {
    font-size: 80% !important;
}
#oc-chat-window #oc-message-container .oc-chat-font-large span {
    font-size: 120% !important;
}

#oc-chat-window #oc-message-container .oc-chat-font-small strong {
    font-size: 80% !important;
}

#oc-chat-window #oc-message-container .oc-chat-font-large strong {
    font-size: 120% !important;
}

#oc-chat-window #oc-message-container .oc-chat-font-small span.text-blue {
    font-size: 80% !important;
}

#oc-chat-window #oc-message-container .oc-chat-font-large span.text-blue {
    font-size: 120% !important;
}

#oc-chat-window #oc-message-container.oc-chat-mode-survey {
    max-height: 15em !important;
}

#oc-chat-window .oc-sound-button-enabled {
    display: inline-block !important;
    height: 25px !important;
    width: 25px !important;
}

#oc-chat-window .oc-sound-button-disabled {
    display: inline-block !important;
    height: 25px !important;
    width: 25px !important;
}

#oc-chat-window .oc-sound-button {
    display: inline-block !important;
    height: 25px !important;
    width: 25px !important;
}

#oc-chat-window .oc-cobro-button {
    margin-left: 7px !important;
    display: inline-block !important;
    -ms-background-size: contain !important;
    background-image: url('../Content/img/cobro.png') !important;
    background-repeat: no-repeat !important;
    height: 32px !important;
    width: 32px !important;
    background-color: #316fbd !important;
    border-radius: 33px !important;
    background-position: 4px 4px !important;
    background-size: 23px 23px !important;
}

#oc-chat-window .oc-redirect-button-img 
{
    float: left !important;
    margin-right: 5px !important;
    background-image: url(../Content/img/goto.png) !important;
    width: 14px !important;
    height: 14px !important;
}

/* This is for busy-image in redirect service which is shown if the target service 
    is busy if using busy image functionality is switched on. This is determined by 
    ChatServerCore.Models.Redirect.IsBusyIconUsed. */
#oc-chat-window .oc-redirect-busy-img {
    float: right !important;
    max-height: 24px !important;
}

#oc-chat-window .oc-redirect-button.green {
    display: inline-block !important;
}

#oc-chat-window .oc-redirect-button.yellow {
    display: inline-block !important;
}

#oc-chat-window .oc-redirect-button.red {
    display: none !important;
    color: grey !important;
    cursor: not-allowed !important;
}

#oc-chat-window .oc-redirect-button.grey {
    display: none !important;
    color: grey !important;
    cursor: not-allowed !important;
}

#oc-chat-window .oc-message-footer {
    font-size: 12px !important;
    width: 100% !important;
    clear: both !important;
    position: relative !important;
}

#oc-chat-window .oc-main-content {
    position: relative !important;
    clear: both !important;
    padding: 5px 0 0 8px !important;
    overflow-y: auto !important;
}

#oc-chat-window .oc-end-contact-message {
    height: 30px !important;
    padding-top: 10px !important;
}

#oc-chat-window #oc-feedback {
    padding-right: 8px !important;
}

#oc-chat-window .oc-feedback-survey {
    font-size: 13px !important;
}
#oc-chat-window .oc-feedback-input {
    margin-top: 5px !important;
}

#oc-chat-window .oc-feedback-input input[type="button"] {
    background-color: #F0F0F0 !important;
    border: 1px solid #2475DA !important;
    color: #000 !important;
    display: inline-block !important;
    font-family: Arial !important;
    font-size: 12px !important;
    font-style: normal !important;
    text-align: center !important;
    text-decoration: none !important;
    font-weight: normal !important;
    margin: 0 !important;;
    padding: 5px 20px !important;
}

#oc-chat-window .oc-feedback-surveys {
    background-color: rgba(255, 255, 255, 0.2) !important;
    font-weight: bold !important;
    padding: 5px 10px !important;
    text-align: center !important;
    margin-bottom: 5px !important;
    border-bottom: 1px solid #316fbd !important;
}

#oc-chat-window #oc-presurvey {
    min-height: 260px !important;
    overflow: auto !important;
}

#oc-chat-window #oc-presurvey .oc-presurvey-start {
    margin-bottom: 15px !important;
}

#oc-chat-window #oc-presurvey .oc-feedback-survey {
    margin-bottom: 15px !important;
    font-weight: bold !important;
}

#oc-chat-window #oc-chat-presurvey-button {
    margin-right: 7px !important;
}

#oc-chat-window .oc-message-dialog {
    height: 260px !important;
    overflow-y: auto !important;
    font-size: 13px !important;
    position: relative !important;
}

#oc-chat-window #oc-message-wrapper {
    position: absolute !important;
    bottom: 0 !important;
    overflow-y: auto !important;
    max-height: 100% !important;
    width: 100% !important;
    padding: 5px 0 !important;
}

#oc-chat-window #oc-footer-container #oc-chat-contact-form {
    overflow-y: auto !important;
    padding: 15px 0 5px 0 !important;
}

#oc-chat-window .oc-contact-input {
    width: 99% !important;
    margin: 5px 0 !important;
}

#oc-chat-window #oc-chat-contact-form-text {
    margin: 5px 0 !important;
    height: 90px !important;
}

#oc-chat-window .oc-message-dialog.half { height: 167px !important; }

#oc-chat-window .oc-footer { padding: 0 8px 5px 8px !important; }

#oc-chat-window .oc-center-content {
    height: 220px !important;
    overflow-y: auto !important;
}

#oc-chat-window .oc-survey-titles {
    /*Prevents clicking likertscale labels witch should not relate to certain radio btn*/
    pointer-events: none !important;
    padding: 5px 0 !important;
    font-weight: normal !important;
}

#oc-chat-window .oc-survey-titles > div {
    display: inline-block !important;
    width: 50% !important;
    vertical-align: bottom !important;
    font-size: 12px !important;
}

#oc-chat-window .oc-survey-titles .oc-survey-scaled-min {
    text-align: left !important;
    float: left !important;
}

#oc-chat-window .oc-survey-titles .oc-survey-scaled-max {
    text-align: right !important;
    float: right !important;
}

#oc-chat-window .oc-zero-ten-titles {
    /*Prevents clicking likertscale labels whitch should not relate to certain radio btn*/
    pointer-events: none !important;
}

#oc-chat-window .oc-text-box {
    -moz-resize: none !important;
    -ms-resize: none !important;
    -o-resize: none !important;
    border: 1px solid #2475DA !important;
    height: 54px !important;
    resize: none !important;
    width: 95% !important;
    padding: 3px !important;
    font-weight: normal !important;
    margin-bottom: 7px !important;
    margin-top: 18px !important;
}

#oc-chat-window textarea:focus-visible,
#oc-chat-window .oc-button:focus-visible,
#oc-chat-window button:focus-visible,
#oc-chat-window .oc-text-field:focus-visible,
#oc-chat-status .oc-open-button:focus-visible,
#oc-chat-window a:focus-visible,
#oc-chat-window input[type=submit]:focus-visible,
#oc-chat-window input[type=radio]:focus-visible,
#oc-chat-window input[type=checkbox]:focus-visible,
#oc-chat-window select:focus-visible
#oc-chat-window .oc-conversation-feedback-option:focus-visible{
    box-shadow: 0 0 0 2px #ffffff, 0 0 3px 5px #3a97f9 !important;
    outline: 2px dotted transparent !important;
    outline-offset: 2px !important;
} 

#oc-chat-window .oc-feedback-presurveys .oc-text-box, 
#oc-chat-window .oc-feedback-survey .oc-text-box {
    width: 254px !important;
    text-align: left !important;
    margin: 4px !important;
}

#oc-chat-window .oc-text-field {
    -moz-resize: none !important;
    -ms-resize: none !important;
    -o-resize: none !important;
    border: 1px solid #2475DA !important;
    resize: none !important;
    width: 254px !important;
    padding: 3px !important;
    font-weight: normal !important;
}

#oc-chat-window .oc-feedback-presurveys .oc-text-field,
#oc-chat-window .oc-feedback-survey .oc-text-field {
    width: 254px !important;
    text-align: left !important;
    margin: 4px 2px 7px 4px !important
}

#oc-chat-window .oc-feedback-presurveys .oc-send-button,
#oc-chat-window .oc-feedback-survey .oc-send-button {
    float: none !important;
}

#oc-chat-window .oc-buttons { margin-top: 5px !important; }

#oc-chat-window .oc-button {
    cursor: pointer !important;
}

#oc-chat-window .oc-feedback-button,
#oc-chat-window .oc-send-button {
    background-color: #F0F0F0 !important;
    border: 1px solid #2475DA !important;
    color: #000 !important;
    display: inline-block !important;
    float: right !important;
    font-family: Arial !important;
    font-size: 15px !important;
    font-style: normal !important;
    text-align: center !important;
    text-decoration: none !important;
    margin: 6px !important;
    padding: 5px 20px !important;
    font-weight: normal !important;
}

#oc-chat-window .oc-send-button:disabled {
    color: #666 !important;
    border: 1px solid #BBB !important;
}

#oc-chat-window .oc-feedback-button:hover,
#oc-chat-window .oc-feedback-button:focus,
#oc-chat-window .oc-send-button:hover,
#oc-chat-window .oc-send-button:focus {
    background-color: #316FBD !important;
    color: #FFFFFF !important;
    box-shadow: 0 0 0 2px #ffffff, 0 0 3px 5px #3a97f9 !important;
    outline: 2px dotted transparent !important;
    outline-offset: 4px !important;
}

#oc-chat-window .oc-text-box:disabled {
  background: #F0F0F0 !important;
  border-color: #BBB!important;
}

#oc-chat-window .oc-send-button:disabled:hover {
    -ms-text-shadow: none !important;
    text-shadow: none !important;
}

/* 
    Previously exit was a-element but it causes problems in SPA (Angular for example).
    We now use button-element which is styled to mimic how the link used to look like.
    Customizations have been edited where a-element was used to change text color.
*/
#oc-chat-window .oc-exit button, #oc-chat-window .oc-exit button:hover {
    color: #2475da !important;
    font-family: Arial !important;
    font-size: 12px !important;
    font-style: normal !important;
    text-align: center !important;
    font-weight: normal !important;
}
#oc-chat-window .oc-exit button {
    background: none !important;
    border: none !important;
    padding: 0 !important;
    cursor: pointer;
}
#oc-chat-window .oc-exit button:hover {
    text-decoration: underline !important;
}

#oc-chat-window .oc-exit {
    width: 100% !important;
    display: block !important;
    float: left !important;
}

#oc-chat-window .oc-exit-link-wrapper {
    display: block !important;
    margin: 0 auto !important;
    width: 50% !important;
    text-align: center !important;
}

#oc-chat-window .oc-email-window {
    background-color: #FFF !important;
    border: 1px solid #2475da !important;
    bottom: 8px !important;
    left: 10px !important;
    padding: 12px !important;
    position: absolute !important;
    right: 10px !important;
    -webkit-box-shadow: 1px 1px 3px 3px rgba(0,0,0,0.2) !important;
   box-shadow: 1px 1px 3px 3px rgba(0,0,0,0.2) !important;
   font-size: 1.15em !important;
}

#oc-chat-window .oc-email-field {
    border: 1px solid #2475da!important;
    width: 85%!important;
    margin-top: 12px !important;
    margin-bottom: 12px !important;
    padding: 6px !important;
}

#oc-chat-window .oc-email-window .oc-close-button {
    -ms-background-size: contain !important;
    background-image: url('../Content/img/close-button.png') !important;
    background-position: 0 0 !important;
    width: 24px !important;
}

#oc-chat-window .oc-email-window label {
    margin: 0.5em 0 !important;
}

#oc-chat-window .oc-invalid {
    -ms-box-shadow: 0 0 1px 1px rgba(255, 0, 0, 0.8) !important;
    -webkit-box-shadow: 0 0 1px 1px rgba(255, 0, 0, 0.8) !important;
    box-shadow: 0 0 1px 1px rgba(255, 0, 0, 0.8) !important;
}

#oc-chat-window .oc-valid {
    -ms-box-shadow: 0 0 1px 1px rgba(0, 255, 0, 0.8) !important;
    -webkit-box-shadow: 0 0 1px 1px rgba(0, 255, 0, 0.8) !important;
    box-shadow: 0 0 1px 1px rgba(0, 255, 0, 0.8) !important;
}

#oc-chat-window #oc-chat-conncetion-error-message {
    color: red !important;
    font-weight: bold !important;
}

#oc-chat-window .oc-chat-error-message {
    color: red !important;
    font-weight: bold !important;
    margin-bottom: 12px !important;
}

#oc-chat-window #oc-chat-messages a {
    text-decoration: underline !important;
    color: darkblue !important;
}

/*Utilities*/

#oc-chat-window .pull-left { float: left !important; }

#oc-chat-window .pull-right { float: right !important; }

#oc-chat-window .text-blue { color: #2E2EFF !important; }

#oc-chat-window .bot-action-link { color: #009F00 !important; }

#oc-chat-window .bot-external-link { color: #2E2EFF !important; }

#oc-chat-window .bot-text-content { color: #000000 !important; }

#oc-chat-window .bot-raw-html { color: #2E2EFF !important; }

#oc-chat-window .hidden { visibility:hidden !important; }

#oc-chat-window .hiddenButton { display: none !important}

#oc-chat-window .oc-icon {
    font-size: 24px !important;
    font-style: normal !important;
}

#oc-chat-window .oc-icon-ok { color: green !important; }

#oc-chat-window .oc-icon-ok:before { content: '✓' !important; }

#oc-chat-window .oc-icon-bad { color: red !important; }

#oc-chat-window .oc-icon-bad:before { content: '✗' !important; }


#oc-chat-window .transfer-text {
    padding-top: 5px !important;
    border-top: 1px solid #316fbd !important;
    color: #1561c2 !important;
}

#oc-chat-window .spinner {
  text-align: center !important;
}

#oc-chat-window .spinner > div {
  width: 8px !important;
  height: 8px !important;
  background-color: #1561C2  !important;

  border-radius: 100% !important;
  display: inline-block !important;
  -webkit-animation: bouncedelay 1.4s infinite ease-in-out !important;
  animation: bouncedelay 1.4s infinite ease-in-out !important;
  /* Prevent first frame from flickering when animation starts */
  -webkit-animation-fill-mode: both !important;
  animation-fill-mode: both !important;
}

#oc-chat-window .spinner .bounce1 {
  -webkit-animation-delay: -0.32s !important;
  animation-delay: -0.32s !important;
}

#oc-chat-window .spinner .bounce2 {
  -webkit-animation-delay: -0.16s !important;
  animation-delay: -0.16s !important;
}

@-webkit-keyframes bouncedelay {
  0%, 80%, 100% { -webkit-transform: scale(0.0) }
  40% { -webkit-transform: scale(1.0) }
}

@keyframes bouncedelay {
  0%, 80%, 100% { 
    transform: scale(0.0);
    -webkit-transform: scale(0.0);
  } 40% { 
    transform: scale(1.0);
    -webkit-transform: scale(1.0);
  }
}


#oc-chat-window.fullscreen {
    bottom: 0 !important;
    right: 0 !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
}

#oc-chat-window.fullscreen #oc-chat-close-button {
    display: none !important;
}

#oc-chat-window.fullscreen .oc-footer {
    position: absolute !important;
    bottom: 0 !important;
    width: 100% !important;
    -webkit-box-sizing: border-box !important;
    -moz-box-sizing: border-box !important;
    box-sizing: border-box !important;
}

#oc-chat-window.fullscreen .oc-text-box {
    width: 100% !important;
    -webkit-box-sizing: border-box !important;
    -moz-box-sizing: border-box !important;
    box-sizing: border-box !important;
}

#oc-chat-window #oc-chat-agent-image {
    -moz-border-radius: 50% !important;
    -ms-border-radius: 50% !important;
    -webkit-border-radius: 50% !important;
    border-radius: 50% !important;
    max-width: 45px !important;
    margin-left: 7px !important;
    z-index: 1000 !important;
    position: absolute !important;
    margin-top: -7px !important;
    border: 2px solid rgb(221, 221, 221) !important;
    overflow: auto !important;
}

#oc-chat-window #oc-chat-agent-image-container {
    z-index: 1000 !important;
    background-color: #f0f0f0 !important;
    width: 100% !important;
    border-bottom: 1px solid #ddd !important;
}

#oc-chat-window #oc-chat-agent-image-name {
    font-size: 15px !important;
    color: rgb(68, 68, 68) !important;
    padding: 7px 0px 7px 63px !important;
}

#oc-chat-window #oc-file-upload-message {
    max-height: 50px !important;
    max-width: 200px !important;
}

#oc-chat-tooltip {
    position: absolute !important;
    width: 298px !important;
    height: 35px !important;
    top: -50px !important;
    left: 0px !important;
    
    text-align: center !important;
    color: #fff !important;
    z-index: 100 !important;
    border-radius: 6px !important;
    opacity: 0.8 !important;
 
    background: #45484d !important;
    background: -moz-linear-gradient(top, #45484d 0%, #000000 100%) !important;
    background: -webkit-linear-gradient(top, #45484d 0%,#000000 100%) !important;
    background: linear-gradient(to bottom, #45484d 0%,#000000 100%) !important;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#45484d', endColorstr='#000000',GradientType=0 ) !important;
}

#oc-chat-tooltip-text {
    position: relative !important;
    top: -6px !important;
    opacity: 1 !important;
}

#oc-chat-tooltip-image {
    background-image: url('../Content/img/down-arrow.png') !important;
    background-repeat: no-repeat !important;
    margin-top: -10px;
    height: 15px;
    margin-left: 47%;
}

#oc-chat-window #oc-chat-messages *[data-oc-link-id] {
    display: inline-block!important;
    padding: 4px!important;
    cursor: pointer!important;
    text-decoration: underline!important;
    font-weight: bold!important;
    border: 1px solid black!important;
    margin-top: 2px!important;
    margin-bottom: 2px!important;
    width: 92%!important;
}

#oc-chat-window .oc-container #oc-chat-messages *[data-oc-link-type="action_link"]:hover {
    background-color: #316FBD !important;
    color: #FFFFFF !important;
}

#oc-chat-window .oc-container #oc-chat-messages *[data-oc-link-type="action_link"]:focus {
    background-color: #316FBD;
    color: #FFFFFF;
    box-shadow: 0 0 0 2px #ffffff, 0 0 3px 5px #3a97f9 !important;
    outline: 2px dotted transparent !important;
    outline-offset: 4px !important;
}

#oc-chat-window .oc-container #oc-chat-messages *[data-oc-link-type="external_link"]:hover {
    background-color: #316FBD !important;
    color: #FFFFFF !important;
    box-shadow: 0 0 0 2px #ffffff, 0 0 3px 5px #3a97f9 !important;
    outline: 2px dotted transparent !important;
    outline-offset: 4px !important;
}

#oc-chat-window .oc-container #oc-chat-messages *[data-oc-link-type="external_link"]:focus {
    background-color: #316FBD !important;
    color: #FFFFFF !important;
    box-shadow: 0 0 0 2px #ffffff, 0 0 3px 5px #3a97f9 !important;
    outline: 2px dotted transparent !important;
    outline-offset: 4px !important;
}

#oc-chat-window #oc-chat-messages *[data-oc-link-type="external_link"].disabled {
    border: 1px solid #999999 !important;
}

#oc-chat-window #oc-chat-messages *[data-oc-link-type="action_link"].disabled {
    cursor: not-allowed !important;
    background: #cccccc !important;
    color: #575757 !important;
    border: 1px solid #999999 !important;
}

#oc-chat-window #oc-chat-messages .oc-chatbot-message-feedback-options {
    margin: 6px !important;
    display: flex !important;
}

#oc-chat-window #oc-chat-messages .oc-chatbot-message-feedback-options.oc-child-clicked {
    visibility: visible !important;

}

#oc-chat-window #oc-chat-messages .oc-chatbot-message-feedback:focus, #oc-chat-window #oc-chat-messages .oc-chatbot-message-feedback:hover {
    background-color: #316FBD;
    box-shadow: 0 0 0 2px #ffffff, 0 0 3px 5px #3a97f9 !important;
    outline: 2px dotted transparent !important;
    outline-offset: 4px !important;
}

#oc-chat-window #oc-chat-messages .oc-chatbot-message-feedback.disabled {
    cursor: not-allowed !important;
}


#oc-chat-window #oc-chat-messages .oc-chatbot-message-feedback-image {
    height: 18px !important;
    width: 18px !important; 
    margin-left: 6px !important;
    cursor: pointer !important;
}

#oc-chat-window .oc-chatbot-conversation-feedback-image {
    height: 18px !important;
    width: 18px !important;
    margin-left: 6px !important;
    cursor: pointer !important;
    /*treat image as background image, non decorative background images should not be dealt with css, prefer img tag or svg tag to avoid accessibility issues*/
    pointer-events: none !important;
}

#oc-chat-window .oc-conversation-feedback-option {
    display: inline-block !important;
    height: 25px !important;
    width: 98% !important;
    cursor: pointer !important;
    margin-top: 4px !important;
    margin-bottom: 4px !important;
    padding-right: 20px !important;
    text-align: left !important;
    border: 1px solid #000000 !important;
}

#oc-chat-window .oc-chatbot-feedback-button-content {
    display: flex !important;
    align-items: center;
    justify-content: flex-start;
    pointer-events: none !important;
}

#oc-chat-window .oc-chatbot-conversation-feedback-button-text {
    pointer-events: none!important;
}

#oc-chat-window #oc-conversation-feedback-negative.oc-clicked,
#oc-chat-window #oc-conversation-feedback-positive.oc-clicked {
    background-color: #316FBD !important;
}

#oc-chat-window #oc-chat-conversation-feedback-text-area-length-indicator {
    margin-right: 8px !important;
}

#oc-chat-window .oc-feedback-input-buttons {
    display: flex !important;
    justify-content: space-between;
    margin-left: 4px !important;
    margin-right: 9px !important;
    padding-top: 2px !important;
}

#oc-chat-window .oc-conversation-feedback-option:hover {
    background-color: #316FBD;
    color: #FFFFFF;
}

#oc-chat-window .oc-conversation-feedback-option:focus {
    background-color: #316FBD;
    color: #FFFFFF;
    box-shadow: 0 0 0 2px #ffffff, 0 0 3px 5px #3a97f9 !important;
    outline: 2px dotted transparent !important;
    outline-offset: 4px !important;
}

#oc-chat-window .oc-message-entry-box {
    margin-bottom: 14px !important;
}

#oc-chat-window #oc-chat-text-area-length-indicator {
    font-size: 12px !important;
    margin-top: -6px !important;
}

#oc-chat-window .oc-controls {
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    height: 28px !important;
    margin-bottom: 12px !important;
    justify-content: flex-end !important;
}

#oc-chat-window .oc-controls #oc-erase-chat-history-label {
    display: inline-block !important;
    margin-left: 4px !important;
}
#oc-chat-window .oc-controls #oc-erase-chat-history-checkbox {
    transform: scale(1.2) !important;
}
#oc-chat-window #oc-chat-conversation-feedback {
    height: 95% !important;
    padding-top: 12px !important;
}
#oc-chat-window .feedback-disabled {
    color: #666 !important;
    border: 1px solid #BBB !important;
}
/* ReSharper disable once DeclarationIsEmpty */
#oc-chat-window .oc-chat-survey-element {
    /*do not delete, class is used for getting post surveys accessible with keyboard*/
   margin:6px 2px 4px 2px !important
}

#oc-chat-window .oc-response-messages p {
    white-space: pre-line !important;
}

/*Ultimateai*/
#oc-chat-window .oc-chat-ultimate-action-link {
    margin-top: 2px !important;
    width: 95% !important;
    color: #2e2eff !important;
}

#oc-chat-window .oc-chat-ultimate-external-link {
    display: inline-block !important;
    padding: 4px !important;
    cursor: pointer !important;
    text-decoration: underline !important;
    font-weight: bold !important;
    border: 1px solid black !important;
    margin-top: 2px !important;
    margin-bottom: 2px !important;
    width: 92% !important;
    background-color: #EFEFEF !important;
    color: #2e2eff !important;
}

#oc-chat-window .oc-chat-ultimate-external-link :hover {
    background-color: #316FBD !important;
    color: #FFFFFF !important;
}

#oc-chat-status .screen-reader,
#oc-chat-window .screen-reader {
    position: absolute !important;
    left: -9999px !important;
    display: block !important;
    height: 0 !important;
    overflow: hidden !important;
}

#oc-chat-window .oc-message-footer #oc-chat-scroll-to-new-messages-button {
    position: absolute !important;
    right: 1em !important;
    top: -2.5em !important;
    width: 4em !important;
    height: 2.4em !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

#oc-chat-window .oc-message-footer #oc-chat-scroll-to-new-messages-count {
    position: absolute !important;
    top: 0 !important;
}

#oc-chat-window .oc-message-footer #oc-chat-scroll-to-new-messages-arrow {
    font-size: 2.25em !important;
    position: absolute !important;
    margin-top: 0.35em !important;
}

#oc-chat-window #oc-chat-end-contact-controls {
    display: flex !important;
    justify-content: space-between !important;
}

#oc-chat-window #oc-chat-end-contact-controls.hidden {
    display: none !important;
}

#oc-chat-window #oc-chat-end-contact-controls button {
    margin: 0 0.25em !important;
}

#oc-chat-window #oc-chat-backdrop {
    display: flex !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    z-index: 10 !important;
    background: rgba(0, 0, 0, 0.25) !important;
    width: 100% !important;
    height: 100% !important;
}

#oc-chat-window #oc-chat-backdrop.hidden {
    display: none !important;
    z-index: -1 !important;
}

#oc-chat-window .oc-chat-modal {
    z-index: 20 !important;
}