/* NexoProCRM v0.18.0 · Cierre visual y QA general
   Reforma de navegación inferior móvil y pequeños ajustes de estabilidad visual.
   Capa visual: no modifica lógica fiscal, VERI*FACTU, facturas ni base de datos. */

@media(max-width:960px){
  /* Espacio inferior ajustado a la nueva barra más baja */
  .ch301-app-layout-v2 .ch301-main{
    padding-bottom:calc(98px + env(safe-area-inset-bottom))!important;
  }

  /* Nueva barra inferior: más ligera, menos alta y sin tarjetas activas grandes */
  .ch301-app-layout-v2 .ch301-nav{
    left:12px!important;
    right:12px!important;
    bottom:10px!important;
    min-height:64px!important;
    max-height:64px!important;
    height:64px!important;
    padding:6px 8px!important;
    gap:0!important;
    border:1px solid rgba(208,216,226,.90)!important;
    border-radius:20px!important;
    background:rgba(255,255,255,.94)!important;
    box-shadow:0 12px 34px rgba(15,23,42,.16)!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-width:none!important;
    backdrop-filter:blur(16px)!important;
  }
  .ch301-app-layout-v2 .ch301-nav::-webkit-scrollbar{
    display:none!important;
  }
  .ch301-app-layout-v2 .ch301-nav-scroll{
    display:flex!important;
    align-items:center!important;
    gap:4px!important;
    min-width:max-content!important;
    padding:0!important;
  }
  .ch301-app-layout-v2 .ch301-nav-group,
  .ch301-app-layout-v2 .ch301-nav-group-items{
    display:contents!important;
  }

  /* Items compactos: icono + texto corto, siempre la misma altura */
  .ch301-app-layout-v2 .ch301-nav .ch301-nav-item{
    position:relative!important;
    width:64px!important;
    min-width:64px!important;
    max-width:64px!important;
    min-height:52px!important;
    height:52px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:3px!important;
    padding:5px 4px!important;
    border:1px solid transparent!important;
    border-radius:15px!important;
    background:transparent!important;
    color:#667085!important;
    box-shadow:none!important;
    transform:none!important;
    line-height:1!important;
  }
  .ch301-app-layout-v2 .ch301-nav .ch301-nav-item:before{
    display:none!important;
  }
  .ch301-app-layout-v2 .ch301-nav .ch301-nav-item:after{
    content:"";
    position:absolute;
    top:4px;
    left:50%;
    width:5px;
    height:5px;
    border-radius:999px;
    background:#d71920;
    opacity:0;
    transform:translateX(-50%);
    transition:opacity .16s ease, transform .16s ease;
  }
  .ch301-app-layout-v2 .ch301-nav .ch301-nav-icon,
  .ch301-app-layout-v2 .ch301-nav .ch301-nav-item .dashicons{
    width:20px!important;
    height:20px!important;
    min-width:20px!important;
    flex:0 0 20px!important;
    color:#667085!important;
    margin:0!important;
    transition:color .16s ease, transform .16s ease;
  }
  .ch301-app-layout-v2 .ch301-nav .ch301-nav-icon svg{
    width:19px!important;
    height:19px!important;
    stroke-width:1.85!important;
  }

  /* En móvil usamos una etiqueta corta para evitar textos cortados y tarjetas enormes */
  .ch301-app-layout-v2 .ch301-nav .ch301-nav-item span{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    overflow:hidden!important;
    text-overflow:clip!important;
    white-space:nowrap!important;
    text-align:center!important;
    color:inherit!important;
    font-size:9px!important;
    font-weight:800!important;
    line-height:1.05!important;
    letter-spacing:-.02em!important;
  }
  .ch301-app-layout-v2 .ch301-nav .ch301-nav-item[data-mobile-label] span{
    font-size:0!important;
  }
  .ch301-app-layout-v2 .ch301-nav .ch301-nav-item[data-mobile-label] span:after{
    content:attr(data-mobile-label);
    display:block;
    width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    color:inherit;
    font-size:9px;
    font-weight:800;
    line-height:1.05;
    letter-spacing:-.02em;
  }

  /* Estado activo: acento discreto en rojo, sin bloque negro gigante */
  .ch301-app-layout-v2 .ch301-nav .ch301-nav-item.is-active{
    background:#fff5f5!important;
    color:#202832!important;
    border-color:rgba(215,25,32,.18)!important;
    box-shadow:inset 0 -2px 0 #d71920!important;
  }
  .ch301-app-layout-v2 .ch301-nav .ch301-nav-item.is-active:after{
    opacity:1;
    transform:translateX(-50%) translateY(1px);
  }
  .ch301-app-layout-v2 .ch301-nav .ch301-nav-item.is-active .ch301-nav-icon,
  .ch301-app-layout-v2 .ch301-nav .ch301-nav-item.is-active .dashicons{
    color:#d71920!important;
    transform:none!important;
  }
  .ch301-app-layout-v2 .ch301-nav .ch301-nav-item:hover{
    background:#f6f8fb!important;
    color:#202832!important;
    border-color:rgba(208,216,226,.72)!important;
  }
  .ch301-app-layout-v2 .ch301-nav .ch301-nav-item:hover .ch301-nav-icon,
  .ch301-app-layout-v2 .ch301-nav .ch301-nav-item:hover .dashicons{
    color:#202832!important;
  }

  /* Evita que cards, formularios o pestañas internas queden ocultas bajo la barra */
  .ch301-dashboard,
  .nxp-accounting-wrap,
  .nxp-commission-wrap,
  .ch301-panel:last-child,
  .ch301-card:last-child{
    margin-bottom:18px!important;
  }
}

@media(max-width:420px){
  .ch301-app-layout-v2 .ch301-nav{
    left:8px!important;
    right:8px!important;
    bottom:8px!important;
    min-height:62px!important;
    max-height:62px!important;
    height:62px!important;
    padding:5px 6px!important;
    border-radius:18px!important;
  }
  .ch301-app-layout-v2 .ch301-nav .ch301-nav-item{
    width:60px!important;
    min-width:60px!important;
    max-width:60px!important;
    min-height:50px!important;
    height:50px!important;
    border-radius:14px!important;
  }
  .ch301-app-layout-v2 .ch301-main{
    padding-bottom:calc(92px + env(safe-area-inset-bottom))!important;
  }
}

/* QA visual general: formularios más estables en móvil */
@media(max-width:760px){
  .ch301-app-layout-v2 input,
  .ch301-app-layout-v2 select,
  .ch301-app-layout-v2 textarea,
  .nxp-accounting-wrap input,
  .nxp-accounting-wrap select,
  .nxp-accounting-wrap textarea,
  .nxp-commission-wrap input,
  .nxp-commission-wrap select,
  .nxp-commission-wrap textarea{
    max-width:100%!important;
    box-sizing:border-box!important;
  }
  .ch301-app-layout-v2 .ch301-btn,
  .nxp-accounting-wrap .ch301-btn,
  .nxp-commission-wrap .ch301-btn{
    box-sizing:border-box!important;
  }
}

/* NexoProCRM v0.18.1 · Reparación urgente menú inferior móvil
   Se fuerza una barra inferior de una sola fila, sin elementos flotantes ni tarjetas grandes. */
@media(max-width:960px){
  .ch301-app-layout-v2 .ch301-main{
    padding-bottom:calc(104px + env(safe-area-inset-bottom))!important;
  }

  .ch301-app-layout-v2 .ch301-nav{
    position:fixed!important;
    left:10px!important;
    right:10px!important;
    bottom:10px!important;
    top:auto!important;
    width:auto!important;
    height:68px!important;
    min-height:68px!important;
    max-height:68px!important;
    display:block!important;
    padding:7px 8px!important;
    margin:0!important;
    border:1px solid rgba(209,216,226,.96)!important;
    border-radius:20px!important;
    background:rgba(255,255,255,.97)!important;
    box-shadow:0 10px 32px rgba(15,23,42,.14)!important;
    overflow:hidden!important;
    z-index:99999!important;
    box-sizing:border-box!important;
    backdrop-filter:blur(14px)!important;
    -webkit-backdrop-filter:blur(14px)!important;
  }

  .ch301-app-layout-v2 .ch301-nav-brand,
  .ch301-app-layout-v2 .ch301-nav-create,
  .ch301-app-layout-v2 .ch301-nav-group > summary,
  .ch301-app-layout-v2 .ch301-nav-logout{
    display:none!important;
  }

  .ch301-app-layout-v2 .ch301-nav-scroll{
    width:100%!important;
    height:100%!important;
    display:flex!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:6px!important;
    min-width:0!important;
    max-width:none!important;
    padding:0!important;
    margin:0!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-width:none!important;
    box-sizing:border-box!important;
  }
  .ch301-app-layout-v2 .ch301-nav-scroll::-webkit-scrollbar{
    display:none!important;
  }

  .ch301-app-layout-v2 .ch301-nav-group{
    display:flex!important;
    flex:0 0 auto!important;
    width:auto!important;
    min-width:auto!important;
    max-width:none!important;
    height:100%!important;
    padding:0!important;
    margin:0!important;
    border:0!important;
    background:transparent!important;
    box-shadow:none!important;
    overflow:visible!important;
  }

  .ch301-app-layout-v2 .ch301-nav-group-items{
    display:flex!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:6px!important;
    width:auto!important;
    min-width:auto!important;
    max-width:none!important;
    height:100%!important;
    padding:0!important;
    margin:0!important;
    overflow:visible!important;
  }

  .ch301-app-layout-v2 .ch301-nav .ch301-nav-item,
  .ch301-app-layout-v2 .ch301-nav-scroll > .ch301-nav-item,
  .ch301-app-layout-v2 .ch301-nav-group-items > .ch301-nav-item{
    position:relative!important;
    inset:auto!important;
    float:none!important;
    width:62px!important;
    min-width:62px!important;
    max-width:62px!important;
    height:52px!important;
    min-height:52px!important;
    max-height:52px!important;
    flex:0 0 62px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:3px!important;
    padding:5px 4px!important;
    margin:0!important;
    border:1px solid transparent!important;
    border-radius:15px!important;
    background:transparent!important;
    color:#657084!important;
    box-shadow:none!important;
    transform:none!important;
    text-align:center!important;
    text-decoration:none!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
  }

  .ch301-app-layout-v2 .ch301-nav .ch301-nav-item:before,
  .ch301-app-layout-v2 .ch301-nav .ch301-nav-item:after{
    content:""!important;
    position:absolute!important;
    pointer-events:none!important;
    opacity:0!important;
    transform:none!important;
    background:#d71920!important;
    border:0!important;
    box-shadow:none!important;
  }
  .ch301-app-layout-v2 .ch301-nav .ch301-nav-item:before{
    top:5px!important;
    left:50%!important;
    width:5px!important;
    height:5px!important;
    border-radius:999px!important;
    transform:translateX(-50%)!important;
  }
  .ch301-app-layout-v2 .ch301-nav .ch301-nav-item:after{
    left:14px!important;
    right:14px!important;
    bottom:3px!important;
    height:2px!important;
    border-radius:999px!important;
  }

  .ch301-app-layout-v2 .ch301-nav .ch301-nav-icon,
  .ch301-app-layout-v2 .ch301-nav .ch301-nav-item .dashicons{
    width:21px!important;
    height:21px!important;
    min-width:21px!important;
    max-width:21px!important;
    flex:0 0 21px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    margin:0!important;
    color:currentColor!important;
    transform:none!important;
  }
  .ch301-app-layout-v2 .ch301-nav .ch301-nav-icon svg{
    width:20px!important;
    height:20px!important;
    display:block!important;
    stroke-width:1.85!important;
  }

  .ch301-app-layout-v2 .ch301-nav .ch301-nav-item span{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    text-align:center!important;
    font-size:9px!important;
    font-weight:800!important;
    line-height:1.05!important;
    letter-spacing:-.02em!important;
    color:inherit!important;
  }
  .ch301-app-layout-v2 .ch301-nav .ch301-nav-item[data-mobile-label] span{
    font-size:0!important;
    line-height:0!important;
  }
  .ch301-app-layout-v2 .ch301-nav .ch301-nav-item[data-mobile-label] span:after{
    content:attr(data-mobile-label)!important;
    display:block!important;
    width:100%!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    text-align:center!important;
    font-size:9px!important;
    font-weight:800!important;
    line-height:1.05!important;
    color:inherit!important;
  }

  .ch301-app-layout-v2 .ch301-nav .ch301-nav-item.is-active{
    color:#d71920!important;
    background:#fff7f7!important;
    border-color:rgba(215,25,32,.16)!important;
    box-shadow:none!important;
  }
  .ch301-app-layout-v2 .ch301-nav .ch301-nav-item.is-active:before,
  .ch301-app-layout-v2 .ch301-nav .ch301-nav-item.is-active:after{
    opacity:1!important;
  }
  .ch301-app-layout-v2 .ch301-nav .ch301-nav-item:hover,
  .ch301-app-layout-v2 .ch301-nav .ch301-nav-item:focus-visible{
    color:#202832!important;
    background:#f6f8fb!important;
    border-color:rgba(209,216,226,.75)!important;
    outline:none!important;
  }
}

@media(max-width:380px){
  .ch301-app-layout-v2 .ch301-nav{
    left:8px!important;
    right:8px!important;
    bottom:8px!important;
    height:66px!important;
    min-height:66px!important;
    max-height:66px!important;
    padding:7px 6px!important;
  }
  .ch301-app-layout-v2 .ch301-nav-scroll,
  .ch301-app-layout-v2 .ch301-nav-group-items{
    gap:5px!important;
  }
  .ch301-app-layout-v2 .ch301-nav .ch301-nav-item,
  .ch301-app-layout-v2 .ch301-nav-scroll > .ch301-nav-item,
  .ch301-app-layout-v2 .ch301-nav-group-items > .ch301-nav-item{
    width:58px!important;
    min-width:58px!important;
    max-width:58px!important;
    flex-basis:58px!important;
  }
}

/* v0.20.0 - Preproducción segura VERI*FACTU */
.nxp-vf-preproduction .nxp-vf-audit-summary{
  margin:16px 0;
  padding:12px 14px;
  border:1px solid var(--nxp-border, #dde5ee);
  border-left:4px solid var(--nxp-red, #e30613);
  border-radius:12px;
  background:#fff;
  color:var(--nxp-text, #1f2933);
}
.nxp-vf-preproduction .nxp-vf-checklist div small{
  display:block;
  margin-top:4px;
  color:var(--nxp-muted, #6b778c);
  font-weight:500;
}
.nxp-vf-schema-box,
.nxp-vf-cron-box{
  margin-top:18px;
  padding:16px;
  border:1px solid var(--nxp-border, #dde5ee);
  border-radius:14px;
  background:#f8fafc;
}
.nxp-vf-schema-box h4,
.nxp-vf-cron-box h4{
  margin:0 0 10px;
  color:var(--nxp-dark, #1f2933);
}
.nxp-vf-schema-box ul{
  margin:10px 0 0 18px;
}
.nxp-vf-schema-box li{
  margin-bottom:10px;
}
.nxp-vf-schema-box code,
.nxp-vf-cron-box code{
  display:inline-block;
  max-width:100%;
  padding:8px 10px;
  border-radius:10px;
  background:#fff;
  border:1px solid var(--nxp-border, #dde5ee);
  overflow:auto;
  white-space:nowrap;
}
@media (max-width: 768px){
  .nxp-vf-schema-box,
  .nxp-vf-cron-box{
    padding:12px;
  }
  .nxp-vf-cron-box code{
    display:block;
  }
}

/* v0.20.1 - XSD e incidencias VERI*FACTU */
.nxp-vf-kpis-compact{margin:16px 0 18px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));}
.nxp-vf-inline-form{margin:12px 0 18px;display:flex;gap:12px;align-items:center;flex-wrap:wrap;}
.nxp-vf-xsd-upload{margin-top:16px;padding:16px;border:1px solid #dbe4ee;border-radius:14px;background:#f8fafc;}
.nxp-vf-schema-box .nxp-vf-status{display:inline-flex;align-items:center;padding:4px 10px;border-radius:999px;font-weight:800;font-size:.82rem;}
.nxp-vf-status.is-warning{background:#fff7e6;color:#9a5b00;border:1px solid #ffe0a3;}
.nxp-vf-queue-panel h4,.nxp-vf-schema-box h4,.nxp-vf-cron-box h4{margin-top:18px;margin-bottom:10px;color:#111827;font-weight:900;}
.nxp-vf-preproduction .nxp-vf-actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:14px 0;}
@media(max-width:720px){.nxp-vf-preproduction .nxp-vf-actions,.nxp-vf-inline-form{display:block}.nxp-vf-preproduction .nxp-vf-actions form,.nxp-vf-inline-form form{margin-bottom:10px}.nxp-vf-preproduction .ch301-btn,.nxp-vf-queue-panel .ch301-btn{width:100%;}.nxp-vf-xsd-upload{padding:12px}.nxp-vf-kpis-compact{grid-template-columns:1fr;}}
