/* Chatbot Overrides */

/* Main chat container - consolidated styles */
#chat_app .chat.right .sc-chat-window {
    border-radius: 0 !important;
    border: 1px solid #000 !important;
    transform: translate(-3px, -3px) !important;
    box-shadow: 4px 4px 0 #000 !important;
    background: #fff !important;
    height: 500px !important; /* Fixed height for scroll to work */
    max-height: 80vh !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
}

/* Header styles */
#chat_app .sc-header,
#chat_app .sc-header[style] {
    background: #000 !important;
    background-color: #000 !important;
    border-radius: 0 !important;
    color: #fff !important;
    flex-shrink: 0 !important; /* Prevent header from shrinking */
}

#chat_app .sc-header--title {
    color: #fff !important;
}

/* Fix header logo visibility */
#chat_app .sc-header--img {
    filter: invert(0) !important;
}

/* Message container - Fix scroll issue */
#chat_app .sc-message-list {
    background-color: #fff !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    flex: 1 1 auto !important; /* Fill available space in flex container */
    min-height: 0 !important; /* Required for flex children to scroll properly */
    height: 0 !important; /* Force flex to calculate height */
    -webkit-overflow-scrolling: touch !important; /* Smooth scrolling on iOS */
}

/* Hide message avatars and adjust message positioning */
#chat_app .sc-message--avatar {
    display: none !important;
}

#chat_app .sc-message--content {
    margin-left: 0 !important;
}

/* Message bubbles - received (bot) */
#chat_app .sc-message--content.received .sc-message--text,
#chat_app .sc-message--content.received .sc-message--text[style] {
    background-color: #ffffff !important;
    background: #ffffff !important;
    border-radius: 0 !important;
    border: 1px solid #000 !important;
    color: #000 !important;
    transform: translate(-2px, -2px) !important;
    box-shadow: 4px 4px 0 #000 !important;
    margin-left: 10px !important;
}

#chat_app .sc-message--content.received .sc-message--text-content,
#chat_app .sc-message--content.received .sc-message--text-content[style] {
    color: #000 !important;
}

/* Message bubbles - sent (user) */
#chat_app .sc-message--content.sent .sc-message--text,
#chat_app .sc-message--content.sent .sc-message--text[style] {
    background-color: #000 !important;
    background: #000 !important;
    border-radius: 0 !important;
    border: 1px solid #000 !important;
    color: #fff !important;
    transform: translate(-2px, -2px) !important;
    box-shadow: 4px 4px 0 #000 !important;
    margin-right: 10px !important;
}

#chat_app .sc-message--content.sent .sc-message--text-content,
#chat_app .sc-message--content.sent .sc-message--text-content[style] {
    color: #fff !important;
}

/* Message formatting - bold, italic, links, lists */
#chat_app .sc-message--text-content strong,
#chat_app .sc-message--text-content b {
    font-weight: 700 !important;
}

#chat_app .sc-message--text-content em,
#chat_app .sc-message--text-content i {
    font-style: italic !important;
}

#chat_app .sc-message--text-content a {
    color: inherit !important;
    text-decoration: underline !important;
}

#chat_app .sc-message--text-content ul,
#chat_app .sc-message--text-content ol {
    margin: 8px 0 !important;
    padding-left: 20px !important;
    list-style: disc !important;
}

#chat_app .sc-message--text-content ol {
    list-style: decimal !important;
}

#chat_app .sc-message--text-content li {
    margin: 4px 0 !important;
    display: list-item !important;
}

/* Message bubbles - sent (user) */
#chat_app .sc-message--content.sent {
    justify-content: flex-end !important;
}
/* Input area */
#chat_app .sc-user-input {
    background: #fff !important;
    border-top: 1px solid #000 !important;
    border-radius: 0 !important;
    flex-shrink: 0 !important; /* Prevent input from shrinking */
}

#chat_app .sc-user-input--text {
    background: #fff !important;
    color: #000 !important;
}

/* Launcher button */
#chat_app .sc-launcher {
    background-color: #000 !important;
    border-radius: 0 !important;
    border: 1px solid #000 !important;
    box-shadow: 4px 4px 0 #000 !important;
    transform: translate(-2px, -2px) !important;
}

/* Fix launcher logo visibility */
#chat_app .sc-launcher .sc-open-icon,
#chat_app .sc-launcher .sc-closed-icon {
    filter: invert(0) !important;
}

/* Message toolbox */
#chat_app .sc-message--toolbox,
#chat_app .sc-message--toolbox[style] {
    background: transparent !important;
    background-color: transparent !important;
}

/* Input buttons */
#chat_app .sc-user-input--button-icon-wrapper,
#chat_app .sc-user-input--emoji-icon-wrapper,
#chat_app .sc-user-input--file-icon-wrapper {
    filter: grayscale(100%) !important;
}

/* Suggestions row */
#chat_app .sc-suggestions-row {
    background: #fff !important;
    border-radius: 0 !important;
}

/* Typing indicator */
#chat_app .sc-typing-indicator,
#chat_app .sc-typing-indicator[style] {
    background-color: #ffffff !important;
    background: #ffffff !important;
    border-radius: 0 !important;
    border: 1px solid #000 !important;
    color: #000 !important;
    transform: translate(-2px, -2px) !important;
    box-shadow: 4px 4px 0 #000 !important;
    margin-left: 10px !important;
}

/* Close and reset buttons */
#chat_app .sc-header--close-button img,
#chat_app .sc-header--reset-button img {
    filter: brightness(0) invert(1) !important;
}

/* Initial widget message */
#chat_app .sc-message--content.received:first-child .sc-message--text,
#chat_app .sc-message--content.received:first-child .sc-message--text[style] {
    background-color: #ffffff !important;
    background: #ffffff !important;
    border-radius: 0 !important;
    border: 1px solid #000 !important;
    color: #000 !important;
    transform: translate(-2px, -2px) !important;
    box-shadow: 4px 4px 0 #000 !important;
    margin-left: 10px !important;
}

/* Notification dot - force black */
#chat_app .sc-notification,
#chat_app .sc-launcher .notification {
    background-color: #000 !important;
    border: 1px solid #000 !important;
    border-radius: 0 !important;
}

/* Fix any remaining rounded corners */
#chat_app * {
    border-radius: 0 !important;
} 

/* ===== Chatbot Currency Overrides ===== */
/* Hide ALL currency symbols in chatbot */
#chat_app [class*="currency"]::before,
#chat_app [class*="price"]::before,
#chat_app .sc-message--text [class*="currency"],
#chat_app .sc-message--text [class*="price"] {
  content: '' !important;
  display: none !important; /* Double protection */
}

/* Style dynamically replaced prices */
#chat_app .sc-message--text {
  font-family: inherit !important;
  position: relative; /* For absolute positioning if needed */
}

/* Add subtle animation for price updates */
#chat_app .sc-message--text [data-currency] {
  transition: color 0.3s ease;
}

#chat_app .sc-message--text [data-currency]::after {
  content: attr(data-currency);
  margin-left: 3px;
  font-weight: bold;
  color: inherit; /* Match surrounding text */
}

/* Special cases for different message types */
#chat_app .sc-message--content.sent .sc-message--text [data-currency]::after {
  color: #fff !important; /* For user messages */
}

#chat_app .sc-message--content.received .sc-message--text [data-currency]::after {
  color: #000 !important; /* For bot messages */
}