@media (max-width: 750px){
    .navLateral{
        pointer-events: none;
        opacity: 0;
        width: 0;
        border-right: none;
    }
    .navLateral-change{
        width: 300px;
        pointer-events: auto;
        opacity: 1;
        border-right: 1px solid rgba(255,255,255,0.06);
    }
    .pageContent{
        width: 100%;
    }
    .pageContent-change{
       width: calc(100% - 300px);
    }
}
@media (max-width: 768px){
    .navLateral{
        position: fixed;
        left: 0;
        top: 0;
        bottom: 0;
        width: 300px;
        transform: translateX(-110%);
        transition: transform .25s ease-in-out;
        z-index: 2000;
        box-shadow: 2px 0 18px rgba(0,0,0,0.18);
        background: linear-gradient(180deg,#0b3d91 0%, #052a61 100%);
    }
    .navLateral.navLateral-change{ transform: translateX(0); pointer-events: auto; opacity: 1; }
    .nav-overlay{
        position: fixed;
        inset: 0;
        background: rgba(0,0,0,0.35);
        z-index: 1500;
        display: none;
    }
    .navLateral.navLateral-change + .nav-overlay{ display: block; }
    .pageContent{ width: 100%; }
    body{ overflow-x: hidden; }
    .table-responsive{ -webkit-overflow-scrolling: touch; }
    .pageContent-change{ width: 100% !important; }
    .pageContent table{
        display: block;
        width: 100%;
        overflow: auto;
        -webkit-overflow-scrolling: touch;
    }
    .pageContent .button, .pageContent button, .pageContent input[type="button"], .pageContent input[type="submit"]{
        min-height: 40px;
        padding: 10px 14px;
    }
    .pageContent input, .pageContent select, .pageContent textarea{
        width: 100%;
        box-sizing: border-box;
    }
    .navBar-options ul{ gap:6px; }
    .navBar-options-list ul li{ font-size:18px; padding:0 6px; }
    .navBar-options-list ul li img{ width:34px; height:34px; }
}
@media (max-width: 768px){
    html, body { max-width: 100vw; overflow-x: hidden; }
    .page-container, main.page-container { max-width: 100vw; overflow-x: hidden; }
    .pageContent, .full-width, .container { max-width: 100vw; box-sizing: border-box; overflow-x: hidden; }
    .columns { max-width: 100vw; box-sizing: border-box; }
    .columns .column { min-width: 0 !important; box-sizing: border-box; }
    .box { max-width: 100%; box-sizing: border-box; }
    img, svg, iframe { max-width: 100%; height: auto; }
    .table-responsive, .pageContent table { overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .product-list-page .columns.is-mobile{
        flex-wrap: wrap !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    .product-list-page .columns.is-mobile > .column{
        flex: 1 1 100% !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box;
        padding-left: 0.5rem !important;
        padding-right: 0.5rem !important;
    }
    .product-list-page .columns.is-mobile > .column.is-narrow{
        flex: 0 0 auto !important;
        width: auto !important;
        max-width: 160px !important;
    }
    .product-list-page .field.is-grouped{ display:flex; flex-wrap:wrap; gap:.5rem; }
    .product-list-page .field.is-grouped .control{ flex: 0 0 auto; }
    .product-list-page #btn-collapse-menu{ position: absolute !important; right: 8px !important; left: auto !important; }
    .product-list-page .navBar-options-list ul li{ max-width: 40px; overflow: hidden; }
    .product-list-page, .product-list-page .pageContent, .product-list-page .container{
        max-width: 100vw !important;
        box-sizing: border-box !important;
        padding-left: 0.5rem !important;
        padding-right: 0.5rem !important;
        overflow-x: visible !important;
    }
    .product-list-page .columns, .product-list-page .columns.is-mobile{
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        min-width: 0 !important;
    }
    .product-list-page .columns.is-mobile > .column{ min-width: 0 !important; }
    .product-list-page .pagination{ width: 100% !important; box-sizing: border-box !important; padding: .25rem .5rem !important; }
    .product-list-page .nav-actions, .product-list-page .navBar-options-list{ max-width: calc(100% - 56px) !important; overflow: hidden !important; }
    .product-list-page .button.is-info, .product-list-page .button.is-light{ white-space: nowrap !important; }
    .product-list-page .column[style*="max-width"]{
        max-width: 160px !important;
        min-width: 0 !important;
        flex: 0 0 auto !important;
        box-sizing: border-box !important;
    }
    .product-list-page .field.is-grouped{ gap:.4rem; align-items:center; }
    .product-list-page .field.is-grouped .control{ flex: 0 0 auto; max-width: 48% !important; }
    .product-list-page .header-actions, .product-list-page .navBar-options-list{ overflow:hidden !important; white-space:nowrap !important; }
    .product-list-page .field.is-grouped,
    .product-list-page .field.is-grouped .controls{
        display:flex !important;
        flex-wrap:wrap !important;
        gap:.4rem !important;
        align-items:center !important;
        justify-content:flex-start !important;
    }
    .product-list-page .field.is-grouped .control,
    .product-list-page .field.is-grouped .control a,
    .product-list-page .field.is-grouped .control button{
        flex: 0 0 auto !important;
        min-width: 0 !important;
        max-width: 48% !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        display: inline-block !important;
    }
    .product-list-page .field.is-grouped .control a.button.is-light,
    .product-list-page .field.is-grouped .control button.button.is-info{
        padding-left: .6rem !important;
        padding-right: .6rem !important;
    }
    .product-list-page .field.is-grouped .control.full-width-on-mobile{ max-width:100% !important; width:100% !important; }
    .product-list-page .columns.is-mobile .column.is-narrow{
        flex: 1 1 100% !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        padding-left: .25rem !important;
        padding-right: .25rem !important;
    }
    .product-list-page .columns.is-mobile .column.is-narrow .field.is-grouped .control{
        flex: 1 1 auto !important;
        max-width: 100% !important;
    }
    .product-list-page a.full-width-on-mobile{
        display:block !important;
        width:100% !important;
        max-width:100% !important;
        box-sizing:border-box !important;
    }
    .product-list-page .field.is-grouped .control button.is-info,
    .product-list-page .field.is-grouped .control .button.is-info{
        min-width: 120px !important;
        padding-left: 0.9rem !important;
        padding-right: 0.9rem !important;
        font-size: 1rem !important;
        line-height: 1.2 !important;
        box-sizing: border-box !important;
    }
    .product-list-page .field.is-grouped .control button.is-info{ max-width: 65% !important; }
    .product-list-page .columns.is-mobile > .column .field.is-grouped{ width:100% !important; }
    .product-list-page .field.is-grouped a.full-width-on-mobile,
    .product-list-page .field.is-grouped .control a.full-width-on-mobile{
        display:block !important;
        width:100% !important;
        max-width:100% !important;
        box-sizing:border-box !important;
        text-align:center !important;
        white-space:nowrap !important;
        overflow:hidden !important;
        text-overflow:ellipsis !important;
    }
    .product-list-page .field.is-grouped .control{ max-width:100% !important; }
    .dashboard-stats .level-item{ padding: 14px 0; }
    .dashboard-stats .level-item .title{ font-size: 26px; }
    .dashboard-tiles .column{ flex: 0 0 50%; max-width:50%; }
    .form-grid,
    .form-grid-2,
    .form-grid-3 {
        grid-template-columns: 1fr;
    }
    .form-actions {
        flex-direction: column;
        gap: 1rem;
    }
    .form-buttons {
        width: 100%;
    }
    .form-buttons .btn {
        flex: 1;
        justify-content: center;
    }
    .sale-new-page .columns > .column.is-one-quarter{
        padding-left: .75rem !important;
        padding-right: .75rem !important;
    }
    .sale-new-page .columns > .column.pb-6{ padding-left:.5rem !important; padding-right:.5rem !important; }
}
@media (max-width: 480px){
    .navLateral{ width: 280px; }
    .navLateral.navLateral-change + .nav-overlay{ display:block; }
    .navBar{ height:50px; }
    .navBar-options .fa-exchange-alt{ font-size:26px; margin-left:10px; }
    #login-view.login-wrapper {
        padding: 1rem;
    }
    #login-view .login-card {
        padding: 1.75rem 1.25rem;
        border-radius: 16px;
    }
    #login-view .login-logo {
        width: 60px;
        height: 60px;
        margin-bottom: 1rem;
    }
    #login-view .login-title {
        font-size: 1.5rem;
    }
}
@media (min-width: 769px){
    .sale-new-page .columns > .column.is-one-quarter{
        padding-left: 1rem !important;
    }
}
@media (max-width: 1024px) {
    .stats-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .stats-grid.secondary {
        max-width: 100%;
    }
}
@media (max-width: 640px) {
    .dashboard-wrapper {
        padding: 1rem;
    }
    .greeting-title {
        font-size: 1.5rem;
    }
    .stats-grid,
    .stats-grid.secondary {
        grid-template-columns: 1fr;
    }
    .stat-card {
        padding: 1.25rem;
    }
    .stat-number {
        font-size: 1.5rem;
    }
}
@media (max-width: 768px){
    .product-list-page .product-item{ padding: .75rem .5rem; }
    .product-list-page .product-item .pi-meta,
    .product-list-page .product-item .pi-details,
    .product-list-page .product-item .pi-stock,
    .product-list-page .product-item .pi-prices,
    .product-list-page .product-item .pi-actions{
        flex: 1 1 100%;
        text-align: left;
    }
    .product-list-page .product-item .pi-meta{ display:flex; align-items:center; gap:.75rem; }
    .product-list-page .product-item .pi-actions{ margin-top: .5rem; }
}
