/* =========================================================
   SPV V8 - MOBILE FIRST + LOGIN LIGERO + POS MOVIL
   Capa visual; no altera logica tributaria ni de venta.
   ========================================================= */

html, body { max-width:100%; overflow-x:hidden; }
img, video, canvas { max-width:100%; }
.table-responsive { -webkit-overflow-scrolling:touch; }

/* ---------- LOGIN: menos carga visual ---------- */
.container-login .company-network,
.container-login .security-tips,
.container-login .login-commercial-proof { display:none !important; }
.container-login .left-panel { justify-content:center; }
.container-login .hero-text { max-width:650px; }
.container-login .feature-pills { margin-bottom:8px; }
.container-login .login-form { max-height:none !important; }
.demo-login-card-v5 { margin-top:14px !important; }
.demo-login-card-v5 p { margin-bottom:9px !important; }

/* ---------- CABECERA / LAYOUT MOVIL ---------- */
@media (max-width: 767px) {
  body { padding-top:50px; background:#f7f7fb; }
  .main-header { position:fixed !important; top:0; left:0; right:0; height:50px; z-index:1040; }
  .main-header .logo {
    position:absolute !important; left:0; top:0; width:112px !important; height:50px !important;
    line-height:50px !important; padding:0 10px !important; text-align:left !important;
  }
  .main-header .logo .logo-lg { display:block !important; font-size:17px !important; white-space:nowrap; }
  .main-header .logo .logo-mini { display:none !important; }
  .main-header .navbar { margin-left:112px !important; min-height:50px !important; height:50px !important; }
  .main-header .navbar .btn-menup { min-width:42px; height:50px; margin:0 !important; border-radius:0 !important; }
  .main-header .btn-modo-sistema,
  .main-header .demo-header-badge,
  .main-header .demo-header-cta,
  .main-header .dia,
  .main-header .noche,
  .main-header #tipocambio { display:none !important; }
  .main-header .navbar-custom-menu { float:right !important; }
  .main-header .navbar-nav > li > a { height:50px !important; padding:11px 10px !important; }
  .main-header .user-menu .hidden-xs { display:none !important; }
  .main-header .user-menu .user-image { width:28px !important; height:28px !important; margin-top:0 !important; }
  .content-wrapper, .right-side, .main-footer { margin-left:0 !important; }
  .content-wrapper { min-height:calc(100vh - 50px) !important; }
  .content { padding:8px !important; }
  .box { margin-bottom:10px; }
  .box-body { padding:8px !important; }
  .modal-dialog { width:auto !important; margin:12px !important; }
  .select2-container { width:100% !important; }
  .form-control { font-size:16px !important; } /* evita zoom automatico en iPhone */

  /* Formularios de comprobantes: cada bloque ocupa todo el ancho */
  .formVenta .row { margin-left:-4px !important; margin-right:-4px !important; }
  .formVenta [class*="col-md-"],
  .formVenta [class*="col-lg-"],
  .formVenta [class*="col-sm-"] { padding-left:4px !important; padding-right:4px !important; }
  .formVenta .table-responsive { width:100%; margin-bottom:8px; border:0; }
  .formVenta table { min-width:680px; }
  .formVenta .tabla-totales { min-width:0 !important; }
  .formVenta .tabla-descuentos { min-width:0 !important; }
  .formVenta textarea { min-height:84px; }
  .formVenta .spv-scanbar-v78,
  .formVenta .spv-scanbar-v77 { gap:6px !important; flex-wrap:wrap !important; }
  .formVenta .spv-scanbar-v78__scanner,
  .formVenta .spv-scanbar-v77__scanner { width:100% !important; max-width:none !important; flex:1 1 100% !important; }
  .formVenta .spv-scanbar-v78__status,
  .formVenta .spv-scanbar-v77__status { order:2; }
  .formVenta .spv-mobile-camera-btn { order:3; }

  /* Boton flotante comercial: no tapa controles */
  .demo-floating-cta { right:10px !important; bottom:12px !important; transform:scale(.9); transform-origin:right bottom; }
}

/* ---------- LOGIN MOVIL: solo lo esencial ---------- */
@media (max-width: 640px) {
  body[data-ruta="login"] { padding-top:0; background:#f6f5fb; }
  .container-login.tikea-login {
    min-height:100svh !important; display:flex !important; align-items:flex-start !important; justify-content:center !important;
    padding:16px 12px 24px !important;
    background:linear-gradient(180deg,#f6f4ff 0%,#ffffff 52%,#fafafd 100%) !important;
  }
  .container-login .right-panel { min-height:auto !important; width:100%; padding:0 !important; }
  .container-login .login-form {
    max-width:430px !important; width:100% !important; margin:0 auto !important;
    padding:20px 16px 16px !important; border-radius:20px !important;
    background:#fff !important; border:1px solid #e7e4f4 !important;
    box-shadow:0 14px 40px rgba(54,45,115,.10) !important; color:#2a2740 !important;
  }
  .container-login .form-glow-line { display:none !important; }
  .mobile-brand { margin-bottom:12px !important; }
  .mobile-brand-logo { width:54px !important; height:54px !important; }
  .mobile-brand strong { color:#332e59 !important; }
  .mobile-brand small { color:#817a9e !important; }
  .login-form .login-header { text-align:left !important; margin-bottom:14px !important; }
  .login-form .login-header h1 { color:#25213f !important; font-size:1.35rem !important; }
  .container-login .form-group label { color:#5b5673 !important; }
  .right-panel input[type="text"], .right-panel input[type="password"], .right-panel select {
    color:#2d2948 !important; background:#faf9fe !important; border:1px solid #dcd7ef !important;
    height:48px !important; border-radius:12px !important;
  }
  .right-panel input::placeholder { color:#aaa4be !important; opacity:1; }
  .container-login .form-control-icon { color:#7668dc !important; }
  .right-panel .login-button { min-height:49px !important; border-radius:12px !important; margin-top:4px !important; }
  .demo-login-card-v5 {
    margin-top:12px !important; padding:12px !important; border-radius:14px !important;
    background:#f7f5ff !important; border:1px solid #e4defd !important;
  }
  .demo-login-card-v5 p,
  .demo-login-mini-benefits,
  .demo-login-credentials,
  .demo-login-card-v5 small { display:none !important; }
  .demo-login-title { margin-bottom:8px !important; }
  .demo-login-button { min-height:44px !important; }
  .demo-login-sales-link { margin-top:7px !important; min-height:40px; }
  .login-orb, .login-grid { display:none !important; }
}

/* ---------- POS: experiencia movil real ---------- */
.spv-pos-mobile-tabs { display:none; }
@media (max-width: 767px) {
  body[data-ruta="pos"] { padding-top:0 !important; background:#f6f5fb; }
  body[data-ruta="pos"] .main-header,
  body[data-ruta="pos"] .main-sidebar,
  body[data-ruta="pos"] .demo-floating-cta { display:none !important; }
  body[data-ruta="pos"] .content-wrapper { margin:0 !important; min-height:100vh !important; }
  .pos-contenedoorg { padding:0 !important; }
  .pos-contenedor-fluido { height:auto !important; min-height:100vh !important; overflow:visible !important; padding:0 6px 76px !important; }
  .rounded-pos { margin:0 !important; border:0 !important; box-shadow:none !important; border-radius:0 !important; }
  .rounded-pos > .box-body { padding:6px !important; }
  .inicio-pos { position:fixed !important; top:8px !important; left:8px !important; width:38px !important; height:38px !important; z-index:1002 !important; }
  .container-comprobants-pos {
    position:sticky !important; top:0 !important; z-index:1000 !important; width:calc(100% - 92px) !important; max-width:360px !important;
    height:42px !important; margin:0 auto 6px !important; border-radius:0 0 12px 12px !important; background:#fff !important;
    box-shadow:0 5px 18px rgba(56,45,121,.10) !important;
  }
  .container-comprobants-pos label { height:42px !important; line-height:42px !important; font-size:11px !important; border-radius:10px !important; }
  .super-contenedor-productos-pos,
  .super-contenedor-formulario-pos { width:100% !important; height:auto !important; max-height:none !important; overflow:visible !important; padding:0 !important; float:none !important; }
  .spv-pos-mobile-tabs {
    display:flex !important; position:fixed; left:8px; right:8px; bottom:8px; z-index:1050;
    padding:5px; gap:5px; border-radius:16px; background:rgba(255,255,255,.96); border:1px solid #ddd8f1;
    box-shadow:0 12px 34px rgba(43,35,100,.18); backdrop-filter:blur(10px);
  }
  .spv-pos-mobile-tabs button {
    flex:1; height:46px; border:0; border-radius:12px; background:#f3f1fb; color:#665e83;
    font-weight:800; font-size:13px;
  }
  .spv-pos-mobile-tabs button.is-active { background:#6456db; color:#fff; }
  .spv-pos-mobile-tabs .spv-pos-count {
    display:inline-flex; min-width:20px; height:20px; padding:0 6px; margin-left:4px; align-items:center; justify-content:center;
    border-radius:999px; background:rgba(255,255,255,.22); font-size:11px;
  }
  body.spv-pos-mobile-products .super-contenedor-formulario-pos { display:none !important; }
  body.spv-pos-mobile-sale .super-contenedor-productos-pos { display:none !important; }
  body.spv-pos-mobile-sale .super-contenedor-formulario-pos { display:block !important; }
  .caja-filtros .row > div > [class*="col-"] { width:100% !important; float:none !important; padding:0 3px !important; }
  .caja-filtros #selectnum { display:none !important; }
  .caja-filtros .col-md-2 { display:none !important; }
  .caja-filtros .col-md-3,
  .caja-filtros .col-md-7 { width:100% !important; }
  .caja-filtros .form-group { margin:4px 0 !important; }
  .productos-pos {
    grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:8px !important; padding:4px 0 0 !important; overflow:visible !important;
  }
  .productos-pos-venta { min-width:0 !important; border-radius:12px !important; overflow:hidden; }
  .productos-pos-venta img { max-height:110px !important; object-fit:contain !important; }
  .productos-pos-venta h4, .productos-pos-venta .descripcion-producto { font-size:11px !important; line-height:1.25 !important; }
  .productos-pos-venta .precio-producto, .productos-pos-venta .precio { font-size:16px !important; }
  .super-contenedor-formulario-pos { padding:0 2px !important; }
  #formVentaPos .box-body { padding:6px !important; }
  #formVentaPos [class*="col-md-"], #formVentaPos [class*="col-lg-"], #formVentaPos [class*="col-sm-"] { width:100% !important; float:none !important; padding-left:3px !important; padding-right:3px !important; }
  #formVentaPos .seccion-fechas-moneda-correlativo .col-xs-6 { width:50% !important; float:left !important; }
  #formVentaPos .scanner-pos-box {
    grid-template-columns:42px 1fr 44px !important; gap:6px !important; padding:7px !important; border-radius:12px !important;
  }
  #formVentaPos .scanner-pos-input-wrap label,
  #formVentaPos .scanner-pos-input-wrap small { display:none !important; }
  #formVentaPos .scanner-pos-status { grid-column:1 / 4 !important; justify-self:start !important; }
  #formVentaPos .items-c { overflow-x:auto !important; }
  #formVentaPos .tabla-items { min-width:650px !important; }
  #formVentaPos .tabla-totales { min-width:0 !important; }
  #formVentaPos .tabla-descuentos { min-width:0 !important; }
  .super-contenedor-herramientas-pos { right:6px !important; top:6px !important; }
}

@media (max-width: 390px) {
  .productos-pos { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  .productos-pos-venta img { max-height:92px !important; }
}

/* ---------- BOTON CAMARA / MODAL SCANNER ---------- */
.spv-mobile-camera-btn {
  display:inline-flex; align-items:center; justify-content:center; gap:7px; height:40px; padding:0 13px;
  border:1px solid #d9d3f5; border-radius:10px; background:#fff; color:#5f50d7; font-weight:800; font-size:12px;
  white-space:nowrap; box-shadow:none;
}
.spv-mobile-camera-btn:hover,.spv-mobile-camera-btn:focus { color:#4f42be; background:#f8f6ff; border-color:#c9c1f0; outline:none; }
#formVentaPos .spv-mobile-camera-btn { height:38px; }
@media (min-width: 768px) { .spv-mobile-camera-btn.spv-mobile-only { display:none !important; } }

.spv-mobile-scanner-modal {
  display:none; position:fixed; inset:0; z-index:20000; background:#11101a; color:#fff;
}
.spv-mobile-scanner-modal.is-open { display:flex; flex-direction:column; }
.spv-mobile-scanner-head { height:58px; display:flex; align-items:center; justify-content:space-between; padding:0 14px; background:#201b43; }
.spv-mobile-scanner-head strong { font-size:15px; }
.spv-mobile-scanner-close { width:40px; height:40px; border:0; border-radius:50%; background:rgba(255,255,255,.12); color:#fff; font-size:20px; }
.spv-mobile-scanner-stage { position:relative; flex:1; min-height:0; background:#000; overflow:hidden; }
.spv-mobile-scanner-stage video { width:100%; height:100%; object-fit:cover; background:#000; }
.spv-mobile-scanner-frame {
  position:absolute; left:8%; right:8%; top:50%; height:32%; transform:translateY(-50%); border:2px solid #8f82ff; border-radius:18px;
  box-shadow:0 0 0 9999px rgba(0,0,0,.35); pointer-events:none;
}
.spv-mobile-scanner-line { position:absolute; left:12%; right:12%; top:50%; height:2px; background:#8f82ff; box-shadow:0 0 14px #8f82ff; animation:spvScanLine 1.8s ease-in-out infinite; }
@keyframes spvScanLine { 0%,100%{ transform:translateY(-60px); opacity:.5 } 50%{ transform:translateY(60px); opacity:1 } }
.spv-mobile-scanner-foot { padding:12px 14px 18px; background:#201b43; text-align:center; }
.spv-mobile-scanner-foot p { margin:0 0 10px; color:#d9d4f2; font-size:13px; }
.spv-mobile-scanner-manual { width:100%; height:44px; border:1px solid #50468b; background:#2b2559; color:#fff; border-radius:12px; font-weight:700; }
@media (max-width: 767px) {
  #formVentaPos #btnEscanearPos { display:none !important; }
  #formVentaPos .spv-mobile-camera-btn {
    grid-column:3 !important; grid-row:1 !important; width:44px !important; min-width:44px !important; height:40px !important;
    padding:0 !important; border-radius:10px !important;
  }
  #formVentaPos .spv-mobile-camera-btn span { display:none !important; }
  #formVentaPos .scanner-pos-status { grid-row:2 !important; }
  .main-sidebar { padding-top:50px !important; }
  .sidebar-open .main-sidebar { box-shadow:10px 0 30px rgba(31,25,74,.18); }
  .dataTables_wrapper { max-width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .dataTables_wrapper table { min-width:720px; }
  .content-header { padding:10px 10px 4px !important; }
  .content-header h1 { font-size:20px !important; }
}
@media (max-width: 767px) {
  .spv-pos-mobile-tabs .spv-pos-scan-tab {
    flex:.9; background:#ece9ff; color:#5849cf; border:1px solid #d9d2ff;
  }
  .spv-pos-mobile-tabs .spv-pos-scan-tab i { margin-right:4px; }
}
/* Login V8: demo visible pero compacta */
.demo-login-mini-benefits { display:none !important; }
.demo-login-card-v5 p { font-size:12px !important; line-height:1.45 !important; margin-bottom:7px !important; }
@media (min-width: 641px) {
  .container-login .left-panel { padding-top:48px !important; padding-bottom:48px !important; }
  .container-login .right-panel { padding-top:34px !important; padding-bottom:34px !important; }
  .container-login .login-form { padding-top:28px !important; padding-bottom:24px !important; }
}
@media (max-width: 900px) and (min-width: 641px) {
  body[data-ruta="login"] { padding-top:0 !important; }
  .container-login.tikea-login { display:block !important; min-height:100vh !important; background:#f7f6fb !important; padding:24px 16px !important; }
  .container-login .left-panel { display:none !important; }
  .container-login .right-panel { min-height:auto !important; padding:0 !important; background:transparent !important; }
  .container-login .login-form { max-width:460px !important; margin:0 auto !important; }
  .mobile-brand { display:flex !important; }
}

@media (max-width: 767px) {
  .formVenta .spv-scanbar-v78,
  .formVenta .spv-scanbar-v77 {
    display:flex !important; align-items:center !important; width:100% !important; gap:6px !important;
  }
  .formVenta .spv-scanbar-v78__field,
  .formVenta .spv-scanbar-v77__scanner,
  .formVenta .spv-scanbar-v77__field {
    order:1 !important; flex:1 1 100% !important; width:100% !important; max-width:none !important;
  }
  .formVenta .spv-scanbar-v78__status,
  .formVenta .spv-scanbar-v77__status { order:2 !important; flex:0 0 auto !important; }
  .formVenta .spv-mobile-camera-btn { order:3 !important; flex:1 1 auto !important; }
  .formVenta .spv-scanbar-v78__btn--primary,
  .formVenta .spv-scanbar-v77__btn--primary { order:4 !important; flex:1 1 calc(50% - 3px) !important; min-width:0 !important; }
  .formVenta .spv-scanbar-v78__btn--secondary,
  .formVenta .spv-scanbar-v77__btn--secondary { order:5 !important; flex:1 1 calc(50% - 3px) !important; min-width:0 !important; }
  .formVenta .spv-scanbar-v78__btn span,
  .formVenta .spv-scanbar-v77__btn span { white-space:normal !important; line-height:1.15 !important; }
}

/* =========================================================
   SPV V8.1 - POS MOVIL USABLE
   Corrige tarjetas comprimidas en pantallas tactiles.
   ========================================================= */
@media (max-width: 767px) {
  body[data-ruta="pos"] .productos-pos {
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
    grid-auto-rows:auto !important;
    align-items:stretch !important;
    gap:10px !important;
    padding:6px 2px 92px !important;
  }

  body[data-ruta="pos"] .productos-pos .productos-pos-venta {
    display:flex !important;
    flex-direction:column !important;
    width:100% !important;
    min-width:0 !important;
    height:auto !important;
    min-height:268px !important;
    margin:0 !important;
    overflow:hidden !important;
    border:1px solid #e3dff2 !important;
    border-radius:14px !important;
    background:#fff !important;
    box-shadow:0 3px 12px rgba(54,45,115,.055) !important;
    transform:none !important;
  }

  body[data-ruta="pos"] .productos-pos .pos-img-wrapper {
    display:flex !important;
    position:relative !important;
    flex:0 0 112px !important;
    width:100% !important;
    height:112px !important;
    min-height:112px !important;
    align-items:center !important;
    justify-content:center !important;
    overflow:hidden !important;
    background:#fff !important;
    border-bottom:1px solid #f0edf7 !important;
  }

  body[data-ruta="pos"] .productos-pos .pos-img-wrapper .img-ps {
    display:block !important;
    width:100% !important;
    height:100% !important;
    max-height:none !important;
    padding:7px !important;
    margin:0 !important;
    object-fit:contain !important;
    opacity:1 !important;
    visibility:visible !important;
    transform:none !important;
  }

  /* En tactil no existe hover: el boton debe verse siempre */
  body[data-ruta="pos"] .productos-pos .btn-agregar-ps-pos {
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    position:absolute !important;
    left:8px !important;
    right:8px !important;
    bottom:7px !important;
    top:auto !important;
    width:auto !important;
    min-height:32px !important;
    padding:6px 8px !important;
    border-radius:9px !important;
    opacity:.96 !important;
    visibility:visible !important;
    transform:none !important;
    font-size:10px !important;
    line-height:1 !important;
    letter-spacing:.15px !important;
    white-space:nowrap !important;
    box-shadow:0 4px 11px rgba(76,61,190,.18) !important;
    z-index:8 !important;
    touch-action:manipulation !important;
  }
  body[data-ruta="pos"] .productos-pos .btn-agregar-ps-pos i {
    font-size:11px !important;
    margin-right:5px !important;
  }

  body[data-ruta="pos"] .productos-pos .pos-info-wrapper {
    display:flex !important;
    flex:1 1 auto !important;
    flex-direction:column !important;
    justify-content:flex-start !important;
    min-height:118px !important;
    padding:10px 10px 9px !important;
    background:#fff !important;
  }

  body[data-ruta="pos"] .productos-pos .descripcion-pos {
    display:-webkit-box !important;
    -webkit-box-orient:vertical !important;
    -webkit-line-clamp:2 !important;
    height:34px !important;
    min-height:34px !important;
    margin:0 0 7px !important;
    overflow:hidden !important;
    color:#2f2c43 !important;
    font-size:12px !important;
    line-height:17px !important;
    font-weight:750 !important;
    text-transform:none !important;
  }

  body[data-ruta="pos"] .productos-pos .precio-uni-pos {
    display:block !important;
    margin:0 0 8px !important;
    min-height:23px !important;
  }
  body[data-ruta="pos"] .productos-pos .precio-unitario,
  body[data-ruta="pos"] .productos-pos .precio-unitario span {
    display:inline !important;
    color:#6354d8 !important;
    font-size:15px !important;
    line-height:22px !important;
    font-weight:850 !important;
  }

  body[data-ruta="pos"] .productos-pos .btn-mas-menos {
    display:block !important;
    width:100% !important;
    margin-top:auto !important;
  }
  body[data-ruta="pos"] .productos-pos .btn-mas-menos .input-group {
    display:flex !important;
    width:100% !important;
    height:36px !important;
    align-items:center !important;
    overflow:hidden !important;
    border:1px solid #e1dcf4 !important;
    border-radius:9px !important;
    background:#f8f6ff !important;
  }
  body[data-ruta="pos"] .productos-pos .btn-pos-menos,
  body[data-ruta="pos"] .productos-pos .btn-pos-mas,
  body[data-ruta="pos"] .productos-pos .btn-pos-menos-disabled,
  body[data-ruta="pos"] .productos-pos .btn-pos-mas-disabled {
    display:flex !important;
    flex:0 0 38px !important;
    width:38px !important;
    height:34px !important;
    padding:0 !important;
    align-items:center !important;
    justify-content:center !important;
    border-radius:0 !important;
    color:#6556d9 !important;
    touch-action:manipulation !important;
  }
  body[data-ruta="pos"] .productos-pos .cantidad-number {
    display:block !important;
    flex:1 1 auto !important;
    min-width:0 !important;
    height:34px !important;
    font-size:14px !important;
  }

  /* Footer de mantenimiento: conservar ICBPER; ocultar edicion/foto en venta movil */
  body[data-ruta="pos"] .productos-pos .formFotoPos {
    display:block !important;
    flex:0 0 32px !important;
    min-height:32px !important;
    margin:0 !important;
    background:#fbfaff !important;
    border-top:1px solid #f0edf7 !important;
  }
  body[data-ruta="pos"] .productos-pos .contenedor-menu-pos {
    display:flex !important;
    height:32px !important;
    min-height:32px !important;
    padding:4px 8px !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:6px !important;
  }
  body[data-ruta="pos"] .productos-pos .contenedor-menu-pos .foto-pos,
  body[data-ruta="pos"] .productos-pos .contenedor-menu-pos .edit-pos {
    display:none !important;
  }
  body[data-ruta="pos"] .productos-pos .switch-custom {
    margin:0 !important;
    transform:scale(.78) !important;
    transform-origin:left center !important;
  }

  body[data-ruta="pos"] .paginador-pos {
    padding:12px 0 16px !important;
  }
  body[data-ruta="pos"] .paginador-pos .pagination > li > a,
  body[data-ruta="pos"] .paginador-pos .pagination > li > span {
    min-width:38px !important;
    padding:8px 11px !important;
    text-align:center !important;
  }
}

@media (max-width: 359px) {
  body[data-ruta="pos"] .productos-pos { gap:7px !important; }
  body[data-ruta="pos"] .productos-pos .productos-pos-venta { min-height:250px !important; }
  body[data-ruta="pos"] .productos-pos .pos-img-wrapper { flex-basis:96px !important; height:96px !important; min-height:96px !important; }
  body[data-ruta="pos"] .productos-pos .descripcion-pos { font-size:11px !important; }
  body[data-ruta="pos"] .productos-pos .precio-unitario,
  body[data-ruta="pos"] .productos-pos .precio-unitario span { font-size:14px !important; }
}