img.nav-avatar {
    background-size: cover;
    max-width: 342px;
    max-height: 100px;
    position: inherit;
    margin: 10px auto;
    display: block;
}

/* Estilos personalizados para la bandeja de entrada */
.inbox-container {
    display: flex;
}

.readonly {
    pointer-events: none;
    background-color: #eee;
}

.notifications-list {

    height: 70vh;
    overflow-y: auto;
    background: #ffffff;
    font-weight: 500;
}

.notification-link:hover,
.notification-link-unread:hover {
    background: #e3e6f0;
}

a.notification-link,
a.notification-link-unread {
    color: #080d1a !important;
}

.date-notification {
    float: right;
    font-size: .775rem;
}

.contenido-notification {
    float: left;
}

.notificacion-title {
    font-size: 1.2em;

}

.notification-content-header {
    background: #f5f5f5;
    border-bottom: 1px solid #eee;
}

.notification-link {
    -webkit-transition: background 0.15s;
    -moz-transition: background 0.15s;
    transition: background 0.15s;
    padding: 11.5px 20px;
    cursor: pointer;
    display: flex;
}

@media (max-width: 991px) {
    .notification-link {
        display: block;
        /* Cambia a la visualización en bloque */
    }
}

.unread {
    font-weight: 700 !important;
    background: #F7FAFF;
}

.notification-content {

    padding: 17px 30px;

}

.notification-box {
    /* Ancho fijo para el contenido de notificación */
    height: 70vh;
    overflow-y: auto;
    /* Scroll vertical si es necesario */
    background: #ffffff;
    box-shadow: -6px 0 9px -4px rgba(0, 0, 0, 0.15);
    line-height: 1.5;
}

.notification-selected {
    border-left: 4px solid #4c83ee;
    border-radius: 5px 0px 0px 5px;
    background: #efefef;

}

.sidebar {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 0;
    color: #fff;
    background: #203b87 !important;
}

.icon-profile {
    color: #5d6fae;
}

.badge-profile {
    font-size: 80% !important;
}

.sidebar .nav-item.active {
    color: #fff;
    background: #004a89 !important;
}

.sidebar-brand {
    background: #203b87;
}

.sidebar-toggler {
    background: #203b87;
}

.sidebar-nav .nav-link:hover {
    background-color: var(--cui-sidebar-toggler-hover-bg, rgba(0, 0, 0, 0.3));
}

.nav-pills .nav-link.active,
.nav-pills .show>.nav-link {
    background-color: var(--cui-sidebar-toggler-hover-bg, #005DAC);
}


.dataTables_length {
    padding-top: 20px;
}

.form-select {
    font-size: .875rem !important;
}

.table-audit td {
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.titulo-princ {
    font-size: 15px;
}

.page-item.active .page-link {
    background-color: #20a8d8;
    border-color: #20a8d8;
}

.page-link {
    color: #20a8d8;
}

@media (min-width: 576px) {
    table.table-small {
        margin: 0 auto;
        width: 55%;
        align-content: center;
    }

    .margin {
        margin: 0 30px !important;
    }
}

.input-transparente {
    background: transparent;
    border: transparent;
}

.text-th {
    font-weight: 600;
}

.let {
    text-transform: lowercase;
}

.let:first-letter {
    text-transform: uppercase;
}

.title p:first-of-type::before {
    content: "";
    position: absolute;
    height: 5px;
    background: #5ad67d;
    width: 35px;
    top: -0.75rem;
    border-radius: 3px;
}

@media screen and (max-width: 800px) {
    .table-grow {
        width: 100% !important;
        /* The width is 100%, when the viewport is 800px or smaller */
    }
}

.equipostab {
    display: none;
}

.div-equip {
    max-width: 60%;
}

@media only screen and (max-width: 700px) {
    .div-equip {
        max-width: 100% !important;
        /* The width is 100%, when the viewport is 800px or smaller */
    }
}

@media only screen and (max-width: 1000px) {
    .div-equip {
        max-width: 90% !important;
        /* The width is 100%, when the viewport is 800px or smaller */
    }
}

.blog_post {
    position: relative;
    padding: 6rem 3rem 6rem 3rem;
    background: #fff;
    max-width: 400px;
    border-radius: 10px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, 20%);
    box-shadow: 1px 1px 2rem rgba(0, 0, 0, 0.3);
}

.img_pod {
    height: 110px;
    width: 110px;
    background: linear-gradient(90deg, #ff9966, #ff5e62);
    z-index: -1;
    box-shadow: 1px 1px 2rem rgba(0, 0, 0, 0.3);
    border-radius: 100%;
    position: absolute;
    left: -50px;
    top: 10px;
    transform: translateY(-50%);
}

.img_pod img {
    height: 100px;
    width: 100px;
    position: relative;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: 100%;
    box-shadow: 1px 1px 2rem rgba(0, 0, 0, 0.3);
}

.text-unanthorized {
    font-size: 16px;
    text-align: justify;
}

@media (max-width: 450px) {
    .blog_post {
        position: relative;
        padding: 6rem 3rem 6rem 3rem;
        background: #fff;
        max-width: 70%;
        border-radius: 10px;
        top: 50%;
        left: 50%;
        transform: translate(-50%, 20%);
        box-shadow: 1px 1px 2rem rgba(0, 0, 0, 0.3);
    }
}

.easy-autocomplete {
    width: 100% !important
}

.easy-autocomplete input {
    width: 100%;
}

.easy-autocomplete-container {
    max-height: 160px;
    overflow: auto;
    overflow-y: auto;
    overflow-x: hidden;
}

.link-auth {
    font-size: small;
}

.depth-card {
    box-shadow: 0 15px 30px rgb(85, 100, 162);

    transition: transform 0.3s, box-shadow 0.3s;
}

.title-card-dashboard {
    display: inline-block;
    font-size: 10px;
    padding: 10px 10px 0;
    text-transform: uppercase;
}

.value-card-dashboard {
    font-size: 28px;
    padding: 0 10px;
}

.stat-card-dashboard {
    border-top: 1px solid rgba(255, 255, 255, 0.3);
    font-size: 8px;
    padding: 10px 10px 0;
    text-transform: uppercase;
}

.sub-detail-dashboard {
    font-size: 7.5px;
    padding: 4px 10px 2px;
    opacity: 0.9;
    text-transform: uppercase;
    border-top: 1px solid rgba(255, 255, 255, 0.15);
    margin-top: 4px;
    line-height: 1.6;
}

.info-tooltip {
    cursor: help;
    font-size: 9px;
    opacity: 0.75;
    position: relative;
}

.info-tooltip:hover {
    opacity: 1;
}

.info-tooltip:hover::after {
    content: attr(title);
    position: absolute;
    bottom: 120%;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(0, 0, 0, 0.9);
    color: #fff;
    padding: 6px 10px;
    border-radius: 6px;
    font-size: 10px;
    white-space: normal;
    width: 220px;
    text-align: left;
    z-index: 1000;
    text-transform: none;
    font-weight: normal;
    font-style: normal;
    line-height: 1.4;
    pointer-events: none;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

.info-tooltip:hover::before {
    content: '';
    position: absolute;
    bottom: 110%;
    left: 50%;
    transform: translateX(-50%);
    border: 5px solid transparent;
    border-top-color: rgba(0, 0, 0, 0.9);
    z-index: 1001;
    pointer-events: none;
}

.icon-card-dashboard {
    padding: 10px 10px 0;
}

.formato-moneda {
    text-align: right !important;
}

.dataTables_wrapper table.dataTable thead th {
    text-align: center;
}

.nooptionsearch thead th {
    text-align: center;
}

.spinner-backdrop {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    /* Fondo oscuro semi-transparente */
    z-index: 1050;
    /* Asegúrate de que esté por encima del contenido del modal */
    display: flex;
    align-items: center;
    justify-content: center;
}

.spinner-container {
    text-align: center;
    color: white;
}

#loading {
    display: inline-block;
    width: 50px;
    height: 50px;
    border: 3px solid rgba(255, 255, 255, 0.74);
    border-radius: 50%;
    border-top-color: #203b87;
    animation: spin 1s ease-in-out infinite;
    -webkit-animation: spin 1s ease-in-out infinite;
}

@keyframes spin {
    to {
        -webkit-transform: rotate(360deg);
    }
}

@-webkit-keyframes spin {
    to {
        -webkit-transform: rotate(360deg);
    }
}

.card-select {
    padding-bottom: 15px;
    display: flex;
    border-radius: 3rem;
    box-shadow: -1rem 0 4rem #625b73a3;
    transition: 0.4s ease-out;
    position: relative;
}

.color-ing {
    background-color: #4A5A6A;
    /* Más claro que #2B3641 */
}

.color-ing:hover {
    background-color: #6A7A8A;
    /* Más claro que #405a74 */
}

.color-com {
    background-color: #7A2A2A;
    /* Más claro que #4F0404 */
}

.color-com:hover {
    background-color: #B23A3A;
    /* Más claro que #901111 */
}

/* NUEVA CLASE PARA GERENCIA LOGISTICA */
.color-logistica {
    background-color: #5D4A7A;
    /* Un color morado oscuro de ejemplo */
}

.color-logistica:hover {
    background-color: #8C6AA3;
    /* Un morado más claro para el hover */
}

.color-serv {
    background-color: #2A7A4A;
    /* Más claro que #055630 */
}

.color-serv:hover {
    background-color: #3A9A6A;
    /* Más claro que #19a262 */
}

.card-select:hover {
    transform: translateY(-20px);
    transition: 0.4s ease-out;
}

.card-select:hover~.card-select {
    position: relative;
    left: 50px;
    transition: 0.4s ease-out;
}

.bar-card-select {
    position: absolute;
    margin-top: 10px;
    left: 30px;
    height: 5px;
    width: 60%;
}

.emptybar {
    background-color: #2e3033;
    width: 100%;
    height: 100%;
}

.filledbar {
    position: absolute;
    top: 0px;
    z-index: 3;
    width: 0px;
    height: 100%;
    background: rgb(0, 154, 217);
    background: linear-gradient(90deg, rgba(0, 154, 217, 1) 0%, rgb(0, 217, 188) 65%, rgba(255, 186, 0, 1) 100%);
    transition: 0.6s ease-out;
}

.card-select:hover .filledbar {
    width: 100%;
    transition: 0.4s ease-out;
}

.title-card-select {
    display: inline-block;
    font-size: 15px;
    padding: 10px 10px 0;
    text-transform: uppercase;
}

.total-row td {
    font-weight: bold;
    background-color: #f2f2f2;
}

.btn-indigo {
    color: #000;
    background-color: #c5b3e6 !important;
    border-color: #c5b3e6 !important
}

.btn-indigo:hover {
    color: #000;
    background-color: #a98eda;
    border-color: #a98eda;
}

.btn-indigo.focus,
.btn-indigo:focus {
    box-shadow: 0 0 0 .2rem rgba(78, 83, 88, .5)
}

.btn-indigo.disabled,
.btn-indigo:disabled {
    color: #fff;
    background-color: #2f353a;
    border-color: #2f353a
}

.btn-indigo:not(:disabled):not(.disabled).active,
.btn-indigo:not(:disabled):not(.disabled):active,
.show>.btn-indigo.dropdown-toggle {
    color: #fff;
    background-color: #181b1e;
    border-color: #121517
}

.btn-dark:not(:disabled):not(.disabled).active:focus,
.btn-dark:not(:disabled):not(.disabled):active:focus,
.show>.btn-dark.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(78, 83, 88, .5)
}

/* ------- Stock Status ------- */
.in-stock,
.out-of-stock {
    border-radius: 5px;
    padding: 6px 9px;
}

.in-stock {
    color: #76b77d;
    border: 1px solid #76b77d;
}

.out-of-stock {
    color: #f25e32;
    border: 1px solid #f25e32;
}

.table-stock-col {
    text-align: center !important;
    width: 96px;
}

/* Cambia el color solo del ícono en filas serializadas */
tr.serial td.dt-control::before {
    color: #20a8d8 !important;
}

/* Solo afecta a la tabla con ID tableRowHide */
#tableRowHide_wrapper ul.dtr-details .dtr-data {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
}

#tableRowHide_wrapper ul.dtr-details .dtr-data label {
    margin-right: 5px;
    white-space: nowrap;
}

#tableRowHide_wrapper ul.dtr-details .dtr-data input.form-control {
    width: auto;
    min-width: 150px;
}

.cantidad-ajuste.is-more {
    background-color: #d4edda;
    /* verde claro */
    border-color: #28a745;
}

.cantidad-ajuste.is-less {
    background-color: #f8d7da;
    /* rojo claro */
    border-color: #dc3545;
}

.cantidad-ajuste.is-equal {
    background-color: #fff3cd;
    /* amarillo claro */
    border-color: #ffc107;
}

.groupByMoneda.dataTable tr.dtrg-group:not(.dtrg-end) th {
    background: #d2e0ecaf !important;
    font-weight: 700;
    font-size: 15px;
    color: #333;
    padding: 10px 8px;
}

.groupByMoneda.dataTable tr.dtrg-end th .group-total-content {
    display: flex;
    justify-content: right;
    gap: 1rem;
    align-items: right;
    width: 100%;
    padding: 8px 12px;
    font-weight: 700;
}

.groupByMoneda.dataTable tr.dtrg-end th .group-total-content.center {
    justify-content: right;
}

.groupByMoneda.dataTable tr.dtrg-end th {
    text-align: right !important;
    vertical-align: middle !important;
    padding: 0 !important;
}

.plantilla-item {
    transition: .2s;
}

.plantilla-item.nivel1 {
    margin-left: 30px;
}

.plantilla-item.nivel2 {
    margin-left: 60px;
}

.plantilla-item.nivel3 {
    margin-left: 90px;
}

.clausula-editor {
    transition: .2s;
}

.clausula-editor.nivel1 {
    margin-left: 30px;
}

.clausula-editor.nivel2 {
    margin-left: 60px;
}

.clausula-editor.nivel3 {
    margin-left: 90px;
}

/* --- Dashboard: indicadores de carga --- */
.dashboard-body {
    position: relative;
}

.dashboard-body-content {
    transition: opacity 0.15s ease-in-out;
}

.dashboard-body.is-loading .dashboard-body-content {
    opacity: 0.35;
    pointer-events: none;
}

.dashboard-loading-overlay {
    display: none;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 20;
    justify-content: center;
    align-items: flex-start;
}

.dashboard-body.is-loading .dashboard-loading-overlay {
    display: flex;
}

.dashboard-loading-box {
    position: sticky;
    top: 24px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 10px 18px;
    background-color: #fff;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 999px;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.12);
    font-size: 13px;
    color: #203b87;
}

.dashboard-loading-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    color: #203b87;
}

.dashboard-loading-spinner {
    display: inline-block;
    width: 16px;
    height: 16px;
    border: 2px solid rgba(32, 59, 135, 0.25);
    border-top-color: #203b87;
    border-radius: 50%;
    animation: dashboard-spin 0.8s linear infinite;
}

.dashboard-loading-spinner-lg {
    width: 20px;
    height: 20px;
    border-width: 3px;
}

@keyframes dashboard-spin {
    to {
        transform: rotate(360deg);
    }
}

/* =========================================================
    n8n Chat
   ========================================================= */

.chat-message-body a[href*=".pdf"] {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    background-color: #ff6d5a !important;
    color: #ffffff !important;
    padding: 10px 16px !important;
    border-radius: 8px !important;
    text-decoration: none !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    margin-top: 8px !important;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15) !important;
    transition: background-color 0.2s ease, transform 0.1s ease !important;
}

.chat-message-body a[href*=".pdf"]:hover {
    background-color: #e55a48 !important;
    transform: translateY(-1px) !important;
}

/* 1. Recuadro de la cabecera con DEGRADADO (Verde manzana -> Azul corporativo) */
.chat-header {
    background: linear-gradient(135deg, #7DA12A 0%, #0062A8 100%) !important;
    padding-top: 2px !important;
    padding-bottom: 2px !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
    min-height: 110px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    gap: 0px !important;
}

/* 2. Alto del logo */
.custom-chat-logo {
    max-height: 123px !important;
    width: auto !important;
    object-fit: contain !important;
    display: block !important;
    margin: 0 !important;
}

/* 3. Subtítulo "En línea" en BLANCO */
.chat-header-subtitle,
.chat-header p,
.chat-header span {
    margin-top: -18px !important;
    margin-bottom: 0 !important;
    padding: 0 !important;
    line-height: 1.2 !important;
    font-size: 15px !important;
    color: #ffffff !important;
}

/* 4. Respuestas del asistente: VERDE SUAVE PASTEL (#F0F5E6) con texto NEGRO */
.chat-message-from-bot,
.chat-message-from-assistant,
.chat-message[data-from="bot"],
.chat-message[data-from="assistant"],
.chat-message-body {
    background-color: #F0F5E6 !important;
    border-radius: 12px !important;
    padding: 10px 14px !important;
    color: #000000 !important;
}

.chat-message-body *,
.chat-message-from-bot *,
.chat-message-from-assistant * {
    color: #000000 !important;
}

/* 5. Mensajes del usuario: AZUL SUAVE PASTEL (#E6F1F8) con texto NEGRO */
.chat-message-from-user,
.chat-message-user,
.chat-message[data-from="user"] {
    background-color: #E6F1F8 !important;
    border-radius: 12px !important;
    padding: 10px 14px !important;
    color: #000000 !important;
}

.chat-message-from-user *,
.chat-message-user *,
.chat-message[data-from="user"] * {
    color: #000000 !important;
}

/* 6. Texto del cuadro donde escribes en NEGRO */
textarea,
input[type="text"] {
    color: #000000 !important;
}

/* 7. Separadores y bordes de las tablas en VERDE MATE */
.chat-message-body table {
    border-collapse: collapse !important;
    width: 100% !important;
}

.chat-message-body th,
.chat-message-body td {
    border-bottom: 1px solid #B0C988 !important;
    padding: 6px 8px !important;
}

.chat-message-body th {
    border-bottom: 2px solid #7DA12A !important;
}

.chat-message-body hr {
    border: none !important;
    border-top: 1px solid #B0C988 !important;
}

/* Estilo en reposo para TODOS los enlaces del asistente */
.chat-message-body a,
.chat-message-from-assistant a,
.chat-message-from-bot a,
.chat-message a {
    color: #000000 !important;
    font-weight: 600 !important;
    text-decoration: underline !important;
    transition: color 0.2s ease, text-shadow 0.2s ease, text-decoration-color 0.2s ease !important;
}

/* ILUMINACIÓN ROJIZA al posar el cursor (Hover) */
.chat-message-body a:hover,
.chat-message-from-assistant a:hover,
.chat-message-from-bot a:hover,
.chat-message a:hover,
.chat-message-body a *:hover {
    color: #D32F2F !important;
    /* Rojo corporativo */
    text-decoration-color: #D32F2F !important;
    text-shadow: 0 0 8px rgba(211, 47, 47, 0.5) !important;
    /* Resplandor */
}

/* ========================================================================= */
/* 8. BOTÓN FLOTANTE DE APERTURA: Isotipo Yin-Yang Completo ("Barrigona")   */
/* ========================================================================= */

.chat-window-toggle svg,
.chat-toggle svg,
.n8n-chat-toggle svg,
div[class*="window-toggle"] svg,
button[class*="window-toggle"] svg {
    display: none !important;
}

.chat-window-toggle,
.chat-toggle,
.n8n-chat-toggle,
div[class*="window-toggle"],
button[class*="window-toggle"] {
    background-color: #ffffff !important;
    background-image: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%20100%20100%27%3E%3Cdefs%3E%3ClinearGradient%20id%3D%27blueGrad%27%20x1%3D%2720%25%27%20y1%3D%270%25%27%20x2%3D%2780%25%27%20y2%3D%27100%25%27%3E%3Cstop%20offset%3D%270%25%27%20stop-color%3D%27%230091FF%27/%3E%3Cstop%20offset%3D%2745%25%27%20stop-color%3D%27%230062A8%27/%3E%3Cstop%20offset%3D%27100%25%27%20stop-color%3D%27%23002D54%27/%3E%3C/linearGradient%3E%3ClinearGradient%20id%3D%27greenGrad%27%20x1%3D%2720%25%27%20y1%3D%270%25%27%20x2%3D%2780%25%27%20y2%3D%27100%25%27%3E%3Cstop%20offset%3D%270%25%27%20stop-color%3D%27%23BBE838%27/%3E%3Cstop%20offset%3D%2745%25%27%20stop-color%3D%27%237DA12A%27/%3E%3Cstop%20offset%3D%27100%25%27%20stop-color%3D%27%2338520D%27/%3E%3C/linearGradient%3E%3Cfilter%20id%3D%27shadow%27%20x%3D%27-20%25%27%20y%3D%27-20%25%27%20width%3D%27140%25%27%20height%3D%27140%25%27%3E%3CfeDropShadow%20dx%3D%271%27%20dy%3D%272%27%20stdDeviation%3D%271.5%27%20flood-opacity%3D%270.25%27/%3E%3C/filter%3E%3C/defs%3E%3Cg%20transform%3D%27rotate%28-45%2C%2050%2C%2050%29%27%20filter%3D%27url%28%23shadow%29%27%3E%3Cpath%20d%3D%27M%2050%2C6%20%20A%2044%2044%200%200%200%2050%2C94%20%20A%2022%2022%200%200%201%2050%2C50%20%20A%2022%2022%200%200%200%2050%2C6%20Z%27%20%20%20fill%3D%27url%28%23blueGrad%29%27%20stroke%3D%27%23ffffff%27%20stroke-width%3D%272.5%27%20stroke-linejoin%3D%27round%27/%3E%20%20%3Cpath%20d%3D%27M%2050%2C6%20%20A%2044%2044%200%200%201%2050%2C94%20%20A%2022%2022%200%200%201%2050%2C50%20%20A%2022%2022%200%200%200%2050%2C6%20Z%27%20%20%20fill%3D%27url%28%23greenGrad%29%27%20stroke%3D%27%23ffffff%27%20stroke-width%3D%272.5%27%20stroke-linejoin%3D%27round%27/%3E%3C/g%3E%3C/svg%3E") !important;
    background-size: 82% !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    border-radius: 50% !important;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.22) !important;
    border: 3px solid #7DA12A !important;
    transition: transform 0.5s cubic-bezier(0.34, 1.56, 0.64, 1), border-color 0.3s ease !important;
    position: relative !important;
    overflow: hidden !important;
    z-index: 9999 !important;
}

.chat-window-toggle:hover,
.chat-toggle:hover,
.n8n-chat-toggle:hover,
div[class*="window-toggle"]:hover,
button[class*="window-toggle"]:hover {
    transform: rotate(360deg) scale(1.12) !important;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.35) !important;
    border-color: #0062A8 !important;
}

.chat-window-toggle:active,
.chat-toggle:active,
.n8n-chat-toggle:active,
div[class*="window-toggle"]:active,
button[class*="window-toggle"]:active {
    transform: rotate(-180deg) scale(0.9) !important;
}

/* ========================================================================= */
/* 9. BOTÓN DE ENVIAR MENSAJE: Transición dinámica Reposo vs Hover          */
/* ========================================================================= */

/* Botón de envío exclusivo del chat n8n */
#n8n-chat button[type="submit"],
#n8n-chat button[class*="send"] {
    background-color: transparent !important;
    border-radius: 12px !important;
    transition: background-color 0.2s ease, transform 0.1s ease !important;
}

/* Iconos y elementos internos del botón */
#n8n-chat button[type="submit"] *,
#n8n-chat button[class*="send"] * {
    fill: #7DA12A !important;
    color: #7DA12A !important;
    stroke: #7DA12A !important;
    transition: fill 0.2s ease, color 0.2s ease, stroke 0.2s ease !important;
}

/* Hover del botón */
#n8n-chat button[type="submit"]:hover,
#n8n-chat button[class*="send"]:hover {
    background-color: #7DA12A !important;
}

/* Icono blanco al pasar el cursor */
#n8n-chat button[type="submit"]:hover *,
#n8n-chat button[class*="send"]:hover * {
    fill: #ffffff !important;
    color: #ffffff !important;
    stroke: #ffffff !important;
}