/* Ocultar chatbot en la página de login */
body[data-page="login"] .druid-webchat,
body[data-page="login"] #druid-webchat,
body[data-page="login"] [class*="druid"],
body[data-page="login"] [id*="druid"] {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* También ocultar cualquier elemento del chatbot que pueda aparecer */
body[data-page="login"] iframe[src*="druid"],
body[data-page="login"] div[class*="webchat"],
body[data-page="login"] div[id*="webchat"] {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* Estilos para el indicador de carga del chatbot */
.chatbot-loading {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background-color: #f8f9fa;
    border-radius: 8px;
    margin: 10px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.chatbot-loading .spinner-border {
    width: 1.5rem;
    height: 1.5rem;
}

/* Posicionamiento del chatbot */
#chatbot-container {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 1000;
    max-width: 400px;
    min-width: 300px;
}

/* Estilos para el mensaje de error del chatbot */
.chatbot-error {
    margin: 10px;
}

.chatbot-error .alert {
    margin-bottom: 0;
    font-size: 0.9rem;
}

.chatbot-error .btn {
    font-size: 0.8rem;
    padding: 0.25rem 0.5rem;
}

/* Branding del chatbot por tenant */
.druidWebchatRoot_v2 button[class*="launcher"],
.druidWebchatRoot_v2 button[class*="toggle"],
.druidWebchatRoot_v2 button[aria-label*="chat" i],
.druidWebchatRoot_v2 button[aria-label*="helpdesk" i] {
    background-color: var(--chatbot-primary-color, var(--primary-color)) !important;
    border-color: var(--chatbot-primary-color, var(--primary-color)) !important;
    color: #ffffff !important;
}

.druidWebchatRoot_v2 [class*="header"],
.druidWebchatRoot_v2 [class*="Header"],
.druidWebchatRoot_v2 [class*="topbar"],
.druidWebchatRoot_v2 [class*="TopBar"],
.druidWebchatRoot_v2 [class*="titlebar"],
.druidWebchatRoot_v2 [class*="TitleBar"] {
    background-color: var(--chatbot-primary-color, var(--primary-color)) !important;
    border-color: var(--chatbot-primary-color, var(--primary-color)) !important;
    color: #ffffff !important;
}

.druidWebchatRoot_v2 [class*="header"] *,
.druidWebchatRoot_v2 [class*="Header"] *,
.druidWebchatRoot_v2 [class*="topbar"] *,
.druidWebchatRoot_v2 [class*="TopBar"] *,
.druidWebchatRoot_v2 [class*="titlebar"] *,
.druidWebchatRoot_v2 [class*="TitleBar"] * {
    color: #ffffff !important;
}

.druidWebchatRoot_v2 button[class*="send"],
.druidWebchatRoot_v2 button[aria-label*="send" i],
.druidWebchatRoot_v2 button[type="submit"] {
    background-color: var(--chatbot-primary-color, var(--primary-color)) !important;
    border-color: var(--chatbot-primary-color, var(--primary-color)) !important;
    color: #ffffff !important;
}

.druidWebchatRoot_v2 button[class*="send"]:hover,
.druidWebchatRoot_v2 button[class*="send"]:focus,
.druidWebchatRoot_v2 button[class*="send"]:active,
.druidWebchatRoot_v2 button[aria-label*="send" i]:hover,
.druidWebchatRoot_v2 button[aria-label*="send" i]:focus,
.druidWebchatRoot_v2 button[aria-label*="send" i]:active,
.druidWebchatRoot_v2 button[type="submit"]:hover,
.druidWebchatRoot_v2 button[type="submit"]:focus,
.druidWebchatRoot_v2 button[type="submit"]:active {
    background-color: var(--chatbot-primary-color, var(--primary-color)) !important;
    border-color: var(--chatbot-primary-color, var(--primary-color)) !important;
    color: #ffffff !important;
}

.druidWebchatRoot_v2 button[class*="send"] *,
.druidWebchatRoot_v2 button[aria-label*="send" i] *,
.druidWebchatRoot_v2 button[type="submit"] * {
    background-color: var(--chatbot-primary-color, var(--primary-color)) !important;
}

.druidWebchatRoot_v2 button[class*="send"] svg,
.druidWebchatRoot_v2 button[class*="send"] svg *,
.druidWebchatRoot_v2 button[aria-label*="send" i] svg,
.druidWebchatRoot_v2 button[aria-label*="send" i] svg *,
.druidWebchatRoot_v2 button[type="submit"] svg,
.druidWebchatRoot_v2 button[type="submit"] svg * {
    fill: #ffffff !important;
    stroke: #ffffff !important;
    color: #ffffff !important;
}

.druidWebchatRoot_v2 button[class*="attach"],
.druidWebchatRoot_v2 button[aria-label*="attach" i],
.druidWebchatRoot_v2 button[title*="attach" i],
.druidWebchatRoot_v2 button[aria-label*="adjunt" i],
.druidWebchatRoot_v2 button[title*="adjunt" i],
.druidWebchatRoot_v2 [role="button"][aria-label*="attach" i],
.druidWebchatRoot_v2 [role="button"][title*="attach" i],
.druidWebchatRoot_v2 [role="button"][aria-label*="adjunt" i],
.druidWebchatRoot_v2 [role="button"][title*="adjunt" i],
.druidWebchatRoot_v2 label[aria-label*="attach" i],
.druidWebchatRoot_v2 label[title*="attach" i],
.druidWebchatRoot_v2 label[aria-label*="adjunt" i],
.druidWebchatRoot_v2 label[title*="adjunt" i] {
    background-color: var(--chatbot-primary-color, var(--primary-color)) !important;
    border-color: var(--chatbot-primary-color, var(--primary-color)) !important;
    color: #ffffff !important;
}

.druidWebchatRoot_v2 button[class*="attach"]:hover,
.druidWebchatRoot_v2 button[class*="attach"]:focus,
.druidWebchatRoot_v2 button[class*="attach"]:active,
.druidWebchatRoot_v2 button[aria-label*="attach" i]:hover,
.druidWebchatRoot_v2 button[aria-label*="attach" i]:focus,
.druidWebchatRoot_v2 button[aria-label*="attach" i]:active,
.druidWebchatRoot_v2 button[title*="attach" i]:hover,
.druidWebchatRoot_v2 button[title*="attach" i]:focus,
.druidWebchatRoot_v2 button[title*="attach" i]:active,
.druidWebchatRoot_v2 button[aria-label*="adjunt" i]:hover,
.druidWebchatRoot_v2 button[aria-label*="adjunt" i]:focus,
.druidWebchatRoot_v2 button[aria-label*="adjunt" i]:active,
.druidWebchatRoot_v2 button[title*="adjunt" i]:hover,
.druidWebchatRoot_v2 button[title*="adjunt" i]:focus,
.druidWebchatRoot_v2 button[title*="adjunt" i]:active,
.druidWebchatRoot_v2 [role="button"][aria-label*="attach" i]:hover,
.druidWebchatRoot_v2 [role="button"][aria-label*="attach" i]:focus,
.druidWebchatRoot_v2 [role="button"][aria-label*="attach" i]:active,
.druidWebchatRoot_v2 [role="button"][title*="attach" i]:hover,
.druidWebchatRoot_v2 [role="button"][title*="attach" i]:focus,
.druidWebchatRoot_v2 [role="button"][title*="attach" i]:active,
.druidWebchatRoot_v2 [role="button"][aria-label*="adjunt" i]:hover,
.druidWebchatRoot_v2 [role="button"][aria-label*="adjunt" i]:focus,
.druidWebchatRoot_v2 [role="button"][aria-label*="adjunt" i]:active,
.druidWebchatRoot_v2 [role="button"][title*="adjunt" i]:hover,
.druidWebchatRoot_v2 [role="button"][title*="adjunt" i]:focus,
.druidWebchatRoot_v2 [role="button"][title*="adjunt" i]:active,
.druidWebchatRoot_v2 label[aria-label*="attach" i]:hover,
.druidWebchatRoot_v2 label[aria-label*="attach" i]:focus,
.druidWebchatRoot_v2 label[aria-label*="attach" i]:active,
.druidWebchatRoot_v2 label[title*="attach" i]:hover,
.druidWebchatRoot_v2 label[title*="attach" i]:focus,
.druidWebchatRoot_v2 label[title*="attach" i]:active,
.druidWebchatRoot_v2 label[aria-label*="adjunt" i]:hover,
.druidWebchatRoot_v2 label[aria-label*="adjunt" i]:focus,
.druidWebchatRoot_v2 label[aria-label*="adjunt" i]:active,
.druidWebchatRoot_v2 label[title*="adjunt" i]:hover,
.druidWebchatRoot_v2 label[title*="adjunt" i]:focus,
.druidWebchatRoot_v2 label[title*="adjunt" i]:active {
    background-color: var(--chatbot-primary-color, var(--primary-color)) !important;
    border-color: var(--chatbot-primary-color, var(--primary-color)) !important;
    color: #ffffff !important;
}

.druidWebchatRoot_v2 button[class*="attach"] svg,
.druidWebchatRoot_v2 button[class*="attach"] svg *,
.druidWebchatRoot_v2 button[aria-label*="attach" i] svg,
.druidWebchatRoot_v2 button[aria-label*="attach" i] svg *,
.druidWebchatRoot_v2 button[title*="attach" i] svg,
.druidWebchatRoot_v2 button[title*="attach" i] svg *,
.druidWebchatRoot_v2 button[aria-label*="adjunt" i] svg,
.druidWebchatRoot_v2 button[aria-label*="adjunt" i] svg *,
.druidWebchatRoot_v2 button[title*="adjunt" i] svg,
.druidWebchatRoot_v2 button[title*="adjunt" i] svg *,
.druidWebchatRoot_v2 [role="button"][aria-label*="attach" i] svg,
.druidWebchatRoot_v2 [role="button"][aria-label*="attach" i] svg *,
.druidWebchatRoot_v2 [role="button"][title*="attach" i] svg,
.druidWebchatRoot_v2 [role="button"][title*="attach" i] svg *,
.druidWebchatRoot_v2 [role="button"][aria-label*="adjunt" i] svg,
.druidWebchatRoot_v2 [role="button"][aria-label*="adjunt" i] svg *,
.druidWebchatRoot_v2 [role="button"][title*="adjunt" i] svg,
.druidWebchatRoot_v2 [role="button"][title*="adjunt" i] svg *,
.druidWebchatRoot_v2 label[aria-label*="attach" i] svg,
.druidWebchatRoot_v2 label[aria-label*="attach" i] svg *,
.druidWebchatRoot_v2 label[title*="attach" i] svg,
.druidWebchatRoot_v2 label[title*="attach" i] svg *,
.druidWebchatRoot_v2 label[aria-label*="adjunt" i] svg,
.druidWebchatRoot_v2 label[aria-label*="adjunt" i] svg *,
.druidWebchatRoot_v2 label[title*="adjunt" i] svg,
.druidWebchatRoot_v2 label[title*="adjunt" i] svg * {
    fill: #ffffff !important;
    stroke: #ffffff !important;
    color: #ffffff !important;
}

.druidWebchatRoot_v2 button[class*="attach"] *,
.druidWebchatRoot_v2 button[aria-label*="attach" i] *,
.druidWebchatRoot_v2 button[title*="attach" i] *,
.druidWebchatRoot_v2 button[aria-label*="adjunt" i] *,
.druidWebchatRoot_v2 button[title*="adjunt" i] * {
    background-color: var(--chatbot-primary-color, var(--primary-color)) !important;
}

.druidWebchatRoot_v2 [class*="composer"] button:not([class*="send"]),
.druidWebchatRoot_v2 [class*="input"] button:not([class*="send"]),
.druidWebchatRoot_v2 [class*="footer"] button:not([class*="send"]) {
    background-color: var(--chatbot-primary-color, var(--primary-color)) !important;
    border-color: var(--chatbot-primary-color, var(--primary-color)) !important;
    color: #ffffff !important;
}

.druidWebchatRoot_v2 [class*="composer"] button:not([class*="send"]) svg,
.druidWebchatRoot_v2 [class*="composer"] button:not([class*="send"]) svg *,
.druidWebchatRoot_v2 [class*="input"] button:not([class*="send"]) svg,
.druidWebchatRoot_v2 [class*="input"] button:not([class*="send"]) svg *,
.druidWebchatRoot_v2 [class*="footer"] button:not([class*="send"]) svg,
.druidWebchatRoot_v2 [class*="footer"] button:not([class*="send"]) svg * {
    fill: #ffffff !important;
    stroke: #ffffff !important;
    color: #ffffff !important;
}

.druidWebchatRoot_v2 [class*="composer"] button:not([class*="send"]):hover,
.druidWebchatRoot_v2 [class*="composer"] button:not([class*="send"]):focus,
.druidWebchatRoot_v2 [class*="composer"] button:not([class*="send"]):active,
.druidWebchatRoot_v2 [class*="input"] button:not([class*="send"]):hover,
.druidWebchatRoot_v2 [class*="input"] button:not([class*="send"]):focus,
.druidWebchatRoot_v2 [class*="input"] button:not([class*="send"]):active,
.druidWebchatRoot_v2 [class*="footer"] button:not([class*="send"]):hover,
.druidWebchatRoot_v2 [class*="footer"] button:not([class*="send"]):focus,
.druidWebchatRoot_v2 [class*="footer"] button:not([class*="send"]):active {
    background-color: var(--chatbot-primary-color, var(--primary-color)) !important;
    border-color: var(--chatbot-primary-color, var(--primary-color)) !important;
    color: #ffffff !important;
}

/* Fallback específico del widget actual (clases webchat__) */
[class*="druid__minimizable_web-chat"] .webchat__send-box .webchat__icon-button:not([title="Enviar"]) {
    background-color: var(--chatbot-primary-color, var(--primary-color)) !important;
    border-color: var(--chatbot-primary-color, var(--primary-color)) !important;
    color: #ffffff !important;
}

[class*="druid__minimizable_web-chat"] .webchat__send-box .webchat__icon-button:not([title="Enviar"]):hover,
[class*="druid__minimizable_web-chat"] .webchat__send-box .webchat__icon-button:not([title="Enviar"]):focus,
[class*="druid__minimizable_web-chat"] .webchat__send-box .webchat__icon-button:not([title="Enviar"]):active {
    background-color: var(--chatbot-primary-color, var(--primary-color)) !important;
    border-color: var(--chatbot-primary-color, var(--primary-color)) !important;
    color: #ffffff !important;
}

[class*="druid__minimizable_web-chat"] .webchat__send-box .webchat__icon-button:not([title="Enviar"]) .webchat__icon-button__shade,
[class*="druid__minimizable_web-chat"] .webchat__send-box .webchat__icon-button:not([title="Enviar"]):hover .webchat__icon-button__shade,
[class*="druid__minimizable_web-chat"] .webchat__send-box .webchat__icon-button:not([title="Enviar"]):focus .webchat__icon-button__shade,
[class*="druid__minimizable_web-chat"] .webchat__send-box .webchat__icon-button:not([title="Enviar"]):active .webchat__icon-button__shade {
    background-color: var(--chatbot-primary-color, var(--primary-color)) !important;
    border-color: var(--chatbot-primary-color, var(--primary-color)) !important;
    opacity: 1 !important;
}

[class*="druid__minimizable_web-chat"] .webchat__send-box .webchat__icon-button:not([title="Enviar"]) .webchat__attachment-icon,
[class*="druid__minimizable_web-chat"] .webchat__send-box .webchat__icon-button:not([title="Enviar"]) .webchat__attachment-icon * {
    fill: #ffffff !important;
    stroke: #ffffff !important;
    color: #ffffff !important;
}

/* Iconos de vista vacía / welcome state */
[class*="druid__minimizable_web-chat"] [class*="empty"] [class*="icon"],
[class*="druid__minimizable_web-chat"] [class*="welcome"] [class*="icon"],
[class*="druid__minimizable_web-chat"] [class*="no-message"] [class*="icon"],
[class*="druid__minimizable_web-chat"] [class*="watermark"],
[class*="druid__minimizable_web-chat"] .webchat__chat-icon,
[class*="druid__minimizable_web-chat"] .webchat__logo,
[class*="druid__minimizable_web-chat"] .webchat__avatar {
    color: var(--chatbot-primary-color, var(--primary-color)) !important;
    border-color: var(--chatbot-primary-color, var(--primary-color)) !important;
}

[class*="druid__minimizable_web-chat"] [class*="empty"] [class*="icon"] svg,
[class*="druid__minimizable_web-chat"] [class*="empty"] [class*="icon"] svg *,
[class*="druid__minimizable_web-chat"] [class*="welcome"] [class*="icon"] svg,
[class*="druid__minimizable_web-chat"] [class*="welcome"] [class*="icon"] svg *,
[class*="druid__minimizable_web-chat"] [class*="no-message"] [class*="icon"] svg,
[class*="druid__minimizable_web-chat"] [class*="no-message"] [class*="icon"] svg *,
[class*="druid__minimizable_web-chat"] [class*="watermark"] svg,
[class*="druid__minimizable_web-chat"] [class*="watermark"] svg *,
[class*="druid__minimizable_web-chat"] .webchat__chat-icon svg,
[class*="druid__minimizable_web-chat"] .webchat__chat-icon svg *,
[class*="druid__minimizable_web-chat"] .webchat__logo svg,
[class*="druid__minimizable_web-chat"] .webchat__logo svg *,
[class*="druid__minimizable_web-chat"] .webchat__avatar svg,
[class*="druid__minimizable_web-chat"] .webchat__avatar svg * {
    fill: var(--chatbot-primary-color, var(--primary-color)) !important;
    stroke: var(--chatbot-primary-color, var(--primary-color)) !important;
    color: var(--chatbot-primary-color, var(--primary-color)) !important;
}
