/* =========================================================
   AL MAXIMO POS - IDENTIDAD VISUAL GLOBAL
   Fase 1: colores, marcos, esquinas y consistencia general
   Fecha: 2026-05-09
   ========================================================= */

:root{
    --amx-blue: #1456D9;
    --amx-blue-dark: #0B3E9E;
    --amx-blue-soft: #EEF4FF;
    --amx-blue-border: #BFD3FF;

    --amx-orange: #FF4F1F;
    --amx-orange-dark: #E33E13;
    --amx-orange-soft: #FFF2EC;
    --amx-orange-border: #FFC2AD;

    --amx-bg: #F2F5F8;
    --amx-card: #FFFFFF;
    --amx-border: #DDE5EE;
    --amx-border-strong: #C9D4E2;

    --amx-text: #263238;
    --amx-muted: #6B7785;
    --amx-soft-gray: #F7F9FB;

    --amx-radius: 14px;
    --amx-radius-sm: 10px;
    --amx-shadow: 0 4px 14px rgba(20, 40, 70, .07);
}

/* Fondo y tipografía general */
body:not(.lockscreen),
.content-wrapper{
    background: var(--amx-bg) !important;
    color: var(--amx-text) !important;
}

body,
h1, h2, h3, h4, h5, h6,
.content-header > h1,
.box-title{
    color: var(--amx-text) !important;
}

/* Header superior: azul institucional sólido, sin morado */
.skin-blue .main-header .navbar,
.skin-blue-light .main-header .navbar,
.skin-black .main-header .navbar,
.skin-black-light .main-header .navbar{
    background: var(--amx-blue) !important;
    background-image: none !important;
}

.skin-blue .main-header .logo,
.skin-blue-light .main-header .logo,
.skin-black .main-header .logo,
.skin-black-light .main-header .logo{
    background: var(--amx-blue-dark) !important;
    color: #fff !important;
}

.skin-blue .main-header .logo:hover,
.skin-blue-light .main-header .logo:hover,
.skin-black .main-header .logo:hover,
.skin-black-light .main-header .logo:hover{
    background: var(--amx-blue-dark) !important;
}

/* Sidebar: mantener sobrio y compatible */
.skin-blue .main-sidebar,
.skin-black .main-sidebar,
.skin-green .main-sidebar,
.skin-purple .main-sidebar,
.skin-red .main-sidebar,
.skin-yellow .main-sidebar{
    background: #202735 !important;
}

.skin-blue .sidebar-menu > li.active > a,
.skin-blue .sidebar-menu > li.menu-open > a,
.skin-blue .sidebar-menu > li:hover > a,
.skin-black .sidebar-menu > li.active > a,
.skin-black .sidebar-menu > li.menu-open > a,
.skin-black .sidebar-menu > li:hover > a{
    background: #17202D !important;
    border-left-color: var(--amx-orange) !important;
}

/* Bloques principales globales */
.box,
.info-box,
.nav-tabs-custom,
.modal-content,
.panel,
.well{
    border-radius: var(--amx-radius) !important;
    border: 1px solid var(--amx-border) !important;
    box-shadow: var(--amx-shadow) !important;
    background: var(--amx-card) !important;
    overflow: hidden;
}

.box{
    border-top: 1px solid var(--amx-border) !important;
}

.box.box-primary,
.box.box-info,
.box.box-success,
.box.box-warning,
.box.box-danger,
.box.box-default{
    border-top-color: var(--amx-border) !important;
}

/* Encabezados de bloques */
.box-header,
.panel-heading,
.modal-header{
    background: #fff !important;
    color: var(--amx-text) !important;
    border-bottom: 1px solid var(--amx-border) !important;
}

.box-header .box-title,
.box-header > .fa,
.box-header > .glyphicon,
.box-header > .ion{
    color: var(--amx-text) !important;
}

.box-header > .fa,
.box-header > .glyphicon,
.box-header > .ion{
    color: var(--amx-orange) !important;
}

/* Bloques sólidos de AdminLTE */
.box.box-solid.box-primary,
.box.box-solid.box-info,
.box.box-solid.box-success,
.box.box-solid.box-warning,
.box.box-solid.box-danger{
    border: 1px solid var(--amx-border) !important;
}

.box.box-solid.box-primary > .box-header,
.box.box-solid.box-info > .box-header,
.box.box-solid.box-success > .box-header,
.box.box-solid.box-warning > .box-header,
.box.box-solid.box-danger > .box-header{
    background: var(--amx-blue) !important;
    color: #fff !important;
    border-bottom: 0 !important;
}

.box.box-solid.box-primary > .box-header .box-title,
.box.box-solid.box-info > .box-header .box-title,
.box.box-solid.box-success > .box-header .box-title,
.box.box-solid.box-warning > .box-header .box-title,
.box.box-solid.box-danger > .box-header .box-title{
    color: #fff !important;
}

/* Forms */
.form-control,
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple,
.input-group-addon{
    border-radius: var(--amx-radius-sm) !important;
    border-color: var(--amx-border-strong) !important;
    color: var(--amx-text) !important;
}

.input-group .form-control:first-child,
.input-group-addon:first-child,
.input-group-btn:first-child > .btn{
    border-top-left-radius: var(--amx-radius-sm) !important;
    border-bottom-left-radius: var(--amx-radius-sm) !important;
}

.input-group .form-control:last-child,
.input-group-addon:last-child,
.input-group-btn:last-child > .btn{
    border-top-right-radius: var(--amx-radius-sm) !important;
    border-bottom-right-radius: var(--amx-radius-sm) !important;
}

.input-group-addon{
    background: var(--amx-soft-gray) !important;
    color: var(--amx-muted) !important;
}

.form-control:focus,
.select2-container--default.select2-container--open,
.select2-container--default .select2-search--dropdown .select2-search__field,
.select2-container--default.select2-container--focus .select2-selection--multiple{
    border-color: var(--amx-blue) !important;
    box-shadow: 0 0 0 2px rgba(20, 86, 217, .10) !important;
}

/* Select2 */
.select2-container--default .select2-results__option--highlighted[aria-selected]{
    background: var(--amx-blue) !important;
    color: #fff !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice{
    background: var(--amx-blue) !important;
    border-color: var(--amx-blue-dark) !important;
    color: #fff !important;
    border-radius: 999px !important;
}

/* Botones base */
.btn,
.tw-dw-btn{
    border-radius: var(--amx-radius-sm) !important;
    font-weight: 700 !important;
    box-shadow: none !important;
}

/* Primarios: azul Al Máximo */
.btn-primary,
.tw-dw-btn-primary{
    background: var(--amx-blue) !important;
    border-color: var(--amx-blue) !important;
    color: #fff !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.tw-dw-btn-primary:hover,
.tw-dw-btn-primary:focus,
.tw-dw-btn-primary:active{
    background: var(--amx-blue-dark) !important;
    border-color: var(--amx-blue-dark) !important;
    color: #fff !important;
}

/* Info: NO azul pastel/cyan. Se vuelve azul institucional */
.btn-info,
.label-info,
.bg-aqua,
.bg-light-blue,
.progress-bar-info,
.progress-bar-aqua{
    background: var(--amx-blue) !important;
    border-color: var(--amx-blue) !important;
    color: #fff !important;
}

.btn-info:hover,
.btn-info:focus,
.btn-info:active{
    background: var(--amx-blue-dark) !important;
    border-color: var(--amx-blue-dark) !important;
}

/* Warning / acciones llamativas: naranja */
.btn-warning,
.bg-yellow,
.label-warning,
.progress-bar-warning,
.progress-bar-yellow{
    background: var(--amx-orange) !important;
    border-color: var(--amx-orange) !important;
    color: #fff !important;
}

.btn-warning:hover,
.btn-warning:focus,
.btn-warning:active{
    background: var(--amx-orange-dark) !important;
    border-color: var(--amx-orange-dark) !important;
}

/* Morado: prohibido visualmente; convertir a naranja */
.bg-purple,
.btn.bg-purple,
.label.bg-purple,
.text-purple{
    background: var(--amx-orange) !important;
    border-color: var(--amx-orange) !important;
    color: #fff !important;
}

/* Verde de encabezados/tablas: convertir a azul sobrio */
.bg-green,
.label-success,
.progress-bar-success,
.progress-bar-green{
    background: var(--amx-blue) !important;
    border-color: var(--amx-blue) !important;
    color: #fff !important;
}

/* Success button: dejar funcional pero más institucional */
.btn-success{
    background: var(--amx-blue) !important;
    border-color: var(--amx-blue) !important;
    color: #fff !important;
}

.btn-success:hover,
.btn-success:focus,
.btn-success:active{
    background: var(--amx-blue-dark) !important;
    border-color: var(--amx-blue-dark) !important;
}

/* Danger se queda rojo, pero más limpio */
.btn-danger{
    border-radius: var(--amx-radius-sm) !important;
}

/* Botones tipo borde: acciones secundarias */
.btn-border-primary,
.btn-default{
    background: #fff !important;
    border-color: var(--amx-border-strong) !important;
    color: var(--amx-text) !important;
}

.btn-border-primary:hover,
.btn-default:hover{
    background: var(--amx-blue-soft) !important;
    border-color: var(--amx-blue-border) !important;
    color: var(--amx-blue-dark) !important;
}

/* Botones app / acciones grandes */
.btn-app{
    border-radius: var(--amx-radius) !important;
    border: 1px solid var(--amx-border) !important;
    background: #fff !important;
    color: var(--amx-text) !important;
    box-shadow: var(--amx-shadow) !important;
}

.btn-app:hover{
    border-color: var(--amx-orange-border) !important;
    color: var(--amx-orange-dark) !important;
    background: var(--amx-orange-soft) !important;
}

/* Tablas */
.table-bordered,
.table-bordered > tbody > tr > td,
.table-bordered > tbody > tr > th,
.table-bordered > tfoot > tr > td,
.table-bordered > tfoot > tr > th,
.table-bordered > thead > tr > td,
.table-bordered > thead > tr > th{
    border-color: var(--amx-border) !important;
}

.table > thead > tr > th,
.box-table thead th{
    background: var(--amx-soft-gray) !important;
    color: var(--amx-text) !important;
    border-bottom-color: var(--amx-border-strong) !important;
}

.table-striped > tbody > tr:nth-of-type(odd){
    background-color: #FAFBFC !important;
}

/* Labels y badges */
.label,
.badge{
    border-radius: 999px !important;
    font-weight: 700 !important;
}

/* Paginación */
.pagination > li > a,
.pagination > li > span{
    color: var(--amx-text) !important;
    border-color: var(--amx-border) !important;
}

.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover{
    background: var(--amx-blue) !important;
    border-color: var(--amx-blue) !important;
    color: #fff !important;
}

/* Nav tabs */
.nav-tabs-custom > .nav-tabs > li.active{
    border-top-color: var(--amx-orange) !important;
}

.nav-pills > li.active > a,
.nav-pills > li.active > a:focus,
.nav-pills > li.active > a:hover{
    border-top-color: var(--amx-orange) !important;
    color: var(--amx-text) !important;
}

/* Alertas y callouts */
.callout.callout-info,
.alert-info{
    background: var(--amx-blue) !important;
    border-color: var(--amx-blue-dark) !important;
    color: #fff !important;
}

.callout.callout-warning,
.alert-warning{
    background: var(--amx-orange) !important;
    border-color: var(--amx-orange-dark) !important;
    color: #fff !important;
}

/* Tooltips/info icons genéricos */
.fa-info-circle,
.glyphicon-info-sign,
.text-info{
    color: var(--amx-orange) !important;
}

/* Quitar el azul pastel visualmente chillón de elementos Tailwind comunes */
.tw-bg-blue-400,
.tw-bg-blue-600,
.tw-bg-blue-700,
.tw-bg-cyan-300,
.tw-bg-cyan-400,
.tw-bg-primary-800{
    background-color: var(--amx-blue) !important;
}

.tw-text-cyan-500,
.tw-text-sky-500,
.tw-text-primary-700,
.tw-text-primary-800{
    color: var(--amx-blue) !important;
}

.tw-bg-purple-800,
.tw-from-purple-800,
.tw-to-purple-900{
    background-color: var(--amx-orange) !important;
    background-image: none !important;
}

/* Modales */
.modal-content{
    border-radius: var(--amx-radius) !important;
}

.modal-header{
    border-top-left-radius: var(--amx-radius) !important;
    border-top-right-radius: var(--amx-radius) !important;
}

.modal-footer{
    background: #fff !important;
    border-top: 1px solid var(--amx-border) !important;
}

/* DataTables / filtros */
.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper .dataTables_length select{
    border-radius: var(--amx-radius-sm) !important;
    border: 1px solid var(--amx-border-strong) !important;
}

/* Evitar que imágenes/tickets/prints se contaminen */
@media print{
    .box,
    .info-box,
    .nav-tabs-custom,
    .modal-content,
    .panel,
    .well{
        box-shadow: none !important;
    }
}


/* =========================================================
   AL MAXIMO POS - MENU LATERAL GLOBAL
   Fase 2: iconos, fuente y estados sin cambiar ancho del sidebar
   ========================================================= */

/* Menú principal: fuente un poco mayor sin agrandar demasiado la barra */
.main-sidebar .sidebar-menu > li > a{
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #334155 !important;
    letter-spacing: .01em;
}

/* Submenús: un poco más legibles, pero compactos */
.main-sidebar .treeview-menu > li > a{
    font-size: 13.5px !important;
    font-weight: 500 !important;
    color: #475569 !important;
}

/* Íconos principales: más presencia visual */
.main-sidebar .sidebar-menu > li > a > .fa,
.main-sidebar .sidebar-menu > li > a > .fas,
.main-sidebar .sidebar-menu > li > a > .far,
.main-sidebar .sidebar-menu > li > a > .fab,
.main-sidebar .sidebar-menu > li > a > .glyphicon,
.main-sidebar .sidebar-menu > li > a > .ion{
    color: var(--amx-blue) !important;
    font-size: 16px !important;
    width: 24px !important;
    opacity: .95 !important;
}

/* Íconos de submenú: sobrios */
.main-sidebar .treeview-menu > li > a > .fa,
.main-sidebar .treeview-menu > li > a > .fas,
.main-sidebar .treeview-menu > li > a > .far,
.main-sidebar .treeview-menu > li > a > .fab,
.main-sidebar .treeview-menu > li > a > .glyphicon,
.main-sidebar .treeview-menu > li > a > .ion{
    color: var(--amx-blue-dark) !important;
    font-size: 13px !important;
    opacity: .8 !important;
}

/* Hover del menú: azul muy suave */
.skin-blue-light .sidebar-menu > li:hover > a,
.skin-black-light .sidebar-menu > li:hover > a,
.skin-green-light .sidebar-menu > li:hover > a,
.skin-purple-light .sidebar-menu > li:hover > a,
.skin-red-light .sidebar-menu > li:hover > a,
.skin-yellow-light .sidebar-menu > li:hover > a{
    background: var(--amx-blue-soft) !important;
    color: var(--amx-blue-dark) !important;
}

/* Activo principal: más institucional, sin aumentar tamaño */
.skin-blue-light .sidebar-menu > li.active > a,
.skin-black-light .sidebar-menu > li.active > a,
.skin-green-light .sidebar-menu > li.active > a,
.skin-purple-light .sidebar-menu > li.active > a,
.skin-red-light .sidebar-menu > li.active > a,
.skin-yellow-light .sidebar-menu > li.active > a,
.skin-blue-light .sidebar-menu > li.menu-open > a,
.skin-black-light .sidebar-menu > li.menu-open > a,
.skin-green-light .sidebar-menu > li.menu-open > a,
.skin-purple-light .sidebar-menu > li.menu-open > a,
.skin-red-light .sidebar-menu > li.menu-open > a,
.skin-yellow-light .sidebar-menu > li.menu-open > a{
    background: #EAF1FF !important;
    color: var(--amx-blue-dark) !important;
    border-left-color: var(--amx-orange) !important;
}

/* Íconos activos/hover: naranja como acento */
.main-sidebar .sidebar-menu > li.active > a > .fa,
.main-sidebar .sidebar-menu > li.active > a > .fas,
.main-sidebar .sidebar-menu > li.active > a > .far,
.main-sidebar .sidebar-menu > li.active > a > .fab,
.main-sidebar .sidebar-menu > li.active > a > .glyphicon,
.main-sidebar .sidebar-menu > li.active > a > .ion,
.main-sidebar .sidebar-menu > li.menu-open > a > .fa,
.main-sidebar .sidebar-menu > li.menu-open > a > .fas,
.main-sidebar .sidebar-menu > li.menu-open > a > .far,
.main-sidebar .sidebar-menu > li.menu-open > a > .fab,
.main-sidebar .sidebar-menu > li.menu-open > a > .glyphicon,
.main-sidebar .sidebar-menu > li.menu-open > a > .ion,
.main-sidebar .sidebar-menu > li:hover > a > .fa,
.main-sidebar .sidebar-menu > li:hover > a > .fas,
.main-sidebar .sidebar-menu > li:hover > a > .far,
.main-sidebar .sidebar-menu > li:hover > a > .fab,
.main-sidebar .sidebar-menu > li:hover > a > .glyphicon,
.main-sidebar .sidebar-menu > li:hover > a > .ion{
    color: var(--amx-orange) !important;
    opacity: 1 !important;
}

/* Flechas del menú: menos pálidas */
.main-sidebar .sidebar-menu li > a > .pull-right-container,
.main-sidebar .sidebar-menu li > a > .fa-angle-left{
    color: #64748B !important;
}

/* Submenú abierto */
.skin-blue-light .sidebar-menu > li > .treeview-menu,
.skin-black-light .sidebar-menu > li > .treeview-menu,
.skin-green-light .sidebar-menu > li > .treeview-menu,
.skin-purple-light .sidebar-menu > li > .treeview-menu,
.skin-red-light .sidebar-menu > li > .treeview-menu,
.skin-yellow-light .sidebar-menu > li > .treeview-menu{
    background: #F4F7FB !important;
}

/* Submenú activo */
.main-sidebar .treeview-menu > li.active > a,
.main-sidebar .treeview-menu > li > a:hover{
    color: var(--amx-blue-dark) !important;
    background: #EAF1FF !important;
    font-weight: 700 !important;
}

/* Ajuste compacto: mejorar lectura sin crecer verticalmente */
.sidebar-menu > li > a{
    line-height: 20px !important;
}

.treeview-menu > li > a{
    line-height: 19px !important;
}

/* Menú colapsado: conservar legibilidad del icono */
.sidebar-mini.sidebar-collapse .sidebar-menu > li > a > .fa,
.sidebar-mini.sidebar-collapse .sidebar-menu > li > a > .fas,
.sidebar-mini.sidebar-collapse .sidebar-menu > li > a > .far,
.sidebar-mini.sidebar-collapse .sidebar-menu > li > a > .fab,
.sidebar-mini.sidebar-collapse .sidebar-menu > li > a > .glyphicon,
.sidebar-mini.sidebar-collapse .sidebar-menu > li > a > .ion{
    font-size: 17px !important;
    width: 20px !important;
}

/* AMX_MENU_NARANJA_SUAVE_INICIO */
/* Menú lateral Al Máximo POS - versión limpia final */

#side-bar{
    padding: 14px 10px !important;
    background: #ffffff !important;
}

/* Link principal */
#side-bar .amx-menu-link{
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    min-height: 38px !important;
    padding: 9px 11px !important;
    border-radius: 9px !important;
    color: #334155 !important;
    font-size: 15.5px !important;
    line-height: 1.28 !important;
    font-weight: 650 !important;
    letter-spacing: -0.01em !important;
    white-space: nowrap !important;
    transition: background .16s ease, color .16s ease, box-shadow .16s ease !important;
}

/* Texto */
#side-bar .amx-menu-text{
    min-width: 0 !important;
}

/* Iconos SVG principales */
#side-bar .amx-menu-link > svg:not(.amx-menu-arrow){
    width: 19px !important;
    height: 19px !important;
    min-width: 19px !important;
    color: #334155 !important;
    stroke-width: 1.8 !important;
}

/* Iconos FontAwesome principales */
#side-bar .amx-menu-link > i{
    width: 19px !important;
    min-width: 19px !important;
    text-align: center !important;
    color: #334155 !important;
    font-size: 15px !important;
}

/* Flecha */
#side-bar .amx-menu-arrow{
    width: 15px !important;
    height: 15px !important;
    color: #94A3B8 !important;
}

/* Hover normal */
#side-bar .amx-menu-link:hover{
    background: #FFF3ED !important;
    color: #0B3EA8 !important;
}

#side-bar .amx-menu-link:hover > svg:not(.amx-menu-arrow),
#side-bar .amx-menu-link:hover > i{
    color: #FF4F1F !important;
}

/* Activo sin hijos */
#side-bar .amx-menu-link.amx-menu-active{
    background: #FFE8DE !important;
    color: #0B3EA8 !important;
    font-weight: 800 !important;
    box-shadow: inset 3px 0 0 #FF4F1F !important;
}

#side-bar .amx-menu-link.amx-menu-active > svg:not(.amx-menu-arrow),
#side-bar .amx-menu-link.amx-menu-active > i{
    color: #1456D9 !important;
}

/* Grupo abierto */
#side-bar .amx-menu-group.amx-menu-open{
    background: #FFF7F2 !important;
    border-radius: 10px !important;
    padding: 0 0 7px 0 !important;
    box-shadow: inset 3px 0 0 rgba(255, 79, 31, .45) !important;
}

/* Botón principal de grupo abierto */
#side-bar .amx-menu-group.amx-menu-open > .amx-menu-link{
    background: #FFE6DB !important;
    color: #0B3EA8 !important;
    font-weight: 800 !important;
    border-radius: 9px !important;
    box-shadow: none !important;
}

#side-bar .amx-menu-group.amx-menu-open > .amx-menu-link > svg:not(.amx-menu-arrow),
#side-bar .amx-menu-group.amx-menu-open > .amx-menu-link > i{
    color: #FF4F1F !important;
}

#side-bar .amx-menu-group.amx-menu-open > .amx-menu-link .amx-menu-arrow{
    color: #FF4F1F !important;
}

/* Submenú */
#side-bar .amx-submenu-wrap{
    position: relative !important;
    margin: 5px 0 0 0 !important;
    padding: 4px 8px 0 38px !important;
}

/* Línea vertical del submenú */
#side-bar .amx-submenu-line{
    position: absolute !important;
    left: 20px !important;
    top: 5px !important;
    bottom: 4px !important;
    width: 1px !important;
    background: #FFD2C1 !important;
}

/* Lista interna */
#side-bar .amx-submenu-list{
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
}

/* Links submenú */
#side-bar .amx-submenu-link{
    display: flex !important;
    align-items: center !important;
    min-height: 31px !important;
    padding: 6px 8px !important;
    border-radius: 7px !important;
    color: #475569 !important;
    font-size: 14.5px !important;
    line-height: 1.28 !important;
    font-weight: 600 !important;
    letter-spacing: -0.01em !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    transition: background .16s ease, color .16s ease !important;
}

#side-bar .amx-submenu-link:hover{
    background: #FFEDE5 !important;
    color: #0B3EA8 !important;
}

/* Submenú activo */
#side-bar .amx-submenu-link.amx-submenu-active{
    background: #ffffff !important;
    color: #0057D9 !important;
    font-weight: 800 !important;
}

/* Header/separador si aparece */
#side-bar .amx-menu-header{
    padding: 10px 12px 5px 12px !important;
    color: #94A3B8 !important;
    font-size: 12px !important;
    line-height: 1.2 !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: .05em !important;
}

/* Evitar que clases grises de Tailwind ganen encima */
#side-bar .tw-bg-gray-100,
#side-bar .tw-bg-gray-200{
    background: transparent !important;
}

/* AMX_MENU_NARANJA_SUAVE_FIN */

/* AMX_HEADER_VISUAL_INICIO */
/* Header principal Al Máximo POS - primera capa visual */

.amx-main-header{
    background: linear-gradient(90deg, #0647C7 0%, #0B4FE0 48%, #0037A8 100%) !important;
    border-bottom: 1px solid rgba(255,255,255,.14) !important;
    box-shadow: 0 10px 28px rgba(15, 23, 42, .12) !important;
    position: relative !important;
    z-index: 30 !important;
}

.amx-main-header > div{
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}

/* Botones del header */
.amx-main-header button,
.amx-main-header a,
.amx-main-header summary{
    border-radius: 10px !important;
}

/* Botones azules internos */
.amx-main-header button[class*="tw-bg-"],
.amx-main-header a[class*="tw-bg-"],
.amx-main-header summary[class*="tw-bg-"]{
    background: rgba(255,255,255,.12) !important;
    border: 1px solid rgba(255,255,255,.18) !important;
    color: #ffffff !important;
    box-shadow: 0 6px 16px rgba(0, 24, 90, .16) !important;
    backdrop-filter: blur(6px) !important;
}

.amx-main-header button[class*="tw-bg-"]:hover,
.amx-main-header a[class*="tw-bg-"]:hover,
.amx-main-header summary[class*="tw-bg-"]:hover{
    background: rgba(255,255,255,.20) !important;
    border-color: rgba(255,255,255,.28) !important;
    transform: translateY(-1px) !important;
}

/* Botón POS: que destaque un poco más */
.amx-main-header a[href*="/pos/create"]{
    background: linear-gradient(135deg, #FF5A1F 0%, #FF7A1A 100%) !important;
    border-color: rgba(255,255,255,.24) !important;
    color: #ffffff !important;
    font-weight: 800 !important;
    box-shadow: 0 8px 20px rgba(255, 79, 31, .28) !important;
}

/* Fecha */
.amx-main-header .tw-font-mono{
    letter-spacing: .04em !important;
    font-weight: 800 !important;
}

/* Menús desplegables del header */
.amx-main-header ul[role="menu"]{
    border-radius: 14px !important;
    border: 1px solid #E2E8F0 !important;
    box-shadow: 0 18px 42px rgba(15, 23, 42, .18) !important;
    overflow: hidden !important;
}

/* AMX_HEADER_VISUAL_FIN */


/* AMX_SIDEBAR_BRAND_POS_INICIO */
/* Logo completo Al Máximo POS en cabecera del sidebar */

.side-bar > .amx-sidebar-brand{
    height: 62px !important;
    min-height: 62px !important;
    width: 100% !important;
    padding: 8px 14px !important;
    background: #ffffff !important;
    border-right: 1px solid #E2E8F0 !important;
    border-bottom: 1px solid #E2E8F0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 1px 0 rgba(15, 23, 42, .03) !important;
}

.side-bar > .amx-sidebar-brand img{
    display: block !important;
    width: auto !important;
    max-width: 212px !important;
    height: auto !important;
    max-height: 44px !important;
    object-fit: contain !important;
}

/* Que el menú empiece limpio debajo del logo */
#side-bar{
    border-right: 1px solid #E2E8F0 !important;
}

/* AMX_SIDEBAR_BRAND_POS_FIN */


/* AMX_HEADER_LOGO_KILL_INICIO */
/* Seguridad: no permitir logo de POS flotando dentro del header */
.amx-main-header .amx-header-brand,
.amx-main-header img[src*="almaximo-pos-full-logo"]{
    display: none !important;
}
/* AMX_HEADER_LOGO_KILL_FIN */

/* AMX_SIDEBAR_BRAND_POS_AJUSTE_2_INICIO */
.side-bar > .amx-sidebar-brand{
    height: 64px !important;
    min-height: 64px !important;
    padding: 6px 10px !important;
}

.side-bar > .amx-sidebar-brand img{
    max-width: 226px !important;
    max-height: 48px !important;
}
/* AMX_SIDEBAR_BRAND_POS_AJUSTE_2_FIN */


/* AMX_DASHBOARD_UNICO_LIMPIO_20260509_INICIO */

/* =========================
   Dashboard Al Máximo POS
   Bloque único, limpio y estable
   ========================= */

/* Fondo dashboard superior */
.amx-dashboard-hero,
.amx-dashboard-hero.tw-bg-gradient-to-r{
    background: #EEF3F8 !important;
    padding: 28px 24px 22px 24px !important;
    border-bottom: 1px solid #D7E2EE !important;
}

/* Neutralizar fondos azules internos del bloque KPI inferior */
.amx-dashboard-hero [class*="tw-bg-gradient-to-r"]{
    background: transparent !important;
}

/* Contenedor interno */
.amx-dashboard-hero > .tw-px-5{
    max-width: 1260px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-top: 0 !important;
}

/* Header del dashboard */
.amx-dashboard-topbar{
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    width: 100% !important;
    margin: 0 0 14px 0 !important;
    padding: 0 !important;
}

/* Quitar anchos heredados */
.amx-dashboard-topbar > div{
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Bienvenido */
.amx-dashboard-welcome{
    flex: 0 0 auto !important;
    display: flex !important;
    align-items: center !important;
}

.amx-dashboard-hero h1{
    color: #0B3EA8 !important;
    font-size: 22px !important;
    line-height: 34px !important;
    font-weight: 850 !important;
    letter-spacing: -0.03em !important;
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
    text-shadow: 0 8px 18px rgba(11, 62, 168, .10) !important;
}

/* Controles alineados a la derecha */
.amx-dashboard-location{
    margin-left: auto !important;
    flex: 0 0 auto !important;
    display: flex !important;
    align-items: center !important;
}

.amx-dashboard-action-buttons,
.amx-dashboard-date-filter{
    flex: 0 0 auto !important;
    display: flex !important;
    align-items: center !important;
}

.amx-dashboard-action-buttons{
    gap: 8px !important;
}

/* Select ubicación */
.amx-dashboard-hero .select2-container{
    width: 285px !important;
    min-width: 285px !important;
}

.amx-dashboard-hero .select2-container--default .select2-selection--single{
    height: 34px !important;
    min-height: 34px !important;
    border-radius: 9px !important;
    border: 1px solid #BFD0E3 !important;
    background: #FFFFFF !important;
    display: flex !important;
    align-items: center !important;
    box-shadow: 0 7px 18px rgba(15, 23, 42, .08) !important;
}

.amx-dashboard-hero .select2-container--default .select2-selection--single .select2-selection__rendered{
    height: 34px !important;
    line-height: 34px !important;
    padding-left: 36px !important;
    padding-right: 30px !important;
    color: #1E293B !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    position: relative !important;
}

.amx-dashboard-location .select2-container--default .select2-selection--single .select2-selection__rendered:before{
    content: "\f3c5" !important;
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    position: absolute !important;
    left: 14px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    color: #FF4F1F !important;
    font-size: 12px !important;
}

.amx-dashboard-hero .select2-container--default .select2-selection--single .select2-selection__arrow{
    height: 34px !important;
    top: 0 !important;
    right: 8px !important;
}

/* Botones superiores */
.amx-dashboard-hero #amx-pos-notice-btn,
.amx-dashboard-hero #amx-pos-suggested-btn,
.amx-dashboard-hero #dashboard_date_filter{
    height: 34px !important;
    min-height: 34px !important;
    padding: 0 13px !important;
    border-radius: 9px !important;
    border: 1px solid #BFD0E3 !important;
    background: #FFFFFF !important;
    color: #1E293B !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    white-space: nowrap !important;
    box-shadow: 0 7px 18px rgba(15, 23, 42, .08) !important;
}

.amx-dashboard-hero #amx-pos-notice-btn i,
.amx-dashboard-hero #amx-pos-suggested-btn i,
.amx-dashboard-hero #dashboard_date_filter i,
.amx-dashboard-hero #dashboard_date_filter svg{
    color: #FF4F1F !important;
    width: 14px !important;
    height: 14px !important;
    font-size: 14px !important;
}

/* Grid KPI */
.amx-dashboard-kpi-grid{
    width: 820px !important;
    max-width: 820px !important;
    margin: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(4, 197px) !important;
    gap: 10px !important;
    justify-content: start !important;
    align-items: start !important;
}

.amx-dashboard-kpi-grid-secondary{
    margin-top: 10px !important;
}

/* Contenedor de la segunda fila KPI: eliminar fondo/posicionamientos raros */
.amx-dashboard-hero .tw-relative{
    position: static !important;
}

.amx-dashboard-hero .tw-absolute.tw-inset-0{
    display: none !important;
}

.amx-dashboard-hero .tw-isolate{
    isolation: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Tarjetas KPI */
.amx-dashboard-kpi-grid > div{
    width: 197px !important;
    min-width: 197px !important;
    max-width: 197px !important;
    height: 54px !important;
    min-height: 54px !important;
    background: #FFFFFF !important;
    border: 1px solid #CBD5E1 !important;
    border-left: 3px solid #FF4F1F !important;
    border-radius: 9px !important;
    box-shadow: 0 8px 18px rgba(15, 23, 42, .08) !important;
    overflow: hidden !important;
    transform: none !important;
}

.amx-dashboard-kpi-grid > div:hover{
    transform: translateY(-1px) !important;
    box-shadow: 0 12px 24px rgba(15, 23, 42, .11) !important;
}

/* Padding interno */
.amx-dashboard-kpi-grid > div > div,
.amx-dashboard-kpi-grid .tw-p-4,
.amx-dashboard-kpi-grid .sm\:tw-p-5{
    padding: 7px 9px !important;
    height: 100% !important;
}

/* Layout interno de tarjeta */
.amx-dashboard-kpi-grid .tw-flex.tw-items-center{
    height: 100% !important;
    display: grid !important;
    grid-template-columns: 28px minmax(0, 1fr) !important;
    grid-template-rows: 16px 24px !important;
    column-gap: 7px !important;
    row-gap: 0 !important;
    align-items: center !important;
}

/* Corrige tarjetas cuyo contenedor interno no trae tw-flex-1 */
.amx-dashboard-kpi-grid .tw-flex.tw-items-center > div:not(.tw-rounded-full):not([class*="tw-inline-flex"]),
.amx-dashboard-kpi-grid .tw-flex-1,
.amx-dashboard-kpi-grid .tw-min-w-0{
    display: contents !important;
}

/* Título KPI */
.amx-dashboard-kpi-grid p.tw-text-sm{
    grid-column: 1 / 3 !important;
    grid-row: 1 !important;
    color: #0B3EA8 !important;
    font-size: 11.5px !important;
    line-height: 16px !important;
    font-weight: 850 !important;
    letter-spacing: -0.02em !important;
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    background: transparent !important;
}

/* Icono KPI */
.amx-dashboard-kpi-grid .tw-rounded-full{
    grid-column: 1 !important;
    grid-row: 2 !important;
    width: 24px !important;
    min-width: 24px !important;
    height: 24px !important;
    min-height: 24px !important;
    border-radius: 999px !important;
    align-self: center !important;
    justify-self: start !important;
}

.amx-dashboard-kpi-grid svg{
    width: 15px !important;
    height: 15px !important;
    stroke-width: 2.1 !important;
}

/* Cifra KPI */
.amx-dashboard-kpi-grid p.tw-font-mono,
.amx-dashboard-kpi-grid .total_sell,
.amx-dashboard-kpi-grid .net,
.amx-dashboard-kpi-grid .invoice_due,
.amx-dashboard-kpi-grid .total_sell_return,
.amx-dashboard-kpi-grid .total_purchase,
.amx-dashboard-kpi-grid .purchase_due,
.amx-dashboard-kpi-grid .total_purchase_return,
.amx-dashboard-kpi-grid .total_expense{
    grid-column: 2 !important;
    grid-row: 2 !important;
    color: #111827 !important;
    font-size: 15px !important;
    line-height: 24px !important;
    font-weight: 850 !important;
    margin: 0 !important;
    padding: 0 !important;
    letter-spacing: .01em !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* Icono de información */
.amx-dashboard-kpi-grid .fa-info-circle,
.amx-dashboard-hero .fa-info-circle,
.amx-dashboard-hero .text-info.fa-info-circle{
    color: #FF6B35 !important;
    background: #FFF1EA !important;
    border: 1px solid #FFB899 !important;
    width: 13px !important;
    height: 13px !important;
    min-width: 13px !important;
    border-radius: 999px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 8px !important;
    line-height: 1 !important;
    vertical-align: middle !important;
    margin-left: 4px !important;
    position: relative !important;
    top: -1px !important;
}

.amx-dashboard-kpi-grid .fa-info-circle:before,
.amx-dashboard-hero .fa-info-circle:before{
    content: "i" !important;
    font-family: Arial, sans-serif !important;
    font-weight: 900 !important;
    color: #FF6B35 !important;
}

/* Popover */
.popover{
    min-width: 280px !important;
    max-width: 390px !important;
    border-radius: 10px !important;
    border: 1px solid #CBD5E1 !important;
    box-shadow: 0 16px 35px rgba(15, 23, 42, .18) !important;
}

.popover-content,
.popover .popover-body{
    color: #334155 !important;
    font-size: 12.5px !important;
    line-height: 1.45 !important;
    padding: 11px 13px !important;
}

/* Cuerpo del dashboard */
.amx-dashboard-body{
    background: #EEF3F8 !important;
    padding-top: 16px !important;
}

/* Card de gráfica */
.amx-dashboard-body .tw-bg-white{
    border-radius: 14px !important;
    border: 1px solid #D5E0EC !important;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .07) !important;
}

/* Responsive */
@media (max-width: 1180px){
    .amx-dashboard-topbar{
        flex-wrap: wrap !important;
        justify-content: flex-start !important;
    }

    .amx-dashboard-location{
        margin-left: 0 !important;
    }

    .amx-dashboard-kpi-grid{
        width: 100% !important;
        max-width: 100% !important;
        grid-template-columns: repeat(2, minmax(190px, 1fr)) !important;
    }

    .amx-dashboard-kpi-grid > div{
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
    }
}

@media (max-width: 640px){
    .amx-dashboard-hero{
        padding: 18px 14px !important;
    }

    .amx-dashboard-topbar{
        flex-direction: column !important;
        align-items: stretch !important;
    }

    .amx-dashboard-location,
    .amx-dashboard-action-buttons,
    .amx-dashboard-date-filter{
        width: 100% !important;
        justify-content: flex-start !important;
    }

    .amx-dashboard-hero .select2-container{
        width: 100% !important;
        min-width: 100% !important;
    }

    .amx-dashboard-action-buttons{
        flex-wrap: wrap !important;
    }

    .amx-dashboard-kpi-grid{
        grid-template-columns: 1fr !important;
    }
}

/* AMX_DASHBOARD_UNICO_LIMPIO_20260509_FIN */

/* AMX_DASHBOARD_ALIGN_KPI_FINAL_INICIO */

/* Contenedor real del dashboard: controla todo el ancho visual */
.amx-dashboard-hero > .tw-px-5{
    max-width: 1220px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 18px !important;
    padding-right: 18px !important;
}

/* Topbar: título a la izquierda, controles juntos a la derecha */
.amx-dashboard-topbar{
    display: grid !important;
    grid-template-columns: 1fr auto auto auto !important;
    align-items: center !important;
    column-gap: 10px !important;
    row-gap: 0 !important;
    width: 100% !important;
    margin: 0 0 12px 0 !important;
    padding: 0 !important;
}

/* Bienvenido debe arrancar en el mismo eje que los KPIs */
.amx-dashboard-welcome{
    grid-column: 1 !important;
    justify-self: start !important;
    align-self: center !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
}

.amx-dashboard-hero h1{
    color: #0B3EA8 !important;
    font-size: 22px !important;
    line-height: 34px !important;
    font-weight: 850 !important;
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
}

/* Ubicación + botones + fecha: todos en el mismo renglón */
.amx-dashboard-location,
.amx-dashboard-action-buttons,
.amx-dashboard-date-filter{
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    align-self: center !important;
    display: flex !important;
    align-items: center !important;
}

.amx-dashboard-location{
    grid-column: 2 !important;
    justify-self: end !important;
}

.amx-dashboard-action-buttons{
    grid-column: 3 !important;
    justify-self: end !important;
    gap: 8px !important;
}

.amx-dashboard-date-filter{
    grid-column: 4 !important;
    justify-self: end !important;
}

/* Controles superiores: regresar armonía */
.amx-dashboard-hero .select2-container{
    width: 270px !important;
    min-width: 270px !important;
}

.amx-dashboard-hero .select2-container--default .select2-selection--single,
.amx-dashboard-hero #amx-pos-notice-btn,
.amx-dashboard-hero #amx-pos-suggested-btn,
.amx-dashboard-hero #dashboard_date_filter{
    height: 34px !important;
    min-height: 34px !important;
    border-radius: 9px !important;
    border: 1px solid #C8D6E6 !important;
    background: #ffffff !important;
    box-shadow: 0 7px 16px rgba(15, 23, 42, .08) !important;
}

/* Texto del selector centrado verticalmente */
.amx-dashboard-hero .select2-container--default .select2-selection--single .select2-selection__rendered{
    height: 34px !important;
    line-height: 34px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    color: #1E293B !important;
    font-size: 13px !important;
    font-weight: 800 !important;
}

.amx-dashboard-hero .select2-container--default .select2-selection--single .select2-selection__arrow{
    height: 34px !important;
    top: 0 !important;
}

/* Botones superiores */
.amx-dashboard-hero #amx-pos-notice-btn,
.amx-dashboard-hero #amx-pos-suggested-btn,
.amx-dashboard-hero #dashboard_date_filter{
    padding: 0 13px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    color: #1E293B !important;
    font-size: 13px !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
}

/* KPIs: mismo eje que Bienvenido y tamaño uniforme */
.amx-dashboard-kpi-grid{
    max-width: 840px !important;
    width: 840px !important;
    margin-left: 0 !important;
    margin-right: auto !important;
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 10px !important;
    align-items: stretch !important;
}

.amx-dashboard-kpi-grid-secondary{
    margin-top: 10px !important;
}

/* Todas las tarjetas exactamente iguales */
.amx-dashboard-kpi-grid > div{
    height: 50px !important;
    min-height: 50px !important;
    max-height: 50px !important;
    width: 100% !important;
    min-width: 0 !important;
    border: 1px solid #C8D6E6 !important;
    border-left: 3px solid #FF4F1F !important;
    border-radius: 8px !important;
    background: #FFFFFF !important;
    box-shadow: 0 7px 16px rgba(15, 23, 42, .08) !important;
    overflow: hidden !important;
}

/* Eliminar variaciones internas de padding */
.amx-dashboard-kpi-grid > div > div,
.amx-dashboard-kpi-grid .tw-p-4,
.amx-dashboard-kpi-grid .sm\:tw-p-5{
    height: 50px !important;
    min-height: 50px !important;
    max-height: 50px !important;
    padding: 6px 9px !important;
    box-sizing: border-box !important;
}

/* Layout interno uniforme: título arriba, icono+cifra abajo */
.amx-dashboard-kpi-grid .tw-flex.tw-items-center{
    display: grid !important;
    grid-template-columns: 25px minmax(0, 1fr) !important;
    grid-template-rows: 16px 22px !important;
    column-gap: 7px !important;
    row-gap: 0 !important;
    height: 38px !important;
    min-height: 38px !important;
    align-items: center !important;
}

/* Cualquier div de contenido se comporta igual */
.amx-dashboard-kpi-grid .tw-flex-1,
.amx-dashboard-kpi-grid .tw-min-w-0,
.amx-dashboard-kpi-grid .tw-flex.tw-items-center > div:not(.tw-rounded-full):not([class*="tw-inline-flex"]){
    display: contents !important;
}

/* Títulos KPI: todos igual */
.amx-dashboard-kpi-grid p.tw-text-sm{
    grid-column: 1 / 3 !important;
    grid-row: 1 !important;
    color: #0B3EA8 !important;
    font-size: 11.2px !important;
    line-height: 16px !important;
    font-weight: 850 !important;
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* Iconos KPI: mismo tamaño y misma posición */
.amx-dashboard-kpi-grid .tw-rounded-full{
    grid-column: 1 !important;
    grid-row: 2 !important;
    width: 23px !important;
    height: 23px !important;
    min-width: 23px !important;
    min-height: 23px !important;
    border-radius: 999px !important;
    align-self: center !important;
    justify-self: start !important;
    margin: 0 !important;
}

.amx-dashboard-kpi-grid svg{
    width: 14px !important;
    height: 14px !important;
}

/* Cifras KPI: mismo tamaño y ubicación */
.amx-dashboard-kpi-grid p.tw-font-mono,
.amx-dashboard-kpi-grid .total_sell,
.amx-dashboard-kpi-grid .net,
.amx-dashboard-kpi-grid .invoice_due,
.amx-dashboard-kpi-grid .total_sell_return,
.amx-dashboard-kpi-grid .total_purchase,
.amx-dashboard-kpi-grid .purchase_due,
.amx-dashboard-kpi-grid .total_purchase_return,
.amx-dashboard-kpi-grid .total_expense{
    grid-column: 2 !important;
    grid-row: 2 !important;
    color: #111827 !important;
    font-size: 14.5px !important;
    line-height: 22px !important;
    font-weight: 850 !important;
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* Ajuste de la i para que no cambie la altura del título */
.amx-dashboard-kpi-grid .fa-info-circle{
    width: 12px !important;
    height: 12px !important;
    min-width: 12px !important;
    font-size: 8px !important;
    line-height: 10px !important;
    vertical-align: top !important;
    margin-left: 3px !important;
    position: relative !important;
    top: 0 !important;
}

/* Responsive básico */
@media (max-width: 1180px){
    .amx-dashboard-topbar{
        grid-template-columns: 1fr !important;
        row-gap: 9px !important;
    }

    .amx-dashboard-location,
    .amx-dashboard-action-buttons,
    .amx-dashboard-date-filter{
        grid-column: 1 !important;
        justify-self: start !important;
    }

    .amx-dashboard-kpi-grid{
        width: 100% !important;
        max-width: 840px !important;
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }
}

/* AMX_DASHBOARD_ALIGN_KPI_FINAL_FIN */

/* AMX_DASHBOARD_ESTRUCTURA_LIMPIA_FINAL_INICIO */

/* El dashboard debe sentirse como una zona compacta, no como piezas flotando */
.amx-dashboard-hero{
    background: #EEF3F8 !important;
    padding: 24px 28px 20px 28px !important;
}

/* Contenedor real */
.amx-dashboard-hero > .tw-px-5{
    max-width: 1120px !important;
    margin: 0 auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Topbar: Bienvenido a la izquierda, controles a la derecha */
.amx-dashboard-topbar{
    width: 100% !important;
    display: grid !important;
    grid-template-columns: 1fr auto auto auto !important;
    align-items: center !important;
    column-gap: 10px !important;
    margin: 0 0 10px 0 !important;
    padding: 0 !important;
}

/* Bienvenido: ahora sí alineado al eje del bloque */
.amx-dashboard-welcome{
    grid-column: 1 !important;
    justify-self: start !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
}

.amx-dashboard-hero h1{
    color: #0B3EA8 !important;
    font-size: 21px !important;
    line-height: 34px !important;
    font-weight: 850 !important;
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
}

/* Controles superiores */
.amx-dashboard-location{
    grid-column: 2 !important;
    justify-self: end !important;
    width: auto !important;
    margin: 0 !important;
}

.amx-dashboard-action-buttons{
    grid-column: 3 !important;
    justify-self: end !important;
    width: auto !important;
    margin: 0 !important;
    display: flex !important;
    gap: 8px !important;
}

.amx-dashboard-date-filter{
    grid-column: 4 !important;
    justify-self: end !important;
    width: auto !important;
    margin: 0 !important;
}

/* Botones superiores con misma presencia */
.amx-dashboard-hero .select2-container{
    width: 260px !important;
    min-width: 260px !important;
}

.amx-dashboard-hero .select2-container--default .select2-selection--single,
.amx-dashboard-hero #amx-pos-notice-btn,
.amx-dashboard-hero #amx-pos-suggested-btn,
.amx-dashboard-hero #dashboard_date_filter{
    height: 32px !important;
    min-height: 32px !important;
    border-radius: 8px !important;
    border: 1px solid #C8D6E6 !important;
    background: #FFFFFF !important;
    box-shadow: 0 7px 16px rgba(15, 23, 42, .08) !important;
}

.amx-dashboard-hero #amx-pos-notice-btn,
.amx-dashboard-hero #amx-pos-suggested-btn,
.amx-dashboard-hero #dashboard_date_filter{
    padding: 0 12px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    font-size: 12.5px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
}

/* Select alineado verticalmente */
.amx-dashboard-hero .select2-container--default .select2-selection--single .select2-selection__rendered{
    height: 32px !important;
    line-height: 32px !important;
    padding-left: 34px !important;
    padding-right: 28px !important;
    font-size: 12.5px !important;
    font-weight: 800 !important;
}

.amx-dashboard-hero .select2-container--default .select2-selection--single .select2-selection__arrow{
    height: 32px !important;
    top: 0 !important;
}

/* KPIs: dos grids, pero visualmente iguales y alineados */
.amx-dashboard-kpi-grid,
.amx-dashboard-kpi-grid-secondary{
    width: 760px !important;
    max-width: 760px !important;
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 10px !important;
    margin-left: 0 !important;
    margin-right: auto !important;
}

.amx-dashboard-kpi-grid{
    margin-top: 0 !important;
}

.amx-dashboard-kpi-grid-secondary{
    margin-top: 10px !important;
}

/* Quitar efecto raro del contenedor intermedio de segunda fila */
.amx-dashboard-hero .tw-relative,
.amx-dashboard-hero .tw-isolate,
.amx-dashboard-hero .tw-absolute{
    position: static !important;
    inset: auto !important;
    display: block !important;
    background: transparent !important;
}

.amx-dashboard-hero .tw-absolute.tw-inset-0{
    display: none !important;
}

.amx-dashboard-hero .tw-isolate{
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Tarjetas KPI idénticas */
.amx-dashboard-kpi-grid > div{
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    border: 1px solid #C8D6E6 !important;
    border-left: 3px solid #FF4F1F !important;
    border-radius: 8px !important;
    background: #FFFFFF !important;
    box-shadow: 0 7px 16px rgba(15, 23, 42, .08) !important;
    overflow: hidden !important;
}

.amx-dashboard-kpi-grid > div > div,
.amx-dashboard-kpi-grid .tw-p-4,
.amx-dashboard-kpi-grid .sm\:tw-p-5{
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    padding: 6px 8px !important;
    box-sizing: border-box !important;
}

/* Layout interno de cada KPI */
.amx-dashboard-kpi-grid .tw-flex.tw-items-center{
    display: grid !important;
    grid-template-columns: 24px minmax(0, 1fr) !important;
    grid-template-rows: 15px 21px !important;
    column-gap: 7px !important;
    row-gap: 0 !important;
    height: 36px !important;
    min-height: 36px !important;
    align-items: center !important;
}

/* Normalizar contenedores internos diferentes */
.amx-dashboard-kpi-grid .tw-flex-1,
.amx-dashboard-kpi-grid .tw-min-w-0,
.amx-dashboard-kpi-grid .tw-flex.tw-items-center > div:not(.tw-rounded-full):not([class*="tw-inline-flex"]){
    display: contents !important;
}

/* Títulos KPI */
.amx-dashboard-kpi-grid p.tw-text-sm{
    grid-column: 1 / 3 !important;
    grid-row: 1 !important;
    color: #0B3EA8 !important;
    font-size: 10.8px !important;
    line-height: 15px !important;
    font-weight: 850 !important;
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* Iconos KPI */
.amx-dashboard-kpi-grid .tw-rounded-full{
    grid-column: 1 !important;
    grid-row: 2 !important;
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
    min-height: 22px !important;
    margin: 0 !important;
    border-radius: 999px !important;
    align-self: center !important;
    justify-self: start !important;
}

.amx-dashboard-kpi-grid svg{
    width: 13px !important;
    height: 13px !important;
}

/* Cifras KPI */
.amx-dashboard-kpi-grid p.tw-font-mono,
.amx-dashboard-kpi-grid .total_sell,
.amx-dashboard-kpi-grid .net,
.amx-dashboard-kpi-grid .invoice_due,
.amx-dashboard-kpi-grid .total_sell_return,
.amx-dashboard-kpi-grid .total_purchase,
.amx-dashboard-kpi-grid .purchase_due,
.amx-dashboard-kpi-grid .total_purchase_return,
.amx-dashboard-kpi-grid .total_expense{
    grid-column: 2 !important;
    grid-row: 2 !important;
    color: #111827 !important;
    font-size: 14px !important;
    line-height: 21px !important;
    font-weight: 850 !important;
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
}

/* Que la i no aumente ni desacomode el título */
.amx-dashboard-kpi-grid .fa-info-circle{
    width: 11px !important;
    height: 11px !important;
    min-width: 11px !important;
    font-size: 7px !important;
    line-height: 9px !important;
    margin-left: 3px !important;
    top: -1px !important;
}

/* Responsive */
@media (max-width: 1180px){
    .amx-dashboard-topbar{
        grid-template-columns: 1fr !important;
        row-gap: 9px !important;
    }

    .amx-dashboard-location,
    .amx-dashboard-action-buttons,
    .amx-dashboard-date-filter{
        grid-column: 1 !important;
        justify-self: start !important;
    }

    .amx-dashboard-kpi-grid,
    .amx-dashboard-kpi-grid-secondary{
        width: 100% !important;
        max-width: 760px !important;
    }
}

/* AMX_DASHBOARD_ESTRUCTURA_LIMPIA_FINAL_FIN */

/* AMX_DASHBOARD_KPI_GRID_UNIFICADO_FINAL_INICIO */

/* Contenedor del hero más estable */
.amx-dashboard-hero > .tw-px-5{
    max-width: 1280px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 22px !important;
    padding-right: 22px !important;
}

/* Topbar: título izquierda, controles derecha */
.amx-dashboard-topbar{
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    width: 100% !important;
    margin: 0 0 14px 0 !important;
    padding: 0 !important;
}

.amx-dashboard-welcome{
    flex: 1 1 auto !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
}

.amx-dashboard-hero h1{
    color: #0B3EA8 !important;
    font-size: 22px !important;
    line-height: 34px !important;
    font-weight: 850 !important;
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
    letter-spacing: -0.03em !important;
}

/* Controles derechos */
.amx-dashboard-location,
.amx-dashboard-action-buttons,
.amx-dashboard-date-filter{
    flex: 0 0 auto !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
}

.amx-dashboard-action-buttons{
    gap: 8px !important;
}

/* Grid único de 8 tarjetas */
.amx-dashboard-kpi-grid{
    display: grid !important;
    grid-template-columns: repeat(4, 180px) !important;
    gap: 9px 10px !important;
    justify-content: start !important;
    align-items: start !important;
    margin: 0 !important;
    max-width: none !important;
}

/* Ya no debe existir separación visual de segunda fila */
.amx-dashboard-kpi-grid-secondary{
    margin-top: 0 !important;
}

/* Tarjetas parejas */
.amx-dashboard-kpi-grid > div{
    width: 180px !important;
    min-width: 180px !important;
    max-width: 180px !important;
    height: 52px !important;
    min-height: 52px !important;
    max-height: 52px !important;
    border: 1px solid #CBD5E1 !important;
    border-left: 3px solid #FF4F1F !important;
    border-radius: 8px !important;
    background: #FFFFFF !important;
    box-shadow: 0 8px 18px rgba(15, 23, 42, .08) !important;
    overflow: hidden !important;
}

/* Interior uniforme */
.amx-dashboard-kpi-grid > div > div,
.amx-dashboard-kpi-grid .tw-p-4,
.amx-dashboard-kpi-grid .sm\:tw-p-5{
    padding: 7px 9px !important;
    height: 100% !important;
}

/* Layout interno de cada KPI */
.amx-dashboard-kpi-grid .tw-flex.tw-items-center{
    height: 100% !important;
    display: grid !important;
    grid-template-columns: 25px minmax(0, 1fr) !important;
    grid-template-rows: 15px 23px !important;
    column-gap: 7px !important;
    row-gap: 1px !important;
    align-items: center !important;
}

/* Soportar tarjetas con div interno diferente */
.amx-dashboard-kpi-grid .tw-flex-1,
.amx-dashboard-kpi-grid .tw-min-w-0,
.amx-dashboard-kpi-grid .tw-flex.tw-items-center > div:not(.tw-rounded-full):not([class*="tw-inline-flex"]){
    display: contents !important;
}

/* Títulos */
.amx-dashboard-kpi-grid p.tw-text-sm{
    grid-column: 1 / 3 !important;
    grid-row: 1 !important;
    color: #0B3EA8 !important;
    font-size: 11.5px !important;
    line-height: 15px !important;
    font-weight: 850 !important;
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* Iconos */
.amx-dashboard-kpi-grid .tw-rounded-full{
    grid-column: 1 !important;
    grid-row: 2 !important;
    width: 24px !important;
    min-width: 24px !important;
    height: 24px !important;
    min-height: 24px !important;
    border-radius: 999px !important;
    align-self: center !important;
    justify-self: start !important;
}

.amx-dashboard-kpi-grid svg{
    width: 15px !important;
    height: 15px !important;
}

/* Cifras */
.amx-dashboard-kpi-grid p.tw-font-mono,
.amx-dashboard-kpi-grid .total_sell,
.amx-dashboard-kpi-grid .net,
.amx-dashboard-kpi-grid .invoice_due,
.amx-dashboard-kpi-grid .total_sell_return,
.amx-dashboard-kpi-grid .total_purchase,
.amx-dashboard-kpi-grid .purchase_due,
.amx-dashboard-kpi-grid .total_purchase_return,
.amx-dashboard-kpi-grid .total_expense{
    grid-column: 2 !important;
    grid-row: 2 !important;
    color: #111827 !important;
    font-size: 15px !important;
    line-height: 18px !important;
    font-weight: 850 !important;
    margin: 0 !important;
    padding: 0 !important;
    letter-spacing: .01em !important;
    white-space: nowrap !important;
}

/* Responsive */
@media (max-width: 1180px){
    .amx-dashboard-topbar{
        flex-wrap: wrap !important;
        justify-content: flex-start !important;
    }

    .amx-dashboard-welcome{
        flex-basis: 100% !important;
    }

    .amx-dashboard-kpi-grid{
        grid-template-columns: repeat(4, 180px) !important;
    }
}

@media (max-width: 900px){
    .amx-dashboard-kpi-grid{
        grid-template-columns: repeat(2, 180px) !important;
    }
}

/* AMX_DASHBOARD_KPI_GRID_UNIFICADO_FINAL_FIN */

/* AMX_DASHBOARD_FINAL_UNIFICADO_VISUAL_INICIO */

/* Contenedor superior */
.amx-dashboard-hero,
.amx-dashboard-hero.tw-bg-gradient-to-r{
    background: #EEF3F8 !important;
    padding: 24px 0 22px 0 !important;
    border-bottom: 1px solid #D8E2EE !important;
}

/* Neutralizar fondos azules heredados dentro del dashboard */
.amx-dashboard-hero [class*="tw-bg-gradient-to-r"]{
    background: transparent !important;
}

/* Contenedor interno alineado */
.amx-dashboard-hero > .tw-px-5{
    max-width: 1280px !important;
    margin: 0 auto !important;
    padding-left: 28px !important;
    padding-right: 28px !important;
}

/* Barra superior: título izquierda, controles derecha */
.amx-dashboard-topbar{
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 14px !important;
    width: 100% !important;
    margin: 0 0 14px 0 !important;
    padding: 0 !important;
}

/* Bienvenido */
.amx-dashboard-welcome{
    flex: 1 1 auto !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    min-width: 220px !important;
}

.amx-dashboard-hero h1{
    color: #0B3EA8 !important;
    font-size: 22px !important;
    line-height: 34px !important;
    font-weight: 850 !important;
    letter-spacing: -0.03em !important;
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
}

/* Controles superiores */
.amx-dashboard-location,
.amx-dashboard-action-buttons,
.amx-dashboard-date-filter{
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    flex: 0 0 auto !important;
    display: flex !important;
    align-items: center !important;
}

.amx-dashboard-action-buttons{
    gap: 8px !important;
}

.amx-dashboard-date-filter{
    text-align: right !important;
}

/* Selector sucursal */
.amx-dashboard-hero .select2-container{
    width: 285px !important;
    min-width: 285px !important;
}

.amx-dashboard-hero .select2-container--default .select2-selection--single{
    height: 34px !important;
    min-height: 34px !important;
    border-radius: 9px !important;
    border: 1px solid #CBD5E1 !important;
    background: #FFFFFF !important;
    box-shadow: 0 7px 16px rgba(15, 23, 42, .08) !important;
}

.amx-dashboard-hero .select2-container--default .select2-selection--single .select2-selection__rendered{
    height: 34px !important;
    line-height: 34px !important;
    padding-left: 34px !important;
    padding-right: 28px !important;
    color: #1E293B !important;
    font-size: 13px !important;
    font-weight: 800 !important;
}

.amx-dashboard-location .select2-selection__rendered:before{
    content: "\f3c5" !important;
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    position: absolute !important;
    left: 13px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    color: #FF4F1F !important;
    font-size: 12px !important;
}

.amx-dashboard-hero .select2-container--default .select2-selection--single .select2-selection__arrow{
    height: 34px !important;
    right: 7px !important;
}

/* Botones superiores */
.amx-dashboard-hero #amx-pos-notice-btn,
.amx-dashboard-hero #amx-pos-suggested-btn,
.amx-dashboard-hero #dashboard_date_filter{
    height: 34px !important;
    min-height: 34px !important;
    padding: 0 13px !important;
    border-radius: 9px !important;
    border: 1px solid #CBD5E1 !important;
    background: #FFFFFF !important;
    color: #1E293B !important;
    font-size: 13px !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    white-space: nowrap !important;
    box-shadow: 0 7px 16px rgba(15, 23, 42, .08) !important;
}

.amx-dashboard-hero #amx-pos-notice-btn i,
.amx-dashboard-hero #amx-pos-suggested-btn i,
.amx-dashboard-hero #dashboard_date_filter svg{
    color: #FF4F1F !important;
    width: 14px !important;
    height: 14px !important;
    font-size: 14px !important;
}

/* Grid único de KPIs */
.amx-dashboard-kpi-grid{
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 10px !important;
    width: 100% !important;
    max-width: 860px !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: stretch !important;
}

/* Tarjetas KPI */
.amx-dashboard-kpi-grid > div{
    height: 56px !important;
    min-height: 56px !important;
    width: 100% !important;
    min-width: 0 !important;
    background: #FFFFFF !important;
    border: 1px solid #CBD5E1 !important;
    border-left: 3px solid #FF4F1F !important;
    border-radius: 9px !important;
    box-shadow: 0 8px 18px rgba(15, 23, 42, .08) !important;
    overflow: hidden !important;
}

/* Quitar padding grande heredado */
.amx-dashboard-kpi-grid > div > div,
.amx-dashboard-kpi-grid .tw-p-4,
.amx-dashboard-kpi-grid .sm\:tw-p-5{
    height: 100% !important;
    padding: 7px 9px !important;
}

/* Interior de cada KPI */
.amx-dashboard-kpi-grid .tw-flex.tw-items-center{
    height: 100% !important;
    display: grid !important;
    grid-template-columns: 28px minmax(0, 1fr) !important;
    grid-template-rows: 18px 24px !important;
    column-gap: 8px !important;
    row-gap: 0 !important;
    align-items: center !important;
}

/* Permite que todos los KPIs tengan la misma estructura, incluso Compra adeudada */
.amx-dashboard-kpi-grid .tw-flex-1,
.amx-dashboard-kpi-grid .tw-min-w-0,
.amx-dashboard-kpi-grid .tw-flex.tw-items-center > div:not(.tw-rounded-full):not([class*="tw-inline-flex"]){
    display: contents !important;
}

/* Título KPI */
.amx-dashboard-kpi-grid p.tw-text-sm{
    grid-column: 1 / 3 !important;
    grid-row: 1 !important;
    color: #0B3EA8 !important;
    font-size: 11.5px !important;
    line-height: 14px !important;
    font-weight: 850 !important;
    letter-spacing: -0.02em !important;
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* Icono KPI */
.amx-dashboard-kpi-grid .tw-rounded-full{
    grid-column: 1 !important;
    grid-row: 2 !important;
    width: 24px !important;
    min-width: 24px !important;
    height: 24px !important;
    min-height: 24px !important;
    border-radius: 999px !important;
    align-self: center !important;
    justify-self: start !important;
}

.amx-dashboard-kpi-grid svg{
    width: 14px !important;
    height: 14px !important;
    stroke-width: 2.1 !important;
}

/* Cifra KPI */
.amx-dashboard-kpi-grid p.tw-font-mono,
.amx-dashboard-kpi-grid .total_sell,
.amx-dashboard-kpi-grid .net,
.amx-dashboard-kpi-grid .invoice_due,
.amx-dashboard-kpi-grid .total_sell_return,
.amx-dashboard-kpi-grid .total_purchase,
.amx-dashboard-kpi-grid .purchase_due,
.amx-dashboard-kpi-grid .total_purchase_return,
.amx-dashboard-kpi-grid .total_expense{
    grid-column: 2 !important;
    grid-row: 2 !important;
    color: #111827 !important;
    font-size: 15px !important;
    line-height: 18px !important;
    font-weight: 850 !important;
    letter-spacing: .01em !important;
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* Ícono de información global */
.amx-dashboard-kpi-grid .fa-info-circle,
.amx-dashboard-hero .fa-info-circle,
.amx-dashboard-hero .text-info.fa-info-circle{
    color: #FF4F1F !important;
    background: #FFF1EA !important;
    border: 1px solid #FFB899 !important;
    width: 13px !important;
    height: 13px !important;
    min-width: 13px !important;
    border-radius: 999px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 8px !important;
    line-height: 1 !important;
    margin-left: 4px !important;
    position: relative !important;
    top: -1px !important;
}

.amx-dashboard-kpi-grid .fa-info-circle:before,
.amx-dashboard-hero .fa-info-circle:before{
    content: "i" !important;
    font-family: Arial, sans-serif !important;
    font-weight: 900 !important;
    color: #FF4F1F !important;
}

/* Fondo del cuerpo */
.amx-dashboard-body{
    background: #EEF3F8 !important;
}

/* Responsive */
@media (max-width: 1180px){
    .amx-dashboard-topbar{
        flex-wrap: wrap !important;
        justify-content: flex-start !important;
    }

    .amx-dashboard-kpi-grid{
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        max-width: 620px !important;
    }

    .amx-dashboard-location,
    .amx-dashboard-action-buttons,
    .amx-dashboard-date-filter{
        flex: 0 0 auto !important;
    }
}

@media (max-width: 640px){
    .amx-dashboard-hero > .tw-px-5{
        padding-left: 14px !important;
        padding-right: 14px !important;
    }

    .amx-dashboard-topbar{
        flex-direction: column !important;
        align-items: stretch !important;
    }

    .amx-dashboard-hero .select2-container{
        width: 100% !important;
        min-width: 100% !important;
    }

    .amx-dashboard-action-buttons{
        flex-wrap: wrap !important;
    }

    .amx-dashboard-kpi-grid{
        grid-template-columns: 1fr !important;
        max-width: 100% !important;
    }
}

/* AMX_DASHBOARD_FINAL_UNIFICADO_VISUAL_FIN */

/* AMX_DASHBOARD_LEFT_RIGHT_FINAL_INICIO */

/* El hero debe ocupar todo el ancho disponible */
.amx-dashboard-hero > .tw-px-5{
    max-width: none !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 28px !important;
    padding-right: 28px !important;
}

/* Topbar como barra real: título izquierda, controles derecha */
.amx-dashboard-topbar{
    display: grid !important;
    grid-template-columns: auto 1fr auto auto auto !important;
    align-items: center !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 0 14px 0 !important;
    padding: 0 !important;
    column-gap: 10px !important;
}

/* Bienvenido totalmente a la izquierda */
.amx-dashboard-welcome{
    grid-column: 1 !important;
    justify-self: start !important;
    margin: 0 !important;
    padding: 0 !important;
    width: auto !important;
}

/* Ubicación empieza después del espacio flexible */
.amx-dashboard-location{
    grid-column: 3 !important;
    justify-self: end !important;
    margin: 0 !important;
    padding: 0 !important;
    width: auto !important;
}

/* Aviso POS + Sugeridos POS juntos */
.amx-dashboard-action-buttons{
    grid-column: 4 !important;
    justify-self: end !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin: 0 !important;
    padding: 0 !important;
    width: auto !important;
}

/* Filtrar por fecha al extremo derecho */
.amx-dashboard-date-filter{
    grid-column: 5 !important;
    justify-self: end !important;
    margin: 0 !important;
    padding: 0 !important;
    width: auto !important;
    text-align: right !important;
}

/* Select más controlado para que no empuje demasiado */
.amx-dashboard-hero .select2-container{
    width: 280px !important;
    min-width: 280px !important;
    max-width: 280px !important;
}

/* Botones superiores parejos */
.amx-dashboard-hero #amx-pos-notice-btn,
.amx-dashboard-hero #amx-pos-suggested-btn,
.amx-dashboard-hero #dashboard_date_filter{
    height: 34px !important;
    min-height: 34px !important;
    padding: 0 13px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    white-space: nowrap !important;
}

/* KPIs alineados con Bienvenido */
.amx-dashboard-kpi-grid{
    margin-left: 0 !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    justify-content: start !important;
}

/* Responsive: en pantallas medianas que no se rompa */
@media (max-width: 1180px){
    .amx-dashboard-topbar{
        grid-template-columns: 1fr !important;
        row-gap: 10px !important;
    }

    .amx-dashboard-welcome,
    .amx-dashboard-location,
    .amx-dashboard-action-buttons,
    .amx-dashboard-date-filter{
        grid-column: 1 !important;
        justify-self: start !important;
    }

    .amx-dashboard-hero .select2-container{
        width: 280px !important;
        min-width: 280px !important;
        max-width: 100% !important;
    }
}

/* AMX_DASHBOARD_LEFT_RIGHT_FINAL_FIN */

/* AMX_FIX_LOGIN_LOGOUT_20260510_INICIO */

/* Login: quitar velo gris accidental y recuperar fondo */
/* AMX_FIX_LOGIN_FONDO_REAL_20260510_FIN */