/* ============================
   RESPONSIVO (SMARTPHONES Y TABLETS)
   Extraído de front.css para mejor mantenibilidad
============================ */

.balam-mobile-only {
    display: none !important;
}

@media (max-width: 760px) {
    .balam-system-parameters {
        gap: 16px !important;
    }

    .balam-system-parameter-section {
        padding: 16px !important;
        border-radius: 16px !important;
    }

    .balam-system-parameters .balam-mail-overview,
    .balam-system-parameters .balam-drive-front-head,
    .balam-system-parameters .balam-whatsapp-front-head {
        display: block;
    }

    .balam-system-parameters .balam-mail-autosave-pill,
    .balam-system-parameters .balam-drive-switch {
        display: inline-flex;
        margin-top: 12px;
    }

    .balam-system-parameters .balam-drive-card,
    .balam-system-parameters .balam-mail-grid,
    .balam-system-parameters .balam-whatsapp-grid,
    .balam-system-parameters .balam-drive-status-grid,
    .balam-system-parameters .balam-drive-credentials-grid {
        grid-template-columns: 1fr !important;
    }

    .balam-system-parameters .balam-drive-card .balam-btn,
    .balam-system-parameters .balam-whatsapp-actions .balam-btn {
        width: 100%;
        justify-content: center;
    }
}

/* Final width reset for vacation cards. This comes after the generic mobile
   table rules so they cannot reintroduce content-sized rows. */
@media (max-width: 760px) {
    .balam-vacation-days-form,
    .balam-vacation-days-table,
    .balam-vacation-days-table > tbody,
    .balam-vacation-days-table > tbody > tr {
        box-sizing: border-box !important;
        flex: 0 0 100% !important;
        inline-size: 100% !important;
        max-inline-size: none !important;
        min-inline-size: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
    }

    .balam-vacation-days-form {
        align-self: stretch !important;
        display: block !important;
        max-width: none !important;
    }

    .balam-vacation-days-table {
        display: block !important;
        table-layout: fixed !important;
    }

    .balam-vacation-days-table > tbody {
        display: block !important;
    }

    .balam-vacation-days-table > tbody > tr {
        display: grid !important;
    }
}

/* Vacation cards must use the table/form width; generic table rules otherwise
   shrink the tbody and its rows to their content width. */
@media (max-width: 760px) {
    .balam-front-content .balam-vacation-days-table,
    .balam-front-content .balam-vacation-days-table > tbody,
    .balam-front-content .balam-vacation-days-table > tbody > tr {
        box-sizing: border-box !important;
        display: block !important;
        flex: none !important;
        inline-size: 100% !important;
        max-inline-size: none !important;
        min-inline-size: 0 !important;
        width: 100% !important;
    }

    .balam-front-content .balam-vacation-days-table {
        table-layout: fixed !important;
    }

    .balam-front-content .balam-vacation-days-table > tbody {
        display: block !important;
    }

    .balam-front-content .balam-vacation-days-table > tbody > tr {
        display: grid !important;
    }
}

/* Keep the vacation balance cards tied to the page width, not their content. */
@media (max-width: 760px) {
    .balam-front-content .balam-vacation-days-form {
        align-self: stretch !important;
        box-sizing: border-box !important;
        display: block !important;
        margin: 0 !important;
        max-width: none !important;
        min-width: 0 !important;
        width: 100% !important;
    }

    .balam-front-content .balam-vacation-days-form .balam-vacation-days-table {
        box-sizing: border-box !important;
        display: flex !important;
        flex: 0 0 100% !important;
        max-width: none !important;
        min-width: 0 !important;
        width: 100% !important;
    }

    .balam-front-content .balam-vacation-days-form .balam-vacation-days-table tbody {
        box-sizing: border-box !important;
        display: flex !important;
        flex: 0 0 100% !important;
        max-width: none !important;
        min-width: 0 !important;
        width: 100% !important;
    }

    .balam-front-content .balam-vacation-days-form .balam-vacation-days-table tbody tr {
        box-sizing: border-box !important;
        flex: 0 0 100% !important;
        max-width: none !important;
        min-width: 0 !important;
        width: 100% !important;
    }
}

@media (max-width: 760px) {
    .balam-front-content .balam-vacation-days-head {
        align-items: stretch !important;
        flex-direction: column !important;
        gap: 10px !important;
        margin: 0 0 14px !important;
    }

    .balam-front-content .balam-vacation-days-head h3 {
        font-size: 13px !important;
        line-height: 1.1 !important;
        margin: 0 !important;
    }

    .balam-front-content .balam-vacation-days-actions,
    .balam-front-content .balam-vacation-days-actions select {
        max-width: none !important;
        width: 100% !important;
    }

    .balam-front-content .balam-vacation-days-table,
    .balam-front-content .balam-vacation-days-table tbody {
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
        margin: 0 !important;
        max-width: none !important;
        width: 100% !important;
    }

    .balam-front-content .balam-vacation-days-table thead {
        display: none !important;
    }

    .balam-front-content .balam-vacation-days-table tbody tr {
        align-items: stretch !important;
        background: #fff !important;
        border: 0 !important;
        border-radius: 14px !important;
        box-shadow: none !important;
        display: grid !important;
        gap: 8px 12px !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        margin: 0 !important;
        max-width: none !important;
        padding: 12px !important;
        width: 100% !important;
    }

    .balam-front-content .balam-vacation-days-table tbody td {
        align-items: flex-start !important;
        display: flex !important;
        flex-direction: column !important;
        font-size: 10px !important;
        gap: 3px !important;
        line-height: 1.2 !important;
        min-width: 0 !important;
        padding: 0 !important;
        text-align: left !important;
        width: 100% !important;
    }

    .balam-front-content .balam-vacation-days-table tbody td::before {
        color: #888 !important;
        content: attr(data-label) !important;
        display: block !important;
        font-size: 8px !important;
        font-weight: 900 !important;
        line-height: 1 !important;
        text-transform: uppercase !important;
    }

    .balam-front-content .balam-vacation-days-table tbody td:first-child,
    .balam-front-content .balam-vacation-days-table tbody td:nth-child(4),
    .balam-front-content .balam-vacation-days-table tbody td:nth-child(8) {
        grid-column: 1 / -1 !important;
    }

    .balam-front-content .balam-vacation-days-table tbody td:first-child strong {
        color: #333 !important;
        font-size: 13px !important;
        line-height: 1.15 !important;
        overflow-wrap: anywhere !important;
    }

    .balam-front-content .balam-vacation-days-table tbody td:nth-child(5),
    .balam-front-content .balam-vacation-days-table tbody td:nth-child(6),
    .balam-front-content .balam-vacation-days-table tbody td:nth-child(7) {
        align-items: center !important;
        background: #f5f5f5 !important;
        border-radius: 8px !important;
        justify-content: center !important;
        min-height: 38px !important;
        text-align: center !important;
    }

    .balam-front-content .balam-vacation-days-table input[type="date"],
    .balam-front-content .balam-vacation-days-table input[type="number"] {
        box-sizing: border-box !important;
        font-size: 11px !important;
        height: 34px !important;
        margin: 0 !important;
        max-width: none !important;
        min-width: 0 !important;
        padding: 7px 9px !important;
        width: 100% !important;
    }

    .balam-front-content .balam-vacation-days-table .balam-vacation-mini-list {
        font-size: 10px !important;
        gap: 4px !important;
        overflow-wrap: anywhere !important;
        width: 100% !important;
    }

    .balam-front-content .balam-vacation-days-table + .balam-actions {
        margin-top: 14px !important;
    }
}

/* ============================
   CONSOLIDATED RESPONSIVE MODULES
============================ */

@media (max-width: 760px) {
    .balam-preinvoice-edit-content .balam-client-edit-grid {
        grid-template-columns: 1fr;
    }

    .balam-reports-wrapper .reports-summary-grid,
    .balam-reports-wrapper .reports-three-column-grid,
    .balam-reports-wrapper .reports-two-column-grid,
    .balam-reports-wrapper .reports-pie-grid {
        grid-template-columns: 1fr;
    }

    .balam-reports-wrapper .reports-filter-field {
        min-width: 0;
    }

    .balam-task-form-grid,
    .balam-task-extra-grid {
        grid-template-columns: 1fr;
    }

    .balam-task-form-modal {
        padding-left: 18px;
        padding-right: 18px;
    }
}

/* Salidas a prospeccion: use the same compact one-day mobile calendar as the general view. */
@media (max-width: 760px) {

    .balam-front-content > .balam-task-calendar-list {
        background: transparent !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        margin: 8px 0 0 !important;
        padding: 0 !important;
        width: 100% !important;
    }

    .balam-front-content > .balam-task-calendar-list > .balam-subsection-title {
        margin: 0 0 8px !important;
    }
}

@media (max-width: 900px) {
    .balam-task-calendar-card {
        grid-template-columns: 1fr;
    }

    .balam-task-calendar-column {
        border-bottom: 0;
        border-right: 0;
        padding: 9px 12px;
    }

    .balam-task-calendar-actions {
        align-items: stretch;
    }

    .balam-task-calendar-actions .balam-btn {
        width: 100%;
    }

    .balam-task-calendar-list-head {
        display: block;
        margin-bottom: 10px;
    }

    .balam-task-calendar-list-head .balam-btn {
        display: flex;
        width: 100%;
    }
}

.balam-design-audit__grid {
    grid-template-columns:1fr;
}

.balam-design-audit__surface {
    padding:18px;
}

@media (max-width: 760px) {
    .balam-front-table.balam-task-archive-table {
        background: transparent !important;
        display: block !important;
        overflow: visible !important;
        white-space: normal !important;
        width: 100% !important;
    }

    .balam-front-table.balam-task-archive-table thead {
        display: none !important;
    }

    .balam-front-table.balam-task-archive-table tbody {
        display: flex !important;
        flex-direction: column !important;
        gap: 14px !important;
        width: 100% !important;
    }

    .balam-front-table.balam-task-archive-table tbody tr {
        align-items: stretch !important;
        background: #fff !important;
        border: 0 !important;
        border-radius: 16px !important;
        box-shadow: none !important;
        display: grid !important;
        gap: 0 !important;
        grid-template-columns: 1fr 1fr !important;
        margin: 0 !important;
        padding: 14px !important;
        width: 100% !important;
    }

    .balam-front-table.balam-task-archive-table tbody td {
        align-items: flex-start !important;
        border: 0 !important;
        box-sizing: border-box !important;
        display: flex !important;
        flex-direction: column !important;
        font-size: 12px !important;
        justify-content: flex-start !important;
        min-width: 0 !important;
        overflow-wrap: anywhere !important;
        padding: 0 8px 10px !important;
        text-align: left !important;
        white-space: normal !important;
        width: 100% !important;
    }

    .balam-front-table.balam-task-archive-table tbody td:first-child,
    .balam-front-table.balam-task-archive-table tbody td:last-child {
        grid-column: 1 / -1 !important;
    }

    .balam-front-table.balam-task-archive-table tbody td:last-child {
        padding: 4px 8px 0 !important;
    }

    .balam-task-archive-actions {
        display: grid !important;
        gap: 8px !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        width: 100% !important;
    }

    .balam-task-archive-actions > .balam-btn,
    .balam-task-archive-actions > form,
    .balam-task-archive-actions > form .balam-btn {
        box-sizing: border-box !important;
        min-width: 0 !important;
        max-width: 100% !important;
        width: 100% !important;
    }

    .balam-task-archive-actions > form:last-child {
        grid-column: 1 / -1 !important;
    }
}

.balam-design-audit__button-row,


.balam-design-audit__badge-row {
    gap:8px;
}

.balam-desktop-only {
    display: flex !important;
}

.balam-tablet-title-menu {
    display: none !important;
}

@media (max-width: 1024px) {
    .balam-mobile-only {
        display: flex !important;
    }
    .balam-desktop-only {
        display: none !important;
    }
    .balam-front-wrapper{
        padding: 0 14px 30px;
    }

    .balam-front-header-inner{
        padding: 16px 18px;
        background: #333 !important;
    }

    /* OCULTAR NAVEGACIÓN ANTIGUA EN MÓVIL (AHORA EN EL MENÚ) */
    .balam-front-nav-wrapper {
        display: none !important;
    }

    .balam-front-status {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        gap: 0 !important;
        padding: 0 !important;
        background: transparent !important;
        border: none !important;
        align-items: stretch !important; /* Estirar para que el borde sea 100% height */
        justify-content: flex-start !important;
        margin-bottom: 25px !important;
    }

    .balam-mobile-menu-floating {
        display: none !important;
    }

    /* COLUMNA 1: MENÚ (PEGADO A LA IZQUIERDA) */
    .balam-mobile-menu-trigger-col {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 15px !important;
        border-right: 2px solid #333 !important; /* Separador grueso y oscuro solicitado */
        cursor: pointer !important;
        min-width: 70px !important;
        background: transparent !important;
    }

    .balam-mobile-menu-trigger-col .hamburger-icon {
        width: 32px;
        height: 20px;
        position: relative;
    }

    .balam-mobile-menu-trigger-col .hamburger-icon span {
        display: block;
        position: absolute;
        height: 3px;
        width: 100%;
        background: #333;
        border-radius: 9px;
        opacity: 1;
        left: 0;
    }

    .balam-mobile-menu-trigger-col .hamburger-icon span:nth-child(1) { top: 0px; }
    .balam-mobile-menu-trigger-col .hamburger-icon span:nth-child(2) { top: 9px; }
    .balam-mobile-menu-trigger-col .hamburger-icon span:nth-child(3) { top: 18px; }

    /* COLUMNA 2: BLOQUE INFO (RESUMEN CAPTURA 2) */
    .balam-mobile-header-info-col {
        flex: 1 !important;
        padding-left: 20px !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
        justify-content: center !important;
    }

    .balam-mobile-user-row {
        display: flex !important;
        align-items: center !important;
        gap: 12px !important;
    }

    .balam-mobile-user-row .greeting {
        font-size: 15px !important;
        font-weight: 700 !important;
        color: #333 !important;
    }

    /* MODAL DE NAVEGACIÓN */
    .balam-mobile-nav-modal {
        position: fixed !important;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 99999 !important;
        display: none !important;
    }

    .balam-mobile-nav-modal.is-visible {
        display: block !important;
    }

    .nav-modal-overlay {
        position: absolute;
        width: 100%;
        height: 100%;
        background: rgba(0,0,0,0.5);
        backdrop-filter: blur(4px);
    }

    .nav-modal-content {
        position: absolute;
        top: 0;
        left: 0;
        width: 85%;
        max-width: 250px;
        height: 100%;
        background: #fff;
        
        display: flex;
        flex-direction: column;
        animation: balamSlideInLeft 0.3s ease-out;
    }

    @keyframes balamSlideInLeft {
        from { transform: translateX(-100%); }
        to { transform: translateX(0); }
    }

    .nav-modal-body {
        padding: 0 0 8px 0 !important;
        overflow-y: auto;
        flex: 1;
    }

    .nav-group {
        margin-bottom: 0 !important;
    }

    .nav-modal-link {
        display: block !important;
        min-height: 32px !important;
        padding: 6px 18px !important;
        color: #333 !important;
        text-decoration: none !important;
        font-family: "DM Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
        font-size: 12px !important;
        font-weight: 600 !important;
        border-bottom: 1px solid #f5f5f5 !important;
        text-transform: uppercase;
    }

    .nav-modal-link.active {
        background: #333 !important;
        border-left: 5px solid #333 !important;
        color: #fff !important;
    }

    .nav-modal-link.active svg,
    .nav-modal-link.secondary.active svg {
        stroke: #fff !important;
        color: #fff !important;
    }

    .nav-modal-link.secondary {
        color: #333333 !important;
    }

    .nav-modal-link.secondary.active {
        background: #333 !important;
        border-left-color: #333 !important;
        color: #fff !important;
    }

    .nav-modal-brand-header {
        align-items: center !important;
        background: #333 !important;
        color: #fff !important;
        display: flex !important;
        flex: 0 0 auto !important;
        font-family: "Feature Mono", "DM Sans", system-ui, sans-serif !important;
        font-size: 14px !important;
        font-weight: 800 !important;
        justify-content: space-between !important;
        letter-spacing: 0 !important;
        min-height: 72px !important;
        padding: 16px 20px !important;
        box-sizing: border-box !important;
    }

    .nav-modal-brand-header img {
        height: 28px !important;
        width: auto !important;
        object-fit: contain !important;
    }

    .nav-modal-accordion {
        border-bottom: 1px solid #f0f0f0 !important;
    }

    .nav-modal-accordion-toggle {
        appearance: none !important;
        -webkit-appearance: none !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-sizing: content-box !important;
        color: #333 !important;
        min-height: 31px !important;
        padding: 6px 16px !important;
        width: 100% !important;
        justify-content: space-between !important;
        text-align: left !important;
        cursor: pointer !important;
        font-family: "DM Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
        font-size: 12px !important;
        font-weight: 800 !important;
        line-height: 1 !important;
    }

    .balam-mobile-nav-modal .nav-modal-content .nav-modal-accordion-toggle.active,
    .nav-modal-accordion-toggle.active {
        background: #2e7d32 !important;
        border-left: 0 !important;
        color: #fff !important;
    }

    .nav-modal-accordion-title {
        display: inline-flex !important;
        align-items: center !important;
        font-family: "DM Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
        font-weight: 800 !important;
        gap: 8px !important;
        min-width: 0 !important;
    }

    .nav-modal-accordion-chevron {
        align-self: center !important;
        width: 10px !important;
        height: 10px !important;
        border-right: 2px solid currentColor !important;
        border-bottom: 2px solid currentColor !important;
        transform: rotate(45deg) !important;
        transition: transform .18s ease !important;
        flex: 0 0 auto !important;
        margin: -5px 2px 0 0 !important;
    }

    .nav-modal-accordion.is-open .nav-modal-accordion-chevron {
        transform: rotate(225deg) !important;
    }

    .nav-modal-submenu {
        display: none !important;
        background: #fbfbfb !important;
        padding: 0px 0 0px !important;
    }

    .nav-modal-accordion.is-open .nav-modal-submenu {
        display: block !important;
    }

    .nav-modal-sublink {
        align-items: center !important;
        color: #333 !important;
        display: flex !important;
        font-family: "DM Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        min-height: 30px !important;
        padding: 5px 20px 5px 35px !important;
        text-decoration: none !important;
        text-transform: uppercase !important;
        line-height: 1.15 !important;
    }

    .nav-modal-sublink.is-active {
        color: #2f8a1f !important;
        background: #eafbe7 !important;
    }

    .nav-footer {
        padding: 18px 20px 24px !important;
        background: #fefefe;
        border-top: 1px solid #eee;
    }

    .balam-mobile-nav-modal .nav-modal-user-panel {
        border-top: 0 !important;
        display: grid !important;
        gap: 10px !important;
        margin-bottom: 22px !important;
        padding: 14px 0 2px !important;
    }

    .balam-mobile-nav-modal .nav-modal-user-row {
        align-items: center !important;
        display: flex !important;
        gap: 10px !important;
        text-align: left !important;
    }

    .balam-mobile-nav-modal .nav-modal-user-icon {
        filter: grayscale(100%) !important;
        flex: 0 0 22px !important;
        height: 22px !important;
        max-height: 22px !important;
        max-width: 22px !important;
        object-fit: contain !important;
        opacity: .9 !important;
        width: 22px !important;
    }

    .balam-mobile-nav-modal .nav-modal-user-row .greeting {
        color: #333 !important;
        font-size: 13px !important;
        font-weight: 800 !important;
        line-height: 1.05 !important;
    }


    .nav-modal-logout {
        display: block !important;
        background: #333 !important;
        color: #fff !important;
        text-align: center !important;
        padding: 11px 12px !important;
        border-radius: 999px !important;
        font-weight: 800 !important;
        text-decoration: none !important;
        font-size: 12px !important;
    }

    .balam-mobile-nav-modal .nav-modal-logout {
        margin: 18px 0 16px !important;
    }

    .balam-mobile-nav-modal .nav-modal-system-info {
        padding: 0 0 8px !important;
        line-height: 1.25 !important;
    }

    body.no-scroll {
        overflow: hidden !important;
    }
}

@media (min-width: 769px) and (max-width: 1024px) {
    .balam-front-header,
    .balam-front-status {
        display: none !important;
    }

    .balam-front-wrapper {
        padding-top: 26px !important;
    }

    .balam-front-content {
        margin-top: 0 !important;
        position: relative !important;
    }

    .balam-front-content .balam-inventory-view-tabs {
        display: none !important;
    }

    .balam-mobile-nav-modal .nav-modal-content {
        box-sizing: border-box !important;
        max-width: min(340px, 88vw) !important;
        overflow-x: hidden !important;
        width: 340px !important;
    }

    .balam-mobile-nav-modal .nav-modal-body {
        overflow-x: hidden !important;
    }

    .balam-mobile-nav-modal .nav-modal-link,
    .balam-mobile-nav-modal .nav-modal-sublink {
        box-sizing: border-box !important;
        max-width: 100% !important;
    }

    .balam-tab-header {
        align-items: center !important;
        min-height: 64px !important;
        padding-left: 78px !important;
        position: relative !important;
    }

    .balam-tablet-title-menu {
        align-items: center !important;
        background: transparent !important;
        border: 0 !important;
        border-radius: 0 !important;
        cursor: pointer !important;
        display: flex !important;
        height: 46px !important;
        justify-content: center !important;
        left: 4px !important;
        padding: 0 !important;
        position: absolute !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        width: 46px !important;
        z-index: 5 !important;
        -webkit-tap-highlight-color: transparent !important;
    }

    .balam-tablet-title-menu .hamburger-icon {
        display: block !important;
        height: 24px !important;
        position: relative !important;
        width: 34px !important;
    }

    .balam-tablet-title-menu .hamburger-icon span {
        background: #333 !important;
        border-radius: 999px !important;
        display: block !important;
        height: 3px !important;
        left: 0 !important;
        position: absolute !important;
        width: 100% !important;
    }

    .balam-tablet-title-menu .hamburger-icon span:nth-child(1) {
        top: 1px !important;
    }

    .balam-tablet-title-menu .hamburger-icon span:nth-child(2) {
        top: 11px !important;
    }

    .balam-tablet-title-menu .hamburger-icon span:nth-child(3) {
        top: 21px !important;
    }

    .balam-tab-header .balam-front-title {
        margin-left: 0 !important;
        min-width: 0 !important;
    }
}

@media (max-width: 768px) {
    .balam-mobile-nav-modal .nav-modal-content {
        width: 78% !important;
        max-width: 232px !important;
    }

    .balam-mobile-nav-modal .nav-modal-body {
        padding-top: 30px !important;
        padding-bottom: 6px !important;
    }

    .balam-mobile-nav-modal .nav-modal-link {
        min-height: 25px !important;
        padding: 7px 15px !important;
        gap: 8px !important;
        font-size: 13px !important;
        line-height: 1 !important;
    }

    .balam-mobile-nav-modal .nav-modal-link svg {
        width: 15px !important;
        height: 15px !important;
        opacity: 1 !important;
        margin-right: 10px;
    }

    .balam-mobile-nav-modal .nav-modal-content .nav-modal-link.active {
        background: #2e7d32 !important;
        color: #fff !important;
        border-left: 0 !important;
    }

    .balam-mobile-nav-modal .nav-modal-content .nav-modal-link.active svg,
    .balam-mobile-nav-modal .nav-modal-content .nav-modal-link.secondary.active svg {
        stroke: #fff !important;
        color: #fff !important;
        opacity: 1 !important;
    }

    .balam-mobile-nav-modal .nav-footer {
        padding: 10px 16px 12px !important;
    }

    .balam-mobile-nav-modal .nav-modal-logout {
        min-height: 40px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 0 14px !important;
        border-radius: 999px !important;
        font-size: 11.5px !important;
        margin: 14px 0 6px !important;
    }

    .balam-mobile-nav-modal .nav-modal-passkey-wrap {
        width: 100% !important;
        margin-top: 0 !important;
        margin-bottom: 10px !important;
    }

    .balam-mobile-nav-modal .nav-modal-passkey-wrap .balam-front-passkey-btn {
        width: 100% !important;
        min-height: 40px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 0 14px !important;
        border-radius: 999px !important;
        font-size: 11.5px !important;
        box-sizing: border-box !important;
    }

    .balam-mobile-nav-modal .nav-modal-system-info {
        padding: 4px 0 12px !important;
        text-align: center !important;
        font-size: 9.5px !important;
        line-height: 1.2 !important;
        width: 100% !important;
    }

    .balam-front-header-inner{
        flex-direction: row;
        align-items: center;
        gap: 10px;
    }

    .balam-front-header-title{
        font-size: 13px;
        white-space: nowrap;
    }

    .balam-front-header-logo{
        height: 28px;
    }


    .balam-front-status{
        padding: 12px 16px;
    }

    .balam-front-status{
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }


    .balam-front-nav-wrapper{
        padding: 12px;
    }

    .balam-step,
    .balam-module{
        font-size: 12px !important;
        padding: 9px 16px !important;
    }

    .balam-front-steps,
    .balam-front-modules{
        justify-content: flex-start !important;
    }

    .balam-front-user {
        font-size: 13px !important;
    }

    .balam-front-content{
        background: transparent !important;
        border: none !important;
        padding: 10px 10px 30px !important;
        margin-top: 12px;
    }

    .balam-tab-header {
        background: #fff !important;
        border-radius: 18px !important;
        padding: 24px 20px !important;
        margin-bottom: 20px !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        text-align: center !important;
        gap: 16px !important;
    }

    .balam-tab-header .balam-front-title {
        margin-bottom: 0 !important;
        font-size: 26px !important;
        width: 100% !important;
    }

    .balam-export-actions {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        gap: 10px !important;
        width: 100% !important;
    }

    .balam-export-actions .balam-btn {
        width: auto !important;
        min-width: 200px !important;
        justify-content: center !important;
        margin: 0 !important;
        padding-left: 25px !important;
        padding-right: 25px !important;
    }

    /* REPARAR CONTENEDOR EN FORMULARIOS - ESTILO PREMIUM */
    .balam-front-content.balam-form-card {
        background: #fff !important;
        border: 2px solid #e2e2e2 !important;
        border-radius: 24px !important;
        padding: 25px 20px !important;
        margin: 10px !important; /* Ajustado para coincidir con el ancho de cabecera */
        width: auto !important;
        box-shadow: 0 10px 40px rgba(0,0,0,0.03) !important;
        overflow: hidden !important;
    }

    .balam-quote-form .balam-products-inputs{
        flex-direction: column;
        gap: 8px;
    }

    .balam-quote-form .balam-products-inputs > *{
        width: 100% !important;
        text-align: left;
        box-sizing: border-box;
    }

    .balam-quote-form #balam-qty,
    .balam-quote-form #balam-price{
        font-size: 16px !important;
    }

    .balam-quote-form .balam-products-inputs .balam-btn{
        width: 100%;
    }

    .balam-quote-summary{
        flex-direction: column;
        gap: 16px;
        align-items: stretch;
    }

    .balam-quote-summary > div{
        width: 100% !important;
    }

    .balam-quote-totals{
        width: 100% !important;
        max-width: 100%;
    }

    .balam-quote-summary .balam-front-table{
        width: 100% !important;
        display: block;
        white-space: normal !important;
        overflow: visible;
    }

    .balam-quote-summary .balam-front-table tr{
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 12px;
        padding: 10px 0;
        border-bottom: 1px solid #eee;
        width: 100%;
    }

    .balam-quote-summary .balam-front-table td{
        display: block;
        padding: 0;
        font-size: 14px;
        flex: 1 1 0;
    }

    .balam-quote-summary .balam-front-table td:last-child{
        text-align: right;
        font-weight: 600;
        border-right: none !important;
    }

    /* FORMULARIO DE COTIZACIÓN (NUEVA/EDICIÓN) */
    .balam-quote-form .balam-block-card {
        background: #fff !important;
        border: 1.5px solid #f2f2f2 !important;
        border-radius: 18px !important;
        padding: 20px !important;
        margin-bottom: 20px !important;
        box-shadow: none !important;
    }

    .balam-quote-form .balam-section-title {
        font-size: 22px !important;
        margin-bottom: 25px !important;
        letter-spacing: -0.5px !important;
        color: #1a1a1a !important;
    }

    .balam-subsection-title {
        font-size: 15px !important;
        text-transform: uppercase !important;
        letter-spacing: 0.1em !important;
        border-bottom: 1.5px solid #f0f0f0 !important;
        padding-bottom: 10px !important;
        margin-top: 30px !important;
        color: #444 !important;
        font-weight: 800 !important;
    }

    /* Compactar Stock + Agregar */
    .balam-stock-add-group {
        display: flex !important;
        flex-direction: row !important;
        align-items: flex-end !important;
        gap: 15px !important;
        margin-top: 5px !important;
    }

    .balam-stock-add-group .balam-btn {
        height: 40px !important;
    }

    .balam-mobile-hide {
        display: none !important;
    }

    .balam-products-inputs label {
        font-size: 12px !important;
        color: #888!important;
        font-weight: 700 !important;
    }

    /* Mejora botones +/- en móvil */
    .balam-custom-num-input {
        border-color: #e0e0e0 !important;
        height: 40px !important; /* Más grandes para dedos */
    }

    .balam-num-btn {
        color: #555 !important;
        width: 35px !important;
    }

    /* Cantidad y Precio en la misma fila */
    .balam-mobile-row-group {
        display: flex !important;
        flex-direction: row !important;
        gap: 12px !important;
        width: 100% !important;
    }

    .balam-mobile-row-group > .balam-field {
        flex: 1 !important;
        width: 50% !important;
        min-width: 0 !important;
    }

    /* Centrar STOCk */
    .balam-quote-form div[style*="STOCK"] + div,


    #balam-stock-display {
        text-align: center !important;
        justify-content: center !important;
        width: 100% !important;
        margin-inline: auto !important;
    }


    .balam-quote-totals {
        width: 100% !important;
        max-width: 100% !important;
        background: #f9f9f9 !important;
        border-radius: 20px !important;
        border: 1px solid #333 !important;
        overflow: hidden !important;
        margin-top: 40px !important;
        margin-bottom: 25px !important;
        padding: 5px !important; /* Menos padding interno para dar espacio a la tabla */
    }

    .balam-quote-totals-table {
        width: 100% !important;
        display: table !important;
        table-layout: fixed !important;
    }

    .balam-quote-totals-table td {
        padding: 14px 10px !important;
        font-size: 14px !important;
        border-bottom: 1px dashed #e0e0e0 !important;
        background: transparent !important; /* Quitar fondos grises de celdas individuales */
    }

    .balam-quote-totals-table td:last-child {
        text-align: right !important;
        font-weight: 700 !important;
    }

    .balam-quote-totals-table tr:last-child td {
        border-bottom: none !important;
        font-weight: 800 !important;
    }

    .balam-quote-items-table,
    .balam-quote-items-table thead,
    .balam-quote-items-table tbody,
    .balam-quote-items-table tr,
    .balam-quote-items-table th,
    .balam-quote-items-table td{
        display: block;
        width: 100%;
    }

    .balam-quote-items-table thead{
        display: none;
    }

    .balam-quote-items-table tr{
        margin-bottom: 10px;
        padding: 10px 12px;
        border-radius: 12px;
        background: #fff;
        
    }

    .balam-quote-items-table td{
        display: grid;
        grid-template-columns: 120px 1fr;
        column-gap: 10px;
        padding: 6px 0;
        white-space: normal;
        align-items: center;
        font-size: 13px;
    }

    .balam-quote-items-table td::before{
        content: attr(data-label);
        font-weight: 700;
        color: #555;
        font-size: 12px;
        text-transform: uppercase;
        letter-spacing: 0.03em;
    }

    .balam-quote-items-table td[data-label="Características"],
    .balam-quote-items-table td[data-label="Características / Entrega"]{
        font-size: 12px;
        line-height: 1.35;
        color: #4a4a4a;
    }

    .balam-quote-items-table .balam-quote-item-details{
        align-items: start;
    }

    .balam-quote-items-table .balam-quote-item-details .balam-row-delivery,
    .balam-quote-items-table .balam-quote-item-details .balam-row-item-note{
        width: 100%;
    }

    .balam-quote-items-table .balam-qty-group{
        justify-content: flex-start;
        gap: 8px;
    }

    .balam-quote-items-table td[data-label="Eliminar"] button{
        padding: 4px 10px;
        border-radius: 999px;
        font-size: 12px;
        background: #f5f5f5;
        border: 0;
    }

    .balam-shipments-table,
    .balam-shipments-table thead,
    .balam-shipments-table tbody,
    .balam-shipments-table tr,
    .balam-shipments-table th,
    .balam-shipments-table td,
    .balam-shipments-items-table,
    .balam-shipments-items-table thead,
    .balam-shipments-items-table tbody,
    .balam-shipments-items-table tr,
    .balam-shipments-items-table th,
    .balam-shipments-items-table td{
        display: block;
        width: auto;
    }

    .balam-shipments-table thead,
    .balam-shipments-items-table thead{
        display: none;
    }

    .balam-shipments-table tr,
    .balam-shipments-items-table tr{
        margin-bottom: 10px;
        padding: 5px 15px;
        background: #fff;
        
    }

    .balam-shipments-table td,
    .balam-shipments-items-table td{
        display: grid;
        grid-template-columns: 120px 1fr;
        column-gap: 10px;
        padding: 4px 0;
        white-space: normal;
        align-items: center;
        font-size: 13px;
    }

    .balam-shipments-table td::before,
    .balam-shipments-items-table td::before{
        content: attr(data-label);
        font-weight: 700;
        color: #555;
        font-size: 12px;
        text-transform: uppercase;
        letter-spacing: 0.03em;
    }

    .balam-shipments-table td[data-label="Acciones"]{
        display: grid;
        grid-template-columns: 120px 1fr;
        column-gap: 10px;
        row-gap: 8px;
        align-items: start;
    }

    .balam-shipments-table td[data-label="Acciones"]::before{
        grid-column: 1;
        align-self: start;
    }

    .balam-shipments-table td[data-label="Acciones"] > *{
        grid-column: 2;
        justify-self: start;
    }

    .balam-warranties-table,
    .balam-warranties-table thead,
    .balam-warranties-table tbody,
    .balam-warranties-table tr,
    .balam-warranties-table th,
    .balam-warranties-table td{
        display: block;
        width: auto;
    }

    .balam-warranties-table thead{
        display: none;
    }

    .balam-warranties-table tr{
        margin-bottom: 10px;
        padding: 5px 15px;
        background: #fff;
        
    }

    .balam-warranties-table td{
        display: grid;
        grid-template-columns: 120px 1fr;
        column-gap: 10px;
        padding: 4px 0;
        white-space: normal;
        align-items: center;
        font-size: 13px;
    }

    .balam-warranties-table td::before{
        content: attr(data-label);
        font-weight: 700;
        color: #555;
        font-size: 12px;
        text-transform: uppercase;
        letter-spacing: 0.03em;
    }

    .balam-warranties-table td[data-label="Acciones"]{
        display: grid;
        grid-template-columns: 120px 1fr;
        column-gap: 10px;
        row-gap: 8px;
        align-items: start;
    }

    .balam-warranties-table td[data-label="Acciones"]::before{
        grid-column: 1;
    }

    .balam-warranties-table td[data-label="Acciones"] > *{
        grid-column: 2;
        justify-self: start;
    }


    .balam-shipments-table td[data-label="Almacén"] .balam-toggle-row{
        justify-content: flex-start;
    }

    .balam-preinvoices-table,
    .balam-preinvoices-table thead,
    .balam-preinvoices-table tbody,
    .balam-preinvoices-table tr,
    .balam-preinvoices-table th,
    .balam-preinvoices-table td{
        display: block !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    .balam-preinvoices-table thead{
        display: none !important;
    }

    .balam-preinvoices-table tr {
        margin-bottom: 25px !important;
        padding: 20px 18px !important;
        background: #fff !important;
        border: 2px solid #eee !important;
        border-radius: 24px !important;
        display: flex !important;
        flex-direction: column !important;
        box-shadow: none !important;
    }

    .balam-preinvoices-table td {
        border: none !important;
        padding: 0 !important;
        position: relative !important;
        margin-bottom: 6px !important;
    }

    /* 1. FOLIO Y FECHA (EN LA MISMA FILA) */
    /* 2. VENDEDOR */
    /* 3. CLIENTE */
    .balam-order-3 {
        order: 3 !important;
        margin-top: 2px !important;
    }
    .balam-val-client {
        font-size: 18px !important;
        font-weight: 800 !important;
        color: #1a1a1a !important;
        line-height: 1.1 !important;
        text-transform: uppercase !important;
    }

    /* 4. ESTATUS */
    .balam-order-4 {
        order: 4 !important;
        margin-top: 10px !important;
    }

    /* 6. PRODUCTOS (Entre divisores) */
    .balam-order-6 {
        order: 6 !important;
        width: 100% !important;
    }
    .balam-order-6 hr {
        border: 0 !important;
        border-top: 1.5px solid #eee !important;
        margin: 18px 0 !important;
        width: 100% !important;
        opacity: 1 !important;
    }

    /* 8. TOTAL */
    .balam-order-8 {
        order: 8 !important;
        margin-top: -5px !important; /* Más pegado al HR */
        margin-bottom: 15px !important;
    }
    .balam-val-total {
        font-size: 18px !important; 
        font-weight: 800 !important; /* Igual que el cliente */
        color: #1a1a1a !important;
        line-height: 1.1 !important;
        letter-spacing: -0.5px !important;
    }
    .balam-mini-products {
        padding: 0 !important;
        margin: 0 !important;
        list-style: none !important;
        font-family: monospace !important;
        font-size: 13px !important;
        color: #333 !important;
    }


    /* 9. ACCIONES */
    .balam-order-9 {
        order: 9 !important;
        margin-top: 10px !important;
    }
    .balam-actions-row {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        gap: 8px !important;
        width: 100% !important;
    }
    .balam-actions-row .balam-btn,
    .balam-actions-row form {
        flex: 1 !important;
        width: auto !important;
    }
    .balam-actions-row .balam-btn {
        height: 38px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 50em !important;
        font-size: 11px !important;
        font-weight: 700 !important;
        text-transform: uppercase !important;
    }

    .balam-warranty-items-table,
    .balam-warranty-items-table thead,
    .balam-warranty-items-table tbody,
    .balam-warranty-items-table tr,
    .balam-warranty-items-table th,
    .balam-warranty-items-table td{
        display: block;
        width: 100%;
    }

    .balam-warranty-items-table thead{
        display: none;
    }

    .balam-warranty-items-table tr{
        margin-bottom: 10px;
        padding: 10px 12px;
        border-radius: 12px;
        background: #fff;
        
    }

    .balam-warranty-items-table td{
        display: grid;
        grid-template-columns: 120px 1fr;
        column-gap: 10px;
        padding: 6px 0;
        white-space: normal;
        align-items: center;
        font-size: 13px;
    }

    .balam-warranty-items-table td::before{
        content: attr(data-label);
        font-weight: 700;
        color: #555;
        font-size: 12px;
        text-transform: uppercase;
        letter-spacing: 0.03em;
    }

    .balam-clients-table,
    .balam-clients-table thead,
    .balam-clients-table tbody,
    .balam-clients-table tr,
    .balam-clients-table th,
    .balam-clients-table td{
        display: block;
        width: 100%;
    }

    .balam-clients-table thead{
        display: none;
    }

    .balam-clients-table tr{
        margin-bottom: 10px;
        padding: 10px 12px;
        border-radius: 14px;
        background: #fff;
        
    }

    .balam-clients-table td{
        display: grid;
        grid-template-columns: 120px 1fr;
        column-gap: 10px;
        padding: 6px 0;
        white-space: normal;
        align-items: center;
        font-size: 13px;
    }

    .balam-clients-table td::before{
        content: attr(data-label);
        font-weight: 700;
        color: #555;
        font-size: 12px;
        text-transform: uppercase;
        letter-spacing: 0.03em;
    }

    .balam-clients-table td[data-label="Acciones"]{
        display: grid;
        grid-template-columns: 120px 1fr;
        column-gap: 10px;
        row-gap: 8px;
        align-items: start;
    }

    .balam-clients-table td[data-label="Acciones"]::before{
        grid-column: 1;
    }

    .balam-clients-table td[data-label="Acciones"] > *{
        grid-column: 2;
        justify-self: start;
    }

    .balam-client-form .balam-front-filters{
        flex-direction: column;
    }

    .balam-client-form .balam-front-filters > *{
        width: 100% !important;
    }

    .balam-client-form .balam-actions-row{
        flex-direction: column;
        gap: 10px;
    }

    .balam-client-form .balam-actions-row .balam-btn{
        width: 100%;
    }

    .balam-client-edit-grid{
        grid-template-columns: 1fr !important;
    }

    .balam-client-grid{
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .balam-client-col strong{
        min-width: 120px;
    }

    .balam-filters-controls,
    .balam-filters-row,
    .balam-filters-spacer {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        width: 100% !important;
        gap: 12px !important;
        margin: 0 !important;
    }

    /* REDISEÑO DE FILTROS COLAPSABLES */
    .balam-system-filters {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 12px !important;
        padding: 15px !important;
        background: none !important; /* No background */
        border: none !important;     /* No border */
        border-radius: 16px !important;
        margin-bottom: 20px !important;
        transition: all 0.3s ease-in-out !important;
        overflow: hidden !important;
        max-height: 2000px !important;
        opacity: 1 !important;
    }

    .balam-system-filters.is-collapsed {
        max-height: 0 !important;
        opacity: 0 !important;
        padding: 0 !important;
        margin-bottom: 0 !important;
        border: none !important;
        pointer-events: none !important;
    }

    .balam-system-filters.is-expanded,
    .balam-system-filters.is-active {
        max-height: 2000px !important;
        opacity: 1 !important;
        padding: 0px 20px 20px 20px !important; /* Requested specific padding */
        margin-bottom: 20px !important;
        border: none !important;
        pointer-events: auto !important;
    }

    /* TOGGLE TRIGGER UI */
    .balam-filters-toggle-mobile {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        padding: 16px 20px !important;
        background: #fff !important;
        border-radius: 18px !important;
        border: 1px solid #eee !important;
        margin-bottom: 12px !important;
        cursor: pointer !important;
        -webkit-tap-highlight-color: transparent !important;
    }
    .balam-filters-toggle-mobile .toggle-left {
        display: flex !important;
        align-items: center !important;
        gap: 10px !important;
    }
    .balam-filters-toggle-mobile .toggle-text {
        font-weight: 700 !important;
        color: #333 !important;
        font-size: 14px !important;
        text-transform: uppercase !important;
        letter-spacing: 0.5px !important;
    }
    .balam-filters-toggle-mobile .toggle-icon {
        width: 18px !important;
        height: 14px !important;
        position: relative !important;
        display: block !important;
    }
    .balam-filters-toggle-mobile .toggle-icon::before,
    .balam-filters-toggle-mobile .toggle-icon::after {
        content: "" !important;
        position: absolute !important;
        left: 0 !important;
        width: 100% !important;
        height: 2px !important;
        background: #333 !important;
        border-radius: 2px !important;
    }
    .balam-filters-toggle-mobile .toggle-icon::before { top: 0 !important; width: 100% !important; }
    .balam-filters-toggle-mobile .toggle-icon::after { bottom: 0 !important; width: 60% !important; }
    
    .balam-filters-toggle-mobile .active-dot {
        width: 8px !important;
        height: 8px !important;
        background: #3b82f6 !important;
        border-radius: 50% !important;
        
        margin-left: 2px !important;
    }
    .balam-filters-toggle-mobile .arrow-icon {
        width: 10px !important;
        height: 10px !important;
        border-right: 2px solid #999 !important;
        border-bottom: 2px solid #999 !important;
        transform: rotate(45deg) !important;
        transition: transform 0.3s ease !important;
        margin-bottom: 4px !important;
    }
    .balam-filters-toggle-mobile.is-open .arrow-icon {
        transform: rotate(-135deg) !important;
        margin-bottom: -4px !important;
    }

    .balam-front-filters input,
    .balam-front-filters select {
        height: 48px !important;
        min-height: 48px !important;
        font-size: 15px !important;
        background-color: #fff !important;
        color: #333 !important;
        border: 1px solid #e2e8f0 !important;
        border-radius: 14px !important;
        padding: 0 16px !important;
        box-sizing: border-box !important;
        width: 100% !important;
        display: block !important;
        -webkit-appearance: none;
        appearance: none;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23333' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-position: right 12px center;
        background-size: 16px;
        
    }

    .balam-front-filters input:focus,
    .balam-front-filters select:focus {
        border-color: #3b82f6 !important;
        
    }

    .balam-filters-row input:focus,
    .balam-filters-row input[type="date"] {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    .balam-front-table{
        display: block;
        width: 100%;
        overflow-x: auto;
        white-space: nowrap;
        background: transparent !important;
        border: none !important;
    }

    .balam-table-cards,
    .balam-quotes-table,
    .balam-preinvoices-table,
    .balam-shipments-table,
    .balam-warranties-table,
    .balam-clients-table,
    .balam-purchase-orders-table,
    .balam-table-cards thead, .balam-table-cards tbody, .balam-table-cards tr, .balam-table-cards td,
    .balam-quotes-table thead, .balam-quotes-table tbody, .balam-quotes-table tr, .balam-quotes-table td,
    .balam-preinvoices-table thead, .balam-preinvoices-table tbody, .balam-preinvoices-table tr, .balam-preinvoices-table td,
    .balam-shipments-table thead, .balam-shipments-table tbody, .balam-shipments-table tr, .balam-shipments-table td,
    .balam-warranties-table thead, .balam-warranties-table tbody, .balam-warranties-table tr, .balam-warranties-table td,
    .balam-clients-table thead, .balam-clients-table tbody, .balam-clients-table tr, .balam-clients-table td,
    .balam-purchase-orders-table thead, .balam-purchase-orders-table tbody, .balam-purchase-orders-table tr, .balam-purchase-orders-table td {
        display: block !important;
        width: auto !important;
    }

    .balam-quotes-table thead,
    .balam-preinvoices-table thead,
    .balam-shipments-table thead,
    .balam-warranties-table thead,
    .balam-clients-table thead,
    .balam-table-cards thead,
    .balam-purchase-orders-table thead {
        display: none !important;
    }

    /* CARD STYLE GLOBAL */
    .balam-quotes-table tr,
    .balam-front-table.balam-quotes-table tr,
    .balam-front-table.balam-preinvoices-table tr,
    .balam-front-table.balam-shipments-table tr,
    .balam-front-table.balam-warranties-table tr,
    .balam-front-table.balam-clients-table tr,
    .balam-front-table.balam-table-cards tr,
    .balam-front-table.balam-purchase-orders-table tr {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        margin-bottom: 14px !important;
        background: #fff !important;
        border: transparent !important;
        border-radius: 15px !important;
        padding: 18px !important;
        transition: transform 0.2s ease;
        box-shadow: none !important;
    }

    /* BASIC CELL STRUCTURE (ALL MODULES) */
    .balam-front-table.balam-quotes-table td,
    .balam-front-table.balam-preinvoices-table td,
    .balam-front-table.balam-shipments-table td,
    .balam-front-table.balam-warranties-table td,
    .balam-front-table.balam-clients-table td,
    .balam-front-table.balam-table-cards td,
    .balam-front-table.balam-purchase-orders-table td {
        display: flex !important;
        flex-direction: column !important;
        padding: 0 !important;
        margin-bottom: 0 !important;
        border: none !important;     /* Hide table borders */
        width: 100% !important;
        box-sizing: border-box !important;
        white-space: normal !important;      /* Allow text wrapping */
        word-break: break-word !important;   /* Break long words if necessary */
        overflow-wrap: break-word !important;
    }

    /* LEFT ALIGNMENT FOR MANAGEMENT MODULES */
    .balam-front-table.balam-quotes-table td,
    .balam-front-table.balam-preinvoices-table td,
    .balam-front-table.balam-shipments-table td,
    .balam-front-table.balam-warranties-table td,
    .balam-front-table.balam-clients-table td,
    .balam-front-table.balam-purchase-orders-table td {
        align-items: flex-start !important;
        text-align: left !important;
    }

    .balam-quotes-table td::before,
    .balam-preinvoices-table td::before,
    .balam-shipments-table td::before,
    .balam-warranties-table td::before,
    .balam-clients-table td::before,
    .balam-purchase-orders-table td::before {
        display: none !important;
    }

    .balam-purchase-orders-wrapper .balam-front-table.balam-purchase-orders-table,
    .balam-purchase-orders-wrapper .balam-front-table.balam-purchase-orders-table tbody {
        display: block !important;
        width: calc(100vw - 86px) !important;
        max-width: 328px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        overflow: visible !important;
        box-sizing: border-box !important;
    }

    .balam-purchase-orders-wrapper .balam-front-table.balam-purchase-orders-table tbody tr {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        align-items: flex-start !important;
        gap: 0 !important;
        width: 100% !important;
        max-width: 328px !important;
        min-width: 0 !important;
        margin: 0 auto 16px !important;
    }

    .balam-purchase-orders-wrapper .balam-front-table.balam-purchase-orders-table td::before,
    .balam-purchase-orders-wrapper .balam-front-table.balam-purchase-orders-table td[data-label="Proveedor"]::before,
    .balam-purchase-orders-wrapper .balam-front-table.balam-purchase-orders-table td[data-label="Folio"]::before,
    .balam-purchase-orders-wrapper .balam-front-table.balam-purchase-orders-table td[data-label="Productos"]::before,
    .balam-purchase-orders-wrapper .balam-front-table.balam-purchase-orders-table td[data-label="Estatus"]::before,
    .balam-purchase-orders-wrapper .balam-front-table.balam-purchase-orders-table td[data-label="Acciones"]::before {
        display: none !important;
        content: none !important;
        visibility: hidden !important;
        width: 0 !important;
        height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
    }

    .balam-purchase-orders-wrapper .balam-front-table.balam-purchase-orders-table td[data-label="Proveedor"] {
        order: 1 !important;
        width: 100% !important;
        flex: 0 0 100% !important;
        margin-bottom: 6px !important;
        font-size: 18px !important;
        font-weight: 800 !important;
        color: #1a1a1a !important;
        line-height: 1.1 !important;
        text-transform: uppercase !important;
    }

    .balam-purchase-orders-wrapper .balam-front-table.balam-purchase-orders-table td[data-label="Folio"] {
        order: 2 !important;
        width: 100% !important;
        flex: 0 0 100% !important;
        margin-bottom: 8px !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 4px !important;
        font-size: 12px !important;
        font-weight: 700 !important;
        color: #999 !important;
        text-transform: uppercase !important;
    }

    .balam-purchase-orders-wrapper .balam-front-table.balam-purchase-orders-table td[data-label="Folio"] .balam-folio-meta {
        font-size: 12px !important;
        font-weight: 700 !important;
        color: #999 !important;
        line-height: 1.2 !important;
        margin-top: 0 !important;
    }

    .balam-purchase-orders-wrapper .balam-front-table.balam-purchase-orders-table .balam-po-creator-badge {
        margin-top: 0 !important;
    }

    .balam-purchase-orders-wrapper .balam-front-table.balam-purchase-orders-table td[data-label="Productos"] {
        order: 3 !important;
        width: 100% !important;
        flex: 0 0 100% !important;
        margin: 2px 0 12px !important;
        padding: 9px 0 !important;
        border-top: 1px solid #eee !important;
        border-bottom: 1px solid #eee !important;
    }

    .balam-purchase-orders-wrapper .balam-front-table.balam-purchase-orders-table td[data-label="Productos"] .balam-mini-products {
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        list-style: none !important;
        font-family: monospace !important;
        font-size: 13px !important;
        color: #333 !important;
        line-height: 1.4 !important;
        display: block !important;
    }

    .balam-purchase-orders-wrapper .balam-front-table.balam-purchase-orders-table td[data-label="Productos"] .balam-mini-products li {
        line-height: 1.4 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
    }

    .balam-purchase-orders-wrapper .balam-front-table.balam-purchase-orders-table td[data-label="Productos"] .balam-po-related-badges {
        margin-top: 10px !important;
    }

    .balam-purchase-orders-wrapper .balam-front-table.balam-purchase-orders-table td[data-label="Estatus"] {
        order: 4 !important;
        width: 100% !important;
        flex: 0 0 100% !important;
        margin-bottom: 12px !important;
    }

    .balam-purchase-orders-wrapper .balam-front-table.balam-purchase-orders-table .balam-po-type-status {
        width: 100% !important;
        align-items: flex-start !important;
        text-align: left !important;
    }

    .balam-purchase-orders-wrapper .balam-front-table.balam-purchase-orders-table .balam-po-primary-actions {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
        width: 100% !important;
        margin-top: 8px !important;
    }

    .balam-purchase-orders-wrapper .balam-front-table.balam-purchase-orders-table .balam-po-primary-actions .balam-btn {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        min-height: 38px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .balam-purchase-orders-wrapper .balam-front-table.balam-purchase-orders-table .balam-po-primary-actions a[download].balam-btn,
    .balam-purchase-orders-wrapper .balam-front-table.balam-purchase-orders-table .balam-po-actions-grid a[download].balam-btn {
        background: #fff !important;
        color: #333 !important;
        border: 1px solid #cfcfcf !important;
        box-shadow: none !important;
    }

    .balam-purchase-orders-wrapper .balam-front-table.balam-purchase-orders-table td[data-label="Acciones"] {
        order: 5 !important;
        width: 100% !important;
        flex: 0 0 100% !important;
        margin-top: 0 !important;
    }

    .balam-purchase-orders-wrapper .balam-front-table.balam-purchase-orders-table .balam-actions-stack {
        width: 100% !important;
        gap: 0 !important;
    }

    .balam-purchase-orders-wrapper .balam-front-table.balam-purchase-orders-table .balam-po-actions-grid {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 8px !important;
        align-items: stretch !important;
        justify-content: stretch !important;
        width: 100% !important;
    }

    .balam-purchase-orders-wrapper .balam-front-table.balam-purchase-orders-table .balam-po-actions-grid .balam-btn,
    .balam-purchase-orders-wrapper .balam-front-table.balam-purchase-orders-table .balam-po-actions-grid form {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }

    .balam-purchase-orders-wrapper .balam-front-table.balam-purchase-orders-table .balam-po-actions-grid form {
        display: block !important;
        margin: 0 !important;
    }

    .balam-purchase-orders-wrapper .balam-front-table.balam-purchase-orders-table .balam-po-actions-grid form .balam-btn,
    .balam-purchase-orders-wrapper .balam-front-table.balam-purchase-orders-table .balam-po-actions-grid > .balam-btn {
        width: 100% !important;
        max-width: 100% !important;
        min-height: 38px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .balam-supplier-entries-mobile-section {
        margin-top: 0 !important;
    }

    .balam-supplier-entries-filters,
    .balam-supplier-entries-filters.balam-front-filters,
    #balam-supplier-entries-filters-form {
        width: calc(100vw - 86px) !important;
        max-width: 328px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        overflow: visible !important;
        box-sizing: border-box !important;
    }

    .balam-front-content .balam-filters-toggle-mobile#balam-supplier-entries-filters-trigger {
        width: calc(100vw - 86px) !important;
        max-width: 328px !important;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }

    .balam-supplier-entries-filters .balam-filters-controls,
    .balam-supplier-entries-filters .balam-filters-row,
    .balam-supplier-entries-filters .balam-supplier-entries-grid-primary,
    .balam-supplier-entries-filters .balam-supplier-entry-search-row,
    #balam-supplier-entries-filters-form .balam-filters-controls,
    #balam-supplier-entries-filters-form .balam-filters-row,
    #balam-supplier-entries-filters-form .balam-supplier-entries-grid-primary,
    #balam-supplier-entries-filters-form .balam-supplier-entry-search-row {
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        box-sizing: border-box !important;
    }

    .balam-supplier-entries-filters input,
    .balam-supplier-entries-filters select,
    .balam-supplier-entries-filters .balam-select,
    .balam-supplier-entries-filters .balam-select-trigger,
    #balam-supplier-entries-filters-form input,
    #balam-supplier-entries-filters-form select,
    #balam-supplier-entries-filters-form .balam-select,
    #balam-supplier-entries-filters-form .balam-select-trigger,
    .balam-supplier-entries-filters .balam-filters-row > *,
    .balam-supplier-entries-filters .balam-supplier-entries-grid-primary > *,
    .balam-supplier-entries-filters .balam-supplier-entry-search-row > *,
    #balam-supplier-entries-filters-form .balam-filters-row > *,
    #balam-supplier-entries-filters-form .balam-supplier-entries-grid-primary > *,
    #balam-supplier-entries-filters-form .balam-supplier-entry-search-row > * {
        flex: 0 0 auto !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }

    .balam-supplier-entries-filters input,
    .balam-supplier-entries-filters select,
    #balam-supplier-entries-filters-form input,
    #balam-supplier-entries-filters-form select {
        min-height: 42px !important;
        height: 42px !important;
    }

    .balam-supplier-entries-filters input[type="date"],
    .balam-supplier-entries-filters input[name="f_start"],
    .balam-supplier-entries-filters input[name="f_end"],
    #balam-supplier-entries-filters-form input[type="date"],
    #balam-supplier-entries-filters-form input[name="f_start"],
    #balam-supplier-entries-filters-form input[name="f_end"] {
        appearance: none !important;
        -webkit-appearance: none !important;
        border-radius: 999px !important;
    }

    .balam-front-table.balam-supplier-entries-table,
    .balam-front-table.balam-supplier-entries-table tbody {
        display: block !important;
        width: calc(100vw - 86px) !important;
        max-width: 328px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        border-collapse: collapse !important;
        border-spacing: 0 !important;
        box-sizing: border-box !important;
    }

    .balam-front-table.balam-supplier-entries-table thead {
        display: none !important;
    }

    .balam-front-table.balam-supplier-entries-table tr {
        align-items: flex-start !important;
        box-sizing: border-box !important;
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        gap: 0 !important;
        max-width: 100% !important;
        margin: 0 auto 12px !important;
        padding: 18px 18px 16px !important;
        position: relative !important;
        width: 100% !important;
    }

    .balam-front-table.balam-supplier-entries-table td::before,
    .balam-front-table.balam-supplier-entries-table td::after {
        content: none !important;
        display: none !important;
    }

    .balam-front-table.balam-supplier-entries-table td {
        display: flex !important;
        flex-direction: column !important;
        width: 100% !important;
        padding: 0 !important;
        margin-bottom: 0 !important;
        border: none !important;
        box-sizing: border-box !important;
    }

    .balam-front-table.balam-supplier-entries-table td[data-label="Proveedor"] {
        order: 1 !important;
        width: 100% !important;
        flex: 0 0 100% !important;
        min-width: 0 !important;
        margin-bottom: 0 !important;
        padding-bottom: 0 !important;
        padding-right: 18px !important;
        font-size: 18px !important;
        font-weight: 800 !important;
        color: #1a1a1a !important;
        line-height: 1.1 !important;
        text-transform: uppercase !important;
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: unset !important;
        overflow-wrap: anywhere !important;
        word-break: break-word !important;
    }

    .balam-front-table.balam-supplier-entries-table td[data-label="Folio / factura"] {
        order: 2 !important;
        width: 100% !important;
        flex: 0 0 100% !important;
        margin: 0 0 2px !important;
        padding-top: 0 !important;
        color: #777 !important;
        font-size: 12px !important;
        font-weight: 700 !important;
    }

    .balam-front-table.balam-supplier-entries-table .balam-supplier-entry-folio-cell {
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 2px !important;
        text-align: left !important;
    }

    .balam-front-table.balam-supplier-entries-table .balam-supplier-entry-related-line {
        color: #777 !important;
        font-size: 12px !important;
        font-weight: 700 !important;
        line-height: 1.2 !important;
    }

    .balam-front-table.balam-supplier-entries-table .balam-supplier-entry-folio-cell > .balam-folio-meta {
        display: block !important;
        margin-top: 0 !important;
        font-size: 12px !important;
        font-weight: 700 !important;
        line-height: 1.2 !important;
        color: #999 !important;
    }

    .balam-front-table.balam-supplier-entries-table td[data-label="Concepto"] {
        order: 3 !important;
        width: 100% !important;
        flex: 0 0 100% !important;
        margin: 2px 0 12px !important;
        padding: 9px 0 !important;
        border-top: 1px solid #eee !important;
        border-bottom: 1px solid #eee !important;
        font-family: inherit !important;
        font-size: 12px !important;
        font-weight: 700 !important;
        color: #333 !important;
        line-height: 1.35 !important;
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: unset !important;
        overflow-wrap: anywhere !important;
        word-break: break-word !important;
    }

    .balam-front-table.balam-supplier-entries-table td[data-label="Pedido relacionado"] {
        order: 4 !important;
        width: 100% !important;
        flex: 0 0 100% !important;
        margin-bottom: 10px !important;
    }

    .balam-front-table.balam-supplier-entries-table td[data-label="Recepción"] {
        order: 5 !important;
        width: calc(50% - 6px) !important;
        flex: 0 0 calc(50% - 6px) !important;
        margin-right: 12px !important;
        text-align: left !important;
    }

    .balam-front-table.balam-supplier-entries-table .balam-supplier-entry-received-block {
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 2px !important;
    }

    .balam-front-table.balam-supplier-entries-table .balam-supplier-entry-received-label {
        font-size: 10px !important;
        font-weight: 700 !important;
        color: #999 !important;
        line-height: 1.1 !important;
        text-transform: uppercase !important;
    }

    .balam-front-table.balam-supplier-entries-table .balam-supplier-entry-received-name {
        font-size: 11px !important;
        font-weight: 700 !important;
        color: #444 !important;
        line-height: 1.2 !important;
        text-transform: uppercase !important;
    }

    .balam-front-table.balam-supplier-entries-table td[data-label="Presentado"] {
        order: 6 !important;
        width: calc(50% - 6px) !important;
        flex: 0 0 calc(50% - 6px) !important;
        margin-bottom: 12px !important;
    }

    .balam-front-table.balam-supplier-entries-table .balam-supplier-entry-presented-block {
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 4px !important;
    }

    .balam-front-table.balam-supplier-entries-table .balam-supplier-entry-presented-label {
        display: block !important;
        font-size: 10px !important;
        font-weight: 700 !important;
        color: #8b8b8b !important;
        line-height: 1.1 !important;
        margin-bottom: 2px !important;
        text-transform: uppercase !important;
    }

    .balam-front-table.balam-supplier-entries-table td[data-label="Presentado"] .balam-toggle-row {
        justify-content: flex-start !important;
    }

    .balam-front-table.balam-supplier-entries-table td[data-label="Imágenes"] {
        order: 9 !important;
        width: 100% !important;
        flex: 0 0 100% !important;
        margin-top: 8px !important;
        margin-bottom: 0 !important;
    }

    .balam-front-table.balam-supplier-entries-table td[data-label="Imágenes"] .balam-btn {
        width: 100% !important;
        max-width: 100% !important;
        min-height: 38px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        background: #fff !important;
        color: #444 !important;
        border: 1px solid #d8d8d8 !important;
    }

    .balam-front-table.balam-supplier-entries-table td[data-label="Acciones"] {
        order: 8 !important;
        width: 100% !important;
        flex: 0 0 100% !important;
        margin-bottom: 0 !important;
    }

    .balam-front-table.balam-supplier-entries-table td[data-label="Acciones"] .balam-stack {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
        width: 100% !important;
    }

    .balam-front-table.balam-supplier-entries-table td[data-label="Acciones"] .balam-btn,
    .balam-front-table.balam-supplier-entries-table td[data-label="Acciones"] form {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
    }

    .balam-front-table.balam-supplier-entries-table td[data-label="Acciones"] form .balam-btn,
    .balam-front-table.balam-supplier-entries-table td[data-label="Acciones"] > .balam-btn,
    .balam-front-table.balam-supplier-entries-table td[data-label="Acciones"] .balam-stack > .balam-btn {
        width: 100% !important;
        min-height: 38px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    /* JERARQUÍA COMÚN */
    /* Vendedor */
    .balam-quotes-table td[data-label="Vendedor"],
    .balam-preinvoices-table td[data-label="Vendedor"],
    .balam-shipments-table td[data-label="Vendedor"],
    .balam-warranties-table td[data-label="Vendedor"] {
        order: 0;
        width: 100% !important;
        flex: 1 1 100% !important;
        font-size: 11px;
        font-weight: 700;
        color: #888;
        text-transform: uppercase;
        margin-bottom: 2px;
    }

    .balam-warranties-table td[data-label="ID"],
    .balam-clients-table td[data-label="ID"] {
        display: none !important;
    }

    .balam-quotes-table td[data-label="Folio"],
    .balam-preinvoices-table td[data-label="Folio"],
    .balam-shipments-table td[data-label="Folio"],
    .balam-warranties-table td[data-label="Folio"],
    .balam-warranties-table td[data-label="Pedido"] {
        order: 1 !important;
        width: auto !important;
        flex: 0 0 auto !important;
        font-size: 12px !important;
        font-weight: 700 !important;
        color: #999 !important;
        text-transform: uppercase !important;
        display: block !important;
        margin-right: 0 !important;
        padding-right: 0 !important;
    }

    .balam-preinvoices-table td[data-label="Folio"]::after,
    .balam-shipments-table td[data-label="Folio"]::after,
    .balam-warranties-table td[data-label="Folio"]::after,
    .balam-warranties-table td[data-label="Pedido"]::after {
        content: " - " !important;
        display: inline !important;
        margin: 0 4px !important;
    }

    /* Fecha */
    .balam-preinvoices-table td[data-label="Fecha"],
    .balam-shipments-table td[data-label="Fecha"],
    .balam-warranties-table td[data-label="Fecha"] {
        order: 2 !important;
        width: auto !important;
        flex: 0 0 auto !important;
        font-size: 12px !important;
        color: #999 !important;
        display: block !important;
        padding-left: 0 !important;
    }

    /* Cliente / Nombre (TITULAR) */
    .balam-quotes-table td[data-label="Cliente"],
    .balam-preinvoices-table td[data-label="Cliente"],
    .balam-shipments-table td[data-label="Cliente"],
    .balam-warranties-table td[data-label="Cliente"],
    .balam-clients-table td[data-label="Nombre"] {
        order: 3;
        width: 100% !important;
        flex: 1 1 100% !important;
        font-size: 17px;
        font-weight: 800;
        color: #333;
        line-height: 1.25;
        margin-top: 2px;
        white-space: normal !important;
        word-break: break-word !important;
    }

    /* Productos (Lista compacta) */
    .balam-quotes-table td[data-label="Productos"],
    .balam-preinvoices-table td[data-label="Productos"],
    .balam-shipments-table td[data-label="Productos"] {
        order: 4;
        width: 100% !important;
        flex: 1 1 100% !important;
        margin: 6px 0;
        padding: 8px 0 !important;
        border-top: 1px solid #eee !important;
        border-bottom: 1px solid #eee !important;
    }

    /* Total / Precio */
    .balam-quotes-table td[data-label="Total"],
    .balam-preinvoices-table td[data-label="Total"] {
        order: 5;
        width: 100% !important;
        flex: 1 1 100% !important;
        font-size: 19px !important;
        font-weight: 800 !important;
        color: #333;
        margin-top: 12px !important; /* Separation from the line above */
        margin-bottom: 8px !important;
    }

    /* Estatus / Mas datos */
    .balam-quotes-table td[data-label="Estatus"],
    .balam-shipments-table td[data-label="Estatus"],
    .balam-warranties-table td[data-label="Estatus"],
    .balam-clients-table td[data-label="Estado"],
    .balam-clients-table td[data-label="Vendedor"],
    .balam-clients-table td[data-label="Cotizaciones / Pedidos"] {
        order: 6 !important;
        width: auto !important;
        flex: 0 0 auto !important; /* Don't take whole line */
        margin: 5px 8px 5px 0 !important;
        display: flex !important;
        align-items: center !important;
    }

    .balam-preinvoices-table td[data-label="Estatus"] {
        order: 7 !important;
        width: auto !important;
        flex: 0 0 auto !important;
        margin: 0 8px 0 0 !important;
        display: flex !important;
        align-items: center !important;
    }

    /* Acciones */
    .balam-quotes-table td[data-label="Acciones"],
    .balam-preinvoices-table td[data-label="Acciones"],
    .balam-shipments-table td[data-label="Acciones"],
    .balam-warranties-table td[data-label="Acciones"],
    .balam-clients-table td[data-label="Acciones"] {
        order: 7 !important;
        width: auto !important;
        flex: 0 0 auto !important; /* Allow sharing line with status */
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
    }

    .balam-quotes-table td[data-label="Acciones"] div,
    .balam-preinvoices-table td[data-label="Acciones"] div,
    .balam-shipments-table td[data-label="Acciones"] div,
    .balam-warranties-table td[data-label="Acciones"] div,
    .balam-clients-table td[data-label="Acciones"] div {
        flex-direction: row !important;
        flex-wrap: wrap;
        gap: 6px !important;
        margin-top: 0px !important;
        justify-content: flex-start !important;
        align-items: center !important;
    }

    /* Badges y Botones */
    .balam-front-table tr .balam-badge {
        font-size: 11px !important;
        padding: 4px 10px !important;
    }

    .balam-front-table tr .balam-btn {
        font-size: 11px !important;
        padding: 5px 12px !important;
        border-radius: 999px !important;
        text-transform: uppercase;
        font-weight: 700;
    }

    .balam-quotes-table .balam-mini-products,
    .balam-preinvoices-table .balam-mini-products,
    .balam-shipments-table .balam-mini-products {
        list-style: none;
        padding: 0;
        margin: 0;
        font-size: 14px !important;
        font-weight: 500 !important;
        color: #333 !important;
    }

    .balam-front-table.balam-quotes-table {
        width: 100% !important;
    }

    .balam-front-table.balam-quotes-table tbody {
        width: 100% !important;
    }

    .balam-front-table.balam-quotes-table tr {
        align-items: flex-start !important;
        box-sizing: border-box !important;
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        gap: 0 !important;
        padding: 18px 18px 16px !important;
        position: relative !important;
        width: 100% !important;
    }

    .balam-front-table.balam-quotes-table td::before,
    .balam-front-table.balam-quotes-table td::after {
        content: none !important;
        display: none !important;
    }

    .balam-front-table.balam-quotes-table .balam-client-seller-cell {
        order: 1 !important;
        flex: 0 0 100% !important;
        width: 100% !important;
        padding-right: 42px !important;
        margin-bottom: 8px !important;
    }

    .balam-front-table.balam-quotes-table .balam-client-line {
        font-size: 13px !important;
        font-weight: 700 !important;
        line-height: 1.22 !important;
        margin-bottom: 8px !important;
    }

    .balam-front-table.balam-quotes-table td[data-label="Folio"] {
        color: #333333 !important;
        display: block !important;
        flex: 0 0 100% !important;
        font-size: 12px !important;
        font-weight: 700 !important;
        margin: 0 0 10px !important;
        order: 2 !important;
        text-transform: none !important;
        width: 100% !important;
    }

    .balam-front-table.balam-quotes-table .balam-quote-folio-cell {
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 4px !important;
        text-align: left !important;
    }

    .balam-front-table.balam-quotes-table .balam-quote-folio-cell > .balam-folio-meta {
        display: block !important;
        margin-top: 0 !important;
    }

    .balam-front-table.balam-quotes-table .balam-quote-preview-wrap {
        position: absolute !important;
        right: 18px !important;
        top: 18px !important;
        z-index: 2 !important;
    }

    .balam-front-table.balam-quotes-table .balam-folio-preview-trigger {
        align-items: center !important;
        display: inline-flex !important;
        height: 28px !important;
        justify-content: center !important;
        width: 28px !important;
    }

    .balam-front-table.balam-quotes-table td[data-label="Productos"] {
        border-bottom: 1px solid #333333 !important;
        border-top: 1px solid #333333 !important;
        flex: 0 0 100% !important;
        margin: 5px 0 15px !important;
        order: 3 !important;
        padding: 10px 0 !important;
        width: 100% !important;
    }

    .balam-front-table.balam-quotes-table td[data-label="Total"],
    .balam-front-table.balam-quotes-table td[data-label="Estatus"] {
        flex: 0 0 50% !important;
        margin: 0 0 12px !important;
        order: 4 !important;
        width: 50% !important;
    }

    .balam-front-table.balam-quotes-table td[data-label="Total"] {
        font-size: 19px !important;
        font-weight: 900 !important;
        justify-content: center !important;
    }

    .balam-front-table.balam-quotes-table td[data-label="Estatus"] {
        align-items: flex-end !important;
        justify-content: center !important;
        padding-left: 8px !important;
    }

    .balam-front-table.balam-quotes-table td[data-label="Acciones"] {
        flex: 0 0 100% !important;
        justify-content: stretch !important;
        order: 5 !important;
        width: 100% !important;
    }

    .balam-front-table.balam-quotes-table .balam-quote-actions-stack,
    .balam-front-table.balam-quotes-table .balam-quote-actions-row {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        gap: 6px !important;
        justify-content: stretch !important;
        width: 100% !important;
    }

    .balam-front-table.balam-quotes-table .balam-quote-actions-stack {
        align-items: stretch !important;
    }

    .balam-front-table.balam-quotes-table .balam-quote-actions-stack > .balam-quote-actions-row {
        flex: 2 1 0 !important;
        min-width: 0 !important;
    }

    .balam-front-table.balam-quotes-table .balam-quote-actions-stack > .balam-btn,
    .balam-front-table.balam-quotes-table .balam-quote-actions-row > .balam-btn {
        flex: 1 1 0 !important;
        min-width: 0 !important;
        width: auto !important;
    }

    .balam-inventory-table td {
        display: block;
        padding: 0px 0;
        white-space: normal;
        grid-column: 2;
        width: 100% !important;
        text-align: left !important;
    }

    .balam-inventory-table td::before {
        display: none !important;
    }

    .balam-inv-val-name {
        font-weight: 700;
        font-size: 15px;
        margin-top: 2px;
        color: #111;
    }

    .balam-inv-val-characteristics {
        display: block !important;
        font-size: 13px !important;
        line-height: 1.4 !important;
        color: #666 !important;
        margin-top: 5px !important;
    }

    .balam-inv-type-characteristics {
        gap: 6px !important;
    }

    .balam-inventory-table .balam-type-badge,
    .balam-minimum-alerts-table .balam-type-badge {
        font-size: 10px !important;
        padding: 4px 8px !important;
    }

    .balam-inv-logistics {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 4px !important;
        font-size: 11px !important;
        line-height: 1.2 !important;
    }

    .balam-inv-logistics-row {
        grid-template-columns: 52px minmax(0, 1fr) !important;
        gap: 6px !important;
    }

    .balam-inventory-view-tabs {
        gap: 5px !important;
        margin-bottom: 18px !important;
        overflow-x: auto !important;
        padding-left: 6px !important;
    }

    .balam-inventory-view-tab {
        min-height: 38px !important;
        padding: 0 22px 0 14px !important;
        font-size: 11px !important;
        white-space: nowrap !important;
    }

    .balam-form-grid {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }

    .balam-grid-span-2,
    .balam-grid-span-3 {
        grid-column: span 1 !important;
    }

    .balam-inv-val-stock {
        font-size: 16px !important;
        font-weight: 700;
        margin-top: 6px;
    }

    .balam-inventory-table td:first-child {
        grid-column: 1;
        grid-row: 1 / span 8;
        padding-top: 2px;
        width: auto !important;
    }

    .balam-product-img{
        width: 64px;
        height: 64px;
        object-fit: contain;
        border-radius: 12px;
        background: #f4f4f4;
        padding: 8px;
        
        display: block;
        margin: 0 auto;
    }

    .balam-product-img{
        width: 56px;
        height: 56px;
        object-fit: contain;
        border-radius: 10px;
        background: #f4f4f4;
        padding: 6px;
        
    }

    .balam-task-card{
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }

    .balam-task-actions{
        width: 100%;
        justify-content: flex-start;
        flex-wrap: wrap;
    }

    .balam-quote-form .balam-row,
    .balam-row{
        flex-wrap: wrap;
        gap: 10px;
    }

    .balam-field{
        width: 100%;
    }

    .balam-actions-row{
        flex-direction: column;
        gap: 10px;
        align-items: stretch;
    }

    .balam-toggle-row{
        flex-wrap: wrap;
    }
}

@media (max-width: 480px) {
    .balam-front-wrapper{
        padding: 0 10px 24px;
    }

    .balam-front-header-title{
        font-size: 14px;
    }

    .balam-front-status{
        font-size: 12px;
    }


    .balam-step,
    .balam-module{
        font-size: 9px;
        padding: 5px 10px;
    }

    .balam-input-lg,
    .balam-input{
        font-size: 12px !important;
    }

    .balam-front-title{
        font-size: 22px;
    }
}

@media (max-width: 900px) {
    .balam-states-layout {
        grid-template-columns: 1fr;
    }

    .balam-states-pie-wrap {
        max-width: 180px;
    }

    .balam-gallery-layout {
        grid-template-columns: 1fr;
    }
    .balam-gallery-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .balam-gallery-modal {
        width: 100%;
        max-width: 100%;
        height: 100vh;
    }
    .balam-modal.balam-gallery-modal {
        height: 100vh;
        border-radius: 0;
        max-height: 100vh;
        overflow: auto;
    }
}

@media (max-width: 600px) {
    .balam-gallery-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 8px;
    }
    .balam-photo-thumb {
        height: 90px;
    }
    .balam-photo-actions {
        top: 4px;
        right: 4px;
    }
    .balam-photo-action {
        width: 22px;
        height: 22px;
        font-size: 11px;
    }
    .balam-gallery-proof {
        max-width: 100%;
        max-height: 40vh;
    }
    .balam-modal.balam-gallery-modal {
        height: 100vh;
        border-radius: 0;
        max-height: 100vh;
        overflow-x: hidden;
        overflow-y: auto;
        padding: calc(80px + env(safe-area-inset-top)) 16px 40px;
    }
    .balam-close {
        position: fixed;
        top: calc(25px + env(safe-area-inset-top));
        right: 25px;
        width: 38px;
        height: 38px;
        z-index: 10001; /* High above modal */
        background: #fff !important;
        
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        color: #333 !important;
    }

    /* Clientes Específicos movidos para consolidación */
}

@media (max-width: 900px) {
    .balam-calendar-grid-wrap {
        overflow-x: auto;
    }

    .balam-calendar-grid {
        min-width: 760px;
    }
}

@media (max-width: 900px) {
    .balam-publicity-sections {
        grid-template-columns: 1fr;
    }
    .balam-publicity-assets {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .balam-publicity-product-grid{
        grid-template-columns:1fr;
    }
    .balam-publicity-col-name,
    .balam-publicity-col-type,
    .balam-publicity-col-visible{
        grid-column:auto;
    }
    .balam-publicity-modal-asset-row > strong{
        min-width:0;
    }
    .balam-publicity-modal-asset-row{
        grid-template-columns:1fr;
    }
    .balam-publicity-modal-actions{
        width:100%;
        justify-content:space-between;
        grid-column:1;
        grid-row:2;
    }
    .balam-publicity-modal-preview{
        grid-column:1;
        grid-row:3;
    }
    .balam-publicity-assets {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 920px) {
    .balam-ship-notif-panel {
        left: 12px;
        right: 12px;
        width: auto;
        max-width: none;
        max-height: 72vh;
        top: auto;
        bottom: 1em;
        transform: none;
    }

    .balam-ship-notif-list {
        width: 100%;
    }

    .balam-ship-notif-card {
        box-sizing: border-box;
        width: 100%;
    }

    .balam-front-table.balam-warranties-table td[data-label="Pedido / Vendedor"]::before,
    .balam-front-table.balam-warranties-table td[data-label="Productos"]::before,
    .balam-front-table.balam-warranties-table td[data-label="Documentos"]::before,
    .balam-front-table.balam-warranties-table td[data-label="Estatus / Acciones"]::before,
    .balam-front-table.balam-warranties-table td[data-label="Folio"]::before,
    .balam-front-table.balam-warranties-table td[data-label="Cliente"]::before,
    .balam-front-table.balam-warranties-table td[data-label="Fecha"]::before {
        content: none !important;
        display: none !important;
    }

    .balam-front-table.balam-warranties-table td[data-label="Folio"]::after,
    .balam-front-table.balam-warranties-table td[data-label="Pedido / Vendedor"]::after {
        content: none !important;
        display: none !important;
    }


    .balam-mobile-only {
        display: block !important;
    }

    .balam-mobile-hide {
        display: none !important;
    }

    .balam-preinvoices-table td[data-label="Estatus"] {
        display: none !important;
    }

    .balam-shipments-table td[data-label="Almacén"] {
        order: -1;
        width: 100% !important;
        flex: 1 1 100% !important;
        margin-bottom: 8px !important;
    }

    .balam-shipments-table td[data-label="Fecha"] {
        width: auto !important;
        flex: 0 0 auto !important;
        margin-left: 0 !important;
        display: flex !important;
        align-items: center !important;
    }

    .balam-shipments-table td[data-label="Paquetería / Entrega"] {
        order: 3;
        width: 100% !important;
        flex: 1 1 100% !important;
        margin: 8px 0 !important;
    }

    .balam-shipments-table td[data-label="Galería"] {
        order: 5;
        width: 100% !important;
        flex: 1 1 100% !important;
        margin: 10px 0 !important;
    }

    .balam-shipment-date-group {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        gap: 8px !important;
    }

    .balam-carrier-group {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        gap: 8px !important;
        flex-wrap: wrap;
    }

    .balam-front-table.balam-warranties-table td[data-label="Pedido / Vendedor"],
    .balam-front-table.balam-warranties-table td[data-label="Pedido"] {
        display: none !important;
    }

    .balam-front-table.balam-warranties-table td[data-label="Cliente"] {
        order: 1 !important;
        width: 100% !important;
        flex: 1 1 100% !important;
        font-size: 17px !important;
        font-weight: 800 !important;
        color: #333 !important;
        line-height: 1.2 !important;
        margin: 0 0 8px !important;
        white-space: normal !important;
        word-break: break-word !important;
        overflow-wrap: anywhere !important;
    }

    .balam-front-table.balam-warranties-table .balam-warranty-client-cell {
        align-items: flex-start !important;
        text-align: left !important;
        gap: 8px !important;
    }

    .balam-front-table.balam-warranties-table .balam-warranty-mobile-seller-badge {
        display: inline-flex !important;
        margin: 0 !important;
        width: fit-content !important;
        align-self: flex-start !important;
    }

    .balam-front-table.balam-warranties-table td[data-label="Folio"] {
        order: 2 !important;
        width: 100% !important;
        flex: 0 0 100% !important;
        font-size: 12px !important;
        font-weight: 700 !important;
        color: #777 !important;
        text-transform: none !important;
        margin: 0 0 8px !important;
        line-height: 1.2 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 4px !important;
        text-align: left !important;
    }

    .balam-front-table.balam-warranties-table td[data-label="Folio"]::after {
        content: none !important;
        display: none !important;
    }

    .balam-front-table.balam-warranties-table td[data-label="Folio"] .balam-folio-meta,
    .balam-front-table.balam-warranties-table td[data-label="Folio"] .balam-warranty-mobile-order {
        display: block !important;
        width: 100% !important;
        margin-top: 0 !important;
        font-size: 12px !important;
        font-weight: 700 !important;
        color: #777 !important;
        text-transform: none !important;
        line-height: 1.2 !important;
    }

    .balam-front-table.balam-warranties-table td[data-label="Productos"] {
        order: 3 !important;
        width: 100% !important;
        flex: 0 0 100% !important;
        margin: 2px 0 12px !important;
        padding: 9px 0 !important;
        border-top: 1px solid #eee !important;
        border-bottom: 1px solid #eee !important;
        font-size: 13px !important;
        font-weight: 700 !important;
        color: #333 !important;
        line-height: 1.22 !important;
    }

    .balam-front-table.balam-warranties-table td[data-label="Documentos"] {
        order: 4 !important;
        width: 100% !important;
        flex: 1 1 100% !important;
        margin: 0 0 12px !important;
    }

    .balam-front-table.balam-warranties-table .balam-warranty-docs-cell .balam-actions-stack {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 8px !important;
        width: 100% !important;
    }

    .balam-front-table.balam-warranties-table .balam-warranty-doc-btn {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        min-width: 0 !important;
        padding-inline: 6px !important;
        text-align: center !important;
        font-size: 11px !important;
        background: #fff !important;
        color: #333 !important;
        border: 1px solid #333 !important;
    }

    .balam-front-table.balam-warranties-table .balam-warranty-doc-btn svg,
    .balam-front-table.balam-warranties-table .balam-warranty-doc-btn i {
        display: none !important;
    }

    .balam-front-table.balam-warranties-table td[data-label="Estatus / Acciones"],
    .balam-front-table.balam-warranties-table td[data-label="Estatus"] {
        order: 5 !important;
        width: 100% !important;
        flex: 1 1 100% !important;
        margin: 0 !important;
    }

    .balam-front-table.balam-warranties-table .balam-warranty-status-actions-stack {
        width: 100% !important;
        align-items: stretch !important;
        gap: 10px !important;
    }

    .balam-front-table.balam-warranties-table .balam-warranty-status-actions-stack > .balam-badge,
    .balam-front-table.balam-warranties-table .balam-warranty-status-actions-stack > * {
        align-self: flex-start !important;
    }

    .balam-front-table.balam-warranties-table .balam-warranty-status-actions-stack > .balam-actions-row:not(.balam-warranty-mobile-action-row) {
        display: none !important;
    }

    .balam-front-table.balam-warranties-table .balam-warranty-mobile-action-row {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
        width: 100% !important;
    }

    .balam-front-table.balam-warranties-table .balam-warranty-mobile-action-row .balam-btn {
        width: 100% !important;
        min-width: 0 !important;
        justify-content: center !important;
    }

    /* Clientes Específicos Consolidados */
    .balam-clients-table td[data-label="Nombre"] {
        order: 1 !important;
        font-size: 18px !important;
        margin-bottom: 2px !important;
    }
    .balam-clients-table td[data-label="Contacto"] {
        order: 2 !important;
        width: 100% !important;
        flex: 1 1 100% !important;
        font-size: 13px !important;
        font-weight: 400 !important;
        color: #777 !important;
        margin-top: 5px !important;
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        gap: 5px !important;
    }
    .balam-clients-table td[data-label="Contacto"]::before {
        display: none !important;
    }
    .balam-clients-table td[data-label="Email"] {
        order: 3 !important;
        width: 100% !important;
        flex: 1 1 100% !important;
        font-size: 13px !important;
        color: #777 !important;
        margin-bottom: 4px !important;
    }
    .balam-clients-table td[data-label="Estado"] {
        order: 4 !important;
        margin: 0 !important;
        font-size: 13px !important;
    }
    .balam-clients-table td[data-label="Cotizaciones / Pedidos"] {
        order: 5 !important;
        font-size: 12px !important;
        color: #666 !important;
        font-weight: 500 !important;
        margin: 2px 0 8px !important;
        display: flex !important;
        flex-direction: row !important;
        gap: 4px !important;
        align-items: center !important;
        flex-wrap: wrap !important;
    }
    .balam-clients-table td[data-label="Vendedor"] {
        order: 6 !important;
    }

    .balam-inv-val-name { font-size: 16px !important; font-weight: 800 !important; line-height: 1 !important; margin: 0 !important; }
    .balam-inventory-table .balam-type-badge,
    .balam-minimum-alerts-table .balam-type-badge { font-size: 10px !important; line-height: 1 !important; margin: 0 !important; }
    .balam-inv-val-characteristics { font-size: 11px !important; line-height: 1.15 !important; color: #666 !important; margin: 0 !important; }

    .balam-front-table thead { display: none !important; }

    .balam-inv-val-name { font-size: 16px !important; font-weight: 800 !important; margin-bottom: 0 !important; line-height: 1.1 !important; }
    .balam-inv-type-characteristics { gap: 5px !important; }
    .balam-inv-val-characteristics { font-size: 11px !important; line-height: 1.15 !important; color: #666 !important; margin-top: -3px !important; }
    .balam-inv-price-item {
        align-items: center !important;
        gap: 2px !important;
    }
    .balam-inv-price-item .balam-inv-label-mini {
        font-size: 12px !important;
        line-height: 1 !important;
    }
    .balam-inv-price-item .balam-inv-value {
        font-size: 13px !important;
        line-height: 1.1 !important;
    }

    /* CABECERA DE TAB: TÍTULO + BOTONES STACKED AL EXTREMO DERECHO */

    /* VISTA NUEVA COTIZACIÓN MÓVIL (REDiseño) */
    .balam-front-content.balam-form-card {
        padding: 25px 20px !important;
        margin: 0 0 25px 0 !important; /* Sin márgenes laterales para homogeneidad total */
        width: 100% !important;
        box-sizing: border-box !important;
    }

    /* HOMOGENEIZACIÓN DE CAMPOS: Solo Selects e Inputs */
    select#balam-seller-id.balam-input-lg,
    select#balam-client-select.balam-input-lg,
    .balam-front-filters select,
    .balam-front-filters input,
    select.balam-input-lg, 
    input.balam-input-lg {
        height: 34px !important;
        min-height: 42px !important;
        line-height: normal !important;
        padding: 0 20px !important;
        font-size: 14px !important;
        color: #333 !important;
        border: 2px solid #e0e0e0 !important;
        border-radius: 50em !important;
        background-color: #ffffff !important;
        width: 100% !important;
        box-sizing: border-box !important;
        display: block !important;
        appearance: none !important;
        -webkit-appearance: none !important;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") !important;
        background-repeat: no-repeat !important;
        background-position: right 15px center !important;
        background-size: 12px !important;
        letter-spacing: -0.5px !important;
    }

    /* TÍTULOS: Texto simple, sin adornos de selector */
    .balam-section-title, 
    .balam-subsection-title,
    .balam-front-content h4 {
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        height: auto !important;
        min-height: 0 !important;
        margin-top: 20px !important;
        margin-bottom: 10px !important;
        font-size: 13px !important;
        font-weight: 700 !important;
        color: #444 !important;
        letter-spacing: -0.5px !important;
        display: block !important;
        background-image: none !important;
    }

    /* BOTONES: Píldora limpia sin flechas */
    .balam-front-content .balam-btn {
        height: 33px !important;
        line-height: 33px !important;
        padding: 0 20px !important;
        background-color: #333 !important;
        color: #ffffff !important;
        border-radius: 999em !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        font-weight: 600 !important;
        border: none !important;
        background-image: none !important; /* Quitar flecha accidental */
        appearance: none !important;
    }
    
    .balam-front-content .balam-btn.color-grey {
        background-color: #e0e0e0 !important;
        color: #333 !important;
    }

    .balam-front-content .balam-btn.balam-clear-filters-btn {
        background: #f7f7f7 !important;
        border-color: #f7f7f7 !important;
        color: #333 !important;
        font-size: 11px !important;
    }

    /* Ocultar botones técnicos que no deben ser visibles */
    #balam-select-client {
        display: none !important;
    }

    /* Sincronización de anchos: Quitar márgenes de filtros para igualar con productos */
    .balam-front-content .balam-front-filters {
        padding: 0 !important;
        margin: 0 !important;
        width: 100% !important;
    }

    /* Columnas apiladas para homogeneidad de ancho */
    .balam-system-filters {
        display: flex !important;
        flex-direction: column !important;
        gap: 15px !important;
        width: 100% !important;
    }

    .balam-system-filters > div {
        width: 100% !important;
        flex: none !important;
    }
    
    /* Botón Crear Cliente NO debe ser ancho completo */
    #balam-btn-new-client {
        width: auto !important;
        display: inline-flex !important;
        align-self: flex-start !important;
        margin-top: 5px !important;
    }

    /* Ocultar líneas divisorias (HR y bordes de títulos) */
    hr {
        display: none !important;
    }

    /* Títulos con spacing -0.5px */
    .balam-section-title, 
    .balam-subsection-title,
    .balam-front-content h4 {
        letter-spacing: -0.5px !important;
        border-bottom: none !important;
        margin-top: 15px !important;
        margin-bottom: 15px !important;
        font-size: 20px !important;
        color: #333 !important;
        display: block !important;
    }

    .balam-quote-totals button,


    .balam-stock-add-group button,


    .balam-btn.size-normal {
        width: 100% !important;
        height: 42px !important;
        border-radius: 50em !important;
        letter-spacing: normal !important; /* Quitar custom spacing */
    }

    /* Compactar Stock + Agregar en 2 columnas */
    .balam-stock-add-group {
        display: flex !important;
        flex-direction: row !important;
        align-items: flex-end !important;
        gap: 12px !important;
        margin-top: 5px !important;
        width: 100% !important;
    }

    .balam-stock-add-group > div:first-child {
        width: 70px !important;
        flex-shrink: 0;
    }

    .balam-stock-add-group > div:last-child {
        flex: 1;
    }

    /* Notas Internas: Reducir aire */
    textarea.balam-input-lg {
        margin-top: 0 !important;
        padding: 12px 18px !important;
        font-size: 14px !important;
        border-radius: 18px !important;
    }

    /* REDISEÑO DE PRODUCTOS AGREGADOS (TARJETAS VERTICALES) */
    .balam-front-table thead {
        display: none !important;
    }

    .balam-front-table tbody tr {
        display: block !important;
        background: #fff !important;
        border: transparent !important;
        border-radius: 15px !important;
        padding: 20px !important;
        margin-bottom: 25px !important;
        position: relative !important;
        box-shadow: 0 4px 12px rgba(0,0,0,0.02) !important;
    }

    .balam-front-table td {
        display: block !important;
        width: 100% !important;
        text-align: left !important;
        padding: 10px 0 !important;
        border: none !important;
        font-size: 14px !important;
    }

    /* Etiquetas apiladas */
    .balam-front-table td:before {
        content: attr(data-label);
        display: block !important;
        font-size: 10px !important;
        font-weight: 800 !important;
        color: #999 !important;
        text-transform: uppercase !important;
        letter-spacing: 0.1em !important;
        margin-bottom: 6px !important;
    }

    /* Estilo Producto */
    .balam-front-table td[data-label="Producto"] {
        font-weight: 700 !important;
        font-size: 18px !important;
        color: #1a1a1a !important;
        border-bottom: 1.5px solid #f8f8f8 !important;
        padding-bottom: 15px !important;
        margin-bottom: 10px !important;
    }

    /* Atributo interior (badge) */
    .balam-front-table .balam-type-badge {
        display: inline-flex !important;
        align-items: center !important;
        max-width: 100% !important;
        background: #e8f7e6 !important;
        color: #2d8d21 !important;
        padding: 5px 10px !important;
        border-radius: 999px !important;
        font-size: 10px !important;
        font-weight: 800 !important;
        line-height: 1 !important;
        margin-top: 5px !important;
        text-transform: uppercase !important;
    }

    /* Campos de entrada (Entrega, Precio, Cantidad) */
    .balam-front-table td input {
        width: 100% !important;
        display: block !important;
        background: #d7d7d7 !important;
        border: 1.5px solid #eee !important;
        border-radius: 10px !important;
        padding: 8px 12px !important;
        font-size: 14px !important;
    }

    /* Eliminar (Floating) */
    .balam-front-table td[data-label="Eliminar"] {
        position: absolute !important;
        top: 15px !important;
        right: 15px !important;
        width: auto !important;
        padding: 0 !important;
    }

    .balam-front-table td[data-label="Eliminar"]:before {
        display: none !important;
    }

    /* TIPOGRAFÍA Y JERARQUÍA */
    .balam-front-content .balam-subsection-title {
        font-size: 16px !important;
        font-weight: 600 !important;
        text-transform: uppercase !important;
        letter-spacing: -0.5px !important;
        color: #1a1a1a !important;
        margin-top: 25px !important;
        margin-bottom: 12px !important;
    }

    /* OCULTAR FLECHAS SELECTOR NUMÉRICO */
    .balam-front-content input::-webkit-outer-spin-button,
    .balam-front-content input::-webkit-inner-spin-button {
        -webkit-appearance: none !important;
        margin: 0 !important;
    }
    .balam-front-content input[type=number] {
        -moz-appearance: textfield !important;
    }

    /* REORDENAMIENTO LÓGICO CERRADO (FIX DEFINITIVO) */
    .balam-front-content .balam-quote-summary {
        display: flex !important;
        flex-direction: column !important;
        gap: 0 !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    /* 1. TABLA DE TOTALES (PRIMERA) */
    .balam-front-content .balam-quote-totals {
        display: contents !important;
    }

    .balam-front-content .balam-quote-totals-table {
        order: 10 !important;
        background: #ffffff !important;
        border: 2px solid #e0e0e0 !important;
        border-radius: 20px !important;
        width: 100% !important;
        display: table !important;
        border-collapse: collapse !important;
        overflow: hidden !important;
        box-shadow: none !important; /* CERO SOMBRAS */
        margin-top: 0 !important;
        margin-bottom: 25px !important;
    }

    .balam-front-content .balam-quote-totals-table tr {
        display: table-row !important;
        background: transparent !important;
        border-bottom: 1px solid #f0f0f0 !important;
        box-shadow: none !important;
    }

    .balam-front-content .balam-quote-totals-table td {
        display: table-cell !important;
        padding: 10px 20px !important;
        font-size: 16px !important;
        color: #333 !important;
        border: none !important;
    }

    .balam-front-content .balam-quote-totals-table td:last-child {
        text-align: right !important;
        font-weight: 700 !important;
    }

    /* 2. NOTAS INTERNAS (SEGUNDAS) */
    .balam-front-content .balam-quote-summary > div:first-child {
        order: 20 !important;
        width: 100% !important;
        margin-top: 5px !important;
    }

    .balam-front-content textarea.balam-input-lg[name="notes"] {
        margin-bottom: 30px !important;
        height: 110px !important;
        min-height: 110px !important;
        box-shadow: none !important; /* CERO SOMBRAS */
        border: 1px solid #e0e0e0 !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    /* 3. BLOQUE DE BOTONES (TERCEROS) */
    .balam-front-content .balam-quote-totals .balam-btn,
    .balam-front-content .balam-quote-totals button {
        order: 30 !important;
        display: flex !important;
        width: 100% !important;
        height: 46px !important;
        margin-bottom: 12px !important;
        border-radius: 50em !important;
        font-weight: 700 !important;
        justify-content: center !important;
        align-items: center !important;
        letter-spacing: -0.5px !important;
        border: none !important;
        font-size: 14px !important;
        text-transform: uppercase !important;
        box-shadow: none !important; /* CERO SOMBRAS */
    }

    .balam-front-content .balam-quote-totals .balam-actions-stack {
        order: 30 !important;
        width: 100% !important;
        gap: 12px !important;
    }

    .balam-front-content .balam-quote-totals .balam-actions-stack .balam-btn,
    .balam-front-content .balam-quote-totals .balam-actions-stack button {
        margin-bottom: 0 !important;
    }

    /* Colores botones */
    .balam-front-content .balam-quote-totals .balam-btn.color-grey {
        background-color: #e0e0e0 !important;
        color: #333 !important;
    }
    .balam-front-content .balam-quote-totals .balam-btn.color-blue {
        background-color: #4480e6 !important;
        color: #fff !important;
    }
    .balam-front-content .balam-quote-totals .balam-btn.color-black {
        background-color: #d7d7d7 !important;
        color: #333 !important;
        border-color: #d7d7d7 !important;
    }

    /* AJUSTE TARJETA PRODUCTO (EVITAR DESBORDE) */
    .balam-front-table tr {
        box-sizing: border-box !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-shadow: none !important; /* CERO SOMBRAS */
        border: 2px solid #e0e0e0 !important;
    }

    @media (min-width: 641px) {
        .balam-quote-form .balam-quote-half-wrap {
            width: 50% !important;
            max-width: 50% !important;
            flex: 0 0 50% !important;
        }

    }

    @media (max-width: 640px) {
        .balam-quote-form .balam-quote-half-wrap {
            width: 100% !important;
            max-width: 100% !important;
            flex-basis: 100% !important;
        }
    }
}
/* ======================================================
   BALAM RESPONSIVE BASELINE
   Capa global movil: no afecta desktop (>768px)
====================================================== */
@media (max-width: 768px) {
    html,
    body {
        max-width: 100%;
        overflow-x: hidden;
    }

    .balam-front,
    .balam-front-wrapper {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    .balam-front-wrapper {
        padding: 24px 14px 38px !important;
    }

    .balam-front-header {
        margin: 0 0 22px !important;
    }

    .balam-front-header-inner {
        width: 100% !important;
        max-width: 330px !important;
        margin: 0 auto !important;
        border-radius: 16px !important;
        box-sizing: border-box !important;
    }

    .balam-front-status {
        width: 100% !important;
        max-width: 330px !important;
        margin: 0 auto 24px !important;
        box-sizing: border-box !important;
    }

    .balam-mobile-menu-trigger-col {
        min-width: 82px !important;
        padding: 16px 18px !important;
    }

    .balam-mobile-header-info-col {
        min-width: 0 !important;
        padding-left: 20px !important;
    }

    .balam-mobile-user-row {
        min-width: 0 !important;
    }

    .balam-mobile-user-row .greeting {
        overflow-wrap: anywhere !important;
    }

    .balam-front-content {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        overflow: visible !important;
    }

    .balam-tab-header {
        width: 100% !important;
        max-width: 330px !important;
        margin: 0 auto 20px !important;
        box-sizing: border-box !important;
    }

    .balam-tab-header .balam-front-title {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 10px !important;
        font-size: clamp(22px, 7vw, 28px) !important;
        line-height: 1.05 !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
    }

    .balam-tab-header .balam-front-title svg {
        flex: 0 0 auto !important;
    }

    .balam-export-actions {
        width: 100% !important;
    }

    .balam-export-actions .balam-btn {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 270px !important;
    }

    .balam-inventory-view-tabs {
        width: calc(100vw - 28px) !important;
        max-width: 100% !important;
        margin: 0 0 16px !important;
        padding: 0 0 8px !important;
        display: flex !important;
        flex-wrap: nowrap !important;
        gap: 8px !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch !important;
        scrollbar-width: thin;
        scroll-snap-type: x proximity;
        border-bottom: 2px solid #d8d8d8 !important;
    }

    .balam-inventory-view-tabs::-webkit-scrollbar {
        height: 4px;
    }

    .balam-inventory-view-tabs::-webkit-scrollbar-thumb {
        background: #bdbdbd;
        border-radius: 999px;
    }

    .balam-inventory-view-tab {
        flex: 0 0 auto !important;
        min-width: max-content !important;
        max-width: none !important;
        min-height: 42px !important;
        padding: 0 18px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        white-space: nowrap !important;
        overflow: visible !important;
        text-overflow: clip !important;
        scroll-snap-align: start;
        font-size: 11px !important;
        line-height: 1 !important;
    }

    .balam-inventory-view-tab.is-active {
        color: #2fb426 !important;
    }

    .balam-filters-toggle-mobile {
        width: 100% !important;
        max-width: 330px !important;
        margin: 0 auto 16px !important;
        box-sizing: border-box !important;
    }

    .balam-system-filters,
    .balam-front-filters {
        width: 100% !important;
        max-width: 330px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        box-sizing: border-box !important;
    }

    .balam-system-filters.is-expanded,
    .balam-system-filters.is-active {
        padding: 16px !important;
        border-radius: 18px !important;
        background: #fff !important;
        border: 1px solid #333 !important;
    }

    .balam-front-table,
    .balam-front-table tbody,
    .balam-front-table tr {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    .balam-front-table tbody tr {
        max-width: 330px !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .balam-inv-val-name {
        font-size: 15px !important;
        line-height: 1.05 !important;
    }

    .balam-inv-val-characteristics {
        overflow-wrap: anywhere !important;
    }

    .balam-modal {
        width: calc(100vw - 24px) !important;
        max-width: calc(100vw - 24px) !important;
        box-sizing: border-box !important;
    }

    .balam-tabs {
        overflow-x: auto !important;
        flex-wrap: nowrap !important;
        -webkit-overflow-scrolling: touch !important;
    }

    .balam-tab {
        flex: 0 0 auto !important;
        white-space: nowrap !important;
    }

    .balam-form-grid {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 420px) {
    .balam-front-wrapper {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    .balam-front-header-inner,
    .balam-front-status,
    .balam-tab-header,
    .balam-filters-toggle-mobile,
    .balam-system-filters,
    .balam-front-filters,
    .balam-front-table tbody tr {
        max-width: 310px !important;
    }

    .balam-inventory-view-tabs {
        width: calc(100vw - 20px) !important;
    }

    .balam-front-table.balam-quotes-table tbody tr {
        max-width: 328px !important;
        width: calc(100vw - 86px) !important;
    }
}

@media (max-width: 768px) {
    .balam-quotes-filters .balam-quotes-top-row,
    .balam-quotes-filters .balam-quotes-top-row {
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
        margin: 0 !important;
        max-width: none !important;
        min-width: 0 !important;
        overflow: visible !important;
        width: 100% !important;
    }

    .balam-quotes-filters input,
    .balam-quotes-filters select,
    .balam-quotes-filters .balam-select {
        box-sizing: border-box !important;
        flex: 0 0 auto !important;
        max-width: none !important;
        min-width: 0 !important;
        width: 100% !important;
    }

    .balam-quotes-filters input[type="date"],
    .balam-quotes-filters input[name="from"],
    .balam-quotes-filters input[name="to"] {
        appearance: none !important;
        min-height: 44px !important;
    }

    .balam-file-modal {
        max-width: calc(100vw - 80px) !important;
        width: calc(100vw - 80px) !important;
    }

    .balam-file-modal-preview {
        box-sizing: border-box !important;
        justify-content: center !important;
        max-width: 100% !important;
        width: 100% !important;
    }

    .balam-file-modal-preview img,
    .balam-file-modal-preview canvas,
    .balam-file-modal-media {
        display: block !important;
        margin-left: auto !important;
        margin-right: auto !important;
        max-width: 100% !important;
    }
}

/* ======================================================
   MOBILE SUBNAV PRIORITY
   En movil las pestañas son navegacion primaria del modulo.
====================================================== */
@media (max-width: 768px) {
    .balam-front-content {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
    }

    .balam-tab-header {
        display: contents !important;
        padding: 0 !important;
        margin: 0 !important;
        background: transparent !important;
        border: 0 !important;
        border-radius: 0 !important;
    }

    .balam-tab-header .balam-front-title {
        order: 1 !important;
        width: 100% !important;
        max-width: 330px !important;
        margin: 0 auto 18px !important;
        padding: 26px 20px !important;
        box-sizing: border-box !important;
        background: #fff !important;
        border-radius: 22px !important;
        text-align: center !important;
    }

    .balam-inventory-view-tabs {
        order: 2 !important;
        width: 100% !important;
        max-width: 330px !important;
        margin: 0 auto 18px !important;
        padding: 0 !important;
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
        overflow: visible !important;
        border-bottom: 0 !important;
        scroll-snap-type: none !important;
    }

    .balam-inventory-view-tab {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        min-height: 42px !important;
        padding: 0 12px !important;
        border-radius: 16px !important;
        background: #f5f5f5 !important;
        clip-path: none !important;
        font-size: 11px !important;
        line-height: 1.05 !important;
        text-align: center !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
    }

    .balam-inventory-view-tab::after {
        display: none !important;
    }

    .balam-inventory-view-tab.is-active {
        background: #c5f5c5 !important;
        color: #2fb426 !important;
    }

    .balam-export-actions {
        order: 3 !important;
        width: 100% !important;
        max-width: 330px !important;
        margin: 0 auto 18px !important;
        padding: 12px !important;
        box-sizing: border-box !important;
        border: 1px solid #333 !important;
        border-radius: 20px !important;
        background: rgba(255,255,255,.64) !important;
    }

    .balam-export-actions:empty {
        display: none !important;
    }

    .balam-export-actions .balam-btn {
        max-width: none !important;
        width: 100% !important;
        min-height: 40px !important;
        opacity: .86 !important;
        font-size: 12px !important;
    }

    .balam-filters-toggle-mobile,
    .balam-system-filters,
    .balam-front-filters {
        order: 4 !important;
    }

    .balam-front-table,
    .balam-system-map,
    .balam-block-card {
        order: 5 !important;
    }
}

@media (max-width: 420px) {
    .balam-tab-header .balam-front-title,
    .balam-inventory-view-tabs,
    .balam-export-actions {
        max-width: 310px !important;
    }

    .balam-inventory-view-tab {
        min-height: 40px !important;
        padding: 0 10px !important;
        font-size: 10px !important;
    }
}

/* ======================================================
   MOBILE LAYOUT REFINEMENT
   El titulo y los filtros no usan card en movil; las subtabs
   quedan como navegacion primaria sin superposiciones.
====================================================== */
@media (max-width: 768px) {
    .balam-tab-header .balam-front-title {
        width: 100% !important;
        max-width: 330px !important;
        margin: 0 auto 18px !important;
        padding: 0 !important;
        background: transparent !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
    }

    .balam-inventory-view-tabs {
        width: 100% !important;
        max-width: 330px !important;
        margin: 0 auto 18px !important;
        padding: 0 !important;
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
        overflow: visible !important;
        border: 0 !important;
    }

    .balam-inventory-view-tab {
        position: relative !important;
        z-index: auto !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        min-height: 40px !important;
        margin: 0 !important;
        padding: 0 10px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        border: 0 !important;
        border-radius: 18px !important;
        background: #f7f7f7 !important;
        clip-path: none !important;
        transform: none !important;
        box-shadow: none !important;
        color: #1f242b !important;
        font-size: 10.5px !important;
        line-height: 1.05 !important;
        text-align: center !important;
        white-space: normal !important;
        overflow: hidden !important;
        overflow-wrap: anywhere !important;
    }

    .balam-inventory-view-tab::before,
    .balam-inventory-view-tab::after {
        display: none !important;
        content: none !important;
    }

    .balam-inventory-view-tab.is-active {
        background: #c5f5c5 !important;
        color: #2fb426 !important;
        z-index: auto !important;
    }

    .balam-filters-toggle-mobile {
        width: 100% !important;
        max-width: 330px !important;
        min-height: auto !important;
        margin: 0 auto 16px !important;
        padding: 0 2px !important;
        background: transparent !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
    }

    .balam-system-filters.is-expanded,
    .balam-system-filters.is-active,
    .balam-front-filters.is-expanded,
    .balam-front-filters.is-active {
        padding: 0 !important;
        background: transparent !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
    }
}

@media (max-width: 420px) {
    .balam-tab-header .balam-front-title,
    .balam-inventory-view-tabs,
    .balam-filters-toggle-mobile {
        max-width: 310px !important;
    }
}

/* ======================================================
   MOBILE INVENTORY ORDER + WIDTH FIXES
   Mantiene titulo -> subtabs -> filtros/contenido en todas
   las vistas internas de Inventario.
====================================================== */
@media (max-width: 768px) {
    .balam-front-content {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
    }

    .balam-front-content > * {
        order: 20 !important;
    }

    .balam-front-content > .balam-tab-header {
        display: contents !important;
    }

    .balam-tab-header .balam-front-title {
        order: 1 !important;
        align-self: center !important;
    }

    .balam-front-content > .balam-inventory-view-tabs {
        order: 2 !important;
        width: 100% !important;
        max-width: 330px !important;
        margin: 0 auto 18px !important;
        padding: 0 !important;
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
        box-sizing: border-box !important;
        overflow: visible !important;
        border: 0 !important;
    }

    .balam-front-content > .balam-inventory-view-tabs .balam-inventory-view-tab {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        padding: 0 8px !important;
        overflow: hidden !important;
    }

    .balam-front-content > .balam-export-actions {
        order: 3 !important;
    }

    .balam-front-content > .balam-filters-toggle-mobile,
    .balam-front-content > .balam-front-filters,
    .balam-front-content > .balam-system-filters {
        order: 4 !important;
    }

    .balam-front-content > .balam-front-table,
    .balam-front-content > .balam-card,
    .balam-front-content > .balam-wms-page,
    .balam-front-content > .balam-wms-shell,
    .balam-front-content > .balam-block-card {
        order: 5 !important;
    }

    .balam-wms-page,
    .balam-wms-shell {
        width: 100% !important;
        margin-left: auto !important;
        margin-right: auto !important;
        box-sizing: border-box !important;
    }

    .balam-wms-page .balam-card {
        box-sizing: border-box !important;
        max-width: 100% !important;
    }

    .balam-metric-grid {
        grid-template-columns: 1fr !important;
    }

    .balam-metric-item {
        min-width: 0 !important;
        border-right: 0 !important;
        border-bottom: 1px solid #333 !important;
        padding: 14px 16px !important;
        box-sizing: border-box !important;
    }

    .balam-wms-map-toolbar {
        left: 12px !important;
        right: 12px !important;
        top: 12px !important;
        transform: none !important;
        width: auto !important;
        display: grid !important;
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }

    .balam-wms-map-toolbar button {
        min-width: 0 !important;
        padding: 0 6px !important;
        font-size: 10px !important;
    }

}

@media (max-width: 420px) {
    .balam-front-content > .balam-inventory-view-tabs,
    .balam-wms-page,
    .balam-wms-shell {
        max-width: 310px !important;
    }

}

/* ======================================================
   MOBILE INVENTORY INNER VIEWS
   Ajustes puntuales para vistas internas de Inventario.
====================================================== */
@media (max-width: 768px) {
    .balam-wms-shell {
        width: 100% !important;
        max-width: 330px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 16px !important;
    }

    .balam-wms-shell > aside {
        display: contents !important;
    }

    .balam-wms-shell > div {
        order: 2 !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    .balam-wms-shell > aside > .balam-card:first-child {
        order: 1 !important;
        width: 100% !important;
        max-width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 12px !important;
        box-sizing: border-box !important;
    }

    .balam-wms-search {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    .balam-wms-search .balam-label {
        display: block !important;
        margin-bottom: 6px !important;
    }

    .balam-wms-search .balam-input-lg {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }

    .balam-wms-shell > aside > .balam-card:first-child .balam-btn {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        justify-content: center !important;
    }

    .balam-wms-shell > aside > .balam-card:last-child {
        order: 3 !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

}

@media (max-width: 420px) {
    .balam-wms-shell {
        max-width: 310px !important;
    }
}

@media (max-width: 768px) {
    .balam-front-table.balam-table-cards tbody tr {
        display: grid !important;
        grid-template-columns: 118px minmax(0, 1fr) !important;
        grid-template-areas:
            "media primary"
            "media secondary"
            "footer-start footer-end"
            "footer footer" !important;
        grid-template-rows: auto auto auto auto !important;
        column-gap: 18px !important;
        row-gap: 10px !important;
        padding: 22px !important;
        max-width: 330px !important;
        box-sizing: border-box !important;
        align-items: start !important;
    }

    .balam-front-table.balam-table-cards tbody td {
        box-sizing: border-box !important;
        min-width: 0 !important;
        width: 100% !important;
    }

    .balam-front-table.balam-table-cards [data-card-slot="media"] {
        grid-area: media !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 12px !important;
        padding: 0 !important;
        margin-top: 0 !important;
    }

    .balam-front-table.balam-table-cards [data-card-slot="media"] img {
        width: 112px !important;
        height: 112px !important;
        object-fit: contain !important;
        border-radius: 14px !important;
    }

    .balam-front-table.balam-table-cards [data-card-slot="media"] .balam-mobile-only {
        margin: 0 !important;
        font-size: 18px !important;
        line-height: 1 !important;
    }

    .balam-front-table.balam-table-cards [data-card-slot="primary"] {
        grid-area: primary !important;
        padding: 0 !important;
        margin-top: 0 !important;
    }

    .balam-front-table.balam-table-cards [data-card-slot="secondary"] {
        grid-area: secondary !important;
        padding: 0 !important;
    }

    .balam-front-table.balam-table-cards .balam-inv-logistics {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 5px !important;
        width: 100% !important;
    }

    .balam-front-table.balam-table-cards .balam-inv-logistics-row {
        display: grid !important;
        grid-template-columns: 74px minmax(0, 1fr) !important;
        gap: 10px !important;
        align-items: start !important;
    }

    .balam-front-table.balam-table-cards .balam-inv-logistics-label {
        font-size: 10px !important;
        line-height: 1.2 !important;
        white-space: nowrap !important;
    }

    .balam-front-table.balam-table-cards .balam-inv-logistics-value {
        font-size: 12px !important;
        line-height: 1.25 !important;
        white-space: normal !important;
        overflow-wrap: normal !important;
        word-break: normal !important;
    }

    .balam-front-table.balam-table-cards [data-card-slot="footer-start"] {
        grid-area: footer-start !important;
        padding: 0 !important;
        margin: 0 !important;
        text-align: center !important;
    }

    .balam-front-table.balam-table-cards [data-card-slot="footer-end"] {
        grid-area: footer-end !important;
        padding: 0 !important;
        margin: 0 !important;
        text-align: center !important;
    }

    .balam-front-table.balam-table-cards [data-card-slot="footer"] {
        grid-area: footer !important;
        margin: 0 !important;
        padding: 0 !important;
        width: 100% !important;
    }

    .balam-front-table.balam-table-cards [data-card-slot="footer"] > .balam-actions-stack {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
        width: 100% !important;
    }

    .balam-front-table.balam-table-cards [data-card-slot="footer"] form,
    .balam-front-table.balam-table-cards [data-card-slot="footer"] .balam-btn {
        margin: 0 !important;
        width: 100% !important;
    }

    .balam-front-table.balam-table-cards [data-mobile-hidden] {
        display: none !important;
    }

    .balam-front-table.balam-table-cards .balam-inv-price-item {
        align-items: center !important;
        gap: 4px !important;
    }

    .balam-front-table.balam-table-cards .balam-inv-val-name {
        margin-top: 0 !important;
    }

    .balam-image-modal {
        padding: 16px !important;
        box-sizing: border-box !important;
    }

    .balam-image-modal img,
    .balam-image-modal-content {
        width: auto !important;
        max-width: calc(100vw - 32px) !important;
        max-height: calc(100vh - 96px) !important;
        padding: 12px !important;
        object-fit: contain !important;
        box-sizing: border-box !important;
    }

    .balam-front-table.balam-table-cards .balam-inv-type-characteristics {
        gap: 7px !important;
    }

    .balam-front-table.balam-table-cards .balam-type-badge {
        margin: 0 0 4px !important;
    }

    .balam-front-table.balam-table-cards .balam-inv-val-characteristics {
        margin-top: 0 !important;
    }

    .balam-front-table.balam-table-cards .balam-inv-price-item .balam-inv-label-mini,
    .balam-front-table.balam-table-cards .balam-inv-price-item .balam-inv-value {
        display: block !important;
        width: 100% !important;
        text-align: left !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .balam-front-table.balam-table-cards [data-card-slot="footer-start"],
    .balam-front-table.balam-table-cards [data-card-slot="footer-end"] {
        text-align: left !important;
    }
}

@media (max-width: 420px) {
    .balam-front-table.balam-table-cards tbody tr {
        grid-template-columns: 96px minmax(0, 1fr) !important;
        column-gap: 16px !important;
        padding: 20px !important;
    }

    .balam-front-table.balam-table-cards [data-card-slot="media"] img {
        width: 96px !important;
        height: 96px !important;
    }
}

/* Keep mobile typography consistent with the global renderer. */
.balam-front,
.balam-front * {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-synthesis-weight: none;
    text-rendering: geometricPrecision;
}

.balam-front,
.balam-front input,
.balam-front select,
.balam-front textarea,
.balam-front button,
.balam-front * {
    letter-spacing: 0 !important;
}

/* ======================================================
   MOBILE STABILITY PATCH
   Ajustes compartidos para evitar recortes y huecos en
   formularios/filtros sin tocar desktop.
====================================================== */
@media (max-width: 768px) {
    .balam-front-wrapper {
        padding-left: 8px !important;
        padding-right: 8px !important;
        padding-top: 56px !important;
    }

    .balam-front-header {
        display: none !important;
    }

    .balam-mobile-menu-floating {
        align-items: center !important;
        background: transparent !important;
        border: 0 !important;
        border-radius: 0 !important;
        cursor: pointer !important;
        display: flex !important;
        height: 42px !important;
        justify-content: center !important;
        left: 18px !important;
        padding: 0 !important;
        position: fixed !important;
        top: 18px !important;
        width: 42px !important;
        z-index: 9990 !important;
        -webkit-tap-highlight-color: transparent !important;
    }

    .balam-mobile-menu-floating .hamburger-icon {
        display: block !important;
        height: 20px !important;
        position: relative !important;
        width: 31px !important;
    }

    .balam-mobile-menu-floating .hamburger-icon span {
        background: #333 !important;
        border-radius: 999px !important;
        display: block !important;
        height: 3px !important;
        left: 0 !important;
        position: absolute !important;
        width: 100% !important;
    }

    .balam-mobile-menu-floating .hamburger-icon span:nth-child(1) {
        top: 0 !important;
    }

    .balam-mobile-menu-floating .hamburger-icon span:nth-child(2) {
        top: 9px !important;
    }

    .balam-mobile-menu-floating .hamburger-icon span:nth-child(3) {
        top: 18px !important;
    }

    body.no-scroll .balam-mobile-menu-floating {
        display: none !important;
    }

    .balam-front-content,
    .balam-front-content.balam-form-card {
        width: 100% !important;
        max-width: calc(100vw - 16px) !important;
        margin-left: auto !important;
        margin-right: auto !important;
        box-sizing: border-box !important;
    }

    .balam-front-content.balam-form-card,
    .balam-quote-form,
    .balam-front-content .balam-front-filters,
    .balam-front-content .balam-system-filters,
    .balam-client-selection-row,
    .balam-products-inputs {
        overflow: visible !important;
    }

    .balam-filters-toggle-mobile {
        width: 100% !important;
        max-width: min(390px, calc(100vw - 24px)) !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .balam-system-filters,
    .balam-front-filters {
        width: 100% !important;
        max-width: min(390px, calc(100vw - 24px)) !important;
        margin-left: auto !important;
        margin-right: auto !important;
        box-sizing: border-box !important;
    }

    .balam-system-filters.is-collapsed,
    .balam-system-filters.is-expanded,
    .balam-system-filters.is-active {
        display: flex !important;
        max-height: none !important;
        opacity: 1 !important;
        padding: 16px !important;
        margin-bottom: 20px !important;
        pointer-events: auto !important;
        overflow: visible !important;
    }

    .balam-filters-toggle-mobile .arrow-icon {
        transform: rotate(-135deg) !important;
        margin-bottom: -4px !important;
    }

    .balam-select {
        min-width: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    .balam-select-trigger {
        height: 33px !important;
        min-height: 32px !important;
        font-size: 12px !important;
        padding-left: 15px !important;
        padding-right: 15px !important;
    }

    .balam-select-panel {
        width: 100% !important;
        min-width: 100% !important;
        max-width: calc(100vw - 48px) !important;
        z-index: 10020 !important;
    }

    .balam-select-options {
        max-height: min(220px, 42vh) !important;
    }

    .balam-select-search {
        height: 38px !important;
        font-size: 14px !important;
    }

    .balam-select-option {
        min-height: 38px !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
        line-height: 1.25 !important;
    }

    .balam-quote-form .balam-quote-half-wrap,
    .balam-quote-form .balam-client-selection-row .balam-quote-half-wrap,
    .balam-quote-form .balam-client-selection-row .balam-select {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        display: block !important;
    }

    .balam-quote-form .balam-products-inputs {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
        align-items: start !important;
        align-content: start !important;
        gap: 16px 14px !important;
        margin-bottom: 18px !important;
        min-height: 0 !important;
        height: auto !important;
    }

    .balam-quote-form .balam-products-inputs > div,
    .balam-quote-form .balam-products-inputs > span,
    .balam-quote-form .balam-products-inputs .balam-quote-product-select-field {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        flex: none !important;
    }

    .balam-quote-form .balam-products-inputs > div:nth-child(1),
    .balam-quote-form .balam-products-inputs .balam-quote-product-select-field,
    .balam-quote-form .balam-products-inputs .balam-mobile-row-group,
    .balam-quote-form .balam-products-inputs .balam-stock-add-group {
        grid-column: 1 / -1 !important;
    }

    .balam-quote-form .balam-products-inputs .balam-mobile-row-group,
    .balam-quote-form .balam-products-inputs .balam-stock-add-group {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
        align-items: end !important;
        gap: 14px !important;
        margin: 0 !important;
        width: 100% !important;
    }

    .balam-quote-form .balam-products-inputs .balam-mobile-row-group > .balam-field,
    .balam-quote-form .balam-products-inputs .balam-stock-add-group > div {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        flex: none !important;
    }

    .balam-quote-form .balam-products-inputs .balam-stock-add-group > div:first-child {
        width: 100% !important;
    }

    .balam-quote-form .balam-products-inputs label {
        display: block !important;
        margin-bottom: 6px !important;
        text-align: center !important;
    }

    .balam-quote-form .balam-products-inputs .balam-custom-num-input,
    .balam-quote-form .balam-products-inputs #balam-stock-display,
    .balam-quote-form .balam-products-inputs .balam-btn {
        height: 42px !important;
        min-height: 42px !important;
    }

    .balam-quote-form .balam-products-inputs .balam-btn {
        width: 100% !important;
    }

    .balam-front-filters input[type="text"],
    .balam-front-filters input[type="search"],
    .balam-input-lg,
    input.balam-input-lg {
        height: 42px !important;
        min-height: 42px !important;
        line-height: 1.1 !important;
        padding: 0 18px !important;
        border: 1px solid #333 !important;
        border-radius: 999px !important;
        background-color: #fff !important;
        box-sizing: border-box !important;
        font-size: 14px !important;
        width: 100% !important;
    }

    .balam-front-filters .balam-select-trigger,
    .balam-system-filters .balam-select-trigger {
        border: 1px solid #333 !important;
        box-shadow: none !important;
    }

    .balam-front-content > .balam-inventory-view-tabs {
        display: none !important;
    }

    .nav-modal-accordion {
        border-bottom: 1px solid #f0f0f0;
    }

    .nav-modal-content {
        display: flex !important;
        flex-direction: column !important;
    }

    .nav-modal-brand-header {
        align-items: center;
        background: #333;
        color: #fff;
        display: flex;
        flex: 0 0 auto;
        font-family: "Feature Mono", "DM Sans", system-ui, sans-serif;
        font-size: 14px;
        font-weight: 800;
        justify-content: space-between;
        letter-spacing: 0 !important;
        min-height: 72px;
        padding: 16px 20px;
        box-sizing: border-box;
    }

    .nav-modal-brand-header img {
        height: 28px;
        width: auto;
        object-fit: contain;
    }

    .balam-mobile-nav-modal .nav-modal-body {
        flex: 1 1 auto !important;
        padding-top: 0 !important;
    }

    .nav-modal-accordion-toggle {
        appearance: none !important;
        -webkit-appearance: none !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-sizing: content-box !important;
        color: #333 !important;
        min-height: 31px !important;
        padding: 6px 16px !important;
        width: 100% !important;
        justify-content: space-between !important;
        text-align: left !important;
        cursor: pointer !important;
        font-family: "DM Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
        font-size: 12px !important;
        font-weight: 800 !important;
        line-height: 1 !important;
    }

    .balam-mobile-nav-modal .nav-modal-content .nav-modal-accordion-toggle.active,
    .nav-modal-accordion-toggle.active {
        background: #2e7d32 !important;
        border-left: 0 !important;
        color: #fff !important;
    }

    .nav-modal-accordion-title {
        display: inline-flex !important;
        align-items: center !important;
        font-family: "DM Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
        font-weight: 600 !important;
        gap: 3px !important;
        min-width: 0 !important;
    }

    .nav-modal-accordion-chevron {
        align-self: center;
        width: 8px;
        height: 8px;
        border-right: 2px solid currentColor;
        border-bottom: 2px solid currentColor;
        transform: rotate(45deg);
        transition: transform .18s ease;
        flex: 0 0 auto;
        margin: 0 2px 0 0;
    }

    .nav-modal-accordion.is-open .nav-modal-accordion-chevron {
        transform: rotate(225deg);
    }

    .nav-modal-submenu {
        display: none;
        background: #fbfbfb;
        padding: 5px 0 7px;
    }

    .nav-modal-accordion.is-open .nav-modal-submenu {
        display: block;
    }

    .nav-modal-sublink {
        align-items: center;
        color: #909090 !important;
        display: flex;
        font-size: 11px;
        font-weight: 800;
        min-height: 32px;
        padding: 6px 18px 6px 46px;
        text-decoration: none !important;
        text-transform: uppercase;
        line-height: 1.15;
    }

    .nav-modal-sublink.is-active {
        color: #2f8a1f !important;
        background: #eafbe7;
    }

    .nav-modal-user-panel {
        border-top: 1px solid #ececec;
        display: grid;
        gap: 12px;
        margin-bottom: 14px;
        padding: 12px 0 4px;
    }

    .nav-modal-user-row {
        align-items: center;
        display: flex;
        gap: 10px;
        text-align: left;
    }

    .nav-modal-user-icon {
        filter: grayscale(100%);
        flex: 0 0 auto;
        height: 22px;
        object-fit: contain;
        opacity: .9;
        width: 22px;
    }

    .nav-modal-user-row .greeting {
        color: #333;
        font-size: 13px;
        font-weight: 800;
        line-height: 1.05;
    }

}

@media (max-width: 1024px) {
    .balam-tab-header .balam-title-desktop-label {
        display: none !important;
    }

    .balam-tab-header .balam-title-mobile-label {
        display: inline !important;
    }

    .balam-front-content .balam-inventory-view-tabs,
    .balam-front-content > .balam-inventory-view-tabs,
    .balam-system-map .balam-system-view-tabs,
    .balam-system-map-toolbar .balam-system-view-tabs {
        display: none !important;
    }

    .balam-mobile-nav-modal .nav-modal-brand-header {
        font-size: 20px !important;
        min-height: 86px !important;
        padding: 20px 22px !important;
    }

    .balam-mobile-nav-modal .nav-modal-brand-header img {
        height: 36px !important;
        max-width: 120px !important;
    }

    .balam-front-table.balam-preinvoices-table td.balam-preinvoice-folio-cell {
        align-items: center !important;
        flex: 0 0 auto !important;
        order: 1 !important;
        text-align: center !important;
        width: auto !important;
    }

}

@media (max-width: 768px) {
    .balam-front .balam-mobile-menu-floating {
        display: none !important;
    }

    .balam-front-content {
        position: relative !important;
    }

    .balam-tablet-title-menu {
        align-items: center !important;
        background: transparent !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        cursor: pointer !important;
        display: flex !important;
        height: 34px !important;
        justify-content: center !important;
        left: calc(50% - 150px) !important;
        margin: 0 !important;
        padding: 0 !important;
        position: absolute !important;
        top: 0 !important;
        width: 34px !important;
        z-index: 8 !important;
        -webkit-appearance: none !important;
        appearance: none !important;
        -webkit-tap-highlight-color: transparent !important;
    }

    .balam-tablet-title-menu .hamburger-icon {
        display: block !important;
        height: 18px !important;
        position: relative !important;
        width: 28px !important;
    }

    .balam-tablet-title-menu .hamburger-icon span {
        background: #333 !important;
        border: 0 !important;
        border-radius: 999px !important;
        display: block !important;
        height: 2.5px !important;
        left: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        position: absolute !important;
        width: 100% !important;
    }

    .balam-tablet-title-menu .hamburger-icon span:nth-child(1) {
        top: 0 !important;
    }

    .balam-tablet-title-menu .hamburger-icon span:nth-child(2) {
        top: 8px !important;
    }

    .balam-tablet-title-menu .hamburger-icon span:nth-child(3) {
        top: 16px !important;
    }

    .balam-tab-header .balam-front-title {
        align-items: center !important;
        background: transparent !important;
        border-radius: 0 !important;
        justify-content: flex-start !important;
        margin: 0 auto 18px !important;
        font-size: clamp(21px, 6.2vw, 25px) !important;
        min-height: 34px !important;
        padding: 0 0 0 42px !important;
        text-align: left !important;
    }
}

@media (max-width: 420px) {
    .balam-tablet-title-menu {
        left: calc(50% - 142px) !important;
    }
}

@media (max-width: 768px) {
    .balam-front-wrapper {
        padding-top: 28px !important;
    }

    .balam-front-content {
        padding-top: 0 !important;
    }

    .balam-tablet-title-menu {
        left: 8px !important;
        top: 1px !important;
    }

    .balam-tab-header .balam-front-title {
        display: grid !important;
        grid-template-columns: auto auto !important;
        column-gap: 8px !important;
        align-items: center !important;
        justify-content: end !important;
        width: calc(100vw - 88px) !important;
        max-width: 330px !important;
        min-height: 34px !important;
        margin: 0 auto 18px !important;
        padding: 0 0 0 64px !important;
        font-size: clamp(15px, 4.7vw, 19px) !important;
        line-height: 1.05 !important;
        text-align: right !important;
    }

    .balam-tab-header .balam-front-title-icon {
        justify-self: end !important;
        width: 20px !important;
        height: 20px !important;
    }

    .balam-tab-header .balam-front-title-icon svg {
        width: 19px !important;
        height: 19px !important;
    }

    .balam-tab-header .balam-front-title .balam-title-mobile-label {
        display: block !important;
        justify-self: end !important;
        text-align: right !important;
    }
}

@media (max-width: 420px) {
    .balam-tablet-title-menu {
        left: 8px !important;
    }
}

@media (max-width: 768px) {
    .balam-front-content .balam-tab-pagination.is-top {
        display: none !important;
    }

    .balam-front-wrapper {
        padding-top: 10px !important;
    }

    .balam-front-content .balam-mobile-action-toolbar {
        order: 2 !important;
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
        width: 100% !important;
        max-width: 330px !important;
        margin: 0 auto 16px !important;
        padding: 0 !important;
        background: transparent !important;
        border: 0 !important;
    }

    .balam-front-content .balam-mobile-action-toolbar .balam-mobile-action-btn {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 42px !important;
        padding: 10px 14px !important;
        background: #b9cbd8 !important;
        border: 1px solid #333333 !important;
        border-radius: 999px !important;
        color: #333 !important;
        font-size: 12px !important;
        font-weight: 800 !important;
        text-align: center !important;
        line-height: 1.1 !important;
        white-space: normal !important;
        text-wrap: balance !important;
    }

    .balam-front-content .balam-mobile-action-toolbar .balam-mobile-action-btn.color-grey {
        background: #FFFFFF !important;
        border-color: #333333 !important;
        color: #333 !important;
    }

    .balam-front-content .balam-mobile-action-toolbar .balam-mobile-action-btn.color-blue {
        background: #618c8b !important;
        border-color: #618c8b !important;
        color: #ffffff !important;
    }

    .balam-front-content > .balam-filters-toggle-mobile,
    .balam-front-content > .balam-front-filters,
    .balam-front-content > .balam-system-filters,
    .balam-front-content .balam-filters-toggle-mobile,
    .balam-front-content .balam-front-filters,
    .balam-front-content .balam-system-filters {
        order: 3 !important;
    }
}

@media (max-width: 768px) {
    .balam-front-content .balam-filters-toggle-mobile {
        width: 100% !important;
        max-width: 330px !important;
        margin: 6px auto 0 !important;
        padding: 16px 18px !important;
        background: #fff !important;
        border: 0 !important;
        border-radius: 18px 18px 0 0 !important;
        box-sizing: border-box !important;
    }

    .balam-front-content .balam-filters-toggle-mobile:not(.is-open) {
        border-radius: 15px !important;
        margin-bottom: 20px !important;
    }

    .balam-front-content .balam-system-filters,
    .balam-front-content .balam-front-filters {
        width: 100% !important;
        max-width: 330px !important;
        margin: 0 auto 20px !important;
        box-sizing: border-box !important;
        background: #fff !important;
        border: 0 !important;
        border-radius: 0 0 18px 18px !important;
    }

    .balam-front-content .balam-system-filters.is-collapsed,
    .balam-front-content .balam-front-filters.is-collapsed,
    .balam-front-content .balam-system-filters.is-active:not(.is-expanded),
    .balam-front-content .balam-front-filters.is-active:not(.is-expanded) {
        display: none !important;
        max-height: 0 !important;
        opacity: 0 !important;
        overflow: hidden !important;
        padding: 0 !important;
        margin: 0 auto 20px !important;
        pointer-events: none !important;
    }

    .balam-front-content .balam-system-filters.is-expanded,
    .balam-front-content .balam-front-filters.is-expanded {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        gap: 10px !important;
        max-height: none !important;
        opacity: 1 !important;
        overflow: visible !important;
        padding: 0 16px 16px !important;
        pointer-events: auto !important;
    }

    .balam-front-content .balam-filters-toggle-mobile .arrow-icon {
        transform: rotate(45deg) !important;
        margin-bottom: 4px !important;
    }

    .balam-front-content .balam-filters-toggle-mobile.is-open .arrow-icon {
        transform: rotate(-135deg) !important;
        margin-bottom: -4px !important;
    }

    .balam-front-content .balam-system-filters.is-expanded input,
    .balam-front-content .balam-system-filters.is-expanded select,
    .balam-front-content .balam-front-filters.is-expanded input,
    .balam-front-content .balam-front-filters.is-expanded select,
    .balam-front-content .balam-system-filters.is-expanded .balam-select-trigger,
    .balam-front-content .balam-front-filters.is-expanded .balam-select-trigger {
        border: 1px solid #333 !important;
        background-color: #fff !important;
    }

    .balam-front-content .balam-system-filters.is-expanded input,
    .balam-front-content .balam-system-filters.is-expanded select,
    .balam-front-content .balam-front-filters.is-expanded input,
    .balam-front-content .balam-front-filters.is-expanded select,
    .balam-front-content .balam-system-filters.is-expanded .balam-select,
    .balam-front-content .balam-front-filters.is-expanded .balam-select {
        flex: 0 0 100% !important;
        width: 100% !important;
    }

    .balam-front-content .balam-system-filters.is-expanded button[type="submit"].balam-btn,
    .balam-front-content .balam-front-filters.is-expanded button[type="submit"].balam-btn,
    .balam-front-content .balam-system-filters.is-expanded .balam-clear-filters-btn,
    .balam-front-content .balam-front-filters.is-expanded .balam-clear-filters-btn {
        width: calc(50% - 5px) !important;
        min-width: 0 !important;
        max-width: none !important;
        height: 38px !important;
        min-height: 38px !important;
        margin-top: 2px !important;
    }

    .balam-front-content .balam-system-filters.is-expanded button[type="submit"].balam-btn,
    .balam-front-content .balam-front-filters.is-expanded button[type="submit"].balam-btn {
        display: inline-flex !important;
    }

    .balam-front-content .balam-system-filters.is-expanded .balam-clear-filters-btn,
    .balam-front-content .balam-front-filters.is-expanded .balam-clear-filters-btn {
        display: inline-flex !important;
    }
}

@media (max-width: 768px) {
    .balam-minimum-alerts-table td[data-label=""]::before {
        display: none !important;
        content: none !important;
        margin: 0 !important;
    }

    .balam-minimum-alerts-table .balam-inv-val-name {
        margin-bottom: 12px !important;
    }

    .balam-minimum-alerts-table .balam-type-badge {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }

    .balam-minimum-alerts-table .balam-inv-val-characteristics {
        margin-top: 0 !important;
    }
}

@media (max-width: 768px) {
    .balam-clients-wrapper,
    .balam-clients-wrapper .balam-front-table.balam-clients-table,
    .balam-clients-wrapper .balam-front-table.balam-clients-table tbody {
        width: 100% !important;
        max-width: 330px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        display: block !important;
        box-sizing: border-box !important;
    }

    .balam-clients-wrapper .balam-front-table.balam-clients-table tr {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 8px !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 0 16px !important;
        padding: 18px 20px !important;
        box-sizing: border-box !important;
        border-radius: 18px !important;
    }

    .balam-clients-wrapper .balam-front-table.balam-clients-table td {
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 auto !important;
        margin: 0 !important;
        padding: 0 !important;
        gap: 3px !important;
        box-sizing: border-box !important;
        line-height: 1.2 !important;
        text-align: left !important;
    }

    .balam-clients-wrapper .balam-front-table.balam-clients-table td::before {
        display: block !important;
        content: attr(data-label) !important;
        margin: 0 !important;
        color: #8d8d8d !important;
        font-size: 10px !important;
        font-weight: 800 !important;
        letter-spacing: .08em !important;
        line-height: 1 !important;
        text-transform: uppercase !important;
    }

    .balam-clients-wrapper .balam-front-table.balam-clients-table td[data-label="ID"] {
        display: none !important;
    }

    .balam-clients-wrapper .balam-front-table.balam-clients-table td[data-label="Nombre"],
    .balam-clients-wrapper .balam-front-table.balam-clients-table .balam-clients-name-col {
        order: 1 !important;
        font-size: 17px !important;
        font-weight: 800 !important;
        color: #333 !important;
        margin-bottom: 2px !important;
    }

    .balam-clients-wrapper .balam-front-table.balam-clients-table td[data-label=""]::before {
        display: none !important;
        content: none !important;
    }

    .balam-clients-wrapper .balam-client-card-id {
        display: block !important;
        color: #666 !important;
        font-size: 12px !important;
        font-weight: 700 !important;
        line-height: 1 !important;
        margin-bottom: 4px !important;
    }

    .balam-clients-wrapper .balam-client-card-name {
        display: block !important;
    }

    .balam-clients-wrapper .balam-front-table.balam-clients-table td[data-label="Estado"],


    .balam-clients-wrapper .balam-front-table.balam-clients-table td[data-label="Contacto"],


    .balam-clients-wrapper .balam-front-table.balam-clients-table td[data-label="Email"],


    .balam-clients-wrapper .balam-front-table.balam-clients-table td[data-label="Vendedor"],


    .balam-clients-wrapper .balam-front-table.balam-clients-table td[data-label="Cotizaciones / Pedidos"] {
        font-size: 13px !important;
        font-weight: 500 !important;
        color: #333 !important;
    }

    .balam-clients-wrapper .balam-front-table.balam-clients-table td[data-label="Estado"] {
        order: 3 !important;
    }

    .balam-clients-wrapper .balam-front-table.balam-clients-table .balam-clients-quotes-col {
        order: 4 !important;
    }


    .balam-clients-wrapper .balam-front-table.balam-clients-table .balam-clients-quotes-col {
        flex-direction: row !important;
        flex-wrap: wrap !important;
        gap: 3px !important;
        padding-top: 2px !important;
    }

    .balam-clients-wrapper .balam-front-table.balam-clients-table .balam-clients-quotes-col::before {
        display: none !important;
        content: none !important;
    }

    .balam-clients-wrapper .balam-front-table.balam-clients-table td[data-label="Acciones"] {
        order: 6 !important;
        width: 100% !important;
        flex: 0 0 auto !important;
        margin-top: 4px !important;
    }

    .balam-clients-wrapper .balam-front-table.balam-clients-table td[data-label="Acciones"]::before {
        display: none !important;
        content: none !important;
    }

    .balam-clients-wrapper .balam-clients-actions-inline {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
        width: 100% !important;
        margin: 0 !important;
        align-items: stretch !important;
    }

    .balam-clients-wrapper .balam-clients-actions-inline .balam-btn {
        width: 100% !important;
        min-height: 36px !important;
        padding: 0 14px !important;
        justify-content: center !important;
    }

    .balam-clients-wrapper .balam-clients-mobile-actions {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: stretch !important;
        justify-content: stretch !important;
        gap: 10px !important;
        width: 100% !important;
        max-width: 330px !important;
        margin: 0 auto 20px !important;
        padding: 0 !important;
        background: transparent !important;
        border: 0 !important;
        box-sizing: border-box !important;
    }

    .balam-clients-wrapper .balam-clients-mobile-actions .balam-btn {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        min-height: 42px !important;
        padding: 10px 14px !important;
        background: #b9cbd8 !important;
        border: 1px solid #333333 !important;
        border-radius: 999px !important;
        color: #333 !important;
        font-size: 12px !important;
        font-weight: 800 !important;
        line-height: 1.1 !important;
        justify-content: center !important;
        text-align: center !important;
        white-space: normal !important;
        text-wrap: balance !important;
    }

    .balam-clients-wrapper .balam-clients-mobile-actions .balam-btn.color-grey {
        background: #FFFFFF !important;
        border-color: #333333 !important;
        color: #333 !important;
    }

    .balam-clients-wrapper .balam-clients-export-actions {
        display: none !important;
    }

    .balam-clients-wrapper .balam-clients-export-actions .balam-btn:last-child {
        min-width: 178px !important;
    }

    .balam-clients-wrapper .balam-clients-filters.is-expanded {
        display: flex !important;
        flex-direction: column !important;
        flex-wrap: nowrap !important;
        align-items: stretch !important;
        gap: 10px !important;
        overflow: visible !important;
    }

    .balam-clients-wrapper .balam-clients-filters.is-expanded .balam-filters-controls,
    .balam-clients-wrapper .balam-clients-filters.is-expanded .balam-clients-filter-layout,
    .balam-clients-wrapper .balam-clients-filters.is-expanded .balam-clients-filter-fields,
    .balam-clients-wrapper .balam-clients-filters.is-expanded .balam-filters-row,
    .balam-clients-wrapper .balam-clients-filters.is-expanded .balam-clients-secondary-row {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 10px !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }

    .balam-clients-wrapper .balam-clients-filters.is-expanded input,
    .balam-clients-wrapper .balam-clients-filters.is-expanded select,
    .balam-clients-wrapper .balam-clients-filters.is-expanded .balam-select,
    .balam-clients-wrapper .balam-clients-filters.is-expanded .balam-select-trigger {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        flex: 0 0 auto !important;
        box-sizing: border-box !important;
    }

    .balam-clients-wrapper .balam-clients-filters.is-expanded input[name="q"] {
        min-height: 42px !important;
        padding: 0 18px !important;
        border-radius: 999px !important;
    }
}

@media (max-width: 768px) {
    .balam-front-content.balam-client-form-content {
        width: 100% !important;
        max-width: 330px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        background: transparent !important;
        border: 0 !important;
        box-sizing: border-box !important;
    }

    .balam-front-content.balam-client-form-content .balam-client-form-wrapper,
    .balam-front-content.balam-client-form-content .balam-client-form,
    .balam-front-content.balam-client-form-content .balam-client-form .balam-client-form-panel,
    .balam-front-content.balam-client-form-content .balam-client-form .balam-card {
        width: 100% !important;
        max-width: 100% !important;
    }

    .balam-clients-wrapper.balam-client-form-wrapper {
        width: 100% !important;
        max-width: min(380px, calc(100vw - 24px)) !important;
        margin-left: auto !important;
        margin-right: auto !important;
        display: block !important;
        box-sizing: border-box !important;
    }

    .balam-front-content .balam-client-form {
        width: 100% !important;
        max-width: min(360px, calc(100vw - 48px)) !important;
        margin: 0 auto !important;
        box-sizing: border-box !important;
    }

    .balam-front-content .balam-client-form .balam-client-form-panel,
    .balam-front-content .balam-client-form .balam-card {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 auto 20px !important;
        padding: 18px !important;
        background: #fff !important;
        border: 0 !important;
        border-radius: 18px !important;
        box-shadow: none !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
    }

    .balam-front-content .balam-client-form .balam-client-form-panel > div:first-of-type,
    .balam-front-content .balam-client-form .balam-card > div:first-of-type {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        gap: 12px !important;
        align-items: center !important;
        margin-bottom: 16px !important;
    }

    .balam-front-content .balam-client-form .balam-section-title {
        margin: 0 !important;
        color: #333 !important;
        font-size: 18px !important;
        font-weight: 900 !important;
        line-height: 1.05 !important;
        text-transform: uppercase !important;
        letter-spacing: 0 !important;
    }

    .balam-front-content .balam-client-form .balam-client-form-panel > div:first-of-type .balam-btn,
    .balam-front-content .balam-client-form .balam-card > div:first-of-type .balam-btn {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        min-width: 98px !important;
        min-height: 36px !important;
        padding: 0 14px !important;
        background: #b9cbd8 !important;
        border: 0 !important;
        border-radius: 999px !important;
        color: #333 !important;
        font-size: 12px !important;
        font-weight: 900 !important;
        text-decoration: none !important;
        white-space: nowrap !important;
    }

    .balam-front-content .balam-client-form .balam-front-filters.balam-system-filters {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 10px !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 0 12px !important;
        padding: 0 !important;
        background: transparent !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-sizing: border-box !important;
        overflow: visible !important;
    }

    .balam-front-content .balam-client-form .balam-front-filters.balam-system-filters > *,
    .balam-front-content .balam-client-form .balam-client-name-rfc-name,
    .balam-front-content .balam-client-form .balam-client-name-rfc-rfc {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        flex: 0 0 auto !important;
        box-sizing: border-box !important;
    }

    .balam-front-content .balam-client-form .balam-input-lg,
    .balam-front-content .balam-client-form input.balam-input-lg,
    .balam-front-content .balam-client-form select.balam-input-lg,
    .balam-front-content .balam-client-form textarea.balam-input-lg {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        min-height: 42px !important;
        padding: 0 16px !important;
        background: #fff !important;
        border: 1px solid #333 !important;
        border-radius: 999px !important;
        box-sizing: border-box !important;
        font-size: 14px !important;
    }

    .balam-front-content .balam-client-form .balam-select {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        flex: 0 0 auto !important;
        box-sizing: border-box !important;
    }

    .balam-front-content .balam-client-form .balam-select-trigger {
        width: 100% !important;
        max-width: 100% !important;
        min-height: 42px !important;
        height: 42px !important;
        padding: 0 16px !important;
        background: #fff !important;
        border: 1px solid #333 !important;
        border-radius: 999px !important;
        box-sizing: border-box !important;
        color: #666 !important;
        font-size: 14px !important;
        font-weight: 700 !important;
    }

    .balam-front-content .balam-client-form .balam-select-panel {
        width: 100% !important;
        min-width: 100% !important;
        max-width: min(320px, calc(100vw - 84px)) !important;
        box-sizing: border-box !important;
    }

    .balam-front-content .balam-client-form textarea.balam-input-lg {
        min-height: 94px !important;
        padding: 14px 16px !important;
        border-radius: 18px !important;
    }

    .balam-front-content .balam-client-form .balam-subsection-title {
        margin: 20px 0 10px !important;
        color: #333 !important;
        font-size: 15px !important;
        font-weight: 900 !important;
        line-height: 1.1 !important;
        text-transform: uppercase !important;
    }

    .balam-front-content .balam-client-form .balam-client-free-price-control {
        display: grid !important;
        grid-template-columns: 20px minmax(0, 1fr) !important;
        gap: 10px !important;
        align-items: center !important;
        width: 100% !important;
        margin: 0 0 12px !important;
        padding: 0 !important;
        background: transparent !important;
        border-radius: 0 !important;
        box-sizing: border-box !important;
        font-size: 12px !important;
        line-height: 1.2 !important;
    }

    .balam-front-content .balam-client-form .balam-client-assigned-seller-control {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 0 16px !important;
        padding: 0 !important;
        background: transparent !important;
        border-radius: 0 !important;
        box-sizing: border-box !important;
    }

    .balam-front-content .balam-client-form .balam-file-picker-control {
        width: 100% !important;
        max-width: 100% !important;
        min-height: 42px !important;
        padding: 4px !important;
        border: 1px solid #333 !important;
        border-radius: 999px !important;
        background: #fff !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
    }

    .balam-front-content .balam-client-form .balam-file-picker-button {
        min-width: 145px !important;
        height: 34px !important;
        border-radius: 999px !important;
        font-size: 11px !important;
    }

    .balam-front-content .balam-client-form .balam-file-picker-name {
        min-width: 0 !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    .balam-front-content .balam-client-form .balam-client-edit-footer,
    .balam-front-content .balam-client-form .balam-client-edit-footer-left,
    .balam-front-content .balam-client-form .balam-client-edit-footer-right {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
        width: 100% !important;
        margin: 14px 0 0 !important;
        align-items: stretch !important;
    }

    .balam-front-content .balam-client-form .balam-client-edit-footer-left:empty {
        display: none !important;
    }

    .balam-front-content .balam-client-form .balam-client-edit-footer-right {
        grid-column: 1 / -1 !important;
    }

    .balam-front-content .balam-client-form .balam-client-edit-footer .balam-btn {
        width: 100% !important;
        min-height: 38px !important;
        justify-content: center !important;
    }
}

@media (max-width: 1024px) {
    .balam-mobile-nav-modal,
    .balam-mobile-nav-modal * {
        box-sizing: border-box !important;
    }

    .balam-mobile-nav-modal .nav-modal-content {
        overflow-x: hidden !important;
        overscroll-behavior-x: none !important;
    }

    .balam-mobile-nav-modal .nav-modal-body {
        overflow-x: hidden !important;
        overflow-y: auto !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    .balam-mobile-nav-modal .nav-group,
    .balam-mobile-nav-modal .nav-modal-accordion,
    .balam-mobile-nav-modal .nav-modal-submenu {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        overflow-x: hidden !important;
    }

    .balam-mobile-nav-modal .nav-modal-link,
    .balam-mobile-nav-modal .nav-modal-accordion-toggle,
    .balam-mobile-nav-modal .nav-modal-sublink {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        overflow-x: hidden !important;
    }

    .balam-mobile-nav-modal .nav-modal-accordion-toggle {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 18px !important;
        align-items: center !important;
        gap: 8px !important;
        padding-right: 18px !important;
    }

    .balam-mobile-nav-modal .nav-modal-accordion-title {
        min-width: 0 !important;
        max-width: 100% !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    .balam-mobile-nav-modal .nav-modal-accordion-chevron {
        justify-self: end !important;
        margin-right: 0px !important;
    }
}

@media (max-width: 768px) {
    .balam-form {
        min-height: 0 !important;
        overflow: hidden !important;
    }

    .balam-tab-panel.is-active {
        min-height: 0 !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        padding-right: 4px !important;
        -webkit-overflow-scrolling: touch !important;
    }

    .balam-tabs {
        align-items: stretch !important;
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 8px !important;
        margin: 0 0 8px !important;
        overflow: visible !important;
        padding: 2px 0 0 !important;
        width: 100% !important;
    }

    .balam-tab {
        align-items: center !important;
        display: inline-flex !important;
        flex: 1 1 auto !important;
        justify-content: center !important;
        min-width: 0 !important;
        min-height: 34px !important;
        padding: 4px 0 10px !important;
        line-height: 1.05 !important;
        white-space: normal !important;
        overflow: visible !important;
        text-align: center !important;
    }

    .balam-client-detail-head .balam-client-seller-badge {
        flex: 0 1 auto !important;
        width: auto !important;
        max-width: 150px !important;
        box-sizing: border-box !important;
        border-radius: 999px !important;
        padding: 7px 10px !important;
        white-space: nowrap !important;
    }

    .balam-tab-panel[data-client-panel="data"] > div:first-child {
        grid-template-columns: 110px minmax(0, 1fr) !important;
        column-gap: 10px !important;
        row-gap: 6px !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        overflow-wrap: anywhere !important;
    }

    .balam-tab-panel[data-client-panel="data"] > div:first-child > div {
        min-width: 0 !important;
        overflow-wrap: anywhere !important;
    }

    .balam-tab-panel[data-client-panel="data"] > div:first-child > div:nth-child(2n) {
        font-size: 14px !important;
        line-height: 1.15 !important;
    }

}

@media (max-width: 768px) {
    .balam-projects-content {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        width: 100% !important;
        max-width: none !important;
        overflow: visible !important;
    }

    .balam-projects-content > .balam-filters-toggle-mobile,
    .balam-projects-content > .balam-projects-filters,
    .balam-projects-content > .balam-tab-pagination.is-top,
    .balam-projects-content > .balam-front-table,
    .balam-projects-content > .balam-notice,
    .balam-projects-content > .balam-tab-pagination.is-bottom {
        flex: 0 0 auto !important;
        width: calc(100vw - 86px) !important;
        max-width: 328px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        box-sizing: border-box !important;
    }

    .balam-projects-content > .balam-projects-filters {
        padding: 18px !important;
        margin-bottom: 24px !important;
        overflow: visible !important;
    }

    .balam-projects-content > .balam-tab-pagination.is-top {
        display: block !important;
        margin-top: 0 !important;
        margin-bottom: 12px !important;
        order: 3 !important;
    }

    .balam-projects-content > .balam-front-table {
        order: 4 !important;
    }

    .balam-projects-content > .balam-tab-pagination.is-bottom {
        display: none !important;
    }

    .balam-projects-content > .balam-projects-filters.is-collapsed:not(.is-expanded):not(.is-active) {
        height: 0 !important;
        min-height: 0 !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        margin-bottom: 0 !important;
        overflow: hidden !important;
    }

    .balam-projects-content > .balam-projects-filters.is-expanded,
    .balam-projects-content > .balam-projects-filters.is-active {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: visible !important;
    }

    .balam-projects-content .balam-projects-filters .balam-filters-controls,
    .balam-projects-content .balam-projects-filters .balam-filters-row {
        display: flex !important;
        flex-direction: column !important;
        flex-wrap: nowrap !important;
        align-items: stretch !important;
        gap: 10px !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        overflow: visible !important;
    }

    .balam-projects-content form.balam-projects-filters .balam-filters-row > select,
    .balam-projects-content form.balam-projects-filters .balam-filters-row > .balam-select,
    .balam-projects-content form.balam-projects-filters .balam-filters-row.search-row > input[name="q"],
    .balam-projects-content form.balam-projects-filters .balam-filters-row.search-row > .balam-select,
    .balam-projects-content form.balam-projects-filters .balam-filters-row.search-row > .balam-clear-filters-btn {
        flex: 0 0 42px !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }

    .balam-projects-content .balam-projects-filters input,
    .balam-projects-content .balam-projects-filters select,
    .balam-projects-content .balam-projects-filters .balam-select,
    .balam-projects-content .balam-projects-filters .balam-select-trigger {
        flex: 0 0 auto !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: 42px !important;
        min-height: 42px !important;
        border-radius: 999px !important;
        box-sizing: border-box !important;
    }

    .balam-projects-content form.balam-projects-filters .balam-filters-row.search-row input[name="q"] {
        flex-basis: 42px !important;
        line-height: 1.1 !important;
        padding: 0 18px !important;
        background-image: none !important;
    }

    .balam-projects-content .balam-projects-filters .balam-select {
        position: relative !important;
        overflow: visible !important;
        z-index: 1 !important;
    }

    .balam-projects-content .balam-projects-filters .balam-select.is-open {
        z-index: 1000 !important;
    }

    .balam-projects-content .balam-projects-filters .balam-select.is-open .balam-select-panel {
        width: 100% !important;
        max-width: 100% !important;
        z-index: 9999 !important;
    }

    .balam-projects-content .balam-projects-filters .balam-select-search {
        flex: 0 0 40px !important;
        height: 40px !important;
        min-height: 40px !important;
        width: 100% !important;
        max-width: 100% !important;
        border-radius: 999px !important;
        background-image: none !important;
    }

    .balam-projects-content .balam-projects-filters button[type="submit"].balam-btn {
        align-self: flex-start !important;
        display: inline-flex !important;
        width: 142px !important;
        max-width: 100% !important;
        height: 40px !important;
        min-height: 40px !important;
    }

    .balam-projects-content > .balam-front-table,
    .balam-projects-content > .balam-front-table tbody {
        display: block !important;
        width: calc(100vw - 86px) !important;
        max-width: 328px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        overflow: visible !important;
        white-space: normal !important;
    }

    .balam-projects-content > .balam-front-table tbody tr {
        width: 100% !important;
        max-width: 328px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        box-sizing: border-box !important;
    }

    .balam-projects-content > .balam-front-table td {
        white-space: normal !important;
        overflow-wrap: anywhere !important;
    }

    .balam-projects-content > .balam-front-table td[data-label="Proyecto"] {
        order: 1 !important;
        width: 100% !important;
        flex: 1 1 100% !important;
        margin: 0 0 8px !important;
    }

    .balam-projects-content > .balam-front-table td[data-label="Proyecto"] strong {
        display: block !important;
        font-size: 17px !important;
        font-weight: 800 !important;
        line-height: 1.2 !important;
        color: #333 !important;
    }

    .balam-projects-content .balam-project-mobile-folio,
    .balam-projects-content .balam-project-mobile-date {
        display: block !important;
        width: 100% !important;
        font-size: 12px !important;
        font-weight: 700 !important;
        line-height: 1.2 !important;
        color: #777 !important;
        margin-top: 4px !important;
    }

    .balam-projects-content > .balam-front-table td[data-label="Cliente / Estado / Vendedor"] {
        order: 2 !important;
        width: 100% !important;
        flex: 1 1 100% !important;
        margin: 0 0 10px !important;
    }

    .balam-projects-content .balam-client-seller-cell .balam-projects-meta {
        display: flex !important;
        flex-direction: column !important;
        gap: 4px !important;
        width: 100% !important;
    }

    .balam-projects-content .balam-client-seller-cell .balam-projects-meta strong {
        display: none !important;
    }

    .balam-projects-content .balam-project-meta-client,
    .balam-projects-content .balam-project-meta-state {
        font-size: 12px !important;
        font-weight: 600 !important;
        color: #666 !important;
        line-height: 1.2 !important;
    }

    .balam-projects-content .balam-project-meta-seller {
        margin-top: 2px !important;
    }

    .balam-projects-content .balam-project-mobile-seller-badge {
        display: inline-flex !important;
        width: fit-content !important;
    }

    .balam-projects-content > .balam-front-table td[data-label="Productos"] {
        order: 3 !important;
        width: 100% !important;
        flex: 1 1 100% !important;
        margin: 2px 0 12px !important;
        padding: 9px 0 !important;
        border-top: 1px solid #eee !important;
        border-bottom: 1px solid #eee !important;
    }

    .balam-projects-content > .balam-front-table td[data-label="Comentario"] {
        display: none !important;
    }

    .balam-projects-content > .balam-front-table td[data-label="Origen / Estatus"] {
        order: 4 !important;
        width: 100% !important;
        flex: 1 1 100% !important;
        margin: 0 0 10px !important;
    }

    .balam-projects-content > .balam-front-table td[data-label="Origen / Estatus"] > .balam-projects-stack > .balam-btn,
    .balam-projects-content > .balam-front-table td[data-label="Origen / Estatus"] > .balam-projects-stack > .balam-btn-disabled-soft,
    .balam-projects-content > .balam-front-table td[data-label="Origen / Estatus"] > .balam-projects-stack > .balam-btn-disabled-muted {
        display: none !important;
    }

    .balam-projects-content .balam-project-status-stack {
        align-items: flex-start !important;
    }

    .balam-projects-content > .balam-front-table td[data-label="Creado / Actualizado"] {
        display: none !important;
    }

    .balam-projects-content > .balam-front-table td[data-label="Acciones"] {
        order: 5 !important;
        width: 100% !important;
        flex: 1 1 100% !important;
    }
}

@media (max-width: 768px) {
    .balam-parts-delete-modal {
        padding: 32px !important;
    }

    .balam-parts-delete-summary {
        margin-bottom: 18px !important;
        padding: 12px 14px !important;
        font-size: 12px !important;
    }
}

@media (max-width: 768px) {
    .balam-front-content .balam-filter-action-row {
        display: contents !important;
    }

    .balam-front-table.balam-assembly-table td::before,
    .balam-front-table.balam-assembly-table td::after {
        content: none !important;
        display: none !important;
    }

    .balam-front-table.balam-assembly-table,
    .balam-front-table.balam-assembly-table tbody {
        display: block !important;
        width: 100% !important;
        max-width: 330px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        overflow: visible !important;
        box-sizing: border-box !important;
    }

    .balam-front-table.balam-assembly-table tbody tr {
        align-items: flex-start !important;
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        width: calc(100vw - 86px) !important;
        max-width: 330px !important;
        box-sizing: border-box !important;
    }

    .balam-front-table.balam-assembly-table .balam-assembly-folio-cell {
        display: none !important;
    }

    .balam-front-table.balam-assembly-table .balam-assembly-client-cell {
        min-width: 0 !important;
        order: 1 !important;
        width: 100% !important;
        flex: 0 0 100% !important;
        margin: 0 0 12px !important;
    }

    .balam-front-table.balam-assembly-table .balam-assembly-client {
        gap: 8px !important;
        min-width: 0 !important;
        overflow: visible !important;
        width: 100% !important;
    }

    .balam-front-table.balam-assembly-table .balam-assembly-client span:not(.balam-task-seller-badge):not(.balam-assembly-mobile-folio-value):not(.balam-assembly-mobile-date-value) {
        display: block !important;
        font-size: 17px !important;
        font-weight: 900 !important;
        line-height: 1.16 !important;
        margin: 0 !important;
        overflow-wrap: anywhere !important;
        text-transform: uppercase !important;
        width: 100% !important;
        white-space: normal !important;
        word-break: break-word !important;
    }

    .balam-front-table.balam-assembly-table .balam-assembly-mobile-folio-meta {
        color: #333333 !important;
        display: flex !important;
        flex-direction: column !important;
        font-size: 12px !important;
        font-weight: 700 !important;
        gap: 5px !important;
        text-transform: none !important;
    }

    .balam-front-table.balam-assembly-table .balam-assembly-mobile-folio-value,
    .balam-front-table.balam-assembly-table .balam-assembly-mobile-date-value {
        display: block !important;
        margin: 0 !important;
    }

    .balam-front-table.balam-assembly-table .balam-assembly-products-cell {
        order: 2 !important;
        width: 100% !important;
        flex: 0 0 100% !important;
        border-top: 1px solid #333333 !important;
        border-bottom: 1px solid #333333 !important;
        margin: 0px 0 15px !important;
        padding: 10px 0 !important;
    }

    .balam-front-table.balam-assembly-table .balam-assembly-product-title {
        margin: 0 0 10px !important;
    }

    .balam-front-table.balam-assembly-table .balam-assembly-part {
        border-bottom: 1px solid #ddd !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .balam-front-table.balam-assembly-table .balam-assembly-part:last-child {
        border-bottom: 0 !important;
    }

    .balam-front-table.balam-assembly-table td[data-label="Estatus / Acciones"] {
        order: 3 !important;
        width: 100% !important;
        flex: 0 0 100% !important;
        margin: 0 !important;
    }

    .balam-front-table.balam-assembly-table .balam-assembly-status-actions {
        align-items: center !important;
        gap: 8px !important;
        justify-content: center !important;
        width: 100% !important;
    }

    .balam-front-table.balam-assembly-table .balam-assembly-completed-status {
        align-items: center !important;
        gap: 4px !important;
        justify-content: center !important;
        width: 100% !important;
    }

    .balam-front-table.balam-assembly-table .balam-assembly-completed-status .balam-badge {
        margin: 0 auto !important;
    }

    .balam-front-table.balam-assembly-table .balam-assembly-completed-datetime {
        align-items: center !important;
        color: #8a8a8a !important;
        display: inline-flex !important;
        gap: 8px !important;
        justify-content: center !important;
        margin-bottom: 8px !important;
        text-align: center !important;
        width: 100% !important;
    }

    .balam-front-table.balam-assembly-table .balam-assembly-completed-datetime > span {
        display: inline-block !important;
        font-size: 12px !important;
        font-weight: 700 !important;
    }

    .balam-front-content .balam-inventory-family-stack > .balam-mobile-action-toolbar {
        order: 2 !important;
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
        width: 100% !important;
        max-width: 330px !important;
        margin: 0 auto 16px !important;
        padding: 0 !important;
        background: transparent !important;
        border: 0 !important;
    }

    .balam-front-content .balam-inventory-family-stack > .balam-filters-toggle-mobile {
        order: 3 !important;
        display: flex !important;
    }

    .balam-front-content .balam-inventory-family-stack > .balam-system-filters {
        order: 4 !important;
    }

    .balam-front-content .balam-tab-header .balam-mobile-action-toolbar,
    .balam-front-content > .balam-mobile-action-toolbar {
        order: 3 !important;
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
        width: 100% !important;
        max-width: 330px !important;
        margin: 0 auto 16px !important;
        padding: 0 !important;
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
    }

    .balam-front-content .balam-tab-header .balam-mobile-action-toolbar.is-single-action,
    .balam-front-content > .balam-mobile-action-toolbar.is-single-action {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .balam-front-content .balam-inventory-family-stack > .balam-mobile-action-toolbar.is-single-action,
    .balam-front-content .balam-filter-action-row > .balam-mobile-action-toolbar.is-single-action {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .balam-front-content .balam-tab-header .balam-mobile-action-toolbar .balam-mobile-action-btn,
    .balam-front-content > .balam-mobile-action-toolbar .balam-mobile-action-btn {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        margin: 0 !important;
    }

    .balam-front-content .balam-mobile-action-toolbar > a[href*="tab=quotes"][href*="mode=new"]:last-child {
        grid-column: 1 / -1 !important;
    }

    .balam-front-content .balam-company-toolbar {
        align-items: stretch !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
    }

    .balam-front-content .balam-company-toolbar .balam-company-actions {
        order: 1 !important;
    }

    .balam-front-content .balam-company-toolbar .balam-company-filter-form {
        order: 2 !important;
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 10px !important;
        width: 100% !important;
    }

    /* Keep the general calendar summary from nesting inside a second card. */
    .balam-front-content .balam-company-top-summary {
        background: transparent !important;
        border: 0 !important;
        border-radius: 0 !important;
        gap: 10px !important;
        margin: 0 0 12px !important;
        padding: 0 !important;
    }

    .balam-front-content .balam-company-feature-row {
        display: block !important;
        min-height: 0 !important;
        width: 100% !important;
    }

    .balam-front-content .balam-company-calendar .balam-task-calendar-month {
        min-width: 0 !important;
        width: 100% !important;
    }

    .balam-front-content .balam-company-calendar .balam-calendar-grid-wrap {
        max-width: 100% !important;
        overflow-x: hidden !important;
        width: 100% !important;
    }

    .balam-front-content .balam-company-month-head h4 {
        font-size: 15px !important;
        line-height: 1.15 !important;
    }

    .balam-front-content .balam-company-maximize-btn {
        display: none !important;
    }

    .balam-front-content .balam-company-legend {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px 12px !important;
        margin: 12px 0 !important;
    }

    /* Stack one calendar day per row so event cards never get clipped. */
    .balam-front-content .balam-company-calendar .balam-calendar-grid {
        display: block !important;
        min-width: 0 !important;
        table-layout: auto !important;
    }

    .balam-front-content .balam-company-calendar .balam-calendar-grid thead {
        display: none !important;
    }

    .balam-front-content .balam-company-calendar .balam-calendar-grid tbody,
    .balam-front-content .balam-company-calendar .balam-calendar-grid tr {
        display: contents !important;
    }

    .balam-front-content .balam-company-calendar .balam-calendar-grid td {
        display: block !important;
        height: auto !important;
        min-height: 58px !important;
        padding: 32px 8px 8px !important;
        width: 100% !important;
    }

    .balam-front-content .balam-company-calendar .balam-calendar-grid td.is-muted {
        display: none !important;
    }

    .balam-front-content .balam-company-calendar .balam-calendar-day-num {
        justify-content: flex-start !important;
        padding: 8px 10px 0 !important;
    }

    .balam-front-content .balam-company-calendar .balam-calendar-day-num > span:first-child {
        display: none !important;
    }

    .balam-front-content .balam-company-calendar .balam-calendar-mobile-day-label {
        color: #333 !important;
        display: inline !important;
        font-size: 13px !important;
        font-weight: 900 !important;
    }

    .balam-front-content #balamRrssFilterForm {
        align-items: stretch !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
    }

    .balam-front-content #balamRrssFilterForm .balam-rrss-filter-actions {
        order: 1 !important;
    }

    .balam-front-content #balamRrssFilterForm .balam-rrss-filter-fields {
        order: 2 !important;
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 10px !important;
        width: 100% !important;
    }

    .balam-front-content #balamRrssFilterForm .balam-rrss-filter-fields .balam-calendar-clear {
        width: 100% !important;
    }

    .balam-front-content:has(> .balam-session-toolbar) {
        display: flex !important;
        flex-direction: column !important;
    }

    .balam-front-content:has(> .balam-session-toolbar) .balam-session-toolbar .balam-session-pdf-btn {
        align-self: stretch !important;
        margin: 0 0 10px !important;
        width: 100% !important;
    }

    .balam-front-content:has(> .balam-session-toolbar) > .balam-session-toolbar {
        align-items: stretch !important;
        display: grid !important;
        gap: 10px !important;
        grid-template-columns: 1fr !important;
        margin: 0 0 14px !important;
        order: 3 !important;
        width: 100% !important;
    }

    .balam-front-content:has(> .balam-session-toolbar) > .balam-session-toolbar select,
    .balam-front-content:has(> .balam-session-toolbar) > .balam-session-toolbar .balam-session-pdf-btn {
        box-sizing: border-box !important;
        margin: 0 !important;
        max-width: none !important;
        width: 100% !important;
    }

    .balam-front-content:has(> .balam-session-toolbar) > .balam-session-count {
        margin: 0 0 12px !important;
        order: 4 !important;
    }

    .balam-front-content:has(> .balam-session-toolbar) > .balam-session-card,
    .balam-front-content:has(> .balam-session-toolbar) > .balam-notice {
        order: 5 !important;
    }

    .balam-front-content .balam-btn.balam-session-pdf-btn.color-grey {
        background: #fff !important;
        background-color: #fff !important;
        border: 1.5px solid #333 !important;
        box-shadow: none !important;
        color: #333 !important;
    }

    .balam-front-content #balamSuppliersListView {
        display: flex !important;
        flex-direction: column !important;
        gap: 0 !important;
    }

    .balam-front-content #balamSuppliersListView > .balam-card {
        width: 100% !important;
        max-width: none !important;
        margin-top: 0 !important;
        padding: 0 !important;
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
    }

    .balam-front-content .balam-suppliers-list-header {
        display: none !important;
    }

    .balam-front-content .balam-suppliers-list-header .balam-subsection-title {
        margin-top: 0 !important;
    }

    .balam-front-content #balamSuppliersListView .balam-front-table,
    .balam-front-content #balamSuppliersListView .balam-front-table tbody {
        display: flex !important;
        flex-direction: column !important;
        gap: 14px !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        white-space: normal !important;
    }

    .balam-front-content #balamSuppliersListView .balam-front-table thead {
        display: none !important;
    }

    .balam-front-content #balamSuppliersListView .balam-front-table tbody tr {
        display: flex !important;
        flex-direction: column !important;
        gap: 8px !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        margin: 0 !important;
        padding: 16px 14px !important;
        background: #ffffff !important;
        border: 1px solid #ececec !important;
        border-radius: 20px !important;
        box-shadow: 0 10px 24px rgba(31, 41, 55, 0.08) !important;
        white-space: normal !important;
    }

    .balam-front-content #balamSuppliersListView .balam-front-table tbody td {
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        text-align: left !important;
        white-space: normal !important;
    }

    .balam-front-content #balamSuppliersListView .balam-front-table tbody td:nth-child(1) {
        display: none !important;
    }

    .balam-front-content #balamSuppliersListView .balam-front-table tbody td:nth-child(2) {
        color: #1f2937 !important;
        font-size: 20px !important;
        font-weight: 800 !important;
        line-height: 1.15 !important;
        text-transform: uppercase !important;
        overflow-wrap: anywhere !important;
        word-break: break-word !important;
        margin-bottom: 4px !important;
        white-space: normal !important;
    }

    .balam-front-content #balamSuppliersListView .balam-front-table tbody td:nth-child(3),
    .balam-front-content #balamSuppliersListView .balam-front-table tbody td:nth-child(4),
    .balam-front-content #balamSuppliersListView .balam-front-table tbody td:nth-child(5) {
        color: #6b7280 !important;
        font-size: 12px !important;
        font-weight: 600 !important;
        line-height: 1.45 !important;
        overflow-wrap: anywhere !important;
        word-break: break-word !important;
    }

    .balam-front-content #balamSuppliersListView .balam-front-table tbody td.balam-empty-cell {
        display: none !important;
    }

    .balam-front-content #balamSuppliersListView .balam-front-table tbody td:nth-child(3)::before,
    .balam-front-content #balamSuppliersListView .balam-front-table tbody td:nth-child(4)::before,
    .balam-front-content #balamSuppliersListView .balam-front-table tbody td:nth-child(5)::before {
        display: block !important;
        margin-bottom: 3px !important;
        color: #9ca3af !important;
        font-size: 10px !important;
        font-weight: 800 !important;
        letter-spacing: 0.12em !important;
        text-transform: uppercase !important;
    }

    .balam-front-content #balamSuppliersListView .balam-front-table tbody td:nth-child(3)::before {
        content: "Contacto" !important;
    }

    .balam-front-content #balamSuppliersListView .balam-front-table tbody td:nth-child(4)::before {
        content: none !important;
        display: none !important;
    }

    .balam-front-content #balamSuppliersListView .balam-front-table tbody td:nth-child(5)::before {
        content: none !important;
        display: none !important;
    }

    .balam-front-content #balamSuppliersListView .balam-front-table tbody td:nth-child(6) {
        padding-top: 2px !important;
    }

    .balam-front-content #balamSuppliersListView .balam-front-table tbody td:nth-child(7) {
        padding-top: 4px !important;
    }

    .balam-front-content #balamSuppliersListView .balam-front-table tbody td:nth-child(7) .balam-btn {
        width: 100% !important;
        min-width: 0 !important;
    }

    .balam-quotes-filters,
    #balam-filters-form.balam-quotes-filters {
        transition: none !important;
        transform: none !important;
    }

    .balam-quotes-filters.is-collapsed,
    .balam-quotes-filters.is-expanded,
    .balam-quotes-filters.is-active,
    #balam-filters-form.balam-quotes-filters.is-collapsed,
    #balam-filters-form.balam-quotes-filters.is-expanded,
    #balam-filters-form.balam-quotes-filters.is-active {
        transition: none !important;
        transform: none !important;
    }

    .balam-quotes-filters.is-expanded,
    #balam-filters-form.balam-quotes-filters.is-expanded {
        margin-bottom: 28px !important;
    }

    .balam-quotes-filters .balam-select,
    .balam-quotes-filters .balam-select-options,
    .balam-quotes-filters .balam-select-option {
        transition: none !important;
        transform: none !important;
    }
}

@media (max-width: 768px) {
    .balam-front-content.balam-quote-form-card,
    .balam-front-content.balam-shipment-edit-content {
        width: 100% !important;
        max-width: min(360px, calc(100vw - 48px)) !important;
        margin: 0 auto 24px !important;
        padding: 18px !important;
        background: #fff !important;
        border-radius: 18px !important;
        box-sizing: border-box !important;
        box-shadow: none !important;
    }

    .balam-quote-form-card .balam-quote-form .balam-front-filters.balam-system-filters {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 10px !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 0 14px !important;
        padding: 0 !important;
        background: transparent !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-sizing: border-box !important;
        overflow: visible !important;
    }

    .balam-quote-form-card .balam-quote-form .balam-quote-half-wrap,
    .balam-quote-form-card .balam-quote-form .balam-front-filters.balam-system-filters > * {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        flex: 0 0 auto !important;
        box-sizing: border-box !important;
    }

    .balam-quote-form-card .balam-quote-form select.balam-input-lg,
    .balam-quote-form-card .balam-quote-form input.balam-input-lg,
    .balam-quote-form-card .balam-quote-form textarea.balam-input-lg,
    .balam-quote-form-card .balam-quote-form .balam-select-trigger,
    .balam-quote-form-card .balam-quote-form .balam-custom-num-input {
        width: 100% !important;
        max-width: 100% !important;
        min-height: 42px !important;
        background-color: #fff !important;
        border: 1px solid #333 !important;
        border-radius: 999px !important;
        box-sizing: border-box !important;
        color: #666 !important;
        font-size: 14px !important;
        font-weight: 700 !important;
        box-shadow: none !important;
    }

    .balam-quote-form-card .balam-quote-form select.balam-input-lg,
    .balam-quote-form-card .balam-quote-form input.balam-input-lg {
        padding: 0 16px !important;
    }

    .balam-quote-form-card .balam-quote-form .balam-products-inputs {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 12px !important;
        width: 100% !important;
        max-width: 100% !important;
        margin-bottom: 18px !important;
    }

    .balam-quote-form-card .balam-quote-form .balam-products-inputs > div,
    .balam-quote-form-card .balam-quote-form .balam-products-inputs > span,
    .balam-quote-form-card .balam-quote-form .balam-products-inputs .balam-quote-product-select-field {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        flex: 0 0 auto !important;
    }

    .balam-quote-form-card .balam-quote-form .balam-products-inputs .balam-mobile-row-group:not(.balam-stock-add-group) {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 12px !important;
        width: 100% !important;
        margin: 0 !important;
    }

    .balam-quote-form-card .balam-quote-form .balam-products-inputs .balam-mobile-row-group:not(.balam-stock-add-group) > .balam-field {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .balam-quote-form-card .balam-quote-form .balam-stock-add-group {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
        gap: 12px !important;
        align-items: end !important;
        width: 100% !important;
        margin: 0 !important;
    }

    .balam-quote-form-card .balam-quote-form textarea[name="special_note"].balam-input-lg {
        min-height: 92px !important;
        max-height: none !important;
        height: 92px !important;
        padding: 14px 16px !important;
        border: 1px solid #333 !important;
        border-radius: 18px !important;
        background: #fff !important;
        resize: vertical !important;
        overflow: auto !important;
    }

    .balam-quote-form-card .balam-quote-form textarea[name="special_note"].balam-input-lg::placeholder {
        color: #777 !important;
        opacity: 1 !important;
    }
}

@media (max-width: 920px) {
    .balam-front-content .balam-quote-totals .balam-btn.color-blue {
        background-color: #b9cbd8 !important;
        color: #333 !important;
    }
}

@media (max-width: 768px) {
    .balam-quote-edit-card .balam-quote-form > h4.balam-subsection-title {
        margin-top: 20px !important;
        margin-bottom: 10px !important;
    }

    .balam-quote-edit-card strong#balam-client-name {
        display: block !important;
        margin: 0 0 12px !important;
        color: #777 !important;
        font-size: 15px !important;
        font-weight: 900 !important;
        line-height: 1.15 !important;
        text-transform: uppercase !important;
    }

    .balam-quote-edit-card .balam-client-grid {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 12px !important;
        margin: 0 !important;
        width: 100% !important;
    }

    .balam-quote-edit-card .balam-client-col {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 12px !important;
        width: 100% !important;
    }

    .balam-quote-edit-card .balam-client-col > div {
        display: block !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .balam-quote-edit-card .balam-client-col strong {
        display: block !important;
        margin: 0 0 3px !important;
        color: #333 !important;
        font-size: 12px !important;
        font-weight: 900 !important;
        line-height: 1.1 !important;
        text-transform: uppercase !important;
    }

    .balam-quote-edit-card .balam-client-col span {
        display: block !important;
        color: #333 !important;
        font-size: 14px !important;
        font-weight: 500 !important;
        line-height: 1.18 !important;
        text-transform: uppercase !important;
        overflow-wrap: anywhere !important;
    }

    .balam-quote-edit-card #balam-edit-client + #balam-min-price-exception-badge,
    .balam-quote-edit-card #balam-min-price-exception-badge {
        display: flex !important;
        width: 100% !important;
        max-width: 100% !important;
        min-height: 42px !important;
        margin: 10px 0 0 !important;
        padding: 10px 14px !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 999px !important;
        box-sizing: border-box !important;
        text-align: center !important;
    }

    .balam-quote-edit-card #balam-min-price-exception-badge.balam-is-hidden,
    .balam-quote-edit-card #balam-min-price-exception-badge.balam-hidden,
    .balam-quote-edit-card #balam-min-price-exception-badge[style*="display:none"] {
        display: none !important;
    }

    .balam-quote-edit-card #balam-edit-client {
        width: 100% !important;
        max-width: 100% !important;
    }

    .balam-quote-edit-card #balam-edit-client,
    .balam-quote-edit-card #balam-min-price-exception-badge {
        grid-column: 1 / -1 !important;
    }

    .balam-quote-edit-card .balam-quote-form > div[style*="margin-top:12px"] {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 10px !important;
        align-items: stretch !important;
        width: 100% !important;
        margin-top: 14px !important;
    }

    .balam-quote-edit-card .balam-products-inputs select.balam-input-lg,
    .balam-quote-edit-card .balam-products-inputs input.balam-input-lg,
    .balam-quote-edit-card .balam-products-inputs .balam-custom-num-input,
    .balam-quote-edit-card .balam-quote-items-table input.balam-input-lg,
    .balam-quote-edit-card .balam-quote-items-table .balam-row-price,
    .balam-quote-edit-card .balam-quote-items-table .balam-row-delivery,
    .balam-quote-edit-card .balam-quote-items-table .balam-row-item-note,
    .balam-quote-edit-card .balam-quote-items-table .balam-qty-group {
        background: #fff !important;
        border: 1px solid #333 !important;
        border-radius: 999px !important;
        box-sizing: border-box !important;
        box-shadow: none !important;
    }

    .balam-quote-edit-card .balam-quote-items-table .balam-row-delivery,
    .balam-quote-edit-card .balam-quote-items-table .balam-row-item-note {
        width: 100% !important;
        min-height: 42px !important;
        padding: 0 14px !important;
    }

    .balam-quote-edit-card .balam-quote-items-table .balam-row-price {
        width: 100% !important;
        min-height: 42px !important;
        padding: 0 14px !important;
    }

    .balam-quote-edit-card .balam-quote-totals-table {
        border: 1px solid #333 !important;
        border-radius: 18px !important;
        border-collapse: separate !important;
        border-spacing: 0 !important;
        overflow: hidden !important;
        background: #fff !important;
    }

    .balam-quote-edit-card .balam-quote-totals-table tr:nth-child(odd) {
        background: #ececec !important;
    }

    .balam-quote-edit-card .balam-quote-totals-table tr:nth-child(even) {
        background: #fff !important;
    }

    .balam-quote-edit-card .balam-quote-totals-table tr,
    .balam-quote-edit-card .balam-quote-totals-table td {
        box-shadow: none !important;
    }

    .balam-quote-edit-card textarea[name="special_note"].balam-input-lg {
        border: 1px solid #333 !important;
    }

    .balam-quote-edit-card #balam-save-quote {
        background: #b9cbd8 !important;
        color: #333 !important;
    }

    .balam-quote-edit-card #balam-download-pdf {
        background: #439756 !important;
        color: #fff !important;
    }

    .balam-quote-edit-card #balam-pass-prefactura {
        background: #d7d7d7 !important;
        color: #333 !important;
    }

    .balam-quote-edit-card .balam-quote-edit-seller-row {
        display: flex !important;
        justify-content: flex-start !important;
        align-items: center !important;
        width: 100% !important;
        margin: 18px 0 18px !important;
    }

    .balam-quote-edit-card .balam-quote-edit-seller-row .balam-shipment-seller-badge {
        width: max-content !important;
        max-width: 100% !important;
        background: color-mix(in srgb, var(--seller-color, #51b327) 26%, #fff) !important;
        color: #333 !important;
        text-transform: none !important;
    }

    .balam-quote-edit-card .balam-quote-edit-seller-row .balam-shipment-seller-badge::before {
        background: var(--seller-color, #51b327) !important;
    }

    .balam-quote-edit-card .balam-products-inputs .balam-custom-num-input input,
    .balam-quote-edit-card .balam-products-inputs .balam-custom-num-input select,
    .balam-quote-edit-card .balam-products-inputs #balam-qty,
    .balam-quote-edit-card .balam-products-inputs #balam-price {
        appearance: textfield !important;
        -webkit-appearance: none !important;
        background: transparent !important;
        background-image: none !important;
        border: 0 !important;
        box-shadow: none !important;
        height: 38px !important;
        min-height: 0 !important;
        padding: 0 8px !important;
        text-align: center !important;
    }

    .balam-quote-edit-card .balam-products-inputs .balam-custom-num-input input::-webkit-outer-spin-button,
    .balam-quote-edit-card .balam-products-inputs .balam-custom-num-input input::-webkit-inner-spin-button,
    .balam-quote-edit-card .balam-quote-items-table .balam-row-qty::-webkit-outer-spin-button,
    .balam-quote-edit-card .balam-quote-items-table .balam-row-qty::-webkit-inner-spin-button {
        -webkit-appearance: none !important;
        margin: 0 !important;
    }

    .balam-quote-edit-card .balam-front-table.balam-quote-items-table tbody tr {
        border: 2px solid #f1f1f1 !important;
        border-radius: 18px !important;
        padding: 20px !important;
        box-shadow: none !important;
        box-sizing: border-box !important;
    }

    .balam-quote-edit-card .balam-quote-items-table .balam-qty-group {
        display: grid !important;
        grid-template-columns: 28px minmax(0, 1fr) 28px !important;
        align-items: center !important;
        gap: 10px !important;
        width: 100% !important;
        min-height: 42px !important;
        padding: 0 10px !important;
        background: #fff !important;
        border: 1px solid #333 !important;
        border-radius: 999px !important;
        box-sizing: border-box !important;
    }

    .balam-quote-edit-card .balam-quote-items-table .balam-qty-group button {
        width: 28px !important;
        height: 28px !important;
        min-width: 28px !important;
        min-height: 28px !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 999px !important;
        background: #f2f2f2 !important;
        color: #333 !important;
        font-size: 18px !important;
        line-height: 1 !important;
    }

    .balam-quote-edit-card .balam-quote-items-table .balam-row-qty {
        width: 100% !important;
        min-width: 0 !important;
        height: 38px !important;
        min-height: 0 !important;
        padding: 0 !important;
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
        text-align: center !important;
        appearance: textfield !important;
        -webkit-appearance: none !important;
    }

    .balam-quote-form-card #balam-client-info {
        margin-top: 16px !important;
        width: 100% !important;
    }

    .balam-quote-form-card #balam-client-info > #balam-client-name {
        display: block !important;
        margin: 0 0 12px !important;
        color: #777 !important;
        font-size: 15px !important;
        font-weight: 900 !important;
        line-height: 1.15 !important;
        text-transform: uppercase !important;
        overflow-wrap: anywhere !important;
    }

    .balam-quote-form-card .balam-client-grid {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 12px !important;
        margin: 0 !important;
        width: 100% !important;
    }

    .balam-quote-form-card .balam-client-col {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 12px !important;
        width: 100% !important;
    }

    .balam-quote-form-card .balam-client-col > div {
        display: block !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .balam-quote-form-card .balam-client-col strong {
        display: block !important;
        margin: 0 0 3px !important;
        color: #333 !important;
        font-size: 12px !important;
        font-weight: 900 !important;
        line-height: 1.1 !important;
        text-transform: uppercase !important;
    }

    .balam-quote-form-card .balam-client-col span {
        display: block !important;
        color: #333 !important;
        font-size: 14px !important;
        font-weight: 500 !important;
        line-height: 1.18 !important;
        text-transform: uppercase !important;
        overflow-wrap: anywhere !important;
    }

    .balam-quote-form-card #balam-client-info > div[style*="margin-top:14px"] {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
        align-items: stretch !important;
        width: 100% !important;
        margin-top: 16px !important;
    }

    .balam-quote-form-card #balam-client-info #balam-change-client,
    .balam-quote-form-card #balam-client-info #balam-edit-client {
        width: 100% !important;
        min-width: 0 !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    .balam-quote-form-card #balam-client-info #balam-min-price-exception-badge {
        grid-column: 1 / -1 !important;
        width: 100% !important;
        max-width: 100% !important;
        min-height: 42px !important;
        margin: 0 !important;
        padding: 10px 14px !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 999px !important;
        box-sizing: border-box !important;
        text-align: center !important;
    }

    .balam-quote-form-card #balam-client-info #balam-min-price-exception-badge:not(.balam-is-hidden):not(.balam-hidden):not([style*="display:none"]) {
        display: flex !important;
    }

    .balam-quote-form-card #balam-client-info #balam-min-price-exception-badge.balam-is-hidden,
    .balam-quote-form-card #balam-client-info #balam-min-price-exception-badge.balam-hidden,
    .balam-quote-form-card #balam-client-info #balam-min-price-exception-badge[style*="display:none"] {
        display: none !important;
    }

    .balam-quote-form-card .balam-quote-items-table .balam-qty-group {
        display: grid !important;
        grid-template-columns: 28px minmax(0, 1fr) 28px !important;
        align-items: center !important;
        gap: 10px !important;
        width: 100% !important;
        min-height: 42px !important;
        padding: 0 10px !important;
        background: #fff !important;
        border: 1px solid #333 !important;
        border-radius: 999px !important;
        box-sizing: border-box !important;
    }

    .balam-quote-form-card .balam-quote-items-table .balam-qty-group button {
        width: 28px !important;
        height: 28px !important;
        min-width: 28px !important;
        min-height: 28px !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 999px !important;
        background: #f2f2f2 !important;
        color: #333 !important;
        font-size: 18px !important;
        line-height: 1 !important;
    }

    .balam-quote-form-card .balam-quote-items-table .balam-row-qty {
        width: 100% !important;
        min-width: 0 !important;
        height: 38px !important;
        min-height: 0 !important;
        padding: 0 !important;
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
        text-align: center !important;
        appearance: textfield !important;
        -webkit-appearance: none !important;
    }

    .balam-quote-form-card .balam-quote-items-table .balam-row-qty::-webkit-outer-spin-button,
    .balam-quote-form-card .balam-quote-items-table .balam-row-qty::-webkit-inner-spin-button {
        -webkit-appearance: none !important;
        margin: 0 !important;
    }

    .balam-front-table.balam-quotes-table .balam-quote-preview-wrap {
        top: 16px !important;
        right: 18px !important;
        line-height: 1 !important;
    }

    .balam-front-table.balam-quotes-table .balam-folio-preview-trigger {
        align-items: flex-start !important;
        height: 20px !important;
        min-height: 20px !important;
        width: 20px !important;
        min-width: 20px !important;
        padding: 0 !important;
        line-height: 1 !important;
    }

    .balam-front-table.balam-quotes-table .balam-folio-preview-trigger svg {
        display: block !important;
        width: 17px !important;
        height: 17px !important;
        margin: 0 !important;
        transform: translateY(-2px) !important;
    }
}

@media (max-width: 768px) {
    .balam-preinvoices-wrapper .balam-front-table.balam-preinvoices-table,
    .balam-preinvoices-wrapper .balam-front-table.balam-preinvoices-table tbody {
        display: block !important;
        width: 100% !important;
        max-width: 328px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        overflow: visible !important;
        box-sizing: border-box !important;
    }

    .balam-preinvoices-wrapper .balam-front-table.balam-preinvoices-table tbody tr {
        align-items: flex-start !important;
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        gap: 0 !important;
        width: calc(100vw - 86px) !important;
        max-width: 328px !important;
        padding: 18px 18px 16px !important;
        position: relative !important;
        box-sizing: border-box !important;
    }

    .balam-preinvoices-wrapper .balam-front-table.balam-preinvoices-table td::before,
    .balam-preinvoices-wrapper .balam-front-table.balam-preinvoices-table td::after {
        content: none !important;
        display: none !important;
    }

    .balam-preinvoices-wrapper .balam-front-table.balam-preinvoices-table td {
        align-items: flex-start !important;
        box-sizing: border-box !important;
        display: flex !important;
        flex-direction: column !important;
        margin-bottom: 0 !important;
        position: relative !important;
        text-align: left !important;
    }

    .balam-preinvoices-wrapper .balam-front-table.balam-preinvoices-table td.balam-preinvoice-folio-cell {
        order: 3 !important;
        flex: 0 0 100% !important;
        width: 100% !important;
        margin: 0 0 10px !important;
        padding-right: 0 !important;
        align-items: flex-start !important;
        position: static !important;
        text-align: left !important;
    }

    .balam-preinvoices-wrapper .balam-front-table.balam-preinvoices-table .balam-preinvoice-folio-cell {
        color: #333333 !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 4px !important;
        font-size: 12px !important;
        font-weight: 700 !important;
        text-transform: none !important;
    }

    .balam-preinvoices-wrapper .balam-front-table.balam-preinvoices-table .balam-preinvoice-folio-cell > .balam-folio-meta {
        display: block !important;
        margin-top: 0 !important;
    }

    .balam-preinvoices-wrapper .balam-preinvoices-table .balam-folio-preview-trigger {
        align-items: center !important;
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
        display: inline-flex !important;
        height: 28px !important;
        justify-content: center !important;
        position: absolute !important;
        right: 18px !important;
        top: 14px !important;
        transform: none !important;
        width: 28px !important;
        z-index: 2 !important;
    }

    .balam-preinvoices-wrapper .balam-front-table.balam-preinvoices-table .balam-preinvoice-folio-cell .balam-quote-preview-wrap,
    .balam-preinvoices-wrapper .balam-front-table.balam-preinvoices-table .balam-preinvoice-folio-cell .balam-folio-preview-trigger {
        display: none !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }

    .balam-preinvoices-wrapper .balam-preinvoice-client-heading {
        align-items: start !important;
        column-gap: 10px !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 28px !important;
        width: 100% !important;
    }

    .balam-preinvoices-wrapper .balam-preinvoice-client-heading .balam-preinvoice-mobile-preview-trigger {
        display: inline-flex !important;
        height: 28px !important;
        justify-self: end !important;
        margin: -3px 0 0 !important;
        min-height: 28px !important;
        min-width: 28px !important;
        padding: 0 !important;
        position: static !important;
        transform: none !important;
        width: 28px !important;
    }

    .balam-preinvoices-wrapper .balam-preinvoices-table .balam-folio-preview-trigger svg {
        height: 16px !important;
        width: 16px !important;
    }

    .balam-preinvoices-wrapper .balam-front-table.balam-preinvoices-table .balam-client-seller-cell {
        order: 1 !important;
        flex: 0 0 100% !important;
        width: 100% !important;
        margin: 0 0 10px !important;
        padding-right: 0 !important;
    }

    .balam-preinvoices-wrapper .balam-front-table.balam-preinvoices-table .balam-client-line {
        display: block !important;
        font-size: 17px !important;
        font-weight: 900 !important;
        line-height: 1.16 !important;
        margin: 0 0 8px !important;
        text-transform: uppercase !important;
    }

    .balam-preinvoices-wrapper .balam-front-table.balam-preinvoices-table .balam-order-4 {
        order: 5 !important;
        flex: 0 0 50% !important;
        width: 50% !important;
        margin: 0 0 12px !important;
        align-items: flex-end !important;
        justify-content: flex-start !important;
        text-align: right !important;
        padding-left: 8px !important;
        display: flex !important;
    }

    .balam-preinvoices-wrapper .balam-front-table.balam-preinvoices-table .balam-order-4 .balam-badge {
        margin-left: auto !important;
    }

    .balam-preinvoices-wrapper .balam-front-table.balam-preinvoices-table .balam-order-6 {
        order: 4 !important;
        flex: 0 0 100% !important;
        width: 100% !important;
        margin: 0 0 15px !important;
        padding: 10px 0 !important;
        border-top: 1px solid #333333 !important;
        border-bottom: 1px solid #333333 !important;
    }

    .balam-preinvoices-wrapper .balam-front-table.balam-preinvoices-table .balam-order-6 hr {
        display: none !important;
    }

    .balam-preinvoices-wrapper .balam-front-table.balam-preinvoices-table .balam-order-8 {
        order: 5 !important;
        flex: 0 0 50% !important;
        width: 50% !important;
        margin: 0 0 12px !important;
        align-items: flex-start !important;
        justify-content: flex-start !important;
        display: flex !important;
    }

    .balam-preinvoices-wrapper .balam-front-table.balam-preinvoices-table .balam-val-total {
        color: #1a1a1a !important;
        display: block !important;
        font-size: 19px !important;
        font-weight: 900 !important;
        letter-spacing: 0 !important;
        opacity: 1 !important;
        visibility: visible !important;
    }

    .balam-preinvoices-wrapper .balam-front-table.balam-preinvoices-table .balam-order-9 {
        order: 6 !important;
        flex: 0 0 100% !important;
        width: 100% !important;
        margin: 0 !important;
        justify-content: stretch !important;
    }

    .balam-preinvoices-wrapper .balam-front-table.balam-preinvoices-table .balam-actions-row {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        gap: 8px !important;
        align-items: stretch !important;
        justify-content: stretch !important;
        width: 100% !important;
    }

    .balam-preinvoices-wrapper .balam-front-table.balam-preinvoices-table .balam-actions-row > .balam-btn,
    .balam-preinvoices-wrapper .balam-front-table.balam-preinvoices-table .balam-actions-row > form.balam-inline-form {
        flex: 1 1 0 !important;
        min-width: 0 !important;
        width: auto !important;
        max-width: none !important;
        margin: 0 !important;
    }

    .balam-preinvoices-wrapper .balam-front-table.balam-preinvoices-table .balam-actions-row > form.balam-inline-form {
        display: block !important;
    }

    .balam-preinvoices-wrapper .balam-front-table.balam-preinvoices-table .balam-actions-row > form.balam-inline-form .balam-btn,
    .balam-preinvoices-wrapper .balam-front-table.balam-preinvoices-table .balam-actions-row > .balam-btn {
        flex: 1 1 0 !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        box-sizing: border-box !important;
    }

    #balam-preinvoices-filters-form,
    #balam-preinvoices-filters-form.balam-front-filters,
    #balam-preinvoices-filters-form.balam-quotes-filters {
        width: calc(100vw - 86px) !important;
        max-width: 328px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        overflow: visible !important;
        box-sizing: border-box !important;
    }

    #balam-preinvoices-filters-form .balam-filters-controls,
    #balam-preinvoices-filters-form .balam-filters-row,
    #balam-preinvoices-filters-form .balam-quotes-top-row {
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        overflow: visible !important;
        box-sizing: border-box !important;
    }

    #balam-preinvoices-filters-form input,
    #balam-preinvoices-filters-form select,
    #balam-preinvoices-filters-form .balam-select,
    #balam-preinvoices-filters-form .balam-select-trigger {
        flex: 0 0 auto !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: 42px !important;
        min-height: 42px !important;
        box-sizing: border-box !important;
    }

    #balam-preinvoices-filters-form .balam-select {
        overflow: visible !important;
        position: relative !important;
        z-index: 1 !important;
    }

    #balam-preinvoices-filters-form .balam-select.is-open {
        overflow: visible !important;
        position: relative !important;
        z-index: 1000 !important;
    }

    #balam-preinvoices-filters-form .balam-select.is-open .balam-select-panel {
        max-width: 100% !important;
        width: 100% !important;
        z-index: 9999 !important;
    }

    #balam-preinvoices-filters-form .balam-quotes-top-row > *,
    #balam-preinvoices-filters-form .balam-filters-row > * {
        flex: 0 0 auto !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }

    #balam-preinvoices-filters-form input[type="date"],
    #balam-preinvoices-filters-form input[name="from"],
    #balam-preinvoices-filters-form input[name="to"] {
        appearance: none !important;
        -webkit-appearance: none !important;
        border-radius: 999px !important;
    }

    #balam-filters-form,
    #balam-filters-form.balam-front-filters,
    #balam-filters-form.balam-quotes-filters,
    #balam-warranties-filters-form,
    #balam-warranties-filters-form.balam-front-filters,
    #balam-warranties-filters-form.balam-warranties-filters,
    .balam-purchase-orders-filters,
    .balam-purchase-orders-filters.balam-front-filters {
        width: calc(100vw - 86px) !important;
        max-width: 328px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        overflow: visible !important;
        box-sizing: border-box !important;
    }

    #balam-filters-form .balam-filters-controls,
    #balam-filters-form .balam-list-filters-controls,
    #balam-filters-form .balam-list-filters-main,
    #balam-filters-form .balam-list-filters-grid-primary,
    #balam-filters-form .balam-list-filters-grid-search,
    #balam-filters-form .balam-list-filters-period,
    #balam-filters-form .balam-filters-row,
    #balam-warranties-filters-form .balam-filters-controls,
    #balam-warranties-filters-form .balam-filters-row,
    #balam-warranties-filters-form .balam-filters-row.search-row,
    .balam-purchase-orders-filters .balam-filters-controls,
    .balam-purchase-orders-filters .balam-list-filters-controls,
    .balam-purchase-orders-filters .balam-list-filters-main,
    .balam-purchase-orders-filters .balam-list-filters-grid-primary,
    .balam-purchase-orders-filters .balam-list-filters-grid-search,
    .balam-purchase-orders-filters .balam-list-filters-grid-search-compact,
    .balam-purchase-orders-filters .balam-filters-row {
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        overflow: visible !important;
        box-sizing: border-box !important;
    }

    #balam-filters-form input,
    #balam-filters-form select,
    #balam-filters-form .balam-select,
    #balam-filters-form .balam-select-trigger,
    #balam-warranties-filters-form input,
    #balam-warranties-filters-form select,
    #balam-warranties-filters-form .balam-select,
    #balam-warranties-filters-form .balam-select-trigger,
    .balam-purchase-orders-filters input,
    .balam-purchase-orders-filters select,
    .balam-purchase-orders-filters .balam-select,
    .balam-purchase-orders-filters .balam-select-trigger {
        flex: 0 0 auto !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: 42px !important;
        min-height: 42px !important;
        box-sizing: border-box !important;
    }

    #balam-filters-form .balam-list-filters-grid-primary > *,
    #balam-filters-form .balam-list-filters-grid-search > *,
    #balam-filters-form .balam-list-filters-period > *,
    #balam-filters-form .balam-filters-row > *,
    #balam-warranties-filters-form .balam-filters-row > *,
    #balam-warranties-filters-form .balam-filters-row.search-row > *,
    .balam-purchase-orders-filters .balam-list-filters-grid-primary > *,
    .balam-purchase-orders-filters .balam-list-filters-grid-search > *,
    .balam-purchase-orders-filters .balam-list-filters-grid-search-compact > *,
    .balam-purchase-orders-filters .balam-filters-row > * {
        flex: 0 0 auto !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }

    #balam-filters-form input[type="date"],
    #balam-filters-form input[name="from"],
    #balam-filters-form input[name="to"],
    #balam-warranties-filters-form input[type="date"],
    #balam-warranties-filters-form input[name="from"],
    #balam-warranties-filters-form input[name="to"],
    .balam-purchase-orders-filters input[type="date"],
    .balam-purchase-orders-filters input[name="from"],
    .balam-purchase-orders-filters input[name="to"] {
        appearance: none !important;
        -webkit-appearance: none !important;
        border-radius: 999px !important;
    }

    #balam-shipments-filters-form,
    #balam-shipments-filters-form.balam-front-filters,
    #balam-shipments-filters-form.balam-quotes-filters {
        width: calc(100vw - 86px) !important;
        max-width: 328px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        overflow: visible !important;
        box-sizing: border-box !important;
    }

    #balam-shipments-filters-form .balam-filters-controls,
    #balam-shipments-filters-form .balam-filters-row,
    #balam-shipments-filters-form .balam-quotes-top-row {
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        overflow: visible !important;
        box-sizing: border-box !important;
    }

    #balam-shipments-filters-form input,
    #balam-shipments-filters-form select,
    #balam-shipments-filters-form .balam-select,
    #balam-shipments-filters-form .balam-select-trigger {
        flex: 0 0 auto !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: 42px !important;
        min-height: 42px !important;
        box-sizing: border-box !important;
    }

    #balam-shipments-filters-form .balam-select {
        overflow: visible !important;
        position: relative !important;
        z-index: 1 !important;
    }

    #balam-shipments-filters-form .balam-select.is-open {
        overflow: visible !important;
        position: relative !important;
        z-index: 1000 !important;
    }

    #balam-shipments-filters-form .balam-select.is-open .balam-select-panel {
        max-width: 100% !important;
        width: 100% !important;
        z-index: 9999 !important;
    }

    #balam-shipments-filters-form .balam-quotes-top-row > *,
    #balam-shipments-filters-form .balam-filters-row > * {
        flex: 0 0 auto !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }

    #balam-shipments-filters-form input[type="date"],
    #balam-shipments-filters-form input[name="from"],
    #balam-shipments-filters-form input[name="to"] {
        appearance: none !important;
        -webkit-appearance: none !important;
        border-radius: 999px !important;
    }

    .balam-date-picker-popover.is-mobile {
        border: 1px solid #333 !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
        padding: 10px !important;
    }

    .balam-date-picker-popover.is-mobile > div {
        box-sizing: border-box !important;
        width: 100% !important;
    }

    .balam-shipments-export-actions {
        max-width: 328px !important;
        justify-content: center !important;
        flex-wrap: wrap !important;
        gap: 8px !important;
        margin-bottom: 16px !important;
    }

    .balam-shipments-export-actions .balam-btn {
        flex: 0 1 auto !important;
        min-width: 62px !important;
        max-width: 156px !important;
        height: 38px !important;
        min-height: 38px !important;
        padding: 0 13px !important;
        font-size: 11px !important;
        line-height: 1.1 !important;
        white-space: normal !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table,
    .balam-shipments-wrapper .balam-front-table.balam-shipments-table tbody {
        display: block !important;
        width: calc(100vw - 86px) !important;
        max-width: 328px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        overflow: visible !important;
        box-sizing: border-box !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table thead {
        display: none !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table tbody tr {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        align-items: flex-start !important;
        gap: 0 !important;
        width: 100% !important;
        max-width: 328px !important;
        min-width: 0 !important;
        margin: 0 auto 16px !important;
        padding: 18px 18px 16px !important;
        background: #fff !important;
        border: 1.5px solid #f2f2f2 !important;
        border-radius: 18px !important;
        box-shadow: none !important;
        box-sizing: border-box !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td,
    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label] {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        box-sizing: border-box !important;
        text-align: left !important;
        white-space: normal !important;
        word-break: normal !important;
        overflow-wrap: anywhere !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td::before,
    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td::after {
        content: none !important;
        display: none !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-client-seller-cell {
        order: 1 !important;
        flex: 0 0 100% !important;
        padding-right: 0 !important;
        margin-bottom: 10px !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-client-line {
        display: block !important;
        color: #333 !important;
        font-size: 15px !important;
        font-weight: 900 !important;
        line-height: 1.18 !important;
        margin: 0 0 8px !important;
        text-transform: uppercase !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-seller-badge {
        background: color-mix(in srgb, var(--seller-color, #51b327) 26%, #fff) !important;
        color: #333 !important;
        margin: 0 0 8px !important;
        width: max-content !important;
        max-width: 100% !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-seller-badge::before {
        background: var(--seller-color, #51b327) !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-client-shipment-date {
        align-items: center !important;
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 8px !important;
        margin: 0 !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-date-group,
    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-warehouse-inline-row {
        align-items: center !important;
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        gap: 8px !important;
        margin: 0 !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-toggle-meta,
    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-meta-date,
    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-meta-time {
        color: #666 !important;
        font-size: 12px !important;
        font-weight: 600 !important;
        line-height: 1.2 !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-prefactura-cell {
        order: 2 !important;
        flex: 0 0 100% !important;
        margin: 2px 0 10px !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-prefactura-cell-inner {
        align-items: center !important;
        color: #333 !important;
        display: flex !important;
        flex-direction: row !important;
        gap: 10px !important;
        justify-content: flex-start !important;
        min-height: 0 !important;
        text-align: left !important;
        width: 100% !important;
        font-size: 13px !important;
        font-weight: 700 !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-folio-preview-trigger {
        align-items: center !important;
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
        display: inline-flex !important;
        height: 24px !important;
        justify-content: center !important;
        margin: 0 !important;
        padding: 0 !important;
        position: static !important;
        transform: none !important;
        width: 24px !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-folio-preview-trigger svg {
        height: 16px !important;
        width: 16px !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-products-cell {
        order: 3 !important;
        flex: 0 0 100% !important;
        margin: 0 0 12px !important;
        padding: 10px 0 !important;
        border-top: 1px solid #eee !important;
        border-bottom: 1px solid #eee !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-mini-products {
        color: #333 !important;
        display: block !important;
        font-family: "Feature Mono", "DM Sans", monospace !important;
        font-size: 13px !important;
        font-weight: 800 !important;
        line-height: 1.28 !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-mini-products li {
        margin: 0 !important;
        padding: 0 !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-quote-internal-note {
        margin-top: 8px !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Seguimiento"] {
        order: 5 !important;
        flex: 0 0 50% !important;
        width: 50% !important;
        padding-left: 0 !important;
        margin-bottom: 0 !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Paquetería / Entrega"] {
        order: 4 !important;
        flex: 0 0 50% !important;
        width: 50% !important;
        padding-right: 8px !important;
        margin-bottom: 0 !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-carrier-group {
        align-items: flex-start !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 5px !important;
        margin: 0 !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-carrier-text,
    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-delivery-text,
    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-carrier-destination {
        color: #333 !important;
        font-size: 12px !important;
        font-weight: 700 !important;
        line-height: 1.18 !important;
        text-transform: uppercase !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-carrier-group .balam-mobile-only {
        display: none !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-tracking-summary {
        align-items: flex-start !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 6px !important;
        margin-top: 8px !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-tracking-divider {
        display: none !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-docs-cell {
        order: 8 !important;
        flex: 0 0 100% !important;
        width: 100% !important;
        margin: 0 0 12px !important;
        padding: 10px 0 !important;
        border-top: 1px solid #eee !important;
        border-bottom: 1px solid #eee !important;
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
        align-items: center !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-doc-slot {
        display: flex !important;
        flex: none !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        align-items: center !important;
        justify-content: stretch !important;
        width: 100% !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-docs-cell form,
    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-invoice-form,
    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-proof {
        width: 100% !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-proof > div,
    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-invoice-doc,
    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-invoice-open {
        align-items: center !important;
        display: flex !important;
        justify-content: center !important;
        margin: 0 !important;
        width: 100% !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-docs-cell .balam-btn,
    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-docs-cell label.balam-btn {
        width: 100% !important;
        min-width: 0 !important;
        height: 34px !important;
        min-height: 34px !important;
        padding: 0 10px !important;
        justify-content: center !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-docs-cell input[type="file"] + label,
    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-docs-cell input[type="file"] {
        max-width: 100% !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Acciones"] {
        order: 7 !important;
        flex: 0 0 100% !important;
        width: 100% !important;
        margin: 0 !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-mobile-control-row {
        border: 0 !important;
        display: block !important;
        flex: 0 0 100% !important;
        margin: 0 0 8px !important;
        order: 6 !important;
        padding: 0 !important;
        width: 100% !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-mobile-control-row::before {
        display: none !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-mobile-control-grid {
        align-items: center !important;
        display: grid !important;
        gap: 8px !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        width: 100% !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-mobile-control-slot {
        align-items: center !important;
        display: flex !important;
        justify-content: flex-start !important;
        min-height: 24px !important;
        min-width: 0 !important;
        width: 100% !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-mobile-control-row .balam-mobile-control-delete-form,
    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-mobile-control-row .balam-mobile-warehouse-date-inline,
    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-mobile-control-row .balam-warehouse-inline-row {
        align-items: center !important;
        display: flex !important;
        justify-content: flex-start !important;
        margin: 0 !important;
        max-width: 55px !important;
        min-width: 55px !important;
        padding: 0 !important;
        width: 55px !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-mobile-control-row .balam-warehouse-edit-btn {
        align-items: center !important;
        background: #949494 !important;
        border-color: #4f4f4f !important;
        color: #fff !important;
        display: inline-flex !important;
        font-size: 10px !important;
        height: 24px !important;
        justify-content: center !important;
        margin: 0 !important;
        max-width: 55px !important;
        min-height: 24px !important;
        min-width: 55px !important;
        padding: 0 6px !important;
        width: 55px !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Acciones"] > div {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        gap: 8px !important;
        align-items: stretch !important;
        justify-content: stretch !important;
        width: 100% !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Acciones"] .balam-btn,
    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Acciones"] form {
        flex: 1 1 0 !important;
        min-width: 0 !important;
        width: auto !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Acciones"] form {
        display: flex !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Acciones"] form .balam-btn {
        width: 100% !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Acciones"] .balam-btn {
        height: 36px !important;
        min-height: 36px !important;
        padding: 0 10px !important;
        justify-content: center !important;
    }

    .balam-shipments-export-actions {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        justify-items: center !important;
        gap: 8px !important;
        width: calc(100vw - 86px) !important;
        max-width: 328px !important;
        margin: 0 auto 20px !important;
    }

    .balam-shipments-export-actions .balam-btn {
        display: inline-flex !important;
        flex: none !important;
        width: fit-content !important;
        max-width: 100% !important;
        min-width: 64px !important;
        height: 42px !important;
        min-height: 42px !important;
        padding: 0 16px !important;
        white-space: nowrap !important;
        font-size: 12px !important;
        line-height: 1 !important;
    }

    .balam-shipments-export-actions .balam-btn:nth-child(1) {
        grid-row: 1 !important;
    }

    .balam-shipments-export-actions .balam-btn:nth-child(2) {
        grid-row: 2 !important;
    }

    .balam-shipments-export-actions .balam-btn:nth-child(3) {
        grid-row: 3 !important;
    }

    .balam-front-content .balam-shipments-export-actions.balam-mobile-action-toolbar {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        width: 100% !important;
        max-width: 330px !important;
        margin: 0 auto 16px !important;
    }

    .balam-front-content .balam-shipments-export-actions.balam-mobile-action-toolbar .balam-btn {
        width: 100% !important;
        min-width: 0 !important;
        white-space: normal !important;
    }

    .balam-front-content .balam-shipments-export-actions.balam-mobile-action-toolbar .balam-btn:nth-child(1),
    .balam-front-content .balam-shipments-export-actions.balam-mobile-action-toolbar .balam-btn:nth-child(2),
    .balam-front-content .balam-shipments-export-actions.balam-mobile-action-toolbar .balam-btn:nth-child(3) {
        grid-row: auto !important;
    }

    .balam-front-content .balam-shipments-export-actions.balam-mobile-action-toolbar .balam-btn:nth-child(3):last-child {
        grid-column: 1 / -1 !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table tbody tr {
        align-items: flex-start !important;
        gap: 0 !important;
        padding: 18px 18px 17px !important;
        position: relative !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-client-seller-cell {
        padding-right: 34px !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-client-line {
        max-width: calc(100% - 26px) !important;
        padding-right: 0 !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-client-seller-cell > .balam-client-shipment-date {
        display: none !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-client-shipment-date .balam-date-text-wrapper {
        display: none !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-client-shipment-date {
        margin: 6px 0 0 !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-prefactura-cell .balam-client-shipment-date.balam-desktop-only {
        display: none !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-prefactura-cell {
        margin: 9px 0 9px !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-prefactura-cell-inner {
        border-bottom: 0 !important;
        display: grid !important;
        gap: 8px !important;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
        padding-bottom: 10px !important;
        width: 100% !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-folio-text,
    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-mobile-date-inline {
        display: block !important;
        color: #333 !important;
        font-size: 13px !important;
        font-weight: 700 !important;
        line-height: 1.2 !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-mobile-date-inline {
        text-align: left !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-folio-text.balam-desktop-only {
        display: none !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-folio-stack {
        align-items: flex-start !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 5px !important;
        min-width: 0 !important;
        width: 100% !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-mobile-date-control {
        align-items: flex-start !important;
        display: flex !important;
        justify-content: flex-start !important;
        margin-top: 6px !important;
        width: 100% !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-mobile-date-control .balam-warehouse-inline,
    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-mobile-date-control .balam-shipment-date-group,
    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-mobile-date-control .balam-date-btn-wrapper {
        align-items: flex-start !important;
        display: flex !important;
        justify-content: flex-start !important;
        width: auto !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-mobile-date-control .balam-warehouse-edit-btn[data-shipment-date-edit] {
        background: #949494 !important;
        border-color: #4f4f4f !important;
        color: #fff !important;
        font-size: 10px !important;
        height: 24px !important;
        min-height: 24px !important;
        min-width: 55px !important;
        padding: 0 6px !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-folio-preview-trigger {
        position: absolute !important;
        top: 18px !important;
        right: 18px !important;
        z-index: 2 !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-products-cell {
        order: 3 !important;
        flex: 0 0 100% !important;
        min-width: 100% !important;
        max-width: 100% !important;
        width: 100% !important;
        border-top: 0 !important;
        border-bottom: 0 !important;
        background-image: none !important;
        margin: 0 0 10px !important;
        padding: 0 !important;
        position: relative !important;
        box-sizing: border-box !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-products-cell::before,
    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-products-cell::after {
        content: none !important;
        display: none !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-products-cell::before {
        top: 0 !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-products-cell::after {
        bottom: 0 !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-mini-products {
        color: #333 !important;
        font-family: monospace !important;
        font-size: 14px !important;
        font-weight: 500 !important;
        letter-spacing: 0 !important;
        line-height: 1.4 !important;
        list-style: none !important;
        margin: 8px 0 10px !important;
        padding: 9px 0 !important;
        border-top: 1px solid #333333 !important;
        border-bottom: 1px solid #333333 !important;
        box-sizing: border-box !important;
        width: 100% !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-mini-products::before {
        content: none !important;
        display: none !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-mini-products li {
        margin: 0 !important;
        padding: 0 !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Seguimiento"] {
        align-items: flex-start !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 8px !important;
        justify-content: flex-start !important;
        padding-left: 0 !important;
        text-align: left !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Seguimiento"] > * {
        margin-left: 0 !important;
        margin-right: auto !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Seguimiento"] .balam-warehouse-inline,
    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Seguimiento"] .balam-warehouse-inline-row,
    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Seguimiento"] .balam-tracking-summary {
        align-items: flex-start !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: flex-start !important;
        margin-left: 0 !important;
        margin-right: auto !important;
        text-align: left !important;
        width: auto !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Seguimiento"] .balam-toggle-meta,
    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Seguimiento"] .balam-shipment-meta-date,
    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Seguimiento"] .balam-shipment-meta-time {
        display: block !important;
        text-align: left !important;
        width: auto !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Seguimiento"] .balam-warehouse-inline-row > div,
    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Seguimiento"] .balam-warehouse-edit-btn {
        align-self: flex-start !important;
        display: inline-flex !important;
        justify-content: center !important;
        margin-left: 0 !important;
        margin-right: auto !important;
        text-align: left !important;
        width: auto !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Seguimiento"] .balam-warehouse-edit-btn {
        margin: 0 !important;
        height: 24px !important;
        min-height: 24px !important;
        min-width: 55px !important;
        padding: 0 6px !important;
        background: #949494 !important;
        border-color: #4f4f4f !important;
        color: #fff !important;
        font-size: 10px !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Seguimiento"] .balam-warehouse-edit-btn[data-warehouse-edit] {
        display: none !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Seguimiento"] .balam-warehouse-inline-row {
        gap: 0 !important;
        margin-top: 0 !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Seguimiento"] .balam-warehouse-inline-row > div {
        margin-bottom: 0 !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Seguimiento"] .balam-warehouse-inline-row > div:has(.balam-warehouse-edit-btn[data-warehouse-edit]) {
        display: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Seguimiento"] > .balam-warehouse-inline > .balam-badge {
        margin-bottom: 4px !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-mobile-carrier-delete-form {
        align-self: flex-start !important;
        display: none !important;
        justify-content: flex-start !important;
        margin: 8px 0 0 50% !important;
        max-width: 55px !important;
        min-width: 55px !important;
        width: 55px !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-mobile-carrier-delete-form .balam-warehouse-edit-btn {
        height: 24px !important;
        min-height: 24px !important;
        min-width: 55px !important;
        max-width: 55px !important;
        width: 55px !important;
        padding: 0 6px !important;
        background: #949494 !important;
        border-color: #4f4f4f !important;
        color: #fff !important;
        font-size: 10px !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-docs-cell input[type="file"] {
        clip: rect(0 0 0 0) !important;
        clip-path: inset(50%) !important;
        height: 1px !important;
        margin: -1px !important;
        opacity: 0 !important;
        overflow: hidden !important;
        padding: 0 !important;
        position: absolute !important;
        white-space: nowrap !important;
        width: 1px !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Acciones"] > div,
    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-actions-grid {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 8px !important;
        align-items: stretch !important;
        justify-content: stretch !important;
        width: 100% !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Acciones"] .balam-btn,
    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Acciones"] form {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Acciones"] form {
        display: block !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Acciones"] form .balam-btn {
        width: 100% !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Acciones"] a[href*="mode=edit"] {
        order: 1 !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Acciones"] a[href*="type=shipment"] {
        order: 2 !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Acciones"] .balam-whatsapp-quote-btn {
        order: 3 !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Acciones"] .balam-cancel-shipment-form {
        order: 4 !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Acciones"] .balam-delete-shipment-form {
        order: 5 !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-mobile-carrier-delete-form {
        margin: 0 !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Paquetería / Entrega"]:has(.status-local) .balam-mobile-carrier-delete-form {
        margin-top: 0 !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Acciones"] {
        margin: 8px 0 14px !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Acciones"] .balam-btn,
    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Acciones"] form {
        min-width: 0 !important;
        width: 100% !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Acciones"] .balam-btn {
        font-size: 10px !important;
        overflow: hidden !important;
        padding-left: 6px !important;
        padding-right: 6px !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Acciones"] a[href*="mode=edit"],
    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Acciones"] a[href*="type=shipment"] {
        grid-column: span 1 !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Acciones"] .balam-whatsapp-quote-btn {
        grid-column: span 1 !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Acciones"] .balam-cancel-shipment-form {
        grid-column: span 1 !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table td[data-label="Acciones"] .balam-delete-shipment-form:not(.balam-mobile-carrier-delete-form) {
        display: none !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-docs-cell {
        order: 8 !important;
        display: block !important;
        flex: 0 0 100% !important;
        flex-basis: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important;
        width: 100% !important;
        margin: 14px 0 0 !important;
        padding: 0 !important;
        border: 0 !important;
        box-sizing: border-box !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-docs-row {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
        align-items: center !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-docs-row > .balam-shipment-doc-slot,
    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-docs-row > .balam-shipment-invoice-cell {
        flex: 0 0 calc(50% - 4px) !important;
        max-width: 100% !important;
        width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        align-items: center !important;
        display: flex !important;
        justify-content: center !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-docs-row > .balam-shipment-doc-slot form,
    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-docs-row > .balam-shipment-invoice-cell form {
        flex: 0 0 100% !important;
        max-width: 100% !important;
        width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-docs-row > .balam-shipment-doc-slot > div,
    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-docs-row > .balam-shipment-invoice-cell > div {
        align-items: center !important;
        display: flex !important;
        justify-content: center !important;
        margin: 0 !important;
        width: 100% !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-docs-cell .balam-btn,
    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-docs-cell label.balam-btn {
        background: #fff !important;
        border: 1px solid #b8b8b8 !important;
        color: #4a4a4a !important;
        width: 100% !important;
        min-width: 0 !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-docs-cell .balam-btn span,
    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-docs-cell label.balam-btn span {
        color: inherit !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-mobile-control-grid {
        justify-items: start !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-mobile-control-slot {
        justify-content: flex-start !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-mobile-control-row .balam-mobile-control-delete-form,
    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-mobile-control-row .balam-mobile-warehouse-date-inline {
        justify-content: flex-start !important;
        margin-left: 0 !important;
        margin-right: auto !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-mobile-control-row .balam-mobile-warehouse-date-inline .balam-warehouse-inline-row,
    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-shipment-mobile-control-row .balam-mobile-warehouse-date-inline .balam-warehouse-inline-row > div {
        justify-content: flex-start !important;
        margin-left: 0 !important;
        margin-right: auto !important;
    }

    .balam-shipments-wrapper .balam-front-table.balam-shipments-table .balam-tracking-summary .balam-warehouse-edit-btn[data-tracking-open] {
        display: none !important;
    }
}

@media (max-width: 768px) {
    .balam-front .balam-front-table.balam-table-cards:not(.balam-minimum-alerts-table) .balam-inv-logistics {
        display: none !important;
    }

    .balam-front-content .balam-vacation-panel {
        box-sizing: border-box !important;
        margin: 16px 0 0 !important;
        padding: 0 !important;
        width: 100% !important;
    }

    .balam-front-content .balam-vacation-panel h4 {
        font-size: 12px !important;
        margin: 0 0 8px !important;
    }

    .balam-front-content .balam-vacation-table,
    .balam-front-content .balam-vacation-table tbody {
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
        margin: 0 !important;
        width: 100% !important;
    }

    .balam-front-content .balam-vacation-table thead {
        display: none !important;
    }

    .balam-front-content .balam-vacation-table tbody tr {
        align-self: stretch !important;
        background: #fff !important;
        border: 0 !important;
        border-radius: 14px !important;
        box-shadow: none !important;
        box-sizing: border-box !important;
        display: grid !important;
        gap: 7px 12px !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        margin: 0 !important;
        padding: 12px !important;
        width: 100% !important;
    }

    .balam-front-content .balam-vacation-table tbody td {
        align-items: flex-start !important;
        box-sizing: border-box !important;
        display: flex !important;
        flex-direction: column !important;
        font-size: 10px !important;
        justify-content: flex-start !important;
        line-height: 1.25 !important;
        margin: 0 !important;
        min-width: 0 !important;
        padding: 0 !important;
        text-align: left !important;
        width: 100% !important;
    }

    .balam-front-content .balam-vacation-table tbody td:nth-child(1),
    .balam-front-content .balam-vacation-table .balam-vacation-evidence-cell {
        grid-column: 1 / -1 !important;
    }

    .balam-front-content .balam-vacation-table .balam-vacation-status-cell,
    .balam-front-content .balam-vacation-table .balam-vacation-approval-cell {
        display: contents !important;
    }

    .balam-front-content .balam-vacation-table .balam-vacation-approval-cell > .balam-stack {
        display: contents !important;
    }

    .balam-front-content .balam-vacation-table .balam-vacation-evidence-cell:has(.balam-text-faint-strong) {
        display: none !important;
    }

    .balam-front-content .balam-vacation-table .balam-vacation-evidence-cell {
        grid-column: 1 / -1 !important;
        grid-row: 4 !important;
    }

    .balam-front-content .balam-vacation-table tbody td strong {
        font-size: 11px !important;
    }

    .balam-front-content .balam-vacation-table .balam-vacation-request-kind {
        font-size: 8px !important;
        margin-top: 2px !important;
    }

    .balam-front-content .balam-vacation-table .balam-vacation-status-stack,
    .balam-front-content .balam-vacation-table .balam-vacation-evidence-stack {
        align-items: flex-start !important;
        gap: 5px !important;
        justify-content: flex-start !important;
        width: 100% !important;
    }

    .balam-front-content .balam-vacation-table .balam-vacation-status-stack {
        display: contents !important;
    }

    .balam-front-content .balam-vacation-table .balam-vacation-status {
        grid-column: 1 / -1 !important;
        grid-row: 2 !important;
    }

    .balam-front-content .balam-vacation-table .balam-vacation-status-cell > .balam-vacation-status-stack > .balam-btn {
        background: #fff !important;
        border: 1px solid #333 !important;
        color: #333 !important;
        grid-column: 1 !important;
        grid-row: 3 !important;
    }

    .balam-front-content .balam-vacation-table .balam-vacation-evidence-stack {
        flex-direction: row !important;
        flex-wrap: wrap !important;
    }

    .balam-front-content .balam-vacation-table .balam-vacation-status,
    .balam-front-content .balam-vacation-table .balam-btn {
        font-size: 8px !important;
        max-width: 100% !important;
        min-height: 24px !important;
        padding: 5px 9px !important;
    }

    .balam-front-content .balam-vacation-table .balam-vacation-approval-form {
        align-items: center !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 6px !important;
        grid-column: 3 !important;
        grid-row: 3 !important;
    }

    .balam-front-content .balam-vacation-table .balam-vacation-approval-label {
        font-size: 8px !important;
    }

    .balam-front-content .balam-vacation-table .balam-vacation-delete-form {
        align-items: flex-start !important;
        grid-column: 2 !important;
        grid-row: 3 !important;
    }

    .balam-front-content .balam-session-card {
        padding: 5px 12px 10px !important;
    }

    .balam-front-content .balam-session-head {
        margin-bottom: 8px !important;
    }

    .balam-front-content .balam-session-type-badge {
        display: inline-flex !important;
        font-size: 10px !important;
        gap: 10px !important;
        line-height: 1 !important;
        margin: 3px 0 4px !important;
        padding: 5px 12px !important;
    }

    .balam-front-content .balam-session-meta {
        line-height: 1.25 !important;
        margin: 0 !important;
    }
}

/* Keep vacation rows full width after all generic table rules are loaded. */
@media (max-width: 760px) {
    .balam-vacation-days-form,
    .balam-vacation-days-table,
    .balam-vacation-days-table > tbody,
    .balam-vacation-days-table > tbody > tr {
        box-sizing: border-box !important;
        flex: 0 0 100% !important;
        inline-size: 100% !important;
        max-inline-size: none !important;
        min-inline-size: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
    }

    .balam-vacation-days-form {
        align-self: stretch !important;
        display: block !important;
        max-width: none !important;
    }

    .balam-vacation-days-table {
        display: block !important;
        table-layout: fixed !important;
    }

    .balam-vacation-days-table > tbody {
        display: block !important;
    }

    .balam-vacation-days-table > tbody > tr {
        display: grid !important;
    }
}
.balam-vacation-days-head h3 {
    display: none !important;
}
.balam-front-content:has(.balam-vacation-days-table) h3 {
    display: none !important;
}

/* Keep warranty cards at the full content width after table-to-card conversion. */
@media (max-width: 760px) {
    .balam-front-content .balam-warranties-wrapper,
    .balam-front-content .balam-warranties-table,
    .balam-front-content .balam-warranties-table > tbody,
    .balam-front-content .balam-warranties-table > tbody > tr {
        box-sizing: border-box !important;
        max-width: none !important;
        min-width: 0 !important;
        width: 100% !important;
    }
}
.balam-warranty-order-fields-grid {
    align-items: end !important;
    display: grid !important;
    gap: 15px !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    max-width: none !important;
}

.balam-warranty-order-fields-grid .balam-warranty-filter-field {
    min-width: 0 !important;
    width: 100% !important;
}

.balam-warranty-order-fields-grid .balam-warranty-filter-field-order {
    grid-column: span 2 !important;
}

.balam-warranty-order-fields-grid .balam-warranty-filter-field select {
    max-width: none !important;
    width: 100% !important;
}

.balam-warranty-order-fields-grid .balam-warranty-filter-field > .balam-select {
    display: block !important;
    max-width: none !important;
    min-width: 0 !important;
    width: 100% !important;
}

.balam-warranty-manual-product-picker > .balam-label,
.balam-warranty-manual-fields .balam-label > .balam-select {
    max-width: none !important;
    width: 100% !important;
}

.balam-num-control {
    box-sizing: border-box;
    height: 34px !important;
    min-height: 34px !important;
    width: 100% !important;
}

.balam-num-control input,
.balam-num-control .balam-num-btn {
    height: 100% !important;
    min-height: 0 !important;
}

@media (max-width: 700px) {
    .balam-warranty-order-fields-grid {
        grid-template-columns: 1fr !important;
    }

    .balam-warranty-order-fields-grid .balam-warranty-filter-field-order {
        grid-column: auto !important;
    }
}

@media (max-width: 768px) {
    .balam-quote-form-card .balam-project-toggle input[type="checkbox"] {
        box-sizing: border-box !important;
        flex: 0 0 18px !important;
        width: 18px !important;
        height: 18px !important;
        min-width: 18px !important;
        min-height: 18px !important;
        margin: 0 !important;
    }

    .balam-quote-form-card .balam-products-inputs .balam-num-control {
        display: grid !important;
        grid-template-columns: 44px minmax(0, 1fr) 44px !important;
        align-items: center !important;
        padding: 0 4px !important;
    }

    .balam-quote-form-card .balam-products-inputs .balam-num-control input {
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        height: 100% !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 4px !important;
        border: 0 !important;
        background: transparent !important;
        color: #333 !important;
        -webkit-text-fill-color: #333 !important;
        font-size: 14px !important;
        font-weight: 700 !important;
        line-height: 1 !important;
        opacity: 1 !important;
        text-align: center !important;
    }

    .balam-quote-form-card .balam-products-inputs .balam-num-control .balam-num-btn {
        width: 44px !important;
        min-width: 44px !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .balam-quote-form-card .balam-quote-discount-label {
        align-items: flex-start !important;
        flex-direction: column !important;
        gap: 6px !important;
    }

    .balam-quote-form-card .balam-quote-discount-label input[type="checkbox"] {
        margin: 0 !important;
    }

    .balam-quote-form-card .balam-quote-totals-table #balam-discount-controls.balam-is-hidden {
        display: none !important;
    }

    .balam-quote-form-card .balam-quote-totals .balam-actions-stack {
        margin-top: 18px !important;
    }

    .balam-front .balam-clients-map-choice input[data-map-view-choice] {
        -webkit-appearance: none !important;
        appearance: none !important;
        background: #fff !important;
        background-image: none !important;
        border: 1.5px solid #999 !important;
        border-radius: 3px !important;
        box-shadow: none !important;
        box-sizing: border-box !important;
        cursor: pointer !important;
        display: inline-block !important;
        flex: 0 0 17px !important;
        height: 17px !important;
        margin: 0 !important;
        min-height: 17px !important;
        padding: 0 !important;
        position: relative !important;
        width: 17px !important;
    }

    .balam-front .balam-clients-map-choice input[data-map-view-choice]:checked {
        border-color: #2f8425 !important;
    }

    .balam-front .balam-clients-map-choice input[data-map-view-choice]:checked::after {
        border: solid #2f8425 !important;
        border-width: 0 2px 2px 0 !important;
        content: "" !important;
        display: block !important;
        height: 9px !important;
        left: 5px !important;
        position: absolute !important;
        top: 1px !important;
        transform: rotate(45deg) !important;
        width: 4px !important;
    }

    .balam-front .balam-clients-map-filters .balam-select,
    .balam-front .balam-clients-map-filters .balam-select-trigger {
        background: #fff !important;
        border-radius: 999px !important;
        box-sizing: border-box !important;
        height: 42px !important;
        min-height: 42px !important;
        width: 100% !important;
    }

    .balam-front .balam-clients-map-filters .balam-select-trigger {
        border: 1px solid #333 !important;
        box-shadow: none !important;
    }

    .balam-front .balam-clients-map-filters .balam-select-panel .balam-select-search {
        background: #fff !important;
        border: 1px solid #333 !important;
        border-radius: 999px !important;
        box-shadow: none !important;
        box-sizing: border-box !important;
        height: 38px !important;
        min-height: 38px !important;
        padding: 0 13px !important;
    }

    body .balam-front .balam-front-content input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="file"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="image"]):not([type="range"]):not([type="color"]),
    body .balam-front .balam-front-content select:not([multiple]),
    body .balam-front .balam-front-content .balam-select .balam-select-trigger,
    body .balam-front .balam-front-content .balam-num-control,
    body .balam-front .balam-front-content .balam-custom-num-input,
    body .balam-front .balam-front-content .balam-btn.size-normal {
        box-sizing: border-box !important;
        height: var(--balam-control-height) !important;
        min-height: var(--balam-control-height) !important;
    }

    body .balam-front .balam-front-content .balam-num-control input,
    body .balam-front .balam-front-content .balam-custom-num-input input,
    body .balam-front .balam-front-content .balam-num-control .balam-num-btn,
    body .balam-front .balam-front-content .balam-custom-num-input .balam-num-btn {
        height: 100% !important;
        min-height: 0 !important;
    }

    body .balam-front .balam-front-content input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="file"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="image"]):not([type="range"]):not([type="color"]),
    body .balam-front .balam-front-content select:not([multiple]),
    body .balam-front .balam-front-content .balam-select .balam-select-trigger,
    body .balam-front .balam-front-content .balam-num-control input,
    body .balam-front .balam-front-content .balam-custom-num-input input {
        color: var(--balam-control-text-color, #333) !important;
        font-family: "DM Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
        font-size: var(--balam-control-font-size, 12px) !important;
        font-weight: var(--balam-control-font-weight, 500) !important;
        line-height: 1.2 !important;
    }

    body .balam-front .balam-front-content :where(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="file"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="image"]):not([type="range"]):not([type="color"])):focus,
    body .balam-front .balam-front-content select:not([multiple]):focus,
    body .balam-front .balam-front-content .balam-select .balam-select-trigger:focus,
    body .balam-front .balam-front-content .balam-select .balam-select-trigger:focus-visible,
    body .balam-front .balam-front-content .balam-select.is-open .balam-select-trigger,
    body .balam-front .balam-front-content textarea:focus,
    body .balam-front .balam-front-content textarea:focus-visible,
    body .balam-front .balam-front-content .balam-num-control:focus-within,
    body .balam-front .balam-front-content .balam-custom-num-input:focus-within {
        border-color: var(--balam-control-focus-color) !important;
        box-shadow: 0 0 0 3px var(--balam-control-focus-ring) !important;
        outline: 0 !important;
    }

    body .balam-front .balam-front-content .balam-num-control input:focus,
    body .balam-front .balam-front-content .balam-custom-num-input input:focus {
        border: 0 !important;
        box-shadow: none !important;
        outline: 0 !important;
    }

    body .balam-front .balam-front-content textarea,
    body .balam-select-panel .balam-select-search,
    body .balam-select-panel .balam-select-option:not(.is-active) {
        color: var(--balam-control-text-color, #333) !important;
        font-family: "DM Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
        font-size: var(--balam-control-font-size, 12px) !important;
        font-weight: var(--balam-control-font-weight, 500) !important;
    }

    body .balam-select-panel .balam-select-search {
        border: 1px solid #333 !important;
    }

    body .balam-front .balam-front-content textarea {
        line-height: 1.35 !important;
        min-height: 76px !important;
    }

    body .balam-front .balam-front-content input::placeholder,
    body .balam-front .balam-front-content textarea::placeholder,
    body .balam-select-panel .balam-select-search::placeholder {
        color: #909090 !important;
        font-family: "DM Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
        font-size: var(--balam-control-font-size, 12px) !important;
        font-weight: var(--balam-control-font-weight, 500) !important;
        opacity: 1 !important;
    }

    body .balam-select-panel .balam-select-search:focus,
    body .balam-select-panel .balam-select-search:focus-visible {
        border-color: var(--balam-control-focus-color, #50b428) !important;
        box-shadow: 0 0 0 3px var(--balam-control-focus-ring, rgba(80, 180, 40, 0.14)) !important;
        outline: 0 !important;
    }

    body .balam-front .balam-front-content select.is-placeholder,
    body .balam-front .balam-front-content .balam-select.is-placeholder .balam-select-trigger,
    body .balam-modal select.is-placeholder,
    body .balam-modal .balam-select.is-placeholder .balam-select-trigger {
        color: #909090 !important;
    }

    body .balam-front .balam-front-content .balam-quote-form-card .balam-quote-discount-label {
        align-items: flex-start !important;
        box-sizing: border-box !important;
        width: 100% !important;
    }

    body .balam-front .balam-front-content .balam-quote-form-card .balam-quote-discount-label input[type="checkbox"] {
        align-self: flex-start !important;
        display: block !important;
        flex: 0 0 18px !important;
        width: 18px !important;
        max-width: 18px !important;
        min-width: 18px !important;
        height: 18px !important;
        min-height: 18px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    body .balam-front .balam-front-content .balam-quote-form-card .balam-quote-items-table tbody td::before {
        content: none !important;
        display: none !important;
    }

    body .balam-front .balam-front-content .balam-quote-form-card .balam-num-control {
        display: grid !important;
        grid-template-columns: 28px minmax(0, 1fr) 28px !important;
        align-items: center !important;
        gap: 10px !important;
        padding: 0 10px !important;
    }

    body .balam-front .balam-front-content .balam-quote-form-card .balam-num-control input {
        background: transparent !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        padding: 0 !important;
    }

    body .balam-front .balam-front-content .balam-quote-form-card .balam-num-control .balam-num-btn {
        align-items: center !important;
        align-self: center !important;
        display: flex !important;
        justify-content: center !important;
        width: 28px !important;
        height: 28px !important;
        min-width: 28px !important;
        min-height: 28px !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 999px !important;
        background: #f2f2f2 !important;
        color: #333 !important;
        font-size: 18px !important;
        line-height: 1 !important;
    }

    .balam-modal input.balam-input-lg,
    .balam-modal select.balam-input-lg {
        border: 1px solid #333 !important;
        height: var(--balam-control-height) !important;
        min-height: var(--balam-control-height) !important;
    }

    .balam-modal .balam-front-filters .balam-select-trigger {
        border: 1px solid #333 !important;
    }

    #balamRemSenderModal .balam-front-filters,
    #balamAddressModal .balam-front-filters {
        gap: 7px !important;
        margin-bottom: 7px !important;
    }

    #balamRemSenderModal .balam-modal-footer-split,
    #balamAddressModal .balam-modal-footer-split {
        align-items: stretch !important;
        flex-direction: column !important;
    }

    #balamRemSenderModal .balam-modal-footer-split > .balam-actions,
    #balamRemSenderModal #balam-rem-sender-delete-wrap,
    #balamAddressModal .balam-modal-footer-split > .balam-actions,
    #balamAddressModal #balam-address-delete-wrap {
        display: contents !important;
    }

    #balam-rem-sender-save,
    #balam-address-save {
        order: 1;
    }

    #balam-rem-sender-cancel,
    #balam-address-cancel {
        order: 2;
    }

    #balam-rem-sender-delete,
    #balam-address-delete {
        order: 3;
    }

    #balamRemSenderModal .balam-modal-footer-split .balam-btn,
    #balamAddressModal .balam-modal-footer-split .balam-btn {
        width: 100% !important;
    }

    #balamAddressModal label:has(#balamAddressDefault) {
        align-items: center !important;
        flex-direction: column !important;
        justify-content: center !important;
        text-align: center !important;
        width: 100% !important;
    }

    #balamAddressDefault {
        -webkit-appearance: auto !important;
        appearance: auto !important;
        accent-color: #333 !important;
        background: none !important;
        border: initial !important;
        border-radius: 3px !important;
        box-shadow: none !important;
        display: block !important;
        flex: 0 0 18px !important;
        height: 18px !important;
        margin: 0 !important;
        min-height: 18px !important;
        min-width: 18px !important;
        padding: 0 !important;
        width: 18px !important;
    }

    .balam-shipment-products-summary .balam-shipments-items-table,
    .balam-shipment-products-summary .balam-shipments-items-table tbody {
        display: block !important;
        width: 100% !important;
    }

    .balam-shipment-products-summary .balam-shipments-items-table tbody tr {
        background: #fff !important;
        border: 1.5px solid #f2f2f2 !important;
        border-radius: 18px !important;
        box-shadow: none !important;
        box-sizing: border-box !important;
        display: grid !important;
        gap: 0 12px !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        margin: 0 0 10px !important;
        padding: 14px !important;
        width: 100% !important;
    }

    .balam-shipment-products-summary .balam-shipments-items-table tbody td:first-child {
        display: none !important;
    }

    .balam-shipment-products-summary .balam-shipments-items-table tbody td:nth-child(2) {
        border-bottom: 1px solid #eee !important;
        display: block !important;
        font-size: 13px !important;
        font-weight: 800 !important;
        grid-column: 1 / -1 !important;
        margin: 0 0 10px !important;
        padding: 0 0 10px !important;
    }

    .balam-shipment-products-summary .balam-shipments-items-table tbody td:nth-child(2)::before {
        content: none !important;
        display: none !important;
    }

    .balam-shipment-products-summary .balam-shipments-items-table tbody td:nth-child(2)::after {
        content: " (" attr(data-qty) "pz)";
    }

    .balam-shipment-products-summary .balam-shipments-items-table tbody td:nth-child(3),
    .balam-shipment-products-summary .balam-shipments-items-table tbody td:nth-child(4) {
        align-items: flex-start !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 4px !important;
        min-width: 0 !important;
        padding: 0 !important;
    }

    .balam-shipment-products-summary .balam-shipments-items-table tbody td:nth-child(3)::before,
    .balam-shipment-products-summary .balam-shipments-items-table tbody td:nth-child(4)::before {
        display: block !important;
        font-size: 10px !important;
        line-height: 1.2 !important;
    }
}