@media (max-width: 768px){
  html, body { overflow-x:hidden !important; max-width:100% !important; }
  .flex.items-center:not(.flex-col){ flex-wrap: wrap !important; }
  .flex > * { min-width:0 !important; }
  [class*="min-w-["] { min-width:0 !important; }
  table, thead, tbody, tr, td { display:block !important; width:auto !important; max-width:100% !important; }
  table thead { position:absolute !important; left:-9999px !important; top:-9999px !important; height:0 !important; overflow:hidden !important; }
  table tbody tr { border:1px solid rgba(128,128,128,.22) !important; border-radius:12px !important; margin:0 0 12px 0 !important; padding:4px 6px !important; box-shadow:0 1px 3px rgba(0,0,0,.05) !important; }
  table tbody td { display:flex !important; justify-content:space-between !important; align-items:center !important; gap:12px !important; padding:9px 12px !important; text-align:right !important; border:0 !important; border-bottom:1px solid rgba(128,128,128,.13) !important; white-space:normal !important; }
  table tbody td:last-child { border-bottom:0 !important; }
  table tbody td::before { content:attr(data-label); font-weight:700; opacity:.65; text-align:left; flex:0 0 40%; white-space:normal; font-size:.86em; }
  table tbody td[colspan]{ justify-content:center !important; text-align:center !important; }
  table tbody td[colspan]::before{ display:none !important; }
  table tbody td:empty { display:none !important; }
  .rounded-lg, .rounded-xl, .rounded-2xl, .shadow, .shadow-sm, .shadow-md, .card { max-width:100% !important; }
  input[type="text"], input[type="search"], input:not([type]) { min-width:0 !important; }
  button, a[role="button"] { min-height:40px; }
}

/* ===== TABLET / pantallas intermedias 769-1280px (fix 2026-06-13) =====
   El topbar (header shadcn de WorkDo) muestra el nombre de la empresa dentro de un boton
   con white-space:nowrap; ese bloque esta oculto en movil ("hidden md:flex") y reaparece
   desde 768px, pero NO se encogia -> desbordaba a la derecha en tablets (768=+30px, 1024=+114px).
   Aqui acotamos y truncamos SOLO ese bloque del header, en el rango intermedio.
   NO toca el rango movil (<=768) ni el desktop (>=1281) que ya funcionan. */
@media (min-width: 768px) and (max-width: 1280px){
  header { min-width: 0 !important; }
  header .flex.items-center { min-width: 0 !important; }
  header .flex-col.items-start { min-width: 0 !important; max-width: 40vw !important; overflow: hidden !important; }
  header .flex-col.items-start > * {
    max-width: 100% !important; display: block !important;
    overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important;
  }
}

/* ===== Identidad TuMarketSV en pantallas de acceso (login / registro / recuperar) =====
   Congruencia con Emitir. Scopeado por body.tmsv-auth (lo agrega tmsv-mobile.js solo en esas
   rutas guest). SOLO CSS: no toca el formulario ni el auth; el inicio de sesion sigue intacto. */
body.tmsv-auth::before{content:"";position:fixed;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,#6517d8,#ff6b00);z-index:99999;pointer-events:none}
body.tmsv-auth h1,body.tmsv-auth h2{font-family:"Fraunces",Georgia,"Palatino Linotype",serif !important;letter-spacing:-.01em}
body.tmsv-auth button[type=submit]{background:#6517d8 !important;background-image:none !important;border-color:#6517d8 !important;color:#fff !important}
body.tmsv-auth button[type=submit]:hover{filter:brightness(1.07)}
body.tmsv-auth input:focus,body.tmsv-auth input:focus-visible{border-color:#6517d8 !important;box-shadow:0 0 0 3px rgba(101,23,216,.16) !important;outline:none !important}
body.tmsv-auth input{border-radius:12px !important}
body.tmsv-auth .max-w-md.rounded-2xl{position:relative;overflow:hidden;border-color:#e9e6f3 !important;box-shadow:0 26px 64px -22px rgba(101,23,216,.34),0 2px 10px rgba(20,22,31,.06) !important}
body.tmsv-auth .max-w-md.rounded-2xl::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,#ff6b00,#6517d8 90px,#6517d81f);z-index:2}
body.tmsv-auth .max-w-md a{color:#6517d8 !important;font-weight:600}